@fluentui/react-toast 9.1.5 → 9.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/CHANGELOG.json +85 -1
- package/CHANGELOG.md +29 -2
- package/dist/index.d.ts +3 -2
- package/lib/components/Toaster/Toaster.types.js.map +1 -1
- package/lib/components/Toaster/renderToaster.js +3 -1
- package/lib/components/Toaster/renderToaster.js.map +1 -1
- package/lib/components/Toaster/useToaster.js +2 -1
- package/lib/components/Toaster/useToaster.js.map +1 -1
- package/lib-commonjs/components/Toaster/renderToaster.js +3 -1
- package/lib-commonjs/components/Toaster/renderToaster.js.map +1 -1
- package/lib-commonjs/components/Toaster/useToaster.js +2 -1
- package/lib-commonjs/components/Toaster/useToaster.js.map +1 -1
- package/package.json +6 -6
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,91 @@
|
|
|
2
2
|
"name": "@fluentui/react-toast",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Tue, 29 Aug 2023 12:53:35 GMT",
|
|
6
|
+
"tag": "@fluentui/react-toast_v9.2.0",
|
|
7
|
+
"version": "9.2.0",
|
|
8
|
+
"comments": {
|
|
9
|
+
"minor": [
|
|
10
|
+
{
|
|
11
|
+
"author": "bernardo.sunderhus@gmail.com",
|
|
12
|
+
"package": "@fluentui/react-toast",
|
|
13
|
+
"commit": "3ef92a485889eee5010ed32b8fc1ec1d8127cc44",
|
|
14
|
+
"comment": "feat: adds mountNode to Toaster API"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui/react-toast",
|
|
19
|
+
"comment": "Bump @fluentui/react-aria to v9.3.33",
|
|
20
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui/react-toast",
|
|
25
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.3",
|
|
26
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"author": "beachball",
|
|
30
|
+
"package": "@fluentui/react-toast",
|
|
31
|
+
"comment": "Bump @fluentui/react-portal to v9.3.10",
|
|
32
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"author": "beachball",
|
|
36
|
+
"package": "@fluentui/react-toast",
|
|
37
|
+
"comment": "Bump @fluentui/react-tabster to v9.12.5",
|
|
38
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"author": "beachball",
|
|
42
|
+
"package": "@fluentui/react-toast",
|
|
43
|
+
"comment": "Bump @fluentui/react-utilities to v9.13.0",
|
|
44
|
+
"commit": "f40ca42c8392904750bf1ef24826d273d1a5b4d5"
|
|
45
|
+
}
|
|
46
|
+
]
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"date": "Thu, 24 Aug 2023 10:26:35 GMT",
|
|
51
|
+
"tag": "@fluentui/react-toast_v9.1.6",
|
|
52
|
+
"version": "9.1.6",
|
|
53
|
+
"comments": {
|
|
54
|
+
"patch": [
|
|
55
|
+
{
|
|
56
|
+
"author": "beachball",
|
|
57
|
+
"package": "@fluentui/react-toast",
|
|
58
|
+
"comment": "Bump @fluentui/react-aria to v9.3.32",
|
|
59
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
"author": "beachball",
|
|
63
|
+
"package": "@fluentui/react-toast",
|
|
64
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.2",
|
|
65
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"author": "beachball",
|
|
69
|
+
"package": "@fluentui/react-toast",
|
|
70
|
+
"comment": "Bump @fluentui/react-portal to v9.3.9",
|
|
71
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
"author": "beachball",
|
|
75
|
+
"package": "@fluentui/react-toast",
|
|
76
|
+
"comment": "Bump @fluentui/react-tabster to v9.12.4",
|
|
77
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
"author": "beachball",
|
|
81
|
+
"package": "@fluentui/react-toast",
|
|
82
|
+
"comment": "Bump @fluentui/react-utilities to v9.12.0",
|
|
83
|
+
"commit": "3f6c5a749ef403c06b9c9e753df9afbb84a2ecb5"
|
|
84
|
+
}
|
|
85
|
+
]
|
|
86
|
+
}
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
"date": "Wed, 23 Aug 2023 12:01:49 GMT",
|
|
6
90
|
"tag": "@fluentui/react-toast_v9.1.5",
|
|
7
91
|
"version": "9.1.5",
|
|
8
92
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,39 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-toast
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Tue, 29 Aug 2023 12:53:35 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.2.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-toast_v9.2.0)
|
|
8
|
+
|
|
9
|
+
Tue, 29 Aug 2023 12:53:35 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-toast_v9.1.6..@fluentui/react-toast_v9.2.0)
|
|
11
|
+
|
|
12
|
+
### Minor changes
|
|
13
|
+
|
|
14
|
+
- feat: adds mountNode to Toaster API ([PR #29003](https://github.com/microsoft/fluentui/pull/29003) by bernardo.sunderhus@gmail.com)
|
|
15
|
+
- Bump @fluentui/react-aria to v9.3.33 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
|
16
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.3 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
|
17
|
+
- Bump @fluentui/react-portal to v9.3.10 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
|
18
|
+
- Bump @fluentui/react-tabster to v9.12.5 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
|
19
|
+
- Bump @fluentui/react-utilities to v9.13.0 ([PR #29005](https://github.com/microsoft/fluentui/pull/29005) by beachball)
|
|
20
|
+
|
|
21
|
+
## [9.1.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-toast_v9.1.6)
|
|
22
|
+
|
|
23
|
+
Thu, 24 Aug 2023 10:26:35 GMT
|
|
24
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-toast_v9.1.5..@fluentui/react-toast_v9.1.6)
|
|
25
|
+
|
|
26
|
+
### Patches
|
|
27
|
+
|
|
28
|
+
- Bump @fluentui/react-aria to v9.3.32 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
|
29
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.2 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
|
30
|
+
- Bump @fluentui/react-portal to v9.3.9 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
|
31
|
+
- Bump @fluentui/react-tabster to v9.12.4 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
|
32
|
+
- Bump @fluentui/react-utilities to v9.12.0 ([PR #28973](https://github.com/microsoft/fluentui/pull/28973) by beachball)
|
|
33
|
+
|
|
7
34
|
## [9.1.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-toast_v9.1.5)
|
|
8
35
|
|
|
9
|
-
Wed, 23 Aug 2023
|
|
36
|
+
Wed, 23 Aug 2023 12:01:49 GMT
|
|
10
37
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-toast_v9.1.4..@fluentui/react-toast_v9.1.5)
|
|
11
38
|
|
|
12
39
|
### Patches
|
package/dist/index.d.ts
CHANGED
|
@@ -7,6 +7,7 @@ import type { ComponentProps } from '@fluentui/react-utilities';
|
|
|
7
7
|
import type { ComponentState } from '@fluentui/react-utilities';
|
|
8
8
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
9
9
|
import { JSXElementConstructor } from 'react';
|
|
10
|
+
import type { PortalProps } from '@fluentui/react-portal';
|
|
10
11
|
import * as React_2 from 'react';
|
|
11
12
|
import { ReactElement } from 'react';
|
|
12
13
|
import type { Slot } from '@fluentui/react-utilities';
|
|
@@ -163,7 +164,7 @@ declare interface ToasterOptions extends Pick<ToastOptions, 'position' | 'timeou
|
|
|
163
164
|
/**
|
|
164
165
|
* Toaster Props
|
|
165
166
|
*/
|
|
166
|
-
export declare type ToasterProps = Omit<ComponentProps<ToasterSlots>, 'children'> & Partial<ToasterOptions> & {
|
|
167
|
+
export declare type ToasterProps = Omit<ComponentProps<ToasterSlots>, 'children'> & Partial<ToasterOptions> & Pick<PortalProps, 'mountNode'> & {
|
|
167
168
|
/**
|
|
168
169
|
* User override API for aria-live narration for toasts
|
|
169
170
|
*/
|
|
@@ -192,7 +193,7 @@ declare type ToasterSlotsInternal = ToasterSlots & {
|
|
|
192
193
|
/**
|
|
193
194
|
* State used in rendering Toaster
|
|
194
195
|
*/
|
|
195
|
-
export declare type ToasterState = ComponentState<ToasterSlotsInternal> & Pick<AriaLiveProps, 'announceRef'> & Pick<Required<ToasterProps>, 'announce'> & {
|
|
196
|
+
export declare type ToasterState = ComponentState<ToasterSlotsInternal> & Pick<AriaLiveProps, 'announceRef'> & Pick<PortalProps, 'mountNode'> & Pick<Required<ToasterProps>, 'announce'> & {
|
|
196
197
|
offset: ToasterOptions['offset'] | undefined;
|
|
197
198
|
renderAriaLive: boolean;
|
|
198
199
|
dir: 'rtl' | 'ltr';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Toaster.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { ToasterOptions } from '../../state/types';\nimport { Announce, AriaLiveProps } from '../AriaLive';\n\nexport type ToasterSlots = {\n /**\n * NOTE: This root slot maps in exactly the same way to the containers rendered for each toast position\n * There is no intention (currently) to let users customize the div for each toast position.\n */\n root: Slot<'div'>;\n};\n\nexport type ToasterSlotsInternal = ToasterSlots & {\n bottomEnd?: Slot<'div'>;\n bottomStart?: Slot<'div'>;\n topEnd?: Slot<'div'>;\n topStart?: Slot<'div'>;\n};\n\n/**\n * Toaster Props\n */\nexport type ToasterProps = Omit<ComponentProps<ToasterSlots>, 'children'> &\n Partial<ToasterOptions> & {\n /**\n * User override API for aria-live narration for toasts\n */\n announce?: Announce;\n };\n\n/**\n * State used in rendering Toaster\n */\nexport type ToasterState = ComponentState<ToasterSlotsInternal> &\n Pick<AriaLiveProps, 'announceRef'> &\n Pick<Required<ToasterProps>, 'announce'> & {\n offset: ToasterOptions['offset'] | undefined;\n renderAriaLive: boolean;\n dir: 'rtl' | 'ltr';\n };\n"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"sources":["Toaster.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PortalProps } from '@fluentui/react-portal';\nimport { ToasterOptions } from '../../state/types';\nimport { Announce, AriaLiveProps } from '../AriaLive';\n\nexport type ToasterSlots = {\n /**\n * NOTE: This root slot maps in exactly the same way to the containers rendered for each toast position\n * There is no intention (currently) to let users customize the div for each toast position.\n */\n root: Slot<'div'>;\n};\n\nexport type ToasterSlotsInternal = ToasterSlots & {\n bottomEnd?: Slot<'div'>;\n bottomStart?: Slot<'div'>;\n topEnd?: Slot<'div'>;\n topStart?: Slot<'div'>;\n};\n\n/**\n * Toaster Props\n */\nexport type ToasterProps = Omit<ComponentProps<ToasterSlots>, 'children'> &\n Partial<ToasterOptions> &\n Pick<PortalProps, 'mountNode'> & {\n /**\n * User override API for aria-live narration for toasts\n */\n announce?: Announce;\n };\n\n/**\n * State used in rendering Toaster\n */\nexport type ToasterState = ComponentState<ToasterSlotsInternal> &\n Pick<AriaLiveProps, 'announceRef'> &\n Pick<PortalProps, 'mountNode'> &\n Pick<Required<ToasterProps>, 'announce'> & {\n offset: ToasterOptions['offset'] | undefined;\n renderAriaLive: boolean;\n dir: 'rtl' | 'ltr';\n };\n"],"names":[],"mappings":"AAAA,WA0CI"}
|
|
@@ -10,5 +10,7 @@ import { AriaLive } from '../AriaLive';
|
|
|
10
10
|
const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;
|
|
11
11
|
return /*#__PURE__*/ createElement(Fragment, null, renderAriaLive ? /*#__PURE__*/ createElement(AriaLive, {
|
|
12
12
|
announceRef: announceRef
|
|
13
|
-
}) : null, hasToasts ? /*#__PURE__*/ createElement(Portal,
|
|
13
|
+
}) : null, hasToasts ? /*#__PURE__*/ createElement(Portal, {
|
|
14
|
+
mountNode: state.mountNode
|
|
15
|
+
}, state.bottomStart ? /*#__PURE__*/ createElement(state.bottomStart, null) : null, state.bottomEnd ? /*#__PURE__*/ createElement(state.bottomEnd, null) : null, state.topStart ? /*#__PURE__*/ createElement(state.topStart, null) : null, state.topEnd ? /*#__PURE__*/ createElement(state.topEnd, null) : null) : null);
|
|
14
16
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderToaster.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsxFrag Fragment */\n/** @jsx createElement */\n\nimport { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { Portal } from '@fluentui/react-portal';\nimport type { ToasterState, ToasterSlotsInternal } from './Toaster.types';\nimport { AriaLive } from '../AriaLive';\n\n/**\n * Render the final JSX of Toaster\n */\nexport const renderToaster_unstable = (state: ToasterState) => {\n const { announceRef, renderAriaLive } = state;\n assertSlots<ToasterSlotsInternal>(state);\n\n const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;\n\n return (\n <>\n {renderAriaLive ? <AriaLive announceRef={announceRef} /> : null}\n {hasToasts ? (\n <Portal>\n {state.bottomStart ? <state.bottomStart /> : null}\n {state.bottomEnd ? <state.bottomEnd /> : null}\n {state.topStart ? <state.topStart /> : null}\n {state.topEnd ? <state.topEnd /> : null}\n </Portal>\n ) : null}\n </>\n );\n};\n"],"names":["createElement","Fragment","assertSlots","Portal","AriaLive","renderToaster_unstable","state","announceRef","renderAriaLive","hasToasts","bottomStart","bottomEnd","topStart","topEnd"],"mappings":"AAAA,wBAAwB,GACxB,sBAAsB,GACtB,uBAAuB,GAEvB,SAASA,aAAa,EAAEC,QAAQ,QAAQ,8BAA8B;AACtE,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,MAAM,QAAQ,yBAAyB;AAEhD,SAASC,QAAQ,QAAQ,cAAc;AAEvC;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC,QAAwB;IAC7D,MAAM,EAAEC,YAAW,EAAEC,eAAc,EAAE,GAAGF;IACxCJ,YAAkCI;IAElC,MAAMG,YAAY,CAAC,CAACH,MAAMI,WAAW,IAAI,CAAC,CAACJ,MAAMK,SAAS,IAAI,CAAC,CAACL,MAAMM,QAAQ,IAAI,CAAC,CAACN,MAAMO,MAAM;IAEhG,qBACE,AAlBJ,cADA,gBAoBOL,+BAAiB,AAnBxB,cAmByBJ;QAASG,aAAaA;SAAkB,IAAI,EAC9DE,0BACC,AArBR,cAqBSN,
|
|
1
|
+
{"version":3,"sources":["renderToaster.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsxFrag Fragment */\n/** @jsx createElement */\n\nimport { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { Portal } from '@fluentui/react-portal';\nimport type { ToasterState, ToasterSlotsInternal } from './Toaster.types';\nimport { AriaLive } from '../AriaLive';\n\n/**\n * Render the final JSX of Toaster\n */\nexport const renderToaster_unstable = (state: ToasterState) => {\n const { announceRef, renderAriaLive } = state;\n assertSlots<ToasterSlotsInternal>(state);\n\n const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;\n\n return (\n <>\n {renderAriaLive ? <AriaLive announceRef={announceRef} /> : null}\n {hasToasts ? (\n <Portal mountNode={state.mountNode}>\n {state.bottomStart ? <state.bottomStart /> : null}\n {state.bottomEnd ? <state.bottomEnd /> : null}\n {state.topStart ? <state.topStart /> : null}\n {state.topEnd ? <state.topEnd /> : null}\n </Portal>\n ) : null}\n </>\n );\n};\n"],"names":["createElement","Fragment","assertSlots","Portal","AriaLive","renderToaster_unstable","state","announceRef","renderAriaLive","hasToasts","bottomStart","bottomEnd","topStart","topEnd","mountNode"],"mappings":"AAAA,wBAAwB,GACxB,sBAAsB,GACtB,uBAAuB,GAEvB,SAASA,aAAa,EAAEC,QAAQ,QAAQ,8BAA8B;AACtE,SAASC,WAAW,QAAQ,4BAA4B;AACxD,SAASC,MAAM,QAAQ,yBAAyB;AAEhD,SAASC,QAAQ,QAAQ,cAAc;AAEvC;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC,QAAwB;IAC7D,MAAM,EAAEC,YAAW,EAAEC,eAAc,EAAE,GAAGF;IACxCJ,YAAkCI;IAElC,MAAMG,YAAY,CAAC,CAACH,MAAMI,WAAW,IAAI,CAAC,CAACJ,MAAMK,SAAS,IAAI,CAAC,CAACL,MAAMM,QAAQ,IAAI,CAAC,CAACN,MAAMO,MAAM;IAEhG,qBACE,AAlBJ,cADA,gBAoBOL,+BAAiB,AAnBxB,cAmByBJ;QAASG,aAAaA;SAAkB,IAAI,EAC9DE,0BACC,AArBR,cAqBSN;QAAOW,WAAWR,MAAMQ,SAAS;OAC/BR,MAAMI,WAAW,iBAAG,AAtB/B,cAsBgCJ,MAAMI,WAAW,UAAM,IAAI,EAChDJ,MAAMK,SAAS,iBAAG,AAvB7B,cAuB8BL,MAAMK,SAAS,UAAM,IAAI,EAC5CL,MAAMM,QAAQ,iBAAG,AAxB5B,cAwB6BN,MAAMM,QAAQ,UAAM,IAAI,EAC1CN,MAAMO,MAAM,iBAAG,AAzB1B,cAyB2BP,MAAMO,MAAM,UAAM,IAAI,IAEvC,IAAI;AAGd,EAAE"}
|
|
@@ -12,7 +12,7 @@ import { useToastAnnounce } from './useToastAnnounce';
|
|
|
12
12
|
*
|
|
13
13
|
* @param props - props from this instance of Toaster
|
|
14
14
|
*/ export const useToaster_unstable = (props)=>{
|
|
15
|
-
const { offset , announce: announceProp , ...rest } = props;
|
|
15
|
+
const { offset , announce: announceProp , mountNode , ...rest } = props;
|
|
16
16
|
const announceRef = React.useRef(()=>null);
|
|
17
17
|
const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus , closeAllToasts } = useToaster(rest);
|
|
18
18
|
const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);
|
|
@@ -59,6 +59,7 @@ import { useToastAnnounce } from './useToastAnnounce';
|
|
|
59
59
|
};
|
|
60
60
|
return {
|
|
61
61
|
dir,
|
|
62
|
+
mountNode,
|
|
62
63
|
components: {
|
|
63
64
|
root: 'div',
|
|
64
65
|
bottomStart: 'div',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useToaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n ExtractSlotProps,\n Slot,\n getNativeElementProps,\n useEventCallback,\n useMergedRefs,\n slot,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport type { ToasterProps, ToasterState } from './Toaster.types';\nimport { TOAST_POSITIONS, ToastPosition, useToaster } from '../../state';\nimport { Announce } from '../AriaLive';\nimport { ToastContainer } from '../ToastContainer';\nimport { useToasterFocusManagement_unstable } from './useToasterFocusManagement';\nimport { useToastAnnounce } from './useToastAnnounce';\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, closeAllToasts } =\n useToaster<HTMLDivElement>(rest);\n const announce = React.useCallback<Announce>((message, options) => announceRef.current(message, options), []);\n const { dir } = useFluent();\n\n const rootProps = slot.always(getNativeElementProps('div', rest), { elementType: 'div' });\n const focusableGroupAttr = useFocusableGroup({\n tabBehavior: 'limited-trap-focus',\n ignoreDefaultKeydown: { Escape: true },\n });\n const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n if (e.key === Escape) {\n e.preventDefault();\n closeAllToasts();\n }\n props.onKeyDown?.(e);\n });\n const usePositionSlot = (toastPosition: ToastPosition) => {\n const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);\n const { announceToast, toasterRef } = useToastAnnounce(announceProp ?? announce);\n return slot.optional(toastsToRender.has(toastPosition) ? rootProps : null, {\n defaultProps: {\n ref: useMergedRefs(focusManagementRef, toasterRef),\n children: toastsToRender.get(toastPosition)?.map(toast => (\n <ToastContainer\n {...toast}\n tryRestoreFocus={tryRestoreFocus}\n intent={toast.intent}\n announce={announceToast}\n key={toast.toastId}\n visible={isToastVisible(toast.toastId)}\n >\n {toast.content as React.ReactNode}\n </ToastContainer>\n )),\n onKeyDown,\n ...focusableGroupAttr,\n 'data-toaster-position': toastPosition,\n role: 'list',\n // Explicitly casting because our slot types can't handle data attributes\n } as ExtractSlotProps<Slot<'div'>>,\n elementType: 'div',\n });\n };\n return {\n dir,\n components: { root: 'div', bottomStart: 'div', bottomEnd: 'div', topStart: 'div', topEnd: 'div' },\n root: slot.always(rootProps, { elementType: 'div' }),\n bottomStart: usePositionSlot(TOAST_POSITIONS.bottomStart),\n bottomEnd: usePositionSlot(TOAST_POSITIONS.bottomEnd),\n topStart: usePositionSlot(TOAST_POSITIONS.topStart),\n topEnd: usePositionSlot(TOAST_POSITIONS.topEnd),\n announceRef,\n offset,\n announce: announceProp ?? announce,\n renderAriaLive: !announceProp,\n };\n};\n"],"names":["React","getNativeElementProps","useEventCallback","useMergedRefs","slot","useFluent_unstable","useFluent","useFocusableGroup","Escape","TOAST_POSITIONS","useToaster","ToastContainer","useToasterFocusManagement_unstable","useToastAnnounce","useToaster_unstable","props","offset","announce","announceProp","rest","announceRef","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","closeAllToasts","useCallback","message","options","current","dir","rootProps","always","elementType","focusableGroupAttr","tabBehavior","ignoreDefaultKeydown","onKeyDown","e","key","preventDefault","usePositionSlot","toastPosition","focusManagementRef","announceToast","toasterRef","optional","has","defaultProps","ref","children","get","map","toast","intent","toastId","visible","content","role","components","root","bottomStart","bottomEnd","topStart","topEnd","renderAriaLive"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAGEC,qBAAqB,EACrBC,gBAAgB,EAChBC,aAAa,EACbC,IAAI,QACC,4BAA4B;AACnC,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,MAAM,QAAQ,0BAA0B;AAEjD,SAASC,eAAe,EAAiBC,UAAU,QAAQ,cAAc;AAEzE,SAASC,cAAc,QAAQ,oBAAoB;AACnD,SAASC,kCAAkC,QAAQ,8BAA8B;AACjF,SAASC,gBAAgB,QAAQ,qBAAqB;AAEtD;;;;CAIC,GACD,OAAO,MAAMC,sBAAsB,CAACC,QAAsC;IACxE,MAAM,EAAEC,OAAM,EAAEC,UAAUC,aAAY,EAAE,GAAGC,MAAM,
|
|
1
|
+
{"version":3,"sources":["useToaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n ExtractSlotProps,\n Slot,\n getNativeElementProps,\n useEventCallback,\n useMergedRefs,\n slot,\n} from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport type { ToasterProps, ToasterState } from './Toaster.types';\nimport { TOAST_POSITIONS, ToastPosition, useToaster } from '../../state';\nimport { Announce } from '../AriaLive';\nimport { ToastContainer } from '../ToastContainer';\nimport { useToasterFocusManagement_unstable } from './useToasterFocusManagement';\nimport { useToastAnnounce } from './useToastAnnounce';\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, mountNode, ...rest } = props;\n const announceRef = React.useRef<Announce>(() => null);\n const { toastsToRender, isToastVisible, pauseAllToasts, playAllToasts, tryRestoreFocus, closeAllToasts } =\n useToaster<HTMLDivElement>(rest);\n const announce = React.useCallback<Announce>((message, options) => announceRef.current(message, options), []);\n const { dir } = useFluent();\n\n const rootProps = slot.always(getNativeElementProps('div', rest), { elementType: 'div' });\n const focusableGroupAttr = useFocusableGroup({\n tabBehavior: 'limited-trap-focus',\n ignoreDefaultKeydown: { Escape: true },\n });\n const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n if (e.key === Escape) {\n e.preventDefault();\n closeAllToasts();\n }\n props.onKeyDown?.(e);\n });\n const usePositionSlot = (toastPosition: ToastPosition) => {\n const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);\n const { announceToast, toasterRef } = useToastAnnounce(announceProp ?? announce);\n return slot.optional(toastsToRender.has(toastPosition) ? rootProps : null, {\n defaultProps: {\n ref: useMergedRefs(focusManagementRef, toasterRef),\n children: toastsToRender.get(toastPosition)?.map(toast => (\n <ToastContainer\n {...toast}\n tryRestoreFocus={tryRestoreFocus}\n intent={toast.intent}\n announce={announceToast}\n key={toast.toastId}\n visible={isToastVisible(toast.toastId)}\n >\n {toast.content as React.ReactNode}\n </ToastContainer>\n )),\n onKeyDown,\n ...focusableGroupAttr,\n 'data-toaster-position': toastPosition,\n role: 'list',\n // Explicitly casting because our slot types can't handle data attributes\n } as ExtractSlotProps<Slot<'div'>>,\n elementType: 'div',\n });\n };\n return {\n dir,\n mountNode,\n components: { root: 'div', bottomStart: 'div', bottomEnd: 'div', topStart: 'div', topEnd: 'div' },\n root: slot.always(rootProps, { elementType: 'div' }),\n bottomStart: usePositionSlot(TOAST_POSITIONS.bottomStart),\n bottomEnd: usePositionSlot(TOAST_POSITIONS.bottomEnd),\n topStart: usePositionSlot(TOAST_POSITIONS.topStart),\n topEnd: usePositionSlot(TOAST_POSITIONS.topEnd),\n announceRef,\n offset,\n announce: announceProp ?? announce,\n renderAriaLive: !announceProp,\n };\n};\n"],"names":["React","getNativeElementProps","useEventCallback","useMergedRefs","slot","useFluent_unstable","useFluent","useFocusableGroup","Escape","TOAST_POSITIONS","useToaster","ToastContainer","useToasterFocusManagement_unstable","useToastAnnounce","useToaster_unstable","props","offset","announce","announceProp","mountNode","rest","announceRef","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","closeAllToasts","useCallback","message","options","current","dir","rootProps","always","elementType","focusableGroupAttr","tabBehavior","ignoreDefaultKeydown","onKeyDown","e","key","preventDefault","usePositionSlot","toastPosition","focusManagementRef","announceToast","toasterRef","optional","has","defaultProps","ref","children","get","map","toast","intent","toastId","visible","content","role","components","root","bottomStart","bottomEnd","topStart","topEnd","renderAriaLive"],"mappings":"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"}
|
|
@@ -16,5 +16,7 @@ const renderToaster_unstable = (state)=>{
|
|
|
16
16
|
const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;
|
|
17
17
|
return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactJsxRuntime.Fragment, null, renderAriaLive ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_ariaLive.AriaLive, {
|
|
18
18
|
announceRef: announceRef
|
|
19
|
-
}) : null, hasToasts ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactPortal.Portal,
|
|
19
|
+
}) : null, hasToasts ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactPortal.Portal, {
|
|
20
|
+
mountNode: state.mountNode
|
|
21
|
+
}, state.bottomStart ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.bottomStart, null) : null, state.bottomEnd ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.bottomEnd, null) : null, state.topStart ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.topStart, null) : null, state.topEnd ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.topEnd, null) : null) : null);
|
|
20
22
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderToaster.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { Portal } from '@fluentui/react-portal';\nimport { AriaLive } from '../AriaLive';\n/**\n * Render the final JSX of Toaster\n */ export const renderToaster_unstable = (state)=>{\n const { announceRef , renderAriaLive } = state;\n assertSlots(state);\n const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;\n return /*#__PURE__*/ createElement(Fragment, null, renderAriaLive ? /*#__PURE__*/ createElement(AriaLive, {\n announceRef: announceRef\n }) : null, hasToasts ? /*#__PURE__*/ createElement(Portal,
|
|
1
|
+
{"version":3,"sources":["renderToaster.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { Portal } from '@fluentui/react-portal';\nimport { AriaLive } from '../AriaLive';\n/**\n * Render the final JSX of Toaster\n */ export const renderToaster_unstable = (state)=>{\n const { announceRef , renderAriaLive } = state;\n assertSlots(state);\n const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;\n return /*#__PURE__*/ createElement(Fragment, null, renderAriaLive ? /*#__PURE__*/ createElement(AriaLive, {\n announceRef: announceRef\n }) : null, hasToasts ? /*#__PURE__*/ createElement(Portal, {\n mountNode: state.mountNode\n }, state.bottomStart ? /*#__PURE__*/ createElement(state.bottomStart, null) : null, state.bottomEnd ? /*#__PURE__*/ createElement(state.bottomEnd, null) : null, state.topStart ? /*#__PURE__*/ createElement(state.topStart, null) : null, state.topEnd ? /*#__PURE__*/ createElement(state.topEnd, null) : null) : null);\n};\n"],"names":["renderToaster_unstable","state","announceRef","renderAriaLive","assertSlots","hasToasts","bottomStart","bottomEnd","topStart","topEnd","createElement","Fragment","AriaLive","Portal","mountNode"],"mappings":"AAAA,wBAAwB,GAAG,sBAAsB,GAAG,uBAAuB;;;;+BAM1DA;;aAAAA;;iCANqG;gCAC1F;6BACL;0BACE;AAGd,MAAMA,yBAAyB,CAACC,QAAQ;IAC/C,MAAM,EAAEC,YAAW,EAAGC,eAAc,EAAG,GAAGF;IAC1CG,IAAAA,2BAAW,EAACH;IACZ,MAAMI,YAAY,CAAC,CAACJ,MAAMK,WAAW,IAAI,CAAC,CAACL,MAAMM,SAAS,IAAI,CAAC,CAACN,MAAMO,QAAQ,IAAI,CAAC,CAACP,MAAMQ,MAAM;IAChG,OAAO,WAAW,GAAGC,IAAAA,8BAAa,EAACC,yBAAQ,EAAE,IAAI,EAAER,iBAAiB,WAAW,GAAGO,IAAAA,8BAAa,EAACE,kBAAQ,EAAE;QACtGV,aAAaA;IACjB,KAAK,IAAI,EAAEG,YAAY,WAAW,GAAGK,IAAAA,8BAAa,EAACG,mBAAM,EAAE;QACvDC,WAAWb,MAAMa,SAAS;IAC9B,GAAGb,MAAMK,WAAW,GAAG,WAAW,GAAGI,IAAAA,8BAAa,EAACT,MAAMK,WAAW,EAAE,IAAI,IAAI,IAAI,EAAEL,MAAMM,SAAS,GAAG,WAAW,GAAGG,IAAAA,8BAAa,EAACT,MAAMM,SAAS,EAAE,IAAI,IAAI,IAAI,EAAEN,MAAMO,QAAQ,GAAG,WAAW,GAAGE,IAAAA,8BAAa,EAACT,MAAMO,QAAQ,EAAE,IAAI,IAAI,IAAI,EAAEP,MAAMQ,MAAM,GAAG,WAAW,GAAGC,IAAAA,8BAAa,EAACT,MAAMQ,MAAM,EAAE,IAAI,IAAI,IAAI,IAAI,IAAI;AAC7T"}
|
|
@@ -17,7 +17,7 @@ const _toastContainer = require("../ToastContainer");
|
|
|
17
17
|
const _useToasterFocusManagement = require("./useToasterFocusManagement");
|
|
18
18
|
const _useToastAnnounce = require("./useToastAnnounce");
|
|
19
19
|
const useToaster_unstable = (props)=>{
|
|
20
|
-
const { offset , announce: announceProp , ...rest } = props;
|
|
20
|
+
const { offset , announce: announceProp , mountNode , ...rest } = props;
|
|
21
21
|
const announceRef = _react.useRef(()=>null);
|
|
22
22
|
const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus , closeAllToasts } = (0, _state.useToaster)(rest);
|
|
23
23
|
const announce = _react.useCallback((message, options)=>announceRef.current(message, options), []);
|
|
@@ -64,6 +64,7 @@ const useToaster_unstable = (props)=>{
|
|
|
64
64
|
};
|
|
65
65
|
return {
|
|
66
66
|
dir,
|
|
67
|
+
mountNode,
|
|
67
68
|
components: {
|
|
68
69
|
root: 'div',
|
|
69
70
|
bottomStart: 'div',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useToaster.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport { TOAST_POSITIONS, useToaster } from '../../state';\nimport { ToastContainer } from '../ToastContainer';\nimport { useToasterFocusManagement_unstable } from './useToasterFocusManagement';\nimport { useToastAnnounce } from './useToastAnnounce';\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 , closeAllToasts } = useToaster(rest);\n const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);\n const { dir } = useFluent();\n const rootProps = slot.always(getNativeElementProps('div', rest), {\n elementType: 'div'\n });\n const focusableGroupAttr = useFocusableGroup({\n tabBehavior: 'limited-trap-focus',\n ignoreDefaultKeydown: {\n Escape: true\n }\n });\n const onKeyDown = useEventCallback((e)=>{\n var _props_onKeyDown;\n if (e.key === Escape) {\n e.preventDefault();\n closeAllToasts();\n }\n (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);\n });\n const usePositionSlot = (toastPosition)=>{\n var _toastsToRender_get;\n const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);\n const { announceToast , toasterRef } = useToastAnnounce(announceProp !== null && announceProp !== void 0 ? announceProp : announce);\n return slot.optional(toastsToRender.has(toastPosition) ? rootProps : null, {\n defaultProps: {\n ref: useMergedRefs(focusManagementRef, toasterRef),\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: announceToast,\n key: toast.toastId,\n visible: isToastVisible(toast.toastId)\n }, toast.content)),\n onKeyDown,\n ...focusableGroupAttr,\n 'data-toaster-position': toastPosition,\n role: 'list'\n },\n elementType: '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: slot.always(rootProps, {\n elementType: 'div'\n }),\n bottomStart: usePositionSlot(TOAST_POSITIONS.bottomStart),\n bottomEnd: usePositionSlot(TOAST_POSITIONS.bottomEnd),\n topStart: usePositionSlot(TOAST_POSITIONS.topStart),\n topEnd: usePositionSlot(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","closeAllToasts","useToaster","useCallback","message","options","current","dir","useFluent","rootProps","slot","always","getNativeElementProps","elementType","focusableGroupAttr","useFocusableGroup","tabBehavior","ignoreDefaultKeydown","Escape","onKeyDown","useEventCallback","e","_props_onKeyDown","key","preventDefault","call","usePositionSlot","toastPosition","_toastsToRender_get","focusManagementRef","useToasterFocusManagement_unstable","announceToast","toasterRef","useToastAnnounce","optional","has","defaultProps","ref","useMergedRefs","children","get","map","toast","createElement","ToastContainer","intent","toastId","visible","content","role","components","root","bottomStart","bottomEnd","topStart","topEnd","TOAST_POSITIONS","renderAriaLive"],"mappings":";;;;+BAaiBA;;aAAAA;;;6DAbM;gCACsD;qCAC7B;8BACd;8BACX;uBACqB;gCACb;2CACoB;kCAClB;AAKtB,MAAMA,sBAAsB,CAACC,QAAQ;IAC5C,MAAM,EAAEC,OAAM,EAAGC,UAAUC,aAAY,EAAG,GAAGC,MAAM,
|
|
1
|
+
{"version":3,"sources":["useToaster.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport { TOAST_POSITIONS, useToaster } from '../../state';\nimport { ToastContainer } from '../ToastContainer';\nimport { useToasterFocusManagement_unstable } from './useToasterFocusManagement';\nimport { useToastAnnounce } from './useToastAnnounce';\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 , mountNode , ...rest } = props;\n const announceRef = React.useRef(()=>null);\n const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus , closeAllToasts } = useToaster(rest);\n const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);\n const { dir } = useFluent();\n const rootProps = slot.always(getNativeElementProps('div', rest), {\n elementType: 'div'\n });\n const focusableGroupAttr = useFocusableGroup({\n tabBehavior: 'limited-trap-focus',\n ignoreDefaultKeydown: {\n Escape: true\n }\n });\n const onKeyDown = useEventCallback((e)=>{\n var _props_onKeyDown;\n if (e.key === Escape) {\n e.preventDefault();\n closeAllToasts();\n }\n (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);\n });\n const usePositionSlot = (toastPosition)=>{\n var _toastsToRender_get;\n const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);\n const { announceToast , toasterRef } = useToastAnnounce(announceProp !== null && announceProp !== void 0 ? announceProp : announce);\n return slot.optional(toastsToRender.has(toastPosition) ? rootProps : null, {\n defaultProps: {\n ref: useMergedRefs(focusManagementRef, toasterRef),\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: announceToast,\n key: toast.toastId,\n visible: isToastVisible(toast.toastId)\n }, toast.content)),\n onKeyDown,\n ...focusableGroupAttr,\n 'data-toaster-position': toastPosition,\n role: 'list'\n },\n elementType: 'div'\n });\n };\n return {\n dir,\n mountNode,\n components: {\n root: 'div',\n bottomStart: 'div',\n bottomEnd: 'div',\n topStart: 'div',\n topEnd: 'div'\n },\n root: slot.always(rootProps, {\n elementType: 'div'\n }),\n bottomStart: usePositionSlot(TOAST_POSITIONS.bottomStart),\n bottomEnd: usePositionSlot(TOAST_POSITIONS.bottomEnd),\n topStart: usePositionSlot(TOAST_POSITIONS.topStart),\n topEnd: usePositionSlot(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","mountNode","rest","announceRef","React","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","closeAllToasts","useToaster","useCallback","message","options","current","dir","useFluent","rootProps","slot","always","getNativeElementProps","elementType","focusableGroupAttr","useFocusableGroup","tabBehavior","ignoreDefaultKeydown","Escape","onKeyDown","useEventCallback","e","_props_onKeyDown","key","preventDefault","call","usePositionSlot","toastPosition","_toastsToRender_get","focusManagementRef","useToasterFocusManagement_unstable","announceToast","toasterRef","useToastAnnounce","optional","has","defaultProps","ref","useMergedRefs","children","get","map","toast","createElement","ToastContainer","intent","toastId","visible","content","role","components","root","bottomStart","bottomEnd","topStart","topEnd","TOAST_POSITIONS","renderAriaLive"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-toast",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.2.0",
|
|
4
4
|
"description": "Toast component for Fluent UI",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -37,14 +37,14 @@
|
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"react-transition-group": "^4.4.1",
|
|
39
39
|
"@fluentui/keyboard-keys": "^9.0.3",
|
|
40
|
-
"@fluentui/react-aria": "^9.3.
|
|
40
|
+
"@fluentui/react-aria": "^9.3.33",
|
|
41
41
|
"@fluentui/react-icons": "^2.0.207",
|
|
42
|
-
"@fluentui/react-jsx-runtime": "^9.0.
|
|
43
|
-
"@fluentui/react-portal": "^9.3.
|
|
42
|
+
"@fluentui/react-jsx-runtime": "^9.0.3",
|
|
43
|
+
"@fluentui/react-portal": "^9.3.10",
|
|
44
44
|
"@fluentui/react-shared-contexts": "^9.7.2",
|
|
45
|
-
"@fluentui/react-tabster": "^9.12.
|
|
45
|
+
"@fluentui/react-tabster": "^9.12.5",
|
|
46
46
|
"@fluentui/react-theme": "^9.1.11",
|
|
47
|
-
"@fluentui/react-utilities": "^9.
|
|
47
|
+
"@fluentui/react-utilities": "^9.13.0",
|
|
48
48
|
"@griffel/react": "^1.5.14",
|
|
49
49
|
"@swc/helpers": "^0.4.14"
|
|
50
50
|
},
|