@navikt/ds-tokens 2.0.0-next.0 → 2.0.0

package/README.md

@@ -1,6 +1,8 @@
-# NAV tokens
+# Aksel tokens
 
-Design-tokens used when implementing @navikt/ds-css. This package is consumed by @navikt/ds-css at buildtime, so not needed separately for regular use of css-variables.
+Design-tokens for NAVs designsystem and used when implementing @navikt/ds-css.
+
+Node: This package is consumed by `@navikt/ds-css`, so not needed separately for regular use of css-variables.
 
 Formats
 
@@ -12,15 +14,8 @@ Formats
 
 ## Installation
 
-Install `@navikt/ds-tokens` with yarn
-
 ```bash
   yarn add @navikt/ds-tokens
-```
-
-Install `@navikt/ds-tokens` with npm
-
-```bash
   npm install @navikt/ds-tokens
 ```
 

package/dist/tokens-cjs.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 17 Nov 2022 18:26:45 GMT
+ * Generated on Mon, 21 Nov 2022 13:26:06 GMT
  */
 
 module.exports = {
@@ -162,7 +162,7 @@ module.exports = {
   "ATextVisited": "rgba(99, 70, 137, 1)",
   "ATextDanger": "rgba(195, 0, 0, 1)",
   "ATextActionSelected": "rgba(0, 91, 130, 1)",
-  "ATextActionHover": "rgba(0, 103, 197, 1)",
+  "ATextActionOnActionSubtle": "rgba(0, 86, 180, 1)",
   "ATextAction": "rgba(0, 103, 197, 1)",
   "ATextOnInverted": "rgba(255, 255, 255, 1)",
   "ATextOnNeutral": "rgba(255, 255, 255, 1)",
@@ -223,6 +223,7 @@ module.exports = {
   "AIconDefault": "rgba(38, 38, 38, 1)",
   "AIconSubtle": "rgba(112, 112, 112, 1)",
   "AIconActionSelected": "rgba(0, 91, 130, 1)",
+  "AIconActionOnActionSubtle": "rgba(0, 86, 180, 1)",
   "AIconAction": "rgba(0, 103, 197, 1)",
   "AIconSuccess": "rgba(6, 137, 58, 1)",
   "AIconDanger": "rgba(195, 0, 0, 1)",

package/dist/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 17 Nov 2022 18:26:45 GMT
+ * Generated on Mon, 21 Nov 2022 13:26:06 GMT
  */
 
 :root, :host {
@@ -176,6 +176,7 @@
   --a-icon-danger: var(--a-red-500);
   --a-icon-success: var(--a-green-500);
   --a-icon-action: var(--a-blue-500);
+  --a-icon-action-on-action-subtle: var(--a-blue-600);
   --a-icon-action-selected: var(--a-deepblue-500);
   --a-icon-subtle: var(--a-gray-600);
   --a-icon-default: var(--a-gray-900);
@@ -236,7 +237,7 @@
   --a-text-on-neutral: var(--a-white);
   --a-text-on-inverted: var(--a-white);
   --a-text-action: var(--a-blue-500);
-  --a-text-action-hover: var(--a-blue-500);
+  --a-text-action-on-action-subtle: var(--a-blue-600);
   --a-text-action-selected: var(--a-deepblue-500);
   --a-text-danger: var(--a-red-500);
   --a-text-visited: var(--a-purple-500);

package/dist/tokens.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 17 Nov 2022 18:26:45 GMT
+ * Generated on Mon, 21 Nov 2022 13:26:06 GMT
  */
 
 export const AFontFamily : string;
@@ -161,7 +161,7 @@ export const ATextSubtle : string;
 export const ATextVisited : string;
 export const ATextDanger : string;
 export const ATextActionSelected : string;
-export const ATextActionHover : string;
+export const ATextActionOnActionSubtle : string;
 export const ATextAction : string;
 export const ATextOnInverted : string;
 export const ATextOnNeutral : string;
@@ -222,6 +222,7 @@ export const ASurfaceAlt3 : string;
 export const AIconDefault : string;
 export const AIconSubtle : string;
 export const AIconActionSelected : string;
+export const AIconActionOnActionSubtle : string;
 export const AIconAction : string;
 export const AIconSuccess : string;
 export const AIconDanger : string;

package/dist/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 17 Nov 2022 18:26:45 GMT
+ * Generated on Mon, 21 Nov 2022 13:26:06 GMT
  */
 
 export const AFontFamily = "\"Source Sans Pro\", Arial, sans-serif";
@@ -161,7 +161,7 @@ export const ATextSubtle = "rgba(0, 0, 0, 0.56)";
 export const ATextVisited = "rgba(99, 70, 137, 1)";
 export const ATextDanger = "rgba(195, 0, 0, 1)";
 export const ATextActionSelected = "rgba(0, 91, 130, 1)";
-export const ATextActionHover = "rgba(0, 103, 197, 1)";
+export const ATextActionOnActionSubtle = "rgba(0, 86, 180, 1)";
 export const ATextAction = "rgba(0, 103, 197, 1)";
 export const ATextOnInverted = "rgba(255, 255, 255, 1)";
 export const ATextOnNeutral = "rgba(255, 255, 255, 1)";
@@ -222,6 +222,7 @@ export const ASurfaceAlt3 = "rgba(0, 91, 130, 1)";
 export const AIconDefault = "rgba(38, 38, 38, 1)";
 export const AIconSubtle = "rgba(112, 112, 112, 1)";
 export const AIconActionSelected = "rgba(0, 91, 130, 1)";
+export const AIconActionOnActionSubtle = "rgba(0, 86, 180, 1)";
 export const AIconAction = "rgba(0, 103, 197, 1)";
 export const AIconSuccess = "rgba(6, 137, 58, 1)";
 export const AIconDanger = "rgba(195, 0, 0, 1)";

package/dist/tokens.less

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 17 Nov 2022 18:26:45 GMT
+// Generated on Mon, 21 Nov 2022 13:26:06 GMT
 
 @a-font-family: "Source Sans Pro", Arial, sans-serif;
 @a-font-line-height-heading-2xlarge: 3.25rem;
@@ -160,7 +160,7 @@
 @a-text-visited: rgba(99, 70, 137, 1);
 @a-text-danger: rgba(195, 0, 0, 1);
 @a-text-action-selected: rgba(0, 91, 130, 1);
-@a-text-action-hover: rgba(0, 103, 197, 1);
+@a-text-action-on-action-subtle: rgba(0, 86, 180, 1);
 @a-text-action: rgba(0, 103, 197, 1);
 @a-text-on-inverted: rgba(255, 255, 255, 1);
 @a-text-on-neutral: rgba(255, 255, 255, 1);
@@ -221,6 +221,7 @@
 @a-icon-default: rgba(38, 38, 38, 1);
 @a-icon-subtle: rgba(112, 112, 112, 1);
 @a-icon-action-selected: rgba(0, 91, 130, 1);
+@a-icon-action-on-action-subtle: rgba(0, 86, 180, 1);
 @a-icon-action: rgba(0, 103, 197, 1);
 @a-icon-success: rgba(6, 137, 58, 1);
 @a-icon-danger: rgba(195, 0, 0, 1);

package/dist/tokens.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 17 Nov 2022 18:26:45 GMT
+// Generated on Mon, 21 Nov 2022 13:26:06 GMT
 
 $a-font-family: "Source Sans Pro", Arial, sans-serif;
 $a-font-line-height-heading-2xlarge: 3.25rem;
@@ -160,7 +160,7 @@ $a-text-subtle: rgba(0, 0, 0, 0.56);
 $a-text-visited: rgba(99, 70, 137, 1);
 $a-text-danger: rgba(195, 0, 0, 1);
 $a-text-action-selected: rgba(0, 91, 130, 1);
-$a-text-action-hover: rgba(0, 103, 197, 1);
+$a-text-action-on-action-subtle: rgba(0, 86, 180, 1);
 $a-text-action: rgba(0, 103, 197, 1);
 $a-text-on-inverted: rgba(255, 255, 255, 1);
 $a-text-on-neutral: rgba(255, 255, 255, 1);
@@ -221,6 +221,7 @@ $a-surface-alt-3: rgba(0, 91, 130, 1);
 $a-icon-default: rgba(38, 38, 38, 1);
 $a-icon-subtle: rgba(112, 112, 112, 1);
 $a-icon-action-selected: rgba(0, 91, 130, 1);
+$a-icon-action-on-action-subtle: rgba(0, 86, 180, 1);
 $a-icon-action: rgba(0, 103, 197, 1);
 $a-icon-success: rgba(6, 137, 58, 1);
 $a-icon-danger: rgba(195, 0, 0, 1);

package/docs.json

@@ -182,8 +182,11 @@
     { "name": "--a-text-visited", "value": "rgba(99, 70, 137, 1)" },
     { "name": "--a-text-danger", "value": "rgba(195, 0, 0, 1)" },
     { "name": "--a-text-action", "value": "rgba(0, 103, 197, 1)" },
-    { "name": "--a-text-action-hover", "value": "rgba(0, 103, 197, 1)" },
     { "name": "--a-text-action-selected", "value": "rgba(0, 91, 130, 1)" },
+    {
+      "name": "--a-text-action-on-action-subtle",
+      "value": "rgba(0, 86, 180, 1)"
+    },
     { "name": "--a-text-on-inverted", "value": "rgba(255, 255, 255, 1)" },
     { "name": "--a-text-on-neutral", "value": "rgba(255, 255, 255, 1)" },
     { "name": "--a-text-on-action", "value": "rgba(255, 255, 255, 1)" },
@@ -280,6 +283,10 @@
     { "name": "--a-icon-on-inverted", "value": "rgba(255, 255, 255, 1)" },
     { "name": "--a-icon-action", "value": "rgba(0, 103, 197, 1)" },
     { "name": "--a-icon-action-selected", "value": "rgba(0, 91, 130, 1)" },
+    {
+      "name": "--a-icon-action-on-action-subtle",
+      "value": "rgba(0, 86, 180, 1)"
+    },
     { "name": "--a-icon-on-action", "value": "rgba(255, 255, 255, 1)" },
     { "name": "--a-icon-success", "value": "rgba(6, 137, 58, 1)" },
     { "name": "--a-icon-on-success", "value": "rgba(255, 255, 255, 1)" },

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@navikt/ds-tokens",
-  "version": "2.0.0-next.0",
-  "description": "Auto-generated design-tokens for NAV design-systems framework",
-  "author": "NAV Designsystem team",
+  "version": "2.0.0",
+  "description": "Design-tokens for NAV designsystem",
+  "author": "Aksel | NAV designsystem team",
   "keywords": [
     "css",
     "less",
@@ -18,7 +18,7 @@
     "docs.json"
   ],
   "scripts": {
-    "build": "node ./config/build.js && yarn validate-docs",
+    "build": "node ./config/build.js > /dev/null && yarn validate-docs",
     "watch": "nodemon --watch src/index.js --exec \"yarn build\"",
     "token": "cd config && style-dictionary build",
     "test": "jest",

package/src/semantic-colors.json

@@ -17,8 +17,12 @@
         "selected": {
           "value": "{a.deepblue.500.value}"
         },
-        "hover": {
-          "value": "{a.blue.500.value}"
+        "on": {
+          "action": {
+            "subtle": {
+              "value": "{a.blue.600.value}"
+            }
+          }
         },
         "@": {
           "value": "{a.blue.500.value}"
@@ -263,6 +267,13 @@
       },
       "action": {
         "selected": { "value": "{a.deepblue.500.value}" },
+        "on": {
+          "action": {
+            "subtle": {
+              "value": "{a.blue.600.value}"
+            }
+          }
+        },
         "@": { "value": "{a.blue.500.value}" }
       },
       "success": {