@react-spectrum/s2 0.6.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.map +1 -1
- package/dist/Accordion.css +1 -5
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionBar.cjs +2 -2
- package/dist/ActionBar.css +0 -6
- package/dist/ActionBar.css.map +1 -1
- package/dist/ActionBar.mjs +2 -2
- package/dist/ActionButton.cjs +4 -4
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +0 -6
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +4 -4
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.css +1 -5
- package/dist/ActionButtonGroup.css.map +1 -1
- package/dist/ActionMenu.cjs.map +1 -1
- package/dist/ActionMenu.mjs.map +1 -1
- package/dist/AlertDialog.css +1 -5
- package/dist/AlertDialog.css.map +1 -1
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css +1 -5
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +1 -1
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +0 -6
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +1 -1
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +32 -14
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +26 -8
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +33 -15
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +7 -7
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +0 -6
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +8 -8
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +4 -4
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +0 -6
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +4 -4
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +1 -1
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css +1 -5
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +1 -1
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +15 -15
- package/dist/Card.cjs.map +1 -1
- package/dist/Card.css +0 -6
- package/dist/Card.css.map +1 -1
- package/dist/Card.mjs +16 -16
- package/dist/Card.mjs.map +1 -1
- package/dist/CardView.cjs +71 -309
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +1 -5
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +28 -266
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +1 -5
- package/dist/CenterBaseline.css.map +1 -1
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +1 -1
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +0 -6
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +1 -1
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css +0 -6
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.css +1 -5
- package/dist/ClearButton.css.map +1 -1
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +1 -5
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css +1 -5
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css +0 -6
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorHandle.cjs +3 -3
- package/dist/ColorHandle.css +1 -5
- package/dist/ColorHandle.css.map +1 -1
- package/dist/ColorHandle.mjs +3 -3
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +0 -6
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +1 -5
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +1 -1
- package/dist/ColorSwatchPicker.cjs.map +1 -1
- package/dist/ColorSwatchPicker.css +1 -5
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +1 -1
- package/dist/ColorSwatchPicker.mjs.map +1 -1
- package/dist/ColorWheel.cjs.map +1 -1
- package/dist/ColorWheel.css +1 -5
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +2 -2
- package/dist/ComboBox.css +0 -6
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +2 -2
- package/dist/Content.cjs +3 -1
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs +3 -1
- package/dist/Content.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +5 -5
- package/dist/ContextualHelp.cjs.map +1 -1
- package/dist/ContextualHelp.css +0 -6
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +5 -5
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/CustomDialog.css +1 -5
- package/dist/CustomDialog.css.map +1 -1
- package/dist/Dialog.cjs +10 -10
- package/dist/Dialog.css +0 -6
- package/dist/Dialog.css.map +1 -1
- package/dist/Dialog.mjs +10 -10
- package/dist/Disclosure.cjs +2 -2
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +0 -6
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +2 -2
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs.map +1 -1
- package/dist/Divider.css +1 -5
- package/dist/Divider.css.map +1 -1
- package/dist/Divider.mjs.map +1 -1
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +0 -6
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +7 -7
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +0 -6
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +7 -7
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +1 -5
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +5 -5
- package/dist/FullscreenDialog.css +0 -6
- package/dist/FullscreenDialog.css.map +1 -1
- package/dist/FullscreenDialog.mjs +5 -5
- package/dist/IllustratedMessage.cjs +1 -1
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +0 -6
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +1 -1
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +14 -2
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css +1 -5
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +15 -3
- package/dist/Image.mjs.map +1 -1
- package/dist/InlineAlert.cjs +1 -1
- package/dist/InlineAlert.css +0 -6
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +1 -1
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css +0 -6
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +20 -8
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +12 -6
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +21 -9
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +0 -6
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.css +1 -5
- package/dist/Modal.css.map +1 -1
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css +0 -6
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +95 -70
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +8 -10
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +96 -71
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +1 -3
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +5 -9
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +1 -3
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +0 -6
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css +1 -5
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Provider.css +1 -5
- package/dist/Provider.css.map +1 -1
- package/dist/Radio.css +0 -6
- package/dist/Radio.css.map +1 -1
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css +0 -6
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs.map +1 -1
- package/dist/RangeSlider.cjs.map +1 -1
- package/dist/RangeSlider.mjs.map +1 -1
- package/dist/SearchField.cjs +3 -3
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +0 -6
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +3 -3
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +7 -7
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +0 -6
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +8 -8
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +0 -6
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +0 -6
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +0 -6
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +75 -92
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +10 -8
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +76 -93
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +451 -167
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +208 -122
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +451 -167
- 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 +13 -13
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +0 -6
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +13 -13
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +1 -1
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +0 -6
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +1 -1
- package/dist/TextField.mjs.map +1 -1
- package/dist/ToggleButton.cjs +3 -3
- package/dist/ToggleButton.cjs.map +1 -1
- package/dist/ToggleButton.css +1 -5
- package/dist/ToggleButton.css.map +1 -1
- package/dist/ToggleButton.mjs +3 -3
- package/dist/ToggleButton.mjs.map +1 -1
- package/dist/ToggleButtonGroup.cjs.map +1 -1
- package/dist/ToggleButtonGroup.mjs.map +1 -1
- package/dist/Tooltip.cjs +1 -1
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +0 -6
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +1 -1
- 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/main.cjs +5 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +3 -1
- package/dist/module.mjs.map +1 -1
- package/dist/types.d.ts +120 -81
- package/dist/types.d.ts.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 +3 -5
- 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 +17 -18
- package/src/Accordion.tsx +1 -1
- package/src/ActionButton.tsx +2 -2
- package/src/ActionMenu.tsx +1 -1
- package/src/Avatar.tsx +1 -1
- package/src/AvatarGroup.tsx +1 -1
- package/src/Badge.tsx +27 -8
- package/src/Breadcrumbs.tsx +13 -13
- package/src/Button.tsx +4 -4
- package/src/ButtonGroup.tsx +1 -1
- package/src/Card.tsx +2 -2
- package/src/CardView.tsx +18 -366
- package/src/Checkbox.tsx +1 -1
- package/src/CheckboxGroup.tsx +2 -2
- package/src/CloseButton.tsx +1 -1
- package/src/ColorArea.tsx +1 -1
- package/src/ColorField.tsx +1 -1
- package/src/ColorSlider.tsx +1 -1
- package/src/ColorSwatch.tsx +2 -2
- package/src/ColorSwatchPicker.tsx +1 -2
- package/src/ColorWheel.tsx +1 -1
- package/src/Content.tsx +11 -9
- package/src/ContextualHelp.tsx +2 -2
- package/src/Disclosure.tsx +1 -1
- package/src/Divider.tsx +1 -1
- package/src/DropZone.tsx +2 -2
- package/src/Field.tsx +1 -1
- package/src/Form.tsx +2 -2
- package/src/Icon.tsx +2 -2
- package/src/IllustratedMessage.tsx +1 -1
- package/src/Image.tsx +19 -5
- package/src/Link.tsx +2 -2
- package/src/Menu.tsx +9 -4
- package/src/Meter.tsx +1 -1
- package/src/NumberField.tsx +1 -1
- package/src/Picker.tsx +81 -60
- package/src/Popover.tsx +2 -1
- package/src/ProgressBar.tsx +1 -1
- package/src/ProgressCircle.tsx +1 -1
- package/src/RadioGroup.tsx +2 -2
- package/src/RangeSlider.tsx +1 -1
- package/src/SearchField.tsx +1 -1
- package/src/SegmentedControl.tsx +6 -9
- package/src/Skeleton.tsx +6 -8
- package/src/Slider.tsx +1 -1
- package/src/StatusLight.tsx +1 -1
- package/src/Switch.tsx +1 -1
- package/src/TableView.tsx +67 -71
- package/src/Tabs.tsx +451 -145
- package/src/TabsPicker.tsx +350 -0
- package/src/TagGroup.tsx +4 -4
- package/src/TextField.tsx +2 -2
- package/src/ToggleButton.tsx +2 -2
- package/src/ToggleButtonGroup.tsx +1 -1
- package/src/Tooltip.tsx +4 -4
- package/src/TreeView.tsx +450 -0
- package/src/index.ts +2 -0
- package/src/style-utils.ts +0 -1
- package/style/__tests__/style-macro.test.js +3 -7
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/style-macro.cjs +5 -3
- package/style/dist/style-macro.cjs.map +1 -1
- package/style/dist/style-macro.mjs +5 -3
- package/style/dist/style-macro.mjs.map +1 -1
- package/style/dist/types.d.ts.map +1 -1
- package/style/spectrum-theme.ts +0 -1
- package/style/style-macro.ts +9 -3
- 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
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA+BM,MAAM,0DAA2B,CAAA,GAAA,0BAAY,EAA8E;AAK3H,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAA2B;IAC/H,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,4CAAoB;QAClB,GAAG,UAAU;QACd,KAAK;QACL,WAAW,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;UAUV;qBAAC;QAAO,GAAG,MAAM,MAAM;kBACjD,cAAA,gCAAC,CAAA,GAAA,oDAAyB,EAAE,QAAQ;YAAC,OAAO;4BAAC;sBAAY;0BAAM;YAAQ;sBACpE,MAAM,QAAQ;;;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAAsC;IAC5F,qBACE,gCAAC,CAAA,GAAA,gDAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAUvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;kBAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM;;oBACjB;oBACA,4BACC,gCAAC;wBACC,aAAW;wBACX,SAAS;;;;;AAmBrB","sources":["packages/@react-spectrum/s2/src/ColorSwatchPicker.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 {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, Color, ContextValue, SlotProps} from 'react-aria-components';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n /** The ColorSwatches within the ColorSwatchPicker. */\n children: ReactNode,\n /**\n * The amount of padding between the swatches.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /**\n * The size of the color swatches.\n * @default 'M'\n */\n size?: 'XS' | 'S' | 'M' | 'L',\n /**\n * The corner rounding of the color swatches.\n * @default 'none'\n */\n rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n let {\n density = 'regular',\n size = 'M',\n rounding = 'none',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n\n return (\n <AriaColorSwatchPicker\n {...otherProps}\n ref={domRef}\n className={props.UNSAFE_className + style({\n display: 'flex',\n flexWrap: 'wrap',\n gap: {\n density: {\n compact: space(2),\n regular: 4,\n spacious: space(6)\n }\n }\n }, getAllowedOverrides())({density}, props.styles)}>\n <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n {props.children}\n </InternalColorSwatchContext.Provider>\n </AriaColorSwatchPicker>\n );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n return (\n <AriaColorSwatchPickerItem\n color={color}\n className={renderProps => style({\n ...focusRing(),\n position: 'relative',\n borderRadius: {\n rounding: {\n none: 'none',\n default: 'sm',\n full: 'full'\n }\n }\n })({...renderProps, rounding})}>\n {({isSelected}) => (<>\n {swatch}\n {isSelected && (\n <div\n aria-hidden\n className={style({\n position: 'absolute',\n pointerEvents: 'none',\n inset: 0,\n boxSizing: 'border-box',\n borderColor: 'gray-900',\n borderStyle: 'solid',\n borderWidth: 2,\n outlineColor: 'gray-25',\n outlineStyle: 'solid',\n outlineWidth: 2,\n outlineOffset: -4,\n forcedColorAdjust: 'none',\n borderRadius: '[inherit]'\n })} />\n )}\n </>)}\n </AriaColorSwatchPickerItem>\n );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.cjs.map"}
|
|
@@ -184,7 +184,7 @@
|
|
|
184
184
|
}
|
|
185
185
|
}
|
|
186
186
|
|
|
187
|
-
@layer _.b
|
|
187
|
+
@layer _.b;
|
|
188
188
|
|
|
189
189
|
@layer _.b.a {
|
|
190
190
|
@media (forced-colors: active) {
|
|
@@ -193,8 +193,4 @@
|
|
|
193
193
|
}
|
|
194
194
|
}
|
|
195
195
|
}
|
|
196
|
-
|
|
197
|
-
.\.:not(#a#b) {
|
|
198
|
-
all: revert-layer;
|
|
199
|
-
}
|
|
200
196
|
/*# sourceMappingURL=ColorSwatchPicker.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"AC4D0C;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsBV;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAgBT;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtCmB;;AAsBV;EAAA;IAAA","sources":["26baf334ec196f8c","packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["@import \"e16c0c8e50c537a4\";\n@import \"6325f62168102e9d\";\n@import \"aa108d3a66fddade\";\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 {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, Color, ContextValue, SlotProps} from 'react-aria-components';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n /** The ColorSwatches within the ColorSwatchPicker. */\n children: ReactNode,\n /**\n * The amount of padding between the swatches.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /**\n * The size of the color swatches.\n * @default 'M'\n */\n size?: 'XS' | 'S' | 'M' | 'L',\n /**\n * The corner rounding of the color swatches.\n * @default 'none'\n */\n rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n let {\n density = 'regular',\n size = 'M',\n rounding = 'none',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n\n return (\n <AriaColorSwatchPicker\n {...otherProps}\n ref={domRef}\n className={props.UNSAFE_className + style({\n display: 'flex',\n flexWrap: 'wrap',\n gap: {\n density: {\n compact: space(2),\n regular: 4,\n spacious: space(6)\n }\n }\n }, getAllowedOverrides())({density}, props.styles)}>\n <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n {props.children}\n </InternalColorSwatchContext.Provider>\n </AriaColorSwatchPicker>\n );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n return (\n <AriaColorSwatchPickerItem\n color={color}\n className={renderProps => style({\n ...focusRing(),\n position: 'relative',\n borderRadius: {\n rounding: {\n none: 'none',\n default: 'sm',\n full: 'full'\n }\n }\n })({...renderProps, rounding})}>\n {({isSelected}) => (<>\n {swatch}\n {isSelected && (\n <div\n aria-hidden\n className={style({\n position: 'absolute',\n pointerEvents: 'none',\n inset: 0,\n boxSizing: 'border-box',\n borderColor: 'gray-900',\n borderStyle: 'solid',\n borderWidth: 2,\n outlineColor: 'gray-25',\n outlineStyle: 'solid',\n outlineWidth: 2,\n outlineOffset: -4,\n forcedColorAdjust: 'none',\n borderRadius: '[inherit]'\n })} />\n )}\n </>)}\n </AriaColorSwatchPickerItem>\n );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.css.map"}
|
|
@@ -90,7 +90,7 @@ function $ba9c901b6c815fb9$var$useWrapper(swatch, color, rounding) {
|
|
|
90
90
|
swatch,
|
|
91
91
|
isSelected && /*#__PURE__*/ (0, $bOBHx$jsx)("div", {
|
|
92
92
|
"aria-hidden": true,
|
|
93
|
-
className: "
|
|
93
|
+
className: " Va __Ca Ya _aa Wa Xa __oa co wa uc vc sc tc dd _Mb _Oc _N-3hmpy _Ab _w-17zqamw _x-17zqamw _y-17zqamw _z-17zqamw"
|
|
94
94
|
})
|
|
95
95
|
]
|
|
96
96
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;
|
|
1
|
+
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA+BM,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAA8E;AAK3H,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAA2B;IAC/H,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,KAAK;QACL,WAAW,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;UAUV;qBAAC;QAAO,GAAG,MAAM,MAAM;kBACjD,cAAA,gBAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;YAAC,OAAO;4BAAC;sBAAY;0BAAM;YAAQ;sBACpE,MAAM,QAAQ;;;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAAsC;IAC5F,qBACE,gBAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAUvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;kBAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM;;oBACjB;oBACA,4BACC,gBAAC;wBACC,aAAW;wBACX,SAAS;;;;;AAmBrB","sources":["packages/@react-spectrum/s2/src/ColorSwatchPicker.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 {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, Color, ContextValue, SlotProps} from 'react-aria-components';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n /** The ColorSwatches within the ColorSwatchPicker. */\n children: ReactNode,\n /**\n * The amount of padding between the swatches.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /**\n * The size of the color swatches.\n * @default 'M'\n */\n size?: 'XS' | 'S' | 'M' | 'L',\n /**\n * The corner rounding of the color swatches.\n * @default 'none'\n */\n rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n let {\n density = 'regular',\n size = 'M',\n rounding = 'none',\n ...otherProps\n } = props;\n let domRef = useDOMRef(ref);\n\n return (\n <AriaColorSwatchPicker\n {...otherProps}\n ref={domRef}\n className={props.UNSAFE_className + style({\n display: 'flex',\n flexWrap: 'wrap',\n gap: {\n density: {\n compact: space(2),\n regular: 4,\n spacious: space(6)\n }\n }\n }, getAllowedOverrides())({density}, props.styles)}>\n <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n {props.children}\n </InternalColorSwatchContext.Provider>\n </AriaColorSwatchPicker>\n );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n return (\n <AriaColorSwatchPickerItem\n color={color}\n className={renderProps => style({\n ...focusRing(),\n position: 'relative',\n borderRadius: {\n rounding: {\n none: 'none',\n default: 'sm',\n full: 'full'\n }\n }\n })({...renderProps, rounding})}>\n {({isSelected}) => (<>\n {swatch}\n {isSelected && (\n <div\n aria-hidden\n className={style({\n position: 'absolute',\n pointerEvents: 'none',\n inset: 0,\n boxSizing: 'border-box',\n borderColor: 'gray-900',\n borderStyle: 'solid',\n borderWidth: 2,\n outlineColor: 'gray-25',\n outlineStyle: 'solid',\n outlineWidth: 2,\n outlineOffset: -4,\n forcedColorAdjust: 'none',\n borderRadius: '[inherit]'\n })} />\n )}\n </>)}\n </AriaColorSwatchPickerItem>\n );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.mjs.map"}
|
package/dist/ColorWheel.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuBM,MAAM,0DAAoB,CAAA,GAAA,0BAAY,
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuBM,MAAM,0DAAoB,CAAA,GAAA,0BAAY,EAAuE;AAK7G,MAAM,0DAAa,CAAA,GAAA,uBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAA2B;IAC1G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,oBAAC,mBAAmB,kBAAI,YAAY,UAAE,SAAS,IAAG,GAAG;IACzD,IAAI,eAAe,CAAA,GAAA,mCAAQ,EAAE;IAC7B,kCAAkC;IAClC,IAAI,QAAC,OAAO,KAAI,GAAG;IACnB,IAAI,cAAc,KAAK,GAAG,CAAC,MAAM,OAAO;IACxC,IAAI,YAAY;IAChB,IAAI,cAAc,cAAc;IAChC,qBACE,gCAAC,CAAA,GAAA,qCAAa;QACX,GAAG,KAAK;QACT,aAAa;QACb,aAAa;QACb,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB;kBAC7B,CAAC,cAAC,UAAU,SAAE,KAAK,EAAC,iBAAM;;kCACzB,gCAAC,CAAA,GAAA,0CAAc;wBACb,OAAO,CAAC,gBAAC,YAAY,cAAE,UAAU,EAAC,GAAM,CAAA;gCACtC,YAAY,aAAa,YAAY,aAAa,UAAU;4BAC9D,CAAA;wBACA;;;;;;;;;;;;;;;;kCAiBF,gCAAC;wBACC,WAAW;;;;;;;;;;;;;;;;;;0BAeR;wCAAC;wBAAU;;kCAChB,gCAAC,CAAA,GAAA,qCAAU;wBACT,cAAc;wBACd,aAAa;4BACX,IAAI,KAAC,CAAC,KAAE,CAAC,EAAC,GAAG,MAAM,gBAAgB,CAAC,cAAc,YAAY;4BAC9D,OAAO;gCACL,GAAG,AAAC,CAAA,cAAc,CAAA,IAAM,CAAA,cAAc,CAAA;gCACtC,GAAG,AAAC,CAAA,cAAc,CAAA,IAAM,CAAA,cAAc,CAAA;4BACxC;wBACF;;;;;AAIV","sources":["packages/@react-spectrum/s2/src/ColorWheel.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ColorWheel as AriaColorWheel,\n ColorWheelProps as AriaColorWheelProps,\n ColorWheelTrack,\n ContextValue\n} from 'react-aria-components';\nimport {ColorHandle} from './ColorHandle';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorWheelProps extends Omit<AriaColorWheelProps, 'children' | 'className' | 'style' | 'outerRadius' | 'innerRadius'>, StyleProps {\n /**\n * @default 192\n */\n size?: number\n}\n\nexport const ColorWheelContext = createContext<ContextValue<Partial<ColorWheelProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorWheel allows users to adjust the hue of an HSL or HSB color value on a circular track.\n */\nexport const ColorWheel = forwardRef(function ColorWheel(props: ColorWheelProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ColorWheelContext);\n let {UNSAFE_className = '', UNSAFE_style, styles = ''} = props;\n let containerRef = useDOMRef(ref);\n // TODO: how to do mobile scaling?\n let {size = 192} = props;\n let outerRadius = Math.max(size, 175) / 2;\n let thickness = 24;\n let innerRadius = outerRadius - 24;\n return (\n <AriaColorWheel \n {...props}\n outerRadius={outerRadius}\n innerRadius={innerRadius}\n ref={containerRef}\n style={UNSAFE_style}\n className={UNSAFE_className + styles}>\n {({isDisabled, state}) => (<>\n <ColorWheelTrack\n style={({defaultStyle, isDisabled}) => ({\n background: isDisabled ? undefined : defaultStyle.background\n })}\n className={style({\n // Outer border\n borderRadius: 'full',\n outlineColor: {\n default: 'gray-1000/10',\n forcedColors: 'ButtonBorder'\n },\n outlineWidth: 1,\n outlineOffset: -1,\n outlineStyle: {\n default: 'solid',\n isDisabled: 'none'\n },\n backgroundColor: {\n isDisabled: 'disabled'\n }\n })} />\n <div\n className={style({\n // Inner border\n position: 'absolute',\n inset: 24,\n pointerEvents: 'none',\n borderRadius: 'full',\n outlineColor: {\n default: 'gray-1000/10',\n forcedColors: 'ButtonBorder'\n },\n outlineWidth: 1,\n outlineStyle: {\n default: 'solid',\n isDisabled: 'none'\n }\n })({isDisabled})} />\n <ColorHandle\n containerRef={containerRef}\n getPosition={() => {\n let {x, y} = state.getThumbPosition(outerRadius - thickness / 2);\n return {\n x: (outerRadius + x) / (outerRadius * 2),\n y: (outerRadius + y) / (outerRadius * 2)\n };\n }} />\n </>)}\n </AriaColorWheel>\n );\n});\n"],"names":[],"version":3,"file":"ColorWheel.cjs.map"}
|
package/dist/ColorWheel.css
CHANGED
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
}
|
|
65
65
|
}
|
|
66
66
|
|
|
67
|
-
@layer _.b
|
|
67
|
+
@layer _.b;
|
|
68
68
|
|
|
69
69
|
@layer _.b.a {
|
|
70
70
|
@media (forced-colors: active) {
|
|
@@ -73,8 +73,4 @@
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
|
-
|
|
77
|
-
.\.:not(#a#b) {
|
|
78
|
-
all: revert-layer;
|
|
79
|
-
}
|
|
80
76
|
/*# sourceMappingURL=ColorWheel.css.map */
|
package/dist/ColorWheel.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AC4DqB;EAAA;;;;EAAA;;;;EAkBA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAlBA;;AAAA;EAAA;IAAA
|
|
1
|
+
{"mappings":"AC4DqB;EAAA;;;;EAAA;;;;EAkBA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAlBA;;AAAA;EAAA;IAAA","sources":["08c4afb7d0604130","packages/@react-spectrum/s2/src/ColorWheel.tsx"],"sourcesContent":["@import \"54eced5f2b164503\";\n@import \"1e65bf1fcba37015\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ColorWheel as AriaColorWheel,\n ColorWheelProps as AriaColorWheelProps,\n ColorWheelTrack,\n ContextValue\n} from 'react-aria-components';\nimport {ColorHandle} from './ColorHandle';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorWheelProps extends Omit<AriaColorWheelProps, 'children' | 'className' | 'style' | 'outerRadius' | 'innerRadius'>, StyleProps {\n /**\n * @default 192\n */\n size?: number\n}\n\nexport const ColorWheelContext = createContext<ContextValue<Partial<ColorWheelProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorWheel allows users to adjust the hue of an HSL or HSB color value on a circular track.\n */\nexport const ColorWheel = forwardRef(function ColorWheel(props: ColorWheelProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ColorWheelContext);\n let {UNSAFE_className = '', UNSAFE_style, styles = ''} = props;\n let containerRef = useDOMRef(ref);\n // TODO: how to do mobile scaling?\n let {size = 192} = props;\n let outerRadius = Math.max(size, 175) / 2;\n let thickness = 24;\n let innerRadius = outerRadius - 24;\n return (\n <AriaColorWheel \n {...props}\n outerRadius={outerRadius}\n innerRadius={innerRadius}\n ref={containerRef}\n style={UNSAFE_style}\n className={UNSAFE_className + styles}>\n {({isDisabled, state}) => (<>\n <ColorWheelTrack\n style={({defaultStyle, isDisabled}) => ({\n background: isDisabled ? undefined : defaultStyle.background\n })}\n className={style({\n // Outer border\n borderRadius: 'full',\n outlineColor: {\n default: 'gray-1000/10',\n forcedColors: 'ButtonBorder'\n },\n outlineWidth: 1,\n outlineOffset: -1,\n outlineStyle: {\n default: 'solid',\n isDisabled: 'none'\n },\n backgroundColor: {\n isDisabled: 'disabled'\n }\n })} />\n <div\n className={style({\n // Inner border\n position: 'absolute',\n inset: 24,\n pointerEvents: 'none',\n borderRadius: 'full',\n outlineColor: {\n default: 'gray-1000/10',\n forcedColors: 'ButtonBorder'\n },\n outlineWidth: 1,\n outlineStyle: {\n default: 'solid',\n isDisabled: 'none'\n }\n })({isDisabled})} />\n <ColorHandle\n containerRef={containerRef}\n getPosition={() => {\n let {x, y} = state.getThumbPosition(outerRadius - thickness / 2);\n return {\n x: (outerRadius + x) / (outerRadius * 2),\n y: (outerRadius + y) / (outerRadius * 2)\n };\n }} />\n </>)}\n </AriaColorWheel>\n );\n});\n"],"names":[],"version":3,"file":"ColorWheel.css.map"}
|
package/dist/ColorWheel.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuBM,MAAM,0DAAoB,CAAA,GAAA,oBAAY,
|
|
1
|
+
{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAuBM,MAAM,0DAAoB,CAAA,GAAA,oBAAY,EAAuE;AAK7G,MAAM,0DAAa,CAAA,GAAA,iBAAS,EAAE,SAAS,WAAW,KAAsB,EAAE,GAA2B;IAC1G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,oBAAC,mBAAmB,kBAAI,YAAY,UAAE,SAAS,IAAG,GAAG;IACzD,IAAI,eAAe,CAAA,GAAA,gBAAQ,EAAE;IAC7B,kCAAkC;IAClC,IAAI,QAAC,OAAO,KAAI,GAAG;IACnB,IAAI,cAAc,KAAK,GAAG,CAAC,MAAM,OAAO;IACxC,IAAI,YAAY;IAChB,IAAI,cAAc,cAAc;IAChC,qBACE,gBAAC,CAAA,GAAA,iBAAa;QACX,GAAG,KAAK;QACT,aAAa;QACb,aAAa;QACb,KAAK;QACL,OAAO;QACP,WAAW,mBAAmB;kBAC7B,CAAC,cAAC,UAAU,SAAE,KAAK,EAAC,iBAAM;;kCACzB,gBAAC,CAAA,GAAA,sBAAc;wBACb,OAAO,CAAC,gBAAC,YAAY,cAAE,UAAU,EAAC,GAAM,CAAA;gCACtC,YAAY,aAAa,YAAY,aAAa,UAAU;4BAC9D,CAAA;wBACA;;;;;;;;;;;;;;;;kCAiBF,gBAAC;wBACC,WAAW;;;;;;;;;;;;;;;;;;0BAeR;wCAAC;wBAAU;;kCAChB,gBAAC,CAAA,GAAA,yCAAU;wBACT,cAAc;wBACd,aAAa;4BACX,IAAI,KAAC,CAAC,KAAE,CAAC,EAAC,GAAG,MAAM,gBAAgB,CAAC,cAAc,YAAY;4BAC9D,OAAO;gCACL,GAAG,AAAC,CAAA,cAAc,CAAA,IAAM,CAAA,cAAc,CAAA;gCACtC,GAAG,AAAC,CAAA,cAAc,CAAA,IAAM,CAAA,cAAc,CAAA;4BACxC;wBACF;;;;;AAIV","sources":["packages/@react-spectrum/s2/src/ColorWheel.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ColorWheel as AriaColorWheel,\n ColorWheelProps as AriaColorWheelProps,\n ColorWheelTrack,\n ContextValue\n} from 'react-aria-components';\nimport {ColorHandle} from './ColorHandle';\nimport {createContext, forwardRef} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorWheelProps extends Omit<AriaColorWheelProps, 'children' | 'className' | 'style' | 'outerRadius' | 'innerRadius'>, StyleProps {\n /**\n * @default 192\n */\n size?: number\n}\n\nexport const ColorWheelContext = createContext<ContextValue<Partial<ColorWheelProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorWheel allows users to adjust the hue of an HSL or HSB color value on a circular track.\n */\nexport const ColorWheel = forwardRef(function ColorWheel(props: ColorWheelProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ColorWheelContext);\n let {UNSAFE_className = '', UNSAFE_style, styles = ''} = props;\n let containerRef = useDOMRef(ref);\n // TODO: how to do mobile scaling?\n let {size = 192} = props;\n let outerRadius = Math.max(size, 175) / 2;\n let thickness = 24;\n let innerRadius = outerRadius - 24;\n return (\n <AriaColorWheel \n {...props}\n outerRadius={outerRadius}\n innerRadius={innerRadius}\n ref={containerRef}\n style={UNSAFE_style}\n className={UNSAFE_className + styles}>\n {({isDisabled, state}) => (<>\n <ColorWheelTrack\n style={({defaultStyle, isDisabled}) => ({\n background: isDisabled ? undefined : defaultStyle.background\n })}\n className={style({\n // Outer border\n borderRadius: 'full',\n outlineColor: {\n default: 'gray-1000/10',\n forcedColors: 'ButtonBorder'\n },\n outlineWidth: 1,\n outlineOffset: -1,\n outlineStyle: {\n default: 'solid',\n isDisabled: 'none'\n },\n backgroundColor: {\n isDisabled: 'disabled'\n }\n })} />\n <div\n className={style({\n // Inner border\n position: 'absolute',\n inset: 24,\n pointerEvents: 'none',\n borderRadius: 'full',\n outlineColor: {\n default: 'gray-1000/10',\n forcedColors: 'ButtonBorder'\n },\n outlineWidth: 1,\n outlineStyle: {\n default: 'solid',\n isDisabled: 'none'\n }\n })({isDisabled})} />\n <ColorHandle\n containerRef={containerRef}\n getPosition={() => {\n let {x, y} = state.getThumbPosition(outerRadius - thickness / 2);\n return {\n x: (outerRadius + x) / (outerRadius * 2),\n y: (outerRadius + y) / (outerRadius * 2)\n };\n }} />\n </>)}\n </AriaColorWheel>\n );\n});\n"],"names":[],"version":3,"file":"ColorWheel.mjs.map"}
|
package/dist/ComboBox.cjs
CHANGED
|
@@ -105,7 +105,7 @@ const $a2d5b35c01bebcd6$var$inputButton = function anonymous(props) {
|
|
|
105
105
|
}
|
|
106
106
|
return rules;
|
|
107
107
|
};
|
|
108
|
-
const $a2d5b35c01bebcd6$var$iconStyles = "
|
|
108
|
+
const $a2d5b35c01bebcd6$var$iconStyles = " _9-3t1x R-3hn0u -rwx0fg_e-b";
|
|
109
109
|
let $a2d5b35c01bebcd6$var$InternalComboboxContext = /*#__PURE__*/ (0, $1KUtr$react.createContext)({
|
|
110
110
|
size: 'M'
|
|
111
111
|
});
|
|
@@ -312,7 +312,7 @@ const $a2d5b35c01bebcd6$export$72b9695b8216309a = /*#__PURE__*/ (0, $1KUtr$react
|
|
|
312
312
|
// manually subtract border as we can't set Popover to border-box, it causes the contents to spill out
|
|
313
313
|
'--trigger-width': `calc(${triggerWidth} - 2px)`
|
|
314
314
|
},
|
|
315
|
-
styles: "
|
|
315
|
+
styles: " q-1utmx2y l-1utmx2y",
|
|
316
316
|
children: /*#__PURE__*/ (0, $1KUtr$reactjsxruntime.jsx)((0, $1KUtr$reactariacomponents.Provider), {
|
|
317
317
|
values: [
|
|
318
318
|
[
|
package/dist/ComboBox.css
CHANGED
|
@@ -317,8 +317,6 @@
|
|
|
317
317
|
}
|
|
318
318
|
}
|
|
319
319
|
|
|
320
|
-
@layer UNSAFE_overrides;
|
|
321
|
-
|
|
322
320
|
@layer _.b.a {
|
|
323
321
|
@media (forced-colors: active) {
|
|
324
322
|
._Pag {
|
|
@@ -382,8 +380,4 @@
|
|
|
382
380
|
}
|
|
383
381
|
}
|
|
384
382
|
}
|
|
385
|
-
|
|
386
|
-
.\.:not(#a#b) {
|
|
387
|
-
all: revert-layer;
|
|
388
|
-
}
|
|
389
383
|
/*# sourceMappingURL=ComboBox.css.map */
|
package/dist/ComboBox.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"ACiGoB;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;;;;EA2CD;;;;EAAA;;;;EAAA;;;;EAsFiB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBd;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkDA;;;;EAAA;;;;;AA3MF;EAiIgB;;;;;AAjIhB;;AAAA;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAiIgB;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAwBd;EAAA;IAAA;;;;;;AAkDA","sources":["13beeca66baffd35","packages/@react-spectrum/s2/src/ComboBox.tsx"],"sourcesContent":["@import \"434b6dc809c84a70\";\n@import \"9807be49da09aafb\";\n@import \"affe2b90434aec6a\";\n@import \"96ebc07fe89537d3\";\n@import \"85ea669da1afabc2\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ComboBox as AriaComboBox,\n ComboBoxProps as AriaComboBoxProps,\n ListBoxSection as AriaListBoxSection,\n PopoverProps as AriaPopoverProps,\n Button,\n ContextValue,\n InputContext,\n ListBox,\n ListBoxItem,\n ListBoxItemProps,\n ListBoxProps,\n Provider,\n SectionProps\n} from 'react-aria-components';\nimport {baseColor, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {\n checkmark,\n description,\n Divider,\n icon,\n iconCenterWrapper,\n label,\n menuitem,\n section,\n sectionHeader,\n sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {createContext, CSSProperties, forwardRef, ReactNode, Ref, useCallback, useContext, useImperativeHandle, useRef, useState} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {forwardRefType} from './types';\nimport {HeaderContext, HeadingContext, Text, TextContext} from './Content';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {IconContext} from './Icon';\nimport {menu} from './Picker';\nimport {mergeRefs, useResizeObserver} from '@react-aria/utils';\nimport {Placement} from 'react-aria';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface ComboboxStyleProps {\n /**\n * The size of the Combobox.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\nexport interface ComboBoxProps<T extends object> extends\n Omit<AriaComboBoxProps<T>, 'children' | 'style' | 'className' | 'defaultFilter' | 'allowsEmptyCollection'>,\n ComboboxStyleProps,\n StyleProps,\n SpectrumLabelableProps,\n HelpTextProps,\n Pick<ListBoxProps<T>, 'items'>,\n Pick<AriaPopoverProps, 'shouldFlip'> {\n /** The contents of the collection. */\n children: ReactNode | ((item: T) => ReactNode),\n /**\n * Direction the menu will render relative to the Picker.\n *\n * @default 'bottom'\n */\n direction?: 'bottom' | 'top',\n /**\n * Alignment of the menu relative to the input target.\n *\n * @default 'start'\n */\n align?: 'start' | 'end',\n /** Width of the menu. By default, matches width of the trigger. Note that the minimum width of the dropdown is always equal to the trigger's width. */\n menuWidth?: number\n}\n\nexport const ComboBoxContext = createContext<ContextValue<Partial<ComboBoxProps<any>>, TextFieldRef>>(null);\n\nconst inputButton = style({\n display: 'flex',\n outlineStyle: 'none',\n textAlign: 'center',\n borderStyle: 'none',\n borderRadius: 'control-sm',\n alignItems: 'center',\n justifyContent: 'center',\n size: {\n size: {\n S: 16,\n M: 20,\n L: 24,\n XL: 32\n }\n },\n marginStart: 'text-to-control',\n aspectRatio: 'square',\n flexShrink: 0,\n transition: {\n default: 'default',\n forcedColors: 'none'\n },\n backgroundColor: {\n default: baseColor('gray-100'),\n isOpen: 'gray-200',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isOpen: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n color: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonFace'\n }\n }\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: 90,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nlet InternalComboboxContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\n\n/**\n * ComboBox allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: Ref<TextFieldRef>) {\n [props, ref] = useSpectrumContextProps(props, ref, ComboBoxContext);\n let inputRef = useRef<HTMLInputElement>(null);\n let domRef = useRef<HTMLDivElement>(null);\n let buttonRef = useRef<HTMLButtonElement>(null);\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n direction = 'bottom',\n align = 'start',\n shouldFlip = true,\n menuWidth,\n label,\n description: descriptionMessage,\n errorMessage,\n children,\n items,\n size = 'M',\n labelPosition = 'top',\n labelAlign = 'start',\n necessityIndicator,\n UNSAFE_className = '',\n UNSAFE_style,\n ...pickerProps\n } = props;\n\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef.current;\n }\n }));\n\n // Better way to encode this into a style? need to account for flipping\n let menuOffset: number;\n if (size === 'S') {\n menuOffset = 6;\n } else if (size === 'M') {\n menuOffset = 6;\n } else if (size === 'L') {\n menuOffset = 7;\n } else {\n menuOffset = 8;\n }\n\n let triggerRef = useRef<HTMLDivElement>(null);\n // Make menu width match input + button\n let [triggerWidth, setTriggerWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (triggerRef.current) {\n let inputRect = triggerRef.current.getBoundingClientRect();\n let minX = inputRect.left;\n let maxX = inputRect.right;\n setTriggerWidth((maxX - minX) + 'px');\n }\n }, [triggerRef, setTriggerWidth]);\n\n useResizeObserver({\n ref: triggerRef,\n onResize: onResize\n });\n\n return (\n <AriaComboBox\n {...pickerProps}\n style={UNSAFE_style}\n className={UNSAFE_className + style(field(), getAllowedOverrides())({\n isInForm: !!formContext,\n labelPosition,\n size\n }, props.styles)}>\n {({isDisabled, isOpen, isRequired, isInvalid}) => (\n <>\n <InternalComboboxContext.Provider value={{size}}>\n <FieldLabel\n isDisabled={isDisabled}\n isRequired={isRequired}\n size={size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n necessityIndicator={necessityIndicator}\n contextualHelp={props.contextualHelp}>\n {label}\n </FieldLabel>\n <FieldGroup\n ref={triggerRef}\n role=\"presentation\"\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n size={size}\n styles={style({\n ...fieldInput(),\n paddingStart: 'edge-to-text',\n // better way to do this one? it's not actually half, they are\n // [9, 4], [12, 6], [15, 8], [18, 8]\n // also noticed that our measurement is including the border, making the padding too much\n paddingEnd: '[calc(self(height, self(minHeight)) * 3 / 16)]'\n })({size})}>\n <InputContext.Consumer>\n {ctx => (\n <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n <Input />\n </InputContext.Provider>\n )}\n </InputContext.Consumer>\n {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n <Button\n ref={buttonRef}\n // Prevent press scale from sticking while ComboBox is open.\n // @ts-ignore\n isPressed={false}\n style={renderProps => pressScale(buttonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n size,\n isOpen\n })}>\n <ChevronIcon\n size={size}\n className={iconStyles} />\n </Button>\n </FieldGroup>\n <HelpText\n size={size}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n description={descriptionMessage}>\n {errorMessage}\n </HelpText>\n <PopoverBase\n hideArrow\n triggerRef={triggerRef}\n offset={menuOffset}\n placement={`${direction} ${align}` as Placement}\n shouldFlip={shouldFlip}\n UNSAFE_style={{\n width: menuWidth ? `${menuWidth}px` : undefined,\n // manually subtract border as we can't set Popover to border-box, it causes the contents to spill out\n '--trigger-width': `calc(${triggerWidth} - 2px)`\n } as CSSProperties}\n styles={style({\n minWidth: '[var(--trigger-width)]',\n width: '[var(--trigger-width)]'\n })}>\n <Provider\n values={[\n [HeaderContext, {styles: sectionHeader({size})}],\n [HeadingContext, {styles: sectionHeading}],\n [TextContext, {\n slots: {\n 'description': {styles: description({size})}\n }\n }]\n ]}>\n <ListBox\n items={items}\n className={menu({size})}>\n {children}\n </ListBox>\n </Provider>\n </PopoverBase>\n </InternalComboboxContext.Provider>\n </>\n )}\n </AriaComboBox>\n );\n});\n\n\nexport interface ComboBoxItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n children: ReactNode\n}\n\nconst checkmarkIconSize = {\n S: 'XS',\n M: 'M',\n L: 'L',\n XL: 'XL'\n} as const;\n\nexport function ComboBoxItem(props: ComboBoxItemProps) {\n let ref = useRef(null);\n let isLink = props.href != null;\n let {size} = useContext(InternalComboboxContext);\n return (\n <ListBoxItem\n {...props}\n ref={ref}\n textValue={props.textValue || (typeof props.children === 'string' ? props.children as string : undefined)}\n style={pressScale(ref, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + menuitem({...renderProps, size, isLink}, props.styles)}>\n {(renderProps) => {\n let {children} = props;\n return (\n <>\n <Provider\n values={[\n [IconContext, {\n slots: {\n icon: {render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}), styles: icon}\n }\n }],\n [TextContext, {\n slots: {\n label: {styles: label({size})},\n description: {styles: description({...renderProps, size})}\n }\n }]\n ]}>\n {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n {typeof children === 'string' ? <Text slot=\"label\">{children}</Text> : children}\n </Provider>\n </>\n );\n }}\n </ListBoxItem>\n );\n}\n\nexport interface ComboBoxSectionProps<T extends object> extends SectionProps<T> {}\nexport function ComboBoxSection<T extends object>(props: ComboBoxSectionProps<T>) {\n let {size} = useContext(InternalComboboxContext);\n return (\n <>\n <AriaListBoxSection\n {...props}\n className={section({size})}>\n {props.children}\n </AriaListBoxSection>\n <Divider />\n </>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.css.map"}
|
|
1
|
+
{"mappings":"ACiGoB;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;;;;EA2CD;;;;EAAA;;;;EAAA;;;;EAsFiB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAwBd;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAkDA;;;;EAAA;;;;;AA3MF;EAiIgB;;;;;AAjIhB;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAiIgB;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAwBd;EAAA;IAAA","sources":["13beeca66baffd35","packages/@react-spectrum/s2/src/ComboBox.tsx"],"sourcesContent":["@import \"434b6dc809c84a70\";\n@import \"9807be49da09aafb\";\n@import \"affe2b90434aec6a\";\n@import \"96ebc07fe89537d3\";\n@import \"85ea669da1afabc2\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ComboBox as AriaComboBox,\n ComboBoxProps as AriaComboBoxProps,\n ListBoxSection as AriaListBoxSection,\n PopoverProps as AriaPopoverProps,\n Button,\n ContextValue,\n InputContext,\n ListBox,\n ListBoxItem,\n ListBoxItemProps,\n ListBoxProps,\n Provider,\n SectionProps\n} from 'react-aria-components';\nimport {baseColor, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {\n checkmark,\n description,\n Divider,\n icon,\n iconCenterWrapper,\n label,\n menuitem,\n section,\n sectionHeader,\n sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {createContext, CSSProperties, forwardRef, ReactNode, Ref, useCallback, useContext, useImperativeHandle, useRef, useState} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {forwardRefType} from './types';\nimport {HeaderContext, HeadingContext, Text, TextContext} from './Content';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {IconContext} from './Icon';\nimport {menu} from './Picker';\nimport {mergeRefs, useResizeObserver} from '@react-aria/utils';\nimport {Placement} from 'react-aria';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface ComboboxStyleProps {\n /**\n * The size of the Combobox.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\nexport interface ComboBoxProps<T extends object> extends\n Omit<AriaComboBoxProps<T>, 'children' | 'style' | 'className' | 'defaultFilter' | 'allowsEmptyCollection'>,\n ComboboxStyleProps,\n StyleProps,\n SpectrumLabelableProps,\n HelpTextProps,\n Pick<ListBoxProps<T>, 'items'>,\n Pick<AriaPopoverProps, 'shouldFlip'> {\n /** The contents of the collection. */\n children: ReactNode | ((item: T) => ReactNode),\n /**\n * Direction the menu will render relative to the Picker.\n *\n * @default 'bottom'\n */\n direction?: 'bottom' | 'top',\n /**\n * Alignment of the menu relative to the input target.\n *\n * @default 'start'\n */\n align?: 'start' | 'end',\n /** Width of the menu. By default, matches width of the trigger. Note that the minimum width of the dropdown is always equal to the trigger's width. */\n menuWidth?: number\n}\n\nexport const ComboBoxContext = createContext<ContextValue<Partial<ComboBoxProps<any>>, TextFieldRef>>(null);\n\nconst inputButton = style({\n display: 'flex',\n outlineStyle: 'none',\n textAlign: 'center',\n borderStyle: 'none',\n borderRadius: 'control-sm',\n alignItems: 'center',\n justifyContent: 'center',\n size: {\n size: {\n S: 16,\n M: 20,\n L: 24,\n XL: 32\n }\n },\n marginStart: 'text-to-control',\n aspectRatio: 'square',\n flexShrink: 0,\n transition: {\n default: 'default',\n forcedColors: 'none'\n },\n backgroundColor: {\n default: baseColor('gray-100'),\n isOpen: 'gray-200',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isOpen: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n color: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonFace'\n }\n }\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: 90,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nlet InternalComboboxContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\n\n/**\n * ComboBox allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: Ref<TextFieldRef>) {\n [props, ref] = useSpectrumContextProps(props, ref, ComboBoxContext);\n let inputRef = useRef<HTMLInputElement>(null);\n let domRef = useRef<HTMLDivElement>(null);\n let buttonRef = useRef<HTMLButtonElement>(null);\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n direction = 'bottom',\n align = 'start',\n shouldFlip = true,\n menuWidth,\n label,\n description: descriptionMessage,\n errorMessage,\n children,\n items,\n size = 'M',\n labelPosition = 'top',\n labelAlign = 'start',\n necessityIndicator,\n UNSAFE_className = '',\n UNSAFE_style,\n ...pickerProps\n } = props;\n\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef.current;\n }\n }));\n\n // Better way to encode this into a style? need to account for flipping\n let menuOffset: number;\n if (size === 'S') {\n menuOffset = 6;\n } else if (size === 'M') {\n menuOffset = 6;\n } else if (size === 'L') {\n menuOffset = 7;\n } else {\n menuOffset = 8;\n }\n\n let triggerRef = useRef<HTMLDivElement>(null);\n // Make menu width match input + button\n let [triggerWidth, setTriggerWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (triggerRef.current) {\n let inputRect = triggerRef.current.getBoundingClientRect();\n let minX = inputRect.left;\n let maxX = inputRect.right;\n setTriggerWidth((maxX - minX) + 'px');\n }\n }, [triggerRef, setTriggerWidth]);\n\n useResizeObserver({\n ref: triggerRef,\n onResize: onResize\n });\n\n return (\n <AriaComboBox\n {...pickerProps}\n style={UNSAFE_style}\n className={UNSAFE_className + style(field(), getAllowedOverrides())({\n isInForm: !!formContext,\n labelPosition,\n size\n }, props.styles)}>\n {({isDisabled, isOpen, isRequired, isInvalid}) => (\n <>\n <InternalComboboxContext.Provider value={{size}}>\n <FieldLabel\n isDisabled={isDisabled}\n isRequired={isRequired}\n size={size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n necessityIndicator={necessityIndicator}\n contextualHelp={props.contextualHelp}>\n {label}\n </FieldLabel>\n <FieldGroup\n ref={triggerRef}\n role=\"presentation\"\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n size={size}\n styles={style({\n ...fieldInput(),\n paddingStart: 'edge-to-text',\n // better way to do this one? it's not actually half, they are\n // [9, 4], [12, 6], [15, 8], [18, 8]\n // also noticed that our measurement is including the border, making the padding too much\n paddingEnd: '[calc(self(height, self(minHeight)) * 3 / 16)]'\n })({size})}>\n <InputContext.Consumer>\n {ctx => (\n <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n <Input />\n </InputContext.Provider>\n )}\n </InputContext.Consumer>\n {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n <Button\n ref={buttonRef}\n // Prevent press scale from sticking while ComboBox is open.\n // @ts-ignore\n isPressed={false}\n style={renderProps => pressScale(buttonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n size,\n isOpen\n })}>\n <ChevronIcon\n size={size}\n className={iconStyles} />\n </Button>\n </FieldGroup>\n <HelpText\n size={size}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n description={descriptionMessage}>\n {errorMessage}\n </HelpText>\n <PopoverBase\n hideArrow\n triggerRef={triggerRef}\n offset={menuOffset}\n placement={`${direction} ${align}` as Placement}\n shouldFlip={shouldFlip}\n UNSAFE_style={{\n width: menuWidth ? `${menuWidth}px` : undefined,\n // manually subtract border as we can't set Popover to border-box, it causes the contents to spill out\n '--trigger-width': `calc(${triggerWidth} - 2px)`\n } as CSSProperties}\n styles={style({\n minWidth: '[var(--trigger-width)]',\n width: '[var(--trigger-width)]'\n })}>\n <Provider\n values={[\n [HeaderContext, {styles: sectionHeader({size})}],\n [HeadingContext, {styles: sectionHeading}],\n [TextContext, {\n slots: {\n 'description': {styles: description({size})}\n }\n }]\n ]}>\n <ListBox\n items={items}\n className={menu({size})}>\n {children}\n </ListBox>\n </Provider>\n </PopoverBase>\n </InternalComboboxContext.Provider>\n </>\n )}\n </AriaComboBox>\n );\n});\n\n\nexport interface ComboBoxItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n children: ReactNode\n}\n\nconst checkmarkIconSize = {\n S: 'XS',\n M: 'M',\n L: 'L',\n XL: 'XL'\n} as const;\n\nexport function ComboBoxItem(props: ComboBoxItemProps) {\n let ref = useRef(null);\n let isLink = props.href != null;\n let {size} = useContext(InternalComboboxContext);\n return (\n <ListBoxItem\n {...props}\n ref={ref}\n textValue={props.textValue || (typeof props.children === 'string' ? props.children as string : undefined)}\n style={pressScale(ref, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + menuitem({...renderProps, size, isLink}, props.styles)}>\n {(renderProps) => {\n let {children} = props;\n return (\n <>\n <Provider\n values={[\n [IconContext, {\n slots: {\n icon: {render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}), styles: icon}\n }\n }],\n [TextContext, {\n slots: {\n label: {styles: label({size})},\n description: {styles: description({...renderProps, size})}\n }\n }]\n ]}>\n {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n {typeof children === 'string' ? <Text slot=\"label\">{children}</Text> : children}\n </Provider>\n </>\n );\n }}\n </ListBoxItem>\n );\n}\n\nexport interface ComboBoxSectionProps<T extends object> extends SectionProps<T> {}\nexport function ComboBoxSection<T extends object>(props: ComboBoxSectionProps<T>) {\n let {size} = useContext(InternalComboboxContext);\n return (\n <>\n <AriaListBoxSection\n {...props}\n className={section({size})}>\n {props.children}\n </AriaListBoxSection>\n <Divider />\n </>\n );\n}\n"],"names":[],"version":3,"file":"ComboBox.css.map"}
|
package/dist/ComboBox.mjs
CHANGED
|
@@ -96,7 +96,7 @@ const $a2f262fac286a920$var$inputButton = function anonymous(props) {
|
|
|
96
96
|
}
|
|
97
97
|
return rules;
|
|
98
98
|
};
|
|
99
|
-
const $a2f262fac286a920$var$iconStyles = "
|
|
99
|
+
const $a2f262fac286a920$var$iconStyles = " _9-3t1x R-3hn0u -rwx0fg_e-b";
|
|
100
100
|
let $a2f262fac286a920$var$InternalComboboxContext = /*#__PURE__*/ (0, $5rXoR$createContext)({
|
|
101
101
|
size: 'M'
|
|
102
102
|
});
|
|
@@ -303,7 +303,7 @@ const $a2f262fac286a920$export$72b9695b8216309a = /*#__PURE__*/ (0, $5rXoR$forwa
|
|
|
303
303
|
// manually subtract border as we can't set Popover to border-box, it causes the contents to spill out
|
|
304
304
|
'--trigger-width': `calc(${triggerWidth} - 2px)`
|
|
305
305
|
},
|
|
306
|
-
styles: "
|
|
306
|
+
styles: " q-1utmx2y l-1utmx2y",
|
|
307
307
|
children: /*#__PURE__*/ (0, $5rXoR$jsx)((0, $5rXoR$Provider), {
|
|
308
308
|
values: [
|
|
309
309
|
[
|
package/dist/Content.cjs
CHANGED
|
@@ -3,6 +3,7 @@ var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
|
|
|
3
3
|
var $bwC5I$reactjsxruntime = require("react/jsx-runtime");
|
|
4
4
|
var $bwC5I$reactariacomponents = require("react-aria-components");
|
|
5
5
|
var $bwC5I$react = require("react");
|
|
6
|
+
var $bwC5I$reactariautils = require("@react-aria/utils");
|
|
6
7
|
var $bwC5I$reactspectrumutils = require("@react-spectrum/utils");
|
|
7
8
|
|
|
8
9
|
|
|
@@ -38,6 +39,7 @@ $parcel$export(module.exports, "Footer", () => $6367bc87eb7d24ad$export$a06f1c67
|
|
|
38
39
|
|
|
39
40
|
|
|
40
41
|
|
|
42
|
+
|
|
41
43
|
const $6367bc87eb7d24ad$export$d688439359537581 = /*#__PURE__*/ (0, $bwC5I$react.createContext)(null);
|
|
42
44
|
const $6367bc87eb7d24ad$export$a8a3e93435678ff9 = /*#__PURE__*/ (0, $bwC5I$react.forwardRef)(function Heading(props, ref) {
|
|
43
45
|
[props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $6367bc87eb7d24ad$export$d688439359537581);
|
|
@@ -93,7 +95,7 @@ const $6367bc87eb7d24ad$export$5f1af8db9871e1d6 = /*#__PURE__*/ (0, $bwC5I$react
|
|
|
93
95
|
...otherProps,
|
|
94
96
|
ref: domRef,
|
|
95
97
|
// @ts-ignore - compatibility with React < 19
|
|
96
|
-
inert: isSkeleton
|
|
98
|
+
inert: (0, $bwC5I$reactariautils.inertValue)(isSkeleton),
|
|
97
99
|
className: UNSAFE_className + styles,
|
|
98
100
|
style: UNSAFE_style,
|
|
99
101
|
slot: slot || undefined,
|
package/dist/Content.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Content.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, Keyboard as KeyboardAria, Header as RACHeader, Heading as RACHeading, TextContext as RACTextContext, SlotProps, Text as TextAria} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {inertValue} from '@react-aria/utils';\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton, useSkeletonText} from './Skeleton';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ContentProps extends UnsafeStyles, SlotProps {\n children: ReactNode,\n styles?: StyleString,\n isHidden?: boolean,\n id?: string\n}\n\ninterface HeadingProps extends ContentProps {\n level?: number\n}\n\nexport const HeadingContext = createContext<ContextValue<Partial<HeadingProps>, DOMRefValue<HTMLHeadingElement>>>(null);\n\nexport const Heading = forwardRef(// Wrapper around RAC Heading to unmount when hidden.\nfunction Heading(props: HeadingProps, ref: DOMRef<HTMLHeadingElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, HeadingContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeading\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const HeaderContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue<HTMLElement>>>(null);\n\nexport const Header = forwardRef(function Header(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, HeaderContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeader\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const ContentContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const Content = forwardRef(function Content(props: ContentProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ContentContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <div\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const TextContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue>>(null);\n\nexport const Text = forwardRef(function Text(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, TextContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, children, ...otherProps} = props;\n let racContext = useContext(RACTextContext);\n let isSkeleton = useIsSkeleton();\n [children, UNSAFE_style] = useSkeletonText(children, UNSAFE_style);\n if (isHidden) {\n return null;\n }\n\n let text = (\n <TextAria\n {...otherProps}\n ref={domRef}\n // @ts-ignore - compatibility with React < 19\n inert={inertValue(isSkeleton)}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined}\n data-rsp-slot=\"text\">\n {children}\n </TextAria>\n );\n\n if (slot && racContext && 'slots' in racContext && !racContext.slots?.[slot]) {\n return <RACTextContext.Provider value={null}>{text}</RACTextContext.Provider>;\n }\n\n return text;\n});\n\nexport const KeyboardContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue>>({});\n\nexport const Keyboard = forwardRef(function Keyboard(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, KeyboardContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <KeyboardAria\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const FooterContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue>>({});\n\nexport const Footer = forwardRef(function Footer(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, FooterContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <footer\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"Content.cjs.map"}
|
package/dist/Content.mjs
CHANGED
|
@@ -3,6 +3,7 @@ import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} fr
|
|
|
3
3
|
import {jsx as $7TVeb$jsx} from "react/jsx-runtime";
|
|
4
4
|
import {Heading as $7TVeb$Heading, Header as $7TVeb$Header, TextContext as $7TVeb$TextContext, Text as $7TVeb$Text, Keyboard as $7TVeb$Keyboard} from "react-aria-components";
|
|
5
5
|
import {createContext as $7TVeb$createContext, forwardRef as $7TVeb$forwardRef, useContext as $7TVeb$useContext} from "react";
|
|
6
|
+
import {inertValue as $7TVeb$inertValue} from "@react-aria/utils";
|
|
6
7
|
import {useDOMRef as $7TVeb$useDOMRef} from "@react-spectrum/utils";
|
|
7
8
|
|
|
8
9
|
/*
|
|
@@ -21,6 +22,7 @@ import {useDOMRef as $7TVeb$useDOMRef} from "@react-spectrum/utils";
|
|
|
21
22
|
|
|
22
23
|
|
|
23
24
|
|
|
25
|
+
|
|
24
26
|
const $8e847109a6ab556d$export$d688439359537581 = /*#__PURE__*/ (0, $7TVeb$createContext)(null);
|
|
25
27
|
const $8e847109a6ab556d$export$a8a3e93435678ff9 = /*#__PURE__*/ (0, $7TVeb$forwardRef)(function Heading(props, ref) {
|
|
26
28
|
[props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $8e847109a6ab556d$export$d688439359537581);
|
|
@@ -76,7 +78,7 @@ const $8e847109a6ab556d$export$5f1af8db9871e1d6 = /*#__PURE__*/ (0, $7TVeb$forwa
|
|
|
76
78
|
...otherProps,
|
|
77
79
|
ref: domRef,
|
|
78
80
|
// @ts-ignore - compatibility with React < 19
|
|
79
|
-
inert: isSkeleton
|
|
81
|
+
inert: (0, $7TVeb$inertValue)(isSkeleton),
|
|
80
82
|
className: UNSAFE_className + styles,
|
|
81
83
|
style: UNSAFE_style,
|
|
82
84
|
slot: slot || undefined,
|
package/dist/Content.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Content.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, Keyboard as KeyboardAria, Header as RACHeader, Heading as RACHeading, TextContext as RACTextContext, SlotProps, Text as TextAria} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {inertValue} from '@react-aria/utils';\nimport {StyleString} from '../style/types';\nimport {UnsafeStyles} from './style-utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useIsSkeleton, useSkeletonText} from './Skeleton';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\ninterface ContentProps extends UnsafeStyles, SlotProps {\n children: ReactNode,\n styles?: StyleString,\n isHidden?: boolean,\n id?: string\n}\n\ninterface HeadingProps extends ContentProps {\n level?: number\n}\n\nexport const HeadingContext = createContext<ContextValue<Partial<HeadingProps>, DOMRefValue<HTMLHeadingElement>>>(null);\n\nexport const Heading = forwardRef(// Wrapper around RAC Heading to unmount when hidden.\nfunction Heading(props: HeadingProps, ref: DOMRef<HTMLHeadingElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, HeadingContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeading\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const HeaderContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue<HTMLElement>>>(null);\n\nexport const Header = forwardRef(function Header(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, HeaderContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n\n return (\n <RACHeader\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const ContentContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const Content = forwardRef(function Content(props: ContentProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ContentContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <div\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const TextContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue>>(null);\n\nexport const Text = forwardRef(function Text(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, TextContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, children, ...otherProps} = props;\n let racContext = useContext(RACTextContext);\n let isSkeleton = useIsSkeleton();\n [children, UNSAFE_style] = useSkeletonText(children, UNSAFE_style);\n if (isHidden) {\n return null;\n }\n\n let text = (\n <TextAria\n {...otherProps}\n ref={domRef}\n // @ts-ignore - compatibility with React < 19\n inert={inertValue(isSkeleton)}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined}\n data-rsp-slot=\"text\">\n {children}\n </TextAria>\n );\n\n if (slot && racContext && 'slots' in racContext && !racContext.slots?.[slot]) {\n return <RACTextContext.Provider value={null}>{text}</RACTextContext.Provider>;\n }\n\n return text;\n});\n\nexport const KeyboardContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue>>({});\n\nexport const Keyboard = forwardRef(function Keyboard(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, KeyboardContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <KeyboardAria\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n\nexport const FooterContext = createContext<ContextValue<Partial<ContentProps>, DOMRefValue>>({});\n\nexport const Footer = forwardRef(function Footer(props: ContentProps, ref: DOMRef) {\n [props, ref] = useSpectrumContextProps(props, ref, FooterContext);\n let domRef = useDOMRef(ref);\n let {UNSAFE_className = '', UNSAFE_style, styles, isHidden, slot, ...otherProps} = props;\n if (isHidden) {\n return null;\n }\n return (\n <footer\n {...otherProps}\n ref={domRef}\n className={UNSAFE_className + styles}\n style={UNSAFE_style}\n slot={slot || undefined} />\n );\n});\n"],"names":[],"version":3,"file":"Content.mjs.map"}
|
package/dist/ContextualHelp.cjs
CHANGED
|
@@ -41,7 +41,7 @@ $parcel$export(module.exports, "ContextualHelp", () => $bab829476f85a155$export$
|
|
|
41
41
|
|
|
42
42
|
|
|
43
43
|
|
|
44
|
-
const $bab829476f85a155$var$popover = "
|
|
44
|
+
const $bab829476f85a155$var$popover = " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh q___U l___U Eh Fh Ch Dh";
|
|
45
45
|
const $bab829476f85a155$export$41b9afaaba473494 = /*#__PURE__*/ (0, $44GE8$react.createContext)(null);
|
|
46
46
|
const $bab829476f85a155$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $44GE8$react.forwardRef)(function ContextualHelp(props, ref) {
|
|
47
47
|
let stringFormatter = (0, $44GE8$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
|
|
@@ -82,7 +82,7 @@ const $bab829476f85a155$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $44GE8$react
|
|
|
82
82
|
hideArrow: true,
|
|
83
83
|
UNSAFE_className: $bab829476f85a155$var$popover,
|
|
84
84
|
children: /*#__PURE__*/ (0, $44GE8$reactjsxruntime.jsx)((0, $44GE8$reactariacomponents.Dialog), {
|
|
85
|
-
className: (0, $308b180f49d82d28$exports.mergeStyles)((0, $0f4636c7093b9233$exports.dialogInner), "
|
|
85
|
+
className: (0, $308b180f49d82d28$exports.mergeStyles)((0, $0f4636c7093b9233$exports.dialogInner), " _wa _xa _ya _za AP BP yP zP Eh Fh Ch Dh"),
|
|
86
86
|
children: /*#__PURE__*/ (0, $44GE8$reactjsxruntime.jsx)((0, $44GE8$reactariacomponents.Provider), {
|
|
87
87
|
values: [
|
|
88
88
|
[
|
|
@@ -96,19 +96,19 @@ const $bab829476f85a155$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $44GE8$react
|
|
|
96
96
|
[
|
|
97
97
|
(0, $6367bc87eb7d24ad$exports.HeadingContext),
|
|
98
98
|
{
|
|
99
|
-
styles: "
|
|
99
|
+
styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ei _ebj _fe _f-1x99dloe _ga _g-1x99dlob ao Aa B-y6pz8c ya za"
|
|
100
100
|
}
|
|
101
101
|
],
|
|
102
102
|
[
|
|
103
103
|
(0, $6367bc87eb7d24ad$exports.ContentContext),
|
|
104
104
|
{
|
|
105
|
-
styles: "
|
|
105
|
+
styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ee _ebf _fb _gb _g-1x99dloc an"
|
|
106
106
|
}
|
|
107
107
|
],
|
|
108
108
|
[
|
|
109
109
|
(0, $6367bc87eb7d24ad$exports.FooterContext),
|
|
110
110
|
{
|
|
111
|
-
styles: "
|
|
111
|
+
styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ee _ebf _fb _gb _g-1x99dloc an Af"
|
|
112
112
|
}
|
|
113
113
|
]
|
|
114
114
|
],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCA,MAAM;AAOC,MAAM,0DAAwB,CAAA,GAAA,0BAAY,
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCA,MAAM;AAOC,MAAM,0DAAwB,CAAA,GAAA,0BAAY,EAAoF;AAK9H,MAAM,0DAAiB,CAAA,GAAA,uBAAS,EAAE,SAAS,eAAe,KAA0B,EAAE,GAAoC;IAC/H,IAAI,kBAAkB,CAAA,GAAA,gDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,YACF,QAAQ,eACR,WAAW,QACX,6EAA6E;IAC7E,OAAO,mBACP,WAAW,UACX,MAAM,UACN,SAAS,iBACT,YAAY,aACZ,YAAY,4BACZ,UAAU,oBACV,gBAAgB,gBAChB,YAAY,UACZ,MAAM,WACN,UAAU,QACX,GAAG;IAEJ,4EAA4E;IAC5E,2EAA2E;IAC3E,8BAA8B;IAC9B,IAAI,aAAa,CAAA,GAAA,+BAAQ,EAAE;IAC3B,IAAI,QAAQ,gBAAgB,MAAM,CAAC,CAAC,eAAe,EAAE,SAAS;IAC9D,UAAU,CAAC,aAAa,GAAG,UAAU,CAAC,aAAa,GAAG,UAAU,CAAC,aAAa,GAAG,MAAM,QAAQ;IAE/F,IAAI,cAAc,CAAA,GAAA,oCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IAExD,qBACE,iCAAC,CAAA,GAAA,uCAAY;QACX,QAAQ;QACR,aAAa;QACb,cAAc;;0BACd,gCAAC,CAAA,GAAA,sCAAW;gBACV,MAAM;gBACN,KAAK;gBACL,MAAM;gBACL,GAAG,CAAA,GAAA,gCAAS,EAAE,aAAa,WAAW;gBACvC,cAAc;gBACd,kBAAkB;gBAClB,QAAQ;gBACR,OAAO;0BACN,YAAY,uBAAS,gCAAC,CAAA,GAAA,iCAAO,uBAAO,gCAAC,CAAA,GAAA,iCAAO;;0BAE/C,gCAAC,CAAA,GAAA,qCAAU;gBACT,WAAW;gBACX,YAAY;gBACZ,qDAAqD;gBACrD,QAAQ;gBACR,aAAa;gBACb,SAAS;gBACT,kBAAkB;0BAClB,cAAA,gCAAC,CAAA,GAAA,iCAAQ;oBAAE,WAAW,CAAA,GAAA,qCAAU,EAAE,CAAA,GAAA,qCAAU;8BAC1C,cAAA,gCAAC,CAAA,GAAA,mCAAO;wBACN,QAAQ;4BACN;gCAAC,CAAA,GAAA,sCAAU;gCAAG;oCACZ,OAAO;wCACL,CAAC,CAAA,GAAA,uCAAW,EAAE,EAAE,CAAC;oCACnB;gCACF;6BAAE;4BACF;gCAAC,CAAA,GAAA,wCAAa;gCAAG;oCAAC,MAAM;gCAItB;6BAAE;4BACJ;gCAAC,CAAA,GAAA,wCAAa;gCAAG;oCAAC,MAAM;gCAEtB;6BAAE;4BACJ;gCAAC,CAAA,GAAA,uCAAY;gCAAG;oCAAC,MAAM;gCAGrB;6BAAE;yBACL;kCACA;;;;;;AAMb","sources":["packages/@react-spectrum/s2/src/ContextualHelp.tsx"],"sourcesContent":["import {ActionButton} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {ContentContext, FooterContext, HeadingContext} from './Content';\nimport {ContextValue, DEFAULT_SLOT, Provider, Dialog as RACDialog, TextContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {dialogInner} from './Dialog';\nimport {DialogTrigger, DialogTriggerProps} from './DialogTrigger';\nimport {filterDOMProps, mergeProps, useLabels} from '@react-aria/utils';\nimport HelpIcon from '../s2wf-icons/S2_Icon_HelpCircle_20_N.svg';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {PopoverBase, PopoverDialogProps} from './Popover';\nimport {space, style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils' with { type: 'macro' };\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ContextualHelpStyleProps {\n /**\n * Indicates whether contents are informative or provides helpful guidance.\n *\n * @default 'help'\n */\n variant?: 'info' | 'help'\n}\nexport interface ContextualHelpProps extends\n Pick<DialogTriggerProps, 'isOpen' | 'defaultOpen' | 'onOpenChange'>,\n Pick<PopoverDialogProps, 'shouldFlip' | 'offset' | 'crossOffset' | 'placement' | 'containerPadding'>,\n ContextualHelpStyleProps, StyleProps, DOMProps, AriaLabelingProps {\n /** Contents of the Contextual Help popover. */\n children: ReactNode,\n /**\n * The size of the ActionButton.\n *\n * @default 'XS'\n */\n size?: 'XS' | 'S'\n}\n\nconst popover = style({\n fontFamily: 'sans',\n minWidth: 218,\n width: 218,\n padding: 24\n});\n\nexport const ContextualHelpContext = createContext<ContextValue<Partial<ContextualHelpProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * Contextual help shows a user extra information about the state of an adjacent component, or a total view.\n */\nexport const ContextualHelp = forwardRef(function ContextualHelp(props: ContextualHelpProps, ref: FocusableRef<HTMLButtonElement>) {\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n [props, ref] = useSpectrumContextProps(props, ref, ContextualHelpContext);\n let {\n children,\n defaultOpen,\n // containerPadding = 24, // See popover() above. Issue noted in Popover.tsx.\n size = 'XS',\n crossOffset,\n isOpen,\n offset = 8,\n onOpenChange,\n placement = 'bottom start',\n shouldFlip,\n UNSAFE_className,\n UNSAFE_style,\n styles,\n variant = 'help'\n } = props;\n\n // In a FieldLabel we're getting the context's aria-labeledby, so we need to\n // manually set the aria-label after useLabels() to keep the order of label\n // then ContextualHelp variant\n let labelProps = useLabels(props);\n let label = stringFormatter.format(`contextualhelp.${variant}`);\n labelProps['aria-label'] = labelProps['aria-label'] ? labelProps['aria-label'] + ' ' + label : label;\n\n let buttonProps = filterDOMProps(props, {labelable: true});\n\n return (\n <DialogTrigger\n isOpen={isOpen}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}>\n <ActionButton\n slot={null}\n ref={ref}\n size={size}\n {...mergeProps(buttonProps, labelProps)}\n UNSAFE_style={UNSAFE_style}\n UNSAFE_className={UNSAFE_className}\n styles={styles}\n isQuiet>\n {variant === 'info' ? <InfoIcon /> : <HelpIcon />}\n </ActionButton>\n <PopoverBase\n placement={placement}\n shouldFlip={shouldFlip}\n // not working => containerPadding={containerPadding}\n offset={offset}\n crossOffset={crossOffset}\n hideArrow\n UNSAFE_className={popover}>\n <RACDialog className={mergeStyles(dialogInner, style({borderRadius: 'none', margin: -24, padding: 24}))}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n [DEFAULT_SLOT]: {}\n }\n }],\n [HeadingContext, {styles: style({\n font: 'heading-xs',\n margin: 0,\n marginBottom: space(8) // This only makes it 10px on mobile and should be 12px\n })}],\n [ContentContext, {styles: style({\n font: 'body-sm'\n })}],\n [FooterContext, {styles: style({\n font: 'body-sm',\n marginTop: 16\n })}]\n ]}>\n {children}\n </Provider>\n </RACDialog>\n </PopoverBase>\n </DialogTrigger>\n );\n});\n"],"names":[],"version":3,"file":"ContextualHelp.cjs.map"}
|
package/dist/ContextualHelp.css
CHANGED
|
@@ -172,8 +172,6 @@
|
|
|
172
172
|
}
|
|
173
173
|
}
|
|
174
174
|
|
|
175
|
-
@layer UNSAFE_overrides;
|
|
176
|
-
|
|
177
175
|
@layer _.b.b {
|
|
178
176
|
@media not ((hover: hover) and (pointer: fine)) {
|
|
179
177
|
._ebj {
|
|
@@ -185,8 +183,4 @@
|
|
|
185
183
|
}
|
|
186
184
|
}
|
|
187
185
|
}
|
|
188
|
-
|
|
189
|
-
.\.:not(#a#b) {
|
|
190
|
-
all: revert-layer;
|
|
191
|
-
}
|
|
192
186
|
/*# sourceMappingURL=ContextualHelp.css.map */
|