@react-spectrum/s2 0.5.0 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion.cjs +5 -8
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css +2 -2
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +5 -8
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionBar.cjs +264 -0
- package/dist/ActionBar.cjs.map +1 -0
- package/dist/ActionBar.css +267 -0
- package/dist/ActionBar.css.map +1 -0
- package/dist/ActionBar.mjs +257 -0
- package/dist/ActionBar.mjs.map +1 -0
- package/dist/ActionButton.cjs +121 -147
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +133 -153
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +122 -148
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.cjs +6 -9
- package/dist/ActionButtonGroup.cjs.map +1 -1
- package/dist/ActionButtonGroup.css +3 -3
- package/dist/ActionButtonGroup.css.map +1 -1
- package/dist/ActionButtonGroup.mjs +6 -9
- package/dist/ActionButtonGroup.mjs.map +1 -1
- package/dist/ActionMenu.cjs +2 -5
- package/dist/ActionMenu.cjs.map +1 -1
- package/dist/ActionMenu.mjs +2 -5
- package/dist/ActionMenu.mjs.map +1 -1
- package/dist/AlertDialog.cjs +2 -5
- package/dist/AlertDialog.cjs.map +1 -1
- package/dist/AlertDialog.css.map +1 -1
- package/dist/AlertDialog.mjs +2 -5
- package/dist/AlertDialog.mjs.map +1 -1
- package/dist/Avatar.cjs +12 -15
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css +11 -11
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +12 -15
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +99 -102
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +31 -31
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +99 -102
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +99 -102
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +76 -76
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +99 -102
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +93 -94
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +70 -64
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +94 -95
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +305 -278
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +255 -182
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +307 -280
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +17 -20
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css +11 -11
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +18 -21
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +167 -167
- package/dist/Card.css +121 -121
- package/dist/Card.mjs +167 -167
- package/dist/CardView.cjs +47 -21
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +39 -15
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +49 -23
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +2 -2
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +58 -62
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +54 -54
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +59 -63
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +43 -45
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css +32 -32
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs +44 -46
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.cjs +7 -8
- package/dist/ClearButton.cjs.map +1 -1
- package/dist/ClearButton.css +5 -5
- package/dist/ClearButton.css.map +1 -1
- package/dist/ClearButton.mjs +7 -8
- package/dist/ClearButton.mjs.map +1 -1
- package/dist/CloseButton.cjs +40 -53
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +45 -49
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs +40 -53
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +12 -15
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css +10 -10
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs +12 -15
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs +31 -34
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css +24 -24
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs +32 -35
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorHandle.cjs +11 -11
- package/dist/ColorHandle.css +19 -19
- package/dist/ColorHandle.mjs +11 -11
- package/dist/ColorSlider.cjs +43 -46
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +43 -43
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +44 -47
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +8 -11
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +14 -14
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +9 -12
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +15 -18
- package/dist/ColorSwatchPicker.cjs.map +1 -1
- package/dist/ColorSwatchPicker.css +33 -33
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +15 -18
- package/dist/ColorSwatchPicker.mjs.map +1 -1
- package/dist/ColorWheel.cjs +18 -21
- package/dist/ColorWheel.cjs.map +1 -1
- package/dist/ColorWheel.css +15 -15
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs +18 -21
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +61 -61
- package/dist/ComboBox.cjs.map +1 -1
- package/dist/ComboBox.css +52 -52
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +62 -62
- package/dist/ComboBox.mjs.map +1 -1
- package/dist/Content.cjs +12 -19
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs +12 -19
- package/dist/Content.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +7 -10
- package/dist/ContextualHelp.cjs.map +1 -1
- package/dist/ContextualHelp.css +23 -23
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +7 -10
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/CustomDialog.cjs +10 -13
- package/dist/CustomDialog.cjs.map +1 -1
- package/dist/CustomDialog.css +9 -9
- package/dist/CustomDialog.css.map +1 -1
- package/dist/CustomDialog.mjs +10 -13
- package/dist/CustomDialog.mjs.map +1 -1
- package/dist/Dialog.cjs +12 -16
- package/dist/Dialog.cjs.map +1 -1
- package/dist/Dialog.css +39 -39
- package/dist/Dialog.css.map +1 -1
- package/dist/Dialog.mjs +12 -16
- package/dist/Dialog.mjs.map +1 -1
- package/dist/Disclosure.cjs +60 -69
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +49 -49
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +61 -70
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs +15 -19
- package/dist/Divider.cjs.map +1 -1
- package/dist/Divider.css +18 -18
- package/dist/Divider.css.map +1 -1
- package/dist/Divider.mjs +15 -19
- package/dist/Divider.mjs.map +1 -1
- package/dist/DropZone.cjs +30 -33
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +26 -26
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +30 -33
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +133 -131
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +76 -84
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +133 -131
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +6 -9
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +3 -3
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs +6 -9
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +7 -10
- package/dist/FullscreenDialog.cjs.map +1 -1
- package/dist/FullscreenDialog.css +54 -54
- package/dist/FullscreenDialog.css.map +1 -1
- package/dist/FullscreenDialog.mjs +7 -10
- package/dist/FullscreenDialog.mjs.map +1 -1
- package/dist/IllustratedMessage.cjs +128 -132
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +58 -58
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +128 -132
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +12 -13
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css +11 -11
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +13 -14
- package/dist/Image.mjs.map +1 -1
- package/dist/InlineAlert.cjs +75 -84
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css +59 -63
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +76 -85
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Link.cjs +36 -39
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css +42 -42
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +37 -40
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +322 -234
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +118 -116
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +323 -235
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +66 -70
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +69 -73
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +66 -70
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +36 -45
- package/dist/Modal.cjs.map +1 -1
- package/dist/Modal.css +48 -72
- package/dist/Modal.css.map +1 -1
- package/dist/Modal.mjs +37 -46
- package/dist/Modal.mjs.map +1 -1
- package/dist/NumberField.cjs +66 -69
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css +70 -70
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +67 -70
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +122 -122
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +84 -84
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +123 -123
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +47 -69
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +55 -126
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +48 -70
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs +85 -87
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +81 -85
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +85 -87
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +16 -18
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css +16 -16
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +16 -18
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Provider.cjs +5 -5
- package/dist/Provider.css +6 -6
- package/dist/Provider.mjs +5 -5
- package/dist/Radio.cjs +54 -58
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +50 -50
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +55 -59
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +39 -43
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css +32 -32
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs +40 -44
- package/dist/RadioGroup.mjs.map +1 -1
- package/dist/RangeSlider.cjs +2 -3
- package/dist/RangeSlider.cjs.map +1 -1
- package/dist/RangeSlider.mjs +3 -4
- package/dist/RangeSlider.mjs.map +1 -1
- package/dist/SearchField.cjs +34 -37
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +30 -30
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +35 -38
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +67 -73
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +63 -63
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +68 -74
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +111 -112
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +87 -87
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +112 -113
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +28 -32
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +26 -26
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +28 -32
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +56 -60
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +48 -48
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +57 -61
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +209 -196
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +95 -95
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +211 -198
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +59 -62
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +42 -42
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +59 -62
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TagGroup.cjs +122 -124
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +93 -93
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +122 -124
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +44 -55
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +33 -33
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +45 -56
- package/dist/TextField.mjs.map +1 -1
- package/dist/ToggleButton.cjs +6 -9
- package/dist/ToggleButton.cjs.map +1 -1
- package/dist/ToggleButton.css +7 -7
- package/dist/ToggleButton.css.map +1 -1
- package/dist/ToggleButton.mjs +6 -9
- package/dist/ToggleButton.mjs.map +1 -1
- package/dist/ToggleButtonGroup.cjs +2 -5
- package/dist/ToggleButtonGroup.cjs.map +1 -1
- package/dist/ToggleButtonGroup.mjs +2 -5
- package/dist/ToggleButtonGroup.mjs.map +1 -1
- package/dist/Tooltip.cjs +48 -48
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +55 -70
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +49 -49
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/ar-AE.cjs +10 -2
- package/dist/ar-AE.cjs.map +1 -1
- package/dist/ar-AE.mjs +10 -2
- package/dist/ar-AE.mjs.map +1 -1
- package/dist/bg-BG.cjs +11 -2
- package/dist/bg-BG.cjs.map +1 -1
- package/dist/bg-BG.mjs +11 -2
- package/dist/bg-BG.mjs.map +1 -1
- package/dist/cs-CZ.cjs +7 -2
- package/dist/cs-CZ.cjs.map +1 -1
- package/dist/cs-CZ.mjs +7 -2
- package/dist/cs-CZ.mjs.map +1 -1
- package/dist/da-DK.cjs +12 -4
- package/dist/da-DK.cjs.map +1 -1
- package/dist/da-DK.mjs +12 -4
- package/dist/da-DK.mjs.map +1 -1
- package/dist/de-DE.cjs +11 -2
- package/dist/de-DE.cjs.map +1 -1
- package/dist/de-DE.mjs +11 -2
- package/dist/de-DE.mjs.map +1 -1
- package/dist/el-GR.cjs +11 -2
- package/dist/el-GR.cjs.map +1 -1
- package/dist/el-GR.mjs +11 -2
- package/dist/el-GR.mjs.map +1 -1
- package/dist/en-US.cjs +8 -0
- package/dist/en-US.cjs.map +1 -1
- package/dist/en-US.mjs +8 -0
- package/dist/en-US.mjs.map +1 -1
- package/dist/es-ES.cjs +11 -2
- package/dist/es-ES.cjs.map +1 -1
- package/dist/es-ES.mjs +11 -2
- package/dist/es-ES.mjs.map +1 -1
- package/dist/et-EE.cjs +10 -2
- package/dist/et-EE.cjs.map +1 -1
- package/dist/et-EE.mjs +10 -2
- package/dist/et-EE.mjs.map +1 -1
- package/dist/fi-FI.cjs +10 -2
- package/dist/fi-FI.cjs.map +1 -1
- package/dist/fi-FI.mjs +10 -2
- package/dist/fi-FI.mjs.map +1 -1
- package/dist/fr-FR.cjs +11 -2
- package/dist/fr-FR.cjs.map +1 -1
- package/dist/fr-FR.mjs +11 -2
- package/dist/fr-FR.mjs.map +1 -1
- package/dist/he-IL.cjs +11 -2
- package/dist/he-IL.cjs.map +1 -1
- package/dist/he-IL.mjs +11 -2
- package/dist/he-IL.mjs.map +1 -1
- package/dist/hr-HR.cjs +7 -2
- package/dist/hr-HR.cjs.map +1 -1
- package/dist/hr-HR.mjs +7 -2
- package/dist/hr-HR.mjs.map +1 -1
- package/dist/hu-HU.cjs +10 -2
- package/dist/hu-HU.cjs.map +1 -1
- package/dist/hu-HU.mjs +10 -2
- package/dist/hu-HU.mjs.map +1 -1
- package/dist/it-IT.cjs +11 -2
- package/dist/it-IT.cjs.map +1 -1
- package/dist/it-IT.mjs +11 -2
- package/dist/it-IT.mjs.map +1 -1
- package/dist/ja-JP.cjs +10 -2
- package/dist/ja-JP.cjs.map +1 -1
- package/dist/ja-JP.mjs +10 -2
- package/dist/ja-JP.mjs.map +1 -1
- package/dist/ko-KR.cjs +12 -4
- package/dist/ko-KR.cjs.map +1 -1
- package/dist/ko-KR.mjs +12 -4
- package/dist/ko-KR.mjs.map +1 -1
- package/dist/lt-LT.cjs +9 -4
- package/dist/lt-LT.cjs.map +1 -1
- package/dist/lt-LT.mjs +9 -4
- package/dist/lt-LT.mjs.map +1 -1
- package/dist/lv-LV.cjs +11 -3
- package/dist/lv-LV.cjs.map +1 -1
- package/dist/lv-LV.mjs +11 -3
- package/dist/lv-LV.mjs.map +1 -1
- package/dist/main.cjs +4 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +3 -1
- package/dist/module.mjs.map +1 -1
- package/dist/nb-NO.cjs +9 -4
- package/dist/nb-NO.cjs.map +1 -1
- package/dist/nb-NO.mjs +9 -4
- package/dist/nb-NO.mjs.map +1 -1
- package/dist/nl-NL.cjs +10 -2
- package/dist/nl-NL.cjs.map +1 -1
- package/dist/nl-NL.mjs +10 -2
- package/dist/nl-NL.mjs.map +1 -1
- package/dist/pl-PL.cjs +8 -3
- package/dist/pl-PL.cjs.map +1 -1
- package/dist/pl-PL.mjs +8 -3
- package/dist/pl-PL.mjs.map +1 -1
- package/dist/pt-BR.cjs +11 -2
- package/dist/pt-BR.cjs.map +1 -1
- package/dist/pt-BR.mjs +11 -2
- package/dist/pt-BR.mjs.map +1 -1
- package/dist/pt-PT.cjs +11 -2
- package/dist/pt-PT.cjs.map +1 -1
- package/dist/pt-PT.mjs +11 -2
- package/dist/pt-PT.mjs.map +1 -1
- package/dist/ro-RO.cjs +12 -3
- package/dist/ro-RO.cjs.map +1 -1
- package/dist/ro-RO.mjs +12 -3
- package/dist/ro-RO.mjs.map +1 -1
- package/dist/ru-RU.cjs +7 -2
- package/dist/ru-RU.cjs.map +1 -1
- package/dist/ru-RU.mjs +7 -2
- package/dist/ru-RU.mjs.map +1 -1
- package/dist/sk-SK.cjs +7 -2
- package/dist/sk-SK.cjs.map +1 -1
- package/dist/sk-SK.mjs +7 -2
- package/dist/sk-SK.mjs.map +1 -1
- package/dist/sl-SI.cjs +7 -2
- package/dist/sl-SI.cjs.map +1 -1
- package/dist/sl-SI.mjs +7 -2
- package/dist/sl-SI.mjs.map +1 -1
- package/dist/sr-SP.cjs +7 -2
- package/dist/sr-SP.cjs.map +1 -1
- package/dist/sr-SP.mjs +7 -2
- package/dist/sr-SP.mjs.map +1 -1
- package/dist/sv-SE.cjs +11 -2
- package/dist/sv-SE.cjs.map +1 -1
- package/dist/sv-SE.mjs +11 -2
- package/dist/sv-SE.mjs.map +1 -1
- package/dist/tr-TR.cjs +10 -2
- package/dist/tr-TR.cjs.map +1 -1
- package/dist/tr-TR.mjs +10 -2
- package/dist/tr-TR.mjs.map +1 -1
- package/dist/types.d.ts +109 -89
- package/dist/types.d.ts.map +1 -1
- package/dist/uk-UA.cjs +7 -2
- package/dist/uk-UA.cjs.map +1 -1
- package/dist/uk-UA.mjs +7 -2
- package/dist/uk-UA.mjs.map +1 -1
- package/dist/zh-CN.cjs +10 -2
- package/dist/zh-CN.cjs.map +1 -1
- package/dist/zh-CN.mjs +10 -2
- package/dist/zh-CN.mjs.map +1 -1
- package/dist/zh-TW.cjs +10 -2
- package/dist/zh-TW.cjs.map +1 -1
- package/dist/zh-TW.mjs +10 -2
- package/dist/zh-TW.mjs.map +1 -1
- package/icons/Skeleton.cjs +2 -2
- package/icons/Skeleton.css +5 -5
- package/icons/Skeleton.mjs +2 -2
- package/package.json +20 -21
- package/src/Accordion.tsx +5 -8
- package/src/ActionBar.tsx +229 -0
- package/src/ActionButton.tsx +25 -52
- package/src/ActionButtonGroup.tsx +9 -11
- package/src/ActionMenu.tsx +5 -8
- package/src/AlertDialog.tsx +5 -8
- package/src/Avatar.tsx +5 -8
- package/src/AvatarGroup.tsx +5 -8
- package/src/Badge.tsx +5 -8
- package/src/Breadcrumbs.tsx +6 -12
- package/src/Button.tsx +197 -154
- package/src/ButtonGroup.tsx +5 -8
- package/src/CardView.tsx +37 -12
- package/src/Checkbox.tsx +6 -9
- package/src/CheckboxGroup.tsx +6 -9
- package/src/ClearButton.tsx +2 -5
- package/src/CloseButton.tsx +21 -31
- package/src/ColorArea.tsx +5 -8
- package/src/ColorField.tsx +5 -8
- package/src/ColorSlider.tsx +5 -8
- package/src/ColorSwatch.tsx +5 -8
- package/src/ColorSwatchPicker.tsx +5 -8
- package/src/ColorWheel.tsx +5 -8
- package/src/ComboBox.tsx +7 -9
- package/src/Content.tsx +12 -30
- package/src/ContextualHelp.tsx +5 -8
- package/src/CustomDialog.tsx +5 -8
- package/src/Dialog.tsx +6 -9
- package/src/Disclosure.tsx +15 -24
- package/src/Divider.tsx +16 -25
- package/src/DropZone.tsx +5 -8
- package/src/Field.tsx +25 -32
- package/src/Form.tsx +5 -8
- package/src/FullscreenDialog.tsx +5 -8
- package/src/IllustratedMessage.tsx +6 -9
- package/src/Image.tsx +3 -6
- package/src/InlineAlert.tsx +6 -10
- package/src/Link.tsx +13 -21
- package/src/Menu.tsx +69 -33
- package/src/Meter.tsx +13 -23
- package/src/Modal.tsx +22 -52
- package/src/NumberField.tsx +5 -8
- package/src/Picker.tsx +7 -9
- package/src/Popover.tsx +30 -104
- package/src/ProgressBar.tsx +14 -24
- package/src/ProgressCircle.tsx +18 -24
- package/src/Radio.tsx +6 -9
- package/src/RadioGroup.tsx +6 -9
- package/src/RangeSlider.tsx +2 -5
- package/src/SearchField.tsx +5 -8
- package/src/SegmentedControl.tsx +10 -16
- package/src/Slider.tsx +2 -5
- package/src/StatusLight.tsx +6 -9
- package/src/Switch.tsx +6 -9
- package/src/TableView.tsx +53 -50
- package/src/Tabs.tsx +5 -8
- package/src/TagGroup.tsx +7 -14
- package/src/TextField.tsx +20 -28
- package/src/ToggleButton.tsx +7 -9
- package/src/ToggleButtonGroup.tsx +5 -8
- package/src/Tooltip.tsx +30 -51
- package/src/bar-utils.ts +3 -10
- package/src/index.ts +2 -0
- package/src/style-utils.ts +15 -8
- package/style/dist/main.cjs +1 -0
- package/style/dist/main.cjs.map +1 -1
- package/style/dist/module.mjs +2 -2
- package/style/dist/module.mjs.map +1 -1
- package/style/dist/spectrum-theme.cjs +72 -5
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs +72 -6
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/style-macro.cjs +13 -1
- package/style/dist/style-macro.cjs.map +1 -1
- package/style/dist/style-macro.mjs +13 -1
- package/style/dist/style-macro.mjs.map +1 -1
- package/style/dist/types.d.ts +50 -29
- package/style/dist/types.d.ts.map +1 -1
- package/style/index.ts +1 -1
- package/style/spectrum-theme.ts +72 -7
- package/style/style-macro.ts +20 -4
- package/style/tokens.ts +30 -0
- package/style/types.ts +1 -1
package/dist/Breadcrumbs.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import {Menu as $13afb0ea5f0ed767$export$d9b273488cd8ce6f, MenuItem as $13afb0ea
|
|
|
7
7
|
import {Text as $8e847109a6ab556d$export$5f1af8db9871e1d6} from "./Content.mjs";
|
|
8
8
|
import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
|
|
9
9
|
import {jsx as $a1dfd$jsx, jsxs as $a1dfd$jsxs, Fragment as $a1dfd$Fragment} from "react/jsx-runtime";
|
|
10
|
-
import {createContext as $a1dfd$createContext,
|
|
10
|
+
import {createContext as $a1dfd$createContext, forwardRef as $a1dfd$forwardRef, useContext as $a1dfd$useContext, createElement as $a1dfd$createElement, useState as $a1dfd$useState, useMemo as $a1dfd$useMemo, useRef as $a1dfd$useRef, useCallback as $a1dfd$useCallback, useEffect as $a1dfd$useEffect, Fragment as $a1dfd$Fragment1} from "react";
|
|
11
11
|
import {Provider as $a1dfd$Provider, Breadcrumbs as $a1dfd$Breadcrumbs, UNSTABLE_CollectionRendererContext as $a1dfd$UNSTABLE_CollectionRendererContext, UNSTABLE_DefaultCollectionRenderer as $a1dfd$UNSTABLE_DefaultCollectionRenderer, Breadcrumb as $a1dfd$Breadcrumb, HeadingContext as $a1dfd$HeadingContext, Link as $a1dfd$Link} from "react-aria-components";
|
|
12
12
|
import {useLocale as $a1dfd$useLocale} from "react-aria";
|
|
13
13
|
import {useDOMRef as $a1dfd$useDOMRef, useResizeObserver as $a1dfd$useResizeObserver} from "@react-spectrum/utils";
|
|
@@ -47,31 +47,31 @@ const $f329dd4f2aa58cd0$var$MAX_VISIBLE_ITEMS = 4;
|
|
|
47
47
|
const $f329dd4f2aa58cd0$export$65596d3621b0a4a0 = /*#__PURE__*/ (0, $a1dfd$createContext)(null);
|
|
48
48
|
const $f329dd4f2aa58cd0$var$wrapper = function anonymous(props, overrides) {
|
|
49
49
|
let rules = " .";
|
|
50
|
-
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|_9|
|
|
50
|
+
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) || [];
|
|
51
51
|
rules += matches.join('');
|
|
52
|
-
let $
|
|
52
|
+
let $V = false;
|
|
53
|
+
let $__a = false;
|
|
53
54
|
let $_9 = false;
|
|
54
|
-
let $_8 = false;
|
|
55
55
|
let $h = false;
|
|
56
56
|
let $A = false;
|
|
57
57
|
let $B = false;
|
|
58
58
|
let $y = false;
|
|
59
59
|
for (let p of matches){
|
|
60
|
-
if (/^\s*
|
|
60
|
+
if (/^\s*V/.test(p)) $V = true;
|
|
61
|
+
if (/^\s*__a/.test(p)) $__a = true;
|
|
61
62
|
if (/^\s*_9/.test(p)) $_9 = true;
|
|
62
|
-
if (/^\s*_8/.test(p)) $_8 = true;
|
|
63
63
|
if (/^\s*h/.test(p)) $h = true;
|
|
64
64
|
if (/^\s*A/.test(p)) $A = true;
|
|
65
65
|
if (/^\s*B/.test(p)) $B = true;
|
|
66
66
|
if (/^\s*y/.test(p)) $y = true;
|
|
67
67
|
}
|
|
68
|
-
if (!$
|
|
69
|
-
rules += '
|
|
70
|
-
rules += '
|
|
71
|
-
rules += '
|
|
72
|
-
rules += '
|
|
73
|
-
if (!$
|
|
74
|
-
if (!$
|
|
68
|
+
if (!$V) rules += ' Vc';
|
|
69
|
+
rules += ' _0d';
|
|
70
|
+
rules += ' _3b';
|
|
71
|
+
rules += ' _ha';
|
|
72
|
+
rules += ' _8c';
|
|
73
|
+
if (!$__a) rules += ' __a-3t1y';
|
|
74
|
+
if (!$_9) rules += ' _9-3t1x';
|
|
75
75
|
if (!$h) rules += ' ha';
|
|
76
76
|
if (props.size === "L") rules += ' i-1dtpt05';
|
|
77
77
|
else if (props.size === "M") rules += ' i-ve8p9e';
|
|
@@ -81,9 +81,9 @@ const $f329dd4f2aa58cd0$var$wrapper = function anonymous(props, overrides) {
|
|
|
81
81
|
rules += ' Fa';
|
|
82
82
|
rules += ' Ca';
|
|
83
83
|
rules += ' Da';
|
|
84
|
-
rules += '
|
|
85
|
-
rules += '
|
|
86
|
-
rules += '
|
|
84
|
+
rules += ' _Pa';
|
|
85
|
+
rules += ' _R-375x7f';
|
|
86
|
+
rules += ' _Sa';
|
|
87
87
|
if (!$A) rules += ' Aa';
|
|
88
88
|
if (!$B) rules += ' Ba';
|
|
89
89
|
if (!$y) {
|
|
@@ -93,7 +93,7 @@ const $f329dd4f2aa58cd0$var$wrapper = function anonymous(props, overrides) {
|
|
|
93
93
|
return rules;
|
|
94
94
|
};
|
|
95
95
|
const $f329dd4f2aa58cd0$var$InternalBreadcrumbsContext = /*#__PURE__*/ (0, $a1dfd$createContext)({});
|
|
96
|
-
|
|
96
|
+
const $f329dd4f2aa58cd0$export$2dc68d50d56fbbd = /*#__PURE__*/ (0, $a1dfd$forwardRef)(function Breadcrumbs(props, ref) {
|
|
97
97
|
[props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $f329dd4f2aa58cd0$export$65596d3621b0a4a0);
|
|
98
98
|
let domRef = (0, $a1dfd$useDOMRef)(ref);
|
|
99
99
|
let { UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, styles: styles, size: size = 'M', children: children, isDisabled: isDisabled, ...otherProps } = props;
|
|
@@ -122,7 +122,7 @@ function $f329dd4f2aa58cd0$var$Breadcrumbs(props, ref) {
|
|
|
122
122
|
})
|
|
123
123
|
})
|
|
124
124
|
});
|
|
125
|
-
}
|
|
125
|
+
});
|
|
126
126
|
let $f329dd4f2aa58cd0$var$BreadcrumbMenu = (props)=>{
|
|
127
127
|
let stringFormatter = (0, $a1dfd$useLocalizedStringFormatter)((0, ($parcel$interopDefault($a1dfd$intlStringsmjs))), '@react-spectrum/s2');
|
|
128
128
|
let { items: items, onAction: onAction } = props;
|
|
@@ -174,14 +174,13 @@ let $f329dd4f2aa58cd0$var$BreadcrumbMenu = (props)=>{
|
|
|
174
174
|
})
|
|
175
175
|
});
|
|
176
176
|
};
|
|
177
|
-
/** Breadcrumbs show hierarchy and navigational context for a user’s location within an application. */ let $f329dd4f2aa58cd0$export$2dc68d50d56fbbd = /*#__PURE__*/ (0, $a1dfd$forwardRef)($f329dd4f2aa58cd0$var$Breadcrumbs);
|
|
178
177
|
let $f329dd4f2aa58cd0$var$HiddenBreadcrumbs = function(props) {
|
|
179
178
|
let { listRef: listRef, items: items, size: size } = props;
|
|
180
179
|
return /*#__PURE__*/ (0, $a1dfd$jsxs)("div", {
|
|
181
180
|
// @ts-ignore
|
|
182
181
|
inert: "true",
|
|
183
182
|
ref: listRef,
|
|
184
|
-
className: " .
|
|
183
|
+
className: " . _0-17zqamw i-17zqamw j-17zqamw _8-17zqamw Va Ya _aa __Fb __wb __xb _L-3t1x",
|
|
185
184
|
children: [
|
|
186
185
|
items.map((item, idx)=>{
|
|
187
186
|
// pull off individual props as an allow list, don't want refs or other props getting through
|
|
@@ -208,21 +207,21 @@ let $f329dd4f2aa58cd0$var$HiddenBreadcrumbs = function(props) {
|
|
|
208
207
|
};
|
|
209
208
|
const $f329dd4f2aa58cd0$var$breadcrumbStyles = function anonymous(props) {
|
|
210
209
|
let rules = " .";
|
|
211
|
-
rules += '
|
|
212
|
-
rules += '
|
|
213
|
-
rules += '
|
|
210
|
+
rules += ' _0d';
|
|
211
|
+
rules += ' _2c';
|
|
212
|
+
rules += ' _3b';
|
|
214
213
|
if (props.size === "XL") rules += ' kj';
|
|
215
214
|
else if (props.size === "L") rules += ' ki';
|
|
216
215
|
else if (props.size === "S") rules += ' kh';
|
|
217
216
|
else if (props.size === "XS") rules += ' kg';
|
|
218
217
|
else rules += ' kf';
|
|
219
|
-
rules += '
|
|
220
|
-
rules += '
|
|
221
|
-
rules += '
|
|
222
|
-
rules += '
|
|
223
|
-
rules += '
|
|
224
|
-
if (props.isDisabled) rules += '
|
|
225
|
-
else rules += '
|
|
218
|
+
rules += ' _Pa';
|
|
219
|
+
rules += ' _R-375x7f';
|
|
220
|
+
rules += ' _Sa';
|
|
221
|
+
rules += ' Vc';
|
|
222
|
+
rules += ' _9-3t1x';
|
|
223
|
+
if (props.isDisabled) rules += ' aa_____O';
|
|
224
|
+
else rules += ' aa_____K';
|
|
226
225
|
if (props.isDisabled) rules += ' aj';
|
|
227
226
|
else {
|
|
228
227
|
if (props.isPressed) rules += ' ao';
|
|
@@ -237,12 +236,13 @@ const $f329dd4f2aa58cd0$var$breadcrumbStyles = function anonymous(props) {
|
|
|
237
236
|
const $f329dd4f2aa58cd0$var$chevronStyles = function anonymous(props) {
|
|
238
237
|
let rules = " .";
|
|
239
238
|
if (props.direction === "rtl") rules += ' S-3hmpv';
|
|
239
|
+
if (props.direction === "rtl") rules += ' T-3hmpv';
|
|
240
240
|
if (props.isMenu) rules += ' ya';
|
|
241
241
|
else {
|
|
242
242
|
rules += ' ybH';
|
|
243
243
|
rules += ' yG';
|
|
244
244
|
}
|
|
245
|
-
rules += '
|
|
245
|
+
rules += ' aa_____Q';
|
|
246
246
|
if (props.isPressed) rules += ' ao';
|
|
247
247
|
else if (props.isFocusVisible) rules += ' ao';
|
|
248
248
|
else if (props.isHovered) rules += ' ao';
|
|
@@ -252,45 +252,45 @@ const $f329dd4f2aa58cd0$var$chevronStyles = function anonymous(props) {
|
|
|
252
252
|
};
|
|
253
253
|
const $f329dd4f2aa58cd0$var$linkStyles = function anonymous(props) {
|
|
254
254
|
let rules = " .";
|
|
255
|
-
if (props.isFocusVisible) rules += '
|
|
256
|
-
else rules += '
|
|
257
|
-
rules += '
|
|
255
|
+
if (props.isFocusVisible) rules += ' _Mb';
|
|
256
|
+
else rules += ' _Ma';
|
|
257
|
+
rules += ' da_____M';
|
|
258
258
|
rules += ' dx';
|
|
259
|
-
rules += '
|
|
260
|
-
rules += '
|
|
261
|
-
rules += ' _vb';
|
|
259
|
+
rules += ' _Oc';
|
|
260
|
+
rules += ' _N-3t1z';
|
|
262
261
|
rules += ' _wb';
|
|
263
262
|
rules += ' _xb';
|
|
264
263
|
rules += ' _yb';
|
|
265
|
-
rules += '
|
|
266
|
-
rules += '
|
|
267
|
-
rules += '
|
|
268
|
-
rules += '
|
|
269
|
-
rules += '
|
|
270
|
-
rules += '
|
|
271
|
-
rules += '
|
|
272
|
-
rules += '
|
|
264
|
+
rules += ' _zb';
|
|
265
|
+
rules += ' _d-bc1l9oh';
|
|
266
|
+
rules += ' _d-1uotwbwg';
|
|
267
|
+
rules += ' _d-eo0c6sf';
|
|
268
|
+
rules += ' _d-enzzrge';
|
|
269
|
+
rules += ' _d-enzykdd';
|
|
270
|
+
rules += ' _d-enzwzjc';
|
|
271
|
+
rules += ' _d-enzrfpb';
|
|
272
|
+
rules += ' _da';
|
|
273
273
|
if (props.size === "XL") {
|
|
274
|
-
rules += '
|
|
275
|
-
rules += '
|
|
274
|
+
rules += ' _ebj';
|
|
275
|
+
rules += ' _ei';
|
|
276
276
|
} else if (props.size === "L") {
|
|
277
|
-
rules += '
|
|
278
|
-
rules += '
|
|
277
|
+
rules += ' _ebh';
|
|
278
|
+
rules += ' _eg';
|
|
279
279
|
} else if (props.size === "S") {
|
|
280
|
-
rules += '
|
|
281
|
-
rules += '
|
|
280
|
+
rules += ' _ebd';
|
|
281
|
+
rules += ' _ec';
|
|
282
282
|
} else if (props.size === "XS") {
|
|
283
|
-
rules += '
|
|
284
|
-
rules += '
|
|
283
|
+
rules += ' _ebb';
|
|
284
|
+
rules += ' _ea';
|
|
285
285
|
} else {
|
|
286
|
-
rules += '
|
|
287
|
-
rules += '
|
|
286
|
+
rules += ' _ebf';
|
|
287
|
+
rules += ' _ee';
|
|
288
288
|
}
|
|
289
|
-
rules += '
|
|
290
|
-
rules += '
|
|
291
|
-
rules += '
|
|
292
|
-
if (props.isDisabled) rules += '
|
|
293
|
-
else rules += '
|
|
289
|
+
rules += ' _fb';
|
|
290
|
+
rules += ' _g-1x99dlob';
|
|
291
|
+
rules += ' _ga';
|
|
292
|
+
if (props.isDisabled) rules += ' aa_____O';
|
|
293
|
+
else rules += ' aa_____Q';
|
|
294
294
|
if (props.isCurrent) {
|
|
295
295
|
if (props.isPressed) rules += ' ao';
|
|
296
296
|
else if (props.isFocusVisible) rules += ' ao';
|
|
@@ -303,53 +303,53 @@ const $f329dd4f2aa58cd0$var$linkStyles = function anonymous(props) {
|
|
|
303
303
|
else if (props.isHovered) rules += ' an';
|
|
304
304
|
else rules += ' am';
|
|
305
305
|
}
|
|
306
|
-
rules += '
|
|
307
|
-
rules += '
|
|
308
|
-
rules += '
|
|
309
|
-
if (props.isDisabled) rules += '
|
|
310
|
-
else if (props.isFocusVisible) rules += '
|
|
311
|
-
else if (props.isHovered) rules += '
|
|
312
|
-
else rules += '
|
|
313
|
-
if (props.isDisabled) rules += '
|
|
314
|
-
else rules += '
|
|
315
|
-
rules += '
|
|
306
|
+
rules += ' _Pa';
|
|
307
|
+
rules += ' _R-375x7f';
|
|
308
|
+
rules += ' _Sa';
|
|
309
|
+
if (props.isDisabled) rules += ' _md';
|
|
310
|
+
else if (props.isFocusVisible) rules += ' _ma';
|
|
311
|
+
else if (props.isHovered) rules += ' _ma';
|
|
312
|
+
else rules += ' _md';
|
|
313
|
+
if (props.isDisabled) rules += ' __Ib';
|
|
314
|
+
else rules += ' __Ic';
|
|
315
|
+
rules += ' __S-yksgrp';
|
|
316
316
|
return rules;
|
|
317
317
|
};
|
|
318
318
|
const $f329dd4f2aa58cd0$var$currentStyles = function anonymous(props) {
|
|
319
319
|
let rules = " .";
|
|
320
|
-
rules += '
|
|
321
|
-
rules += '
|
|
322
|
-
rules += '
|
|
323
|
-
rules += '
|
|
324
|
-
rules += '
|
|
325
|
-
rules += '
|
|
326
|
-
rules += '
|
|
327
|
-
rules += '
|
|
320
|
+
rules += ' _d-bc1l9oh';
|
|
321
|
+
rules += ' _d-1uotwbwg';
|
|
322
|
+
rules += ' _d-eo0c6sf';
|
|
323
|
+
rules += ' _d-enzzrge';
|
|
324
|
+
rules += ' _d-enzykdd';
|
|
325
|
+
rules += ' _d-enzwzjc';
|
|
326
|
+
rules += ' _d-enzrfpb';
|
|
327
|
+
rules += ' _da';
|
|
328
328
|
if (props.size === "XL") {
|
|
329
|
-
rules += '
|
|
330
|
-
rules += '
|
|
329
|
+
rules += ' _ebj';
|
|
330
|
+
rules += ' _ei';
|
|
331
331
|
} else if (props.size === "L") {
|
|
332
|
-
rules += '
|
|
333
|
-
rules += '
|
|
332
|
+
rules += ' _ebh';
|
|
333
|
+
rules += ' _eg';
|
|
334
334
|
} else if (props.size === "S") {
|
|
335
|
-
rules += '
|
|
336
|
-
rules += '
|
|
335
|
+
rules += ' _ebd';
|
|
336
|
+
rules += ' _ec';
|
|
337
337
|
} else if (props.size === "XS") {
|
|
338
|
-
rules += '
|
|
339
|
-
rules += '
|
|
338
|
+
rules += ' _ebb';
|
|
339
|
+
rules += ' _ea';
|
|
340
340
|
} else {
|
|
341
|
-
rules += '
|
|
342
|
-
rules += '
|
|
341
|
+
rules += ' _ebf';
|
|
342
|
+
rules += ' _ee';
|
|
343
343
|
}
|
|
344
|
-
rules += '
|
|
345
|
-
rules += '
|
|
346
|
-
rules += '
|
|
344
|
+
rules += ' _fd';
|
|
345
|
+
rules += ' _g-1x99dlob';
|
|
346
|
+
rules += ' _ga';
|
|
347
347
|
rules += ' an';
|
|
348
348
|
return rules;
|
|
349
349
|
};
|
|
350
350
|
// TODO: support user heading size customization, for now just set it to large
|
|
351
|
-
const $f329dd4f2aa58cd0$var$heading = " . Aa Ba ya za
|
|
352
|
-
|
|
351
|
+
const $f329dd4f2aa58cd0$var$heading = " . Aa Ba ya za _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _en _ebo _fe _ga _g-1x99dlob ao";
|
|
352
|
+
const $f329dd4f2aa58cd0$export$dabcc1ec9dd9d1cc = /*#__PURE__*/ (0, $a1dfd$forwardRef)(function Breadcrumb({ children: children, ...props }, ref) {
|
|
353
353
|
let { href: href, target: target, rel: rel, download: download, ping: ping, referrerPolicy: referrerPolicy } = props;
|
|
354
354
|
let { size: size = 'M' } = (0, $a1dfd$useContext)($f329dd4f2aa58cd0$var$InternalBreadcrumbsContext) ?? {};
|
|
355
355
|
let domRef = (0, $a1dfd$useDOMRef)(ref);
|
|
@@ -415,8 +415,7 @@ function $f329dd4f2aa58cd0$var$Breadcrumb({ children: children, ...props }, ref)
|
|
|
415
415
|
});
|
|
416
416
|
}
|
|
417
417
|
});
|
|
418
|
-
}
|
|
419
|
-
/** An individual Breadcrumb for Breadcrumbs. */ let $f329dd4f2aa58cd0$export$dabcc1ec9dd9d1cc = /*#__PURE__*/ (0, $a1dfd$forwardRef)($f329dd4f2aa58cd0$var$Breadcrumb);
|
|
418
|
+
});
|
|
420
419
|
// Context for passing the count for the custom renderer
|
|
421
420
|
let $f329dd4f2aa58cd0$var$CollapseContext = /*#__PURE__*/ (0, $a1dfd$createContext)(null);
|
|
422
421
|
function $f329dd4f2aa58cd0$var$CollapsingCollection({ children: children, containerRef: containerRef, onAction: onAction }) {
|
package/dist/Breadcrumbs.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Breadcrumbs.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 {ActionButton} from './ActionButton';\nimport {\n Breadcrumb as AriaBreadcrumb,\n BreadcrumbsProps as AriaBreadcrumbsProps,\n CollectionRenderer,\n ContextValue,\n HeadingContext,\n Link,\n Provider,\n Breadcrumbs as RACBreadcrumbs,\n UNSTABLE_CollectionRendererContext,\n UNSTABLE_DefaultCollectionRenderer\n} from 'react-aria-components';\nimport {AriaBreadcrumbItemProps, useLocale} from 'react-aria';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {Collection, DOMRef, DOMRefValue, LinkDOMProps, Node} from '@react-types/shared';\nimport {createContext, forwardRef, Fragment, ReactNode, RefObject, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport {focusRing, size, style} from '../style' with { type: 'macro' };\nimport FolderIcon from '../s2wf-icons/S2_Icon_FolderBreadcrumb_20_N.svg';\nimport {forwardRefType} from './types';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {Menu, MenuItem, MenuTrigger} from './Menu';\nimport {Text} from './Content';\nimport {useDOMRef, useResizeObserver} from '@react-spectrum/utils';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nconst MIN_VISIBLE_ITEMS = 1;\nconst MAX_VISIBLE_ITEMS = 4;\n\ninterface BreadcrumbsStyleProps {\n /**\n * Size of the Breadcrumbs including spacing and layout.\n *\n * @default 'M'\n */\n size?: 'M' | 'L',\n /** Whether the breadcrumbs are disabled. */\n isDisabled?: boolean\n /**\n * Whether to place the last Breadcrumb item onto a new line.\n */\n // TODO: isMultiline?: boolean\n /** Whether to always show the root item if the items are collapsed. */\n // TODO: showRoot?: boolean,\n}\n\nexport interface BreadcrumbsProps<T> extends Omit<AriaBreadcrumbsProps<T>, 'children' | 'items' | 'style' | 'className'>, BreadcrumbsStyleProps, StyleProps {\n /** The children of the Breadcrumbs. */\n children?: ReactNode\n}\n\nexport const BreadcrumbsContext = createContext<ContextValue<BreadcrumbsProps<any>, DOMRefValue<HTMLOListElement>>>(null);\n\nconst wrapper = style<BreadcrumbsStyleProps>({\n position: 'relative',\n display: 'flex',\n justifyContent: 'start',\n listStyleType: 'none',\n flexWrap: 'nowrap',\n flexGrow: 1,\n flexShrink: 0,\n flexBasis: 0,\n gap: {\n size: {\n // TODO: why do these scale but other spacings don't?\n M: size(6), // breadcrumbs-text-to-separator-medium\n L: size(9) // breadcrumbs-text-to-separator-large\n }\n },\n padding: 0,\n transition: 'default',\n marginTop: 0,\n marginBottom: 0,\n marginStart: {\n size: {\n M: size(6),\n L: size(9)\n }\n }\n}, getAllowedOverrides());\n\nconst InternalBreadcrumbsContext = createContext<BreadcrumbsProps<any>>({});\n\nfunction Breadcrumbs<T extends object>(props: BreadcrumbsProps<T>, ref: DOMRef<HTMLOListElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BreadcrumbsContext);\n let domRef = useDOMRef(ref);\n let {\n UNSAFE_className = '',\n UNSAFE_style,\n styles,\n size = 'M',\n children,\n isDisabled,\n ...otherProps\n } = props;\n\n return (\n <Provider\n values={[\n [InternalBreadcrumbsContext, {size, isDisabled}]\n ]}>\n <CollapsingCollection containerRef={domRef} onAction={props.onAction}>\n <RACBreadcrumbs\n {...otherProps}\n isDisabled={isDisabled}\n ref={domRef}\n style={UNSAFE_style}\n className={UNSAFE_className + wrapper({\n size\n }, styles)}>\n {children}\n </RACBreadcrumbs>\n </CollapsingCollection>\n </Provider>\n );\n}\n\nlet BreadcrumbMenu = (props: {items: Array<Node<any>>, onAction: BreadcrumbsProps<unknown>['onAction']}) => {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {items, onAction} = props;\n let {direction} = useLocale();\n let {size, isDisabled} = useContext(InternalBreadcrumbsContext);\n let label = stringFormatter.format('breadcrumbs.more');\n return (\n <UNSTABLE_CollectionRendererContext.Provider value={UNSTABLE_DefaultCollectionRenderer}>\n <li className={breadcrumbStyles({size, isDisabled, isMenu: true})}>\n <MenuTrigger>\n <ActionButton isDisabled={isDisabled} isQuiet aria-label={label}><FolderIcon /></ActionButton>\n <Menu items={items} onAction={onAction}>\n {(item: Node<any>) => (\n <MenuItem\n {...item.props.originalProps}\n key={item.key}>\n <Text slot=\"label\">\n {item.props.children({size, isCurrent: false, isMenu: true})}\n </Text>\n </MenuItem>\n )}\n </Menu>\n </MenuTrigger>\n <ChevronIcon\n size={size}\n className={chevronStyles({direction, isMenu: true})} />\n </li>\n </UNSTABLE_CollectionRendererContext.Provider>\n );\n};\n\n/** Breadcrumbs show hierarchy and navigational context for a user’s location within an application. */\nlet _Breadcrumbs = /*#__PURE__*/ (forwardRef as forwardRefType)(Breadcrumbs);\nexport {_Breadcrumbs as Breadcrumbs};\n\nlet HiddenBreadcrumbs = function (props: {listRef: RefObject<HTMLDivElement | null>, items: Array<Node<any>>, size: string}) {\n let {listRef, items, size} = props;\n return (\n <div\n // @ts-ignore\n inert=\"true\"\n ref={listRef}\n className={style({\n display: '[inherit]',\n gap: '[inherit]',\n flexWrap: '[inherit]',\n position: 'absolute',\n top: 0,\n bottom: 0,\n start: 0,\n end: 0,\n visibility: 'hidden',\n overflow: 'hidden',\n opacity: 0\n })}>\n {items.map((item, idx) => {\n // pull off individual props as an allow list, don't want refs or other props getting through\n return (\n <div\n data-hidden-breadcrumb\n style={item.props.UNSAFE_style}\n key={item.key}\n className={item.props.className({size, isCurrent: idx === items.length - 1})}>\n {item.props.children({size, isCurrent: idx === items.length - 1})}\n </div>\n );\n })}\n <ActionButton data-hidden-button isQuiet><FolderIcon /></ActionButton>\n </div>\n );\n};\n\nconst breadcrumbStyles = style({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'start',\n height: 'control',\n transition: 'default',\n position: 'relative',\n flexShrink: 0,\n color: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n },\n borderStyle: 'none',\n marginStart: {\n // adjusts with the parent flex gap\n isMenu: size(-6)\n }\n});\n\nconst chevronStyles = style({\n scale: {\n direction: {\n rtl: -1\n }\n },\n marginStart: {\n default: 'text-to-visual',\n isMenu: 0\n },\n color: {\n default: 'neutral',\n forcedColors: {\n default: 'LinkText'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst linkStyles = style({\n ...focusRing(),\n borderRadius: 'sm',\n font: 'control',\n color: {\n default: 'neutral-subdued',\n isDisabled: 'disabled',\n isCurrent: 'neutral',\n forcedColors: {\n default: 'LinkText',\n isDisabled: 'GrayText'\n }\n },\n transition: 'default',\n textDecoration: {\n default: 'none',\n isHovered: 'underline',\n isFocusVisible: 'underline',\n isDisabled: 'none'\n },\n cursor: {\n default: 'pointer',\n isDisabled: 'default'\n },\n outlineColor: {\n default: 'focus-ring',\n forcedColors: 'Highlight'\n },\n disableTapHighlight: true\n});\n\nconst currentStyles = style<{size: string}>({\n font: 'control',\n fontWeight: 'bold'\n});\n\n// TODO: support user heading size customization, for now just set it to large\nconst heading = style({\n margin: 0,\n font: 'heading-lg',\n fontWeight: 'extra-bold'\n});\n\nexport interface BreadcrumbProps extends Omit<AriaBreadcrumbItemProps, 'children' | 'style' | 'className' | 'autoFocus'>, LinkDOMProps {\n /** The children of the breadcrumb item. */\n children?: ReactNode\n}\n\nfunction Breadcrumb({children, ...props}: BreadcrumbProps, ref: DOMRef<HTMLLIElement>) {\n let {href, target, rel, download, ping, referrerPolicy} = props;\n let {size = 'M'} = useContext(InternalBreadcrumbsContext) ?? {};\n let domRef = useDOMRef(ref);\n let {direction} = useLocale();\n return (\n <AriaBreadcrumb\n {...props}\n ref={domRef}\n // @ts-ignore\n originalProps={props}\n className={({isCurrent, isDisabled}) => breadcrumbStyles({size, isCurrent, isDisabled})}>\n {({\n isCurrent,\n isDisabled,\n // @ts-ignore\n isMenu\n }) => {\n if (isMenu) {\n return children;\n }\n return (\n isCurrent ?\n <div\n className={currentStyles({size})}>\n <Provider\n values={[\n [HeadingContext, {className: heading}]\n ]}>\n {children}\n </Provider>\n </div>\n : (\n <>\n <Link\n style={({isFocusVisible}) => ({clipPath: isFocusVisible ? 'none' : 'margin-box'})}\n href={href}\n target={target}\n rel={rel}\n download={download}\n ping={ping}\n referrerPolicy={referrerPolicy}\n isDisabled={isDisabled || isCurrent}\n className={({isFocused, isFocusVisible, isHovered, isDisabled, isPressed}) => linkStyles({isFocused, isFocusVisible, isHovered, isDisabled, size, isPressed})}>\n {children}\n </Link>\n <ChevronIcon\n size=\"M\"\n className={chevronStyles({direction})} />\n </>\n )\n );\n }}\n </AriaBreadcrumb>\n );\n}\n\n/** An individual Breadcrumb for Breadcrumbs. */\nlet _Breadcrumb = /*#__PURE__*/ (forwardRef as forwardRefType)(Breadcrumb);\nexport {_Breadcrumb as Breadcrumb};\n\n// Context for passing the count for the custom renderer\nlet CollapseContext = createContext<{\n containerRef: RefObject<HTMLOListElement | null>,\n onAction: BreadcrumbsProps<unknown>['onAction']\n} | null>(null);\n\nfunction CollapsingCollection({children, containerRef, onAction}) {\n return (\n <CollapseContext.Provider value={{containerRef, onAction}}>\n <UNSTABLE_CollectionRendererContext.Provider value={CollapsingCollectionRenderer}>\n {children}\n </UNSTABLE_CollectionRendererContext.Provider>\n </CollapseContext.Provider>\n );\n}\n\nlet CollapsingCollectionRenderer: CollectionRenderer = {\n CollectionRoot({collection}) {\n return useCollectionRender(collection);\n },\n CollectionBranch({collection}) {\n return useCollectionRender(collection);\n }\n};\n\nlet useCollectionRender = (collection: Collection<Node<unknown>>) => {\n let {containerRef, onAction} = useContext(CollapseContext) ?? {};\n let [visibleItems, setVisibleItems] = useState(collection.size);\n let {size = 'M'} = useContext(InternalBreadcrumbsContext);\n\n let children = useMemo(() => {\n let result: Node<any>[] = [];\n for (let key of collection.getKeys()) {\n result.push(collection.getItem(key)!);\n }\n return result;\n }, [collection]);\n\n let listRef = useRef<HTMLDivElement | null>(null);\n let updateOverflow = useCallback(() => {\n let currListRef: HTMLDivElement | null = listRef.current;\n if (!currListRef) {\n setVisibleItems(collection.size);\n return;\n }\n let container = currListRef.parentElement;\n if (!container) {\n setVisibleItems(collection.size);\n return;\n }\n\n let listItems = Array.from(currListRef.querySelectorAll('[data-hidden-breadcrumb]')) as HTMLLIElement[];\n let folder = currListRef.querySelector('button') as HTMLButtonElement;\n if (listItems.length <= 0) {\n setVisibleItems(collection.size);\n return;\n }\n let containerWidth = container.offsetWidth;\n let containerGap = parseInt(getComputedStyle(container).gap, 10);\n let folderGap = parseInt(getComputedStyle(folder).marginInlineStart, 10);\n let newVisibleItems = 0;\n let maxVisibleItems = MAX_VISIBLE_ITEMS;\n\n let widths: Array<number> = [];\n let totalWidth = 0;\n for (let breadcrumb of listItems) {\n let width = breadcrumb.offsetWidth + 1; // offsetWidth is rounded down\n widths.push(width);\n totalWidth += width;\n }\n\n // can we fit all the items without collapsing\n if (totalWidth <= containerWidth - (collection.size * containerGap) && collection.size <= MAX_VISIBLE_ITEMS) {\n setVisibleItems(collection.size);\n return;\n }\n\n // we know there is always at least one item because of the listItems.length check up above\n let widthOfFirst = widths.shift()!;\n let availableWidth = containerWidth - widthOfFirst - folderGap - folder.offsetWidth - containerGap;\n maxVisibleItems -= 2; // account for the first item and folder\n for (let width of widths.reverse()) {\n availableWidth -= width;\n if (availableWidth <= 0) {\n break;\n }\n availableWidth -= containerGap;\n newVisibleItems++;\n }\n\n setVisibleItems(Math.max(MIN_VISIBLE_ITEMS, Math.min(maxVisibleItems, newVisibleItems)));\n }, [collection.size, setVisibleItems]);\n\n // making bad assumption that i can listen to containerRef when it's declared in the parent?\n useResizeObserver({ref: containerRef, onResize: updateOverflow});\n\n useLayoutEffect(() => {\n if (collection.size > 0) {\n queueMicrotask(updateOverflow);\n }\n }, [collection.size, updateOverflow]);\n\n useEffect(() => {\n // Recalculate visible tags when fonts are loaded.\n document.fonts?.ready.then(() => updateOverflow());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n let sliceIndex = collection.size - visibleItems;\n\n return (\n <>\n <HiddenBreadcrumbs items={children} size={size} listRef={listRef} />\n {visibleItems < collection.size && collection.size > 2 ? (\n <>\n {children[0].render?.(children[0])}\n <BreadcrumbMenu items={children.slice(1, sliceIndex)} onAction={onAction} />\n {children.slice(sliceIndex).map(node => <Fragment key={node.key}>{node.render?.(node)}</Fragment >)}\n </>\n ) : (\n <>\n {children.map(node => <Fragment key={node.key}>{node.render?.(node)}</Fragment>)}\n </>\n )}\n </>\n );\n};\n"],"names":[],"version":3,"file":"Breadcrumbs.mjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Breadcrumbs.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 {ActionButton} from './ActionButton';\nimport {\n Breadcrumb as AriaBreadcrumb,\n BreadcrumbsProps as AriaBreadcrumbsProps,\n CollectionRenderer,\n ContextValue,\n HeadingContext,\n Link,\n Provider,\n Breadcrumbs as RACBreadcrumbs,\n UNSTABLE_CollectionRendererContext,\n UNSTABLE_DefaultCollectionRenderer\n} from 'react-aria-components';\nimport {AriaBreadcrumbItemProps, useLocale} from 'react-aria';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {Collection, DOMRef, DOMRefValue, LinkDOMProps, Node} from '@react-types/shared';\nimport {createContext, forwardRef, Fragment, ReactNode, RefObject, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport {focusRing, size, style} from '../style' with { type: 'macro' };\nimport FolderIcon from '../s2wf-icons/S2_Icon_FolderBreadcrumb_20_N.svg';\nimport {forwardRefType} from './types';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {Menu, MenuItem, MenuTrigger} from './Menu';\nimport {Text} from './Content';\nimport {useDOMRef, useResizeObserver} from '@react-spectrum/utils';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nconst MIN_VISIBLE_ITEMS = 1;\nconst MAX_VISIBLE_ITEMS = 4;\n\ninterface BreadcrumbsStyleProps {\n /**\n * Size of the Breadcrumbs including spacing and layout.\n *\n * @default 'M'\n */\n size?: 'M' | 'L',\n /** Whether the breadcrumbs are disabled. */\n isDisabled?: boolean\n /**\n * Whether to place the last Breadcrumb item onto a new line.\n */\n // TODO: isMultiline?: boolean\n /** Whether to always show the root item if the items are collapsed. */\n // TODO: showRoot?: boolean,\n}\n\nexport interface BreadcrumbsProps<T> extends Omit<AriaBreadcrumbsProps<T>, 'children' | 'items' | 'style' | 'className'>, BreadcrumbsStyleProps, StyleProps {\n /** The children of the Breadcrumbs. */\n children?: ReactNode\n}\n\nexport const BreadcrumbsContext = createContext<ContextValue<BreadcrumbsProps<any>, DOMRefValue<HTMLOListElement>>>(null);\n\nconst wrapper = style<BreadcrumbsStyleProps>({\n position: 'relative',\n display: 'flex',\n justifyContent: 'start',\n listStyleType: 'none',\n flexWrap: 'nowrap',\n flexGrow: 1,\n flexShrink: 0,\n flexBasis: 0,\n gap: {\n size: {\n // TODO: why do these scale but other spacings don't?\n M: size(6), // breadcrumbs-text-to-separator-medium\n L: size(9) // breadcrumbs-text-to-separator-large\n }\n },\n padding: 0,\n transition: 'default',\n marginTop: 0,\n marginBottom: 0,\n marginStart: {\n size: {\n M: size(6),\n L: size(9)\n }\n }\n}, getAllowedOverrides());\n\nconst InternalBreadcrumbsContext = createContext<BreadcrumbsProps<any>>({});\n\n/** Breadcrumbs show hierarchy and navigational context for a user’s location within an application. */\nexport const Breadcrumbs = /*#__PURE__*/ (forwardRef as forwardRefType)(function Breadcrumbs<T extends object>(props: BreadcrumbsProps<T>, ref: DOMRef<HTMLOListElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, BreadcrumbsContext);\n let domRef = useDOMRef(ref);\n let {\n UNSAFE_className = '',\n UNSAFE_style,\n styles,\n size = 'M',\n children,\n isDisabled,\n ...otherProps\n } = props;\n\n return (\n <Provider\n values={[\n [InternalBreadcrumbsContext, {size, isDisabled}]\n ]}>\n <CollapsingCollection containerRef={domRef} onAction={props.onAction}>\n <RACBreadcrumbs\n {...otherProps}\n isDisabled={isDisabled}\n ref={domRef}\n style={UNSAFE_style}\n className={UNSAFE_className + wrapper({\n size\n }, styles)}>\n {children}\n </RACBreadcrumbs>\n </CollapsingCollection>\n </Provider>\n );\n});\n\nlet BreadcrumbMenu = (props: {items: Array<Node<any>>, onAction: BreadcrumbsProps<unknown>['onAction']}) => {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let {items, onAction} = props;\n let {direction} = useLocale();\n let {size, isDisabled} = useContext(InternalBreadcrumbsContext);\n let label = stringFormatter.format('breadcrumbs.more');\n return (\n <UNSTABLE_CollectionRendererContext.Provider value={UNSTABLE_DefaultCollectionRenderer}>\n <li className={breadcrumbStyles({size, isDisabled, isMenu: true})}>\n <MenuTrigger>\n <ActionButton isDisabled={isDisabled} isQuiet aria-label={label}><FolderIcon /></ActionButton>\n <Menu items={items} onAction={onAction}>\n {(item: Node<any>) => (\n <MenuItem\n {...item.props.originalProps}\n key={item.key}>\n <Text slot=\"label\">\n {item.props.children({size, isCurrent: false, isMenu: true})}\n </Text>\n </MenuItem>\n )}\n </Menu>\n </MenuTrigger>\n <ChevronIcon\n size={size}\n className={chevronStyles({direction, isMenu: true})} />\n </li>\n </UNSTABLE_CollectionRendererContext.Provider>\n );\n};\n\nlet HiddenBreadcrumbs = function (props: {listRef: RefObject<HTMLDivElement | null>, items: Array<Node<any>>, size: string}) {\n let {listRef, items, size} = props;\n return (\n <div\n // @ts-ignore\n inert=\"true\"\n ref={listRef}\n className={style({\n display: '[inherit]',\n gap: '[inherit]',\n flexWrap: '[inherit]',\n position: 'absolute',\n top: 0,\n bottom: 0,\n start: 0,\n end: 0,\n visibility: 'hidden',\n overflow: 'hidden',\n opacity: 0\n })}>\n {items.map((item, idx) => {\n // pull off individual props as an allow list, don't want refs or other props getting through\n return (\n <div\n data-hidden-breadcrumb\n style={item.props.UNSAFE_style}\n key={item.key}\n className={item.props.className({size, isCurrent: idx === items.length - 1})}>\n {item.props.children({size, isCurrent: idx === items.length - 1})}\n </div>\n );\n })}\n <ActionButton data-hidden-button isQuiet><FolderIcon /></ActionButton>\n </div>\n );\n};\n\nconst breadcrumbStyles = style({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'start',\n height: 'control',\n transition: 'default',\n position: 'relative',\n flexShrink: 0,\n color: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText'\n }\n },\n borderStyle: 'none',\n marginStart: {\n // adjusts with the parent flex gap\n isMenu: size(-6)\n }\n});\n\nconst chevronStyles = style({\n scale: {\n direction: {\n rtl: -1\n }\n },\n marginStart: {\n default: 'text-to-visual',\n isMenu: 0\n },\n color: {\n default: 'neutral',\n forcedColors: {\n default: 'LinkText'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst linkStyles = style({\n ...focusRing(),\n borderRadius: 'sm',\n font: 'control',\n color: {\n default: 'neutral-subdued',\n isDisabled: 'disabled',\n isCurrent: 'neutral',\n forcedColors: {\n default: 'LinkText',\n isDisabled: 'GrayText'\n }\n },\n transition: 'default',\n textDecoration: {\n default: 'none',\n isHovered: 'underline',\n isFocusVisible: 'underline',\n isDisabled: 'none'\n },\n cursor: {\n default: 'pointer',\n isDisabled: 'default'\n },\n outlineColor: {\n default: 'focus-ring',\n forcedColors: 'Highlight'\n },\n disableTapHighlight: true\n});\n\nconst currentStyles = style<{size: string}>({\n font: 'control',\n fontWeight: 'bold'\n});\n\n// TODO: support user heading size customization, for now just set it to large\nconst heading = style({\n margin: 0,\n font: 'heading-lg',\n fontWeight: 'extra-bold'\n});\n\nexport interface BreadcrumbProps extends Omit<AriaBreadcrumbItemProps, 'children' | 'style' | 'className' | 'autoFocus'>, LinkDOMProps {\n /** The children of the breadcrumb item. */\n children?: ReactNode\n}\n\n/** An individual Breadcrumb for Breadcrumbs. */\nexport const Breadcrumb = /*#__PURE__*/ (forwardRef as forwardRefType)(function Breadcrumb({children, ...props}: BreadcrumbProps, ref: DOMRef<HTMLLIElement>) {\n let {href, target, rel, download, ping, referrerPolicy} = props;\n let {size = 'M'} = useContext(InternalBreadcrumbsContext) ?? {};\n let domRef = useDOMRef(ref);\n let {direction} = useLocale();\n return (\n <AriaBreadcrumb\n {...props}\n ref={domRef}\n // @ts-ignore\n originalProps={props}\n className={({isCurrent, isDisabled}) => breadcrumbStyles({size, isCurrent, isDisabled})}>\n {({\n isCurrent,\n isDisabled,\n // @ts-ignore\n isMenu\n }) => {\n if (isMenu) {\n return children;\n }\n return (\n isCurrent ?\n <div\n className={currentStyles({size})}>\n <Provider\n values={[\n [HeadingContext, {className: heading}]\n ]}>\n {children}\n </Provider>\n </div>\n : (\n <>\n <Link\n style={({isFocusVisible}) => ({clipPath: isFocusVisible ? 'none' : 'margin-box'})}\n href={href}\n target={target}\n rel={rel}\n download={download}\n ping={ping}\n referrerPolicy={referrerPolicy}\n isDisabled={isDisabled || isCurrent}\n className={({isFocused, isFocusVisible, isHovered, isDisabled, isPressed}) => linkStyles({isFocused, isFocusVisible, isHovered, isDisabled, size, isPressed})}>\n {children}\n </Link>\n <ChevronIcon\n size=\"M\"\n className={chevronStyles({direction})} />\n </>\n )\n );\n }}\n </AriaBreadcrumb>\n );\n});\n\n// Context for passing the count for the custom renderer\nlet CollapseContext = createContext<{\n containerRef: RefObject<HTMLOListElement | null>,\n onAction: BreadcrumbsProps<unknown>['onAction']\n} | null>(null);\n\nfunction CollapsingCollection({children, containerRef, onAction}) {\n return (\n <CollapseContext.Provider value={{containerRef, onAction}}>\n <UNSTABLE_CollectionRendererContext.Provider value={CollapsingCollectionRenderer}>\n {children}\n </UNSTABLE_CollectionRendererContext.Provider>\n </CollapseContext.Provider>\n );\n}\n\nlet CollapsingCollectionRenderer: CollectionRenderer = {\n CollectionRoot({collection}) {\n return useCollectionRender(collection);\n },\n CollectionBranch({collection}) {\n return useCollectionRender(collection);\n }\n};\n\nlet useCollectionRender = (collection: Collection<Node<unknown>>) => {\n let {containerRef, onAction} = useContext(CollapseContext) ?? {};\n let [visibleItems, setVisibleItems] = useState(collection.size);\n let {size = 'M'} = useContext(InternalBreadcrumbsContext);\n\n let children = useMemo(() => {\n let result: Node<any>[] = [];\n for (let key of collection.getKeys()) {\n result.push(collection.getItem(key)!);\n }\n return result;\n }, [collection]);\n\n let listRef = useRef<HTMLDivElement | null>(null);\n let updateOverflow = useCallback(() => {\n let currListRef: HTMLDivElement | null = listRef.current;\n if (!currListRef) {\n setVisibleItems(collection.size);\n return;\n }\n let container = currListRef.parentElement;\n if (!container) {\n setVisibleItems(collection.size);\n return;\n }\n\n let listItems = Array.from(currListRef.querySelectorAll('[data-hidden-breadcrumb]')) as HTMLLIElement[];\n let folder = currListRef.querySelector('button') as HTMLButtonElement;\n if (listItems.length <= 0) {\n setVisibleItems(collection.size);\n return;\n }\n let containerWidth = container.offsetWidth;\n let containerGap = parseInt(getComputedStyle(container).gap, 10);\n let folderGap = parseInt(getComputedStyle(folder).marginInlineStart, 10);\n let newVisibleItems = 0;\n let maxVisibleItems = MAX_VISIBLE_ITEMS;\n\n let widths: Array<number> = [];\n let totalWidth = 0;\n for (let breadcrumb of listItems) {\n let width = breadcrumb.offsetWidth + 1; // offsetWidth is rounded down\n widths.push(width);\n totalWidth += width;\n }\n\n // can we fit all the items without collapsing\n if (totalWidth <= containerWidth - (collection.size * containerGap) && collection.size <= MAX_VISIBLE_ITEMS) {\n setVisibleItems(collection.size);\n return;\n }\n\n // we know there is always at least one item because of the listItems.length check up above\n let widthOfFirst = widths.shift()!;\n let availableWidth = containerWidth - widthOfFirst - folderGap - folder.offsetWidth - containerGap;\n maxVisibleItems -= 2; // account for the first item and folder\n for (let width of widths.reverse()) {\n availableWidth -= width;\n if (availableWidth <= 0) {\n break;\n }\n availableWidth -= containerGap;\n newVisibleItems++;\n }\n\n setVisibleItems(Math.max(MIN_VISIBLE_ITEMS, Math.min(maxVisibleItems, newVisibleItems)));\n }, [collection.size, setVisibleItems]);\n\n // making bad assumption that i can listen to containerRef when it's declared in the parent?\n useResizeObserver({ref: containerRef, onResize: updateOverflow});\n\n useLayoutEffect(() => {\n if (collection.size > 0) {\n queueMicrotask(updateOverflow);\n }\n }, [collection.size, updateOverflow]);\n\n useEffect(() => {\n // Recalculate visible tags when fonts are loaded.\n document.fonts?.ready.then(() => updateOverflow());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n let sliceIndex = collection.size - visibleItems;\n\n return (\n <>\n <HiddenBreadcrumbs items={children} size={size} listRef={listRef} />\n {visibleItems < collection.size && collection.size > 2 ? (\n <>\n {children[0].render?.(children[0])}\n <BreadcrumbMenu items={children.slice(1, sliceIndex)} onAction={onAction} />\n {children.slice(sliceIndex).map(node => <Fragment key={node.key}>{node.render?.(node)}</Fragment >)}\n </>\n ) : (\n <>\n {children.map(node => <Fragment key={node.key}>{node.render?.(node)}</Fragment>)}\n </>\n )}\n </>\n );\n};\n"],"names":[],"version":3,"file":"Breadcrumbs.mjs.map"}
|