@react-spectrum/s2 3.0.0-nightly-63d4359d6-250427 → 3.0.0-nightly-1dd65ffc5-250429
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 +4 -5
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css +2 -4
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +4 -5
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionBar.cjs +72 -63
- package/dist/ActionBar.cjs.map +1 -1
- package/dist/ActionBar.css +70 -63
- package/dist/ActionBar.css.map +1 -1
- package/dist/ActionBar.mjs +72 -63
- package/dist/ActionBar.mjs.map +1 -1
- package/dist/ActionButton.cjs +161 -160
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +174 -168
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +161 -160
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.cjs +17 -18
- package/dist/ActionButtonGroup.cjs.map +1 -1
- package/dist/ActionButtonGroup.css +9 -11
- package/dist/ActionButtonGroup.css.map +1 -1
- package/dist/ActionButtonGroup.mjs +17 -18
- package/dist/ActionButtonGroup.mjs.map +1 -1
- package/dist/AlertDialog.cjs +4 -4
- package/dist/AlertDialog.css +3 -5
- package/dist/AlertDialog.css.map +1 -1
- package/dist/AlertDialog.mjs +4 -4
- package/dist/Avatar.cjs +21 -21
- package/dist/Avatar.css +14 -16
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +21 -21
- package/dist/AvatarGroup.cjs +131 -110
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +43 -49
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +131 -110
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +150 -149
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +140 -134
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +150 -149
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +169 -154
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +119 -105
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +169 -154
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +321 -275
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +245 -215
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +321 -275
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +27 -25
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css +15 -17
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +27 -25
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +316 -299
- package/dist/Card.cjs.map +1 -1
- package/dist/Card.css +242 -215
- package/dist/Card.css.map +1 -1
- package/dist/Card.mjs +316 -299
- package/dist/Card.mjs.map +1 -1
- package/dist/CardView.cjs +29 -30
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +19 -19
- package/dist/CardView.mjs +29 -30
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +2 -2
- package/dist/CenterBaseline.css +3 -5
- package/dist/CenterBaseline.css.map +1 -1
- package/dist/CenterBaseline.mjs +2 -2
- package/dist/Checkbox.cjs +114 -112
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +99 -93
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +114 -112
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +54 -54
- package/dist/CheckboxGroup.css +42 -42
- package/dist/CheckboxGroup.mjs +54 -54
- package/dist/ClearButton.cjs +19 -19
- package/dist/ClearButton.css +19 -21
- package/dist/ClearButton.css.map +1 -1
- package/dist/ClearButton.mjs +19 -19
- package/dist/CloseButton.cjs +64 -62
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +48 -48
- package/dist/CloseButton.mjs +64 -62
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +28 -28
- package/dist/ColorArea.css +17 -17
- package/dist/ColorArea.mjs +28 -28
- package/dist/ColorField.cjs +41 -41
- package/dist/ColorField.css +33 -33
- package/dist/ColorField.mjs +41 -41
- package/dist/ColorHandle.cjs +29 -29
- package/dist/ColorHandle.css +45 -45
- package/dist/ColorHandle.mjs +29 -29
- package/dist/ColorSlider.cjs +68 -64
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +64 -58
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +68 -64
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +44 -38
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +29 -31
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +44 -38
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +31 -32
- package/dist/ColorSwatchPicker.cjs.map +1 -1
- package/dist/ColorSwatchPicker.css +48 -48
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +31 -32
- package/dist/ColorSwatchPicker.mjs.map +1 -1
- package/dist/ColorWheel.cjs +28 -28
- package/dist/ColorWheel.css +18 -18
- package/dist/ColorWheel.mjs +28 -28
- package/dist/ComboBox.cjs +108 -108
- package/dist/ComboBox.css +101 -101
- package/dist/ComboBox.mjs +108 -108
- package/dist/ContextualHelp.cjs +5 -5
- package/dist/ContextualHelp.css +58 -44
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +5 -5
- package/dist/CustomDialog.cjs +38 -38
- package/dist/CustomDialog.css +26 -26
- package/dist/CustomDialog.mjs +38 -38
- package/dist/Dialog.cjs +18 -18
- package/dist/Dialog.css +86 -72
- package/dist/Dialog.css.map +1 -1
- package/dist/Dialog.mjs +18 -18
- package/dist/Disclosure.cjs +139 -133
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +144 -120
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +139 -133
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs +47 -47
- package/dist/Divider.css +26 -26
- package/dist/Divider.mjs +47 -47
- package/dist/DropZone.cjs +68 -64
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +66 -60
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +68 -64
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +192 -186
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +167 -159
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +192 -186
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +11 -12
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +9 -11
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs +11 -12
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +5 -5
- package/dist/FullscreenDialog.css +94 -80
- package/dist/FullscreenDialog.css.map +1 -1
- package/dist/FullscreenDialog.mjs +5 -5
- package/dist/IllustratedMessage.cjs +185 -160
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +93 -91
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +185 -160
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +14 -14
- package/dist/Image.css +14 -16
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +14 -14
- package/dist/InlineAlert.cjs +130 -122
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css +109 -95
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +130 -122
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Link.cjs +57 -47
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css +52 -44
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +57 -47
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +353 -325
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +189 -189
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +353 -325
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +116 -114
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +106 -104
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +116 -114
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +62 -59
- package/dist/Modal.cjs.map +1 -1
- package/dist/Modal.css +52 -51
- package/dist/Modal.css.map +1 -1
- package/dist/Modal.mjs +62 -59
- package/dist/Modal.mjs.map +1 -1
- package/dist/NotificationBadge.cjs +66 -62
- package/dist/NotificationBadge.cjs.map +1 -1
- package/dist/NotificationBadge.css +78 -72
- package/dist/NotificationBadge.css.map +1 -1
- package/dist/NotificationBadge.mjs +66 -62
- package/dist/NotificationBadge.mjs.map +1 -1
- package/dist/NumberField.cjs +133 -133
- package/dist/NumberField.css +120 -120
- package/dist/NumberField.mjs +133 -133
- package/dist/Picker.cjs +209 -207
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +179 -173
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +209 -207
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +124 -93
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +67 -83
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +124 -93
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs +132 -130
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +119 -117
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +132 -130
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +32 -32
- package/dist/ProgressCircle.css +20 -20
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +32 -32
- package/dist/Provider.cjs +11 -11
- package/dist/Provider.css +9 -11
- package/dist/Provider.css.map +1 -1
- package/dist/Provider.mjs +11 -11
- package/dist/Radio.cjs +101 -99
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +101 -95
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +101 -99
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +52 -52
- package/dist/RadioGroup.css +42 -42
- package/dist/RadioGroup.mjs +52 -52
- package/dist/SearchField.cjs +52 -52
- package/dist/SearchField.css +54 -54
- package/dist/SearchField.mjs +52 -52
- package/dist/SegmentedControl.cjs +123 -119
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +110 -104
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +123 -119
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +251 -248
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +166 -157
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +251 -248
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +74 -70
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +70 -64
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +74 -70
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +110 -108
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +86 -80
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +110 -108
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +334 -329
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +193 -193
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +334 -329
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +153 -149
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +102 -96
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +153 -149
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TabsPicker.cjs +131 -129
- package/dist/TabsPicker.cjs.map +1 -1
- package/dist/TabsPicker.css +132 -126
- package/dist/TabsPicker.css.map +1 -1
- package/dist/TabsPicker.mjs +131 -129
- package/dist/TabsPicker.mjs.map +1 -1
- package/dist/TagGroup.cjs +197 -193
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +164 -158
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +197 -193
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +67 -65
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +71 -65
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +67 -65
- package/dist/TextField.mjs.map +1 -1
- package/dist/Toast.cjs +138 -136
- package/dist/Toast.cjs.map +1 -1
- package/dist/Toast.css +117 -111
- package/dist/Toast.css.map +1 -1
- package/dist/Toast.mjs +138 -136
- package/dist/Toast.mjs.map +1 -1
- package/dist/ToggleButton.cjs +3 -3
- package/dist/ToggleButton.css +12 -14
- package/dist/ToggleButton.css.map +1 -1
- package/dist/ToggleButton.mjs +3 -3
- package/dist/Tooltip.cjs +99 -72
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +87 -87
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +99 -72
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/TreeView.cjs +169 -157
- package/dist/TreeView.cjs.map +1 -1
- package/dist/TreeView.css +155 -153
- package/dist/TreeView.css.map +1 -1
- package/dist/TreeView.mjs +169 -157
- package/dist/TreeView.mjs.map +1 -1
- package/dist/types.d.ts +1 -1
- package/dist/types.d.ts.map +1 -1
- package/icons/Skeleton.cjs +3 -3
- package/icons/Skeleton.cjs.map +1 -1
- package/icons/Skeleton.css +8 -10
- package/icons/Skeleton.css.map +1 -1
- package/icons/Skeleton.mjs +3 -3
- package/icons/Skeleton.mjs.map +1 -1
- package/package.json +22 -22
- package/src/Card.tsx +3 -3
- package/src/Disclosure.tsx +3 -3
- package/src/TableView.tsx +1 -4
- package/src/style-utils.ts +0 -2
- package/style/__tests__/style-macro.test.js +323 -27
- package/style/dist/properties.cjs +4 -0
- package/style/dist/properties.cjs.map +1 -0
- package/style/dist/properties.mjs +6 -0
- package/style/dist/properties.mjs.map +1 -0
- package/style/dist/spectrum-theme.cjs +123 -124
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs +124 -125
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/style-macro.cjs +244 -263
- package/style/dist/style-macro.cjs.map +1 -1
- package/style/dist/style-macro.mjs +240 -259
- package/style/dist/style-macro.mjs.map +1 -1
- package/style/dist/types.d.ts +84 -80
- package/style/dist/types.d.ts.map +1 -1
- package/style/properties.json +2422 -0
- package/style/spectrum-theme.ts +101 -110
- package/style/style-macro.ts +319 -220
- package/style/types.ts +8 -4
package/dist/SearchField.mjs
CHANGED
|
@@ -55,69 +55,69 @@ const $e3d0f3db0eb61b92$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $iu0JR$forwa
|
|
|
55
55
|
ref: domRef,
|
|
56
56
|
style: UNSAFE_style,
|
|
57
57
|
className: UNSAFE_className + function anonymous(props, overrides) {
|
|
58
|
-
let rules = "
|
|
59
|
-
let
|
|
60
|
-
|
|
61
|
-
let
|
|
62
|
-
let $__c = false;
|
|
58
|
+
let rules = " ";
|
|
59
|
+
let gridColumnStart = false;
|
|
60
|
+
let gridColumnEnd = false;
|
|
61
|
+
let matches = (overrides || '').matchAll(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I|f|u|_l)[^\s]+/g);
|
|
63
62
|
for (let p of matches){
|
|
64
|
-
if (
|
|
65
|
-
if (
|
|
63
|
+
if (p[1] === "L") gridColumnStart = true;
|
|
64
|
+
if (p[1] === "N") gridColumnEnd = true;
|
|
65
|
+
rules += p[0];
|
|
66
66
|
}
|
|
67
|
-
rules += '
|
|
68
|
-
if (
|
|
69
|
-
if (
|
|
67
|
+
rules += ' mb';
|
|
68
|
+
if (props.isInForm) {
|
|
69
|
+
if (!gridColumnStart) rules += ' L2mU';
|
|
70
70
|
}
|
|
71
|
-
if (
|
|
72
|
-
if (props.
|
|
73
|
-
if (
|
|
71
|
+
if (props.isInForm) {
|
|
72
|
+
if (props.labelPosition === "side") {
|
|
73
|
+
if (!gridColumnEnd) rules += ' NvoofG';
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
|
-
if (props.isInForm) rules += '
|
|
76
|
+
if (props.isInForm) rules += ' SLwlgod';
|
|
77
77
|
else {
|
|
78
|
-
if (props.labelPosition === "side") rules += '
|
|
79
|
-
else if (props.labelPosition === "top") rules += '
|
|
78
|
+
if (props.labelPosition === "side") rules += ' SPlN5qb';
|
|
79
|
+
else if (props.labelPosition === "top") rules += ' SM8Mfn';
|
|
80
80
|
}
|
|
81
|
-
if (props.labelPosition === "side") rules += '
|
|
82
|
-
else if (props.labelPosition === "top") rules += '
|
|
83
|
-
if (props.labelPosition === "side") rules += '
|
|
84
|
-
else if (props.labelPosition === "top") rules += '
|
|
81
|
+
if (props.labelPosition === "side") rules += ' _FPlN5qb';
|
|
82
|
+
else if (props.labelPosition === "top") rules += ' _F4w1sLc';
|
|
83
|
+
if (props.labelPosition === "side") rules += ' _ubRM95c';
|
|
84
|
+
else if (props.labelPosition === "top") rules += ' _uxaocre';
|
|
85
85
|
if (props.size === "XL") {
|
|
86
|
-
rules += '
|
|
87
|
-
rules += '
|
|
86
|
+
rules += ' ah';
|
|
87
|
+
rules += ' aac';
|
|
88
88
|
} else if (props.size === "L") {
|
|
89
|
-
rules += '
|
|
90
|
-
rules += '
|
|
89
|
+
rules += ' ae';
|
|
90
|
+
rules += ' aad';
|
|
91
91
|
} else if (props.size === "S") {
|
|
92
|
-
rules += '
|
|
93
|
-
rules += '
|
|
92
|
+
rules += ' af';
|
|
93
|
+
rules += ' aag';
|
|
94
94
|
} else if (props.size === "XS") {
|
|
95
|
-
rules += '
|
|
96
|
-
rules += '
|
|
95
|
+
rules += ' ai';
|
|
96
|
+
rules += ' aaj';
|
|
97
97
|
} else {
|
|
98
|
-
rules += '
|
|
99
|
-
rules += '
|
|
98
|
+
rules += ' aa';
|
|
99
|
+
rules += ' aab';
|
|
100
100
|
}
|
|
101
|
-
rules += '
|
|
102
|
-
rules += '
|
|
103
|
-
rules += '
|
|
104
|
-
if (props.size === "XL") rules += ' -
|
|
105
|
-
else if (props.size === "L") rules += ' -
|
|
106
|
-
else if (props.size === "S") rules += ' -
|
|
107
|
-
else if (props.size === "XS") rules += ' -
|
|
108
|
-
else rules += ' -
|
|
109
|
-
rules += ' -
|
|
110
|
-
rules += '
|
|
111
|
-
rules += '
|
|
112
|
-
rules += ' -
|
|
101
|
+
rules += ' Fb';
|
|
102
|
+
rules += ' gb';
|
|
103
|
+
rules += ' gca';
|
|
104
|
+
if (props.size === "XL") rules += ' -BhX7R-ee';
|
|
105
|
+
else if (props.size === "L") rules += ' -BhX7R-ed';
|
|
106
|
+
else if (props.size === "S") rules += ' -BhX7R-eb';
|
|
107
|
+
else if (props.size === "XS") rules += ' -BhX7R-ea';
|
|
108
|
+
else rules += ' -BhX7R-ec';
|
|
109
|
+
rules += ' -AJjOLd-p8R8pb';
|
|
110
|
+
rules += ' ka';
|
|
111
|
+
rules += ' _Ga';
|
|
112
|
+
rules += ' -Qg41Lb-jAxCW0c';
|
|
113
113
|
if (props.isDisabled) {
|
|
114
|
-
rules += '
|
|
115
|
-
rules += '
|
|
114
|
+
rules += ' dc';
|
|
115
|
+
rules += ' dbe';
|
|
116
116
|
} else {
|
|
117
|
-
if (props.isPressed) rules += '
|
|
118
|
-
else if (props.isFocusVisible) rules += '
|
|
119
|
-
else if (props.isHovered) rules += '
|
|
120
|
-
else rules += '
|
|
117
|
+
if (props.isPressed) rules += ' db';
|
|
118
|
+
else if (props.isFocusVisible) rules += ' db';
|
|
119
|
+
else if (props.isHovered) rules += ' db';
|
|
120
|
+
else rules += ' da';
|
|
121
121
|
}
|
|
122
122
|
return rules;
|
|
123
123
|
}({
|
|
@@ -140,7 +140,7 @@ const $e3d0f3db0eb61b92$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $iu0JR$forwa
|
|
|
140
140
|
/*#__PURE__*/ (0, $iu0JR$jsxs)((0, $9afd80978c252040$export$f0fe469072bc6950), {
|
|
141
141
|
isDisabled: isDisabled,
|
|
142
142
|
size: props.size,
|
|
143
|
-
styles: "
|
|
143
|
+
styles: " za xa wa ya oi na",
|
|
144
144
|
children: [
|
|
145
145
|
/*#__PURE__*/ (0, $iu0JR$jsx)((0, $iu0JR$Provider), {
|
|
146
146
|
values: [
|
|
@@ -149,9 +149,9 @@ const $e3d0f3db0eb61b92$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $iu0JR$forwa
|
|
|
149
149
|
{
|
|
150
150
|
render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
|
|
151
151
|
slot: 'icon',
|
|
152
|
-
styles: "
|
|
152
|
+
styles: " _ra ic iad -_8sjo0b-Oa"
|
|
153
153
|
}),
|
|
154
|
-
styles: "
|
|
154
|
+
styles: " fuUmpre euUmpre h67logd"
|
|
155
155
|
}
|
|
156
156
|
]
|
|
157
157
|
],
|
|
@@ -159,7 +159,7 @@ const $e3d0f3db0eb61b92$export$b94867ecbd698f21 = /*#__PURE__*/ (0, $iu0JR$forwa
|
|
|
159
159
|
}),
|
|
160
160
|
/*#__PURE__*/ (0, $iu0JR$jsx)((0, $9afd80978c252040$export$f5b8910cec6cf069), {
|
|
161
161
|
ref: inputRef,
|
|
162
|
-
UNSAFE_className: "
|
|
162
|
+
UNSAFE_className: "zc3JFe"
|
|
163
163
|
}),
|
|
164
164
|
!isEmpty && !searchFieldProps.isReadOnly && /*#__PURE__*/ (0, $iu0JR$jsx)((0, $f6a62e6e68437458$export$13ec83e50bf04290), {
|
|
165
165
|
size: props.size
|
|
@@ -40,140 +40,144 @@ $parcel$export(module.exports, "SegmentedControlItem", () => $e33225559d5e019f$e
|
|
|
40
40
|
|
|
41
41
|
const $e33225559d5e019f$export$c083c44d8a07dd35 = /*#__PURE__*/ (0, $4JHQR$react.createContext)(null);
|
|
42
42
|
const $e33225559d5e019f$var$segmentedControl = function anonymous(props, overrides) {
|
|
43
|
-
let rules = "
|
|
44
|
-
let
|
|
45
|
-
|
|
46
|
-
let
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
rules += '
|
|
51
|
-
rules += '
|
|
52
|
-
rules += '
|
|
53
|
-
rules += '
|
|
54
|
-
rules += '
|
|
55
|
-
rules += '
|
|
56
|
-
|
|
43
|
+
let rules = " ";
|
|
44
|
+
let width = false;
|
|
45
|
+
let matches = (overrides || '').matchAll(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I|f|u|_l)[^\s]+/g);
|
|
46
|
+
for (let p of matches){
|
|
47
|
+
if (p[1] === "f") width = true;
|
|
48
|
+
rules += p[0];
|
|
49
|
+
}
|
|
50
|
+
rules += ' ma';
|
|
51
|
+
rules += ' pb';
|
|
52
|
+
rules += ' ke';
|
|
53
|
+
rules += ' ca';
|
|
54
|
+
rules += ' zc';
|
|
55
|
+
rules += ' xc';
|
|
56
|
+
rules += ' wc';
|
|
57
|
+
rules += ' yc';
|
|
58
|
+
if (!width) rules += ' fe';
|
|
57
59
|
return rules;
|
|
58
60
|
};
|
|
59
61
|
const $e33225559d5e019f$var$controlItem = function anonymous(props, overrides) {
|
|
60
|
-
let rules = "
|
|
61
|
-
let
|
|
62
|
-
|
|
63
|
-
let
|
|
64
|
-
let
|
|
65
|
-
let
|
|
66
|
-
let
|
|
67
|
-
let $q = false;
|
|
62
|
+
let rules = " ";
|
|
63
|
+
let position = false;
|
|
64
|
+
let flexGrow = false;
|
|
65
|
+
let flexBasis = false;
|
|
66
|
+
let flexShrink = false;
|
|
67
|
+
let minWidth = false;
|
|
68
|
+
let matches = (overrides || '').matchAll(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I|f|u|_l)[^\s]+/g);
|
|
68
69
|
for (let p of matches){
|
|
69
|
-
if (
|
|
70
|
-
if (
|
|
71
|
-
if (
|
|
72
|
-
if (
|
|
73
|
-
if (
|
|
70
|
+
if (p[1] === "K") position = true;
|
|
71
|
+
if (p[1] === "_H") flexGrow = true;
|
|
72
|
+
if (p[1] === "M") flexBasis = true;
|
|
73
|
+
if (p[1] === "_r") flexShrink = true;
|
|
74
|
+
if (p[1] === "u") minWidth = true;
|
|
75
|
+
rules += p[0];
|
|
74
76
|
}
|
|
75
|
-
if (props.isFocusVisible) rules += '
|
|
76
|
-
else rules += '
|
|
77
|
-
rules += '
|
|
78
|
-
rules += '
|
|
79
|
-
rules += '
|
|
80
|
-
rules += '
|
|
81
|
-
if (
|
|
82
|
-
rules += '
|
|
83
|
-
rules += '
|
|
84
|
-
rules += '
|
|
85
|
-
rules += '
|
|
86
|
-
rules += '
|
|
87
|
-
rules += '
|
|
88
|
-
rules += '
|
|
89
|
-
rules += '
|
|
90
|
-
rules += '
|
|
91
|
-
rules += '
|
|
77
|
+
if (props.isFocusVisible) rules += ' tb';
|
|
78
|
+
else rules += ' ta';
|
|
79
|
+
rules += ' Bb';
|
|
80
|
+
rules += ' Bba';
|
|
81
|
+
rules += ' _ga';
|
|
82
|
+
rules += ' _ya';
|
|
83
|
+
if (!position) rules += ' Ka';
|
|
84
|
+
rules += ' ma';
|
|
85
|
+
rules += ' _0a';
|
|
86
|
+
rules += ' bh';
|
|
87
|
+
rules += ' bdf';
|
|
88
|
+
rules += ' beg';
|
|
89
|
+
rules += ' bfa';
|
|
90
|
+
rules += ' bgb';
|
|
91
|
+
rules += ' bhd';
|
|
92
|
+
rules += ' bje';
|
|
93
|
+
rules += ' bic';
|
|
92
94
|
if (props.size === "XL") {
|
|
93
|
-
rules += '
|
|
94
|
-
rules += '
|
|
95
|
+
rules += ' ah';
|
|
96
|
+
rules += ' aac';
|
|
95
97
|
} else if (props.size === "L") {
|
|
96
|
-
rules += '
|
|
97
|
-
rules += '
|
|
98
|
+
rules += ' ae';
|
|
99
|
+
rules += ' aad';
|
|
98
100
|
} else if (props.size === "S") {
|
|
99
|
-
rules += '
|
|
100
|
-
rules += '
|
|
101
|
+
rules += ' af';
|
|
102
|
+
rules += ' aag';
|
|
101
103
|
} else if (props.size === "XS") {
|
|
102
|
-
rules += '
|
|
103
|
-
rules += '
|
|
104
|
+
rules += ' ai';
|
|
105
|
+
rules += ' aaj';
|
|
104
106
|
} else {
|
|
105
|
-
rules += '
|
|
106
|
-
rules += '
|
|
107
|
+
rules += ' aa';
|
|
108
|
+
rules += ' aab';
|
|
107
109
|
}
|
|
108
|
-
rules += '
|
|
109
|
-
rules += '
|
|
110
|
-
rules += '
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
if (props.isDisabled) rules += ' aj';
|
|
110
|
+
rules += ' Da';
|
|
111
|
+
rules += ' Ea';
|
|
112
|
+
rules += ' Ca';
|
|
113
|
+
rules += ' gb';
|
|
114
|
+
rules += ' gca';
|
|
115
|
+
if (props.isDisabled) rules += ' dc';
|
|
115
116
|
else if (props.isSelected) {
|
|
116
|
-
if (props.isPressed) rules += '
|
|
117
|
-
else if (props.isFocusVisible) rules += '
|
|
118
|
-
else if (props.isHovered) rules += '
|
|
119
|
-
else rules += '
|
|
117
|
+
if (props.isPressed) rules += ' db';
|
|
118
|
+
else if (props.isFocusVisible) rules += ' db';
|
|
119
|
+
else if (props.isHovered) rules += ' db';
|
|
120
|
+
else rules += ' da';
|
|
120
121
|
} else if (props.isHovered) {
|
|
121
|
-
if (props.isPressed) rules += '
|
|
122
|
-
else if (props.isFocusVisible) rules += '
|
|
123
|
-
else if (props.isHovered) rules += '
|
|
124
|
-
else rules += '
|
|
125
|
-
} else rules += '
|
|
126
|
-
rules += '
|
|
127
|
-
rules += '
|
|
128
|
-
rules += '
|
|
129
|
-
rules += '
|
|
130
|
-
rules += '
|
|
131
|
-
rules += '
|
|
132
|
-
|
|
133
|
-
|
|
122
|
+
if (props.isPressed) rules += ' da';
|
|
123
|
+
else if (props.isFocusVisible) rules += ' da';
|
|
124
|
+
else if (props.isHovered) rules += ' da';
|
|
125
|
+
else rules += ' dg';
|
|
126
|
+
} else rules += ' dg';
|
|
127
|
+
if (props.isSelected) rules += ' dbm';
|
|
128
|
+
else if (props.isDisabled) rules += ' dbe';
|
|
129
|
+
else rules += ' dbf';
|
|
130
|
+
rules += ' ob';
|
|
131
|
+
rules += ' ogLWx3bWJpoB';
|
|
132
|
+
rules += ' nb';
|
|
133
|
+
rules += ' ngLWx3bWJpoB';
|
|
134
|
+
rules += ' emLFGYc';
|
|
135
|
+
rules += ' Fa';
|
|
136
|
+
if (props.isJustified) {
|
|
137
|
+
if (!flexGrow) rules += ' _Ha';
|
|
134
138
|
}
|
|
135
|
-
if (
|
|
136
|
-
if (
|
|
139
|
+
if (props.isJustified) {
|
|
140
|
+
if (!flexBasis) rules += ' Ma';
|
|
137
141
|
}
|
|
138
|
-
if (
|
|
139
|
-
if (
|
|
140
|
-
rules += '
|
|
141
|
-
rules += '
|
|
142
|
-
rules += '
|
|
143
|
-
rules += '
|
|
144
|
-
rules += '
|
|
145
|
-
rules += '
|
|
146
|
-
rules += '
|
|
147
|
-
rules += '
|
|
148
|
-
rules += '
|
|
149
|
-
rules += '
|
|
150
|
-
rules += ' -
|
|
151
|
-
rules += ' -
|
|
142
|
+
if (!flexShrink) rules += ' _ra';
|
|
143
|
+
if (!minWidth) rules += ' uf';
|
|
144
|
+
rules += ' _pa';
|
|
145
|
+
rules += ' _za';
|
|
146
|
+
rules += ' _Ga';
|
|
147
|
+
rules += ' _Qa';
|
|
148
|
+
rules += ' cd';
|
|
149
|
+
rules += ' Rb';
|
|
150
|
+
rules += ' zc';
|
|
151
|
+
rules += ' xc';
|
|
152
|
+
rules += ' wc';
|
|
153
|
+
rules += ' yc';
|
|
154
|
+
rules += ' -_8sjo0b-Oa';
|
|
155
|
+
rules += ' -e_-ec';
|
|
152
156
|
return rules;
|
|
153
157
|
};
|
|
154
158
|
const $e33225559d5e019f$var$slider = function anonymous(props) {
|
|
155
|
-
let rules = "
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
rules += '
|
|
159
|
-
rules += '
|
|
160
|
-
rules += '
|
|
161
|
-
rules += '
|
|
162
|
-
rules += '
|
|
163
|
-
rules += '
|
|
164
|
-
rules += '
|
|
165
|
-
rules += '
|
|
166
|
-
rules += '
|
|
167
|
-
rules += '
|
|
168
|
-
rules += '
|
|
169
|
-
if (props.isDisabled) rules += '
|
|
170
|
-
else rules += '
|
|
171
|
-
if (props.isDisabled) rules += '
|
|
172
|
-
else rules += '
|
|
173
|
-
rules += '
|
|
174
|
-
rules += '
|
|
175
|
-
rules += '
|
|
176
|
-
rules += '
|
|
159
|
+
let rules = " ";
|
|
160
|
+
rules += ' cj';
|
|
161
|
+
if (props.isDisabled) rules += ' cbo';
|
|
162
|
+
else rules += ' cbg';
|
|
163
|
+
rules += ' Pa';
|
|
164
|
+
rules += ' fa';
|
|
165
|
+
rules += ' ef';
|
|
166
|
+
rules += ' Kb';
|
|
167
|
+
rules += ' _qa';
|
|
168
|
+
rules += ' Ra';
|
|
169
|
+
rules += ' _nb';
|
|
170
|
+
rules += ' _ma';
|
|
171
|
+
rules += ' _ta';
|
|
172
|
+
rules += ' _sa';
|
|
173
|
+
if (props.isDisabled) rules += ' qb';
|
|
174
|
+
else rules += ' qa';
|
|
175
|
+
if (props.isDisabled) rules += ' qbd';
|
|
176
|
+
else rules += ' qbi';
|
|
177
|
+
rules += ' zd';
|
|
178
|
+
rules += ' xe';
|
|
179
|
+
rules += ' we';
|
|
180
|
+
rules += ' yd';
|
|
177
181
|
return rules;
|
|
178
182
|
};
|
|
179
183
|
const $e33225559d5e019f$var$InternalSegmentedControlContext = /*#__PURE__*/ (0, $4JHQR$react.createContext)({});
|
|
@@ -297,7 +301,7 @@ const $e33225559d5e019f$export$4fc12f2742e8cf3f = /*#__PURE__*/ (0, $4JHQR$react
|
|
|
297
301
|
{
|
|
298
302
|
render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
|
|
299
303
|
slot: 'icon',
|
|
300
|
-
styles: "
|
|
304
|
+
styles: " _Ma _ra"
|
|
301
305
|
})
|
|
302
306
|
}
|
|
303
307
|
],
|
|
@@ -312,7 +316,7 @@ const $e33225559d5e019f$export$4fc12f2742e8cf3f = /*#__PURE__*/ (0, $4JHQR$react
|
|
|
312
316
|
[
|
|
313
317
|
(0, $6367bc87eb7d24ad$exports.TextContext),
|
|
314
318
|
{
|
|
315
|
-
styles: "
|
|
319
|
+
styles: " _Mb _oa _ha _Ta _za"
|
|
316
320
|
}
|
|
317
321
|
]
|
|
318
322
|
],
|
|
@@ -321,7 +325,7 @@ const $e33225559d5e019f$export$4fc12f2742e8cf3f = /*#__PURE__*/ (0, $4JHQR$react
|
|
|
321
325
|
style: (0, $2061c83559b50a66$exports.pressScale)(divRef)({
|
|
322
326
|
isPressed: isPressed
|
|
323
327
|
}),
|
|
324
|
-
className: "
|
|
328
|
+
className: " ma pc pad kb kac _ia _ka _ea Fa uf",
|
|
325
329
|
children: typeof props.children === 'string' ? /*#__PURE__*/ (0, $4JHQR$reactjsxruntime.jsx)((0, $6367bc87eb7d24ad$exports.Text), {
|
|
326
330
|
children: props.children
|
|
327
331
|
}) : props.children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/SegmentedControl.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 {AriaLabelingProps, DOMRef, DOMRefValue, FocusableRef, Key} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, DEFAULT_SLOT, Provider, TextContext as RACTextContext, SlotProps, ToggleButton, ToggleButtonGroup, ToggleButtonRenderProps, ToggleGroupStateContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode, RefObject, useCallback, useContext, useRef} from 'react';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef, useFocusableRef, useMediaQuery} from '@react-spectrum/utils';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface SegmentedControlProps extends AriaLabelingProps, StyleProps, SlotProps {\n /**\n * The content to display in the segmented control.\n */\n children: ReactNode,\n /**\n * Whether the segmented control is disabled.\n */\n isDisabled?: boolean,\n /** Whether the items should divide the container width equally. */\n isJustified?: boolean,\n /** The id of the currently selected item (controlled). */\n selectedKey?: Key | null,\n /** The id of the initial selected item (uncontrolled). */\n defaultSelectedKey?: Key,\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (id: Key) => void\n}\nexport interface SegmentedControlItemProps extends AriaLabelingProps, StyleProps {\n /**\n * The content to display in the segmented control item.\n */\n children: ReactNode,\n /** The id of the item, matching the value used in SegmentedControl's `selectedKey` prop. */\n id: Key,\n /** Whether the item is disabled or not. */\n isDisabled?: boolean\n}\n\nexport const SegmentedControlContext = createContext<ContextValue<Partial<SegmentedControlProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst segmentedControl = style({\n display: 'flex',\n gap: 4,\n backgroundColor: 'gray-100',\n borderRadius: 'default',\n width: 'fit'\n}, getAllowedOverrides());\n\nconst controlItem = style<ToggleButtonRenderProps & {isJustified?: boolean}>({\n ...focusRing(),\n position: 'relative',\n display: 'flex',\n forcedColorAdjust: 'none',\n font: 'control',\n color: {\n default: 'gray-700',\n isHovered: 'neutral-subdued',\n isSelected: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText',\n isSelected: 'HighlightText'\n }\n },\n // TODO: update this padding for icon-only items when we introduce the non-track style back\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]):not(:has([data-rsp-slot=text]))': space(6)\n },\n height: 32,\n alignItems: 'center',\n flexGrow: {\n isJustified: 1\n },\n flexBasis: {\n isJustified: 0\n },\n flexShrink: 0,\n minWidth: 0,\n justifyContent: 'center',\n whiteSpace: 'nowrap',\n disableTapHighlight: true,\n userSelect: 'none',\n backgroundColor: 'transparent',\n borderStyle: 'none',\n borderRadius: 'default',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\nconst slider = style<{isDisabled: boolean}>({\n backgroundColor: {\n default: 'gray-25',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n left: 0,\n width: 'full',\n height: 'full',\n position: 'absolute',\n boxSizing: 'border-box',\n borderStyle: 'solid',\n borderWidth: 2,\n borderColor: {\n default: 'gray-900',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n borderRadius: 'lg'\n});\n\ninterface InternalSegmentedControlContextProps {\n register?: (value: Key, isDisabled?: boolean) => void,\n prevRef?: RefObject<DOMRect | null>,\n currentSelectedRef?: RefObject<HTMLDivElement | null>,\n isJustified?: boolean\n}\n\ninterface DefaultSelectionTrackProps {\n defaultValue?: Key | null,\n value?: Key | null,\n children: ReactNode,\n prevRef: RefObject<DOMRect | null>,\n currentSelectedRef: RefObject<HTMLDivElement | null>,\n isJustified?: boolean\n}\n\nconst InternalSegmentedControlContext = createContext<InternalSegmentedControlContextProps>({});\n\n/**\n * A SegmentedControl is a mutually exclusive group of buttons used for view switching.\n */\nexport const SegmentedControl = /*#__PURE__*/ forwardRef(function SegmentedControl(props: SegmentedControlProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, SegmentedControlContext);\n let {\n defaultSelectedKey,\n selectedKey,\n onSelectionChange\n } = props;\n let domRef = useDOMRef(ref);\n\n let prevRef = useRef<DOMRect>(null);\n let currentSelectedRef = useRef<HTMLDivElement>(null);\n\n let onChange = (values: Set<Key>) => {\n if (currentSelectedRef.current) {\n prevRef.current = currentSelectedRef?.current.getBoundingClientRect();\n }\n\n if (onSelectionChange) {\n let firstKey = values.values().next().value;\n if (firstKey != null) {\n onSelectionChange(firstKey);\n }\n }\n };\n\n return (\n <ToggleButtonGroup\n {...props}\n selectedKeys={selectedKey != null ? [selectedKey] : undefined}\n defaultSelectedKeys={defaultSelectedKey != null ? [defaultSelectedKey] : undefined}\n disallowEmptySelection\n ref={domRef}\n orientation=\"horizontal\"\n style={props.UNSAFE_style}\n onSelectionChange={onChange}\n className={(props.UNSAFE_className || '') + segmentedControl(null, props.styles)}\n aria-label={props['aria-label']}>\n <DefaultSelectionTracker defaultValue={defaultSelectedKey} value={selectedKey} prevRef={prevRef} currentSelectedRef={currentSelectedRef} isJustified={props.isJustified}>\n {props.children}\n </DefaultSelectionTracker>\n </ToggleButtonGroup>\n );\n});\n\nfunction DefaultSelectionTracker(props: DefaultSelectionTrackProps) {\n let state = useContext(ToggleGroupStateContext);\n let isRegistered = useRef(!(props.defaultValue == null && props.value == null));\n\n // default select the first available item\n let register = useCallback((value: Key) => {\n if (state && !isRegistered.current) {\n isRegistered.current = true;\n state.toggleKey(value);\n }\n }, []);\n\n return (\n <Provider\n values={[\n [InternalSegmentedControlContext, {register: register, prevRef: props.prevRef, currentSelectedRef: props.currentSelectedRef, isJustified: props.isJustified}]\n ]}>\n {props.children}\n </Provider>\n );\n}\n\n/**\n * A SegmentedControlItem represents an option within a SegmentedControl.\n */\nexport const SegmentedControlItem = /*#__PURE__*/ forwardRef(function SegmentedControlItem(props: SegmentedControlItemProps, ref: FocusableRef<HTMLButtonElement>) {\n let domRef = useFocusableRef(ref);\n let divRef = useRef<HTMLDivElement>(null);\n let {register, prevRef, currentSelectedRef, isJustified} = useContext(InternalSegmentedControlContext);\n let state = useContext(ToggleGroupStateContext);\n let isSelected = state?.selectedKeys.has(props.id);\n // do not apply animation if a user has the prefers-reduced-motion setting\n let reduceMotion = useMediaQuery('(prefers-reduced-motion: reduce)');\n\n useLayoutEffect(() => {\n register?.(props.id);\n }, []);\n\n useLayoutEffect(() => {\n if (isSelected && prevRef?.current && currentSelectedRef?.current && !reduceMotion) {\n let currentItem = currentSelectedRef?.current.getBoundingClientRect();\n\n let deltaX = prevRef?.current.left - currentItem?.left;\n\n currentSelectedRef.current.animate(\n [\n {transform: `translateX(${deltaX}px)`, width: `${prevRef?.current.width}px`},\n {transform: 'translateX(0px)', width: `${currentItem.width}px`}\n ],\n {\n duration: 200,\n easing: 'ease-out'\n }\n );\n\n prevRef.current = null;\n }\n }, [isSelected, reduceMotion]);\n\n return (\n <ToggleButton\n {...props}\n ref={domRef}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + controlItem({...renderProps, isJustified}, props.styles)} >\n {({isSelected, isPressed, isDisabled}) => (\n <>\n {isSelected && <div className={slider({isDisabled})} ref={currentSelectedRef} />}\n <Provider\n values={[\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0, flexShrink: 0})})\n }],\n [RACTextContext, {slots: {[DEFAULT_SLOT]: {}}}],\n [TextContext, {styles: style({order: 1, truncate: true})}]\n ]}>\n <div ref={divRef} style={pressScale(divRef)({isPressed})} className={style({display: 'flex', gap: 'text-to-visual', transition: 'default', alignItems: 'center', minWidth: 0})}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </div>\n </Provider>\n </>\n )\n }\n </ToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"SegmentedControl.cjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/SegmentedControl.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 {AriaLabelingProps, DOMRef, DOMRefValue, FocusableRef, Key} from '@react-types/shared';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, DEFAULT_SLOT, Provider, TextContext as RACTextContext, SlotProps, ToggleButton, ToggleButtonGroup, ToggleButtonRenderProps, ToggleGroupStateContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode, RefObject, useCallback, useContext, useRef} from 'react';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef, useFocusableRef, useMediaQuery} from '@react-spectrum/utils';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface SegmentedControlProps extends AriaLabelingProps, StyleProps, SlotProps {\n /**\n * The content to display in the segmented control.\n */\n children: ReactNode,\n /**\n * Whether the segmented control is disabled.\n */\n isDisabled?: boolean,\n /** Whether the items should divide the container width equally. */\n isJustified?: boolean,\n /** The id of the currently selected item (controlled). */\n selectedKey?: Key | null,\n /** The id of the initial selected item (uncontrolled). */\n defaultSelectedKey?: Key,\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (id: Key) => void\n}\nexport interface SegmentedControlItemProps extends AriaLabelingProps, StyleProps {\n /**\n * The content to display in the segmented control item.\n */\n children: ReactNode,\n /** The id of the item, matching the value used in SegmentedControl's `selectedKey` prop. */\n id: Key,\n /** Whether the item is disabled or not. */\n isDisabled?: boolean\n}\n\nexport const SegmentedControlContext = createContext<ContextValue<Partial<SegmentedControlProps>, DOMRefValue<HTMLDivElement>>>(null);\n\nconst segmentedControl = style({\n display: 'flex',\n gap: 4,\n backgroundColor: 'gray-100',\n borderRadius: 'default',\n width: 'fit'\n}, getAllowedOverrides());\n\nconst controlItem = style<ToggleButtonRenderProps & {isJustified?: boolean}>({\n ...focusRing(),\n position: 'relative',\n display: 'flex',\n forcedColorAdjust: 'none',\n font: 'control',\n color: {\n default: 'gray-700',\n isHovered: 'neutral-subdued',\n isSelected: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isDisabled: 'GrayText',\n isSelected: 'HighlightText'\n }\n },\n // TODO: update this padding for icon-only items when we introduce the non-track style back\n paddingX: {\n default: 'edge-to-text',\n ':has([slot=icon]):not(:has([data-rsp-slot=text]))': space(6)\n },\n height: 32,\n alignItems: 'center',\n flexGrow: {\n isJustified: 1\n },\n flexBasis: {\n isJustified: 0\n },\n flexShrink: 0,\n minWidth: 0,\n justifyContent: 'center',\n whiteSpace: 'nowrap',\n disableTapHighlight: true,\n userSelect: 'none',\n backgroundColor: 'transparent',\n borderStyle: 'none',\n borderRadius: 'default',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n}, getAllowedOverrides());\n\nconst slider = style<{isDisabled: boolean}>({\n backgroundColor: {\n default: 'gray-25',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n left: 0,\n width: 'full',\n height: 'full',\n position: 'absolute',\n boxSizing: 'border-box',\n borderStyle: 'solid',\n borderWidth: 2,\n borderColor: {\n default: 'gray-900',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n borderRadius: 'lg'\n});\n\ninterface InternalSegmentedControlContextProps {\n register?: (value: Key, isDisabled?: boolean) => void,\n prevRef?: RefObject<DOMRect | null>,\n currentSelectedRef?: RefObject<HTMLDivElement | null>,\n isJustified?: boolean\n}\n\ninterface DefaultSelectionTrackProps {\n defaultValue?: Key | null,\n value?: Key | null,\n children: ReactNode,\n prevRef: RefObject<DOMRect | null>,\n currentSelectedRef: RefObject<HTMLDivElement | null>,\n isJustified?: boolean\n}\n\nconst InternalSegmentedControlContext = createContext<InternalSegmentedControlContextProps>({});\n\n/**\n * A SegmentedControl is a mutually exclusive group of buttons used for view switching.\n */\nexport const SegmentedControl = /*#__PURE__*/ forwardRef(function SegmentedControl(props: SegmentedControlProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, SegmentedControlContext);\n let {\n defaultSelectedKey,\n selectedKey,\n onSelectionChange\n } = props;\n let domRef = useDOMRef(ref);\n\n let prevRef = useRef<DOMRect>(null);\n let currentSelectedRef = useRef<HTMLDivElement>(null);\n\n let onChange = (values: Set<Key>) => {\n if (currentSelectedRef.current) {\n prevRef.current = currentSelectedRef?.current.getBoundingClientRect();\n }\n\n if (onSelectionChange) {\n let firstKey = values.values().next().value;\n if (firstKey != null) {\n onSelectionChange(firstKey);\n }\n }\n };\n\n return (\n <ToggleButtonGroup\n {...props}\n selectedKeys={selectedKey != null ? [selectedKey] : undefined}\n defaultSelectedKeys={defaultSelectedKey != null ? [defaultSelectedKey] : undefined}\n disallowEmptySelection\n ref={domRef}\n orientation=\"horizontal\"\n style={props.UNSAFE_style}\n onSelectionChange={onChange}\n className={(props.UNSAFE_className || '') + segmentedControl(null, props.styles)}\n aria-label={props['aria-label']}>\n <DefaultSelectionTracker defaultValue={defaultSelectedKey} value={selectedKey} prevRef={prevRef} currentSelectedRef={currentSelectedRef} isJustified={props.isJustified}>\n {props.children}\n </DefaultSelectionTracker>\n </ToggleButtonGroup>\n );\n});\n\nfunction DefaultSelectionTracker(props: DefaultSelectionTrackProps) {\n let state = useContext(ToggleGroupStateContext);\n let isRegistered = useRef(!(props.defaultValue == null && props.value == null));\n\n // default select the first available item\n let register = useCallback((value: Key) => {\n if (state && !isRegistered.current) {\n isRegistered.current = true;\n state.toggleKey(value);\n }\n }, []);\n\n return (\n <Provider\n values={[\n [InternalSegmentedControlContext, {register: register, prevRef: props.prevRef, currentSelectedRef: props.currentSelectedRef, isJustified: props.isJustified}]\n ]}>\n {props.children}\n </Provider>\n );\n}\n\n/**\n * A SegmentedControlItem represents an option within a SegmentedControl.\n */\nexport const SegmentedControlItem = /*#__PURE__*/ forwardRef(function SegmentedControlItem(props: SegmentedControlItemProps, ref: FocusableRef<HTMLButtonElement>) {\n let domRef = useFocusableRef(ref);\n let divRef = useRef<HTMLDivElement>(null);\n let {register, prevRef, currentSelectedRef, isJustified} = useContext(InternalSegmentedControlContext);\n let state = useContext(ToggleGroupStateContext);\n let isSelected = state?.selectedKeys.has(props.id);\n // do not apply animation if a user has the prefers-reduced-motion setting\n let reduceMotion = useMediaQuery('(prefers-reduced-motion: reduce)');\n\n useLayoutEffect(() => {\n register?.(props.id);\n }, []);\n\n useLayoutEffect(() => {\n if (isSelected && prevRef?.current && currentSelectedRef?.current && !reduceMotion) {\n let currentItem = currentSelectedRef?.current.getBoundingClientRect();\n\n let deltaX = prevRef?.current.left - currentItem?.left;\n\n currentSelectedRef.current.animate(\n [\n {transform: `translateX(${deltaX}px)`, width: `${prevRef?.current.width}px`},\n {transform: 'translateX(0px)', width: `${currentItem.width}px`}\n ],\n {\n duration: 200,\n easing: 'ease-out'\n }\n );\n\n prevRef.current = null;\n }\n }, [isSelected, reduceMotion]);\n\n return (\n <ToggleButton\n {...props}\n ref={domRef}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + controlItem({...renderProps, isJustified}, props.styles)} >\n {({isSelected, isPressed, isDisabled}) => (\n <>\n {isSelected && <div className={slider({isDisabled})} ref={currentSelectedRef} />}\n <Provider\n values={[\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0, flexShrink: 0})})\n }],\n [RACTextContext, {slots: {[DEFAULT_SLOT]: {}}}],\n [TextContext, {styles: style({order: 1, truncate: true})}]\n ]}>\n <div ref={divRef} style={pressScale(divRef)({isPressed})} className={style({display: 'flex', gap: 'text-to-visual', transition: 'default', alignItems: 'center', minWidth: 0})}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </div>\n </Provider>\n </>\n )\n }\n </ToggleButton>\n );\n});\n"],"names":[],"version":3,"file":"SegmentedControl.cjs.map"}
|