vcc-ui - npm Package Compare versions

Comparing version 3.7.0 to 3.8.0

dist/components/link/index.d.ts

 import React, { AnchorHTMLAttributes, ReactNode } from 'react';
 export declare type LinkProps = {
+    /** @default 'primary' */
+    intent?: 'primary' | 'destructive';
     arrow?: 'up' | 'down' | 'right' | 'left' | null;
@@ -8,2 +10,4 @@ children?: ReactNode;
 export declare const Link: React.ForwardRefExoticComponent<{
+    /** @default 'primary' */
+    intent?: "primary" | "destructive" | undefined;
     arrow?: "left" | "right" | "up" | "down" | null | undefined;
@@ -10,0 +14,0 @@ children?: ReactNode;

dist/components/link/index.js

@@ -75,2 +75,3 @@ "use strict";
     arrow,
+    intent = 'primary',
     ...props
@@ -94,2 +95,3 @@ } = _ref3;
   const arrowPath = arrows[resolveArrow || 'right'];
+  const color = intent === 'destructive' ? theme.tokens.linkDestructiveForeground : theme.tokens.linkForeground;
   return /*#__PURE__*/_react.default.createElement(_click.Click, (0, _extends2.default)({
@@ -108,5 +110,5 @@ ref: ref,
       textTransform: 'uppercase',
-      color: theme.tokens.linkForeground,
-      stroke: theme.tokens.linkForeground,
-      outlineColor: theme.tokens.linkForeground,
+      color,
+      stroke: color,
+      outlineColor: color,
       outlineOffset: '0.25em',
@@ -122,3 +124,3 @@ extend: [{
           '@media (hover: hover)': {
-            ':hover': {
+            ':hover:not(:active)': {
               color: theme.tokens.linkHoverForeground,
@@ -128,2 +130,7 @@ stroke: theme.tokens.linkHoverForeground,
             }
+          },
+          ':active': {
+            color: theme.tokens.linkActiveForeground,
+            stroke: theme.tokens.linkActiveForeground,
+            outlineColor: theme.tokens.linkActiveForeground
           }
@@ -155,2 +162,3 @@ }
   children: _propTypes.default.node,
+  intent: _propTypes.default.oneOf(['primary', 'destructive']),
   href: _propTypes.default.string,
@@ -157,0 +165,0 @@ arrow: _propTypes.default.oneOf(['up', 'down', 'right', 'left', null]),

dist/esm/components/link/index.js

@@ -66,2 +66,3 @@ import _extends from "@babel/runtime/helpers/extends";
     arrow,
+    intent = 'primary',
     ...props
@@ -85,2 +86,3 @@ } = _ref3;
   const arrowPath = arrows[resolveArrow || 'right'];
+  const color = intent === 'destructive' ? theme.tokens.linkDestructiveForeground : theme.tokens.linkForeground;
   return /*#__PURE__*/React.createElement(Click, _extends({
@@ -99,5 +101,5 @@ ref: ref,
       textTransform: 'uppercase',
-      color: theme.tokens.linkForeground,
-      stroke: theme.tokens.linkForeground,
-      outlineColor: theme.tokens.linkForeground,
+      color,
+      stroke: color,
+      outlineColor: color,
       outlineOffset: '0.25em',
@@ -113,3 +115,3 @@ extend: [{
           '@media (hover: hover)': {
-            ':hover': {
+            ':hover:not(:active)': {
               color: theme.tokens.linkHoverForeground,
@@ -119,2 +121,7 @@ stroke: theme.tokens.linkHoverForeground,
             }
+          },
+          ':active': {
+            color: theme.tokens.linkActiveForeground,
+            stroke: theme.tokens.linkActiveForeground,
+            outlineColor: theme.tokens.linkActiveForeground
           }
@@ -145,2 +152,3 @@ }
   children: PropTypes.node,
+  intent: PropTypes.oneOf(['primary', 'destructive']),
   href: PropTypes.string,
@@ -147,0 +155,0 @@ arrow: PropTypes.oneOf(['up', 'down', 'right', 'left', null]),

dist/esm/themes/getTokens.js

@@ -11,2 +11,3 @@ export function getTokens(color) {
     buttonDestructiveColor: color.foreground.alert,
+    linkDestructiveForeground: color.foreground.alert,
     inputForeground: color.foreground.primary,
@@ -39,3 +40,3 @@ inputDisabledBorder: color.primitive.grey300,
       linkHoverForeground: color.foreground.secondary,
-      linkActiveForeground: color.foreground.secondary,
+      linkActiveForeground: color.foreground.primary,
       inputDisabledForeground: color.primitive.grey400,
@@ -66,3 +67,5 @@ // unused
     linkHoverForeground: color.foreground.primary,
+    // TODO: Remove in next breaking change update, different token name between light and dark themes
     linkPressForeground: color.foreground.secondary,
+    linkActiveForeground: color.foreground.secondary,
     inputDisabledForeground: color.primitive.grey300,
@@ -69,0 +72,0 @@ // unused

dist/themes/getTokens.d.ts

@@ -30,2 +30,3 @@ import { CurrentTheme } from '../types/shared';
     buttonDestructiveColor: string;
+    linkDestructiveForeground: string;
     inputForeground: string;
@@ -52,2 +53,3 @@ inputDisabledBorder: string;
     linkPressForeground: string;
+    linkActiveForeground: string;
     inputDisabledForeground: string;
@@ -67,2 +69,3 @@ inputDisabledControl: string;
     buttonDestructiveColor: string;
+    linkDestructiveForeground: string;
     inputForeground: string;
@@ -69,0 +72,0 @@ inputDisabledBorder: string;

dist/themes/getTokens.js

@@ -17,2 +17,3 @@ "use strict";
     buttonDestructiveColor: color.foreground.alert,
+    linkDestructiveForeground: color.foreground.alert,
     inputForeground: color.foreground.primary,
@@ -45,3 +46,3 @@ inputDisabledBorder: color.primitive.grey300,
       linkHoverForeground: color.foreground.secondary,
-      linkActiveForeground: color.foreground.secondary,
+      linkActiveForeground: color.foreground.primary,
       inputDisabledForeground: color.primitive.grey400,
@@ -72,3 +73,5 @@ // unused
     linkHoverForeground: color.foreground.primary,
+    // TODO: Remove in next breaking change update, different token name between light and dark themes
     linkPressForeground: color.foreground.secondary,
+    linkActiveForeground: color.foreground.secondary,
     inputDisabledForeground: color.primitive.grey300,
@@ -75,0 +78,0 @@ // unused

package.json

 {
   "name": "vcc-ui",
-  "version": "3.7.0",
+  "version": "3.8.0",
   "license": "UNLICENSED",
@@ -5,0 +5,0 @@ "description": "A React library for building user interfaces at Volvo Cars",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

532000

increased by0.26%

Lines of code

15319

increased by0.19%

No dependency changes