@react-spectrum/s2 3.0.0-nightly-4b8b33a02-250211 → 3.0.0-nightly-260eb700f-250213
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 +3 -3
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css +2 -2
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +3 -3
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionBar.cjs +47 -47
- package/dist/ActionBar.css +51 -51
- package/dist/ActionBar.mjs +47 -47
- package/dist/ActionButton.cjs +97 -97
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +96 -96
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +97 -97
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.cjs +11 -11
- package/dist/ActionButtonGroup.css +9 -9
- package/dist/ActionButtonGroup.mjs +11 -11
- package/dist/ActionMenu.cjs.map +1 -1
- package/dist/ActionMenu.mjs.map +1 -1
- package/dist/AlertDialog.cjs +3 -3
- package/dist/AlertDialog.css +3 -3
- package/dist/AlertDialog.mjs +3 -3
- package/dist/Avatar.cjs +17 -17
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css +14 -14
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +17 -17
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +100 -100
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +34 -34
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +100 -100
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +68 -92
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +92 -164
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +68 -92
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +115 -115
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +89 -89
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +115 -115
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +152 -236
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +165 -309
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +152 -236
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +19 -19
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css +15 -15
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +19 -19
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +261 -264
- package/dist/Card.cjs.map +1 -1
- package/dist/Card.css +198 -210
- package/dist/Card.css.map +1 -1
- package/dist/Card.mjs +261 -264
- package/dist/Card.mjs.map +1 -1
- package/dist/CardView.cjs +15 -15
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +18 -18
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +15 -15
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +2 -2
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +73 -124
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +81 -201
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +73 -124
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +49 -49
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css +41 -41
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs +49 -49
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.cjs +15 -15
- package/dist/ClearButton.css +17 -17
- package/dist/ClearButton.mjs +15 -15
- package/dist/CloseButton.cjs +35 -35
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +33 -33
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs +35 -35
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +22 -22
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css +15 -15
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs +22 -22
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs +38 -38
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css +32 -32
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs +38 -38
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorHandle.cjs +21 -27
- package/dist/ColorHandle.cjs.map +1 -1
- package/dist/ColorHandle.css +45 -93
- package/dist/ColorHandle.css.map +1 -1
- package/dist/ColorHandle.mjs +21 -27
- package/dist/ColorHandle.mjs.map +1 -1
- package/dist/ColorSlider.cjs +52 -52
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +51 -51
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +52 -52
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +24 -27
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +29 -41
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +24 -27
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +23 -23
- package/dist/ColorSwatchPicker.css +48 -60
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +23 -23
- package/dist/ColorWheel.cjs +22 -22
- package/dist/ColorWheel.cjs.map +1 -1
- package/dist/ColorWheel.css +16 -16
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs +22 -22
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +80 -80
- package/dist/ComboBox.css +88 -88
- package/dist/ComboBox.mjs +80 -80
- package/dist/Content.cjs.map +1 -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 +38 -38
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +5 -5
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/CustomDialog.cjs +31 -31
- package/dist/CustomDialog.css +25 -25
- package/dist/CustomDialog.mjs +31 -31
- package/dist/Dialog.cjs +17 -17
- package/dist/Dialog.css +64 -64
- package/dist/Dialog.mjs +17 -17
- package/dist/Disclosure.cjs +108 -111
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +112 -124
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +108 -111
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs +26 -26
- package/dist/Divider.cjs.map +1 -1
- package/dist/Divider.css +16 -16
- package/dist/Divider.css.map +1 -1
- package/dist/Divider.mjs +26 -26
- package/dist/Divider.mjs.map +1 -1
- package/dist/DropZone.cjs +47 -56
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +56 -80
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +47 -56
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +150 -204
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +150 -246
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +150 -204
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +10 -10
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +9 -9
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs +10 -10
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +5 -5
- package/dist/FullscreenDialog.css +72 -72
- package/dist/FullscreenDialog.mjs +5 -5
- package/dist/IllustratedMessage.cjs +134 -134
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +69 -69
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +134 -134
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +12 -12
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css +13 -13
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +12 -12
- package/dist/Image.mjs.map +1 -1
- package/dist/InlineAlert.cjs +77 -104
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css +77 -149
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +77 -104
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Link.cjs +31 -31
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css +30 -30
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +31 -31
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +269 -268
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +158 -154
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +269 -268
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +85 -85
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +81 -81
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +85 -85
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +48 -48
- package/dist/Modal.css +46 -46
- package/dist/Modal.mjs +48 -48
- package/dist/NumberField.cjs +115 -115
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css +114 -114
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +115 -115
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +177 -194
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +167 -223
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +177 -194
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +79 -85
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +65 -89
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +79 -85
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs +98 -98
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +92 -92
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +98 -98
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +17 -17
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css +15 -15
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +17 -17
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Provider.cjs +4 -4
- package/dist/Provider.css +5 -5
- package/dist/Provider.mjs +4 -4
- package/dist/Radio.cjs +80 -152
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +96 -240
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +80 -152
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +47 -47
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css +41 -41
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs +47 -47
- 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 +42 -42
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +47 -47
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +42 -42
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +89 -101
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +92 -140
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +89 -101
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +196 -229
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +149 -221
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +196 -229
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +56 -56
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +59 -59
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +56 -56
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +74 -107
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +69 -141
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +74 -107
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +253 -280
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +163 -199
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +253 -280
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +112 -124
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +84 -108
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +112 -124
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TabsPicker.cjs +105 -105
- package/dist/TabsPicker.css +111 -111
- package/dist/TabsPicker.mjs +105 -105
- package/dist/TagGroup.cjs +148 -148
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +134 -134
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +148 -148
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +59 -59
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +62 -62
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +59 -59
- package/dist/TextField.mjs.map +1 -1
- package/dist/ToggleButton.cjs +3 -3
- package/dist/ToggleButton.cjs.map +1 -1
- package/dist/ToggleButton.css +12 -12
- 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 +57 -60
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +71 -83
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +57 -60
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/TreeView.cjs +217 -244
- package/dist/TreeView.cjs.map +1 -1
- package/dist/TreeView.css +166 -190
- package/dist/TreeView.css.map +1 -1
- package/dist/TreeView.mjs +220 -244
- package/dist/TreeView.mjs.map +1 -1
- package/dist/main.cjs +1 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +2 -2
- package/dist/module.mjs.map +1 -1
- package/dist/types.d.ts +77 -72
- package/dist/types.d.ts.map +1 -1
- package/icons/Icon.cjs.map +1 -1
- package/icons/Icon.mjs.map +1 -1
- package/icons/Skeleton.cjs +2 -2
- package/icons/Skeleton.cjs.map +1 -1
- package/icons/Skeleton.css +5 -5
- package/icons/Skeleton.css.map +1 -1
- package/icons/Skeleton.mjs +2 -2
- package/icons/Skeleton.mjs.map +1 -1
- package/package.json +21 -21
- 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/Breadcrumbs.tsx +4 -4
- package/src/Button.tsx +4 -4
- package/src/ButtonGroup.tsx +1 -1
- package/src/CardView.tsx +1 -1
- 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 +1 -1
- package/src/ColorWheel.tsx +1 -1
- package/src/Content.tsx +7 -7
- 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 +1 -1
- package/src/Link.tsx +2 -2
- package/src/Menu.tsx +4 -3
- package/src/Meter.tsx +1 -1
- package/src/NumberField.tsx +1 -1
- package/src/Picker.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 +2 -2
- package/src/Skeleton.tsx +1 -1
- package/src/Slider.tsx +1 -1
- package/src/StatusLight.tsx +2 -2
- package/src/Switch.tsx +1 -1
- package/src/TableView.tsx +1 -1
- package/src/Tabs.tsx +16 -16
- package/src/TagGroup.tsx +2 -2
- package/src/TextField.tsx +2 -2
- package/src/ToggleButton.tsx +2 -2
- package/src/ToggleButtonGroup.tsx +1 -1
- package/src/Tooltip.tsx +3 -3
- package/src/TreeView.tsx +97 -144
- package/src/index.ts +1 -1
- package/style/__tests__/style-macro.test.js +18 -18
- package/style/dist/spectrum-theme.cjs +10 -20
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs +10 -20
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/types.d.ts +0 -4
- package/style/dist/types.d.ts.map +1 -1
- package/style/spectrum-theme.ts +11 -19
package/dist/ActionButton.cjs
CHANGED
|
@@ -48,71 +48,71 @@ $parcel$export(module.exports, "ActionButton", () => $6e265ff388155b91$export$cf
|
|
|
48
48
|
const $6e265ff388155b91$var$iconOnly = ':has([slot=icon], [slot=avatar]):not(:has([data-rsp-slot=text]))';
|
|
49
49
|
const $6e265ff388155b91$export$446543cff2a0f496 = function anonymous(props, overrides) {
|
|
50
50
|
let rules = " .";
|
|
51
|
-
let matches = (overrides || '').match(/(?:^|\s)(?:
|
|
51
|
+
let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r)[^\s]+/g) || [];
|
|
52
52
|
rules += matches.join('');
|
|
53
|
-
let $
|
|
54
|
-
let $
|
|
55
|
-
let $
|
|
56
|
-
let $
|
|
57
|
-
let $
|
|
53
|
+
let $_9 = false;
|
|
54
|
+
let $__a = false;
|
|
55
|
+
let $h = false;
|
|
56
|
+
let $q = false;
|
|
57
|
+
let $__R = false;
|
|
58
58
|
for (let p of matches){
|
|
59
|
-
if (/^\s*
|
|
60
|
-
if (/^\s*
|
|
61
|
-
if (/^\s*
|
|
62
|
-
if (/^\s*
|
|
63
|
-
if (/^\s*
|
|
59
|
+
if (/^\s*_9/.test(p)) $_9 = true;
|
|
60
|
+
if (/^\s*__a/.test(p)) $__a = true;
|
|
61
|
+
if (/^\s*h/.test(p)) $h = true;
|
|
62
|
+
if (/^\s*q/.test(p)) $q = true;
|
|
63
|
+
if (/^\s*__R/.test(p)) $__R = true;
|
|
64
64
|
}
|
|
65
|
-
if (props.isFocusVisible) rules += '
|
|
66
|
-
else rules += '
|
|
67
|
-
rules += '
|
|
68
|
-
if (props.isStaticColor) rules += '
|
|
69
|
-
else rules += '
|
|
70
|
-
rules += '
|
|
71
|
-
rules += '
|
|
65
|
+
if (props.isFocusVisible) rules += ' _Mb';
|
|
66
|
+
else rules += ' _Ma';
|
|
67
|
+
rules += ' da_____M';
|
|
68
|
+
if (props.isStaticColor) rules += ' d_____G';
|
|
69
|
+
else rules += ' dx';
|
|
70
|
+
rules += ' _Oc';
|
|
71
|
+
rules += ' _N-3t1z';
|
|
72
72
|
if (props.staticColor === "white") rules += ' -_1de2x0q_b-b';
|
|
73
73
|
else if (props.staticColor === "black") rules += ' -_1de2x0q_b-c';
|
|
74
|
+
rules += ' _0d';
|
|
75
|
+
rules += ' _2c';
|
|
74
76
|
rules += ' _3d';
|
|
75
|
-
rules += '
|
|
76
|
-
rules += '
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
if (props.isInGroup) rules += ' __c-3t1x';
|
|
81
|
-
else rules += ' __c-3t1y';
|
|
77
|
+
rules += ' jbH';
|
|
78
|
+
rules += ' jG';
|
|
79
|
+
if (!$_9) {
|
|
80
|
+
if (props.isInGroup) rules += ' _9-3t1x';
|
|
81
|
+
else rules += ' _9-3t1y';
|
|
82
82
|
}
|
|
83
|
-
if (!$
|
|
84
|
-
if (props.isJustified) rules += '
|
|
83
|
+
if (!$__a) {
|
|
84
|
+
if (props.isJustified) rules += ' __a-3t1y';
|
|
85
85
|
}
|
|
86
|
-
if (!$
|
|
87
|
-
if (props.isJustified) rules += '
|
|
86
|
+
if (!$h) {
|
|
87
|
+
if (props.isJustified) rules += ' ha';
|
|
88
88
|
}
|
|
89
|
-
rules += '
|
|
90
|
-
rules += '
|
|
91
|
-
rules += '
|
|
92
|
-
rules += '
|
|
93
|
-
rules += '
|
|
94
|
-
rules += '
|
|
95
|
-
rules += '
|
|
96
|
-
rules += '
|
|
89
|
+
rules += ' _d-bc1l9oh';
|
|
90
|
+
rules += ' _d-1uotwbwg';
|
|
91
|
+
rules += ' _d-eo0c6sf';
|
|
92
|
+
rules += ' _d-enzzrge';
|
|
93
|
+
rules += ' _d-enzykdd';
|
|
94
|
+
rules += ' _d-enzwzjc';
|
|
95
|
+
rules += ' _d-enzrfpb';
|
|
96
|
+
rules += ' _da';
|
|
97
97
|
if (props.size === "XL") {
|
|
98
|
-
rules += '
|
|
99
|
-
rules += '
|
|
98
|
+
rules += ' _ebj';
|
|
99
|
+
rules += ' _ei';
|
|
100
100
|
} else if (props.size === "L") {
|
|
101
|
-
rules += '
|
|
102
|
-
rules += '
|
|
101
|
+
rules += ' _ebh';
|
|
102
|
+
rules += ' _eg';
|
|
103
103
|
} else if (props.size === "S") {
|
|
104
|
-
rules += '
|
|
105
|
-
rules += '
|
|
104
|
+
rules += ' _ebd';
|
|
105
|
+
rules += ' _ec';
|
|
106
106
|
} else if (props.size === "XS") {
|
|
107
|
-
rules += '
|
|
108
|
-
rules += '
|
|
107
|
+
rules += ' _ebb';
|
|
108
|
+
rules += ' _ea';
|
|
109
109
|
} else {
|
|
110
|
-
rules += '
|
|
111
|
-
rules += '
|
|
110
|
+
rules += ' _ebf';
|
|
111
|
+
rules += ' _ee';
|
|
112
112
|
}
|
|
113
|
-
rules += '
|
|
114
|
-
rules += '
|
|
115
|
-
rules += '
|
|
113
|
+
rules += ' _fc';
|
|
114
|
+
rules += ' _g-1x99dlob';
|
|
115
|
+
rules += ' _ga';
|
|
116
116
|
if (props.isDisabled) rules += ' aa_____O';
|
|
117
117
|
else if (props.isSelected) rules += ' aa_____N';
|
|
118
118
|
else rules += ' aa_____K';
|
|
@@ -135,52 +135,52 @@ const $6e265ff388155b91$export$446543cff2a0f496 = function anonymous(props, over
|
|
|
135
135
|
else if (props.isHovered) rules += ' ao';
|
|
136
136
|
else rules += ' an';
|
|
137
137
|
}
|
|
138
|
-
rules += '
|
|
139
|
-
rules += '
|
|
140
|
-
if (!$
|
|
141
|
-
if (props.size === "XL") rules += '
|
|
142
|
-
else if (props.size === "L") rules += '
|
|
143
|
-
else if (props.size === "S") rules += '
|
|
144
|
-
else if (props.size === "XS") rules += '
|
|
145
|
-
else rules += '
|
|
138
|
+
rules += ' __Ea';
|
|
139
|
+
rules += ' k-375toq';
|
|
140
|
+
if (!$q) {
|
|
141
|
+
if (props.size === "XL") rules += ' qj';
|
|
142
|
+
else if (props.size === "L") rules += ' qi';
|
|
143
|
+
else if (props.size === "S") rules += ' qh';
|
|
144
|
+
else if (props.size === "XS") rules += ' qg';
|
|
145
|
+
else rules += ' qf';
|
|
146
146
|
}
|
|
147
|
+
rules += ' _Pa';
|
|
148
|
+
rules += ' _R-375x7f';
|
|
147
149
|
rules += ' _Sa';
|
|
148
|
-
rules += '
|
|
149
|
-
rules += ' _Va';
|
|
150
|
-
rules += ' _Db';
|
|
150
|
+
rules += ' _Ab';
|
|
151
151
|
rules += ' b-375toh';
|
|
152
|
-
rules += ' -
|
|
153
|
-
rules += '
|
|
154
|
-
rules += '
|
|
155
|
-
rules += '
|
|
156
|
-
rules += '
|
|
157
|
-
rules += '
|
|
158
|
-
rules += '
|
|
159
|
-
rules += '
|
|
152
|
+
rules += ' -rwx0fg_e-b';
|
|
153
|
+
rules += ' wf';
|
|
154
|
+
rules += ' C-1imc51ya';
|
|
155
|
+
rules += ' CI';
|
|
156
|
+
rules += ' D-1imc51ya';
|
|
157
|
+
rules += ' DI';
|
|
158
|
+
rules += ' Ea';
|
|
159
|
+
rules += ' Fa';
|
|
160
160
|
if (props.density === "compact") {
|
|
161
|
-
rules += '
|
|
162
|
-
rules += '
|
|
163
|
-
} else rules += '
|
|
161
|
+
rules += ' _w-13alit4h';
|
|
162
|
+
rules += ' _wa';
|
|
163
|
+
} else rules += ' _wh';
|
|
164
164
|
if (props.density === "compact") {
|
|
165
|
-
if (props.orientation === "vertical") rules += '
|
|
166
|
-
else if (props.orientation === "horizontal") rules += '
|
|
167
|
-
else rules += '
|
|
168
|
-
} else rules += '
|
|
165
|
+
if (props.orientation === "vertical") rules += ' _x-13alit4h';
|
|
166
|
+
else if (props.orientation === "horizontal") rules += ' _x-uamghwh';
|
|
167
|
+
else rules += ' _xa';
|
|
168
|
+
} else rules += ' _xh';
|
|
169
169
|
if (props.density === "compact") {
|
|
170
|
-
if (props.orientation === "vertical") rules += '
|
|
171
|
-
else if (props.orientation === "horizontal") rules += '
|
|
172
|
-
else rules += '
|
|
173
|
-
} else rules += '
|
|
170
|
+
if (props.orientation === "vertical") rules += ' _y-uamghwh';
|
|
171
|
+
else if (props.orientation === "horizontal") rules += ' _y-13alit4h';
|
|
172
|
+
else rules += ' _ya';
|
|
173
|
+
} else rules += ' _yh';
|
|
174
174
|
if (props.density === "compact") {
|
|
175
|
-
rules += '
|
|
176
|
-
rules += '
|
|
177
|
-
} else rules += '
|
|
178
|
-
rules += ' -
|
|
179
|
-
rules += ' -
|
|
180
|
-
if (!$
|
|
181
|
-
if (props.isFocusVisible) rules += '
|
|
175
|
+
rules += ' _z-uamghwh';
|
|
176
|
+
rules += ' _za';
|
|
177
|
+
} else rules += ' _zh';
|
|
178
|
+
rules += ' -oelgqu_A--1imc51ya';
|
|
179
|
+
rules += ' -oelgqu_A--177861o';
|
|
180
|
+
if (!$__R) {
|
|
181
|
+
if (props.isFocusVisible) rules += ' __R-3t1z';
|
|
182
182
|
}
|
|
183
|
-
rules += '
|
|
183
|
+
rules += ' __S-yksgrp';
|
|
184
184
|
if (props.isSelected) {
|
|
185
185
|
if (props.isDisabled) rules += ' -_375toh_b-a_____J';
|
|
186
186
|
else rules += ' -_375toh_b-a_____M';
|
|
@@ -223,11 +223,11 @@ const $6e265ff388155b91$export$446543cff2a0f496 = function anonymous(props, over
|
|
|
223
223
|
else if (props.isQuiet) rules += ' -_375toh_b-a';
|
|
224
224
|
else rules += ' -_375toh_b-g';
|
|
225
225
|
}
|
|
226
|
-
if (props.size === "XL") rules += ' -
|
|
227
|
-
else if (props.size === "L") rules += ' -
|
|
228
|
-
else if (props.size === "S") rules += ' -
|
|
229
|
-
else if (props.size === "XS") rules += ' -
|
|
230
|
-
else rules += ' -
|
|
226
|
+
if (props.size === "XL") rules += ' -_375toq_k-j';
|
|
227
|
+
else if (props.size === "L") rules += ' -_375toq_k-i';
|
|
228
|
+
else if (props.size === "S") rules += ' -_375toq_k-h';
|
|
229
|
+
else if (props.size === "XS") rules += ' -_375toq_k-g';
|
|
230
|
+
else rules += ' -_375toq_k-f';
|
|
231
231
|
return rules;
|
|
232
232
|
};
|
|
233
233
|
// Matching icon sizes. TBD.
|
|
@@ -274,7 +274,7 @@ const $6e265ff388155b91$export$cfc7921d29ef7b80 = /*#__PURE__*/ (0, $9ZEgK$react
|
|
|
274
274
|
[
|
|
275
275
|
(0, $6367bc87eb7d24ad$exports.TextContext),
|
|
276
276
|
{
|
|
277
|
-
styles: "
|
|
277
|
+
styles: " E-1gogtue F-1gogtue __B-3t1y __wb __xb _na _qb"
|
|
278
278
|
}
|
|
279
279
|
],
|
|
280
280
|
[
|
|
@@ -282,16 +282,16 @@ const $6e265ff388155b91$export$cfc7921d29ef7b80 = /*#__PURE__*/ (0, $9ZEgK$react
|
|
|
282
282
|
{
|
|
283
283
|
render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
|
|
284
284
|
slot: 'icon',
|
|
285
|
-
styles: "
|
|
285
|
+
styles: " __B-3t1x"
|
|
286
286
|
}),
|
|
287
|
-
styles: "
|
|
287
|
+
styles: " l-1sthc3k k-1sthc3k y-oelgqu _9-3t1x"
|
|
288
288
|
}
|
|
289
289
|
],
|
|
290
290
|
[
|
|
291
291
|
(0, $38071d9ce246d4cf$exports.AvatarContext),
|
|
292
292
|
{
|
|
293
293
|
size: $6e265ff388155b91$var$avatarSize[size],
|
|
294
|
-
styles: "
|
|
294
|
+
styles: " y-oelgqu _9-3t1x __B-3t1x"
|
|
295
295
|
}
|
|
296
296
|
]
|
|
297
297
|
],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAiDD,yDAAyD;AACzD,MAAM,iCAAW;AACV,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgKb,4BAA4B;AAC5B,MAAM,mCAAa;IACjB,IAAI;IACJ,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;AACL;AAEO,MAAM,0DAAsB,CAAA,GAAA,0BAAY,EAAyE;AAMjH,MAAM,0DAAe,CAAA,GAAA,uBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,sBAAsB,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,qDAAyB;IAC9D,IAAI,MAAM,CAAA,GAAA,4CAAgB,EAAE,CAAA,GAAA,kDAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,QACvB,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAEZ,qBACE,gCAAC,CAAA,GAAA,iCAAQ;QACN,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAU;gBACnE,GAAG,WAAW;gBACd,+CAA+C;gBAC/C,WAAW,YAAY,SAAS,IAAI,qBAAqB,UAAU;6BACnE;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;yBACA;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gCAAC,CAAA,GAAA,mCAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBAAC,MAAM;oBAA+D;iBAAE;gBACtF;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;gBACF;oBAAC,CAAA,GAAA,uCAAY;oBAAG;wBACd,MAAM,gCAAU,CAAC,KAAK;wBACtB,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,8BAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ActionButton.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 {ActionButtonGroupContext} from './ActionButtonGroup';\nimport {AvatarContext} from './Avatar';\nimport {baseColor, focusRing, fontRelative, style} from '../style' with { type: 'macro' };\nimport {ButtonProps, ButtonRenderProps, ContextValue, OverlayTriggerStateContext, Provider, Button as RACButton, useSlottedContext} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with { type: 'macro' };\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonStyleProps {\n /**\n * The size of the ActionButton.\n *\n * @default 'M'\n */\n size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the ActionButton appears over a color background. */\n staticColor?: 'black' | 'white' | 'auto',\n /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n isQuiet?: boolean\n}\n\ninterface ToggleButtonStyleProps {\n /** Whether the ActionButton should be selected (controlled). */\n isSelected?: boolean,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\ninterface ActionGroupItemStyleProps {\n density?: 'regular' | 'compact',\n orientation?: 'horizontal' | 'vertical',\n isJustified?: boolean\n}\n\nexport interface ActionButtonProps extends Omit<ButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'isPending'>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the ActionButton. */\n children?: ReactNode\n}\n\n// These styles handle both ActionButton and ToggleButton\nconst iconOnly = ':has([slot=icon], [slot=avatar]):not(:has([data-rsp-slot=text]))';\nexport const btnStyles = style<ButtonRenderProps & ActionButtonStyleProps & ToggleButtonStyleProps & ActionGroupItemStyleProps & {isInGroup: boolean, isStaticColor: boolean}>({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n columnGap: 'text-to-visual',\n flexShrink: {\n default: 1,\n isInGroup: 0\n },\n flexGrow: {\n isJustified: 1\n },\n flexBasis: {\n isJustified: 0\n },\n font: 'control',\n fontWeight: 'medium',\n userSelect: 'none',\n height: 'control',\n minWidth: 'control',\n transition: 'default',\n forcedColorAdjust: 'none',\n backgroundColor: {\n default: {\n ...baseColor('gray-100'),\n default: {\n default: 'gray-100',\n isQuiet: 'transparent'\n }\n },\n isSelected: {\n default: 'neutral',\n isEmphasized: 'accent',\n isDisabled: {\n default: 'gray-100',\n isQuiet: 'transparent'\n }\n },\n isStaticColor: {\n ...baseColor('transparent-overlay-100'),\n default: {\n default: 'transparent-overlay-100',\n isQuiet: 'transparent'\n },\n isSelected: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: {\n default: 'transparent-overlay-100',\n isQuiet: 'transparent'\n }\n }\n },\n forcedColors: {\n default: 'ButtonFace',\n isSelected: {\n default: 'Highlight',\n isDisabled: 'ButtonFace'\n }\n }\n },\n color: {\n default: 'neutral',\n isSelected: {\n default: 'gray-25',\n isEmphasized: 'white'\n },\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isSelected: 'auto',\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n default: 'ButtonText',\n isSelected: 'HighlightText',\n isDisabled: {\n default: 'GrayText'\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n },\n borderStyle: 'none',\n paddingX: {\n default: 'edge-to-text',\n [iconOnly]: 0\n },\n paddingY: 0,\n borderTopStartRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n ':first-child': 'control'\n }\n }\n },\n borderTopEndRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n orientation: {\n horizontal: {\n ':last-child': 'control'\n },\n vertical: {\n ':first-child': 'control'\n }\n }\n }\n }\n },\n borderBottomStartRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n orientation: {\n horizontal: {\n ':first-child': 'control'\n },\n vertical: {\n ':last-child': 'control'\n }\n }\n }\n }\n },\n borderBottomEndRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n ':last-child': 'control'\n }\n }\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n [iconOnly]: 0\n }\n },\n zIndex: {\n isFocusVisible: 2\n },\n disableTapHighlight: true\n}, getAllowedOverrides());\n\n// Matching icon sizes. TBD.\nconst avatarSize = {\n XS: 14,\n S: 16,\n M: 20,\n L: 22,\n X: 26\n} as const;\n\nexport const ActionButtonContext = createContext<ContextValue<ActionButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ActionButtons allow users to perform an action.\n * They’re used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren’t meant to draw a lot of attention.\n */\nexport const ActionButton = forwardRef(function ActionButton(props: ActionButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ActionButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let overlayTriggerState = useContext(OverlayTriggerStateContext);\n let ctx = useSlottedContext(ActionButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }],\n [AvatarContext, {\n size: avatarSize[size],\n styles: style({marginStart: '--iconMargin', flexShrink: 0, order: 0})\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n </RACButton>\n );\n});\n"],"names":[],"version":3,"file":"ActionButton.cjs.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;AAiDD,yDAAyD;AACzD,MAAM,iCAAW;AACV,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgKb,4BAA4B;AAC5B,MAAM,mCAAa;IACjB,IAAI;IACJ,GAAG;IACH,GAAG;IACH,GAAG;IACH,GAAG;AACL;AAEO,MAAM,0DAAsB,CAAA,GAAA,0BAAY,EAAkF;AAM1H,MAAM,0DAAe,CAAA,GAAA,uBAAS,EAAE,SAAS,aAAa,KAAwB,EAAE,GAAoC;IACzH,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,IAAI,sBAAsB,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,qDAAyB;IAC9D,IAAI,MAAM,CAAA,GAAA,4CAAgB,EAAE,CAAA,GAAA,kDAAuB;IACnD,IAAI,YAAY,CAAC,CAAC;IAClB,IAAI,WACF,UAAU,wBACV,WAAW,eACX,cAAc,2BACd,cAAc,MAAM,WAAW,WAC/B,UAAU,MAAM,OAAO,QACvB,OAAO,MAAM,IAAI,IAAI,iBACrB,aAAa,MAAM,UAAU,EAC9B,GAAG,OAAO,CAAC;IAEZ,qBACE,gCAAC,CAAA,GAAA,iCAAQ;QACN,GAAG,KAAK;QACT,YAAY;QACZ,KAAK;QACL,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,0CAAU;gBACnE,GAAG,WAAW;gBACd,+CAA+C;gBAC/C,WAAW,YAAY,SAAS,IAAI,qBAAqB,UAAU;6BACnE;gBACA,eAAe,CAAC,CAAC;sBACjB;yBACA;yBACA;6BACA;6BACA;2BACA;YACF,GAAG,MAAM,MAAM;kBACf,cAAA,gCAAC,CAAA,GAAA,mCAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBAAC,MAAM;oBAA+D;iBAAE;gBACtF;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;gBACF;oBAAC,CAAA,GAAA,uCAAY;oBAAG;wBACd,MAAM,gCAAU,CAAC,KAAK;wBACtB,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,8BAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F","sources":["packages/@react-spectrum/s2/src/ActionButton.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 {ActionButtonGroupContext} from './ActionButtonGroup';\nimport {AvatarContext} from './Avatar';\nimport {baseColor, focusRing, fontRelative, style} from '../style' with { type: 'macro' };\nimport {ButtonProps, ButtonRenderProps, ContextValue, OverlayTriggerStateContext, Provider, Button as RACButton, useSlottedContext} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {createContext, forwardRef, ReactNode, useContext} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, staticColor, StyleProps} from './style-utils' with { type: 'macro' };\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ActionButtonStyleProps {\n /**\n * The size of the ActionButton.\n *\n * @default 'M'\n */\n size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n /** The static color style to apply. Useful when the ActionButton appears over a color background. */\n staticColor?: 'black' | 'white' | 'auto',\n /** Whether the button should be displayed with a [quiet style](https://spectrum.adobe.com/page/action-button/#Quiet). */\n isQuiet?: boolean\n}\n\ninterface ToggleButtonStyleProps {\n /** Whether the ActionButton should be selected (controlled). */\n isSelected?: boolean,\n /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n isEmphasized?: boolean\n}\n\ninterface ActionGroupItemStyleProps {\n density?: 'regular' | 'compact',\n orientation?: 'horizontal' | 'vertical',\n isJustified?: boolean\n}\n\nexport interface ActionButtonProps extends Omit<ButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange' | 'isPending'>, StyleProps, ActionButtonStyleProps {\n /** The content to display in the ActionButton. */\n children: ReactNode\n}\n\n// These styles handle both ActionButton and ToggleButton\nconst iconOnly = ':has([slot=icon], [slot=avatar]):not(:has([data-rsp-slot=text]))';\nexport const btnStyles = style<ButtonRenderProps & ActionButtonStyleProps & ToggleButtonStyleProps & ActionGroupItemStyleProps & {isInGroup: boolean, isStaticColor: boolean}>({\n ...focusRing(),\n ...staticColor(),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n columnGap: 'text-to-visual',\n flexShrink: {\n default: 1,\n isInGroup: 0\n },\n flexGrow: {\n isJustified: 1\n },\n flexBasis: {\n isJustified: 0\n },\n font: 'control',\n fontWeight: 'medium',\n userSelect: 'none',\n height: 'control',\n minWidth: 'control',\n transition: 'default',\n forcedColorAdjust: 'none',\n backgroundColor: {\n default: {\n ...baseColor('gray-100'),\n default: {\n default: 'gray-100',\n isQuiet: 'transparent'\n }\n },\n isSelected: {\n default: 'neutral',\n isEmphasized: 'accent',\n isDisabled: {\n default: 'gray-100',\n isQuiet: 'transparent'\n }\n },\n isStaticColor: {\n ...baseColor('transparent-overlay-100'),\n default: {\n default: 'transparent-overlay-100',\n isQuiet: 'transparent'\n },\n isSelected: {\n default: baseColor('transparent-overlay-800'),\n isDisabled: {\n default: 'transparent-overlay-100',\n isQuiet: 'transparent'\n }\n }\n },\n forcedColors: {\n default: 'ButtonFace',\n isSelected: {\n default: 'Highlight',\n isDisabled: 'ButtonFace'\n }\n }\n },\n color: {\n default: 'neutral',\n isSelected: {\n default: 'gray-25',\n isEmphasized: 'white'\n },\n isDisabled: 'disabled',\n isStaticColor: {\n default: baseColor('transparent-overlay-800'),\n isSelected: 'auto',\n isDisabled: 'transparent-overlay-400'\n },\n forcedColors: {\n default: 'ButtonText',\n isSelected: 'HighlightText',\n isDisabled: {\n default: 'GrayText'\n }\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n outlineColor: {\n default: 'focus-ring',\n isStaticColor: 'transparent-overlay-1000',\n forcedColors: 'Highlight'\n },\n borderStyle: 'none',\n paddingX: {\n default: 'edge-to-text',\n [iconOnly]: 0\n },\n paddingY: 0,\n borderTopStartRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n ':first-child': 'control'\n }\n }\n },\n borderTopEndRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n orientation: {\n horizontal: {\n ':last-child': 'control'\n },\n vertical: {\n ':first-child': 'control'\n }\n }\n }\n }\n },\n borderBottomStartRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n orientation: {\n horizontal: {\n ':first-child': 'control'\n },\n vertical: {\n ':last-child': 'control'\n }\n }\n }\n }\n },\n borderBottomEndRadius: {\n default: 'control',\n density: {\n compact: {\n default: 'none',\n ':last-child': 'control'\n }\n }\n },\n '--iconMargin': {\n type: 'marginTop',\n value: {\n default: fontRelative(-2),\n [iconOnly]: 0\n }\n },\n zIndex: {\n isFocusVisible: 2\n },\n disableTapHighlight: true\n}, getAllowedOverrides());\n\n// Matching icon sizes. TBD.\nconst avatarSize = {\n XS: 14,\n S: 16,\n M: 20,\n L: 22,\n X: 26\n} as const;\n\nexport const ActionButtonContext = createContext<ContextValue<Partial<ActionButtonProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * ActionButtons allow users to perform an action.\n * They’re used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren’t meant to draw a lot of attention.\n */\nexport const ActionButton = forwardRef(function ActionButton(props: ActionButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, ActionButtonContext);\n props = useFormProps(props as any);\n let domRef = useFocusableRef(ref);\n let overlayTriggerState = useContext(OverlayTriggerStateContext);\n let ctx = useSlottedContext(ActionButtonGroupContext);\n let isInGroup = !!ctx;\n let {\n density = 'regular',\n isJustified,\n orientation = 'horizontal',\n staticColor = props.staticColor,\n isQuiet = props.isQuiet,\n size = props.size || 'M',\n isDisabled = props.isDisabled\n } = ctx || {};\n\n return (\n <RACButton\n {...props}\n isDisabled={isDisabled}\n ref={domRef}\n style={pressScale(domRef, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n ...renderProps,\n // Retain hover styles when an overlay is open.\n isHovered: renderProps.isHovered || overlayTriggerState?.isOpen || false,\n staticColor,\n isStaticColor: !!staticColor,\n size,\n isQuiet,\n density,\n isJustified,\n orientation,\n isInGroup\n }, props.styles)}>\n <Provider\n values={[\n [SkeletonContext, null],\n [TextContext, {styles: style({paddingY: '--labelPadding', order: 1, truncate: true})}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n }],\n [AvatarContext, {\n size: avatarSize[size],\n styles: style({marginStart: '--iconMargin', flexShrink: 0, order: 0})\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n </RACButton>\n );\n});\n"],"names":[],"version":3,"file":"ActionButton.cjs.map"}
|