@react-spectrum/s2 3.0.0-nightly-93c26d8bd-241028 → 3.0.0-nightly-07431f4b1-241030
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.
- package/dist/Accordion.cjs +1 -1
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +2 -2
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionButton.cjs +10 -32
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +20 -60
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +10 -32
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/Avatar.cjs +2 -4
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css +4 -16
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +2 -4
- package/dist/Avatar.mjs.map +1 -1
- package/dist/Badge.cjs +5 -16
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +10 -30
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +5 -16
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +12 -41
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +38 -86
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +12 -41
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +19 -59
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +37 -113
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +19 -59
- package/dist/Button.mjs.map +1 -1
- package/dist/Card.cjs +27 -67
- package/dist/Card.cjs.map +1 -1
- package/dist/Card.css +42 -117
- package/dist/Card.css.map +1 -1
- package/dist/Card.mjs +27 -67
- package/dist/Card.mjs.map +1 -1
- package/dist/Checkbox.cjs +9 -27
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +17 -49
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +9 -27
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +5 -16
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css +10 -30
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs +5 -16
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.cjs +6 -17
- package/dist/ClearButton.cjs.map +1 -1
- package/dist/ClearButton.css +11 -35
- package/dist/ClearButton.css.map +1 -1
- package/dist/ClearButton.mjs +6 -17
- package/dist/ClearButton.mjs.map +1 -1
- package/dist/CloseButton.cjs +10 -32
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +20 -64
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs +10 -32
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +4 -16
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css +8 -28
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs +4 -16
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs +5 -16
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css +10 -30
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs +5 -16
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorHandle.cjs +5 -15
- package/dist/ColorHandle.cjs.map +1 -1
- package/dist/ColorHandle.css +10 -30
- package/dist/ColorHandle.css.map +1 -1
- package/dist/ColorHandle.mjs +5 -15
- package/dist/ColorHandle.mjs.map +1 -1
- package/dist/ColorSlider.cjs +6 -17
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +34 -50
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +6 -17
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +8 -26
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +16 -52
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +8 -26
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +6 -16
- package/dist/ColorSwatchPicker.cjs.map +1 -1
- package/dist/ColorSwatchPicker.css +8 -28
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +6 -16
- package/dist/ColorSwatchPicker.mjs.map +1 -1
- package/dist/ComboBox.cjs +22 -71
- package/dist/ComboBox.cjs.map +1 -1
- package/dist/ComboBox.css +64 -152
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +22 -71
- package/dist/ComboBox.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +1 -1
- package/dist/ContextualHelp.css +2 -6
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +1 -1
- package/dist/Dialog.cjs +2 -2
- package/dist/Dialog.css +2 -2
- package/dist/Dialog.mjs +2 -2
- package/dist/Disclosure.cjs +34 -68
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +55 -91
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +36 -70
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/DropZone.cjs +2 -4
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +4 -16
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +2 -4
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +16 -47
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +31 -95
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +16 -47
- package/dist/Field.mjs.map +1 -1
- package/dist/IllustratedMessage.cjs +6 -20
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +10 -24
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +6 -20
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +2 -2
- package/dist/Image.css +2 -2
- package/dist/Image.mjs +2 -2
- package/dist/InlineAlert.cjs +2 -5
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css +11 -15
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +2 -5
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Menu.cjs +22 -67
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +32 -96
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +22 -67
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +22 -68
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +63 -139
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +22 -68
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +2 -2
- package/dist/Modal.css +2 -2
- package/dist/Modal.mjs +2 -2
- package/dist/NumberField.cjs +23 -71
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css +63 -146
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +23 -71
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +23 -67
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +50 -130
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +23 -67
- package/dist/Picker.mjs.map +1 -1
- package/dist/ProgressBar.cjs +23 -69
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +64 -140
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +23 -69
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +6 -20
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css +12 -40
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +6 -20
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Provider.css +7 -0
- package/dist/Provider.css.map +1 -1
- package/dist/Radio.cjs +8 -26
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +16 -48
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +8 -26
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +5 -16
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css +10 -30
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs +5 -16
- package/dist/RadioGroup.mjs.map +1 -1
- package/dist/SearchField.cjs +5 -16
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +10 -30
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +5 -16
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +8 -14
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +9 -29
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +8 -14
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +63 -196
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +61 -181
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +63 -196
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +9 -27
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +17 -49
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +9 -27
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +6 -15
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +10 -26
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +6 -15
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +42 -86
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +65 -129
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +42 -86
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +4 -15
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +18 -34
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +4 -15
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TagGroup.cjs +14 -37
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +23 -67
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +14 -37
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +11 -34
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +22 -66
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +11 -34
- package/dist/TextField.mjs.map +1 -1
- package/dist/Tooltip.cjs +2 -4
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +4 -12
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +2 -4
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +17 -17
- package/page.css +7 -0
- package/src/Accordion.tsx +1 -1
- package/src/Disclosure.tsx +13 -7
- package/src/page.macro.ts +11 -0
- package/style/dist/spectrum-theme.cjs +2 -8
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs +2 -8
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/types.d.ts +1 -4
- package/style/dist/types.d.ts.map +1 -1
- package/style/spectrum-theme.ts +4 -4
package/dist/Meter.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"ACyDgB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAII;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAKA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAaD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtBH;EAII;;;;EAAA;;;;;AAJJ;;
|
|
1
|
+
{"mappings":"ACyDgB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAII;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAKA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAaD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtBH;EAII;;;;EAAA;;;;;AAJJ;;AAII;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAKA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAaD;;;;;;AAbC;EAAA;IAAA;;;;;;AAaD","sources":["9248845643c61064","packages/@react-spectrum/s2/src/Meter.tsx"],"sourcesContent":["@import \"a82baabbcb8c2181\";\n@import \"387ba29f17cbbc9f\";\n@import \"ae93cf6195cc0b20\";\n@import \"c4a3f6bd0d23c6e6\";\n","/*\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 Meter as AriaMeter,\n MeterProps as AriaMeterProps,\n ContextValue\n} from 'react-aria-components';\nimport {bar, track} from './bar-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, LabelPosition} from '@react-types/shared';\nimport {FieldLabel} from './Field';\nimport {fieldLabel, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {size, style} from '../style' with {type: 'macro'};\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface MeterStyleProps {\n /** The [visual style](https://spectrum.adobe.com/page/meter/#-Options) of the Meter.\n * @default 'informative'\n */\n variant?: 'informative' | 'positive' | 'notice' | 'negative',\n /**\n * The size of the Meter.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** \n * The static color style to apply. Useful when the button appears over a color background. \n */\n staticColor?: 'white' | 'black',\n /**\n * The label's overall position relative to the element it is labeling.\n * @default 'top'\n */\n labelPosition?: LabelPosition\n}\n\nexport interface MeterProps extends Omit<AriaMeterProps, 'children' | 'className' | 'style'>, MeterStyleProps, StyleProps {\n /** The content to display as the label. */\n label?: ReactNode\n}\n\nexport const MeterContext = createContext<ContextValue<MeterProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst wrapper = style({\n ...bar()\n}, getAllowedOverrides());\n\nconst valueStyles = style({\n ...fieldLabel(),\n gridArea: 'value'\n});\n\nconst trackStyles = style({\n ...track(),\n height: {\n default: size(6),\n size: {\n S: 4, // progress-bar-thickness-small\n M: size(6), // progress-bar-thickness-medium\n L: 8, // progress-bar-thickness-large\n XL: size(10) // progress-bar-thickness-extra-large\n }\n }\n});\n\nconst fillStyles = style<MeterStyleProps>({\n height: 'full',\n borderStyle: 'none',\n borderRadius: 'full',\n backgroundColor: {\n default: 'informative',\n variant: {\n positive: 'positive',\n notice: 'notice',\n negative: 'negative'\n },\n staticColor: {\n white: {\n default: 'transparent-white-900'\n },\n // TODO: Is there a black static color in S2?\n black: {\n default: 'transparent-black-900'\n }\n },\n forcedColors: 'ButtonText'\n }\n});\n\nfunction Meter(props: MeterProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, MeterContext);\n let domRef = useDOMRef(ref);\n\n let {\n label,\n size = 'M',\n staticColor,\n styles,\n UNSAFE_className = '',\n UNSAFE_style,\n variant = 'informative',\n labelPosition = 'top',\n ...groupProps\n } = props;\n\n return (\n <AriaMeter\n {...groupProps}\n ref={domRef}\n style={UNSAFE_style}\n className={UNSAFE_className + wrapper({\n size,\n variant,\n staticColor,\n labelPosition\n }, styles)}>\n {({percentage, valueText}) => (\n <>\n {label && <FieldLabel size={size} labelAlign=\"start\" labelPosition={labelPosition} staticColor={staticColor}>{label}</FieldLabel>}\n {label && <Text styles={valueStyles({size, labelAlign: 'end', staticColor})}>{valueText}</Text>}\n <SkeletonWrapper>\n <div className={trackStyles({staticColor, size})}>\n <div className={fillStyles({staticColor, variant})} style={{width: percentage + '%'}} />\n </div>\n </SkeletonWrapper>\n </>\n )}\n </AriaMeter>\n );\n}\n\n/**\n * Meters are visual representations of a quantity or an achievement.\n * Their progress is determined by user actions, rather than system actions.\n */\nlet _Meter = forwardRef(Meter);\nexport {_Meter as Meter};\n"],"names":[],"version":3,"file":"Meter.css.map"}
|
package/dist/Meter.mjs
CHANGED
|
@@ -47,29 +47,14 @@ const $bb56943300b294c6$var$wrapper = function anonymous(props, overrides) {
|
|
|
47
47
|
else if (props.labelPosition === "top") rules += ' __j-6w8ip8';
|
|
48
48
|
rules += ' _1d';
|
|
49
49
|
rules += ' __Fa';
|
|
50
|
-
if (!$q)
|
|
51
|
-
rules += ' qby';
|
|
52
|
-
rules += ' qx';
|
|
53
|
-
}
|
|
50
|
+
if (!$q) rules += ' qn';
|
|
54
51
|
if (!$r) rules += ' r-3bwcc2';
|
|
55
|
-
if (props.size === "XL")
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
} else if (props.size === "S") {
|
|
62
|
-
rules += ' -aqrvqh_k-bn';
|
|
63
|
-
rules += ' -aqrvqh_k-m';
|
|
64
|
-
} else if (props.size === "XS") {
|
|
65
|
-
rules += ' -aqrvqh_k-bl';
|
|
66
|
-
rules += ' -aqrvqh_k-k';
|
|
67
|
-
} else {
|
|
68
|
-
rules += ' -aqrvqh_k-br';
|
|
69
|
-
rules += ' -aqrvqh_k-q';
|
|
70
|
-
}
|
|
71
|
-
rules += ' -_1urhtf5_k-be';
|
|
72
|
-
rules += ' -_1urhtf5_k-d';
|
|
52
|
+
if (props.size === "XL") rules += ' -aqrvqh_k-n';
|
|
53
|
+
else if (props.size === "L") rules += ' -aqrvqh_k-l';
|
|
54
|
+
else if (props.size === "S") rules += ' -aqrvqh_k-h';
|
|
55
|
+
else if (props.size === "XS") rules += ' -aqrvqh_k-g';
|
|
56
|
+
else rules += ' -aqrvqh_k-j';
|
|
57
|
+
rules += ' -_1urhtf5_k-c';
|
|
73
58
|
rules += ' -_1inj1bc_i--q18lfg';
|
|
74
59
|
rules += ' je';
|
|
75
60
|
return rules;
|
|
@@ -126,37 +111,17 @@ const $bb56943300b294c6$var$trackStyles = function anonymous(props) {
|
|
|
126
111
|
rules += ' __b-3773ju';
|
|
127
112
|
rules += ' __c-3773ju';
|
|
128
113
|
rules += ' __d-3773ju';
|
|
129
|
-
if (props.size === "XL")
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
rules += ' qr';
|
|
135
|
-
} else if (props.size === "S") {
|
|
136
|
-
rules += ' qbn';
|
|
137
|
-
rules += ' qm';
|
|
138
|
-
} else if (props.size === "XS") {
|
|
139
|
-
rules += ' qbl';
|
|
140
|
-
rules += ' qk';
|
|
141
|
-
} else {
|
|
142
|
-
rules += ' qbr';
|
|
143
|
-
rules += ' qq';
|
|
144
|
-
}
|
|
114
|
+
if (props.size === "XL") rules += ' qn';
|
|
115
|
+
else if (props.size === "L") rules += ' ql';
|
|
116
|
+
else if (props.size === "S") rules += ' qh';
|
|
117
|
+
else if (props.size === "XS") rules += ' qg';
|
|
118
|
+
else rules += ' qj';
|
|
145
119
|
if (props.isQuiet) rules += ' __ma';
|
|
146
120
|
else rules += ' __m-1s8glxue';
|
|
147
|
-
if (props.size === "XL")
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
rules += ' -usygro_l-bU';
|
|
152
|
-
rules += ' -usygro_l-T';
|
|
153
|
-
} else if (props.size === "S") {
|
|
154
|
-
rules += ' -usygro_l-bQ';
|
|
155
|
-
rules += ' -usygro_l-P';
|
|
156
|
-
} else {
|
|
157
|
-
rules += ' -usygro_l-bS';
|
|
158
|
-
rules += ' -usygro_l-R';
|
|
159
|
-
}
|
|
121
|
+
if (props.size === "XL") rules += ' -usygro_l-A';
|
|
122
|
+
else if (props.size === "L") rules += ' -usygro_l-z';
|
|
123
|
+
else if (props.size === "S") rules += ' -usygro_l-x';
|
|
124
|
+
else rules += ' -usygro_l-y';
|
|
160
125
|
rules += ' m-rwozxi';
|
|
161
126
|
rules += ' __vb';
|
|
162
127
|
rules += ' __wb';
|
|
@@ -175,27 +140,16 @@ const $bb56943300b294c6$var$trackStyles = function anonymous(props) {
|
|
|
175
140
|
rules += ' da_____x';
|
|
176
141
|
rules += ' da';
|
|
177
142
|
rules += ' __Q-3t1y';
|
|
178
|
-
if (props.size === "XL")
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
rules += ' kf';
|
|
184
|
-
} else if (props.size === "M") {
|
|
185
|
-
rules += ' kb-1aa9md1';
|
|
186
|
-
rules += ' k-6njx2e';
|
|
187
|
-
} else if (props.size === "S") {
|
|
188
|
-
rules += ' kbe';
|
|
189
|
-
rules += ' kd';
|
|
190
|
-
} else {
|
|
191
|
-
rules += ' kb-1aa9md1';
|
|
192
|
-
rules += ' k-6njx2e';
|
|
193
|
-
}
|
|
143
|
+
if (props.size === "XL") rules += ' k-tnkbk0';
|
|
144
|
+
else if (props.size === "L") rules += ' kd';
|
|
145
|
+
else if (props.size === "M") rules += ' k-ve8p9e';
|
|
146
|
+
else if (props.size === "S") rules += ' kc';
|
|
147
|
+
else rules += ' k-ve8p9e';
|
|
194
148
|
return rules;
|
|
195
149
|
};
|
|
196
150
|
const $bb56943300b294c6$var$fillStyles = function anonymous(props) {
|
|
197
151
|
let rules = " .";
|
|
198
|
-
rules += '
|
|
152
|
+
rules += ' kG';
|
|
199
153
|
rules += ' wf';
|
|
200
154
|
rules += ' _vf';
|
|
201
155
|
rules += ' _wf';
|
package/dist/Meter.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AA6CM,MAAM,0DAAe,CAAA,GAAA,oBAAY,EAAyD;AAEjG,MAAM
|
|
1
|
+
{"mappings":";;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;AA6CM,MAAM,0DAAe,CAAA,GAAA,oBAAY,EAAyD;AAEjG,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBN,SAAS,4BAAM,KAAiB,EAAE,GAA2B;IAC3D,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,IAAI,SACF,KAAK,QACL,OAAO,kBACP,WAAW,UACX,MAAM,oBACN,mBAAmB,kBACnB,YAAY,WACZ,UAAU,8BACV,gBAAgB,OAChB,GAAG,YACJ,GAAG;IAEJ,qBACE,gBAAC,CAAA,GAAA,YAAQ;QACN,GAAG,UAAU;QACd,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB,8BAAQ;kBACpC;qBACA;yBACA;2BACA;QACF,GAAG;kBACF,CAAC,cAAC,UAAU,aAAE,SAAS,EAAC,iBACvB;;oBACG,uBAAS,gBAAC,CAAA,GAAA,yCAAS;wBAAE,MAAM;wBAAM,YAAW;wBAAQ,eAAe;wBAAe,aAAa;kCAAc;;oBAC7G,uBAAS,gBAAC,CAAA,GAAA,yCAAG;wBAAE,QAAQ,kCAAY;kCAAC;4BAAM,YAAY;yCAAO;wBAAW;kCAAK;;kCAC9E,gBAAC,CAAA,GAAA,yCAAc;kCACb,cAAA,gBAAC;4BAAI,WAAW,kCAAY;6CAAC;sCAAa;4BAAI;sCAC5C,cAAA,gBAAC;gCAAI,WAAW,iCAAW;iDAAC;6CAAa;gCAAO;gCAAI,OAAO;oCAAC,OAAO,aAAa;gCAAG;;;;;;;AAOjG;AAEA;;;CAGC,GACD,IAAI,0DAAS,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/Meter.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 Meter as AriaMeter,\n MeterProps as AriaMeterProps,\n ContextValue\n} from 'react-aria-components';\nimport {bar, track} from './bar-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, LabelPosition} from '@react-types/shared';\nimport {FieldLabel} from './Field';\nimport {fieldLabel, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {size, style} from '../style' with {type: 'macro'};\nimport {SkeletonWrapper} from './Skeleton';\nimport {Text} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface MeterStyleProps {\n /** The [visual style](https://spectrum.adobe.com/page/meter/#-Options) of the Meter.\n * @default 'informative'\n */\n variant?: 'informative' | 'positive' | 'notice' | 'negative',\n /**\n * The size of the Meter.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** \n * The static color style to apply. Useful when the button appears over a color background. \n */\n staticColor?: 'white' | 'black',\n /**\n * The label's overall position relative to the element it is labeling.\n * @default 'top'\n */\n labelPosition?: LabelPosition\n}\n\nexport interface MeterProps extends Omit<AriaMeterProps, 'children' | 'className' | 'style'>, MeterStyleProps, StyleProps {\n /** The content to display as the label. */\n label?: ReactNode\n}\n\nexport const MeterContext = createContext<ContextValue<MeterProps, DOMRefValue<HTMLDivElement>>>(null);\n\nconst wrapper = style({\n ...bar()\n}, getAllowedOverrides());\n\nconst valueStyles = style({\n ...fieldLabel(),\n gridArea: 'value'\n});\n\nconst trackStyles = style({\n ...track(),\n height: {\n default: size(6),\n size: {\n S: 4, // progress-bar-thickness-small\n M: size(6), // progress-bar-thickness-medium\n L: 8, // progress-bar-thickness-large\n XL: size(10) // progress-bar-thickness-extra-large\n }\n }\n});\n\nconst fillStyles = style<MeterStyleProps>({\n height: 'full',\n borderStyle: 'none',\n borderRadius: 'full',\n backgroundColor: {\n default: 'informative',\n variant: {\n positive: 'positive',\n notice: 'notice',\n negative: 'negative'\n },\n staticColor: {\n white: {\n default: 'transparent-white-900'\n },\n // TODO: Is there a black static color in S2?\n black: {\n default: 'transparent-black-900'\n }\n },\n forcedColors: 'ButtonText'\n }\n});\n\nfunction Meter(props: MeterProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, MeterContext);\n let domRef = useDOMRef(ref);\n\n let {\n label,\n size = 'M',\n staticColor,\n styles,\n UNSAFE_className = '',\n UNSAFE_style,\n variant = 'informative',\n labelPosition = 'top',\n ...groupProps\n } = props;\n\n return (\n <AriaMeter\n {...groupProps}\n ref={domRef}\n style={UNSAFE_style}\n className={UNSAFE_className + wrapper({\n size,\n variant,\n staticColor,\n labelPosition\n }, styles)}>\n {({percentage, valueText}) => (\n <>\n {label && <FieldLabel size={size} labelAlign=\"start\" labelPosition={labelPosition} staticColor={staticColor}>{label}</FieldLabel>}\n {label && <Text styles={valueStyles({size, labelAlign: 'end', staticColor})}>{valueText}</Text>}\n <SkeletonWrapper>\n <div className={trackStyles({staticColor, size})}>\n <div className={fillStyles({staticColor, variant})} style={{width: percentage + '%'}} />\n </div>\n </SkeletonWrapper>\n </>\n )}\n </AriaMeter>\n );\n}\n\n/**\n * Meters are visual representations of a quantity or an achievement.\n * Their progress is determined by user actions, rather than system actions.\n */\nlet _Meter = forwardRef(Meter);\nexport {_Meter as Meter};\n"],"names":[],"version":3,"file":"Meter.mjs.map"}
|
package/dist/Modal.cjs
CHANGED
|
@@ -91,12 +91,12 @@ function $8e678305a8c10028$var$Modal(props1, ref) {
|
|
|
91
91
|
else rules += ' _xe';
|
|
92
92
|
if (props.size === "fullscreenTakeover") rules += ' _ya';
|
|
93
93
|
else rules += ' _ye';
|
|
94
|
-
if (props.size === "fullscreenTakeover") rules += '
|
|
94
|
+
if (props.size === "fullscreenTakeover") rules += ' lG';
|
|
95
95
|
else if (props.size === "fullscreen") rules += ' l-tp2nko';
|
|
96
96
|
else if (props.size === "L") rules += ' l-3940j6';
|
|
97
97
|
else if (props.size === "M") rules += ' l-38elgx';
|
|
98
98
|
else if (props.size === "S") rules += ' l-38aqto';
|
|
99
|
-
if (props.size === "fullscreenTakeover") rules += '
|
|
99
|
+
if (props.size === "fullscreenTakeover") rules += ' kG';
|
|
100
100
|
else if (props.size === "fullscreen") rules += ' k-tp2nko';
|
|
101
101
|
if (props.size === "L") rules += ' r-yjhhbv';
|
|
102
102
|
else if (props.size === "M") rules += ' r-yjhhbv';
|
package/dist/Modal.css
CHANGED
package/dist/Modal.mjs
CHANGED
|
@@ -85,12 +85,12 @@ function $c46d159bd615e407$var$Modal(props1, ref) {
|
|
|
85
85
|
else rules += ' _xe';
|
|
86
86
|
if (props.size === "fullscreenTakeover") rules += ' _ya';
|
|
87
87
|
else rules += ' _ye';
|
|
88
|
-
if (props.size === "fullscreenTakeover") rules += '
|
|
88
|
+
if (props.size === "fullscreenTakeover") rules += ' lG';
|
|
89
89
|
else if (props.size === "fullscreen") rules += ' l-tp2nko';
|
|
90
90
|
else if (props.size === "L") rules += ' l-3940j6';
|
|
91
91
|
else if (props.size === "M") rules += ' l-38elgx';
|
|
92
92
|
else if (props.size === "S") rules += ' l-38aqto';
|
|
93
|
-
if (props.size === "fullscreenTakeover") rules += '
|
|
93
|
+
if (props.size === "fullscreenTakeover") rules += ' kG';
|
|
94
94
|
else if (props.size === "fullscreen") rules += ' k-tp2nko';
|
|
95
95
|
if (props.size === "L") rules += ' r-yjhhbv';
|
|
96
96
|
else if (props.size === "M") rules += ' r-yjhhbv';
|
package/dist/NumberField.cjs
CHANGED
|
@@ -78,25 +78,15 @@ const $a366ef8f467b1cb5$var$inputButton = function anonymous(props) {
|
|
|
78
78
|
}
|
|
79
79
|
rules += ' _1c';
|
|
80
80
|
rules += ' _2d';
|
|
81
|
-
if (props.size === "XL")
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
rules += ' lm';
|
|
87
|
-
} else if (props.size === "M") {
|
|
88
|
-
rules += ' lbl';
|
|
89
|
-
rules += ' lk';
|
|
90
|
-
} else if (props.size === "S") {
|
|
91
|
-
rules += ' lbk';
|
|
92
|
-
rules += ' lj';
|
|
93
|
-
}
|
|
94
|
-
rules += ' k3';
|
|
81
|
+
if (props.size === "XL") rules += ' lj';
|
|
82
|
+
else if (props.size === "L") rules += ' lh';
|
|
83
|
+
else if (props.size === "M") rules += ' lg';
|
|
84
|
+
else if (props.size === "S") rules += ' lf';
|
|
85
|
+
rules += ' kF';
|
|
95
86
|
if (props.type === "increment") rules += ' ya';
|
|
96
87
|
else rules += ' yF';
|
|
97
88
|
rules += ' _bb';
|
|
98
89
|
rules += ' _8-3t1x';
|
|
99
|
-
rules += ' oba';
|
|
100
90
|
rules += ' oa';
|
|
101
91
|
rules += ' _Oag';
|
|
102
92
|
rules += ' _Oa';
|
|
@@ -146,17 +136,10 @@ const $a366ef8f467b1cb5$var$stepperContainerStyles = function anonymous(props) {
|
|
|
146
136
|
else if (props.size === "L") rules += ' jd';
|
|
147
137
|
else if (props.size === "M") rules += ' jc';
|
|
148
138
|
else if (props.size === "S") rules += ' jd';
|
|
149
|
-
if (props.size === "XL")
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
rules += ' Db-1aa9md1';
|
|
154
|
-
rules += ' D-6njx2e';
|
|
155
|
-
} else if (props.size === "M") rules += ' Dc';
|
|
156
|
-
else if (props.size === "S") {
|
|
157
|
-
rules += ' Db-13yuhxm';
|
|
158
|
-
rules += ' D-59f7mn';
|
|
159
|
-
}
|
|
139
|
+
if (props.size === "XL") rules += ' D-ve8p9e';
|
|
140
|
+
else if (props.size === "L") rules += ' D-ve8p9e';
|
|
141
|
+
else if (props.size === "M") rules += ' Dc';
|
|
142
|
+
else if (props.size === "S") rules += ' D-3zuu7v';
|
|
160
143
|
return rules;
|
|
161
144
|
};
|
|
162
145
|
function $a366ef8f467b1cb5$var$NumberField(props1, ref) {
|
|
@@ -228,22 +211,11 @@ function $a366ef8f467b1cb5$var$NumberField(props1, ref) {
|
|
|
228
211
|
rules += ' _1d';
|
|
229
212
|
rules += ' _f-1x99dlob';
|
|
230
213
|
rules += ' _fa';
|
|
231
|
-
if (props.size === "XL")
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
rules += ' -aqrvqh_k-r';
|
|
237
|
-
} else if (props.size === "S") {
|
|
238
|
-
rules += ' -aqrvqh_k-bn';
|
|
239
|
-
rules += ' -aqrvqh_k-m';
|
|
240
|
-
} else if (props.size === "XS") {
|
|
241
|
-
rules += ' -aqrvqh_k-bl';
|
|
242
|
-
rules += ' -aqrvqh_k-k';
|
|
243
|
-
} else {
|
|
244
|
-
rules += ' -aqrvqh_k-br';
|
|
245
|
-
rules += ' -aqrvqh_k-q';
|
|
246
|
-
}
|
|
214
|
+
if (props.size === "XL") rules += ' -aqrvqh_k-n';
|
|
215
|
+
else if (props.size === "L") rules += ' -aqrvqh_k-l';
|
|
216
|
+
else if (props.size === "S") rules += ' -aqrvqh_k-h';
|
|
217
|
+
else if (props.size === "XS") rules += ' -aqrvqh_k-g';
|
|
218
|
+
else rules += ' -aqrvqh_k-j';
|
|
247
219
|
rules += ' -_1inj1bc_i--prjw07';
|
|
248
220
|
rules += ' je';
|
|
249
221
|
rules += ' __R-yksgrp';
|
|
@@ -277,37 +249,17 @@ function $a366ef8f467b1cb5$var$NumberField(props1, ref) {
|
|
|
277
249
|
rules += ' __b-4cfph1';
|
|
278
250
|
rules += ' __c-4cfph1';
|
|
279
251
|
rules += ' __d-4cfph1';
|
|
280
|
-
if (props.size === "XL")
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
rules += ' qr';
|
|
286
|
-
} else if (props.size === "S") {
|
|
287
|
-
rules += ' qbn';
|
|
288
|
-
rules += ' qm';
|
|
289
|
-
} else if (props.size === "XS") {
|
|
290
|
-
rules += ' qbl';
|
|
291
|
-
rules += ' qk';
|
|
292
|
-
} else {
|
|
293
|
-
rules += ' qbr';
|
|
294
|
-
rules += ' qq';
|
|
295
|
-
}
|
|
252
|
+
if (props.size === "XL") rules += ' qn';
|
|
253
|
+
else if (props.size === "L") rules += ' ql';
|
|
254
|
+
else if (props.size === "S") rules += ' qh';
|
|
255
|
+
else if (props.size === "XS") rules += ' qg';
|
|
256
|
+
else rules += ' qj';
|
|
296
257
|
if (props.isQuiet) rules += ' __ma';
|
|
297
258
|
else rules += ' __m-1s8glxue';
|
|
298
|
-
if (props.size === "XL")
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
rules += ' -usygro_l-bU';
|
|
303
|
-
rules += ' -usygro_l-T';
|
|
304
|
-
} else if (props.size === "S") {
|
|
305
|
-
rules += ' -usygro_l-bQ';
|
|
306
|
-
rules += ' -usygro_l-P';
|
|
307
|
-
} else {
|
|
308
|
-
rules += ' -usygro_l-bS';
|
|
309
|
-
rules += ' -usygro_l-R';
|
|
310
|
-
}
|
|
259
|
+
if (props.size === "XL") rules += ' -usygro_l-A';
|
|
260
|
+
else if (props.size === "L") rules += ' -usygro_l-z';
|
|
261
|
+
else if (props.size === "S") rules += ' -usygro_l-x';
|
|
262
|
+
else rules += ' -usygro_l-y';
|
|
311
263
|
rules += ' m-rwozxi';
|
|
312
264
|
rules += ' C-375tnm';
|
|
313
265
|
rules += ' D-375tnn';
|
package/dist/NumberField.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/NumberField.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 Add from '../ui-icons/Add';\nimport {\n ButtonProps as AriaButtonProps,\n NumberField as AriaNumberField,\n NumberFieldProps as AriaNumberFieldProps,\n ButtonContext,\n ContextValue,\n InputContext,\n Text,\n useContextProps\n} from 'react-aria-components';\nimport {baseColor, size, style} from '../style' with {type: 'macro'};\nimport {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useMemo, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport Dash from '../ui-icons/Dash';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {filterDOMProps, mergeProps, mergeRefs} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {pressScale} from './pressScale';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useButton, useFocusRing, useHover} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface NumberFieldProps extends\n Omit<AriaNumberFieldProps, 'children' | 'className' | 'style'>,\n StyleProps,\n SpectrumLabelableProps,\n HelpTextProps {\n /**\n * Whether to hide the increment and decrement buttons.\n * @default false\n */\n hideStepper?: boolean,\n /**\n * The size of the NumberField.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const NumberFieldContext = createContext<ContextValue<NumberFieldProps, TextFieldRef>>(null);\n\nconst inputButton = style({\n display: 'flex',\n outlineStyle: 'none',\n textAlign: 'center',\n borderStyle: 'none',\n borderTopRadius: {\n default: {\n size: {\n S: '[3px]',\n M: '[4px]',\n L: '[5px]',\n XL: '[6px]'\n }\n },\n type: {\n decrementStep: 'none'\n }\n },\n borderBottomRadius: {\n default: {\n size: {\n S: '[3px]',\n M: '[4px]',\n L: '[5px]',\n XL: '[6px]'\n }\n },\n type: {\n incrementStep: 'none'\n }\n },\n alignItems: 'center',\n justifyContent: 'center',\n width: {\n size: {\n S: 16,\n M: 20,\n L: 24,\n XL: 32\n }\n },\n height: 'auto',\n marginStart: {\n default: 'text-to-control',\n type: {\n increment: 0\n }\n },\n aspectRatio: 'square',\n flexShrink: 0,\n minHeight: 0,\n transition: {\n default: 'default',\n forcedColors: 'none'\n },\n backgroundColor: {\n default: baseColor('gray-100'),\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n color: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonFace'\n }\n },\n cursor: 'default'\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: {\n default: 0,\n type: {\n incrementStep: 270,\n decrementStep: 90\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst stepperContainerStyles = style({\n display: 'flex',\n flexDirection: 'row',\n gap: {\n size: {\n S: 8,\n M: 4,\n L: 8,\n XL: 8\n }\n },\n paddingEnd: {\n size: {\n S: size(2),\n M: 4,\n L: size(6),\n XL: size(6)\n }\n }\n});\n\nfunction NumberField(props: NumberFieldProps, ref: Ref<TextFieldRef>) {\n [props, ref] = useSpectrumContextProps(props, ref, NumberFieldContext);\n let {\n label,\n contextualHelp,\n description: descriptionMessage,\n errorMessage,\n hideStepper,\n isRequired,\n size = 'M',\n labelPosition = 'top',\n necessityIndicator,\n labelAlign = 'start',\n UNSAFE_className = '',\n UNSAFE_style,\n ...numberFieldProps\n } = props;\n let formContext = useContext(FormContext);\n let domRef = useRef<HTMLDivElement | null>(null);\n let inputRef = useRef<HTMLInputElement | null>(null);\n let decrementButtonRef = useRef<HTMLDivElement | null>(null);\n let incrementButtonRef = useRef<HTMLDivElement | null>(null);\n\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef.current;\n }\n }));\n\n\n return (\n <AriaNumberField\n isRequired={isRequired}\n {...numberFieldProps}\n style={UNSAFE_style}\n className={UNSAFE_className + style(field(), getAllowedOverrides())({\n isInForm: !!formContext,\n labelPosition,\n size\n }, props.styles)}>\n {\n ({isDisabled, isInvalid}) => {\n return (\n <>\n <FieldLabel\n isDisabled={isDisabled}\n isRequired={isRequired}\n size={size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n necessityIndicator={necessityIndicator}\n contextualHelp={contextualHelp}>\n {label}\n </FieldLabel>\n <FieldGroup\n role=\"presentation\"\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n size={size}\n styles={style({\n ...fieldInput(),\n paddingStart: 'edge-to-text',\n paddingEnd: {\n default: 0,\n isStepperHidden: 'edge-to-text'\n }\n })({size, isStepperHidden: hideStepper})}>\n <InputContext.Consumer>\n {ctx => (\n <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n <Input />\n </InputContext.Provider>\n )}\n </InputContext.Consumer>\n {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n {!hideStepper && <div className={stepperContainerStyles({size})}>\n <StepButton\n ref={decrementButtonRef}\n slot=\"decrement\"\n style={renderProps => pressScale(decrementButtonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n type: 'decrement',\n size\n })}>\n <Dash size={size} className={iconStyles({})} />\n </StepButton>\n <StepButton\n ref={incrementButtonRef}\n slot=\"increment\"\n style={renderProps => pressScale(incrementButtonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n type: 'increment',\n size\n })}>\n <Add size={size} className={iconStyles({})} />\n </StepButton>\n </div>}\n </FieldGroup>\n {descriptionMessage && <Text slot=\"description\">{descriptionMessage}</Text>}\n <HelpText\n size={size}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n description={descriptionMessage}>\n {errorMessage}\n </HelpText>\n </>\n );\n }\n }\n </AriaNumberField>\n );\n}\n\ninterface StepButtonProps extends AriaButtonProps {\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nlet StepButton = forwardRef((props: StepButtonProps, ref: ForwardedRef<HTMLDivElement>) => {\n [props, ref] = useContextProps(props, ref, ButtonContext as any);\n let ctx = props as any;\n /**\n * Must use div for now because Safari pointer event bugs on disabled form elements.\n * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n */\n let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n let {hoverProps, isHovered} = useHover(props);\n let renderProps = useRenderProps({\n ...props,\n values: {isHovered, isPressed, isFocused, isFocusVisible, isDisabled: props.isDisabled || false},\n defaultClassName: 'react-aria-Button'\n });\n return (\n <div\n {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n {...mergeProps(buttonProps, focusProps, hoverProps)}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-disabled={props.isDisabled || undefined}\n data-pressed={ctx.isPressed || isPressed || undefined}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined} />\n );\n});\n\n/**\n * NumberFields allow users to input number values with a keyboard or increment/decrement with step buttons.\n */\nlet _NumberField = forwardRef(NumberField);\nexport {_NumberField as NumberField};\n\n// replace from RAC\nfunction useRenderProps(props: any) {\n let {\n className,\n style,\n children,\n defaultClassName = undefined,\n defaultChildren = undefined,\n defaultStyle,\n values\n } = props;\n\n return useMemo(() => {\n let computedClassName: string | undefined;\n let computedStyle: CSSProperties | undefined;\n let computedChildren: ReactNode | undefined;\n\n if (typeof className === 'function') {\n computedClassName = className({...values, defaultClassName});\n } else {\n computedClassName = className;\n }\n\n if (typeof style === 'function') {\n computedStyle = style({...values, defaultStyle: defaultStyle || {}});\n } else {\n computedStyle = style;\n }\n\n if (typeof children === 'function') {\n computedChildren = children({...values, defaultChildren});\n } else if (children == null) {\n computedChildren = defaultChildren;\n } else {\n computedChildren = children;\n }\n\n return {\n className: computedClassName ?? defaultClassName,\n style: (computedStyle || defaultStyle) ? {...defaultStyle, ...computedStyle} : undefined,\n children: computedChildren ?? defaultChildren,\n 'data-rac': ''\n };\n }, [className, style, children, defaultClassName, defaultChildren, defaultStyle, values]);\n}\n"],"names":[],"version":3,"file":"NumberField.cjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/NumberField.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 Add from '../ui-icons/Add';\nimport {\n ButtonProps as AriaButtonProps,\n NumberField as AriaNumberField,\n NumberFieldProps as AriaNumberFieldProps,\n ButtonContext,\n ContextValue,\n InputContext,\n Text,\n useContextProps\n} from 'react-aria-components';\nimport {baseColor, size, style} from '../style' with {type: 'macro'};\nimport {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useMemo, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport Dash from '../ui-icons/Dash';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {filterDOMProps, mergeProps, mergeRefs} from '@react-aria/utils';\nimport {FormContext} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {pressScale} from './pressScale';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useButton, useFocusRing, useHover} from 'react-aria';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface NumberFieldProps extends\n Omit<AriaNumberFieldProps, 'children' | 'className' | 'style'>,\n StyleProps,\n SpectrumLabelableProps,\n HelpTextProps {\n /**\n * Whether to hide the increment and decrement buttons.\n * @default false\n */\n hideStepper?: boolean,\n /**\n * The size of the NumberField.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const NumberFieldContext = createContext<ContextValue<NumberFieldProps, TextFieldRef>>(null);\n\nconst inputButton = style({\n display: 'flex',\n outlineStyle: 'none',\n textAlign: 'center',\n borderStyle: 'none',\n borderTopRadius: {\n default: {\n size: {\n S: '[3px]',\n M: '[4px]',\n L: '[5px]',\n XL: '[6px]'\n }\n },\n type: {\n decrementStep: 'none'\n }\n },\n borderBottomRadius: {\n default: {\n size: {\n S: '[3px]',\n M: '[4px]',\n L: '[5px]',\n XL: '[6px]'\n }\n },\n type: {\n incrementStep: 'none'\n }\n },\n alignItems: 'center',\n justifyContent: 'center',\n width: {\n size: {\n S: 16,\n M: 20,\n L: 24,\n XL: 32\n }\n },\n height: 'auto',\n marginStart: {\n default: 'text-to-control',\n type: {\n increment: 0\n }\n },\n aspectRatio: 'square',\n flexShrink: 0,\n minHeight: 0,\n transition: {\n default: 'default',\n forcedColors: 'none'\n },\n backgroundColor: {\n default: baseColor('gray-100'),\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n color: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonFace'\n }\n },\n cursor: 'default'\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: {\n default: 0,\n type: {\n incrementStep: 270,\n decrementStep: 90\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst stepperContainerStyles = style({\n display: 'flex',\n flexDirection: 'row',\n gap: {\n size: {\n S: 8,\n M: 4,\n L: 8,\n XL: 8\n }\n },\n paddingEnd: {\n size: {\n S: size(2),\n M: 4,\n L: size(6),\n XL: size(6)\n }\n }\n});\n\nfunction NumberField(props: NumberFieldProps, ref: Ref<TextFieldRef>) {\n [props, ref] = useSpectrumContextProps(props, ref, NumberFieldContext);\n let {\n label,\n contextualHelp,\n description: descriptionMessage,\n errorMessage,\n hideStepper,\n isRequired,\n size = 'M',\n labelPosition = 'top',\n necessityIndicator,\n labelAlign = 'start',\n UNSAFE_className = '',\n UNSAFE_style,\n ...numberFieldProps\n } = props;\n let formContext = useContext(FormContext);\n let domRef = useRef<HTMLDivElement | null>(null);\n let inputRef = useRef<HTMLInputElement | null>(null);\n let decrementButtonRef = useRef<HTMLDivElement | null>(null);\n let incrementButtonRef = useRef<HTMLDivElement | null>(null);\n\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef.current;\n }\n }));\n\n\n return (\n <AriaNumberField\n isRequired={isRequired}\n {...numberFieldProps}\n style={UNSAFE_style}\n className={UNSAFE_className + style(field(), getAllowedOverrides())({\n isInForm: !!formContext,\n labelPosition,\n size\n }, props.styles)}>\n {\n ({isDisabled, isInvalid}) => {\n return (\n <>\n <FieldLabel\n isDisabled={isDisabled}\n isRequired={isRequired}\n size={size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n necessityIndicator={necessityIndicator}\n contextualHelp={contextualHelp}>\n {label}\n </FieldLabel>\n <FieldGroup\n role=\"presentation\"\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n size={size}\n styles={style({\n ...fieldInput(),\n paddingStart: 'edge-to-text',\n paddingEnd: {\n default: 0,\n isStepperHidden: 'edge-to-text'\n }\n })({size, isStepperHidden: hideStepper})}>\n <InputContext.Consumer>\n {ctx => (\n <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n <Input />\n </InputContext.Provider>\n )}\n </InputContext.Consumer>\n {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n {!hideStepper && <div className={stepperContainerStyles({size})}>\n <StepButton\n ref={decrementButtonRef}\n slot=\"decrement\"\n style={renderProps => pressScale(decrementButtonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n type: 'decrement',\n size\n })}>\n <Dash size={size} className={iconStyles({})} />\n </StepButton>\n <StepButton\n ref={incrementButtonRef}\n slot=\"increment\"\n style={renderProps => pressScale(incrementButtonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n type: 'increment',\n size\n })}>\n <Add size={size} className={iconStyles({})} />\n </StepButton>\n </div>}\n </FieldGroup>\n {descriptionMessage && <Text slot=\"description\">{descriptionMessage}</Text>}\n <HelpText\n size={size}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n description={descriptionMessage}>\n {errorMessage}\n </HelpText>\n </>\n );\n }\n }\n </AriaNumberField>\n );\n}\n\ninterface StepButtonProps extends AriaButtonProps {\n}\n\nconst additionalButtonHTMLAttributes = new Set(['form', 'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget', 'name', 'value']);\n\nlet StepButton = forwardRef((props: StepButtonProps, ref: ForwardedRef<HTMLDivElement>) => {\n [props, ref] = useContextProps(props, ref, ButtonContext as any);\n let ctx = props as any;\n /**\n * Must use div for now because Safari pointer event bugs on disabled form elements.\n * Link https://bugs.webkit.org/show_bug.cgi?id=219188.\n */\n let {buttonProps, isPressed} = useButton({...props, elementType: 'div'}, ref);\n let {focusProps, isFocused, isFocusVisible} = useFocusRing(props);\n let {hoverProps, isHovered} = useHover(props);\n let renderProps = useRenderProps({\n ...props,\n values: {isHovered, isPressed, isFocused, isFocusVisible, isDisabled: props.isDisabled || false},\n defaultClassName: 'react-aria-Button'\n });\n return (\n <div\n {...filterDOMProps(props, {propNames: additionalButtonHTMLAttributes})}\n {...mergeProps(buttonProps, focusProps, hoverProps)}\n {...renderProps}\n ref={ref}\n slot={props.slot || undefined}\n data-disabled={props.isDisabled || undefined}\n data-pressed={ctx.isPressed || isPressed || undefined}\n data-hovered={isHovered || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined} />\n );\n});\n\n/**\n * NumberFields allow users to input number values with a keyboard or increment/decrement with step buttons.\n */\nlet _NumberField = forwardRef(NumberField);\nexport {_NumberField as NumberField};\n\n// replace from RAC\nfunction useRenderProps(props: any) {\n let {\n className,\n style,\n children,\n defaultClassName = undefined,\n defaultChildren = undefined,\n defaultStyle,\n values\n } = props;\n\n return useMemo(() => {\n let computedClassName: string | undefined;\n let computedStyle: CSSProperties | undefined;\n let computedChildren: ReactNode | undefined;\n\n if (typeof className === 'function') {\n computedClassName = className({...values, defaultClassName});\n } else {\n computedClassName = className;\n }\n\n if (typeof style === 'function') {\n computedStyle = style({...values, defaultStyle: defaultStyle || {}});\n } else {\n computedStyle = style;\n }\n\n if (typeof children === 'function') {\n computedChildren = children({...values, defaultChildren});\n } else if (children == null) {\n computedChildren = defaultChildren;\n } else {\n computedChildren = children;\n }\n\n return {\n className: computedClassName ?? defaultClassName,\n style: (computedStyle || defaultStyle) ? {...defaultStyle, ...computedStyle} : undefined,\n children: computedChildren ?? defaultChildren,\n 'data-rac': ''\n };\n }, [className, style, children, defaultClassName, defaultChildren, defaultStyle, values]);\n}\n"],"names":[],"version":3,"file":"NumberField.cjs.map"}
|