@react-spectrum/s2 0.5.0 → 0.7.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 +3 -7
- 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 +261 -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 -159
- 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 +4 -8
- 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 +1 -5
- 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 +12 -16
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +12 -15
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +100 -103
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +31 -37
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +100 -103
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +123 -108
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +101 -83
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +124 -109
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +98 -99
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +70 -70
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +100 -101
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +305 -278
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +253 -186
- 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 +12 -16
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +18 -21
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +169 -169
- package/dist/Card.cjs.map +1 -1
- package/dist/Card.css +121 -127
- package/dist/Card.css.map +1 -1
- package/dist/Card.mjs +170 -170
- package/dist/Card.mjs.map +1 -1
- package/dist/CardView.cjs +115 -327
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +36 -16
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +73 -285
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +3 -7
- package/dist/CenterBaseline.css.map +1 -1
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +58 -62
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +54 -60
- 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 -38
- 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 +6 -10
- 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 +46 -54
- 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 +11 -15
- 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 -30
- 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 +20 -24
- package/dist/ColorHandle.css.map +1 -1
- package/dist/ColorHandle.mjs +11 -11
- package/dist/ColorSlider.cjs +43 -46
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +43 -49
- 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 +15 -19
- 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 +34 -38
- 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 +16 -20
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs +18 -21
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +62 -62
- package/dist/ComboBox.cjs.map +1 -1
- package/dist/ComboBox.css +52 -58
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +63 -63
- package/dist/ComboBox.mjs.map +1 -1
- package/dist/Content.cjs +15 -20
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs +15 -20
- 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 -29
- 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 +10 -14
- package/dist/CustomDialog.css.map +1 -1
- package/dist/CustomDialog.mjs +10 -13
- package/dist/CustomDialog.mjs.map +1 -1
- package/dist/Dialog.cjs +14 -18
- package/dist/Dialog.cjs.map +1 -1
- package/dist/Dialog.css +39 -45
- package/dist/Dialog.css.map +1 -1
- package/dist/Dialog.mjs +14 -18
- 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 -55
- 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 +19 -23
- 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 -32
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +30 -33
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +134 -132
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +76 -90
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +134 -132
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +6 -9
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +4 -8
- 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 -60
- 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 -64
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +128 -132
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +24 -13
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css +12 -16
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +25 -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 -69
- 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 -48
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +37 -40
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +335 -235
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +130 -122
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +337 -237
- 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 -79
- 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 +49 -77
- 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 -76
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +67 -70
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +214 -189
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +92 -94
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +215 -190
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +48 -72
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +59 -134
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +49 -73
- 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 -91
- 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 +17 -21
- 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 +7 -11
- package/dist/Provider.css.map +1 -1
- package/dist/Provider.mjs +5 -5
- package/dist/Radio.cjs +54 -58
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +50 -56
- 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 -38
- 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 +35 -38
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +30 -36
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +36 -39
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +71 -77
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +63 -69
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +73 -79
- 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 -93
- 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 -32
- 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 -54
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +57 -61
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +271 -275
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +104 -102
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +273 -277
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +472 -191
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +225 -139
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +472 -191
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TabsPicker.cjs +415 -0
- package/dist/TabsPicker.cjs.map +1 -0
- package/dist/TabsPicker.css +482 -0
- package/dist/TabsPicker.css.map +1 -0
- package/dist/TabsPicker.mjs +409 -0
- package/dist/TabsPicker.mjs.map +1 -0
- package/dist/TagGroup.cjs +126 -128
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +93 -99
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +126 -128
- 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 -39
- 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 +8 -12
- 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 +49 -49
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +55 -76
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +50 -50
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/TreeView.cjs +439 -0
- package/dist/TreeView.cjs.map +1 -0
- package/dist/TreeView.css +608 -0
- package/dist/TreeView.css.map +1 -0
- package/dist/TreeView.mjs +432 -0
- package/dist/TreeView.mjs.map +1 -0
- 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 +9 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +5 -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 +227 -168
- 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/3DMaterial.cjs.map +1 -1
- package/icons/3DMaterial.mjs.map +1 -1
- package/icons/ABC.cjs +36 -0
- package/icons/ABC.cjs.map +1 -0
- package/icons/ABC.mjs +25 -0
- package/icons/ABC.mjs.map +1 -0
- package/icons/AlertDiamond.cjs.map +1 -1
- package/icons/AlertDiamond.mjs.map +1 -1
- package/icons/Animation.cjs.map +1 -1
- package/icons/Animation.mjs.map +1 -1
- package/icons/AnimationNo.cjs.map +1 -1
- package/icons/AnimationNo.mjs.map +1 -1
- package/icons/App.cjs +42 -0
- package/icons/App.cjs.map +1 -0
- package/icons/App.mjs +31 -0
- package/icons/App.mjs.map +1 -0
- package/icons/AspectRatio.cjs.map +1 -1
- package/icons/AspectRatio.mjs.map +1 -1
- package/icons/Asset.cjs +1 -5
- package/icons/Asset.cjs.map +1 -1
- package/icons/Asset.mjs +1 -5
- package/icons/Asset.mjs.map +1 -1
- package/icons/AudioWave.cjs.map +1 -1
- package/icons/AudioWave.mjs.map +1 -1
- package/icons/BadgeVerified.cjs.map +1 -1
- package/icons/BadgeVerified.mjs.map +1 -1
- package/icons/Bell.cjs.map +1 -1
- package/icons/Bell.mjs.map +1 -1
- package/icons/Bookmark.cjs +36 -0
- package/icons/Bookmark.cjs.map +1 -0
- package/icons/Bookmark.mjs +25 -0
- package/icons/Bookmark.mjs.map +1 -0
- package/icons/Brand.cjs.map +1 -1
- package/icons/Brand.mjs.map +1 -1
- package/icons/Building.cjs +62 -0
- package/icons/Building.cjs.map +1 -0
- package/icons/Building.mjs +51 -0
- package/icons/Building.mjs.map +1 -0
- package/icons/CalendarEdit.cjs.map +1 -1
- package/icons/CalendarEdit.mjs.map +1 -1
- package/icons/CallCenter.cjs +36 -0
- package/icons/CallCenter.cjs.map +1 -0
- package/icons/CallCenter.mjs +25 -0
- package/icons/CallCenter.mjs.map +1 -0
- package/icons/CameraProperties.cjs.map +1 -1
- package/icons/CameraProperties.mjs.map +1 -1
- package/icons/Channel.cjs.map +1 -1
- package/icons/Channel.mjs.map +1 -1
- package/icons/ChartBarVert.cjs +36 -0
- package/icons/ChartBarVert.cjs.map +1 -0
- package/icons/ChartBarVert.mjs +25 -0
- package/icons/ChartBarVert.mjs.map +1 -0
- package/icons/ChartPie.cjs +36 -0
- package/icons/ChartPie.cjs.map +1 -0
- package/icons/ChartPie.mjs +25 -0
- package/icons/ChartPie.mjs.map +1 -0
- package/icons/ChartTrend.cjs +36 -0
- package/icons/ChartTrend.cjs.map +1 -0
- package/icons/ChartTrend.mjs +25 -0
- package/icons/ChartTrend.mjs.map +1 -0
- package/icons/Chat.cjs +36 -0
- package/icons/Chat.cjs.map +1 -0
- package/icons/Chat.mjs +25 -0
- package/icons/Chat.mjs.map +1 -0
- package/icons/CheckBox.cjs.map +1 -1
- package/icons/CheckBox.mjs.map +1 -1
- package/icons/Checkmark.cjs +8 -8
- package/icons/Checkmark.cjs.map +1 -1
- package/icons/Checkmark.mjs +8 -8
- package/icons/Checkmark.mjs.map +1 -1
- package/icons/ChevronDoubleLeft.cjs +42 -0
- package/icons/ChevronDoubleLeft.cjs.map +1 -0
- package/icons/ChevronDoubleLeft.d.ts +5 -0
- package/icons/ChevronDoubleLeft.mjs +31 -0
- package/icons/ChevronDoubleLeft.mjs.map +1 -0
- package/icons/ChevronDoubleRight.cjs +42 -0
- package/icons/ChevronDoubleRight.cjs.map +1 -0
- package/icons/ChevronDoubleRight.d.ts +5 -0
- package/icons/ChevronDoubleRight.mjs +31 -0
- package/icons/ChevronDoubleRight.mjs.map +1 -0
- package/icons/ChevronDown.cjs +8 -8
- package/icons/ChevronDown.cjs.map +1 -1
- package/icons/ChevronDown.mjs +8 -8
- package/icons/ChevronDown.mjs.map +1 -1
- package/icons/ChevronLeft.cjs.map +1 -1
- package/icons/ChevronLeft.mjs.map +1 -1
- package/icons/ChevronRight.cjs.map +1 -1
- package/icons/ChevronRight.mjs.map +1 -1
- package/icons/ChevronUp.cjs +36 -0
- package/icons/ChevronUp.cjs.map +1 -0
- package/icons/ChevronUp.d.ts +5 -0
- package/icons/ChevronUp.mjs +25 -0
- package/icons/ChevronUp.mjs.map +1 -0
- package/icons/Circle.cjs.map +1 -1
- package/icons/Circle.mjs.map +1 -1
- package/icons/Close.cjs.map +1 -1
- package/icons/Close.mjs.map +1 -1
- package/icons/CloseCaptions.cjs.map +1 -1
- package/icons/CloseCaptions.mjs.map +1 -1
- package/icons/Code.cjs +36 -0
- package/icons/Code.cjs.map +1 -0
- package/icons/Code.d.ts +5 -0
- package/icons/Code.mjs +25 -0
- package/icons/Code.mjs.map +1 -0
- package/icons/Collection.cjs.map +1 -1
- package/icons/Collection.mjs.map +1 -1
- package/icons/ColorHarmony.cjs.map +1 -1
- package/icons/ColorHarmony.mjs.map +1 -1
- package/icons/CommentCheckmark.cjs.map +1 -1
- package/icons/CommentCheckmark.mjs.map +1 -1
- package/icons/CommentHide.cjs.map +1 -1
- package/icons/CommentHide.mjs.map +1 -1
- package/icons/CommentRemove.cjs.map +1 -1
- package/icons/CommentRemove.mjs.map +1 -1
- package/icons/Compare.cjs +42 -0
- package/icons/Compare.cjs.map +1 -0
- package/icons/Compare.d.ts +5 -0
- package/icons/Compare.mjs +31 -0
- package/icons/Compare.mjs.map +1 -0
- package/icons/ContextualTaskBar.cjs.map +1 -1
- package/icons/ContextualTaskBar.mjs.map +1 -1
- package/icons/CornerRadiusBottomLeft.cjs.map +1 -1
- package/icons/CornerRadiusBottomLeft.mjs.map +1 -1
- package/icons/CornerRadiusBottomRight.cjs.map +1 -1
- package/icons/CornerRadiusBottomRight.mjs.map +1 -1
- package/icons/CornerRadiusTopLeft.cjs.map +1 -1
- package/icons/CornerRadiusTopLeft.mjs.map +1 -1
- package/icons/CornerRadiusTopRight.cjs.map +1 -1
- package/icons/CornerRadiusTopRight.mjs.map +1 -1
- package/icons/CursorClick.cjs.map +1 -1
- package/icons/CursorClick.mjs.map +1 -1
- package/icons/Data.cjs +1 -1
- package/icons/Data.cjs.map +1 -1
- package/icons/Data.mjs +1 -1
- package/icons/Data.mjs.map +1 -1
- package/icons/DataAdd.cjs.map +1 -1
- package/icons/DataAdd.mjs.map +1 -1
- package/icons/DataRefresh.cjs +42 -0
- package/icons/DataRefresh.cjs.map +1 -0
- package/icons/DataRefresh.d.ts +5 -0
- package/icons/DataRefresh.mjs +31 -0
- package/icons/DataRefresh.mjs.map +1 -0
- package/icons/DataSettings.cjs +2 -2
- package/icons/DataSettings.cjs.map +1 -1
- package/icons/DataSettings.mjs +2 -2
- package/icons/DataSettings.mjs.map +1 -1
- package/icons/DataUpload.cjs +2 -2
- package/icons/DataUpload.cjs.map +1 -1
- package/icons/DataUpload.mjs +2 -2
- package/icons/DataUpload.mjs.map +1 -1
- package/icons/DeviceTablet.cjs.map +1 -1
- package/icons/DeviceTablet.mjs.map +1 -1
- package/icons/Draw.cjs.map +1 -1
- package/icons/Draw.mjs.map +1 -1
- package/icons/Edit.cjs.map +1 -1
- package/icons/Edit.mjs.map +1 -1
- package/icons/EditNo.cjs.map +1 -1
- package/icons/EditNo.mjs.map +1 -1
- package/icons/Email.cjs.map +1 -1
- package/icons/Email.mjs.map +1 -1
- package/icons/Enterprise.cjs +46 -0
- package/icons/Enterprise.cjs.map +1 -0
- package/icons/Enterprise.d.ts +5 -0
- package/icons/Enterprise.mjs +35 -0
- package/icons/Enterprise.mjs.map +1 -0
- package/icons/Export.cjs +42 -0
- package/icons/Export.cjs.map +1 -0
- package/icons/Export.d.ts +5 -0
- package/icons/Export.mjs +31 -0
- package/icons/Export.mjs.map +1 -0
- package/icons/Filter.cjs.map +1 -1
- package/icons/Filter.mjs.map +1 -1
- package/icons/FlipHorizontal.cjs +1 -21
- package/icons/FlipHorizontal.cjs.map +1 -1
- package/icons/FlipHorizontal.mjs +1 -21
- package/icons/FlipHorizontal.mjs.map +1 -1
- package/icons/FlipVertical.cjs +1 -21
- package/icons/FlipVertical.cjs.map +1 -1
- package/icons/FlipVertical.mjs +1 -21
- package/icons/FlipVertical.mjs.map +1 -1
- package/icons/FolderMoveTo.cjs.map +1 -1
- package/icons/FolderMoveTo.mjs.map +1 -1
- package/icons/FolderSearch.cjs +42 -0
- package/icons/FolderSearch.cjs.map +1 -0
- package/icons/FolderSearch.d.ts +5 -0
- package/icons/FolderSearch.mjs +31 -0
- package/icons/FolderSearch.mjs.map +1 -0
- package/icons/FontPicker.cjs.map +1 -1
- package/icons/FontPicker.mjs.map +1 -1
- package/icons/GlobeGrid.cjs.map +1 -1
- package/icons/GlobeGrid.mjs.map +1 -1
- package/icons/GradientHorizontal.cjs.map +1 -1
- package/icons/GradientHorizontal.mjs.map +1 -1
- package/icons/GridsAndRulers.cjs.map +1 -1
- package/icons/GridsAndRulers.mjs.map +1 -1
- package/icons/Icon.cjs.map +1 -1
- package/icons/Icon.mjs.map +1 -1
- package/icons/Image.cjs.map +1 -1
- package/icons/Image.mjs.map +1 -1
- package/icons/ImageAdd.cjs +1 -5
- package/icons/ImageAdd.cjs.map +1 -1
- package/icons/ImageAdd.mjs +1 -5
- package/icons/ImageAdd.mjs.map +1 -1
- package/icons/ImageBackgroundRemove.cjs.map +1 -1
- package/icons/ImageBackgroundRemove.mjs.map +1 -1
- package/icons/Images.cjs.map +1 -1
- package/icons/Images.mjs.map +1 -1
- package/icons/Import.cjs +42 -0
- package/icons/Import.cjs.map +1 -0
- package/icons/Import.d.ts +5 -0
- package/icons/Import.mjs +31 -0
- package/icons/Import.mjs.map +1 -0
- package/icons/Key.cjs +36 -0
- package/icons/Key.cjs.map +1 -0
- package/icons/Key.d.ts +5 -0
- package/icons/Key.mjs +25 -0
- package/icons/Key.mjs.map +1 -0
- package/icons/ListMultiSelect.cjs.map +1 -1
- package/icons/ListMultiSelect.mjs.map +1 -1
- package/icons/ListNumbered.cjs.map +1 -1
- package/icons/ListNumbered.mjs.map +1 -1
- package/icons/Logo.cjs.map +1 -1
- package/icons/Logo.mjs.map +1 -1
- package/icons/Market.cjs.map +1 -1
- package/icons/Market.mjs.map +1 -1
- package/icons/Microphone.cjs.map +1 -1
- package/icons/Microphone.mjs.map +1 -1
- package/icons/MicrophoneOff.cjs.map +1 -1
- package/icons/MicrophoneOff.mjs.map +1 -1
- package/icons/MusicNote.cjs.map +1 -1
- package/icons/MusicNote.mjs.map +1 -1
- package/icons/OrientationPortrait.cjs.map +1 -1
- package/icons/OrientationPortrait.mjs.map +1 -1
- package/icons/Pause.cjs.map +1 -1
- package/icons/Pause.mjs.map +1 -1
- package/icons/PauseCircle.cjs.map +1 -1
- package/icons/PauseCircle.mjs.map +1 -1
- package/icons/PeopleGroup.cjs +36 -0
- package/icons/PeopleGroup.cjs.map +1 -0
- package/icons/PeopleGroup.d.ts +5 -0
- package/icons/PeopleGroup.mjs +25 -0
- package/icons/PeopleGroup.mjs.map +1 -0
- package/icons/Percentage.cjs.map +1 -1
- package/icons/Percentage.mjs.map +1 -1
- package/icons/PinOff.cjs.map +1 -1
- package/icons/PinOff.mjs.map +1 -1
- package/icons/PinOn.cjs.map +1 -1
- package/icons/PinOn.mjs.map +1 -1
- package/icons/Play.cjs.map +1 -1
- package/icons/Play.mjs.map +1 -1
- package/icons/PluginGear.cjs.map +1 -1
- package/icons/PluginGear.mjs.map +1 -1
- package/icons/Polygon6.cjs.map +1 -1
- package/icons/Polygon6.mjs.map +1 -1
- package/icons/Publish.cjs.map +1 -1
- package/icons/Publish.mjs.map +1 -1
- package/icons/PublishNo.cjs.map +1 -1
- package/icons/PublishNo.mjs.map +1 -1
- package/icons/RadioButton.cjs.map +1 -1
- package/icons/RadioButton.mjs.map +1 -1
- package/icons/RectangleHoriz.cjs.map +1 -1
- package/icons/RectangleHoriz.mjs.map +1 -1
- package/icons/RocketQuickActions.cjs.map +1 -1
- package/icons/RocketQuickActions.mjs.map +1 -1
- package/icons/RotateCW.cjs.map +1 -1
- package/icons/RotateCW.mjs.map +1 -1
- package/icons/Ruler.cjs.map +1 -1
- package/icons/Ruler.mjs.map +1 -1
- package/icons/SaveFloppy.cjs +36 -0
- package/icons/SaveFloppy.cjs.map +1 -0
- package/icons/SaveFloppy.d.ts +5 -0
- package/icons/SaveFloppy.mjs +25 -0
- package/icons/SaveFloppy.mjs.map +1 -0
- package/icons/Select.cjs.map +1 -1
- package/icons/Select.mjs.map +1 -1
- package/icons/Send.cjs.map +1 -1
- package/icons/Send.mjs.map +1 -1
- package/icons/Shuffle.cjs.map +1 -1
- package/icons/Shuffle.mjs.map +1 -1
- package/icons/Skeleton.cjs +8 -6
- package/icons/Skeleton.cjs.map +1 -1
- package/icons/Skeleton.css +8 -10
- package/icons/Skeleton.css.map +1 -1
- package/icons/Skeleton.mjs +9 -7
- package/icons/Skeleton.mjs.map +1 -1
- package/icons/SlowConnectionCircle.cjs.map +1 -1
- package/icons/SlowConnectionCircle.mjs.map +1 -1
- package/icons/SpeedFast.cjs +36 -0
- package/icons/SpeedFast.cjs.map +1 -0
- package/icons/SpeedFast.d.ts +5 -0
- package/icons/SpeedFast.mjs +25 -0
- package/icons/SpeedFast.mjs.map +1 -0
- package/icons/StepBackward.cjs.map +1 -1
- package/icons/StepBackward.mjs.map +1 -1
- package/icons/StepForward.cjs.map +1 -1
- package/icons/StepForward.mjs.map +1 -1
- package/icons/Table.cjs.map +1 -1
- package/icons/Table.mjs.map +1 -1
- package/icons/Tag.cjs.map +1 -1
- package/icons/Tag.mjs.map +1 -1
- package/icons/Target.cjs.map +1 -1
- package/icons/Target.mjs.map +1 -1
- package/icons/TextBold.cjs.map +1 -1
- package/icons/TextBold.mjs.map +1 -1
- package/icons/TextHighlight.cjs.map +1 -1
- package/icons/TextHighlight.mjs.map +1 -1
- package/icons/TextIncrease.cjs.map +1 -1
- package/icons/TextIncrease.mjs.map +1 -1
- package/icons/TextNumbers.cjs.map +1 -1
- package/icons/TextNumbers.mjs.map +1 -1
- package/icons/TextParagraph.cjs.map +1 -1
- package/icons/TextParagraph.mjs.map +1 -1
- package/icons/TextReplaceComment.cjs.map +1 -1
- package/icons/TextReplaceComment.mjs.map +1 -1
- package/icons/Tools.cjs.map +1 -1
- package/icons/Tools.mjs.map +1 -1
- package/icons/TouchOneFingerSwipeLeftRight.cjs.map +1 -1
- package/icons/TouchOneFingerSwipeLeftRight.mjs.map +1 -1
- package/icons/Transcript.cjs.map +1 -1
- package/icons/Transcript.mjs.map +1 -1
- package/icons/Translate.cjs.map +1 -1
- package/icons/Translate.mjs.map +1 -1
- package/icons/UserAvatarCursor.cjs.map +1 -1
- package/icons/UserAvatarCursor.mjs.map +1 -1
- package/icons/UserEdit.cjs.map +1 -1
- package/icons/UserEdit.mjs.map +1 -1
- package/icons/UserGroup.cjs.map +1 -1
- package/icons/UserGroup.mjs.map +1 -1
- package/icons/UserSettings.cjs +44 -0
- package/icons/UserSettings.cjs.map +1 -0
- package/icons/UserSettings.d.ts +5 -0
- package/icons/UserSettings.mjs +33 -0
- package/icons/UserSettings.mjs.map +1 -0
- package/icons/VectorDraw.cjs.map +1 -1
- package/icons/VectorDraw.mjs.map +1 -1
- package/icons/ViewGridFluid.cjs +36 -0
- package/icons/ViewGridFluid.cjs.map +1 -0
- package/icons/ViewGridFluid.d.ts +5 -0
- package/icons/ViewGridFluid.mjs +25 -0
- package/icons/ViewGridFluid.mjs.map +1 -0
- package/icons/ZoomIn.cjs.map +1 -1
- package/icons/ZoomIn.mjs.map +1 -1
- package/icons/ZoomOut.cjs.map +1 -1
- package/icons/ZoomOut.mjs.map +1 -1
- package/package.json +19 -21
- package/src/Accordion.tsx +6 -9
- package/src/ActionBar.tsx +229 -0
- package/src/ActionButton.tsx +27 -54
- package/src/ActionButtonGroup.tsx +9 -11
- package/src/ActionMenu.tsx +6 -9
- package/src/AlertDialog.tsx +5 -8
- package/src/Avatar.tsx +6 -9
- package/src/AvatarGroup.tsx +6 -9
- package/src/Badge.tsx +32 -16
- package/src/Breadcrumbs.tsx +19 -25
- package/src/Button.tsx +201 -158
- package/src/ButtonGroup.tsx +6 -9
- package/src/Card.tsx +2 -2
- package/src/CardView.tsx +54 -377
- package/src/Checkbox.tsx +7 -10
- package/src/CheckboxGroup.tsx +8 -11
- package/src/ClearButton.tsx +2 -5
- package/src/CloseButton.tsx +22 -32
- package/src/ColorArea.tsx +6 -9
- package/src/ColorField.tsx +6 -9
- package/src/ColorSlider.tsx +6 -9
- package/src/ColorSwatch.tsx +7 -10
- package/src/ColorSwatchPicker.tsx +6 -10
- package/src/ColorWheel.tsx +6 -9
- package/src/ComboBox.tsx +7 -9
- package/src/Content.tsx +23 -39
- package/src/ContextualHelp.tsx +7 -10
- package/src/CustomDialog.tsx +5 -8
- package/src/Dialog.tsx +6 -9
- package/src/Disclosure.tsx +16 -25
- package/src/Divider.tsx +17 -26
- package/src/DropZone.tsx +7 -10
- package/src/Field.tsx +26 -33
- package/src/Form.tsx +7 -10
- package/src/FullscreenDialog.tsx +5 -8
- package/src/Icon.tsx +2 -2
- package/src/IllustratedMessage.tsx +7 -10
- package/src/Image.tsx +21 -10
- package/src/InlineAlert.tsx +6 -10
- package/src/Link.tsx +15 -23
- package/src/Menu.tsx +77 -36
- package/src/Meter.tsx +14 -24
- package/src/Modal.tsx +22 -52
- package/src/NumberField.tsx +6 -9
- package/src/Picker.tsx +88 -69
- package/src/Popover.tsx +32 -105
- package/src/ProgressBar.tsx +15 -25
- package/src/ProgressCircle.tsx +19 -25
- package/src/Radio.tsx +6 -9
- package/src/RadioGroup.tsx +8 -11
- package/src/RangeSlider.tsx +3 -6
- package/src/SearchField.tsx +6 -9
- package/src/SegmentedControl.tsx +16 -25
- package/src/Skeleton.tsx +6 -8
- package/src/Slider.tsx +3 -6
- package/src/StatusLight.tsx +7 -10
- package/src/Switch.tsx +7 -10
- package/src/TableView.tsx +120 -121
- package/src/Tabs.tsx +450 -147
- package/src/TabsPicker.tsx +350 -0
- package/src/TagGroup.tsx +11 -18
- package/src/TextField.tsx +22 -30
- package/src/ToggleButton.tsx +9 -11
- package/src/ToggleButtonGroup.tsx +6 -9
- package/src/Tooltip.tsx +34 -55
- package/src/TreeView.tsx +450 -0
- package/src/bar-utils.ts +3 -10
- package/src/index.ts +4 -0
- package/src/style-utils.ts +15 -9
- package/style/__tests__/style-macro.test.js +3 -7
- 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 +18 -4
- package/style/dist/style-macro.cjs.map +1 -1
- package/style/dist/style-macro.mjs +18 -4
- 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 -8
- package/style/style-macro.ts +29 -7
- package/style/tokens.ts +30 -0
- package/style/types.ts +1 -1
- package/icons/CloudStateDefault.cjs +0 -36
- package/icons/CloudStateDefault.cjs.map +0 -1
- package/icons/CloudStateDefault.mjs +0 -25
- package/icons/CloudStateDefault.mjs.map +0 -1
- package/icons/CloudStateDisconnected.cjs +0 -36
- package/icons/CloudStateDisconnected.cjs.map +0 -1
- package/icons/CloudStateDisconnected.mjs +0 -25
- package/icons/CloudStateDisconnected.mjs.map +0 -1
- package/icons/CloudStateError.cjs +0 -36
- package/icons/CloudStateError.cjs.map +0 -1
- package/icons/CloudStateError.mjs +0 -25
- package/icons/CloudStateError.mjs.map +0 -1
- package/icons/CloudStateErrorRed.cjs +0 -46
- package/icons/CloudStateErrorRed.cjs.map +0 -1
- package/icons/CloudStateErrorRed.mjs +0 -35
- package/icons/CloudStateErrorRed.mjs.map +0 -1
- package/icons/CloudStateInProgress.cjs +0 -36
- package/icons/CloudStateInProgress.cjs.map +0 -1
- package/icons/CloudStateInProgress.mjs +0 -25
- package/icons/CloudStateInProgress.mjs.map +0 -1
- package/icons/CloudStateOnline.cjs +0 -50
- package/icons/CloudStateOnline.cjs.map +0 -1
- package/icons/CloudStateOnline.mjs +0 -39
- package/icons/CloudStateOnline.mjs.map +0 -1
- package/icons/CloudStatePaused.cjs +0 -36
- package/icons/CloudStatePaused.cjs.map +0 -1
- package/icons/CloudStatePaused.mjs +0 -25
- package/icons/CloudStatePaused.mjs.map +0 -1
- package/icons/CloudStatePending.cjs +0 -42
- package/icons/CloudStatePending.cjs.map +0 -1
- package/icons/CloudStatePending.mjs +0 -31
- package/icons/CloudStatePending.mjs.map +0 -1
- package/icons/CloudStateSlowConnection.cjs +0 -36
- package/icons/CloudStateSlowConnection.cjs.map +0 -1
- package/icons/CloudStateSlowConnection.mjs +0 -25
- package/icons/CloudStateSlowConnection.mjs.map +0 -1
- /package/icons/{CloudStateDefault.d.ts → ABC.d.ts} +0 -0
- /package/icons/{CloudStateDisconnected.d.ts → App.d.ts} +0 -0
- /package/icons/{CloudStateError.d.ts → Bookmark.d.ts} +0 -0
- /package/icons/{CloudStateErrorRed.d.ts → Building.d.ts} +0 -0
- /package/icons/{CloudStateInProgress.d.ts → CallCenter.d.ts} +0 -0
- /package/icons/{CloudStateOnline.d.ts → ChartBarVert.d.ts} +0 -0
- /package/icons/{CloudStatePaused.d.ts → ChartPie.d.ts} +0 -0
- /package/icons/{CloudStatePending.d.ts → ChartTrend.d.ts} +0 -0
- /package/icons/{CloudStateSlowConnection.d.ts → Chat.d.ts} +0 -0
package/dist/Disclosure.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AC2CmB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAyEE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQA;;;;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;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA4EC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA6CwB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAgE1B;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA1QD;EAAA;;;;EAAA;;;;EAiFE;;;;EAyLD;;;;EAAA;;;;;AA1QD;;AAiFE;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAyLD;;;;;;AA7GE","sources":["af82a6f8008c749b","packages/@react-spectrum/s2/src/Disclosure.tsx"],"sourcesContent":["@import \"02b9b02b69a441b2\";\n@import \"80d1cf6aba9342e9\";\n@import \"d47c144c912b2c65\";\n@import \"54c3947845455457\";\n@import \"47e48706d70658de\";\n@import \"879f5cdc449bf13e\";\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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n /**\n * The size of the disclosure.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The amount of space between the disclosures.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the disclosure should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Omit<DisclosureProps, 'children'>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n color: 'heading',\n borderTopWidth: {\n default: 1,\n isQuiet: 0\n },\n borderBottomWidth: {\n default: 1,\n isQuiet: 0,\n isInGroup: {\n default: 0,\n ':last-child': {\n default: 1,\n isQuiet: 0\n }\n }\n },\n borderStartWidth: 0,\n borderEndWidth: 0,\n borderStyle: 'solid',\n borderColor: 'gray-200',\n minWidth: 200\n}, getAllowedOverrides());\n\nfunction Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n let {\n size = 'M',\n density = 'regular',\n isQuiet,\n UNSAFE_style,\n UNSAFE_className = ''\n } = props;\n let domRef = useDOMRef(ref);\n\n let isInGroup = useContext(DisclosureContext) !== null;\n\n return (\n <Provider\n values={[\n [DisclosureContext, {size, isQuiet, density}]\n ]}>\n <RACDisclosure\n {...props}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n {props.children}\n </RACDisclosure>\n </Provider>\n );\n}\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nlet _Disclosure = forwardRef(Disclosure);\nexport {_Disclosure as Disclosure};\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n /** The heading level of the disclosure header.\n * \n * @default 3\n */\n level?: number,\n /** The contents of the disclosure header. */\n children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n children: React.ReactNode\n}\n\nconst headingStyle = style({\n margin: 0,\n flexGrow: 1,\n display: 'flex',\n flexShrink: 1,\n minWidth: 0\n});\n\nconst buttonStyles = style({\n ...focusRing(),\n outlineOffset: -2,\n font: 'heading',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n fontWeight: 'bold',\n fontSize: {\n size: {\n S: 'heading-xs',\n M: 'heading-sm',\n L: 'heading',\n XL: 'heading-lg'\n }\n },\n lineHeight: 'ui',\n display: 'flex',\n flexGrow: 1,\n alignItems: 'baseline',\n paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n paddingY: centerPadding(),\n gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n minHeight: {\n // compact is equivalent to 'control', but other densities have more padding.\n size: {\n S: {\n density: {\n compact: 24,\n regular: 32,\n spacious: 40\n }\n },\n M: {\n density: {\n compact: 32,\n regular: 40,\n spacious: 48\n }\n },\n L: {\n density: {\n compact: 40,\n regular: 48,\n spacious: 56\n }\n },\n XL: {\n density: {\n compact: 48,\n regular: 56,\n spacious: 64\n }\n }\n }\n },\n width: 'full',\n backgroundColor: {\n default: 'transparent',\n isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n },\n transition: 'default',\n borderWidth: 0,\n borderRadius: {\n // Only rounded for keyboard focus and quiet.\n default: 'none',\n isFocusVisible: 'control',\n isQuiet: 'control'\n },\n textAlign: 'start',\n disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n rotate: {\n isRTL: 180,\n isExpanded: 90\n },\n transition: 'default',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_className,\n UNSAFE_style,\n children\n } = props;\n let domRef = useDOMRef(ref);\n let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n let mapSize = {\n S: 'XS',\n M: 'S',\n L: 'M',\n XL: 'L'\n };\n\n // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n if (density === 'compact') {\n newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n }\n\n return (\n <Provider\n values={[\n [ActionButtonContext, {size: newSize, isQuiet}],\n [InternalDisclosureHeader, {}]\n ]}>\n <div\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n ref={domRef}>\n {children}\n </div>\n </Provider>\n );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\nfunction DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n let {\n level = 3,\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n const domProps = filterDOMProps(otherProps);\n let {direction} = useLocale();\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n let isRTL = direction === 'rtl';\n\n let buttonTrigger = (\n <Heading\n {...domProps}\n level={level}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + headingStyle}>\n <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n <CenterBaseline>\n <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n </CenterBaseline>\n {props.children}\n </Button>\n </Heading>\n );\n let ctx = useContext(InternalDisclosureHeader);\n if (ctx) {\n return buttonTrigger;\n }\n\n return (\n <DisclosureHeader>\n {buttonTrigger}\n </DisclosureHeader>\n );\n}\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nlet _DisclosureTitle = forwardRef(DisclosureTitle);\nexport {_DisclosureTitle as DisclosureTitle};\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n children: React.ReactNode\n}\n\nconst panelStyles = style({\n font: 'body',\n paddingTop: {\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: 16\n },\n paddingX: {\n isExpanded: {\n size: {\n S: 8,\n M: 9,\n L: 12,\n XL: 15\n }\n }\n }\n});\n\nfunction DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n let {size} = useSlottedContext(DisclosureContext)!;\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let panelRef = useDOMRef(ref);\n return (\n <RACDisclosurePanel\n {...domProps}\n ref={panelRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n {props.children}\n </RACDisclosurePanel>\n );\n}\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nlet _DisclosurePanel = forwardRef(DisclosurePanel);\nexport {_DisclosurePanel as DisclosurePanel};\n\n"],"names":[],"version":3,"file":"Disclosure.css.map"}
|
|
1
|
+
{"mappings":"AC2CmB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsEE;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQA;;;;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;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA4EC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA6CwB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EA6D1B;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AApQD;EAAA;;;;EAAA;;;;EA8EE;;;;EAsLD;;;;EAAA;;;;;AAtLC;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;IAAA;;;;;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAsLD","sources":["af82a6f8008c749b","packages/@react-spectrum/s2/src/Disclosure.tsx"],"sourcesContent":["@import \"02b9b02b69a441b2\";\n@import \"80d1cf6aba9342e9\";\n@import \"d47c144c912b2c65\";\n@import \"54c3947845455457\";\n@import \"47e48706d70658de\";\n@import \"879f5cdc449bf13e\";\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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n /**\n * The size of the disclosure.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The amount of space between the disclosures.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the disclosure should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Partial<DisclosureProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n color: 'heading',\n borderTopWidth: {\n default: 1,\n isQuiet: 0\n },\n borderBottomWidth: {\n default: 1,\n isQuiet: 0,\n isInGroup: {\n default: 0,\n ':last-child': {\n default: 1,\n isQuiet: 0\n }\n }\n },\n borderStartWidth: 0,\n borderEndWidth: 0,\n borderStyle: 'solid',\n borderColor: 'gray-200',\n minWidth: 200\n}, getAllowedOverrides());\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nexport const Disclosure = forwardRef(function Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n let {\n size = 'M',\n density = 'regular',\n isQuiet,\n UNSAFE_style,\n UNSAFE_className = ''\n } = props;\n let domRef = useDOMRef(ref);\n\n let isInGroup = useContext(DisclosureContext) !== null;\n\n return (\n <Provider\n values={[\n [DisclosureContext, {size, isQuiet, density}]\n ]}>\n <RACDisclosure\n {...props}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n {props.children}\n </RACDisclosure>\n </Provider>\n );\n});\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n /** The heading level of the disclosure header.\n * \n * @default 3\n */\n level?: number,\n /** The contents of the disclosure header. */\n children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n children: React.ReactNode\n}\n\nconst headingStyle = style({\n margin: 0,\n flexGrow: 1,\n display: 'flex',\n flexShrink: 1,\n minWidth: 0\n});\n\nconst buttonStyles = style({\n ...focusRing(),\n outlineOffset: -2,\n font: 'heading',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n fontWeight: 'bold',\n fontSize: {\n size: {\n S: 'heading-xs',\n M: 'heading-sm',\n L: 'heading',\n XL: 'heading-lg'\n }\n },\n lineHeight: 'ui',\n display: 'flex',\n flexGrow: 1,\n alignItems: 'baseline',\n paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n paddingY: centerPadding(),\n gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n minHeight: {\n // compact is equivalent to 'control', but other densities have more padding.\n size: {\n S: {\n density: {\n compact: 24,\n regular: 32,\n spacious: 40\n }\n },\n M: {\n density: {\n compact: 32,\n regular: 40,\n spacious: 48\n }\n },\n L: {\n density: {\n compact: 40,\n regular: 48,\n spacious: 56\n }\n },\n XL: {\n density: {\n compact: 48,\n regular: 56,\n spacious: 64\n }\n }\n }\n },\n width: 'full',\n backgroundColor: {\n default: 'transparent',\n isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n },\n transition: 'default',\n borderWidth: 0,\n borderRadius: {\n // Only rounded for keyboard focus and quiet.\n default: 'none',\n isFocusVisible: 'control',\n isQuiet: 'control'\n },\n textAlign: 'start',\n disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n rotate: {\n isRTL: 180,\n isExpanded: 90\n },\n transition: 'default',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_className,\n UNSAFE_style,\n children\n } = props;\n let domRef = useDOMRef(ref);\n let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n let mapSize = {\n S: 'XS',\n M: 'S',\n L: 'M',\n XL: 'L'\n };\n\n // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n if (density === 'compact') {\n newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n }\n\n return (\n <Provider\n values={[\n [ActionButtonContext, {size: newSize, isQuiet}],\n [InternalDisclosureHeader, {}]\n ]}>\n <div\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n ref={domRef}>\n {children}\n </div>\n </Provider>\n );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nexport const DisclosureTitle = forwardRef(function DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n let {\n level = 3,\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n const domProps = filterDOMProps(otherProps);\n let {direction} = useLocale();\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n let isRTL = direction === 'rtl';\n\n let buttonTrigger = (\n <Heading\n {...domProps}\n level={level}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + headingStyle}>\n <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n <CenterBaseline>\n <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n </CenterBaseline>\n {props.children}\n </Button>\n </Heading>\n );\n let ctx = useContext(InternalDisclosureHeader);\n if (ctx) {\n return buttonTrigger;\n }\n\n return (\n <DisclosureHeader>\n {buttonTrigger}\n </DisclosureHeader>\n );\n});\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n children: React.ReactNode\n}\n\nconst panelStyles = style({\n font: 'body',\n paddingTop: {\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: 16\n },\n paddingX: {\n isExpanded: {\n size: {\n S: 8,\n M: 9,\n L: 12,\n XL: 15\n }\n }\n }\n});\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nexport const DisclosurePanel = forwardRef(function DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n let {size} = useSlottedContext(DisclosureContext)!;\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let panelRef = useDOMRef(ref);\n return (\n <RACDisclosurePanel\n {...domProps}\n ref={panelRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n {props.children}\n </RACDisclosurePanel>\n );\n});\n\n"],"names":[],"version":3,"file":"Disclosure.css.map"}
|
package/dist/Disclosure.mjs
CHANGED
|
@@ -6,7 +6,7 @@ import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} fr
|
|
|
6
6
|
import {jsx as $7VHtn$jsx, jsxs as $7VHtn$jsxs} from "react/jsx-runtime";
|
|
7
7
|
import {Provider as $7VHtn$Provider, Disclosure as $7VHtn$Disclosure, useSlottedContext as $7VHtn$useSlottedContext, useLocale as $7VHtn$useLocale, DisclosureStateContext as $7VHtn$DisclosureStateContext, Heading as $7VHtn$Heading, Button as $7VHtn$Button, DisclosurePanel as $7VHtn$DisclosurePanel} from "react-aria-components";
|
|
8
8
|
import {filterDOMProps as $7VHtn$filterDOMProps} from "@react-aria/utils";
|
|
9
|
-
import {createContext as $7VHtn$createContext,
|
|
9
|
+
import {createContext as $7VHtn$createContext, forwardRef as $7VHtn$forwardRef, useContext as $7VHtn$useContext} from "react";
|
|
10
10
|
import {useDOMRef as $7VHtn$useDOMRef} from "@react-spectrum/utils";
|
|
11
11
|
|
|
12
12
|
/*
|
|
@@ -31,7 +31,7 @@ import {useDOMRef as $7VHtn$useDOMRef} from "@react-spectrum/utils";
|
|
|
31
31
|
const $cf1d656285911959$export$d665dd135a51b28a = /*#__PURE__*/ (0, $7VHtn$createContext)(null);
|
|
32
32
|
const $cf1d656285911959$var$disclosure = function anonymous(props, overrides) {
|
|
33
33
|
let rules = " .";
|
|
34
|
-
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|
|
|
34
|
+
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) || [];
|
|
35
35
|
rules += matches.join('');
|
|
36
36
|
let $q = false;
|
|
37
37
|
for (let p of matches)if (/^\s*q/.test(p)) $q = true;
|
|
@@ -51,7 +51,7 @@ const $cf1d656285911959$var$disclosure = function anonymous(props, overrides) {
|
|
|
51
51
|
if (!$q) rules += ' q___C';
|
|
52
52
|
return rules;
|
|
53
53
|
};
|
|
54
|
-
|
|
54
|
+
const $cf1d656285911959$export$74a362b31437ec83 = /*#__PURE__*/ (0, $7VHtn$forwardRef)(function Disclosure(props, ref) {
|
|
55
55
|
[props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $cf1d656285911959$export$d665dd135a51b28a);
|
|
56
56
|
let { size: size = 'M', density: density = 'regular', isQuiet: isQuiet, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '' } = props;
|
|
57
57
|
let domRef = (0, $7VHtn$useDOMRef)(ref);
|
|
@@ -78,43 +78,40 @@ function $cf1d656285911959$var$Disclosure(props, ref) {
|
|
|
78
78
|
children: props.children
|
|
79
79
|
})
|
|
80
80
|
});
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
* A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.
|
|
84
|
-
*/ let $cf1d656285911959$export$74a362b31437ec83 = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$Disclosure);
|
|
85
|
-
const $cf1d656285911959$var$headingStyle = " . Aa Ba ya za _9-3t1y _Zd _8-3t1y qo";
|
|
81
|
+
});
|
|
82
|
+
const $cf1d656285911959$var$headingStyle = " Aa Ba ya za __a-3t1y _0d _9-3t1y qo";
|
|
86
83
|
const $cf1d656285911959$var$buttonStyles = function anonymous(props) {
|
|
87
84
|
let rules = " .";
|
|
88
|
-
if (props.isFocusVisible) rules += '
|
|
89
|
-
else rules += '
|
|
90
|
-
rules += '
|
|
85
|
+
if (props.isFocusVisible) rules += ' _Mb';
|
|
86
|
+
else rules += ' _Ma';
|
|
87
|
+
rules += ' da_____M';
|
|
91
88
|
rules += ' dx';
|
|
92
|
-
rules += '
|
|
93
|
-
rules += '
|
|
94
|
-
rules += '
|
|
95
|
-
rules += '
|
|
96
|
-
rules += '
|
|
97
|
-
rules += '
|
|
98
|
-
rules += '
|
|
99
|
-
rules += '
|
|
100
|
-
rules += '
|
|
101
|
-
rules += '
|
|
89
|
+
rules += ' _Oc';
|
|
90
|
+
rules += ' _N-3hmpw';
|
|
91
|
+
rules += ' _d-bc1l9oh';
|
|
92
|
+
rules += ' _d-1uotwbwg';
|
|
93
|
+
rules += ' _d-eo0c6sf';
|
|
94
|
+
rules += ' _d-enzzrge';
|
|
95
|
+
rules += ' _d-enzykdd';
|
|
96
|
+
rules += ' _d-enzwzjc';
|
|
97
|
+
rules += ' _d-enzrfpb';
|
|
98
|
+
rules += ' _da';
|
|
102
99
|
if (props.size === "XL") {
|
|
103
|
-
rules += '
|
|
104
|
-
rules += '
|
|
100
|
+
rules += ' _ebo';
|
|
101
|
+
rules += ' _en';
|
|
105
102
|
} else if (props.size === "L") {
|
|
106
|
-
rules += '
|
|
107
|
-
rules += '
|
|
103
|
+
rules += ' _ebm';
|
|
104
|
+
rules += ' _ej';
|
|
108
105
|
} else if (props.size === "M") {
|
|
109
|
-
rules += '
|
|
110
|
-
rules += '
|
|
106
|
+
rules += ' _ebl';
|
|
107
|
+
rules += ' _ek';
|
|
111
108
|
} else if (props.size === "S") {
|
|
112
|
-
rules += '
|
|
113
|
-
rules += '
|
|
109
|
+
rules += ' _ebj';
|
|
110
|
+
rules += ' _ei';
|
|
114
111
|
}
|
|
115
|
-
rules += '
|
|
116
|
-
rules += '
|
|
117
|
-
rules += '
|
|
112
|
+
rules += ' _fd';
|
|
113
|
+
rules += ' _g-1x99dlob';
|
|
114
|
+
rules += ' _ga';
|
|
118
115
|
if (props.isDisabled) rules += ' aj';
|
|
119
116
|
else {
|
|
120
117
|
if (props.isPressed) rules += ' ao';
|
|
@@ -122,9 +119,9 @@ const $cf1d656285911959$var$buttonStyles = function anonymous(props) {
|
|
|
122
119
|
else if (props.isHovered) rules += ' ao';
|
|
123
120
|
else rules += ' an';
|
|
124
121
|
}
|
|
125
|
-
rules += '
|
|
126
|
-
rules += '
|
|
127
|
-
rules += '
|
|
122
|
+
rules += ' _0d';
|
|
123
|
+
rules += ' __a-3t1y';
|
|
124
|
+
rules += ' _2d';
|
|
128
125
|
rules += ' C-10cd9hn';
|
|
129
126
|
rules += ' D-10cd9hn';
|
|
130
127
|
rules += ' E-1dbqcch';
|
|
@@ -137,16 +134,13 @@ const $cf1d656285911959$var$buttonStyles = function anonymous(props) {
|
|
|
137
134
|
else if (props.isHovered) rules += ' b-1tgz9bq';
|
|
138
135
|
else if (props.isFocusVisible) rules += ' b-1tgz9bq';
|
|
139
136
|
else rules += ' ba';
|
|
140
|
-
rules += '
|
|
141
|
-
rules += '
|
|
142
|
-
rules += '
|
|
137
|
+
rules += ' _Pa';
|
|
138
|
+
rules += ' _R-375x7f';
|
|
139
|
+
rules += ' _Sa';
|
|
143
140
|
rules += ' u-375tp0';
|
|
144
141
|
rules += ' v-375tp1';
|
|
145
142
|
rules += ' sa';
|
|
146
143
|
rules += ' ta';
|
|
147
|
-
if (props.isQuiet) rules += ' _vh';
|
|
148
|
-
else if (props.isFocusVisible) rules += ' _vh';
|
|
149
|
-
else rules += ' _va';
|
|
150
144
|
if (props.isQuiet) rules += ' _wh';
|
|
151
145
|
else if (props.isFocusVisible) rules += ' _wh';
|
|
152
146
|
else rules += ' _wa';
|
|
@@ -156,8 +150,11 @@ const $cf1d656285911959$var$buttonStyles = function anonymous(props) {
|
|
|
156
150
|
if (props.isQuiet) rules += ' _yh';
|
|
157
151
|
else if (props.isFocusVisible) rules += ' _yh';
|
|
158
152
|
else rules += ' _ya';
|
|
159
|
-
rules += '
|
|
160
|
-
rules += '
|
|
153
|
+
if (props.isQuiet) rules += ' _zh';
|
|
154
|
+
else if (props.isFocusVisible) rules += ' _zh';
|
|
155
|
+
else rules += ' _za';
|
|
156
|
+
rules += ' _ka';
|
|
157
|
+
rules += ' __S-yksgrp';
|
|
161
158
|
if (props.size === "XL") {
|
|
162
159
|
if (props.density === "spacious") rules += ' -_375tou_o-_q';
|
|
163
160
|
else if (props.density === "regular") rules += ' -_375tou_o-_i';
|
|
@@ -183,11 +180,11 @@ const $cf1d656285911959$var$chevronStyles = function anonymous(props) {
|
|
|
183
180
|
let rules = " .";
|
|
184
181
|
if (props.isExpanded) rules += ' R-3hn0u';
|
|
185
182
|
else if (props.isRTL) rules += ' R-375xa6';
|
|
186
|
-
rules += '
|
|
187
|
-
rules += '
|
|
188
|
-
rules += '
|
|
183
|
+
rules += ' _Pa';
|
|
184
|
+
rules += ' _R-375x7f';
|
|
185
|
+
rules += ' _Sa';
|
|
189
186
|
rules += ' -rwx0fg_e-b';
|
|
190
|
-
rules += '
|
|
187
|
+
rules += ' _9-3t1x';
|
|
191
188
|
return rules;
|
|
192
189
|
};
|
|
193
190
|
const $cf1d656285911959$var$InternalDisclosureHeader = /*#__PURE__*/ (0, $7VHtn$createContext)(null);
|
|
@@ -220,14 +217,14 @@ function $cf1d656285911959$var$DisclosureHeaderWithForwardRef(props, ref) {
|
|
|
220
217
|
],
|
|
221
218
|
children: /*#__PURE__*/ (0, $7VHtn$jsx)("div", {
|
|
222
219
|
style: UNSAFE_style,
|
|
223
|
-
className: (UNSAFE_className ?? '') + "
|
|
220
|
+
className: (UNSAFE_className ?? '') + " _0d _2c ic jc",
|
|
224
221
|
ref: domRef,
|
|
225
222
|
children: children
|
|
226
223
|
})
|
|
227
224
|
});
|
|
228
225
|
}
|
|
229
226
|
const $cf1d656285911959$export$1e037ddd32f5b8ac = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$DisclosureHeaderWithForwardRef);
|
|
230
|
-
|
|
227
|
+
const $cf1d656285911959$export$7843c6a5b3e340a2 = /*#__PURE__*/ (0, $7VHtn$forwardRef)(function DisclosureTitle(props, ref) {
|
|
231
228
|
let { level: level = 3, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', ...otherProps } = props;
|
|
232
229
|
let domRef = (0, $7VHtn$useDOMRef)(ref);
|
|
233
230
|
const domProps = (0, $7VHtn$filterDOMProps)(otherProps);
|
|
@@ -269,25 +266,22 @@ function $cf1d656285911959$var$DisclosureTitle(props, ref) {
|
|
|
269
266
|
return /*#__PURE__*/ (0, $7VHtn$jsx)($cf1d656285911959$export$1e037ddd32f5b8ac, {
|
|
270
267
|
children: buttonTrigger
|
|
271
268
|
});
|
|
272
|
-
}
|
|
273
|
-
/**
|
|
274
|
-
* A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.
|
|
275
|
-
*/ let $cf1d656285911959$export$7843c6a5b3e340a2 = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$DisclosureTitle);
|
|
269
|
+
});
|
|
276
270
|
const $cf1d656285911959$var$panelStyles = function anonymous(props) {
|
|
277
271
|
let rules = " .";
|
|
278
|
-
rules += '
|
|
279
|
-
rules += '
|
|
280
|
-
rules += '
|
|
281
|
-
rules += '
|
|
282
|
-
rules += '
|
|
283
|
-
rules += '
|
|
284
|
-
rules += '
|
|
285
|
-
rules += '
|
|
286
|
-
rules += '
|
|
287
|
-
rules += '
|
|
288
|
-
rules += ' _eb';
|
|
289
|
-
rules += ' _f-1x99dloc';
|
|
272
|
+
rules += ' _d-bc1l9oh';
|
|
273
|
+
rules += ' _d-1uotwbwg';
|
|
274
|
+
rules += ' _d-eo0c6sf';
|
|
275
|
+
rules += ' _d-enzzrge';
|
|
276
|
+
rules += ' _d-enzykdd';
|
|
277
|
+
rules += ' _d-enzwzjc';
|
|
278
|
+
rules += ' _d-enzrfpb';
|
|
279
|
+
rules += ' _da';
|
|
280
|
+
rules += ' _ebh';
|
|
281
|
+
rules += ' _eg';
|
|
290
282
|
rules += ' _fb';
|
|
283
|
+
rules += ' _g-1x99dloc';
|
|
284
|
+
rules += ' _gb';
|
|
291
285
|
rules += ' an';
|
|
292
286
|
if (props.isExpanded) rules += ' Ed';
|
|
293
287
|
if (props.isExpanded) rules += ' Ff';
|
|
@@ -305,7 +299,7 @@ const $cf1d656285911959$var$panelStyles = function anonymous(props) {
|
|
|
305
299
|
}
|
|
306
300
|
return rules;
|
|
307
301
|
};
|
|
308
|
-
|
|
302
|
+
const $cf1d656285911959$export$feabaa331e1d464c = /*#__PURE__*/ (0, $7VHtn$forwardRef)(function DisclosurePanel(props, ref) {
|
|
309
303
|
let { UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '', ...otherProps } = props;
|
|
310
304
|
const domProps = (0, $7VHtn$filterDOMProps)(otherProps);
|
|
311
305
|
let { size: size } = (0, $7VHtn$useSlottedContext)($cf1d656285911959$export$d665dd135a51b28a);
|
|
@@ -321,10 +315,7 @@ function $cf1d656285911959$var$DisclosurePanel(props, ref) {
|
|
|
321
315
|
}),
|
|
322
316
|
children: props.children
|
|
323
317
|
});
|
|
324
|
-
}
|
|
325
|
-
/**
|
|
326
|
-
* A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.
|
|
327
|
-
*/ let $cf1d656285911959$export$feabaa331e1d464c = /*#__PURE__*/ (0, $7VHtn$forwardRef)($cf1d656285911959$var$DisclosurePanel);
|
|
318
|
+
});
|
|
328
319
|
|
|
329
320
|
|
|
330
321
|
export {$cf1d656285911959$export$d665dd135a51b28a as DisclosureContext, $cf1d656285911959$export$74a362b31437ec83 as Disclosure, $cf1d656285911959$export$1e037ddd32f5b8ac as DisclosureHeader, $cf1d656285911959$export$7843c6a5b3e340a2 as DisclosureTitle, $cf1d656285911959$export$feabaa331e1d464c as DisclosurePanel};
|
package/dist/Disclosure.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Disclosure.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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n /**\n * The size of the disclosure.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The amount of space between the disclosures.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the disclosure should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Omit<DisclosureProps, 'children'>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n color: 'heading',\n borderTopWidth: {\n default: 1,\n isQuiet: 0\n },\n borderBottomWidth: {\n default: 1,\n isQuiet: 0,\n isInGroup: {\n default: 0,\n ':last-child': {\n default: 1,\n isQuiet: 0\n }\n }\n },\n borderStartWidth: 0,\n borderEndWidth: 0,\n borderStyle: 'solid',\n borderColor: 'gray-200',\n minWidth: 200\n}, getAllowedOverrides());\n\nfunction Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n let {\n size = 'M',\n density = 'regular',\n isQuiet,\n UNSAFE_style,\n UNSAFE_className = ''\n } = props;\n let domRef = useDOMRef(ref);\n\n let isInGroup = useContext(DisclosureContext) !== null;\n\n return (\n <Provider\n values={[\n [DisclosureContext, {size, isQuiet, density}]\n ]}>\n <RACDisclosure\n {...props}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n {props.children}\n </RACDisclosure>\n </Provider>\n );\n}\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nlet _Disclosure = forwardRef(Disclosure);\nexport {_Disclosure as Disclosure};\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n /** The heading level of the disclosure header.\n * \n * @default 3\n */\n level?: number,\n /** The contents of the disclosure header. */\n children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n children: React.ReactNode\n}\n\nconst headingStyle = style({\n margin: 0,\n flexGrow: 1,\n display: 'flex',\n flexShrink: 1,\n minWidth: 0\n});\n\nconst buttonStyles = style({\n ...focusRing(),\n outlineOffset: -2,\n font: 'heading',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n fontWeight: 'bold',\n fontSize: {\n size: {\n S: 'heading-xs',\n M: 'heading-sm',\n L: 'heading',\n XL: 'heading-lg'\n }\n },\n lineHeight: 'ui',\n display: 'flex',\n flexGrow: 1,\n alignItems: 'baseline',\n paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n paddingY: centerPadding(),\n gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n minHeight: {\n // compact is equivalent to 'control', but other densities have more padding.\n size: {\n S: {\n density: {\n compact: 24,\n regular: 32,\n spacious: 40\n }\n },\n M: {\n density: {\n compact: 32,\n regular: 40,\n spacious: 48\n }\n },\n L: {\n density: {\n compact: 40,\n regular: 48,\n spacious: 56\n }\n },\n XL: {\n density: {\n compact: 48,\n regular: 56,\n spacious: 64\n }\n }\n }\n },\n width: 'full',\n backgroundColor: {\n default: 'transparent',\n isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n },\n transition: 'default',\n borderWidth: 0,\n borderRadius: {\n // Only rounded for keyboard focus and quiet.\n default: 'none',\n isFocusVisible: 'control',\n isQuiet: 'control'\n },\n textAlign: 'start',\n disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n rotate: {\n isRTL: 180,\n isExpanded: 90\n },\n transition: 'default',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_className,\n UNSAFE_style,\n children\n } = props;\n let domRef = useDOMRef(ref);\n let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n let mapSize = {\n S: 'XS',\n M: 'S',\n L: 'M',\n XL: 'L'\n };\n\n // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n if (density === 'compact') {\n newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n }\n\n return (\n <Provider\n values={[\n [ActionButtonContext, {size: newSize, isQuiet}],\n [InternalDisclosureHeader, {}]\n ]}>\n <div\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n ref={domRef}>\n {children}\n </div>\n </Provider>\n );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\nfunction DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n let {\n level = 3,\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n const domProps = filterDOMProps(otherProps);\n let {direction} = useLocale();\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n let isRTL = direction === 'rtl';\n\n let buttonTrigger = (\n <Heading\n {...domProps}\n level={level}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + headingStyle}>\n <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n <CenterBaseline>\n <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n </CenterBaseline>\n {props.children}\n </Button>\n </Heading>\n );\n let ctx = useContext(InternalDisclosureHeader);\n if (ctx) {\n return buttonTrigger;\n }\n\n return (\n <DisclosureHeader>\n {buttonTrigger}\n </DisclosureHeader>\n );\n}\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nlet _DisclosureTitle = forwardRef(DisclosureTitle);\nexport {_DisclosureTitle as DisclosureTitle};\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n children: React.ReactNode\n}\n\nconst panelStyles = style({\n font: 'body',\n paddingTop: {\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: 16\n },\n paddingX: {\n isExpanded: {\n size: {\n S: 8,\n M: 9,\n L: 12,\n XL: 15\n }\n }\n }\n});\n\nfunction DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n let {size} = useSlottedContext(DisclosureContext)!;\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let panelRef = useDOMRef(ref);\n return (\n <RACDisclosurePanel\n {...domProps}\n ref={panelRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n {props.children}\n </RACDisclosurePanel>\n );\n}\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nlet _DisclosurePanel = forwardRef(DisclosurePanel);\nexport {_DisclosurePanel as DisclosurePanel};\n\n"],"names":[],"version":3,"file":"Disclosure.mjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Disclosure.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 {ActionButtonContext} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, DOMRef, DOMRefValue, forwardRefType} from '@react-types/shared';\nimport {Button, ContextValue, DisclosureStateContext, Heading, Provider, Disclosure as RACDisclosure, DisclosurePanel as RACDisclosurePanel, DisclosurePanelProps as RACDisclosurePanelProps, DisclosureProps as RACDisclosureProps, useLocale, useSlottedContext} from 'react-aria-components';\nimport {CenterBaseline} from './CenterBaseline';\nimport {centerPadding, getAllowedOverrides, StyleProps, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport Chevron from '../ui-icons/Chevron';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {focusRing, lightDark, style} from '../style' with { type: 'macro' };\nimport React, {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface DisclosureProps extends Omit<RACDisclosureProps, 'className' | 'style' | 'children'>, StyleProps {\n /**\n * The size of the disclosure.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The amount of space between the disclosures.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the disclosure should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The contents of the disclosure, consisting of a DisclosureTitle and DisclosurePanel. */\n children: ReactNode\n}\n\nexport const DisclosureContext = createContext<ContextValue<Partial<DisclosureProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst disclosure = style({\n color: 'heading',\n borderTopWidth: {\n default: 1,\n isQuiet: 0\n },\n borderBottomWidth: {\n default: 1,\n isQuiet: 0,\n isInGroup: {\n default: 0,\n ':last-child': {\n default: 1,\n isQuiet: 0\n }\n }\n },\n borderStartWidth: 0,\n borderEndWidth: 0,\n borderStyle: 'solid',\n borderColor: 'gray-200',\n minWidth: 200\n}, getAllowedOverrides());\n\n/**\n * A disclosure is a collapsible section of content. It is composed of a a header with a heading and trigger button, and a panel that contains the content.\n */\nexport const Disclosure = forwardRef(function Disclosure(props: DisclosureProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, DisclosureContext);\n let {\n size = 'M',\n density = 'regular',\n isQuiet,\n UNSAFE_style,\n UNSAFE_className = ''\n } = props;\n let domRef = useDOMRef(ref);\n\n let isInGroup = useContext(DisclosureContext) !== null;\n\n return (\n <Provider\n values={[\n [DisclosureContext, {size, isQuiet, density}]\n ]}>\n <RACDisclosure\n {...props}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + disclosure({isQuiet, isInGroup}, props.styles)}>\n {props.children}\n </RACDisclosure>\n </Provider>\n );\n});\n\nexport interface DisclosureTitleProps extends UnsafeStyles, DOMProps {\n /** The heading level of the disclosure header.\n * \n * @default 3\n */\n level?: number,\n /** The contents of the disclosure header. */\n children: React.ReactNode\n}\n\ninterface DisclosureHeaderProps extends UnsafeStyles, DOMProps {\n children: React.ReactNode\n}\n\nconst headingStyle = style({\n margin: 0,\n flexGrow: 1,\n display: 'flex',\n flexShrink: 1,\n minWidth: 0\n});\n\nconst buttonStyles = style({\n ...focusRing(),\n outlineOffset: -2,\n font: 'heading',\n color: {\n default: 'neutral',\n isDisabled: 'disabled'\n },\n fontWeight: 'bold',\n fontSize: {\n size: {\n S: 'heading-xs',\n M: 'heading-sm',\n L: 'heading',\n XL: 'heading-lg'\n }\n },\n lineHeight: 'ui',\n display: 'flex',\n flexGrow: 1,\n alignItems: 'baseline',\n paddingX: '[calc(self(minHeight) * 3/8 - 1px)]',\n paddingY: centerPadding(),\n gap: '[calc(self(minHeight) * 3/8 - 1px)]',\n minHeight: {\n // compact is equivalent to 'control', but other densities have more padding.\n size: {\n S: {\n density: {\n compact: 24,\n regular: 32,\n spacious: 40\n }\n },\n M: {\n density: {\n compact: 32,\n regular: 40,\n spacious: 48\n }\n },\n L: {\n density: {\n compact: 40,\n regular: 48,\n spacious: 56\n }\n },\n XL: {\n density: {\n compact: 48,\n regular: 56,\n spacious: 64\n }\n }\n }\n },\n width: 'full',\n backgroundColor: {\n default: 'transparent',\n isFocusVisible: lightDark('transparent-black-100', 'transparent-white-100'),\n isHovered: lightDark('transparent-black-100', 'transparent-white-100'),\n isPressed: lightDark('transparent-black-300', 'transparent-white-300')\n },\n transition: 'default',\n borderWidth: 0,\n borderRadius: {\n // Only rounded for keyboard focus and quiet.\n default: 'none',\n isFocusVisible: 'control',\n isQuiet: 'control'\n },\n textAlign: 'start',\n disableTapHighlight: true\n});\n\nconst chevronStyles = style({\n rotate: {\n isRTL: 180,\n isExpanded: 90\n },\n transition: 'default',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n flexShrink: 0\n});\n\nconst InternalDisclosureHeader = createContext<{} | null>(null);\n\nfunction DisclosureHeaderWithForwardRef(props: DisclosureHeaderProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_className,\n UNSAFE_style,\n children\n } = props;\n let domRef = useDOMRef(ref);\n let {size, isQuiet, density} = useSlottedContext(DisclosureContext)!;\n\n let mapSize = {\n S: 'XS',\n M: 'S',\n L: 'M',\n XL: 'L'\n };\n\n // maps to one size smaller in the compact density to ensure there is space between the top and bottom of the action button and container\n let newSize : 'XS' | 'S' | 'M' | 'L' | 'XL' | undefined = size;\n if (density === 'compact') {\n newSize = mapSize[size ?? 'M'] as 'XS' | 'S' | 'M' | 'L';\n }\n\n return (\n <Provider\n values={[\n [ActionButtonContext, {size: newSize, isQuiet}],\n [InternalDisclosureHeader, {}]\n ]}>\n <div\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + style({display: 'flex', alignItems: 'center', gap: 4})}\n ref={domRef}>\n {children}\n </div>\n </Provider>\n );\n}\n\n/**\n * A wrapper element for the disclosure title that can contain other elements not part of the trigger.\n */\nexport const DisclosureHeader = /*#__PURE__*/ (forwardRef as forwardRefType)(DisclosureHeaderWithForwardRef);\n\n/**\n * A disclosure title consisting of a heading and a trigger button to expand/collapse the panel.\n */\nexport const DisclosureTitle = forwardRef(function DisclosureTitle(props: DisclosureTitleProps, ref: DOMRef<HTMLDivElement>) {\n let {\n level = 3,\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n const domProps = filterDOMProps(otherProps);\n let {direction} = useLocale();\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let {size, density, isQuiet} = useSlottedContext(DisclosureContext)!;\n let isRTL = direction === 'rtl';\n\n let buttonTrigger = (\n <Heading\n {...domProps}\n level={level}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + headingStyle}>\n <Button className={(renderProps) => buttonStyles({...renderProps, size, density, isQuiet})} slot=\"trigger\">\n <CenterBaseline>\n <Chevron size={size} className={chevronStyles({isExpanded, isRTL})} aria-hidden=\"true\" />\n </CenterBaseline>\n {props.children}\n </Button>\n </Heading>\n );\n let ctx = useContext(InternalDisclosureHeader);\n if (ctx) {\n return buttonTrigger;\n }\n\n return (\n <DisclosureHeader>\n {buttonTrigger}\n </DisclosureHeader>\n );\n});\n\nexport interface DisclosurePanelProps extends Omit<RACDisclosurePanelProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, AriaLabelingProps {\n children: React.ReactNode\n}\n\nconst panelStyles = style({\n font: 'body',\n paddingTop: {\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: 16\n },\n paddingX: {\n isExpanded: {\n size: {\n S: 8,\n M: 9,\n L: 12,\n XL: 15\n }\n }\n }\n});\n\n/**\n * A disclosure panel is a collapsible section of content that is hidden until the disclosure is expanded.\n */\nexport const DisclosurePanel = forwardRef(function DisclosurePanel(props: DisclosurePanelProps, ref: DOMRef<HTMLDivElement>) {\n let {\n UNSAFE_style,\n UNSAFE_className = '',\n ...otherProps\n } = props;\n const domProps = filterDOMProps(otherProps);\n let {size} = useSlottedContext(DisclosureContext)!;\n let {isExpanded} = useContext(DisclosureStateContext)!;\n let panelRef = useDOMRef(ref);\n return (\n <RACDisclosurePanel\n {...domProps}\n ref={panelRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + panelStyles({size, isExpanded})}>\n {props.children}\n </RACDisclosurePanel>\n );\n});\n\n"],"names":[],"version":3,"file":"Disclosure.mjs.map"}
|
package/dist/Divider.cjs
CHANGED
|
@@ -31,37 +31,36 @@ $parcel$export(module.exports, "Divider", () => $2d04acb918636de0$export$2e0a83e
|
|
|
31
31
|
const $2d04acb918636de0$export$30fbfd376abdf190 = /*#__PURE__*/ (0, $98jss$react.createContext)(null);
|
|
32
32
|
const $2d04acb918636de0$export$e8c9778bf415dd08 = function anonymous(props, overrides) {
|
|
33
33
|
let rules = " .";
|
|
34
|
-
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|
|
|
34
|
+
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) || [];
|
|
35
35
|
rules += matches.join('');
|
|
36
|
-
let $
|
|
36
|
+
let $_5 = false;
|
|
37
37
|
let $A = false;
|
|
38
38
|
let $B = false;
|
|
39
39
|
let $y = false;
|
|
40
40
|
let $z = false;
|
|
41
41
|
let $l = false;
|
|
42
42
|
for (let p of matches){
|
|
43
|
-
if (/^\s*
|
|
43
|
+
if (/^\s*_5/.test(p)) $_5 = true;
|
|
44
44
|
if (/^\s*A/.test(p)) $A = true;
|
|
45
45
|
if (/^\s*B/.test(p)) $B = true;
|
|
46
46
|
if (/^\s*y/.test(p)) $y = true;
|
|
47
47
|
if (/^\s*z/.test(p)) $z = true;
|
|
48
48
|
if (/^\s*l/.test(p)) $l = true;
|
|
49
49
|
}
|
|
50
|
-
if (
|
|
51
|
-
rules += '
|
|
52
|
-
if (
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
else rules += ' b____8';
|
|
50
|
+
if (props.staticColor === "white") rules += ' -_1de2x0q_b-b';
|
|
51
|
+
else if (props.staticColor === "black") rules += ' -_1de2x0q_b-c';
|
|
52
|
+
if (!$_5) rules += ' _5e';
|
|
53
|
+
rules += ' ba_____I';
|
|
54
|
+
if (props.isStaticColor) {
|
|
55
|
+
if (props.size === "L") rules += ' b_____E';
|
|
56
|
+
else rules += ' b_____y';
|
|
58
57
|
} else if (props.size === "L") rules += ' bn';
|
|
59
58
|
else rules += ' bh';
|
|
60
59
|
rules += ' wf';
|
|
61
|
-
rules += ' _vf';
|
|
62
60
|
rules += ' _wf';
|
|
63
61
|
rules += ' _xf';
|
|
64
62
|
rules += ' _yf';
|
|
63
|
+
rules += ' _zf';
|
|
65
64
|
if (!$A) rules += ' Aa';
|
|
66
65
|
if (!$B) rules += ' Ba';
|
|
67
66
|
if (!$y) rules += ' ya';
|
|
@@ -80,7 +79,7 @@ const $2d04acb918636de0$export$e8c9778bf415dd08 = function anonymous(props, over
|
|
|
80
79
|
}
|
|
81
80
|
return rules;
|
|
82
81
|
};
|
|
83
|
-
|
|
82
|
+
const $2d04acb918636de0$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $98jss$react.forwardRef)(function Divider(props, ref) {
|
|
84
83
|
[props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $2d04acb918636de0$export$30fbfd376abdf190);
|
|
85
84
|
let domRef = (0, $98jss$reactspectrumutils.useDOMRef)(ref);
|
|
86
85
|
return /*#__PURE__*/ (0, $98jss$reactjsxruntime.jsx)((0, $98jss$reactariacomponents.Separator), {
|
|
@@ -90,14 +89,11 @@ function $2d04acb918636de0$var$Divider(props, ref) {
|
|
|
90
89
|
className: (props.UNSAFE_className || '') + $2d04acb918636de0$export$e8c9778bf415dd08({
|
|
91
90
|
size: props.size || 'M',
|
|
92
91
|
orientation: props.orientation || 'horizontal',
|
|
93
|
-
staticColor: props.staticColor
|
|
92
|
+
staticColor: props.staticColor,
|
|
93
|
+
isStaticColor: !!props.staticColor
|
|
94
94
|
}, props.styles)
|
|
95
95
|
});
|
|
96
|
-
}
|
|
97
|
-
/**
|
|
98
|
-
* Dividers bring clarity to a layout by grouping and dividing content in close proximity.
|
|
99
|
-
* They can also be used to establish rhythm and hierarchy.
|
|
100
|
-
*/ let $2d04acb918636de0$export$2e0a83ec2e27ecbb = /*#__PURE__*/ (0, $98jss$react.forwardRef)($2d04acb918636de0$var$Divider);
|
|
96
|
+
});
|
|
101
97
|
|
|
102
98
|
|
|
103
99
|
//# sourceMappingURL=Divider.cjs.map
|
package/dist/Divider.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,0BAAY,
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgCM,MAAM,0DAAiB,CAAA,GAAA,0BAAY,EAAoD;AAEvF,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDN,MAAM,4CAAU,WAAW,GAAG,CAAA,GAAA,uBAAS,EAAE,SAAS,QAAQ,KAAmB,EAAE,GAAW;IAC/F,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,oCAAW;QACT,GAAG,KAAK;QACT,KAAK;QACL,OAAO,MAAM,YAAY;QACzB,WAAW,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAQ;YAClD,MAAM,MAAM,IAAI,IAAI;YACpB,aAAa,MAAM,WAAW,IAAI;YAClC,aAAa,MAAM,WAAW;YAC9B,eAAe,CAAC,CAAC,MAAM,WAAW;QACpC,GAAG,MAAM,MAAM;;AAErB","sources":["packages/@react-spectrum/s2/src/Divider.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 {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n /**\n * How thick the Divider should be.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L',\n /**\n * How thick the Divider should be.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical',\n /** The static color style to apply. Useful when the Divider appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<Partial<DividerProps>, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps & {isStaticColor: boolean}>({\n ...staticColor(),\n alignSelf: 'stretch',\n backgroundColor: {\n default: 'gray-200',\n size: {\n L: 'gray-800'\n },\n isStaticColor: {\n default: 'transparent-overlay-200',\n size: {\n L: 'transparent-overlay-800'\n }\n },\n forcedColors: 'ButtonBorder'\n },\n borderStyle: 'none',\n borderRadius: 'full',\n margin: 0,\n height: {\n orientation: {\n horizontal: {\n // These should be px not rems, because we're emulating a border.\n default: '[2px]',\n size: {\n S: '[1px]',\n L: '[4px]'\n }\n }\n }\n },\n width: {\n orientation: {\n vertical: {\n default: '[2px]',\n size: {\n S: '[1px]',\n L: '[4px]'\n }\n }\n }\n }\n}, getAllowedOverrides());\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nexport const Divider = /*#__PURE__*/ forwardRef(function Divider(props: DividerProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n let domRef = useDOMRef(ref);\n\n return (\n <RACSeparator\n {...props}\n ref={domRef}\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + divider({\n size: props.size || 'M',\n orientation: props.orientation || 'horizontal',\n staticColor: props.staticColor,\n isStaticColor: !!props.staticColor\n }, props.styles)} />\n );\n});\n"],"names":[],"version":3,"file":"Divider.cjs.map"}
|
package/dist/Divider.css
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
.\.:not(#a#b) {
|
|
2
|
-
all: revert-layer;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
1
|
@layer _.a {
|
|
6
|
-
|
|
2
|
+
.-_1de2x0q_b-c {
|
|
3
|
+
--s2-container-bg: white;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.-_1de2x0q_b-b {
|
|
7
|
+
--s2-container-bg: black;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
._5e {
|
|
7
11
|
align-self: stretch;
|
|
8
12
|
}
|
|
9
13
|
|
|
@@ -15,39 +19,31 @@
|
|
|
15
19
|
background-color: var(--lightningcss-light, #292929) var(--lightningcss-dark, #dbdbdb);
|
|
16
20
|
}
|
|
17
21
|
|
|
18
|
-
.
|
|
19
|
-
background-color:
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
.b_____e {
|
|
23
|
-
background-color: #ffffffd9;
|
|
22
|
+
.b_____y {
|
|
23
|
+
background-color: lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / .14);
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
.
|
|
27
|
-
background-color:
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.b_____r {
|
|
31
|
-
background-color: #000000d6;
|
|
26
|
+
.b_____E {
|
|
27
|
+
background-color: lch(from var(--s2-container-bg) calc((49.44 - l) * infinity) 0 0 / .85);
|
|
32
28
|
}
|
|
33
29
|
|
|
34
30
|
.wf {
|
|
35
31
|
border-style: none;
|
|
36
32
|
}
|
|
37
33
|
|
|
38
|
-
.
|
|
34
|
+
._wf {
|
|
39
35
|
border-start-start-radius: 9999px;
|
|
40
36
|
}
|
|
41
37
|
|
|
42
|
-
.
|
|
38
|
+
._xf {
|
|
43
39
|
border-start-end-radius: 9999px;
|
|
44
40
|
}
|
|
45
41
|
|
|
46
|
-
.
|
|
42
|
+
._yf {
|
|
47
43
|
border-end-start-radius: 9999px;
|
|
48
44
|
}
|
|
49
45
|
|
|
50
|
-
.
|
|
46
|
+
._zf {
|
|
51
47
|
border-end-end-radius: 9999px;
|
|
52
48
|
}
|
|
53
49
|
|
|
@@ -92,11 +88,11 @@
|
|
|
92
88
|
}
|
|
93
89
|
}
|
|
94
90
|
|
|
95
|
-
@layer _.b
|
|
91
|
+
@layer _.b;
|
|
96
92
|
|
|
97
93
|
@layer _.b.a {
|
|
98
94
|
@media (forced-colors: active) {
|
|
99
|
-
.
|
|
95
|
+
.ba_____I {
|
|
100
96
|
background-color: buttonborder;
|
|
101
97
|
}
|
|
102
98
|
}
|
package/dist/Divider.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AA4CuB
|
|
1
|
+
{"mappings":"AA4CuB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA;;AAAA;EAAA;IAAA","sources":["packages/@react-spectrum/s2/src/Divider.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 {ContextValue, Separator as RACSeparator, SeparatorProps as RACSeparatorProps} from 'react-aria-components';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n/*\n * Adding as it's own type to deal with size being a part of the theme so we\n * can type style() and it's parameters.\n */\ninterface DividerSpectrumProps {\n /**\n * How thick the Divider should be.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L',\n /**\n * How thick the Divider should be.\n * @default 'horizontal'\n */\n orientation?: 'horizontal' | 'vertical',\n /** The static color style to apply. Useful when the Divider appears over a color background. */\n staticColor?: 'white' | 'black' | 'auto'\n}\n\n// TODO: allow overriding height (only when orientation is vertical)??\nexport interface DividerProps extends DividerSpectrumProps, Omit<RACSeparatorProps, 'className' | 'style' | 'elementType'>, StyleProps {}\n\nexport const DividerContext = createContext<ContextValue<Partial<DividerProps>, DOMRefValue>>(null);\n\nexport const divider = style<DividerSpectrumProps & {isStaticColor: boolean}>({\n ...staticColor(),\n alignSelf: 'stretch',\n backgroundColor: {\n default: 'gray-200',\n size: {\n L: 'gray-800'\n },\n isStaticColor: {\n default: 'transparent-overlay-200',\n size: {\n L: 'transparent-overlay-800'\n }\n },\n forcedColors: 'ButtonBorder'\n },\n borderStyle: 'none',\n borderRadius: 'full',\n margin: 0,\n height: {\n orientation: {\n horizontal: {\n // These should be px not rems, because we're emulating a border.\n default: '[2px]',\n size: {\n S: '[1px]',\n L: '[4px]'\n }\n }\n }\n },\n width: {\n orientation: {\n vertical: {\n default: '[2px]',\n size: {\n S: '[1px]',\n L: '[4px]'\n }\n }\n }\n }\n}, getAllowedOverrides());\n\n/**\n * Dividers bring clarity to a layout by grouping and dividing content in close proximity.\n * They can also be used to establish rhythm and hierarchy.\n */\nexport const Divider = /*#__PURE__*/ forwardRef(function Divider(props: DividerProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, DividerContext);\n let domRef = useDOMRef(ref);\n\n return (\n <RACSeparator\n {...props}\n ref={domRef}\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + divider({\n size: props.size || 'M',\n orientation: props.orientation || 'horizontal',\n staticColor: props.staticColor,\n isStaticColor: !!props.staticColor\n }, props.styles)} />\n );\n});\n"],"names":[],"version":3,"file":"Divider.css.map"}
|