@react-spectrum/s2 3.0.0-nightly-fd7075c5f-250128 → 3.0.0-nightly-e3ed3c7f6-250130

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 (268) hide show
  1. package/dist/Accordion.cjs +3 -3
  2. package/dist/Accordion.css +2 -2
  3. package/dist/Accordion.mjs +3 -3
  4. package/dist/ActionBar.cjs +47 -47
  5. package/dist/ActionBar.css +51 -51
  6. package/dist/ActionBar.mjs +47 -47
  7. package/dist/ActionButton.cjs +97 -97
  8. package/dist/ActionButton.css +96 -96
  9. package/dist/ActionButton.mjs +97 -97
  10. package/dist/ActionButtonGroup.cjs +11 -11
  11. package/dist/ActionButtonGroup.css +9 -9
  12. package/dist/ActionButtonGroup.mjs +11 -11
  13. package/dist/AlertDialog.cjs +3 -3
  14. package/dist/AlertDialog.css +3 -3
  15. package/dist/AlertDialog.mjs +3 -3
  16. package/dist/Avatar.cjs +17 -17
  17. package/dist/Avatar.css +14 -14
  18. package/dist/Avatar.mjs +17 -17
  19. package/dist/AvatarGroup.cjs +100 -100
  20. package/dist/AvatarGroup.css +34 -34
  21. package/dist/AvatarGroup.mjs +100 -100
  22. package/dist/Badge.cjs +91 -67
  23. package/dist/Badge.cjs.map +1 -1
  24. package/dist/Badge.css +163 -91
  25. package/dist/Badge.css.map +1 -1
  26. package/dist/Badge.mjs +91 -67
  27. package/dist/Badge.mjs.map +1 -1
  28. package/dist/Breadcrumbs.cjs +115 -115
  29. package/dist/Breadcrumbs.css +89 -89
  30. package/dist/Breadcrumbs.mjs +115 -115
  31. package/dist/Button.cjs +236 -152
  32. package/dist/Button.cjs.map +1 -1
  33. package/dist/Button.css +309 -165
  34. package/dist/Button.css.map +1 -1
  35. package/dist/Button.mjs +236 -152
  36. package/dist/Button.mjs.map +1 -1
  37. package/dist/ButtonGroup.cjs +19 -19
  38. package/dist/ButtonGroup.css +15 -15
  39. package/dist/ButtonGroup.mjs +19 -19
  40. package/dist/Card.cjs +264 -261
  41. package/dist/Card.cjs.map +1 -1
  42. package/dist/Card.css +210 -198
  43. package/dist/Card.css.map +1 -1
  44. package/dist/Card.mjs +264 -261
  45. package/dist/Card.mjs.map +1 -1
  46. package/dist/CardView.cjs +15 -15
  47. package/dist/CardView.css +18 -18
  48. package/dist/CardView.mjs +15 -15
  49. package/dist/CenterBaseline.cjs +1 -1
  50. package/dist/CenterBaseline.css +2 -2
  51. package/dist/CenterBaseline.mjs +1 -1
  52. package/dist/Checkbox.cjs +124 -73
  53. package/dist/Checkbox.cjs.map +1 -1
  54. package/dist/Checkbox.css +201 -81
  55. package/dist/Checkbox.css.map +1 -1
  56. package/dist/Checkbox.mjs +124 -73
  57. package/dist/Checkbox.mjs.map +1 -1
  58. package/dist/CheckboxGroup.cjs +49 -49
  59. package/dist/CheckboxGroup.css +41 -41
  60. package/dist/CheckboxGroup.mjs +49 -49
  61. package/dist/ClearButton.cjs +15 -15
  62. package/dist/ClearButton.css +17 -17
  63. package/dist/ClearButton.mjs +15 -15
  64. package/dist/CloseButton.cjs +35 -35
  65. package/dist/CloseButton.css +33 -33
  66. package/dist/CloseButton.mjs +35 -35
  67. package/dist/ColorArea.cjs +22 -22
  68. package/dist/ColorArea.css +15 -15
  69. package/dist/ColorArea.mjs +22 -22
  70. package/dist/ColorField.cjs +38 -38
  71. package/dist/ColorField.css +32 -32
  72. package/dist/ColorField.mjs +38 -38
  73. package/dist/ColorHandle.cjs +27 -21
  74. package/dist/ColorHandle.cjs.map +1 -1
  75. package/dist/ColorHandle.css +93 -45
  76. package/dist/ColorHandle.css.map +1 -1
  77. package/dist/ColorHandle.mjs +27 -21
  78. package/dist/ColorHandle.mjs.map +1 -1
  79. package/dist/ColorSlider.cjs +52 -52
  80. package/dist/ColorSlider.css +51 -51
  81. package/dist/ColorSlider.mjs +52 -52
  82. package/dist/ColorSwatch.cjs +27 -24
  83. package/dist/ColorSwatch.cjs.map +1 -1
  84. package/dist/ColorSwatch.css +41 -29
  85. package/dist/ColorSwatch.css.map +1 -1
  86. package/dist/ColorSwatch.mjs +27 -24
  87. package/dist/ColorSwatch.mjs.map +1 -1
  88. package/dist/ColorSwatchPicker.cjs +23 -23
  89. package/dist/ColorSwatchPicker.css +60 -48
  90. package/dist/ColorSwatchPicker.css.map +1 -1
  91. package/dist/ColorSwatchPicker.mjs +23 -23
  92. package/dist/ColorWheel.cjs +22 -22
  93. package/dist/ColorWheel.css +16 -16
  94. package/dist/ColorWheel.mjs +22 -22
  95. package/dist/ComboBox.cjs +80 -80
  96. package/dist/ComboBox.css +88 -88
  97. package/dist/ComboBox.mjs +80 -80
  98. package/dist/ContextualHelp.cjs +5 -5
  99. package/dist/ContextualHelp.css +38 -38
  100. package/dist/ContextualHelp.mjs +5 -5
  101. package/dist/CustomDialog.cjs +31 -31
  102. package/dist/CustomDialog.css +25 -25
  103. package/dist/CustomDialog.mjs +31 -31
  104. package/dist/Dialog.cjs +17 -17
  105. package/dist/Dialog.css +64 -64
  106. package/dist/Dialog.mjs +17 -17
  107. package/dist/Disclosure.cjs +111 -108
  108. package/dist/Disclosure.cjs.map +1 -1
  109. package/dist/Disclosure.css +124 -112
  110. package/dist/Disclosure.css.map +1 -1
  111. package/dist/Disclosure.mjs +111 -108
  112. package/dist/Disclosure.mjs.map +1 -1
  113. package/dist/Divider.cjs +26 -26
  114. package/dist/Divider.css +16 -16
  115. package/dist/Divider.mjs +26 -26
  116. package/dist/DropZone.cjs +56 -47
  117. package/dist/DropZone.cjs.map +1 -1
  118. package/dist/DropZone.css +80 -56
  119. package/dist/DropZone.css.map +1 -1
  120. package/dist/DropZone.mjs +56 -47
  121. package/dist/DropZone.mjs.map +1 -1
  122. package/dist/Field.cjs +204 -150
  123. package/dist/Field.cjs.map +1 -1
  124. package/dist/Field.css +246 -150
  125. package/dist/Field.css.map +1 -1
  126. package/dist/Field.mjs +204 -150
  127. package/dist/Field.mjs.map +1 -1
  128. package/dist/Form.cjs +10 -10
  129. package/dist/Form.css +9 -9
  130. package/dist/Form.mjs +10 -10
  131. package/dist/FullscreenDialog.cjs +5 -5
  132. package/dist/FullscreenDialog.css +72 -72
  133. package/dist/FullscreenDialog.mjs +5 -5
  134. package/dist/IllustratedMessage.cjs +134 -134
  135. package/dist/IllustratedMessage.css +69 -69
  136. package/dist/IllustratedMessage.mjs +134 -134
  137. package/dist/Image.cjs +12 -12
  138. package/dist/Image.css +13 -13
  139. package/dist/Image.mjs +12 -12
  140. package/dist/InlineAlert.cjs +104 -77
  141. package/dist/InlineAlert.cjs.map +1 -1
  142. package/dist/InlineAlert.css +149 -77
  143. package/dist/InlineAlert.css.map +1 -1
  144. package/dist/InlineAlert.mjs +104 -77
  145. package/dist/InlineAlert.mjs.map +1 -1
  146. package/dist/Link.cjs +31 -31
  147. package/dist/Link.css +30 -30
  148. package/dist/Link.mjs +31 -31
  149. package/dist/Menu.cjs +269 -264
  150. package/dist/Menu.cjs.map +1 -1
  151. package/dist/Menu.css +152 -152
  152. package/dist/Menu.css.map +1 -1
  153. package/dist/Menu.mjs +270 -265
  154. package/dist/Menu.mjs.map +1 -1
  155. package/dist/Meter.cjs +85 -85
  156. package/dist/Meter.css +81 -81
  157. package/dist/Meter.mjs +85 -85
  158. package/dist/Modal.cjs +48 -48
  159. package/dist/Modal.css +46 -46
  160. package/dist/Modal.mjs +48 -48
  161. package/dist/NumberField.cjs +115 -115
  162. package/dist/NumberField.css +114 -114
  163. package/dist/NumberField.mjs +115 -115
  164. package/dist/Picker.cjs +193 -175
  165. package/dist/Picker.cjs.map +1 -1
  166. package/dist/Picker.css +223 -163
  167. package/dist/Picker.css.map +1 -1
  168. package/dist/Picker.mjs +193 -175
  169. package/dist/Picker.mjs.map +1 -1
  170. package/dist/Popover.cjs +84 -78
  171. package/dist/Popover.cjs.map +1 -1
  172. package/dist/Popover.css +89 -65
  173. package/dist/Popover.css.map +1 -1
  174. package/dist/Popover.mjs +84 -78
  175. package/dist/Popover.mjs.map +1 -1
  176. package/dist/ProgressBar.cjs +98 -98
  177. package/dist/ProgressBar.css +92 -92
  178. package/dist/ProgressBar.mjs +98 -98
  179. package/dist/ProgressCircle.cjs +17 -17
  180. package/dist/ProgressCircle.css +15 -15
  181. package/dist/ProgressCircle.mjs +17 -17
  182. package/dist/Provider.cjs +4 -4
  183. package/dist/Provider.css +5 -5
  184. package/dist/Provider.mjs +4 -4
  185. package/dist/Radio.cjs +152 -80
  186. package/dist/Radio.cjs.map +1 -1
  187. package/dist/Radio.css +240 -96
  188. package/dist/Radio.css.map +1 -1
  189. package/dist/Radio.mjs +152 -80
  190. package/dist/Radio.mjs.map +1 -1
  191. package/dist/RadioGroup.cjs +47 -47
  192. package/dist/RadioGroup.css +41 -41
  193. package/dist/RadioGroup.mjs +47 -47
  194. package/dist/SearchField.cjs +42 -42
  195. package/dist/SearchField.css +47 -47
  196. package/dist/SearchField.mjs +42 -42
  197. package/dist/SegmentedControl.cjs +101 -89
  198. package/dist/SegmentedControl.cjs.map +1 -1
  199. package/dist/SegmentedControl.css +140 -92
  200. package/dist/SegmentedControl.css.map +1 -1
  201. package/dist/SegmentedControl.mjs +101 -89
  202. package/dist/SegmentedControl.mjs.map +1 -1
  203. package/dist/Slider.cjs +229 -196
  204. package/dist/Slider.cjs.map +1 -1
  205. package/dist/Slider.css +221 -149
  206. package/dist/Slider.css.map +1 -1
  207. package/dist/Slider.mjs +229 -196
  208. package/dist/Slider.mjs.map +1 -1
  209. package/dist/StatusLight.cjs +56 -56
  210. package/dist/StatusLight.css +59 -59
  211. package/dist/StatusLight.mjs +56 -56
  212. package/dist/Switch.cjs +107 -74
  213. package/dist/Switch.cjs.map +1 -1
  214. package/dist/Switch.css +141 -69
  215. package/dist/Switch.css.map +1 -1
  216. package/dist/Switch.mjs +107 -74
  217. package/dist/Switch.mjs.map +1 -1
  218. package/dist/TableView.cjs +280 -253
  219. package/dist/TableView.cjs.map +1 -1
  220. package/dist/TableView.css +199 -163
  221. package/dist/TableView.css.map +1 -1
  222. package/dist/TableView.mjs +280 -253
  223. package/dist/TableView.mjs.map +1 -1
  224. package/dist/Tabs.cjs +83 -83
  225. package/dist/Tabs.css +58 -58
  226. package/dist/Tabs.mjs +83 -83
  227. package/dist/TagGroup.cjs +148 -148
  228. package/dist/TagGroup.css +134 -134
  229. package/dist/TagGroup.mjs +148 -148
  230. package/dist/TextField.cjs +59 -59
  231. package/dist/TextField.css +62 -62
  232. package/dist/TextField.mjs +59 -59
  233. package/dist/ToggleButton.cjs +3 -3
  234. package/dist/ToggleButton.css +12 -12
  235. package/dist/ToggleButton.mjs +3 -3
  236. package/dist/Tooltip.cjs +60 -57
  237. package/dist/Tooltip.cjs.map +1 -1
  238. package/dist/Tooltip.css +83 -71
  239. package/dist/Tooltip.css.map +1 -1
  240. package/dist/Tooltip.mjs +60 -57
  241. package/dist/Tooltip.mjs.map +1 -1
  242. package/dist/TreeView.cjs +465 -0
  243. package/dist/TreeView.cjs.map +1 -0
  244. package/dist/TreeView.css +632 -0
  245. package/dist/TreeView.css.map +1 -0
  246. package/dist/TreeView.mjs +455 -0
  247. package/dist/TreeView.mjs.map +1 -0
  248. package/dist/main.cjs +4 -0
  249. package/dist/main.cjs.map +1 -1
  250. package/dist/module.mjs +3 -1
  251. package/dist/module.mjs.map +1 -1
  252. package/dist/types.d.ts +21 -1
  253. package/dist/types.d.ts.map +1 -1
  254. package/icons/Skeleton.cjs +2 -2
  255. package/icons/Skeleton.css +5 -5
  256. package/icons/Skeleton.mjs +2 -2
  257. package/package.json +20 -19
  258. package/src/Menu.tsx +2 -0
  259. package/src/TreeView.tsx +497 -0
  260. package/src/index.ts +2 -0
  261. package/style/__tests__/style-macro.test.js +18 -18
  262. package/style/dist/spectrum-theme.cjs +20 -10
  263. package/style/dist/spectrum-theme.cjs.map +1 -1
  264. package/style/dist/spectrum-theme.mjs +20 -10
  265. package/style/dist/spectrum-theme.mjs.map +1 -1
  266. package/style/dist/types.d.ts +4 -0
  267. package/style/dist/types.d.ts.map +1 -1
  268. package/style/spectrum-theme.ts +18 -11
