@seed-design/css 0.1.15 → 0.2.1

package/recipes/chip.css

@@ -25,23 +25,18 @@
 .seed-chip__root:is(:disabled, [disabled], [data-disabled]) {
     cursor: not-allowed;
 }
-.seed-chip__root {
-    --seed-icon-color: inherit;
-}
 .seed-chip__label {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     font-weight: var(--seed-font-weight-medium);
     padding-inline: var(--seed-dimension-x1_5);
-    color: inherit;
 }
 .seed-chip__prefixIcon {
     display: inline-flex;
     align-items: center;
     flex-shrink: 0;
     padding-left: var(--seed-dimension-x1_5);
-    --seed-icon-color: inherit;
 }
 .seed-chip__prefixAvatar {
     display: inline-flex;
@@ -53,88 +48,93 @@
     align-items: center;
     flex-shrink: 0;
     padding-right: var(--seed-dimension-x1_5);
-    --seed-icon-color: inherit;
 }
 .seed-chip__root--variant_solid {
     background: var(--seed-color-bg-neutral-weak);
-    color: var(--seed-color-fg-neutral);
+    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_solid:is(:checked, [data-checked]) {
     box-shadow: none;
     background: var(--seed-color-bg-neutral-inverted);
-    color: var(--seed-color-fg-neutral-inverted);
     --seed-icon-color: var(--seed-color-fg-neutral-inverted);
 }
 .seed-chip__root--variant_solid:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
     background: var(--seed-color-bg-neutral-weak-pressed);
-    color: var(--seed-color-fg-neutral);
-    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_solid:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
     background: var(--seed-color-bg-neutral-inverted-pressed);
-    color: var(--seed-color-fg-neutral-inverted);
-    --seed-icon-color: var(--seed-color-fg-neutral-inverted);
 }
 .seed-chip__root--variant_solid:is(:disabled, [disabled], [data-disabled]) {
     opacity: 0.5;
 }
-.seed-chip__root--variant_solid {
-    --seed-icon-color: var(--seed-color-fg-neutral);
+.seed-chip__label--variant_solid {
+    color: var(--seed-color-fg-neutral);
+}
+.seed-chip__label--variant_solid:is(:checked, [data-checked]) {
+    color: var(--seed-color-fg-neutral-inverted);
+}
+.seed-chip__prefixIcon--variant_solid {
+    color: var(--seed-color-fg-neutral);
+}
+.seed-chip__suffixIcon--variant_solid {
+    color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineStrong {
     background: var(--seed-color-bg-layer-default);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
-    color: var(--seed-color-fg-neutral);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
+    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineStrong:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
     background: var(--seed-color-bg-layer-default-pressed);
-    color: var(--seed-color-fg-neutral);
-    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]) {
     background: var(--seed-color-bg-neutral-inverted);
-    color: var(--seed-color-fg-neutral-inverted);
     --seed-icon-color: var(--seed-color-fg-neutral-inverted);
 }
 .seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
     background: var(--seed-color-bg-neutral-inverted-pressed);
-    color: var(--seed-color-fg-neutral-inverted);
-    --seed-icon-color: var(--seed-color-fg-neutral-inverted);
 }
 .seed-chip__root--variant_outlineStrong:is(:disabled, [disabled], [data-disabled]) {
     opacity: 0.5;
 }
-.seed-chip__root--variant_outlineStrong {
-    --seed-icon-color: var(--seed-color-fg-neutral);
+.seed-chip__label--variant_outlineStrong {
+    color: var(--seed-color-fg-neutral);
+}
+.seed-chip__label--variant_outlineStrong:is(:checked, [data-checked]) {
+    color: var(--seed-color-fg-neutral-inverted);
+}
+.seed-chip__prefixIcon--variant_outlineStrong {
+    color: var(--seed-color-fg-neutral);
+}
+.seed-chip__suffixIcon--variant_outlineStrong {
+    color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineWeak {
     background: var(--seed-color-bg-layer-default);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
-    color: var(--seed-color-fg-neutral);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
+    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineWeak:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
     background: var(--seed-color-bg-layer-default-pressed);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
-    color: var(--seed-color-fg-neutral);
-    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]) {
     background: var(--seed-color-bg-neutral-weak);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-field-focused);
-    color: var(--seed-color-fg-neutral);
-    --seed-icon-color: var(--seed-color-fg-neutral);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-contrast);
 }
 .seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
     background: var(--seed-color-bg-neutral-weak-pressed);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-field-focused);
