@postenbring/hedwig-tokens - npm Package Compare versions

Comparing version 0.0.0-WE96Ccxa-accordion-component-20231127085047 to 0.0.0-add-breakpoint-tokens-20240111143107

package.json

 {
   "name": "@postenbring/hedwig-tokens",
-  "version": "0.0.0-WE96Ccxa-accordion-component-20231127085047",
+  "version": "0.0.0-add-breakpoint-tokens-20240111143107",
   "sideEffects": false,
   "license": "MIT",
   "files": [
-    "assets/**",
     "tokens-output/**",
-    "tailwind.config.js"
+    "tailwind.config.cjs",
+    "tailwind.config.d.cts"
   ],
   "devDependencies": {
-    "@types/node": "20.9.4",
-    "eslint": "^8.53.0",
-    "eslint-config-custom": "0.0.0-WE96Ccxa-accordion-component-20231127085047",
-    "style-dictionary": "3.9.0",
-    "style-dictionary-utils": "2.0.4",
-    "tailwindcss": "3.3.5",
-    "tsx": "4.4.0",
-    "typescript": "^5.2.2",
+    "@types/node": "20.10.7",
+    "color2k": "2.0.3",
+    "eslint": "^8.56.0",
+    "eslint-config-custom": "*",
+    "style-dictionary": "3.9.1",
+    "style-dictionary-utils": "2.0.7",
+    "tailwindcss": "3.4.1",
+    "tsx": "4.7.0",
+    "typescript": "^5.3.3",
     "hedwig-tsconfig": "0.0.0"
@@ -27,7 +28,7 @@ },
     "build": "node --import tsx build.ts",
-    "dev": "node --import tsx --watch-path lib --watch-path tokens-source --watch-path build.ts --watch build.ts",
+    "dev": "node --import tsx --watch-preserve-output --watch-path lib --watch-path tokens-source --watch-path build.ts --watch build.ts",
     "lint": "eslint \"*.ts*\"",
     "typecheck": "tsc --noEmit",
-    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
+    "clean": "rm -rf .turbo node_modules dist"
   }
 }

tokens-output/tokens.d.ts

@@ -36,2 +36,10 @@ export const PostenColorsSignatureRed : "#e32d22";
 export const DarkModeColorsAsh : "#999999";
+/** Larger mobile phones */
+export const BreakpointSmall : "460px";
+/** Most tablets */
+export const BreakpointMedium : "720px";
+/** Smaller laptops and desktop monitors. This is where the navbar goes from the mobile version to the desktop version */
+export const BreakpointLarge : "940px";
+/** Most modern laptops and desktop monitors */
+export const BreakpointXlarge : "1200px";
 export const SpacingSmall1 : "4px";
@@ -50,2 +58,3 @@ export const SpacingSmall2 : "8px";
 export const SpacingLarge5 : "160px";
+export const FontsPostenSans : string[];
 export const FontsPostenSansBold : string[];
@@ -78,2 +87,9 @@ export const FontsPostenSansMedium : string[];
 export const MicroAnimationEasingNormal : number[];
+export const MicroAnimationDurationQuick : "0.130s";
+export const MicroAnimationDurationNormal : "0.300s";
+export const MicroAnimationDurationSlow : "0.700s";
+export const Opacity7 : ".07";
+export const Opacity10 : ".1";
+export const Opacity20 : ".2";
+export const Opacity50 : ".5";
 export const FontSizePostenH1Display : string[];
@@ -167,12 +183,17 @@ export const FontSizePostenH1DisplayMin : "40px";
 export const LineHeightCaptionTitle : "18px";