package/dist/Slider.cjs CHANGED
@@ -49,35 +49,35 @@ $parcel$export(module.exports, "Slider", () => $e937566cb5c6349c$export$472062a3
49
49
  const $e937566cb5c6349c$export$e99164f0030f3bff = /*#__PURE__*/ (0, $5DeaH$react.createContext)(null);
50
50
  const $e937566cb5c6349c$var$slider = function anonymous(props, overrides) {
51
51
  let rules = " .";
52
- let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r)[^\s]+/g) || [];
52
+ let matches = (overrides || '').match(/(?:^|\s)(?:B|C|D|E|__d|__c|g|_9|_8|__E|__g|__h|__e|__f|Y|__U|_b|_d|Z|_a|k|p|q)[^\s]+/g) || [];
53
53
  rules += matches.join('');
54
- rules += ' _d-bc1l9oh';
55
- rules += ' _d-1uotwbwg';
56
- rules += ' _d-eo0c6sf';
57
- rules += ' _d-enzzrge';
58
- rules += ' _d-enzykdd';
59
- rules += ' _d-enzwzjc';
60
- rules += ' _d-enzrfpb';
61
- rules += ' _da';
54
+ rules += ' _g-bc1l9oh';
55
+ rules += ' _g-1uotwbwg';
56
+ rules += ' _g-eo0c6sf';
57
+ rules += ' _g-enzzrge';
58
+ rules += ' _g-enzykdd';
59
+ rules += ' _g-enzwzjc';
60
+ rules += ' _g-enzrfpb';
61
+ rules += ' _ga';
62
62
  if (props.size === "XL") {
63
- rules += ' _ebj';
64
- rules += ' _ei';
63
+ rules += ' _hbj';
64
+ rules += ' _hi';
65
65
  } else if (props.size === "L") {
66
- rules += ' _ebh';
67
- rules += ' _eg';
66
+ rules += ' _hbh';
67
+ rules += ' _hg';
68
68
  } else if (props.size === "S") {
69
- rules += ' _ebd';
70
- rules += ' _ec';
69
+ rules += ' _hbd';
70
+ rules += ' _hc';
71
71
  } else if (props.size === "XS") {
72
- rules += ' _ebb';
73
- rules += ' _ea';
72
+ rules += ' _hbb';
73
+ rules += ' _ha';
74
74
  } else {
75
- rules += ' _ebf';
76
- rules += ' _ee';
75
+ rules += ' _hbf';
76
+ rules += ' _he';
77
77
  }
