@react-spectrum/slider 3.8.5 → 3.9.0

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 (216) hide show
  1. package/dist/import.mjs +3 -3
  2. package/dist/main.js +4 -4
  3. package/dist/main.js.map +1 -1
  4. package/dist/module.js +3 -3
  5. package/dist/module.js.map +1 -1
  6. package/dist/types/src/index.d.ts +5 -0
  7. package/package.json +12 -34
  8. package/src/index.ts +6 -3
  9. package/dist/RangeSlider.main.js +0 -120
  10. package/dist/RangeSlider.main.js.map +0 -1
  11. package/dist/RangeSlider.mjs +0 -115
  12. package/dist/RangeSlider.module.js +0 -115
  13. package/dist/RangeSlider.module.js.map +0 -1
  14. package/dist/Slider.main.js +0 -121
  15. package/dist/Slider.main.js.map +0 -1
  16. package/dist/Slider.mjs +0 -116
  17. package/dist/Slider.module.js +0 -116
  18. package/dist/Slider.module.js.map +0 -1
  19. package/dist/SliderBase.main.js +0 -169
  20. package/dist/SliderBase.main.js.map +0 -1
  21. package/dist/SliderBase.mjs +0 -164
  22. package/dist/SliderBase.module.js +0 -164
  23. package/dist/SliderBase.module.js.map +0 -1
  24. package/dist/SliderThumb.main.js +0 -67
  25. package/dist/SliderThumb.main.js.map +0 -1
  26. package/dist/SliderThumb.mjs +0 -62
  27. package/dist/SliderThumb.module.js +0 -62
  28. package/dist/SliderThumb.module.js.map +0 -1
  29. package/dist/ar-AE.main.js +0 -7
  30. package/dist/ar-AE.main.js.map +0 -1
  31. package/dist/ar-AE.mjs +0 -9
  32. package/dist/ar-AE.module.js +0 -9
  33. package/dist/ar-AE.module.js.map +0 -1
  34. package/dist/bg-BG.main.js +0 -7
  35. package/dist/bg-BG.main.js.map +0 -1
  36. package/dist/bg-BG.mjs +0 -9
  37. package/dist/bg-BG.module.js +0 -9
  38. package/dist/bg-BG.module.js.map +0 -1
  39. package/dist/cs-CZ.main.js +0 -7
  40. package/dist/cs-CZ.main.js.map +0 -1
  41. package/dist/cs-CZ.mjs +0 -9
  42. package/dist/cs-CZ.module.js +0 -9
  43. package/dist/cs-CZ.module.js.map +0 -1
  44. package/dist/da-DK.main.js +0 -7
  45. package/dist/da-DK.main.js.map +0 -1
  46. package/dist/da-DK.mjs +0 -9
  47. package/dist/da-DK.module.js +0 -9
  48. package/dist/da-DK.module.js.map +0 -1
  49. package/dist/de-DE.main.js +0 -7
  50. package/dist/de-DE.main.js.map +0 -1
  51. package/dist/de-DE.mjs +0 -9
  52. package/dist/de-DE.module.js +0 -9
  53. package/dist/de-DE.module.js.map +0 -1
  54. package/dist/el-GR.main.js +0 -7
  55. package/dist/el-GR.main.js.map +0 -1
  56. package/dist/el-GR.mjs +0 -9
  57. package/dist/el-GR.module.js +0 -9
  58. package/dist/el-GR.module.js.map +0 -1
  59. package/dist/en-US.main.js +0 -7
  60. package/dist/en-US.main.js.map +0 -1
  61. package/dist/en-US.mjs +0 -9
  62. package/dist/en-US.module.js +0 -9
  63. package/dist/en-US.module.js.map +0 -1
  64. package/dist/es-ES.main.js +0 -7
  65. package/dist/es-ES.main.js.map +0 -1
  66. package/dist/es-ES.mjs +0 -9
  67. package/dist/es-ES.module.js +0 -9
  68. package/dist/es-ES.module.js.map +0 -1
  69. package/dist/et-EE.main.js +0 -7
  70. package/dist/et-EE.main.js.map +0 -1
  71. package/dist/et-EE.mjs +0 -9
  72. package/dist/et-EE.module.js +0 -9
  73. package/dist/et-EE.module.js.map +0 -1
  74. package/dist/fi-FI.main.js +0 -7
  75. package/dist/fi-FI.main.js.map +0 -1
  76. package/dist/fi-FI.mjs +0 -9
  77. package/dist/fi-FI.module.js +0 -9
  78. package/dist/fi-FI.module.js.map +0 -1
  79. package/dist/fr-FR.main.js +0 -7
  80. package/dist/fr-FR.main.js.map +0 -1
  81. package/dist/fr-FR.mjs +0 -9
  82. package/dist/fr-FR.module.js +0 -9
  83. package/dist/fr-FR.module.js.map +0 -1
  84. package/dist/he-IL.main.js +0 -7
  85. package/dist/he-IL.main.js.map +0 -1
  86. package/dist/he-IL.mjs +0 -9
  87. package/dist/he-IL.module.js +0 -9
  88. package/dist/he-IL.module.js.map +0 -1
  89. package/dist/hr-HR.main.js +0 -7
  90. package/dist/hr-HR.main.js.map +0 -1
  91. package/dist/hr-HR.mjs +0 -9
  92. package/dist/hr-HR.module.js +0 -9
  93. package/dist/hr-HR.module.js.map +0 -1
  94. package/dist/hu-HU.main.js +0 -7
  95. package/dist/hu-HU.main.js.map +0 -1
  96. package/dist/hu-HU.mjs +0 -9
  97. package/dist/hu-HU.module.js +0 -9
  98. package/dist/hu-HU.module.js.map +0 -1
  99. package/dist/intlStrings.main.js +0 -108
  100. package/dist/intlStrings.main.js.map +0 -1
  101. package/dist/intlStrings.mjs +0 -110
  102. package/dist/intlStrings.module.js +0 -110
  103. package/dist/intlStrings.module.js.map +0 -1
  104. package/dist/it-IT.main.js +0 -7
  105. package/dist/it-IT.main.js.map +0 -1
  106. package/dist/it-IT.mjs +0 -9
  107. package/dist/it-IT.module.js +0 -9
  108. package/dist/it-IT.module.js.map +0 -1
  109. package/dist/ja-JP.main.js +0 -7
  110. package/dist/ja-JP.main.js.map +0 -1
  111. package/dist/ja-JP.mjs +0 -9
  112. package/dist/ja-JP.module.js +0 -9
  113. package/dist/ja-JP.module.js.map +0 -1
  114. package/dist/ko-KR.main.js +0 -7
  115. package/dist/ko-KR.main.js.map +0 -1
  116. package/dist/ko-KR.mjs +0 -9
  117. package/dist/ko-KR.module.js +0 -9
  118. package/dist/ko-KR.module.js.map +0 -1
  119. package/dist/lt-LT.main.js +0 -7
  120. package/dist/lt-LT.main.js.map +0 -1
  121. package/dist/lt-LT.mjs +0 -9
  122. package/dist/lt-LT.module.js +0 -9
  123. package/dist/lt-LT.module.js.map +0 -1
  124. package/dist/lv-LV.main.js +0 -7
  125. package/dist/lv-LV.main.js.map +0 -1
  126. package/dist/lv-LV.mjs +0 -9
  127. package/dist/lv-LV.module.js +0 -9
  128. package/dist/lv-LV.module.js.map +0 -1
  129. package/dist/nb-NO.main.js +0 -7
  130. package/dist/nb-NO.main.js.map +0 -1
  131. package/dist/nb-NO.mjs +0 -9
  132. package/dist/nb-NO.module.js +0 -9
  133. package/dist/nb-NO.module.js.map +0 -1
  134. package/dist/nl-NL.main.js +0 -7
  135. package/dist/nl-NL.main.js.map +0 -1
  136. package/dist/nl-NL.mjs +0 -9
  137. package/dist/nl-NL.module.js +0 -9
  138. package/dist/nl-NL.module.js.map +0 -1
  139. package/dist/pl-PL.main.js +0 -7
  140. package/dist/pl-PL.main.js.map +0 -1
  141. package/dist/pl-PL.mjs +0 -9
  142. package/dist/pl-PL.module.js +0 -9
  143. package/dist/pl-PL.module.js.map +0 -1
  144. package/dist/pt-BR.main.js +0 -7
  145. package/dist/pt-BR.main.js.map +0 -1
  146. package/dist/pt-BR.mjs +0 -9
  147. package/dist/pt-BR.module.js +0 -9
  148. package/dist/pt-BR.module.js.map +0 -1
  149. package/dist/pt-PT.main.js +0 -7
  150. package/dist/pt-PT.main.js.map +0 -1
  151. package/dist/pt-PT.mjs +0 -9
  152. package/dist/pt-PT.module.js +0 -9
  153. package/dist/pt-PT.module.js.map +0 -1
  154. package/dist/ro-RO.main.js +0 -7
  155. package/dist/ro-RO.main.js.map +0 -1
  156. package/dist/ro-RO.mjs +0 -9
  157. package/dist/ro-RO.module.js +0 -9
  158. package/dist/ro-RO.module.js.map +0 -1
  159. package/dist/ru-RU.main.js +0 -7
  160. package/dist/ru-RU.main.js.map +0 -1
  161. package/dist/ru-RU.mjs +0 -9
  162. package/dist/ru-RU.module.js +0 -9
  163. package/dist/ru-RU.module.js.map +0 -1
  164. package/dist/sk-SK.main.js +0 -7
  165. package/dist/sk-SK.main.js.map +0 -1
  166. package/dist/sk-SK.mjs +0 -9
  167. package/dist/sk-SK.module.js +0 -9
  168. package/dist/sk-SK.module.js.map +0 -1
  169. package/dist/sl-SI.main.js +0 -7
  170. package/dist/sl-SI.main.js.map +0 -1
  171. package/dist/sl-SI.mjs +0 -9
  172. package/dist/sl-SI.module.js +0 -9
  173. package/dist/sl-SI.module.js.map +0 -1
  174. package/dist/slider.674e7af0.css +0 -1189
  175. package/dist/slider.674e7af0.css.map +0 -1
  176. package/dist/slider_vars_css.main.js +0 -146
  177. package/dist/slider_vars_css.main.js.map +0 -1
  178. package/dist/slider_vars_css.mjs +0 -148
  179. package/dist/slider_vars_css.module.js +0 -148
  180. package/dist/slider_vars_css.module.js.map +0 -1
  181. package/dist/sr-SP.main.js +0 -7
  182. package/dist/sr-SP.main.js.map +0 -1
  183. package/dist/sr-SP.mjs +0 -9
  184. package/dist/sr-SP.module.js +0 -9
  185. package/dist/sr-SP.module.js.map +0 -1
  186. package/dist/sv-SE.main.js +0 -7
  187. package/dist/sv-SE.main.js.map +0 -1
  188. package/dist/sv-SE.mjs +0 -9
  189. package/dist/sv-SE.module.js +0 -9
  190. package/dist/sv-SE.module.js.map +0 -1
  191. package/dist/tr-TR.main.js +0 -7
  192. package/dist/tr-TR.main.js.map +0 -1
  193. package/dist/tr-TR.mjs +0 -9
  194. package/dist/tr-TR.module.js +0 -9
  195. package/dist/tr-TR.module.js.map +0 -1
  196. package/dist/types.d.ts +0 -14
  197. package/dist/types.d.ts.map +0 -1
  198. package/dist/uk-UA.main.js +0 -7
  199. package/dist/uk-UA.main.js.map +0 -1
  200. package/dist/uk-UA.mjs +0 -9
  201. package/dist/uk-UA.module.js +0 -9
  202. package/dist/uk-UA.module.js.map +0 -1
  203. package/dist/zh-CN.main.js +0 -7
  204. package/dist/zh-CN.main.js.map +0 -1
  205. package/dist/zh-CN.mjs +0 -9
  206. package/dist/zh-CN.module.js +0 -9
  207. package/dist/zh-CN.module.js.map +0 -1
  208. package/dist/zh-TW.main.js +0 -7
  209. package/dist/zh-TW.main.js.map +0 -1
  210. package/dist/zh-TW.mjs +0 -9
  211. package/dist/zh-TW.module.js +0 -9
  212. package/dist/zh-TW.module.js.map +0 -1
  213. package/src/RangeSlider.tsx +0 -95
  214. package/src/Slider.tsx +0 -119
  215. package/src/SliderBase.tsx +0 -195
  216. package/src/SliderThumb.tsx +0 -68
