@serendie/ui 2.2.5 → 2.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/components/Button/Button.d.ts +1 -1
  2. package/dist/components/Button/Button.js +13 -13
  3. package/dist/components/Divider/Divider.d.ts +1 -1
  4. package/dist/components/Divider/Divider.js +4 -4
  5. package/dist/components/IconButton/IconButton.d.ts +2 -2
  6. package/dist/components/IconButton/IconButton.js +6 -6
  7. package/dist/components/RadioButton/RadioButton.js +10 -10
  8. package/dist/node_modules/@serendie/design-token/dist/panda-tokens.js +20 -5
  9. package/dist/node_modules/@serendie/design-token/dist/tokens.js +10 -5
  10. package/dist/preset.d.ts +20 -5
  11. package/dist/styled-system/tokens/index.js +35 -15
  12. package/dist/styles.css +1 -1
  13. package/dist/tokens/getToken.d.ts +10 -5
  14. package/dist/tokens/index.d.ts +20 -5
  15. package/package.json +2 -2
  16. package/styled-system/themes/theme-asagi.json +1 -1
  17. package/styled-system/themes/theme-kurikawa.json +1 -1
  18. package/styled-system/themes/theme-sumire.json +1 -1
  19. package/styled-system/themes/theme-tsutsuji.json +1 -1
  20. package/styled-system/tokens/index.js +35 -15
  21. package/styled-system/tokens/tokens.d.ts +2 -2
package/dist/components/Button/Button.d.ts CHANGED
@@ -40,7 +40,7 @@ export declare const ButtonStyle: import('../../../styled-system/types').RecipeR
40
40
  bgColor: "sd.system.color.interaction.hoveredVariant";
41
41
  outlineWidth: "sd.system.dimension.border.medium";
42
42
  outlineStyle: "solid";
43
- outlineColor: "sd.system.color.component.outlineVariant";
43
+ outlineColor: "sd.system.color.component.outlineDim";
44
44
  };
45
45
  };
46
46
  _disabled: {
package/dist/components/Button/Button.js CHANGED
@@ -16,7 +16,7 @@ const d = {
16
16
  bgColor: "sd.system.color.interaction.hoveredVariant"
17
17
  },
18
18
  _focusVisible: {
19
- outlineColor: "sd.system.color.component.outlineVariant",
19
+ outlineColor: "sd.system.color.component.outlineDim",
20
20
  bgColor: "sd.system.color.interaction.hoveredVariant"
21
21
  }
22
22
  },
@@ -25,7 +25,7 @@ const d = {
25
25
  color: "sd.system.color.interaction.disabledOnSurface",
26
26
  outline: "none"
27
27
  }