78
- rules += ' _fb';
79
- rules += ' _g-1x99dlob';
80
- rules += ' _ga';
78
+ rules += ' _ib';
79
+ rules += ' _j-1x99dlob';
80
+ rules += ' _ja';
81
81
  if (props.isDisabled) rules += ' aj';
82
82
  else {
83
83
  if (props.isPressed) rules += ' an';
@@ -85,89 +85,78 @@ const $e937566cb5c6349c$var$slider = function anonymous(props, overrides) {
85
85
  else if (props.isHovered) rules += ' an';
86
86
  else rules += ' am';
87
87
  }
88
- if (props.labelPosition === "side") rules += ' _2c';
89
- if (props.isInForm) rules += ' je';
90
- else if (props.size === "XL") rules += ' jh';
91
- else if (props.size === "L") rules += ' jg';
92
- else if (props.size === "M") rules += ' jf';
93
- else if (props.size === "S") rules += ' jf';
88
+ if (props.labelPosition === "side") rules += ' _5c';
89
+ if (props.isInForm) rules += ' ie';
90
+ else if (props.size === "XL") rules += ' ih';
91
+ else if (props.size === "L") rules += ' ig';
92
+ else if (props.size === "M") rules += ' if';
93
+ else if (props.size === "S") rules += ' if';
94
94
  return rules;
95
95
  };
96
96
  const $e937566cb5c6349c$var$labelContainer = function anonymous(props) {
97
97
  let rules = " .";
98
- if (props.labelPosition === "top") rules += ' _0f';
99
- rules += ' __b-hr3t0p';
100
- rules += ' __c-hr3t0p';
101
- rules += ' __d-hr3t0p';
98
+ if (props.labelPosition === "top") rules += ' _3f';
102
99
  rules += ' __e-hr3t0p';
103
- rules += ' lb';
104
- if (props.labelPosition === "top") rules += ' __k-1h4qke2';
105
- if (props.labelPosition === "top") rules += ' __i-1j10eqz';
100
+ rules += ' __f-hr3t0p';
101
+ rules += ' __g-hr3t0p';
102
+ rules += ' __h-hr3t0p';
103
+ rules += ' kb';
104
+ if (props.labelPosition === "top") rules += ' __n-1h4qke2';
105
+ if (props.labelPosition === "top") rules += ' __l-1j10eqz';
106
106
  if (props.labelPosition === "side") {
107
- if (props.labelAlign === "end") rules += ' _kc';
108
- else if (props.labelAlign === "start") rules += ' _ka';
107
+ if (props.labelAlign === "end") rules += ' _nc';
108
+ else if (props.labelAlign === "start") rules += ' _na';
109
109
  }
110
- rules += ' -_1inj1bc_F-a';
110
+ rules += ' -_1inj1bc_I-a';
111
111
  return rules;
112
112
  };
113
113
  const $e937566cb5c6349c$var$output = function anonymous(props) {
114
114
  let rules = " .";
115
- rules += ' __b-ny5g4a';
116
- rules += ' __c-ny5g4a';
117
- rules += ' __d-ny5g4a';
118
115
  rules += ' __e-ny5g4a';
116
+ rules += ' __f-ny5g4a';
117
+ rules += ' __g-ny5g4a';
118
+ rules += ' __h-ny5g4a';
119
119
  if (props.labelPosition === "side") {
120
- if (props.isInForm) rules += ' _kc';
121
- else if (props.direction === "rtl") rules += ' _kc';
122
- else if (props.direction === "ltr") rules += ' _ka';
120
+ if (props.isInForm) rules += ' _nc';
121
+ else if (props.direction === "rtl") rules += ' _nc';
122
+ else if (props.direction === "ltr") rules += ' _na';
123
123
  } else if (props.labelPosition === "top") {
124
- if (props.direction === "rtl") rules += ' _ka';
125
- else if (props.direction === "ltr") rules += ' _kc';
124
+ if (props.direction === "rtl") rules += ' _na';
125
+ else if (props.direction === "ltr") rules += ' _nc';
126
126
  }
127
127
  return rules;
128
128
  };
129
129
  let $e937566cb5c6349c$export$6b2a7d5132615086 = function anonymous(props) {
130
130
  let rules = " .";
131
- rules += ' __b-n9hk5a';
132
- rules += ' __c-n9hk5a';
133
- rules += ' __d-n9hk5a';
134
131
  rules += ' __e-n9hk5a';
135
- rules += ' Vc';
136
- rules += ' lb';
137
- if (props.size === "XL") rules += ' k_a';
138
- else if (props.size === "L") rules += ' k2';
139
- else if (props.size === "M") rules += ' kU';
140
- else if (props.size === "S") rules += ' kM';
132
+ rules += ' __f-n9hk5a';
133
+ rules += ' __g-n9hk5a';
134
+ rules += ' __h-n9hk5a';
135
+ rules += ' Yc';
136
+ rules += ' kb';
137
+ if (props.size === "XL") rules += ' j_a';
138
+ else if (props.size === "L") rules += ' j2';
139
+ else if (props.size === "M") rules += ' jU';
140
+ else if (props.size === "S") rules += ' jM';
141
141
  return rules;
142
142
  };
143
143
  let $e937566cb5c6349c$export$7814bee2738c4c3 = function anonymous(props) {
144
144
  let rules = " .";
145
- if (props.size === "XL") rules += ' lM';
146
- else if (props.size === "L") rules += ' lK';
147
- else if (props.size === "M") rules += ' lI';
148
- else if (props.size === "S") rules += ' lG';
149
145
  if (props.size === "XL") rules += ' kM';
150
146
  else if (props.size === "L") rules += ' kK';
151
147
  else if (props.size === "M") rules += ' kI';
152
148
  else if (props.size === "S") rules += ' kG';
153
- rules += ' _0b';
154
- rules += ' Va';
155
- rules += ' Y-3760fj';
149
+ if (props.size === "XL") rules += ' jM';
150
+ else if (props.size === "L") rules += ' jK';
151
+ else if (props.size === "M") rules += ' jI';
152
+ else if (props.size === "S") rules += ' jG';
153
+ rules += ' _3b';
154
+ rules += ' Ya';
155
+ rules += ' _b-3760fj';
156
156
  return rules;
157
157
  };
