@digdir/designsystemet 1.8.0 → 1.10.0

package/dist/src/index.js

@@ -1512,7 +1512,8 @@ var generateColorScheme = (themeName, colorScheme2, colors, overrides) => {
     (color, colorName) => generateColor(generateColorScale(color, colorScheme2), createColorOverrides(colorName)),
     colors.support
   );
-  const neutral = generateColor(generateColorScale(colors.neutral, colorScheme2), createColorOverrides("neutral"));
+  const neutralColorScale = generateColorScale(colors.neutral, colorScheme2);
+  const neutral = generateColor(neutralColorScale, createColorOverrides("neutral"));
   const baseColorsWithOverrides = {
     ...baseColors,
     ...overrides?.severity
@@ -1522,7 +1523,12 @@ var generateColorScheme = (themeName, colorScheme2, colors, overrides) => {
     baseColorsWithOverrides
   );
   const linkColor = generateColor(generateColorScale(dsLinkColor, colorScheme2));
+  const defaultLinkVisited = linkColor[12];
   const linkOverride = overrides?.linkVisited?.[colorScheme2] ? { $type: "color", $value: overrides.linkVisited[colorScheme2] } : void 0;
+  const defaultFocusInner = neutralColorScale[0].hex;
+  const defaultFocusOuter = neutralColorScale[10].hex;
+  const focusInnerOverride = overrides?.focus?.inner?.[colorScheme2];
+  const focusOuterOverride = overrides?.focus?.outer?.[colorScheme2];
   return {
     [themeName]: {
       ...main,
@@ -1530,7 +1536,17 @@ var generateColorScheme = (themeName, colorScheme2, colors, overrides) => {
       neutral,
       ...globalColors,
       link: {
-        visited: linkOverride || linkColor[12]
+        visited: linkOverride || defaultLinkVisited
+      },
+      focus: {
+        inner: {
+          $type: "color",
+          $value: focusInnerOverride || defaultFocusInner
+        },
+        outer: {
+          $type: "color",
+          $value: focusOuterOverride || defaultFocusOuter
+        }
       }
     }
   };
@@ -1545,11 +1561,11 @@ var color_base_template_default = {
     focus: {
       inner: {
         $type: "color",
-        $value: "{color.neutral.background-default}"
+        $value: "{color.focus.inner-color}"
       },
       outer: {
         $type: "color",
-        $value: "{color.neutral.text-default}"
+        $value: "{color.focus.outer-color}"
       }
     }
   },
@@ -1905,6 +1921,16 @@ var generateTheme = (colors, themeName, borderRadius) => {
           $type: "color",
           $value: `{${themeName}.link.visited}`
         }
+      },
+      focus: {
+        "inner-color": {
+          $type: "color",
+          $value: `{${themeName}.focus.inner}`
+        },
+        "outer-color": {
+          $type: "color",
+          $value: `{${themeName}.focus.outer}`
+        }
       }
     },
     ...remainingThemeFile
@@ -2040,10 +2066,21 @@ var linkVisitedOverrideSchema = z.object({
   light: colorSchema.optional().describe("A hex color that overrides light mode"),
   dark: colorSchema.optional().describe("A hex color that overrides dark mode")
 }).describe('Overrides for the "link-visited" color');