28
- }, a = h({
28
+ }, l = h({
29
29
  base: {
30
30
  borderRadius: "sd.system.dimension.radius.full",
31
31
  position: "relative",
@@ -80,7 +80,7 @@ const d = {
80
80
  bgColor: "sd.system.color.interaction.hoveredVariant",
81
81
  outlineWidth: "sd.system.dimension.border.medium",
82
82
  outlineStyle: "solid",
83
- outlineColor: "sd.system.color.component.outlineVariant"
83
+ outlineColor: "sd.system.color.component.outlineDim"
84
84
  }
85
85
  },
86
86
  _disabled: {
@@ -118,17 +118,17 @@ const d = {
118
118
  styleType: "filled",
119
119
  size: "medium"
120
120
  }
121
- }), i = v("span", {
121
+ }), t = v("span", {
122
122
  base: {
123
123
  position: "relative",
124
124
  zIndex: "sd.system.elevation.zIndex.base"
125
125
  }
126
126
  }), R = b.forwardRef(
127
- (n, l) => {
127
+ (n, a) => {
128
128
  const [
129
129
  r,
130
- { children: m, leftIcon: e, rightIcon: s, isLoading: t, className: c, ...y }
131
- ] = a.splitVariantProps(n), p = a(r), u = x(
130
+ { children: m, leftIcon: e, rightIcon: s, isLoading: i, className: c, ...y }
131
+ ] = l.splitVariantProps(n), p = l(r), u = x(
132
132
  e || s ? n.size === "medium" ? {
133
133
  //アイコンがある側 `spacing.medium`、無い側は`spacing.extraLarge`
134
134
  paddingLeft: e ? "sd.system.dimension.spacing.medium" : "sd.system.dimension.spacing.extraLarge",
@@ -142,11 +142,11 @@ const d = {
142
142
  return /* @__PURE__ */ g(
143
143
  "button",
144
144
  {
145
- ref: l,
145
+ ref: a,
146
146
  className: _(p, u, c),
147
147
  ...y,
148
148
  children: [
149
- t && /* @__PURE__ */ o(
149
+ i && /* @__PURE__ */ o(
150
150
  f,
151
151
  {
152
152
  type: "circular",
@@ -154,9 +154,9 @@ const d = {
154
154
  color: "subtle"
155
155
  }
156
156
  ),
157
- !t && e && /* @__PURE__ */ o(i, { p: "2px", children: e }),
158
- /* @__PURE__ */ o(i, { children: m }),
159
- !t && s && /* @__PURE__ */ o(i, { p: "2px", children: s })
157
+ !i && e && /* @__PURE__ */ o(t, { p: "2px", children: e }),
158
+ /* @__PURE__ */ o(t, { children: m }),
159
+ !i && s && /* @__PURE__ */ o(t, { p: "2px", children: s })
160
160
  ]
161
161
  }
162
162
  );
@@ -164,5 +164,5 @@ const d = {
164
164
  );
165
165
  export {
166
166
  R as Button,
167
- a as ButtonStyle
167
+ l as ButtonStyle
168
168
  };
package/dist/components/Divider/Divider.d.ts CHANGED
@@ -9,7 +9,7 @@ export declare const DividerStyle: import('../../../styled-system/types').Recipe
9
9
  borderColor: "sd.reference.color.scale.gray.300";
10
10
  };
11
11
  dark: {
12
- borderColor: "sd.system.color.component.outlineVariant";
12
+ borderColor: "sd.system.color.component.outlineDim";
13
13
  };
14
14
  };
15
15
  type: {
package/dist/components/Divider/Divider.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { jsx as d } from "react/jsx-runtime";
2
2
  import { cva as n } from "../../styled-system/css/cva.js";
3
- import { cx as a } from "../../styled-system/css/cx.js";
3
+ import { cx as l } from "../../styled-system/css/cx.js";
4
4
  const r = n({
5
5
  base: {
6
6
  border: "none"
@@ -14,7 +14,7 @@ const r = n({
14
14
  borderColor: "sd.reference.color.scale.gray.300"
15
15
  },
16
16
  dark: {
17
- borderColor: "sd.system.color.component.outlineVariant"
17
+ borderColor: "sd.system.color.component.outlineDim"
18
18
  }
19
19
  },
20
20
  type: {
@@ -38,8 +38,8 @@ const r = n({
38
38
  type: "horizontal"
39
39
  }
40
40
  }), h = (e) => {
41
- const [o, t] = r.splitVariantProps(e), { className: s, ...i } = t;
42
- return /* @__PURE__ */ d("hr", { className: a(r(o), s), ...i });
41
+ const [o, s] = r.splitVariantProps(e), { className: t, ...i } = s;
42
+ return /* @__PURE__ */ d("hr", { className: l(r(o), t), ...i });
43
43
  };
44
44
  export {
45
45
  h as Divider,
package/dist/components/IconButton/IconButton.d.ts CHANGED
@@ -33,7 +33,7 @@ export declare const IconButtonStyle: import('../../../styled-system/types').Rec
33
33
  bgColor: "sd.system.color.interaction.hoveredVariant";
34
34
  };
35
35
  _focusVisible: {
36
- outlineColor: "sd.system.color.component.outlineVariant";
36
+ outlineColor: "sd.system.color.component.outlineDim";
37
37
  bgColor: "sd.system.color.interaction.hoveredVariant";
38
38
  };
39
39
  };
@@ -46,7 +46,7 @@ export declare const IconButtonStyle: import('../../../styled-system/types').Rec
46
46
  };
47
47
  _focusVisible: {
48
48
  bgColor: "sd.system.color.interaction.hoveredVariant";
49
- outlineColor: "sd.system.color.component.outlineVariant";
49
+ outlineColor: "sd.system.color.component.outlineDim";
50
50
  };
51
51
  };
52
52
  _disabled: {
package/dist/components/IconButton/IconButton.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { jsx as d } from "react/jsx-runtime";
2
- import a from "react";
3
- import { cva as c } from "../../styled-system/css/cva.js";
2
+ import c from "react";
3
+ import { cva as a } from "../../styled-system/css/cva.js";
4
4
  import { cx as m } from "../../styled-system/css/cx.js";
5
- const e = c({
5
+ const e = a({
6
6
  base: {
7
7
  position: "relative",
8
8
  display: "inline-flex",
@@ -58,7 +58,7 @@ const e = c({
58
58
  bgColor: "sd.system.color.interaction.hoveredVariant"
59
59
  },
60
60
  _focusVisible: {
61
- outlineColor: "sd.system.color.component.outlineVariant",
61
+ outlineColor: "sd.system.color.component.outlineDim",
62
62
  bgColor: "sd.system.color.interaction.hoveredVariant"
63
63
  }
64
64
  }
@@ -71,7 +71,7 @@ const e = c({
71
71
  },
72
72
  _focusVisible: {
73
73
  bgColor: "sd.system.color.interaction.hoveredVariant",
74
- outlineColor: "sd.system.color.component.outlineVariant"
74
+ outlineColor: "sd.system.color.component.outlineDim"
75
75
  }
76
76
  },
77
77
  _disabled: {
@@ -103,7 +103,7 @@ const e = c({
103
103
  styleType: "filled",
104
104
  size: "medium"
105
105
  }
106
- }), g = a.forwardRef(
106
+ }), g = c.forwardRef(
107
107
  ({ icon: o, className: s, ...r }, n) => {
108
108
  const [i, t] = e.splitVariantProps(r), l = e(i);
109
109
  return /* @__PURE__ */ d("button", { ref: n, className: m(l, s), ...t, children: o });
package/dist/components/RadioButton/RadioButton.js CHANGED
@@ -7,7 +7,7 @@ import { css as g } from "../../styled-system/css/css.js";
7
7
  import { RadioGroupItem as I } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item.js";
8
8
  import { RadioGroupItemContext as S } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-context.js";
9
9
  import { RadioGroupItemControl as b } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-control.js";
10
- import { RadioGroupItemText as c } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-text.js";
10
+ import { RadioGroupItemText as m } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-text.js";
11
11
  import { RadioGroupItemHiddenInput as C } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-hidden-input.js";
12
12
  const k = {
13
13
  flexShrink: 0,
@@ -22,11 +22,11 @@ const k = {
22
22
  color: "color-mix(in srgb, {colors.sd.system.color.impression.primary}, {colors.sd.system.color.interaction.hoveredOnPrimary});"
23
23
  }
24
24
  }, _ = {
25
- color: "sd.system.color.component.outlineVariant",
25
+ color: "sd.system.color.component.outlineDim",
26
26
  _disabled: {
27
- color: "color-mix(in srgb, {colors.sd.system.color.component.outlineVariant}, {colors.sd.system.color.interaction.hoveredOnPrimary});"
27
+ color: "color-mix(in srgb, {colors.sd.system.color.component.outlineDim}, {colors.sd.system.color.interaction.hoveredOnPrimary});"
28
28
  }
29
- }, m = f({
29
+ }, c = f({
30
30
  slots: [
31
31
  "item",
32
32
  "itemControl",
@@ -74,14 +74,14 @@ const k = {
74
74
  }
75
75
  }
76
76
  }
77
- }), E = ({
77
+ }), V = ({
78
78
  value: n,
79
79
  label: t,
80
80
  helperText: s,
81
81
  className: d,
82
82
  ...a
83
83
  }) => {
84
- const [l, p] = m.splitVariantProps(a), o = m(l), y = i(
84
+ const [l, p] = c.splitVariantProps(a), o = c(l), y = i(
85
85
  o.item,
86
86
  s && g({ alignItems: "flex-start" })
87
87
  );
@@ -94,8 +94,8 @@ const k = {
94
94
  children: [
95
95
  /* @__PURE__ */ e(S, { children: (u) => /* @__PURE__ */ e(b, { className: o.itemControl, asChild: !0, children: u.checked ? /* @__PURE__ */ e(x, { className: o.checkedIcon }) : /* @__PURE__ */ e(h, { className: o.unCheckedIcon }) }) }),
96
96
  /* @__PURE__ */ r("div", { className: o.itemTextGroup, children: [
97
- t && /* @__PURE__ */ e(c, { className: o.itemText, children: t }),
98
- s && /* @__PURE__ */ e(c, { className: o.helperText, children: s })
97
+ t && /* @__PURE__ */ e(m, { className: o.itemText, children: t }),
98
+ s && /* @__PURE__ */ e(m, { className: o.helperText, children: s })
99
99
  ] }),
100
100
  /* @__PURE__ */ e(C, {})
101
101
  ]
@@ -103,8 +103,8 @@ const k = {
103
103
  );
104
104
  };
105
105
  export {
106
- E as RadioButton,
107
- m as RadioButtonStyle,
106
+ V as RadioButton,
107
+ c as RadioButtonStyle,
108
108
  R as radioCheckedIconCss,
109
109
  k as radioIconCss,
110
110
  _ as radioUncheckedIconCss
package/dist/node_modules/@serendie/design-token/dist/panda-tokens.js CHANGED
@@ -464,10 +464,13 @@ const e = {
464
464
  inversePrimary: {
465
465
  value: "#EFF2FC"
466
466
  },
467
+ outlineBright: {
468
+ value: "#E4E4E3"
469
+ },
467
470
  outline: {
468
471
  value: "#D1D0CD"
469
472
  },
470
- outlineVariant: {
473
+ outlineDim: {
471
474
  value: "#8C8B87"
472
475
  },
473
476
  scrim: {
@@ -1481,10 +1484,13 @@ const e = {
1481
1484
  inversePrimary: {
1482
1485
  value: "#D9F6FC"
1483
1486
  },
1487
+ outlineBright: {
1488
+ value: "#E4E4E3"
1489
+ },
1484
1490
  outline: {
1485
1491
  value: "#D1D0CD"
1486
1492
  },
1487
- outlineVariant: {
1493
+ outlineDim: {
1488
1494
  value: "#8C8B87"
1489
1495
  },
1490
1496
  scrim: {
@@ -1773,10 +1779,13 @@ const e = {
1773
1779
  inversePrimary: {
1774
1780
  value: "#FAECE6"
1775
1781
  },
1782
+ outlineBright: {
1783
+ value: "#E4E4E3"
1784
+ },
1776
1785
  outline: {
1777
1786
  value: "#D1D0CD"
1778
1787
  },
1779
- outlineVariant: {
1788
+ outlineDim: {
1780
1789
  value: "#8C8B87"
1781
1790
  },
1782
1791
  scrim: {
@@ -2065,10 +2074,13 @@ const e = {
2065
2074
  inversePrimary: {
2066
2075
  value: "#F4ECF6"
2067
2076
  },
2077
+ outlineBright: {
2078
+ value: "#E4E4E3"
2079
+ },
2068
2080
  outline: {
2069
2081
  value: "#D1D0CD"
2070
2082
  },
2071
- outlineVariant: {
2083
+ outlineDim: {
2072
2084
  value: "#8C8B87"
2073
2085
  },
2074
2086
  scrim: {
@@ -2357,10 +2369,13 @@ const e = {
2357
2369
  inversePrimary: {
2358
2370
  value: "#FFF4F8"
2359
2371
  },
2372
+ outlineBright: {
2373
+ value: "#E4E4E3"
2374
+ },
2360
2375
  outline: {
2361
2376
  value: "#D1D0CD"
2362
2377
  },
2363
- outlineVariant: {
2378
+ outlineDim: {
2364
2379
  value: "#8C8B87"
2365
2380
  },
2366
2381
  scrim: {
package/dist/node_modules/@serendie/design-token/dist/tokens.js CHANGED
@@ -269,8 +269,9 @@ const e = {
269
269
  inverseSurface: "#232322",
270
270
  inverseOnSurface: "#FFFFFF",
271
271
  inversePrimary: "#EFF2FC",
272
+ outlineBright: "#E4E4E3",
272
273
  outline: "#D1D0CD",
273
- outlineVariant: "#8C8B87",
274
+ outlineDim: "#8C8B87",
274
275
  scrim: "#00000033"
275
276
  },
276
277
  interaction: {
@@ -671,8 +672,9 @@ const e = {
671
672
  inverseSurface: "#232322",
672
673
  inverseOnSurface: "#FFFFFF",
673
674
  inversePrimary: "#D9F6FC",
675
+ outlineBright: "#E4E4E3",
674
676
  outline: "#D1D0CD",
675
- outlineVariant: "#8C8B87",
677
+ outlineDim: "#8C8B87",
676
678
  scrim: "#00000033"
677
679
  },
678
680
  interaction: {
@@ -791,8 +793,9 @@ const e = {
791
793
  inverseSurface: "#232322",
792
794
  inverseOnSurface: "#FFFFFF",
793
795
  inversePrimary: "#FAECE6",
796
+ outlineBright: "#E4E4E3",
794
797
  outline: "#D1D0CD",
795
- outlineVariant: "#8C8B87",
798
+ outlineDim: "#8C8B87",
796
799
  scrim: "#00000033"
797
800
  },
798
801
  interaction: {
@@ -911,8 +914,9 @@ const e = {
911
914
  inverseSurface: "#232322",
912
915
  inverseOnSurface: "#FFFFFF",
913
916
  inversePrimary: "#F4ECF6",
917
+ outlineBright: "#E4E4E3",
914
918
  outline: "#D1D0CD",
915
- outlineVariant: "#8C8B87",
919
+ outlineDim: "#8C8B87",
916
920
  scrim: "#00000033"
917
921
  },
918
922
  interaction: {
@@ -1031,8 +1035,9 @@ const e = {
1031
1035
  inverseSurface: "#232322",
1032
1036
  inverseOnSurface: "#FFFFFF",
1033
1037
  inversePrimary: "#FFF4F8",
1038
+ outlineBright: "#E4E4E3",
1034
1039
  outline: "#D1D0CD",
1035
- outlineVariant: "#8C8B87",
1040
+ outlineDim: "#8C8B87",
1036
1041
  scrim: "#00000033"
1037
1042
  },
1038
1043
  interaction: {
package/dist/preset.d.ts CHANGED
@@ -116,10 +116,13 @@ declare const themes: {
116
116
  inversePrimary: {
117
117
  value: string;
118
118
  };
119
+ outlineBright: {
120
+ value: string;
121
+ };
119
122
  outline: {
120
123
  value: string;
121
124
  };
122
- outlineVariant: {
125
+ outlineDim: {
123
126
  value: string;
124
127
  };
125
128
  scrim: {
@@ -408,10 +411,13 @@ declare const themes: {
408
411
  inversePrimary: {
409
412
  value: string;
410
413
  };
414
+ outlineBright: {
415
+ value: string;
416
+ };
411
417
  outline: {
412
418
  value: string;
413
419
  };
414
- outlineVariant: {
420
+ outlineDim: {
415
421
  value: string;
416
422
  };
417
423
  scrim: {
@@ -700,10 +706,13 @@ declare const themes: {
700
706
  inversePrimary: {
701
707
  value: string;
702
708
  };
709
+ outlineBright: {
710
+ value: string;
711
+ };
703
712
  outline: {
704
713
  value: string;
705
714
  };
706
- outlineVariant: {
715
+ outlineDim: {
707
716
  value: string;
708
717
  };
709
718
  scrim: {
@@ -992,10 +1001,13 @@ declare const themes: {
992
1001
  inversePrimary: {
993
1002
  value: string;
994
1003
  };
1004
+ outlineBright: {
1005
+ value: string;
1006
+ };
995
1007
  outline: {
996
1008
  value: string;
997
1009
  };
998
- outlineVariant: {
1010
+ outlineDim: {
999
1011
  value: string;
1000
1012
  };
1001
1013
  scrim: {
@@ -1785,10 +1797,13 @@ export declare const SerendiePreset: {
1785
1797
  inversePrimary: {
1786
1798
  value: string;
1787
1799
  };
1800
+ outlineBright: {
1801
+ value: string;
1802
+ };
1788
1803
  outline: {
1789
1804
  value: string;
1790
1805
  };
1791
- outlineVariant: {
1806
+ outlineDim: {
1792
1807
  value: string;
1793
1808
  };
1794
1809
  scrim: {
package/dist/styled-system/tokens/index.js CHANGED
@@ -567,13 +567,17 @@ const l = {
567
567
  value: "var(--colors-sd-system-color-component-inverse-primary)",
568
568
  variable: "var(--colors-sd-system-color-component-inverse-primary)"
569
569
  },
570
+ "colors.sd.system.color.component.outlineBright": {
571
+ value: "var(--colors-sd-system-color-component-outline-bright)",
572
+ variable: "var(--colors-sd-system-color-component-outline-bright)"
573
+ },
570
574
  "colors.sd.system.color.component.outline": {
571
575
  value: "var(--colors-sd-system-color-component-outline)",
572
576
  variable: "var(--colors-sd-system-color-component-outline)"
573
577
  },
574
- "colors.sd.system.color.component.outlineVariant": {
575
- value: "var(--colors-sd-system-color-component-outline-variant)",
576
- variable: "var(--colors-sd-system-color-component-outline-variant)"
578
+ "colors.sd.system.color.component.outlineDim": {
579
+ value: "var(--colors-sd-system-color-component-outline-dim)",
580
+ variable: "var(--colors-sd-system-color-component-outline-dim)"
577
581
  },
578
582
  "colors.sd.system.color.component.scrim": {
579
583
  value: "var(--colors-sd-system-color-component-scrim)",
@@ -3743,6 +3747,22 @@ const l = {
3743
3747
  value: "var(--colors-color-palette-inverse-primary)",
3744
3748
  variable: "var(--colors-color-palette-inverse-primary)"
3745
3749
  },
3750
+ "colors.colorPalette.system.color.component.outlineBright": {
3751
+ value: "var(--colors-color-palette-system-color-component-outline-bright)",
3752
+ variable: "var(--colors-color-palette-system-color-component-outline-bright)"
3753
+ },
3754
+ "colors.colorPalette.color.component.outlineBright": {
3755
+ value: "var(--colors-color-palette-color-component-outline-bright)",
3756
+ variable: "var(--colors-color-palette-color-component-outline-bright)"
3757
+ },
3758
+ "colors.colorPalette.component.outlineBright": {
3759
+ value: "var(--colors-color-palette-component-outline-bright)",
3760
+ variable: "var(--colors-color-palette-component-outline-bright)"
3761
+ },
3762
+ "colors.colorPalette.outlineBright": {
3763
+ value: "var(--colors-color-palette-outline-bright)",
3764
+ variable: "var(--colors-color-palette-outline-bright)"
3765
+ },
3746
3766
  "colors.colorPalette.system.color.component.outline": {
3747
3767
  value: "var(--colors-color-palette-system-color-component-outline)",
3748
3768
  variable: "var(--colors-color-palette-system-color-component-outline)"
@@ -3759,21 +3779,21 @@ const l = {
3759
3779
  value: "var(--colors-color-palette-outline)",
3760
3780
  variable: "var(--colors-color-palette-outline)"
3761
3781
  },
3762
- "colors.colorPalette.system.color.component.outlineVariant": {
3763
- value: "var(--colors-color-palette-system-color-component-outline-variant)",
3764
- variable: "var(--colors-color-palette-system-color-component-outline-variant)"
3782
+ "colors.colorPalette.system.color.component.outlineDim": {
3783
+ value: "var(--colors-color-palette-system-color-component-outline-dim)",
3784
+ variable: "var(--colors-color-palette-system-color-component-outline-dim)"
3765
3785
  },
3766
- "colors.colorPalette.color.component.outlineVariant": {
3767
- value: "var(--colors-color-palette-color-component-outline-variant)",
3768
- variable: "var(--colors-color-palette-color-component-outline-variant)"
3786
+ "colors.colorPalette.color.component.outlineDim": {
3787
+ value: "var(--colors-color-palette-color-component-outline-dim)",
3788
+ variable: "var(--colors-color-palette-color-component-outline-dim)"
3769
3789
  },
3770
- "colors.colorPalette.component.outlineVariant": {
3771
- value: "var(--colors-color-palette-component-outline-variant)",
3772
- variable: "var(--colors-color-palette-component-outline-variant)"
3790
+ "colors.colorPalette.component.outlineDim": {
3791
+ value: "var(--colors-color-palette-component-outline-dim)",
3792
+ variable: "var(--colors-color-palette-component-outline-dim)"
3773
3793
  },
3774
- "colors.colorPalette.outlineVariant": {
3775
- value: "var(--colors-color-palette-outline-variant)",
3776
- variable: "var(--colors-color-palette-outline-variant)"
3794
+ "colors.colorPalette.outlineDim": {
3795
+ value: "var(--colors-color-palette-outline-dim)",
3796
+ variable: "var(--colors-color-palette-outline-dim)"
3777
3797
  },
3778
3798
  "colors.colorPalette.system.color.component.scrim": {
3779
3799
  value: "var(--colors-color-palette-system-color-component-scrim)",