@fluentui/react-toast 9.0.0 → 9.0.2
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/CHANGELOG.json +43 -7
- package/CHANGELOG.md +27 -8
- package/lib/components/Toaster/useToaster.js +23 -18
- package/lib/components/Toaster/useToaster.js.map +1 -1
- package/lib-commonjs/components/Toaster/useToaster.js +22 -17
- package/lib-commonjs/components/Toaster/useToaster.js.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,43 @@
|
|
|
2
2
|
"name": "@fluentui/react-toast",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "Mon, 03 Jul 2023
|
|
5
|
+
"date": "Mon, 03 Jul 2023 20:42:52 GMT",
|
|
6
|
+
"tag": "@fluentui/react-toast_v9.0.2",
|
|
7
|
+
"version": "9.0.2",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "lingfan.gao@microsoft.com",
|
|
12
|
+
"package": "@fluentui/react-toast",
|
|
13
|
+
"commit": "7b6bd85a2edbc0b9257fe300062d657a4c256844",
|
|
14
|
+
"comment": "fix: Toaster should play toasts on action dismiss"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Mon, 03 Jul 2023 13:34:28 GMT",
|
|
21
|
+
"tag": "@fluentui/react-toast_v9.0.1",
|
|
22
|
+
"version": "9.0.1",
|
|
23
|
+
"comments": {
|
|
24
|
+
"patch": [
|
|
25
|
+
{
|
|
26
|
+
"author": "beachball",
|
|
27
|
+
"package": "@fluentui/react-toast",
|
|
28
|
+
"comment": "Bump @fluentui/react-portal to v9.3.1",
|
|
29
|
+
"commit": "d2c95969c67521ea1df57e1339f8743b09b68772"
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
"author": "beachball",
|
|
33
|
+
"package": "@fluentui/react-toast",
|
|
34
|
+
"comment": "Bump @fluentui/react-tabster to v9.10.0",
|
|
35
|
+
"commit": "d2c95969c67521ea1df57e1339f8743b09b68772"
|
|
36
|
+
}
|
|
37
|
+
]
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"date": "Mon, 03 Jul 2023 11:57:13 GMT",
|
|
6
42
|
"tag": "@fluentui/react-toast_v9.0.0",
|
|
7
43
|
"version": "9.0.0",
|
|
8
44
|
"comments": {
|
|
@@ -17,37 +53,37 @@
|
|
|
17
53
|
"author": "beachball",
|
|
18
54
|
"package": "@fluentui/react-toast",
|
|
19
55
|
"comment": "Bump @fluentui/react-aria to v9.3.26",
|
|
20
|
-
"commit": "
|
|
56
|
+
"commit": "61633ba5de03e0ddf4839dba6da325e30c7ce9bd"
|
|
21
57
|
},
|
|
22
58
|
{
|
|
23
59
|
"author": "beachball",
|
|
24
60
|
"package": "@fluentui/react-toast",
|
|
25
61
|
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.10",
|
|
26
|
-
"commit": "
|
|
62
|
+
"commit": "61633ba5de03e0ddf4839dba6da325e30c7ce9bd"
|
|
27
63
|
},
|
|
28
64
|
{
|
|
29
65
|
"author": "beachball",
|
|
30
66
|
"package": "@fluentui/react-toast",
|
|
31
67
|
"comment": "Bump @fluentui/react-portal to v9.3.0",
|
|
32
|
-
"commit": "
|
|
68
|
+
"commit": "61633ba5de03e0ddf4839dba6da325e30c7ce9bd"
|
|
33
69
|
},
|
|
34
70
|
{
|
|
35
71
|
"author": "beachball",
|
|
36
72
|
"package": "@fluentui/react-toast",
|
|
37
73
|
"comment": "Bump @fluentui/react-shared-contexts to v9.6.0",
|
|
38
|
-
"commit": "
|
|
74
|
+
"commit": "61633ba5de03e0ddf4839dba6da325e30c7ce9bd"
|
|
39
75
|
},
|
|
40
76
|
{
|
|
41
77
|
"author": "beachball",
|
|
42
78
|
"package": "@fluentui/react-toast",
|
|
43
79
|
"comment": "Bump @fluentui/react-tabster to v9.9.2",
|
|
44
|
-
"commit": "
|
|
80
|
+
"commit": "61633ba5de03e0ddf4839dba6da325e30c7ce9bd"
|
|
45
81
|
},
|
|
46
82
|
{
|
|
47
83
|
"author": "beachball",
|
|
48
84
|
"package": "@fluentui/react-toast",
|
|
49
85
|
"comment": "Bump @fluentui/react-utilities to v9.10.1",
|
|
50
|
-
"commit": "
|
|
86
|
+
"commit": "61633ba5de03e0ddf4839dba6da325e30c7ce9bd"
|
|
51
87
|
}
|
|
52
88
|
]
|
|
53
89
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -1,19 +1,38 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-toast
|
|
2
2
|
|
|
3
|
-
This log was last generated on Mon, 03 Jul 2023
|
|
3
|
+
This log was last generated on Mon, 03 Jul 2023 20:42:52 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.0.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-toast_v9.0.2)
|
|
8
|
+
|
|
9
|
+
Mon, 03 Jul 2023 20:42:52 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-toast_v9.0.1..@fluentui/react-toast_v9.0.2)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- fix: Toaster should play toasts on action dismiss ([PR #28420](https://github.com/microsoft/fluentui/pull/28420) by lingfan.gao@microsoft.com)
|
|
15
|
+
|
|
16
|
+
## [9.0.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-toast_v9.0.1)
|
|
17
|
+
|
|
18
|
+
Mon, 03 Jul 2023 13:34:28 GMT
|
|
19
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-toast_v9.0.0..@fluentui/react-toast_v9.0.1)
|
|
20
|
+
|
|
21
|
+
### Patches
|
|
22
|
+
|
|
23
|
+
- Bump @fluentui/react-portal to v9.3.1 ([PR #28394](https://github.com/microsoft/fluentui/pull/28394) by beachball)
|
|
24
|
+
- Bump @fluentui/react-tabster to v9.10.0 ([PR #28394](https://github.com/microsoft/fluentui/pull/28394) by beachball)
|
|
25
|
+
|
|
7
26
|
## [9.0.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-toast_v9.0.0)
|
|
8
27
|
|
|
9
|
-
Mon, 03 Jul 2023 11:
|
|
28
|
+
Mon, 03 Jul 2023 11:57:13 GMT
|
|
10
29
|
|
|
11
30
|
### Minor changes
|
|
12
31
|
|
|
13
32
|
- feat: Initial release ([PR #28399](https://github.com/microsoft/fluentui/pull/28399) by lingfan.gao@microsoft.com)
|
|
14
|
-
- Bump @fluentui/react-aria to v9.3.26 ([PR #
|
|
15
|
-
- Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.10 ([PR #
|
|
16
|
-
- Bump @fluentui/react-portal to v9.3.0 ([PR #
|
|
17
|
-
- Bump @fluentui/react-shared-contexts to v9.6.0 ([PR #
|
|
18
|
-
- Bump @fluentui/react-tabster to v9.9.2 ([PR #
|
|
19
|
-
- Bump @fluentui/react-utilities to v9.10.1 ([PR #
|
|
33
|
+
- Bump @fluentui/react-aria to v9.3.26 ([PR #28412](https://github.com/microsoft/fluentui/pull/28412) by beachball)
|
|
34
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.10 ([PR #28412](https://github.com/microsoft/fluentui/pull/28412) by beachball)
|
|
35
|
+
- Bump @fluentui/react-portal to v9.3.0 ([PR #28412](https://github.com/microsoft/fluentui/pull/28412) by beachball)
|
|
36
|
+
- Bump @fluentui/react-shared-contexts to v9.6.0 ([PR #28412](https://github.com/microsoft/fluentui/pull/28412) by beachball)
|
|
37
|
+
- Bump @fluentui/react-tabster to v9.9.2 ([PR #28412](https://github.com/microsoft/fluentui/pull/28412) by beachball)
|
|
38
|
+
- Bump @fluentui/react-utilities to v9.10.1 ([PR #28412](https://github.com/microsoft/fluentui/pull/28412) by beachball)
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { getNativeElementProps,
|
|
2
|
+
import { getNativeElementProps, isHTMLElement, resolveShorthand } from '@fluentui/react-utilities';
|
|
3
3
|
import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
|
4
4
|
import { TOAST_POSITIONS, useToaster } from '../../state';
|
|
5
5
|
import { ToastContainer } from '../ToastContainer';
|
|
@@ -14,25 +14,32 @@ import { ToastContainer } from '../ToastContainer';
|
|
|
14
14
|
const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);
|
|
15
15
|
const { dir } = useFluent();
|
|
16
16
|
const rootProps = getNativeElementProps('div', rest);
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
17
|
+
// Adds native HTML focusin/focusout listeners
|
|
18
|
+
// https://github.com/facebook/react/issues/25194
|
|
19
|
+
const focusListenerRef = React.useCallback((el)=>{
|
|
20
|
+
if (el) {
|
|
21
|
+
el.addEventListener('focusin', (e)=>{
|
|
22
|
+
if (isHTMLElement(e.currentTarget) && !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {
|
|
23
|
+
pauseAllToasts();
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
el.addEventListener('focusout', (e)=>{
|
|
27
|
+
if (isHTMLElement(e.currentTarget) && !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {
|
|
28
|
+
playAllToasts();
|
|
29
|
+
tryRestoreFocus();
|
|
30
|
+
}
|
|
31
|
+
});
|
|
21
32
|
}
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
playAllToasts();
|
|
28
|
-
tryRestoreFocus();
|
|
29
|
-
}
|
|
30
|
-
(_rootProps_onBlur = rootProps.onBlur) === null || _rootProps_onBlur === void 0 ? void 0 : _rootProps_onBlur.call(rootProps, e);
|
|
31
|
-
});
|
|
33
|
+
}, [
|
|
34
|
+
playAllToasts,
|
|
35
|
+
pauseAllToasts,
|
|
36
|
+
tryRestoreFocus
|
|
37
|
+
]);
|
|
32
38
|
const createPositionSlot = (toastPosition)=>{
|
|
33
39
|
var _toastsToRender_get;
|
|
34
40
|
return resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {
|
|
35
41
|
defaultProps: {
|
|
42
|
+
ref: focusListenerRef,
|
|
36
43
|
children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ React.createElement(ToastContainer, {
|
|
37
44
|
...toast,
|
|
38
45
|
tryRestoreFocus: tryRestoreFocus,
|
|
@@ -41,9 +48,7 @@ import { ToastContainer } from '../ToastContainer';
|
|
|
41
48
|
key: toast.toastId,
|
|
42
49
|
visible: isToastVisible(toast.toastId)
|
|
43
50
|
}, toast.content)),
|
|
44
|
-
'data-toaster-position': toastPosition
|
|
45
|
-
onFocus: onFocusPositionSlot,
|
|
46
|
-
onBlur: onBlurPositionSlot
|
|
51
|
+
'data-toaster-position': toastPosition
|
|
47
52
|
}
|
|
48
53
|
});
|
|
49
54
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useToaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n ExtractSlotProps,\n Slot,\n getNativeElementProps,\n
|
|
1
|
+
{"version":3,"sources":["useToaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n ExtractSlotProps,\n Slot,\n getNativeElementProps,\n isHTMLElement,\n resolveShorthand,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { ToasterProps, ToasterState } from './Toaster.types';\nimport { TOAST_POSITIONS, ToastPosition, useToaster } from '../../state';\nimport { Announce } from '../AriaLive';\nimport { ToastContainer } from '../ToastContainer';\n\n/**\n * Create the state required to render Toaster.\n *\n * @param props - props from this instance of Toaster\n */\nexport const useToaster_unstable = (props: ToasterProps): ToasterState => {\n const { offset, announce: announceProp, ...rest } = props;\n const announceRef = React.useRef<Announce>(() => null);\n const { toastsToRender, isToastVisible, pauseAllToasts, playAllToasts, tryRestoreFocus } =\n useToaster<HTMLDivElement>(rest);\n const announce = React.useCallback<Announce>((message, options) => announceRef.current(message, options), []);\n const { dir } = useFluent();\n\n const rootProps = getNativeElementProps('div', rest);\n\n // Adds native HTML focusin/focusout listeners\n // https://github.com/facebook/react/issues/25194\n const focusListenerRef = React.useCallback(\n (el: HTMLDivElement | null) => {\n if (el) {\n el.addEventListener('focusin', e => {\n if (\n isHTMLElement(e.currentTarget) &&\n !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)\n ) {\n pauseAllToasts();\n }\n });\n\n el.addEventListener('focusout', e => {\n if (\n isHTMLElement(e.currentTarget) &&\n !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)\n ) {\n playAllToasts();\n tryRestoreFocus();\n }\n });\n }\n },\n [playAllToasts, pauseAllToasts, tryRestoreFocus],\n );\n\n const createPositionSlot = (toastPosition: ToastPosition) =>\n resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {\n defaultProps: {\n ref: focusListenerRef,\n children: toastsToRender.get(toastPosition)?.map(toast => (\n <ToastContainer\n {...toast}\n tryRestoreFocus={tryRestoreFocus}\n intent={toast.intent}\n announce={announce}\n key={toast.toastId}\n visible={isToastVisible(toast.toastId)}\n >\n {toast.content as React.ReactNode}\n </ToastContainer>\n )),\n 'data-toaster-position': toastPosition,\n // Explicitly casting because our slot types can't handle data attributes\n } as ExtractSlotProps<Slot<'div'>>,\n });\n\n return {\n dir,\n components: {\n root: 'div',\n bottomStart: 'div',\n bottomEnd: 'div',\n topStart: 'div',\n topEnd: 'div',\n },\n root: resolveShorthand(rootProps, { required: true }),\n bottomStart: createPositionSlot(TOAST_POSITIONS.bottomStart),\n bottomEnd: createPositionSlot(TOAST_POSITIONS.bottomEnd),\n topStart: createPositionSlot(TOAST_POSITIONS.topStart),\n topEnd: createPositionSlot(TOAST_POSITIONS.topEnd),\n announceRef,\n offset,\n announce: announceProp ?? announce,\n renderAriaLive: !announceProp,\n };\n};\n"],"names":["React","getNativeElementProps","isHTMLElement","resolveShorthand","useFluent_unstable","useFluent","TOAST_POSITIONS","useToaster","ToastContainer","useToaster_unstable","props","offset","announce","announceProp","rest","announceRef","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","useCallback","message","options","current","dir","rootProps","focusListenerRef","el","addEventListener","e","currentTarget","contains","relatedTarget","createPositionSlot","toastPosition","has","defaultProps","ref","children","get","map","toast","intent","key","toastId","visible","content","components","root","bottomStart","bottomEnd","topStart","topEnd","required","renderAriaLive"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAGEC,qBAAqB,EACrBC,aAAa,EACbC,gBAAgB,QACX,4BAA4B;AACnC,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF,SAASC,eAAe,EAAiBC,UAAU,QAAQ,cAAc;AAEzE,SAASC,cAAc,QAAQ,oBAAoB;AAEnD;;;;CAIC,GACD,OAAO,MAAMC,sBAAsB,CAACC,QAAsC;IACxE,MAAM,EAAEC,OAAM,EAAEC,UAAUC,aAAY,EAAE,GAAGC,MAAM,GAAGJ;IACpD,MAAMK,cAAcf,MAAMgB,MAAM,CAAW,IAAM,IAAI;IACrD,MAAM,EAAEC,eAAc,EAAEC,eAAc,EAAEC,eAAc,EAAEC,cAAa,EAAEC,gBAAe,EAAE,GACtFd,WAA2BO;IAC7B,MAAMF,WAAWZ,MAAMsB,WAAW,CAAW,CAACC,SAASC,UAAYT,YAAYU,OAAO,CAACF,SAASC,UAAU,EAAE;IAC5G,MAAM,EAAEE,IAAG,EAAE,GAAGrB;IAEhB,MAAMsB,YAAY1B,sBAAsB,OAAOa;IAE/C,8CAA8C;IAC9C,iDAAiD;IACjD,MAAMc,mBAAmB5B,MAAMsB,WAAW,CACxC,CAACO,KAA8B;QAC7B,IAAIA,IAAI;YACNA,GAAGC,gBAAgB,CAAC,WAAWC,CAAAA,IAAK;gBAClC,IACE7B,cAAc6B,EAAEC,aAAa,KAC7B,CAACD,EAAEC,aAAa,CAACC,QAAQ,CAAC/B,cAAc6B,EAAEG,aAAa,IAAIH,EAAEG,aAAa,GAAG,IAAI,GACjF;oBACAf;gBACF,CAAC;YACH;YAEAU,GAAGC,gBAAgB,CAAC,YAAYC,CAAAA,IAAK;gBACnC,IACE7B,cAAc6B,EAAEC,aAAa,KAC7B,CAACD,EAAEC,aAAa,CAACC,QAAQ,CAAC/B,cAAc6B,EAAEG,aAAa,IAAIH,EAAEG,aAAa,GAAG,IAAI,GACjF;oBACAd;oBACAC;gBACF,CAAC;YACH;QACF,CAAC;IACH,GACA;QAACD;QAAeD;QAAgBE;KAAgB;IAGlD,MAAMc,qBAAqB,CAACC;YAIZnB;QAHdd,OAAAA,iBAAiBc,eAAeoB,GAAG,CAACD,iBAAiBT,YAAY,IAAI,EAAE;YACrEW,cAAc;gBACZC,KAAKX;gBACLY,QAAQ,EAAEvB,CAAAA,sBAAAA,eAAewB,GAAG,CAACL,4BAAnBnB,iCAAAA,KAAAA,IAAAA,oBAAmCyB,IAAIC,CAAAA,sBAC/C,oBAACnC;wBACE,GAAGmC,KAAK;wBACTtB,iBAAiBA;wBACjBuB,QAAQD,MAAMC,MAAM;wBACpBhC,UAAUA;wBACViC,KAAKF,MAAMG,OAAO;wBAClBC,SAAS7B,eAAeyB,MAAMG,OAAO;uBAEpCH,MAAMK,OAAO;gBAGlB,yBAAyBZ;YAE3B;QACF;;IAEF,OAAO;QACLV;QACAuB,YAAY;YACVC,MAAM;YACNC,aAAa;YACbC,WAAW;YACXC,UAAU;YACVC,QAAQ;QACV;QACAJ,MAAM/C,iBAAiBwB,WAAW;YAAE4B,UAAU,IAAI;QAAC;QACnDJ,aAAahB,mBAAmB7B,gBAAgB6C,WAAW;QAC3DC,WAAWjB,mBAAmB7B,gBAAgB8C,SAAS;QACvDC,UAAUlB,mBAAmB7B,gBAAgB+C,QAAQ;QACrDC,QAAQnB,mBAAmB7B,gBAAgBgD,MAAM;QACjDvC;QACAJ;QACAC,UAAUC,yBAAAA,0BAAAA,eAAgBD,QAAQ;QAClC4C,gBAAgB,CAAC3C;IACnB;AACF,EAAE"}
|
|
@@ -19,25 +19,32 @@ const useToaster_unstable = (props)=>{
|
|
|
19
19
|
const announce = _react.useCallback((message, options)=>announceRef.current(message, options), []);
|
|
20
20
|
const { dir } = (0, _reactSharedContexts.useFluent_unstable)();
|
|
21
21
|
const rootProps = (0, _reactUtilities.getNativeElementProps)('div', rest);
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
22
|
+
// Adds native HTML focusin/focusout listeners
|
|
23
|
+
// https://github.com/facebook/react/issues/25194
|
|
24
|
+
const focusListenerRef = _react.useCallback((el)=>{
|
|
25
|
+
if (el) {
|
|
26
|
+
el.addEventListener('focusin', (e)=>{
|
|
27
|
+
if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && !e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
|
|
28
|
+
pauseAllToasts();
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
el.addEventListener('focusout', (e)=>{
|
|
32
|
+
if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && !e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
|
|
33
|
+
playAllToasts();
|
|
34
|
+
tryRestoreFocus();
|
|
35
|
+
}
|
|
36
|
+
});
|
|
26
37
|
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
playAllToasts();
|
|
33
|
-
tryRestoreFocus();
|
|
34
|
-
}
|
|
35
|
-
(_rootProps_onBlur = rootProps.onBlur) === null || _rootProps_onBlur === void 0 ? void 0 : _rootProps_onBlur.call(rootProps, e);
|
|
36
|
-
});
|
|
38
|
+
}, [
|
|
39
|
+
playAllToasts,
|
|
40
|
+
pauseAllToasts,
|
|
41
|
+
tryRestoreFocus
|
|
42
|
+
]);
|
|
37
43
|
const createPositionSlot = (toastPosition)=>{
|
|
38
44
|
var _toastsToRender_get;
|
|
39
45
|
return (0, _reactUtilities.resolveShorthand)(toastsToRender.has(toastPosition) ? rootProps : null, {
|
|
40
46
|
defaultProps: {
|
|
47
|
+
ref: focusListenerRef,
|
|
41
48
|
children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ _react.createElement(_toastContainer.ToastContainer, {
|
|
42
49
|
...toast,
|
|
43
50
|
tryRestoreFocus: tryRestoreFocus,
|
|
@@ -46,9 +53,7 @@ const useToaster_unstable = (props)=>{
|
|
|
46
53
|
key: toast.toastId,
|
|
47
54
|
visible: isToastVisible(toast.toastId)
|
|
48
55
|
}, toast.content)),
|
|
49
|
-
'data-toaster-position': toastPosition
|
|
50
|
-
onFocus: onFocusPositionSlot,
|
|
51
|
-
onBlur: onBlurPositionSlot
|
|
56
|
+
'data-toaster-position': toastPosition
|
|
52
57
|
}
|
|
53
58
|
});
|
|
54
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useToaster.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps,
|
|
1
|
+
{"version":3,"sources":["useToaster.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isHTMLElement, resolveShorthand } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { TOAST_POSITIONS, useToaster } from '../../state';\nimport { ToastContainer } from '../ToastContainer';\n/**\n * Create the state required to render Toaster.\n *\n * @param props - props from this instance of Toaster\n */ export const useToaster_unstable = (props)=>{\n const { offset , announce: announceProp , ...rest } = props;\n const announceRef = React.useRef(()=>null);\n const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus } = useToaster(rest);\n const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);\n const { dir } = useFluent();\n const rootProps = getNativeElementProps('div', rest);\n // Adds native HTML focusin/focusout listeners\n // https://github.com/facebook/react/issues/25194\n const focusListenerRef = React.useCallback((el)=>{\n if (el) {\n el.addEventListener('focusin', (e)=>{\n if (isHTMLElement(e.currentTarget) && !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {\n pauseAllToasts();\n }\n });\n el.addEventListener('focusout', (e)=>{\n if (isHTMLElement(e.currentTarget) && !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {\n playAllToasts();\n tryRestoreFocus();\n }\n });\n }\n }, [\n playAllToasts,\n pauseAllToasts,\n tryRestoreFocus\n ]);\n const createPositionSlot = (toastPosition)=>{\n var _toastsToRender_get;\n return resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {\n defaultProps: {\n ref: focusListenerRef,\n children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ React.createElement(ToastContainer, {\n ...toast,\n tryRestoreFocus: tryRestoreFocus,\n intent: toast.intent,\n announce: announce,\n key: toast.toastId,\n visible: isToastVisible(toast.toastId)\n }, toast.content)),\n 'data-toaster-position': toastPosition\n }\n });\n };\n return {\n dir,\n components: {\n root: 'div',\n bottomStart: 'div',\n bottomEnd: 'div',\n topStart: 'div',\n topEnd: 'div'\n },\n root: resolveShorthand(rootProps, {\n required: true\n }),\n bottomStart: createPositionSlot(TOAST_POSITIONS.bottomStart),\n bottomEnd: createPositionSlot(TOAST_POSITIONS.bottomEnd),\n topStart: createPositionSlot(TOAST_POSITIONS.topStart),\n topEnd: createPositionSlot(TOAST_POSITIONS.topEnd),\n announceRef,\n offset,\n announce: announceProp !== null && announceProp !== void 0 ? announceProp : announce,\n renderAriaLive: !announceProp\n };\n};\n"],"names":["useToaster_unstable","props","offset","announce","announceProp","rest","announceRef","React","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","useToaster","useCallback","message","options","current","dir","useFluent","rootProps","getNativeElementProps","focusListenerRef","el","addEventListener","e","isHTMLElement","currentTarget","contains","relatedTarget","createPositionSlot","toastPosition","_toastsToRender_get","resolveShorthand","has","defaultProps","ref","children","get","map","toast","createElement","ToastContainer","intent","key","toastId","visible","content","components","root","bottomStart","bottomEnd","topStart","topEnd","required","TOAST_POSITIONS","renderAriaLive"],"mappings":";;;;+BASiBA;;aAAAA;;;6DATM;gCACgD;qCACvB;uBACJ;gCACb;AAKpB,MAAMA,sBAAsB,CAACC,QAAQ;IAC5C,MAAM,EAAEC,OAAM,EAAGC,UAAUC,aAAY,EAAG,GAAGC,MAAM,GAAGJ;IACtD,MAAMK,cAAcC,OAAMC,MAAM,CAAC,IAAI,IAAI;IACzC,MAAM,EAAEC,eAAc,EAAGC,eAAc,EAAGC,eAAc,EAAGC,cAAa,EAAGC,gBAAe,EAAG,GAAGC,IAAAA,iBAAU,EAACT;IAC3G,MAAMF,WAAWI,OAAMQ,WAAW,CAAC,CAACC,SAASC,UAAUX,YAAYY,OAAO,CAACF,SAASC,UAAU,EAAE;IAChG,MAAM,EAAEE,IAAG,EAAG,GAAGC,IAAAA,uCAAS;IAC1B,MAAMC,YAAYC,IAAAA,qCAAqB,EAAC,OAAOjB;IAC/C,8CAA8C;IAC9C,iDAAiD;IACjD,MAAMkB,mBAAmBhB,OAAMQ,WAAW,CAAC,CAACS,KAAK;QAC7C,IAAIA,IAAI;YACJA,GAAGC,gBAAgB,CAAC,WAAW,CAACC,IAAI;gBAChC,IAAIC,IAAAA,6BAAa,EAACD,EAAEE,aAAa,KAAK,CAACF,EAAEE,aAAa,CAACC,QAAQ,CAACF,IAAAA,6BAAa,EAACD,EAAEI,aAAa,IAAIJ,EAAEI,aAAa,GAAG,IAAI,GAAG;oBACtHnB;gBACJ,CAAC;YACL;YACAa,GAAGC,gBAAgB,CAAC,YAAY,CAACC,IAAI;gBACjC,IAAIC,IAAAA,6BAAa,EAACD,EAAEE,aAAa,KAAK,CAACF,EAAEE,aAAa,CAACC,QAAQ,CAACF,IAAAA,6BAAa,EAACD,EAAEI,aAAa,IAAIJ,EAAEI,aAAa,GAAG,IAAI,GAAG;oBACtHlB;oBACAC;gBACJ,CAAC;YACL;QACJ,CAAC;IACL,GAAG;QACCD;QACAD;QACAE;KACH;IACD,MAAMkB,qBAAqB,CAACC,gBAAgB;QACxC,IAAIC;QACJ,OAAOC,IAAAA,gCAAgB,EAACzB,eAAe0B,GAAG,CAACH,iBAAiBX,YAAY,IAAI,EAAE;YAC1Ee,cAAc;gBACVC,KAAKd;gBACLe,UAAU,AAACL,CAAAA,sBAAsBxB,eAAe8B,GAAG,CAACP,cAAa,MAAO,IAAI,IAAIC,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBO,GAAG,CAAC,CAACC,QAAQ,WAAW,GAAGlC,OAAMmC,aAAa,CAACC,8BAAc,EAAE;wBACrM,GAAGF,KAAK;wBACR5B,iBAAiBA;wBACjB+B,QAAQH,MAAMG,MAAM;wBACpBzC,UAAUA;wBACV0C,KAAKJ,MAAMK,OAAO;wBAClBC,SAASrC,eAAe+B,MAAMK,OAAO;oBACzC,GAAGL,MAAMO,OAAO,EAAE;gBACtB,yBAAyBhB;YAC7B;QACJ;IACJ;IACA,OAAO;QACHb;QACA8B,YAAY;YACRC,MAAM;YACNC,aAAa;YACbC,WAAW;YACXC,UAAU;YACVC,QAAQ;QACZ;QACAJ,MAAMhB,IAAAA,gCAAgB,EAACb,WAAW;YAC9BkC,UAAU,IAAI;QAClB;QACAJ,aAAapB,mBAAmByB,sBAAe,CAACL,WAAW;QAC3DC,WAAWrB,mBAAmByB,sBAAe,CAACJ,SAAS;QACvDC,UAAUtB,mBAAmByB,sBAAe,CAACH,QAAQ;QACrDC,QAAQvB,mBAAmByB,sBAAe,CAACF,MAAM;QACjDhD;QACAJ;QACAC,UAAUC,iBAAiB,IAAI,IAAIA,iBAAiB,KAAK,IAAIA,eAAeD,QAAQ;QACpFsD,gBAAgB,CAACrD;IACrB;AACJ"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-toast",
|
|
3
|
-
"version": "9.0.
|
|
3
|
+
"version": "9.0.2",
|
|
4
4
|
"description": "Toast component for Fluent UI",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -39,9 +39,9 @@
|
|
|
39
39
|
"@fluentui/react-aria": "^9.3.26",
|
|
40
40
|
"@fluentui/react-icons": "^2.0.203",
|
|
41
41
|
"@fluentui/react-jsx-runtime": "9.0.0-alpha.10",
|
|
42
|
-
"@fluentui/react-portal": "^9.3.
|
|
42
|
+
"@fluentui/react-portal": "^9.3.1",
|
|
43
43
|
"@fluentui/react-shared-contexts": "^9.6.0",
|
|
44
|
-
"@fluentui/react-tabster": "^9.
|
|
44
|
+
"@fluentui/react-tabster": "^9.10.0",
|
|
45
45
|
"@fluentui/react-theme": "^9.1.9",
|
|
46
46
|
"@fluentui/react-utilities": "^9.10.1",
|
|
47
47
|
"@griffel/react": "^1.5.7",
|