-export const MicroAnimationDurationQuick : "0.130s";
-export const MicroAnimationDurationNormal : "0.300s";
-export const MicroAnimationDurationSlow : "0.700s";
-export const BreakpointsSmall : "460px";
-export const BreakpointsMedium : "720px";
-export const BreakpointsLarge : "940px";
-export const BreakpointsXlarge : "1200px";
-export const Opacity7 : ".07";
-export const Opacity10 : ".1";
-export const Opacity20 : ".2";
-export const Opacity50 : ".5";
+export const FontWeightPostenH1Display : number;
+export const FontWeightPostenH1 : number;
+export const FontWeightPostenH2 : number;
+export const FontWeightBringH1Display : number;
+export const FontWeightBringH1 : number;
+export const FontWeightBringH2 : number;
+export const FontWeightHeaderH3 : number;
+export const FontWeightHeaderH3Title : number;
+export const FontWeightBody : number;
+export const FontWeightBodyTitle : number;
+export const FontWeightBodySmall : number;
+export const FontWeightBodySmallTitle : number;
+export const FontWeightTechnical : number;
+export const FontWeightTechnicalTitle : number;
+export const FontWeightCaption : number;
+export const FontWeightCaptionTitle : number;

tokens-output/tw-tokens.json

 {
   "posten-colors": {
-    "type": "color",
+    "$type": "color",
     "signature-red": "#e32d22",
@@ -13,3 +13,3 @@ "darker-red": "#4a1011",
   "bring-colors": {
-    "type": "color",
+    "$type": "color",
     "signature-green": "#7bc144",
@@ -24,3 +24,3 @@ "darker-green": "#002f19",
   "ui-colors": {
-    "type": "color",
+    "$type": "color",
     "black": "#000000",
@@ -39,3 +39,3 @@ "dark-grey": "#6e6e6e",
   "dark-mode-colors": {
-    "type": "color",
+    "$type": "color",
     "obsidian": "#121212",
@@ -47,4 +47,11 @@ "coal": "#252525",
   },
+  "breakpoint": {
+    "$type": "dimension",
+    "small": "460px",
+    "medium": "720px",
+    "large": "940px",
+    "xlarge": "1200px"
+  },
   "spacing": {
-    "type": "dimension",
+    "$type": "dimension",
     "small-1": "4px",
@@ -65,3 +72,8 @@ "small-2": "8px",
   "fonts": {
-    "type": "fontFamily",
+    "$type": "fontFamily",
+    "posten-sans": [
+      "Posten Sans",
+      "Arial",
+      "sans-serif"
+    ],
     "posten-sans-bold": [
@@ -89,6 +101,6 @@ "Posten Sans Bold",
   "typography": {
-    "type": "typography",
+    "$type": "typography",
     "posten-h1-display": {
       "fontFamily": [
-        "Posten Sans Bold",
+        "Posten Sans",
         "Arial",
@@ -105,3 +117,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 700,
       "letterSpacing": "0"
@@ -111,3 +123,3 @@ },
       "fontFamily": [
-        "Posten Sans Bold",
+        "Posten Sans",
         "Arial",
@@ -124,3 +136,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 700,
       "letterSpacing": "0"
@@ -130,3 +142,3 @@ },
       "fontFamily": [
-        "Posten Sans Medium",
+        "Posten Sans",
         "Arial",
@@ -143,3 +155,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 500,
       "letterSpacing": "0"
@@ -149,3 +161,3 @@ },
       "fontFamily": [
-        "Posten Sans Light",
+        "Posten Sans",
         "Arial",
@@ -162,3 +174,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 300,
       "letterSpacing": "0"
@@ -168,3 +180,3 @@ },
       "fontFamily": [
-        "Posten Sans Light",
+        "Posten Sans",
         "Arial",
@@ -181,3 +193,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 300,
       "letterSpacing": "0"
@@ -187,3 +199,3 @@ },
       "fontFamily": [
-        "Posten Sans Regular",
+        "Posten Sans",
         "Arial",
@@ -205,3 +217,3 @@ "sans-serif"
       "fontFamily": [
-        "Posten Sans Regular",
+        "Posten Sans",
         "Arial",
@@ -223,3 +235,3 @@ "sans-serif"
       "fontFamily": [
-        "Posten Sans Medium",
+        "Posten Sans",
         "Arial",
@@ -236,3 +248,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 500,
       "letterSpacing": "0"
@@ -242,3 +254,3 @@ },
       "fontFamily": [
-        "Posten Sans Regular",
+        "Posten Sans",
         "Arial",
@@ -260,3 +272,3 @@ "sans-serif"
       "fontFamily": [
-        "Posten Sans Medium",
+        "Posten Sans",
         "Arial",
@@ -273,3 +285,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 500,
       "letterSpacing": "0"
@@ -279,3 +291,3 @@ },
       "fontFamily": [
-        "Posten Sans Regular",
+        "Posten Sans",
         "Arial",
@@ -297,3 +309,3 @@ "sans-serif"
       "fontFamily": [
-        "Posten Sans Medium",
+        "Posten Sans",
         "Arial",
@@ -310,3 +322,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 500,
       "letterSpacing": "0"
@@ -316,3 +328,3 @@ },
       "fontFamily": [
-        "Posten Sans Regular",
+        "Posten Sans",
         "Arial",
@@ -334,3 +346,3 @@ "sans-serif"
       "fontFamily": [
-        "Posten Sans Medium",
+        "Posten Sans",
         "Arial",
@@ -347,3 +359,3 @@ "sans-serif"
       ],
-      "fontWeight": 400,
+      "fontWeight": 500,
       "letterSpacing": "0"
@@ -353,3 +365,3 @@ },
       "fontFamily": [
-        "Posten Sans Regular",
+        "Posten Sans",
         "Arial",
@@ -365,3 +377,3 @@ "sans-serif"
       "fontFamily": [
-        "Posten Sans Medium",
+        "Posten Sans",
         "Arial",
@@ -372,3 +384,3 @@ "sans-serif"
       "lineHeight": "18px",
-      "fontWeight": 400,
+      "fontWeight": 500,
       "letterSpacing": "0"
@@ -387,44 +399,56 @@ }
   },
+  "micro-animation-duration": {
+    "$type": "time",
+    "quick": "0.130s",
+    "normal": "0.300s",
+    "slow": "0.700s"
+  },
+  "opacity": {
+    "7": ".07",
+    "10": ".1",
+    "20": ".2",
+    "50": ".5"
+  },
   "font-size": {
     "type": "dimension",
-    "posten-h1-display": "calc(40px + (72 - 40) * ((100vw - 300px) / (1200 - 300)))",
+    "posten-h1-display": "clamp(40px,calc(40px + (72 - 40) * ((100vw - 300px) / (1200 - 300))),72px)",
     "posten-h1-display-min": "40px",
     "posten-h1-display-max": "72px",
-    "posten-h1": "calc(32px + (48 - 32) * ((100vw - 300px) / (1200 - 300)))",
+    "posten-h1": "clamp(32px,calc(32px + (48 - 32) * ((100vw - 300px) / (1200 - 300))),48px)",
     "posten-h1-min": "32px",
     "posten-h1-max": "48px",
-    "posten-h2": "calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300)))",
+    "posten-h2": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)",
     "posten-h2-min": "28px",
     "posten-h2-max": "32px",
-    "bring-h1-display": "calc(40px + (72 - 40) * ((100vw - 300px) / (1200 - 300)))",
+    "bring-h1-display": "clamp(40px,calc(40px + (72 - 40) * ((100vw - 300px) / (1200 - 300))),72px)",
     "bring-h1-display-min": "40px",
     "bring-h1-display-max": "72px",
-    "bring-h1": "calc(32px + (48 - 32) * ((100vw - 300px) / (1200 - 300)))",
+    "bring-h1": "clamp(32px,calc(32px + (48 - 32) * ((100vw - 300px) / (1200 - 300))),48px)",
     "bring-h1-min": "32px",
     "bring-h1-max": "48px",
-    "bring-h2": "calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300)))",
+    "bring-h2": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)",
     "bring-h2-min": "28px",
     "bring-h2-max": "32px",
-    "header-h3": "calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300)))",
+    "header-h3": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)",
     "header-h3-min": "22px",
     "header-h3-max": "24px",
-    "header-h3-title": "calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300)))",
+    "header-h3-title": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)",
     "header-h3-title-min": "22px",
     "header-h3-title-max": "24px",
-    "body": "calc(18px + (20 - 18) * ((100vw - 300px) / (1200 - 300)))",
+    "body": "clamp(18px,calc(18px + (20 - 18) * ((100vw - 300px) / (1200 - 300))),20px)",
     "body-min": "18px",
     "body-max": "20px",
-    "body title": "calc(18px + (20 - 18) * ((100vw - 300px) / (1200 - 300)))",
+    "body title": "clamp(18px,calc(18px + (20 - 18) * ((100vw - 300px) / (1200 - 300))),20px)",
     "body title-min": "18px",
     "body title-max": "20px",
-    "body small": "calc(16px + (18 - 16) * ((100vw - 300px) / (1200 - 300)))",
+    "body small": "clamp(16px,calc(16px + (18 - 16) * ((100vw - 300px) / (1200 - 300))),18px)",
     "body small-min": "16px",
     "body small-max": "18px",
-    "body small title": "calc(16px + (18 - 16) * ((100vw - 300px) / (1200 - 300)))",
+    "body small title": "clamp(16px,calc(16px + (18 - 16) * ((100vw - 300px) / (1200 - 300))),18px)",
     "body small title-min": "16px",
     "body small title-max": "18px",
-    "technical": "calc(14px + (16 - 14) * ((100vw - 300px) / (1200 - 300)))",
+    "technical": "clamp(14px,calc(14px + (16 - 14) * ((100vw - 300px) / (1200 - 300))),16px)",
     "technical-min": "14px",
     "technical-max": "16px",
-    "technical title": "calc(14px + (16 - 14) * ((100vw - 300px) / (1200 - 300)))",
+    "technical title": "clamp(14px,calc(14px + (16 - 14) * ((100vw - 300px) / (1200 - 300))),16px)",
     "technical title-min": "14px",
@@ -437,42 +461,42 @@ "technical title-max": "16px",
     "type": "dimension",
-    "posten-h1-display": "calc(56px + (80 - 56) * ((100vw - 300px) / (1200 - 300)))",
+    "posten-h1-display": "clamp(56px,calc(56px + (80 - 56) * ((100vw - 300px) / (1200 - 300))),80px)",
     "posten-h1-display-min": "56px",
     "posten-h1-display-max": "80px",
-    "posten-h1": "calc(40px + (56 - 40) * ((100vw - 300px) / (1200 - 300)))",
+    "posten-h1": "clamp(40px,calc(40px + (56 - 40) * ((100vw - 300px) / (1200 - 300))),56px)",
     "posten-h1-min": "40px",
     "posten-h1-max": "56px",
-    "posten-h2": "calc(36px + (40 - 36) * ((100vw - 300px) / (1200 - 300)))",
+    "posten-h2": "clamp(36px,calc(36px + (40 - 36) * ((100vw - 300px) / (1200 - 300))),40px)",
     "posten-h2-min": "36px",
     "posten-h2-max": "40px",
-    "bring-h1-display": "calc(56px + (80 - 56) * ((100vw - 300px) / (1200 - 300)))",
+    "bring-h1-display": "clamp(56px,calc(56px + (80 - 56) * ((100vw - 300px) / (1200 - 300))),80px)",
     "bring-h1-display-min": "56px",
     "bring-h1-display-max": "80px",
-    "bring-h1": "calc(40px + (56 - 40) * ((100vw - 300px) / (1200 - 300)))",
+    "bring-h1": "clamp(40px,calc(40px + (56 - 40) * ((100vw - 300px) / (1200 - 300))),56px)",
     "bring-h1-min": "40px",
     "bring-h1-max": "56px",
-    "bring-h2": "calc(36px + (40 - 36) * ((100vw - 300px) / (1200 - 300)))",
+    "bring-h2": "clamp(36px,calc(36px + (40 - 36) * ((100vw - 300px) / (1200 - 300))),40px)",
     "bring-h2-min": "36px",
     "bring-h2-max": "40px",
-    "header-h3": "calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300)))",
+    "header-h3": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)",
     "header-h3-min": "28px",
     "header-h3-max": "32px",
-    "header-h3-title": "calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300)))",
+    "header-h3-title": "clamp(28px,calc(28px + (32 - 28) * ((100vw - 300px) / (1200 - 300))),32px)",
     "header-h3-title-min": "28px",
     "header-h3-title-max": "32px",
-    "body": "calc(26px + (28 - 26) * ((100vw - 300px) / (1200 - 300)))",
+    "body": "clamp(26px,calc(26px + (28 - 26) * ((100vw - 300px) / (1200 - 300))),28px)",
     "body-min": "26px",
     "body-max": "28px",
-    "body title": "calc(26px + (28 - 26) * ((100vw - 300px) / (1200 - 300)))",
+    "body title": "clamp(26px,calc(26px + (28 - 26) * ((100vw - 300px) / (1200 - 300))),28px)",
     "body title-min": "26px",
     "body title-max": "28px",
-    "body small": "calc(24px + (26 - 24) * ((100vw - 300px) / (1200 - 300)))",
+    "body small": "clamp(24px,calc(24px + (26 - 24) * ((100vw - 300px) / (1200 - 300))),26px)",
     "body small-min": "24px",
     "body small-max": "26px",
-    "body small title": "calc(24px + (26 - 24) * ((100vw - 300px) / (1200 - 300)))",
+    "body small title": "clamp(24px,calc(24px + (26 - 24) * ((100vw - 300px) / (1200 - 300))),26px)",
     "body small title-min": "24px",
     "body small title-max": "26px",
-    "technical": "calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300)))",
+    "technical": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)",
     "technical-min": "22px",
     "technical-max": "24px",
-    "technical title": "calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300)))",
+    "technical title": "clamp(22px,calc(22px + (24 - 22) * ((100vw - 300px) / (1200 - 300))),24px)",
     "technical title-min": "22px",
@@ -483,23 +507,21 @@ "technical title-max": "24px",
   },
-  "$description1": "Tokens manually added that are not from an Figma Export",
-  "$description2": "Here we can add missing tokens under development",
-  "micro-animation-duration": {
-    "type": "time",
-    "quick": "0.130s",
-    "normal": "0.300s",
-    "slow": "0.700s"
-  },
-  "breakpoints": {
-    "type": "dimension",
-    "small": "460px",
-    "medium": "720px",
-    "large": "940px",
-    "xlarge": "1200px"
-  },
-  "opacity": {
-    "7": ".07",
-    "10": ".1",
-    "20": ".2",
-    "50": ".5"
+  "font-weight": {
+    "type": "number",
+    "posten-h1-display": 700,
+    "posten-h1": 700,
+    "posten-h2": 500,
+    "bring-h1-display": 300,
+    "bring-h1": 300,
+    "bring-h2": 400,
+    "header-h3": 400,
+    "header-h3-title": 500,
+    "body": 400,
+    "body title": 500,
+    "body small": 400,
+    "body small title": 500,
+    "technical": 400,
+    "technical title": 500,
+    "caption": 400,
+    "caption title": 500
   }
 }

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

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 20 instances in 1 package

Improved metrics

Lines of code

1566

increased by15.23%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

75742

decreased by-92.42%

Dev dependency count

10

increased by11.11%

Number of package files

10

decreased by-65.52%

No dependency changes