@fluentui/react-spinbutton 0.0.0-nightly-20240819-2052.1 → 0.0.0-nightly-20240819-2110.1

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 (6) hide show
  1. package/CHANGELOG.md +13 -22
  2. package/lib/components/SpinButton/useSpinButtonStyles.styles.js +67 -67
  3. package/lib/components/SpinButton/useSpinButtonStyles.styles.js.map +1 -1
  4. package/lib-commonjs/components/SpinButton/useSpinButtonStyles.styles.js +142 -142
  5. package/lib-commonjs/components/SpinButton/useSpinButtonStyles.styles.js.map +1 -1
  6. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -1,35 +1,26 @@
1
1
  # Change Log - @fluentui/react-spinbutton
2
2
 
3
- This log was last generated on Mon, 19 Aug 2024 20:57:19 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 19 Aug 2024 21:20:44 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20240819-2052.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v0.0.0-nightly-20240819-2052.1)
7
+ ## [0.0.0-nightly-20240819-2110.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v0.0.0-nightly-20240819-2110.1)
8
8
 
9
- Mon, 19 Aug 2024 20:57:19 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.84..@fluentui/react-spinbutton_v0.0.0-nightly-20240819-2052.1)
9
+ Mon, 19 Aug 2024 21:20:44 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.83..@fluentui/react-spinbutton_v0.0.0-nightly-20240819-2110.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
16
- - Bump @fluentui/react-field to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
17
- - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
18
- - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
19
- - Bump @fluentui/react-theme to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
20
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
21
- - Bump @fluentui/react-conformance to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
22
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
23
- - Bump @fluentui/react-label to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
24
-
25
- ## [9.2.84](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.84)
26
-
27
- Tue, 30 Jul 2024 18:47:35 GMT
28
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinbutton_v9.2.83..@fluentui/react-spinbutton_v9.2.84)
29
-
30
- ### Patches
31
-
32
- - Bump @fluentui/react-field to v9.1.72 ([PR #32157](https://github.com/microsoft/fluentui/pull/32157) by beachball)
15
+ - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
16
+ - Bump @fluentui/react-field to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
17
+ - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
18
+ - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
19
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
20
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
21
+ - Bump @fluentui/react-conformance to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
22
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
23
+ - Bump @fluentui/react-label to v0.0.0-nightly-20240819-2110.1 ([commit](https://github.com/microsoft/fluentui/commit/99f7b9c0d9c2a4cb1f7dad43045108122895102e) by beachball)
33
24
 
34
25
  ## [9.2.83](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinbutton_v9.2.83)
35
26
 
package/lib/components/SpinButton/useSpinButtonStyles.styles.js CHANGED
@@ -13,9 +13,9 @@ const fieldHeights = {
13
13
  small: '24px',
14
14
  medium: '32px'
15
15
  };
16
- const useRootClassName = /*#__PURE__*/__resetStyles("rh2pj7w", "r1re7sna", {
17
- r: [".rh2pj7w{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;column-gap:var(--1679, var(--1680, var(--spacingHorizontalXS)));row-gap:0;position:relative;isolation:isolate;vertical-align:middle;background-color:var(--1681, var(--1682, var(--colorNeutralBackground1)));min-height:32px;padding:0 0 0 var(--spacingHorizontalMNudge);border-radius:var(--1683, var(--1684, var(--borderRadiusMedium)));}", ".rh2pj7w::before{content:\"\";box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--1685, var(--1686, var(--colorNeutralStrokeAccessible)));border-radius:var(--1687, var(--1688, var(--borderRadiusMedium)));}", ".rh2pj7w::after{box-sizing:border-box;content:\"\";position:absolute;right:0;bottom:0;left:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-left-radius:var(--1689, var(--1690, var(--borderRadiusMedium)));border-bottom-right-radius:var(--1691, var(--1692, var(--borderRadiusMedium)));border-bottom:2px solid var(--colorCompoundBrandStroke);clip-path:inset(calc(100% - 2px) 0 0 0);transform:scaleX(0);transition-property:transform;transition-duration:var(--1693, var(--1694, var(--durationUltraFast)));transition-delay:var(--1695, var(--1696, var(--curveAccelerateMid)));}", ".rh2pj7w:focus-within::after{transform:scaleX(1);transition-property:transform;transition-duration:var(--1697, var(--1698, var(--durationNormal)));transition-delay:var(--1699, var(--1700, var(--curveDecelerateMid)));}", ".rh2pj7w:focus-within:active::after{border-bottom-color:var(--1701, var(--1702, var(--colorCompoundBrandStrokePressed)));}", ".rh2pj7w:focus-within{outline:2px solid transparent;}", ".r1re7sna{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;column-gap:var(--1679, var(--1680, var(--spacingHorizontalXS)));row-gap:0;position:relative;isolation:isolate;vertical-align:middle;background-color:var(--1681, var(--1682, var(--colorNeutralBackground1)));min-height:32px;padding:0 var(--spacingHorizontalMNudge) 0 0;border-radius:var(--1683, var(--1684, var(--borderRadiusMedium)));}", ".r1re7sna::before{content:\"\";box-sizing:border-box;position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--1685, var(--1686, var(--colorNeutralStrokeAccessible)));border-radius:var(--1687, var(--1688, var(--borderRadiusMedium)));}", ".r1re7sna::after{box-sizing:border-box;content:\"\";position:absolute;left:0;bottom:0;right:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-right-radius:var(--1689, var(--1690, var(--borderRadiusMedium)));border-bottom-left-radius:var(--1691, var(--1692, var(--borderRadiusMedium)));border-bottom:2px solid var(--colorCompoundBrandStroke);clip-path:inset(calc(100% - 2px) 0 0 0);transform:scaleX(0);transition-property:transform;transition-duration:var(--1693, var(--1694, var(--durationUltraFast)));transition-delay:var(--1695, var(--1696, var(--curveAccelerateMid)));}", ".r1re7sna:focus-within::after{transform:scaleX(1);transition-property:transform;transition-duration:var(--1697, var(--1698, var(--durationNormal)));transition-delay:var(--1699, var(--1700, var(--curveDecelerateMid)));}", ".r1re7sna:focus-within:active::after{border-bottom-color:var(--1701, var(--1702, var(--colorCompoundBrandStrokePressed)));}", ".r1re7sna:focus-within{outline:2px solid transparent;}"],
18
- s: ["@media screen and (prefers-reduced-motion: reduce){.rh2pj7w::after{transition-duration:0.01ms;transition-delay:0.01ms;}}", "@media screen and (prefers-reduced-motion: reduce){.rh2pj7w:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}", "@media screen and (prefers-reduced-motion: reduce){.r1re7sna::after{transition-duration:0.01ms;transition-delay:0.01ms;}}", "@media screen and (prefers-reduced-motion: reduce){.r1re7sna:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}"]
16
+ const useRootClassName = /*#__PURE__*/__resetStyles("rh3jdeq", "r5s979w", {
17
+ r: [".rh3jdeq{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;column-gap:var(--ctrl-token-SpinButton-1679, var(--semantic-token-SpinButton-1680, var(--spacingHorizontalXS)));row-gap:0;position:relative;isolation:isolate;vertical-align:middle;background-color:var(--ctrl-token-SpinButton-1681, var(--semantic-token-SpinButton-1682, var(--colorNeutralBackground1)));min-height:32px;padding:0 0 0 var(--spacingHorizontalMNudge);border-radius:var(--ctrl-token-SpinButton-1683, var(--semantic-token-SpinButton-1684, var(--borderRadiusMedium)));}", ".rh3jdeq::before{content:\"\";box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--ctrl-token-SpinButton-1685, var(--semantic-token-SpinButton-1686, var(--colorNeutralStrokeAccessible)));border-radius:var(--ctrl-token-SpinButton-1687, var(--semantic-token-SpinButton-1688, var(--borderRadiusMedium)));}", ".rh3jdeq::after{box-sizing:border-box;content:\"\";position:absolute;right:0;bottom:0;left:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-left-radius:var(--ctrl-token-SpinButton-1689, var(--semantic-token-SpinButton-1690, var(--borderRadiusMedium)));border-bottom-right-radius:var(--ctrl-token-SpinButton-1691, var(--semantic-token-SpinButton-1692, var(--borderRadiusMedium)));border-bottom:2px solid var(--colorCompoundBrandStroke);clip-path:inset(calc(100% - 2px) 0 0 0);transform:scaleX(0);transition-property:transform;transition-duration:var(--ctrl-token-SpinButton-1693, var(--semantic-token-SpinButton-1694, var(--durationUltraFast)));transition-delay:var(--ctrl-token-SpinButton-1695, var(--semantic-token-SpinButton-1696, var(--curveAccelerateMid)));}", ".rh3jdeq:focus-within::after{transform:scaleX(1);transition-property:transform;transition-duration:var(--ctrl-token-SpinButton-1697, var(--semantic-token-SpinButton-1698, var(--durationNormal)));transition-delay:var(--ctrl-token-SpinButton-1699, var(--semantic-token-SpinButton-1700, var(--curveDecelerateMid)));}", ".rh3jdeq:focus-within:active::after{border-bottom-color:var(--ctrl-token-SpinButton-1701, var(--semantic-token-SpinButton-1702, var(--colorCompoundBrandStrokePressed)));}", ".rh3jdeq:focus-within{outline:2px solid transparent;}", ".r5s979w{display:inline-grid;grid-template-columns:1fr 24px;grid-template-rows:1fr 1fr;column-gap:var(--ctrl-token-SpinButton-1679, var(--semantic-token-SpinButton-1680, var(--spacingHorizontalXS)));row-gap:0;position:relative;isolation:isolate;vertical-align:middle;background-color:var(--ctrl-token-SpinButton-1681, var(--semantic-token-SpinButton-1682, var(--colorNeutralBackground1)));min-height:32px;padding:0 var(--spacingHorizontalMNudge) 0 0;border-radius:var(--ctrl-token-SpinButton-1683, var(--semantic-token-SpinButton-1684, var(--borderRadiusMedium)));}", ".r5s979w::before{content:\"\";box-sizing:border-box;position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none;z-index:10;border:1px solid var(--colorNeutralStroke1);border-bottom-color:var(--ctrl-token-SpinButton-1685, var(--semantic-token-SpinButton-1686, var(--colorNeutralStrokeAccessible)));border-radius:var(--ctrl-token-SpinButton-1687, var(--semantic-token-SpinButton-1688, var(--borderRadiusMedium)));}", ".r5s979w::after{box-sizing:border-box;content:\"\";position:absolute;left:0;bottom:0;right:0;z-index:20;height:max(2px, var(--borderRadiusMedium));border-bottom-right-radius:var(--ctrl-token-SpinButton-1689, var(--semantic-token-SpinButton-1690, var(--borderRadiusMedium)));border-bottom-left-radius:var(--ctrl-token-SpinButton-1691, var(--semantic-token-SpinButton-1692, var(--borderRadiusMedium)));border-bottom:2px solid var(--colorCompoundBrandStroke);clip-path:inset(calc(100% - 2px) 0 0 0);transform:scaleX(0);transition-property:transform;transition-duration:var(--ctrl-token-SpinButton-1693, var(--semantic-token-SpinButton-1694, var(--durationUltraFast)));transition-delay:var(--ctrl-token-SpinButton-1695, var(--semantic-token-SpinButton-1696, var(--curveAccelerateMid)));}", ".r5s979w:focus-within::after{transform:scaleX(1);transition-property:transform;transition-duration:var(--ctrl-token-SpinButton-1697, var(--semantic-token-SpinButton-1698, var(--durationNormal)));transition-delay:var(--ctrl-token-SpinButton-1699, var(--semantic-token-SpinButton-1700, var(--curveDecelerateMid)));}", ".r5s979w:focus-within:active::after{border-bottom-color:var(--ctrl-token-SpinButton-1701, var(--semantic-token-SpinButton-1702, var(--colorCompoundBrandStrokePressed)));}", ".r5s979w:focus-within{outline:2px solid transparent;}"],
18
+ s: ["@media screen and (prefers-reduced-motion: reduce){.rh3jdeq::after{transition-duration:0.01ms;transition-delay:0.01ms;}}", "@media screen and (prefers-reduced-motion: reduce){.rh3jdeq:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}", "@media screen and (prefers-reduced-motion: reduce){.r5s979w::after{transition-duration:0.01ms;transition-delay:0.01ms;}}", "@media screen and (prefers-reduced-motion: reduce){.r5s979w:focus-within::after{transition-duration:0.01ms;transition-delay:0.01ms;}}"]
19
19
  });
20
20
  const useRootStyles = /*#__PURE__*/__styles({
21
21
  small: {
@@ -24,18 +24,18 @@ const useRootStyles = /*#__PURE__*/__styles({
24
24
  Be2twd7: "fy9rknc",
25
25
  Bhrd7zp: "figsok6",
26
26
  Bg96gwp: "fwrc4pm",
27
- uwmqm3: ["f1sx6ail", "f1250ga"]
27
+ uwmqm3: ["f1j8zwyv", "f1vlli27"]
28
28
  },
29
29
  medium: {},
30
30
  outline: {},
31
31
  outlineInteractive: {
32
32
  Bo3r8zu: "f1w2y1rc",
33
33
  Hpvxnh: ["f1gofhvl", "f18htlvq"],
34
- Bx11ytk: "f1bad2pt",
34
+ Bx11ytk: "f1lfd2ic",
35
35
  B1rg0w0: ["f18htlvq", "f1gofhvl"],
36
36
  Bsg1tlv: "f6lmxco",
37
37
  Brjw370: ["fcoc0mf", "f15r4wkl"],
38
- xcfy85: "f1l3wxm7",
38
+ xcfy85: "f1v3sfeo",
39
39
  Bcc6kan: ["f15r4wkl", "fcoc0mf"]
40
40
  },
41
41
  underline: {
@@ -47,16 +47,16 @@ const useRootStyles = /*#__PURE__*/__styles({
47
47
  Budzafs: 0,
48
48
  ck0cow: 0,
49
49
  n07z76: 0,
50
- Gng75u: "f1etb4uy"
50
+ Gng75u: "f1dg5oo6"
51
51
  },
52
52
  underlineInteractive: {
53
- Bx11ytk: "f1lknskg",
54
- xcfy85: "f189p366",
53
+ Bx11ytk: "f1iwfssu",
54
+ xcfy85: "f1qekkkg",
55
55
  d9w3h3: 0,
56
56
  B3778ie: 0,
57
57
  B4j8arr: 0,
58
58
  Bl18szs: 0,
59
- Blrzh8d: "ft2z7b7"
59
+ Blrzh8d: "f1se4ths"
60
60
  },
61
61
  filled: {
62
62
  Bcgcnre: 0,
@@ -78,10 +78,10 @@ const useRootStyles = /*#__PURE__*/__styles({
78
78
  kj8mxx: "f1kc0wz4"
79
79
  },
80
80
  "filled-darker": {
81
- De3pzq: "f180mb56"
81
+ De3pzq: "f1e5utr6"
82
82
  },
83
83
  "filled-lighter": {
84
- De3pzq: "f40f0c1"
84
+ De3pzq: "fcco06x"
85
85
  },
86
86
  filledInteractive: {
87
87
  B05mzqr: "f1xqt08",
@@ -97,7 +97,7 @@ const useRootStyles = /*#__PURE__*/__styles({
97
97
  },
98
98
  disabled: {
99
99
  Bceei9c: "fdrzuqr",
100
- De3pzq: "frnma1a",
100
+ De3pzq: "f15wxwvh",
101
101
  Bq4z7u6: "f1a0lfh7",
102
102
  Bk5zm6e: ["f1p2ejm6", "fmzytvz"],
103
103
  Bqjgrrk: "fas2e61",
@@ -108,15 +108,15 @@ const useRootStyles = /*#__PURE__*/__styles({
108
108
  Imo2if: ["frjp63v", "f1lclws"]
109
109
  }
110
110
  }, {
111
- d: [".f1pha7fy{min-height:24px;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1sx6ail{padding-left:var(--1703, var(--1704, var(--spacingHorizontalS)));}", ".f1250ga{padding-right:var(--1703, var(--1704, var(--spacingHorizontalS)));}", ".f1o236ok::before{border-top-width:0;}", ".faeg28l::before{border-right-width:0;}", ".f64aojp::before{border-left-width:0;}", ".fdw6hkg::before{border-bottom-width:1px;}", [".f1etb4uy::before{border-radius:var(--1709, var(--1710, var(--borderRadiusNone)));}", {
111
+ d: [".f1pha7fy{min-height:24px;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1j8zwyv{padding-left:var(--ctrl-token-SpinButton-1703, var(--semantic-token-SpinButton-1704, var(--spacingHorizontalS)));}", ".f1vlli27{padding-right:var(--ctrl-token-SpinButton-1703, var(--semantic-token-SpinButton-1704, var(--spacingHorizontalS)));}", ".f1o236ok::before{border-top-width:0;}", ".faeg28l::before{border-right-width:0;}", ".f64aojp::before{border-left-width:0;}", ".fdw6hkg::before{border-bottom-width:1px;}", [".f1dg5oo6::before{border-radius:var(--ctrl-token-SpinButton-1709, var(--semantic-token-SpinButton-1710, var(--borderRadiusNone)));}", {
112
112
  p: -1
113
- }], [".ft2z7b7::after{border-radius:var(--1715, var(--1716, var(--borderRadiusNone)));}", {
113
+ }], [".f1se4ths::after{border-radius:var(--ctrl-token-SpinButton-1715, var(--semantic-token-SpinButton-1716, var(--borderRadiusNone)));}", {
114
114
  p: -1
115
115
  }], [".f1kc0wz4::before{border:1px solid var(--colorTransparentStroke);}", {
116
116
  p: -2
117
- }], ".f180mb56{background-color:var(--1717, var(--1718, var(--colorNeutralBackground3)));}", ".f40f0c1{background-color:var(--1719, var(--1720, var(--colorNeutralBackground1)));}", ".fl48pg9:not(:focus-within)::before,.fl48pg9:hover:not(:focus-within)::before{border-top-color:var(--colorPaletteRedBorder2);}", ".f1a168p3:not(:focus-within)::before,.f1a168p3:hover:not(:focus-within)::before{border-right-color:var(--colorPaletteRedBorder2);}", ".f1pvdymy:not(:focus-within)::before,.f1pvdymy:hover:not(:focus-within)::before{border-left-color:var(--colorPaletteRedBorder2);}", ".f11knvgl:not(:focus-within)::before,.f11knvgl:hover:not(:focus-within)::before{border-bottom-color:var(--colorPaletteRedBorder2);}", ".fdrzuqr{cursor:not-allowed;}", ".frnma1a{background-color:var(--1721, var(--1722, var(--colorTransparentBackground)));}", ".f1a0lfh7::before{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f1p2ejm6::before{border-right-color:var(--colorNeutralStrokeDisabled);}", ".fmzytvz::before{border-left-color:var(--colorNeutralStrokeDisabled);}", ".fas2e61::before{border-bottom-color:var(--colorNeutralStrokeDisabled);}"],
118
- h: [".f1w2y1rc:hover::before{border-top-color:var(--colorNeutralStroke1Hover);}", ".f1gofhvl:hover::before{border-right-color:var(--colorNeutralStroke1Hover);}", ".f18htlvq:hover::before{border-left-color:var(--colorNeutralStroke1Hover);}", ".f1bad2pt:hover::before{border-bottom-color:var(--1705, var(--1706, var(--colorNeutralStrokeAccessibleHover)));}", ".f1lknskg:hover::before{border-bottom-color:var(--1711, var(--1712, var(--colorNeutralStrokeAccessibleHover)));}", ".f1xqt08:hover::before,.f1xqt08:focus-within::before{border-top-color:var(--colorTransparentStrokeInteractive);}", ".fzt5lgo:hover::before,.fzt5lgo:focus-within::before{border-right-color:var(--colorTransparentStrokeInteractive);}", ".f8tv3r9:hover::before,.f8tv3r9:focus-within::before{border-left-color:var(--colorTransparentStrokeInteractive);}", ".fyhrops:hover::before,.fyhrops:focus-within::before{border-bottom-color:var(--colorTransparentStrokeInteractive);}"],
119
- a: [".f6lmxco:active::before,.f6lmxco:focus-within::before{border-top-color:var(--colorNeutralStroke1Pressed);}", ".fcoc0mf:active::before,.fcoc0mf:focus-within::before{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f15r4wkl:active::before,.f15r4wkl:focus-within::before{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1l3wxm7:active::before,.f1l3wxm7:focus-within::before{border-bottom-color:var(--1707, var(--1708, var(--colorNeutralStrokeAccessiblePressed)));}", ".f189p366:active::before,.f189p366:focus-within::before{border-bottom-color:var(--1713, var(--1714, var(--colorNeutralStrokeAccessiblePressed)));}"],
117
+ }], ".f1e5utr6{background-color:var(--ctrl-token-SpinButton-1717, var(--semantic-token-SpinButton-1718, var(--colorNeutralBackground3)));}", ".fcco06x{background-color:var(--ctrl-token-SpinButton-1719, var(--semantic-token-SpinButton-1720, var(--colorNeutralBackground1)));}", ".fl48pg9:not(:focus-within)::before,.fl48pg9:hover:not(:focus-within)::before{border-top-color:var(--colorPaletteRedBorder2);}", ".f1a168p3:not(:focus-within)::before,.f1a168p3:hover:not(:focus-within)::before{border-right-color:var(--colorPaletteRedBorder2);}", ".f1pvdymy:not(:focus-within)::before,.f1pvdymy:hover:not(:focus-within)::before{border-left-color:var(--colorPaletteRedBorder2);}", ".f11knvgl:not(:focus-within)::before,.f11knvgl:hover:not(:focus-within)::before{border-bottom-color:var(--colorPaletteRedBorder2);}", ".fdrzuqr{cursor:not-allowed;}", ".f15wxwvh{background-color:var(--ctrl-token-SpinButton-1721, var(--semantic-token-SpinButton-1722, var(--colorTransparentBackground)));}", ".f1a0lfh7::before{border-top-color:var(--colorNeutralStrokeDisabled);}", ".f1p2ejm6::before{border-right-color:var(--colorNeutralStrokeDisabled);}", ".fmzytvz::before{border-left-color:var(--colorNeutralStrokeDisabled);}", ".fas2e61::before{border-bottom-color:var(--colorNeutralStrokeDisabled);}"],
118
+ h: [".f1w2y1rc:hover::before{border-top-color:var(--colorNeutralStroke1Hover);}", ".f1gofhvl:hover::before{border-right-color:var(--colorNeutralStroke1Hover);}", ".f18htlvq:hover::before{border-left-color:var(--colorNeutralStroke1Hover);}", ".f1lfd2ic:hover::before{border-bottom-color:var(--ctrl-token-SpinButton-1705, var(--semantic-token-SpinButton-1706, var(--colorNeutralStrokeAccessibleHover)));}", ".f1iwfssu:hover::before{border-bottom-color:var(--ctrl-token-SpinButton-1711, var(--semantic-token-SpinButton-1712, var(--colorNeutralStrokeAccessibleHover)));}", ".f1xqt08:hover::before,.f1xqt08:focus-within::before{border-top-color:var(--colorTransparentStrokeInteractive);}", ".fzt5lgo:hover::before,.fzt5lgo:focus-within::before{border-right-color:var(--colorTransparentStrokeInteractive);}", ".f8tv3r9:hover::before,.f8tv3r9:focus-within::before{border-left-color:var(--colorTransparentStrokeInteractive);}", ".fyhrops:hover::before,.fyhrops:focus-within::before{border-bottom-color:var(--colorTransparentStrokeInteractive);}"],
119
+ a: [".f6lmxco:active::before,.f6lmxco:focus-within::before{border-top-color:var(--colorNeutralStroke1Pressed);}", ".fcoc0mf:active::before,.fcoc0mf:focus-within::before{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f15r4wkl:active::before,.f15r4wkl:focus-within::before{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1v3sfeo:active::before,.f1v3sfeo:focus-within::before{border-bottom-color:var(--ctrl-token-SpinButton-1707, var(--semantic-token-SpinButton-1708, var(--colorNeutralStrokeAccessiblePressed)));}", ".f1qekkkg:active::before,.f1qekkkg:focus-within::before{border-bottom-color:var(--ctrl-token-SpinButton-1713, var(--semantic-token-SpinButton-1714, var(--colorNeutralStrokeAccessiblePressed)));}"],
120
120
  m: [["@media (forced-colors: active){.flb8es4::before{border-top-color:GrayText;}}", {
121
121
  m: "(forced-colors: active)"
122
122
  }], ["@media (forced-colors: active){.f1lclws::before{border-right-color:GrayText;}.frjp63v::before{border-left-color:GrayText;}}", {
@@ -125,28 +125,28 @@ const useRootStyles = /*#__PURE__*/__styles({
125
125
  m: "(forced-colors: active)"
126
126
  }]]
127
127
  });
128
- const useInputClassName = /*#__PURE__*/__resetStyles("ro8hqci", null, [".ro8hqci{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--1723, var(--1724, var(--colorNeutralForeground1)));background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;width:100%;}", ".ro8hqci::-webkit-input-placeholder{color:var(--1725, var(--1726, var(--colorNeutralForeground4)));opacity:1;}", ".ro8hqci::-moz-placeholder{color:var(--1725, var(--1726, var(--colorNeutralForeground4)));opacity:1;}", ".ro8hqci::placeholder{color:var(--1725, var(--1726, var(--colorNeutralForeground4)));opacity:1;}"]);
128
+ const useInputClassName = /*#__PURE__*/__resetStyles("r2hmsw2", null, [".r2hmsw2{grid-column-start:1;grid-column-end:2;grid-row-start:1;grid-row-end:3;outline-style:none;border:0;padding:0;color:var(--ctrl-token-SpinButton-1723, var(--semantic-token-SpinButton-1724, var(--colorNeutralForeground1)));background-color:transparent;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;width:100%;}", ".r2hmsw2::-webkit-input-placeholder{color:var(--ctrl-token-SpinButton-1725, var(--semantic-token-SpinButton-1726, var(--colorNeutralForeground4)));opacity:1;}", ".r2hmsw2::-moz-placeholder{color:var(--ctrl-token-SpinButton-1725, var(--semantic-token-SpinButton-1726, var(--colorNeutralForeground4)));opacity:1;}", ".r2hmsw2::placeholder{color:var(--ctrl-token-SpinButton-1725, var(--semantic-token-SpinButton-1726, var(--colorNeutralForeground4)));opacity:1;}"]);
129
129
  const useInputStyles = /*#__PURE__*/__styles({
130
130
  disabled: {
131
- sj55zd: "f1dkgjv9",
131
+ sj55zd: "f1xwzfv3",
132
132
  Bceei9c: "fdrzuqr",
133
- De3pzq: "f601p4",
134
- yvdlaj: "f1v02krl"
133
+ De3pzq: "fwiaa8s",
134
+ yvdlaj: "fv3kiq7"
135
135
  }
136
136
  }, {
137
- d: [".f1dkgjv9{color:var(--1727, var(--1728, var(--colorNeutralForegroundDisabled)));}", ".fdrzuqr{cursor:not-allowed;}", ".f601p4{background-color:var(--1729, var(--1730, var(--colorTransparentBackground)));}", ".f1v02krl::-webkit-input-placeholder{color:var(--1731, var(--1732, var(--colorNeutralForegroundDisabled)));}", ".f1v02krl::-moz-placeholder{color:var(--1731, var(--1732, var(--colorNeutralForegroundDisabled)));}"]
137
+ d: [".f1xwzfv3{color:var(--ctrl-token-SpinButton-1727, var(--semantic-token-SpinButton-1728, var(--colorNeutralForegroundDisabled)));}", ".fdrzuqr{cursor:not-allowed;}", ".fwiaa8s{background-color:var(--ctrl-token-SpinButton-1729, var(--semantic-token-SpinButton-1730, var(--colorTransparentBackground)));}", ".fv3kiq7::-webkit-input-placeholder{color:var(--ctrl-token-SpinButton-1731, var(--semantic-token-SpinButton-1732, var(--colorNeutralForegroundDisabled)));}", ".fv3kiq7::-moz-placeholder{color:var(--ctrl-token-SpinButton-1731, var(--semantic-token-SpinButton-1732, var(--colorNeutralForegroundDisabled)));}"]
138
138
  });
139
- const useBaseButtonClassName = /*#__PURE__*/__resetStyles("r1ortv9s", null, [".r1ortv9s{display:inline-flex;width:24px;align-items:center;justify-content:center;border:0;position:absolute;outline-style:none;height:16px;background-color:transparent;color:var(--1733, var(--1734, var(--colorNeutralForeground3)));grid-column-start:2;border-radius:0;padding:0 5px 0 5px;}", ".r1ortv9s:active{outline-style:none;}", ".r1ortv9s:enabled:hover{cursor:pointer;color:var(--1735, var(--1736, var(--colorNeutralForeground3Hover)));background-color:var(--1737, var(--1738, var(--colorSubtleBackgroundHover)));}", ".r1ortv9s:enabled:active{color:var(--1739, var(--1740, var(--colorNeutralForeground3Pressed)));background-color:var(--1741, var(--1742, var(--colorSubtleBackgroundPressed)));}", ".r1ortv9s:enabled.fui-SpinButton__button_active{color:var(--1743, var(--1744, var(--colorNeutralForeground3Pressed)));background-color:var(--1745, var(--1746, var(--colorSubtleBackgroundPressed)));}", ".r1ortv9s:disabled{cursor:not-allowed;color:var(--1747, var(--1748, var(--colorNeutralForegroundDisabled)));}"]);
139
+ const useBaseButtonClassName = /*#__PURE__*/__resetStyles("r1bfueos", null, [".r1bfueos{display:inline-flex;width:24px;align-items:center;justify-content:center;border:0;position:absolute;outline-style:none;height:16px;background-color:transparent;color:var(--ctrl-token-SpinButton-1733, var(--semantic-token-SpinButton-1734, var(--colorNeutralForeground3)));grid-column-start:2;border-radius:0;padding:0 5px 0 5px;}", ".r1bfueos:active{outline-style:none;}", ".r1bfueos:enabled:hover{cursor:pointer;color:var(--ctrl-token-SpinButton-1735, var(--semantic-token-SpinButton-1736, var(--colorNeutralForeground3Hover)));background-color:var(--ctrl-token-SpinButton-1737, var(--semantic-token-SpinButton-1738, var(--colorSubtleBackgroundHover)));}", ".r1bfueos:enabled:active{color:var(--ctrl-token-SpinButton-1739, var(--semantic-token-SpinButton-1740, var(--colorNeutralForeground3Pressed)));background-color:var(--ctrl-token-SpinButton-1741, var(--semantic-token-SpinButton-1742, var(--colorSubtleBackgroundPressed)));}", ".r1bfueos:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1743, var(--semantic-token-SpinButton-1744, var(--colorNeutralForeground3Pressed)));background-color:var(--ctrl-token-SpinButton-1745, var(--semantic-token-SpinButton-1746, var(--colorSubtleBackgroundPressed)));}", ".r1bfueos:disabled{cursor:not-allowed;color:var(--ctrl-token-SpinButton-1747, var(--semantic-token-SpinButton-1748, var(--colorNeutralForegroundDisabled)));}"]);
140
140
  const useButtonStyles = /*#__PURE__*/__styles({
141
141
  increment: {
142
142
  Ijaq50: "f16hsg94",
143
- B7oj6ja: ["f1enkjru", "fc0d0l3"],
143
+ B7oj6ja: ["f14jfzwc", "f1p51xtu"],
144
144
  z8tnut: "f10ra9hq",
145
145
  Byoj8tv: "f1brlhvm"
146
146
  },
147
147
  decrement: {
148
148
  Ijaq50: "faunodf",
149
- Bbmb7ep: ["f1itypd8", "f1njhcie"],
149
+ Bbmb7ep: ["f1gl9ztj", "fekja2g"],
150
150
  z8tnut: "f1sl3k7w",
151
151
  Byoj8tv: "f1y2xyjm"
152
152
  },
@@ -169,37 +169,37 @@ const useButtonStyles = /*#__PURE__*/__styles({
169
169
  outline: {},
170
170
  underline: {
171
171
  De3pzq: "f3rmtva",
172
- sj55zd: "fl79i16",
173
- r4wkhp: "f1sx7h5e",
174
- B95qlz1: "f18iwgzt",
175
- p743kt: "f1lq3bel",
176
- B7xitij: "f1ljbul0",
177
- B6siaa6: "fjghton",
178
- Ba9qmo4: "f8vy5o4",
179
- Dyrjrp: "fzvsvgq"
172
+ sj55zd: "ftjtjgg",
173
+ r4wkhp: "fmxr6h1",
174
+ B95qlz1: "f159rbb9",
175
+ p743kt: "f1f61phu",
176
+ B7xitij: "f11bru7e",
177
+ B6siaa6: "f1wnbjcb",
178
+ Ba9qmo4: "f19zu09e",
179
+ Dyrjrp: "f59gf7h"
180
180
  },
181
181
  "filled-darker": {
182
182
  De3pzq: "f3rmtva",
183
- sj55zd: "f1289gkm",
184
- r4wkhp: "f1eyi9o",
185
- B95qlz1: "f1ycivh3",
186
- p743kt: "f11ekxri",
187
- B7xitij: "f1d7dyj1",
188
- B6siaa6: "f1rb3mog",
189
- Ba9qmo4: "f13ipcz7",
190
- Dyrjrp: "flb91bu"
183
+ sj55zd: "ftz87y7",
184
+ r4wkhp: "fyzdehd",
185
+ B95qlz1: "f1t0huit",
186
+ p743kt: "fqvhx9d",
187
+ B7xitij: "f52eh0d",
188
+ B6siaa6: "fzhlmla",
189
+ Ba9qmo4: "f3v2m6a",
190
+ Dyrjrp: "f50q7fd"
191
191
  },
192
192
  "filled-lighter": {
193
193
  De3pzq: "f3rmtva",
194
- sj55zd: "fn4nw2l",
195
- r4wkhp: "f1inmhgz",
196
- B95qlz1: "fv10ljp",
197
- drw0cw: "f3gty43",
198
- idzz8t: "fuweiaj",
199
- Dyrjrp: "fd13w83"
194
+ sj55zd: "ff0mds",
195
+ r4wkhp: "fc4lrwn",
196
+ B95qlz1: "fwg3vk8",
197
+ drw0cw: "fzac2m3",
198
+ idzz8t: "fdfsw6w",
199
+ Dyrjrp: "f9zhxxo"
200
200
  }
201
201
  }, {
202
- d: [".f16hsg94{grid-row-start:1;}", ".f1enkjru{border-top-right-radius:var(--1749, var(--1750, var(--borderRadiusMedium)));}", ".fc0d0l3{border-top-left-radius:var(--1749, var(--1750, var(--borderRadiusMedium)));}", ".f10ra9hq{padding-top:4px;}", ".f1brlhvm{padding-bottom:1px;}", ".faunodf{grid-row-start:2;}", ".f1itypd8{border-bottom-right-radius:var(--1751, var(--1752, var(--borderRadiusMedium)));}", ".f1njhcie{border-bottom-left-radius:var(--1751, var(--1752, var(--borderRadiusMedium)));}", ".f1sl3k7w{padding-top:1px;}", ".f1y2xyjm{padding-bottom:4px;}", [".f4lv8q1{padding:3px 6px 0px 4px;}", {
202
+ d: [".f16hsg94{grid-row-start:1;}", ".f14jfzwc{border-top-right-radius:var(--ctrl-token-SpinButton-1749, var(--semantic-token-SpinButton-1750, var(--borderRadiusMedium)));}", ".f1p51xtu{border-top-left-radius:var(--ctrl-token-SpinButton-1749, var(--semantic-token-SpinButton-1750, var(--borderRadiusMedium)));}", ".f10ra9hq{padding-top:4px;}", ".f1brlhvm{padding-bottom:1px;}", ".faunodf{grid-row-start:2;}", ".f1gl9ztj{border-bottom-right-radius:var(--ctrl-token-SpinButton-1751, var(--semantic-token-SpinButton-1752, var(--borderRadiusMedium)));}", ".fekja2g{border-bottom-left-radius:var(--ctrl-token-SpinButton-1751, var(--semantic-token-SpinButton-1752, var(--borderRadiusMedium)));}", ".f1sl3k7w{padding-top:1px;}", ".f1y2xyjm{padding-bottom:4px;}", [".f4lv8q1{padding:3px 6px 0px 4px;}", {
203
203
  p: -1
204
204
  }], [".fm3uwd2{padding:3px 4px 0px 6px;}", {
205
205
  p: -1
@@ -207,7 +207,7 @@ const useButtonStyles = /*#__PURE__*/__styles({
207
207
  p: -1
208
208
  }], [".frkrfqj{padding:0px 4px 3px 6px;}", {
209
209
  p: -1
210
- }], ".f3rmtva{background-color:transparent;}", ".fl79i16{color:var(--1753, var(--1754, var(--colorNeutralForeground3)));}", ".f1sx7h5e:enabled:hover{color:var(--1755, var(--1756, var(--colorNeutralForeground3Hover)));}", ".f18iwgzt:enabled:hover{background-color:var(--1757, var(--1758, var(--colorSubtleBackgroundHover)));}", ".f1lq3bel:enabled:active{color:var(--1759, var(--1760, var(--colorNeutralForeground3Pressed)));}", ".f1ljbul0:enabled:active{background-color:var(--1761, var(--1762, var(--colorSubtleBackgroundPressed)));}", ".fjghton:enabled.fui-SpinButton__button_active{color:var(--1763, var(--1764, var(--colorNeutralForeground3Pressed)));}", ".f8vy5o4:enabled.fui-SpinButton__button_active{background-color:var(--1765, var(--1766, var(--colorSubtleBackgroundPressed)));}", ".fzvsvgq:disabled{color:var(--1767, var(--1768, var(--colorNeutralForegroundDisabled)));}", ".f1289gkm{color:var(--1769, var(--1770, var(--colorNeutralForeground3)));}", ".f1eyi9o:enabled:hover{color:var(--1771, var(--1772, var(--colorNeutralForeground3Hover)));}", ".f1ycivh3:enabled:hover{background-color:var(--1773, var(--1774, var(--colorNeutralBackground3Hover)));}", ".f11ekxri:enabled:active{color:var(--1775, var(--1776, var(--colorNeutralForeground3Pressed)));}", ".f1d7dyj1:enabled:active{background-color:var(--1777, var(--1778, var(--colorNeutralBackground3Pressed)));}", ".f1rb3mog:enabled.fui-SpinButton__button_active{color:var(--1779, var(--1780, var(--colorNeutralForeground3Pressed)));}", ".f13ipcz7:enabled.fui-SpinButton__button_active{background-color:var(--1781, var(--1782, var(--colorNeutralBackground3Pressed)));}", ".flb91bu:disabled{color:var(--1783, var(--1784, var(--colorNeutralForegroundDisabled)));}", ".fn4nw2l{color:var(--1785, var(--1786, var(--colorNeutralForeground3)));}", ".f1inmhgz:enabled:hover{color:var(--1787, var(--1788, var(--colorNeutralForeground3Hover)));}", ".fv10ljp:enabled:hover{background-color:var(--1789, var(--1790, var(--colorNeutralBackground1Hover)));}", ".f3gty43:enabled:active,.f3gty43:enabled.fui-SpinButton__button_active{color:var(--1791, var(--1792, var(--colorNeutralForeground3Pressed)));}", ".fuweiaj:enabled:active,.fuweiaj:enabled.fui-SpinButton__button_active{background-color:var(--1793, var(--1794, var(--colorNeutralBackground1Pressed)));}", ".fd13w83:disabled{color:var(--1795, var(--1796, var(--colorNeutralForegroundDisabled)));}"]
210
+ }], ".f3rmtva{background-color:transparent;}", ".ftjtjgg{color:var(--ctrl-token-SpinButton-1753, var(--semantic-token-SpinButton-1754, var(--colorNeutralForeground3)));}", ".fmxr6h1:enabled:hover{color:var(--ctrl-token-SpinButton-1755, var(--semantic-token-SpinButton-1756, var(--colorNeutralForeground3Hover)));}", ".f159rbb9:enabled:hover{background-color:var(--ctrl-token-SpinButton-1757, var(--semantic-token-SpinButton-1758, var(--colorSubtleBackgroundHover)));}", ".f1f61phu:enabled:active{color:var(--ctrl-token-SpinButton-1759, var(--semantic-token-SpinButton-1760, var(--colorNeutralForeground3Pressed)));}", ".f11bru7e:enabled:active{background-color:var(--ctrl-token-SpinButton-1761, var(--semantic-token-SpinButton-1762, var(--colorSubtleBackgroundPressed)));}", ".f1wnbjcb:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1763, var(--semantic-token-SpinButton-1764, var(--colorNeutralForeground3Pressed)));}", ".f19zu09e:enabled.fui-SpinButton__button_active{background-color:var(--ctrl-token-SpinButton-1765, var(--semantic-token-SpinButton-1766, var(--colorSubtleBackgroundPressed)));}", ".f59gf7h:disabled{color:var(--ctrl-token-SpinButton-1767, var(--semantic-token-SpinButton-1768, var(--colorNeutralForegroundDisabled)));}", ".ftz87y7{color:var(--ctrl-token-SpinButton-1769, var(--semantic-token-SpinButton-1770, var(--colorNeutralForeground3)));}", ".fyzdehd:enabled:hover{color:var(--ctrl-token-SpinButton-1771, var(--semantic-token-SpinButton-1772, var(--colorNeutralForeground3Hover)));}", ".f1t0huit:enabled:hover{background-color:var(--ctrl-token-SpinButton-1773, var(--semantic-token-SpinButton-1774, var(--colorNeutralBackground3Hover)));}", ".fqvhx9d:enabled:active{color:var(--ctrl-token-SpinButton-1775, var(--semantic-token-SpinButton-1776, var(--colorNeutralForeground3Pressed)));}", ".f52eh0d:enabled:active{background-color:var(--ctrl-token-SpinButton-1777, var(--semantic-token-SpinButton-1778, var(--colorNeutralBackground3Pressed)));}", ".fzhlmla:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1779, var(--semantic-token-SpinButton-1780, var(--colorNeutralForeground3Pressed)));}", ".f3v2m6a:enabled.fui-SpinButton__button_active{background-color:var(--ctrl-token-SpinButton-1781, var(--semantic-token-SpinButton-1782, var(--colorNeutralBackground3Pressed)));}", ".f50q7fd:disabled{color:var(--ctrl-token-SpinButton-1783, var(--semantic-token-SpinButton-1784, var(--colorNeutralForegroundDisabled)));}", ".ff0mds{color:var(--ctrl-token-SpinButton-1785, var(--semantic-token-SpinButton-1786, var(--colorNeutralForeground3)));}", ".fc4lrwn:enabled:hover{color:var(--ctrl-token-SpinButton-1787, var(--semantic-token-SpinButton-1788, var(--colorNeutralForeground3Hover)));}", ".fwg3vk8:enabled:hover{background-color:var(--ctrl-token-SpinButton-1789, var(--semantic-token-SpinButton-1790, var(--colorNeutralBackground1Hover)));}", ".fzac2m3:enabled:active,.fzac2m3:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1791, var(--semantic-token-SpinButton-1792, var(--colorNeutralForeground3Pressed)));}", ".fdfsw6w:enabled:active,.fdfsw6w:enabled.fui-SpinButton__button_active{background-color:var(--ctrl-token-SpinButton-1793, var(--semantic-token-SpinButton-1794, var(--colorNeutralBackground1Pressed)));}", ".f9zhxxo:disabled{color:var(--ctrl-token-SpinButton-1795, var(--semantic-token-SpinButton-1796, var(--colorNeutralForegroundDisabled)));}"]
211
211
  });
212
212
  // Cannot just disable button as they need to remain
213
213
  // exposed to ATs like screen readers.
@@ -217,43 +217,43 @@ const useButtonDisabledStyles = /*#__PURE__*/__styles({
217
217
  eoavqd: "fphbwmw"
218
218
  },
219
219
  outline: {
220
- sj55zd: "fiid27c",
221
- r4wkhp: "fz5qnvo",
220
+ sj55zd: "flmj02y",
221
+ r4wkhp: "fdrpovn",
222
222
  B95qlz1: "f110wuh6",
223
- p743kt: "f1hhcf0c",
223
+ p743kt: "frkll7s",
224
224
  B7xitij: "f10404rc",
225
- B6siaa6: "f73qtbv",
225
+ B6siaa6: "fdjk730",
226
226
  Ba9qmo4: "f1snwkb6"
227
227
  },
228
228
  underline: {
229
- sj55zd: "f2pzdli",
230
- r4wkhp: "f17yl3pb",
229
+ sj55zd: "f1sgg4g9",
230
+ r4wkhp: "f1v7pcia",
231
231
  B95qlz1: "f110wuh6",
232
- p743kt: "f1axhou9",
232
+ p743kt: "f1813qqb",
233
233
  B7xitij: "f10404rc",
234
- B6siaa6: "f9vzv5h",
234
+ B6siaa6: "f1hs5qo3",
235
235
  Ba9qmo4: "f1snwkb6"
236
236
  },
237
237
  "filled-darker": {
238
- sj55zd: "f16va189",
239
- r4wkhp: "f1h72h8v",
238
+ sj55zd: "f1ig0yi1",
239
+ r4wkhp: "f1x19cl1",
240
240
  B95qlz1: "f110wuh6",
241
- p743kt: "frv3xmz",
241
+ p743kt: "fxqoy03",
242
242
  B7xitij: "f10404rc",
243
- B6siaa6: "fhyhpye",
243
+ B6siaa6: "fbp5f9",
244
244
  Ba9qmo4: "f1snwkb6"
245
245
  },
246
246
  "filled-lighter": {
247
- sj55zd: "fi86hyn",
248
- r4wkhp: "fyvm6bq",
247
+ sj55zd: "fmmuwj6",
248
+ r4wkhp: "f14oh8th",
249
249
  B95qlz1: "f110wuh6",
250
- p743kt: "f1kx767k",
250
+ p743kt: "f1wn8trp",
251
251
  B7xitij: "f10404rc",
252
- B6siaa6: "f1etx616",
252
+ B6siaa6: "f1n6vm53",
253
253
  Ba9qmo4: "f1snwkb6"
254
254
  }
255
255
  }, {
256
- d: [".fdrzuqr{cursor:not-allowed;}", ".fiid27c{color:var(--1797, var(--1798, var(--colorNeutralForegroundDisabled)));}", ".fz5qnvo:enabled:hover{color:var(--1799, var(--1800, var(--colorNeutralForegroundDisabled)));}", ".f110wuh6:enabled:hover{background-color:transparent;}", ".f1hhcf0c:enabled:active{color:var(--1801, var(--1802, var(--colorNeutralForegroundDisabled)));}", ".f10404rc:enabled:active{background-color:transparent;}", ".f73qtbv:enabled.fui-SpinButton__button_active{color:var(--1803, var(--1804, var(--colorNeutralForegroundDisabled)));}", ".f1snwkb6:enabled.fui-SpinButton__button_active{background-color:transparent;}", ".f2pzdli{color:var(--1805, var(--1806, var(--colorNeutralForegroundDisabled)));}", ".f17yl3pb:enabled:hover{color:var(--1807, var(--1808, var(--colorNeutralForegroundDisabled)));}", ".f1axhou9:enabled:active{color:var(--1809, var(--1810, var(--colorNeutralForegroundDisabled)));}", ".f9vzv5h:enabled.fui-SpinButton__button_active{color:var(--1811, var(--1812, var(--colorNeutralForegroundDisabled)));}", ".f16va189{color:var(--1813, var(--1814, var(--colorNeutralForegroundDisabled)));}", ".f1h72h8v:enabled:hover{color:var(--1815, var(--1816, var(--colorNeutralForegroundDisabled)));}", ".frv3xmz:enabled:active{color:var(--1817, var(--1818, var(--colorNeutralForegroundDisabled)));}", ".fhyhpye:enabled.fui-SpinButton__button_active{color:var(--1819, var(--1820, var(--colorNeutralForegroundDisabled)));}", ".fi86hyn{color:var(--1821, var(--1822, var(--colorNeutralForegroundDisabled)));}", ".fyvm6bq:enabled:hover{color:var(--1823, var(--1824, var(--colorNeutralForegroundDisabled)));}", ".f1kx767k:enabled:active{color:var(--1825, var(--1826, var(--colorNeutralForegroundDisabled)));}", ".f1etx616:enabled.fui-SpinButton__button_active{color:var(--1827, var(--1828, var(--colorNeutralForegroundDisabled)));}"],
256
+ d: [".fdrzuqr{cursor:not-allowed;}", ".flmj02y{color:var(--ctrl-token-SpinButton-1797, var(--semantic-token-SpinButton-1798, var(--colorNeutralForegroundDisabled)));}", ".fdrpovn:enabled:hover{color:var(--ctrl-token-SpinButton-1799, var(--semantic-token-SpinButton-1800, var(--colorNeutralForegroundDisabled)));}", ".f110wuh6:enabled:hover{background-color:transparent;}", ".frkll7s:enabled:active{color:var(--ctrl-token-SpinButton-1801, var(--semantic-token-SpinButton-1802, var(--colorNeutralForegroundDisabled)));}", ".f10404rc:enabled:active{background-color:transparent;}", ".fdjk730:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1803, var(--semantic-token-SpinButton-1804, var(--colorNeutralForegroundDisabled)));}", ".f1snwkb6:enabled.fui-SpinButton__button_active{background-color:transparent;}", ".f1sgg4g9{color:var(--ctrl-token-SpinButton-1805, var(--semantic-token-SpinButton-1806, var(--colorNeutralForegroundDisabled)));}", ".f1v7pcia:enabled:hover{color:var(--ctrl-token-SpinButton-1807, var(--semantic-token-SpinButton-1808, var(--colorNeutralForegroundDisabled)));}", ".f1813qqb:enabled:active{color:var(--ctrl-token-SpinButton-1809, var(--semantic-token-SpinButton-1810, var(--colorNeutralForegroundDisabled)));}", ".f1hs5qo3:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1811, var(--semantic-token-SpinButton-1812, var(--colorNeutralForegroundDisabled)));}", ".f1ig0yi1{color:var(--ctrl-token-SpinButton-1813, var(--semantic-token-SpinButton-1814, var(--colorNeutralForegroundDisabled)));}", ".f1x19cl1:enabled:hover{color:var(--ctrl-token-SpinButton-1815, var(--semantic-token-SpinButton-1816, var(--colorNeutralForegroundDisabled)));}", ".fxqoy03:enabled:active{color:var(--ctrl-token-SpinButton-1817, var(--semantic-token-SpinButton-1818, var(--colorNeutralForegroundDisabled)));}", ".fbp5f9:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1819, var(--semantic-token-SpinButton-1820, var(--colorNeutralForegroundDisabled)));}", ".fmmuwj6{color:var(--ctrl-token-SpinButton-1821, var(--semantic-token-SpinButton-1822, var(--colorNeutralForegroundDisabled)));}", ".f14oh8th:enabled:hover{color:var(--ctrl-token-SpinButton-1823, var(--semantic-token-SpinButton-1824, var(--colorNeutralForegroundDisabled)));}", ".f1wn8trp:enabled:active{color:var(--ctrl-token-SpinButton-1825, var(--semantic-token-SpinButton-1826, var(--colorNeutralForegroundDisabled)));}", ".f1n6vm53:enabled.fui-SpinButton__button_active{color:var(--ctrl-token-SpinButton-1827, var(--semantic-token-SpinButton-1828, var(--colorNeutralForegroundDisabled)));}"],
257
257
  h: [".fphbwmw:hover{cursor:not-allowed;}"]
258
258
  });
259
259
  /**
package/lib/components/SpinButton/useSpinButtonStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","spinButtonClassNames","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","r","s","useRootStyles","sshi5w","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","uwmqm3","outline","outlineInteractive","Bo3r8zu","Hpvxnh","Bx11ytk","B1rg0w0","Bsg1tlv","Brjw370","xcfy85","Bcc6kan","underline","B0qfbqy","B4f6apu","y0oebl","uvfttm","r59vdv","Budzafs","ck0cow","n07z76","Gng75u","underlineInteractive","d9w3h3","B3778ie","B4j8arr","Bl18szs","Blrzh8d","filled","Bcgcnre","Bqjgrrk","qa3bma","Biqmznv","Bm6vgfq","Bbv0w2i","eqrjj","Bk5zm6e","m598lv","ydt019","Bq4z7u6","Bdkvgpv","kj8mxx","De3pzq","filledInteractive","B05mzqr","tb9y6h","jcehpj","B23o0hn","invalid","emecyz","lz0pba","Bo1k74p","Ba322q7","disabled","Bceei9c","Cffpyd","hxi8he","Bcuq369","Imo2if","d","p","h","a","m","useInputClassName","useInputStyles","sj55zd","yvdlaj","useBaseButtonClassName","useButtonStyles","increment","Ijaq50","B7oj6ja","z8tnut","Byoj8tv","decrement","Bbmb7ep","incrementButtonSmall","z189sj","B0ocmuz","Bqenvij","decrementButtonSmall","r4wkhp","B95qlz1","p743kt","B7xitij","B6siaa6","Ba9qmo4","Dyrjrp","drw0cw","idzz8t","useButtonDisabledStyles","base","eoavqd","useSpinButtonStyles_unstable","state","appearance","atBound","spinState","size","startsWith","rootStyles","buttonStyles","buttonDisabledStyles","inputStyles","className"],"sources":["useSpinButtonStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinButtonClassNames = {\n root: 'fui-SpinButton',\n input: 'fui-SpinButton__input',\n incrementButton: 'fui-SpinButton__incrementButton',\n decrementButton: 'fui-SpinButton__decrementButton'\n};\nconst spinButtonExtraClassNames = {\n buttonActive: 'fui-SpinButton__button_active'\n};\nconst fieldHeights = {\n small: '24px',\n medium: '32px'\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-grid',\n gridTemplateColumns: `1fr 24px`,\n gridTemplateRows: '1fr 1fr',\n columnGap: `var(--1679, var(--1680, ${tokens.spacingHorizontalXS}))`,\n rowGap: 0,\n position: 'relative',\n isolation: 'isolate',\n verticalAlign: 'middle',\n backgroundColor: `var(--1681, var(--1682, ${tokens.colorNeutralBackground1}))`,\n minHeight: fieldHeights.medium,\n padding: `0 0 0 ${tokens.spacingHorizontalMNudge}`,\n borderRadius: `var(--1683, var(--1684, ${tokens.borderRadiusMedium}))`,\n // Apply border styles on the ::before pseudo element.\n // We cannot use ::after since that is used for selection.\n // Using the pseudo element allows us to place the border\n // above content in the component which ensures the buttons\n // line up visually with the border as expected. Without this\n // there is a bit of a gap which can become very noticeable\n // at high zoom or when OS zoom levels are not divisible by 2\n // (e.g., 150% on Windows in Firefox)\n // This is most noticeable on the \"outline\" appearance which is\n // also the default so it feels worth the extra ceremony to get right.\n '::before': {\n content: '\"\"',\n boxSizing: 'border-box',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n pointerEvents: 'none',\n zIndex: 10,\n border: `1px solid ${tokens.colorNeutralStroke1}`,\n borderBottomColor: `var(--1685, var(--1686, ${tokens.colorNeutralStrokeAccessible}))`,\n borderRadius: `var(--1687, var(--1688, ${tokens.borderRadiusMedium}))`\n },\n '::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: 20,\n // Maintaining the correct corner radius:\n // Use the whole border-radius as the height and only put radii on the bottom corners.\n // (Otherwise the radius would be automatically reduced to fit available space.)\n // max() ensures the focus border still shows up even if someone sets tokens.borderRadiusMedium to 0.\n height: `max(2px, ${tokens.borderRadiusMedium})`,\n borderBottomLeftRadius: `var(--1689, var(--1690, ${tokens.borderRadiusMedium}))`,\n borderBottomRightRadius: `var(--1691, var(--1692, ${tokens.borderRadiusMedium}))`,\n // Flat 2px border:\n // By default borderBottom will cause little \"horns\" on the ends. The clipPath trims them off.\n // (This could be done without trimming using `background: linear-gradient(...)`, but using\n // borderBottom makes it easier for people to override the color if needed.)\n borderBottom: `2px solid ${tokens.colorCompoundBrandStroke}`,\n clipPath: 'inset(calc(100% - 2px) 0 0 0)',\n // Animation for focus OUT\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: `var(--1693, var(--1694, ${tokens.durationUltraFast}))`,\n transitionDelay: `var(--1695, var(--1696, ${tokens.curveAccelerateMid}))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within::after': {\n // Animation for focus IN\n transform: 'scaleX(1)',\n transitionProperty: 'transform',\n transitionDuration: `var(--1697, var(--1698, ${tokens.durationNormal}))`,\n transitionDelay: `var(--1699, var(--1700, ${tokens.curveDecelerateMid}))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within:active::after': {\n // This is if the user clicks the field again while it's already focused\n borderBottomColor: `var(--1701, var(--1702, ${tokens.colorCompoundBrandStrokePressed}))`\n },\n ':focus-within': {\n outline: '2px solid transparent'\n }\n});\nconst useRootStyles = makeStyles({\n small: {\n minHeight: fieldHeights.small,\n ...typographyStyles.caption1,\n paddingLeft: `var(--1703, var(--1704, ${tokens.spacingHorizontalS}))`\n },\n medium: {\n },\n outline: {\n },\n outlineInteractive: {\n ':hover::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: `var(--1705, var(--1706, ${tokens.colorNeutralStrokeAccessibleHover}))`\n },\n // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n ':active,:focus-within': {\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: `var(--1707, var(--1708, ${tokens.colorNeutralStrokeAccessiblePressed}))`\n }\n }\n },\n underline: {\n '::before': {\n ...shorthands.borderWidth(0, 0, '1px', 0),\n borderRadius: `var(--1709, var(--1710, ${tokens.borderRadiusNone}))`\n }\n },\n underlineInteractive: {\n ':hover::before': {\n borderBottomColor: `var(--1711, var(--1712, ${tokens.colorNeutralStrokeAccessibleHover}))`\n },\n // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n ':active,:focus-within': {\n '::before': {\n borderBottomColor: `var(--1713, var(--1714, ${tokens.colorNeutralStrokeAccessiblePressed}))`\n }\n },\n '::after': {\n borderRadius: `var(--1715, var(--1716, ${tokens.borderRadiusNone}))`\n }\n },\n filled: {\n '::before': {\n border: `1px solid ${tokens.colorTransparentStroke}`\n }\n },\n 'filled-darker': {\n backgroundColor: `var(--1717, var(--1718, ${tokens.colorNeutralBackground3}))`\n },\n 'filled-lighter': {\n backgroundColor: `var(--1719, var(--1720, ${tokens.colorNeutralBackground1}))`\n },\n filledInteractive: {\n // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n ':hover,:focus-within': {\n '::before': {\n // also handles pressed border color (:active)\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive)\n }\n }\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n '::before': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: `var(--1721, var(--1722, ${tokens.colorTransparentBackground}))`,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\n }\n }\n }\n});\nconst useInputClassName = makeResetStyles({\n gridColumnStart: '1',\n gridColumnEnd: '2',\n gridRowStart: '1',\n gridRowEnd: '3',\n outlineStyle: 'none',\n border: '0',\n padding: '0',\n color: `var(--1723, var(--1724, ${tokens.colorNeutralForeground1}))`,\n // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n backgroundColor: 'transparent',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n lineHeight: 'inherit',\n width: '100%',\n '::placeholder': {\n color: `var(--1725, var(--1726, ${tokens.colorNeutralForeground4}))`,\n opacity: 1\n }\n});\nconst useInputStyles = makeStyles({\n disabled: {\n color: `var(--1727, var(--1728, ${tokens.colorNeutralForegroundDisabled}))`,\n cursor: 'not-allowed',\n backgroundColor: `var(--1729, var(--1730, ${tokens.colorTransparentBackground}))`,\n '::placeholder': {\n color: `var(--1731, var(--1732, ${tokens.colorNeutralForegroundDisabled}))`\n }\n }\n});\nconst useBaseButtonClassName = makeResetStyles({\n display: 'inline-flex',\n width: '24px',\n alignItems: 'center',\n justifyContent: 'center',\n border: '0',\n position: 'absolute',\n outlineStyle: 'none',\n height: '16px',\n // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n backgroundColor: 'transparent',\n color: `var(--1733, var(--1734, ${tokens.colorNeutralForeground3}))`,\n // common button layout\n gridColumnStart: '2',\n borderRadius: '0',\n padding: '0 5px 0 5px',\n ':active': {\n outlineStyle: 'none'\n },\n ':enabled': {\n ':hover': {\n cursor: 'pointer',\n color: `var(--1735, var(--1736, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--1737, var(--1738, ${tokens.colorSubtleBackgroundHover}))`\n },\n ':active': {\n color: `var(--1739, var(--1740, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1741, var(--1742, ${tokens.colorSubtleBackgroundPressed}))`\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1743, var(--1744, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1745, var(--1746, ${tokens.colorSubtleBackgroundPressed}))`\n }\n },\n ':disabled': {\n cursor: 'not-allowed',\n color: `var(--1747, var(--1748, ${tokens.colorNeutralForegroundDisabled}))`\n }\n});\nconst useButtonStyles = makeStyles({\n increment: {\n gridRowStart: '1',\n borderTopRightRadius: `var(--1749, var(--1750, ${tokens.borderRadiusMedium}))`,\n paddingTop: '4px',\n paddingBottom: '1px'\n },\n decrement: {\n gridRowStart: '2',\n borderBottomRightRadius: `var(--1751, var(--1752, ${tokens.borderRadiusMedium}))`,\n paddingTop: '1px',\n paddingBottom: '4px'\n },\n // Padding values numbers don't align with design specs\n // but visually the padding aligns.\n // The icons are set in a 16x16px square but the artwork is inset from that\n // so these padding values are computed by hand.\n // Additionally the design uses fractional values so these are\n // rounded to the nearest integer.\n incrementButtonSmall: {\n padding: '3px 6px 0px 4px',\n height: '12px'\n },\n decrementButtonSmall: {\n padding: '0px 6px 3px 4px',\n height: '12px'\n },\n outline: {\n },\n underline: {\n backgroundColor: 'transparent',\n color: `var(--1753, var(--1754, ${tokens.colorNeutralForeground3}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1755, var(--1756, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--1757, var(--1758, ${tokens.colorSubtleBackgroundHover}))`\n },\n ':active': {\n color: `var(--1759, var(--1760, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1761, var(--1762, ${tokens.colorSubtleBackgroundPressed}))`\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1763, var(--1764, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1765, var(--1766, ${tokens.colorSubtleBackgroundPressed}))`\n }\n },\n ':disabled': {\n color: `var(--1767, var(--1768, ${tokens.colorNeutralForegroundDisabled}))`\n }\n },\n 'filled-darker': {\n backgroundColor: 'transparent',\n color: `var(--1769, var(--1770, ${tokens.colorNeutralForeground3}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1771, var(--1772, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--1773, var(--1774, ${tokens.colorNeutralBackground3Hover}))`\n },\n ':active': {\n color: `var(--1775, var(--1776, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1777, var(--1778, ${tokens.colorNeutralBackground3Pressed}))`\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1779, var(--1780, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1781, var(--1782, ${tokens.colorNeutralBackground3Pressed}))`\n }\n },\n ':disabled': {\n color: `var(--1783, var(--1784, ${tokens.colorNeutralForegroundDisabled}))`\n }\n },\n 'filled-lighter': {\n backgroundColor: 'transparent',\n color: `var(--1785, var(--1786, ${tokens.colorNeutralForeground3}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1787, var(--1788, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--1789, var(--1790, ${tokens.colorNeutralBackground1Hover}))`\n },\n [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1791, var(--1792, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--1793, var(--1794, ${tokens.colorNeutralBackground1Pressed}))`\n }\n },\n ':disabled': {\n color: `var(--1795, var(--1796, ${tokens.colorNeutralForegroundDisabled}))`\n }\n }\n});\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n base: {\n cursor: 'not-allowed',\n ':hover': {\n cursor: 'not-allowed'\n }\n },\n outline: {\n color: `var(--1797, var(--1798, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1799, var(--1800, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--1801, var(--1802, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1803, var(--1804, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n },\n underline: {\n color: `var(--1805, var(--1806, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1807, var(--1808, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--1809, var(--1810, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1811, var(--1812, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n },\n 'filled-darker': {\n color: `var(--1813, var(--1814, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1815, var(--1816, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--1817, var(--1818, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1819, var(--1820, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n },\n 'filled-lighter': {\n color: `var(--1821, var(--1822, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--1823, var(--1824, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--1825, var(--1826, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--1827, var(--1828, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n }\n});\n/**\n * Apply styling to the SpinButton slots based on the state\n */ export const useSpinButtonStyles_unstable = (state)=>{\n 'use no memo';\n const { appearance, atBound, spinState, size } = state;\n const disabled = state.input.disabled;\n const invalid = `${state.input['aria-invalid']}` === 'true';\n const filled = appearance.startsWith('filled');\n const rootStyles = useRootStyles();\n const buttonStyles = useButtonStyles();\n const buttonDisabledStyles = useButtonDisabledStyles();\n const inputStyles = useInputStyles();\n state.root.className = mergeClasses(spinButtonClassNames.root, useRootClassName(), rootStyles[size], rootStyles[appearance], filled && rootStyles.filled, !disabled && appearance === 'outline' && rootStyles.outlineInteractive, !disabled && appearance === 'underline' && rootStyles.underlineInteractive, !disabled && filled && rootStyles.filledInteractive, !disabled && invalid && rootStyles.invalid, disabled && rootStyles.disabled, state.root.className);\n state.incrementButton.className = mergeClasses(spinButtonClassNames.incrementButton, spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.increment, buttonStyles[appearance], size === 'small' && buttonStyles.incrementButtonSmall, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance], state.incrementButton.className);\n state.decrementButton.className = mergeClasses(spinButtonClassNames.decrementButton, spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.decrement, buttonStyles[appearance], size === 'small' && buttonStyles.decrementButtonSmall, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance], state.decrementButton.className);\n state.input.className = mergeClasses(spinButtonClassNames.input, useInputClassName(), disabled && inputStyles.disabled, state.input.className);\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","spinButtonClassNames","root","input","incrementButton","decrementButton","spinButtonExtraClassNames","buttonActive","fieldHeights","small","medium","useRootClassName","r","s","useRootStyles","sshi5w","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","uwmqm3","outline","outlineInteractive","Bo3r8zu","Hpvxnh","Bx11ytk","B1rg0w0","Bsg1tlv","Brjw370","xcfy85","Bcc6kan","underline","B0qfbqy","B4f6apu","y0oebl","uvfttm","r59vdv","Budzafs","ck0cow","n07z76","Gng75u","underlineInteractive","d9w3h3","B3778ie","B4j8arr","Bl18szs","Blrzh8d","filled","Bcgcnre","Bqjgrrk","qa3bma","Biqmznv","Bm6vgfq","Bbv0w2i","eqrjj","Bk5zm6e","m598lv","ydt019","Bq4z7u6","Bdkvgpv","kj8mxx","De3pzq","filledInteractive","B05mzqr","tb9y6h","jcehpj","B23o0hn","invalid","emecyz","lz0pba","Bo1k74p","Ba322q7","disabled","Bceei9c","Cffpyd","hxi8he","Bcuq369","Imo2if","d","p","h","a","m","useInputClassName","useInputStyles","sj55zd","yvdlaj","useBaseButtonClassName","useButtonStyles","increment","Ijaq50","B7oj6ja","z8tnut","Byoj8tv","decrement","Bbmb7ep","incrementButtonSmall","z189sj","B0ocmuz","Bqenvij","decrementButtonSmall","r4wkhp","B95qlz1","p743kt","B7xitij","B6siaa6","Ba9qmo4","Dyrjrp","drw0cw","idzz8t","useButtonDisabledStyles","base","eoavqd","useSpinButtonStyles_unstable","state","appearance","atBound","spinState","size","startsWith","rootStyles","buttonStyles","buttonDisabledStyles","inputStyles","className"],"sources":["useSpinButtonStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinButtonClassNames = {\n root: 'fui-SpinButton',\n input: 'fui-SpinButton__input',\n incrementButton: 'fui-SpinButton__incrementButton',\n decrementButton: 'fui-SpinButton__decrementButton'\n};\nconst spinButtonExtraClassNames = {\n buttonActive: 'fui-SpinButton__button_active'\n};\nconst fieldHeights = {\n small: '24px',\n medium: '32px'\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-grid',\n gridTemplateColumns: `1fr 24px`,\n gridTemplateRows: '1fr 1fr',\n columnGap: `var(--ctrl-token-SpinButton-1679, var(--semantic-token-SpinButton-1680, ${tokens.spacingHorizontalXS}))`,\n rowGap: 0,\n position: 'relative',\n isolation: 'isolate',\n verticalAlign: 'middle',\n backgroundColor: `var(--ctrl-token-SpinButton-1681, var(--semantic-token-SpinButton-1682, ${tokens.colorNeutralBackground1}))`,\n minHeight: fieldHeights.medium,\n padding: `0 0 0 ${tokens.spacingHorizontalMNudge}`,\n borderRadius: `var(--ctrl-token-SpinButton-1683, var(--semantic-token-SpinButton-1684, ${tokens.borderRadiusMedium}))`,\n // Apply border styles on the ::before pseudo element.\n // We cannot use ::after since that is used for selection.\n // Using the pseudo element allows us to place the border\n // above content in the component which ensures the buttons\n // line up visually with the border as expected. Without this\n // there is a bit of a gap which can become very noticeable\n // at high zoom or when OS zoom levels are not divisible by 2\n // (e.g., 150% on Windows in Firefox)\n // This is most noticeable on the \"outline\" appearance which is\n // also the default so it feels worth the extra ceremony to get right.\n '::before': {\n content: '\"\"',\n boxSizing: 'border-box',\n position: 'absolute',\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n pointerEvents: 'none',\n zIndex: 10,\n border: `1px solid ${tokens.colorNeutralStroke1}`,\n borderBottomColor: `var(--ctrl-token-SpinButton-1685, var(--semantic-token-SpinButton-1686, ${tokens.colorNeutralStrokeAccessible}))`,\n borderRadius: `var(--ctrl-token-SpinButton-1687, var(--semantic-token-SpinButton-1688, ${tokens.borderRadiusMedium}))`\n },\n '::after': {\n boxSizing: 'border-box',\n content: '\"\"',\n position: 'absolute',\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: 20,\n // Maintaining the correct corner radius:\n // Use the whole border-radius as the height and only put radii on the bottom corners.\n // (Otherwise the radius would be automatically reduced to fit available space.)\n // max() ensures the focus border still shows up even if someone sets tokens.borderRadiusMedium to 0.\n height: `max(2px, ${tokens.borderRadiusMedium})`,\n borderBottomLeftRadius: `var(--ctrl-token-SpinButton-1689, var(--semantic-token-SpinButton-1690, ${tokens.borderRadiusMedium}))`,\n borderBottomRightRadius: `var(--ctrl-token-SpinButton-1691, var(--semantic-token-SpinButton-1692, ${tokens.borderRadiusMedium}))`,\n // Flat 2px border:\n // By default borderBottom will cause little \"horns\" on the ends. The clipPath trims them off.\n // (This could be done without trimming using `background: linear-gradient(...)`, but using\n // borderBottom makes it easier for people to override the color if needed.)\n borderBottom: `2px solid ${tokens.colorCompoundBrandStroke}`,\n clipPath: 'inset(calc(100% - 2px) 0 0 0)',\n // Animation for focus OUT\n transform: 'scaleX(0)',\n transitionProperty: 'transform',\n transitionDuration: `var(--ctrl-token-SpinButton-1693, var(--semantic-token-SpinButton-1694, ${tokens.durationUltraFast}))`,\n transitionDelay: `var(--ctrl-token-SpinButton-1695, var(--semantic-token-SpinButton-1696, ${tokens.curveAccelerateMid}))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within::after': {\n // Animation for focus IN\n transform: 'scaleX(1)',\n transitionProperty: 'transform',\n transitionDuration: `var(--ctrl-token-SpinButton-1697, var(--semantic-token-SpinButton-1698, ${tokens.durationNormal}))`,\n transitionDelay: `var(--ctrl-token-SpinButton-1699, var(--semantic-token-SpinButton-1700, ${tokens.curveDecelerateMid}))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n transitionDuration: '0.01ms',\n transitionDelay: '0.01ms'\n }\n },\n ':focus-within:active::after': {\n // This is if the user clicks the field again while it's already focused\n borderBottomColor: `var(--ctrl-token-SpinButton-1701, var(--semantic-token-SpinButton-1702, ${tokens.colorCompoundBrandStrokePressed}))`\n },\n ':focus-within': {\n outline: '2px solid transparent'\n }\n});\nconst useRootStyles = makeStyles({\n small: {\n minHeight: fieldHeights.small,\n ...typographyStyles.caption1,\n paddingLeft: `var(--ctrl-token-SpinButton-1703, var(--semantic-token-SpinButton-1704, ${tokens.spacingHorizontalS}))`\n },\n medium: {\n },\n outline: {\n },\n outlineInteractive: {\n ':hover::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n borderBottomColor: `var(--ctrl-token-SpinButton-1705, var(--semantic-token-SpinButton-1706, ${tokens.colorNeutralStrokeAccessibleHover}))`\n },\n // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n ':active,:focus-within': {\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n borderBottomColor: `var(--ctrl-token-SpinButton-1707, var(--semantic-token-SpinButton-1708, ${tokens.colorNeutralStrokeAccessiblePressed}))`\n }\n }\n },\n underline: {\n '::before': {\n ...shorthands.borderWidth(0, 0, '1px', 0),\n borderRadius: `var(--ctrl-token-SpinButton-1709, var(--semantic-token-SpinButton-1710, ${tokens.borderRadiusNone}))`\n }\n },\n underlineInteractive: {\n ':hover::before': {\n borderBottomColor: `var(--ctrl-token-SpinButton-1711, var(--semantic-token-SpinButton-1712, ${tokens.colorNeutralStrokeAccessibleHover}))`\n },\n // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n ':active,:focus-within': {\n '::before': {\n borderBottomColor: `var(--ctrl-token-SpinButton-1713, var(--semantic-token-SpinButton-1714, ${tokens.colorNeutralStrokeAccessiblePressed}))`\n }\n },\n '::after': {\n borderRadius: `var(--ctrl-token-SpinButton-1715, var(--semantic-token-SpinButton-1716, ${tokens.borderRadiusNone}))`\n }\n },\n filled: {\n '::before': {\n border: `1px solid ${tokens.colorTransparentStroke}`\n }\n },\n 'filled-darker': {\n backgroundColor: `var(--ctrl-token-SpinButton-1717, var(--semantic-token-SpinButton-1718, ${tokens.colorNeutralBackground3}))`\n },\n 'filled-lighter': {\n backgroundColor: `var(--ctrl-token-SpinButton-1719, var(--semantic-token-SpinButton-1720, ${tokens.colorNeutralBackground1}))`\n },\n filledInteractive: {\n // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n ':hover,:focus-within': {\n '::before': {\n // also handles pressed border color (:active)\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive)\n }\n }\n },\n invalid: {\n ':not(:focus-within),:hover:not(:focus-within)': {\n '::before': {\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n }\n }\n },\n disabled: {\n cursor: 'not-allowed',\n backgroundColor: `var(--ctrl-token-SpinButton-1721, var(--semantic-token-SpinButton-1722, ${tokens.colorTransparentBackground}))`,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText')\n }\n }\n }\n});\nconst useInputClassName = makeResetStyles({\n gridColumnStart: '1',\n gridColumnEnd: '2',\n gridRowStart: '1',\n gridRowEnd: '3',\n outlineStyle: 'none',\n border: '0',\n padding: '0',\n color: `var(--ctrl-token-SpinButton-1723, var(--semantic-token-SpinButton-1724, ${tokens.colorNeutralForeground1}))`,\n // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n backgroundColor: 'transparent',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n lineHeight: 'inherit',\n width: '100%',\n '::placeholder': {\n color: `var(--ctrl-token-SpinButton-1725, var(--semantic-token-SpinButton-1726, ${tokens.colorNeutralForeground4}))`,\n opacity: 1\n }\n});\nconst useInputStyles = makeStyles({\n disabled: {\n color: `var(--ctrl-token-SpinButton-1727, var(--semantic-token-SpinButton-1728, ${tokens.colorNeutralForegroundDisabled}))`,\n cursor: 'not-allowed',\n backgroundColor: `var(--ctrl-token-SpinButton-1729, var(--semantic-token-SpinButton-1730, ${tokens.colorTransparentBackground}))`,\n '::placeholder': {\n color: `var(--ctrl-token-SpinButton-1731, var(--semantic-token-SpinButton-1732, ${tokens.colorNeutralForegroundDisabled}))`\n }\n }\n});\nconst useBaseButtonClassName = makeResetStyles({\n display: 'inline-flex',\n width: '24px',\n alignItems: 'center',\n justifyContent: 'center',\n border: '0',\n position: 'absolute',\n outlineStyle: 'none',\n height: '16px',\n // Use literal \"transparent\" (not from the theme) to always let the color from the root show through\n backgroundColor: 'transparent',\n color: `var(--ctrl-token-SpinButton-1733, var(--semantic-token-SpinButton-1734, ${tokens.colorNeutralForeground3}))`,\n // common button layout\n gridColumnStart: '2',\n borderRadius: '0',\n padding: '0 5px 0 5px',\n ':active': {\n outlineStyle: 'none'\n },\n ':enabled': {\n ':hover': {\n cursor: 'pointer',\n color: `var(--ctrl-token-SpinButton-1735, var(--semantic-token-SpinButton-1736, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1737, var(--semantic-token-SpinButton-1738, ${tokens.colorSubtleBackgroundHover}))`\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1739, var(--semantic-token-SpinButton-1740, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1741, var(--semantic-token-SpinButton-1742, ${tokens.colorSubtleBackgroundPressed}))`\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1743, var(--semantic-token-SpinButton-1744, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1745, var(--semantic-token-SpinButton-1746, ${tokens.colorSubtleBackgroundPressed}))`\n }\n },\n ':disabled': {\n cursor: 'not-allowed',\n color: `var(--ctrl-token-SpinButton-1747, var(--semantic-token-SpinButton-1748, ${tokens.colorNeutralForegroundDisabled}))`\n }\n});\nconst useButtonStyles = makeStyles({\n increment: {\n gridRowStart: '1',\n borderTopRightRadius: `var(--ctrl-token-SpinButton-1749, var(--semantic-token-SpinButton-1750, ${tokens.borderRadiusMedium}))`,\n paddingTop: '4px',\n paddingBottom: '1px'\n },\n decrement: {\n gridRowStart: '2',\n borderBottomRightRadius: `var(--ctrl-token-SpinButton-1751, var(--semantic-token-SpinButton-1752, ${tokens.borderRadiusMedium}))`,\n paddingTop: '1px',\n paddingBottom: '4px'\n },\n // Padding values numbers don't align with design specs\n // but visually the padding aligns.\n // The icons are set in a 16x16px square but the artwork is inset from that\n // so these padding values are computed by hand.\n // Additionally the design uses fractional values so these are\n // rounded to the nearest integer.\n incrementButtonSmall: {\n padding: '3px 6px 0px 4px',\n height: '12px'\n },\n decrementButtonSmall: {\n padding: '0px 6px 3px 4px',\n height: '12px'\n },\n outline: {\n },\n underline: {\n backgroundColor: 'transparent',\n color: `var(--ctrl-token-SpinButton-1753, var(--semantic-token-SpinButton-1754, ${tokens.colorNeutralForeground3}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1755, var(--semantic-token-SpinButton-1756, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1757, var(--semantic-token-SpinButton-1758, ${tokens.colorSubtleBackgroundHover}))`\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1759, var(--semantic-token-SpinButton-1760, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1761, var(--semantic-token-SpinButton-1762, ${tokens.colorSubtleBackgroundPressed}))`\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1763, var(--semantic-token-SpinButton-1764, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1765, var(--semantic-token-SpinButton-1766, ${tokens.colorSubtleBackgroundPressed}))`\n }\n },\n ':disabled': {\n color: `var(--ctrl-token-SpinButton-1767, var(--semantic-token-SpinButton-1768, ${tokens.colorNeutralForegroundDisabled}))`\n }\n },\n 'filled-darker': {\n backgroundColor: 'transparent',\n color: `var(--ctrl-token-SpinButton-1769, var(--semantic-token-SpinButton-1770, ${tokens.colorNeutralForeground3}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1771, var(--semantic-token-SpinButton-1772, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1773, var(--semantic-token-SpinButton-1774, ${tokens.colorNeutralBackground3Hover}))`\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1775, var(--semantic-token-SpinButton-1776, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1777, var(--semantic-token-SpinButton-1778, ${tokens.colorNeutralBackground3Pressed}))`\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1779, var(--semantic-token-SpinButton-1780, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1781, var(--semantic-token-SpinButton-1782, ${tokens.colorNeutralBackground3Pressed}))`\n }\n },\n ':disabled': {\n color: `var(--ctrl-token-SpinButton-1783, var(--semantic-token-SpinButton-1784, ${tokens.colorNeutralForegroundDisabled}))`\n }\n },\n 'filled-lighter': {\n backgroundColor: 'transparent',\n color: `var(--ctrl-token-SpinButton-1785, var(--semantic-token-SpinButton-1786, ${tokens.colorNeutralForeground3}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1787, var(--semantic-token-SpinButton-1788, ${tokens.colorNeutralForeground3Hover}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1789, var(--semantic-token-SpinButton-1790, ${tokens.colorNeutralBackground1Hover}))`\n },\n [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1791, var(--semantic-token-SpinButton-1792, ${tokens.colorNeutralForeground3Pressed}))`,\n backgroundColor: `var(--ctrl-token-SpinButton-1793, var(--semantic-token-SpinButton-1794, ${tokens.colorNeutralBackground1Pressed}))`\n }\n },\n ':disabled': {\n color: `var(--ctrl-token-SpinButton-1795, var(--semantic-token-SpinButton-1796, ${tokens.colorNeutralForegroundDisabled}))`\n }\n }\n});\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n base: {\n cursor: 'not-allowed',\n ':hover': {\n cursor: 'not-allowed'\n }\n },\n outline: {\n color: `var(--ctrl-token-SpinButton-1797, var(--semantic-token-SpinButton-1798, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1799, var(--semantic-token-SpinButton-1800, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1801, var(--semantic-token-SpinButton-1802, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1803, var(--semantic-token-SpinButton-1804, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n },\n underline: {\n color: `var(--ctrl-token-SpinButton-1805, var(--semantic-token-SpinButton-1806, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1807, var(--semantic-token-SpinButton-1808, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1809, var(--semantic-token-SpinButton-1810, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1811, var(--semantic-token-SpinButton-1812, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n },\n 'filled-darker': {\n color: `var(--ctrl-token-SpinButton-1813, var(--semantic-token-SpinButton-1814, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1815, var(--semantic-token-SpinButton-1816, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1817, var(--semantic-token-SpinButton-1818, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1819, var(--semantic-token-SpinButton-1820, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n },\n 'filled-lighter': {\n color: `var(--ctrl-token-SpinButton-1821, var(--semantic-token-SpinButton-1822, ${tokens.colorNeutralForegroundDisabled}))`,\n ':enabled': {\n ':hover': {\n color: `var(--ctrl-token-SpinButton-1823, var(--semantic-token-SpinButton-1824, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n ':active': {\n color: `var(--ctrl-token-SpinButton-1825, var(--semantic-token-SpinButton-1826, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n },\n [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n color: `var(--ctrl-token-SpinButton-1827, var(--semantic-token-SpinButton-1828, ${tokens.colorNeutralForegroundDisabled}))`,\n backgroundColor: 'transparent'\n }\n }\n }\n});\n/**\n * Apply styling to the SpinButton slots based on the state\n */ export const useSpinButtonStyles_unstable = (state)=>{\n 'use no memo';\n const { appearance, atBound, spinState, size } = state;\n const disabled = state.input.disabled;\n const invalid = `${state.input['aria-invalid']}` === 'true';\n const filled = appearance.startsWith('filled');\n const rootStyles = useRootStyles();\n const buttonStyles = useButtonStyles();\n const buttonDisabledStyles = useButtonDisabledStyles();\n const inputStyles = useInputStyles();\n state.root.className = mergeClasses(spinButtonClassNames.root, useRootClassName(), rootStyles[size], rootStyles[appearance], filled && rootStyles.filled, !disabled && appearance === 'outline' && rootStyles.outlineInteractive, !disabled && appearance === 'underline' && rootStyles.underlineInteractive, !disabled && filled && rootStyles.filledInteractive, !disabled && invalid && rootStyles.invalid, disabled && rootStyles.disabled, state.root.className);\n state.incrementButton.className = mergeClasses(spinButtonClassNames.incrementButton, spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.increment, buttonStyles[appearance], size === 'small' && buttonStyles.incrementButtonSmall, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance], state.incrementButton.className);\n state.decrementButton.className = mergeClasses(spinButtonClassNames.decrementButton, spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`, useBaseButtonClassName(), buttonStyles.decrement, buttonStyles[appearance], size === 'small' && buttonStyles.decrementButtonSmall, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base, (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance], state.decrementButton.className);\n state.input.className = mergeClasses(spinButtonClassNames.input, useInputClassName(), disabled && inputStyles.disabled, state.input.className);\n return state;\n};\n"],"mappings":"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","ignoreList":[]}