From 87d240ec4a56542a9a859372fa98754009ee93ef Mon Sep 17 00:00:00 2001 From: malangcat Date: Mon, 13 Jan 2025 22:29:14 +0900 Subject: [PATCH] feat: update color token naming --- docs/public/rootage/color.json | 10 +--- .../rootage/components/action-button.json | 6 +- docs/public/rootage/components/badge.json | 2 +- docs/public/rootage/components/chip-tab.json | 4 +- .../rootage/components/extended-fab.json | 4 +- docs/public/rootage/parsed.json | 55 ++++--------------- packages/rootage/color.yaml | 8 +-- .../rootage/components/action-button.yaml | 6 +- packages/rootage/components/badge.yaml | 2 +- packages/rootage/components/chip-tab.yaml | 4 +- packages/rootage/components/extended-fab.yaml | 4 +- packages/rootage/components/schema.json | 5 +- packages/stylesheet/actionButton.css | 6 +- packages/stylesheet/badge.css | 2 +- packages/stylesheet/chipTab.css | 4 +- packages/stylesheet/extendedFab.css | 4 +- packages/stylesheet/token.css | 10 ++-- packages/vars/lib/color/bg.d.ts | 5 +- packages/vars/lib/color/bg.mjs | 5 +- .../vars/lib/component/action-button.d.ts | 6 +- packages/vars/lib/component/action-button.mjs | 6 +- packages/vars/lib/component/badge.d.ts | 2 +- packages/vars/lib/component/badge.mjs | 2 +- packages/vars/lib/component/chip-tab.d.ts | 4 +- packages/vars/lib/component/chip-tab.mjs | 4 +- packages/vars/lib/component/extended-fab.d.ts | 4 +- packages/vars/lib/component/extended-fab.mjs | 4 +- 27 files changed, 64 insertions(+), 114 deletions(-) diff --git a/docs/public/rootage/color.json b/docs/public/rootage/color.json index c48fbc413..80524ffd7 100644 --- a/docs/public/rootage/color.json +++ b/docs/public/rootage/color.json @@ -673,7 +673,7 @@ "theme-dark": "$color.palette.gray-300" } }, - "$color.bg.neutral-solid": { + "$color.bg.neutral-inverted": { "values": { "theme-light": "$color.palette.slate-900", "theme-dark": "$color.palette.gray-900" @@ -703,12 +703,6 @@ "theme-dark": "$color.palette.static-black-alpha-200" } }, - "$color.bg.text-selection": { - "values": { - "theme-light": "$color.palette.carrot-100", - "theme-dark": "$color.palette.carrot-100" - } - }, "$color.bg.layer-basement": { "values": { "theme-light": "$color.palette.gray-200", @@ -721,7 +715,7 @@ "theme-dark": "$color.palette.gray-100" } }, - "$color.bg.neutral-solid-pressed": { + "$color.bg.neutral-inverted-pressed": { "values": { "theme-light": "$color.palette.gray-800", "theme-dark": "$color.palette.gray-800" diff --git a/docs/public/rootage/components/action-button.json b/docs/public/rootage/components/action-button.json index baa62693e..4972a9144 100644 --- a/docs/public/rootage/components/action-button.json +++ b/docs/public/rootage/components/action-button.json @@ -69,7 +69,7 @@ "variant=neutral solid": { "enabled": { "root": { - "color": "$color.bg.neutral-solid" + "color": "$color.bg.neutral-inverted" }, "label": { "color": "$color.fg.neutral-inverted" @@ -90,7 +90,7 @@ }, "pressed": { "root": { - "color": "$color.bg.neutral-solid-pressed" + "color": "$color.bg.neutral-inverted-pressed" } }, "disabled": { @@ -112,7 +112,7 @@ }, "loading": { "root": { - "color": "$color.bg.neutral-solid-pressed" + "color": "$color.bg.neutral-inverted-pressed" } } }, diff --git a/docs/public/rootage/components/badge.json b/docs/public/rootage/components/badge.json index c76a61a89..c2471fa54 100644 --- a/docs/public/rootage/components/badge.json +++ b/docs/public/rootage/components/badge.json @@ -89,7 +89,7 @@ "tone=neutral, variant=solid": { "enabled": { "root": { - "color": "$color.bg.neutral-solid" + "color": "$color.bg.neutral-inverted" }, "label": { "color": "$color.fg.neutral-inverted" diff --git a/docs/public/rootage/components/chip-tab.json b/docs/public/rootage/components/chip-tab.json index 58f1c273b..4fa2052df 100644 --- a/docs/public/rootage/components/chip-tab.json +++ b/docs/public/rootage/components/chip-tab.json @@ -33,7 +33,7 @@ }, "selected": { "root": { - "color": "$color.bg.neutral-solid" + "color": "$color.bg.neutral-inverted" }, "label": { "color": "$color.fg.neutral-inverted" @@ -41,7 +41,7 @@ }, "selected,pressed": { "root": { - "color": "$color.bg.neutral-solid-pressed" + "color": "$color.bg.neutral-inverted-pressed" } }, "disabled": { diff --git a/docs/public/rootage/components/extended-fab.json b/docs/public/rootage/components/extended-fab.json index 6e87d57d0..c28878347 100644 --- a/docs/public/rootage/components/extended-fab.json +++ b/docs/public/rootage/components/extended-fab.json @@ -27,7 +27,7 @@ "variant=neutral solid": { "enabled": { "root": { - "color": "$color.bg.neutral-solid" + "color": "$color.bg.neutral-inverted" }, "label": { "color": "$color.fg.neutral-inverted" @@ -38,7 +38,7 @@ }, "pressed": { "root": { - "color": "$color.bg.neutral-solid-pressed" + "color": "$color.bg.neutral-inverted-pressed" } } }, diff --git a/docs/public/rootage/parsed.json b/docs/public/rootage/parsed.json index 5d1f4f224..dd2cf4e22 100644 --- a/docs/public/rootage/parsed.json +++ b/docs/public/rootage/parsed.json @@ -3276,7 +3276,7 @@ "color", "bg" ], - "key": "neutral-solid" + "key": "neutral-inverted" }, "values": [ { @@ -3443,41 +3443,6 @@ } ] }, - { - "collection": "color", - "token": { - "type": "token", - "group": [ - "color", - "bg" - ], - "key": "text-selection" - }, - "values": [ - { - "mode": "theme-light", - "value": { - "type": "token", - "group": [ - "color", - "palette" - ], - "key": "carrot-100" - } - }, - { - "mode": "theme-dark", - "value": { - "type": "token", - "group": [ - "color", - "palette" - ], - "key": "carrot-100" - } - } - ] - }, { "collection": "color", "token": { @@ -3556,7 +3521,7 @@ "color", "bg" ], - "key": "neutral-solid-pressed" + "key": "neutral-inverted-pressed" }, "values": [ { @@ -6239,7 +6204,7 @@ "color", "bg" ], - "key": "neutral-solid" + "key": "neutral-inverted" } } ] @@ -6353,7 +6318,7 @@ "color", "bg" ], - "key": "neutral-solid-pressed" + "key": "neutral-inverted-pressed" } } ] @@ -6463,7 +6428,7 @@ "color", "bg" ], - "key": "neutral-solid-pressed" + "key": "neutral-inverted-pressed" } } ] @@ -10645,7 +10610,7 @@ "color", "bg" ], - "key": "neutral-solid" + "key": "neutral-inverted" } } ] @@ -13576,7 +13541,7 @@ "color", "bg" ], - "key": "neutral-solid" + "key": "neutral-inverted" } } ] @@ -13616,7 +13581,7 @@ "color", "bg" ], - "key": "neutral-solid-pressed" + "key": "neutral-inverted-pressed" } } ] @@ -15207,7 +15172,7 @@ "color", "bg" ], - "key": "neutral-solid" + "key": "neutral-inverted" } } ] @@ -15262,7 +15227,7 @@ "color", "bg" ], - "key": "neutral-solid-pressed" + "key": "neutral-inverted-pressed" } } ] diff --git a/packages/rootage/color.yaml b/packages/rootage/color.yaml index 58d83dba2..776acaf1f 100644 --- a/packages/rootage/color.yaml +++ b/packages/rootage/color.yaml @@ -449,7 +449,7 @@ data: values: theme-light: $color.palette.gray-200 theme-dark: $color.palette.gray-300 - $color.bg.neutral-solid: + $color.bg.neutral-inverted: values: theme-light: $color.palette.slate-900 theme-dark: $color.palette.gray-900 @@ -469,10 +469,6 @@ data: values: theme-light: $color.palette.static-black-alpha-200 theme-dark: $color.palette.static-black-alpha-200 - $color.bg.text-selection: - values: - theme-light: $color.palette.carrot-100 - theme-dark: $color.palette.carrot-100 $color.bg.layer-basement: values: theme-light: $color.palette.gray-200 @@ -481,7 +477,7 @@ data: values: theme-light: $color.palette.gray-00 theme-dark: $color.palette.gray-100 - $color.bg.neutral-solid-pressed: + $color.bg.neutral-inverted-pressed: values: theme-light: $color.palette.gray-800 theme-dark: $color.palette.gray-800 diff --git a/packages/rootage/components/action-button.yaml b/packages/rootage/components/action-button.yaml index 787c0d9a7..ea1a1fa09 100644 --- a/packages/rootage/components/action-button.yaml +++ b/packages/rootage/components/action-button.yaml @@ -46,7 +46,7 @@ data: variant=neutral solid: enabled: root: - color: $color.bg.neutral-solid + color: $color.bg.neutral-inverted label: color: $color.fg.neutral-inverted icon: @@ -60,7 +60,7 @@ data: rangeColor: $color.palette.static-white pressed: root: - color: $color.bg.neutral-solid-pressed + color: $color.bg.neutral-inverted-pressed disabled: root: color: $color.bg.disabled @@ -74,7 +74,7 @@ data: color: $color.fg.disabled loading: root: - color: $color.bg.neutral-solid-pressed + color: $color.bg.neutral-inverted-pressed variant=neutral weak: enabled: root: diff --git a/packages/rootage/components/badge.yaml b/packages/rootage/components/badge.yaml index 207b629bf..aab411fd2 100644 --- a/packages/rootage/components/badge.yaml +++ b/packages/rootage/components/badge.yaml @@ -57,7 +57,7 @@ data: tone=neutral, variant=solid: enabled: root: - color: $color.bg.neutral-solid + color: $color.bg.neutral-inverted label: color: $color.fg.neutral-inverted tone=neutral, variant=outlined: diff --git a/packages/rootage/components/chip-tab.yaml b/packages/rootage/components/chip-tab.yaml index 8d8b43a9a..0ae935f5e 100644 --- a/packages/rootage/components/chip-tab.yaml +++ b/packages/rootage/components/chip-tab.yaml @@ -24,12 +24,12 @@ data: color: $color.bg.layer-default-pressed selected: root: - color: $color.bg.neutral-solid + color: $color.bg.neutral-inverted label: color: $color.fg.neutral-inverted selected,pressed: root: - color: $color.bg.neutral-solid-pressed + color: $color.bg.neutral-inverted-pressed disabled: label: color: $color.fg.disabled diff --git a/packages/rootage/components/extended-fab.yaml b/packages/rootage/components/extended-fab.yaml index b808a111d..7fa2473e7 100644 --- a/packages/rootage/components/extended-fab.yaml +++ b/packages/rootage/components/extended-fab.yaml @@ -19,14 +19,14 @@ data: variant=neutral solid: enabled: root: - color: $color.bg.neutral-solid + color: $color.bg.neutral-inverted label: color: $color.fg.neutral-inverted prefixIcon: color: $color.fg.neutral-inverted pressed: root: - color: $color.bg.neutral-solid-pressed + color: $color.bg.neutral-inverted-pressed variant=layer floating: enabled: root: diff --git a/packages/rootage/components/schema.json b/packages/rootage/components/schema.json index 31fd9e9bb..f17e1e559 100644 --- a/packages/rootage/components/schema.json +++ b/packages/rootage/components/schema.json @@ -295,15 +295,14 @@ { "const": "$color.bg.layer-default-pressed", "title": "$color.bg.layer-default-pressed", "description": "theme-light: $color.palette.gray-100\ntheme-dark: $color.palette.gray-200", "markdownDescription": "- theme-light: `$color.palette.gray-100`\n\n- theme-dark: `$color.palette.gray-200`" }, { "const": "$color.bg.layer-fill", "title": "$color.bg.layer-fill", "description": "theme-light: $color.palette.gray-100\ntheme-dark: $color.palette.gray-100", "markdownDescription": "- theme-light: `$color.palette.gray-100`\n\n- theme-dark: `$color.palette.gray-100`" }, { "const": "$color.bg.neutral-weak", "title": "$color.bg.neutral-weak", "description": "theme-light: $color.palette.gray-200\ntheme-dark: $color.palette.gray-300", "markdownDescription": "- theme-light: `$color.palette.gray-200`\n\n- theme-dark: `$color.palette.gray-300`" }, - { "const": "$color.bg.neutral-solid", "title": "$color.bg.neutral-solid", "description": "theme-light: $color.palette.slate-900\ntheme-dark: $color.palette.gray-900", "markdownDescription": "- theme-light: `$color.palette.slate-900`\n\n- theme-dark: `$color.palette.gray-900`" }, + { "const": "$color.bg.neutral-inverted", "title": "$color.bg.neutral-inverted", "description": "theme-light: $color.palette.slate-900\ntheme-dark: $color.palette.gray-900", "markdownDescription": "- theme-light: `$color.palette.slate-900`\n\n- theme-dark: `$color.palette.gray-900`" }, { "const": "$color.bg.neutral-weak-pressed", "title": "$color.bg.neutral-weak-pressed", "description": "theme-light: $color.palette.gray-300\ntheme-dark: $color.palette.gray-400", "markdownDescription": "- theme-light: `$color.palette.gray-300`\n\n- theme-dark: `$color.palette.gray-400`" }, { "const": "$color.bg.informative-weak", "title": "$color.bg.informative-weak", "description": "theme-light: $color.palette.blue-100\ntheme-dark: $color.palette.blue-100", "markdownDescription": "- theme-light: `$color.palette.blue-100`\n\n- theme-dark: `$color.palette.blue-100`" }, { "const": "$color.bg.overlay", "title": "$color.bg.overlay", "description": "theme-light: $color.palette.static-black-alpha-500\ntheme-dark: $color.palette.static-black-alpha-500", "markdownDescription": "- theme-light: `$color.palette.static-black-alpha-500`\n\n- theme-dark: `$color.palette.static-black-alpha-500`" }, { "const": "$color.bg.overlay-muted", "title": "$color.bg.overlay-muted", "description": "theme-light: $color.palette.static-black-alpha-200\ntheme-dark: $color.palette.static-black-alpha-200", "markdownDescription": "- theme-light: `$color.palette.static-black-alpha-200`\n\n- theme-dark: `$color.palette.static-black-alpha-200`" }, - { "const": "$color.bg.text-selection", "title": "$color.bg.text-selection", "description": "theme-light: $color.palette.carrot-100\ntheme-dark: $color.palette.carrot-100", "markdownDescription": "- theme-light: `$color.palette.carrot-100`\n\n- theme-dark: `$color.palette.carrot-100`" }, { "const": "$color.bg.layer-basement", "title": "$color.bg.layer-basement", "description": "theme-light: $color.palette.gray-200\ntheme-dark: $color.palette.gray-100", "markdownDescription": "- theme-light: `$color.palette.gray-200`\n\n- theme-dark: `$color.palette.gray-100`" }, { "const": "$color.bg.layer-floating", "title": "$color.bg.layer-floating", "description": "theme-light: $color.palette.gray-00\ntheme-dark: $color.palette.gray-100", "markdownDescription": "- theme-light: `$color.palette.gray-00`\n\n- theme-dark: `$color.palette.gray-100`" }, - { "const": "$color.bg.neutral-solid-pressed", "title": "$color.bg.neutral-solid-pressed", "description": "theme-light: $color.palette.gray-800\ntheme-dark: $color.palette.gray-800", "markdownDescription": "- theme-light: `$color.palette.gray-800`\n\n- theme-dark: `$color.palette.gray-800`" }, + { "const": "$color.bg.neutral-inverted-pressed", "title": "$color.bg.neutral-inverted-pressed", "description": "theme-light: $color.palette.gray-800\ntheme-dark: $color.palette.gray-800", "markdownDescription": "- theme-light: `$color.palette.gray-800`\n\n- theme-dark: `$color.palette.gray-800`" }, { "const": "$color.bg.disabled", "title": "$color.bg.disabled", "description": "theme-light: $color.palette.gray-200\ntheme-dark: $color.palette.gray-200", "markdownDescription": "- theme-light: `$color.palette.gray-200`\n\n- theme-dark: `$color.palette.gray-200`" }, { "const": "$color.bg.layer-floating-pressed", "title": "$color.bg.layer-floating-pressed", "description": "theme-light: $color.palette.gray-100\ntheme-dark: $color.palette.gray-300", "markdownDescription": "- theme-light: `$color.palette.gray-100`\n\n- theme-dark: `$color.palette.gray-300`" }, { "const": "$color.bg.informative-weak-pressed", "title": "$color.bg.informative-weak-pressed", "description": "theme-light: $color.palette.blue-200\ntheme-dark: $color.palette.blue-200", "markdownDescription": "- theme-light: `$color.palette.blue-200`\n\n- theme-dark: `$color.palette.blue-200`" }, diff --git a/packages/stylesheet/actionButton.css b/packages/stylesheet/actionButton.css index ac4258288..5b2ebc0f5 100644 --- a/packages/stylesheet/actionButton.css +++ b/packages/stylesheet/actionButton.css @@ -99,16 +99,16 @@ --range-color: var(--seed-v3-color-palette-static-white); } .actionButton__root--variant_neutralSolid { - background: var(--seed-v3-color-bg-neutral-solid); + background: var(--seed-v3-color-bg-neutral-inverted); } .actionButton__root--variant_neutralSolid:is(:active, [data-active]) { - background: var(--seed-v3-color-bg-neutral-solid-pressed); + background: var(--seed-v3-color-bg-neutral-inverted-pressed); } .actionButton__root--variant_neutralSolid:is(:disabled, [disabled], [data-disabled]) { background: var(--seed-v3-color-bg-disabled); } .actionButton__root--variant_neutralSolid[data-loading] { - background: var(--seed-v3-color-bg-neutral-solid-pressed); + background: var(--seed-v3-color-bg-neutral-inverted-pressed); } .actionButton__label--variant_neutralSolid { color: var(--seed-v3-color-fg-neutral-inverted); diff --git a/packages/stylesheet/badge.css b/packages/stylesheet/badge.css index 45c2920a2..6f7027de9 100644 --- a/packages/stylesheet/badge.css +++ b/packages/stylesheet/badge.css @@ -56,7 +56,7 @@ color: var(--seed-v3-color-fg-neutral) } .badge__root--tone_neutral-variant_solid { - background-color: var(--seed-v3-color-bg-neutral-solid) + background-color: var(--seed-v3-color-bg-neutral-inverted) } .badge__label--tone_neutral-variant_solid { color: var(--seed-v3-color-fg-neutral-inverted) diff --git a/packages/stylesheet/chipTab.css b/packages/stylesheet/chipTab.css index 453dbc757..cd8abf633 100644 --- a/packages/stylesheet/chipTab.css +++ b/packages/stylesheet/chipTab.css @@ -15,13 +15,13 @@ font-weight: var(--seed-v3-font-weight-bold); } .chipTab__root--variant_neutralSolid:is(:selected, [data-selected]) { - background-color: var(--seed-v3-color-bg-neutral-solid); + background-color: var(--seed-v3-color-bg-neutral-inverted); } .chipTab__root--variant_neutralSolid:is(:active, [data-active]) { background-color: var(--seed-v3-color-bg-layer-default-pressed); } .chipTab__root--variant_neutralSolid:is(:selected, [data-selected]):is(:active, [data-active]) { - background-color: var(--seed-v3-color-bg-neutral-solid-pressed); + background-color: var(--seed-v3-color-bg-neutral-inverted-pressed); } .chipTab__root--variant_neutralSolid:is(:disabled, [disabled], [data-disabled]) { cursor: not-allowed; diff --git a/packages/stylesheet/extendedFab.css b/packages/stylesheet/extendedFab.css index 16b74f01e..684097f48 100644 --- a/packages/stylesheet/extendedFab.css +++ b/packages/stylesheet/extendedFab.css @@ -28,10 +28,10 @@ flex-shrink: 0; } .extendedFab__root--variant_neutralSolid { - background: var(--seed-v3-color-bg-neutral-solid); + background: var(--seed-v3-color-bg-neutral-inverted); } .extendedFab__root--variant_neutralSolid:is(:active, [data-active]) { - background: var(--seed-v3-color-bg-neutral-solid-pressed); + background: var(--seed-v3-color-bg-neutral-inverted-pressed); } .extendedFab__label--variant_neutralSolid { color: var(--seed-v3-color-fg-neutral-inverted); diff --git a/packages/stylesheet/token.css b/packages/stylesheet/token.css index 842bd8aae..ac8ee72ea 100644 --- a/packages/stylesheet/token.css +++ b/packages/stylesheet/token.css @@ -195,15 +195,14 @@ --seed-v3-color-bg-layer-default-pressed: var(--seed-v3-color-palette-gray-100); --seed-v3-color-bg-layer-fill: var(--seed-v3-color-palette-gray-100); --seed-v3-color-bg-neutral-weak: var(--seed-v3-color-palette-gray-200); - --seed-v3-color-bg-neutral-solid: var(--seed-v3-color-palette-slate-900); + --seed-v3-color-bg-neutral-inverted: var(--seed-v3-color-palette-slate-900); --seed-v3-color-bg-neutral-weak-pressed: var(--seed-v3-color-palette-gray-300); --seed-v3-color-bg-informative-weak: var(--seed-v3-color-palette-blue-100); --seed-v3-color-bg-overlay: var(--seed-v3-color-palette-static-black-alpha-500); --seed-v3-color-bg-overlay-muted: var(--seed-v3-color-palette-static-black-alpha-200); - --seed-v3-color-bg-text-selection: var(--seed-v3-color-palette-carrot-100); --seed-v3-color-bg-layer-basement: var(--seed-v3-color-palette-gray-200); --seed-v3-color-bg-layer-floating: var(--seed-v3-color-palette-gray-00); - --seed-v3-color-bg-neutral-solid-pressed: var(--seed-v3-color-palette-gray-800); + --seed-v3-color-bg-neutral-inverted-pressed: var(--seed-v3-color-palette-gray-800); --seed-v3-color-bg-disabled: var(--seed-v3-color-palette-gray-200); --seed-v3-color-bg-layer-floating-pressed: var(--seed-v3-color-palette-gray-100); --seed-v3-color-bg-informative-weak-pressed: var(--seed-v3-color-palette-blue-200); @@ -346,15 +345,14 @@ --seed-v3-color-bg-layer-default-pressed: var(--seed-v3-color-palette-gray-200); --seed-v3-color-bg-layer-fill: var(--seed-v3-color-palette-gray-100); --seed-v3-color-bg-neutral-weak: var(--seed-v3-color-palette-gray-300); - --seed-v3-color-bg-neutral-solid: var(--seed-v3-color-palette-gray-900); + --seed-v3-color-bg-neutral-inverted: var(--seed-v3-color-palette-gray-900); --seed-v3-color-bg-neutral-weak-pressed: var(--seed-v3-color-palette-gray-400); --seed-v3-color-bg-informative-weak: var(--seed-v3-color-palette-blue-100); --seed-v3-color-bg-overlay: var(--seed-v3-color-palette-static-black-alpha-500); --seed-v3-color-bg-overlay-muted: var(--seed-v3-color-palette-static-black-alpha-200); - --seed-v3-color-bg-text-selection: var(--seed-v3-color-palette-carrot-100); --seed-v3-color-bg-layer-basement: var(--seed-v3-color-palette-gray-100); --seed-v3-color-bg-layer-floating: var(--seed-v3-color-palette-gray-100); - --seed-v3-color-bg-neutral-solid-pressed: var(--seed-v3-color-palette-gray-800); + --seed-v3-color-bg-neutral-inverted-pressed: var(--seed-v3-color-palette-gray-800); --seed-v3-color-bg-disabled: var(--seed-v3-color-palette-gray-200); --seed-v3-color-bg-layer-floating-pressed: var(--seed-v3-color-palette-gray-300); --seed-v3-color-bg-informative-weak-pressed: var(--seed-v3-color-palette-blue-200); diff --git a/packages/vars/lib/color/bg.d.ts b/packages/vars/lib/color/bg.d.ts index d968cdd69..0efd34adb 100644 --- a/packages/vars/lib/color/bg.d.ts +++ b/packages/vars/lib/color/bg.d.ts @@ -13,15 +13,14 @@ export declare const layerDefault = "var(--seed-v3-color-bg-layer-default)"; export declare const layerDefaultPressed = "var(--seed-v3-color-bg-layer-default-pressed)"; export declare const layerFill = "var(--seed-v3-color-bg-layer-fill)"; export declare const neutralWeak = "var(--seed-v3-color-bg-neutral-weak)"; -export declare const neutralSolid = "var(--seed-v3-color-bg-neutral-solid)"; +export declare const neutralInverted = "var(--seed-v3-color-bg-neutral-inverted)"; export declare const neutralWeakPressed = "var(--seed-v3-color-bg-neutral-weak-pressed)"; export declare const informativeWeak = "var(--seed-v3-color-bg-informative-weak)"; export declare const overlay = "var(--seed-v3-color-bg-overlay)"; export declare const overlayMuted = "var(--seed-v3-color-bg-overlay-muted)"; -export declare const textSelection = "var(--seed-v3-color-bg-text-selection)"; export declare const layerBasement = "var(--seed-v3-color-bg-layer-basement)"; export declare const layerFloating = "var(--seed-v3-color-bg-layer-floating)"; -export declare const neutralSolidPressed = "var(--seed-v3-color-bg-neutral-solid-pressed)"; +export declare const neutralInvertedPressed = "var(--seed-v3-color-bg-neutral-inverted-pressed)"; export declare const disabled = "var(--seed-v3-color-bg-disabled)"; export declare const layerFloatingPressed = "var(--seed-v3-color-bg-layer-floating-pressed)"; export declare const informativeWeakPressed = "var(--seed-v3-color-bg-informative-weak-pressed)"; diff --git a/packages/vars/lib/color/bg.mjs b/packages/vars/lib/color/bg.mjs index 50c851e3a..2b7f598a1 100644 --- a/packages/vars/lib/color/bg.mjs +++ b/packages/vars/lib/color/bg.mjs @@ -13,15 +13,14 @@ export const layerDefault = "var(--seed-v3-color-bg-layer-default)"; export const layerDefaultPressed = "var(--seed-v3-color-bg-layer-default-pressed)"; export const layerFill = "var(--seed-v3-color-bg-layer-fill)"; export const neutralWeak = "var(--seed-v3-color-bg-neutral-weak)"; -export const neutralSolid = "var(--seed-v3-color-bg-neutral-solid)"; +export const neutralInverted = "var(--seed-v3-color-bg-neutral-inverted)"; export const neutralWeakPressed = "var(--seed-v3-color-bg-neutral-weak-pressed)"; export const informativeWeak = "var(--seed-v3-color-bg-informative-weak)"; export const overlay = "var(--seed-v3-color-bg-overlay)"; export const overlayMuted = "var(--seed-v3-color-bg-overlay-muted)"; -export const textSelection = "var(--seed-v3-color-bg-text-selection)"; export const layerBasement = "var(--seed-v3-color-bg-layer-basement)"; export const layerFloating = "var(--seed-v3-color-bg-layer-floating)"; -export const neutralSolidPressed = "var(--seed-v3-color-bg-neutral-solid-pressed)"; +export const neutralInvertedPressed = "var(--seed-v3-color-bg-neutral-inverted-pressed)"; export const disabled = "var(--seed-v3-color-bg-disabled)"; export const layerFloatingPressed = "var(--seed-v3-color-bg-layer-floating-pressed)"; export const informativeWeakPressed = "var(--seed-v3-color-bg-informative-weak-pressed)"; diff --git a/packages/vars/lib/component/action-button.d.ts b/packages/vars/lib/component/action-button.d.ts index df59d4951..fa8f08ac8 100644 --- a/packages/vars/lib/component/action-button.d.ts +++ b/packages/vars/lib/component/action-button.d.ts @@ -63,7 +63,7 @@ export declare const vars: { "variantNeutralSolid": { "enabled": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" @@ -84,7 +84,7 @@ export declare const vars: { }, "pressed": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } }, "disabled": { @@ -106,7 +106,7 @@ export declare const vars: { }, "loading": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } } }, diff --git a/packages/vars/lib/component/action-button.mjs b/packages/vars/lib/component/action-button.mjs index 81a85d7b8..ad714a5aa 100644 --- a/packages/vars/lib/component/action-button.mjs +++ b/packages/vars/lib/component/action-button.mjs @@ -63,7 +63,7 @@ export const vars = { "variantNeutralSolid": { "enabled": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" @@ -84,7 +84,7 @@ export const vars = { }, "pressed": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } }, "disabled": { @@ -106,7 +106,7 @@ export const vars = { }, "loading": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } } }, diff --git a/packages/vars/lib/component/badge.d.ts b/packages/vars/lib/component/badge.d.ts index a651d27ba..c53dfd40e 100644 --- a/packages/vars/lib/component/badge.d.ts +++ b/packages/vars/lib/component/badge.d.ts @@ -83,7 +83,7 @@ export declare const vars: { "toneNeutralVariantSolid": { "enabled": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" diff --git a/packages/vars/lib/component/badge.mjs b/packages/vars/lib/component/badge.mjs index 03a258c8d..e7882869f 100644 --- a/packages/vars/lib/component/badge.mjs +++ b/packages/vars/lib/component/badge.mjs @@ -83,7 +83,7 @@ export const vars = { "toneNeutralVariantSolid": { "enabled": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" diff --git a/packages/vars/lib/component/chip-tab.d.ts b/packages/vars/lib/component/chip-tab.d.ts index ebf05e84d..837008adb 100644 --- a/packages/vars/lib/component/chip-tab.d.ts +++ b/packages/vars/lib/component/chip-tab.d.ts @@ -27,7 +27,7 @@ export declare const vars: { }, "selected": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" @@ -35,7 +35,7 @@ export declare const vars: { }, "selectedPressed": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } }, "disabled": { diff --git a/packages/vars/lib/component/chip-tab.mjs b/packages/vars/lib/component/chip-tab.mjs index e6b43fdcf..338e68343 100644 --- a/packages/vars/lib/component/chip-tab.mjs +++ b/packages/vars/lib/component/chip-tab.mjs @@ -27,7 +27,7 @@ export const vars = { }, "selected": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" @@ -35,7 +35,7 @@ export const vars = { }, "selectedPressed": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } }, "disabled": { diff --git a/packages/vars/lib/component/extended-fab.d.ts b/packages/vars/lib/component/extended-fab.d.ts index 7921eef82..55c4f2bda 100644 --- a/packages/vars/lib/component/extended-fab.d.ts +++ b/packages/vars/lib/component/extended-fab.d.ts @@ -10,7 +10,7 @@ export declare const vars: { "variantNeutralSolid": { "enabled": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" @@ -21,7 +21,7 @@ export declare const vars: { }, "pressed": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } } }, diff --git a/packages/vars/lib/component/extended-fab.mjs b/packages/vars/lib/component/extended-fab.mjs index 9d14840e5..4db1b9950 100644 --- a/packages/vars/lib/component/extended-fab.mjs +++ b/packages/vars/lib/component/extended-fab.mjs @@ -10,7 +10,7 @@ export const vars = { "variantNeutralSolid": { "enabled": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid)" + "color": "var(--seed-v3-color-bg-neutral-inverted)" }, "label": { "color": "var(--seed-v3-color-fg-neutral-inverted)" @@ -21,7 +21,7 @@ export const vars = { }, "pressed": { "root": { - "color": "var(--seed-v3-color-bg-neutral-solid-pressed)" + "color": "var(--seed-v3-color-bg-neutral-inverted-pressed)" } } },