diff --git a/.changeset/pre.json b/.changeset/pre.json index 9f320481e7b..ad9e8cd8b79 100644 --- a/.changeset/pre.json +++ b/.changeset/pre.json @@ -88,7 +88,6 @@ "@spectrum-css/typography": "8.0.1", "@spectrum-css/underlay": "6.0.1", "@spectrum-css/well": "7.0.1", - "@spectrum-tools/postcss-rgb-mapping": "1.0.0", "@spectrum-tools/stylelint-no-missing-var": "2.0.1", "@spectrum-tools/stylelint-no-unknown-custom-properties": "2.0.2", "@spectrum-tools/stylelint-no-unused-custom-properties": "2.0.3", diff --git a/.eslintrc b/.eslintrc index f422aa9e96a..f637c2c6d15 100644 --- a/.eslintrc +++ b/.eslintrc @@ -19,6 +19,7 @@ "semi": ["warn", "always"], "space-before-blocks": ["warn", "always"] }, + "ignorePatterns": ["!.storybook"], "overrides": [ { "files": ["*.json"], diff --git a/.github/QUICK-START.md b/.github/QUICK-START.md index 4b97fcab7e8..68350b21b25 100644 --- a/.github/QUICK-START.md +++ b/.github/QUICK-START.md @@ -10,27 +10,54 @@ Install the components you want along with their dependencies. Here's an example yarn add -DW @spectrum-css/tokens @spectrum-css/typography @spectrum-css/page @spectrum-css/icon @spectrum-css/button ``` -Spectrum CSS components utilize custom properties in order to change themes and scales. For these to apply, a couple of classes need to be added to the document’s `` tag based on the [visual language](https://github.com/adobe/spectrum-css?tab=readme-ov-file#visual-language), [scale](https://github.com/adobe/spectrum-css?tab=readme-ov-file#scales), and [theme](https://github.com/adobe/spectrum-css?tab=readme-ov-file#themes-colorstops) you wish to use. For example, the following code snippet will display styling for the default Spectrum visual language using medium scale and light color theme: +Spectrum CSS components utilize custom properties in order to express our design language through a set of core tokens. We leverage the `@adobe/spectrum-tokens` data as a source of this design data and convert it into a set of CSS custom properties. This allows us to use the tokens in our components and to create a consistent design language across all of our components. + +Some of these tokens have different values depending on the visual language or scale being used. The default values for all tokens are set to the default values for the light theme and medium scale. + +To force the dark theme, you can add `color-scheme: dark` to your container element. Doing this will force the dark value to be used for all tokens that have one. This can be done at any level of the DOM and by leveraging the cascade, the color schemes can be nested or changed at any level. For example, if you want to force the dark theme for a specific component, you can add `color-scheme: dark` to that component's container element. ```html - + +
+

A dark themed container

+
+

A light themed container

+
+
+``` + +The design language also includes a set of token values that represent different device sizes. At the moment, these values are only defined as "medium" and "large", with "medium" as the default which maps generally to a desktop or laptop screen. The "large" value is intended for smaller devices, such as phones and tablets. The default value for all tokens is set to the default value for the medium scale. To force the large scale, you can update the cascading layers inheritance: + +```css +@layers defaults, medium; + +@media screen and (min-width: 768px) { + @layers defaults, large; +} ``` +What's happening here is that the `defaults` layer is being overridden by the `large` layer when the screen size is greater than 768px. This means that all tokens that have a value for the `large` scale will be used instead of the default value. The most useful feature of this approach is that each application can make their own decision about which scale to leverage and at what screen size. This allows for a lot of flexibility in how the design language is applied to different applications. + Use the `index.css` files in your project to include component and global styles ([background theme/colorstop](https://github.com/adobe/spectrum-css?tab=readme-ov-file#themes-colorstops), [platform scaling](https://github.com/adobe/spectrum-css?tab=readme-ov-file#scales), etc.) for the component. If you don't need all of the global styles, peek at the docs for [including assets](https://github.com/adobe/spectrum-css?tab=readme-ov-file#including-assets)). Use this file by including the stylesheet (plus stylesheets for dependencies) in the `` tag: ```html - - - - - + + + + + ``` @@ -38,9 +65,9 @@ Inside the `` tag, add the markup for your component (Spectrum button in o ```html ``` @@ -48,23 +75,23 @@ To put it all together, your final html file will look like this: ```html - - - - - - - + + + + + + + ``` diff --git a/.storybook/assets/base.css b/.storybook/assets/base.css index e5886de13ec..ac3fb893ffb 100644 --- a/.storybook/assets/base.css +++ b/.storybook/assets/base.css @@ -1,5 +1,3 @@ -/* stylelint-disable selector-class-pattern -- Targeting pre-defined Storybook classes */ - /*! * Copyright 2024 Adobe. All rights reserved. * @@ -13,33 +11,42 @@ * governing permissions and limitations under the License. */ -body { +:root { --spectrum-font-family: var(--spectrum-sans-font-family-stack); --spectrum-font-style: var(--spectrum-default-font-style); --spectrum-font-size: var(--spectrum-font-size-100); + /* Gradient that changes with the color theme. */ + --spectrum-examples-gradient: linear-gradient(45deg, var(--spectrum-magenta-1500), var(--spectrum-blue-1500)); + + /* Gradients that do not change with the color theme, for use in static color backgrounds. */ + --spectrum-examples-gradient-static-black: linear-gradient(45deg, rgb(255 241 246), rgb(238 245 255)); + --spectrum-examples-gradient-static-white: linear-gradient(45deg, rgb(64 0 22), rgb(14 24 67)); + + color-scheme: light dark; +} + +body { margin: 0; font-family: var(--spectrum-font-family); font-size: var(--spectrum-font-size); font-style: var(--spectrum-font-style); - - color: var(--spectrum-neutral-content-color-default, rgb(34, 34, 34)); - background-color: var(--spectrum-background-base-color, rgb(230, 230, 230)); } -.spectrum { - color: var(--spectrum-neutral-content-color-default); - background-color: var(--spectrum-background-base-color); - -webkit-tap-highlight-color: rgba(0, 0, 0, 0%); +body, +.docs-story { + color: var(--spectrum-neutral-content-color-default, rgb(34, 34, 34)); + background: var(--spectrum-background-base-color, rgb(230, 230, 230)); + -webkit-tap-highlight-color: rgb(0, 0, 0, 0%); } -.spectrum .spectrum-examples-static-black { - background: var(--spectrum-examples-gradient-static-black); +.spectrum-examples-static-black { + background: var(--spectrum-examples-gradient-static-black) !important; } -.spectrum .spectrum-examples-static-white { - background: var(--spectrum-examples-gradient-static-white); +.spectrum-examples-static-white { + background: var(--spectrum-examples-gradient-static-white) !important; } /* Hide the SVG elements that only include references */ @@ -61,7 +68,7 @@ svg:has(symbol):not(:has(use)) { line-height: normal; letter-spacing: normal; text-transform: none; - border-block-end: 1px solid hsla(203deg, 50%, 30%, 15%); + border-block-end: 1px solid hsl(203deg, 50%, 30%, 15%); } /* Force the modal wrapper to be contained by the frame not the viewport */ @@ -76,5 +83,3 @@ svg:has(symbol):not(:has(use)) { story view), due to Storybook's inline style that sets overflow: auto */ overflow: visible !important; } - -/* stylelint-enable selector-class-pattern */ diff --git a/.storybook/decorators/context.js b/.storybook/decorators/context.js index cc147ee10cd..026838f9083 100644 --- a/.storybook/decorators/context.js +++ b/.storybook/decorators/context.js @@ -47,9 +47,6 @@ export const withContextWrapper = makeDecorator({ // Start by attaching the appropriate tokens to the container toggleStyles(document.body, "tokens", tokens, true); - // add the default classes to the body to ensure labels, headings, and borders are styled correctly - document.body.classList.add("spectrum", "spectrum--light", "spectrum--medium"); - for (const container of fetchContainers(id, isDocs, isTesting)) { // Check if the container is a testing wrapper to prevent applying colors around the testing grid const isTestingWrapper = isTesting ? container.matches("body:has([data-testing-preview]),[data-testing-preview]") : false; @@ -71,9 +68,6 @@ export const withContextWrapper = makeDecorator({ // If we can't determine the static key, we can't use the static color if (!staticKey) hasStaticElement = false; - // Every container gets the spectrum class - container.classList.toggle("spectrum", true); - // Let the static color override the color if it's set if (!isTestingWrapper && hasStaticElement && staticColorSettings[staticKey]?.color) { color = staticColorSettings[staticKey].color; @@ -85,13 +79,8 @@ export const withContextWrapper = makeDecorator({ color = "light"; } - for (let c of ["light", "dark"]) { - container.classList.toggle(`spectrum--${c}`, c === color); - } - - for (const s of ["medium", "large"]) { - container.classList.toggle(`spectrum--${s}`, s === scale); - } + container.style.setProperty("color-scheme", color); + container.classList.toggle("spectrum--large", scale === "large"); if (!isTestingWrapper) { if (hasStaticElement && staticKey && staticColorSettings[staticKey]) { diff --git a/.storybook/decorators/icon-sprites.js b/.storybook/decorators/icon-sprites.js index b576632bcab..6a42df1692b 100644 --- a/.storybook/decorators/icon-sprites.js +++ b/.storybook/decorators/icon-sprites.js @@ -10,10 +10,6 @@ export const withIconSpriteSheet = makeDecorator({ name: "withIconSpriteSheet", parameterName: "spritesheet", wrapper: (StoryFn, context) => { - const { - loaded = {}, - } = context; - useEffect(() => { // Inject the sprite sheets into the document let sprite = document.getElementById("spritesheets"); diff --git a/.storybook/decorators/utilities.js b/.storybook/decorators/utilities.js index f6722ae79ea..b5fd6fe0219 100644 --- a/.storybook/decorators/utilities.js +++ b/.storybook/decorators/utilities.js @@ -116,7 +116,7 @@ export const Container = ({ if (withBorder) { borderStyles["padding-inline"] = "24px"; borderStyles["padding-block"] = "24px"; - borderStyles["border"] = "1px solid rgba(var(--spectrum-gray-600-rgb), 20%)"; + borderStyles["border"] = "1px solid color-mix(in srgb, var(--spectrum-gray-600) 20%, transparent)"; borderStyles["border-radius"] = "4px"; gap = 80; } @@ -158,6 +158,7 @@ export const Container = ({ "row-gap": "24px", "align-items": heading && level > 1 ? "flex-start" : undefined, "justify-content": direction === "column" ? "center" : "flex-start", + "background": level === 1 && !isDocs ? "var(--spectrum-background-base-color)" : undefined, ...borderStyles, ...wrapperStyles, })} diff --git a/.storybook/foundations/corner-rounding/action-button-corner-rounding.stories.js b/.storybook/foundations/corner-rounding/action-button-corner-rounding.stories.js index c944ca467ab..d02eda61554 100644 --- a/.storybook/foundations/corner-rounding/action-button-corner-rounding.stories.js +++ b/.storybook/foundations/corner-rounding/action-button-corner-rounding.stories.js @@ -14,7 +14,7 @@ export default { handles: ["click .spectrum-ActionButton:not([disabled])"], }, }, - tags: ['!dev'], + tags: ["!dev"], }; const ActionButton = (args, context) => html` diff --git a/.storybook/foundations/corner-rounding/checkbox-corner-rounding.stories.js b/.storybook/foundations/corner-rounding/checkbox-corner-rounding.stories.js index 96aa3ce69c4..aba75ab0a43 100644 --- a/.storybook/foundations/corner-rounding/checkbox-corner-rounding.stories.js +++ b/.storybook/foundations/corner-rounding/checkbox-corner-rounding.stories.js @@ -12,10 +12,10 @@ export default { }, parameters: { actions: { - handles: ['click input[type="checkbox"]'], + handles: ["click input[type=\"checkbox\"]"], }, }, - tags: ['!dev'], + tags: ["!dev"], }; const Checkbox = (args = {}, context = {}) => html` @@ -82,7 +82,7 @@ const CheckboxTable = (args, context) => { `; -} +}; export const CheckboxExamples = CheckboxTable.bind({}); CheckboxExamples.args = {}; diff --git a/.storybook/foundations/drop-shadow/drop-shadow.stories.js b/.storybook/foundations/drop-shadow/drop-shadow.stories.js index 6d936af9411..55d4b048708 100644 --- a/.storybook/foundations/drop-shadow/drop-shadow.stories.js +++ b/.storybook/foundations/drop-shadow/drop-shadow.stories.js @@ -1,5 +1,7 @@ import { html } from "lit"; import { classMap } from "lit/directives/class-map.js"; +import { styleMap } from "lit/directives/style-map.js"; + import "./index.css"; export default { @@ -28,17 +30,15 @@ const DropShadowSwatch = ({ const DropShadowBackground = ( { - rootClass = "spectrum-Foundations-Example-swatch-container", color, ...args }, context, ) => html`
${DropShadowSwatch(args, context)} diff --git a/.storybook/foundations/drop-shadow/index.css b/.storybook/foundations/drop-shadow/index.css index bf54a5ddce9..efe1807152b 100644 --- a/.storybook/foundations/drop-shadow/index.css +++ b/.storybook/foundations/drop-shadow/index.css @@ -13,103 +13,50 @@ governing permissions and limitations under the License. /* stylelint-disable spectrum-tools/no-unknown-custom-properties */ .spectrum-Foundations-Example-DropShadow-swatch { - block-size: 150px; - inline-size: 150px; - background-color: var(--spectrum-gray-25); - border-radius: var(--spectrum-corner-radius-large-default); - border: transparent; -} + block-size: 150px; + inline-size: 150px; -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch { - background-color: var(--spectrum-gray-75); /* matches dark mode design spec rgb(34, 34, 34) */ + /* matches dark mode design spec rgb(34, 34, 34) */ + background-color: light-dark(var(--spectrum-gray-25), var(--spectrum-gray-75)); + border-radius: var(--spectrum-corner-radius-large-default); + border: transparent; } .spectrum-Foundations-Example-DropShadow-swatch--emphasized-default-box-shadow { - box-shadow: - var(--spectrum-drop-shadow-emphasized-default-x) - var(--spectrum-drop-shadow-emphasized-default-y) - var(--spectrum-drop-shadow-emphasized-default-blur) - var(--mod-drop-shadow-emphasized-default-color, var(--spectrum-drop-shadow-emphasized-default-color)); + box-shadow: var(--spectrum-drop-shadow-emphasized-default-x) var(--spectrum-drop-shadow-emphasized-default-y) var(--spectrum-drop-shadow-emphasized-default-blur) var(--mod-drop-shadow-emphasized-default-color, var(--spectrum-drop-shadow-emphasized-default-color)); } .spectrum-Foundations-Example-DropShadow-swatch--emphasized-default-drop-shadow { - filter: drop-shadow( - var(--spectrum-drop-shadow-emphasized-default-x) - var(--spectrum-drop-shadow-emphasized-default-y) - calc(var(--spectrum-drop-shadow-emphasized-default-blur) / 2) /* adjust blur by half of box-shadow */ - var(--mod-drop-shadow-emphasized-default-color, var(--spectrum-drop-shadow-emphasized-default-color)) - ); -} - -.spectrum--light .spectrum-Foundations-Example-DropShadow-swatch--emphasized-default-box-shadow, -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch--emphasized-default-box-shadow, -.spectrum--light .spectrum-Foundations-Example-DropShadow-swatch--emphasized-default-drop-shadow, -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch--emphasized-default-drop-shadow { -/* adjustment because color tokens do not work properly on foundations pages */ - --mod-drop-shadow-emphasized-default-color: var(--spectrum-drop-shadow-color-100); + filter: drop-shadow(var(--spectrum-drop-shadow-emphasized-default-x) var(--spectrum-drop-shadow-emphasized-default-y) calc(var(--spectrum-drop-shadow-emphasized-default-blur) / 2) /* adjust blur by half of box-shadow */ var(--mod-drop-shadow-emphasized-default-color, var(--spectrum-drop-shadow-emphasized-default-color))); } .spectrum-Foundations-Example-DropShadow-swatch--emphasized-hover-box-shadow { - box-shadow: - var(--spectrum-drop-shadow-emphasized-hover-x) - var(--spectrum-drop-shadow-emphasized-hover-y) - var(--spectrum-drop-shadow-emphasized-hover-blur) - var(--mod-drop-shadow-emphasized-hover-color, var(--spectrum-drop-shadow-emphasized-hover-color)); + box-shadow: var(--spectrum-drop-shadow-emphasized-hover-x) var(--spectrum-drop-shadow-emphasized-hover-y) var(--spectrum-drop-shadow-emphasized-hover-blur) var(--mod-drop-shadow-emphasized-hover-color, var(--spectrum-drop-shadow-emphasized-hover-color)); } .spectrum-Foundations-Example-DropShadow-swatch--emphasized-hover-drop-shadow { - filter: drop-shadow( - var(--spectrum-drop-shadow-emphasized-hover-x) - var(--spectrum-drop-shadow-emphasized-hover-y) - calc(var(--spectrum-drop-shadow-emphasized-hover-blur) / 2) /* adjust blur by half of box-shadow */ - var(--mod-drop-shadow-emphasized-hover-color, var(--spectrum-drop-shadow-emphasized-hover-color)) - ); -} - -.spectrum--light .spectrum-Foundations-Example-DropShadow-swatch--emphasized-hover-drop-shadow, -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch--emphasized-hover-drop-shadow, -.spectrum--light .spectrum-Foundations-Example-DropShadow-swatch--emphasized-hover-box-shadow, -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch--emphasized-hover-box-shadow { -/* adjustment because color tokens do not work properly on foundations pages */ - --mod-drop-shadow-emphasized-hover-color: var(--spectrum-drop-shadow-color-200); + filter: drop-shadow(var(--spectrum-drop-shadow-emphasized-hover-x) var(--spectrum-drop-shadow-emphasized-hover-y) calc(var(--spectrum-drop-shadow-emphasized-hover-blur) / 2) /* adjust blur by half of box-shadow */ var(--mod-drop-shadow-emphasized-hover-color, var(--spectrum-drop-shadow-emphasized-hover-color))); } .spectrum-Foundations-Example-DropShadow-swatch--elevated-box-shadow { - box-shadow: - var(--spectrum-drop-shadow-elevated-x) - var(--spectrum-drop-shadow-elevated-y) - var(--spectrum-drop-shadow-elevated-blur) - var(--mod-drop-shadow-elevated-color, var(--spectrum-drop-shadow-elevated-color)); + box-shadow: var(--spectrum-drop-shadow-elevated-x) var(--spectrum-drop-shadow-elevated-y) var(--spectrum-drop-shadow-elevated-blur) var(--mod-drop-shadow-elevated-color, var(--spectrum-drop-shadow-elevated-color)); } .spectrum-Foundations-Example-DropShadow-swatch--elevated-drop-shadow { - filter: drop-shadow( - var(--spectrum-drop-shadow-elevated-x) - var(--spectrum-drop-shadow-elevated-y) - calc(var(--spectrum-drop-shadow-elevated-blur) / 2) /* adjust blur by half of box-shadow */ - var(--mod-drop-shadow-elevated-color, var(--spectrum-drop-shadow-elevated-color)) - ); -} - -.spectrum--light .spectrum-Foundations-Example-DropShadow-swatch--elevated-drop-shadow, -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch--elevated-drop-shadow, -.spectrum--light .spectrum-Foundations-Example-DropShadow-swatch--elevated-box-shadow, -.spectrum--dark .spectrum-Foundations-Example-DropShadow-swatch--elevated-box-shadow { -/* adjustment because color tokens do not work properly on foundations pages */ - --mod-drop-shadow-elevated-color: var(--spectrum-drop-shadow-color-200); + filter: drop-shadow(var(--spectrum-drop-shadow-elevated-x) var(--spectrum-drop-shadow-elevated-y) calc(var(--spectrum-drop-shadow-elevated-blur) / 2) /* adjust blur by half of box-shadow */ var(--mod-drop-shadow-elevated-color, var(--spectrum-drop-shadow-elevated-color))); } .spectrum-Foundations-Example-swatch-container { - background-color: var(--spectrum-gray-25); - block-size: 200px; - inline-size: 300px; - display: flex; - align-items: center; - justify-content: center; + background-color: var(--spectrum-gray-25); + block-size: 200px; + inline-size: 300px; + display: flex; + align-items: center; + justify-content: center; } .spectrum-Foundations-Example-variant-container { - background-color: var(--spectrum-gray-25); - display: flex; - flex-direction: row; + background-color: var(--spectrum-gray-25); + display: flex; + flex-direction: row; } diff --git a/.storybook/main.js b/.storybook/main.js index 1ef01068d65..ccfb9c973c8 100644 --- a/.storybook/main.js +++ b/.storybook/main.js @@ -1,6 +1,6 @@ import fs from "node:fs"; import path from "node:path"; -import remarkGfm from 'remark-gfm'; +import remarkGfm from "remark-gfm"; // Get a list of all the folders in the components directory const componentDir = path.resolve(__dirname, "../components"); @@ -112,12 +112,12 @@ export default { alias: [ ...components.map(component => ({ find: `@spectrum-css/${component}`, replacement: path.resolve(__dirname, `../components/${component}`) })), { - find: `@spectrum-css/tokens`, - replacement: path.resolve(__dirname, `../tokens`), + find: "@spectrum-css/tokens", + replacement: path.resolve(__dirname, "../tokens"), }, { - find: `@spectrum-css/ui-icons`, - replacement: path.resolve(__dirname, `../ui-icons`), + find: "@spectrum-css/ui-icons", + replacement: path.resolve(__dirname, "../ui-icons"), }, ], } diff --git a/.storybook/manager.js b/.storybook/manager.js index 1e1fe3ef8d1..040e27dc561 100644 --- a/.storybook/manager.js +++ b/.storybook/manager.js @@ -1,15 +1,12 @@ import { addons } from "@storybook/manager-api"; import { create } from "@storybook/theming"; -import { startCase } from "lodash"; +import { startCase } from "lodash-es"; import "./assets/index.css"; import logo from "./assets/logo.svg"; import pkg from "./package.json"; -const root = document.body ?? document.documentElement; -if (root) root.classList.add("spectrum", "spectrum--light", "spectrum--medium"); - addons.setConfig({ theme: create({ base: "light", @@ -65,6 +62,6 @@ addons.setConfig({ }), sidebar: { showRoots: false, - renderLabel: ({ name, type }) => (type === 'story' ? name : startCase(name)) + " 📚", + renderLabel: ({ name, type }) => (type === "story" ? name : startCase(name)) + " 📚", }, }); diff --git a/README.md b/README.md index fd3c0dd4b76..fae3dfe4f5b 100644 --- a/README.md +++ b/README.md @@ -7,7 +7,7 @@

Spectrum CSS

A CSS-implementation of the Spectrum design language

- +Spectrum CSS illustration ## Features @@ -16,7 +16,7 @@ - 🧪 **Rigorously tested**: These individually-versioned components have been vetted to be accessible and inclusive of global audiences. - 📱 **Multi-platform support**: We support [evergreen browsers](https://github.com/adobe/spectrum-css?tab=readme-ov-file#browser-support) for scalability and flexibility. -     [](https://opensource.adobe.com/spectrum-css/get-started.html)   [](https://opensource.adobe.com/spectrum-css/) +     [Adobe logo](https://opensource.adobe.com/spectrum-css/get-started.html)   [Storybook logo](https://opensource.adobe.com/spectrum-css/) ## Using Spectrum CSS @@ -72,37 +72,49 @@ Tokens values are mapped to context-specific classes which can be applied to the All contexts you want to use must be defined in order to load all the appropriate custom properties for the components you are using. -#### Global variables - -##### Visual language - -- `.spectrum` - The default visual language for Spectrum CSS; represents the Spectrum 2 visual language. +#### Using custom property tokens for theming ##### Scales Scales represent the browsing context of the user. They are used to adjust the size of components to improve readability and usability on different devices. -- `.spectrum--medium` - The default scale for Spectrum CSS, used for desktop and tablet devices -- `.spectrum--large` - A larger scale for Spectrum CSS, used for mobile devices and other small screens to create a more touch-friendly experience +- `Medium` - Used for desktop and tablet devices; this is the default scale for all components. +- `Large` - A larger scale for Spectrum CSS, used for mobile devices and other small screens to create a more touch-friendly experience. Styles are applied to the large layer and can be set to override the medium layer by updating the cascading layers order: + +```css +@layer defaults, medium, large; +``` ##### Themes (colorstops) Themes represent the color scheme of the user's browsing context. They are used to adjust the color of components to improve readability and usability in different environments. -- `.spectrum--light` - The default theme for Spectrum CSS, used for light mode -- `.spectrum--dark` - A darker theme for Spectrum CSS, used for dark mode +- `color-scheme: light;` - The default theme for Spectrum CSS, used for light mode +- `color-scheme: dark;` - A darker theme for Spectrum CSS, used for dark mode Other themes are available but are in the process of being deprecated and should not be used in new projects. #### Context example -Put together, we would define the context for our application in the following way: +Put together, an application can opt into a visual language by setting the application's preferred color-scheme. For apps who want to support only one color scheme, you can set the `color-scheme` property on the `` element. For example, if you want to support only light mode, you can set the `color-scheme` property to `light`: -```html - +```css +:root { + color-scheme: light; +} ``` -Because CSS custom properties honor the cascading nature of CSS, you can infinitely nest different contexts. For example, you could have a `.spectrum--dark` context inside of a `.spectrum--light` context, and components will honor the innermost context. +Individual containers or components can override this color-scheme by setting the `color-scheme` property on the component itself. For example, if you want to support only dark mode for a specific component, you can set the `color-scheme` property to `dark`: + +```css +.my-container { + color-scheme: dark; +} +``` + +If an application wants to allow customers' preferred color scheme to be honored, they can define the preferred order of themes by listing the preferred theme first (used in cases where users have no preference defined), followed by the alternate theme. For example, if you want to support both light and dark mode, but dark is the preferred theme for your app, you can set `color-scheme: dark light`. + +The only way to force a theme is to set only one value without a fallback. For example, if you want to ensure a popover renders only light mode, you can set `color-scheme: light` on that element. ### Modifying components @@ -112,16 +124,6 @@ You can override variables and modify Spectrum CSS' look and feel by re-defining Some components require certain "UI icons" to render. These icons are released within the [`@spectrum-css/ui-icons`](https://www.npmjs.com/package/@spectrum-css/ui-icons) package and are used by components like `@spectrum-css/icon` and `@spectrum-css/actionbutton`. -Based on [which scales](https://github.com/adobe/spectrum-css?tab=readme-ov-file#scales) you'll be using, you can choose to load different files: - -- `spectrum-css-icons.svg` - Both medium and large icons for responsive UIs that support both `.spectrum--medium` and `.spectrum--large` - -- `spectrum-css-icons-medium.svg` - Medium icons only, supports `.spectrum--medium` only - -- `spectrum-css-icons-large.svg` - Large icons only, supports `.spectrum--large` only - -**Note:** If you're using `spectrum-css-icons.svg`, be sure to add `.spectrum--medium` or `.spectrum--large` to the `` element, or you'll see both medium and large icons at once. - ### Importing workflow icons If your app has any level of complexity, you'll need "workflow" icons to indicate actions. These icons are not required to render the base components, and instead are used within buttons or menu items for actions like share, play, justify, save, etc. diff --git a/components/accordion/dist/metadata.json b/components/accordion/dist/metadata.json index bc3c102ec9b..c83475bd4a7 100644 --- a/components/accordion/dist/metadata.json +++ b/components/accordion/dist/metadata.json @@ -189,7 +189,7 @@ "--spectrum-font-size-500", "--spectrum-font-size-700", "--spectrum-gray-200", - "--spectrum-gray-900-rgb", + "--spectrum-gray-900", "--spectrum-line-height-100", "--spectrum-logical-rotation", "--spectrum-neutral-content-color-default", diff --git a/components/accordion/index.css b/components/accordion/index.css index f3b52638318..353c60b2156 100644 --- a/components/accordion/index.css +++ b/components/accordion/index.css @@ -46,10 +46,10 @@ --spectrum-accordion-item-content-line-height: var(--spectrum-line-height-100); /* Colors */ - --spectrum-accordion-background-color-default: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-background-opacity-default)); - --spectrum-accordion-background-color-hover: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-background-opacity-hover)); - --spectrum-accordion-background-color-down: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-background-opacity-down)); - --spectrum-accordion-background-color-key-focus: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-background-opacity-key-focus)); + --spectrum-accordion-background-color-default: color-mix(in sRGB, var(--spectrum-gray-900) var(--spectrum-background-opacity-default), transparent); + --spectrum-accordion-background-color-hover: color-mix(in sRGB, var(--spectrum-gray-900) var(--spectrum-background-opacity-hover), transparent); + --spectrum-accordion-background-color-down: color-mix(in sRGB, var(--spectrum-gray-900) var(--spectrum-background-opacity-down), transparent); + --spectrum-accordion-background-color-key-focus: color-mix(in sRGB, var(--spectrum-gray-900) var(--spectrum-background-opacity-key-focus), transparent); /* Label */ --spectrum-accordion-item-header-color-default: var(--spectrum-neutral-content-color-default); diff --git a/components/accordion/stories/template.js b/components/accordion/stories/template.js index 79fc3648bf3..70074b13980 100644 --- a/components/accordion/stories/template.js +++ b/components/accordion/stories/template.js @@ -6,7 +6,7 @@ import { ifDefined } from "lit/directives/if-defined.js"; import { repeat } from "lit/directives/repeat.js"; import { styleMap } from "lit/directives/style-map.js"; -import "../index.css"; +import "@spectrum-css/accordion/index.css"; export const AccordionItem = ({ heading, diff --git a/components/actionmenu/package.json b/components/actionmenu/package.json index 32fe45c44e0..3f2f2ae60ec 100644 --- a/components/actionmenu/package.json +++ b/components/actionmenu/package.json @@ -31,6 +31,23 @@ "@spectrum-css/popover": ">=9.0.0-next.0", "@spectrum-css/tokens": ">=16.1.0-next.0" }, + "peerDependenciesMeta": { + "@spectrum-css/actionbutton": { + "optional": true + }, + "@spectrum-css/icon": { + "optional": true + }, + "@spectrum-css/menu": { + "optional": true + }, + "@spectrum-css/popover": { + "optional": true + }, + "@spectrum-css/tokens": { + "optional": true + } + }, "devDependencies": { "@spectrum-css/actionbutton": "8.0.0-next.2", "@spectrum-css/icon": "10.0.0-next.1", @@ -54,22 +71,5 @@ { "swc": "https://opensource.adobe.com/spectrum-web-components/components/action-menu/" } - ], - "peerDependenciesMeta": { - "@spectrum-css/actionbutton": { - "optional": true - }, - "@spectrum-css/icon": { - "optional": true - }, - "@spectrum-css/menu": { - "optional": true - }, - "@spectrum-css/popover": { - "optional": true - }, - "@spectrum-css/tokens": { - "optional": true - } - } + ] } diff --git a/components/alertbanner/tokens.json b/components/alertbanner/tokens.json new file mode 100644 index 00000000000..b8756569025 --- /dev/null +++ b/components/alertbanner/tokens.json @@ -0,0 +1,54 @@ +{ + "alert-banner-close-button-spacing": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + } + } + }, + "alert-banner-edge-to-button": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + } + } + }, + "alert-banner-edge-to-divider": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + } + } + }, + "alert-banner-text-to-button-vertical": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + } + } + } +} diff --git a/components/alertdialog/tokens.json b/components/alertdialog/tokens.json new file mode 100644 index 00000000000..a070fad96c8 --- /dev/null +++ b/components/alertdialog/tokens.json @@ -0,0 +1,28 @@ +{ + "alert-dialog-description-to-buttons": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-700}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-600}" + } + } + }, + "alert-dialog-padding": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-500}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + } + } + } +} diff --git a/components/assetcard/dist/metadata.json b/components/assetcard/dist/metadata.json index 94bf07de0af..27b8245979f 100644 --- a/components/assetcard/dist/metadata.json +++ b/components/assetcard/dist/metadata.json @@ -161,7 +161,6 @@ "--spectrum-gray-600", "--spectrum-gray-700", "--spectrum-gray-75", - "--spectrum-gray-75-rgb", "--spectrum-gray-900", "--spectrum-heading-cjk-font-style", "--spectrum-heading-cjk-font-weight", diff --git a/components/assetcard/index.css b/components/assetcard/index.css index 7b9ee81e647..74724eb5ff7 100644 --- a/components/assetcard/index.css +++ b/components/assetcard/index.css @@ -13,15 +13,13 @@ /* outer container, unstyled */ .spectrum-AssetCard { - --spectrum-assetcard-overlay-background-color: rgba(27 127 245 / 10%); + --spectrum-assetcard-overlay-background-color: rgb(27 127 245 / 10%); --spectrum-assetcard-background-color: var(--spectrum-gray-75); - --spectrum-assetcard-selectionindicator-background-color-default: rgba(var(--spectrum-gray-75-rgb), 0.9); + --spectrum-assetcard-selectionindicator-background-color-default: color-mix(in sRGB, var(--spectrum-gray-75) 90%, transparent); --spectrum-assetcard-selectionindicator-box-shadow-color: var(--spectrum-transparent-black-300); /* todo: this isn't quite the size from the XD file as 232px is not a size token, so we use 224px */ --spectrum-assetcard-asset-size: 224px; - --spectrum-assetcard-background-color: var(--spectrum-gray-75); - --spectrum-assetcard-overlay-background-color: rgba(27 127 245 / 10%); --spectrum-assetcard-asset-animation-duration: var(--spectrum-animation-duration-100); --spectrum-assetcard-asset-container-border-size: 1px; --spectrum-assetcard-header-margin-block-start: var(--spectrum-spacing-300); @@ -42,8 +40,6 @@ --spectrum-assetcard-selectionindicator-color: var(--spectrum-white); --spectrum-assetcard-selectionindicator-font-weight: var(--spectrum-bold-font-weight); --spectrum-assetcard-selectionindicator-font-size: var(--spectrum-font-size-400); - --spectrum-assetcard-selectionindicator-background-color-default: rgba(var(--spectrum-gray-75-rgb), 0.9); - --spectrum-assetcard-selectionindicator-box-shadow-color: var(--spectrum-transparent-black-300); /* title */ --spectrum-assetcard-title-text-color: var(--spectrum-gray-900); diff --git a/components/assetcard/tokens.json b/components/assetcard/tokens.json new file mode 100644 index 00000000000..4c9764ae091 --- /dev/null +++ b/components/assetcard/tokens.json @@ -0,0 +1,132 @@ +{ + "assestcard-focus-indicator-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + } + } + }, + "assetcard-border-color-selected": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + } + } + }, + "assetcard-border-color-selected-down": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-1000}" + } + } + }, + "assetcard-border-color-selected-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + } + } + }, + "assetcard-content-font-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{body-size-s}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{body-size-xs}" + } + } + }, + "assetcard-focus-ring-border-radius": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "9px" + } + } + }, + "assetcard-header-content-font-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{heading-size-xs}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{heading-size-xxs}" + } + } + }, + "assetcard-selectionindicator-background-color-ordered": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + } + } + }, + "assetcard-selectionindicator-margin": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "12px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "15px" + } + } + }, + "assetcard-title-font-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{heading-size-xs}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{heading-size-xxs}" + } + } + } +} diff --git a/components/assetlist/tokens.json b/components/assetlist/tokens.json new file mode 100644 index 00000000000..1b8c37cdbd0 --- /dev/null +++ b/components/assetlist/tokens.json @@ -0,0 +1,41 @@ +{ + "assetlist-border-color-key-focus": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + } + } + }, + "assetlist-item-background-color-selected": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 15%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 10%, transparent)" + } + } + }, + "assetlist-item-background-color-selected-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + } + } +} diff --git a/components/badge/tokens.json b/components/badge/tokens.json new file mode 100644 index 00000000000..77d0df43d3d --- /dev/null +++ b/components/badge/tokens.json @@ -0,0 +1,15 @@ +{ + "badge-label-icon-color-primary": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{black}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{white}" + } + } + } +} diff --git a/components/breadcrumb/dist/metadata.json b/components/breadcrumb/dist/metadata.json index 35fb0b03993..2062805635c 100644 --- a/components/breadcrumb/dist/metadata.json +++ b/components/breadcrumb/dist/metadata.json @@ -134,8 +134,8 @@ "--spectrum-corner-radius-small-default", "--spectrum-default-font-style", "--spectrum-disabled-content-color", + "--spectrum-drop-zone-background-color", "--spectrum-drop-zone-background-color-opacity", - "--spectrum-drop-zone-background-color-rgb", "--spectrum-extra-bold-font-weight", "--spectrum-focus-indicator-color", "--spectrum-focus-indicator-gap", diff --git a/components/breadcrumb/index.css b/components/breadcrumb/index.css index d8d46e277dc..076a6b026cc 100644 --- a/components/breadcrumb/index.css +++ b/components/breadcrumb/index.css @@ -61,7 +61,7 @@ --spectrum-breadcrumbs-action-button-color: var(--spectrum-neutral-subdued-content-color-default); --spectrum-breadcrumbs-action-button-color-disabled: var(--spectrum-disabled-content-color); --spectrum-breadcrumbs-focus-indicator-color: var(--spectrum-focus-indicator-color); - --spectrum-breadcrumbs-item-dragged-background: rgba(var(--spectrum-drop-zone-background-color-rgb), var(--spectrum-drop-zone-background-color-opacity)); + --spectrum-breadcrumbs-item-dragged-background: color-mix(in sRGB, var(--spectrum-drop-zone-background-color) var(--spectrum-drop-zone-background-color-opacity), transparent); /* Sub-component: heading */ --mod-heading-margin-end: 0px; diff --git a/components/button/tokens.json b/components/button/tokens.json new file mode 100644 index 00000000000..7ad522a2047 --- /dev/null +++ b/components/button/tokens.json @@ -0,0 +1,106 @@ +{ + "button-bottom-to-text-extra-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "13px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "17px" + } + } + }, + "button-bottom-to-text-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "13px" + } + } + }, + "button-bottom-to-text-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + } + } + }, + "button-bottom-to-text-small": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "4px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + } + } + }, + "button-top-to-text-extra-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "13px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + } + } + }, + "button-top-to-text-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "12px" + } + } + }, + "button-top-to-text-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "7px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "9px" + } + } + }, + "button-top-to-text-small": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "6px" + } + } + } +} diff --git a/components/calendar/dist/metadata.json b/components/calendar/dist/metadata.json index c4901c2be46..999e1f91e5a 100644 --- a/components/calendar/dist/metadata.json +++ b/components/calendar/dist/metadata.json @@ -166,7 +166,7 @@ "--spectrum-font-size-100", "--spectrum-font-size-300", "--spectrum-font-size-50", - "--spectrum-gray-100-rgb", + "--spectrum-gray-100", "--spectrum-gray-800", "--spectrum-logical-rotation", "--spectrum-neutral-content-color-default", diff --git a/components/calendar/index.css b/components/calendar/index.css index 68b3c73e049..6d621068021 100644 --- a/components/calendar/index.css +++ b/components/calendar/index.css @@ -12,7 +12,7 @@ */ .spectrum-Calendar { - --spectrum-calendar-day-background-color-selected-disabled: rgba(var(--spectrum-gray-100-rgb), 0.4); + --spectrum-calendar-day-background-color-selected-disabled: color-mix(in sRGB, var(--spectrum-gray-100) 40%, transparent); --spectrum-calendar-day-width: var(--mod-calendar-day-width, var(--spectrum-component-height-100)); --spectrum-calendar-day-height: var(--mod-calendar-day-height, var(--spectrum-component-height-100)); @@ -48,7 +48,7 @@ --spectrum-calendar-day-background: var(--mod-calendar-day-background-color, transparent); --spectrum-calendar-day-background-selected: var(--highcontrast-calendar-day-background-selected, var(--mod-calendar-day-background-color-selected, var(--spectrum-calendar-day-background-color-selected))); --spectrum-calendar-day-background-selected-hover: var(--highcontrast-calendar-day-background-selected-hover, var(--mod-calendar-day-background-color-selected-hover, var(--spectrum-calendar-day-background-color-selected-hover))); - --spectrum-calendar-day-background-color-selected-disabled: rgba(var(--spectrum-gray-100-rgb), 0.4); + --spectrum-calendar-day-background-color-selected-disabled: color-mix(in sRGB, var(--spectrum-gray-100) 40%, transparent); --spectrum-calendar-day-background-cap-selected: var(--highcontrast-calendar-day-background-cap-selected, var(--mod-calendar-day-background-color-cap-selected, var(--spectrum-calendar-day-background-color-cap-selected))); --spectrum-calendar-day-background-hover: var(--highcontrast-calendar-day-background-hover, var(--mod-calendar-day-background-color-hover, var(--spectrum-calendar-day-background-color-hover))); --spectrum-calendar-day-background-focus: var(--highcontrast-calendar-day-background-focus, var(--mod-calendar-day-background-color-key-focus, var(--spectrum-calendar-day-background-color-key-focus))); diff --git a/components/calendar/tokens.json b/components/calendar/tokens.json new file mode 100644 index 00000000000..9959e278b82 --- /dev/null +++ b/components/calendar/tokens.json @@ -0,0 +1,106 @@ +{ + "calendar-day-background-color-cap-selected": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + } + }, + "calendar-day-background-color-down": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{transparent-white-200}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{transparent-black-200}" + } + } + }, + "calendar-day-background-color-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-white) 7%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-black) 6%, transparent)" + } + } + }, + "calendar-day-background-color-key-focus": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-white) 7%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-black) 6%, transparent)" + } + } + }, + "calendar-day-background-color-selected": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 15%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 10%, transparent)" + } + } + }, + "calendar-day-background-color-selected-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + } + }, + "calendar-day-border-color-key-focus": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + } + } + }, + "calendar-day-today-background-color-selected-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + } + } +} diff --git a/components/card/dist/metadata.json b/components/card/dist/metadata.json index 8fc5a6b28df..910bd984200 100644 --- a/components/card/dist/metadata.json +++ b/components/card/dist/metadata.json @@ -101,7 +101,7 @@ "--mod-card-preview-background-color-hover", "--mod-card-preview-border-width-selected", "--mod-card-preview-minimum-height", - "--mod-card-selected-background-color-rgb", + "--mod-card-selected-background-color", "--mod-card-selected-background-opacity", "--mod-card-subtitle-padding-right", "--mod-card-title-font-color", @@ -148,7 +148,7 @@ "--spectrum-card-preview-background-color-hover", "--spectrum-card-preview-border-width-selected", "--spectrum-card-preview-minimum-height", - "--spectrum-card-selected-background-color-rgb", + "--spectrum-card-selected-background-color", "--spectrum-card-selected-background-opacity", "--spectrum-card-selection-background-color", "--spectrum-card-selection-background-size", diff --git a/components/card/index.css b/components/card/index.css index 8eeedd3c1b8..32b61ff8143 100644 --- a/components/card/index.css +++ b/components/card/index.css @@ -143,7 +143,6 @@ --mod-card-border-color: var(--spectrum-card-border-color-selected); &::before { - /* @deprecated --mod-card-selected-background-color-rgb. Use --mod-card-background-color-selected instead. */ background-color: var(--mod-card-background-color-selected, var(--spectrum-card-selection-background-color)); } } @@ -378,7 +377,7 @@ } &.is-selected .spectrum-Card-preview::before { - background-color: rgba(var(--mod-card-selected-background-color-rgb, var(--spectrum-card-selected-background-color-rgb)), var(--mod-card-selected-background-opacity, var(--spectrum-card-selected-background-opacity))); + background-color: var(--mod-card-selected-background-color, color-mix(in sRGB, var(--spectrum-card-selected-background-color) var(--spectrum-card-selected-background-opacity), transparent)); } .spectrum-Card-body { diff --git a/components/card/tokens.json b/components/card/tokens.json new file mode 100644 index 00000000000..ba611315ad6 --- /dev/null +++ b/components/card/tokens.json @@ -0,0 +1,15 @@ +{ + "card-selected-background-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-500}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + } + } + } +} diff --git a/components/coachindicator/tokens.json b/components/coachindicator/tokens.json new file mode 100644 index 00000000000..3c5269a5a76 --- /dev/null +++ b/components/coachindicator/tokens.json @@ -0,0 +1,58 @@ +{ + "coach-indicator-gap": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "6px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + } + } + }, + "coach-indicator-quiet-ring-diameter": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + } + } + }, + "coach-indicator-ring-default-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + } + } + }, + "coach-indicator-ring-diameter": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-300}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + }, + "coach-indicator-ring-static-white-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{white}" + } +} diff --git a/components/coachmark/tokens.json b/components/coachmark/tokens.json new file mode 100644 index 00000000000..8ff43fbfc2a --- /dev/null +++ b/components/coachmark/tokens.json @@ -0,0 +1,67 @@ +{ + "coachmark-action-menu-vertical-offset": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "-4px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "-6px" + } + } + }, + "coachmark-buttongroup-display": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "flex" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "none" + } + } + }, + "coachmark-buttongroup-mobile-display": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "none" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "flex" + } + } + }, + "coachmark-menu-display": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "inline-flex" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "none" + } + } + }, + "coachmark-menu-mobile-display": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "none" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "inline-flex" + } + } + } +} diff --git a/components/colorarea/dist/metadata.json b/components/colorarea/dist/metadata.json index 9039b7c1028..5616ba27c70 100644 --- a/components/colorarea/dist/metadata.json +++ b/components/colorarea/dist/metadata.json @@ -31,7 +31,6 @@ "--spectrum-color-area-minimum-width", "--spectrum-color-area-width", "--spectrum-colorarea-border-color", - "--spectrum-colorarea-border-color-rgb", "--spectrum-colorarea-border-radius", "--spectrum-colorarea-border-width", "--spectrum-colorarea-disabled-background-color", @@ -40,10 +39,7 @@ "--spectrum-colorarea-min-width", "--spectrum-colorarea-width" ], - "global": [ - "--spectrum-disabled-background-color", - "--spectrum-gray-1000-rgb" - ], + "global": ["--spectrum-disabled-background-color", "--spectrum-gray-1000"], "passthroughs": [], "high-contrast": [ "--highcontrast-colorarea-border-color", diff --git a/components/colorarea/index.css b/components/colorarea/index.css index e9f1b1091f5..e48cca18fbb 100644 --- a/components/colorarea/index.css +++ b/components/colorarea/index.css @@ -12,28 +12,25 @@ */ .spectrum-ColorArea { - --spectrum-colorarea-border-radius: var(--spectrum-color-area-border-rounding); - - /* @TODO: leveraging the rgb token in this case to achieve the desired border color implementation as rgb + opacity are required by the `rgba` function. */ - --spectrum-colorarea-border-color-rgb: var(--spectrum-gray-1000-rgb); - --spectrum-colorarea-border-color: rgb(var(--spectrum-colorarea-border-color-rgb), var(--spectrum-color-area-border-opacity)); - --spectrum-colorarea-border-width: var(--spectrum-color-area-border-width); - --spectrum-colorarea-disabled-background-color: var(--spectrum-disabled-background-color); - --spectrum-colorarea-height: var(--spectrum-color-area-height); - --spectrum-colorarea-width: var(--spectrum-color-area-width); - --spectrum-colorarea-min-width: var(--spectrum-color-area-minimum-width); - --spectrum-colorarea-min-height: var(--spectrum-color-area-minimum-height); + --spectrum-colorarea-border-radius: var(--mod-colorarea-border-radius, var(--spectrum-color-area-border-rounding)); + --spectrum-colorarea-border-color: var(--highcontrast-colorarea-border-color, var(--mod-colorarea-border-color, color-mix(in sRGB, var(--spectrum-gray-1000) var(--spectrum-color-area-border-opacity), transparent))); + --spectrum-colorarea-border-width: var(--mod-colorarea-border-width, var(--spectrum-color-area-border-width)); + --spectrum-colorarea-disabled-background-color: var(--highcontrast-colorarea-fill-color-disabled, var(--mod-colorarea-disabled-background-color, var(--spectrum-disabled-background-color))); + --spectrum-colorarea-height: var(--mod-colorarea-height, var(--spectrum-color-area-height)); + --spectrum-colorarea-width: var(--mod-colorarea-width, var(--spectrum-color-area-width)); + --spectrum-colorarea-min-width: var(--mod-colorarea-min-width, var(--spectrum-color-area-minimum-width)); + --spectrum-colorarea-min-height: var(--mod-colorarea-min-height, var(--spectrum-color-area-minimum-height)); position: relative; display: inline-block; cursor: default; - min-inline-size: var(--mod-colorarea-min-width, var(--spectrum-colorarea-min-width)); - min-block-size: var(--mod-colorarea-min-height, var(--spectrum-colorarea-min-height)); - inline-size: var(--mod-colorarea-width, var(--spectrum-colorarea-width)); - block-size: var(--mod-colorarea-height, var(--spectrum-colorarea-height)); + min-inline-size: var(--spectrum-colorarea-min-width); + min-block-size: var(--spectrum-colorarea-min-height); + inline-size: var(--spectrum-colorarea-width); + block-size: var(--spectrum-colorarea-height); box-sizing: border-box; - border-radius: var(--mod-colorarea-border-radius, var(--spectrum-colorarea-border-radius)); - border: var(--mod-colorarea-border-width, var(--spectrum-colorarea-border-width)) solid var(--highcontrast-colorarea-border-color, var(--mod-colorarea-border-color, var(--spectrum-colorarea-border-color))); + border-radius: var(--spectrum-colorarea-border-radius); + border: var(--spectrum-colorarea-border-width) solid var(--spectrum-colorarea-border-color); touch-action: none; /* Disable touch scrolling on touch devices to allow for color picking */ user-select: none; @@ -44,8 +41,8 @@ &.is-disabled { pointer-events: none; - background: var(--highcontrast-colorarea-fill-color-disabled, var(--mod-colorarea-disabled-background-color, var(--spectrum-colorarea-disabled-background-color))); - border: var(--mod-colorarea-border-width, var(--spectrum-colorarea-border-width)) solid var(--highcontrast-colorarea-border-color-disabled); + background: var(--spectrum-colorarea-disabled-background-color); + border: var(--spectrum-colorarea-border-width) solid var(--highcontrast-colorarea-border-color-disabled); .spectrum-ColorArea-gradient { display: none; @@ -54,7 +51,7 @@ } .spectrum-ColorArea-handle { - transform: translate(calc(var(--mod-colorarea-width, var(--spectrum-colorarea-width)) - var(--spectrum-colorarea-border-width)), 0); + transform: translate(calc(var(--spectrum-colorarea-width) - var(--spectrum-colorarea-border-width)), 0); inset-block-start: 0; &:dir(rtl) { @@ -67,7 +64,7 @@ block-size: 100%; /* calc used here to properly calculate the `border-radius` for the gradient such that it aligns with the `border-radius` of the enclosing border */ - border-radius: calc(var(--mod-colorarea-border-radius, var(--spectrum-colorarea-border-radius)) - var(--mod-colorarea-border-width, var(--spectrum-colorarea-border-width))); + border-radius: calc(var(--spectrum-colorarea-border-radius) - var(--spectrum-colorarea-border-width)); } .spectrum-ColorArea-slider { diff --git a/components/colorhandle/dist/metadata.json b/components/colorhandle/dist/metadata.json index cbd2b5d599f..a0c048bbb11 100644 --- a/components/colorhandle/dist/metadata.json +++ b/components/colorhandle/dist/metadata.json @@ -27,8 +27,10 @@ ], "component": [ "--spectrum-color-handle-border-width", + "--spectrum-color-handle-inner-border-color", "--spectrum-color-handle-inner-border-opacity", "--spectrum-color-handle-inner-border-width", + "--spectrum-color-handle-outer-border-color", "--spectrum-color-handle-outer-border-opacity", "--spectrum-color-handle-outer-border-width", "--spectrum-color-handle-size", @@ -39,7 +41,6 @@ ], "global": [ "--spectrum-animation-duration-100", - "--spectrum-black-rgb", "--spectrum-color-control-track-width", "--spectrum-disabled-background-color", "--spectrum-disabled-content-color", diff --git a/components/colorhandle/index.css b/components/colorhandle/index.css index 983ec65767e..bc977fd1dd3 100644 --- a/components/colorhandle/index.css +++ b/components/colorhandle/index.css @@ -24,13 +24,11 @@ .spectrum-ColorHandle { /* outer border as box shadow on the colorhandle */ - /* TODO replace --spectrum-black-rgb with color-handle-outer-border-color when supported by RGBA */ - --spectrum-colorhandle-outer-border-color: rgba(var(--spectrum-black-rgb), var(--spectrum-color-handle-outer-border-opacity)); + --spectrum-colorhandle-outer-border-color: color-mix(in sRGB, var(--spectrum-color-handle-outer-border-color) var(--spectrum-color-handle-outer-border-opacity), transparent); --spectrum-colorhandle-outer-border-width: var(--spectrum-color-handle-outer-border-width); /* inner border as inset boxshadow on the colorhandle-inner */ - /* TODO replace --spectrum-black-rgb with color-handle-inner-border-color when supported by RGBA */ - --spectrum-colorhandle-inner-border-color: rgba(var(--spectrum-black-rgb), var(--spectrum-color-handle-inner-border-opacity)); + --spectrum-colorhandle-inner-border-color: color-mix(in sRGB, var(--spectrum-color-handle-inner-border-color) var(--spectrum-color-handle-inner-border-opacity), transparent); /* @passthrough -- opacity checkerboard customization */ --mod-opacity-checkerboard-position: 50%; diff --git a/components/colorloupe/tokens.json b/components/colorloupe/tokens.json new file mode 100644 index 00000000000..e84358fd686 --- /dev/null +++ b/components/colorloupe/tokens.json @@ -0,0 +1,15 @@ +{ + "colorloupe-checkerboard-fill": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "url('#checkerboard-primary')" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "url('#checkerboard-secondary')" + } + } + } +} diff --git a/components/colorslider/dist/metadata.json b/components/colorslider/dist/metadata.json index 497550155a7..9903f72dea8 100644 --- a/components/colorslider/dist/metadata.json +++ b/components/colorslider/dist/metadata.json @@ -32,6 +32,7 @@ "--mod-color-slider-vertical-minimum-height" ], "component": [ + "--spectrum-color-slider-border-color", "--spectrum-color-slider-border-color-default", "--spectrum-color-slider-border-color-local", "--spectrum-color-slider-border-opacity", @@ -44,8 +45,7 @@ ], "global": [ "--spectrum-color-control-track-width", - "--spectrum-disabled-background-color", - "--spectrum-gray-1000-rgb" + "--spectrum-disabled-background-color" ], "passthroughs": ["--mod-colorhandle-hitarea-border-radius"], "high-contrast": [ diff --git a/components/colorslider/index.css b/components/colorslider/index.css index a1be2551592..ff61f5f37bd 100644 --- a/components/colorslider/index.css +++ b/components/colorslider/index.css @@ -14,9 +14,7 @@ .spectrum-ColorSlider { /* Size and Spacing */ --spectrum-color-slider-control-track-width: var(--spectrum-color-control-track-width); - - /* @todo Refactor with --spectrum-color-slider-border-color once gray rgb token is no longer necessary to workaround nested rgb color token value using rgba(). */ - --spectrum-color-slider-border-color-default: rgba(var(--spectrum-gray-1000-rgb), var(--spectrum-color-slider-border-opacity)); + --spectrum-color-slider-border-color-default: color-mix(in sRGB, var(--spectrum-color-slider-border-color) var(--spectrum-color-slider-border-opacity), transparent); /* @passthrough -- settings for nested color handle */ --mod-colorhandle-hitarea-border-radius: var(--mod-color-slider-handle-hitarea-border-radius, 0px); diff --git a/components/colorwheel/dist/metadata.json b/components/colorwheel/dist/metadata.json index 3876b601d64..292b48032ed 100644 --- a/components/colorwheel/dist/metadata.json +++ b/components/colorwheel/dist/metadata.json @@ -36,7 +36,6 @@ "--spectrum-color-wheel-width", "--spectrum-colorwheel-block-size", "--spectrum-colorwheel-border-color", - "--spectrum-colorwheel-border-color-rgb", "--spectrum-colorwheel-border-opacity", "--spectrum-colorwheel-border-width", "--spectrum-colorwheel-colorarea-container-size", @@ -50,7 +49,7 @@ "--spectrum-border-width-100", "--spectrum-color-control-track-width", "--spectrum-disabled-background-color", - "--spectrum-gray-1000-rgb" + "--spectrum-gray-1000" ], "passthroughs": [], "high-contrast": [ diff --git a/components/colorwheel/index.css b/components/colorwheel/index.css index 1a730529ad9..c5d2547d054 100644 --- a/components/colorwheel/index.css +++ b/components/colorwheel/index.css @@ -16,11 +16,8 @@ --spectrum-colorwheel-block-size: var(--spectrum-color-wheel-width); --spectrum-colorwheel-min-inline-size: var(--spectrum-color-wheel-minimum-width); - /* @TODO: leveraging the rgb token in this case to achieve the desired border color implementation as rgb + opacity are required by the `rgba` function. */ - --spectrum-colorwheel-border-color-rgb: var(--spectrum-gray-1000-rgb); - --spectrum-colorwheel-border-opacity: var(--spectrum-color-wheel-border-opacity); - --spectrum-colorwheel-border-color: rgba(var(--spectrum-colorwheel-border-color-rgb), var(--spectrum-colorwheel-border-opacity)); + --spectrum-colorwheel-border-color: color-mix(in sRGB, var(--spectrum-gray-1000) var(--spectrum-colorwheel-border-opacity), transparent); --spectrum-colorwheel-border-width: var(--spectrum-border-width-100); --spectrum-colorwheel-track-width: var(--spectrum-color-control-track-width); diff --git a/components/colorwheel/tokens.json b/components/colorwheel/tokens.json new file mode 100644 index 00000000000..ac19bc584c2 --- /dev/null +++ b/components/colorwheel/tokens.json @@ -0,0 +1,37 @@ +{ + "colorwheel-colorarea-container-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "144px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "182px" + } + } + }, + "colorwheel-path": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "value": "M 95 95 m -95 0 a 95 95 0 1 0 190 0 a 95 95 0 1 0 -190 0.2 M 95 95 m -73 0 a 73 73 0 1 0 146 0 a 73 73 0 1 0 -146 0" + }, + "mobile": { + "value": "M 119 119 m -119 0 a 119 119 0 1 0 238 0 a 119 119 0 1 0 -238 0.2 M 119 119 m -91 0 a 91 91 0 1 0 182 0 a 91 91 0 1 0 -182 0" + } + } + }, + "colorwheel-path-borders": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "value": "M 96 96 m -96 0 a 96 96 0 1 0 192 0 a 96 96 0 1 0 -192 0.2 M 96 96 m -72 0 a 72 72 0 1 0 144 0 a 72 72 0 1 0 -144 0" + }, + "mobile": { + "value": "M 120 120 m -120 0 a 120 120 0 1 0 240 0 a 120 120 0 1 0 -240 0.2 M 120 120 m -90 0 a 90 90 0 1 0 180 0 a 90 90 0 1 0 -180 0" + } + } + } +} diff --git a/components/contextualhelp/tokens.json b/components/contextualhelp/tokens.json new file mode 100644 index 00000000000..dff8d8966d3 --- /dev/null +++ b/components/contextualhelp/tokens.json @@ -0,0 +1,15 @@ +{ + "contextual-help-content-spacing": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + } + } + } +} diff --git a/components/datepicker/tokens.json b/components/datepicker/tokens.json new file mode 100644 index 00000000000..5c428c7aafc --- /dev/null +++ b/components/datepicker/tokens.json @@ -0,0 +1,119 @@ +{ + "datepicker-dash-line-height": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "24px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "30px" + } + } + }, + "datepicker-datetime-width-first": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "36px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "45px" + } + } + }, + "datepicker-generic-padding": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "15px" + } + } + }, + "datepicker-initial-width": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "128px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "160px" + } + } + }, + "datepicker-input-datetime-width": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "30px" + } + } + }, + "datepicker-invalid-icon-to-button": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + } + } + }, + "datepicker-invalid-icon-to-button-quiet": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "7px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "9px" + } + } + }, + "datepicker-width-quiet-first": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "72px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "90px" + } + } + }, + "datepicker-width-quiet-second": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + } +} diff --git a/components/dial/tokens.json b/components/dial/tokens.json new file mode 100644 index 00000000000..5f2c472ce47 --- /dev/null +++ b/components/dial/tokens.json @@ -0,0 +1,93 @@ +{ + "dial-border-radius": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + }, + "dial-controls-margin": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + } + } + }, + "dial-handle-block-margin": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + }, + "dial-handle-inline-margin": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + } + } + }, + "dial-handle-position": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + } + } + }, + "dial-label-container-top-to-text": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "4px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + } + } + }, + "dial-label-gap-y": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "6px" + } + } + } +} diff --git a/components/dialog/dist/metadata.json b/components/dialog/dist/metadata.json index 738156392db..e5922c8c9f3 100644 --- a/components/dialog/dist/metadata.json +++ b/components/dialog/dist/metadata.json @@ -71,11 +71,11 @@ "component": [], "global": [ "--spectrum-background-layer-2-color", - "--spectrum-black-rgb", "--spectrum-body-color", "--spectrum-body-sans-serif-font-style", "--spectrum-body-sans-serif-font-weight", "--spectrum-corner-radius-extra-large-default", + "--spectrum-gray-1000", "--spectrum-heading-color", "--spectrum-line-height-200", "--spectrum-overlay-opacity", diff --git a/components/dialog/index.css b/components/dialog/index.css index b4ea3002d30..4947598b132 100644 --- a/components/dialog/index.css +++ b/components/dialog/index.css @@ -50,9 +50,10 @@ /* Hero */ --spectrum-standard-dialog-hero-block-size: 140px; - /* Passthrough for nested component(s) */ + /* @passthrough start */ --mod-buttongroup-justify-content: flex-end; --mod-buttongroup-flex-wrap: nowrap; + /* @passthrough end */ /* Fullscreen/fullscreenTakeover */ --spectrum-takeover-dialog-title-font-size: var(--spectrum-title-size-xxl); @@ -436,6 +437,6 @@ @media (forced-colors: active) { .spectrum-Dialog { - border: 1px solid rgba(var(--spectrum-black-rgb), var(--spectrum-overlay-opacity)); + border: 1px solid color-mix(in sRGB, var(--spectrum-gray-1000) var(--spectrum-overlay-opacity), transparent); } } diff --git a/components/dialog/tokens.json b/components/dialog/tokens.json new file mode 100644 index 00000000000..442375ce89e --- /dev/null +++ b/components/dialog/tokens.json @@ -0,0 +1,132 @@ +{ + "dialog-confirm-border-radius": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "4px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + } + } + }, + "dialog-confirm-description-text-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "14px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "15px" + } + } + }, + "dialog-confirm-entry-animation-distance": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "25px" + } + } + }, + "dialog-confirm-hero-height": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "128px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "160px" + } + } + }, + "dialog-confirm-padding-grid": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "40px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "24px" + } + } + }, + "dialog-confirm-title-text-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "18px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "19px" + } + } + }, + "standard-dialog-spacing-edge-to-content": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-500}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + } + } + }, + "takeover-dialog-spacing-grid-padding": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-500}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + } + } + }, + "takeover-dialog-spacing-header-gap": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-300}" + } + } + }, + "takeover-dialog-spacing-title-to-body": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-500}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + } + } + } +} diff --git a/components/dropindicator/tokens.json b/components/dropindicator/tokens.json new file mode 100644 index 00000000000..bd44313e02c --- /dev/null +++ b/components/dropindicator/tokens.json @@ -0,0 +1,15 @@ +{ + "dropindicator-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + } + } + } +} diff --git a/components/dropzone/dist/metadata.json b/components/dropzone/dist/metadata.json index e91812f2d27..eaf506c37eb 100644 --- a/components/dropzone/dist/metadata.json +++ b/components/dropzone/dist/metadata.json @@ -53,7 +53,6 @@ "--spectrum-drop-zone-background-color", "--spectrum-drop-zone-background-color-opacity", "--spectrum-drop-zone-background-color-opacity-filled", - "--spectrum-drop-zone-background-color-rgb", "--spectrum-drop-zone-body-font-size", "--spectrum-drop-zone-body-to-action", "--spectrum-drop-zone-border-color", diff --git a/components/dropzone/index.css b/components/dropzone/index.css index c5824560074..4606c5a88a0 100644 --- a/components/dropzone/index.css +++ b/components/dropzone/index.css @@ -20,7 +20,6 @@ --spectrum-drop-zone-inline-size: var(--spectrum-drop-zone-width); /* Color */ - --spectrum-drop-zone-background-color: var(--spectrum-drop-zone-background-color-rgb); --spectrum-drop-zone-border-color-hover: var(--spectrum-accent-visual-color); --spectrum-drop-zone-illustration-color-hover: var(--spectrum-accent-content-color-default); --spectrum-drop-zone-body-to-action: var(--spectrum-spacing-300); @@ -68,7 +67,7 @@ &.is-dragged { --mod-drop-zone-border-style: var(--mod-drop-zone-border-style-dragged, solid); - --mod-drop-zone-background-color: rgba(var(--spectrum-drop-zone-background-color), var(--mod-drop-zone-background-color-opacity, var(--spectrum-drop-zone-dragged-background-color))); + --mod-drop-zone-background-color: color-mix(in sRGB, var(--spectrum-drop-zone-background-color) var(--mod-drop-zone-background-color-opacity, var(--spectrum-drop-zone-dragged-background-color), transparent)); --spectrum-drop-zone-border-color: var(--highcontrast-drop-zone-border-color-hover, var(--mod-drop-zone-border-color-hover, var(--spectrum-drop-zone-border-color-hover))); /* Updated values for a nested illustrated message when state changes */ @@ -83,7 +82,7 @@ &.is-filled { /* note: the below applies to .is-filled.is-dragged but works here b/c dragged is the only state applying background color */ - --mod-drop-zone-background-color: rgba(var(--spectrum-drop-zone-background-color), var(--mod-drop-zone-background-color-opacity-filled, var(--spectrum-drop-zone-background-color-opacity-filled))); + --mod-drop-zone-background-color: color-mix(in sRGB, var(--spectrum-drop-zone-background-color) var(--mod-drop-zone-background-color-opacity-filled, var(--spectrum-drop-zone-background-color-opacity-filled), transparent)); /* Updated values for a nested illustrated message when state changes */ --mod-illustrated-message-display: none; diff --git a/components/dropzone/tokens.json b/components/dropzone/tokens.json new file mode 100644 index 00000000000..a4e1db4f152 --- /dev/null +++ b/components/dropzone/tokens.json @@ -0,0 +1,15 @@ +{ + "drop-zone-background-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{accent-color-900}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{accent-color-800}" + } + } + } +} diff --git a/components/infieldprogresscircle/package.json b/components/infieldprogresscircle/package.json index b6edcdef9fa..cc45fac0fda 100644 --- a/components/infieldprogresscircle/package.json +++ b/components/infieldprogresscircle/package.json @@ -27,6 +27,11 @@ "peerDependencies": { "@spectrum-css/tokens": ">=16.1.0-next.0" }, + "peerDependenciesMeta": { + "@spectrum-css/tokens": { + "optional": true + } + }, "devDependencies": { "@spectrum-css/tokens": "16.1.0-next.2" }, @@ -48,10 +53,5 @@ "rootClass": "spectrum-InfieldProgressCircle", "swc": "https://opensource.adobe.com/spectrum-web-components/components/progress-circle/" } - ], - "peerDependenciesMeta": { - "@spectrum-css/tokens": { - "optional": true - } - } + ] } diff --git a/components/logicbutton/tokens.json b/components/logicbutton/tokens.json new file mode 100644 index 00000000000..e4ef16c0285 --- /dev/null +++ b/components/logicbutton/tokens.json @@ -0,0 +1,106 @@ +{ + "logic-button-and-background-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + } + } + }, + "logic-button-and-background-color-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-1000}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-1100}" + } + } + }, + "logic-button-and-border-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-900}" + } + } + }, + "logic-button-and-border-color-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-1000}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-1100}" + } + } + }, + "logic-button-or-background-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-900}" + } + } + }, + "logic-button-or-background-color-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-900}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-1100}" + } + } + }, + "logic-button-or-border-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-900}" + } + } + }, + "logic-button-or-border-color-hover": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-900}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{magenta-1100}" + } + } + } +} diff --git a/components/menu/tokens.json b/components/menu/tokens.json new file mode 100644 index 00000000000..84be29bc2d4 --- /dev/null +++ b/components/menu/tokens.json @@ -0,0 +1,158 @@ +{ + "menu-item-checkmark-height-extra-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "14px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + } + } + }, + "menu-item-checkmark-height-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "12px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + } + } + }, + "menu-item-checkmark-height-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "14px" + } + } + }, + "menu-item-checkmark-height-small": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "12px" + } + } + }, + "menu-item-checkmark-width-extra-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "14px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + } + } + }, + "menu-item-checkmark-width-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "12px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + } + } + }, + "menu-item-checkmark-width-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "14px" + } + } + }, + "menu-item-checkmark-width-small": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "12px" + } + } + }, + "menu-item-selectable-edge-to-text-not-selected-extra-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "45px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "54px" + } + } + }, + "menu-item-selectable-edge-to-text-not-selected-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "38px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "47px" + } + } + }, + "menu-item-selectable-edge-to-text-not-selected-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "32px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "42px" + } + } + }, + "menu-item-selectable-edge-to-text-not-selected-small": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "28px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "34px" + } + } + } +} diff --git a/components/modal/index.css b/components/modal/index.css index 4dad9fccf32..312c204caea 100644 --- a/components/modal/index.css +++ b/components/modal/index.css @@ -49,9 +49,7 @@ * We use the stretch value to counteract this where supported. */ block-size: 100vh; - /* stylelint-disable-next-line value-no-vendor-prefix */ block-size: -moz-available; - /* stylelint-disable-next-line value-no-vendor-prefix */ block-size: -webkit-fill-available; /* autoprefixer: ignore next -- -moz-available providing inconsistent results; want to fall FF back to 100vh */ diff --git a/components/pagination/tokens.json b/components/pagination/tokens.json new file mode 100644 index 00000000000..b65059985a5 --- /dev/null +++ b/components/pagination/tokens.json @@ -0,0 +1,28 @@ +{ + "pagination-item-inline-spacing": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "6px" + } + } + }, + "pagination-textfield-width": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-700}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "60px" + } + } + } +} diff --git a/components/popover/dist/metadata.json b/components/popover/dist/metadata.json index 75570cec13b..abd4be24672 100644 --- a/components/popover/dist/metadata.json +++ b/components/popover/dist/metadata.json @@ -119,10 +119,9 @@ "component": [ "--spectrum-popover-animation-distance", "--spectrum-popover-background-color", - "--spectrum-popover-border-color-rgb", + "--spectrum-popover-border-color", "--spectrum-popover-border-color-with-transparency", "--spectrum-popover-border-opacity", - "--spectrum-popover-border-transparency", "--spectrum-popover-border-width", "--spectrum-popover-content-area-spacing", "--spectrum-popover-corner-radius", @@ -143,12 +142,12 @@ "--spectrum-animation-duration-0", "--spectrum-animation-duration-100", "--spectrum-background-layer-2-color", + "--spectrum-border-width-100", "--spectrum-corner-radius-large-default", "--spectrum-drop-shadow-elevated-blur", "--spectrum-drop-shadow-elevated-color", "--spectrum-drop-shadow-elevated-x", "--spectrum-drop-shadow-elevated-y", - "--spectrum-gray-200-rgb", "--spectrum-spacing-100" ], "passthroughs": [], diff --git a/components/popover/index.css b/components/popover/index.css index 0cc88d2eda4..d0aebca06fb 100644 --- a/components/popover/index.css +++ b/components/popover/index.css @@ -15,18 +15,13 @@ .spectrum-Popover { /* animation distance is equal to and responsible for popover offset ("spacing" tip to source) */ - --spectrum-popover-animation-distance: var(--spectrum-spacing-100); - - --spectrum-popover-background-color: var(--spectrum-background-layer-2-color); - - /* TODO: Cannot use popover-border-color token until the value no longer has the rgba() function alpha/opacity. We should be able to refactor instances of `--spectrum-popover-border-color-rgb` with `--spectrum-popover-border-color` once this is available. */ - /* --spectrum-popover-border-color-default: var(--spectrum-popover-border-color); */ - --spectrum-popover-border-color-rgb: var(--spectrum-gray-200-rgb); - --spectrum-popover-border-transparency: var(--spectrum-popover-border-opacity); - --spectrum-popover-border-color-with-transparency: rgba(var(--spectrum-popover-border-color-rgb), var(--spectrum-popover-border-transparency)); + --spectrum-popover-animation-distance: var(--mod-popover-animation-distance, var(--spectrum-spacing-100)); + --spectrum-popover-background-color: var(--mod-popover-background-color, var(--spectrum-background-layer-2-color)); + --spectrum-popover-border-width: var(--mod-popover-border-width, var(--spectrum-border-width-100)); + --spectrum-popover-border-color-with-transparency: var(--highcontrast-popover-border-color, var(--mod-popover-border-color, color-mix(in sRGB, var(--spectrum-popover-border-color) var(--spectrum-popover-border-opacity), transparent))); /* popover inner padding */ - --spectrum-popover-content-area-spacing: var(--spectrum-popover-edge-to-content-area); + --spectrum-popover-content-area-spacing: var(--mod-popover-content-area-spacing, var(--spectrum-popover-edge-to-content-area)); /* popover drop shadow */ --spectrum-popover-drop-shadow-x: var(--spectrum-drop-shadow-elevated-x); @@ -35,21 +30,21 @@ --spectrum-popover-drop-shadow-color: var(--spectrum-drop-shadow-elevated-color); /* popover corner radius */ - --spectrum-popover-corner-radius: var(--spectrum-corner-radius-large-default); + --spectrum-popover-corner-radius: var(--mod-popover-corner-radius, var(--spectrum-corner-radius-large-default)); /* pointer tip dimensions */ - --spectrum-popover-pointer-width: var(--spectrum-popover-tip-width); - --spectrum-popover-pointer-height: var(--spectrum-popover-tip-height); + --spectrum-popover-pointer-width: var(--mod-popover-pointer-width, var(--spectrum-popover-tip-width)); + --spectrum-popover-pointer-height: var(--mod-popover-pointer-height, var(--spectrum-popover-tip-height)); +} +.spectrum-Popover { /* pointer tip - default spacing to edge - corner radius plus half of tip width to neutralize override */ --spectrum-popover-pointer-edge-offset: calc(var(--spectrum-popover-corner-radius) + (var(--spectrum-popover-tip-width) / 2)); /* pointer tip - spacing to edge will center pointer to source - apply in markup by setting '--spectrum-popover-pointer-edge-offset' value == half of source */ - --spectrum-popover-pointer-edge-spacing: calc(var(--spectrum-popover-pointer-edge-offset) - (var(--spectrum-popover-tip-width) / 2)); -} - -.spectrum-Popover { + --spectrum-popover-pointer-edge-spacing: var(--mod-popover-pointer-edge-spacing, calc(var(--spectrum-popover-pointer-edge-offset) - (var(--spectrum-popover-tip-width) / 2))); --spectrum-popover-filter: drop-shadow(var(--mod-popover-drop-shadow-x, var(--spectrum-popover-drop-shadow-x)) var(--mod-popover-drop-shadow-y, var(--spectrum-popover-drop-shadow-y)) var(--mod-popover-drop-shadow-blur, var(--spectrum-popover-drop-shadow-blur)) var(--mod-popover-drop-shadow-color, var(--spectrum-popover-drop-shadow-color))); + @extend %spectrum-overlay; box-sizing: border-box; @@ -57,18 +52,18 @@ outline: none; /* Hide focus outline */ - padding: var(--mod-popover-content-area-spacing, var(--spectrum-popover-content-area-spacing)); + padding: var(--spectrum-popover-content-area-spacing); display: inline-flex; flex-direction: column; border-style: solid; - border-radius: var(--mod-popover-corner-radius, var(--spectrum-popover-corner-radius)); - border-color: var(--highcontrast-popover-border-color, var(--mod-popover-border-color, var(--spectrum-popover-border-color-with-transparency))); + border-radius: var(--spectrum-popover-corner-radius); + border-color: var(--spectrum-popover-border-color-with-transparency); - border-width: var(--mod-popover-border-width, var(--spectrum-popover-border-width)); + border-width: var(--spectrum-popover-border-width); - background-color: var(--mod-popover-background-color, var(--spectrum-popover-background-color)); + background-color: var(--spectrum-popover-background-color); filter: var(--mod-popover-filter, var(--spectrum-popover-filter)); /* has tip triangle */ @@ -81,9 +76,9 @@ .spectrum-Popover-tip-triangle { stroke-linecap: square; stroke-linejoin: miter; - fill: var(--mod-popover-background-color, var(--spectrum-popover-background-color)); - stroke: var(--highcontrast-popover-border-color, var(--mod-popover-border-color, var(--spectrum-popover-border-color-with-transparency))); - stroke-width: var(--mod-popover-border-width, var(--spectrum-popover-border-width)); + fill: var(--spectrum-popover-background-color); + stroke: var(--spectrum-popover-border-color-with-transparency); + stroke-width: var(--spectrum-popover-border-width); } } } @@ -111,13 +106,13 @@ /* spacing to include tip in calculation of offset from source */ &.spectrum-Popover--withTip { /* tip size minus where it overlaps with popover border */ - margin-block-end: calc(var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)) - var(--mod-popover-border-width, var(--spectrum-popover-border-width))); + margin-block-end: calc(var(--spectrum-popover-pointer-height) - var(--spectrum-popover-border-width)); } /* popover animates upward ⬆ */ &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateY(calc(-1 * var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance)))) translateZ(0); + transform: translateY(calc(-1 * var(--spectrum-popover-animation-distance))) translateZ(0); } } @@ -130,13 +125,13 @@ /* spacing to include tip in calculation of offset from source */ &.spectrum-Popover--withTip { /* tip size minus where it overlaps with popover border */ - margin-block-start: calc(var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)) - var(--mod-popover-border-width, var(--spectrum-popover-border-width))); + margin-block-start: calc(var(--spectrum-popover-pointer-height) - var(--spectrum-popover-border-width)); } /* popover animates downward ⬇ */ &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateY(var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance))) translateZ(0); + transform: translateY(var(--spectrum-popover-animation-distance)) translateZ(0); } } @@ -148,13 +143,13 @@ &.spectrum-Popover--withTip { /* tip size minus where it overlaps with popover border */ /* stylelint-disable-next-line csstools/use-logical -- intentional, right stays on the same side even for RTL */ - margin-left: calc(var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)) - var(--mod-popover-border-width, var(--spectrum-popover-border-width))); + margin-left: calc(var(--spectrum-popover-pointer-height) - var(--spectrum-popover-border-width)); } /* popover animates towards right ⮕ */ &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateX(var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance))) translateZ(0); + transform: translateX(var(--spectrum-popover-animation-distance)) translateZ(0); } } @@ -166,13 +161,13 @@ &.spectrum-Popover--withTip { /* tip size minus where it overlaps with popover border */ /* stylelint-disable-next-line csstools/use-logical -- intentional, left stays on the same side even for RTL */ - margin-right: calc(var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)) - var(--mod-popover-border-width, var(--spectrum-popover-border-width))); + margin-right: calc(var(--spectrum-popover-pointer-height) - var(--spectrum-popover-border-width)); } /* popover animates towards left ⬅ */ &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateX(calc(-1 * var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance)))) translateZ(0); + transform: translateX(calc(-1 * var(--spectrum-popover-animation-distance))) translateZ(0); } } @@ -183,18 +178,18 @@ /* spacing to include tip in calculation of offset from source */ &.spectrum-Popover--withTip { /* tip size minus where it overlaps with popover border */ - margin-inline-end: calc(var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)) - var(--mod-popover-border-width, var(--spectrum-popover-border-width))); + margin-inline-end: calc(var(--spectrum-popover-pointer-height) - var(--spectrum-popover-border-width)); } /* LTR read, popover animates towards left ⬅ */ &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateX(calc(-1 * var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance)))) translateZ(0); + transform: translateX(calc(-1 * var(--spectrum-popover-animation-distance))) translateZ(0); } /* RTL read, popover animates towards right ⮕ */ &.is-open:dir(rtl) { - transform: translateX(var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance))) translateZ(0); + transform: translateX(var(--spectrum-popover-animation-distance)) translateZ(0); } } @@ -205,20 +200,20 @@ /* spacing to include tip in calculation of offset from source */ &.spectrum-Popover--withTip { /* tip size minus where it overlaps with popover border */ - margin-inline-start: calc(var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)) - var(--mod-popover-border-width, var(--spectrum-popover-border-width))); + margin-inline-start: calc(var(--spectrum-popover-pointer-height) - var(--spectrum-popover-border-width)); } /* LTR read, popover animates towards right ⮕ */ &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateX(var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance))) translateZ(0); + transform: translateX(var(--spectrum-popover-animation-distance)) translateZ(0); } /* RTL read, popover animates towards left ⬅ */ &:dir(rtl) { &.is-open { /* TranslateZ is Safari fix to prevent clipping of filter dropshadow and accelerate the element to GPU layer */ - transform: translateX(calc(-1 * var(--mod-popover-animation-distance, var(--spectrum-popover-animation-distance)))) translateZ(0); + transform: translateX(calc(-1 * var(--spectrum-popover-animation-distance))) translateZ(0); } } } @@ -238,8 +233,8 @@ &.spectrum-Popover--bottom-start, &.spectrum-Popover--bottom-end { .spectrum-Popover-tip { - inline-size: var(--mod-popover-pointer-width, var(--spectrum-popover-pointer-width)); - block-size: var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)); + inline-size: var(--spectrum-popover-pointer-width); + block-size: var(--spectrum-popover-pointer-height); position: absolute; inset-block-start: 100%; inset-inline: 0; @@ -253,28 +248,28 @@ /* popover is at top of source, tip left and pointing down ▽ */ &.spectrum-Popover--top-left { .spectrum-Popover-tip { - inset-inline: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)) auto; + inset-inline: var(--spectrum-popover-pointer-edge-spacing) auto; } } /* popover is at top of source, tip right and pointing down ▽ */ &.spectrum-Popover--top-right { .spectrum-Popover-tip { - inset-inline: auto var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + inset-inline: auto var(--spectrum-popover-pointer-edge-spacing); } } /* logical property - popover is above, source and tip are at start, tip pointing down ▽ */ &.spectrum-Popover--top-start { .spectrum-Popover-tip { - margin-inline-start: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + margin-inline-start: var(--spectrum-popover-pointer-edge-spacing); } } /* logical property - popover is above, source and tip are at end, tip pointing down ▽ */ &.spectrum-Popover--top-end { .spectrum-Popover-tip { - margin-inline-end: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + margin-inline-end: var(--spectrum-popover-pointer-edge-spacing); } } @@ -295,28 +290,28 @@ /* popover position is bottom, source is at left, tip pointing up △ */ &.spectrum-Popover--bottom-left { .spectrum-Popover-tip { - inset-inline: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)) auto; + inset-inline: var(--spectrum-popover-pointer-edge-spacing) auto; } } /* popover position is bottom, source is at right, tip pointing up △ */ &.spectrum-Popover--bottom-right { .spectrum-Popover-tip { - inset-inline: auto var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + inset-inline: auto var(--spectrum-popover-pointer-edge-spacing); } } /* logical property - popover is below, source is at start, tip pointing up △ */ &.spectrum-Popover--bottom-start { .spectrum-Popover-tip { - margin-inline-start: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + margin-inline-start: var(--spectrum-popover-pointer-edge-spacing); } } /* logical property - popover is below, source is at end, tip pointing up △ */ &.spectrum-Popover--bottom-end { .spectrum-Popover-tip { - margin-inline-end: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + margin-inline-end: var(--spectrum-popover-pointer-edge-spacing); } } @@ -335,8 +330,8 @@ &.spectrum-Popover--end-bottom { .spectrum-Popover-tip { /* swap height and width for vertical triangle */ - inline-size: var(--mod-popover-pointer-height, var(--spectrum-popover-pointer-height)); - block-size: var(--mod-popover-pointer-width, var(--spectrum-popover-pointer-width)); + inline-size: var(--spectrum-popover-pointer-height); + block-size: var(--spectrum-popover-pointer-width); inset-block: 0; } } @@ -372,7 +367,7 @@ &.spectrum-Popover--start-top, &.spectrum-Popover--end-top { .spectrum-Popover-tip { - inset-block: var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)) auto; + inset-block: var(--spectrum-popover-pointer-edge-spacing) auto; } } @@ -382,7 +377,7 @@ &.spectrum-Popover--start-bottom, &.spectrum-Popover--end-bottom { .spectrum-Popover-tip { - inset-block: auto var(--mod-popover-pointer-edge-spacing, var(--spectrum-popover-pointer-edge-spacing)); + inset-block: auto var(--spectrum-popover-pointer-edge-spacing); } } diff --git a/components/rating/tokens.json b/components/rating/tokens.json new file mode 100644 index 00000000000..ce0bca02f1d --- /dev/null +++ b/components/rating/tokens.json @@ -0,0 +1,15 @@ +{ + "rating-icon-spacing": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-75}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-100}" + } + } + } +} diff --git a/components/slider/tokens.json b/components/slider/tokens.json new file mode 100644 index 00000000000..fb26731dece --- /dev/null +++ b/components/slider/tokens.json @@ -0,0 +1,28 @@ +{ + "slider-ramp-track-height": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "16px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + }, + "slider-tick-mark-height": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "13px" + } + } + } +} diff --git a/components/steplist/tokens.json b/components/steplist/tokens.json new file mode 100644 index 00000000000..711268db6d2 --- /dev/null +++ b/components/steplist/tokens.json @@ -0,0 +1,15 @@ +{ + "steplist-current-marker-color-key-focus": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-700}" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{blue-800}" + } + } + } +} diff --git a/components/swatch/tokens.json b/components/swatch/tokens.json new file mode 100644 index 00000000000..440a1e2b5d1 --- /dev/null +++ b/components/swatch/tokens.json @@ -0,0 +1,28 @@ +{ + "swatch-border-color": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "rgba(255 255 255 / 51%)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "rgb(0 0 0 / 51%)" + } + } + }, + "swatch-border-color-light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "rgba(255 255 255 / 20%)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "rgba(0 0 0 / 20%)" + } + } + } +} diff --git a/components/table/dist/metadata.json b/components/table/dist/metadata.json index 26a601ce86e..207b23f00a0 100644 --- a/components/table/dist/metadata.json +++ b/components/table/dist/metadata.json @@ -379,7 +379,7 @@ "--spectrum-accent-visual-color", "--spectrum-animation-duration-100", "--spectrum-background-layer-1-color", - "--spectrum-blue-900-rgb", + "--spectrum-blue-900", "--spectrum-body-color", "--spectrum-bold-font-weight", "--spectrum-checkbox-control-size-small", @@ -397,8 +397,8 @@ "--spectrum-component-top-to-text-75", "--spectrum-corner-radius-100", "--spectrum-default-font-style", + "--spectrum-drop-zone-background-color", "--spectrum-drop-zone-background-color-opacity", - "--spectrum-drop-zone-background-color-rgb", "--spectrum-focus-indicator-color", "--spectrum-focus-indicator-thickness", "--spectrum-font-size-100", @@ -410,9 +410,9 @@ "--spectrum-gray-25", "--spectrum-gray-300", "--spectrum-gray-50", - "--spectrum-gray-700-rgb", + "--spectrum-gray-700", "--spectrum-gray-75", - "--spectrum-gray-900-rgb", + "--spectrum-gray-900", "--spectrum-line-height-100", "--spectrum-logical-rotation", "--spectrum-neutral-content-color-default", diff --git a/components/table/index.css b/components/table/index.css index 7ffbacf046a..ad07879447e 100644 --- a/components/table/index.css +++ b/components/table/index.css @@ -110,12 +110,12 @@ --spectrum-table-row-text-color: var(--spectrum-neutral-content-color-default); /* @todo Refactor or remove these properties once the RGB stripped value is available. */ - --spectrum-table-selected-row-background-color: rgba(var(--spectrum-blue-900-rgb), var(--spectrum-table-selected-row-background-opacity)); - --spectrum-table-selected-row-background-color-non-emphasized: rgba(var(--spectrum-gray-700-rgb), var(--spectrum-table-selected-row-background-opacity-non-emphasized)); - --spectrum-table-row-background-color-hover: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-table-row-hover-opacity)); - --spectrum-table-row-active-color: rgba(var(--spectrum-gray-900-rgb), var(--spectrum-table-row-down-opacity)); - --spectrum-table-selected-row-background-color-focus: rgba(var(--spectrum-blue-900-rgb), var(--spectrum-table-selected-row-background-opacity-hover)); - --spectrum-table-selected-row-background-color-non-emphasized-focus: rgba(var(--spectrum-gray-700-rgb), var(--spectrum-table-selected-row-background-opacity-non-emphasized-hover)); + --spectrum-table-selected-row-background-color: color-mix(in sRGB, var(--spectrum-blue-900) var(--spectrum-table-selected-row-background-opacity), transparent); + --spectrum-table-selected-row-background-color-non-emphasized: color-mix(in sRGB, var(--spectrum-gray-700) var(--spectrum-table-selected-row-background-opacity-non-emphasized), transparent); + --spectrum-table-row-background-color-hover: color-mix(in sRGB, var(--spectrum-gray-900) var(--spectrum-table-row-hover-opacity), transparent); + --spectrum-table-row-active-color: color-mix(in sRGB, var(--spectrum-gray-900) var(--spectrum-table-row-down-opacity), transparent); + --spectrum-table-selected-row-background-color-focus: color-mix(in sRGB, var(--spectrum-blue-900) var(--spectrum-table-selected-row-background-opacity-hover), transparent); + --spectrum-table-selected-row-background-color-non-emphasized-focus: color-mix(in sRGB, var(--spectrum-gray-700) var(--spectrum-table-selected-row-background-opacity-non-emphasized-hover), transparent); --spectrum-table-icon-color-default: var(--spectrum-neutral-subdued-content-color-default); --spectrum-table-icon-color-hover: var(--spectrum-neutral-subdued-content-color-hover); @@ -127,7 +127,7 @@ --spectrum-table-focus-indicator-thickness: var(--spectrum-focus-indicator-thickness); --spectrum-table-focus-indicator-color: var(--spectrum-focus-indicator-color); - --spectrum-table-drop-zone-background-color: rgba(var(--spectrum-drop-zone-background-color-rgb), var(--spectrum-drop-zone-background-color-opacity)); + --spectrum-table-drop-zone-background-color: color-mix(in sRGB, var(--spectrum-drop-zone-background-color) var(--spectrum-drop-zone-background-color-opacity), transparent); --spectrum-table-drop-zone-outline-color: var(--spectrum-accent-visual-color); --spectrum-table-transition-duration: var(--spectrum-animation-duration-100); diff --git a/components/thumbnail/dist/metadata.json b/components/thumbnail/dist/metadata.json index 2a5fa051ef2..01ffda45a64 100644 --- a/components/thumbnail/dist/metadata.json +++ b/components/thumbnail/dist/metadata.json @@ -85,7 +85,6 @@ "--spectrum-focus-indicator-gap", "--spectrum-focus-indicator-thickness", "--spectrum-gray-500", - "--spectrum-gray-800-rgb", "--spectrum-white" ], "passthroughs": ["--mod-opacity-checkerboard-size"], diff --git a/components/thumbnail/index.css b/components/thumbnail/index.css index 3f2ab89f941..0ceac68a024 100644 --- a/components/thumbnail/index.css +++ b/components/thumbnail/index.css @@ -17,8 +17,7 @@ --spectrum-thumbnail-border-radius: var(--spectrum-thumbnail-corner-radius); --spectrum-thumbnail-border-width: var(--spectrum-border-width-100); - /* @todo Refactor with --spectrum-thumbnail-border-color once gray rgb token is no longer necessary to workaround nested rgb color token value using rgba(). */ - --spectrum-thumbnail-border-color: rgba(var(--spectrum-gray-800-rgb), var(--spectrum-thumbnail-border-opacity)); + --spectrum-thumbnail-border-color: color-mix(in sRGB, var(--spectrum-thumbnail-border-color) var(--spectrum-thumbnail-border-opacity), transparent); --spectrum-thumbnail-layer-border-width-inner: var(--spectrum-border-width-400); --spectrum-thumbnail-layer-border-color-inner: var(--spectrum-white); --spectrum-thumbnail-layer-border-width-outer: var(--spectrum-border-width-100); diff --git a/components/tooltip/tokens.json b/components/tooltip/tokens.json new file mode 100644 index 00000000000..6e05f2d8f25 --- /dev/null +++ b/components/tooltip/tokens.json @@ -0,0 +1,16 @@ +{ + "tooltip-tip-square-size": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "note": "To get a square that measures 10px/12px on the diagonal, the sides have to be 8px/10px.", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "8px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "10px" + } + } + } +} diff --git a/components/treeview/tokens.json b/components/treeview/tokens.json new file mode 100644 index 00000000000..6e87a09703f --- /dev/null +++ b/components/treeview/tokens.json @@ -0,0 +1,106 @@ +{ + "treeview-indicator-inset-block-start": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "6px" + } + } + }, + "treeview-item-background-color-quiet-selected": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-gray-900) 7%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-gray-900) 6%, transparent)" + } + } + }, + "treeview-item-background-color-selected": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color-set.json", + "sets": { + "dark": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 15%, transparent)" + }, + "light": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/color.json", + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 15%, transparent)" + } + } + }, + "treeview-item-indentation-extra-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-400}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "30px" + } + } + }, + "treeview-item-indentation-large": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "25px" + } + } + }, + "treeview-item-indentation-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "{spacing-300}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + }, + "treeview-item-indentation-small": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-200}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "15px" + } + } + }, + "treeview-item-min-block-size-thumbnail-offset-medium": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "0px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "2px" + } + } + } +} diff --git a/components/typography/stories/typography.stories.js b/components/typography/stories/typography.stories.js index ac19708ed4f..c6595cb6a24 100644 --- a/components/typography/stories/typography.stories.js +++ b/components/typography/stories/typography.stories.js @@ -4,16 +4,16 @@ import { size } from "@spectrum-css/preview/types"; import metadata from "../dist/metadata.json"; import packageJson from "../package.json"; import { - DocsBodyVariants, - DocsCodeVariants, - DocsDetailVariants, - DocsHeadingBodyPairing, - DocsHeadingVariants, - DocsInternationalizedBodyVariants, - DocsInternationalizedCodeVariants, - DocsInternationalizedDetailVariants, - DocsInternationalizedHeadingBodyPairing, - DocsInternationalizedHeadingVariants, Template + DocsBodyVariants, + DocsCodeVariants, + DocsDetailVariants, + DocsHeadingBodyPairing, + DocsHeadingVariants, + DocsInternationalizedBodyVariants, + DocsInternationalizedCodeVariants, + DocsInternationalizedDetailVariants, + DocsInternationalizedHeadingBodyPairing, + DocsInternationalizedHeadingVariants, Template } from "./template.js"; import { TypographyGroup } from "./typography.test.js"; diff --git a/components/underlay/dist/metadata.json b/components/underlay/dist/metadata.json index 21a3e4aa1d0..2fd93c75a3a 100644 --- a/components/underlay/dist/metadata.json +++ b/components/underlay/dist/metadata.json @@ -27,7 +27,7 @@ "--spectrum-animation-duration-600", "--spectrum-animation-ease-in", "--spectrum-animation-ease-out", - "--spectrum-black-rgb", + "--spectrum-overlay-color", "--spectrum-overlay-opacity" ], "passthroughs": [], diff --git a/components/underlay/index.css b/components/underlay/index.css index 42effdc418a..8fba6068880 100644 --- a/components/underlay/index.css +++ b/components/underlay/index.css @@ -20,8 +20,7 @@ /* @deprecated --mod-overlay-animation-duration-opened in favor of --mod-underlay-background-entry-animation-delay */ --spectrum-underlay-background-entry-animation-delay: var(--mod-underlay-background-entry-animation-delay, var(--mod-overlay-animation-duration-opened, var(--spectrum-animation-duration-0))); - /* TODO update to --spectrum-overlay-color token once an RGB stripped value is available */ - --spectrum-underlay-background-color: var(--mod-underlay-background-color, rgba(var(--spectrum-black-rgb), var(--spectrum-overlay-opacity))); + --spectrum-underlay-background-color: var(--mod-underlay-background-color, color-mix(in sRGB, var(--spectrum-overlay-color) var(--spectrum-overlay-opacity), transparent)); pointer-events: none; visibility: hidden; diff --git a/components/well/dist/metadata.json b/components/well/dist/metadata.json index c9fdd7f6da1..56097c6784d 100644 --- a/components/well/dist/metadata.json +++ b/components/well/dist/metadata.json @@ -24,8 +24,8 @@ "global": [ "--spectrum-body-color", "--spectrum-border-width-100", - "--spectrum-gray-1000-rgb", - "--spectrum-gray-800-rgb" + "--spectrum-gray-1000", + "--spectrum-gray-800" ], "passthroughs": [], "high-contrast": [] diff --git a/components/well/index.css b/components/well/index.css index 1aabb0c2b55..15f0394d6a0 100644 --- a/components/well/index.css +++ b/components/well/index.css @@ -12,11 +12,11 @@ */ .spectrum-Well { - --spectrum-well-border-color: rgba(var(--spectrum-gray-1000-rgb), 0.05); + --spectrum-well-border-color: color-mix(in sRGB, var(--spectrum-gray-1000) 5%, transparent); --spectrum-well-border-width: var(--spectrum-border-width-100); --spectrum-well-content-color: var(--spectrum-body-color); - --spectrum-well-background-color: rgba(var(--spectrum-gray-800-rgb), 0.02); + --spectrum-well-background-color: color-mix(in sRGB, var(--spectrum-gray-800) 2%, transparent); text-align: start; display: block; diff --git a/components/well/tokens.json b/components/well/tokens.json new file mode 100644 index 00000000000..28595faf0b8 --- /dev/null +++ b/components/well/tokens.json @@ -0,0 +1,54 @@ +{ + "well-border-radius": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-75}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + } + } + }, + "well-margin-top": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-75}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "5px" + } + } + }, + "well-min-width": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "240px" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "300px" + } + } + }, + "well-padding": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/scale-set.json", + "sets": { + "desktop": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/alias.json", + "value": "{spacing-300}" + }, + "mobile": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "20px" + } + } + } +} diff --git a/nx.json b/nx.json index bf1055ed8b7..b0241c7be2d 100644 --- a/nx.json +++ b/nx.json @@ -109,7 +109,7 @@ "dependsOn": ["build", { "projects": ["bundle"], "target": "build" }], "executor": "nx:run-commands", "inputs": [ - "{workspaceRoot}/tasks/compare-compiled-output.js", + "{workspaceRoot}/tasks/component-compare.js", { "dependentTasksOutputFiles": "dist/*.css", "transitive": true }, { "externalDependencies": [ @@ -129,7 +129,7 @@ ], "options": { "commands": [ - "node --no-warnings ./tasks/compare-compiled-output.js $NX_TASK_TARGET_PROJECT" + "node --no-warnings ./tasks/component-compare.js $NX_TASK_TARGET_PROJECT" ] }, "outputs": ["{workspaceRoot}/.diff-output/**"] diff --git a/package.json b/package.json index 2f541203ef5..805fb7fdb2a 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,6 @@ "@commitlint/cli": "^19.6.1", "@commitlint/config-conventional": "^19.6.0", "@nx/devkit": "^21.0.0", - "@spectrum-tools/postcss-rgb-mapping": "1.1.0", "@yarnpkg/types": "^4.0.0", "at-rule-packer": "^0.4.2", "autoprefixer": "^10.4.21", @@ -105,7 +104,7 @@ "postcss-licensing": "^3.0.0", "postcss-load-config": "^6.0.1", "postcss-modules": "^6.0.1", - "postcss-preset-env": "^10.1.5", + "postcss-preset-env": "^10.1.6", "postcss-pseudo-classes": "^0.4.0", "postcss-reporter": "^7.1.0", "postcss-selector-replace": "^1.0.2", @@ -113,8 +112,8 @@ "postcss-values-parser": "^6.0.2", "prettier": "^3.5.3", "rimraf": "^6.0.1", - "semver": "^7.7.1", - "stylelint": "^16.18.0", + "semver": "^7.7.2", + "stylelint": "^16.19.1", "stylelint-config-standard": "^38.0.0", "stylelint-header": "^3.0.0", "stylelint-high-performance-animation": "^1.11.0", diff --git a/plugins/postcss-rgb-mapping/CHANGELOG.md b/plugins/postcss-rgb-mapping/CHANGELOG.md deleted file mode 100644 index 9fd32bb6fba..00000000000 --- a/plugins/postcss-rgb-mapping/CHANGELOG.md +++ /dev/null @@ -1,38 +0,0 @@ -# Change Log - -## 1.1.0 - -### Minor Changes - -- [#3452](https://github.com/adobe/spectrum-css/pull/3452) [`287cff8`](https://github.com/adobe/spectrum-css/commit/287cff82b7706f0f56d6d37f48e1d9c60a6df4b9) Thanks [@marissahuysentruyt](https://github.com/marissahuysentruyt)! - Adds new functionality to better handle tokens that reference other transparent tokens. - - When a custom properties below is defined as another, specifically "transparent," variable, such as: - - ```css - --disabled-static-white-background-color: var( - --spectrum-transparent-white-100 - ); - ``` - - ...the plugin can now convert this single custom property into its `-rgb` and `-opacity` postfixed variables, that each correspond to the `-rgb` and `-opacity` variables of the definition's transparent token. It then reassembles the original, using and referencing these newly created variables. - - ```css - --disabled-static-white-background-color-rgb: var( - --spectrum-transparent-white-100-rgb - ); - --disabled-static-white-background-color-opacity: var( - --spectrum-transparent-white-100-opacity - ); - --disabled-static-white-background-color: rgba( - var(--disabled-static-white-background-color-rgb), - var(--disabled-static-white-background-color-opacity) - ); - ``` - -## 1.0.0 - -### Major Changes - -📝 [#3502](https://github.com/adobe/spectrum-css/pull/3502) [`562396e`](https://github.com/adobe/spectrum-css/commit/562396eaf21769341f78ea3761393b65f00e751b) Thanks [@castastrophe](https://github.com/castastrophe)! - -- Migrated the `postcss-rgb-mapping` package into the new `@spectrum-tools` namespace so updates may shipped and shared among other projects. diff --git a/plugins/postcss-rgb-mapping/README.md b/plugins/postcss-rgb-mapping/README.md deleted file mode 100644 index 1f7016a514c..00000000000 --- a/plugins/postcss-rgb-mapping/README.md +++ /dev/null @@ -1,89 +0,0 @@ -# postcss-rgb-mapping - -> Remaps rgb(a) values to an `rgb` postfixed variable. If an opacity is found, creates a separate `opacity` postfixed variable. -> Also remaps values that reference a transparent token (for example, `transparent-black-300`) to `rgb` and `opacity` postfixed variables. - -## Installation - -```sh -yarn add -D @spectrum-tools/postcss-rgb-mapping -postcss -u postcss-rgb-mapping -o dist/index.css src/index.css -``` - -## Usage - -### Example 1: RGB and opacity postfixed variables - -This plugin turns this: - -```css -.spectrum--lightest { - --spectrum-seafoam-100: rgba(206, 247, 243); - --spectrum-seafoam-200: rgba(170, 241, 234, 0.5); -} -``` - -Into this: - -```css -.spectrum--lightest { - /* Both --spectrum-seafoam-100 and --spectrum-seafoam-200 get split into separate - "-rgb" and "-opacity" values when applicable. */ - --spectrum-seafoam-100-rgb: 206, 247, 243; - --spectrum-seafoam-100: rgba(var(--spectrum-seafoam-100-rgb)); - --spectrum-seafoam-200-rgb: 170, 241, 234; - --spectrum-seafoam-200-opacity: 0.5; - /* The plugin then redefines the original custom variable to use the newly created - "-rgb" and/or "-opacity" custom variables. */ - --spectrum-seafoam-200: rgba( - var(--spectrum-seafoam-200-rgb), - var(--spectrum-seafoam-200-opacity) - ); -} -``` - -### Example 2: Remapping of transparent tokens - -This plugin turns this: - -```css -.spectrum--lightest { - --spectrum-transparent-white-100-rgb: 100, 100, 100; - --spectrum-transparent-white-100-opacity: 0.5; - --spectrum-transparent-white-100: rgba( - var(--spectrum-transparent-white-100-rgb), - var(--spectrum-transparent-white-100-opacity) - ); - /* The custom properties below is defined as another, specifically "transparent," variable. */ - --disabled-static-white-background-color: var( - --spectrum-transparent-white-100 - ); -} -``` - -Into this: - -```css -.spectrum--lightest { - --spectrum-transparent-white-100-rgb: 100, 100, 100; - --spectrum-transparent-white-100-opacity: 0.5; - --spectrum-transparent-white-100: rgba( - var(--spectrum-transparent-white-100-rgb), - var(--spectrum-transparent-white-100-opacity) - ); - /* In a similar fashion, the plugin creates new "-rgb" and "-opacity" postfixed custom - variables, that correspond to the definition's transparent "-rgb" and "-opacity" - postfixed custom variables. */ - --disabled-static-white-background-color-rgb: var( - --spectrum-transparent-white-100-rgb - ); - --disabled-static-white-background-color-opacity: var( - --spectrum-transparent-white-100-opacity - ); - /* Then reassembles the original to use and reference these newly created variables. */ - --disabled-static-white-background-color: rgba( - var(--disabled-static-white-background-color-rgb), - var(--disabled-static-white-background-color-opacity) - ); -} -``` diff --git a/plugins/postcss-rgb-mapping/expected/basic.css b/plugins/postcss-rgb-mapping/expected/basic.css deleted file mode 100644 index 8a5d3f3f350..00000000000 --- a/plugins/postcss-rgb-mapping/expected/basic.css +++ /dev/null @@ -1,15 +0,0 @@ -.elements { - --seafoam-100-rgb: 206, 247, 243; - --seafoam-100: rgba(var(--seafoam-100-rgb)); - --seafoam-200-rgb: 206, 247, 243; - --seafoam-200-opacity: 0.5; - --seafoam-200: rgba(var(--seafoam-200-rgb), var(--seafoam-200-opacity)); - --seafoam-300-rgb: 206, 247, 243; - --seafoam-300: rgba(var(--seafoam-300-rgb)); - --spectrum-transparent-white-100-rgb: 100, 100, 100; - --spectrum-transparent-white-100-opacity: 0.5; - --spectrum-transparent-white-100: rgba(var(--spectrum-transparent-white-100-rgb), var(--spectrum-transparent-white-100-opacity)); - --disabled-static-white-background-color-rgb: var(--spectrum-transparent-white-100-rgb); - --disabled-static-white-background-color-opacity: var(--spectrum-transparent-white-100-opacity); - --disabled-static-white-background-color: rgba(var(--disabled-static-white-background-color-rgb), var(--disabled-static-white-background-color-opacity)); -} diff --git a/plugins/postcss-rgb-mapping/expected/modern.css b/plugins/postcss-rgb-mapping/expected/modern.css deleted file mode 100644 index 209329ec912..00000000000 --- a/plugins/postcss-rgb-mapping/expected/modern.css +++ /dev/null @@ -1,15 +0,0 @@ -.elements { - --seafoam-100-rgb: 206 247 243; - --seafoam-100: rgba(var(--seafoam-100-rgb)); - --seafoam-200-rgb: 206 247 243; - --seafoam-200-opacity: 50%; - --seafoam-200: rgba(var(--seafoam-200-rgb) / var(--seafoam-200-opacity)); - --seafoam-300-rgb: 206 247 243; - --seafoam-300: rgba(var(--seafoam-300-rgb)); - --spectrum-transparent-white-100-rgb: 100 100 100; - --spectrum-transparent-white-100-opacity: 50%; - --spectrum-transparent-white-100: rgba(var(--spectrum-transparent-white-100-rgb) / var(--spectrum-transparent-white-100-opacity)); - --disabled-static-white-background-color-rgb: var(--spectrum-transparent-white-100-rgb); - --disabled-static-white-background-color-opacity: var(--spectrum-transparent-white-100-opacity); - --disabled-static-white-background-color: rgba(var(--disabled-static-white-background-color-rgb) / var(--disabled-static-white-background-color-opacity)); -} diff --git a/plugins/postcss-rgb-mapping/fixtures/basic.css b/plugins/postcss-rgb-mapping/fixtures/basic.css deleted file mode 100644 index d614c9cb38b..00000000000 --- a/plugins/postcss-rgb-mapping/fixtures/basic.css +++ /dev/null @@ -1,7 +0,0 @@ -.elements { - --seafoam-100: rgba(206, 247, 243); - --seafoam-200: rgba(206, 247, 243, 0.5); - --seafoam-300: rgb(206, 247, 243); - --spectrum-transparent-white-100: rgba(100, 100, 100, 0.5); - --disabled-static-white-background-color: var(--spectrum-transparent-white-100); -} diff --git a/plugins/postcss-rgb-mapping/index.js b/plugins/postcss-rgb-mapping/index.js deleted file mode 100644 index 22ee0214eb9..00000000000 --- a/plugins/postcss-rgb-mapping/index.js +++ /dev/null @@ -1,168 +0,0 @@ -/*! - * Copyright 2024. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. -*/ - -const valuesParser = require("postcss-values-parser"); - -/** @typedef {object} Options */ - -/** - * @type {import('postcss').PluginCreator} - * @param {Options} options - * @returns {import('postcss').Plugin} - */ -function rgbMappingFunction ({ - colorFunctionalNotation = false, -}) { - - return { - postcssPlugin: "@spectrum-tools/postcss-rgb-mapping", - /** @type {import('postcss').RootProcessor} */ - Root(root) { - /* Gather all the custom properties that reference "unprocessed" transparent tokens (i.e. transparent-white-200) */ - const transparentTokens = new Set(); - root.walkDecls(decl => { - if (decl.prop.startsWith('--spectrum-transparent-') && !decl.prop.endsWith('rgb') && !decl.prop.endsWith('opacity')) { - transparentTokens.add(decl.prop); - } - }); - - root.walkDecls(decl => { - const { prop, value } = decl; - - /* Determine if this property is a custom property */ - const isCustomProp = prop.startsWith("--"); - - /* Determine if this property has already been processed */ - const isProcessed = prop.endsWith("rgb") || prop.endsWith("opacity"); - - /* Check for transparent token reference */ - const transparentMatch = value.match(/var\((--spectrum-transparent-[^\s)]+)\)/); - if (isCustomProp && !isProcessed && transparentMatch) { - const referencedToken = transparentMatch[1]; - - if (transparentTokens.has(referencedToken)) { - /* Create the new RGB and opacity properties */ - decl.cloneBefore({ - prop: `${prop}-rgb`, - value: `var(${referencedToken}-rgb)` - }); - decl.cloneBefore({ - prop: `${prop}-opacity`, - value: `var(${referencedToken}-opacity)` - }); - - /* Update the original declaration */ - decl.value = `rgba(var(${prop}-rgb)${colorFunctionalNotation ? " / " : ", "}var(${prop}-opacity))`; - } - } - return; - }); - }, - - /** @type {import('postcss').DeclarationProcessor} */ - Declaration(decl, { Warning }) { - const { prop, value } = decl; - - /* Determine if this property is a custom property */ - const isCustomProp = prop.startsWith("--"); - - /* Determine if this property has already been processed */ - const isProcessed = prop.endsWith("rgb") || prop.endsWith("opacity"); - - /* Parse the value for its parts */ - const parsedValue = valuesParser.parse(value) || []; - - /* Determine if the value has an rgb or rgba value */ - const hasRGBValue = parsedValue.nodes.length ? parsedValue.nodes.some((node) => node.type === "func" && (["rgb", "rgba"].some(func => node.name === func))) : false; - - /* - * If the property is not a custom prop, or - * if the property is a custom prop and ends with 'rgb', or - * if the value is not an rgb or rgba value, or - * if the value is an rgba value with a var() function - * then return without processing. - */ - if (!isCustomProp || isProcessed || !hasRGBValue || parsedValue.nodes.length === 0) return; - - const rgba = parsedValue.nodes.find((node) => node.type === "func" && (["rgb", "rgba"].some(func => node.name === func))); - - const [r,g,b,a] = rgba.nodes.reduce((acc, node) => { - if (node.type === "numeric" && node.value) { - if (node?.unit && node.unit === "%") { - acc.push((node.value / 100).toFixed(2)); - } - else { - acc.push(node.value); - } - } - return acc; - }, []); - - /* If any of the values are undefined, return without processing */ - if (!r || !g || !b) { - return new Warning(`Unable to parse out rgb values: ${value}`, { node: decl }); - } - - /* Create a new declaration with the rgb values separated out */ - decl.cloneBefore({ - prop: `${prop}-rgb`, - value: colorFunctionalNotation ? `${r} ${g} ${b}` : `${r}, ${g}, ${b}`, - }); - - /* Update the original declaration value to point to the new variable */ - if (a) { - if (colorFunctionalNotation) { - if (typeof a === "string" && a.endsWith("%")) { - decl.cloneBefore({ - prop: `${prop}-opacity`, - value: a, - }); - } - else if (typeof a === "string" && a.startsWith("0.")) { - decl.cloneBefore({ - prop: `${prop}-opacity`, - value: `${parseFloat(a) * 100}%`, - }); - } - else { - decl.cloneBefore({ - prop: `${prop}-opacity`, - value: `${parseFloat(a) * 100}%`, - }); - } - } - else { - if (typeof a === "string" && a.endsWith("%")) { - decl.cloneBefore({ - prop: `${prop}-opacity`, - value: `${parseFloat(a) / 100}`, - }); - } - else { - decl.cloneBefore({ - prop: `${prop}-opacity`, - value: a, - }); - } - } - } - decl.assign({ - value: `rgba(var(${prop}-rgb)${a ? `${colorFunctionalNotation ? " /" : ","} var(${prop}-opacity)` : ""})`, - }); - return; - }, - }; -} - -rgbMappingFunction.postcss = true; -module.exports = rgbMappingFunction; diff --git a/plugins/postcss-rgb-mapping/package.json b/plugins/postcss-rgb-mapping/package.json deleted file mode 100644 index 80935f3f0ba..00000000000 --- a/plugins/postcss-rgb-mapping/package.json +++ /dev/null @@ -1,42 +0,0 @@ -{ - "name": "@spectrum-tools/postcss-rgb-mapping", - "version": "1.1.0", - "description": "Remaps rgb(a) values to an rgb postfixed variable", - "license": "Apache-2.0", - "author": "Adobe", - "contributors": [ - "Cassondra Roberts " - ], - "homepage": "https://opensource.adobe.com/spectrum-css", - "repository": { - "type": "git", - "url": "https://github.com/adobe/spectrum-css.git", - "directory": "plugins/postcss-rgb-mapping" - }, - "bugs": { - "url": "https://github.com/adobe/spectrum-css/issues" - }, - "main": "index.js", - "files": [ - "package.json", - "index.js", - "*.md" - ], - "dependencies": { - "postcss-values-parser": "^6.0.2" - }, - "peerDependencies": { - "postcss": ">=8" - }, - "devDependencies": { - "ava": "^6.2.0", - "c8": "^10.1.3", - "postcss": "^8.5.3" - }, - "keywords": [ - "css", - "rgb", - "plugin", - "postcss" - ] -} diff --git a/plugins/postcss-rgb-mapping/project.json b/plugins/postcss-rgb-mapping/project.json deleted file mode 100644 index 36438d12890..00000000000 --- a/plugins/postcss-rgb-mapping/project.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "$schema": "../../node_modules/nx/schemas/project-schema.json", - "name": "postcss-rgb-mapping", - "tags": ["tooling", "postcss", "plugin"], - "targets": { - "format": { - "defaultConfiguration": "plugins" - }, - "lint": { - "defaultConfiguration": "plugins" - }, - "test": { - "defaultConfiguration": "plugins" - } - } -} diff --git a/plugins/postcss-rgb-mapping/test.js b/plugins/postcss-rgb-mapping/test.js deleted file mode 100644 index 73e3319aa6c..00000000000 --- a/plugins/postcss-rgb-mapping/test.js +++ /dev/null @@ -1,42 +0,0 @@ -/*! - * Copyright 2024 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -const fs = require("fs"); -const test = require("ava"); -const postcss = require("postcss"); -const plugin = require("./index.js"); - -function compare(t, fixtureFilePath, expectedFilePath, options = {}) { - return postcss([plugin(options)]) - .process(readFile(`./fixtures/${fixtureFilePath}`), { - from: fixtureFilePath, - }) - .then((result) => { - const actual = result.css; - const expected = readFile(`./expected/${expectedFilePath}`); - t.is(actual, expected); - t.is(result.warnings().length, 0); - }); -} - -function readFile(filename) { - return fs.readFileSync(filename, "utf8"); -} - -test("create basic output", (t) => { - return compare(t, "basic.css", "basic.css"); -}); - -test("use modern rgba format", (t) => { - return compare(t, "basic.css", "modern.css", { colorFunctionalNotation: true }); -}); diff --git a/plugins/stylelint-no-missing-var/package.json b/plugins/stylelint-no-missing-var/package.json index d89d35a49a9..1ecf00c1258 100644 --- a/plugins/stylelint-no-missing-var/package.json +++ b/plugins/stylelint-no-missing-var/package.json @@ -35,7 +35,7 @@ "devDependencies": { "ava": "^6.2.0", "c8": "^10.1.3", - "stylelint": "^16.18.0" + "stylelint": "^16.19.1" }, "keywords": [ "css", diff --git a/plugins/stylelint-no-unknown-custom-properties/package.json b/plugins/stylelint-no-unknown-custom-properties/package.json index a48345f406f..a644546ab28 100644 --- a/plugins/stylelint-no-unknown-custom-properties/package.json +++ b/plugins/stylelint-no-unknown-custom-properties/package.json @@ -38,7 +38,7 @@ "devDependencies": { "ava": "^6.2.0", "c8": "^10.1.3", - "stylelint": "^16.18.0" + "stylelint": "^16.19.1" }, "keywords": [ "css", diff --git a/plugins/stylelint-no-unused-custom-properties/package.json b/plugins/stylelint-no-unused-custom-properties/package.json index c5289adb889..dd8adbe688c 100644 --- a/plugins/stylelint-no-unused-custom-properties/package.json +++ b/plugins/stylelint-no-unused-custom-properties/package.json @@ -37,7 +37,7 @@ "devDependencies": { "ava": "^6.2.0", "c8": "^10.1.3", - "stylelint": "^16.18.0" + "stylelint": "^16.19.1" }, "keywords": [ "css", diff --git a/postcss.config.js b/postcss.config.js index f5293934ffb..197f28e0e37 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -118,7 +118,7 @@ module.exports = ({ }, // @todo yarn add -DW css-declaration-sorter cssDeclarationSorter: false, // @todo { order: "smacss" } - normalizeWhitespace: minify || isProduction, + normalizeWhitespace: minify, }, ], }, diff --git a/tasks/component-compare.js b/tasks/component-compare.js index 213627b2ac5..daa839c8b4f 100644 --- a/tasks/component-compare.js +++ b/tasks/component-compare.js @@ -5,6 +5,7 @@ const { join, relative, dirname, basename, extname } = require("path"); const fg = require("fast-glob"); const tar = require("tar"); const _ = require("lodash"); +const semver = require("semver"); const nunjucks = require("nunjucks"); const env = new nunjucks.Environment(); @@ -145,6 +146,7 @@ async function generateDiff({ async function fetchPublishedComponent(packageName, { cacheLocation, outputLocation, + base, }) { const warnings = []; let tag; @@ -157,13 +159,23 @@ async function fetchPublishedComponent(packageName, { warnings.push(err ?? `Failed to fetch ${packageName.yellow} from npm.\n`); })) ?? {}; - // If the component exists on npm, fetch the latest release data - // @todo what is the fallback if there isn't a latest tag? - if (npmData["dist-tags"]?.latest) { + + // If a base was configured and it exists as a specific tag, use that + if (base) { + if (npmData["dist-tags"]?.[base]) { + tag = npmData["dist-tags"]?.[base]; + } + // Otherwise try to use the base as a version number + else if (semver.valid(base) && npmData.versions?.[base]) { + tag = base; + } + } + else if (npmData["dist-tags"]?.latest) { tag = npmData["dist-tags"]?.latest; } + // @todo: else fetch built assets from the main branch? - if (!tag) return; + if (!tag) return { warnings: [`No base version found for ${packageName.yellow}.`] }; // Check locally to see if we have already fetched the tarball // for this tag; if not, fetch it and extract it @@ -206,6 +218,7 @@ async function processComponent( cwd, output = pathing.output, cacheLocation = pathing.cache, + base, } ) { if (!component) return Promise.reject("No component specified."); @@ -253,6 +266,7 @@ async function processComponent( const npmResults = await fetchPublishedComponent(pkg.name, { cacheLocation, outputLocation: join(pathing.latest, component), + base, }); if (npmResults?.tag) { @@ -353,7 +367,7 @@ async function processFile(filename, localPath, comparePath) { async function main( components, output, - { skipCache = false } = {} + { skipCache = false, base } = {} ) { if (!components || components.length === 0) { components = getAllComponentNames(false); @@ -399,6 +413,7 @@ async function main( return processComponent(component, { output: pathing.output, cacheLocation: pathing.cache, + base, }).catch((err) => Promise.resolve({ component, @@ -548,13 +563,24 @@ async function main( } } -let { - _: components, - output = join(dirs.root, ".diff-output"), - cache = true, - // @todo allow to run against local main or published versions -} = yargs(hideBin(process.argv)).argv; - -main(components, output, { skipCache: !cache }).then((code) => { +let { _: components, output, cache, base } = yargs(hideBin(process.argv)) + .option("output", { + type: "string", + description: "The output directory for the diffs", + default: join(dirs.root, ".diff-output"), + }) + .option("cache", { + type: "boolean", + description: "Whether to cache the tarballs from npm", + default: true, + }) + .option("base", { + type: "string", + description: "The base version of the component to compare against", + default: "next", + }) + .argv; + +main(components, output, { base, skipCache: !cache }).then((code) => { process.exit(code); }); diff --git a/tasks/templates/compare-listing.njk b/tasks/templates/compare-listing.njk index f47eff8126e..d6200039645 100644 --- a/tasks/templates/compare-listing.njk +++ b/tasks/templates/compare-listing.njk @@ -15,7 +15,7 @@ --mod-table-cursor-row-default: auto; font-family: var(--spectrum-default-font-family); - background-color: var(--spectrum-background-layer-1-color); + background-color: var(--spectrum-background-base-color); color: var(--spectrum-neutral-content-color-default); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); @@ -50,7 +50,7 @@ } - +
{{ nav | safe }} diff --git a/tasks/templates/diff-preview.njk b/tasks/templates/diff-preview.njk index d2e0cb642d2..7a280b2ee83 100644 --- a/tasks/templates/diff-preview.njk +++ b/tasks/templates/diff-preview.njk @@ -17,7 +17,7 @@ --mod-detail-margin-start: 0; font-family: var(--spectrum-default-font-family); - background-color: var(--spectrum-background-layer-1-color); + background-color: var(--spectrum-background-base-color); color: var(--spectrum-neutral-content-color-default); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); @@ -47,7 +47,7 @@ margin-block-end: 2em; } .spectrum-Container-main section { - background-color: var(--spectrum-background-layer-2-color); + background-color: var(--spectrum-background-layer-1-color); color: var(--spectrum-neutral-content-color-default); border-radius: 4px; padding: 1rem; @@ -55,7 +55,7 @@ .d2h-code-side-linenumber { position: relative !important; } - +
{{ nav | safe }} diff --git a/tokens/custom-tokens.json b/tokens/custom-tokens.json new file mode 100644 index 00000000000..794649d4290 --- /dev/null +++ b/tokens/custom-tokens.json @@ -0,0 +1,99 @@ +{ + "animation-duration-0": { + "value": "0ms" + }, + "animation-duration-100": { + "value": "130ms" + }, + "animation-duration-1000": { + "value": "500ms" + }, + "animation-duration-200": { + "value": "160ms" + }, + "animation-duration-2000": { + "value": "1000ms" + }, + "animation-duration-300": { + "value": "190ms" + }, + "animation-duration-400": { + "value": "220ms" + }, + "animation-duration-4000": { + "value": "2000ms" + }, + "animation-duration-500": { + "value": "250ms" + }, + "animation-duration-600": { + "value": "300ms" + }, + "animation-duration-6000": { + "value": "3000ms" + }, + "animation-duration-700": { + "value": "3500ms" + }, + "animation-duration-800": { + "value": "400ms" + }, + "animation-duration-900": { + "value": "450ms" + }, + "animation-ease-in": { + "value": "cubic-bezier(0.5, 0, 1, 1)" + }, + "animation-ease-in-out": { + "value": "cubic-bezier(0.45, 0, 0.4, 1)" + }, + "animation-ease-linear": { + "value": "cubic-bezier(0, 0, 1, 1)" + }, + "animation-ease-out": { + "value": "cubic-bezier(0, 0, 0.4, 1)" + }, + "animation-linear": { + "value": "cubic-bezier(0, 0, 1, 1)" + }, + "cjk-font": { + "value": "{cjk-font-family-stack}" + }, + "cjk-font-family-stack": { + "value": "adobe-clean-han-japanese, var(--spectrum-cjk-font-family), sans-serif" + }, + "code-font-family-stack": { + "value": "\"Source Code Pro\", Monaco, monospace" + }, + "corner-radius-1000": { + "$schema": "https://opensource.adobe.com/spectrum-tokens/schemas/token-types/dimension.json", + "value": "9999px" + }, + "font-family": { + "value": "{sans-font-family-stack}" + }, + "font-family-ar": { + "value": "myriad-arabic, adobe-clean, \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "font-family-he": { + "value": "myriad-hebrew, adobe-clean, \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "font-size": { + "value": "{font-size-100}" + }, + "font-style": { + "value": "{default-font-style}" + }, + "sans-font-family-stack": { + "value": "adobe-clean, var(--spectrum-sans-serif-font-family), \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "sans-serif-font": { + "value": "{sans-font-family-stack}" + }, + "serif-font": { + "value": "{serif-font-family-stack}" + }, + "serif-font-family-stack": { + "value": "adobe-clean-serif, var(--spectrum-serif-font-family), \"Source Serif Pro\", Georgia, serif" + } +} diff --git a/tokens/custom/dark-vars.css b/tokens/custom/dark-vars.css deleted file mode 100644 index 2f1fd03fed2..00000000000 --- a/tokens/custom/dark-vars.css +++ /dev/null @@ -1,62 +0,0 @@ -/*! - * Copyright 2025 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -/* This file contains overrides and additions to core tokens */ - -.spectrum--dark { - /* stylelint-disable-next-line custom-property-pattern -- context identification */ - --color-scheme: dark; - - /** COMPONENT-SPECIFIC OVERRIDES **/ - --spectrum-assetcard-border-color-selected: var(--spectrum-blue-800); - --spectrum-assetcard-border-color-selected-hover: var(--spectrum-blue-800); - --spectrum-assetcard-border-color-selected-down: var(--spectrum-blue-900); - --spectrum-assetcard-selectionindicator-background-color-ordered: var(--spectrum-blue-800); - --spectrum-assestcard-focus-indicator-color: var(--spectrum-blue-700); - - --spectrum-assetlist-item-background-color-selected-hover: rgb(var(--spectrum-blue-800-rgb), 0.25); - --spectrum-assetlist-item-background-color-selected: rgb(var(--spectrum-blue-800-rgb), 0.15); - --spectrum-assetlist-border-color-key-focus: var(--spectrum-blue-700); - - --spectrum-badge-label-icon-color-primary: var(--spectrum-black); - - --spectrum-calendar-day-background-color-selected: rgb(var(--spectrum-blue-800-rgb), 0.15); - --spectrum-calendar-day-background-color-hover: rgb(var(--spectrum-white-rgb), 0.07); - --spectrum-calendar-day-today-background-color-selected-hover: rgb(var(--spectrum-blue-800-rgb), 0.25); - --spectrum-calendar-day-background-color-selected-hover: rgb(var(--spectrum-blue-800-rgb), 0.25); - --spectrum-calendar-day-background-color-down: var(--spectrum-transparent-white-200); - --spectrum-calendar-day-background-color-cap-selected: rgb(var(--spectrum-blue-800-rgb), 0.25); - --spectrum-calendar-day-background-color-key-focus: rgb(var(--spectrum-white-rgb), 0.07); - --spectrum-calendar-day-border-color-key-focus: var(--spectrum-blue-700); - --spectrum-card-selected-background-color-rgb: var(--spectrum-blue-500-rgb); - - --spectrum-coach-indicator-ring-default-color: var(--spectrum-blue-700); - - --spectrum-drop-zone-background-color-rgb: var(--spectrum-blue-900-rgb); /* var(--spectrum-accent-color-900); */ - - --spectrum-dropindicator-color: var(--spectrum-blue-700); - - --spectrum-logic-button-and-background-color: var(--spectrum-blue-800); - --spectrum-logic-button-and-border-color: var(--spectrum-blue-800); - --spectrum-logic-button-and-background-color-hover: var(--spectrum-blue-1000); - --spectrum-logic-button-and-border-color-hover: var(--spectrum-blue-1000); - --spectrum-logic-button-or-background-color: var(--spectrum-magenta-700); - --spectrum-logic-button-or-border-color: var(--spectrum-magenta-700); - --spectrum-logic-button-or-background-color-hover: var(--spectrum-magenta-900); - --spectrum-logic-button-or-border-color-hover: var(--spectrum-magenta-900); - - --spectrum-steplist-current-marker-color-key-focus: var(--spectrum-blue-700); - - --spectrum-treeview-item-background-color-quiet-selected: rgb(var(--spectrum-gray-900-rgb), 0.07); - --spectrum-treeview-item-background-color-selected: rgb(var(--spectrum-blue-800-rgb), 0.15); -} diff --git a/tokens/custom/global-vars.css b/tokens/custom/global-vars.css deleted file mode 100644 index be7d3bbb698..00000000000 --- a/tokens/custom/global-vars.css +++ /dev/null @@ -1,68 +0,0 @@ -/*! - * Copyright 2024 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -/* This file contains overrides and additions to core tokens */ -.spectrum { - --system: spectrum; - - --spectrum-animation-duration-0: 0ms; - --spectrum-animation-duration-100: 130ms; - --spectrum-animation-duration-200: 160ms; - --spectrum-animation-duration-300: 190ms; - --spectrum-animation-duration-400: 220ms; - --spectrum-animation-duration-500: 250ms; - --spectrum-animation-duration-600: 300ms; - --spectrum-animation-duration-700: 350ms; - --spectrum-animation-duration-800: 400ms; - --spectrum-animation-duration-900: 450ms; - --spectrum-animation-duration-1000: 500ms; - --spectrum-animation-duration-2000: 1000ms; - --spectrum-animation-duration-4000: 2000ms; - --spectrum-animation-duration-6000: 3000ms; - - --spectrum-animation-linear: cubic-bezier(0, 0, 1, 1); - - --spectrum-animation-ease-in-out: cubic-bezier(0.45, 0, 0.4, 1); - --spectrum-animation-ease-in: cubic-bezier(0.5, 0, 1, 1); - --spectrum-animation-ease-out: cubic-bezier(0, 0, 0.4, 1); - --spectrum-animation-ease-linear: cubic-bezier(0, 0, 1, 1); - - /* stylelint-disable value-keyword-case -- typography names should use their appropriate cases */ - --spectrum-sans-font-family-stack: adobe-clean, var(--spectrum-sans-serif-font-family), "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Trebuchet MS", "Lucida Grande", sans-serif; - --spectrum-sans-serif-font: var(--spectrum-sans-font-family-stack); - - --spectrum-serif-font-family-stack: adobe-clean-serif, var(--spectrum-serif-font-family), "Source Serif Pro", Georgia, serif; - --spectrum-serif-font: var(--spectrum-serif-font-family-stack); - - --spectrum-code-font-family-stack: "Source Code Pro", Monaco, monospace; - - --spectrum-font-family-ar: myriad-arabic, adobe-clean, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Trebuchet MS", "Lucida Grande", sans-serif; - --spectrum-font-family-he: myriad-hebrew, adobe-clean, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Trebuchet MS", "Lucida Grande", sans-serif; - /* stylelint-enable value-keyword-case */ - - --spectrum-font-family: var(--spectrum-sans-font-family-stack); - --spectrum-font-style: var(--spectrum-default-font-style); - --spectrum-font-size: var(--spectrum-font-size-100); - - --spectrum-cjk-font-family-stack: adobe-clean-han-japanese, var(--spectrum-cjk-font-family), sans-serif; - --spectrum-cjk-font: var(--spectrum-code-font-family-stack); - - /* Gradient that changes with the color theme. */ - --spectrum-examples-gradient: linear-gradient(45deg, var(--spectrum-magenta-1500), var(--spectrum-blue-1500)); - - /* Gradients that do not change with the color theme, for use in static color backgrounds. */ - --spectrum-examples-gradient-static-black: linear-gradient(45deg, rgb(255 241 246), rgb(238 245 255)); - --spectrum-examples-gradient-static-white: linear-gradient(45deg, rgb(64 0 22), rgb(14 24 67)); - - --spectrum-coach-indicator-ring-static-white-color: var(--spectrum-white); -} diff --git a/tokens/custom/large-vars.css b/tokens/custom/large-vars.css deleted file mode 100644 index 7e076444f77..00000000000 --- a/tokens/custom/large-vars.css +++ /dev/null @@ -1,142 +0,0 @@ -/*! - * Copyright 2024 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -/* This file contains overrides and additions to core tokens */ - -.spectrum--large { - /* stylelint-disable-next-line custom-property-pattern -- context identification */ - --scale: large; - - --spectrum-alert-banner-close-button-spacing: var(--spectrum-spacing-200); - --spectrum-alert-banner-edge-to-divider: var(--spectrum-spacing-200); - --spectrum-alert-banner-edge-to-button: var(--spectrum-spacing-200); - --spectrum-alert-banner-text-to-button-vertical: var(--spectrum-spacing-200); - - --spectrum-alert-dialog-padding: var(--spectrum-spacing-400); - --spectrum-alert-dialog-description-to-buttons: var(--spectrum-spacing-600); - - --spectrum-assetcard-focus-ring-border-radius: 9px; - --spectrum-assetcard-selectionindicator-margin: 15px; - --spectrum-assetcard-title-font-size: var(--spectrum-heading-size-xxs); - --spectrum-assetcard-header-content-font-size: var(--spectrum-heading-size-xxs); - --spectrum-assetcard-content-font-size: var(--spectrum-body-size-xs); - - --spectrum-button-top-to-text-small: 6px; - --spectrum-button-bottom-to-text-small: 5px; - --spectrum-button-top-to-text-medium: 9px; - --spectrum-button-bottom-to-text-medium: 10px; - --spectrum-button-top-to-text-large: 12px; - --spectrum-button-bottom-to-text-large: 13px; - --spectrum-button-top-to-text-extra-large: 16px; - --spectrum-button-bottom-to-text-extra-large: 17px; - - --spectrum-coach-indicator-gap: 8px; - --spectrum-coach-indicator-ring-diameter: 20px; - --spectrum-coach-indicator-quiet-ring-diameter: 10px; - --spectrum-coachmark-action-menu-vertical-offset: -6px; - --spectrum-coachmark-buttongroup-display: none; - --spectrum-coachmark-buttongroup-mobile-display: flex; - --spectrum-coachmark-menu-display: none; - --spectrum-coachmark-menu-mobile-display: inline-flex; - - --spectrum-colorwheel-path: "M 119 119 m -119 0 a 119 119 0 1 0 238 0 a 119 119 0 1 0 -238 0.2 M 119 119 m -91 0 a 91 91 0 1 0 182 0 a 91 91 0 1 0 -182 0"; - --spectrum-colorwheel-path-borders: "M 120 120 m -120 0 a 120 120 0 1 0 240 0 a 120 120 0 1 0 -240 0.2 M 120 120 m -90 0 a 90 90 0 1 0 180 0 a 90 90 0 1 0 -180 0"; - --spectrum-colorwheel-colorarea-container-size: 182px; - - --spectrum-colorloupe-checkerboard-fill: url("#checkerboard-secondary"); - - --spectrum-contextual-help-content-spacing: var(--spectrum-spacing-200); - - --spectrum-datepicker-initial-width: 160px; - --spectrum-datepicker-generic-padding: 15px; - --spectrum-datepicker-dash-line-height: 30px; - --spectrum-datepicker-width-quiet-first: 90px; - --spectrum-datepicker-width-quiet-second: 20px; - --spectrum-datepicker-datetime-width-first: 45px; - --spectrum-datepicker-invalid-icon-to-button: 10px; - --spectrum-datepicker-invalid-icon-to-button-quiet: 9px; - --spectrum-datepicker-input-datetime-width: 30px; - - --spectrum-dial-border-radius: 20px; - --spectrum-dial-handle-position: 10px; - --spectrum-dial-handle-block-margin: 20px; - --spectrum-dial-handle-inline-margin: 20px; - --spectrum-dial-controls-margin: 10px; - --spectrum-dial-label-gap-y: 6px; - --spectrum-dial-label-container-top-to-text: 5px; - - --spectrum-dialog-confirm-entry-animation-distance: 25px; - --spectrum-dialog-confirm-hero-height: 160px; - --spectrum-dialog-confirm-border-radius: 5px; - --spectrum-dialog-confirm-title-text-size: 19px; - --spectrum-dialog-confirm-description-text-size: 15px; - --spectrum-dialog-confirm-padding-grid: 24px; - - --spectrum-menu-item-selectable-edge-to-text-not-selected-small: 34px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-medium: 42px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-large: 47px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-extra-large: 54px; - - --spectrum-menu-item-checkmark-height-small: 12px; - --spectrum-menu-item-checkmark-height-medium: 14px; - --spectrum-menu-item-checkmark-height-large: 16px; - --spectrum-menu-item-checkmark-height-extra-large: 16px; - - --spectrum-menu-item-checkmark-width-small: 12px; - --spectrum-menu-item-checkmark-width-medium: 14px; - --spectrum-menu-item-checkmark-width-large: 16px; - --spectrum-menu-item-checkmark-width-extra-large: 16px; - - --spectrum-pagination-textfield-width: 60px; - --spectrum-pagination-item-inline-spacing: 6px; - - --spectrum-slider-tick-mark-height: 13px; - --spectrum-slider-ramp-track-height: 20px; - - --spectrum-standard-dialog-spacing-edge-to-content: var(--spectrum-spacing-400); - --spectrum-takeover-dialog-spacing-grid-padding: var(--spectrum-spacing-400); - --spectrum-takeover-dialog-spacing-header-gap: var(--spectrum-spacing-300); - --spectrum-takeover-dialog-spacing-title-to-body: var(--spectrum-spacing-400); - - --spectrum-treeview-item-indentation-medium: 20px; - --spectrum-treeview-item-indentation-small: 15px; - --spectrum-treeview-item-indentation-large: 25px; - --spectrum-treeview-item-indentation-extra-large: 30px; - --spectrum-treeview-indicator-inset-block-start: 6px; - --spectrum-treeview-item-min-block-size-thumbnail-offset-medium: 2px; - - /* To get a square that measures 12px on the diagonal, the sides have to be 10px */ - --spectrum-tooltip-tip-square-size: 10px; - - --spectrum-ui-icon-medium-display: none; - --spectrum-ui-icon-large-display: block; - - --spectrum-well-border-radius: 5px; - --spectrum-well-margin-top: 5px; - --spectrum-well-min-width: 300px; - --spectrum-well-padding: 20px; - - /* XXL and XXS icon sizes are not within the design spec and are planned to be deprecated in Spectrum 2. */ - --spectrum-workflow-icon-size-xxl: 40px; - --spectrum-workflow-icon-size-xxs: 15px; - - --spectrum-in-field-button-side-edge-to-fill-small: 3px; - --spectrum-in-field-button-side-edge-to-fill-medium: 4px; - --spectrum-in-field-button-side-edge-to-fill-large: 4px; - --spectrum-in-field-button-side-edge-to-fill-extra-large: 4px; - - --spectrum-field-edge-to-icon-75: 6px; - --spectrum-field-edge-to-icon-100: 9px; - --spectrum-field-edge-to-icon-200: 11px; - --spectrum-field-edge-to-icon-300: 14px; -} diff --git a/tokens/custom/light-vars.css b/tokens/custom/light-vars.css deleted file mode 100644 index 7f344e23fa7..00000000000 --- a/tokens/custom/light-vars.css +++ /dev/null @@ -1,60 +0,0 @@ -/*! - * Copyright 2025 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -/* This file contains overrides and additions to core tokens */ -.spectrum--light { - /* stylelint-disable-next-line custom-property-pattern -- context identification */ - --color-scheme: light; - - --spectrum-assetcard-border-color-selected: var(--spectrum-blue-900); - --spectrum-assetcard-border-color-selected-hover: var(--spectrum-blue-900); - --spectrum-assetcard-border-color-selected-down: var(--spectrum-blue-1000); - --spectrum-assetcard-selectionindicator-background-color-ordered: var(--spectrum-blue-900); - --spectrum-assestcard-focus-indicator-color: var(--spectrum-blue-800); - - --spectrum-assetlist-item-background-color-selected-hover: rgb(var(--spectrum-blue-900-rgb), 0.2); - --spectrum-assetlist-item-background-color-selected: rgb(var(--spectrum-blue-900-rgb), 0.1); - --spectrum-assetlist-border-color-key-focus: var(--spectrum-blue-800); - - --spectrum-badge-label-icon-color-primary: var(--spectrum-white); - - --spectrum-calendar-day-background-color-selected: rgb(var(--spectrum-blue-900-rgb), 0.1); - --spectrum-calendar-day-background-color-hover: rgb(var(--spectrum-black-rgb), 0.06); - --spectrum-calendar-day-today-background-color-selected-hover: rgb(var(--spectrum-blue-900-rgb), 0.2); - --spectrum-calendar-day-background-color-selected-hover: rgb(var(--spectrum-blue-900-rgb), 0.2); - --spectrum-calendar-day-background-color-down: var(--spectrum-transparent-black-200); - --spectrum-calendar-day-background-color-cap-selected: rgb(var(--spectrum-blue-900-rgb), 0.2); - --spectrum-calendar-day-background-color-key-focus: rgb(var(--spectrum-black-rgb), 0.06); - --spectrum-calendar-day-border-color-key-focus: var(--spectrum-blue-800); - --spectrum-card-selected-background-color-rgb: var(--spectrum-blue-900-rgb); - - --spectrum-coach-indicator-ring-default-color: var(--spectrum-blue-800); - - --spectrum-drop-zone-background-color-rgb: var(--spectrum-blue-800-rgb); /* var(--spectrum-accent-color-800); */ - - --spectrum-dropindicator-color: var(--spectrum-blue-800); - - --spectrum-logic-button-and-background-color: var(--spectrum-blue-900); - --spectrum-logic-button-and-border-color: var(--spectrum-blue-900); - --spectrum-logic-button-and-background-color-hover: var(--spectrum-blue-1100); - --spectrum-logic-button-and-border-color-hover: var(--spectrum-blue-1100); - --spectrum-logic-button-or-background-color: var(--spectrum-magenta-900); - --spectrum-logic-button-or-border-color: var(--spectrum-magenta-900); - --spectrum-logic-button-or-background-color-hover: var(--spectrum-magenta-1100); - --spectrum-logic-button-or-border-color-hover: var(--spectrum-magenta-1100); - - --spectrum-steplist-current-marker-color-key-focus: var(--spectrum-blue-800); - - --spectrum-treeview-item-background-color-quiet-selected: rgb(var(--spectrum-gray-900-rgb), 0.06); - --spectrum-treeview-item-background-color-selected: rgb(var(--spectrum-blue-900-rgb), 0.1); -} diff --git a/tokens/custom/medium-vars.css b/tokens/custom/medium-vars.css deleted file mode 100644 index 63c1191f713..00000000000 --- a/tokens/custom/medium-vars.css +++ /dev/null @@ -1,140 +0,0 @@ -/*! - * Copyright 2024 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -/* This file contains overrides and additions to core tokens */ - -.spectrum--medium { - /* stylelint-disable-next-line custom-property-pattern -- context identification */ - --scale: medium; - - --spectrum-alert-banner-close-button-spacing: var(--spectrum-spacing-100); - --spectrum-alert-banner-edge-to-button: var(--spectrum-spacing-100); - --spectrum-alert-banner-edge-to-divider: var(--spectrum-spacing-100); - --spectrum-alert-banner-text-to-button-vertical: var(--spectrum-spacing-100); - - --spectrum-alert-dialog-description-to-buttons: var(--spectrum-spacing-700); - --spectrum-alert-dialog-padding: var(--spectrum-spacing-500); - - --spectrum-assetcard-content-font-size: var(--spectrum-body-size-s); - --spectrum-assetcard-focus-ring-border-radius: 8px; - --spectrum-assetcard-header-content-font-size: var(--spectrum-heading-size-xs); - --spectrum-assetcard-selectionindicator-margin: 12px; - --spectrum-assetcard-title-font-size: var(--spectrum-heading-size-xs); - - --spectrum-button-bottom-to-text-small: 4px; - --spectrum-button-bottom-to-text-medium: 8px; - --spectrum-button-bottom-to-text-large: 10px; - --spectrum-button-bottom-to-text-extra-large: 13px; - --spectrum-button-top-to-text-small: 5px; - --spectrum-button-top-to-text-medium: 7px; - --spectrum-button-top-to-text-large: 10px; - --spectrum-button-top-to-text-extra-large: 13px; - - --spectrum-coach-indicator-gap: 6px; - --spectrum-coach-indicator-ring-diameter: var(--spectrum-spacing-300); - --spectrum-coach-indicator-quiet-ring-diameter: var(--spectrum-spacing-100); - --spectrum-coachmark-action-menu-vertical-offset: -4px; - --spectrum-coachmark-buttongroup-display: flex; - --spectrum-coachmark-buttongroup-mobile-display: none; - --spectrum-coachmark-menu-display: inline-flex; - --spectrum-coachmark-menu-mobile-display: none; - - --spectrum-colorloupe-checkerboard-fill: url("#checkerboard-primary"); - - --spectrum-colorwheel-colorarea-container-size: 144px; - --spectrum-colorwheel-path: "M 95 95 m -95 0 a 95 95 0 1 0 190 0 a 95 95 0 1 0 -190 0.2 M 95 95 m -73 0 a 73 73 0 1 0 146 0 a 73 73 0 1 0 -146 0"; - --spectrum-colorwheel-path-borders: "M 96 96 m -96 0 a 96 96 0 1 0 192 0 a 96 96 0 1 0 -192 0.2 M 96 96 m -72 0 a 72 72 0 1 0 144 0 a 72 72 0 1 0 -144 0"; - - --spectrum-contextual-help-content-spacing: var(--spectrum-spacing-100); - - --spectrum-datepicker-dash-line-height: 24px; - --spectrum-datepicker-datetime-width-first: 36px; - --spectrum-datepicker-generic-padding: var(--spectrum-spacing-200); - --spectrum-datepicker-initial-width: 128px; - --spectrum-datepicker-input-datetime-width: var(--spectrum-spacing-400); - --spectrum-datepicker-invalid-icon-to-button: 8px; - --spectrum-datepicker-invalid-icon-to-button-quiet: 7px; - --spectrum-datepicker-width-quiet-first: 72px; - --spectrum-datepicker-width-quiet-second: 16px; - - --spectrum-dial-border-radius: 16px; - --spectrum-dial-controls-margin: 8px; - --spectrum-dial-handle-block-margin: 16px; - --spectrum-dial-handle-inline-margin: 16px; - --spectrum-dial-handle-position: 8px; - --spectrum-dial-label-container-top-to-text: 4px; - --spectrum-dial-label-gap-y: 5px; - - --spectrum-dialog-confirm-border-radius: 4px; - --spectrum-dialog-confirm-description-text-size: 14px; - --spectrum-dialog-confirm-entry-animation-distance: 20px; - --spectrum-dialog-confirm-hero-height: 128px; - --spectrum-dialog-confirm-padding-grid: 40px; - --spectrum-dialog-confirm-title-text-size: 18px; - - --spectrum-menu-item-checkmark-height-small: 10px; - --spectrum-menu-item-checkmark-height-medium: 10px; - --spectrum-menu-item-checkmark-height-large: 12px; - --spectrum-menu-item-checkmark-height-extra-large: 14px; - --spectrum-menu-item-checkmark-width-small: 10px; - --spectrum-menu-item-checkmark-width-medium: 10px; - --spectrum-menu-item-checkmark-width-large: 12px; - --spectrum-menu-item-checkmark-width-extra-large: 14px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-small: 28px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-medium: 32px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-large: 38px; - --spectrum-menu-item-selectable-edge-to-text-not-selected-extra-large: 45px; - - --spectrum-pagination-item-inline-spacing: 5px; - --spectrum-pagination-textfield-width: var(--spectrum-spacing-700); - - --spectrum-slider-ramp-track-height: 16px; - --spectrum-slider-tick-mark-height: 10px; - - --spectrum-standard-dialog-spacing-edge-to-content: var(--spectrum-spacing-500); - --spectrum-takeover-dialog-spacing-grid-padding: var(--spectrum-spacing-500); - --spectrum-takeover-dialog-spacing-header-gap: var(--spectrum-spacing-400); - --spectrum-takeover-dialog-spacing-title-to-body: var(--spectrum-spacing-500); - - --spectrum-treeview-indicator-inset-block-start: 5px; - --spectrum-treeview-item-indentation-small: var(--spectrum-spacing-200); - --spectrum-treeview-item-indentation-medium: var(--spectrum-spacing-300); - --spectrum-treeview-item-indentation-large: 20px; - --spectrum-treeview-item-indentation-extra-large: var(--spectrum-spacing-400); - --spectrum-treeview-item-min-block-size-thumbnail-offset-medium: 0px; - - /* To get a square that measures 10px on the diagonal, the sides have to be 8px */ - --spectrum-tooltip-tip-square-size: 8px; - - --spectrum-ui-icon-medium-display: block; - --spectrum-ui-icon-large-display: none; - - --spectrum-well-border-radius: var(--spectrum-spacing-75); - --spectrum-well-margin-top: var(--spectrum-spacing-75); - --spectrum-well-min-width: 240px; - --spectrum-well-padding: var(--spectrum-spacing-300); - - /* XXL and XXS icon sizes are not within the design spec and are planned to be deprecated in Spectrum 2. */ - --spectrum-workflow-icon-size-xxl: 32px; - --spectrum-workflow-icon-size-xxs: 12px; - - --spectrum-in-field-button-side-edge-to-fill-small: 4px; - --spectrum-in-field-button-side-edge-to-fill-medium: 3px; - --spectrum-in-field-button-side-edge-to-fill-large: 4px; - --spectrum-in-field-button-side-edge-to-fill-extra-large: 4px; - - --spectrum-field-edge-to-icon-75: 4px; - --spectrum-field-edge-to-icon-100: 5px; - --spectrum-field-edge-to-icon-200: 6px; - --spectrum-field-edge-to-icon-300: 10px; -} diff --git a/tokens/dist/json/tokens.json b/tokens/dist/json/tokens.json index 05d6fa39453..6619ae9ab3c 100644 --- a/tokens/dist/json/tokens.json +++ b/tokens/dist/json/tokens.json @@ -1,17040 +1,18751 @@ { - "accent-background-color-default": { - "prop": "--spectrum-accent-background-color-default", - "ref": "var(--spectrum-accent-color-800)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "accent-background-color-down": { - "prop": "--spectrum-accent-background-color-down", - "ref": "var(--spectrum-accent-color-700)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "accent-background-color-hover": { - "prop": "--spectrum-accent-background-color-hover", - "ref": "var(--spectrum-accent-color-700)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "accent-background-color-key-focus": { - "prop": "--spectrum-accent-background-color-key-focus", - "ref": "var(--spectrum-accent-color-700)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "accent-color-100": { - "prop": "--spectrum-accent-color-100", - "ref": "var(--spectrum-blue-100)", - "light": { - "value": "rgb(245, 249, 255)" - }, - "dark": { - "value": "rgb(14, 23, 63)" - } - }, - "accent-color-1000": { - "prop": "--spectrum-accent-color-1000", - "ref": "var(--spectrum-blue-1000)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "accent-color-1100": { - "prop": "--spectrum-accent-color-1100", - "ref": "var(--spectrum-blue-1100)", - "light": { - "value": "rgb(29, 62, 207)" - }, - "dark": { - "value": "rgb(124, 169, 252)" - } - }, - "accent-color-1200": { - "prop": "--spectrum-accent-color-1200", - "ref": "var(--spectrum-blue-1200)", - "light": { - "value": "rgb(21, 50, 173)" - }, - "dark": { - "value": "rgb(152, 192, 252)" - } - }, - "accent-color-1300": { - "prop": "--spectrum-accent-color-1300", - "ref": "var(--spectrum-blue-1300)", - "light": { - "value": "rgb(16, 40, 140)" - }, - "dark": { - "value": "rgb(181, 213, 253)" - } - }, - "accent-color-1400": { - "prop": "--spectrum-accent-color-1400", - "ref": "var(--spectrum-blue-1400)", - "light": { - "value": "rgb(12, 31, 105)" - }, - "dark": { - "value": "rgb(213, 231, 254)" - } - }, - "accent-color-1500": { - "prop": "--spectrum-accent-color-1500", - "ref": "var(--spectrum-blue-1500)", - "dark": { - "value": "rgb(238, 245, 255)" - }, - "light": { - "value": "rgb(14, 24, 67)" - } - }, - "accent-color-1600": { - "prop": "--spectrum-accent-color-1600", - "ref": "var(--spectrum-blue-1600)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(7, 11, 30)" - } - }, - "accent-color-200": { - "prop": "--spectrum-accent-color-200", - "ref": "var(--spectrum-blue-200)", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(15, 28, 82)" - } - }, - "accent-color-300": { - "prop": "--spectrum-accent-color-300", - "ref": "var(--spectrum-blue-300)", - "light": { - "value": "rgb(203, 226, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "accent-color-400": { - "prop": "--spectrum-accent-color-400", - "ref": "var(--spectrum-blue-400)", - "light": { - "value": "rgb(172, 207, 253)" - }, - "dark": { - "value": "rgb(18, 45, 154)" - } - }, - "accent-color-500": { - "prop": "--spectrum-accent-color-500", - "ref": "var(--spectrum-blue-500)", - "light": { - "value": "rgb(142, 185, 252)" - }, - "dark": { - "value": "rgb(26, 58, 195)" - } - }, - "accent-color-600": { - "prop": "--spectrum-accent-color-600", - "ref": "var(--spectrum-blue-600)", - "light": { - "value": "rgb(114, 158, 253)" - }, - "dark": { - "value": "rgb(37, 73, 229)" - } - }, - "accent-color-700": { - "prop": "--spectrum-accent-color-700", - "ref": "var(--spectrum-blue-700)", - "light": { - "value": "rgb(93, 137, 255)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "accent-color-800": { - "prop": "--spectrum-accent-color-800", - "ref": "var(--spectrum-blue-800)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "accent-color-900": { - "prop": "--spectrum-accent-color-900", - "ref": "var(--spectrum-blue-900)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "accent-content-color-default": { - "prop": "--spectrum-accent-content-color-default", - "ref": "var(--spectrum-accent-color-900)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "accent-content-color-down": { - "prop": "--spectrum-accent-content-color-down", - "ref": "var(--spectrum-accent-color-1000)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "accent-content-color-hover": { - "prop": "--spectrum-accent-content-color-hover", - "ref": "var(--spectrum-accent-color-1000)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "accent-content-color-key-focus": { - "prop": "--spectrum-accent-content-color-key-focus", - "ref": "var(--spectrum-accent-color-1000)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "accent-content-color-selected": { - "prop": "--spectrum-accent-content-color-selected", - "ref": "var(--spectrum-accent-content-color-down)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "accent-subtle-background-color-default": { - "prop": "--spectrum-accent-subtle-background-color-default", - "ref": "var(--spectrum-accent-color-300)", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "accent-visual-color": { - "prop": "--spectrum-accent-visual-color", - "ref": "var(--spectrum-accent-color-900)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "accordion-bottom-to-text-compact-extra-large": { - "prop": "--spectrum-accordion-bottom-to-text-compact-extra-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "accordion-bottom-to-text-compact-large": { - "prop": "--spectrum-accordion-bottom-to-text-compact-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "9px" - } - }, - "accordion-bottom-to-text-compact-medium": { - "prop": "--spectrum-accordion-bottom-to-text-compact-medium", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "8px" - } - }, - "accordion-bottom-to-text-compact-small": { - "prop": "--spectrum-accordion-bottom-to-text-compact-small", - "desktop": { - "value": "2px" - }, - "mobile": { - "value": "4px" - } - }, - "accordion-bottom-to-text-regular-extra-large": { - "prop": "--spectrum-accordion-bottom-to-text-regular-extra-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "accordion-bottom-to-text-regular-large": { - "prop": "--spectrum-accordion-bottom-to-text-regular-large", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "accordion-bottom-to-text-regular-medium": { - "prop": "--spectrum-accordion-bottom-to-text-regular-medium", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "13px" - } - }, - "accordion-bottom-to-text-regular-small": { - "prop": "--spectrum-accordion-bottom-to-text-regular-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "accordion-bottom-to-text-spacious-extra-large": { - "prop": "--spectrum-accordion-bottom-to-text-spacious-extra-large", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "21px" - } - }, - "accordion-bottom-to-text-spacious-large": { - "prop": "--spectrum-accordion-bottom-to-text-spacious-large", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "accordion-bottom-to-text-spacious-medium": { - "prop": "--spectrum-accordion-bottom-to-text-spacious-medium", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "18px" - } - }, - "accordion-bottom-to-text-spacious-small": { - "prop": "--spectrum-accordion-bottom-to-text-spacious-small", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "accordion-content-area-bottom-to-content": { - "prop": "--spectrum-accordion-content-area-bottom-to-content", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "accordion-content-area-edge-to-content-extra-large": { - "prop": "--spectrum-accordion-content-area-edge-to-content-extra-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "accordion-content-area-edge-to-content-large": { - "prop": "--spectrum-accordion-content-area-edge-to-content-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "accordion-content-area-edge-to-content-medium": { - "prop": "--spectrum-accordion-content-area-edge-to-content-medium", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "accordion-content-area-edge-to-content-small": { - "prop": "--spectrum-accordion-content-area-edge-to-content-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "accordion-content-area-top-to-content": { - "prop": "--spectrum-accordion-content-area-top-to-content", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "accordion-disclosure-indicator-to-text": { - "prop": "--spectrum-accordion-disclosure-indicator-to-text", - "value": "0px" - }, - "accordion-disclosure-indicator-to-text-extra-large": { - "prop": "--spectrum-accordion-disclosure-indicator-to-text-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "accordion-disclosure-indicator-to-text-large": { - "prop": "--spectrum-accordion-disclosure-indicator-to-text-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "accordion-disclosure-indicator-to-text-medium": { - "prop": "--spectrum-accordion-disclosure-indicator-to-text-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "accordion-disclosure-indicator-to-text-small": { - "prop": "--spectrum-accordion-disclosure-indicator-to-text-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "accordion-edge-to-content-area-extra-large": { - "prop": "--spectrum-accordion-edge-to-content-area-extra-large", - "value": "17px" - }, - "accordion-edge-to-content-area-large": { - "prop": "--spectrum-accordion-edge-to-content-area-large", - "value": "14px" - }, - "accordion-edge-to-content-area-medium": { - "prop": "--spectrum-accordion-edge-to-content-area-medium", - "value": "11px" - }, - "accordion-edge-to-content-area-small": { - "prop": "--spectrum-accordion-edge-to-content-area-small", - "value": "7px" - }, - "accordion-edge-to-disclosure-indicator": { - "prop": "--spectrum-accordion-edge-to-disclosure-indicator", - "value": "0px" - }, - "accordion-edge-to-text": { - "prop": "--spectrum-accordion-edge-to-text", - "value": "0px" - }, - "accordion-focus-indicator-gap": { - "prop": "--spectrum-accordion-focus-indicator-gap", - "value": "0px" - }, - "accordion-item-to-divider": { - "prop": "--spectrum-accordion-item-to-divider", - "value": "0px" - }, - "accordion-minimum-width": { - "prop": "--spectrum-accordion-minimum-width", - "desktop": { - "value": "200px" - }, - "mobile": { - "value": "250px" - } - }, - "accordion-small-top-to-text-spacious": { - "prop": "--spectrum-accordion-small-top-to-text-spacious", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "accordion-top-to-text-compact-extra-large": { - "prop": "--spectrum-accordion-top-to-text-compact-extra-large", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "accordion-top-to-text-compact-large": { - "prop": "--spectrum-accordion-top-to-text-compact-large", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "7px" - } - }, - "accordion-top-to-text-compact-medium": { - "prop": "--spectrum-accordion-top-to-text-compact-medium", - "value": "4px" - }, - "accordion-top-to-text-compact-small": { - "prop": "--spectrum-accordion-top-to-text-compact-small", - "value": "2px" - }, - "accordion-top-to-text-regular-extra-large": { - "prop": "--spectrum-accordion-top-to-text-regular-extra-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "accordion-top-to-text-regular-large": { - "prop": "--spectrum-accordion-top-to-text-regular-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "accordion-top-to-text-regular-medium": { - "prop": "--spectrum-accordion-top-to-text-regular-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "9px" - } - }, - "accordion-top-to-text-regular-small": { - "prop": "--spectrum-accordion-top-to-text-regular-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "accordion-top-to-text-spacious-extra-large": { - "prop": "--spectrum-accordion-top-to-text-spacious-extra-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "14px" - } - }, - "accordion-top-to-text-spacious-large": { - "prop": "--spectrum-accordion-top-to-text-spacious-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "accordion-top-to-text-spacious-medium": { - "prop": "--spectrum-accordion-top-to-text-spacious-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "accordion-top-to-text-spacious-small": { - "prop": "--spectrum-accordion-top-to-text-spacious-small", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "action-bar-border-color": { - "prop": "--spectrum-action-bar-border-color", - "light": { - "ref": "var(--spectrum-transparent-white-25)", - "value": "rgba(255, 255, 255, 0)" - }, - "ref": "var(--spectrum-gray-400)", - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "action-bar-bottom-to-content-area": { - "prop": "--spectrum-action-bar-bottom-to-content-area", - "ref": "var(--spectrum-spacing-200)", - "value": "12px" - }, - "action-bar-close-button-to-counter": { - "prop": "--spectrum-action-bar-close-button-to-counter", - "ref": "var(--spectrum-text-to-control-50)", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "action-bar-counter-font-size": { - "prop": "--spectrum-action-bar-counter-font-size", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "action-bar-edge-to-content-area": { - "prop": "--spectrum-action-bar-edge-to-content-area", - "ref": "var(--spectrum-spacing-100)", - "value": "8px" - }, - "action-bar-height": { - "prop": "--spectrum-action-bar-height", - "ref": "var(--spectrum-component-height-400)", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "action-bar-label-to-action-group-area": { - "prop": "--spectrum-action-bar-label-to-action-group-area", - "ref": "var(--spectrum-spacing-300)", - "value": "16px" - }, - "action-bar-minimum-width": { - "prop": "--spectrum-action-bar-minimum-width", - "value": "176px" - }, - "action-bar-top-to-content-area": { - "prop": "--spectrum-action-bar-top-to-content-area", - "ref": "var(--spectrum-spacing-200)", - "value": "12px" - }, - "action-bar-top-to-item-counter": { - "prop": "--spectrum-action-bar-top-to-item-counter", - "ref": "var(--spectrum-component-top-to-text-300)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "action-button-edge-to-hold-icon-extra-large": { - "prop": "--spectrum-action-button-edge-to-hold-icon-extra-large", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "action-button-edge-to-hold-icon-extra-small": { - "prop": "--spectrum-action-button-edge-to-hold-icon-extra-small", - "value": "3px" - }, - "action-button-edge-to-hold-icon-large": { - "prop": "--spectrum-action-button-edge-to-hold-icon-large", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "action-button-edge-to-hold-icon-medium": { - "prop": "--spectrum-action-button-edge-to-hold-icon-medium", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "action-button-edge-to-hold-icon-small": { - "prop": "--spectrum-action-button-edge-to-hold-icon-small", - "value": "3px" - }, - "alert-banner-bottom-to-text": { - "prop": "--spectrum-alert-banner-bottom-to-text", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "alert-banner-minimum-height": { - "prop": "--spectrum-alert-banner-minimum-height", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "64px" - } - }, - "alert-banner-to-bottom-text": { - "prop": "--spectrum-alert-banner-to-bottom-text", - "ref": "var(--spectrum-alert-banner-bottom-to-text)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "alert-banner-to-top-text": { - "prop": "--spectrum-alert-banner-to-top-text", - "ref": "var(--spectrum-alert-banner-top-to-text)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "21px" - } - }, - "alert-banner-to-top-workflow-icon": { - "prop": "--spectrum-alert-banner-to-top-workflow-icon", - "ref": "var(--spectrum-alert-banner-top-to-workflow-icon)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "20px" - } - }, - "alert-banner-top-to-alert-icon": { - "prop": "--spectrum-alert-banner-top-to-alert-icon", - "desktop": { - "value": "37px" - }, - "mobile": { - "value": "29px" - } - }, - "alert-banner-top-to-text": { - "prop": "--spectrum-alert-banner-top-to-text", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "21px" - } - }, - "alert-banner-top-to-workflow-icon": { - "prop": "--spectrum-alert-banner-top-to-workflow-icon", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "20px" - } - }, - "alert-banner-width": { - "prop": "--spectrum-alert-banner-width", - "desktop": { - "value": "832px" - }, - "mobile": { - "value": "680px" - } - }, - "alert-dialog-description-font-size": { - "prop": "--spectrum-alert-dialog-description-font-size", - "ref": "var(--spectrum-body-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "alert-dialog-description-size": { - "prop": "--spectrum-alert-dialog-description-size", - "ref": "var(--spectrum-body-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "alert-dialog-maximum-width": { - "prop": "--spectrum-alert-dialog-maximum-width", - "value": "480px" - }, - "alert-dialog-minimum-width": { - "prop": "--spectrum-alert-dialog-minimum-width", - "value": "288px" - }, - "alert-dialog-title-font-size": { - "prop": "--spectrum-alert-dialog-title-font-size", - "ref": "var(--spectrum-title-size-xl)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "24px" - } - }, - "alert-dialog-title-size": { - "prop": "--spectrum-alert-dialog-title-size", - "ref": "var(--spectrum-title-size-xl)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "24px" - } - }, - "android-elevation": { - "prop": "--spectrum-android-elevation", - "value": "2dp" - }, - "arrow-icon-size-100": { - "prop": "--spectrum-arrow-icon-size-100", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "arrow-icon-size-200": { - "prop": "--spectrum-arrow-icon-size-200", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "arrow-icon-size-300": { - "prop": "--spectrum-arrow-icon-size-300", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "arrow-icon-size-400": { - "prop": "--spectrum-arrow-icon-size-400", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "arrow-icon-size-500": { - "prop": "--spectrum-arrow-icon-size-500", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "arrow-icon-size-600": { - "prop": "--spectrum-arrow-icon-size-600", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "arrow-icon-size-75": { - "prop": "--spectrum-arrow-icon-size-75", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "asterisk-icon-size-100": { - "prop": "--spectrum-asterisk-icon-size-100", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "asterisk-icon-size-200": { - "prop": "--spectrum-asterisk-icon-size-200", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "asterisk-icon-size-300": { - "prop": "--spectrum-asterisk-icon-size-300", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "asterisk-icon-size-75": { - "prop": "--spectrum-asterisk-icon-size-75", - "value": "8px" - }, - "avatar-border-color": { - "prop": "--spectrum-avatar-border-color", - "ref": "var(--spectrum-gray-25)", - "dark": { - "value": "rgb(17, 17, 17)" - }, - "light": { - "value": "rgb(255, 255, 255)" - } - }, - "avatar-border-width": { - "prop": "--spectrum-avatar-border-width", - "ref": "var(--spectrum-border-width-100)", - "value": "1px" - }, - "avatar-group-size-100": { - "prop": "--spectrum-avatar-group-size-100", - "ref": "var(--spectrum-avatar-size-100)", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "28px" - } - }, - "avatar-group-size-200": { - "prop": "--spectrum-avatar-group-size-200", - "ref": "var(--spectrum-avatar-size-200)", - "desktop": { - "value": "28px" - }, - "mobile": { - "value": "32px" - } - }, - "avatar-group-size-300": { - "prop": "--spectrum-avatar-group-size-300", - "ref": "var(--spectrum-avatar-size-300)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "36px" - } - }, - "avatar-group-size-400": { - "prop": "--spectrum-avatar-group-size-400", - "ref": "var(--spectrum-avatar-size-400)", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "40px" - } - }, - "avatar-group-size-50": { - "prop": "--spectrum-avatar-group-size-50", - "ref": "var(--spectrum-avatar-size-50)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "avatar-group-size-500": { - "prop": "--spectrum-avatar-group-size-500", - "ref": "var(--spectrum-avatar-size-500)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "44px" - } - }, - "avatar-group-size-75": { - "prop": "--spectrum-avatar-group-size-75", - "ref": "var(--spectrum-avatar-size-75)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "avatar-opacity-disabled": { - "prop": "--spectrum-avatar-opacity-disabled", - "ref": "var(--spectrum-opacity-disabled)", - "value": "0.3" - }, - "avatar-size-100": { - "prop": "--spectrum-avatar-size-100", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "28px" - } - }, - "avatar-size-1000": { - "prop": "--spectrum-avatar-size-1000", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "72px" - } - }, - "avatar-size-1100": { - "prop": "--spectrum-avatar-size-1100", - "desktop": { - "value": "72px" - }, - "mobile": { - "value": "80px" - } - }, - "avatar-size-1200": { - "prop": "--spectrum-avatar-size-1200", - "desktop": { - "value": "80px" - }, - "mobile": { - "value": "88px" - } - }, - "avatar-size-1300": { - "prop": "--spectrum-avatar-size-1300", - "desktop": { - "value": "88px" - }, - "mobile": { - "value": "96px" - } - }, - "avatar-size-1400": { - "prop": "--spectrum-avatar-size-1400", - "desktop": { - "value": "96px" - }, - "mobile": { - "value": "104px" - } - }, - "avatar-size-1500": { - "prop": "--spectrum-avatar-size-1500", - "desktop": { - "value": "104px" - }, - "mobile": { - "value": "112px" - } - }, - "avatar-size-200": { - "prop": "--spectrum-avatar-size-200", - "desktop": { - "value": "28px" - }, - "mobile": { - "value": "32px" - } - }, - "avatar-size-300": { - "prop": "--spectrum-avatar-size-300", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "36px" - } - }, - "avatar-size-400": { - "prop": "--spectrum-avatar-size-400", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "40px" - } - }, - "avatar-size-50": { - "prop": "--spectrum-avatar-size-50", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "avatar-size-500": { - "prop": "--spectrum-avatar-size-500", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "44px" - } - }, - "avatar-size-600": { - "prop": "--spectrum-avatar-size-600", - "desktop": { - "value": "44px" - }, - "mobile": { - "value": "48px" - } - }, - "avatar-size-700": { - "prop": "--spectrum-avatar-size-700", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "52px" - } - }, - "avatar-size-75": { - "prop": "--spectrum-avatar-size-75", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "avatar-size-800": { - "prop": "--spectrum-avatar-size-800", - "desktop": { - "value": "52px" - }, - "mobile": { - "value": "56px" - } - }, - "avatar-size-900": { - "prop": "--spectrum-avatar-size-900", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "64px" - } - }, - "avatar-to-avatar-100": { - "prop": "--spectrum-avatar-to-avatar-100", - "desktop": { - "value": "-6px" - }, - "mobile": { - "value": "-7px" - } - }, - "avatar-to-avatar-200": { - "prop": "--spectrum-avatar-to-avatar-200", - "desktop": { - "value": "-7px" - }, - "mobile": { - "value": "-8px" - } - }, - "avatar-to-avatar-300": { - "prop": "--spectrum-avatar-to-avatar-300", - "desktop": { - "value": "-8px" - }, - "mobile": { - "value": "-9px" - } - }, - "avatar-to-avatar-400": { - "prop": "--spectrum-avatar-to-avatar-400", - "desktop": { - "value": "-9px" - }, - "mobile": { - "value": "-10px" - } - }, - "avatar-to-avatar-50": { - "prop": "--spectrum-avatar-to-avatar-50", - "desktop": { - "value": "-4px" - }, - "mobile": { - "value": "-5px" - } - }, - "avatar-to-avatar-500": { - "prop": "--spectrum-avatar-to-avatar-500", - "desktop": { - "value": "-10px" - }, - "mobile": { - "value": "-11px" - } - }, - "avatar-to-avatar-75": { - "prop": "--spectrum-avatar-to-avatar-75", - "desktop": { - "value": "-5px" - }, - "mobile": { - "value": "-6px" - } - }, - "background-base-color": { - "prop": "--spectrum-background-base-color", - "ref": "var(--spectrum-gray-25)", - "dark": { - "value": "rgb(17, 17, 17)" - }, - "light": { - "value": "rgb(255, 255, 255)" - } - }, - "background-elevated-color": { - "prop": "--spectrum-background-elevated-color", - "ref": "var(--spectrum-gray-25)", - "dark": { - "value": "rgb(34, 34, 34)" - }, - "light": { - "value": "rgb(255, 255, 255)" - } - }, - "background-layer-1-color": { - "prop": "--spectrum-background-layer-1-color", - "ref": "var(--spectrum-gray-50)", - "light": { - "value": "rgb(248, 248, 248)" - }, - "dark": { - "value": "rgb(27, 27, 27)" - } - }, - "background-layer-2-color": { - "prop": "--spectrum-background-layer-2-color", - "ref": "var(--spectrum-gray-75)", - "light": { - "value": "rgb(255, 255, 255)" - }, - "dark": { - "value": "rgb(34, 34, 34)" - } - }, - "background-opacity-default": { - "prop": "--spectrum-background-opacity-default", - "value": "0" - }, - "background-opacity-down": { - "prop": "--spectrum-background-opacity-down", - "value": "0.1" - }, - "background-opacity-hover": { - "prop": "--spectrum-background-opacity-hover", - "value": "0.1" - }, - "background-opacity-key-focus": { - "prop": "--spectrum-background-opacity-key-focus", - "value": "0.1" - }, - "background-pasteboard-color": { - "prop": "--spectrum-background-pasteboard-color", - "ref": "var(--spectrum-gray-100)", - "dark": { - "value": "rgb(17, 17, 17)" - }, - "light": { - "value": "rgb(233, 233, 233)" - } - }, - "bar-panel-gripper-color": { - "prop": "--spectrum-bar-panel-gripper-color", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(225, 225, 225)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "bar-panel-gripper-color-drag": { - "prop": "--spectrum-bar-panel-gripper-color-drag", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "bar-panel-maximum-width": { - "prop": "--spectrum-bar-panel-maximum-width", - "value": "72px" - }, - "bar-panel-minimum-width": { - "prop": "--spectrum-bar-panel-minimum-width", - "value": "40px" - }, - "bar-panel-spacing-extra-spacious": { - "prop": "--spectrum-bar-panel-spacing-extra-spacious", - "value": "20px" - }, - "bar-panel-width": { - "prop": "--spectrum-bar-panel-width", - "value": "56px" - }, - "black": { - "prop": "--spectrum-black", - "value": "rgb(0, 0, 0)" - }, - "black-font-weight": { - "prop": "--spectrum-black-font-weight", - "ref": "black", - "value": "900" - }, - "blue-100": { - "prop": "--spectrum-blue-100", - "light": { - "value": "rgb(245, 249, 255)" - }, - "dark": { - "value": "rgb(14, 23, 63)" - } - }, - "blue-1000": { - "prop": "--spectrum-blue-1000", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "blue-1100": { - "prop": "--spectrum-blue-1100", - "light": { - "value": "rgb(29, 62, 207)" - }, - "dark": { - "value": "rgb(124, 169, 252)" - } - }, - "blue-1200": { - "prop": "--spectrum-blue-1200", - "light": { - "value": "rgb(21, 50, 173)" - }, - "dark": { - "value": "rgb(152, 192, 252)" - } - }, - "blue-1300": { - "prop": "--spectrum-blue-1300", - "light": { - "value": "rgb(16, 40, 140)" - }, - "dark": { - "value": "rgb(181, 213, 253)" - } - }, - "blue-1400": { - "prop": "--spectrum-blue-1400", - "light": { - "value": "rgb(12, 31, 105)" - }, - "dark": { - "value": "rgb(213, 231, 254)" - } - }, - "blue-1500": { - "prop": "--spectrum-blue-1500", - "dark": { - "value": "rgb(238, 245, 255)" - }, - "light": { - "value": "rgb(14, 24, 67)" - } - }, - "blue-1600": { - "prop": "--spectrum-blue-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(7, 11, 30)" - } - }, - "blue-200": { - "prop": "--spectrum-blue-200", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(15, 28, 82)" - } - }, - "blue-300": { - "prop": "--spectrum-blue-300", - "light": { - "value": "rgb(203, 226, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "blue-400": { - "prop": "--spectrum-blue-400", - "light": { - "value": "rgb(172, 207, 253)" - }, - "dark": { - "value": "rgb(18, 45, 154)" - } - }, - "blue-500": { - "prop": "--spectrum-blue-500", - "light": { - "value": "rgb(142, 185, 252)" - }, - "dark": { - "value": "rgb(26, 58, 195)" - } - }, - "blue-600": { - "prop": "--spectrum-blue-600", - "light": { - "value": "rgb(114, 158, 253)" - }, - "dark": { - "value": "rgb(37, 73, 229)" - } - }, - "blue-700": { - "prop": "--spectrum-blue-700", - "light": { - "value": "rgb(93, 137, 255)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "blue-800": { - "prop": "--spectrum-blue-800", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "blue-900": { - "prop": "--spectrum-blue-900", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "blue-background-color-default": { - "prop": "--spectrum-blue-background-color-default", - "ref": "var(--spectrum-blue-800)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "blue-subtle-background-color-default": { - "prop": "--spectrum-blue-subtle-background-color-default", - "ref": "var(--spectrum-blue-300)", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "blue-visual-color": { - "prop": "--spectrum-blue-visual-color", - "ref": "var(--spectrum-blue-900)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "body-cjk-emphasized-font-style": { - "prop": "--spectrum-body-cjk-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-cjk-emphasized-font-weight": { - "prop": "--spectrum-body-cjk-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "body-cjk-font-family": { - "prop": "--spectrum-body-cjk-font-family", - "ref": "var(--spectrum-cjk-font-family)", - "value": "Adobe Clean Han" - }, - "body-cjk-font-style": { - "prop": "--spectrum-body-cjk-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-cjk-font-weight": { - "prop": "--spectrum-body-cjk-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "body-cjk-line-height": { - "prop": "--spectrum-body-cjk-line-height", - "ref": "var(--spectrum-cjk-line-height-200)", - "value": 1.7 - }, - "body-cjk-size-l": { - "prop": "--spectrum-body-cjk-size-l", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "body-cjk-size-m": { - "prop": "--spectrum-body-cjk-size-m", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "body-cjk-size-s": { - "prop": "--spectrum-body-cjk-size-s", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "body-cjk-size-xl": { - "prop": "--spectrum-body-cjk-size-xl", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "body-cjk-size-xs": { - "prop": "--spectrum-body-cjk-size-xs", - "ref": "var(--spectrum-font-size-50)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "body-cjk-size-xxl": { - "prop": "--spectrum-body-cjk-size-xxl", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "body-cjk-size-xxs": { - "prop": "--spectrum-body-cjk-size-xxs", - "ref": "var(--spectrum-font-size-25)", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "body-cjk-size-xxxl": { - "prop": "--spectrum-body-cjk-size-xxxl", - "ref": "var(--spectrum-font-size-500)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "27px" - } - }, - "body-cjk-strong-emphasized-font-style": { - "prop": "--spectrum-body-cjk-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-cjk-strong-emphasized-font-weight": { - "prop": "--spectrum-body-cjk-strong-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "body-cjk-strong-font-style": { - "prop": "--spectrum-body-cjk-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-cjk-strong-font-weight": { - "prop": "--spectrum-body-cjk-strong-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "body-color": { - "prop": "--spectrum-body-color", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "body-line-height": { - "prop": "--spectrum-body-line-height", - "ref": "var(--spectrum-line-height-200)", - "value": 1.5 - }, - "body-margin-multiplier": { - "prop": "--spectrum-body-margin-multiplier", - "value": 0.75 - }, - "body-sans-serif-emphasized-font-style": { - "prop": "--spectrum-body-sans-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "body-sans-serif-emphasized-font-weight": { - "prop": "--spectrum-body-sans-serif-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "body-sans-serif-font-family": { - "prop": "--spectrum-body-sans-serif-font-family", - "ref": "var(--spectrum-sans-serif-font-family)", - "value": "Adobe Clean" - }, - "body-sans-serif-font-style": { - "prop": "--spectrum-body-sans-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-sans-serif-font-weight": { - "prop": "--spectrum-body-sans-serif-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "body-sans-serif-strong-emphasized-font-style": { - "prop": "--spectrum-body-sans-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "body-sans-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-body-sans-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "body-sans-serif-strong-font-style": { - "prop": "--spectrum-body-sans-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-sans-serif-strong-font-weight": { - "prop": "--spectrum-body-sans-serif-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "body-serif-emphasized-font-style": { - "prop": "--spectrum-body-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "body-serif-emphasized-font-weight": { - "prop": "--spectrum-body-serif-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "body-serif-font-family": { - "prop": "--spectrum-body-serif-font-family", - "ref": "var(--spectrum-serif-font-family)", - "value": "Adobe Clean Serif" - }, - "body-serif-font-style": { - "prop": "--spectrum-body-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-serif-font-weight": { - "prop": "--spectrum-body-serif-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "body-serif-strong-emphasized-font-style": { - "prop": "--spectrum-body-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "body-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-body-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "body-serif-strong-font-style": { - "prop": "--spectrum-body-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "body-serif-strong-font-weight": { - "prop": "--spectrum-body-serif-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "body-size-l": { - "prop": "--spectrum-body-size-l", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "body-size-m": { - "prop": "--spectrum-body-size-m", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "body-size-s": { - "prop": "--spectrum-body-size-s", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "body-size-xl": { - "prop": "--spectrum-body-size-xl", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "body-size-xs": { - "prop": "--spectrum-body-size-xs", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "body-size-xxl": { - "prop": "--spectrum-body-size-xxl", - "ref": "var(--spectrum-font-size-500)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "27px" - } - }, - "body-size-xxs": { - "prop": "--spectrum-body-size-xxs", - "ref": "var(--spectrum-font-size-50)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "body-size-xxxl": { - "prop": "--spectrum-body-size-xxxl", - "ref": "var(--spectrum-font-size-600)", - "desktop": { - "value": "25px" - }, - "mobile": { - "value": "31px" - } - }, - "bold-font-weight": { - "prop": "--spectrum-bold-font-weight", - "ref": "bold", - "value": "700" - }, - "border-width-100": { - "prop": "--spectrum-border-width-100", - "value": "1px" - }, - "border-width-200": { - "prop": "--spectrum-border-width-200", - "value": "2px" - }, - "border-width-400": { - "prop": "--spectrum-border-width-400", - "value": "4px" - }, - "breadcrumbs-bottom-to-text": { - "prop": "--spectrum-breadcrumbs-bottom-to-text", - "ref": "var(--spectrum-component-bottom-to-text-200)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "breadcrumbs-bottom-to-text-compact": { - "prop": "--spectrum-breadcrumbs-bottom-to-text-compact", - "ref": "var(--spectrum-component-bottom-to-text-100)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "breadcrumbs-bottom-to-text-multiline": { - "prop": "--spectrum-breadcrumbs-bottom-to-text-multiline", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "breadcrumbs-end-edge-to-text": { - "prop": "--spectrum-breadcrumbs-end-edge-to-text", - "value": "0px" - }, - "breadcrumbs-height": { - "prop": "--spectrum-breadcrumbs-height", - "ref": "var(--spectrum-component-height-200)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "breadcrumbs-height-compact": { - "prop": "--spectrum-breadcrumbs-height-compact", - "ref": "var(--spectrum-component-height-100)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "breadcrumbs-height-multiline": { - "prop": "--spectrum-breadcrumbs-height-multiline", - "desktop": { - "value": "72px" - }, - "mobile": { - "value": "90px" - } - }, - "breadcrumbs-separator-icon-to-bottom-text-multiline": { - "prop": "--spectrum-breadcrumbs-separator-icon-to-bottom-text-multiline", - "ref": "var(--spectrum-breadcrumbs-separator-to-bottom-text-multiline)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "breadcrumbs-separator-to-bottom-text-multiline": { - "prop": "--spectrum-breadcrumbs-separator-to-bottom-text-multiline", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "breadcrumbs-start-edge-to-text": { - "prop": "--spectrum-breadcrumbs-start-edge-to-text", - "ref": "var(--spectrum-breadcrumbs-start-edge-to-text-large)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "breadcrumbs-start-edge-to-text-large": { - "prop": "--spectrum-breadcrumbs-start-edge-to-text-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "breadcrumbs-start-edge-to-text-medium": { - "prop": "--spectrum-breadcrumbs-start-edge-to-text-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "breadcrumbs-start-edge-to-text-multiline": { - "prop": "--spectrum-breadcrumbs-start-edge-to-text-multiline", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "breadcrumbs-start-edge-to-truncated-menu": { - "prop": "--spectrum-breadcrumbs-start-edge-to-truncated-menu", - "value": "0px" - }, - "breadcrumbs-text-to-separator-large": { - "prop": "--spectrum-breadcrumbs-text-to-separator-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "breadcrumbs-text-to-separator-medium": { - "prop": "--spectrum-breadcrumbs-text-to-separator-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "breadcrumbs-text-to-separator-multiline": { - "prop": "--spectrum-breadcrumbs-text-to-separator-multiline", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "breadcrumbs-top-text-to-bottom-text": { - "prop": "--spectrum-breadcrumbs-top-text-to-bottom-text", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "breadcrumbs-top-to-separator-icon": { - "prop": "--spectrum-breadcrumbs-top-to-separator-icon", - "ref": "var(--spectrum-breadcrumbs-top-to-separator-large)", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "20px" - } - }, - "breadcrumbs-top-to-separator-icon-compact": { - "prop": "--spectrum-breadcrumbs-top-to-separator-icon-compact", - "ref": "var(--spectrum-breadcrumbs-top-to-separator-medium)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "breadcrumbs-top-to-separator-icon-multiline": { - "prop": "--spectrum-breadcrumbs-top-to-separator-icon-multiline", - "ref": "var(--spectrum-breadcrumbs-separator-icon-to-bottom-text-multiline)", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "15px" - } - }, - "breadcrumbs-top-to-separator-large": { - "prop": "--spectrum-breadcrumbs-top-to-separator-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "20px" - } - }, - "breadcrumbs-top-to-separator-medium": { - "prop": "--spectrum-breadcrumbs-top-to-separator-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "breadcrumbs-top-to-separator-multiline": { - "prop": "--spectrum-breadcrumbs-top-to-separator-multiline", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "10px" - } - }, - "breadcrumbs-top-to-text": { - "prop": "--spectrum-breadcrumbs-top-to-text", - "ref": "var(--spectrum-component-top-to-text-200)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "breadcrumbs-top-to-text-compact": { - "prop": "--spectrum-breadcrumbs-top-to-text-compact", - "ref": "var(--spectrum-component-top-to-text-100)", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "breadcrumbs-top-to-text-multiline": { - "prop": "--spectrum-breadcrumbs-top-to-text-multiline", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "breadcrumbs-top-to-truncated-menu": { - "prop": "--spectrum-breadcrumbs-top-to-truncated-menu", - "value": "0px" - }, - "breadcrumbs-top-to-truncated-menu-compact": { - "prop": "--spectrum-breadcrumbs-top-to-truncated-menu-compact", - "ref": "var(--spectrum-breadcrumbs-top-to-truncated-menu)", - "value": "0px" - }, - "breadcrumbs-truncated-menu-to-bottom-text": { - "prop": "--spectrum-breadcrumbs-truncated-menu-to-bottom-text", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "breadcrumbs-truncated-menu-to-separator": { - "prop": "--spectrum-breadcrumbs-truncated-menu-to-separator", - "value": "0px" - }, - "breadcrumbs-truncated-menu-to-separator-icon": { - "prop": "--spectrum-breadcrumbs-truncated-menu-to-separator-icon", - "ref": "var(--spectrum-breadcrumbs-truncated-menu-to-separator)", - "value": "0px" - }, - "brown-100": { - "prop": "--spectrum-brown-100", - "dark": { - "value": "rgb(35, 24, 8)" - }, - "light": { - "value": "rgb(252, 247, 242)" - } - }, - "brown-1000": { - "prop": "--spectrum-brown-1000", - "dark": { - "value": "rgb(181, 147, 98)" - }, - "light": { - "value": "rgb(119, 91, 50)" - } - }, - "brown-1100": { - "prop": "--spectrum-brown-1100", - "dark": { - "value": "rgb(199, 163, 112)" - }, - "light": { - "value": "rgb(103, 76, 35)" - } - }, - "brown-1200": { - "prop": "--spectrum-brown-1200", - "dark": { - "value": "rgb(222, 185, 130)" - }, - "light": { - "value": "rgb(88, 61, 21)" - } - }, - "brown-1300": { - "prop": "--spectrum-brown-1300", - "dark": { - "value": "rgb(232, 207, 169)" - }, - "light": { - "value": "rgb(70, 49, 17)" - } - }, - "brown-1400": { - "prop": "--spectrum-brown-1400", - "dark": { - "value": "rgb(242, 227, 206)" - }, - "light": { - "value": "rgb(52, 37, 13)" - } - }, - "brown-1500": { - "prop": "--spectrum-brown-1500", - "dark": { - "value": "rgb(250, 244, 236)" - }, - "light": { - "value": "rgb(38, 26, 9)" - } - }, - "brown-1600": { - "prop": "--spectrum-brown-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(16, 12, 4)" - } - }, - "brown-200": { - "prop": "--spectrum-brown-200", - "dark": { - "value": "rgb(44, 31, 11)" - }, - "light": { - "value": "rgb(247, 238, 225)" - } - }, - "brown-300": { - "prop": "--spectrum-brown-300", - "dark": { - "value": "rgb(58, 40, 14)" - }, - "light": { - "value": "rgb(239, 221, 195)" - } - }, - "brown-400": { - "prop": "--spectrum-brown-400", - "dark": { - "value": "rgb(78, 55, 19)" - }, - "light": { - "value": "rgb(229, 200, 157)" - } - }, - "brown-500": { - "prop": "--spectrum-brown-500", - "dark": { - "value": "rgb(98, 71, 30)" - }, - "light": { - "value": "rgb(214, 177, 123)" - } - }, - "brown-600": { - "prop": "--spectrum-brown-600", - "dark": { - "value": "rgb(115, 88, 47)" - }, - "light": { - "value": "rgb(190, 155, 104)" - } - }, - "brown-700": { - "prop": "--spectrum-brown-700", - "dark": { - "value": "rgb(132, 104, 61)" - }, - "light": { - "value": "rgb(171, 138, 90)" - } - }, - "brown-800": { - "prop": "--spectrum-brown-800", - "dark": { - "value": "rgb(143, 114, 69)" - }, - "light": { - "value": "rgb(154, 123, 77)" - } - }, - "brown-900": { - "prop": "--spectrum-brown-900", - "dark": { - "value": "rgb(163, 132, 84)" - }, - "light": { - "value": "rgb(139, 109, 66)" - } - }, - "brown-background-color-default": { - "prop": "--spectrum-brown-background-color-default", - "ref": "var(--spectrum-brown-800)", - "light": { - "value": "rgb(139, 109, 66)" - }, - "dark": { - "value": "rgb(143, 114, 69)" - } - }, - "brown-subtle-background-color-default": { - "prop": "--spectrum-brown-subtle-background-color-default", - "ref": "var(--spectrum-brown-300)", - "light": { - "value": "rgb(247, 238, 225)" - }, - "dark": { - "value": "rgb(58, 40, 14)" - } - }, - "brown-visual-color": { - "prop": "--spectrum-brown-visual-color", - "ref": "var(--spectrum-brown-900)", - "light": { - "value": "rgb(154, 123, 77)" - }, - "dark": { - "value": "rgb(163, 132, 84)" - } - }, - "button-minimum-width-multiplier": { - "prop": "--spectrum-button-minimum-width-multiplier", - "value": 2.25 - }, - "card-background-loading-color": { - "prop": "--spectrum-card-background-loading-color", - "ref": "var(--spectrum-gray-100)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "card-background-well-color": { - "prop": "--spectrum-card-background-well-color", - "ref": "var(--spectrum-gray-100)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "card-default-width-extra-large": { - "prop": "--spectrum-card-default-width-extra-large", - "value": "400px" - }, - "card-default-width-extra-small": { - "prop": "--spectrum-card-default-width-extra-small", - "value": "120px" - }, - "card-default-width-large": { - "prop": "--spectrum-card-default-width-large", - "value": "320px" - }, - "card-default-width-medium": { - "prop": "--spectrum-card-default-width-medium", - "value": "240px" - }, - "card-default-width-small": { - "prop": "--spectrum-card-default-width-small", - "value": "180px" - }, - "card-description-to-footer": { - "prop": "--spectrum-card-description-to-footer", - "ref": "var(--spectrum-spacing-300)", - "value": "16px" - }, - "card-edge-to-content-compact-extra-large": { - "prop": "--spectrum-card-edge-to-content-compact-extra-large", - "value": "20px" - }, - "card-edge-to-content-compact-extra-small": { - "prop": "--spectrum-card-edge-to-content-compact-extra-small", - "value": "6px" - }, - "card-edge-to-content-compact-large": { - "prop": "--spectrum-card-edge-to-content-compact-large", - "value": "16px" - }, - "card-edge-to-content-compact-medium": { - "prop": "--spectrum-card-edge-to-content-compact-medium", - "value": "12px" - }, - "card-edge-to-content-compact-small": { - "prop": "--spectrum-card-edge-to-content-compact-small", - "value": "8px" - }, - "card-edge-to-content-default-extra-large": { - "prop": "--spectrum-card-edge-to-content-default-extra-large", - "value": "24px" - }, - "card-edge-to-content-default-extra-small": { - "prop": "--spectrum-card-edge-to-content-default-extra-small", - "value": "8px" - }, - "card-edge-to-content-default-large": { - "prop": "--spectrum-card-edge-to-content-default-large", - "value": "20px" - }, - "card-edge-to-content-default-medium": { - "prop": "--spectrum-card-edge-to-content-default-medium", - "value": "16px" - }, - "card-edge-to-content-default-small": { - "prop": "--spectrum-card-edge-to-content-default-small", - "value": "12px" - }, - "card-edge-to-content-spacious-extra-large": { - "prop": "--spectrum-card-edge-to-content-spacious-extra-large", - "value": "28px" - }, - "card-edge-to-content-spacious-extra-small": { - "prop": "--spectrum-card-edge-to-content-spacious-extra-small", - "value": "12px" - }, - "card-edge-to-content-spacious-large": { - "prop": "--spectrum-card-edge-to-content-spacious-large", - "value": "24px" - }, - "card-edge-to-content-spacious-medium": { - "prop": "--spectrum-card-edge-to-content-spacious-medium", - "value": "20px" - }, - "card-edge-to-content-spacious-small": { - "prop": "--spectrum-card-edge-to-content-spacious-small", - "value": "16px" - }, - "card-header-to-description": { - "prop": "--spectrum-card-header-to-description", - "ref": "var(--spectrum-spacing-75)", - "value": "4px" - }, - "card-horizontal-edge-to-content-compact": { - "prop": "--spectrum-card-horizontal-edge-to-content-compact", - "value": "12px" - }, - "card-horizontal-edge-to-content-default": { - "prop": "--spectrum-card-horizontal-edge-to-content-default", - "value": "16px" - }, - "card-horizontal-edge-to-content-spacious": { - "prop": "--spectrum-card-horizontal-edge-to-content-spacious", - "value": "20px" - }, - "card-maximum-width-extra-large": { - "prop": "--spectrum-card-maximum-width-extra-large", - "value": "460px" - }, - "card-maximum-width-extra-small": { - "prop": "--spectrum-card-maximum-width-extra-small", - "value": "140px" - }, - "card-maximum-width-large": { - "prop": "--spectrum-card-maximum-width-large", - "value": "370px" - }, - "card-maximum-width-medium": { - "prop": "--spectrum-card-maximum-width-medium", - "value": "280px" - }, - "card-maximum-width-small": { - "prop": "--spectrum-card-maximum-width-small", - "value": "210px" - }, - "card-minimum-height-extra-large": { - "prop": "--spectrum-card-minimum-height-extra-large", - "value": "300px" - }, - "card-minimum-height-extra-small": { - "prop": "--spectrum-card-minimum-height-extra-small", - "value": "90px" - }, - "card-minimum-height-large": { - "prop": "--spectrum-card-minimum-height-large", - "value": "240px" - }, - "card-minimum-height-medium": { - "prop": "--spectrum-card-minimum-height-medium", - "value": "180px" - }, - "card-minimum-height-small": { - "prop": "--spectrum-card-minimum-height-small", - "value": "135px" - }, - "card-minimum-width": { - "prop": "--spectrum-card-minimum-width", - "value": "100px" - }, - "card-minimum-width-extra-large": { - "prop": "--spectrum-card-minimum-width-extra-large", - "value": "340px" - }, - "card-minimum-width-extra-small": { - "prop": "--spectrum-card-minimum-width-extra-small", - "value": "100px" - }, - "card-minimum-width-large": { - "prop": "--spectrum-card-minimum-width-large", - "value": "270px" - }, - "card-minimum-width-medium": { - "prop": "--spectrum-card-minimum-width-medium", - "value": "200px" - }, - "card-minimum-width-small": { - "prop": "--spectrum-card-minimum-width-small", - "value": "150px" - }, - "card-preview-minimum-height": { - "prop": "--spectrum-card-preview-minimum-height", - "value": "130px" - }, - "card-selection-background-color": { - "prop": "--spectrum-card-selection-background-color", - "light": { - "ref": "var(--spectrum-transparent-white-600)", - "value": "rgba(255, 255, 255, 0.51)" - }, - "dark": { - "ref": "var(--spectrum-transparent-black-600)", - "value": "rgba(0, 0, 0, 0.56)" - } - }, - "card-selection-background-color-opacity": { - "prop": "--spectrum-card-selection-background-color-opacity", - "value": "0.95" - }, - "card-selection-background-size": { - "prop": "--spectrum-card-selection-background-size", - "value": "40px" - }, - "card-selection-background-size-extra-large": { - "prop": "--spectrum-card-selection-background-size-extra-large", - "value": "28px" - }, - "card-selection-background-size-large": { - "prop": "--spectrum-card-selection-background-size-large", - "value": "26px" - }, - "card-selection-background-size-medium": { - "prop": "--spectrum-card-selection-background-size-medium", - "value": "24px" - }, - "card-selection-background-size-small": { - "prop": "--spectrum-card-selection-background-size-small", - "value": "22px" - }, - "celery-100": { - "prop": "--spectrum-celery-100", - "light": { - "value": "rgb(235, 255, 220)" - }, - "dark": { - "value": "rgb(11, 31, 0)" - } - }, - "celery-1000": { - "prop": "--spectrum-celery-1000", - "light": { - "value": "rgb(52, 109, 12)" - }, - "dark": { - "value": "rgb(88, 172, 28)" - } - }, - "celery-1100": { - "prop": "--spectrum-celery-1100", - "light": { - "value": "rgb(44, 92, 9)" - }, - "dark": { - "value": "rgb(100, 190, 35)" - } - }, - "celery-1200": { - "prop": "--spectrum-celery-1200", - "light": { - "value": "rgb(35, 75, 6)" - }, - "dark": { - "value": "rgb(116, 213, 46)" - } - }, - "celery-1300": { - "prop": "--spectrum-celery-1300", - "light": { - "value": "rgb(27, 60, 3)" - }, - "dark": { - "value": "rgb(136, 234, 65)" - } - }, - "celery-1400": { - "prop": "--spectrum-celery-1400", - "light": { - "value": "rgb(19, 46, 0)" - }, - "dark": { - "value": "rgb(170, 251, 112)" - } - }, - "celery-1500": { - "prop": "--spectrum-celery-1500", - "dark": { - "value": "rgb(222, 255, 198)" - }, - "light": { - "value": "rgb(12, 33, 0)" - } - }, - "celery-1600": { - "prop": "--spectrum-celery-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(4, 15, 0)" - } - }, - "celery-200": { - "prop": "--spectrum-celery-200", - "light": { - "value": "rgb(197, 255, 156)" - }, - "dark": { - "value": "rgb(15, 38, 0)" - } - }, - "celery-300": { - "prop": "--spectrum-celery-300", - "light": { - "value": "rgb(157, 247, 92)" - }, - "dark": { - "value": "rgb(21, 51, 1)" - } - }, - "celery-400": { - "prop": "--spectrum-celery-400", - "light": { - "value": "rgb(129, 228, 58)" - }, - "dark": { - "value": "rgb(31, 67, 4)" - } - }, - "celery-500": { - "prop": "--spectrum-celery-500", - "light": { - "value": "rgb(110, 206, 42)" - }, - "dark": { - "value": "rgb(41, 86, 8)" - } - }, - "celery-600": { - "prop": "--spectrum-celery-600", - "light": { - "value": "rgb(93, 180, 31)" - }, - "dark": { - "value": "rgb(50, 105, 11)" - } - }, - "celery-700": { - "prop": "--spectrum-celery-700", - "light": { - "value": "rgb(82, 161, 25)" - }, - "dark": { - "value": "rgb(60, 122, 15)" - } - }, - "celery-800": { - "prop": "--spectrum-celery-800", - "light": { - "value": "rgb(72, 144, 20)" - }, - "dark": { - "value": "rgb(66, 134, 18)" - } - }, - "celery-900": { - "prop": "--spectrum-celery-900", - "light": { - "value": "rgb(64, 129, 17)" - }, - "dark": { - "value": "rgb(78, 154, 23)" - } - }, - "celery-background-color-default": { - "prop": "--spectrum-celery-background-color-default", - "ref": "var(--spectrum-celery-900)", - "light": { - "value": "rgb(93, 180, 31)" - }, - "dark": { - "value": "rgb(78, 154, 23)" - } - }, - "celery-subtle-background-color-default": { - "prop": "--spectrum-celery-subtle-background-color-default", - "ref": "var(--spectrum-celery-300)", - "light": { - "value": "rgb(197, 255, 156)" - }, - "dark": { - "value": "rgb(21, 51, 1)" - } - }, - "celery-visual-color": { - "prop": "--spectrum-celery-visual-color", - "ref": "var(--spectrum-celery-800)", - "light": { - "value": "rgb(82, 161, 25)" - }, - "dark": { - "value": "rgb(66, 134, 18)" - } - }, - "character-count-to-field-quiet-extra-large": { - "prop": "--spectrum-character-count-to-field-quiet-extra-large", - "desktop": { - "value": "-4px" - }, - "mobile": { - "value": "-5px" - } - }, - "character-count-to-field-quiet-large": { - "prop": "--spectrum-character-count-to-field-quiet-large", - "desktop": { - "value": "-3px" - }, - "mobile": { - "value": "-4px" - } - }, - "character-count-to-field-quiet-medium": { - "prop": "--spectrum-character-count-to-field-quiet-medium", - "desktop": { - "value": "-3px" - }, - "mobile": { - "value": "-4px" - } - }, - "character-count-to-field-quiet-small": { - "prop": "--spectrum-character-count-to-field-quiet-small", - "desktop": { - "value": "-3px" - }, - "mobile": { - "value": "-4px" - } - }, - "chartreuse-100": { - "prop": "--spectrum-chartreuse-100", - "light": { - "value": "rgb(246, 251, 222)" - }, - "dark": { - "value": "rgb(23, 28, 0)" - } - }, - "chartreuse-1000": { - "prop": "--spectrum-chartreuse-1000", - "light": { - "value": "rgb(86, 103, 0)" - }, - "dark": { - "value": "rgb(136, 164, 0)" - } - }, - "chartreuse-1100": { - "prop": "--spectrum-chartreuse-1100", - "light": { - "value": "rgb(73, 87, 0)" - }, - "dark": { - "value": "rgb(151, 181, 0)" - } - }, - "chartreuse-1200": { - "prop": "--spectrum-chartreuse-1200", - "light": { - "value": "rgb(60, 71, 0)" - }, - "dark": { - "value": "rgb(169, 203, 0)" - } - }, - "chartreuse-1300": { - "prop": "--spectrum-chartreuse-1300", - "light": { - "value": "rgb(47, 57, 0)" - }, - "dark": { - "value": "rgb(187, 225, 0)" - } - }, - "chartreuse-1400": { - "prop": "--spectrum-chartreuse-1400", - "light": { - "value": "rgb(35, 43, 0)" - }, - "dark": { - "value": "rgb(219, 240, 117)" - } - }, - "chartreuse-1500": { - "prop": "--spectrum-chartreuse-1500", - "dark": { - "value": "rgb(242, 249, 206)" - }, - "light": { - "value": "rgb(25, 30, 0)" - } - }, - "chartreuse-1600": { - "prop": "--spectrum-chartreuse-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(11, 14, 0)" - } - }, - "chartreuse-200": { - "prop": "--spectrum-chartreuse-200", - "light": { - "value": "rgb(234, 246, 173)" - }, - "dark": { - "value": "rgb(30, 36, 0)" - } - }, - "chartreuse-300": { - "prop": "--spectrum-chartreuse-300", - "light": { - "value": "rgb(208, 236, 70)" - }, - "dark": { - "value": "rgb(39, 47, 0)" - } - }, - "chartreuse-400": { - "prop": "--spectrum-chartreuse-400", - "light": { - "value": "rgb(182, 219, 0)" - }, - "dark": { - "value": "rgb(53, 63, 0)" - } - }, - "chartreuse-500": { - "prop": "--spectrum-chartreuse-500", - "light": { - "value": "rgb(163, 196, 0)" - }, - "dark": { - "value": "rgb(68, 82, 0)" - } - }, - "chartreuse-600": { - "prop": "--spectrum-chartreuse-600", - "light": { - "value": "rgb(143, 172, 0)" - }, - "dark": { - "value": "rgb(83, 100, 0)" - } - }, - "chartreuse-700": { - "prop": "--spectrum-chartreuse-700", - "light": { - "value": "rgb(128, 153, 0)" - }, - "dark": { - "value": "rgb(97, 116, 0)" - } - }, - "chartreuse-800": { - "prop": "--spectrum-chartreuse-800", - "light": { - "value": "rgb(114, 137, 0)" - }, - "dark": { - "value": "rgb(106, 127, 0)" - } - }, - "chartreuse-900": { - "prop": "--spectrum-chartreuse-900", - "light": { - "value": "rgb(102, 122, 0)" - }, - "dark": { - "value": "rgb(122, 147, 0)" - } - }, - "chartreuse-background-color-default": { - "prop": "--spectrum-chartreuse-background-color-default", - "ref": "var(--spectrum-chartreuse-1000)", - "light": { - "value": "rgb(163, 196, 0)" - }, - "dark": { - "value": "rgb(136, 164, 0)" - } - }, - "chartreuse-subtle-background-color-default": { - "prop": "--spectrum-chartreuse-subtle-background-color-default", - "ref": "var(--spectrum-chartreuse-300)", - "light": { - "value": "rgb(234, 246, 173)" - }, - "dark": { - "value": "rgb(39, 47, 0)" - } - }, - "chartreuse-visual-color": { - "prop": "--spectrum-chartreuse-visual-color", - "ref": "var(--spectrum-chartreuse-900)", - "light": { - "value": "rgb(143, 172, 0)" - }, - "dark": { - "value": "rgb(122, 147, 0)" - } - }, - "checkbox-control-size-extra-large": { - "prop": "--spectrum-checkbox-control-size-extra-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "26px" - } - }, - "checkbox-control-size-large": { - "prop": "--spectrum-checkbox-control-size-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "checkbox-control-size-medium": { - "prop": "--spectrum-checkbox-control-size-medium", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "checkbox-control-size-small": { - "prop": "--spectrum-checkbox-control-size-small", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "checkbox-top-to-control-extra-large": { - "prop": "--spectrum-checkbox-top-to-control-extra-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "checkbox-top-to-control-large": { - "prop": "--spectrum-checkbox-top-to-control-large", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "checkbox-top-to-control-medium": { - "prop": "--spectrum-checkbox-top-to-control-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "checkbox-top-to-control-small": { - "prop": "--spectrum-checkbox-top-to-control-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "checkmark-icon-size-100": { - "prop": "--spectrum-checkmark-icon-size-100", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "checkmark-icon-size-200": { - "prop": "--spectrum-checkmark-icon-size-200", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "checkmark-icon-size-300": { - "prop": "--spectrum-checkmark-icon-size-300", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "checkmark-icon-size-400": { - "prop": "--spectrum-checkmark-icon-size-400", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "checkmark-icon-size-50": { - "prop": "--spectrum-checkmark-icon-size-50", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "checkmark-icon-size-500": { - "prop": "--spectrum-checkmark-icon-size-500", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "checkmark-icon-size-600": { - "prop": "--spectrum-checkmark-icon-size-600", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "24px" - } - }, - "checkmark-icon-size-75": { - "prop": "--spectrum-checkmark-icon-size-75", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "chevron-icon-size-100": { - "prop": "--spectrum-chevron-icon-size-100", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "chevron-icon-size-200": { - "prop": "--spectrum-chevron-icon-size-200", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "chevron-icon-size-300": { - "prop": "--spectrum-chevron-icon-size-300", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "chevron-icon-size-400": { - "prop": "--spectrum-chevron-icon-size-400", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "chevron-icon-size-50": { - "prop": "--spectrum-chevron-icon-size-50", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "chevron-icon-size-500": { - "prop": "--spectrum-chevron-icon-size-500", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "chevron-icon-size-600": { - "prop": "--spectrum-chevron-icon-size-600", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "24px" - } - }, - "chevron-icon-size-75": { - "prop": "--spectrum-chevron-icon-size-75", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "cinnamon-100": { - "prop": "--spectrum-cinnamon-100", - "dark": { - "value": "rgb(48, 17, 4)" - }, - "light": { - "value": "rgb(253, 247, 243)" - } - }, - "cinnamon-1000": { - "prop": "--spectrum-cinnamon-1000", - "dark": { - "value": "rgb(206, 136, 99)" - }, - "light": { - "value": "rgb(147, 77, 43)" - } - }, - "cinnamon-1100": { - "prop": "--spectrum-cinnamon-1100", - "dark": { - "value": "rgb(220, 154, 118)" - }, - "light": { - "value": "rgb(128, 62, 32)" - } - }, - "cinnamon-1200": { - "prop": "--spectrum-cinnamon-1200", - "dark": { - "value": "rgb(232, 179, 149)" - }, - "light": { - "value": "rgb(110, 48, 21)" - } - }, - "cinnamon-1300": { - "prop": "--spectrum-cinnamon-1300", - "dark": { - "value": "rgb(239, 203, 183)" - }, - "light": { - "value": "rgb(92, 35, 11)" - } - }, - "cinnamon-1400": { - "prop": "--spectrum-cinnamon-1400", - "dark": { - "value": "rgb(246, 225, 214)" - }, - "light": { - "value": "rgb(72, 25, 6)" - } - }, - "cinnamon-1500": { - "prop": "--spectrum-cinnamon-1500", - "dark": { - "value": "rgb(252, 244, 239)" - }, - "light": { - "value": "rgb(52, 18, 4)" - } - }, - "cinnamon-1600": { - "prop": "--spectrum-cinnamon-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(24, 8, 2)" - } - }, - "cinnamon-200": { - "prop": "--spectrum-cinnamon-200", - "dark": { - "value": "rgb(59, 21, 5)" - }, - "light": { - "value": "rgb(249, 236, 229)" - } - }, - "cinnamon-300": { - "prop": "--spectrum-cinnamon-300", - "dark": { - "value": "rgb(79, 28, 7)" - }, - "light": { - "value": "rgb(244, 218, 203)" - } - }, - "cinnamon-400": { - "prop": "--spectrum-cinnamon-400", - "dark": { - "value": "rgb(100, 41, 15)" - }, - "light": { - "value": "rgb(237, 196, 172)" - } - }, - "cinnamon-500": { - "prop": "--spectrum-cinnamon-500", - "dark": { - "value": "rgb(122, 57, 28)" - }, - "light": { - "value": "rgb(229, 170, 136)" - } - }, - "cinnamon-600": { - "prop": "--spectrum-cinnamon-600", - "dark": { - "value": "rgb(143, 74, 40)" - }, - "light": { - "value": "rgb(212, 145, 108)" - } - }, - "cinnamon-700": { - "prop": "--spectrum-cinnamon-700", - "dark": { - "value": "rgb(163, 88, 52)" - }, - "light": { - "value": "rgb(198, 126, 88)" - } - }, - "cinnamon-800": { - "prop": "--spectrum-cinnamon-800", - "dark": { - "value": "rgb(176, 98, 59)" - }, - "light": { - "value": "rgb(184, 109, 70)" - } - }, - "cinnamon-900": { - "prop": "--spectrum-cinnamon-900", - "dark": { - "value": "rgb(192, 119, 80)" - }, - "light": { - "value": "rgb(170, 94, 56)" - } - }, - "cinnamon-background-color-default": { - "prop": "--spectrum-cinnamon-background-color-default", - "ref": "var(--spectrum-cinnamon-800)", - "light": { - "value": "rgb(170, 94, 56)" - }, - "dark": { - "value": "rgb(176, 98, 59)" - } - }, - "cinnamon-subtle-background-color-default": { - "prop": "--spectrum-cinnamon-subtle-background-color-default", - "ref": "var(--spectrum-cinnamon-300)", - "light": { - "value": "rgb(249, 236, 229)" - }, - "dark": { - "value": "rgb(79, 28, 7)" - } - }, - "cinnamon-visual-color": { - "prop": "--spectrum-cinnamon-visual-color", - "ref": "var(--spectrum-cinnamon-900)", - "light": { - "value": "rgb(184, 109, 70)" - }, - "dark": { - "value": "rgb(192, 119, 80)" - } - }, - "cjk-font-family": { - "prop": "--spectrum-cjk-font-family", - "value": "Adobe Clean Han" - }, - "cjk-letter-spacing": { - "prop": "--spectrum-cjk-letter-spacing", - "ref": "var(--spectrum-letter-spacing)", - "value": "0em" - }, - "cjk-line-height-100": { - "prop": "--spectrum-cjk-line-height-100", - "value": 1.5 - }, - "cjk-line-height-200": { - "prop": "--spectrum-cjk-line-height-200", - "value": 1.7 - }, - "coach-indicator-collapsed-gap": { - "prop": "--spectrum-coach-indicator-collapsed-gap", - "value": "2px" - }, - "coach-indicator-collapsed-ring-rounding-increment": { - "prop": "--spectrum-coach-indicator-collapsed-ring-rounding-increment", - "value": "6px" - }, - "coach-indicator-collapsed-ring-thickness": { - "prop": "--spectrum-coach-indicator-collapsed-ring-thickness", - "value": "4px" - }, - "coach-indicator-color": { - "prop": "--spectrum-coach-indicator-color", - "ref": "var(--spectrum-blue-800)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "coach-indicator-expanded-gap": { - "prop": "--spectrum-coach-indicator-expanded-gap", - "value": "6px" - }, - "coach-indicator-expanded-ring-rounding-increment": { - "prop": "--spectrum-coach-indicator-expanded-ring-rounding-increment", - "value": "14px" - }, - "coach-indicator-expanded-ring-thickness": { - "prop": "--spectrum-coach-indicator-expanded-ring-thickness", - "value": "8px" - }, - "coach-indicator-opacity": { - "prop": "--spectrum-coach-indicator-opacity", - "value": "0.2" - }, - "coach-mark-body-font-size": { - "prop": "--spectrum-coach-mark-body-font-size", - "ref": "var(--spectrum-body-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "coach-mark-body-size": { - "prop": "--spectrum-coach-mark-body-size", - "ref": "var(--spectrum-body-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "coach-mark-edge-to-content": { - "prop": "--spectrum-coach-mark-edge-to-content", - "desktop": { - "ref": "var(--spectrum-spacing-400)", - "value": "24px" - }, - "mobile": { - "ref": "var(--spectrum-spacing-300)", - "value": "16px" - } - }, - "coach-mark-maximum-width": { - "prop": "--spectrum-coach-mark-maximum-width", - "desktop": { - "value": "380px" - }, - "mobile": { - "value": "248px" - } - }, - "coach-mark-media-height": { - "prop": "--spectrum-coach-mark-media-height", - "desktop": { - "value": "222px" - }, - "mobile": { - "value": "162px" - } - }, - "coach-mark-media-minimum-height": { - "prop": "--spectrum-coach-mark-media-minimum-height", - "desktop": { - "value": "166px" - }, - "mobile": { - "value": "121px" - } - }, - "coach-mark-minimum-width": { - "prop": "--spectrum-coach-mark-minimum-width", - "desktop": { - "value": "296px" - }, - "mobile": { - "value": "216px" - } - }, - "coach-mark-pagination-body-font-size": { - "prop": "--spectrum-coach-mark-pagination-body-font-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "coach-mark-pagination-body-size": { - "prop": "--spectrum-coach-mark-pagination-body-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "coach-mark-pagination-color": { - "prop": "--spectrum-coach-mark-pagination-color", - "ref": "var(--spectrum-gray-600)", - "light": { - "value": "rgb(113, 113, 113)" - }, - "dark": { - "value": "rgb(138, 138, 138)" - } - }, - "coach-mark-pagination-text-to-bottom-edge": { - "prop": "--spectrum-coach-mark-pagination-text-to-bottom-edge", - "desktop": { - "value": "33px" - }, - "mobile": { - "value": "22px" - } - }, - "coach-mark-title-font-size": { - "prop": "--spectrum-coach-mark-title-font-size", - "ref": "var(--spectrum-title-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "coach-mark-title-size": { - "prop": "--spectrum-coach-mark-title-size", - "ref": "var(--spectrum-title-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "coach-mark-width": { - "prop": "--spectrum-coach-mark-width", - "desktop": { - "value": "296px" - }, - "mobile": { - "value": "216px" - } - }, - "code-cjk-emphasized-font-style": { - "prop": "--spectrum-code-cjk-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "code-cjk-emphasized-font-weight": { - "prop": "--spectrum-code-cjk-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "code-cjk-font-family": { - "prop": "--spectrum-code-cjk-font-family", - "ref": "var(--spectrum-code-font-family)", - "value": "Source Code Pro" - }, - "code-cjk-font-style": { - "prop": "--spectrum-code-cjk-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "code-cjk-font-weight": { - "prop": "--spectrum-code-cjk-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "code-cjk-line-height": { - "prop": "--spectrum-code-cjk-line-height", - "ref": "var(--spectrum-cjk-line-height-200)", - "value": 1.7 - }, - "code-cjk-size-l": { - "prop": "--spectrum-code-cjk-size-l", - "ref": "var(--spectrum-code-size-l)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "code-cjk-size-m": { - "prop": "--spectrum-code-cjk-size-m", - "ref": "var(--spectrum-code-size-m)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "code-cjk-size-s": { - "prop": "--spectrum-code-cjk-size-s", - "ref": "var(--spectrum-code-size-s)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "code-cjk-size-xl": { - "prop": "--spectrum-code-cjk-size-xl", - "ref": "var(--spectrum-code-size-xl)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "code-cjk-size-xs": { - "prop": "--spectrum-code-cjk-size-xs", - "ref": "var(--spectrum-code-size-xs)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "code-cjk-strong-emphasized-font-style": { - "prop": "--spectrum-code-cjk-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "code-cjk-strong-emphasized-font-weight": { - "prop": "--spectrum-code-cjk-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "code-cjk-strong-font-style": { - "prop": "--spectrum-code-cjk-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "code-cjk-strong-font-weight": { - "prop": "--spectrum-code-cjk-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "code-color": { - "prop": "--spectrum-code-color", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "code-emphasized-font-style": { - "prop": "--spectrum-code-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "code-emphasized-font-weight": { - "prop": "--spectrum-code-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "code-font-family": { - "prop": "--spectrum-code-font-family", - "value": "Source Code Pro" - }, - "code-font-style": { - "prop": "--spectrum-code-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "code-font-weight": { - "prop": "--spectrum-code-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "code-line-height": { - "prop": "--spectrum-code-line-height", - "ref": "var(--spectrum-line-height-200)", - "value": 1.5 - }, - "code-size-l": { - "prop": "--spectrum-code-size-l", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "code-size-m": { - "prop": "--spectrum-code-size-m", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "code-size-s": { - "prop": "--spectrum-code-size-s", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "code-size-xl": { - "prop": "--spectrum-code-size-xl", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "code-size-xs": { - "prop": "--spectrum-code-size-xs", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "code-strong-emphasized-font-style": { - "prop": "--spectrum-code-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "code-strong-emphasized-font-weight": { - "prop": "--spectrum-code-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "code-strong-font-style": { - "prop": "--spectrum-code-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "code-strong-font-weight": { - "prop": "--spectrum-code-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "collection-card-minimum-height-extra-large": { - "prop": "--spectrum-collection-card-minimum-height-extra-large", - "value": "249px" - }, - "collection-card-minimum-height-extra-small": { - "prop": "--spectrum-collection-card-minimum-height-extra-small", - "value": "88px" - }, - "collection-card-minimum-height-hero-extra-large": { - "prop": "--spectrum-collection-card-minimum-height-hero-extra-large", - "value": "514px" - }, - "collection-card-minimum-height-hero-extra-small": { - "prop": "--spectrum-collection-card-minimum-height-hero-extra-small", - "value": "168px" - }, - "collection-card-minimum-height-hero-large": { - "prop": "--spectrum-collection-card-minimum-height-hero-large", - "value": "414px" - }, - "collection-card-minimum-height-hero-medium": { - "prop": "--spectrum-collection-card-minimum-height-hero-medium", - "value": "317px" - }, - "collection-card-minimum-height-hero-small": { - "prop": "--spectrum-collection-card-minimum-height-hero-small", - "value": "243px" - }, - "collection-card-minimum-height-large": { - "prop": "--spectrum-collection-card-minimum-height-large", - "value": "202px" - }, - "collection-card-minimum-height-medium": { - "prop": "--spectrum-collection-card-minimum-height-medium", - "value": "157px" - }, - "collection-card-minimum-height-small": { - "prop": "--spectrum-collection-card-minimum-height-small", - "value": "124px" - }, - "color-area-border-color": { - "prop": "--spectrum-color-area-border-color", - "ref": "var(--spectrum-gray-1000)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 0, 0)" - } - }, - "color-area-border-opacity": { - "prop": "--spectrum-color-area-border-opacity", - "value": "0.1" - }, - "color-area-border-rounding": { - "prop": "--spectrum-color-area-border-rounding", - "ref": "var(--spectrum-corner-radius-medium-size-small)", - "value": "7px" - }, - "color-area-border-width": { - "prop": "--spectrum-color-area-border-width", - "ref": "var(--spectrum-border-width-100)", - "value": "1px" - }, - "color-area-height": { - "prop": "--spectrum-color-area-height", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "color-area-minimum-height": { - "prop": "--spectrum-color-area-minimum-height", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "80px" - } - }, - "color-area-minimum-width": { - "prop": "--spectrum-color-area-minimum-width", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "80px" - } - }, - "color-area-width": { - "prop": "--spectrum-color-area-width", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "color-control-track-width": { - "prop": "--spectrum-color-control-track-width", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "color-handle-border-width": { - "prop": "--spectrum-color-handle-border-width", - "ref": "var(--spectrum-border-width-200)", - "value": "2px" - }, - "color-handle-drop-shadow-blur": { - "prop": "--spectrum-color-handle-drop-shadow-blur", - "value": "0" - }, - "color-handle-drop-shadow-color": { - "prop": "--spectrum-color-handle-drop-shadow-color", - "ref": "var(--spectrum-drop-shadow-color)", - "light": { - "value": "rgba(0, 0, 0, 0.12)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.36)" - } - }, - "color-handle-drop-shadow-x": { - "prop": "--spectrum-color-handle-drop-shadow-x", - "value": "0" - }, - "color-handle-drop-shadow-y": { - "prop": "--spectrum-color-handle-drop-shadow-y", - "value": "0" - }, - "color-handle-inner-border-color": { - "prop": "--spectrum-color-handle-inner-border-color", - "ref": "var(--spectrum-black)", - "value": "rgb(0, 0, 0)" - }, - "color-handle-inner-border-opacity": { - "prop": "--spectrum-color-handle-inner-border-opacity", - "value": "0.42" - }, - "color-handle-inner-border-width": { - "prop": "--spectrum-color-handle-inner-border-width", - "value": "1px" - }, - "color-handle-outer-border-color": { - "prop": "--spectrum-color-handle-outer-border-color", - "ref": "var(--spectrum-black)", - "value": "rgb(0, 0, 0)" - }, - "color-handle-outer-border-opacity": { - "prop": "--spectrum-color-handle-outer-border-opacity", - "ref": "var(--spectrum-color-handle-inner-border-opacity)", - "value": "0.42" - }, - "color-handle-outer-border-width": { - "prop": "--spectrum-color-handle-outer-border-width", - "value": "1px" - }, - "color-handle-size": { - "prop": "--spectrum-color-handle-size", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "color-handle-size-key-focus": { - "prop": "--spectrum-color-handle-size-key-focus", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "color-loupe-bottom-to-color-handle": { - "prop": "--spectrum-color-loupe-bottom-to-color-handle", - "value": "12px" - }, - "color-loupe-drop-shadow-blur": { - "prop": "--spectrum-color-loupe-drop-shadow-blur", - "ref": "var(--spectrum-drop-shadow-elevated-blur)", - "value": "8px" - }, - "color-loupe-drop-shadow-color": { - "prop": "--spectrum-color-loupe-drop-shadow-color", - "ref": "var(--spectrum-drop-shadow-elevated-color)", - "light": { - "value": "rgba(0, 0, 0, 0.16)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.48)" - } - }, - "color-loupe-drop-shadow-y": { - "prop": "--spectrum-color-loupe-drop-shadow-y", - "ref": "var(--spectrum-drop-shadow-elevated-y)", - "value": "2px" - }, - "color-loupe-height": { - "prop": "--spectrum-color-loupe-height", - "value": "64px" - }, - "color-loupe-inner-border": { - "prop": "--spectrum-color-loupe-inner-border", - "ref": "var(--spectrum-transparent-black-200)", - "value": "rgba(0, 0, 0, 0.12)" - }, - "color-loupe-inner-border-width": { - "prop": "--spectrum-color-loupe-inner-border-width", - "value": "1px" - }, - "color-loupe-outer-border": { - "prop": "--spectrum-color-loupe-outer-border", - "ref": "var(--spectrum-white)", - "value": "rgb(255, 255, 255)" - }, - "color-loupe-outer-border-width": { - "prop": "--spectrum-color-loupe-outer-border-width", - "ref": "var(--spectrum-border-width-200)", - "value": "2px" - }, - "color-loupe-width": { - "prop": "--spectrum-color-loupe-width", - "value": "48px" - }, - "color-slider-border-color": { - "prop": "--spectrum-color-slider-border-color", - "ref": "var(--spectrum-gray-1000)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 0, 0)" - } - }, - "color-slider-border-opacity": { - "prop": "--spectrum-color-slider-border-opacity", - "value": "0.1" - }, - "color-slider-border-rounding": { - "prop": "--spectrum-color-slider-border-rounding", - "ref": "var(--spectrum-corner-radius-medium-size-small)", - "value": "7px" - }, - "color-slider-border-width": { - "prop": "--spectrum-color-slider-border-width", - "value": "1px" - }, - "color-slider-length": { - "prop": "--spectrum-color-slider-length", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "color-slider-minimum-length": { - "prop": "--spectrum-color-slider-minimum-length", - "desktop": { - "value": "80px" - }, - "mobile": { - "value": "100px" - } - }, - "color-wheel-border-color": { - "prop": "--spectrum-color-wheel-border-color", - "ref": "var(--spectrum-gray-1000)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 0, 0)" - } - }, - "color-wheel-border-opacity": { - "prop": "--spectrum-color-wheel-border-opacity", - "value": "0.1" - }, - "color-wheel-color-area-margin": { - "prop": "--spectrum-color-wheel-color-area-margin", - "value": "12px" - }, - "color-wheel-minimum-width": { - "prop": "--spectrum-color-wheel-minimum-width", - "desktop": { - "value": "175px" - }, - "mobile": { - "value": "219px" - } - }, - "color-wheel-width": { - "prop": "--spectrum-color-wheel-width", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "combo-box-minimum-width-multiplier": { - "prop": "--spectrum-combo-box-minimum-width-multiplier", - "value": 2.5 - }, - "combo-box-quiet-minimum-width-multiplier": { - "prop": "--spectrum-combo-box-quiet-minimum-width-multiplier", - "value": 2 - }, - "combo-box-visual-to-field-button": { - "prop": "--spectrum-combo-box-visual-to-field-button", - "value": "0px" - }, - "combo-box-visual-to-field-button-extra-large": { - "prop": "--spectrum-combo-box-visual-to-field-button-extra-large", - "ref": "var(--spectrum-combo-box-visual-to-field-button)", - "value": "0px" - }, - "combo-box-visual-to-field-button-large": { - "prop": "--spectrum-combo-box-visual-to-field-button-large", - "ref": "var(--spectrum-combo-box-visual-to-field-button)", - "value": "0px" - }, - "combo-box-visual-to-field-button-medium": { - "prop": "--spectrum-combo-box-visual-to-field-button-medium", - "ref": "var(--spectrum-combo-box-visual-to-field-button)", - "value": "0px" - }, - "combo-box-visual-to-field-button-quiet": { - "prop": "--spectrum-combo-box-visual-to-field-button-quiet", - "ref": "var(--spectrum-combo-box-visual-to-field-button)", - "value": "0px" - }, - "combo-box-visual-to-field-button-small": { - "prop": "--spectrum-combo-box-visual-to-field-button-small", - "ref": "var(--spectrum-combo-box-visual-to-field-button)", - "value": "0px" - }, - "component-bottom-to-text-100": { - "prop": "--spectrum-component-bottom-to-text-100", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "component-bottom-to-text-200": { - "prop": "--spectrum-component-bottom-to-text-200", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "component-bottom-to-text-300": { - "prop": "--spectrum-component-bottom-to-text-300", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "component-bottom-to-text-50": { - "prop": "--spectrum-component-bottom-to-text-50", - "desktop": { - "value": "3px" - }, - "mobile": { - "value": "6px" - } - }, - "component-bottom-to-text-75": { - "prop": "--spectrum-component-bottom-to-text-75", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "component-edge-to-text-100": { - "prop": "--spectrum-component-edge-to-text-100", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "component-edge-to-text-200": { - "prop": "--spectrum-component-edge-to-text-200", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "component-edge-to-text-300": { - "prop": "--spectrum-component-edge-to-text-300", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "component-edge-to-text-50": { - "prop": "--spectrum-component-edge-to-text-50", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "component-edge-to-text-75": { - "prop": "--spectrum-component-edge-to-text-75", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "component-edge-to-visual-100": { - "prop": "--spectrum-component-edge-to-visual-100", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "component-edge-to-visual-200": { - "prop": "--spectrum-component-edge-to-visual-200", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "16px" - } - }, - "component-edge-to-visual-300": { - "prop": "--spectrum-component-edge-to-visual-300", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "component-edge-to-visual-50": { - "prop": "--spectrum-component-edge-to-visual-50", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "component-edge-to-visual-75": { - "prop": "--spectrum-component-edge-to-visual-75", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "component-edge-to-visual-only-100": { - "prop": "--spectrum-component-edge-to-visual-only-100", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "component-edge-to-visual-only-200": { - "prop": "--spectrum-component-edge-to-visual-only-200", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "component-edge-to-visual-only-300": { - "prop": "--spectrum-component-edge-to-visual-only-300", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "component-edge-to-visual-only-50": { - "prop": "--spectrum-component-edge-to-visual-only-50", - "desktop": { - "value": "3px" - }, - "mobile": { - "value": "5px" - } - }, - "component-edge-to-visual-only-75": { - "prop": "--spectrum-component-edge-to-visual-only-75", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "6px" - } - }, - "component-height-100": { - "prop": "--spectrum-component-height-100", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "component-height-200": { - "prop": "--spectrum-component-height-200", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "component-height-300": { - "prop": "--spectrum-component-height-300", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "component-height-400": { - "prop": "--spectrum-component-height-400", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "component-height-50": { - "prop": "--spectrum-component-height-50", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "26px" - } - }, - "component-height-500": { - "prop": "--spectrum-component-height-500", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "80px" - } - }, - "component-height-75": { - "prop": "--spectrum-component-height-75", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "component-pill-edge-to-text-100": { - "prop": "--spectrum-component-pill-edge-to-text-100", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "component-pill-edge-to-text-200": { - "prop": "--spectrum-component-pill-edge-to-text-200", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "25px" - } - }, - "component-pill-edge-to-text-300": { - "prop": "--spectrum-component-pill-edge-to-text-300", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "component-pill-edge-to-text-75": { - "prop": "--spectrum-component-pill-edge-to-text-75", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "component-pill-edge-to-visual-100": { - "prop": "--spectrum-component-pill-edge-to-visual-100", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "component-pill-edge-to-visual-200": { - "prop": "--spectrum-component-pill-edge-to-visual-200", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "component-pill-edge-to-visual-300": { - "prop": "--spectrum-component-pill-edge-to-visual-300", - "desktop": { - "value": "21px" - }, - "mobile": { - "value": "27px" - } - }, - "component-pill-edge-to-visual-75": { - "prop": "--spectrum-component-pill-edge-to-visual-75", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "component-pill-edge-to-visual-only-100": { - "prop": "--spectrum-component-pill-edge-to-visual-only-100", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "component-pill-edge-to-visual-only-200": { - "prop": "--spectrum-component-pill-edge-to-visual-only-200", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "component-pill-edge-to-visual-only-300": { - "prop": "--spectrum-component-pill-edge-to-visual-only-300", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "component-pill-edge-to-visual-only-75": { - "prop": "--spectrum-component-pill-edge-to-visual-only-75", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "6px" - } - }, - "component-size-difference-down": { - "prop": "--spectrum-component-size-difference-down", - "value": "-2px" - }, - "component-size-maximum-perspective-down": { - "prop": "--spectrum-component-size-maximum-perspective-down", - "value": "96px" - }, - "component-size-minimum-perspective-down": { - "prop": "--spectrum-component-size-minimum-perspective-down", - "value": "24px" - }, - "component-size-width-ratio-down": { - "prop": "--spectrum-component-size-width-ratio-down", - "value": 0.3333 - }, - "component-to-menu-extra-large": { - "prop": "--spectrum-component-to-menu-extra-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "component-to-menu-large": { - "prop": "--spectrum-component-to-menu-large", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "component-to-menu-medium": { - "prop": "--spectrum-component-to-menu-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "component-to-menu-small": { - "prop": "--spectrum-component-to-menu-small", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "component-top-to-text-100": { - "prop": "--spectrum-component-top-to-text-100", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "component-top-to-text-200": { - "prop": "--spectrum-component-top-to-text-200", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "component-top-to-text-300": { - "prop": "--spectrum-component-top-to-text-300", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "component-top-to-text-50": { - "prop": "--spectrum-component-top-to-text-50", - "desktop": { - "value": "3px" - }, - "mobile": { - "value": "4px" - } - }, - "component-top-to-text-75": { - "prop": "--spectrum-component-top-to-text-75", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "component-top-to-workflow-icon-100": { - "prop": "--spectrum-component-top-to-workflow-icon-100", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "component-top-to-workflow-icon-200": { - "prop": "--spectrum-component-top-to-workflow-icon-200", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "component-top-to-workflow-icon-300": { - "prop": "--spectrum-component-top-to-workflow-icon-300", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "component-top-to-workflow-icon-50": { - "prop": "--spectrum-component-top-to-workflow-icon-50", - "desktop": { - "value": "3px" - }, - "mobile": { - "value": "5px" - } - }, - "component-top-to-workflow-icon-75": { - "prop": "--spectrum-component-top-to-workflow-icon-75", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "6px" - } - }, - "contextual-help-body-font-size": { - "prop": "--spectrum-contextual-help-body-font-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "contextual-help-body-size": { - "prop": "--spectrum-contextual-help-body-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "contextual-help-minimum-width": { - "prop": "--spectrum-contextual-help-minimum-width", - "value": "268px" - }, - "contextual-help-title-font-size": { - "prop": "--spectrum-contextual-help-title-font-size", - "ref": "var(--spectrum-title-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "contextual-help-title-size": { - "prop": "--spectrum-contextual-help-title-size", - "ref": "var(--spectrum-title-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "corner-radius-0": { - "prop": "--spectrum-corner-radius-0", - "value": "0px" - }, - "corner-radius-100": { - "prop": "--spectrum-corner-radius-100", - "value": "4px" - }, - "corner-radius-1000": { - "prop": "--spectrum-corner-radius-1000", - "ref": 0.5, - "value": "9999px" - }, - "corner-radius-200": { - "prop": "--spectrum-corner-radius-200", - "value": "5px" - }, - "corner-radius-300": { - "prop": "--spectrum-corner-radius-300", - "value": "6px" - }, - "corner-radius-400": { - "prop": "--spectrum-corner-radius-400", - "value": "7px" - }, - "corner-radius-500": { - "prop": "--spectrum-corner-radius-500", - "value": "8px" - }, - "corner-radius-600": { - "prop": "--spectrum-corner-radius-600", - "value": "9px" - }, - "corner-radius-700": { - "prop": "--spectrum-corner-radius-700", - "value": "10px" - }, - "corner-radius-75": { - "prop": "--spectrum-corner-radius-75", - "value": "3px" - }, - "corner-radius-800": { - "prop": "--spectrum-corner-radius-800", - "value": "16px" - }, - "corner-radius-extra-large-default": { - "prop": "--spectrum-corner-radius-extra-large-default", - "ref": "var(--spectrum-corner-radius-800)", - "value": "16px" - }, - "corner-radius-full": { - "prop": "--spectrum-corner-radius-full", - "ref": "var(--spectrum-corner-radius-1000)", - "value": "9999px" - }, - "corner-radius-large-default": { - "prop": "--spectrum-corner-radius-large-default", - "ref": "var(--spectrum-corner-radius-700)", - "value": "10px" - }, - "corner-radius-medium-default": { - "prop": "--spectrum-corner-radius-medium-default", - "ref": "var(--spectrum-corner-radius-500)", - "value": "8px" - }, - "corner-radius-medium-size-extra-large": { - "prop": "--spectrum-corner-radius-medium-size-extra-large", - "ref": "var(--spectrum-corner-radius-700)", - "value": "10px" - }, - "corner-radius-medium-size-extra-small": { - "prop": "--spectrum-corner-radius-medium-size-extra-small", - "ref": "var(--spectrum-corner-radius-300)", - "value": "6px" - }, - "corner-radius-medium-size-large": { - "prop": "--spectrum-corner-radius-medium-size-large", - "ref": "var(--spectrum-corner-radius-600)", - "value": "9px" - }, - "corner-radius-medium-size-medium": { - "prop": "--spectrum-corner-radius-medium-size-medium", - "ref": "var(--spectrum-corner-radius-500)", - "value": "8px" - }, - "corner-radius-medium-size-small": { - "prop": "--spectrum-corner-radius-medium-size-small", - "ref": "var(--spectrum-corner-radius-400)", - "value": "7px" - }, - "corner-radius-none": { - "prop": "--spectrum-corner-radius-none", - "ref": "var(--spectrum-corner-radius-0)", - "value": "0px" - }, - "corner-radius-small-default": { - "prop": "--spectrum-corner-radius-small-default", - "ref": "var(--spectrum-corner-radius-100)", - "value": "4px" - }, - "corner-radius-small-size-extra-large": { - "prop": "--spectrum-corner-radius-small-size-extra-large", - "ref": "var(--spectrum-corner-radius-300)", - "value": "6px" - }, - "corner-radius-small-size-large": { - "prop": "--spectrum-corner-radius-small-size-large", - "ref": "var(--spectrum-corner-radius-200)", - "value": "5px" - }, - "corner-radius-small-size-medium": { - "prop": "--spectrum-corner-radius-small-size-medium", - "ref": "var(--spectrum-corner-radius-100)", - "value": "4px" - }, - "corner-radius-small-size-small": { - "prop": "--spectrum-corner-radius-small-size-small", - "ref": "var(--spectrum-corner-radius-75)", - "value": "3px" - }, - "corner-triangle-icon-size-100": { - "prop": "--spectrum-corner-triangle-icon-size-100", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "corner-triangle-icon-size-200": { - "prop": "--spectrum-corner-triangle-icon-size-200", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "corner-triangle-icon-size-300": { - "prop": "--spectrum-corner-triangle-icon-size-300", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "8px" - } - }, - "corner-triangle-icon-size-75": { - "prop": "--spectrum-corner-triangle-icon-size-75", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "cross-icon-size-100": { - "prop": "--spectrum-cross-icon-size-100", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "cross-icon-size-200": { - "prop": "--spectrum-cross-icon-size-200", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "cross-icon-size-300": { - "prop": "--spectrum-cross-icon-size-300", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "cross-icon-size-400": { - "prop": "--spectrum-cross-icon-size-400", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "cross-icon-size-500": { - "prop": "--spectrum-cross-icon-size-500", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "cross-icon-size-600": { - "prop": "--spectrum-cross-icon-size-600", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "cross-icon-size-75": { - "prop": "--spectrum-cross-icon-size-75", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "cyan-100": { - "prop": "--spectrum-cyan-100", - "light": { - "value": "rgb(238, 250, 254)" - }, - "dark": { - "value": "rgb(0, 29, 39)" - } - }, - "cyan-1000": { - "prop": "--spectrum-cyan-1000", - "light": { - "value": "rgb(4, 102, 145)" - }, - "dark": { - "value": "rgb(38, 159, 244)" - } - }, - "cyan-1100": { - "prop": "--spectrum-cyan-1100", - "light": { - "value": "rgb(0, 87, 121)" - }, - "dark": { - "value": "rgb(63, 177, 255)" - } - }, - "cyan-1200": { - "prop": "--spectrum-cyan-1200", - "light": { - "value": "rgb(0, 71, 98)" - }, - "dark": { - "value": "rgb(107, 199, 255)" - } - }, - "cyan-1300": { - "prop": "--spectrum-cyan-1300", - "light": { - "value": "rgb(0, 57, 78)" - }, - "dark": { - "value": "rgb(152, 219, 255)" - } - }, - "cyan-1400": { - "prop": "--spectrum-cyan-1400", - "light": { - "value": "rgb(0, 43, 59)" - }, - "dark": { - "value": "rgb(195, 236, 252)" - } - }, - "cyan-1500": { - "prop": "--spectrum-cyan-1500", - "dark": { - "value": "rgb(230, 248, 253)" - }, - "light": { - "value": "rgb(0, 31, 43)" - } - }, - "cyan-1600": { - "prop": "--spectrum-cyan-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 14, 20)" - } - }, - "cyan-200": { - "prop": "--spectrum-cyan-200", - "light": { - "value": "rgb(217, 244, 253)" - }, - "dark": { - "value": "rgb(0, 36, 49)" - } - }, - "cyan-300": { - "prop": "--spectrum-cyan-300", - "light": { - "value": "rgb(183, 231, 252)" - }, - "dark": { - "value": "rgb(0, 48, 65)" - } - }, - "cyan-400": { - "prop": "--spectrum-cyan-400", - "light": { - "value": "rgb(138, 213, 255)" - }, - "dark": { - "value": "rgb(0, 64, 88)" - } - }, - "cyan-500": { - "prop": "--spectrum-cyan-500", - "light": { - "value": "rgb(92, 192, 255)" - }, - "dark": { - "value": "rgb(0, 82, 113)" - } - }, - "cyan-600": { - "prop": "--spectrum-cyan-600", - "light": { - "value": "rgb(48, 167, 254)" - }, - "dark": { - "value": "rgb(3, 99, 140)" - } - }, - "cyan-700": { - "prop": "--spectrum-cyan-700", - "light": { - "value": "rgb(29, 149, 231)" - }, - "dark": { - "value": "rgb(8, 115, 168)" - } - }, - "cyan-800": { - "prop": "--spectrum-cyan-800", - "light": { - "value": "rgb(18, 134, 205)" - }, - "dark": { - "value": "rgb(13, 125, 186)" - } - }, - "cyan-900": { - "prop": "--spectrum-cyan-900", - "light": { - "value": "rgb(11, 120, 179)" - }, - "dark": { - "value": "rgb(24, 142, 220)" - } - }, - "cyan-background-color-default": { - "prop": "--spectrum-cyan-background-color-default", - "ref": "var(--spectrum-cyan-800)", - "light": { - "value": "rgb(11, 120, 179)" - }, - "dark": { - "value": "rgb(13, 125, 186)" - } - }, - "cyan-subtle-background-color-default": { - "prop": "--spectrum-cyan-subtle-background-color-default", - "ref": "var(--spectrum-cyan-300)", - "light": { - "value": "rgb(217, 244, 253)" - }, - "dark": { - "value": "rgb(0, 48, 65)" - } - }, - "cyan-visual-color": { - "prop": "--spectrum-cyan-visual-color", - "ref": "var(--spectrum-cyan-900)", - "light": { - "value": "rgb(48, 167, 254)" - }, - "dark": { - "value": "rgb(24, 142, 220)" - } - }, - "dash-icon-size-100": { - "prop": "--spectrum-dash-icon-size-100", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "dash-icon-size-200": { - "prop": "--spectrum-dash-icon-size-200", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "dash-icon-size-300": { - "prop": "--spectrum-dash-icon-size-300", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "dash-icon-size-400": { - "prop": "--spectrum-dash-icon-size-400", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "dash-icon-size-50": { - "prop": "--spectrum-dash-icon-size-50", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "dash-icon-size-500": { - "prop": "--spectrum-dash-icon-size-500", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "dash-icon-size-600": { - "prop": "--spectrum-dash-icon-size-600", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "dash-icon-size-75": { - "prop": "--spectrum-dash-icon-size-75", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "date-field-minimum-width": { - "prop": "--spectrum-date-field-minimum-width", - "value": "152px" - }, - "date-field-text-to-visual": { - "prop": "--spectrum-date-field-text-to-visual", - "value": "20px" - }, - "date-picker-minimum-width": { - "prop": "--spectrum-date-picker-minimum-width", - "value": "152px" - }, - "date-picker-text-to-visual": { - "prop": "--spectrum-date-picker-text-to-visual", - "value": "0px" - }, - "date-picker-visual-to-field-button": { - "prop": "--spectrum-date-picker-visual-to-field-button", - "value": "0px" - }, - "default-font-family": { - "prop": "--spectrum-default-font-family", - "ref": "var(--spectrum-sans-serif-font-family)", - "value": "Adobe Clean" - }, - "default-font-style": { - "prop": "--spectrum-default-font-style", - "value": "normal" - }, - "detail-cjk-emphasized-font-style": { - "prop": "--spectrum-detail-cjk-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-emphasized-font-weight": { - "prop": "--spectrum-detail-cjk-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "detail-cjk-font-family": { - "prop": "--spectrum-detail-cjk-font-family", - "ref": "var(--spectrum-cjk-font-family)", - "value": "Adobe Clean Han" - }, - "detail-cjk-font-style": { - "prop": "--spectrum-detail-cjk-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-font-weight": { - "prop": "--spectrum-detail-cjk-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "detail-cjk-light-emphasized-font-style": { - "prop": "--spectrum-detail-cjk-light-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-light-emphasized-font-weight": { - "prop": "--spectrum-detail-cjk-light-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-cjk-light-font-style": { - "prop": "--spectrum-detail-cjk-light-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-light-font-weight": { - "prop": "--spectrum-detail-cjk-light-font-weight", - "ref": "var(--spectrum-light-font-weight)", - "value": "300" - }, - "detail-cjk-light-strong-emphasized-font-style": { - "prop": "--spectrum-detail-cjk-light-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-light-strong-emphasized-font-weight": { - "prop": "--spectrum-detail-cjk-light-strong-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "detail-cjk-light-strong-font-style": { - "prop": "--spectrum-detail-cjk-light-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-light-strong-font-weight": { - "prop": "--spectrum-detail-cjk-light-strong-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "detail-cjk-line-height": { - "prop": "--spectrum-detail-cjk-line-height", - "ref": "var(--spectrum-cjk-line-height-100)", - "value": 1.5 - }, - "detail-cjk-size-l": { - "prop": "--spectrum-detail-cjk-size-l", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "detail-cjk-size-m": { - "prop": "--spectrum-detail-cjk-size-m", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "detail-cjk-size-s": { - "prop": "--spectrum-detail-cjk-size-s", - "ref": "var(--spectrum-font-size-50)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "detail-cjk-size-xl": { - "prop": "--spectrum-detail-cjk-size-xl", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "detail-cjk-size-xs": { - "prop": "--spectrum-detail-cjk-size-xs", - "ref": "var(--spectrum-font-size-25)", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "detail-cjk-strong-emphasized-font-style": { - "prop": "--spectrum-detail-cjk-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-strong-emphasized-font-weight": { - "prop": "--spectrum-detail-cjk-strong-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "detail-cjk-strong-font-style": { - "prop": "--spectrum-detail-cjk-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-cjk-strong-font-weight": { - "prop": "--spectrum-detail-cjk-strong-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "detail-color": { - "prop": "--spectrum-detail-color", - "ref": "var(--spectrum-gray-600)", - "light": { - "value": "rgb(113, 113, 113)" - }, - "dark": { - "value": "rgb(138, 138, 138)" - } - }, - "detail-letter-spacing": { - "prop": "--spectrum-detail-letter-spacing", - "value": "0.06em" - }, - "detail-line-height": { - "prop": "--spectrum-detail-line-height", - "ref": "var(--spectrum-line-height-100)", - "value": 1.3 - }, - "detail-margin-bottom-multiplier": { - "prop": "--spectrum-detail-margin-bottom-multiplier", - "value": 0.25 - }, - "detail-margin-top-multiplier": { - "prop": "--spectrum-detail-margin-top-multiplier", - "value": 0.88888889 - }, - "detail-sans-serif-emphasized-font-style": { - "prop": "--spectrum-detail-sans-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-sans-serif-emphasized-font-weight": { - "prop": "--spectrum-detail-sans-serif-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-sans-serif-font-family": { - "prop": "--spectrum-detail-sans-serif-font-family", - "ref": "var(--spectrum-sans-serif-font-family)", - "value": "Adobe Clean" - }, - "detail-sans-serif-font-style": { - "prop": "--spectrum-detail-sans-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-sans-serif-font-weight": { - "prop": "--spectrum-detail-sans-serif-font-weight", - "ref": "var(--spectrum-medium-font-weight)", - "value": "500" - }, - "detail-sans-serif-light-emphasized-font-style": { - "prop": "--spectrum-detail-sans-serif-light-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-sans-serif-light-emphasized-font-weight": { - "prop": "--spectrum-detail-sans-serif-light-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-sans-serif-light-font-style": { - "prop": "--spectrum-detail-sans-serif-light-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-sans-serif-light-font-weight": { - "prop": "--spectrum-detail-sans-serif-light-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-sans-serif-light-strong-emphasized-font-style": { - "prop": "--spectrum-detail-sans-serif-light-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-sans-serif-light-strong-emphasized-font-weight": { - "prop": "--spectrum-detail-sans-serif-light-strong-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-sans-serif-light-strong-font-style": { - "prop": "--spectrum-detail-sans-serif-light-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-sans-serif-light-strong-font-weight": { - "prop": "--spectrum-detail-sans-serif-light-strong-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-sans-serif-strong-emphasized-font-style": { - "prop": "--spectrum-detail-sans-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-sans-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-detail-sans-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "detail-sans-serif-strong-font-style": { - "prop": "--spectrum-detail-sans-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-sans-serif-strong-font-weight": { - "prop": "--spectrum-detail-sans-serif-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "detail-sans-serif-text-transform": { - "prop": "--spectrum-detail-sans-serif-text-transform", - "value": "uppercase" - }, - "detail-serif-emphasized-font-style": { - "prop": "--spectrum-detail-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-serif-emphasized-font-weight": { - "prop": "--spectrum-detail-serif-emphasized-font-weight", - "ref": "var(--spectrum-medium-font-weight)", - "value": "500" - }, - "detail-serif-font-family": { - "prop": "--spectrum-detail-serif-font-family", - "ref": "var(--spectrum-serif-font-family)", - "value": "Adobe Clean Serif" - }, - "detail-serif-font-style": { - "prop": "--spectrum-detail-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-serif-font-weight": { - "prop": "--spectrum-detail-serif-font-weight", - "ref": "var(--spectrum-medium-font-weight)", - "value": "500" - }, - "detail-serif-light-emphasized-font-style": { - "prop": "--spectrum-detail-serif-light-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-serif-light-emphasized-font-weight": { - "prop": "--spectrum-detail-serif-light-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-serif-light-font-style": { - "prop": "--spectrum-detail-serif-light-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-serif-light-font-weight": { - "prop": "--spectrum-detail-serif-light-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-serif-light-strong-emphasized-font-style": { - "prop": "--spectrum-detail-serif-light-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-serif-light-strong-emphasized-font-weight": { - "prop": "--spectrum-detail-serif-light-strong-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-serif-light-strong-font-style": { - "prop": "--spectrum-detail-serif-light-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-serif-light-strong-font-weight": { - "prop": "--spectrum-detail-serif-light-strong-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "detail-serif-strong-emphasized-font-style": { - "prop": "--spectrum-detail-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "detail-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-detail-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "detail-serif-strong-font-style": { - "prop": "--spectrum-detail-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "detail-serif-strong-font-weight": { - "prop": "--spectrum-detail-serif-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "detail-serif-text-transform": { - "prop": "--spectrum-detail-serif-text-transform", - "value": "uppercase" - }, - "detail-size-l": { - "prop": "--spectrum-detail-size-l", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "detail-size-m": { - "prop": "--spectrum-detail-size-m", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "detail-size-s": { - "prop": "--spectrum-detail-size-s", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "detail-size-xl": { - "prop": "--spectrum-detail-size-xl", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "detail-size-xs": { - "prop": "--spectrum-detail-size-xs", - "ref": "var(--spectrum-font-size-50)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "disabled-background-color": { - "prop": "--spectrum-disabled-background-color", - "ref": "var(--spectrum-gray-100)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "disabled-border-color": { - "prop": "--spectrum-disabled-border-color", - "ref": "var(--spectrum-gray-300)", - "light": { - "value": "rgb(218, 218, 218)" - }, - "dark": { - "value": "rgb(57, 57, 57)" - } - }, - "disabled-content-color": { - "prop": "--spectrum-disabled-content-color", - "ref": "var(--spectrum-gray-400)", - "light": { - "value": "rgb(198, 198, 198)" - }, - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "disabled-static-black-background-color": { - "prop": "--spectrum-disabled-static-black-background-color", - "ref": "var(--spectrum-transparent-black-100)", - "value": "rgba(0, 0, 0, 0.09)" - }, - "disabled-static-black-border-color": { - "prop": "--spectrum-disabled-static-black-border-color", - "ref": "var(--spectrum-transparent-black-300)", - "value": "rgba(0, 0, 0, 0.15)" - }, - "disabled-static-black-content-color": { - "prop": "--spectrum-disabled-static-black-content-color", - "ref": "var(--spectrum-transparent-black-400)", - "value": "rgba(0, 0, 0, 0.22)" - }, - "disabled-static-white-background-color": { - "prop": "--spectrum-disabled-static-white-background-color", - "ref": "var(--spectrum-transparent-white-100)", - "value": "rgba(255, 255, 255, 0.11)" - }, - "disabled-static-white-border-color": { - "prop": "--spectrum-disabled-static-white-border-color", - "ref": "var(--spectrum-transparent-white-300)", - "value": "rgba(255, 255, 255, 0.17)" - }, - "disabled-static-white-content-color": { - "prop": "--spectrum-disabled-static-white-content-color", - "ref": "var(--spectrum-transparent-white-400)", - "value": "rgba(255, 255, 255, 0.21)" - }, - "disclosure-indicator-top-to-disclosure-icon-extra-large": { - "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "disclosure-indicator-top-to-disclosure-icon-large": { - "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "disclosure-indicator-top-to-disclosure-icon-medium": { - "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "disclosure-indicator-top-to-disclosure-icon-small": { - "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "divider-horizontal-minimum-width": { - "prop": "--spectrum-divider-horizontal-minimum-width", - "value": "200px" - }, - "divider-thickness-large": { - "prop": "--spectrum-divider-thickness-large", - "value": "4px" - }, - "divider-thickness-medium": { - "prop": "--spectrum-divider-thickness-medium", - "value": "2px" - }, - "divider-thickness-small": { - "prop": "--spectrum-divider-thickness-small", - "value": "1px" - }, - "divider-vertical-minimum-height": { - "prop": "--spectrum-divider-vertical-minimum-height", - "value": "200px" - }, - "double-calendar-popover-minimum-height": { - "prop": "--spectrum-double-calendar-popover-minimum-height", - "value": "320px" - }, - "double-calendar-popover-minimum-width": { - "prop": "--spectrum-double-calendar-popover-minimum-width", - "value": "616px" - }, - "drop-shadow-blur": { - "prop": "--spectrum-drop-shadow-blur", - "ref": "var(--spectrum-drop-shadow-blur-100)", - "value": "6px" - }, - "drop-shadow-blur-100": { - "prop": "--spectrum-drop-shadow-blur-100", - "value": "6px" - }, - "drop-shadow-blur-200": { - "prop": "--spectrum-drop-shadow-blur-200", - "value": "8px" - }, - "drop-shadow-blur-300": { - "prop": "--spectrum-drop-shadow-blur-300", - "value": "16px" - }, - "drop-shadow-color": { - "prop": "--spectrum-drop-shadow-color", - "ref": "var(--spectrum-drop-shadow-color-100)", - "light": { - "value": "rgba(0, 0, 0, 0.12)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.36)" - } - }, - "drop-shadow-color-100": { - "prop": "--spectrum-drop-shadow-color-100", - "light": { - "value": "rgba(0, 0, 0, 0.12)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.36)" - } - }, - "drop-shadow-color-200": { - "prop": "--spectrum-drop-shadow-color-200", - "light": { - "value": "rgba(0, 0, 0, 0.16)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.48)" - } - }, - "drop-shadow-color-300": { - "prop": "--spectrum-drop-shadow-color-300", - "light": { - "value": "rgba(0, 0, 0, 0.2)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.6)" - } - }, - "drop-shadow-dragged-blur": { - "prop": "--spectrum-drop-shadow-dragged-blur", - "ref": "var(--spectrum-drop-shadow-blur-300)", - "value": "16px" - }, - "drop-shadow-dragged-color": { - "prop": "--spectrum-drop-shadow-dragged-color", - "ref": "var(--spectrum-drop-shadow-color-300)", - "light": { - "value": "rgba(0, 0, 0, 0.2)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.6)" - } - }, - "drop-shadow-dragged-x": { - "prop": "--spectrum-drop-shadow-dragged-x", - "ref": "var(--spectrum-drop-shadow-x-300)", - "value": "0px" - }, - "drop-shadow-dragged-y": { - "prop": "--spectrum-drop-shadow-dragged-y", - "ref": "var(--spectrum-drop-shadow-y-300)", - "value": "6px" - }, - "drop-shadow-elevated-blur": { - "prop": "--spectrum-drop-shadow-elevated-blur", - "ref": "var(--spectrum-drop-shadow-blur-200)", - "value": "8px" - }, - "drop-shadow-elevated-color": { - "prop": "--spectrum-drop-shadow-elevated-color", - "ref": "var(--spectrum-drop-shadow-color-200)", - "light": { - "value": "rgba(0, 0, 0, 0.16)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.48)" - } - }, - "drop-shadow-elevated-x": { - "prop": "--spectrum-drop-shadow-elevated-x", - "ref": "var(--spectrum-drop-shadow-x-200)", - "value": "0px" - }, - "drop-shadow-elevated-y": { - "prop": "--spectrum-drop-shadow-elevated-y", - "ref": "var(--spectrum-drop-shadow-y-200)", - "value": "2px" - }, - "drop-shadow-emphasized-default-blur": { - "prop": "--spectrum-drop-shadow-emphasized-default-blur", - "ref": "var(--spectrum-drop-shadow-blur-100)", - "value": "6px" - }, - "drop-shadow-emphasized-default-color": { - "prop": "--spectrum-drop-shadow-emphasized-default-color", - "ref": "var(--spectrum-drop-shadow-color-100)", - "light": { - "value": "rgba(0, 0, 0, 0.12)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.36)" - } - }, - "drop-shadow-emphasized-default-x": { - "prop": "--spectrum-drop-shadow-emphasized-default-x", - "ref": "var(--spectrum-drop-shadow-x-100)", - "value": "0px" - }, - "drop-shadow-emphasized-default-y": { - "prop": "--spectrum-drop-shadow-emphasized-default-y", - "ref": "var(--spectrum-drop-shadow-y-100)", - "value": "1px" - }, - "drop-shadow-emphasized-hover-blur": { - "prop": "--spectrum-drop-shadow-emphasized-hover-blur", - "ref": "var(--spectrum-drop-shadow-blur-200)", - "value": "8px" - }, - "drop-shadow-emphasized-hover-color": { - "prop": "--spectrum-drop-shadow-emphasized-hover-color", - "ref": "var(--spectrum-drop-shadow-color-200)", - "light": { - "value": "rgba(0, 0, 0, 0.16)" - }, - "dark": { - "value": "rgba(0, 0, 0, 0.48)" - } - }, - "drop-shadow-emphasized-hover-x": { - "prop": "--spectrum-drop-shadow-emphasized-hover-x", - "ref": "var(--spectrum-drop-shadow-x-200)", - "value": "0px" - }, - "drop-shadow-emphasized-hover-y": { - "prop": "--spectrum-drop-shadow-emphasized-hover-y", - "ref": "var(--spectrum-drop-shadow-y-200)", - "value": "2px" - }, - "drop-shadow-x": { - "prop": "--spectrum-drop-shadow-x", - "ref": "var(--spectrum-drop-shadow-x-100)", - "value": "0px" - }, - "drop-shadow-x-100": { - "prop": "--spectrum-drop-shadow-x-100", - "value": "0px" - }, - "drop-shadow-x-200": { - "prop": "--spectrum-drop-shadow-x-200", - "value": "0px" - }, - "drop-shadow-x-300": { - "prop": "--spectrum-drop-shadow-x-300", - "value": "0px" - }, - "drop-shadow-y": { - "prop": "--spectrum-drop-shadow-y", - "ref": "var(--spectrum-drop-shadow-y-100)", - "value": "1px" - }, - "drop-shadow-y-100": { - "prop": "--spectrum-drop-shadow-y-100", - "value": "1px" - }, - "drop-shadow-y-200": { - "prop": "--spectrum-drop-shadow-y-200", - "value": "2px" - }, - "drop-shadow-y-300": { - "prop": "--spectrum-drop-shadow-y-300", - "value": "6px" - }, - "drop-zone-background-color": { - "prop": "--spectrum-drop-zone-background-color", - "ref": "var(--spectrum-accent-color-900)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "drop-zone-background-color-opacity": { - "prop": "--spectrum-drop-zone-background-color-opacity", - "value": "0.1" - }, - "drop-zone-background-color-opacity-filled": { - "prop": "--spectrum-drop-zone-background-color-opacity-filled", - "value": "0.3" - }, - "drop-zone-body-font-size": { - "prop": "--spectrum-drop-zone-body-font-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "drop-zone-body-size": { - "prop": "--spectrum-drop-zone-body-size", - "ref": "var(--spectrum-drop-zone-body-font-size)", - "value": "{drop-zone-body-font-size}" - }, - "drop-zone-border-dash-gap": { - "prop": "--spectrum-drop-zone-border-dash-gap", - "value": "6px" - }, - "drop-zone-border-dash-length": { - "prop": "--spectrum-drop-zone-border-dash-length", - "value": "8px" - }, - "drop-zone-cjk-title-font-size": { - "prop": "--spectrum-drop-zone-cjk-title-font-size", - "ref": "var(--spectrum-title-cjk-size-l)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "19px" - } - }, - "drop-zone-cjk-title-size": { - "prop": "--spectrum-drop-zone-cjk-title-size", - "ref": "var(--spectrum-drop-zone-cjk-title-font-size)", - "value": "{drop-zone-cjk-title-font-size}" - }, - "drop-zone-content-maximum-width": { - "prop": "--spectrum-drop-zone-content-maximum-width", - "ref": "var(--spectrum-illustrated-message-maximum-width)", - "value": "380px" - }, - "drop-zone-title-font-size": { - "prop": "--spectrum-drop-zone-title-font-size", - "ref": "var(--spectrum-title-size-l)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "drop-zone-title-size": { - "prop": "--spectrum-drop-zone-title-size", - "ref": "var(--spectrum-drop-zone-title-font-size)", - "value": "{drop-zone-title-font-size}" - }, - "drop-zone-width": { - "prop": "--spectrum-drop-zone-width", - "value": "428px" - }, - "extra-bold-font-weight": { - "prop": "--spectrum-extra-bold-font-weight", - "ref": "extra-bold", - "value": "800" - }, - "field-default-width-extra-large": { - "prop": "--spectrum-field-default-width-extra-large", - "desktop": { - "value": "240px" - }, - "mobile": { - "value": "288px" - } - }, - "field-default-width-large": { - "prop": "--spectrum-field-default-width-large", - "desktop": { - "value": "224px" - }, - "mobile": { - "value": "272px" - } - }, - "field-default-width-medium": { - "prop": "--spectrum-field-default-width-medium", - "desktop": { - "value": "208px" - }, - "mobile": { - "value": "256px" - } - }, - "field-default-width-small": { - "prop": "--spectrum-field-default-width-small", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "field-edge-to-alert-icon-extra-large": { - "prop": "--spectrum-field-edge-to-alert-icon-extra-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "field-edge-to-alert-icon-large": { - "prop": "--spectrum-field-edge-to-alert-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "field-edge-to-alert-icon-medium": { - "prop": "--spectrum-field-edge-to-alert-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "field-edge-to-alert-icon-quiet": { - "prop": "--spectrum-field-edge-to-alert-icon-quiet", - "value": "0px" - }, - "field-edge-to-alert-icon-small": { - "prop": "--spectrum-field-edge-to-alert-icon-small", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "field-edge-to-border-quiet": { - "prop": "--spectrum-field-edge-to-border-quiet", - "value": "0px" - }, - "field-edge-to-disclosure-icon-100": { - "prop": "--spectrum-field-edge-to-disclosure-icon-100", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "field-edge-to-disclosure-icon-200": { - "prop": "--spectrum-field-edge-to-disclosure-icon-200", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "field-edge-to-disclosure-icon-300": { - "prop": "--spectrum-field-edge-to-disclosure-icon-300", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "field-edge-to-disclosure-icon-75": { - "prop": "--spectrum-field-edge-to-disclosure-icon-75", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "field-edge-to-text-quiet": { - "prop": "--spectrum-field-edge-to-text-quiet", - "value": "0px" - }, - "field-edge-to-validation-icon-extra-large": { - "prop": "--spectrum-field-edge-to-validation-icon-extra-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "field-edge-to-validation-icon-large": { - "prop": "--spectrum-field-edge-to-validation-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "field-edge-to-validation-icon-medium": { - "prop": "--spectrum-field-edge-to-validation-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "field-edge-to-validation-icon-quiet": { - "prop": "--spectrum-field-edge-to-validation-icon-quiet", - "value": "0px" - }, - "field-edge-to-validation-icon-small": { - "prop": "--spectrum-field-edge-to-validation-icon-small", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "field-edge-to-visual-quiet": { - "prop": "--spectrum-field-edge-to-visual-quiet", - "value": "0px" - }, - "field-end-edge-to-disclosure-icon-100": { - "prop": "--spectrum-field-end-edge-to-disclosure-icon-100", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "field-end-edge-to-disclosure-icon-200": { - "prop": "--spectrum-field-end-edge-to-disclosure-icon-200", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "field-end-edge-to-disclosure-icon-300": { - "prop": "--spectrum-field-end-edge-to-disclosure-icon-300", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "field-end-edge-to-disclosure-icon-75": { - "prop": "--spectrum-field-end-edge-to-disclosure-icon-75", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "field-label-text-to-asterisk-extra-large": { - "prop": "--spectrum-field-label-text-to-asterisk-extra-large", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "field-label-text-to-asterisk-large": { - "prop": "--spectrum-field-label-text-to-asterisk-large", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "field-label-text-to-asterisk-medium": { - "prop": "--spectrum-field-label-text-to-asterisk-medium", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "field-label-text-to-asterisk-small": { - "prop": "--spectrum-field-label-text-to-asterisk-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "field-label-to-component": { - "prop": "--spectrum-field-label-to-component", - "value": "0px" - }, - "field-label-to-component-quiet-extra-large": { - "prop": "--spectrum-field-label-to-component-quiet-extra-large", - "desktop": { - "value": "-15px" - }, - "mobile": { - "value": "-19px" - } - }, - "field-label-to-component-quiet-large": { - "prop": "--spectrum-field-label-to-component-quiet-large", - "desktop": { - "value": "-12px" - }, - "mobile": { - "value": "-15px" - } - }, - "field-label-to-component-quiet-medium": { - "prop": "--spectrum-field-label-to-component-quiet-medium", - "desktop": { - "value": "-8px" - }, - "mobile": { - "value": "-10px" - } - }, - "field-label-to-component-quiet-small": { - "prop": "--spectrum-field-label-to-component-quiet-small", - "desktop": { - "value": "-8px" - }, - "mobile": { - "value": "-10px" - } - }, - "field-label-top-margin-extra-large": { - "prop": "--spectrum-field-label-top-margin-extra-large", - "value": "0px" - }, - "field-label-top-margin-large": { - "prop": "--spectrum-field-label-top-margin-large", - "value": "0px" - }, - "field-label-top-margin-medium": { - "prop": "--spectrum-field-label-top-margin-medium", - "value": "0px" - }, - "field-label-top-margin-small": { - "prop": "--spectrum-field-label-top-margin-small", - "value": "0px" - }, - "field-label-top-to-asterisk-extra-large": { - "prop": "--spectrum-field-label-top-to-asterisk-extra-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "24px" - } - }, - "field-label-top-to-asterisk-large": { - "prop": "--spectrum-field-label-top-to-asterisk-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "field-label-top-to-asterisk-medium": { - "prop": "--spectrum-field-label-top-to-asterisk-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "field-label-top-to-asterisk-small": { - "prop": "--spectrum-field-label-top-to-asterisk-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "11px" - } - }, - "field-text-to-alert-icon-extra-large": { - "prop": "--spectrum-field-text-to-alert-icon-extra-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "field-text-to-alert-icon-large": { - "prop": "--spectrum-field-text-to-alert-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "field-text-to-alert-icon-medium": { - "prop": "--spectrum-field-text-to-alert-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "field-text-to-alert-icon-small": { - "prop": "--spectrum-field-text-to-alert-icon-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "field-text-to-validation-icon-extra-large": { - "prop": "--spectrum-field-text-to-validation-icon-extra-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "field-text-to-validation-icon-large": { - "prop": "--spectrum-field-text-to-validation-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "field-text-to-validation-icon-medium": { - "prop": "--spectrum-field-text-to-validation-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "field-text-to-validation-icon-small": { - "prop": "--spectrum-field-text-to-validation-icon-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "field-top-to-alert-icon-extra-large": { - "prop": "--spectrum-field-top-to-alert-icon-extra-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "16px" - } - }, - "field-top-to-alert-icon-large": { - "prop": "--spectrum-field-top-to-alert-icon-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "field-top-to-alert-icon-medium": { - "prop": "--spectrum-field-top-to-alert-icon-medium", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "field-top-to-alert-icon-small": { - "prop": "--spectrum-field-top-to-alert-icon-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "field-top-to-disclosure-icon-100": { - "prop": "--spectrum-field-top-to-disclosure-icon-100", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "field-top-to-disclosure-icon-200": { - "prop": "--spectrum-field-top-to-disclosure-icon-200", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "field-top-to-disclosure-icon-300": { - "prop": "--spectrum-field-top-to-disclosure-icon-300", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "field-top-to-disclosure-icon-75": { - "prop": "--spectrum-field-top-to-disclosure-icon-75", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "field-top-to-progress-circle-extra-large": { - "prop": "--spectrum-field-top-to-progress-circle-extra-large", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "field-top-to-progress-circle-large": { - "prop": "--spectrum-field-top-to-progress-circle-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "field-top-to-progress-circle-medium": { - "prop": "--spectrum-field-top-to-progress-circle-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "field-top-to-progress-circle-small": { - "prop": "--spectrum-field-top-to-progress-circle-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "6px" - } - }, - "field-top-to-validation-icon-extra-large": { - "prop": "--spectrum-field-top-to-validation-icon-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "field-top-to-validation-icon-large": { - "prop": "--spectrum-field-top-to-validation-icon-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "field-top-to-validation-icon-medium": { - "prop": "--spectrum-field-top-to-validation-icon-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "field-top-to-validation-icon-small": { - "prop": "--spectrum-field-top-to-validation-icon-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "field-width": { - "prop": "--spectrum-field-width", - "ref": "var(--spectrum-field-width-small)", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "field-width-extra-large": { - "prop": "--spectrum-field-width-extra-large", - "ref": "var(--spectrum-field-default-width-extra-large)", - "desktop": { - "value": "240px" - }, - "mobile": { - "value": "288px" - } - }, - "field-width-large": { - "prop": "--spectrum-field-width-large", - "ref": "var(--spectrum-field-default-width-large)", - "desktop": { - "value": "224px" - }, - "mobile": { - "value": "272px" - } - }, - "field-width-medium": { - "prop": "--spectrum-field-width-medium", - "ref": "var(--spectrum-field-default-width-medium)", - "desktop": { - "value": "208px" - }, - "mobile": { - "value": "256px" - } - }, - "field-width-small": { - "prop": "--spectrum-field-width-small", - "ref": "var(--spectrum-field-default-width-small)", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "floating-action-button-drop-shadow-blur": { - "prop": "--spectrum-floating-action-button-drop-shadow-blur", - "value": "12px" - }, - "floating-action-button-drop-shadow-color": { - "prop": "--spectrum-floating-action-button-drop-shadow-color", - "ref": "var(--spectrum-transparent-black-300)", - "value": "rgba(0, 0, 0, 0.15)" - }, - "floating-action-button-drop-shadow-y": { - "prop": "--spectrum-floating-action-button-drop-shadow-y", - "value": "4px" - }, - "floating-action-button-shadow-color": { - "prop": "--spectrum-floating-action-button-shadow-color", - "ref": "var(--spectrum-floating-action-button-drop-shadow-color)", - "value": "rgba(0, 0, 0, 0.15)" - }, - "focus-indicator-color": { - "prop": "--spectrum-focus-indicator-color", - "ref": "var(--spectrum-blue-800)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "focus-indicator-gap": { - "prop": "--spectrum-focus-indicator-gap", - "value": "2px" - }, - "focus-indicator-thickness": { - "prop": "--spectrum-focus-indicator-thickness", - "value": "2px" - }, - "font-size-100": { - "prop": "--spectrum-font-size-100", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "font-size-1000": { - "prop": "--spectrum-font-size-1000", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "49px" - } - }, - "font-size-1100": { - "prop": "--spectrum-font-size-1100", - "desktop": { - "value": "45px" - }, - "mobile": { - "value": "55px" - } - }, - "font-size-1200": { - "prop": "--spectrum-font-size-1200", - "desktop": { - "value": "51px" - }, - "mobile": { - "value": "62px" - } - }, - "font-size-1300": { - "prop": "--spectrum-font-size-1300", - "desktop": { - "value": "58px" - }, - "mobile": { - "value": "70px" - } - }, - "font-size-1400": { - "prop": "--spectrum-font-size-1400", - "desktop": { - "value": "65px" - }, - "mobile": { - "value": "79px" - } - }, - "font-size-1500": { - "prop": "--spectrum-font-size-1500", - "desktop": { - "value": "73px" - }, - "mobile": { - "value": "88px" - } - }, - "font-size-200": { - "prop": "--spectrum-font-size-200", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "font-size-25": { - "prop": "--spectrum-font-size-25", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "font-size-300": { - "prop": "--spectrum-font-size-300", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "font-size-400": { - "prop": "--spectrum-font-size-400", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "font-size-50": { - "prop": "--spectrum-font-size-50", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "font-size-500": { - "prop": "--spectrum-font-size-500", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "27px" - } - }, - "font-size-600": { - "prop": "--spectrum-font-size-600", - "desktop": { - "value": "25px" - }, - "mobile": { - "value": "31px" - } - }, - "font-size-700": { - "prop": "--spectrum-font-size-700", - "desktop": { - "value": "28px" - }, - "mobile": { - "value": "34px" - } - }, - "font-size-75": { - "prop": "--spectrum-font-size-75", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "font-size-800": { - "prop": "--spectrum-font-size-800", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "39px" - } - }, - "font-size-900": { - "prop": "--spectrum-font-size-900", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "44px" - } - }, - "fuchsia-100": { - "prop": "--spectrum-fuchsia-100", - "light": { - "value": "rgb(254, 246, 255)" - }, - "dark": { - "value": "rgb(50, 0, 61)" - } - }, - "fuchsia-1000": { - "prop": "--spectrum-fuchsia-1000", - "light": { - "value": "rgb(156, 40, 175)" - }, - "dark": { - "value": "rgb(232, 91, 253)" - } - }, - "fuchsia-1100": { - "prop": "--spectrum-fuchsia-1100", - "light": { - "value": "rgb(135, 27, 154)" - }, - "dark": { - "value": "rgb(240, 122, 255)" - } - }, - "fuchsia-1200": { - "prop": "--spectrum-fuchsia-1200", - "light": { - "value": "rgb(113, 15, 131)" - }, - "dark": { - "value": "rgb(245, 159, 255)" - } - }, - "fuchsia-1300": { - "prop": "--spectrum-fuchsia-1300", - "light": { - "value": "rgb(92, 4, 109)" - }, - "dark": { - "value": "rgb(248, 191, 255)" - } - }, - "fuchsia-1400": { - "prop": "--spectrum-fuchsia-1400", - "light": { - "value": "rgb(72, 0, 88)" - }, - "dark": { - "value": "rgb(251, 219, 255)" - } - }, - "fuchsia-1500": { - "prop": "--spectrum-fuchsia-1500", - "dark": { - "value": "rgb(253, 241, 255)" - }, - "light": { - "value": "rgb(54, 0, 66)" - } - }, - "fuchsia-1600": { - "prop": "--spectrum-fuchsia-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(29, 0, 35)" - } - }, - "fuchsia-200": { - "prop": "--spectrum-fuchsia-200", - "light": { - "value": "rgb(253, 233, 255)" - }, - "dark": { - "value": "rgb(61, 0, 74)" - } - }, - "fuchsia-300": { - "prop": "--spectrum-fuchsia-300", - "light": { - "value": "rgb(250, 211, 255)" - }, - "dark": { - "value": "rgb(79, 0, 95)" - } - }, - "fuchsia-400": { - "prop": "--spectrum-fuchsia-400", - "light": { - "value": "rgb(247, 181, 255)" - }, - "dark": { - "value": "rgb(102, 9, 120)" - } - }, - "fuchsia-500": { - "prop": "--spectrum-fuchsia-500", - "light": { - "value": "rgb(243, 147, 255)" - }, - "dark": { - "value": "rgb(127, 23, 146)" - } - }, - "fuchsia-600": { - "prop": "--spectrum-fuchsia-600", - "light": { - "value": "rgb(236, 105, 255)" - }, - "dark": { - "value": "rgb(151, 38, 170)" - } - }, - "fuchsia-700": { - "prop": "--spectrum-fuchsia-700", - "light": { - "value": "rgb(223, 77, 245)" - }, - "dark": { - "value": "rgb(173, 51, 192)" - } - }, - "fuchsia-800": { - "prop": "--spectrum-fuchsia-800", - "light": { - "value": "rgb(200, 68, 220)" - }, - "dark": { - "value": "rgb(186, 60, 206)" - } - }, - "fuchsia-900": { - "prop": "--spectrum-fuchsia-900", - "light": { - "value": "rgb(181, 57, 200)" - }, - "dark": { - "value": "rgb(213, 73, 235)" - } - }, - "fuchsia-background-color-default": { - "prop": "--spectrum-fuchsia-background-color-default", - "ref": "var(--spectrum-fuchsia-800)", - "light": { - "value": "rgb(181, 57, 200)" - }, - "dark": { - "value": "rgb(186, 60, 206)" - } - }, - "fuchsia-subtle-background-color-default": { - "prop": "--spectrum-fuchsia-subtle-background-color-default", - "ref": "var(--spectrum-fuchsia-300)", - "light": { - "value": "rgb(253, 233, 255)" - }, - "dark": { - "value": "rgb(79, 0, 95)" - } - }, - "fuchsia-visual-color": { - "prop": "--spectrum-fuchsia-visual-color", - "ref": "var(--spectrum-fuchsia-900)", - "light": { - "value": "rgb(200, 68, 220)" - }, - "dark": { - "value": "rgb(213, 73, 235)" - } - }, - "gradient-stop-1-genai": { - "prop": "--spectrum-gradient-stop-1-genai", - "value": 0 - }, - "gradient-stop-1-premium": { - "prop": "--spectrum-gradient-stop-1-premium", - "value": 0 - }, - "gradient-stop-2-genai": { - "prop": "--spectrum-gradient-stop-2-genai", - "value": 0.3333 - }, - "gradient-stop-2-premium": { - "prop": "--spectrum-gradient-stop-2-premium", - "value": 0.6666 - }, - "gradient-stop-3-genai": { - "prop": "--spectrum-gradient-stop-3-genai", - "value": 1 - }, - "gradient-stop-3-premium": { - "prop": "--spectrum-gradient-stop-3-premium", - "value": 1 - }, - "gray-100": { - "prop": "--spectrum-gray-100", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "gray-1000": { - "prop": "--spectrum-gray-1000", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 0, 0)" - } - }, - "gray-200": { - "prop": "--spectrum-gray-200", - "light": { - "value": "rgb(225, 225, 225)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "gray-25": { - "prop": "--spectrum-gray-25", - "dark": { - "value": "rgb(17, 17, 17)" - }, - "light": { - "value": "rgb(255, 255, 255)" - } - }, - "gray-300": { - "prop": "--spectrum-gray-300", - "light": { - "value": "rgb(218, 218, 218)" - }, - "dark": { - "value": "rgb(57, 57, 57)" - } - }, - "gray-400": { - "prop": "--spectrum-gray-400", - "light": { - "value": "rgb(198, 198, 198)" - }, - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "gray-50": { - "prop": "--spectrum-gray-50", - "light": { - "value": "rgb(248, 248, 248)" - }, - "dark": { - "value": "rgb(27, 27, 27)" - } - }, - "gray-500": { - "prop": "--spectrum-gray-500", - "light": { - "value": "rgb(143, 143, 143)" - }, - "dark": { - "value": "rgb(109, 109, 109)" - } - }, - "gray-600": { - "prop": "--spectrum-gray-600", - "light": { - "value": "rgb(113, 113, 113)" - }, - "dark": { - "value": "rgb(138, 138, 138)" - } - }, - "gray-700": { - "prop": "--spectrum-gray-700", - "light": { - "value": "rgb(80, 80, 80)" - }, - "dark": { - "value": "rgb(175, 175, 175)" - } - }, - "gray-75": { - "prop": "--spectrum-gray-75", - "light": { - "value": "rgb(243, 243, 243)" - }, - "dark": { - "value": "rgb(34, 34, 34)" - } - }, - "gray-800": { - "prop": "--spectrum-gray-800", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "gray-900": { - "prop": "--spectrum-gray-900", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "gray-background-color-default": { - "prop": "--spectrum-gray-background-color-default", - "ref": "var(--spectrum-gray-500)", - "light": { - "value": "rgb(80, 80, 80)" - }, - "dark": { - "value": "rgb(109, 109, 109)" - } - }, - "gray-subtle-background-color-default": { - "prop": "--spectrum-gray-subtle-background-color-default", - "ref": "var(--spectrum-gray-300)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(57, 57, 57)" - } - }, - "gray-visual-color": { - "prop": "--spectrum-gray-visual-color", - "ref": "var(--spectrum-gray-600)", - "light": { - "value": "rgb(143, 143, 143)" - }, - "dark": { - "value": "rgb(138, 138, 138)" - } - }, - "green-100": { - "prop": "--spectrum-green-100", - "light": { - "value": "rgb(237, 252, 241)" - }, - "dark": { - "value": "rgb(0, 30, 23)" - } - }, - "green-1000": { - "prop": "--spectrum-green-1000", - "light": { - "value": "rgb(3, 110, 69)" - }, - "dark": { - "value": "rgb(14, 175, 98)" - } - }, - "green-1100": { - "prop": "--spectrum-green-1100", - "light": { - "value": "rgb(2, 93, 60)" - }, - "dark": { - "value": "rgb(24, 193, 110)" - } - }, - "green-1200": { - "prop": "--spectrum-green-1200", - "light": { - "value": "rgb(1, 76, 52)" - }, - "dark": { - "value": "rgb(57, 215, 134)" - } - }, - "green-1300": { - "prop": "--spectrum-green-1300", - "light": { - "value": "rgb(0, 61, 44)" - }, - "dark": { - "value": "rgb(126, 231, 172)" - } - }, - "green-1400": { - "prop": "--spectrum-green-1400", - "light": { - "value": "rgb(0, 46, 34)" - }, - "dark": { - "value": "rgb(189, 241, 208)" - } - }, - "green-1500": { - "prop": "--spectrum-green-1500", - "dark": { - "value": "rgb(229, 250, 236)" - }, - "light": { - "value": "rgb(0, 33, 25)" - } - }, - "green-1600": { - "prop": "--spectrum-green-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 15, 12)" - } - }, - "green-200": { - "prop": "--spectrum-green-200", - "light": { - "value": "rgb(215, 247, 225)" - }, - "dark": { - "value": "rgb(0, 38, 29)" - } - }, - "green-300": { - "prop": "--spectrum-green-300", - "light": { - "value": "rgb(173, 238, 197)" - }, - "dark": { - "value": "rgb(0, 51, 38)" - } - }, - "green-400": { - "prop": "--spectrum-green-400", - "light": { - "value": "rgb(107, 227, 162)" - }, - "dark": { - "value": "rgb(0, 68, 48)" - } - }, - "green-500": { - "prop": "--spectrum-green-500", - "light": { - "value": "rgb(43, 209, 125)" - }, - "dark": { - "value": "rgb(2, 87, 58)" - } - }, - "green-600": { - "prop": "--spectrum-green-600", - "light": { - "value": "rgb(18, 184, 103)" - }, - "dark": { - "value": "rgb(3, 106, 67)" - } - }, - "green-700": { - "prop": "--spectrum-green-700", - "light": { - "value": "rgb(11, 164, 93)" - }, - "dark": { - "value": "rgb(4, 124, 75)" - } - }, - "green-800": { - "prop": "--spectrum-green-800", - "light": { - "value": "rgb(7, 147, 85)" - }, - "dark": { - "value": "rgb(6, 136, 80)" - } - }, - "green-900": { - "prop": "--spectrum-green-900", - "light": { - "value": "rgb(5, 131, 78)" - }, - "dark": { - "value": "rgb(9, 157, 89)" - } - }, - "green-background-color-default": { - "prop": "--spectrum-green-background-color-default", - "ref": "var(--spectrum-green-800)", - "light": { - "value": "rgb(5, 131, 78)" - }, - "dark": { - "value": "rgb(6, 136, 80)" - } - }, - "green-subtle-background-color-default": { - "prop": "--spectrum-green-subtle-background-color-default", - "ref": "var(--spectrum-green-300)", - "light": { - "value": "rgb(215, 247, 225)" - }, - "dark": { - "value": "rgb(0, 51, 38)" - } - }, - "green-visual-color": { - "prop": "--spectrum-green-visual-color", - "ref": "var(--spectrum-green-800)", - "light": { - "value": "rgb(11, 164, 93)" - }, - "dark": { - "value": "rgb(6, 136, 80)" - } - }, - "heading-cjk-emphasized-font-style": { - "prop": "--spectrum-heading-cjk-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-emphasized-font-weight": { - "prop": "--spectrum-heading-cjk-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-cjk-font-family": { - "prop": "--spectrum-heading-cjk-font-family", - "ref": "var(--spectrum-cjk-font-family)", - "value": "Adobe Clean Han" - }, - "heading-cjk-font-style": { - "prop": "--spectrum-heading-cjk-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-font-weight": { - "prop": "--spectrum-heading-cjk-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "heading-cjk-heavy-emphasized-font-style": { - "prop": "--spectrum-heading-cjk-heavy-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-heavy-emphasized-font-weight": { - "prop": "--spectrum-heading-cjk-heavy-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-cjk-heavy-font-style": { - "prop": "--spectrum-heading-cjk-heavy-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-heavy-font-weight": { - "prop": "--spectrum-heading-cjk-heavy-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "heading-cjk-heavy-strong-emphasized-font-style": { - "prop": "--spectrum-heading-cjk-heavy-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-heavy-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-cjk-heavy-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-cjk-heavy-strong-font-style": { - "prop": "--spectrum-heading-cjk-heavy-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-heavy-strong-font-weight": { - "prop": "--spectrum-heading-cjk-heavy-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-cjk-light-emphasized-font-style": { - "prop": "--spectrum-heading-cjk-light-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-light-emphasized-font-weight": { - "prop": "--spectrum-heading-cjk-light-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "heading-cjk-light-font-style": { - "prop": "--spectrum-heading-cjk-light-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-light-font-weight": { - "prop": "--spectrum-heading-cjk-light-font-weight", - "ref": "var(--spectrum-light-font-weight)", - "value": "300" - }, - "heading-cjk-light-strong-emphasized-font-style": { - "prop": "--spectrum-heading-cjk-light-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-light-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-cjk-light-strong-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "heading-cjk-light-strong-font-style": { - "prop": "--spectrum-heading-cjk-light-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-light-strong-font-weight": { - "prop": "--spectrum-heading-cjk-light-strong-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "heading-cjk-line-height": { - "prop": "--spectrum-heading-cjk-line-height", - "ref": "var(--spectrum-cjk-line-height-100)", - "value": 1.5 - }, - "heading-cjk-size-l": { - "prop": "--spectrum-heading-cjk-size-l", - "ref": "var(--spectrum-font-size-600)", - "desktop": { - "value": "25px" - }, - "mobile": { - "value": "31px" - } - }, - "heading-cjk-size-m": { - "prop": "--spectrum-heading-cjk-size-m", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "heading-cjk-size-s": { - "prop": "--spectrum-heading-cjk-size-s", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "heading-cjk-size-xl": { - "prop": "--spectrum-heading-cjk-size-xl", - "ref": "var(--spectrum-font-size-800)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "39px" - } - }, - "heading-cjk-size-xs": { - "prop": "--spectrum-heading-cjk-size-xs", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "heading-cjk-size-xxl": { - "prop": "--spectrum-heading-cjk-size-xxl", - "ref": "var(--spectrum-font-size-1000)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "49px" - } - }, - "heading-cjk-size-xxs": { - "prop": "--spectrum-heading-cjk-size-xxs", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "heading-cjk-size-xxxl": { - "prop": "--spectrum-heading-cjk-size-xxxl", - "ref": "var(--spectrum-font-size-1200)", - "desktop": { - "value": "51px" - }, - "mobile": { - "value": "62px" - } - }, - "heading-cjk-size-xxxxl": { - "prop": "--spectrum-heading-cjk-size-xxxxl", - "ref": "var(--spectrum-font-size-1400)", - "desktop": { - "value": "65px" - }, - "mobile": { - "value": "79px" - } - }, - "heading-cjk-strong-emphasized-font-style": { - "prop": "--spectrum-heading-cjk-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-cjk-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-cjk-strong-font-style": { - "prop": "--spectrum-heading-cjk-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-cjk-strong-font-weight": { - "prop": "--spectrum-heading-cjk-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-color": { - "prop": "--spectrum-heading-color", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "heading-line-height": { - "prop": "--spectrum-heading-line-height", - "ref": "var(--spectrum-line-height-100)", - "value": 1.3 - }, - "heading-margin-bottom-multiplier": { - "prop": "--spectrum-heading-margin-bottom-multiplier", - "value": 0.25 - }, - "heading-margin-top-multiplier": { - "prop": "--spectrum-heading-margin-top-multiplier", - "value": 0.88888889 - }, - "heading-sans-serif-emphasized-font-style": { - "prop": "--spectrum-heading-sans-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-sans-serif-emphasized-font-weight": { - "prop": "--spectrum-heading-sans-serif-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "heading-sans-serif-font-family": { - "prop": "--spectrum-heading-sans-serif-font-family", - "ref": "var(--spectrum-sans-serif-font-family)", - "value": "Adobe Clean" - }, - "heading-sans-serif-font-style": { - "prop": "--spectrum-heading-sans-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-sans-serif-font-weight": { - "prop": "--spectrum-heading-sans-serif-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "heading-sans-serif-heavy-emphasized-font-style": { - "prop": "--spectrum-heading-sans-serif-heavy-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-sans-serif-heavy-emphasized-font-weight": { - "prop": "--spectrum-heading-sans-serif-heavy-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-sans-serif-heavy-font-style": { - "prop": "--spectrum-heading-sans-serif-heavy-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-sans-serif-heavy-font-weight": { - "prop": "--spectrum-heading-sans-serif-heavy-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-sans-serif-heavy-strong-emphasized-font-style": { - "prop": "--spectrum-heading-sans-serif-heavy-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-sans-serif-heavy-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-sans-serif-heavy-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-sans-serif-heavy-strong-font-style": { - "prop": "--spectrum-heading-sans-serif-heavy-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-sans-serif-heavy-strong-font-weight": { - "prop": "--spectrum-heading-sans-serif-heavy-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-sans-serif-light-emphasized-font-style": { - "prop": "--spectrum-heading-sans-serif-light-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-sans-serif-light-emphasized-font-weight": { - "prop": "--spectrum-heading-sans-serif-light-emphasized-font-weight", - "ref": "var(--spectrum-light-font-weight)", - "value": "300" - }, - "heading-sans-serif-light-font-style": { - "prop": "--spectrum-heading-sans-serif-light-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-sans-serif-light-font-weight": { - "prop": "--spectrum-heading-sans-serif-light-font-weight", - "ref": "var(--spectrum-light-font-weight)", - "value": "300" - }, - "heading-sans-serif-light-strong-emphasized-font-style": { - "prop": "--spectrum-heading-sans-serif-light-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-sans-serif-light-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-sans-serif-light-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "heading-sans-serif-light-strong-font-style": { - "prop": "--spectrum-heading-sans-serif-light-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-sans-serif-light-strong-font-weight": { - "prop": "--spectrum-heading-sans-serif-light-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "heading-sans-serif-strong-emphasized-font-style": { - "prop": "--spectrum-heading-sans-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-sans-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-sans-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-sans-serif-strong-font-style": { - "prop": "--spectrum-heading-sans-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-sans-serif-strong-font-weight": { - "prop": "--spectrum-heading-sans-serif-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-serif-emphasized-font-style": { - "prop": "--spectrum-heading-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-serif-emphasized-font-weight": { - "prop": "--spectrum-heading-serif-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "heading-serif-font-family": { - "prop": "--spectrum-heading-serif-font-family", - "ref": "var(--spectrum-serif-font-family)", - "value": "Adobe Clean Serif" - }, - "heading-serif-font-style": { - "prop": "--spectrum-heading-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-serif-font-weight": { - "prop": "--spectrum-heading-serif-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "heading-serif-heavy-emphasized-font-style": { - "prop": "--spectrum-heading-serif-heavy-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-serif-heavy-emphasized-font-weight": { - "prop": "--spectrum-heading-serif-heavy-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-serif-heavy-font-style": { - "prop": "--spectrum-heading-serif-heavy-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-serif-heavy-font-weight": { - "prop": "--spectrum-heading-serif-heavy-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-serif-heavy-strong-emphasized-font-style": { - "prop": "--spectrum-heading-serif-heavy-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-serif-heavy-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-serif-heavy-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-serif-heavy-strong-font-style": { - "prop": "--spectrum-heading-serif-heavy-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-serif-heavy-strong-font-weight": { - "prop": "--spectrum-heading-serif-heavy-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-serif-light-emphasized-font-style": { - "prop": "--spectrum-heading-serif-light-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-serif-light-emphasized-font-weight": { - "prop": "--spectrum-heading-serif-light-emphasized-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "heading-serif-light-font-style": { - "prop": "--spectrum-heading-serif-light-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-serif-light-font-weight": { - "prop": "--spectrum-heading-serif-light-font-weight", - "ref": "var(--spectrum-regular-font-weight)", - "value": "400" - }, - "heading-serif-light-strong-emphasized-font-style": { - "prop": "--spectrum-heading-serif-light-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-serif-light-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-serif-light-strong-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "heading-serif-light-strong-font-style": { - "prop": "--spectrum-heading-serif-light-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-serif-light-strong-font-weight": { - "prop": "--spectrum-heading-serif-light-strong-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "heading-serif-strong-emphasized-font-style": { - "prop": "--spectrum-heading-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "heading-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-heading-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-serif-strong-font-style": { - "prop": "--spectrum-heading-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "heading-serif-strong-font-weight": { - "prop": "--spectrum-heading-serif-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "heading-size-l": { - "prop": "--spectrum-heading-size-l", - "ref": "var(--spectrum-font-size-700)", - "desktop": { - "value": "28px" - }, - "mobile": { - "value": "34px" - } - }, - "heading-size-m": { - "prop": "--spectrum-heading-size-m", - "ref": "var(--spectrum-font-size-500)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "27px" - } - }, - "heading-size-s": { - "prop": "--spectrum-heading-size-s", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "heading-size-xl": { - "prop": "--spectrum-heading-size-xl", - "ref": "var(--spectrum-font-size-900)", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "44px" - } - }, - "heading-size-xs": { - "prop": "--spectrum-heading-size-xs", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "heading-size-xxl": { - "prop": "--spectrum-heading-size-xxl", - "ref": "var(--spectrum-font-size-1100)", - "desktop": { - "value": "45px" - }, - "mobile": { - "value": "55px" - } - }, - "heading-size-xxs": { - "prop": "--spectrum-heading-size-xxs", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "heading-size-xxxl": { - "prop": "--spectrum-heading-size-xxxl", - "ref": "var(--spectrum-font-size-1300)", - "desktop": { - "value": "58px" - }, - "mobile": { - "value": "70px" - } - }, - "heading-size-xxxxl": { - "prop": "--spectrum-heading-size-xxxxl", - "ref": "var(--spectrum-font-size-1500)", - "desktop": { - "value": "73px" - }, - "mobile": { - "value": "88px" - } - }, - "help-text-to-component": { - "prop": "--spectrum-help-text-to-component", - "value": "0px" - }, - "help-text-top-to-workflow-icon-extra-large": { - "prop": "--spectrum-help-text-top-to-workflow-icon-extra-large", - "ref": "var(--spectrum-component-top-to-workflow-icon-300)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "15px" - } - }, - "help-text-top-to-workflow-icon-large": { - "prop": "--spectrum-help-text-top-to-workflow-icon-large", - "ref": "var(--spectrum-component-top-to-workflow-icon-200)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "help-text-top-to-workflow-icon-medium": { - "prop": "--spectrum-help-text-top-to-workflow-icon-medium", - "ref": "var(--spectrum-component-top-to-workflow-icon-100)", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "help-text-top-to-workflow-icon-small": { - "prop": "--spectrum-help-text-top-to-workflow-icon-small", - "ref": "var(--spectrum-component-top-to-workflow-icon-75)", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "6px" - } - }, - "icon-color-blue-background": { - "prop": "--spectrum-icon-color-blue-background", - "ref": "var(--spectrum-blue-300)", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "icon-color-blue-primary-default": { - "prop": "--spectrum-icon-color-blue-primary-default", - "ref": "var(--spectrum-blue-800)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "icon-color-blue-primary-down": { - "prop": "--spectrum-icon-color-blue-primary-down", - "ref": "var(--spectrum-blue-1000)", - "light": { - "value": "rgb(29, 62, 207)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "icon-color-blue-primary-hover": { - "prop": "--spectrum-icon-color-blue-primary-hover", - "ref": "var(--spectrum-blue-900)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "icon-color-brown-background": { - "prop": "--spectrum-icon-color-brown-background", - "ref": "var(--spectrum-brown-400)", - "light": { - "value": "rgb(247, 238, 225)" - }, - "dark": { - "value": "rgb(78, 55, 19)" - } - }, - "icon-color-brown-primary-default": { - "prop": "--spectrum-icon-color-brown-primary-default", - "ref": "var(--spectrum-brown-700)", - "light": { - "value": "rgb(154, 123, 77)" - }, - "dark": { - "value": "rgb(132, 104, 61)" - } - }, - "icon-color-brown-primary-down": { - "prop": "--spectrum-icon-color-brown-primary-down", - "ref": "var(--spectrum-brown-900)", - "light": { - "value": "rgb(119, 91, 50)" - }, - "dark": { - "value": "rgb(163, 132, 84)" - } - }, - "icon-color-brown-primary-hover": { - "prop": "--spectrum-icon-color-brown-primary-hover", - "ref": "var(--spectrum-brown-800)", - "light": { - "value": "rgb(139, 109, 66)" - }, - "dark": { - "value": "rgb(143, 114, 69)" - } - }, - "icon-color-celery-background": { - "prop": "--spectrum-icon-color-celery-background", - "ref": "var(--spectrum-celery-400)", - "light": { - "value": "rgb(235, 255, 220)" - }, - "dark": { - "value": "rgb(31, 67, 4)" - } - }, - "icon-color-celery-primary-default": { - "prop": "--spectrum-icon-color-celery-primary-default", - "ref": "var(--spectrum-celery-900)", - "light": { - "value": "rgb(82, 161, 25)" - }, - "dark": { - "value": "rgb(78, 154, 23)" - } - }, - "icon-color-celery-primary-down": { - "prop": "--spectrum-icon-color-celery-primary-down", - "ref": "var(--spectrum-celery-1100)", - "light": { - "value": "rgb(64, 129, 17)" - }, - "dark": { - "value": "rgb(100, 190, 35)" - } - }, - "icon-color-celery-primary-hover": { - "prop": "--spectrum-icon-color-celery-primary-hover", - "ref": "var(--spectrum-celery-1000)", - "light": { - "value": "rgb(72, 144, 20)" - }, - "dark": { - "value": "rgb(88, 172, 28)" - } - }, - "icon-color-chartreuse-background": { - "prop": "--spectrum-icon-color-chartreuse-background", - "ref": "var(--spectrum-chartreuse-400)", - "light": { - "value": "rgb(234, 246, 173)" - }, - "dark": { - "value": "rgb(53, 63, 0)" - } - }, - "icon-color-chartreuse-primary-default": { - "prop": "--spectrum-icon-color-chartreuse-primary-default", - "ref": "var(--spectrum-chartreuse-1000)", - "light": { - "value": "rgb(143, 172, 0)" - }, - "dark": { - "value": "rgb(136, 164, 0)" - } - }, - "icon-color-chartreuse-primary-down": { - "prop": "--spectrum-icon-color-chartreuse-primary-down", - "ref": "var(--spectrum-chartreuse-1200)", - "light": { - "value": "rgb(114, 137, 0)" - }, - "dark": { - "value": "rgb(169, 203, 0)" - } - }, - "icon-color-chartreuse-primary-hover": { - "prop": "--spectrum-icon-color-chartreuse-primary-hover", - "ref": "var(--spectrum-chartreuse-1100)", - "light": { - "value": "rgb(128, 153, 0)" - }, - "dark": { - "value": "rgb(151, 181, 0)" - } - }, - "icon-color-cinnamon-background": { - "prop": "--spectrum-icon-color-cinnamon-background", - "ref": "var(--spectrum-cinnamon-300)", - "light": { - "value": "rgb(249, 236, 229)" - }, - "dark": { - "value": "rgb(79, 28, 7)" - } - }, - "icon-color-cinnamon-primary-default": { - "prop": "--spectrum-icon-color-cinnamon-primary-default", - "ref": "var(--spectrum-cinnamon-800)", - "dark": { - "value": "rgb(176, 98, 59)" - }, - "light": { - "value": "rgb(184, 109, 70)" - } - }, - "icon-color-cinnamon-primary-down": { - "prop": "--spectrum-icon-color-cinnamon-primary-down", - "ref": "var(--spectrum-cinnamon-1000)", - "dark": { - "value": "rgb(206, 136, 99)" - }, - "light": { - "value": "rgb(147, 77, 43)" - } - }, - "icon-color-cinnamon-primary-hover": { - "prop": "--spectrum-icon-color-cinnamon-primary-hover", - "ref": "var(--spectrum-cinnamon-900)", - "dark": { - "value": "rgb(192, 119, 80)" - }, - "light": { - "value": "rgb(170, 94, 56)" - } - }, - "icon-color-cyan-background": { - "prop": "--spectrum-icon-color-cyan-background", - "ref": "var(--spectrum-cyan-400)", - "light": { - "value": "rgb(238, 250, 254)" - }, - "dark": { - "value": "rgb(0, 64, 88)" - } - }, - "icon-color-cyan-primary-default": { - "prop": "--spectrum-icon-color-cyan-primary-default", - "ref": "var(--spectrum-cyan-800)", - "light": { - "value": "rgb(18, 134, 205)" - }, - "dark": { - "value": "rgb(13, 125, 186)" - } - }, - "icon-color-cyan-primary-down": { - "prop": "--spectrum-icon-color-cyan-primary-down", - "ref": "var(--spectrum-cyan-1000)", - "light": { - "value": "rgb(4, 102, 145)" - }, - "dark": { - "value": "rgb(38, 159, 244)" - } - }, - "icon-color-cyan-primary-hover": { - "prop": "--spectrum-icon-color-cyan-primary-hover", - "ref": "var(--spectrum-cyan-900)", - "light": { - "value": "rgb(11, 120, 179)" - }, - "dark": { - "value": "rgb(24, 142, 220)" - } - }, - "icon-color-disabled-primary": { - "prop": "--spectrum-icon-color-disabled-primary", - "ref": "var(--spectrum-gray-400)", - "light": { - "value": "rgb(198, 198, 198)" - }, - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "icon-color-emphasized-background": { - "prop": "--spectrum-icon-color-emphasized-background", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "icon-color-fuchsia-background": { - "prop": "--spectrum-icon-color-fuchsia-background", - "ref": "var(--spectrum-fuchsia-200)", - "light": { - "value": "rgb(253, 233, 255)" - }, - "dark": { - "value": "rgb(61, 0, 74)" - } - }, - "icon-color-fuchsia-primary-default": { - "prop": "--spectrum-icon-color-fuchsia-primary-default", - "ref": "var(--spectrum-fuchsia-700)", - "light": { - "value": "rgb(181, 57, 200)" - }, - "dark": { - "value": "rgb(173, 51, 192)" - } - }, - "icon-color-fuchsia-primary-down": { - "prop": "--spectrum-icon-color-fuchsia-primary-down", - "ref": "var(--spectrum-fuchsia-900)", - "light": { - "value": "rgb(135, 27, 154)" - }, - "dark": { - "value": "rgb(213, 73, 235)" - } - }, - "icon-color-fuchsia-primary-hover": { - "prop": "--spectrum-icon-color-fuchsia-primary-hover", - "ref": "var(--spectrum-fuchsia-800)", - "light": { - "value": "rgb(156, 40, 175)" - }, - "dark": { - "value": "rgb(186, 60, 206)" - } - }, - "icon-color-green-background": { - "prop": "--spectrum-icon-color-green-background", - "ref": "var(--spectrum-green-400)", - "light": { - "value": "rgb(237, 252, 241)" - }, - "dark": { - "value": "rgb(0, 68, 48)" - } - }, - "icon-color-green-primary-default": { - "prop": "--spectrum-icon-color-green-primary-default", - "ref": "var(--spectrum-green-800)", - "light": { - "value": "rgb(7, 147, 85)" - }, - "dark": { - "value": "rgb(6, 136, 80)" - } - }, - "icon-color-green-primary-down": { - "prop": "--spectrum-icon-color-green-primary-down", - "ref": "var(--spectrum-green-1000)", - "light": { - "value": "rgb(3, 110, 69)" - }, - "dark": { - "value": "rgb(14, 175, 98)" - } - }, - "icon-color-green-primary-hover": { - "prop": "--spectrum-icon-color-green-primary-hover", - "ref": "var(--spectrum-green-900)", - "light": { - "value": "rgb(5, 131, 78)" - }, - "dark": { - "value": "rgb(9, 157, 89)" - } - }, - "icon-color-indigo-background": { - "prop": "--spectrum-icon-color-indigo-background", - "ref": "var(--spectrum-indigo-100)", - "light": { - "value": "rgb(235, 238, 255)" - }, - "dark": { - "value": "rgb(30, 0, 93)" - } - }, - "icon-color-indigo-primary-default": { - "prop": "--spectrum-icon-color-indigo-primary-default", - "ref": "var(--spectrum-indigo-700)", - "light": { - "value": "rgb(113, 85, 250)" - }, - "dark": { - "value": "rgb(109, 75, 248)" - } - }, - "icon-color-indigo-primary-down": { - "prop": "--spectrum-icon-color-indigo-primary-down", - "ref": "var(--spectrum-indigo-900)", - "light": { - "value": "rgb(84, 36, 219)" - }, - "dark": { - "value": "rgb(128, 119, 254)" - } - }, - "icon-color-indigo-primary-hover": { - "prop": "--spectrum-icon-color-indigo-primary-hover", - "ref": "var(--spectrum-indigo-800)", - "light": { - "value": "rgb(99, 56, 238)" - }, - "dark": { - "value": "rgb(116, 91, 252)" - } - }, - "icon-color-informative": { - "prop": "--spectrum-icon-color-informative", - "ref": "var(--spectrum-informative-color-900)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "icon-color-inverse": { - "prop": "--spectrum-icon-color-inverse", - "ref": "var(--spectrum-gray-50)", - "light": { - "value": "rgb(248, 248, 248)" - }, - "dark": { - "value": "rgb(27, 27, 27)" - } - }, - "icon-color-inverse-background": { - "prop": "--spectrum-icon-color-inverse-background", - "ref": "var(--spectrum-gray-50)", - "light": { - "value": "rgb(248, 248, 248)" - }, - "dark": { - "value": "rgb(27, 27, 27)" - } - }, - "icon-color-magenta-background": { - "prop": "--spectrum-icon-color-magenta-background", - "ref": "var(--spectrum-magenta-200)", - "light": { - "value": "rgb(255, 232, 240)" - }, - "dark": { - "value": "rgb(74, 0, 27)" - } - }, - "icon-color-magenta-primary-default": { - "prop": "--spectrum-icon-color-magenta-primary-default", - "ref": "var(--spectrum-magenta-700)", - "light": { - "value": "rgb(217, 35, 97)" - }, - "dark": { - "value": "rgb(207, 31, 92)" - } - }, - "icon-color-magenta-primary-down": { - "prop": "--spectrum-icon-color-magenta-primary-down", - "ref": "var(--spectrum-magenta-900)", - "light": { - "value": "rgb(163, 5, 62)" - }, - "dark": { - "value": "rgb(255, 51, 119)" - } - }, - "icon-color-magenta-primary-hover": { - "prop": "--spectrum-icon-color-magenta-primary-hover", - "ref": "var(--spectrum-magenta-800)", - "light": { - "value": "rgb(186, 22, 80)" - }, - "dark": { - "value": "rgb(224, 38, 101)" - } - }, - "icon-color-negative": { - "prop": "--spectrum-icon-color-negative", - "ref": "var(--spectrum-negative-color-900)", - "light": { - "value": "rgb(240, 56, 35)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "icon-color-neutral": { - "prop": "--spectrum-icon-color-neutral", - "ref": "var(--spectrum-gray-600)", - "light": { - "value": "rgb(143, 143, 143)" - }, - "dark": { - "value": "rgb(138, 138, 138)" - } - }, - "icon-color-notice": { - "prop": "--spectrum-icon-color-notice", - "ref": "var(--spectrum-notice-color-900)", - "light": { - "value": "rgb(212, 91, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "icon-color-orange-background": { - "prop": "--spectrum-icon-color-orange-background", - "ref": "var(--spectrum-orange-300)", - "light": { - "value": "rgb(255, 236, 207)" - }, - "dark": { - "value": "rgb(80, 27, 0)" - } - }, - "icon-color-orange-primary-default": { - "prop": "--spectrum-icon-color-orange-primary-default", - "ref": "var(--spectrum-orange-900)", - "light": { - "value": "rgb(232, 106, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "icon-color-orange-primary-down": { - "prop": "--spectrum-icon-color-orange-primary-down", - "ref": "var(--spectrum-orange-1100)", - "light": { - "value": "rgb(194, 78, 0)" - }, - "dark": { - "value": "rgb(255, 137, 0)" - } - }, - "icon-color-orange-primary-hover": { - "prop": "--spectrum-icon-color-orange-primary-hover", - "ref": "var(--spectrum-orange-1000)", - "light": { - "value": "rgb(212, 91, 0)" - }, - "dark": { - "value": "rgb(243, 117, 0)" - } - }, - "icon-color-pink-background": { - "prop": "--spectrum-icon-color-pink-background", - "ref": "var(--spectrum-pink-200)", - "dark": { - "value": "rgb(71, 0, 44)" - }, - "light": { - "value": "rgb(255, 232, 247)" - } - }, - "icon-color-pink-primary-default": { - "prop": "--spectrum-icon-color-pink-primary-default", - "ref": "var(--spectrum-pink-700)", - "light": { - "value": "rgb(228, 52, 163)" - }, - "dark": { - "value": "rgb(196, 39, 138)" - } - }, - "icon-color-pink-primary-down": { - "prop": "--spectrum-icon-color-pink-primary-down", - "ref": "var(--spectrum-pink-900)", - "light": { - "value": "rgb(176, 31, 123)" - }, - "dark": { - "value": "rgb(236, 67, 175)" - } - }, - "icon-color-pink-primary-hover": { - "prop": "--spectrum-icon-color-pink-primary-hover", - "ref": "var(--spectrum-pink-800)", - "light": { - "value": "rgb(206, 42, 146)" - }, - "dark": { - "value": "rgb(213, 45, 151)" - } - }, - "icon-color-positive": { - "prop": "--spectrum-icon-color-positive", - "ref": "var(--spectrum-positive-color-900)", - "light": { - "value": "rgb(7, 147, 85)" - }, - "dark": { - "value": "rgb(9, 157, 89)" - } - }, - "icon-color-primary-default": { - "prop": "--spectrum-icon-color-primary-default", - "ref": "var(--spectrum-neutral-content-color-default)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "icon-color-primary-down": { - "prop": "--spectrum-icon-color-primary-down", - "ref": "var(--spectrum-neutral-content-color-down)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "icon-color-primary-hover": { - "prop": "--spectrum-icon-color-primary-hover", - "ref": "var(--spectrum-neutral-content-color-hover)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "icon-color-purple-background": { - "prop": "--spectrum-icon-color-purple-background", - "ref": "var(--spectrum-purple-200)", - "light": { - "value": "rgb(244, 235, 252)" - }, - "dark": { - "value": "rgb(50, 0, 96)" - } - }, - "icon-color-purple-primary-default": { - "prop": "--spectrum-icon-color-purple-primary-default", - "ref": "var(--spectrum-purple-700)", - "light": { - "value": "rgb(154, 71, 226)" - }, - "dark": { - "value": "rgb(148, 62, 224)" - } - }, - "icon-color-purple-primary-down": { - "prop": "--spectrum-icon-color-purple-primary-down", - "ref": "var(--spectrum-purple-900)", - "light": { - "value": "rgb(115, 13, 204)" - }, - "dark": { - "value": "rgb(173, 105, 233)" - } - }, - "icon-color-purple-primary-hover": { - "prop": "--spectrum-icon-color-purple-primary-hover", - "ref": "var(--spectrum-purple-800)", - "light": { - "value": "rgb(134, 40, 217)" - }, - "dark": { - "value": "rgb(157, 78, 228)" - } - }, - "icon-color-red-background": { - "prop": "--spectrum-icon-color-red-background", - "ref": "var(--spectrum-red-300)", - "light": { - "value": "rgb(255, 235, 232)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "icon-color-red-primary-default": { - "prop": "--spectrum-icon-color-red-primary-default", - "ref": "var(--spectrum-red-700)", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "icon-color-red-primary-down": { - "prop": "--spectrum-icon-color-red-primary-down", - "ref": "var(--spectrum-red-900)", - "light": { - "value": "rgb(156, 33, 19)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "icon-color-red-primary-hover": { - "prop": "--spectrum-icon-color-red-primary-hover", - "ref": "var(--spectrum-red-800)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(223, 52, 34)" - } - }, - "icon-color-seafoam-background": { - "prop": "--spectrum-icon-color-seafoam-background", - "ref": "var(--spectrum-seafoam-400)", - "light": { - "value": "rgb(211, 246, 234)" - }, - "dark": { - "value": "rgb(0, 67, 59)" - } - }, - "icon-color-seafoam-primary-default": { - "prop": "--spectrum-icon-color-seafoam-primary-default", - "ref": "var(--spectrum-seafoam-800)", - "light": { - "value": "rgb(9, 144, 120)" - }, - "dark": { - "value": "rgb(8, 134, 112)" - } - }, - "icon-color-seafoam-primary-down": { - "prop": "--spectrum-icon-color-seafoam-primary-down", - "ref": "var(--spectrum-seafoam-1000)", - "light": { - "value": "rgb(5, 108, 92)" - }, - "dark": { - "value": "rgb(12, 173, 142)" - } - }, - "icon-color-seafoam-primary-hover": { - "prop": "--spectrum-icon-color-seafoam-primary-hover", - "ref": "var(--spectrum-seafoam-900)", - "light": { - "value": "rgb(7, 129, 109)" - }, - "dark": { - "value": "rgb(10, 154, 128)" - } - }, - "icon-color-silver-background": { - "prop": "--spectrum-icon-color-silver-background", - "ref": "var(--spectrum-silver-400)", - "light": { - "value": "rgb(239, 239, 239)" - }, - "dark": { - "value": "rgb(59, 59, 59)" - } - }, - "icon-color-silver-primary-default": { - "prop": "--spectrum-icon-color-silver-primary-default", - "ref": "var(--spectrum-silver-800)", - "light": { - "value": "rgb(143, 143, 143)" - }, - "dark": { - "value": "rgb(118, 118, 118)" - } - }, - "icon-color-silver-primary-down": { - "prop": "--spectrum-icon-color-silver-primary-down", - "ref": "var(--spectrum-silver-1000)", - "light": { - "value": "rgb(114, 114, 114)" - }, - "dark": { - "value": "rgb(152, 152, 152)" - } - }, - "icon-color-silver-primary-hover": { - "prop": "--spectrum-icon-color-silver-primary-hover", - "ref": "var(--spectrum-silver-900)", - "light": { - "value": "rgb(128, 128, 128)" - }, - "dark": { - "value": "rgb(137, 137, 137)" - } - }, - "icon-color-turquoise-background": { - "prop": "--spectrum-icon-color-turquoise-background", - "ref": "var(--spectrum-turquoise-400)", - "light": { - "value": "rgb(209, 245, 245)" - }, - "dark": { - "value": "rgb(0, 66, 72)" - } - }, - "icon-color-turquoise-primary-default": { - "prop": "--spectrum-icon-color-turquoise-primary-default", - "ref": "var(--spectrum-turquoise-800)", - "light": { - "value": "rgb(12, 158, 171)" - }, - "dark": { - "value": "rgb(9, 131, 142)" - } - }, - "icon-color-turquoise-primary-down": { - "prop": "--spectrum-icon-color-turquoise-primary-down", - "ref": "var(--spectrum-turquoise-1000)", - "light": { - "value": "rgb(8, 126, 137)" - }, - "dark": { - "value": "rgb(13, 168, 182)" - } - }, - "icon-color-turquoise-primary-hover": { - "prop": "--spectrum-icon-color-turquoise-primary-hover", - "ref": "var(--spectrum-turquoise-900)", - "light": { - "value": "rgb(10, 141, 153)" - }, - "dark": { - "value": "rgb(11, 151, 164)" - } - }, - "icon-color-yellow-background": { - "prop": "--spectrum-icon-color-yellow-background", - "ref": "var(--spectrum-yellow-400)", - "light": { - "value": "rgb(255, 248, 204)" - }, - "dark": { - "value": "rgb(83, 52, 0)" - } - }, - "icon-color-yellow-primary-default": { - "prop": "--spectrum-icon-color-yellow-primary-default", - "ref": "var(--spectrum-yellow-1200)", - "light": { - "value": "rgb(245, 199, 0)" - }, - "dark": { - "value": "rgb(235, 183, 0)" - } - }, - "icon-color-yellow-primary-down": { - "prop": "--spectrum-icon-color-yellow-primary-down", - "ref": "var(--spectrum-yellow-1400)", - "light": { - "value": "rgb(210, 149, 0)" - }, - "dark": { - "value": "rgb(255, 230, 86)" - } - }, - "icon-color-yellow-primary-hover": { - "prop": "--spectrum-icon-color-yellow-primary-hover", - "ref": "var(--spectrum-yellow-1300)", - "light": { - "value": "rgb(230, 175, 0)" - }, - "dark": { - "value": "rgb(249, 206, 0)" - } - }, - "illustrated-message-body-size": { - "prop": "--spectrum-illustrated-message-body-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "illustrated-message-cjk-title-size": { - "prop": "--spectrum-illustrated-message-cjk-title-size", - "ref": "var(--spectrum-title-cjk-size-xl)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "illustrated-message-horizontal-maximum-width": { - "prop": "--spectrum-illustrated-message-horizontal-maximum-width", - "value": "535px" - }, - "illustrated-message-large-body-font-size": { - "prop": "--spectrum-illustrated-message-large-body-font-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "illustrated-message-large-cjk-title-font-size": { - "prop": "--spectrum-illustrated-message-large-cjk-title-font-size", - "ref": "var(--spectrum-title-cjk-size-xl)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "illustrated-message-large-title-font-size": { - "prop": "--spectrum-illustrated-message-large-title-font-size", - "ref": "var(--spectrum-title-size-xl)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "24px" - } - }, - "illustrated-message-maximum-width": { - "prop": "--spectrum-illustrated-message-maximum-width", - "ref": "var(--spectrum-illustrated-message-vertical-maximum-width)", - "value": "380px" - }, - "illustrated-message-medium-body-font-size": { - "prop": "--spectrum-illustrated-message-medium-body-font-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "illustrated-message-medium-cjk-title-font-size": { - "prop": "--spectrum-illustrated-message-medium-cjk-title-font-size", - "ref": "var(--spectrum-title-cjk-size-l)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "19px" - } - }, - "illustrated-message-medium-title-font-size": { - "prop": "--spectrum-illustrated-message-medium-title-font-size", - "ref": "var(--spectrum-title-size-l)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "illustrated-message-small-body-font-size": { - "prop": "--spectrum-illustrated-message-small-body-font-size", - "ref": "var(--spectrum-body-size-xs)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "illustrated-message-small-cjk-title-font-size": { - "prop": "--spectrum-illustrated-message-small-cjk-title-font-size", - "ref": "var(--spectrum-title-cjk-size-s)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "15px" - } - }, - "illustrated-message-small-title-font-size": { - "prop": "--spectrum-illustrated-message-small-title-font-size", - "ref": "var(--spectrum-title-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "illustrated-message-title-size": { - "prop": "--spectrum-illustrated-message-title-size", - "ref": "var(--spectrum-title-size-xl)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "24px" - } - }, - "illustrated-message-vertical-maximum-width": { - "prop": "--spectrum-illustrated-message-vertical-maximum-width", - "value": "380px" - }, - "in-field-button-edge-to-disclosure-icon-stacked-extra-large": { - "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-extra-large", - "value": "16px" - }, - "in-field-button-edge-to-disclosure-icon-stacked-large": { - "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-large", - "value": "13px" - }, - "in-field-button-edge-to-disclosure-icon-stacked-medium": { - "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-medium", - "value": "9px" - }, - "in-field-button-edge-to-disclosure-icon-stacked-small": { - "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-small", - "value": "7px" - }, - "in-field-button-edge-to-fill": { - "prop": "--spectrum-in-field-button-edge-to-fill", - "value": "0px" - }, - "in-field-button-edge-to-fill-extra-large": { - "prop": "--spectrum-in-field-button-edge-to-fill-extra-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "in-field-button-edge-to-fill-large": { - "prop": "--spectrum-in-field-button-edge-to-fill-large", - "value": "8px" - }, - "in-field-button-edge-to-fill-medium": { - "prop": "--spectrum-in-field-button-edge-to-fill-medium", - "value": "6px" - }, - "in-field-button-edge-to-fill-small": { - "prop": "--spectrum-in-field-button-edge-to-fill-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "in-field-button-fill-stacked-inner-border-rounding": { - "prop": "--spectrum-in-field-button-fill-stacked-inner-border-rounding", - "value": "0px" - }, - "in-field-button-inner-edge-to-disclosure-icon-stacked-extra-large": { - "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-extra-large", - "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large)", - "value": "5px" - }, - "in-field-button-inner-edge-to-disclosure-icon-stacked-large": { - "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-large", - "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-large)", - "value": "4px" - }, - "in-field-button-inner-edge-to-disclosure-icon-stacked-medium": { - "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-medium", - "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-medium)", - "value": "3px" - }, - "in-field-button-inner-edge-to-disclosure-icon-stacked-small": { - "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-small", - "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-small)", - "value": "3px" - }, - "in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large": { - "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large", - "value": "5px" - }, - "in-field-button-outer-edge-to-disclosure-icon-stacked-large": { - "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-large", - "value": "4px" - }, - "in-field-button-outer-edge-to-disclosure-icon-stacked-medium": { - "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-medium", - "value": "3px" - }, - "in-field-button-outer-edge-to-disclosure-icon-stacked-small": { - "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-small", - "value": "3px" - }, - "in-field-button-stacked-inner-edge-to-fill": { - "prop": "--spectrum-in-field-button-stacked-inner-edge-to-fill", - "value": "0px" - }, - "in-field-button-width-stacked-extra-large": { - "prop": "--spectrum-in-field-button-width-stacked-extra-large", - "value": "44px" - }, - "in-field-button-width-stacked-large": { - "prop": "--spectrum-in-field-button-width-stacked-large", - "value": "36px" - }, - "in-field-button-width-stacked-medium": { - "prop": "--spectrum-in-field-button-width-stacked-medium", - "value": "28px" - }, - "in-field-button-width-stacked-small": { - "prop": "--spectrum-in-field-button-width-stacked-small", - "value": "20px" - }, - "in-field-progress-circle-edge-to-fill": { - "prop": "--spectrum-in-field-progress-circle-edge-to-fill", - "desktop": { - "value": "1px" - }, - "mobile": { - "value": "2px" - } - }, - "in-field-progress-circle-size-100": { - "prop": "--spectrum-in-field-progress-circle-size-100", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "in-field-progress-circle-size-200": { - "prop": "--spectrum-in-field-progress-circle-size-200", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "28px" - } - }, - "in-field-progress-circle-size-300": { - "prop": "--spectrum-in-field-progress-circle-size-300", - "desktop": { - "value": "26px" - }, - "mobile": { - "value": "30px" - } - }, - "in-field-progress-circle-size-75": { - "prop": "--spectrum-in-field-progress-circle-size-75", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "in-field-stepper-to-end-extra-large": { - "prop": "--spectrum-in-field-stepper-to-end-extra-large", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "in-field-stepper-to-end-large": { - "prop": "--spectrum-in-field-stepper-to-end-large", - "value": "4px" - }, - "in-field-stepper-to-end-medium": { - "prop": "--spectrum-in-field-stepper-to-end-medium", - "value": "3px" - }, - "in-field-stepper-to-end-small": { - "prop": "--spectrum-in-field-stepper-to-end-small", - "desktop": { - "value": "0px" - }, - "mobile": { - "value": "3px" - } - }, - "in-line-alert-minimum-width": { - "prop": "--spectrum-in-line-alert-minimum-width", - "value": "240px" - }, - "indigo-100": { - "prop": "--spectrum-indigo-100", - "light": { - "value": "rgb(247, 248, 255)" - }, - "dark": { - "value": "rgb(30, 0, 93)" - } - }, - "indigo-1000": { - "prop": "--spectrum-indigo-1000", - "light": { - "value": "rgb(99, 56, 238)" - }, - "dark": { - "value": "rgb(139, 141, 254)" - } - }, - "indigo-1100": { - "prop": "--spectrum-indigo-1100", - "light": { - "value": "rgb(84, 36, 219)" - }, - "dark": { - "value": "rgb(153, 161, 255)" - } - }, - "indigo-1200": { - "prop": "--spectrum-indigo-1200", - "light": { - "value": "rgb(69, 19, 191)" - }, - "dark": { - "value": "rgb(176, 186, 255)" - } - }, - "indigo-1300": { - "prop": "--spectrum-indigo-1300", - "light": { - "value": "rgb(55, 6, 160)" - }, - "dark": { - "value": "rgb(199, 208, 255)" - } - }, - "indigo-1400": { - "prop": "--spectrum-indigo-1400", - "light": { - "value": "rgb(42, 0, 129)" - }, - "dark": { - "value": "rgb(223, 228, 255)" - } - }, - "indigo-1500": { - "prop": "--spectrum-indigo-1500", - "dark": { - "value": "rgb(243, 244, 255)" - }, - "light": { - "value": "rgb(31, 0, 98)" - } - }, - "indigo-1600": { - "prop": "--spectrum-indigo-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(17, 0, 54)" - } - }, - "indigo-200": { - "prop": "--spectrum-indigo-200", - "light": { - "value": "rgb(235, 238, 255)" - }, - "dark": { - "value": "rgb(35, 0, 110)" - } - }, - "indigo-300": { - "prop": "--spectrum-indigo-300", - "light": { - "value": "rgb(216, 222, 255)" - }, - "dark": { - "value": "rgb(47, 0, 140)" - } - }, - "indigo-400": { - "prop": "--spectrum-indigo-400", - "light": { - "value": "rgb(192, 201, 255)" - }, - "dark": { - "value": "rgb(62, 12, 174)" - } - }, - "indigo-500": { - "prop": "--spectrum-indigo-500", - "light": { - "value": "rgb(167, 178, 255)" - }, - "dark": { - "value": "rgb(79, 30, 209)" - } - }, - "indigo-600": { - "prop": "--spectrum-indigo-600", - "light": { - "value": "rgb(145, 151, 254)" - }, - "dark": { - "value": "rgb(95, 52, 235)" - } - }, - "indigo-700": { - "prop": "--spectrum-indigo-700", - "light": { - "value": "rgb(132, 128, 254)" - }, - "dark": { - "value": "rgb(109, 75, 248)" - } - }, - "indigo-800": { - "prop": "--spectrum-indigo-800", - "light": { - "value": "rgb(122, 106, 253)" - }, - "dark": { - "value": "rgb(116, 91, 252)" - } - }, - "indigo-900": { - "prop": "--spectrum-indigo-900", - "light": { - "value": "rgb(113, 85, 250)" - }, - "dark": { - "value": "rgb(128, 119, 254)" - } - }, - "indigo-background-color-default": { - "prop": "--spectrum-indigo-background-color-default", - "ref": "var(--spectrum-indigo-800)", - "light": { - "value": "rgb(113, 85, 250)" - }, - "dark": { - "value": "rgb(116, 91, 252)" - } - }, - "indigo-subtle-background-color-default": { - "prop": "--spectrum-indigo-subtle-background-color-default", - "ref": "var(--spectrum-indigo-300)", - "light": { - "value": "rgb(235, 238, 255)" - }, - "dark": { - "value": "rgb(47, 0, 140)" - } - }, - "indigo-visual-color": { - "prop": "--spectrum-indigo-visual-color", - "ref": "var(--spectrum-indigo-900)", - "light": { - "value": "rgb(122, 106, 253)" - }, - "dark": { - "value": "rgb(128, 119, 254)" - } - }, - "informative-background-color-default": { - "prop": "--spectrum-informative-background-color-default", - "ref": "var(--spectrum-informative-color-800)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "informative-background-color-down": { - "prop": "--spectrum-informative-background-color-down", - "ref": "var(--spectrum-informative-color-700)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "informative-background-color-hover": { - "prop": "--spectrum-informative-background-color-hover", - "ref": "var(--spectrum-informative-color-700)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "informative-background-color-key-focus": { - "prop": "--spectrum-informative-background-color-key-focus", - "ref": "var(--spectrum-informative-color-700)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "informative-color-100": { - "prop": "--spectrum-informative-color-100", - "ref": "var(--spectrum-blue-100)", - "light": { - "value": "rgb(245, 249, 255)" - }, - "dark": { - "value": "rgb(14, 23, 63)" - } - }, - "informative-color-1000": { - "prop": "--spectrum-informative-color-1000", - "ref": "var(--spectrum-blue-1000)", - "light": { - "value": "rgb(39, 77, 234)" - }, - "dark": { - "value": "rgb(105, 149, 254)" - } - }, - "informative-color-1100": { - "prop": "--spectrum-informative-color-1100", - "ref": "var(--spectrum-blue-1100)", - "light": { - "value": "rgb(29, 62, 207)" - }, - "dark": { - "value": "rgb(124, 169, 252)" - } - }, - "informative-color-1200": { - "prop": "--spectrum-informative-color-1200", - "ref": "var(--spectrum-blue-1200)", - "light": { - "value": "rgb(21, 50, 173)" - }, - "dark": { - "value": "rgb(152, 192, 252)" - } - }, - "informative-color-1300": { - "prop": "--spectrum-informative-color-1300", - "ref": "var(--spectrum-blue-1300)", - "light": { - "value": "rgb(16, 40, 140)" - }, - "dark": { - "value": "rgb(181, 213, 253)" - } - }, - "informative-color-1400": { - "prop": "--spectrum-informative-color-1400", - "ref": "var(--spectrum-blue-1400)", - "light": { - "value": "rgb(12, 31, 105)" - }, - "dark": { - "value": "rgb(213, 231, 254)" - } - }, - "informative-color-1500": { - "prop": "--spectrum-informative-color-1500", - "ref": "var(--spectrum-blue-1500)", - "dark": { - "value": "rgb(238, 245, 255)" - }, - "light": { - "value": "rgb(14, 24, 67)" - } - }, - "informative-color-1600": { - "prop": "--spectrum-informative-color-1600", - "ref": "var(--spectrum-blue-1600)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(7, 11, 30)" - } - }, - "informative-color-200": { - "prop": "--spectrum-informative-color-200", - "ref": "var(--spectrum-blue-200)", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(15, 28, 82)" - } - }, - "informative-color-300": { - "prop": "--spectrum-informative-color-300", - "ref": "var(--spectrum-blue-300)", - "light": { - "value": "rgb(203, 226, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "informative-color-400": { - "prop": "--spectrum-informative-color-400", - "ref": "var(--spectrum-blue-400)", - "light": { - "value": "rgb(172, 207, 253)" - }, - "dark": { - "value": "rgb(18, 45, 154)" - } - }, - "informative-color-500": { - "prop": "--spectrum-informative-color-500", - "ref": "var(--spectrum-blue-500)", - "light": { - "value": "rgb(142, 185, 252)" - }, - "dark": { - "value": "rgb(26, 58, 195)" - } - }, - "informative-color-600": { - "prop": "--spectrum-informative-color-600", - "ref": "var(--spectrum-blue-600)", - "light": { - "value": "rgb(114, 158, 253)" - }, - "dark": { - "value": "rgb(37, 73, 229)" - } - }, - "informative-color-700": { - "prop": "--spectrum-informative-color-700", - "ref": "var(--spectrum-blue-700)", - "light": { - "value": "rgb(93, 137, 255)" - }, - "dark": { - "value": "rgb(52, 91, 248)" - } - }, - "informative-color-800": { - "prop": "--spectrum-informative-color-800", - "ref": "var(--spectrum-blue-800)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "informative-color-900": { - "prop": "--spectrum-informative-color-900", - "ref": "var(--spectrum-blue-900)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "informative-subtle-background-color-default": { - "prop": "--spectrum-informative-subtle-background-color-default", - "ref": "var(--spectrum-informative-color-300)", - "light": { - "value": "rgb(229, 240, 254)" - }, - "dark": { - "value": "rgb(12, 33, 117)" - } - }, - "informative-visual-color": { - "prop": "--spectrum-informative-visual-color", - "ref": "var(--spectrum-informative-color-900)", - "light": { - "value": "rgb(75, 117, 255)" - }, - "dark": { - "value": "rgb(86, 129, 255)" - } - }, - "italic-font-style": { - "prop": "--spectrum-italic-font-style", - "value": "italic" - }, - "letter-spacing": { - "prop": "--spectrum-letter-spacing", - "value": "0em" - }, - "light-font-weight": { - "prop": "--spectrum-light-font-weight", - "ref": "light", - "value": "300" - }, - "line-height-100": { - "prop": "--spectrum-line-height-100", - "value": 1.3 - }, - "line-height-200": { - "prop": "--spectrum-line-height-200", - "value": 1.5 - }, - "line-height-font-size-100": { - "prop": "--spectrum-line-height-font-size-100", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "line-height-font-size-1000": { - "prop": "--spectrum-line-height-font-size-1000", - "desktop": { - "value": "46px" - }, - "mobile": { - "value": "56px" - } - }, - "line-height-font-size-1100": { - "prop": "--spectrum-line-height-font-size-1100", - "desktop": { - "value": "52px" - }, - "mobile": { - "value": "64px" - } - }, - "line-height-font-size-1200": { - "prop": "--spectrum-line-height-font-size-1200", - "desktop": { - "value": "58px" - }, - "mobile": { - "value": "72px" - } - }, - "line-height-font-size-1300": { - "prop": "--spectrum-line-height-font-size-1300", - "desktop": { - "value": "66px" - }, - "mobile": { - "value": "80px" - } - }, - "line-height-font-size-1400": { - "prop": "--spectrum-line-height-font-size-1400", - "desktop": { - "value": "74px" - }, - "mobile": { - "value": "90px" - } - }, - "line-height-font-size-1500": { - "prop": "--spectrum-line-height-font-size-1500", - "desktop": { - "value": "84px" - }, - "mobile": { - "value": "102px" - } - }, - "line-height-font-size-200": { - "prop": "--spectrum-line-height-font-size-200", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "line-height-font-size-25": { - "prop": "--spectrum-line-height-font-size-25", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "line-height-font-size-300": { - "prop": "--spectrum-line-height-font-size-300", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "26px" - } - }, - "line-height-font-size-400": { - "prop": "--spectrum-line-height-font-size-400", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "28px" - } - }, - "line-height-font-size-50": { - "prop": "--spectrum-line-height-font-size-50", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "line-height-font-size-500": { - "prop": "--spectrum-line-height-font-size-500", - "desktop": { - "value": "26px" - }, - "mobile": { - "value": "32px" - } - }, - "line-height-font-size-600": { - "prop": "--spectrum-line-height-font-size-600", - "desktop": { - "value": "30px" - }, - "mobile": { - "value": "36px" - } - }, - "line-height-font-size-700": { - "prop": "--spectrum-line-height-font-size-700", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "line-height-font-size-75": { - "prop": "--spectrum-line-height-font-size-75", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "line-height-font-size-800": { - "prop": "--spectrum-line-height-font-size-800", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "44px" - } - }, - "line-height-font-size-900": { - "prop": "--spectrum-line-height-font-size-900", - "desktop": { - "value": "42px" - }, - "mobile": { - "value": "50px" - } - }, - "link-out-icon-size-100": { - "prop": "--spectrum-link-out-icon-size-100", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "link-out-icon-size-200": { - "prop": "--spectrum-link-out-icon-size-200", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "link-out-icon-size-75": { - "prop": "--spectrum-link-out-icon-size-75", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "magenta-100": { - "prop": "--spectrum-magenta-100", - "light": { - "value": "rgb(255, 245, 248)" - }, - "dark": { - "value": "rgb(59, 0, 22)" - } - }, - "magenta-1000": { - "prop": "--spectrum-magenta-1000", - "light": { - "value": "rgb(186, 22, 80)" - }, - "dark": { - "value": "rgb(255, 96, 149)" - } - }, - "magenta-1100": { - "prop": "--spectrum-magenta-1100", - "light": { - "value": "rgb(163, 5, 62)" - }, - "dark": { - "value": "rgb(255, 128, 171)" - } - }, - "magenta-1200": { - "prop": "--spectrum-magenta-1200", - "light": { - "value": "rgb(136, 0, 51)" - }, - "dark": { - "value": "rgb(255, 163, 194)" - } - }, - "magenta-1300": { - "prop": "--spectrum-magenta-1300", - "light": { - "value": "rgb(111, 0, 40)" - }, - "dark": { - "value": "rgb(255, 193, 214)" - } - }, - "magenta-1400": { - "prop": "--spectrum-magenta-1400", - "light": { - "value": "rgb(86, 0, 30)" - }, - "dark": { - "value": "rgb(255, 220, 232)" - } - }, - "magenta-1500": { - "prop": "--spectrum-magenta-1500", - "dark": { - "value": "rgb(255, 241, 246)" - }, - "light": { - "value": "rgb(64, 0, 22)" - } - }, - "magenta-1600": { - "prop": "--spectrum-magenta-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(35, 0, 12)" - } - }, - "magenta-200": { - "prop": "--spectrum-magenta-200", - "light": { - "value": "rgb(255, 232, 240)" - }, - "dark": { - "value": "rgb(74, 0, 27)" - } - }, - "magenta-300": { - "prop": "--spectrum-magenta-300", - "light": { - "value": "rgb(255, 213, 227)" - }, - "dark": { - "value": "rgb(93, 0, 34)" - } - }, - "magenta-400": { - "prop": "--spectrum-magenta-400", - "light": { - "value": "rgb(255, 185, 208)" - }, - "dark": { - "value": "rgb(123, 0, 45)" - } - }, - "magenta-500": { - "prop": "--spectrum-magenta-500", - "light": { - "value": "rgb(255, 152, 187)" - }, - "dark": { - "value": "rgb(152, 7, 60)" - } - }, - "magenta-600": { - "prop": "--spectrum-magenta-600", - "light": { - "value": "rgb(255, 112, 159)" - }, - "dark": { - "value": "rgb(181, 19, 76)" - } - }, - "magenta-700": { - "prop": "--spectrum-magenta-700", - "light": { - "value": "rgb(255, 72, 133)" - }, - "dark": { - "value": "rgb(207, 31, 92)" - } - }, - "magenta-800": { - "prop": "--spectrum-magenta-800", - "light": { - "value": "rgb(240, 45, 110)" - }, - "dark": { - "value": "rgb(224, 38, 101)" - } - }, - "magenta-900": { - "prop": "--spectrum-magenta-900", - "light": { - "value": "rgb(217, 35, 97)" - }, - "dark": { - "value": "rgb(255, 51, 119)" - } - }, - "magenta-background-color-default": { - "prop": "--spectrum-magenta-background-color-default", - "ref": "var(--spectrum-magenta-800)", - "light": { - "value": "rgb(217, 35, 97)" - }, - "dark": { - "value": "rgb(224, 38, 101)" - } - }, - "magenta-subtle-background-color-default": { - "prop": "--spectrum-magenta-subtle-background-color-default", - "ref": "var(--spectrum-magenta-300)", - "light": { - "value": "rgb(255, 232, 240)" - }, - "dark": { - "value": "rgb(93, 0, 34)" - } - }, - "magenta-visual-color": { - "prop": "--spectrum-magenta-visual-color", - "ref": "var(--spectrum-magenta-900)", - "light": { - "value": "rgb(240, 45, 110)" - }, - "dark": { - "value": "rgb(255, 51, 119)" - } - }, - "medium-font-weight": { - "prop": "--spectrum-medium-font-weight", - "ref": "medium", - "value": "500" - }, - "menu-item-background-color-default": { - "prop": "--spectrum-menu-item-background-color-default", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "menu-item-background-color-disabled": { - "prop": "--spectrum-menu-item-background-color-disabled", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "menu-item-background-color-down": { - "prop": "--spectrum-menu-item-background-color-down", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "menu-item-background-color-hover": { - "prop": "--spectrum-menu-item-background-color-hover", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "menu-item-background-color-keyboard-focus": { - "prop": "--spectrum-menu-item-background-color-keyboard-focus", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "menu-item-background-opacity": { - "prop": "--spectrum-menu-item-background-opacity", - "value": "0" - }, - "menu-item-edge-to-content-not-selected-extra-large": { - "prop": "--spectrum-menu-item-edge-to-content-not-selected-extra-large", - "desktop": { - "value": "45px" - }, - "mobile": { - "value": "54px" - } - }, - "menu-item-edge-to-content-not-selected-large": { - "prop": "--spectrum-menu-item-edge-to-content-not-selected-large", - "desktop": { - "value": "38px" - }, - "mobile": { - "value": "47px" - } - }, - "menu-item-edge-to-content-not-selected-medium": { - "prop": "--spectrum-menu-item-edge-to-content-not-selected-medium", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "42px" - } - }, - "menu-item-edge-to-content-not-selected-small": { - "prop": "--spectrum-menu-item-edge-to-content-not-selected-small", - "desktop": { - "value": "28px" - }, - "mobile": { - "value": "24px" - } - }, - "menu-item-label-to-description": { - "prop": "--spectrum-menu-item-label-to-description", - "ref": "var(--spectrum-menu-item-label-to-description-medium)", - "value": "1px" - }, - "menu-item-label-to-description-extra-large": { - "prop": "--spectrum-menu-item-label-to-description-extra-large", - "value": "2px" - }, - "menu-item-label-to-description-large": { - "prop": "--spectrum-menu-item-label-to-description-large", - "value": "2px" - }, - "menu-item-label-to-description-medium": { - "prop": "--spectrum-menu-item-label-to-description-medium", - "value": "1px" - }, - "menu-item-label-to-description-small": { - "prop": "--spectrum-menu-item-label-to-description-small", - "value": "1px" - }, - "menu-item-section-divider-height": { - "prop": "--spectrum-menu-item-section-divider-height", - "value": "12px" - }, - "menu-item-top-to-disclosure-icon-extra-large": { - "prop": "--spectrum-menu-item-top-to-disclosure-icon-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "menu-item-top-to-disclosure-icon-large": { - "prop": "--spectrum-menu-item-top-to-disclosure-icon-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "menu-item-top-to-disclosure-icon-medium": { - "prop": "--spectrum-menu-item-top-to-disclosure-icon-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "menu-item-top-to-disclosure-icon-small": { - "prop": "--spectrum-menu-item-top-to-disclosure-icon-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "menu-item-top-to-selected-icon-extra-large": { - "prop": "--spectrum-menu-item-top-to-selected-icon-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "menu-item-top-to-selected-icon-large": { - "prop": "--spectrum-menu-item-top-to-selected-icon-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "menu-item-top-to-selected-icon-medium": { - "prop": "--spectrum-menu-item-top-to-selected-icon-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "menu-item-top-to-selected-icon-small": { - "prop": "--spectrum-menu-item-top-to-selected-icon-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "menu-item-top-to-thumbnail-extra-large": { - "prop": "--spectrum-menu-item-top-to-thumbnail-extra-large", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "menu-item-top-to-thumbnail-large": { - "prop": "--spectrum-menu-item-top-to-thumbnail-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "menu-item-top-to-thumbnail-medium": { - "prop": "--spectrum-menu-item-top-to-thumbnail-medium", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "menu-item-top-to-thumbnail-small": { - "prop": "--spectrum-menu-item-top-to-thumbnail-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "menu-section-header-to-description-extra-large": { - "prop": "--spectrum-menu-section-header-to-description-extra-large", - "value": "2px" - }, - "menu-section-header-to-description-large": { - "prop": "--spectrum-menu-section-header-to-description-large", - "value": "2px" - }, - "menu-section-header-to-description-medium": { - "prop": "--spectrum-menu-section-header-to-description-medium", - "value": "1px" - }, - "menu-section-header-to-description-small": { - "prop": "--spectrum-menu-section-header-to-description-small", - "value": "1px" - }, - "meter-default-width": { - "prop": "--spectrum-meter-default-width", - "ref": "var(--spectrum-meter-width)", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "meter-maximum-width": { - "prop": "--spectrum-meter-maximum-width", - "value": "768px" - }, - "meter-minimum-width": { - "prop": "--spectrum-meter-minimum-width", - "value": "48px" - }, - "meter-thickness-extra-large": { - "prop": "--spectrum-meter-thickness-extra-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "meter-thickness-large": { - "prop": "--spectrum-meter-thickness-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "meter-thickness-medium": { - "prop": "--spectrum-meter-thickness-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "meter-thickness-small": { - "prop": "--spectrum-meter-thickness-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "meter-width": { - "prop": "--spectrum-meter-width", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "navigational-indicator-top-to-back-icon-extra-large": { - "prop": "--spectrum-navigational-indicator-top-to-back-icon-extra-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "navigational-indicator-top-to-back-icon-large": { - "prop": "--spectrum-navigational-indicator-top-to-back-icon-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "navigational-indicator-top-to-back-icon-medium": { - "prop": "--spectrum-navigational-indicator-top-to-back-icon-medium", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "navigational-indicator-top-to-back-icon-small": { - "prop": "--spectrum-navigational-indicator-top-to-back-icon-small", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "negative-background-color-default": { - "prop": "--spectrum-negative-background-color-default", - "ref": "var(--spectrum-negative-color-800)", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(223, 52, 34)" - } - }, - "negative-background-color-down": { - "prop": "--spectrum-negative-background-color-down", - "ref": "var(--spectrum-negative-color-700)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "negative-background-color-hover": { - "prop": "--spectrum-negative-background-color-hover", - "ref": "var(--spectrum-negative-color-700)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "negative-background-color-key-focus": { - "prop": "--spectrum-negative-background-color-key-focus", - "ref": "var(--spectrum-negative-color-700)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "negative-border-color-default": { - "prop": "--spectrum-negative-border-color-default", - "ref": "var(--spectrum-negative-color-900)", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "negative-border-color-down": { - "prop": "--spectrum-negative-border-color-down", - "ref": "var(--spectrum-negative-color-1100)", - "light": { - "value": "rgb(156, 33, 19)" - }, - "dark": { - "value": "rgb(255, 134, 120)" - } - }, - "negative-border-color-focus": { - "prop": "--spectrum-negative-border-color-focus", - "ref": "var(--spectrum-negative-color-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-border-color-focus-hover": { - "prop": "--spectrum-negative-border-color-focus-hover", - "ref": "var(--spectrum-negative-border-color-down)", - "light": { - "value": "rgb(156, 33, 19)" - }, - "dark": { - "value": "rgb(255, 134, 120)" - } - }, - "negative-border-color-hover": { - "prop": "--spectrum-negative-border-color-hover", - "ref": "var(--spectrum-negative-color-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-border-color-key-focus": { - "prop": "--spectrum-negative-border-color-key-focus", - "ref": "var(--spectrum-negative-color-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-color-100": { - "prop": "--spectrum-negative-color-100", - "ref": "var(--spectrum-red-100)", - "light": { - "value": "rgb(255, 246, 245)" - }, - "dark": { - "value": "rgb(54, 10, 3)" - } - }, - "negative-color-1000": { - "prop": "--spectrum-negative-color-1000", - "ref": "var(--spectrum-red-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-color-1100": { - "prop": "--spectrum-negative-color-1100", - "ref": "var(--spectrum-red-1100)", - "light": { - "value": "rgb(156, 33, 19)" - }, - "dark": { - "value": "rgb(255, 134, 120)" - } - }, - "negative-color-1200": { - "prop": "--spectrum-negative-color-1200", - "ref": "var(--spectrum-red-1200)", - "light": { - "value": "rgb(129, 27, 14)" - }, - "dark": { - "value": "rgb(255, 167, 157)" - } - }, - "negative-color-1300": { - "prop": "--spectrum-negative-color-1300", - "ref": "var(--spectrum-red-1300)", - "light": { - "value": "rgb(104, 21, 10)" - }, - "dark": { - "value": "rgb(255, 196, 189)" - } - }, - "negative-color-1400": { - "prop": "--spectrum-negative-color-1400", - "ref": "var(--spectrum-red-1400)", - "light": { - "value": "rgb(80, 16, 6)" - }, - "dark": { - "value": "rgb(255, 222, 219)" - } - }, - "negative-color-1500": { - "prop": "--spectrum-negative-color-1500", - "ref": "var(--spectrum-red-1500)", - "dark": { - "value": "rgb(255, 242, 240)" - }, - "light": { - "value": "rgb(59, 11, 4)" - } - }, - "negative-color-1600": { - "prop": "--spectrum-negative-color-1600", - "ref": "var(--spectrum-red-1600)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(29, 5, 2)" - } - }, - "negative-color-200": { - "prop": "--spectrum-negative-color-200", - "ref": "var(--spectrum-red-200)", - "light": { - "value": "rgb(255, 235, 232)" - }, - "dark": { - "value": "rgb(68, 13, 5)" - } - }, - "negative-color-300": { - "prop": "--spectrum-negative-color-300", - "ref": "var(--spectrum-red-300)", - "light": { - "value": "rgb(255, 214, 209)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "negative-color-400": { - "prop": "--spectrum-negative-color-400", - "ref": "var(--spectrum-red-400)", - "light": { - "value": "rgb(255, 188, 180)" - }, - "dark": { - "value": "rgb(115, 24, 11)" - } - }, - "negative-color-500": { - "prop": "--spectrum-negative-color-500", - "ref": "var(--spectrum-red-500)", - "light": { - "value": "rgb(255, 157, 145)" - }, - "dark": { - "value": "rgb(147, 31, 17)" - } - }, - "negative-color-600": { - "prop": "--spectrum-negative-color-600", - "ref": "var(--spectrum-red-600)", - "light": { - "value": "rgb(255, 118, 101)" - }, - "dark": { - "value": "rgb(177, 38, 23)" - } - }, - "negative-color-700": { - "prop": "--spectrum-negative-color-700", - "ref": "var(--spectrum-red-700)", - "light": { - "value": "rgb(255, 81, 61)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "negative-color-800": { - "prop": "--spectrum-negative-color-800", - "ref": "var(--spectrum-red-800)", - "light": { - "value": "rgb(240, 56, 35)" - }, - "dark": { - "value": "rgb(223, 52, 34)" - } - }, - "negative-color-900": { - "prop": "--spectrum-negative-color-900", - "ref": "var(--spectrum-red-900)", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "negative-content-color-default": { - "prop": "--spectrum-negative-content-color-default", - "ref": "var(--spectrum-negative-color-900)", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "negative-content-color-down": { - "prop": "--spectrum-negative-content-color-down", - "ref": "var(--spectrum-negative-color-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-content-color-hover": { - "prop": "--spectrum-negative-content-color-hover", - "ref": "var(--spectrum-negative-color-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-content-color-key-focus": { - "prop": "--spectrum-negative-content-color-key-focus", - "ref": "var(--spectrum-negative-color-1000)", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "negative-subdued-background-color-default": { - "prop": "--spectrum-negative-subdued-background-color-default", - "ref": "var(--spectrum-negative-color-300)", - "light": { - "value": "rgb(255, 235, 232)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "negative-subdued-background-color-down": { - "prop": "--spectrum-negative-subdued-background-color-down", - "ref": "var(--spectrum-negative-color-300)", - "light": { - "value": "rgb(255, 214, 209)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "negative-subdued-background-color-hover": { - "prop": "--spectrum-negative-subdued-background-color-hover", - "ref": "var(--spectrum-negative-color-300)", - "light": { - "value": "rgb(255, 214, 209)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "negative-subdued-background-color-key-focus": { - "prop": "--spectrum-negative-subdued-background-color-key-focus", - "ref": "var(--spectrum-negative-color-300)", - "light": { - "value": "rgb(255, 214, 209)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "negative-subtle-background-color-default": { - "prop": "--spectrum-negative-subtle-background-color-default", - "ref": "var(--spectrum-negative-color-300)", - "light": { - "value": "rgb(255, 235, 232)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "negative-visual-color": { - "prop": "--spectrum-negative-visual-color", - "ref": "var(--spectrum-negative-color-900)", - "light": { - "value": "rgb(240, 56, 35)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "neutral-background-color-default": { - "prop": "--spectrum-neutral-background-color-default", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-background-color-down": { - "prop": "--spectrum-neutral-background-color-down", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-background-color-hover": { - "prop": "--spectrum-neutral-background-color-hover", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-background-color-key-focus": { - "prop": "--spectrum-neutral-background-color-key-focus", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-background-color-selected-default": { - "prop": "--spectrum-neutral-background-color-selected-default", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-background-color-selected-down": { - "prop": "--spectrum-neutral-background-color-selected-down", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-background-color-selected-hover": { - "prop": "--spectrum-neutral-background-color-selected-hover", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-background-color-selected-key-focus": { - "prop": "--spectrum-neutral-background-color-selected-key-focus", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-content-color-default": { - "prop": "--spectrum-neutral-content-color-default", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-content-color-down": { - "prop": "--spectrum-neutral-content-color-down", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-content-color-focus": { - "prop": "--spectrum-neutral-content-color-focus", - "ref": "var(--spectrum-neutral-content-color-down)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-content-color-focus-hover": { - "prop": "--spectrum-neutral-content-color-focus-hover", - "ref": "var(--spectrum-neutral-content-color-down)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-content-color-hover": { - "prop": "--spectrum-neutral-content-color-hover", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-content-color-key-focus": { - "prop": "--spectrum-neutral-content-color-key-focus", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "neutral-subdued-background-color-default": { - "prop": "--spectrum-neutral-subdued-background-color-default", - "ref": "var(--spectrum-gray-500)", - "light": { - "value": "rgb(80, 80, 80)" - }, - "dark": { - "value": "rgb(109, 109, 109)" - } - }, - "neutral-subdued-background-color-down": { - "prop": "--spectrum-neutral-subdued-background-color-down", - "ref": "var(--spectrum-gray-400)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "neutral-subdued-background-color-hover": { - "prop": "--spectrum-neutral-subdued-background-color-hover", - "ref": "var(--spectrum-gray-400)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "neutral-subdued-background-color-key-focus": { - "prop": "--spectrum-neutral-subdued-background-color-key-focus", - "ref": "var(--spectrum-gray-400)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "neutral-subdued-content-color-default": { - "prop": "--spectrum-neutral-subdued-content-color-default", - "ref": "var(--spectrum-gray-700)", - "light": { - "value": "rgb(80, 80, 80)" - }, - "dark": { - "value": "rgb(175, 175, 175)" - } - }, - "neutral-subdued-content-color-down": { - "prop": "--spectrum-neutral-subdued-content-color-down", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-subdued-content-color-hover": { - "prop": "--spectrum-neutral-subdued-content-color-hover", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-subdued-content-color-key-focus": { - "prop": "--spectrum-neutral-subdued-content-color-key-focus", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-subdued-content-color-selected": { - "prop": "--spectrum-neutral-subdued-content-color-selected", - "ref": "var(--spectrum-neutral-subdued-content-color-down)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "neutral-subtle-background-color-default": { - "prop": "--spectrum-neutral-subtle-background-color-default", - "ref": "var(--spectrum-gray-300)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(57, 57, 57)" - } - }, - "neutral-visual-color": { - "prop": "--spectrum-neutral-visual-color", - "ref": "var(--spectrum-gray-600)", - "light": { - "value": "rgb(143, 143, 143)" - }, - "dark": { - "value": "rgb(138, 138, 138)" - } - }, - "notice-background-color-default": { - "prop": "--spectrum-notice-background-color-default", - "ref": "var(--spectrum-notice-color-600)", - "dark": { - "value": "rgb(224, 100, 0)" - }, - "light": { - "value": "rgb(252, 125, 0)" - } - }, - "notice-color-100": { - "prop": "--spectrum-notice-color-100", - "ref": "var(--spectrum-orange-100)", - "light": { - "value": "rgb(255, 246, 231)" - }, - "dark": { - "value": "rgb(49, 16, 0)" - } - }, - "notice-color-1000": { - "prop": "--spectrum-notice-color-1000", - "ref": "var(--spectrum-orange-1000)", - "light": { - "value": "rgb(167, 62, 0)" - }, - "dark": { - "value": "rgb(243, 117, 0)" - } - }, - "notice-color-1100": { - "prop": "--spectrum-notice-color-1100", - "ref": "var(--spectrum-orange-1100)", - "light": { - "value": "rgb(144, 51, 0)" - }, - "dark": { - "value": "rgb(255, 137, 0)" - } - }, - "notice-color-1200": { - "prop": "--spectrum-notice-color-1200", - "ref": "var(--spectrum-orange-1200)", - "light": { - "value": "rgb(118, 41, 0)" - }, - "dark": { - "value": "rgb(255, 173, 45)" - } - }, - "notice-color-1300": { - "prop": "--spectrum-notice-color-1300", - "ref": "var(--spectrum-orange-1300)", - "light": { - "value": "rgb(95, 32, 0)" - }, - "dark": { - "value": "rgb(255, 201, 116)" - } - }, - "notice-color-1400": { - "prop": "--spectrum-notice-color-1400", - "ref": "var(--spectrum-orange-1400)", - "light": { - "value": "rgb(73, 24, 0)" - }, - "dark": { - "value": "rgb(255, 225, 178)" - } - }, - "notice-color-1500": { - "prop": "--spectrum-notice-color-1500", - "ref": "var(--spectrum-orange-1500)", - "dark": { - "value": "rgb(255, 243, 225)" - }, - "light": { - "value": "rgb(52, 18, 0)" - } - }, - "notice-color-1600": { - "prop": "--spectrum-notice-color-1600", - "ref": "var(--spectrum-orange-1600)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(25, 8, 0)" - } - }, - "notice-color-200": { - "prop": "--spectrum-notice-color-200", - "ref": "var(--spectrum-orange-200)", - "light": { - "value": "rgb(255, 236, 207)" - }, - "dark": { - "value": "rgb(61, 21, 0)" - } - }, - "notice-color-300": { - "prop": "--spectrum-notice-color-300", - "ref": "var(--spectrum-orange-300)", - "light": { - "value": "rgb(255, 218, 158)" - }, - "dark": { - "value": "rgb(80, 27, 0)" - } - }, - "notice-color-400": { - "prop": "--spectrum-notice-color-400", - "ref": "var(--spectrum-orange-400)", - "light": { - "value": "rgb(255, 193, 94)" - }, - "dark": { - "value": "rgb(106, 36, 0)" - } - }, - "notice-color-500": { - "prop": "--spectrum-notice-color-500", - "ref": "var(--spectrum-orange-500)", - "light": { - "value": "rgb(255, 162, 19)" - }, - "dark": { - "value": "rgb(135, 47, 0)" - } - }, - "notice-color-600": { - "prop": "--spectrum-notice-color-600", - "ref": "var(--spectrum-orange-600)", - "light": { - "value": "rgb(252, 125, 0)" - }, - "dark": { - "value": "rgb(162, 59, 0)" - } - }, - "notice-color-700": { - "prop": "--spectrum-notice-color-700", - "ref": "var(--spectrum-orange-700)", - "light": { - "value": "rgb(232, 106, 0)" - }, - "dark": { - "value": "rgb(185, 73, 0)" - } - }, - "notice-color-800": { - "prop": "--spectrum-notice-color-800", - "ref": "var(--spectrum-orange-800)", - "light": { - "value": "rgb(212, 91, 0)" - }, - "dark": { - "value": "rgb(199, 82, 0)" - } - }, - "notice-color-900": { - "prop": "--spectrum-notice-color-900", - "ref": "var(--spectrum-orange-900)", - "light": { - "value": "rgb(194, 78, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "notice-subtle-background-color-default": { - "prop": "--spectrum-notice-subtle-background-color-default", - "ref": "var(--spectrum-notice-color-300)", - "light": { - "value": "rgb(255, 236, 207)" - }, - "dark": { - "value": "rgb(80, 27, 0)" - } - }, - "notice-visual-color": { - "prop": "--spectrum-notice-visual-color", - "ref": "var(--spectrum-notice-color-900)", - "light": { - "value": "rgb(212, 91, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "number-field-minimum-width-multiplier": { - "prop": "--spectrum-number-field-minimum-width-multiplier", - "value": 1.25 - }, - "number-field-visual-to-in-field-stepper-extra-large": { - "prop": "--spectrum-number-field-visual-to-in-field-stepper-extra-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "number-field-visual-to-in-field-stepper-large": { - "prop": "--spectrum-number-field-visual-to-in-field-stepper-large", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "number-field-visual-to-in-field-stepper-medium": { - "prop": "--spectrum-number-field-visual-to-in-field-stepper-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "number-field-visual-to-in-field-stepper-small": { - "prop": "--spectrum-number-field-visual-to-in-field-stepper-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "number-field-with-stepper-minimum-width-extra-large": { - "prop": "--spectrum-number-field-with-stepper-minimum-width-extra-large", - "desktop": { - "value": "168px" - }, - "mobile": { - "value": "198px" - } - }, - "number-field-with-stepper-minimum-width-large": { - "prop": "--spectrum-number-field-with-stepper-minimum-width-large", - "desktop": { - "value": "144px" - }, - "mobile": { - "value": "174px" - } - }, - "number-field-with-stepper-minimum-width-medium": { - "prop": "--spectrum-number-field-with-stepper-minimum-width-medium", - "desktop": { - "value": "120px" - }, - "mobile": { - "value": "150px" - } - }, - "number-field-with-stepper-minimum-width-small": { - "prop": "--spectrum-number-field-with-stepper-minimum-width-small", - "desktop": { - "value": "104px" - }, - "mobile": { - "value": "126px" - } - }, - "opacity-checkerboard-square-dark": { - "prop": "--spectrum-opacity-checkerboard-square-dark", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(225, 225, 225)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "opacity-checkerboard-square-light": { - "prop": "--spectrum-opacity-checkerboard-square-light", - "ref": "var(--spectrum-white)", - "value": "rgb(255, 255, 255)" - }, - "opacity-checkerboard-square-size": { - "prop": "--spectrum-opacity-checkerboard-square-size", - "ref": "var(--spectrum-opacity-checkerboard-square-size-medium)", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "opacity-checkerboard-square-size-medium": { - "prop": "--spectrum-opacity-checkerboard-square-size-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "opacity-checkerboard-square-size-small": { - "prop": "--spectrum-opacity-checkerboard-square-size-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "opacity-disabled": { - "prop": "--spectrum-opacity-disabled", - "value": "0.3" - }, - "orange-100": { - "prop": "--spectrum-orange-100", - "light": { - "value": "rgb(255, 246, 231)" - }, - "dark": { - "value": "rgb(49, 16, 0)" - } - }, - "orange-1000": { - "prop": "--spectrum-orange-1000", - "light": { - "value": "rgb(167, 62, 0)" - }, - "dark": { - "value": "rgb(243, 117, 0)" - } - }, - "orange-1100": { - "prop": "--spectrum-orange-1100", - "light": { - "value": "rgb(144, 51, 0)" - }, - "dark": { - "value": "rgb(255, 137, 0)" - } - }, - "orange-1200": { - "prop": "--spectrum-orange-1200", - "light": { - "value": "rgb(118, 41, 0)" - }, - "dark": { - "value": "rgb(255, 173, 45)" - } - }, - "orange-1300": { - "prop": "--spectrum-orange-1300", - "light": { - "value": "rgb(95, 32, 0)" - }, - "dark": { - "value": "rgb(255, 201, 116)" - } - }, - "orange-1400": { - "prop": "--spectrum-orange-1400", - "light": { - "value": "rgb(73, 24, 0)" - }, - "dark": { - "value": "rgb(255, 225, 178)" - } - }, - "orange-1500": { - "prop": "--spectrum-orange-1500", - "dark": { - "value": "rgb(255, 243, 225)" - }, - "light": { - "value": "rgb(52, 18, 0)" - } - }, - "orange-1600": { - "prop": "--spectrum-orange-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(25, 8, 0)" - } - }, - "orange-200": { - "prop": "--spectrum-orange-200", - "light": { - "value": "rgb(255, 236, 207)" - }, - "dark": { - "value": "rgb(61, 21, 0)" - } - }, - "orange-300": { - "prop": "--spectrum-orange-300", - "light": { - "value": "rgb(255, 218, 158)" - }, - "dark": { - "value": "rgb(80, 27, 0)" - } - }, - "orange-400": { - "prop": "--spectrum-orange-400", - "light": { - "value": "rgb(255, 193, 94)" - }, - "dark": { - "value": "rgb(106, 36, 0)" - } - }, - "orange-500": { - "prop": "--spectrum-orange-500", - "light": { - "value": "rgb(255, 162, 19)" - }, - "dark": { - "value": "rgb(135, 47, 0)" - } - }, - "orange-600": { - "prop": "--spectrum-orange-600", - "light": { - "value": "rgb(252, 125, 0)" - }, - "dark": { - "value": "rgb(162, 59, 0)" - } - }, - "orange-700": { - "prop": "--spectrum-orange-700", - "light": { - "value": "rgb(232, 106, 0)" - }, - "dark": { - "value": "rgb(185, 73, 0)" - } - }, - "orange-800": { - "prop": "--spectrum-orange-800", - "light": { - "value": "rgb(212, 91, 0)" - }, - "dark": { - "value": "rgb(199, 82, 0)" - } - }, - "orange-900": { - "prop": "--spectrum-orange-900", - "light": { - "value": "rgb(194, 78, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "orange-background-color-default": { - "prop": "--spectrum-orange-background-color-default", - "ref": "var(--spectrum-orange-900)", - "light": { - "value": "rgb(252, 125, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "orange-subtle-background-color-default": { - "prop": "--spectrum-orange-subtle-background-color-default", - "ref": "var(--spectrum-orange-300)", - "light": { - "value": "rgb(255, 236, 207)" - }, - "dark": { - "value": "rgb(80, 27, 0)" - } - }, - "orange-visual-color": { - "prop": "--spectrum-orange-visual-color", - "ref": "var(--spectrum-orange-900)", - "light": { - "value": "rgb(232, 106, 0)" - }, - "dark": { - "value": "rgb(224, 100, 0)" - } - }, - "overlay-color": { - "prop": "--spectrum-overlay-color", - "ref": "var(--spectrum-black)", - "value": "rgb(0, 0, 0)" - }, - "overlay-opacity": { - "prop": "--spectrum-overlay-opacity", - "light": { - "value": "0.4" - }, - "dark": { - "value": "0.6" - } - }, - "picker-border-width": { - "prop": "--spectrum-picker-border-width", - "ref": "var(--spectrum-border-width-100)", - "value": "1px" - }, - "picker-end-edge-to-disclosure-icon-quiet": { - "prop": "--spectrum-picker-end-edge-to-disclosure-icon-quiet", - "value": "0px" - }, - "picker-end-edge-to-disclousure-icon-quiet": { - "prop": "--spectrum-picker-end-edge-to-disclousure-icon-quiet", - "ref": "var(--spectrum-picker-end-edge-to-disclosure-icon-quiet)", - "value": "0px" - }, - "picker-minimum-width-multiplier": { - "prop": "--spectrum-picker-minimum-width-multiplier", - "value": 2 - }, - "picker-visual-to-disclosure-icon-extra-large": { - "prop": "--spectrum-picker-visual-to-disclosure-icon-extra-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "picker-visual-to-disclosure-icon-large": { - "prop": "--spectrum-picker-visual-to-disclosure-icon-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "picker-visual-to-disclosure-icon-medium": { - "prop": "--spectrum-picker-visual-to-disclosure-icon-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "picker-visual-to-disclosure-icon-small": { - "prop": "--spectrum-picker-visual-to-disclosure-icon-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "pink-100": { - "prop": "--spectrum-pink-100", - "dark": { - "value": "rgb(58, 0, 37)" - }, - "light": { - "value": "rgb(255, 246, 252)" - } - }, - "pink-1000": { - "prop": "--spectrum-pink-1000", - "dark": { - "value": "rgb(251, 90, 196)" - }, - "light": { - "value": "rgb(176, 31, 123)" - } - }, - "pink-1100": { - "prop": "--spectrum-pink-1100", - "dark": { - "value": "rgb(255, 122, 210)" - }, - "light": { - "value": "rgb(152, 22, 104)" - } - }, - "pink-1200": { - "prop": "--spectrum-pink-1200", - "dark": { - "value": "rgb(255, 159, 223)" - }, - "light": { - "value": "rgb(128, 12, 85)" - } - }, - "pink-1300": { - "prop": "--spectrum-pink-1300", - "dark": { - "value": "rgb(255, 191, 234)" - }, - "light": { - "value": "rgb(105, 3, 68)" - } - }, - "pink-1400": { - "prop": "--spectrum-pink-1400", - "dark": { - "value": "rgb(255, 219, 243)" - }, - "light": { - "value": "rgb(83, 0, 53)" - } - }, - "pink-1500": { - "prop": "--spectrum-pink-1500", - "dark": { - "value": "rgb(255, 241, 250)" - }, - "light": { - "value": "rgb(62, 0, 39)" - } - }, - "pink-1600": { - "prop": "--spectrum-pink-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(33, 0, 21)" - } - }, - "pink-200": { - "prop": "--spectrum-pink-200", - "dark": { - "value": "rgb(71, 0, 44)" - }, - "light": { - "value": "rgb(255, 232, 247)" - } - }, - "pink-300": { - "prop": "--spectrum-pink-300", - "dark": { - "value": "rgb(90, 0, 57)" - }, - "light": { - "value": "rgb(255, 211, 240)" - } - }, - "pink-400": { - "prop": "--spectrum-pink-400", - "dark": { - "value": "rgb(115, 7, 75)" - }, - "light": { - "value": "rgb(255, 181, 230)" - } - }, - "pink-500": { - "prop": "--spectrum-pink-500", - "dark": { - "value": "rgb(143, 18, 97)" - }, - "light": { - "value": "rgb(255, 148, 219)" - } - }, - "pink-600": { - "prop": "--spectrum-pink-600", - "dark": { - "value": "rgb(171, 29, 119)" - }, - "light": { - "value": "rgb(255, 103, 204)" - } - }, - "pink-700": { - "prop": "--spectrum-pink-700", - "dark": { - "value": "rgb(196, 39, 138)" - }, - "light": { - "value": "rgb(242, 76, 184)" - } - }, - "pink-800": { - "prop": "--spectrum-pink-800", - "dark": { - "value": "rgb(213, 45, 151)" - }, - "light": { - "value": "rgb(228, 52, 163)" - } - }, - "pink-900": { - "prop": "--spectrum-pink-900", - "dark": { - "value": "rgb(236, 67, 175)" - }, - "light": { - "value": "rgb(206, 42, 146)" - } - }, - "pink-background-color-default": { - "prop": "--spectrum-pink-background-color-default", - "ref": "var(--spectrum-pink-800)", - "light": { - "value": "rgb(206, 42, 146)" - }, - "dark": { - "value": "rgb(213, 45, 151)" - } - }, - "pink-subtle-background-color-default": { - "prop": "--spectrum-pink-subtle-background-color-default", - "ref": "var(--spectrum-pink-300)", - "light": { - "value": "rgb(255, 232, 247)" - }, - "dark": { - "value": "rgb(90, 0, 57)" - } - }, - "pink-visual-color": { - "prop": "--spectrum-pink-visual-color", - "ref": "var(--spectrum-pink-900)", - "light": { - "value": "rgb(228, 52, 163)" - }, - "dark": { - "value": "rgb(236, 67, 175)" - } - }, - "popover-border-color": { - "prop": "--spectrum-popover-border-color", - "light": { - "ref": "var(--spectrum-transparent-white-25)", - "value": "rgba(255, 255, 255, 0)" - }, - "ref": "var(--spectrum-gray-400)", - "dark": { - "value": "rgb(68, 68, 68)" - } - }, - "popover-border-opacity": { - "prop": "--spectrum-popover-border-opacity", - "light": { - "value": "0" - }, - "dark": { - "value": "1.0" - } - }, - "popover-edge-to-content-area": { - "prop": "--spectrum-popover-edge-to-content-area", - "ref": "var(--spectrum-spacing-100)", - "value": "8px" - }, - "popover-tip-height": { - "prop": "--spectrum-popover-tip-height", - "value": "8px" - }, - "popover-tip-width": { - "prop": "--spectrum-popover-tip-width", - "value": "16px" - }, - "popover-top-to-content-area": { - "prop": "--spectrum-popover-top-to-content-area", - "ref": "var(--spectrum-popover-edge-to-content-area)", - "value": "8px" - }, - "positive-background-color-default": { - "prop": "--spectrum-positive-background-color-default", - "ref": "var(--spectrum-positive-color-800)", - "light": { - "value": "rgb(5, 131, 78)" - }, - "dark": { - "value": "rgb(6, 136, 80)" - } - }, - "positive-background-color-down": { - "prop": "--spectrum-positive-background-color-down", - "ref": "var(--spectrum-positive-color-700)", - "light": { - "value": "rgb(3, 110, 69)" - }, - "dark": { - "value": "rgb(4, 124, 75)" - } - }, - "positive-background-color-hover": { - "prop": "--spectrum-positive-background-color-hover", - "ref": "var(--spectrum-positive-color-700)", - "light": { - "value": "rgb(3, 110, 69)" - }, - "dark": { - "value": "rgb(4, 124, 75)" - } - }, - "positive-background-color-key-focus": { - "prop": "--spectrum-positive-background-color-key-focus", - "ref": "var(--spectrum-positive-color-700)", - "light": { - "value": "rgb(3, 110, 69)" - }, - "dark": { - "value": "rgb(4, 124, 75)" - } - }, - "positive-color-100": { - "prop": "--spectrum-positive-color-100", - "ref": "var(--spectrum-green-100)", - "light": { - "value": "rgb(237, 252, 241)" - }, - "dark": { - "value": "rgb(0, 30, 23)" - } - }, - "positive-color-1000": { - "prop": "--spectrum-positive-color-1000", - "ref": "var(--spectrum-green-1000)", - "light": { - "value": "rgb(3, 110, 69)" - }, - "dark": { - "value": "rgb(14, 175, 98)" - } - }, - "positive-color-1100": { - "prop": "--spectrum-positive-color-1100", - "ref": "var(--spectrum-green-1100)", - "light": { - "value": "rgb(2, 93, 60)" - }, - "dark": { - "value": "rgb(24, 193, 110)" - } - }, - "positive-color-1200": { - "prop": "--spectrum-positive-color-1200", - "ref": "var(--spectrum-green-1200)", - "light": { - "value": "rgb(1, 76, 52)" - }, - "dark": { - "value": "rgb(57, 215, 134)" - } - }, - "positive-color-1300": { - "prop": "--spectrum-positive-color-1300", - "ref": "var(--spectrum-green-1300)", - "light": { - "value": "rgb(0, 61, 44)" - }, - "dark": { - "value": "rgb(126, 231, 172)" - } - }, - "positive-color-1400": { - "prop": "--spectrum-positive-color-1400", - "ref": "var(--spectrum-green-1400)", - "light": { - "value": "rgb(0, 46, 34)" - }, - "dark": { - "value": "rgb(189, 241, 208)" - } - }, - "positive-color-1500": { - "prop": "--spectrum-positive-color-1500", - "ref": "var(--spectrum-green-1500)", - "dark": { - "value": "rgb(229, 250, 236)" - }, - "light": { - "value": "rgb(0, 33, 25)" - } - }, - "positive-color-1600": { - "prop": "--spectrum-positive-color-1600", - "ref": "var(--spectrum-green-1600)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 15, 12)" - } - }, - "positive-color-200": { - "prop": "--spectrum-positive-color-200", - "ref": "var(--spectrum-green-200)", - "light": { - "value": "rgb(215, 247, 225)" - }, - "dark": { - "value": "rgb(0, 38, 29)" - } - }, - "positive-color-300": { - "prop": "--spectrum-positive-color-300", - "ref": "var(--spectrum-green-300)", - "light": { - "value": "rgb(173, 238, 197)" - }, - "dark": { - "value": "rgb(0, 51, 38)" - } - }, - "positive-color-400": { - "prop": "--spectrum-positive-color-400", - "ref": "var(--spectrum-green-400)", - "light": { - "value": "rgb(107, 227, 162)" - }, - "dark": { - "value": "rgb(0, 68, 48)" - } - }, - "positive-color-500": { - "prop": "--spectrum-positive-color-500", - "ref": "var(--spectrum-green-500)", - "light": { - "value": "rgb(43, 209, 125)" - }, - "dark": { - "value": "rgb(2, 87, 58)" - } - }, - "positive-color-600": { - "prop": "--spectrum-positive-color-600", - "ref": "var(--spectrum-green-600)", - "light": { - "value": "rgb(18, 184, 103)" - }, - "dark": { - "value": "rgb(3, 106, 67)" - } - }, - "positive-color-700": { - "prop": "--spectrum-positive-color-700", - "ref": "var(--spectrum-green-700)", - "light": { - "value": "rgb(11, 164, 93)" - }, - "dark": { - "value": "rgb(4, 124, 75)" - } - }, - "positive-color-800": { - "prop": "--spectrum-positive-color-800", - "ref": "var(--spectrum-green-800)", - "light": { - "value": "rgb(7, 147, 85)" - }, - "dark": { - "value": "rgb(6, 136, 80)" - } - }, - "positive-color-900": { - "prop": "--spectrum-positive-color-900", - "ref": "var(--spectrum-green-900)", - "light": { - "value": "rgb(5, 131, 78)" - }, - "dark": { - "value": "rgb(9, 157, 89)" - } - }, - "positive-subtle-background-color-default": { - "prop": "--spectrum-positive-subtle-background-color-default", - "ref": "var(--spectrum-positive-color-300)", - "light": { - "value": "rgb(215, 247, 225)" - }, - "dark": { - "value": "rgb(0, 51, 38)" - } - }, - "positive-visual-color": { - "prop": "--spectrum-positive-visual-color", - "ref": "var(--spectrum-positive-color-900)", - "light": { - "value": "rgb(7, 147, 85)" - }, - "dark": { - "value": "rgb(9, 157, 89)" - } - }, - "progress-bar-maximum-width": { - "prop": "--spectrum-progress-bar-maximum-width", - "value": "768px" - }, - "progress-bar-minimum-width": { - "prop": "--spectrum-progress-bar-minimum-width", - "value": "48px" - }, - "progress-bar-thickness-extra-large": { - "prop": "--spectrum-progress-bar-thickness-extra-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "progress-bar-thickness-large": { - "prop": "--spectrum-progress-bar-thickness-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "progress-bar-thickness-medium": { - "prop": "--spectrum-progress-bar-thickness-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "progress-bar-thickness-small": { - "prop": "--spectrum-progress-bar-thickness-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "progress-circle-size-large": { - "prop": "--spectrum-progress-circle-size-large", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "80px" - } - }, - "progress-circle-size-medium": { - "prop": "--spectrum-progress-circle-size-medium", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "progress-circle-size-small": { - "prop": "--spectrum-progress-circle-size-small", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "progress-circle-thickness-large": { - "prop": "--spectrum-progress-circle-thickness-large", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "progress-circle-thickness-medium": { - "prop": "--spectrum-progress-circle-thickness-medium", - "desktop": { - "value": "3px" - }, - "mobile": { - "value": "4px" - } - }, - "progress-circle-thickness-small": { - "prop": "--spectrum-progress-circle-thickness-small", - "desktop": { - "value": "2px" - }, - "mobile": { - "value": "3px" - } - }, - "purple-100": { - "prop": "--spectrum-purple-100", - "light": { - "value": "rgb(251, 247, 254)" - }, - "dark": { - "value": "rgb(41, 0, 79)" - } - }, - "purple-1000": { - "prop": "--spectrum-purple-1000", - "light": { - "value": "rgb(134, 40, 217)" - }, - "dark": { - "value": "rgb(186, 127, 237)" - } - }, - "purple-1100": { - "prop": "--spectrum-purple-1100", - "light": { - "value": "rgb(115, 13, 204)" - }, - "dark": { - "value": "rgb(197, 149, 240)" - } - }, - "purple-1200": { - "prop": "--spectrum-purple-1200", - "light": { - "value": "rgb(93, 0, 177)" - }, - "dark": { - "value": "rgb(212, 176, 244)" - } - }, - "purple-1300": { - "prop": "--spectrum-purple-1300", - "light": { - "value": "rgb(75, 0, 144)" - }, - "dark": { - "value": "rgb(225, 201, 247)" - } - }, - "purple-1400": { - "prop": "--spectrum-purple-1400", - "light": { - "value": "rgb(59, 0, 111)" - }, - "dark": { - "value": "rgb(238, 224, 250)" - } - }, - "purple-1500": { - "prop": "--spectrum-purple-1500", - "dark": { - "value": "rgb(248, 243, 253)" - }, - "light": { - "value": "rgb(44, 0, 84)" - } - }, - "purple-1600": { - "prop": "--spectrum-purple-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(23, 0, 45)" - } - }, - "purple-200": { - "prop": "--spectrum-purple-200", - "light": { - "value": "rgb(244, 235, 252)" - }, - "dark": { - "value": "rgb(50, 0, 96)" - } - }, - "purple-300": { - "prop": "--spectrum-purple-300", - "light": { - "value": "rgb(235, 218, 249)" - }, - "dark": { - "value": "rgb(64, 0, 122)" - } - }, - "purple-400": { - "prop": "--spectrum-purple-400", - "light": { - "value": "rgb(221, 193, 246)" - }, - "dark": { - "value": "rgb(83, 0, 159)" - } - }, - "purple-500": { - "prop": "--spectrum-purple-500", - "light": { - "value": "rgb(208, 167, 243)" - }, - "dark": { - "value": "rgb(107, 6, 195)" - } - }, - "purple-600": { - "prop": "--spectrum-purple-600", - "light": { - "value": "rgb(191, 138, 238)" - }, - "dark": { - "value": "rgb(130, 34, 215)" - } - }, - "purple-700": { - "prop": "--spectrum-purple-700", - "light": { - "value": "rgb(178, 114, 235)" - }, - "dark": { - "value": "rgb(148, 62, 224)" - } - }, - "purple-800": { - "prop": "--spectrum-purple-800", - "light": { - "value": "rgb(166, 92, 231)" - }, - "dark": { - "value": "rgb(157, 78, 228)" - } - }, - "purple-900": { - "prop": "--spectrum-purple-900", - "light": { - "value": "rgb(154, 71, 226)" - }, - "dark": { - "value": "rgb(173, 105, 233)" - } - }, - "purple-background-color-default": { - "prop": "--spectrum-purple-background-color-default", - "ref": "var(--spectrum-purple-800)", - "light": { - "value": "rgb(154, 71, 226)" - }, - "dark": { - "value": "rgb(157, 78, 228)" - } - }, - "purple-subtle-background-color-default": { - "prop": "--spectrum-purple-subtle-background-color-default", - "ref": "var(--spectrum-purple-300)", - "light": { - "value": "rgb(244, 235, 252)" - }, - "dark": { - "value": "rgb(64, 0, 122)" - } - }, - "purple-visual-color": { - "prop": "--spectrum-purple-visual-color", - "ref": "var(--spectrum-purple-900)", - "light": { - "value": "rgb(166, 92, 231)" - }, - "dark": { - "value": "rgb(173, 105, 233)" - } - }, - "radio-button-control-size-extra-large": { - "prop": "--spectrum-radio-button-control-size-extra-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "radio-button-control-size-large": { - "prop": "--spectrum-radio-button-control-size-large", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "radio-button-control-size-medium": { - "prop": "--spectrum-radio-button-control-size-medium", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "radio-button-control-size-small": { - "prop": "--spectrum-radio-button-control-size-small", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "radio-button-selection-indicator": { - "prop": "--spectrum-radio-button-selection-indicator", - "value": "4px" - }, - "radio-button-top-to-control-extra-large": { - "prop": "--spectrum-radio-button-top-to-control-extra-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "radio-button-top-to-control-large": { - "prop": "--spectrum-radio-button-top-to-control-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "radio-button-top-to-control-medium": { - "prop": "--spectrum-radio-button-top-to-control-medium", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "radio-button-top-to-control-small": { - "prop": "--spectrum-radio-button-top-to-control-small", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "rating-bottom-to-content-area-medium": { - "prop": "--spectrum-rating-bottom-to-content-area-medium", - "value": "6px" - }, - "rating-bottom-to-content-area-small": { - "prop": "--spectrum-rating-bottom-to-content-area-small", - "ref": "var(--spectrum-spacing-75)", - "value": "4px" - }, - "rating-edge-to-content-area-medium": { - "prop": "--spectrum-rating-edge-to-content-area-medium", - "value": "6px" - }, - "rating-edge-to-content-area-small": { - "prop": "--spectrum-rating-edge-to-content-area-small", - "ref": "var(--spectrum-spacing-75)", - "value": "4px" - }, - "rating-height-medium": { - "prop": "--spectrum-rating-height-medium", - "ref": "var(--spectrum-component-height-100)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "rating-height-small": { - "prop": "--spectrum-rating-height-small", - "ref": "var(--spectrum-component-height-75)", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "rating-indicator-to-icon": { - "prop": "--spectrum-rating-indicator-to-icon", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "rating-indicator-width": { - "prop": "--spectrum-rating-indicator-width", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "rating-top-to-content-area-medium": { - "prop": "--spectrum-rating-top-to-content-area-medium", - "value": "6px" - }, - "rating-top-to-content-area-small": { - "prop": "--spectrum-rating-top-to-content-area-small", - "ref": "var(--spectrum-spacing-75)", - "value": "4px" - }, - "rating-width-medium": { - "prop": "--spectrum-rating-width-medium", - "value": "128px" - }, - "rating-width-small": { - "prop": "--spectrum-rating-width-small", - "value": "104px" - }, - "red-100": { - "prop": "--spectrum-red-100", - "light": { - "value": "rgb(255, 246, 245)" - }, - "dark": { - "value": "rgb(54, 10, 3)" - } - }, - "red-1000": { - "prop": "--spectrum-red-1000", - "light": { - "value": "rgb(183, 40, 24)" - }, - "dark": { - "value": "rgb(255, 103, 86)" - } - }, - "red-1100": { - "prop": "--spectrum-red-1100", - "light": { - "value": "rgb(156, 33, 19)" - }, - "dark": { - "value": "rgb(255, 134, 120)" - } - }, - "red-1200": { - "prop": "--spectrum-red-1200", - "light": { - "value": "rgb(129, 27, 14)" - }, - "dark": { - "value": "rgb(255, 167, 157)" - } - }, - "red-1300": { - "prop": "--spectrum-red-1300", - "light": { - "value": "rgb(104, 21, 10)" - }, - "dark": { - "value": "rgb(255, 196, 189)" - } - }, - "red-1400": { - "prop": "--spectrum-red-1400", - "light": { - "value": "rgb(80, 16, 6)" - }, - "dark": { - "value": "rgb(255, 222, 219)" - } - }, - "red-1500": { - "prop": "--spectrum-red-1500", - "dark": { - "value": "rgb(255, 242, 240)" - }, - "light": { - "value": "rgb(59, 11, 4)" - } - }, - "red-1600": { - "prop": "--spectrum-red-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(29, 5, 2)" - } - }, - "red-200": { - "prop": "--spectrum-red-200", - "light": { - "value": "rgb(255, 235, 232)" - }, - "dark": { - "value": "rgb(68, 13, 5)" - } - }, - "red-300": { - "prop": "--spectrum-red-300", - "light": { - "value": "rgb(255, 214, 209)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "red-400": { - "prop": "--spectrum-red-400", - "light": { - "value": "rgb(255, 188, 180)" - }, - "dark": { - "value": "rgb(115, 24, 11)" - } - }, - "red-500": { - "prop": "--spectrum-red-500", - "light": { - "value": "rgb(255, 157, 145)" - }, - "dark": { - "value": "rgb(147, 31, 17)" - } - }, - "red-600": { - "prop": "--spectrum-red-600", - "light": { - "value": "rgb(255, 118, 101)" - }, - "dark": { - "value": "rgb(177, 38, 23)" - } - }, - "red-700": { - "prop": "--spectrum-red-700", - "light": { - "value": "rgb(255, 81, 61)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "red-800": { - "prop": "--spectrum-red-800", - "light": { - "value": "rgb(240, 56, 35)" - }, - "dark": { - "value": "rgb(223, 52, 34)" - } - }, - "red-900": { - "prop": "--spectrum-red-900", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(252, 67, 46)" - } - }, - "red-background-color-default": { - "prop": "--spectrum-red-background-color-default", - "ref": "var(--spectrum-red-800)", - "light": { - "value": "rgb(215, 50, 32)" - }, - "dark": { - "value": "rgb(223, 52, 34)" - } - }, - "red-subtle-background-color-default": { - "prop": "--spectrum-red-subtle-background-color-default", - "ref": "var(--spectrum-red-300)", - "light": { - "value": "rgb(255, 235, 232)" - }, - "dark": { - "value": "rgb(87, 17, 7)" - } - }, - "red-visual-color": { - "prop": "--spectrum-red-visual-color", - "ref": "var(--spectrum-red-700)", - "light": { - "value": "rgb(240, 56, 35)" - }, - "dark": { - "value": "rgb(205, 46, 29)" - } - }, - "regular-font-weight": { - "prop": "--spectrum-regular-font-weight", - "ref": "regular", - "value": "400" - }, - "sans-serif-font-family": { - "prop": "--spectrum-sans-serif-font-family", - "value": "Adobe Clean" - }, - "seafoam-100": { - "prop": "--spectrum-seafoam-100", - "light": { - "value": "rgb(235, 251, 246)" - }, - "dark": { - "value": "rgb(0, 30, 27)" - } - }, - "seafoam-1000": { - "prop": "--spectrum-seafoam-1000", - "light": { - "value": "rgb(5, 108, 92)" - }, - "dark": { - "value": "rgb(12, 173, 142)" - } - }, - "seafoam-1100": { - "prop": "--spectrum-seafoam-1100", - "light": { - "value": "rgb(3, 92, 80)" - }, - "dark": { - "value": "rgb(14, 190, 156)" - } - }, - "seafoam-1200": { - "prop": "--spectrum-seafoam-1200", - "light": { - "value": "rgb(1, 75, 67)" - }, - "dark": { - "value": "rgb(29, 214, 176)" - } - }, - "seafoam-1300": { - "prop": "--spectrum-seafoam-1300", - "light": { - "value": "rgb(0, 60, 54)" - }, - "dark": { - "value": "rgb(122, 229, 203)" - } - }, - "seafoam-1400": { - "prop": "--spectrum-seafoam-1400", - "light": { - "value": "rgb(0, 46, 40)" - }, - "dark": { - "value": "rgb(186, 241, 222)" - } - }, - "seafoam-1500": { - "prop": "--spectrum-seafoam-1500", - "dark": { - "value": "rgb(229, 249, 243)" - }, - "light": { - "value": "rgb(0, 33, 29)" - } - }, - "seafoam-1600": { - "prop": "--spectrum-seafoam-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 15, 14)" - } - }, - "seafoam-200": { - "prop": "--spectrum-seafoam-200", - "light": { - "value": "rgb(211, 246, 234)" - }, - "dark": { - "value": "rgb(0, 39, 35)" - } - }, - "seafoam-300": { - "prop": "--spectrum-seafoam-300", - "light": { - "value": "rgb(169, 237, 216)" - }, - "dark": { - "value": "rgb(0, 50, 44)" - } - }, - "seafoam-400": { - "prop": "--spectrum-seafoam-400", - "light": { - "value": "rgb(92, 225, 194)" - }, - "dark": { - "value": "rgb(0, 67, 59)" - } - }, - "seafoam-500": { - "prop": "--spectrum-seafoam-500", - "light": { - "value": "rgb(16, 207, 169)" - }, - "dark": { - "value": "rgb(2, 86, 75)" - } - }, - "seafoam-600": { - "prop": "--spectrum-seafoam-600", - "light": { - "value": "rgb(13, 181, 149)" - }, - "dark": { - "value": "rgb(4, 105, 89)" - } - }, - "seafoam-700": { - "prop": "--spectrum-seafoam-700", - "light": { - "value": "rgb(11, 162, 134)" - }, - "dark": { - "value": "rgb(6, 122, 103)" - } - }, - "seafoam-800": { - "prop": "--spectrum-seafoam-800", - "light": { - "value": "rgb(9, 144, 120)" - }, - "dark": { - "value": "rgb(8, 134, 112)" - } - }, - "seafoam-900": { - "prop": "--spectrum-seafoam-900", - "light": { - "value": "rgb(7, 129, 109)" - }, - "dark": { - "value": "rgb(10, 154, 128)" - } - }, - "seafoam-background-color-default": { - "prop": "--spectrum-seafoam-background-color-default", - "ref": "var(--spectrum-seafoam-800)", - "light": { - "value": "rgb(7, 129, 109)" - }, - "dark": { - "value": "rgb(8, 134, 112)" - } - }, - "seafoam-subtle-background-color-default": { - "prop": "--spectrum-seafoam-subtle-background-color-default", - "ref": "var(--spectrum-seafoam-300)", - "light": { - "value": "rgb(211, 246, 234)" - }, - "dark": { - "value": "rgb(0, 50, 44)" - } - }, - "seafoam-visual-color": { - "prop": "--spectrum-seafoam-visual-color", - "ref": "var(--spectrum-seafoam-800)", - "light": { - "value": "rgb(11, 162, 134)" - }, - "dark": { - "value": "rgb(8, 134, 112)" - } - }, - "search-field-minimum-width-multiplier": { - "prop": "--spectrum-search-field-minimum-width-multiplier", - "value": 4 - }, - "segmented-control-item-height": { - "prop": "--spectrum-segmented-control-item-height", - "ref": "var(--spectrum-component-height-100)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "segmented-control-item-maximum-width": { - "prop": "--spectrum-segmented-control-item-maximum-width", - "value": "265px" - }, - "segmented-control-selection-border-width": { - "prop": "--spectrum-segmented-control-selection-border-width", - "ref": "var(--spectrum-border-width-200)", - "value": "2px" - }, - "segmented-text-field-gap": { - "prop": "--spectrum-segmented-text-field-gap", - "value": "0px" - }, - "segmented-text-field-rounding": { - "prop": "--spectrum-segmented-text-field-rounding", - "value": "2px" - }, - "select-box-edge-to-checkbox": { - "prop": "--spectrum-select-box-edge-to-checkbox", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "select-box-horizontal-end-to-content": { - "prop": "--spectrum-select-box-horizontal-end-to-content", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "select-box-horizontal-illustration-to-label": { - "prop": "--spectrum-select-box-horizontal-illustration-to-label", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "select-box-horizontal-label-to-description": { - "prop": "--spectrum-select-box-horizontal-label-to-description", - "desktop": { - "value": "2px" - }, - "mobile": { - "value": "3px" - } - }, - "select-box-horizontal-minimum-height": { - "prop": "--spectrum-select-box-horizontal-minimum-height", - "desktop": { - "value": "80px" - }, - "mobile": { - "value": "100px" - } - }, - "select-box-horizontal-start-to-content": { - "prop": "--spectrum-select-box-horizontal-start-to-content", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "select-box-horizontal-top-to-content": { - "prop": "--spectrum-select-box-horizontal-top-to-content", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "select-box-horizontal-width": { - "prop": "--spectrum-select-box-horizontal-width", - "desktop": { - "value": "368px" - }, - "mobile": { - "value": "460px" - } - }, - "select-box-selected-border-color": { - "prop": "--spectrum-select-box-selected-border-color", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "select-box-top-to-checkbox": { - "prop": "--spectrum-select-box-top-to-checkbox", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "select-box-vertical-edge-to-content": { - "prop": "--spectrum-select-box-vertical-edge-to-content", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "select-box-vertical-height": { - "prop": "--spectrum-select-box-vertical-height", - "desktop": { - "value": "170px" - }, - "mobile": { - "value": "212px" - } - }, - "select-box-vertical-illustration-to-label": { - "prop": "--spectrum-select-box-vertical-illustration-to-label", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "serif-font-family": { - "prop": "--spectrum-serif-font-family", - "value": "Adobe Clean Serif" - }, - "side-focus-indicator": { - "prop": "--spectrum-side-focus-indicator", - "value": "4px" - }, - "side-label-character-count-to-field": { - "prop": "--spectrum-side-label-character-count-to-field", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "side-label-character-count-top-margin-extra-large": { - "prop": "--spectrum-side-label-character-count-top-margin-extra-large", - "value": "0px" - }, - "side-label-character-count-top-margin-large": { - "prop": "--spectrum-side-label-character-count-top-margin-large", - "value": "0px" - }, - "side-label-character-count-top-margin-medium": { - "prop": "--spectrum-side-label-character-count-top-margin-medium", - "value": "0px" - }, - "side-label-character-count-top-margin-small": { - "prop": "--spectrum-side-label-character-count-top-margin-small", - "value": "0px" - }, - "side-navigation-bottom-to-text": { - "prop": "--spectrum-side-navigation-bottom-to-text", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "side-navigation-header-to-item": { - "prop": "--spectrum-side-navigation-header-to-item", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "side-navigation-item-to-header": { - "prop": "--spectrum-side-navigation-item-to-header", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "side-navigation-item-to-item": { - "prop": "--spectrum-side-navigation-item-to-item", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "side-navigation-maximum-width": { - "prop": "--spectrum-side-navigation-maximum-width", - "desktop": { - "value": "240px" - }, - "mobile": { - "value": "300px" - } - }, - "side-navigation-minimum-width": { - "prop": "--spectrum-side-navigation-minimum-width", - "desktop": { - "value": "160px" - }, - "mobile": { - "value": "200px" - } - }, - "side-navigation-second-level-edge-to-text": { - "prop": "--spectrum-side-navigation-second-level-edge-to-text", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "side-navigation-third-level-edge-to-text": { - "prop": "--spectrum-side-navigation-third-level-edge-to-text", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "45px" - } - }, - "side-navigation-width": { - "prop": "--spectrum-side-navigation-width", - "desktop": { - "value": "192px" - }, - "mobile": { - "value": "240px" - } - }, - "side-navigation-with-icon-second-level-edge-to-text": { - "prop": "--spectrum-side-navigation-with-icon-second-level-edge-to-text", - "desktop": { - "value": "50px" - }, - "mobile": { - "value": "62px" - } - }, - "side-navigation-with-icon-third-level-edge-to-text": { - "prop": "--spectrum-side-navigation-with-icon-third-level-edge-to-text", - "desktop": { - "value": "62px" - }, - "mobile": { - "value": "77px" - } - }, - "silver-100": { - "prop": "--spectrum-silver-100", - "dark": { - "value": "rgb(26, 26, 26)" - }, - "light": { - "value": "rgb(247, 247, 247)" - } - }, - "silver-1000": { - "prop": "--spectrum-silver-1000", - "dark": { - "value": "rgb(152, 152, 152)" - }, - "light": { - "value": "rgb(96, 96, 96)" - } - }, - "silver-1100": { - "prop": "--spectrum-silver-1100", - "dark": { - "value": "rgb(169, 169, 169)" - }, - "light": { - "value": "rgb(81, 81, 81)" - } - }, - "silver-1200": { - "prop": "--spectrum-silver-1200", - "dark": { - "value": "rgb(190, 190, 190)" - }, - "light": { - "value": "rgb(66, 66, 66)" - } - }, - "silver-1300": { - "prop": "--spectrum-silver-1300", - "dark": { - "value": "rgb(211, 211, 211)" - }, - "light": { - "value": "rgb(52, 52, 52)" - } - }, - "silver-1400": { - "prop": "--spectrum-silver-1400", - "dark": { - "value": "rgb(229, 229, 229)" - }, - "light": { - "value": "rgb(39, 39, 39)" - } - }, - "silver-1500": { - "prop": "--spectrum-silver-1500", - "dark": { - "value": "rgb(244, 244, 244)" - }, - "light": { - "value": "rgb(28, 28, 28)" - } - }, - "silver-1600": { - "prop": "--spectrum-silver-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(12, 12, 12)" - } - }, - "silver-200": { - "prop": "--spectrum-silver-200", - "dark": { - "value": "rgb(33, 33, 33)" - }, - "light": { - "value": "rgb(239, 239, 239)" - } - }, - "silver-300": { - "prop": "--spectrum-silver-300", - "dark": { - "value": "rgb(44, 44, 44)" - }, - "light": { - "value": "rgb(223, 223, 223)" - } - }, - "silver-400": { - "prop": "--spectrum-silver-400", - "dark": { - "value": "rgb(59, 59, 59)" - }, - "light": { - "value": "rgb(204, 204, 204)" - } - }, - "silver-500": { - "prop": "--spectrum-silver-500", - "dark": { - "value": "rgb(76, 76, 76)" - }, - "light": { - "value": "rgb(183, 183, 183)" - } - }, - "silver-600": { - "prop": "--spectrum-silver-600", - "dark": { - "value": "rgb(92, 92, 92)" - }, - "light": { - "value": "rgb(160, 160, 160)" - } - }, - "silver-700": { - "prop": "--spectrum-silver-700", - "dark": { - "value": "rgb(108, 108, 108)" - }, - "light": { - "value": "rgb(143, 143, 143)" - } - }, - "silver-800": { - "prop": "--spectrum-silver-800", - "dark": { - "value": "rgb(118, 118, 118)" - }, - "light": { - "value": "rgb(128, 128, 128)" - } - }, - "silver-900": { - "prop": "--spectrum-silver-900", - "dark": { - "value": "rgb(137, 137, 137)" - }, - "light": { - "value": "rgb(114, 114, 114)" - } - }, - "silver-background-color-default": { - "prop": "--spectrum-silver-background-color-default", - "ref": "var(--spectrum-silver-800)", - "light": { - "value": "rgb(114, 114, 114)" - }, - "dark": { - "value": "rgb(118, 118, 118)" - } - }, - "silver-subtle-background-color-default": { - "prop": "--spectrum-silver-subtle-background-color-default", - "ref": "var(--spectrum-silver-300)", - "light": { - "value": "rgb(239, 239, 239)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "silver-visual-color": { - "prop": "--spectrum-silver-visual-color", - "ref": "var(--spectrum-silver-900)", - "light": { - "value": "rgb(128, 128, 128)" - }, - "dark": { - "value": "rgb(137, 137, 137)" - } - }, - "single-calendar-popover-minimum-height": { - "prop": "--spectrum-single-calendar-popover-minimum-height", - "value": "320px" - }, - "single-calendar-popover-minimum-width": { - "prop": "--spectrum-single-calendar-popover-minimum-width", - "value": "320px" - }, - "slider-bottom-to-handle-extra-large": { - "prop": "--spectrum-slider-bottom-to-handle-extra-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "slider-bottom-to-handle-large": { - "prop": "--spectrum-slider-bottom-to-handle-large", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "slider-bottom-to-handle-medium": { - "prop": "--spectrum-slider-bottom-to-handle-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "slider-bottom-to-handle-small": { - "prop": "--spectrum-slider-bottom-to-handle-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "slider-control-height-extra-large": { - "prop": "--spectrum-slider-control-height-extra-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "26px" - } - }, - "slider-control-height-large": { - "prop": "--spectrum-slider-control-height-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "slider-control-height-medium": { - "prop": "--spectrum-slider-control-height-medium", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "slider-control-height-small": { - "prop": "--spectrum-slider-control-height-small", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "slider-control-to-field-label-editable-extra-large": { - "prop": "--spectrum-slider-control-to-field-label-editable-extra-large", - "desktop": { - "value": "-20px" - }, - "mobile": { - "value": "-24px" - } - }, - "slider-control-to-field-label-editable-large": { - "prop": "--spectrum-slider-control-to-field-label-editable-large", - "desktop": { - "value": "-16px" - }, - "mobile": { - "value": "-20px" - } - }, - "slider-control-to-field-label-editable-medium": { - "prop": "--spectrum-slider-control-to-field-label-editable-medium", - "desktop": { - "value": "-12px" - }, - "mobile": { - "value": "-16px" - } - }, - "slider-control-to-field-label-editable-small": { - "prop": "--spectrum-slider-control-to-field-label-editable-small", - "desktop": { - "value": "-4px" - }, - "mobile": { - "value": "-8px" - } - }, - "slider-control-to-field-label-extra-large": { - "prop": "--spectrum-slider-control-to-field-label-extra-large", - "desktop": { - "value": "-20px" - }, - "mobile": { - "value": "-28px" - } - }, - "slider-control-to-field-label-large": { - "prop": "--spectrum-slider-control-to-field-label-large", - "desktop": { - "value": "-16px" - }, - "mobile": { - "value": "-20px" - } - }, - "slider-control-to-field-label-medium": { - "prop": "--spectrum-slider-control-to-field-label-medium", - "desktop": { - "value": "-12px" - }, - "mobile": { - "value": "-16px" - } - }, - "slider-control-to-field-label-side-extra-large": { - "prop": "--spectrum-slider-control-to-field-label-side-extra-large", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "28px" - } - }, - "slider-control-to-field-label-side-large": { - "prop": "--spectrum-slider-control-to-field-label-side-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "slider-control-to-field-label-side-medium": { - "prop": "--spectrum-slider-control-to-field-label-side-medium", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "slider-control-to-field-label-side-small": { - "prop": "--spectrum-slider-control-to-field-label-side-small", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "slider-control-to-field-label-small": { - "prop": "--spectrum-slider-control-to-field-label-small", - "desktop": { - "value": "-4px" - }, - "mobile": { - "value": "-8px" - } - }, - "slider-control-to-text-field-extra-large": { - "prop": "--spectrum-slider-control-to-text-field-extra-large", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "28px" - } - }, - "slider-control-to-text-field-large": { - "prop": "--spectrum-slider-control-to-text-field-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "slider-control-to-text-field-medium": { - "prop": "--spectrum-slider-control-to-text-field-medium", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "slider-control-to-text-field-small": { - "prop": "--spectrum-slider-control-to-text-field-small", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "slider-handle-border-width-down-extra-large": { - "prop": "--spectrum-slider-handle-border-width-down-extra-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "11px" - } - }, - "slider-handle-border-width-down-large": { - "prop": "--spectrum-slider-handle-border-width-down-large", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "slider-handle-border-width-down-medium": { - "prop": "--spectrum-slider-handle-border-width-down-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "slider-handle-border-width-down-small": { - "prop": "--spectrum-slider-handle-border-width-down-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "slider-handle-extra-large": { - "prop": "--spectrum-slider-handle-extra-large", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "slider-handle-gap": { - "prop": "--spectrum-slider-handle-gap", - "value": "4px" - }, - "slider-handle-height-precision-extra-large": { - "prop": "--spectrum-slider-handle-height-precision-extra-large", - "desktop": { - "value": "26px" - }, - "mobile": { - "value": "32px" - } - }, - "slider-handle-height-precision-large": { - "prop": "--spectrum-slider-handle-height-precision-large", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "slider-handle-height-precision-medium": { - "prop": "--spectrum-slider-handle-height-precision-medium", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "26px" - } - }, - "slider-handle-height-precision-small": { - "prop": "--spectrum-slider-handle-height-precision-small", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "slider-handle-large": { - "prop": "--spectrum-slider-handle-large", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "28px" - } - }, - "slider-handle-medium": { - "prop": "--spectrum-slider-handle-medium", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "slider-handle-precision-width": { - "prop": "--spectrum-slider-handle-precision-width", - "value": "6px" - }, - "slider-handle-size-extra-large": { - "prop": "--spectrum-slider-handle-size-extra-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "26px" - } - }, - "slider-handle-size-large": { - "prop": "--spectrum-slider-handle-size-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "slider-handle-size-medium": { - "prop": "--spectrum-slider-handle-size-medium", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "slider-handle-size-small": { - "prop": "--spectrum-slider-handle-size-small", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "slider-handle-small": { - "prop": "--spectrum-slider-handle-small", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "slider-track-height-large": { - "prop": "--spectrum-slider-track-height-large", - "value": "16px" - }, - "slider-track-height-medium": { - "prop": "--spectrum-slider-track-height-medium", - "value": "4px" - }, - "slider-track-thickness": { - "prop": "--spectrum-slider-track-thickness", - "value": "2px" - }, - "spacing-100": { - "prop": "--spectrum-spacing-100", - "value": "8px" - }, - "spacing-1000": { - "prop": "--spectrum-spacing-1000", - "value": "96px" - }, - "spacing-200": { - "prop": "--spectrum-spacing-200", - "value": "12px" - }, - "spacing-300": { - "prop": "--spectrum-spacing-300", - "value": "16px" - }, - "spacing-400": { - "prop": "--spectrum-spacing-400", - "value": "24px" - }, - "spacing-50": { - "prop": "--spectrum-spacing-50", - "value": "2px" - }, - "spacing-500": { - "prop": "--spectrum-spacing-500", - "value": "32px" - }, - "spacing-600": { - "prop": "--spectrum-spacing-600", - "value": "40px" - }, - "spacing-700": { - "prop": "--spectrum-spacing-700", - "value": "48px" - }, - "spacing-75": { - "prop": "--spectrum-spacing-75", - "value": "4px" - }, - "spacing-800": { - "prop": "--spectrum-spacing-800", - "value": "64px" - }, - "spacing-900": { - "prop": "--spectrum-spacing-900", - "value": "80px" - }, - "standard-dialog-body-font-size": { - "prop": "--spectrum-standard-dialog-body-font-size", - "ref": "var(--spectrum-body-size-s)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "17px" - } - }, - "standard-dialog-maximum-width-large": { - "prop": "--spectrum-standard-dialog-maximum-width-large", - "value": "640px" - }, - "standard-dialog-maximum-width-medium": { - "prop": "--spectrum-standard-dialog-maximum-width-medium", - "value": "480px" - }, - "standard-dialog-maximum-width-small": { - "prop": "--spectrum-standard-dialog-maximum-width-small", - "value": "400px" - }, - "standard-dialog-minimum-width": { - "prop": "--spectrum-standard-dialog-minimum-width", - "value": "288px" - }, - "standard-dialog-title-font-size": { - "prop": "--spectrum-standard-dialog-title-font-size", - "ref": "var(--spectrum-title-size-xl)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "24px" - } - }, - "standard-panel-edge-to-close-button-compact": { - "prop": "--spectrum-standard-panel-edge-to-close-button-compact", - "value": "3px" - }, - "standard-panel-edge-to-close-button-regular": { - "prop": "--spectrum-standard-panel-edge-to-close-button-regular", - "value": "7px" - }, - "standard-panel-edge-to-close-button-spacious": { - "prop": "--spectrum-standard-panel-edge-to-close-button-spacious", - "value": "15px" - }, - "standard-panel-gripper-color": { - "prop": "--spectrum-standard-panel-gripper-color", - "ref": "var(--spectrum-gray-200)", - "light": { - "value": "rgb(225, 225, 225)" - }, - "dark": { - "value": "rgb(50, 50, 50)" - } - }, - "standard-panel-gripper-color-drag": { - "prop": "--spectrum-standard-panel-gripper-color-drag", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "standard-panel-maximum-width": { - "prop": "--spectrum-standard-panel-maximum-width", - "value": "400px" - }, - "standard-panel-minimum-width": { - "prop": "--spectrum-standard-panel-minimum-width", - "value": "200px" - }, - "standard-panel-title-font-size": { - "prop": "--spectrum-standard-panel-title-font-size", - "ref": "var(--spectrum-title-size-s)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "standard-panel-top-to-close-button-compact": { - "prop": "--spectrum-standard-panel-top-to-close-button-compact", - "value": "5px" - }, - "standard-panel-top-to-close-button-regular": { - "prop": "--spectrum-standard-panel-top-to-close-button-regular", - "value": "9px" - }, - "standard-panel-top-to-close-button-spacious": { - "prop": "--spectrum-standard-panel-top-to-close-button-spacious", - "value": "17px" - }, - "standard-panel-width": { - "prop": "--spectrum-standard-panel-width", - "value": "260px" - }, - "static-black-focus-indicator-color": { - "prop": "--spectrum-static-black-focus-indicator-color", - "ref": "var(--spectrum-black)", - "value": "rgb(0, 0, 0)" - }, - "static-black-text-color": { - "prop": "--spectrum-static-black-text-color", - "ref": "var(--spectrum-black)", - "value": "rgb(0, 0, 0)" - }, - "static-black-track-color": { - "prop": "--spectrum-static-black-track-color", - "ref": "var(--spectrum-transparent-black-300)", - "value": "rgba(0, 0, 0, 0.15)" - }, - "static-black-track-indicator-color": { - "prop": "--spectrum-static-black-track-indicator-color", - "ref": "var(--spectrum-transparent-black-900)", - "value": "rgba(0, 0, 0, 0.93)" - }, - "static-blue-1000": { - "prop": "--spectrum-static-blue-1000", - "value": "rgb(39, 77, 234)" - }, - "static-blue-900": { - "prop": "--spectrum-static-blue-900", - "value": "rgb(59, 99, 251)" - }, - "static-fuchsia-1000": { - "prop": "--spectrum-static-fuchsia-1000", - "value": "rgb(156, 40, 175)" - }, - "static-fuchsia-900": { - "prop": "--spectrum-static-fuchsia-900", - "value": "rgb(181, 57, 200)" - }, - "static-indigo-1000": { - "prop": "--spectrum-static-indigo-1000", - "value": "rgb(99, 56, 238)" - }, - "static-indigo-900": { - "prop": "--spectrum-static-indigo-900", - "value": "rgb(113, 85, 250)" - }, - "static-magenta-1000": { - "prop": "--spectrum-static-magenta-1000", - "value": "rgb(186, 22, 80)" - }, - "static-magenta-900": { - "prop": "--spectrum-static-magenta-900", - "value": "rgb(217, 35, 97)" - }, - "static-red-1000": { - "prop": "--spectrum-static-red-1000", - "value": "rgb(183, 40, 24)" - }, - "static-red-900": { - "prop": "--spectrum-static-red-900", - "value": "rgb(215, 50, 32)" - }, - "static-white-focus-indicator-color": { - "prop": "--spectrum-static-white-focus-indicator-color", - "ref": "var(--spectrum-white)", - "value": "rgb(255, 255, 255)" - }, - "static-white-text-color": { - "prop": "--spectrum-static-white-text-color", - "ref": "var(--spectrum-white)", - "value": "rgb(255, 255, 255)" - }, - "static-white-track-color": { - "prop": "--spectrum-static-white-track-color", - "ref": "var(--spectrum-transparent-white-300)", - "value": "rgba(255, 255, 255, 0.17)" - }, - "static-white-track-indicator-color": { - "prop": "--spectrum-static-white-track-indicator-color", - "ref": "var(--spectrum-transparent-white-900)", - "value": "rgba(255, 255, 255, 0.94)" - }, - "status-light-dot-size-extra-large": { - "prop": "--spectrum-status-light-dot-size-extra-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "status-light-dot-size-large": { - "prop": "--spectrum-status-light-dot-size-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "status-light-dot-size-medium": { - "prop": "--spectrum-status-light-dot-size-medium", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "status-light-dot-size-small": { - "prop": "--spectrum-status-light-dot-size-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "status-light-text-to-visual-100": { - "prop": "--spectrum-status-light-text-to-visual-100", - "ref": "var(--spectrum-text-to-visual-100)", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "status-light-text-to-visual-200": { - "prop": "--spectrum-status-light-text-to-visual-200", - "ref": "var(--spectrum-text-to-visual-200)", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "status-light-text-to-visual-300": { - "prop": "--spectrum-status-light-text-to-visual-300", - "ref": "var(--spectrum-text-to-visual-300)", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "status-light-text-to-visual-75": { - "prop": "--spectrum-status-light-text-to-visual-75", - "ref": "var(--spectrum-text-to-visual-75)", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "status-light-top-to-dot-extra-large": { - "prop": "--spectrum-status-light-top-to-dot-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "status-light-top-to-dot-large": { - "prop": "--spectrum-status-light-top-to-dot-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "status-light-top-to-dot-medium": { - "prop": "--spectrum-status-light-top-to-dot-medium", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "status-light-top-to-dot-small": { - "prop": "--spectrum-status-light-top-to-dot-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "steplist-bottom-to-text": { - "prop": "--spectrum-steplist-bottom-to-text", - "value": "1px" - }, - "steplist-step-default-height-extra-large": { - "prop": "--spectrum-steplist-step-default-height-extra-large", - "value": "78px" - }, - "steplist-step-default-height-large": { - "prop": "--spectrum-steplist-step-default-height-large", - "value": "70px" - }, - "steplist-step-default-height-medium": { - "prop": "--spectrum-steplist-step-default-height-medium", - "value": "54px" - }, - "steplist-step-default-height-small": { - "prop": "--spectrum-steplist-step-default-height-small", - "value": "46px" - }, - "steplist-step-default-width-extra-large": { - "prop": "--spectrum-steplist-step-default-width-extra-large", - "value": "78px" - }, - "steplist-step-default-width-large": { - "prop": "--spectrum-steplist-step-default-width-large", - "value": "70px" - }, - "steplist-step-default-width-medium": { - "prop": "--spectrum-steplist-step-default-width-medium", - "value": "54px" - }, - "steplist-step-default-width-small": { - "prop": "--spectrum-steplist-step-default-width-small", - "value": "46px" - }, - "steplist-step-to-track-size-extra-large": { - "prop": "--spectrum-steplist-step-to-track-size-extra-large", - "value": "9px" - }, - "steplist-step-to-track-size-large": { - "prop": "--spectrum-steplist-step-to-track-size-large", - "value": "8px" - }, - "steplist-step-to-track-size-medium": { - "prop": "--spectrum-steplist-step-to-track-size-medium", - "value": "7px" - }, - "steplist-step-to-track-size-small": { - "prop": "--spectrum-steplist-step-to-track-size-small", - "value": "6px" - }, - "steplist-track-thickness-medium": { - "prop": "--spectrum-steplist-track-thickness-medium", - "value": "2px" - }, - "steplist-visual-size-extra-large": { - "prop": "--spectrum-steplist-visual-size-extra-large", - "value": "32px" - }, - "steplist-visual-size-large": { - "prop": "--spectrum-steplist-visual-size-large", - "value": "24px" - }, - "steplist-visual-size-medium": { - "prop": "--spectrum-steplist-visual-size-medium", - "value": "16px" - }, - "steplist-visual-size-small": { - "prop": "--spectrum-steplist-visual-size-small", - "value": "8px" - }, - "swatch-border-color": { - "prop": "--spectrum-swatch-border-color", - "ref": "var(--spectrum-gray-1000)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 0, 0)" - } - }, - "swatch-border-opacity": { - "prop": "--spectrum-swatch-border-opacity", - "value": "0.42" - }, - "swatch-disabled-icon-border-color": { - "prop": "--spectrum-swatch-disabled-icon-border-color", - "ref": "var(--spectrum-black)", - "value": "rgb(0, 0, 0)" - }, - "swatch-disabled-icon-border-opacity": { - "prop": "--spectrum-swatch-disabled-icon-border-opacity", - "value": "0.42" - }, - "swatch-group-border-color": { - "prop": "--spectrum-swatch-group-border-color", - "ref": "var(--spectrum-gray-1000)", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 0, 0)" - } - }, - "swatch-group-border-opacity": { - "prop": "--spectrum-swatch-group-border-opacity", - "value": "0.2" - }, - "swatch-group-spacing-spacious": { - "prop": "--spectrum-swatch-group-spacing-spacious", - "value": "6px" - }, - "swatch-rectangle-width-multiplier": { - "prop": "--spectrum-swatch-rectangle-width-multiplier", - "value": 2 - }, - "swatch-size-extra-small": { - "prop": "--spectrum-swatch-size-extra-small", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "swatch-size-large": { - "prop": "--spectrum-swatch-size-large", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "swatch-size-medium": { - "prop": "--spectrum-swatch-size-medium", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "swatch-size-small": { - "prop": "--spectrum-swatch-size-small", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "swatch-slash-thickness-extra-small": { - "prop": "--spectrum-swatch-slash-thickness-extra-small", - "value": "2px" - }, - "swatch-slash-thickness-large": { - "prop": "--spectrum-swatch-slash-thickness-large", - "value": "5px" - }, - "swatch-slash-thickness-medium": { - "prop": "--spectrum-swatch-slash-thickness-medium", - "value": "4px" - }, - "swatch-slash-thickness-small": { - "prop": "--spectrum-swatch-slash-thickness-small", - "value": "3px" - }, - "switch-control-height-extra-large": { - "prop": "--spectrum-switch-control-height-extra-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "26px" - } - }, - "switch-control-height-large": { - "prop": "--spectrum-switch-control-height-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "switch-control-height-medium": { - "prop": "--spectrum-switch-control-height-medium", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "switch-control-height-small": { - "prop": "--spectrum-switch-control-height-small", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "switch-control-width-extra-large": { - "prop": "--spectrum-switch-control-width-extra-large", - "desktop": { - "value": "34px" - }, - "mobile": { - "value": "46px" - } - }, - "switch-control-width-large": { - "prop": "--spectrum-switch-control-width-large", - "desktop": { - "value": "30px" - }, - "mobile": { - "value": "38px" - } - }, - "switch-control-width-medium": { - "prop": "--spectrum-switch-control-width-medium", - "desktop": { - "value": "26px" - }, - "mobile": { - "value": "34px" - } - }, - "switch-control-width-small": { - "prop": "--spectrum-switch-control-width-small", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "30px" - } - }, - "switch-handle-selected-size-extra-large": { - "prop": "--spectrum-switch-handle-selected-size-extra-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "20px" - } - }, - "switch-handle-selected-size-large": { - "prop": "--spectrum-switch-handle-selected-size-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "switch-handle-selected-size-medium": { - "prop": "--spectrum-switch-handle-selected-size-medium", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "switch-handle-selected-size-small": { - "prop": "--spectrum-switch-handle-selected-size-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "12px" - } - }, - "switch-handle-size-extra-large": { - "prop": "--spectrum-switch-handle-size-extra-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "18px" - } - }, - "switch-handle-size-large": { - "prop": "--spectrum-switch-handle-size-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "switch-handle-size-medium": { - "prop": "--spectrum-switch-handle-size-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "12px" - } - }, - "switch-handle-size-small": { - "prop": "--spectrum-switch-handle-size-small", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "10px" - } - }, - "switch-top-to-control-extra-large": { - "prop": "--spectrum-switch-top-to-control-extra-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "switch-top-to-control-large": { - "prop": "--spectrum-switch-top-to-control-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "switch-top-to-control-medium": { - "prop": "--spectrum-switch-top-to-control-medium", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "switch-top-to-control-small": { - "prop": "--spectrum-switch-top-to-control-small", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "tab-item-bottom-to-text-compact-extra-large": { - "prop": "--spectrum-tab-item-bottom-to-text-compact-extra-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "17px" - } - }, - "tab-item-bottom-to-text-compact-large": { - "prop": "--spectrum-tab-item-bottom-to-text-compact-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "14px" - } - }, - "tab-item-bottom-to-text-compact-medium": { - "prop": "--spectrum-tab-item-bottom-to-text-compact-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "tab-item-bottom-to-text-compact-small": { - "prop": "--spectrum-tab-item-bottom-to-text-compact-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "tab-item-bottom-to-text-extra-large": { - "prop": "--spectrum-tab-item-bottom-to-text-extra-large", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "25px" - } - }, - "tab-item-bottom-to-text-large": { - "prop": "--spectrum-tab-item-bottom-to-text-large", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "tab-item-bottom-to-text-medium": { - "prop": "--spectrum-tab-item-bottom-to-text-medium", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "19px" - } - }, - "tab-item-bottom-to-text-small": { - "prop": "--spectrum-tab-item-bottom-to-text-small", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tab-item-compact-height-extra-large": { - "prop": "--spectrum-tab-item-compact-height-extra-large", - "ref": "var(--spectrum-component-height-300)", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "tab-item-compact-height-large": { - "prop": "--spectrum-tab-item-compact-height-large", - "ref": "var(--spectrum-component-height-200)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "tab-item-compact-height-medium": { - "prop": "--spectrum-tab-item-compact-height-medium", - "ref": "var(--spectrum-component-height-100)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "tab-item-compact-height-small": { - "prop": "--spectrum-tab-item-compact-height-small", - "ref": "var(--spectrum-component-height-75)", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "tab-item-focus-indicator-gap-extra-large": { - "prop": "--spectrum-tab-item-focus-indicator-gap-extra-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "tab-item-focus-indicator-gap-large": { - "prop": "--spectrum-tab-item-focus-indicator-gap-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "tab-item-focus-indicator-gap-medium": { - "prop": "--spectrum-tab-item-focus-indicator-gap-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "tab-item-focus-indicator-gap-small": { - "prop": "--spectrum-tab-item-focus-indicator-gap-small", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "tab-item-height-extra-large": { - "prop": "--spectrum-tab-item-height-extra-large", - "ref": "var(--spectrum-component-height-500)", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "80px" - } - }, - "tab-item-height-large": { - "prop": "--spectrum-tab-item-height-large", - "ref": "var(--spectrum-component-height-400)", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "tab-item-height-medium": { - "prop": "--spectrum-tab-item-height-medium", - "ref": "var(--spectrum-component-height-300)", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "tab-item-height-small": { - "prop": "--spectrum-tab-item-height-small", - "ref": "var(--spectrum-component-height-200)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "tab-item-start-to-edge-extra-large": { - "prop": "--spectrum-tab-item-start-to-edge-extra-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "19px" - } - }, - "tab-item-start-to-edge-large": { - "prop": "--spectrum-tab-item-start-to-edge-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "17px" - } - }, - "tab-item-start-to-edge-medium": { - "prop": "--spectrum-tab-item-start-to-edge-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tab-item-start-to-edge-quiet": { - "prop": "--spectrum-tab-item-start-to-edge-quiet", - "value": "0px" - }, - "tab-item-start-to-edge-small": { - "prop": "--spectrum-tab-item-start-to-edge-small", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "13px" - } - }, - "tab-item-to-tab-item-horizontal-extra-large": { - "prop": "--spectrum-tab-item-to-tab-item-horizontal-extra-large", - "desktop": { - "value": "30px" - }, - "mobile": { - "value": "36px" - } - }, - "tab-item-to-tab-item-horizontal-large": { - "prop": "--spectrum-tab-item-to-tab-item-horizontal-large", - "desktop": { - "value": "27px" - }, - "mobile": { - "value": "33px" - } - }, - "tab-item-to-tab-item-horizontal-medium": { - "prop": "--spectrum-tab-item-to-tab-item-horizontal-medium", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "tab-item-to-tab-item-horizontal-small": { - "prop": "--spectrum-tab-item-to-tab-item-horizontal-small", - "desktop": { - "value": "21px" - }, - "mobile": { - "value": "27px" - } - }, - "tab-item-to-tab-item-vertical-extra-large": { - "prop": "--spectrum-tab-item-to-tab-item-vertical-extra-large", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "tab-item-to-tab-item-vertical-large": { - "prop": "--spectrum-tab-item-to-tab-item-vertical-large", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "tab-item-to-tab-item-vertical-medium": { - "prop": "--spectrum-tab-item-to-tab-item-vertical-medium", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tab-item-to-tab-item-vertical-small": { - "prop": "--spectrum-tab-item-to-tab-item-vertical-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tab-item-top-to-text-compact-extra-large": { - "prop": "--spectrum-tab-item-top-to-text-compact-extra-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tab-item-top-to-text-compact-large": { - "prop": "--spectrum-tab-item-top-to-text-compact-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "tab-item-top-to-text-compact-medium": { - "prop": "--spectrum-tab-item-top-to-text-compact-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "9px" - } - }, - "tab-item-top-to-text-compact-small": { - "prop": "--spectrum-tab-item-top-to-text-compact-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tab-item-top-to-text-extra-large": { - "prop": "--spectrum-tab-item-top-to-text-extra-large", - "desktop": { - "value": "19px" - }, - "mobile": { - "value": "25px" - } - }, - "tab-item-top-to-text-large": { - "prop": "--spectrum-tab-item-top-to-text-large", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "22px" - } - }, - "tab-item-top-to-text-medium": { - "prop": "--spectrum-tab-item-top-to-text-medium", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "tab-item-top-to-text-small": { - "prop": "--spectrum-tab-item-top-to-text-small", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "tab-item-top-to-workflow-icon-compact-extra-large": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-extra-large", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "16px" - } - }, - "tab-item-top-to-workflow-icon-compact-large": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "13px" - } - }, - "tab-item-top-to-workflow-icon-compact-medium": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-medium", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "tab-item-top-to-workflow-icon-compact-small": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-small", - "desktop": { - "value": "3px" - }, - "mobile": { - "value": "5px" - } - }, - "tab-item-top-to-workflow-icon-extra-large": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-extra-large", - "desktop": { - "value": "19px" - }, - "mobile": { - "value": "26px" - } - }, - "tab-item-top-to-workflow-icon-large": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "23px" - } - }, - "tab-item-top-to-workflow-icon-medium": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-medium", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "tab-item-top-to-workflow-icon-small": { - "prop": "--spectrum-tab-item-top-to-workflow-icon-small", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "15px" - } - }, - "table-border-divider-width": { - "prop": "--spectrum-table-border-divider-width", - "value": "1px" - }, - "table-checkbox-to-text": { - "prop": "--spectrum-table-checkbox-to-text", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "table-column-header-row-bottom-to-text-extra-large": { - "prop": "--spectrum-table-column-header-row-bottom-to-text-extra-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "17px" - } - }, - "table-column-header-row-bottom-to-text-large": { - "prop": "--spectrum-table-column-header-row-bottom-to-text-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "table-column-header-row-bottom-to-text-medium": { - "prop": "--spectrum-table-column-header-row-bottom-to-text-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-column-header-row-bottom-to-text-small": { - "prop": "--spectrum-table-column-header-row-bottom-to-text-small", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "table-column-header-row-top-to-text-extra-large": { - "prop": "--spectrum-table-column-header-row-top-to-text-extra-large", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "16px" - } - }, - "table-column-header-row-top-to-text-large": { - "prop": "--spectrum-table-column-header-row-top-to-text-large", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "table-column-header-row-top-to-text-medium": { - "prop": "--spectrum-table-column-header-row-top-to-text-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "9px" - } - }, - "table-column-header-row-top-to-text-small": { - "prop": "--spectrum-table-column-header-row-top-to-text-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-edge-to-content": { - "prop": "--spectrum-table-edge-to-content", - "value": "16px" - }, - "table-header-row-checkbox-to-top-extra-large": { - "prop": "--spectrum-table-header-row-checkbox-to-top-extra-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "21px" - } - }, - "table-header-row-checkbox-to-top-large": { - "prop": "--spectrum-table-header-row-checkbox-to-top-large", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "17px" - } - }, - "table-header-row-checkbox-to-top-medium": { - "prop": "--spectrum-table-header-row-checkbox-to-top-medium", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "11px" - } - }, - "table-header-row-checkbox-to-top-small": { - "prop": "--spectrum-table-header-row-checkbox-to-top-small", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "table-row-bottom-to-text-extra-large": { - "prop": "--spectrum-table-row-bottom-to-text-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "table-row-bottom-to-text-extra-large-compact": { - "prop": "--spectrum-table-row-bottom-to-text-extra-large-compact", - "ref": "var(--spectrum-component-bottom-to-text-300)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "table-row-bottom-to-text-extra-large-regular": { - "prop": "--spectrum-table-row-bottom-to-text-extra-large-regular", - "ref": "var(--spectrum-table-row-bottom-to-text-extra-large)", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "22px" - } - }, - "table-row-bottom-to-text-extra-large-spacious": { - "prop": "--spectrum-table-row-bottom-to-text-extra-large-spacious", - "desktop": { - "value": "21px" - }, - "mobile": { - "value": "27px" - } - }, - "table-row-bottom-to-text-large": { - "prop": "--spectrum-table-row-bottom-to-text-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "table-row-bottom-to-text-large-compact": { - "prop": "--spectrum-table-row-bottom-to-text-large-compact", - "ref": "var(--spectrum-component-bottom-to-text-200)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "table-row-bottom-to-text-large-regular": { - "prop": "--spectrum-table-row-bottom-to-text-large-regular", - "ref": "var(--spectrum-table-row-bottom-to-text-large)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "table-row-bottom-to-text-large-spacious": { - "prop": "--spectrum-table-row-bottom-to-text-large-spacious", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "23px" - } - }, - "table-row-bottom-to-text-medium": { - "prop": "--spectrum-table-row-bottom-to-text-medium", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "15px" - } - }, - "table-row-bottom-to-text-medium-compact": { - "prop": "--spectrum-table-row-bottom-to-text-medium-compact", - "ref": "var(--spectrum-component-bottom-to-text-100)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "table-row-bottom-to-text-medium-regular": { - "prop": "--spectrum-table-row-bottom-to-text-medium-regular", - "ref": "var(--spectrum-table-row-bottom-to-text-medium)", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "15px" - } - }, - "table-row-bottom-to-text-medium-spacious": { - "prop": "--spectrum-table-row-bottom-to-text-medium-spacious", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "table-row-bottom-to-text-small": { - "prop": "--spectrum-table-row-bottom-to-text-small", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "table-row-bottom-to-text-small-compact": { - "prop": "--spectrum-table-row-bottom-to-text-small-compact", - "ref": "var(--spectrum-component-bottom-to-text-75)", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "table-row-bottom-to-text-small-regular": { - "prop": "--spectrum-table-row-bottom-to-text-small-regular", - "ref": "var(--spectrum-table-row-bottom-to-text-small)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "table-row-bottom-to-text-small-spacious": { - "prop": "--spectrum-table-row-bottom-to-text-small-spacious", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "16px" - } - }, - "table-row-checkbox-to-top-extra-large": { - "prop": "--spectrum-table-row-checkbox-to-top-extra-large", - "desktop": { - "value": "19px" - }, - "mobile": { - "value": "26px" - } - }, - "table-row-checkbox-to-top-extra-large-compact": { - "prop": "--spectrum-table-row-checkbox-to-top-extra-large-compact", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "21px" - } - }, - "table-row-checkbox-to-top-extra-large-regular": { - "prop": "--spectrum-table-row-checkbox-to-top-extra-large-regular", - "ref": "var(--spectrum-table-row-checkbox-to-top-extra-large)", - "desktop": { - "value": "19px" - }, - "mobile": { - "value": "26px" - } - }, - "table-row-checkbox-to-top-extra-large-spacious": { - "prop": "--spectrum-table-row-checkbox-to-top-extra-large-spacious", - "desktop": { - "value": "23px" - }, - "mobile": { - "value": "31px" - } - }, - "table-row-checkbox-to-top-large": { - "prop": "--spectrum-table-row-checkbox-to-top-large", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "22px" - } - }, - "table-row-checkbox-to-top-large-compact": { - "prop": "--spectrum-table-row-checkbox-to-top-large-compact", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "17px" - } - }, - "table-row-checkbox-to-top-large-regular": { - "prop": "--spectrum-table-row-checkbox-to-top-large-regular", - "ref": "var(--spectrum-table-row-checkbox-to-top-large)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "22px" - } - }, - "table-row-checkbox-to-top-large-spacious": { - "prop": "--spectrum-table-row-checkbox-to-top-large-spacious", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "27px" - } - }, - "table-row-checkbox-to-top-medium": { - "prop": "--spectrum-table-row-checkbox-to-top-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "table-row-checkbox-to-top-medium-compact": { - "prop": "--spectrum-table-row-checkbox-to-top-medium-compact", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "11px" - } - }, - "table-row-checkbox-to-top-medium-regular": { - "prop": "--spectrum-table-row-checkbox-to-top-medium-regular", - "ref": "var(--spectrum-table-row-checkbox-to-top-medium)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "table-row-checkbox-to-top-medium-spacious": { - "prop": "--spectrum-table-row-checkbox-to-top-medium-spacious", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "21px" - } - }, - "table-row-checkbox-to-top-small": { - "prop": "--spectrum-table-row-checkbox-to-top-small", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "table-row-checkbox-to-top-small-compact": { - "prop": "--spectrum-table-row-checkbox-to-top-small-compact", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "9px" - } - }, - "table-row-checkbox-to-top-small-regular": { - "prop": "--spectrum-table-row-checkbox-to-top-small-regular", - "ref": "var(--spectrum-table-row-checkbox-to-top-small)", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "table-row-checkbox-to-top-small-spacious": { - "prop": "--spectrum-table-row-checkbox-to-top-small-spacious", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "19px" - } - }, - "table-row-down-opacity": { - "prop": "--spectrum-table-row-down-opacity", - "value": "0.1" - }, - "table-row-height-extra-large": { - "prop": "--spectrum-table-row-height-extra-large", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "table-row-height-extra-large-compact": { - "prop": "--spectrum-table-row-height-extra-large-compact", - "ref": "var(--spectrum-component-height-300)", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "table-row-height-extra-large-regular": { - "prop": "--spectrum-table-row-height-extra-large-regular", - "ref": "var(--spectrum-table-row-height-extra-large)", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "table-row-height-extra-large-spacious": { - "prop": "--spectrum-table-row-height-extra-large-spacious", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "80px" - } - }, - "table-row-height-large": { - "prop": "--spectrum-table-row-height-large", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "table-row-height-large-compact": { - "prop": "--spectrum-table-row-height-large-compact", - "ref": "var(--spectrum-component-height-200)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "table-row-height-large-regular": { - "prop": "--spectrum-table-row-height-large-regular", - "ref": "var(--spectrum-table-row-height-large)", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "table-row-height-large-spacious": { - "prop": "--spectrum-table-row-height-large-spacious", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "table-row-height-medium": { - "prop": "--spectrum-table-row-height-medium", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "table-row-height-medium-compact": { - "prop": "--spectrum-table-row-height-medium-compact", - "ref": "var(--spectrum-component-height-100)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "table-row-height-medium-regular": { - "prop": "--spectrum-table-row-height-medium-regular", - "ref": "var(--spectrum-table-row-height-medium)", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "table-row-height-medium-spacious": { - "prop": "--spectrum-table-row-height-medium-spacious", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "table-row-height-small": { - "prop": "--spectrum-table-row-height-small", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "table-row-height-small-compact": { - "prop": "--spectrum-table-row-height-small-compact", - "ref": "var(--spectrum-component-height-75)", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "table-row-height-small-regular": { - "prop": "--spectrum-table-row-height-small-regular", - "ref": "var(--spectrum-table-row-height-small)", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "table-row-height-small-spacious": { - "prop": "--spectrum-table-row-height-small-spacious", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "table-row-hover-color": { - "prop": "--spectrum-table-row-hover-color", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "table-row-hover-opacity": { - "prop": "--spectrum-table-row-hover-opacity", - "value": "0.07" - }, - "table-row-top-to-text-extra-large": { - "prop": "--spectrum-table-row-top-to-text-extra-large", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "21px" - } - }, - "table-row-top-to-text-extra-large-compact": { - "prop": "--spectrum-table-row-top-to-text-extra-large-compact", - "ref": "var(--spectrum-component-top-to-text-300)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "table-row-top-to-text-extra-large-regular": { - "prop": "--spectrum-table-row-top-to-text-extra-large-regular", - "ref": "var(--spectrum-table-row-top-to-text-extra-large)", - "desktop": { - "value": "17px" - }, - "mobile": { - "value": "21px" - } - }, - "table-row-top-to-text-extra-large-spacious": { - "prop": "--spectrum-table-row-top-to-text-extra-large-spacious", - "desktop": { - "value": "21px" - }, - "mobile": { - "value": "26px" - } - }, - "table-row-top-to-text-large": { - "prop": "--spectrum-table-row-top-to-text-large", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "table-row-top-to-text-large-compact": { - "prop": "--spectrum-table-row-top-to-text-large-compact", - "ref": "var(--spectrum-component-top-to-text-200)", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "12px" - } - }, - "table-row-top-to-text-large-regular": { - "prop": "--spectrum-table-row-top-to-text-large-regular", - "ref": "var(--spectrum-table-row-top-to-text-large)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "18px" - } - }, - "table-row-top-to-text-large-spacious": { - "prop": "--spectrum-table-row-top-to-text-large-spacious", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "23px" - } - }, - "table-row-top-to-text-medium": { - "prop": "--spectrum-table-row-top-to-text-medium", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "table-row-top-to-text-medium-compact": { - "prop": "--spectrum-table-row-top-to-text-medium-compact", - "ref": "var(--spectrum-component-top-to-text-100)", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "table-row-top-to-text-medium-regular": { - "prop": "--spectrum-table-row-top-to-text-medium-regular", - "ref": "var(--spectrum-table-row-top-to-text-medium)", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "14px" - } - }, - "table-row-top-to-text-medium-spacious": { - "prop": "--spectrum-table-row-top-to-text-medium-spacious", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "16px" - } - }, - "table-row-top-to-text-small": { - "prop": "--spectrum-table-row-top-to-text-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-row-top-to-text-small-compact": { - "prop": "--spectrum-table-row-top-to-text-small-compact", - "ref": "var(--spectrum-component-top-to-text-75)", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "table-row-top-to-text-small-regular": { - "prop": "--spectrum-table-row-top-to-text-small-regular", - "ref": "var(--spectrum-table-row-top-to-text-small)", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-row-top-to-text-small-spacious": { - "prop": "--spectrum-table-row-top-to-text-small-spacious", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "table-section-header-row-height-extra-large": { - "prop": "--spectrum-table-section-header-row-height-extra-large", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "60px" - } - }, - "table-section-header-row-height-large": { - "prop": "--spectrum-table-section-header-row-height-large", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "table-section-header-row-height-medium": { - "prop": "--spectrum-table-section-header-row-height-medium", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "table-section-header-row-height-small": { - "prop": "--spectrum-table-section-header-row-height-small", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "table-selected-row-background-color": { - "prop": "--spectrum-table-selected-row-background-color", - "ref": "var(--spectrum-informative-color-800)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "table-selected-row-background-color-non-emphasized": { - "prop": "--spectrum-table-selected-row-background-color-non-emphasized", - "ref": "var(--spectrum-neutral-background-color-selected-default)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "table-selected-row-background-opacity": { - "prop": "--spectrum-table-selected-row-background-opacity", - "value": "0.1" - }, - "table-selected-row-background-opacity-hover": { - "prop": "--spectrum-table-selected-row-background-opacity-hover", - "value": "0.15" - }, - "table-selected-row-background-opacity-non-emphasized": { - "prop": "--spectrum-table-selected-row-background-opacity-non-emphasized", - "value": "0.1" - }, - "table-selected-row-background-opacity-non-emphasized-hover": { - "prop": "--spectrum-table-selected-row-background-opacity-non-emphasized-hover", - "value": "0.15" - }, - "table-thumbnail-to-top-minimum-extra-large": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-extra-large-compact": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large-compact", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-extra-large-regular": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large-regular", - "ref": "var(--spectrum-table-thumbnail-to-top-minimum-extra-large)", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-extra-large-spacious": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large-spacious", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "table-thumbnail-to-top-minimum-large": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-large", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-large-compact": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-large-compact", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "table-thumbnail-to-top-minimum-large-regular": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-large-regular", - "ref": "var(--spectrum-table-thumbnail-to-top-minimum-large)", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-large-spacious": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-large-spacious", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-medium": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-medium", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "table-thumbnail-to-top-minimum-medium-compact": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-medium-compact", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "table-thumbnail-to-top-minimum-medium-regular": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-medium-regular", - "ref": "var(--spectrum-table-thumbnail-to-top-minimum-medium)", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "table-thumbnail-to-top-minimum-medium-spacious": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-medium-spacious", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "table-thumbnail-to-top-minimum-small": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-small", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "table-thumbnail-to-top-minimum-small-compact": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-small-compact", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "table-thumbnail-to-top-minimum-small-regular": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-small-regular", - "ref": "var(--spectrum-table-thumbnail-to-top-minimum-small)", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "table-thumbnail-to-top-minimum-small-spacious": { - "prop": "--spectrum-table-thumbnail-to-top-minimum-small-spacious", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "tag-edge-to-clear-icon-large": { - "prop": "--spectrum-tag-edge-to-clear-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "tag-edge-to-clear-icon-medium": { - "prop": "--spectrum-tag-edge-to-clear-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tag-edge-to-clear-icon-small": { - "prop": "--spectrum-tag-edge-to-clear-icon-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "tag-label-to-clear-icon-large": { - "prop": "--spectrum-tag-label-to-clear-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "tag-label-to-clear-icon-medium": { - "prop": "--spectrum-tag-label-to-clear-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tag-label-to-clear-icon-small": { - "prop": "--spectrum-tag-label-to-clear-icon-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "tag-maximum-width-multiplier": { - "prop": "--spectrum-tag-maximum-width-multiplier", - "value": 7 - }, - "tag-minimum-width-large": { - "prop": "--spectrum-tag-minimum-width-large", - "desktop": { - "value": "33px" - }, - "mobile": { - "value": "42px" - } - }, - "tag-minimum-width-medium": { - "prop": "--spectrum-tag-minimum-width-medium", - "desktop": { - "value": "27px" - }, - "mobile": { - "value": "34px" - } - }, - "tag-minimum-width-multiplier": { - "prop": "--spectrum-tag-minimum-width-multiplier", - "value": 1 - }, - "tag-minimum-width-small": { - "prop": "--spectrum-tag-minimum-width-small", - "desktop": { - "value": "21px" - }, - "mobile": { - "value": "25px" - } - }, - "tag-top-to-avatar-large": { - "prop": "--spectrum-tag-top-to-avatar-large", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "tag-top-to-avatar-medium": { - "prop": "--spectrum-tag-top-to-avatar-medium", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "tag-top-to-avatar-small": { - "prop": "--spectrum-tag-top-to-avatar-small", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tag-top-to-cross-icon-large": { - "prop": "--spectrum-tag-top-to-cross-icon-large", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "tag-top-to-cross-icon-medium": { - "prop": "--spectrum-tag-top-to-cross-icon-medium", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tag-top-to-cross-icon-small": { - "prop": "--spectrum-tag-top-to-cross-icon-small", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "takeover-dialog-height": { - "prop": "--spectrum-takeover-dialog-height", - "value": "100%" - }, - "takeover-dialog-width": { - "prop": "--spectrum-takeover-dialog-width", - "value": "100%" - }, - "text-align-center": { - "prop": "--spectrum-text-align-center", - "value": "center" - }, - "text-align-end": { - "prop": "--spectrum-text-align-end", - "value": "end" - }, - "text-align-start": { - "prop": "--spectrum-text-align-start", - "value": "start" - }, - "text-area-minimum-height": { - "prop": "--spectrum-text-area-minimum-height", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "70px" - } - }, - "text-area-minimum-width": { - "prop": "--spectrum-text-area-minimum-width", - "desktop": { - "value": "112px" - }, - "mobile": { - "value": "140px" - } - }, - "text-field-minimum-width-multiplier": { - "prop": "--spectrum-text-field-minimum-width-multiplier", - "value": 1.5 - }, - "text-to-control-100": { - "prop": "--spectrum-text-to-control-100", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "text-to-control-200": { - "prop": "--spectrum-text-to-control-200", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "14px" - } - }, - "text-to-control-300": { - "prop": "--spectrum-text-to-control-300", - "desktop": { - "value": "13px" - }, - "mobile": { - "value": "16px" - } - }, - "text-to-control-50": { - "prop": "--spectrum-text-to-control-50", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "text-to-control-75": { - "prop": "--spectrum-text-to-control-75", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "text-to-visual-100": { - "prop": "--spectrum-text-to-visual-100", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "text-to-visual-200": { - "prop": "--spectrum-text-to-visual-200", - "desktop": { - "value": "7px" - }, - "mobile": { - "value": "9px" - } - }, - "text-to-visual-300": { - "prop": "--spectrum-text-to-visual-300", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "text-to-visual-400": { - "prop": "--spectrum-text-to-visual-400", - "desktop": { - "value": "9px" - }, - "mobile": { - "value": "11px" - } - }, - "text-to-visual-50": { - "prop": "--spectrum-text-to-visual-50", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "text-to-visual-75": { - "prop": "--spectrum-text-to-visual-75", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "7px" - } - }, - "text-underline-gap": { - "prop": "--spectrum-text-underline-gap", - "value": "1px" - }, - "text-underline-thickness": { - "prop": "--spectrum-text-underline-thickness", - "value": "1px" - }, - "thumbnail-border-color": { - "prop": "--spectrum-thumbnail-border-color", - "ref": "var(--spectrum-gray-800)", - "light": { - "value": "rgb(41, 41, 41)" - }, - "dark": { - "value": "rgb(219, 219, 219)" - } - }, - "thumbnail-border-opacity": { - "prop": "--spectrum-thumbnail-border-opacity", - "value": "0.1" - }, - "thumbnail-corner-radius": { - "prop": "--spectrum-thumbnail-corner-radius", - "ref": "var(--spectrum-corner-radius-75)", - "value": "3px" - }, - "thumbnail-opacity-checkerboard-square-size": { - "prop": "--spectrum-thumbnail-opacity-checkerboard-square-size", - "value": "4px" - }, - "thumbnail-opacity-disabled": { - "prop": "--spectrum-thumbnail-opacity-disabled", - "ref": "var(--spectrum-opacity-disabled)", - "value": "0.3" - }, - "thumbnail-size-100": { - "prop": "--spectrum-thumbnail-size-100", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "28px" - } - }, - "thumbnail-size-1000": { - "prop": "--spectrum-thumbnail-size-1000", - "desktop": { - "value": "64px" - }, - "mobile": { - "value": "72px" - } - }, - "thumbnail-size-200": { - "prop": "--spectrum-thumbnail-size-200", - "desktop": { - "value": "28px" - }, - "mobile": { - "value": "32px" - } - }, - "thumbnail-size-300": { - "prop": "--spectrum-thumbnail-size-300", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "36px" - } - }, - "thumbnail-size-400": { - "prop": "--spectrum-thumbnail-size-400", - "desktop": { - "value": "36px" - }, - "mobile": { - "value": "40px" - } - }, - "thumbnail-size-50": { - "prop": "--spectrum-thumbnail-size-50", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "thumbnail-size-500": { - "prop": "--spectrum-thumbnail-size-500", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "44px" - } - }, - "thumbnail-size-600": { - "prop": "--spectrum-thumbnail-size-600", - "desktop": { - "value": "44px" - }, - "mobile": { - "value": "48px" - } - }, - "thumbnail-size-700": { - "prop": "--spectrum-thumbnail-size-700", - "desktop": { - "value": "48px" - }, - "mobile": { - "value": "52px" - } - }, - "thumbnail-size-75": { - "prop": "--spectrum-thumbnail-size-75", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "thumbnail-size-800": { - "prop": "--spectrum-thumbnail-size-800", - "desktop": { - "value": "52px" - }, - "mobile": { - "value": "56px" - } - }, - "thumbnail-size-900": { - "prop": "--spectrum-thumbnail-size-900", - "desktop": { - "value": "56px" - }, - "mobile": { - "value": "64px" - } - }, - "time-field-minimum-width": { - "prop": "--spectrum-time-field-minimum-width", - "value": 2.5 - }, - "time-field-text-to-visual": { - "prop": "--spectrum-time-field-text-to-visual", - "value": "20px" - }, - "title-cjk-emphasized-font-style": { - "prop": "--spectrum-title-cjk-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-cjk-emphasized-font-weight": { - "prop": "--spectrum-title-cjk-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "title-cjk-font-family": { - "prop": "--spectrum-title-cjk-font-family", - "ref": "var(--spectrum-cjk-font-family)", - "value": "Adobe Clean Han" - }, - "title-cjk-font-style": { - "prop": "--spectrum-title-cjk-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-cjk-font-weight": { - "prop": "--spectrum-title-cjk-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "title-cjk-line-height": { - "prop": "--spectrum-title-cjk-line-height", - "ref": "var(--spectrum-cjk-line-height-100)", - "value": 1.5 - }, - "title-cjk-size-l": { - "prop": "--spectrum-title-cjk-size-l", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "title-cjk-size-m": { - "prop": "--spectrum-title-cjk-size-m", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "title-cjk-size-s": { - "prop": "--spectrum-title-cjk-size-s", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "title-cjk-size-xl": { - "prop": "--spectrum-title-cjk-size-xl", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "title-cjk-size-xs": { - "prop": "--spectrum-title-cjk-size-xs", - "ref": "var(--spectrum-font-size-50)", - "desktop": { - "value": "11px" - }, - "mobile": { - "value": "13px" - } - }, - "title-cjk-size-xxl": { - "prop": "--spectrum-title-cjk-size-xxl", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "title-cjk-size-xxxl": { - "prop": "--spectrum-title-cjk-size-xxxl", - "ref": "var(--spectrum-font-size-500)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "27px" - } - }, - "title-cjk-strong-emphasized-font-style": { - "prop": "--spectrum-title-cjk-strong-emphasized-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-cjk-strong-emphasized-font-weight": { - "prop": "--spectrum-title-cjk-strong-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "title-cjk-strong-font-style": { - "prop": "--spectrum-title-cjk-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-cjk-strong-font-weight": { - "prop": "--spectrum-title-cjk-strong-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "title-color": { - "prop": "--spectrum-title-color", - "ref": "var(--spectrum-gray-900)", - "light": { - "value": "rgb(19, 19, 19)" - }, - "dark": { - "value": "rgb(242, 242, 242)" - } - }, - "title-line-height": { - "prop": "--spectrum-title-line-height", - "ref": "var(--spectrum-line-height-100)", - "value": 1.3 - }, - "title-margin-bottom-multiplier": { - "prop": "--spectrum-title-margin-bottom-multiplier", - "value": 0.25 - }, - "title-margin-top-multiplier": { - "prop": "--spectrum-title-margin-top-multiplier", - "value": 0.88888889 - }, - "title-sans-serif-emphasized-font-style": { - "prop": "--spectrum-title-sans-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "title-sans-serif-emphasized-font-weight": { - "prop": "--spectrum-title-sans-serif-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "title-sans-serif-font-family": { - "prop": "--spectrum-title-sans-serif-font-family", - "ref": "var(--spectrum-sans-serif-font-family)", - "value": "Adobe Clean" - }, - "title-sans-serif-font-style": { - "prop": "--spectrum-title-sans-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-sans-serif-font-weight": { - "prop": "--spectrum-title-sans-serif-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "title-sans-serif-strong-emphasized-font-style": { - "prop": "--spectrum-title-sans-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "title-sans-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-title-sans-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "title-sans-serif-strong-font-style": { - "prop": "--spectrum-title-sans-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-sans-serif-strong-font-weight": { - "prop": "--spectrum-title-sans-serif-strong-font-weight", - "ref": "var(--spectrum-extra-bold-font-weight)", - "value": "800" - }, - "title-serif-emphasized-font-style": { - "prop": "--spectrum-title-serif-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "title-serif-emphasized-font-weight": { - "prop": "--spectrum-title-serif-emphasized-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "title-serif-font-family": { - "prop": "--spectrum-title-serif-font-family", - "ref": "var(--spectrum-serif-font-family)", - "value": "Adobe Clean Serif" - }, - "title-serif-font-style": { - "prop": "--spectrum-title-serif-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-serif-font-weight": { - "prop": "--spectrum-title-serif-font-weight", - "ref": "var(--spectrum-bold-font-weight)", - "value": "700" - }, - "title-serif-strong-emphasized-font-style": { - "prop": "--spectrum-title-serif-strong-emphasized-font-style", - "ref": "var(--spectrum-italic-font-style)", - "value": "italic" - }, - "title-serif-strong-emphasized-font-weight": { - "prop": "--spectrum-title-serif-strong-emphasized-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "title-serif-strong-font-style": { - "prop": "--spectrum-title-serif-strong-font-style", - "ref": "var(--spectrum-default-font-style)", - "value": "normal" - }, - "title-serif-strong-font-weight": { - "prop": "--spectrum-title-serif-strong-font-weight", - "ref": "var(--spectrum-black-font-weight)", - "value": "900" - }, - "title-size-l": { - "prop": "--spectrum-title-size-l", - "ref": "var(--spectrum-font-size-300)", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "22px" - } - }, - "title-size-m": { - "prop": "--spectrum-title-size-m", - "ref": "var(--spectrum-font-size-200)", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "19px" - } - }, - "title-size-s": { - "prop": "--spectrum-title-size-s", - "ref": "var(--spectrum-font-size-100)", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "17px" - } - }, - "title-size-xl": { - "prop": "--spectrum-title-size-xl", - "ref": "var(--spectrum-font-size-400)", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "title-size-xs": { - "prop": "--spectrum-title-size-xs", - "ref": "var(--spectrum-font-size-75)", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "title-size-xxl": { - "prop": "--spectrum-title-size-xxl", - "ref": "var(--spectrum-font-size-500)", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "27px" - } - }, - "title-size-xxxl": { - "prop": "--spectrum-title-size-xxxl", - "ref": "var(--spectrum-font-size-600)", - "desktop": { - "value": "25px" - }, - "mobile": { - "value": "31px" - } - }, - "toast-bottom-to-text": { - "prop": "--spectrum-toast-bottom-to-text", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "22px" - } - }, - "toast-height": { - "prop": "--spectrum-toast-height", - "desktop": { - "value": "52px" - }, - "mobile": { - "value": "60px" - } - }, - "toast-maximum-width": { - "prop": "--spectrum-toast-maximum-width", - "desktop": { - "value": "336px" - }, - "mobile": { - "value": "420px" - } - }, - "toast-top-to-text": { - "prop": "--spectrum-toast-top-to-text", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "20px" - } - }, - "toast-top-to-workflow-icon": { - "prop": "--spectrum-toast-top-to-workflow-icon", - "desktop": { - "value": "18px" - }, - "mobile": { - "value": "20px" - } - }, - "tooltip-maximum-width": { - "prop": "--spectrum-tooltip-maximum-width", - "desktop": { - "value": "160px" - }, - "mobile": { - "value": "200px" - } - }, - "tooltip-tip-corner-radius": { - "prop": "--spectrum-tooltip-tip-corner-radius", - "value": "1px" - }, - "tooltip-tip-height": { - "prop": "--spectrum-tooltip-tip-height", - "desktop": { - "value": "5px" - }, - "mobile": { - "value": "6px" - } - }, - "tooltip-tip-width": { - "prop": "--spectrum-tooltip-tip-width", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "12px" - } - }, - "track-color": { - "prop": "--spectrum-track-color", - "ref": "var(--spectrum-gray-300)", - "light": { - "value": "rgb(218, 218, 218)" - }, - "dark": { - "value": "rgb(57, 57, 57)" - } - }, - "transparent-black-100": { - "prop": "--spectrum-transparent-black-100", - "value": "rgba(0, 0, 0, 0.09)" - }, - "transparent-black-1000": { - "prop": "--spectrum-transparent-black-1000", - "value": "rgb(0, 0, 0)" - }, - "transparent-black-200": { - "prop": "--spectrum-transparent-black-200", - "value": "rgba(0, 0, 0, 0.12)" - }, - "transparent-black-25": { - "prop": "--spectrum-transparent-black-25", - "value": "rgba(0, 0, 0, 0)" - }, - "transparent-black-300": { - "prop": "--spectrum-transparent-black-300", - "value": "rgba(0, 0, 0, 0.15)" - }, - "transparent-black-400": { - "prop": "--spectrum-transparent-black-400", - "value": "rgba(0, 0, 0, 0.22)" - }, - "transparent-black-50": { - "prop": "--spectrum-transparent-black-50", - "value": "rgba(0, 0, 0, 0.03)" - }, - "transparent-black-500": { - "prop": "--spectrum-transparent-black-500", - "value": "rgba(0, 0, 0, 0.44)" - }, - "transparent-black-600": { - "prop": "--spectrum-transparent-black-600", - "value": "rgba(0, 0, 0, 0.56)" - }, - "transparent-black-700": { - "prop": "--spectrum-transparent-black-700", - "value": "rgba(0, 0, 0, 0.69)" - }, - "transparent-black-75": { - "prop": "--spectrum-transparent-black-75", - "value": "rgba(0, 0, 0, 0.05)" - }, - "transparent-black-800": { - "prop": "--spectrum-transparent-black-800", - "value": "rgba(0, 0, 0, 0.84)" - }, - "transparent-black-900": { - "prop": "--spectrum-transparent-black-900", - "value": "rgba(0, 0, 0, 0.93)" - }, - "transparent-white-100": { - "prop": "--spectrum-transparent-white-100", - "value": "rgba(255, 255, 255, 0.11)" - }, - "transparent-white-1000": { - "prop": "--spectrum-transparent-white-1000", - "value": "rgb(255, 255, 255)" - }, - "transparent-white-200": { - "prop": "--spectrum-transparent-white-200", - "value": "rgba(255, 255, 255, 0.14)" - }, - "transparent-white-25": { - "prop": "--spectrum-transparent-white-25", - "value": "rgba(255, 255, 255, 0)" - }, - "transparent-white-300": { - "prop": "--spectrum-transparent-white-300", - "value": "rgba(255, 255, 255, 0.17)" - }, - "transparent-white-400": { - "prop": "--spectrum-transparent-white-400", - "value": "rgba(255, 255, 255, 0.21)" - }, - "transparent-white-50": { - "prop": "--spectrum-transparent-white-50", - "value": "rgba(255, 255, 255, 0.04)" - }, - "transparent-white-500": { - "prop": "--spectrum-transparent-white-500", - "value": "rgba(255, 255, 255, 0.39)" - }, - "transparent-white-600": { - "prop": "--spectrum-transparent-white-600", - "value": "rgba(255, 255, 255, 0.51)" - }, - "transparent-white-700": { - "prop": "--spectrum-transparent-white-700", - "value": "rgba(255, 255, 255, 0.66)" - }, - "transparent-white-75": { - "prop": "--spectrum-transparent-white-75", - "value": "rgba(255, 255, 255, 0.07)" - }, - "transparent-white-800": { - "prop": "--spectrum-transparent-white-800", - "value": "rgba(255, 255, 255, 0.85)" - }, - "transparent-white-900": { - "prop": "--spectrum-transparent-white-900", - "value": "rgba(255, 255, 255, 0.94)" - }, - "tray-top-to-content-area": { - "prop": "--spectrum-tray-top-to-content-area", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tree-view-bottom-to-label": { - "prop": "--spectrum-tree-view-bottom-to-label", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "16px" - } - }, - "tree-view-disclosure-indicator-height": { - "prop": "--spectrum-tree-view-disclosure-indicator-height", - "desktop": { - "value": "32px" - }, - "mobile": { - "value": "40px" - } - }, - "tree-view-disclosure-indicator-width": { - "prop": "--spectrum-tree-view-disclosure-indicator-width", - "desktop": { - "value": "34px" - }, - "mobile": { - "value": "42px" - } - }, - "tree-view-drag-handle-to-checkbox": { - "prop": "--spectrum-tree-view-drag-handle-to-checkbox", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "tree-view-edge-to-checkbox": { - "prop": "--spectrum-tree-view-edge-to-checkbox", - "desktop": { - "value": "12px" - }, - "mobile": { - "value": "15px" - } - }, - "tree-view-edge-to-drag-handle": { - "prop": "--spectrum-tree-view-edge-to-drag-handle", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tree-view-end-edge-to-action-area": { - "prop": "--spectrum-tree-view-end-edge-to-action-area", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "7px" - } - }, - "tree-view-header-to-item": { - "prop": "--spectrum-tree-view-header-to-item", - "value": "-1px" - }, - "tree-view-item-to-header": { - "prop": "--spectrum-tree-view-item-to-header", - "desktop": { - "value": "24px" - }, - "mobile": { - "value": "30px" - } - }, - "tree-view-item-to-item": { - "prop": "--spectrum-tree-view-item-to-item", - "value": "-1px" - }, - "tree-view-item-to-item-detached": { - "prop": "--spectrum-tree-view-item-to-item-detached", - "value": "2px" - }, - "tree-view-label-to-action-area": { - "prop": "--spectrum-tree-view-label-to-action-area", - "desktop": { - "value": "6px" - }, - "mobile": { - "value": "8px" - } - }, - "tree-view-level-increment": { - "prop": "--spectrum-tree-view-level-increment", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "20px" - } - }, - "tree-view-minimum-height": { - "prop": "--spectrum-tree-view-minimum-height", - "desktop": { - "value": "40px" - }, - "mobile": { - "value": "50px" - } - }, - "tree-view-minimum-top-to-context-area": { - "prop": "--spectrum-tree-view-minimum-top-to-context-area", - "desktop": { - "value": "8px" - }, - "mobile": { - "value": "10px" - } - }, - "tree-view-minimum-width": { - "prop": "--spectrum-tree-view-minimum-width", - "desktop": { - "value": "160px" - }, - "mobile": { - "value": "200px" - } - }, - "tree-view-row-background-hover": { - "prop": "--spectrum-tree-view-row-background-hover", - "ref": "var(--spectrum-gray-100)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "tree-view-selected-row-background-color-emphasized": { - "prop": "--spectrum-tree-view-selected-row-background-color-emphasized", - "ref": "var(--spectrum-informative-color-800)", - "light": { - "value": "rgb(59, 99, 251)" - }, - "dark": { - "value": "rgb(64, 105, 253)" - } - }, - "tree-view-selected-row-background-default": { - "prop": "--spectrum-tree-view-selected-row-background-default", - "ref": "var(--spectrum-gray-100)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "tree-view-selected-row-background-hover": { - "prop": "--spectrum-tree-view-selected-row-background-hover", - "ref": "var(--spectrum-gray-100)", - "light": { - "value": "rgb(233, 233, 233)" - }, - "dark": { - "value": "rgb(44, 44, 44)" - } - }, - "tree-view-selected-row-background-opacity-emphasized": { - "prop": "--spectrum-tree-view-selected-row-background-opacity-emphasized", - "value": "0.1" - }, - "tree-view-selected-row-background-opacity-emphasized-hover": { - "prop": "--spectrum-tree-view-selected-row-background-opacity-emphasized-hover", - "value": "0.15" - }, - "tree-view-top-to-action-button": { - "prop": "--spectrum-tree-view-top-to-action-button", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tree-view-top-to-checkbox": { - "prop": "--spectrum-tree-view-top-to-checkbox", - "desktop": { - "value": "4px" - }, - "mobile": { - "value": "5px" - } - }, - "tree-view-top-to-disclosure-indicator": { - "prop": "--spectrum-tree-view-top-to-disclosure-indicator", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "tree-view-top-to-drag-handle": { - "prop": "--spectrum-tree-view-top-to-drag-handle", - "desktop": { - "value": "15px" - }, - "mobile": { - "value": "19px" - } - }, - "tree-view-top-to-label": { - "prop": "--spectrum-tree-view-top-to-label", - "desktop": { - "value": "10px" - }, - "mobile": { - "value": "13px" - } - }, - "triple-calendar-popover-minimum-height": { - "prop": "--spectrum-triple-calendar-popover-minimum-height", - "value": "320px" - }, - "triple-calendar-popover-minimum-width": { - "prop": "--spectrum-triple-calendar-popover-minimum-width", - "value": "912px" - }, - "turquoise-100": { - "prop": "--spectrum-turquoise-100", - "dark": { - "value": "rgb(0, 30, 33)" - }, - "light": { - "value": "rgb(238, 251, 251)" - } - }, - "turquoise-1000": { - "prop": "--spectrum-turquoise-1000", - "dark": { - "value": "rgb(13, 168, 182)" - }, - "light": { - "value": "rgb(5, 107, 116)" - } - }, - "turquoise-1100": { - "prop": "--spectrum-turquoise-1100", - "dark": { - "value": "rgb(16, 186, 202)" - }, - "light": { - "value": "rgb(3, 90, 98)" - } - }, - "turquoise-1200": { - "prop": "--spectrum-turquoise-1200", - "dark": { - "value": "rgb(64, 208, 220)" - }, - "light": { - "value": "rgb(1, 74, 81)" - } - }, - "turquoise-1300": { - "prop": "--spectrum-turquoise-1300", - "dark": { - "value": "rgb(128, 225, 231)" - }, - "light": { - "value": "rgb(0, 59, 65)" - } - }, - "turquoise-1400": { - "prop": "--spectrum-turquoise-1400", - "dark": { - "value": "rgb(183, 240, 240)" - }, - "light": { - "value": "rgb(0, 44, 49)" - } - }, - "turquoise-1500": { - "prop": "--spectrum-turquoise-1500", - "dark": { - "value": "rgb(228, 249, 249)" - }, - "light": { - "value": "rgb(0, 32, 35)" - } - }, - "turquoise-1600": { - "prop": "--spectrum-turquoise-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(0, 15, 17)" - } - }, - "turquoise-200": { - "prop": "--spectrum-turquoise-200", - "dark": { - "value": "rgb(0, 37, 41)" - }, - "light": { - "value": "rgb(209, 245, 245)" - } - }, - "turquoise-300": { - "prop": "--spectrum-turquoise-300", - "dark": { - "value": "rgb(0, 49, 54)" - }, - "light": { - "value": "rgb(169, 236, 237)" - } - }, - "turquoise-400": { - "prop": "--spectrum-turquoise-400", - "dark": { - "value": "rgb(0, 66, 72)" - }, - "light": { - "value": "rgb(111, 221, 228)" - } - }, - "turquoise-500": { - "prop": "--spectrum-turquoise-500", - "dark": { - "value": "rgb(3, 84, 92)" - }, - "light": { - "value": "rgb(39, 202, 216)" - } - }, - "turquoise-600": { - "prop": "--spectrum-turquoise-600", - "dark": { - "value": "rgb(5, 103, 112)" - }, - "light": { - "value": "rgb(15, 177, 192)" - } - }, - "turquoise-700": { - "prop": "--spectrum-turquoise-700", - "dark": { - "value": "rgb(7, 120, 131)" - }, - "light": { - "value": "rgb(12, 158, 171)" - } - }, - "turquoise-800": { - "prop": "--spectrum-turquoise-800", - "dark": { - "value": "rgb(9, 131, 142)" - }, - "light": { - "value": "rgb(10, 141, 153)" - } - }, - "turquoise-900": { - "prop": "--spectrum-turquoise-900", - "dark": { - "value": "rgb(11, 151, 164)" - }, - "light": { - "value": "rgb(8, 126, 137)" - } - }, - "turquoise-background-color-default": { - "prop": "--spectrum-turquoise-background-color-default", - "ref": "var(--spectrum-turquoise-800)", - "light": { - "value": "rgb(8, 126, 137)" - }, - "dark": { - "value": "rgb(9, 131, 142)" - } - }, - "turquoise-subtle-background-color-default": { - "prop": "--spectrum-turquoise-subtle-background-color-default", - "ref": "var(--spectrum-turquoise-300)", - "light": { - "value": "rgb(209, 245, 245)" - }, - "dark": { - "value": "rgb(0, 49, 54)" - } - }, - "turquoise-visual-color": { - "prop": "--spectrum-turquoise-visual-color", - "ref": "var(--spectrum-turquoise-900)", - "light": { - "value": "rgb(10, 141, 153)" - }, - "dark": { - "value": "rgb(11, 151, 164)" - } - }, - "user-card-minimum-height-extra-large": { - "prop": "--spectrum-user-card-minimum-height-extra-large", - "value": "236px" - }, - "user-card-minimum-height-large": { - "prop": "--spectrum-user-card-minimum-height-large", - "value": "219px" - }, - "user-card-minimum-height-medium": { - "prop": "--spectrum-user-card-minimum-height-medium", - "value": "202px" - }, - "user-card-minimum-height-small": { - "prop": "--spectrum-user-card-minimum-height-small", - "value": "192px" - }, - "user-card-minimum-height-title-below-extra-large": { - "prop": "--spectrum-user-card-minimum-height-title-below-extra-large", - "value": "263px" - }, - "user-card-minimum-height-title-below-large": { - "prop": "--spectrum-user-card-minimum-height-title-below-large", - "value": "244px" - }, - "user-card-minimum-height-title-below-medium": { - "prop": "--spectrum-user-card-minimum-height-title-below-medium", - "value": "224px" - }, - "user-card-minimum-height-title-below-small": { - "prop": "--spectrum-user-card-minimum-height-title-below-small", - "value": "212px" - }, - "white": { - "prop": "--spectrum-white", - "value": "rgb(255, 255, 255)" - }, - "window-to-edge": { - "prop": "--spectrum-window-to-edge", - "ref": "var(--spectrum-spacing-600)", - "value": "40px" - }, - "workflow-icon-size-100": { - "prop": "--spectrum-workflow-icon-size-100", - "desktop": { - "value": "20px" - }, - "mobile": { - "value": "24px" - } - }, - "workflow-icon-size-200": { - "prop": "--spectrum-workflow-icon-size-200", - "desktop": { - "value": "22px" - }, - "mobile": { - "value": "28px" - } - }, - "workflow-icon-size-300": { - "prop": "--spectrum-workflow-icon-size-300", - "desktop": { - "value": "26px" - }, - "mobile": { - "value": "30px" - } - }, - "workflow-icon-size-50": { - "prop": "--spectrum-workflow-icon-size-50", - "desktop": { - "value": "14px" - }, - "mobile": { - "value": "16px" - } - }, - "workflow-icon-size-75": { - "prop": "--spectrum-workflow-icon-size-75", - "desktop": { - "value": "16px" - }, - "mobile": { - "value": "18px" - } - }, - "yellow-100": { - "prop": "--spectrum-yellow-100", - "light": { - "value": "rgb(255, 248, 204)" - }, - "dark": { - "value": "rgb(37, 23, 0)" - } - }, - "yellow-1000": { - "prop": "--spectrum-yellow-1000", - "light": { - "value": "rgb(134, 85, 0)" - }, - "dark": { - "value": "rgb(203, 141, 0)" - } - }, - "yellow-1100": { - "prop": "--spectrum-yellow-1100", - "light": { - "value": "rgb(114, 72, 0)" - }, - "dark": { - "value": "rgb(218, 159, 0)" - } - }, - "yellow-1200": { - "prop": "--spectrum-yellow-1200", - "light": { - "value": "rgb(93, 59, 0)" - }, - "dark": { - "value": "rgb(235, 183, 0)" - } - }, - "yellow-1300": { - "prop": "--spectrum-yellow-1300", - "light": { - "value": "rgb(75, 47, 0)" - }, - "dark": { - "value": "rgb(249, 206, 0)" - } - }, - "yellow-1400": { - "prop": "--spectrum-yellow-1400", - "light": { - "value": "rgb(56, 35, 0)" - }, - "dark": { - "value": "rgb(255, 230, 86)" - } - }, - "yellow-1500": { - "prop": "--spectrum-yellow-1500", - "dark": { - "value": "rgb(255, 246, 195)" - }, - "light": { - "value": "rgb(40, 25, 0)" - } - }, - "yellow-1600": { - "prop": "--spectrum-yellow-1600", - "dark": { - "value": "rgb(255, 255, 255)" - }, - "light": { - "value": "rgb(18, 11, 0)" - } - }, - "yellow-200": { - "prop": "--spectrum-yellow-200", - "light": { - "value": "rgb(255, 241, 151)" - }, - "dark": { - "value": "rgb(47, 29, 0)" - } - }, - "yellow-300": { - "prop": "--spectrum-yellow-300", - "light": { - "value": "rgb(255, 222, 44)" - }, - "dark": { - "value": "rgb(61, 39, 0)" - } - }, - "yellow-400": { - "prop": "--spectrum-yellow-400", - "light": { - "value": "rgb(245, 199, 0)" - }, - "dark": { - "value": "rgb(83, 52, 0)" - } - }, - "yellow-500": { - "prop": "--spectrum-yellow-500", - "light": { - "value": "rgb(230, 175, 0)" - }, - "dark": { - "value": "rgb(107, 67, 0)" - } - }, - "yellow-600": { - "prop": "--spectrum-yellow-600", - "light": { - "value": "rgb(210, 149, 0)" - }, - "dark": { - "value": "rgb(130, 82, 0)" - } - }, - "yellow-700": { - "prop": "--spectrum-yellow-700", - "light": { - "value": "rgb(193, 131, 0)" - }, - "dark": { - "value": "rgb(151, 97, 0)" - } - }, - "yellow-800": { - "prop": "--spectrum-yellow-800", - "light": { - "value": "rgb(175, 116, 0)" - }, - "dark": { - "value": "rgb(164, 106, 0)" - } - }, - "yellow-900": { - "prop": "--spectrum-yellow-900", - "light": { - "value": "rgb(158, 102, 0)" - }, - "dark": { - "value": "rgb(186, 124, 0)" - } - }, - "yellow-background-color-default": { - "prop": "--spectrum-yellow-background-color-default", - "ref": "var(--spectrum-yellow-1100)", - "light": { - "value": "rgb(245, 199, 0)" - }, - "dark": { - "value": "rgb(218, 159, 0)" - } - }, - "yellow-subtle-background-color-default": { - "prop": "--spectrum-yellow-subtle-background-color-default", - "ref": "var(--spectrum-yellow-300)", - "light": { - "value": "rgb(255, 241, 151)" - }, - "dark": { - "value": "rgb(61, 39, 0)" - } - }, - "yellow-visual-color": { - "prop": "--spectrum-yellow-visual-color", - "ref": "var(--spectrum-yellow-1100)", - "light": { - "value": "rgb(210, 149, 0)" - }, - "dark": { - "value": "rgb(218, 159, 0)" - } - } -} \ No newline at end of file + "accent-background-color-default": { + "prop": "--spectrum-accent-background-color-default", + "ref": "var(--spectrum-accent-color-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "accent-background-color-down": { + "prop": "--spectrum-accent-background-color-down", + "ref": "var(--spectrum-accent-color-700)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "accent-background-color-hover": { + "prop": "--spectrum-accent-background-color-hover", + "ref": "var(--spectrum-accent-color-700)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "accent-background-color-key-focus": { + "prop": "--spectrum-accent-background-color-key-focus", + "ref": "var(--spectrum-accent-color-700)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "accent-color-100": { + "prop": "--spectrum-accent-color-100", + "ref": "var(--spectrum-blue-100)", + "light": { + "value": "rgb(245, 249, 255)" + }, + "dark": { + "value": "rgb(14, 23, 63)" + } + }, + "accent-color-1000": { + "prop": "--spectrum-accent-color-1000", + "ref": "var(--spectrum-blue-1000)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "accent-color-1100": { + "prop": "--spectrum-accent-color-1100", + "ref": "var(--spectrum-blue-1100)", + "light": { + "value": "rgb(29, 62, 207)" + }, + "dark": { + "value": "rgb(124, 169, 252)" + } + }, + "accent-color-1200": { + "prop": "--spectrum-accent-color-1200", + "ref": "var(--spectrum-blue-1200)", + "light": { + "value": "rgb(21, 50, 173)" + }, + "dark": { + "value": "rgb(152, 192, 252)" + } + }, + "accent-color-1300": { + "prop": "--spectrum-accent-color-1300", + "ref": "var(--spectrum-blue-1300)", + "light": { + "value": "rgb(16, 40, 140)" + }, + "dark": { + "value": "rgb(181, 213, 253)" + } + }, + "accent-color-1400": { + "prop": "--spectrum-accent-color-1400", + "ref": "var(--spectrum-blue-1400)", + "light": { + "value": "rgb(12, 31, 105)" + }, + "dark": { + "value": "rgb(213, 231, 254)" + } + }, + "accent-color-1500": { + "prop": "--spectrum-accent-color-1500", + "ref": "var(--spectrum-blue-1500)", + "dark": { + "value": "rgb(238, 245, 255)" + }, + "light": { + "value": "rgb(14, 24, 67)" + } + }, + "accent-color-1600": { + "prop": "--spectrum-accent-color-1600", + "ref": "var(--spectrum-blue-1600)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(7, 11, 30)" + } + }, + "accent-color-200": { + "prop": "--spectrum-accent-color-200", + "ref": "var(--spectrum-blue-200)", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(15, 28, 82)" + } + }, + "accent-color-300": { + "prop": "--spectrum-accent-color-300", + "ref": "var(--spectrum-blue-300)", + "light": { + "value": "rgb(203, 226, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "accent-color-400": { + "prop": "--spectrum-accent-color-400", + "ref": "var(--spectrum-blue-400)", + "light": { + "value": "rgb(172, 207, 253)" + }, + "dark": { + "value": "rgb(18, 45, 154)" + } + }, + "accent-color-500": { + "prop": "--spectrum-accent-color-500", + "ref": "var(--spectrum-blue-500)", + "light": { + "value": "rgb(142, 185, 252)" + }, + "dark": { + "value": "rgb(26, 58, 195)" + } + }, + "accent-color-600": { + "prop": "--spectrum-accent-color-600", + "ref": "var(--spectrum-blue-600)", + "light": { + "value": "rgb(114, 158, 253)" + }, + "dark": { + "value": "rgb(37, 73, 229)" + } + }, + "accent-color-700": { + "prop": "--spectrum-accent-color-700", + "ref": "var(--spectrum-blue-700)", + "light": { + "value": "rgb(93, 137, 255)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "accent-color-800": { + "prop": "--spectrum-accent-color-800", + "ref": "var(--spectrum-blue-800)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "accent-color-900": { + "prop": "--spectrum-accent-color-900", + "ref": "var(--spectrum-blue-900)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "accent-content-color-default": { + "prop": "--spectrum-accent-content-color-default", + "ref": "var(--spectrum-accent-color-900)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "accent-content-color-down": { + "prop": "--spectrum-accent-content-color-down", + "ref": "var(--spectrum-accent-color-1000)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "accent-content-color-hover": { + "prop": "--spectrum-accent-content-color-hover", + "ref": "var(--spectrum-accent-color-1000)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "accent-content-color-key-focus": { + "prop": "--spectrum-accent-content-color-key-focus", + "ref": "var(--spectrum-accent-color-1000)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "accent-content-color-selected": { + "prop": "--spectrum-accent-content-color-selected", + "ref": "var(--spectrum-accent-content-color-down)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "accent-subtle-background-color-default": { + "prop": "--spectrum-accent-subtle-background-color-default", + "ref": "var(--spectrum-accent-color-300)", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "accent-visual-color": { + "prop": "--spectrum-accent-visual-color", + "ref": "var(--spectrum-accent-color-900)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "accordion-bottom-to-text-compact-extra-large": { + "prop": "--spectrum-accordion-bottom-to-text-compact-extra-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "accordion-bottom-to-text-compact-large": { + "prop": "--spectrum-accordion-bottom-to-text-compact-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "9px" + } + }, + "accordion-bottom-to-text-compact-medium": { + "prop": "--spectrum-accordion-bottom-to-text-compact-medium", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "8px" + } + }, + "accordion-bottom-to-text-compact-small": { + "prop": "--spectrum-accordion-bottom-to-text-compact-small", + "desktop": { + "value": "2px" + }, + "mobile": { + "value": "4px" + } + }, + "accordion-bottom-to-text-regular-extra-large": { + "prop": "--spectrum-accordion-bottom-to-text-regular-extra-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "accordion-bottom-to-text-regular-large": { + "prop": "--spectrum-accordion-bottom-to-text-regular-large", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "accordion-bottom-to-text-regular-medium": { + "prop": "--spectrum-accordion-bottom-to-text-regular-medium", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "13px" + } + }, + "accordion-bottom-to-text-regular-small": { + "prop": "--spectrum-accordion-bottom-to-text-regular-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "accordion-bottom-to-text-spacious-extra-large": { + "prop": "--spectrum-accordion-bottom-to-text-spacious-extra-large", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "21px" + } + }, + "accordion-bottom-to-text-spacious-large": { + "prop": "--spectrum-accordion-bottom-to-text-spacious-large", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "accordion-bottom-to-text-spacious-medium": { + "prop": "--spectrum-accordion-bottom-to-text-spacious-medium", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "18px" + } + }, + "accordion-bottom-to-text-spacious-small": { + "prop": "--spectrum-accordion-bottom-to-text-spacious-small", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "accordion-content-area-bottom-to-content": { + "prop": "--spectrum-accordion-content-area-bottom-to-content", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "accordion-content-area-edge-to-content-extra-large": { + "prop": "--spectrum-accordion-content-area-edge-to-content-extra-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "accordion-content-area-edge-to-content-large": { + "prop": "--spectrum-accordion-content-area-edge-to-content-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "accordion-content-area-edge-to-content-medium": { + "prop": "--spectrum-accordion-content-area-edge-to-content-medium", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "accordion-content-area-edge-to-content-small": { + "prop": "--spectrum-accordion-content-area-edge-to-content-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "accordion-content-area-top-to-content": { + "prop": "--spectrum-accordion-content-area-top-to-content", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "accordion-disclosure-indicator-to-text": { + "prop": "--spectrum-accordion-disclosure-indicator-to-text", + "value": "0px" + }, + "accordion-disclosure-indicator-to-text-extra-large": { + "prop": "--spectrum-accordion-disclosure-indicator-to-text-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "accordion-disclosure-indicator-to-text-large": { + "prop": "--spectrum-accordion-disclosure-indicator-to-text-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "accordion-disclosure-indicator-to-text-medium": { + "prop": "--spectrum-accordion-disclosure-indicator-to-text-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "accordion-disclosure-indicator-to-text-small": { + "prop": "--spectrum-accordion-disclosure-indicator-to-text-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "accordion-edge-to-content-area-extra-large": { + "prop": "--spectrum-accordion-edge-to-content-area-extra-large", + "value": "17px" + }, + "accordion-edge-to-content-area-large": { + "prop": "--spectrum-accordion-edge-to-content-area-large", + "value": "14px" + }, + "accordion-edge-to-content-area-medium": { + "prop": "--spectrum-accordion-edge-to-content-area-medium", + "value": "11px" + }, + "accordion-edge-to-content-area-small": { + "prop": "--spectrum-accordion-edge-to-content-area-small", + "value": "7px" + }, + "accordion-edge-to-disclosure-indicator": { + "prop": "--spectrum-accordion-edge-to-disclosure-indicator", + "value": "0px" + }, + "accordion-edge-to-text": { + "prop": "--spectrum-accordion-edge-to-text", + "value": "0px" + }, + "accordion-focus-indicator-gap": { + "prop": "--spectrum-accordion-focus-indicator-gap", + "value": "0px" + }, + "accordion-item-to-divider": { + "prop": "--spectrum-accordion-item-to-divider", + "value": "0px" + }, + "accordion-minimum-width": { + "prop": "--spectrum-accordion-minimum-width", + "desktop": { + "value": "200px" + }, + "mobile": { + "value": "250px" + } + }, + "accordion-small-top-to-text-spacious": { + "prop": "--spectrum-accordion-small-top-to-text-spacious", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "accordion-top-to-text-compact-extra-large": { + "prop": "--spectrum-accordion-top-to-text-compact-extra-large", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "accordion-top-to-text-compact-large": { + "prop": "--spectrum-accordion-top-to-text-compact-large", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "7px" + } + }, + "accordion-top-to-text-compact-medium": { + "prop": "--spectrum-accordion-top-to-text-compact-medium", + "value": "4px" + }, + "accordion-top-to-text-compact-small": { + "prop": "--spectrum-accordion-top-to-text-compact-small", + "value": "2px" + }, + "accordion-top-to-text-regular-extra-large": { + "prop": "--spectrum-accordion-top-to-text-regular-extra-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "accordion-top-to-text-regular-large": { + "prop": "--spectrum-accordion-top-to-text-regular-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "accordion-top-to-text-regular-medium": { + "prop": "--spectrum-accordion-top-to-text-regular-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "9px" + } + }, + "accordion-top-to-text-regular-small": { + "prop": "--spectrum-accordion-top-to-text-regular-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "accordion-top-to-text-spacious-extra-large": { + "prop": "--spectrum-accordion-top-to-text-spacious-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "14px" + } + }, + "accordion-top-to-text-spacious-large": { + "prop": "--spectrum-accordion-top-to-text-spacious-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "accordion-top-to-text-spacious-medium": { + "prop": "--spectrum-accordion-top-to-text-spacious-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "accordion-top-to-text-spacious-small": { + "prop": "--spectrum-accordion-top-to-text-spacious-small", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "action-bar-border-color": { + "prop": "--spectrum-action-bar-border-color", + "light": { + "ref": "var(--spectrum-transparent-white-25)", + "value": "rgba(255, 255, 255, 0)" + }, + "ref": "var(--spectrum-gray-400)", + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "action-bar-bottom-to-content-area": { + "prop": "--spectrum-action-bar-bottom-to-content-area", + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + }, + "action-bar-close-button-to-counter": { + "prop": "--spectrum-action-bar-close-button-to-counter", + "ref": "var(--spectrum-text-to-control-50)", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "action-bar-counter-font-size": { + "prop": "--spectrum-action-bar-counter-font-size", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "action-bar-edge-to-content-area": { + "prop": "--spectrum-action-bar-edge-to-content-area", + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "action-bar-height": { + "prop": "--spectrum-action-bar-height", + "ref": "var(--spectrum-component-height-400)", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "action-bar-label-to-action-group-area": { + "prop": "--spectrum-action-bar-label-to-action-group-area", + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + }, + "action-bar-minimum-width": { + "prop": "--spectrum-action-bar-minimum-width", + "value": "176px" + }, + "action-bar-top-to-content-area": { + "prop": "--spectrum-action-bar-top-to-content-area", + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + }, + "action-bar-top-to-item-counter": { + "prop": "--spectrum-action-bar-top-to-item-counter", + "ref": "var(--spectrum-component-top-to-text-300)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "action-button-edge-to-hold-icon-extra-large": { + "prop": "--spectrum-action-button-edge-to-hold-icon-extra-large", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "action-button-edge-to-hold-icon-extra-small": { + "prop": "--spectrum-action-button-edge-to-hold-icon-extra-small", + "value": "3px" + }, + "action-button-edge-to-hold-icon-large": { + "prop": "--spectrum-action-button-edge-to-hold-icon-large", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "action-button-edge-to-hold-icon-medium": { + "prop": "--spectrum-action-button-edge-to-hold-icon-medium", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "action-button-edge-to-hold-icon-small": { + "prop": "--spectrum-action-button-edge-to-hold-icon-small", + "value": "3px" + }, + "add-icon-size-100": { + "prop": "--spectrum-add-icon-size-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "add-icon-size-200": { + "prop": "--spectrum-add-icon-size-200", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "add-icon-size-300": { + "prop": "--spectrum-add-icon-size-300", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "add-icon-size-50": { + "prop": "--spectrum-add-icon-size-50", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "add-icon-size-75": { + "prop": "--spectrum-add-icon-size-75", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "alert-banner-bottom-to-text": { + "prop": "--spectrum-alert-banner-bottom-to-text", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "alert-banner-close-button-spacing": { + "prop": "--spectrum-alert-banner-close-button-spacing", + "desktop": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + } + }, + "alert-banner-edge-to-button": { + "prop": "--spectrum-alert-banner-edge-to-button", + "desktop": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + } + }, + "alert-banner-edge-to-divider": { + "prop": "--spectrum-alert-banner-edge-to-divider", + "desktop": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + } + }, + "alert-banner-minimum-height": { + "prop": "--spectrum-alert-banner-minimum-height", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "64px" + } + }, + "alert-banner-text-to-button-vertical": { + "prop": "--spectrum-alert-banner-text-to-button-vertical", + "desktop": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + } + }, + "alert-banner-to-bottom-text": { + "prop": "--spectrum-alert-banner-to-bottom-text", + "ref": "var(--spectrum-alert-banner-bottom-to-text)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "alert-banner-to-top-text": { + "prop": "--spectrum-alert-banner-to-top-text", + "ref": "var(--spectrum-alert-banner-top-to-text)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "21px" + } + }, + "alert-banner-to-top-workflow-icon": { + "prop": "--spectrum-alert-banner-to-top-workflow-icon", + "ref": "var(--spectrum-alert-banner-top-to-workflow-icon)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "20px" + } + }, + "alert-banner-top-to-alert-icon": { + "prop": "--spectrum-alert-banner-top-to-alert-icon", + "desktop": { + "value": "37px" + }, + "mobile": { + "value": "29px" + } + }, + "alert-banner-top-to-text": { + "prop": "--spectrum-alert-banner-top-to-text", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "21px" + } + }, + "alert-banner-top-to-workflow-icon": { + "prop": "--spectrum-alert-banner-top-to-workflow-icon", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "20px" + } + }, + "alert-banner-width": { + "prop": "--spectrum-alert-banner-width", + "desktop": { + "value": "832px" + }, + "mobile": { + "value": "680px" + } + }, + "alert-dialog-description-font-size": { + "prop": "--spectrum-alert-dialog-description-font-size", + "ref": "var(--spectrum-body-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "alert-dialog-description-size": { + "prop": "--spectrum-alert-dialog-description-size", + "ref": "var(--spectrum-body-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "alert-dialog-description-to-buttons": { + "prop": "--spectrum-alert-dialog-description-to-buttons", + "desktop": { + "ref": "var(--spectrum-spacing-700)", + "value": "48px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-600)", + "value": "40px" + } + }, + "alert-dialog-maximum-width": { + "prop": "--spectrum-alert-dialog-maximum-width", + "value": "480px" + }, + "alert-dialog-minimum-width": { + "prop": "--spectrum-alert-dialog-minimum-width", + "value": "288px" + }, + "alert-dialog-padding": { + "prop": "--spectrum-alert-dialog-padding", + "desktop": { + "ref": "var(--spectrum-spacing-500)", + "value": "32px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + } + }, + "alert-dialog-title-font-size": { + "prop": "--spectrum-alert-dialog-title-font-size", + "ref": "var(--spectrum-title-size-xl)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "24px" + } + }, + "alert-dialog-title-size": { + "prop": "--spectrum-alert-dialog-title-size", + "ref": "var(--spectrum-title-size-xl)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "24px" + } + }, + "android-elevation": { + "prop": "--spectrum-android-elevation", + "value": "2dp" + }, + "animation-duration-0": { + "prop": "--spectrum-animation-duration-0", + "value": "0ms" + }, + "animation-duration-100": { + "prop": "--spectrum-animation-duration-100", + "value": "130ms" + }, + "animation-duration-1000": { + "prop": "--spectrum-animation-duration-1000", + "value": "500ms" + }, + "animation-duration-200": { + "prop": "--spectrum-animation-duration-200", + "value": "160ms" + }, + "animation-duration-2000": { + "prop": "--spectrum-animation-duration-2000", + "value": "1000ms" + }, + "animation-duration-300": { + "prop": "--spectrum-animation-duration-300", + "value": "190ms" + }, + "animation-duration-400": { + "prop": "--spectrum-animation-duration-400", + "value": "220ms" + }, + "animation-duration-4000": { + "prop": "--spectrum-animation-duration-4000", + "value": "2000ms" + }, + "animation-duration-500": { + "prop": "--spectrum-animation-duration-500", + "value": "250ms" + }, + "animation-duration-600": { + "prop": "--spectrum-animation-duration-600", + "value": "300ms" + }, + "animation-duration-6000": { + "prop": "--spectrum-animation-duration-6000", + "value": "3000ms" + }, + "animation-duration-700": { + "prop": "--spectrum-animation-duration-700", + "value": "3500ms" + }, + "animation-duration-800": { + "prop": "--spectrum-animation-duration-800", + "value": "400ms" + }, + "animation-duration-900": { + "prop": "--spectrum-animation-duration-900", + "value": "450ms" + }, + "animation-ease-in": { + "prop": "--spectrum-animation-ease-in", + "value": "cubic-bezier(0.5, 0, 1, 1)" + }, + "animation-ease-in-out": { + "prop": "--spectrum-animation-ease-in-out", + "value": "cubic-bezier(0.45, 0, 0.4, 1)" + }, + "animation-ease-linear": { + "prop": "--spectrum-animation-ease-linear", + "value": "cubic-bezier(0, 0, 1, 1)" + }, + "animation-ease-out": { + "prop": "--spectrum-animation-ease-out", + "value": "cubic-bezier(0, 0, 0.4, 1)" + }, + "animation-linear": { + "prop": "--spectrum-animation-linear", + "value": "cubic-bezier(0, 0, 1, 1)" + }, + "arrow-icon-size-100": { + "prop": "--spectrum-arrow-icon-size-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "arrow-icon-size-200": { + "prop": "--spectrum-arrow-icon-size-200", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "arrow-icon-size-300": { + "prop": "--spectrum-arrow-icon-size-300", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "arrow-icon-size-400": { + "prop": "--spectrum-arrow-icon-size-400", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "arrow-icon-size-500": { + "prop": "--spectrum-arrow-icon-size-500", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "arrow-icon-size-600": { + "prop": "--spectrum-arrow-icon-size-600", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "arrow-icon-size-75": { + "prop": "--spectrum-arrow-icon-size-75", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "assestcard-focus-indicator-color": { + "prop": "--spectrum-assestcard-focus-indicator-color", + "ref": "var(--spectrum-blue-800)", + "dark": { + "value": "rgb(52, 91, 248)" + }, + "light": { + "value": "rgb(75, 117, 255)" + } + }, + "assetcard-border-color-selected": { + "prop": "--spectrum-assetcard-border-color-selected", + "ref": "var(--spectrum-blue-900)", + "dark": { + "value": "rgb(64, 105, 253)" + }, + "light": { + "value": "rgb(59, 99, 251)" + } + }, + "assetcard-border-color-selected-down": { + "prop": "--spectrum-assetcard-border-color-selected-down", + "ref": "var(--spectrum-blue-1000)", + "dark": { + "value": "rgb(86, 129, 255)" + }, + "light": { + "value": "rgb(39, 77, 234)" + } + }, + "assetcard-border-color-selected-hover": { + "prop": "--spectrum-assetcard-border-color-selected-hover", + "ref": "var(--spectrum-blue-900)", + "dark": { + "value": "rgb(64, 105, 253)" + }, + "light": { + "value": "rgb(59, 99, 251)" + } + }, + "assetcard-content-font-size": { + "prop": "--spectrum-assetcard-content-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "assetcard-focus-ring-border-radius": { + "prop": "--spectrum-assetcard-focus-ring-border-radius", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "9px" + } + }, + "assetcard-header-content-font-size": { + "prop": "--spectrum-assetcard-header-content-font-size", + "ref": "var(--spectrum-heading-size-xxs)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "17px" + } + }, + "assetcard-selectionindicator-background-color-ordered": { + "prop": "--spectrum-assetcard-selectionindicator-background-color-ordered", + "ref": "var(--spectrum-blue-900)", + "dark": { + "value": "rgb(64, 105, 253)" + }, + "light": { + "value": "rgb(59, 99, 251)" + } + }, + "assetcard-selectionindicator-margin": { + "prop": "--spectrum-assetcard-selectionindicator-margin", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "assetcard-title-font-size": { + "prop": "--spectrum-assetcard-title-font-size", + "ref": "var(--spectrum-heading-size-xxs)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "17px" + } + }, + "assetlist-border-color-key-focus": { + "prop": "--spectrum-assetlist-border-color-key-focus", + "ref": "var(--spectrum-blue-800)", + "dark": { + "value": "rgb(52, 91, 248)" + }, + "light": { + "value": "rgb(75, 117, 255)" + } + }, + "assetlist-item-background-color-selected": { + "prop": "--spectrum-assetlist-item-background-color-selected", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 15%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 10%, transparent)" + } + }, + "assetlist-item-background-color-selected-hover": { + "prop": "--spectrum-assetlist-item-background-color-selected-hover", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + }, + "asterisk-icon-size-100": { + "prop": "--spectrum-asterisk-icon-size-100", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "asterisk-icon-size-200": { + "prop": "--spectrum-asterisk-icon-size-200", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "asterisk-icon-size-300": { + "prop": "--spectrum-asterisk-icon-size-300", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "asterisk-icon-size-75": { + "prop": "--spectrum-asterisk-icon-size-75", + "value": "8px" + }, + "avatar-border-color": { + "prop": "--spectrum-avatar-border-color", + "ref": "var(--spectrum-gray-25)", + "dark": { + "value": "rgb(17, 17, 17)" + }, + "light": { + "value": "rgb(255, 255, 255)" + } + }, + "avatar-border-width": { + "prop": "--spectrum-avatar-border-width", + "ref": "var(--spectrum-border-width-100)", + "value": "1px" + }, + "avatar-group-size-100": { + "prop": "--spectrum-avatar-group-size-100", + "ref": "var(--spectrum-avatar-size-100)", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "28px" + } + }, + "avatar-group-size-200": { + "prop": "--spectrum-avatar-group-size-200", + "ref": "var(--spectrum-avatar-size-200)", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "32px" + } + }, + "avatar-group-size-300": { + "prop": "--spectrum-avatar-group-size-300", + "ref": "var(--spectrum-avatar-size-300)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "36px" + } + }, + "avatar-group-size-400": { + "prop": "--spectrum-avatar-group-size-400", + "ref": "var(--spectrum-avatar-size-400)", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "40px" + } + }, + "avatar-group-size-50": { + "prop": "--spectrum-avatar-group-size-50", + "ref": "var(--spectrum-avatar-size-50)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "avatar-group-size-500": { + "prop": "--spectrum-avatar-group-size-500", + "ref": "var(--spectrum-avatar-size-500)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "44px" + } + }, + "avatar-group-size-75": { + "prop": "--spectrum-avatar-group-size-75", + "ref": "var(--spectrum-avatar-size-75)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "avatar-opacity-disabled": { + "prop": "--spectrum-avatar-opacity-disabled", + "ref": "var(--spectrum-opacity-disabled)", + "value": "30%" + }, + "avatar-size-100": { + "prop": "--spectrum-avatar-size-100", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "28px" + } + }, + "avatar-size-1000": { + "prop": "--spectrum-avatar-size-1000", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "72px" + } + }, + "avatar-size-1100": { + "prop": "--spectrum-avatar-size-1100", + "desktop": { + "value": "72px" + }, + "mobile": { + "value": "80px" + } + }, + "avatar-size-1200": { + "prop": "--spectrum-avatar-size-1200", + "desktop": { + "value": "80px" + }, + "mobile": { + "value": "88px" + } + }, + "avatar-size-1300": { + "prop": "--spectrum-avatar-size-1300", + "desktop": { + "value": "88px" + }, + "mobile": { + "value": "96px" + } + }, + "avatar-size-1400": { + "prop": "--spectrum-avatar-size-1400", + "desktop": { + "value": "96px" + }, + "mobile": { + "value": "104px" + } + }, + "avatar-size-1500": { + "prop": "--spectrum-avatar-size-1500", + "desktop": { + "value": "104px" + }, + "mobile": { + "value": "112px" + } + }, + "avatar-size-200": { + "prop": "--spectrum-avatar-size-200", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "32px" + } + }, + "avatar-size-300": { + "prop": "--spectrum-avatar-size-300", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "36px" + } + }, + "avatar-size-400": { + "prop": "--spectrum-avatar-size-400", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "40px" + } + }, + "avatar-size-50": { + "prop": "--spectrum-avatar-size-50", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "avatar-size-500": { + "prop": "--spectrum-avatar-size-500", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "44px" + } + }, + "avatar-size-600": { + "prop": "--spectrum-avatar-size-600", + "desktop": { + "value": "44px" + }, + "mobile": { + "value": "48px" + } + }, + "avatar-size-700": { + "prop": "--spectrum-avatar-size-700", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "52px" + } + }, + "avatar-size-75": { + "prop": "--spectrum-avatar-size-75", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "avatar-size-800": { + "prop": "--spectrum-avatar-size-800", + "desktop": { + "value": "52px" + }, + "mobile": { + "value": "56px" + } + }, + "avatar-size-900": { + "prop": "--spectrum-avatar-size-900", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "64px" + } + }, + "avatar-to-avatar-100": { + "prop": "--spectrum-avatar-to-avatar-100", + "desktop": { + "value": "-6px" + }, + "mobile": { + "value": "-7px" + } + }, + "avatar-to-avatar-200": { + "prop": "--spectrum-avatar-to-avatar-200", + "desktop": { + "value": "-7px" + }, + "mobile": { + "value": "-8px" + } + }, + "avatar-to-avatar-300": { + "prop": "--spectrum-avatar-to-avatar-300", + "desktop": { + "value": "-8px" + }, + "mobile": { + "value": "-9px" + } + }, + "avatar-to-avatar-400": { + "prop": "--spectrum-avatar-to-avatar-400", + "desktop": { + "value": "-9px" + }, + "mobile": { + "value": "-10px" + } + }, + "avatar-to-avatar-50": { + "prop": "--spectrum-avatar-to-avatar-50", + "desktop": { + "value": "-4px" + }, + "mobile": { + "value": "-5px" + } + }, + "avatar-to-avatar-500": { + "prop": "--spectrum-avatar-to-avatar-500", + "desktop": { + "value": "-10px" + }, + "mobile": { + "value": "-11px" + } + }, + "avatar-to-avatar-75": { + "prop": "--spectrum-avatar-to-avatar-75", + "desktop": { + "value": "-5px" + }, + "mobile": { + "value": "-6px" + } + }, + "background-base-color": { + "prop": "--spectrum-background-base-color", + "ref": "var(--spectrum-gray-25)", + "dark": { + "value": "rgb(17, 17, 17)" + }, + "light": { + "value": "rgb(255, 255, 255)" + } + }, + "background-elevated-color": { + "prop": "--spectrum-background-elevated-color", + "ref": "var(--spectrum-gray-25)", + "dark": { + "value": "rgb(34, 34, 34)" + }, + "light": { + "value": "rgb(255, 255, 255)" + } + }, + "background-layer-1-color": { + "prop": "--spectrum-background-layer-1-color", + "ref": "var(--spectrum-gray-50)", + "light": { + "value": "rgb(248, 248, 248)" + }, + "dark": { + "value": "rgb(27, 27, 27)" + } + }, + "background-layer-2-color": { + "prop": "--spectrum-background-layer-2-color", + "ref": "var(--spectrum-gray-75)", + "light": { + "value": "rgb(255, 255, 255)" + }, + "dark": { + "value": "rgb(34, 34, 34)" + } + }, + "background-opacity-default": { + "prop": "--spectrum-background-opacity-default", + "ref": "0", + "value": "0%" + }, + "background-opacity-down": { + "prop": "--spectrum-background-opacity-down", + "ref": "0.1", + "value": "10%" + }, + "background-opacity-hover": { + "prop": "--spectrum-background-opacity-hover", + "ref": "0.1", + "value": "10%" + }, + "background-opacity-key-focus": { + "prop": "--spectrum-background-opacity-key-focus", + "ref": "0.1", + "value": "10%" + }, + "background-pasteboard-color": { + "prop": "--spectrum-background-pasteboard-color", + "ref": "var(--spectrum-gray-100)", + "dark": { + "value": "rgb(17, 17, 17)" + }, + "light": { + "value": "rgb(233, 233, 233)" + } + }, + "badge-label-icon-color-primary": { + "prop": "--spectrum-badge-label-icon-color-primary", + "dark": { + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "light": { + "ref": "var(--spectrum-white)", + "value": "rgb(255, 255, 255)" + } + }, + "bar-panel-gripper-color": { + "prop": "--spectrum-bar-panel-gripper-color", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "bar-panel-gripper-color-drag": { + "prop": "--spectrum-bar-panel-gripper-color-drag", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "bar-panel-maximum-width": { + "prop": "--spectrum-bar-panel-maximum-width", + "value": "72px" + }, + "bar-panel-minimum-width": { + "prop": "--spectrum-bar-panel-minimum-width", + "value": "40px" + }, + "bar-panel-spacing-extra-spacious": { + "prop": "--spectrum-bar-panel-spacing-extra-spacious", + "value": "20px" + }, + "bar-panel-width": { + "prop": "--spectrum-bar-panel-width", + "value": "56px" + }, + "black": { + "prop": "--spectrum-black", + "value": "rgb(0, 0, 0)" + }, + "black-font-weight": { + "prop": "--spectrum-black-font-weight", + "ref": "black", + "value": "900" + }, + "blue-100": { + "prop": "--spectrum-blue-100", + "light": { + "value": "rgb(245, 249, 255)" + }, + "dark": { + "value": "rgb(14, 23, 63)" + } + }, + "blue-1000": { + "prop": "--spectrum-blue-1000", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "blue-1100": { + "prop": "--spectrum-blue-1100", + "light": { + "value": "rgb(29, 62, 207)" + }, + "dark": { + "value": "rgb(124, 169, 252)" + } + }, + "blue-1200": { + "prop": "--spectrum-blue-1200", + "light": { + "value": "rgb(21, 50, 173)" + }, + "dark": { + "value": "rgb(152, 192, 252)" + } + }, + "blue-1300": { + "prop": "--spectrum-blue-1300", + "light": { + "value": "rgb(16, 40, 140)" + }, + "dark": { + "value": "rgb(181, 213, 253)" + } + }, + "blue-1400": { + "prop": "--spectrum-blue-1400", + "light": { + "value": "rgb(12, 31, 105)" + }, + "dark": { + "value": "rgb(213, 231, 254)" + } + }, + "blue-1500": { + "prop": "--spectrum-blue-1500", + "dark": { + "value": "rgb(238, 245, 255)" + }, + "light": { + "value": "rgb(14, 24, 67)" + } + }, + "blue-1600": { + "prop": "--spectrum-blue-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(7, 11, 30)" + } + }, + "blue-200": { + "prop": "--spectrum-blue-200", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(15, 28, 82)" + } + }, + "blue-300": { + "prop": "--spectrum-blue-300", + "light": { + "value": "rgb(203, 226, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "blue-400": { + "prop": "--spectrum-blue-400", + "light": { + "value": "rgb(172, 207, 253)" + }, + "dark": { + "value": "rgb(18, 45, 154)" + } + }, + "blue-500": { + "prop": "--spectrum-blue-500", + "light": { + "value": "rgb(142, 185, 252)" + }, + "dark": { + "value": "rgb(26, 58, 195)" + } + }, + "blue-600": { + "prop": "--spectrum-blue-600", + "light": { + "value": "rgb(114, 158, 253)" + }, + "dark": { + "value": "rgb(37, 73, 229)" + } + }, + "blue-700": { + "prop": "--spectrum-blue-700", + "light": { + "value": "rgb(93, 137, 255)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "blue-800": { + "prop": "--spectrum-blue-800", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "blue-900": { + "prop": "--spectrum-blue-900", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "blue-background-color-default": { + "prop": "--spectrum-blue-background-color-default", + "ref": "var(--spectrum-blue-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "blue-subtle-background-color-default": { + "prop": "--spectrum-blue-subtle-background-color-default", + "ref": "var(--spectrum-blue-300)", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "blue-visual-color": { + "prop": "--spectrum-blue-visual-color", + "ref": "var(--spectrum-blue-900)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "body-cjk-emphasized-font-style": { + "prop": "--spectrum-body-cjk-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-cjk-emphasized-font-weight": { + "prop": "--spectrum-body-cjk-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "body-cjk-font-family": { + "prop": "--spectrum-body-cjk-font-family", + "ref": "var(--spectrum-cjk-font-family)", + "value": "Adobe Clean Han" + }, + "body-cjk-font-style": { + "prop": "--spectrum-body-cjk-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-cjk-font-weight": { + "prop": "--spectrum-body-cjk-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "body-cjk-line-height": { + "prop": "--spectrum-body-cjk-line-height", + "ref": "var(--spectrum-cjk-line-height-200)", + "value": 1.7 + }, + "body-cjk-size-l": { + "prop": "--spectrum-body-cjk-size-l", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "body-cjk-size-m": { + "prop": "--spectrum-body-cjk-size-m", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "body-cjk-size-s": { + "prop": "--spectrum-body-cjk-size-s", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "body-cjk-size-xl": { + "prop": "--spectrum-body-cjk-size-xl", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "body-cjk-size-xs": { + "prop": "--spectrum-body-cjk-size-xs", + "ref": "var(--spectrum-font-size-50)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "body-cjk-size-xxl": { + "prop": "--spectrum-body-cjk-size-xxl", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "body-cjk-size-xxs": { + "prop": "--spectrum-body-cjk-size-xxs", + "ref": "var(--spectrum-font-size-25)", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "body-cjk-size-xxxl": { + "prop": "--spectrum-body-cjk-size-xxxl", + "ref": "var(--spectrum-font-size-500)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "27px" + } + }, + "body-cjk-strong-emphasized-font-style": { + "prop": "--spectrum-body-cjk-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-cjk-strong-emphasized-font-weight": { + "prop": "--spectrum-body-cjk-strong-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "body-cjk-strong-font-style": { + "prop": "--spectrum-body-cjk-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-cjk-strong-font-weight": { + "prop": "--spectrum-body-cjk-strong-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "body-color": { + "prop": "--spectrum-body-color", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "body-line-height": { + "prop": "--spectrum-body-line-height", + "ref": "var(--spectrum-line-height-200)", + "value": 1.5 + }, + "body-margin-multiplier": { + "prop": "--spectrum-body-margin-multiplier", + "value": 0.75 + }, + "body-sans-serif-emphasized-font-style": { + "prop": "--spectrum-body-sans-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "body-sans-serif-emphasized-font-weight": { + "prop": "--spectrum-body-sans-serif-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "body-sans-serif-font-family": { + "prop": "--spectrum-body-sans-serif-font-family", + "ref": "var(--spectrum-sans-serif-font-family)", + "value": "Adobe Clean" + }, + "body-sans-serif-font-style": { + "prop": "--spectrum-body-sans-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-sans-serif-font-weight": { + "prop": "--spectrum-body-sans-serif-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "body-sans-serif-strong-emphasized-font-style": { + "prop": "--spectrum-body-sans-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "body-sans-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-body-sans-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "body-sans-serif-strong-font-style": { + "prop": "--spectrum-body-sans-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-sans-serif-strong-font-weight": { + "prop": "--spectrum-body-sans-serif-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "body-serif-emphasized-font-style": { + "prop": "--spectrum-body-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "body-serif-emphasized-font-weight": { + "prop": "--spectrum-body-serif-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "body-serif-font-family": { + "prop": "--spectrum-body-serif-font-family", + "ref": "var(--spectrum-serif-font-family)", + "value": "Adobe Clean Serif" + }, + "body-serif-font-style": { + "prop": "--spectrum-body-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-serif-font-weight": { + "prop": "--spectrum-body-serif-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "body-serif-strong-emphasized-font-style": { + "prop": "--spectrum-body-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "body-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-body-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "body-serif-strong-font-style": { + "prop": "--spectrum-body-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "body-serif-strong-font-weight": { + "prop": "--spectrum-body-serif-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "body-size-l": { + "prop": "--spectrum-body-size-l", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "body-size-m": { + "prop": "--spectrum-body-size-m", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "body-size-s": { + "prop": "--spectrum-body-size-s", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "body-size-xl": { + "prop": "--spectrum-body-size-xl", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "body-size-xs": { + "prop": "--spectrum-body-size-xs", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "body-size-xxl": { + "prop": "--spectrum-body-size-xxl", + "ref": "var(--spectrum-font-size-500)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "27px" + } + }, + "body-size-xxs": { + "prop": "--spectrum-body-size-xxs", + "ref": "var(--spectrum-font-size-50)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "body-size-xxxl": { + "prop": "--spectrum-body-size-xxxl", + "ref": "var(--spectrum-font-size-600)", + "desktop": { + "value": "25px" + }, + "mobile": { + "value": "31px" + } + }, + "bold-font-weight": { + "prop": "--spectrum-bold-font-weight", + "ref": "bold", + "value": "700" + }, + "border-width-100": { + "prop": "--spectrum-border-width-100", + "value": "1px" + }, + "border-width-200": { + "prop": "--spectrum-border-width-200", + "value": "2px" + }, + "border-width-400": { + "prop": "--spectrum-border-width-400", + "value": "4px" + }, + "breadcrumbs-bottom-to-text": { + "prop": "--spectrum-breadcrumbs-bottom-to-text", + "ref": "var(--spectrum-component-bottom-to-text-200)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "breadcrumbs-bottom-to-text-compact": { + "prop": "--spectrum-breadcrumbs-bottom-to-text-compact", + "ref": "var(--spectrum-component-bottom-to-text-100)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "breadcrumbs-bottom-to-text-multiline": { + "prop": "--spectrum-breadcrumbs-bottom-to-text-multiline", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "breadcrumbs-end-edge-to-text": { + "prop": "--spectrum-breadcrumbs-end-edge-to-text", + "value": "0px" + }, + "breadcrumbs-height": { + "prop": "--spectrum-breadcrumbs-height", + "ref": "var(--spectrum-component-height-200)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "breadcrumbs-height-compact": { + "prop": "--spectrum-breadcrumbs-height-compact", + "ref": "var(--spectrum-component-height-100)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "breadcrumbs-height-multiline": { + "prop": "--spectrum-breadcrumbs-height-multiline", + "desktop": { + "value": "72px" + }, + "mobile": { + "value": "90px" + } + }, + "breadcrumbs-separator-icon-to-bottom-text-multiline": { + "prop": "--spectrum-breadcrumbs-separator-icon-to-bottom-text-multiline", + "ref": "var(--spectrum-breadcrumbs-separator-to-bottom-text-multiline)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "breadcrumbs-separator-to-bottom-text-multiline": { + "prop": "--spectrum-breadcrumbs-separator-to-bottom-text-multiline", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "breadcrumbs-start-edge-to-text": { + "prop": "--spectrum-breadcrumbs-start-edge-to-text", + "ref": "var(--spectrum-breadcrumbs-start-edge-to-text-large)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "breadcrumbs-start-edge-to-text-large": { + "prop": "--spectrum-breadcrumbs-start-edge-to-text-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "breadcrumbs-start-edge-to-text-medium": { + "prop": "--spectrum-breadcrumbs-start-edge-to-text-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "breadcrumbs-start-edge-to-text-multiline": { + "prop": "--spectrum-breadcrumbs-start-edge-to-text-multiline", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "breadcrumbs-start-edge-to-truncated-menu": { + "prop": "--spectrum-breadcrumbs-start-edge-to-truncated-menu", + "value": "0px" + }, + "breadcrumbs-text-to-separator-large": { + "prop": "--spectrum-breadcrumbs-text-to-separator-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "breadcrumbs-text-to-separator-medium": { + "prop": "--spectrum-breadcrumbs-text-to-separator-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "breadcrumbs-text-to-separator-multiline": { + "prop": "--spectrum-breadcrumbs-text-to-separator-multiline", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "breadcrumbs-top-text-to-bottom-text": { + "prop": "--spectrum-breadcrumbs-top-text-to-bottom-text", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "breadcrumbs-top-to-separator-icon": { + "prop": "--spectrum-breadcrumbs-top-to-separator-icon", + "ref": "var(--spectrum-breadcrumbs-top-to-separator-large)", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "20px" + } + }, + "breadcrumbs-top-to-separator-icon-compact": { + "prop": "--spectrum-breadcrumbs-top-to-separator-icon-compact", + "ref": "var(--spectrum-breadcrumbs-top-to-separator-medium)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "breadcrumbs-top-to-separator-icon-multiline": { + "prop": "--spectrum-breadcrumbs-top-to-separator-icon-multiline", + "ref": "var(--spectrum-breadcrumbs-separator-icon-to-bottom-text-multiline)", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "15px" + } + }, + "breadcrumbs-top-to-separator-large": { + "prop": "--spectrum-breadcrumbs-top-to-separator-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "20px" + } + }, + "breadcrumbs-top-to-separator-medium": { + "prop": "--spectrum-breadcrumbs-top-to-separator-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "breadcrumbs-top-to-separator-multiline": { + "prop": "--spectrum-breadcrumbs-top-to-separator-multiline", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "10px" + } + }, + "breadcrumbs-top-to-text": { + "prop": "--spectrum-breadcrumbs-top-to-text", + "ref": "var(--spectrum-component-top-to-text-200)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "breadcrumbs-top-to-text-compact": { + "prop": "--spectrum-breadcrumbs-top-to-text-compact", + "ref": "var(--spectrum-component-top-to-text-100)", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "breadcrumbs-top-to-text-multiline": { + "prop": "--spectrum-breadcrumbs-top-to-text-multiline", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "breadcrumbs-top-to-truncated-menu": { + "prop": "--spectrum-breadcrumbs-top-to-truncated-menu", + "value": "0px" + }, + "breadcrumbs-top-to-truncated-menu-compact": { + "prop": "--spectrum-breadcrumbs-top-to-truncated-menu-compact", + "ref": "var(--spectrum-breadcrumbs-top-to-truncated-menu)", + "value": "0px" + }, + "breadcrumbs-truncated-menu-to-bottom-text": { + "prop": "--spectrum-breadcrumbs-truncated-menu-to-bottom-text", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "breadcrumbs-truncated-menu-to-separator": { + "prop": "--spectrum-breadcrumbs-truncated-menu-to-separator", + "value": "0px" + }, + "breadcrumbs-truncated-menu-to-separator-icon": { + "prop": "--spectrum-breadcrumbs-truncated-menu-to-separator-icon", + "ref": "var(--spectrum-breadcrumbs-truncated-menu-to-separator)", + "value": "0px" + }, + "brown-100": { + "prop": "--spectrum-brown-100", + "dark": { + "value": "rgb(35, 24, 8)" + }, + "light": { + "value": "rgb(252, 247, 242)" + } + }, + "brown-1000": { + "prop": "--spectrum-brown-1000", + "dark": { + "value": "rgb(181, 147, 98)" + }, + "light": { + "value": "rgb(119, 91, 50)" + } + }, + "brown-1100": { + "prop": "--spectrum-brown-1100", + "dark": { + "value": "rgb(199, 163, 112)" + }, + "light": { + "value": "rgb(103, 76, 35)" + } + }, + "brown-1200": { + "prop": "--spectrum-brown-1200", + "dark": { + "value": "rgb(222, 185, 130)" + }, + "light": { + "value": "rgb(88, 61, 21)" + } + }, + "brown-1300": { + "prop": "--spectrum-brown-1300", + "dark": { + "value": "rgb(232, 207, 169)" + }, + "light": { + "value": "rgb(70, 49, 17)" + } + }, + "brown-1400": { + "prop": "--spectrum-brown-1400", + "dark": { + "value": "rgb(242, 227, 206)" + }, + "light": { + "value": "rgb(52, 37, 13)" + } + }, + "brown-1500": { + "prop": "--spectrum-brown-1500", + "dark": { + "value": "rgb(250, 244, 236)" + }, + "light": { + "value": "rgb(38, 26, 9)" + } + }, + "brown-1600": { + "prop": "--spectrum-brown-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(16, 12, 4)" + } + }, + "brown-200": { + "prop": "--spectrum-brown-200", + "dark": { + "value": "rgb(44, 31, 11)" + }, + "light": { + "value": "rgb(247, 238, 225)" + } + }, + "brown-300": { + "prop": "--spectrum-brown-300", + "dark": { + "value": "rgb(58, 40, 14)" + }, + "light": { + "value": "rgb(239, 221, 195)" + } + }, + "brown-400": { + "prop": "--spectrum-brown-400", + "dark": { + "value": "rgb(78, 55, 19)" + }, + "light": { + "value": "rgb(229, 200, 157)" + } + }, + "brown-500": { + "prop": "--spectrum-brown-500", + "dark": { + "value": "rgb(98, 71, 30)" + }, + "light": { + "value": "rgb(214, 177, 123)" + } + }, + "brown-600": { + "prop": "--spectrum-brown-600", + "dark": { + "value": "rgb(115, 88, 47)" + }, + "light": { + "value": "rgb(190, 155, 104)" + } + }, + "brown-700": { + "prop": "--spectrum-brown-700", + "dark": { + "value": "rgb(132, 104, 61)" + }, + "light": { + "value": "rgb(171, 138, 90)" + } + }, + "brown-800": { + "prop": "--spectrum-brown-800", + "dark": { + "value": "rgb(143, 114, 69)" + }, + "light": { + "value": "rgb(154, 123, 77)" + } + }, + "brown-900": { + "prop": "--spectrum-brown-900", + "dark": { + "value": "rgb(163, 132, 84)" + }, + "light": { + "value": "rgb(139, 109, 66)" + } + }, + "brown-background-color-default": { + "prop": "--spectrum-brown-background-color-default", + "ref": "var(--spectrum-brown-800)", + "light": { + "value": "rgb(139, 109, 66)" + }, + "dark": { + "value": "rgb(143, 114, 69)" + } + }, + "brown-subtle-background-color-default": { + "prop": "--spectrum-brown-subtle-background-color-default", + "ref": "var(--spectrum-brown-300)", + "light": { + "value": "rgb(247, 238, 225)" + }, + "dark": { + "value": "rgb(58, 40, 14)" + } + }, + "brown-visual-color": { + "prop": "--spectrum-brown-visual-color", + "ref": "var(--spectrum-brown-900)", + "light": { + "value": "rgb(154, 123, 77)" + }, + "dark": { + "value": "rgb(163, 132, 84)" + } + }, + "button-bottom-to-text-extra-large": { + "prop": "--spectrum-button-bottom-to-text-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "17px" + } + }, + "button-bottom-to-text-large": { + "prop": "--spectrum-button-bottom-to-text-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "button-bottom-to-text-medium": { + "prop": "--spectrum-button-bottom-to-text-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "button-bottom-to-text-small": { + "prop": "--spectrum-button-bottom-to-text-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "button-minimum-width-multiplier": { + "prop": "--spectrum-button-minimum-width-multiplier", + "value": 2.25 + }, + "button-top-to-text-extra-large": { + "prop": "--spectrum-button-top-to-text-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "16px" + } + }, + "button-top-to-text-large": { + "prop": "--spectrum-button-top-to-text-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "button-top-to-text-medium": { + "prop": "--spectrum-button-top-to-text-medium", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "button-top-to-text-small": { + "prop": "--spectrum-button-top-to-text-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "calendar-day-background-color-cap-selected": { + "prop": "--spectrum-calendar-day-background-color-cap-selected", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + }, + "calendar-day-background-color-down": { + "prop": "--spectrum-calendar-day-background-color-down", + "dark": { + "ref": "var(--spectrum-transparent-white-200)", + "value": "rgba(255, 255, 255, 0.14)" + }, + "light": { + "ref": "var(--spectrum-transparent-black-200)", + "value": "rgba(0, 0, 0, 0.12)" + } + }, + "calendar-day-background-color-hover": { + "prop": "--spectrum-calendar-day-background-color-hover", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-white) 7%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-black) 6%, transparent)" + } + }, + "calendar-day-background-color-key-focus": { + "prop": "--spectrum-calendar-day-background-color-key-focus", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-white) 7%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-black) 6%, transparent)" + } + }, + "calendar-day-background-color-selected": { + "prop": "--spectrum-calendar-day-background-color-selected", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 15%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 10%, transparent)" + } + }, + "calendar-day-background-color-selected-hover": { + "prop": "--spectrum-calendar-day-background-color-selected-hover", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + }, + "calendar-day-border-color-key-focus": { + "prop": "--spectrum-calendar-day-border-color-key-focus", + "ref": "var(--spectrum-blue-800)", + "dark": { + "value": "rgb(52, 91, 248)" + }, + "light": { + "value": "rgb(75, 117, 255)" + } + }, + "calendar-day-today-background-color-selected-hover": { + "prop": "--spectrum-calendar-day-today-background-color-selected-hover", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 25%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 20%, transparent)" + } + }, + "card-background-loading-color": { + "prop": "--spectrum-card-background-loading-color", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "card-background-well-color": { + "prop": "--spectrum-card-background-well-color", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "card-default-width-extra-large": { + "prop": "--spectrum-card-default-width-extra-large", + "value": "400px" + }, + "card-default-width-extra-small": { + "prop": "--spectrum-card-default-width-extra-small", + "value": "120px" + }, + "card-default-width-large": { + "prop": "--spectrum-card-default-width-large", + "value": "320px" + }, + "card-default-width-medium": { + "prop": "--spectrum-card-default-width-medium", + "value": "240px" + }, + "card-default-width-small": { + "prop": "--spectrum-card-default-width-small", + "value": "180px" + }, + "card-description-to-footer": { + "prop": "--spectrum-card-description-to-footer", + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + }, + "card-edge-to-content-compact-extra-large": { + "prop": "--spectrum-card-edge-to-content-compact-extra-large", + "value": "20px" + }, + "card-edge-to-content-compact-extra-small": { + "prop": "--spectrum-card-edge-to-content-compact-extra-small", + "value": "6px" + }, + "card-edge-to-content-compact-large": { + "prop": "--spectrum-card-edge-to-content-compact-large", + "value": "16px" + }, + "card-edge-to-content-compact-medium": { + "prop": "--spectrum-card-edge-to-content-compact-medium", + "value": "12px" + }, + "card-edge-to-content-compact-small": { + "prop": "--spectrum-card-edge-to-content-compact-small", + "value": "8px" + }, + "card-edge-to-content-default-extra-large": { + "prop": "--spectrum-card-edge-to-content-default-extra-large", + "value": "24px" + }, + "card-edge-to-content-default-extra-small": { + "prop": "--spectrum-card-edge-to-content-default-extra-small", + "value": "8px" + }, + "card-edge-to-content-default-large": { + "prop": "--spectrum-card-edge-to-content-default-large", + "value": "20px" + }, + "card-edge-to-content-default-medium": { + "prop": "--spectrum-card-edge-to-content-default-medium", + "value": "16px" + }, + "card-edge-to-content-default-small": { + "prop": "--spectrum-card-edge-to-content-default-small", + "value": "12px" + }, + "card-edge-to-content-spacious-extra-large": { + "prop": "--spectrum-card-edge-to-content-spacious-extra-large", + "value": "28px" + }, + "card-edge-to-content-spacious-extra-small": { + "prop": "--spectrum-card-edge-to-content-spacious-extra-small", + "value": "12px" + }, + "card-edge-to-content-spacious-large": { + "prop": "--spectrum-card-edge-to-content-spacious-large", + "value": "24px" + }, + "card-edge-to-content-spacious-medium": { + "prop": "--spectrum-card-edge-to-content-spacious-medium", + "value": "20px" + }, + "card-edge-to-content-spacious-small": { + "prop": "--spectrum-card-edge-to-content-spacious-small", + "value": "16px" + }, + "card-header-to-description": { + "prop": "--spectrum-card-header-to-description", + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "card-horizontal-edge-to-content-compact": { + "prop": "--spectrum-card-horizontal-edge-to-content-compact", + "value": "12px" + }, + "card-horizontal-edge-to-content-default": { + "prop": "--spectrum-card-horizontal-edge-to-content-default", + "value": "16px" + }, + "card-horizontal-edge-to-content-spacious": { + "prop": "--spectrum-card-horizontal-edge-to-content-spacious", + "value": "20px" + }, + "card-maximum-width-extra-large": { + "prop": "--spectrum-card-maximum-width-extra-large", + "value": "460px" + }, + "card-maximum-width-extra-small": { + "prop": "--spectrum-card-maximum-width-extra-small", + "value": "140px" + }, + "card-maximum-width-large": { + "prop": "--spectrum-card-maximum-width-large", + "value": "370px" + }, + "card-maximum-width-medium": { + "prop": "--spectrum-card-maximum-width-medium", + "value": "280px" + }, + "card-maximum-width-small": { + "prop": "--spectrum-card-maximum-width-small", + "value": "210px" + }, + "card-minimum-height-extra-large": { + "prop": "--spectrum-card-minimum-height-extra-large", + "value": "300px" + }, + "card-minimum-height-extra-small": { + "prop": "--spectrum-card-minimum-height-extra-small", + "value": "90px" + }, + "card-minimum-height-large": { + "prop": "--spectrum-card-minimum-height-large", + "value": "240px" + }, + "card-minimum-height-medium": { + "prop": "--spectrum-card-minimum-height-medium", + "value": "180px" + }, + "card-minimum-height-small": { + "prop": "--spectrum-card-minimum-height-small", + "value": "135px" + }, + "card-minimum-width": { + "prop": "--spectrum-card-minimum-width", + "value": "100px" + }, + "card-minimum-width-extra-large": { + "prop": "--spectrum-card-minimum-width-extra-large", + "value": "340px" + }, + "card-minimum-width-extra-small": { + "prop": "--spectrum-card-minimum-width-extra-small", + "value": "100px" + }, + "card-minimum-width-large": { + "prop": "--spectrum-card-minimum-width-large", + "value": "270px" + }, + "card-minimum-width-medium": { + "prop": "--spectrum-card-minimum-width-medium", + "value": "200px" + }, + "card-minimum-width-small": { + "prop": "--spectrum-card-minimum-width-small", + "value": "150px" + }, + "card-preview-minimum-height": { + "prop": "--spectrum-card-preview-minimum-height", + "value": "130px" + }, + "card-selected-background-color": { + "prop": "--spectrum-card-selected-background-color", + "ref": "var(--spectrum-blue-900)", + "dark": { + "value": "rgb(26, 58, 195)" + }, + "light": { + "value": "rgb(59, 99, 251)" + } + }, + "card-selection-background-color": { + "prop": "--spectrum-card-selection-background-color", + "light": { + "ref": "var(--spectrum-transparent-white-600)", + "value": "rgba(255, 255, 255, 0.51)" + }, + "dark": { + "ref": "var(--spectrum-transparent-black-600)", + "value": "rgba(0, 0, 0, 0.56)" + } + }, + "card-selection-background-color-opacity": { + "prop": "--spectrum-card-selection-background-color-opacity", + "ref": "0.95", + "value": "95%" + }, + "card-selection-background-size": { + "prop": "--spectrum-card-selection-background-size", + "value": "40px" + }, + "card-selection-background-size-extra-large": { + "prop": "--spectrum-card-selection-background-size-extra-large", + "value": "28px" + }, + "card-selection-background-size-large": { + "prop": "--spectrum-card-selection-background-size-large", + "value": "26px" + }, + "card-selection-background-size-medium": { + "prop": "--spectrum-card-selection-background-size-medium", + "value": "24px" + }, + "card-selection-background-size-small": { + "prop": "--spectrum-card-selection-background-size-small", + "value": "22px" + }, + "celery-100": { + "prop": "--spectrum-celery-100", + "light": { + "value": "rgb(235, 255, 220)" + }, + "dark": { + "value": "rgb(11, 31, 0)" + } + }, + "celery-1000": { + "prop": "--spectrum-celery-1000", + "light": { + "value": "rgb(52, 109, 12)" + }, + "dark": { + "value": "rgb(88, 172, 28)" + } + }, + "celery-1100": { + "prop": "--spectrum-celery-1100", + "light": { + "value": "rgb(44, 92, 9)" + }, + "dark": { + "value": "rgb(100, 190, 35)" + } + }, + "celery-1200": { + "prop": "--spectrum-celery-1200", + "light": { + "value": "rgb(35, 75, 6)" + }, + "dark": { + "value": "rgb(116, 213, 46)" + } + }, + "celery-1300": { + "prop": "--spectrum-celery-1300", + "light": { + "value": "rgb(27, 60, 3)" + }, + "dark": { + "value": "rgb(136, 234, 65)" + } + }, + "celery-1400": { + "prop": "--spectrum-celery-1400", + "light": { + "value": "rgb(19, 46, 0)" + }, + "dark": { + "value": "rgb(170, 251, 112)" + } + }, + "celery-1500": { + "prop": "--spectrum-celery-1500", + "dark": { + "value": "rgb(222, 255, 198)" + }, + "light": { + "value": "rgb(12, 33, 0)" + } + }, + "celery-1600": { + "prop": "--spectrum-celery-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(4, 15, 0)" + } + }, + "celery-200": { + "prop": "--spectrum-celery-200", + "light": { + "value": "rgb(197, 255, 156)" + }, + "dark": { + "value": "rgb(15, 38, 0)" + } + }, + "celery-300": { + "prop": "--spectrum-celery-300", + "light": { + "value": "rgb(157, 247, 92)" + }, + "dark": { + "value": "rgb(21, 51, 1)" + } + }, + "celery-400": { + "prop": "--spectrum-celery-400", + "light": { + "value": "rgb(129, 228, 58)" + }, + "dark": { + "value": "rgb(31, 67, 4)" + } + }, + "celery-500": { + "prop": "--spectrum-celery-500", + "light": { + "value": "rgb(110, 206, 42)" + }, + "dark": { + "value": "rgb(41, 86, 8)" + } + }, + "celery-600": { + "prop": "--spectrum-celery-600", + "light": { + "value": "rgb(93, 180, 31)" + }, + "dark": { + "value": "rgb(50, 105, 11)" + } + }, + "celery-700": { + "prop": "--spectrum-celery-700", + "light": { + "value": "rgb(82, 161, 25)" + }, + "dark": { + "value": "rgb(60, 122, 15)" + } + }, + "celery-800": { + "prop": "--spectrum-celery-800", + "light": { + "value": "rgb(72, 144, 20)" + }, + "dark": { + "value": "rgb(66, 134, 18)" + } + }, + "celery-900": { + "prop": "--spectrum-celery-900", + "light": { + "value": "rgb(64, 129, 17)" + }, + "dark": { + "value": "rgb(78, 154, 23)" + } + }, + "celery-background-color-default": { + "prop": "--spectrum-celery-background-color-default", + "ref": "var(--spectrum-celery-900)", + "light": { + "value": "rgb(93, 180, 31)" + }, + "dark": { + "value": "rgb(78, 154, 23)" + } + }, + "celery-subtle-background-color-default": { + "prop": "--spectrum-celery-subtle-background-color-default", + "ref": "var(--spectrum-celery-300)", + "light": { + "value": "rgb(197, 255, 156)" + }, + "dark": { + "value": "rgb(21, 51, 1)" + } + }, + "celery-visual-color": { + "prop": "--spectrum-celery-visual-color", + "ref": "var(--spectrum-celery-800)", + "light": { + "value": "rgb(82, 161, 25)" + }, + "dark": { + "value": "rgb(66, 134, 18)" + } + }, + "character-count-to-field-quiet-extra-large": { + "prop": "--spectrum-character-count-to-field-quiet-extra-large", + "desktop": { + "value": "-4px" + }, + "mobile": { + "value": "-5px" + } + }, + "character-count-to-field-quiet-large": { + "prop": "--spectrum-character-count-to-field-quiet-large", + "desktop": { + "value": "-3px" + }, + "mobile": { + "value": "-4px" + } + }, + "character-count-to-field-quiet-medium": { + "prop": "--spectrum-character-count-to-field-quiet-medium", + "desktop": { + "value": "-3px" + }, + "mobile": { + "value": "-4px" + } + }, + "character-count-to-field-quiet-small": { + "prop": "--spectrum-character-count-to-field-quiet-small", + "desktop": { + "value": "-3px" + }, + "mobile": { + "value": "-4px" + } + }, + "chartreuse-100": { + "prop": "--spectrum-chartreuse-100", + "light": { + "value": "rgb(246, 251, 222)" + }, + "dark": { + "value": "rgb(23, 28, 0)" + } + }, + "chartreuse-1000": { + "prop": "--spectrum-chartreuse-1000", + "light": { + "value": "rgb(86, 103, 0)" + }, + "dark": { + "value": "rgb(136, 164, 0)" + } + }, + "chartreuse-1100": { + "prop": "--spectrum-chartreuse-1100", + "light": { + "value": "rgb(73, 87, 0)" + }, + "dark": { + "value": "rgb(151, 181, 0)" + } + }, + "chartreuse-1200": { + "prop": "--spectrum-chartreuse-1200", + "light": { + "value": "rgb(60, 71, 0)" + }, + "dark": { + "value": "rgb(169, 203, 0)" + } + }, + "chartreuse-1300": { + "prop": "--spectrum-chartreuse-1300", + "light": { + "value": "rgb(47, 57, 0)" + }, + "dark": { + "value": "rgb(187, 225, 0)" + } + }, + "chartreuse-1400": { + "prop": "--spectrum-chartreuse-1400", + "light": { + "value": "rgb(35, 43, 0)" + }, + "dark": { + "value": "rgb(219, 240, 117)" + } + }, + "chartreuse-1500": { + "prop": "--spectrum-chartreuse-1500", + "dark": { + "value": "rgb(242, 249, 206)" + }, + "light": { + "value": "rgb(25, 30, 0)" + } + }, + "chartreuse-1600": { + "prop": "--spectrum-chartreuse-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(11, 14, 0)" + } + }, + "chartreuse-200": { + "prop": "--spectrum-chartreuse-200", + "light": { + "value": "rgb(234, 246, 173)" + }, + "dark": { + "value": "rgb(30, 36, 0)" + } + }, + "chartreuse-300": { + "prop": "--spectrum-chartreuse-300", + "light": { + "value": "rgb(208, 236, 70)" + }, + "dark": { + "value": "rgb(39, 47, 0)" + } + }, + "chartreuse-400": { + "prop": "--spectrum-chartreuse-400", + "light": { + "value": "rgb(182, 219, 0)" + }, + "dark": { + "value": "rgb(53, 63, 0)" + } + }, + "chartreuse-500": { + "prop": "--spectrum-chartreuse-500", + "light": { + "value": "rgb(163, 196, 0)" + }, + "dark": { + "value": "rgb(68, 82, 0)" + } + }, + "chartreuse-600": { + "prop": "--spectrum-chartreuse-600", + "light": { + "value": "rgb(143, 172, 0)" + }, + "dark": { + "value": "rgb(83, 100, 0)" + } + }, + "chartreuse-700": { + "prop": "--spectrum-chartreuse-700", + "light": { + "value": "rgb(128, 153, 0)" + }, + "dark": { + "value": "rgb(97, 116, 0)" + } + }, + "chartreuse-800": { + "prop": "--spectrum-chartreuse-800", + "light": { + "value": "rgb(114, 137, 0)" + }, + "dark": { + "value": "rgb(106, 127, 0)" + } + }, + "chartreuse-900": { + "prop": "--spectrum-chartreuse-900", + "light": { + "value": "rgb(102, 122, 0)" + }, + "dark": { + "value": "rgb(122, 147, 0)" + } + }, + "chartreuse-background-color-default": { + "prop": "--spectrum-chartreuse-background-color-default", + "ref": "var(--spectrum-chartreuse-1000)", + "light": { + "value": "rgb(163, 196, 0)" + }, + "dark": { + "value": "rgb(136, 164, 0)" + } + }, + "chartreuse-subtle-background-color-default": { + "prop": "--spectrum-chartreuse-subtle-background-color-default", + "ref": "var(--spectrum-chartreuse-300)", + "light": { + "value": "rgb(234, 246, 173)" + }, + "dark": { + "value": "rgb(39, 47, 0)" + } + }, + "chartreuse-visual-color": { + "prop": "--spectrum-chartreuse-visual-color", + "ref": "var(--spectrum-chartreuse-900)", + "light": { + "value": "rgb(143, 172, 0)" + }, + "dark": { + "value": "rgb(122, 147, 0)" + } + }, + "checkbox-control-size-extra-large": { + "prop": "--spectrum-checkbox-control-size-extra-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "26px" + } + }, + "checkbox-control-size-large": { + "prop": "--spectrum-checkbox-control-size-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "checkbox-control-size-medium": { + "prop": "--spectrum-checkbox-control-size-medium", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "checkbox-control-size-small": { + "prop": "--spectrum-checkbox-control-size-small", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "checkbox-top-to-control-extra-large": { + "prop": "--spectrum-checkbox-top-to-control-extra-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "checkbox-top-to-control-large": { + "prop": "--spectrum-checkbox-top-to-control-large", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "checkbox-top-to-control-medium": { + "prop": "--spectrum-checkbox-top-to-control-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "checkbox-top-to-control-small": { + "prop": "--spectrum-checkbox-top-to-control-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "checkmark-icon-size-100": { + "prop": "--spectrum-checkmark-icon-size-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "checkmark-icon-size-200": { + "prop": "--spectrum-checkmark-icon-size-200", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "checkmark-icon-size-300": { + "prop": "--spectrum-checkmark-icon-size-300", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "checkmark-icon-size-400": { + "prop": "--spectrum-checkmark-icon-size-400", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "checkmark-icon-size-50": { + "prop": "--spectrum-checkmark-icon-size-50", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "checkmark-icon-size-500": { + "prop": "--spectrum-checkmark-icon-size-500", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "checkmark-icon-size-600": { + "prop": "--spectrum-checkmark-icon-size-600", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "24px" + } + }, + "checkmark-icon-size-75": { + "prop": "--spectrum-checkmark-icon-size-75", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "chevron-icon-size-100": { + "prop": "--spectrum-chevron-icon-size-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "chevron-icon-size-200": { + "prop": "--spectrum-chevron-icon-size-200", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "chevron-icon-size-300": { + "prop": "--spectrum-chevron-icon-size-300", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "chevron-icon-size-400": { + "prop": "--spectrum-chevron-icon-size-400", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "chevron-icon-size-50": { + "prop": "--spectrum-chevron-icon-size-50", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "chevron-icon-size-500": { + "prop": "--spectrum-chevron-icon-size-500", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "chevron-icon-size-600": { + "prop": "--spectrum-chevron-icon-size-600", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "24px" + } + }, + "chevron-icon-size-75": { + "prop": "--spectrum-chevron-icon-size-75", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "cinnamon-100": { + "prop": "--spectrum-cinnamon-100", + "dark": { + "value": "rgb(48, 17, 4)" + }, + "light": { + "value": "rgb(253, 247, 243)" + } + }, + "cinnamon-1000": { + "prop": "--spectrum-cinnamon-1000", + "dark": { + "value": "rgb(206, 136, 99)" + }, + "light": { + "value": "rgb(147, 77, 43)" + } + }, + "cinnamon-1100": { + "prop": "--spectrum-cinnamon-1100", + "dark": { + "value": "rgb(220, 154, 118)" + }, + "light": { + "value": "rgb(128, 62, 32)" + } + }, + "cinnamon-1200": { + "prop": "--spectrum-cinnamon-1200", + "dark": { + "value": "rgb(232, 179, 149)" + }, + "light": { + "value": "rgb(110, 48, 21)" + } + }, + "cinnamon-1300": { + "prop": "--spectrum-cinnamon-1300", + "dark": { + "value": "rgb(239, 203, 183)" + }, + "light": { + "value": "rgb(92, 35, 11)" + } + }, + "cinnamon-1400": { + "prop": "--spectrum-cinnamon-1400", + "dark": { + "value": "rgb(246, 225, 214)" + }, + "light": { + "value": "rgb(72, 25, 6)" + } + }, + "cinnamon-1500": { + "prop": "--spectrum-cinnamon-1500", + "dark": { + "value": "rgb(252, 244, 239)" + }, + "light": { + "value": "rgb(52, 18, 4)" + } + }, + "cinnamon-1600": { + "prop": "--spectrum-cinnamon-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(24, 8, 2)" + } + }, + "cinnamon-200": { + "prop": "--spectrum-cinnamon-200", + "dark": { + "value": "rgb(59, 21, 5)" + }, + "light": { + "value": "rgb(249, 236, 229)" + } + }, + "cinnamon-300": { + "prop": "--spectrum-cinnamon-300", + "dark": { + "value": "rgb(79, 28, 7)" + }, + "light": { + "value": "rgb(244, 218, 203)" + } + }, + "cinnamon-400": { + "prop": "--spectrum-cinnamon-400", + "dark": { + "value": "rgb(100, 41, 15)" + }, + "light": { + "value": "rgb(237, 196, 172)" + } + }, + "cinnamon-500": { + "prop": "--spectrum-cinnamon-500", + "dark": { + "value": "rgb(122, 57, 28)" + }, + "light": { + "value": "rgb(229, 170, 136)" + } + }, + "cinnamon-600": { + "prop": "--spectrum-cinnamon-600", + "dark": { + "value": "rgb(143, 74, 40)" + }, + "light": { + "value": "rgb(212, 145, 108)" + } + }, + "cinnamon-700": { + "prop": "--spectrum-cinnamon-700", + "dark": { + "value": "rgb(163, 88, 52)" + }, + "light": { + "value": "rgb(198, 126, 88)" + } + }, + "cinnamon-800": { + "prop": "--spectrum-cinnamon-800", + "dark": { + "value": "rgb(176, 98, 59)" + }, + "light": { + "value": "rgb(184, 109, 70)" + } + }, + "cinnamon-900": { + "prop": "--spectrum-cinnamon-900", + "dark": { + "value": "rgb(192, 119, 80)" + }, + "light": { + "value": "rgb(170, 94, 56)" + } + }, + "cinnamon-background-color-default": { + "prop": "--spectrum-cinnamon-background-color-default", + "ref": "var(--spectrum-cinnamon-800)", + "light": { + "value": "rgb(170, 94, 56)" + }, + "dark": { + "value": "rgb(176, 98, 59)" + } + }, + "cinnamon-subtle-background-color-default": { + "prop": "--spectrum-cinnamon-subtle-background-color-default", + "ref": "var(--spectrum-cinnamon-300)", + "light": { + "value": "rgb(249, 236, 229)" + }, + "dark": { + "value": "rgb(79, 28, 7)" + } + }, + "cinnamon-visual-color": { + "prop": "--spectrum-cinnamon-visual-color", + "ref": "var(--spectrum-cinnamon-900)", + "light": { + "value": "rgb(184, 109, 70)" + }, + "dark": { + "value": "rgb(192, 119, 80)" + } + }, + "cjk-font": { + "prop": "--spectrum-cjk-font", + "ref": "var(--spectrum-cjk-font-family-stack)", + "value": "adobe-clean-han-japanese, var(--spectrum-cjk-font-family), sans-serif" + }, + "cjk-font-family": { + "prop": "--spectrum-cjk-font-family", + "value": "Adobe Clean Han" + }, + "cjk-font-family-stack": { + "prop": "--spectrum-cjk-font-family-stack", + "value": "adobe-clean-han-japanese, var(--spectrum-cjk-font-family), sans-serif" + }, + "cjk-letter-spacing": { + "prop": "--spectrum-cjk-letter-spacing", + "ref": "var(--spectrum-letter-spacing)", + "value": "0em" + }, + "cjk-line-height-100": { + "prop": "--spectrum-cjk-line-height-100", + "value": 1.5 + }, + "cjk-line-height-200": { + "prop": "--spectrum-cjk-line-height-200", + "value": 1.7 + }, + "coach-indicator-collapsed-gap": { + "prop": "--spectrum-coach-indicator-collapsed-gap", + "value": "2px" + }, + "coach-indicator-collapsed-ring-rounding-increment": { + "prop": "--spectrum-coach-indicator-collapsed-ring-rounding-increment", + "value": "6px" + }, + "coach-indicator-collapsed-ring-thickness": { + "prop": "--spectrum-coach-indicator-collapsed-ring-thickness", + "value": "4px" + }, + "coach-indicator-color": { + "prop": "--spectrum-coach-indicator-color", + "ref": "var(--spectrum-blue-800)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "coach-indicator-expanded-gap": { + "prop": "--spectrum-coach-indicator-expanded-gap", + "value": "6px" + }, + "coach-indicator-expanded-ring-rounding-increment": { + "prop": "--spectrum-coach-indicator-expanded-ring-rounding-increment", + "value": "14px" + }, + "coach-indicator-expanded-ring-thickness": { + "prop": "--spectrum-coach-indicator-expanded-ring-thickness", + "value": "8px" + }, + "coach-indicator-gap": { + "prop": "--spectrum-coach-indicator-gap", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "coach-indicator-opacity": { + "prop": "--spectrum-coach-indicator-opacity", + "ref": "0.2", + "value": "20%" + }, + "coach-indicator-quiet-ring-diameter": { + "prop": "--spectrum-coach-indicator-quiet-ring-diameter", + "desktop": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "coach-indicator-ring-default-color": { + "prop": "--spectrum-coach-indicator-ring-default-color", + "ref": "var(--spectrum-blue-800)", + "dark": { + "value": "rgb(52, 91, 248)" + }, + "light": { + "value": "rgb(75, 117, 255)" + } + }, + "coach-indicator-ring-diameter": { + "prop": "--spectrum-coach-indicator-ring-diameter", + "desktop": { + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "coach-indicator-ring-static-white-color": { + "prop": "--spectrum-coach-indicator-ring-static-white-color", + "ref": "var(--spectrum-white)", + "value": "rgb(255, 255, 255)" + }, + "coach-mark-body-font-size": { + "prop": "--spectrum-coach-mark-body-font-size", + "ref": "var(--spectrum-body-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "coach-mark-body-size": { + "prop": "--spectrum-coach-mark-body-size", + "ref": "var(--spectrum-body-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "coach-mark-edge-to-content": { + "prop": "--spectrum-coach-mark-edge-to-content", + "desktop": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + } + }, + "coach-mark-maximum-width": { + "prop": "--spectrum-coach-mark-maximum-width", + "desktop": { + "value": "380px" + }, + "mobile": { + "value": "248px" + } + }, + "coach-mark-media-height": { + "prop": "--spectrum-coach-mark-media-height", + "desktop": { + "value": "222px" + }, + "mobile": { + "value": "162px" + } + }, + "coach-mark-media-minimum-height": { + "prop": "--spectrum-coach-mark-media-minimum-height", + "desktop": { + "value": "166px" + }, + "mobile": { + "value": "121px" + } + }, + "coach-mark-minimum-width": { + "prop": "--spectrum-coach-mark-minimum-width", + "desktop": { + "value": "296px" + }, + "mobile": { + "value": "216px" + } + }, + "coach-mark-pagination-body-font-size": { + "prop": "--spectrum-coach-mark-pagination-body-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "coach-mark-pagination-body-size": { + "prop": "--spectrum-coach-mark-pagination-body-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "coach-mark-pagination-color": { + "prop": "--spectrum-coach-mark-pagination-color", + "ref": "var(--spectrum-gray-600)", + "light": { + "value": "rgb(113, 113, 113)" + }, + "dark": { + "value": "rgb(138, 138, 138)" + } + }, + "coach-mark-pagination-text-to-bottom-edge": { + "prop": "--spectrum-coach-mark-pagination-text-to-bottom-edge", + "desktop": { + "value": "33px" + }, + "mobile": { + "value": "22px" + } + }, + "coach-mark-title-font-size": { + "prop": "--spectrum-coach-mark-title-font-size", + "ref": "var(--spectrum-title-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "coach-mark-title-size": { + "prop": "--spectrum-coach-mark-title-size", + "ref": "var(--spectrum-title-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "coach-mark-width": { + "prop": "--spectrum-coach-mark-width", + "desktop": { + "value": "296px" + }, + "mobile": { + "value": "216px" + } + }, + "coachmark-action-menu-vertical-offset": { + "prop": "--spectrum-coachmark-action-menu-vertical-offset", + "desktop": { + "value": "-4px" + }, + "mobile": { + "value": "-6px" + } + }, + "coachmark-buttongroup-display": { + "prop": "--spectrum-coachmark-buttongroup-display", + "desktop": { + "value": "flex" + }, + "mobile": { + "value": "none" + } + }, + "coachmark-buttongroup-mobile-display": { + "prop": "--spectrum-coachmark-buttongroup-mobile-display", + "desktop": { + "value": "none" + }, + "mobile": { + "value": "flex" + } + }, + "coachmark-menu-display": { + "prop": "--spectrum-coachmark-menu-display", + "desktop": { + "value": "inline-flex" + }, + "mobile": { + "value": "none" + } + }, + "coachmark-menu-mobile-display": { + "prop": "--spectrum-coachmark-menu-mobile-display", + "desktop": { + "value": "none" + }, + "mobile": { + "value": "inline-flex" + } + }, + "code-cjk-emphasized-font-style": { + "prop": "--spectrum-code-cjk-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "code-cjk-emphasized-font-weight": { + "prop": "--spectrum-code-cjk-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "code-cjk-font-family": { + "prop": "--spectrum-code-cjk-font-family", + "ref": "var(--spectrum-code-font-family)", + "value": "Source Code Pro" + }, + "code-cjk-font-style": { + "prop": "--spectrum-code-cjk-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "code-cjk-font-weight": { + "prop": "--spectrum-code-cjk-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "code-cjk-line-height": { + "prop": "--spectrum-code-cjk-line-height", + "ref": "var(--spectrum-cjk-line-height-200)", + "value": 1.7 + }, + "code-cjk-size-l": { + "prop": "--spectrum-code-cjk-size-l", + "ref": "var(--spectrum-code-size-l)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "code-cjk-size-m": { + "prop": "--spectrum-code-cjk-size-m", + "ref": "var(--spectrum-code-size-m)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "code-cjk-size-s": { + "prop": "--spectrum-code-cjk-size-s", + "ref": "var(--spectrum-code-size-s)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "code-cjk-size-xl": { + "prop": "--spectrum-code-cjk-size-xl", + "ref": "var(--spectrum-code-size-xl)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "code-cjk-size-xs": { + "prop": "--spectrum-code-cjk-size-xs", + "ref": "var(--spectrum-code-size-xs)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "code-cjk-strong-emphasized-font-style": { + "prop": "--spectrum-code-cjk-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "code-cjk-strong-emphasized-font-weight": { + "prop": "--spectrum-code-cjk-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "code-cjk-strong-font-style": { + "prop": "--spectrum-code-cjk-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "code-cjk-strong-font-weight": { + "prop": "--spectrum-code-cjk-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "code-color": { + "prop": "--spectrum-code-color", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "code-emphasized-font-style": { + "prop": "--spectrum-code-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "code-emphasized-font-weight": { + "prop": "--spectrum-code-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "code-font-family": { + "prop": "--spectrum-code-font-family", + "value": "Source Code Pro" + }, + "code-font-family-stack": { + "prop": "--spectrum-code-font-family-stack", + "value": "\"Source Code Pro\", Monaco, monospace" + }, + "code-font-style": { + "prop": "--spectrum-code-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "code-font-weight": { + "prop": "--spectrum-code-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "code-line-height": { + "prop": "--spectrum-code-line-height", + "ref": "var(--spectrum-line-height-200)", + "value": 1.5 + }, + "code-size-l": { + "prop": "--spectrum-code-size-l", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "code-size-m": { + "prop": "--spectrum-code-size-m", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "code-size-s": { + "prop": "--spectrum-code-size-s", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "code-size-xl": { + "prop": "--spectrum-code-size-xl", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "code-size-xs": { + "prop": "--spectrum-code-size-xs", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "code-strong-emphasized-font-style": { + "prop": "--spectrum-code-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "code-strong-emphasized-font-weight": { + "prop": "--spectrum-code-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "code-strong-font-style": { + "prop": "--spectrum-code-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "code-strong-font-weight": { + "prop": "--spectrum-code-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "collection-card-minimum-height-extra-large": { + "prop": "--spectrum-collection-card-minimum-height-extra-large", + "value": "249px" + }, + "collection-card-minimum-height-extra-small": { + "prop": "--spectrum-collection-card-minimum-height-extra-small", + "value": "88px" + }, + "collection-card-minimum-height-hero-extra-large": { + "prop": "--spectrum-collection-card-minimum-height-hero-extra-large", + "value": "514px" + }, + "collection-card-minimum-height-hero-extra-small": { + "prop": "--spectrum-collection-card-minimum-height-hero-extra-small", + "value": "168px" + }, + "collection-card-minimum-height-hero-large": { + "prop": "--spectrum-collection-card-minimum-height-hero-large", + "value": "414px" + }, + "collection-card-minimum-height-hero-medium": { + "prop": "--spectrum-collection-card-minimum-height-hero-medium", + "value": "317px" + }, + "collection-card-minimum-height-hero-small": { + "prop": "--spectrum-collection-card-minimum-height-hero-small", + "value": "243px" + }, + "collection-card-minimum-height-large": { + "prop": "--spectrum-collection-card-minimum-height-large", + "value": "202px" + }, + "collection-card-minimum-height-medium": { + "prop": "--spectrum-collection-card-minimum-height-medium", + "value": "157px" + }, + "collection-card-minimum-height-small": { + "prop": "--spectrum-collection-card-minimum-height-small", + "value": "124px" + }, + "color-area-border-color": { + "prop": "--spectrum-color-area-border-color", + "ref": "var(--spectrum-gray-1000)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 0, 0)" + } + }, + "color-area-border-opacity": { + "prop": "--spectrum-color-area-border-opacity", + "ref": "0.1", + "value": "10%" + }, + "color-area-border-rounding": { + "prop": "--spectrum-color-area-border-rounding", + "ref": "var(--spectrum-corner-radius-medium-size-small)", + "value": "7px" + }, + "color-area-border-width": { + "prop": "--spectrum-color-area-border-width", + "ref": "var(--spectrum-border-width-100)", + "value": "1px" + }, + "color-area-height": { + "prop": "--spectrum-color-area-height", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "color-area-minimum-height": { + "prop": "--spectrum-color-area-minimum-height", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "80px" + } + }, + "color-area-minimum-width": { + "prop": "--spectrum-color-area-minimum-width", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "80px" + } + }, + "color-area-width": { + "prop": "--spectrum-color-area-width", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "color-control-track-width": { + "prop": "--spectrum-color-control-track-width", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "color-handle-border-width": { + "prop": "--spectrum-color-handle-border-width", + "ref": "var(--spectrum-border-width-200)", + "value": "2px" + }, + "color-handle-drop-shadow-blur": { + "prop": "--spectrum-color-handle-drop-shadow-blur", + "value": "0" + }, + "color-handle-drop-shadow-color": { + "prop": "--spectrum-color-handle-drop-shadow-color", + "ref": "var(--spectrum-drop-shadow-color)", + "light": { + "value": "rgba(0, 0, 0, 0.12)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.36)" + } + }, + "color-handle-drop-shadow-x": { + "prop": "--spectrum-color-handle-drop-shadow-x", + "value": "0" + }, + "color-handle-drop-shadow-y": { + "prop": "--spectrum-color-handle-drop-shadow-y", + "value": "0" + }, + "color-handle-inner-border-color": { + "prop": "--spectrum-color-handle-inner-border-color", + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "color-handle-inner-border-opacity": { + "prop": "--spectrum-color-handle-inner-border-opacity", + "ref": "0.42", + "value": "42%" + }, + "color-handle-inner-border-width": { + "prop": "--spectrum-color-handle-inner-border-width", + "value": "1px" + }, + "color-handle-outer-border-color": { + "prop": "--spectrum-color-handle-outer-border-color", + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "color-handle-outer-border-opacity": { + "prop": "--spectrum-color-handle-outer-border-opacity", + "ref": "var(--spectrum-color-handle-inner-border-opacity)", + "value": "42%" + }, + "color-handle-outer-border-width": { + "prop": "--spectrum-color-handle-outer-border-width", + "value": "1px" + }, + "color-handle-size": { + "prop": "--spectrum-color-handle-size", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "color-handle-size-key-focus": { + "prop": "--spectrum-color-handle-size-key-focus", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "color-loupe-bottom-to-color-handle": { + "prop": "--spectrum-color-loupe-bottom-to-color-handle", + "value": "12px" + }, + "color-loupe-drop-shadow-blur": { + "prop": "--spectrum-color-loupe-drop-shadow-blur", + "ref": "var(--spectrum-drop-shadow-elevated-blur)", + "value": "8px" + }, + "color-loupe-drop-shadow-color": { + "prop": "--spectrum-color-loupe-drop-shadow-color", + "ref": "var(--spectrum-drop-shadow-elevated-color)", + "light": { + "value": "rgba(0, 0, 0, 0.16)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.48)" + } + }, + "color-loupe-drop-shadow-y": { + "prop": "--spectrum-color-loupe-drop-shadow-y", + "ref": "var(--spectrum-drop-shadow-elevated-y)", + "value": "2px" + }, + "color-loupe-height": { + "prop": "--spectrum-color-loupe-height", + "value": "64px" + }, + "color-loupe-inner-border": { + "prop": "--spectrum-color-loupe-inner-border", + "ref": "var(--spectrum-transparent-black-200)", + "value": "rgba(0, 0, 0, 0.12)" + }, + "color-loupe-inner-border-width": { + "prop": "--spectrum-color-loupe-inner-border-width", + "value": "1px" + }, + "color-loupe-outer-border": { + "prop": "--spectrum-color-loupe-outer-border", + "ref": "var(--spectrum-white)", + "value": "rgb(255, 255, 255)" + }, + "color-loupe-outer-border-width": { + "prop": "--spectrum-color-loupe-outer-border-width", + "ref": "var(--spectrum-border-width-200)", + "value": "2px" + }, + "color-loupe-width": { + "prop": "--spectrum-color-loupe-width", + "value": "48px" + }, + "color-slider-border-color": { + "prop": "--spectrum-color-slider-border-color", + "ref": "var(--spectrum-gray-1000)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 0, 0)" + } + }, + "color-slider-border-opacity": { + "prop": "--spectrum-color-slider-border-opacity", + "ref": "0.1", + "value": "10%" + }, + "color-slider-border-rounding": { + "prop": "--spectrum-color-slider-border-rounding", + "ref": "var(--spectrum-corner-radius-medium-size-small)", + "value": "7px" + }, + "color-slider-border-width": { + "prop": "--spectrum-color-slider-border-width", + "value": "1px" + }, + "color-slider-length": { + "prop": "--spectrum-color-slider-length", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "color-slider-minimum-length": { + "prop": "--spectrum-color-slider-minimum-length", + "desktop": { + "value": "80px" + }, + "mobile": { + "value": "100px" + } + }, + "color-wheel-border-color": { + "prop": "--spectrum-color-wheel-border-color", + "ref": "var(--spectrum-gray-1000)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 0, 0)" + } + }, + "color-wheel-border-opacity": { + "prop": "--spectrum-color-wheel-border-opacity", + "ref": "0.1", + "value": "10%" + }, + "color-wheel-color-area-margin": { + "prop": "--spectrum-color-wheel-color-area-margin", + "value": "12px" + }, + "color-wheel-minimum-width": { + "prop": "--spectrum-color-wheel-minimum-width", + "desktop": { + "value": "175px" + }, + "mobile": { + "value": "219px" + } + }, + "color-wheel-width": { + "prop": "--spectrum-color-wheel-width", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "colorloupe-checkerboard-fill": { + "prop": "--spectrum-colorloupe-checkerboard-fill", + "desktop": { + "value": "url('#checkerboard-primary')" + }, + "mobile": { + "value": "url('#checkerboard-secondary')" + } + }, + "colorwheel-colorarea-container-size": { + "prop": "--spectrum-colorwheel-colorarea-container-size", + "desktop": { + "value": "144px" + }, + "mobile": { + "value": "182px" + } + }, + "colorwheel-path": { + "prop": "--spectrum-colorwheel-path", + "desktop": { + "value": "M 95 95 m -95 0 a 95 95 0 1 0 190 0 a 95 95 0 1 0 -190 0.2 M 95 95 m -73 0 a 73 73 0 1 0 146 0 a 73 73 0 1 0 -146 0" + }, + "mobile": { + "value": "M 119 119 m -119 0 a 119 119 0 1 0 238 0 a 119 119 0 1 0 -238 0.2 M 119 119 m -91 0 a 91 91 0 1 0 182 0 a 91 91 0 1 0 -182 0" + } + }, + "colorwheel-path-borders": { + "prop": "--spectrum-colorwheel-path-borders", + "desktop": { + "value": "M 96 96 m -96 0 a 96 96 0 1 0 192 0 a 96 96 0 1 0 -192 0.2 M 96 96 m -72 0 a 72 72 0 1 0 144 0 a 72 72 0 1 0 -144 0" + }, + "mobile": { + "value": "M 120 120 m -120 0 a 120 120 0 1 0 240 0 a 120 120 0 1 0 -240 0.2 M 120 120 m -90 0 a 90 90 0 1 0 180 0 a 90 90 0 1 0 -180 0" + } + }, + "combo-box-minimum-width-multiplier": { + "prop": "--spectrum-combo-box-minimum-width-multiplier", + "value": 2.5 + }, + "combo-box-quiet-minimum-width-multiplier": { + "prop": "--spectrum-combo-box-quiet-minimum-width-multiplier", + "value": 2 + }, + "combo-box-visual-to-field-button": { + "prop": "--spectrum-combo-box-visual-to-field-button", + "value": "0px" + }, + "combo-box-visual-to-field-button-extra-large": { + "prop": "--spectrum-combo-box-visual-to-field-button-extra-large", + "ref": "var(--spectrum-combo-box-visual-to-field-button)", + "value": "0px" + }, + "combo-box-visual-to-field-button-large": { + "prop": "--spectrum-combo-box-visual-to-field-button-large", + "ref": "var(--spectrum-combo-box-visual-to-field-button)", + "value": "0px" + }, + "combo-box-visual-to-field-button-medium": { + "prop": "--spectrum-combo-box-visual-to-field-button-medium", + "ref": "var(--spectrum-combo-box-visual-to-field-button)", + "value": "0px" + }, + "combo-box-visual-to-field-button-quiet": { + "prop": "--spectrum-combo-box-visual-to-field-button-quiet", + "ref": "var(--spectrum-combo-box-visual-to-field-button)", + "value": "0px" + }, + "combo-box-visual-to-field-button-small": { + "prop": "--spectrum-combo-box-visual-to-field-button-small", + "ref": "var(--spectrum-combo-box-visual-to-field-button)", + "value": "0px" + }, + "component-bottom-to-text-100": { + "prop": "--spectrum-component-bottom-to-text-100", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "component-bottom-to-text-200": { + "prop": "--spectrum-component-bottom-to-text-200", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "component-bottom-to-text-300": { + "prop": "--spectrum-component-bottom-to-text-300", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "component-bottom-to-text-50": { + "prop": "--spectrum-component-bottom-to-text-50", + "desktop": { + "value": "3px" + }, + "mobile": { + "value": "6px" + } + }, + "component-bottom-to-text-75": { + "prop": "--spectrum-component-bottom-to-text-75", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "component-edge-to-text-100": { + "prop": "--spectrum-component-edge-to-text-100", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "component-edge-to-text-200": { + "prop": "--spectrum-component-edge-to-text-200", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "component-edge-to-text-300": { + "prop": "--spectrum-component-edge-to-text-300", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "component-edge-to-text-50": { + "prop": "--spectrum-component-edge-to-text-50", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "component-edge-to-text-75": { + "prop": "--spectrum-component-edge-to-text-75", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "component-edge-to-visual-100": { + "prop": "--spectrum-component-edge-to-visual-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "component-edge-to-visual-200": { + "prop": "--spectrum-component-edge-to-visual-200", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "16px" + } + }, + "component-edge-to-visual-300": { + "prop": "--spectrum-component-edge-to-visual-300", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "component-edge-to-visual-50": { + "prop": "--spectrum-component-edge-to-visual-50", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "component-edge-to-visual-75": { + "prop": "--spectrum-component-edge-to-visual-75", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "component-edge-to-visual-only-100": { + "prop": "--spectrum-component-edge-to-visual-only-100", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "component-edge-to-visual-only-200": { + "prop": "--spectrum-component-edge-to-visual-only-200", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "component-edge-to-visual-only-300": { + "prop": "--spectrum-component-edge-to-visual-only-300", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "component-edge-to-visual-only-50": { + "prop": "--spectrum-component-edge-to-visual-only-50", + "desktop": { + "value": "3px" + }, + "mobile": { + "value": "5px" + } + }, + "component-edge-to-visual-only-75": { + "prop": "--spectrum-component-edge-to-visual-only-75", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "6px" + } + }, + "component-height-100": { + "prop": "--spectrum-component-height-100", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "component-height-200": { + "prop": "--spectrum-component-height-200", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "component-height-300": { + "prop": "--spectrum-component-height-300", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "component-height-400": { + "prop": "--spectrum-component-height-400", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "component-height-50": { + "prop": "--spectrum-component-height-50", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "26px" + } + }, + "component-height-500": { + "prop": "--spectrum-component-height-500", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "80px" + } + }, + "component-height-75": { + "prop": "--spectrum-component-height-75", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "component-pill-edge-to-text-100": { + "prop": "--spectrum-component-pill-edge-to-text-100", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "component-pill-edge-to-text-200": { + "prop": "--spectrum-component-pill-edge-to-text-200", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "25px" + } + }, + "component-pill-edge-to-text-300": { + "prop": "--spectrum-component-pill-edge-to-text-300", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "component-pill-edge-to-text-75": { + "prop": "--spectrum-component-pill-edge-to-text-75", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "component-pill-edge-to-visual-100": { + "prop": "--spectrum-component-pill-edge-to-visual-100", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "component-pill-edge-to-visual-200": { + "prop": "--spectrum-component-pill-edge-to-visual-200", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "component-pill-edge-to-visual-300": { + "prop": "--spectrum-component-pill-edge-to-visual-300", + "desktop": { + "value": "21px" + }, + "mobile": { + "value": "27px" + } + }, + "component-pill-edge-to-visual-75": { + "prop": "--spectrum-component-pill-edge-to-visual-75", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "component-pill-edge-to-visual-only-100": { + "prop": "--spectrum-component-pill-edge-to-visual-only-100", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "component-pill-edge-to-visual-only-200": { + "prop": "--spectrum-component-pill-edge-to-visual-only-200", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "component-pill-edge-to-visual-only-300": { + "prop": "--spectrum-component-pill-edge-to-visual-only-300", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "component-pill-edge-to-visual-only-75": { + "prop": "--spectrum-component-pill-edge-to-visual-only-75", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "6px" + } + }, + "component-size-difference-down": { + "prop": "--spectrum-component-size-difference-down", + "value": "-2px" + }, + "component-size-maximum-perspective-down": { + "prop": "--spectrum-component-size-maximum-perspective-down", + "value": "96px" + }, + "component-size-minimum-perspective-down": { + "prop": "--spectrum-component-size-minimum-perspective-down", + "value": "24px" + }, + "component-size-width-ratio-down": { + "prop": "--spectrum-component-size-width-ratio-down", + "value": 0.3333 + }, + "component-to-menu-extra-large": { + "prop": "--spectrum-component-to-menu-extra-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "component-to-menu-large": { + "prop": "--spectrum-component-to-menu-large", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "component-to-menu-medium": { + "prop": "--spectrum-component-to-menu-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "component-to-menu-small": { + "prop": "--spectrum-component-to-menu-small", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "component-top-to-text-100": { + "prop": "--spectrum-component-top-to-text-100", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "component-top-to-text-200": { + "prop": "--spectrum-component-top-to-text-200", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "component-top-to-text-300": { + "prop": "--spectrum-component-top-to-text-300", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "component-top-to-text-50": { + "prop": "--spectrum-component-top-to-text-50", + "desktop": { + "value": "3px" + }, + "mobile": { + "value": "4px" + } + }, + "component-top-to-text-75": { + "prop": "--spectrum-component-top-to-text-75", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "component-top-to-workflow-icon-100": { + "prop": "--spectrum-component-top-to-workflow-icon-100", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "component-top-to-workflow-icon-200": { + "prop": "--spectrum-component-top-to-workflow-icon-200", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "component-top-to-workflow-icon-300": { + "prop": "--spectrum-component-top-to-workflow-icon-300", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "component-top-to-workflow-icon-50": { + "prop": "--spectrum-component-top-to-workflow-icon-50", + "desktop": { + "value": "3px" + }, + "mobile": { + "value": "5px" + } + }, + "component-top-to-workflow-icon-75": { + "prop": "--spectrum-component-top-to-workflow-icon-75", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "6px" + } + }, + "contextual-help-body-font-size": { + "prop": "--spectrum-contextual-help-body-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "contextual-help-body-size": { + "prop": "--spectrum-contextual-help-body-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "contextual-help-content-spacing": { + "prop": "--spectrum-contextual-help-content-spacing", + "desktop": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + } + }, + "contextual-help-minimum-width": { + "prop": "--spectrum-contextual-help-minimum-width", + "value": "268px" + }, + "contextual-help-title-font-size": { + "prop": "--spectrum-contextual-help-title-font-size", + "ref": "var(--spectrum-title-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "contextual-help-title-size": { + "prop": "--spectrum-contextual-help-title-size", + "ref": "var(--spectrum-title-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "corner-radius-0": { + "prop": "--spectrum-corner-radius-0", + "value": "0px" + }, + "corner-radius-100": { + "prop": "--spectrum-corner-radius-100", + "value": "4px" + }, + "corner-radius-1000": { + "prop": "--spectrum-corner-radius-1000", + "value": "9999px" + }, + "corner-radius-200": { + "prop": "--spectrum-corner-radius-200", + "value": "5px" + }, + "corner-radius-300": { + "prop": "--spectrum-corner-radius-300", + "value": "6px" + }, + "corner-radius-400": { + "prop": "--spectrum-corner-radius-400", + "value": "7px" + }, + "corner-radius-500": { + "prop": "--spectrum-corner-radius-500", + "value": "8px" + }, + "corner-radius-600": { + "prop": "--spectrum-corner-radius-600", + "value": "9px" + }, + "corner-radius-700": { + "prop": "--spectrum-corner-radius-700", + "value": "10px" + }, + "corner-radius-75": { + "prop": "--spectrum-corner-radius-75", + "value": "3px" + }, + "corner-radius-800": { + "prop": "--spectrum-corner-radius-800", + "value": "16px" + }, + "corner-radius-extra-large-default": { + "prop": "--spectrum-corner-radius-extra-large-default", + "ref": "var(--spectrum-corner-radius-800)", + "value": "16px" + }, + "corner-radius-full": { + "prop": "--spectrum-corner-radius-full", + "ref": "var(--spectrum-corner-radius-1000)", + "value": "9999px" + }, + "corner-radius-large-default": { + "prop": "--spectrum-corner-radius-large-default", + "ref": "var(--spectrum-corner-radius-700)", + "value": "10px" + }, + "corner-radius-medium-default": { + "prop": "--spectrum-corner-radius-medium-default", + "ref": "var(--spectrum-corner-radius-500)", + "value": "8px" + }, + "corner-radius-medium-size-extra-large": { + "prop": "--spectrum-corner-radius-medium-size-extra-large", + "ref": "var(--spectrum-corner-radius-700)", + "value": "10px" + }, + "corner-radius-medium-size-extra-small": { + "prop": "--spectrum-corner-radius-medium-size-extra-small", + "ref": "var(--spectrum-corner-radius-300)", + "value": "6px" + }, + "corner-radius-medium-size-large": { + "prop": "--spectrum-corner-radius-medium-size-large", + "ref": "var(--spectrum-corner-radius-600)", + "value": "9px" + }, + "corner-radius-medium-size-medium": { + "prop": "--spectrum-corner-radius-medium-size-medium", + "ref": "var(--spectrum-corner-radius-500)", + "value": "8px" + }, + "corner-radius-medium-size-small": { + "prop": "--spectrum-corner-radius-medium-size-small", + "ref": "var(--spectrum-corner-radius-400)", + "value": "7px" + }, + "corner-radius-none": { + "prop": "--spectrum-corner-radius-none", + "ref": "var(--spectrum-corner-radius-0)", + "value": "0px" + }, + "corner-radius-small-default": { + "prop": "--spectrum-corner-radius-small-default", + "ref": "var(--spectrum-corner-radius-100)", + "value": "4px" + }, + "corner-radius-small-size-extra-large": { + "prop": "--spectrum-corner-radius-small-size-extra-large", + "ref": "var(--spectrum-corner-radius-300)", + "value": "6px" + }, + "corner-radius-small-size-large": { + "prop": "--spectrum-corner-radius-small-size-large", + "ref": "var(--spectrum-corner-radius-200)", + "value": "5px" + }, + "corner-radius-small-size-medium": { + "prop": "--spectrum-corner-radius-small-size-medium", + "ref": "var(--spectrum-corner-radius-100)", + "value": "4px" + }, + "corner-radius-small-size-small": { + "prop": "--spectrum-corner-radius-small-size-small", + "ref": "var(--spectrum-corner-radius-75)", + "value": "3px" + }, + "corner-triangle-icon-size-100": { + "prop": "--spectrum-corner-triangle-icon-size-100", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "corner-triangle-icon-size-200": { + "prop": "--spectrum-corner-triangle-icon-size-200", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "corner-triangle-icon-size-300": { + "prop": "--spectrum-corner-triangle-icon-size-300", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "8px" + } + }, + "corner-triangle-icon-size-75": { + "prop": "--spectrum-corner-triangle-icon-size-75", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "cross-icon-size-100": { + "prop": "--spectrum-cross-icon-size-100", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "cross-icon-size-200": { + "prop": "--spectrum-cross-icon-size-200", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "cross-icon-size-300": { + "prop": "--spectrum-cross-icon-size-300", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "cross-icon-size-400": { + "prop": "--spectrum-cross-icon-size-400", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "cross-icon-size-500": { + "prop": "--spectrum-cross-icon-size-500", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "cross-icon-size-600": { + "prop": "--spectrum-cross-icon-size-600", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "cross-icon-size-75": { + "prop": "--spectrum-cross-icon-size-75", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "cyan-100": { + "prop": "--spectrum-cyan-100", + "light": { + "value": "rgb(238, 250, 254)" + }, + "dark": { + "value": "rgb(0, 29, 39)" + } + }, + "cyan-1000": { + "prop": "--spectrum-cyan-1000", + "light": { + "value": "rgb(4, 102, 145)" + }, + "dark": { + "value": "rgb(38, 159, 244)" + } + }, + "cyan-1100": { + "prop": "--spectrum-cyan-1100", + "light": { + "value": "rgb(0, 87, 121)" + }, + "dark": { + "value": "rgb(63, 177, 255)" + } + }, + "cyan-1200": { + "prop": "--spectrum-cyan-1200", + "light": { + "value": "rgb(0, 71, 98)" + }, + "dark": { + "value": "rgb(107, 199, 255)" + } + }, + "cyan-1300": { + "prop": "--spectrum-cyan-1300", + "light": { + "value": "rgb(0, 57, 78)" + }, + "dark": { + "value": "rgb(152, 219, 255)" + } + }, + "cyan-1400": { + "prop": "--spectrum-cyan-1400", + "light": { + "value": "rgb(0, 43, 59)" + }, + "dark": { + "value": "rgb(195, 236, 252)" + } + }, + "cyan-1500": { + "prop": "--spectrum-cyan-1500", + "dark": { + "value": "rgb(230, 248, 253)" + }, + "light": { + "value": "rgb(0, 31, 43)" + } + }, + "cyan-1600": { + "prop": "--spectrum-cyan-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 14, 20)" + } + }, + "cyan-200": { + "prop": "--spectrum-cyan-200", + "light": { + "value": "rgb(217, 244, 253)" + }, + "dark": { + "value": "rgb(0, 36, 49)" + } + }, + "cyan-300": { + "prop": "--spectrum-cyan-300", + "light": { + "value": "rgb(183, 231, 252)" + }, + "dark": { + "value": "rgb(0, 48, 65)" + } + }, + "cyan-400": { + "prop": "--spectrum-cyan-400", + "light": { + "value": "rgb(138, 213, 255)" + }, + "dark": { + "value": "rgb(0, 64, 88)" + } + }, + "cyan-500": { + "prop": "--spectrum-cyan-500", + "light": { + "value": "rgb(92, 192, 255)" + }, + "dark": { + "value": "rgb(0, 82, 113)" + } + }, + "cyan-600": { + "prop": "--spectrum-cyan-600", + "light": { + "value": "rgb(48, 167, 254)" + }, + "dark": { + "value": "rgb(3, 99, 140)" + } + }, + "cyan-700": { + "prop": "--spectrum-cyan-700", + "light": { + "value": "rgb(29, 149, 231)" + }, + "dark": { + "value": "rgb(8, 115, 168)" + } + }, + "cyan-800": { + "prop": "--spectrum-cyan-800", + "light": { + "value": "rgb(18, 134, 205)" + }, + "dark": { + "value": "rgb(13, 125, 186)" + } + }, + "cyan-900": { + "prop": "--spectrum-cyan-900", + "light": { + "value": "rgb(11, 120, 179)" + }, + "dark": { + "value": "rgb(24, 142, 220)" + } + }, + "cyan-background-color-default": { + "prop": "--spectrum-cyan-background-color-default", + "ref": "var(--spectrum-cyan-800)", + "light": { + "value": "rgb(11, 120, 179)" + }, + "dark": { + "value": "rgb(13, 125, 186)" + } + }, + "cyan-subtle-background-color-default": { + "prop": "--spectrum-cyan-subtle-background-color-default", + "ref": "var(--spectrum-cyan-300)", + "light": { + "value": "rgb(217, 244, 253)" + }, + "dark": { + "value": "rgb(0, 48, 65)" + } + }, + "cyan-visual-color": { + "prop": "--spectrum-cyan-visual-color", + "ref": "var(--spectrum-cyan-900)", + "light": { + "value": "rgb(48, 167, 254)" + }, + "dark": { + "value": "rgb(24, 142, 220)" + } + }, + "dash-icon-size-100": { + "prop": "--spectrum-dash-icon-size-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "dash-icon-size-200": { + "prop": "--spectrum-dash-icon-size-200", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "dash-icon-size-300": { + "prop": "--spectrum-dash-icon-size-300", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "dash-icon-size-400": { + "prop": "--spectrum-dash-icon-size-400", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "dash-icon-size-50": { + "prop": "--spectrum-dash-icon-size-50", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "dash-icon-size-500": { + "prop": "--spectrum-dash-icon-size-500", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "dash-icon-size-600": { + "prop": "--spectrum-dash-icon-size-600", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "dash-icon-size-75": { + "prop": "--spectrum-dash-icon-size-75", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "date-field-minimum-width": { + "prop": "--spectrum-date-field-minimum-width", + "value": "152px" + }, + "date-field-text-to-visual": { + "prop": "--spectrum-date-field-text-to-visual", + "value": "20px" + }, + "date-picker-minimum-width": { + "prop": "--spectrum-date-picker-minimum-width", + "value": "152px" + }, + "date-picker-text-to-visual": { + "prop": "--spectrum-date-picker-text-to-visual", + "value": "0px" + }, + "date-picker-visual-to-field-button": { + "prop": "--spectrum-date-picker-visual-to-field-button", + "value": "0px" + }, + "datepicker-dash-line-height": { + "prop": "--spectrum-datepicker-dash-line-height", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "datepicker-datetime-width-first": { + "prop": "--spectrum-datepicker-datetime-width-first", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "45px" + } + }, + "datepicker-generic-padding": { + "prop": "--spectrum-datepicker-generic-padding", + "desktop": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "datepicker-initial-width": { + "prop": "--spectrum-datepicker-initial-width", + "desktop": { + "value": "128px" + }, + "mobile": { + "value": "160px" + } + }, + "datepicker-input-datetime-width": { + "prop": "--spectrum-datepicker-input-datetime-width", + "desktop": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "datepicker-invalid-icon-to-button": { + "prop": "--spectrum-datepicker-invalid-icon-to-button", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "datepicker-invalid-icon-to-button-quiet": { + "prop": "--spectrum-datepicker-invalid-icon-to-button-quiet", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "datepicker-width-quiet-first": { + "prop": "--spectrum-datepicker-width-quiet-first", + "desktop": { + "value": "72px" + }, + "mobile": { + "value": "90px" + } + }, + "datepicker-width-quiet-second": { + "prop": "--spectrum-datepicker-width-quiet-second", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "default-font-family": { + "prop": "--spectrum-default-font-family", + "ref": "var(--spectrum-sans-serif-font-family)", + "value": "Adobe Clean" + }, + "default-font-style": { + "prop": "--spectrum-default-font-style", + "value": "normal" + }, + "detail-cjk-emphasized-font-style": { + "prop": "--spectrum-detail-cjk-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-emphasized-font-weight": { + "prop": "--spectrum-detail-cjk-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "detail-cjk-font-family": { + "prop": "--spectrum-detail-cjk-font-family", + "ref": "var(--spectrum-cjk-font-family)", + "value": "Adobe Clean Han" + }, + "detail-cjk-font-style": { + "prop": "--spectrum-detail-cjk-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-font-weight": { + "prop": "--spectrum-detail-cjk-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "detail-cjk-light-emphasized-font-style": { + "prop": "--spectrum-detail-cjk-light-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-light-emphasized-font-weight": { + "prop": "--spectrum-detail-cjk-light-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-cjk-light-font-style": { + "prop": "--spectrum-detail-cjk-light-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-light-font-weight": { + "prop": "--spectrum-detail-cjk-light-font-weight", + "ref": "var(--spectrum-light-font-weight)", + "value": "300" + }, + "detail-cjk-light-strong-emphasized-font-style": { + "prop": "--spectrum-detail-cjk-light-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-light-strong-emphasized-font-weight": { + "prop": "--spectrum-detail-cjk-light-strong-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "detail-cjk-light-strong-font-style": { + "prop": "--spectrum-detail-cjk-light-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-light-strong-font-weight": { + "prop": "--spectrum-detail-cjk-light-strong-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "detail-cjk-line-height": { + "prop": "--spectrum-detail-cjk-line-height", + "ref": "var(--spectrum-cjk-line-height-100)", + "value": 1.5 + }, + "detail-cjk-size-l": { + "prop": "--spectrum-detail-cjk-size-l", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "detail-cjk-size-m": { + "prop": "--spectrum-detail-cjk-size-m", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "detail-cjk-size-s": { + "prop": "--spectrum-detail-cjk-size-s", + "ref": "var(--spectrum-font-size-50)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "detail-cjk-size-xl": { + "prop": "--spectrum-detail-cjk-size-xl", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "detail-cjk-size-xs": { + "prop": "--spectrum-detail-cjk-size-xs", + "ref": "var(--spectrum-font-size-25)", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "detail-cjk-strong-emphasized-font-style": { + "prop": "--spectrum-detail-cjk-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-strong-emphasized-font-weight": { + "prop": "--spectrum-detail-cjk-strong-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "detail-cjk-strong-font-style": { + "prop": "--spectrum-detail-cjk-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-cjk-strong-font-weight": { + "prop": "--spectrum-detail-cjk-strong-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "detail-color": { + "prop": "--spectrum-detail-color", + "ref": "var(--spectrum-gray-600)", + "light": { + "value": "rgb(113, 113, 113)" + }, + "dark": { + "value": "rgb(138, 138, 138)" + } + }, + "detail-letter-spacing": { + "prop": "--spectrum-detail-letter-spacing", + "value": "0.06em" + }, + "detail-line-height": { + "prop": "--spectrum-detail-line-height", + "ref": "var(--spectrum-line-height-100)", + "value": 1.3 + }, + "detail-margin-bottom-multiplier": { + "prop": "--spectrum-detail-margin-bottom-multiplier", + "value": 0.25 + }, + "detail-margin-top-multiplier": { + "prop": "--spectrum-detail-margin-top-multiplier", + "value": 0.88888889 + }, + "detail-sans-serif-emphasized-font-style": { + "prop": "--spectrum-detail-sans-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-sans-serif-emphasized-font-weight": { + "prop": "--spectrum-detail-sans-serif-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-sans-serif-font-family": { + "prop": "--spectrum-detail-sans-serif-font-family", + "ref": "var(--spectrum-sans-serif-font-family)", + "value": "Adobe Clean" + }, + "detail-sans-serif-font-style": { + "prop": "--spectrum-detail-sans-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-sans-serif-font-weight": { + "prop": "--spectrum-detail-sans-serif-font-weight", + "ref": "var(--spectrum-medium-font-weight)", + "value": "500" + }, + "detail-sans-serif-light-emphasized-font-style": { + "prop": "--spectrum-detail-sans-serif-light-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-sans-serif-light-emphasized-font-weight": { + "prop": "--spectrum-detail-sans-serif-light-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-sans-serif-light-font-style": { + "prop": "--spectrum-detail-sans-serif-light-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-sans-serif-light-font-weight": { + "prop": "--spectrum-detail-sans-serif-light-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-sans-serif-light-strong-emphasized-font-style": { + "prop": "--spectrum-detail-sans-serif-light-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-sans-serif-light-strong-emphasized-font-weight": { + "prop": "--spectrum-detail-sans-serif-light-strong-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-sans-serif-light-strong-font-style": { + "prop": "--spectrum-detail-sans-serif-light-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-sans-serif-light-strong-font-weight": { + "prop": "--spectrum-detail-sans-serif-light-strong-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-sans-serif-strong-emphasized-font-style": { + "prop": "--spectrum-detail-sans-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-sans-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-detail-sans-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "detail-sans-serif-strong-font-style": { + "prop": "--spectrum-detail-sans-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-sans-serif-strong-font-weight": { + "prop": "--spectrum-detail-sans-serif-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "detail-sans-serif-text-transform": { + "prop": "--spectrum-detail-sans-serif-text-transform", + "value": "uppercase" + }, + "detail-serif-emphasized-font-style": { + "prop": "--spectrum-detail-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-serif-emphasized-font-weight": { + "prop": "--spectrum-detail-serif-emphasized-font-weight", + "ref": "var(--spectrum-medium-font-weight)", + "value": "500" + }, + "detail-serif-font-family": { + "prop": "--spectrum-detail-serif-font-family", + "ref": "var(--spectrum-serif-font-family)", + "value": "Adobe Clean Serif" + }, + "detail-serif-font-style": { + "prop": "--spectrum-detail-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-serif-font-weight": { + "prop": "--spectrum-detail-serif-font-weight", + "ref": "var(--spectrum-medium-font-weight)", + "value": "500" + }, + "detail-serif-light-emphasized-font-style": { + "prop": "--spectrum-detail-serif-light-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-serif-light-emphasized-font-weight": { + "prop": "--spectrum-detail-serif-light-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-serif-light-font-style": { + "prop": "--spectrum-detail-serif-light-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-serif-light-font-weight": { + "prop": "--spectrum-detail-serif-light-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-serif-light-strong-emphasized-font-style": { + "prop": "--spectrum-detail-serif-light-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-serif-light-strong-emphasized-font-weight": { + "prop": "--spectrum-detail-serif-light-strong-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-serif-light-strong-font-style": { + "prop": "--spectrum-detail-serif-light-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-serif-light-strong-font-weight": { + "prop": "--spectrum-detail-serif-light-strong-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "detail-serif-strong-emphasized-font-style": { + "prop": "--spectrum-detail-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "detail-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-detail-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "detail-serif-strong-font-style": { + "prop": "--spectrum-detail-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "detail-serif-strong-font-weight": { + "prop": "--spectrum-detail-serif-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "detail-serif-text-transform": { + "prop": "--spectrum-detail-serif-text-transform", + "value": "uppercase" + }, + "detail-size-l": { + "prop": "--spectrum-detail-size-l", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "detail-size-m": { + "prop": "--spectrum-detail-size-m", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "detail-size-s": { + "prop": "--spectrum-detail-size-s", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "detail-size-xl": { + "prop": "--spectrum-detail-size-xl", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "detail-size-xs": { + "prop": "--spectrum-detail-size-xs", + "ref": "var(--spectrum-font-size-50)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "dial-border-radius": { + "prop": "--spectrum-dial-border-radius", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "dial-controls-margin": { + "prop": "--spectrum-dial-controls-margin", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "dial-handle-block-margin": { + "prop": "--spectrum-dial-handle-block-margin", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "dial-handle-inline-margin": { + "prop": "--spectrum-dial-handle-inline-margin", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "16px" + } + }, + "dial-handle-position": { + "prop": "--spectrum-dial-handle-position", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "dial-label-container-top-to-text": { + "prop": "--spectrum-dial-label-container-top-to-text", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "dial-label-gap-y": { + "prop": "--spectrum-dial-label-gap-y", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "dialog-confirm-border-radius": { + "prop": "--spectrum-dialog-confirm-border-radius", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "dialog-confirm-description-text-size": { + "prop": "--spectrum-dialog-confirm-description-text-size", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "dialog-confirm-entry-animation-distance": { + "prop": "--spectrum-dialog-confirm-entry-animation-distance", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "25px" + } + }, + "dialog-confirm-hero-height": { + "prop": "--spectrum-dialog-confirm-hero-height", + "desktop": { + "value": "128px" + }, + "mobile": { + "value": "160px" + } + }, + "dialog-confirm-padding-grid": { + "prop": "--spectrum-dialog-confirm-padding-grid", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "24px" + } + }, + "dialog-confirm-title-text-size": { + "prop": "--spectrum-dialog-confirm-title-text-size", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "19px" + } + }, + "disabled-background-color": { + "prop": "--spectrum-disabled-background-color", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "disabled-border-color": { + "prop": "--spectrum-disabled-border-color", + "ref": "var(--spectrum-gray-300)", + "light": { + "value": "rgb(218, 218, 218)" + }, + "dark": { + "value": "rgb(57, 57, 57)" + } + }, + "disabled-content-color": { + "prop": "--spectrum-disabled-content-color", + "ref": "var(--spectrum-gray-400)", + "light": { + "value": "rgb(198, 198, 198)" + }, + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "disabled-static-black-background-color": { + "prop": "--spectrum-disabled-static-black-background-color", + "ref": "var(--spectrum-transparent-black-100)", + "value": "rgba(0, 0, 0, 0.09)" + }, + "disabled-static-black-border-color": { + "prop": "--spectrum-disabled-static-black-border-color", + "ref": "var(--spectrum-transparent-black-300)", + "value": "rgba(0, 0, 0, 0.15)" + }, + "disabled-static-black-content-color": { + "prop": "--spectrum-disabled-static-black-content-color", + "ref": "var(--spectrum-transparent-black-400)", + "value": "rgba(0, 0, 0, 0.22)" + }, + "disabled-static-white-background-color": { + "prop": "--spectrum-disabled-static-white-background-color", + "ref": "var(--spectrum-transparent-white-100)", + "value": "rgba(255, 255, 255, 0.11)" + }, + "disabled-static-white-border-color": { + "prop": "--spectrum-disabled-static-white-border-color", + "ref": "var(--spectrum-transparent-white-300)", + "value": "rgba(255, 255, 255, 0.17)" + }, + "disabled-static-white-content-color": { + "prop": "--spectrum-disabled-static-white-content-color", + "ref": "var(--spectrum-transparent-white-400)", + "value": "rgba(255, 255, 255, 0.21)" + }, + "disclosure-indicator-top-to-disclosure-icon-extra-large": { + "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "disclosure-indicator-top-to-disclosure-icon-large": { + "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "disclosure-indicator-top-to-disclosure-icon-medium": { + "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "disclosure-indicator-top-to-disclosure-icon-small": { + "prop": "--spectrum-disclosure-indicator-top-to-disclosure-icon-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "divider-horizontal-minimum-width": { + "prop": "--spectrum-divider-horizontal-minimum-width", + "value": "200px" + }, + "divider-thickness-large": { + "prop": "--spectrum-divider-thickness-large", + "value": "4px" + }, + "divider-thickness-medium": { + "prop": "--spectrum-divider-thickness-medium", + "value": "2px" + }, + "divider-thickness-small": { + "prop": "--spectrum-divider-thickness-small", + "value": "1px" + }, + "divider-vertical-minimum-height": { + "prop": "--spectrum-divider-vertical-minimum-height", + "value": "200px" + }, + "double-calendar-popover-minimum-height": { + "prop": "--spectrum-double-calendar-popover-minimum-height", + "value": "320px" + }, + "double-calendar-popover-minimum-width": { + "prop": "--spectrum-double-calendar-popover-minimum-width", + "value": "616px" + }, + "drag-handle-icon-size-100": { + "prop": "--spectrum-drag-handle-icon-size-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "drag-handle-icon-size-200": { + "prop": "--spectrum-drag-handle-icon-size-200", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "drag-handle-icon-size-300": { + "prop": "--spectrum-drag-handle-icon-size-300", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "drag-handle-icon-size-75": { + "prop": "--spectrum-drag-handle-icon-size-75", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "drop-shadow-blur": { + "prop": "--spectrum-drop-shadow-blur", + "ref": "var(--spectrum-drop-shadow-blur-100)", + "value": "6px" + }, + "drop-shadow-blur-100": { + "prop": "--spectrum-drop-shadow-blur-100", + "value": "6px" + }, + "drop-shadow-blur-200": { + "prop": "--spectrum-drop-shadow-blur-200", + "value": "8px" + }, + "drop-shadow-blur-300": { + "prop": "--spectrum-drop-shadow-blur-300", + "value": "16px" + }, + "drop-shadow-color": { + "prop": "--spectrum-drop-shadow-color", + "ref": "var(--spectrum-drop-shadow-color-100)", + "light": { + "value": "rgba(0, 0, 0, 0.12)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.36)" + } + }, + "drop-shadow-color-100": { + "prop": "--spectrum-drop-shadow-color-100", + "light": { + "value": "rgba(0, 0, 0, 0.12)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.36)" + } + }, + "drop-shadow-color-200": { + "prop": "--spectrum-drop-shadow-color-200", + "light": { + "value": "rgba(0, 0, 0, 0.16)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.48)" + } + }, + "drop-shadow-color-300": { + "prop": "--spectrum-drop-shadow-color-300", + "light": { + "value": "rgba(0, 0, 0, 0.2)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.6)" + } + }, + "drop-shadow-dragged-blur": { + "prop": "--spectrum-drop-shadow-dragged-blur", + "ref": "var(--spectrum-drop-shadow-blur-300)", + "value": "16px" + }, + "drop-shadow-dragged-color": { + "prop": "--spectrum-drop-shadow-dragged-color", + "ref": "var(--spectrum-drop-shadow-color-300)", + "light": { + "value": "rgba(0, 0, 0, 0.2)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.6)" + } + }, + "drop-shadow-dragged-x": { + "prop": "--spectrum-drop-shadow-dragged-x", + "ref": "var(--spectrum-drop-shadow-x-300)", + "value": "0px" + }, + "drop-shadow-dragged-y": { + "prop": "--spectrum-drop-shadow-dragged-y", + "ref": "var(--spectrum-drop-shadow-y-300)", + "value": "6px" + }, + "drop-shadow-elevated-blur": { + "prop": "--spectrum-drop-shadow-elevated-blur", + "ref": "var(--spectrum-drop-shadow-blur-200)", + "value": "8px" + }, + "drop-shadow-elevated-color": { + "prop": "--spectrum-drop-shadow-elevated-color", + "ref": "var(--spectrum-drop-shadow-color-200)", + "light": { + "value": "rgba(0, 0, 0, 0.16)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.48)" + } + }, + "drop-shadow-elevated-x": { + "prop": "--spectrum-drop-shadow-elevated-x", + "ref": "var(--spectrum-drop-shadow-x-200)", + "value": "0px" + }, + "drop-shadow-elevated-y": { + "prop": "--spectrum-drop-shadow-elevated-y", + "ref": "var(--spectrum-drop-shadow-y-200)", + "value": "2px" + }, + "drop-shadow-emphasized-default-blur": { + "prop": "--spectrum-drop-shadow-emphasized-default-blur", + "ref": "var(--spectrum-drop-shadow-blur-100)", + "value": "6px" + }, + "drop-shadow-emphasized-default-color": { + "prop": "--spectrum-drop-shadow-emphasized-default-color", + "ref": "var(--spectrum-drop-shadow-color-100)", + "light": { + "value": "rgba(0, 0, 0, 0.12)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.36)" + } + }, + "drop-shadow-emphasized-default-x": { + "prop": "--spectrum-drop-shadow-emphasized-default-x", + "ref": "var(--spectrum-drop-shadow-x-100)", + "value": "0px" + }, + "drop-shadow-emphasized-default-y": { + "prop": "--spectrum-drop-shadow-emphasized-default-y", + "ref": "var(--spectrum-drop-shadow-y-100)", + "value": "1px" + }, + "drop-shadow-emphasized-hover-blur": { + "prop": "--spectrum-drop-shadow-emphasized-hover-blur", + "ref": "var(--spectrum-drop-shadow-blur-200)", + "value": "8px" + }, + "drop-shadow-emphasized-hover-color": { + "prop": "--spectrum-drop-shadow-emphasized-hover-color", + "ref": "var(--spectrum-drop-shadow-color-200)", + "light": { + "value": "rgba(0, 0, 0, 0.16)" + }, + "dark": { + "value": "rgba(0, 0, 0, 0.48)" + } + }, + "drop-shadow-emphasized-hover-x": { + "prop": "--spectrum-drop-shadow-emphasized-hover-x", + "ref": "var(--spectrum-drop-shadow-x-200)", + "value": "0px" + }, + "drop-shadow-emphasized-hover-y": { + "prop": "--spectrum-drop-shadow-emphasized-hover-y", + "ref": "var(--spectrum-drop-shadow-y-200)", + "value": "2px" + }, + "drop-shadow-x": { + "prop": "--spectrum-drop-shadow-x", + "ref": "var(--spectrum-drop-shadow-x-100)", + "value": "0px" + }, + "drop-shadow-x-100": { + "prop": "--spectrum-drop-shadow-x-100", + "value": "0px" + }, + "drop-shadow-x-200": { + "prop": "--spectrum-drop-shadow-x-200", + "value": "0px" + }, + "drop-shadow-x-300": { + "prop": "--spectrum-drop-shadow-x-300", + "value": "0px" + }, + "drop-shadow-y": { + "prop": "--spectrum-drop-shadow-y", + "ref": "var(--spectrum-drop-shadow-y-100)", + "value": "1px" + }, + "drop-shadow-y-100": { + "prop": "--spectrum-drop-shadow-y-100", + "value": "1px" + }, + "drop-shadow-y-200": { + "prop": "--spectrum-drop-shadow-y-200", + "value": "2px" + }, + "drop-shadow-y-300": { + "prop": "--spectrum-drop-shadow-y-300", + "value": "6px" + }, + "drop-zone-background-color": { + "prop": "--spectrum-drop-zone-background-color", + "ref": "var(--spectrum-accent-color-900)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "drop-zone-background-color-opacity": { + "prop": "--spectrum-drop-zone-background-color-opacity", + "ref": "0.1", + "value": "10%" + }, + "drop-zone-background-color-opacity-filled": { + "prop": "--spectrum-drop-zone-background-color-opacity-filled", + "ref": "0.3", + "value": "30%" + }, + "drop-zone-body-font-size": { + "prop": "--spectrum-drop-zone-body-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "drop-zone-body-size": { + "prop": "--spectrum-drop-zone-body-size", + "ref": "var(--spectrum-drop-zone-body-font-size)", + "value": "{drop-zone-body-font-size}" + }, + "drop-zone-border-dash-gap": { + "prop": "--spectrum-drop-zone-border-dash-gap", + "value": "6px" + }, + "drop-zone-border-dash-length": { + "prop": "--spectrum-drop-zone-border-dash-length", + "value": "8px" + }, + "drop-zone-cjk-title-font-size": { + "prop": "--spectrum-drop-zone-cjk-title-font-size", + "ref": "var(--spectrum-title-cjk-size-l)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "19px" + } + }, + "drop-zone-cjk-title-size": { + "prop": "--spectrum-drop-zone-cjk-title-size", + "ref": "var(--spectrum-drop-zone-cjk-title-font-size)", + "value": "{drop-zone-cjk-title-font-size}" + }, + "drop-zone-content-maximum-width": { + "prop": "--spectrum-drop-zone-content-maximum-width", + "ref": "var(--spectrum-illustrated-message-maximum-width)", + "value": "380px" + }, + "drop-zone-title-font-size": { + "prop": "--spectrum-drop-zone-title-font-size", + "ref": "var(--spectrum-title-size-l)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "drop-zone-title-size": { + "prop": "--spectrum-drop-zone-title-size", + "ref": "var(--spectrum-drop-zone-title-font-size)", + "value": "{drop-zone-title-font-size}" + }, + "drop-zone-width": { + "prop": "--spectrum-drop-zone-width", + "value": "428px" + }, + "dropindicator-color": { + "prop": "--spectrum-dropindicator-color", + "ref": "var(--spectrum-blue-800)", + "dark": { + "value": "rgb(52, 91, 248)" + }, + "light": { + "value": "rgb(75, 117, 255)" + } + }, + "extra-bold-font-weight": { + "prop": "--spectrum-extra-bold-font-weight", + "ref": "extra-bold", + "value": "800" + }, + "field-default-width-extra-large": { + "prop": "--spectrum-field-default-width-extra-large", + "desktop": { + "value": "240px" + }, + "mobile": { + "value": "288px" + } + }, + "field-default-width-large": { + "prop": "--spectrum-field-default-width-large", + "desktop": { + "value": "224px" + }, + "mobile": { + "value": "272px" + } + }, + "field-default-width-medium": { + "prop": "--spectrum-field-default-width-medium", + "desktop": { + "value": "208px" + }, + "mobile": { + "value": "256px" + } + }, + "field-default-width-small": { + "prop": "--spectrum-field-default-width-small", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "field-edge-to-alert-icon-extra-large": { + "prop": "--spectrum-field-edge-to-alert-icon-extra-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "field-edge-to-alert-icon-large": { + "prop": "--spectrum-field-edge-to-alert-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "field-edge-to-alert-icon-medium": { + "prop": "--spectrum-field-edge-to-alert-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "field-edge-to-alert-icon-quiet": { + "prop": "--spectrum-field-edge-to-alert-icon-quiet", + "value": "0px" + }, + "field-edge-to-alert-icon-small": { + "prop": "--spectrum-field-edge-to-alert-icon-small", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "field-edge-to-border-quiet": { + "prop": "--spectrum-field-edge-to-border-quiet", + "value": "0px" + }, + "field-edge-to-disclosure-icon-100": { + "prop": "--spectrum-field-edge-to-disclosure-icon-100", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "field-edge-to-disclosure-icon-200": { + "prop": "--spectrum-field-edge-to-disclosure-icon-200", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "field-edge-to-disclosure-icon-300": { + "prop": "--spectrum-field-edge-to-disclosure-icon-300", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "field-edge-to-disclosure-icon-75": { + "prop": "--spectrum-field-edge-to-disclosure-icon-75", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "field-edge-to-text-quiet": { + "prop": "--spectrum-field-edge-to-text-quiet", + "value": "0px" + }, + "field-edge-to-validation-icon-extra-large": { + "prop": "--spectrum-field-edge-to-validation-icon-extra-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "field-edge-to-validation-icon-large": { + "prop": "--spectrum-field-edge-to-validation-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "field-edge-to-validation-icon-medium": { + "prop": "--spectrum-field-edge-to-validation-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "field-edge-to-validation-icon-quiet": { + "prop": "--spectrum-field-edge-to-validation-icon-quiet", + "value": "0px" + }, + "field-edge-to-validation-icon-small": { + "prop": "--spectrum-field-edge-to-validation-icon-small", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "field-edge-to-visual-quiet": { + "prop": "--spectrum-field-edge-to-visual-quiet", + "value": "0px" + }, + "field-end-edge-to-disclosure-icon-100": { + "prop": "--spectrum-field-end-edge-to-disclosure-icon-100", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "field-end-edge-to-disclosure-icon-200": { + "prop": "--spectrum-field-end-edge-to-disclosure-icon-200", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "field-end-edge-to-disclosure-icon-300": { + "prop": "--spectrum-field-end-edge-to-disclosure-icon-300", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "field-end-edge-to-disclosure-icon-75": { + "prop": "--spectrum-field-end-edge-to-disclosure-icon-75", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "field-label-text-to-asterisk-extra-large": { + "prop": "--spectrum-field-label-text-to-asterisk-extra-large", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "field-label-text-to-asterisk-large": { + "prop": "--spectrum-field-label-text-to-asterisk-large", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "field-label-text-to-asterisk-medium": { + "prop": "--spectrum-field-label-text-to-asterisk-medium", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "field-label-text-to-asterisk-small": { + "prop": "--spectrum-field-label-text-to-asterisk-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "field-label-to-component": { + "prop": "--spectrum-field-label-to-component", + "value": "0px" + }, + "field-label-to-component-quiet-extra-large": { + "prop": "--spectrum-field-label-to-component-quiet-extra-large", + "desktop": { + "value": "-15px" + }, + "mobile": { + "value": "-19px" + } + }, + "field-label-to-component-quiet-large": { + "prop": "--spectrum-field-label-to-component-quiet-large", + "desktop": { + "value": "-12px" + }, + "mobile": { + "value": "-15px" + } + }, + "field-label-to-component-quiet-medium": { + "prop": "--spectrum-field-label-to-component-quiet-medium", + "desktop": { + "value": "-8px" + }, + "mobile": { + "value": "-10px" + } + }, + "field-label-to-component-quiet-small": { + "prop": "--spectrum-field-label-to-component-quiet-small", + "desktop": { + "value": "-8px" + }, + "mobile": { + "value": "-10px" + } + }, + "field-label-top-margin-extra-large": { + "prop": "--spectrum-field-label-top-margin-extra-large", + "value": "0px" + }, + "field-label-top-margin-large": { + "prop": "--spectrum-field-label-top-margin-large", + "value": "0px" + }, + "field-label-top-margin-medium": { + "prop": "--spectrum-field-label-top-margin-medium", + "value": "0px" + }, + "field-label-top-margin-small": { + "prop": "--spectrum-field-label-top-margin-small", + "value": "0px" + }, + "field-label-top-to-asterisk-extra-large": { + "prop": "--spectrum-field-label-top-to-asterisk-extra-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "24px" + } + }, + "field-label-top-to-asterisk-large": { + "prop": "--spectrum-field-label-top-to-asterisk-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "field-label-top-to-asterisk-medium": { + "prop": "--spectrum-field-label-top-to-asterisk-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "field-label-top-to-asterisk-small": { + "prop": "--spectrum-field-label-top-to-asterisk-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "11px" + } + }, + "field-text-to-alert-icon-extra-large": { + "prop": "--spectrum-field-text-to-alert-icon-extra-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "field-text-to-alert-icon-large": { + "prop": "--spectrum-field-text-to-alert-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "field-text-to-alert-icon-medium": { + "prop": "--spectrum-field-text-to-alert-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "field-text-to-alert-icon-small": { + "prop": "--spectrum-field-text-to-alert-icon-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "field-text-to-validation-icon-extra-large": { + "prop": "--spectrum-field-text-to-validation-icon-extra-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "field-text-to-validation-icon-large": { + "prop": "--spectrum-field-text-to-validation-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "field-text-to-validation-icon-medium": { + "prop": "--spectrum-field-text-to-validation-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "field-text-to-validation-icon-small": { + "prop": "--spectrum-field-text-to-validation-icon-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "field-top-to-alert-icon-extra-large": { + "prop": "--spectrum-field-top-to-alert-icon-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "16px" + } + }, + "field-top-to-alert-icon-large": { + "prop": "--spectrum-field-top-to-alert-icon-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "field-top-to-alert-icon-medium": { + "prop": "--spectrum-field-top-to-alert-icon-medium", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "field-top-to-alert-icon-small": { + "prop": "--spectrum-field-top-to-alert-icon-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "field-top-to-disclosure-icon-100": { + "prop": "--spectrum-field-top-to-disclosure-icon-100", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "field-top-to-disclosure-icon-200": { + "prop": "--spectrum-field-top-to-disclosure-icon-200", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "field-top-to-disclosure-icon-300": { + "prop": "--spectrum-field-top-to-disclosure-icon-300", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "field-top-to-disclosure-icon-75": { + "prop": "--spectrum-field-top-to-disclosure-icon-75", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "field-top-to-progress-circle-extra-large": { + "prop": "--spectrum-field-top-to-progress-circle-extra-large", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "field-top-to-progress-circle-large": { + "prop": "--spectrum-field-top-to-progress-circle-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "field-top-to-progress-circle-medium": { + "prop": "--spectrum-field-top-to-progress-circle-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "field-top-to-progress-circle-small": { + "prop": "--spectrum-field-top-to-progress-circle-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "6px" + } + }, + "field-top-to-validation-icon-extra-large": { + "prop": "--spectrum-field-top-to-validation-icon-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "field-top-to-validation-icon-large": { + "prop": "--spectrum-field-top-to-validation-icon-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "field-top-to-validation-icon-medium": { + "prop": "--spectrum-field-top-to-validation-icon-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "field-top-to-validation-icon-small": { + "prop": "--spectrum-field-top-to-validation-icon-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "field-width": { + "prop": "--spectrum-field-width", + "ref": "var(--spectrum-field-width-small)", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "field-width-extra-large": { + "prop": "--spectrum-field-width-extra-large", + "ref": "var(--spectrum-field-default-width-extra-large)", + "desktop": { + "value": "240px" + }, + "mobile": { + "value": "288px" + } + }, + "field-width-large": { + "prop": "--spectrum-field-width-large", + "ref": "var(--spectrum-field-default-width-large)", + "desktop": { + "value": "224px" + }, + "mobile": { + "value": "272px" + } + }, + "field-width-medium": { + "prop": "--spectrum-field-width-medium", + "ref": "var(--spectrum-field-default-width-medium)", + "desktop": { + "value": "208px" + }, + "mobile": { + "value": "256px" + } + }, + "field-width-small": { + "prop": "--spectrum-field-width-small", + "ref": "var(--spectrum-field-default-width-small)", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "floating-action-button-drop-shadow-blur": { + "prop": "--spectrum-floating-action-button-drop-shadow-blur", + "value": "12px" + }, + "floating-action-button-drop-shadow-color": { + "prop": "--spectrum-floating-action-button-drop-shadow-color", + "ref": "var(--spectrum-transparent-black-300)", + "value": "rgba(0, 0, 0, 0.15)" + }, + "floating-action-button-drop-shadow-y": { + "prop": "--spectrum-floating-action-button-drop-shadow-y", + "value": "4px" + }, + "floating-action-button-shadow-color": { + "prop": "--spectrum-floating-action-button-shadow-color", + "ref": "var(--spectrum-floating-action-button-drop-shadow-color)", + "value": "rgba(0, 0, 0, 0.15)" + }, + "focus-indicator-color": { + "prop": "--spectrum-focus-indicator-color", + "ref": "var(--spectrum-blue-800)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "focus-indicator-gap": { + "prop": "--spectrum-focus-indicator-gap", + "value": "2px" + }, + "focus-indicator-thickness": { + "prop": "--spectrum-focus-indicator-thickness", + "value": "2px" + }, + "font-family": { + "prop": "--spectrum-font-family", + "ref": "var(--spectrum-sans-font-family-stack)", + "value": "adobe-clean, var(--spectrum-sans-serif-font-family), \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "font-family-ar": { + "prop": "--spectrum-font-family-ar", + "value": "myriad-arabic, adobe-clean, \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "font-family-he": { + "prop": "--spectrum-font-family-he", + "value": "myriad-hebrew, adobe-clean, \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "font-size": { + "prop": "--spectrum-font-size", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "font-size-100": { + "prop": "--spectrum-font-size-100", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "font-size-1000": { + "prop": "--spectrum-font-size-1000", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "49px" + } + }, + "font-size-1100": { + "prop": "--spectrum-font-size-1100", + "desktop": { + "value": "45px" + }, + "mobile": { + "value": "55px" + } + }, + "font-size-1200": { + "prop": "--spectrum-font-size-1200", + "desktop": { + "value": "51px" + }, + "mobile": { + "value": "62px" + } + }, + "font-size-1300": { + "prop": "--spectrum-font-size-1300", + "desktop": { + "value": "58px" + }, + "mobile": { + "value": "70px" + } + }, + "font-size-1400": { + "prop": "--spectrum-font-size-1400", + "desktop": { + "value": "65px" + }, + "mobile": { + "value": "79px" + } + }, + "font-size-1500": { + "prop": "--spectrum-font-size-1500", + "desktop": { + "value": "73px" + }, + "mobile": { + "value": "88px" + } + }, + "font-size-200": { + "prop": "--spectrum-font-size-200", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "font-size-25": { + "prop": "--spectrum-font-size-25", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "font-size-300": { + "prop": "--spectrum-font-size-300", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "font-size-400": { + "prop": "--spectrum-font-size-400", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "font-size-50": { + "prop": "--spectrum-font-size-50", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "font-size-500": { + "prop": "--spectrum-font-size-500", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "27px" + } + }, + "font-size-600": { + "prop": "--spectrum-font-size-600", + "desktop": { + "value": "25px" + }, + "mobile": { + "value": "31px" + } + }, + "font-size-700": { + "prop": "--spectrum-font-size-700", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "34px" + } + }, + "font-size-75": { + "prop": "--spectrum-font-size-75", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "font-size-800": { + "prop": "--spectrum-font-size-800", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "39px" + } + }, + "font-size-900": { + "prop": "--spectrum-font-size-900", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "44px" + } + }, + "font-style": { + "prop": "--spectrum-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "fuchsia-100": { + "prop": "--spectrum-fuchsia-100", + "light": { + "value": "rgb(254, 246, 255)" + }, + "dark": { + "value": "rgb(50, 0, 61)" + } + }, + "fuchsia-1000": { + "prop": "--spectrum-fuchsia-1000", + "light": { + "value": "rgb(156, 40, 175)" + }, + "dark": { + "value": "rgb(232, 91, 253)" + } + }, + "fuchsia-1100": { + "prop": "--spectrum-fuchsia-1100", + "light": { + "value": "rgb(135, 27, 154)" + }, + "dark": { + "value": "rgb(240, 122, 255)" + } + }, + "fuchsia-1200": { + "prop": "--spectrum-fuchsia-1200", + "light": { + "value": "rgb(113, 15, 131)" + }, + "dark": { + "value": "rgb(245, 159, 255)" + } + }, + "fuchsia-1300": { + "prop": "--spectrum-fuchsia-1300", + "light": { + "value": "rgb(92, 4, 109)" + }, + "dark": { + "value": "rgb(248, 191, 255)" + } + }, + "fuchsia-1400": { + "prop": "--spectrum-fuchsia-1400", + "light": { + "value": "rgb(72, 0, 88)" + }, + "dark": { + "value": "rgb(251, 219, 255)" + } + }, + "fuchsia-1500": { + "prop": "--spectrum-fuchsia-1500", + "dark": { + "value": "rgb(253, 241, 255)" + }, + "light": { + "value": "rgb(54, 0, 66)" + } + }, + "fuchsia-1600": { + "prop": "--spectrum-fuchsia-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(29, 0, 35)" + } + }, + "fuchsia-200": { + "prop": "--spectrum-fuchsia-200", + "light": { + "value": "rgb(253, 233, 255)" + }, + "dark": { + "value": "rgb(61, 0, 74)" + } + }, + "fuchsia-300": { + "prop": "--spectrum-fuchsia-300", + "light": { + "value": "rgb(250, 211, 255)" + }, + "dark": { + "value": "rgb(79, 0, 95)" + } + }, + "fuchsia-400": { + "prop": "--spectrum-fuchsia-400", + "light": { + "value": "rgb(247, 181, 255)" + }, + "dark": { + "value": "rgb(102, 9, 120)" + } + }, + "fuchsia-500": { + "prop": "--spectrum-fuchsia-500", + "light": { + "value": "rgb(243, 147, 255)" + }, + "dark": { + "value": "rgb(127, 23, 146)" + } + }, + "fuchsia-600": { + "prop": "--spectrum-fuchsia-600", + "light": { + "value": "rgb(236, 105, 255)" + }, + "dark": { + "value": "rgb(151, 38, 170)" + } + }, + "fuchsia-700": { + "prop": "--spectrum-fuchsia-700", + "light": { + "value": "rgb(223, 77, 245)" + }, + "dark": { + "value": "rgb(173, 51, 192)" + } + }, + "fuchsia-800": { + "prop": "--spectrum-fuchsia-800", + "light": { + "value": "rgb(200, 68, 220)" + }, + "dark": { + "value": "rgb(186, 60, 206)" + } + }, + "fuchsia-900": { + "prop": "--spectrum-fuchsia-900", + "light": { + "value": "rgb(181, 57, 200)" + }, + "dark": { + "value": "rgb(213, 73, 235)" + } + }, + "fuchsia-background-color-default": { + "prop": "--spectrum-fuchsia-background-color-default", + "ref": "var(--spectrum-fuchsia-800)", + "light": { + "value": "rgb(181, 57, 200)" + }, + "dark": { + "value": "rgb(186, 60, 206)" + } + }, + "fuchsia-subtle-background-color-default": { + "prop": "--spectrum-fuchsia-subtle-background-color-default", + "ref": "var(--spectrum-fuchsia-300)", + "light": { + "value": "rgb(253, 233, 255)" + }, + "dark": { + "value": "rgb(79, 0, 95)" + } + }, + "fuchsia-visual-color": { + "prop": "--spectrum-fuchsia-visual-color", + "ref": "var(--spectrum-fuchsia-900)", + "light": { + "value": "rgb(200, 68, 220)" + }, + "dark": { + "value": "rgb(213, 73, 235)" + } + }, + "gradient-stop-1-genai": { + "prop": "--spectrum-gradient-stop-1-genai", + "value": 0 + }, + "gradient-stop-1-premium": { + "prop": "--spectrum-gradient-stop-1-premium", + "value": 0 + }, + "gradient-stop-2-genai": { + "prop": "--spectrum-gradient-stop-2-genai", + "value": 0.3333 + }, + "gradient-stop-2-premium": { + "prop": "--spectrum-gradient-stop-2-premium", + "value": 0.6666 + }, + "gradient-stop-3-genai": { + "prop": "--spectrum-gradient-stop-3-genai", + "value": 1 + }, + "gradient-stop-3-premium": { + "prop": "--spectrum-gradient-stop-3-premium", + "value": 1 + }, + "gray-100": { + "prop": "--spectrum-gray-100", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "gray-1000": { + "prop": "--spectrum-gray-1000", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 0, 0)" + } + }, + "gray-200": { + "prop": "--spectrum-gray-200", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "gray-25": { + "prop": "--spectrum-gray-25", + "dark": { + "value": "rgb(17, 17, 17)" + }, + "light": { + "value": "rgb(255, 255, 255)" + } + }, + "gray-300": { + "prop": "--spectrum-gray-300", + "light": { + "value": "rgb(218, 218, 218)" + }, + "dark": { + "value": "rgb(57, 57, 57)" + } + }, + "gray-400": { + "prop": "--spectrum-gray-400", + "light": { + "value": "rgb(198, 198, 198)" + }, + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "gray-50": { + "prop": "--spectrum-gray-50", + "light": { + "value": "rgb(248, 248, 248)" + }, + "dark": { + "value": "rgb(27, 27, 27)" + } + }, + "gray-500": { + "prop": "--spectrum-gray-500", + "light": { + "value": "rgb(143, 143, 143)" + }, + "dark": { + "value": "rgb(109, 109, 109)" + } + }, + "gray-600": { + "prop": "--spectrum-gray-600", + "light": { + "value": "rgb(113, 113, 113)" + }, + "dark": { + "value": "rgb(138, 138, 138)" + } + }, + "gray-700": { + "prop": "--spectrum-gray-700", + "light": { + "value": "rgb(80, 80, 80)" + }, + "dark": { + "value": "rgb(175, 175, 175)" + } + }, + "gray-75": { + "prop": "--spectrum-gray-75", + "light": { + "value": "rgb(243, 243, 243)" + }, + "dark": { + "value": "rgb(34, 34, 34)" + } + }, + "gray-800": { + "prop": "--spectrum-gray-800", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "gray-900": { + "prop": "--spectrum-gray-900", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "gray-background-color-default": { + "prop": "--spectrum-gray-background-color-default", + "ref": "var(--spectrum-gray-500)", + "light": { + "value": "rgb(80, 80, 80)" + }, + "dark": { + "value": "rgb(109, 109, 109)" + } + }, + "gray-subtle-background-color-default": { + "prop": "--spectrum-gray-subtle-background-color-default", + "ref": "var(--spectrum-gray-300)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(57, 57, 57)" + } + }, + "gray-visual-color": { + "prop": "--spectrum-gray-visual-color", + "ref": "var(--spectrum-gray-600)", + "light": { + "value": "rgb(143, 143, 143)" + }, + "dark": { + "value": "rgb(138, 138, 138)" + } + }, + "green-100": { + "prop": "--spectrum-green-100", + "light": { + "value": "rgb(237, 252, 241)" + }, + "dark": { + "value": "rgb(0, 30, 23)" + } + }, + "green-1000": { + "prop": "--spectrum-green-1000", + "light": { + "value": "rgb(3, 110, 69)" + }, + "dark": { + "value": "rgb(14, 175, 98)" + } + }, + "green-1100": { + "prop": "--spectrum-green-1100", + "light": { + "value": "rgb(2, 93, 60)" + }, + "dark": { + "value": "rgb(24, 193, 110)" + } + }, + "green-1200": { + "prop": "--spectrum-green-1200", + "light": { + "value": "rgb(1, 76, 52)" + }, + "dark": { + "value": "rgb(57, 215, 134)" + } + }, + "green-1300": { + "prop": "--spectrum-green-1300", + "light": { + "value": "rgb(0, 61, 44)" + }, + "dark": { + "value": "rgb(126, 231, 172)" + } + }, + "green-1400": { + "prop": "--spectrum-green-1400", + "light": { + "value": "rgb(0, 46, 34)" + }, + "dark": { + "value": "rgb(189, 241, 208)" + } + }, + "green-1500": { + "prop": "--spectrum-green-1500", + "dark": { + "value": "rgb(229, 250, 236)" + }, + "light": { + "value": "rgb(0, 33, 25)" + } + }, + "green-1600": { + "prop": "--spectrum-green-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 15, 12)" + } + }, + "green-200": { + "prop": "--spectrum-green-200", + "light": { + "value": "rgb(215, 247, 225)" + }, + "dark": { + "value": "rgb(0, 38, 29)" + } + }, + "green-300": { + "prop": "--spectrum-green-300", + "light": { + "value": "rgb(173, 238, 197)" + }, + "dark": { + "value": "rgb(0, 51, 38)" + } + }, + "green-400": { + "prop": "--spectrum-green-400", + "light": { + "value": "rgb(107, 227, 162)" + }, + "dark": { + "value": "rgb(0, 68, 48)" + } + }, + "green-500": { + "prop": "--spectrum-green-500", + "light": { + "value": "rgb(43, 209, 125)" + }, + "dark": { + "value": "rgb(2, 87, 58)" + } + }, + "green-600": { + "prop": "--spectrum-green-600", + "light": { + "value": "rgb(18, 184, 103)" + }, + "dark": { + "value": "rgb(3, 106, 67)" + } + }, + "green-700": { + "prop": "--spectrum-green-700", + "light": { + "value": "rgb(11, 164, 93)" + }, + "dark": { + "value": "rgb(4, 124, 75)" + } + }, + "green-800": { + "prop": "--spectrum-green-800", + "light": { + "value": "rgb(7, 147, 85)" + }, + "dark": { + "value": "rgb(6, 136, 80)" + } + }, + "green-900": { + "prop": "--spectrum-green-900", + "light": { + "value": "rgb(5, 131, 78)" + }, + "dark": { + "value": "rgb(9, 157, 89)" + } + }, + "green-background-color-default": { + "prop": "--spectrum-green-background-color-default", + "ref": "var(--spectrum-green-800)", + "light": { + "value": "rgb(5, 131, 78)" + }, + "dark": { + "value": "rgb(6, 136, 80)" + } + }, + "green-subtle-background-color-default": { + "prop": "--spectrum-green-subtle-background-color-default", + "ref": "var(--spectrum-green-300)", + "light": { + "value": "rgb(215, 247, 225)" + }, + "dark": { + "value": "rgb(0, 51, 38)" + } + }, + "green-visual-color": { + "prop": "--spectrum-green-visual-color", + "ref": "var(--spectrum-green-800)", + "light": { + "value": "rgb(11, 164, 93)" + }, + "dark": { + "value": "rgb(6, 136, 80)" + } + }, + "gripper-icon-size-100": { + "prop": "--spectrum-gripper-icon-size-100", + "value": "24px" + }, + "heading-cjk-emphasized-font-style": { + "prop": "--spectrum-heading-cjk-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-emphasized-font-weight": { + "prop": "--spectrum-heading-cjk-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-cjk-font-family": { + "prop": "--spectrum-heading-cjk-font-family", + "ref": "var(--spectrum-cjk-font-family)", + "value": "Adobe Clean Han" + }, + "heading-cjk-font-style": { + "prop": "--spectrum-heading-cjk-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-font-weight": { + "prop": "--spectrum-heading-cjk-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "heading-cjk-heavy-emphasized-font-style": { + "prop": "--spectrum-heading-cjk-heavy-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-heavy-emphasized-font-weight": { + "prop": "--spectrum-heading-cjk-heavy-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-cjk-heavy-font-style": { + "prop": "--spectrum-heading-cjk-heavy-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-heavy-font-weight": { + "prop": "--spectrum-heading-cjk-heavy-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "heading-cjk-heavy-strong-emphasized-font-style": { + "prop": "--spectrum-heading-cjk-heavy-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-heavy-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-cjk-heavy-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-cjk-heavy-strong-font-style": { + "prop": "--spectrum-heading-cjk-heavy-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-heavy-strong-font-weight": { + "prop": "--spectrum-heading-cjk-heavy-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-cjk-light-emphasized-font-style": { + "prop": "--spectrum-heading-cjk-light-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-light-emphasized-font-weight": { + "prop": "--spectrum-heading-cjk-light-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "heading-cjk-light-font-style": { + "prop": "--spectrum-heading-cjk-light-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-light-font-weight": { + "prop": "--spectrum-heading-cjk-light-font-weight", + "ref": "var(--spectrum-light-font-weight)", + "value": "300" + }, + "heading-cjk-light-strong-emphasized-font-style": { + "prop": "--spectrum-heading-cjk-light-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-light-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-cjk-light-strong-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "heading-cjk-light-strong-font-style": { + "prop": "--spectrum-heading-cjk-light-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-light-strong-font-weight": { + "prop": "--spectrum-heading-cjk-light-strong-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "heading-cjk-line-height": { + "prop": "--spectrum-heading-cjk-line-height", + "ref": "var(--spectrum-cjk-line-height-100)", + "value": 1.5 + }, + "heading-cjk-size-l": { + "prop": "--spectrum-heading-cjk-size-l", + "ref": "var(--spectrum-font-size-600)", + "desktop": { + "value": "25px" + }, + "mobile": { + "value": "31px" + } + }, + "heading-cjk-size-m": { + "prop": "--spectrum-heading-cjk-size-m", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "heading-cjk-size-s": { + "prop": "--spectrum-heading-cjk-size-s", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "heading-cjk-size-xl": { + "prop": "--spectrum-heading-cjk-size-xl", + "ref": "var(--spectrum-font-size-800)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "39px" + } + }, + "heading-cjk-size-xs": { + "prop": "--spectrum-heading-cjk-size-xs", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "heading-cjk-size-xxl": { + "prop": "--spectrum-heading-cjk-size-xxl", + "ref": "var(--spectrum-font-size-1000)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "49px" + } + }, + "heading-cjk-size-xxs": { + "prop": "--spectrum-heading-cjk-size-xxs", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "heading-cjk-size-xxxl": { + "prop": "--spectrum-heading-cjk-size-xxxl", + "ref": "var(--spectrum-font-size-1200)", + "desktop": { + "value": "51px" + }, + "mobile": { + "value": "62px" + } + }, + "heading-cjk-size-xxxxl": { + "prop": "--spectrum-heading-cjk-size-xxxxl", + "ref": "var(--spectrum-font-size-1400)", + "desktop": { + "value": "65px" + }, + "mobile": { + "value": "79px" + } + }, + "heading-cjk-strong-emphasized-font-style": { + "prop": "--spectrum-heading-cjk-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-cjk-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-cjk-strong-font-style": { + "prop": "--spectrum-heading-cjk-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-cjk-strong-font-weight": { + "prop": "--spectrum-heading-cjk-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-color": { + "prop": "--spectrum-heading-color", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "heading-line-height": { + "prop": "--spectrum-heading-line-height", + "ref": "var(--spectrum-line-height-100)", + "value": 1.3 + }, + "heading-margin-bottom-multiplier": { + "prop": "--spectrum-heading-margin-bottom-multiplier", + "value": 0.25 + }, + "heading-margin-top-multiplier": { + "prop": "--spectrum-heading-margin-top-multiplier", + "value": 0.88888889 + }, + "heading-sans-serif-emphasized-font-style": { + "prop": "--spectrum-heading-sans-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-sans-serif-emphasized-font-weight": { + "prop": "--spectrum-heading-sans-serif-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "heading-sans-serif-font-family": { + "prop": "--spectrum-heading-sans-serif-font-family", + "ref": "var(--spectrum-sans-serif-font-family)", + "value": "Adobe Clean" + }, + "heading-sans-serif-font-style": { + "prop": "--spectrum-heading-sans-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-sans-serif-font-weight": { + "prop": "--spectrum-heading-sans-serif-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "heading-sans-serif-heavy-emphasized-font-style": { + "prop": "--spectrum-heading-sans-serif-heavy-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-sans-serif-heavy-emphasized-font-weight": { + "prop": "--spectrum-heading-sans-serif-heavy-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-sans-serif-heavy-font-style": { + "prop": "--spectrum-heading-sans-serif-heavy-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-sans-serif-heavy-font-weight": { + "prop": "--spectrum-heading-sans-serif-heavy-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-sans-serif-heavy-strong-emphasized-font-style": { + "prop": "--spectrum-heading-sans-serif-heavy-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-sans-serif-heavy-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-sans-serif-heavy-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-sans-serif-heavy-strong-font-style": { + "prop": "--spectrum-heading-sans-serif-heavy-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-sans-serif-heavy-strong-font-weight": { + "prop": "--spectrum-heading-sans-serif-heavy-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-sans-serif-light-emphasized-font-style": { + "prop": "--spectrum-heading-sans-serif-light-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-sans-serif-light-emphasized-font-weight": { + "prop": "--spectrum-heading-sans-serif-light-emphasized-font-weight", + "ref": "var(--spectrum-light-font-weight)", + "value": "300" + }, + "heading-sans-serif-light-font-style": { + "prop": "--spectrum-heading-sans-serif-light-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-sans-serif-light-font-weight": { + "prop": "--spectrum-heading-sans-serif-light-font-weight", + "ref": "var(--spectrum-light-font-weight)", + "value": "300" + }, + "heading-sans-serif-light-strong-emphasized-font-style": { + "prop": "--spectrum-heading-sans-serif-light-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-sans-serif-light-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-sans-serif-light-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "heading-sans-serif-light-strong-font-style": { + "prop": "--spectrum-heading-sans-serif-light-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-sans-serif-light-strong-font-weight": { + "prop": "--spectrum-heading-sans-serif-light-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "heading-sans-serif-strong-emphasized-font-style": { + "prop": "--spectrum-heading-sans-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-sans-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-sans-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-sans-serif-strong-font-style": { + "prop": "--spectrum-heading-sans-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-sans-serif-strong-font-weight": { + "prop": "--spectrum-heading-sans-serif-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-serif-emphasized-font-style": { + "prop": "--spectrum-heading-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-serif-emphasized-font-weight": { + "prop": "--spectrum-heading-serif-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "heading-serif-font-family": { + "prop": "--spectrum-heading-serif-font-family", + "ref": "var(--spectrum-serif-font-family)", + "value": "Adobe Clean Serif" + }, + "heading-serif-font-style": { + "prop": "--spectrum-heading-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-serif-font-weight": { + "prop": "--spectrum-heading-serif-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "heading-serif-heavy-emphasized-font-style": { + "prop": "--spectrum-heading-serif-heavy-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-serif-heavy-emphasized-font-weight": { + "prop": "--spectrum-heading-serif-heavy-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-serif-heavy-font-style": { + "prop": "--spectrum-heading-serif-heavy-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-serif-heavy-font-weight": { + "prop": "--spectrum-heading-serif-heavy-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-serif-heavy-strong-emphasized-font-style": { + "prop": "--spectrum-heading-serif-heavy-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-serif-heavy-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-serif-heavy-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-serif-heavy-strong-font-style": { + "prop": "--spectrum-heading-serif-heavy-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-serif-heavy-strong-font-weight": { + "prop": "--spectrum-heading-serif-heavy-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-serif-light-emphasized-font-style": { + "prop": "--spectrum-heading-serif-light-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-serif-light-emphasized-font-weight": { + "prop": "--spectrum-heading-serif-light-emphasized-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "heading-serif-light-font-style": { + "prop": "--spectrum-heading-serif-light-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-serif-light-font-weight": { + "prop": "--spectrum-heading-serif-light-font-weight", + "ref": "var(--spectrum-regular-font-weight)", + "value": "400" + }, + "heading-serif-light-strong-emphasized-font-style": { + "prop": "--spectrum-heading-serif-light-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-serif-light-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-serif-light-strong-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "heading-serif-light-strong-font-style": { + "prop": "--spectrum-heading-serif-light-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-serif-light-strong-font-weight": { + "prop": "--spectrum-heading-serif-light-strong-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "heading-serif-strong-emphasized-font-style": { + "prop": "--spectrum-heading-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "heading-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-heading-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-serif-strong-font-style": { + "prop": "--spectrum-heading-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "heading-serif-strong-font-weight": { + "prop": "--spectrum-heading-serif-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "heading-size-l": { + "prop": "--spectrum-heading-size-l", + "ref": "var(--spectrum-font-size-700)", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "34px" + } + }, + "heading-size-m": { + "prop": "--spectrum-heading-size-m", + "ref": "var(--spectrum-font-size-500)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "27px" + } + }, + "heading-size-s": { + "prop": "--spectrum-heading-size-s", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "heading-size-xl": { + "prop": "--spectrum-heading-size-xl", + "ref": "var(--spectrum-font-size-900)", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "44px" + } + }, + "heading-size-xs": { + "prop": "--spectrum-heading-size-xs", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "heading-size-xxl": { + "prop": "--spectrum-heading-size-xxl", + "ref": "var(--spectrum-font-size-1100)", + "desktop": { + "value": "45px" + }, + "mobile": { + "value": "55px" + } + }, + "heading-size-xxs": { + "prop": "--spectrum-heading-size-xxs", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "heading-size-xxxl": { + "prop": "--spectrum-heading-size-xxxl", + "ref": "var(--spectrum-font-size-1300)", + "desktop": { + "value": "58px" + }, + "mobile": { + "value": "70px" + } + }, + "heading-size-xxxxl": { + "prop": "--spectrum-heading-size-xxxxl", + "ref": "var(--spectrum-font-size-1500)", + "desktop": { + "value": "73px" + }, + "mobile": { + "value": "88px" + } + }, + "help-text-to-component": { + "prop": "--spectrum-help-text-to-component", + "value": "0px" + }, + "help-text-top-to-workflow-icon-extra-large": { + "prop": "--spectrum-help-text-top-to-workflow-icon-extra-large", + "ref": "var(--spectrum-component-top-to-workflow-icon-300)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "15px" + } + }, + "help-text-top-to-workflow-icon-large": { + "prop": "--spectrum-help-text-top-to-workflow-icon-large", + "ref": "var(--spectrum-component-top-to-workflow-icon-200)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "help-text-top-to-workflow-icon-medium": { + "prop": "--spectrum-help-text-top-to-workflow-icon-medium", + "ref": "var(--spectrum-component-top-to-workflow-icon-100)", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "help-text-top-to-workflow-icon-small": { + "prop": "--spectrum-help-text-top-to-workflow-icon-small", + "ref": "var(--spectrum-component-top-to-workflow-icon-75)", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "6px" + } + }, + "icon-color-blue-background": { + "prop": "--spectrum-icon-color-blue-background", + "ref": "var(--spectrum-blue-300)", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "icon-color-blue-primary-default": { + "prop": "--spectrum-icon-color-blue-primary-default", + "ref": "var(--spectrum-blue-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "icon-color-blue-primary-down": { + "prop": "--spectrum-icon-color-blue-primary-down", + "ref": "var(--spectrum-blue-1000)", + "light": { + "value": "rgb(29, 62, 207)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "icon-color-blue-primary-hover": { + "prop": "--spectrum-icon-color-blue-primary-hover", + "ref": "var(--spectrum-blue-900)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "icon-color-brown-background": { + "prop": "--spectrum-icon-color-brown-background", + "ref": "var(--spectrum-brown-400)", + "light": { + "value": "rgb(247, 238, 225)" + }, + "dark": { + "value": "rgb(78, 55, 19)" + } + }, + "icon-color-brown-primary-default": { + "prop": "--spectrum-icon-color-brown-primary-default", + "ref": "var(--spectrum-brown-700)", + "light": { + "value": "rgb(154, 123, 77)" + }, + "dark": { + "value": "rgb(132, 104, 61)" + } + }, + "icon-color-brown-primary-down": { + "prop": "--spectrum-icon-color-brown-primary-down", + "ref": "var(--spectrum-brown-900)", + "light": { + "value": "rgb(119, 91, 50)" + }, + "dark": { + "value": "rgb(163, 132, 84)" + } + }, + "icon-color-brown-primary-hover": { + "prop": "--spectrum-icon-color-brown-primary-hover", + "ref": "var(--spectrum-brown-800)", + "light": { + "value": "rgb(139, 109, 66)" + }, + "dark": { + "value": "rgb(143, 114, 69)" + } + }, + "icon-color-celery-background": { + "prop": "--spectrum-icon-color-celery-background", + "ref": "var(--spectrum-celery-400)", + "light": { + "value": "rgb(235, 255, 220)" + }, + "dark": { + "value": "rgb(31, 67, 4)" + } + }, + "icon-color-celery-primary-default": { + "prop": "--spectrum-icon-color-celery-primary-default", + "ref": "var(--spectrum-celery-900)", + "light": { + "value": "rgb(82, 161, 25)" + }, + "dark": { + "value": "rgb(78, 154, 23)" + } + }, + "icon-color-celery-primary-down": { + "prop": "--spectrum-icon-color-celery-primary-down", + "ref": "var(--spectrum-celery-1100)", + "light": { + "value": "rgb(64, 129, 17)" + }, + "dark": { + "value": "rgb(100, 190, 35)" + } + }, + "icon-color-celery-primary-hover": { + "prop": "--spectrum-icon-color-celery-primary-hover", + "ref": "var(--spectrum-celery-1000)", + "light": { + "value": "rgb(72, 144, 20)" + }, + "dark": { + "value": "rgb(88, 172, 28)" + } + }, + "icon-color-chartreuse-background": { + "prop": "--spectrum-icon-color-chartreuse-background", + "ref": "var(--spectrum-chartreuse-400)", + "light": { + "value": "rgb(234, 246, 173)" + }, + "dark": { + "value": "rgb(53, 63, 0)" + } + }, + "icon-color-chartreuse-primary-default": { + "prop": "--spectrum-icon-color-chartreuse-primary-default", + "ref": "var(--spectrum-chartreuse-1000)", + "light": { + "value": "rgb(143, 172, 0)" + }, + "dark": { + "value": "rgb(136, 164, 0)" + } + }, + "icon-color-chartreuse-primary-down": { + "prop": "--spectrum-icon-color-chartreuse-primary-down", + "ref": "var(--spectrum-chartreuse-1200)", + "light": { + "value": "rgb(114, 137, 0)" + }, + "dark": { + "value": "rgb(169, 203, 0)" + } + }, + "icon-color-chartreuse-primary-hover": { + "prop": "--spectrum-icon-color-chartreuse-primary-hover", + "ref": "var(--spectrum-chartreuse-1100)", + "light": { + "value": "rgb(128, 153, 0)" + }, + "dark": { + "value": "rgb(151, 181, 0)" + } + }, + "icon-color-cinnamon-background": { + "prop": "--spectrum-icon-color-cinnamon-background", + "ref": "var(--spectrum-cinnamon-300)", + "light": { + "value": "rgb(249, 236, 229)" + }, + "dark": { + "value": "rgb(79, 28, 7)" + } + }, + "icon-color-cinnamon-primary-default": { + "prop": "--spectrum-icon-color-cinnamon-primary-default", + "ref": "var(--spectrum-cinnamon-800)", + "dark": { + "value": "rgb(176, 98, 59)" + }, + "light": { + "value": "rgb(184, 109, 70)" + } + }, + "icon-color-cinnamon-primary-down": { + "prop": "--spectrum-icon-color-cinnamon-primary-down", + "ref": "var(--spectrum-cinnamon-1000)", + "dark": { + "value": "rgb(206, 136, 99)" + }, + "light": { + "value": "rgb(147, 77, 43)" + } + }, + "icon-color-cinnamon-primary-hover": { + "prop": "--spectrum-icon-color-cinnamon-primary-hover", + "ref": "var(--spectrum-cinnamon-900)", + "dark": { + "value": "rgb(192, 119, 80)" + }, + "light": { + "value": "rgb(170, 94, 56)" + } + }, + "icon-color-cyan-background": { + "prop": "--spectrum-icon-color-cyan-background", + "ref": "var(--spectrum-cyan-400)", + "light": { + "value": "rgb(238, 250, 254)" + }, + "dark": { + "value": "rgb(0, 64, 88)" + } + }, + "icon-color-cyan-primary-default": { + "prop": "--spectrum-icon-color-cyan-primary-default", + "ref": "var(--spectrum-cyan-800)", + "light": { + "value": "rgb(18, 134, 205)" + }, + "dark": { + "value": "rgb(13, 125, 186)" + } + }, + "icon-color-cyan-primary-down": { + "prop": "--spectrum-icon-color-cyan-primary-down", + "ref": "var(--spectrum-cyan-1000)", + "light": { + "value": "rgb(4, 102, 145)" + }, + "dark": { + "value": "rgb(38, 159, 244)" + } + }, + "icon-color-cyan-primary-hover": { + "prop": "--spectrum-icon-color-cyan-primary-hover", + "ref": "var(--spectrum-cyan-900)", + "light": { + "value": "rgb(11, 120, 179)" + }, + "dark": { + "value": "rgb(24, 142, 220)" + } + }, + "icon-color-disabled-primary": { + "prop": "--spectrum-icon-color-disabled-primary", + "ref": "var(--spectrum-gray-400)", + "light": { + "value": "rgb(198, 198, 198)" + }, + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "icon-color-emphasized-background": { + "prop": "--spectrum-icon-color-emphasized-background", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "icon-color-fuchsia-background": { + "prop": "--spectrum-icon-color-fuchsia-background", + "ref": "var(--spectrum-fuchsia-200)", + "light": { + "value": "rgb(253, 233, 255)" + }, + "dark": { + "value": "rgb(61, 0, 74)" + } + }, + "icon-color-fuchsia-primary-default": { + "prop": "--spectrum-icon-color-fuchsia-primary-default", + "ref": "var(--spectrum-fuchsia-700)", + "light": { + "value": "rgb(181, 57, 200)" + }, + "dark": { + "value": "rgb(173, 51, 192)" + } + }, + "icon-color-fuchsia-primary-down": { + "prop": "--spectrum-icon-color-fuchsia-primary-down", + "ref": "var(--spectrum-fuchsia-900)", + "light": { + "value": "rgb(135, 27, 154)" + }, + "dark": { + "value": "rgb(213, 73, 235)" + } + }, + "icon-color-fuchsia-primary-hover": { + "prop": "--spectrum-icon-color-fuchsia-primary-hover", + "ref": "var(--spectrum-fuchsia-800)", + "light": { + "value": "rgb(156, 40, 175)" + }, + "dark": { + "value": "rgb(186, 60, 206)" + } + }, + "icon-color-green-background": { + "prop": "--spectrum-icon-color-green-background", + "ref": "var(--spectrum-green-400)", + "light": { + "value": "rgb(237, 252, 241)" + }, + "dark": { + "value": "rgb(0, 68, 48)" + } + }, + "icon-color-green-primary-default": { + "prop": "--spectrum-icon-color-green-primary-default", + "ref": "var(--spectrum-green-800)", + "light": { + "value": "rgb(7, 147, 85)" + }, + "dark": { + "value": "rgb(6, 136, 80)" + } + }, + "icon-color-green-primary-down": { + "prop": "--spectrum-icon-color-green-primary-down", + "ref": "var(--spectrum-green-1000)", + "light": { + "value": "rgb(3, 110, 69)" + }, + "dark": { + "value": "rgb(14, 175, 98)" + } + }, + "icon-color-green-primary-hover": { + "prop": "--spectrum-icon-color-green-primary-hover", + "ref": "var(--spectrum-green-900)", + "light": { + "value": "rgb(5, 131, 78)" + }, + "dark": { + "value": "rgb(9, 157, 89)" + } + }, + "icon-color-indigo-background": { + "prop": "--spectrum-icon-color-indigo-background", + "ref": "var(--spectrum-indigo-100)", + "light": { + "value": "rgb(235, 238, 255)" + }, + "dark": { + "value": "rgb(30, 0, 93)" + } + }, + "icon-color-indigo-primary-default": { + "prop": "--spectrum-icon-color-indigo-primary-default", + "ref": "var(--spectrum-indigo-700)", + "light": { + "value": "rgb(113, 85, 250)" + }, + "dark": { + "value": "rgb(109, 75, 248)" + } + }, + "icon-color-indigo-primary-down": { + "prop": "--spectrum-icon-color-indigo-primary-down", + "ref": "var(--spectrum-indigo-900)", + "light": { + "value": "rgb(84, 36, 219)" + }, + "dark": { + "value": "rgb(128, 119, 254)" + } + }, + "icon-color-indigo-primary-hover": { + "prop": "--spectrum-icon-color-indigo-primary-hover", + "ref": "var(--spectrum-indigo-800)", + "light": { + "value": "rgb(99, 56, 238)" + }, + "dark": { + "value": "rgb(116, 91, 252)" + } + }, + "icon-color-informative": { + "prop": "--spectrum-icon-color-informative", + "ref": "var(--spectrum-informative-color-900)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "icon-color-inverse": { + "prop": "--spectrum-icon-color-inverse", + "ref": "var(--spectrum-gray-50)", + "light": { + "value": "rgb(248, 248, 248)" + }, + "dark": { + "value": "rgb(27, 27, 27)" + } + }, + "icon-color-inverse-background": { + "prop": "--spectrum-icon-color-inverse-background", + "ref": "var(--spectrum-gray-50)", + "light": { + "value": "rgb(248, 248, 248)" + }, + "dark": { + "value": "rgb(27, 27, 27)" + } + }, + "icon-color-magenta-background": { + "prop": "--spectrum-icon-color-magenta-background", + "ref": "var(--spectrum-magenta-200)", + "light": { + "value": "rgb(255, 232, 240)" + }, + "dark": { + "value": "rgb(74, 0, 27)" + } + }, + "icon-color-magenta-primary-default": { + "prop": "--spectrum-icon-color-magenta-primary-default", + "ref": "var(--spectrum-magenta-700)", + "light": { + "value": "rgb(217, 35, 97)" + }, + "dark": { + "value": "rgb(207, 31, 92)" + } + }, + "icon-color-magenta-primary-down": { + "prop": "--spectrum-icon-color-magenta-primary-down", + "ref": "var(--spectrum-magenta-900)", + "light": { + "value": "rgb(163, 5, 62)" + }, + "dark": { + "value": "rgb(255, 51, 119)" + } + }, + "icon-color-magenta-primary-hover": { + "prop": "--spectrum-icon-color-magenta-primary-hover", + "ref": "var(--spectrum-magenta-800)", + "light": { + "value": "rgb(186, 22, 80)" + }, + "dark": { + "value": "rgb(224, 38, 101)" + } + }, + "icon-color-negative": { + "prop": "--spectrum-icon-color-negative", + "ref": "var(--spectrum-negative-color-900)", + "light": { + "value": "rgb(240, 56, 35)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "icon-color-neutral": { + "prop": "--spectrum-icon-color-neutral", + "ref": "var(--spectrum-gray-600)", + "light": { + "value": "rgb(143, 143, 143)" + }, + "dark": { + "value": "rgb(138, 138, 138)" + } + }, + "icon-color-notice": { + "prop": "--spectrum-icon-color-notice", + "ref": "var(--spectrum-notice-color-900)", + "light": { + "value": "rgb(212, 91, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "icon-color-orange-background": { + "prop": "--spectrum-icon-color-orange-background", + "ref": "var(--spectrum-orange-300)", + "light": { + "value": "rgb(255, 236, 207)" + }, + "dark": { + "value": "rgb(80, 27, 0)" + } + }, + "icon-color-orange-primary-default": { + "prop": "--spectrum-icon-color-orange-primary-default", + "ref": "var(--spectrum-orange-900)", + "light": { + "value": "rgb(232, 106, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "icon-color-orange-primary-down": { + "prop": "--spectrum-icon-color-orange-primary-down", + "ref": "var(--spectrum-orange-1100)", + "light": { + "value": "rgb(194, 78, 0)" + }, + "dark": { + "value": "rgb(255, 137, 0)" + } + }, + "icon-color-orange-primary-hover": { + "prop": "--spectrum-icon-color-orange-primary-hover", + "ref": "var(--spectrum-orange-1000)", + "light": { + "value": "rgb(212, 91, 0)" + }, + "dark": { + "value": "rgb(243, 117, 0)" + } + }, + "icon-color-pink-background": { + "prop": "--spectrum-icon-color-pink-background", + "ref": "var(--spectrum-pink-200)", + "dark": { + "value": "rgb(71, 0, 44)" + }, + "light": { + "value": "rgb(255, 232, 247)" + } + }, + "icon-color-pink-primary-default": { + "prop": "--spectrum-icon-color-pink-primary-default", + "ref": "var(--spectrum-pink-700)", + "light": { + "value": "rgb(228, 52, 163)" + }, + "dark": { + "value": "rgb(196, 39, 138)" + } + }, + "icon-color-pink-primary-down": { + "prop": "--spectrum-icon-color-pink-primary-down", + "ref": "var(--spectrum-pink-900)", + "light": { + "value": "rgb(176, 31, 123)" + }, + "dark": { + "value": "rgb(236, 67, 175)" + } + }, + "icon-color-pink-primary-hover": { + "prop": "--spectrum-icon-color-pink-primary-hover", + "ref": "var(--spectrum-pink-800)", + "light": { + "value": "rgb(206, 42, 146)" + }, + "dark": { + "value": "rgb(213, 45, 151)" + } + }, + "icon-color-positive": { + "prop": "--spectrum-icon-color-positive", + "ref": "var(--spectrum-positive-color-900)", + "light": { + "value": "rgb(7, 147, 85)" + }, + "dark": { + "value": "rgb(9, 157, 89)" + } + }, + "icon-color-primary-default": { + "prop": "--spectrum-icon-color-primary-default", + "ref": "var(--spectrum-neutral-content-color-default)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "icon-color-primary-down": { + "prop": "--spectrum-icon-color-primary-down", + "ref": "var(--spectrum-neutral-content-color-down)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "icon-color-primary-hover": { + "prop": "--spectrum-icon-color-primary-hover", + "ref": "var(--spectrum-neutral-content-color-hover)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "icon-color-purple-background": { + "prop": "--spectrum-icon-color-purple-background", + "ref": "var(--spectrum-purple-200)", + "light": { + "value": "rgb(244, 235, 252)" + }, + "dark": { + "value": "rgb(50, 0, 96)" + } + }, + "icon-color-purple-primary-default": { + "prop": "--spectrum-icon-color-purple-primary-default", + "ref": "var(--spectrum-purple-700)", + "light": { + "value": "rgb(154, 71, 226)" + }, + "dark": { + "value": "rgb(148, 62, 224)" + } + }, + "icon-color-purple-primary-down": { + "prop": "--spectrum-icon-color-purple-primary-down", + "ref": "var(--spectrum-purple-900)", + "light": { + "value": "rgb(115, 13, 204)" + }, + "dark": { + "value": "rgb(173, 105, 233)" + } + }, + "icon-color-purple-primary-hover": { + "prop": "--spectrum-icon-color-purple-primary-hover", + "ref": "var(--spectrum-purple-800)", + "light": { + "value": "rgb(134, 40, 217)" + }, + "dark": { + "value": "rgb(157, 78, 228)" + } + }, + "icon-color-red-background": { + "prop": "--spectrum-icon-color-red-background", + "ref": "var(--spectrum-red-300)", + "light": { + "value": "rgb(255, 235, 232)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "icon-color-red-primary-default": { + "prop": "--spectrum-icon-color-red-primary-default", + "ref": "var(--spectrum-red-700)", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "icon-color-red-primary-down": { + "prop": "--spectrum-icon-color-red-primary-down", + "ref": "var(--spectrum-red-900)", + "light": { + "value": "rgb(156, 33, 19)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "icon-color-red-primary-hover": { + "prop": "--spectrum-icon-color-red-primary-hover", + "ref": "var(--spectrum-red-800)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(223, 52, 34)" + } + }, + "icon-color-seafoam-background": { + "prop": "--spectrum-icon-color-seafoam-background", + "ref": "var(--spectrum-seafoam-400)", + "light": { + "value": "rgb(211, 246, 234)" + }, + "dark": { + "value": "rgb(0, 67, 59)" + } + }, + "icon-color-seafoam-primary-default": { + "prop": "--spectrum-icon-color-seafoam-primary-default", + "ref": "var(--spectrum-seafoam-800)", + "light": { + "value": "rgb(9, 144, 120)" + }, + "dark": { + "value": "rgb(8, 134, 112)" + } + }, + "icon-color-seafoam-primary-down": { + "prop": "--spectrum-icon-color-seafoam-primary-down", + "ref": "var(--spectrum-seafoam-1000)", + "light": { + "value": "rgb(5, 108, 92)" + }, + "dark": { + "value": "rgb(12, 173, 142)" + } + }, + "icon-color-seafoam-primary-hover": { + "prop": "--spectrum-icon-color-seafoam-primary-hover", + "ref": "var(--spectrum-seafoam-900)", + "light": { + "value": "rgb(7, 129, 109)" + }, + "dark": { + "value": "rgb(10, 154, 128)" + } + }, + "icon-color-silver-background": { + "prop": "--spectrum-icon-color-silver-background", + "ref": "var(--spectrum-silver-400)", + "light": { + "value": "rgb(239, 239, 239)" + }, + "dark": { + "value": "rgb(59, 59, 59)" + } + }, + "icon-color-silver-primary-default": { + "prop": "--spectrum-icon-color-silver-primary-default", + "ref": "var(--spectrum-silver-800)", + "light": { + "value": "rgb(143, 143, 143)" + }, + "dark": { + "value": "rgb(118, 118, 118)" + } + }, + "icon-color-silver-primary-down": { + "prop": "--spectrum-icon-color-silver-primary-down", + "ref": "var(--spectrum-silver-1000)", + "light": { + "value": "rgb(114, 114, 114)" + }, + "dark": { + "value": "rgb(152, 152, 152)" + } + }, + "icon-color-silver-primary-hover": { + "prop": "--spectrum-icon-color-silver-primary-hover", + "ref": "var(--spectrum-silver-900)", + "light": { + "value": "rgb(128, 128, 128)" + }, + "dark": { + "value": "rgb(137, 137, 137)" + } + }, + "icon-color-turquoise-background": { + "prop": "--spectrum-icon-color-turquoise-background", + "ref": "var(--spectrum-turquoise-400)", + "light": { + "value": "rgb(209, 245, 245)" + }, + "dark": { + "value": "rgb(0, 66, 72)" + } + }, + "icon-color-turquoise-primary-default": { + "prop": "--spectrum-icon-color-turquoise-primary-default", + "ref": "var(--spectrum-turquoise-800)", + "light": { + "value": "rgb(12, 158, 171)" + }, + "dark": { + "value": "rgb(9, 131, 142)" + } + }, + "icon-color-turquoise-primary-down": { + "prop": "--spectrum-icon-color-turquoise-primary-down", + "ref": "var(--spectrum-turquoise-1000)", + "light": { + "value": "rgb(8, 126, 137)" + }, + "dark": { + "value": "rgb(13, 168, 182)" + } + }, + "icon-color-turquoise-primary-hover": { + "prop": "--spectrum-icon-color-turquoise-primary-hover", + "ref": "var(--spectrum-turquoise-900)", + "light": { + "value": "rgb(10, 141, 153)" + }, + "dark": { + "value": "rgb(11, 151, 164)" + } + }, + "icon-color-yellow-background": { + "prop": "--spectrum-icon-color-yellow-background", + "ref": "var(--spectrum-yellow-400)", + "light": { + "value": "rgb(255, 248, 204)" + }, + "dark": { + "value": "rgb(83, 52, 0)" + } + }, + "icon-color-yellow-primary-default": { + "prop": "--spectrum-icon-color-yellow-primary-default", + "ref": "var(--spectrum-yellow-1200)", + "light": { + "value": "rgb(245, 199, 0)" + }, + "dark": { + "value": "rgb(235, 183, 0)" + } + }, + "icon-color-yellow-primary-down": { + "prop": "--spectrum-icon-color-yellow-primary-down", + "ref": "var(--spectrum-yellow-1400)", + "light": { + "value": "rgb(210, 149, 0)" + }, + "dark": { + "value": "rgb(255, 230, 86)" + } + }, + "icon-color-yellow-primary-hover": { + "prop": "--spectrum-icon-color-yellow-primary-hover", + "ref": "var(--spectrum-yellow-1300)", + "light": { + "value": "rgb(230, 175, 0)" + }, + "dark": { + "value": "rgb(249, 206, 0)" + } + }, + "illustrated-message-body-size": { + "prop": "--spectrum-illustrated-message-body-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "illustrated-message-cjk-title-size": { + "prop": "--spectrum-illustrated-message-cjk-title-size", + "ref": "var(--spectrum-title-cjk-size-xl)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "illustrated-message-horizontal-maximum-width": { + "prop": "--spectrum-illustrated-message-horizontal-maximum-width", + "value": "535px" + }, + "illustrated-message-large-body-font-size": { + "prop": "--spectrum-illustrated-message-large-body-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "illustrated-message-large-cjk-title-font-size": { + "prop": "--spectrum-illustrated-message-large-cjk-title-font-size", + "ref": "var(--spectrum-title-cjk-size-xl)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "illustrated-message-large-title-font-size": { + "prop": "--spectrum-illustrated-message-large-title-font-size", + "ref": "var(--spectrum-title-size-xl)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "24px" + } + }, + "illustrated-message-maximum-width": { + "prop": "--spectrum-illustrated-message-maximum-width", + "ref": "var(--spectrum-illustrated-message-vertical-maximum-width)", + "value": "380px" + }, + "illustrated-message-medium-body-font-size": { + "prop": "--spectrum-illustrated-message-medium-body-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "illustrated-message-medium-cjk-title-font-size": { + "prop": "--spectrum-illustrated-message-medium-cjk-title-font-size", + "ref": "var(--spectrum-title-cjk-size-l)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "19px" + } + }, + "illustrated-message-medium-title-font-size": { + "prop": "--spectrum-illustrated-message-medium-title-font-size", + "ref": "var(--spectrum-title-size-l)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "illustrated-message-small-body-font-size": { + "prop": "--spectrum-illustrated-message-small-body-font-size", + "ref": "var(--spectrum-body-size-xs)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "illustrated-message-small-cjk-title-font-size": { + "prop": "--spectrum-illustrated-message-small-cjk-title-font-size", + "ref": "var(--spectrum-title-cjk-size-s)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "15px" + } + }, + "illustrated-message-small-title-font-size": { + "prop": "--spectrum-illustrated-message-small-title-font-size", + "ref": "var(--spectrum-title-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "illustrated-message-title-size": { + "prop": "--spectrum-illustrated-message-title-size", + "ref": "var(--spectrum-title-size-xl)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "24px" + } + }, + "illustrated-message-vertical-maximum-width": { + "prop": "--spectrum-illustrated-message-vertical-maximum-width", + "value": "380px" + }, + "in-field-button-edge-to-disclosure-icon-stacked-extra-large": { + "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-extra-large", + "value": "16px" + }, + "in-field-button-edge-to-disclosure-icon-stacked-large": { + "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-large", + "value": "13px" + }, + "in-field-button-edge-to-disclosure-icon-stacked-medium": { + "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-medium", + "value": "9px" + }, + "in-field-button-edge-to-disclosure-icon-stacked-small": { + "prop": "--spectrum-in-field-button-edge-to-disclosure-icon-stacked-small", + "value": "7px" + }, + "in-field-button-edge-to-fill": { + "prop": "--spectrum-in-field-button-edge-to-fill", + "value": "0px" + }, + "in-field-button-edge-to-fill-extra-large": { + "prop": "--spectrum-in-field-button-edge-to-fill-extra-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "in-field-button-edge-to-fill-large": { + "prop": "--spectrum-in-field-button-edge-to-fill-large", + "value": "8px" + }, + "in-field-button-edge-to-fill-medium": { + "prop": "--spectrum-in-field-button-edge-to-fill-medium", + "value": "6px" + }, + "in-field-button-edge-to-fill-small": { + "prop": "--spectrum-in-field-button-edge-to-fill-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "in-field-button-fill-stacked-inner-border-rounding": { + "prop": "--spectrum-in-field-button-fill-stacked-inner-border-rounding", + "value": "0px" + }, + "in-field-button-inner-edge-to-disclosure-icon-stacked-extra-large": { + "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-extra-large", + "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large)", + "value": "5px" + }, + "in-field-button-inner-edge-to-disclosure-icon-stacked-large": { + "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-large", + "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-large)", + "value": "4px" + }, + "in-field-button-inner-edge-to-disclosure-icon-stacked-medium": { + "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-medium", + "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-medium)", + "value": "3px" + }, + "in-field-button-inner-edge-to-disclosure-icon-stacked-small": { + "prop": "--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-small", + "ref": "var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-small)", + "value": "3px" + }, + "in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large": { + "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large", + "value": "5px" + }, + "in-field-button-outer-edge-to-disclosure-icon-stacked-large": { + "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-large", + "value": "4px" + }, + "in-field-button-outer-edge-to-disclosure-icon-stacked-medium": { + "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-medium", + "value": "3px" + }, + "in-field-button-outer-edge-to-disclosure-icon-stacked-small": { + "prop": "--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-small", + "value": "3px" + }, + "in-field-button-stacked-inner-edge-to-fill": { + "prop": "--spectrum-in-field-button-stacked-inner-edge-to-fill", + "value": "0px" + }, + "in-field-button-width-stacked-extra-large": { + "prop": "--spectrum-in-field-button-width-stacked-extra-large", + "value": "44px" + }, + "in-field-button-width-stacked-large": { + "prop": "--spectrum-in-field-button-width-stacked-large", + "value": "36px" + }, + "in-field-button-width-stacked-medium": { + "prop": "--spectrum-in-field-button-width-stacked-medium", + "value": "28px" + }, + "in-field-button-width-stacked-small": { + "prop": "--spectrum-in-field-button-width-stacked-small", + "value": "20px" + }, + "in-field-progress-circle-edge-to-fill": { + "prop": "--spectrum-in-field-progress-circle-edge-to-fill", + "desktop": { + "value": "1px" + }, + "mobile": { + "value": "2px" + } + }, + "in-field-progress-circle-size-100": { + "prop": "--spectrum-in-field-progress-circle-size-100", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "in-field-progress-circle-size-200": { + "prop": "--spectrum-in-field-progress-circle-size-200", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "28px" + } + }, + "in-field-progress-circle-size-300": { + "prop": "--spectrum-in-field-progress-circle-size-300", + "desktop": { + "value": "26px" + }, + "mobile": { + "value": "30px" + } + }, + "in-field-progress-circle-size-75": { + "prop": "--spectrum-in-field-progress-circle-size-75", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "in-field-stepper-to-end-extra-large": { + "prop": "--spectrum-in-field-stepper-to-end-extra-large", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "in-field-stepper-to-end-large": { + "prop": "--spectrum-in-field-stepper-to-end-large", + "value": "4px" + }, + "in-field-stepper-to-end-medium": { + "prop": "--spectrum-in-field-stepper-to-end-medium", + "value": "3px" + }, + "in-field-stepper-to-end-small": { + "prop": "--spectrum-in-field-stepper-to-end-small", + "desktop": { + "value": "0px" + }, + "mobile": { + "value": "3px" + } + }, + "in-line-alert-minimum-width": { + "prop": "--spectrum-in-line-alert-minimum-width", + "value": "240px" + }, + "indigo-100": { + "prop": "--spectrum-indigo-100", + "light": { + "value": "rgb(247, 248, 255)" + }, + "dark": { + "value": "rgb(30, 0, 93)" + } + }, + "indigo-1000": { + "prop": "--spectrum-indigo-1000", + "light": { + "value": "rgb(99, 56, 238)" + }, + "dark": { + "value": "rgb(139, 141, 254)" + } + }, + "indigo-1100": { + "prop": "--spectrum-indigo-1100", + "light": { + "value": "rgb(84, 36, 219)" + }, + "dark": { + "value": "rgb(153, 161, 255)" + } + }, + "indigo-1200": { + "prop": "--spectrum-indigo-1200", + "light": { + "value": "rgb(69, 19, 191)" + }, + "dark": { + "value": "rgb(176, 186, 255)" + } + }, + "indigo-1300": { + "prop": "--spectrum-indigo-1300", + "light": { + "value": "rgb(55, 6, 160)" + }, + "dark": { + "value": "rgb(199, 208, 255)" + } + }, + "indigo-1400": { + "prop": "--spectrum-indigo-1400", + "light": { + "value": "rgb(42, 0, 129)" + }, + "dark": { + "value": "rgb(223, 228, 255)" + } + }, + "indigo-1500": { + "prop": "--spectrum-indigo-1500", + "dark": { + "value": "rgb(243, 244, 255)" + }, + "light": { + "value": "rgb(31, 0, 98)" + } + }, + "indigo-1600": { + "prop": "--spectrum-indigo-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(17, 0, 54)" + } + }, + "indigo-200": { + "prop": "--spectrum-indigo-200", + "light": { + "value": "rgb(235, 238, 255)" + }, + "dark": { + "value": "rgb(35, 0, 110)" + } + }, + "indigo-300": { + "prop": "--spectrum-indigo-300", + "light": { + "value": "rgb(216, 222, 255)" + }, + "dark": { + "value": "rgb(47, 0, 140)" + } + }, + "indigo-400": { + "prop": "--spectrum-indigo-400", + "light": { + "value": "rgb(192, 201, 255)" + }, + "dark": { + "value": "rgb(62, 12, 174)" + } + }, + "indigo-500": { + "prop": "--spectrum-indigo-500", + "light": { + "value": "rgb(167, 178, 255)" + }, + "dark": { + "value": "rgb(79, 30, 209)" + } + }, + "indigo-600": { + "prop": "--spectrum-indigo-600", + "light": { + "value": "rgb(145, 151, 254)" + }, + "dark": { + "value": "rgb(95, 52, 235)" + } + }, + "indigo-700": { + "prop": "--spectrum-indigo-700", + "light": { + "value": "rgb(132, 128, 254)" + }, + "dark": { + "value": "rgb(109, 75, 248)" + } + }, + "indigo-800": { + "prop": "--spectrum-indigo-800", + "light": { + "value": "rgb(122, 106, 253)" + }, + "dark": { + "value": "rgb(116, 91, 252)" + } + }, + "indigo-900": { + "prop": "--spectrum-indigo-900", + "light": { + "value": "rgb(113, 85, 250)" + }, + "dark": { + "value": "rgb(128, 119, 254)" + } + }, + "indigo-background-color-default": { + "prop": "--spectrum-indigo-background-color-default", + "ref": "var(--spectrum-indigo-800)", + "light": { + "value": "rgb(113, 85, 250)" + }, + "dark": { + "value": "rgb(116, 91, 252)" + } + }, + "indigo-subtle-background-color-default": { + "prop": "--spectrum-indigo-subtle-background-color-default", + "ref": "var(--spectrum-indigo-300)", + "light": { + "value": "rgb(235, 238, 255)" + }, + "dark": { + "value": "rgb(47, 0, 140)" + } + }, + "indigo-visual-color": { + "prop": "--spectrum-indigo-visual-color", + "ref": "var(--spectrum-indigo-900)", + "light": { + "value": "rgb(122, 106, 253)" + }, + "dark": { + "value": "rgb(128, 119, 254)" + } + }, + "informative-background-color-default": { + "prop": "--spectrum-informative-background-color-default", + "ref": "var(--spectrum-informative-color-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "informative-background-color-down": { + "prop": "--spectrum-informative-background-color-down", + "ref": "var(--spectrum-informative-color-700)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "informative-background-color-hover": { + "prop": "--spectrum-informative-background-color-hover", + "ref": "var(--spectrum-informative-color-700)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "informative-background-color-key-focus": { + "prop": "--spectrum-informative-background-color-key-focus", + "ref": "var(--spectrum-informative-color-700)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "informative-color-100": { + "prop": "--spectrum-informative-color-100", + "ref": "var(--spectrum-blue-100)", + "light": { + "value": "rgb(245, 249, 255)" + }, + "dark": { + "value": "rgb(14, 23, 63)" + } + }, + "informative-color-1000": { + "prop": "--spectrum-informative-color-1000", + "ref": "var(--spectrum-blue-1000)", + "light": { + "value": "rgb(39, 77, 234)" + }, + "dark": { + "value": "rgb(105, 149, 254)" + } + }, + "informative-color-1100": { + "prop": "--spectrum-informative-color-1100", + "ref": "var(--spectrum-blue-1100)", + "light": { + "value": "rgb(29, 62, 207)" + }, + "dark": { + "value": "rgb(124, 169, 252)" + } + }, + "informative-color-1200": { + "prop": "--spectrum-informative-color-1200", + "ref": "var(--spectrum-blue-1200)", + "light": { + "value": "rgb(21, 50, 173)" + }, + "dark": { + "value": "rgb(152, 192, 252)" + } + }, + "informative-color-1300": { + "prop": "--spectrum-informative-color-1300", + "ref": "var(--spectrum-blue-1300)", + "light": { + "value": "rgb(16, 40, 140)" + }, + "dark": { + "value": "rgb(181, 213, 253)" + } + }, + "informative-color-1400": { + "prop": "--spectrum-informative-color-1400", + "ref": "var(--spectrum-blue-1400)", + "light": { + "value": "rgb(12, 31, 105)" + }, + "dark": { + "value": "rgb(213, 231, 254)" + } + }, + "informative-color-1500": { + "prop": "--spectrum-informative-color-1500", + "ref": "var(--spectrum-blue-1500)", + "dark": { + "value": "rgb(238, 245, 255)" + }, + "light": { + "value": "rgb(14, 24, 67)" + } + }, + "informative-color-1600": { + "prop": "--spectrum-informative-color-1600", + "ref": "var(--spectrum-blue-1600)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(7, 11, 30)" + } + }, + "informative-color-200": { + "prop": "--spectrum-informative-color-200", + "ref": "var(--spectrum-blue-200)", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(15, 28, 82)" + } + }, + "informative-color-300": { + "prop": "--spectrum-informative-color-300", + "ref": "var(--spectrum-blue-300)", + "light": { + "value": "rgb(203, 226, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "informative-color-400": { + "prop": "--spectrum-informative-color-400", + "ref": "var(--spectrum-blue-400)", + "light": { + "value": "rgb(172, 207, 253)" + }, + "dark": { + "value": "rgb(18, 45, 154)" + } + }, + "informative-color-500": { + "prop": "--spectrum-informative-color-500", + "ref": "var(--spectrum-blue-500)", + "light": { + "value": "rgb(142, 185, 252)" + }, + "dark": { + "value": "rgb(26, 58, 195)" + } + }, + "informative-color-600": { + "prop": "--spectrum-informative-color-600", + "ref": "var(--spectrum-blue-600)", + "light": { + "value": "rgb(114, 158, 253)" + }, + "dark": { + "value": "rgb(37, 73, 229)" + } + }, + "informative-color-700": { + "prop": "--spectrum-informative-color-700", + "ref": "var(--spectrum-blue-700)", + "light": { + "value": "rgb(93, 137, 255)" + }, + "dark": { + "value": "rgb(52, 91, 248)" + } + }, + "informative-color-800": { + "prop": "--spectrum-informative-color-800", + "ref": "var(--spectrum-blue-800)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "informative-color-900": { + "prop": "--spectrum-informative-color-900", + "ref": "var(--spectrum-blue-900)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "informative-subtle-background-color-default": { + "prop": "--spectrum-informative-subtle-background-color-default", + "ref": "var(--spectrum-informative-color-300)", + "light": { + "value": "rgb(229, 240, 254)" + }, + "dark": { + "value": "rgb(12, 33, 117)" + } + }, + "informative-visual-color": { + "prop": "--spectrum-informative-visual-color", + "ref": "var(--spectrum-informative-color-900)", + "light": { + "value": "rgb(75, 117, 255)" + }, + "dark": { + "value": "rgb(86, 129, 255)" + } + }, + "italic-font-style": { + "prop": "--spectrum-italic-font-style", + "value": "italic" + }, + "label-to-description-0": { + "prop": "--spectrum-label-to-description-0", + "value": "0px" + }, + "letter-spacing": { + "prop": "--spectrum-letter-spacing", + "value": "0em" + }, + "light-font-weight": { + "prop": "--spectrum-light-font-weight", + "ref": "light", + "value": "300" + }, + "line-height-100": { + "prop": "--spectrum-line-height-100", + "value": 1.3 + }, + "line-height-200": { + "prop": "--spectrum-line-height-200", + "value": 1.5 + }, + "line-height-font-size-100": { + "prop": "--spectrum-line-height-font-size-100", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "line-height-font-size-1000": { + "prop": "--spectrum-line-height-font-size-1000", + "desktop": { + "value": "46px" + }, + "mobile": { + "value": "56px" + } + }, + "line-height-font-size-1100": { + "prop": "--spectrum-line-height-font-size-1100", + "desktop": { + "value": "52px" + }, + "mobile": { + "value": "64px" + } + }, + "line-height-font-size-1200": { + "prop": "--spectrum-line-height-font-size-1200", + "desktop": { + "value": "58px" + }, + "mobile": { + "value": "72px" + } + }, + "line-height-font-size-1300": { + "prop": "--spectrum-line-height-font-size-1300", + "desktop": { + "value": "66px" + }, + "mobile": { + "value": "80px" + } + }, + "line-height-font-size-1400": { + "prop": "--spectrum-line-height-font-size-1400", + "desktop": { + "value": "74px" + }, + "mobile": { + "value": "90px" + } + }, + "line-height-font-size-1500": { + "prop": "--spectrum-line-height-font-size-1500", + "desktop": { + "value": "84px" + }, + "mobile": { + "value": "102px" + } + }, + "line-height-font-size-200": { + "prop": "--spectrum-line-height-font-size-200", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "line-height-font-size-25": { + "prop": "--spectrum-line-height-font-size-25", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "line-height-font-size-300": { + "prop": "--spectrum-line-height-font-size-300", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "26px" + } + }, + "line-height-font-size-400": { + "prop": "--spectrum-line-height-font-size-400", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "28px" + } + }, + "line-height-font-size-50": { + "prop": "--spectrum-line-height-font-size-50", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "line-height-font-size-500": { + "prop": "--spectrum-line-height-font-size-500", + "desktop": { + "value": "26px" + }, + "mobile": { + "value": "32px" + } + }, + "line-height-font-size-600": { + "prop": "--spectrum-line-height-font-size-600", + "desktop": { + "value": "30px" + }, + "mobile": { + "value": "36px" + } + }, + "line-height-font-size-700": { + "prop": "--spectrum-line-height-font-size-700", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "line-height-font-size-75": { + "prop": "--spectrum-line-height-font-size-75", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "line-height-font-size-800": { + "prop": "--spectrum-line-height-font-size-800", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "44px" + } + }, + "line-height-font-size-900": { + "prop": "--spectrum-line-height-font-size-900", + "desktop": { + "value": "42px" + }, + "mobile": { + "value": "50px" + } + }, + "link-out-icon-size-100": { + "prop": "--spectrum-link-out-icon-size-100", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "link-out-icon-size-200": { + "prop": "--spectrum-link-out-icon-size-200", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "link-out-icon-size-300": { + "prop": "--spectrum-link-out-icon-size-300", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "link-out-icon-size-400": { + "prop": "--spectrum-link-out-icon-size-400", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "link-out-icon-size-75": { + "prop": "--spectrum-link-out-icon-size-75", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "list-view-end-edge-to-content": { + "prop": "--spectrum-list-view-end-edge-to-content", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "list-view-item-bottom-corner-radius": { + "prop": "--spectrum-list-view-item-bottom-corner-radius", + "ref": "var(--spectrum-corner-radius-medium-default)", + "value": "8px" + }, + "list-view-item-top-corner-radius": { + "prop": "--spectrum-list-view-item-top-corner-radius", + "ref": "var(--spectrum-corner-radius-medium-default)", + "value": "8px" + }, + "list-view-minimum-height": { + "prop": "--spectrum-list-view-minimum-height", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "list-view-minimum-width": { + "prop": "--spectrum-list-view-minimum-width", + "desktop": { + "value": "200px" + }, + "mobile": { + "value": "240px" + } + }, + "logic-button-and-background-color": { + "prop": "--spectrum-logic-button-and-background-color", + "ref": "var(--spectrum-blue-900)", + "dark": { + "value": "rgb(64, 105, 253)" + }, + "light": { + "value": "rgb(59, 99, 251)" + } + }, + "logic-button-and-background-color-hover": { + "prop": "--spectrum-logic-button-and-background-color-hover", + "ref": "var(--spectrum-blue-1100)", + "dark": { + "value": "rgb(105, 149, 254)" + }, + "light": { + "value": "rgb(29, 62, 207)" + } + }, + "logic-button-and-border-color": { + "prop": "--spectrum-logic-button-and-border-color", + "ref": "var(--spectrum-blue-900)", + "dark": { + "value": "rgb(64, 105, 253)" + }, + "light": { + "value": "rgb(59, 99, 251)" + } + }, + "logic-button-and-border-color-hover": { + "prop": "--spectrum-logic-button-and-border-color-hover", + "ref": "var(--spectrum-blue-1100)", + "dark": { + "value": "rgb(105, 149, 254)" + }, + "light": { + "value": "rgb(29, 62, 207)" + } + }, + "logic-button-or-background-color": { + "prop": "--spectrum-logic-button-or-background-color", + "ref": "var(--spectrum-magenta-900)", + "dark": { + "value": "rgb(207, 31, 92)" + }, + "light": { + "value": "rgb(217, 35, 97)" + } + }, + "logic-button-or-background-color-hover": { + "prop": "--spectrum-logic-button-or-background-color-hover", + "ref": "var(--spectrum-magenta-1100)", + "dark": { + "value": "rgb(255, 51, 119)" + }, + "light": { + "value": "rgb(163, 5, 62)" + } + }, + "logic-button-or-border-color": { + "prop": "--spectrum-logic-button-or-border-color", + "ref": "var(--spectrum-magenta-900)", + "dark": { + "value": "rgb(207, 31, 92)" + }, + "light": { + "value": "rgb(217, 35, 97)" + } + }, + "logic-button-or-border-color-hover": { + "prop": "--spectrum-logic-button-or-border-color-hover", + "ref": "var(--spectrum-magenta-1100)", + "dark": { + "value": "rgb(255, 51, 119)" + }, + "light": { + "value": "rgb(163, 5, 62)" + } + }, + "magenta-100": { + "prop": "--spectrum-magenta-100", + "light": { + "value": "rgb(255, 245, 248)" + }, + "dark": { + "value": "rgb(59, 0, 22)" + } + }, + "magenta-1000": { + "prop": "--spectrum-magenta-1000", + "light": { + "value": "rgb(186, 22, 80)" + }, + "dark": { + "value": "rgb(255, 96, 149)" + } + }, + "magenta-1100": { + "prop": "--spectrum-magenta-1100", + "light": { + "value": "rgb(163, 5, 62)" + }, + "dark": { + "value": "rgb(255, 128, 171)" + } + }, + "magenta-1200": { + "prop": "--spectrum-magenta-1200", + "light": { + "value": "rgb(136, 0, 51)" + }, + "dark": { + "value": "rgb(255, 163, 194)" + } + }, + "magenta-1300": { + "prop": "--spectrum-magenta-1300", + "light": { + "value": "rgb(111, 0, 40)" + }, + "dark": { + "value": "rgb(255, 193, 214)" + } + }, + "magenta-1400": { + "prop": "--spectrum-magenta-1400", + "light": { + "value": "rgb(86, 0, 30)" + }, + "dark": { + "value": "rgb(255, 220, 232)" + } + }, + "magenta-1500": { + "prop": "--spectrum-magenta-1500", + "dark": { + "value": "rgb(255, 241, 246)" + }, + "light": { + "value": "rgb(64, 0, 22)" + } + }, + "magenta-1600": { + "prop": "--spectrum-magenta-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(35, 0, 12)" + } + }, + "magenta-200": { + "prop": "--spectrum-magenta-200", + "light": { + "value": "rgb(255, 232, 240)" + }, + "dark": { + "value": "rgb(74, 0, 27)" + } + }, + "magenta-300": { + "prop": "--spectrum-magenta-300", + "light": { + "value": "rgb(255, 213, 227)" + }, + "dark": { + "value": "rgb(93, 0, 34)" + } + }, + "magenta-400": { + "prop": "--spectrum-magenta-400", + "light": { + "value": "rgb(255, 185, 208)" + }, + "dark": { + "value": "rgb(123, 0, 45)" + } + }, + "magenta-500": { + "prop": "--spectrum-magenta-500", + "light": { + "value": "rgb(255, 152, 187)" + }, + "dark": { + "value": "rgb(152, 7, 60)" + } + }, + "magenta-600": { + "prop": "--spectrum-magenta-600", + "light": { + "value": "rgb(255, 112, 159)" + }, + "dark": { + "value": "rgb(181, 19, 76)" + } + }, + "magenta-700": { + "prop": "--spectrum-magenta-700", + "light": { + "value": "rgb(255, 72, 133)" + }, + "dark": { + "value": "rgb(207, 31, 92)" + } + }, + "magenta-800": { + "prop": "--spectrum-magenta-800", + "light": { + "value": "rgb(240, 45, 110)" + }, + "dark": { + "value": "rgb(224, 38, 101)" + } + }, + "magenta-900": { + "prop": "--spectrum-magenta-900", + "light": { + "value": "rgb(217, 35, 97)" + }, + "dark": { + "value": "rgb(255, 51, 119)" + } + }, + "magenta-background-color-default": { + "prop": "--spectrum-magenta-background-color-default", + "ref": "var(--spectrum-magenta-800)", + "light": { + "value": "rgb(217, 35, 97)" + }, + "dark": { + "value": "rgb(224, 38, 101)" + } + }, + "magenta-subtle-background-color-default": { + "prop": "--spectrum-magenta-subtle-background-color-default", + "ref": "var(--spectrum-magenta-300)", + "light": { + "value": "rgb(255, 232, 240)" + }, + "dark": { + "value": "rgb(93, 0, 34)" + } + }, + "magenta-visual-color": { + "prop": "--spectrum-magenta-visual-color", + "ref": "var(--spectrum-magenta-900)", + "light": { + "value": "rgb(240, 45, 110)" + }, + "dark": { + "value": "rgb(255, 51, 119)" + } + }, + "medium-font-weight": { + "prop": "--spectrum-medium-font-weight", + "ref": "medium", + "value": "500" + }, + "menu-item-background-color-default": { + "prop": "--spectrum-menu-item-background-color-default", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "menu-item-background-color-disabled": { + "prop": "--spectrum-menu-item-background-color-disabled", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "menu-item-background-color-down": { + "prop": "--spectrum-menu-item-background-color-down", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "menu-item-background-color-hover": { + "prop": "--spectrum-menu-item-background-color-hover", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "menu-item-background-color-keyboard-focus": { + "prop": "--spectrum-menu-item-background-color-keyboard-focus", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "menu-item-background-opacity": { + "prop": "--spectrum-menu-item-background-opacity", + "ref": "0", + "value": "0%" + }, + "menu-item-checkmark-height-extra-large": { + "prop": "--spectrum-menu-item-checkmark-height-extra-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "menu-item-checkmark-height-large": { + "prop": "--spectrum-menu-item-checkmark-height-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "menu-item-checkmark-height-medium": { + "prop": "--spectrum-menu-item-checkmark-height-medium", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "menu-item-checkmark-height-small": { + "prop": "--spectrum-menu-item-checkmark-height-small", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "menu-item-checkmark-width-extra-large": { + "prop": "--spectrum-menu-item-checkmark-width-extra-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "menu-item-checkmark-width-large": { + "prop": "--spectrum-menu-item-checkmark-width-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "menu-item-checkmark-width-medium": { + "prop": "--spectrum-menu-item-checkmark-width-medium", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "menu-item-checkmark-width-small": { + "prop": "--spectrum-menu-item-checkmark-width-small", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "menu-item-edge-to-content-not-selected-extra-large": { + "prop": "--spectrum-menu-item-edge-to-content-not-selected-extra-large", + "desktop": { + "value": "45px" + }, + "mobile": { + "value": "54px" + } + }, + "menu-item-edge-to-content-not-selected-large": { + "prop": "--spectrum-menu-item-edge-to-content-not-selected-large", + "desktop": { + "value": "38px" + }, + "mobile": { + "value": "47px" + } + }, + "menu-item-edge-to-content-not-selected-medium": { + "prop": "--spectrum-menu-item-edge-to-content-not-selected-medium", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "42px" + } + }, + "menu-item-edge-to-content-not-selected-small": { + "prop": "--spectrum-menu-item-edge-to-content-not-selected-small", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "24px" + } + }, + "menu-item-label-to-description": { + "prop": "--spectrum-menu-item-label-to-description", + "ref": "var(--spectrum-menu-item-label-to-description-medium)", + "value": "1px" + }, + "menu-item-label-to-description-extra-large": { + "prop": "--spectrum-menu-item-label-to-description-extra-large", + "value": "2px" + }, + "menu-item-label-to-description-large": { + "prop": "--spectrum-menu-item-label-to-description-large", + "value": "2px" + }, + "menu-item-label-to-description-medium": { + "prop": "--spectrum-menu-item-label-to-description-medium", + "value": "1px" + }, + "menu-item-label-to-description-small": { + "prop": "--spectrum-menu-item-label-to-description-small", + "value": "1px" + }, + "menu-item-section-divider-height": { + "prop": "--spectrum-menu-item-section-divider-height", + "value": "12px" + }, + "menu-item-selectable-edge-to-text-not-selected-extra-large": { + "prop": "--spectrum-menu-item-selectable-edge-to-text-not-selected-extra-large", + "desktop": { + "value": "45px" + }, + "mobile": { + "value": "54px" + } + }, + "menu-item-selectable-edge-to-text-not-selected-large": { + "prop": "--spectrum-menu-item-selectable-edge-to-text-not-selected-large", + "desktop": { + "value": "38px" + }, + "mobile": { + "value": "47px" + } + }, + "menu-item-selectable-edge-to-text-not-selected-medium": { + "prop": "--spectrum-menu-item-selectable-edge-to-text-not-selected-medium", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "42px" + } + }, + "menu-item-selectable-edge-to-text-not-selected-small": { + "prop": "--spectrum-menu-item-selectable-edge-to-text-not-selected-small", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "34px" + } + }, + "menu-item-top-to-disclosure-icon-extra-large": { + "prop": "--spectrum-menu-item-top-to-disclosure-icon-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "menu-item-top-to-disclosure-icon-large": { + "prop": "--spectrum-menu-item-top-to-disclosure-icon-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "menu-item-top-to-disclosure-icon-medium": { + "prop": "--spectrum-menu-item-top-to-disclosure-icon-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "menu-item-top-to-disclosure-icon-small": { + "prop": "--spectrum-menu-item-top-to-disclosure-icon-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "menu-item-top-to-selected-icon-extra-large": { + "prop": "--spectrum-menu-item-top-to-selected-icon-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "menu-item-top-to-selected-icon-large": { + "prop": "--spectrum-menu-item-top-to-selected-icon-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "menu-item-top-to-selected-icon-medium": { + "prop": "--spectrum-menu-item-top-to-selected-icon-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "menu-item-top-to-selected-icon-small": { + "prop": "--spectrum-menu-item-top-to-selected-icon-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "menu-item-top-to-thumbnail-extra-large": { + "prop": "--spectrum-menu-item-top-to-thumbnail-extra-large", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "menu-item-top-to-thumbnail-large": { + "prop": "--spectrum-menu-item-top-to-thumbnail-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "menu-item-top-to-thumbnail-medium": { + "prop": "--spectrum-menu-item-top-to-thumbnail-medium", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "menu-item-top-to-thumbnail-small": { + "prop": "--spectrum-menu-item-top-to-thumbnail-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "menu-section-header-to-description-extra-large": { + "prop": "--spectrum-menu-section-header-to-description-extra-large", + "value": "2px" + }, + "menu-section-header-to-description-large": { + "prop": "--spectrum-menu-section-header-to-description-large", + "value": "2px" + }, + "menu-section-header-to-description-medium": { + "prop": "--spectrum-menu-section-header-to-description-medium", + "value": "1px" + }, + "menu-section-header-to-description-small": { + "prop": "--spectrum-menu-section-header-to-description-small", + "value": "1px" + }, + "meter-default-width": { + "prop": "--spectrum-meter-default-width", + "ref": "var(--spectrum-meter-width)", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "meter-maximum-width": { + "prop": "--spectrum-meter-maximum-width", + "value": "768px" + }, + "meter-minimum-width": { + "prop": "--spectrum-meter-minimum-width", + "value": "48px" + }, + "meter-thickness-extra-large": { + "prop": "--spectrum-meter-thickness-extra-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "meter-thickness-large": { + "prop": "--spectrum-meter-thickness-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "meter-thickness-medium": { + "prop": "--spectrum-meter-thickness-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "meter-thickness-small": { + "prop": "--spectrum-meter-thickness-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "meter-width": { + "prop": "--spectrum-meter-width", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "navigational-indicator-top-to-back-icon-extra-large": { + "prop": "--spectrum-navigational-indicator-top-to-back-icon-extra-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "navigational-indicator-top-to-back-icon-large": { + "prop": "--spectrum-navigational-indicator-top-to-back-icon-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "navigational-indicator-top-to-back-icon-medium": { + "prop": "--spectrum-navigational-indicator-top-to-back-icon-medium", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "navigational-indicator-top-to-back-icon-small": { + "prop": "--spectrum-navigational-indicator-top-to-back-icon-small", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "negative-background-color-default": { + "prop": "--spectrum-negative-background-color-default", + "ref": "var(--spectrum-negative-color-800)", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(223, 52, 34)" + } + }, + "negative-background-color-down": { + "prop": "--spectrum-negative-background-color-down", + "ref": "var(--spectrum-negative-color-700)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "negative-background-color-hover": { + "prop": "--spectrum-negative-background-color-hover", + "ref": "var(--spectrum-negative-color-700)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "negative-background-color-key-focus": { + "prop": "--spectrum-negative-background-color-key-focus", + "ref": "var(--spectrum-negative-color-700)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "negative-border-color-default": { + "prop": "--spectrum-negative-border-color-default", + "ref": "var(--spectrum-negative-color-900)", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "negative-border-color-down": { + "prop": "--spectrum-negative-border-color-down", + "ref": "var(--spectrum-negative-color-1100)", + "light": { + "value": "rgb(156, 33, 19)" + }, + "dark": { + "value": "rgb(255, 134, 120)" + } + }, + "negative-border-color-focus": { + "prop": "--spectrum-negative-border-color-focus", + "ref": "var(--spectrum-negative-color-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-border-color-focus-hover": { + "prop": "--spectrum-negative-border-color-focus-hover", + "ref": "var(--spectrum-negative-border-color-down)", + "light": { + "value": "rgb(156, 33, 19)" + }, + "dark": { + "value": "rgb(255, 134, 120)" + } + }, + "negative-border-color-hover": { + "prop": "--spectrum-negative-border-color-hover", + "ref": "var(--spectrum-negative-color-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-border-color-key-focus": { + "prop": "--spectrum-negative-border-color-key-focus", + "ref": "var(--spectrum-negative-color-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-color-100": { + "prop": "--spectrum-negative-color-100", + "ref": "var(--spectrum-red-100)", + "light": { + "value": "rgb(255, 246, 245)" + }, + "dark": { + "value": "rgb(54, 10, 3)" + } + }, + "negative-color-1000": { + "prop": "--spectrum-negative-color-1000", + "ref": "var(--spectrum-red-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-color-1100": { + "prop": "--spectrum-negative-color-1100", + "ref": "var(--spectrum-red-1100)", + "light": { + "value": "rgb(156, 33, 19)" + }, + "dark": { + "value": "rgb(255, 134, 120)" + } + }, + "negative-color-1200": { + "prop": "--spectrum-negative-color-1200", + "ref": "var(--spectrum-red-1200)", + "light": { + "value": "rgb(129, 27, 14)" + }, + "dark": { + "value": "rgb(255, 167, 157)" + } + }, + "negative-color-1300": { + "prop": "--spectrum-negative-color-1300", + "ref": "var(--spectrum-red-1300)", + "light": { + "value": "rgb(104, 21, 10)" + }, + "dark": { + "value": "rgb(255, 196, 189)" + } + }, + "negative-color-1400": { + "prop": "--spectrum-negative-color-1400", + "ref": "var(--spectrum-red-1400)", + "light": { + "value": "rgb(80, 16, 6)" + }, + "dark": { + "value": "rgb(255, 222, 219)" + } + }, + "negative-color-1500": { + "prop": "--spectrum-negative-color-1500", + "ref": "var(--spectrum-red-1500)", + "dark": { + "value": "rgb(255, 242, 240)" + }, + "light": { + "value": "rgb(59, 11, 4)" + } + }, + "negative-color-1600": { + "prop": "--spectrum-negative-color-1600", + "ref": "var(--spectrum-red-1600)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(29, 5, 2)" + } + }, + "negative-color-200": { + "prop": "--spectrum-negative-color-200", + "ref": "var(--spectrum-red-200)", + "light": { + "value": "rgb(255, 235, 232)" + }, + "dark": { + "value": "rgb(68, 13, 5)" + } + }, + "negative-color-300": { + "prop": "--spectrum-negative-color-300", + "ref": "var(--spectrum-red-300)", + "light": { + "value": "rgb(255, 214, 209)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "negative-color-400": { + "prop": "--spectrum-negative-color-400", + "ref": "var(--spectrum-red-400)", + "light": { + "value": "rgb(255, 188, 180)" + }, + "dark": { + "value": "rgb(115, 24, 11)" + } + }, + "negative-color-500": { + "prop": "--spectrum-negative-color-500", + "ref": "var(--spectrum-red-500)", + "light": { + "value": "rgb(255, 157, 145)" + }, + "dark": { + "value": "rgb(147, 31, 17)" + } + }, + "negative-color-600": { + "prop": "--spectrum-negative-color-600", + "ref": "var(--spectrum-red-600)", + "light": { + "value": "rgb(255, 118, 101)" + }, + "dark": { + "value": "rgb(177, 38, 23)" + } + }, + "negative-color-700": { + "prop": "--spectrum-negative-color-700", + "ref": "var(--spectrum-red-700)", + "light": { + "value": "rgb(255, 81, 61)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "negative-color-800": { + "prop": "--spectrum-negative-color-800", + "ref": "var(--spectrum-red-800)", + "light": { + "value": "rgb(240, 56, 35)" + }, + "dark": { + "value": "rgb(223, 52, 34)" + } + }, + "negative-color-900": { + "prop": "--spectrum-negative-color-900", + "ref": "var(--spectrum-red-900)", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "negative-content-color-default": { + "prop": "--spectrum-negative-content-color-default", + "ref": "var(--spectrum-negative-color-900)", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "negative-content-color-down": { + "prop": "--spectrum-negative-content-color-down", + "ref": "var(--spectrum-negative-color-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-content-color-hover": { + "prop": "--spectrum-negative-content-color-hover", + "ref": "var(--spectrum-negative-color-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-content-color-key-focus": { + "prop": "--spectrum-negative-content-color-key-focus", + "ref": "var(--spectrum-negative-color-1000)", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "negative-subdued-background-color-default": { + "prop": "--spectrum-negative-subdued-background-color-default", + "ref": "var(--spectrum-negative-color-300)", + "light": { + "value": "rgb(255, 235, 232)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "negative-subdued-background-color-down": { + "prop": "--spectrum-negative-subdued-background-color-down", + "ref": "var(--spectrum-negative-color-300)", + "light": { + "value": "rgb(255, 214, 209)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "negative-subdued-background-color-hover": { + "prop": "--spectrum-negative-subdued-background-color-hover", + "ref": "var(--spectrum-negative-color-300)", + "light": { + "value": "rgb(255, 214, 209)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "negative-subdued-background-color-key-focus": { + "prop": "--spectrum-negative-subdued-background-color-key-focus", + "ref": "var(--spectrum-negative-color-300)", + "light": { + "value": "rgb(255, 214, 209)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "negative-subtle-background-color-default": { + "prop": "--spectrum-negative-subtle-background-color-default", + "ref": "var(--spectrum-negative-color-300)", + "light": { + "value": "rgb(255, 235, 232)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "negative-visual-color": { + "prop": "--spectrum-negative-visual-color", + "ref": "var(--spectrum-negative-color-900)", + "light": { + "value": "rgb(240, 56, 35)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "neutral-background-color-default": { + "prop": "--spectrum-neutral-background-color-default", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-background-color-down": { + "prop": "--spectrum-neutral-background-color-down", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-background-color-hover": { + "prop": "--spectrum-neutral-background-color-hover", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-background-color-key-focus": { + "prop": "--spectrum-neutral-background-color-key-focus", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-background-color-selected-default": { + "prop": "--spectrum-neutral-background-color-selected-default", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-background-color-selected-down": { + "prop": "--spectrum-neutral-background-color-selected-down", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-background-color-selected-hover": { + "prop": "--spectrum-neutral-background-color-selected-hover", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-background-color-selected-key-focus": { + "prop": "--spectrum-neutral-background-color-selected-key-focus", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-content-color-default": { + "prop": "--spectrum-neutral-content-color-default", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-content-color-down": { + "prop": "--spectrum-neutral-content-color-down", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-content-color-focus": { + "prop": "--spectrum-neutral-content-color-focus", + "ref": "var(--spectrum-neutral-content-color-down)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-content-color-focus-hover": { + "prop": "--spectrum-neutral-content-color-focus-hover", + "ref": "var(--spectrum-neutral-content-color-down)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-content-color-hover": { + "prop": "--spectrum-neutral-content-color-hover", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-content-color-key-focus": { + "prop": "--spectrum-neutral-content-color-key-focus", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "neutral-subdued-background-color-default": { + "prop": "--spectrum-neutral-subdued-background-color-default", + "ref": "var(--spectrum-gray-500)", + "light": { + "value": "rgb(80, 80, 80)" + }, + "dark": { + "value": "rgb(109, 109, 109)" + } + }, + "neutral-subdued-background-color-down": { + "prop": "--spectrum-neutral-subdued-background-color-down", + "ref": "var(--spectrum-gray-400)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "neutral-subdued-background-color-hover": { + "prop": "--spectrum-neutral-subdued-background-color-hover", + "ref": "var(--spectrum-gray-400)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "neutral-subdued-background-color-key-focus": { + "prop": "--spectrum-neutral-subdued-background-color-key-focus", + "ref": "var(--spectrum-gray-400)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "neutral-subdued-content-color-default": { + "prop": "--spectrum-neutral-subdued-content-color-default", + "ref": "var(--spectrum-gray-700)", + "light": { + "value": "rgb(80, 80, 80)" + }, + "dark": { + "value": "rgb(175, 175, 175)" + } + }, + "neutral-subdued-content-color-down": { + "prop": "--spectrum-neutral-subdued-content-color-down", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-subdued-content-color-hover": { + "prop": "--spectrum-neutral-subdued-content-color-hover", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-subdued-content-color-key-focus": { + "prop": "--spectrum-neutral-subdued-content-color-key-focus", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-subdued-content-color-selected": { + "prop": "--spectrum-neutral-subdued-content-color-selected", + "ref": "var(--spectrum-neutral-subdued-content-color-down)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "neutral-subtle-background-color-default": { + "prop": "--spectrum-neutral-subtle-background-color-default", + "ref": "var(--spectrum-gray-300)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(57, 57, 57)" + } + }, + "neutral-visual-color": { + "prop": "--spectrum-neutral-visual-color", + "ref": "var(--spectrum-gray-600)", + "light": { + "value": "rgb(143, 143, 143)" + }, + "dark": { + "value": "rgb(138, 138, 138)" + } + }, + "notice-background-color-default": { + "prop": "--spectrum-notice-background-color-default", + "ref": "var(--spectrum-notice-color-600)", + "dark": { + "value": "rgb(224, 100, 0)" + }, + "light": { + "value": "rgb(252, 125, 0)" + } + }, + "notice-color-100": { + "prop": "--spectrum-notice-color-100", + "ref": "var(--spectrum-orange-100)", + "light": { + "value": "rgb(255, 246, 231)" + }, + "dark": { + "value": "rgb(49, 16, 0)" + } + }, + "notice-color-1000": { + "prop": "--spectrum-notice-color-1000", + "ref": "var(--spectrum-orange-1000)", + "light": { + "value": "rgb(167, 62, 0)" + }, + "dark": { + "value": "rgb(243, 117, 0)" + } + }, + "notice-color-1100": { + "prop": "--spectrum-notice-color-1100", + "ref": "var(--spectrum-orange-1100)", + "light": { + "value": "rgb(144, 51, 0)" + }, + "dark": { + "value": "rgb(255, 137, 0)" + } + }, + "notice-color-1200": { + "prop": "--spectrum-notice-color-1200", + "ref": "var(--spectrum-orange-1200)", + "light": { + "value": "rgb(118, 41, 0)" + }, + "dark": { + "value": "rgb(255, 173, 45)" + } + }, + "notice-color-1300": { + "prop": "--spectrum-notice-color-1300", + "ref": "var(--spectrum-orange-1300)", + "light": { + "value": "rgb(95, 32, 0)" + }, + "dark": { + "value": "rgb(255, 201, 116)" + } + }, + "notice-color-1400": { + "prop": "--spectrum-notice-color-1400", + "ref": "var(--spectrum-orange-1400)", + "light": { + "value": "rgb(73, 24, 0)" + }, + "dark": { + "value": "rgb(255, 225, 178)" + } + }, + "notice-color-1500": { + "prop": "--spectrum-notice-color-1500", + "ref": "var(--spectrum-orange-1500)", + "dark": { + "value": "rgb(255, 243, 225)" + }, + "light": { + "value": "rgb(52, 18, 0)" + } + }, + "notice-color-1600": { + "prop": "--spectrum-notice-color-1600", + "ref": "var(--spectrum-orange-1600)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(25, 8, 0)" + } + }, + "notice-color-200": { + "prop": "--spectrum-notice-color-200", + "ref": "var(--spectrum-orange-200)", + "light": { + "value": "rgb(255, 236, 207)" + }, + "dark": { + "value": "rgb(61, 21, 0)" + } + }, + "notice-color-300": { + "prop": "--spectrum-notice-color-300", + "ref": "var(--spectrum-orange-300)", + "light": { + "value": "rgb(255, 218, 158)" + }, + "dark": { + "value": "rgb(80, 27, 0)" + } + }, + "notice-color-400": { + "prop": "--spectrum-notice-color-400", + "ref": "var(--spectrum-orange-400)", + "light": { + "value": "rgb(255, 193, 94)" + }, + "dark": { + "value": "rgb(106, 36, 0)" + } + }, + "notice-color-500": { + "prop": "--spectrum-notice-color-500", + "ref": "var(--spectrum-orange-500)", + "light": { + "value": "rgb(255, 162, 19)" + }, + "dark": { + "value": "rgb(135, 47, 0)" + } + }, + "notice-color-600": { + "prop": "--spectrum-notice-color-600", + "ref": "var(--spectrum-orange-600)", + "light": { + "value": "rgb(252, 125, 0)" + }, + "dark": { + "value": "rgb(162, 59, 0)" + } + }, + "notice-color-700": { + "prop": "--spectrum-notice-color-700", + "ref": "var(--spectrum-orange-700)", + "light": { + "value": "rgb(232, 106, 0)" + }, + "dark": { + "value": "rgb(185, 73, 0)" + } + }, + "notice-color-800": { + "prop": "--spectrum-notice-color-800", + "ref": "var(--spectrum-orange-800)", + "light": { + "value": "rgb(212, 91, 0)" + }, + "dark": { + "value": "rgb(199, 82, 0)" + } + }, + "notice-color-900": { + "prop": "--spectrum-notice-color-900", + "ref": "var(--spectrum-orange-900)", + "light": { + "value": "rgb(194, 78, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "notice-subtle-background-color-default": { + "prop": "--spectrum-notice-subtle-background-color-default", + "ref": "var(--spectrum-notice-color-300)", + "light": { + "value": "rgb(255, 236, 207)" + }, + "dark": { + "value": "rgb(80, 27, 0)" + } + }, + "notice-visual-color": { + "prop": "--spectrum-notice-visual-color", + "ref": "var(--spectrum-notice-color-900)", + "light": { + "value": "rgb(212, 91, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "number-field-minimum-width-multiplier": { + "prop": "--spectrum-number-field-minimum-width-multiplier", + "value": 1.25 + }, + "number-field-visual-to-in-field-stepper-extra-large": { + "prop": "--spectrum-number-field-visual-to-in-field-stepper-extra-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "number-field-visual-to-in-field-stepper-large": { + "prop": "--spectrum-number-field-visual-to-in-field-stepper-large", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "number-field-visual-to-in-field-stepper-medium": { + "prop": "--spectrum-number-field-visual-to-in-field-stepper-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "number-field-visual-to-in-field-stepper-small": { + "prop": "--spectrum-number-field-visual-to-in-field-stepper-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "number-field-with-stepper-minimum-width-extra-large": { + "prop": "--spectrum-number-field-with-stepper-minimum-width-extra-large", + "desktop": { + "value": "168px" + }, + "mobile": { + "value": "198px" + } + }, + "number-field-with-stepper-minimum-width-large": { + "prop": "--spectrum-number-field-with-stepper-minimum-width-large", + "desktop": { + "value": "144px" + }, + "mobile": { + "value": "174px" + } + }, + "number-field-with-stepper-minimum-width-medium": { + "prop": "--spectrum-number-field-with-stepper-minimum-width-medium", + "desktop": { + "value": "120px" + }, + "mobile": { + "value": "150px" + } + }, + "number-field-with-stepper-minimum-width-small": { + "prop": "--spectrum-number-field-with-stepper-minimum-width-small", + "desktop": { + "value": "104px" + }, + "mobile": { + "value": "126px" + } + }, + "opacity-checkerboard-square-dark": { + "prop": "--spectrum-opacity-checkerboard-square-dark", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "opacity-checkerboard-square-light": { + "prop": "--spectrum-opacity-checkerboard-square-light", + "ref": "var(--spectrum-white)", + "value": "rgb(255, 255, 255)" + }, + "opacity-checkerboard-square-size": { + "prop": "--spectrum-opacity-checkerboard-square-size", + "ref": "var(--spectrum-opacity-checkerboard-square-size-medium)", + "desktop": { + "value": "NaN%" + }, + "mobile": { + "value": "NaN%" + } + }, + "opacity-checkerboard-square-size-medium": { + "prop": "--spectrum-opacity-checkerboard-square-size-medium", + "desktop": { + "ref": "8px", + "value": "NaN%" + }, + "mobile": { + "ref": "10px", + "value": "NaN%" + } + }, + "opacity-checkerboard-square-size-small": { + "prop": "--spectrum-opacity-checkerboard-square-size-small", + "desktop": { + "ref": "4px", + "value": "NaN%" + }, + "mobile": { + "ref": "5px", + "value": "NaN%" + } + }, + "opacity-disabled": { + "prop": "--spectrum-opacity-disabled", + "ref": "0.3", + "value": "30%" + }, + "orange-100": { + "prop": "--spectrum-orange-100", + "light": { + "value": "rgb(255, 246, 231)" + }, + "dark": { + "value": "rgb(49, 16, 0)" + } + }, + "orange-1000": { + "prop": "--spectrum-orange-1000", + "light": { + "value": "rgb(167, 62, 0)" + }, + "dark": { + "value": "rgb(243, 117, 0)" + } + }, + "orange-1100": { + "prop": "--spectrum-orange-1100", + "light": { + "value": "rgb(144, 51, 0)" + }, + "dark": { + "value": "rgb(255, 137, 0)" + } + }, + "orange-1200": { + "prop": "--spectrum-orange-1200", + "light": { + "value": "rgb(118, 41, 0)" + }, + "dark": { + "value": "rgb(255, 173, 45)" + } + }, + "orange-1300": { + "prop": "--spectrum-orange-1300", + "light": { + "value": "rgb(95, 32, 0)" + }, + "dark": { + "value": "rgb(255, 201, 116)" + } + }, + "orange-1400": { + "prop": "--spectrum-orange-1400", + "light": { + "value": "rgb(73, 24, 0)" + }, + "dark": { + "value": "rgb(255, 225, 178)" + } + }, + "orange-1500": { + "prop": "--spectrum-orange-1500", + "dark": { + "value": "rgb(255, 243, 225)" + }, + "light": { + "value": "rgb(52, 18, 0)" + } + }, + "orange-1600": { + "prop": "--spectrum-orange-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(25, 8, 0)" + } + }, + "orange-200": { + "prop": "--spectrum-orange-200", + "light": { + "value": "rgb(255, 236, 207)" + }, + "dark": { + "value": "rgb(61, 21, 0)" + } + }, + "orange-300": { + "prop": "--spectrum-orange-300", + "light": { + "value": "rgb(255, 218, 158)" + }, + "dark": { + "value": "rgb(80, 27, 0)" + } + }, + "orange-400": { + "prop": "--spectrum-orange-400", + "light": { + "value": "rgb(255, 193, 94)" + }, + "dark": { + "value": "rgb(106, 36, 0)" + } + }, + "orange-500": { + "prop": "--spectrum-orange-500", + "light": { + "value": "rgb(255, 162, 19)" + }, + "dark": { + "value": "rgb(135, 47, 0)" + } + }, + "orange-600": { + "prop": "--spectrum-orange-600", + "light": { + "value": "rgb(252, 125, 0)" + }, + "dark": { + "value": "rgb(162, 59, 0)" + } + }, + "orange-700": { + "prop": "--spectrum-orange-700", + "light": { + "value": "rgb(232, 106, 0)" + }, + "dark": { + "value": "rgb(185, 73, 0)" + } + }, + "orange-800": { + "prop": "--spectrum-orange-800", + "light": { + "value": "rgb(212, 91, 0)" + }, + "dark": { + "value": "rgb(199, 82, 0)" + } + }, + "orange-900": { + "prop": "--spectrum-orange-900", + "light": { + "value": "rgb(194, 78, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "orange-background-color-default": { + "prop": "--spectrum-orange-background-color-default", + "ref": "var(--spectrum-orange-900)", + "light": { + "value": "rgb(252, 125, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "orange-subtle-background-color-default": { + "prop": "--spectrum-orange-subtle-background-color-default", + "ref": "var(--spectrum-orange-300)", + "light": { + "value": "rgb(255, 236, 207)" + }, + "dark": { + "value": "rgb(80, 27, 0)" + } + }, + "orange-visual-color": { + "prop": "--spectrum-orange-visual-color", + "ref": "var(--spectrum-orange-900)", + "light": { + "value": "rgb(232, 106, 0)" + }, + "dark": { + "value": "rgb(224, 100, 0)" + } + }, + "overlay-color": { + "prop": "--spectrum-overlay-color", + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "overlay-opacity": { + "prop": "--spectrum-overlay-opacity", + "light": { + "ref": "0.4", + "value": "40%" + }, + "dark": { + "ref": "0.6", + "value": "60%" + } + }, + "pagination-item-inline-spacing": { + "prop": "--spectrum-pagination-item-inline-spacing", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "pagination-textfield-width": { + "prop": "--spectrum-pagination-textfield-width", + "desktop": { + "ref": "var(--spectrum-spacing-700)", + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "picker-border-width": { + "prop": "--spectrum-picker-border-width", + "ref": "var(--spectrum-border-width-100)", + "value": "1px" + }, + "picker-end-edge-to-disclosure-icon-quiet": { + "prop": "--spectrum-picker-end-edge-to-disclosure-icon-quiet", + "value": "0px" + }, + "picker-end-edge-to-disclousure-icon-quiet": { + "prop": "--spectrum-picker-end-edge-to-disclousure-icon-quiet", + "ref": "var(--spectrum-picker-end-edge-to-disclosure-icon-quiet)", + "value": "0px" + }, + "picker-minimum-width-multiplier": { + "prop": "--spectrum-picker-minimum-width-multiplier", + "value": 2 + }, + "picker-visual-to-disclosure-icon-extra-large": { + "prop": "--spectrum-picker-visual-to-disclosure-icon-extra-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "picker-visual-to-disclosure-icon-large": { + "prop": "--spectrum-picker-visual-to-disclosure-icon-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "picker-visual-to-disclosure-icon-medium": { + "prop": "--spectrum-picker-visual-to-disclosure-icon-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "picker-visual-to-disclosure-icon-small": { + "prop": "--spectrum-picker-visual-to-disclosure-icon-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "pink-100": { + "prop": "--spectrum-pink-100", + "dark": { + "value": "rgb(58, 0, 37)" + }, + "light": { + "value": "rgb(255, 246, 252)" + } + }, + "pink-1000": { + "prop": "--spectrum-pink-1000", + "dark": { + "value": "rgb(251, 90, 196)" + }, + "light": { + "value": "rgb(176, 31, 123)" + } + }, + "pink-1100": { + "prop": "--spectrum-pink-1100", + "dark": { + "value": "rgb(255, 122, 210)" + }, + "light": { + "value": "rgb(152, 22, 104)" + } + }, + "pink-1200": { + "prop": "--spectrum-pink-1200", + "dark": { + "value": "rgb(255, 159, 223)" + }, + "light": { + "value": "rgb(128, 12, 85)" + } + }, + "pink-1300": { + "prop": "--spectrum-pink-1300", + "dark": { + "value": "rgb(255, 191, 234)" + }, + "light": { + "value": "rgb(105, 3, 68)" + } + }, + "pink-1400": { + "prop": "--spectrum-pink-1400", + "dark": { + "value": "rgb(255, 219, 243)" + }, + "light": { + "value": "rgb(83, 0, 53)" + } + }, + "pink-1500": { + "prop": "--spectrum-pink-1500", + "dark": { + "value": "rgb(255, 241, 250)" + }, + "light": { + "value": "rgb(62, 0, 39)" + } + }, + "pink-1600": { + "prop": "--spectrum-pink-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(33, 0, 21)" + } + }, + "pink-200": { + "prop": "--spectrum-pink-200", + "dark": { + "value": "rgb(71, 0, 44)" + }, + "light": { + "value": "rgb(255, 232, 247)" + } + }, + "pink-300": { + "prop": "--spectrum-pink-300", + "dark": { + "value": "rgb(90, 0, 57)" + }, + "light": { + "value": "rgb(255, 211, 240)" + } + }, + "pink-400": { + "prop": "--spectrum-pink-400", + "dark": { + "value": "rgb(115, 7, 75)" + }, + "light": { + "value": "rgb(255, 181, 230)" + } + }, + "pink-500": { + "prop": "--spectrum-pink-500", + "dark": { + "value": "rgb(143, 18, 97)" + }, + "light": { + "value": "rgb(255, 148, 219)" + } + }, + "pink-600": { + "prop": "--spectrum-pink-600", + "dark": { + "value": "rgb(171, 29, 119)" + }, + "light": { + "value": "rgb(255, 103, 204)" + } + }, + "pink-700": { + "prop": "--spectrum-pink-700", + "dark": { + "value": "rgb(196, 39, 138)" + }, + "light": { + "value": "rgb(242, 76, 184)" + } + }, + "pink-800": { + "prop": "--spectrum-pink-800", + "dark": { + "value": "rgb(213, 45, 151)" + }, + "light": { + "value": "rgb(228, 52, 163)" + } + }, + "pink-900": { + "prop": "--spectrum-pink-900", + "dark": { + "value": "rgb(236, 67, 175)" + }, + "light": { + "value": "rgb(206, 42, 146)" + } + }, + "pink-background-color-default": { + "prop": "--spectrum-pink-background-color-default", + "ref": "var(--spectrum-pink-800)", + "light": { + "value": "rgb(206, 42, 146)" + }, + "dark": { + "value": "rgb(213, 45, 151)" + } + }, + "pink-subtle-background-color-default": { + "prop": "--spectrum-pink-subtle-background-color-default", + "ref": "var(--spectrum-pink-300)", + "light": { + "value": "rgb(255, 232, 247)" + }, + "dark": { + "value": "rgb(90, 0, 57)" + } + }, + "pink-visual-color": { + "prop": "--spectrum-pink-visual-color", + "ref": "var(--spectrum-pink-900)", + "light": { + "value": "rgb(228, 52, 163)" + }, + "dark": { + "value": "rgb(236, 67, 175)" + } + }, + "popover-border-color": { + "prop": "--spectrum-popover-border-color", + "light": { + "ref": "var(--spectrum-transparent-white-25)", + "value": "rgba(255, 255, 255, 0)" + }, + "ref": "var(--spectrum-gray-400)", + "dark": { + "value": "rgb(68, 68, 68)" + } + }, + "popover-border-opacity": { + "prop": "--spectrum-popover-border-opacity", + "light": { + "ref": "0", + "value": "0%" + }, + "dark": { + "ref": "1.0", + "value": "100%" + } + }, + "popover-edge-to-content-area": { + "prop": "--spectrum-popover-edge-to-content-area", + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + }, + "popover-tip-height": { + "prop": "--spectrum-popover-tip-height", + "value": "8px" + }, + "popover-tip-width": { + "prop": "--spectrum-popover-tip-width", + "value": "16px" + }, + "popover-top-to-content-area": { + "prop": "--spectrum-popover-top-to-content-area", + "ref": "var(--spectrum-popover-edge-to-content-area)", + "value": "8px" + }, + "positive-background-color-default": { + "prop": "--spectrum-positive-background-color-default", + "ref": "var(--spectrum-positive-color-800)", + "light": { + "value": "rgb(5, 131, 78)" + }, + "dark": { + "value": "rgb(6, 136, 80)" + } + }, + "positive-background-color-down": { + "prop": "--spectrum-positive-background-color-down", + "ref": "var(--spectrum-positive-color-700)", + "light": { + "value": "rgb(3, 110, 69)" + }, + "dark": { + "value": "rgb(4, 124, 75)" + } + }, + "positive-background-color-hover": { + "prop": "--spectrum-positive-background-color-hover", + "ref": "var(--spectrum-positive-color-700)", + "light": { + "value": "rgb(3, 110, 69)" + }, + "dark": { + "value": "rgb(4, 124, 75)" + } + }, + "positive-background-color-key-focus": { + "prop": "--spectrum-positive-background-color-key-focus", + "ref": "var(--spectrum-positive-color-700)", + "light": { + "value": "rgb(3, 110, 69)" + }, + "dark": { + "value": "rgb(4, 124, 75)" + } + }, + "positive-color-100": { + "prop": "--spectrum-positive-color-100", + "ref": "var(--spectrum-green-100)", + "light": { + "value": "rgb(237, 252, 241)" + }, + "dark": { + "value": "rgb(0, 30, 23)" + } + }, + "positive-color-1000": { + "prop": "--spectrum-positive-color-1000", + "ref": "var(--spectrum-green-1000)", + "light": { + "value": "rgb(3, 110, 69)" + }, + "dark": { + "value": "rgb(14, 175, 98)" + } + }, + "positive-color-1100": { + "prop": "--spectrum-positive-color-1100", + "ref": "var(--spectrum-green-1100)", + "light": { + "value": "rgb(2, 93, 60)" + }, + "dark": { + "value": "rgb(24, 193, 110)" + } + }, + "positive-color-1200": { + "prop": "--spectrum-positive-color-1200", + "ref": "var(--spectrum-green-1200)", + "light": { + "value": "rgb(1, 76, 52)" + }, + "dark": { + "value": "rgb(57, 215, 134)" + } + }, + "positive-color-1300": { + "prop": "--spectrum-positive-color-1300", + "ref": "var(--spectrum-green-1300)", + "light": { + "value": "rgb(0, 61, 44)" + }, + "dark": { + "value": "rgb(126, 231, 172)" + } + }, + "positive-color-1400": { + "prop": "--spectrum-positive-color-1400", + "ref": "var(--spectrum-green-1400)", + "light": { + "value": "rgb(0, 46, 34)" + }, + "dark": { + "value": "rgb(189, 241, 208)" + } + }, + "positive-color-1500": { + "prop": "--spectrum-positive-color-1500", + "ref": "var(--spectrum-green-1500)", + "dark": { + "value": "rgb(229, 250, 236)" + }, + "light": { + "value": "rgb(0, 33, 25)" + } + }, + "positive-color-1600": { + "prop": "--spectrum-positive-color-1600", + "ref": "var(--spectrum-green-1600)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 15, 12)" + } + }, + "positive-color-200": { + "prop": "--spectrum-positive-color-200", + "ref": "var(--spectrum-green-200)", + "light": { + "value": "rgb(215, 247, 225)" + }, + "dark": { + "value": "rgb(0, 38, 29)" + } + }, + "positive-color-300": { + "prop": "--spectrum-positive-color-300", + "ref": "var(--spectrum-green-300)", + "light": { + "value": "rgb(173, 238, 197)" + }, + "dark": { + "value": "rgb(0, 51, 38)" + } + }, + "positive-color-400": { + "prop": "--spectrum-positive-color-400", + "ref": "var(--spectrum-green-400)", + "light": { + "value": "rgb(107, 227, 162)" + }, + "dark": { + "value": "rgb(0, 68, 48)" + } + }, + "positive-color-500": { + "prop": "--spectrum-positive-color-500", + "ref": "var(--spectrum-green-500)", + "light": { + "value": "rgb(43, 209, 125)" + }, + "dark": { + "value": "rgb(2, 87, 58)" + } + }, + "positive-color-600": { + "prop": "--spectrum-positive-color-600", + "ref": "var(--spectrum-green-600)", + "light": { + "value": "rgb(18, 184, 103)" + }, + "dark": { + "value": "rgb(3, 106, 67)" + } + }, + "positive-color-700": { + "prop": "--spectrum-positive-color-700", + "ref": "var(--spectrum-green-700)", + "light": { + "value": "rgb(11, 164, 93)" + }, + "dark": { + "value": "rgb(4, 124, 75)" + } + }, + "positive-color-800": { + "prop": "--spectrum-positive-color-800", + "ref": "var(--spectrum-green-800)", + "light": { + "value": "rgb(7, 147, 85)" + }, + "dark": { + "value": "rgb(6, 136, 80)" + } + }, + "positive-color-900": { + "prop": "--spectrum-positive-color-900", + "ref": "var(--spectrum-green-900)", + "light": { + "value": "rgb(5, 131, 78)" + }, + "dark": { + "value": "rgb(9, 157, 89)" + } + }, + "positive-subtle-background-color-default": { + "prop": "--spectrum-positive-subtle-background-color-default", + "ref": "var(--spectrum-positive-color-300)", + "light": { + "value": "rgb(215, 247, 225)" + }, + "dark": { + "value": "rgb(0, 51, 38)" + } + }, + "positive-visual-color": { + "prop": "--spectrum-positive-visual-color", + "ref": "var(--spectrum-positive-color-900)", + "light": { + "value": "rgb(7, 147, 85)" + }, + "dark": { + "value": "rgb(9, 157, 89)" + } + }, + "progress-bar-maximum-width": { + "prop": "--spectrum-progress-bar-maximum-width", + "value": "768px" + }, + "progress-bar-minimum-width": { + "prop": "--spectrum-progress-bar-minimum-width", + "value": "48px" + }, + "progress-bar-thickness-extra-large": { + "prop": "--spectrum-progress-bar-thickness-extra-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "progress-bar-thickness-large": { + "prop": "--spectrum-progress-bar-thickness-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "progress-bar-thickness-medium": { + "prop": "--spectrum-progress-bar-thickness-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "progress-bar-thickness-small": { + "prop": "--spectrum-progress-bar-thickness-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "progress-circle-size-large": { + "prop": "--spectrum-progress-circle-size-large", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "80px" + } + }, + "progress-circle-size-medium": { + "prop": "--spectrum-progress-circle-size-medium", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "progress-circle-size-small": { + "prop": "--spectrum-progress-circle-size-small", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "progress-circle-thickness-large": { + "prop": "--spectrum-progress-circle-thickness-large", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "progress-circle-thickness-medium": { + "prop": "--spectrum-progress-circle-thickness-medium", + "desktop": { + "value": "3px" + }, + "mobile": { + "value": "4px" + } + }, + "progress-circle-thickness-small": { + "prop": "--spectrum-progress-circle-thickness-small", + "desktop": { + "value": "2px" + }, + "mobile": { + "value": "3px" + } + }, + "purple-100": { + "prop": "--spectrum-purple-100", + "light": { + "value": "rgb(251, 247, 254)" + }, + "dark": { + "value": "rgb(41, 0, 79)" + } + }, + "purple-1000": { + "prop": "--spectrum-purple-1000", + "light": { + "value": "rgb(134, 40, 217)" + }, + "dark": { + "value": "rgb(186, 127, 237)" + } + }, + "purple-1100": { + "prop": "--spectrum-purple-1100", + "light": { + "value": "rgb(115, 13, 204)" + }, + "dark": { + "value": "rgb(197, 149, 240)" + } + }, + "purple-1200": { + "prop": "--spectrum-purple-1200", + "light": { + "value": "rgb(93, 0, 177)" + }, + "dark": { + "value": "rgb(212, 176, 244)" + } + }, + "purple-1300": { + "prop": "--spectrum-purple-1300", + "light": { + "value": "rgb(75, 0, 144)" + }, + "dark": { + "value": "rgb(225, 201, 247)" + } + }, + "purple-1400": { + "prop": "--spectrum-purple-1400", + "light": { + "value": "rgb(59, 0, 111)" + }, + "dark": { + "value": "rgb(238, 224, 250)" + } + }, + "purple-1500": { + "prop": "--spectrum-purple-1500", + "dark": { + "value": "rgb(248, 243, 253)" + }, + "light": { + "value": "rgb(44, 0, 84)" + } + }, + "purple-1600": { + "prop": "--spectrum-purple-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(23, 0, 45)" + } + }, + "purple-200": { + "prop": "--spectrum-purple-200", + "light": { + "value": "rgb(244, 235, 252)" + }, + "dark": { + "value": "rgb(50, 0, 96)" + } + }, + "purple-300": { + "prop": "--spectrum-purple-300", + "light": { + "value": "rgb(235, 218, 249)" + }, + "dark": { + "value": "rgb(64, 0, 122)" + } + }, + "purple-400": { + "prop": "--spectrum-purple-400", + "light": { + "value": "rgb(221, 193, 246)" + }, + "dark": { + "value": "rgb(83, 0, 159)" + } + }, + "purple-500": { + "prop": "--spectrum-purple-500", + "light": { + "value": "rgb(208, 167, 243)" + }, + "dark": { + "value": "rgb(107, 6, 195)" + } + }, + "purple-600": { + "prop": "--spectrum-purple-600", + "light": { + "value": "rgb(191, 138, 238)" + }, + "dark": { + "value": "rgb(130, 34, 215)" + } + }, + "purple-700": { + "prop": "--spectrum-purple-700", + "light": { + "value": "rgb(178, 114, 235)" + }, + "dark": { + "value": "rgb(148, 62, 224)" + } + }, + "purple-800": { + "prop": "--spectrum-purple-800", + "light": { + "value": "rgb(166, 92, 231)" + }, + "dark": { + "value": "rgb(157, 78, 228)" + } + }, + "purple-900": { + "prop": "--spectrum-purple-900", + "light": { + "value": "rgb(154, 71, 226)" + }, + "dark": { + "value": "rgb(173, 105, 233)" + } + }, + "purple-background-color-default": { + "prop": "--spectrum-purple-background-color-default", + "ref": "var(--spectrum-purple-800)", + "light": { + "value": "rgb(154, 71, 226)" + }, + "dark": { + "value": "rgb(157, 78, 228)" + } + }, + "purple-subtle-background-color-default": { + "prop": "--spectrum-purple-subtle-background-color-default", + "ref": "var(--spectrum-purple-300)", + "light": { + "value": "rgb(244, 235, 252)" + }, + "dark": { + "value": "rgb(64, 0, 122)" + } + }, + "purple-visual-color": { + "prop": "--spectrum-purple-visual-color", + "ref": "var(--spectrum-purple-900)", + "light": { + "value": "rgb(166, 92, 231)" + }, + "dark": { + "value": "rgb(173, 105, 233)" + } + }, + "radio-button-control-size-extra-large": { + "prop": "--spectrum-radio-button-control-size-extra-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "radio-button-control-size-large": { + "prop": "--spectrum-radio-button-control-size-large", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "radio-button-control-size-medium": { + "prop": "--spectrum-radio-button-control-size-medium", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "radio-button-control-size-small": { + "prop": "--spectrum-radio-button-control-size-small", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "radio-button-selection-indicator": { + "prop": "--spectrum-radio-button-selection-indicator", + "value": "4px" + }, + "radio-button-top-to-control-extra-large": { + "prop": "--spectrum-radio-button-top-to-control-extra-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "radio-button-top-to-control-large": { + "prop": "--spectrum-radio-button-top-to-control-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "radio-button-top-to-control-medium": { + "prop": "--spectrum-radio-button-top-to-control-medium", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "radio-button-top-to-control-small": { + "prop": "--spectrum-radio-button-top-to-control-small", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "rating-bottom-to-content-area-medium": { + "prop": "--spectrum-rating-bottom-to-content-area-medium", + "value": "6px" + }, + "rating-bottom-to-content-area-small": { + "prop": "--spectrum-rating-bottom-to-content-area-small", + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "rating-edge-to-content-area-medium": { + "prop": "--spectrum-rating-edge-to-content-area-medium", + "value": "6px" + }, + "rating-edge-to-content-area-small": { + "prop": "--spectrum-rating-edge-to-content-area-small", + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "rating-height-medium": { + "prop": "--spectrum-rating-height-medium", + "ref": "var(--spectrum-component-height-100)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "rating-height-small": { + "prop": "--spectrum-rating-height-small", + "ref": "var(--spectrum-component-height-75)", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "rating-icon-spacing": { + "prop": "--spectrum-rating-icon-spacing", + "desktop": { + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-100)", + "value": "8px" + } + }, + "rating-indicator-to-icon": { + "prop": "--spectrum-rating-indicator-to-icon", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "rating-indicator-width": { + "prop": "--spectrum-rating-indicator-width", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "rating-top-to-content-area-medium": { + "prop": "--spectrum-rating-top-to-content-area-medium", + "value": "6px" + }, + "rating-top-to-content-area-small": { + "prop": "--spectrum-rating-top-to-content-area-small", + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "rating-width-medium": { + "prop": "--spectrum-rating-width-medium", + "value": "128px" + }, + "rating-width-small": { + "prop": "--spectrum-rating-width-small", + "value": "104px" + }, + "red-100": { + "prop": "--spectrum-red-100", + "light": { + "value": "rgb(255, 246, 245)" + }, + "dark": { + "value": "rgb(54, 10, 3)" + } + }, + "red-1000": { + "prop": "--spectrum-red-1000", + "light": { + "value": "rgb(183, 40, 24)" + }, + "dark": { + "value": "rgb(255, 103, 86)" + } + }, + "red-1100": { + "prop": "--spectrum-red-1100", + "light": { + "value": "rgb(156, 33, 19)" + }, + "dark": { + "value": "rgb(255, 134, 120)" + } + }, + "red-1200": { + "prop": "--spectrum-red-1200", + "light": { + "value": "rgb(129, 27, 14)" + }, + "dark": { + "value": "rgb(255, 167, 157)" + } + }, + "red-1300": { + "prop": "--spectrum-red-1300", + "light": { + "value": "rgb(104, 21, 10)" + }, + "dark": { + "value": "rgb(255, 196, 189)" + } + }, + "red-1400": { + "prop": "--spectrum-red-1400", + "light": { + "value": "rgb(80, 16, 6)" + }, + "dark": { + "value": "rgb(255, 222, 219)" + } + }, + "red-1500": { + "prop": "--spectrum-red-1500", + "dark": { + "value": "rgb(255, 242, 240)" + }, + "light": { + "value": "rgb(59, 11, 4)" + } + }, + "red-1600": { + "prop": "--spectrum-red-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(29, 5, 2)" + } + }, + "red-200": { + "prop": "--spectrum-red-200", + "light": { + "value": "rgb(255, 235, 232)" + }, + "dark": { + "value": "rgb(68, 13, 5)" + } + }, + "red-300": { + "prop": "--spectrum-red-300", + "light": { + "value": "rgb(255, 214, 209)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "red-400": { + "prop": "--spectrum-red-400", + "light": { + "value": "rgb(255, 188, 180)" + }, + "dark": { + "value": "rgb(115, 24, 11)" + } + }, + "red-500": { + "prop": "--spectrum-red-500", + "light": { + "value": "rgb(255, 157, 145)" + }, + "dark": { + "value": "rgb(147, 31, 17)" + } + }, + "red-600": { + "prop": "--spectrum-red-600", + "light": { + "value": "rgb(255, 118, 101)" + }, + "dark": { + "value": "rgb(177, 38, 23)" + } + }, + "red-700": { + "prop": "--spectrum-red-700", + "light": { + "value": "rgb(255, 81, 61)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "red-800": { + "prop": "--spectrum-red-800", + "light": { + "value": "rgb(240, 56, 35)" + }, + "dark": { + "value": "rgb(223, 52, 34)" + } + }, + "red-900": { + "prop": "--spectrum-red-900", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(252, 67, 46)" + } + }, + "red-background-color-default": { + "prop": "--spectrum-red-background-color-default", + "ref": "var(--spectrum-red-800)", + "light": { + "value": "rgb(215, 50, 32)" + }, + "dark": { + "value": "rgb(223, 52, 34)" + } + }, + "red-subtle-background-color-default": { + "prop": "--spectrum-red-subtle-background-color-default", + "ref": "var(--spectrum-red-300)", + "light": { + "value": "rgb(255, 235, 232)" + }, + "dark": { + "value": "rgb(87, 17, 7)" + } + }, + "red-visual-color": { + "prop": "--spectrum-red-visual-color", + "ref": "var(--spectrum-red-700)", + "light": { + "value": "rgb(240, 56, 35)" + }, + "dark": { + "value": "rgb(205, 46, 29)" + } + }, + "regular-font-weight": { + "prop": "--spectrum-regular-font-weight", + "ref": "regular", + "value": "400" + }, + "sans-font-family-stack": { + "prop": "--spectrum-sans-font-family-stack", + "value": "adobe-clean, var(--spectrum-sans-serif-font-family), \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "sans-serif-font": { + "prop": "--spectrum-sans-serif-font", + "ref": "var(--spectrum-sans-font-family-stack)", + "value": "adobe-clean, var(--spectrum-sans-serif-font-family), \"Source Sans Pro\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Ubuntu, \"Trebuchet MS\", \"Lucida Grande\", sans-serif" + }, + "sans-serif-font-family": { + "prop": "--spectrum-sans-serif-font-family", + "value": "Adobe Clean" + }, + "seafoam-100": { + "prop": "--spectrum-seafoam-100", + "light": { + "value": "rgb(235, 251, 246)" + }, + "dark": { + "value": "rgb(0, 30, 27)" + } + }, + "seafoam-1000": { + "prop": "--spectrum-seafoam-1000", + "light": { + "value": "rgb(5, 108, 92)" + }, + "dark": { + "value": "rgb(12, 173, 142)" + } + }, + "seafoam-1100": { + "prop": "--spectrum-seafoam-1100", + "light": { + "value": "rgb(3, 92, 80)" + }, + "dark": { + "value": "rgb(14, 190, 156)" + } + }, + "seafoam-1200": { + "prop": "--spectrum-seafoam-1200", + "light": { + "value": "rgb(1, 75, 67)" + }, + "dark": { + "value": "rgb(29, 214, 176)" + } + }, + "seafoam-1300": { + "prop": "--spectrum-seafoam-1300", + "light": { + "value": "rgb(0, 60, 54)" + }, + "dark": { + "value": "rgb(122, 229, 203)" + } + }, + "seafoam-1400": { + "prop": "--spectrum-seafoam-1400", + "light": { + "value": "rgb(0, 46, 40)" + }, + "dark": { + "value": "rgb(186, 241, 222)" + } + }, + "seafoam-1500": { + "prop": "--spectrum-seafoam-1500", + "dark": { + "value": "rgb(229, 249, 243)" + }, + "light": { + "value": "rgb(0, 33, 29)" + } + }, + "seafoam-1600": { + "prop": "--spectrum-seafoam-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 15, 14)" + } + }, + "seafoam-200": { + "prop": "--spectrum-seafoam-200", + "light": { + "value": "rgb(211, 246, 234)" + }, + "dark": { + "value": "rgb(0, 39, 35)" + } + }, + "seafoam-300": { + "prop": "--spectrum-seafoam-300", + "light": { + "value": "rgb(169, 237, 216)" + }, + "dark": { + "value": "rgb(0, 50, 44)" + } + }, + "seafoam-400": { + "prop": "--spectrum-seafoam-400", + "light": { + "value": "rgb(92, 225, 194)" + }, + "dark": { + "value": "rgb(0, 67, 59)" + } + }, + "seafoam-500": { + "prop": "--spectrum-seafoam-500", + "light": { + "value": "rgb(16, 207, 169)" + }, + "dark": { + "value": "rgb(2, 86, 75)" + } + }, + "seafoam-600": { + "prop": "--spectrum-seafoam-600", + "light": { + "value": "rgb(13, 181, 149)" + }, + "dark": { + "value": "rgb(4, 105, 89)" + } + }, + "seafoam-700": { + "prop": "--spectrum-seafoam-700", + "light": { + "value": "rgb(11, 162, 134)" + }, + "dark": { + "value": "rgb(6, 122, 103)" + } + }, + "seafoam-800": { + "prop": "--spectrum-seafoam-800", + "light": { + "value": "rgb(9, 144, 120)" + }, + "dark": { + "value": "rgb(8, 134, 112)" + } + }, + "seafoam-900": { + "prop": "--spectrum-seafoam-900", + "light": { + "value": "rgb(7, 129, 109)" + }, + "dark": { + "value": "rgb(10, 154, 128)" + } + }, + "seafoam-background-color-default": { + "prop": "--spectrum-seafoam-background-color-default", + "ref": "var(--spectrum-seafoam-800)", + "light": { + "value": "rgb(7, 129, 109)" + }, + "dark": { + "value": "rgb(8, 134, 112)" + } + }, + "seafoam-subtle-background-color-default": { + "prop": "--spectrum-seafoam-subtle-background-color-default", + "ref": "var(--spectrum-seafoam-300)", + "light": { + "value": "rgb(211, 246, 234)" + }, + "dark": { + "value": "rgb(0, 50, 44)" + } + }, + "seafoam-visual-color": { + "prop": "--spectrum-seafoam-visual-color", + "ref": "var(--spectrum-seafoam-800)", + "light": { + "value": "rgb(11, 162, 134)" + }, + "dark": { + "value": "rgb(8, 134, 112)" + } + }, + "search-field-minimum-width-multiplier": { + "prop": "--spectrum-search-field-minimum-width-multiplier", + "value": 4 + }, + "segmented-control-item-height": { + "prop": "--spectrum-segmented-control-item-height", + "ref": "var(--spectrum-component-height-100)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "segmented-control-item-maximum-width": { + "prop": "--spectrum-segmented-control-item-maximum-width", + "value": "265px" + }, + "segmented-control-selection-border-width": { + "prop": "--spectrum-segmented-control-selection-border-width", + "ref": "var(--spectrum-border-width-200)", + "value": "2px" + }, + "segmented-text-field-gap": { + "prop": "--spectrum-segmented-text-field-gap", + "value": "0px" + }, + "segmented-text-field-rounding": { + "prop": "--spectrum-segmented-text-field-rounding", + "value": "2px" + }, + "select-box-edge-to-checkbox": { + "prop": "--spectrum-select-box-edge-to-checkbox", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "select-box-horizontal-end-to-content": { + "prop": "--spectrum-select-box-horizontal-end-to-content", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "select-box-horizontal-illustration-to-label": { + "prop": "--spectrum-select-box-horizontal-illustration-to-label", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "select-box-horizontal-label-to-description": { + "prop": "--spectrum-select-box-horizontal-label-to-description", + "desktop": { + "value": "2px" + }, + "mobile": { + "value": "3px" + } + }, + "select-box-horizontal-minimum-height": { + "prop": "--spectrum-select-box-horizontal-minimum-height", + "desktop": { + "value": "80px" + }, + "mobile": { + "value": "100px" + } + }, + "select-box-horizontal-start-to-content": { + "prop": "--spectrum-select-box-horizontal-start-to-content", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "select-box-horizontal-top-to-content": { + "prop": "--spectrum-select-box-horizontal-top-to-content", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "select-box-horizontal-width": { + "prop": "--spectrum-select-box-horizontal-width", + "desktop": { + "value": "368px" + }, + "mobile": { + "value": "460px" + } + }, + "select-box-selected-border-color": { + "prop": "--spectrum-select-box-selected-border-color", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "select-box-top-to-checkbox": { + "prop": "--spectrum-select-box-top-to-checkbox", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "select-box-vertical-edge-to-content": { + "prop": "--spectrum-select-box-vertical-edge-to-content", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "select-box-vertical-height": { + "prop": "--spectrum-select-box-vertical-height", + "desktop": { + "value": "170px" + }, + "mobile": { + "value": "212px" + } + }, + "select-box-vertical-illustration-to-label": { + "prop": "--spectrum-select-box-vertical-illustration-to-label", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "serif-font": { + "prop": "--spectrum-serif-font", + "ref": "var(--spectrum-serif-font-family-stack)", + "value": "adobe-clean-serif, var(--spectrum-serif-font-family), \"Source Serif Pro\", Georgia, serif" + }, + "serif-font-family": { + "prop": "--spectrum-serif-font-family", + "value": "Adobe Clean Serif" + }, + "serif-font-family-stack": { + "prop": "--spectrum-serif-font-family-stack", + "value": "adobe-clean-serif, var(--spectrum-serif-font-family), \"Source Serif Pro\", Georgia, serif" + }, + "side-focus-indicator": { + "prop": "--spectrum-side-focus-indicator", + "value": "4px" + }, + "side-label-character-count-to-field": { + "prop": "--spectrum-side-label-character-count-to-field", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "side-label-character-count-top-margin-extra-large": { + "prop": "--spectrum-side-label-character-count-top-margin-extra-large", + "value": "0px" + }, + "side-label-character-count-top-margin-large": { + "prop": "--spectrum-side-label-character-count-top-margin-large", + "value": "0px" + }, + "side-label-character-count-top-margin-medium": { + "prop": "--spectrum-side-label-character-count-top-margin-medium", + "value": "0px" + }, + "side-label-character-count-top-margin-small": { + "prop": "--spectrum-side-label-character-count-top-margin-small", + "value": "0px" + }, + "side-navigation-bottom-to-text": { + "prop": "--spectrum-side-navigation-bottom-to-text", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "side-navigation-header-to-item": { + "prop": "--spectrum-side-navigation-header-to-item", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "side-navigation-item-to-header": { + "prop": "--spectrum-side-navigation-item-to-header", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "side-navigation-item-to-item": { + "prop": "--spectrum-side-navigation-item-to-item", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "side-navigation-maximum-width": { + "prop": "--spectrum-side-navigation-maximum-width", + "desktop": { + "value": "240px" + }, + "mobile": { + "value": "300px" + } + }, + "side-navigation-minimum-width": { + "prop": "--spectrum-side-navigation-minimum-width", + "desktop": { + "value": "160px" + }, + "mobile": { + "value": "200px" + } + }, + "side-navigation-second-level-edge-to-text": { + "prop": "--spectrum-side-navigation-second-level-edge-to-text", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "side-navigation-third-level-edge-to-text": { + "prop": "--spectrum-side-navigation-third-level-edge-to-text", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "45px" + } + }, + "side-navigation-width": { + "prop": "--spectrum-side-navigation-width", + "desktop": { + "value": "192px" + }, + "mobile": { + "value": "240px" + } + }, + "side-navigation-with-icon-second-level-edge-to-text": { + "prop": "--spectrum-side-navigation-with-icon-second-level-edge-to-text", + "desktop": { + "value": "50px" + }, + "mobile": { + "value": "62px" + } + }, + "side-navigation-with-icon-third-level-edge-to-text": { + "prop": "--spectrum-side-navigation-with-icon-third-level-edge-to-text", + "desktop": { + "value": "62px" + }, + "mobile": { + "value": "77px" + } + }, + "silver-100": { + "prop": "--spectrum-silver-100", + "dark": { + "value": "rgb(26, 26, 26)" + }, + "light": { + "value": "rgb(247, 247, 247)" + } + }, + "silver-1000": { + "prop": "--spectrum-silver-1000", + "dark": { + "value": "rgb(152, 152, 152)" + }, + "light": { + "value": "rgb(96, 96, 96)" + } + }, + "silver-1100": { + "prop": "--spectrum-silver-1100", + "dark": { + "value": "rgb(169, 169, 169)" + }, + "light": { + "value": "rgb(81, 81, 81)" + } + }, + "silver-1200": { + "prop": "--spectrum-silver-1200", + "dark": { + "value": "rgb(190, 190, 190)" + }, + "light": { + "value": "rgb(66, 66, 66)" + } + }, + "silver-1300": { + "prop": "--spectrum-silver-1300", + "dark": { + "value": "rgb(211, 211, 211)" + }, + "light": { + "value": "rgb(52, 52, 52)" + } + }, + "silver-1400": { + "prop": "--spectrum-silver-1400", + "dark": { + "value": "rgb(229, 229, 229)" + }, + "light": { + "value": "rgb(39, 39, 39)" + } + }, + "silver-1500": { + "prop": "--spectrum-silver-1500", + "dark": { + "value": "rgb(244, 244, 244)" + }, + "light": { + "value": "rgb(28, 28, 28)" + } + }, + "silver-1600": { + "prop": "--spectrum-silver-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(12, 12, 12)" + } + }, + "silver-200": { + "prop": "--spectrum-silver-200", + "dark": { + "value": "rgb(33, 33, 33)" + }, + "light": { + "value": "rgb(239, 239, 239)" + } + }, + "silver-300": { + "prop": "--spectrum-silver-300", + "dark": { + "value": "rgb(44, 44, 44)" + }, + "light": { + "value": "rgb(223, 223, 223)" + } + }, + "silver-400": { + "prop": "--spectrum-silver-400", + "dark": { + "value": "rgb(59, 59, 59)" + }, + "light": { + "value": "rgb(204, 204, 204)" + } + }, + "silver-500": { + "prop": "--spectrum-silver-500", + "dark": { + "value": "rgb(76, 76, 76)" + }, + "light": { + "value": "rgb(183, 183, 183)" + } + }, + "silver-600": { + "prop": "--spectrum-silver-600", + "dark": { + "value": "rgb(92, 92, 92)" + }, + "light": { + "value": "rgb(160, 160, 160)" + } + }, + "silver-700": { + "prop": "--spectrum-silver-700", + "dark": { + "value": "rgb(108, 108, 108)" + }, + "light": { + "value": "rgb(143, 143, 143)" + } + }, + "silver-800": { + "prop": "--spectrum-silver-800", + "dark": { + "value": "rgb(118, 118, 118)" + }, + "light": { + "value": "rgb(128, 128, 128)" + } + }, + "silver-900": { + "prop": "--spectrum-silver-900", + "dark": { + "value": "rgb(137, 137, 137)" + }, + "light": { + "value": "rgb(114, 114, 114)" + } + }, + "silver-background-color-default": { + "prop": "--spectrum-silver-background-color-default", + "ref": "var(--spectrum-silver-800)", + "light": { + "value": "rgb(114, 114, 114)" + }, + "dark": { + "value": "rgb(118, 118, 118)" + } + }, + "silver-subtle-background-color-default": { + "prop": "--spectrum-silver-subtle-background-color-default", + "ref": "var(--spectrum-silver-300)", + "light": { + "value": "rgb(239, 239, 239)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "silver-visual-color": { + "prop": "--spectrum-silver-visual-color", + "ref": "var(--spectrum-silver-900)", + "light": { + "value": "rgb(128, 128, 128)" + }, + "dark": { + "value": "rgb(137, 137, 137)" + } + }, + "single-calendar-popover-minimum-height": { + "prop": "--spectrum-single-calendar-popover-minimum-height", + "value": "320px" + }, + "single-calendar-popover-minimum-width": { + "prop": "--spectrum-single-calendar-popover-minimum-width", + "value": "320px" + }, + "slider-bottom-to-handle-extra-large": { + "prop": "--spectrum-slider-bottom-to-handle-extra-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "slider-bottom-to-handle-large": { + "prop": "--spectrum-slider-bottom-to-handle-large", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "slider-bottom-to-handle-medium": { + "prop": "--spectrum-slider-bottom-to-handle-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "slider-bottom-to-handle-small": { + "prop": "--spectrum-slider-bottom-to-handle-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "slider-control-height-extra-large": { + "prop": "--spectrum-slider-control-height-extra-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "26px" + } + }, + "slider-control-height-large": { + "prop": "--spectrum-slider-control-height-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "slider-control-height-medium": { + "prop": "--spectrum-slider-control-height-medium", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-control-height-small": { + "prop": "--spectrum-slider-control-height-small", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "slider-control-to-field-label-editable-extra-large": { + "prop": "--spectrum-slider-control-to-field-label-editable-extra-large", + "desktop": { + "value": "-20px" + }, + "mobile": { + "value": "-24px" + } + }, + "slider-control-to-field-label-editable-large": { + "prop": "--spectrum-slider-control-to-field-label-editable-large", + "desktop": { + "value": "-16px" + }, + "mobile": { + "value": "-20px" + } + }, + "slider-control-to-field-label-editable-medium": { + "prop": "--spectrum-slider-control-to-field-label-editable-medium", + "desktop": { + "value": "-12px" + }, + "mobile": { + "value": "-16px" + } + }, + "slider-control-to-field-label-editable-small": { + "prop": "--spectrum-slider-control-to-field-label-editable-small", + "desktop": { + "value": "-4px" + }, + "mobile": { + "value": "-8px" + } + }, + "slider-control-to-field-label-extra-large": { + "prop": "--spectrum-slider-control-to-field-label-extra-large", + "desktop": { + "value": "-20px" + }, + "mobile": { + "value": "-28px" + } + }, + "slider-control-to-field-label-large": { + "prop": "--spectrum-slider-control-to-field-label-large", + "desktop": { + "value": "-16px" + }, + "mobile": { + "value": "-20px" + } + }, + "slider-control-to-field-label-medium": { + "prop": "--spectrum-slider-control-to-field-label-medium", + "desktop": { + "value": "-12px" + }, + "mobile": { + "value": "-16px" + } + }, + "slider-control-to-field-label-side-extra-large": { + "prop": "--spectrum-slider-control-to-field-label-side-extra-large", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "28px" + } + }, + "slider-control-to-field-label-side-large": { + "prop": "--spectrum-slider-control-to-field-label-side-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "slider-control-to-field-label-side-medium": { + "prop": "--spectrum-slider-control-to-field-label-side-medium", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-control-to-field-label-side-small": { + "prop": "--spectrum-slider-control-to-field-label-side-small", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-control-to-field-label-small": { + "prop": "--spectrum-slider-control-to-field-label-small", + "desktop": { + "value": "-4px" + }, + "mobile": { + "value": "-8px" + } + }, + "slider-control-to-text-field-extra-large": { + "prop": "--spectrum-slider-control-to-text-field-extra-large", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "28px" + } + }, + "slider-control-to-text-field-large": { + "prop": "--spectrum-slider-control-to-text-field-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "slider-control-to-text-field-medium": { + "prop": "--spectrum-slider-control-to-text-field-medium", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-control-to-text-field-small": { + "prop": "--spectrum-slider-control-to-text-field-small", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-handle-border-width-down-extra-large": { + "prop": "--spectrum-slider-handle-border-width-down-extra-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "11px" + } + }, + "slider-handle-border-width-down-large": { + "prop": "--spectrum-slider-handle-border-width-down-large", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "slider-handle-border-width-down-medium": { + "prop": "--spectrum-slider-handle-border-width-down-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "slider-handle-border-width-down-small": { + "prop": "--spectrum-slider-handle-border-width-down-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "slider-handle-extra-large": { + "prop": "--spectrum-slider-handle-extra-large", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "slider-handle-gap": { + "prop": "--spectrum-slider-handle-gap", + "value": "4px" + }, + "slider-handle-height-precision-extra-large": { + "prop": "--spectrum-slider-handle-height-precision-extra-large", + "desktop": { + "value": "26px" + }, + "mobile": { + "value": "32px" + } + }, + "slider-handle-height-precision-large": { + "prop": "--spectrum-slider-handle-height-precision-large", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "slider-handle-height-precision-medium": { + "prop": "--spectrum-slider-handle-height-precision-medium", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "26px" + } + }, + "slider-handle-height-precision-small": { + "prop": "--spectrum-slider-handle-height-precision-small", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "slider-handle-large": { + "prop": "--spectrum-slider-handle-large", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "28px" + } + }, + "slider-handle-medium": { + "prop": "--spectrum-slider-handle-medium", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "slider-handle-precision-width": { + "prop": "--spectrum-slider-handle-precision-width", + "value": "6px" + }, + "slider-handle-size-extra-large": { + "prop": "--spectrum-slider-handle-size-extra-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "26px" + } + }, + "slider-handle-size-large": { + "prop": "--spectrum-slider-handle-size-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "slider-handle-size-medium": { + "prop": "--spectrum-slider-handle-size-medium", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-handle-size-small": { + "prop": "--spectrum-slider-handle-size-small", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "slider-handle-small": { + "prop": "--spectrum-slider-handle-small", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "slider-ramp-track-height": { + "prop": "--spectrum-slider-ramp-track-height", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "slider-tick-mark-height": { + "prop": "--spectrum-slider-tick-mark-height", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "slider-track-height-large": { + "prop": "--spectrum-slider-track-height-large", + "value": "16px" + }, + "slider-track-height-medium": { + "prop": "--spectrum-slider-track-height-medium", + "value": "4px" + }, + "slider-track-thickness": { + "prop": "--spectrum-slider-track-thickness", + "value": "2px" + }, + "spacing-100": { + "prop": "--spectrum-spacing-100", + "value": "8px" + }, + "spacing-1000": { + "prop": "--spectrum-spacing-1000", + "value": "96px" + }, + "spacing-200": { + "prop": "--spectrum-spacing-200", + "value": "12px" + }, + "spacing-300": { + "prop": "--spectrum-spacing-300", + "value": "16px" + }, + "spacing-400": { + "prop": "--spectrum-spacing-400", + "value": "24px" + }, + "spacing-50": { + "prop": "--spectrum-spacing-50", + "value": "2px" + }, + "spacing-500": { + "prop": "--spectrum-spacing-500", + "value": "32px" + }, + "spacing-600": { + "prop": "--spectrum-spacing-600", + "value": "40px" + }, + "spacing-700": { + "prop": "--spectrum-spacing-700", + "value": "48px" + }, + "spacing-75": { + "prop": "--spectrum-spacing-75", + "value": "4px" + }, + "spacing-800": { + "prop": "--spectrum-spacing-800", + "value": "64px" + }, + "spacing-900": { + "prop": "--spectrum-spacing-900", + "value": "80px" + }, + "stack-item-action-to-navigation": { + "prop": "--spectrum-stack-item-action-to-navigation", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "6px" + } + }, + "stack-item-background-color-down": { + "prop": "--spectrum-stack-item-background-color-down", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "stack-item-background-color-hover": { + "prop": "--spectrum-stack-item-background-color-hover", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "stack-item-background-color-key-focus": { + "prop": "--spectrum-stack-item-background-color-key-focus", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "stack-item-drag-handle-to-control": { + "prop": "--spectrum-stack-item-drag-handle-to-control", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "stack-item-edge-to-control": { + "prop": "--spectrum-stack-item-edge-to-control", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "stack-item-edge-to-visual": { + "prop": "--spectrum-stack-item-edge-to-visual", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "stack-item-header-minimum-width": { + "prop": "--spectrum-stack-item-header-minimum-width", + "desktop": { + "value": "200px" + }, + "mobile": { + "value": "240px" + } + }, + "stack-item-header-to-item": { + "prop": "--spectrum-stack-item-header-to-item", + "value": "0px" + }, + "stack-item-item-to-item": { + "prop": "--spectrum-stack-item-item-to-item", + "value": "-1px" + }, + "stack-item-selected-background-color-default": { + "prop": "--spectrum-stack-item-selected-background-color-default", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "stack-item-selected-background-color-down": { + "prop": "--spectrum-stack-item-selected-background-color-down", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "stack-item-selected-background-color-emphasized": { + "prop": "--spectrum-stack-item-selected-background-color-emphasized", + "ref": "var(--spectrum-accent-color-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "stack-item-selected-background-color-hover": { + "prop": "--spectrum-stack-item-selected-background-color-hover", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "stack-item-selected-background-color-key-focus": { + "prop": "--spectrum-stack-item-selected-background-color-key-focus", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "stack-item-selected-background-opacity-emphasized": { + "prop": "--spectrum-stack-item-selected-background-opacity-emphasized", + "ref": "0.1", + "value": "10%" + }, + "stack-item-selected-background-opacity-emphasized-down": { + "prop": "--spectrum-stack-item-selected-background-opacity-emphasized-down", + "ref": "0.15", + "value": "15%" + }, + "stack-item-selected-background-opacity-emphasized-hover": { + "prop": "--spectrum-stack-item-selected-background-opacity-emphasized-hover", + "ref": "0.15", + "value": "15%" + }, + "stack-item-selected-background-opacity-emphasized-key-focus": { + "prop": "--spectrum-stack-item-selected-background-opacity-emphasized-key-focus", + "ref": "0.15", + "value": "15%" + }, + "stack-item-start-edge-to-content": { + "prop": "--spectrum-stack-item-start-edge-to-content", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "stack-item-text-to-control": { + "prop": "--spectrum-stack-item-text-to-control", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "standard-dialog-body-font-size": { + "prop": "--spectrum-standard-dialog-body-font-size", + "ref": "var(--spectrum-body-size-s)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "17px" + } + }, + "standard-dialog-maximum-width-large": { + "prop": "--spectrum-standard-dialog-maximum-width-large", + "value": "640px" + }, + "standard-dialog-maximum-width-medium": { + "prop": "--spectrum-standard-dialog-maximum-width-medium", + "value": "480px" + }, + "standard-dialog-maximum-width-small": { + "prop": "--spectrum-standard-dialog-maximum-width-small", + "value": "400px" + }, + "standard-dialog-minimum-width": { + "prop": "--spectrum-standard-dialog-minimum-width", + "value": "288px" + }, + "standard-dialog-spacing-edge-to-content": { + "prop": "--spectrum-standard-dialog-spacing-edge-to-content", + "desktop": { + "ref": "var(--spectrum-spacing-500)", + "value": "32px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + } + }, + "standard-dialog-title-font-size": { + "prop": "--spectrum-standard-dialog-title-font-size", + "ref": "var(--spectrum-title-size-xl)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "24px" + } + }, + "standard-panel-edge-to-close-button-compact": { + "prop": "--spectrum-standard-panel-edge-to-close-button-compact", + "value": "3px" + }, + "standard-panel-edge-to-close-button-regular": { + "prop": "--spectrum-standard-panel-edge-to-close-button-regular", + "value": "7px" + }, + "standard-panel-edge-to-close-button-spacious": { + "prop": "--spectrum-standard-panel-edge-to-close-button-spacious", + "value": "15px" + }, + "standard-panel-gripper-color": { + "prop": "--spectrum-standard-panel-gripper-color", + "ref": "var(--spectrum-gray-200)", + "light": { + "value": "rgb(225, 225, 225)" + }, + "dark": { + "value": "rgb(50, 50, 50)" + } + }, + "standard-panel-gripper-color-drag": { + "prop": "--spectrum-standard-panel-gripper-color-drag", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "standard-panel-maximum-width": { + "prop": "--spectrum-standard-panel-maximum-width", + "value": "400px" + }, + "standard-panel-minimum-width": { + "prop": "--spectrum-standard-panel-minimum-width", + "value": "200px" + }, + "standard-panel-title-font-size": { + "prop": "--spectrum-standard-panel-title-font-size", + "ref": "var(--spectrum-title-size-s)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "standard-panel-top-to-close-button-compact": { + "prop": "--spectrum-standard-panel-top-to-close-button-compact", + "value": "5px" + }, + "standard-panel-top-to-close-button-regular": { + "prop": "--spectrum-standard-panel-top-to-close-button-regular", + "value": "9px" + }, + "standard-panel-top-to-close-button-spacious": { + "prop": "--spectrum-standard-panel-top-to-close-button-spacious", + "value": "17px" + }, + "standard-panel-width": { + "prop": "--spectrum-standard-panel-width", + "value": "260px" + }, + "static-black-focus-indicator-color": { + "prop": "--spectrum-static-black-focus-indicator-color", + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "static-black-text-color": { + "prop": "--spectrum-static-black-text-color", + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "static-black-track-color": { + "prop": "--spectrum-static-black-track-color", + "ref": "var(--spectrum-transparent-black-300)", + "value": "rgba(0, 0, 0, 0.15)" + }, + "static-black-track-indicator-color": { + "prop": "--spectrum-static-black-track-indicator-color", + "ref": "var(--spectrum-transparent-black-900)", + "value": "rgba(0, 0, 0, 0.93)" + }, + "static-blue-1000": { + "prop": "--spectrum-static-blue-1000", + "value": "rgb(39, 77, 234)" + }, + "static-blue-900": { + "prop": "--spectrum-static-blue-900", + "value": "rgb(59, 99, 251)" + }, + "static-fuchsia-1000": { + "prop": "--spectrum-static-fuchsia-1000", + "value": "rgb(156, 40, 175)" + }, + "static-fuchsia-900": { + "prop": "--spectrum-static-fuchsia-900", + "value": "rgb(181, 57, 200)" + }, + "static-indigo-1000": { + "prop": "--spectrum-static-indigo-1000", + "value": "rgb(99, 56, 238)" + }, + "static-indigo-900": { + "prop": "--spectrum-static-indigo-900", + "value": "rgb(113, 85, 250)" + }, + "static-magenta-1000": { + "prop": "--spectrum-static-magenta-1000", + "value": "rgb(186, 22, 80)" + }, + "static-magenta-900": { + "prop": "--spectrum-static-magenta-900", + "value": "rgb(217, 35, 97)" + }, + "static-red-1000": { + "prop": "--spectrum-static-red-1000", + "value": "rgb(183, 40, 24)" + }, + "static-red-900": { + "prop": "--spectrum-static-red-900", + "value": "rgb(215, 50, 32)" + }, + "static-white-focus-indicator-color": { + "prop": "--spectrum-static-white-focus-indicator-color", + "ref": "var(--spectrum-white)", + "value": "rgb(255, 255, 255)" + }, + "static-white-text-color": { + "prop": "--spectrum-static-white-text-color", + "ref": "var(--spectrum-white)", + "value": "rgb(255, 255, 255)" + }, + "static-white-track-color": { + "prop": "--spectrum-static-white-track-color", + "ref": "var(--spectrum-transparent-white-300)", + "value": "rgba(255, 255, 255, 0.17)" + }, + "static-white-track-indicator-color": { + "prop": "--spectrum-static-white-track-indicator-color", + "ref": "var(--spectrum-transparent-white-900)", + "value": "rgba(255, 255, 255, 0.94)" + }, + "status-light-dot-size-extra-large": { + "prop": "--spectrum-status-light-dot-size-extra-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "status-light-dot-size-large": { + "prop": "--spectrum-status-light-dot-size-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "status-light-dot-size-medium": { + "prop": "--spectrum-status-light-dot-size-medium", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "status-light-dot-size-small": { + "prop": "--spectrum-status-light-dot-size-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "status-light-text-to-visual-100": { + "prop": "--spectrum-status-light-text-to-visual-100", + "ref": "var(--spectrum-text-to-visual-100)", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "status-light-text-to-visual-200": { + "prop": "--spectrum-status-light-text-to-visual-200", + "ref": "var(--spectrum-text-to-visual-200)", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "status-light-text-to-visual-300": { + "prop": "--spectrum-status-light-text-to-visual-300", + "ref": "var(--spectrum-text-to-visual-300)", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "status-light-text-to-visual-75": { + "prop": "--spectrum-status-light-text-to-visual-75", + "ref": "var(--spectrum-text-to-visual-75)", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "status-light-top-to-dot-extra-large": { + "prop": "--spectrum-status-light-top-to-dot-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "status-light-top-to-dot-large": { + "prop": "--spectrum-status-light-top-to-dot-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "status-light-top-to-dot-medium": { + "prop": "--spectrum-status-light-top-to-dot-medium", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "status-light-top-to-dot-small": { + "prop": "--spectrum-status-light-top-to-dot-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "steplist-bottom-to-text": { + "prop": "--spectrum-steplist-bottom-to-text", + "value": "1px" + }, + "steplist-current-marker-color-key-focus": { + "prop": "--spectrum-steplist-current-marker-color-key-focus", + "ref": "var(--spectrum-blue-800)", + "dark": { + "value": "rgb(52, 91, 248)" + }, + "light": { + "value": "rgb(75, 117, 255)" + } + }, + "steplist-step-default-height-extra-large": { + "prop": "--spectrum-steplist-step-default-height-extra-large", + "value": "78px" + }, + "steplist-step-default-height-large": { + "prop": "--spectrum-steplist-step-default-height-large", + "value": "70px" + }, + "steplist-step-default-height-medium": { + "prop": "--spectrum-steplist-step-default-height-medium", + "value": "54px" + }, + "steplist-step-default-height-small": { + "prop": "--spectrum-steplist-step-default-height-small", + "value": "46px" + }, + "steplist-step-default-width-extra-large": { + "prop": "--spectrum-steplist-step-default-width-extra-large", + "value": "78px" + }, + "steplist-step-default-width-large": { + "prop": "--spectrum-steplist-step-default-width-large", + "value": "70px" + }, + "steplist-step-default-width-medium": { + "prop": "--spectrum-steplist-step-default-width-medium", + "value": "54px" + }, + "steplist-step-default-width-small": { + "prop": "--spectrum-steplist-step-default-width-small", + "value": "46px" + }, + "steplist-step-to-track-size-extra-large": { + "prop": "--spectrum-steplist-step-to-track-size-extra-large", + "value": "9px" + }, + "steplist-step-to-track-size-large": { + "prop": "--spectrum-steplist-step-to-track-size-large", + "value": "8px" + }, + "steplist-step-to-track-size-medium": { + "prop": "--spectrum-steplist-step-to-track-size-medium", + "value": "7px" + }, + "steplist-step-to-track-size-small": { + "prop": "--spectrum-steplist-step-to-track-size-small", + "value": "6px" + }, + "steplist-track-thickness-medium": { + "prop": "--spectrum-steplist-track-thickness-medium", + "value": "2px" + }, + "steplist-visual-size-extra-large": { + "prop": "--spectrum-steplist-visual-size-extra-large", + "value": "32px" + }, + "steplist-visual-size-large": { + "prop": "--spectrum-steplist-visual-size-large", + "value": "24px" + }, + "steplist-visual-size-medium": { + "prop": "--spectrum-steplist-visual-size-medium", + "value": "16px" + }, + "steplist-visual-size-small": { + "prop": "--spectrum-steplist-visual-size-small", + "value": "8px" + }, + "swatch-border-color": { + "prop": "--spectrum-swatch-border-color", + "ref": "var(--spectrum-gray-1000)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 0, 0)" + } + }, + "swatch-border-color-light": { + "prop": "--spectrum-swatch-border-color-light", + "dark": { + "value": "rgba(255 255 255 / 20%)" + }, + "light": { + "value": "rgba(0 0 0 / 20%)" + } + }, + "swatch-border-opacity": { + "prop": "--spectrum-swatch-border-opacity", + "ref": "0.42", + "value": "42%" + }, + "swatch-disabled-icon-border-color": { + "prop": "--spectrum-swatch-disabled-icon-border-color", + "ref": "var(--spectrum-black)", + "value": "rgb(0, 0, 0)" + }, + "swatch-disabled-icon-border-opacity": { + "prop": "--spectrum-swatch-disabled-icon-border-opacity", + "ref": "0.42", + "value": "42%" + }, + "swatch-group-border-color": { + "prop": "--spectrum-swatch-group-border-color", + "ref": "var(--spectrum-gray-1000)", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 0, 0)" + } + }, + "swatch-group-border-opacity": { + "prop": "--spectrum-swatch-group-border-opacity", + "ref": "0.2", + "value": "20%" + }, + "swatch-group-spacing-spacious": { + "prop": "--spectrum-swatch-group-spacing-spacious", + "value": "6px" + }, + "swatch-rectangle-width-multiplier": { + "prop": "--spectrum-swatch-rectangle-width-multiplier", + "value": 2 + }, + "swatch-size-extra-small": { + "prop": "--spectrum-swatch-size-extra-small", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "swatch-size-large": { + "prop": "--spectrum-swatch-size-large", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "swatch-size-medium": { + "prop": "--spectrum-swatch-size-medium", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "swatch-size-small": { + "prop": "--spectrum-swatch-size-small", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "swatch-slash-thickness-extra-small": { + "prop": "--spectrum-swatch-slash-thickness-extra-small", + "value": "2px" + }, + "swatch-slash-thickness-large": { + "prop": "--spectrum-swatch-slash-thickness-large", + "value": "5px" + }, + "swatch-slash-thickness-medium": { + "prop": "--spectrum-swatch-slash-thickness-medium", + "value": "4px" + }, + "swatch-slash-thickness-small": { + "prop": "--spectrum-swatch-slash-thickness-small", + "value": "3px" + }, + "switch-control-height-extra-large": { + "prop": "--spectrum-switch-control-height-extra-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "26px" + } + }, + "switch-control-height-large": { + "prop": "--spectrum-switch-control-height-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "switch-control-height-medium": { + "prop": "--spectrum-switch-control-height-medium", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "switch-control-height-small": { + "prop": "--spectrum-switch-control-height-small", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "switch-control-width-extra-large": { + "prop": "--spectrum-switch-control-width-extra-large", + "desktop": { + "value": "34px" + }, + "mobile": { + "value": "46px" + } + }, + "switch-control-width-large": { + "prop": "--spectrum-switch-control-width-large", + "desktop": { + "value": "30px" + }, + "mobile": { + "value": "38px" + } + }, + "switch-control-width-medium": { + "prop": "--spectrum-switch-control-width-medium", + "desktop": { + "value": "26px" + }, + "mobile": { + "value": "34px" + } + }, + "switch-control-width-small": { + "prop": "--spectrum-switch-control-width-small", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "30px" + } + }, + "switch-handle-selected-size-extra-large": { + "prop": "--spectrum-switch-handle-selected-size-extra-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "20px" + } + }, + "switch-handle-selected-size-large": { + "prop": "--spectrum-switch-handle-selected-size-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "switch-handle-selected-size-medium": { + "prop": "--spectrum-switch-handle-selected-size-medium", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "switch-handle-selected-size-small": { + "prop": "--spectrum-switch-handle-selected-size-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "12px" + } + }, + "switch-handle-size-extra-large": { + "prop": "--spectrum-switch-handle-size-extra-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "18px" + } + }, + "switch-handle-size-large": { + "prop": "--spectrum-switch-handle-size-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "switch-handle-size-medium": { + "prop": "--spectrum-switch-handle-size-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "12px" + } + }, + "switch-handle-size-small": { + "prop": "--spectrum-switch-handle-size-small", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "10px" + } + }, + "switch-top-to-control-extra-large": { + "prop": "--spectrum-switch-top-to-control-extra-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "switch-top-to-control-large": { + "prop": "--spectrum-switch-top-to-control-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "switch-top-to-control-medium": { + "prop": "--spectrum-switch-top-to-control-medium", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "switch-top-to-control-small": { + "prop": "--spectrum-switch-top-to-control-small", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "tab-item-bottom-to-text-compact-extra-large": { + "prop": "--spectrum-tab-item-bottom-to-text-compact-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "17px" + } + }, + "tab-item-bottom-to-text-compact-large": { + "prop": "--spectrum-tab-item-bottom-to-text-compact-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "tab-item-bottom-to-text-compact-medium": { + "prop": "--spectrum-tab-item-bottom-to-text-compact-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tab-item-bottom-to-text-compact-small": { + "prop": "--spectrum-tab-item-bottom-to-text-compact-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "tab-item-bottom-to-text-extra-large": { + "prop": "--spectrum-tab-item-bottom-to-text-extra-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "25px" + } + }, + "tab-item-bottom-to-text-large": { + "prop": "--spectrum-tab-item-bottom-to-text-large", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "tab-item-bottom-to-text-medium": { + "prop": "--spectrum-tab-item-bottom-to-text-medium", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "19px" + } + }, + "tab-item-bottom-to-text-small": { + "prop": "--spectrum-tab-item-bottom-to-text-small", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tab-item-compact-height-extra-large": { + "prop": "--spectrum-tab-item-compact-height-extra-large", + "ref": "var(--spectrum-component-height-300)", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "tab-item-compact-height-large": { + "prop": "--spectrum-tab-item-compact-height-large", + "ref": "var(--spectrum-component-height-200)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "tab-item-compact-height-medium": { + "prop": "--spectrum-tab-item-compact-height-medium", + "ref": "var(--spectrum-component-height-100)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "tab-item-compact-height-small": { + "prop": "--spectrum-tab-item-compact-height-small", + "ref": "var(--spectrum-component-height-75)", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "tab-item-focus-indicator-gap-extra-large": { + "prop": "--spectrum-tab-item-focus-indicator-gap-extra-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "tab-item-focus-indicator-gap-large": { + "prop": "--spectrum-tab-item-focus-indicator-gap-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "tab-item-focus-indicator-gap-medium": { + "prop": "--spectrum-tab-item-focus-indicator-gap-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tab-item-focus-indicator-gap-small": { + "prop": "--spectrum-tab-item-focus-indicator-gap-small", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "tab-item-height-extra-large": { + "prop": "--spectrum-tab-item-height-extra-large", + "ref": "var(--spectrum-component-height-500)", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "80px" + } + }, + "tab-item-height-large": { + "prop": "--spectrum-tab-item-height-large", + "ref": "var(--spectrum-component-height-400)", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "tab-item-height-medium": { + "prop": "--spectrum-tab-item-height-medium", + "ref": "var(--spectrum-component-height-300)", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "tab-item-height-small": { + "prop": "--spectrum-tab-item-height-small", + "ref": "var(--spectrum-component-height-200)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "tab-item-start-to-edge-extra-large": { + "prop": "--spectrum-tab-item-start-to-edge-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "19px" + } + }, + "tab-item-start-to-edge-large": { + "prop": "--spectrum-tab-item-start-to-edge-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "17px" + } + }, + "tab-item-start-to-edge-medium": { + "prop": "--spectrum-tab-item-start-to-edge-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tab-item-start-to-edge-quiet": { + "prop": "--spectrum-tab-item-start-to-edge-quiet", + "value": "0px" + }, + "tab-item-start-to-edge-small": { + "prop": "--spectrum-tab-item-start-to-edge-small", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "13px" + } + }, + "tab-item-to-tab-item-horizontal-extra-large": { + "prop": "--spectrum-tab-item-to-tab-item-horizontal-extra-large", + "desktop": { + "value": "30px" + }, + "mobile": { + "value": "36px" + } + }, + "tab-item-to-tab-item-horizontal-large": { + "prop": "--spectrum-tab-item-to-tab-item-horizontal-large", + "desktop": { + "value": "27px" + }, + "mobile": { + "value": "33px" + } + }, + "tab-item-to-tab-item-horizontal-medium": { + "prop": "--spectrum-tab-item-to-tab-item-horizontal-medium", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "tab-item-to-tab-item-horizontal-small": { + "prop": "--spectrum-tab-item-to-tab-item-horizontal-small", + "desktop": { + "value": "21px" + }, + "mobile": { + "value": "27px" + } + }, + "tab-item-to-tab-item-vertical-extra-large": { + "prop": "--spectrum-tab-item-to-tab-item-vertical-extra-large", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "tab-item-to-tab-item-vertical-large": { + "prop": "--spectrum-tab-item-to-tab-item-vertical-large", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "tab-item-to-tab-item-vertical-medium": { + "prop": "--spectrum-tab-item-to-tab-item-vertical-medium", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tab-item-to-tab-item-vertical-small": { + "prop": "--spectrum-tab-item-to-tab-item-vertical-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tab-item-top-to-text-compact-extra-large": { + "prop": "--spectrum-tab-item-top-to-text-compact-extra-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tab-item-top-to-text-compact-large": { + "prop": "--spectrum-tab-item-top-to-text-compact-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "tab-item-top-to-text-compact-medium": { + "prop": "--spectrum-tab-item-top-to-text-compact-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "9px" + } + }, + "tab-item-top-to-text-compact-small": { + "prop": "--spectrum-tab-item-top-to-text-compact-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tab-item-top-to-text-extra-large": { + "prop": "--spectrum-tab-item-top-to-text-extra-large", + "desktop": { + "value": "19px" + }, + "mobile": { + "value": "25px" + } + }, + "tab-item-top-to-text-large": { + "prop": "--spectrum-tab-item-top-to-text-large", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "22px" + } + }, + "tab-item-top-to-text-medium": { + "prop": "--spectrum-tab-item-top-to-text-medium", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "tab-item-top-to-text-small": { + "prop": "--spectrum-tab-item-top-to-text-small", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "tab-item-top-to-workflow-icon-compact-extra-large": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-extra-large", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "16px" + } + }, + "tab-item-top-to-workflow-icon-compact-large": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "13px" + } + }, + "tab-item-top-to-workflow-icon-compact-medium": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-medium", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "tab-item-top-to-workflow-icon-compact-small": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-compact-small", + "desktop": { + "value": "3px" + }, + "mobile": { + "value": "5px" + } + }, + "tab-item-top-to-workflow-icon-extra-large": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-extra-large", + "desktop": { + "value": "19px" + }, + "mobile": { + "value": "26px" + } + }, + "tab-item-top-to-workflow-icon-large": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "23px" + } + }, + "tab-item-top-to-workflow-icon-medium": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-medium", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "tab-item-top-to-workflow-icon-small": { + "prop": "--spectrum-tab-item-top-to-workflow-icon-small", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "15px" + } + }, + "table-border-divider-width": { + "prop": "--spectrum-table-border-divider-width", + "value": "1px" + }, + "table-checkbox-to-text": { + "prop": "--spectrum-table-checkbox-to-text", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "table-column-header-row-bottom-to-text-extra-large": { + "prop": "--spectrum-table-column-header-row-bottom-to-text-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "17px" + } + }, + "table-column-header-row-bottom-to-text-large": { + "prop": "--spectrum-table-column-header-row-bottom-to-text-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "table-column-header-row-bottom-to-text-medium": { + "prop": "--spectrum-table-column-header-row-bottom-to-text-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-column-header-row-bottom-to-text-small": { + "prop": "--spectrum-table-column-header-row-bottom-to-text-small", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "table-column-header-row-top-to-text-extra-large": { + "prop": "--spectrum-table-column-header-row-top-to-text-extra-large", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "16px" + } + }, + "table-column-header-row-top-to-text-large": { + "prop": "--spectrum-table-column-header-row-top-to-text-large", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "table-column-header-row-top-to-text-medium": { + "prop": "--spectrum-table-column-header-row-top-to-text-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "9px" + } + }, + "table-column-header-row-top-to-text-small": { + "prop": "--spectrum-table-column-header-row-top-to-text-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-edge-to-content": { + "prop": "--spectrum-table-edge-to-content", + "value": "16px" + }, + "table-header-row-checkbox-to-top-extra-large": { + "prop": "--spectrum-table-header-row-checkbox-to-top-extra-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "21px" + } + }, + "table-header-row-checkbox-to-top-large": { + "prop": "--spectrum-table-header-row-checkbox-to-top-large", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "17px" + } + }, + "table-header-row-checkbox-to-top-medium": { + "prop": "--spectrum-table-header-row-checkbox-to-top-medium", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "11px" + } + }, + "table-header-row-checkbox-to-top-small": { + "prop": "--spectrum-table-header-row-checkbox-to-top-small", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "table-row-bottom-to-text-extra-large": { + "prop": "--spectrum-table-row-bottom-to-text-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "table-row-bottom-to-text-extra-large-compact": { + "prop": "--spectrum-table-row-bottom-to-text-extra-large-compact", + "ref": "var(--spectrum-component-bottom-to-text-300)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "table-row-bottom-to-text-extra-large-regular": { + "prop": "--spectrum-table-row-bottom-to-text-extra-large-regular", + "ref": "var(--spectrum-table-row-bottom-to-text-extra-large)", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "22px" + } + }, + "table-row-bottom-to-text-extra-large-spacious": { + "prop": "--spectrum-table-row-bottom-to-text-extra-large-spacious", + "desktop": { + "value": "21px" + }, + "mobile": { + "value": "27px" + } + }, + "table-row-bottom-to-text-large": { + "prop": "--spectrum-table-row-bottom-to-text-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "table-row-bottom-to-text-large-compact": { + "prop": "--spectrum-table-row-bottom-to-text-large-compact", + "ref": "var(--spectrum-component-bottom-to-text-200)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "table-row-bottom-to-text-large-regular": { + "prop": "--spectrum-table-row-bottom-to-text-large-regular", + "ref": "var(--spectrum-table-row-bottom-to-text-large)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "table-row-bottom-to-text-large-spacious": { + "prop": "--spectrum-table-row-bottom-to-text-large-spacious", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "23px" + } + }, + "table-row-bottom-to-text-medium": { + "prop": "--spectrum-table-row-bottom-to-text-medium", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "15px" + } + }, + "table-row-bottom-to-text-medium-compact": { + "prop": "--spectrum-table-row-bottom-to-text-medium-compact", + "ref": "var(--spectrum-component-bottom-to-text-100)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "table-row-bottom-to-text-medium-regular": { + "prop": "--spectrum-table-row-bottom-to-text-medium-regular", + "ref": "var(--spectrum-table-row-bottom-to-text-medium)", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "15px" + } + }, + "table-row-bottom-to-text-medium-spacious": { + "prop": "--spectrum-table-row-bottom-to-text-medium-spacious", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "table-row-bottom-to-text-small": { + "prop": "--spectrum-table-row-bottom-to-text-small", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "table-row-bottom-to-text-small-compact": { + "prop": "--spectrum-table-row-bottom-to-text-small-compact", + "ref": "var(--spectrum-component-bottom-to-text-75)", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "table-row-bottom-to-text-small-regular": { + "prop": "--spectrum-table-row-bottom-to-text-small-regular", + "ref": "var(--spectrum-table-row-bottom-to-text-small)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "table-row-bottom-to-text-small-spacious": { + "prop": "--spectrum-table-row-bottom-to-text-small-spacious", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "16px" + } + }, + "table-row-checkbox-to-top-extra-large": { + "prop": "--spectrum-table-row-checkbox-to-top-extra-large", + "desktop": { + "value": "19px" + }, + "mobile": { + "value": "26px" + } + }, + "table-row-checkbox-to-top-extra-large-compact": { + "prop": "--spectrum-table-row-checkbox-to-top-extra-large-compact", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "21px" + } + }, + "table-row-checkbox-to-top-extra-large-regular": { + "prop": "--spectrum-table-row-checkbox-to-top-extra-large-regular", + "ref": "var(--spectrum-table-row-checkbox-to-top-extra-large)", + "desktop": { + "value": "19px" + }, + "mobile": { + "value": "26px" + } + }, + "table-row-checkbox-to-top-extra-large-spacious": { + "prop": "--spectrum-table-row-checkbox-to-top-extra-large-spacious", + "desktop": { + "value": "23px" + }, + "mobile": { + "value": "31px" + } + }, + "table-row-checkbox-to-top-large": { + "prop": "--spectrum-table-row-checkbox-to-top-large", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "22px" + } + }, + "table-row-checkbox-to-top-large-compact": { + "prop": "--spectrum-table-row-checkbox-to-top-large-compact", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "17px" + } + }, + "table-row-checkbox-to-top-large-regular": { + "prop": "--spectrum-table-row-checkbox-to-top-large-regular", + "ref": "var(--spectrum-table-row-checkbox-to-top-large)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "22px" + } + }, + "table-row-checkbox-to-top-large-spacious": { + "prop": "--spectrum-table-row-checkbox-to-top-large-spacious", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "27px" + } + }, + "table-row-checkbox-to-top-medium": { + "prop": "--spectrum-table-row-checkbox-to-top-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "table-row-checkbox-to-top-medium-compact": { + "prop": "--spectrum-table-row-checkbox-to-top-medium-compact", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "11px" + } + }, + "table-row-checkbox-to-top-medium-regular": { + "prop": "--spectrum-table-row-checkbox-to-top-medium-regular", + "ref": "var(--spectrum-table-row-checkbox-to-top-medium)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "table-row-checkbox-to-top-medium-spacious": { + "prop": "--spectrum-table-row-checkbox-to-top-medium-spacious", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "21px" + } + }, + "table-row-checkbox-to-top-small": { + "prop": "--spectrum-table-row-checkbox-to-top-small", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "table-row-checkbox-to-top-small-compact": { + "prop": "--spectrum-table-row-checkbox-to-top-small-compact", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "9px" + } + }, + "table-row-checkbox-to-top-small-regular": { + "prop": "--spectrum-table-row-checkbox-to-top-small-regular", + "ref": "var(--spectrum-table-row-checkbox-to-top-small)", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "table-row-checkbox-to-top-small-spacious": { + "prop": "--spectrum-table-row-checkbox-to-top-small-spacious", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "19px" + } + }, + "table-row-down-opacity": { + "prop": "--spectrum-table-row-down-opacity", + "ref": "0.1", + "value": "10%" + }, + "table-row-height-extra-large": { + "prop": "--spectrum-table-row-height-extra-large", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "table-row-height-extra-large-compact": { + "prop": "--spectrum-table-row-height-extra-large-compact", + "ref": "var(--spectrum-component-height-300)", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "table-row-height-extra-large-regular": { + "prop": "--spectrum-table-row-height-extra-large-regular", + "ref": "var(--spectrum-table-row-height-extra-large)", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "table-row-height-extra-large-spacious": { + "prop": "--spectrum-table-row-height-extra-large-spacious", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "80px" + } + }, + "table-row-height-large": { + "prop": "--spectrum-table-row-height-large", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "table-row-height-large-compact": { + "prop": "--spectrum-table-row-height-large-compact", + "ref": "var(--spectrum-component-height-200)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "table-row-height-large-regular": { + "prop": "--spectrum-table-row-height-large-regular", + "ref": "var(--spectrum-table-row-height-large)", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "table-row-height-large-spacious": { + "prop": "--spectrum-table-row-height-large-spacious", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "table-row-height-medium": { + "prop": "--spectrum-table-row-height-medium", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "table-row-height-medium-compact": { + "prop": "--spectrum-table-row-height-medium-compact", + "ref": "var(--spectrum-component-height-100)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "table-row-height-medium-regular": { + "prop": "--spectrum-table-row-height-medium-regular", + "ref": "var(--spectrum-table-row-height-medium)", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "table-row-height-medium-spacious": { + "prop": "--spectrum-table-row-height-medium-spacious", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "table-row-height-small": { + "prop": "--spectrum-table-row-height-small", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "table-row-height-small-compact": { + "prop": "--spectrum-table-row-height-small-compact", + "ref": "var(--spectrum-component-height-75)", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "table-row-height-small-regular": { + "prop": "--spectrum-table-row-height-small-regular", + "ref": "var(--spectrum-table-row-height-small)", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "table-row-height-small-spacious": { + "prop": "--spectrum-table-row-height-small-spacious", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "table-row-hover-color": { + "prop": "--spectrum-table-row-hover-color", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "table-row-hover-opacity": { + "prop": "--spectrum-table-row-hover-opacity", + "ref": "0.07", + "value": "7.000000000000001%" + }, + "table-row-top-to-text-extra-large": { + "prop": "--spectrum-table-row-top-to-text-extra-large", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "21px" + } + }, + "table-row-top-to-text-extra-large-compact": { + "prop": "--spectrum-table-row-top-to-text-extra-large-compact", + "ref": "var(--spectrum-component-top-to-text-300)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "table-row-top-to-text-extra-large-regular": { + "prop": "--spectrum-table-row-top-to-text-extra-large-regular", + "ref": "var(--spectrum-table-row-top-to-text-extra-large)", + "desktop": { + "value": "17px" + }, + "mobile": { + "value": "21px" + } + }, + "table-row-top-to-text-extra-large-spacious": { + "prop": "--spectrum-table-row-top-to-text-extra-large-spacious", + "desktop": { + "value": "21px" + }, + "mobile": { + "value": "26px" + } + }, + "table-row-top-to-text-large": { + "prop": "--spectrum-table-row-top-to-text-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "table-row-top-to-text-large-compact": { + "prop": "--spectrum-table-row-top-to-text-large-compact", + "ref": "var(--spectrum-component-top-to-text-200)", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "12px" + } + }, + "table-row-top-to-text-large-regular": { + "prop": "--spectrum-table-row-top-to-text-large-regular", + "ref": "var(--spectrum-table-row-top-to-text-large)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "18px" + } + }, + "table-row-top-to-text-large-spacious": { + "prop": "--spectrum-table-row-top-to-text-large-spacious", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "23px" + } + }, + "table-row-top-to-text-medium": { + "prop": "--spectrum-table-row-top-to-text-medium", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "table-row-top-to-text-medium-compact": { + "prop": "--spectrum-table-row-top-to-text-medium-compact", + "ref": "var(--spectrum-component-top-to-text-100)", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "table-row-top-to-text-medium-regular": { + "prop": "--spectrum-table-row-top-to-text-medium-regular", + "ref": "var(--spectrum-table-row-top-to-text-medium)", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "14px" + } + }, + "table-row-top-to-text-medium-spacious": { + "prop": "--spectrum-table-row-top-to-text-medium-spacious", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "16px" + } + }, + "table-row-top-to-text-small": { + "prop": "--spectrum-table-row-top-to-text-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-row-top-to-text-small-compact": { + "prop": "--spectrum-table-row-top-to-text-small-compact", + "ref": "var(--spectrum-component-top-to-text-75)", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "table-row-top-to-text-small-regular": { + "prop": "--spectrum-table-row-top-to-text-small-regular", + "ref": "var(--spectrum-table-row-top-to-text-small)", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-row-top-to-text-small-spacious": { + "prop": "--spectrum-table-row-top-to-text-small-spacious", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "table-section-header-row-height-extra-large": { + "prop": "--spectrum-table-section-header-row-height-extra-large", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "60px" + } + }, + "table-section-header-row-height-large": { + "prop": "--spectrum-table-section-header-row-height-large", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "table-section-header-row-height-medium": { + "prop": "--spectrum-table-section-header-row-height-medium", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "table-section-header-row-height-small": { + "prop": "--spectrum-table-section-header-row-height-small", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "table-selected-row-background-color": { + "prop": "--spectrum-table-selected-row-background-color", + "ref": "var(--spectrum-informative-color-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "table-selected-row-background-color-non-emphasized": { + "prop": "--spectrum-table-selected-row-background-color-non-emphasized", + "ref": "var(--spectrum-neutral-background-color-selected-default)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "table-selected-row-background-opacity": { + "prop": "--spectrum-table-selected-row-background-opacity", + "ref": "0.1", + "value": "10%" + }, + "table-selected-row-background-opacity-hover": { + "prop": "--spectrum-table-selected-row-background-opacity-hover", + "ref": "0.15", + "value": "15%" + }, + "table-selected-row-background-opacity-non-emphasized": { + "prop": "--spectrum-table-selected-row-background-opacity-non-emphasized", + "ref": "0.1", + "value": "10%" + }, + "table-selected-row-background-opacity-non-emphasized-hover": { + "prop": "--spectrum-table-selected-row-background-opacity-non-emphasized-hover", + "ref": "0.15", + "value": "15%" + }, + "table-thumbnail-to-top-minimum-extra-large": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-extra-large-compact": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large-compact", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-extra-large-regular": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large-regular", + "ref": "var(--spectrum-table-thumbnail-to-top-minimum-extra-large)", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-extra-large-spacious": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-extra-large-spacious", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "table-thumbnail-to-top-minimum-large": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-large", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-large-compact": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-large-compact", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "table-thumbnail-to-top-minimum-large-regular": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-large-regular", + "ref": "var(--spectrum-table-thumbnail-to-top-minimum-large)", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-large-spacious": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-large-spacious", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-medium": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-medium", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "table-thumbnail-to-top-minimum-medium-compact": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-medium-compact", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "table-thumbnail-to-top-minimum-medium-regular": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-medium-regular", + "ref": "var(--spectrum-table-thumbnail-to-top-minimum-medium)", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "table-thumbnail-to-top-minimum-medium-spacious": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-medium-spacious", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "table-thumbnail-to-top-minimum-small": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-small", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "table-thumbnail-to-top-minimum-small-compact": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-small-compact", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "table-thumbnail-to-top-minimum-small-regular": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-small-regular", + "ref": "var(--spectrum-table-thumbnail-to-top-minimum-small)", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "table-thumbnail-to-top-minimum-small-spacious": { + "prop": "--spectrum-table-thumbnail-to-top-minimum-small-spacious", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "tag-edge-to-clear-icon-large": { + "prop": "--spectrum-tag-edge-to-clear-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "tag-edge-to-clear-icon-medium": { + "prop": "--spectrum-tag-edge-to-clear-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tag-edge-to-clear-icon-small": { + "prop": "--spectrum-tag-edge-to-clear-icon-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tag-field-default-width-large": { + "prop": "--spectrum-tag-field-default-width-large", + "desktop": { + "value": "288px" + }, + "mobile": { + "value": "312px" + } + }, + "tag-field-default-width-medium": { + "prop": "--spectrum-tag-field-default-width-medium", + "desktop": { + "value": "264px" + }, + "mobile": { + "value": "288px" + } + }, + "tag-field-default-width-small": { + "prop": "--spectrum-tag-field-default-width-small", + "desktop": { + "value": "240px" + }, + "mobile": { + "value": "264px" + } + }, + "tag-field-edge-to-content-large": { + "prop": "--spectrum-tag-field-edge-to-content-large", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "tag-field-edge-to-content-medium": { + "prop": "--spectrum-tag-field-edge-to-content-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "14px" + } + }, + "tag-field-edge-to-content-small": { + "prop": "--spectrum-tag-field-edge-to-content-small", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "tag-field-minimum-height-large": { + "prop": "--spectrum-tag-field-minimum-height-large", + "desktop": { + "value": "68px" + }, + "mobile": { + "value": "82px" + } + }, + "tag-field-minimum-height-medium": { + "prop": "--spectrum-tag-field-minimum-height-medium", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "68px" + } + }, + "tag-field-minimum-height-small": { + "prop": "--spectrum-tag-field-minimum-height-small", + "desktop": { + "value": "44px" + }, + "mobile": { + "value": "54px" + } + }, + "tag-field-minimum-width": { + "prop": "--spectrum-tag-field-minimum-width", + "desktop": { + "value": "180px" + }, + "mobile": { + "value": "200px" + } + }, + "tag-label-to-clear-icon-large": { + "prop": "--spectrum-tag-label-to-clear-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "tag-label-to-clear-icon-medium": { + "prop": "--spectrum-tag-label-to-clear-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tag-label-to-clear-icon-small": { + "prop": "--spectrum-tag-label-to-clear-icon-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tag-maximum-width-multiplier": { + "prop": "--spectrum-tag-maximum-width-multiplier", + "value": 7 + }, + "tag-minimum-width-large": { + "prop": "--spectrum-tag-minimum-width-large", + "desktop": { + "value": "33px" + }, + "mobile": { + "value": "42px" + } + }, + "tag-minimum-width-medium": { + "prop": "--spectrum-tag-minimum-width-medium", + "desktop": { + "value": "27px" + }, + "mobile": { + "value": "34px" + } + }, + "tag-minimum-width-multiplier": { + "prop": "--spectrum-tag-minimum-width-multiplier", + "value": 1 + }, + "tag-minimum-width-small": { + "prop": "--spectrum-tag-minimum-width-small", + "desktop": { + "value": "21px" + }, + "mobile": { + "value": "25px" + } + }, + "tag-top-to-avatar-large": { + "prop": "--spectrum-tag-top-to-avatar-large", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "tag-top-to-avatar-medium": { + "prop": "--spectrum-tag-top-to-avatar-medium", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "tag-top-to-avatar-small": { + "prop": "--spectrum-tag-top-to-avatar-small", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tag-top-to-cross-icon-large": { + "prop": "--spectrum-tag-top-to-cross-icon-large", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "tag-top-to-cross-icon-medium": { + "prop": "--spectrum-tag-top-to-cross-icon-medium", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tag-top-to-cross-icon-small": { + "prop": "--spectrum-tag-top-to-cross-icon-small", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "takeover-dialog-height": { + "prop": "--spectrum-takeover-dialog-height", + "value": "100%" + }, + "takeover-dialog-spacing-grid-padding": { + "prop": "--spectrum-takeover-dialog-spacing-grid-padding", + "desktop": { + "ref": "var(--spectrum-spacing-500)", + "value": "32px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + } + }, + "takeover-dialog-spacing-header-gap": { + "prop": "--spectrum-takeover-dialog-spacing-header-gap", + "desktop": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + } + }, + "takeover-dialog-spacing-title-to-body": { + "prop": "--spectrum-takeover-dialog-spacing-title-to-body", + "desktop": { + "ref": "var(--spectrum-spacing-500)", + "value": "32px" + }, + "mobile": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + } + }, + "takeover-dialog-width": { + "prop": "--spectrum-takeover-dialog-width", + "value": "100%" + }, + "text-align-center": { + "prop": "--spectrum-text-align-center", + "value": "center" + }, + "text-align-end": { + "prop": "--spectrum-text-align-end", + "value": "end" + }, + "text-align-start": { + "prop": "--spectrum-text-align-start", + "value": "start" + }, + "text-area-minimum-height": { + "prop": "--spectrum-text-area-minimum-height", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "70px" + } + }, + "text-area-minimum-width": { + "prop": "--spectrum-text-area-minimum-width", + "desktop": { + "value": "112px" + }, + "mobile": { + "value": "140px" + } + }, + "text-field-minimum-width-multiplier": { + "prop": "--spectrum-text-field-minimum-width-multiplier", + "value": 1.5 + }, + "text-to-control-100": { + "prop": "--spectrum-text-to-control-100", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "text-to-control-200": { + "prop": "--spectrum-text-to-control-200", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "14px" + } + }, + "text-to-control-300": { + "prop": "--spectrum-text-to-control-300", + "desktop": { + "value": "13px" + }, + "mobile": { + "value": "16px" + } + }, + "text-to-control-50": { + "prop": "--spectrum-text-to-control-50", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "text-to-control-75": { + "prop": "--spectrum-text-to-control-75", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "text-to-visual-100": { + "prop": "--spectrum-text-to-visual-100", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "text-to-visual-200": { + "prop": "--spectrum-text-to-visual-200", + "desktop": { + "value": "7px" + }, + "mobile": { + "value": "9px" + } + }, + "text-to-visual-300": { + "prop": "--spectrum-text-to-visual-300", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "text-to-visual-400": { + "prop": "--spectrum-text-to-visual-400", + "desktop": { + "value": "9px" + }, + "mobile": { + "value": "11px" + } + }, + "text-to-visual-50": { + "prop": "--spectrum-text-to-visual-50", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "text-to-visual-75": { + "prop": "--spectrum-text-to-visual-75", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "7px" + } + }, + "text-underline-gap": { + "prop": "--spectrum-text-underline-gap", + "value": "1px" + }, + "text-underline-thickness": { + "prop": "--spectrum-text-underline-thickness", + "value": "1px" + }, + "thumbnail-border-color": { + "prop": "--spectrum-thumbnail-border-color", + "ref": "var(--spectrum-gray-800)", + "light": { + "value": "rgb(41, 41, 41)" + }, + "dark": { + "value": "rgb(219, 219, 219)" + } + }, + "thumbnail-border-opacity": { + "prop": "--spectrum-thumbnail-border-opacity", + "ref": "0.1", + "value": "10%" + }, + "thumbnail-corner-radius": { + "prop": "--spectrum-thumbnail-corner-radius", + "ref": "var(--spectrum-corner-radius-75)", + "value": "3px" + }, + "thumbnail-opacity-checkerboard-square-size": { + "prop": "--spectrum-thumbnail-opacity-checkerboard-square-size", + "ref": "4px", + "value": "NaN%" + }, + "thumbnail-opacity-disabled": { + "prop": "--spectrum-thumbnail-opacity-disabled", + "ref": "var(--spectrum-opacity-disabled)", + "value": "30%" + }, + "thumbnail-size-100": { + "prop": "--spectrum-thumbnail-size-100", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "28px" + } + }, + "thumbnail-size-1000": { + "prop": "--spectrum-thumbnail-size-1000", + "desktop": { + "value": "64px" + }, + "mobile": { + "value": "72px" + } + }, + "thumbnail-size-200": { + "prop": "--spectrum-thumbnail-size-200", + "desktop": { + "value": "28px" + }, + "mobile": { + "value": "32px" + } + }, + "thumbnail-size-300": { + "prop": "--spectrum-thumbnail-size-300", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "36px" + } + }, + "thumbnail-size-400": { + "prop": "--spectrum-thumbnail-size-400", + "desktop": { + "value": "36px" + }, + "mobile": { + "value": "40px" + } + }, + "thumbnail-size-50": { + "prop": "--spectrum-thumbnail-size-50", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "thumbnail-size-500": { + "prop": "--spectrum-thumbnail-size-500", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "44px" + } + }, + "thumbnail-size-600": { + "prop": "--spectrum-thumbnail-size-600", + "desktop": { + "value": "44px" + }, + "mobile": { + "value": "48px" + } + }, + "thumbnail-size-700": { + "prop": "--spectrum-thumbnail-size-700", + "desktop": { + "value": "48px" + }, + "mobile": { + "value": "52px" + } + }, + "thumbnail-size-75": { + "prop": "--spectrum-thumbnail-size-75", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "thumbnail-size-800": { + "prop": "--spectrum-thumbnail-size-800", + "desktop": { + "value": "52px" + }, + "mobile": { + "value": "56px" + } + }, + "thumbnail-size-900": { + "prop": "--spectrum-thumbnail-size-900", + "desktop": { + "value": "56px" + }, + "mobile": { + "value": "64px" + } + }, + "time-field-minimum-width": { + "prop": "--spectrum-time-field-minimum-width", + "value": 2.5 + }, + "time-field-text-to-visual": { + "prop": "--spectrum-time-field-text-to-visual", + "value": "20px" + }, + "title-cjk-emphasized-font-style": { + "prop": "--spectrum-title-cjk-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-cjk-emphasized-font-weight": { + "prop": "--spectrum-title-cjk-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "title-cjk-font-family": { + "prop": "--spectrum-title-cjk-font-family", + "ref": "var(--spectrum-cjk-font-family)", + "value": "Adobe Clean Han" + }, + "title-cjk-font-style": { + "prop": "--spectrum-title-cjk-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-cjk-font-weight": { + "prop": "--spectrum-title-cjk-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "title-cjk-line-height": { + "prop": "--spectrum-title-cjk-line-height", + "ref": "var(--spectrum-cjk-line-height-100)", + "value": 1.5 + }, + "title-cjk-size-l": { + "prop": "--spectrum-title-cjk-size-l", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "title-cjk-size-m": { + "prop": "--spectrum-title-cjk-size-m", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "title-cjk-size-s": { + "prop": "--spectrum-title-cjk-size-s", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "title-cjk-size-xl": { + "prop": "--spectrum-title-cjk-size-xl", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "title-cjk-size-xs": { + "prop": "--spectrum-title-cjk-size-xs", + "ref": "var(--spectrum-font-size-50)", + "desktop": { + "value": "11px" + }, + "mobile": { + "value": "13px" + } + }, + "title-cjk-size-xxl": { + "prop": "--spectrum-title-cjk-size-xxl", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "title-cjk-size-xxxl": { + "prop": "--spectrum-title-cjk-size-xxxl", + "ref": "var(--spectrum-font-size-500)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "27px" + } + }, + "title-cjk-strong-emphasized-font-style": { + "prop": "--spectrum-title-cjk-strong-emphasized-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-cjk-strong-emphasized-font-weight": { + "prop": "--spectrum-title-cjk-strong-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "title-cjk-strong-font-style": { + "prop": "--spectrum-title-cjk-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-cjk-strong-font-weight": { + "prop": "--spectrum-title-cjk-strong-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "title-color": { + "prop": "--spectrum-title-color", + "ref": "var(--spectrum-gray-900)", + "light": { + "value": "rgb(19, 19, 19)" + }, + "dark": { + "value": "rgb(242, 242, 242)" + } + }, + "title-line-height": { + "prop": "--spectrum-title-line-height", + "ref": "var(--spectrum-line-height-100)", + "value": 1.3 + }, + "title-margin-bottom-multiplier": { + "prop": "--spectrum-title-margin-bottom-multiplier", + "value": 0.25 + }, + "title-margin-top-multiplier": { + "prop": "--spectrum-title-margin-top-multiplier", + "value": 0.88888889 + }, + "title-sans-serif-emphasized-font-style": { + "prop": "--spectrum-title-sans-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "title-sans-serif-emphasized-font-weight": { + "prop": "--spectrum-title-sans-serif-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "title-sans-serif-font-family": { + "prop": "--spectrum-title-sans-serif-font-family", + "ref": "var(--spectrum-sans-serif-font-family)", + "value": "Adobe Clean" + }, + "title-sans-serif-font-style": { + "prop": "--spectrum-title-sans-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-sans-serif-font-weight": { + "prop": "--spectrum-title-sans-serif-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "title-sans-serif-strong-emphasized-font-style": { + "prop": "--spectrum-title-sans-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "title-sans-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-title-sans-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "title-sans-serif-strong-font-style": { + "prop": "--spectrum-title-sans-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-sans-serif-strong-font-weight": { + "prop": "--spectrum-title-sans-serif-strong-font-weight", + "ref": "var(--spectrum-extra-bold-font-weight)", + "value": "800" + }, + "title-serif-emphasized-font-style": { + "prop": "--spectrum-title-serif-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "title-serif-emphasized-font-weight": { + "prop": "--spectrum-title-serif-emphasized-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "title-serif-font-family": { + "prop": "--spectrum-title-serif-font-family", + "ref": "var(--spectrum-serif-font-family)", + "value": "Adobe Clean Serif" + }, + "title-serif-font-style": { + "prop": "--spectrum-title-serif-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-serif-font-weight": { + "prop": "--spectrum-title-serif-font-weight", + "ref": "var(--spectrum-bold-font-weight)", + "value": "700" + }, + "title-serif-strong-emphasized-font-style": { + "prop": "--spectrum-title-serif-strong-emphasized-font-style", + "ref": "var(--spectrum-italic-font-style)", + "value": "italic" + }, + "title-serif-strong-emphasized-font-weight": { + "prop": "--spectrum-title-serif-strong-emphasized-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "title-serif-strong-font-style": { + "prop": "--spectrum-title-serif-strong-font-style", + "ref": "var(--spectrum-default-font-style)", + "value": "normal" + }, + "title-serif-strong-font-weight": { + "prop": "--spectrum-title-serif-strong-font-weight", + "ref": "var(--spectrum-black-font-weight)", + "value": "900" + }, + "title-size-l": { + "prop": "--spectrum-title-size-l", + "ref": "var(--spectrum-font-size-300)", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "22px" + } + }, + "title-size-m": { + "prop": "--spectrum-title-size-m", + "ref": "var(--spectrum-font-size-200)", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "19px" + } + }, + "title-size-s": { + "prop": "--spectrum-title-size-s", + "ref": "var(--spectrum-font-size-100)", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "17px" + } + }, + "title-size-xl": { + "prop": "--spectrum-title-size-xl", + "ref": "var(--spectrum-font-size-400)", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "title-size-xs": { + "prop": "--spectrum-title-size-xs", + "ref": "var(--spectrum-font-size-75)", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "title-size-xxl": { + "prop": "--spectrum-title-size-xxl", + "ref": "var(--spectrum-font-size-500)", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "27px" + } + }, + "title-size-xxxl": { + "prop": "--spectrum-title-size-xxxl", + "ref": "var(--spectrum-font-size-600)", + "desktop": { + "value": "25px" + }, + "mobile": { + "value": "31px" + } + }, + "toast-bottom-to-text": { + "prop": "--spectrum-toast-bottom-to-text", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "22px" + } + }, + "toast-height": { + "prop": "--spectrum-toast-height", + "desktop": { + "value": "52px" + }, + "mobile": { + "value": "60px" + } + }, + "toast-maximum-width": { + "prop": "--spectrum-toast-maximum-width", + "desktop": { + "value": "336px" + }, + "mobile": { + "value": "420px" + } + }, + "toast-top-to-text": { + "prop": "--spectrum-toast-top-to-text", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "20px" + } + }, + "toast-top-to-workflow-icon": { + "prop": "--spectrum-toast-top-to-workflow-icon", + "desktop": { + "value": "18px" + }, + "mobile": { + "value": "20px" + } + }, + "tooltip-maximum-width": { + "prop": "--spectrum-tooltip-maximum-width", + "desktop": { + "value": "160px" + }, + "mobile": { + "value": "200px" + } + }, + "tooltip-tip-corner-radius": { + "prop": "--spectrum-tooltip-tip-corner-radius", + "value": "1px" + }, + "tooltip-tip-height": { + "prop": "--spectrum-tooltip-tip-height", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "tooltip-tip-square-size": { + "prop": "--spectrum-tooltip-tip-square-size", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tooltip-tip-width": { + "prop": "--spectrum-tooltip-tip-width", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "12px" + } + }, + "track-color": { + "prop": "--spectrum-track-color", + "ref": "var(--spectrum-gray-300)", + "light": { + "value": "rgb(218, 218, 218)" + }, + "dark": { + "value": "rgb(57, 57, 57)" + } + }, + "transparent-black-100": { + "prop": "--spectrum-transparent-black-100", + "value": "rgba(0, 0, 0, 0.09)" + }, + "transparent-black-1000": { + "prop": "--spectrum-transparent-black-1000", + "value": "rgb(0, 0, 0)" + }, + "transparent-black-200": { + "prop": "--spectrum-transparent-black-200", + "value": "rgba(0, 0, 0, 0.12)" + }, + "transparent-black-25": { + "prop": "--spectrum-transparent-black-25", + "value": "rgba(0, 0, 0, 0)" + }, + "transparent-black-300": { + "prop": "--spectrum-transparent-black-300", + "value": "rgba(0, 0, 0, 0.15)" + }, + "transparent-black-400": { + "prop": "--spectrum-transparent-black-400", + "value": "rgba(0, 0, 0, 0.22)" + }, + "transparent-black-50": { + "prop": "--spectrum-transparent-black-50", + "value": "rgba(0, 0, 0, 0.03)" + }, + "transparent-black-500": { + "prop": "--spectrum-transparent-black-500", + "value": "rgba(0, 0, 0, 0.44)" + }, + "transparent-black-600": { + "prop": "--spectrum-transparent-black-600", + "value": "rgba(0, 0, 0, 0.56)" + }, + "transparent-black-700": { + "prop": "--spectrum-transparent-black-700", + "value": "rgba(0, 0, 0, 0.69)" + }, + "transparent-black-75": { + "prop": "--spectrum-transparent-black-75", + "value": "rgba(0, 0, 0, 0.05)" + }, + "transparent-black-800": { + "prop": "--spectrum-transparent-black-800", + "value": "rgba(0, 0, 0, 0.84)" + }, + "transparent-black-900": { + "prop": "--spectrum-transparent-black-900", + "value": "rgba(0, 0, 0, 0.93)" + }, + "transparent-white-100": { + "prop": "--spectrum-transparent-white-100", + "value": "rgba(255, 255, 255, 0.11)" + }, + "transparent-white-1000": { + "prop": "--spectrum-transparent-white-1000", + "value": "rgb(255, 255, 255)" + }, + "transparent-white-200": { + "prop": "--spectrum-transparent-white-200", + "value": "rgba(255, 255, 255, 0.14)" + }, + "transparent-white-25": { + "prop": "--spectrum-transparent-white-25", + "value": "rgba(255, 255, 255, 0)" + }, + "transparent-white-300": { + "prop": "--spectrum-transparent-white-300", + "value": "rgba(255, 255, 255, 0.17)" + }, + "transparent-white-400": { + "prop": "--spectrum-transparent-white-400", + "value": "rgba(255, 255, 255, 0.21)" + }, + "transparent-white-50": { + "prop": "--spectrum-transparent-white-50", + "value": "rgba(255, 255, 255, 0.04)" + }, + "transparent-white-500": { + "prop": "--spectrum-transparent-white-500", + "value": "rgba(255, 255, 255, 0.39)" + }, + "transparent-white-600": { + "prop": "--spectrum-transparent-white-600", + "value": "rgba(255, 255, 255, 0.51)" + }, + "transparent-white-700": { + "prop": "--spectrum-transparent-white-700", + "value": "rgba(255, 255, 255, 0.66)" + }, + "transparent-white-75": { + "prop": "--spectrum-transparent-white-75", + "value": "rgba(255, 255, 255, 0.07)" + }, + "transparent-white-800": { + "prop": "--spectrum-transparent-white-800", + "value": "rgba(255, 255, 255, 0.85)" + }, + "transparent-white-900": { + "prop": "--spectrum-transparent-white-900", + "value": "rgba(255, 255, 255, 0.94)" + }, + "tray-top-to-content-area": { + "prop": "--spectrum-tray-top-to-content-area", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tree-view-bottom-to-label": { + "prop": "--spectrum-tree-view-bottom-to-label", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "16px" + } + }, + "tree-view-disclosure-indicator-height": { + "prop": "--spectrum-tree-view-disclosure-indicator-height", + "desktop": { + "value": "32px" + }, + "mobile": { + "value": "40px" + } + }, + "tree-view-disclosure-indicator-width": { + "prop": "--spectrum-tree-view-disclosure-indicator-width", + "desktop": { + "value": "34px" + }, + "mobile": { + "value": "42px" + } + }, + "tree-view-drag-handle-to-checkbox": { + "prop": "--spectrum-tree-view-drag-handle-to-checkbox", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tree-view-edge-to-checkbox": { + "prop": "--spectrum-tree-view-edge-to-checkbox", + "desktop": { + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "tree-view-edge-to-drag-handle": { + "prop": "--spectrum-tree-view-edge-to-drag-handle", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tree-view-end-edge-to-action-area": { + "prop": "--spectrum-tree-view-end-edge-to-action-area", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "7px" + } + }, + "tree-view-header-to-item": { + "prop": "--spectrum-tree-view-header-to-item", + "value": "-1px" + }, + "tree-view-item-to-header": { + "prop": "--spectrum-tree-view-item-to-header", + "desktop": { + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "tree-view-item-to-item": { + "prop": "--spectrum-tree-view-item-to-item", + "value": "-1px" + }, + "tree-view-item-to-item-detached": { + "prop": "--spectrum-tree-view-item-to-item-detached", + "value": "2px" + }, + "tree-view-label-to-action-area": { + "prop": "--spectrum-tree-view-label-to-action-area", + "desktop": { + "value": "6px" + }, + "mobile": { + "value": "8px" + } + }, + "tree-view-level-increment": { + "prop": "--spectrum-tree-view-level-increment", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "tree-view-minimum-height": { + "prop": "--spectrum-tree-view-minimum-height", + "desktop": { + "value": "40px" + }, + "mobile": { + "value": "50px" + } + }, + "tree-view-minimum-top-to-context-area": { + "prop": "--spectrum-tree-view-minimum-top-to-context-area", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "tree-view-minimum-width": { + "prop": "--spectrum-tree-view-minimum-width", + "desktop": { + "value": "160px" + }, + "mobile": { + "value": "200px" + } + }, + "tree-view-row-background-hover": { + "prop": "--spectrum-tree-view-row-background-hover", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "tree-view-selected-row-background-color-emphasized": { + "prop": "--spectrum-tree-view-selected-row-background-color-emphasized", + "ref": "var(--spectrum-informative-color-800)", + "light": { + "value": "rgb(59, 99, 251)" + }, + "dark": { + "value": "rgb(64, 105, 253)" + } + }, + "tree-view-selected-row-background-default": { + "prop": "--spectrum-tree-view-selected-row-background-default", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "tree-view-selected-row-background-hover": { + "prop": "--spectrum-tree-view-selected-row-background-hover", + "ref": "var(--spectrum-gray-100)", + "light": { + "value": "rgb(233, 233, 233)" + }, + "dark": { + "value": "rgb(44, 44, 44)" + } + }, + "tree-view-selected-row-background-opacity-emphasized": { + "prop": "--spectrum-tree-view-selected-row-background-opacity-emphasized", + "ref": "0.1", + "value": "10%" + }, + "tree-view-selected-row-background-opacity-emphasized-hover": { + "prop": "--spectrum-tree-view-selected-row-background-opacity-emphasized-hover", + "ref": "0.15", + "value": "15%" + }, + "tree-view-top-to-action-button": { + "prop": "--spectrum-tree-view-top-to-action-button", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tree-view-top-to-checkbox": { + "prop": "--spectrum-tree-view-top-to-checkbox", + "desktop": { + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "tree-view-top-to-disclosure-indicator": { + "prop": "--spectrum-tree-view-top-to-disclosure-indicator", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "tree-view-top-to-drag-handle": { + "prop": "--spectrum-tree-view-top-to-drag-handle", + "desktop": { + "value": "15px" + }, + "mobile": { + "value": "19px" + } + }, + "tree-view-top-to-label": { + "prop": "--spectrum-tree-view-top-to-label", + "desktop": { + "value": "10px" + }, + "mobile": { + "value": "13px" + } + }, + "treeview-indicator-inset-block-start": { + "prop": "--spectrum-treeview-indicator-inset-block-start", + "desktop": { + "value": "5px" + }, + "mobile": { + "value": "6px" + } + }, + "treeview-item-background-color-quiet-selected": { + "prop": "--spectrum-treeview-item-background-color-quiet-selected", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-gray-900) 7%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-gray-900) 6%, transparent)" + } + }, + "treeview-item-background-color-selected": { + "prop": "--spectrum-treeview-item-background-color-selected", + "dark": { + "value": "color-mix(in sRGB, var(--spectrum-blue-800) 15%, transparent)" + }, + "light": { + "value": "color-mix(in sRGB, var(--spectrum-blue-900) 15%, transparent)" + } + }, + "treeview-item-indentation-extra-large": { + "prop": "--spectrum-treeview-item-indentation-extra-large", + "desktop": { + "ref": "var(--spectrum-spacing-400)", + "value": "24px" + }, + "mobile": { + "value": "30px" + } + }, + "treeview-item-indentation-large": { + "prop": "--spectrum-treeview-item-indentation-large", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "25px" + } + }, + "treeview-item-indentation-medium": { + "prop": "--spectrum-treeview-item-indentation-medium", + "desktop": { + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "treeview-item-indentation-small": { + "prop": "--spectrum-treeview-item-indentation-small", + "desktop": { + "ref": "var(--spectrum-spacing-200)", + "value": "12px" + }, + "mobile": { + "value": "15px" + } + }, + "treeview-item-min-block-size-thumbnail-offset-medium": { + "prop": "--spectrum-treeview-item-min-block-size-thumbnail-offset-medium", + "desktop": { + "value": "0px" + }, + "mobile": { + "value": "2px" + } + }, + "triple-calendar-popover-minimum-height": { + "prop": "--spectrum-triple-calendar-popover-minimum-height", + "value": "320px" + }, + "triple-calendar-popover-minimum-width": { + "prop": "--spectrum-triple-calendar-popover-minimum-width", + "value": "912px" + }, + "turquoise-100": { + "prop": "--spectrum-turquoise-100", + "dark": { + "value": "rgb(0, 30, 33)" + }, + "light": { + "value": "rgb(238, 251, 251)" + } + }, + "turquoise-1000": { + "prop": "--spectrum-turquoise-1000", + "dark": { + "value": "rgb(13, 168, 182)" + }, + "light": { + "value": "rgb(5, 107, 116)" + } + }, + "turquoise-1100": { + "prop": "--spectrum-turquoise-1100", + "dark": { + "value": "rgb(16, 186, 202)" + }, + "light": { + "value": "rgb(3, 90, 98)" + } + }, + "turquoise-1200": { + "prop": "--spectrum-turquoise-1200", + "dark": { + "value": "rgb(64, 208, 220)" + }, + "light": { + "value": "rgb(1, 74, 81)" + } + }, + "turquoise-1300": { + "prop": "--spectrum-turquoise-1300", + "dark": { + "value": "rgb(128, 225, 231)" + }, + "light": { + "value": "rgb(0, 59, 65)" + } + }, + "turquoise-1400": { + "prop": "--spectrum-turquoise-1400", + "dark": { + "value": "rgb(183, 240, 240)" + }, + "light": { + "value": "rgb(0, 44, 49)" + } + }, + "turquoise-1500": { + "prop": "--spectrum-turquoise-1500", + "dark": { + "value": "rgb(228, 249, 249)" + }, + "light": { + "value": "rgb(0, 32, 35)" + } + }, + "turquoise-1600": { + "prop": "--spectrum-turquoise-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(0, 15, 17)" + } + }, + "turquoise-200": { + "prop": "--spectrum-turquoise-200", + "dark": { + "value": "rgb(0, 37, 41)" + }, + "light": { + "value": "rgb(209, 245, 245)" + } + }, + "turquoise-300": { + "prop": "--spectrum-turquoise-300", + "dark": { + "value": "rgb(0, 49, 54)" + }, + "light": { + "value": "rgb(169, 236, 237)" + } + }, + "turquoise-400": { + "prop": "--spectrum-turquoise-400", + "dark": { + "value": "rgb(0, 66, 72)" + }, + "light": { + "value": "rgb(111, 221, 228)" + } + }, + "turquoise-500": { + "prop": "--spectrum-turquoise-500", + "dark": { + "value": "rgb(3, 84, 92)" + }, + "light": { + "value": "rgb(39, 202, 216)" + } + }, + "turquoise-600": { + "prop": "--spectrum-turquoise-600", + "dark": { + "value": "rgb(5, 103, 112)" + }, + "light": { + "value": "rgb(15, 177, 192)" + } + }, + "turquoise-700": { + "prop": "--spectrum-turquoise-700", + "dark": { + "value": "rgb(7, 120, 131)" + }, + "light": { + "value": "rgb(12, 158, 171)" + } + }, + "turquoise-800": { + "prop": "--spectrum-turquoise-800", + "dark": { + "value": "rgb(9, 131, 142)" + }, + "light": { + "value": "rgb(10, 141, 153)" + } + }, + "turquoise-900": { + "prop": "--spectrum-turquoise-900", + "dark": { + "value": "rgb(11, 151, 164)" + }, + "light": { + "value": "rgb(8, 126, 137)" + } + }, + "turquoise-background-color-default": { + "prop": "--spectrum-turquoise-background-color-default", + "ref": "var(--spectrum-turquoise-800)", + "light": { + "value": "rgb(8, 126, 137)" + }, + "dark": { + "value": "rgb(9, 131, 142)" + } + }, + "turquoise-subtle-background-color-default": { + "prop": "--spectrum-turquoise-subtle-background-color-default", + "ref": "var(--spectrum-turquoise-300)", + "light": { + "value": "rgb(209, 245, 245)" + }, + "dark": { + "value": "rgb(0, 49, 54)" + } + }, + "turquoise-visual-color": { + "prop": "--spectrum-turquoise-visual-color", + "ref": "var(--spectrum-turquoise-900)", + "light": { + "value": "rgb(10, 141, 153)" + }, + "dark": { + "value": "rgb(11, 151, 164)" + } + }, + "user-card-minimum-height-extra-large": { + "prop": "--spectrum-user-card-minimum-height-extra-large", + "value": "236px" + }, + "user-card-minimum-height-large": { + "prop": "--spectrum-user-card-minimum-height-large", + "value": "219px" + }, + "user-card-minimum-height-medium": { + "prop": "--spectrum-user-card-minimum-height-medium", + "value": "202px" + }, + "user-card-minimum-height-small": { + "prop": "--spectrum-user-card-minimum-height-small", + "value": "192px" + }, + "user-card-minimum-height-title-below-extra-large": { + "prop": "--spectrum-user-card-minimum-height-title-below-extra-large", + "value": "263px" + }, + "user-card-minimum-height-title-below-large": { + "prop": "--spectrum-user-card-minimum-height-title-below-large", + "value": "244px" + }, + "user-card-minimum-height-title-below-medium": { + "prop": "--spectrum-user-card-minimum-height-title-below-medium", + "value": "224px" + }, + "user-card-minimum-height-title-below-small": { + "prop": "--spectrum-user-card-minimum-height-title-below-small", + "value": "212px" + }, + "visual-to-control-100": { + "prop": "--spectrum-visual-to-control-100", + "desktop": { + "value": "8px" + }, + "mobile": { + "value": "10px" + } + }, + "well-border-radius": { + "prop": "--spectrum-well-border-radius", + "desktop": { + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "well-margin-top": { + "prop": "--spectrum-well-margin-top", + "desktop": { + "ref": "var(--spectrum-spacing-75)", + "value": "4px" + }, + "mobile": { + "value": "5px" + } + }, + "well-min-width": { + "prop": "--spectrum-well-min-width", + "desktop": { + "value": "240px" + }, + "mobile": { + "value": "300px" + } + }, + "well-padding": { + "prop": "--spectrum-well-padding", + "desktop": { + "ref": "var(--spectrum-spacing-300)", + "value": "16px" + }, + "mobile": { + "value": "20px" + } + }, + "white": { + "prop": "--spectrum-white", + "value": "rgb(255, 255, 255)" + }, + "window-to-edge": { + "prop": "--spectrum-window-to-edge", + "ref": "var(--spectrum-spacing-600)", + "value": "40px" + }, + "workflow-icon-size-100": { + "prop": "--spectrum-workflow-icon-size-100", + "desktop": { + "value": "20px" + }, + "mobile": { + "value": "24px" + } + }, + "workflow-icon-size-200": { + "prop": "--spectrum-workflow-icon-size-200", + "desktop": { + "value": "22px" + }, + "mobile": { + "value": "28px" + } + }, + "workflow-icon-size-300": { + "prop": "--spectrum-workflow-icon-size-300", + "desktop": { + "value": "26px" + }, + "mobile": { + "value": "30px" + } + }, + "workflow-icon-size-50": { + "prop": "--spectrum-workflow-icon-size-50", + "desktop": { + "value": "14px" + }, + "mobile": { + "value": "16px" + } + }, + "workflow-icon-size-75": { + "prop": "--spectrum-workflow-icon-size-75", + "desktop": { + "value": "16px" + }, + "mobile": { + "value": "18px" + } + }, + "yellow-100": { + "prop": "--spectrum-yellow-100", + "light": { + "value": "rgb(255, 248, 204)" + }, + "dark": { + "value": "rgb(37, 23, 0)" + } + }, + "yellow-1000": { + "prop": "--spectrum-yellow-1000", + "light": { + "value": "rgb(134, 85, 0)" + }, + "dark": { + "value": "rgb(203, 141, 0)" + } + }, + "yellow-1100": { + "prop": "--spectrum-yellow-1100", + "light": { + "value": "rgb(114, 72, 0)" + }, + "dark": { + "value": "rgb(218, 159, 0)" + } + }, + "yellow-1200": { + "prop": "--spectrum-yellow-1200", + "light": { + "value": "rgb(93, 59, 0)" + }, + "dark": { + "value": "rgb(235, 183, 0)" + } + }, + "yellow-1300": { + "prop": "--spectrum-yellow-1300", + "light": { + "value": "rgb(75, 47, 0)" + }, + "dark": { + "value": "rgb(249, 206, 0)" + } + }, + "yellow-1400": { + "prop": "--spectrum-yellow-1400", + "light": { + "value": "rgb(56, 35, 0)" + }, + "dark": { + "value": "rgb(255, 230, 86)" + } + }, + "yellow-1500": { + "prop": "--spectrum-yellow-1500", + "dark": { + "value": "rgb(255, 246, 195)" + }, + "light": { + "value": "rgb(40, 25, 0)" + } + }, + "yellow-1600": { + "prop": "--spectrum-yellow-1600", + "dark": { + "value": "rgb(255, 255, 255)" + }, + "light": { + "value": "rgb(18, 11, 0)" + } + }, + "yellow-200": { + "prop": "--spectrum-yellow-200", + "light": { + "value": "rgb(255, 241, 151)" + }, + "dark": { + "value": "rgb(47, 29, 0)" + } + }, + "yellow-300": { + "prop": "--spectrum-yellow-300", + "light": { + "value": "rgb(255, 222, 44)" + }, + "dark": { + "value": "rgb(61, 39, 0)" + } + }, + "yellow-400": { + "prop": "--spectrum-yellow-400", + "light": { + "value": "rgb(245, 199, 0)" + }, + "dark": { + "value": "rgb(83, 52, 0)" + } + }, + "yellow-500": { + "prop": "--spectrum-yellow-500", + "light": { + "value": "rgb(230, 175, 0)" + }, + "dark": { + "value": "rgb(107, 67, 0)" + } + }, + "yellow-600": { + "prop": "--spectrum-yellow-600", + "light": { + "value": "rgb(210, 149, 0)" + }, + "dark": { + "value": "rgb(130, 82, 0)" + } + }, + "yellow-700": { + "prop": "--spectrum-yellow-700", + "light": { + "value": "rgb(193, 131, 0)" + }, + "dark": { + "value": "rgb(151, 97, 0)" + } + }, + "yellow-800": { + "prop": "--spectrum-yellow-800", + "light": { + "value": "rgb(175, 116, 0)" + }, + "dark": { + "value": "rgb(164, 106, 0)" + } + }, + "yellow-900": { + "prop": "--spectrum-yellow-900", + "light": { + "value": "rgb(158, 102, 0)" + }, + "dark": { + "value": "rgb(186, 124, 0)" + } + }, + "yellow-background-color-default": { + "prop": "--spectrum-yellow-background-color-default", + "ref": "var(--spectrum-yellow-1100)", + "light": { + "value": "rgb(245, 199, 0)" + }, + "dark": { + "value": "rgb(218, 159, 0)" + } + }, + "yellow-subtle-background-color-default": { + "prop": "--spectrum-yellow-subtle-background-color-default", + "ref": "var(--spectrum-yellow-300)", + "light": { + "value": "rgb(255, 241, 151)" + }, + "dark": { + "value": "rgb(61, 39, 0)" + } + }, + "yellow-visual-color": { + "prop": "--spectrum-yellow-visual-color", + "ref": "var(--spectrum-yellow-1100)", + "light": { + "value": "rgb(210, 149, 0)" + }, + "dark": { + "value": "rgb(218, 159, 0)" + } + } +} diff --git a/tokens/package.json b/tokens/package.json index 9352a280605..5f4e5f310ca 100644 --- a/tokens/package.json +++ b/tokens/package.json @@ -23,15 +23,28 @@ }, "main": "dist/css/index.css", "module": "style-dictionary.config.js", + "scripts": { + "build": "run-s clean build:tokens build:entry build:format build:min", + "build:entry": "postcss ./dist/css/index.css --replace", + "build:format": "prettier --write --cache --log-level error --ignore-unknown --no-error-on-unmatched-pattern ./dist/*/*", + "build:min": "postcss ./dist/css/index.css --dir ./dist/css --ext min.css", + "build:tokens": "style-dictionary build --config style-dictionary.config.js --verbose", + "clean": "rimraf dist", + "compare": "tdiff report --old-token-version @adobe/spectrum-tokens@${1:-13.7.0} --new-token-version @adobe/spectrum-tokens@${2:-13.9.0} --format markdown --output dist/tokens-diff.md" + }, "devDependencies": { - "@adobe/spectrum-tokens": "^13.7.0", + "@adobe/spectrum-tokens": "^13.9.0", "@adobe/token-diff-generator": "^2.0.0", - "@spectrum-tools/postcss-rgb-mapping": "1.1.0", "deepmerge": "^4.3.1", + "glob": "^11.0.2", "lodash-es": "^4.17.21", + "npm-run-all2": "^8.0.2", "postcss": "^8.5.3", + "postcss-cli": "^11.0.1", "postcss-sorting": "^9.1.0", - "style-dictionary": "^4.3.3" + "prettier": "^3.5.3", + "style-dictionary": "^4.4.0", + "yargs": "^17.7.2" }, "keywords": [ "design-system", diff --git a/tokens/postcss.config.js b/tokens/postcss.config.js index 1a7d7d22cfa..1c6ccc5ad58 100644 --- a/tokens/postcss.config.js +++ b/tokens/postcss.config.js @@ -13,32 +13,25 @@ import postcssConfig from "../postcss.config.js"; -export default (options) => postcssConfig({ - ...options, +import yargs from "yargs"; +import { hideBin } from "yargs/helpers"; + +const { ext } = yargs(hideBin(process.argv)) + .option("ext", { + type: "string", + default: ".css", + }) + .argv; + +/** @type {import("postcss").ProcessOptions} */ +export default (ctx = {}) => postcssConfig({ + ...ctx, + minify: ext?.includes("min.") ?? false, env: "production", - map: false, additionalPlugins: { - "@spectrum-tools/postcss-rgb-mapping": { - colorFunctionalNotation: false, - }, "postcss-sorting": { order: ["custom-properties", "declarations", "at-rules", "rules"], "properties-order": "alphabetical", }, - cssnano: { - preset: [ - "cssnano-preset-advanced", - { - colormin: false, - discardComments: { removeAll: true }, - // @todo yarn add -DW css-declaration-sorter - cssDeclarationSorter: false, // @todo { order: "smacss" }, - normalizeWhitespace: false, - }, - ], - }, - "postcss-licensing": { - filename: "../COPYRIGHT", - }, }, }); diff --git a/tokens/project.json b/tokens/project.json index e47da427b4a..065dbe9a841 100644 --- a/tokens/project.json +++ b/tokens/project.json @@ -2,82 +2,60 @@ "name": "tokens", "tag": ["tokens"], "namedInputs": { - "core": [ - "{projectRoot}/custom/*.css" - ], + "core": ["{projectRoot}/custom/*.css"], "scripts": ["{projectRoot}/style-dictionary.config.js", "{projectRoot}/utilities/*.js"], - "tools": ["{projectRoot}/postcss.config.js", "{projectRoot}/tasks/token-rollup.js"] + "tools": ["{projectRoot}/postcss.config.js"] }, "targets": { "build": { "cache": false, - "dependsOn": ["clean", "style-dictionary"], + "dependsOn": ["clean"], "executor": "nx:run-commands", "inputs": ["core", "tools", { "externalDependencies": ["postcss"] }], - "options": { - "commands": [ - "node --no-warnings ./tasks/token-rollup.js", - ], - "cwd": "{projectRoot}", - "parallel": false - }, - "outputs": [ - "{projectRoot}/dist/css/*-vars.css", - "{projectRoot}/dist/css/index.css" - ] - }, - "clean": { - "cache": false, - "executor": "nx:run-commands", - "inputs": ["{projectRoot}/dist", { "externalDependencies": ["rimraf"] }], - "options": { - "commands": [ - "rimraf {projectRoot}/dist", - "test -d {projectRoot}/dist && echo \"Error: dist directory could not be removed\" && exit 1 || exit 0" - ], - "parallel": false - }, - "outputs": [] - }, - "diff": { - "cache": true, - "executor": "nx:run-commands", + "options": { + "commands": [ + "style-dictionary build --config style-dictionary.config.js --verbose", + "postcss ./dist/css/index.css --replace", + "postcss ./dist/css/index.css --dir ./dist/css --ext min.css", + "prettier --write --cache --log-level error --ignore-unknown --no-error-on-unmatched-pattern ./dist/*/*" + ], + "cwd": "{projectRoot}", + "parallel": false + }, + "outputs": [ + "{projectRoot}/dist/css/index.css", + "{projectRoot}/dist/css/index.min.css", + "{projectRoot}/dist/json/tokens.json" + ] + }, + "clean": { + "cache": false, + "executor": "nx:run-commands", + "inputs": ["{projectRoot}/dist", { "externalDependencies": ["rimraf"] }], + "options": { + "commands": [ + "rimraf {projectRoot}/dist", + "test -d {projectRoot}/dist && echo \"Error: dist directory could not be removed\" && exit 1 || exit 0" + ], + "parallel": false + }, + "outputs": [] + }, + "compare": { + "cache": true, + "executor": "nx:run-commands", "inputs": [{ "externalDependencies": ["@adobe/token-diff-generator"] }], "options": { "commands": [ "tdiff report --old-token-version @adobe/spectrum-tokens@{args.v1} --new-token-version @adobe/spectrum-tokens@{args.v2} --format markdown --output dist/tokens-diff.md" ], "forwardAllArgs": true, - "v1": "13.7.0" - }, - "outputs": [ - "{projectRoot}/dist/tokens-diff.md" - ] - }, - "format": {}, - "lint": {}, - "style-dictionary": { - "dependsOn": ["clean"], - "executor": "nx:run-commands", - "inputs": [ - "{projectRoot}/postcss.config.js", - "{projectRoot}/style-dictionary.config.js", - "{projectRoot}/utilities/style-dictionary.utils.js" - ], - "options": { - "commands": [ - "style-dictionary build --config style-dictionary.config.js" - ], - "cwd": "{projectRoot}" + "v1": "13.7.0", + "v2": "13.9.0" }, - "outputs": [ - "{projectRoot}/dist/css/global-vars.css", - "{projectRoot}/dist/css/light-vars.css", - "{projectRoot}/dist/css/dark-vars.css", - "{projectRoot}/dist/css/medium-vars.css", - "{projectRoot}/dist/css/large-vars.css", - "{projectRoot}/dist/json/tokens.json" - ] - } - } + "outputs": ["{projectRoot}/dist/tokens-diff.md"] + }, + "format": {}, + "lint": {} + } } diff --git a/tokens/style-dictionary.config.js b/tokens/style-dictionary.config.js index e982115833a..d699904a804 100644 --- a/tokens/style-dictionary.config.js +++ b/tokens/style-dictionary.config.js @@ -17,6 +17,7 @@ import StyleDictionary from "style-dictionary"; import { AttributeSetsTransform, CSSBorderRoundingTransform, + CSSOpacityPercentTransform, CSSOpenTypeTransform, CSSSetsFormatter, DataJsonFormatter, @@ -25,6 +26,7 @@ import { StyleDictionary.registerTransform(CSSOpenTypeTransform); StyleDictionary.registerTransform(CSSBorderRoundingTransform); +StyleDictionary.registerTransform(CSSOpacityPercentTransform); StyleDictionary.registerTransform(NameKebabTransfom); StyleDictionary.registerTransform(AttributeSetsTransform); @@ -40,13 +42,14 @@ const tokensPath = import.meta.resolve("@adobe/spectrum-tokens/package.json")?.r const tokensDir = dirname(tokensPath); export default { - source: [join(tokensDir, "src", "*.json")], + source: [join(tokensDir, "src", "*.json"), "custom-tokens.json", "../components/*/tokens.json"], hooks: { transforms: { [AttributeSetsTransform.name]: AttributeSetsTransform, [NameKebabTransfom.name]: NameKebabTransfom, [CSSOpenTypeTransform.name]: CSSOpenTypeTransform, [CSSBorderRoundingTransform.name]: CSSBorderRoundingTransform, + [CSSOpacityPercentTransform.name]: CSSOpacityPercentTransform, }, }, platforms: { @@ -57,87 +60,17 @@ export default { NameKebabTransfom.name, CSSOpenTypeTransform.name, CSSBorderRoundingTransform.name, + CSSOpacityPercentTransform.name, ], prefix: "spectrum", files: [ { format: "css/sets", options: { showFileHeader: false, outputReferences: true }, - destination: "global-vars.css", + destination: "index.css", filter: (token) => { - const tokenSets = token.path.filter((_, idx, array) => array[idx - 1] == "sets"); - if (tokenSets.includes("wireframe")) return false; - if (tokenSets.length === 0) return true; - return false; - }, - }, - { - format: "css/sets", - options: { - showFileHeader: false, - outputReferences: true, - selector: ".spectrum--medium", - sets: ["desktop"], - }, - destination: "medium-vars.css", - filter: (token) => { - const tokenSets = token.path.filter((_, idx, array) => array[idx - 1] == "sets"); - if (tokenSets.includes("wireframe")) return false; - if (!tokenSets.includes("desktop")) return false; - if (tokenSets.length === 1) return true; - return false; - }, - }, - { - format: "css/sets", - options: { - showFileHeader: false, - outputReferences: true, - selector: ".spectrum--large", - sets: ["mobile"], - }, - destination: "large-vars.css", - filter: (token) => { - // Fetch the sets for this token - const tokenSets = token.path.filter((_, idx, array) => array[idx - 1] == "sets"); - if (tokenSets.includes("wireframe")) return false; - if (!tokenSets.includes("mobile")) return false; - if (tokenSets.length === 1) return true; - return false; - }, - }, - { - format: "css/sets", - options: { - showFileHeader: false, - outputReferences: true, - selector: ".spectrum--light", - sets: ["light"], - }, - destination: "light-vars.css", - filter: (token) => { - const tokenSets = token.path.filter((_, idx, array) => array[idx - 1] == "sets"); - if (tokenSets.includes("wireframe")) return false; - if (!tokenSets.includes("light")) return false; - if (tokenSets.length === 1) return true; - return false; - }, - }, - { - format: "css/sets", - options: { - showFileHeader: false, - outputReferences: true, - selector: ".spectrum--dark", - sets: ["dark"], - }, - destination: "dark-vars.css", - filter: (token) => { - const tokenSets = token.path.filter((_, idx, array) => array[idx - 1] == "sets"); - if (tokenSets.includes("wireframe")) return false; - if (!tokenSets.includes("dark")) return false; - if (tokenSets.length === 1) return true; - return false; + if (token.path.filter((_, idx, array) => array[idx - 1] == "sets")?.includes("wireframe")) return false; + return true; }, }, ], @@ -149,6 +82,7 @@ export default { NameKebabTransfom.name, CSSOpenTypeTransform.name, CSSBorderRoundingTransform.name, + CSSOpacityPercentTransform.name, ], prefix: "spectrum", files: [ diff --git a/tokens/tasks/token-rollup.js b/tokens/tasks/token-rollup.js deleted file mode 100644 index a7348bd394d..00000000000 --- a/tokens/tasks/token-rollup.js +++ /dev/null @@ -1,167 +0,0 @@ -/*! - * Copyright 2024 Adobe. All rights reserved. - * - * This file is licensed to you under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. You may obtain a copy - * of the License at - * - * Unless required by applicable law or agreed to in writing, software distributed under - * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS - * OF ANY KIND, either express or implied. See the License for the specific language - * governing permissions and limitations under the License. - */ - -/* eslint-disable no-console */ - -import fs, { existsSync, mkdirSync } from "fs"; -import { join } from "path"; -const fsp = fs.promises; - -import fg from "fast-glob"; - -import { processCSS } from "../../tasks/component-builder.js"; -import { fetchContent } from "../../tasks/utilities.js"; - -import "colors"; - -/** - * Create a tagline for the CSS file based on the package.json data - * @param {Object} [packageJson={}] - * @param {string} packageJson.name - * @param {string} packageJson.version - * @returns - */ -function generateTagline({ name, version } = {}) { - if (!name) return ""; - if (!version) return `/* ${name} */\n\n`; - return `/* ${name}@v${version} */\n\n`; -} - -/** - * The builder for the main entry point - * @param {object} config - * @param {string} config.cwd - Current working directory for the component being built - * @param {boolean} config.clean - Should the built assets be cleaned before running the build - * @returns Promise - */ -async function index(inputGlob, outputPath, { cwd = process.cwd(), clean = false } = {}) { - // Read in the package version from the package.json file - const packageJson = await fsp.readFile(join(cwd, "package.json"), "utf-8").then(JSON.parse); - - const inputs = await fg(inputGlob, { cwd }); - const contents = inputs.map(input => `@import "@spectrum-css/tokens/${input}";`).join("\n"); - if (!contents) return; - - return processCSS(contents, undefined, outputPath, { - cwd, - clean, - configPath: cwd, - map: false, - customTagline: generateTagline(packageJson), - }); -} - -/** - * Append custom/*-vars.css files to the end of the dist/css/*-vars.css files - * @param {Object} config - * @param {string} [config.cwd=process.cwd()] - Current working directory for the component - * @returns {Promise} - */ -async function appendCustomOverrides({ cwd = process.cwd(), packageJson = {} } = {}) { - const promises = []; - - // Add custom/*-vars.css to the end of the dist/css/*-vars.css files and run through postcss before writing back to the dist/css/*-vars.css file - const customFiles = await fg(["*-vars.css"], { cwd: join(cwd, "custom"), onlyFiles: true }); - const globalFiles = await fg(["*-vars.css"], { cwd: join(cwd, "dist", "css"), onlyFiles: true }); - - // Create a list that combines the custom and dist files - const combinedFiles = [...new Set([...customFiles, ...globalFiles])]; - for (const file of combinedFiles) { - // Read in the custom file and the dist file and combine them into one file - const combinedContent = await fetchContent([ - join("dist", "css", file), - join("custom", file) - ], { cwd, shouldCombine: true }); - - if (!combinedContent || !combinedContent?.[0]?.content) continue; - - promises.push( - processCSS(combinedContent[0].content, join(cwd, "dist", "css", file), join(cwd, "dist", "css", file), { - cwd, - configPath: cwd, - customTagline: generateTagline(packageJson), - }) - ); - } - - return Promise.all(promises); -} - -/** - * The main entry point for this tool; this builds a CSS component - * @param {object} config - * @param {string} [config.componentName=process.env.NX_TASK_TARGET_PROJECT] - Current working directory for the component being built - * @param {string} [config.cwd=] - Current working directory for the component being built - * @param {boolean} [config.clean=false] - Should the built assets be cleaned before running the build - * @returns Promise - */ -async function main({ - cwd = process.cwd(), - clean, -} = {}) { - const key = `[build] ${"@spectrum-css/tokens".cyan} index`; - console.time(key); - - const compiledOutputPath = join(cwd, "dist"); - - // Ensure the dist directory exists - if (!existsSync(compiledOutputPath)) { - mkdirSync(compiledOutputPath); - } - - const reports = []; - const errors = []; - - // Read in the package version from the package.json file - const packageJson = await fsp.readFile(join(cwd, "package.json"), "utf-8").then(JSON.parse); - - // Wait for all the custom files to be processed - await appendCustomOverrides({ packageJson, cwd }).then((report) => { reports.push(report); }).catch((err) => { errors.push(err); }); - - // Then build the index.css file - await index(["dist/css/*-vars.css"], join(compiledOutputPath, "css", "index.css"), { cwd, clean }).then((report) => { reports.push(report); }).catch((err) => { errors.push(err); }); - - // Combine all the reports into a single log output - const logs = reports.flat(Infinity).filter(Boolean); - const errorLogs = errors.flat(Infinity).filter(Boolean); - - console.log(`\n\n${key} 🔨`); - console.log(`${"".padStart(30, "-")}`); - - if (!(errorLogs && errorLogs.length > 0)) { - if (logs && logs.length > 0) { - logs.forEach(log => { - // Strip the ../../tokens/ from the paths - console.log(log.replace(/(\.\.\/)+tokens\//g, "")); - }); - } - else console.log("No assets created.".gray); - } - else { - errorLogs.forEach(log => { - console.error(log); - }); - } - - console.log(`${"".padStart(30, "-")}`); - console.timeEnd(key); - console.log(""); - - if (errorLogs && errorLogs.length > 0) { - process.exit(1); - } -} - -main(); - -export { main as default }; diff --git a/tokens/utilities/css-opacity-percent-transform.js b/tokens/utilities/css-opacity-percent-transform.js new file mode 100644 index 00000000000..784b2119b0f --- /dev/null +++ b/tokens/utilities/css-opacity-percent-transform.js @@ -0,0 +1,14 @@ +export default { + type: "value", + name: "opacity/percent", + filter: (token) => token.name.includes("opacity"), + transform: (token) => { + // If the token is a percentage, return it as-is + if (token.value.includes("%")) { + return token.value; + } + + // if the token is a number, convert it to a percentage + return `${token.value * 100}%`; + }, +}; diff --git a/tokens/utilities/css-sets-formatter.js b/tokens/utilities/css-sets-formatter.js index ddb6bf9f7e3..892d11b92f8 100644 --- a/tokens/utilities/css-sets-formatter.js +++ b/tokens/utilities/css-sets-formatter.js @@ -1,5 +1,12 @@ import { usesReferences } from "style-dictionary/utils"; +import { processCSS } from "../../tasks/component-builder.js"; +/** + * @description Generates an array of the token path + * @param {import('style-dictionary').Token} token + * @param {string} prefix + * @returns {string[]} + */ export const generateNameArray = (token, prefix) => { let name = prefix ? [prefix] : []; const cleanTokenPath = []; @@ -34,30 +41,158 @@ const valueFormatter = (token, platform) => { }; /** - * The format function to split out the token set data into distinct CSS variables + * @description Pushes a value to a map; supports nested maps and arrays + * @param {Map} map + * @param {string} key + * @param {any} value + * @returns {Map} + */ +const pushToMap = (map, key, value) => { + if (!map.has(key)) { + map.set(key, value); + return map; + } + + let existing = map.get(key); + + // Check if the value is a Map + if (value instanceof Map) { + // Merge the two maps + for (const [k, v] of value.entries()) { + existing.set(k, v); + } + } + else if (value instanceof Object) { + // Merge the two objects + for (const [k, v] of Object.entries(value)) { + existing[k] = v; + } + } + else if (Array.isArray(value)) { + // Merge the two arrays + existing.push(...value); + } + else { + // If it's a primitive value, just set it + existing = value; + } + + map.set(key, existing); + return map; +}; + +/** + * @description Split out the token set data into distinct CSS variables * @type {import('style-dictionary/types').FormatFn} format */ -const format = ({ dictionary, platform, options }) => { - const resultAr = []; +const format = ({ dictionary, platform }) => { + const isDefault = (context) => context === "defaults" || context === "light" || context === "medium"; - dictionary.allTokens.forEach((token) => { + const layers = new Map(); + for (const [key, token] of [...dictionary.tokenMap.entries()]) { + const results = new Map(); const name = generateNameArray(token, platform.prefix); - const value = valueFormatter(token, platform); + let value = valueFormatter(token, platform); + + if (!name || name[1]?.startsWith("android-")) continue; + if (!value) continue; - if (!value) return; - if (name[1]?.startsWith("android-")) { - return; + if (!token.path.includes("sets")) { + results.set(name.join("-"), value); + pushToMap(layers, "defaults", results); + continue; } - resultAr.push(` --${name.join("-")}: ${value};`); - }); + const sets = token.path.filter((_, idx, array) => array[idx - 1] == "sets"); + + const isDark = sets.includes("dark"); + const isLight = sets.includes("light"); + + if (!isDark && !isLight) { + results.set(name.join("-"), value); + if (sets.includes("mobile")) { + pushToMap(layers, "large", results); + } + else { + pushToMap(layers, "defaults", results); + } + continue; + } - const selector = options.selector ? options.selector : ".spectrum"; + // Check that an alternate key exists for the dark or light set; if not, we can't use light-dark() + let altKey = key.replace(/dark|light/g, isDark ? "light" : "dark"); + const useLightDark = altKey ? dictionary.tokenMap.has(altKey) : false; - return `${selector} {\n${resultAr.join("\n")}\n}\n`; + if (!useLightDark) { + results.set(name.join("-"), value); + pushToMap(layers, "defaults", results); + continue; + } + // skip the dark sets as they are going to be combined with the light ones + else if (isDark) continue; + + const darkValue = valueFormatter(dictionary.tokenMap.get(altKey), platform); + + // If the value is the same as the dark value, we can just use the value, no function call + if (value === darkValue) { + results.set(name.join("-"), value); + pushToMap(layers, "defaults", results); + continue; + } + + console.log(value, usesReferences(token)); + + // If the value and dark value are not using references, we can just use the value, no function call + if (!usesReferences(value) && !usesReferences(darkValue)) { + results.set(name.join("-"), `light-dark(${value}, ${darkValue})`); + pushToMap(layers, "defaults", results); + continue; + } + + const resolved = { + light: value, + dark: darkValue, + }; + + // If the value or dark value is using a token that also has a light-dark() function, we need to combine them + Object.entries(resolved).forEach(([k, v]) => { + if (!usesReferences(v)) return; + + // Determine what the resolved value is for the light token + const t = dictionary.tokenMap.get(v); + console.log(t); + resolved[k] = valueFormatter(t, platform); + }); + + console.log(resolved); + + results.set(name.join("-"), `light-dark(${resolved.light}, ${resolved.dark})`); + pushToMap(layers, "defaults", results); + } + + const styles = [...layers.entries()].sort().map(([layer, results]) => ` +${!isDefault(layer) ? `.spectrum--${layer}` : ":root"} { +${[...results.entries()].sort().map(([name, value]) => `--${name}: ${value};`).join("\n")} +}`).join("\n\n"); + + // Run styles through the css processor, if possible + if (typeof processCSS === "function") { + return processCSS(styles, undefined, undefined, { + cwd: platform.buildPath, + clean: true, + map: false, + }); + } + + // Otherwise, return the styles as is + return styles; }; + format.nested = true; +/** + * @type {import('style-dictionary/types').Format} + */ export default { name: "css/sets", format, diff --git a/tokens/utilities/index.js b/tokens/utilities/index.js index f209e8a4825..1b392a2402b 100644 --- a/tokens/utilities/index.js +++ b/tokens/utilities/index.js @@ -1,6 +1,7 @@ export { default as AttributeSetsTransform } from "./attribute-sets-transform.js"; export { default as CSSBorderRoundingTransform } from "./css-border-rounding-transform.js"; export { default as CSSOpenTypeTransform } from "./css-font-open-type-transform.js"; +export { default as CSSOpacityPercentTransform } from "./css-opacity-percent-transform.js"; export { default as CSSSetsFormatter } from "./css-sets-formatter.js"; export { default as DataJsonFormatter } from "./data-json-formatter.js"; export { default as NameKebabTransfom } from "./name-kebab-transform.js"; diff --git a/yarn.lock b/yarn.lock index 7db92bc0d63..07f53eb2957 100644 --- a/yarn.lock +++ b/yarn.lock @@ -125,7 +125,6 @@ __metadata: "@commitlint/cli": "npm:^19.6.1" "@commitlint/config-conventional": "npm:^19.6.0" "@nx/devkit": "npm:^21.0.0" - "@spectrum-tools/postcss-rgb-mapping": "npm:1.1.0" "@yarnpkg/types": "npm:^4.0.0" at-rule-packer: "npm:^0.4.2" autoprefixer: "npm:^10.4.21" @@ -159,7 +158,7 @@ __metadata: postcss-licensing: "npm:^3.0.0" postcss-load-config: "npm:^6.0.1" postcss-modules: "npm:^6.0.1" - postcss-preset-env: "npm:^10.1.5" + postcss-preset-env: "npm:^10.1.6" postcss-pseudo-classes: "npm:^0.4.0" postcss-reporter: "npm:^7.1.0" postcss-selector-replace: "npm:^1.0.2" @@ -167,8 +166,8 @@ __metadata: postcss-values-parser: "npm:^6.0.2" prettier: "npm:^3.5.3" rimraf: "npm:^6.0.1" - semver: "npm:^7.7.1" - stylelint: "npm:^16.18.0" + semver: "npm:^7.7.2" + stylelint: "npm:^16.19.1" stylelint-config-standard: "npm:^38.0.0" stylelint-header: "npm:^3.0.0" stylelint-high-performance-animation: "npm:^1.11.0" @@ -188,10 +187,10 @@ __metadata: languageName: node linkType: hard -"@adobe/spectrum-tokens@npm:^13.7.0": - version: 13.7.0 - resolution: "@adobe/spectrum-tokens@npm:13.7.0" - checksum: 10c0/e97b0bcb832c839b45c563a6ad5d68f86320989d8c7403af2512f81c7b1b15fcc68243270587728b95a2e6829fc113920c7e5a6b5a464b880ea3b17da5756892 +"@adobe/spectrum-tokens@npm:^13.9.0": + version: 13.9.0 + resolution: "@adobe/spectrum-tokens@npm:13.9.0" + checksum: 10c0/862189a5d7adbdd0a83aebb804c89567f6079a71ccd53af334bdb70db231f103a9becafa623660f5a7ccda73a798c9598a957a489cce07afdbb1caaa6e29c9cd languageName: node linkType: hard @@ -396,6 +395,17 @@ __metadata: languageName: node linkType: hard +"@babel/code-frame@npm:^7.25.9, @babel/code-frame@npm:^7.26.0": + version: 7.26.0 + resolution: "@babel/code-frame@npm:7.26.0" + dependencies: + "@babel/helper-validator-identifier": "npm:^7.25.9" + js-tokens: "npm:^4.0.0" + picocolors: "npm:^1.0.0" + checksum: 10c0/46f7e367714be736b52ea3c01b24f47e2102e210fb83021d1c8237d8fc511b9538909e16e2fcdbb5cb6173e0794e28624309a59014e52fcfb7bde908f5284388 + languageName: node + linkType: hard + "@babel/code-frame@npm:^7.27.1": version: 7.27.1 resolution: "@babel/code-frame@npm:7.27.1" @@ -407,6 +417,13 @@ __metadata: languageName: node linkType: hard +"@babel/compat-data@npm:^7.25.9": + version: 7.26.0 + resolution: "@babel/compat-data@npm:7.26.0" + checksum: 10c0/6325c9151a3c9b0a3a807e854a26255ef66d989bff331475a935af9bb18f160e0fffe6aed550e4e96b63f91efcd874bfbaab2a1f4a2f8d25645d712a0de590fb + languageName: node + linkType: hard + "@babel/compat-data@npm:^7.27.2": version: 7.27.2 resolution: "@babel/compat-data@npm:7.27.2" @@ -414,7 +431,30 @@ __metadata: languageName: node linkType: hard -"@babel/core@npm:^7.11.6, @babel/core@npm:^7.12.3, @babel/core@npm:^7.22.5, @babel/core@npm:^7.23.9, @babel/core@npm:^7.26.0, @babel/core@npm:^7.7.5": +"@babel/core@npm:^7.11.6, @babel/core@npm:^7.12.3, @babel/core@npm:^7.22.5, @babel/core@npm:^7.23.9, @babel/core@npm:^7.7.5": + version: 7.26.0 + resolution: "@babel/core@npm:7.26.0" + dependencies: + "@ampproject/remapping": "npm:^2.2.0" + "@babel/code-frame": "npm:^7.26.0" + "@babel/generator": "npm:^7.26.0" + "@babel/helper-compilation-targets": "npm:^7.25.9" + "@babel/helper-module-transforms": "npm:^7.26.0" + "@babel/helpers": "npm:^7.26.0" + "@babel/parser": "npm:^7.26.0" + "@babel/template": "npm:^7.25.9" + "@babel/traverse": "npm:^7.25.9" + "@babel/types": "npm:^7.26.0" + convert-source-map: "npm:^2.0.0" + debug: "npm:^4.1.0" + gensync: "npm:^1.0.0-beta.2" + json5: "npm:^2.2.3" + semver: "npm:^6.3.1" + checksum: 10c0/91de73a7ff5c4049fbc747930aa039300e4d2670c2a91f5aa622f1b4868600fc89b01b6278385fbcd46f9574186fa3d9b376a9e7538e50f8d118ec13cfbcb63e + languageName: node + linkType: hard + +"@babel/core@npm:^7.26.0": version: 7.27.1 resolution: "@babel/core@npm:7.27.1" dependencies: @@ -450,6 +490,19 @@ __metadata: languageName: node linkType: hard +"@babel/generator@npm:^7.25.9, @babel/generator@npm:^7.26.0": + version: 7.26.0 + resolution: "@babel/generator@npm:7.26.0" + dependencies: + "@babel/parser": "npm:^7.26.0" + "@babel/types": "npm:^7.26.0" + "@jridgewell/gen-mapping": "npm:^0.3.5" + "@jridgewell/trace-mapping": "npm:^0.3.25" + jsesc: "npm:^3.0.2" + checksum: 10c0/b6bb9185f19a97eaf58e04a6d39a13237076678e7ed16b6321dea914535d4bf6a8d7727c9dcb65539845aa0096b326eb67be4bab764bd74bcfd848e2eda68609 + languageName: node + linkType: hard + "@babel/generator@npm:^7.27.1": version: 7.27.1 resolution: "@babel/generator@npm:7.27.1" @@ -463,6 +516,19 @@ __metadata: languageName: node linkType: hard +"@babel/helper-compilation-targets@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/helper-compilation-targets@npm:7.25.9" + dependencies: + "@babel/compat-data": "npm:^7.25.9" + "@babel/helper-validator-option": "npm:^7.25.9" + browserslist: "npm:^4.24.0" + lru-cache: "npm:^5.1.1" + semver: "npm:^6.3.1" + checksum: 10c0/a6b26a1e4222e69ef8e62ee19374308f060b007828bc11c65025ecc9e814aba21ff2175d6d3f8bf53c863edd728ee8f94ba7870f8f90a37d39552ad9933a8aaa + languageName: node + linkType: hard + "@babel/helper-compilation-targets@npm:^7.27.1": version: 7.27.2 resolution: "@babel/helper-compilation-targets@npm:7.27.2" @@ -476,6 +542,16 @@ __metadata: languageName: node linkType: hard +"@babel/helper-module-imports@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/helper-module-imports@npm:7.25.9" + dependencies: + "@babel/traverse": "npm:^7.25.9" + "@babel/types": "npm:^7.25.9" + checksum: 10c0/078d3c2b45d1f97ffe6bb47f61961be4785d2342a4156d8b42c92ee4e1b7b9e365655dd6cb25329e8fe1a675c91eeac7e3d04f0c518b67e417e29d6e27b6aa70 + languageName: node + linkType: hard + "@babel/helper-module-imports@npm:^7.27.1": version: 7.27.1 resolution: "@babel/helper-module-imports@npm:7.27.1" @@ -486,6 +562,19 @@ __metadata: languageName: node linkType: hard +"@babel/helper-module-transforms@npm:^7.26.0": + version: 7.26.0 + resolution: "@babel/helper-module-transforms@npm:7.26.0" + dependencies: + "@babel/helper-module-imports": "npm:^7.25.9" + "@babel/helper-validator-identifier": "npm:^7.25.9" + "@babel/traverse": "npm:^7.25.9" + peerDependencies: + "@babel/core": ^7.0.0 + checksum: 10c0/ee111b68a5933481d76633dad9cdab30c41df4479f0e5e1cc4756dc9447c1afd2c9473b5ba006362e35b17f4ebddd5fca090233bef8dfc84dca9d9127e56ec3a + languageName: node + linkType: hard + "@babel/helper-module-transforms@npm:^7.27.1": version: 7.27.1 resolution: "@babel/helper-module-transforms@npm:7.27.1" @@ -548,6 +637,13 @@ __metadata: languageName: node linkType: hard +"@babel/helper-validator-option@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/helper-validator-option@npm:7.25.9" + checksum: 10c0/27fb195d14c7dcb07f14e58fe77c44eea19a6a40a74472ec05c441478fa0bb49fa1c32b2d64be7a38870ee48ef6601bdebe98d512f0253aea0b39756c4014f3e + languageName: node + linkType: hard + "@babel/helper-validator-option@npm:^7.27.1": version: 7.27.1 resolution: "@babel/helper-validator-option@npm:7.27.1" @@ -555,6 +651,16 @@ __metadata: languageName: node linkType: hard +"@babel/helpers@npm:^7.26.0": + version: 7.26.10 + resolution: "@babel/helpers@npm:7.26.10" + dependencies: + "@babel/template": "npm:^7.26.9" + "@babel/types": "npm:^7.26.10" + checksum: 10c0/f99e1836bcffce96db43158518bb4a24cf266820021f6461092a776cba2dc01d9fc8b1b90979d7643c5c2ab7facc438149064463a52dd528b21c6ab32509784f + languageName: node + linkType: hard + "@babel/helpers@npm:^7.27.1": version: 7.27.1 resolution: "@babel/helpers@npm:7.27.1" @@ -585,6 +691,17 @@ __metadata: languageName: node linkType: hard +"@babel/parser@npm:^7.25.9, @babel/parser@npm:^7.26.0": + version: 7.26.1 + resolution: "@babel/parser@npm:7.26.1" + dependencies: + "@babel/types": "npm:^7.26.0" + bin: + parser: ./bin/babel-parser.js + checksum: 10c0/dc7d4e6b7eb667fa0784e7e2c3f6f92ca12ad72242f6d4311995310dae55093f02acdb595b69b0dbbf04cb61ad87156ac03186ff32eacfa35149c655bc22c14b + languageName: node + linkType: hard + "@babel/parser@npm:^7.26.9": version: 7.26.10 resolution: "@babel/parser@npm:7.26.10" @@ -794,7 +911,7 @@ __metadata: languageName: node linkType: hard -"@babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.17.8, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.5.5": +"@babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.17.8": version: 7.26.10 resolution: "@babel/runtime@npm:7.26.10" dependencies: @@ -803,7 +920,23 @@ __metadata: languageName: node linkType: hard -"@babel/template@npm:^7.22.5, @babel/template@npm:^7.3.3": +"@babel/runtime@npm:^7.3.1": + version: 7.27.1 + resolution: "@babel/runtime@npm:7.27.1" + checksum: 10c0/530a7332f86ac5a7442250456823a930906911d895c0b743bf1852efc88a20a016ed4cd26d442d0ca40ae6d5448111e02a08dd638a4f1064b47d080e2875dc05 + languageName: node + linkType: hard + +"@babel/runtime@npm:^7.5.5": + version: 7.24.4 + resolution: "@babel/runtime@npm:7.24.4" + dependencies: + regenerator-runtime: "npm:^0.14.0" + checksum: 10c0/785aff96a3aa8ff97f90958e1e8a7b1d47f793b204b47c6455eaadc3f694f48c97cd5c0a921fe3596d818e71f18106610a164fb0f1c71fd68c622a58269d537c + languageName: node + linkType: hard + +"@babel/template@npm:^7.22.5, @babel/template@npm:^7.26.9, @babel/template@npm:^7.3.3": version: 7.26.9 resolution: "@babel/template@npm:7.26.9" dependencies: @@ -814,6 +947,17 @@ __metadata: languageName: node linkType: hard +"@babel/template@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/template@npm:7.25.9" + dependencies: + "@babel/code-frame": "npm:^7.25.9" + "@babel/parser": "npm:^7.25.9" + "@babel/types": "npm:^7.25.9" + checksum: 10c0/ebe677273f96a36c92cc15b7aa7b11cc8bc8a3bb7a01d55b2125baca8f19cae94ff3ce15f1b1880fb8437f3a690d9f89d4e91f16fc1dc4d3eb66226d128983ab + languageName: node + linkType: hard + "@babel/template@npm:^7.27.1": version: 7.27.2 resolution: "@babel/template@npm:7.27.2" @@ -825,6 +969,21 @@ __metadata: languageName: node linkType: hard +"@babel/traverse@npm:^7.25.9": + version: 7.25.9 + resolution: "@babel/traverse@npm:7.25.9" + dependencies: + "@babel/code-frame": "npm:^7.25.9" + "@babel/generator": "npm:^7.25.9" + "@babel/parser": "npm:^7.25.9" + "@babel/template": "npm:^7.25.9" + "@babel/types": "npm:^7.25.9" + debug: "npm:^4.3.1" + globals: "npm:^11.1.0" + checksum: 10c0/e90be586a714da4adb80e6cb6a3c5cfcaa9b28148abdafb065e34cc109676fc3db22cf98cd2b2fff66ffb9b50c0ef882cab0f466b6844be0f6c637b82719bba1 + languageName: node + linkType: hard + "@babel/traverse@npm:^7.27.1": version: 7.27.1 resolution: "@babel/traverse@npm:7.27.1" @@ -861,7 +1020,17 @@ __metadata: languageName: node linkType: hard -"@babel/types@npm:^7.26.10, @babel/types@npm:^7.26.9": +"@babel/types@npm:^7.25.9, @babel/types@npm:^7.26.0": + version: 7.26.0 + resolution: "@babel/types@npm:7.26.0" + dependencies: + "@babel/helper-string-parser": "npm:^7.25.9" + "@babel/helper-validator-identifier": "npm:^7.25.9" + checksum: 10c0/b694f41ad1597127e16024d766c33a641508aad037abd08d0d1f73af753e1119fa03b4a107d04b5f92cc19c095a594660547ae9bead1db2299212d644b0a5cb8 + languageName: node + linkType: hard + +"@babel/types@npm:^7.26.10": version: 7.26.10 resolution: "@babel/types@npm:7.26.10" dependencies: @@ -871,6 +1040,16 @@ __metadata: languageName: node linkType: hard +"@babel/types@npm:^7.26.9": + version: 7.26.9 + resolution: "@babel/types@npm:7.26.9" + dependencies: + "@babel/helper-string-parser": "npm:^7.25.9" + "@babel/helper-validator-identifier": "npm:^7.25.9" + checksum: 10c0/999c56269ba00e5c57aa711fbe7ff071cd6990bafd1b978341ea7572cc78919986e2aa6ee51dacf4b6a7a6fa63ba4eb3f1a03cf55eee31b896a56d068b895964 + languageName: node + linkType: hard + "@babel/types@npm:^7.27.1": version: 7.27.1 resolution: "@babel/types@npm:7.27.1" @@ -3031,6 +3210,15 @@ __metadata: languageName: node linkType: hard +"@ljharb/through@npm:^2.3.13": + version: 2.3.13 + resolution: "@ljharb/through@npm:2.3.13" + dependencies: + call-bind: "npm:^1.0.7" + checksum: 10c0/fb60b2fb2c674a674d8ebdb8972ccf52f8a62a9c1f5a2ac42557bc0273231c65d642aa2d7627cbb300766a25ae4642acd0f95fba2f8a1ff891086f0cb15807c3 + languageName: node + linkType: hard + "@manypkg/find-root@npm:^1.1.0": version: 1.1.0 resolution: "@manypkg/find-root@npm:1.1.0" @@ -5541,14 +5729,18 @@ __metadata: version: 0.0.0-use.local resolution: "@spectrum-css/tokens@workspace:tokens" dependencies: - "@adobe/spectrum-tokens": "npm:^13.7.0" + "@adobe/spectrum-tokens": "npm:^13.9.0" "@adobe/token-diff-generator": "npm:^2.0.0" - "@spectrum-tools/postcss-rgb-mapping": "npm:1.1.0" deepmerge: "npm:^4.3.1" + glob: "npm:^11.0.2" lodash-es: "npm:^4.17.21" + npm-run-all2: "npm:^8.0.2" postcss: "npm:^8.5.3" + postcss-cli: "npm:^11.0.1" postcss-sorting: "npm:^9.1.0" - style-dictionary: "npm:^4.3.3" + prettier: "npm:^3.5.3" + style-dictionary: "npm:^4.4.0" + yargs: "npm:^17.7.2" languageName: unknown linkType: soft @@ -5687,19 +5879,6 @@ __metadata: languageName: unknown linkType: soft -"@spectrum-tools/postcss-rgb-mapping@npm:1.1.0, @spectrum-tools/postcss-rgb-mapping@workspace:plugins/postcss-rgb-mapping": - version: 0.0.0-use.local - resolution: "@spectrum-tools/postcss-rgb-mapping@workspace:plugins/postcss-rgb-mapping" - dependencies: - ava: "npm:^6.2.0" - c8: "npm:^10.1.3" - postcss: "npm:^8.5.3" - postcss-values-parser: "npm:^6.0.2" - peerDependencies: - postcss: ">=8" - languageName: unknown - linkType: soft - "@spectrum-tools/stylelint-no-missing-var@workspace:plugins/stylelint-no-missing-var": version: 0.0.0-use.local resolution: "@spectrum-tools/stylelint-no-missing-var@workspace:plugins/stylelint-no-missing-var" @@ -5707,7 +5886,7 @@ __metadata: ava: "npm:^6.2.0" c8: "npm:^10.1.3" colors: "npm:^1.4.0" - stylelint: "npm:^16.18.0" + stylelint: "npm:^16.19.1" peerDependencies: stylelint: ">=16" languageName: unknown @@ -5723,7 +5902,7 @@ __metadata: fast-glob: "npm:^3.3.3" postcss: "npm:^8.5.3" postcss-values-parser: "npm:^6.0.2" - stylelint: "npm:^16.18.0" + stylelint: "npm:^16.19.1" peerDependencies: stylelint: ">=16" languageName: unknown @@ -5738,7 +5917,7 @@ __metadata: colors: "npm:^1.4.0" postcss: "npm:^8.5.3" postcss-values-parser: "npm:^6.0.2" - stylelint: "npm:^16.18.0" + stylelint: "npm:^16.19.1" peerDependencies: stylelint: ">=16" languageName: unknown @@ -7994,13 +8173,20 @@ __metadata: languageName: node linkType: hard -"caniuse-lite@npm:^1.0.0, caniuse-lite@npm:^1.0.30001669, caniuse-lite@npm:^1.0.30001688, caniuse-lite@npm:^1.0.30001702": +"caniuse-lite@npm:^1.0.0, caniuse-lite@npm:^1.0.30001688, caniuse-lite@npm:^1.0.30001702": version: 1.0.30001703 resolution: "caniuse-lite@npm:1.0.30001703" checksum: 10c0/ed88e318da28e9e59c4ac3a2e3c42859558b7b713aebf03696a1f916e4ed4b70734dda82be04635e2b62ec355b8639bbed829b7b12ff528d7f9cc31a3a5bea91 languageName: node linkType: hard +"caniuse-lite@npm:^1.0.30001669": + version: 1.0.30001690 + resolution: "caniuse-lite@npm:1.0.30001690" + checksum: 10c0/646bd469032afa90400a84dec30a2b00a6eda62c03ead358117e3f884cda8aacec02ec058a6dbee5eaf9714f83e483b9b0eb4fb42febb8076569f5ca40f1d347 + languageName: node + linkType: hard + "caniuse-lite@npm:^1.0.30001716": version: 1.0.30001717 resolution: "caniuse-lite@npm:1.0.30001717" @@ -8263,7 +8449,7 @@ __metadata: languageName: node linkType: hard -"chokidar@npm:^3.6.0": +"chokidar@npm:^3.3.0, chokidar@npm:^3.6.0": version: 3.6.0 resolution: "chokidar@npm:3.6.0" dependencies: @@ -8867,7 +9053,7 @@ __metadata: languageName: node linkType: hard -"cross-spawn@npm:^7.0.0, cross-spawn@npm:^7.0.1, cross-spawn@npm:^7.0.2, cross-spawn@npm:^7.0.3, cross-spawn@npm:^7.0.5": +"cross-spawn@npm:^7.0.0, cross-spawn@npm:^7.0.1, cross-spawn@npm:^7.0.2, cross-spawn@npm:^7.0.3, cross-spawn@npm:^7.0.5, cross-spawn@npm:^7.0.6": version: 7.0.6 resolution: "cross-spawn@npm:7.0.6" dependencies: @@ -9427,6 +9613,13 @@ __metadata: languageName: node linkType: hard +"dependency-graph@npm:^1.0.0": + version: 1.0.0 + resolution: "dependency-graph@npm:1.0.0" + checksum: 10c0/10d1e248ab68a33654335559bae5ec142c51959cbff1cba8b35cdccfdc12eb8d136227df85c31b71b9ee9fed1b2bfbd01721661b4f927e12d890d13c4230788f + languageName: node + linkType: hard + "deprecation@npm:^2.0.0, deprecation@npm:^2.3.1": version: 2.3.1 resolution: "deprecation@npm:2.3.1" @@ -11159,6 +11352,17 @@ __metadata: languageName: node linkType: hard +"fs-extra@npm:^11.0.0": + version: 11.3.0 + resolution: "fs-extra@npm:11.3.0" + dependencies: + graceful-fs: "npm:^4.2.0" + jsonfile: "npm:^6.0.1" + universalify: "npm:^2.0.0" + checksum: 10c0/5f95e996186ff45463059feb115a22fb048bdaf7e487ecee8a8646c78ed8fdca63630e3077d4c16ce677051f5e60d3355a06f3cd61f3ca43f48cc58822a44d0a + languageName: node + linkType: hard + "fs-extra@npm:^11.1.1": version: 11.2.0 resolution: "fs-extra@npm:11.2.0" @@ -11432,7 +11636,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^10.0.0, glob@npm:^10.2.2, glob@npm:^10.3.7, glob@npm:^10.4.1, glob@npm:^10.4.2, glob@npm:^10.4.5": +"glob@npm:^10.0.0, glob@npm:^10.2.2, glob@npm:^10.3.10, glob@npm:^10.3.7, glob@npm:^10.4.1, glob@npm:^10.4.2, glob@npm:^10.4.5": version: 10.4.5 resolution: "glob@npm:10.4.5" dependencies: @@ -11464,21 +11668,7 @@ __metadata: languageName: node linkType: hard -"glob@npm:^7.0.3, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6": - version: 7.2.3 - resolution: "glob@npm:7.2.3" - dependencies: - fs.realpath: "npm:^1.0.0" - inflight: "npm:^1.0.4" - inherits: "npm:2" - minimatch: "npm:^3.1.1" - once: "npm:^1.3.0" - path-is-absolute: "npm:^1.0.0" - checksum: 10c0/65676153e2b0c9095100fe7f25a778bf45608eeb32c6048cf307f579649bcc30353277b3b898a3792602c65764e5baa4f643714dfbdfd64ea271d210c7a425fe - languageName: node - linkType: hard - -"glob@npm:~11.0.2": +"glob@npm:^11.0.2, glob@npm:~11.0.2": version: 11.0.2 resolution: "glob@npm:11.0.2" dependencies: @@ -11494,6 +11684,20 @@ __metadata: languageName: node linkType: hard +"glob@npm:^7.0.3, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6": + version: 7.2.3 + resolution: "glob@npm:7.2.3" + dependencies: + fs.realpath: "npm:^1.0.0" + inflight: "npm:^1.0.4" + inherits: "npm:2" + minimatch: "npm:^3.1.1" + once: "npm:^1.3.0" + path-is-absolute: "npm:^1.0.0" + checksum: 10c0/65676153e2b0c9095100fe7f25a778bf45608eeb32c6048cf307f579649bcc30353277b3b898a3792602c65764e5baa4f643714dfbdfd64ea271d210c7a425fe + languageName: node + linkType: hard + "global-directory@npm:^4.0.1": version: 4.0.1 resolution: "global-directory@npm:4.0.1" @@ -12177,7 +12381,7 @@ __metadata: languageName: node linkType: hard -"inquirer@npm:^9.2.10, inquirer@npm:^9.2.23": +"inquirer@npm:^9.2.10": version: 9.3.7 resolution: "inquirer@npm:9.3.7" dependencies: @@ -12197,6 +12401,29 @@ __metadata: languageName: node linkType: hard +"inquirer@npm:^9.2.23": + version: 9.2.23 + resolution: "inquirer@npm:9.2.23" + dependencies: + "@inquirer/figures": "npm:^1.0.3" + "@ljharb/through": "npm:^2.3.13" + ansi-escapes: "npm:^4.3.2" + chalk: "npm:^5.3.0" + cli-cursor: "npm:^3.1.0" + cli-width: "npm:^4.1.0" + external-editor: "npm:^3.1.0" + lodash: "npm:^4.17.21" + mute-stream: "npm:1.0.0" + ora: "npm:^5.4.1" + run-async: "npm:^3.0.0" + rxjs: "npm:^7.8.1" + string-width: "npm:^4.2.3" + strip-ansi: "npm:^6.0.1" + wrap-ansi: "npm:^6.2.0" + checksum: 10c0/6adf3a6a9c666ff2baf3e8aef841f3ae266506cf0256ef445de5ec9a456aec8d6ff38180cc436ad3f9045cbb018d11dca98ed3570c28fbf8a857f1e4712eddc7 + languageName: node + linkType: hard + "internal-slot@npm:^1.1.0": version: 1.1.0 resolution: "internal-slot@npm:1.1.0" @@ -13623,6 +13850,13 @@ __metadata: languageName: node linkType: hard +"json-parse-even-better-errors@npm:^4.0.0": + version: 4.0.0 + resolution: "json-parse-even-better-errors@npm:4.0.0" + checksum: 10c0/84cd9304a97e8fb2af3937bf53acb91c026aeb859703c332684e688ea60db27fc2242aa532a84e1883fdcbe1e5c1fb57c2bef38e312021aa1cd300defc63cf16 + languageName: node + linkType: hard + "json-schema-traverse@npm:^0.3.0": version: 0.3.1 resolution: "json-schema-traverse@npm:0.3.1" @@ -14632,6 +14866,13 @@ __metadata: languageName: node linkType: hard +"memorystream@npm:^0.3.1": + version: 0.3.1 + resolution: "memorystream@npm:0.3.1" + checksum: 10c0/4bd164657711d9747ff5edb0508b2944414da3464b7fe21ac5c67cf35bba975c4b446a0124bd0f9a8be54cfc18faf92e92bd77563a20328b1ccf2ff04e9f39b9 + languageName: node + linkType: hard + "meow@npm:^12.0.1": version: 12.1.1 resolution: "meow@npm:12.1.1" @@ -15370,7 +15611,7 @@ __metadata: languageName: node linkType: hard -"node-gyp@npm:^11.0.0, node-gyp@npm:latest": +"node-gyp@npm:^11.0.0": version: 11.2.0 resolution: "node-gyp@npm:11.2.0" dependencies: @@ -15390,6 +15631,26 @@ __metadata: languageName: node linkType: hard +"node-gyp@npm:latest": + version: 11.1.0 + resolution: "node-gyp@npm:11.1.0" + dependencies: + env-paths: "npm:^2.2.0" + exponential-backoff: "npm:^3.1.1" + glob: "npm:^10.3.10" + graceful-fs: "npm:^4.2.6" + make-fetch-happen: "npm:^14.0.3" + nopt: "npm:^8.0.0" + proc-log: "npm:^5.0.0" + semver: "npm:^7.3.5" + tar: "npm:^7.4.3" + which: "npm:^5.0.0" + bin: + node-gyp: bin/node-gyp.js + checksum: 10c0/c38977ce502f1ea41ba2b8721bd5b49bc3d5b3f813eabfac8414082faf0620ccb5211e15c4daecc23ed9f5e3e9cc4da00e575a0bcfc2a95a069294f2afa1e0cd + languageName: node + linkType: hard + "node-int64@npm:^0.4.0": version: 0.4.0 resolution: "node-int64@npm:0.4.0" @@ -15491,6 +15752,13 @@ __metadata: languageName: node linkType: hard +"npm-normalize-package-bin@npm:^4.0.0": + version: 4.0.0 + resolution: "npm-normalize-package-bin@npm:4.0.0" + checksum: 10c0/1fa546fcae8eaab61ef9b9ec237b6c795008da50e1883eae030e9e38bb04ffa32c5aabcef9a0400eae3dc1f91809bcfa85e437ce80d677c69b419d1d9cacf0ab + languageName: node + linkType: hard + "npm-package-arg@npm:^12.0.0": version: 12.0.0 resolution: "npm-package-arg@npm:12.0.0" @@ -15519,6 +15787,27 @@ __metadata: languageName: node linkType: hard +"npm-run-all2@npm:^8.0.2": + version: 8.0.2 + resolution: "npm-run-all2@npm:8.0.2" + dependencies: + ansi-styles: "npm:^6.2.1" + cross-spawn: "npm:^7.0.6" + memorystream: "npm:^0.3.1" + picomatch: "npm:^4.0.2" + pidtree: "npm:^0.6.0" + read-package-json-fast: "npm:^4.0.0" + shell-quote: "npm:^1.7.3" + which: "npm:^5.0.0" + bin: + npm-run-all: bin/npm-run-all/index.js + npm-run-all2: bin/npm-run-all/index.js + run-p: bin/run-p/index.js + run-s: bin/run-s/index.js + checksum: 10c0/f123741fc221bd6b51ec173f1e9345191599f087108d60a10e856e033a97903b0444db8a41af7a9548eeb14c48486ab109d091bc3489b72fae03cf0f014755d4 + languageName: node + linkType: hard + "npm-run-path@npm:^4.0.1": version: 4.0.1 resolution: "npm-run-path@npm:4.0.1" @@ -16535,6 +16824,29 @@ __metadata: languageName: node linkType: hard +"postcss-cli@npm:^11.0.1": + version: 11.0.1 + resolution: "postcss-cli@npm:11.0.1" + dependencies: + chokidar: "npm:^3.3.0" + dependency-graph: "npm:^1.0.0" + fs-extra: "npm:^11.0.0" + picocolors: "npm:^1.0.0" + postcss-load-config: "npm:^5.0.0" + postcss-reporter: "npm:^7.0.0" + pretty-hrtime: "npm:^1.0.3" + read-cache: "npm:^1.0.0" + slash: "npm:^5.0.0" + tinyglobby: "npm:^0.2.12" + yargs: "npm:^17.0.0" + peerDependencies: + postcss: ^8.0.0 + bin: + postcss: index.js + checksum: 10c0/4aa0b517269e27d288cbbcff54f572f95ca45fe082e49b77e9c3c3582ad0312bc65f98d98d3d98d18d8f64c473546277596e85ce6572b4d3e9c3b4ef8a1aff71 + languageName: node + linkType: hard + "postcss-color-functional-notation@npm:^7.0.9": version: 7.0.9 resolution: "postcss-color-functional-notation@npm:7.0.9" @@ -16825,6 +17137,27 @@ __metadata: languageName: node linkType: hard +"postcss-load-config@npm:^5.0.0": + version: 5.1.0 + resolution: "postcss-load-config@npm:5.1.0" + dependencies: + lilconfig: "npm:^3.1.1" + yaml: "npm:^2.4.2" + peerDependencies: + jiti: ">=1.21.0" + postcss: ">=8.0.9" + tsx: ^4.8.1 + peerDependenciesMeta: + jiti: + optional: true + postcss: + optional: true + tsx: + optional: true + checksum: 10c0/1631f2869619387166cf0aa900b5f3f652578862c0abbd8d9e9e1d679929c42720dd65f7ce60ccf930f94d4440ebdc3aa6b69d33e2df82b761a079d8cba87e23 + languageName: node + linkType: hard + "postcss-load-config@npm:^6.0.1": version: 6.0.1 resolution: "postcss-load-config@npm:6.0.1" @@ -17171,7 +17504,7 @@ __metadata: languageName: node linkType: hard -"postcss-preset-env@npm:^10.1.5": +"postcss-preset-env@npm:^10.1.6": version: 10.1.6 resolution: "postcss-preset-env@npm:10.1.6" dependencies: @@ -17307,7 +17640,7 @@ __metadata: languageName: node linkType: hard -"postcss-reporter@npm:^7.1.0": +"postcss-reporter@npm:^7.0.0, postcss-reporter@npm:^7.1.0": version: 7.1.0 resolution: "postcss-reporter@npm:7.1.0" dependencies: @@ -17526,6 +17859,13 @@ __metadata: languageName: node linkType: hard +"pretty-hrtime@npm:^1.0.3": + version: 1.0.3 + resolution: "pretty-hrtime@npm:1.0.3" + checksum: 10c0/67cb3fc283a72252b49ac488647e6a01b78b7aa1b8f2061834aa1650691229081518ef3ca940f77f41cc8a8f02ba9eeb74b843481596670209e493062f2e89e0 + languageName: node + linkType: hard + "pretty-ms@npm:^9.2.0": version: 9.2.0 resolution: "pretty-ms@npm:9.2.0" @@ -17545,9 +17885,9 @@ __metadata: linkType: hard "prismjs@npm:^1.27.0": - version: 1.29.0 - resolution: "prismjs@npm:1.29.0" - checksum: 10c0/d906c4c4d01b446db549b4f57f72d5d7e6ccaca04ecc670fb85cea4d4b1acc1283e945a9cbc3d81819084a699b382f970e02f9d1378e14af9808d366d9ed7ec6 + version: 1.30.0 + resolution: "prismjs@npm:1.30.0" + checksum: 10c0/f56205bfd58ef71ccfcbcb691fd0eb84adc96c6ff21b0b69fc6fdcf02be42d6ef972ba4aed60466310de3d67733f6a746f89f2fb79c00bf217406d465b3e8f23 languageName: node linkType: hard @@ -17753,6 +18093,16 @@ __metadata: languageName: node linkType: hard +"read-package-json-fast@npm:^4.0.0": + version: 4.0.0 + resolution: "read-package-json-fast@npm:4.0.0" + dependencies: + json-parse-even-better-errors: "npm:^4.0.0" + npm-normalize-package-bin: "npm:^4.0.0" + checksum: 10c0/8a03509ae8e852f1abc4b109c1be571dd90ac9ea65d55433b2fe287e409113441a9b00df698288fe48aa786c1a2550569d47b5ab01ed83ada073d691d5aff582 + languageName: node + linkType: hard + "read-yaml-file@npm:^1.1.0": version: 1.1.0 resolution: "read-yaml-file@npm:1.1.0" @@ -18389,7 +18739,7 @@ __metadata: languageName: node linkType: hard -"semver@npm:^7.3.2, semver@npm:^7.3.5, semver@npm:^7.5.3, semver@npm:^7.5.4, semver@npm:^7.6.0, semver@npm:^7.6.2, semver@npm:^7.7.1": +"semver@npm:^7.3.2, semver@npm:^7.3.5, semver@npm:^7.5.3, semver@npm:^7.5.4, semver@npm:^7.6.0, semver@npm:^7.6.2, semver@npm:^7.7.2": version: 7.7.2 resolution: "semver@npm:7.7.2" bin: @@ -18478,7 +18828,7 @@ __metadata: languageName: node linkType: hard -"shell-quote@npm:^1.4.1": +"shell-quote@npm:^1.4.1, shell-quote@npm:^1.7.3": version: 1.8.2 resolution: "shell-quote@npm:1.8.2" checksum: 10c0/85fdd44f2ad76e723d34eb72c753f04d847ab64e9f1f10677e3f518d0e5b0752a176fd805297b30bb8c3a1556ebe6e77d2288dbd7b7b0110c7e941e9e9c20ce1 @@ -19082,7 +19432,7 @@ __metadata: languageName: node linkType: hard -"style-dictionary@npm:^4.3.3": +"style-dictionary@npm:^4.4.0": version: 4.4.0 resolution: "style-dictionary@npm:4.4.0" dependencies: @@ -19194,7 +19544,7 @@ __metadata: languageName: node linkType: hard -"stylelint@npm:^16.18.0": +"stylelint@npm:^16.19.1": version: 16.19.1 resolution: "stylelint@npm:16.19.1" dependencies: @@ -20739,6 +21089,15 @@ __metadata: languageName: node linkType: hard +"yaml@npm:^2.4.2": + version: 2.7.1 + resolution: "yaml@npm:2.7.1" + bin: + yaml: bin.mjs + checksum: 10c0/ee2126398ab7d1fdde566b4013b68e36930b9e6d8e68b6db356875c99614c10d678b6f45597a145ff6d63814961221fc305bf9242af8bf7450177f8a68537590 + languageName: node + linkType: hard + "yaml@npm:^2.6.0, yaml@npm:^2.7.1": version: 2.8.0 resolution: "yaml@npm:2.8.0"