@navikt/ds-tokens - npm Package Compare versions

Comparing version 0.2.1 to 0.3.0

dist/tokens.js

 /**
  * Do not edit directly
- * Generated on Thu, 20 May 2021 08:08:20 GMT
+ * Generated on Wed, 02 Jun 2021 08:59:15 GMT
  */
@@ -103,3 +103,3 @@
 export const NavdsColorBackground = "#ffffff";
-export const NavdsColorTextPrimary = "#262626";
+export const NavdsColorTextPrimary = {"value":"#262626","original":{"value":"#262626"},"name":"NavdsColorGray90","attributes":{"category":"navds","type":"color","item":"gray","subitem":"90"},"path":["navds","color","gray","90"]};
 export const NavdsColorTextInverse = "#ffffff";
@@ -123,19 +123,29 @@ export const NavdsColorTextDisabled = "#6A6A6A";
 export const NavdsFontFamily = "\"Source Sans Pro\", Arial, sans-serif";
-export const NavdsFontSizeHeadingXxl = "2.5rem";
-export const NavdsFontSizeHeadingXl = "2rem";
-export const NavdsFontSizeHeadingLarge = "1.5rem";
-export const NavdsFontSizeHeadingMedium = "1.25rem";
-export const NavdsFontSizeHeadingSmall = "1.125rem";
-export const NavdsFontSizeLarge = "1.25rem";
-export const NavdsFontSizeMedium = "1.125rem";
-export const NavdsFontSizeSmall = "1rem";
-export const NavdsFontSizeXs = "0.875rem";
-export const NavdsFontSizeArticleLead = "1.25rem";
-export const NavdsFontSizeArticleParagraph = "1.125rem";
+export const NavdsFontLineHeight2Xl = "3.25rem";
+export const NavdsFontLineHeightXl = "2.5rem";
+export const NavdsFontLineHeightL = "2.25rem";
+export const NavdsFontLineHeightM = "2rem";
+export const NavdsFontLineHeightS = "1.75rem";
+export const NavdsFontLineHeightXs = "1.5rem";
+export const NavdsFontLineHeight2Xs = "1.25rem";
+export const NavdsFontSizeTitle2Xl = "2.5rem";
+export const NavdsFontSizeTitleXl = "2rem";
+export const NavdsFontSizeTitleL = "1.75rem";
+export const NavdsFontSizeTitleM = "1.5rem";
+export const NavdsFontSizeTitleS = "1.25rem";
+export const NavdsFontSizeXl = "1.25rem";
+export const NavdsFontSizeL = "1.125rem";
+export const NavdsFontSizeM = "1rem";
+export const NavdsFontSizeS = "0.875rem";
+export const NavdsFontSpacing3Xl = "2.5rem";
+export const NavdsFontSpacing2Xl = "2.25rem";
+export const NavdsFontSpacingXl = "2rem";
+export const NavdsFontSpacingL = "1.75rem";
+export const NavdsFontSpacingM = "1.5rem";
+export const NavdsFontSpacingS = "1.25rem";
+export const NavdsFontSpacingXs = "1rem";
+export const NavdsFontSpacing2Xs = "0.75rem";
+export const NavdsFontSpacing3Xs = "0.5rem";
 export const NavdsFontWeightBold = "600";
 export const NavdsFontWeightRegular = "400";
-export const NavdsFontLineHeightLarge = "1.625rem";
-export const NavdsFontLineHeightMedium = "1.5rem";
-export const NavdsFontLineHeightSmall = "1.375rem";
-export const NavdsFontLineHeightXs = "1.25rem";
 export const NavdsShadowFocus = "0 0 0 3px #00347D";
@@ -142,0 +152,0 @@ export const NavdsShadowFocusOnDark = "0 0 0 3px #FFAA33";

package.json

 {
   "name": "@navikt/ds-tokens",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "private": false,
@@ -20,5 +20,6 @@ "description": "Auto-generated design-tokens for NAV design-systems framework",
   "scripts": {
-    "build": "style-dictionary build",
+    "build": "node ./build.js",
     "watch": "nodemon --watch src/index.js --exec \"yarn build\"",
-    "token": "style-dictionary build"
+    "token": "style-dictionary build",
+    "test": "jest"
   },
@@ -33,5 +34,6 @@ "repository": {
     "nodemon": "^2.0.6",
-    "style-dictionary": "^2.10.2"
-  },
-  "gitHead": "efc45667b020b74bde01590a8df3cb16d61899ae"
+    "style-dictionary": "^2.10.2",
+    "lodash": "^4.17.21",
+    "jest": "^26.6.3"
+  }
 }

src/index.js

 const Color = require("color");
 
+const baseFontSize = 16;
+
+const getFontSize = (size) => `${size / baseFontSize}rem`;
 // https://github.com/hihayk/scale/blob/69b766bba2db046d3e8cb4026ae32a32c897f9ff/src/utils.js#L44
@@ -95,3 +98,3 @@ const mixColors = (color, step, amount, mixColor) => {
       text: {
-        primary: { value: "{navds.color.darkgray.value}" },
+        primary: { value: "{navds.color.gray.90}" },
         inverse: { value: "{navds.color.white.value}" },
@@ -138,19 +141,37 @@ disabled: { value: "{navds.color.gray.60.value}" },
       family: { value: '"Source Sans Pro", Arial, sans-serif' },
+      line: {
+        height: {
+          "2xl": { value: getFontSize(52) },
+          xl: { value: getFontSize(40) },
+          l: { value: getFontSize(36) },
+          m: { value: getFontSize(32) },
+          s: { value: getFontSize(28) },
+          xs: { value: getFontSize(24) },
+          "2xs": { value: getFontSize(20) },
+        },
+      },
       size: {
-        heading: {
-          xxl: { value: "2.5rem" },
-          xl: { value: "2rem" },
-          large: { value: "1.5rem" },
-          medium: { value: "1.25rem" },
-          small: { value: "1.125rem" },
+        title: {
+          "2xl": { value: getFontSize(40) },
+          xl: { value: getFontSize(32) },
+          l: { value: getFontSize(28) },
+          m: { value: getFontSize(24) },
+          s: { value: getFontSize(20) },
         },
-        large: { value: "1.25rem" },
-        medium: { value: "1.125rem" },
-        small: { value: "1rem" },
-        xs: { value: "0.875rem" },
-        article: {
-          lead: { value: "1.25rem" },
-          paragraph: { value: "1.125rem" },
-        },
+        xl: { value: getFontSize(20) },
+        l: { value: getFontSize(18) },
+        m: { value: getFontSize(16) },
+        s: { value: getFontSize(14) },
       },
+      spacing: {
+        "3xl": { value: getFontSize(40) },
+        "2xl": { value: getFontSize(36) },
+        xl: { value: getFontSize(32) },
+        l: { value: getFontSize(28) },
+        m: { value: getFontSize(24) },
+        s: { value: getFontSize(20) },
+        xs: { value: getFontSize(16) },
+        "2xs": { value: getFontSize(12) },
+        "3xs": { value: getFontSize(8) },
+      },
       weight: {
@@ -160,10 +181,2 @@ bold: { value: "600" },
       },
-      line: {
-        height: {
-          large: { value: "1.625rem" },
-          medium: { value: "1.5rem" },
-          small: { value: "1.375rem" },
-          xs: { value: "1.25rem" },
-        },
-      },
     },
@@ -170,0 +183,0 @@ shadow: {

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

110062

increased by4.53%

Lines of code

3801

increased by6.8%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

5

increased by66.67%

Number of package files

7

decreased by-12.5%

No dependency changes