@react-spectrum/s2 0.5.0 → 0.6.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.
- package/dist/Accordion.cjs +5 -8
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css +2 -2
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +5 -8
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionBar.cjs +264 -0
- package/dist/ActionBar.cjs.map +1 -0
- package/dist/ActionBar.css +267 -0
- package/dist/ActionBar.css.map +1 -0
- package/dist/ActionBar.mjs +257 -0
- package/dist/ActionBar.mjs.map +1 -0
- package/dist/ActionButton.cjs +121 -147
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +133 -153
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +122 -148
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.cjs +6 -9
- package/dist/ActionButtonGroup.cjs.map +1 -1
- package/dist/ActionButtonGroup.css +3 -3
- package/dist/ActionButtonGroup.css.map +1 -1
- package/dist/ActionButtonGroup.mjs +6 -9
- package/dist/ActionButtonGroup.mjs.map +1 -1
- package/dist/ActionMenu.cjs +2 -5
- package/dist/ActionMenu.cjs.map +1 -1
- package/dist/ActionMenu.mjs +2 -5
- package/dist/ActionMenu.mjs.map +1 -1
- package/dist/AlertDialog.cjs +2 -5
- package/dist/AlertDialog.cjs.map +1 -1
- package/dist/AlertDialog.css.map +1 -1
- package/dist/AlertDialog.mjs +2 -5
- package/dist/AlertDialog.mjs.map +1 -1
- package/dist/Avatar.cjs +12 -15
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css +11 -11
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +12 -15
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +99 -102
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +31 -31
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +99 -102
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +99 -102
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +76 -76
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +99 -102
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +93 -94
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +70 -64
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +94 -95
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +305 -278
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +255 -182
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +307 -280
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +17 -20
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css +11 -11
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +18 -21
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +167 -167
- package/dist/Card.css +121 -121
- package/dist/Card.mjs +167 -167
- package/dist/CardView.cjs +47 -21
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +39 -15
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +49 -23
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +2 -2
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +58 -62
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +54 -54
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +59 -63
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +43 -45
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css +32 -32
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs +44 -46
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.cjs +7 -8
- package/dist/ClearButton.cjs.map +1 -1
- package/dist/ClearButton.css +5 -5
- package/dist/ClearButton.css.map +1 -1
- package/dist/ClearButton.mjs +7 -8
- package/dist/ClearButton.mjs.map +1 -1
- package/dist/CloseButton.cjs +40 -53
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +45 -49
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs +40 -53
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +12 -15
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css +10 -10
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs +12 -15
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs +31 -34
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css +24 -24
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs +32 -35
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorHandle.cjs +11 -11
- package/dist/ColorHandle.css +19 -19
- package/dist/ColorHandle.mjs +11 -11
- package/dist/ColorSlider.cjs +43 -46
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +43 -43
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +44 -47
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +8 -11
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +14 -14
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +9 -12
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +15 -18
- package/dist/ColorSwatchPicker.cjs.map +1 -1
- package/dist/ColorSwatchPicker.css +33 -33
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +15 -18
- package/dist/ColorSwatchPicker.mjs.map +1 -1
- package/dist/ColorWheel.cjs +18 -21
- package/dist/ColorWheel.cjs.map +1 -1
- package/dist/ColorWheel.css +15 -15
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs +18 -21
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +61 -61
- package/dist/ComboBox.cjs.map +1 -1
- package/dist/ComboBox.css +52 -52
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +62 -62
- package/dist/ComboBox.mjs.map +1 -1
- package/dist/Content.cjs +12 -19
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs +12 -19
- package/dist/Content.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +7 -10
- package/dist/ContextualHelp.cjs.map +1 -1
- package/dist/ContextualHelp.css +23 -23
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +7 -10
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/CustomDialog.cjs +10 -13
- package/dist/CustomDialog.cjs.map +1 -1
- package/dist/CustomDialog.css +9 -9
- package/dist/CustomDialog.css.map +1 -1
- package/dist/CustomDialog.mjs +10 -13
- package/dist/CustomDialog.mjs.map +1 -1
- package/dist/Dialog.cjs +12 -16
- package/dist/Dialog.cjs.map +1 -1
- package/dist/Dialog.css +39 -39
- package/dist/Dialog.css.map +1 -1
- package/dist/Dialog.mjs +12 -16
- package/dist/Dialog.mjs.map +1 -1
- package/dist/Disclosure.cjs +60 -69
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +49 -49
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +61 -70
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs +15 -19
- package/dist/Divider.cjs.map +1 -1
- package/dist/Divider.css +18 -18
- package/dist/Divider.css.map +1 -1
- package/dist/Divider.mjs +15 -19
- package/dist/Divider.mjs.map +1 -1
- package/dist/DropZone.cjs +30 -33
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +26 -26
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +30 -33
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +133 -131
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +76 -84
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +133 -131
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +6 -9
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +3 -3
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs +6 -9
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +7 -10
- package/dist/FullscreenDialog.cjs.map +1 -1
- package/dist/FullscreenDialog.css +54 -54
- package/dist/FullscreenDialog.css.map +1 -1
- package/dist/FullscreenDialog.mjs +7 -10
- package/dist/FullscreenDialog.mjs.map +1 -1
- package/dist/IllustratedMessage.cjs +128 -132
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +58 -58
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +128 -132
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +12 -13
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css +11 -11
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +13 -14
- package/dist/Image.mjs.map +1 -1
- package/dist/InlineAlert.cjs +75 -84
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css +59 -63
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +76 -85
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Link.cjs +36 -39
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css +42 -42
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +37 -40
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +322 -234
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +118 -116
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +323 -235
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +66 -70
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +69 -73
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +66 -70
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +36 -45
- package/dist/Modal.cjs.map +1 -1
- package/dist/Modal.css +48 -72
- package/dist/Modal.css.map +1 -1
- package/dist/Modal.mjs +37 -46
- package/dist/Modal.mjs.map +1 -1
- package/dist/NumberField.cjs +66 -69
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css +70 -70
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +67 -70
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +122 -122
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +84 -84
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +123 -123
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +47 -69
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +55 -126
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +48 -70
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs +85 -87
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +81 -85
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +85 -87
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +16 -18
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css +16 -16
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +16 -18
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Provider.cjs +5 -5
- package/dist/Provider.css +6 -6
- package/dist/Provider.mjs +5 -5
- package/dist/Radio.cjs +54 -58
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +50 -50
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +55 -59
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +39 -43
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css +32 -32
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs +40 -44
- package/dist/RadioGroup.mjs.map +1 -1
- package/dist/RangeSlider.cjs +2 -3
- package/dist/RangeSlider.cjs.map +1 -1
- package/dist/RangeSlider.mjs +3 -4
- package/dist/RangeSlider.mjs.map +1 -1
- package/dist/SearchField.cjs +34 -37
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +30 -30
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +35 -38
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +67 -73
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +63 -63
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +68 -74
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +111 -112
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +87 -87
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +112 -113
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +28 -32
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +26 -26
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +28 -32
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +56 -60
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +48 -48
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +57 -61
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +209 -196
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +95 -95
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +211 -198
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +59 -62
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +42 -42
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +59 -62
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TagGroup.cjs +122 -124
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +93 -93
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +122 -124
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +44 -55
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +33 -33
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +45 -56
- package/dist/TextField.mjs.map +1 -1
- package/dist/ToggleButton.cjs +6 -9
- package/dist/ToggleButton.cjs.map +1 -1
- package/dist/ToggleButton.css +7 -7
- package/dist/ToggleButton.css.map +1 -1
- package/dist/ToggleButton.mjs +6 -9
- package/dist/ToggleButton.mjs.map +1 -1
- package/dist/ToggleButtonGroup.cjs +2 -5
- package/dist/ToggleButtonGroup.cjs.map +1 -1
- package/dist/ToggleButtonGroup.mjs +2 -5
- package/dist/ToggleButtonGroup.mjs.map +1 -1
- package/dist/Tooltip.cjs +48 -48
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +55 -70
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +49 -49
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/ar-AE.cjs +10 -2
- package/dist/ar-AE.cjs.map +1 -1
- package/dist/ar-AE.mjs +10 -2
- package/dist/ar-AE.mjs.map +1 -1
- package/dist/bg-BG.cjs +11 -2
- package/dist/bg-BG.cjs.map +1 -1
- package/dist/bg-BG.mjs +11 -2
- package/dist/bg-BG.mjs.map +1 -1
- package/dist/cs-CZ.cjs +7 -2
- package/dist/cs-CZ.cjs.map +1 -1
- package/dist/cs-CZ.mjs +7 -2
- package/dist/cs-CZ.mjs.map +1 -1
- package/dist/da-DK.cjs +12 -4
- package/dist/da-DK.cjs.map +1 -1
- package/dist/da-DK.mjs +12 -4
- package/dist/da-DK.mjs.map +1 -1
- package/dist/de-DE.cjs +11 -2
- package/dist/de-DE.cjs.map +1 -1
- package/dist/de-DE.mjs +11 -2
- package/dist/de-DE.mjs.map +1 -1
- package/dist/el-GR.cjs +11 -2
- package/dist/el-GR.cjs.map +1 -1
- package/dist/el-GR.mjs +11 -2
- package/dist/el-GR.mjs.map +1 -1
- package/dist/en-US.cjs +8 -0
- package/dist/en-US.cjs.map +1 -1
- package/dist/en-US.mjs +8 -0
- package/dist/en-US.mjs.map +1 -1
- package/dist/es-ES.cjs +11 -2
- package/dist/es-ES.cjs.map +1 -1
- package/dist/es-ES.mjs +11 -2
- package/dist/es-ES.mjs.map +1 -1
- package/dist/et-EE.cjs +10 -2
- package/dist/et-EE.cjs.map +1 -1
- package/dist/et-EE.mjs +10 -2
- package/dist/et-EE.mjs.map +1 -1
- package/dist/fi-FI.cjs +10 -2
- package/dist/fi-FI.cjs.map +1 -1
- package/dist/fi-FI.mjs +10 -2
- package/dist/fi-FI.mjs.map +1 -1
- package/dist/fr-FR.cjs +11 -2
- package/dist/fr-FR.cjs.map +1 -1
- package/dist/fr-FR.mjs +11 -2
- package/dist/fr-FR.mjs.map +1 -1
- package/dist/he-IL.cjs +11 -2
- package/dist/he-IL.cjs.map +1 -1
- package/dist/he-IL.mjs +11 -2
- package/dist/he-IL.mjs.map +1 -1
- package/dist/hr-HR.cjs +7 -2
- package/dist/hr-HR.cjs.map +1 -1
- package/dist/hr-HR.mjs +7 -2
- package/dist/hr-HR.mjs.map +1 -1
- package/dist/hu-HU.cjs +10 -2
- package/dist/hu-HU.cjs.map +1 -1
- package/dist/hu-HU.mjs +10 -2
- package/dist/hu-HU.mjs.map +1 -1
- package/dist/it-IT.cjs +11 -2
- package/dist/it-IT.cjs.map +1 -1
- package/dist/it-IT.mjs +11 -2
- package/dist/it-IT.mjs.map +1 -1
- package/dist/ja-JP.cjs +10 -2
- package/dist/ja-JP.cjs.map +1 -1
- package/dist/ja-JP.mjs +10 -2
- package/dist/ja-JP.mjs.map +1 -1
- package/dist/ko-KR.cjs +12 -4
- package/dist/ko-KR.cjs.map +1 -1
- package/dist/ko-KR.mjs +12 -4
- package/dist/ko-KR.mjs.map +1 -1
- package/dist/lt-LT.cjs +9 -4
- package/dist/lt-LT.cjs.map +1 -1
- package/dist/lt-LT.mjs +9 -4
- package/dist/lt-LT.mjs.map +1 -1
- package/dist/lv-LV.cjs +11 -3
- package/dist/lv-LV.cjs.map +1 -1
- package/dist/lv-LV.mjs +11 -3
- package/dist/lv-LV.mjs.map +1 -1
- package/dist/main.cjs +4 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +3 -1
- package/dist/module.mjs.map +1 -1
- package/dist/nb-NO.cjs +9 -4
- package/dist/nb-NO.cjs.map +1 -1
- package/dist/nb-NO.mjs +9 -4
- package/dist/nb-NO.mjs.map +1 -1
- package/dist/nl-NL.cjs +10 -2
- package/dist/nl-NL.cjs.map +1 -1
- package/dist/nl-NL.mjs +10 -2
- package/dist/nl-NL.mjs.map +1 -1
- package/dist/pl-PL.cjs +8 -3
- package/dist/pl-PL.cjs.map +1 -1
- package/dist/pl-PL.mjs +8 -3
- package/dist/pl-PL.mjs.map +1 -1
- package/dist/pt-BR.cjs +11 -2
- package/dist/pt-BR.cjs.map +1 -1
- package/dist/pt-BR.mjs +11 -2
- package/dist/pt-BR.mjs.map +1 -1
- package/dist/pt-PT.cjs +11 -2
- package/dist/pt-PT.cjs.map +1 -1
- package/dist/pt-PT.mjs +11 -2
- package/dist/pt-PT.mjs.map +1 -1
- package/dist/ro-RO.cjs +12 -3
- package/dist/ro-RO.cjs.map +1 -1
- package/dist/ro-RO.mjs +12 -3
- package/dist/ro-RO.mjs.map +1 -1
- package/dist/ru-RU.cjs +7 -2
- package/dist/ru-RU.cjs.map +1 -1
- package/dist/ru-RU.mjs +7 -2
- package/dist/ru-RU.mjs.map +1 -1
- package/dist/sk-SK.cjs +7 -2
- package/dist/sk-SK.cjs.map +1 -1
- package/dist/sk-SK.mjs +7 -2
- package/dist/sk-SK.mjs.map +1 -1
- package/dist/sl-SI.cjs +7 -2
- package/dist/sl-SI.cjs.map +1 -1
- package/dist/sl-SI.mjs +7 -2
- package/dist/sl-SI.mjs.map +1 -1
- package/dist/sr-SP.cjs +7 -2
- package/dist/sr-SP.cjs.map +1 -1
- package/dist/sr-SP.mjs +7 -2
- package/dist/sr-SP.mjs.map +1 -1
- package/dist/sv-SE.cjs +11 -2
- package/dist/sv-SE.cjs.map +1 -1
- package/dist/sv-SE.mjs +11 -2
- package/dist/sv-SE.mjs.map +1 -1
- package/dist/tr-TR.cjs +10 -2
- package/dist/tr-TR.cjs.map +1 -1
- package/dist/tr-TR.mjs +10 -2
- package/dist/tr-TR.mjs.map +1 -1
- package/dist/types.d.ts +109 -89
- package/dist/types.d.ts.map +1 -1
- package/dist/uk-UA.cjs +7 -2
- package/dist/uk-UA.cjs.map +1 -1
- package/dist/uk-UA.mjs +7 -2
- package/dist/uk-UA.mjs.map +1 -1
- package/dist/zh-CN.cjs +10 -2
- package/dist/zh-CN.cjs.map +1 -1
- package/dist/zh-CN.mjs +10 -2
- package/dist/zh-CN.mjs.map +1 -1
- package/dist/zh-TW.cjs +10 -2
- package/dist/zh-TW.cjs.map +1 -1
- package/dist/zh-TW.mjs +10 -2
- package/dist/zh-TW.mjs.map +1 -1
- package/icons/Skeleton.cjs +2 -2
- package/icons/Skeleton.css +5 -5
- package/icons/Skeleton.mjs +2 -2
- package/package.json +20 -21
- package/src/Accordion.tsx +5 -8
- package/src/ActionBar.tsx +229 -0
- package/src/ActionButton.tsx +25 -52
- package/src/ActionButtonGroup.tsx +9 -11
- package/src/ActionMenu.tsx +5 -8
- package/src/AlertDialog.tsx +5 -8
- package/src/Avatar.tsx +5 -8
- package/src/AvatarGroup.tsx +5 -8
- package/src/Badge.tsx +5 -8
- package/src/Breadcrumbs.tsx +6 -12
- package/src/Button.tsx +197 -154
- package/src/ButtonGroup.tsx +5 -8
- package/src/CardView.tsx +37 -12
- package/src/Checkbox.tsx +6 -9
- package/src/CheckboxGroup.tsx +6 -9
- package/src/ClearButton.tsx +2 -5
- package/src/CloseButton.tsx +21 -31
- package/src/ColorArea.tsx +5 -8
- package/src/ColorField.tsx +5 -8
- package/src/ColorSlider.tsx +5 -8
- package/src/ColorSwatch.tsx +5 -8
- package/src/ColorSwatchPicker.tsx +5 -8
- package/src/ColorWheel.tsx +5 -8
- package/src/ComboBox.tsx +7 -9
- package/src/Content.tsx +12 -30
- package/src/ContextualHelp.tsx +5 -8
- package/src/CustomDialog.tsx +5 -8
- package/src/Dialog.tsx +6 -9
- package/src/Disclosure.tsx +15 -24
- package/src/Divider.tsx +16 -25
- package/src/DropZone.tsx +5 -8
- package/src/Field.tsx +25 -32
- package/src/Form.tsx +5 -8
- package/src/FullscreenDialog.tsx +5 -8
- package/src/IllustratedMessage.tsx +6 -9
- package/src/Image.tsx +3 -6
- package/src/InlineAlert.tsx +6 -10
- package/src/Link.tsx +13 -21
- package/src/Menu.tsx +69 -33
- package/src/Meter.tsx +13 -23
- package/src/Modal.tsx +22 -52
- package/src/NumberField.tsx +5 -8
- package/src/Picker.tsx +7 -9
- package/src/Popover.tsx +30 -104
- package/src/ProgressBar.tsx +14 -24
- package/src/ProgressCircle.tsx +18 -24
- package/src/Radio.tsx +6 -9
- package/src/RadioGroup.tsx +6 -9
- package/src/RangeSlider.tsx +2 -5
- package/src/SearchField.tsx +5 -8
- package/src/SegmentedControl.tsx +10 -16
- package/src/Slider.tsx +2 -5
- package/src/StatusLight.tsx +6 -9
- package/src/Switch.tsx +6 -9
- package/src/TableView.tsx +53 -50
- package/src/Tabs.tsx +5 -8
- package/src/TagGroup.tsx +7 -14
- package/src/TextField.tsx +20 -28
- package/src/ToggleButton.tsx +7 -9
- package/src/ToggleButtonGroup.tsx +5 -8
- package/src/Tooltip.tsx +30 -51
- package/src/bar-utils.ts +3 -10
- package/src/index.ts +2 -0
- package/src/style-utils.ts +15 -8
- package/style/dist/main.cjs +1 -0
- package/style/dist/main.cjs.map +1 -1
- package/style/dist/module.mjs +2 -2
- package/style/dist/module.mjs.map +1 -1
- package/style/dist/spectrum-theme.cjs +72 -5
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs +72 -6
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/style-macro.cjs +13 -1
- package/style/dist/style-macro.cjs.map +1 -1
- package/style/dist/style-macro.mjs +13 -1
- package/style/dist/style-macro.mjs.map +1 -1
- package/style/dist/types.d.ts +50 -29
- package/style/dist/types.d.ts.map +1 -1
- package/style/index.ts +1 -1
- package/style/spectrum-theme.ts +72 -7
- package/style/style-macro.ts +20 -4
- package/style/tokens.ts +30 -0
- package/style/types.ts +1 -1
package/dist/Field.mjs
CHANGED
|
@@ -40,7 +40,7 @@ function $parcel$interopDefault(a) {
|
|
|
40
40
|
|
|
41
41
|
|
|
42
42
|
|
|
43
|
-
|
|
43
|
+
const $9afd80978c252040$export$1acdcf5a973a8414 = /*#__PURE__*/ (0, $7A6HT$forwardRef)(function FieldLabel(props, ref) {
|
|
44
44
|
let stringFormatter = (0, $7A6HT$useLocalizedStringFormatter)((0, ($parcel$interopDefault($7A6HT$intlStringsmjs))), '@react-spectrum/s2');
|
|
45
45
|
let { isDisabled: isDisabled, isRequired: isRequired, size: size = 'M', necessityIndicator: necessityIndicator = 'icon', includeNecessityIndicatorInAccessibilityName: includeNecessityIndicatorInAccessibilityName = false, labelAlign: labelAlign, labelPosition: labelPosition, staticColor: staticColor, contextualHelp: contextualHelp, isQuiet: isQuiet, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', ...labelProps } = props;
|
|
46
46
|
let domRef = (0, $7A6HT$useDOMRef)(ref);
|
|
@@ -51,16 +51,16 @@ function $9afd80978c252040$var$FieldLabel(props, ref) {
|
|
|
51
51
|
return /*#__PURE__*/ (0, $7A6HT$jsxs)("div", {
|
|
52
52
|
className: function anonymous(props) {
|
|
53
53
|
let rules = " .";
|
|
54
|
-
rules += '
|
|
55
|
-
rules += '
|
|
56
|
-
rules += '
|
|
57
|
-
rules += '
|
|
58
|
-
rules += '
|
|
59
|
-
if (props.labelAlign === "end") rules += '
|
|
60
|
-
else if (props.labelAlign === "start") rules += '
|
|
54
|
+
rules += ' __b-hr3t0p';
|
|
55
|
+
rules += ' __c-hr3t0p';
|
|
56
|
+
rules += ' __d-hr3t0p';
|
|
57
|
+
rules += ' __e-hr3t0p';
|
|
58
|
+
rules += ' _0c';
|
|
59
|
+
if (props.labelAlign === "end") rules += ' _kc';
|
|
60
|
+
else if (props.labelAlign === "start") rules += ' _ka';
|
|
61
61
|
if (props.labelPosition === "top") rules += ' F-1inj1bc';
|
|
62
|
-
if (props.isQuiet) rules += '
|
|
63
|
-
else if (props.labelPosition === "top") rules += '
|
|
62
|
+
if (props.isQuiet) rules += ' __na';
|
|
63
|
+
else if (props.labelPosition === "top") rules += ' __ne';
|
|
64
64
|
return rules;
|
|
65
65
|
}({
|
|
66
66
|
labelAlign: labelAlign,
|
|
@@ -74,36 +74,35 @@ function $9afd80978c252040$var$FieldLabel(props, ref) {
|
|
|
74
74
|
style: UNSAFE_style,
|
|
75
75
|
className: UNSAFE_className + (0, $feb886035e0d4633$export$e618dc39ac9ad607)(function anonymous(props) {
|
|
76
76
|
let rules = " .";
|
|
77
|
-
rules += '
|
|
78
|
-
rules += '
|
|
79
|
-
rules += '
|
|
80
|
-
rules += '
|
|
81
|
-
rules += '
|
|
82
|
-
rules += '
|
|
83
|
-
rules += '
|
|
84
|
-
rules += '
|
|
77
|
+
rules += ' _d-bc1l9oh';
|
|
78
|
+
rules += ' _d-1uotwbwg';
|
|
79
|
+
rules += ' _d-eo0c6sf';
|
|
80
|
+
rules += ' _d-enzzrge';
|
|
81
|
+
rules += ' _d-enzykdd';
|
|
82
|
+
rules += ' _d-enzwzjc';
|
|
83
|
+
rules += ' _d-enzrfpb';
|
|
84
|
+
rules += ' _da';
|
|
85
85
|
if (props.size === "XL") {
|
|
86
|
-
rules += '
|
|
87
|
-
rules += '
|
|
86
|
+
rules += ' _ebj';
|
|
87
|
+
rules += ' _ei';
|
|
88
88
|
} else if (props.size === "L") {
|
|
89
|
-
rules += '
|
|
90
|
-
rules += '
|
|
89
|
+
rules += ' _ebh';
|
|
90
|
+
rules += ' _eg';
|
|
91
91
|
} else if (props.size === "S") {
|
|
92
|
-
rules += '
|
|
93
|
-
rules += '
|
|
92
|
+
rules += ' _ebd';
|
|
93
|
+
rules += ' _ec';
|
|
94
94
|
} else if (props.size === "XS") {
|
|
95
|
-
rules += '
|
|
96
|
-
rules += '
|
|
95
|
+
rules += ' _ebb';
|
|
96
|
+
rules += ' _ea';
|
|
97
97
|
} else {
|
|
98
|
-
rules += '
|
|
99
|
-
rules += '
|
|
98
|
+
rules += ' _ebf';
|
|
99
|
+
rules += ' _ee';
|
|
100
100
|
}
|
|
101
|
-
rules += '
|
|
102
|
-
rules += '
|
|
103
|
-
rules += '
|
|
104
|
-
rules += '
|
|
105
|
-
if (props.
|
|
106
|
-
else if (props.staticColor === "white") rules += ' a_____d';
|
|
101
|
+
rules += ' _fb';
|
|
102
|
+
rules += ' _g-1x99dlob';
|
|
103
|
+
rules += ' _ga';
|
|
104
|
+
rules += ' aa_____K';
|
|
105
|
+
if (props.isStaticColor) rules += ' a_____G';
|
|
107
106
|
else if (props.isDisabled) rules += ' aj';
|
|
108
107
|
else {
|
|
109
108
|
if (props.isPressed) rules += ' an';
|
|
@@ -111,18 +110,18 @@ function $9afd80978c252040$var$FieldLabel(props, ref) {
|
|
|
111
110
|
else if (props.isHovered) rules += ' an';
|
|
112
111
|
else rules += ' am';
|
|
113
112
|
}
|
|
114
|
-
rules += '
|
|
113
|
+
rules += ' __Ib';
|
|
115
114
|
return rules;
|
|
116
115
|
}({
|
|
117
116
|
labelPosition: labelPosition,
|
|
118
117
|
isDisabled: isDisabled,
|
|
119
118
|
size: size,
|
|
120
|
-
|
|
119
|
+
isStaticColor: !!staticColor
|
|
121
120
|
}), props.styles),
|
|
122
121
|
children: [
|
|
123
122
|
props.children,
|
|
124
123
|
(isRequired || necessityIndicator === 'label') && /*#__PURE__*/ (0, $7A6HT$jsxs)("span", {
|
|
125
|
-
className: " .
|
|
124
|
+
className: " . _qb",
|
|
126
125
|
children: [
|
|
127
126
|
"\xa0",
|
|
128
127
|
necessityIndicator === 'icon' && /*#__PURE__*/ (0, $7A6HT$jsx)((0, $8373af657584cab2$export$2e2bcd8739ae039), {
|
|
@@ -141,78 +140,83 @@ function $9afd80978c252040$var$FieldLabel(props, ref) {
|
|
|
141
140
|
})
|
|
142
141
|
]
|
|
143
142
|
}),
|
|
144
|
-
contextualHelp && /*#__PURE__*/ (0, $7A6HT$
|
|
145
|
-
|
|
146
|
-
children:
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
143
|
+
contextualHelp && /*#__PURE__*/ (0, $7A6HT$jsxs)("span", {
|
|
144
|
+
className: " . _qb",
|
|
145
|
+
children: [
|
|
146
|
+
"\xa0",
|
|
147
|
+
/*#__PURE__*/ (0, $7A6HT$jsx)((0, $1f4b04be3f24aae3$export$768dac55bb57081d), {
|
|
148
|
+
styles: " . _0e ko",
|
|
149
|
+
children: /*#__PURE__*/ (0, $7A6HT$jsx)((0, $8e176595bc49ca3f$export$41b9afaaba473494).Provider, {
|
|
150
|
+
value: {
|
|
151
|
+
id: contextualHelpId,
|
|
152
|
+
'aria-labelledby': labelProps?.id ? `${labelProps.id} ${contextualHelpId}` : undefined,
|
|
153
|
+
size: size === 'L' || size === 'XL' ? 'S' : 'XS'
|
|
154
|
+
},
|
|
155
|
+
children: contextualHelp
|
|
156
|
+
})
|
|
157
|
+
})
|
|
158
|
+
]
|
|
154
159
|
})
|
|
155
160
|
]
|
|
156
161
|
});
|
|
157
|
-
}
|
|
158
|
-
let $9afd80978c252040$export$1acdcf5a973a8414 = /*#__PURE__*/ (0, $7A6HT$forwardRef)($9afd80978c252040$var$FieldLabel);
|
|
162
|
+
});
|
|
159
163
|
const $9afd80978c252040$var$fieldGroupStyles = function anonymous(props) {
|
|
160
164
|
let rules = " .";
|
|
161
|
-
if (props.isFocusVisible) rules += '
|
|
162
|
-
else rules += '
|
|
163
|
-
rules += '
|
|
165
|
+
if (props.isFocusVisible) rules += ' _Mb';
|
|
166
|
+
else rules += ' _Ma';
|
|
167
|
+
rules += ' da_____M';
|
|
164
168
|
rules += ' dx';
|
|
165
|
-
rules += '
|
|
166
|
-
rules += '
|
|
167
|
-
rules += '
|
|
168
|
-
rules += '
|
|
169
|
-
rules += '
|
|
170
|
-
rules += '
|
|
169
|
+
rules += ' _Oc';
|
|
170
|
+
rules += ' _N-3t1z';
|
|
171
|
+
rules += ' __b-g2ozi1';
|
|
172
|
+
rules += ' __c-g2ozi1';
|
|
173
|
+
rules += ' __d-g2ozi1';
|
|
174
|
+
rules += ' __e-g2ozi1';
|
|
171
175
|
if (props.size === "XL") rules += ' qj';
|
|
172
176
|
else if (props.size === "L") rules += ' qi';
|
|
173
177
|
else if (props.size === "S") rules += ' qh';
|
|
174
178
|
else if (props.size === "XS") rules += ' qg';
|
|
175
179
|
else rules += ' qf';
|
|
176
|
-
if (props.isQuiet) rules += '
|
|
177
|
-
else rules += '
|
|
180
|
+
if (props.isQuiet) rules += ' __na';
|
|
181
|
+
else rules += ' __n-1s8glxue';
|
|
178
182
|
if (props.size === "XL") rules += ' -usygro_l-____g';
|
|
179
183
|
else if (props.size === "L") rules += ' -usygro_l-___0';
|
|
180
184
|
else if (props.size === "S") rules += ' -usygro_l-___u';
|
|
181
185
|
else rules += ' -usygro_l-___K';
|
|
182
186
|
rules += ' m-rwozxi';
|
|
183
|
-
rules += '
|
|
184
|
-
rules += '
|
|
187
|
+
rules += ' _0d';
|
|
188
|
+
rules += ' _2c';
|
|
185
189
|
rules += ' k-375toq';
|
|
186
|
-
rules += '
|
|
190
|
+
rules += ' __oa';
|
|
187
191
|
rules += ' C-375tnm';
|
|
188
192
|
rules += ' D-375tnn';
|
|
189
|
-
rules += '
|
|
190
|
-
rules += '
|
|
191
|
-
rules += '
|
|
192
|
-
rules += '
|
|
193
|
-
rules += '
|
|
194
|
-
rules += '
|
|
195
|
-
rules += '
|
|
196
|
-
rules += '
|
|
193
|
+
rules += ' _d-bc1l9oh';
|
|
194
|
+
rules += ' _d-1uotwbwg';
|
|
195
|
+
rules += ' _d-eo0c6sf';
|
|
196
|
+
rules += ' _d-enzzrge';
|
|
197
|
+
rules += ' _d-enzykdd';
|
|
198
|
+
rules += ' _d-enzwzjc';
|
|
199
|
+
rules += ' _d-enzrfpb';
|
|
200
|
+
rules += ' _da';
|
|
197
201
|
if (props.size === "XL") {
|
|
198
|
-
rules += '
|
|
199
|
-
rules += '
|
|
202
|
+
rules += ' _ebj';
|
|
203
|
+
rules += ' _ei';
|
|
200
204
|
} else if (props.size === "L") {
|
|
201
|
-
rules += '
|
|
202
|
-
rules += '
|
|
205
|
+
rules += ' _ebh';
|
|
206
|
+
rules += ' _eg';
|
|
203
207
|
} else if (props.size === "S") {
|
|
204
|
-
rules += '
|
|
205
|
-
rules += '
|
|
208
|
+
rules += ' _ebd';
|
|
209
|
+
rules += ' _ec';
|
|
206
210
|
} else if (props.size === "XS") {
|
|
207
|
-
rules += '
|
|
208
|
-
rules += '
|
|
211
|
+
rules += ' _ebb';
|
|
212
|
+
rules += ' _ea';
|
|
209
213
|
} else {
|
|
210
|
-
rules += '
|
|
211
|
-
rules += '
|
|
214
|
+
rules += ' _ebf';
|
|
215
|
+
rules += ' _ee';
|
|
212
216
|
}
|
|
213
|
-
rules += '
|
|
214
|
-
rules += '
|
|
215
|
-
rules += '
|
|
217
|
+
rules += ' _fb';
|
|
218
|
+
rules += ' _g-1x99dlob';
|
|
219
|
+
rules += ' _ga';
|
|
216
220
|
if (props.isDisabled) rules += ' aj';
|
|
217
221
|
else {
|
|
218
222
|
if (props.isPressed) rules += ' ao';
|
|
@@ -220,23 +224,23 @@ const $9afd80978c252040$var$fieldGroupStyles = function anonymous(props) {
|
|
|
220
224
|
else if (props.isHovered) rules += ' ao';
|
|
221
225
|
else rules += ' an';
|
|
222
226
|
}
|
|
223
|
-
rules += ' _vh';
|
|
224
227
|
rules += ' _wh';
|
|
225
228
|
rules += ' _xh';
|
|
226
229
|
rules += ' _yh';
|
|
230
|
+
rules += ' _zh';
|
|
227
231
|
rules += ' uc';
|
|
228
232
|
rules += ' vc';
|
|
229
233
|
rules += ' s-375toy';
|
|
230
234
|
rules += ' t-375toz';
|
|
231
235
|
rules += ' wa';
|
|
232
|
-
rules += '
|
|
233
|
-
rules += '
|
|
234
|
-
rules += '
|
|
236
|
+
rules += ' _Pa';
|
|
237
|
+
rules += ' _R-375x7f';
|
|
238
|
+
rules += ' _Sa';
|
|
235
239
|
if (props.isDisabled) {
|
|
236
|
-
rules += '
|
|
240
|
+
rules += ' ca_____O';
|
|
237
241
|
rules += ' ci';
|
|
238
242
|
} else if (props.isFocusWithin) {
|
|
239
|
-
rules += '
|
|
243
|
+
rules += ' ca_____M';
|
|
240
244
|
if (props.isInvalid) rules += ' cP';
|
|
241
245
|
else rules += ' co';
|
|
242
246
|
} else if (props.isInvalid) {
|
|
@@ -251,8 +255,8 @@ const $9afd80978c252040$var$fieldGroupStyles = function anonymous(props) {
|
|
|
251
255
|
else rules += ' ci';
|
|
252
256
|
}
|
|
253
257
|
rules += ' bd';
|
|
254
|
-
if (props.isDisabled) rules += '
|
|
255
|
-
else rules += '
|
|
258
|
+
if (props.isDisabled) rules += ' __Ib';
|
|
259
|
+
else rules += ' __Ie';
|
|
256
260
|
rules += ' -_375tnm_C-I';
|
|
257
261
|
rules += ' -_375tnn_D-I';
|
|
258
262
|
rules += ' -_375toy_s-c';
|
|
@@ -264,7 +268,7 @@ const $9afd80978c252040$var$fieldGroupStyles = function anonymous(props) {
|
|
|
264
268
|
else rules += ' -_375toq_k-f';
|
|
265
269
|
return rules;
|
|
266
270
|
};
|
|
267
|
-
|
|
271
|
+
const $9afd80978c252040$export$f0fe469072bc6950 = /*#__PURE__*/ (0, $7A6HT$forwardRef)(function FieldGroup(props, ref) {
|
|
268
272
|
return /*#__PURE__*/ (0, $7A6HT$jsx)((0, $7A6HT$Group), {
|
|
269
273
|
ref: ref,
|
|
270
274
|
...props,
|
|
@@ -287,57 +291,55 @@ function $9afd80978c252040$var$FieldGroup(props, ref) {
|
|
|
287
291
|
size: props.size || 'M'
|
|
288
292
|
}), props.styles)
|
|
289
293
|
});
|
|
290
|
-
}
|
|
291
|
-
|
|
292
|
-
function $9afd80978c252040$var$Input(props, ref) {
|
|
294
|
+
});
|
|
295
|
+
const $9afd80978c252040$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $7A6HT$forwardRef)(function Input(props, ref) {
|
|
293
296
|
let { UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, styles: styles, ...otherProps } = props;
|
|
294
297
|
return /*#__PURE__*/ (0, $7A6HT$jsx)((0, $7A6HT$Input), {
|
|
295
298
|
...otherProps,
|
|
296
299
|
ref: ref,
|
|
297
300
|
style: UNSAFE_style,
|
|
298
|
-
className: UNSAFE_className + (0, $feb886035e0d4633$export$e618dc39ac9ad607)(" . Ea Fa Ca Da ba a-17zqamw
|
|
301
|
+
className: UNSAFE_className + (0, $feb886035e0d4633$export$e618dc39ac9ad607)(" . Ea Fa Ca Da ba a-17zqamw _d-17zqamw _e-17zqamw _f-17zqamw __a-3t1y _9-3t1y qo lb _Ma wf __wb __xb _na _qb", styles)
|
|
299
302
|
});
|
|
300
|
-
}
|
|
301
|
-
let $9afd80978c252040$export$f5b8910cec6cf069 = /*#__PURE__*/ (0, $7A6HT$forwardRef)($9afd80978c252040$var$Input);
|
|
303
|
+
});
|
|
302
304
|
const $9afd80978c252040$var$helpTextStyles = function anonymous(props) {
|
|
303
305
|
let rules = " .";
|
|
304
|
-
rules += '
|
|
305
|
-
rules += '
|
|
306
|
-
rules += '
|
|
307
|
-
rules += '
|
|
308
|
-
rules += '
|
|
309
|
-
rules += '
|
|
306
|
+
rules += ' __b-1le9d6f';
|
|
307
|
+
rules += ' __c-1le9d6f';
|
|
308
|
+
rules += ' __d-1le9d6f';
|
|
309
|
+
rules += ' __e-1le9d6f';
|
|
310
|
+
rules += ' _0d';
|
|
311
|
+
rules += ' _2d';
|
|
310
312
|
rules += ' ibH';
|
|
311
313
|
rules += ' iG';
|
|
312
314
|
rules += ' jbH';
|
|
313
315
|
rules += ' jG';
|
|
314
|
-
rules += '
|
|
315
|
-
rules += '
|
|
316
|
-
rules += '
|
|
317
|
-
rules += '
|
|
318
|
-
rules += '
|
|
319
|
-
rules += '
|
|
320
|
-
rules += '
|
|
321
|
-
rules += '
|
|
316
|
+
rules += ' _d-bc1l9oh';
|
|
317
|
+
rules += ' _d-1uotwbwg';
|
|
318
|
+
rules += ' _d-eo0c6sf';
|
|
319
|
+
rules += ' _d-enzzrge';
|
|
320
|
+
rules += ' _d-enzykdd';
|
|
321
|
+
rules += ' _d-enzwzjc';
|
|
322
|
+
rules += ' _d-enzrfpb';
|
|
323
|
+
rules += ' _da';
|
|
322
324
|
if (props.size === "XL") {
|
|
323
|
-
rules += '
|
|
324
|
-
rules += '
|
|
325
|
+
rules += ' _ebj';
|
|
326
|
+
rules += ' _ei';
|
|
325
327
|
} else if (props.size === "L") {
|
|
326
|
-
rules += '
|
|
327
|
-
rules += '
|
|
328
|
+
rules += ' _ebh';
|
|
329
|
+
rules += ' _eg';
|
|
328
330
|
} else if (props.size === "S") {
|
|
329
|
-
rules += '
|
|
330
|
-
rules += '
|
|
331
|
+
rules += ' _ebd';
|
|
332
|
+
rules += ' _ec';
|
|
331
333
|
} else if (props.size === "XS") {
|
|
332
|
-
rules += '
|
|
333
|
-
rules += '
|
|
334
|
+
rules += ' _ebb';
|
|
335
|
+
rules += ' _ea';
|
|
334
336
|
} else {
|
|
335
|
-
rules += '
|
|
336
|
-
rules += '
|
|
337
|
+
rules += ' _ebf';
|
|
338
|
+
rules += ' _ee';
|
|
337
339
|
}
|
|
338
|
-
rules += '
|
|
339
|
-
rules += '
|
|
340
|
-
rules += '
|
|
340
|
+
rules += ' _fb';
|
|
341
|
+
rules += ' _g-1x99dlob';
|
|
342
|
+
rules += ' _ga';
|
|
341
343
|
if (props.isDisabled) rules += ' aj';
|
|
342
344
|
else if (props.isInvalid) {
|
|
343
345
|
if (props.isPressed) rules += ' aP';
|
|
@@ -351,10 +353,10 @@ const $9afd80978c252040$var$helpTextStyles = function anonymous(props) {
|
|
|
351
353
|
else rules += ' am';
|
|
352
354
|
}
|
|
353
355
|
rules += ' -rwx0fg_e-b';
|
|
354
|
-
rules += '
|
|
356
|
+
rules += ' __ne';
|
|
355
357
|
rules += ' E-1inj1bc';
|
|
356
|
-
if (props.isDisabled) rules += '
|
|
357
|
-
else rules += '
|
|
358
|
+
if (props.isDisabled) rules += ' __Ib';
|
|
359
|
+
else rules += ' __Ie';
|
|
358
360
|
return rules;
|
|
359
361
|
};
|
|
360
362
|
function $9afd80978c252040$export$a67c0bc59081311a(props) {
|
|
@@ -397,9 +399,9 @@ function $9afd80978c252040$export$bda0d075e0e342c9(props) {
|
|
|
397
399
|
{
|
|
398
400
|
render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
|
|
399
401
|
slot: 'icon',
|
|
400
|
-
styles: " .
|
|
402
|
+
styles: " . __B-3t1x _9-3t1x -rwx0fg_e-e -rwx0fg_e-a_____8"
|
|
401
403
|
}),
|
|
402
|
-
styles: " . l-1sthc3k k-1sthc3k yG ybH z-177861o
|
|
404
|
+
styles: " . l-1sthc3k k-1sthc3k yG ybH z-177861o _9-3t1x"
|
|
403
405
|
}
|
|
404
406
|
]
|
|
405
407
|
],
|
package/dist/Field.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Field.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 AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Alignment, DOMRef, NecessityIndicator} from '@react-types/shared';\nimport AsteriskIcon from '../ui-icons/Asterisk';\nimport {baseColor, focusRing, fontRelative, style} from '../style' with {type: 'macro'};\nimport {CenterBaseline, centerBaseline, centerBaselineBefore} from './CenterBaseline';\nimport {composeRenderProps, FieldError, FieldErrorProps, Group, GroupProps, Label, LabelProps, Provider, Input as RACInput, InputProps as RACInputProps, Text} from 'react-aria-components';\nimport {ContextualHelpContext} from './ContextualHelp';\nimport {fieldInput, fieldLabel, StyleProps, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {StyleString} from '../style/types';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useId} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\ninterface FieldLabelProps extends Omit<LabelProps, 'className' | 'style' | 'children'>, StyleProps {\n isDisabled?: boolean,\n isRequired?: boolean,\n size?: 'S' | 'M' | 'L' | 'XL',\n necessityIndicator?: NecessityIndicator,\n labelAlign?: Alignment,\n labelPosition?: 'top' | 'side',\n includeNecessityIndicatorInAccessibilityName?: boolean,\n staticColor?: 'white' | 'black',\n contextualHelp?: ReactNode,\n isQuiet?: boolean,\n children?: ReactNode\n}\n\nfunction FieldLabel(props: FieldLabelProps, ref: DOMRef<HTMLLabelElement>) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n isDisabled,\n isRequired,\n size = 'M',\n necessityIndicator = 'icon',\n includeNecessityIndicatorInAccessibilityName = false,\n labelAlign,\n labelPosition,\n staticColor,\n contextualHelp,\n isQuiet,\n UNSAFE_style,\n UNSAFE_className = '',\n ...labelProps\n } = props;\n\n let domRef = useDOMRef(ref);\n let contextualHelpId = useId();\n let fallbackLabelPropsId = useId();\n if (contextualHelp && !labelProps.id) {\n labelProps.id = fallbackLabelPropsId;\n }\n\n if (!props.children) {\n return null;\n }\n\n return (\n <div\n className={style({\n gridArea: 'label',\n display: 'inline',\n textAlign: {\n labelAlign: {\n start: 'start',\n end: 'end'\n }\n },\n paddingBottom: {\n labelPosition: {\n top: '--field-gap'\n }\n },\n contain: {\n labelPosition: {\n top: 'inline-size'\n },\n isQuiet: 'none'\n }\n })({labelAlign, labelPosition, isQuiet})}>\n <Label\n {...labelProps}\n ref={domRef}\n style={UNSAFE_style}\n className={UNSAFE_className + mergeStyles(style(fieldLabel())({labelPosition, isDisabled, size, staticColor}), props.styles)}>\n {props.children}\n {(isRequired || necessityIndicator === 'label') && (\n <span className={style({whiteSpace: 'nowrap'})}>\n \n {necessityIndicator === 'icon' &&\n <AsteriskIcon\n size={size === 'S' ? 'M' : size}\n className={style({\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n })}\n aria-label={includeNecessityIndicatorInAccessibilityName ? stringFormatter.format('label.(required)') : undefined} />\n }\n {necessityIndicator === 'label' &&\n /* The necessity label is hidden to screen readers if the field is required because\n * aria-required is set on the field in that case. That will already be announced,\n * so no need to duplicate it here. If optional, we do want it to be announced here.\n */\n <span aria-hidden={!includeNecessityIndicatorInAccessibilityName ? isRequired : undefined}>\n {isRequired ? stringFormatter.format('label.(required)') : stringFormatter.format('label.(optional)')}\n </span>\n }\n </span>\n )}\n </Label>\n {contextualHelp && (\n <CenterBaseline\n styles={style({\n display: 'inline-flex',\n height: 0,\n marginStart: 4\n })}>\n <ContextualHelpContext.Provider\n value={{\n id: contextualHelpId,\n 'aria-labelledby': labelProps?.id ? `${labelProps.id} ${contextualHelpId}` : undefined,\n size: (size === 'L' || size === 'XL') ? 'S' : 'XS'\n }}>\n {contextualHelp}\n </ContextualHelpContext.Provider>\n </CenterBaseline>\n )}\n </div>\n );\n}\n\nlet _FieldLabel = forwardRef(FieldLabel);\nexport {_FieldLabel as FieldLabel};\n\ninterface FieldGroupProps extends Omit<GroupProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n size?: 'S' | 'M' | 'L' | 'XL',\n children?: ReactNode,\n styles?: StyleString\n}\n\nconst fieldGroupStyles = style({\n ...focusRing(),\n ...fieldInput(),\n display: 'flex',\n alignItems: 'center',\n height: 'control',\n boxSizing: 'border-box',\n paddingX: 'edge-to-text',\n font: 'control',\n borderRadius: 'control',\n borderWidth: 2,\n borderStyle: 'solid',\n transition: 'default',\n borderColor: {\n default: baseColor('gray-300'),\n isInvalid: 'negative',\n isFocusWithin: {\n default: 'gray-900',\n isInvalid: 'negative-1000',\n forcedColors: 'Highlight'\n },\n isDisabled: {\n default: 'disabled',\n forcedColors: 'GrayText'\n }\n },\n backgroundColor: 'gray-25',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n cursor: {\n default: 'text',\n isDisabled: 'default'\n }\n});\n\nfunction FieldGroup(props: FieldGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n return (\n <Group\n ref={ref}\n {...props}\n onPointerDown={(e) => {\n // Forward focus to input element when clicking on a non-interactive child (e.g. icon or padding)\n if (e.pointerType === 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n e.preventDefault();\n e.currentTarget.querySelector('input')?.focus();\n }\n }}\n onPointerUp={e => {\n if (e.pointerType !== 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n e.preventDefault();\n e.currentTarget.querySelector('input')?.focus();\n }\n }}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + ' ' + centerBaselineBefore + mergeStyles(\n fieldGroupStyles({...renderProps, size: props.size || 'M'}),\n props.styles\n )} />\n );\n}\n\nlet _FieldGroup = forwardRef(FieldGroup);\nexport {_FieldGroup as FieldGroup};\n\nexport interface InputProps extends Omit<RACInputProps, 'className' | 'style'>, StyleProps {}\n\nfunction Input(props: InputProps, ref: ForwardedRef<HTMLInputElement>) {\n let {UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n return (\n <RACInput\n {...otherProps}\n ref={ref}\n style={UNSAFE_style}\n className={UNSAFE_className + mergeStyles(style({\n padding: 0,\n backgroundColor: 'transparent',\n color: '[inherit]',\n fontFamily: '[inherit]',\n fontSize: '[inherit]',\n fontWeight: '[inherit]',\n flexGrow: 1,\n flexShrink: 1,\n minWidth: 0,\n width: 'full',\n outlineStyle: 'none',\n borderStyle: 'none',\n truncate: true\n }), styles)} />\n );\n}\n\nlet _Input = forwardRef(Input);\nexport {_Input as Input};\n\ninterface HelpTextProps extends FieldErrorProps {\n size?: 'S' | 'M' | 'L' | 'XL',\n isDisabled?: boolean,\n isInvalid?: boolean, // TODO: export FieldErrorContext from RAC to get this.\n description?: ReactNode,\n showErrorIcon?: boolean\n}\n\nconst helpTextStyles = style({\n gridArea: 'helptext',\n display: 'flex',\n alignItems: 'baseline',\n gap: 'text-to-visual',\n font: 'control',\n color: {\n default: 'neutral-subdued',\n isInvalid: 'negative',\n isDisabled: 'disabled'\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n contain: 'inline-size',\n paddingTop: '--field-gap',\n cursor: {\n default: 'text',\n isDisabled: 'default'\n }\n});\n\nexport function HelpText(props: HelpTextProps & {descriptionRef?: DOMRef<HTMLDivElement>, errorRef?: DOMRef<HTMLDivElement>}) {\n let domDescriptionRef = useDOMRef(props.descriptionRef || null);\n let domErrorRef = useDOMRef(props.errorRef || null);\n\n if (!props.isInvalid && props.description) {\n return (\n <Text\n slot=\"description\"\n ref={domDescriptionRef}\n className={helpTextStyles({size: props.size || 'M', isDisabled: props.isDisabled})}>\n {props.description}\n </Text>\n );\n }\n\n return (\n <FieldError\n {...props}\n ref={domErrorRef}\n className={renderProps => helpTextStyles({...renderProps, size: props.size || 'M', isDisabled: props.isDisabled})}>\n {composeRenderProps(props.children, (children, {validationErrors}) => (<>\n {props.showErrorIcon &&\n <CenterBaseline>\n <AlertIcon />\n </CenterBaseline>\n }\n <span>{children || validationErrors.join(' ')}</span>\n </>))}\n </FieldError>\n );\n}\n\nexport function FieldErrorIcon(props: {isDisabled?: boolean}) {\n return (\n <Provider\n values={[\n [IconContext, {\n render: centerBaseline({\n slot: 'icon',\n styles: style({\n order: 0,\n flexShrink: 0,\n '--iconPrimary': {\n type: 'fill',\n value: {\n default: 'negative',\n forcedColors: 'ButtonText'\n }\n }\n })}),\n styles: style({\n size: fontRelative(20),\n marginStart: 'text-to-visual',\n marginEnd: fontRelative(-2),\n flexShrink: 0\n })\n }]\n ]}>\n {!props.isDisabled && <AlertIcon />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"Field.mjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Field.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 AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Alignment, DOMRef, NecessityIndicator} from '@react-types/shared';\nimport AsteriskIcon from '../ui-icons/Asterisk';\nimport {baseColor, focusRing, fontRelative, style} from '../style' with {type: 'macro'};\nimport {CenterBaseline, centerBaseline, centerBaselineBefore} from './CenterBaseline';\nimport {composeRenderProps, FieldError, FieldErrorProps, Group, GroupProps, Label, LabelProps, Provider, Input as RACInput, InputProps as RACInputProps, Text} from 'react-aria-components';\nimport {ContextualHelpContext} from './ContextualHelp';\nimport {fieldInput, fieldLabel, StyleProps, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ForwardedRef, forwardRef, ReactNode} from 'react';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {StyleString} from '../style/types';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useId} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\n\ninterface FieldLabelProps extends Omit<LabelProps, 'className' | 'style' | 'children'>, StyleProps {\n isDisabled?: boolean,\n isRequired?: boolean,\n size?: 'S' | 'M' | 'L' | 'XL',\n necessityIndicator?: NecessityIndicator,\n labelAlign?: Alignment,\n labelPosition?: 'top' | 'side',\n includeNecessityIndicatorInAccessibilityName?: boolean,\n staticColor?: 'white' | 'black' | 'auto',\n contextualHelp?: ReactNode,\n isQuiet?: boolean,\n children?: ReactNode\n}\n\nexport const FieldLabel = forwardRef(function FieldLabel(props: FieldLabelProps, ref: DOMRef<HTMLLabelElement>) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {\n isDisabled,\n isRequired,\n size = 'M',\n necessityIndicator = 'icon',\n includeNecessityIndicatorInAccessibilityName = false,\n labelAlign,\n labelPosition,\n staticColor,\n contextualHelp,\n isQuiet,\n UNSAFE_style,\n UNSAFE_className = '',\n ...labelProps\n } = props;\n\n let domRef = useDOMRef(ref);\n let contextualHelpId = useId();\n let fallbackLabelPropsId = useId();\n if (contextualHelp && !labelProps.id) {\n labelProps.id = fallbackLabelPropsId;\n }\n\n if (!props.children) {\n return null;\n }\n\n return (\n <div\n className={style({\n gridArea: 'label',\n display: 'inline',\n textAlign: {\n labelAlign: {\n start: 'start',\n end: 'end'\n }\n },\n paddingBottom: {\n labelPosition: {\n top: '--field-gap'\n }\n },\n contain: {\n labelPosition: {\n top: 'inline-size'\n },\n isQuiet: 'none'\n }\n })({labelAlign, labelPosition, isQuiet})}>\n <Label\n {...labelProps}\n ref={domRef}\n style={UNSAFE_style}\n className={UNSAFE_className + mergeStyles(style(fieldLabel())({labelPosition, isDisabled, size, isStaticColor: !!staticColor}), props.styles)}>\n {props.children}\n {(isRequired || necessityIndicator === 'label') && (\n <span className={style({whiteSpace: 'nowrap'})}>\n \n {necessityIndicator === 'icon' &&\n <AsteriskIcon\n size={size === 'S' ? 'M' : size}\n className={style({\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n })}\n aria-label={includeNecessityIndicatorInAccessibilityName ? stringFormatter.format('label.(required)') : undefined} />\n }\n {necessityIndicator === 'label' &&\n /* The necessity label is hidden to screen readers if the field is required because\n * aria-required is set on the field in that case. That will already be announced,\n * so no need to duplicate it here. If optional, we do want it to be announced here.\n */\n <span aria-hidden={!includeNecessityIndicatorInAccessibilityName ? isRequired : undefined}>\n {isRequired ? stringFormatter.format('label.(required)') : stringFormatter.format('label.(optional)')}\n </span>\n }\n </span>\n )}\n </Label>\n {contextualHelp && (\n <span className={style({whiteSpace: 'nowrap'})}>\n \n <CenterBaseline\n styles={style({\n display: 'inline-flex',\n height: 0\n })}>\n <ContextualHelpContext.Provider\n value={{\n id: contextualHelpId,\n 'aria-labelledby': labelProps?.id ? `${labelProps.id} ${contextualHelpId}` : undefined,\n size: (size === 'L' || size === 'XL') ? 'S' : 'XS'\n }}>\n {contextualHelp}\n </ContextualHelpContext.Provider>\n </CenterBaseline>\n </span>\n )}\n </div>\n );\n});\n\ninterface FieldGroupProps extends Omit<GroupProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n size?: 'S' | 'M' | 'L' | 'XL',\n children?: ReactNode,\n styles?: StyleString\n}\n\nconst fieldGroupStyles = style({\n ...focusRing(),\n ...fieldInput(),\n display: 'flex',\n alignItems: 'center',\n height: 'control',\n boxSizing: 'border-box',\n paddingX: 'edge-to-text',\n font: 'control',\n borderRadius: 'control',\n borderWidth: 2,\n borderStyle: 'solid',\n transition: 'default',\n borderColor: {\n default: baseColor('gray-300'),\n isInvalid: 'negative',\n isFocusWithin: {\n default: 'gray-900',\n isInvalid: 'negative-1000',\n forcedColors: 'Highlight'\n },\n isDisabled: {\n default: 'disabled',\n forcedColors: 'GrayText'\n }\n },\n backgroundColor: 'gray-25',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n cursor: {\n default: 'text',\n isDisabled: 'default'\n }\n});\n\nexport const FieldGroup = forwardRef(function FieldGroup(props: FieldGroupProps, ref: ForwardedRef<HTMLDivElement>) {\n return (\n <Group\n ref={ref}\n {...props}\n onPointerDown={(e) => {\n // Forward focus to input element when clicking on a non-interactive child (e.g. icon or padding)\n if (e.pointerType === 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n e.preventDefault();\n e.currentTarget.querySelector('input')?.focus();\n }\n }}\n onPointerUp={e => {\n if (e.pointerType !== 'mouse' && !(e.target as Element).closest('button,input,textarea')) {\n e.preventDefault();\n e.currentTarget.querySelector('input')?.focus();\n }\n }}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + ' ' + centerBaselineBefore + mergeStyles(\n fieldGroupStyles({...renderProps, size: props.size || 'M'}),\n props.styles\n )} />\n );\n});\n\nexport interface InputProps extends Omit<RACInputProps, 'className' | 'style'>, StyleProps {}\n\nexport const Input = forwardRef(function Input(props: InputProps, ref: ForwardedRef<HTMLInputElement>) {\n let {UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n return (\n <RACInput\n {...otherProps}\n ref={ref}\n style={UNSAFE_style}\n className={UNSAFE_className + mergeStyles(style({\n padding: 0,\n backgroundColor: 'transparent',\n color: '[inherit]',\n fontFamily: '[inherit]',\n fontSize: '[inherit]',\n fontWeight: '[inherit]',\n flexGrow: 1,\n flexShrink: 1,\n minWidth: 0,\n width: 'full',\n outlineStyle: 'none',\n borderStyle: 'none',\n truncate: true\n }), styles)} />\n );\n});\n\ninterface HelpTextProps extends FieldErrorProps {\n size?: 'S' | 'M' | 'L' | 'XL',\n isDisabled?: boolean,\n isInvalid?: boolean, // TODO: export FieldErrorContext from RAC to get this.\n description?: ReactNode,\n showErrorIcon?: boolean\n}\n\nconst helpTextStyles = style({\n gridArea: 'helptext',\n display: 'flex',\n alignItems: 'baseline',\n gap: 'text-to-visual',\n font: 'control',\n color: {\n default: 'neutral-subdued',\n isInvalid: 'negative',\n isDisabled: 'disabled'\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n contain: 'inline-size',\n paddingTop: '--field-gap',\n cursor: {\n default: 'text',\n isDisabled: 'default'\n }\n});\n\nexport function HelpText(props: HelpTextProps & {descriptionRef?: DOMRef<HTMLDivElement>, errorRef?: DOMRef<HTMLDivElement>}) {\n let domDescriptionRef = useDOMRef(props.descriptionRef || null);\n let domErrorRef = useDOMRef(props.errorRef || null);\n\n if (!props.isInvalid && props.description) {\n return (\n <Text\n slot=\"description\"\n ref={domDescriptionRef}\n className={helpTextStyles({size: props.size || 'M', isDisabled: props.isDisabled})}>\n {props.description}\n </Text>\n );\n }\n\n return (\n <FieldError\n {...props}\n ref={domErrorRef}\n className={renderProps => helpTextStyles({...renderProps, size: props.size || 'M', isDisabled: props.isDisabled})}>\n {composeRenderProps(props.children, (children, {validationErrors}) => (<>\n {props.showErrorIcon &&\n <CenterBaseline>\n <AlertIcon />\n </CenterBaseline>\n }\n <span>{children || validationErrors.join(' ')}</span>\n </>))}\n </FieldError>\n );\n}\n\nexport function FieldErrorIcon(props: {isDisabled?: boolean}) {\n return (\n <Provider\n values={[\n [IconContext, {\n render: centerBaseline({\n slot: 'icon',\n styles: style({\n order: 0,\n flexShrink: 0,\n '--iconPrimary': {\n type: 'fill',\n value: {\n default: 'negative',\n forcedColors: 'ButtonText'\n }\n }\n })}),\n styles: style({\n size: fontRelative(20),\n marginStart: 'text-to-visual',\n marginEnd: fontRelative(-2),\n flexShrink: 0\n })\n }]\n ]}>\n {!props.isDisabled && <AlertIcon />}\n </Provider>\n );\n}\n"],"names":[],"version":3,"file":"Field.mjs.map"}
|
package/dist/Form.cjs
CHANGED
|
@@ -50,7 +50,7 @@ function $bfa4962d90c8af48$export$a6b5be5c6b451665(props) {
|
|
|
50
50
|
isSkeleton
|
|
51
51
|
]);
|
|
52
52
|
}
|
|
53
|
-
|
|
53
|
+
const $bfa4962d90c8af48$export$a7fed597f4b8afd8 = /*#__PURE__*/ (0, $hYK64$react.forwardRef)(function Form(props, ref) {
|
|
54
54
|
let { labelPosition: labelPosition = 'top', labelAlign: labelAlign, necessityIndicator: necessityIndicator, isRequired: isRequired, isDisabled: isDisabled, isEmphasized: isEmphasized, size: size = 'M', ...formProps } = props;
|
|
55
55
|
let domRef = (0, $hYK64$reactspectrumutils.useDOMRef)(ref);
|
|
56
56
|
return /*#__PURE__*/ (0, $hYK64$reactjsxruntime.jsx)((0, $hYK64$reactariacomponents.Form), {
|
|
@@ -59,11 +59,11 @@ function $bfa4962d90c8af48$var$Form(props, ref) {
|
|
|
59
59
|
style: props.UNSAFE_style,
|
|
60
60
|
className: (props.UNSAFE_className || '') + function anonymous(props, overrides) {
|
|
61
61
|
let rules = " .";
|
|
62
|
-
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|
|
|
62
|
+
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r)[^\s]+/g) || [];
|
|
63
63
|
rules += matches.join('');
|
|
64
|
-
rules += '
|
|
65
|
-
if (props.labelPosition === "side") rules += '
|
|
66
|
-
else if (props.labelPosition === "top") rules += '
|
|
64
|
+
rules += ' _0f';
|
|
65
|
+
if (props.labelPosition === "side") rules += ' __i-1owsa0z';
|
|
66
|
+
else if (props.labelPosition === "top") rules += ' __i-1ev27ke';
|
|
67
67
|
if (props.size === "XL") rules += ' il';
|
|
68
68
|
else if (props.size === "L") rules += ' ij';
|
|
69
69
|
else if (props.size === "M") rules += ' ih';
|
|
@@ -88,10 +88,7 @@ function $bfa4962d90c8af48$var$Form(props, ref) {
|
|
|
88
88
|
children: props.children
|
|
89
89
|
})
|
|
90
90
|
});
|
|
91
|
-
}
|
|
92
|
-
/**
|
|
93
|
-
* Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.
|
|
94
|
-
*/ let $bfa4962d90c8af48$export$a7fed597f4b8afd8 = /*#__PURE__*/ (0, $hYK64$react.forwardRef)($bfa4962d90c8af48$var$Form);
|
|
91
|
+
});
|
|
95
92
|
|
|
96
93
|
|
|
97
94
|
//# sourceMappingURL=Form.cjs.map
|
package/dist/Form.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0BM,MAAM,0DAAc,CAAA,GAAA,0BAAY,EAAyB;AACzD,SAAS,0CAAuC,KAAQ;IAC7D,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,aAAa,CAAA,GAAA,uCAAY;IAC7B,OAAO,CAAA,GAAA,oBAAM,EAAE;QACb,IAAI,SAAY;QAChB,IAAI,OAAO,YACT,SAAS;YAAC,GAAG,KAAK;QAAA;QAGpB,IAAI,KAAK;YACP,8EAA8E;YAC9E,IAAK,IAAI,OAAO,IACd,IAAI,MAAM,CAAC,IAAI,KAAK,WAClB,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI;QAG5B;QAEA,yCAAyC;QACzC,IAAI,YACF,OAAO,UAAU,GAAG;QAGtB,OAAO;IACT,GAAG;QAAC;QAAK;QAAO;KAAW;AAC7B;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AA0BM,MAAM,0DAAc,CAAA,GAAA,0BAAY,EAAyB;AACzD,SAAS,0CAAuC,KAAQ;IAC7D,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,aAAa,CAAA,GAAA,uCAAY;IAC7B,OAAO,CAAA,GAAA,oBAAM,EAAE;QACb,IAAI,SAAY;QAChB,IAAI,OAAO,YACT,SAAS;YAAC,GAAG,KAAK;QAAA;QAGpB,IAAI,KAAK;YACP,8EAA8E;YAC9E,IAAK,IAAI,OAAO,IACd,IAAI,MAAM,CAAC,IAAI,KAAK,WAClB,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI;QAG5B;QAEA,yCAAyC;QACzC,IAAI,YACF,OAAO,UAAU,GAAG;QAGtB,OAAO;IACT,GAAG;QAAC;QAAK;QAAO;KAAW;AAC7B;AAKO,MAAM,4CAAO,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE,SAAS,KAAK,KAAgB,EAAE,GAA4B;IACvG,IAAI,iBACF,gBAAgB,mBAChB,UAAU,sBACV,kBAAkB,cAClB,UAAU,cACV,UAAU,gBACV,YAAY,QACZ,OAAO,KACP,GAAG,WACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,+BAAM;QACJ,GAAG,SAAS;QACb,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK;;;;;;;;;;;;;;UAmBlB;2BAAC;kBAAe;QAAI,GAAG,MAAM,MAAM;kBAC7D,cAAA,gCAAC,0CAAY,QAAQ;YACnB,OAAO;+BACL;4BACA;oCACA;4BACA;4BACA;8BACA;sBACA;YACF;sBACC,MAAM,QAAQ;;;AAIvB","sources":["packages/@react-spectrum/s2/src/Form.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 {createContext, forwardRef, ReactNode, useContext, useMemo} from 'react';\nimport {DOMRef, SpectrumLabelableProps} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {Form as RACForm, FormProps as RACFormProps} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton} from './Skeleton';\n\ninterface FormStyleProps extends Omit<SpectrumLabelableProps, 'label' | 'contextualHelp'> {\n /**\n * Size of the Form elements.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** Whether the Form elements are disabled. */\n isDisabled?: boolean,\n /** Whether the Form elements are rendered with their emphasized style. */\n isEmphasized?: boolean\n}\n\nexport interface FormProps extends FormStyleProps, Omit<RACFormProps, 'className' | 'style' | 'children'>, StyleProps {\n children?: ReactNode\n}\n\nexport const FormContext = createContext<FormStyleProps | null>(null);\nexport function useFormProps<T extends FormStyleProps>(props: T): T {\n let ctx = useContext(FormContext);\n let isSkeleton = useIsSkeleton();\n return useMemo(() => {\n let result: T = props;\n if (ctx || isSkeleton) {\n result = {...props};\n }\n\n if (ctx) {\n // This is a subset of mergeProps. We just need to merge non-undefined values.\n for (let key in ctx) {\n if (result[key] === undefined) {\n result[key] = ctx[key];\n }\n }\n }\n\n // Skeleton always wins over local props.\n if (isSkeleton) {\n result.isDisabled = true;\n }\n\n return result;\n }, [ctx, props, isSkeleton]);\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nexport const Form = /*#__PURE__*/ forwardRef(function Form(props: FormProps, ref: DOMRef<HTMLFormElement>) {\n let {\n labelPosition = 'top',\n labelAlign,\n necessityIndicator,\n isRequired,\n isDisabled,\n isEmphasized,\n size = 'M',\n ...formProps\n } = props;\n let domRef = useDOMRef(ref);\n\n return (\n <RACForm\n {...formProps}\n ref={domRef}\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + style({\n display: 'grid',\n gridTemplateColumns: {\n labelPosition: {\n top: ['[field] 1fr'],\n side: ['[label] auto', '[field] 1fr']\n }\n },\n // TODO: confirm when we have tokens\n rowGap: {\n size: {\n XS: 16,\n S: 20,\n M: 24,\n L: 32,\n XL: 40\n }\n },\n columnGap: 'text-to-control'\n }, getAllowedOverrides())({labelPosition, size}, props.styles)}>\n <FormContext.Provider\n value={{\n labelPosition,\n labelAlign,\n necessityIndicator,\n isRequired,\n isDisabled,\n isEmphasized,\n size\n }}>\n {props.children}\n </FormContext.Provider>\n </RACForm>\n );\n});\n"],"names":[],"version":3,"file":"Form.cjs.map"}
|
package/dist/Form.css
CHANGED
package/dist/Form.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"AAqFkD;;;;AAAA;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/Form.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 {createContext, forwardRef, ReactNode, useContext, useMemo} from 'react';\nimport {DOMRef, SpectrumLabelableProps} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {Form as RACForm, FormProps as RACFormProps} from 'react-aria-components';\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton} from './Skeleton';\n\ninterface FormStyleProps extends Omit<SpectrumLabelableProps, 'label' | 'contextualHelp'> {\n /**\n * Size of the Form elements.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /** Whether the Form elements are disabled. */\n isDisabled?: boolean,\n /** Whether the Form elements are rendered with their emphasized style. */\n isEmphasized?: boolean\n}\n\nexport interface FormProps extends FormStyleProps, Omit<RACFormProps, 'className' | 'style' | 'children'>, StyleProps {\n children?: ReactNode\n}\n\nexport const FormContext = createContext<FormStyleProps | null>(null);\nexport function useFormProps<T extends FormStyleProps>(props: T): T {\n let ctx = useContext(FormContext);\n let isSkeleton = useIsSkeleton();\n return useMemo(() => {\n let result: T = props;\n if (ctx || isSkeleton) {\n result = {...props};\n }\n\n if (ctx) {\n // This is a subset of mergeProps. We just need to merge non-undefined values.\n for (let key in ctx) {\n if (result[key] === undefined) {\n result[key] = ctx[key];\n }\n }\n }\n\n // Skeleton always wins over local props.\n if (isSkeleton) {\n result.isDisabled = true;\n }\n\n return result;\n }, [ctx, props, isSkeleton]);\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nexport const Form = /*#__PURE__*/ forwardRef(function Form(props: FormProps, ref: DOMRef<HTMLFormElement>) {\n let {\n labelPosition = 'top',\n labelAlign,\n necessityIndicator,\n isRequired,\n isDisabled,\n isEmphasized,\n size = 'M',\n ...formProps\n } = props;\n let domRef = useDOMRef(ref);\n\n return (\n <RACForm\n {...formProps}\n ref={domRef}\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + style({\n display: 'grid',\n gridTemplateColumns: {\n labelPosition: {\n top: ['[field] 1fr'],\n side: ['[label] auto', '[field] 1fr']\n }\n },\n // TODO: confirm when we have tokens\n rowGap: {\n size: {\n XS: 16,\n S: 20,\n M: 24,\n L: 32,\n XL: 40\n }\n },\n columnGap: 'text-to-control'\n }, getAllowedOverrides())({labelPosition, size}, props.styles)}>\n <FormContext.Provider\n value={{\n labelPosition,\n labelAlign,\n necessityIndicator,\n isRequired,\n isDisabled,\n isEmphasized,\n size\n }}>\n {props.children}\n </FormContext.Provider>\n </RACForm>\n );\n});\n"],"names":[],"version":3,"file":"Form.css.map"}
|