diff --git a/.cspell.json b/.cspell.json index 43e28c356d9..b48f3dc1c2b 100644 --- a/.cspell.json +++ b/.cspell.json @@ -3,6 +3,7 @@ "calcite-dev", "css", "en-common-misspellings", + "fonts", "fullstack", "html", "html-symbol-entities", diff --git a/package-lock.json b/package-lock.json index 74e24951b34..9346fdb89e1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -67,14 +67,13 @@ "jest": "29.7.0", "jest-axe": "8.0.0", "jest-cli": "29.7.0", - "json-to-ts": "1.7.0", "lerna": "7.1.5", "lint-staged": "13.2.3", "markdownlint-cli": "0.34.0", "postcss": "8.4.31", "prettier": "2.8.8", "puppeteer": "21.5.0", - "quicktype-core": "23.0.76", + "quicktype-core": "23.0.79", "react": "^16.13.1", "react-dom": "^16.13.1", "rimraf": "5.0.5", @@ -21652,26 +21651,6 @@ "integrity": "sha512-Twf7I2v4/1tLoIXMT8HlqaBSS5H2wQTs2wx3MNYCI8K1R1/clXyCazrcVCPm/FuO9cyV8+leEaZOWD5C253NDg==", "dev": true }, - "node_modules/es7-shim": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/es7-shim/-/es7-shim-6.0.0.tgz", - "integrity": "sha512-aiQ/QyJBVJbabtsSediM1S4qI+P3p8F5J5YR5o/bH003BCnnclzxK9pi5Qd2Hg01ktAtZCaQBdejHrkOBGwf5Q==", - "dev": true, - "dependencies": { - "array-includes": "^3.0.2", - "object.entries": "^1.0.3", - "object.getownpropertydescriptors": "^2.0.2", - "object.values": "^1.0.3", - "string-at": "^1.0.1", - "string.prototype.padend": "^3.0.0", - "string.prototype.padstart": "^3.0.0", - "string.prototype.trimleft": "^2.0.0", - "string.prototype.trimright": "^2.0.0" - }, - "engines": { - "node": ">=0.4.0" - } - }, "node_modules/esbuild": { "version": "0.19.5", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.19.5.tgz", @@ -29742,23 +29721,6 @@ "integrity": "sha512-ZClg6AaYvamvYEE82d3Iyd3vSSIjQ+odgjaTzRuO3s7toCdFKczob2i0zCh7JE8kWn17yvAWhUVxvqGwUalsRA==", "dev": true }, - "node_modules/json-to-ts": { - "version": "1.7.0", - "resolved": "https://registry.npmjs.org/json-to-ts/-/json-to-ts-1.7.0.tgz", - "integrity": "sha512-uVhcw4SLnf9ucMwFpom/G1/IT+lnoILOyHbFE6xqxvw67oCvHl6iDZzmjyn2lPCRPsAOMSQgG/ZxvbCPySMi1Q==", - "dev": true, - "dependencies": { - "es7-shim": "^6.0.0", - "hash.js": "^1.0.3", - "pluralize": "^3.1.0" - } - }, - "node_modules/json-to-ts/node_modules/pluralize": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/pluralize/-/pluralize-3.1.0.tgz", - "integrity": "sha512-2wcybwjwXOzGI1rlxWtlcs0/nSYK0OzNPqsg35TKxJFQlGhFu3cZ1x7EHS4r4bubQlhzyF4YxxlJqQnIhkUQCw==", - "dev": true - }, "node_modules/json5": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz", @@ -37049,9 +37011,9 @@ } }, "node_modules/quicktype-core": { - "version": "23.0.76", - "resolved": "https://registry.npmjs.org/quicktype-core/-/quicktype-core-23.0.76.tgz", - "integrity": "sha512-QinZRNovSTQcFuhRKxeHb22eFmyucbG96EPaQDSbz9qvIPxUhs1BZviNc8HAkHWYFqTSET/xZcEoHpm1DeDbRg==", + "version": "23.0.79", + "resolved": "https://registry.npmjs.org/quicktype-core/-/quicktype-core-23.0.79.tgz", + "integrity": "sha512-Auzy8AhorFt6YGeB53/dzUSINmKKassAyCsr2wpNgG9XoC3i6oUoLuySNUzYIkyCFCGmKdBRBQeyAqPOVteoYw==", "dev": true, "dependencies": { "@glideapps/ts-necessities": "2.1.3", @@ -40494,23 +40456,6 @@ "node": ">=0.6.19" } }, - "node_modules/string-at": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/string-at/-/string-at-1.1.0.tgz", - "integrity": "sha512-jCpPowWKBn0NFdvtmK2qxK40Ol4jPcgCt8qYnKpPx6B5eDwHMDhRvq9MCsDEgsOTNtbXY6beAMHMRT2qPJXllA==", - "deprecated": "The original `String.prototype.at` proposal has been replaced by a new one; please use v1 or later of `string.prototype.at` instead", - "dev": true, - "dependencies": { - "define-properties": "^1.1.3", - "es-abstract": "^1.17.0-next.1" - }, - "engines": { - "node": ">= 0.4" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/string-length": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz", @@ -40656,40 +40601,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/string.prototype.trimleft": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/string.prototype.trimleft/-/string.prototype.trimleft-2.1.3.tgz", - "integrity": "sha512-699Ibssmj/awVzvdNk4g83/Iu8U9vDohzmA/ly2BrQWGhamuY4Tlvs5XKmKliDt3ky6SKbE1bzPhASKCFlx9Sg==", - "dev": true, - "dependencies": { - "call-bind": "^1.0.0", - "define-properties": "^1.1.3", - "string.prototype.trimstart": "^1.0.3" - }, - "engines": { - "node": ">= 0.4" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/string.prototype.trimright": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/string.prototype.trimright/-/string.prototype.trimright-2.1.3.tgz", - "integrity": "sha512-hoOq56oRFnnfDuXNy2lGHiwT77MehHv9d0zGfRZ8QdC+4zjrkFB9vd5i/zYTd/ymFBd4YxtbdgHt3U6ksGeuBw==", - "dev": true, - "dependencies": { - "call-bind": "^1.0.0", - "define-properties": "^1.1.3", - "string.prototype.trimend": "^1.0.3" - }, - "engines": { - "node": ">= 0.4" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/string.prototype.trimstart": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz", diff --git a/package.json b/package.json index 63af4cf5aff..312bcec9483 100644 --- a/package.json +++ b/package.json @@ -82,14 +82,13 @@ "jest": "29.7.0", "jest-axe": "8.0.0", "jest-cli": "29.7.0", - "json-to-ts": "1.7.0", "lerna": "7.1.5", "lint-staged": "13.2.3", "markdownlint-cli": "0.34.0", "postcss": "8.4.31", "prettier": "2.8.8", "puppeteer": "21.5.0", - "quicktype-core": "23.0.76", + "quicktype-core": "23.0.79", "react": "^16.13.1", "react-dom": "^16.13.1", "rimraf": "5.0.5", diff --git a/packages/calcite-components/.storybook/preview-head.html b/packages/calcite-components/.storybook/preview-head.html index 6eabb7b8d9a..9a0cd427b33 100644 --- a/packages/calcite-components/.storybook/preview-head.html +++ b/packages/calcite-components/.storybook/preview-head.html @@ -6,8 +6,8 @@
${alertSnippet}
`, diff --git a/packages/calcite-components/src/components/alert/alert.scss b/packages/calcite-components/src/components/alert/alert.scss index 26e29bd72a5..c4c9c8185ba 100644 --- a/packages/calcite-components/src/components/alert/alert.scss +++ b/packages/calcite-components/src/components/alert/alert.scss @@ -6,7 +6,7 @@ * @prop --calcite-alert-width: Specifies the width of the component. */ -$border-style: 1px solid var(--calcite-ui-border-3); +$border-style: 1px solid var(--calcite-color-border-3); :host { --calcite-alert-edge-distance: theme("spacing.8"); @@ -133,7 +133,7 @@ $border-style: 1px solid var(--calcite-ui-border-3); block; block-size: 2px; content: ""; - background-color: var(--calcite-alert-dismiss-progress-background); + background-color: var(--calcite-color-background-transparent-dismiss); inset-inline-end: 0; } } @@ -271,8 +271,8 @@ $border-style: 1px solid var(--calcite-ui-border-3); @apply text-color-link inline-flex; } -$alertKinds: "brand" var(--calcite-ui-brand), "info" var(--calcite-ui-info), "danger" var(--calcite-ui-danger), - "success" var(--calcite-ui-success), "warning" var(--calcite-ui-warning); +$alertKinds: "brand" var(--calcite-color-brand), "info" var(--calcite-color-info), "danger" var(--calcite-color-danger), + "success" var(--calcite-color-success), "warning" var(--calcite-color-warning); @each $alertKind in $alertKinds { $name: nth($alertKind, 1); @@ -319,7 +319,7 @@ $alertDurations: "fast" 6000ms, "medium" 10000ms, "slow" 14000ms; @apply absolute; } -@container responsive-container (min-width: #{$breakpoint-width-xs}) { +@container responsive-container (min-width: #{$calcite-container-size-width-xs-max}) { .content { @apply flex-row; } @@ -336,7 +336,7 @@ $alertDurations: "fast" 6000ms, "medium" 10000ms, "slow" 14000ms; } } -@container responsive-container (min-width: #{$breakpoint-width-sm}) { +@container responsive-container (min-width: #{$calcite-container-size-width-sm-max}) { .close { @apply self-stretch; } diff --git a/packages/calcite-components/src/components/avatar/avatar.tsx b/packages/calcite-components/src/components/avatar/avatar.tsx index 4c2ec83d03e..df4030b1b6c 100644 --- a/packages/calcite-components/src/components/avatar/avatar.tsx +++ b/packages/calcite-components/src/components/avatar/avatar.tsx @@ -102,7 +102,7 @@ export class Avatar { const hex = id && isValidHex(id) ? id : stringToHex(name); // if there is not unique information, or an invalid hex is produced, return a default if ((!userId && !name) || !isValidHex(hex)) { - return `var(--calcite-ui-foreground-2)`; + return `var(--calcite-color-foreground-2)`; } const hue = hexToHue(hex); const l = theme === "dark" ? 20 : 90; diff --git a/packages/calcite-components/src/components/button/button.e2e.ts b/packages/calcite-components/src/components/button/button.e2e.ts index 3fc1e942a6b..e7ceaf6efe7 100644 --- a/packages/calcite-components/src/components/button/button.e2e.ts +++ b/packages/calcite-components/src/components/button/button.e2e.ts @@ -454,11 +454,13 @@ describe("calcite-button", () => { page = await newE2EPage({ html: buttonSnippet }); const buttonStyles = await page.evaluate(() => { buttonEl = document.querySelector("calcite-button"); - buttonEl.style.setProperty("--calcite-button-transparent-hover", "rgba(34, 23, 200, 0.4)"); - buttonEl.style.setProperty("--calcite-button-transparent-press", "rgba(1, 20, 44, 0.1"); + buttonEl.style.setProperty("--calcite-color-background-transparent-hover", "rgba(34, 23, 200, 0.4)"); + buttonEl.style.setProperty("--calcite-color-background-transparent-press", "rgba(1, 20, 44, 0.1"); return { - hoverFocus: window.getComputedStyle(buttonEl).getPropertyValue("--calcite-button-transparent-hover"), - active: window.getComputedStyle(buttonEl).getPropertyValue("--calcite-button-transparent-press"), + hoverFocus: window + .getComputedStyle(buttonEl) + .getPropertyValue("--calcite-color-background-transparent-hover"), + active: window.getComputedStyle(buttonEl).getPropertyValue("--calcite-color-background-transparent-press"), }; }); expect(buttonStyles.hoverFocus).toEqual("rgba(34, 23, 200, 0.4)"); @@ -472,12 +474,12 @@ describe("calcite-button", () => { await buttonEl.focus(); await page.waitForChanges(); buttonFocusStyle = await buttonEl.getComputedStyle(":focus"); - expect(buttonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.05)"); + expect(buttonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.04)"); await buttonEl.hover(); await page.waitForChanges(); buttonHoverStyle = await buttonEl.getComputedStyle(":hover"); - expect(buttonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.05)"); + expect(buttonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.04)"); }); }); @@ -490,12 +492,12 @@ describe("calcite-button", () => { await buttonEl.focus(); await page.waitForChanges(); buttonFocusStyle = await buttonEl.getComputedStyle(":focus"); - expect(buttonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.05)"); + expect(buttonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.04)"); await buttonEl.hover(); await page.waitForChanges(); buttonHoverStyle = await buttonEl.getComputedStyle(":hover"); - expect(buttonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.05)"); + expect(buttonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.04)"); }); }); @@ -505,7 +507,7 @@ describe("calcite-button", () => { html: `
${buttonSnippet}
`, diff --git a/packages/calcite-components/src/components/button/button.scss b/packages/calcite-components/src/components/button/button.scss index 98438744ed9..34e85266d43 100644 --- a/packages/calcite-components/src/components/button/button.scss +++ b/packages/calcite-components/src/components/button/button.scss @@ -292,13 +292,13 @@ button, a { @apply text-color-inverse; - background-color: var(--calcite-ui-inverse); + background-color: var(--calcite-color-inverse); &:hover, &:focus { - background-color: var(--calcite-ui-inverse-hover); + background-color: var(--calcite-color-inverse-hover); } &:active { - background-color: var(--calcite-ui-inverse-press); + background-color: var(--calcite-color-inverse-press); } calcite-loader { @apply text-color-inverse; @@ -321,17 +321,17 @@ &:hover { @apply border-color-brand-hover; color: theme("colors.brand-hover"); - box-shadow: inset 0 0 0 1px var(--calcite-ui-brand-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-brand-hover); } &:focus { @apply border-color-brand; color: theme("colors.brand"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand); } &:active { @apply border-color-brand-press; color: theme("colors.brand-press"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand-press); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand-press); } calcite-loader { color: theme("colors.brand"); @@ -346,17 +346,17 @@ &:hover { @apply border-color-danger-hover; color: theme("colors.danger-hover"); - box-shadow: inset 0 0 0 1px var(--calcite-ui-danger-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-danger-hover); } &:focus { @apply border-color-danger; color: theme("colors.danger"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-danger); + box-shadow: inset 0 0 0 2px var(--calcite-color-danger); } &:active { @apply border-color-danger-press; color: theme("colors.danger-press"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-danger-press); + box-shadow: inset 0 0 0 2px var(--calcite-color-danger-press); } calcite-loader { color: theme("colors.danger"); @@ -369,13 +369,13 @@ @apply text-color-1 bg-foreground-1; border-color: theme("borderColor.color.1"); &:hover { - box-shadow: inset 0 0 0 1px var(--calcite-ui-foreground-3); + box-shadow: inset 0 0 0 1px var(--calcite-color-foreground-3); } &:focus { - box-shadow: inset 0 0 0 2px var(--calcite-ui-foreground-3); + box-shadow: inset 0 0 0 2px var(--calcite-color-foreground-3); } &:active { - box-shadow: inset 0 0 0 2px var(--calcite-ui-foreground-3); + box-shadow: inset 0 0 0 2px var(--calcite-color-foreground-3); } calcite-loader { @apply text-color-1; @@ -386,18 +386,18 @@ button, a { @apply text-color-1 bg-foreground-1; - border-color: var(--calcite-ui-inverse); + border-color: var(--calcite-color-inverse); &:hover { - border-color: var(--calcite-ui-inverse-hover); - box-shadow: inset 0 0 0 1px var(--calcite-ui-inverse-hover); + border-color: var(--calcite-color-inverse-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-inverse-hover); } &:focus { - border-color: var(--calcite-ui-inverse); - box-shadow: inset 0 0 0 2px var(--calcite-ui-inverse); + border-color: var(--calcite-color-inverse); + box-shadow: inset 0 0 0 2px var(--calcite-color-inverse); } &:active { - border-color: var(--calcite-ui-inverse-press); - box-shadow: inset 0 0 0 2px var(--calcite-ui-inverse-press); + border-color: var(--calcite-color-inverse-press); + box-shadow: inset 0 0 0 2px var(--calcite-color-inverse-press); } calcite-loader { @apply text-color-1; @@ -419,17 +419,17 @@ &:hover { @apply border-color-brand-hover; color: theme("colors.brand-hover"); - box-shadow: inset 0 0 0 1px var(--calcite-ui-brand-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-brand-hover); } &:focus { @apply border-color-brand; color: theme("colors.brand"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand); } &:active { @apply border-color-brand-press; color: theme("colors.brand-press"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand-press); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand-press); } calcite-loader { color: theme("colors.brand"); @@ -444,17 +444,17 @@ &:hover { @apply border-color-danger-hover; color: theme("colors.danger-hover"); - box-shadow: inset 0 0 0 1px var(--calcite-ui-danger-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-danger-hover); } &:focus { @apply border-color-danger; color: theme("colors.danger"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-danger); + box-shadow: inset 0 0 0 2px var(--calcite-color-danger); } &:active { @apply border-color-danger-press; color: theme("colors.danger-press"); - box-shadow: inset 0 0 0 2px var(--calcite-ui-danger-press); + box-shadow: inset 0 0 0 2px var(--calcite-color-danger-press); } calcite-loader { color: theme("colors.danger"); @@ -467,13 +467,13 @@ @apply text-color-1 bg-transparent; border-color: theme("borderColor.color.1"); &:hover { - box-shadow: inset 0 0 0 1px var(--calcite-ui-foreground-3); + box-shadow: inset 0 0 0 1px var(--calcite-color-foreground-3); } &:focus { - box-shadow: inset 0 0 0 2px var(--calcite-ui-foreground-3); + box-shadow: inset 0 0 0 2px var(--calcite-color-foreground-3); } &:active { - box-shadow: inset 0 0 0 2px var(--calcite-ui-foreground-3); + box-shadow: inset 0 0 0 2px var(--calcite-color-foreground-3); } calcite-loader { @apply text-color-1; @@ -484,18 +484,18 @@ button, a { @apply text-color-1 bg-transparent; - border-color: var(--calcite-ui-inverse); + border-color: var(--calcite-color-inverse); &:hover { - border-color: var(--calcite-ui-inverse-hover); - box-shadow: inset 0 0 0 1px var(--calcite-ui-inverse-hover); + border-color: var(--calcite-color-inverse-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-inverse-hover); } &:focus { - border-color: var(--calcite-ui-inverse); - box-shadow: inset 0 0 0 2px var(--calcite-ui-inverse); + border-color: var(--calcite-color-inverse); + box-shadow: inset 0 0 0 2px var(--calcite-color-inverse); } &:active { - border-color: var(--calcite-ui-inverse-press); - box-shadow: inset 0 0 0 2px var(--calcite-ui-inverse-press); + border-color: var(--calcite-color-inverse-press); + box-shadow: inset 0 0 0 2px var(--calcite-color-inverse-press); } calcite-loader { @apply text-color-1; @@ -522,10 +522,10 @@ @apply bg-transparent; &:hover, &:focus { - background-color: var(--calcite-button-transparent-hover); + background-color: var(--calcite-color-background-transparent-hover); } &:active { - background-color: var(--calcite-button-transparent-press); + background-color: var(--calcite-color-background-transparent-press); } } } diff --git a/packages/calcite-components/src/components/checkbox/checkbox.scss b/packages/calcite-components/src/components/checkbox/checkbox.scss index 971b7d822ff..d7f0b3e8632 100644 --- a/packages/calcite-components/src/components/checkbox/checkbox.scss +++ b/packages/calcite-components/src/components/checkbox/checkbox.scss @@ -39,7 +39,7 @@ stroke-current stroke-1 transition-default; - box-shadow: inset 0 0 0 1px var(--calcite-ui-border-input); + box-shadow: inset 0 0 0 1px var(--calcite-color-border-input); color: theme("backgroundColor.background"); } } @@ -47,13 +47,13 @@ :host([indeterminate]) { .check-svg { @apply bg-brand; - box-shadow: inset 0 0 0 1px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 1px var(--calcite-color-brand); } } :host([hovered]) .toggle, :host .toggle:hover { .check-svg { - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand); } } diff --git a/packages/calcite-components/src/components/chip/chip.e2e.ts b/packages/calcite-components/src/components/chip/chip.e2e.ts index 810deac693b..bbfc44b2ff9 100644 --- a/packages/calcite-components/src/components/chip/chip.e2e.ts +++ b/packages/calcite-components/src/components/chip/chip.e2e.ts @@ -161,12 +161,12 @@ describe("calcite-chip", () => { await chipCloseButton.focus(); await page.waitForChanges(); chipCloseButtonFocusStyle = await chipCloseButton.getComputedStyle(":focus"); - expect(chipCloseButtonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.05)"); + expect(chipCloseButtonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.04)"); await chipCloseButton.hover(); await page.waitForChanges(); chipCloseButtonHoverStyle = await chipCloseButton.getComputedStyle(":hover"); - expect(chipCloseButtonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.05)"); + expect(chipCloseButtonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(0, 0, 0, 0.04)"); }); }); @@ -179,12 +179,12 @@ describe("calcite-chip", () => { await chipCloseButton.focus(); await page.waitForChanges(); chipCloseButtonFocusStyle = await chipCloseButton.getComputedStyle(":focus"); - expect(chipCloseButtonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.05)"); + expect(chipCloseButtonFocusStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.04)"); await chipCloseButton.hover(); await page.waitForChanges(); chipCloseButtonHoverStyle = await chipCloseButton.getComputedStyle(":hover"); - expect(chipCloseButtonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.05)"); + expect(chipCloseButtonHoverStyle.getPropertyValue("background-color")).toEqual("rgba(255, 255, 255, 0.04)"); }); }); @@ -194,7 +194,7 @@ describe("calcite-chip", () => { html: `
${chipSnippet}
`, diff --git a/packages/calcite-components/src/components/chip/chip.scss b/packages/calcite-components/src/components/chip/chip.scss index 60d49810bc4..87398ce934d 100644 --- a/packages/calcite-components/src/components/chip/chip.scss +++ b/packages/calcite-components/src/components/chip/chip.scss @@ -165,8 +165,8 @@ border-radius: 50%; align-content: center; justify-content: center; - --calcite-chip-transparent-hover: var(--calcite-button-transparent-hover); - --calcite-chip-transparent-press: var(--calcite-button-transparent-press); + --calcite-chip-transparent-hover: var(--calcite-color-background-transparent-hover); + --calcite-chip-transparent-press: var(--calcite-color-background-transparent-press); &:hover { background-color: var(--calcite-chip-transparent-hover); } @@ -215,21 +215,21 @@ slot[name="image"]::slotted(*) { } :host([kind="neutral"]) { - background-color: var(--calcite-ui-foreground-2); - color: var(--calcite-ui-text-1); + background-color: var(--calcite-color-foreground-2); + color: var(--calcite-color-text-1); .container { border-color: transparent; } .close { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); } .chip-icon { - color: var(--calcite-ui-icon-color, var(--calcite-ui-text-3)); + color: var(--calcite-ui-icon-color, var(--calcite-color-text-3)); } } :host([kind="inverse"]) { - background-color: var(--calcite-ui-inverse); + background-color: var(--calcite-color-inverse); @apply text-color-inverse; .container { border-color: transparent; @@ -238,13 +238,13 @@ slot[name="image"]::slotted(*) { @apply text-color-inverse; } .chip-icon { - color: var(--calcite-ui-icon-color, var(--calcite-ui-text-inverse)); + color: var(--calcite-ui-icon-color, var(--calcite-color-text-inverse)); } } :host([kind="brand"]) { - background-color: var(--calcite-ui-brand); - color: var(--calcite-ui-text-inverse); + background-color: var(--calcite-color-brand); + color: var(--calcite-color-text-inverse); .container { border-color: transparent; } @@ -252,7 +252,7 @@ slot[name="image"]::slotted(*) { @apply text-color-inverse; } .chip-icon { - color: var(--calcite-ui-icon-color, var(--calcite-ui-text-inverse)); + color: var(--calcite-ui-icon-color, var(--calcite-color-text-inverse)); } } @@ -263,7 +263,7 @@ slot[name="image"]::slotted(*) { @apply text-color-3; } .chip-icon { - color: var(--calcite-ui-icon-color, var(--calcite-ui-text-3)); + color: var(--calcite-ui-icon-color, var(--calcite-color-text-3)); } } @@ -277,23 +277,23 @@ slot[name="image"]::slotted(*) { :host([kind="neutral"][appearance="outline-fill"]) .container, :host([kind="neutral"][appearance="outline"]) .container { - border-color: var(--calcite-ui-border-1); + border-color: var(--calcite-color-border-1); } :host([kind="inverse"][appearance="outline-fill"]) .container, :host([kind="inverse"][appearance="outline"]) .container { - border-color: var(--calcite-ui-border-inverse); + border-color: var(--calcite-color-border-inverse); } :host([kind="brand"][appearance="outline-fill"]) .container, :host([kind="brand"][appearance="outline"]) .container { - border-color: var(--calcite-ui-brand); + border-color: var(--calcite-color-brand); } :host([kind="brand"][appearance="solid"]), :host([kind="inverse"][appearance="solid"]) { button { - outline-color: var(--calcite-ui-text-inverse); + outline-color: var(--calcite-color-text-inverse); } } diff --git a/packages/calcite-components/src/components/color-picker-swatch/color-picker-swatch.scss b/packages/calcite-components/src/components/color-picker-swatch/color-picker-swatch.scss index c07f3199d47..920718a4e01 100644 --- a/packages/calcite-components/src/components/color-picker-swatch/color-picker-swatch.scss +++ b/packages/calcite-components/src/components/color-picker-swatch/color-picker-swatch.scss @@ -30,11 +30,11 @@ $size-l: 28px; .swatch--no-color { rect { - fill: var(--calcite-ui-foreground-1); + fill: var(--calcite-color-foreground-1); } line { - stroke: var(--calcite-ui-danger); + stroke: var(--calcite-color-danger); } } diff --git a/packages/calcite-components/src/components/color-picker/color-picker.scss b/packages/calcite-components/src/components/color-picker/color-picker.scss index d721e4ae2d9..78c59a5e9ff 100644 --- a/packages/calcite-components/src/components/color-picker/color-picker.scss +++ b/packages/calcite-components/src/components/color-picker/color-picker.scss @@ -67,7 +67,7 @@ .container { @apply bg-foreground-1; display: inline-block; - border: 1px solid var(--calcite-ui-border-1); + border: 1px solid var(--calcite-color-border-1); } .control-and-scope { @@ -189,7 +189,7 @@ &:hover { transition: outline-color var(--calcite-internal-animation-timing-fast) ease-in-out; - outline: 2px solid var(--calcite-ui-border-2); + outline: 2px solid var(--calcite-color-border-2); outline-offset: 2px; } } diff --git a/packages/calcite-components/src/components/date-picker-day/date-picker-day.scss b/packages/calcite-components/src/components/date-picker-day/date-picker-day.scss index b3d80350a98..ce468a802d3 100644 --- a/packages/calcite-components/src/components/date-picker-day/date-picker-day.scss +++ b/packages/calcite-components/src/components/date-picker-day/date-picker-day.scss @@ -154,15 +154,15 @@ :host([selected]) .day { @apply font-medium; - background-color: var(--calcite-ui-brand); - color: var(--calcite-ui-foreground-1); + background-color: var(--calcite-color-brand); + color: var(--calcite-color-foreground-1); } :host(:focus:not([disabled])), :host([start-of-range]:not(:focus)), :host([end-of-range]:not(:focus)) { .day { - box-shadow: 0 0 0 2px var(--calcite-ui-foreground-1); + box-shadow: 0 0 0 2px var(--calcite-color-foreground-1); } } @@ -182,7 +182,7 @@ .day-wrapper { &:before, &:after { - background-color: var(--calcite-ui-foreground-current); + background-color: var(--calcite-color-foreground-current); } } } @@ -234,7 +234,7 @@ :host(:hover[range-hover]:not([selected]).focused--start.hover--outside-range), :host(:hover[range-hover]:not([selected]).focused--end.hover--outside-range) { .day { - box-shadow: 0 0 0 2px var(--calcite-ui-foreground-1); + box-shadow: 0 0 0 2px var(--calcite-color-foreground-1); } } diff --git a/packages/calcite-components/src/components/date-picker-month-header/date-picker-month-header.scss b/packages/calcite-components/src/components/date-picker-month-header/date-picker-month-header.scss index 6f480f8c24a..4a2868b70d0 100644 --- a/packages/calcite-components/src/components/date-picker-month-header/date-picker-month-header.scss +++ b/packages/calcite-components/src/components/date-picker-month-header/date-picker-month-header.scss @@ -108,7 +108,7 @@ &:hover { @apply duration-100 ease-in-out; transition-property: outline-color; - outline: 2px solid var(--calcite-ui-border-2); + outline: 2px solid var(--calcite-color-border-2); outline-offset: 2px; } &:focus { diff --git a/packages/calcite-components/src/components/graph/graph.scss b/packages/calcite-components/src/components/graph/graph.scss index 5fe3420c07e..163edac1cdf 100644 --- a/packages/calcite-components/src/components/graph/graph.scss +++ b/packages/calcite-components/src/components/graph/graph.scss @@ -9,7 +9,7 @@ @apply m-0 block h-full w-full p-0; .graph-path--highlight { - fill: var(--calcite-ui-brand); + fill: var(--calcite-color-brand); @apply opacity-50; } } diff --git a/packages/calcite-components/src/components/input-message/input-message.scss b/packages/calcite-components/src/components/input-message/input-message.scss index 55f74a5f91f..d60b5d517fe 100644 --- a/packages/calcite-components/src/components/input-message/input-message.scss +++ b/packages/calcite-components/src/components/input-message/input-message.scss @@ -33,19 +33,19 @@ } :host([status="invalid"]) .calcite-input-message-icon { - color: var(--calcite-ui-danger); + color: var(--calcite-color-danger); } :host([status="warning"]) .calcite-input-message-icon { - color: var(--calcite-ui-warning); + color: var(--calcite-color-warning); } :host([status="valid"]) .calcite-input-message-icon { - color: var(--calcite-ui-success); + color: var(--calcite-color-success); } :host([status="idle"]) .calcite-input-message-icon { - color: var(--calcite-ui-brand); + color: var(--calcite-color-brand); } // Validation Text diff --git a/packages/calcite-components/src/components/link/link.e2e.ts b/packages/calcite-components/src/components/link/link.e2e.ts index e00971caeeb..911b1fd3525 100644 --- a/packages/calcite-components/src/components/link/link.e2e.ts +++ b/packages/calcite-components/src/components/link/link.e2e.ts @@ -268,8 +268,8 @@ describe("calcite-link", () => { page = await newE2EPage({ html: linkHtml }); linkUnderlineStyle = await page.evaluate(() => { link = document.querySelector("calcite-link"); - link.style.setProperty("--calcite-link-blue-underline", "red"); - return window.getComputedStyle(link).getPropertyValue("--calcite-link-blue-underline"); + link.style.setProperty("--calcite-color-brand-underline", "red"); + return window.getComputedStyle(link).getPropertyValue("--calcite-color-brand-underline"); }); expect(linkUnderlineStyle).toEqual("red"); }); @@ -306,7 +306,7 @@ describe("calcite-link", () => { html: ` ${linkHtml} diff --git a/packages/calcite-components/src/components/link/link.scss b/packages/calcite-components/src/components/link/link.scss index 348d304f23d..97eb5aa9f2b 100644 --- a/packages/calcite-components/src/components/link/link.scss +++ b/packages/calcite-components/src/components/link/link.scss @@ -66,7 +66,7 @@ calcite-icon { line-height: inherit; white-space: initial; background-image: linear-gradient(currentColor, currentColor), - linear-gradient(var(--calcite-link-blue-underline), var(--calcite-link-blue-underline)); + linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline)); background-position-x: 0%, 100%; background-position-y: min(1.5em, 100%); background-repeat: no-repeat, no-repeat; diff --git a/packages/calcite-components/src/components/list/list.stories.ts b/packages/calcite-components/src/components/list/list.stories.ts index dc371b3f932..aaeaac3b0d2 100644 --- a/packages/calcite-components/src/components/list/list.stories.ts +++ b/packages/calcite-components/src/components/list/list.stories.ts @@ -223,7 +223,12 @@ export const richContent = (): string => html` - + @@ -231,7 +236,12 @@ export const richContent = (): string => html` - + @@ -243,7 +253,7 @@ export const richContent = (): string => html` scale="s" icon="exclamation-mark-triangle" slot="content-end" - style="color: var(--calcite-ui-danger)" + style="color: var(--calcite-color-danger)" > @@ -256,7 +266,12 @@ export const richContentFilterEnabled = (): string => html` - + @@ -264,7 +279,12 @@ export const richContentFilterEnabled = (): string => html` - + @@ -276,7 +296,7 @@ export const richContentFilterEnabled = (): string => html` scale="s" icon="exclamation-mark-triangle" slot="content-end" - style="color: var(--calcite-ui-danger)" + style="color: var(--calcite-color-danger)" > @@ -290,7 +310,12 @@ export const darkModeRTL_TestOnly = (): string => html` - + @@ -298,7 +323,12 @@ export const darkModeRTL_TestOnly = (): string => html` - + @@ -310,7 +340,7 @@ export const darkModeRTL_TestOnly = (): string => html` scale="s" icon="exclamation-mark-triangle" slot="content-end" - style="color: var(--calcite-ui-danger)" + style="color: var(--calcite-color-danger)" > @@ -365,7 +395,7 @@ export const closableListItems_TestOnly = (): string => html` - + html` - + - + `; @@ -598,16 +628,16 @@ export const filterActions_TestOnly = (): string => html` - + - + - + - + `; @@ -646,16 +676,16 @@ export const sortableList_TestOnly = (): string => html` - + - + - + - + `; diff --git a/packages/calcite-components/src/components/list/usage/Advanced.md b/packages/calcite-components/src/components/list/usage/Advanced.md index 55cd6ce0b22..7cad9725dcd 100644 --- a/packages/calcite-components/src/components/list/usage/Advanced.md +++ b/packages/calcite-components/src/components/list/usage/Advanced.md @@ -8,7 +8,7 @@ slot="content-start" thumbnail="https://slm-assets.secondlife.com/assets/19947929/view_large/Capture_du_2018-03-04_20-40-56.jpg?1520192584" > - + @@ -20,7 +20,7 @@ slot="content-start" thumbnail="https://www.seekpng.com/png/detail/90-906849_89kib-1024x631-finn-finn-adventure-time-face.png" > - + @@ -36,7 +36,7 @@ scale="s" icon="exclamation-mark-triangle" slot="content-end" - style="color: var(--calcite-ui-danger)" + style="color: var(--calcite-color-danger)" > diff --git a/packages/calcite-components/src/components/loader/loader.scss b/packages/calcite-components/src/components/loader/loader.scss index b5f1091d460..ac78005852b 100644 --- a/packages/calcite-components/src/components/loader/loader.scss +++ b/packages/calcite-components/src/components/loader/loader.scss @@ -25,7 +25,7 @@ $loader-circumference: ($loader-scale - (2 * $stroke-width)) * 3.14159; @apply relative mx-auto hidden items-center justify-center opacity-100; min-block-size: var(--calcite-loader-size); font-size: var(--calcite-loader-font-size); - stroke: var(--calcite-ui-brand); + stroke: var(--calcite-color-brand); stroke-width: $stroke-width; fill: none; transform: scale(1, 1); @@ -114,13 +114,13 @@ $loader-circumference: ($loader-scale - (2 * $stroke-width)) * 3.14159; :host([type="determinate"]) { @apply animate-none; - stroke: var(--calcite-ui-border-3); + stroke: var(--calcite-color-border-3); .loader__svgs { @apply animate-none; } .loader__svg--3 { @apply animate-none; - stroke: var(--calcite-ui-brand); + stroke: var(--calcite-color-brand); stroke-dasharray: $loader-circumference; transform: rotate(-90deg); transition: all var(--calcite-internal-animation-timing-fast) linear; @@ -211,16 +211,16 @@ $loader-circumference: ($loader-scale - (2 * $stroke-width)) * 3.14159; @keyframes loader-color-shift { 0% { - stroke: var(--calcite-ui-brand); + stroke: var(--calcite-color-brand); } 33% { - stroke: var(--calcite-ui-brand-press); + stroke: var(--calcite-color-brand-press); } 66% { - stroke: var(--calcite-ui-brand-hover); + stroke: var(--calcite-color-brand-hover); } 100% { - stroke: var(--calcite-ui-brand); + stroke: var(--calcite-color-brand); } } diff --git a/packages/calcite-components/src/components/loader/loader.stories.ts b/packages/calcite-components/src/components/loader/loader.stories.ts index e0169226327..4e6eff6ad9c 100644 --- a/packages/calcite-components/src/components/loader/loader.stories.ts +++ b/packages/calcite-components/src/components/loader/loader.stories.ts @@ -59,9 +59,9 @@ export const customTheme_NoTest = (): string => html` scale="${select("scale", ["s", "m", "l"], "m")}" value="${number("value", 0, { range: true, min: 0, max: 100, step: 1 })}" style=" - --calcite-ui-brand: ${color("calcite-ui-blue-1", "#50ba5f")}; - --calcite-ui-brand-hover: ${color("calcite-ui-blue-2", "#1a6324")}; - --calcite-ui-brand-press: ${color("calcite-ui-blue-3", "#338033")};" + --calcite-color-brand: ${color("--calcite-color-brand", "#50ba5f")}; + --calcite-color-brand-hover: ${color("--calcite-color-brand-hover", "#1a6324")}; + --calcite-color-brand-press: ${color("--calcite-color-brand-press", "#338033")};" /> `; @@ -75,8 +75,8 @@ export const customTheme_TestOnly = (): string => html` scale="${select("scale", ["s", "m", "l"], "m")}" value="${number("value", 0, { range: true, min: 0, max: 100, step: 1 })}" style=" - --calcite-ui-brand: ${color("calcite-ui-blue-1", "#50ba5f")}; - --calcite-ui-brand-hover: ${color("calcite-ui-blue-2", "#1a6324")}; - --calcite-ui-brand-press: ${color("calcite-ui-blue-3", "#338033")};" + --calcite-color-brand: ${color("--calcite-color-brand", "#50ba5f")}; + --calcite-color-brand-hover: ${color("--calcite-color-brand-hover", "#1a6324")}; + --calcite-color-brand-press: ${color("--calcite-color-brand-press", "#338033")};" /> `; diff --git a/packages/calcite-components/src/components/menu-item/menu-item.scss b/packages/calcite-components/src/components/menu-item/menu-item.scss index bc52f472b02..749bb6c93cf 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.scss +++ b/packages/calcite-components/src/components/menu-item/menu-item.scss @@ -63,9 +63,9 @@ :host([active]) .content { @apply text-color-1; - border-color: var(--calcite-ui-brand); + border-color: var(--calcite-color-brand); .icon { - --calcite-ui-icon-color: var(--calcite-ui-brand); + --calcite-ui-icon-color: var(--calcite-color-brand); } } :host([layout="vertical"]) .content { @@ -86,7 +86,7 @@ .icon--dropdown { @apply ms-auto me-0 ps-2 relative; - --calcite-ui-icon-color: var(--calcite-ui-text-3); + --calcite-ui-icon-color: var(--calcite-color-text-3); } :host([layout="vertical"]) .icon--end ~ .icon--dropdown { @@ -106,7 +106,7 @@ .icon--breadcrumb { @apply ps-2 me-0; - --calcite-ui-icon-color: var(--calcite-ui-text-3); + --calcite-ui-icon-color: var(--calcite-color-text-3); } :host([layout="vertical"]) .icon--breadcrumb { @@ -127,12 +127,12 @@ calcite-action { @apply relative h-auto; - border-inline-start: 1px solid var(--calcite-ui-foreground-1); + border-inline-start: 1px solid var(--calcite-color-foreground-1); &:after { @apply block w-px absolute -start-px; content: ""; inset-block: theme("spacing.3"); - background-color: var(--calcite-ui-border-3); + background-color: var(--calcite-color-border-3); } &:hover:after { @apply h-full; @@ -143,7 +143,7 @@ calcite-action { .content:focus ~ calcite-action, .content:hover ~ calcite-action { @apply text-color-1; - border-inline-start: 1px solid var(--calcite-ui-border-3); + border-inline-start: 1px solid var(--calcite-color-border-3); } .container:hover .dropdown-action { @@ -152,8 +152,8 @@ calcite-action { .dropdown-menu-items { @apply absolute h-auto flex-col hidden overflow-visible min-w-full; - border: 1px solid var(--calcite-ui-border-3); - background: var(--calcite-ui-foreground-1); + border: 1px solid var(--calcite-color-border-3); + background: var(--calcite-color-foreground-1); inset-block-start: 100%; z-index: theme("zIndex.dropdown"); &.open { diff --git a/packages/calcite-components/src/components/meter/meter.scss b/packages/calcite-components/src/components/meter/meter.scss index 5d9dbf12e79..217da0f8cb7 100644 --- a/packages/calcite-components/src/components/meter/meter.scss +++ b/packages/calcite-components/src/components/meter/meter.scss @@ -21,14 +21,14 @@ .container { @apply flex relative items-center w-full m-0; block-size: var(--calcite-meter-height-internal); - background-color: var(--calcite-ui-foreground-2); - border: 1px solid var(--calcite-ui-border-3); + background-color: var(--calcite-color-foreground-2); + border: 1px solid var(--calcite-color-border-3); border-radius: var(--calcite-meter-height-internal); } .solid { - border: 1px solid var(--calcite-ui-foreground-3); - background-color: var(--calcite-ui-foreground-3); + border: 1px solid var(--calcite-color-foreground-3); + background-color: var(--calcite-color-foreground-3); } .outline { @@ -46,7 +46,7 @@ .step-line { @apply block absolute inset-y-0; inline-size: var(--calcite-meter-space-internal); - background-color: var(--calcite-ui-border-3); + background-color: var(--calcite-color-border-3); } .label { @@ -61,7 +61,7 @@ .label-value { inset-block-end: calc(100% + 0.5em); font-weight: var(--calcite-font-weight-bold); - color: var(--calcite-ui-text-1); + color: var(--calcite-color-text-1); } .label-range { @@ -88,15 +88,15 @@ } .fill-danger { - background-color: var(--calcite-ui-danger); + background-color: var(--calcite-color-danger); } .fill-success { - background-color: var(--calcite-ui-success); + background-color: var(--calcite-color-success); } .fill-warning { - background-color: var(--calcite-ui-warning); + background-color: var(--calcite-color-warning); } .solid .fill { @@ -104,17 +104,17 @@ inset-inline-start: 0; max-inline-size: 100%; min-inline-size: calc(var(--calcite-meter-height-internal)); - box-shadow: 0 0 0 1px var(--calcite-ui-brand); + box-shadow: 0 0 0 1px var(--calcite-color-brand); } .solid .fill-danger { - box-shadow: 0 0 0 1px var(--calcite-ui-danger); + box-shadow: 0 0 0 1px var(--calcite-color-danger); } .solid .fill-success { - box-shadow: 0 0 0 1px var(--calcite-ui-success); + box-shadow: 0 0 0 1px var(--calcite-color-success); } .solid .fill-warning { - box-shadow: 0 0 0 1px var(--calcite-ui-warning); + box-shadow: 0 0 0 1px var(--calcite-color-warning); } diff --git a/packages/calcite-components/src/components/modal/modal.scss b/packages/calcite-components/src/components/modal/modal.scss index 00cb5216cbf..0d9c1aaf024 100644 --- a/packages/calcite-components/src/components/modal/modal.scss +++ b/packages/calcite-components/src/components/modal/modal.scss @@ -11,13 +11,17 @@ * */ +:host { + --calcite-modal-scrim-background: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)}; +} + :host { @apply absolute flex inset-0 opacity-0 z-overlay; visibility: hidden !important; transition: visibility 0ms linear var(--calcite-internal-animation-timing-slow), opacity var(--calcite-internal-animation-timing-slow) $easing-function; // the modal should always use a dark scrim, regardless of light / dark mode - matches value in global.scss - --calcite-modal-scrim-background-internal: #{rgba($blk-240, 0.85)}; + --calcite-modal-scrim-background-internal: #{rgba($calcite-color-neutral-blk-240, 0.85)}; } .content-top[hidden], @@ -62,7 +66,7 @@ } .scrim { - --calcite-scrim-background: var(--calcite-modal-scrim-background, var(--calcite-modal-scrim-background-internal)); + --calcite-scrim-background: var(--calcite-modal-scrim-background, var(--calcite-color-background-transparent-scrim)); @apply fixed inset-0 flex overflow-y-hidden; } diff --git a/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss b/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss index 9d7053ea7a4..2143fb04c4c 100644 --- a/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss +++ b/packages/calcite-components/src/components/navigation-logo/navigation-logo.scss @@ -47,8 +47,8 @@ :host([active]) .anchor { @apply text-color-1; - border-color: var(--calcite-ui-brand); - --calcite-ui-icon-color: var(--calcite-ui-brand); + border-color: var(--calcite-color-brand); + --calcite-ui-icon-color: var(--calcite-color-brand); } .container { diff --git a/packages/calcite-components/src/components/navigation-logo/navigation-logo.stories.ts b/packages/calcite-components/src/components/navigation-logo/navigation-logo.stories.ts index a21e1e90546..70ae50a89f0 100644 --- a/packages/calcite-components/src/components/navigation-logo/navigation-logo.stories.ts +++ b/packages/calcite-components/src/components/navigation-logo/navigation-logo.stories.ts @@ -55,7 +55,7 @@ export const All_TestOnly = (): string => html` html` - + html` html` - + export const primaryAndSecondarySlots_TestOnly = (): string => html` - + @@ -81,7 +81,7 @@ export const primaryAndSecondarySlots_TestOnly = (): string => export const primaryWithAllLogoAndUserSlots_TestOnly = (): string => html` - + @@ -96,7 +96,7 @@ export const primaryWithAllLogoAndUserSlots_TestOnly = (): string => export const allSlots_TestOnly = (): string => html` - + @@ -137,7 +137,7 @@ export const allSlots_TestOnly = (): string => export const allSlots_darkModeRTL_TestOnly = (): string => html`
- + diff --git a/packages/calcite-components/src/components/notice/notice.scss b/packages/calcite-components/src/components/notice/notice.scss index 634ebbd0427..674deca70a9 100644 --- a/packages/calcite-components/src/components/notice/notice.scss +++ b/packages/calcite-components/src/components/notice/notice.scss @@ -163,8 +163,8 @@ @apply flex self-stretch; } -$noticeKinds: "brand" var(--calcite-ui-brand), "info" var(--calcite-ui-info), "danger" var(--calcite-ui-danger), - "success" var(--calcite-ui-success), "warning" var(--calcite-ui-warning); +$noticeKinds: "brand" var(--calcite-color-brand), "info" var(--calcite-color-info), "danger" var(--calcite-color-danger), + "success" var(--calcite-color-success), "warning" var(--calcite-color-warning); @each $noticeKind in $noticeKinds { $name: nth($noticeKind, 1); diff --git a/packages/calcite-components/src/components/panel/panel.scss b/packages/calcite-components/src/components/panel/panel.scss index 32b07ce7154..495cf865396 100644 --- a/packages/calcite-components/src/components/panel/panel.scss +++ b/packages/calcite-components/src/components/panel/panel.scss @@ -31,7 +31,7 @@ .header { @apply bg-foreground-1 flex flex-col z-header; - border-block-end: var(--calcite-panel-header-border-block-end, 1px solid var(--calcite-ui-border-3)); + border-block-end: var(--calcite-panel-header-border-block-end, 1px solid var(--calcite-color-border-3)); } .header-container { @@ -42,7 +42,7 @@ } .header-container--border-end { - border-block-end: 1px solid var(--calcite-ui-border-3); + border-block-end: 1px solid var(--calcite-color-border-3); } .action-bar-container { @@ -114,7 +114,7 @@ flex: 0 0 auto; padding: var(--calcite-panel-footer-padding, theme("spacing.2")); - border-block-start: 1px solid var(--calcite-ui-border-3); + border-block-start: 1px solid var(--calcite-color-border-3); } .fab-container { diff --git a/packages/calcite-components/src/components/popover/popover.scss b/packages/calcite-components/src/components/popover/popover.scss index 4a47ae21567..56a721d6bc1 100644 --- a/packages/calcite-components/src/components/popover/popover.scss +++ b/packages/calcite-components/src/components/popover/popover.scss @@ -54,7 +54,7 @@ } .arrow::before { - outline: 1px solid var(--calcite-ui-border-3); + outline: 1px solid var(--calcite-color-border-3); } .header { diff --git a/packages/calcite-components/src/components/popover/popover.stories.ts b/packages/calcite-components/src/components/popover/popover.stories.ts index 2d730e4e348..fc6d93782b3 100644 --- a/packages/calcite-components/src/components/popover/popover.stories.ts +++ b/packages/calcite-components/src/components/popover/popover.stories.ts @@ -176,8 +176,8 @@ export const largeScaleLayout_TestOnly = (): string => html` export const transparentBG_TestOnly = (): string => html`
diff --git a/packages/calcite-components/src/components/progress/progress.scss b/packages/calcite-components/src/components/progress/progress.scss index 1e83f4fd19d..7302fbcfde9 100644 --- a/packages/calcite-components/src/components/progress/progress.scss +++ b/packages/calcite-components/src/components/progress/progress.scss @@ -42,7 +42,7 @@ .text { @apply text-n2h px-0 pt-4 pb-0 text-center font-medium; - color: var(--calcite-ui-text-2); + color: var(--calcite-color-text-2); } @keyframes looping-progress-bar-ani { diff --git a/packages/calcite-components/src/components/radio-button/radio-button.scss b/packages/calcite-components/src/components/radio-button/radio-button.scss index 2d2db9682ac..0f68c2027c4 100644 --- a/packages/calcite-components/src/components/radio-button/radio-button.scss +++ b/packages/calcite-components/src/components/radio-button/radio-button.scss @@ -5,14 +5,14 @@ } .radio { @apply bg-foreground-1 cursor-pointer focus-base rounded-full transition-default; - box-shadow: inset 0 0 0 1px var(--calcite-ui-border-input); + box-shadow: inset 0 0 0 1px var(--calcite-color-border-input); } } :host([hovered]), :host(:not([checked])[focused]:not([disabled])) { .radio { - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand); } } @@ -30,7 +30,7 @@ :host([hovered][disabled]) { .radio { - box-shadow: inset 0 0 0 1px var(--calcite-ui-border-input); + box-shadow: inset 0 0 0 1px var(--calcite-color-border-input); } } @@ -53,34 +53,34 @@ :host([scale="s"][checked]), :host([hovered][scale="s"][checked][disabled]) { .radio { - box-shadow: inset 0 0 0 4px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 4px var(--calcite-color-brand); } } :host([scale="s"][focused][checked]:not([disabled])) { .radio { - box-shadow: inset 0 0 0 4px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1); + box-shadow: inset 0 0 0 4px var(--calcite-color-brand), 0 0 0 2px var(--calcite-color-foreground-1); } } :host([scale="m"][checked]), :host([hovered][scale="m"][checked][disabled]) { .radio { - box-shadow: inset 0 0 0 5px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 5px var(--calcite-color-brand); } } :host([scale="m"][focused][checked]:not([disabled])) { .radio { - box-shadow: inset 0 0 0 5px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1); + box-shadow: inset 0 0 0 5px var(--calcite-color-brand), 0 0 0 2px var(--calcite-color-foreground-1); } } :host([scale="l"][checked]), :host([hovered][scale="l"][checked][disabled]) { .radio { - box-shadow: inset 0 0 0 6px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 6px var(--calcite-color-brand); } } :host([scale="l"][focused][checked]:not([disabled])) { .radio { - box-shadow: inset 0 0 0 6px var(--calcite-ui-brand), 0 0 0 2px var(--calcite-ui-foreground-1); + box-shadow: inset 0 0 0 6px var(--calcite-color-brand), 0 0 0 2px var(--calcite-color-foreground-1); } } diff --git a/packages/calcite-components/src/components/rating/rating.scss b/packages/calcite-components/src/components/rating/rating.scss index 88afa73f4ea..3f6069c490a 100644 --- a/packages/calcite-components/src/components/rating/rating.scss +++ b/packages/calcite-components/src/components/rating/rating.scss @@ -87,7 +87,7 @@ calcite-chip { } .number--count { - color: var(--calcite-ui-text-2); + color: var(--calcite-color-text-2); font-style: italic; &:not(:first-child) { margin-inline-start: var(--calcite-rating-spacing-unit); diff --git a/packages/calcite-components/src/components/scrim/scrim.e2e.ts b/packages/calcite-components/src/components/scrim/scrim.e2e.ts index f4d28f05c3c..85fce34760b 100644 --- a/packages/calcite-components/src/components/scrim/scrim.e2e.ts +++ b/packages/calcite-components/src/components/scrim/scrim.e2e.ts @@ -263,13 +263,13 @@ describe("calcite-scrim", () => { }); }); - it("should allow the CSS custom property to be overridden when applied to :root", async () => { + it("should allow the CSS custom property to be overridden when parent token is altered at :root", async () => { const overrideStyle = "rgb(128, 0, 128)"; page = await newE2EPage({ html: ` ${scrimSnippet} diff --git a/packages/calcite-components/src/components/scrim/scrim.scss b/packages/calcite-components/src/components/scrim/scrim.scss index 052028d9978..e52e6f9bce2 100644 --- a/packages/calcite-components/src/components/scrim/scrim.scss +++ b/packages/calcite-components/src/components/scrim/scrim.scss @@ -5,6 +5,9 @@ * * @prop --calcite-scrim-background: Specifies the background color of the scrim. */ +:host { + --calcite-scrim-background: var(--calcite-color-background-transparent-scrim); +} :host { @apply absolute @@ -36,7 +39,7 @@ justify-center overflow-hidden; animation: calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out; - background-color: var(--calcite-scrim-background, var(--calcite-scrim-background-internal)); + background-color: var(--calcite-scrim-background, var(--calcite-color-background-transparent-scrim)); } .content { diff --git a/packages/calcite-components/src/components/segmented-control/segmented-control.scss b/packages/calcite-components/src/components/segmented-control/segmented-control.scss index f3234b02f98..54c7e164313 100644 --- a/packages/calcite-components/src/components/segmented-control/segmented-control.scss +++ b/packages/calcite-components/src/components/segmented-control/segmented-control.scss @@ -1,7 +1,7 @@ :host { @apply bg-foreground-1 flex; inline-size: fit-content; - outline: 1px solid var(--calcite-ui-border-input); + outline: 1px solid var(--calcite-color-border-input); outline-offset: -1px; } diff --git a/packages/calcite-components/src/components/shell-panel/shell-panel.scss b/packages/calcite-components/src/components/shell-panel/shell-panel.scss index a5d4809e82c..d5ff56678dd 100755 --- a/packages/calcite-components/src/components/shell-panel/shell-panel.scss +++ b/packages/calcite-components/src/components/shell-panel/shell-panel.scss @@ -111,7 +111,7 @@ :host(:focus-within) { .separator:not(:hover):not(:focus) { @apply opacity-100; - background-color: var(--calcite-ui-border-3); + background-color: var(--calcite-color-border-3); } } @@ -126,7 +126,7 @@ outline: none; &:hover { @apply opacity-100; - background-color: var(--calcite-ui-border-2); + background-color: var(--calcite-color-border-2); } &:focus { @apply bg-brand opacity-100; diff --git a/packages/calcite-components/src/components/slider/slider.scss b/packages/calcite-components/src/components/slider/slider.scss index 92654ad49e2..2bd14355e9a 100644 --- a/packages/calcite-components/src/components/slider/slider.scss +++ b/packages/calcite-components/src/components/slider/slider.scss @@ -54,7 +54,7 @@ @include disabled() { .track__range, .tick--active { - background-color: var(--calcite-ui-text-3); + background-color: var(--calcite-color-text-3); } } @@ -124,7 +124,7 @@ rounded-full; block-size: var(--calcite-slider-handle-size); inline-size: var(--calcite-slider-handle-size); - box-shadow: 0 0 0 2px var(--calcite-ui-text-3) inset; + box-shadow: 0 0 0 2px var(--calcite-color-text-3) inset; transition: border var(--calcite-internal-animation-timing-medium) ease, background-color var(--calcite-internal-animation-timing-medium) ease, box-shadow var(--calcite-animation-timing) ease; @@ -133,12 +133,12 @@ .handle-extension { @apply w-0.5; block-size: var(--calcite-slider-handle-extension-height); - background-color: var(--calcite-ui-text-3); + background-color: var(--calcite-color-text-3); } &:hover { .handle { - box-shadow: 0 0 0 3px var(--calcite-ui-brand) inset; + box-shadow: 0 0 0 3px var(--calcite-color-brand) inset; } .handle-extension { @apply bg-brand; @@ -227,7 +227,7 @@ .track { @apply relative h-0.5 rounded-none; - background-color: var(--calcite-ui-border-2); + background-color: var(--calcite-color-border-2); transition: all var(--calcite-internal-animation-timing-medium) ease-in; } @@ -280,8 +280,8 @@ w-0.5 border border-solid; - background-color: var(--calcite-ui-border-input); - border-color: var(--calcite-ui-foreground-1); + background-color: var(--calcite-color-border-input); + border-color: var(--calcite-color-foreground-1); inset-block-start: -2px; pointer-events: none; margin-inline-start: calc(-1 * theme("margin[0.5]")); @@ -315,7 +315,7 @@ } .graph { - color: var(--calcite-ui-foreground-3); + color: var(--calcite-color-foreground-3); block-size: 48px; } diff --git a/packages/calcite-components/src/components/split-button/split-button.scss b/packages/calcite-components/src/components/split-button/split-button.scss index c6e9a3b94ae..e7d10059492 100644 --- a/packages/calcite-components/src/components/split-button/split-button.scss +++ b/packages/calcite-components/src/components/split-button/split-button.scss @@ -28,7 +28,7 @@ --calcite-split-button-divider: theme("colors.color.1"); } &:host([kind="inverse"]) { - --calcite-split-button-background: var(--calcite-ui-inverse); + --calcite-split-button-background: var(--calcite-color-inverse); --calcite-split-button-divider: theme("colors.background.foreground.1"); } } @@ -73,7 +73,7 @@ --calcite-split-button-background: theme("borderColor.color.1"); } &:host([kind="inverse"]) { - --calcite-split-button-divider: var(--calcite-ui-inverse); + --calcite-split-button-divider: var(--calcite-color-inverse); } } diff --git a/packages/calcite-components/src/components/switch/switch.scss b/packages/calcite-components/src/components/switch/switch.scss index 1d0f000be29..3f21c124d93 100644 --- a/packages/calcite-components/src/components/switch/switch.scss +++ b/packages/calcite-components/src/components/switch/switch.scss @@ -89,7 +89,7 @@ :host(:focus) { .handle { @apply border-color-brand; - box-shadow: inset 0 0 0 1px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 1px var(--calcite-color-brand); } } @@ -109,7 +109,7 @@ } .handle { @apply border-color-brand-hover; - box-shadow: inset 0 0 0 1px var(--calcite-ui-brand-hover); + box-shadow: inset 0 0 0 1px var(--calcite-color-brand-hover); } } diff --git a/packages/calcite-components/src/components/tab-title/tab-title.scss b/packages/calcite-components/src/components/tab-title/tab-title.scss index 9baf21af777..0592dd9e5b5 100644 --- a/packages/calcite-components/src/components/tab-title/tab-title.scss +++ b/packages/calcite-components/src/components/tab-title/tab-title.scss @@ -176,19 +176,19 @@ &:focus { @apply focus-inset; - // ⚠️overriding outline-offset should be avoided as it won't honor --calcite-ui-focus-offset-invert + // ⚠️overriding outline-offset should be avoided as it won't honor --calcite-color-focus-offset-invert outline-offset: -1px; } &:focus, &:hover { @apply text-color-1; - background-color: var(--calcite-ui-foreground-2); + background-color: var(--calcite-color-foreground-2); } &:active { @apply text-color-1; - background-color: var(--calcite-ui-foreground-3); + background-color: var(--calcite-color-foreground-3); } & calcite-icon { @@ -209,11 +209,11 @@ } :host([bordered][selected]) { - box-shadow: inset 0px -2px var(--calcite-ui-foreground-1); + box-shadow: inset 0px -2px var(--calcite-color-foreground-1); } :host([bordered][selected][position="bottom"]) { - box-shadow: inset 0 2px 0 var(--calcite-ui-foreground-1); + box-shadow: inset 0 2px 0 var(--calcite-color-foreground-1); } :host([bordered]:hover), @@ -226,7 +226,7 @@ :host([bordered]:hover) { .container { - background-color: var(--calcite-button-transparent-hover); + background-color: var(--calcite-color-background-transparent-hover); } } @@ -249,8 +249,8 @@ } :host([selected][bordered]) .container { - border-inline-start-color: var(--calcite-ui-border-1); - border-inline-end-color: var(--calcite-ui-border-1); + border-inline-start-color: var(--calcite-color-border-1); + border-inline-end-color: var(--calcite-color-border-1); } :host([bordered]) { diff --git a/packages/calcite-components/src/components/table-cell/table-cell.scss b/packages/calcite-components/src/components/table-cell/table-cell.scss index 5686771fd3b..c8f1206a6ec 100644 --- a/packages/calcite-components/src/components/table-cell/table-cell.scss +++ b/packages/calcite-components/src/components/table-cell/table-cell.scss @@ -28,7 +28,7 @@ td { @apply text-start focus-base align-middle text-color-1 whitespace-normal; background: var(--calcite-internal-table-cell-background); - border-inline-end: 1px solid var(--calcite-ui-border-3); + border-inline-end: 1px solid var(--calcite-color-border-3); font-size: var(--calcite-internal-table-cell-font-size); &:focus { @apply focus-inset; @@ -42,12 +42,12 @@ td { .footer-cell { @apply bg-background font-medium text-color-1; - border-block-start: 1px solid var(--calcite-ui-border-3); + border-block-start: 1px solid var(--calcite-color-border-3); } .number-cell, .selection-cell { - border-inline-end: 1px solid var(--calcite-ui-border-3); + border-inline-end: 1px solid var(--calcite-color-border-3); inline-size: 2rem; min-inline-size: 2rem; } @@ -58,20 +58,20 @@ td { } .selected-cell:not(.number-cell):not(.footer-cell) { - --calcite-table-cell-background: var(--calcite-ui-foreground-current); - background: var(--calcite-ui-foreground-current); + --calcite-table-cell-background: var(--calcite-color-foreground-current); + background: var(--calcite-color-foreground-current); } .selection-cell.selected-cell { - box-shadow: inset 0.25rem 0 0 0 var(--calcite-ui-brand); - color: var(--calcite-ui-brand); + box-shadow: inset 0.25rem 0 0 0 var(--calcite-color-brand); + color: var(--calcite-color-brand); & calcite-icon { - color: var(--calcite-ui-brand); + color: var(--calcite-color-brand); } } .calcite--rtl.selection-cell.selected-cell { - box-shadow: inset -0.25rem 0 0 0 var(--calcite-ui-brand); + box-shadow: inset -0.25rem 0 0 0 var(--calcite-color-brand); } .selection-cell { diff --git a/packages/calcite-components/src/components/table-header/table-header.scss b/packages/calcite-components/src/components/table-header/table-header.scss index c75490ef772..e332805ac95 100644 --- a/packages/calcite-components/src/components/table-header/table-header.scss +++ b/packages/calcite-components/src/components/table-header/table-header.scss @@ -8,8 +8,8 @@ */ :host { - --calcite-internal-table-header-background: var(--calcite-table-header-background, var(--calcite-ui-foreground-2)); - --calcite-internal-table-header-border-color: var(--calcite-table-border-color, var(--calcite-ui-border-3)); + --calcite-internal-table-header-background: var(--calcite-table-header-background, var(--calcite-color-foreground-2)); + --calcite-internal-table-header-border-color: var(--calcite-table-border-color, var(--calcite-color-border-3)); @apply contents; } @@ -60,7 +60,7 @@ th.footer-row { } .selection-cell calcite-icon.active { - color: var(--calcite-ui-brand); + color: var(--calcite-color-brand); } .number-cell calcite-icon, .selection-cell calcite-icon { diff --git a/packages/calcite-components/src/components/table-row/table-row.scss b/packages/calcite-components/src/components/table-row/table-row.scss index 4b2454beb89..ba215e00d8a 100644 --- a/packages/calcite-components/src/components/table-row/table-row.scss +++ b/packages/calcite-components/src/components/table-row/table-row.scss @@ -8,7 +8,7 @@ */ :host { - --calcite-internal-table-row-background: var(--calcite-table-row-background, var(--calcite-ui-foreground-1)); + --calcite-internal-table-row-background: var(--calcite-table-row-background, var(--calcite-color-foreground-1)); --calcite-internal-table-row-border-color: var(--calcite-table-row-border-color, transparent); @apply contents; } diff --git a/packages/calcite-components/src/components/table/table.scss b/packages/calcite-components/src/components/table/table.scss index 55136dc1e92..48c20fc0a76 100644 --- a/packages/calcite-components/src/components/table/table.scss +++ b/packages/calcite-components/src/components/table/table.scss @@ -28,7 +28,7 @@ } .table-container:not(.bordered) { - border-block-end: 1px solid var(--calcite-ui-border-3); + border-block-end: 1px solid var(--calcite-color-border-3); } .assistive-text { @@ -38,13 +38,13 @@ table { @apply w-full border-collapse; overflow-x: scroll; - border-block-start: 1px solid var(--calcite-ui-border-3); - border-inline-start: 1px solid var(--calcite-ui-border-3); - border-block-end: 1px solid var(--calcite-ui-border-3); + border-block-start: 1px solid var(--calcite-color-border-3); + border-inline-start: 1px solid var(--calcite-color-border-3); + border-block-end: 1px solid var(--calcite-color-border-3); } tbody { - border-block-end: 1px solid var(--calcite-ui-border-3); + border-block-end: 1px solid var(--calcite-color-border-3); } .table--fixed { @@ -53,13 +53,13 @@ tbody { .bordered { ::slotted(calcite-table-row) { - --calcite-table-row-border-color: var(--calcite-ui-border-3); + --calcite-table-row-border-color: var(--calcite-color-border-3); } } .zebra { ::slotted(calcite-table-row:nth-child(2n + 1)) { - --calcite-table-row-background: var(--calcite-ui-foreground-2); + --calcite-table-row-background: var(--calcite-color-foreground-2); } } .selection-actions { diff --git a/packages/calcite-components/src/components/tabs/tabs.scss b/packages/calcite-components/src/components/tabs/tabs.scss index 8a64e20321d..a709f739ab1 100644 --- a/packages/calcite-components/src/components/tabs/tabs.scss +++ b/packages/calcite-components/src/components/tabs/tabs.scss @@ -3,8 +3,8 @@ } :host([bordered]) { - box-shadow: inset 0 1px 0 var(--calcite-ui-border-1); - background-color: var(--calcite-ui-foreground-1); + box-shadow: inset 0 1px 0 var(--calcite-color-border-1); + background-color: var(--calcite-color-foreground-1); } :host([bordered]:not([position="bottom"])) ::slotted(calcite-tab-nav) { @@ -12,7 +12,7 @@ } :host([bordered][position="bottom"]) { - box-shadow: inset 0 1px 0 var(--calcite-ui-border-1), inset 0 -1px 0 var(--calcite-ui-border-1); + box-shadow: inset 0 1px 0 var(--calcite-color-border-1), inset 0 -1px 0 var(--calcite-color-border-1); } :host([bordered]) section { diff --git a/packages/calcite-components/src/components/text-area/text-area.scss b/packages/calcite-components/src/components/text-area/text-area.scss index 281c15cfe57..3318b5e8c0d 100644 --- a/packages/calcite-components/src/components/text-area/text-area.scss +++ b/packages/calcite-components/src/components/text-area/text-area.scss @@ -17,7 +17,7 @@ textarea { w-full m-0; min-inline-size: theme("spacing.48"); - border-block-end: 1px solid var(--calcite-ui-border-3); + border-block-end: 1px solid var(--calcite-color-border-3); @media screen and (max-width: 480px) { @apply resize-none; } diff --git a/packages/calcite-components/src/components/tile-select/tile-select.scss b/packages/calcite-components/src/components/tile-select/tile-select.scss index 7d298cdfa13..a6c262448da 100644 --- a/packages/calcite-components/src/components/tile-select/tile-select.scss +++ b/packages/calcite-components/src/components/tile-select/tile-select.scss @@ -4,8 +4,8 @@ $spacing: $baseline * 0.5; @apply block; .container { - background-color: var(--calcite-ui-foreground-1); - box-shadow: 0 0 0 1px var(--calcite-ui-border-2); + background-color: var(--calcite-color-foreground-1); + box-shadow: 0 0 0 1px var(--calcite-color-border-2); box-sizing: border-box; cursor: pointer; display: inline-block; @@ -18,7 +18,7 @@ $spacing: $baseline * 0.5; &.checked { @apply z-default; - box-shadow: 0 0 0 1px var(--calcite-ui-brand); + box-shadow: 0 0 0 1px var(--calcite-color-brand); } &.heading-only { @@ -38,7 +38,7 @@ $spacing: $baseline * 0.5; &:not(.input-enabled) { @apply focus-inset; outline-offset: -4px; - box-shadow: 0 0 0 1px var(--calcite-ui-brand), inset 0 0 0 2px var(--calcite-ui-foreground-1); + box-shadow: 0 0 0 1px var(--calcite-color-brand), inset 0 0 0 2px var(--calcite-color-foreground-1); } } } @@ -123,7 +123,7 @@ $spacing: $baseline * 0.5; :host(:hover) { .container { &:not(.input-enabled) { - box-shadow: 0 0 0 1px var(--calcite-ui-brand); + box-shadow: 0 0 0 1px var(--calcite-color-brand); } } } diff --git a/packages/calcite-components/src/components/tile/tile.scss b/packages/calcite-components/src/components/tile/tile.scss index c50c0e01eec..b33f35b425b 100644 --- a/packages/calcite-components/src/components/tile/tile.scss +++ b/packages/calcite-components/src/components/tile/tile.scss @@ -81,19 +81,19 @@ :host([href]:hover) { .heading { @apply underline; - color: var(--calcite-ui-text-link); + color: var(--calcite-color-text-link); } } :host(:not([embed])) { @apply p-3; - box-shadow: 0 0 0 1px var(--calcite-ui-border-2); + box-shadow: 0 0 0 1px var(--calcite-color-border-2); } :host(:not([embed])[href]:hover) { @apply cursor-pointer; - box-shadow: 0 0 0 2px var(--calcite-ui-brand); + box-shadow: 0 0 0 2px var(--calcite-color-brand); } :host(:not([embed])[href]:active) { - box-shadow: 0 0 0 3px var(--calcite-ui-brand); + box-shadow: 0 0 0 3px var(--calcite-color-brand); } :host([icon][heading]:not([description]):not([embed])) { @apply p-0; diff --git a/packages/calcite-components/src/components/time-picker/time-picker.scss b/packages/calcite-components/src/components/time-picker/time-picker.scss index ca3cccf73e5..e912cbd0fcf 100644 --- a/packages/calcite-components/src/components/time-picker/time-picker.scss +++ b/packages/calcite-components/src/components/time-picker/time-picker.scss @@ -63,7 +63,7 @@ justify-center font-medium; &:hover { - box-shadow: inset 0 0 0 2px var(--calcite-ui-foreground-2); + box-shadow: inset 0 0 0 2px var(--calcite-color-foreground-2); z-index: theme("zIndex.header"); } &:focus, @@ -73,7 +73,7 @@ } &.inputFocus, &:hover.inputFocus { - box-shadow: inset 0 0 0 2px var(--calcite-ui-brand); + box-shadow: inset 0 0 0 2px var(--calcite-color-brand); z-index: theme("zIndex.header"); } } diff --git a/packages/calcite-components/src/components/tooltip/tooltip.scss b/packages/calcite-components/src/components/tooltip/tooltip.scss index 231052459f3..2e86e260154 100644 --- a/packages/calcite-components/src/components/tooltip/tooltip.scss +++ b/packages/calcite-components/src/components/tooltip/tooltip.scss @@ -36,7 +36,7 @@ } .arrow::before { - outline: 1px solid var(--calcite-ui-border-3); + outline: 1px solid var(--calcite-color-border-3); } @include base-component(); diff --git a/packages/calcite-components/src/components/tooltip/tooltip.stories.ts b/packages/calcite-components/src/components/tooltip/tooltip.stories.ts index 7c4f926c2ad..49eb2566b9f 100644 --- a/packages/calcite-components/src/components/tooltip/tooltip.stories.ts +++ b/packages/calcite-components/src/components/tooltip/tooltip.stories.ts @@ -76,8 +76,8 @@ export const rightAligned_TestOnly = (): string => html`
diff --git a/packages/calcite-components/src/components/tree-item/tree-item.scss b/packages/calcite-components/src/components/tree-item/tree-item.scss index 00592dc0a77..571ef73c3bd 100644 --- a/packages/calcite-components/src/components/tree-item/tree-item.scss +++ b/packages/calcite-components/src/components/tree-item/tree-item.scss @@ -80,7 +80,7 @@ // ensure lines don't overlap focus outline block-size: 96%; content: ""; - background-color: var(--calcite-ui-border-2); + background-color: var(--calcite-color-border-2); } } @@ -159,7 +159,7 @@ .checkmark, .bullet-point { @apply transition-default opacity-0; - color: var(--calcite-ui-border-1); + color: var(--calcite-color-border-1); } } @@ -242,7 +242,7 @@ :host([selected]) { .checkmark, .bullet-point { - color: var(--calcite-ui-brand); + color: var(--calcite-color-brand); } } diff --git a/packages/calcite-components/src/custom-theme.md b/packages/calcite-components/src/custom-theme.md index df6bf3246fa..7e444cc08fe 100644 --- a/packages/calcite-components/src/custom-theme.md +++ b/packages/calcite-components/src/custom-theme.md @@ -5,7 +5,7 @@ Developers building Esri applications are encouraged to use the default theme as ```html
diff --git a/packages/calcite-components/src/demos/_assets/demo-template.css b/packages/calcite-components/src/demos/_assets/demo-template.css index 18e6c22f603..9e9ee4c00e3 100644 --- a/packages/calcite-components/src/demos/_assets/demo-template.css +++ b/packages/calcite-components/src/demos/_assets/demo-template.css @@ -1,13 +1,13 @@ .demo-header { direction: ltr; flex-wrap: nowrap; - border-bottom: 1px solid var(--calcite-ui-border-3); + border-bottom: 1px solid var(--calcite-color-border-3); align-items: stretch; display: flex; margin-bottom: 1em; position: sticky; top: 0; - background-color: var(--calcite-ui-background); + background-color: var(--calcite-color-background); z-index: 999; } @@ -21,12 +21,12 @@ align-items: center; display: flex; flex: 1 0 auto; - border-left: 1px solid var(--calcite-ui-border-3); - border-right: 1px solid var(--calcite-ui-border-3); + border-left: 1px solid var(--calcite-color-border-3); + border-right: 1px solid var(--calcite-color-border-3); } .demo-heading { - color: var(--calcite-ui-text-1); + color: var(--calcite-color-text-1); font-size: 1.25rem; font-weight: 500; margin: 0; @@ -39,7 +39,7 @@ display: grid; grid-template-columns: auto auto auto; padding: 1rem 2rem; - border-right: 1px solid var(--calcite-ui-border-3); + border-right: 1px solid var(--calcite-color-border-3); } .demo-switches__label { diff --git a/packages/calcite-components/src/demos/_assets/demos.css b/packages/calcite-components/src/demos/_assets/demos.css index d586fedc244..4fdcba1cc2a 100644 --- a/packages/calcite-components/src/demos/_assets/demos.css +++ b/packages/calcite-components/src/demos/_assets/demos.css @@ -1,6 +1,6 @@ body { margin: 0; - background-color: var(--calcite-ui-background); + background-color: var(--calcite-color-background); } main { @@ -10,7 +10,7 @@ main { } .example-container { - color: var(--calcite-ui-text-1); + color: var(--calcite-color-text-1); max-width: 1024px; min-width: 280px; width: 70vw; @@ -52,7 +52,7 @@ main { } #calcite-demo { - color: var(--calcite-ui-brand-press); + color: var(--calcite-color-brand-press); } .examples-github-storybook { @@ -79,7 +79,7 @@ main { } .calcite-comp { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/accordion.html b/packages/calcite-components/src/demos/accordion.html index e93bea73511..790296198d7 100644 --- a/packages/calcite-components/src/demos/accordion.html +++ b/packages/calcite-components/src/demos/accordion.html @@ -14,7 +14,7 @@ .child { flex: 0 0 20%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -27,7 +27,7 @@ hr { margin: 56px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } .demo-background-dark { diff --git a/packages/calcite-components/src/demos/action.html b/packages/calcite-components/src/demos/action.html index 3e17cf8bf88..0f506993b11 100644 --- a/packages/calcite-components/src/demos/action.html +++ b/packages/calcite-components/src/demos/action.html @@ -20,7 +20,7 @@ .child, .child-action-bar { margin: 10px 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -45,7 +45,7 @@ hr { margin: 56px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/alert.html b/packages/calcite-components/src/demos/alert.html index c117b9538cd..e2e9d56fbc1 100644 --- a/packages/calcite-components/src/demos/alert.html +++ b/packages/calcite-components/src/demos/alert.html @@ -54,7 +54,7 @@ .first-container, .second-container > div { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/avatar.html b/packages/calcite-components/src/demos/avatar.html index 91f3acf3f11..271da9fec14 100644 --- a/packages/calcite-components/src/demos/avatar.html +++ b/packages/calcite-components/src/demos/avatar.html @@ -17,7 +17,7 @@ .child { flex: 1 0 21%; margin: 0 15px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/block.html b/packages/calcite-components/src/demos/block.html index 27a527878a9..ec6185338f4 100644 --- a/packages/calcite-components/src/demos/block.html +++ b/packages/calcite-components/src/demos/block.html @@ -17,7 +17,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -31,7 +31,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/button.html b/packages/calcite-components/src/demos/button.html index 28a4ff67a5d..901f28f6ea4 100644 --- a/packages/calcite-components/src/demos/button.html +++ b/packages/calcite-components/src/demos/button.html @@ -24,7 +24,7 @@ .custom-defined-onsubmit, .icon-slot, span { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-weight: var(--calcite-font-weight-medium); } @@ -87,7 +87,7 @@ } hr { - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/card.html b/packages/calcite-components/src/demos/card.html index 69618d0ecc0..933f29c8d9e 100644 --- a/packages/calcite-components/src/demos/card.html +++ b/packages/calcite-components/src/demos/card.html @@ -10,7 +10,7 @@ display: flex; flex-wrap: wrap; flex-direction: row; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/checkbox.html b/packages/calcite-components/src/demos/checkbox.html index f6fb4222246..b9434aa040e 100644 --- a/packages/calcite-components/src/demos/checkbox.html +++ b/packages/calcite-components/src/demos/checkbox.html @@ -16,7 +16,7 @@ .child { flex: 1 0 21%; padding: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/chip-group.html b/packages/calcite-components/src/demos/chip-group.html index 8592909ec40..7b87a55d06b 100644 --- a/packages/calcite-components/src/demos/chip-group.html +++ b/packages/calcite-components/src/demos/chip-group.html @@ -24,7 +24,7 @@ .child { flex: 0 0 15%; margin: 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -43,8 +43,8 @@ } .icon-search calcite-chip { - --calcite-ui-brand: #974dff; - --calcite-ui-text-1: var(--calcite-ui-text-1); + --calcite-color-brand: #974dff; + --calcite-color-text-1: var(--calcite-color-text-1); } .icon-search calcite-chip[selected] { @@ -52,73 +52,73 @@ } .themed-children calcite-chip:first-of-type { - --calcite-ui-brand: var(--calcite-ui-danger); - --calcite-ui-text-1: var(--calcite-ui-danger); - --calcite-ui-border-1: var(--calcite-ui-danger); - --calcite-ui-foreground-1: rgba(255, 0, 0, 0.15); + --calcite-color-brand: var(--calcite-color-danger); + --calcite-color-text-1: var(--calcite-color-danger); + --calcite-color-border-1: var(--calcite-color-danger); + --calcite-color-foreground-1: rgba(255, 0, 0, 0.15); } .themed-children calcite-chip:nth-of-type(2) { - --calcite-ui-brand: var(--calcite-ui-success); - --calcite-ui-text-1: var(--calcite-ui-success); - --calcite-ui-border-1: var(--calcite-ui-success); - --calcite-ui-foreground-1: rgba(0, 128, 0, 0.15); + --calcite-color-brand: var(--calcite-color-success); + --calcite-color-text-1: var(--calcite-color-success); + --calcite-color-border-1: var(--calcite-color-success); + --calcite-color-foreground-1: rgba(0, 128, 0, 0.15); } .themed-children calcite-chip:nth-of-type(3) { - --calcite-ui-brand: var(--calcite-ui-info); - --calcite-ui-text-1: var(--calcite-ui-info); - --calcite-ui-border-1: var(--calcite-ui-info); - --calcite-ui-foreground-1: rgba(0, 0, 255, 0.15); + --calcite-color-brand: var(--calcite-color-info); + --calcite-color-text-1: var(--calcite-color-info); + --calcite-color-border-1: var(--calcite-color-info); + --calcite-color-foreground-1: rgba(0, 0, 255, 0.15); } .themed-children calcite-chip:nth-of-type(4) { - --calcite-ui-brand: orange; - --calcite-ui-text-1: orange; - --calcite-ui-border-1: orange; - --calcite-ui-foreground-1: rgba(255, 165, 0, 0.15); + --calcite-color-brand: orange; + --calcite-color-text-1: orange; + --calcite-color-border-1: orange; + --calcite-color-foreground-1: rgba(255, 165, 0, 0.15); } .themed-children calcite-chip:nth-of-type(5) { - --calcite-ui-brand: purple; - --calcite-ui-text-1: purple; - --calcite-ui-border-1: purple; - --calcite-ui-foreground-1: rgba(128, 0, 128, 0.15); + --calcite-color-brand: purple; + --calcite-color-text-1: purple; + --calcite-color-border-1: purple; + --calcite-color-foreground-1: rgba(128, 0, 128, 0.15); } .themed-children calcite-chip:nth-of-type(6) { - --calcite-ui-brand: pink; - --calcite-ui-text-1: pink; - --calcite-ui-foreground-1: rgba(255, 192, 203, 0.15); + --calcite-color-brand: pink; + --calcite-color-text-1: pink; + --calcite-color-foreground-1: rgba(255, 192, 203, 0.15); } .themed-children calcite-chip:nth-of-type(7) { - --calcite-ui-brand: teal; - --calcite-ui-text-1: teal; - --calcite-ui-foreground-1: rgba(0, 128, 128, 0.15); + --calcite-color-brand: teal; + --calcite-color-text-1: teal; + --calcite-color-foreground-1: rgba(0, 128, 128, 0.15); } .themed-children-card calcite-chip:first-of-type { - --calcite-ui-foreground-2: rgb(222 239 220); - --calcite-ui-text-1: var(--calcite-ui-success); - --calcite-ui-icon-color: var(--calcite-ui-success); + --calcite-color-foreground-2: rgb(222 239 220); + --calcite-color-text-1: var(--calcite-color-success); + --calcite-ui-icon-color: var(--calcite-color-success); } .themed-children-card calcite-chip:nth-of-type(2) { - --calcite-ui-foreground-2: rgb(221 238 249); - --calcite-ui-text-1: var(--calcite-ui-info); - --calcite-ui-icon-color: var(--calcite-ui-info); + --calcite-color-foreground-2: rgb(221 238 249); + --calcite-color-text-1: var(--calcite-color-info); + --calcite-ui-icon-color: var(--calcite-color-info); } .themed-children-card calcite-chip:nth-of-type(3) { - --calcite-ui-foreground-2: rgb(221 238 249); - --calcite-ui-text-1: var(--calcite-ui-info); - --calcite-ui-icon-color: var(--calcite-ui-info); + --calcite-color-foreground-2: rgb(221 238 249); + --calcite-color-text-1: var(--calcite-color-info); + --calcite-ui-icon-color: var(--calcite-color-info); } hr { margin: 60px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } h2 { diff --git a/packages/calcite-components/src/demos/chip.html b/packages/calcite-components/src/demos/chip.html index 035fbdaf24a..2c2312ab133 100644 --- a/packages/calcite-components/src/demos/chip.html +++ b/packages/calcite-components/src/demos/chip.html @@ -14,13 +14,13 @@ } .demo { - background: var(--calcite-ui-background) !important; + background: var(--calcite-color-background) !important; } .child { flex: 0 0 20%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -34,7 +34,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } .chip-group { @@ -47,70 +47,70 @@ /* theming override examples */ .themed-children calcite-chip:first-of-type { - --calcite-ui-brand: var(--calcite-ui-danger); - --calcite-ui-text-1: var(--calcite-ui-danger); - --calcite-ui-border-1: var(--calcite-ui-danger); - --calcite-ui-foreground-1: rgba(255, 0, 0, 0.15); + --calcite-color-brand: var(--calcite-color-danger); + --calcite-color-text-1: var(--calcite-color-danger); + --calcite-color-border-1: var(--calcite-color-danger); + --calcite-color-foreground-1: rgba(255, 0, 0, 0.15); } .themed-children calcite-chip:nth-of-type(2) { - --calcite-ui-brand: var(--calcite-ui-success); - --calcite-ui-text-1: var(--calcite-ui-success); - --calcite-ui-border-1: var(--calcite-ui-success); - --calcite-ui-foreground-1: rgba(0, 128, 0, 0.15); + --calcite-color-brand: var(--calcite-color-success); + --calcite-color-text-1: var(--calcite-color-success); + --calcite-color-border-1: var(--calcite-color-success); + --calcite-color-foreground-1: rgba(0, 128, 0, 0.15); } .themed-children calcite-chip:nth-of-type(3) { - --calcite-ui-brand: var(--calcite-ui-info); - --calcite-ui-text-1: var(--calcite-ui-info); - --calcite-ui-border-1: var(--calcite-ui-info); - --calcite-ui-foreground-1: rgba(0, 0, 255, 0.15); + --calcite-color-brand: var(--calcite-color-info); + --calcite-color-text-1: var(--calcite-color-info); + --calcite-color-border-1: var(--calcite-color-info); + --calcite-color-foreground-1: rgba(0, 0, 255, 0.15); } .themed-children calcite-chip:nth-of-type(4) { - --calcite-ui-brand: orange; - --calcite-ui-text-1: orange; - --calcite-ui-border-1: orange; - --calcite-ui-foreground-1: rgba(255, 165, 0, 0.15); + --calcite-color-brand: orange; + --calcite-color-text-1: orange; + --calcite-color-border-1: orange; + --calcite-color-foreground-1: rgba(255, 165, 0, 0.15); } .themed-children calcite-chip:nth-of-type(5) { - --calcite-ui-brand: purple; - --calcite-ui-text-1: purple; - --calcite-ui-border-1: purple; - --calcite-ui-foreground-1: rgba(128, 0, 128, 0.15); + --calcite-color-brand: purple; + --calcite-color-text-1: purple; + --calcite-color-border-1: purple; + --calcite-color-foreground-1: rgba(128, 0, 128, 0.15); } .themed-children calcite-chip:nth-of-type(6) { - --calcite-ui-brand: pink; - --calcite-ui-text-1: pink; - --calcite-ui-border-1: pink; - --calcite-ui-foreground-1: rgba(255, 192, 203, 0.15); + --calcite-color-brand: pink; + --calcite-color-text-1: pink; + --calcite-color-border-1: pink; + --calcite-color-foreground-1: rgba(255, 192, 203, 0.15); } .themed-children calcite-chip:nth-of-type(7) { - --calcite-ui-brand: teal; - --calcite-ui-text-1: teal; - --calcite-ui-border-1: teal; - --calcite-ui-foreground-1: rgba(0, 128, 128, 0.15); + --calcite-color-brand: teal; + --calcite-color-text-1: teal; + --calcite-color-border-1: teal; + --calcite-color-foreground-1: rgba(0, 128, 128, 0.15); } .themed-children-card calcite-chip:first-of-type { - --calcite-ui-foreground-2: rgb(222 239 220); - --calcite-ui-text-1: var(--calcite-ui-success); - --calcite-ui-icon-color: var(--calcite-ui-success); + --calcite-color-foreground-2: rgb(222 239 220); + --calcite-color-text-1: var(--calcite-color-success); + --calcite-ui-icon-color: var(--calcite-color-success); } .themed-children-card calcite-chip:nth-of-type(2) { - --calcite-ui-foreground-2: rgb(221 238 249); - --calcite-ui-text-1: var(--calcite-ui-info); - --calcite-ui-icon-color: var(--calcite-ui-info); + --calcite-color-foreground-2: rgb(221 238 249); + --calcite-color-text-1: var(--calcite-color-info); + --calcite-ui-icon-color: var(--calcite-color-info); } .themed-children-card calcite-chip:nth-of-type(3) { - --calcite-ui-foreground-2: rgb(221 238 249); - --calcite-ui-text-1: var(--calcite-ui-info); - --calcite-ui-icon-color: var(--calcite-ui-info); + --calcite-color-foreground-2: rgb(221 238 249); + --calcite-color-text-1: var(--calcite-color-info); + --calcite-ui-icon-color: var(--calcite-color-info); } diff --git a/packages/calcite-components/src/demos/color-picker.html b/packages/calcite-components/src/demos/color-picker.html index 2947819a7d8..094b65f157c 100644 --- a/packages/calcite-components/src/demos/color-picker.html +++ b/packages/calcite-components/src/demos/color-picker.html @@ -15,7 +15,7 @@ .child { flex: 1 0 25%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -27,7 +27,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/combobox.html b/packages/calcite-components/src/demos/combobox.html index 4068d702714..40bbcc14984 100644 --- a/packages/calcite-components/src/demos/combobox.html +++ b/packages/calcite-components/src/demos/combobox.html @@ -16,7 +16,7 @@ .child { flex: 1 0 15%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -28,7 +28,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/date-picker.html b/packages/calcite-components/src/demos/date-picker.html index d83dc891301..d6fc23c1cd0 100644 --- a/packages/calcite-components/src/demos/date-picker.html +++ b/packages/calcite-components/src/demos/date-picker.html @@ -15,7 +15,7 @@ .child { flex: 1 0 25%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -27,7 +27,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } calcite-button, diff --git a/packages/calcite-components/src/demos/dropdown.html b/packages/calcite-components/src/demos/dropdown.html index 2f44f37f8ea..65450b57a36 100644 --- a/packages/calcite-components/src/demos/dropdown.html +++ b/packages/calcite-components/src/demos/dropdown.html @@ -10,7 +10,7 @@ .example { display: flex; align-items: center; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -35,7 +35,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/fab.html b/packages/calcite-components/src/demos/fab.html index c593cdd0044..01c437fd307 100644 --- a/packages/calcite-components/src/demos/fab.html +++ b/packages/calcite-components/src/demos/fab.html @@ -12,7 +12,7 @@ .control, .parent-flex, span { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -41,7 +41,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/flow-and-panel-action-menu-overflow.html b/packages/calcite-components/src/demos/flow-and-panel-action-menu-overflow.html index b6ab5118ab3..2a5665961d1 100644 --- a/packages/calcite-components/src/demos/flow-and-panel-action-menu-overflow.html +++ b/packages/calcite-components/src/demos/flow-and-panel-action-menu-overflow.html @@ -16,7 +16,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/flow.html b/packages/calcite-components/src/demos/flow.html index ce4c2aefa09..adf818c7d7d 100644 --- a/packages/calcite-components/src/demos/flow.html +++ b/packages/calcite-components/src/demos/flow.html @@ -16,7 +16,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/form.html b/packages/calcite-components/src/demos/form.html index 3713497977d..2b4a0c5d221 100644 --- a/packages/calcite-components/src/demos/form.html +++ b/packages/calcite-components/src/demos/form.html @@ -18,7 +18,7 @@ .child { flex: 0 1 21%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -30,7 +30,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/graph.html b/packages/calcite-components/src/demos/graph.html index 67cf06e9474..50778d6b26b 100644 --- a/packages/calcite-components/src/demos/graph.html +++ b/packages/calcite-components/src/demos/graph.html @@ -15,7 +15,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -51,7 +51,7 @@
Inherit Color
-
+
diff --git a/packages/calcite-components/src/demos/icon.html b/packages/calcite-components/src/demos/icon.html index 112c1edcc4a..ffbfb07e887 100644 --- a/packages/calcite-components/src/demos/icon.html +++ b/packages/calcite-components/src/demos/icon.html @@ -17,7 +17,7 @@ .child { flex: 0 1 21%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -29,7 +29,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } .my-icon-color-class { diff --git a/packages/calcite-components/src/demos/inline-editable.html b/packages/calcite-components/src/demos/inline-editable.html index 283c59a6072..642255b7b9c 100644 --- a/packages/calcite-components/src/demos/inline-editable.html +++ b/packages/calcite-components/src/demos/inline-editable.html @@ -16,7 +16,7 @@ .child { flex: 0 0 16%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -29,7 +29,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/input.html b/packages/calcite-components/src/demos/input.html index d5befb34d19..5d6676f8aaf 100644 --- a/packages/calcite-components/src/demos/input.html +++ b/packages/calcite-components/src/demos/input.html @@ -15,7 +15,7 @@ .font, .header { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-weight: var(--calcite-font-weight-medium); } @@ -40,7 +40,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } #locales { diff --git a/packages/calcite-components/src/demos/label.html b/packages/calcite-components/src/demos/label.html index 5a2a5b794d2..c974dafd759 100644 --- a/packages/calcite-components/src/demos/label.html +++ b/packages/calcite-components/src/demos/label.html @@ -19,7 +19,7 @@ .header, .parent-flex { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-weight: var(--calcite-font-weight-medium); } @@ -41,7 +41,7 @@ hr { margin: 50px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/link.html b/packages/calcite-components/src/demos/link.html index 238d0ae3f48..bd368a46748 100644 --- a/packages/calcite-components/src/demos/link.html +++ b/packages/calcite-components/src/demos/link.html @@ -9,7 +9,7 @@ .parent { display: flex; align-items: center; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -58,7 +58,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/list.html b/packages/calcite-components/src/demos/list.html index f66931df7b9..cff48c695d8 100644 --- a/packages/calcite-components/src/demos/list.html +++ b/packages/calcite-components/src/demos/list.html @@ -11,7 +11,7 @@ .parent { display: flex; align-items: center; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -68,16 +68,34 @@

List

slot="filter-actions-end" > - + - - + --calcite-color-success - + - +
@@ -86,30 +104,53 @@

List

closable list
+ --calcite-color-success--calcite-color-success
- + - + --calcite-color-success + > --calcite-color-success - - + --calcite-color-success - + - + - +
@@ -122,16 +163,32 @@

List

- + - + - + - +
@@ -144,16 +201,32 @@

List

- + - + - + - +
@@ -166,16 +239,32 @@

List

- + - + - + - +
@@ -187,16 +276,32 @@

List

- + - + - + - +
@@ -209,16 +314,32 @@

List

- + - + - + - +
@@ -231,16 +352,32 @@

List

- + - + - + - +
@@ -268,7 +405,12 @@

List

slot="content-start" thumbnail="http://mariadefatima.github.io/DASHH/img/profile_avatar.png" > - + @@ -291,7 +433,12 @@

List

slot="content-start" thumbnail="https://i1.sndcdn.com/avatars-000304648977-7nhi7j-t500x500.jpg" > - + @@ -318,7 +465,7 @@

List

scale="s" icon="exclamation-mark-triangle" slot="content-end" - style="color: var(--calcite-ui-danger)" + style="color: var(--calcite-color-danger)" > @@ -367,15 +514,19 @@

List

- + - + @@ -385,19 +536,19 @@

List

 - + @@ -412,7 +563,7 @@

List

.form-container { width: 100%; padding: 0.75rem; - border-inline-end: 1px solid var(--calcite-ui-border-3); + border-inline-end: 1px solid var(--calcite-color-border-3); }
inline editing
@@ -611,16 +762,32 @@

List

slot="filter-actions-end" > - + - + - + - +
diff --git a/packages/calcite-components/src/demos/loader.html b/packages/calcite-components/src/demos/loader.html index b4d7d1a6b9f..72b5663a62b 100644 --- a/packages/calcite-components/src/demos/loader.html +++ b/packages/calcite-components/src/demos/loader.html @@ -8,7 +8,7 @@ diff --git a/packages/calcite-components/src/demos/meter.html b/packages/calcite-components/src/demos/meter.html index 3d80bb01cd2..e1bd554d671 100644 --- a/packages/calcite-components/src/demos/meter.html +++ b/packages/calcite-components/src/demos/meter.html @@ -8,7 +8,7 @@ diff --git a/packages/calcite-components/src/demos/modal.html b/packages/calcite-components/src/demos/modal.html index 16fa4782b92..3e7f55fae9f 100644 --- a/packages/calcite-components/src/demos/modal.html +++ b/packages/calcite-components/src/demos/modal.html @@ -16,7 +16,7 @@ .child { flex: 0 0 15%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -28,7 +28,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } @@ -899,7 +899,7 @@

Docked

Ui Background css overriding --calcite-modal-content-background

diff --git a/packages/calcite-components/src/demos/navigation.html b/packages/calcite-components/src/demos/navigation.html index 05ad221c04c..70ca900c747 100644 --- a/packages/calcite-components/src/demos/navigation.html +++ b/packages/calcite-components/src/demos/navigation.html @@ -86,7 +86,7 @@

- + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + Examples of various platform app navigation patterns (not all accurate repre - + @@ -746,66 +746,66 @@

Theming

} .example-theming-tier-primary calcite-action { - --calcite-ui-foreground-1: #130d4e; - --calcite-ui-foreground-2: #1b1270; - --calcite-ui-foreground-3: #1b1270; - --calcite-ui-text-1: white; - --calcite-ui-text-2: white; - --calcite-ui-text-3: white; + --calcite-color-foreground-1: #130d4e; + --calcite-color-foreground-2: #1b1270; + --calcite-color-foreground-3: #1b1270; + --calcite-color-text-1: white; + --calcite-color-text-2: white; + --calcite-color-text-3: white; --calcite-ui-icon-color: white; } .example-theming-tier-primary calcite-navigation-logo { - --calcite-ui-foreground-1: #130d4e; - --calcite-ui-foreground-2: #1b1270; - --calcite-ui-foreground-3: #1b1270; - --calcite-ui-text-1: white; - --calcite-ui-text-2: white; - --calcite-ui-text-3: white; + --calcite-color-foreground-1: #130d4e; + --calcite-color-foreground-2: #1b1270; + --calcite-color-foreground-3: #1b1270; + --calcite-color-text-1: white; + --calcite-color-text-2: white; + --calcite-color-text-3: white; --calcite-ui-icon-color: white; } .example-theming-tier-primary calcite-navigation-user { - --calcite-ui-foreground-1: #130d4e; - --calcite-ui-foreground-2: #1b1270; - --calcite-ui-foreground-3: #1b1270; - --calcite-ui-text-1: white; - --calcite-ui-text-2: white; - --calcite-ui-text-3: white; + --calcite-color-foreground-1: #130d4e; + --calcite-color-foreground-2: #1b1270; + --calcite-color-foreground-3: #1b1270; + --calcite-color-text-1: white; + --calcite-color-text-2: white; + --calcite-color-text-3: white; --calcite-ui-icon-color: white; } calcite-menu.example-primary-theming { - --calcite-ui-foreground-1: #130d4e; - --calcite-ui-foreground-2: #1b1270; - --calcite-ui-foreground-3: #1b1270; - --calcite-ui-text-1: white; - --calcite-ui-text-2: white; - --calcite-ui-text-3: white; + --calcite-color-foreground-1: #130d4e; + --calcite-color-foreground-2: #1b1270; + --calcite-color-foreground-3: #1b1270; + --calcite-color-text-1: white; + --calcite-color-text-2: white; + --calcite-color-text-3: white; --calcite-ui-icon-color: white; } calcite-menu.example-secondary-theming { - --calcite-ui-foreground-1: #2d2670; - --calcite-ui-foreground-2: #47338c; - --calcite-ui-foreground-3: #2a208c; - --calcite-ui-text-1: white; - --calcite-ui-text-2: white; - --calcite-ui-text-3: white; + --calcite-color-foreground-1: #2d2670; + --calcite-color-foreground-2: #47338c; + --calcite-color-foreground-3: #2a208c; + --calcite-color-text-1: white; + --calcite-color-text-2: white; + --calcite-color-text-3: white; --calcite-ui-icon-color: white; } calcite-menu.example-tertiary-theming { - --calcite-ui-foreground-1: #f6faff; - --calcite-ui-foreground-2: #ecf0ff; - --calcite-ui-foreground-3: #a0a8c6; - --calcite-ui-text-1: #555; - --calcite-ui-text-2: #333; - --calcite-ui-text-3: #222; + --calcite-color-foreground-1: #f6faff; + --calcite-color-foreground-2: #ecf0ff; + --calcite-color-foreground-3: #a0a8c6; + --calcite-color-text-1: #555; + --calcite-color-text-2: #333; + --calcite-color-text-3: #222; } - + diff --git a/packages/calcite-components/src/demos/pagination.html b/packages/calcite-components/src/demos/pagination.html index dc670ea4ced..4f650ee5282 100644 --- a/packages/calcite-components/src/demos/pagination.html +++ b/packages/calcite-components/src/demos/pagination.html @@ -15,7 +15,7 @@ .parent { display: flex; flex-direction: column; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/panel.html b/packages/calcite-components/src/demos/panel.html index 809e59e0d84..0fe6261545f 100644 --- a/packages/calcite-components/src/demos/panel.html +++ b/packages/calcite-components/src/demos/panel.html @@ -16,7 +16,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -30,7 +30,7 @@ hr { margin: 60px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/pick-list.html b/packages/calcite-components/src/demos/pick-list.html index 0acb0ec87cc..999a6cd38b6 100644 --- a/packages/calcite-components/src/demos/pick-list.html +++ b/packages/calcite-components/src/demos/pick-list.html @@ -16,7 +16,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -30,7 +30,7 @@ hr { margin: 35px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } calcite-pick-list { diff --git a/packages/calcite-components/src/demos/popover.html b/packages/calcite-components/src/demos/popover.html index 9279d3b8042..3cf21ff243d 100644 --- a/packages/calcite-components/src/demos/popover.html +++ b/packages/calcite-components/src/demos/popover.html @@ -9,7 +9,7 @@ .parent { display: flex; flex-direction: column; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/progress.html b/packages/calcite-components/src/demos/progress.html index dd6886f1cb1..9d84073eafe 100644 --- a/packages/calcite-components/src/demos/progress.html +++ b/packages/calcite-components/src/demos/progress.html @@ -9,7 +9,7 @@ .parent { display: flex; flex-direction: column; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/radio-button-group.html b/packages/calcite-components/src/demos/radio-button-group.html index 830ff24df41..cf6146cca7c 100644 --- a/packages/calcite-components/src/demos/radio-button-group.html +++ b/packages/calcite-components/src/demos/radio-button-group.html @@ -16,7 +16,7 @@ .parent-flex, span { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-weight: var(--calcite-font-weight-medium); font-size: var(--calcite-font-size-0); @@ -33,7 +33,7 @@ hr { margin: 50px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/radio-button.html b/packages/calcite-components/src/demos/radio-button.html index 7e2950c0e3c..d0366abd0e7 100644 --- a/packages/calcite-components/src/demos/radio-button.html +++ b/packages/calcite-components/src/demos/radio-button.html @@ -10,7 +10,7 @@ display: flex; padding: 12px 0; width: 70%; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-weight: var(--calcite-font-weight-medium); font-size: var(--calcite-font-size-0); @@ -23,7 +23,7 @@ hr { margin: 50px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } .right-aligned-text { diff --git a/packages/calcite-components/src/demos/rating.html b/packages/calcite-components/src/demos/rating.html index ecc9b0aeab8..36aa3f17058 100644 --- a/packages/calcite-components/src/demos/rating.html +++ b/packages/calcite-components/src/demos/rating.html @@ -17,7 +17,7 @@ .child { flex: 0 1 21%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -29,7 +29,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/scrim.html b/packages/calcite-components/src/demos/scrim.html index 6922cd29e0e..d672686ae58 100644 --- a/packages/calcite-components/src/demos/scrim.html +++ b/packages/calcite-components/src/demos/scrim.html @@ -20,7 +20,7 @@ align-items: center; flex-direction: column; flex: 1 1 auto; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/segmented-control.html b/packages/calcite-components/src/demos/segmented-control.html index 2fa1ab80b40..40afa911941 100644 --- a/packages/calcite-components/src/demos/segmented-control.html +++ b/packages/calcite-components/src/demos/segmented-control.html @@ -14,7 +14,7 @@ .parent-flex, span { - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-weight: var(--calcite-font-weight-medium); font-size: var(--calcite-font-size-0); @@ -31,7 +31,7 @@ hr { margin: 50px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } .right-aligned-text { diff --git a/packages/calcite-components/src/demos/select.html b/packages/calcite-components/src/demos/select.html index 4d7b9db1a37..1ec0886592c 100644 --- a/packages/calcite-components/src/demos/select.html +++ b/packages/calcite-components/src/demos/select.html @@ -15,7 +15,7 @@ .child { flex: 0 0 15%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/sheet.html b/packages/calcite-components/src/demos/sheet.html index fd830dde376..11555847f9a 100644 --- a/packages/calcite-components/src/demos/sheet.html +++ b/packages/calcite-components/src/demos/sheet.html @@ -16,7 +16,7 @@ .child { flex: 0 0 15%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -28,7 +28,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/shell-panel.html b/packages/calcite-components/src/demos/shell-panel.html index 477c659571e..6fb0b7cb46e 100644 --- a/packages/calcite-components/src/demos/shell-panel.html +++ b/packages/calcite-components/src/demos/shell-panel.html @@ -48,7 +48,7 @@ .tall-content-example { display: block; margin: 1rem 0; - background: var(--calcite-ui-foreground-2); + background: var(--calcite-color-foreground-2); height: 100rem; overflow: scroll; } diff --git a/packages/calcite-components/src/demos/shell/popup-config-example.html b/packages/calcite-components/src/demos/shell/popup-config-example.html index 1f82ddd1081..28fd409955f 100644 --- a/packages/calcite-components/src/demos/shell/popup-config-example.html +++ b/packages/calcite-components/src/demos/shell/popup-config-example.html @@ -158,7 +158,7 @@ diff --git a/packages/calcite-components/src/demos/sortable-list.html b/packages/calcite-components/src/demos/sortable-list.html index 8ffcdb1d65d..2c361b8f134 100644 --- a/packages/calcite-components/src/demos/sortable-list.html +++ b/packages/calcite-components/src/demos/sortable-list.html @@ -10,7 +10,7 @@ .parent { display: flex; flex-direction: column; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/split-button.html b/packages/calcite-components/src/demos/split-button.html index 0e4178ce841..00acbe0246e 100644 --- a/packages/calcite-components/src/demos/split-button.html +++ b/packages/calcite-components/src/demos/split-button.html @@ -9,7 +9,7 @@ .parent-flex { display: flex; padding: 25px 0; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -32,7 +32,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/stack.html b/packages/calcite-components/src/demos/stack.html index 7b3a5279ed0..289a50a88a7 100644 --- a/packages/calcite-components/src/demos/stack.html +++ b/packages/calcite-components/src/demos/stack.html @@ -16,7 +16,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -30,7 +30,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/stepper.html b/packages/calcite-components/src/demos/stepper.html index adddca17376..e1d0d3fc57c 100644 --- a/packages/calcite-components/src/demos/stepper.html +++ b/packages/calcite-components/src/demos/stepper.html @@ -10,7 +10,7 @@ display: flex; width: 80%; padding: 25px 0; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -33,7 +33,7 @@ hr { margin: 50px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/switch.html b/packages/calcite-components/src/demos/switch.html index 5d2bbee3d0c..c93aa2b16d7 100644 --- a/packages/calcite-components/src/demos/switch.html +++ b/packages/calcite-components/src/demos/switch.html @@ -18,7 +18,7 @@ .child { flex: 0 1 21%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -30,7 +30,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/table.html b/packages/calcite-components/src/demos/table.html index e402b84e3ad..9c9ce3eb661 100644 --- a/packages/calcite-components/src/demos/table.html +++ b/packages/calcite-components/src/demos/table.html @@ -13,15 +13,15 @@ margin: 0.25rem 0 0.5rem; font-weight: 500; font-size: 14px; - color: var(--calcite-ui-text-1); + color: var(--calcite-color-text-1); } #theme-chip-default[selected] { - --calcite-ui-icon-color: var(--calcite-ui-brand); + --calcite-ui-icon-color: var(--calcite-color-brand); } .calcite-mode-dark #theme-chip-default[selected] { - --calcite-ui-icon-color: var(--calcite-ui-brand); + --calcite-ui-icon-color: var(--calcite-color-brand); } h3, @@ -31,57 +31,57 @@ } .theme-ranger-station { - --calcite-ui-brand: #308e29; - --calcite-ui-brand-hover: #267121; - --calcite-ui-brand-press: #1d5519; - --calcite-ui-background: #faf3e3; - --calcite-ui-foreground-1: #fffaed; - --calcite-ui-foreground-2: #fae9c8; - --calcite-ui-foreground-3: #fce5b6; - --calcite-ui-info: #267121; - --calcite-ui-success: #308e29; - --calcite-ui-warning: #f1c21b; - --calcite-ui-danger: #d83020; - --calcite-ui-danger-hover: #a82b1e; - --calcite-ui-danger-press: #851012; - --calcite-ui-text-1: #3a3335; - --calcite-ui-text-2: #3d3638; - --calcite-ui-text-3: #463d40; - --calcite-ui-text-inverse: #ffffff; - --calcite-ui-text-link: #267121; - --calcite-ui-border-1: #e6ddd1; - --calcite-ui-border-2: #e8e1dc; - --calcite-ui-border-3: #e6ddd1; - --calcite-ui-border-input: #a1a19e; + --calcite-color-brand: #308e29; + --calcite-color-brand-hover: #267121; + --calcite-color-brand-press: #1d5519; + --calcite-color-background: #faf3e3; + --calcite-color-foreground-1: #fffaed; + --calcite-color-foreground-2: #fae9c8; + --calcite-color-foreground-3: #fce5b6; + --calcite-color-info: #267121; + --calcite-color-success: #308e29; + --calcite-color-warning: #f1c21b; + --calcite-color-danger: #d83020; + --calcite-color-danger-hover: #a82b1e; + --calcite-color-danger-press: #851012; + --calcite-color-text-1: #3a3335; + --calcite-color-text-2: #3d3638; + --calcite-color-text-3: #463d40; + --calcite-color-text-inverse: #ffffff; + --calcite-color-text-link: #267121; + --calcite-color-border-1: #e6ddd1; + --calcite-color-border-2: #e8e1dc; + --calcite-color-border-3: #e6ddd1; + --calcite-color-border-input: #a1a19e; } .calcite-mode-dark .theme-ranger-station { - --calcite-ui-brand: #3cb233; - --calcite-ui-brand-hover: #2d8626; - --calcite-ui-brand-press: #256f20; - --calcite-ui-background: #423b33; - --calcite-ui-foreground-1: #332f29; - --calcite-ui-foreground-2: #2c2a26; - --calcite-ui-foreground-3: #1a1917; - --calcite-ui-info: #2d8626; - --calcite-ui-success: #36da43; - --calcite-ui-warning: #ffc900; - --calcite-ui-danger: #fe583e; - --calcite-ui-danger-hover: #ff0015; - --calcite-ui-danger-press: #d90012; - --calcite-ui-text-1: #fdf0d5; - --calcite-ui-text-2: #fff6f6; - --calcite-ui-text-3: #ffffff; - --calcite-ui-text-inverse: #000000; - --calcite-ui-text-link: #2d8626; - --calcite-ui-border-1: #3a3335; - --calcite-ui-border-2: #40383a; - --calcite-ui-border-3: #47423e; - --calcite-ui-border-input: #4b4245; + --calcite-color-brand: #3cb233; + --calcite-color-brand-hover: #2d8626; + --calcite-color-brand-press: #256f20; + --calcite-color-background: #423b33; + --calcite-color-foreground-1: #332f29; + --calcite-color-foreground-2: #2c2a26; + --calcite-color-foreground-3: #1a1917; + --calcite-color-info: #2d8626; + --calcite-color-success: #36da43; + --calcite-color-warning: #ffc900; + --calcite-color-danger: #fe583e; + --calcite-color-danger-hover: #ff0015; + --calcite-color-danger-press: #d90012; + --calcite-color-text-1: #fdf0d5; + --calcite-color-text-2: #fff6f6; + --calcite-color-text-3: #ffffff; + --calcite-color-text-inverse: #000000; + --calcite-color-text-link: #2d8626; + --calcite-color-border-1: #3a3335; + --calcite-color-border-2: #40383a; + --calcite-color-border-3: #47423e; + --calcite-color-border-input: #4b4245; } #theme-chip-ranger { - --calcite-ui-brand: #308e29; + --calcite-color-brand: #308e29; } #theme-chip-ranger[selected] { @@ -89,7 +89,7 @@ } .calcite-mode-dark #theme-chip-ranger { - --calcite-ui-brand: #3cb233; + --calcite-color-brand: #3cb233; } .calcite-mode-dark #theme-chip-ranger[selected] { @@ -97,57 +97,57 @@ } .theme-mint-glacier { - --calcite-ui-brand: #00c291; - --calcite-ui-brand-hover: #00ad82; - --calcite-ui-brand-press: #00916d; - --calcite-ui-background: #f2f7f4; - --calcite-ui-foreground-1: #fafffd; - --calcite-ui-foreground-2: #edf7f3; - --calcite-ui-foreground-3: #e4ebe8; - --calcite-ui-info: #007f99; - --calcite-ui-success: #47ac35; - --calcite-ui-warning: #eeb417; - --calcite-ui-danger: #d92024; - --calcite-ui-danger-hover: #a91e20; - --calcite-ui-danger-press: #7c1315; - --calcite-ui-text-1: #222927; - --calcite-ui-text-2: #333d3a; - --calcite-ui-text-3: #3a4541; - --calcite-ui-text-inverse: #fafffd; - --calcite-ui-text-link: #04716c; - --calcite-ui-border-1: #c3c7c5; - --calcite-ui-border-2: #cdd4d0; - --calcite-ui-border-3: #dfe8e3; - --calcite-ui-border-input: #727d77; + --calcite-color-brand: #00c291; + --calcite-color-brand-hover: #00ad82; + --calcite-color-brand-press: #00916d; + --calcite-color-background: #f2f7f4; + --calcite-color-foreground-1: #fafffd; + --calcite-color-foreground-2: #edf7f3; + --calcite-color-foreground-3: #e4ebe8; + --calcite-color-info: #007f99; + --calcite-color-success: #47ac35; + --calcite-color-warning: #eeb417; + --calcite-color-danger: #d92024; + --calcite-color-danger-hover: #a91e20; + --calcite-color-danger-press: #7c1315; + --calcite-color-text-1: #222927; + --calcite-color-text-2: #333d3a; + --calcite-color-text-3: #3a4541; + --calcite-color-text-inverse: #fafffd; + --calcite-color-text-link: #04716c; + --calcite-color-border-1: #c3c7c5; + --calcite-color-border-2: #cdd4d0; + --calcite-color-border-3: #dfe8e3; + --calcite-color-border-input: #727d77; } .calcite-mode-dark .theme-mint-glacier { - --calcite-ui-brand: #00dea6; - --calcite-ui-brand-hover: #00c997; - --calcite-ui-brand-press: #00b386; - --calcite-ui-background: #252927; - --calcite-ui-foreground-1: #282f2c; - --calcite-ui-foreground-2: #2f3633; - --calcite-ui-foreground-3: #353b38; - --calcite-ui-info: #38deff; - --calcite-ui-success: #60fc44; - --calcite-ui-warning: #ffca38; - --calcite-ui-danger: #ff3639; - --calcite-ui-danger-hover: #d93437; - --calcite-ui-danger-press: #7c1d13; - --calcite-ui-text-1: #f5fffc; - --calcite-ui-text-2: #e6fcf6; - --calcite-ui-text-3: #d6fff0; - --calcite-ui-text-inverse: #1a1c1b; - --calcite-ui-text-link: #15e8dd; - --calcite-ui-border-1: #202422; - --calcite-ui-border-2: #39473f; - --calcite-ui-border-3: #2b3d33; - --calcite-ui-border-input: #242e29; + --calcite-color-brand: #00dea6; + --calcite-color-brand-hover: #00c997; + --calcite-color-brand-press: #00b386; + --calcite-color-background: #252927; + --calcite-color-foreground-1: #282f2c; + --calcite-color-foreground-2: #2f3633; + --calcite-color-foreground-3: #353b38; + --calcite-color-info: #38deff; + --calcite-color-success: #60fc44; + --calcite-color-warning: #ffca38; + --calcite-color-danger: #ff3639; + --calcite-color-danger-hover: #d93437; + --calcite-color-danger-press: #7c1d13; + --calcite-color-text-1: #f5fffc; + --calcite-color-text-2: #e6fcf6; + --calcite-color-text-3: #d6fff0; + --calcite-color-text-inverse: #1a1c1b; + --calcite-color-text-link: #15e8dd; + --calcite-color-border-1: #202422; + --calcite-color-border-2: #39473f; + --calcite-color-border-3: #2b3d33; + --calcite-color-border-input: #242e29; } #theme-chip-mint { - --calcite-ui-brand: #00c291; + --calcite-color-brand: #00c291; } #theme-chip-mint[selected] { @@ -155,7 +155,7 @@ } .calcite-mode-dark #theme-chip-mint { - --calcite-ui-brand: #00dea6; + --calcite-color-brand: #00dea6; } .calcite-mode-dark #theme-chip-mint[selected] { @@ -163,57 +163,57 @@ } .theme-lavender-field { - --calcite-ui-brand: #8f4a89; - --calcite-ui-brand-hover: #823b7c; - --calcite-ui-brand-press: #7d3b77; - --calcite-ui-background: #fff2ff; - --calcite-ui-foreground-1: #fffaff; - --calcite-ui-foreground-2: #f8ebfa; - --calcite-ui-foreground-3: #f7daf7; - --calcite-ui-info: #b382d9; - --calcite-ui-success: #40c437; - --calcite-ui-warning: #f1a71e; - --calcite-ui-danger: #d93820; - --calcite-ui-danger-hover: #a9321e; - --calcite-ui-danger-press: #841410; - --calcite-ui-text-1: #383239; - --calcite-ui-text-2: #3d373e; - --calcite-ui-text-3: #443e47; - --calcite-ui-text-inverse: #f6f0f7; - --calcite-ui-text-link: #7e3ba3; - --calcite-ui-border-1: #d1c0d1; - --calcite-ui-border-2: #e3d3e3; - --calcite-ui-border-3: #ebd8ed; - --calcite-ui-border-input: #a39fa2; + --calcite-color-brand: #8f4a89; + --calcite-color-brand-hover: #823b7c; + --calcite-color-brand-press: #7d3b77; + --calcite-color-background: #fff2ff; + --calcite-color-foreground-1: #fffaff; + --calcite-color-foreground-2: #f8ebfa; + --calcite-color-foreground-3: #f7daf7; + --calcite-color-info: #b382d9; + --calcite-color-success: #40c437; + --calcite-color-warning: #f1a71e; + --calcite-color-danger: #d93820; + --calcite-color-danger-hover: #a9321e; + --calcite-color-danger-press: #841410; + --calcite-color-text-1: #383239; + --calcite-color-text-2: #3d373e; + --calcite-color-text-3: #443e47; + --calcite-color-text-inverse: #f6f0f7; + --calcite-color-text-link: #7e3ba3; + --calcite-color-border-1: #d1c0d1; + --calcite-color-border-2: #e3d3e3; + --calcite-color-border-3: #ebd8ed; + --calcite-color-border-input: #a39fa2; } .calcite-mode-dark .theme-lavender-field { - --calcite-ui-brand: #d6b9eb; - --calcite-ui-brand-hover: #c59cd6; - --calcite-ui-brand-press: #b399c4; - --calcite-ui-background: #3e3342; - --calcite-ui-foreground-1: #2e2933; - --calcite-ui-foreground-2: #2b262c; - --calcite-ui-foreground-3: #1b181b; - --calcite-ui-info: #be3dc4; - --calcite-ui-success: #28d258; - --calcite-ui-warning: #ff9900; - --calcite-ui-danger: #fe3e7e; - --calcite-ui-danger-hover: #ff004c; - --calcite-ui-danger-press: #db005b; - --calcite-ui-text-1: #fef2ff; - --calcite-ui-text-2: #fef5ff; - --calcite-ui-text-3: #faf0f9; - --calcite-ui-text-inverse: #1a0416; - --calcite-ui-text-link: #872686; - --calcite-ui-border-1: #373239; - --calcite-ui-border-2: #413941; - --calcite-ui-border-3: #463e47; - --calcite-ui-border-input: #49434c; + --calcite-color-brand: #d6b9eb; + --calcite-color-brand-hover: #c59cd6; + --calcite-color-brand-press: #b399c4; + --calcite-color-background: #3e3342; + --calcite-color-foreground-1: #2e2933; + --calcite-color-foreground-2: #2b262c; + --calcite-color-foreground-3: #1b181b; + --calcite-color-info: #be3dc4; + --calcite-color-success: #28d258; + --calcite-color-warning: #ff9900; + --calcite-color-danger: #fe3e7e; + --calcite-color-danger-hover: #ff004c; + --calcite-color-danger-press: #db005b; + --calcite-color-text-1: #fef2ff; + --calcite-color-text-2: #fef5ff; + --calcite-color-text-3: #faf0f9; + --calcite-color-text-inverse: #1a0416; + --calcite-color-text-link: #872686; + --calcite-color-border-1: #373239; + --calcite-color-border-2: #413941; + --calcite-color-border-3: #463e47; + --calcite-color-border-input: #49434c; } #theme-chip-lavender { - --calcite-ui-brand: #8f4a89; + --calcite-color-brand: #8f4a89; } #theme-chip-lavender[selected] { @@ -221,7 +221,7 @@ } .calcite-mode-dark #theme-chip-lavender { - --calcite-ui-brand: #d6b9eb; + --calcite-color-brand: #d6b9eb; } .calcite-mode-dark #theme-chip-lavender[selected] { diff --git a/packages/calcite-components/src/demos/tabs.html b/packages/calcite-components/src/demos/tabs.html index 5ff6d29548b..5b2547f4ba1 100644 --- a/packages/calcite-components/src/demos/tabs.html +++ b/packages/calcite-components/src/demos/tabs.html @@ -10,7 +10,7 @@ .flex-wrap { display: flex; align-items: center; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/text-area.html b/packages/calcite-components/src/demos/text-area.html index 4cef862ef8e..8d683be8d6c 100644 --- a/packages/calcite-components/src/demos/text-area.html +++ b/packages/calcite-components/src/demos/text-area.html @@ -10,7 +10,7 @@ display: flex; flex-wrap: wrap; flex-direction: row; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/tile-select.html b/packages/calcite-components/src/demos/tile-select.html index 40ed348c633..182d8646a37 100644 --- a/packages/calcite-components/src/demos/tile-select.html +++ b/packages/calcite-components/src/demos/tile-select.html @@ -9,7 +9,7 @@ .parent { display: flex; align-items: center; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -29,7 +29,7 @@ hr { margin: 25px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/tip-manager.html b/packages/calcite-components/src/demos/tip-manager.html index 6432f1dc286..e77612b31e9 100644 --- a/packages/calcite-components/src/demos/tip-manager.html +++ b/packages/calcite-components/src/demos/tip-manager.html @@ -15,7 +15,7 @@ .child { flex: 0 1 50%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -32,7 +32,7 @@ hr { margin: 60px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/demos/tooltip.html b/packages/calcite-components/src/demos/tooltip.html index dae9be1f990..924d198e6a8 100644 --- a/packages/calcite-components/src/demos/tooltip.html +++ b/packages/calcite-components/src/demos/tooltip.html @@ -10,7 +10,7 @@ display: flex; align-items: center; margin-left: 9%; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/tree-scales.html b/packages/calcite-components/src/demos/tree-scales.html index f8c4c21fd3e..2545b145e65 100644 --- a/packages/calcite-components/src/demos/tree-scales.html +++ b/packages/calcite-components/src/demos/tree-scales.html @@ -12,7 +12,7 @@ } h2, h3 { - color: var(--calcite-ui-text-1); + color: var(--calcite-color-text-1); } .scales { display: grid; diff --git a/packages/calcite-components/src/demos/tree.html b/packages/calcite-components/src/demos/tree.html index 7d69b3dacbe..c42538afe43 100644 --- a/packages/calcite-components/src/demos/tree.html +++ b/packages/calcite-components/src/demos/tree.html @@ -9,7 +9,7 @@ .parent { display: flex; align-items: center; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); diff --git a/packages/calcite-components/src/demos/value-list.html b/packages/calcite-components/src/demos/value-list.html index 9d7de0134eb..76e2e1a5b73 100644 --- a/packages/calcite-components/src/demos/value-list.html +++ b/packages/calcite-components/src/demos/value-list.html @@ -14,7 +14,7 @@ .child { flex: 0 0 40%; margin: 0 25px; - color: var(--calcite-ui-text-3); + color: var(--calcite-color-text-3); font-family: var(--calcite-sans-family); font-size: var(--calcite-font-size-0); font-weight: var(--calcite-font-weight-medium); @@ -28,7 +28,7 @@ hr { margin: 35px 0; - border-top: 1px solid var(--calcite-ui-border-2); + border-top: 1px solid var(--calcite-color-border-2); } diff --git a/packages/calcite-components/src/utils/responsive.ts b/packages/calcite-components/src/utils/responsive.ts index cb882e3516a..2d4d1a26e26 100644 --- a/packages/calcite-components/src/utils/responsive.ts +++ b/packages/calcite-components/src/utils/responsive.ts @@ -1,10 +1,10 @@ import { - CoreBreakpointWidthDefaultLg, - CoreBreakpointWidthDefaultMd, - CoreBreakpointWidthDefaultSm, - CoreBreakpointWidthDefaultXs, - CoreBreakpointWidthDefaultXxs, -} from "@esri/calcite-design-tokens/dist/es6/calcite-headless"; + calciteContainerSizeWidthLg, + calciteContainerSizeWidthMd, + calciteContainerSizeWidthSm, + calciteContainerSizeWidthXs, + calciteContainerSizeWidthXxs, +} from "@esri/calcite-design-tokens/dist/es6/global"; export interface Breakpoints { width: { @@ -21,11 +21,11 @@ export interface Breakpoints { */ export const breakpoints: Breakpoints = { width: { - large: cssLengthToNumber(CoreBreakpointWidthDefaultLg), - medium: cssLengthToNumber(CoreBreakpointWidthDefaultMd), - small: cssLengthToNumber(CoreBreakpointWidthDefaultSm), - xsmall: cssLengthToNumber(CoreBreakpointWidthDefaultXs), - xxsmall: cssLengthToNumber(CoreBreakpointWidthDefaultXxs), + large: cssLengthToNumber(calciteContainerSizeWidthLg.max), + medium: cssLengthToNumber(calciteContainerSizeWidthMd.max), + small: cssLengthToNumber(calciteContainerSizeWidthSm.max), + xsmall: cssLengthToNumber(calciteContainerSizeWidthXs.max), + xxsmall: cssLengthToNumber(calciteContainerSizeWidthXxs.max), }, }; diff --git a/packages/calcite-components/stencil.config.ts b/packages/calcite-components/stencil.config.ts index c954bcae8d4..f9f44e8d025 100644 --- a/packages/calcite-components/stencil.config.ts +++ b/packages/calcite-components/stencil.config.ts @@ -142,12 +142,11 @@ export const create: () => Config = () => ({ testing: { watchPathIgnorePatterns: ["/../../node_modules", "/dist", "/www", "/hydrate"], moduleNameMapper: { - "^@esri/calcite-design-tokens/dist/(.*)$": "/../../node_modules/@esri/calcite-design-tokens/dist/$1", "^lodash-es$": "lodash", }, setupFilesAfterEnv: ["/src/tests/setupTests.ts"], transform: { - "calcite-design-tokens/dist/es6/calcite-headless\\.js$": + "calcite-design-tokens/dist/es6/.*\\.js$": "../../node_modules/@stencil/core/testing/jest-preprocessor.js", }, }, diff --git a/packages/calcite-design-tokens/README.md b/packages/calcite-design-tokens/README.md index 3bebdd1ddd6..1496370db5a 100644 --- a/packages/calcite-design-tokens/README.md +++ b/packages/calcite-design-tokens/README.md @@ -11,10 +11,10 @@ npm install @esri/calcite-design-tokens Reference tokens in your CSS: ```css -@import "@esri/calcite-design-tokens/css/calcite-light"; +@import "@esri/calcite-design-tokens/css/global"; :root { - --my-custom-token: var(--calcite-ui-brand); + --my-custom-token: var(--calcite-color-brand); } ``` @@ -22,10 +22,8 @@ Reference tokens in your CSS: These are the published asset files generated by the token transformer: -| Name | CSS | SCSS | -| ------------------- | -------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------- | -| Calcite Headless | @esri/calcite-design-tokens/css @esri/calcite-design-tokens/css/calcite-headless | @esri/calcite-design-tokens/scss @esri/calcite-design-tokens/scss/calcite-headless | -| Calcite Light | @esri/calcite-design-tokens/css/calcite-light | @esri/calcite-design-tokens/scss/calcite-light | -| Calcite Dark | @esri/calcite-design-tokens/css/calcite-dark | @esri/calcite-design-tokens/scss/calcite-dark | -| Calcite Brand Light | @esri/calcite-design-tokens/css/brand-light | @esri/calcite-design-tokens/scss/brand-light | -| Calcite Brand Dark | @esri/calcite-design-tokens/css/brand-dark | @esri/calcite-design-tokens/scss/brand-dark | +| Name | CSS | SCSS | +| ------------- | ---------------------------------------------------------------------- | ------------------------------------------------------------------------ | +| Global | @esri/calcite-design-tokens/css @esri/calcite-design-tokens/css/global | @esri/calcite-design-tokens/scss @esri/calcite-design-tokens/scss/global | +| Calcite Light | @esri/calcite-design-tokens/css/light | @esri/calcite-design-tokens/scss/light | +| Calcite Dark | @esri/calcite-design-tokens/css/dark | @esri/calcite-design-tokens/scss/dark | diff --git a/packages/calcite-design-tokens/package.json b/packages/calcite-design-tokens/package.json index abfaee2b37a..1fbbab2c712 100644 --- a/packages/calcite-design-tokens/package.json +++ b/packages/calcite-design-tokens/package.json @@ -8,26 +8,33 @@ "design tokens", "tokens" ], - "main": "./dist/scss/calcite-headless.scss", "type": "module", - "exports": { - "./css": "./dist/css/calcite-headless.css", - "./css/calcite/dark": "./dist/css/calcite-dark.css", - "./css/calcite/light": "./dist/css/calcite-light.css", - "./css/headless": "./dist/css/calcite-headless.css", - "./scss": "./dist/scss/calcite-headless.scss", - "./scss/calcite/dark": "./dist/scss/calcite-dark.scss", - "./scss/calcite/light": "./dist/scss/calcite-light.scss", - "./scss/headless": "./dist/scss/calcite-headless.scss", - "./js": "./dist/js/calcite-headless.js", - "./js/calcite/dark": "./dist/js/calcite-dark.js", - "./js/calcite/light": "./dist/js/calcite-light.js", - "./js/headless": "./dist/js/calcite-headless.js", - "./es6": "./dist/es6/calcite-headless.js", - "./es6/calcite/dark": "./dist/es6/calcite-dark.js", - "./es6/calcite/light": "./dist/es6/calcite-light.js", - "./es6/headless": "./dist/es6/calcite-headless.js" - }, + "main": "./dist/js/global.js", + "types": "./dist/js/global.d.ts", + "files": [ + "./dist/css/global.css", + "./dist/css/breakpoint.css", + "./dist/css/classes.css", + "./dist/css/core.css", + "./dist/css/light.css", + "./dist/css/dark.css", + "./dist/css/index.css", + "./dist/css/global.css", + "./dist/scss/breakpoints.scss", + "./dist/scss/mixins.scss", + "./dist/scss/core.scss", + "./dist/scss/light.scss", + "./dist/scss/dark.scss", + "./dist/scss/index.scss", + "./dist/es6/core.js", + "./dist/es6/core.d.ts", + "./dist/es6/global.js", + "./dist/es6/global.d.ts", + "./dist/js/core.d.ts", + "./dist/js/core.js", + "./dist/js/global.d.ts", + "./dist/js/global.js" + ], "repository": { "type": "git", "url": "git://github.com/Esri/calcite-design-system.git" diff --git a/packages/calcite-design-tokens/src/$config.ts b/packages/calcite-design-tokens/src/$config.ts new file mode 100644 index 00000000000..8f5c9579b76 --- /dev/null +++ b/packages/calcite-design-tokens/src/$config.ts @@ -0,0 +1,61 @@ +import { dirname, resolve } from "path"; +import { fileURLToPath } from "url"; + +import { CalciteTokenTransformConfig } from "../support/types/config.js"; +import { Platform } from "../support/types/platform.js"; +import { globalTokens, coreTokens } from "./index.js"; + +const __filename = fileURLToPath(import.meta.url); +const __dirname = dirname(__filename); + +export const config: CalciteTokenTransformConfig = { + files: [coreTokens, globalTokens], + options: { + prefix: "calcite", + }, + output: { + dir: resolve(__dirname, "../dist"), + platforms: [Platform.SCSS, Platform.CSS, Platform.JS, Platform.ES6], + expandFiles: { + css: { + typography: "classes.css", + colorScheme: { light: "light.css", dark: "dark.css" }, + breakpoint: "breakpoint.css", + index: { + name: "index.css", + import: ["./global.css", "./classes.css"], + media: [ + ["prefers-color-scheme: light", "light"], + ["prefers-color-scheme: dark", "dark"], + ], + class: [ + ["calcite-mode-light", "light"], + ["calcite-mode-dark", "dark"], + ], + }, + }, + scss: { + typography: "mixins.scss", + colorScheme: { light: "light.scss", dark: "dark.scss" }, + breakpoint: "breakpoints.scss", + index: { + name: "index.scss", + import: ["./global.scss", "./breakpoints.scss", "./mixins.scss"], + mixin: [ + ["calcite-mode-light", "light"], + ["calcite-mode-dark", "dark"], + ], + }, + }, + js: { + breakpoint: "breakpoints.js", + index: { + name: "index.js", + export: ["./global.js", "./breakpoints.js"], + }, + }, + }, + }, +}; + +export default config; diff --git a/packages/calcite-design-tokens/src/$metadata.json b/packages/calcite-design-tokens/src/$metadata.json deleted file mode 100644 index be4d1de1ab8..00000000000 --- a/packages/calcite-design-tokens/src/$metadata.json +++ /dev/null @@ -1,76 +0,0 @@ -{ - "tokenSetOrder": [ - "core", - "semantic", - "component/accordion-item", - "component/accordion", - "component/action", - "component/button", - "component/split-button", - "component/fab", - "component/checkbox", - "component/chip", - "component/dropdown", - "component/dropdown-item", - "component/action-bar", - "component/action-bar-grid", - "component/action-pad", - "component/action-pad-grid", - "component/alert", - "component/avatar", - "component/block", - "component/block-section", - "component/card", - "component/combobox", - "component/date-picker", - "component/color-picker", - "component/input-date-picker", - "component/input-datetime-local", - "component/input-email", - "component/input-file", - "component/input-month", - "component/input-number", - "component/input-password", - "component/input-search", - "component/input-telephone", - "component/input-message", - "component/input-time", - "component/input-text", - "component/input-week", - "component/modal", - "component/notice", - "component/textarea", - "component/label", - "component/link", - "component/filter", - "component/loader", - "component/radio", - "component/tab-title", - "component/tabs", - "component/rating", - "component/tip", - "component/tip-manager", - "component/tooltip", - "component/panel-header", - "component/popover", - "component/pagination", - "component/segmented-control", - "component/slider", - "component/slider-histogram", - "component/slider-histogram-range", - "component/slider-range", - "component/stepper", - "component/stepper-item", - "component/switch", - "component/[template-comp-name]", - "component/time-picker", - "component/scrim", - "component/tree-item", - "component/accordion_backup", - "calcite/light", - "calcite/dark", - "brand/global", - "brand/light", - "brand/dark" - ] -} diff --git a/packages/calcite-design-tokens/src/$themes.json b/packages/calcite-design-tokens/src/$themes.json deleted file mode 100644 index f9f6fa91b93..00000000000 --- a/packages/calcite-design-tokens/src/$themes.json +++ /dev/null @@ -1,2363 +0,0 @@ -[ - { - "id": "59a65f6d4a3657738c9d46d61315ae0b6fc6e9fd", - "name": "Brand - Light", - "selectedTokenSets": { - "brand/global": "enabled", - "brand/light": "enabled", - "core": "source", - "semantic": "source" - }, - "$figmaStyleReferences": {} - }, - { - "id": "d7056b4e805091c91b5ec1b6ce901ba3d606e7a8", - "name": "Brand - Dark", - "selectedTokenSets": { - "brand/dark": "enabled", - "brand/global": "enabled", - "core": "source", - "semantic": "source" - }, - "$figmaStyleReferences": {} - }, - { - "id": "dde8954f0b730e49860d3c5e7608e7601dd1ed8a", - "name": "Calcite - Dark", - "selectedTokenSets": { - "calcite/dark": "enabled", - "component/accordion-item": "source", - "component/accordion": "source", - "component/action-bar-grid": "source", - "component/action-bar": "source", - "component/action-pad-grid": "source", - "component/action-pad": "source", - "component/action": "source", - "component/alert": "source", - "component/avatar": "source", - "component/block-section": "source", - "component/block": "source", - "component/button": "source", - "component/card": "source", - "component/checkbox": "source", - "component/chip": "source", - "component/color-picker": "source", - "component/combobox": "source", - "component/date-picker": "source", - "component/dropdown-item": "source", - "component/dropdown": "source", - "component/fab": "source", - "component/filter": "source", - "component/icon": "source", - "component/input-date-picker": "source", - "component/input-datetime-local": "source", - "component/input-email": "source", - "component/input-file": "source", - "component/input-message": "source", - "component/input-month": "source", - "component/input-number": "source", - "component/input-password": "source", - "component/input-search": "source", - "component/input-telephone": "source", - "component/input-text": "source", - "component/input-time": "source", - "component/input-week": "source", - "component/label": "source", - "component/link": "source", - "component/loader": "source", - "component/modal": "source", - "component/notice": "source", - "component/pagination": "source", - "component/panel-header": "source", - "component/popover": "source", - "component/radio": "source", - "component/rating": "source", - "component/scrim": "source", - "component/segmented-control": "source", - "component/slider-histogram-range": "source", - "component/slider-histogram": "source", - "component/slider-range": "source", - "component/slider": "source", - "component/split-button": "source", - "component/stepper-item": "source", - "component/stepper": "source", - "component/switch": "source", - "component/tab-title": "source", - "component/tabs": "source", - "component/textarea": "source", - "component/tile": "source", - "component/tip-manager": "source", - "component/tip": "source", - "component/tooltip": "source", - "component/tree-item": "source", - "core": "source", - "semantic": "source" - }, - "$figmaStyleReferences": { - "avatar.background.blue.dark": "S:f55b5063803cb7b8c47f821fc8fc6aad9a0a76e2,", - "avatar.background.blue.light": "S:d5b4987addab42650b6841042f867b662d99fd3d,", - "avatar.background.default.dark": "S:3fe6caf2c16005180bdf56fc1973cb71d930ce05,", - "avatar.background.default.light": "S:07e7246a6f68a2e784ff5863d7bbd62ab9b10374,", - "avatar.background.green.dark": "S:755ebf1aecade2424d5422fa9fd7fe34c3c1561d,", - "avatar.background.green.light": "S:fd438ba50050f98e6f45a09730464b712b30e8ad,", - "avatar.background.red.dark": "S:6a2a95cac48bdd7f912b68a91b19aa415422a601,", - "avatar.background.red.light": "S:dc2ed13e55b410f025b96f314ca3f0c08714c89a,", - "avatar.background.teal.dark": "S:9ab31e07a296b45185db32fcafb76c67b03eed6e,", - "avatar.background.teal.light": "S:32a5570d250de432dbee8487aa07649ea0968a1d,", - "avatar.background.yellow.dark": "S:2a376b0ec0a524b3209ef9b7738af7a2afe30bdc,", - "avatar.background.yellow.light": "S:a7bc46963e781aa9efbfce2554ada92b984e1acd,", - "avatar.font.dark": "S:059f3a598ad40dc425229b56b3707b92c3b9edcc,", - "avatar.font.light": "S:d2e5af5950b590e4fe1bf9bfacc0396b2becc6e0,", - "avatar.icon.dark": "S:0ff6bb1b6446005a8f19a439176f5be3577a2d81,", - "avatar.icon.light": "S:40f0f7ce73f1ee5373bacee49c5bb5f2cf62f161,", - "color.background.1": "S:1582df0a1264e64386ae37d62ac007a953bc5043,", - "color.border.1": "S:234173fffe103275f1fb458852714bd790893c3b,", - "color.border.2": "S:41f3b5356c477eef1b0e8823fdfbcb32ba0de0c3,", - "color.border.3": "S:1809682a56a1266d657084ffa0a954623699c1b3,", - "color.border.input": "S:3b8e0a68b3324cb53d2ad435ccbb881260e71f13,", - "color.brand.default": "S:b28244f76fae4e504bbfa18bb30e111e02a00461,", - "color.brand.hover": "S:b2369f6f6c213b28bc1f85b74e862c86d810c2c5,", - "color.brand.press": "S:6d7befb326831876f8d0cf865ace3aa5cfe7a2ac,", - "color.component.avatar.background.blue": "S:64ff455cb9703578b7e7b903b4ae694872e32cc3,", - "color.component.avatar.background.default": "S:3e15d33e4e613128731e257a297158519a0867e3,", - "color.component.avatar.background.green": "S:90b1667b189d1eba24eaa558bff130b38f1c148a,", - "color.component.avatar.background.red": "S:8201984ce70dd96e17ecf094495fb6ff84b9abdf,", - "color.component.avatar.background.teal": "S:c2d6a3451d6afe1db88f13efb6f19326c5e9de88,", - "color.component.avatar.background.yellow": "S:751fd19d88078815098550b4e08ea5166e693a73,", - "color.component.avatar.font": "S:ed7416d3e4329b342ab2b4445d9b9fe5a3ec0bec,", - "color.component.avatar.icon": "S:b2ee6af51144f4ebcb241d7533c6f934e465f7a9,", - "color.component.checkbox.background.default": "S:f117ae12de004938e01565991d327345562bf8e5,", - "color.component.checkbox.background.selected": "S:49563bc20e686d51e17f95c48ddb6dec634bd7b2,", - "color.component.checkbox.border": "S:e699073db7724f2aebdbc1dc28d0189e69c19202,", - "color.component.checkbox.font": "S:0a53f46f8f093092bf2b04b3ba2ed96894431521,", - "color.component.checkbox.icon": "S:2cd2d72b045e427cce635b47eedca442a910c09d,", - "color.danger.default": "S:d0f902c03b5eba16e36ddf55e9f9ea2d2d75fc9b,", - "color.danger.hover": "S:3498bf797dd95ff7740a85fedf2c71b3227cb6d0,", - "color.danger.press": "S:95cefddc413c4a35a47562871b80261ecf1da642,", - "color.foreground.1": "S:8b3785c187b6bcbecb184e539d79f9c032fcf8ff,", - "color.foreground.2": "S:583e6fe6adec03b50ac386027ad94c75d269afd5,", - "color.foreground.3": "S:48f1acd94d07000f5ef84f9076616f3e7a655e80,", - "color.info.default": "S:fd68f31a4f93ecebf9e2cf1ec4b532178c4d31da,", - "color.info.hover": "S:8efab98eccb4ace87a30adfe2da1a24811208ac2,", - "color.info.press": "S:ef4406951e42e1b319346672293f7d163c619a53,", - "color.inverse.default": "S:38bb53cb8950170a464c2c48d6ac84102f9cd893,", - "color.success.default": "S:6873a84169b622afbccfde1be36ae5c576e135d1,", - "color.success.hover": "S:4fd1d5d649b6e675f15b103123aa96cbcd75dfcb,", - "color.success.press": "S:17a3a09fbbd39051f0a9e95b369450789cd04347,", - "color.text.1": "S:75e55b33ec6bb5bf28fdd3f09bb8a284fb6e0b37,", - "color.text.2": "S:4af6f5b0564e62a1f019d1d5b3baf0e125eeb1b7,", - "color.text.3": "S:8e6473234a1f2e30d26fcaab8c5987f4e85ef7f8,", - "color.text.inverse": "S:47483fd2fa8b0df77f51fa172230425edd63175f,", - "color.text.link": "S:29e00fdf7c59933ccd5f6b6fa4b1affe85fb04b7,", - "color.warning.default": "S:8e6eae59c25bdbc0871221e6581b112b127f608c,", - "color.warning.hover": "S:51d34d48b0994c4c7e3554f0d10f599704742d7b,", - "color.warning.press": "S:adcc39cebb2d0c3d87575e1e302b7b3db8de7b9a," - } - }, - { - "id": "ed0c822a9f81dad2733717990c607c1527803a14", - "name": "Calcite - Light", - "selectedTokenSets": { - "calcite/light": "enabled", - "component/[template-comp-name]": "disabled", - "component/accordion-item": "source", - "component/accordion": "source", - "component/action-bar-grid": "source", - "component/action-bar": "source", - "component/action-pad-grid": "source", - "component/action-pad": "source", - "component/action": "source", - "component/alert": "source", - "component/avatar": "source", - "component/block-section": "source", - "component/block": "source", - "component/button": "source", - "component/card": "source", - "component/checkbox": "source", - "component/chip": "source", - "component/color-picker": "source", - "component/combobox": "source", - "component/date-picker": "source", - "component/dropdown-item": "source", - "component/dropdown": "source", - "component/fab": "source", - "component/filter": "source", - "component/icon": "source", - "component/input-date-picker": "source", - "component/input-datetime-local": "source", - "component/input-email": "source", - "component/input-file": "source", - "component/input-message": "source", - "component/input-month": "source", - "component/input-number": "source", - "component/input-password": "source", - "component/input-search": "source", - "component/input-telephone": "source", - "component/input-text": "source", - "component/input-time": "source", - "component/input-week": "source", - "component/label": "source", - "component/link": "source", - "component/loader": "source", - "component/modal": "source", - "component/notice": "source", - "component/pagination": "source", - "component/panel-header": "source", - "component/popover": "source", - "component/radio": "source", - "component/rating": "source", - "component/scrim": "source", - "component/segmented-control": "source", - "component/slider-histogram-range": "source", - "component/slider-histogram": "source", - "component/slider-range": "source", - "component/slider": "source", - "component/split-button": "source", - "component/stepper-item": "source", - "component/stepper": "source", - "component/switch": "source", - "component/tab-title": "source", - "component/tabs": "source", - "component/textarea": "source", - "component/tile": "source", - "component/tip-manager": "source", - "component/tip": "source", - "component/tooltip": "source", - "component/tree-item": "source", - "core": "source", - "semantic": "source" - }, - "$figmaStyleReferences": { - "avatar.background.blue.dark": "S:e670a15c9ed66a081f909173051dcbe73ca52b2a,", - "avatar.background.blue.light": "S:84fd60e34374234bd0218a9804189174216753cd,", - "avatar.background.default.dark": "S:21e4050d998c532b48a4794499bdf0fc8dc40f3d,", - "avatar.background.default.light": "S:fc7cbae9041ec1e69cadf22d073651684f3bfa7b,", - "avatar.background.green.dark": "S:236cef69cf105927f0e3f9d3f95be5e51c0974ce,", - "avatar.background.green.light": "S:d287241bdb024f876fd2f3182889b7d902ec5397,", - "avatar.background.red.dark": "S:43167db8d5920165de4b6c5961115948b1109f46,", - "avatar.background.red.light": "S:5e5e5b1c04d00f22057e1232d5e1f75058b665fe,", - "avatar.background.teal.dark": "S:8b28bd3c2dbacbaf58681003f4d2f7205c4eb981,", - "avatar.background.teal.light": "S:29cd7b69404f52dace74879f084440fdcdb3bf80,", - "avatar.background.yellow.dark": "S:8fb9c3b80bbebcd2c5f387765531dce6e1bb4cdd,", - "avatar.background.yellow.light": "S:bd039bd8a3b4a4776aeb5483d98e079a20d73424,", - "avatar.font.dark": "S:0455ada9e4752cca1342966cd7d5eedb1cbeabb4,", - "avatar.font.lg": "S:258f39886eafb90a51840cde23ad24fa32901793,", - "avatar.font.light": "S:e93c764c313971860912b7cf47a6c11fc4f9d493,", - "avatar.font.md": "S:2dec7cbce4c3fcd922bbe178629bee2171adbeda,", - "avatar.font.sm": "S:39803c9962fb4f3962d41195f6a4b28393f74c2c,", - "avatar.icon.dark": "S:f33d7baaa96d9466795650b23005c6fbd41a9e13,", - "avatar.icon.light": "S:be21f8df72687ebcc3cd8321df2ae2120ede082b,", - "color.background.1": "S:996e66837184eae6d9d8f35cddb746f31ae95e8f,", - "color.border.1": "S:c435bbd81ddbeadc4cec2ef4ea3bc543b9e9c601,", - "color.border.2": "S:9039c459e59f5bc01049650971307a668612c2cf,", - "color.border.3": "S:43fb608dfa6007beee48b235b6565b5c141d924e,", - "color.border.input": "S:312d22eefcdd007e392a4fc83600a8c1cd8a02ff,", - "color.brand.default": "S:4ae7e0e0a08b9109fef0b6c2cb45185a3b711de8,", - "color.brand.hover": "S:4117296cea5558142d1c04412a32c3a3c763db83,", - "color.brand.press": "S:b48b96dd50acc8e3d9fcd09dd5886459144fc135,", - "color.component.avatar.background.blue": "S:41143d2e38b160662fa3a3e79a4d8ae277da272b,", - "color.component.avatar.background.default": "S:a6b0c1cf56cc9ca0aea0ea5af9f5c4157e5cc291,", - "color.component.avatar.background.green": "S:63281f19470ef4ca444175733bc566845a7280da,", - "color.component.avatar.background.red": "S:b3cc9db7480b1c21608646ea16f916a8ae2b4106,", - "color.component.avatar.background.teal": "S:3098a0784423b82b5812516264141aa4faf08e23,", - "color.component.avatar.background.yellow": "S:96bd99a7f9331233f9019d9c4a5535de44390061,", - "color.component.avatar.font": "S:f79e6cdc2d5ae580f3f89532b587d6b0067e1ccc,", - "color.component.avatar.icon": "S:ec2e68c7ef3a7246297e516f8819d683ae9fe70f,", - "color.component.checkbox.background.default": "S:701cc919d4f6976fbdf445b290e60ce77e8435f4,", - "color.component.checkbox.background.selected": "S:086b38ee2fa73acced270182eb7a3ed1fa173498,", - "color.component.checkbox.border": "S:1e397d4475d46cc908e3b8ce7fd30514722a14c3,", - "color.component.checkbox.font": "S:0cab9b6b3026d154168f7e7c141d0e7d72d67c9f,", - "color.component.checkbox.icon": "S:f602fe0d0a62962edaace2bef590d8a9c041dbd2,", - "color.danger.default": "S:6387aaad732a7af1dc1cfd2ebf173d7fce52f09b,", - "color.danger.hover": "S:f865024aa52cff429465d136a1cd33c5a705d500,", - "color.danger.press": "S:40ba713b33a34a8b8c84b49e42e7c08c59d150f2,", - "color.foreground.1": "S:4430d79bfb69d028923a8b3f3ed2378f4f18817d,", - "color.foreground.2": "S:037fdef29562d034fa86fe4e33bddc5832126f39,", - "color.foreground.3": "S:f64f38d95efd0ee7425337762f1b07fd3ef267de,", - "color.info.default": "S:7d8b66df444ecb7a82a1a0364109428c555f86a1,", - "color.info.hover": "S:70e59d2edb727dfae58c56d3754e61dca4b7918a,", - "color.info.press": "S:2308a9c3a366ac93ec93e226fcac4991e013642d,", - "color.inverse.default": "S:3f1a6a4a44638632869f9f52429dc813f14bf5dd,", - "color.success.default": "S:8938fd168ecd800e480319ecaf53d2b04401af77,", - "color.success.hover": "S:3d113fe8b2012f528ccd78cf9a96377786eae56f,", - "color.success.press": "S:bb85e214f894a1cb93ac04014b99487c211552fd,", - "color.text.1": "S:d233bb530a4948b2685e4b5bdfd853f33a0dcd0d,", - "color.text.2": "S:82ed587d54024336cc40fe9dfd317475b5dd3b39,", - "color.text.3": "S:c830a12e4f31561833b5e5e1b9b92027d65016de,", - "color.text.inverse": "S:99167a67ee7a3e175ba7f50d3614f608981da2ac,", - "color.text.link": "S:23084a1f7e61f7c53a8b95cf0c31b6cde75d1146,", - "color.warning.default": "S:769a2bddf6b2011bd2fa092acf5c81b2b672b84a,", - "color.warning.hover": "S:e4e9f3676887af2b5bff561e160deb1b2482a694,", - "color.warning.press": "S:8dfd39d391f9e6cff3188e224a2ae47949b949c9," - } - }, - { - "id": "f3768dee38b252f1dfdddfb3f2fde9782d3560bc", - "name": "Calcite Headless", - "selectedTokenSets": { - "component/[template-comp-name]": "disabled", - "component/accordion-item": "enabled", - "component/accordion": "enabled", - "component/action-bar-grid": "enabled", - "component/action-bar": "enabled", - "component/action-pad-grid": "enabled", - "component/action-pad": "enabled", - "component/action": "enabled", - "component/alert": "enabled", - "component/avatar": "enabled", - "component/block-section": "enabled", - "component/block": "enabled", - "component/button": "enabled", - "component/card": "enabled", - "component/checkbox": "enabled", - "component/chip": "enabled", - "component/color-picker": "enabled", - "component/combobox": "enabled", - "component/date-picker": "enabled", - "component/dropdown-item": "enabled", - "component/dropdown": "enabled", - "component/fab": "enabled", - "component/filter": "enabled", - "component/icon": "enabled", - "component/input-date-picker": "enabled", - "component/input-datetime-local": "enabled", - "component/input-email": "enabled", - "component/input-file": "enabled", - "component/input-message": "enabled", - "component/input-month": "enabled", - "component/input-number": "enabled", - "component/input-password": "enabled", - "component/input-search": "enabled", - "component/input-telephone": "enabled", - "component/input-text": "enabled", - "component/input-time": "enabled", - "component/input-week": "enabled", - "component/label": "enabled", - "component/link": "enabled", - "component/loader": "enabled", - "component/modal": "enabled", - "component/notice": "enabled", - "component/pagination": "enabled", - "component/panel-header": "enabled", - "component/popover": "enabled", - "component/radio": "enabled", - "component/rating": "enabled", - "component/scrim": "enabled", - "component/segmented-control": "enabled", - "component/slider-histogram-range": "enabled", - "component/slider-histogram": "enabled", - "component/slider-range": "enabled", - "component/slider": "enabled", - "component/split-button": "enabled", - "component/stepper-item": "enabled", - "component/stepper": "enabled", - "component/switch": "enabled", - "component/tab-title": "enabled", - "component/tabs": "enabled", - "component/textarea": "enabled", - "component/tip": "enabled", - "component/tooltip": "enabled", - "component/tree-item": "enabled", - "core": "enabled", - "semantic": "enabled" - }, - "$figmaStyleReferences": { - "[comp-name].background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "[comp-name].background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "[comp-name].border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "[comp-name].border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "[comp-name].font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "[comp-name].font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "[comp-name].font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "[comp-name].font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "[comp-name].font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "[comp-name].foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "[comp-name].foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "[comp-name].icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "[comp-name].icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "accordion-item.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "accordion-item.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "accordion-item.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "accordion-item.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "accordion-item.font.description.dark": "S:82f969d559027f722de3d4c50d2fb72202a0fc39,", - "accordion-item.font.description.light": "S:756bd2c5199ccad18c6ae14ee52345f24153dfa4,", - "accordion-item.font.descrition.lg": "S:f248373f8c30765addca512c0a58e0471cdbbd92,", - "accordion-item.font.descrition.md": "S:74815d27fbc39d0e8e0221d98771575763398a36,", - "accordion-item.font.descrition.sm": "S:f228bade32be994f29a47ae05d541bc1f127b991,", - "accordion-item.font.heading.dark": "S:4f4e2f3704149243cbc51de2195d62dc933e78d0,", - "accordion-item.font.heading.lg": "S:26e38b824652312797550c4393b9af9201d16410,", - "accordion-item.font.heading.light": "S:aefd98949c7fdb4df9c74643ca4b9ff1fb7677a1,", - "accordion-item.font.heading.md": "S:a753ee474e5276d2c3253cbf0c389bb17f0d993d,", - "accordion-item.font.heading.sm": "S:22cd3c704f1ff153a930b1de5482c90d06b68463,", - "accordion-item.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "accordion-item.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "accordion-item.icon.expanded.dark": "S:587b66cd00f9aa16f13bafd05481e6d3fc2bfc52,", - "accordion-item.icon.expanded.light": "S:e86ffc1b86f516ff744eb2b695fea0f7e6a06250,", - "accordion.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "accordion.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "accordion.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "accordion.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "accordion.description.dark": "S:799bc4c7335cb1325182383cfc46902f4b2dd826,", - "accordion.description.light": "S:cb01ae66ab41b4df8b4683fef5cc6030de18b079,", - "accordion.heading.dark": "S:0e150e73c0b5e8e7bebfadc132c82e875d1392e6,", - "accordion.heading.light": "S:db3aa5453c145e02177ac3004f0594e2094b7859,", - "accordion.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "accordion.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "accordion.icon.expanded.dark": "S:587b66cd00f9aa16f13bafd05481e6d3fc2bfc52,", - "accordion.icon.expanded.light": "S:e86ffc1b86f516ff744eb2b695fea0f7e6a06250,", - "action-bar-grid.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "action-bar-grid.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "action-bar-grid.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "action-bar-grid.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "action-bar.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "action-bar.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "action-bar.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "action-bar.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "action-pad-grid.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "action-pad-grid.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "action-pad-grid.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "action-pad-grid.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "action-pad-grid.shadow.lg": "S:ca2d6acae938d750c3ebd78a6713350177c6c0c5,", - "action-pad-grid.shadow.md": "S:d2c3cde852cf462e84414acac0b6f2c1f9e1003f,", - "action-pad-grid.shadow.sm": "S:857dcbb04d49470c09751d4f20741e87985fecec,", - "action-pad.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "action-pad.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "action-pad.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "action-pad.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "action-pad.shadow.lg": "S:ca2d6acae938d750c3ebd78a6713350177c6c0c5,", - "action-pad.shadow.md": "S:d2c3cde852cf462e84414acac0b6f2c1f9e1003f,", - "action-pad.shadow.sm": "S:857dcbb04d49470c09751d4f20741e87985fecec,", - "action.background.active.dark": "S:2ae52fe76f9def32610a5350625d32781b6b06f4,", - "action.background.active.light": "S:ef2a2a44d264ec06e2c24185b8f5ed7f931652ed,", - "action.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "action.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "action.font.active.dark": "S:110f5ed1169157e68633b551cddec014c8311332,", - "action.font.active.light": "S:0be948a90930d88d5fa41366c5dfd0eb55b5b7a0,", - "action.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "action.font.default.dark": "S:4c5d135c09d35ba6ab69fd50adcc3e6b908c42ec,", - "action.font.default.light": "S:da358d253b4d43ea28103a02475ca67ed10b83e8,", - "action.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "action.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "action.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "action.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "action.icon.active.dark": "S:2743e683afb346b7f2f568b5545adac658b3be2d,", - "action.icon.active.light": "S:2b1f2a21fe90450dae8cf2345ca8dbc1a13abe06,", - "action.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "action.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "action.indicator.dark": "S:b2c7c4f184b2ee2bb12274865ab84dc5f2eaee09,", - "action.indicator.light": "S:dba58a89b82ed1ddcbe79772d66e6064b0ff21f1,", - "action.loader-icon.dark": "S:5531396af52cc9e186d10da418be5f6bb2b364ee,", - "action.loader-icon.light": "S:bf9fb786f9562fa5988589c2336e82d8b56f3e34,", - "alert.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "alert.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "alert.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "alert.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "alert.font.message.dark": "S:7815f7fb82fdc4c4c26e1623790dffe9e187a466,", - "alert.font.message.lg": "S:09c48ee987903ee44f92b7fd85f5e4dea0ead949,", - "alert.font.message.light": "S:6cf383eac5cca5700a959ab59f20a865a46decd5,", - "alert.font.message.md": "S:914616baac8f924bb3068d03da85a3d7598a4eed,", - "alert.font.message.sm": "S:62cbe66d7a194cf143b483c76e81b3ef7faec7e4,", - "alert.font.title.dark": "S:a0ac87895a271a4c9bfda2ccc0254549ccbf2896,", - "alert.font.title.lg": "S:051bc74df8ad468b012d4a69124462a7bd88ac16,", - "alert.font.title.light": "S:d274bba017fa590088dca04c9015131da09237de,", - "alert.font.title.md": "S:bb08857b89d59fa3d1473495b191094ae721da80,", - "alert.font.title.sm": "S:3ce9291673796d12312501274a38efcf55f6b482,", - "alert.highlight.blue.dark": "S:db000ee1304d89f2f129b1dc05bddeeb0c27faa8,", - "alert.highlight.blue.light": "S:d06b668f7b2e939e6a4eab82a6f143c5e440faf0,", - "alert.highlight.green.dark": "S:a881a827f501f0890e4f03d4404bec97094aa041,", - "alert.highlight.green.light": "S:e324e6552b39a2db26d76da925a70ab5d8c07a10,", - "alert.highlight.red.dark": "S:9cb1b42abcd0ef58fdb3a1f7b2c030410cf720b6,", - "alert.highlight.red.light": "S:a08c993c84b045345121c6c87d9c434c8c6a625c,", - "alert.highlight.yellow.dark": "S:7729ee4a2bce3753785a33aa99df95e44ba2ea37,", - "alert.highlight.yellow.light": "S:755c350d0874c569f9c73fba1c4fe8604a9a065d,", - "alert.icon.blue.dark": "S:a60354ca19575dfe34c4c35f8846bd28c4796ab8,", - "alert.icon.blue.light": "S:76f65d8ec01d5472cd2ee30b970d1191e24b21a3,", - "alert.icon.green.dark": "S:e71da60b629c97a7ac832d88cdefa655664cd38a,", - "alert.icon.green.light": "S:25e3219805c14739a43718e5c55c066001bc00d1,", - "alert.icon.red.dark": "S:0fdbcf1a38f260e10527f5bd5a84a2a0183e9bcb,", - "alert.icon.red.light": "S:f854ce135867b3fab5c250b84422539684c92f28,", - "alert.icon.yellow.dark": "S:2524c0634b4411fa44d0c76177e587d40243c654,", - "alert.icon.yellow.light": "S:9ad965d79acdf9a9364a61394028db7535efdb59,", - "alert.shadow": "S:da1daed980d1d213e4a1bef7afcb9221ee263cde,", - "avatar.background.blue.dark": "S:adcb513654fc4a335332bd7cffd516805ed8e0da,", - "avatar.background.blue.light": "S:e6f70231d5734d0abb13a62fb0b28639c711d5eb,", - "avatar.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "avatar.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "avatar.background.green.dark": "S:c707a517f7e4fd908707a14a119c4eb3c656aa9b,", - "avatar.background.green.light": "S:303caddb723321f904804f0e0de733143d3a5980,", - "avatar.background.red.dark": "S:706f2f2a48db1827512c44cfc6399c2646f255ce,", - "avatar.background.red.light": "S:15480901727a45856967d3e6203a510279eaf126,", - "avatar.background.teal.dark": "S:6e24e66c70e6650e8fcece5816f9e4a174590adf,", - "avatar.background.teal.light": "S:3d5a2a9f65af84740e758bce0f39b9429bb4d693,", - "avatar.background.yellow.dark": "S:c17fd8acec7ed4cc44492e62025c11ea4f8ee1e3,", - "avatar.background.yellow.light": "S:70442e1c6857374d7c798f0443c98c9359e43d62,", - "avatar.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "avatar.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "avatar.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "avatar.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "avatar.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "avatar.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "avatar.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "block-section.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "block-section.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "block-section.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "block-section.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "block-section.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "block-section.icon.chevron.dark": "S:9efa9354a66d5d3fa260049c448260d556bf4c0b,", - "block-section.icon.chevron.light": "S:af5fabff28cd8db6aa06132f0493b629e04023d9,", - "block-section.icon.invalid.dark": "S:0f281ff3e987e7f74de0148d27a4e95c2a79b096,", - "block-section.icon.invalid.light": "S:82bdf7ab1c1e59e540a14b82f13e36170a401d00,", - "block-section.icon.valid.dark": "S:e723fefacb42d17262ce1549ae853cfe60f546ac,", - "block-section.icon.valid.light": "S:32d6ffe05ebc11b5c0e9c41a089941b6f827ee64,", - "block.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "block.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "block.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "block.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "block.font.content.dark": "S:5bf1d0dbbd8f49618514192dbfcaf7057cd6f72a,", - "block.font.content.light": "S:c46be83f52216f16ced44f463fcedcf82d3ee870,", - "block.font.content.md": "S:b2c1bb5f4c41d1d2af5feb08ce085d132682c3e3,", - "block.font.description.dark": "S:82f969d559027f722de3d4c50d2fb72202a0fc39,", - "block.font.description.light": "S:756bd2c5199ccad18c6ae14ee52345f24153dfa4,", - "block.font.description.md": "S:2e204d97e7e530c52c455d00cd8e6354b2a81230,", - "block.font.heading.dark": "S:4f4e2f3704149243cbc51de2195d62dc933e78d0,", - "block.font.heading.light": "S:aefd98949c7fdb4df9c74643ca4b9ff1fb7677a1,", - "block.font.heading.md": "S:a753ee474e5276d2c3253cbf0c389bb17f0d993d,", - "block.icon.chevron.dark": "S:9efa9354a66d5d3fa260049c448260d556bf4c0b,", - "block.icon.chevron.light": "S:af5fabff28cd8db6aa06132f0493b629e04023d9,", - "block.icon.drag-handle.dark": "S:bee7da2a1ce827c8937234f1fbaafe97877201e2,", - "block.icon.drag-handle.light": "S:4167dec666a9ebc6855f6445e070d1fbab3f124a,", - "block.icon.idle.dark": "S:37f89d2bdd848ec033c26905f5cf5dcd8fd5c642,", - "block.icon.idle.light": "S:f02d0fb7bba5b12f80f94cba50e49649f3d2ddd8,", - "block.icon.invalid.dark": "S:0f281ff3e987e7f74de0148d27a4e95c2a79b096,", - "block.icon.invalid.light": "S:82bdf7ab1c1e59e540a14b82f13e36170a401d00,", - "block.icon.valid.dark": "S:e723fefacb42d17262ce1549ae853cfe60f546ac,", - "block.icon.valid.light": "S:32d6ffe05ebc11b5c0e9c41a089941b6f827ee64,", - "button.background.brand.outline-fill.dark": "S:8678a0fbc3f714e32748570133a83196b950ed2f,", - "button.background.brand.outline-fill.light": "S:356e6d14763585871bd53c4cc2ec99d47b6b1bd1,", - "button.background.brand.solid.dark": "S:c4f155329acd3fa825039e112cd4ea09fb3ea4a3,", - "button.background.brand.solid.light": "S:dd9bb7dad71d92ee3c7cc2026d03ab89f2a9691b,", - "button.background.danger.outline-fill.dark": "S:f51cf28d983ce6ce1fb55283c8f6b4128453aadd,", - "button.background.danger.outline-fill.light": "S:8535b8d82c005d8f58aba23f89947bce3df1802a,", - "button.background.danger.solid.dark": "S:e27adfeb093144a23d471200ac2cffce91ab700c,", - "button.background.danger.solid.light": "S:13047564e6421aa299765a9d27307c185f65f175,", - "button.background.inverse.outline-fill.dark": "S:6a767312e3fd02e644b2c0ae16e3b21b7745d499,", - "button.background.inverse.outline-fill.light": "S:df3c70fb6bfc73acd17ab2112b9274c4cbb507f1,", - "button.background.inverse.solid.dark": "S:ab5f338c53c3aeffa576ca66a6bc96e6f829e8c3,", - "button.background.inverse.solid.light": "S:ff4c2b0cfc2189392cf61c2a7b3a8c11cd22731a,", - "button.background.neutral.outline-fill.dark": "S:5e6ef27842035bb11d8d51a3ef3690aa65e061d7,", - "button.background.neutral.outline-fill.light": "S:a5f704a03dc74e1d0850303d7c0f7ab3c61c1137,", - "button.background.neutral.solid.dark": "S:5179f1ca6dd4eef2586d0fd1010dd65b5f144bdb,", - "button.background.neutral.solid.light": "S:ac255c63a366d9fbb483dc43240b43953c87fdbd,", - "button.border.brand.outline-fill.dark": "S:8cf9a289bd0941513d5c87b9f56f08dca0e706d5,", - "button.border.brand.outline-fill.light": "S:62c0774ad6ce9511677ac96bc26b27aa20c0f764,", - "button.border.brand.outline.dark": "S:1206b15553941f23d821e3ac2e2356e86733333c,", - "button.border.brand.outline.light": "S:5942ca53e46c9c4d7505a40a90b90a8ae3c87afa,", - "button.border.brand.solid.dark": "S:c675794954c819b4aa0f731b8a492dda370f1b1b,", - "button.border.brand.solid.light": "S:bd7ea9269499e13add0ce3b7c573f0d5cf43477f,", - "button.border.danger.outline-fill.dark": "S:877a5834cefc4549d1e853b6cdb36fa19e4cd8df,", - "button.border.danger.outline-fill.light": "S:98f004dc58d8984e13da424d8533268a6a76bfbe,", - "button.border.danger.outline.dark": "S:34e2d7edfe99cdb6833425e7d33f7269e801bd35,", - "button.border.danger.outline.light": "S:dac592a30b402672ee19c38cee360264a7823546,", - "button.border.danger.solid.dark": "S:4cdc01ddae3da56ebf6711769e5c59dcb5af076d,", - "button.border.danger.solid.light": "S:6afa6160f17831b2c371f07eb2f529f79c75cb8b,", - "button.border.inverse.outline-fill.dark": "S:4884ebb6c0dee956a73b02ede0064c95fb82aa2e,", - "button.border.inverse.outline-fill.light": "S:7bbc07ccb6c8f25e37398a0da56cc813e98fc1be,", - "button.border.inverse.outline.dark": "S:0f0f21f139a36b68f9c46a82a4f3a0d871225328,", - "button.border.inverse.outline.light": "S:75364b4f0c001e011435396de3da6507780ce7d2,", - "button.border.inverse.solid.dark": "S:79d49b3abca4ba1459da9ebafe07d1efd4b01763,", - "button.border.inverse.solid.light": "S:573938363514bd57d61b7938a8c2337aa45af89b,", - "button.border.neutral.outline-fill.dark": "S:23b1a1778fd5e6e9781957e4482f70aa15e5882a,", - "button.border.neutral.outline-fill.light": "S:497264411bb2a951c9800e7c97d3f075243ef249,", - "button.border.neutral.outline.dark": "S:e31fa7bb3960cdf35f11e1a4f512773f5504100b,", - "button.border.neutral.outline.light": "S:17b18a49ebbd56a80e8d4f01b445d0e3203788a6,", - "button.border.neutral.solid.dark": "S:d042c2179e1697999fcc9c39b2442cd82470a8d3,", - "button.border.neutral.solid.light": "S:c333cbb4c8def6f57023cdd369fe5af2c03316bc,", - "button.font.brand.outline-fill.dark": "S:bd21ca35dd933333ff1195ce9261c8e9b937dfb6,", - "button.font.brand.outline-fill.light": "S:1ac84c8153029c94ad049b3b0a9234752e7be855,", - "button.font.brand.outline.dark": "S:7beb60e35440fb45e91d24d8acc14db5b1533bb4,", - "button.font.brand.outline.light": "S:a929ca685859c1fc5e7faf543728b2edf3b5f243,", - "button.font.brand.solid.dark": "S:a7d2d81dd38360910fafa4f7d85e7f9ccff2854e,", - "button.font.brand.solid.light": "S:cc4ae5ba632fc1f1f626de4003c05f1475c97d27,", - "button.font.brand.transparent.dark": "S:8d19dd77778ab4642015721ce060bd7ec15f240d,", - "button.font.brand.transparent.light": "S:74cfdb55361a2fcfdf0e79657b1aa9b3e6cffb8c,", - "button.font.danger.outline-fill.dark": "S:291f34d6da9c98d93b53e6faf6903ba6254d6ead,", - "button.font.danger.outline-fill.light": "S:d1bb8ed5b65f5526859bba88478a173fb9b929a1,", - "button.font.danger.outline.dark": "S:9d611a3ad95a4e7c417d38dcf707aa9dfd4b1da8,", - "button.font.danger.outline.light": "S:9cfd1204a77cb867927a91597db7211a001d3a04,", - "button.font.danger.solid.dark": "S:af37ecd8e0d2d65aadb14bd7f27474bbee270090,", - "button.font.danger.solid.light": "S:a74731efcc3b80aa28448ab0cc896555bb5946b8,", - "button.font.danger.transparent.dark": "S:957fbc6785acc68533d73f89c39099f0da9feaf9,", - "button.font.danger.transparent.light": "S:6399b4fb7079f55df8a107aa677eacad644890c9,", - "button.font.inverse.outline-fill.dark": "S:2ecfcc01e33580567c857f84b7d7880c9c41858e,", - "button.font.inverse.outline-fill.light": "S:946d988291e67a18d0114e09820ab2bbaad35053,", - "button.font.inverse.outline.dark": "S:a58a68dd030763cd3b979f3c9c8b53d55cb9904b,", - "button.font.inverse.outline.light": "S:625d9574b0882315179cfc86548ed6471b4d016a,", - "button.font.inverse.solid.dark": "S:85c8df8e3095d7b2e3e114ed3637c5b567be8e74,", - "button.font.inverse.solid.light": "S:e023d71593c86f4ce2c05402cd3d40fc88a24d8f,", - "button.font.inverse.transparent.dark": "S:c22b36e585444176b35d2985759be4ab13f7912f,", - "button.font.inverse.transparent.light": "S:57697b05e86e28fec3897f4cd70e8d71cd10ca9b,", - "button.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "button.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "button.font.neutral.outline-fill.dark": "S:cd76dcc766ec224f3e0563f17332c3e13f25903f,", - "button.font.neutral.outline-fill.light": "S:b92ab0d0e3a31703d61022c2ede0a5edea6114f5,", - "button.font.neutral.outline.dark": "S:c7418479a6a19078629d08ff0d250434dd7aa6d8,", - "button.font.neutral.outline.light": "S:8f1c1a86e08810a6cc0ce7394e4c8ddf6cf7cb4d,", - "button.font.neutral.solid.dark": "S:ab0615f4be9ee2817309ead97d443aadf7f272a2,", - "button.font.neutral.solid.light": "S:a0df0d493da446b8af65957433ff02c707e549ad,", - "button.font.neutral.transparent.dark": "S:1a2ab9b9fdc12ddf69da58e4784f878a6c75fc66,", - "button.font.neutral.transparent.light": "S:3d2e4e2536be873c087f6b6181332bf2ce825c42,", - "button.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "button.icon.brand.outline-fill.dark": "S:083dd5348633198897381a0fc0ba1224dce419d0,", - "button.icon.brand.outline-fill.light": "S:e713b7f99bff9042ca39f672fabc26a7305a886a,", - "button.icon.brand.outline.dark": "S:6a8c3b2e8887bf20eab6a4f1e3ae0ed577ec662b,", - "button.icon.brand.outline.light": "S:96930a17711f286e1a97b8b7ca57a1c37431a621,", - "button.icon.brand.solid.dark": "S:4e7221865a6c6c3bd38f20c5ef2a5a54d866d4e8,", - "button.icon.brand.solid.light": "S:9e6ac3dff1682871052485faa0369d63529bf5b1,", - "button.icon.brand.transparent.dark": "S:33667181ea79a9be22a25c217678cd18dd0018a4,", - "button.icon.brand.transparent.light": "S:e76ac2dd6b78f85c7892ae2f30e58e8325587168,", - "button.icon.danger.outline-fill.dark": "S:0d52275009dd4db5be4f0ab8e588c913ab512b49,", - "button.icon.danger.outline-fill.light": "S:ab4adf7e0da06544e523a77dfd7382f1ce4d0390,", - "button.icon.danger.outline.dark": "S:e76fe1930c8f4046e6b691e8bee286135c167bbc,", - "button.icon.danger.outline.light": "S:e8741315e65ba8b3a3a3dfbbb0fc675149171992,", - "button.icon.danger.solid.dark": "S:634aa3447ca9018eafa7cb64a09fc740574a7327,", - "button.icon.danger.solid.light": "S:554b1ff05e7638a78dade8ba02c2a6e3aa01a697,", - "button.icon.danger.transparent.dark": "S:8d62de7a5843dff0cce34c04ac0d780811c1de38,", - "button.icon.danger.transparent.light": "S:45534e3054c040a8419218ea56621ad13724ac0d,", - "button.icon.inverse.outline-fill.dark": "S:59c9c9e7e1e34467cb8b027c2ba1476dc2ef694d,", - "button.icon.inverse.outline-fill.light": "S:dba61c40f9ca399bb1993489375549f236b1615f,", - "button.icon.inverse.outline.dark": "S:9137cbda0b1d79a7a6daff11f72580e2a6fda301,", - "button.icon.inverse.outline.light": "S:80c8d7dcc226ba8c08f306b5c6729d81de95efb6,", - "button.icon.inverse.solid.dark": "S:68fd5cc58df6a5869e4990bcc1340d822cac6196,", - "button.icon.inverse.solid.light": "S:e2bc9bd86895330c7839da20e5fec7753ede75b1,", - "button.icon.inverse.transparent.dark": "S:8a8366de3e4b5f5ac023b2c703cc641c21a4453b,", - "button.icon.inverse.transparent.light": "S:1d9ed9e6c0eca660882d7c5705d97d7eb4455e72,", - "button.icon.neutral.outline-fill.dark": "S:7cd5f2e7d3b4064efe22c2a4afbee7a3f66513d1,", - "button.icon.neutral.outline-fill.light": "S:e811450c86cf9bbd8e96efad1b6950b0aea24a90,", - "button.icon.neutral.outline.dark": "S:1d09040ccbfbdc3f8f89047c3eaab5dc24b7463c,", - "button.icon.neutral.outline.light": "S:933927902689b45a97c31f92ab03e1dabfa62bdb,", - "button.icon.neutral.solid.dark": "S:24b1e95691f8479f2e9981237c73eff12274680a,", - "button.icon.neutral.solid.light": "S:ce7f077ff90a2013df5b1f72fef68b183ded1f2e,", - "button.icon.neutral.transparent.dark": "S:060673768cd2545a55330e2a6c2c67e82627bbf2,", - "button.icon.neutral.transparent.light": "S:b3eb473ce8edf72285c36f6fb42680395ef7d7c1,", - "card.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "card.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "card.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "card.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "card.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "card.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "card.font.description.dark": "S:82f969d559027f722de3d4c50d2fb72202a0fc39,", - "card.font.description.light": "S:756bd2c5199ccad18c6ae14ee52345f24153dfa4,", - "card.font.description.md": "S:2e204d97e7e530c52c455d00cd8e6354b2a81230,", - "card.font.subtile.md": "S:2f7bbe92776fd17b2ab450464cfe7115ff9e2625,", - "card.font.subtitle.dark": "S:6355016a1a58da665def5e759c512e087504e510,", - "card.font.subtitle.light": "S:003a1a7519374d0278e2d39a05ccdece9494156b,", - "card.font.title.dark": "S:a0ac87895a271a4c9bfda2ccc0254549ccbf2896,", - "card.font.title.light": "S:d274bba017fa590088dca04c9015131da09237de,", - "card.font.title.md": "S:bb08857b89d59fa3d1473495b191094ae721da80,", - "checkbox.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "checkbox.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "checkbox.background.selected.dark": "S:2395510a93b41923ce9358f2754a8fd8451f47d8,", - "checkbox.background.selected.light": "S:13d63ed31b4ad61a912dbd663332e89530a9ce64,", - "checkbox.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "checkbox.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "checkbox.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "checkbox.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "checkbox.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "checkbox.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "checkbox.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "checkbox.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "checkbox.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "chip.background.solid.blue.dark": "S:efe9257d7ff25660d4f56ecb5f8eff1965836ed8,", - "chip.background.solid.blue.light": "S:4be84169ac345a5fe20beb467ba90e098af63ca6,", - "chip.background.solid.green.dark": "S:c241f69fd7fd9d471ab2156f4a683079ed39fc14,", - "chip.background.solid.green.light": "S:5e399aedb6838ff8ea03512163d75a41ab6994c3,", - "chip.background.solid.grey.dark": "S:b46a140ddd397a1f3bc89a9097ea67ac2cdf5eb5,", - "chip.background.solid.grey.light": "S:b53697b7f83ed2a1cb8401a03ceedd9858bdfa44,", - "chip.background.solid.red.dark": "S:9d0bc5f00f8f6775b890b749c4ab92a0e2936f82,", - "chip.background.solid.red.light": "S:c27419c0893c8639b4e38f21d1009ea61dd87644,", - "chip.background.solid.yellow.dark": "S:c0854e1751ab501aa79abffc7573b649a040fa87,", - "chip.background.solid.yellow.light": "S:2962dae5faa2ebdfdb41a236eb4fe2d6728e73c2,", - "chip.border.clear.blue.dark": "S:a4e5c73ecd06a6d15e1c0c5e06d0db710d159e40,", - "chip.border.clear.blue.light": "S:04657641675b69f642cbd457001d849c986bb902,", - "chip.border.clear.green.dark": "S:0f59e37a995fa88e6d805a2f6acdeb6c5b6b0d91,", - "chip.border.clear.green.light": "S:857bba35f26bbd88a44c03fc89fe80ebef65bb31,", - "chip.border.clear.grey.dark": "S:da12f587cccfb923ff5326f0820abd034885243c,", - "chip.border.clear.grey.light": "S:ba3709462c1adcc8247a4b551e49f82c3a5d52b5,", - "chip.border.clear.red.dark": "S:ca09bbb774ed71bab49b4768fda03cef7c127bec,", - "chip.border.clear.red.light": "S:df1e6343d454f39b6310ef4e88ed6067aea0f78d,", - "chip.border.clear.yellow.dark": "S:fd20cf70d56bd57879800426b23e0a1c40ef66ae,", - "chip.border.clear.yellow.light": "S:835f772647e8725e264c9de44c48f73b19b1dee1,", - "chip.closable-icon.dark": "S:571b293be9fa93c88d4c744e859ccaa9f0327396,", - "chip.closable-icon.light": "S:5864661006b1e772d3497a8fcda14e8c4c14ec59,", - "chip.font.clear.dark": "S:26f3b7443216233f279c7e7f7fd0131efcf2894a,", - "chip.font.clear.light": "S:3bceb92c16f9494f5df688ac26364dc9916d2f30,", - "chip.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "chip.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "chip.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "chip.font.solid.blue.dark": "S:ce2f48f7c48c85f1947ed4def67837b09682f392,", - "chip.font.solid.blue.light": "S:66e5eea50a4738310a610bf35defc79c2f68d268,", - "chip.font.solid.green.dark": "S:7d35770c490fbb1b9952d56ba8f64530b8ca2c20,", - "chip.font.solid.green.light": "S:3fba5d47fc5dc3890f9815e5588b1fae3955e2a4,", - "chip.font.solid.grey.dark": "S:bd62c223330d9bd183081da305c26e6d054b727f,", - "chip.font.solid.grey.light": "S:1c6e18ed37f0dd57da2b2fe7158f708f32ff10b9,", - "chip.font.solid.red.dark": "S:bfdc2378122e67bb9ca7c20e4616c910684ce386,", - "chip.font.solid.red.light": "S:4dd45363a1a8a7f69731c3087cd75501c569a9df,", - "chip.font.solid.yellow.dark": "S:bcf8ce210a5dcce132c602eb4aadaa7c49421f70,", - "chip.font.solid.yellow.light": "S:4a1dd23a0f565029e15822cc6b8b56957b4383d4,", - "chip.icon.clear.dark": "S:b9d89075c8ede720ed163c7db3ad8ae99f55a7a3,", - "chip.icon.clear.light": "S:a2d113d47d21d5652fbf97ba3c080ef75b8b86b5,", - "chip.icon.solid.blue.dark": "S:e96f458a9e09ce6fdfefc393072ce28766601907,", - "chip.icon.solid.blue.light": "S:3bedd59076e486afe8128a69e505c734b3934bc1,", - "chip.icon.solid.green.dark": "S:dbfbdd28233f829f94b29b3f609d62ecec873072,", - "chip.icon.solid.green.light": "S:20c657522b2e549263180c408042654c597852f2,", - "chip.icon.solid.grey.dark": "S:fe6895416c0213445a74a77a2da5191ee06266c2,", - "chip.icon.solid.grey.light": "S:b11bef71ea8faa8e4e469ce9080f40b4cabc2017,", - "chip.icon.solid.red.dark": "S:28265c9ca8729ceb5805b7842663c1162f073b12,", - "chip.icon.solid.red.light": "S:84c2a93cc8de0a128f5da1131cc1cc7a2b0f5686,", - "chip.icon.solid.yellow.dark": "S:0dcdf78002ec8d6c2d2d9f1526c769ac2e64ed62,", - "chip.icon.solid.yellow.light": "S:d3d415877af4342dfa5b2a522b995005f46a036f,", - "color-picker.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "color-picker.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "color-picker.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "color-picker.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "color-picker.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "color-picker.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "color-picker.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "color-picker.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "combobox.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "combobox.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "combobox.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "combobox.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "combobox.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "combobox.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "combobox.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "combobox.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "combobox.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "combobox.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "combobox.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "combobox.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "combobox.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "core.box-shadow.0": "S:b15553f1884f62f3316a48a6e38b8c0e8f8e72d2,", - "core.box-shadow.1": "S:bf2ed3904ec79304842edb9a26b9f7493058ad06,", - "core.box-shadow.2": "S:405e9e5847d05b187655689838208704356b6e1b,", - "core.box-shadow.none": "S:bce4a69329ebfff685ce2a044bcfb3d09a8ad7ec,", - "core.color.neutral.blk-000": "S:a67e6b964c87a95c90d2051109e6235f971cfed6,", - "core.color.neutral.blk-005": "S:e007de0e5126b5656ab20a44ef5542ec38d3b1b7,", - "core.color.neutral.blk-010": "S:379de77e676e45964aa0d9fa8830a22c2ddb9cef,", - "core.color.neutral.blk-020": "S:9fc3b3acbeda4ebd6eaa9694a799615de38c8f53,", - "core.color.neutral.blk-030": "S:6e7010ebd7da11ef0c8677c7b3e138d0d6b6666b,", - "core.color.neutral.blk-040": "S:2c369ccc2bd9dbf119b1a447eb6f638012b7c193,", - "core.color.neutral.blk-050": "S:e71ce79ebfa1e5e47b70284bde8298e0f428d0af,", - "core.color.neutral.blk-060": "S:c48ae66b1205086fbe209ba6e1ec0ef224315646,", - "core.color.neutral.blk-070": "S:568e210e3abc4bac9c59fd6da505eca60c2906eb,", - "core.color.neutral.blk-080": "S:c2923315fc6b3128caec7736fdfda9db5bb2dc55,", - "core.color.neutral.blk-090": "S:6e336f0e932fe1694dbf4eedd383b3d287406fbb,", - "core.color.neutral.blk-100": "S:b8cb9ddaa17b8e52cc8baa461fdb88c5070770e8,", - "core.color.neutral.blk-110": "S:dfdbe4ae031086d3977fbfc3c6690eebbb539915,", - "core.color.neutral.blk-120": "S:d02ee52cc6cbb1f64e4d644a46775b5a09c681bc,", - "core.color.neutral.blk-130": "S:4bbb7914654196933c1da872015c7993e1fcfccc,", - "core.color.neutral.blk-140": "S:7ca7950c73120089cd71e7c82d252be795b3b62e,", - "core.color.neutral.blk-150": "S:3c918f8d749ef073ead2218c7efefbf14ba6dffb,", - "core.color.neutral.blk-160": "S:f792b9890c36f6ac70f1c1ee1c3a498ef9161808,", - "core.color.neutral.blk-170": "S:411d4fc1eac1ec98b04758e6aa28d5971a769297,", - "core.color.neutral.blk-180": "S:de8af9b59e8116339ed199ec765893f2bf77bdc3,", - "core.color.neutral.blk-190": "S:3689986e44266e08bee9f4ac1f89a65af7d277d9,", - "core.color.neutral.blk-200": "S:dfc3a1482e86e0d79479102515ae1640cfda7660,", - "core.color.neutral.blk-210": "S:4b85d05798bcf10f05e1001665a163eedad46a25,", - "core.color.neutral.blk-220": "S:d38ce197c2a81d738c3aa36fb428a48cf869e172,", - "core.color.neutral.blk-230": "S:bd064ee87818ec8a5e4600cc049237ef96898eaa,", - "core.color.neutral.blk-235": "S:9c64ecf6085cefb0f09181a4f78a9dc3276a43f6,", - "core.color.neutral.blk-240": "S:566e201f296c4048cfdee8da4654fa663916fb97,", - "core.color.palette.dark.blue.d-bb-410": "S:098d21075614d6c47f49f3c326099ab1b5934010,", - "core.color.palette.dark.blue.d-bb-420": "S:08f1dadd6b907fa2e4c5022c4dfba0973b892372,", - "core.color.palette.dark.blue.d-bb-430": "S:90e82be07ee6af71f6fb71a8bc1c964f18a2d396,", - "core.color.palette.dark.green.d-gg-410": "S:696963c67cccb3184f70df720c18499ba54372cc,", - "core.color.palette.dark.green.d-gg-420": "S:1d8b212500ead45da840547917f11b1750d24330,", - "core.color.palette.dark.green.d-gg-430": "S:6e32f21df7c3e9cccb516f157cbd0c73cfe090bd,", - "core.color.palette.dark.red.d-rr-410": "S:d1efd5a9b420f32748921b6ec6d718b6e1af465a,", - "core.color.palette.dark.red.d-rr-420": "S:e97c4e83c642e168f0bf9870c3caa3966dd9831e,", - "core.color.palette.dark.red.d-rr-430": "S:515edae396cbd56599053c86abb3d1b0eeda8070,", - "core.color.palette.dark.yellow.d-yy-410": "S:4906ceee1669c1ba45f248d40c9402fa223bc15e,", - "core.color.palette.dark.yellow.d-yy-420": "S:23b7ad4f5dc84a74b4025093726a20bdbd487a85,", - "core.color.palette.dark.yellow.d-yy-430": "S:3a9e706df7bfee778d832ebc36bb0bc67a9bc6e6,", - "core.color.palette.high-saturation.blue.h-bb-010": "S:a30ba21a5a769859a1a365443ec1a7ae1c0dbc4b,", - "core.color.palette.high-saturation.blue.h-bb-020": "S:f16fe042a5395dde509e4df0f4c400a080226b2b,", - "core.color.palette.high-saturation.blue.h-bb-030": "S:e3038d72f66ffc3f0b34a95b3489a19e0de9b294,", - "core.color.palette.high-saturation.blue.h-bb-040": "S:615c572713be17f77d4c24bf0643f1a29296240e,", - "core.color.palette.high-saturation.blue.h-bb-050": "S:381bfaa859daf1e49bb01f6a3c2e2ff6ae345f87,", - "core.color.palette.high-saturation.blue.h-bb-060": "S:29331b79a5d4ac10298a460dfba3786bdd9f5254,", - "core.color.palette.high-saturation.blue.h-bb-070": "S:2b5067dd954b317dc7703d6972506b7212b63311,", - "core.color.palette.high-saturation.blue.h-bb-080": "S:a4e84e53aafa35d7114425188e4bc2fa8ca8016d,", - "core.color.palette.high-saturation.blue.h-bb-090": "S:3646636061731a38d31d34ae2ba82e7226630c0b,", - "core.color.palette.high-saturation.blue.h-bb-100": "S:b137c82c753cee8690ad1bf580378f945e59413e,", - "core.color.palette.high-saturation.green-blue.h-gb-010": "S:86acdd47f813a3b6840e5be60646304724e8e694,", - "core.color.palette.high-saturation.green-blue.h-gb-020": "S:6a141dd9a788a88b35b66538cfce91fbefbd359b,", - "core.color.palette.high-saturation.green-blue.h-gb-030": "S:21271ba54272055068ddcc604f3ac1316c7a755c,", - "core.color.palette.high-saturation.green-blue.h-gb-040": "S:e036ed954eecd1cf1060b9e347f07257db1ac99c,", - "core.color.palette.high-saturation.green-blue.h-gb-050": "S:bbbd7b4a5478ce9d9a4f47979e3f2e6c3fbfa657,", - "core.color.palette.high-saturation.green-blue.h-gb-060": "S:7a22a2f99c80ae2bb0019677140ce920343271a9,", - "core.color.palette.high-saturation.green-blue.h-gb-070": "S:76a07fa6afbb24ffaebe9848da2d56584bca1139,", - "core.color.palette.high-saturation.green-blue.h-gb-080": "S:cfebc84ef66573b8762db2e67afa4e8707853f53,", - "core.color.palette.high-saturation.green-blue.h-gb-090": "S:f9cd0722f121b1e14620c509c50d8cc8a035af0d,", - "core.color.palette.high-saturation.green-blue.h-gb-100": "S:2b1ec16718e0780eb78c84fbc8a863132534b2db,", - "core.color.palette.high-saturation.green.h-gg-010": "S:430c8695a2cbf32dc936ec92d352440f6b8baa83,", - "core.color.palette.high-saturation.green.h-gg-020": "S:bcdae4d9ef10acd863a18e695fe4bbd8c42b124d,", - "core.color.palette.high-saturation.green.h-gg-030": "S:fa64724d0f31c0a4fd76055afff3965be2202599,", - "core.color.palette.high-saturation.green.h-gg-040": "S:5abb8c81a3309fb62ac92b87e3ce880df36f4050,", - "core.color.palette.high-saturation.green.h-gg-050": "S:bfcb47dc8a77c4cae92c5cfdaea6e6871c309405,", - "core.color.palette.high-saturation.green.h-gg-060": "S:d2e08acc23f2d375003d815977b639a57ae3c5d7,", - "core.color.palette.high-saturation.green.h-gg-070": "S:4a4ca908024da34195ae5e1f53dfca68ad8bfc16,", - "core.color.palette.high-saturation.green.h-gg-080": "S:9b853997dedc3bcbd9414437bd09ddac84b21322,", - "core.color.palette.high-saturation.green.h-gg-090": "S:96ff382489dfbf8f473d91b02e14164d3f18cb04,", - "core.color.palette.high-saturation.green.h-gg-100": "S:aefb6e4a31ab9d60b6ab5b724409c2e5bce732c0,", - "core.color.palette.high-saturation.orange-yellow.h-oy-010": "S:d6886cfda04ce1879187dace6439eca99196bd25,", - "core.color.palette.high-saturation.orange-yellow.h-oy-020": "S:36febea423bf21b8ffade26dfbdff1d1d86b16be,", - "core.color.palette.high-saturation.orange-yellow.h-oy-030": "S:c3584d602a0f67a3648d67ddaa13444d4334c301,", - "core.color.palette.high-saturation.orange-yellow.h-oy-040": "S:ab7f0583694d290842d460dd1393c8e3903dd257,", - "core.color.palette.high-saturation.orange-yellow.h-oy-050": "S:05fd025c8c0381fcf82d5e21e9fde71f5867bc48,", - "core.color.palette.high-saturation.orange-yellow.h-oy-060": "S:e451d7ee43ff8164e124b5a13004188b668c068e,", - "core.color.palette.high-saturation.orange-yellow.h-oy-070": "S:fdb4b6f58a600d604560d871399b3bf5c02a37a8,", - "core.color.palette.high-saturation.orange-yellow.h-oy-080": "S:82c5ecfe97d81153b8cf0df3bbdf4946e0941844,", - "core.color.palette.high-saturation.orange-yellow.h-oy-090": "S:6a0862425705cdce19f742977f3555b7b4e20b88,", - "core.color.palette.high-saturation.orange-yellow.h-oy-100": "S:23a580aae4798bcff45cff8bf23a29e5cbb587cd,", - "core.color.palette.high-saturation.orange.h-oo-010": "S:9dd0ce8fa68b2f403cd935dcb85865bdaf3c7c40,", - "core.color.palette.high-saturation.orange.h-oo-020": "S:f8335f88872810e2e490e4b60f82b916c4fabdb5,", - "core.color.palette.high-saturation.orange.h-oo-030": "S:30b22a97e608f144d24de0a31361b51ce0326e8c,", - "core.color.palette.high-saturation.orange.h-oo-040": "S:819bee7a96e0cbc320a63f1e202847e617cafa0f,", - "core.color.palette.high-saturation.orange.h-oo-050": "S:f565589dd9c7ecbe21fd6b16af88fec443a80757,", - "core.color.palette.high-saturation.orange.h-oo-060": "S:fc495462d9c23608df5d3a2f33dd6ca7c1e54ea6,", - "core.color.palette.high-saturation.orange.h-oo-070": "S:2821799e9639eccd07992e27c4e6694ae02bf6d0,", - "core.color.palette.high-saturation.orange.h-oo-080": "S:728bb41c33fd83583676baf7033dca60bdd741d6,", - "core.color.palette.high-saturation.orange.h-oo-090": "S:31b0367b23ffd087b0fd223313d735f05c36f7a6,", - "core.color.palette.high-saturation.orange.h-oo-100": "S:9997f139bbc6b8d1cf2c9ff289ff2311bfcc8c0f,", - "core.color.palette.high-saturation.pink.h-pk-010": "S:c027bd4128a5857b7cbedba5209e6c3aabc3de7a,", - "core.color.palette.high-saturation.pink.h-pk-020": "S:87bf40f484e94e4021da62d8b092c37d7edab62b,", - "core.color.palette.high-saturation.pink.h-pk-030": "S:91afaaa48482a5e2b7172933e8564fdba0469a12,", - "core.color.palette.high-saturation.pink.h-pk-040": "S:802fed85b89883a05fd3ea3174504d923a99ff29,", - "core.color.palette.high-saturation.pink.h-pk-050": "S:476e1afaadd97e03ec2eda43c296ba05d2a616f8,", - "core.color.palette.high-saturation.pink.h-pk-060": "S:eb4f19e47f82b5bdcb4455d330e63eb9f8ef1e06,", - "core.color.palette.high-saturation.pink.h-pk-070": "S:1cf5b4431ac55c0284ece0b3506136ca63e128cc,", - "core.color.palette.high-saturation.pink.h-pk-080": "S:b680dba4a6e7a534893958e1a09b45da536164f5,", - "core.color.palette.high-saturation.pink.h-pk-090": "S:9211d5dd09ee4a12c6f559870ecb4ca3273e7d38,", - "core.color.palette.high-saturation.pink.h-pk-100": "S:fea2af5d6af09bf9ca344cc8a8b59720ff57e043,", - "core.color.palette.high-saturation.red-orange.h-ro-010": "S:01ff093ba2e7b3dc3221f560f2448f25f34208ab,", - "core.color.palette.high-saturation.red-orange.h-ro-020": "S:723100344827d512b6a2cdd6c7fcae745c7aebd5,", - "core.color.palette.high-saturation.red-orange.h-ro-030": "S:7dffa36a03dbc41ebb16e38f018cb82a2094c275,", - "core.color.palette.high-saturation.red-orange.h-ro-040": "S:5e070803b21a2c5647a6e9fa17671aaae548d6d2,", - "core.color.palette.high-saturation.red-orange.h-ro-050": "S:5f3ba5da8df574574b3fd2b1ab6d2ebdc4c5fb19,", - "core.color.palette.high-saturation.red-orange.h-ro-060": "S:4a71ecd5bf9ed15033f518e68bcfab66d7fb960a,", - "core.color.palette.high-saturation.red-orange.h-ro-070": "S:6d7d6dc19cdd30aaabf0c11637edad931b5feb3e,", - "core.color.palette.high-saturation.red-orange.h-ro-080": "S:4d5899b3aa7be56bf41d2dbfa3b95e825c8e0114,", - "core.color.palette.high-saturation.red-orange.h-ro-090": "S:d3593a25f6453c441e3c2e3d517f7980f3428c60,", - "core.color.palette.high-saturation.red-orange.h-ro-100": "S:91a05bf108f4f03541653f686a2078fd2a5672ed,", - "core.color.palette.high-saturation.red.h-rr-010": "S:72bf4c6626a6aadaa819d25c4081562f06fa12a2,", - "core.color.palette.high-saturation.red.h-rr-020": "S:15ddbfa8e4581df9079cde86d7d0fdfe5eb34b1e,", - "core.color.palette.high-saturation.red.h-rr-030": "S:9e593aa8f214b38e98522453c863ba486475382e,", - "core.color.palette.high-saturation.red.h-rr-040": "S:cf51d25a58cb8bec4ef72b73d550c88ad41c41dc,", - "core.color.palette.high-saturation.red.h-rr-050": "S:0429df1a99a360307086093dca26f12feba95567,", - "core.color.palette.high-saturation.red.h-rr-060": "S:df92c84bbe47af0a506a11389ffa25980ddbf71d,", - "core.color.palette.high-saturation.red.h-rr-070": "S:3698204b2caa7d34f77be9ddba8fcc76321b2821,", - "core.color.palette.high-saturation.red.h-rr-080": "S:c77c87f684559adb69e175e12897529c3645ddf1,", - "core.color.palette.high-saturation.red.h-rr-090": "S:093ed2efb025d6d2f406dcdac508de589658437e,", - "core.color.palette.high-saturation.red.h-rr-100": "S:02824a1c296eabc6218cf6bb7daeb1dcde36fac4,", - "core.color.palette.high-saturation.violet-red.h-vr-010": "S:d9a5369ff6ac626201326882679bcd4663801de9,", - "core.color.palette.high-saturation.violet-red.h-vr-020": "S:e1f2e31077d7dc45b8543998d1b79fbd154cc441,", - "core.color.palette.high-saturation.violet-red.h-vr-030": "S:9e1a260e10913714d0d9bbcbdb6474da33d9ac49,", - "core.color.palette.high-saturation.violet-red.h-vr-040": "S:dbfa38e55babf7dda9961547f0eb16e67a8f0265,", - "core.color.palette.high-saturation.violet-red.h-vr-050": "S:32dae974bd24d671c83feb6465949a849294ab06,", - "core.color.palette.high-saturation.violet-red.h-vr-060": "S:afbb6f3f9dfece8273608c1f00c980150ba1c277,", - "core.color.palette.high-saturation.violet-red.h-vr-070": "S:8ed7669af254c3fe12310ab115f77b7227366a06,", - "core.color.palette.high-saturation.violet-red.h-vr-080": "S:f4451432a831473289c70f7e7282e6dbde9ccb0a,", - "core.color.palette.high-saturation.violet-red.h-vr-090": "S:7fd97dfa464285509bf40fc039af159d56f579bc,", - "core.color.palette.high-saturation.violet-red.h-vr-100": "S:90fd71cf8895dcb1cd034bd0580aa225950aca34,", - "core.color.palette.high-saturation.violet.h-vv-010": "S:a4fd8438ca3d2c0f65c436a971d30284c488fb58,", - "core.color.palette.high-saturation.violet.h-vv-020": "S:500d0566c62490d66a912c0def0642822ebbe276,", - "core.color.palette.high-saturation.violet.h-vv-030": "S:08f873b4f74a821fe521827382bed72817884c07,", - "core.color.palette.high-saturation.violet.h-vv-040": "S:8a4a73cdf4253aa6ad58d663e97a2999cfb0bd5b,", - "core.color.palette.high-saturation.violet.h-vv-050": "S:244f69540b20db975232e019cfe2e81e4fb82695,", - "core.color.palette.high-saturation.violet.h-vv-060": "S:b39c473f516e51267bca75819d192b6ea3f2f020,", - "core.color.palette.high-saturation.violet.h-vv-070": "S:c66eafbfef67edcfb9e898e636cd9ff49d29e20b,", - "core.color.palette.high-saturation.violet.h-vv-080": "S:3973dd0fe8d726ed4265989b0b8c8d206077a2d0,", - "core.color.palette.high-saturation.violet.h-vv-090": "S:1d48293e45fac39396eea9a16c52258d1b7447d5,", - "core.color.palette.high-saturation.violet.h-vv-100": "S:f2f832092ddc91fd4d4f417c4ca5c9d1fc1ba280,", - "core.color.palette.high-saturation.yellow-green.h-yg-010": "S:fb933c69a7eb66e3ace1dcc3018d8b72309b5494,", - "core.color.palette.high-saturation.yellow-green.h-yg-020": "S:d7441f89845f36a907304a2b8d134941df2faa55,", - "core.color.palette.high-saturation.yellow-green.h-yg-030": "S:99c2d767e05c9741f3a70061c3802f9a96ca7b92,", - "core.color.palette.high-saturation.yellow-green.h-yg-040": "S:5b721c955c1ad2f3350c4984f126debac5cfecce,", - "core.color.palette.high-saturation.yellow-green.h-yg-050": "S:c076b7e08ccc3cd2831039cd69140bf1ab1d718e,", - "core.color.palette.high-saturation.yellow-green.h-yg-060": "S:263daeecd3a70bbd9b3c1ef9050317d62809156d,", - "core.color.palette.high-saturation.yellow-green.h-yg-070": "S:d7b0744a407d03166754e72118d86c97eb5786dd,", - "core.color.palette.high-saturation.yellow-green.h-yg-080": "S:81bfa9f3dd5ac7b5f90cc6b7ba807fa5d3b7947e,", - "core.color.palette.high-saturation.yellow-green.h-yg-090": "S:1ad692e88dc7c0849892dd2f12fe1708e87fca1a,", - "core.color.palette.high-saturation.yellow-green.h-yg-100": "S:6f81213d26a0986b6c8b1807a4df5b0313a5609e,", - "core.color.palette.high-saturation.yellow.h-yy-010": "S:157f230fe60c3e396f37284470728605f8515c63,", - "core.color.palette.high-saturation.yellow.h-yy-020": "S:3a54f6277edbd4c92c83d72cf7eb8663f7b1867d,", - "core.color.palette.high-saturation.yellow.h-yy-030": "S:e3c57eefabd42b3d15e138b62ccf76f673d532c0,", - "core.color.palette.high-saturation.yellow.h-yy-040": "S:430d25da287d5fd16a8f398cb2fdf1e8a93e5db4,", - "core.color.palette.high-saturation.yellow.h-yy-050": "S:45c181165c8cf7dc9a75172b796f13ea5e6865e1,", - "core.color.palette.high-saturation.yellow.h-yy-060": "S:aaf6b1686716ba60e09e442bceace906c0c3c4bc,", - "core.color.palette.high-saturation.yellow.h-yy-070": "S:5490cdcefbff5b5e61fbb460e3210b71856ccd18,", - "core.color.palette.high-saturation.yellow.h-yy-080": "S:cb4adac94e31977c65f30ecdc3f162f47350a9a5,", - "core.color.palette.high-saturation.yellow.h-yy-090": "S:fe8696238f9f363040075ebad9eadcfdb5fc4070,", - "core.color.palette.high-saturation.yellow.h-yy-100": "S:a07d09607ed87f74630d11f30c9e403e6b682b30,", - "core.color.palette.vibrant.blue.v-bb-120": "S:1b912737566790521b736fc0cb5790e0d1758549,", - "core.color.palette.vibrant.blue.v-bb-140": "S:7d847def6e5074a8cdd43baf422978ac08d09741,", - "core.color.palette.vibrant.blue.v-bb-160": "S:ce4e4c4afaa37ac070a03dc8ea77b6e26f23f8a9,", - "core.color.palette.vibrant.blue.v-bb-180": "S:aeaa8f622e7673b47171d53cef6e5d305c52cdad,", - "core.color.palette.vibrant.green-blue.v-gb-120": "S:e545cc972786b8b866be0af383adac42b93490c0,", - "core.color.palette.vibrant.green-blue.v-gb-140": "S:24ef68b4113dd8865413e7b7fedbc975f73b1844,", - "core.color.palette.vibrant.green-blue.v-gb-160": "S:26257d454cefefa4b0e0392539b29967da80cd03,", - "core.color.palette.vibrant.green-blue.v-gb-180": "S:41faa42c025c8b0835b46833622ef8d566ac0ef8,", - "core.color.palette.vibrant.green.v-gg-120": "S:3c32e87b40218532cf223d4f25ddd8e585252178,", - "core.color.palette.vibrant.green.v-gg-140": "S:5c0a317d12ecd5afa4821a63bf48bfcff4b66908,", - "core.color.palette.vibrant.green.v-gg-160": "S:3c7e9cc671a86bcd48bba238963182d8fd5dec84,", - "core.color.palette.vibrant.green.v-gg-180": "S:d3e30b0e8fe8bb40a0bc3cdd3ac61c6d09603232,", - "core.color.palette.vibrant.orange-yellow.v-oy-120": "S:391020c0f092b5402febc0c2d0667d48de33d1ad,", - "core.color.palette.vibrant.orange-yellow.v-oy-140": "S:506b1d01e499bcba07730eb885aa9fef7b5c3cf3,", - "core.color.palette.vibrant.orange-yellow.v-oy-160": "S:f0b69b624b41a6645e8d23660b2a115d23d68d6c,", - "core.color.palette.vibrant.orange-yellow.v-oy-180": "S:beb78cc618755d86db5cca1545c79fce4931d70c,", - "core.color.palette.vibrant.pink.v-pk-120": "S:135ed546e2076187d3745c85a8da21a7e7c16d53,", - "core.color.palette.vibrant.pink.v-pk-140": "S:bad80534e3ba23d8230747873bc575b34a608067,", - "core.color.palette.vibrant.pink.v-pk-160": "S:a777eaeb101c5d8a3f518f06043d630a82ad4ef9,", - "core.color.palette.vibrant.pink.v-pk-180": "S:5ccaaf1a5b41cd71e837d43f9bd0f695691fe4c3,", - "core.color.palette.vibrant.red-orange.v-ro-120": "S:e2b928465273fe8d962655e71d78fb1f9f686490,", - "core.color.palette.vibrant.red-orange.v-ro-140": "S:980e62e80e8f3f9f09425a6d8b26b7302705716b,", - "core.color.palette.vibrant.red-orange.v-ro-160": "S:7403c860250af93694c42ca2464fdcd59d02ca28,", - "core.color.palette.vibrant.red-orange.v-ro-180": "S:e8e13ec2d4406a6683e5f91f9fa1cd664aaf28a1,", - "core.color.palette.vibrant.red.v-rr-120": "S:bcda3ca03b09b394fed9066f9c726fea24ddfe82,", - "core.color.palette.vibrant.red.v-rr-140": "S:b75af4155f1f5474e4032009d0d948a99184999a,", - "core.color.palette.vibrant.red.v-rr-160": "S:88cd4e4fc13847018e7936084c7314042cea5fdd,", - "core.color.palette.vibrant.red.v-rr-180": "S:74c93bbf5b2823acd54016fed51129bcd455703f,", - "core.color.palette.vibrant.violet-red.v-vr-120": "S:9155708e86a8fb667554b200f87c3fb462789caf,", - "core.color.palette.vibrant.violet-red.v-vr-140": "S:b4d6d11c17004435c313505d1c208a4b4258db38,", - "core.color.palette.vibrant.violet-red.v-vr-160": "S:c2609e360b146b6c6b7bc109099d50679f8e049b,", - "core.color.palette.vibrant.violet-red.v-vr-180": "S:5e1709c59c961c97c2d8876919128d145b9b2922,", - "core.color.palette.vibrant.violet.v-vv-120": "S:5962188393f63a4aacda8dbf97c8fee5d9d51624,", - "core.color.palette.vibrant.violet.v-vv-140": "S:12e4253328fc0297e55cd1dd6f47b5fb6921207d,", - "core.color.palette.vibrant.violet.v-vv-160": "S:8497c9ebd8d903caabcb33da8ef48c502beac564,", - "core.color.palette.vibrant.violet.v-vv-180": "S:94ceff7a97452d069c1c06d0b100d989a68b92f8,", - "core.color.palette.vibrant.yellow-green.v-yg-120": "S:4715ea79a577a93a3a6e99ce0142e742df6a5068,", - "core.color.palette.vibrant.yellow-green.v-yg-140": "S:101f1e34931f4dcd0fafe5fa2720fdc404e74885,", - "core.color.palette.vibrant.yellow-green.v-yg-160": "S:fe8e96fc343e65cd13c7741a9933cda392073117,", - "core.color.palette.vibrant.yellow-green.v-yg-180": "S:117baa81e4d628adcaea061e4c929c48a415edc8,", - "core.color.palette.vibrant.yellow.v-yy-120": "S:aa8ac761db055ea5816853564704bcc9063cec02,", - "core.color.palette.vibrant.yellow.v-yy-140": "S:22614e355bd4fb8c2b132207ec8dccb4e46e31f7,", - "core.color.palette.vibrant.yellow.v-yy-160": "S:3457eb204ca408d52ddbb80f84a111e911dea55d,", - "core.color.palette.vibrant.yellow.v-yy-180": "S:88d256ac4a6561ce88e2f7f256ad037d8ec3ff8b,", - "date-picker.background.date.active.dark": "S:00008689f4cd67914fac19beec1528a1ac41a4ea,", - "date-picker.background.date.active.light": "S:6796ec3ef28142c1660b3f7739c4c04ab1c75a04,", - "date-picker.background.date.range.dark": "S:ffc81c58606df60c717c94bfdad04a0c94909404,", - "date-picker.background.date.range.light": "S:d87a05addefd5d554795dd94b2acd577288521c2,", - "date-picker.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "date-picker.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "date-picker.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "date-picker.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "date-picker.date.active.border.dark": "S:1c7ebf7d8f4af02e7f83a46c3f52233e9ba35c31,", - "date-picker.date.active.border.light": "S:fd8fc2f890e9782d5c058c793be18797a5534932,", - "date-picker.font.active.date.dark": "S:c107a2ddcb3a1cbff0b2851c9a8ebfe8929f328d,", - "date-picker.font.active.date.light": "S:8fcb8da38c5f2fb6d0aa36167cc0f4ef2b160550,", - "date-picker.font.date.dark": "S:241f8779538cb4702201ed4066cd4340fa9f686f,", - "date-picker.font.date.lg": "S:7c6580521bcdbdfc7bb20f11d228412e30ed2745,", - "date-picker.font.date.light": "S:3671fe14f042965357c46b2615824a1c7efa70e4,", - "date-picker.font.date.md": "S:85386bc63729e94eb607ba5fb8b391b902092a3a,", - "date-picker.font.date.sm": "S:076aac1ce1f45e740d83d11ccf5c0372c63982fb,", - "date-picker.font.day.dark": "S:edf6e93f0880409de72951ab590e37223a5e7e22,", - "date-picker.font.day.lg": "S:7879c6c4aa4abbbf15e4970e729d60d5d5d9b0b6,", - "date-picker.font.day.light": "S:e1f8fe8a0d500900f3755214d6639efb6e5fafec,", - "date-picker.font.day.md": "S:bd28d711234c47f7a22638ab944067ca5fcb68d8,", - "date-picker.font.day.sm": "S:97c9f51cd9020c2183f12f022475331f59cf4afb,", - "date-picker.font.month.dark": "S:7a26a1b5050ac857298b1e427d93e512d4d57a65,", - "date-picker.font.month.lg": "S:5d9cea67d300b7cc734fe3340321199590d12bf9,", - "date-picker.font.month.light": "S:e7007a61645ae44b3abd80d52d8f984fc782206c,", - "date-picker.font.month.md": "S:115bcd0db12a861a644f053bf6dc97fa6ee0c4e4,", - "date-picker.font.month.sm": "S:d2815132a05319d69c3b303e10199eef70882454,", - "date-picker.font.range.date.dark": "S:2ceceff57cd77aa99ffc7d2f0b0517541f985766,", - "date-picker.font.range.date.light": "S:06a32d845847149d2cbeb96b36e43468f1a62789,", - "date-picker.font.selected.date.dark": "S:875fa73c614a95118c158cc6dc0ec80f074ccb0d,", - "date-picker.font.selected.date.light": "S:18248953f5c1f8ea47799a390f9956d4d622db11,", - "date-picker.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "date-picker.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "dropdown.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "dropdown.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "dropdown.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "dropdown.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "dropdown.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "dropdown.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "dropdown.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "dropdown.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "dropdown.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "dropdown.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "dropdown.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "dropdown.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "dropdown.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "fab.background.brand.dark": "S:f6e2deace9b6dd48b910a426a510fde31cc0db92,", - "fab.background.brand.light": "S:9ac99a92c95b9cfe1cdb3e34588b1f11efa19610,", - "fab.background.brand.outline-fill.dark": "S:8678a0fbc3f714e32748570133a83196b950ed2f,", - "fab.background.brand.outline-fill.light": "S:356e6d14763585871bd53c4cc2ec99d47b6b1bd1,", - "fab.background.brand.solid.dark": "S:c4f155329acd3fa825039e112cd4ea09fb3ea4a3,", - "fab.background.brand.solid.light": "S:dd9bb7dad71d92ee3c7cc2026d03ab89f2a9691b,", - "fab.background.danger.dark": "S:8e1ee57c6f283567fb11d0ff3fe8dd5a75e83e6b,", - "fab.background.danger.light": "S:00ac2274658d2870de79c6619dc3e4d72300f87e,", - "fab.background.danger.outline-fill.dark": "S:f51cf28d983ce6ce1fb55283c8f6b4128453aadd,", - "fab.background.danger.outline-fill.light": "S:8535b8d82c005d8f58aba23f89947bce3df1802a,", - "fab.background.danger.solid.dark": "S:e27adfeb093144a23d471200ac2cffce91ab700c,", - "fab.background.danger.solid.light": "S:13047564e6421aa299765a9d27307c185f65f175,", - "fab.background.inverse.dark": "S:1c77b198189e9321cb9bbd232609708563fee263,", - "fab.background.inverse.light": "S:bab00cecb69ae753c9250a25568cf8dfa0a577be,", - "fab.background.inverse.outline-fill.dark": "S:6a767312e3fd02e644b2c0ae16e3b21b7745d499,", - "fab.background.inverse.outline-fill.light": "S:df3c70fb6bfc73acd17ab2112b9274c4cbb507f1,", - "fab.background.inverse.solid.dark": "S:ab5f338c53c3aeffa576ca66a6bc96e6f829e8c3,", - "fab.background.inverse.solid.light": "S:ff4c2b0cfc2189392cf61c2a7b3a8c11cd22731a,", - "fab.background.neutral.dark": "S:c1b1717848f0b10f15e25cec75d82d8c78c38275,", - "fab.background.neutral.light": "S:71762a3ba06a95fcf1b11b376001d247582842f3,", - "fab.background.neutral.outline-fill.dark": "S:5e6ef27842035bb11d8d51a3ef3690aa65e061d7,", - "fab.background.neutral.outline-fill.light": "S:a5f704a03dc74e1d0850303d7c0f7ab3c61c1137,", - "fab.background.neutral.solid.dark": "S:5179f1ca6dd4eef2586d0fd1010dd65b5f144bdb,", - "fab.background.neutral.solid.light": "S:ac255c63a366d9fbb483dc43240b43953c87fdbd,", - "fab.border.brand.dark": "S:ff9ccecf20101a5ec706984a6aef21c387289e1a,", - "fab.border.brand.light": "S:0a487125d5f58c91b426b23486b6c0aadf59541a,", - "fab.border.brand.outline-fill.dark": "S:8cf9a289bd0941513d5c87b9f56f08dca0e706d5,", - "fab.border.brand.outline-fill.light": "S:62c0774ad6ce9511677ac96bc26b27aa20c0f764,", - "fab.border.brand.solid.dark": "S:c675794954c819b4aa0f731b8a492dda370f1b1b,", - "fab.border.brand.solid.light": "S:bd7ea9269499e13add0ce3b7c573f0d5cf43477f,", - "fab.border.danger.dark": "S:05ecd2230432bfac13daa1732bb3d4f9af41b10f,", - "fab.border.danger.light": "S:08b70e12351771cbe47f05f9411640bba734f4a4,", - "fab.border.danger.outline-fill.dark": "S:877a5834cefc4549d1e853b6cdb36fa19e4cd8df,", - "fab.border.danger.outline-fill.light": "S:98f004dc58d8984e13da424d8533268a6a76bfbe,", - "fab.border.danger.solid.dark": "S:4cdc01ddae3da56ebf6711769e5c59dcb5af076d,", - "fab.border.danger.solid.light": "S:6afa6160f17831b2c371f07eb2f529f79c75cb8b,", - "fab.border.inverse.dark": "S:7cabf2db07e740256356e1a258f47f93f4de70ad,", - "fab.border.inverse.light": "S:bbc6d04a67d5af3d498fd848feeffddcd2aebeb1,", - "fab.border.inverse.outline-fill.dark": "S:4884ebb6c0dee956a73b02ede0064c95fb82aa2e,", - "fab.border.inverse.outline-fill.light": "S:7bbc07ccb6c8f25e37398a0da56cc813e98fc1be,", - "fab.border.inverse.solid.dark": "S:79d49b3abca4ba1459da9ebafe07d1efd4b01763,", - "fab.border.inverse.solid.light": "S:573938363514bd57d61b7938a8c2337aa45af89b,", - "fab.border.neutral.dark": "S:1edf76a1774c4e32e9ae091278d4b44c1e500595,", - "fab.border.neutral.light": "S:e6886e133cdff23972c5e15246ee37582150a756,", - "fab.border.neutral.outline-fill.dark": "S:23b1a1778fd5e6e9781957e4482f70aa15e5882a,", - "fab.border.neutral.outline-fill.light": "S:497264411bb2a951c9800e7c97d3f075243ef249,", - "fab.border.neutral.solid.dark": "S:d042c2179e1697999fcc9c39b2442cd82470a8d3,", - "fab.border.neutral.solid.light": "S:c333cbb4c8def6f57023cdd369fe5af2c03316bc,", - "fab.font.brand.clear.dark": "S:76f49a66542c52b964e3ec9f9a7652e934e7a781,", - "fab.font.brand.clear.light": "S:1f3107c5a2f1daf1fcf03e492b2d6993789a3c3f,", - "fab.font.brand.outline-fill.dark": "S:bd21ca35dd933333ff1195ce9261c8e9b937dfb6,", - "fab.font.brand.outline-fill.light": "S:1ac84c8153029c94ad049b3b0a9234752e7be855,", - "fab.font.brand.outline.dark": "S:1e8852afd9ea094755d09382eded30d2e2bbe130,", - "fab.font.brand.outline.light": "S:f0adeadd0e0e0f4a1f3fee86558666b817037268,", - "fab.font.brand.solid.dark": "S:a7d2d81dd38360910fafa4f7d85e7f9ccff2854e,", - "fab.font.brand.solid.light": "S:cc4ae5ba632fc1f1f626de4003c05f1475c97d27,", - "fab.font.brand.transparent.dark": "S:d4356a1762c850343f02a3c9777f23ebfa4d41f3,", - "fab.font.brand.transparent.light": "S:06df2efafe1c1cafe563f76e771347a69d04a7a1,", - "fab.font.danger.clear.dark": "S:eda93904fa4476dfa692f041d1ae43558bb8cf8f,", - "fab.font.danger.clear.light": "S:432cc47f645578d52058b0a32e71dcceb2c27550,", - "fab.font.danger.outline-fill.dark": "S:291f34d6da9c98d93b53e6faf6903ba6254d6ead,", - "fab.font.danger.outline-fill.light": "S:d1bb8ed5b65f5526859bba88478a173fb9b929a1,", - "fab.font.danger.outline.dark": "S:c24691323d8d5644e4f839a94279632eef9e3d27,", - "fab.font.danger.outline.light": "S:8741a29d39368c4806c94ee4e10696e7d2d7b52f,", - "fab.font.danger.solid.dark": "S:af37ecd8e0d2d65aadb14bd7f27474bbee270090,", - "fab.font.danger.solid.light": "S:a74731efcc3b80aa28448ab0cc896555bb5946b8,", - "fab.font.danger.transparent.dark": "S:5a1cb81061b8ad3b5d15bdadafaa96bd269f5be5,", - "fab.font.danger.transparent.light": "S:ae81a8c9ff5a24316bcbd766c7aa4069a960d5f6,", - "fab.font.inverse.clear.dark": "S:6b6b568e5b20a35af73db4ea211ed735480fde1a,", - "fab.font.inverse.clear.light": "S:4e0126885705a695441471685e9c6fe53df73560,", - "fab.font.inverse.outline-fill.dark": "S:2ecfcc01e33580567c857f84b7d7880c9c41858e,", - "fab.font.inverse.outline-fill.light": "S:946d988291e67a18d0114e09820ab2bbaad35053,", - "fab.font.inverse.outline.dark": "S:bd96e308b8742f172fd160a9f16cee7139edef42,", - "fab.font.inverse.outline.light": "S:043470cf705695bc573e8be8d0f1ca5cd43f235c,", - "fab.font.inverse.solid.dark": "S:85c8df8e3095d7b2e3e114ed3637c5b567be8e74,", - "fab.font.inverse.solid.light": "S:e023d71593c86f4ce2c05402cd3d40fc88a24d8f,", - "fab.font.inverse.transparent.dark": "S:fcff24f62b0f0ba8c776732e6f5470fb0a1dbf69,", - "fab.font.inverse.transparent.light": "S:bb5130f5070b15d7cb2aa427df1f2daf170c9ef4,", - "fab.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "fab.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "fab.font.neutral.clear.dark": "S:55cccdc027e56fef0edd16c7ac5aa7eb2013db7e,", - "fab.font.neutral.clear.light": "S:1e82fef827484f0bf26f77727d1b1613b4c3aba4,", - "fab.font.neutral.outline-fill.dark": "S:cd76dcc766ec224f3e0563f17332c3e13f25903f,", - "fab.font.neutral.outline-fill.light": "S:b92ab0d0e3a31703d61022c2ede0a5edea6114f5,", - "fab.font.neutral.outline.dark": "S:c5d513baa7dd50fa7187946b6439f13a0c20b1ab,", - "fab.font.neutral.outline.light": "S:4e2bfb0fb3cf8178c5f92b14ed9e07a9c081b8d1,", - "fab.font.neutral.solid.dark": "S:ab0615f4be9ee2817309ead97d443aadf7f272a2,", - "fab.font.neutral.solid.light": "S:a0df0d493da446b8af65957433ff02c707e549ad,", - "fab.font.neutral.transparent.dark": "S:a8c25d727dd4b2107098c344a191fda0f0d5cacc,", - "fab.font.neutral.transparent.light": "S:65f4164ddf1746ca302a6893fa48b90d95fabf26,", - "fab.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "fab.icon.brand.clear.dark": "S:0209e34abf08a3748f1c017de6ca04407d1f24ec,", - "fab.icon.brand.clear.light": "S:7b41c424d6d43439158e852afca3ecc4879c68c3,", - "fab.icon.brand.outline-fill.dark": "S:083dd5348633198897381a0fc0ba1224dce419d0,", - "fab.icon.brand.outline-fill.light": "S:e713b7f99bff9042ca39f672fabc26a7305a886a,", - "fab.icon.brand.outline.dark": "S:943336f4351cd0578403d1ac7a4d2eb049e58038,", - "fab.icon.brand.outline.light": "S:9725df33208dd26ef970c6ec407e9549ae3e27b5,", - "fab.icon.brand.solid.dark": "S:4e7221865a6c6c3bd38f20c5ef2a5a54d866d4e8,", - "fab.icon.brand.solid.light": "S:9e6ac3dff1682871052485faa0369d63529bf5b1,", - "fab.icon.brand.transparent.dark": "S:f6962099346882882e98104ff08ebe0ba1374f08,", - "fab.icon.brand.transparent.light": "S:0d69f2196d70b057296fb229c7d31607298fdfd0,", - "fab.icon.danger.clear.dark": "S:83f59a42749045bc176c76eff33bae3d78d57760,", - "fab.icon.danger.clear.light": "S:c24a2b5bfa9655777cc888f9706e28ff9b424ac6,", - "fab.icon.danger.outline-fill.dark": "S:0d52275009dd4db5be4f0ab8e588c913ab512b49,", - "fab.icon.danger.outline-fill.light": "S:ab4adf7e0da06544e523a77dfd7382f1ce4d0390,", - "fab.icon.danger.outline.dark": "S:e76fe1930c8f4046e6b691e8bee286135c167bbc,", - "fab.icon.danger.outline.light": "S:e8741315e65ba8b3a3a3dfbbb0fc675149171992,", - "fab.icon.danger.solid.dark": "S:634aa3447ca9018eafa7cb64a09fc740574a7327,", - "fab.icon.danger.solid.light": "S:554b1ff05e7638a78dade8ba02c2a6e3aa01a697,", - "fab.icon.danger.transparent.dark": "S:8d62de7a5843dff0cce34c04ac0d780811c1de38,", - "fab.icon.danger.transparent.light": "S:45534e3054c040a8419218ea56621ad13724ac0d,", - "fab.icon.inverse.clear.dark": "S:8f4d3756bcfa4276a98d6b5a61e8d3f97a12eeca,", - "fab.icon.inverse.clear.light": "S:91c1f1ef69bd21f34f9c72b24233b868e5ffa432,", - "fab.icon.inverse.outline-fill.dark": "S:59c9c9e7e1e34467cb8b027c2ba1476dc2ef694d,", - "fab.icon.inverse.outline-fill.light": "S:dba61c40f9ca399bb1993489375549f236b1615f,", - "fab.icon.inverse.outline.dark": "S:6b26325108a1a6da51a0c561034d54eb68f02e6f,", - "fab.icon.inverse.outline.light": "S:21803c6456f48209cbde4a98b58f1d2f69bdae6c,", - "fab.icon.inverse.solid.dark": "S:68fd5cc58df6a5869e4990bcc1340d822cac6196,", - "fab.icon.inverse.solid.light": "S:e2bc9bd86895330c7839da20e5fec7753ede75b1,", - "fab.icon.inverse.transparent.dark": "S:02b13cc89af23516f4ee3f12ab93fb3121ae984d,", - "fab.icon.inverse.transparent.light": "S:1293e84a59bcf4653f65d196ad8f646cc22120c4,", - "fab.icon.neutral.clear.dark": "S:f4965e149db9d7921bcb72c1962d64e7d6c83350,", - "fab.icon.neutral.clear.light": "S:181c0465edf07b98f6cf4324052bbdef3266f9b8,", - "fab.icon.neutral.outline-fill.dark": "S:7cd5f2e7d3b4064efe22c2a4afbee7a3f66513d1,", - "fab.icon.neutral.outline-fill.light": "S:e811450c86cf9bbd8e96efad1b6950b0aea24a90,", - "fab.icon.neutral.outline.dark": "S:9eb2b2d7d7e57478b5b0d705029a38f2a99814dd,", - "fab.icon.neutral.outline.light": "S:d08cebd573da8fefff690d3fe3e89f6d22ace3ff,", - "fab.icon.neutral.solid.dark": "S:24b1e95691f8479f2e9981237c73eff12274680a,", - "fab.icon.neutral.solid.light": "S:ce7f077ff90a2013df5b1f72fef68b183ded1f2e,", - "fab.icon.neutral.transparent.dark": "S:350afeb494cb53e50dd315e8dcc0328877d7932e,", - "fab.icon.neutral.transparent.light": "S:a9ee00a0ff35a5f8588c4b53addbae5de8575b62,", - "filter.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "filter.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "filter.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "filter.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "filter.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "filter.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "filter.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "filter.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "filter.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "filter.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "filter.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-date-picker.background.arrow.dark": "S:d0eb9c0117c69137d5ce76e05b7ac929335e7bc9,", - "input-date-picker.background.arrow.light": "S:1c8e76ed08d85a1f5f4b21e363c5bf31b5f41910,", - "input-date-picker.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-date-picker.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-date-picker.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-date-picker.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-date-picker.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "input-date-picker.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "input-date-picker.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-date-picker.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-date-picker.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-date-picker.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-date-picker.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-date-picker.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-date-picker.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-date-picker.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-date-picker.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-date-picker.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-date-picker.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-date-picker.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-date-picker.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-date-picker.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-date-picker.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-datetime-local.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-datetime-local.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-datetime-local.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-datetime-local.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-datetime-local.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-datetime-local.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-datetime-local.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-datetime-local.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-datetime-local.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-datetime-local.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-datetime-local.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-datetime-local.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-datetime-local.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-datetime-local.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-datetime-local.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-datetime-local.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-datetime-local.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-datetime-local.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-datetime-local.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-datetime-local.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-datetime-local.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-datetime-local.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-datetime-local.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-datetime-local.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-datetime-local.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-datetime-local.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-datetime-local.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-email.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-email.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-email.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-email.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-email.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-email.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-email.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-email.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-email.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-email.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-email.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-email.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-email.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-email.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-email.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-email.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-email.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-email.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-email.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-email.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-email.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-email.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-email.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-email.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-email.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-email.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-email.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-email.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-email.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-email.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-file.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-file.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-file.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-file.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-file.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-file.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-file.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-file.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-file.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-file.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-file.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-file.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-file.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-file.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-file.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-file.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-file.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-file.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-file.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-file.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-file.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-file.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-file.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-file.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-file.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-file.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-file.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-file.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-file.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-file.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-message.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "input-message.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "input-message.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "input-message.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "input-message.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "input-message.icon.idle.dark": "S:37f89d2bdd848ec033c26905f5cf5dcd8fd5c642,", - "input-message.icon.idle.light": "S:f02d0fb7bba5b12f80f94cba50e49649f3d2ddd8,", - "input-message.icon.invalid.dark": "S:0f281ff3e987e7f74de0148d27a4e95c2a79b096,", - "input-message.icon.invalid.light": "S:82bdf7ab1c1e59e540a14b82f13e36170a401d00,", - "input-message.icon.valid.dark": "S:e723fefacb42d17262ce1549ae853cfe60f546ac,", - "input-message.icon.valid.light": "S:32d6ffe05ebc11b5c0e9c41a089941b6f827ee64,", - "input-month.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-month.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-month.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-month.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-month.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-month.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-month.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-month.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-month.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-month.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-month.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-month.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-month.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-month.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-month.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-month.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-month.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-month.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-month.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-month.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-month.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-month.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-month.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-month.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-month.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-month.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-month.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-month.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-month.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-month.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-number.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-number.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-number.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-number.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-number.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-number.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-number.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-number.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-number.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-number.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-number.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-number.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-number.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-number.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-number.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-number.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-number.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-number.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-number.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-number.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-number.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-number.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-number.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-number.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-number.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-number.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-number.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-number.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-number.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-number.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-password.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-password.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-password.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-password.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-password.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-password.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-password.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-password.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-password.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-password.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-password.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-password.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-password.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-password.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-password.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-password.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-password.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-password.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-password.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-password.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-password.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-password.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-password.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-password.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-password.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-password.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-password.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-password.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-password.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-password.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-search.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-search.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-search.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-search.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-search.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-search.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-search.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-search.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-search.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-search.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-search.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-search.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-search.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-search.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-search.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-search.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-search.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-search.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-search.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-search.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-search.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-search.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-search.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-search.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-search.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-search.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-search.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-search.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-search.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-search.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-telephone.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-telephone.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-telephone.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-telephone.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-telephone.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-telephone.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-telephone.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-telephone.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-telephone.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-telephone.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-telephone.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-telephone.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-telephone.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-telephone.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-telephone.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-telephone.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-telephone.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-telephone.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-telephone.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-telephone.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-telephone.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-telephone.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-telephone.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-telephone.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-telephone.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-telephone.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-telephone.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-telephone.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-telephone.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-telephone.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-text.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-text.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-text.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-text.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-text.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-text.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-text.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-text.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-text.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-text.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-text.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-text.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-text.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-text.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-text.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-text.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-text.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-text.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-text.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-text.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-text.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-text.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-text.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-text.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-text.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-text.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-text.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-text.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-text.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-text.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "input-week.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "input-week.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "input-week.background.prefix-suffix.dark": "S:e5099fb9e0fd98d685462aa5da6bf698da1c020d,", - "input-week.background.prefix-suffix.light": "S:b030575f9199f908c3743a30647ee7e89ddf2337,", - "input-week.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "input-week.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "input-week.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "input-week.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "input-week.border.invalid.dark": "S:a8adfab249387b32b9df0f5c3242fec9fc8fdbe2,", - "input-week.border.invalid.light": "S:0ddfb544e007231f7cdf4575bd1e0819e1693043,", - "input-week.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "input-week.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "input-week.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "input-week.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "input-week.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "input-week.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "input-week.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "input-week.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "input-week.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "input-week.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "input-week.font.prefix-suffix.dark": "S:4d2a372d83ad583678d32af9c4796c68f225965e,", - "input-week.font.prefix-suffix.lg": "S:e0a7a396286f1992398c279d909067267e8db0cd,", - "input-week.font.prefix-suffix.light": "S:e2959eb04e2696a5375ae08884ba255f0fc66059,", - "input-week.font.prefix-suffix.md": "S:95c940152f69d63b7ea3609a9c41a550ee6ae768,", - "input-week.font.prefix-suffix.sm": "S:672ad7662fa9d29d12561d98e15ce4d893880f8c,", - "input-week.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "input-week.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "input-week.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "input-week.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "input-week.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "label.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "label.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "label.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "label.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "label.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "link.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "link.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "link.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "link.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "link.font.regular": "S:c408c9ff827ad4b2f4e934f2cd6a143455780c5f,", - "link.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "link.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "loader.default.foreground.dark": "S:304a629ada6a7ef5519a7806204eeb4d7f01d954,", - "loader.default.foreground.light": "S:b98314fedea7c3e5e832bff9d4e44474ce7265a1,", - "loader.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "loader.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "loader.font.text": "S:e693886a422add0f7bbb617ceba18a5ada5de0da,", - "loader.font.value-text.lg": "S:14dd6559ad9eef407904de82098dafba431e98e2,", - "loader.font.value-text.md": "S:8e937a8014060d3b991f96d6988982c4a6d5434d,", - "loader.font.value-text.sm": "S:326d9abc426f0f215ba172af78bfe1fb9ac48bec,", - "loader.inline.foreground.determinate.dark": "S:dc561e94c526f6e3c0a23ce9ec67da08b6656413,", - "loader.inline.foreground.determinate.light": "S:691f6850302be0203c2298e598ab895cf8fc4fe9,", - "loader.inline.foreground.indeterminate.dark": "S:4280761ef8e8f569b4352ad45aa52609ff23e128,", - "loader.inline.foreground.indeterminate.light": "S:da04095cbdaf7cf5f98eeec697078fc7264d32ba,", - "modal.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "modal.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "modal.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "modal.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "modal.border.top.brand.dark": "S:b05703110c9b8ce6024303d8afed3ba60fa3104b,", - "modal.border.top.brand.light": "S:a9b4989bb9daad33b84c52206527ff7e76479865,", - "modal.border.top.danger.dark": "S:fb0dd7e07d149d3086385646a21160771e492be7,", - "modal.border.top.danger.light": "S:07a123da04a78be0ca0734de98940cf63a2c2d61,", - "modal.border.top.info.dark": "S:d6ae78b081b805c48d50806240c949cc2b9d0fec,", - "modal.border.top.info.light": "S:c3d1c7b192199d8fd537011e94f4289ab0ab1631,", - "modal.border.top.success.dark": "S:a4b10bfb518b25fbd87598ada78821a3b8c307e3,", - "modal.border.top.success.light": "S:0b8304d2a78248a6fe28da6b96560351b1c33f47,", - "modal.border.top.warning.dark": "S:78a2de515a0dcadf8f2b49cae9bd8be150243908,", - "modal.border.top.warning.light": "S:ed7d8c003631a5e8be2f0631574bd70db885e44f,", - "modal.font.content.dark": "S:5bf1d0dbbd8f49618514192dbfcaf7057cd6f72a,", - "modal.font.content.lg": "S:5da5d0c2e707f47a5cba3740883f9b09066cba67,", - "modal.font.content.light": "S:c46be83f52216f16ced44f463fcedcf82d3ee870,", - "modal.font.content.md": "S:b2c1bb5f4c41d1d2af5feb08ce085d132682c3e3,", - "modal.font.content.sm": "S:f2e10a30773ad893d3104d4c612c5a6bde6f5c58,", - "modal.font.header.dark": "S:a3fd15b7d470afc805b072dbf848d57469bb681c,", - "modal.font.header.lg": "S:82b11c9411411513150be795953c302451b0092e,", - "modal.font.header.light": "S:bb81170665255fe206e85bde8105d7d0e49230e8,", - "modal.font.header.md": "S:09bf67955036c958a09976e5162d4423b30b6a93,", - "modal.font.header.sm": "S:a4b9d004ad1b17fd1f98b1f2d5bf20d46e265ca1,", - "modal.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "modal.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "notice.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "notice.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "notice.font.message.dark": "S:7815f7fb82fdc4c4c26e1623790dffe9e187a466,", - "notice.font.message.lg": "S:09c48ee987903ee44f92b7fd85f5e4dea0ead949,", - "notice.font.message.light": "S:6cf383eac5cca5700a959ab59f20a865a46decd5,", - "notice.font.message.md": "S:914616baac8f924bb3068d03da85a3d7598a4eed,", - "notice.font.message.sm": "S:62cbe66d7a194cf143b483c76e81b3ef7faec7e4,", - "notice.font.title.dark": "S:a0ac87895a271a4c9bfda2ccc0254549ccbf2896,", - "notice.font.title.lg": "S:051bc74df8ad468b012d4a69124462a7bd88ac16,", - "notice.font.title.light": "S:d274bba017fa590088dca04c9015131da09237de,", - "notice.font.title.md": "S:bb08857b89d59fa3d1473495b191094ae721da80,", - "notice.font.title.sm": "S:3ce9291673796d12312501274a38efcf55f6b482,", - "notice.highlight.brand.dark": "S:238edd866a0fb63465a1a1a3dd99d48708e2e316,", - "notice.highlight.brand.light": "S:ff24217a653ee3bef7ad198f70f6fb26257629cd,", - "notice.highlight.danger.dark": "S:0e46e2198e037bc44bbb6337a3c3ae78af39b0b0,", - "notice.highlight.danger.light": "S:f9bf35d17558127d31e7aff5fa320f4a088093da,", - "notice.highlight.info.dark": "S:38d81b30b34e16721fe36b6df97e1fbaf12f73e3,", - "notice.highlight.info.light": "S:73e5b57b4b678a4b853265e33050f7fae69dc0b4,", - "notice.highlight.success.dark": "S:478c949da4555301573feaba90dc2dcee7a720a1,", - "notice.highlight.success.light": "S:88529531c4701433647c40e594e0b654e9014ba3,", - "notice.highlight.warning.dark": "S:721ebfc1b5023d7516126855b4e94e83bce6230c,", - "notice.highlight.warning.light": "S:66f48a97f5bf1594dd2cc055de30fa2cb471a1c8,", - "notice.icon.brand.dark": "S:a76eb181aefeef694685113d7815fe90b15aea69,", - "notice.icon.brand.light": "S:eedb21b228f1b8f494c9f162140a63406414686a,", - "notice.icon.danger.dark": "S:7d85d8810f8eb5b037e710a082cad64cfc5e1683,", - "notice.icon.danger.light": "S:cf8d2ab3ca68b0f621b36d3b2ca6f691b9506ac3,", - "notice.icon.info.dark": "S:4f96af66fb23e050160b1662d3c2655ea138f899,", - "notice.icon.info.light": "S:98207d369d594d10f790fc9bea415e4ea3e45335,", - "notice.icon.success.dark": "S:7d3d6b3d230ecb9151d3b878d06a91bb15672455,", - "notice.icon.success.light": "S:99de94ded284f960aa2039ad2d96df78a0c880c1,", - "notice.icon.warning.dark": "S:571c79bd43fa8f6ade105342cc4805ecdaa77c50,", - "notice.icon.warning.light": "S:81ea08fd5391ccfaa22bd5bcfbe0811ce14f314f,", - "notice.shadow.lg": "S:ca2d6acae938d750c3ebd78a6713350177c6c0c5,", - "notice.shadow.md": "S:d2c3cde852cf462e84414acac0b6f2c1f9e1003f,", - "notice.shadow.sm": "S:857dcbb04d49470c09751d4f20741e87985fecec,", - "pagination.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "pagination.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "pagination.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "pagination.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "pagination.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "pagination.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "pagination.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "pagination.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "pagination.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "pagination.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "pagination.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "pagination.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "pagination.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "panel-header.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "panel-header.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "panel-header.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "panel-header.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "panel-header.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "panel-header.font.description.md": "S:2e204d97e7e530c52c455d00cd8e6354b2a81230,", - "panel-header.font.heading.md": "S:a753ee474e5276d2c3253cbf0c389bb17f0d993d,", - "panel-header.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "panel-header.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "panel-header.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "popover.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "popover.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "popover.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "popover.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "popover.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "popover.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "popover.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "popover.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "popover.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "popover.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "popover.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "popover.shadow.lg": "S:ca2d6acae938d750c3ebd78a6713350177c6c0c5,", - "popover.shadow.md": "S:d2c3cde852cf462e84414acac0b6f2c1f9e1003f,", - "popover.shadow.sm": "S:857dcbb04d49470c09751d4f20741e87985fecec,", - "radio.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "radio.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "radio.border.checked.dark": "S:3d7742ae7dae69c0768ae5d08d439cbaa2a7b078,", - "radio.border.checked.light": "S:f19b95f1c4240eb67ccce31f43a4a2b909fc9808,", - "radio.border.unchecked.dark": "S:318cf4c8f427f70be43a816f7091db13238a9282,", - "radio.border.unchecked.light": "S:d3f814c271446438e13819ae171d5ab92f739b18,", - "radio.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "radio.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "radio.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "radio.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "radio.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "rating.chip.count.font.dark": "S:57d5b0c18c9fb6fa98c8a2e627bb4355395289e2,", - "rating.chip.count.font.light": "S:9db37e98cba760e02da719f6c1f8e94a79ce6f47,", - "rating.chip.foreground.dark": "S:2c5f57a9414dade7ecd6d59f5d53e0cc2f811316,", - "rating.chip.foreground.light": "S:2a7ae900c56bdaed64830a000ab5f147e9a1871d,", - "rating.chip.value-text.font.dark": "S:0ab47c728381761f98384403f12dae2820e3227f,", - "rating.chip.value-text.font.lg": "S:4ca681a4eda0db296fad332696a6ed2e8fbbb86e,", - "rating.chip.value-text.font.light": "S:11423cc98fa9e43a0b42365d5ea5891e31085b0d,", - "rating.chip.value-text.font.md": "S:b10662274e31a3704323fc2cb94b1c233baaf571,", - "rating.chip.value-text.font.sm": "S:96101bf0744e53acc2166a2184aa7f8ae2c2b8c4,", - "rating.star.background.active.dark": "S:3f4cee2f66b1636cc5f5498324e084ba7fcfb60c,", - "rating.star.background.active.light": "S:9a8727139d8e167a07a102ceab10b6eb28d9a642,", - "rating.star.background.average.dark": "S:2b295f1ae1097dd5aa7d56c9401d7b054cadc945,", - "rating.star.background.average.light": "S:d1ada06fc9c905264006c3ce38ece1b10157bf48,", - "rating.star.background.default.dark": "S:2c69735b85675262be35962ab8d72d564660a8dc,", - "rating.star.background.default.light": "S:710775754e463031894aa2fcc269e8080b46a711,", - "scrim.background.dark": "S:ae675fa609e690e4af981c7796a6debf62e6f42f,", - "scrim.background.light": "S:e9f7aa7a393bae37122ffee08d9b2bdf9ba2b646,", - "segmented-control.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "segmented-control.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "segmented-control.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "segmented-control.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "segmented-control.font.checked.dark": "S:1b340cfe17153ee654d067cf22fbf1e890af9726,", - "segmented-control.font.checked.light": "S:40c18363bec74ce07c70ac651afcd442f0046da8,", - "segmented-control.font.default.dark": "S:4c5d135c09d35ba6ab69fd50adcc3e6b908c42ec,", - "segmented-control.font.default.light": "S:da358d253b4d43ea28103a02475ca67ed10b83e8,", - "segmented-control.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "segmented-control.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "segmented-control.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "segmented-control.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "segmented-control.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "semantic.font.bold.-1h": "S:afc0290f0e8fb7baf9ad9bff726fec5b8be566d9,", - "semantic.font.bold.-2h": "S:54987de2a104c16ec008edd20032edb6d16adfaf,", - "semantic.font.bold.-3h": "S:74e1fe3ed21e71c916dbef607e29b886cf764108,", - "semantic.font.bold.0h": "S:13ff638c61c8b19b2913899cf5b61e7e1282faaa,", - "semantic.font.bold.1h": "S:6ad42ea7d0e6098a9674409001eb003650d3896d,", - "semantic.font.bold.2h": "S:57de50a0932460e5ace3d04c7072d596f17d559f,", - "semantic.font.bold.3h": "S:79fb2dc506f1ab1d9a4953375ced8b8f19dfe781,", - "semantic.font.bold.4h": "S:dd24c176b4caa6cb3e89a040ba2602bf2fb98c90,", - "semantic.font.bold.5h": "S:b7529dcc211980b8569fb8a0b1c46a31706ee992,", - "semantic.font.bold.6h": "S:785975d1d0be4835b1cc9822775ab759871c7f36,", - "semantic.font.bold.7h": "S:4e8855d72d4c4ac54302dec14cf0ba54b5b4538b,", - "semantic.font.bold.8h": "S:90ba13a0083643ff299c27d4c1d54c505f3e0eff,", - "semantic.font.default.bold.-1h": "S:17b20c9348892cad57a5264d833eff914389be66,", - "semantic.font.default.bold.-2h": "S:542864c12a09091cd711ee99382dfb670da75d56,", - "semantic.font.default.bold.-3h": "S:f9691e3bc28d14127e0937c5709a6adac1abb1b1,", - "semantic.font.default.bold.0h": "S:36cc6065d5108adcd6fd5ae0a2dd7aae3ac9b7ab,", - "semantic.font.default.bold.1h": "S:7f20641af4349763385cccaa4c922507d0509bbb,", - "semantic.font.default.bold.2h": "S:7ffe88bbc64eb05102b59d71d053a9eec4e193a0,", - "semantic.font.default.bold.3h": "S:cd6d4da5cbd8097ce2998db554909e0d69681d29,", - "semantic.font.default.bold.4h": "S:6294f9009b4ca52cd74b62fc93429e5270c2e1e7,", - "semantic.font.default.bold.5h": "S:542a6d26a8c5de3ef75e36d3be6e4c77e3e47d47,", - "semantic.font.default.bold.6h": "S:fe0f1febd1e9d6d281b8598a68ed8491c4afc6d6,", - "semantic.font.default.bold.7h": "S:e44d20e160df29f5b8bb28d38b69ea93faf3b424,", - "semantic.font.default.bold.8h": "S:4b05ff3e5710321f82cf95d7e57335bc6ca4f1cb,", - "semantic.font.default.light.-1h": "S:d97c48634357f806ef3d1480c9656ef66fab7289,", - "semantic.font.default.light.-2h": "S:6d4d0ce7635f3287bc32b08ba7b014de59921559,", - "semantic.font.default.light.-3h": "S:448b8eef6afc320529c1511a5d210297c4b712da,", - "semantic.font.default.light.0h": "S:33d15e08a02cd7e1bdf1011762f6b9adfae79b27,", - "semantic.font.default.light.1h": "S:d1ffb1864e795d393f0095a4235916dc58a8259e,", - "semantic.font.default.light.2h": "S:0952400b4b67b69f03816c2f9c925db27c7d801f,", - "semantic.font.default.light.3h": "S:4ea96f94c15953429909c2b2dc15c3bb0b2815bf,", - "semantic.font.default.light.4h": "S:d64e93a9f77b74fa9349db68933422df14e8fb10,", - "semantic.font.default.light.5h": "S:0be059d62f7cfd1b86c5eb059707982ff5e32b23,", - "semantic.font.default.light.6h": "S:0fa03ed4d3b9f4473d72982137b02379de784218,", - "semantic.font.default.light.7h": "S:df73e52a2cdf830d1cee6bbc8c28905ca60a8dcb,", - "semantic.font.default.light.8h": "S:bbf4a7b49b5e20bfd25da69a7a1e081b3922727c,", - "semantic.font.default.medium.-1h": "S:06e0d4a94b16fa9a0c903e1b57f53d101fc775f2,", - "semantic.font.default.medium.-2h": "S:8a9b402b814f835cbc6842d324c047ea41ac92a8,", - "semantic.font.default.medium.-3h": "S:a68637f330054d193a760d2f79d0a8e643e9ec31,", - "semantic.font.default.medium.0h": "S:5ea926036783771ab1655f2b2ceb56250968522b,", - "semantic.font.default.medium.1h": "S:d540a3df6537a70aa5846a51abf53d8648ab1082,", - "semantic.font.default.medium.2h": "S:1472f2ed1508242eb3ec85d507371921258b2bbf,", - "semantic.font.default.medium.3h": "S:98c7c2afadd9444f79f3a87629fc6be454982068,", - "semantic.font.default.medium.4h": "S:371251870d9e73733636f040c0c06062eaeda112,", - "semantic.font.default.medium.5h": "S:4d391a8697373fd0fd8dac6cec59936e7c1598bd,", - "semantic.font.default.medium.6h": "S:5b77ac013b402efcd145ccf0d0719a9299958808,", - "semantic.font.default.medium.7h": "S:67029b6225ab20096df8da8ca9de08de43491255,", - "semantic.font.default.medium.8h": "S:b9869105637e6d3b5e4e789b9adab73c9b0b8723,", - "semantic.font.default.regular.-1h": "S:d226510a3405bab79fb709f0894da8ffe83f0f49,", - "semantic.font.default.regular.-2h": "S:c2ce2e62c26dd7e48297ebb52dd530aa12efe109,", - "semantic.font.default.regular.-3h": "S:e539f06b6ef0f93743d99f050c67d6496056799c,", - "semantic.font.default.regular.0h": "S:901d996f7d9fdb561034d4ec0e8e74ab5de106d8,", - "semantic.font.default.regular.1h": "S:c48245c10d68383746909343a54fdf5a920ae81c,", - "semantic.font.default.regular.2h": "S:9c34f9ed2b0abde711f5f65c08633627314a491b,", - "semantic.font.default.regular.3h": "S:f8ff4a752cb1cc3baeb4c4186543b98a592f6ac7,", - "semantic.font.default.regular.4h": "S:6a50b1b7c5a005593fd4fa8eec8230f8f783ef44,", - "semantic.font.default.regular.5h": "S:34db3a1662fbcf2c075d6e5b607b6bbb27a50948,", - "semantic.font.default.regular.6h": "S:e3f9d7e0f4439e711883b04d94c827dbfff20a8d,", - "semantic.font.default.regular.7h": "S:6683a70fc5ca1dd68eef7ba2656ba179376fe239,", - "semantic.font.default.regular.8h": "S:f33bdcf5723f8bd3ff9fbe33b6d07d1c18525ffd,", - "semantic.font.display-1-test": "S:b0d4d7bc167363796cc22131b7506da0005d7863,", - "semantic.font.display-1": "S:3908ae460ad228228b32977728619d2f97410f17,", - "semantic.font.display-2": "S:c72b65d3f49e7c447d079db3fc5ef9275048408e,", - "semantic.font.heading-1": "S:3ac8500f5c2ea4a2f581ef9830b9f14ab9a412a5,", - "semantic.font.hierarchy.body-1": "S:505abbdd354c8ea55e27b9a500e86276988eb9cf,", - "semantic.font.hierarchy.body-2": "S:c4d02b7fec5d9014e79420d18a7dcc4ad9ce4477,", - "semantic.font.hierarchy.caption": "S:b951134acc837c9c2e0fde5059666306d644a89e,", - "semantic.font.hierarchy.display-1": "S:594de2ae8f95a4557f94948efb92e719c44d8dc3,", - "semantic.font.hierarchy.display-2": "S:345ca489008fa931564b0874bd1e23c4e9d48aea,", - "semantic.font.hierarchy.heading-1": "S:94ccd91356c618934977da98b51a717b141c2b45,", - "semantic.font.hierarchy.heading-2": "S:d5452773dc8e3ac66d43ae15d64cdccb0e8a875e,", - "semantic.font.hierarchy.heading-3": "S:5a462c2c5c170b662f9be6536d6034c222ce5d64,", - "semantic.font.hierarchy.heading-4": "S:2fdd27077600a7745a2573719630a2818c9768be,", - "semantic.font.hierarchy.heading-5": "S:51757e80503233faa7a0102da2d6f7770d620f83,", - "semantic.font.hierarchy.heading-6": "S:b603d2e8c9cf762c51996f290b7e930bef26a327,", - "semantic.font.hierarchy.overline": "S:8c5923b6a044203bd88b4829f85ff177c9950004,", - "semantic.font.light.-1h": "S:41a42c10664cac8552b2ff92159cb94da1a15f17,", - "semantic.font.light.-2h": "S:7d9d98ca61e5ff92c4824f444d9e36566a110622,", - "semantic.font.light.-3h": "S:d917a24a859a39090dae167dcf139522ab4c00fe,", - "semantic.font.light.0h": "S:48f2a99a9ad071f1b74ff133854726c9c8f1ad20,", - "semantic.font.light.1h": "S:5ac4e421506815328561f54c775c5a47dc76e957,", - "semantic.font.light.2h": "S:7b41d3d15560c760dee773fe3694f398bb89d191,", - "semantic.font.light.3h": "S:c119256e31b846cbc8b8dfb0e40317681188a2aa,", - "semantic.font.light.4h": "S:6ea40e0a368ba6610af7cc697273299af4b6fa27,", - "semantic.font.light.5h": "S:120f2155e39a4868d99dd0b42dd0df4d25d45366,", - "semantic.font.light.6h": "S:29c477dbdecd38c9bd317dc4010f0f77b8e0abfe,", - "semantic.font.light.7h": "S:fa5595562700215efdfe5c7ec9e315e8ea7e0140,", - "semantic.font.light.8h": "S:93fddf863f558a7cbeb9544054758c91fcd9aeb8,", - "semantic.font.medium.-1h": "S:9c279a62473f5d6e7f332262770e86dd19ab9b78,", - "semantic.font.medium.-2h": "S:70149187f04293dcccbee57c2d9d67575682457b,", - "semantic.font.medium.-3h": "S:ae80a5f4726c4493ff4280767268f893973b3ad8,", - "semantic.font.medium.0h": "S:98376e7182cb61649fc4f31951a69f833c02dc72,", - "semantic.font.medium.1h": "S:6fa0a683940f133a73fef27114d53448874365e9,", - "semantic.font.medium.2h": "S:a2a9f75bb36072cca3417fdb4b33a9969dabccc1,", - "semantic.font.medium.3h": "S:5d8b4e59cbf1d93b48d93d84f5bdf96968471be4,", - "semantic.font.medium.4h": "S:0d9e7471d514f2f5c2612dcc1355a210b5743adb,", - "semantic.font.medium.5h": "S:38f1156392700dc1c05971a6f6109e14ae87581f,", - "semantic.font.medium.6h": "S:75a405bf79c648fcfdf865b536adac2b5a62b9b2,", - "semantic.font.medium.7h": "S:75ec0d2fbf3d3978849b50681b17521ee88ce3f9,", - "semantic.font.medium.8h": "S:2bb1e99b37056ff104b8a02f9feb339456162e3d,", - "semantic.font.regular.-1h": "S:1879faddf0d482e897938fc7d4f444c2e59449bc,", - "semantic.font.regular.-2h": "S:ece77df10a6171a84d85f019fc5a8b4ff8bacd81,", - "semantic.font.regular.-3h": "S:d8e9f7d48bf1c4c8ef34fec0c01e80861ec7b2e7,", - "semantic.font.regular.0h": "S:ffaf51da4055f171e094916e848d56e6ab362814,", - "semantic.font.regular.1h": "S:9038c74d0453e1386cddc4ff1936cbfe952cd45a,", - "semantic.font.regular.2h": "S:1e6361cfe1340a1803d911a2328558ab872e5939,", - "semantic.font.regular.3h": "S:b2830a45308bf76c337c849bb0cc20913c85a32b,", - "semantic.font.regular.4h": "S:b3d2a3f1202b88df4093c0d6122929e1b2b041f0,", - "semantic.font.regular.5h": "S:e0ea81ff2ed51c7a0cb0eca3ed77b2301f4de674,", - "semantic.font.regular.6h": "S:cd0a859b4e621d87ee62fe531235add537d77f80,", - "semantic.font.regular.7h": "S:c04ef88fd6999578353fcfba43ef70c7e4777aaa,", - "semantic.font.regular.8h": "S:f1d8e0979f4d155347b3c46efa83cdfa854008fb,", - "semantic.font.wrap.bold.-1": "S:c5860e8f1206a3d343390c9a915a8f3f58a0b336,", - "semantic.font.wrap.bold.-2": "S:7f2ba398b489c12db90e5045bb6f7027780a9b3b,", - "semantic.font.wrap.bold.-3": "S:4bca865601ab87f1d77f48d3e1de83d3dbac85a8,", - "semantic.font.wrap.bold.0": "S:ad11f6639ca0cd3d85cf993fbc95e7c9ad9ca269,", - "semantic.font.wrap.bold.1": "S:9313a06be8f7070400e6cfd7f7ff27939d6c6ed2,", - "semantic.font.wrap.bold.2": "S:abfb6349c8c060ad0abdb9ce2f363e08233be443,", - "semantic.font.wrap.bold.3": "S:6a08218bc036ca8a46513197790957e3bb9ca105,", - "semantic.font.wrap.bold.4": "S:4aaaf75ae7f4623fd87f62e8891a36efec7b371d,", - "semantic.font.wrap.bold.5": "S:f7fa8ece8ccab4931cfb0c5e19e970140da9576b,", - "semantic.font.wrap.bold.6": "S:122c69ab69b84f7f77c19a7d4500d945e434f81b,", - "semantic.font.wrap.bold.7": "S:2712dec933d765f4c2e0d201dbcb1fba43b266f3,", - "semantic.font.wrap.bold.8": "S:38b78db6105317957d23ba1adeb83432e7831f5c,", - "semantic.font.wrap.light.-1": "S:7841c5bab1ad63e397e9ac884b8ede26130fe2d8,", - "semantic.font.wrap.light.-2": "S:0575d1464658f6f8233739cd82ec2561a46e8199,", - "semantic.font.wrap.light.-3": "S:ec76af7e237bca56ab3b0eeece5616fc4c66893b,", - "semantic.font.wrap.light.0": "S:ad0064efc4ce82398d0acddf75cbd5e41f06f13d,", - "semantic.font.wrap.light.1": "S:fae87e50783ad1979337a90ab0271f6fd5a150b4,", - "semantic.font.wrap.light.2": "S:3bde43f8548be65880bce5d5c2ccb60a59afe03d,", - "semantic.font.wrap.light.3": "S:75de41b5080babbb13afaca2d11073e996b3b0ea,", - "semantic.font.wrap.light.4": "S:b9d229876f3242705efff7bfe110ca6baaf00f71,", - "semantic.font.wrap.light.5": "S:83e915d79c195eda8a98454dca5868f0225e1bd5,", - "semantic.font.wrap.light.6": "S:6e448d218245dbac9f250f5d6cac088005d5e3fd,", - "semantic.font.wrap.light.7": "S:2e650a9572119390bf68afb9cf7ac1ef2ff16aaa,", - "semantic.font.wrap.light.8": "S:bd6df56d4f7f06585fa5eb1c840507647377470d,", - "semantic.font.wrap.medium.-1": "S:4c6ca23bf1bd7002f101a347c3d9ad21ccbee0e1,", - "semantic.font.wrap.medium.-2": "S:526517080d04515a9580785dddc87f680a179488,", - "semantic.font.wrap.medium.-3": "S:018ce57cb92b0652178256efa6f21989100cf8b0,", - "semantic.font.wrap.medium.0": "S:8746d1c9ca0cd1cdd592df79ab2d61ee859b8071,", - "semantic.font.wrap.medium.1": "S:bfb563f71a916453ce2de93c6cad2fd3738cff6a,", - "semantic.font.wrap.medium.2": "S:7a2f4cdb73d54deed52c6b690c6863d76dbe55b2,", - "semantic.font.wrap.medium.3": "S:178f16dbb959a506aed5aff27b4f64ab33e204d3,", - "semantic.font.wrap.medium.4": "S:0100d6fb52cf898cd004a8752d03f5dfab4d7216,", - "semantic.font.wrap.medium.5": "S:9f7368f9e7cb233d4585c25f6e7b7b6ac9f1e857,", - "semantic.font.wrap.medium.6": "S:1ad763f1dc801bceed5a8c2027fa2a357c1fcf55,", - "semantic.font.wrap.medium.7": "S:1e0e5b711985bce690c3e32dd663eae62fe99dcb,", - "semantic.font.wrap.medium.8": "S:ad7eb3080e7540ca64cb61b2b599c73a73da2e9b,", - "semantic.font.wrap.regular.-1": "S:8cfb200ba516a6a75a81538c8d9a5273692f7b91,", - "semantic.font.wrap.regular.-2": "S:79bfcbc46d7482725a02f917f86341342900cc4c,", - "semantic.font.wrap.regular.-3": "S:791af7d01240411e1aada55cc97dd03f9e9a447a,", - "semantic.font.wrap.regular.0": "S:66b886195444d65889657f414927f31bcf090174,", - "semantic.font.wrap.regular.1": "S:34fdc8e0ee010877423e5f7bad26f54e5f4c1ec4,", - "semantic.font.wrap.regular.2": "S:2e82a159ce76ed0c68d7a20f72c38807a69ad104,", - "semantic.font.wrap.regular.3": "S:9e278573c267b7f30f5719e73b1d21105edf49a9,", - "semantic.font.wrap.regular.4": "S:f52208a0d4984cff2d733adce9803ea89a41cc55,", - "semantic.font.wrap.regular.5": "S:a5d4a2bfedfd60bcc6d076cb87053eb396109863,", - "semantic.font.wrap.regular.6": "S:a7a9d92ab31a81a26ff26d3f8193670dabe1cfdf,", - "semantic.font.wrap.regular.7": "S:879ab6791a3c5b321e06c04b83ca30528264ff54,", - "semantic.font.wrap.regular.8": "S:a9f87e2be6eaf5de030dfa0f406f14f6d26369b2,", - "semantic.font.wrapping.bold.-1": "S:34834145994f92bec7a333b947d8b9eaa7eed441,", - "semantic.font.wrapping.bold.-1h": "S:096d9eb81f8e805709076fb461775a16bf13252d,", - "semantic.font.wrapping.bold.-2": "S:fccaf371d4a50fab1cf59e36c9324d2b70ebc768,", - "semantic.font.wrapping.bold.-2h": "S:9893c9a54f3f499a7dfaae4b5160a0410cfe201f,", - "semantic.font.wrapping.bold.-3": "S:38e29095e52427292becf2a07133494088ca419b,", - "semantic.font.wrapping.bold.-3h": "S:d850a3285afd70187933dcefde351826a2ab4421,", - "semantic.font.wrapping.bold.0": "S:917c7a64033126eccc69db8bd968cd0dd498d939,", - "semantic.font.wrapping.bold.0h": "S:29a9492ae0534a958fae5dee6e8ebbc31da4dbc4,", - "semantic.font.wrapping.bold.1": "S:d4eee929079375e0064e846e5870015589d518ca,", - "semantic.font.wrapping.bold.1h": "S:ab40b80067ee6a60ebc8885ea72e9de35d61af94,", - "semantic.font.wrapping.bold.2": "S:af8a51d8ba41c70e1c3b1697b60e921d88689711,", - "semantic.font.wrapping.bold.2h": "S:3c5efcb6933c025c0e1cf01165d62041164fcd40,", - "semantic.font.wrapping.bold.3": "S:b4852b0be0981ec1787c5d722adbbfc6d5c266b3,", - "semantic.font.wrapping.bold.3h": "S:06447d383a003f3c88cadd7c9f250fb214736e98,", - "semantic.font.wrapping.bold.4": "S:f08bdc520fd89c87742b0b1b4e4e442092f86012,", - "semantic.font.wrapping.bold.4h": "S:b4a780b011a33d002948112bb416b714f7b123c8,", - "semantic.font.wrapping.bold.5": "S:a1405c36d478386dc67d3a6b73d29c3be503ef93,", - "semantic.font.wrapping.bold.5h": "S:8fa5f15bd1fb010f583f3fb12b906e0d9285413c,", - "semantic.font.wrapping.bold.6": "S:a99e517e6bb191dc09dbfbbce437b9324651d7e9,", - "semantic.font.wrapping.bold.6h": "S:41d232ec184e91d46ad683ade599479502bd5181,", - "semantic.font.wrapping.bold.7": "S:86472102db19e2c62177988f56cf744939df48e2,", - "semantic.font.wrapping.bold.7h": "S:bab15397ed5452670a6f43ff9a5210fc916322c5,", - "semantic.font.wrapping.bold.8": "S:a21b6e042f01932b77253d57f4b55aff27ed3b63,", - "semantic.font.wrapping.bold.8h": "S:48bd2701339b08ee740c49cd2580a3fb1cd10d66,", - "semantic.font.wrapping.light.-1": "S:f946e6758a0b51022d945e7be04a98b0c97270aa,", - "semantic.font.wrapping.light.-1h": "S:7d5607ce2f79b191231ea47515b838f93ddf9388,", - "semantic.font.wrapping.light.-2": "S:08e0a34c1836c454034a0ebcf5ec086f5b8aa98d,", - "semantic.font.wrapping.light.-3": "S:e416e183b73c084e64000363006ae8e638a4cda6,", - "semantic.font.wrapping.light.0": "S:113f831b8d4eac459cfb910c10d41f364a7650be,", - "semantic.font.wrapping.light.0h": "S:64cb9b370ec3140288917788fef523db4b846891,", - "semantic.font.wrapping.light.1": "S:756607e0d76385140aec36f60e8e4d6fddb1c294,", - "semantic.font.wrapping.light.1h": "S:22669e14596dd9e73f2520b84daa1aca2fd2ffef,", - "semantic.font.wrapping.light.2": "S:d03d8531bddad250b454fc8901a8ee1614143a9a,", - "semantic.font.wrapping.light.2h": "S:b5fbfb0f54913882667342e8c941e22f0bfe3df8,", - "semantic.font.wrapping.light.3": "S:60eb6812611bf886d71d6c0da79d5d7295b55b2b,", - "semantic.font.wrapping.light.3h": "S:6d2bd2e26741c6deee50e21596e235dc1c5d51d7,", - "semantic.font.wrapping.light.4": "S:3647f0fbad20b1446d9292740c1222fc3ddeb3a6,", - "semantic.font.wrapping.light.4h": "S:cc3b324e2dbbf72a3b37973d9e25b6317cfaf211,", - "semantic.font.wrapping.light.5": "S:c537b1cdf454812c9042151ad3ab4fc0457e1271,", - "semantic.font.wrapping.light.5h": "S:efac4ecfb07343b1702ab2bbb53c606a68a1e419,", - "semantic.font.wrapping.light.6": "S:3b0d909906ece8612086fb8adac9d3f648835dd0,", - "semantic.font.wrapping.light.6h": "S:41b47b0d3b3922bfb0ac880cbdb71eb11be525d3,", - "semantic.font.wrapping.light.7": "S:b2c4b4a3047ce3df1c6e5b19c3ed7e4552330a80,", - "semantic.font.wrapping.light.7h": "S:bf49b73700a5295469458598fa90b002b3da6c9f,", - "semantic.font.wrapping.light.8": "S:9c92241cf0731a766c3940579c515f6ab3b268a6,", - "semantic.font.wrapping.light.8h": "S:8dbb8043d1e6858c83ef34f427669565b3c3d3be,", - "semantic.font.wrapping.light.n2": "S:cf4c89f57c59a408e3e688f08e8dfe7083017a40,", - "semantic.font.wrapping.light.n3": "S:5665474cab8abc84be2705aa2d69e8302fe677fa,", - "semantic.font.wrapping.medium.-1": "S:3a3bd94c35c16515f2a0359b652d42b5dd2cbbf8,", - "semantic.font.wrapping.medium.-1h": "S:a411144833698582d3d667404dff1c51d2ed725c,", - "semantic.font.wrapping.medium.-2": "S:2a7a56dc8b354813beaf12f604f16a26b6814771,", - "semantic.font.wrapping.medium.-2h": "S:fb800221a3cc1ad6c0e9b14b379ce58e167da83f,", - "semantic.font.wrapping.medium.-3": "S:c9a84529355c15890d2864307005bcb3d4847467,", - "semantic.font.wrapping.medium.-3h": "S:ec4e52ddea42eec376994a43052c4f9c16a7cbfa,", - "semantic.font.wrapping.medium.0": "S:532ef8eccd614a5963a4aa27009d31fb4fe8a35e,", - "semantic.font.wrapping.medium.0h": "S:d6ae2776b675b0f9eb564b44e99fc247c45f20cc,", - "semantic.font.wrapping.medium.1": "S:952134daee976a592dc6f6f7843abc2a14613517,", - "semantic.font.wrapping.medium.1h": "S:10ed6f259577740921f0226a151f4e2379a15cc0,", - "semantic.font.wrapping.medium.2": "S:dbf32e14f8e1af618fa6ed7b89832d0199cdbbe7,", - "semantic.font.wrapping.medium.2h": "S:bc9fd61e570cc6bc9aaafe718bf78db6ee3862b7,", - "semantic.font.wrapping.medium.3": "S:74b153aa2274761787a00f8d597e177c0c8ae156,", - "semantic.font.wrapping.medium.3h": "S:099644cf284e0306b20d6bea591e7db75381d127,", - "semantic.font.wrapping.medium.4": "S:5754b750f761f362d909ece08b2a1989c189c79a,", - "semantic.font.wrapping.medium.4h": "S:4765244dfd91378cbd3a47104ed37dd9bf139848,", - "semantic.font.wrapping.medium.5": "S:adeb5a4879deea63d3b39115982fddeb96695995,", - "semantic.font.wrapping.medium.5h": "S:1f5783b0aa42c6c0235127937321cc341fdab1e4,", - "semantic.font.wrapping.medium.6": "S:5c0cc86a0e71da11b32e78b20ef5d232c62d71c9,", - "semantic.font.wrapping.medium.6h": "S:892f02f91c67b2dcd3f586d4c180fe3d9a870688,", - "semantic.font.wrapping.medium.7": "S:7e74e5fa71c9d7721911109403acacadfd5d1886,", - "semantic.font.wrapping.medium.7h": "S:832105a39b64eb3926a02b769557f720b54938e1,", - "semantic.font.wrapping.medium.8": "S:af3218e4f407567b02c85f23478def7e0d13ee06,", - "semantic.font.wrapping.medium.8h": "S:7b5043b79a37059a778abd119382fdd5b309d2e7,", - "semantic.font.wrapping.regular.-1": "S:44f275922a5f812dd35a1b5c9661be216858d0cd,", - "semantic.font.wrapping.regular.-1h": "S:2e196f5c5e7c32d117284ded47f7f45273793bfd,", - "semantic.font.wrapping.regular.-2": "S:86e370f21e78dfffe4e9f27ffde18362d80690b5,", - "semantic.font.wrapping.regular.-2h": "S:4963b538987c7b13e56c0b9c07057100cdae43c2,", - "semantic.font.wrapping.regular.-3": "S:2c6201ae8e5129bb584c9ebf6fef2c41aa86151a,", - "semantic.font.wrapping.regular.-3h": "S:95bd0ec306fc4ecb06beb9e3f8ef1b70ec4ab3ce,", - "semantic.font.wrapping.regular.0": "S:5f3490d2050259d369305982098622c44c2dab06,", - "semantic.font.wrapping.regular.0h": "S:fbf67c0034046d7bac320ee08ea5885f1482650d,", - "semantic.font.wrapping.regular.1": "S:df8c76e1fd0be66a6287ea3f66f7bec91fc1825e,", - "semantic.font.wrapping.regular.1h": "S:1c59f0bdd16fe7eabc3050d6c2060d9e4db16013,", - "semantic.font.wrapping.regular.2": "S:c07cbd78844e0bb1528865d0452cf8893949b636,", - "semantic.font.wrapping.regular.2h": "S:8a14bc83f10446d8e33596b4d1d426e8166ace29,", - "semantic.font.wrapping.regular.3": "S:ae027baf13e3d1c3660d2d83818279f97a4e3ac9,", - "semantic.font.wrapping.regular.3h": "S:9026e0ed6c84daf72eaa6e51d531ec90ae7d9d35,", - "semantic.font.wrapping.regular.4": "S:ce40c187eed0a936b401c929a482f7d975847db8,", - "semantic.font.wrapping.regular.4h": "S:24867b4f3e3261525bd1267252770636ccc9dded,", - "semantic.font.wrapping.regular.5": "S:86951b5e8e7111c7d62495daaf005500db7c11d0,", - "semantic.font.wrapping.regular.5h": "S:6e0d53181badbc5fe14a38a6bac8a59b88de31c2,", - "semantic.font.wrapping.regular.6": "S:ac54e3ad5795302455b5d1823cc7c975e497c6c1,", - "semantic.font.wrapping.regular.6h": "S:57d397ef4a04b69770d84a5fc824ca8352c307cc,", - "semantic.font.wrapping.regular.7": "S:9a862e09d1b46c2ac4a6d7c089e8a321cc415c35,", - "semantic.font.wrapping.regular.7h": "S:e0795eb7972feaa6fd068085a3ef8e133f2f6bf2,", - "semantic.font.wrapping.regular.8": "S:014f151c0c3493e989c00fc90ee397929c0d1077,", - "semantic.font.wrapping.regular.8h": "S:1e83ab4937424408e5b20600c16dcd643a929ef2,", - "semantic.ui.color.background.dark": "S:25ddbb665ba99d050fcfd4a1eca4307eac11f69b,", - "semantic.ui.color.background.light": "S:306f58c70f1ef21336c630a511f67008734c7695,", - "semantic.ui.color.border.1.dark": "S:de10c926746cf058e312d25bbe1293923913ea3a,", - "semantic.ui.color.border.1.light": "S:a96ee43d9f87e727e1d163dae97e943aa9748f52,", - "semantic.ui.color.border.2.dark": "S:d5b02aa93adc37c2cb7f7ad09e2c9936fef1af79,", - "semantic.ui.color.border.2.light": "S:c34ac7fe01960d487e1340a413d05bbbce372b8c,", - "semantic.ui.color.border.3.dark": "S:72dc2b15e848a591fce54e9a782b31cfd35f69ea,", - "semantic.ui.color.border.3.light": "S:99c548dfdede861e5b4ca80c8e0e27a8ffd970b2,", - "semantic.ui.color.border.input.dark": "S:9b2d20bd17e3afe23b7555baba0542ed04718efa,", - "semantic.ui.color.border.input.light": "S:05a96982b292c82f827ed448b7d1b1b73112f0ff,", - "semantic.ui.color.brand.default.dark": "S:ff86eaace467ba24e95a7f0d1ca36e2e3dc13c36,", - "semantic.ui.color.brand.default.light": "S:2717eb49f745b15201e304a9a0417cab2b0be01f,", - "semantic.ui.color.brand.hover.dark": "S:5e594584b58499f6ff3a7585e6f5cfac871c883a,", - "semantic.ui.color.brand.hover.light": "S:875002e4989b5f6f33ba973f006d3047f2b75ec8,", - "semantic.ui.color.brand.press.dark": "S:913695f5e3dcf642406582f6968dd8d79ec5d4e3,", - "semantic.ui.color.brand.press.light": "S:1cdfc0334a4e2836371c621c8bbe1b3eae058378,", - "semantic.ui.color.danger.default.dark": "S:bcd9526377574c8aa55265c56efe052ee58106e5,", - "semantic.ui.color.danger.default.light": "S:d9e760f9671a60e78405554f0d6136d5d8da409a,", - "semantic.ui.color.danger.hover.dark": "S:3bc83d4c69f16109138ff03bd2c9305f9ca12b55,", - "semantic.ui.color.danger.hover.light": "S:3248a4c66f727779f4aa07e18ad426c7700efe27,", - "semantic.ui.color.danger.press.dark": "S:c7a0d083475a2dbaa3b2c5cee77b93b306523975,", - "semantic.ui.color.danger.press.light": "S:0317416c5e7ce3abeaf8c10beef54611785cedd1,", - "semantic.ui.color.foreground.1.dark": "S:ce0f83b6569b348b76c4640824e2d0a656e6275c,", - "semantic.ui.color.foreground.1.light": "S:9dd422cbb46d827a6a16c08ceec1c4b521f43d1a,", - "semantic.ui.color.foreground.2.dark": "S:f260c383d532520db9d12e649a880b2cfb7b8e24,", - "semantic.ui.color.foreground.2.light": "S:a31002f2b1a51bd4fedafbf593735a26461b3a7d,", - "semantic.ui.color.foreground.3.dark": "S:b6288fc1b16cd947843f0b1d5b1fc659c3d5e4ad,", - "semantic.ui.color.foreground.3.light": "S:a9d51394e6365799ec9946a3f10d571337ad925a,", - "semantic.ui.color.foreground.current.dark": "S:7843aa25183f4168e7e37abc38238f90178fbe20,", - "semantic.ui.color.foreground.current.light": "S:6f322dcea6ed2d12012f28be4a31b05432ece061,", - "semantic.ui.color.info.default.dark": "S:8941782f2e8868518a8fba39df6bc1cea8fd42d6,", - "semantic.ui.color.info.default.light": "S:bc35ccb3f80820fad15134da4de9ca7ca618e760,", - "semantic.ui.color.info.hover.dark": "S:23f26a31cedad39725a8c7549d93d5d427a3298e,", - "semantic.ui.color.info.hover.light": "S:1e1db2e409ab5142882dcca056f99a725da762e1,", - "semantic.ui.color.info.press.dark": "S:27a9a23a009acf6a0e1491af580f2483da196ae4,", - "semantic.ui.color.info.press.light": "S:1532ddb6aa0fc5804f9c7abe7a09f5bb3171e400,", - "semantic.ui.color.inverse.dark": "S:a32fdc05568e2e4282b4836265cb5687e2521e91,", - "semantic.ui.color.inverse.light": "S:5b474932a5a9f9d8b7c02009b7a5100290ee961c,", - "semantic.ui.color.success.default.dark": "S:a4377176e8858a49ec7bb8466e663377b9bbe1c0,", - "semantic.ui.color.success.default.light": "S:c7736e420c97f32c40c2aff9ba2dc3f35cfc4692,", - "semantic.ui.color.success.hover.dark": "S:370f35e29a3a78b921a889a3b667ee01f0500cca,", - "semantic.ui.color.success.hover.light": "S:aadf659591f998182a22a593a71e4b8b2647ee00,", - "semantic.ui.color.success.press.dark": "S:c11d3d9223c0c3ffe3e32bedd5d6e04f56b6befd,", - "semantic.ui.color.success.press.light": "S:65bb5e488168506c092284ea9943854bee4d8f60,", - "semantic.ui.color.text.1.dark": "S:e21a0c3c8d5a685ab9c217f711d86e4e0d7c14b2,", - "semantic.ui.color.text.1.light": "S:8c8054c9d1acdad360937d1e87b39868b4a30cdb,", - "semantic.ui.color.text.2.dark": "S:a7860d0a07d9c233bc07a62703bf53a65a12accf,", - "semantic.ui.color.text.2.light": "S:5a28ed5672ec6dd9950a05742f3be134c44c2d51,", - "semantic.ui.color.text.3.dark": "S:3783278595fbf16ede70a66d09553f69b13b53a5,", - "semantic.ui.color.text.3.light": "S:ff1caa6a3822f4a34a62a44f8f98f63a1940fd73,", - "semantic.ui.color.text.inverse.dark": "S:73a7f9d57384b11dc91f8bacd71aa73ee3768a17,", - "semantic.ui.color.text.inverse.light": "S:f1e9b8d6929f1e925d6fa3f1c0964ab856d616d3,", - "semantic.ui.color.text.link.dark": "S:a5f800dd18722eff9d0f9bec0656826fedee956b,", - "semantic.ui.color.text.link.light": "S:325ed178e00c12b2ed52ba1a50938d96244776ee,", - "semantic.ui.color.warning.default.dark": "S:de4aea1e80c12dbbacaf32f2839123028a90ccb4,", - "semantic.ui.color.warning.default.light": "S:a5f527c61c655c43a0032fe9357db48396daa2ac,", - "semantic.ui.color.warning.hover.dark": "S:c004e1251a7e8ab8dda7d53acd286eea6b8da229,", - "semantic.ui.color.warning.hover.light": "S:b6f88f4f688d7ba49a0ffe93f8a3476b930f05c3,", - "semantic.ui.color.warning.press.dark": "S:463b75a567d4495c2cb746fdc8292f0b9f661548,", - "semantic.ui.color.warning.press.light": "S:864044c19214493bb045462f0fead60fe6c064aa,", - "slider-histogram-range.area.active.background.dark": "S:91077d887efcf9f4b14ad27f16be3585dc657cdf,", - "slider-histogram-range.area.active.background.light": "S:c89c4d11164ed977c2c0e97abe8f82386ac87c7f,", - "slider-histogram-range.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "slider-histogram-range.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "slider-histogram-range.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "slider-histogram-range.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "slider-histogram-range.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "slider-histogram-range.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "slider-histogram-range.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "slider-histogram-range.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "slider-histogram-range.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "slider-histogram-range.font.tick-label.dark": "S:b91db31036b50c78584bddf19f36ab31a2867a37,", - "slider-histogram-range.font.tick-label.lg": "S:75881336da46200a6fe2fb621be4114f82e4af64,", - "slider-histogram-range.font.tick-label.light": "S:70c1eab41ae51d36b9a4f1139cca4a5e8ffda7ee,", - "slider-histogram-range.font.tick-label.md": "S:321b3921a87236af39a5eab697791ce58540a2d3,", - "slider-histogram-range.font.tick-label.sm": "S:b45e1eb5227a0c01f4ef32c5bb9fb4a897280c93,", - "slider-histogram-range.handle.background.dark": "S:8986d2d861230b1d089a1f78acf689f32ca4adf8,", - "slider-histogram-range.handle.background.light": "S:e6e2e5b15dd33811956ce50738845177a358c190,", - "slider-histogram-range.handle.border.dark": "S:608332e50040d3a5e11a5442b64d2490009407da,", - "slider-histogram-range.handle.border.light": "S:a364bef85b39bd118cabfb5a30f1b5d5ab99933b,", - "slider-histogram-range.tick.active.background.dark": "S:3ca4d5d91b0827f03e490af079643013549b1c26,", - "slider-histogram-range.tick.active.background.light": "S:902b50699d209d3f66203ab521c49b188a937c9e,", - "slider-histogram-range.tick.active.border.dark": "S:793c02b992a588b7257ad4f2e5174860ce6aa273,", - "slider-histogram-range.tick.active.border.light": "S:bf31a3b3002f7aa2a614bb80616b397e817917c3,", - "slider-histogram-range.tick.default.background.dark": "S:3163d4f685ffaf66ba7312108f7c3f5ebcd6abe4,", - "slider-histogram-range.tick.default.background.light": "S:95b44713d590b4da728346454dda8b0f0044d39c,", - "slider-histogram-range.tick.default.border.dark": "S:ca8cad0b4caa27cc39c26f95d48812469bb38b78,", - "slider-histogram-range.tick.default.border.light": "S:0b443dc8447adf96b6a42f5b49413fd2049e6471,", - "slider-histogram.active-end.background.dark": "S:42a2ced53672247a20f98edb87562a99a5aca41d,", - "slider-histogram.active-end.background.light": "S:8d8d3af5d1021f90b1327dc018d5dd21e6c43693,", - "slider-histogram.area.active.background.dark": "S:91077d887efcf9f4b14ad27f16be3585dc657cdf,", - "slider-histogram.area.active.background.light": "S:c89c4d11164ed977c2c0e97abe8f82386ac87c7f,", - "slider-histogram.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "slider-histogram.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "slider-histogram.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "slider-histogram.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "slider-histogram.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "slider-histogram.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "slider-histogram.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "slider-histogram.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "slider-histogram.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "slider-histogram.font.tick-label.dark": "S:b91db31036b50c78584bddf19f36ab31a2867a37,", - "slider-histogram.font.tick-label.lg": "S:75881336da46200a6fe2fb621be4114f82e4af64,", - "slider-histogram.font.tick-label.light": "S:70c1eab41ae51d36b9a4f1139cca4a5e8ffda7ee,", - "slider-histogram.font.tick-label.md": "S:321b3921a87236af39a5eab697791ce58540a2d3,", - "slider-histogram.font.tick-label.sm": "S:b45e1eb5227a0c01f4ef32c5bb9fb4a897280c93,", - "slider-histogram.handle.background.dark": "S:8986d2d861230b1d089a1f78acf689f32ca4adf8,", - "slider-histogram.handle.background.light": "S:e6e2e5b15dd33811956ce50738845177a358c190,", - "slider-histogram.handle.border.dark": "S:608332e50040d3a5e11a5442b64d2490009407da,", - "slider-histogram.handle.border.light": "S:a364bef85b39bd118cabfb5a30f1b5d5ab99933b,", - "slider-histogram.tick.active.background.dark": "S:3ca4d5d91b0827f03e490af079643013549b1c26,", - "slider-histogram.tick.active.background.light": "S:902b50699d209d3f66203ab521c49b188a937c9e,", - "slider-histogram.tick.active.border.dark": "S:793c02b992a588b7257ad4f2e5174860ce6aa273,", - "slider-histogram.tick.active.border.light": "S:bf31a3b3002f7aa2a614bb80616b397e817917c3,", - "slider-histogram.tick.default.background.dark": "S:3163d4f685ffaf66ba7312108f7c3f5ebcd6abe4,", - "slider-histogram.tick.default.background.light": "S:95b44713d590b4da728346454dda8b0f0044d39c,", - "slider-histogram.tick.default.border.dark": "S:ca8cad0b4caa27cc39c26f95d48812469bb38b78,", - "slider-histogram.tick.default.border.light": "S:0b443dc8447adf96b6a42f5b49413fd2049e6471,", - "slider-range.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "slider-range.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "slider-range.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "slider-range.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "slider-range.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "slider-range.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "slider-range.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "slider-range.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "slider-range.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "slider-range.font.tick-label.dark": "S:b91db31036b50c78584bddf19f36ab31a2867a37,", - "slider-range.font.tick-label.lg": "S:75881336da46200a6fe2fb621be4114f82e4af64,", - "slider-range.font.tick-label.light": "S:70c1eab41ae51d36b9a4f1139cca4a5e8ffda7ee,", - "slider-range.font.tick-label.md": "S:321b3921a87236af39a5eab697791ce58540a2d3,", - "slider-range.font.tick-label.sm": "S:b45e1eb5227a0c01f4ef32c5bb9fb4a897280c93,", - "slider-range.handle.background.dark": "S:8986d2d861230b1d089a1f78acf689f32ca4adf8,", - "slider-range.handle.background.light": "S:e6e2e5b15dd33811956ce50738845177a358c190,", - "slider-range.handle.border.dark": "S:608332e50040d3a5e11a5442b64d2490009407da,", - "slider-range.handle.border.light": "S:a364bef85b39bd118cabfb5a30f1b5d5ab99933b,", - "slider-range.tick.active.background.dark": "S:3ca4d5d91b0827f03e490af079643013549b1c26,", - "slider-range.tick.active.background.light": "S:902b50699d209d3f66203ab521c49b188a937c9e,", - "slider-range.tick.active.border.dark": "S:793c02b992a588b7257ad4f2e5174860ce6aa273,", - "slider-range.tick.active.border.light": "S:bf31a3b3002f7aa2a614bb80616b397e817917c3,", - "slider-range.tick.default.background.dark": "S:3163d4f685ffaf66ba7312108f7c3f5ebcd6abe4,", - "slider-range.tick.default.background.light": "S:95b44713d590b4da728346454dda8b0f0044d39c,", - "slider-range.tick.default.border.dark": "S:ca8cad0b4caa27cc39c26f95d48812469bb38b78,", - "slider-range.tick.default.border.light": "S:0b443dc8447adf96b6a42f5b49413fd2049e6471,", - "slider.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "slider.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "slider.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "slider.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "slider.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "slider.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "slider.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "slider.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "slider.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "slider.font.tick-label.dark": "S:b91db31036b50c78584bddf19f36ab31a2867a37,", - "slider.font.tick-label.lg": "S:75881336da46200a6fe2fb621be4114f82e4af64,", - "slider.font.tick-label.light": "S:70c1eab41ae51d36b9a4f1139cca4a5e8ffda7ee,", - "slider.font.tick-label.md": "S:321b3921a87236af39a5eab697791ce58540a2d3,", - "slider.font.tick-label.sm": "S:b45e1eb5227a0c01f4ef32c5bb9fb4a897280c93,", - "slider.handle.background.dark": "S:8986d2d861230b1d089a1f78acf689f32ca4adf8,", - "slider.handle.background.light": "S:e6e2e5b15dd33811956ce50738845177a358c190,", - "slider.handle.border.dark": "S:608332e50040d3a5e11a5442b64d2490009407da,", - "slider.handle.border.light": "S:a364bef85b39bd118cabfb5a30f1b5d5ab99933b,", - "slider.tick.active.background.dark": "S:3ca4d5d91b0827f03e490af079643013549b1c26,", - "slider.tick.active.background.light": "S:902b50699d209d3f66203ab521c49b188a937c9e,", - "slider.tick.active.border.dark": "S:793c02b992a588b7257ad4f2e5174860ce6aa273,", - "slider.tick.active.border.light": "S:bf31a3b3002f7aa2a614bb80616b397e817917c3,", - "slider.tick.default.background.dark": "S:3163d4f685ffaf66ba7312108f7c3f5ebcd6abe4,", - "slider.tick.default.background.light": "S:95b44713d590b4da728346454dda8b0f0044d39c,", - "slider.tick.default.border.dark": "S:ca8cad0b4caa27cc39c26f95d48812469bb38b78,", - "slider.tick.default.border.light": "S:0b443dc8447adf96b6a42f5b49413fd2049e6471,", - "split-button.background.brand.outline-fill.dark": "S:8678a0fbc3f714e32748570133a83196b950ed2f,", - "split-button.background.brand.outline-fill.light": "S:356e6d14763585871bd53c4cc2ec99d47b6b1bd1,", - "split-button.background.brand.solid.dark": "S:c4f155329acd3fa825039e112cd4ea09fb3ea4a3,", - "split-button.background.brand.solid.light": "S:dd9bb7dad71d92ee3c7cc2026d03ab89f2a9691b,", - "split-button.background.danger.outline-fill.dark": "S:f51cf28d983ce6ce1fb55283c8f6b4128453aadd,", - "split-button.background.danger.outline-fill.light": "S:8535b8d82c005d8f58aba23f89947bce3df1802a,", - "split-button.background.danger.solid.dark": "S:e27adfeb093144a23d471200ac2cffce91ab700c,", - "split-button.background.danger.solid.light": "S:13047564e6421aa299765a9d27307c185f65f175,", - "split-button.background.inverse.outline-fill.dark": "S:6a767312e3fd02e644b2c0ae16e3b21b7745d499,", - "split-button.background.inverse.outline-fill.light": "S:df3c70fb6bfc73acd17ab2112b9274c4cbb507f1,", - "split-button.background.inverse.solid.dark": "S:ab5f338c53c3aeffa576ca66a6bc96e6f829e8c3,", - "split-button.background.inverse.solid.light": "S:ff4c2b0cfc2189392cf61c2a7b3a8c11cd22731a,", - "split-button.background.neutral.outline-fill.dark": "S:5e6ef27842035bb11d8d51a3ef3690aa65e061d7,", - "split-button.background.neutral.outline-fill.light": "S:a5f704a03dc74e1d0850303d7c0f7ab3c61c1137,", - "split-button.background.neutral.solid.dark": "S:5179f1ca6dd4eef2586d0fd1010dd65b5f144bdb,", - "split-button.background.neutral.solid.light": "S:ac255c63a366d9fbb483dc43240b43953c87fdbd,", - "split-button.border.brand.outline-fill.dark": "S:8cf9a289bd0941513d5c87b9f56f08dca0e706d5,", - "split-button.border.brand.outline-fill.light": "S:62c0774ad6ce9511677ac96bc26b27aa20c0f764,", - "split-button.border.brand.outline.dark": "S:1206b15553941f23d821e3ac2e2356e86733333c,", - "split-button.border.brand.outline.light": "S:5942ca53e46c9c4d7505a40a90b90a8ae3c87afa,", - "split-button.border.danger.outline-fill.dark": "S:877a5834cefc4549d1e853b6cdb36fa19e4cd8df,", - "split-button.border.danger.outline-fill.light": "S:98f004dc58d8984e13da424d8533268a6a76bfbe,", - "split-button.border.danger.outline.dark": "S:34e2d7edfe99cdb6833425e7d33f7269e801bd35,", - "split-button.border.danger.outline.light": "S:dac592a30b402672ee19c38cee360264a7823546,", - "split-button.border.inverse.outline-fill.dark": "S:4884ebb6c0dee956a73b02ede0064c95fb82aa2e,", - "split-button.border.inverse.outline-fill.light": "S:7bbc07ccb6c8f25e37398a0da56cc813e98fc1be,", - "split-button.border.inverse.outline.dark": "S:0f0f21f139a36b68f9c46a82a4f3a0d871225328,", - "split-button.border.inverse.outline.light": "S:75364b4f0c001e011435396de3da6507780ce7d2,", - "split-button.border.neutral.outline-fill.dark": "S:23b1a1778fd5e6e9781957e4482f70aa15e5882a,", - "split-button.border.neutral.outline-fill.light": "S:497264411bb2a951c9800e7c97d3f075243ef249,", - "split-button.border.neutral.outline.dark": "S:e31fa7bb3960cdf35f11e1a4f512773f5504100b,", - "split-button.border.neutral.outline.light": "S:17b18a49ebbd56a80e8d4f01b445d0e3203788a6,", - "split-button.divider.brand.outline-fill.dark": "S:e0361488773a28bde3a43e62be9c915182875306,", - "split-button.divider.brand.outline-fill.light": "S:09abf747e710b5189b9d5af8efdb236965e6d2b0,", - "split-button.divider.brand.outline.dark": "S:7ca95385d3cd6c3ca0d7b3ccc310c85278d604ed,", - "split-button.divider.brand.outline.light": "S:ae414b1b2e1500191e28a3a35a78a0b2d5021c90,", - "split-button.divider.brand.solid.dark": "S:040643b017550540295e39af834ce0727e36f417,", - "split-button.divider.brand.solid.light": "S:f3907b1e2011db5bc8ba8b32d7c7754fe6a0cf12,", - "split-button.divider.brand.transparent.dark": "S:011a75726685c59fbf16ae6fd2892432fca29be7,", - "split-button.divider.brand.transparent.light": "S:004ebd42468b602354cd292b48a24f09a1018c12,", - "split-button.divider.danger.outline-fill.dark": "S:657b2c4cce0fef37165e77b114c0b08409ade3d1,", - "split-button.divider.danger.outline-fill.light": "S:6a586971d32ff0064f4a35b7145b308f567111f6,", - "split-button.divider.danger.outline.dark": "S:b880746cb4e5cf8e14c98770516cf322933ea0a1,", - "split-button.divider.danger.outline.light": "S:8e4cf698f01e40e81435f2e61670627c40ad385e,", - "split-button.divider.danger.solid.dark": "S:4e3d4364749947d861d81914749b1d3b4c14903e,", - "split-button.divider.danger.solid.light": "S:7326ee571ba5b45ef2f5341103dcc6ca4f55f20d,", - "split-button.divider.danger.transparent.dark": "S:e94b635ad1bbf73c275ab9de227839fb290871a0,", - "split-button.divider.danger.transparent.light": "S:d0590600df31d1b53d4b0e989dc49efd1920ad1e,", - "split-button.divider.inverse.outline-fill.dark": "S:9688a5c1b2ad5999da192aaec45a351b0f61f39a,", - "split-button.divider.inverse.outline-fill.light": "S:68d0d54f9077da4ed71eea134ad69991c5aaadc4,", - "split-button.divider.inverse.outline.dark": "S:e29086325428f3768ae9b3d8032ed138b540678b,", - "split-button.divider.inverse.outline.light": "S:7d2abc11aa11557bcad0b7159a3b985bf7404c7a,", - "split-button.divider.inverse.solid.dark": "S:f9e5f06c0f90df05499ff6434746b6d0526dea76,", - "split-button.divider.inverse.solid.light": "S:faf949f46b9e98d76d764c162c84e7bf3c805a87,", - "split-button.divider.inverse.transparent.dark": "S:73e30ccc276621b7c5cbeee15af9059ef6493b3f,", - "split-button.divider.inverse.transparent.light": "S:0494750a4ce6c87ba5342bda04dfe3e1b2386731,", - "split-button.divider.neutral.outline-fill.dark": "S:5dcceed203792587cd24998549207702559d0aea,", - "split-button.divider.neutral.outline-fill.light": "S:9064dd0f28564e0d1f06da3fcf24064d1367330e,", - "split-button.divider.neutral.outline.dark": "S:005eb1c4d9a870d9fa7325a7717b83b8aab81cd2,", - "split-button.divider.neutral.outline.light": "S:361671e08751c062c80ff7acd1a9662961d7c2b6,", - "split-button.divider.neutral.solid.dark": "S:868fd537733d832e99361df22c7105babc381c74,", - "split-button.divider.neutral.solid.light": "S:d5d34078e8f8dce2d1074fe937570512618640e2,", - "split-button.divider.neutral.transparent.dark": "S:edc8287cffd2b3249f8fdf66b3426058c2eb464c,", - "split-button.divider.neutral.transparent.light": "S:f071a60687f9e060f9c0b71d3a6e0efe789a630e,", - "split-button.font.brand.outline-fill.dark": "S:bd21ca35dd933333ff1195ce9261c8e9b937dfb6,", - "split-button.font.brand.outline-fill.light": "S:1ac84c8153029c94ad049b3b0a9234752e7be855,", - "split-button.font.brand.outline.dark": "S:7beb60e35440fb45e91d24d8acc14db5b1533bb4,", - "split-button.font.brand.outline.light": "S:a929ca685859c1fc5e7faf543728b2edf3b5f243,", - "split-button.font.brand.solid.dark": "S:a7d2d81dd38360910fafa4f7d85e7f9ccff2854e,", - "split-button.font.brand.solid.light": "S:cc4ae5ba632fc1f1f626de4003c05f1475c97d27,", - "split-button.font.brand.transparent.dark": "S:8d19dd77778ab4642015721ce060bd7ec15f240d,", - "split-button.font.brand.transparent.light": "S:74cfdb55361a2fcfdf0e79657b1aa9b3e6cffb8c,", - "split-button.font.danger.outline-fill.dark": "S:291f34d6da9c98d93b53e6faf6903ba6254d6ead,", - "split-button.font.danger.outline-fill.light": "S:d1bb8ed5b65f5526859bba88478a173fb9b929a1,", - "split-button.font.danger.outline.dark": "S:9d611a3ad95a4e7c417d38dcf707aa9dfd4b1da8,", - "split-button.font.danger.outline.light": "S:9cfd1204a77cb867927a91597db7211a001d3a04,", - "split-button.font.danger.solid.dark": "S:af37ecd8e0d2d65aadb14bd7f27474bbee270090,", - "split-button.font.danger.solid.light": "S:a74731efcc3b80aa28448ab0cc896555bb5946b8,", - "split-button.font.danger.transparent.dark": "S:957fbc6785acc68533d73f89c39099f0da9feaf9,", - "split-button.font.danger.transparent.light": "S:6399b4fb7079f55df8a107aa677eacad644890c9,", - "split-button.font.inverse.outline-fill.dark": "S:2ecfcc01e33580567c857f84b7d7880c9c41858e,", - "split-button.font.inverse.outline-fill.light": "S:946d988291e67a18d0114e09820ab2bbaad35053,", - "split-button.font.inverse.outline.dark": "S:a58a68dd030763cd3b979f3c9c8b53d55cb9904b,", - "split-button.font.inverse.outline.light": "S:625d9574b0882315179cfc86548ed6471b4d016a,", - "split-button.font.inverse.solid.dark": "S:85c8df8e3095d7b2e3e114ed3637c5b567be8e74,", - "split-button.font.inverse.solid.light": "S:e023d71593c86f4ce2c05402cd3d40fc88a24d8f,", - "split-button.font.inverse.transparent.dark": "S:c22b36e585444176b35d2985759be4ab13f7912f,", - "split-button.font.inverse.transparent.light": "S:57697b05e86e28fec3897f4cd70e8d71cd10ca9b,", - "split-button.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "split-button.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "split-button.font.neutral.outline-fill.dark": "S:cd76dcc766ec224f3e0563f17332c3e13f25903f,", - "split-button.font.neutral.outline-fill.light": "S:b92ab0d0e3a31703d61022c2ede0a5edea6114f5,", - "split-button.font.neutral.outline.dark": "S:c7418479a6a19078629d08ff0d250434dd7aa6d8,", - "split-button.font.neutral.outline.light": "S:8f1c1a86e08810a6cc0ce7394e4c8ddf6cf7cb4d,", - "split-button.font.neutral.solid.dark": "S:ab0615f4be9ee2817309ead97d443aadf7f272a2,", - "split-button.font.neutral.solid.light": "S:a0df0d493da446b8af65957433ff02c707e549ad,", - "split-button.font.neutral.transparent.dark": "S:1a2ab9b9fdc12ddf69da58e4784f878a6c75fc66,", - "split-button.font.neutral.transparent.light": "S:3d2e4e2536be873c087f6b6181332bf2ce825c42,", - "split-button.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "split-button.icon.brand.outline-fill.dark": "S:083dd5348633198897381a0fc0ba1224dce419d0,", - "split-button.icon.brand.outline-fill.light": "S:e713b7f99bff9042ca39f672fabc26a7305a886a,", - "split-button.icon.brand.outline.dark": "S:6a8c3b2e8887bf20eab6a4f1e3ae0ed577ec662b,", - "split-button.icon.brand.outline.light": "S:96930a17711f286e1a97b8b7ca57a1c37431a621,", - "split-button.icon.brand.solid.dark": "S:4e7221865a6c6c3bd38f20c5ef2a5a54d866d4e8,", - "split-button.icon.brand.solid.light": "S:9e6ac3dff1682871052485faa0369d63529bf5b1,", - "split-button.icon.brand.transparent.dark": "S:33667181ea79a9be22a25c217678cd18dd0018a4,", - "split-button.icon.brand.transparent.light": "S:e76ac2dd6b78f85c7892ae2f30e58e8325587168,", - "split-button.icon.danger.outline-fill.dark": "S:0d52275009dd4db5be4f0ab8e588c913ab512b49,", - "split-button.icon.danger.outline-fill.light": "S:ab4adf7e0da06544e523a77dfd7382f1ce4d0390,", - "split-button.icon.danger.outline.dark": "S:e76fe1930c8f4046e6b691e8bee286135c167bbc,", - "split-button.icon.danger.outline.light": "S:e8741315e65ba8b3a3a3dfbbb0fc675149171992,", - "split-button.icon.danger.solid.dark": "S:634aa3447ca9018eafa7cb64a09fc740574a7327,", - "split-button.icon.danger.solid.light": "S:554b1ff05e7638a78dade8ba02c2a6e3aa01a697,", - "split-button.icon.danger.transparent.dark": "S:8d62de7a5843dff0cce34c04ac0d780811c1de38,", - "split-button.icon.danger.transparent.light": "S:45534e3054c040a8419218ea56621ad13724ac0d,", - "split-button.icon.inverse.outline-fill.dark": "S:59c9c9e7e1e34467cb8b027c2ba1476dc2ef694d,", - "split-button.icon.inverse.outline-fill.light": "S:dba61c40f9ca399bb1993489375549f236b1615f,", - "split-button.icon.inverse.outline.dark": "S:9137cbda0b1d79a7a6daff11f72580e2a6fda301,", - "split-button.icon.inverse.outline.light": "S:80c8d7dcc226ba8c08f306b5c6729d81de95efb6,", - "split-button.icon.inverse.solid.dark": "S:68fd5cc58df6a5869e4990bcc1340d822cac6196,", - "split-button.icon.inverse.solid.light": "S:e2bc9bd86895330c7839da20e5fec7753ede75b1,", - "split-button.icon.inverse.transparent.dark": "S:8a8366de3e4b5f5ac023b2c703cc641c21a4453b,", - "split-button.icon.inverse.transparent.light": "S:1d9ed9e6c0eca660882d7c5705d97d7eb4455e72,", - "split-button.icon.neutral.outline-fill.dark": "S:7cd5f2e7d3b4064efe22c2a4afbee7a3f66513d1,", - "split-button.icon.neutral.outline-fill.light": "S:e811450c86cf9bbd8e96efad1b6950b0aea24a90,", - "split-button.icon.neutral.outline.dark": "S:1d09040ccbfbdc3f8f89047c3eaab5dc24b7463c,", - "split-button.icon.neutral.outline.light": "S:933927902689b45a97c31f92ab03e1dabfa62bdb,", - "split-button.icon.neutral.solid.dark": "S:24b1e95691f8479f2e9981237c73eff12274680a,", - "split-button.icon.neutral.solid.light": "S:ce7f077ff90a2013df5b1f72fef68b183ded1f2e,", - "split-button.icon.neutral.transparent.dark": "S:060673768cd2545a55330e2a6c2c67e82627bbf2,", - "split-button.icon.neutral.transparent.light": "S:b3eb473ce8edf72285c36f6fb42680395ef7d7c1,", - "stepper-item.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "stepper-item.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "stepper-item.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "stepper-item.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "stepper-item.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "stepper-item.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "stepper-item.border.error.dark": "S:7020352ed69885c054a137ec55107272685b832e,", - "stepper-item.border.error.light": "S:334ffb7849b067fc4e31f80ff89b89961d87dd94,", - "stepper-item.font.context.active.dark": "S:24c588d01dfda605f594684ea3090e1493db2b25,", - "stepper-item.font.context.active.light": "S:46ab1687c1369c4a0c9a40e46f104648bea60a9c,", - "stepper-item.font.context.complete.dark": "S:3a1c4f0a7c7946f28090a8055d680bba4bfa988f,", - "stepper-item.font.context.complete.light": "S:332da58af9bff487a26ccbbdbde4a5c5ee0d4bba,", - "stepper-item.font.context.default.dark": "S:c90b39576e968cfa065778663f73a8c6bd853c74,", - "stepper-item.font.context.default.light": "S:24b28ebd7d47f0e14e3ae7de6441cf47da4e56ed,", - "stepper-item.font.context.error.dark": "S:dd3d49dadf6070de590566ee4913755255d80318,", - "stepper-item.font.context.error.light": "S:a7b82b3be10e9cdc737078f5f28470aa8e220e5c,", - "stepper-item.font.context.lg": "S:a50a4612be56085023ef5aad149ba7b5ba7e4261,", - "stepper-item.font.context.md": "S:755519eba87a336180ceaa2605e11f468c4bfa2d,", - "stepper-item.font.context.sm": "S:da64e75edca6fca30de3e1bb0224f0d71452b4f5,", - "stepper-item.font.description.active.dark": "S:5a4965dc35cdba19cefa3f4e22052abe89ea8722,", - "stepper-item.font.description.active.light": "S:b440a2640643ed554d42000d15fba7521000d877,", - "stepper-item.font.description.complete.dark": "S:98f30ea8b9e815dd36681cf18acdd8a474a44272,", - "stepper-item.font.description.complete.light": "S:a013ceeaefe60b844168f6a523ac006fddf265d4,", - "stepper-item.font.description.default.dark": "S:bb68feb462ab14a8d979d6916bc8f61c7776c153,", - "stepper-item.font.description.default.light": "S:c1f37b5b087232d3d69b2d2343154a494bebf829,", - "stepper-item.font.description.error.dark": "S:321c552c4829bd9ab0ab5412e5dc6723031f3017,", - "stepper-item.font.description.error.light": "S:c02eca656fda2efc2f18e0fa10141e8d804f4bca,", - "stepper-item.font.description.lg": "S:23af9aa67ad9cf7d3bbdec0a84a3a9decaa099a2,", - "stepper-item.font.description.md": "S:2e204d97e7e530c52c455d00cd8e6354b2a81230,", - "stepper-item.font.description.sm": "S:e4ebff926d9e4d2f4b9b20ef895b87979b82bacc,", - "stepper-item.font.heading.active.dark": "S:219c33d16e6f3f2ab8844186171482269d81164d,", - "stepper-item.font.heading.active.light": "S:7599968187e637add83c21f7864eebb5893ee6e7,", - "stepper-item.font.heading.complete.dark": "S:1ee0e61d48ee69dbec6d6fcb04514893febf3b52,", - "stepper-item.font.heading.complete.light": "S:fb92dd236702e411cb7037b3434c8fbe560bf92d,", - "stepper-item.font.heading.default.dark": "S:f175c2a3fe052c485d5ecfee58101ec273441d59,", - "stepper-item.font.heading.default.light": "S:40ce528e19b100251c7b871858873db10af26b9b,", - "stepper-item.font.heading.error.dark": "S:6a23496900d852a45c92ae33a23d16ee193ceb06,", - "stepper-item.font.heading.error.light": "S:437eb6f82fe8c92b38c7bc86c4e5df0612120737,", - "stepper-item.font.heading.lg": "S:26e38b824652312797550c4393b9af9201d16410,", - "stepper-item.font.heading.md": "S:a753ee474e5276d2c3253cbf0c389bb17f0d993d,", - "stepper-item.font.heading.sm": "S:22cd3c704f1ff153a930b1de5482c90d06b68463,", - "stepper-item.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "stepper-item.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "stepper-item.icon.active.dark": "S:2743e683afb346b7f2f568b5545adac658b3be2d,", - "stepper-item.icon.active.light": "S:2b1f2a21fe90450dae8cf2345ca8dbc1a13abe06,", - "stepper-item.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "stepper-item.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "stepper-item.icon.error.dark": "S:e156fd5ba38f1d8b86af0cc31e7c7a7845942e16,", - "stepper-item.icon.error.light": "S:4870f6f31a7bd5c16b5c7f457d0652ce44a45c29,", - "stepper.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "stepper.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "stepper.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "stepper.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "stepper.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "stepper.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "stepper.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "stepper.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "stepper.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "stepper.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "stepper.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "stepper.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "stepper.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "switch.background.checked.dark": "S:cbe1f3df2b63dfcfec9daa27715cd5021382308e,", - "switch.background.checked.light": "S:0ab45ed9bff22a94a58242207f07e8511f3a81f1,", - "switch.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "switch.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "switch.border.checked.dark": "S:3d7742ae7dae69c0768ae5d08d439cbaa2a7b078,", - "switch.border.checked.light": "S:f19b95f1c4240eb67ccce31f43a4a2b909fc9808,", - "switch.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "switch.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "switch.handle.background.checked.dark": "S:0589e976bec8b67f097ba545e5d07e22e765adcb,", - "switch.handle.background.checked.light": "S:cd22cdbfb2b7d5bd9d470aa561e6be2bc2c38dff,", - "switch.handle.background.default.dark": "S:86c4b5b13f25bf62f7d22b82eb3e777cc4949016,", - "switch.handle.background.default.light": "S:746d55ebf4063086d8b02ca467e617f06f2215a0,", - "switch.handle.border.checked.dark": "S:53dd1b99e591b0427a5766fe42f5cdacfe9e3e50,", - "switch.handle.border.checked.light": "S:c436707d0a2bc0922d42ae2b9a5fa6b9d7f3841a,", - "switch.handle.border.default.dark": "S:44c909d394bca66186f97c7b4ff700cdda1b2a21,", - "switch.handle.border.default.light": "S:da3a5b3202820a53a539eecf457e7df62c9ebc9d,", - "tab-title.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "tab-title.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "tab-title.bordered.background.default.dark": "S:13121a0d01e4fb62e4f35a04239e9cfe749cbb07,", - "tab-title.bordered.background.default.light": "S:f6acc31e97b24210b6a778b3972d713a5620aa86,", - "tab-title.bordered.border.dark": "S:0d48699e13a0a4526295bfd5705597f25df40902,", - "tab-title.bordered.border.light": "S:bd54d03400f3a9f97d97d9656f88c7bf5f46dd02,", - "tab-title.font.active.dark": "S:110f5ed1169157e68633b551cddec014c8311332,", - "tab-title.font.active.light": "S:0be948a90930d88d5fa41366c5dfd0eb55b5b7a0,", - "tab-title.font.default.dark": "S:4c5d135c09d35ba6ab69fd50adcc3e6b908c42ec,", - "tab-title.font.default.light": "S:da358d253b4d43ea28103a02475ca67ed10b83e8,", - "tab-title.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "tab-title.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "tab-title.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "tab-title.icon.active.dark": "S:2743e683afb346b7f2f568b5545adac658b3be2d,", - "tab-title.icon.active.light": "S:2b1f2a21fe90450dae8cf2345ca8dbc1a13abe06,", - "tab-title.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "tab-title.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "tabs.border.active.dark": "S:08fcab70ea50e3be85231e7c195fbf97137be7b0,", - "tabs.border.active.light": "S:0145e9638c1af5f66608a9fc48c57d875f179f5d,", - "tabs.bordered.background.default.dark": "S:13121a0d01e4fb62e4f35a04239e9cfe749cbb07,", - "tabs.bordered.background.default.light": "S:f6acc31e97b24210b6a778b3972d713a5620aa86,", - "tabs.bordered.border.dark": "S:0d48699e13a0a4526295bfd5705597f25df40902,", - "tabs.bordered.border.light": "S:bd54d03400f3a9f97d97d9656f88c7bf5f46dd02,", - "tabs.font.active.dark": "S:110f5ed1169157e68633b551cddec014c8311332,", - "tabs.font.active.light": "S:0be948a90930d88d5fa41366c5dfd0eb55b5b7a0,", - "tabs.font.default.dark": "S:4c5d135c09d35ba6ab69fd50adcc3e6b908c42ec,", - "tabs.font.default.light": "S:da358d253b4d43ea28103a02475ca67ed10b83e8,", - "tabs.font.lg": "S:8ed332016edb7a425ae6fb4fea8f5b80a57ca359,", - "tabs.font.md": "S:c602d768d7022f3395aee2c01228a93b72a1350e,", - "tabs.font.sm": "S:50ab9ea96bec50d6263e920d0728510c10ab56ce,", - "tabs.icon.active.dark": "S:2743e683afb346b7f2f568b5545adac658b3be2d,", - "tabs.icon.active.light": "S:2b1f2a21fe90450dae8cf2345ca8dbc1a13abe06,", - "tabs.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "tabs.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "textarea.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "textarea.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "textarea.background.read-only.dark": "S:0000c43edf4cc15f5e1f4f6d7e13a66150411756,", - "textarea.background.read-only.light": "S:243c8697974d0126fc07b83667cd3bbaa77e18ec,", - "textarea.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "textarea.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "textarea.font.chat-limit.dark": "S:14ac320a893a6133618f2c147881beb7caf1d565,", - "textarea.font.chat-limit.lg": "S:e5da8e77c6e39ed414fbd9ae5620564fd78ab3bf,", - "textarea.font.chat-limit.light": "S:d036a96c3e40b11a613c327a3a0a7cae0b72fcde,", - "textarea.font.chat-limit.md": "S:a6aafccb6ad4bfb6e67f2503e562666d7024adf4,", - "textarea.font.chat-limit.sm": "S:715a88be81f03c0539a4573a8095ea899279e87a,", - "textarea.font.label.dark": "S:a136eb68011e64241edb98e0fade045293e72706,", - "textarea.font.label.lg": "S:5b9cb169a215cc4f378b39bace9bdfe8172c795b,", - "textarea.font.label.light": "S:fe3861b31c9dd57205239064aadf1a80b6703ac8,", - "textarea.font.label.md": "S:a243382a253419e32748f2b521ad3b7dc4c92ee9,", - "textarea.font.label.sm": "S:4277138046bc343d9af4eabeb92e979503fddf5a,", - "textarea.font.placeholder-value.dark": "S:00a56443927048dbf61889e2f444a3be8a7dcca8,", - "textarea.font.placeholder-value.lg": "S:d800ab2945d081d97d8ba97d55637b124016c7a8,", - "textarea.font.placeholder-value.light": "S:7581a9df2b32af5cc8520f0ece33aa591b44b133,", - "textarea.font.placeholder-value.md": "S:7d126691c11634f99647bd189efaf77f3afc3ae1,", - "textarea.font.placeholder-value.sm": "S:ce53ca3f40efa58a3361dae9f6d9e3954f59e01f,", - "textarea.font.read-only.lg": "S:9fd7fbc717e4ef24212b4771d793b8e0748e7d1a,", - "textarea.font.read-only.md": "S:af5f5bd329b1dd923e0b98ffeb2460d0bd74da6b,", - "textarea.font.read-only.sm": "S:066c55b1022c43cf815c9ed1870a67f183498b71,", - "textarea.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "textarea.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "tip.background.default.dark": "S:1e065f4788b100aeeaac9b51c1946d19703404e5,", - "tip.background.default.light": "S:17451faade2ebea67ff0e851f135302108fb32be,", - "tip.border.default.dark": "S:4f84e66e8fe4024edb7dfcb97b37e3373e330637,", - "tip.border.default.light": "S:33e373944fd6a0f9808f8d611bad5bca8cd0aec4,", - "tip.font.description.dark": "S:82f969d559027f722de3d4c50d2fb72202a0fc39,", - "tip.font.description.light": "S:756bd2c5199ccad18c6ae14ee52345f24153dfa4,", - "tip.font.description.md": "S:2e204d97e7e530c52c455d00cd8e6354b2a81230,", - "tip.font.heading.dark": "S:4f4e2f3704149243cbc51de2195d62dc933e78d0,", - "tip.font.heading.light": "S:aefd98949c7fdb4df9c74643ca4b9ff1fb7677a1,", - "tip.font.heading.md": "S:a753ee474e5276d2c3253cbf0c389bb17f0d993d,", - "tip.icon.dark": "S:2246d356a1f6f8b9706df17986f8452f8b93916d,", - "tip.icon.light": "S:cf21b60b333287f0d603b638297a61e548f743d6,", - "tooltip.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "tooltip.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "tooltip.font.dark": "S:3427dcdb89a799a51eebad3bfdd6aea5750dc259,", - "tooltip.font.light": "S:86e4720888e2ca215f9531938c20cccc6af0b52b,", - "tooltip.font.standard": "S:d06a201e347559fb01fbd66261b7a3ab8b268fb0,", - "tooltip.foreground.dark": "S:95112821a2e3ab109779fb1b496071bda8f75be2,", - "tooltip.foreground.light": "S:03ddfd3782f4913e4f0cd6191da5b6cf9a6bd2ab,", - "tree-item.border.dark": "S:fa33ba73a117ad370052cae12038283a83aa20a2,", - "tree-item.border.light": "S:f30756a73cf9f3c9d0354d1bd5f7e654240f7611,", - "tree-item.font.children-selected.dark": "S:b607abfaf491569cb3a94468e43250d5eae4d270,", - "tree-item.font.children-selected.light": "S:dfd1a09df6ad5d51d017fb59ebcc0b4ae6396ac3,", - "tree-item.font.default.dark": "S:4c5d135c09d35ba6ab69fd50adcc3e6b908c42ec,", - "tree-item.font.default.lg": "S:94893ba1668f2671af99cbef2e35361cd7d3d60b,", - "tree-item.font.default.light": "S:da358d253b4d43ea28103a02475ca67ed10b83e8,", - "tree-item.font.default.md": "S:dfd9085fe214c3c65b4140511eb8fa5ae2b7d7c6,", - "tree-item.font.default.sm": "S:a8532a7efd916961e051299aba6b625eeab28cd3,", - "tree-item.font.selected.dark": "S:b4e880155c844b1765726290556b2d29d0f08f33,", - "tree-item.font.selected.lg": "S:2f1f90d9c97d65c8c6987300fad024e321bdbc38,", - "tree-item.font.selected.light": "S:3b4cda2c9119457de5ad4a804ffc3a05fd8b19bf,", - "tree-item.font.selected.md": "S:744e56dc530590684c79e51206e6047cc86acbeb,", - "tree-item.font.selected.sm": "S:688d88aa531f806ed7f5472dbd94cb111b282e9a,", - "tree-item.icon.default.dark": "S:3dae607f383e8b2873c999e25876266505675bd5,", - "tree-item.icon.default.light": "S:067ef6b2b2f7841097cd57103f36ae8d9ccfa41e,", - "tree-item.icon.selected.dark": "S:5adbcfb229680d6c9c5722e501a6202edd952b19,", - "tree-item.icon.selected.light": "S:ece20359c4d66506c3bbc5619ee5f4f305878423," - } - } -] diff --git a/packages/calcite-design-tokens/src/brand/dark.json b/packages/calcite-design-tokens/src/brand/dark.json deleted file mode 100644 index 0967ef424bc..00000000000 --- a/packages/calcite-design-tokens/src/brand/dark.json +++ /dev/null @@ -1 +0,0 @@ -{} diff --git a/packages/calcite-design-tokens/src/brand/global.json b/packages/calcite-design-tokens/src/brand/global.json deleted file mode 100644 index 0967ef424bc..00000000000 --- a/packages/calcite-design-tokens/src/brand/global.json +++ /dev/null @@ -1 +0,0 @@ -{} diff --git a/packages/calcite-design-tokens/src/brand/light.json b/packages/calcite-design-tokens/src/brand/light.json deleted file mode 100644 index 22b5d0a4a8d..00000000000 --- a/packages/calcite-design-tokens/src/brand/light.json +++ /dev/null @@ -1,20 +0,0 @@ -{ - "core": { - "font": { - "font-size": { - "6": { - "value": "26px", - "type": "fontSizes" - } - } - } - }, - "breakpoint": { - "width": { - "lg": { - "value": "$core.breakpoint.width.lg", - "type": "sizing" - } - } - } -} diff --git a/packages/calcite-design-tokens/src/calcite/dark.json b/packages/calcite-design-tokens/src/calcite/dark.json deleted file mode 100644 index 164f96dd0f4..00000000000 --- a/packages/calcite-design-tokens/src/calcite/dark.json +++ /dev/null @@ -1,2488 +0,0 @@ -{ - "color": { - "brand": { - "default": { - "value": "$semantic.ui.color.brand.default.dark", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.brand.hover.dark", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.brand.press.dark", - "type": "color" - } - }, - "background": { - "1": { - "value": "$semantic.ui.color.background.dark", - "type": "color" - } - }, - "foreground": { - "1": { - "value": "$semantic.ui.color.foreground.1.dark", - "type": "color" - }, - "2": { - "value": "$semantic.ui.color.foreground.2.dark", - "type": "color" - }, - "3": { - "value": "{semantic.ui.color.foreground.3.dark}", - "type": "color" - } - }, - "text": { - "1": { - "value": "$semantic.ui.color.text.1.dark", - "type": "color" - }, - "2": { - "value": "$semantic.ui.color.text.2.dark", - "type": "color" - }, - "3": { - "value": "$semantic.ui.color.text.3.dark", - "type": "color" - }, - "inverse": { - "value": "$semantic.ui.color.text.inverse.dark", - "type": "color" - }, - "link": { - "value": "$semantic.ui.color.text.link.dark", - "type": "color" - } - }, - "border": { - "1": { - "value": "$semantic.ui.color.border.1.dark", - "type": "color" - }, - "2": { - "value": "$semantic.ui.color.border.2.dark", - "type": "color" - }, - "3": { - "value": "$semantic.ui.color.border.3.dark", - "type": "color" - }, - "input": { - "value": "$semantic.ui.color.border.input.dark", - "type": "color" - } - }, - "info": { - "default": { - "value": "$semantic.ui.color.info.default.dark", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.info.hover.dark", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.info.press.dark", - "type": "color" - } - }, - "success": { - "default": { - "value": "$semantic.ui.color.success.default.dark", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.success.hover.dark", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.success.press.dark", - "type": "color" - } - }, - "warning": { - "default": { - "value": "$semantic.ui.color.warning.default.dark", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.warning.hover.dark", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.warning.press.dark", - "type": "color" - } - }, - "danger": { - "default": { - "value": "$semantic.ui.color.danger.default.dark", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.danger.hover.dark", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.danger.press.dark", - "type": "color" - } - }, - "inverse": { - "default": { - "value": "$semantic.ui.color.inverse.dark", - "type": "color" - } - }, - "component": { - "avatar": { - "font": { - "value": "$avatar.font.dark", - "type": "color" - }, - "icon": { - "value": "$avatar.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$avatar.background.default.dark", - "type": "color" - }, - "red": { - "value": "$avatar.background.red.dark", - "type": "color" - }, - "teal": { - "value": "$avatar.background.teal.dark", - "type": "color" - }, - "blue": { - "value": "$avatar.background.blue.dark", - "type": "color" - }, - "green": { - "value": "$avatar.background.green.dark", - "type": "color" - }, - "yellow": { - "value": "$avatar.background.yellow.dark", - "type": "color" - } - } - }, - "checkbox": { - "font": { - "value": "$checkbox.font.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$checkbox.background.default.dark", - "type": "color" - }, - "selected": { - "value": "$checkbox.background.selected.dark", - "type": "color" - } - }, - "icon": { - "value": "$checkbox.icon.dark", - "type": "color" - }, - "border": { - "value": "$checkbox.border.dark", - "type": "color" - } - }, - "radio": { - "font": { - "value": "$radio.font.dark", - "type": "color" - }, - "background": { - "value": "$radio.background.dark", - "type": "color" - }, - "border": { - "unchecked": { - "value": "$radio.border.unchecked.dark", - "type": "color" - }, - "checked": { - "value": "$radio.border.checked.dark", - "type": "color" - } - } - }, - "chip": { - "font": { - "clear": { - "value": "$chip.font.clear.dark", - "type": "color" - }, - "solid": { - "grey": { - "value": "$chip.font.solid.grey.dark", - "type": "color" - }, - "blue": { - "value": "$chip.font.solid.blue.dark", - "type": "color" - }, - "red": { - "value": "$chip.font.solid.red.dark", - "type": "color" - }, - "yellow": { - "value": "$chip.font.solid.yellow.dark", - "type": "color" - }, - "green": { - "value": "$chip.font.solid.green.dark", - "type": "color" - } - } - }, - "icon": { - "clear": { - "value": "$chip.icon.clear.dark", - "type": "color" - }, - "solid": { - "grey": { - "value": "$chip.icon.solid.grey.dark", - "type": "color" - }, - "blue": { - "value": "$chip.icon.solid.blue.dark", - "type": "color" - }, - "red": { - "value": "$chip.icon.solid.red.dark", - "type": "color" - }, - "yellow": { - "value": "$chip.icon.solid.yellow.dark", - "type": "color" - }, - "green": { - "value": "$chip.icon.solid.green.dark", - "type": "color" - } - } - }, - "closable-icon": { - "value": "$chip.closable-icon.dark", - "type": "color" - }, - "background": { - "solid": { - "grey": { - "value": "$chip.background.solid.grey.dark", - "type": "color" - }, - "blue": { - "value": "$chip.background.solid.blue.dark", - "type": "color" - }, - "red": { - "value": "$chip.background.solid.red.dark", - "type": "color" - }, - "yellow": { - "value": "$chip.background.solid.yellow.dark", - "type": "color" - }, - "green": { - "value": "$chip.background.solid.green.dark", - "type": "color" - } - } - }, - "border": { - "clear": { - "grey": { - "value": "$chip.border.clear.grey.dark", - "type": "color" - }, - "blue": { - "value": "$chip.border.clear.blue.dark", - "type": "color" - }, - "red": { - "value": "$chip.border.clear.red.dark", - "type": "color" - }, - "yellow": { - "value": "$chip.border.clear.yellow.dark", - "type": "color" - }, - "green": { - "value": "$chip.border.clear.green.dark", - "type": "color" - } - } - } - }, - "label": { - "font": { - "value": "$label.font.dark", - "type": "color" - } - }, - "loader": { - "font": { - "value": "$loader.font.dark", - "type": "color" - }, - "default": { - "foreground": { - "value": "$loader.default.foreground.dark", - "type": "color" - } - }, - "inline": { - "foreground": { - "indeterminate": { - "value": "$loader.inline.foreground.indeterminate.dark", - "type": "color" - }, - "determinate": { - "value": "$loader.inline.foreground.determinate.dark", - "type": "color" - } - } - } - }, - "rating": { - "star": { - "background": { - "default": { - "value": "$rating.star.background.default.dark", - "type": "color" - }, - "active": { - "value": "$rating.star.background.active.dark", - "type": "color" - }, - "average": { - "value": "$rating.star.background.average.dark", - "type": "color" - } - } - }, - "chip": { - "count": { - "font": { - "value": "$rating.chip.count.font.dark", - "type": "color" - } - }, - "foreground": { - "value": "$rating.chip.foreground.dark", - "type": "color" - } - } - }, - "tooltip": { - "foreground": { - "value": "$tooltip.foreground.dark", - "type": "color" - }, - "border": { - "value": "$tooltip.border.dark", - "type": "color" - }, - "font": { - "value": "$tooltip.font.dark", - "type": "color" - } - }, - "accordion-item": { - "font": { - "heading": { - "value": "$accordion-item.font.heading.dark", - "type": "color" - }, - "description": { - "value": "$accordion-item.font.description.dark", - "type": "color" - } - }, - "icon": { - "default": { - "value": "$accordion-item.icon.dark", - "type": "color" - }, - "expanded": { - "value": "$accordion-item.icon.expanded.dark", - "type": "color" - } - }, - "background": { - "value": "$accordion-item.background.default.dark", - "type": "color" - }, - "border": { - "value": "$accordion-item.border.dark", - "type": "color" - } - }, - "input-message": { - "font": { - "value": "$input-message.font.dark", - "type": "color" - }, - "icon": { - "idle": { - "value": "$input-message.icon.idle.dark", - "type": "color" - }, - "invalid": { - "value": "$input-message.icon.invalid.dark", - "type": "color" - }, - "valid": { - "value": "$input-message.icon.valid.dark", - "type": "color" - } - } - }, - "alert": { - "font": { - "title": { - "value": "$alert.font.title.dark", - "type": "color" - }, - "message": { - "value": "$alert.font.message.dark", - "type": "color" - } - }, - "background": { - "value": "$alert.background.dark", - "type": "color" - }, - "border": { - "value": "$alert.border.dark", - "type": "color" - }, - "icon": { - "blue": { - "value": "$alert.icon.blue.dark", - "type": "color" - }, - "green": { - "value": "$alert.icon.green.dark", - "type": "color" - }, - "yellow": { - "value": "$alert.icon.yellow.dark", - "type": "color" - }, - "red": { - "value": "$alert.icon.red.dark", - "type": "color" - } - }, - "highlight": { - "blue": { - "value": "$alert.icon.blue.dark", - "type": "color" - }, - "green": { - "value": "$alert.icon.green.dark", - "type": "color" - }, - "yellow": { - "value": "$alert.icon.yellow.dark", - "type": "color" - }, - "red": { - "value": "$alert.icon.red.dark", - "type": "color" - } - } - }, - "color-picker": { - "font": { - "label": { - "value": "$color-picker.font.label.dark", - "type": "color" - } - }, - "icon": { - "value": "$color-picker.icon.dark", - "type": "color" - }, - "border": { - "value": "$color-picker.border.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$color-picker.background.default.dark", - "type": "color" - } - } - }, - "date-picker": { - "font": { - "date": { - "value": "$date-picker.font.date.dark", - "type": "color" - }, - "day": { - "value": "$date-picker.font.day.dark", - "type": "color" - }, - "month": { - "value": "$date-picker.font.month.dark", - "type": "color" - }, - "range": { - "date": { - "value": "$date-picker.font.range.date.dark", - "type": "color" - } - }, - "selected": { - "date": { - "value": "$date-picker.font.selected.date.dark", - "type": "color" - } - }, - "active": { - "date": { - "value": "$date-picker.font.active.date.dark", - "type": "color" - } - } - }, - "icon": { - "value": "$date-picker.icon.dark", - "type": "color" - }, - "border": { - "value": "$date-picker.border.dark", - "type": "color" - }, - "date": { - "active": { - "border": { - "value": "$date-picker.date.active.border.dark", - "type": "color" - } - } - }, - "background": { - "default": { - "value": "$date-picker.background.default.dark", - "type": "color" - }, - "date": { - "range": { - "value": "$date-picker.background.date.range.dark", - "type": "color" - }, - "active": { - "value": "$date-picker.background.date.active.dark", - "type": "color" - } - } - } - }, - "input-date-picker": { - "font": { - "placeholder-value": { - "value": "$input-date-picker.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-date-picker.font.label.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-date-picker.icon.dark", - "type": "color" - }, - "border": { - "value": "$input-date-picker.border.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-date-picker.background.default.dark", - "type": "color" - }, - "arrow": { - "value": "$input-date-picker.background.arrow.dark", - "type": "color" - }, - "read-only": { - "value": "$input-date-picker.background.read-only.dark", - "type": "color" - } - } - }, - "input-datetime-local": { - "font": { - "placeholder-value": { - "value": "$input-datetime-local.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-datetime-local.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-datetime-local.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-datetime-local.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-datetime-local.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-datetime-local.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-datetime-local.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-datetime-local.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-datetime-local.border.invalid.dark", - "type": "color" - } - } - }, - "input-email": { - "font": { - "placeholder-value": { - "value": "$input-email.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-email.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-email.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-email.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-email.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-email.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-email.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-email.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-email.border.invalid.dark", - "type": "color" - } - } - }, - "input-file": { - "font": { - "placeholder-value": { - "value": "$input-file.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-file.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-file.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-file.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-file.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-file.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-file.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-file.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-file.border.invalid.dark", - "type": "color" - } - } - }, - "input-month": { - "font": { - "placeholder-value": { - "value": "$input-month.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-month.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-month.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-month.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-month.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-month.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-month.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-month.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-month.border.invalid.dark", - "type": "color" - } - } - }, - "input-number": { - "font": { - "placeholder-value": { - "value": "$input-number.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-number.font.label.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-number.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-number.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-number.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-number.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-number.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-number.border.invalid.dark", - "type": "color" - } - } - }, - "input-password": { - "font": { - "placeholder-value": { - "value": "$input-password.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-password.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-password.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-password.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-password.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-password.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-password.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-password.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-password.border.invalid.dark", - "type": "color" - } - } - }, - "input-search": { - "font": { - "placeholder-value": { - "value": "$input-search.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-search.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-search.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-search.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-search.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-search.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-search.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-search.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-search.border.invalid.dark", - "type": "color" - } - } - }, - "input-telephone": { - "font": { - "placeholder-value": { - "value": "$input-telephone.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-telephone.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-telephone.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-telephone.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-telephone.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-telephone.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-telephone.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-telephone.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-telephone.border.invalid.dark", - "type": "color" - } - } - }, - "input-text": { - "font": { - "placeholder-value": { - "value": "$input-text.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-text.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-text.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-text.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-text.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-text.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-text.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-text.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-text.border.invalid.dark", - "type": "color" - } - } - }, - "input-week": { - "font": { - "placeholder-value": { - "value": "$input-week.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$input-week.font.label.dark", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-week.font.prefix-suffix.dark", - "type": "color" - } - }, - "icon": { - "value": "$input-week.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$input-week.background.default.dark", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-week.background.prefix-suffix.dark", - "type": "color" - }, - "read-only": { - "value": "$input-week.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-week.border.default.dark", - "type": "color" - }, - "invalid": { - "value": "$input-week.border.invalid.dark", - "type": "color" - } - } - }, - "textarea": { - "font": { - "placeholder-value": { - "value": "$textarea.font.placeholder-value.dark", - "type": "color" - }, - "label": { - "value": "$textarea.font.label.dark", - "type": "color" - }, - "chat-limit": { - "value": "$textarea.font.chat-limit.dark", - "type": "color" - } - }, - "icon": { - "value": "$textarea.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$textarea.background.default.dark", - "type": "color" - }, - "read-only": { - "value": "$textarea.background.read-only.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$textarea.border.dark", - "type": "color" - } - } - }, - "tab-title": { - "font": { - "default": { - "value": "$tab-title.font.default.dark", - "type": "color" - }, - "active": { - "value": "$tab-title.font.active.dark", - "type": "color" - } - }, - "icon": { - "default": { - "value": "$tab-title.icon.default.dark", - "type": "color" - }, - "active": { - "value": "$tab-title.icon.active.dark", - "type": "color" - } - }, - "bordered": { - "border": { - "value": "$tab-title.bordered.border.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$tab-title.bordered.background.default.dark", - "type": "color" - } - } - }, - "border": { - "active": { - "value": "$tab-title.border.active.dark", - "type": "color" - } - } - }, - "tabs": { - "bordered": { - "border": { - "value": "$tabs.bordered.border.dark", - "type": "color" - }, - "background": { - "value": "$tabs.bordered.background.default.dark", - "type": "color" - } - } - }, - "card": { - "font": { - "title": { - "value": "$card.font.title.dark", - "type": "color" - }, - "subtitle": { - "value": "$card.font.subtitle.dark", - "type": "color" - }, - "description": { - "value": "$card.font.description.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$card.border.default.dark", - "type": "color" - }, - "active": { - "value": "$card.border.active.dark", - "type": "color" - } - }, - "background": { - "default": { - "value": "$card.background.default.dark", - "type": "color" - } - } - }, - "action": { - "indicator": { - "value": "$action.indicator.dark", - "type": "color" - }, - "font": { - "value": "$action.font.default.dark", - "type": "color" - }, - "icon": { - "value": "$action.icon.dark", - "type": "color" - }, - "background": { - "default": { - "value": "$action.background.default.dark", - "type": "color" - }, - "active": { - "value": "$action.background.active.dark", - "type": "color" - } - } - }, - "action-bar": { - "border": { - "value": "$action-bar.border.dark", - "type": "color" - }, - "background": { - "value": "$action-bar.background.dark", - "type": "color" - } - }, - "action-pad": { - "border": { - "value": "$action-pad.border.dark", - "type": "color" - }, - "background": { - "value": "$action-pad.background.dark", - "type": "color" - } - }, - "action-bar-grid": { - "border": { - "value": "$action-bar-grid.border.dark", - "type": "color" - }, - "background": { - "value": "$action-bar-grid.background.dark", - "type": "color" - } - }, - "action-pad-grid": { - "border": { - "value": "$action-pad-grid.border.dark", - "type": "color" - }, - "background": { - "value": "$action-pad-grid.background.dark", - "type": "color" - } - }, - "block": { - "font": { - "heading": { - "value": "$block.font.heading.dark", - "type": "color" - }, - "description": { - "value": "$block.font.description.dark", - "type": "color" - }, - "content": { - "value": "$block.font.content.dark", - "type": "color" - } - }, - "icon": { - "default": { - "value": "$action.icon.dark", - "type": "color" - }, - "active": { - "value": "$action.icon.active.dark", - "type": "color" - }, - "idle": { - "value": "$block.icon.idle.dark", - "type": "color" - }, - "valid": { - "value": "$block.icon.valid.dark", - "type": "color" - }, - "invalid": { - "value": "$block.icon.invalid.dark", - "type": "color" - }, - "drag-handle": { - "value": "$block.icon.drag-handle.dark", - "type": "color" - }, - "chevron": { - "value": "$block.icon.chevron.dark", - "type": "color" - } - }, - "loader": { - "value": "$action.loader-icon.dark", - "type": "color" - }, - "border": { - "value": "$block.border.light", - "type": "color" - }, - "background": { - "value": "$block.background.dark", - "type": "color" - } - }, - "block-section": { - "font": { - "value": "$block-section.font.dark", - "type": "color" - }, - "icon": { - "valid": { - "value": "$block-section.icon.valid.dark", - "type": "color" - }, - "invalid": { - "value": "$block-section.icon.invalid.dark", - "type": "color" - }, - "chevron": { - "value": "$block-section.icon.chevron.dark", - "type": "color" - } - }, - "background": { - "value": "$block-section.background.dark", - "type": "color" - } - }, - "notice": { - "font": { - "title": { - "value": "$notice.font.title.dark", - "type": "color" - }, - "message": { - "value": "$notice.font.message.dark", - "type": "color" - } - }, - "background": { - "value": "$notice.background.dark", - "type": "color" - }, - "icon": { - "info": { - "value": "$notice.icon.info.dark", - "type": "color" - }, - "success": { - "value": "$notice.icon.success.dark", - "type": "color" - }, - "warning": { - "value": "$notice.icon.warning.dark", - "type": "color" - }, - "danger": { - "value": "$notice.icon.danger.dark", - "type": "color" - }, - "brand": { - "value": "$notice.icon.brand.dark", - "type": "color" - } - }, - "highlight": { - "info": { - "value": "$notice.highlight.info.dark", - "type": "color" - }, - "success": { - "value": "$notice.highlight.success.dark", - "type": "color" - }, - "warning": { - "value": "$notice.highlight.warning.dark", - "type": "color" - }, - "danger": { - "value": "$notice.highlight.danger.dark", - "type": "color" - }, - "brand": { - "value": "$notice.highlight.brand.dark", - "type": "color" - } - } - }, - "modal": { - "font": { - "header": { - "value": "$modal.font.header.dark", - "type": "color" - }, - "content": { - "value": "$modal.font.content.dark", - "type": "color" - } - }, - "icon": { - "value": "$modal.icon.dark", - "type": "color" - }, - "border": { - "default": { - "value": "$modal.border.default.dark", - "type": "color" - }, - "top": { - "brand": { - "value": "$modal.border.top.brand.dark", - "type": "color" - }, - "info": { - "value": "$modal.border.top.info.dark", - "type": "color" - }, - "success": { - "value": "$modal.border.top.success.dark", - "type": "color" - }, - "danger": { - "value": "$modal.border.top.danger.dark", - "type": "color" - }, - "warning": { - "value": "$modal.border.top.warning.dark", - "type": "color" - } - } - }, - "background": { - "value": "$modal.background.dark", - "type": "color" - } - }, - "panel-header": { - "font": { - "value": "$panel-header.font.dark", - "type": "color" - }, - "icon": { - "value": "$panel-header.icon.dark", - "type": "color" - }, - "border": { - "value": "$panel-header.border.dark", - "type": "color" - }, - "background": { - "value": "$panel-header.background.dark", - "type": "color" - } - }, - "popover": { - "font": { - "value": "$popover.font.dark", - "type": "color" - }, - "icon": { - "value": "$popover.icon.dark", - "type": "color" - }, - "border": { - "value": "$popover.border.dark", - "type": "color" - }, - "background": { - "value": "$popover.background.dark", - "type": "color" - } - }, - "slider": { - "font": { - "label": { - "value": "$slider.font.label.dark", - "type": "color" - }, - "tick-label": { - "value": "$slider.font.tick-label.dark", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider.handle.background.dark", - "type": "color" - }, - "border": { - "value": "$slider.handle.border.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider.border.default.dark", - "type": "color" - }, - "active": { - "value": "$slider.border.active.dark", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider.tick.default.background.dark", - "type": "color" - }, - "border": { - "value": "$slider.tick.default.border.dark", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider.tick.active.background.dark", - "type": "color" - }, - "border": { - "value": "$slider.tick.active.border.dark", - "type": "color" - } - } - } - }, - "slider-range": { - "font": { - "label": { - "value": "$slider-range.font.label.dark", - "type": "color" - }, - "tick-label": { - "value": "$slider-range.font.tick-label.dark", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider-range.handle.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-range.handle.border.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider-range.border.default.dark", - "type": "color" - }, - "active": { - "value": "$slider-range.border.active.dark", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider-range.tick.default.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-range.tick.default.border.dark", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider-range.tick.active.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-range.tick.active.border.dark", - "type": "color" - } - } - } - }, - "slider-histogram": { - "font": { - "label": { - "value": "$slider-histogram.font.label.dark", - "type": "color" - }, - "tick-label": { - "value": "$slider-histogram.font.tick-label.dark", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider-histogram.handle.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-histogram.handle.border.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider-histogram.border.default.dark", - "type": "color" - }, - "active": { - "value": "$slider-histogram.border.active.dark", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider-histogram.tick.default.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-histogram.tick.default.border.dark", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider-histogram.tick.active.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-histogram.tick.active.border.dark", - "type": "color" - } - } - }, - "area": { - "active": { - "background": { - "value": "$slider-histogram.area.active.background.dark", - "type": "color" - } - } - }, - "active-end": { - "background": { - "dark": { - "value": "$slider-histogram.active-end.background.dark", - "type": "color" - } - } - } - }, - "slider-histogram-range": { - "font": { - "label": { - "value": "$slider-histogram-range.font.label.dark", - "type": "color" - }, - "tick-label": { - "value": "$slider-histogram-range.font.tick-label.dark", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider-histogram-range.handle.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-histogram-range.handle.border.dark", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider-histogram-range.border.default.dark", - "type": "color" - }, - "active": { - "value": "$slider-histogram-range.border.active.dark", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider-histogram-range.tick.default.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-histogram-range.tick.default.border.dark", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider-histogram-range.tick.active.background.dark", - "type": "color" - }, - "border": { - "value": "$slider-histogram-range.tick.active.border.dark", - "type": "color" - } - } - }, - "area": { - "active": { - "background": { - "value": "$slider-histogram-range.area.active.background.dark", - "type": "color" - } - } - }, - "active-end": { - "background": { - "value": "$slider-histogram.active-end.background.dark", - "type": "color" - } - } - }, - "filter": { - "font": { - "value": "$filter.font.dark", - "type": "color" - }, - "icon": { - "value": "$filter.icon.dark", - "type": "color" - }, - "border": { - "value": "$filter.border.dark", - "type": "color" - }, - "background": { - "value": "$filter.background.dark", - "type": "color" - } - }, - "scrim": { - "background": { - "value": "$scrim.background.dark", - "type": "color" - } - }, - "tip-manager": { - "font": { - "heading": { - "value": "$tip-manager.font.heading.dark", - "type": "color" - } - }, - "icon": { - "value": "$tip-manager.icon.dark", - "type": "color" - }, - "background": { - "default": { - "light": { - "value": "$tip-manager.background.default.dark", - "type": "color" - } - } - }, - "border": { - "default": { - "value": "$tip-manager.border.default.dark", - "type": "color" - } - } - }, - "button": { - "font": { - "brand": { - "solid": { - "value": "$button.font.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.font.brand.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.font.brand.transparent.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$button.font.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.font.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.font.inverse.transparent.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$button.font.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.font.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.font.inverse.transparent.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$button.font.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.font.danger.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.font.danger.transparent.dark", - "type": "color" - } - } - }, - "icon": { - "brand": { - "solid": { - "value": "$button.icon.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.icon.brand.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.icon.brand.transparent.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$button.icon.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.icon.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.icon.inverse.transparent.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$button.icon.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.icon.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.icon.inverse.transparent.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$button.icon.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.icon.danger.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$button.icon.danger.transparent.dark", - "type": "color" - } - } - }, - "background": { - "brand": { - "solid": { - "value": "$button.background.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.brand.outline-fill.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$button.background.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.inverse.outline-fill.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$button.background.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.inverse.outline-fill.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$button.background.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.danger.outline-fill.dark", - "type": "color" - } - } - }, - "border": { - "brand": { - "outline-fill": { - "value": "$button.border.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.border.brand.outline.dark", - "type": "color" - } - }, - "inverse": { - "outline-fill": { - "value": "$button.border.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.border.inverse.outline.dark", - "type": "color" - } - }, - "neutral": { - "outline-fill": { - "value": "$button.border.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.border.inverse.outline.dark", - "type": "color" - } - }, - "danger": { - "outline-fill": { - "value": "$button.border.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$button.border.danger.outline.dark", - "type": "color" - } - } - } - }, - "split-button": { - "font": { - "brand": { - "solid": { - "value": "$split-button.font.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.font.brand.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.brand.transparent.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.font.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.font.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.inverse.transparent.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.font.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.inverse.transparent.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.font.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.font.danger.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.danger.transparent.dark", - "type": "color" - } - } - }, - "icon": { - "brand": { - "solid": { - "value": "$split-button.icon.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.brand.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.brand.transparent.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.icon.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.inverse.transparent.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.icon.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.inverse.transparent.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.icon.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.danger.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.danger.transparent.dark", - "type": "color" - } - } - }, - "background": { - "brand": { - "solid": { - "value": "$split-button.background.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.brand.outline-fill.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.background.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.inverse.outline-fill.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.background.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.inverse.outline-fill.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.background.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.danger.outline-fill.dark", - "type": "color" - } - } - }, - "border": { - "brand": { - "outline-fill": { - "value": "$split-button.border.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.border.brand.outline.dark", - "type": "color" - } - }, - "inverse": { - "outline-fill": { - "value": "$split-button.border.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.border.inverse.outline.dark", - "type": "color" - } - }, - "neutral": { - "outline-fill": { - "value": "$button.border.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.border.inverse.outline.dark", - "type": "color" - } - }, - "danger": { - "outline-fill": { - "value": "$split-button.border.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.border.danger.outline.dark", - "type": "color" - } - } - }, - "divider": { - "brand": { - "solid": { - "value": "$split-button.divider.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.brand.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.brand.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.brand.transparent.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.divider.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.inverse.transparent.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.divider.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.inverse.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.inverse.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.inverse.transparent.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.divider.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.danger.outline-fill.dark", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.danger.outline.dark", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.danger.transparent.dark", - "type": "color" - } - } - } - }, - "fab": { - "font": { - "brand": { - "solid": { - "value": "$fab.font.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.brand.outline-fill.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$fab.font.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.inverse.outline-fill.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$fab.font.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.inverse.outline-fill.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$fab.font.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.danger.outline-fill.dark", - "type": "color" - } - } - }, - "icon": { - "brand": { - "solid": { - "value": "$fab.icon.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.brand.outline-fill.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$fab.icon.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.inverse.outline-fill.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$fab.icon.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.inverse.outline-fill.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$fab.icon.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.danger.outline-fill.dark", - "type": "color" - } - } - }, - "background": { - "brand": { - "solid": { - "value": "$fab.background.brand.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.brand.outline-fill.dark", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$fab.background.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.inverse.outline-fill.dark", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$fab.background.inverse.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.inverse.outline-fill.dark", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$fab.background.danger.solid.dark", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.danger.outline-fill.dark", - "type": "color" - } - } - }, - "border": { - "brand": { - "outline-fill": { - "value": "$fab.border.brand.outline-fill.dark", - "type": "color" - }, - "solid": { - "value": "$fab.border.brand.solid.dark", - "type": "color" - } - }, - "inverse": { - "outline-fill": { - "value": "$fab.border.inverse.outline-fill.dark", - "type": "color" - }, - "solid": { - "value": "$fab.border.inverse.solid.dark", - "type": "color" - } - }, - "neutral": { - "outline-fill": { - "value": "$fab.border.inverse.outline-fill.dark", - "type": "color" - }, - "solid": { - "value": "$fab.border.inverse.solid.dark", - "type": "color" - } - }, - "danger": { - "outline-fill": { - "value": "$fab.border.danger.outline-fill.dark", - "type": "color" - }, - "solid": { - "value": "$fab.border.danger.solid.dark", - "type": "color" - } - } - } - } - } - } -} diff --git a/packages/calcite-design-tokens/src/calcite/light.json b/packages/calcite-design-tokens/src/calcite/light.json deleted file mode 100644 index 53b7281e71a..00000000000 --- a/packages/calcite-design-tokens/src/calcite/light.json +++ /dev/null @@ -1,2508 +0,0 @@ -{ - "color": { - "brand": { - "default": { - "value": "$semantic.ui.color.brand.default.light", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.brand.hover.light", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.brand.press.light", - "type": "color" - } - }, - "background": { - "value": "$semantic.ui.color.background.light", - "type": "color" - }, - "foreground": { - "1": { - "value": "$semantic.ui.color.foreground.1.light", - "type": "color" - }, - "2": { - "value": "$semantic.ui.color.foreground.2.light", - "type": "color" - }, - "3": { - "value": "{semantic.ui.color.foreground.3.light}", - "type": "color" - } - }, - "text": { - "1": { - "value": "$semantic.ui.color.text.1.light", - "type": "color" - }, - "2": { - "value": "$semantic.ui.color.text.2.light", - "type": "color" - }, - "3": { - "value": "$semantic.ui.color.text.3.light", - "type": "color" - }, - "inverse": { - "value": "$semantic.ui.color.text.inverse.light", - "type": "color" - }, - "link": { - "value": "$semantic.ui.color.text.link.light", - "type": "color" - } - }, - "border": { - "1": { - "value": "$semantic.ui.color.border.1.light", - "type": "color" - }, - "2": { - "value": "$semantic.ui.color.border.2.light", - "type": "color" - }, - "3": { - "value": "$semantic.ui.color.border.3.light", - "type": "color" - }, - "input": { - "value": "$semantic.ui.color.border.input.light", - "type": "color" - } - }, - "info": { - "default": { - "value": "$semantic.ui.color.info.default.light", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.info.hover.light", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.info.press.light", - "type": "color" - } - }, - "success": { - "default": { - "value": "$semantic.ui.color.success.default.light", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.success.hover.light", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.success.press.light", - "type": "color" - } - }, - "warning": { - "default": { - "value": "$semantic.ui.color.warning.default.light", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.warning.hover.light", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.warning.press.light", - "type": "color" - } - }, - "danger": { - "default": { - "value": "$semantic.ui.color.danger.default.light", - "type": "color" - }, - "hover": { - "value": "$semantic.ui.color.danger.hover.light", - "type": "color" - }, - "press": { - "value": "$semantic.ui.color.danger.press.light", - "type": "color" - } - }, - "inverse": { - "default": { - "value": "$semantic.ui.color.inverse.light", - "type": "color" - } - }, - "component": { - "avatar": { - "font": { - "value": "$avatar.font.light", - "type": "color" - }, - "icon": { - "value": "$avatar.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$avatar.background.default.light", - "type": "color" - }, - "red": { - "value": "$avatar.background.red.light", - "type": "color" - }, - "teal": { - "value": "$avatar.background.teal.light", - "type": "color" - }, - "blue": { - "value": "$avatar.background.blue.light", - "type": "color" - }, - "green": { - "value": "$avatar.background.green.light", - "type": "color" - }, - "yellow": { - "value": "$avatar.background.yellow.light", - "type": "color" - } - } - }, - "checkbox": { - "font": { - "value": "$checkbox.font.light", - "type": "color" - }, - "background": { - "default": { - "value": "$checkbox.background.default.light", - "type": "color" - }, - "selected": { - "value": "$checkbox.background.selected.light", - "type": "color" - } - }, - "icon": { - "value": "$checkbox.icon.light", - "type": "color" - }, - "border": { - "value": "$checkbox.border.light", - "type": "color" - } - }, - "radio": { - "font": { - "value": "$radio.font.light", - "type": "color" - }, - "background": { - "value": "$radio.background.light", - "type": "color" - }, - "border": { - "unchecked": { - "value": "$radio.border.unchecked.light", - "type": "color" - }, - "checked": { - "value": "$radio.border.checked.light", - "type": "color" - } - } - }, - "chip": { - "font": { - "clear": { - "value": "$chip.font.clear.light", - "type": "color" - }, - "solid": { - "grey": { - "value": "$chip.font.solid.grey.light", - "type": "color" - }, - "blue": { - "value": "$chip.font.solid.blue.light", - "type": "color" - }, - "red": { - "value": "$chip.font.solid.red.light", - "type": "color" - }, - "yellow": { - "value": "$chip.font.solid.yellow.light", - "type": "color" - }, - "green": { - "value": "$chip.font.solid.green.light", - "type": "color" - } - } - }, - "icon": { - "clear": { - "value": "$chip.icon.clear.light", - "type": "color" - }, - "solid": { - "grey": { - "value": "$chip.icon.solid.grey.light", - "type": "color" - }, - "blue": { - "value": "$chip.icon.solid.blue.light", - "type": "color" - }, - "red": { - "value": "$chip.icon.solid.red.light", - "type": "color" - }, - "yellow": { - "value": "$chip.icon.solid.yellow.light", - "type": "color" - }, - "green": { - "value": "$chip.icon.solid.green.light", - "type": "color" - } - } - }, - "closable-icon": { - "value": "$chip.closable-icon.light", - "type": "color" - }, - "background": { - "solid": { - "grey": { - "value": "$chip.background.solid.grey.light", - "type": "color" - }, - "blue": { - "value": "$chip.background.solid.blue.light", - "type": "color" - }, - "red": { - "value": "$chip.background.solid.red.light", - "type": "color" - }, - "yellow": { - "value": "$chip.background.solid.yellow.light", - "type": "color" - }, - "green": { - "value": "$chip.background.solid.green.light", - "type": "color" - } - } - }, - "border": { - "clear": { - "grey": { - "value": "$chip.border.clear.grey.light", - "type": "color" - }, - "blue": { - "value": "$chip.border.clear.blue.light", - "type": "color" - }, - "red": { - "value": "$chip.border.clear.red.light", - "type": "color" - }, - "yellow": { - "value": "$chip.border.clear.yellow.light", - "type": "color" - }, - "green": { - "value": "$chip.border.clear.green.light", - "type": "color" - } - } - } - }, - "label": { - "font": { - "value": "$label.font.light", - "type": "color" - } - }, - "loader": { - "font": { - "value": "$loader.font.light", - "type": "color" - }, - "default": { - "foreground": { - "value": "$loader.default.foreground.light", - "type": "color" - } - }, - "inline": { - "foreground": { - "indeterminate": { - "value": "$loader.inline.foreground.indeterminate.light", - "type": "color" - }, - "determinate": { - "value": "$loader.inline.foreground.determinate.light", - "type": "color" - } - } - } - }, - "rating": { - "star": { - "background": { - "default": { - "value": "$rating.star.background.default.light", - "type": "color" - }, - "active": { - "value": "$rating.star.background.active.light", - "type": "color" - }, - "average": { - "value": "$rating.star.background.average.light", - "type": "color" - } - } - }, - "chip": { - "count": { - "font": { - "value": "$rating.chip.count.font.light", - "type": "color" - } - }, - "foreground": { - "value": "$rating.chip.foreground.light", - "type": "color" - } - } - }, - "tooltip": { - "foreground": { - "value": "$tooltip.foreground.light", - "type": "color" - }, - "border": { - "value": "$tooltip.border.light", - "type": "color" - }, - "font": { - "value": "$tooltip.font.light", - "type": "color" - } - }, - "accordion-item": { - "font": { - "heading": { - "value": "$accordion-item.font.heading.light", - "type": "color" - }, - "description": { - "value": "$accordion-item.font.description.light", - "type": "color" - } - }, - "icon": { - "default": { - "value": "$accordion-item.icon.light", - "type": "color" - }, - "expanded": { - "value": "$accordion-item.icon.expanded.light", - "type": "color" - } - }, - "background": { - "value": "$accordion-item.background.default.light", - "type": "color" - }, - "border": { - "value": "$accordion-item.border.light", - "type": "color" - } - }, - "input-message": { - "font": { - "value": "$input-message.font.light", - "type": "color" - }, - "icon": { - "idle": { - "value": "$input-message.icon.idle.light", - "type": "color" - }, - "invalid": { - "value": "$input-message.icon.invalid.light", - "type": "color" - }, - "valid": { - "value": "$input-message.icon.valid.light", - "type": "color" - } - } - }, - "alert": { - "font": { - "title": { - "value": "$alert.font.title.light", - "type": "color" - }, - "message": { - "value": "$alert.font.message.light", - "type": "color" - } - }, - "background": { - "value": "$alert.background.light", - "type": "color" - }, - "border": { - "value": "$alert.border.light", - "type": "color" - }, - "icon": { - "blue": { - "value": "$alert.icon.blue.light", - "type": "color" - }, - "green": { - "value": "$alert.icon.green.light", - "type": "color" - }, - "yellow": { - "value": "$alert.icon.yellow.light", - "type": "color" - }, - "red": { - "value": "$alert.icon.red.light", - "type": "color" - } - }, - "highlight": { - "blue": { - "value": "$alert.highlight.blue.light", - "type": "color" - }, - "green": { - "value": "$alert.highlight.green.light", - "type": "color" - }, - "yellow": { - "value": "$alert.highlight.yellow.light", - "type": "color" - }, - "red": { - "value": "$alert.highlight.red.light", - "type": "color" - } - } - }, - "tip": { - "font": { - "heading": { - "value": "$tip.font.heading.light", - "type": "color" - }, - "description": { - "value": "$tip.font.description.light", - "type": "color" - } - }, - "icon": { - "value": "$tip.icon.light", - "type": "color" - }, - "background": { - "default": { - "light": { - "value": "$tip.background.default.light", - "type": "color" - } - } - }, - "border": { - "default": { - "value": "$tip.border.default.light", - "type": "color" - } - } - }, - "color-picker": { - "font": { - "label": { - "value": "$color-picker.font.label.light", - "type": "color" - } - }, - "icon": { - "value": "$color-picker.icon.light", - "type": "color" - }, - "border": { - "value": "$color-picker.border.light", - "type": "color" - }, - "background": { - "default": { - "value": "$color-picker.background.default.light", - "type": "color" - } - } - }, - "date-picker": { - "font": { - "date": { - "value": "$date-picker.font.date.light", - "type": "color" - }, - "range": { - "date": { - "value": "$date-picker.font.range.date.light", - "type": "color" - } - }, - "day": { - "value": "{date-picker.font.day.light}", - "type": "color" - }, - "month": { - "value": "$date-picker.font.month.light", - "type": "color" - }, - "selected": { - "date": { - "value": "$date-picker.font.selected.date.light", - "type": "color" - } - }, - "active": { - "date": { - "value": "$date-picker.font.active.date.light", - "type": "color" - } - } - }, - "icon": { - "value": "$date-picker.icon.light", - "type": "color" - }, - "border": { - "value": "$date-picker.border.light", - "type": "color" - }, - "date": { - "active": { - "border": { - "value": "$date-picker.date.active.border.light", - "type": "color" - } - } - }, - "background": { - "default": { - "value": "$date-picker.background.default.light", - "type": "color" - }, - "date": { - "range": { - "value": "$date-picker.background.date.range.light", - "type": "color" - }, - "active": { - "light": { - "value": "$date-picker.background.date.active.light", - "type": "color" - } - } - } - } - }, - "input-date-picker": { - "font": { - "placeholder-value": { - "value": "$input-date-picker.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-date-picker.font.label.light", - "type": "color" - } - }, - "icon": { - "value": "$input-date-picker.icon.light", - "type": "color" - }, - "border": { - "value": "$input-date-picker.border.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-date-picker.background.default.light", - "type": "color" - }, - "arrow": { - "value": "$input-date-picker.background.arrow.light", - "type": "color" - }, - "read-only": { - "value": "$input-date-picker.background.read-only.light", - "type": "color" - } - } - }, - "input-datetime-local": { - "font": { - "placeholder-value": { - "value": "$input-datetime-local.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-datetime-local.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-datetime-local.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-datetime-local.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-datetime-local.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-datetime-local.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-datetime-local.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-datetime-local.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-datetime-local.border.invalid.light", - "type": "color" - } - } - }, - "input-email": { - "font": { - "placeholder-value": { - "value": "$input-email.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-email.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-email.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-email.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-email.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-email.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-email.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-email.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-email.border.invalid.light", - "type": "color" - } - } - }, - "input-file": { - "font": { - "placeholder-value": { - "value": "$input-file.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-file.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-file.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-file.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-file.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-file.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-file.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-file.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-file.border.invalid.light", - "type": "color" - } - } - }, - "input-month": { - "font": { - "placeholder-value": { - "value": "$input-month.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-month.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-month.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-month.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-month.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-month.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-month.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-month.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-month.border.invalid.light", - "type": "color" - } - } - }, - "input-number": { - "font": { - "placeholder-value": { - "value": "$input-number.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-number.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-number.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-number.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-number.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-number.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-number.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-number.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-number.border.invalid.light", - "type": "color" - } - } - }, - "input-password": { - "font": { - "placeholder-value": { - "value": "$input-password.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-password.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-password.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-password.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-password.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-password.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-password.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-password.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-password.border.invalid.light", - "type": "color" - } - } - }, - "input-search": { - "font": { - "placeholder-value": { - "value": "$input-search.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-search.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-search.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-search.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-search.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-search.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-search.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-search.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-search.border.invalid.light", - "type": "color" - } - } - }, - "input-telephone": { - "font": { - "placeholder-value": { - "value": "$input-telephone.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-telephone.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-telephone.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-telephone.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-telephone.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-telephone.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-telephone.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-telephone.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-telephone.border.invalid.light", - "type": "color" - } - } - }, - "input-text": { - "font": { - "placeholder-value": { - "value": "$input-text.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-text.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-text.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-text.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-text.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-text.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-text.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-text.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-text.border.invalid.light", - "type": "color" - } - } - }, - "input-week": { - "font": { - "placeholder-value": { - "value": "$input-week.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$input-week.font.label.light", - "type": "color" - }, - "prefix-suffix": { - "value": "$input-week.font.prefix-suffix.light", - "type": "color" - } - }, - "icon": { - "value": "$input-week.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$input-week.background.default.light", - "type": "color" - }, - "prefix-sufix": { - "value": "$input-week.background.prefix-suffix.light", - "type": "color" - }, - "read-only": { - "value": "$input-week.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$input-week.border.default.light", - "type": "color" - }, - "invalid": { - "value": "$input-week.border.invalid.light", - "type": "color" - } - } - }, - "textarea": { - "font": { - "placeholder-value": { - "value": "$textarea.font.placeholder-value.light", - "type": "color" - }, - "label": { - "value": "$textarea.font.label.light", - "type": "color" - }, - "chat-limit": { - "value": "$textarea.font.chat-limit.light", - "type": "color" - } - }, - "icon": { - "value": "$textarea.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$textarea.background.default.light", - "type": "color" - }, - "read-only": { - "value": "$textarea.background.read-only.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "{textarea.border.light}", - "type": "color" - } - } - }, - "tab-title": { - "font": { - "default": { - "value": "$tab-title.font.default.light", - "type": "color" - }, - "active": { - "value": "$tab-title.font.active.light", - "type": "color" - } - }, - "icon": { - "default": { - "value": "$tab-title.icon.default.light", - "type": "color" - }, - "active": { - "value": "$tab-title.icon.active.light", - "type": "color" - } - }, - "bordered": { - "border": { - "value": "$tab-title.bordered.border.light", - "type": "color" - }, - "background": { - "default": { - "value": "$tab-title.bordered.background.default.light", - "type": "color" - } - } - }, - "border": { - "active": { - "value": "$tab-title.border.active.light", - "type": "color" - } - } - }, - "tabs": { - "bordered": { - "border": { - "value": "$tabs.bordered.border.light", - "type": "color" - }, - "background": { - "value": "$tabs.bordered.background.default.light", - "type": "color" - } - } - }, - "card": { - "font": { - "title": { - "value": "$card.font.title.light", - "type": "color" - }, - "subtitle": { - "value": "$card.font.subtitle.light", - "type": "color" - }, - "description": { - "value": "$card.font.description.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$card.border.default.light", - "type": "color" - }, - "active": { - "value": "$card.border.active.light", - "type": "color" - } - }, - "background": { - "default": { - "value": "$card.background.default.light", - "type": "color" - } - } - }, - "action": { - "font": { - "value": "$action.font.default.light", - "type": "color" - }, - "icon": { - "value": "$action.icon.light", - "type": "color" - }, - "background": { - "default": { - "value": "$action.background.default.light", - "type": "color" - }, - "active": { - "value": "$action.background.active.light", - "type": "color" - } - } - }, - "action-bar": { - "border": { - "value": "$action-bar.border.light", - "type": "color" - }, - "background": { - "value": "$action-bar.background.light", - "type": "color" - } - }, - "action-pad": { - "border": { - "value": "$action-pad.border.light", - "type": "color" - }, - "background": { - "value": "$action-pad.background.light", - "type": "color" - } - }, - "action-bar-grid": { - "border": { - "value": "$action-bar-grid.border.light", - "type": "color" - }, - "background": { - "value": "$action-bar-grid.background.light", - "type": "color" - } - }, - "action-pad-grid": { - "border": { - "value": "$action-pad-grid.border.light", - "type": "color" - }, - "background": { - "value": "$action-pad-grid.background.light", - "type": "color" - } - }, - "block": { - "font": { - "heading": { - "value": "$block.font.heading.light", - "type": "color" - }, - "active": { - "value": "$action.font.active.light", - "type": "color" - }, - "description": { - "value": "$block.font.description.light", - "type": "color" - }, - "content": { - "value": "$block.font.content.light", - "type": "color" - } - }, - "icon": { - "idle": { - "value": "$block.icon.idle.light", - "type": "color" - }, - "valid": { - "value": "$block.icon.valid.light", - "type": "color" - }, - "invalid": { - "value": "$block.icon.invalid.light", - "type": "color" - }, - "drag-handle": { - "value": "$block.icon.drag-handle.light", - "type": "color" - }, - "chevron": { - "value": "$block.icon.chevron.light", - "type": "color" - } - }, - "border": { - "value": "$block.border.light", - "type": "color" - }, - "background": { - "value": "$block.background.light", - "type": "color" - } - }, - "block-section": { - "font": { - "value": "$block-section.font.light", - "type": "color" - }, - "icon": { - "valid": { - "value": "$block-section.icon.valid.light", - "type": "color" - }, - "invalid": { - "value": "$block-section.icon.invalid.light", - "type": "color" - }, - "chevron": { - "value": "$block-section.icon.chevron.light", - "type": "color" - } - }, - "background": { - "value": "$block-section.background.light", - "type": "color" - } - }, - "notice": { - "font": { - "title": { - "value": "$notice.font.title.light", - "type": "color" - }, - "message": { - "value": "$notice.font.message.light", - "type": "color" - } - }, - "background": { - "value": "$notice.background.light", - "type": "color" - }, - "icon": { - "info": { - "value": "$notice.icon.info.light", - "type": "color" - }, - "success": { - "value": "$notice.icon.success.light", - "type": "color" - }, - "warning": { - "value": "$notice.icon.warning.light", - "type": "color" - }, - "danger": { - "value": "$notice.icon.danger.light", - "type": "color" - }, - "brand": { - "value": "$notice.icon.brand.light", - "type": "color" - } - }, - "highlight": { - "info": { - "value": "$notice.highlight.info.light", - "type": "color" - }, - "success": { - "value": "$notice.highlight.success.light", - "type": "color" - }, - "warning": { - "value": "$notice.highlight.warning.light", - "type": "color" - }, - "danger": { - "value": "$notice.highlight.danger.light", - "type": "color" - }, - "brand": { - "value": "$notice.highlight.brand.light", - "type": "color" - } - } - }, - "modal": { - "font": { - "header": { - "value": "$modal.font.header.light", - "type": "color" - }, - "content": { - "value": "$modal.font.content.light", - "type": "color" - } - }, - "icon": { - "value": "$modal.icon.light", - "type": "color" - }, - "border": { - "default": { - "value": "$modal.border.default.light", - "type": "color" - }, - "top": { - "brand": { - "value": "$modal.border.top.brand.light", - "type": "color" - }, - "info": { - "value": "$modal.border.top.info.light", - "type": "color" - }, - "success": { - "value": "$modal.border.top.success.light", - "type": "color" - }, - "danger": { - "value": "$modal.border.top.danger.light", - "type": "color" - }, - "warning": { - "value": "$modal.border.top.warning.light", - "type": "color" - } - } - }, - "background": { - "value": "$modal.background.light", - "type": "color" - } - }, - "panel-header": { - "font": { - "value": "$panel-header.font.light", - "type": "color" - }, - "icon": { - "value": "$panel-header.icon.light", - "type": "color" - }, - "border": { - "value": "$panel-header.border.light", - "type": "color" - }, - "background": { - "value": "$panel-header.background.light", - "type": "color" - } - }, - "popover": { - "font": { - "value": "$popover.font.light", - "type": "color" - }, - "icon": { - "value": "$popover.icon.light", - "type": "color" - }, - "border": { - "value": "$popover.border.light", - "type": "color" - }, - "background": { - "value": "$popover.background.light", - "type": "color" - } - }, - "slider": { - "font": { - "label": { - "value": "$slider.font.label.light", - "type": "color" - }, - "tick-label": { - "value": "$slider.font.tick-label.light", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider.handle.background.light", - "type": "color" - }, - "border": { - "value": "$slider.handle.border.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider.border.default.light", - "type": "color" - }, - "active": { - "value": "$slider.border.active.light", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider.tick.default.background.light", - "type": "color" - }, - "border": { - "value": "$slider.tick.default.border.light", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider.tick.active.background.light", - "type": "color" - }, - "border": { - "value": "$slider.tick.active.border.light", - "type": "color" - } - } - } - }, - "slider-range": { - "font": { - "label": { - "value": "$slider-range.font.label.light", - "type": "color" - }, - "tick-label": { - "value": "$slider-range.font.tick-label.light", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider-range.handle.background.light", - "type": "color" - }, - "border": { - "value": "$slider-range.handle.border.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider-range.border.default.light", - "type": "color" - }, - "active": { - "value": "$slider-range.border.active.light", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider-range.tick.default.background.light", - "type": "color" - }, - "border": { - "value": "$slider-range.tick.default.border.light", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider-range.tick.active.background.light", - "type": "color" - }, - "border": { - "value": "$slider-range.tick.active.border.light", - "type": "color" - } - } - } - }, - "slider-histogram": { - "font": { - "label": { - "value": "$slider-histogram.font.label.light", - "type": "color" - }, - "tick-label": { - "value": "$slider-histogram.font.tick-label.light", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider-histogram.handle.background.light", - "type": "color" - }, - "border": { - "value": "$slider-histogram.handle.border.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider-histogram.border.default.light", - "type": "color" - }, - "active": { - "value": "$slider-histogram.border.active.light", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider-histogram.tick.default.background.light", - "type": "color" - }, - "border": { - "value": "$slider-histogram.tick.default.border.light", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider-histogram.tick.active.background.light", - "type": "color" - }, - "border": { - "value": "$slider-histogram.tick.active.border.light", - "type": "color" - } - } - }, - "area": { - "active": { - "background": { - "value": "$slider-histogram.area.active.background.light", - "type": "color" - } - } - }, - "active-end": { - "background": { - "value": "$slider-histogram.active-end.background.light", - "type": "color" - } - } - }, - "slider-histogram-range": { - "font": { - "label": { - "value": "$slider-histogram-range.font.label.light", - "type": "color" - }, - "tick-label": { - "value": "$slider-histogram-range.font.tick-label.light", - "type": "color" - } - }, - "handle": { - "background": { - "value": "$slider-histogram-range.handle.background.light", - "type": "color" - }, - "border": { - "value": "$slider-histogram-range.handle.border.light", - "type": "color" - } - }, - "border": { - "default": { - "value": "$slider-histogram-range.border.default.light", - "type": "color" - }, - "active": { - "value": "$slider-histogram-range.border.active.light", - "type": "color" - } - }, - "tick": { - "default": { - "background": { - "value": "$slider-histogram-range.tick.default.background.light", - "type": "color" - }, - "border": { - "value": "$slider-histogram-range.tick.default.border.light", - "type": "color" - } - }, - "active": { - "background": { - "value": "$slider-histogram-range.tick.active.background.light", - "type": "color" - }, - "border": { - "value": "$slider-histogram-range.tick.active.border.light", - "type": "color" - } - } - }, - "area": { - "active": { - "background": { - "value": "$slider-histogram-range.area.active.background.light", - "type": "color" - } - } - }, - "active-end": { - "background": { - "value": "$slider-histogram.active-end.background.light", - "type": "color" - } - } - }, - "filter": { - "font": { - "value": "$filter.font.light", - "type": "color" - }, - "icon": { - "value": "$filter.icon.light", - "type": "color" - }, - "border": { - "value": "$filter.border.light", - "type": "color" - }, - "background": { - "value": "$filter.background.light", - "type": "color" - } - }, - "scrim": { - "background": { - "value": "$scrim.background.light", - "type": "color" - } - }, - "tip-manager": { - "font": { - "heading": { - "value": "$tip-manager.font.heading.light", - "type": "color" - } - }, - "icon": { - "value": "$tip-manager.icon.light", - "type": "color" - }, - "background": { - "default": { - "light": { - "value": "$tip-manager.background.default.light", - "type": "color" - } - } - }, - "border": { - "default": { - "value": "$tip-manager.border.default.light", - "type": "color" - } - } - }, - "button": { - "font": { - "brand": { - "solid": { - "value": "$button.font.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.font.brand.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.font.brand.transparent.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$button.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.font.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.font.inverse.transparent.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$button.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.font.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.font.inverse.transparent.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$button.font.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.font.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.font.danger.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.font.danger.transparent.light", - "type": "color" - } - } - }, - "icon": { - "brand": { - "solid": { - "value": "$button.icon.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.icon.brand.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.icon.brand.transparent.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$button.icon.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.icon.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.icon.inverse.transparent.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$button.icon.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.icon.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.icon.inverse.transparent.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$button.icon.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.icon.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.icon.danger.outline.light", - "type": "color" - }, - "transparent": { - "value": "$button.icon.danger.transparent.light", - "type": "color" - } - } - }, - "background": { - "brand": { - "solid": { - "value": "$button.background.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.brand.outline-fill.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$button.background.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.inverse.outline-fill.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$button.background.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.inverse.outline-fill.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$button.background.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$button.background.danger.outline-fill.light", - "type": "color" - } - } - }, - "border": { - "brand": { - "outline-fill": { - "value": "$button.border.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.border.brand.outline.light", - "type": "color" - } - }, - "inverse": { - "outline-fill": { - "value": "$button.border.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.border.inverse.outline.light", - "type": "color" - } - }, - "neutral": { - "outline-fill": { - "value": "$button.border.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.border.inverse.outline.light", - "type": "color" - } - }, - "danger": { - "outline-fill": { - "value": "$button.border.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$button.border.danger.outline.light", - "type": "color" - } - } - } - }, - "split-button": { - "font": { - "brand": { - "solid": { - "value": "$split-button.font.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.font.brand.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.brand.transparent.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.font.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.inverse.transparent.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.font.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.inverse.transparent.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.font.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.font.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.font.danger.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.font.danger.transparent.light", - "type": "color" - } - } - }, - "icon": { - "brand": { - "solid": { - "value": "$split-button.icon.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.brand.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.brand.transparent.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.icon.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.inverse.transparent.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.icon.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.inverse.transparent.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.icon.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.icon.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.icon.danger.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.icon.danger.transparent.light", - "type": "color" - } - } - }, - "background": { - "brand": { - "solid": { - "value": "$split-button.background.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.brand.outline-fill.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.background.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.inverse.outline-fill.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.background.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.inverse.outline-fill.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.background.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.background.danger.outline-fill.light", - "type": "color" - } - } - }, - "border": { - "brand": { - "outline-fill": { - "value": "$split-button.border.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.border.brand.outline.light", - "type": "color" - } - }, - "inverse": { - "outline-fill": { - "value": "$split-button.border.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.border.inverse.outline.light", - "type": "color" - } - }, - "neutral": { - "outline-fill": { - "value": "$button.border.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.border.inverse.outline.light", - "type": "color" - } - }, - "danger": { - "outline-fill": { - "value": "$split-button.border.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.border.danger.outline.light", - "type": "color" - } - } - }, - "divider": { - "brand": { - "solid": { - "value": "$split-button.divider.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.brand.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.brand.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.brand.transparent.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$split-button.divider.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.inverse.transparent.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$split-button.divider.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.inverse.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.inverse.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.inverse.transparent.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$split-button.divider.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$split-button.divider.danger.outline-fill.light", - "type": "color" - }, - "outline": { - "value": "$split-button.divider.danger.outline.light", - "type": "color" - }, - "transparent": { - "value": "$split-button.divider.danger.transparent.light", - "type": "color" - } - } - } - }, - "fab": { - "font": { - "brand": { - "solid": { - "value": "$fab.font.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.brand.outline-fill.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$fab.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.inverse.outline-fill.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$fab.font.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.inverse.outline-fill.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$fab.font.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.font.danger.outline-fill.light", - "type": "color" - } - } - }, - "icon": { - "brand": { - "solid": { - "value": "$fab.icon.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.brand.outline-fill.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$fab.icon.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.inverse.outline-fill.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$fab.icon.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.inverse.outline-fill.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$fab.icon.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.icon.danger.outline-fill.light", - "type": "color" - } - } - }, - "background": { - "brand": { - "solid": { - "value": "$fab.background.brand.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.brand.outline-fill.light", - "type": "color" - } - }, - "inverse": { - "solid": { - "value": "$fab.background.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.inverse.outline-fill.light", - "type": "color" - } - }, - "neutral": { - "solid": { - "value": "$fab.background.inverse.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.inverse.outline-fill.light", - "type": "color" - } - }, - "danger": { - "solid": { - "value": "$fab.background.danger.solid.light", - "type": "color" - }, - "outline-fill": { - "value": "$fab.background.danger.outline-fill.light", - "type": "color" - } - } - }, - "border": { - "brand": { - "outline-fill": { - "value": "$fab.border.brand.outline-fill.light", - "type": "color" - }, - "solid": { - "value": "$fab.border.brand.solid.light", - "type": "color" - } - }, - "inverse": { - "outline-fill": { - "value": "$fab.border.inverse.outline-fill.light", - "type": "color" - }, - "solid": { - "value": "$fab.border.inverse.solid.light", - "type": "color" - } - }, - "neutral": { - "outline-fill": { - "value": "$fab.border.inverse.outline-fill.light", - "type": "color" - }, - "solid": { - "value": "$fab.border.inverse.solid.light", - "type": "color" - } - }, - "danger": { - "outline-fill": { - "value": "$fab.border.danger.outline-fill.light", - "type": "color" - }, - "solid": { - "value": "$fab.border.danger.solid.light", - "type": "color" - } - } - } - } - } - } -} diff --git a/packages/calcite-design-tokens/src/component/accordion-item.json b/packages/calcite-design-tokens/src/component/accordion-item.json index 85934a35821..3861bfa6fbd 100644 --- a/packages/calcite-design-tokens/src/component/accordion-item.json +++ b/packages/calcite-design-tokens/src/component/accordion-item.json @@ -3,65 +3,65 @@ "font": { "heading": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } }, "description": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "expanded": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -69,26 +69,26 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, @@ -160,11 +160,11 @@ }, "border": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/accordion.json b/packages/calcite-design-tokens/src/component/accordion.json index 29370b6401f..58b260567ba 100644 --- a/packages/calcite-design-tokens/src/component/accordion.json +++ b/packages/calcite-design-tokens/src/component/accordion.json @@ -2,42 +2,42 @@ "accordion": { "heading": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "description": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "icon": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "expanded": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -45,11 +45,11 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -180,11 +180,11 @@ }, "border": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/action-bar-grid.json b/packages/calcite-design-tokens/src/component/action-bar-grid.json index 5322ee46fa7..2724541b77d 100644 --- a/packages/calcite-design-tokens/src/component/action-bar-grid.json +++ b/packages/calcite-design-tokens/src/component/action-bar-grid.json @@ -2,63 +2,63 @@ "action-bar-grid": { "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/action-bar.json b/packages/calcite-design-tokens/src/component/action-bar.json index c8ee0cda60a..6e8ba73f639 100644 --- a/packages/calcite-design-tokens/src/component/action-bar.json +++ b/packages/calcite-design-tokens/src/component/action-bar.json @@ -2,63 +2,63 @@ "action-bar": { "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/action-pad-grid.json b/packages/calcite-design-tokens/src/component/action-pad-grid.json index 6c25daf4a56..1bbb06e0806 100644 --- a/packages/calcite-design-tokens/src/component/action-pad-grid.json +++ b/packages/calcite-design-tokens/src/component/action-pad-grid.json @@ -2,63 +2,63 @@ "action-pad-grid": { "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, diff --git a/packages/calcite-design-tokens/src/component/action-pad.json b/packages/calcite-design-tokens/src/component/action-pad.json index 738d3f29afd..6225d6b6554 100644 --- a/packages/calcite-design-tokens/src/component/action-pad.json +++ b/packages/calcite-design-tokens/src/component/action-pad.json @@ -2,63 +2,63 @@ "action-pad": { "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, diff --git a/packages/calcite-design-tokens/src/component/action.json b/packages/calcite-design-tokens/src/component/action.json index 431ce958e1d..7f9fea6e648 100644 --- a/packages/calcite-design-tokens/src/component/action.json +++ b/packages/calcite-design-tokens/src/component/action.json @@ -2,54 +2,54 @@ "action": { "font": { "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -57,98 +57,98 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" } }, "indicator-size": { "sm": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "sizing" }, "md": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "sizing" }, "lg": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "sizing" } }, "indicator": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "loader-icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/alert.json b/packages/calcite-design-tokens/src/component/alert.json index 6389f65c23c..2dc8636ade7 100644 --- a/packages/calcite-design-tokens/src/component/alert.json +++ b/packages/calcite-design-tokens/src/component/alert.json @@ -3,135 +3,135 @@ "font": { "title": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.1h", + "value": "{semantic.font.default.medium.1h}", "type": "typography" } }, "message": { "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "icon": { "blue": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "green": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "yellow": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } }, "red": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -139,41 +139,41 @@ "highlight": { "blue": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "green": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "yellow": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } }, "red": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/avatar.json b/packages/calcite-design-tokens/src/component/avatar.json index 7fb35dbf070..df999efb2d9 100644 --- a/packages/calcite-design-tokens/src/component/avatar.json +++ b/packages/calcite-design-tokens/src/component/avatar.json @@ -2,137 +2,137 @@ "avatar": { "font": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-3h", + "value": "{semantic.font.default.bold.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "red": { "light": { - "value": "$core.color.palette.high-saturation.red.h-rr-010", + "value": "{core.color.high-saturation.red.h-rr-010}", "type": "color" }, "dark": { - "value": "$core.color.palette.high-saturation.red.h-rr-090", + "value": "{core.color.high-saturation.red.h-rr-090}", "type": "color" } }, "teal": { "light": { - "value": "$core.color.palette.high-saturation.green-blue.h-gb-010", + "value": "{core.color.high-saturation.green-blue.h-gb-010}", "type": "color" }, "dark": { - "value": "$core.color.palette.high-saturation.green-blue.h-gb-090", + "value": "{core.color.high-saturation.green-blue.h-gb-090}", "type": "color" } }, "blue": { "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-010", + "value": "{core.color.high-saturation.blue.h-bb-010}", "type": "color" }, "dark": { - "value": "$core.color.palette.high-saturation.blue.h-bb-090", + "value": "{core.color.high-saturation.blue.h-bb-090}", "type": "color" } }, "green": { "light": { - "value": "$core.color.palette.high-saturation.yellow-green.h-yg-010", + "value": "{core.color.high-saturation.yellow-green.h-yg-010}", "type": "color" }, "dark": { - "value": "$core.color.palette.high-saturation.yellow-green.h-yg-090", + "value": "{core.color.high-saturation.yellow-green.h-yg-090}", "type": "color" } }, "yellow": { "light": { - "value": "$core.color.palette.high-saturation.yellow.h-yy-010", + "value": "{core.color.high-saturation.yellow.h-yy-010}", "type": "color" }, "dark": { - "value": "$core.color.palette.high-saturation.yellow.h-yy-100", + "value": "{core.color.high-saturation.yellow.h-yy-100}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } } diff --git a/packages/calcite-design-tokens/src/component/block-section.json b/packages/calcite-design-tokens/src/component/block-section.json index 9f25113987e..a445fe75fb4 100644 --- a/packages/calcite-design-tokens/src/component/block-section.json +++ b/packages/calcite-design-tokens/src/component/block-section.json @@ -2,42 +2,42 @@ "block-section": { "font": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "md": { - "value": "$semantic.font.wrap.medium.-1", + "value": "{semantic.font.wrap.medium.-1}", "type": "typography" } }, "icon": { "valid": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "chevron": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { @@ -48,29 +48,29 @@ }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "border-radius": { "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "icon-size": { "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, @@ -78,21 +78,21 @@ "block-text": { "right-left": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } }, "block-content": { "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "block-section": { "top-bottom": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } @@ -100,7 +100,7 @@ "icon": { "left": { "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } } @@ -108,7 +108,7 @@ "switch": { "left": { "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -116,7 +116,7 @@ }, "chevron-size": { "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } } diff --git a/packages/calcite-design-tokens/src/component/block.json b/packages/calcite-design-tokens/src/component/block.json index 3276f9e7a70..29ab07ad0ee 100644 --- a/packages/calcite-design-tokens/src/component/block.json +++ b/packages/calcite-design-tokens/src/component/block.json @@ -3,43 +3,43 @@ "font": { "heading": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } }, "description": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" } }, "content": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" } } @@ -47,47 +47,47 @@ "icon": { "idle": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "valid": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "drag-handle": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "chevron": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { @@ -98,45 +98,45 @@ }, "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "border-radius": { "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, @@ -144,13 +144,13 @@ "block": { "top-down-left": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "right": { "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } @@ -158,13 +158,13 @@ "block-content": { "right-left": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "top-down": { "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } } @@ -172,13 +172,13 @@ }, "chevron-size": { "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "drag-size": { "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, @@ -187,7 +187,7 @@ "drag": { "right-left": { "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/button.json b/packages/calcite-design-tokens/src/component/button.json index b5ea778ffd0..0d1f467798a 100644 --- a/packages/calcite-design-tokens/src/component/button.json +++ b/packages/calcite-design-tokens/src/component/button.json @@ -4,95 +4,95 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "sm": { - "value": "$semantic.font.default.bold.-2h", + "value": "{semantic.font.default.bold.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" }, "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -100,41 +100,41 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -142,41 +142,41 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -186,41 +186,41 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -228,41 +228,41 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -270,41 +270,41 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -312,41 +312,41 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -356,21 +356,21 @@ "brand": { "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -378,21 +378,21 @@ "inverse": { "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -400,21 +400,21 @@ "neutral": { "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -422,21 +422,21 @@ "danger": { "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -446,21 +446,21 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -468,21 +468,21 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -490,21 +490,21 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -512,21 +512,21 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -534,115 +534,115 @@ }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "icon-only": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/card.json b/packages/calcite-design-tokens/src/component/card.json index 876fe993bbb..1e77e4cd8b9 100644 --- a/packages/calcite-design-tokens/src/component/card.json +++ b/packages/calcite-design-tokens/src/component/card.json @@ -3,45 +3,45 @@ "font": { "title": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } }, "subtile": { "md": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" } }, "description": { "md": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "subtitle": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } } @@ -49,21 +49,21 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -71,44 +71,44 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "space-around": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "space-between": { "card": { "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "title": { "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } } }, "border-radius": { "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } } diff --git a/packages/calcite-design-tokens/src/component/checkbox.json b/packages/calcite-design-tokens/src/component/checkbox.json index 983b205c5b8..9fb182b314b 100644 --- a/packages/calcite-design-tokens/src/component/checkbox.json +++ b/packages/calcite-design-tokens/src/component/checkbox.json @@ -2,107 +2,107 @@ "checkbox": { "comp-size": { "sm": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "spacing" }, "md": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "lg": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "selected": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "border-radius": { - "value": "$semantic.border.border-radius.sharp", + "value": "{semantic.border.radius.sharp}", "type": "borderRadius" }, "border-width": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "border": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "font": { "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "space-around": { "standard": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/chip.json b/packages/calcite-design-tokens/src/component/chip.json index 5ca4f2fee22..6bff33d7bfb 100644 --- a/packages/calcite-design-tokens/src/component/chip.json +++ b/packages/calcite-design-tokens/src/component/chip.json @@ -3,74 +3,74 @@ "font": { "clear": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "solid": { "grey": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "blue": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "red": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "yellow": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "green": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } } @@ -80,91 +80,91 @@ "solid": { "grey": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "blue": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "red": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "yellow": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "green": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } } }, "clear": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "space-around": { "right": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "left": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } @@ -174,51 +174,51 @@ "solid": { "grey": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "red": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "blue": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "green": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "yellow": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } } @@ -226,52 +226,52 @@ }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "closable-icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -280,51 +280,51 @@ "clear": { "grey": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "red": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "blue": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "green": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "yellow": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } } @@ -332,48 +332,48 @@ }, "space-around": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "border-width": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "text": { "space-around": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/color-picker.json b/packages/calcite-design-tokens/src/component/color-picker.json index eb85ed9490b..c3fdca3ca06 100644 --- a/packages/calcite-design-tokens/src/component/color-picker.json +++ b/packages/calcite-design-tokens/src/component/color-picker.json @@ -3,107 +3,107 @@ "font": { "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "saved-size": { "sm": { - "value": "$core.sizing.8", + "value": "{core.size.default.8}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "swatch-size": { "sm": { - "value": "$core.sizing.8", + "value": "{core.size.default.8}", "type": "sizing" }, "md": { - "value": "$core.sizing.8", + "value": "{core.size.default.8}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "channels": { "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { @@ -118,29 +118,29 @@ }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/combobox.json b/packages/calcite-design-tokens/src/component/combobox.json index 0e85c49cc86..d659e612916 100644 --- a/packages/calcite-design-tokens/src/component/combobox.json +++ b/packages/calcite-design-tokens/src/component/combobox.json @@ -2,149 +2,149 @@ "combobox": { "font": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-3h", + "value": "{semantic.font.default.bold.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.4", + "value": "{core.border.border-width.4}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "lg": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/date-picker.json b/packages/calcite-design-tokens/src/component/date-picker.json index dfec9a09543..2ce33773ae3 100644 --- a/packages/calcite-design-tokens/src/component/date-picker.json +++ b/packages/calcite-design-tokens/src/component/date-picker.json @@ -3,78 +3,78 @@ "font": { "date": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "day": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-2h", + "value": "{semantic.font.default.bold.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-2h", + "value": "{semantic.font.default.bold.-2h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" } }, "month": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.1h", + "value": "{semantic.font.default.medium.1h}", "type": "typography" } }, "range": { "date": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -82,11 +82,11 @@ "selected": { "date": { "light": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" } } @@ -94,11 +94,11 @@ "active": { "date": { "light": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -106,53 +106,53 @@ }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "date": { "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "range": { "light": { - "value": "$semantic.ui.color.foreground.current.light", + "value": "{semantic.ui.color.foreground.current.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.current.dark", + "value": "{semantic.ui.color.foreground.current.dark}", "type": "color" } } @@ -160,87 +160,87 @@ }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "date-row": { "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "md": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "lg": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.0", + "value": "{core.spacing.0}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } } @@ -250,11 +250,11 @@ "active": { "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -262,29 +262,29 @@ "space-around": { "left-right": { "sm": { - "value": "$core.spacing.0", + "value": "{core.spacing.0}", "type": "spacing" }, "md": { - "value": "$core.spacing.0", + "value": "{core.spacing.0}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -293,29 +293,29 @@ "day": { "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -323,29 +323,29 @@ "month": { "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/dropdown-item.json b/packages/calcite-design-tokens/src/component/dropdown-item.json index 15637853b05..21c9da2d0de 100644 --- a/packages/calcite-design-tokens/src/component/dropdown-item.json +++ b/packages/calcite-design-tokens/src/component/dropdown-item.json @@ -3,67 +3,67 @@ "font": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "selected": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "group-title": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-2h", + "value": "{semantic.font.default.bold.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" } } @@ -71,85 +71,85 @@ "icon": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "selected": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "select": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "container": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -158,29 +158,29 @@ "content": { "left": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.0", + "value": "{core.spacing.0}", "type": "spacing" }, "lg": { - "value": "$core.spacing.0", + "value": "{core.spacing.0}", "type": "spacing" } } @@ -189,43 +189,43 @@ "default": { "left": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } @@ -233,43 +233,43 @@ "single": { "left": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.13", + "value": "{core.spacing.13}", "type": "spacing" } }, "right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } @@ -277,43 +277,43 @@ "multi": { "left": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.13", + "value": "{core.spacing.13}", "type": "spacing" } }, "right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } @@ -321,44 +321,44 @@ }, "group-title": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "icon-start": { "left": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } @@ -366,15 +366,15 @@ "icon-end": { "left": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/dropdown.json b/packages/calcite-design-tokens/src/component/dropdown.json index 69073b41b28..84a3b43a2d9 100644 --- a/packages/calcite-design-tokens/src/component/dropdown.json +++ b/packages/calcite-design-tokens/src/component/dropdown.json @@ -3,54 +3,54 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "box-shadow": { "sm": { - "value": "$core.box-shadow.2", + "value": "{core.box-shadow.2}", "type": "boxShadow" }, "md": { - "value": "$core.box-shadow.2", + "value": "{core.box-shadow.2}", "type": "boxShadow" }, "lg": { - "value": "$core.box-shadow.2", + "value": "{core.box-shadow.2}", "type": "boxShadow" } } diff --git a/packages/calcite-design-tokens/src/component/fab.json b/packages/calcite-design-tokens/src/component/fab.json index 0f9b2137e56..fa1fcbeea29 100644 --- a/packages/calcite-design-tokens/src/component/fab.json +++ b/packages/calcite-design-tokens/src/component/fab.json @@ -4,55 +4,55 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -60,21 +60,21 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -82,21 +82,21 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -106,21 +106,21 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -128,21 +128,21 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -150,21 +150,21 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -172,21 +172,21 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -196,21 +196,21 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -218,21 +218,21 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -240,21 +240,21 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } } @@ -262,21 +262,21 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -286,21 +286,21 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -308,21 +308,21 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -330,21 +330,21 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -352,21 +352,21 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -374,114 +374,114 @@ }, "border-radius": { "sm": { - "value": "$core.border.border-radius.full", + "value": "{core.border.border-radius.full}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.full", + "value": "{core.border.border-radius.full}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.full", + "value": "{core.border.border-radius.full}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "icon-only": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/filter.json b/packages/calcite-design-tokens/src/component/filter.json index 972424d84fe..a824c6acca4 100644 --- a/packages/calcite-design-tokens/src/component/filter.json +++ b/packages/calcite-design-tokens/src/component/filter.json @@ -2,139 +2,139 @@ "filter": { "font": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "input": { "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } @@ -143,29 +143,29 @@ "space-around": { "left-right": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/icon.json b/packages/calcite-design-tokens/src/component/icon.json index 7be125904d8..840688eeab6 100644 --- a/packages/calcite-design-tokens/src/component/icon.json +++ b/packages/calcite-design-tokens/src/component/icon.json @@ -1,16 +1,20 @@ { "icon": { + "color": { + "value": "currentColor", + "type": "color" + }, "size": { "sm": { - "value": "{core.sizing.7}", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "{core.sizing.9}", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "{core.sizing.11}", + "value": "{core.size.default.11}", "type": "sizing" } } diff --git a/packages/calcite-design-tokens/src/component/input-date-picker.json b/packages/calcite-design-tokens/src/component/input-date-picker.json index cd09c9aa1b7..98f2c5b163b 100644 --- a/packages/calcite-design-tokens/src/component/input-date-picker.json +++ b/packages/calcite-design-tokens/src/component/input-date-picker.json @@ -3,212 +3,212 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "arrow": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } }, "arrow-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, diff --git a/packages/calcite-design-tokens/src/component/input-datetime-local.json b/packages/calcite-design-tokens/src/component/input-datetime-local.json index 551b2c784ed..aa61fa4a085 100644 --- a/packages/calcite-design-tokens/src/component/input-datetime-local.json +++ b/packages/calcite-design-tokens/src/component/input-datetime-local.json @@ -3,99 +3,99 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -103,117 +103,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-email.json b/packages/calcite-design-tokens/src/component/input-email.json index 7db385cf697..bf02402b974 100644 --- a/packages/calcite-design-tokens/src/component/input-email.json +++ b/packages/calcite-design-tokens/src/component/input-email.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-file.json b/packages/calcite-design-tokens/src/component/input-file.json index 45e66bb131b..9b9f6279cc9 100644 --- a/packages/calcite-design-tokens/src/component/input-file.json +++ b/packages/calcite-design-tokens/src/component/input-file.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-message.json b/packages/calcite-design-tokens/src/component/input-message.json index 3af48dc9ebf..550e723b482 100644 --- a/packages/calcite-design-tokens/src/component/input-message.json +++ b/packages/calcite-design-tokens/src/component/input-message.json @@ -2,69 +2,69 @@ "input-message": { "font": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-3h", + "value": "{semantic.font.default.medium.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } }, "icon": { "idle": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "valid": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } } diff --git a/packages/calcite-design-tokens/src/component/input-month.json b/packages/calcite-design-tokens/src/component/input-month.json index d7ac4c10250..4a3b86ac4ef 100644 --- a/packages/calcite-design-tokens/src/component/input-month.json +++ b/packages/calcite-design-tokens/src/component/input-month.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-number.json b/packages/calcite-design-tokens/src/component/input-number.json index 5e9a74390fe..9b3a04c55f6 100644 --- a/packages/calcite-design-tokens/src/component/input-number.json +++ b/packages/calcite-design-tokens/src/component/input-number.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-password.json b/packages/calcite-design-tokens/src/component/input-password.json index 4cebb82f487..6c6fdab02f7 100644 --- a/packages/calcite-design-tokens/src/component/input-password.json +++ b/packages/calcite-design-tokens/src/component/input-password.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-search.json b/packages/calcite-design-tokens/src/component/input-search.json index aa97e315a20..3c56293ba66 100644 --- a/packages/calcite-design-tokens/src/component/input-search.json +++ b/packages/calcite-design-tokens/src/component/input-search.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-telephone.json b/packages/calcite-design-tokens/src/component/input-telephone.json index 674543b561e..74c77de8956 100644 --- a/packages/calcite-design-tokens/src/component/input-telephone.json +++ b/packages/calcite-design-tokens/src/component/input-telephone.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-text.json b/packages/calcite-design-tokens/src/component/input-text.json index 3dc7bee8df8..c39fc689979 100644 --- a/packages/calcite-design-tokens/src/component/input-text.json +++ b/packages/calcite-design-tokens/src/component/input-text.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/input-week.json b/packages/calcite-design-tokens/src/component/input-week.json index a963ddc9872..c5ff19b8a45 100644 --- a/packages/calcite-design-tokens/src/component/input-week.json +++ b/packages/calcite-design-tokens/src/component/input-week.json @@ -3,113 +3,113 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "prefix-suffix": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "invalid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -117,117 +117,117 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "prefix-suffix": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/label.json b/packages/calcite-design-tokens/src/component/label.json index d92f1356961..f1df0f6abcd 100644 --- a/packages/calcite-design-tokens/src/component/label.json +++ b/packages/calcite-design-tokens/src/component/label.json @@ -2,23 +2,23 @@ "label": { "font": { "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/link.json b/packages/calcite-design-tokens/src/component/link.json index 91504e568a8..181eb03baa6 100644 --- a/packages/calcite-design-tokens/src/component/link.json +++ b/packages/calcite-design-tokens/src/component/link.json @@ -2,41 +2,41 @@ "link": { "font": { "light": { - "value": "$semantic.ui.color.text.link.light", + "value": "{semantic.ui.color.text.link.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.link.dark", + "value": "{semantic.ui.color.text.link.dark}", "type": "color" }, "regular": { - "value": "$semantic.font.wrap.regular.0", + "value": "{semantic.font.wrap.regular.0}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.link.light", + "value": "{semantic.ui.color.text.link.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.link.dark", + "value": "{semantic.ui.color.text.link.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.text.link.light", + "value": "{semantic.ui.color.text.link.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.link.dark", + "value": "{semantic.ui.color.text.link.dark}", "type": "color" } }, "bottom": { "border-width": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } } diff --git a/packages/calcite-design-tokens/src/component/loader.json b/packages/calcite-design-tokens/src/component/loader.json index 8cc68b37918..e8af9ea2de9 100644 --- a/packages/calcite-design-tokens/src/component/loader.json +++ b/packages/calcite-design-tokens/src/component/loader.json @@ -2,28 +2,28 @@ "loader": { "font": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "text": { - "value": "$semantic.font.wrap.regular.-2", + "value": "{semantic.font.wrap.regular.-2}", "type": "typography" }, "value-text": { "sm": { - "value": "$semantic.font.wrap.regular.-2", + "value": "{semantic.font.wrap.regular.-2}", "type": "typography" }, "md": { - "value": "$semantic.font.wrap.regular.0", + "value": "{semantic.font.wrap.regular.0}", "type": "typography" }, "lg": { - "value": "$semantic.font.wrap.regular.2", + "value": "{semantic.font.wrap.regular.2}", "type": "typography" } } @@ -31,31 +31,31 @@ "default": { "comp-size": { "sm": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "md": { - "value": "$core.sizing.17", + "value": "{core.size.default.17}", "type": "sizing" }, "lg": { - "value": "$core.sizing.20", + "value": "{core.size.default.20}", "type": "sizing" } }, "space-between": { "standard": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "foreground": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -63,64 +63,64 @@ "inline": { "comp-size": { "sm": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "foreground": { "indeterminate": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "determinate": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/modal.json b/packages/calcite-design-tokens/src/component/modal.json index 245b209e5f0..bd729bf23a4 100644 --- a/packages/calcite-design-tokens/src/component/modal.json +++ b/packages/calcite-design-tokens/src/component/modal.json @@ -3,215 +3,210 @@ "font": { "header": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.wrap.regular.1", + "value": "{semantic.font.wrap.regular.1}", "type": "typography" }, "md": { - "value": "$semantic.font.wrap.regular.2", + "value": "{semantic.font.wrap.regular.2}", "type": "typography" }, "lg": { - "value": "$semantic.font.wrap.regular.3", + "value": "{semantic.font.wrap.regular.3}", "type": "typography" } }, "content": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.1h", + "value": "{semantic.font.default.regular.1h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "default": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "top": { "brand": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "info": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "success": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "danger": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "warning": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } } } }, "background": { - "light": { - "value": "$semantic.ui.color.foreground.1.light", - "type": "color" - }, - "dark": { - "value": "$semantic.ui.color.foreground.1.dark", - "type": "color" - } + "value": "{semantic.ui.color.foreground.1}", + "type": "color", + "description": "Specifies the background color of content placed in the `content` slot." }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" }, "lg": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" } }, "content": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" } }, "cancel-button": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -219,44 +214,44 @@ "border-width": { "default": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "top": { "sm": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" } }, diff --git a/packages/calcite-design-tokens/src/component/notice.json b/packages/calcite-design-tokens/src/component/notice.json index b281901e9ac..65da380756c 100644 --- a/packages/calcite-design-tokens/src/component/notice.json +++ b/packages/calcite-design-tokens/src/component/notice.json @@ -3,135 +3,135 @@ "font": { "title": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.wrap.medium.-1", + "value": "{semantic.font.wrap.medium.-1}", "type": "typography" }, "md": { - "value": "$semantic.font.wrap.medium.0", + "value": "{semantic.font.wrap.medium.0}", "type": "typography" }, "lg": { - "value": "$semantic.font.wrap.medium.1", + "value": "{semantic.font.wrap.medium.1}", "type": "typography" } }, "message": { "sm": { - "value": "$semantic.font.wrap.regular.-2", + "value": "{semantic.font.wrap.regular.-2}", "type": "typography" }, "md": { - "value": "$semantic.font.wrap.regular.-1", + "value": "{semantic.font.wrap.regular.-1}", "type": "typography" }, "lg": { - "value": "$semantic.font.wrap.regular.0", + "value": "{semantic.font.wrap.regular.0}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "icon": { "info": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "success": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "warning": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } }, "danger": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "brand": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -139,65 +139,65 @@ "highlight": { "info": { "light": { - "value": "$semantic.ui.color.info.default.light", + "value": "{semantic.ui.color.info.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.info.default.dark", + "value": "{semantic.ui.color.info.default.dark}", "type": "color" } }, "success": { "light": { - "value": "$semantic.ui.color.success.default.light", + "value": "{semantic.ui.color.success.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.success.default.dark", + "value": "{semantic.ui.color.success.default.dark}", "type": "color" } }, "warning": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } }, "danger": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "brand": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "border": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } } @@ -205,15 +205,15 @@ "content": { "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -221,43 +221,43 @@ "space-around": { "top-bottom": { "sm": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" }, "md": { - "value": "$core.spacing.6", + "value": "{core.spacing.6}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "left": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" } }, "right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/pagination.json b/packages/calcite-design-tokens/src/component/pagination.json index 84453f3bb27..3413a2c13b8 100644 --- a/packages/calcite-design-tokens/src/component/pagination.json +++ b/packages/calcite-design-tokens/src/component/pagination.json @@ -2,149 +2,149 @@ "pagination": { "font": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-3h", + "value": "{semantic.font.default.bold.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.4", + "value": "{core.border.border-width.4}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "lg": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/panel-header.json b/packages/calcite-design-tokens/src/component/panel-header.json index ecf5ed905ff..8a0ca1d0517 100644 --- a/packages/calcite-design-tokens/src/component/panel-header.json +++ b/packages/calcite-design-tokens/src/component/panel-header.json @@ -2,84 +2,84 @@ "panel-header": { "font": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "heading": { "md": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } }, "description": { "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-width": { "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "space-around": { "left-right": { "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } }, "top-bottom": { "md": { - "value": "$core.spacing.6", + "value": "{core.spacing.6}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/popover.json b/packages/calcite-design-tokens/src/component/popover.json index 4ff8999971f..9338ee045b2 100644 --- a/packages/calcite-design-tokens/src/component/popover.json +++ b/packages/calcite-design-tokens/src/component/popover.json @@ -2,152 +2,152 @@ "popover": { "font": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.wrap.medium.-1", + "value": "{semantic.font.wrap.medium.-1}", "type": "typography" }, "md": { - "value": "$semantic.font.wrap.medium.0", + "value": "{semantic.font.wrap.medium.0}", "type": "typography" }, "lg": { - "value": "$semantic.font.wrap.medium.1", + "value": "{semantic.font.wrap.medium.1}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "pointer-size": { "sm": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" } }, "left-top-bottom": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/radio.json b/packages/calcite-design-tokens/src/component/radio.json index ac338783b8b..755504a1494 100644 --- a/packages/calcite-design-tokens/src/component/radio.json +++ b/packages/calcite-design-tokens/src/component/radio.json @@ -2,62 +2,62 @@ "radio": { "comp-size": { "sm": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "md": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "lg": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border-radius": { - "value": "$semantic.border.border-radius.pill", + "value": "{semantic.border.border-radius.pill}", "type": "borderRadius" }, "border-width": { "unchecked": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "checked": { "sm": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.3", + "value": "{core.border.border-width.3}", "type": "borderWidth" } } @@ -65,58 +65,58 @@ "border": { "unchecked": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "checked": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "font": { "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "space-around": { "sm": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "md": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "spacing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/rating.json b/packages/calcite-design-tokens/src/component/rating.json index f0f5e3674ea..e6529c0bd32 100644 --- a/packages/calcite-design-tokens/src/component/rating.json +++ b/packages/calcite-design-tokens/src/component/rating.json @@ -2,43 +2,43 @@ "rating": { "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "chip": { "border-radius": { - "value": "$semantic.border.border-radius.pill", + "value": "{semantic.border.border-radius.pill}", "type": "borderRadius" }, "value_text": { "font": { "sm": { - "value": "$semantic.font.default.bold.-2h", + "value": "{semantic.font.default.bold.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -47,42 +47,42 @@ "font": { "sm": { "value": { - "typography": "$core.font.font-size.1", - "fontWeights": "$core.font.font-weight.medium-italic" + "typography": "{core.font.size.1}", + "fontWeights": "{core.font.weight.medium-italic}" }, "type": "composition" }, "md": { "value": { - "typography": "$core.font.font-size.2", - "fontWeights": "$core.font.font-weight.medium-italic" + "typography": "{core.font.size.2}", + "fontWeights": "{core.font.weight.medium-italic}" }, "type": "composition" }, "lg": { "value": { - "typography": "$core.font.font-size.3", - "fontWeights": "$core.font.font-weight.medium-italic" + "typography": "{core.font.size.3}", + "fontWeights": "{core.font.weight.medium-italic}" }, "type": "composition" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } } @@ -90,46 +90,46 @@ "star": { "comp-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "average": { "light": { - "value": "$semantic.ui.color.warning.default.light", + "value": "{semantic.ui.color.warning.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.warning.default.dark", + "value": "{semantic.ui.color.warning.default.dark}", "type": "color" } } @@ -138,29 +138,29 @@ "star-container": { "space-between": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "spacing" }, "md": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "lg": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "spacing" }, "md": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "spacing" }, "lg": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "spacing" } } @@ -168,44 +168,44 @@ "average": { "space-between": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "spacing" }, "md": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "lg": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "spacing" } }, "chip": { "space-between": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "spacing" }, "md": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "lg": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "spacing" } }, "space-arround": { "sm": { - "value": "$core.sizing.3", + "value": "{core.size.default.3}", "type": "spacing" }, "md": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "spacing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "spacing" } } @@ -213,29 +213,29 @@ }, "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/scrim.json b/packages/calcite-design-tokens/src/component/scrim.json index 3390ff5ad7c..da7a57f2f8c 100644 --- a/packages/calcite-design-tokens/src/component/scrim.json +++ b/packages/calcite-design-tokens/src/component/scrim.json @@ -2,16 +2,16 @@ "scrim": { "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "opacity": { - "value": "$core.opacity.85", + "value": "{core.opacity.85}", "type": "opacity" } } diff --git a/packages/calcite-design-tokens/src/component/segmented-control.json b/packages/calcite-design-tokens/src/component/segmented-control.json index 95f4854a9fc..59080d1f43b 100644 --- a/packages/calcite-design-tokens/src/component/segmented-control.json +++ b/packages/calcite-design-tokens/src/component/segmented-control.json @@ -3,150 +3,150 @@ "font": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.bold.-3h", + "value": "{semantic.font.default.bold.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" }, "checked": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.4", + "value": "{core.border.border-width.4}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "lg": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/slider-histogram-range.json b/packages/calcite-design-tokens/src/component/slider-histogram-range.json index db2abf55292..9c8667eedbf 100644 --- a/packages/calcite-design-tokens/src/component/slider-histogram-range.json +++ b/packages/calcite-design-tokens/src/component/slider-histogram-range.json @@ -3,45 +3,45 @@ "font": { "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "tick-label": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-3h", + "value": "{semantic.font.default.medium.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } } @@ -49,35 +49,35 @@ "handle": { "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } } @@ -85,21 +85,21 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -107,72 +107,72 @@ "tick-size": { "width": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "md": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "lg": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" } }, "height": { "sm": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "md": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "lg": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" } } }, "handle-size": { "sm": { - "value": "$core.sizing.4", + "value": "{core.size.default.4}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, @@ -180,21 +180,21 @@ "default": { "background": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -202,36 +202,36 @@ "active": { "background": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } } @@ -253,29 +253,29 @@ "active-start-end": { "width": { "sm": { - "value": "$core.sizing.0", + "value": "{core.size.default.0}", "type": "sizing" }, "md": { - "value": "$core.sizing.0", + "value": "{core.size.default.0}", "type": "sizing" }, "lg": { - "value": "$core.sizing.0", + "value": "{core.size.default.0}", "type": "sizing" } }, "height": { "sm": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" }, "md": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" }, "lg": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" } } diff --git a/packages/calcite-design-tokens/src/component/slider-histogram.json b/packages/calcite-design-tokens/src/component/slider-histogram.json index 925f7e77f2d..588c71869f7 100644 --- a/packages/calcite-design-tokens/src/component/slider-histogram.json +++ b/packages/calcite-design-tokens/src/component/slider-histogram.json @@ -3,45 +3,45 @@ "font": { "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "tick-label": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-3h", + "value": "{semantic.font.default.medium.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } } @@ -49,21 +49,21 @@ "handle": { "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -71,108 +71,108 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } }, "tick-size": { "width": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "md": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "lg": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" } }, "height": { "sm": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "md": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "lg": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" } } }, "handle-size": { "sm": { - "value": "$core.sizing.4", + "value": "{core.size.default.4}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, @@ -180,21 +180,21 @@ "default": { "background": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -202,21 +202,21 @@ "active": { "background": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -239,39 +239,39 @@ "active-end": { "width": { "sm": { - "value": "$core.sizing.0", + "value": "{core.size.default.0}", "type": "sizing" }, "md": { - "value": "$core.sizing.0", + "value": "{core.size.default.0}", "type": "sizing" }, "lg": { - "value": "$core.sizing.0", + "value": "{core.size.default.0}", "type": "sizing" } }, "height": { "sm": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" }, "md": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" }, "lg": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" } }, "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/slider-range.json b/packages/calcite-design-tokens/src/component/slider-range.json index 86159ecd864..5c92b19b34a 100644 --- a/packages/calcite-design-tokens/src/component/slider-range.json +++ b/packages/calcite-design-tokens/src/component/slider-range.json @@ -3,45 +3,45 @@ "font": { "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "tick-label": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-3h", + "value": "{semantic.font.default.medium.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } } @@ -49,21 +49,21 @@ "handle": { "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -71,108 +71,108 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } }, "tick-size": { "width": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "md": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "lg": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" } }, "height": { "sm": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "md": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "lg": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" } } }, "handle-size": { "sm": { - "value": "$core.sizing.4", + "value": "{core.size.default.4}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, @@ -180,21 +180,21 @@ "default": { "background": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -202,21 +202,21 @@ "active": { "background": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/slider.json b/packages/calcite-design-tokens/src/component/slider.json index bee96cfa2b7..5fe682ac113 100644 --- a/packages/calcite-design-tokens/src/component/slider.json +++ b/packages/calcite-design-tokens/src/component/slider.json @@ -3,45 +3,45 @@ "font": { "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "tick-label": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-3h", + "value": "{semantic.font.default.medium.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" } } @@ -49,21 +49,21 @@ "handle": { "background": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } } @@ -71,108 +71,108 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } }, "tick-size": { "width": { "sm": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "md": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" }, "lg": { - "value": "$core.sizing.1", + "value": "{core.size.default.1}", "type": "sizing" } }, "height": { "sm": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "md": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" }, "lg": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" } } }, "handle-size": { "sm": { - "value": "$core.sizing.4", + "value": "{core.size.default.4}", "type": "sizing" }, "md": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.2", + "value": "{core.spacing.2}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, @@ -180,21 +180,21 @@ "default": { "background": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -202,21 +202,21 @@ "active": { "background": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/split-button.json b/packages/calcite-design-tokens/src/component/split-button.json index e9140c4af48..8eecc59db8e 100644 --- a/packages/calcite-design-tokens/src/component/split-button.json +++ b/packages/calcite-design-tokens/src/component/split-button.json @@ -4,95 +4,95 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -100,41 +100,41 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -142,41 +142,41 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -186,41 +186,41 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -228,41 +228,41 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.text.inverse.light", + "value": "{semantic.ui.color.text.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.inverse.dark", + "value": "{semantic.ui.color.text.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -270,41 +270,41 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -312,41 +312,41 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -356,21 +356,21 @@ "brand": { "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -378,21 +378,21 @@ "inverse": { "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -400,21 +400,21 @@ "neutral": { "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -422,21 +422,21 @@ "danger": { "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -446,21 +446,21 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -468,21 +468,21 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -490,21 +490,21 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -512,21 +512,21 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -534,71 +534,71 @@ }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, @@ -606,51 +606,51 @@ "content": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } }, "dropdown": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } }, "divider": { "solid": { "top-bottom": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } } @@ -660,41 +660,41 @@ "brand": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -702,41 +702,41 @@ "inverse": { "solid": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.inverse.light", + "value": "{semantic.ui.color.inverse.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.inverse.dark", + "value": "{semantic.ui.color.inverse.dark}", "type": "color" } } @@ -744,41 +744,41 @@ "neutral": { "solid": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.foreground.3.light", + "value": "{semantic.ui.color.foreground.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.3.dark", + "value": "{semantic.ui.color.foreground.3.dark}", "type": "color" } } @@ -786,41 +786,41 @@ "danger": { "solid": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline-fill": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "outline": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } }, "transparent": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/stepper-item.json b/packages/calcite-design-tokens/src/component/stepper-item.json index 00c53b46670..920d64b83bf 100644 --- a/packages/calcite-design-tokens/src/component/stepper-item.json +++ b/packages/calcite-design-tokens/src/component/stepper-item.json @@ -4,162 +4,162 @@ "heading": { "default": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "error": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "complete": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.1h", + "value": "{semantic.font.default.medium.1h}", "type": "typography" } }, "description": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "error": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "complete": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "context": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "error": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } }, "complete": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } } @@ -167,31 +167,31 @@ "icon": { "default": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "error": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -199,31 +199,31 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } }, "error": { "light": { - "value": "$semantic.ui.color.danger.default.light", + "value": "{semantic.ui.color.danger.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.danger.default.dark", + "value": "{semantic.ui.color.danger.default.dark}", "type": "color" } } @@ -231,135 +231,135 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "left": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "right": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" }, "lg": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/stepper.json b/packages/calcite-design-tokens/src/component/stepper.json index f1d30b3cc93..96f427deb94 100644 --- a/packages/calcite-design-tokens/src/component/stepper.json +++ b/packages/calcite-design-tokens/src/component/stepper.json @@ -2,149 +2,149 @@ "stepper": { "font": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-3h", + "value": "{semantic.font.default.bold.-3h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.4", + "value": "{core.border.border-width.4}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "lg": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/switch.json b/packages/calcite-design-tokens/src/component/switch.json index b541b35275b..a385f876177 100644 --- a/packages/calcite-design-tokens/src/component/switch.json +++ b/packages/calcite-design-tokens/src/component/switch.json @@ -3,85 +3,85 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "checked": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.full", + "value": "{core.border.border-radius.full}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.full", + "value": "{core.border.border-radius.full}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.full", + "value": "{core.border.border-radius.full}", "type": "borderRadius" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.15", + "value": "{core.size.default.15}", "type": "sizing" } }, "handle-size": { "sm": { - "value": "$core.sizing.5", + "value": "{core.size.default.5}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "border": { "default": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "checked": { "light": { - "value": "$semantic.ui.color.brand.hover.light", + "value": "{semantic.ui.color.brand.hover.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.hover.dark", + "value": "{semantic.ui.color.brand.hover.dark}", "type": "color" } } @@ -90,21 +90,21 @@ "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "checked": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -112,36 +112,36 @@ "border": { "default": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "checked": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.half", + "value": "{core.border.border-radius.half}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.half", + "value": "{core.border.border-radius.half}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.half", + "value": "{core.border.border-radius.half}", "type": "borderRadius" } }, diff --git a/packages/calcite-design-tokens/src/component/tab-title.json b/packages/calcite-design-tokens/src/component/tab-title.json index 372276c6a2f..46edecb3f6a 100644 --- a/packages/calcite-design-tokens/src/component/tab-title.json +++ b/packages/calcite-design-tokens/src/component/tab-title.json @@ -3,33 +3,33 @@ "font": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -37,21 +37,21 @@ "icon": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -59,22 +59,22 @@ "bordered": { "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } @@ -82,29 +82,29 @@ "space-around": { "left-right": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } @@ -112,71 +112,71 @@ }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "active": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" } }, @@ -184,29 +184,29 @@ "space-around": { "left-right": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "lg": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.4", + "value": "{core.spacing.4}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/tabs.json b/packages/calcite-design-tokens/src/component/tabs.json index 3c97c1795b6..65069a2b49b 100644 --- a/packages/calcite-design-tokens/src/component/tabs.json +++ b/packages/calcite-design-tokens/src/component/tabs.json @@ -3,33 +3,33 @@ "font": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -37,21 +37,21 @@ "icon": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "active": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" } } @@ -59,22 +59,22 @@ "bordered": { "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } @@ -82,101 +82,101 @@ "space-around": { "left-right": { "sm": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "lg": { - "value": "$core.spacing.10", + "value": "{core.spacing.10}", "type": "spacing" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "space-between": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "active": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" } } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, @@ -184,44 +184,44 @@ "space-around": { "left-right": { "sm": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "md": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" }, "lg": { - "value": "$core.spacing.none", + "value": "{core.spacing.none}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } }, "space-between": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.8", + "value": "{core.spacing.8}", "type": "spacing" }, "lg": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/textarea.json b/packages/calcite-design-tokens/src/component/textarea.json index 720944bf5fd..df01ac09aa1 100644 --- a/packages/calcite-design-tokens/src/component/textarea.json +++ b/packages/calcite-design-tokens/src/component/textarea.json @@ -3,195 +3,195 @@ "font": { "placeholder-value": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "label": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "read-only": { "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } }, "chat-limit": { "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" }, "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.input.light", + "value": "{semantic.ui.color.border.input.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.input.dark", + "value": "{semantic.ui.color.border.input.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "read-only": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" } }, "space-around": { "left-right": { "sm": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "md": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "lg": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "top-bottom": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/time-picker.json b/packages/calcite-design-tokens/src/component/time-picker.json index 1a3a20711ee..e2d91fb5c35 100644 --- a/packages/calcite-design-tokens/src/component/time-picker.json +++ b/packages/calcite-design-tokens/src/component/time-picker.json @@ -2,135 +2,135 @@ "time-picker": { "font": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.bold.-2h", + "value": "{semantic.font.default.bold.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.bold.-1h", + "value": "{semantic.font.default.bold.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.bold.0h", + "value": "{semantic.font.default.bold.0h}", "type": "typography" } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.background.light", + "value": "{semantic.ui.color.background.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.background.dark", + "value": "{semantic.ui.color.background.dark}", "type": "color" } } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.2.light", + "value": "{semantic.ui.color.foreground.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.2.dark", + "value": "{semantic.ui.color.foreground.2.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.4", + "value": "{core.border.border-width.4}", "type": "borderWidth" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "lg": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" }, "md": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "lg": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/component/tip-manager.json b/packages/calcite-design-tokens/src/component/tip-manager.json index b384e02b073..251ef1e9530 100644 --- a/packages/calcite-design-tokens/src/component/tip-manager.json +++ b/packages/calcite-design-tokens/src/component/tip-manager.json @@ -3,61 +3,61 @@ "font": { "heading": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.bold.1h", + "value": "{semantic.font.default.bold.1h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "border-radius": { "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "icon-size": { "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/tip.json b/packages/calcite-design-tokens/src/component/tip.json index fd3f1dd8476..3e195cab7d9 100644 --- a/packages/calcite-design-tokens/src/component/tip.json +++ b/packages/calcite-design-tokens/src/component/tip.json @@ -3,75 +3,75 @@ "font": { "heading": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } }, "description": { "light": { - "value": "$semantic.ui.color.text.2.light", + "value": "{semantic.ui.color.text.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.2.dark", + "value": "{semantic.ui.color.text.2.dark}", "type": "color" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" } } }, "icon": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "background": { "default": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } } }, "border-radius": { "md": { - "value": "$core.border.border-radius.none", + "value": "{core.border.border-radius.none}", "type": "borderRadius" } }, "icon-size": { "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" } }, "border": { "default": { "light": { - "value": "$semantic.ui.color.border.2.light", + "value": "{semantic.ui.color.border.2.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.2.dark", + "value": "{semantic.ui.color.border.2.dark}", "type": "color" } } diff --git a/packages/calcite-design-tokens/src/component/tooltip.json b/packages/calcite-design-tokens/src/component/tooltip.json index e35d8e63159..99ea4c26669 100644 --- a/packages/calcite-design-tokens/src/component/tooltip.json +++ b/packages/calcite-design-tokens/src/component/tooltip.json @@ -2,63 +2,63 @@ "tooltip": { "space-arround": { "top-bottom": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" }, "left-right": { - "value": "$core.spacing.7", + "value": "{core.spacing.7}", "type": "spacing" } }, "foreground": { "light": { - "value": "$semantic.ui.color.foreground.1.light", + "value": "{semantic.ui.color.foreground.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.foreground.1.dark", + "value": "{semantic.ui.color.foreground.1.dark}", "type": "color" } }, "font": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "standard": { - "value": "$semantic.font.wrap.medium.-2", + "value": "{semantic.font.wrap.medium.-2}", "type": "typography" } }, "border": { "light": { - "value": "$semantic.ui.color.border.3.light", + "value": "{semantic.ui.color.border.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.3.dark", + "value": "{semantic.ui.color.border.3.dark}", "type": "color" } }, "border-radius": { - "value": "$core.border.border-radius.1", + "value": "{core.border.border-radius.1}", "type": "borderRadius" }, "border-width": { - "value": "$core.border.border-width.0", + "value": "{core.border.border-width.0}", "type": "borderWidth" }, "arrow": { "width": { - "value": "$core.sizing.6", + "value": "{core.size.default.6}", "type": "sizing" }, "height": { - "value": "$core.sizing.2", + "value": "{core.size.default.2}", "type": "sizing" } } diff --git a/packages/calcite-design-tokens/src/component/tree-item.json b/packages/calcite-design-tokens/src/component/tree-item.json index 45708302807..427514f5e35 100644 --- a/packages/calcite-design-tokens/src/component/tree-item.json +++ b/packages/calcite-design-tokens/src/component/tree-item.json @@ -3,55 +3,55 @@ "font": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.regular.-2h", + "value": "{semantic.font.default.regular.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.regular.-1h", + "value": "{semantic.font.default.regular.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.regular.0h", + "value": "{semantic.font.default.regular.0h}", "type": "typography" } }, "selected": { "light": { - "value": "$semantic.ui.color.text.1.light", + "value": "{semantic.ui.color.text.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.1.dark", + "value": "{semantic.ui.color.text.1.dark}", "type": "color" }, "sm": { - "value": "$semantic.font.default.medium.-2h", + "value": "{semantic.font.default.medium.-2h}", "type": "typography" }, "md": { - "value": "$semantic.font.default.medium.-1h", + "value": "{semantic.font.default.medium.-1h}", "type": "typography" }, "lg": { - "value": "$semantic.font.default.medium.0h", + "value": "{semantic.font.default.medium.0h}", "type": "typography" } }, "children-selected": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } @@ -59,116 +59,116 @@ "icon": { "default": { "light": { - "value": "$semantic.ui.color.text.3.light", + "value": "{semantic.ui.color.text.3.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.text.3.dark", + "value": "{semantic.ui.color.text.3.dark}", "type": "color" } }, "selected": { "light": { - "value": "$semantic.ui.color.brand.default.light", + "value": "{semantic.ui.color.brand.default.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.brand.default.dark", + "value": "{semantic.ui.color.brand.default.dark}", "type": "color" } } }, "border": { "light": { - "value": "$semantic.ui.color.border.1.light", + "value": "{semantic.ui.color.border.1.light}", "type": "color" }, "dark": { - "value": "$semantic.ui.color.border.1.dark", + "value": "{semantic.ui.color.border.1.dark}", "type": "color" } }, "border-radius": { "sm": { - "value": "$core.border.border-radius.4", + "value": "{core.border.border-radius.4}", "type": "borderRadius" }, "md": { - "value": "$core.border.border-radius.5", + "value": "{core.border.border-radius.5}", "type": "borderRadius" }, "lg": { - "value": "$core.border.border-radius.6", + "value": "{core.border.border-radius.6}", "type": "borderRadius" } }, "border-width": { "sm": { - "value": "$core.border.border-width.1", + "value": "{core.border.border-width.1}", "type": "borderWidth" }, "md": { - "value": "$core.border.border-width.2", + "value": "{core.border.border-width.2}", "type": "borderWidth" }, "lg": { - "value": "$core.border.border-width.4", + "value": "{core.border.border-width.4}", "type": "borderWidth" } }, "comp-size": { "sm": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "md": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" }, "lg": { - "value": "$core.sizing.14", + "value": "{core.size.default.14}", "type": "sizing" } }, "icon-size": { "sm": { - "value": "$core.sizing.7", + "value": "{core.size.default.7}", "type": "sizing" }, "md": { - "value": "$core.sizing.9", + "value": "{core.size.default.9}", "type": "sizing" }, "lg": { - "value": "$core.sizing.11", + "value": "{core.size.default.11}", "type": "sizing" } }, "space-between": { "sm": { - "value": "$core.spacing.9", + "value": "{core.spacing.9}", "type": "spacing" }, "md": { - "value": "$core.spacing.11", + "value": "{core.spacing.11}", "type": "spacing" }, "lg": { - "value": "$core.spacing.14", + "value": "{core.spacing.14}", "type": "spacing" } }, "space-around": { "sm": { - "value": "$core.spacing.1", + "value": "{core.spacing.1}", "type": "spacing" }, "md": { - "value": "$core.spacing.3", + "value": "{core.spacing.3}", "type": "spacing" }, "lg": { - "value": "$core.spacing.5", + "value": "{core.spacing.5}", "type": "spacing" } } diff --git a/packages/calcite-design-tokens/src/core.json b/packages/calcite-design-tokens/src/core.json index 35bcf6f7ab9..778e5725e77 100644 --- a/packages/calcite-design-tokens/src/core.json +++ b/packages/calcite-design-tokens/src/core.json @@ -1,7 +1,7 @@ { "core": { "font": { - "font-family": { + "family": { "primary": { "value": "Avenir Next LT Pro", "type": "fontFamilies" @@ -15,7 +15,14 @@ "type": "fontFamilies" } }, - "font-weight": { + "style": { + "italic": { + "value": "italic", + "type": "fontStyle", + "description": "used in ratings" + } + }, + "weight": { "ultralight": { "value": "UltraLight", "type": "fontWeights", @@ -153,7 +160,7 @@ } } }, - "font-size": { + "size": { "0": { "value": "10px", "type": "fontSizes" @@ -268,76 +275,6 @@ } } }, - "border": { - "border-radius": { - "0": { - "value": "2px", - "type": "borderRadius" - }, - "1": { - "value": "4px", - "type": "borderRadius" - }, - "2": { - "value": "6px", - "type": "borderRadius" - }, - "3": { - "value": "8px", - "type": "borderRadius" - }, - "4": { - "value": "12px", - "type": "borderRadius" - }, - "5": { - "value": "16px", - "type": "borderRadius" - }, - "6": { - "value": "24px", - "type": "borderRadius" - }, - "none": { - "value": "0px", - "type": "borderRadius" - }, - "half": { - "value": "50%", - "type": "borderRadius" - }, - "full": { - "value": "9999px", - "type": "borderRadius" - } - }, - "border-width": { - "0": { - "value": "1px", - "type": "borderWidth" - }, - "1": { - "value": "2px", - "type": "borderWidth" - }, - "2": { - "value": "4px", - "type": "borderWidth" - }, - "3": { - "value": "6px", - "type": "borderWidth" - }, - "4": { - "value": "8px", - "type": "borderWidth" - }, - "none": { - "value": "0px", - "type": "borderWidth" - } - } - }, "opacity": { "0": { "value": "0%", @@ -515,1252 +452,987 @@ "type": "color" } }, - "palette": { - "high-saturation": { - "blue": { - "h-bb-010": { - "value": "#c7eaff", - "type": "color" - }, - "h-bb-020": { - "value": "#9fd4f3", - "type": "color" - }, - "h-bb-030": { - "value": "#77bde7", - "type": "color" - }, - "h-bb-040": { - "value": "#50a7da", - "type": "color" - }, - "h-bb-050": { - "value": "#2890ce", - "type": "color" - }, - "h-bb-060": { - "value": "#007ac2", - "type": "color" - }, - "h-bb-070": { - "value": "#00619b", - "type": "color" - }, - "h-bb-080": { - "value": "#004874", - "type": "color" - }, - "h-bb-090": { - "value": "#00304d", - "type": "color" - }, - "h-bb-100": { - "value": "#001726", - "type": "color" - } - }, - "green-blue": { - "h-gb-010": { - "value": "#cef5f4", - "type": "color" - }, - "h-gb-020": { - "value": "#afedec", - "type": "color" - }, - "h-gb-030": { - "value": "#8fe6e5", - "type": "color" - }, - "h-gb-040": { - "value": "#5ae0de", - "type": "color" - }, - "h-gb-050": { - "value": "#28cecb", - "type": "color" - }, - "h-gb-060": { - "value": "#00bab5", - "type": "color" - }, - "h-gb-070": { - "value": "#009b98", - "type": "color" - }, - "h-gb-080": { - "value": "#007472", - "type": "color" - }, - "h-gb-090": { - "value": "#004d4c", - "type": "color" - }, - "h-gb-100": { - "value": "#002625", - "type": "color" - } - }, - "green": { - "h-gg-010": { - "value": "#bdf2c4", - "type": "color" - }, - "h-gg-020": { - "value": "#a2e4ab", - "type": "color" - }, - "h-gg-030": { - "value": "#87d692", - "type": "color" - }, - "h-gg-040": { - "value": "#6bc878", - "type": "color" - }, - "h-gg-050": { - "value": "#50ba5f", - "type": "color" - }, - "h-gg-060": { - "value": "#35ac46", - "type": "color" - }, - "h-gg-070": { - "value": "#288835", - "type": "color" - }, - "h-gg-080": { - "value": "#1a6324", - "type": "color" - }, - "h-gg-090": { - "value": "#0d3f14", - "type": "color" - }, - "h-gg-100": { - "value": "#001a03", - "type": "color" - } - }, - "yellow-green": { - "h-yg-010": { - "value": "#e5f7b4", - "type": "color" - }, - "h-yg-020": { - "value": "#d9ef9f", - "type": "color" - }, - "h-yg-030": { - "value": "#cde78a", - "type": "color" - }, - "h-yg-040": { - "value": "#c2e075", - "type": "color" - }, - "h-yg-050": { - "value": "#b6d860", - "type": "color" - }, - "h-yg-060": { - "value": "#aad04b", - "type": "color" - }, - "h-yg-070": { - "value": "#84a338", - "type": "color" - }, - "h-yg-080": { - "value": "#5e7526", - "type": "color" - }, - "h-yg-090": { - "value": "#384813", - "type": "color" - }, - "h-yg-100": { - "value": "#121a00", - "type": "color" - } - }, - "yellow": { - "h-yy-010": { - "value": "#fff7cc", - "type": "color" - }, - "h-yy-020": { - "value": "#fef3ad", - "type": "color" - }, - "h-yy-030": { - "value": "#fcee8d", - "type": "color" - }, - "h-yy-040": { - "value": "#fbea6e", - "type": "color" - }, - "h-yy-050": { - "value": "#f9e54e", - "type": "color" - }, - "h-yy-060": { - "value": "#edd317", - "type": "color" - }, - "h-yy-070": { - "value": "#d9bc00", - "type": "color" - }, - "h-yy-080": { - "value": "#bfa200", - "type": "color" - }, - "h-yy-090": { - "value": "#8c7500", - "type": "color" - }, - "h-yy-100": { - "value": "#5c4e00", - "type": "color" - } - }, - "orange-yellow": { - "h-oy-010": { - "value": "#ffe2bf", - "type": "color" - }, - "h-oy-020": { - "value": "#fed3a1", - "type": "color" - }, - "h-oy-030": { - "value": "#fcc582", - "type": "color" - }, - "h-oy-040": { - "value": "#fbb664", - "type": "color" - }, - "h-oy-050": { - "value": "#f9a845", - "type": "color" - }, - "h-oy-060": { - "value": "#f89927", - "type": "color" - }, - "h-oy-070": { - "value": "#c67718", - "type": "color" - }, - "h-oy-080": { - "value": "#9a5b10", - "type": "color" - }, - "h-oy-090": { - "value": "#6d3f08", - "type": "color" - }, - "h-oy-100": { - "value": "#402300", - "type": "color" - } - }, - "orange": { - "h-oo-010": { - "value": "#ffd8bf", - "type": "color" - }, - "h-oo-020": { - "value": "#fdc39f", - "type": "color" - }, - "h-oo-030": { - "value": "#faae7f", - "type": "color" - }, - "h-oo-040": { - "value": "#f89960", - "type": "color" - }, - "h-oo-050": { - "value": "#f58440", - "type": "color" - }, - "h-oo-060": { - "value": "#f36f20", - "type": "color" - }, - "h-oo-070": { - "value": "#c65a18", - "type": "color" - }, - "h-oo-080": { - "value": "#9a4410", - "type": "color" - }, - "h-oo-090": { - "value": "#6d2f08", - "type": "color" - }, - "h-oo-100": { - "value": "#401900", - "type": "color" - } - }, - "red-orange": { - "h-ro-010": { - "value": "#ffc7b3", - "type": "color" - }, - "h-ro-020": { - "value": "#f8af95", - "type": "color" - }, - "h-ro-030": { - "value": "#f09677", - "type": "color" - }, - "h-ro-040": { - "value": "#e97e5a", - "type": "color" - }, - "h-ro-050": { - "value": "#e1653c", - "type": "color" - }, - "h-ro-060": { - "value": "#da4d1e", - "type": "color" - }, - "h-ro-070": { - "value": "#ad3c16", - "type": "color" - }, - "h-ro-080": { - "value": "#802c0f", - "type": "color" - }, - "h-ro-090": { - "value": "#531b07", - "type": "color" - }, - "h-ro-100": { - "value": "#260a00", - "type": "color" - } - }, - "red": { - "h-rr-010": { - "value": "#ffc6bf", - "type": "color" - }, - "h-rr-020": { - "value": "#ffaaa1", - "type": "color" - }, - "h-rr-030": { - "value": "#f2877b", - "type": "color" - }, - "h-rr-040": { - "value": "#f07062", - "type": "color" - }, - "h-rr-050": { - "value": "#e65240", - "type": "color" - }, - "h-rr-060": { - "value": "#d83020", - "type": "color" - }, - "h-rr-070": { - "value": "#a82b1e", - "type": "color" - }, - "h-rr-080": { - "value": "#7c1d13", - "type": "color" - }, - "h-rr-090": { - "value": "#4f0e08", - "type": "color" - }, - "h-rr-100": { - "value": "#210300", - "type": "color" - } - }, - "pink": { - "h-pk-010": { - "value": "#ffd1ef", - "type": "color" - }, - "h-pk-020": { - "value": "#fabee4", - "type": "color" - }, - "h-pk-030": { - "value": "#f2a5d6", - "type": "color" - }, - "h-pk-040": { - "value": "#eb8dc9", - "type": "color" - }, - "h-pk-050": { - "value": "#e673bb", - "type": "color" - }, - "h-pk-060": { - "value": "#e04ea6", - "type": "color" - }, - "h-pk-070": { - "value": "#ba2f7e", - "type": "color" - }, - "h-pk-080": { - "value": "#851b52", - "type": "color" - }, - "h-pk-090": { - "value": "#590b32", - "type": "color" - }, - "h-pk-100": { - "value": "#260404", - "type": "color" - } - }, - "violet-red": { - "h-vr-010": { - "value": "#fadbff", - "type": "color" - }, - "h-vr-020": { - "value": "#e4beeb", - "type": "color" - }, - "h-vr-030": { - "value": "#cfa1d7", - "type": "color" - }, - "h-vr-040": { - "value": "#b983c3", - "type": "color" - }, - "h-vr-050": { - "value": "#a466af", - "type": "color" - }, - "h-vr-060": { - "value": "#8e499b", - "type": "color" - }, - "h-vr-070": { - "value": "#73377e", - "type": "color" - }, - "h-vr-080": { - "value": "#572561", - "type": "color" - }, - "h-vr-090": { - "value": "#3c1243", - "type": "color" - }, - "h-vr-100": { - "value": "#200026", - "type": "color" - } - }, - "violet": { - "h-vv-010": { - "value": "#e8d9ff", - "type": "color" - }, - "h-vv-020": { - "value": "#cdb9eb", - "type": "color" - }, - "h-vv-030": { - "value": "#b39ad7", - "type": "color" - }, - "h-vv-040": { - "value": "#987ac3", - "type": "color" - }, - "h-vv-050": { - "value": "#7e5baf", - "type": "color" - }, - "h-vv-060": { - "value": "#633b9b", - "type": "color" - }, - "h-vv-070": { - "value": "#4e2c7e", - "type": "color" - }, - "h-vv-080": { - "value": "#3a1e61", - "type": "color" - }, - "h-vv-090": { - "value": "#250f43", - "type": "color" - }, - "h-vv-100": { - "value": "#100026", - "type": "color" - } + "high-saturation": { + "blue": { + "h-bb-010": { + "value": "#c7eaff", + "type": "color" + }, + "h-bb-020": { + "value": "#9fd4f3", + "type": "color" + }, + "h-bb-030": { + "value": "#77bde7", + "type": "color" + }, + "h-bb-040": { + "value": "#50a7da", + "type": "color" + }, + "h-bb-050": { + "value": "#2890ce", + "type": "color" + }, + "h-bb-060": { + "value": "#007ac2", + "type": "color" + }, + "h-bb-070": { + "value": "#00619b", + "type": "color" + }, + "h-bb-080": { + "value": "#004874", + "type": "color" + }, + "h-bb-090": { + "value": "#00304d", + "type": "color" + }, + "h-bb-100": { + "value": "#001726", + "type": "color" } }, - "vibrant": { - "blue": { - "v-bb-120": { - "value": "#59d6ff", - "type": "color" - }, - "v-bb-140": { - "value": "#3db8ff", - "type": "color" - }, - "v-bb-160": { - "value": "#009af2", - "type": "color" - }, - "v-bb-180": { - "value": "#009af2", - "type": "color" - } - }, - "green-blue": { - "v-gb-120": { - "value": "#59fffc", - "type": "color" - }, - "v-gb-140": { - "value": "#00f7f3", - "type": "color" - }, - "v-gb-160": { - "value": "#00e6e2", - "type": "color" - }, - "v-gb-180": { - "value": "#00cfca", - "type": "color" - } - }, - "green": { - "v-gg-120": { - "value": "#73ff84", - "type": "color" - }, - "v-gg-140": { - "value": "#3bed52", - "type": "color" - }, - "v-gg-160": { - "value": "#00b81b", - "type": "color" - }, - "v-gg-180": { - "value": "#00a118", - "type": "color" - } - }, - "yellow-green": { - "v-yg-120": { - "value": "#d7ff73", - "type": "color" - }, - "v-yg-140": { - "value": "#bbed3b", - "type": "color" - }, - "v-yg-160": { - "value": "#96cc00", - "type": "color" - }, - "v-yg-180": { - "value": "#7fab00", - "type": "color" - } - }, - "yellow": { - "v-yy-120": { - "value": "#fff766", - "type": "color" - }, - "v-yy-140": { - "value": "#ffee33", - "type": "color" - }, - "v-yy-160": { - "value": "#f5d000", - "type": "color" - }, - "v-yy-180": { - "value": "#ebba17", - "type": "color" - } - }, - "orange-yellow": { - "v-oy-120": { - "value": "#ffb54d", - "type": "color" - }, - "v-oy-140": { - "value": "#ff9500", - "type": "color" - }, - "v-oy-160": { - "value": "#e68600", - "type": "color" - }, - "v-oy-180": { - "value": "#d17300", - "type": "color" - } - }, - "red-orange": { - "v-ro-120": { - "value": "#ff824d", - "type": "color" - }, - "v-ro-140": { - "value": "#ff4d00", - "type": "color" - }, - "v-ro-160": { - "value": "#de4300", - "type": "color" - }, - "v-ro-180": { - "value": "#c93b00", - "type": "color" - } - }, - "red": { - "v-rr-120": { - "value": "#ff624d", - "type": "color" - }, - "v-rr-140": { - "value": "#ff0015", - "type": "color" - }, - "v-rr-160": { - "value": "#d90012", - "type": "color" - }, - "v-rr-180": { - "value": "#b3000f", - "type": "color" - } - }, - "pink": { - "v-pk-120": { - "value": "#ff66c2", - "type": "color" - }, - "v-pk-140": { - "value": "#ff19a4", - "type": "color" - }, - "v-pk-160": { - "value": "#d11486", - "type": "color" - }, - "v-pk-180": { - "value": "#c00073", - "type": "color" - } - }, - "violet-red": { - "v-vr-120": { - "value": "#ea80ff", - "type": "color" - }, - "v-vr-140": { - "value": "#dd33ff", - "type": "color" - }, - "v-vr-160": { - "value": "#ac08cc", - "type": "color" - }, - "v-vr-180": { - "value": "#83009e", - "type": "color" - } - }, - "violet": { - "v-vv-120": { - "value": "#b580ff", - "type": "color" - }, - "v-vv-140": { - "value": "#974dff", - "type": "color" - }, - "v-vv-160": { - "value": "#8129ff", - "type": "color" - }, - "v-vv-180": { - "value": "#6a0be6", - "type": "color" - } + "green-blue": { + "h-gb-010": { + "value": "#cef5f4", + "type": "color" + }, + "h-gb-020": { + "value": "#afedec", + "type": "color" + }, + "h-gb-030": { + "value": "#8fe6e5", + "type": "color" + }, + "h-gb-040": { + "value": "#5ae0de", + "type": "color" + }, + "h-gb-050": { + "value": "#28cecb", + "type": "color" + }, + "h-gb-060": { + "value": "#00bab5", + "type": "color" + }, + "h-gb-070": { + "value": "#009b98", + "type": "color" + }, + "h-gb-080": { + "value": "#007472", + "type": "color" + }, + "h-gb-090": { + "value": "#004d4c", + "type": "color" + }, + "h-gb-100": { + "value": "#002625", + "type": "color" } }, - "dark": { - "green": { - "d-gg-410": { - "value": "#44ED51", - "type": "color" - }, - "d-gg-420": { - "value": "#36DA43", - "type": "color" - }, - "d-gg-430": { - "value": "#36DA43", - "type": "color" - } - }, - "yellow": { - "d-yy-410": { - "value": "#FFE24D", - "type": "color" - }, - "d-yy-420": { - "value": "#FFC900", - "type": "color" - }, - "d-yy-430": { - "value": "#F4B000", - "type": "color" - } - }, - "red": { - "d-rr-410": { - "value": "#FF7465", - "type": "color" - }, - "d-rr-420": { - "value": "#FE583E", - "type": "color" - }, - "d-rr-430": { - "value": "#F3381B", - "type": "color" - } - }, - "blue": { - "d-bb-410": { - "value": "#47BBFF", - "type": "color" - }, - "d-bb-420": { - "value": "#00A0FF", - "type": "color" - }, - "d-bb-430": { - "value": "#0087D7", - "type": "color" - } + "green": { + "h-gg-010": { + "value": "#bdf2c4", + "type": "color" + }, + "h-gg-020": { + "value": "#a2e4ab", + "type": "color" + }, + "h-gg-030": { + "value": "#87d692", + "type": "color" + }, + "h-gg-040": { + "value": "#6bc878", + "type": "color" + }, + "h-gg-050": { + "value": "#50ba5f", + "type": "color" + }, + "h-gg-060": { + "value": "#35ac46", + "type": "color" + }, + "h-gg-070": { + "value": "#288835", + "type": "color" + }, + "h-gg-080": { + "value": "#1a6324", + "type": "color" + }, + "h-gg-090": { + "value": "#0d3f14", + "type": "color" + }, + "h-gg-100": { + "value": "#001a03", + "type": "color" } - } - } - }, - "sizing": { - "0": { - "value": "2px", - "type": "sizing" - }, - "1": { - "value": "4px", - "type": "sizing" - }, - "2": { - "value": "6px", - "type": "sizing" - }, - "3": { - "value": "8px", - "type": "sizing" - }, - "4": { - "value": "10px", - "type": "sizing" - }, - "5": { - "value": "12px", - "type": "sizing" - }, - "6": { - "value": "14px", - "type": "sizing" - }, - "7": { - "value": "16px", - "type": "sizing" - }, - "8": { - "value": "20px", - "type": "sizing" - }, - "9": { - "value": "24px", - "type": "sizing" - }, - "10": { - "value": "28px", - "type": "sizing" - }, - "11": { - "value": "32px", - "type": "sizing" - }, - "12": { - "value": "36px", - "type": "sizing" - }, - "13": { - "value": "40px", - "type": "sizing" - }, - "14": { - "value": "44px", - "type": "sizing" - }, - "15": { - "value": "48px", - "type": "sizing" - }, - "16": { - "value": "56px", - "type": "sizing" - }, - "17": { - "value": "64px", - "type": "sizing" - }, - "18": { - "value": "72px", - "type": "sizing" - }, - "19": { - "value": "80px", - "type": "sizing" - }, - "20": { - "value": "96px", - "type": "sizing" - }, - "21": { - "value": "112px", - "type": "sizing" - }, - "22": { - "value": "128px", - "type": "sizing" - }, - "23": { - "value": "144px", - "type": "sizing" - }, - "24": { - "value": "160px", - "type": "sizing" - }, - "25": { - "value": "192px", - "type": "sizing" - }, - "26": { - "value": "224px", - "type": "sizing" - }, - "27": { - "value": "256px", - "type": "sizing" - }, - "28": { - "value": "288px", - "type": "sizing" - }, - "none": { - "value": "0px", - "type": "sizing" - } - }, - "spacing": { - "0": { - "value": "2px", - "type": "spacing" - }, - "1": { - "value": "4px", - "type": "spacing" - }, - "2": { - "value": "6px", - "type": "spacing" - }, - "3": { - "value": "8px", - "type": "spacing" - }, - "4": { - "value": "10px", - "type": "spacing" - }, - "5": { - "value": "12px", - "type": "spacing" - }, - "6": { - "value": "14px", - "type": "spacing" - }, - "7": { - "value": "16px", - "type": "spacing" - }, - "8": { - "value": "20px", - "type": "spacing" - }, - "9": { - "value": "24px", - "type": "spacing" - }, - "10": { - "value": "28px", - "type": "spacing" - }, - "11": { - "value": "32px", - "type": "spacing" - }, - "12": { - "value": "36px", - "type": "spacing" - }, - "13": { - "value": "40px", - "type": "spacing" - }, - "14": { - "value": "44px", - "type": "spacing" - }, - "15": { - "value": "48px", - "type": "spacing" - }, - "16": { - "value": "56px", - "type": "spacing" - }, - "17": { - "value": "64px", - "type": "spacing" - }, - "18": { - "value": "72px", - "type": "spacing" - }, - "19": { - "value": "80px", - "type": "spacing" - }, - "20": { - "value": "96px", - "type": "spacing" - }, - "21": { - "value": "112px", - "type": "spacing" - }, - "22": { - "value": "128px", - "type": "spacing" - }, - "23": { - "value": "144px", - "type": "spacing" - }, - "24": { - "value": "160px", - "type": "spacing" - }, - "25": { - "value": "192px", - "type": "spacing" - }, - "26": { - "value": "224px", - "type": "spacing" - }, - "27": { - "value": "256px", - "type": "spacing" - }, - "28": { - "value": "288px", - "type": "spacing" - }, - "none": { - "value": "0px", - "type": "spacing" - } - }, - "breakpoint": { - "height": { - "xxs": { - "min": { - "value": 0, - "type": "sizing", - "description": "Small handheld devices and mini-windows" - }, - "max": { - "value": 153, - "type": "sizing", - "description": "Small handheld devices and mini-windows" + }, + "yellow-green": { + "h-yg-010": { + "value": "#e5f7b4", + "type": "color" + }, + "h-yg-020": { + "value": "#d9ef9f", + "type": "color" + }, + "h-yg-030": { + "value": "#cde78a", + "type": "color" + }, + "h-yg-040": { + "value": "#c2e075", + "type": "color" + }, + "h-yg-050": { + "value": "#b6d860", + "type": "color" + }, + "h-yg-060": { + "value": "#aad04b", + "type": "color" + }, + "h-yg-070": { + "value": "#84a338", + "type": "color" + }, + "h-yg-080": { + "value": "#5e7526", + "type": "color" + }, + "h-yg-090": { + "value": "#384813", + "type": "color" + }, + "h-yg-100": { + "value": "#121a00", + "type": "color" } }, - "xs": { - "max": { - "value": 328, - "type": "sizing", - "description": "Handheld devices" + "yellow": { + "h-yy-010": { + "value": "#fff7cc", + "type": "color" + }, + "h-yy-020": { + "value": "#fef3ad", + "type": "color" }, - "min": { - "value": 154, - "type": "sizing", - "description": "Handheld devices" + "h-yy-030": { + "value": "#fcee8d", + "type": "color" + }, + "h-yy-040": { + "value": "#fbea6e", + "type": "color" + }, + "h-yy-050": { + "value": "#f9e54e", + "type": "color" + }, + "h-yy-060": { + "value": "#edd317", + "type": "color" + }, + "h-yy-070": { + "value": "#d9bc00", + "type": "color" + }, + "h-yy-080": { + "value": "#bfa200", + "type": "color" + }, + "h-yy-090": { + "value": "#8c7500", + "type": "color" + }, + "h-yy-100": { + "value": "#5c4e00", + "type": "color" } }, - "sm": { - "max": { - "value": 503, - "type": "sizing", - "description": "Small tablets" + "orange-yellow": { + "h-oy-010": { + "value": "#ffe2bf", + "type": "color" + }, + "h-oy-020": { + "value": "#fed3a1", + "type": "color" + }, + "h-oy-030": { + "value": "#fcc582", + "type": "color" + }, + "h-oy-040": { + "value": "#fbb664", + "type": "color" + }, + "h-oy-050": { + "value": "#f9a845", + "type": "color" + }, + "h-oy-060": { + "value": "#f89927", + "type": "color" + }, + "h-oy-070": { + "value": "#c67718", + "type": "color" + }, + "h-oy-080": { + "value": "#9a5b10", + "type": "color" + }, + "h-oy-090": { + "value": "#6d3f08", + "type": "color" }, - "min": { - "value": 329, - "type": "sizing", - "description": "Small tablets" + "h-oy-100": { + "value": "#402300", + "type": "color" } }, - "md": { - "max": { - "value": 678, - "type": "sizing", - "description": "Small laptops" + "orange": { + "h-oo-010": { + "value": "#ffd8bf", + "type": "color" }, - "min": { - "value": 504, - "type": "sizing", - "description": "Small laptops" + "h-oo-020": { + "value": "#fdc39f", + "type": "color" + }, + "h-oo-030": { + "value": "#faae7f", + "type": "color" + }, + "h-oo-040": { + "value": "#f89960", + "type": "color" + }, + "h-oo-050": { + "value": "#f58440", + "type": "color" + }, + "h-oo-060": { + "value": "#f36f20", + "type": "color" + }, + "h-oo-070": { + "value": "#c65a18", + "type": "color" + }, + "h-oo-080": { + "value": "#9a4410", + "type": "color" + }, + "h-oo-090": { + "value": "#6d2f08", + "type": "color" + }, + "h-oo-100": { + "value": "#401900", + "type": "color" } }, - "lg": { - "max": { - "value": 853, - "type": "sizing", - "description": "Large laptops and desktop computers" + "red-orange": { + "h-ro-010": { + "value": "#ffc7b3", + "type": "color" + }, + "h-ro-020": { + "value": "#f8af95", + "type": "color" + }, + "h-ro-030": { + "value": "#f09677", + "type": "color" + }, + "h-ro-040": { + "value": "#e97e5a", + "type": "color" + }, + "h-ro-050": { + "value": "#e1653c", + "type": "color" + }, + "h-ro-060": { + "value": "#da4d1e", + "type": "color" + }, + "h-ro-070": { + "value": "#ad3c16", + "type": "color" }, - "min": { - "value": 679, - "type": "sizing", - "description": "Large laptops and desktop computers" + "h-ro-080": { + "value": "#802c0f", + "type": "color" + }, + "h-ro-090": { + "value": "#531b07", + "type": "color" + }, + "h-ro-100": { + "value": "#260a00", + "type": "color" + } + }, + "red": { + "h-rr-010": { + "value": "#ffc6bf", + "type": "color" + }, + "h-rr-020": { + "value": "#ffaaa1", + "type": "color" + }, + "h-rr-030": { + "value": "#f2877b", + "type": "color" + }, + "h-rr-040": { + "value": "#f07062", + "type": "color" + }, + "h-rr-050": { + "value": "#e65240", + "type": "color" + }, + "h-rr-060": { + "value": "#d83020", + "type": "color" + }, + "h-rr-070": { + "value": "#a82b1e", + "type": "color" + }, + "h-rr-080": { + "value": "#7c1d13", + "type": "color" + }, + "h-rr-090": { + "value": "#4f0e08", + "type": "color" + }, + "h-rr-100": { + "value": "#210300", + "type": "color" + } + }, + "pink": { + "h-pk-010": { + "value": "#ffd1ef", + "type": "color" + }, + "h-pk-020": { + "value": "#fabee4", + "type": "color" + }, + "h-pk-030": { + "value": "#f2a5d6", + "type": "color" + }, + "h-pk-040": { + "value": "#eb8dc9", + "type": "color" + }, + "h-pk-050": { + "value": "#e673bb", + "type": "color" + }, + "h-pk-060": { + "value": "#e04ea6", + "type": "color" + }, + "h-pk-070": { + "value": "#ba2f7e", + "type": "color" + }, + "h-pk-080": { + "value": "#851b52", + "type": "color" + }, + "h-pk-090": { + "value": "#590b32", + "type": "color" + }, + "h-pk-100": { + "value": "#260404", + "type": "color" + } + }, + "violet-red": { + "h-vr-010": { + "value": "#fadbff", + "type": "color" + }, + "h-vr-020": { + "value": "#e4beeb", + "type": "color" + }, + "h-vr-030": { + "value": "#cfa1d7", + "type": "color" + }, + "h-vr-040": { + "value": "#b983c3", + "type": "color" + }, + "h-vr-050": { + "value": "#a466af", + "type": "color" + }, + "h-vr-060": { + "value": "#8e499b", + "type": "color" + }, + "h-vr-070": { + "value": "#73377e", + "type": "color" + }, + "h-vr-080": { + "value": "#572561", + "type": "color" + }, + "h-vr-090": { + "value": "#3c1243", + "type": "color" + }, + "h-vr-100": { + "value": "#200026", + "type": "color" + } + }, + "violet": { + "h-vv-010": { + "value": "#e8d9ff", + "type": "color" + }, + "h-vv-020": { + "value": "#cdb9eb", + "type": "color" + }, + "h-vv-030": { + "value": "#b39ad7", + "type": "color" + }, + "h-vv-040": { + "value": "#987ac3", + "type": "color" + }, + "h-vv-050": { + "value": "#7e5baf", + "type": "color" + }, + "h-vv-060": { + "value": "#633b9b", + "type": "color" + }, + "h-vv-070": { + "value": "#4e2c7e", + "type": "color" + }, + "h-vv-080": { + "value": "#3a1e61", + "type": "color" + }, + "h-vv-090": { + "value": "#250f43", + "type": "color" + }, + "h-vv-100": { + "value": "#100026", + "type": "color" } } }, - "width": { - "default": { - "xxs": { - "value": "320px", - "type": "sizing", - "description": "To be deprecated" - }, - "xs": { - "value": "476px", - "type": "sizing", - "description": "To be deprecated" - }, - "sm": { - "value": "768px", - "type": "sizing", - "description": "To be deprecated" - }, - "md": { - "value": "1152px", - "type": "sizing", - "description": "To be deprecated" - }, - "lg": { - "value": "1440px", - "type": "sizing", - "description": "To be deprecated" + "vibrant": { + "blue": { + "v-bb-120": { + "value": "#59d6ff", + "type": "color" + }, + "v-bb-140": { + "value": "#3db8ff", + "type": "color" + }, + "v-bb-160": { + "value": "#009af2", + "type": "color" + }, + "v-bb-180": { + "value": "#009af2", + "type": "color" } }, - "xxs": { - "max": { - "value": 320, - "type": "sizing", - "description": "Small handheld devices and mini-windows" + "green-blue": { + "v-gb-120": { + "value": "#59fffc", + "type": "color" }, - "min": { - "value": 0, - "type": "sizing", - "description": "Small handheld devices and mini-windows" + "v-gb-140": { + "value": "#00f7f3", + "type": "color" + }, + "v-gb-160": { + "value": "#00e6e2", + "type": "color" + }, + "v-gb-180": { + "value": "#00cfca", + "type": "color" } }, - "xs": { - "max": { - "value": 476, - "type": "sizing", - "description": "Handheld devices" + "green": { + "v-gg-120": { + "value": "#73ff84", + "type": "color" + }, + "v-gg-140": { + "value": "#3bed52", + "type": "color" + }, + "v-gg-160": { + "value": "#00b81b", + "type": "color" }, - "min": { - "value": 321, - "type": "sizing", - "description": "Handheld devices" + "v-gg-180": { + "value": "#00a118", + "type": "color" } }, - "sm": { - "max": { - "value": 768, - "type": "sizing", - "description": "Small tablets" + "yellow-green": { + "v-yg-120": { + "value": "#d7ff73", + "type": "color" }, - "min": { - "value": 477, - "type": "sizing", - "description": "Small tablets" + "v-yg-140": { + "value": "#bbed3b", + "type": "color" + }, + "v-yg-160": { + "value": "#96cc00", + "type": "color" + }, + "v-yg-180": { + "value": "#7fab00", + "type": "color" } }, - "md": { - "max": { - "value": 1152, - "type": "sizing", - "description": "Small laptops" + "yellow": { + "v-yy-120": { + "value": "#fff766", + "type": "color" + }, + "v-yy-140": { + "value": "#ffee33", + "type": "color" + }, + "v-yy-160": { + "value": "#f5d000", + "type": "color" }, - "min": { - "value": 769, - "type": "sizing", - "description": "Small laptops" + "v-yy-180": { + "value": "#ebba17", + "type": "color" } }, - "lg": { - "max": { - "value": 1722, - "type": "sizing", - "description": "Large laptops and desktop computers" + "orange-yellow": { + "v-oy-120": { + "value": "#ffb54d", + "type": "color" }, - "min": { - "value": 1153, - "type": "sizing", - "description": "Large laptops and desktop computers" + "v-oy-140": { + "value": "#ff9500", + "type": "color" + }, + "v-oy-160": { + "value": "#e68600", + "type": "color" + }, + "v-oy-180": { + "value": "#d17300", + "type": "color" + } + }, + "red-orange": { + "v-ro-120": { + "value": "#ff824d", + "type": "color" + }, + "v-ro-140": { + "value": "#ff4d00", + "type": "color" + }, + "v-ro-160": { + "value": "#de4300", + "type": "color" + }, + "v-ro-180": { + "value": "#c93b00", + "type": "color" + } + }, + "red": { + "v-rr-120": { + "value": "#ff624d", + "type": "color" + }, + "v-rr-140": { + "value": "#ff0015", + "type": "color" + }, + "v-rr-160": { + "value": "#d90012", + "type": "color" + }, + "v-rr-180": { + "value": "#b3000f", + "type": "color" + } + }, + "pink": { + "v-pk-120": { + "value": "#ff66c2", + "type": "color" + }, + "v-pk-140": { + "value": "#ff19a4", + "type": "color" + }, + "v-pk-160": { + "value": "#d11486", + "type": "color" + }, + "v-pk-180": { + "value": "#c00073", + "type": "color" + } + }, + "violet-red": { + "v-vr-120": { + "value": "#ea80ff", + "type": "color" + }, + "v-vr-140": { + "value": "#dd33ff", + "type": "color" + }, + "v-vr-160": { + "value": "#ac08cc", + "type": "color" + }, + "v-vr-180": { + "value": "#83009e", + "type": "color" + } + }, + "violet": { + "v-vv-120": { + "value": "#b580ff", + "type": "color" + }, + "v-vv-140": { + "value": "#974dff", + "type": "color" + }, + "v-vv-160": { + "value": "#8129ff", + "type": "color" + }, + "v-vv-180": { + "value": "#6a0be6", + "type": "color" } } }, - "margin": { - "value": "$core.spacing.9", - "type": "spacing" - }, - "gutter": { - "value": "$core.spacing.7", - "type": "spacing" - }, - "content": { - "fluid": { - "value": "100%", - "type": "sizing", - "description": "for fluid grid widths" + "dark": { + "green": { + "d-gg-410": { + "value": "#44ED51", + "type": "color" + }, + "d-gg-420": { + "value": "#36DA43", + "type": "color" + }, + "d-gg-430": { + "value": "#36DA43", + "type": "color" + } }, - "fixed": { - "value": "1440px", - "type": "sizing", - "description": "only for lg breakpoint fixed grid width" + "yellow": { + "d-yy-410": { + "value": "#FFE24D", + "type": "color" + }, + "d-yy-420": { + "value": "#FFC900", + "type": "color" + }, + "d-yy-430": { + "value": "#F4B000", + "type": "color" + } + }, + "red": { + "d-rr-410": { + "value": "#FF7465", + "type": "color" + }, + "d-rr-420": { + "value": "#FE583E", + "type": "color" + }, + "d-rr-430": { + "value": "#F3381B", + "type": "color" + } + }, + "blue": { + "d-bb-410": { + "value": "#47BBFF", + "type": "color" + }, + "d-bb-420": { + "value": "#00A0FF", + "type": "color" + }, + "d-bb-430": { + "value": "#0087D7", + "type": "color" + } + } + } + }, + "size": { + "default": { + "0": { + "value": "2px", + "type": "sizing" + }, + "1": { + "value": "4px", + "type": "sizing" + }, + "2": { + "value": "6px", + "type": "sizing" + }, + "3": { + "value": "8px", + "type": "sizing" + }, + "4": { + "value": "10px", + "type": "sizing" + }, + "5": { + "value": "12px", + "type": "sizing" + }, + "6": { + "value": "14px", + "type": "sizing" + }, + "7": { + "value": "16px", + "type": "sizing" + }, + "8": { + "value": "20px", + "type": "sizing" + }, + "9": { + "value": "24px", + "type": "sizing" + }, + "10": { + "value": "28px", + "type": "sizing" + }, + "11": { + "value": "32px", + "type": "sizing" + }, + "12": { + "value": "36px", + "type": "sizing" + }, + "13": { + "value": "40px", + "type": "sizing" + }, + "14": { + "value": "44px", + "type": "sizing" + }, + "15": { + "value": "48px", + "type": "sizing" + }, + "16": { + "value": "56px", + "type": "sizing" + }, + "17": { + "value": "64px", + "type": "sizing" + }, + "18": { + "value": "72px", + "type": "sizing" + }, + "19": { + "value": "80px", + "type": "sizing" + }, + "20": { + "value": "96px", + "type": "sizing" + }, + "21": { + "value": "112px", + "type": "sizing" + }, + "22": { + "value": "128px", + "type": "sizing" + }, + "23": { + "value": "144px", + "type": "sizing" + }, + "24": { + "value": "160px", + "type": "sizing" + }, + "25": { + "value": "192px", + "type": "sizing" + }, + "26": { + "value": "224px", + "type": "sizing" + }, + "27": { + "value": "256px", + "type": "sizing" + }, + "28": { + "value": "288px", + "type": "sizing" + }, + "none": { + "value": "0px", + "type": "sizing" } }, - "cols": { - "xs": { - "value": "6", - "type": "other", - "description": "columns" - }, - "sm": { - "value": "12", - "type": "other", - "description": "columns" - }, - "md": { - "value": "24", - "type": "other", - "description": "columns" - }, - "lg": { - "value": "24", - "type": "other", - "description": "columns" + "relative": { + "half": { + "value": "50%", + "type": "sizing" + }, + "full": { + "value": "100%", + "type": "sizing" } } }, + "container-size": { + "0": { + "value": 0, + "type": "sizing" + }, + "154": { + "value": 154, + "type": "sizing" + }, + "320": { + "value": 320, + "type": "sizing" + }, + "328": { + "value": 328, + "type": "sizing" + }, + "476": { + "value": 476, + "type": "sizing" + }, + "504": { + "value": 504, + "type": "sizing" + }, + "678": { + "value": 678, + "type": "sizing" + }, + "768": { + "value": 768, + "type": "sizing" + }, + "854": { + "value": 854, + "type": "sizing" + }, + "1152": { + "value": 1152, + "type": "sizing" + }, + "1440": { + "value": 1440, + "type": "sizing" + } + }, "z-index": { - "deep": { + "0": { "value": "-999999", - "type": "other" + "type": "stacking" }, - "default": { + "1": { "value": "1", - "type": "other" + "type": "stacking" }, - "sticky": { + "3": { "value": "300", - "type": "other" + "type": "stacking" }, - "header": { + "4": { "value": "400", - "type": "other" + "type": "stacking" }, - "toast": { + "5": { "value": "500", - "type": "other" + "type": "stacking" }, - "dropdown": { + "6": { "value": "600", - "type": "other" + "type": "stacking" }, - "overlay": { + "7": { "value": "700", - "type": "other" + "type": "stacking" }, - "modal": { + "8": { "value": "800", - "type": "other" + "type": "stacking" }, - "popup": { + "9": { "value": "900", - "type": "other" - }, - "tooltip": { - "value": "901", - "type": "other" + "type": "stacking" } }, "box-shadow": { @@ -1770,51 +1442,53 @@ "y": "0", "blur": "0", "spread": "0", - "color": "rgba($core.color.neutral.blk-240, $core.opacity.0)", + "color": "rgba({core.color.neutral.blk-240}, {core.opacity.0})", "type": "dropShadow" }, "type": "boxShadow" }, "1": { - "value": [ - { - "x": "0", - "y": "2", - "blur": "8", - "spread": "0", - "color": "rgba($core.color.neutral.blk-240, $core.opacity.4)", - "type": "dropShadow" - }, - { - "x": "0", - "y": "4", - "blur": "16", - "spread": "0", - "color": "rgba($core.color.neutral.blk-240, $core.opacity.8)", - "type": "dropShadow" - } - ], + "value": { + "x": "0", + "y": "2", + "blur": "8", + "spread": "0", + "color": "rgba({core.color.neutral.blk-240}, {core.opacity.4})", + "type": "dropShadow" + }, "type": "boxShadow" }, "2": { - "value": [ - { - "x": "0", - "y": "4", - "blur": "20", - "spread": "0", - "color": "rgba($core.color.neutral.blk-240, $core.opacity.8)", - "type": "dropShadow" - }, - { - "x": "0", - "y": "12", - "blur": "32", - "spread": "-2", - "color": "rgba($core.color.neutral.blk-240, $core.opacity.10)", - "type": "dropShadow" - } - ], + "value": { + "x": "0", + "y": "4", + "blur": "16", + "spread": "0", + "color": "rgba({core.color.neutral.blk-240}, {core.opacity.8})", + "type": "dropShadow" + }, + "type": "boxShadow" + }, + "3": { + "value": { + "x": "0", + "y": "4", + "blur": "20", + "spread": "0", + "color": "rgba({core.color.neutral.blk-240}, {core.opacity.8})", + "type": "dropShadow" + }, + "type": "boxShadow" + }, + "4": { + "value": { + "x": "0", + "y": "12", + "blur": "32", + "spread": "-2", + "color": "rgba({core.color.neutral.blk-240}, {core.opacity.10})", + "type": "dropShadow" + }, "type": "boxShadow" }, "none": { @@ -1823,7 +1497,7 @@ "y": "0", "blur": "0", "spread": "0", - "color": "rgba($core.color.neutral.blk-240, $core.opacity.0)", + "color": "rgba({core.color.neutral.blk-240}, {core.opacity.0})", "type": "dropShadow" }, "type": "boxShadow" diff --git a/packages/calcite-design-tokens/src/index.ts b/packages/calcite-design-tokens/src/index.ts new file mode 100644 index 00000000000..54559e290db --- /dev/null +++ b/packages/calcite-design-tokens/src/index.ts @@ -0,0 +1,35 @@ +import { dirname, resolve } from "path"; +import { fileURLToPath } from "url"; +import { createCalciteTokenFiles } from "../support/token-transformer/helpers/createCalciteTokenFiles.js"; +import { getFiles } from "../support/token-transformer/helpers/getFiles.js"; + +const __filename = fileURLToPath(import.meta.url); +const __dirname = dirname(__filename); + +export const coreTokens = await createCalciteTokenFiles({ + name: "core", + path: resolve(__dirname, "core.json"), +}); + +export const globalTokens = await createCalciteTokenFiles({ + name: "global", + path: resolve(__dirname, "semantic"), + references: coreTokens.source, +}); + +export const componentTokens = await getFiles(resolve(__dirname, "component")).then((components) => + Promise.all( + Object.entries(components).map(([name, path]) => + createCalciteTokenFiles({ + name, + path, + references: globalTokens.source, + options: { + outputReferences: true, + }, + }) + ) + ) +); + +export { config } from "./$config.js"; diff --git a/packages/calcite-design-tokens/src/semantic.json b/packages/calcite-design-tokens/src/semantic.json deleted file mode 100644 index 374ec1f9f50..00000000000 --- a/packages/calcite-design-tokens/src/semantic.json +++ /dev/null @@ -1,1709 +0,0 @@ -{ - "semantic": { - "font": { - "default": { - "light": { - "-3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.0", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "0h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.2", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.5", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.7", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.8", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.fixed.12", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - }, - "regular": { - "-3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.0", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "0h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.2", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.5", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.7", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.8", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.fixed.12", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - }, - "medium": { - "-3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.0", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "0h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.2", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.5", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.7", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.8", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.fixed.12", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - }, - "bold": { - "-3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.0", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "0h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.2", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.3", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.5", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.7", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.8", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.10", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8h": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.fixed.12", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - } - }, - "wrap": { - "light": { - "0": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.light", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - }, - "regular": { - "0": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.regular", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - }, - "medium": { - "0": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.medium", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - }, - "bold": { - "0": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.3", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.4", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.5", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.6", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "4": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.7", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "5": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.8", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "6": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.9", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "7": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.10", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "8": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.tight", - "fontSize": "$core.font.font-size.11", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-3": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.0", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-2": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - }, - "-1": { - "value": { - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.demi", - "lineHeight": "$core.font.line-height.relative.snug", - "fontSize": "$core.font.font-size.2", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textDecoration": "$core.font.text-decoration.none", - "textCase": "$core.font.text-case.none" - }, - "type": "typography" - } - } - }, - "hierarchy": { - "display-1": { - "value": "$semantic.font.wrap.regular.8", - "type": "typography" - }, - "display-2": { - "value": "$semantic.font.wrap.regular.7", - "type": "typography" - }, - "heading-1": { - "value": "$semantic.font.wrap.regular.6", - "type": "typography" - }, - "heading-2": { - "value": "$semantic.font.wrap.regular.5", - "type": "typography" - }, - "heading-3": { - "value": "$semantic.font.wrap.regular.4", - "type": "typography" - }, - "heading-4": { - "value": "$semantic.font.wrap.regular.3", - "type": "typography" - }, - "heading-5": { - "value": "$semantic.font.wrap.regular.2", - "type": "typography" - }, - "heading-6": { - "value": "$semantic.font.wrap.regular.1", - "type": "typography" - }, - "body-1": { - "value": "$semantic.font.wrap.regular.0", - "type": "typography" - }, - "body-2": { - "value": "$semantic.font.wrap.regular.-1", - "type": "typography" - }, - "overline": { - "value": { - "fontFamilies": "$core.font.font-family.primary", - "fontWeights": "$core.font.font-weight.bold", - "fontSizes": "$core.font.font-size.2", - "lineHeights": "$core.font.line-height.fixed.1", - "letterSpacing": "$core.font.letter-spacing.normal", - "paragraphSpacing": "$core.font.paragraph-spacing.normal", - "textCase": "$core.font.text-case.uppercase", - "textDecoration": "$core.font.text-decoration.none", - "fontFamily": "$core.font.font-family.primary", - "fontWeight": "$core.font.font-weight.bold", - "lineHeight": "$core.font.line-height.fixed.1", - "fontSize": "$core.font.font-size.2" - }, - "type": "typography" - }, - "caption": { - "value": "$semantic.font.wrap.regular.-2", - "type": "typography" - } - } - }, - "border": { - "border-radius": { - "sharp": { - "value": "$core.border.border-radius.none", - "type": "borderRadius" - }, - "round": { - "value": "$core.border.border-radius.1", - "type": "borderRadius" - }, - "circular": { - "value": "$core.border.border-radius.half", - "type": "borderRadius" - }, - "pill": { - "value": "$core.border.border-radius.full", - "type": "borderRadius" - } - } - }, - "ui": { - "border": { - "border-radius": { - "value": "$semantic.border.border-radius.sharp", - "type": "borderRadius" - } - }, - "color": { - "brand": { - "default": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-060", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.blue.v-bb-160", - "type": "color" - } - }, - "hover": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-070", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.high-saturation.blue.h-bb-060", - "type": "color" - } - }, - "press": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-080", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.high-saturation.blue.h-bb-070", - "type": "color" - } - } - }, - "background": { - "light": { - "value": "$core.color.neutral.blk-005", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-190", - "type": "color" - } - }, - "foreground": { - "1": { - "light": { - "value": "$core.color.neutral.blk-000", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-200", - "type": "color" - } - }, - "2": { - "light": { - "value": "$core.color.neutral.blk-010", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-210", - "type": "color" - } - }, - "3": { - "light": { - "value": "$core.color.neutral.blk-020", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-220", - "type": "color" - } - }, - "current": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-010", - "type": "color" - }, - "dark": { - "value": "#214155", - "type": "color" - } - } - }, - "text": { - "1": { - "light": { - "value": "$core.color.neutral.blk-220", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-000", - "type": "color" - } - }, - "2": { - "light": { - "value": "$core.color.neutral.blk-170", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-060", - "type": "color" - } - }, - "3": { - "light": { - "value": "$core.color.neutral.blk-140", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-090", - "type": "color" - } - }, - "inverse": { - "light": { - "value": "$core.color.neutral.blk-000", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-220", - "type": "color" - } - }, - "link": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-070", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.dark.blue.d-bb-420", - "type": "color" - } - } - }, - "border": { - "1": { - "light": { - "value": "$core.color.neutral.blk-050", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-160", - "type": "color" - } - }, - "2": { - "light": { - "value": "$core.color.neutral.blk-040", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-170", - "type": "color" - } - }, - "3": { - "light": { - "value": "$core.color.neutral.blk-030", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-180", - "type": "color" - } - }, - "input": { - "light": { - "value": "$core.color.neutral.blk-100", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-130", - "type": "color" - } - } - }, - "info": { - "default": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-070", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.dark.blue.d-bb-420", - "type": "color" - } - }, - "hover": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-080", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.blue.v-bb-140", - "type": "color" - } - }, - "press": { - "light": { - "value": "$core.color.palette.high-saturation.blue.h-bb-090", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.blue.v-bb-160", - "type": "color" - } - } - }, - "success": { - "default": { - "light": { - "value": "$core.color.palette.high-saturation.green.h-gg-060", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.dark.green.d-gg-420", - "type": "color" - } - }, - "hover": { - "light": { - "value": "$core.color.palette.high-saturation.green.h-gg-070", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.green.v-gg-140", - "type": "color" - } - }, - "press": { - "light": { - "value": "$core.color.palette.high-saturation.green.h-gg-080", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.green.v-gg-160", - "type": "color" - } - } - }, - "warning": { - "default": { - "light": { - "value": "$core.color.palette.high-saturation.yellow.h-yy-060", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.dark.yellow.d-yy-420", - "type": "color" - } - }, - "hover": { - "light": { - "value": "$core.color.palette.high-saturation.yellow.h-yy-070", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.yellow.v-yy-140", - "type": "color" - } - }, - "press": { - "light": { - "value": "$core.color.palette.high-saturation.yellow.h-yy-080", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.yellow.v-yy-160", - "type": "color" - } - } - }, - "danger": { - "default": { - "light": { - "value": "$core.color.palette.high-saturation.red.h-rr-060", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.dark.red.d-rr-420", - "type": "color" - } - }, - "hover": { - "light": { - "value": "$core.color.palette.high-saturation.red.h-rr-070", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.red.v-rr-140", - "type": "color" - } - }, - "press": { - "light": { - "value": "$core.color.palette.high-saturation.red.h-rr-080", - "type": "color" - }, - "dark": { - "value": "$core.color.palette.vibrant.red.v-rr-160", - "type": "color" - } - } - }, - "inverse": { - "light": { - "value": "$core.color.neutral.blk-190", - "type": "color" - }, - "dark": { - "value": "$core.color.neutral.blk-005", - "type": "color" - } - } - } - }, - "spacing": { - "base": { - "value": "$core.spacing.0", - "type": "spacing" - }, - "xs": { - "value": "$semantic.spacing.base * 2", - "type": "spacing" - }, - "sm": { - "value": "$semantic.spacing.base * 4", - "type": "spacing" - }, - "md": { - "value": "$semantic.spacing.base *6", - "type": "spacing" - }, - "lg": { - "value": "$semantic.spacing.base * 8", - "type": "spacing" - }, - "xl": { - "value": "$semantic.spacing.base *10", - "type": "spacing" - } - } - } -} diff --git a/packages/calcite-design-tokens/src/semantic/border.json b/packages/calcite-design-tokens/src/semantic/border.json new file mode 100644 index 00000000000..52d2026cfd8 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/border.json @@ -0,0 +1,66 @@ +{ + "semantic": { + "border": { + "radius": { + "default": { + "value": "{core.size.default.none}", + "type": "borderRadius" + }, + "none": { + "value": "{core.size.default.none}", + "type": "borderRadius" + }, + "sharp": { + "value": "{core.size.default.none}", + "type": "borderRadius" + }, + "round": { + "value": "{core.size.default.1}", + "type": "borderRadius" + }, + "circular": { + "value": "{core.size.relative.half}", + "type": "borderRadius" + }, + "pill": { + "value": "{core.size.relative.full}", + "type": "borderRadius" + }, + "sm": { + "value": "{core.size.default.1}", + "type": "borderRadius" + }, + "md": { + "value": "{core.size.default.5}", + "type": "borderRadius" + }, + "lg": { + "value": "{core.size.default.7}", + "type": "borderRadius" + }, + "xl": { + "value": "{core.size.default.9}", + "type": "borderRadius" + } + }, + "width": { + "none": { + "value": "{core.size.default.none}", + "type": "borderWidth" + }, + "sm": { + "value": "{core.size.default.0} - 1", + "type": "borderWidth" + }, + "md": { + "value": "{core.size.default.0}", + "type": "borderWidth" + }, + "lg": { + "value": "{core.size.default.1}", + "type": "borderWidth" + } + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/box-shadow.json b/packages/calcite-design-tokens/src/semantic/box-shadow.json new file mode 100644 index 00000000000..7acbff1bf88 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/box-shadow.json @@ -0,0 +1,18 @@ +{ + "semantic": { + "box-shadow": { + "none": { + "value": "{core.box-shadow.0}", + "type": "boxShadow" + }, + "sm": { + "value": ["{core.box-shadow.1}", "{core.box-shadow.2}"], + "type": "boxShadow" + }, + "md": { + "value": ["{core.box-shadow.3}", "{core.box-shadow.4}"], + "type": "boxShadow" + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/color.json b/packages/calcite-design-tokens/src/semantic/color.json new file mode 100644 index 00000000000..0e2eae728a1 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/color.json @@ -0,0 +1,272 @@ +{ + "semantic": { + "color": { + "brand": { + "default": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-060}", + "dark": "{core.color.vibrant.blue.v-bb-160}" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-070}", + "dark": "{core.color.high-saturation.blue.h-bb-060}" + }, + "type": "color" + }, + "press": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-080}", + "dark": "{core.color.high-saturation.blue.h-bb-070}" + }, + "type": "color" + }, + "underline": { + "type": "color", + "value": { + "light": "rgba({core.color.high-saturation.blue.h-bb-070}, {core.opacity.40})", + "dark": "rgba({core.color.dark.blue.d-bb-420}, {core.opacity.40})" + } + } + }, + "background": { + "default": { + "value": { + "light": "{core.color.neutral.blk-005}", + "dark": "{core.color.neutral.blk-190}" + }, + "type": "color" + }, + "transparent": { + "default": { + "value": { + "light": "rgba({core.color.neutral.blk-000}, {core.opacity.0})", + "dark": "rgba({core.color.neutral.blk-240}, {core.opacity.0})" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "rgba({core.color.neutral.blk-240}, {core.opacity.4})", + "dark": "rgba({core.color.neutral.blk-000}, {core.opacity.4})" + }, + "type": "color" + }, + "press": { + "value": { + "light": "rgba({core.color.neutral.blk-240}, {core.opacity.8})", + "dark": "rgba({core.color.neutral.blk-000}, {core.opacity.8})" + }, + "type": "color" + }, + "scrim": { + "value": { + "light": "rgba({core.color.neutral.blk-000}, {core.opacity.85})", + "dark": "rgba({core.color.neutral.blk-240}, {core.opacity.85})" + }, + "type": "color" + }, + "dismiss": { + "value": { + "light": "rgba({core.color.neutral.blk-000}, {core.opacity.80})", + "dark": "rgba({core.color.neutral.blk-200}, {core.opacity.80})" + }, + "type": "color" + } + }, + "none": { + "value": "rgba({core.color.neutral.blk-000}, {core.opacity.0})", + "type": "color" + } + }, + "foreground": { + "1": { + "value": { + "light": "{core.color.neutral.blk-000}", + "dark": "{core.color.neutral.blk-200}" + }, + "type": "color" + }, + "2": { + "value": { + "light": "{core.color.neutral.blk-010}", + "dark": "{core.color.neutral.blk-210}" + }, + "type": "color" + }, + "3": { + "value": { "light": "{core.color.neutral.blk-020}", "dark": "{core.color.neutral.blk-220}" }, + "type": "color" + }, + + "current": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-010}", + "dark": "#214155" + }, + "type": "color" + } + }, + "text": { + "1": { + "value": { "light": "{core.color.neutral.blk-220}", "dark": "{core.color.neutral.blk-000}" }, + "type": "color" + }, + "2": { + "value": { "light": "{core.color.neutral.blk-170}", "dark": "{core.color.neutral.blk-060}" }, + "type": "color" + }, + "3": { + "value": { "light": "{core.color.neutral.blk-140}", "dark": "{core.color.neutral.blk-090}" }, + "type": "color" + }, + "inverse": { + "value": { "light": "{core.color.neutral.blk-000}", "dark": "{core.color.neutral.blk-220}" }, + "type": "color" + }, + "link": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-070}", + "dark": "{core.color.dark.blue.d-bb-420}" + }, + "type": "color" + } + }, + "border": { + "1": { + "value": { "light": "{core.color.neutral.blk-050}", "dark": "{core.color.neutral.blk-160}" }, + "type": "color" + }, + "2": { + "value": { "light": "{core.color.neutral.blk-040}", "dark": "{core.color.neutral.blk-170}" }, + "type": "color" + }, + "3": { + "value": { "light": "{core.color.neutral.blk-030}", "dark": "{core.color.neutral.blk-180}" }, + "type": "color" + }, + "input": { + "value": { "light": "{core.color.neutral.blk-100}", "dark": "{core.color.neutral.blk-130}" }, + "type": "color" + } + }, + "info": { + "default": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-070}", + "dark": "{core.color.dark.blue.d-bb-420}" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-080}", + "dark": "{core.color.vibrant.blue.v-bb-140}" + }, + "type": "color" + }, + "press": { + "value": { + "light": "{core.color.high-saturation.blue.h-bb-090}", + "dark": "{core.color.vibrant.blue.v-bb-160}" + }, + "type": "color" + } + }, + "success": { + "default": { + "value": { + "light": "{core.color.high-saturation.green.h-gg-060}", + "dark": "{core.color.dark.green.d-gg-420}" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "{core.color.high-saturation.green.h-gg-070}", + "dark": "{core.color.vibrant.green.v-gg-140}" + }, + "type": "color" + }, + "press": { + "value": { + "light": "{core.color.high-saturation.green.h-gg-080}", + "dark": "{core.color.vibrant.green.v-gg-160}" + }, + "type": "color" + } + }, + "warning": { + "default": { + "value": { + "light": "{core.color.high-saturation.yellow.h-yy-060}", + "dark": "{core.color.dark.yellow.d-yy-420}" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "{core.color.high-saturation.yellow.h-yy-070}", + "dark": "{core.color.vibrant.yellow.v-yy-140}" + }, + "type": "color" + }, + "press": { + "value": { + "light": "{core.color.high-saturation.yellow.h-yy-080}", + "dark": "{core.color.vibrant.yellow.v-yy-160}" + }, + "type": "color" + } + }, + "danger": { + "default": { + "value": { + "light": "{core.color.high-saturation.red.h-rr-060}", + "dark": "{core.color.dark.red.d-rr-420}" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "{core.color.high-saturation.red.h-rr-070}", + "dark": "{core.color.vibrant.red.v-rr-140}" + }, + "type": "color" + }, + "press": { + "value": { + "light": "{core.color.high-saturation.red.h-rr-080}", + "dark": "{core.color.vibrant.red.v-rr-160}" + }, + "type": "color" + } + }, + "inverse": { + "default": { + "value": { + "light": "{core.color.neutral.blk-190}", + "dark": "{core.color.neutral.blk-005}" + }, + "type": "color" + }, + "hover": { + "value": { + "light": "{core.color.neutral.blk-200}", + "dark": "{core.color.neutral.blk-000}" + }, + "type": "color" + }, + "press": { + "value": { + "light": "{core.color.neutral.blk-210}", + "dark": "{core.color.neutral.blk-010}" + }, + "type": "color" + } + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/container-size.json b/packages/calcite-design-tokens/src/semantic/container-size.json new file mode 100644 index 00000000000..a8a25281a90 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/container-size.json @@ -0,0 +1,124 @@ +{ + "semantic": { + "container-size": { + "height": { + "xxs": { + "value": { + "min": "0", + "max": "{core.container-size.154}" + }, + "type": "breakpoint", + "description": "Small handheld devices and mini-windows" + }, + "xs": { + "value": { + "min": "{core.container-size.154} + 1", + "max": "{core.container-size.328}" + }, + "type": "breakpoint", + "description": "Handheld devices" + }, + "sm": { + "value": { + "min": "{core.container-size.328} + 1", + "max": "{core.container-size.504}" + }, + "type": "breakpoint", + "description": "Small tablets" + }, + "md": { + "value": { + "min": "{core.container-size.504} + 1", + "max": "{core.container-size.678}" + }, + "type": "breakpoint", + "description": "Small laptops" + }, + "lg": { + "value": { + "min": "{core.container-size.678} + 1", + "max": "{core.container-size.854}" + }, + "type": "breakpoint", + "description": "Large laptops and desktop computers" + }, + "xl": { + "value": { + "min": "{core.container-size.854} + 1" + }, + "type": "breakpoint", + "description": "Projectors and televisions" + } + }, + "width": { + "xxs": { + "value": { + "min": 0, + "max": "{core.container-size.320}" + }, + "type": "breakpoint", + "description": "Small handheld devices and mini-windows" + }, + "xs": { + "value": { + "min": "{core.container-size.320} + 1", + "max": "{core.container-size.476}" + }, + "type": "breakpoint", + "description": "Handheld devices" + }, + "sm": { + "value": { + "min": "{core.container-size.476} + 1", + "max": "{core.container-size.768}" + }, + "type": "breakpoint", + "description": "Small tablets" + }, + "md": { + "value": { + "min": "{core.container-size.768} + 1", + "max": "{core.container-size.1152}" + }, + "type": "breakpoint", + "description": "Small laptops" + }, + "lg": { + "value": { + "min": "{core.container-size.1152} + 1", + "max": "{core.container-size.1440}" + }, + "type": "breakpoint", + "description": "Large laptops and desktop computers" + }, + "xl": { + "value": { + "min": "{core.container-size.1440} + 1" + }, + "type": "breakpoint", + "description": "Projectors and televisions" + } + }, + "margin": { + "value": "{core.size.default.9}", + "type": "spacing" + }, + "gutter": { + "value": "{core.size.default.7}", + "type": "spacing" + }, + "content": { + "fluid": { + "value": "{core.size.relative.full}", + "type": "sizing", + "description": "for fluid grid widths" + }, + "fixed": { + "value": "{core.container-size.1440}", + "type": "sizing", + "description": "only for lg breakpoint fixed grid width" + } + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/font.json b/packages/calcite-design-tokens/src/semantic/font.json new file mode 100644 index 00000000000..b17812741cd --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/font.json @@ -0,0 +1,180 @@ +{ + "semantic": { + "font": { + "family": { + "default": { + "value": "{core.font.family.primary}", + "type": "fontFamilies" + } + }, + "weight": { + "light": { + "value": "{core.font.weight.light}", + "type": "fontWeights", + "description": "For Avenir Next World (secondary font family)" + }, + "normal": { + "value": "{core.font.weight.regular}", + "type": "fontWeights", + "description": "For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word \"regular\"", + "extensions": { + "calcite.deprecated": true + } + }, + "regular": { + "value": "{core.font.weight.regular}", + "type": "fontWeights" + }, + "medium": { + "value": "{core.font.weight.medium}", + "type": "fontWeights" + }, + "semibold": { + "value": "{core.font.weight.demi}", + "type": "fontWeights" + }, + "bold": { + "value": "{core.font.weight.bold}", + "type": "fontWeights" + } + }, + "size": { + "xs": { + "value": "{core.size.default.4}", + "type": "fontSizes" + }, + "sm": { + "value": "{core.size.default.5}", + "type": "fontSizes" + }, + "default": { + "value": "{core.size.default.6}", + "type": "fontSizes" + }, + "md": { + "value": "{core.size.default.7}", + "type": "fontSizes" + }, + "lg": { + "value": "{core.size.default.0} * 9", + "type": "fontSizes" + }, + "xl": { + "value": "{core.size.default.8}", + "type": "fontSizes" + }, + "xxl": { + "value": "{core.size.default.9}", + "type": "fontSizes" + } + }, + "style": { + "emphasis": { + "value": "{core.font.style.italic}", + "type": "fontStyle", + "description": "used in ratings" + } + }, + "line-height": { + "fixed": { + "sm": { + "value": "{core.size.default.5}", + "type": "lineHeights" + }, + "base": { + "value": "{core.size.default.7}", + "type": "lineHeights" + }, + "lg": { + "value": "{core.size.default.8}", + "type": "lineHeights" + }, + "xl": { + "value": "{core.size.default.9}", + "type": "lineHeights" + } + }, + "relative": { + "default": { + "value": "{core.font.line-height.relative.default}", + "type": "lineHeights", + "description": "1" + }, + "tight": { + "value": "{core.font.line-height.relative.tight}", + "type": "lineHeights", + "description": "1.25" + }, + "snug": { + "value": "{core.font.line-height.relative.snug}", + "type": "lineHeights", + "description": "1.375" + }, + "normal": { + "value": "{core.font.line-height.relative.normal}", + "type": "lineHeights", + "description": "1.5" + }, + "relaxed": { + "value": "{core.font.line-height.relative.relaxed}", + "type": "lineHeights", + "description": "1.625" + }, + "loose": { + "value": "{core.font.line-height.relative.loose}", + "type": "lineHeights", + "description": "2" + } + } + }, + "letter-spacing": { + "tight": { + "value": "{core.font.letter-spacing.tight}", + "type": "letterSpacing" + }, + "normal": { + "value": "{core.font.letter-spacing.normal}", + "type": "letterSpacing" + }, + "wide": { + "value": "{core.font.letter-spacing.wide}", + "type": "letterSpacing" + } + }, + "paragraph-spacing": { + "normal": { + "value": "{core.font.paragraph-spacing.normal}", + "type": "paragraphSpacing" + } + }, + "text-decoration": { + "none": { + "value": "{core.font.text-decoration.none}", + "type": "textDecoration" + }, + "underline": { + "value": "{core.font.text-decoration.underline}", + "type": "textDecoration" + } + }, + "text-case": { + "none": { + "value": "{core.font.text-case.none}", + "type": "textCase" + }, + "uppercase": { + "value": "{core.font.text-case.uppercase}", + "type": "textCase" + }, + "lowercase": { + "value": "{core.font.text-case.lowercase}", + "type": "textCase" + }, + "capitalize": { + "value": "{core.font.text-case.capitalize}", + "type": "textCase" + } + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/opacity.json b/packages/calcite-design-tokens/src/semantic/opacity.json new file mode 100644 index 00000000000..763dbf108d5 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/opacity.json @@ -0,0 +1,26 @@ +{ + "semantic": { + "opacity": { + "light": { + "value": "{core.opacity.40}", + "type": "opacity" + }, + "half": { + "value": "{core.opacity.50}", + "type": "opacity" + }, + "dark": { + "value": "{core.opacity.85}", + "type": "opacity" + }, + "full": { + "value": "{core.opacity.100}", + "type": "opacity" + }, + "disabled": { + "value": "{core.opacity.50}", + "type": "opacity" + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/sizing.json b/packages/calcite-design-tokens/src/semantic/sizing.json new file mode 100644 index 00000000000..fd70d793e44 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/sizing.json @@ -0,0 +1,66 @@ +{ + "semantic": { + "size": { + "xxxs": { + "value": "{core.size.default.0}", + "type": "spacing" + }, + "xxs": { + "value": "{core.size.default.1}", + "type": "spacing" + }, + "xs": { + "value": "{core.size.default.2}", + "type": "spacing" + }, + "sm": { + "value": "{core.size.default.3}", + "type": "spacing" + }, + "sm-md": { + "value": "{core.size.default.4}", + "type": "spacing" + }, + "md-sm": { + "value": "{core.size.default.5}", + "type": "spacing" + }, + "md": { + "value": "{core.size.default.6}", + "type": "spacing" + }, + "md-lg": { + "value": "{core.size.default.7}", + "type": "spacing" + }, + "lg-md": { + "value": "{core.size.default.8}", + "type": "spacing" + }, + "lg": { + "value": "{core.size.default.9}", + "type": "spacing" + }, + "lg-xl": { + "value": "{core.size.default.11}", + "type": "spacing" + }, + "xl-lg": { + "value": "{core.size.default.14}", + "type": "spacing" + }, + "xl": { + "value": "{core.size.default.15}", + "type": "spacing" + }, + "xxl": { + "value": "{core.size.default.17}", + "type": "spacing" + }, + "xxxl": { + "value": "{core.size.default.20}", + "type": "spacing" + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/spacing.json b/packages/calcite-design-tokens/src/semantic/spacing.json new file mode 100644 index 00000000000..07475eff0ac --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/spacing.json @@ -0,0 +1,42 @@ +{ + "semantic": { + "spacing": { + "none": { + "value": "{core.size.default.none}", + "type": "spacing" + }, + "base": { + "value": "{core.size.default.0}", + "type": "spacing" + }, + "half": { + "value": "{core.size.default.2}", + "type": "spacing" + }, + "double": { + "value": "{core.size.default.8}", + "type": "spacing" + }, + "xs": { + "value": "{core.size.default.1}", + "type": "spacing" + }, + "sm": { + "value": "{core.size.default.3}", + "type": "spacing" + }, + "md": { + "value": "{core.size.default.5}", + "type": "spacing" + }, + "lg": { + "value": "{core.size.default.7}", + "type": "spacing" + }, + "xl": { + "value": "{core.size.default.8}", + "type": "spacing" + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/typography.json b/packages/calcite-design-tokens/src/semantic/typography.json new file mode 100644 index 00000000000..896be564ea7 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/typography.json @@ -0,0 +1,549 @@ +{ + "semantic": { + "typography": { + "default": { + "default": { + "type": "typography", + "value": { + "fontFamily": "{semantic.font.family.default}", + "fontSize": "{semantic.font.size.default}", + "fontWeight": "{semantic.font.weight.regular}", + "letterSpacing": "{semantic.font.letter-spacing.normal}", + "lineHeight": "{semantic.font.line-height.fixed.base}", + "paragraphSpacing": "{semantic.font.paragraph-spacing.normal}", + "textCase": "{semantic.font.text-case.none}", + "textDecoration": "{semantic.font.text-decoration.none}" + } + }, + "light": { + "-3h": { + "value": { + "fontSize": "{semantic.font.size.xs}", + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.fixed.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-2h": { + "value": { + "fontSize": "{semantic.font.size.sm}", + "fontWeight": "{semantic.font.weight.light}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1h": { + "value": { + "fontWeight": "{semantic.font.weight.light}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "0h": { + "value": { + "fontSize": "{semantic.font.size.md}", + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.fixed.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1h": { + "value": { + "fontSize": "{semantic.font.size.lg}", + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.fixed.xl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + }, + "regular": { + "-3h": { + "value": { + "lineHeight": "{semantic.font.line-height.fixed.sm}", + "fontSize": "{semantic.font.size.xs}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-2h": { + "value": { + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1h": { + "value": "{semantic.typography.default.default}", + "type": "typography" + }, + "0h": { + "value": { + "lineHeight": "{semantic.font.line-height.fixed.lg}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1h": { + "value": { + "lineHeight": "{semantic.font.line-height.fixed.xl}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + }, + "medium": { + "-3h": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.fixed.sm}", + "fontSize": "{semantic.font.size.xs}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-2h": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1h": { + "value": { + "fontWeight": "{semantic.font.weight.medium}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "0h": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.fixed.lg}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1h": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.fixed.xl}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + }, + "bold": { + "-3h": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.fixed.sm}", + "fontSize": "{semantic.font.size.xs}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-2h": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1h": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "0h": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.fixed.lg}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1h": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.fixed.xl}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + } + }, + "wrap": { + "light": { + "-2": { + "value": { + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1": { + "value": { + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.relative.snug}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + + "0": { + "value": { + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1": { + "value": { + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "2": { + "value": { + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "3": { + "value": { + "fontWeight": "{semantic.font.weight.light}", + "lineHeight": "{semantic.font.line-height.relative.tight}", + "fontSize": "{semantic.font.size.xxl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + }, + "regular": { + "-2": { + "value": { + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1": { + "value": { + "lineHeight": "{semantic.font.line-height.relative.snug}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "0": { + "value": { + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1": { + "value": { + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "2": { + "value": { + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "3": { + "value": { + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xxl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + }, + "medium": { + "-2": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.relative.snug}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "0": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "2": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "3": { + "value": { + "fontWeight": "{semantic.font.weight.medium}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xxl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + }, + "bold": { + "0": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.md}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "1": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.lg}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "2": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "3": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.xxl}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-2": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.relative.snug}", + "fontSize": "{semantic.font.size.sm}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + }, + "-1": { + "value": { + "fontWeight": "{semantic.font.weight.semibold}", + "lineHeight": "{semantic.font.line-height.relative.snug}" + }, + "type": "typography", + "extensions": { + "calcite.extends": "{semantic.typography.default.default}" + } + } + } + }, + "hierarchy": { + "display": { + "1": { + "value": "{semantic.typography.wrap.bold.3}", + "type": "typography" + }, + "2": { + "value": "{semantic.typography.wrap.bold.2}", + "type": "typography" + } + }, + "heading": { + "1": { + "value": "{semantic.typography.wrap.medium.3}", + "type": "typography" + }, + "2": { + "value": "{semantic.typography.wrap.medium.2}", + "type": "typography" + }, + "3": { + "value": "{semantic.typography.wrap.medium.1}", + "type": "typography" + }, + "4": { + "value": "{semantic.typography.wrap.medium.0}", + "type": "typography" + }, + "5": { + "value": "{semantic.typography.wrap.medium.-1}", + "type": "typography" + } + }, + "body": { + "snug": { + "value": "{semantic.typography.wrap.regular.-1}", + "type": "typography" + }, + "default": { + "value": "{semantic.typography.default.default}", + "type": "typography" + } + }, + "overline": { + "value": { + "lineHeight": "{semantic.font.line-height.fixed.sm}", + "textCase": "{semantic.font.text-case.uppercase}", + "fontWeight": "{semantic.font.weight.bold}" + }, + "type": "typography" + }, + "caption": { + "value": "{semantic.typography.wrap.regular.-2}", + "type": "typography" + } + } + } + } +} diff --git a/packages/calcite-design-tokens/src/semantic/z-index.json b/packages/calcite-design-tokens/src/semantic/z-index.json new file mode 100644 index 00000000000..32f793ed0e8 --- /dev/null +++ b/packages/calcite-design-tokens/src/semantic/z-index.json @@ -0,0 +1,46 @@ +{ + "semantic": { + "z-index": { + "deep": { + "value": "{core.z-index.0}", + "type": "stacking" + }, + "default": { + "value": "{core.z-index.1}", + "type": "stacking" + }, + "sticky": { + "value": "{core.z-index.3}", + "type": "stacking" + }, + "header": { + "value": "{core.z-index.4}", + "type": "stacking" + }, + "toast": { + "value": "{core.z-index.5}", + "type": "stacking" + }, + "dropdown": { + "value": "{core.z-index.6}", + "type": "stacking" + }, + "overlay": { + "value": "{core.z-index.7}", + "type": "stacking" + }, + "modal": { + "value": "{core.z-index.8}", + "type": "stacking" + }, + "popup": { + "value": "{core.z-index.9}", + "type": "stacking" + }, + "tooltip": { + "value": "{core.z-index.9} + 1", + "type": "stacking" + } + } + } +} diff --git a/packages/calcite-design-tokens/support/run.ts b/packages/calcite-design-tokens/support/run.ts index 1854a79f78e..6aaf6183b4c 100644 --- a/packages/calcite-design-tokens/support/run.ts +++ b/packages/calcite-design-tokens/support/run.ts @@ -1,16 +1,17 @@ -import { readFileSync } from "fs"; -import { resolve, dirname } from "path"; -import { fileURLToPath } from "url"; -import { getThemes } from "./token-transformer/getThemes.js"; -import { run } from "./token-transformer/sd-run.js"; +import { run as styleDictionaryRunner } from "./token-transformer/sd-run.js"; +import { config } from "../src/$config.js"; +import { CalciteTokenTransformConfig } from "./types/config.js"; -const __filename = fileURLToPath(import.meta.url); -const __dirname = dirname(__filename); +const runConfig: CalciteTokenTransformConfig = config; -/** - * Get all themes defined int the tokens/$themes.json and generate a Style Dictionary output for each theme - */ -const rawData = readFileSync(resolve(__dirname, "../src/$themes.json"), { encoding: "utf-8" }); -const data = JSON.parse(rawData); - -getThemes(data).then((themes) => Promise.all(themes.map((theme) => run("src", "dist", theme)))); +Promise.all( + runConfig.files.map(({ name, source, references, options }) => + styleDictionaryRunner({ + name: name, + source: source, + include: references, + options: { ...runConfig.options, ...options }, + output: config.output, + }) + ) +); diff --git a/packages/calcite-design-tokens/support/test/mock/src/global.json b/packages/calcite-design-tokens/support/test/mock/src/global.json new file mode 100644 index 00000000000..5b230a5d532 --- /dev/null +++ b/packages/calcite-design-tokens/support/test/mock/src/global.json @@ -0,0 +1,11 @@ +{ + "core": { + "group": { + "property": { + "value": "token", + "type": "other", + "description": "A mock token used for testing" + } + } + } +} diff --git a/packages/calcite-design-tokens/support/test/utils/registerStyleDictionaryFunction.ts b/packages/calcite-design-tokens/support/test/utils/registerStyleDictionaryFunction.ts new file mode 100644 index 00000000000..f96e9fad7f0 --- /dev/null +++ b/packages/calcite-design-tokens/support/test/utils/registerStyleDictionaryFunction.ts @@ -0,0 +1,20 @@ +import { jest } from "@jest/globals"; +import { Core as StyleDictionary } from "style-dictionary"; + +export const registerStyleDictionaryTransform = (fn: (sd: StyleDictionary) => void): void => { + const registerTransform = jest.fn(); + fn({ registerTransform } as unknown as StyleDictionary); + expect(registerTransform).toHaveBeenCalled(); +}; + +export const registerStyleDictionaryFilter = (fn: (sd: StyleDictionary) => void): void => { + const registerFilter = jest.fn(); + fn({ registerFilter } as unknown as StyleDictionary); + expect(registerFilter).toHaveBeenCalled(); +}; + +export const registerStyleDictionaryParser = (fn: (sd: StyleDictionary) => void): void => { + const registerParser = jest.fn(); + fn({ registerParser } as unknown as StyleDictionary); + expect(registerParser).toHaveBeenCalled(); +}; diff --git a/packages/calcite-design-tokens/support/token-transformer/format/javascript.ts b/packages/calcite-design-tokens/support/token-transformer/format/javascript.ts deleted file mode 100644 index b7f715d40fa..00000000000 --- a/packages/calcite-design-tokens/support/token-transformer/format/javascript.ts +++ /dev/null @@ -1,22 +0,0 @@ -import StyleDictionary, { Dictionary, File } from "style-dictionary"; -import { default as JsonToTS } from "json-to-ts"; - -type FormatOptions = { dictionary: Dictionary; file: File }; - -export function formatJs({ dictionary, file }: FormatOptions): string { - return ( - StyleDictionary.formatHelpers.fileHeader({ file }) + - "export default" + - JSON.stringify(dictionary.tokens, null, 2) + - ";\n" - ); -} - -export function formatTs({ dictionary, file }: FormatOptions): string { - return ( - StyleDictionary.formatHelpers.fileHeader({ file }) + - "declare const root: RootObject\n" + - "export default root\n" + - JsonToTS(dictionary.properties).join("\n") - ); -} diff --git a/packages/calcite-design-tokens/support/token-transformer/format/scss.ts b/packages/calcite-design-tokens/support/token-transformer/format/scss.ts deleted file mode 100644 index 279a35a81b0..00000000000 --- a/packages/calcite-design-tokens/support/token-transformer/format/scss.ts +++ /dev/null @@ -1,81 +0,0 @@ -import { pascalCase, sentenceCase } from "change-case"; -import StyleDictionary, { Dictionary, File, Platform, Options } from "style-dictionary"; -import { sortAllTokens } from "../utils/sortAllTokens.js"; - -const regexThemeGroup = /calcite|brand/gi; -const regexFileNameWithoutExtension = /\w+(?=\.\w+$)/gi; - -/** - * Exports SCSS style formats - * - * @param {object} fileInfo the file object - * @param {Dictionary} fileInfo.dictionary the Style Dictionary object - * @param {File} fileInfo.file information about the file to be generated - * @param {Platform} [fileInfo.platform] the platform to generate the asset for - * @param {Options} fileInfo.options the Style Dictionary format options passed from the config - * @returns {string} a string that is passed to fs.writeFileSync - */ -export function formatSCSS(fileInfo: { - dictionary: Dictionary; - file: File; - platform?: Platform; - options: Options & { themeable?: boolean }; -}): string { - const { dictionary, file, options } = fileInfo; - const { outputReferences } = options; - const themeName = pascalCase( - sentenceCase(file.destination.match(regexFileNameWithoutExtension)[0]) - .split(" ") - .filter((n) => !regexThemeGroup.test(n)) - .join(" ") - ).toLowerCase(); - const sassProps = StyleDictionary.formatHelpers.createPropertyFormatter({ - outputReferences, - dictionary, - format: "sass", - }); - const cssProps = StyleDictionary.formatHelpers.createPropertyFormatter({ - outputReferences, - dictionary, - format: "css", - }); - const sortedTokens = sortAllTokens(dictionary, outputReferences); - const coreTokens = [...sortedTokens].reduce( - (acc, token) => { - token.value = token.value.includes(" ") ? `"${token.value}"` : token.value === "Demi" ? 600 : token.value; - acc[1].push(cssProps(token)); - - if (token.filePath.includes("core")) { - const sassToken = { ...token }; - const path = sassToken.path.filter((p) => !/(core|default|font$)/.test(p)); - sassToken.name = sassToken.type === "color" ? path.slice(-1).join("-") : path.join("-"); - sassToken.original.value = sassToken.original.value[0] === "{" ? sassToken.value : sassToken.original.value; - acc[0].push(sassProps(sassToken)); - } - - if (/dark|light/.test(token.filePath) && !token.path.includes("component")) { - const sassToken = { ...token }; - const path = sassToken.path.reduce((acc, p) => { - if (p === "default") { - return acc; - } - acc.push(p === "color" ? "ui" : p); - return acc; - }, []); - path.push(token.filePath.includes("dark") ? "dark" : "light"); - sassToken.name = path.join("-"); - acc[0].push(sassProps(sassToken)); - } - - return acc; - }, - [[], []] - ); - - return `${StyleDictionary.formatHelpers.fileHeader({ file })} -${coreTokens[0].join("\n")} - -@mixin calcite-theme-${themeName}() { -${coreTokens[1].join("\n")} -}`; -} diff --git a/packages/calcite-design-tokens/support/token-transformer/getThemes.ts b/packages/calcite-design-tokens/support/token-transformer/getThemes.ts deleted file mode 100644 index 7b89f7a3d80..00000000000 --- a/packages/calcite-design-tokens/support/token-transformer/getThemes.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { Options } from "style-dictionary"; - -export interface ThemeFileInterface { - id: string; - name: string; - selectedTokenSets: Record; - $figmaStyleReferences?: Record; -} - -export type Theme = { - name: string; - enabled: string[]; - disabled: string[]; - source: string[]; - id?: string; - options?: Options; -}; - -/** - * - * @param {ThemeFileInterface} themes an array of Figma Token Studio theme definition objects - * @returns {Array} an array of Style Dictionary theme definition objects - */ -export async function getThemes(themes: ThemeFileInterface[]): Promise { - return themes.map((themeConfig) => { - const themeTypes = { enabled: [], disabled: [], source: [] }; - const { name, id, selectedTokenSets } = themeConfig; - const { enabled, disabled, source } = Object.entries(selectedTokenSets).reduce((acc, [key, value]) => { - acc[value].push(key); - return acc; - }, themeTypes); - - return { - name, - id, - enabled, - disabled, - source, - }; - }); -} diff --git a/packages/calcite-design-tokens/support/token-transformer/helpers/createCalciteTokenFiles.spec.ts b/packages/calcite-design-tokens/support/token-transformer/helpers/createCalciteTokenFiles.spec.ts new file mode 100644 index 00000000000..8d887443780 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/helpers/createCalciteTokenFiles.spec.ts @@ -0,0 +1,79 @@ +import { resolve } from "path"; +import { createCalciteTokenFiles } from "./createCalciteTokenFiles.js"; +import { ConfigOptions } from "../../types/config.js"; + +describe("Helper to create a Calcite Token Transformer configuration file", () => { + it("should return a token file", async () => { + const args = { + name: "testName", + path: resolve(__dirname, "../../test/mock/src/global.json"), + }; + const expected = { + name: "testName", + source: [resolve(__dirname, "../../test/mock/src/global.json")], + }; + const tokenFile = await createCalciteTokenFiles(args); + expect(tokenFile).toMatchObject({ + name: expected.name, + source: expected.source, + }); + }); + + it("should add additional sources to the returned token file", async () => { + const args = { + name: "testName", + path: resolve(__dirname, "../../test/mock/src/global.json"), + source: ["./my-extra-source"], + }; + const expected = { + name: "testName", + source: [resolve(__dirname, "../../test/mock/src/global.json"), "./my-extra-source"], + }; + const tokenFile = await createCalciteTokenFiles(args); + expect(tokenFile).toMatchObject({ + name: expected.name, + source: expected.source, + }); + }); + + it("should add references to the returned token file", async () => { + const args = { + name: "testName", + path: resolve(__dirname, "../../test/mock/src/global.json"), + references: ["./my-extra-source"], + }; + const expected = { + name: "testName", + source: [resolve(__dirname, "../../test/mock/src/global.json")], + references: ["./my-extra-source"], + }; + const tokenFile = await createCalciteTokenFiles(args); + expect(tokenFile).toMatchObject({ + name: expected.name, + source: expected.source, + references: expected.references, + }); + }); + + it("should add options to the returned token file", async () => { + const options: ConfigOptions = { + prefix: "testPrefix", + }; + const args = { + name: "testName", + path: resolve(__dirname, "../../test/mock/src/global.json"), + options, + }; + const expected = { + name: "testName", + source: [resolve(__dirname, "../../test/mock/src/global.json")], + options, + }; + const tokenFile = await createCalciteTokenFiles(args); + expect(tokenFile).toMatchObject({ + name: expected.name, + source: expected.source, + options: expected.options, + }); + }); +}); diff --git a/packages/calcite-design-tokens/support/token-transformer/helpers/createCalciteTokenFiles.ts b/packages/calcite-design-tokens/support/token-transformer/helpers/createCalciteTokenFiles.ts new file mode 100644 index 00000000000..f650908b4c0 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/helpers/createCalciteTokenFiles.ts @@ -0,0 +1,16 @@ +import { CalciteTokenFile, CalciteTokenFileArguments } from "../../types/config.js"; +import { getFiles } from "./getFiles.js"; + +export async function createCalciteTokenFiles(args: CalciteTokenFileArguments): Promise { + const sourceFiles = await getFiles(args.path); + const sourcePaths = Object.values(sourceFiles); + + const tokenFile = { + name: args.name, + source: args.source ? [...sourcePaths, ...args.source] : sourcePaths, + references: args.references, + options: args.options, + }; + + return tokenFile; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/helpers/getFiles.spec.ts b/packages/calcite-design-tokens/support/token-transformer/helpers/getFiles.spec.ts new file mode 100644 index 00000000000..9478aa2c179 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/helpers/getFiles.spec.ts @@ -0,0 +1,20 @@ +import { resolve } from "path"; +import { getFiles } from "./getFiles.js"; + +describe("Helper to get files", () => { + it("should accept a file path", async () => { + const globalPath = resolve(__dirname, "../../test/mock/src/global.json"); + const files = await getFiles(globalPath); + expect(files).toMatchObject({ + global: globalPath, + }); + }); + + it("should accept a directory path", async () => { + const globalPath = resolve(__dirname, "../../test/mock/src"); + const files = await getFiles(globalPath); + expect(files).toMatchObject({ + global: resolve(__dirname, "../../test/mock/src/global.json"), + }); + }); +}); diff --git a/packages/calcite-design-tokens/support/token-transformer/helpers/getFiles.ts b/packages/calcite-design-tokens/support/token-transformer/helpers/getFiles.ts new file mode 100644 index 00000000000..d3ff48bbf51 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/helpers/getFiles.ts @@ -0,0 +1,20 @@ +import { readdir, stat } from "fs/promises"; +import { resolve } from "path"; + +export async function getFiles(path: string): Promise> { + const tokenFiles: Record = {}; + const pathStats = await stat(path); + + if (pathStats.isDirectory()) { + const directory = await readdir(path); + directory.forEach((fileName) => { + const name = fileName.slice(0, fileName.lastIndexOf(".")); + tokenFiles[name] = resolve(path, fileName); + }); + } else if (pathStats.isFile()) { + const name = path.slice(path.lastIndexOf("/") + 1, path.lastIndexOf(".")); + tokenFiles[name] = path; + } + + return tokenFiles; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/parse/expandComposites.test.ts b/packages/calcite-design-tokens/support/token-transformer/parse/expandComposites.test.ts deleted file mode 100644 index 00bd4785c38..00000000000 --- a/packages/calcite-design-tokens/support/token-transformer/parse/expandComposites.test.ts +++ /dev/null @@ -1,144 +0,0 @@ -const mockCorrectTypeCompoundToken = { - core: { - 1: { - type: "sizing", - value: "10", - }, - }, - compound: { - value: { - fontFamily: "$core.font.font-family.primary", - fontWeight: "$core.font.font-weight.light", - lineHeight: "$core.font.line-height.fixed.0", - fontSize: "$core.font.font-size.0", - letterSpacing: "$core.font.letter-spacing.normal", - paragraphSpacing: "$core.font.paragraph-spacing.normal", - textDecoration: "$core.font.text-decoration.none", - textCase: "$core.font.text-case.none", - }, - type: "typography", - }, -}; -const mockTransformedCompoundTokens = { - core: { - 1: { - type: "sizing", - value: "10", - }, - }, - compound: { - "font-family": { - value: "$core.font.font-family.primary", - type: "font-family", - }, - "font-weight": { - value: "$core.font.font-weight.light", - type: "font-weights", - }, - "line-height": { - value: "$core.font.line-height.fixed.0", - type: "line-heights", - }, - "font-size": { - value: "$core.font.font-size.0", - type: "font-size", - }, - "letter-spacing": { - value: "$core.font.letter-spacing.normal", - type: "letter-spacing", - }, - "paragraph-spacing": { - value: "$core.font.paragraph-spacing.normal", - type: "paragraph-spacing", - }, - "text-decoration": { - value: "$core.font.text-decoration.none", - type: "font-style", - }, - "text-case": { - value: "$core.font.text-case.none", - type: "text-case", - }, - }, -}; - -const handleTokenStudioVariables = jest.fn((token) => (token.includes("$") ? `{${token.replace(/\$/g, "")}}` : token)); -const convertTokenToStyleDictionaryFormat = jest.fn(() => handleTokenStudioVariables); -const shouldExpand = jest.fn().mockReturnValue(true); -const expandToken = jest.fn().mockReturnValue(mockTransformedCompoundTokens); - -jest.mock("../utils/compositeTokens.js", () => { - const originalModule = jest.requireActual("../utils/compositeTokens.js"); - return { - __esModule: false, - ...originalModule, - shouldExpand, - expandToken, - }; -}); - -jest.mock("../utils/convertTokenToStyleDictionaryFormat.js", () => { - const originalModule = jest.requireActual("../utils/convertTokenToStyleDictionaryFormat.js"); - return { - __esModule: false, - ...originalModule, - convertTokenToStyleDictionaryFormat, - }; -}); - -import * as expandComposites from "./expandComposites"; - -describe("expand token dictionary", () => { - beforeEach(() => { - jest.clearAllMocks(); - }); - - it("should not add placeholder elements", () => { - const placeolderToken = { - "[placeholder-component]": { - type: "other", - value: "#333", - }, - }; - const placeholderValue = { - compoonent: { - type: "other", - value: "[placholder-value]", - }, - }; - - // @ts-expect-error - it's fine. - const testExpandPlaceholderKey = expandComposites.expandComposites(placeolderToken, "./fakePath"); - // @ts-expect-error - it's fine. - const testExpandPlaceholderValue = expandComposites.expandComposites(placeholderValue, "./fakePath"); - - expect(testExpandPlaceholderKey).toMatchObject({}); - expect(testExpandPlaceholderValue).toMatchObject({}); - }); - - it('should loop through a dictionary and run "shouldExpand" and "expandToken" on each composite token', () => { - // @ts-expect-error - it's fine. - const testExpandComposite = expandComposites.expandComposites(mockCorrectTypeCompoundToken, "./fakePath"); - expect(handleTokenStudioVariables).toHaveBeenCalledTimes(1); - expect(shouldExpand).toHaveBeenCalledTimes(1); - expect(expandToken).toHaveBeenCalledTimes(1); - expect(testExpandComposite).toMatchObject(mockTransformedCompoundTokens); - }); - - it("should not run expand token on unrecognized types", () => { - const mockDictionary = { - core: { - type: "customType", - value: { - fontFamily: "Avanir", - fontSize: "12px", - }, - }, - }; - // @ts-expect-error - it's fine this is a test - const testExpandComposite = expandComposites.expandComposites(mockDictionary, "./fakePath"); - expect(shouldExpand).not.toHaveBeenCalled(); - expect(expandToken).not.toHaveBeenCalled(); - expect(testExpandComposite).toMatchObject(mockDictionary); - }); -}); diff --git a/packages/calcite-design-tokens/support/token-transformer/parse/expandComposites.ts b/packages/calcite-design-tokens/support/token-transformer/parse/expandComposites.ts deleted file mode 100644 index 8807bc4bf78..00000000000 --- a/packages/calcite-design-tokens/support/token-transformer/parse/expandComposites.ts +++ /dev/null @@ -1,72 +0,0 @@ -import { DeepKeyTokenMap } from "@tokens-studio/types"; -import { DesignToken } from "style-dictionary/types/DesignToken.js"; -import { - TransformOptions, - ExpandablesAsStrings, - Expandables, - expandablesAsStringsArr, -} from "../utils/transformOptions.js"; -import { matchPlaceholderElement, tokenStudioCustomVariableIndicator } from "../utils/regex.js"; -import { shouldExpand, expandToken } from "../utils/compositeTokens.js"; -import { convertTokenToStyleDictionaryFormat } from "../utils/convertTokenToStyleDictionaryFormat.js"; - -/** - * Figma Token Studio creates an odd type of composite token where the "value" may contain an object of "key: value" pairs rather than a sting. - * Here we will lift these composite tokens up to match the Style Dictionary format. - * - * @param {DeepKeyTokenMap} dictionary the raw JSON object in the token files. We will assume this is a token object generated by Figma Token Studio and may require composite tokens to be expanded. - * @param {string} filePath the absolute file path to the JSON token file. - * @param {TransformOptions} transformOpts the options passed in from the Style Dictionary config and runner - * @returns {DeepKeyTokenMap} a token object where any Figma Token Studio composite tokens now match the Style Dictionary token format - */ -export function expandComposites( - dictionary: DeepKeyTokenMap, - filePath: string, - transformOpts: TransformOptions = {} -): DeepKeyTokenMap { - const opts = { - ...transformOpts, - expand: { - composition: true, - typography: false, - border: false, - shadow: false, - ...transformOpts.expand, - }, - }; - const returnSlice: DeepKeyTokenMap = {}; - const handleTokenStudioVariables = convertTokenToStyleDictionaryFormat(tokenStudioCustomVariableIndicator); - const newDictionary = Object.entries(dictionary).reduce((acc, [key, token]) => { - const { type } = token; - - if ( - matchPlaceholderElement.test(`${key}`) || - (typeof token.value === "string" && matchPlaceholderElement.test(`${token.value}`)) - ) { - return acc; - } - - if (token.value && type) { - const includesType = expandablesAsStringsArr.includes(`${type}`); - - if (includesType) { - const expandType = (type as ExpandablesAsStrings) === "boxShadow" ? "shadow" : type; - const expand = shouldExpand(token as Expandables, opts.expand[`${expandType}`], filePath); - if (expand) { - const expandedToken = expandToken(token as DesignToken, expandType === "shadow", handleTokenStudioVariables); - return expandedToken; - } - } else if (typeof token.value === "string") { - token.value = handleTokenStudioVariables(token.value); - acc[key] = token; - } else { - acc[key] = token; - } - } else if (typeof token === "object") { - acc[key] = expandComposites(token as DeepKeyTokenMap, filePath, transformOpts); - } - return acc; - }, returnSlice); - - return newDictionary || {}; -} diff --git a/packages/calcite-design-tokens/support/token-transformer/registerCalciteTransformers.ts b/packages/calcite-design-tokens/support/token-transformer/registerCalciteTransformers.ts new file mode 100644 index 00000000000..3d682d3b91c --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/registerCalciteTransformers.ts @@ -0,0 +1,42 @@ +import { Core as StyleDictionary } from "style-dictionary"; +import { registerTransforms } from "@tokens-studio/sd-transforms"; + +import { registerAttributePlatformNames } from "./styleDictionary/transformer/attributes/attributePlatformName.js"; +import { registerCustomJSONParser } from "./styleDictionary/parser/calcite/index.js"; +import { registerFilterSource } from "./styleDictionary/filter/filterSource.js"; +import { registerFormatterCss } from "./styleDictionary/formatter/css.js"; +import { registerFormatterScss } from "./styleDictionary/formatter/scss.js"; +import { registerFormatterJs } from "./styleDictionary/formatter/javascript.js"; +import { registerNameCamelCase } from "./styleDictionary/transformer/name/nameCamelCase.js"; +import { registerNameJoinPath } from "./styleDictionary/transformer/name/nameJoinPath.js"; +import { registerNameKebabCase } from "./styleDictionary/transformer/name/nameKebabCase.js"; +import { registerValueAlignFontWeightAndStyles } from "./styleDictionary/transformer/value/valueAlignFontWeightAndStyle.js"; +import { registerValueAssetToken } from "./styleDictionary/transformer/value/valueAssetToken.js"; +import { registerValueStringWrapper } from "./styleDictionary/transformer/value/valueStringWrapper.js"; +import { registerValueEvaluateMath } from "./styleDictionary/transformer/value/valueCheckEvaluateMath.js"; +import { registerValueRGBA } from "./styleDictionary/transformer/value/valueRGBA.js"; + +export async function registerCalciteTransformers(sd: StyleDictionary): Promise { + // Here we are registering the Transforms provided by Token Studio however, + // we need to pass "expand: false" so that we can use our own custom JSON file parser. + // any references to "ts/..." below are references to these Token Studio transformers + // https://github.com/tokens-studio/sd-transforms + // @ts-expect-error - @token-studio does not keep their types up to date. + await registerTransforms(sd, { + expand: false, + }); + registerValueRGBA(sd); + registerValueEvaluateMath(sd); + registerAttributePlatformNames(sd); + registerCustomJSONParser(sd); + registerFilterSource(sd); + registerFormatterCss(sd); + registerFormatterScss(sd); + registerFormatterJs(sd); + registerNameCamelCase(sd); + registerNameJoinPath(sd); + registerNameKebabCase(sd); + registerValueAlignFontWeightAndStyles(sd); + registerValueAssetToken(sd); + registerValueStringWrapper(sd); +} diff --git a/packages/calcite-design-tokens/support/token-transformer/sd-run.ts b/packages/calcite-design-tokens/support/token-transformer/sd-run.ts index c68480cfac3..aa2dbf60c0a 100644 --- a/packages/calcite-design-tokens/support/token-transformer/sd-run.ts +++ b/packages/calcite-design-tokens/support/token-transformer/sd-run.ts @@ -1,186 +1,85 @@ -import { registerTransforms } from "@tokens-studio/sd-transforms"; -import StyleDictionary from "style-dictionary"; -import { expandComposites } from "./parse/expandComposites.js"; -import { formatSCSS } from "./format/scss.js"; -import { matchExclusions } from "./utils/regex.js"; -import { matchList } from "./utils/matchList.js"; -import { nameCamelCase } from "./transform/nameCamelCase.js"; -import { nameKebabCase } from "./transform/nameKebabCase.js"; -import { parseName } from "./utils/parseName.js"; -import { Theme } from "./getThemes.js"; -import { formatJs, formatTs } from "./format/javascript.js"; +import { default as StyleDictionary } from "style-dictionary"; -/** - * Style Dictionary runner configuration overrides. - * - * @param {string} tokenDir the directory containing design token files - * @param {string} buildPath the directory to write generated assets to - * @param {Theme} theme the theme configuration to use to generate the platform asset files - * @param {string} theme.name the name of the theme. This will be used as the basis for the generated asset file names. - * @param {string[]} theme.enabled an array of partial file names matching the token files which should be included in the output - * @param {string[]} theme.disabled an array of partial file names matching the token files which should explicitly not be included in the output - * @param {string[]} theme.source an array of partial file names matching the token files which should not always be included in the output but who's values should be used for variables references in the "enabled" files - */ -export const run = async ( - tokenDir = "tokens", - buildPath = "dist", - theme: Pick -): Promise => { - const fileName = parseName(theme.name); - const include = theme.source.map((tokenFile) => `${tokenDir}/${tokenFile}.json`); - const source = theme.enabled.map((tokenFile) => `${tokenDir}/${tokenFile}.json`); - const options = { - enabled: theme.enabled, - source: theme.source, - disabled: theme.disabled, - outputReferences: false, - sourceReferencesOnly: false, - }; +import { registerCalciteTransformers } from "./registerCalciteTransformers.js"; +import { filterSource } from "./styleDictionary/filter/filterSource.js"; +import { fileExtension } from "../types/fileExtensions.js"; +import { PlatformFormats, PlatformUnion, TypescriptPlatform } from "../types/platform.js"; - // Here we are registering the Transforms provided by Token Studio - // https://github.com/tokens-studio/sd-transforms - // @ts-expect-error - @token-studio does not keep their types up to date. - await registerTransforms(StyleDictionary, { - expand: false, - }); +import { CalciteConfigStyleDictionaryRunner } from "../types/config.js"; +import { Options } from "../types/styleDictionary/options.js"; +import { PlatformOptions } from "../types/styleDictionary/platform.js"; +import { File } from "../types/styleDictionary/file.js"; +import { transformations } from "./styleDictionary/transformer/utils.js"; +import { format } from "./styleDictionary/formatter/utils.js"; - // Register custom formatter https://amzn.github.io/style-dictionary/#/formats?id=custom-formats - StyleDictionary.registerFormat({ - name: "calcite/scss", - formatter: formatSCSS, - }); +const destination = (name: string, format: PlatformFormats) => `${name}${fileExtension[format]}`; - StyleDictionary.registerFormat({ - name: "calcite/js-module", - formatter: formatJs, - }); +const files = (platform: PlatformUnion, name: string, options?: Options): File[] => { + const f = []; - StyleDictionary.registerFormat({ - name: "calcite/ts-module", - formatter: formatTs, + f.push({ + format: format(platform), + destination: destination(name, platform), + filter: filterSource, + options: { ...options, platform }, }); - // Registering Style Dictionary transformers https://amzn.github.io/style-dictionary/#/transforms?id=defining-custom-transforms - StyleDictionary.registerTransform({ - name: "name/calcite/camel", - type: "name", - transformer: nameCamelCase, - }); + switch (platform) { + case "js": + case "es6": + f.push({ + format: format(platform === "js" ? TypescriptPlatform.TS : TypescriptPlatform.ES6TS), + destination: destination(name, TypescriptPlatform.TS), + filter: filterSource, + options: { ...options, platform }, + }); + break; - StyleDictionary.registerTransform({ - name: "name/calcite/kebab", - type: "name", - transformer: nameKebabCase, - }); + default: + break; + } - StyleDictionary.registerFilter({ - name: "filterSource", - matcher: (token) => token.isSource, - }); + return f; +}; - // We are programmatically creating the Style Dictionary configuration here - // https://amzn.github.io/style-dictionary/#/config - const sd = StyleDictionary.extend({ +/** + * Style Dictionary runner configuration overrides. + * + * @param {CalciteConfigStyleDictionaryRunner} config the style dictionary configuration + */ +export const run = async ({ + name, + source, + include, + options, + output, +}: CalciteConfigStyleDictionaryRunner): Promise => { + // To optimize performance of Calcite, we must generate additional files for certain platforms and for certain token tiers and contexts. + // We generate the tiered token files via the normal StyleDictionary output. Any additional compiled files are handled by the expandFiles. + const expandFiles = output.expandFiles || undefined; + + const platforms = output.platforms.reduce((acc, platform) => { + const platformConfig: PlatformOptions = { + options: { ...options, expandFiles, platforms: output.platforms }, + transforms: transformations[platform], + buildPath: `${output.dir}/${platform}/`, + files: files(platform, name), + }; + acc[platform] = platformConfig; + return acc; + }, {} as Partial>); + + const config = { source, include, - platforms: { - js: { - buildPath: `${buildPath}/js/`, - files: [ - { - destination: `${fileName}.js`, - format: "calcite/js-module", - filter: "filterSource", - }, - { - destination: `${fileName}.d.ts`, - format: "calcite/ts-module", - filter: "filterSource", - }, - ], - }, - es6: { - transformGroup: "js", - buildPath: `${buildPath}/es6/`, - files: [ - { - format: "javascript/es6", - destination: `${fileName}.js`, - filter: "filterSource", - options: { ...options, outputReferences: true }, - }, - { - format: "typescript/es6-declarations", - destination: `${fileName}.d.ts`, - filter: "filterSource", - options: { ...options, outputReferences: true }, - }, - ], - }, - css: { - prefix: "calcite", - transforms: [ - "ts/descriptionToComment", - "ts/size/px", - "ts/opacity", - "ts/size/lineheight", - "ts/type/fontWeight", - "ts/resolveMath", - "ts/size/css/letterspacing", - "ts/color/css/hexrgba", - "ts/color/modifiers", - "name/calcite/kebab", - ], - buildPath: `${buildPath}/css/`, - files: [ - { - destination: `${fileName}.css`, - format: "css/variables", - filter: /headless/gi.test(fileName) ? null : "filterSource", - options: /headless/gi.test(fileName) ? { ...options, outputReferences: true } : options, - }, - ], - }, - scss: { - prefix: "calcite", - transforms: [ - "ts/descriptionToComment", - "ts/size/px", - "ts/opacity", - "ts/size/lineheight", - "ts/type/fontWeight", - "ts/resolveMath", - "ts/size/css/letterspacing", - "ts/color/css/hexrgba", - "ts/color/modifiers", - "name/calcite/kebab", - ], - buildPath: `${buildPath}/scss/`, - files: [ - { - destination: `${fileName}.scss`, - format: "calcite/scss", - filter: /headless/gi.test(fileName) ? null : "filterSource", - options: /headless/gi.test(fileName) ? { ...options, outputReferences: true } : options, - }, - ], - }, - }, - parsers: [ - { - pattern: /\.json$/, - parse: (file) => { - if (matchList(file.filePath, [...include, ...theme.source, ...theme.enabled], matchExclusions)) { - const obj = JSON.parse(file.contents); - const expanded = expandComposites(obj, file.filePath); - return expanded; - } + platforms, + }; - return {}; - }, - }, - ], - }); + await registerCalciteTransformers(StyleDictionary); + + // We are programmatically creating the Style Dictionary configuration here + // https://amzn.github.io/style-dictionary/#/config + const sd = StyleDictionary.extend(config); try { sd.cleanAllPlatforms(); diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/filter/filterSource.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/filter/filterSource.ts new file mode 100644 index 00000000000..8b8ec5e32b6 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/filter/filterSource.ts @@ -0,0 +1,14 @@ +import { TransformedToken, Core as StyleDictionary } from "style-dictionary"; + +export function filterSourceMatcher(token: TransformedToken): boolean { + return token.isSource; +} + +export function registerFilterSource(sd: StyleDictionary): void { + sd.registerFilter({ + name: filterSource, + matcher: filterSourceMatcher, + }); +} + +export const filterSource = "filter/source"; diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/filter/finterSource.spec.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/filter/finterSource.spec.ts new file mode 100644 index 00000000000..74a0d5c976d --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/filter/finterSource.spec.ts @@ -0,0 +1,27 @@ +import { registerStyleDictionaryFilter } from "../../../test/utils/registerStyleDictionaryFunction"; +import { TransformedToken } from "../../../types/styleDictionary/transformedToken"; +import { filterSourceMatcher, registerFilterSource } from "./filterSource"; + +describe("filter source", () => { + describe("register", () => { + it("should call StyleDictionary registerTransform", () => registerStyleDictionaryFilter(registerFilterSource)); + }); + + describe("filter", () => { + it("should return true", () => { + const token = { + isSource: true, + } as TransformedToken; + const match = filterSourceMatcher(token); + expect(match).toBe(true); + }); + + it("should return false", () => { + const token = { + isSource: false, + } as TransformedToken; + const match = filterSourceMatcher(token); + expect(match).toBe(false); + }); + }); +}); diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/css.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/css.ts new file mode 100644 index 00000000000..b484bef2cbe --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/css.ts @@ -0,0 +1,27 @@ +import sd, { Core as StyleDictionary } from "style-dictionary"; + +import { formatTokens } from "./utils/formatTokens.js"; +import { formatExtraOutput } from "./utils/formatExtraOutput.js"; +import { CalledFormatterFunction, FormatterConfig } from "../../../types/styleDictionary/formatterArguments.js"; + +export const formatCssPlatform: CalledFormatterFunction = (args) => { + const { file, dictionary } = args; + const { default: tokens, ...extraOutput } = formatTokens(dictionary, args); + const header = sd.formatHelpers.fileHeader({ file }); + + if (Object.keys(extraOutput).length > 0) { + formatExtraOutput(extraOutput, { ...args.options, header, buildPath: args.platform.buildPath }); + } + return header + `:root {\n\t${tokens.join("\n\t")}\n}\n`; +}; + +export const registerFormatterCss = (sd: StyleDictionary): void => { + const formatterConfig: FormatterConfig = { + name: CalciteCss, + formatter: formatCssPlatform, + }; + + sd.registerFormat(formatterConfig); +}; + +export const CalciteCss = "calcite/format/css"; diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/javascript.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/javascript.ts new file mode 100644 index 00000000000..5bef68d3324 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/javascript.ts @@ -0,0 +1,22 @@ +import styleDictionary, { Core as StyleDictionary } from "style-dictionary"; +import { CalledFormatterFunction, FormatterConfig } from "../../../types/styleDictionary/formatterArguments"; + +export const formatJsPlatform: CalledFormatterFunction = (args) => { + return ( + styleDictionary.formatHelpers.fileHeader({ file: args.file }) + + "export default " + + JSON.stringify(args.dictionary.properties, null, 2) + + ";\n" + ); +}; + +export const registerFormatterJs = (sd: StyleDictionary): void => { + const formatterConfig: FormatterConfig = { + name: CalciteJs, + formatter: formatJsPlatform, + }; + + sd.registerFormat(formatterConfig); +}; + +export const CalciteJs = "calcite/format/js"; diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/scss.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/scss.ts new file mode 100644 index 00000000000..5eebe2a1e35 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/scss.ts @@ -0,0 +1,27 @@ +import sd, { Core as StyleDictionary } from "style-dictionary"; + +import { formatTokens } from "./utils/formatTokens.js"; +import { formatExtraOutput } from "./utils/formatExtraOutput.js"; +import { CalledFormatterFunction, FormatterConfig } from "../../../types/styleDictionary/formatterArguments.js"; + +export const formatScssPlatform: CalledFormatterFunction = (args) => { + const { file, dictionary } = args; + const { default: tokens, ...extraOutput } = formatTokens(dictionary, args); + const header = sd.formatHelpers.fileHeader({ file }); + + if (Object.keys(extraOutput).length > 0) { + formatExtraOutput(extraOutput, { ...args.options, header, buildPath: args.platform.buildPath }); + } + return header + tokens.join("\n"); +}; + +export const registerFormatterScss = (sd: StyleDictionary): void => { + const formatterConfig: FormatterConfig = { + name: CalciteScss, + formatter: formatScssPlatform, + }; + + sd.registerFormat(formatterConfig); +}; + +export const CalciteScss = "calcite/format/scss"; diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/typography/scss.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/typography/scss.ts new file mode 100644 index 00000000000..14c600c2cff --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/typography/scss.ts @@ -0,0 +1,13 @@ +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; +import { createTokenReference } from "../utils/createTokenReference.js"; + +export function addSCSSImportByRef(refs: any, args: MappedFormatterArguments, refStrings: string[]): string[] { + if (args.dictionary.usesReference(refs)) { + args.dictionary.getReferences(refs).forEach((ref) => { + const tokenReference = createTokenReference(ref, args.platform); + refStrings.push(`@include ${tokenReference};`); + }); + } + + return refStrings; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/typography/utils.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/typography/utils.ts new file mode 100644 index 00000000000..1e243fddd5e --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/typography/utils.ts @@ -0,0 +1,48 @@ +import { Platform } from "../../../../types/platform.js"; +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; +import { FormattingRules } from "../utils.js"; +import { createTokenReference } from "../utils/createTokenReference.js"; + +export function getTypographyReferences( + propName: string, + value: string | Record, + originalValue: string | Record, + args: MappedFormatterArguments +): string { + if (args.dictionary.usesReference(originalValue)) { + const refs = args.dictionary.getReferences(originalValue); + const typeReferences = {}; + const typeArgs = { + ...args.platform, + options: { ...args.options, platform: Platform.CSS }, + formatting: FormattingRules[Platform.CSS], + }; + let typeValue = `${value}`; + + refs.forEach((ref) => { + if (ref.isSource || args.options.outputReferences) { + if (ref.value && ref.name) { + if (typeof ref.value === "string" || typeof ref.value === "number") { + typeValue = `${typeValue}`.replace(`${ref.value}`, () => createTokenReference(ref, typeArgs)); + } else { + switch (args.options.platform) { + case "scss": + case "sass": + typeReferences[ref.name] = `@include ${ref.name};`; + break; + default: + typeValue = `${typeValue}`.replace(ref.value, () => createTokenReference(ref, typeArgs)); + break; + } + } + } + } + }); + + const typeRefs = Object.values(typeReferences); + + return typeRefs.length > 0 ? typeRefs.join("\n") : `${propName}: ${typeValue};`; + } + + return `${value}`; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils.ts new file mode 100644 index 00000000000..d10e743a91f --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils.ts @@ -0,0 +1,55 @@ +import { PlatformFormats, PlatformUnion } from "../../../types/platform.js"; +import { FormatterRules, MappedFormatterArguments } from "../../../types/styleDictionary/formatterArguments.js"; +import { CalciteCss } from "./css.js"; +import { CalciteJs } from "./javascript.js"; +import { CalciteScss } from "./scss.js"; + +const formatters: Partial> = { + css: CalciteCss, + scss: CalciteScss, + sass: CalciteScss, + js: CalciteJs, + es6: "javascript/es6", + ts: "typescript/module-declarations", + es6Ts: "typescript/es6-declarations", +} as const; + +export const format = (t: T): (typeof formatters)[T] => { + return formatters[t]; +}; + +export declare function calledFormatterFunction(args: MappedFormatterArguments): string; + +export const FormattingRules: Partial> = { + default: { + prefix: "", + commentStyle: "long", + indentation: "", + separator: " =", + suffix: ";", + }, + css: { + prefix: "--", + commentStyle: "long", + indentation: " ", + separator: ":", + join: "\n\t", + suffix: ";", + }, + sass: { + prefix: "$", + commentStyle: "short", + indentation: "", + separator: ":", + join: "\n", + suffix: ";", + }, + scss: { + prefix: "$", + commentStyle: "short", + indentation: "", + separator: ":", + join: "\n", + suffix: ";", + }, +}; diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/createTokenReference.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/createTokenReference.ts new file mode 100644 index 00000000000..9a0b299ca51 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/createTokenReference.ts @@ -0,0 +1,19 @@ +import { TransformedToken } from "style-dictionary/types/TransformedToken.js"; +import { PlatformOptions } from "../../../../types/styleDictionary/platform.js"; +import { FormattingRules } from "../utils.js"; + +export function createTokenReference(token: TransformedToken, args: PlatformOptions): string { + const formatting = FormattingRules[args.options.platform] || FormattingRules.default; + + switch (args.options.platform) { + case "css": + return args.options.outputReferenceFallbacks + ? `var(${formatting.prefix}${token.name}, ${token.value})` + : `var(${formatting.prefix}${token.name})`; + case "sass": + case "scss": + return `${formatting.prefix}${token.name}`; + default: + return `${token.name}`; + } +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/formatExtraOutput.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/formatExtraOutput.ts new file mode 100644 index 00000000000..765e8492237 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/formatExtraOutput.ts @@ -0,0 +1,102 @@ +import { writeFileSync } from "fs"; +import { resolve } from "path"; +import { Platform } from "../../../../types/platform.js"; +import { Options } from "../../../../types/styleDictionary/options.js"; +import { DeepKeyTokenMap } from "../../../../types/tokenStudio/designTokenTypes.js"; + +export function formatExtraOutput( + outputObject: Record)[]> | DeepKeyTokenMap, + args: Options & { header: string; buildPath: string } +): void { + if (Object.keys(outputObject).length > 0) { + const { index } = args.expandFiles[args.platform]; + const outputFiles: Record = {}; + const ensureIfArray = (x: any) => (Array.isArray(x) ? (x as any[]) : x); + + if (index) { + switch (args.platform) { + case "css": + case "scss": + case "sass": + const imports = index.import + ? index.import.map((imp) => + typeof imp === "string" + ? `@import ${imp.includes(".css") ? `url("${imp}")` : `"${imp}"`};` + : `@import ${imp[0].includes(".css") ? `url("${imp[0]}")` : `"${imp[0]}"`} ${imp.slice(1).join(" ")};` + ) + : []; + const forwards = index.forward ? index.forward.map((fwd) => `@forwards "${fwd}";`) : []; + const classes = index.class + ? index.class.map((cls) => { + const c = ensureIfArray(outputObject[`${cls[1]}.${args.platform}`]); + return cls && Array.isArray(c) ? `.${cls[0]} {\n\t${c.join("\n\t")}\n}` : ""; + }) + : []; + const mixins = index.mixin + ? index.mixin.map(([mixinName, output]) => { + const m = ensureIfArray(outputObject[`${output}.${args.platform}`]); + return Array.isArray(m) + ? `@mixin ${mixinName} {\n\t${m.map((o) => `${o}`.replace("$", "--")).join("\n\t")}\n}` + : ""; + }) + : []; + const medias = index.media + ? index.media.map(([mediaSchemed, output]) => { + const m = ensureIfArray(outputObject[`${output}.${args.platform}`]); + return Array.isArray(m) + ? `@media (${mediaSchemed}) {\n\t:root {\n\t\t${m + .map((o) => `${o}`.replace("$", "--")) + .join("\n\t\t")}\n\t}\n}` + : ""; + }) + : []; + + outputFiles[index.name] = [ + ...(imports || []), + ...(forwards || []), + ...(medias || []), + ...(classes || []), + ...(mixins || []), + ].filter((t) => t); + break; + case "js": + case "es6": + const exports = index.export?.map((exp) => + typeof exp === "string" ? `export * from "${exp}";` : `export * as ${exp[1]} from "${exp[0]}";` + ); + outputFiles[index.name] = [...exports].filter((t) => t); + break; + default: + break; + } + + writeFileSync(resolve(args.buildPath, index.name), `${args.header}${outputFiles[index.name].join("\n\n")}\n`); + } + + Object.entries(outputObject).forEach(([fileName, outputList]) => { + const absoluteFilePath = resolve(args.buildPath, `${fileName}`); + switch (args.platform) { + case Platform.CSS: + if (typeof outputList[0] === "string" && outputList[0].slice(0, 2) === "--") { + writeFileSync(absoluteFilePath, `${args.header}:root{\n\t${outputList.join("\n\t")}\n}\n`); + } else { + writeFileSync(absoluteFilePath, `${args.header}${outputList.join("\n\n")}\n`); + } + break; + case Platform.SCSS: + case Platform.SASS: + if (typeof outputList[0] === "string" && outputList[0][0] === "$") { + writeFileSync(absoluteFilePath, `${args.header}${outputList.join("\n")}\n`); + } else { + writeFileSync(absoluteFilePath, `${args.header}${outputList.join("\n\n")}\n`); + } + break; + case Platform.JS: + writeFileSync(absoluteFilePath, args.header + "export default " + outputList[0] + "\n"); + break; + default: + break; + } + }); + } +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/formatTokens.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/formatTokens.ts new file mode 100644 index 00000000000..f40517472b7 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/formatTokens.ts @@ -0,0 +1,78 @@ +import { Dictionary } from "../../../../types/styleDictionary/dictionary.js"; +import { handleColor } from "./handleColor.js"; +import { handleStringValueTokens } from "./handleStringValue.js"; +import { handleTypography } from "./handleTypography.js"; +import { sortByReference } from "./sortByReference.js"; +import { ExpandableTokenTypes } from "../../../../types/tokenStudio/designTokenTypes.js"; +import { handleBreakpoint } from "./handleBreakpoint.js"; +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; + +export type FormattedTokens = Record)[]>; + +export function formatTokens(dictionary: Dictionary, args: MappedFormatterArguments): FormattedTokens { + const allTokens = [...dictionary.allTokens].sort(sortByReference(dictionary)); + const returnFiles: FormattedTokens = {}; + return allTokens.reduce((acc, token) => { + let group = "default"; + let formattedToken; + + switch (token.type) { + case ExpandableTokenTypes.BREAKPOINT: + formattedToken = handleBreakpoint(token, dictionary, args); + + break; + case ExpandableTokenTypes.TYPOGRAPHY: + formattedToken = handleTypography(token, args); + break; + case ExpandableTokenTypes.COLORSCHEME: + case "color": + formattedToken = handleColor(token, dictionary, args); + token.type = typeof formattedToken === "string" ? token.type : "colorScheme"; + + break; + default: + formattedToken = handleStringValueTokens(token, dictionary, args); + break; + } + + if (formattedToken) { + if (typeof formattedToken === "string") { + group = + args.options.expandFiles[args.options.platform][token.type]?.name || + args.options.expandFiles[args.options.platform][token.type] || + "default"; + + if (!acc[group]) { + acc[group] = []; + } + + acc[group].push(formattedToken); + } else { + Object.entries(formattedToken).forEach(([tokenSecondaryName, tokenValue]) => { + group = + args.options.expandFiles[args.options.platform][token.type][tokenSecondaryName]?.name || + args.options.expandFiles[args.options.platform][token.type][tokenSecondaryName] || + args.options.expandFiles[args.options.platform][token.type] || + "default"; + + if (!acc[group]) { + acc[group] = []; + } + + if (args.options.expandFiles[args.options.platform][token.type][tokenSecondaryName]) { + acc[group].push(`${tokenValue}`); + } else { + const idx = acc[group].length - 1; + + if (!acc[group][idx]) { + acc[group][idx] = {}; + } + + acc[group][idx][tokenSecondaryName] = tokenValue; + } + }); + } + } + return acc; + }, returnFiles); +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/getReferenceFromValue.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/getReferenceFromValue.ts new file mode 100644 index 00000000000..d4e07ac9341 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/getReferenceFromValue.ts @@ -0,0 +1,47 @@ +import { Dictionary } from "style-dictionary/types/Dictionary.js"; +import { PlatformOptions } from "../../../../types/styleDictionary/platform.js"; +import { createTokenReference } from "./createTokenReference.js"; +import { hexToRgb } from "../../transformer/utils/hexToRGBA.js"; + +export function getReferencesFromValue( + originalValue: string, + value: string, + dictionary: Dictionary, + args: PlatformOptions +): string { + if (dictionary.usesReference(originalValue)) { + const refs = dictionary.getReferences(originalValue); + refs.forEach((ref) => { + if (ref.isSource || args.options.outputReferences) { + if (ref.value && ref.name) { + const tokenRef = createTokenReference(ref, { + ...args, + options: { + ...args.options, + platform: args.options.platform.match(/(css|sass|scss)/) ? "css" : args.options.platform, + }, + }); + + if (ref.type === "color" && !value.includes(ref.value) && value.includes("rgb")) { + // We prefer HEX but sometimes we need to check for rgba + const rgbRef = hexToRgb(ref.value); + const rgba = value.match(/rgba?\(/); + value = + rgbRef && rgba + ? `${value}`.replace(`${rgba[0]}${Object.values(rgbRef).join(", ")}`, `${rgba[0]}${tokenRef}`) + : `${value}`.replace(ref.value, tokenRef); + } else { + const rgba = value.search(/rgba?\((\d,\s*)+/); + + value = + ref.type === "opacity" && rgba + ? `${value}`.replace(rgba + ref.value, rgba + tokenRef) + : `${value}`.replace(ref.value, tokenRef); + } + } + } + }); + } + + return `${value}`; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleBreakpoint.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleBreakpoint.ts new file mode 100644 index 00000000000..b2ede089da1 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleBreakpoint.ts @@ -0,0 +1,58 @@ +import { checkAndEvaluateMath } from "@tokens-studio/sd-transforms"; + +import { Dictionary } from "../../../../types/styleDictionary/dictionary.js"; +import { TransformedToken } from "../../../../types/styleDictionary/transformedToken.js"; +import { TokenBreakpointContextUnion } from "../../../../types/tokenTypes/breakpointContext.js"; +import { handleStringValueTokens } from "./handleStringValue.js"; +import { Platform } from "../../../../types/platform.js"; +import { transformNamesKebabCase } from "../../transformer/name/nameKebabCase.js"; +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; + +export function handleBreakpoint( + token: TransformedToken, + dictionary: Dictionary, + args: MappedFormatterArguments +): string | { [key in TokenBreakpointContextUnion]: string } { + if (typeof token.value === "string") { + return handleStringValueTokens(token, dictionary, args); + } + + const returnObject = Object.entries(token.value).reduce((acc, [minMaxKey, breakpointValue]) => { + let alteredToken = { + ...token, + value: checkAndEvaluateMath(`${breakpointValue}`), + original: { + ...token.original, + value: token.original.value[minMaxKey], + }, + }; + switch (args.options.platform) { + case "css": + case "scss": + case "sass": + alteredToken = { + ...alteredToken, + path: [...alteredToken.path, minMaxKey], + }; + acc[minMaxKey] = handleStringValueTokens( + { ...alteredToken, name: transformNamesKebabCase(alteredToken, args) }, + dictionary, + args + ); + break; + case "es6": + acc[minMaxKey] = handleStringValueTokens(alteredToken, dictionary, args); + break; + default: + break; + } + + return acc; + }, {} as { [key in TokenBreakpointContextUnion]: string }); + + return args.options.platform === Platform.SCSS || args.options.platform === Platform.SASS + ? Object.values(returnObject).join("\n\n") + : args.options.platform === Platform.CSS + ? Object.values(returnObject).join("\n\t") + : returnObject; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleColor.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleColor.ts new file mode 100644 index 00000000000..a713ab2be07 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleColor.ts @@ -0,0 +1,35 @@ +import { Dictionary } from "../../../../types/styleDictionary/dictionary.js"; +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; +import { TransformedToken } from "../../../../types/styleDictionary/transformedToken.js"; +import { TokenColorSchemeUnion } from "../../../../types/tokenTypes/colorScheme.js"; +import { handleStringValueTokens } from "./handleStringValue.js"; + +export function handleColor( + token: TransformedToken, + dictionary: Dictionary, + args: MappedFormatterArguments +): string | { [key in TokenColorSchemeUnion]: string } { + return typeof token.value === "string" + ? handleStringValueTokens(token, dictionary, args) + : Object.entries(token.value).reduce((acc, [contextKey, colorValue]) => { + const alteredToken = { + ...token, + value: colorValue, + original: { + ...token.original, + value: token.original.value[contextKey], + }, + }; + switch (args.options.platform) { + case "css": + case "scss": + case "sass": + case "es6": + acc[contextKey] = handleStringValueTokens(alteredToken, dictionary, args); + default: + break; + } + + return acc; + }, {} as { [key in TokenColorSchemeUnion]: string }); +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleStringValue.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleStringValue.ts new file mode 100644 index 00000000000..4715f7458ab --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleStringValue.ts @@ -0,0 +1,38 @@ +import { TransformedToken } from "style-dictionary/types/TransformedToken.js"; +import { Dictionary } from "style-dictionary/types/Dictionary.js"; +import { getReferencesFromValue } from "./getReferenceFromValue.js"; +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; +import { FormattingRules } from "../utils.js"; + +export function handleStringValueTokens( + token: TransformedToken, + dictionary: Dictionary, + args: MappedFormatterArguments, + value?: string +): string | undefined { + const stringValue = value || token.value; + const formatting = FormattingRules[args.options.platform] || FormattingRules.default; + const formattedName = `${formatting.indentation}${formatting.prefix}${token.name}${formatting.separator}`; + const formattedValue = getReferencesFromValue(token.original.value, stringValue, dictionary, { + options: args.options, + }); + // the key comes from Token Studio, which is why we have to keep the misspelling + // eslint-disable-next-line @cspell/spellchecker + const themeAble = ["sass", "scss"].includes(args.options.platform) && !!token["themeable"] ? "!default" : false; + const comment = !token.comment + ? undefined + : formatting.commentStyle === "short" + ? `// ${token.comment}` + : `/* ${token.comment} */`; + const stringifiedProp = [formattedName, formattedValue, themeAble, formatting.suffix, comment] + .filter((s) => s) + .join(" ") + .replace(" ;", ";") + .trim(); + + if (typeof formattedValue === "string") { + return stringifiedProp; + } + + return undefined; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleTypography.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleTypography.ts new file mode 100644 index 00000000000..c453b1bd5ce --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/handleTypography.ts @@ -0,0 +1,39 @@ +import { paramCase } from "change-case"; + +import { TransformedToken } from "../../../../types/styleDictionary/transformedToken.js"; +import { getTypographyReferences } from "../typography/utils.js"; +import { addSCSSImportByRef } from "../typography/scss.js"; +import { Platform } from "../../../../types/platform.js"; +import { MappedFormatterArguments } from "../../../../types/styleDictionary/formatterArguments.js"; + +export function handleTypography(token: TransformedToken, args: MappedFormatterArguments): string { + const strObj = Object.keys(token.value).reduce((acc, typeKey) => { + const propName = paramCase(typeKey); + const value = typeof token.value === "string" ? token.value : token.value[typeKey]; + const originalValue = + typeof token.original.value === "string" ? token.original.value : token.original.value[typeKey]; + const newValue = getTypographyReferences(propName, value, originalValue, args); + // Quick way to ensure unique token references + acc[newValue] = true; + return acc; + }, {}); + + switch (args.options.platform) { + case Platform.CSS: + return `.${token.name} {\n\t${Object.keys(strObj).join("\n\t")}\n}`; + + case Platform.SCSS: + case Platform.SASS: + const tokenSchemeExtensionExtendToken = (token.original.extensions && + token.original.extensions["calcite.extends"]) as string | undefined; + const extraIncludes = + tokenSchemeExtensionExtendToken && args.dictionary.usesReference(tokenSchemeExtensionExtendToken) + ? addSCSSImportByRef(tokenSchemeExtensionExtendToken, args, []) + : undefined; + const mixinLines = [].concat(extraIncludes || [], Object.keys(strObj)); + + return `@mixin ${token.name} {\n\t${mixinLines.join("\n\t")}\n}`; + default: + return; + } +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/sortByReference.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/sortByReference.ts new file mode 100644 index 00000000000..ced18c77183 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/formatter/utils/sortByReference.ts @@ -0,0 +1,52 @@ +import { Dictionary } from "../../../../types/styleDictionary/dictionary.js"; + +export function sortByReference(dictionary: Dictionary): (a, b) => 1 | -1 { + // The sorter function is recursive to account for multiple levels of nesting + function sorter(a, b) { + const aComesFirst = -1; + const bComesFirst = 1; + + // return early if a or b ar undefined + if (typeof a === "undefined") { + return aComesFirst; + } else if (typeof b === "undefined") { + return bComesFirst; + } + + // If token a uses a reference and token b doesn't, b might come before a + // read on.. + if (a.original && dictionary.usesReference(a.original.value)) { + if (b.original && dictionary.usesReference(b.original.value)) { + // Both a and b have references, we need to see if the reference each other + const aRefs = dictionary.getReferences(a.original.value); + const bRefs = dictionary.getReferences(b.original.value); + + aRefs.forEach((aRef) => { + // A references B, so we want B to come first + if (aRef.name === b.name) { + return bComesFirst; + } + }); + + bRefs.forEach((bRef) => { + // Otherwise B references A, so A should come first + if (bRef.name === a.name) { + return aComesFirst; + } + }); + + // both A and B have references and don't reference each other + // we go further down the rabbit hole (reference chain) + return sorter(aRefs[0], bRefs[0]); + } else { + // A has a reference and B does not: + return bComesFirst; + } + } else { + // A does not have a reference it should come first regardless if b has one + return aComesFirst; + } + } + + return sorter; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/calcite/index.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/calcite/index.ts new file mode 100644 index 00000000000..ecce3ec4c3b --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/calcite/index.ts @@ -0,0 +1,28 @@ +import { Core as StyleDictionary } from "style-dictionary"; +import { ParserOptions } from "style-dictionary/types/Parser.js"; + +import { addFontStyles } from "../utils/add-font-styles.js"; +import { expandComposites } from "../utils/expandComposites.js"; +import { expand } from "../../../../types/tokenStudio/expandOptions.js"; +import { TransformOptions } from "../../../../types/styleDictionary/transformOptions.js"; +import { DeepKeyTokenMap } from "../../../../types/tokenStudio/designTokenTypes.js"; +import { excludeParentKeys } from "../utils/excludeParentKeys.js"; + +export function parse(options: ParserOptions): DeepKeyTokenMap { + const obj = JSON.parse(options.contents); + const parseOptions: TransformOptions = { + expand: expand || false, + excludeParentKeys: false, + }; + const excluded = excludeParentKeys(obj, parseOptions); + const withFontStyles = addFontStyles(excluded, parseOptions); + const expanded = expandComposites(withFontStyles, options.filePath, parseOptions); + return expanded; +} + +export function registerCustomJSONParser(sd: StyleDictionary): void { + sd.registerParser({ + pattern: /\.json$/, + parse, + }); +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/add-font-styles.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/add-font-styles.ts new file mode 100644 index 00000000000..71f95ea11c7 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/add-font-styles.ts @@ -0,0 +1,34 @@ +// This is a copy/extension of sd-transforms/src/parsers/add-font-styles.ts with better types + +import { TransformOptions } from "../../../../types/styleDictionary/transformOptions.js"; +import { DeepKeyTokenMap, SingleToken } from "../../../../types/tokenStudio/designTokenTypes.js"; + +function recurse( + slice: SingleToken | DeepKeyTokenMap, + copy: DeepKeyTokenMap, + alwaysAddFontStyle = false +): void { + for (const key in slice) { + const token = slice[key]; + if (typeof token !== "object" || token === null) { + continue; + } + const { type, value } = token; + if (type === "typography") { + if (typeof value !== "object" || value.fontWeight === undefined) { + continue; + } + } else if (typeof token === "object") { + recurse(token, copy, alwaysAddFontStyle); + } + } +} + +export function addFontStyles( + dictionary: DeepKeyTokenMap, + transformOpts?: TransformOptions +): DeepKeyTokenMap { + const copy = { ...dictionary }; + recurse(copy, copy, transformOpts?.alwaysAddFontStyle); + return copy; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/excludeParentKeys.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/excludeParentKeys.ts new file mode 100644 index 00000000000..866f8d7cb65 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/excludeParentKeys.ts @@ -0,0 +1,21 @@ +/** + * This is a copy of @tokens-studio/sd-transforms/dist/parsers/exclude-parent-key.js because it is not provided in the exports and we need to update the types. + */ +import { DeepKeyTokenMap } from "../../../../types/tokenStudio/designTokenTypes.js"; +import { TransformOptions } from "../../../../types/styleDictionary/transformOptions.js"; + +export function excludeParentKeys( + dictionary: DeepKeyTokenMap, + transformOpts?: TransformOptions +): DeepKeyTokenMap { + if (!transformOpts?.excludeParentKeys) { + return dictionary; + } + const copy = {}; + Object.values(dictionary).forEach((set) => { + Object.entries(set).forEach(([key, tokenGroup]) => { + copy[key] = tokenGroup; + }); + }); + return copy; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/expandComposites.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/expandComposites.ts new file mode 100644 index 00000000000..fcc4d362d21 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/expandComposites.ts @@ -0,0 +1,109 @@ +/** + * This is a copy/extension of @tokens-studio/sd-transforms/dist/parsers/expand-composites.js but now with better types! + */ + +import { resolveReference } from "./resolveRelevance.js"; +import { typeMap } from "../../../../types/tokenTypes/typeMaps.js"; +import { TransformOptions } from "../../../../types/styleDictionary/transformOptions.js"; +import { + DeepKeyTokenMap, + ExpandableTokenTypes, + SingleExpandableToken, + SingleToken, +} from "../../../../types/tokenStudio/designTokenTypes.js"; +import { ExpandFilter } from "../../../../types/tokenStudio/expandOptions.js"; + +export function expandToken(compToken: SingleToken, isShadow = false): SingleToken { + if (typeof compToken.value !== "object") { + return compToken; + } + const expandedObj = {} as SingleExpandableToken; + + const getType = (key: string) => typeMap[compToken.type][key] ?? key; + + // multi-shadow + if (isShadow && Array.isArray(compToken.value)) { + compToken.value.forEach((shadow, index) => { + expandedObj[index + 1] = {}; + Object.entries(shadow).forEach(([key, value]) => { + expandedObj[index + 1][key] = { + value: `${value}`, + type: getType(key), + }; + }); + }); + } else { + Object.entries(compToken.value).forEach(([key, value]) => { + expandedObj[key] = { + value: `${value}`, + type: getType(key), + }; + }); + } + + return expandedObj; +} + +function shouldExpand( + token: T, + condition: boolean | ExpandFilter, + filePath: string +): boolean { + if (typeof condition === "function") { + return condition(token, filePath); + } + return condition; +} + +function recurse( + slice: SingleToken | DeepKeyTokenMap, + copy: DeepKeyTokenMap, + filePath: string, + transformOpts: TransformOptions = {} +) { + const opts = { + ...transformOpts, + expand: { + composition: true, + typography: false, + border: false, + shadow: false, + colorScheme: false, + }, + }; + + for (const key in slice) { + const token = slice[key] as SingleToken | DeepKeyTokenMap; + if (token.value && token.type) { + if (typeof token.type === "string" && ExpandableTokenTypes[token.type.toUpperCase()]) { + const expandType = token.type === "boxShadow" ? ExpandableTokenTypes.SHADOW : token.type; + const expand = shouldExpand( + token as SingleExpandableToken, + opts.expand[expandType], + filePath + ); + if (expand) { + // if token uses a reference, resolve it + token.value = resolveReference(token.value, copy); + slice[key] = expandToken(token, expandType === "shadow"); + } + } else { + new Error(`Error: Malformed token. ${token}`); + } + } else if (typeof token === "object") { + recurse(token, copy, filePath, transformOpts); + } else { + new Error(`Error unexpected${token}`); + } + } +} + +export function expandComposites( + dictionary: DeepKeyTokenMap, + filePath: string, + transformOpts?: TransformOptions +): DeepKeyTokenMap { + const copy = { ...dictionary }; + recurse(copy, copy, filePath, transformOpts); + return copy; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/resolveRelevance.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/resolveRelevance.ts new file mode 100644 index 00000000000..9ea9c5a94a1 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/resolveRelevance.ts @@ -0,0 +1,50 @@ +/** + * This is a copy/extension of sd-transforms/src/parsers/resolveReference.ts but now with better types! + */ +import { TokenBoxshadowValue as TokenBoxShadowValue } from "@tokens-studio/types"; +import { default as usesReference } from "style-dictionary/lib/utils/references/usesReference.js"; +import { default as getReferences } from "style-dictionary/lib/utils/references/getReferences.js"; +import { DeepKeyTokenMap, SingleToken } from "../../../../types/tokenStudio/designTokenTypes.js"; + +// Type function to determine whether the obj is `tokenValue` or `{ value: tokenValue }` +function isReferenceValue( + obj: SingleToken["value"] | { value: SingleToken["value"] } +): obj is { value: SingleToken["value"] } { + return Object.prototype.hasOwnProperty.call(obj, "value"); +} + +function flattenValues["value"]>(val: T): T { + return Object.fromEntries(Object.entries(val).map(([k, v]) => [k, v.value])) as T; +} + +// first in normal situation, second if it's another nested reference +type boundGetRef = (ref: string) => Array["value"]> | Array<{ value: SingleToken["value"] }>; + +export function resolveReference["value"]>( + tokenValue: T, + copy: DeepKeyTokenMap +): T { + const boundGetRef = getReferences.bind({ properties: copy }) as boundGetRef; + + let ref = tokenValue; + while (ref && typeof ref === "string" && usesReference(ref)) { + try { + const getRefResult = boundGetRef(ref)[0]; + + // If every key of the result is a number, the ref value is a multi-value, which means TokenBoxShadowValue[] + if (Object.keys(getRefResult).every((key) => !isNaN(Number(key)))) { + ref = Object.values(getRefResult).map((refPart: TokenBoxShadowValue) => flattenValues(refPart)) as T; + } else if (isReferenceValue(getRefResult)) { + // this means it spit back a reference { value: '{deepRef}' } + // and we'll continue the while loop + ref = getRefResult.value as T; + } else { + ref = flattenValues(getRefResult) as T; + } + } catch (error: unknown) { + console.warn(`Warning: could not resolve reference ${ref}`); + return ref; + } + } + return ref; +} diff --git a/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/transformFontWeights.ts b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/transformFontWeights.ts new file mode 100644 index 00000000000..54e3a06d409 --- /dev/null +++ b/packages/calcite-design-tokens/support/token-transformer/styleDictionary/parser/utils/transformFontWeights.ts @@ -0,0 +1,31 @@ +// This is a copy/extension of sd-transforms/src/transformFontWeights.ts +// eslint-disable-next-line @cspell/spellchecker +// "demi" was added to align with our design terminology. This was added to utils because these named exports are not available from the node module dependency. + +import { FontWeight } from "../../../../types/tokenStudio/fontWeight.js"; + +export const fontStyles = ["italic", "oblique", "normal"]; +export const fontWeightReg = new RegExp(`(?.+?)\\s?(?