@digdir/designsystemet 1.0.0-next.48 → 1.0.0-next.49

package/dist/bin/config.d.ts

@@ -9,58 +9,58 @@ export declare const configFileSchema: z.ZodObject<{
     clean: z.ZodOptional<z.ZodBoolean>;
     themes: z.ZodRecord<z.ZodString, z.ZodObject<{
         colors: z.ZodObject<{
-            main: z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`, string>>;
-            support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`, string>>>>;
-            neutral: z.ZodEffects<z.ZodString, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`, string>;
+            main: z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}`, string>>;
+            support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}`, string>>>>;
+            neutral: z.ZodEffects<z.ZodString, `#${string}`, string>;
         }, "strip", z.ZodTypeAny, {
-            main: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
-            neutral: `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`;
-            support: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
+            main: Record<string, `#${string}`>;
+            neutral: `#${string}`;
+            support: Record<string, `#${string}`>;
         }, {
             main: Record<string, string>;
             neutral: string;
             support?: Record<string, string> | undefined;
         }>;
-        typography: z.ZodObject<{
+        typography: z.ZodOptional<z.ZodObject<{
             fontFamily: z.ZodString;
         }, "strip", z.ZodTypeAny, {
             fontFamily: string;
         }, {
             fontFamily: string;
-        }>;
-        borderRadius: z.ZodNumber;
+        }>>;
+        borderRadius: z.ZodOptional<z.ZodNumber>;
     }, "strip", z.ZodTypeAny, {
         colors: {
-            main: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
-            neutral: `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`;
-            support: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
+            main: Record<string, `#${string}`>;
+            neutral: `#${string}`;
+            support: Record<string, `#${string}`>;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }, {
         colors: {
             main: Record<string, string>;
             neutral: string;
             support?: Record<string, string> | undefined;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }>>;
 }, "strip", z.ZodTypeAny, {
     themes: Record<string, {
         colors: {
-            main: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
-            neutral: `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`;
-            support: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
+            main: Record<string, `#${string}`>;
+            neutral: `#${string}`;
+            support: Record<string, `#${string}`>;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }>;
     clean?: boolean | undefined;
     outDir?: string | undefined;
@@ -71,10 +71,10 @@ export declare const configFileSchema: z.ZodObject<{
             neutral: string;
             support?: Record<string, string> | undefined;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }>;
     clean?: boolean | undefined;
     outDir?: string | undefined;
@@ -88,59 +88,59 @@ export declare const combinedConfigSchema: z.ZodObject<{
     clean: z.ZodBoolean;
     themes: z.ZodRecord<z.ZodString, z.ZodObject<{
         colors: z.ZodObject<{
-            main: z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`, string>>;
-            support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`, string>>>>;
-            neutral: z.ZodEffects<z.ZodString, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`, string>;
+            main: z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}`, string>>;
+            support: z.ZodDefault<z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodEffects<z.ZodString, `#${string}`, string>>>>;
+            neutral: z.ZodEffects<z.ZodString, `#${string}`, string>;
         }, "strip", z.ZodTypeAny, {
-            main: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
-            neutral: `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`;
-            support: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
+            main: Record<string, `#${string}`>;
+            neutral: `#${string}`;
+            support: Record<string, `#${string}`>;
         }, {
             main: Record<string, string>;
             neutral: string;
             support?: Record<string, string> | undefined;
         }>;
-        typography: z.ZodObject<{
+        typography: z.ZodOptional<z.ZodObject<{
             fontFamily: z.ZodString;
         }, "strip", z.ZodTypeAny, {
             fontFamily: string;
         }, {
             fontFamily: string;
-        }>;
-        borderRadius: z.ZodNumber;
+        }>>;
+        borderRadius: z.ZodOptional<z.ZodNumber>;
     }, "strip", z.ZodTypeAny, {
         colors: {
-            main: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
-            neutral: `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`;
-            support: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
+            main: Record<string, `#${string}`>;
+            neutral: `#${string}`;
+            support: Record<string, `#${string}`>;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }, {
         colors: {
             main: Record<string, string>;
             neutral: string;
             support?: Record<string, string> | undefined;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }>>;
 }, "strip", z.ZodTypeAny, {
     clean: boolean;
     themes: Record<string, {
         colors: {
-            main: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
-            neutral: `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`;
-            support: Record<string, `#${string}` | `rgb(${number} ${number} ${number})` | `hsl(${number}deg ${number}% ${number}%)` | `hsv(${number}deg ${number}% ${number}%)` | `hsluv(${number} ${number} ${number})` | `lab(${number}% ${number} ${number})` | `lch(${number}% ${number} ${number}deg)` | `oklab(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number}deg)` | `jab(${number}% ${number} ${number})` | `jch(${number}% ${number} ${number}deg)`>;
+            main: Record<string, `#${string}`>;
+            neutral: `#${string}`;
+            support: Record<string, `#${string}`>;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }>;
     outDir: string;
 }, {
@@ -151,10 +151,10 @@ export declare const combinedConfigSchema: z.ZodObject<{
             neutral: string;
             support?: Record<string, string> | undefined;
         };
-        typography: {
+        typography?: {
             fontFamily: string;
-        };
-        borderRadius: number;
+        } | undefined;
+        borderRadius?: number | undefined;
     }>;
     outDir: string;
 }>;

package/dist/bin/config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../bin/config.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAIxB,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,sBAQ5D;AAUD,eAAO,MAAM,UAAU,QAA2C,CAAC;AA6BnE;;GAEG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAO3B,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA8B,CAAC;AAChE,MAAM,MAAM,oBAAoB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC"}
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../bin/config.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAIxB,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,sBAQ5D;AAUD,eAAO,MAAM,UAAU,QAA2C,CAAC;AA+BnE;;GAEG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAO3B,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA8B,CAAC;AAChE,MAAM,MAAM,oBAAoB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC"}

package/dist/bin/config.js

@@ -35,8 +35,8 @@ const themeSchema = z.object(
         fontFamily: z.string({ description: "Sets the font-family for this theme" })
       },
       { description: "Defines the typography for a given theme" }
-    ),
-    borderRadius: z.number({ description: "Defines the border-radius for this theme" })
+    ).optional(),
+    borderRadius: z.number({ description: "Defines the border-radius for this theme" }).optional()
   },
   { description: "An object defining a theme. The property name holding the object becomes the theme name." }
 );

package/dist/bin/designsystemet.js

@@ -9,9 +9,10 @@ import { convertToHex } from "../src/colors/index.js";
 import migrations from "../src/migrations/index.js";
 import { buildTokens } from "../src/tokens/build.js";
 import { cliOptions, createTokens } from "../src/tokens/create.js";
+import { cleanDir } from "../src/tokens/utils.js";
 import { writeTokens } from "../src/tokens/write.js";
 import { combinedConfigSchema, configFileSchema, mapPathToOptionName } from "./config.js";
-import { getDefaultOrExplicitOption, getExplicitOptionOnly } from "./options.js";
+import { getDefaultOrExplicitOption } from "./options.js";
 program.name("designsystemet").description("CLI for working with Designsystemet").showHelpAfterError();
 function makeTokenCommands() {
   const tokenCmd = createCommand("tokens");
@@ -90,7 +91,7 @@ function makeTokenCommands() {
       themes: propsFromJson?.themes ? (
         // For each theme specified in the JSON config, we override the config values
         // with the explicitly set options from the CLI.
-        R.map((theme) => R.mergeDeepRight(theme, getThemeOptions(getExplicitOptionOnly)), propsFromJson.themes)
+        R.map((theme) => R.mergeDeepRight(theme, getThemeOptions(getDefaultOrExplicitOption)), propsFromJson.themes)
       ) : (
         // If there are no themes specified in the JSON config, we use both explicit
         // and default theme options from the CLI.
@@ -109,10 +110,13 @@ function makeTokenCommands() {
       process.exit(1);
     }
     console.log(`Creating tokens with configuration ${chalk.green(JSON.stringify(config, null, 2))}`);
+    if (config.clean) {
+      await cleanDir(config.outDir, opts.dry);
+    }
     for (const [name, themeWithoutName] of Object.entries(config.themes)) {
       const theme = { name, ...themeWithoutName };
       const tokens = createTokens(theme);
-      await writeTokens({ outDir: config.outDir, tokens, theme, dry: opts.dry, clean: config.clean });
+      await writeTokens({ outDir: config.outDir, tokens, theme, dry: opts.dry });
     }
   });
   return tokenCmd;

package/dist/config.schema.json

@@ -65,9 +65,7 @@
           }
         },
         "required": [
-          "colors",
-          "typography",
-          "borderRadius"
+          "colors"
         ],
         "additionalProperties": false,
         "description": "An object defining a theme. The property name holding the object becomes the theme name."