-    color: var(--seed-color-fg-neutral);
-    --seed-icon-color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--variant_outlineWeak:is(:disabled, [disabled], [data-disabled]) {
     opacity: 0.5;
 }
-.seed-chip__root--variant_outlineWeak {
-    --seed-icon-color: var(--seed-color-fg-neutral);
+.seed-chip__label--variant_outlineWeak {
+    color: var(--seed-color-fg-neutral);
+}
+.seed-chip__prefixIcon--variant_outlineWeak {
+    color: var(--seed-color-fg-neutral);
+}
+.seed-chip__suffixIcon--variant_outlineWeak {
+    color: var(--seed-color-fg-neutral);
 }
 .seed-chip__root--size_large {
     height: 40px;

package/recipes/chip.d.ts

@@ -1,14 +1,14 @@
 declare interface ChipVariant {
   /**
-  * @default solid
+  * @default "solid"
   */
   variant: "solid" | "outlineStrong" | "outlineWeak";
 /**
-  * @default medium
+  * @default "medium"
   */
   size: "large" | "medium" | "small";
 /**
-  * @default withText
+  * @default "withText"
   */
   layout: "iconOnly" | "withText";
 }

package/recipes/contextual-floating-button.d.ts

@@ -1,10 +1,10 @@
 declare interface ContextualFloatingButtonVariant {
   /**
-  * @default solid
+  * @default "solid"
   */
   variant: "solid" | "layer";
 /**
-  * @default withText
+  * @default "withText"
   */
   layout: "withText" | "iconOnly";
 }

package/recipes/control-chip.css

@@ -14,7 +14,7 @@
     flex-shrink: 0;
     line-height: 1;
     border-radius: var(--seed-radius-full);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
     color: var(--seed-color-fg-neutral);
     font-weight: var(--seed-font-weight-medium);
     --seed-prefix-icon-color: var(--seed-color-fg-neutral);

package/recipes/control-chip.d.ts

@@ -1,10 +1,10 @@
 declare interface ControlChipVariant {
   /**
-  * @default medium
+  * @default "medium"
   */
   size: "medium" | "small";
 /**
-  * @default withText
+  * @default "withText"
   */
   layout: "withText" | "iconOnly";
 }

package/recipes/extended-action-sheet-item.css

@@ -7,7 +7,7 @@
     padding-inline: var(--seed-dimension-x4);
     padding-block: var(--seed-dimension-x3_5);
     gap: var(--seed-dimension-x3_5);
-    box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral);
+    box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-muted);
     font-size: var(--seed-font-size-t5);
     line-height: var(--seed-line-height-t5);
     font-weight: var(--seed-font-weight-regular);

package/recipes/extended-action-sheet-item.d.ts

@@ -1,6 +1,6 @@
 declare interface ExtendedActionSheetItemVariant {
   /**
-  * @default neutral
+  * @default "neutral"
   */
   tone: "neutral" | "critical";
 }

package/recipes/extended-fab.d.ts

@@ -1,10 +1,10 @@
 declare interface ExtendedFabVariant {
   /**
-  * @default neutralSolid
+  * @default "neutralSolid"
   */
   variant: "neutralSolid" | "layerFloating";
 /**
-  * @default medium
+  * @default "medium"
   */
   size: "small" | "medium";
 }

package/recipes/identity-placeholder.d.ts

@@ -1,6 +1,6 @@
 declare interface IdentityPlaceholderVariant {
   /**
-  * @default person
+  * @default "person"
   */
   identity: "person";
 }

package/recipes/inline-banner.d.ts