158
158
  let $e937566cb5c6349c$export$f120a3c6038107a5 = function anonymous(props) {
159
159
  let rules = " .";
160
- if (props.thumbStyle === "precise") {
161
- if (props.size === "XL") rules += ' lO';
162
- else if (props.size === "L") rules += ' lM';
163
- else if (props.size === "M") rules += ' lK';
164
- else if (props.size === "S") rules += ' lI';
165
- } else if (props.thumbStyle === "default") {
166
- if (props.size === "XL") rules += ' lM';
167
- else if (props.size === "L") rules += ' lK';
168
- else if (props.size === "M") rules += ' lI';
169
- else if (props.size === "S") rules += ' lG';
170
- }
171
160
  if (props.thumbStyle === "precise") {
172
161
  if (props.size === "XL") rules += ' kO';
173
162
  else if (props.size === "L") rules += ' kM';
@@ -179,54 +168,80 @@ let $e937566cb5c6349c$export$f120a3c6038107a5 = function anonymous(props) {
179
168
  else if (props.size === "M") rules += ' kI';
180
169
  else if (props.size === "S") rules += ' kG';
181
170
  }
171
+ if (props.thumbStyle === "precise") {
172
+ if (props.size === "XL") rules += ' jO';
173
+ else if (props.size === "L") rules += ' jM';
174
+ else if (props.size === "M") rules += ' jK';
175
+ else if (props.size === "S") rules += ' jI';
176
+ } else if (props.thumbStyle === "default") {
177
+ if (props.size === "XL") rules += ' jM';
178
+ else if (props.size === "L") rules += ' jK';
179
+ else if (props.size === "M") rules += ' jI';
180
+ else if (props.size === "S") rules += ' jG';
181
+ }
182
182
  return rules;
183
183
  };
184
184
  let $e937566cb5c6349c$export$becc9140d0e846f8 = function anonymous(props) {
185
185
  let rules = " .";
186
- if (props.isFocusVisible) rules += ' _Mb';
187
- else rules += ' _Ma';
188
- rules += ' da_____M';
189
- rules += ' dx';
190
- rules += ' _Oc';
191
- rules += ' _N-3t1z';
192
- rules += ' _0b';
193
- rules += ' __oa';
194
- rules += ' Va';
195
- rules += ' Y-3760fj';
196
- rules += ' Z-3760fj';
197
- rules += ' U-mn5ko6';
198
- if (props.thumbStyle === "precise") rules += ' lu';
186
+ if (props.isFocusVisible) rules += ' _Pb';
187
+ else rules += ' _Pa';
188
+ rules += ' ca_____M';
189
+ rules += ' cx';
190
+ rules += ' _Rc';
191
+ rules += ' _Q-3t1z';
192
+ rules += ' _3b';
193
+ rules += ' __ra';
194
+ rules += ' Ya';
195
+ rules += ' _b-3760fj';
196
+ rules += ' _c-3760fj';
197
+ rules += ' X-mn5ko6';
198
+ if (props.thumbStyle === "precise") rules += ' ku';
199
199
  else if (props.thumbStyle === "default") {
200
- if (props.size === "XL") rules += ' lM';
201
- else if (props.size === "L") rules += ' lK';
202
- else if (props.size === "M") rules += ' lI';
203
- else if (props.size === "S") rules += ' lG';
204
- }
205
- if (props.thumbStyle === "precise") {
206
- if (props.size === "XL") rules += ' kO';
207
- else if (props.size === "L") rules += ' kM';
208
- else if (props.size === "M") rules += ' kK';
209
- else if (props.size === "S") rules += ' kI';
210
- } else if (props.thumbStyle === "default") {
211
200
  if (props.size === "XL") rules += ' kM';
212
201
  else if (props.size === "L") rules += ' kK';
213
202
  else if (props.size === "M") rules += ' kI';
214
203
  else if (props.size === "S") rules += ' kG';
215
204
  }
216
- rules += ' _wf';
217
- rules += ' _xf';
218
- rules += ' _yf';
205
+ if (props.thumbStyle === "precise") {
206
+ if (props.size === "XL") rules += ' jO';
207
+ else if (props.size === "L") rules += ' jM';
208
+ else if (props.size === "M") rules += ' jK';
209
+ else if (props.size === "S") rules += ' jI';
210
+ } else if (props.thumbStyle === "default") {
211
+ if (props.size === "XL") rules += ' jM';
212
+ else if (props.size === "L") rules += ' jK';
213
+ else if (props.size === "M") rules += ' jI';
214
+ else if (props.size === "S") rules += ' jG';
215
+ }
219
216
  rules += ' _zf';
220
- rules += ' wa';
217
+ rules += ' _Af';
218
+ rules += ' _Bf';
219
+ rules += ' _Cf';
220
+ rules += ' za';
221
+ rules += ' t-375zlr';
221
222
  rules += ' u-375zlr';
222
- rules += ' v-375zlr';
223
+ rules += ' r-375zlr';
223
224
  rules += ' s-375zlr';
224
- rules += ' t-375zlr';
225
- if (props.isDisabled) rules += ' ca_____O';
226
- if (props.isDisabled) rules += ' ci';
227
- else if (props.isDragging) rules += ' co';
228
- else if (props.isHovered) rules += ' co';
229
- else rules += ' cn';
225
+ if (props.isDisabled) rules += ' xa_____O';
226
+ if (props.isDisabled) rules += ' xi';
227
+ else if (props.isDragging) rules += ' xo';
228
+ else if (props.isHovered) rules += ' xo';
229
+ else rules += ' xn';
230
+ if (props.isDisabled) rules += ' ya_____O';
231
+ if (props.isDisabled) rules += ' yi';
232
+ else if (props.isDragging) rules += ' yo';
233
+ else if (props.isHovered) rules += ' yo';
234
+ else rules += ' yn';
235
+ if (props.isDisabled) rules += ' va_____O';
236
+ if (props.isDisabled) rules += ' vi';
237
+ else if (props.isDragging) rules += ' vo';
238
+ else if (props.isHovered) rules += ' vo';
239
+ else rules += ' vn';
240
+ if (props.isDisabled) rules += ' wa_____O';
241
+ if (props.isDisabled) rules += ' wi';
242
+ else if (props.isDragging) rules += ' wo';
243
+ else if (props.isHovered) rules += ' wo';
244
+ else rules += ' wn';
230
245
  rules += ' bd';
231
246
  return rules;
232
247
  };
@@ -247,62 +262,80 @@ const $e937566cb5c6349c$var$trackStyling = {
247
262
  };
248
263
  let $e937566cb5c6349c$export$1e1dc99b6e2204f1 = function anonymous(props) {
249
264
  let rules = " .";
250
- if (props.trackStyle === "thick") rules += ' kE';
251
- else if (props.trackStyle === "thin") rules += ' ks';
252
- rules += ' Y-3760fj';
253
- if (props.trackStyle === "thick") rules += ' _wb';
254
- else if (props.trackStyle === "thin") rules += ' _wd';
255
- if (props.trackStyle === "thick") rules += ' _xb';
256
- else if (props.trackStyle === "thin") rules += ' _xd';
257
- if (props.trackStyle === "thick") rules += ' _yb';
258
- else if (props.trackStyle === "thin") rules += ' _yd';
265
+ if (props.trackStyle === "thick") rules += ' jE';
266
+ else if (props.trackStyle === "thin") rules += ' js';
267
+ rules += ' _b-3760fj';
259
268
  if (props.trackStyle === "thick") rules += ' _zb';
260
269
  else if (props.trackStyle === "thin") rules += ' _zd';
261
- rules += ' Va';
270
+ if (props.trackStyle === "thick") rules += ' _Ab';
271
+ else if (props.trackStyle === "thin") rules += ' _Ad';
272
+ if (props.trackStyle === "thick") rules += ' _Bb';
273
+ else if (props.trackStyle === "thin") rules += ' _Bd';
274
+ if (props.trackStyle === "thick") rules += ' _Cb';
275
+ else if (props.trackStyle === "thin") rules += ' _Cd';
276
+ rules += ' Ya';
262
277
  if (props.isDisabled) rules += ' bg';
263
278
  else rules += ' bi';
264
- rules += ' Q-yj8axo';
265
- rules += ' lb';
266
- rules += ' __oa';
267
- rules += ' wa';
279
+ rules += ' T-yj8axo';
280
+ rules += ' kb';
281
+ rules += ' __ra';
282
+ rules += ' za';
283
+ rules += ' t-yj94cw';
268
284
  rules += ' u-yj94cw';
269
- rules += ' v-yj94cw';
285
+ rules += ' r-yj94cw';
270
286
  rules += ' s-yj94cw';
271
- rules += ' t-yj94cw';
272
- if (props.isDisabled) rules += ' ca_____O';
273
- else rules += ' ca_____K';
274
- rules += ' ca';
287
+ if (props.isDisabled) rules += ' xa_____O';
288
+ else rules += ' xa_____K';
289
+ rules += ' xa';
290
+ if (props.isDisabled) rules += ' ya_____O';
291
+ else rules += ' ya_____K';
292
+ rules += ' ya';
293
+ if (props.isDisabled) rules += ' va_____O';
294
+ else rules += ' va_____K';
295
+ rules += ' va';
296
+ if (props.isDisabled) rules += ' wa_____O';
297
+ else rules += ' wa_____K';
298
+ rules += ' wa';
275
299
  return rules;
276
300
  };
277
301
  let $e937566cb5c6349c$export$847ceef3bc944d02 = function anonymous(props) {
278
302
  let rules = " .";
279
- if (props.trackStyle === "thick") rules += ' kE';
280
- else if (props.trackStyle === "thin") rules += ' ks';
281
- rules += ' Y-3760fj';
282
- if (props.trackStyle === "thick") rules += ' _wb';
283
- else if (props.trackStyle === "thin") rules += ' _wd';
284
- if (props.trackStyle === "thick") rules += ' _xb';
285
- else if (props.trackStyle === "thin") rules += ' _xd';
286
- if (props.trackStyle === "thick") rules += ' _yb';
287
- else if (props.trackStyle === "thin") rules += ' _yd';
303
+ if (props.trackStyle === "thick") rules += ' jE';
304
+ else if (props.trackStyle === "thin") rules += ' js';
305
+ rules += ' _b-3760fj';
288
306
  if (props.trackStyle === "thick") rules += ' _zb';
289
307
  else if (props.trackStyle === "thin") rules += ' _zd';
290
- rules += ' Va';
308
+ if (props.trackStyle === "thick") rules += ' _Ab';
309
+ else if (props.trackStyle === "thin") rules += ' _Ad';
310
+ if (props.trackStyle === "thick") rules += ' _Bb';
311
+ else if (props.trackStyle === "thin") rules += ' _Bd';
312
+ if (props.trackStyle === "thick") rules += ' _Cb';
313
+ else if (props.trackStyle === "thin") rules += ' _Cd';
314
+ rules += ' Ya';
291
315
  if (props.isDisabled) rules += ' ba_____O';
292
316
  else rules += ' ba_____M';
293
317
  if (props.isDisabled) rules += ' bg';
294
318
  else if (props.isEmphasized) rules += ' by';
295
319
  else rules += ' bm';
296
- rules += ' __oa';
297
- rules += ' wa';
320
+ rules += ' __ra';
321
+ rules += ' za';
322
+ rules += ' t-yj94cw';
298
323
  rules += ' u-yj94cw';
299
- rules += ' v-yj94cw';
324
+ rules += ' r-yj94cw';
300
325
  rules += ' s-yj94cw';
301
- rules += ' t-yj94cw';
302
- if (props.isDisabled) rules += ' ca_____O';
303
- else rules += ' ca_____K';
304
- rules += ' ca';
305
- rules += ' Q-yj8axo';
326
+ if (props.isDisabled) rules += ' xa_____O';
327
+ else rules += ' xa_____K';
328
+ rules += ' xa';
329
+ if (props.isDisabled) rules += ' ya_____O';
330
+ else rules += ' ya_____K';
331
+ rules += ' ya';
332
+ if (props.isDisabled) rules += ' va_____O';
333
+ else rules += ' va_____K';
334
+ rules += ' va';
335
+ if (props.isDisabled) rules += ' wa_____O';
336
+ else rules += ' wa_____K';
337
+ rules += ' wa';
338
+ rules += ' T-yj8axo';
306
339
  return rules;
307
340
  };
308
341
  function $e937566cb5c6349c$export$9418495bb635ebde(props1) {
@@ -316,47 +349,47 @@ function $e937566cb5c6349c$export$9418495bb635ebde(props1) {
316
349
  ref: props1.sliderRef,
317
350
  className: (renderProps)=>(props1.UNSAFE_className || '') + (0, $308b180f49d82d28$exports.mergeStyles)(function anonymous(props) {
318
351
  let rules = " .";
319
- rules += ' _0f';
320
- if (props.isInForm) rules += ' __b-3t1y';
352
+ rules += ' _3f';
353
+ if (props.isInForm) rules += ' __e-3t1y';
321
354
  if (props.isInForm) {
322
- if (props.labelPosition === "side") rules += ' __c-yqnebx';
355
+ if (props.labelPosition === "side") rules += ' __f-yqnebx';
323
356
  }
324
- if (props.isInForm) rules += ' __i-1a97rzt';
357
+ if (props.isInForm) rules += ' __l-1a97rzt';
325
358
  else {
326
- if (props.labelPosition === "side") rules += ' __i-ar5vcf';
327
- else if (props.labelPosition === "top") rules += ' __i-2wzs0i';
359
+ if (props.labelPosition === "side") rules += ' __l-ar5vcf';
360
+ else if (props.labelPosition === "top") rules += ' __l-2wzs0i';
328
361
  }
329
- if (props.labelPosition === "side") rules += ' __j-ar5vcf';
330
- else if (props.labelPosition === "top") rules += ' __j-1a6w430';
331
- if (props.labelPosition === "side") rules += ' __k-18h2yqz';
332
- else if (props.labelPosition === "top") rules += ' __k-1srn173';
362
+ if (props.labelPosition === "side") rules += ' __m-ar5vcf';
363
+ else if (props.labelPosition === "top") rules += ' __m-1a6w430';
364
+ if (props.labelPosition === "side") rules += ' __n-18h2yqz';
365
+ else if (props.labelPosition === "top") rules += ' __n-1srn173';
333
366
  if (props.size === "XL") {
334
- rules += ' _ebj';
335
- rules += ' _ei';
367
+ rules += ' _hbj';
368
+ rules += ' _hi';
336
369
  } else if (props.size === "L") {
337
- rules += ' _ebh';
338
- rules += ' _eg';
370
+ rules += ' _hbh';
371
+ rules += ' _hg';
339
372
  } else if (props.size === "S") {
340
- rules += ' _ebd';
341
- rules += ' _ec';
373
+ rules += ' _hbd';
374
+ rules += ' _hc';
342
375
  } else if (props.size === "XS") {
343
- rules += ' _ebb';
344
- rules += ' _ea';
376
+ rules += ' _hbb';
377
+ rules += ' _ha';
345
378
  } else {
346
- rules += ' _ebf';
347
- rules += ' _ee';
379
+ rules += ' _hbf';
380
+ rules += ' _he';
348
381
  }
349
- rules += ' _2d';
350
- rules += ' _g-1x99dlob';
351
- rules += ' _ga';
352
- if (props.size === "XL") rules += ' -aqrvqh_k-j';
353
- else if (props.size === "L") rules += ' -aqrvqh_k-i';
354
- else if (props.size === "S") rules += ' -aqrvqh_k-h';
355
- else if (props.size === "XS") rules += ' -aqrvqh_k-g';
356
- else rules += ' -aqrvqh_k-f';
357
- rules += ' -_1inj1bc_i--prjw07';
358
- rules += ' je';
359
- rules += ' __S-yksgrp';
382
+ rules += ' _5d';
383
+ rules += ' _j-1x99dlob';
384
+ rules += ' _ja';
385
+ if (props.size === "XL") rules += ' -aqrvqh_j-j';
386
+ else if (props.size === "L") rules += ' -aqrvqh_j-i';
387
+ else if (props.size === "S") rules += ' -aqrvqh_j-h';
388
+ else if (props.size === "XS") rules += ' -aqrvqh_j-g';
389
+ else rules += ' -aqrvqh_j-f';
390
+ rules += ' -_1inj1bc_h--prjw07';
391
+ rules += ' ie';
392
+ rules += ' __V-yksgrp';
360
393
  return rules;
361
394
  }({
362
395
  labelPosition: labelPosition,
@@ -425,30 +458,30 @@ function $e937566cb5c6349c$export$9418495bb635ebde(props1) {
425
458
  /*#__PURE__*/ (0, $5DeaH$reactjsxruntime.jsxs)("div", {
426
459
  className: function anonymous(props) {
427
460
  let rules = " .";
428
- rules += ' __b-g2ozi1';
429
- rules += ' __c-g2ozi1';
430
- rules += ' __d-g2ozi1';
431
461
  rules += ' __e-g2ozi1';
432
- if (props.size === "XL") rules += ' qj';
433
- else if (props.size === "L") rules += ' qi';
434
- else if (props.size === "S") rules += ' qh';
435
- else if (props.size === "XS") rules += ' qg';
436
- else rules += ' qf';
437
- if (props.isQuiet) rules += ' __na';
438
- else rules += ' __n-1s8glxue';
439
- if (props.size === "XL") rules += ' -usygro_l-____g';
440
- else if (props.size === "L") rules += ' -usygro_l-___0';
441
- else if (props.size === "S") rules += ' -usygro_l-___u';
442
- else rules += ' -usygro_l-___K';
443
- rules += ' m-rwozxi';
444
- rules += ' _0e';
445
- rules += ' _2c';
462
+ rules += ' __f-g2ozi1';
463
+ rules += ' __g-g2ozi1';
464
+ rules += ' __h-g2ozi1';
465
+ if (props.size === "XL") rules += ' pj';
466
+ else if (props.size === "L") rules += ' pi';
467
+ else if (props.size === "S") rules += ' ph';
468
+ else if (props.size === "XS") rules += ' pg';
469
+ else rules += ' pf';
470
+ if (props.isQuiet) rules += ' __qa';
471
+ else rules += ' __q-1s8glxue';
472
+ if (props.size === "XL") rules += ' -usygro_k-____g';
473
+ else if (props.size === "L") rules += ' -usygro_k-___0';
474
+ else if (props.size === "S") rules += ' -usygro_k-___u';
475
+ else rules += ' -usygro_k-___K';
476
+ rules += ' l-rwozxi';
477
+ rules += ' _3e';
478
+ rules += ' _5c';
479
+ if (props.size === "XL") rules += ' hh';
480
+ else if (props.size === "L") rules += ' hg';
481
+ else rules += ' hf';
446
482
  if (props.size === "XL") rules += ' ih';
447
483
  else if (props.size === "L") rules += ' ig';
448
484
  else rules += ' if';
449
- if (props.size === "XL") rules += ' jh';
450
- else if (props.size === "L") rules += ' jg';
451
- else rules += ' jf';
452
485
  return rules;
453
486
  }({
454
487
  size: size
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/Slider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n Slider as AriaSlider,\n SliderProps as AriaSliderProps,\n ContextValue,\n SliderOutput,\n SliderThumb,\n SliderTrack\n} from 'react-aria-components';\nimport {clamp} from '@react-aria/utils';\nimport {createContext, forwardRef, ReactNode, RefObject, useContext, useRef} from 'react';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldLabel} from './Field';\nimport {FocusableRef, FocusableRefValue, InputDOMProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {FormContext, useFormProps} from './Form';\nimport {mergeStyles} from '../style/runtime';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocale, useNumberFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface SliderBaseProps<T> extends Omit<AriaSliderProps<T>, 'children' | 'style' | 'className' | 'orientation'>, Omit<SpectrumLabelableProps, 'necessityIndicator' | 'isRequired'>, StyleProps {\n children?: ReactNode,\n /**\n * The size of the Slider.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * Whether the Slider should be displayed with an emphasized style.\n */\n isEmphasized?: boolean,\n /**\n * The style of the Slider's track.\n *\n * @default 'thin'\n */\n trackStyle?: 'thin' | 'thick', // TODO: add ramp\n /**\n * The style of the Slider's thumb.\n *\n * @default 'default'\n */\n thumbStyle?: 'default' | 'precise'\n // TODO\n // isEditable?: boolean,\n}\n\nexport interface SliderProps extends Omit<SliderBaseProps<number>, 'children'>, InputDOMProps {\n /**\n * The offset from which to start the fill.\n */\n fillOffset?: number\n}\n\nexport const SliderContext = createContext<ContextValue<SliderProps, FocusableRefValue<HTMLDivElement>>>(null);\n\nconst slider = style({\n font: 'control',\n alignItems: {\n labelPosition: {\n side: 'center'\n }\n },\n color: {\n default: 'neutral-subdued',\n isDisabled: 'disabled'\n },\n columnGap: {\n size: {\n S: 16,\n M: 16,\n L: 20,\n XL: 24\n },\n isInForm: 12\n }\n}, getAllowedOverrides());\n\nconst labelContainer = style({\n display: {\n labelPosition: {\n top: 'grid'\n }\n },\n gridArea: 'label',\n width: 'full',\n gridTemplateAreas: {\n labelPosition: {\n top: ['label output']\n }\n },\n gridTemplateColumns: {\n labelPosition: {\n top: [\n '1fr auto'\n ]\n }\n },\n textAlign: {\n labelPosition: {\n side: {\n labelAlign: {\n start: 'start',\n end: 'end'\n }\n }\n }\n },\n '--field-gap': {\n type: 'paddingBottom',\n value: 0\n }\n});\n\nconst output = style({\n gridArea: 'output',\n textAlign: {\n labelPosition: {\n top: {\n direction: {\n ltr: 'end',\n rtl: 'start'\n }\n },\n side: {\n direction: {\n ltr: 'start',\n rtl: 'end'\n },\n isInForm: 'end'\n }\n }\n }\n});\n\nexport let track = style({\n gridArea: 'track',\n position: 'relative',\n width: 'full',\n height: {\n size: {\n S: 24,\n M: 32,\n L: 40,\n XL: 48\n }\n }\n});\n\nexport let thumbContainer = style({\n size: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n display: 'inline-block',\n position: 'absolute',\n top: '[50%]'\n});\n\n// if precision thumb should have a smaller hit area, then remove this\nexport let thumbHitArea = style({\n size: {\n thumbStyle: {\n default: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n precise: {\n size: {\n S: 20,\n M: 22,\n L: 24,\n XL: 26\n }\n }\n }\n }\n});\n\nexport let thumb = style({\n ...focusRing(),\n display: 'inline-block',\n boxSizing: 'border-box',\n position: 'absolute',\n top: '[50%]',\n left: '[50%]',\n transform: 'translateY(-50%) translateX(-50%)',\n width: {\n thumbStyle: {\n default: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n precise: 6\n }\n },\n height: {\n thumbStyle: {\n default: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n precise: {\n size: {\n S: 20,\n M: 22,\n L: 24,\n XL: 26\n }\n }\n }\n },\n borderRadius: 'full',\n borderStyle: 'solid',\n borderWidth: '[2px]',\n borderColor: {\n default: 'gray-800',\n isHovered: 'gray-900',\n isDragging: 'gray-900',\n isDisabled: 'disabled',\n forcedColors: {\n isDisabled: 'GrayText'\n }\n },\n backgroundColor: 'gray-25'\n});\n\nconst trackStyling = {\n height: {\n trackStyle: {\n thin: 4,\n thick: 16\n }\n },\n top: '[50%]',\n borderRadius: {\n trackStyle: {\n thin: 'lg',\n thick: 'sm'\n }\n }\n} as const;\n\nexport let upperTrack = style({\n ...trackStyling,\n position: 'absolute',\n backgroundColor: {\n default: 'gray-300',\n isDisabled: 'disabled'\n },\n translateY: '[-50%]',\n width: 'full',\n boxSizing: 'border-box',\n borderStyle: 'solid',\n borderWidth: '[.5px]',\n borderColor: {\n default: 'transparent',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n});\n\nexport let filledTrack = style({\n ...trackStyling,\n position: 'absolute',\n backgroundColor: {\n default: 'gray-700',\n isEmphasized: 'accent-900',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n boxSizing: 'border-box',\n borderStyle: 'solid',\n borderWidth: '[.5px]',\n borderColor: {\n default: 'transparent',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n },\n translateY: '[-50%]'\n});\n\nexport function SliderBase<T extends number | number[]>(props: SliderBaseProps<T> & {sliderRef: RefObject<HTMLDivElement | null>}) {\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n label,\n labelPosition = 'top',\n labelAlign = 'start',\n size = 'M',\n minValue = 0,\n maxValue = 100,\n formatOptions\n } = props;\n let formatter = useNumberFormatter(formatOptions);\n let {direction} = useLocale();\n\n return (\n <AriaSlider\n {...props}\n ref={props.sliderRef}\n className={renderProps => (props.UNSAFE_className || '') + mergeStyles(style(field())({labelPosition, isInForm: !!formContext}), slider({...renderProps, labelPosition, size, isInForm: !!formContext}, props.styles))}>\n {({state}) => {\n let maxLabelLength = Math.max([...formatter.format(minValue)].length, [...formatter.format(maxValue)].length);\n switch (state.values.length) {\n case 1:\n break;\n case 2:\n // This should really use the NumberFormat#formatRange proposal...\n // https://github.com/tc39/ecma402/issues/393\n // https://github.com/tc39/proposal-intl-numberformat-v3#formatrange-ecma-402-393\n // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/formatRange\n maxLabelLength = 3 + 2 * Math.max(\n maxLabelLength,\n [...formatter.format(minValue)].length, [...formatter.format(maxValue)].length\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n\n let outputValue = (\n <SliderOutput\n style={{width: `${maxLabelLength}ch`, minWidth: `${maxLabelLength}ch`, fontVariantNumeric: 'tabular-nums'}}\n className={output({direction, labelPosition, isInForm: !!formContext})}>\n {({state}) =>\n state.values.map((_, i) => state.getThumbValueLabel(i)).join(' – ')}\n </SliderOutput>\n );\n\n return (\n <>\n <div className={labelContainer({labelPosition, labelAlign})}>\n <FieldLabel\n isDisabled={props.isDisabled}\n size={props.size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n contextualHelp={props.contextualHelp}>\n {label}\n </FieldLabel>\n {labelPosition === 'top' && outputValue}\n </div>\n <div className={style({...fieldInput(), display: 'inline-flex', alignItems: 'center', gap: {default: 16, size: {L: 20, XL: 24}}})({size})}>\n {props.children}\n {labelPosition === 'side' && outputValue}\n </div>\n </>\n );\n }}\n </AriaSlider>\n );\n}\n\nexport const Slider = /*#__PURE__*/ forwardRef(function Slider(props: SliderProps, ref: FocusableRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, SliderContext);\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n labelPosition = 'top',\n size = 'M',\n fillOffset,\n isEmphasized,\n trackStyle = 'thin',\n thumbStyle = 'default'\n } = props;\n let thumbRef = useRef(null);\n let inputRef = useRef(null); // TODO: need to pass inputRef to SliderThumb when we release the next version of RAC 1.3.0\n let domRef = useFocusableRef(ref, inputRef);\n let {direction} = useLocale();\n let cssDirection = direction === 'rtl' ? 'right' : 'left';\n\n return (\n <SliderBase\n {...props}\n sliderRef={domRef}>\n <SliderTrack\n className={track({size, labelPosition, isInForm: !!formContext})}>\n {({state, isDisabled}) => {\n\n fillOffset = fillOffset !== undefined ? clamp(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : state.getThumbMinValue(0);\n\n let fillWidth = state.getThumbPercent(0) - state.getValuePercent(fillOffset);\n let isRightOfOffset = fillWidth > 0;\n let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);\n\n return (\n <>\n <div className={upperTrack({isDisabled, trackStyle})} />\n <div style={{width: `${Math.abs(fillWidth) * 100}%`, [cssDirection]: `${offset * 100}%`}} className={filledTrack({isDisabled, isEmphasized, trackStyle})} />\n <SliderThumb className={thumbContainer} index={0} name={props.name} ref={thumbRef} style={(renderProps) => pressScale(thumbRef, {transform: 'translate(-50%, -50%)'})({...renderProps, isPressed: renderProps.isDragging})}>\n {(renderProps) => (\n <div className={thumbHitArea({size})}>\n <div\n className={thumb({\n ...renderProps,\n size,\n thumbStyle\n })} />\n </div>\n )}\n </SliderThumb>\n </>\n );\n }}\n </SliderTrack>\n </SliderBase>\n );\n});\n"],"names":[],"version":3,"file":"Slider.cjs.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AA0DM,MAAM,0DAAgB,CAAA,GAAA,0BAAY,EAAgE;AAEzG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBN,MAAM;;;;;;;;;;;;;;;;;AAoCN,MAAM;;;;;;;;;;;;;;;;AAqBC,IAAI;;;;;;;;;;;;;;AAcJ,IAAI;;;;;;;;;;;;;;;AAeJ,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBJ,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDX,MAAM,qCAAe;IACnB,QAAQ;QACN,YAAY;YACV,MAAM;YACN,OAAO;QACT;IACF;IACA,KAAK;IACL,cAAc;QACZ,YAAY;YACV,MAAM;YACN,OAAO;QACT;IACF;AACF;AAEO,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBJ,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBJ,SAAS,0CAAwC,MAAyE;IAC/H,IAAI,cAAc,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,qCAAU;IACvC,SAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,SACF,KAAK,iBACL,gBAAgB,mBAChB,aAAa,eACb,OAAO,eACP,WAAW,aACX,WAAW,oBACX,aAAa,EACd,GAAG;IACJ,IAAI,YAAY,CAAA,GAAA,uCAAiB,EAAE;IACnC,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,8BAAQ;IAE1B,qBACE,gCAAC,CAAA,GAAA,iCAAS;QACP,GAAG,MAAK;QACT,KAAK,OAAM,SAAS;QACpB,WAAW,CAAA,cAAe,AAAC,CAAA,OAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,qCAAU,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAAe;+BAAC;gBAAe,UAAU,CAAC,CAAC;YAAW,IAAI,6BAAO;gBAAC,GAAG,WAAW;+BAAE;sBAAe;gBAAM,UAAU,CAAC,CAAC;YAAW,GAAG,OAAM,MAAM;kBACnN,CAAC,SAAC,KAAK,EAAC;YACP,IAAI,iBAAiB,KAAK,GAAG,CAAC;mBAAI,UAAU,MAAM,CAAC;aAAU,CAAC,MAAM,EAAE;mBAAI,UAAU,MAAM,CAAC;aAAU,CAAC,MAAM;YAC5G,OAAQ,MAAM,MAAM,CAAC,MAAM;gBACzB,KAAK;oBACH;gBACF,KAAK;oBACH,kEAAkE;oBAClE,6CAA6C;oBAC7C,iFAAiF;oBACjF,iHAAiH;oBACjH,iBAAiB,IAAI,IAAI,KAAK,GAAG,CAC/B,gBACA;2BAAI,UAAU,MAAM,CAAC;qBAAU,CAAC,MAAM,EAAE;2BAAI,UAAU,MAAM,CAAC;qBAAU,CAAC,MAAM;oBAEhF;gBACF;oBACE,MAAM,IAAI,MAAM;YACpB;YAEA,IAAI,4BACF,gCAAC,CAAA,GAAA,uCAAW;gBACV,OAAO;oBAAC,OAAO,GAAG,eAAe,EAAE,CAAC;oBAAE,UAAU,GAAG,eAAe,EAAE,CAAC;oBAAE,oBAAoB;gBAAc;gBACzG,WAAW,6BAAO;+BAAC;mCAAW;oBAAe,UAAU,CAAC,CAAC;gBAAW;0BACnE,CAAC,SAAC,KAAK,EAAC,GACP,MAAM,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,IAAM,MAAM,kBAAkB,CAAC,IAAI,IAAI,CAAC;;YAInE,qBACE;;kCACE,iCAAC;wBAAI,WAAW,qCAAe;2CAAC;wCAAe;wBAAU;;0CACvD,gCAAC,CAAA,GAAA,oCAAS;gCACR,YAAY,OAAM,UAAU;gCAC5B,MAAM,OAAM,IAAI;gCAChB,eAAe;gCACf,YAAY;gCACZ,gBAAgB,OAAM,cAAc;0CACnC;;4BAEF,kBAAkB,SAAS;;;kCAE9B,iCAAC;wBAAI,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAAkH;kCAAC;wBAAI;;4BACpI,OAAM,QAAQ;4BACd,kBAAkB,UAAU;;;;;QAIrC;;AAGN;AAEO,MAAM,4CAAS,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE,SAAS,OAAO,KAAkB,EAAE,GAAiC;IAClH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,cAAc,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,qCAAU;IACvC,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,iBACF,gBAAgB,aAChB,OAAO,iBACP,UAAU,gBACV,YAAY,cACZ,aAAa,oBACb,aAAa,WACd,GAAG;IACJ,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE;IACtB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAE,OAAO,2FAA2F;IACxH,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE,KAAK;IAClC,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,8BAAQ;IAC1B,IAAI,eAAe,cAAc,QAAQ,UAAU;IAEnD,qBACE,gCAAC;QACE,GAAG,KAAK;QACT,WAAW;kBACX,cAAA,gCAAC,CAAA,GAAA,sCAAU;YACT,WAAW,0CAAM;sBAAC;+BAAM;gBAAe,UAAU,CAAC,CAAC;YAAW;sBAC7D,CAAC,SAAC,KAAK,cAAE,UAAU,EAAC;gBAEnB,aAAa,eAAe,YAAY,CAAA,GAAA,2BAAI,EAAE,YAAY,MAAM,gBAAgB,CAAC,IAAI,MAAM,gBAAgB,CAAC,MAAM,MAAM,gBAAgB,CAAC;gBAEzI,IAAI,YAAY,MAAM,eAAe,CAAC,KAAK,MAAM,eAAe,CAAC;gBACjE,IAAI,kBAAkB,YAAY;gBAClC,IAAI,SAAS,kBAAkB,MAAM,eAAe,CAAC,cAAc,MAAM,eAAe,CAAC;gBAEzF,qBACE;;sCACE,gCAAC;4BAAI,WAAW,0CAAW;4CAAC;4CAAY;4BAAU;;sCAClD,gCAAC;4BAAI,OAAO;gCAAC,OAAO,GAAG,KAAK,GAAG,CAAC,aAAa,IAAI,CAAC,CAAC;gCAAE,CAAC,aAAa,EAAE,GAAG,SAAS,IAAI,CAAC,CAAC;4BAAA;4BAAG,WAAW,0CAAY;4CAAC;8CAAY;4CAAc;4BAAU;;sCACtJ,gCAAC,CAAA,GAAA,sCAAU;4BAAG,WAAW;4BAAgB,OAAO;4BAAG,MAAM,MAAM,IAAI;4BAAE,KAAK;4BAAU,OAAO,CAAC,cAAgB,CAAA,GAAA,oCAAS,EAAE,UAAU;oCAAC,WAAW;gCAAuB,GAAG;oCAAC,GAAG,WAAW;oCAAE,WAAW,YAAY,UAAU;gCAAA;sCACtN,CAAC,4BACA,gCAAC;oCAAI,WAAW,0CAAa;8CAAC;oCAAI;8CAChC,cAAA,gCAAC;wCACC,WAAW,0CAAM;4CACf,GAAG,WAAW;kDACd;wDACA;wCACF;;;;;;YAMd;;;AAIR","sources":["packages/@react-spectrum/s2/src/Slider.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n Slider as AriaSlider,\n SliderProps as AriaSliderProps,\n ContextValue,\n SliderOutput,\n SliderThumb,\n SliderTrack\n} from 'react-aria-components';\nimport {clamp} from '@react-aria/utils';\nimport {createContext, forwardRef, ReactNode, RefObject, useContext, useRef} from 'react';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldLabel} from './Field';\nimport {FocusableRef, FocusableRefValue, InputDOMProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {FormContext, useFormProps} from './Form';\nimport {mergeStyles} from '../style/runtime';\nimport {pressScale} from './pressScale';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useLocale, useNumberFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface SliderBaseProps<T> extends Omit<AriaSliderProps<T>, 'children' | 'style' | 'className' | 'orientation'>, Omit<SpectrumLabelableProps, 'necessityIndicator' | 'isRequired'>, StyleProps {\n children?: ReactNode,\n /**\n * The size of the Slider.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * Whether the Slider should be displayed with an emphasized style.\n */\n isEmphasized?: boolean,\n /**\n * The style of the Slider's track.\n *\n * @default 'thin'\n */\n trackStyle?: 'thin' | 'thick', // TODO: add ramp\n /**\n * The style of the Slider's thumb.\n *\n * @default 'default'\n */\n thumbStyle?: 'default' | 'precise'\n // TODO\n // isEditable?: boolean,\n}\n\nexport interface SliderProps extends Omit<SliderBaseProps<number>, 'children'>, InputDOMProps {\n /**\n * The offset from which to start the fill.\n */\n fillOffset?: number\n}\n\nexport const SliderContext = createContext<ContextValue<SliderProps, FocusableRefValue<HTMLDivElement>>>(null);\n\nconst slider = style({\n font: 'control',\n alignItems: {\n labelPosition: {\n side: 'center'\n }\n },\n color: {\n default: 'neutral-subdued',\n isDisabled: 'disabled'\n },\n columnGap: {\n size: {\n S: 16,\n M: 16,\n L: 20,\n XL: 24\n },\n isInForm: 12\n }\n}, getAllowedOverrides());\n\nconst labelContainer = style({\n display: {\n labelPosition: {\n top: 'grid'\n }\n },\n gridArea: 'label',\n width: 'full',\n gridTemplateAreas: {\n labelPosition: {\n top: ['label output']\n }\n },\n gridTemplateColumns: {\n labelPosition: {\n top: [\n '1fr auto'\n ]\n }\n },\n textAlign: {\n labelPosition: {\n side: {\n labelAlign: {\n start: 'start',\n end: 'end'\n }\n }\n }\n },\n '--field-gap': {\n type: 'paddingBottom',\n value: 0\n }\n});\n\nconst output = style({\n gridArea: 'output',\n textAlign: {\n labelPosition: {\n top: {\n direction: {\n ltr: 'end',\n rtl: 'start'\n }\n },\n side: {\n direction: {\n ltr: 'start',\n rtl: 'end'\n },\n isInForm: 'end'\n }\n }\n }\n});\n\nexport let track = style({\n gridArea: 'track',\n position: 'relative',\n width: 'full',\n height: {\n size: {\n S: 24,\n M: 32,\n L: 40,\n XL: 48\n }\n }\n});\n\nexport let thumbContainer = style({\n size: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n display: 'inline-block',\n position: 'absolute',\n top: '[50%]'\n});\n\n// if precision thumb should have a smaller hit area, then remove this\nexport let thumbHitArea = style({\n size: {\n thumbStyle: {\n default: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n precise: {\n size: {\n S: 20,\n M: 22,\n L: 24,\n XL: 26\n }\n }\n }\n }\n});\n\nexport let thumb = style({\n ...focusRing(),\n display: 'inline-block',\n boxSizing: 'border-box',\n position: 'absolute',\n top: '[50%]',\n left: '[50%]',\n transform: 'translateY(-50%) translateX(-50%)',\n width: {\n thumbStyle: {\n default: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n precise: 6\n }\n },\n height: {\n thumbStyle: {\n default: {\n size: {\n S: 18,\n M: 20,\n L: 22,\n XL: 24\n }\n },\n precise: {\n size: {\n S: 20,\n M: 22,\n L: 24,\n XL: 26\n }\n }\n }\n },\n borderRadius: 'full',\n borderStyle: 'solid',\n borderWidth: '[2px]',\n borderColor: {\n default: 'gray-800',\n isHovered: 'gray-900',\n isDragging: 'gray-900',\n isDisabled: 'disabled',\n forcedColors: {\n isDisabled: 'GrayText'\n }\n },\n backgroundColor: 'gray-25'\n});\n\nconst trackStyling = {\n height: {\n trackStyle: {\n thin: 4,\n thick: 16\n }\n },\n top: '[50%]',\n borderRadius: {\n trackStyle: {\n thin: 'lg',\n thick: 'sm'\n }\n }\n} as const;\n\nexport let upperTrack = style({\n ...trackStyling,\n position: 'absolute',\n backgroundColor: {\n default: 'gray-300',\n isDisabled: 'disabled'\n },\n translateY: '[-50%]',\n width: 'full',\n boxSizing: 'border-box',\n borderStyle: 'solid',\n borderWidth: '[.5px]',\n borderColor: {\n default: 'transparent',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n }\n});\n\nexport let filledTrack = style({\n ...trackStyling,\n position: 'absolute',\n backgroundColor: {\n default: 'gray-700',\n isEmphasized: 'accent-900',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n boxSizing: 'border-box',\n borderStyle: 'solid',\n borderWidth: '[.5px]',\n borderColor: {\n default: 'transparent',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n },\n translateY: '[-50%]'\n});\n\nexport function SliderBase<T extends number | number[]>(props: SliderBaseProps<T> & {sliderRef: RefObject<HTMLDivElement | null>}) {\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n label,\n labelPosition = 'top',\n labelAlign = 'start',\n size = 'M',\n minValue = 0,\n maxValue = 100,\n formatOptions\n } = props;\n let formatter = useNumberFormatter(formatOptions);\n let {direction} = useLocale();\n\n return (\n <AriaSlider\n {...props}\n ref={props.sliderRef}\n className={renderProps => (props.UNSAFE_className || '') + mergeStyles(style(field())({labelPosition, isInForm: !!formContext}), slider({...renderProps, labelPosition, size, isInForm: !!formContext}, props.styles))}>\n {({state}) => {\n let maxLabelLength = Math.max([...formatter.format(minValue)].length, [...formatter.format(maxValue)].length);\n switch (state.values.length) {\n case 1:\n break;\n case 2:\n // This should really use the NumberFormat#formatRange proposal...\n // https://github.com/tc39/ecma402/issues/393\n // https://github.com/tc39/proposal-intl-numberformat-v3#formatrange-ecma-402-393\n // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/formatRange\n maxLabelLength = 3 + 2 * Math.max(\n maxLabelLength,\n [...formatter.format(minValue)].length, [...formatter.format(maxValue)].length\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n\n let outputValue = (\n <SliderOutput\n style={{width: `${maxLabelLength}ch`, minWidth: `${maxLabelLength}ch`, fontVariantNumeric: 'tabular-nums'}}\n className={output({direction, labelPosition, isInForm: !!formContext})}>\n {({state}) =>\n state.values.map((_, i) => state.getThumbValueLabel(i)).join(' – ')}\n </SliderOutput>\n );\n\n return (\n <>\n <div className={labelContainer({labelPosition, labelAlign})}>\n <FieldLabel\n isDisabled={props.isDisabled}\n size={props.size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n contextualHelp={props.contextualHelp}>\n {label}\n </FieldLabel>\n {labelPosition === 'top' && outputValue}\n </div>\n <div className={style({...fieldInput(), display: 'inline-flex', alignItems: 'center', gap: {default: 16, size: {L: 20, XL: 24}}})({size})}>\n {props.children}\n {labelPosition === 'side' && outputValue}\n </div>\n </>\n );\n }}\n </AriaSlider>\n );\n}\n\nexport const Slider = /*#__PURE__*/ forwardRef(function Slider(props: SliderProps, ref: FocusableRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, SliderContext);\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n labelPosition = 'top',\n size = 'M',\n fillOffset,\n isEmphasized,\n trackStyle = 'thin',\n thumbStyle = 'default'\n } = props;\n let thumbRef = useRef(null);\n let inputRef = useRef(null); // TODO: need to pass inputRef to SliderThumb when we release the next version of RAC 1.3.0\n let domRef = useFocusableRef(ref, inputRef);\n let {direction} = useLocale();\n let cssDirection = direction === 'rtl' ? 'right' : 'left';\n\n return (\n <SliderBase\n {...props}\n sliderRef={domRef}>\n <SliderTrack\n className={track({size, labelPosition, isInForm: !!formContext})}>\n {({state, isDisabled}) => {\n\n fillOffset = fillOffset !== undefined ? clamp(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : state.getThumbMinValue(0);\n\n let fillWidth = state.getThumbPercent(0) - state.getValuePercent(fillOffset);\n let isRightOfOffset = fillWidth > 0;\n let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);\n\n return (\n <>\n <div className={upperTrack({isDisabled, trackStyle})} />\n <div style={{width: `${Math.abs(fillWidth) * 100}%`, [cssDirection]: `${offset * 100}%`}} className={filledTrack({isDisabled, isEmphasized, trackStyle})} />\n <SliderThumb className={thumbContainer} index={0} name={props.name} ref={thumbRef} style={(renderProps) => pressScale(thumbRef, {transform: 'translate(-50%, -50%)'})({...renderProps, isPressed: renderProps.isDragging})}>\n {(renderProps) => (\n <div className={thumbHitArea({size})}>\n <div\n className={thumb({\n ...renderProps,\n size,\n thumbStyle\n })} />\n </div>\n )}\n </SliderThumb>\n </>\n );\n }}\n </SliderTrack>\n </SliderBase>\n );\n});\n"],"names":[],"version":3,"file":"Slider.cjs.map"}