package/dist/src/colors/colorMetadata.d.ts

@@ -0,0 +1,4 @@
+import type { ColorMetadata, ColorNumber, CssColor, GlobalColors } from './types.js';
+export declare const baseColors: Record<GlobalColors, CssColor>;
+export declare const colorMetadata: Record<ColorNumber, ColorMetadata>;
+//# sourceMappingURL=colorMetadata.d.ts.map

package/dist/src/colors/colorMetadata.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"colorMetadata.d.ts","sourceRoot":"","sources":["../../../src/colors/colorMetadata.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAErF,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,YAAY,EAAE,QAAQ,CAMrD,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,WAAW,EAAE,aAAa,CAsLnD,CAAC"}

package/dist/src/colors/colorMetadata.js

@@ -0,0 +1,189 @@
+const baseColors = {
+  blue: "#0A71C0",
+  green: "#068718",
+  orange: "#EA9B1B",
+  purple: "#663299",
+  red: "#C01B1B"
+};
+const colorMetadata = {
+  1: {
+    name: "backgroundDefault",
+    group: "background",
+    displayName: "Background Default",
+    description: "Background Default er den mest n\xF8ytrale bakgrunnsfargen.",
+    luminance: {
+      light: 1,
+      dark: 0.011,
+      contrast: 1e-3
+    }
+  },
+  2: {
+    name: "backgroundTinted",
+    group: "background",
+    displayName: "Background Tinted",
+    description: "Background Tinted er en bakgrunnsfarge som har et hint av farge i seg.",
+    luminance: {
+      light: 0.9,
+      dark: 0.017,
+      contrast: 65e-4
+    }
+  },
+  3: {
+    name: "surfaceDefault",
+    group: "surface",
+    displayName: "Surface Default",
+    description: "Surface Default brukes p\xE5 flater som ligger opp\xE5 bakgrunnsfargene. Dette er den mest n\xF8ytrale surface fargen.",
+    luminance: {
+      light: 1,
+      dark: 0.025,
+      contrast: 0.015
+    }
+  },
+  4: {
+    name: "surfaceTinted",
+    group: "surface",
+    displayName: "Surface Tinted",
+    description: "Surface Tinted brukes p\xE5 flater som ligger opp\xE5 bakgrunnsfargene. Denne har et hint av farge i seg.",
+    luminance: {
+      light: 0.81,
+      dark: 0.035,
+      contrast: 0.015
+    }
+  },
+  5: {
+    name: "surfaceHover",
+    group: "surface",
+    displayName: "Surface Hover",
+    description: "Surface Hover brukes p\xE5 interaktive flater som ligger opp\xE5 bakgrunnsfargene i en hover state.",
+    luminance: {
+      light: 0.7,
+      dark: 0.044,
+      contrast: 0.028
+    }
+  },
+  6: {
+    name: "surfaceActive",
+    group: "surface",
+    displayName: "Surface Active",
+    description: "Surface Active brukes p\xE5 interaktive flater som ligger opp\xE5 bakgrunnsfargene i en active state.",
+    luminance: {
+      light: 0.6,
+      dark: 0.057,
+      contrast: 0.045
+    }
+  },
+  7: {
+    name: "borderSubtle",
+    group: "border",
+    displayName: "Border Subtle",
+    description: "Border Subtle er den lyseste border-fargen og brukes for \xE5 skille elementer fra hverandre.",
+    luminance: {
+      light: 0.5,
+      dark: 0.082,
+      contrast: 0.26
+    }
+  },
+  8: {
+    name: "borderDefault",
+    group: "border",
+    displayName: "Border Default",
+    description: "Border Default er en border-farge som brukes n\xE5r man \xF8nsker god kontrast mot bakgrunnsfargene.",
+    luminance: {
+      light: 0.21,
+      dark: 0.2,
+      contrast: 0.4
+    }
+  },
+  9: {
+    name: "borderStrong",
+    group: "border",
+    displayName: "Border Strong",
+    description: "Border Strong er den m\xF8rkeste border-fargen og brukes n\xE5r man \xF8nsker en veldig tydelig og sterk border.",
+    luminance: {
+      light: 0.12,
+      dark: 0.36,
+      contrast: 0.6
+    }
+  },
+  10: {
+    name: "textSubtle",
+    group: "text",
+    displayName: "Text Subtle",
+    description: "Text Subtle er den lyseste tekstfargen og brukes p\xE5 tekst som skal v\xE6re litt mindre synlig eller for \xE5 skape variasjon i typografien.",
+    luminance: {
+      light: 0.12,
+      dark: 0.36,
+      contrast: 0.57
+    }
+  },
+  11: {
+    name: "textDefault",
+    group: "text",
+    displayName: "Text Default",
+    description: "Text Default er den m\xF8rkeste tekstfargen og brukes p\xE5 tekst som skal v\xE6re mest synlig. Denne fargen b\xF8r brukes p\xE5 mesteparten av teksten p\xE5 en side.",
+    luminance: {
+      light: 0.0245,
+      dark: 0.78,
+      contrast: 0.86
+    }
+  },
+  12: {
+    name: "baseDefault",
+    group: "base",
+    displayName: "Base Default",
+    description: "Base Default fargen f\xE5r den samme hex koden som fargen som er valgt i verkt\xF8yet. Brukes ofte som farge p\xE5 viktige elementer og p\xE5 flater som skal fange brukerens oppmerksomhet.",
+    luminance: {
+      light: 1,
+      dark: 1,
+      contrast: 1
+    }
+  },
+  13: {
+    name: "baseHover",
+    group: "base",
+    displayName: "Base Hover",
+    description: "Base Hover brukes som hover farge p\xE5 elementer som bruker Base Default fargen.",
+    luminance: {
+      light: 1,
+      dark: 1,
+      contrast: 1
+    }
+  },
+  14: {
+    name: "baseActive",
+    group: "base",
+    displayName: "Base Active",
+    description: "Base Active brukes som active farge p\xE5 elementer som bruker Base Default fargen.",
+    luminance: {
+      light: 1,
+      dark: 1,
+      contrast: 1
+    }
+  },
+  15: {
+    name: "contrastSubtle",
+    group: "base",
+    displayName: "Contrast Subtle",
+    description: "Contrast Subtle brukes som en viktig meningsb\xE6rende farge opp\xE5 Base Default fargen.",
+    luminance: {
+      light: 1,
+      dark: 1,
+      contrast: 1
+    }
+  },
+  16: {
+    name: "contrastDefault",
+    group: "base",
+    displayName: "Contrast Default",
+    description: "Contrast Default brukes som en viktig meningsb\xE6rende farge opp\xE5 alle Base fargane.",
+    luminance: {
+      light: 1,
+      dark: 1,
+      contrast: 1
+    }
+  }
+};
+export {
+  baseColors,
+  colorMetadata
+};