@@ -1,6 +1,6 @@
 declare interface InlineBannerVariant {
   /**
-  * @default neutralWeak
+  * @default "neutralWeak"
   */
   variant: "neutralWeak" | "positiveWeak" | "informativeWeak" | "warningWeak" | "warningSolid" | "criticalWeak" | "criticalSolid";
 }

package/recipes/link-content.d.ts

@@ -1,10 +1,10 @@
 declare interface LinkContentVariant {
   /**
-  * @default regular
+  * @default "regular"
   */
   weight: "bold" | "regular";
 /**
-  * @default t4
+  * @default "t4"
   */
   size: "t6" | "t5" | "t4";
 }

package/recipes/manner-temp-badge.d.ts

@@ -1,6 +1,6 @@
 declare interface MannerTempBadgeVariant {
   /**
-  * @default l1
+  * @default "l1"
   */
   level: "l1" | "l2" | "l3" | "l4" | "l5" | "l6";
 }

package/recipes/manner-temp.d.ts

@@ -1,6 +1,6 @@
 declare interface MannerTempVariant {
   /**
-  * @default l1
+  * @default "l1"
   */
   level: "l1" | "l2" | "l3" | "l4" | "l5" | "l6";
 }

package/recipes/menu-sheet-item.css

@@ -6,7 +6,7 @@
     padding-inline: var(--seed-dimension-x4);
     padding-block: var(--seed-dimension-x3_5);
     gap: var(--seed-dimension-x3_5);
-    box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral);
+    box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-muted);
     font-size: var(--seed-font-size-t5);
     line-height: var(--seed-line-height-t5);
     font-weight: var(--seed-font-weight-regular);

package/recipes/menu-sheet-item.d.ts

@@ -1,10 +1,10 @@
 declare interface MenuSheetItemVariant {
   /**
-  * @default neutral
+  * @default "neutral"
   */
   tone: "neutral" | "critical";
 /**
-  * @default left
+  * @default "left"
   */
   labelAlign: "left" | "center";
 }

package/recipes/notification-badge-positioner.d.ts

@@ -1,10 +1,10 @@
 declare interface NotificationBadgePositionerVariant {
   /**
-  * @default icon
+  * @default "icon"
   */
   attach: "icon" | "text";
 /**
-  * @default large
+  * @default "large"
   */
   size: "small" | "large";
 }

package/recipes/notification-badge.d.ts

@@ -1,6 +1,6 @@
 declare interface NotificationBadgeVariant {
   /**
-  * @default large
+  * @default "large"
   */
   size: "small" | "large";
 }

package/recipes/page-banner.d.ts

@@ -1,10 +1,10 @@
 declare interface PageBannerVariant {
   /**
-  * @default weak
+  * @default "weak"
   */
   variant: "weak" | "solid";
 /**
-  * @default neutral
+  * @default "neutral"
   */
   tone: "neutral" | "informative" | "positive" | "warning" | "critical";
 }

package/recipes/progress-circle.d.ts

@@ -1,6 +1,6 @@
 declare interface ProgressCircleVariant {
   /**
-  * @default neutral
+  * @default "neutral"
   */
   tone: "neutral" | "brand" | "staticWhite" | "inherit";
 /**

package/recipes/radio.css

@@ -7,7 +7,7 @@
     flex: none;
     background-color: var(--seed-color-bg-layer-default);
     border-width: 1px;
-    border-color: var(--seed-color-stroke-control);
+    border-color: var(--seed-color-stroke-neutral-weak);
     border-radius: var(--seed-radius-full);
 }
 .seed-radio__root:is(:active, [data-active]) {

package/recipes/radio.d.ts

@@ -1,6 +1,6 @@
 declare interface RadioVariant {
   /**
-  * @default medium
+  * @default "medium"
   */
   size: "large" | "medium";
 }

package/recipes/reaction-button.css

@@ -34,7 +34,7 @@
 .seed-reaction-button:is([aria-pressed=true], [data-pressed]) {
     background: var(--seed-color-bg-layer-default);
     color: var(--seed-color-fg-brand);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
     --seed-prefix-icon-color: var(--seed-color-fg-brand);
     --seed-count-color: var(--seed-color-fg-brand);
 }
