@react-spectrum/s2 1.1.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion.cjs +2 -2
- package/dist/Accordion.css +2 -2
- package/dist/Accordion.mjs +2 -2
- package/dist/ActionBar.cjs +59 -59
- package/dist/ActionBar.css +58 -58
- package/dist/ActionBar.mjs +59 -59
- package/dist/ActionButton.cjs +233 -233
- package/dist/ActionButton.css +160 -160
- package/dist/ActionButton.mjs +233 -233
- package/dist/ActionButtonGroup.cjs +15 -15
- package/dist/ActionButtonGroup.css +9 -9
- package/dist/ActionButtonGroup.mjs +15 -15
- package/dist/Add.cjs +10 -10
- package/dist/Add.css +6 -6
- package/dist/Add.mjs +10 -10
- package/dist/AlertDialog.cjs +3 -3
- package/dist/AlertDialog.css +3 -3
- package/dist/AlertDialog.mjs +3 -3
- package/dist/Asterisk.cjs +6 -6
- package/dist/Asterisk.css +4 -4
- package/dist/Asterisk.mjs +6 -6
- package/dist/Avatar.cjs +16 -16
- package/dist/Avatar.css +16 -16
- package/dist/Avatar.mjs +16 -16
- package/dist/AvatarGroup.cjs +120 -120
- package/dist/AvatarGroup.css +31 -31
- package/dist/AvatarGroup.mjs +120 -120
- package/dist/Badge.cjs +196 -196
- package/dist/Badge.css +125 -125
- package/dist/Badge.mjs +196 -196
- package/dist/Breadcrumbs.cjs +234 -234
- package/dist/Breadcrumbs.css +100 -100
- package/dist/Breadcrumbs.mjs +234 -234
- package/dist/Button.cjs +332 -332
- package/dist/Button.css +174 -174
- package/dist/Button.mjs +332 -332
- package/dist/ButtonGroup.cjs +20 -20
- package/dist/ButtonGroup.css +15 -15
- package/dist/ButtonGroup.mjs +20 -20
- package/dist/Calendar.cjs +168 -168
- package/dist/Calendar.css +134 -134
- package/dist/Calendar.mjs +168 -168
- package/dist/Card.cjs +309 -309
- package/dist/Card.css +206 -206
- package/dist/Card.mjs +309 -309
- package/dist/CardView.cjs +17 -17
- package/dist/CardView.css +17 -17
- package/dist/CardView.mjs +17 -17
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +2 -2
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +161 -161
- package/dist/Checkbox.css +92 -92
- package/dist/Checkbox.mjs +161 -161
- package/dist/CheckboxGroup.cjs +43 -43
- package/dist/CheckboxGroup.css +37 -37
- package/dist/CheckboxGroup.mjs +43 -43
- package/dist/Checkmark.cjs +12 -12
- package/dist/Checkmark.css +8 -8
- package/dist/Checkmark.mjs +12 -12
- package/dist/Chevron.cjs +12 -12
- package/dist/Chevron.css +10 -10
- package/dist/Chevron.mjs +12 -12
- package/dist/ClearButton.cjs +30 -30
- package/dist/ClearButton.css +30 -30
- package/dist/ClearButton.mjs +30 -30
- package/dist/CloseButton.cjs +55 -55
- package/dist/CloseButton.css +47 -47
- package/dist/CloseButton.mjs +55 -55
- package/dist/ColorArea.cjs +16 -16
- package/dist/ColorArea.css +16 -16
- package/dist/ColorArea.mjs +16 -16
- package/dist/ColorField.cjs +31 -31
- package/dist/ColorField.css +27 -27
- package/dist/ColorField.mjs +31 -31
- package/dist/ColorHandle.cjs +27 -27
- package/dist/ColorHandle.css +42 -42
- package/dist/ColorHandle.mjs +27 -27
- package/dist/ColorSlider.cjs +108 -108
- package/dist/ColorSlider.css +52 -52
- package/dist/ColorSlider.mjs +108 -108
- package/dist/ColorSwatch.cjs +29 -29
- package/dist/ColorSwatch.css +29 -29
- package/dist/ColorSwatch.mjs +29 -29
- package/dist/ColorSwatchPicker.cjs +29 -29
- package/dist/ColorSwatchPicker.css +48 -48
- package/dist/ColorSwatchPicker.mjs +29 -29
- package/dist/ColorWheel.cjs +26 -26
- package/dist/ColorWheel.css +17 -17
- package/dist/ColorWheel.mjs +26 -26
- package/dist/ComboBox.cjs +381 -381
- package/dist/ComboBox.cjs.map +1 -1
- package/dist/ComboBox.css +187 -187
- package/dist/ComboBox.css.map +1 -1
- package/dist/ComboBox.mjs +381 -381
- package/dist/ComboBox.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +70 -41
- package/dist/ContextualHelp.cjs.map +1 -1
- package/dist/ContextualHelp.css +71 -71
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +74 -46
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/Cross.cjs +14 -14
- package/dist/Cross.css +10 -10
- package/dist/Cross.mjs +14 -14
- package/dist/CustomDialog.cjs +25 -25
- package/dist/CustomDialog.css +25 -25
- package/dist/CustomDialog.mjs +25 -25
- package/dist/Dash.cjs +10 -10
- package/dist/Dash.css +6 -6
- package/dist/Dash.mjs +10 -10
- package/dist/DateField.cjs +73 -73
- package/dist/DateField.css +77 -77
- package/dist/DateField.mjs +73 -73
- package/dist/DatePicker.cjs +172 -172
- package/dist/DatePicker.css +128 -128
- package/dist/DatePicker.mjs +172 -172
- package/dist/DateRangePicker.cjs +55 -55
- package/dist/DateRangePicker.css +59 -59
- package/dist/DateRangePicker.mjs +55 -55
- package/dist/Dialog.cjs +17 -17
- package/dist/Dialog.css +70 -70
- package/dist/Dialog.mjs +17 -17
- package/dist/Disclosure.cjs +119 -119
- package/dist/Disclosure.css +112 -112
- package/dist/Disclosure.mjs +119 -119
- package/dist/Divider.cjs +25 -25
- package/dist/Divider.css +25 -25
- package/dist/Divider.mjs +25 -25
- package/dist/DropZone.cjs +61 -61
- package/dist/DropZone.css +57 -57
- package/dist/DropZone.mjs +61 -61
- package/dist/Field.cjs +351 -351
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +147 -147
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +351 -351
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +9 -9
- package/dist/Form.css +9 -9
- package/dist/Form.mjs +9 -9
- package/dist/FullscreenDialog.cjs +5 -5
- package/dist/FullscreenDialog.css +78 -78
- package/dist/FullscreenDialog.mjs +5 -5
- package/dist/IllustratedMessage.cjs +228 -228
- package/dist/IllustratedMessage.css +72 -72
- package/dist/IllustratedMessage.mjs +228 -228
- package/dist/Image.cjs +14 -14
- package/dist/Image.css +14 -14
- package/dist/Image.mjs +14 -14
- package/dist/InlineAlert.cjs +100 -100
- package/dist/InlineAlert.css +76 -76
- package/dist/InlineAlert.mjs +100 -100
- package/dist/Link.cjs +49 -49
- package/dist/Link.css +41 -41
- package/dist/Link.mjs +49 -49
- package/dist/LinkOut.cjs +8 -8
- package/dist/LinkOut.css +8 -8
- package/dist/LinkOut.mjs +8 -8
- package/dist/ListView.cjs +777 -0
- package/dist/ListView.cjs.map +1 -0
- package/dist/ListView.css +740 -0
- package/dist/ListView.css.map +1 -0
- package/dist/ListView.mjs +770 -0
- package/dist/ListView.mjs.map +1 -0
- package/dist/Menu.cjs +529 -437
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +234 -190
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +530 -439
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +153 -153
- package/dist/Meter.css +91 -91
- package/dist/Meter.mjs +153 -153
- package/dist/Modal.cjs +66 -66
- package/dist/Modal.css +54 -54
- package/dist/Modal.mjs +66 -66
- package/dist/NotificationBadge.cjs +56 -56
- package/dist/NotificationBadge.css +49 -49
- package/dist/NotificationBadge.mjs +56 -56
- package/dist/NumberField.cjs +114 -114
- package/dist/NumberField.css +99 -99
- package/dist/NumberField.mjs +114 -114
- package/dist/Picker.cjs +336 -284
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +173 -173
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +338 -286
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +87 -87
- package/dist/Popover.css +70 -70
- package/dist/Popover.mjs +87 -87
- package/dist/ProgressBar.cjs +163 -163
- package/dist/ProgressBar.css +99 -99
- package/dist/ProgressBar.mjs +163 -163
- package/dist/ProgressCircle.cjs +31 -31
- package/dist/ProgressCircle.css +24 -24
- package/dist/ProgressCircle.mjs +31 -31
- package/dist/Provider.cjs +11 -11
- package/dist/Provider.css +10 -10
- package/dist/Provider.mjs +11 -11
- package/dist/Radio.cjs +145 -145
- package/dist/Radio.css +78 -78
- package/dist/Radio.mjs +145 -145
- package/dist/RadioGroup.cjs +41 -41
- package/dist/RadioGroup.css +37 -37
- package/dist/RadioGroup.mjs +41 -41
- package/dist/RangeCalendar.cjs +7 -7
- package/dist/RangeCalendar.css +10 -10
- package/dist/RangeCalendar.mjs +7 -7
- package/dist/SearchField.cjs +41 -41
- package/dist/SearchField.css +45 -45
- package/dist/SearchField.mjs +41 -41
- package/dist/SegmentedControl.cjs +178 -178
- package/dist/SegmentedControl.css +123 -123
- package/dist/SegmentedControl.mjs +178 -178
- package/dist/SelectBoxGroup.cjs +142 -142
- package/dist/SelectBoxGroup.css +120 -120
- package/dist/SelectBoxGroup.mjs +142 -142
- package/dist/Slider.cjs +294 -294
- package/dist/Slider.css +154 -154
- package/dist/Slider.mjs +294 -294
- package/dist/StatusLight.cjs +115 -115
- package/dist/StatusLight.css +59 -59
- package/dist/StatusLight.mjs +115 -115
- package/dist/Switch.cjs +154 -154
- package/dist/Switch.css +74 -74
- package/dist/Switch.mjs +154 -154
- package/dist/TableView.cjs +444 -420
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +232 -204
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +446 -422
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +123 -123
- package/dist/Tabs.css +105 -105
- package/dist/Tabs.mjs +123 -123
- package/dist/TabsPicker.cjs +127 -127
- package/dist/TabsPicker.css +108 -108
- package/dist/TabsPicker.mjs +127 -127
- package/dist/TagGroup.cjs +203 -203
- package/dist/TagGroup.css +146 -146
- package/dist/TagGroup.mjs +203 -203
- package/dist/TextField.cjs +58 -58
- package/dist/TextField.css +54 -54
- package/dist/TextField.mjs +58 -58
- package/dist/TimeField.cjs +51 -51
- package/dist/TimeField.css +47 -47
- package/dist/TimeField.mjs +51 -51
- package/dist/Toast.cjs +121 -121
- package/dist/Toast.cjs.map +1 -1
- package/dist/Toast.css +110 -110
- package/dist/Toast.css.map +1 -1
- package/dist/Toast.mjs +122 -122
- package/dist/Toast.mjs.map +1 -1
- package/dist/ToggleButton.cjs +3 -3
- package/dist/ToggleButton.css +12 -12
- package/dist/ToggleButton.mjs +3 -3
- package/dist/Tooltip.cjs +78 -78
- package/dist/Tooltip.css +65 -65
- package/dist/Tooltip.mjs +78 -78
- package/dist/TreeView.cjs +179 -145
- package/dist/TreeView.cjs.map +1 -1
- package/dist/TreeView.css +140 -128
- package/dist/TreeView.css.map +1 -1
- package/dist/TreeView.mjs +179 -145
- package/dist/TreeView.mjs.map +1 -1
- package/dist/ar-AE.cjs +1 -0
- package/dist/ar-AE.cjs.map +1 -1
- package/dist/ar-AE.mjs +1 -0
- package/dist/ar-AE.mjs.map +1 -1
- package/dist/bg-BG.cjs +1 -0
- package/dist/bg-BG.cjs.map +1 -1
- package/dist/bg-BG.mjs +1 -0
- package/dist/bg-BG.mjs.map +1 -1
- package/dist/cs-CZ.cjs +1 -0
- package/dist/cs-CZ.cjs.map +1 -1
- package/dist/cs-CZ.mjs +1 -0
- package/dist/cs-CZ.mjs.map +1 -1
- package/dist/da-DK.cjs +1 -0
- package/dist/da-DK.cjs.map +1 -1
- package/dist/da-DK.mjs +1 -0
- package/dist/da-DK.mjs.map +1 -1
- package/dist/de-DE.cjs +1 -0
- package/dist/de-DE.cjs.map +1 -1
- package/dist/de-DE.mjs +1 -0
- package/dist/de-DE.mjs.map +1 -1
- package/dist/el-GR.cjs +1 -0
- package/dist/el-GR.cjs.map +1 -1
- package/dist/el-GR.mjs +1 -0
- package/dist/el-GR.mjs.map +1 -1
- package/dist/en-US.cjs +1 -0
- package/dist/en-US.cjs.map +1 -1
- package/dist/en-US.mjs +1 -0
- package/dist/en-US.mjs.map +1 -1
- package/dist/es-ES.cjs +1 -0
- package/dist/es-ES.cjs.map +1 -1
- package/dist/es-ES.mjs +1 -0
- package/dist/es-ES.mjs.map +1 -1
- package/dist/et-EE.cjs +1 -0
- package/dist/et-EE.cjs.map +1 -1
- package/dist/et-EE.mjs +1 -0
- package/dist/et-EE.mjs.map +1 -1
- package/dist/fi-FI.cjs +1 -0
- package/dist/fi-FI.cjs.map +1 -1
- package/dist/fi-FI.mjs +1 -0
- package/dist/fi-FI.mjs.map +1 -1
- package/dist/fr-FR.cjs +1 -0
- package/dist/fr-FR.cjs.map +1 -1
- package/dist/fr-FR.mjs +1 -0
- package/dist/fr-FR.mjs.map +1 -1
- package/dist/he-IL.cjs +1 -0
- package/dist/he-IL.cjs.map +1 -1
- package/dist/he-IL.mjs +1 -0
- package/dist/he-IL.mjs.map +1 -1
- package/dist/hr-HR.cjs +1 -0
- package/dist/hr-HR.cjs.map +1 -1
- package/dist/hr-HR.mjs +1 -0
- package/dist/hr-HR.mjs.map +1 -1
- package/dist/hu-HU.cjs +1 -0
- package/dist/hu-HU.cjs.map +1 -1
- package/dist/hu-HU.mjs +1 -0
- package/dist/hu-HU.mjs.map +1 -1
- package/dist/it-IT.cjs +1 -0
- package/dist/it-IT.cjs.map +1 -1
- package/dist/it-IT.mjs +1 -0
- package/dist/it-IT.mjs.map +1 -1
- package/dist/ja-JP.cjs +1 -0
- package/dist/ja-JP.cjs.map +1 -1
- package/dist/ja-JP.mjs +1 -0
- package/dist/ja-JP.mjs.map +1 -1
- package/dist/ko-KR.cjs +1 -0
- package/dist/ko-KR.cjs.map +1 -1
- package/dist/ko-KR.mjs +1 -0
- package/dist/ko-KR.mjs.map +1 -1
- package/dist/lt-LT.cjs +1 -0
- package/dist/lt-LT.cjs.map +1 -1
- package/dist/lt-LT.mjs +1 -0
- package/dist/lt-LT.mjs.map +1 -1
- package/dist/lv-LV.cjs +1 -0
- package/dist/lv-LV.cjs.map +1 -1
- package/dist/lv-LV.mjs +1 -0
- package/dist/lv-LV.mjs.map +1 -1
- package/dist/main.cjs +7 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +5 -3
- package/dist/module.mjs.map +1 -1
- package/dist/nb-NO.cjs +1 -0
- package/dist/nb-NO.cjs.map +1 -1
- package/dist/nb-NO.mjs +1 -0
- package/dist/nb-NO.mjs.map +1 -1
- package/dist/nl-NL.cjs +1 -0
- package/dist/nl-NL.cjs.map +1 -1
- package/dist/nl-NL.mjs +1 -0
- package/dist/nl-NL.mjs.map +1 -1
- package/dist/pl-PL.cjs +1 -0
- package/dist/pl-PL.cjs.map +1 -1
- package/dist/pl-PL.mjs +1 -0
- package/dist/pl-PL.mjs.map +1 -1
- package/dist/pt-BR.cjs +1 -0
- package/dist/pt-BR.cjs.map +1 -1
- package/dist/pt-BR.mjs +1 -0
- package/dist/pt-BR.mjs.map +1 -1
- package/dist/pt-PT.cjs +1 -0
- package/dist/pt-PT.cjs.map +1 -1
- package/dist/pt-PT.mjs +1 -0
- package/dist/pt-PT.mjs.map +1 -1
- package/dist/ro-RO.cjs +1 -0
- package/dist/ro-RO.cjs.map +1 -1
- package/dist/ro-RO.mjs +1 -0
- package/dist/ro-RO.mjs.map +1 -1
- package/dist/ru-RU.cjs +1 -0
- package/dist/ru-RU.cjs.map +1 -1
- package/dist/ru-RU.mjs +1 -0
- package/dist/ru-RU.mjs.map +1 -1
- package/dist/sk-SK.cjs +1 -0
- package/dist/sk-SK.cjs.map +1 -1
- package/dist/sk-SK.mjs +1 -0
- package/dist/sk-SK.mjs.map +1 -1
- package/dist/sl-SI.cjs +1 -0
- package/dist/sl-SI.cjs.map +1 -1
- package/dist/sl-SI.mjs +1 -0
- package/dist/sl-SI.mjs.map +1 -1
- package/dist/sr-SP.cjs +1 -0
- package/dist/sr-SP.cjs.map +1 -1
- package/dist/sr-SP.mjs +1 -0
- package/dist/sr-SP.mjs.map +1 -1
- package/dist/sv-SE.cjs +1 -0
- package/dist/sv-SE.cjs.map +1 -1
- package/dist/sv-SE.mjs +1 -0
- package/dist/sv-SE.mjs.map +1 -1
- package/dist/tr-TR.cjs +1 -0
- package/dist/tr-TR.cjs.map +1 -1
- package/dist/tr-TR.mjs +1 -0
- package/dist/tr-TR.mjs.map +1 -1
- package/dist/types.d.ts +77 -6
- package/dist/types.d.ts.map +1 -1
- package/dist/uk-UA.cjs +1 -0
- package/dist/uk-UA.cjs.map +1 -1
- package/dist/uk-UA.mjs +1 -0
- package/dist/uk-UA.mjs.map +1 -1
- package/dist/zh-CN.cjs +1 -0
- package/dist/zh-CN.cjs.map +1 -1
- package/dist/zh-CN.mjs +1 -0
- package/dist/zh-CN.mjs.map +1 -1
- package/dist/zh-TW.cjs +1 -0
- package/dist/zh-TW.cjs.map +1 -1
- package/dist/zh-TW.mjs +1 -0
- package/dist/zh-TW.mjs.map +1 -1
- package/icons/Icon.cjs +10 -10
- package/icons/Icon.css +9 -9
- package/icons/Icon.mjs +10 -10
- package/icons/Skeleton.cjs +2 -2
- package/icons/Skeleton.css +6 -6
- package/icons/Skeleton.mjs +2 -2
- package/package.json +21 -21
- package/src/ComboBox.tsx +4 -3
- package/src/ContextualHelp.tsx +81 -43
- package/src/Field.tsx +3 -3
- package/src/ListView.tsx +782 -0
- package/src/Menu.tsx +100 -16
- package/src/Picker.tsx +72 -11
- package/src/TableView.tsx +30 -12
- package/src/Toast.tsx +2 -2
- package/src/TreeView.tsx +43 -6
- package/src/index.ts +6 -3
- package/style/__tests__/style-macro.test.js +69 -69
package/dist/Toast.mjs
CHANGED
|
@@ -13,7 +13,7 @@ import "./Toast_module.css";
|
|
|
13
13
|
import $jeXmD$Toast_modulemjs from "./Toast_module.mjs";
|
|
14
14
|
import {jsx as $jeXmD$jsx, jsxs as $jeXmD$jsxs} from "react/jsx-runtime";
|
|
15
15
|
import {createContext as $jeXmD$createContext, useRef as $jeXmD$useRef, useMemo as $jeXmD$useMemo, useEffect as $jeXmD$useEffect, useContext as $jeXmD$useContext} from "react";
|
|
16
|
-
import {filterDOMProps as $jeXmD$filterDOMProps, useEvent as $jeXmD$useEvent, isWebKit as $jeXmD$isWebKit} from "@react-aria/utils";
|
|
16
|
+
import {filterDOMProps as $jeXmD$filterDOMProps, useEvent as $jeXmD$useEvent, getEventTarget as $jeXmD$getEventTarget, isWebKit as $jeXmD$isWebKit} from "@react-aria/utils";
|
|
17
17
|
import {flushSync as $jeXmD$flushSync} from "react-dom";
|
|
18
18
|
import {useModalOverlay as $jeXmD$useModalOverlay, FocusScope as $jeXmD$FocusScope} from "react-aria";
|
|
19
19
|
import {UNSTABLE_ToastQueue as $jeXmD$UNSTABLE_ToastQueue, UNSTABLE_ToastRegion as $jeXmD$UNSTABLE_ToastRegion, UNSTABLE_ToastList as $jeXmD$UNSTABLE_ToastList, UNSTABLE_ToastStateContext as $jeXmD$UNSTABLE_ToastStateContext, UNSTABLE_Toast as $jeXmD$UNSTABLE_Toast, UNSTABLE_ToastContent as $jeXmD$UNSTABLE_ToastContent} from "react-aria-components";
|
|
@@ -115,147 +115,147 @@ const $6e462db325878d1a$export$f1f8569633bbbec4 = {
|
|
|
115
115
|
};
|
|
116
116
|
const $6e462db325878d1a$var$toastRegion = function anonymous(props) {
|
|
117
117
|
let rules = " ";
|
|
118
|
-
if (props.isFocusVisible) rules += '
|
|
119
|
-
else rules += '
|
|
120
|
-
rules += '
|
|
121
|
-
rules += '
|
|
122
|
-
rules += '
|
|
123
|
-
rules += '
|
|
124
|
-
rules += '
|
|
125
|
-
if (props.placement === "bottom") rules += '
|
|
126
|
-
else if (props.placement === "top") rules += '
|
|
127
|
-
rules += '
|
|
128
|
-
rules += '
|
|
129
|
-
rules += '
|
|
130
|
-
rules += '
|
|
118
|
+
if (props.isFocusVisible) rules += ' _Lf12';
|
|
119
|
+
else rules += ' _Le12';
|
|
120
|
+
rules += ' Oh12';
|
|
121
|
+
rules += ' Olc12';
|
|
122
|
+
rules += ' _Mc12';
|
|
123
|
+
rules += ' _Kd12';
|
|
124
|
+
rules += ' sd12';
|
|
125
|
+
if (props.placement === "bottom") rules += ' _tb12';
|
|
126
|
+
else if (props.placement === "top") rules += ' _ta12';
|
|
127
|
+
rules += ' _Pb12';
|
|
128
|
+
rules += ' _Ar12';
|
|
129
|
+
rules += ' _zr12';
|
|
130
|
+
rules += ' ZJ12';
|
|
131
131
|
if (props.placement === "top") {
|
|
132
|
-
if (props.isExpanded) rules += '
|
|
133
|
-
else rules += '
|
|
132
|
+
if (props.isExpanded) rules += ' Wr12';
|
|
133
|
+
else rules += ' Wu12';
|
|
134
134
|
}
|
|
135
135
|
if (props.placement === "bottom") {
|
|
136
|
-
if (props.isExpanded) rules += '
|
|
137
|
-
else rules += '
|
|
136
|
+
if (props.isExpanded) rules += ' _lr12';
|
|
137
|
+
else rules += ' _lu12';
|
|
138
138
|
}
|
|
139
|
-
if (props.align === "end") rules += '
|
|
140
|
-
else if (props.align === "center") rules += '
|
|
141
|
-
else if (props.align === "start") rules += '
|
|
142
|
-
if (props.align === "end") rules += '
|
|
143
|
-
else if (props.align === "center") rules += '
|
|
144
|
-
else if (props.align === "start") rules += '
|
|
145
|
-
rules += '
|
|
146
|
-
rules += '
|
|
147
|
-
rules += '
|
|
148
|
-
rules += '
|
|
149
|
-
rules += '
|
|
150
|
-
rules += '
|
|
139
|
+
if (props.align === "end") rules += ' IM12';
|
|
140
|
+
else if (props.align === "center") rules += ' IM12';
|
|
141
|
+
else if (props.align === "start") rules += ' IC12';
|
|
142
|
+
if (props.align === "end") rules += ' HC12';
|
|
143
|
+
else if (props.align === "center") rules += ' HM12';
|
|
144
|
+
else if (props.align === "start") rules += ' HM12';
|
|
145
|
+
rules += ' _oa12';
|
|
146
|
+
rules += ' Ka12';
|
|
147
|
+
rules += ' oc12';
|
|
148
|
+
rules += ' nc12';
|
|
149
|
+
rules += ' kc12';
|
|
150
|
+
rules += ' jc12';
|
|
151
151
|
return rules;
|
|
152
152
|
};
|
|
153
153
|
const $6e462db325878d1a$var$toastList = function anonymous(props) {
|
|
154
154
|
let rules = " ";
|
|
155
|
-
rules += '
|
|
156
|
-
rules += '
|
|
157
|
-
rules += '
|
|
158
|
-
rules += '
|
|
159
|
-
rules += '
|
|
160
|
-
if (props.placement === "bottom") rules += '
|
|
161
|
-
else if (props.placement === "top") rules += '
|
|
162
|
-
rules += '
|
|
163
|
-
rules += '
|
|
164
|
-
rules += '
|
|
155
|
+
rules += ' _Pc12';
|
|
156
|
+
rules += ' _ub12';
|
|
157
|
+
rules += ' sd12';
|
|
158
|
+
rules += ' Ue12';
|
|
159
|
+
rules += ' qe12';
|
|
160
|
+
if (props.placement === "bottom") rules += ' _tb12';
|
|
161
|
+
else if (props.placement === "top") rules += ' _ta12';
|
|
162
|
+
rules += ' _oa12';
|
|
163
|
+
rules += ' Jy12';
|
|
164
|
+
rules += ' Gy12';
|
|
165
165
|
if (props.isExpanded) {
|
|
166
|
-
if (props.placement === "bottom") rules += '
|
|
167
|
-
else if (props.placement === "top") rules += '
|
|
166
|
+
if (props.placement === "bottom") rules += ' Tt12';
|
|
167
|
+
else if (props.placement === "top") rules += ' Tf12';
|
|
168
168
|
}
|
|
169
169
|
if (props.isExpanded) {
|
|
170
|
-
if (props.placement === "bottom") rules += '
|
|
171
|
-
else if (props.placement === "top") rules += '
|
|
170
|
+
if (props.placement === "bottom") rules += ' Qf12';
|
|
171
|
+
else if (props.placement === "top") rules += ' Qt12';
|
|
172
172
|
}
|
|
173
|
-
if (props.isExpanded) rules += '
|
|
174
|
-
else rules += '
|
|
175
|
-
if (props.isExpanded) rules += '
|
|
176
|
-
else rules += '
|
|
177
|
-
if (props.isExpanded) rules += '
|
|
178
|
-
else rules += '
|
|
179
|
-
if (props.isExpanded) rules += '
|
|
180
|
-
else rules += '
|
|
181
|
-
if (props.isExpanded) rules += '
|
|
182
|
-
if (props.isExpanded) rules += '
|
|
173
|
+
if (props.isExpanded) rules += ' St12';
|
|
174
|
+
else rules += ' Sd12';
|
|
175
|
+
if (props.isExpanded) rules += ' Rt12';
|
|
176
|
+
else rules += ' Rd12';
|
|
177
|
+
if (props.isExpanded) rules += ' Ic12';
|
|
178
|
+
else rules += ' Iy12';
|
|
179
|
+
if (props.isExpanded) rules += ' Hc12';
|
|
180
|
+
else rules += ' Hy12';
|
|
181
|
+
if (props.isExpanded) rules += ' _Na12';
|
|
182
|
+
if (props.isExpanded) rules += ' Pa12';
|
|
183
183
|
return rules;
|
|
184
184
|
};
|
|
185
185
|
const $6e462db325878d1a$var$toastStyle = function anonymous(props) {
|
|
186
186
|
let rules = " ";
|
|
187
|
-
if (props.isFocusVisible) rules += '
|
|
188
|
-
else rules += '
|
|
189
|
-
if (props.isExpanded) rules += '
|
|
190
|
-
else rules += '
|
|
191
|
-
rules += '
|
|
192
|
-
rules += '
|
|
193
|
-
rules += '
|
|
194
|
-
rules += '
|
|
195
|
-
rules += '
|
|
196
|
-
rules += '
|
|
197
|
-
rules += '
|
|
198
|
-
rules += '
|
|
199
|
-
rules += '
|
|
200
|
-
rules += '
|
|
201
|
-
rules += '
|
|
202
|
-
rules += '
|
|
203
|
-
rules += '
|
|
204
|
-
rules += '
|
|
205
|
-
rules += ' -Zn3gsb-
|
|
206
|
-
rules += '
|
|
207
|
-
rules += '
|
|
208
|
-
rules += '
|
|
209
|
-
rules += '
|
|
210
|
-
rules += '
|
|
211
|
-
rules += '
|
|
212
|
-
rules += '
|
|
213
|
-
rules += '
|
|
214
|
-
rules += '
|
|
215
|
-
rules += '
|
|
216
|
-
rules += '
|
|
217
|
-
rules += '
|
|
218
|
-
rules += ' -_6BNtrc-
|
|
219
|
-
rules += '
|
|
220
|
-
rules += '
|
|
221
|
-
rules += '
|
|
222
|
-
rules += '
|
|
223
|
-
rules += '
|
|
224
|
-
rules += '
|
|
225
|
-
if (props.variant === "negative") rules += '
|
|
226
|
-
else if (props.variant === "positive") rules += '
|
|
227
|
-
else if (props.variant === "info") rules += '
|
|
228
|
-
else if (props.variant === "neutral") rules += '
|
|
229
|
-
rules += ' -_8sjo0b-
|
|
230
|
-
if (props.isExpanded) rules += '
|
|
231
|
-
else rules += '
|
|
232
|
-
rules += '
|
|
187
|
+
if (props.isFocusVisible) rules += ' _Lf12';
|
|
188
|
+
else rules += ' _Le12';
|
|
189
|
+
if (props.isExpanded) rules += ' Ok12';
|
|
190
|
+
else rules += ' Oh12';
|
|
191
|
+
rules += ' _Mc12';
|
|
192
|
+
rules += ' _Kd12';
|
|
193
|
+
rules += ' sd12';
|
|
194
|
+
rules += ' Ul12';
|
|
195
|
+
rules += ' ql12';
|
|
196
|
+
rules += ' Sf12';
|
|
197
|
+
rules += ' Rt12';
|
|
198
|
+
rules += ' Te12';
|
|
199
|
+
rules += ' Qe12';
|
|
200
|
+
rules += ' oc12';
|
|
201
|
+
rules += ' nc12';
|
|
202
|
+
rules += ' kc12';
|
|
203
|
+
rules += ' jc12';
|
|
204
|
+
rules += ' Mj12';
|
|
205
|
+
rules += ' -Zn3gsb-L0uB6Qb12';
|
|
206
|
+
rules += ' LksArhc12';
|
|
207
|
+
rules += ' _oa12';
|
|
208
|
+
rules += ' _va12';
|
|
209
|
+
rules += ' uk12';
|
|
210
|
+
rules += ' ucJ9TBTb12';
|
|
211
|
+
rules += ' ud3Euai12';
|
|
212
|
+
rules += ' uea12';
|
|
213
|
+
rules += ' ugb12';
|
|
214
|
+
rules += ' uhd12';
|
|
215
|
+
rules += ' uje12';
|
|
216
|
+
rules += ' u2NhKxcl12';
|
|
217
|
+
rules += ' uic12';
|
|
218
|
+
rules += ' -_6BNtrc-c12';
|
|
219
|
+
rules += ' vx12';
|
|
220
|
+
rules += ' xb12';
|
|
221
|
+
rules += ' _xa12';
|
|
222
|
+
rules += ' _Fd12';
|
|
223
|
+
rules += ' _FnuYUweb12';
|
|
224
|
+
rules += ' px12';
|
|
225
|
+
if (props.variant === "negative") rules += ' gB12';
|
|
226
|
+
else if (props.variant === "positive") rules += ' g112';
|
|
227
|
+
else if (props.variant === "info") rules += ' g212';
|
|
228
|
+
else if (props.variant === "neutral") rules += ' g612';
|
|
229
|
+
rules += ' -_8sjo0b-t5ZbAob12';
|
|
230
|
+
if (props.isExpanded) rules += ' _nd12';
|
|
231
|
+
else rules += ' _nLeasBb12';
|
|
232
|
+
rules += ' _8d12';
|
|
233
233
|
return rules;
|
|
234
234
|
};
|
|
235
235
|
const $6e462db325878d1a$var$toastBody = function anonymous(props) {
|
|
236
236
|
let rules = " ";
|
|
237
|
-
if (props.isSingle) rules += '
|
|
238
|
-
else rules += '
|
|
239
|
-
rules += '
|
|
240
|
-
rules += '
|
|
241
|
-
rules += '
|
|
242
|
-
rules += '
|
|
243
|
-
rules += '
|
|
244
|
-
rules += '
|
|
245
|
-
rules += '
|
|
237
|
+
if (props.isSingle) rules += ' sd12';
|
|
238
|
+
else rules += ' se12';
|
|
239
|
+
rules += ' D4w1sLc12';
|
|
240
|
+
rules += ' CWLL0Xb12';
|
|
241
|
+
rules += ' _ub12';
|
|
242
|
+
rules += ' _wb12';
|
|
243
|
+
rules += ' eb12';
|
|
244
|
+
rules += ' qj12';
|
|
245
|
+
rules += ' Ue12';
|
|
246
246
|
return rules;
|
|
247
247
|
};
|
|
248
|
-
const $6e462db325878d1a$var$toastContent = "
|
|
248
|
+
const $6e462db325878d1a$var$toastContent = " sd12 Ue12 qe12 ea12 zk52g2d12 yk52g2d12 Bk52g2d12 Ak52g2d12 ri12 ZJ12 -nTSCV-LTAEPe12 __ZLTAEPe12 Na12";
|
|
249
249
|
const $6e462db325878d1a$var$controls = function anonymous(props) {
|
|
250
250
|
let rules = " ";
|
|
251
|
-
rules += '
|
|
252
|
-
if (props.isExpanded) rules += '
|
|
253
|
-
else rules += '
|
|
254
|
-
rules += '
|
|
255
|
-
rules += '
|
|
256
|
-
rules += '
|
|
257
|
-
if (props.isExpanded) rules += '
|
|
258
|
-
else rules += '
|
|
251
|
+
rules += ' _pb12';
|
|
252
|
+
if (props.isExpanded) rules += ' sd12';
|
|
253
|
+
else rules += ' sk12';
|
|
254
|
+
rules += ' _Cb12';
|
|
255
|
+
rules += ' Ue12';
|
|
256
|
+
rules += ' qe12';
|
|
257
|
+
if (props.isExpanded) rules += ' _Ib12';
|
|
258
|
+
else rules += ' _Ia12';
|
|
259
259
|
return rules;
|
|
260
260
|
};
|
|
261
261
|
const $6e462db325878d1a$var$ICONS = {
|
|
@@ -332,7 +332,7 @@ function $6e462db325878d1a$export$f2815235e76a62b9(props) {
|
|
|
332
332
|
children: [
|
|
333
333
|
isExpanded && // eslint-disable-next-line
|
|
334
334
|
/*#__PURE__*/ (0, $jeXmD$jsx)("div", {
|
|
335
|
-
className: (0, ($parcel$interopDefault($jeXmD$Toast_modulemjs)))['toast-background'] + "
|
|
335
|
+
className: (0, ($parcel$interopDefault($jeXmD$Toast_modulemjs)))['toast-background'] + " _Pb12 Wr12 _lr12 _Ar12 _zr12 g812",
|
|
336
336
|
onClick: collapse
|
|
337
337
|
}),
|
|
338
338
|
/*#__PURE__*/ (0, $jeXmD$jsx)($6e462db325878d1a$var$SpectrumToastList, {
|
|
@@ -375,7 +375,7 @@ function $6e462db325878d1a$var$SpectrumToastList({ placement: placement, align:
|
|
|
375
375
|
let toastListRef = (0, $jeXmD$useRef)(null);
|
|
376
376
|
(0, $jeXmD$useEvent)(toastListRef, 'click', (e)=>{
|
|
377
377
|
// Have to check if this is a button because stopPropagation in react events doesn't affect native events.
|
|
378
|
-
if (!isExpanded && !e
|
|
378
|
+
if (!isExpanded && !(0, $jeXmD$getEventTarget)(e)?.closest('button')) toggleExpanded();
|
|
379
379
|
});
|
|
380
380
|
return /*#__PURE__*/ (0, $jeXmD$jsx)((0, $jeXmD$UNSTABLE_ToastList), {
|
|
381
381
|
ref: toastListRef,
|
|
@@ -484,7 +484,7 @@ function $6e462db325878d1a$export$f9b1e1c88454fa08(props) {
|
|
|
484
484
|
!isExpanded && visibleToasts.length > 1 && /*#__PURE__*/ (0, $jeXmD$jsxs)((0, $da878a05ab4a403e$export$cfc7921d29ef7b80), {
|
|
485
485
|
isQuiet: true,
|
|
486
486
|
staticColor: "white",
|
|
487
|
-
styles: "
|
|
487
|
+
styles: " zPgKvMe12 yPgKvMe12 BPgKvMe12 APgKvMe12",
|
|
488
488
|
// Make the chevron line up with the toast text, even though there is padding within the button.
|
|
489
489
|
UNSAFE_style: {
|
|
490
490
|
marginInlineStart: variant === 'neutral' ? -10 : 14
|
|
@@ -515,7 +515,7 @@ function $6e462db325878d1a$export$f9b1e1c88454fa08(props) {
|
|
|
515
515
|
if (toast.content.shouldCloseOnAction) state.close(toast.key);
|
|
516
516
|
},
|
|
517
517
|
UNSAFE_className: ctx && isMain ? (0, ($parcel$interopDefault($jeXmD$Toast_modulemjs)))['toast-action'] : undefined,
|
|
518
|
-
styles: "
|
|
518
|
+
styles: " IM12 zzz3eAe12 yzz3eAe12 Bzz3eAe12 Azz3eAe12",
|
|
519
519
|
children: toast.content.actionLabel
|
|
520
520
|
})
|
|
521
521
|
]
|
package/dist/Toast.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Toast.tsx"],"sourcesContent":["/*\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButton} from './ActionButton';\nimport AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {CenterBaseline} from './CenterBaseline';\nimport CheckmarkIcon from '../s2wf-icons/S2_Icon_CheckmarkCircle_20_N.svg';\nimport Chevron from '../s2wf-icons/S2_Icon_ChevronDown_20_N.svg';\nimport {CloseButton} from './CloseButton';\nimport {createContext, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {DOMProps} from '@react-types/shared';\nimport {filterDOMProps, isWebKit, useEvent} from '@react-aria/utils';\nimport {flushSync} from 'react-dom';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {FocusScope, useModalOverlay} from 'react-aria';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ToastOptions as RACToastOptions, UNSTABLE_Toast as Toast, UNSTABLE_ToastContent as ToastContent, UNSTABLE_ToastList as ToastList, ToastProps, UNSTABLE_ToastQueue as ToastQueue, UNSTABLE_ToastRegion as ToastRegion, ToastRegionProps, UNSTABLE_ToastStateContext as ToastStateContext} from 'react-aria-components';\nimport {Text} from './Content';\nimport toastCss from './Toast.module.css';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMediaQuery} from '@react-spectrum/utils';\nimport {useOverlayTriggerState} from 'react-stately';\n\nexport type ToastPlacement = 'top' | 'top end' | 'bottom' | 'bottom end';\nexport interface ToastContainerProps extends Omit<ToastRegionProps<SpectrumToastValue>, 'queue' | 'children' | 'style' | 'className' | 'render'> {\n /**\n * Placement of the toast container on the page.\n * @default \"bottom\"\n */\n placement?: ToastPlacement\n}\n\nexport interface ToastOptions extends Omit<RACToastOptions, 'priority'>, DOMProps {\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nexport interface SpectrumToastValue extends DOMProps {\n /** The content of the toast. */\n children: string,\n /** The variant (i.e. color) of the toast. */\n variant: 'positive' | 'negative' | 'info' | 'neutral',\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nlet globalReduceMotion = false;\nfunction startViewTransition(fn: () => void, type: string) {\n if ('startViewTransition' in document) {\n // Safari doesn't support :active-view-transition-type() yet, so we fall back to a class on the html element.\n document.documentElement.classList.add(toastCss[type]);\n if (globalReduceMotion) {\n document.documentElement.classList.add(toastCss.reduceMotion);\n }\n\n let viewTransition = document.startViewTransition(() => flushSync(fn));\n\n viewTransition.ready.catch(() => {});\n viewTransition.finished.then(() => {\n document.documentElement.classList.remove(toastCss[type], toastCss.reduceMotion);\n });\n } else {\n fn();\n }\n}\n\n// There is a single global toast queue instance for the whole app, initialized lazily.\nlet globalToastQueue: ToastQueue<SpectrumToastValue> | null = null;\nfunction getGlobalToastQueue() {\n if (!globalToastQueue) {\n globalToastQueue = new ToastQueue({\n maxVisibleToasts: Infinity,\n wrapUpdate(fn, action) {\n startViewTransition(fn, `toast-${action}`);\n }\n });\n }\n\n return globalToastQueue;\n}\n\nfunction addToast(children: string, variant: SpectrumToastValue['variant'], options: ToastOptions = {}) {\n let value = {\n children,\n variant,\n actionLabel: options.actionLabel,\n onAction: options.onAction,\n shouldCloseOnAction: options.shouldCloseOnAction,\n ...filterDOMProps(options)\n };\n\n // Minimum time of 5s from https://spectrum.adobe.com/page/toast/#Auto-dismissible\n // Actionable toasts cannot be auto dismissed. That would fail WCAG SC 2.2.1.\n // It is debatable whether non-actionable toasts would also fail.\n let timeout = options.timeout && !options.actionLabel ? Math.max(options.timeout, 5000) : undefined;\n let queue = getGlobalToastQueue();\n let key = queue.add(value, {timeout, onClose: options.onClose});\n return () => queue.close(key);\n}\n\ntype CloseFunction = () => void;\n\nconst SpectrumToastQueue = {\n /** Queues a neutral toast. */\n neutral(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'neutral', options);\n },\n /** Queues a positive toast. */\n positive(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'positive', options);\n },\n /** Queues a negative toast. */\n negative(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'negative', options);\n },\n /** Queues an informational toast. */\n info(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'info', options);\n }\n};\n\nexport {SpectrumToastQueue as ToastQueue};\n\nconst toastRegion = style({\n ...focusRing(),\n display: 'flex',\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n position: 'fixed',\n insetX: 0,\n width: 'fit',\n top: {\n placement: {\n top: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n bottom: {\n placement: {\n bottom: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n marginStart: {\n align: {\n start: 16,\n center: 'auto',\n end: 'auto'\n }\n },\n marginEnd: {\n align: {\n start: 'auto',\n center: 'auto',\n end: 16\n }\n },\n boxSizing: 'border-box',\n maxHeight: 'full',\n borderRadius: 'lg'\n});\n\nconst toastList = style({\n position: 'relative',\n flexGrow: 1,\n display: 'flex',\n gap: 8,\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n boxSizing: 'border-box',\n marginY: 0,\n padding: {\n default: 0,\n // Add padding when expanded to account for focus ring.\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: {\n placement: {\n top: 8,\n bottom: 16\n }\n }\n },\n paddingTop: {\n isExpanded: {\n placement: {\n top: 16,\n bottom: 8\n }\n }\n },\n margin: 0,\n marginX: {\n default: 0,\n // Undo padding for focus ring.\n isExpanded: -8\n },\n overflow: {\n isExpanded: 'auto'\n }\n});\n\nconst toastStyle = style({\n ...focusRing(),\n outlineColor: {\n default: 'focus-ring',\n isExpanded: 'white'\n },\n display: 'flex',\n gap: 16,\n paddingStart: 16,\n paddingEnd: 8,\n paddingY: 12,\n borderRadius: 'lg',\n minHeight: 56,\n '--maxWidth': {\n type: 'maxWidth',\n value: 336\n },\n maxWidth: 'min(var(--maxWidth), 90vw)',\n boxSizing: 'border-box',\n flexShrink: 0,\n font: 'ui',\n color: 'white',\n backgroundColor: {\n variant: {\n neutral: 'neutral-subdued',\n info: 'informative',\n positive: 'positive',\n negative: 'negative'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n boxShadow: {\n default: 'elevated',\n isExpanded: 'none'\n },\n willChange: 'transform'\n});\n\nconst toastBody = style({\n // The top toast in a non-expanded stack has the expand button, so it is rendered as a grid.\n // Otherwise it uses flex so the content can wrap when needed.\n display: {\n default: 'grid',\n isSingle: 'flex'\n },\n gridTemplateColumns: ['auto', '1fr', 'auto'],\n gridTemplateAreas: [\n 'content content content',\n 'expand . action'\n ],\n flexGrow: 1,\n flexWrap: 'wrap',\n alignItems: 'center',\n columnGap: 24,\n rowGap: 8\n});\n\nconst toastContent = style({\n display: 'flex',\n gap: 8,\n alignItems: 'baseline',\n gridArea: 'content',\n cursor: 'default',\n width: 'fit',\n overflowWrap: 'break-word',\n wordBreak: 'break-word',\n minWidth: 0\n});\n\nconst controls = style({\n colorScheme: 'light',\n display: {\n default: 'none',\n isExpanded: 'flex'\n },\n justifyContent: 'end',\n gap: 8,\n opacity: {\n default: 0,\n isExpanded: 1\n }\n});\n\nconst ICONS = {\n info: InfoIcon,\n negative: AlertIcon,\n positive: CheckmarkIcon\n};\n\ninterface ToastContainerContextValue {\n isExpanded: boolean,\n toggleExpanded: () => void\n}\n\nconst ToastContainerContext = createContext<ToastContainerContextValue | null>(null);\n\n/**\n * A ToastContainer renders the queued toasts in an application. It should be placed\n * at the root of the app.\n */\nexport function ToastContainer(props: ToastContainerProps): ReactNode {\n let {\n placement = 'bottom'\n } = props;\n let queue = getGlobalToastQueue();\n let align = 'center';\n [placement, align = 'center'] = placement.split(' ') as any;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let regionRef = useRef<HTMLDivElement | null>(null);\n\n let state = useOverlayTriggerState({});\n let {isOpen: isExpanded, close, toggle} = state;\n let ctx = useMemo(() => ({\n isExpanded,\n toggleExpanded() {\n if (!isExpanded && queue.visibleToasts.length <= 1) {\n return;\n }\n\n startViewTransition(\n () => toggle(),\n isExpanded ? 'toast-collapse' : 'toast-expand'\n );\n }\n }), [isExpanded, toggle, queue]);\n\n // Set the state to collapsed whenever the queue is emptied.\n useEffect(() => {\n return queue.subscribe(() => {\n if (queue.visibleToasts.length === 0 && isExpanded) {\n close();\n }\n });\n }, [queue, isExpanded, close]);\n\n let collapse = () => {\n regionRef.current?.focus();\n ctx.toggleExpanded();\n };\n\n // Prevent scroll, aria hide outside, and contain focus when expanded, since we take over the whole screen.\n // Attach event handler to the ref since ToastRegion doesn't pass through onKeyDown.\n useModalOverlay({}, state, regionRef);\n useEvent(regionRef, 'keydown', isExpanded ? (e) => {\n if (e.key === 'Escape') {\n collapse();\n }\n } : undefined);\n\n let prefersReducedMotion = useMediaQuery('(prefers-reduced-motion)');\n let reduceMotion = props['PRIVATE_forceReducedMotion'] ?? prefersReducedMotion;\n useEffect(() => {\n let oldGlobalReduceMotion = globalReduceMotion;\n globalReduceMotion = reduceMotion;\n return () => {\n globalReduceMotion = oldGlobalReduceMotion;\n };\n }, [reduceMotion]);\n\n return (\n <ToastRegion\n {...props}\n ref={regionRef}\n queue={queue}\n className={renderProps => toastRegion({\n ...renderProps,\n placement,\n align,\n isExpanded\n })}>\n <FocusScope contain={isExpanded}>\n <ToastContainerContext.Provider value={ctx}>\n {isExpanded && (\n // eslint-disable-next-line\n <div\n className={toastCss['toast-background'] + style({position: 'fixed', inset: 0, backgroundColor: 'transparent-black-500'})}\n onClick={collapse} />\n )}\n <SpectrumToastList\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n <div className={toastCss['toast-controls'] + controls({isExpanded})}>\n <ActionButton\n size=\"S\"\n onPress={() => queue.clear()}\n // Default focus ring does not have enough contrast against gray background.\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.clearAll')}\n </ActionButton>\n <ActionButton\n size=\"S\"\n onPress={collapse}\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.collapse')}\n </ActionButton>\n </div>\n </ToastContainerContext.Provider>\n </FocusScope>\n </ToastRegion>\n );\n}\n\nfunction SpectrumToastList({placement, align, reduceMotion}) {\n let {isExpanded, toggleExpanded} = useContext(ToastContainerContext)!;\n\n // Attach click handler to ref since ToastList doesn't pass through onClick/onPress.\n let toastListRef = useRef(null);\n useEvent(toastListRef, 'click', (e) => {\n // Have to check if this is a button because stopPropagation in react events doesn't affect native events.\n if (!isExpanded && !(e.target as Element)?.closest('button')) {\n toggleExpanded();\n }\n });\n\n return (\n <ToastList<SpectrumToastValue>\n ref={toastListRef}\n style={({isHovered}) => {\n let origin = isHovered ? 95 : 55;\n return {\n perspective: 80,\n perspectiveOrigin: 'center ' + (placement === 'top' ? `calc(100% + ${origin}px)` : `${-origin}px`),\n transition: 'perspective-origin 400ms'\n };\n }}\n className={toastCss[isExpanded ? 'toast-list-expanded' : 'toast-list-collapsed'] + toastList({placement, align, isExpanded})}>\n {({toast}) => (\n <SpectrumToast\n toast={toast}\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n )}\n </ToastList>\n );\n}\n\ninterface SpectrumToastProps extends ToastProps<SpectrumToastValue> {\n placement?: 'top' | 'bottom',\n align?: 'start' | 'center' | 'end',\n reduceMotion?: boolean\n}\n\n// Exported locally for stories.\nexport function SpectrumToast(props: SpectrumToastProps): ReactNode {\n let {toast, placement = 'bottom', align = 'center'} = props;\n let variant = toast.content.variant || 'info';\n let Icon = ICONS[variant];\n let state = useContext(ToastStateContext)!;\n let visibleToasts = state.visibleToasts;\n let index = visibleToasts.indexOf(toast);\n let isMain = index <= 0;\n let ctx = useContext(ToastContainerContext);\n let isExpanded = ctx?.isExpanded || false;\n let toastRef = useRef<HTMLDivElement | null>(null);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n\n // When not expanded, use a presentational div for the toasts behind the top one.\n // The content is invisible, all we show is the background color.\n if (!isMain && ctx && !ctx.isExpanded) {\n return (\n <div\n role=\"presentation\"\n style={{\n position: 'absolute',\n [placement === 'top' ? 'bottom' : 'top']: 0,\n left: 0,\n width: '100%',\n translate: `0 0 ${(-12 * index) / 16}rem`,\n // Only 3 toasts are visible in the stack at once, but all toasts are in the DOM.\n // This allows view transitions to smoothly animate them from where they would be\n // in the collapsed stack to their final position in the expanded list.\n opacity: index >= 3 ? 0 : 1,\n zIndex: visibleToasts.length - index - 1,\n // When reduced motion is enabled, use append index to view-transition-name\n // so that adding/removing a toast cross fades instead of transitioning the position.\n // This works because the toasts are seen as separate elements instead of the same one when their index changes.\n viewTransitionName: toast.key + (props.reduceMotion ? '-' + index : ''),\n viewTransitionClass: [toastCss.toast, toastCss['background-toast']].map(c => CSS.escape(c)).join(' ')\n }}\n className={toastCss.toast + toastStyle({variant: toast.content.variant || 'info', index, isExpanded})}\n ref={fixSafariTransform} />\n );\n }\n\n return (\n <Toast\n ref={toastRef}\n toast={toast}\n style={{\n zIndex: visibleToasts.length - index - 1,\n viewTransitionName: toast.key,\n viewTransitionClass: [toastCss.toast, !isMain ? toastCss['background-toast'] : '', toastCss[placement], toastCss[align]].filter(Boolean).map(c => CSS.escape(c)).join(' ')\n }}\n className={renderProps => toastCss.toast + toastStyle({\n ...renderProps,\n variant: toast.content.variant || 'info',\n index,\n isExpanded\n })}>\n <div role=\"presentation\" className={toastBody({isSingle: !isMain || visibleToasts.length <= 1 || isExpanded})}>\n <ToastContent className={toastContent + (ctx && isMain ? ` ${toastCss['toast-content']}` : null)}>\n {Icon &&\n <CenterBaseline>\n <Icon />\n </CenterBaseline>\n }\n <Text slot=\"title\">{toast.content.children}</Text>\n </ToastContent>\n {!isExpanded && visibleToasts.length > 1 &&\n <ActionButton\n isQuiet\n staticColor=\"white\"\n styles={style({gridArea: 'expand'})}\n // Make the chevron line up with the toast text, even though there is padding within the button.\n UNSAFE_style={{marginInlineStart: variant === 'neutral' ? -10 : 14}}\n UNSAFE_className={ctx && isMain ? toastCss['toast-expand'] : undefined}\n onPress={() => {\n // This button disappears when clicked, so move focus to the toast.\n toastRef.current?.focus();\n ctx?.toggleExpanded();\n }}>\n <Text>{stringFormatter.format('toast.showAll')}</Text>\n {/* @ts-ignore */}\n <Chevron UNSAFE_style={{rotate: placement === 'bottom' ? '180deg' : undefined}} />\n </ActionButton>\n }\n {toast.content.actionLabel &&\n <Button\n variant=\"secondary\"\n fillStyle=\"outline\"\n staticColor=\"white\"\n onPress={() => {\n toast.content.onAction?.();\n if (toast.content.shouldCloseOnAction) {\n state.close(toast.key);\n }\n }}\n UNSAFE_className={ctx && isMain ? toastCss['toast-action'] : undefined}\n styles={style({marginStart: 'auto', gridArea: 'action'})}>\n {toast.content.actionLabel}\n </Button>\n }\n </div>\n <CloseButton\n staticColor=\"white\"\n UNSAFE_className={ctx && isMain ? toastCss['toast-close'] : undefined} />\n </Toast>\n );\n}\n\nfunction fixSafariTransform(el: HTMLDivElement | null) {\n // Safari has a bug where the toasts display in the wrong position (CSS transform is not applied correctly).\n // Work around this by removing it, forcing a reflow, and re-applying.\n if (el && isWebKit()) {\n let translate = el.style.translate;\n el.style.translate = '';\n el.offsetHeight;\n el.style.translate = translate;\n }\n}\n"],"names":[],"version":3,"file":"Toast.mjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Toast.tsx"],"sourcesContent":["/*\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButton} from './ActionButton';\nimport AlertIcon from '../s2wf-icons/S2_Icon_AlertTriangle_20_N.svg';\nimport {Button} from './Button';\nimport {CenterBaseline} from './CenterBaseline';\nimport CheckmarkIcon from '../s2wf-icons/S2_Icon_CheckmarkCircle_20_N.svg';\nimport Chevron from '../s2wf-icons/S2_Icon_ChevronDown_20_N.svg';\nimport {CloseButton} from './CloseButton';\nimport {createContext, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {DOMProps} from '@react-types/shared';\nimport {filterDOMProps, getEventTarget, isWebKit, useEvent} from '@react-aria/utils';\nimport {flushSync} from 'react-dom';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {FocusScope, useModalOverlay} from 'react-aria';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ToastOptions as RACToastOptions, UNSTABLE_Toast as Toast, UNSTABLE_ToastContent as ToastContent, UNSTABLE_ToastList as ToastList, ToastProps, UNSTABLE_ToastQueue as ToastQueue, UNSTABLE_ToastRegion as ToastRegion, ToastRegionProps, UNSTABLE_ToastStateContext as ToastStateContext} from 'react-aria-components';\nimport {Text} from './Content';\nimport toastCss from './Toast.module.css';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useMediaQuery} from '@react-spectrum/utils';\nimport {useOverlayTriggerState} from 'react-stately';\n\nexport type ToastPlacement = 'top' | 'top end' | 'bottom' | 'bottom end';\nexport interface ToastContainerProps extends Omit<ToastRegionProps<SpectrumToastValue>, 'queue' | 'children' | 'style' | 'className' | 'render'> {\n /**\n * Placement of the toast container on the page.\n * @default \"bottom\"\n */\n placement?: ToastPlacement\n}\n\nexport interface ToastOptions extends Omit<RACToastOptions, 'priority'>, DOMProps {\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nexport interface SpectrumToastValue extends DOMProps {\n /** The content of the toast. */\n children: string,\n /** The variant (i.e. color) of the toast. */\n variant: 'positive' | 'negative' | 'info' | 'neutral',\n /** A label for the action button within the toast. */\n actionLabel?: string,\n /** Handler that is called when the action button is pressed. */\n onAction?: () => void,\n /** Whether the toast should automatically close when an action is performed. */\n shouldCloseOnAction?: boolean\n}\n\nlet globalReduceMotion = false;\nfunction startViewTransition(fn: () => void, type: string) {\n if ('startViewTransition' in document) {\n // Safari doesn't support :active-view-transition-type() yet, so we fall back to a class on the html element.\n document.documentElement.classList.add(toastCss[type]);\n if (globalReduceMotion) {\n document.documentElement.classList.add(toastCss.reduceMotion);\n }\n\n let viewTransition = document.startViewTransition(() => flushSync(fn));\n\n viewTransition.ready.catch(() => {});\n viewTransition.finished.then(() => {\n document.documentElement.classList.remove(toastCss[type], toastCss.reduceMotion);\n });\n } else {\n fn();\n }\n}\n\n// There is a single global toast queue instance for the whole app, initialized lazily.\nlet globalToastQueue: ToastQueue<SpectrumToastValue> | null = null;\nfunction getGlobalToastQueue() {\n if (!globalToastQueue) {\n globalToastQueue = new ToastQueue({\n maxVisibleToasts: Infinity,\n wrapUpdate(fn, action) {\n startViewTransition(fn, `toast-${action}`);\n }\n });\n }\n\n return globalToastQueue;\n}\n\nfunction addToast(children: string, variant: SpectrumToastValue['variant'], options: ToastOptions = {}) {\n let value = {\n children,\n variant,\n actionLabel: options.actionLabel,\n onAction: options.onAction,\n shouldCloseOnAction: options.shouldCloseOnAction,\n ...filterDOMProps(options)\n };\n\n // Minimum time of 5s from https://spectrum.adobe.com/page/toast/#Auto-dismissible\n // Actionable toasts cannot be auto dismissed. That would fail WCAG SC 2.2.1.\n // It is debatable whether non-actionable toasts would also fail.\n let timeout = options.timeout && !options.actionLabel ? Math.max(options.timeout, 5000) : undefined;\n let queue = getGlobalToastQueue();\n let key = queue.add(value, {timeout, onClose: options.onClose});\n return () => queue.close(key);\n}\n\ntype CloseFunction = () => void;\n\nconst SpectrumToastQueue = {\n /** Queues a neutral toast. */\n neutral(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'neutral', options);\n },\n /** Queues a positive toast. */\n positive(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'positive', options);\n },\n /** Queues a negative toast. */\n negative(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'negative', options);\n },\n /** Queues an informational toast. */\n info(children: string, options: ToastOptions = {}): CloseFunction {\n return addToast(children, 'info', options);\n }\n};\n\nexport {SpectrumToastQueue as ToastQueue};\n\nconst toastRegion = style({\n ...focusRing(),\n display: 'flex',\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n position: 'fixed',\n insetX: 0,\n width: 'fit',\n top: {\n placement: {\n top: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n bottom: {\n placement: {\n bottom: {\n default: 16,\n isExpanded: 0\n }\n }\n },\n marginStart: {\n align: {\n start: 16,\n center: 'auto',\n end: 'auto'\n }\n },\n marginEnd: {\n align: {\n start: 'auto',\n center: 'auto',\n end: 16\n }\n },\n boxSizing: 'border-box',\n maxHeight: 'full',\n borderRadius: 'lg'\n});\n\nconst toastList = style({\n position: 'relative',\n flexGrow: 1,\n display: 'flex',\n gap: 8,\n flexDirection: {\n placement: {\n top: 'column',\n bottom: 'column-reverse'\n }\n },\n boxSizing: 'border-box',\n marginY: 0,\n padding: {\n default: 0,\n // Add padding when expanded to account for focus ring.\n isExpanded: 8\n },\n paddingBottom: {\n isExpanded: {\n placement: {\n top: 8,\n bottom: 16\n }\n }\n },\n paddingTop: {\n isExpanded: {\n placement: {\n top: 16,\n bottom: 8\n }\n }\n },\n margin: 0,\n marginX: {\n default: 0,\n // Undo padding for focus ring.\n isExpanded: -8\n },\n overflow: {\n isExpanded: 'auto'\n }\n});\n\nconst toastStyle = style({\n ...focusRing(),\n outlineColor: {\n default: 'focus-ring',\n isExpanded: 'white'\n },\n display: 'flex',\n gap: 16,\n paddingStart: 16,\n paddingEnd: 8,\n paddingY: 12,\n borderRadius: 'lg',\n minHeight: 56,\n '--maxWidth': {\n type: 'maxWidth',\n value: 336\n },\n maxWidth: 'min(var(--maxWidth), 90vw)',\n boxSizing: 'border-box',\n flexShrink: 0,\n font: 'ui',\n color: 'white',\n backgroundColor: {\n variant: {\n neutral: 'neutral-subdued',\n info: 'informative',\n positive: 'positive',\n negative: 'negative'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n },\n boxShadow: {\n default: 'elevated',\n isExpanded: 'none'\n },\n willChange: 'transform'\n});\n\nconst toastBody = style({\n // The top toast in a non-expanded stack has the expand button, so it is rendered as a grid.\n // Otherwise it uses flex so the content can wrap when needed.\n display: {\n default: 'grid',\n isSingle: 'flex'\n },\n gridTemplateColumns: ['auto', '1fr', 'auto'],\n gridTemplateAreas: [\n 'content content content',\n 'expand . action'\n ],\n flexGrow: 1,\n flexWrap: 'wrap',\n alignItems: 'center',\n columnGap: 24,\n rowGap: 8\n});\n\nconst toastContent = style({\n display: 'flex',\n gap: 8,\n alignItems: 'baseline',\n gridArea: 'content',\n cursor: 'default',\n width: 'fit',\n overflowWrap: 'break-word',\n wordBreak: 'break-word',\n minWidth: 0\n});\n\nconst controls = style({\n colorScheme: 'light',\n display: {\n default: 'none',\n isExpanded: 'flex'\n },\n justifyContent: 'end',\n gap: 8,\n opacity: {\n default: 0,\n isExpanded: 1\n }\n});\n\nconst ICONS = {\n info: InfoIcon,\n negative: AlertIcon,\n positive: CheckmarkIcon\n};\n\ninterface ToastContainerContextValue {\n isExpanded: boolean,\n toggleExpanded: () => void\n}\n\nconst ToastContainerContext = createContext<ToastContainerContextValue | null>(null);\n\n/**\n * A ToastContainer renders the queued toasts in an application. It should be placed\n * at the root of the app.\n */\nexport function ToastContainer(props: ToastContainerProps): ReactNode {\n let {\n placement = 'bottom'\n } = props;\n let queue = getGlobalToastQueue();\n let align = 'center';\n [placement, align = 'center'] = placement.split(' ') as any;\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let regionRef = useRef<HTMLDivElement | null>(null);\n\n let state = useOverlayTriggerState({});\n let {isOpen: isExpanded, close, toggle} = state;\n let ctx = useMemo(() => ({\n isExpanded,\n toggleExpanded() {\n if (!isExpanded && queue.visibleToasts.length <= 1) {\n return;\n }\n\n startViewTransition(\n () => toggle(),\n isExpanded ? 'toast-collapse' : 'toast-expand'\n );\n }\n }), [isExpanded, toggle, queue]);\n\n // Set the state to collapsed whenever the queue is emptied.\n useEffect(() => {\n return queue.subscribe(() => {\n if (queue.visibleToasts.length === 0 && isExpanded) {\n close();\n }\n });\n }, [queue, isExpanded, close]);\n\n let collapse = () => {\n regionRef.current?.focus();\n ctx.toggleExpanded();\n };\n\n // Prevent scroll, aria hide outside, and contain focus when expanded, since we take over the whole screen.\n // Attach event handler to the ref since ToastRegion doesn't pass through onKeyDown.\n useModalOverlay({}, state, regionRef);\n useEvent(regionRef, 'keydown', isExpanded ? (e) => {\n if (e.key === 'Escape') {\n collapse();\n }\n } : undefined);\n\n let prefersReducedMotion = useMediaQuery('(prefers-reduced-motion)');\n let reduceMotion = props['PRIVATE_forceReducedMotion'] ?? prefersReducedMotion;\n useEffect(() => {\n let oldGlobalReduceMotion = globalReduceMotion;\n globalReduceMotion = reduceMotion;\n return () => {\n globalReduceMotion = oldGlobalReduceMotion;\n };\n }, [reduceMotion]);\n\n return (\n <ToastRegion\n {...props}\n ref={regionRef}\n queue={queue}\n className={renderProps => toastRegion({\n ...renderProps,\n placement,\n align,\n isExpanded\n })}>\n <FocusScope contain={isExpanded}>\n <ToastContainerContext.Provider value={ctx}>\n {isExpanded && (\n // eslint-disable-next-line\n <div\n className={toastCss['toast-background'] + style({position: 'fixed', inset: 0, backgroundColor: 'transparent-black-500'})}\n onClick={collapse} />\n )}\n <SpectrumToastList\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n <div className={toastCss['toast-controls'] + controls({isExpanded})}>\n <ActionButton\n size=\"S\"\n onPress={() => queue.clear()}\n // Default focus ring does not have enough contrast against gray background.\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.clearAll')}\n </ActionButton>\n <ActionButton\n size=\"S\"\n onPress={collapse}\n UNSAFE_style={{outlineColor: 'white'}}>\n {stringFormatter.format('toast.collapse')}\n </ActionButton>\n </div>\n </ToastContainerContext.Provider>\n </FocusScope>\n </ToastRegion>\n );\n}\n\nfunction SpectrumToastList({placement, align, reduceMotion}) {\n let {isExpanded, toggleExpanded} = useContext(ToastContainerContext)!;\n\n // Attach click handler to ref since ToastList doesn't pass through onClick/onPress.\n let toastListRef = useRef(null);\n useEvent(toastListRef, 'click', (e) => {\n // Have to check if this is a button because stopPropagation in react events doesn't affect native events.\n if (!isExpanded && !(getEventTarget(e) as Element)?.closest('button')) {\n toggleExpanded();\n }\n });\n\n return (\n <ToastList<SpectrumToastValue>\n ref={toastListRef}\n style={({isHovered}) => {\n let origin = isHovered ? 95 : 55;\n return {\n perspective: 80,\n perspectiveOrigin: 'center ' + (placement === 'top' ? `calc(100% + ${origin}px)` : `${-origin}px`),\n transition: 'perspective-origin 400ms'\n };\n }}\n className={toastCss[isExpanded ? 'toast-list-expanded' : 'toast-list-collapsed'] + toastList({placement, align, isExpanded})}>\n {({toast}) => (\n <SpectrumToast\n toast={toast}\n placement={placement}\n align={align}\n reduceMotion={reduceMotion} />\n )}\n </ToastList>\n );\n}\n\ninterface SpectrumToastProps extends ToastProps<SpectrumToastValue> {\n placement?: 'top' | 'bottom',\n align?: 'start' | 'center' | 'end',\n reduceMotion?: boolean\n}\n\n// Exported locally for stories.\nexport function SpectrumToast(props: SpectrumToastProps): ReactNode {\n let {toast, placement = 'bottom', align = 'center'} = props;\n let variant = toast.content.variant || 'info';\n let Icon = ICONS[variant];\n let state = useContext(ToastStateContext)!;\n let visibleToasts = state.visibleToasts;\n let index = visibleToasts.indexOf(toast);\n let isMain = index <= 0;\n let ctx = useContext(ToastContainerContext);\n let isExpanded = ctx?.isExpanded || false;\n let toastRef = useRef<HTMLDivElement | null>(null);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n\n // When not expanded, use a presentational div for the toasts behind the top one.\n // The content is invisible, all we show is the background color.\n if (!isMain && ctx && !ctx.isExpanded) {\n return (\n <div\n role=\"presentation\"\n style={{\n position: 'absolute',\n [placement === 'top' ? 'bottom' : 'top']: 0,\n left: 0,\n width: '100%',\n translate: `0 0 ${(-12 * index) / 16}rem`,\n // Only 3 toasts are visible in the stack at once, but all toasts are in the DOM.\n // This allows view transitions to smoothly animate them from where they would be\n // in the collapsed stack to their final position in the expanded list.\n opacity: index >= 3 ? 0 : 1,\n zIndex: visibleToasts.length - index - 1,\n // When reduced motion is enabled, use append index to view-transition-name\n // so that adding/removing a toast cross fades instead of transitioning the position.\n // This works because the toasts are seen as separate elements instead of the same one when their index changes.\n viewTransitionName: toast.key + (props.reduceMotion ? '-' + index : ''),\n viewTransitionClass: [toastCss.toast, toastCss['background-toast']].map(c => CSS.escape(c)).join(' ')\n }}\n className={toastCss.toast + toastStyle({variant: toast.content.variant || 'info', index, isExpanded})}\n ref={fixSafariTransform} />\n );\n }\n\n return (\n <Toast\n ref={toastRef}\n toast={toast}\n style={{\n zIndex: visibleToasts.length - index - 1,\n viewTransitionName: toast.key,\n viewTransitionClass: [toastCss.toast, !isMain ? toastCss['background-toast'] : '', toastCss[placement], toastCss[align]].filter(Boolean).map(c => CSS.escape(c)).join(' ')\n }}\n className={renderProps => toastCss.toast + toastStyle({\n ...renderProps,\n variant: toast.content.variant || 'info',\n index,\n isExpanded\n })}>\n <div role=\"presentation\" className={toastBody({isSingle: !isMain || visibleToasts.length <= 1 || isExpanded})}>\n <ToastContent className={toastContent + (ctx && isMain ? ` ${toastCss['toast-content']}` : null)}>\n {Icon &&\n <CenterBaseline>\n <Icon />\n </CenterBaseline>\n }\n <Text slot=\"title\">{toast.content.children}</Text>\n </ToastContent>\n {!isExpanded && visibleToasts.length > 1 &&\n <ActionButton\n isQuiet\n staticColor=\"white\"\n styles={style({gridArea: 'expand'})}\n // Make the chevron line up with the toast text, even though there is padding within the button.\n UNSAFE_style={{marginInlineStart: variant === 'neutral' ? -10 : 14}}\n UNSAFE_className={ctx && isMain ? toastCss['toast-expand'] : undefined}\n onPress={() => {\n // This button disappears when clicked, so move focus to the toast.\n toastRef.current?.focus();\n ctx?.toggleExpanded();\n }}>\n <Text>{stringFormatter.format('toast.showAll')}</Text>\n {/* @ts-ignore */}\n <Chevron UNSAFE_style={{rotate: placement === 'bottom' ? '180deg' : undefined}} />\n </ActionButton>\n }\n {toast.content.actionLabel &&\n <Button\n variant=\"secondary\"\n fillStyle=\"outline\"\n staticColor=\"white\"\n onPress={() => {\n toast.content.onAction?.();\n if (toast.content.shouldCloseOnAction) {\n state.close(toast.key);\n }\n }}\n UNSAFE_className={ctx && isMain ? toastCss['toast-action'] : undefined}\n styles={style({marginStart: 'auto', gridArea: 'action'})}>\n {toast.content.actionLabel}\n </Button>\n }\n </div>\n <CloseButton\n staticColor=\"white\"\n UNSAFE_className={ctx && isMain ? toastCss['toast-close'] : undefined} />\n </Toast>\n );\n}\n\nfunction fixSafariTransform(el: HTMLDivElement | null) {\n // Safari has a bug where the toasts display in the wrong position (CSS transform is not applied correctly).\n // Work around this by removing it, forcing a reflow, and re-applying.\n if (el && isWebKit()) {\n let translate = el.style.translate;\n el.style.translate = '';\n el.offsetHeight;\n el.style.translate = translate;\n }\n}\n"],"names":[],"version":3,"file":"Toast.mjs.map"}
|
package/dist/ToggleButton.cjs
CHANGED
|
@@ -78,7 +78,7 @@ const $d16e5203405a91b7$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $kyLWK$react
|
|
|
78
78
|
[
|
|
79
79
|
(0, $6367bc87eb7d24ad$exports.TextContext),
|
|
80
80
|
{
|
|
81
|
-
styles: "
|
|
81
|
+
styles: " TAzEcG12 QAzEcG12 _Jb12 _Nc12 Pc12 _Yb12 _7c12"
|
|
82
82
|
}
|
|
83
83
|
],
|
|
84
84
|
[
|
|
@@ -86,9 +86,9 @@ const $d16e5203405a91b7$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $kyLWK$react
|
|
|
86
86
|
{
|
|
87
87
|
render: (0, $e991cbcdf82ced71$exports.centerBaseline)({
|
|
88
88
|
slot: 'icon',
|
|
89
|
-
styles: "
|
|
89
|
+
styles: " _Ja12"
|
|
90
90
|
}),
|
|
91
|
-
styles: "
|
|
91
|
+
styles: " ZuUmpre12 FuUmpre12 I67logd12 _va12"
|
|
92
92
|
}
|
|
93
93
|
]
|
|
94
94
|
],
|
package/dist/ToggleButton.css
CHANGED
|
@@ -1,49 +1,49 @@
|
|
|
1
1
|
@layer _.a {
|
|
2
|
-
.
|
|
2
|
+
.TAzEcG12 {
|
|
3
3
|
padding-top: var(--labelPadding);
|
|
4
4
|
}
|
|
5
5
|
|
|
6
|
-
.
|
|
6
|
+
.QAzEcG12 {
|
|
7
7
|
padding-bottom: var(--labelPadding);
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
-
.
|
|
10
|
+
._Jb12 {
|
|
11
11
|
order: 1;
|
|
12
12
|
}
|
|
13
13
|
|
|
14
|
-
.
|
|
14
|
+
._Nc12 {
|
|
15
15
|
overflow-x: hidden;
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
.
|
|
18
|
+
.Pc12 {
|
|
19
19
|
overflow-y: hidden;
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
.
|
|
22
|
+
._Yb12 {
|
|
23
23
|
text-overflow: ellipsis;
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
.
|
|
26
|
+
._7c12 {
|
|
27
27
|
white-space: nowrap;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
.
|
|
30
|
+
._Ja12 {
|
|
31
31
|
order: 0;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
-
.
|
|
34
|
+
.ZuUmpre12 {
|
|
35
35
|
width: 1.42857em;
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
-
.
|
|
38
|
+
.FuUmpre12 {
|
|
39
39
|
height: 1.42857em;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
-
.
|
|
42
|
+
.I67logd12 {
|
|
43
43
|
margin-inline-start: var(--iconMargin);
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
.
|
|
46
|
+
._va12 {
|
|
47
47
|
flex-shrink: 0;
|
|
48
48
|
}
|
|
49
49
|
}
|
package/dist/ToggleButton.mjs
CHANGED
|
@@ -71,7 +71,7 @@ const $fe4c9df7420c3c9f$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $fpet3$forwa
|
|
|
71
71
|
[
|
|
72
72
|
(0, $8e847109a6ab556d$export$9afb8bc826b033ea),
|
|
73
73
|
{
|
|
74
|
-
styles: "
|
|
74
|
+
styles: " TAzEcG12 QAzEcG12 _Jb12 _Nc12 Pc12 _Yb12 _7c12"
|
|
75
75
|
}
|
|
76
76
|
],
|
|
77
77
|
[
|
|
@@ -79,9 +79,9 @@ const $fe4c9df7420c3c9f$export$d2b052e7b4be1756 = /*#__PURE__*/ (0, $fpet3$forwa
|
|
|
79
79
|
{
|
|
80
80
|
render: (0, $1f4b04be3f24aae3$export$9d7e2342a7e53afa)({
|
|
81
81
|
slot: 'icon',
|
|
82
|
-
styles: "
|
|
82
|
+
styles: " _Ja12"
|
|
83
83
|
}),
|
|
84
|
-
styles: "
|
|
84
|
+
styles: " ZuUmpre12 FuUmpre12 I67logd12 _va12"
|
|
85
85
|
}
|
|
86
86
|
]
|
|
87
87
|
],
|