+var focusOverrideSchema = z.object({
+  inner: z.object({
+    light: colorSchema.optional().describe("A hex color that overrides light mode"),
+    dark: colorSchema.optional().describe("A hex color that overrides dark mode")
+  }).optional().describe('Overrides for the "focus-inner" color'),
+  outer: z.object({
+    light: colorSchema.optional().describe("A hex color that overrides light mode"),
+    dark: colorSchema.optional().describe("A hex color that overrides dark mode")
+  }).optional().describe('Overrides for the "focus-outer" color')
+}).describe("Overrides for the focus colors");
 var overridesSchema = z.object({
   colors: semanticColorOverrideSchema.optional(),
   severity: severityColorOverrideSchema.optional(),
-  linkVisited: linkVisitedOverrideSchema.optional()
+  linkVisited: linkVisitedOverrideSchema.optional(),
+  focus: focusOverrideSchema.optional()
 }).describe("Overrides for generated design tokens. Currently only supports colors defined in your theme").optional();
 var themeSchema = z.object({
   colors: z.object({
@@ -2408,7 +2445,7 @@ import * as R9 from "ramda";
 // package.json
 var package_default = {
   name: "@digdir/designsystemet",
-  version: "1.8.0",
+  version: "1.10.0",
   description: "CLI for Designsystemet",
   author: "Designsystemet team",
   engines: {
@@ -2460,23 +2497,18 @@ var package_default = {
     "test:tokens-build-config-tailwind": "pnpm run designsystemet tokens build -t ./temp/config/design-tokens -o ./temp/config/build --clean --experimental-tailwind",
     "test:tokens-create-and-build-options": "pnpm test:tokens-create-options && pnpm test:tokens-build",
     "test:tokens-create-and-build-config": "pnpm test:tokens-create-config && pnpm test:tokens-build-config",
-    "test:generate-config-from-tokens": "pnpm run designsystemet generate-config-from-tokens -d ../../internal/design-tokens --dry",
+    "test:generate-config-from-tokens": "pnpm run designsystemet generate-config-from-tokens -d ../../internal/digdir/design-tokens --dry",
     test: "node -v && pnpm test:tokens-create-and-build-options && pnpm test:generate-config-from-tokens && pnpm test:tokens-create-and-build-config",
-    "digdir:tokens-build": "pnpm run designsystemet tokens build -t ../../internal/design-tokens -o ../../packages/theme/brand --clean --experimental-tailwind",
-    "digdir:tokens-create": "pnpm run designsystemet tokens create --config ./configs/digdir.config.json",
     "update:template": "tsx ./src/scripts/update-template.ts",
     "update:preview-tokens": "tsx ./src/scripts/update-preview-tokens.ts",
-    "update:theme-digdir": "pnpm digdir:tokens-create && tsx ./src/scripts/update-design-tokens.ts && pnpm digdir:tokens-build",
-    verify: "pnpm test && pnpm update:template && pnpm update:theme-digdir && pnpm build:tokens"
+    verify: "pnpm test && pnpm update:template && pnpm --filter @internal/digdir update:theme-digdir"
   },
   dependencies: {
     "@commander-js/extra-typings": "^14.0.0",
     "@digdir/designsystemet-types": "workspace:^",
-    "@tokens-studio/sd-transforms": "2.0.2",
-    "apca-w3": "^0.1.9",
-    "change-case": "^5.4.4",
+    "@tokens-studio/sd-transforms": "2.0.3",
     "chroma-js": "^3.2.0",
-    "colorjs.io": "^0.6.0-alpha.1",
+    "colorjs.io": "^0.6.0",
     commander: "^14.0.2",
     "fast-glob": "^3.3.3",
     hsluv: "^1.0.1",
@@ -2485,19 +2517,15 @@ var package_default = {
     postcss: "^8.5.6",
     ramda: "^0.32.0",
     "style-dictionary": "^5.1.1",
-    zod: "^4.1.13",
+    zod: "^4.3.5",
     "zod-validation-error": "^4.0.2"
   },
   devDependencies: {
     "@tokens-studio/types": "0.5.2",
-    "@types/apca-w3": "^0.1.3",
     "@types/chroma-js": "^3.1.2",
-    "@types/fs-extra": "^11.0.4",
-    "@types/node": "^22.19.1",
+    "@types/node": "^22.19.3",
     "@types/object-hash": "^3.0.6",
     "@types/ramda": "^0.31.1",
-    "fs-extra": "^11.3.2",
-    tslib: "^2.8.1",
     tsup: "^8.5.1",
     tsx: "^4.21.0",
     typescript: "^5.9.3"
@@ -3444,9 +3472,15 @@ var typographyVariables = ({ theme, typography: typography2 }) => {
 };
 
 // src/tokens/process/utils/getMultidimensionalThemes.ts
-import { kebabCase } from "change-case";
 import pc3 from "picocolors";
 import * as R21 from "ramda";
+
+// src/tokens/process/utils/kebab-case.ts
+function kebabCase(str) {
+  return str.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/[\s_]+/g, "-").toLowerCase();
+}
+
+// src/tokens/process/utils/getMultidimensionalThemes.ts
 var getMultidimensionalThemes = (processed$themes, dimensions) => {
   const verboseLogging = buildOptions?.verbose;
   const grouped$themes = groupThemes(processed$themes);

package/dist/src/scripts/createJsonSchema.js

@@ -331,10 +331,21 @@ var linkVisitedOverrideSchema = z.object({
   light: colorSchema.optional().describe("A hex color that overrides light mode"),
   dark: colorSchema.optional().describe("A hex color that overrides dark mode")
 }).describe('Overrides for the "link-visited" color');
+var focusOverrideSchema = z.object({
+  inner: z.object({
+    light: colorSchema.optional().describe("A hex color that overrides light mode"),
+    dark: colorSchema.optional().describe("A hex color that overrides dark mode")
+  }).optional().describe('Overrides for the "focus-inner" color'),
+  outer: z.object({
+    light: colorSchema.optional().describe("A hex color that overrides light mode"),
+    dark: colorSchema.optional().describe("A hex color that overrides dark mode")
+  }).optional().describe('Overrides for the "focus-outer" color')
+}).describe("Overrides for the focus colors");
 var overridesSchema = z.object({
   colors: semanticColorOverrideSchema.optional(),
   severity: severityColorOverrideSchema.optional(),
-  linkVisited: linkVisitedOverrideSchema.optional()
+  linkVisited: linkVisitedOverrideSchema.optional(),
+  focus: focusOverrideSchema.optional()
 }).describe("Overrides for generated design tokens. Currently only supports colors defined in your theme").optional();
 var themeSchema = z.object({
   colors: z.object({

package/dist/src/scripts/update-preview-tokens.js

@@ -2,67 +2,27 @@
 import path from "path";
 import pc4 from "picocolors";
 
-// configs/digdir.config.json
-var digdir_config_default = {
-  $schema: "../dist/config.schema.json",
-  outDir: "./temp/digdir/design-tokens",
+// ../../designsystemet.config.json
+var designsystemet_config_default = {
+  $schema: "packages/cli/dist/config.schema.json",
+  outDir: "design-tokens",
   clean: true,
   themes: {
-    digdir: {
+    designsystemet: {
       colors: {
         main: {
           accent: "#0062BA"
         },
         support: {
-          brand1: "#F45F63",
-          brand2: "#E5AA20",
-          brand3: "#1E98F5"
+          brand1: "#0D7A5F",
+          brand2: "#5B3FA0"
         },
-        neutral: "#1E2B3C"
+        neutral: "#24272B"
       },
       borderRadius: 4,
       typography: {
         fontFamily: "Inter"
       }
-    },
-    altinn: {
-      colors: {
-        main: {
-          accent: "#0062BA"
-        },
-        support: {
-          brand1: "#0162BA",
-          brand2: "#3F3161",
-          brand3: "#E02F4A"
-        },
-        neutral: "#1E2B3C"
-      }
-    },
-    uutilsynet: {
-      colors: {
-        main: {
-          accent: "#0062BA"
-        },
-        support: {
-          brand1: "#5B60D1",
-          brand2: "#FEA769",
-          brand3: "#5DA290"
-        },
-        neutral: "#1E2B3C"
-      }
-    },
-    portal: {
-      colors: {
-        main: {
-          accent: "#38628C"
-        },
-        support: {
-          brand1: "#D9ECFF",
-          brand2: "#FFCA99",
-          brand3: "#D96C79"
-        },
-        neutral: "#203040"
-      }
     }
   }
 };
@@ -1773,7 +1733,8 @@ var generateColorScheme = (themeName, colorScheme2, colors, overrides) => {
     (color, colorName) => generateColor(generateColorScale(color, colorScheme2), createColorOverrides(colorName)),
     colors.support
   );
-  const neutral = generateColor(generateColorScale(colors.neutral, colorScheme2), createColorOverrides("neutral"));
+  const neutralColorScale = generateColorScale(colors.neutral, colorScheme2);
+  const neutral = generateColor(neutralColorScale, createColorOverrides("neutral"));
   const baseColorsWithOverrides = {
     ...baseColors,
     ...overrides?.severity
@@ -1783,7 +1744,12 @@ var generateColorScheme = (themeName, colorScheme2, colors, overrides) => {
     baseColorsWithOverrides
   );
   const linkColor = generateColor(generateColorScale(dsLinkColor, colorScheme2));
+  const defaultLinkVisited = linkColor[12];
   const linkOverride = overrides?.linkVisited?.[colorScheme2] ? { $type: "color", $value: overrides.linkVisited[colorScheme2] } : void 0;
+  const defaultFocusInner = neutralColorScale[0].hex;
+  const defaultFocusOuter = neutralColorScale[10].hex;
+  const focusInnerOverride = overrides?.focus?.inner?.[colorScheme2];
+  const focusOuterOverride = overrides?.focus?.outer?.[colorScheme2];
   return {
     [themeName]: {
       ...main,
@@ -1791,7 +1757,17 @@ var generateColorScheme = (themeName, colorScheme2, colors, overrides) => {
       neutral,
       ...globalColors,
       link: {
-        visited: linkOverride || linkColor[12]
+        visited: linkOverride || defaultLinkVisited
+      },
+      focus: {
+        inner: {
+          $type: "color",
+          $value: focusInnerOverride || defaultFocusInner
+        },
+        outer: {
+          $type: "color",
+          $value: focusOuterOverride || defaultFocusOuter
+        }
       }
     }
   };
@@ -1806,11 +1782,11 @@ var color_base_template_default = {
     focus: {
       inner: {
         $type: "color",
-        $value: "{color.neutral.background-default}"
+        $value: "{color.focus.inner-color}"
       },
       outer: {
         $type: "color",
-        $value: "{color.neutral.text-default}"
+        $value: "{color.focus.outer-color}"
       }
     }
   },
@@ -2166,6 +2142,16 @@ var generateTheme = (colors, themeName, borderRadius) => {
           $type: "color",
           $value: `{${themeName}.link.visited}`
         }
+      },
+      focus: {
+        "inner-color": {
+          $type: "color",
+          $value: `{${themeName}.focus.inner}`
+        },
+        "outer-color": {
+          $type: "color",
+          $value: `{${themeName}.focus.outer}`
+        }
       }
     },
     ...remainingThemeFile
@@ -3106,9 +3092,15 @@ var typographyVariables = ({ theme, typography: typography2 }) => {
 };
 
 // src/tokens/process/utils/getMultidimensionalThemes.ts
-import { kebabCase } from "change-case";
 import pc from "picocolors";
 import * as R19 from "ramda";
+
+// src/tokens/process/utils/kebab-case.ts
+function kebabCase(str) {
+  return str.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/[\s_]+/g, "-").toLowerCase();
+}
+
+// src/tokens/process/utils/getMultidimensionalThemes.ts
 var getMultidimensionalThemes = (processed$themes, dimensions) => {
   const verboseLogging = buildOptions?.verbose;
   const grouped$themes = groupThemes(processed$themes);
@@ -3575,13 +3567,13 @@ var formatTheme = async (themeConfig) => {
 };
 formatTheme({
   name: "test",
-  borderRadius: digdir_config_default.themes.digdir.borderRadius,
+  borderRadius: designsystemet_config_default.themes.designsystemet.borderRadius,
   colors: {
-    main: digdir_config_default.themes.digdir.colors.main,
-    support: digdir_config_default.themes.digdir.colors.support,
-    neutral: digdir_config_default.themes.digdir.colors.neutral
+    main: designsystemet_config_default.themes.designsystemet.colors.main,
+    support: designsystemet_config_default.themes.designsystemet.colors.support,
+    neutral: designsystemet_config_default.themes.designsystemet.colors.neutral
   },
-  typography: digdir_config_default.themes.digdir.typography
+  typography: designsystemet_config_default.themes.designsystemet.typography
 });
 export {
   formatTheme

package/dist/src/scripts/update-template.js

@@ -603,11 +603,11 @@ var color_default = {
     focus: {
       inner: {
         $type: "color",
-        $value: "{color.neutral.background-default}"
+        $value: "{color.focus.inner-color}"
       },
       outer: {
         $type: "color",
-        $value: "{color.neutral.text-default}"
+        $value: "{color.focus.outer-color}"
       }
     }
   },
@@ -1295,6 +1295,16 @@ var digdir_default = {
         $type: "color",
         $value: "{digdir.link.visited}"
       }
+    },
+    focus: {
+      "inner-color": {
+        $type: "color",
+        $value: "{digdir.focus.inner}"
+      },
+      "outer-color": {
+        $type: "color",
+        $value: "{digdir.focus.outer}"
+      }
     }
   },
   "font-family": {

package/dist/src/tokens/build.js

@@ -49,7 +49,7 @@ import pc4 from "picocolors";
 // package.json
 var package_default = {
   name: "@digdir/designsystemet",
-  version: "1.8.0",
+  version: "1.10.0",
   description: "CLI for Designsystemet",
   author: "Designsystemet team",
   engines: {
@@ -101,23 +101,18 @@ var package_default = {
     "test:tokens-build-config-tailwind": "pnpm run designsystemet tokens build -t ./temp/config/design-tokens -o ./temp/config/build --clean --experimental-tailwind",
     "test:tokens-create-and-build-options": "pnpm test:tokens-create-options && pnpm test:tokens-build",
     "test:tokens-create-and-build-config": "pnpm test:tokens-create-config && pnpm test:tokens-build-config",
-    "test:generate-config-from-tokens": "pnpm run designsystemet generate-config-from-tokens -d ../../internal/design-tokens --dry",
+    "test:generate-config-from-tokens": "pnpm run designsystemet generate-config-from-tokens -d ../../internal/digdir/design-tokens --dry",
     test: "node -v && pnpm test:tokens-create-and-build-options && pnpm test:generate-config-from-tokens && pnpm test:tokens-create-and-build-config",
-    "digdir:tokens-build": "pnpm run designsystemet tokens build -t ../../internal/design-tokens -o ../../packages/theme/brand --clean --experimental-tailwind",
-    "digdir:tokens-create": "pnpm run designsystemet tokens create --config ./configs/digdir.config.json",
     "update:template": "tsx ./src/scripts/update-template.ts",
     "update:preview-tokens": "tsx ./src/scripts/update-preview-tokens.ts",
-    "update:theme-digdir": "pnpm digdir:tokens-create && tsx ./src/scripts/update-design-tokens.ts && pnpm digdir:tokens-build",
-    verify: "pnpm test && pnpm update:template && pnpm update:theme-digdir && pnpm build:tokens"
+    verify: "pnpm test && pnpm update:template && pnpm --filter @internal/digdir update:theme-digdir"
   },
   dependencies: {
     "@commander-js/extra-typings": "^14.0.0",
     "@digdir/designsystemet-types": "workspace:^",
-    "@tokens-studio/sd-transforms": "2.0.2",
-    "apca-w3": "^0.1.9",
-    "change-case": "^5.4.4",
+    "@tokens-studio/sd-transforms": "2.0.3",
     "chroma-js": "^3.2.0",
-    "colorjs.io": "^0.6.0-alpha.1",
+    "colorjs.io": "^0.6.0",
     commander: "^14.0.2",
     "fast-glob": "^3.3.3",
     hsluv: "^1.0.1",
@@ -126,19 +121,15 @@ var package_default = {
     postcss: "^8.5.6",
     ramda: "^0.32.0",
     "style-dictionary": "^5.1.1",
-    zod: "^4.1.13",
+    zod: "^4.3.5",
     "zod-validation-error": "^4.0.2"
   },
   devDependencies: {
     "@tokens-studio/types": "0.5.2",
-    "@types/apca-w3": "^0.1.3",
     "@types/chroma-js": "^3.1.2",
-    "@types/fs-extra": "^11.0.4",
-    "@types/node": "^22.19.1",
+    "@types/node": "^22.19.3",
     "@types/object-hash": "^3.0.6",
     "@types/ramda": "^0.31.1",
-    "fs-extra": "^11.3.2",
-    tslib: "^2.8.1",
     tsup: "^8.5.1",
     tsx: "^4.21.0",
     typescript: "^5.9.3"
@@ -1164,9 +1155,15 @@ var TypographyValues;
 })(TypographyValues || (TypographyValues = {}));
 
 // src/tokens/process/utils/getMultidimensionalThemes.ts
-import { kebabCase } from "change-case";
 import pc2 from "picocolors";
 import * as R13 from "ramda";
+
+// src/tokens/process/utils/kebab-case.ts
+function kebabCase(str) {
+  return str.replace(/([a-z])([A-Z])/g, "$1-$2").replace(/[\s_]+/g, "-").toLowerCase();
+}
+
+// src/tokens/process/utils/getMultidimensionalThemes.ts
 var getMultidimensionalThemes = (processed$themes, dimensions) => {
   const verboseLogging = buildOptions?.verbose;
   const grouped$themes = groupThemes(processed$themes);

package/dist/src/tokens/create/generators/$designsystemet.js

@@ -1,7 +1,7 @@
 // package.json
 var package_default = {
   name: "@digdir/designsystemet",
-  version: "1.8.0",
+  version: "1.10.0",
   description: "CLI for Designsystemet",
   author: "Designsystemet team",
   engines: {
@@ -53,23 +53,18 @@ var package_default = {
     "test:tokens-build-config-tailwind": "pnpm run designsystemet tokens build -t ./temp/config/design-tokens -o ./temp/config/build --clean --experimental-tailwind",
     "test:tokens-create-and-build-options": "pnpm test:tokens-create-options && pnpm test:tokens-build",
     "test:tokens-create-and-build-config": "pnpm test:tokens-create-config && pnpm test:tokens-build-config",
-    "test:generate-config-from-tokens": "pnpm run designsystemet generate-config-from-tokens -d ../../internal/design-tokens --dry",
+    "test:generate-config-from-tokens": "pnpm run designsystemet generate-config-from-tokens -d ../../internal/digdir/design-tokens --dry",
     test: "node -v && pnpm test:tokens-create-and-build-options && pnpm test:generate-config-from-tokens && pnpm test:tokens-create-and-build-config",
-    "digdir:tokens-build": "pnpm run designsystemet tokens build -t ../../internal/design-tokens -o ../../packages/theme/brand --clean --experimental-tailwind",
-    "digdir:tokens-create": "pnpm run designsystemet tokens create --config ./configs/digdir.config.json",
     "update:template": "tsx ./src/scripts/update-template.ts",
     "update:preview-tokens": "tsx ./src/scripts/update-preview-tokens.ts",
-    "update:theme-digdir": "pnpm digdir:tokens-create && tsx ./src/scripts/update-design-tokens.ts && pnpm digdir:tokens-build",
-    verify: "pnpm test && pnpm update:template && pnpm update:theme-digdir && pnpm build:tokens"
+    verify: "pnpm test && pnpm update:template && pnpm --filter @internal/digdir update:theme-digdir"
   },
   dependencies: {
     "@commander-js/extra-typings": "^14.0.0",
     "@digdir/designsystemet-types": "workspace:^",
-    "@tokens-studio/sd-transforms": "2.0.2",
-    "apca-w3": "^0.1.9",
-    "change-case": "^5.4.4",
+    "@tokens-studio/sd-transforms": "2.0.3",
     "chroma-js": "^3.2.0",
-    "colorjs.io": "^0.6.0-alpha.1",
+    "colorjs.io": "^0.6.0",
     commander: "^14.0.2",
     "fast-glob": "^3.3.3",
     hsluv: "^1.0.1",
@@ -78,19 +73,15 @@ var package_default = {
     postcss: "^8.5.6",
     ramda: "^0.32.0",
     "style-dictionary": "^5.1.1",
-    zod: "^4.1.13",
+    zod: "^4.3.5",
     "zod-validation-error": "^4.0.2"
   },
   devDependencies: {
     "@tokens-studio/types": "0.5.2",
-    "@types/apca-w3": "^0.1.3",
     "@types/chroma-js": "^3.1.2",
-    "@types/fs-extra": "^11.0.4",
-    "@types/node": "^22.19.1",
+    "@types/node": "^22.19.3",
     "@types/object-hash": "^3.0.6",
     "@types/ramda": "^0.31.1",
-    "fs-extra": "^11.3.2",
-    tslib: "^2.8.1",
     tsup: "^8.5.1",
     tsx: "^4.21.0",
     typescript: "^5.9.3"

package/dist/src/tokens/create/generators/color.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/color.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAS,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACnE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,KAAK,EAAE,MAAM,EAAS,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAgB9D,eAAO,MAAM,mBAAmB,GAC9B,WAAW,MAAM,EACjB,aAAa,WAAW,EACxB,QAAQ,MAAM,EACd,YAAY,mBAAmB,KAC9B,QAqEF,CAAC"}
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/color.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAS,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACnE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,KAAK,EAAE,MAAM,EAAS,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAgB9D,eAAO,MAAM,mBAAmB,GAC9B,WAAW,MAAM,EACjB,aAAa,WAAW,EACxB,QAAQ,MAAM,EACd,YAAY,mBAAmB,KAC9B,QAwFF,CAAC"}

package/dist/src/tokens/create/generators/color.js

@@ -379,7 +379,8 @@ var generateColorScheme = (themeName, colorScheme, colors, overrides) => {
     (color, colorName) => generateColor(generateColorScale(color, colorScheme), createColorOverrides(colorName)),
     colors.support
   );
-  const neutral = generateColor(generateColorScale(colors.neutral, colorScheme), createColorOverrides("neutral"));
+  const neutralColorScale = generateColorScale(colors.neutral, colorScheme);
+  const neutral = generateColor(neutralColorScale, createColorOverrides("neutral"));
   const baseColorsWithOverrides = {
     ...baseColors,
     ...overrides?.severity
@@ -389,7 +390,12 @@ var generateColorScheme = (themeName, colorScheme, colors, overrides) => {
     baseColorsWithOverrides
   );
   const linkColor = generateColor(generateColorScale(dsLinkColor, colorScheme));
+  const defaultLinkVisited = linkColor[12];
   const linkOverride = overrides?.linkVisited?.[colorScheme] ? { $type: "color", $value: overrides.linkVisited[colorScheme] } : void 0;
+  const defaultFocusInner = neutralColorScale[0].hex;
+  const defaultFocusOuter = neutralColorScale[10].hex;
+  const focusInnerOverride = overrides?.focus?.inner?.[colorScheme];
+  const focusOuterOverride = overrides?.focus?.outer?.[colorScheme];
   return {
     [themeName]: {
       ...main,
@@ -397,7 +403,17 @@ var generateColorScheme = (themeName, colorScheme, colors, overrides) => {
       neutral,
       ...globalColors,
       link: {
-        visited: linkOverride || linkColor[12]
+        visited: linkOverride || defaultLinkVisited
+      },
+      focus: {
+        inner: {
+          $type: "color",
+          $value: focusInnerOverride || defaultFocusInner
+        },
+        outer: {
+          $type: "color",
+          $value: focusOuterOverride || defaultFocusOuter
+        }
       }
     }
   };

package/dist/src/tokens/create/generators/semantic.js

@@ -261,11 +261,11 @@ var color_base_template_default = {
     focus: {
       inner: {
         $type: "color",
-        $value: "{color.neutral.background-default}"
+        $value: "{color.focus.inner-color}"
       },
       outer: {
         $type: "color",
-        $value: "{color.neutral.text-default}"
+        $value: "{color.focus.outer-color}"
       }
     }
   },

package/dist/src/tokens/create/generators/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/theme.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAEvD,eAAO,MAAM,aAAa,GAAI,QAAQ,MAAM,EAAE,WAAW,MAAM,EAAE,cAAc,MAAM,aA+CpF,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../../src/tokens/create/generators/theme.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAEvD,eAAO,MAAM,aAAa,GAAI,QAAQ,MAAM,EAAE,WAAW,MAAM,EAAE,cAAc,MAAM,aAyDpF,CAAC"}

package/dist/src/tokens/create/generators/theme.js

@@ -403,6 +403,16 @@ var generateTheme = (colors, themeName, borderRadius) => {
           $type: "color",
           $value: `{${themeName}.link.visited}`
         }
+      },
+      focus: {
+        "inner-color": {
+          $type: "color",
+          $value: `{${themeName}.focus.inner}`
+        },
+        "outer-color": {
+          $type: "color",
+          $value: `{${themeName}.focus.outer}`
+        }
       }
     },
     ...remainingThemeFile