From 8d516dbdc0942b801efaaf5710a34daeae012b5a Mon Sep 17 00:00:00 2001 From: "[ Cassondra ]" Date: Wed, 15 Jan 2025 09:57:02 -0500 Subject: [PATCH] chore: add jsdoc to tasks/css-tools.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Rúben Carvalho --- packages/thumbnail/package.json | 2 +- packages/thumbnail/src/spectrum-thumbnail.css | 275 +++++++++--------- .../thumbnail/src/thumbnail-overrides.css | 83 ------ tasks/css-tools.js | 8 + .../styles/tokens-v2/system-theme-bridge.css | 38 --- .../tokens/express/system-theme-bridge.css | 38 --- .../tokens/spectrum/system-theme-bridge.css | 38 --- yarn.lock | 10 +- 8 files changed, 159 insertions(+), 333 deletions(-) diff --git a/packages/thumbnail/package.json b/packages/thumbnail/package.json index e943513299..fa194be1e9 100644 --- a/packages/thumbnail/package.json +++ b/packages/thumbnail/package.json @@ -62,7 +62,7 @@ "@spectrum-web-components/opacity-checkerboard": "^1.0.1" }, "devDependencies": { - "@spectrum-css/thumbnail": "7.0.0-s2-foundations.17" + "@spectrum-css/thumbnail": "7.0.0-s2-foundations.18" }, "types": "./src/index.d.ts", "customElements": "custom-elements.json", diff --git a/packages/thumbnail/src/spectrum-thumbnail.css b/packages/thumbnail/src/spectrum-thumbnail.css index b080b33de2..f7723b6891 100644 --- a/packages/thumbnail/src/spectrum-thumbnail.css +++ b/packages/thumbnail/src/spectrum-thumbnail.css @@ -11,9 +11,125 @@ governing permissions and limitations under the License. */ /* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */ +:host, +:host([size='500']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-500); +} + +:host([size='50']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-50); +} + +:host([size='75']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-75); +} + +:host([size='100']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-100); +} + +:host([size='200']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-200); +} + +:host([size='300']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-300); +} + +:host([size='400']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-400); +} + +:host([size='600']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-600); +} + +:host([size='700']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-700); +} + +:host([size='800']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-800); +} + +:host([size='900']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-900); +} + +:host([size='1000']) { + --spectrum-thumbnail-sized-size: var(--spectrum-thumbnail-size-1000); +} + :host { - inline-size: var(--mod-thumbnail-size, var(--spectrum-thumbnail-size)); - block-size: var(--mod-thumbnail-size, var(--spectrum-thumbnail-size)); + --spectrum-thumbnail-size: var( + --mod-thumbnail-size, + var(--spectrum-thumbnail-sized-size) + ); + --spectrum-thumbnail-border-color: var( + --highcontrast-thumbnail-border-color, + var( + --mod-thumbnail-border-color, + rgba( + var(--spectrum-gray-800-rgb), + var(--spectrum-thumbnail-border-opacity) + ) + ) + ); + --spectrum-thumbnail-border-color-selected: var( + --highcontrast-thumbnail-border-color-selected, + var( + --mod-thumbnail-border-color-selected, + var(--spectrum-accent-color-800) + ) + ); + --spectrum-thumbnail-border-width: var( + --mod-thumbnail-border-width, + var(--spectrum-border-width-100) + ); + --spectrum-thumbnail-border-width-selected: var( + --mod-thumbnail-border-width-selected, + var(--spectrum-border-width-200) + ); + --spectrum-thumbnail-border-radius-default: var( + --mod-thumbnail-border-radius, + var(--spectrum-thumbnail-border-radius) + ); + --spectrum-thumbnail-layer-border-color-inner: var( + --highcontrast-thumbnail-layer-border-color-inner, + var(--mod-thumbnail-layer-border-color-inner, var(--spectrum-white)) + ); + --spectrum-thumbnail-layer-border-color-outer: var( + --highcontrast-thumbnail-layer-border-color-outer, + var(--mod-thumbnail-layer-border-color-outer, var(--spectrum-gray-500)) + ); + --spectrum-thumbnail-layer-border-width-inner: var( + --mod-thumbnail-layer-border-width-inner, + var(--spectrum-border-width-400) + ); + --spectrum-thumbnail-layer-border-width-outer: var( + --mod-thumbnail-layer-border-width-outer, + var(--spectrum-border-width-100) + ); + --spectrum-thumbnail-focus-indicator-thickness: var( + --mod-thumbnail-focus-indicator-thickness, + var(--spectrum-focus-indicator-thickness) + ); + --spectrum-thumbnail-focus-indicator-gap: var( + --mod-thumbnail-focus-indicator-gap, + var(--spectrum-focus-indicator-gap) + ); + --spectrum-thumbnail-focus-indicator-color: var( + --highcontrast-thumbnail-focus-indicator-color, + var( + --mod-thumbnail-focus-indicator-color, + var(--spectrum-focus-indicator-color) + ) + ); + --spectrum-thumbnail-color-opacity-disabled: var( + --spectrum-thumbnail-opacity-disabled + ); + inline-size: var(--spectrum-thumbnail-size); + block-size: var(--spectrum-thumbnail-size); z-index: 0; margin: 0; padding: 0; @@ -24,10 +140,7 @@ governing permissions and limitations under the License. :host, :host:before { - border-radius: var( - --mod-thumbnail-border-radius, - var(--spectrum-thumbnail-border-radius) - ); + border-radius: var(--spectrum-thumbnail-border-radius-default); } :host:before { @@ -35,18 +148,8 @@ governing permissions and limitations under the License. z-index: 2; inline-size: 100%; block-size: 100%; - box-shadow: inset 0 0 0 - var( - --mod-thumbnail-border-width, - var(--spectrum-thumbnail-border-width) - ) - var( - --highcontrast-thumbnail-border-color, - var( - --mod-thumbnail-border-color, - var(--spectrum-thumbnail-border-color-rgba) - ) - ); + box-shadow: inset 0 0 0 var(--spectrum-thumbnail-border-width) + var(--spectrum-thumbnail-border-color); position: absolute; } @@ -64,93 +167,45 @@ governing permissions and limitations under the License. :host([focused]):after { content: ''; border-style: solid; - border-width: var( - --mod-thumbnail-focus-indicator-thickness, - var(--spectrum-thumbnail-focus-indicator-thickness) - ); - border-color: var( - --highcontrast-thumbnail-focus-indicator-color, - var( - --mod-thumbnail-focus-indicator-color, - var(--spectrum-thumbnail-focus-indicator-color) - ) - ); - border-radius: var( - --mod-thumbnail-border-radius, - var(--spectrum-thumbnail-border-radius) - ); + border-width: var(--spectrum-thumbnail-focus-indicator-thickness); + border-color: var(--spectrum-thumbnail-focus-indicator-color); + border-radius: var(--spectrum-thumbnail-border-radius-default); position: absolute; inset-block-start: calc( ( - var( - --mod-thumbnail-focus-indicator-gap, - var(--spectrum-thumbnail-focus-indicator-gap) - ) + - var( - --mod-thumbnail-focus-indicator-thickness, - var(--spectrum-thumbnail-focus-indicator-thickness) - ) + var(--spectrum-thumbnail-focus-indicator-gap) + + var(--spectrum-thumbnail-focus-indicator-thickness) ) * -1 ); inset-block-end: calc( ( - var( - --mod-thumbnail-focus-indicator-gap, - var(--spectrum-thumbnail-focus-indicator-gap) - ) + - var( - --mod-thumbnail-focus-indicator-thickness, - var(--spectrum-thumbnail-focus-indicator-thickness) - ) + var(--spectrum-thumbnail-focus-indicator-gap) + + var(--spectrum-thumbnail-focus-indicator-thickness) ) * -1 ); inset-inline-start: calc( ( - var( - --mod-thumbnail-focus-indicator-gap, - var(--spectrum-thumbnail-focus-indicator-gap) - ) + - var( - --mod-thumbnail-focus-indicator-thickness, - var(--spectrum-thumbnail-focus-indicator-thickness) - ) + var(--spectrum-thumbnail-focus-indicator-gap) + + var(--spectrum-thumbnail-focus-indicator-thickness) ) * -1 ); inset-inline-end: calc( ( - var( - --mod-thumbnail-focus-indicator-gap, - var(--spectrum-thumbnail-focus-indicator-gap) - ) + - var( - --mod-thumbnail-focus-indicator-thickness, - var(--spectrum-thumbnail-focus-indicator-thickness) - ) + var(--spectrum-thumbnail-focus-indicator-gap) + + var(--spectrum-thumbnail-focus-indicator-thickness) ) * -1 ); } :host([focused]) .image-wrapper { - border-radius: var( - --mod-thumbnail-border-radius, - var(--spectrum-thumbnail-border-radius) - ); + border-radius: var(--spectrum-thumbnail-border-radius-default); overflow: hidden; } :host([layer]) { border-style: solid; - border-width: var( - --mod-thumbnail-layer-border-width-outer, - var(--spectrum-thumbnail-layer-border-width-outer) - ); - border-color: var( - --highcontrast-thumbnail-layer-border-color-outer, - var( - --mod-thumbnail-layer-border-color-outer, - var(--spectrum-thumbnail-layer-border-color-outer) - ) - ); + border-width: var(--spectrum-thumbnail-layer-border-width-outer); + border-color: var(--spectrum-thumbnail-layer-border-color-outer); box-sizing: border-box; justify-content: center; align-items: center; @@ -163,65 +218,28 @@ governing permissions and limitations under the License. :host([layer][selected]) { outline-style: solid; - outline-color: var( - --highcontrast-thumbnail-border-color-selected, - var( - --mod-thumbnail-border-color-selected, - var(--spectrum-thumbnail-border-color-selected) - ) - ); - outline-width: var( - --mod-thumbnail-border-width-selected, - var(--spectrum-thumbnail-border-width-selected) - ); + outline-color: var(--spectrum-thumbnail-border-color-selected); + outline-width: var(--spectrum-thumbnail-border-width-selected); outline-offset: calc( - var( - --mod-thumbnail-border-width-selected, - var(--spectrum-thumbnail-border-width-selected) - ) - - var( - --mod-thumbnail-layer-border-width-inner, - var(--spectrum-thumbnail-layer-border-width-inner) - ) + var(--spectrum-thumbnail-border-width-selected) - + var(--spectrum-thumbnail-layer-border-width-inner) ); } .layer-inner { inline-size: calc( var(--spectrum-thumbnail-size) - - ( - var( - --mod-thumbnail-layer-border-width-inner, - var(--spectrum-thumbnail-layer-border-width-inner) - ) - ) * 2 + var(--spectrum-thumbnail-layer-border-width-inner) * 2 ); block-size: calc( var(--spectrum-thumbnail-size) - - ( - var( - --mod-thumbnail-layer-border-width-inner, - var(--spectrum-thumbnail-layer-border-width-inner) - ) - ) * 2 + var(--spectrum-thumbnail-layer-border-width-inner) * 2 ); outline-style: solid; - outline-color: var( - --highcontrast-thumbnail-layer-border-color-inner, - var( - --mod-thumbnail-layer-border-color-inner, - var(--spectrum-thumbnail-layer-border-color-inner) - ) - ); + outline-color: var(--spectrum-thumbnail-layer-border-color-inner); outline-width: calc( - var( - --mod-thumbnail-layer-border-width-inner, - var(--spectrum-thumbnail-layer-border-width-inner) - ) - - var( - --mod-thumbnail-layer-border-width-outer, - var(--spectrum-thumbnail-layer-border-width-outer) - ) + var(--spectrum-thumbnail-layer-border-width-inner) - + var(--spectrum-thumbnail-layer-border-width-outer) ); justify-content: center; align-items: center; @@ -254,10 +272,7 @@ governing permissions and limitations under the License. z-index: 0; block-size: 100%; inline-size: 100%; - border-radius: var( - --mod-thumbnail-border-radius, - var(--spectrum-thumbnail-border-radius) - ); + border-radius: var(--spectrum-thumbnail-border-radius-default); background-position: 50%; background-size: cover; position: absolute; diff --git a/packages/thumbnail/src/thumbnail-overrides.css b/packages/thumbnail/src/thumbnail-overrides.css index 1d05cad22d..ef0b80a2f3 100644 --- a/packages/thumbnail/src/thumbnail-overrides.css +++ b/packages/thumbnail/src/thumbnail-overrides.css @@ -12,88 +12,5 @@ /* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */ :host { - --spectrum-thumbnail-size: var(--system-thumbnail-size); --spectrum-thumbnail-border-radius: var(--system-thumbnail-border-radius); - --spectrum-thumbnail-border-width: var(--system-thumbnail-border-width); - --spectrum-thumbnail-border-color-rgba: var( - --system-thumbnail-border-color-rgba - ); - --spectrum-thumbnail-layer-border-width-inner: var( - --system-thumbnail-layer-border-width-inner - ); - --spectrum-thumbnail-layer-border-color-inner: var( - --system-thumbnail-layer-border-color-inner - ); - --spectrum-thumbnail-layer-border-width-outer: var( - --system-thumbnail-layer-border-width-outer - ); - --spectrum-thumbnail-layer-border-color-outer: var( - --system-thumbnail-layer-border-color-outer - ); - --spectrum-thumbnail-border-width-selected: var( - --system-thumbnail-border-width-selected - ); - --spectrum-thumbnail-border-color-selected: var( - --system-thumbnail-border-color-selected - ); - --spectrum-thumbnail-focus-indicator-thickness: var( - --system-thumbnail-focus-indicator-thickness - ); - --spectrum-thumbnail-focus-indicator-gap: var( - --system-thumbnail-focus-indicator-gap - ); - --spectrum-thumbnail-focus-indicator-color: var( - --system-thumbnail-focus-indicator-color - ); - --spectrum-thumbnail-color-opacity-disabled: var( - --system-thumbnail-color-opacity-disabled - ); -} - -:host([size='50']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-50-size); -} - -:host([size='75']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-75-size); -} - -:host([size='100']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-100-size); -} - -:host([size='200']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-200-size); -} - -:host([size='300']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-300-size); -} - -:host([size='400']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-400-size); -} - -:host([size='500']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-500-size); -} - -:host([size='600']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-600-size); -} - -:host([size='700']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-700-size); -} - -:host([size='800']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-800-size); -} - -:host([size='900']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-900-size); -} - -:host([size='1000']) { - --spectrum-thumbnail-size: var(--system-thumbnail-size-1000-size); } diff --git a/tasks/css-tools.js b/tasks/css-tools.js index 33a6a40895..336111b6fd 100644 --- a/tasks/css-tools.js +++ b/tasks/css-tools.js @@ -63,6 +63,14 @@ if (fs.existsSync(licensePath)) { header = header.replace('<%= YEAR %>', new Date().getFullYear()); } +/** + * Processes a CSS file using lightningcss, minifies it, and outputs a TypeScript module. + * The output module includes license headers and wraps the CSS in a template literal. + * + * @param {string} cssPath - Path to the CSS file to process + * @returns {Promise} A promise that resolves when processing is complete + * + */ export const processCSS = async (cssPath) => { return bundleAsync({ filename: cssPath, diff --git a/tools/styles/tokens-v2/system-theme-bridge.css b/tools/styles/tokens-v2/system-theme-bridge.css index fa75b4aeaa..c894586955 100644 --- a/tools/styles/tokens-v2/system-theme-bridge.css +++ b/tools/styles/tokens-v2/system-theme-bridge.css @@ -6723,45 +6723,7 @@ --system-textfield-size-xl-text-area-min-block-size-quiet: var( --spectrum-component-height-300 ); - --system-thumbnail-size: var(--spectrum-thumbnail-size-500); --system-thumbnail-border-radius: 2px; - --system-thumbnail-border-width: var(--spectrum-border-width-100); - --system-thumbnail-border-color-rgba: rgba( - var(--spectrum-gray-800-rgb), - var(--spectrum-thumbnail-border-opacity) - ); - --system-thumbnail-layer-border-width-inner: var( - --spectrum-border-width-400 - ); - --system-thumbnail-layer-border-color-inner: var(--spectrum-white); - --system-thumbnail-layer-border-width-outer: var( - --spectrum-border-width-100 - ); - --system-thumbnail-layer-border-color-outer: var(--spectrum-gray-500); - --system-thumbnail-border-width-selected: var(--spectrum-border-width-200); - --system-thumbnail-border-color-selected: var(--spectrum-accent-color-800); - --system-thumbnail-focus-indicator-thickness: var( - --spectrum-focus-indicator-thickness - ); - --system-thumbnail-focus-indicator-gap: var(--spectrum-focus-indicator-gap); - --system-thumbnail-focus-indicator-color: var( - --spectrum-focus-indicator-color - ); - --system-thumbnail-color-opacity-disabled: var( - --spectrum-thumbnail-opacity-disabled - ); - --system-thumbnail-size-50-size: var(--spectrum-thumbnail-size-50); - --system-thumbnail-size-75-size: var(--spectrum-thumbnail-size-75); - --system-thumbnail-size-100-size: var(--spectrum-thumbnail-size-100); - --system-thumbnail-size-200-size: var(--spectrum-thumbnail-size-200); - --system-thumbnail-size-300-size: var(--spectrum-thumbnail-size-300); - --system-thumbnail-size-400-size: var(--spectrum-thumbnail-size-400); - --system-thumbnail-size-500-size: var(--spectrum-thumbnail-size-500); - --system-thumbnail-size-600-size: var(--spectrum-thumbnail-size-600); - --system-thumbnail-size-700-size: var(--spectrum-thumbnail-size-700); - --system-thumbnail-size-800-size: var(--spectrum-thumbnail-size-800); - --system-thumbnail-size-900-size: var(--spectrum-thumbnail-size-900); - --system-thumbnail-size-1000-size: var(--spectrum-thumbnail-size-1000); --system-toast-background-color-default: var( --spectrum-neutral-subdued-background-color-default ); diff --git a/tools/styles/tokens/express/system-theme-bridge.css b/tools/styles/tokens/express/system-theme-bridge.css index af1303b90e..f968128044 100644 --- a/tools/styles/tokens/express/system-theme-bridge.css +++ b/tools/styles/tokens/express/system-theme-bridge.css @@ -6719,45 +6719,7 @@ --system-textfield-size-xl-text-area-min-block-size-quiet: var( --spectrum-component-height-300 ); - --system-thumbnail-size: var(--spectrum-thumbnail-size-500); --system-thumbnail-border-radius: var(--spectrum-corner-radius-75); - --system-thumbnail-border-width: var(--spectrum-border-width-100); - --system-thumbnail-border-color-rgba: rgba( - var(--spectrum-gray-800-rgb), - var(--spectrum-thumbnail-border-opacity) - ); - --system-thumbnail-layer-border-width-inner: var( - --spectrum-border-width-400 - ); - --system-thumbnail-layer-border-color-inner: var(--spectrum-white); - --system-thumbnail-layer-border-width-outer: var( - --spectrum-border-width-100 - ); - --system-thumbnail-layer-border-color-outer: var(--spectrum-gray-500); - --system-thumbnail-border-width-selected: var(--spectrum-border-width-200); - --system-thumbnail-border-color-selected: var(--spectrum-accent-color-800); - --system-thumbnail-focus-indicator-thickness: var( - --spectrum-focus-indicator-thickness - ); - --system-thumbnail-focus-indicator-gap: var(--spectrum-focus-indicator-gap); - --system-thumbnail-focus-indicator-color: var( - --spectrum-focus-indicator-color - ); - --system-thumbnail-color-opacity-disabled: var( - --spectrum-thumbnail-opacity-disabled - ); - --system-thumbnail-size-50-size: var(--spectrum-thumbnail-size-50); - --system-thumbnail-size-75-size: var(--spectrum-thumbnail-size-75); - --system-thumbnail-size-100-size: var(--spectrum-thumbnail-size-100); - --system-thumbnail-size-200-size: var(--spectrum-thumbnail-size-200); - --system-thumbnail-size-300-size: var(--spectrum-thumbnail-size-300); - --system-thumbnail-size-400-size: var(--spectrum-thumbnail-size-400); - --system-thumbnail-size-500-size: var(--spectrum-thumbnail-size-500); - --system-thumbnail-size-600-size: var(--spectrum-thumbnail-size-600); - --system-thumbnail-size-700-size: var(--spectrum-thumbnail-size-700); - --system-thumbnail-size-800-size: var(--spectrum-thumbnail-size-800); - --system-thumbnail-size-900-size: var(--spectrum-thumbnail-size-900); - --system-thumbnail-size-1000-size: var(--spectrum-thumbnail-size-1000); --system-toast-background-color-default: var( --spectrum-neutral-background-color-default ); diff --git a/tools/styles/tokens/spectrum/system-theme-bridge.css b/tools/styles/tokens/spectrum/system-theme-bridge.css index 0ca0482d35..97a0203922 100644 --- a/tools/styles/tokens/spectrum/system-theme-bridge.css +++ b/tools/styles/tokens/spectrum/system-theme-bridge.css @@ -6725,45 +6725,7 @@ --system-textfield-size-xl-text-area-min-block-size-quiet: var( --spectrum-component-height-300 ); - --system-thumbnail-size: var(--spectrum-thumbnail-size-500); --system-thumbnail-border-radius: var(--spectrum-corner-radius-75); - --system-thumbnail-border-width: var(--spectrum-border-width-100); - --system-thumbnail-border-color-rgba: rgba( - var(--spectrum-gray-800-rgb), - var(--spectrum-thumbnail-border-opacity) - ); - --system-thumbnail-layer-border-width-inner: var( - --spectrum-border-width-400 - ); - --system-thumbnail-layer-border-color-inner: var(--spectrum-white); - --system-thumbnail-layer-border-width-outer: var( - --spectrum-border-width-100 - ); - --system-thumbnail-layer-border-color-outer: var(--spectrum-gray-500); - --system-thumbnail-border-width-selected: var(--spectrum-border-width-200); - --system-thumbnail-border-color-selected: var(--spectrum-accent-color-800); - --system-thumbnail-focus-indicator-thickness: var( - --spectrum-focus-indicator-thickness - ); - --system-thumbnail-focus-indicator-gap: var(--spectrum-focus-indicator-gap); - --system-thumbnail-focus-indicator-color: var( - --spectrum-focus-indicator-color - ); - --system-thumbnail-color-opacity-disabled: var( - --spectrum-thumbnail-opacity-disabled - ); - --system-thumbnail-size-50-size: var(--spectrum-thumbnail-size-50); - --system-thumbnail-size-75-size: var(--spectrum-thumbnail-size-75); - --system-thumbnail-size-100-size: var(--spectrum-thumbnail-size-100); - --system-thumbnail-size-200-size: var(--spectrum-thumbnail-size-200); - --system-thumbnail-size-300-size: var(--spectrum-thumbnail-size-300); - --system-thumbnail-size-400-size: var(--spectrum-thumbnail-size-400); - --system-thumbnail-size-500-size: var(--spectrum-thumbnail-size-500); - --system-thumbnail-size-600-size: var(--spectrum-thumbnail-size-600); - --system-thumbnail-size-700-size: var(--spectrum-thumbnail-size-700); - --system-thumbnail-size-800-size: var(--spectrum-thumbnail-size-800); - --system-thumbnail-size-900-size: var(--spectrum-thumbnail-size-900); - --system-thumbnail-size-1000-size: var(--spectrum-thumbnail-size-1000); --system-toast-background-color-default: var( --spectrum-neutral-subdued-background-color-default ); diff --git a/yarn.lock b/yarn.lock index 1aa9ab6870..d80a2aa7ff 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8117,13 +8117,13 @@ __metadata: languageName: node linkType: hard -"@spectrum-css/thumbnail@npm:7.0.0-s2-foundations.17": - version: 7.0.0-s2-foundations.17 - resolution: "@spectrum-css/thumbnail@npm:7.0.0-s2-foundations.17" +"@spectrum-css/thumbnail@npm:7.0.0-s2-foundations.18": + version: 7.0.0-s2-foundations.18 + resolution: "@spectrum-css/thumbnail@npm:7.0.0-s2-foundations.18" peerDependencies: "@spectrum-css/opacitycheckerboard": ">=2" "@spectrum-css/tokens": ">=14" - checksum: 10c0/fd8b82fbd72e38ed76d4d7028b46630d21e8ca359616e55c5788d1bc602c66678b3c069693fc8255e5d85faaa92ad07d68eac15aa548fb378c40170fa2e5d434 + checksum: 10c0/b20a00f987dec6d8abcd9229b3aeaf596aa838ff5926e1a79ef3f41367477f36f3c6a52cfd1f79f8482c63cc35c25340dd95b85218987a326121a204e078b86b languageName: node linkType: hard @@ -9224,7 +9224,7 @@ __metadata: version: 0.0.0-use.local resolution: "@spectrum-web-components/thumbnail@workspace:packages/thumbnail" dependencies: - "@spectrum-css/thumbnail": "npm:7.0.0-s2-foundations.17" + "@spectrum-css/thumbnail": "npm:7.0.0-s2-foundations.18" "@spectrum-web-components/base": "npm:^1.0.1" "@spectrum-web-components/opacity-checkerboard": "npm:^1.0.1" languageName: unknown