package/dist/src/colors/index.d.ts

@@ -1,4 +1,5 @@
 export * from './utils.js';
 export * from './theme.js';
 export * from './types.js';
+export * from './colorMetadata.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/src/colors/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/colors/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/colors/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC"}

package/dist/src/colors/index.js

@@ -1,3 +1,4 @@
 export * from "./utils.js";
 export * from "./theme.js";
 export * from "./types.js";
+export * from "./colorMetadata.js";

package/dist/src/colors/theme.d.ts

@@ -1,6 +1,5 @@
 import type { CssColor } from './types.js';
-import type { ColorInfo, ColorNumber, ColorScheme, GlobalColors, ThemeInfo } from './types.js';
-export declare const baseColors: Record<GlobalColors, CssColor>;
+import type { ColorInfo, ColorNumber, ColorScheme, ThemeInfo } from './types.js';
 /**
  * Generates a color scale based on a base color and a color mode.
  *
@@ -15,20 +14,15 @@ export declare const generateColorScale: (color: CssColor, colorScheme: ColorSch
  */
 export declare const generateColorSchemes: (color: CssColor) => ThemeInfo;
 /**
- * Creates the Base Contrast Default color
+ * Generates contrast color for given color
  *
- * @param baseColor The base color
+ * @param color color
+ * @param type 'default' | 'subtle'
  */