@@ -1,121 +0,0 @@
1
- var $ec6ca573d82152ff$exports = require("./SliderBase.main.js");
2
- var $77acc7fb8bfd13d6$exports = require("./SliderThumb.main.js");
3
- require("./slider.674e7af0.css");
4
- var $57893a49ef34c169$exports = require("./slider_vars_css.main.js");
5
- var $h9MRe$reactariautils = require("@react-aria/utils");
6
- var $h9MRe$reactspectrumutils = require("@react-spectrum/utils");
7
- var $h9MRe$react = require("react");
8
- var $h9MRe$reactariai18n = require("@react-aria/i18n");
9
-
10
-
11
- function $parcel$interopDefault(a) {
12
- return a && a.__esModule ? a.default : a;
13
- }
14
-
15
- function $parcel$export(e, n, v, s) {
16
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
17
- }
18
-
19
- $parcel$export(module.exports, "Slider", () => $3a761bdd22d32681$export$472062a354075cee);
20
- /*
21
- * Copyright 2020 Adobe. All rights reserved.
22
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
23
- * you may not use this file except in compliance with the License. You may obtain a copy
24
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
25
- *
26
- * Unless required by applicable law or agreed to in writing, software distributed under
27
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
28
- * OF ANY KIND, either express or implied. See the License for the specific language
29
- * governing permissions and limitations under the License.
30
- */
31
-
32
-
33
-
34
-
35
-
36
-
37
- const $3a761bdd22d32681$export$472062a354075cee = /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).forwardRef(function Slider(props, ref) {
38
- let { onChange: onChange, onChangeEnd: onChangeEnd, value: value, defaultValue: defaultValue, isFilled: isFilled, fillOffset: fillOffset, trackGradient: trackGradient, getValueLabel: getValueLabel, ...otherProps } = props;
39
- let baseProps = {
40
- ...otherProps,
41
- // Normalize `value: number[]` to `value: number`
42
- value: value != null ? [
43
- value
44
- ] : undefined,
45
- defaultValue: defaultValue != null ? [
46
- defaultValue
47
- ] : undefined,
48
- onChange: (v)=>{
49
- onChange === null || onChange === void 0 ? void 0 : onChange(v[0]);
50
- },
51
- onChangeEnd: (v)=>{
52
- onChangeEnd === null || onChangeEnd === void 0 ? void 0 : onChangeEnd(v[0]);
53
- },
54
- getValueLabel: getValueLabel ? ([v])=>getValueLabel(v) : undefined
55
- };
56
- let { direction: direction } = (0, $h9MRe$reactariai18n.useLocale)();
57
- return /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).createElement((0, $ec6ca573d82152ff$exports.SliderBase), {
58
- ...baseProps,
59
- ref: ref,
60
- classes: {
61
- 'spectrum-Slider--filled': isFilled && fillOffset == null
62
- },
63
- style: // @ts-ignore
64
- {
65
- '--spectrum-slider-track-gradient': trackGradient && `linear-gradient(to ${direction === 'ltr' ? 'right' : 'left'}, ${trackGradient.join(', ')})`
66
- }
67
- }, ({ trackRef: trackRef, inputRef: inputRef, state: state })=>{
68
- fillOffset = fillOffset != null ? (0, $h9MRe$reactariautils.clamp)(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : fillOffset;
69
- let cssDirection = direction === 'rtl' ? 'right' : 'left';
70
- let lowerTrack = /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).createElement("div", {
71
- className: (0, $h9MRe$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-track'),
72
- style: {
73
- width: `${state.getThumbPercent(0) * 100}%`,
74
- // TODO not sure if it has advantages, but this could also be implemented as CSS calc():
75
- // .track::before {
76
- // background-size: calc((1/ (var(--width)/100)) * 100%);
77
- // width: calc(var(--width) * 1%)M
78
- // }
79
- // @ts-ignore
80
- '--spectrum-track-background-size': `${1 / state.getThumbPercent(0) * 100}%`,
81
- '--spectrum-track-background-position': direction === 'ltr' ? '0' : '100%'
82
- }
83
- });
84
- let upperTrack = /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).createElement("div", {
85
- className: (0, $h9MRe$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-track'),
86
- style: {
87
- width: `${(1 - state.getThumbPercent(0)) * 100}%`,
88
- // @ts-ignore
89
- '--spectrum-track-background-size': `${1 / (1 - state.getThumbPercent(0)) * 100}%`,
90
- '--spectrum-track-background-position': direction === 'ltr' ? '100%' : '0'
91
- }
92
- });
93
- let filledTrack = null;
94
- if (isFilled && fillOffset != null) {
95
- let width = state.getThumbPercent(0) - state.getValuePercent(fillOffset);
96
- let isRightOfOffset = width > 0;
97
- let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);
98
- filledTrack = /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).createElement("div", {
99
- className: (0, $h9MRe$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-fill', {
100
- 'spectrum-Slider-fill--right': isRightOfOffset
101
- }),
102
- style: {
103
- [cssDirection]: `${offset * 100}%`,
104
- width: `${Math.abs(width) * 100}%`
105
- }
106
- });
107
- }
108
- return /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).createElement((0, ($parcel$interopDefault($h9MRe$react))).Fragment, null, lowerTrack, /*#__PURE__*/ (0, ($parcel$interopDefault($h9MRe$react))).createElement((0, $77acc7fb8bfd13d6$exports.SliderThumb), {
109
- index: 0,
110
- isDisabled: props.isDisabled,
111
- trackRef: trackRef,
112
- inputRef: inputRef,
113
- state: state,
114
- name: props.name,
115
- form: props.form
116
- }), filledTrack, upperTrack);
117
- });
118
- });
119
-
120
-
121
- //# sourceMappingURL=Slider.main.js.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/slider/src/Slider.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 {clamp} from '@react-aria/utils';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport React, {ReactNode} from 'react';\nimport {SliderBase, SliderBaseChildArguments, SliderBaseProps} from './SliderBase';\nimport {SliderThumb} from './SliderThumb';\nimport {SpectrumSliderProps} from '@react-types/slider';\nimport styles from '@adobe/spectrum-css-temp/components/slider/vars.css';\nimport {useLocale} from '@react-aria/i18n';\n\n/**\n * Sliders allow users to quickly select a value within a range. They should be used when the upper and lower bounds to the range are invariable.\n */\nexport const Slider = React.forwardRef(function Slider(props: SpectrumSliderProps, ref: FocusableRef<HTMLDivElement>) {\n let {onChange, onChangeEnd, value, defaultValue, isFilled, fillOffset, trackGradient, getValueLabel, ...otherProps} = props;\n\n let baseProps: Omit<SliderBaseProps, 'children'> = {\n ...otherProps,\n // Normalize `value: number[]` to `value: number`\n value: value != null ? [value] : undefined,\n defaultValue: defaultValue != null ? [defaultValue] : undefined,\n onChange: (v: number[]): void => {\n onChange?.(v[0]);\n },\n onChangeEnd: (v: number[]): void => {\n onChangeEnd?.(v[0]);\n },\n getValueLabel: getValueLabel ? ([v]) => getValueLabel(v) : undefined\n };\n\n let {direction} = useLocale();\n\n return (\n <SliderBase\n {...baseProps}\n ref={ref}\n classes={{\n 'spectrum-Slider--filled': isFilled && fillOffset == null\n }}\n style={\n // @ts-ignore\n {'--spectrum-slider-track-gradient': trackGradient && `linear-gradient(to ${direction === 'ltr' ? 'right' : 'left'}, ${trackGradient.join(', ')})`}\n }>\n {({trackRef, inputRef, state}: SliderBaseChildArguments) => {\n fillOffset = fillOffset != null ? clamp(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : fillOffset;\n let cssDirection = direction === 'rtl' ? 'right' : 'left';\n\n let lowerTrack = (\n <div\n className={classNames(styles, 'spectrum-Slider-track')}\n style={{\n width: `${state.getThumbPercent(0) * 100}%`,\n // TODO not sure if it has advantages, but this could also be implemented as CSS calc():\n // .track::before {\n // background-size: calc((1/ (var(--width)/100)) * 100%);\n // width: calc(var(--width) * 1%)M\n // }\n // @ts-ignore\n '--spectrum-track-background-size': `${(1 / state.getThumbPercent(0)) * 100}%`,\n '--spectrum-track-background-position': direction === 'ltr' ? '0' : '100%'\n }} />\n );\n let upperTrack = (\n <div\n className={classNames(styles, 'spectrum-Slider-track')}\n style={{\n width: `${(1 - state.getThumbPercent(0)) * 100}%`,\n // @ts-ignore\n '--spectrum-track-background-size': `${(1 / (1 - state.getThumbPercent(0))) * 100}%`,\n '--spectrum-track-background-position': direction === 'ltr' ? '100%' : '0'\n }} />\n );\n\n let filledTrack: ReactNode = null;\n if (isFilled && fillOffset != null) {\n let width = state.getThumbPercent(0) - state.getValuePercent(fillOffset);\n let isRightOfOffset = width > 0;\n let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);\n filledTrack = (\n <div\n className={classNames(styles, 'spectrum-Slider-fill', {'spectrum-Slider-fill--right': isRightOfOffset})}\n style={{\n [cssDirection]: `${offset * 100}%`,\n width: `${Math.abs(width) * 100}%`\n }} />\n );\n }\n\n return (\n <>\n {lowerTrack}\n <SliderThumb\n index={0}\n isDisabled={props.isDisabled}\n trackRef={trackRef}\n inputRef={inputRef}\n state={state}\n name={props.name}\n form={props.form} />\n {filledTrack}\n {upperTrack}\n </>\n );\n }}\n </SliderBase>\n );\n});\n"],"names":[],"version":3,"file":"Slider.main.js.map"}
package/dist/Slider.mjs DELETED
@@ -1,116 +0,0 @@
1
- import {SliderBase as $39572711324a3b8e$export$9418495bb635ebde} from "./SliderBase.mjs";
2
- import {SliderThumb as $9058ca69d66a724f$export$2c1b491743890dec} from "./SliderThumb.mjs";
3
- import "./slider.674e7af0.css";
4
- import $i1AIe$slider_vars_cssmodulejs from "./slider_vars_css.mjs";
5
- import {clamp as $i1AIe$clamp} from "@react-aria/utils";
6
- import {classNames as $i1AIe$classNames} from "@react-spectrum/utils";
7
- import $i1AIe$react from "react";
8
- import {useLocale as $i1AIe$useLocale} from "@react-aria/i18n";
9
-
10
-
11
- function $parcel$interopDefault(a) {
12
- return a && a.__esModule ? a.default : a;
13
- }
14
- /*
15
- * Copyright 2020 Adobe. All rights reserved.
16
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
17
- * you may not use this file except in compliance with the License. You may obtain a copy
18
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
19
- *
20
- * Unless required by applicable law or agreed to in writing, software distributed under
21
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
22
- * OF ANY KIND, either express or implied. See the License for the specific language
23
- * governing permissions and limitations under the License.
24
- */
25
-
26
-
27
-
28
-
29
-
30
-
31
- const $a1251704aa53e1a5$export$472062a354075cee = /*#__PURE__*/ (0, $i1AIe$react).forwardRef(function Slider(props, ref) {
32
- let { onChange: onChange, onChangeEnd: onChangeEnd, value: value, defaultValue: defaultValue, isFilled: isFilled, fillOffset: fillOffset, trackGradient: trackGradient, getValueLabel: getValueLabel, ...otherProps } = props;
33
- let baseProps = {
34
- ...otherProps,
35
- // Normalize `value: number[]` to `value: number`
36
- value: value != null ? [
37
- value
38
- ] : undefined,
39
- defaultValue: defaultValue != null ? [
40
- defaultValue
41
- ] : undefined,
42
- onChange: (v)=>{
43
- onChange === null || onChange === void 0 ? void 0 : onChange(v[0]);
44
- },
45
- onChangeEnd: (v)=>{
46
- onChangeEnd === null || onChangeEnd === void 0 ? void 0 : onChangeEnd(v[0]);
47
- },
48
- getValueLabel: getValueLabel ? ([v])=>getValueLabel(v) : undefined
49
- };
50
- let { direction: direction } = (0, $i1AIe$useLocale)();
51
- return /*#__PURE__*/ (0, $i1AIe$react).createElement((0, $39572711324a3b8e$export$9418495bb635ebde), {
52
- ...baseProps,
53
- ref: ref,
54
- classes: {
55
- 'spectrum-Slider--filled': isFilled && fillOffset == null
56
- },
57
- style: // @ts-ignore
58
- {
59
- '--spectrum-slider-track-gradient': trackGradient && `linear-gradient(to ${direction === 'ltr' ? 'right' : 'left'}, ${trackGradient.join(', ')})`
60
- }
61
- }, ({ trackRef: trackRef, inputRef: inputRef, state: state })=>{
62
- fillOffset = fillOffset != null ? (0, $i1AIe$clamp)(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : fillOffset;
63
- let cssDirection = direction === 'rtl' ? 'right' : 'left';
64
- let lowerTrack = /*#__PURE__*/ (0, $i1AIe$react).createElement("div", {
65
- className: (0, $i1AIe$classNames)((0, ($parcel$interopDefault($i1AIe$slider_vars_cssmodulejs))), 'spectrum-Slider-track'),
66
- style: {
67
- width: `${state.getThumbPercent(0) * 100}%`,
68
- // TODO not sure if it has advantages, but this could also be implemented as CSS calc():
69
- // .track::before {
70
- // background-size: calc((1/ (var(--width)/100)) * 100%);
71
- // width: calc(var(--width) * 1%)M
72
- // }
73
- // @ts-ignore
74
- '--spectrum-track-background-size': `${1 / state.getThumbPercent(0) * 100}%`,
75
- '--spectrum-track-background-position': direction === 'ltr' ? '0' : '100%'
76
- }
77
- });
78
- let upperTrack = /*#__PURE__*/ (0, $i1AIe$react).createElement("div", {
79
- className: (0, $i1AIe$classNames)((0, ($parcel$interopDefault($i1AIe$slider_vars_cssmodulejs))), 'spectrum-Slider-track'),
80
- style: {
81
- width: `${(1 - state.getThumbPercent(0)) * 100}%`,
82
- // @ts-ignore
83
- '--spectrum-track-background-size': `${1 / (1 - state.getThumbPercent(0)) * 100}%`,
84
- '--spectrum-track-background-position': direction === 'ltr' ? '100%' : '0'
85
- }
86
- });
87
- let filledTrack = null;
88
- if (isFilled && fillOffset != null) {
89
- let width = state.getThumbPercent(0) - state.getValuePercent(fillOffset);
90
- let isRightOfOffset = width > 0;
91
- let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);
92
- filledTrack = /*#__PURE__*/ (0, $i1AIe$react).createElement("div", {
93
- className: (0, $i1AIe$classNames)((0, ($parcel$interopDefault($i1AIe$slider_vars_cssmodulejs))), 'spectrum-Slider-fill', {
94
- 'spectrum-Slider-fill--right': isRightOfOffset
95
- }),
96
- style: {
97
- [cssDirection]: `${offset * 100}%`,
98
- width: `${Math.abs(width) * 100}%`
99
- }
100
- });
101
- }
102
- return /*#__PURE__*/ (0, $i1AIe$react).createElement((0, $i1AIe$react).Fragment, null, lowerTrack, /*#__PURE__*/ (0, $i1AIe$react).createElement((0, $9058ca69d66a724f$export$2c1b491743890dec), {
103
- index: 0,
104
- isDisabled: props.isDisabled,
105
- trackRef: trackRef,
106
- inputRef: inputRef,
107
- state: state,
108
- name: props.name,
109
- form: props.form
110
- }), filledTrack, upperTrack);
111
- });
112
- });
113
-
114
-
115
- export {$a1251704aa53e1a5$export$472062a354075cee as Slider};
116
- //# sourceMappingURL=Slider.module.js.map
@@ -1,116 +0,0 @@
1
- import {SliderBase as $39572711324a3b8e$export$9418495bb635ebde} from "./SliderBase.module.js";
2
- import {SliderThumb as $9058ca69d66a724f$export$2c1b491743890dec} from "./SliderThumb.module.js";
3
- import "./slider.674e7af0.css";
4
- import $i1AIe$slider_vars_cssmodulejs from "./slider_vars_css.module.js";
5
- import {clamp as $i1AIe$clamp} from "@react-aria/utils";
6
- import {classNames as $i1AIe$classNames} from "@react-spectrum/utils";
7
- import $i1AIe$react from "react";
8
- import {useLocale as $i1AIe$useLocale} from "@react-aria/i18n";
9
-
10
-
11
- function $parcel$interopDefault(a) {
12
- return a && a.__esModule ? a.default : a;
13
- }
14
- /*
15
- * Copyright 2020 Adobe. All rights reserved.
16
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
17
- * you may not use this file except in compliance with the License. You may obtain a copy
18
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
19
- *
20
- * Unless required by applicable law or agreed to in writing, software distributed under
21
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
22
- * OF ANY KIND, either express or implied. See the License for the specific language
23
- * governing permissions and limitations under the License.
24
- */
25
-
26
-
27
-
28
-
29
-
30
-
31
- const $a1251704aa53e1a5$export$472062a354075cee = /*#__PURE__*/ (0, $i1AIe$react).forwardRef(function Slider(props, ref) {
32
- let { onChange: onChange, onChangeEnd: onChangeEnd, value: value, defaultValue: defaultValue, isFilled: isFilled, fillOffset: fillOffset, trackGradient: trackGradient, getValueLabel: getValueLabel, ...otherProps } = props;
33
- let baseProps = {
34
- ...otherProps,
35
- // Normalize `value: number[]` to `value: number`
36
- value: value != null ? [
37
- value
38
- ] : undefined,
39
- defaultValue: defaultValue != null ? [
40
- defaultValue
41
- ] : undefined,
42
- onChange: (v)=>{
43
- onChange === null || onChange === void 0 ? void 0 : onChange(v[0]);
44
- },
45
- onChangeEnd: (v)=>{
46
- onChangeEnd === null || onChangeEnd === void 0 ? void 0 : onChangeEnd(v[0]);
47
- },
48
- getValueLabel: getValueLabel ? ([v])=>getValueLabel(v) : undefined
49
- };
50
- let { direction: direction } = (0, $i1AIe$useLocale)();
51
- return /*#__PURE__*/ (0, $i1AIe$react).createElement((0, $39572711324a3b8e$export$9418495bb635ebde), {
52
- ...baseProps,
53
- ref: ref,
54
- classes: {
55
- 'spectrum-Slider--filled': isFilled && fillOffset == null
56
- },
57
- style: // @ts-ignore
58
- {
59
- '--spectrum-slider-track-gradient': trackGradient && `linear-gradient(to ${direction === 'ltr' ? 'right' : 'left'}, ${trackGradient.join(', ')})`
60
- }
61
- }, ({ trackRef: trackRef, inputRef: inputRef, state: state })=>{
62
- fillOffset = fillOffset != null ? (0, $i1AIe$clamp)(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : fillOffset;
63
- let cssDirection = direction === 'rtl' ? 'right' : 'left';
64
- let lowerTrack = /*#__PURE__*/ (0, $i1AIe$react).createElement("div", {
65
- className: (0, $i1AIe$classNames)((0, ($parcel$interopDefault($i1AIe$slider_vars_cssmodulejs))), 'spectrum-Slider-track'),
66
- style: {
67
- width: `${state.getThumbPercent(0) * 100}%`,
68
- // TODO not sure if it has advantages, but this could also be implemented as CSS calc():
69
- // .track::before {
70
- // background-size: calc((1/ (var(--width)/100)) * 100%);
71
- // width: calc(var(--width) * 1%)M
72
- // }
73
- // @ts-ignore
74
- '--spectrum-track-background-size': `${1 / state.getThumbPercent(0) * 100}%`,
75
- '--spectrum-track-background-position': direction === 'ltr' ? '0' : '100%'
76
- }
77
- });
78
- let upperTrack = /*#__PURE__*/ (0, $i1AIe$react).createElement("div", {
79
- className: (0, $i1AIe$classNames)((0, ($parcel$interopDefault($i1AIe$slider_vars_cssmodulejs))), 'spectrum-Slider-track'),
80
- style: {
81
- width: `${(1 - state.getThumbPercent(0)) * 100}%`,
82
- // @ts-ignore
83
- '--spectrum-track-background-size': `${1 / (1 - state.getThumbPercent(0)) * 100}%`,
84
- '--spectrum-track-background-position': direction === 'ltr' ? '100%' : '0'
85
- }
86
- });
87
- let filledTrack = null;
88
- if (isFilled && fillOffset != null) {
89
- let width = state.getThumbPercent(0) - state.getValuePercent(fillOffset);
90
- let isRightOfOffset = width > 0;
91
- let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);
92
- filledTrack = /*#__PURE__*/ (0, $i1AIe$react).createElement("div", {
93
- className: (0, $i1AIe$classNames)((0, ($parcel$interopDefault($i1AIe$slider_vars_cssmodulejs))), 'spectrum-Slider-fill', {
94
- 'spectrum-Slider-fill--right': isRightOfOffset
95
- }),
96
- style: {
97
- [cssDirection]: `${offset * 100}%`,
98
- width: `${Math.abs(width) * 100}%`
99
- }
100
- });
101
- }
102
- return /*#__PURE__*/ (0, $i1AIe$react).createElement((0, $i1AIe$react).Fragment, null, lowerTrack, /*#__PURE__*/ (0, $i1AIe$react).createElement((0, $9058ca69d66a724f$export$2c1b491743890dec), {
103
- index: 0,
104
- isDisabled: props.isDisabled,
105
- trackRef: trackRef,
106
- inputRef: inputRef,
107
- state: state,
108
- name: props.name,
109
- form: props.form
110
- }), filledTrack, upperTrack);
111
- });
112
- });
113
-
114
-
115
- export {$a1251704aa53e1a5$export$472062a354075cee as Slider};
116
- //# sourceMappingURL=Slider.module.js.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/slider/src/Slider.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 {clamp} from '@react-aria/utils';\nimport {classNames} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport React, {ReactNode} from 'react';\nimport {SliderBase, SliderBaseChildArguments, SliderBaseProps} from './SliderBase';\nimport {SliderThumb} from './SliderThumb';\nimport {SpectrumSliderProps} from '@react-types/slider';\nimport styles from '@adobe/spectrum-css-temp/components/slider/vars.css';\nimport {useLocale} from '@react-aria/i18n';\n\n/**\n * Sliders allow users to quickly select a value within a range. They should be used when the upper and lower bounds to the range are invariable.\n */\nexport const Slider = React.forwardRef(function Slider(props: SpectrumSliderProps, ref: FocusableRef<HTMLDivElement>) {\n let {onChange, onChangeEnd, value, defaultValue, isFilled, fillOffset, trackGradient, getValueLabel, ...otherProps} = props;\n\n let baseProps: Omit<SliderBaseProps, 'children'> = {\n ...otherProps,\n // Normalize `value: number[]` to `value: number`\n value: value != null ? [value] : undefined,\n defaultValue: defaultValue != null ? [defaultValue] : undefined,\n onChange: (v: number[]): void => {\n onChange?.(v[0]);\n },\n onChangeEnd: (v: number[]): void => {\n onChangeEnd?.(v[0]);\n },\n getValueLabel: getValueLabel ? ([v]) => getValueLabel(v) : undefined\n };\n\n let {direction} = useLocale();\n\n return (\n <SliderBase\n {...baseProps}\n ref={ref}\n classes={{\n 'spectrum-Slider--filled': isFilled && fillOffset == null\n }}\n style={\n // @ts-ignore\n {'--spectrum-slider-track-gradient': trackGradient && `linear-gradient(to ${direction === 'ltr' ? 'right' : 'left'}, ${trackGradient.join(', ')})`}\n }>\n {({trackRef, inputRef, state}: SliderBaseChildArguments) => {\n fillOffset = fillOffset != null ? clamp(fillOffset, state.getThumbMinValue(0), state.getThumbMaxValue(0)) : fillOffset;\n let cssDirection = direction === 'rtl' ? 'right' : 'left';\n\n let lowerTrack = (\n <div\n className={classNames(styles, 'spectrum-Slider-track')}\n style={{\n width: `${state.getThumbPercent(0) * 100}%`,\n // TODO not sure if it has advantages, but this could also be implemented as CSS calc():\n // .track::before {\n // background-size: calc((1/ (var(--width)/100)) * 100%);\n // width: calc(var(--width) * 1%)M\n // }\n // @ts-ignore\n '--spectrum-track-background-size': `${(1 / state.getThumbPercent(0)) * 100}%`,\n '--spectrum-track-background-position': direction === 'ltr' ? '0' : '100%'\n }} />\n );\n let upperTrack = (\n <div\n className={classNames(styles, 'spectrum-Slider-track')}\n style={{\n width: `${(1 - state.getThumbPercent(0)) * 100}%`,\n // @ts-ignore\n '--spectrum-track-background-size': `${(1 / (1 - state.getThumbPercent(0))) * 100}%`,\n '--spectrum-track-background-position': direction === 'ltr' ? '100%' : '0'\n }} />\n );\n\n let filledTrack: ReactNode = null;\n if (isFilled && fillOffset != null) {\n let width = state.getThumbPercent(0) - state.getValuePercent(fillOffset);\n let isRightOfOffset = width > 0;\n let offset = isRightOfOffset ? state.getValuePercent(fillOffset) : state.getThumbPercent(0);\n filledTrack = (\n <div\n className={classNames(styles, 'spectrum-Slider-fill', {'spectrum-Slider-fill--right': isRightOfOffset})}\n style={{\n [cssDirection]: `${offset * 100}%`,\n width: `${Math.abs(width) * 100}%`\n }} />\n );\n }\n\n return (\n <>\n {lowerTrack}\n <SliderThumb\n index={0}\n isDisabled={props.isDisabled}\n trackRef={trackRef}\n inputRef={inputRef}\n state={state}\n name={props.name}\n form={props.form} />\n {filledTrack}\n {upperTrack}\n </>\n );\n }}\n </SliderBase>\n );\n});\n"],"names":[],"version":3,"file":"Slider.module.js.map"}
@@ -1,169 +0,0 @@
1
- require("./slider.674e7af0.css");
2
- var $57893a49ef34c169$exports = require("./slider_vars_css.main.js");
3
- var $2j89m$reactspectrumutils = require("@react-spectrum/utils");
4
- var $2j89m$react = require("react");
5
- var $2j89m$reactstatelyslider = require("@react-stately/slider");
6
- var $2j89m$reactariai18n = require("@react-aria/i18n");
7
- var $2j89m$reactspectrumprovider = require("@react-spectrum/provider");
8
- var $2j89m$reactariaslider = require("@react-aria/slider");
9
-
10
-
11
- function $parcel$interopDefault(a) {
12
- return a && a.__esModule ? a.default : a;
13
- }
14
-
15
- function $parcel$export(e, n, v, s) {
16
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
17
- }
18
-
19
- $parcel$export(module.exports, "SliderBase", () => $ec6ca573d82152ff$export$9418495bb635ebde);
20
- /*
21
- * Copyright 2020 Adobe. All rights reserved.
22
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
23
- * you may not use this file except in compliance with the License. You may obtain a copy
24
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
25
- *
26
- * Unless required by applicable law or agreed to in writing, software distributed under
27
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
28
- * OF ANY KIND, either express or implied. See the License for the specific language
29
- * governing permissions and limitations under the License.
30
- */
31
-
32
-
33
-
34
-
35
-
36
-
37
- const $ec6ca573d82152ff$export$9418495bb635ebde = /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).forwardRef(function SliderBase(props, ref) {
38
- props = (0, $2j89m$reactspectrumprovider.useProviderProps)(props);
39
- let { isDisabled: isDisabled, children: children, classes: classes, style: style, labelPosition: labelPosition = 'top', getValueLabel: getValueLabel, showValueLabel: showValueLabel = !!props.label, formatOptions: formatOptions, minValue: minValue = 0, maxValue: maxValue = 100, ...otherProps } = props;
40
- let { styleProps: styleProps } = (0, $2j89m$reactspectrumutils.useStyleProps)(otherProps);
41
- // `Math.abs(Math.sign(a) - Math.sign(b)) === 2` is true if the values have a different sign.
42
- let alwaysDisplaySign = Math.abs(Math.sign(minValue) - Math.sign(maxValue)) === 2;
43
- if (alwaysDisplaySign) {
44
- if (formatOptions != null) {
45
- if (!('signDisplay' in formatOptions)) formatOptions = {
46
- ...formatOptions,
47
- signDisplay: 'exceptZero'
48
- };
49
- } else formatOptions = {
50
- signDisplay: 'exceptZero'
51
- };
52
- }
53
- const formatter = (0, $2j89m$reactariai18n.useNumberFormatter)(formatOptions);
54
- const state = (0, $2j89m$reactstatelyslider.useSliderState)({
55
- ...props,
56
- numberFormatter: formatter,
57
- minValue: minValue,
58
- maxValue: maxValue
59
- });
60
- let trackRef = (0, $2j89m$react.useRef)(null);
61
- let { groupProps: groupProps, trackProps: trackProps, labelProps: labelProps, outputProps: outputProps } = (0, $2j89m$reactariaslider.useSlider)(props, state, trackRef);
62
- let inputRef = (0, $2j89m$react.useRef)(null);
63
- let domRef = (0, $2j89m$reactspectrumutils.useFocusableRef)(ref, inputRef);
64
- let displayValue = '';
65
- let maxLabelLength = null;
66
- if (typeof getValueLabel === 'function') {
67
- displayValue = getValueLabel(state.values);
68
- switch(state.values.length){
69
- case 1:
70
- maxLabelLength = Math.max(getValueLabel([
71
- minValue
72
- ]).length, getValueLabel([
73
- maxValue
74
- ]).length);
75
- break;
76
- case 2:
77
- // Try all possible combinations of min and max values.
78
- maxLabelLength = Math.max(getValueLabel([
79
- minValue,
80
- minValue
81
- ]).length, getValueLabel([
82
- minValue,
83
- maxValue
84
- ]).length, getValueLabel([
85
- maxValue,
86
- minValue
87
- ]).length, getValueLabel([
88
- maxValue,
89
- maxValue
90
- ]).length);
91
- break;
92
- default:
93
- throw new Error('Only sliders with 1 or 2 handles are supported!');
94
- }
95
- } else {
96
- maxLabelLength = Math.max([
97
- ...formatter.format(minValue)
98
- ].length, [
99
- ...formatter.format(maxValue)
100
- ].length);
101
- switch(state.values.length){
102
- case 1:
103
- displayValue = state.getThumbValueLabel(0);
104
- break;
105
- case 2:
106
- // This should really use the NumberFormat#formatRange proposal...
107
- // https://github.com/tc39/ecma402/issues/393
108
- // https://github.com/tc39/proposal-intl-numberformat-v3#formatrange-ecma-402-393
109
- displayValue = `${state.getThumbValueLabel(0)} \u{2013} ${state.getThumbValueLabel(1)}`;
110
- maxLabelLength = 3 + 2 * Math.max(maxLabelLength, [
111
- ...formatter.format(minValue)
112
- ].length, [
113
- ...formatter.format(maxValue)
114
- ].length);
115
- break;
116
- default:
117
- throw new Error('Only sliders with 1 or 2 handles are supported!');
118
- }
119
- }
120
- let labelNode = /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement("label", {
121
- className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-label'),
122
- ...labelProps
123
- }, props.label);
124
- let valueNode = /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement("output", {
125
- ...outputProps,
126
- className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-value'),
127
- style: maxLabelLength != null ? {
128
- width: `${maxLabelLength}ch`,
129
- minWidth: `${maxLabelLength}ch`
130
- } : undefined
131
- }, displayValue);
132
- return /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement("div", {
133
- ref: domRef,
134
- className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider', {
135
- 'spectrum-Slider--positionTop': labelPosition === 'top',
136
- 'spectrum-Slider--positionSide': labelPosition === 'side',
137
- 'is-disabled': isDisabled
138
- }, classes, styleProps.className),
139
- style: {
140
- ...style,
141
- ...styleProps.style
142
- },
143
- ...groupProps
144
- }, props.label && /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement("div", {
145
- className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-labelContainer'),
146
- role: "presentation"
147
- }, props.label && labelNode, props.contextualHelp && /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement((0, $2j89m$reactspectrumutils.SlotProvider), {
148
- slots: {
149
- actionButton: {
150
- UNSAFE_className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-contextualHelp')
151
- }
152
- }
153
- }, props.contextualHelp), labelPosition === 'top' && showValueLabel && valueNode), /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement("div", {
154
- className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-controls'),
155
- ref: trackRef,
156
- ...trackProps,
157
- role: "presentation"
158
- }, children({
159
- trackRef: trackRef,
160
- inputRef: inputRef,
161
- state: state
162
- })), labelPosition === 'side' && /*#__PURE__*/ (0, ($parcel$interopDefault($2j89m$react))).createElement("div", {
163
- className: (0, $2j89m$reactspectrumutils.classNames)((0, ($parcel$interopDefault($57893a49ef34c169$exports))), 'spectrum-Slider-valueLabelContainer'),
164
- role: "presentation"
165
- }, showValueLabel && valueNode));
166
- });
167
-
168
-
169
- //# sourceMappingURL=SliderBase.main.js.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/slider/src/SliderBase.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef, RefObject} from '@react-types/shared';\nimport React, {CSSProperties, ReactNode, useRef} from 'react';\nimport {SliderState, useSliderState} from '@react-stately/slider';\nimport {SpectrumBarSliderBase} from '@react-types/slider';\nimport styles from '@adobe/spectrum-css-temp/components/slider/vars.css';\nimport {useNumberFormatter} from '@react-aria/i18n';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useSlider} from '@react-aria/slider';\n\nexport interface SliderBaseChildArguments {\n inputRef: RefObject<HTMLInputElement | null>,\n trackRef: RefObject<HTMLElement | null>,\n state: SliderState\n}\n\nexport interface SliderBaseProps<T = number[]> extends SpectrumBarSliderBase<T> {\n children: (opts: SliderBaseChildArguments) => ReactNode,\n classes?: string[] | Object,\n style?: CSSProperties\n}\n\nexport const SliderBase = React.forwardRef(function SliderBase(props: SliderBaseProps, ref: FocusableRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n isDisabled,\n children,\n classes,\n style,\n labelPosition = 'top',\n getValueLabel,\n showValueLabel = !!props.label,\n formatOptions,\n minValue = 0,\n maxValue = 100,\n ...otherProps\n } = props;\n\n let {styleProps} = useStyleProps(otherProps);\n\n // `Math.abs(Math.sign(a) - Math.sign(b)) === 2` is true if the values have a different sign.\n let alwaysDisplaySign = Math.abs(Math.sign(minValue) - Math.sign(maxValue)) === 2;\n if (alwaysDisplaySign) {\n if (formatOptions != null) {\n if (!('signDisplay' in formatOptions)) {\n formatOptions = {\n ...formatOptions,\n signDisplay: 'exceptZero'\n };\n }\n } else {\n formatOptions = {signDisplay: 'exceptZero'};\n }\n }\n\n const formatter = useNumberFormatter(formatOptions);\n const state = useSliderState({\n ...props,\n numberFormatter: formatter,\n minValue,\n maxValue\n });\n let trackRef = useRef<HTMLDivElement | null>(null);\n let {\n groupProps,\n trackProps,\n labelProps,\n outputProps\n } = useSlider(props, state, trackRef);\n\n let inputRef = useRef<HTMLInputElement | null>(null);\n let domRef = useFocusableRef(ref, inputRef);\n\n let displayValue = '';\n let maxLabelLength: number | null = null;\n\n if (typeof getValueLabel === 'function') {\n displayValue = getValueLabel(state.values);\n switch (state.values.length) {\n case 1:\n maxLabelLength = Math.max(\n getValueLabel([minValue]).length,\n getValueLabel([maxValue]).length\n );\n break;\n case 2:\n // Try all possible combinations of min and max values.\n maxLabelLength = Math.max(\n getValueLabel([minValue, minValue]).length,\n getValueLabel([minValue, maxValue]).length,\n getValueLabel([maxValue, minValue]).length,\n getValueLabel([maxValue, maxValue]).length\n );\n break;\n default:\n throw new Error('Only sliders with 1 or 2 handles are supported!');\n }\n } else {\n maxLabelLength = Math.max([...formatter.format(minValue)].length, [...formatter.format(maxValue)].length);\n switch (state.values.length) {\n case 1:\n displayValue = state.getThumbValueLabel(0);\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 displayValue = `${state.getThumbValueLabel(0)} – ${state.getThumbValueLabel(1)}`;\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\n let labelNode = (\n <label\n className={classNames(styles, 'spectrum-Slider-label')}\n {...labelProps}>\n {props.label}\n </label>\n );\n\n let valueNode = (\n <output\n {...outputProps}\n className={classNames(styles, 'spectrum-Slider-value')}\n style={maxLabelLength != null ? {width: `${maxLabelLength}ch`, minWidth: `${maxLabelLength}ch`} : undefined}>\n {displayValue}\n </output>\n );\n\n return (\n <div\n ref={domRef}\n className={classNames(styles,\n 'spectrum-Slider',\n {\n 'spectrum-Slider--positionTop': labelPosition === 'top',\n 'spectrum-Slider--positionSide': labelPosition === 'side',\n 'is-disabled': isDisabled\n },\n classes,\n styleProps.className)}\n style={{\n ...style,\n ...styleProps.style\n }}\n {...groupProps}>\n {(props.label) &&\n <div className={classNames(styles, 'spectrum-Slider-labelContainer')} role=\"presentation\">\n {props.label && labelNode}\n {props.contextualHelp &&\n <SlotProvider\n slots={{\n actionButton: {\n UNSAFE_className: classNames(styles, 'spectrum-Slider-contextualHelp')\n }\n }}>\n {props.contextualHelp}\n </SlotProvider>\n }\n {labelPosition === 'top' && showValueLabel && valueNode}\n </div>\n }\n <div className={classNames(styles, 'spectrum-Slider-controls')} ref={trackRef} {...trackProps} role=\"presentation\">\n {children({\n trackRef,\n inputRef,\n state\n })}\n </div>\n {labelPosition === 'side' &&\n <div className={classNames(styles, 'spectrum-Slider-valueLabelContainer')} role=\"presentation\">\n {showValueLabel && valueNode}\n </div>\n }\n </div>\n );\n});\n"],"names":[],"version":3,"file":"SliderBase.main.js.map"}