@open-formulieren/design-tokens - npm Package Compare versions

Comparing version 0.13.0 to 0.14.0

dist/index.js

 /**
  * Do not edit directly
- * Generated on Thu, 10 Nov 2022 11:55:09 GMT
+ * Generated on Tue, 06 Dec 2022 11:41:05 GMT
  */
@@ -44,2 +44,4 @@
 export const ofButtonActiveColorBorder = "#5e5e5e";
+export const ofButtonFocusColorBorder = "#0177b2";
+export const ofButtonFocusVisibleColorBorder = "#0177b2";
 export const ofButtonAnchorHoverBg = "transparent";
@@ -50,2 +52,4 @@ export const ofButtonAnchorHoverColorBorder = "transparent";
 export const ofButtonAnchorActiveColorBorder = "transparent";
+export const ofButtonAnchorFocusColorBorder = "#0177b2";
+export const ofButtonAnchorFocusVisibleColorBorder = "#0177b2";
 export const ofButtonAnchorFg = "#01689B";
@@ -59,4 +63,6 @@ export const ofButtonAnchorBg = "transparent";
 export const ofButtonPrimaryActiveColorBorder = "#01537c";
+export const ofButtonPrimaryFocusColorBorder = "#000000";
+export const ofButtonPrimaryFocusVisibleColorBorder = "#000000";
 export const ofButtonPrimaryFg = "#ffffff";
-export const ofButtonPrimaryBg = "#0180be";
+export const ofButtonPrimaryBg = "#0177b2";
 export const ofButtonPrimaryColorBorder = "#01689B";
@@ -68,2 +74,4 @@ export const ofButtonDangerHoverBg = "#aa2218";
 export const ofButtonDangerActiveColorBorder = "#881b13";
+export const ofButtonDangerFocusColorBorder = "#000000";
+export const ofButtonDangerFocusVisibleColorBorder = "#000000";
 export const ofButtonDangerFg = "#fce9e8";
@@ -104,2 +112,3 @@ export const ofButtonDangerBg = "#D52B1E";
 export const utrechtButtonPaddingInlineEnd = "12px";
+export const utrechtButtonFocusBorderColor = "#0177b2";
 export const utrechtButtonHoverBackgroundColor = "#cccccc";
@@ -111,3 +120,3 @@ export const utrechtButtonHoverBorderColor = "rgba(0,0,0,0)";
 export const utrechtButtonActiveColor = "#000000";
-export const utrechtButtonPrimaryActionBackgroundColor = "#0180be";
+export const utrechtButtonPrimaryActionBackgroundColor = "#0177b2";
 export const utrechtButtonPrimaryActionBorderColor = "rgba(0,0,0,0)";
@@ -121,2 +130,3 @@ export const utrechtButtonPrimaryActionColor = "#ffffff";
 export const utrechtButtonPrimaryActionActiveColor = "#bfbfbf";
+export const utrechtButtonPrimaryActionFocusBorderColor = "#0177b2";
 export const utrechtButtonPrimaryActionDangerBackgroundColor = "#D52B1E";
@@ -123,0 +133,0 @@ export const utrechtButtonPrimaryActionDangerBorderColor = "rgba(0,0,0,0)";

package.json

 {
   "name": "@open-formulieren/design-tokens",
-  "version": "0.13.0",
+  "version": "0.14.0",
   "description": "Design tokens for Open Forms",
@@ -8,3 +8,5 @@ "scripts": {
     "build": "style-dictionary build -c style-dictionary.config.json",
-    "start": "chokidar --initial --command 'npm run build' 'src/**/*.tokens.json' 'src/**/tokens.json'"
+    "start": "chokidar --initial --command 'npm run build' 'src/**/*.tokens.json' 'src/**/tokens.json'",
+    "format": "prettier --write 'src/**/*'",
+    "checkformat": "prettier --check 'src/**/*'"
   },
@@ -39,4 +41,5 @@ "main": "dist/index.js",
     "chokidar-cli": "^3.0.0",
+    "prettier": "^2.8.0",
     "style-dictionary": "^3.7.0"
   }
 }

src/community/utrecht/button.tokens.json

@@ -18,2 +18,6 @@ {
 
+      "focus": {
+        "border-color": {"value": "#0177b2"}
+      },
+
       "hover": {
@@ -48,2 +52,6 @@ "background-color": {"value": "{of.button.hover.bg}"},
 
+        "focus": {
+          "border-color": {"value": "#0177b2"}
+        },
+
         "danger": {
@@ -50,0 +58,0 @@ "background-color": {"value": "{of.button.danger.bg}"},

src/components/buttons/button-modifiers.tokens.json

@@ -13,2 +13,8 @@ {
       },
+      "focus": {
+        "color-border": {"value": "#0177b2"}
+      },
+      "focus-visible": {
+        "color-border": {"value": "#0177b2"}
+      },
 
@@ -24,2 +30,8 @@ "anchor": {
           "color-border": {"value": "transparent"}
+        },
+        "focus": {
+          "color-border": {"value": "#0177b2"}
+        },
+        "focus-visible": {
+          "color-border": {"value": "#0177b2"}
         }
@@ -37,2 +49,8 @@ },
           "color-border": {"value": "#01537c"}
+        },
+        "focus": {
+          "color-border": {"value": "#000000"}
+        },
+        "focus-visible": {
+          "color-border": {"value": "#000000"}
         }
@@ -50,2 +68,8 @@ },
           "color-border": {"value": "#881b13"}
+        },
+        "focus": {
+          "color-border": {"value": "#000000"}
+        },
+        "focus-visible": {
+          "color-border": {"value": "#000000"}
         }
@@ -52,0 +76,0 @@ }

src/components/buttons/button.tokens.json

@@ -16,3 +16,3 @@ {
         "fg": {"value": "#ffffff"},
-        "bg": {"value": "#0180be"},
+        "bg": {"value": "#0177b2"},
         "color-border": {"value": "{of.color.primary}"}
@@ -19,0 +19,0 @@ },

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

166407

increased by6.38%

Lines of code

4377

increased by7.46%

Worsened metrics

Dev dependency count

4

increased by33.33%

No dependency changes