-export declare const getContrastDefault: (color: CssColor) => CssColor;
-/**
- * Creates the Base Contrast Subtle color
- *
- * @param color The base color
- */
-export declare const getContrastSubtle: (color: CssColor) => CssColor;
+export declare const generateColorContrast: (color: CssColor, type: "default" | "subtle") => CssColor;
 /**
  * Returns the css variable for a color.
- *
+ * TODO: deprecate this
  * @param colorType The type of color
  * @param colorNumber The number of the color
  */

package/dist/src/colors/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/colors/theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAI3C,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAG/F,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,YAAY,EAAE,QAAQ,CAOrD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,UAAW,QAAQ,eAAe,WAAW,KAAG,SAAS,EA8BvF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,UAAW,QAAQ,KAAG,SAIrD,CAAC;AAgCH;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,UAAW,QAAQ,KAAG,QAC2C,CAAC;AAEjG;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,UAAW,QAAQ,KAAG,QAQnD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,cAAe,MAAM,eAAe,WAAW,WAEzE,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/colors/theme.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAGjF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,UAAW,QAAQ,eAAe,WAAW,KAAG,SAAS,EAmBvF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,UAAW,QAAQ,KAAG,SAIrD,CAAC;AAgCH;;;;;GAKG;AACH,eAAO,MAAM,qBAAqB,UAAW,QAAQ,QAAQ,SAAS,GAAG,QAAQ,KAAG,QAgBnF,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,cAAe,MAAM,eAAe,WAAW,WAEzE,CAAC"}

