@esri/calcite-design-tokens 3.2.0-next.0 → 3.2.0-next.2

package/dist/css/component.css

@@ -0,0 +1,11 @@
+/**
+ * Calcite Design System
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:host {
+  --calcite-internal-color-focus: var(
+    --calcite-color-focus,
+    var(--calcite-ui-focus-color, var(--calcite-color-brand))
+  );
+}

package/dist/css/dark.css

@@ -49,4 +49,5 @@
   --calcite-color-border-input: #757575;
   --calcite-color-border-ghost: rgba(117, 117, 117, 0.3);
   --calcite-color-border-white: #f7f7f7;
+  --calcite-color-focus: var(--calcite-color-brand);
 }

package/dist/css/light.css

@@ -49,4 +49,5 @@
   --calcite-color-border-input: #949494;
   --calcite-color-border-ghost: rgba(0, 0, 0, 0.3);
   --calcite-color-border-white: #ffffff;
+  --calcite-color-focus: var(--calcite-color-brand);
 }

package/dist/docs/core.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": 1749583596348,
+  "timestamp": 1750434753698,
   "tokens": [
     {
       "key": "{core.color.neutral.blk-000}",

package/dist/docs/dark.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": 1749583594506,
+  "timestamp": 1750434751799,
   "tokens": [
     {
       "key": "{semantic.color.background.default}",
@@ -1247,6 +1247,34 @@
       "isSource": true,
       "name": "Color Border White",
       "path": ["semantic", "color", "border", "white"]
+    },
+    {
+      "key": "{semantic.color.focus.default}",
+      "value": "#009af2",
+      "type": "color",
+      "attributes": {
+        "category": "color",
+        "scope": "component",
+        "type": "color",
+        "item": "focus",
+        "subitem": "default",
+        "names": {
+          "scss": "$calcite-color-focus",
+          "css": "var(--calcite-color-focus)",
+          "js": "semantic.color.focus.default",
+          "docs": "semantic.color.focus.default",
+          "es6": "calciteColorFocus"
+        },
+        "calcite-schema": {
+          "system": "calcite",
+          "tier": "color",
+          "type": "color"
+        }
+      },
+      "filePath": "src/tokens/semantic/color/dark.json",
+      "isSource": true,
+      "name": "Color Focus",
+      "path": ["semantic", "color", "focus", "default"]
     }
   ]
 }

package/dist/docs/global.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": 1749583596093,
+  "timestamp": 1750434753475,
   "tokens": [
     {
       "key": "{semantic.color.background.default}",
@@ -1246,6 +1246,34 @@
       "name": "Color Border White",
       "path": ["semantic", "color", "border", "white"]
     },
+    {
+      "key": "{semantic.color.focus.default}",
+      "value": "{\"light\":\"#007ac2\",\"dark\":\"#009af2\"}",
+      "type": "color",
+      "attributes": {
+        "category": "color",
+        "scope": "component",
+        "type": "color",
+        "item": "focus",
+        "subitem": "default",
+        "names": {
+          "scss": "$calcite-color-focus",
+          "css": "var(--calcite-color-focus)",
+          "js": "semantic.color.focus.default",
+          "docs": "semantic.color.focus.default",
+          "es6": "calciteColorFocus"
+        },
+        "calcite-schema": {
+          "system": "calcite",
+          "tier": "color",
+          "type": "color"
+        }
+      },
+      "filePath": "src/tokens/semantic/color/light.json",
+      "isSource": false,
+      "name": "Color Focus",
+      "path": ["semantic", "color", "focus", "default"]
+    },
     {
       "key": "{semantic.border.width.none}",
       "value": "0",

package/dist/docs/light.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": 1749583595312,
+  "timestamp": 1750434752650,
   "tokens": [
     {
       "key": "{semantic.color.background.default}",
@@ -1245,6 +1245,34 @@
       "isSource": true,
       "name": "Color Border White",
       "path": ["semantic", "color", "border", "white"]
+    },
+    {
+      "key": "{semantic.color.focus.default}",
+      "value": "#007ac2",
+      "type": "color",
+      "attributes": {
+        "category": "color",
+        "scope": "component",
+        "type": "color",
+        "item": "focus",
+        "subitem": "default",
+        "names": {
+          "scss": "$calcite-color-focus",
+          "css": "var(--calcite-color-focus)",
+          "js": "semantic.color.focus.default",
+          "docs": "semantic.color.focus.default",
+          "es6": "calciteColorFocus"
+        },
+        "calcite-schema": {
+          "system": "calcite",
+          "tier": "color",
+          "type": "color"
+        }
+      },
+      "filePath": "src/tokens/semantic/color/light.json",
+      "isSource": true,
+      "name": "Color Focus",
+      "path": ["semantic", "color", "focus", "default"]
     }
   ]
 }

package/dist/docs/semantic.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": 1749583596229,
+  "timestamp": 1750434753618,
   "tokens": [
     {
       "key": "{semantic.border.width.none}",

package/dist/es6/dark.d.ts

@@ -49,3 +49,4 @@ export const calciteColorBorder3: string;
 export const calciteColorBorderInput: string;
 export const calciteColorBorderGhost: string;
 export const calciteColorBorderWhite: string;
+export const calciteColorFocus: string;

package/dist/es6/dark.js

@@ -48,3 +48,4 @@ export const calciteColorBorder3 = "#404040";
 export const calciteColorBorderInput = "#757575";
 export const calciteColorBorderGhost = "rgba(117, 117, 117, 0.3)";
 export const calciteColorBorderWhite = "#f7f7f7";
+export const calciteColorFocus = "#009af2";

package/dist/es6/global.d.ts

@@ -56,6 +56,7 @@ export const calciteColorBorder3: { light: string; dark: string };
 export const calciteColorBorderInput: { light: string; dark: string };
 export const calciteColorBorderGhost: { light: string; dark: string };
 export const calciteColorBorderWhite: { light: string; dark: string };
+export const calciteColorFocus: { light: string; dark: string };
 export const calciteBorderWidthNone: string;
 export const calciteBorderWidthSm: string;
 export const calciteBorderWidthMd: string;

package/dist/es6/global.js

@@ -106,6 +106,7 @@ export const calciteColorBorderGhost = {
   dark: "rgba(117, 117, 117, 0.3)",
 };
 export const calciteColorBorderWhite = { light: "#ffffff", dark: "#f7f7f7" };
+export const calciteColorFocus = { light: "#007ac2", dark: "#009af2" };
 export const calciteBorderWidthNone = "0";
 export const calciteBorderWidthSm = "1px";
 export const calciteBorderWidthMd = "2px";

package/dist/es6/light.d.ts

@@ -49,3 +49,4 @@ export const calciteColorBorder3: string;
 export const calciteColorBorderInput: string;
 export const calciteColorBorderGhost: string;
 export const calciteColorBorderWhite: string;
+export const calciteColorFocus: string;

package/dist/es6/light.js

@@ -48,3 +48,4 @@ export const calciteColorBorder3 = "#dedede";
 export const calciteColorBorderInput = "#949494";
 export const calciteColorBorderGhost = "rgba(0, 0, 0, 0.3)";
 export const calciteColorBorderWhite = "#ffffff";
+export const calciteColorFocus = "#007ac2";

package/dist/js/dark.d.ts

@@ -49,3 +49,4 @@ export const calciteColorBorder3: string;
 export const calciteColorBorderInput: string;
 export const calciteColorBorderGhost: string;
 export const calciteColorBorderWhite: string;
+export const calciteColorFocus: string;

package/dist/js/dark.js

@@ -1645,6 +1645,45 @@ export default {
           path: ["semantic", "color", "border", "white"],
         },
       },
+      focus: {
+        default: {
+          key: "{semantic.color.focus.default}",
+          value: "#009af2",
+          type: "color",
+          attributes: {
+            category: "color",
+            scope: "component",
+            type: "color",
+            item: "focus",
+            subitem: "default",
+            names: {
+              scss: "$calcite-color-focus",
+              css: "var(--calcite-color-focus)",
+              js: "semantic.color.focus.default",
+              docs: "semantic.color.focus.default",
+              es6: "calciteColorFocus",
+            },
+            "calcite-schema": {
+              system: "calcite",
+              tier: "color",
+              type: "color",
+            },
+          },
+          filePath: "src/tokens/semantic/color/dark.json",
+          isSource: true,
+          original: {
+            value: "{semantic.color.brand.default.default}",
+            type: "color",
+            attributes: {
+              category: "color",
+              scope: "component",
+            },
+            key: "{semantic.color.focus.default}",
+          },
+          name: "calciteColorFocus",
+          path: ["semantic", "color", "focus", "default"],
+        },
+      },
     },
   },
 };

package/dist/js/global.d.ts

@@ -94,6 +94,9 @@ declare const tokens: {
         ghost: DesignToken;
         white: DesignToken;
       };
+      focus: {
+        default: DesignToken;
+      };
     };
     border: {
       width: {

package/dist/js/global.js

@@ -1781,6 +1781,48 @@ export default {
           path: ["semantic", "color", "border", "white"],
         },
       },
+      focus: {
+        default: {
+          key: "{semantic.color.focus.default}",
+          value: {
+            light: "#007ac2",
+            dark: "#009af2",
+          },
+          type: "color",
+          attributes: {
+            category: "color",
+            scope: "component",
+            type: "color",
+            item: "focus",
+            subitem: "default",
+            names: {
+              scss: "$calcite-color-focus",
+              css: "var(--calcite-color-focus)",
+              js: "semantic.color.focus.default",
+              docs: "semantic.color.focus.default",
+              es6: "calciteColorFocus",
+            },
+            "calcite-schema": {
+              system: "calcite",
+              tier: "color",
+              type: "color",
+            },
+          },
+          filePath: "src/tokens/semantic/color/light.json",
+          isSource: false,
+          original: {
+            value: "{semantic.color.brand.default.default}",
+            type: "color",
+            attributes: {
+              category: "color",
+              scope: "component",
+            },
+            key: "{semantic.color.focus.default}",
+          },
+          name: "Color Focus",
+          path: ["semantic", "color", "focus", "default"],
+        },
+      },
     },
     border: {
       width: {

package/dist/js/light.d.ts

@@ -49,3 +49,4 @@ export const calciteColorBorder3: string;
 export const calciteColorBorderInput: string;
 export const calciteColorBorderGhost: string;
 export const calciteColorBorderWhite: string;
+export const calciteColorFocus: string;

package/dist/js/light.js

@@ -1648,6 +1648,45 @@ export default {
           path: ["semantic", "color", "border", "white"],
         },
       },
+      focus: {
+        default: {
+          key: "{semantic.color.focus.default}",
+          value: "#007ac2",
+          type: "color",
+          attributes: {
+            category: "color",
+            scope: "component",
+            type: "color",
+            item: "focus",
+            subitem: "default",
+            names: {
+              scss: "$calcite-color-focus",
+              css: "var(--calcite-color-focus)",
+              js: "semantic.color.focus.default",
+              docs: "semantic.color.focus.default",
+              es6: "calciteColorFocus",
+            },
+            "calcite-schema": {
+              system: "calcite",
+              tier: "color",
+              type: "color",
+            },
+          },
+          filePath: "src/tokens/semantic/color/light.json",
+          isSource: true,
+          original: {
+            value: "{semantic.color.brand.default.default}",
+            type: "color",
+            attributes: {
+              category: "color",
+              scope: "component",
+            },
+            key: "{semantic.color.focus.default}",
+          },
+          name: "calciteColorFocus",
+          path: ["semantic", "color", "focus", "default"],
+        },
+      },
     },
   },
 };

package/dist/scss/dark.scss

@@ -47,3 +47,4 @@ $calcite-color-border-3: #404040;
 $calcite-color-border-input: #757575;
 $calcite-color-border-ghost: rgba(117, 117, 117, 0.3);
 $calcite-color-border-white: #f7f7f7;
+$calcite-color-focus: $calcite-color-brand;

package/dist/scss/light.scss

@@ -47,3 +47,4 @@ $calcite-color-border-3: #dedede;
 $calcite-color-border-input: #949494;
 $calcite-color-border-ghost: rgba(0, 0, 0, 0.3);
 $calcite-color-border-white: #ffffff;
+$calcite-color-focus: $calcite-color-brand;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@esri/calcite-design-tokens",
-  "version": "3.2.0-next.0",
+  "version": "3.2.0-next.2",
   "description": "Esri's Calcite Design System Tokens",
   "keywords": [
     "Calcite",
@@ -44,7 +44,7 @@
     "extends": "../../package.json"
   },
   "devDependencies": {
-    "vitest": "3.1.4"
+    "vitest": "3.2.3"
   },
-  "gitHead": "286845f59ea34438157a1ece5070a4e9ced18c9f"
+  "gitHead": "c055adb839791919b03449d396cf686108e5303a"
 }