@@ -45,7 +45,7 @@
     cursor: not-allowed;
     background: var(--seed-color-bg-disabled);
     color: var(--seed-color-fg-disabled);
-    box-shadow: inset 0 0 0 0px var(--seed-color-stroke-brand);
+    box-shadow: inset 0 0 0 0px var(--seed-color-stroke-brand-weak);
     --seed-prefix-icon-color: var(--seed-color-fg-disabled);
     --seed-count-color: var(--seed-color-fg-disabled);
 }
@@ -54,7 +54,7 @@
 }
 .seed-reaction-button:is([aria-pressed=true], [data-pressed])[data-loading] {
     background: var(--seed-color-bg-layer-default-pressed);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
     --track-color: var(--seed-color-palette-carrot-200);
     --range-color: var(--seed-color-fg-brand);
 }

package/recipes/reaction-button.d.ts

@@ -1,6 +1,6 @@
 declare interface ReactionButtonVariant {
   /**
-  * @default small
+  * @default "small"
   */
   size: "xsmall" | "small";
 }

package/recipes/select-box.css

@@ -7,14 +7,14 @@
     padding-inline: var(--seed-dimension-x4);
     padding-block: var(--seed-dimension-x5);
     border-radius: var(--seed-radius-r3);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
 }
 .seed-select-box__root:is(:active, [data-active]) {
     background-color: var(--seed-color-bg-layer-default-pressed);
 }
 .seed-select-box__root:is(:checked, [data-checked]) {
     background-color: var(--seed-color-bg-neutral-weak);
-    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-control);
+    box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
 }
 .seed-select-box__root:is(:checked, [data-checked]):is(:active, [data-active]) {
     background-color: var(--seed-color-bg-neutral-weak-pressed);
@@ -36,7 +36,7 @@
     background-color: var(--seed-color-bg-layer-default);
     border-style: solid;
     border-width: 1px;
-    border-color: var(--seed-color-stroke-control);
+    border-color: var(--seed-color-stroke-neutral-weak);
     border-radius: var(--seed-radius-r1);
 }
 .seed-select-box__checkboxControl:is(:active, [data-active]) {
@@ -69,7 +69,7 @@
     background-color: var(--seed-color-bg-layer-default);
     border-style: solid;
     border-width: 1px;
-    border-color: var(--seed-color-stroke-control);
+    border-color: var(--seed-color-stroke-neutral-weak);
     border-radius: var(--seed-radius-full);
 }
 .seed-select-box__radioControl:is(:active, [data-active]) {

package/recipes/skeleton.d.ts

@@ -4,7 +4,7 @@ declare interface SkeletonVariant {
   */
   radius: "0" | "8" | "16" | "full";
 /**
-  * @default neutral
+  * @default "neutral"
   */
   tone: "neutral" | "magic";
 }

package/recipes/snackbar.d.ts

@@ -1,6 +1,6 @@
 declare interface SnackbarVariant {
   /**
-  * @default default
+  * @default "default"
   */
   variant: "default" | "positive" | "critical";
 }

package/recipes/tabs.css

@@ -17,7 +17,7 @@
 }
 .seed-tabs__list {
     background: var(--seed-color-bg-layer-default);
-    box-shadow: inset 0 -1px var(--seed-color-stroke-neutral);
+    box-shadow: inset 0 -1px var(--seed-color-stroke-neutral-muted);
 }
 .seed-tabs__carousel {
     display: block;

package/recipes/tabs.d.ts

@@ -1,14 +1,14 @@
 declare interface TabsVariant {
   /**
-  * @default fill
+  * @default "fill"
   */
   triggerLayout: "fill" | "hug";
 /**
-  * @default hug
+  * @default "hug"
   */
   contentLayout: "fill" | "hug";
 /**
-  * @default small
+  * @default "small"
   */
   size: "small" | "medium";
 /**

package/recipes/text-field.css

@@ -18,15 +18,15 @@
     background-color: var(--seed-color-bg-layer-default);
     border-style: solid;
     border-width: 1px;
-    border-color: var(--seed-color-stroke-field);
+    border-color: var(--seed-color-stroke-neutral-weak);
     overflow: hidden;
 }
 .seed-text-field__field:not(:is([data-readonly])):is(:focus, [data-focus]) {
-    border-color: var(--seed-color-stroke-field-focused);
+    border-color: var(--seed-color-stroke-neutral-contrast);
 }
 .seed-text-field__field:is(:invalid, [data-invalid]) {
     background-color: var(--seed-color-bg-critical-weak);
-    border-color: var(--seed-color-stroke-critical);
+    border-color: var(--seed-color-stroke-critical-weak);
 }
 .seed-text-field__field:is(:invalid, [data-invalid]):is(:focus, [data-focus]) {
     background-color: var(--seed-color-bg-layer-default);

package/recipes/text-field.d.ts

@@ -1,6 +1,6 @@
 declare interface TextFieldVariant {
   /**
-  * @default medium
+  * @default "medium"
   */
   size: "xlarge" | "large" | "medium";
 }

package/recipes/text.d.ts

@@ -1,14 +1,14 @@
 declare interface TextVariant {
   /**
-  * @default t5Regular
+  * @default "t5Regular"
   */
   textStyle: "screenTitle" | "articleBody" | "t1Regular" | "t1Medium" | "t1Bold" | "t2Regular" | "t2Medium" | "t2Bold" | "t3Regular" | "t3Medium" | "t3Bold" | "t4Regular" | "t4Medium" | "t4Bold" | "t5Regular" | "t5Medium" | "t5Bold" | "t6Regular" | "t6Medium" | "t6Bold" | "t7Regular" | "t7Medium" | "t7Bold" | "t8Bold" | "t9Bold" | "t10Bold";
 /**
-  * @default none
+  * @default "none"
   */
   maxLines: "none" | "single" | "multi";
 /**
-  * @default none
+  * @default "none"
   */
   textDecorationLine: "none" | "line-through";
 }

package/recipes/toggle-button.d.ts

@@ -1,10 +1,10 @@
 declare interface ToggleButtonVariant {
   /**
-  * @default brandSolid
+  * @default "brandSolid"
   */
   variant: "brandSolid" | "neutralWeak";
 /**
-  * @default small
+  * @default "small"
   */
   size: "xsmall" | "small";
 }

package/vars/color/fg.d.ts

@@ -1,11 +1,11 @@
 export declare const neutral = "var(--seed-color-fg-neutral)";
+export declare const placeholder = "var(--seed-color-fg-placeholder)";
+export declare const disabled = "var(--seed-color-fg-disabled)";
 export declare const brand = "var(--seed-color-fg-brand)";
+export declare const informative = "var(--seed-color-fg-informative)";
 export declare const critical = "var(--seed-color-fg-critical)";
 export declare const positive = "var(--seed-color-fg-positive)";
 export declare const warning = "var(--seed-color-fg-warning)";
-export declare const informative = "var(--seed-color-fg-informative)";
-export declare const placeholder = "var(--seed-color-fg-placeholder)";
-export declare const disabled = "var(--seed-color-fg-disabled)";
 export declare const brandContrast = "var(--seed-color-fg-brand-contrast)";
 export declare const criticalContrast = "var(--seed-color-fg-critical-contrast)";
 export declare const informativeContrast = "var(--seed-color-fg-informative-contrast)";

package/vars/color/fg.mjs

@@ -1,11 +1,11 @@
 export const neutral = "var(--seed-color-fg-neutral)";
+export const placeholder = "var(--seed-color-fg-placeholder)";
+export const disabled = "var(--seed-color-fg-disabled)";
 export const brand = "var(--seed-color-fg-brand)";
+export const informative = "var(--seed-color-fg-informative)";
 export const critical = "var(--seed-color-fg-critical)";
 export const positive = "var(--seed-color-fg-positive)";
 export const warning = "var(--seed-color-fg-warning)";
-export const informative = "var(--seed-color-fg-informative)";
-export const placeholder = "var(--seed-color-fg-placeholder)";
-export const disabled = "var(--seed-color-fg-disabled)";
 export const brandContrast = "var(--seed-color-fg-brand-contrast)";
 export const criticalContrast = "var(--seed-color-fg-critical-contrast)";
 export const informativeContrast = "var(--seed-color-fg-informative-contrast)";

package/vars/color/stroke.d.ts

@@ -1,11 +1,15 @@
-export declare const neutral = "var(--seed-color-stroke-neutral)";
-export declare const brand = "var(--seed-color-stroke-brand)";
-export declare const positive = "var(--seed-color-stroke-positive)";
-export declare const informative = "var(--seed-color-stroke-informative)";
-export declare const warning = "var(--seed-color-stroke-warning)";
-export declare const critical = "var(--seed-color-stroke-critical)";
-export declare const field = "var(--seed-color-stroke-field)";
-export declare const control = "var(--seed-color-stroke-control)";
-export declare const fieldFocused = "var(--seed-color-stroke-field-focused)";
+export declare const brandWeak = "var(--seed-color-stroke-brand-weak)";
+export declare const brandSolid = "var(--seed-color-stroke-brand-solid)";
+export declare const criticalWeak = "var(--seed-color-stroke-critical-weak)";
+export declare const criticalSolid = "var(--seed-color-stroke-critical-solid)";
+export declare const informativeWeak = "var(--seed-color-stroke-informative-weak)";
+export declare const informativeSolid = "var(--seed-color-stroke-informative-solid)";
+export declare const neutralContrast = "var(--seed-color-stroke-neutral-contrast)";
+export declare const neutralSolid = "var(--seed-color-stroke-neutral-solid)";
+export declare const neutralWeak = "var(--seed-color-stroke-neutral-weak)";
 export declare const neutralMuted = "var(--seed-color-stroke-neutral-muted)";
-export declare const onImage = "var(--seed-color-stroke-on-image)";
+export declare const neutralSubtle = "var(--seed-color-stroke-neutral-subtle)";
+export declare const positiveWeak = "var(--seed-color-stroke-positive-weak)";
+export declare const positiveSolid = "var(--seed-color-stroke-positive-solid)";
+export declare const warningWeak = "var(--seed-color-stroke-warning-weak)";
+export declare const warningSolid = "var(--seed-color-stroke-warning-solid)";

package/vars/color/stroke.mjs

@@ -1,11 +1,15 @@
-export const neutral = "var(--seed-color-stroke-neutral)";
-export const brand = "var(--seed-color-stroke-brand)";
-export const positive = "var(--seed-color-stroke-positive)";
-export const informative = "var(--seed-color-stroke-informative)";
-export const warning = "var(--seed-color-stroke-warning)";
-export const critical = "var(--seed-color-stroke-critical)";
-export const field = "var(--seed-color-stroke-field)";
-export const control = "var(--seed-color-stroke-control)";
-export const fieldFocused = "var(--seed-color-stroke-field-focused)";
+export const brandWeak = "var(--seed-color-stroke-brand-weak)";
+export const brandSolid = "var(--seed-color-stroke-brand-solid)";
+export const criticalWeak = "var(--seed-color-stroke-critical-weak)";
+export const criticalSolid = "var(--seed-color-stroke-critical-solid)";
+export const informativeWeak = "var(--seed-color-stroke-informative-weak)";
+export const informativeSolid = "var(--seed-color-stroke-informative-solid)";
+export const neutralContrast = "var(--seed-color-stroke-neutral-contrast)";
+export const neutralSolid = "var(--seed-color-stroke-neutral-solid)";
+export const neutralWeak = "var(--seed-color-stroke-neutral-weak)";
 export const neutralMuted = "var(--seed-color-stroke-neutral-muted)";
-export const onImage = "var(--seed-color-stroke-on-image)";
+export const neutralSubtle = "var(--seed-color-stroke-neutral-subtle)";
+export const positiveWeak = "var(--seed-color-stroke-positive-weak)";
+export const positiveSolid = "var(--seed-color-stroke-positive-solid)";
+export const warningWeak = "var(--seed-color-stroke-warning-weak)";
+export const warningSolid = "var(--seed-color-stroke-warning-solid)";