package/dist/src/colors/theme.js

@@ -1,44 +1,30 @@
 import chroma from "chroma-js";
-import { luminance } from "./luminance.js";
-import { getColorNameFromNumber, getLightnessFromHex, getLuminanceFromLightness } from "./utils.js";
-const baseColors = {
-  blue: "#0A71C0",
-  green: "#068718",
-  orange: "#B8581D",
-  purple: "#663299",
-  red: "#C01B1B",
-  yellow: "#D4B12F"
-};
+import * as R from "ramda";
+import { colorMetadata } from "./colorMetadata.js";
+import { getColorInfoFromPosition, getLightnessFromHex, getLuminanceFromLightness } from "./utils.js";
 const generateColorScale = (color, colorScheme) => {
-  const baseColors2 = getBaseColors(color, colorScheme);
-  const luminanceValues = luminance[colorScheme];
-  const outputArray = Object.entries(luminanceValues).map(([key, value], index) => ({
-    name: key,
-    hex: chroma(color).luminance(value).hex(),
-    number: index + 1
-  }));
-  const specialColors = [
-    { hex: baseColors2.baseDefault, number: 9 },
-    { hex: baseColors2.baseHover, number: 10 },
-    { hex: baseColors2.baseActive, number: 11 },
-    { hex: getContrastDefault(baseColors2.baseDefault), number: 14 },
-    { hex: getContrastSubtle(baseColors2.baseDefault), number: 15 }
-  ];
-  for (const { hex, number } of specialColors) {
-    outputArray[number - 1] = {
-      hex,
-      number,
-      name: getColorNameFromNumber(number)
+  const colors = R.mapObjIndexed((colorData, key) => {
+    const luminance = colorData.luminance[colorScheme];
+    return {
+      ...colorData,
+      hex: chroma(color).luminance(luminance).hex(),
+      number: parseInt(key)
     };
-  }
-  return outputArray;
+  }, colorMetadata);
+  const baseColors = generateBaseColors(color, colorScheme);
+  colors["12"] = { ...colors["12"], hex: baseColors.default };
+  colors["13"] = { ...colors["13"], hex: baseColors.hover };
+  colors["14"] = { ...colors["14"], hex: baseColors.active };
+  colors["15"] = { ...colors["15"], hex: generateColorContrast(baseColors.default, "subtle") };
+  colors["16"] = { ...colors["16"], hex: generateColorContrast(baseColors.default, "default") };
+  return Object.values(colors);
 };
 const generateColorSchemes = (color) => ({
   light: generateColorScale(color, "light"),
   dark: generateColorScale(color, "dark"),
   contrast: generateColorScale(color, "contrast")
 });
-const getBaseColors = (color, colorScheme) => {
+const generateBaseColors = (color, colorScheme) => {
   let colorLightness = getLightnessFromHex(color);
   if (colorScheme !== "light") {
     colorLightness = colorLightness <= 30 ? 70 : 100 - colorLightness;
@@ -46,28 +32,31 @@ const getBaseColors = (color, colorScheme) => {
   const modifier = colorLightness <= 30 || colorLightness >= 49 && colorLightness <= 65 ? -8 : 8;
   const calculateLightness = (base, mod) => base - mod;
   return {
-    baseDefault: colorScheme === "light" ? color : chroma(color).luminance(getLuminanceFromLightness(colorLightness)).hex(),
-    baseHover: chroma(color).luminance(getLuminanceFromLightness(calculateLightness(colorLightness, modifier))).hex(),
-    baseActive: chroma(color).luminance(getLuminanceFromLightness(calculateLightness(colorLightness, modifier * 2))).hex()
+    default: colorScheme === "light" ? color : chroma(color).luminance(getLuminanceFromLightness(colorLightness)).hex(),
+    hover: chroma(color).luminance(getLuminanceFromLightness(calculateLightness(colorLightness, modifier))).hex(),
+    active: chroma(color).luminance(getLuminanceFromLightness(calculateLightness(colorLightness, modifier * 2))).hex()
   };
 };
-const getContrastDefault = (color) => chroma.contrast(color, "#ffffff") >= chroma.contrast(color, "#000000") ? "#ffffff" : "#000000";
-const getContrastSubtle = (color) => {
-  const contrastWhite = chroma.contrast(color, "#ffffff");
-  const contrastBlack = chroma.contrast(color, "#000000");
-  const lightness = getLightnessFromHex(color);
-  const modifier = lightness <= 40 || lightness >= 60 ? 60 : 50;
-  const targetLightness = contrastWhite >= contrastBlack ? lightness + modifier : lightness - modifier;
-  return chroma(color).luminance(getLuminanceFromLightness(targetLightness)).hex();
+const generateColorContrast = (color, type) => {
+  if (type === "default") {
+    return chroma.contrast(color, "#ffffff") >= chroma.contrast(color, "#000000") ? "#ffffff" : "#000000";
+  }
+  if (type === "subtle") {
+    const contrastWhite = chroma.contrast(color, "#ffffff");
+    const contrastBlack = chroma.contrast(color, "#000000");
+    const lightness = getLightnessFromHex(color);
+    const modifier = lightness <= 40 || lightness >= 60 ? 60 : 50;
+    const targetLightness = contrastWhite >= contrastBlack ? lightness + modifier : lightness - modifier;
+    return chroma(color).luminance(getLuminanceFromLightness(targetLightness)).hex();
+  }
+  return color;
 };
 const getCssVariable = (colorType, colorNumber) => {
-  return `--ds-color-${colorType}-${getColorNameFromNumber(colorNumber).toLowerCase().replace(/\s/g, "-")}`;
+  return `--ds-color-${colorType}-${getColorInfoFromPosition(colorNumber).displayName.toLowerCase().replace(/\s/g, "-")}`;
 };
 export {
-  baseColors,
+  generateColorContrast,
   generateColorScale,
   generateColorSchemes,
-  getContrastDefault,
-  getContrastSubtle,
   getCssVariable
 };