@fluentui/react-toast 9.1.0 → 9.1.2

package/lib/components/ToastFooter/renderToastFooter.js

@@ -1,8 +1,8 @@
 /** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
-import { getSlotsNext } from '@fluentui/react-utilities';
+import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of ToastFooter
  */ export const renderToastFooter_unstable = (state)=>{
-    const { slots , slotProps  } = getSlotsNext(state);
-    return /*#__PURE__*/ createElement(slots.root, slotProps.root);
+    assertSlots(state);
+    return /*#__PURE__*/ createElement(state.root, null);
 };

package/lib/components/ToastFooter/renderToastFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderToastFooter.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { ToastFooterState, ToastFooterSlots } from './ToastFooter.types';\n\n/**\n * Render the final JSX of ToastFooter\n */\nexport const renderToastFooter_unstable = (state: ToastFooterState) => {\n  const { slots, slotProps } = getSlotsNext<ToastFooterSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"names":["createElement","getSlotsNext","renderToastFooter_unstable","state","slots","slotProps","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC,QAA4B;IACrE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAA+BE;IAE5D,qBAAO,AAZT,cAYUC,MAAME,IAAI,EAAKD,UAAUC,IAAI;AACvC,EAAE"}
+{"version":3,"sources":["renderToastFooter.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { ToastFooterState, ToastFooterSlots } from './ToastFooter.types';\n\n/**\n * Render the final JSX of ToastFooter\n */\nexport const renderToastFooter_unstable = (state: ToastFooterState) => {\n  assertSlots<ToastFooterSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["createElement","assertSlots","renderToastFooter_unstable","state","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC,QAA4B;IACrEF,YAA8BE;IAE9B,qBAAO,AAZT,cAYUA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/ToastFooter/useToastFooter.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { getNativeElementProps } from '@fluentui/react-utilities';
+import { getNativeElementProps, slot } from '@fluentui/react-utilities';
 /**
  * Create the state required to render ToastFooter.
  *
@@ -13,9 +13,11 @@ import { getNativeElementProps } from '@fluentui/react-utilities';
         components: {
             root: 'div'
         },
-        root: getNativeElementProps('div', {
+        root: slot.always(getNativeElementProps('div', {
             ref,
             ...props
+        }), {
+            elementType: 'div'
         })
     };
 };

package/lib/components/ToastFooter/useToastFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToastFooter.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ToastFooterProps, ToastFooterState } from './ToastFooter.types';\n\n/**\n * Create the state required to render ToastFooter.\n *\n * The returned state can be modified with hooks such as useToastFooterStyles_unstable,\n * before being passed to renderToastFooter_unstable.\n *\n * @param props - props from this instance of ToastFooter\n * @param ref - reference to root HTMLElement of ToastFooter\n */\nexport const useToastFooter_unstable = (props: ToastFooterProps, ref: React.Ref<HTMLElement>): ToastFooterState => {\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      ...props,\n    }),\n  };\n};\n"],"names":["React","getNativeElementProps","useToastFooter_unstable","props","ref","components","root"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,4BAA4B;AAGlE;;;;;;;;CAQC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC,MAAkD;IACjH,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAA,MAAML,sBAAsB,OAAO;YACjCG;YACA,GAAGD,KAAK;QACV;IACF;AACF,EAAE"}
+{"version":3,"sources":["useToastFooter.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport type { ToastFooterProps, ToastFooterState } from './ToastFooter.types';\n\n/**\n * Create the state required to render ToastFooter.\n *\n * The returned state can be modified with hooks such as useToastFooterStyles_unstable,\n * before being passed to renderToastFooter_unstable.\n *\n * @param props - props from this instance of ToastFooter\n * @param ref - reference to root HTMLElement of ToastFooter\n */\nexport const useToastFooter_unstable = (props: ToastFooterProps, ref: React.Ref<HTMLElement>): ToastFooterState => {\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useToastFooter_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAGxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC,MAAkD;IACjH,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,OAAO;YAC3BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/ToastFooter/useToastFooterStyles.styles.js

@@ -5,7 +5,7 @@ export const toastFooterClassNames = {
 /**
  * Styles for the root slot
  */
-const useRootBaseClassName = /*#__PURE__*/__resetStyles("r1u6izx1", null, [".r1u6izx1{padding-top:16px;-ms-grid-column:2;grid-column-start:2;-ms-grid-row-span:1;grid-column-end:3;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:14px;column-gap:14px;row-gap:14px;}"]);
+const useRootBaseClassName = /*#__PURE__*/__resetStyles("r1u6izx1", null, [".r1u6izx1{padding-top:16px;grid-column-start:2;grid-column-end:3;display:flex;align-items:center;column-gap:14px;row-gap:14px;}"]);
 /**
  * Apply styling to the ToastFooter slots based on the state
  */

package/lib/components/ToastFooter/useToastFooterStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__resetStyles","mergeClasses","shorthands","toastFooterClassNames","root","useRootBaseClassName","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"sources":["useToastFooterStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nexport const toastFooterClassNames = {\n    root: 'fui-ToastFooter'\n};\n/**\n * Styles for the root slot\n */ const useRootBaseClassName = makeResetStyles({\n    paddingTop: '16px',\n    gridColumnStart: 2,\n    gridColumnEnd: 3,\n    display: 'flex',\n    alignItems: 'center',\n    ...shorthands.gap('14px')\n});\n/**\n * Apply styling to the ToastFooter slots based on the state\n */ export const useToastFooterStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAC1E,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,oBAAoB,gBAAGL,aAAA,2VAOhC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMM,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;EAChDE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGR,YAAY,CAACE,qBAAqB,CAACC,IAAI,EAAEI,iBAAiB,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EACxG,OAAOF,KAAK;AAChB,CAAC"}
+{"version":3,"names":["__resetStyles","mergeClasses","shorthands","toastFooterClassNames","root","useRootBaseClassName","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"sources":["useToastFooterStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses, shorthands } from '@griffel/react';\nexport const toastFooterClassNames = {\n    root: 'fui-ToastFooter'\n};\n/**\n * Styles for the root slot\n */ const useRootBaseClassName = makeResetStyles({\n    paddingTop: '16px',\n    gridColumnStart: 2,\n    gridColumnEnd: 3,\n    display: 'flex',\n    alignItems: 'center',\n    ...shorthands.gap('14px')\n});\n/**\n * Apply styling to the ToastFooter slots based on the state\n */ export const useToastFooterStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAC1E,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,oBAAoB,gBAAGL,aAAA,sJAOhC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMM,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;EAChDE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGR,YAAY,CAACE,qBAAqB,CAACC,IAAI,EAAEI,iBAAiB,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EACxG,OAAOF,KAAK;AAChB,CAAC"}

package/lib/components/ToastTitle/renderToastTitle.js

@@ -1,8 +1,8 @@
 /** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';
-import { getSlotsNext } from '@fluentui/react-utilities';
+import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of ToastTitle
  */ export const renderToastTitle_unstable = (state)=>{
-    const { slots , slotProps  } = getSlotsNext(state);
-    return /*#__PURE__*/ createElement(Fragment, null, slots.media ? /*#__PURE__*/ createElement(slots.media, slotProps.media) : null, /*#__PURE__*/ createElement(slots.root, slotProps.root), slots.action ? /*#__PURE__*/ createElement(slots.action, slotProps.action) : null);
+    assertSlots(state);
+    return /*#__PURE__*/ createElement(Fragment, null, state.media ? /*#__PURE__*/ createElement(state.media, null) : null, /*#__PURE__*/ createElement(state.root, null), state.action ? /*#__PURE__*/ createElement(state.action, null) : null);
 };

package/lib/components/ToastTitle/renderToastTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderToastTitle.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsxFrag Fragment */\n/** @jsx createElement */\n\nimport { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { ToastTitleState, ToastTitleSlots } from './ToastTitle.types';\n\n/**\n * Render the final JSX of ToastTitle\n */\nexport const renderToastTitle_unstable = (state: ToastTitleState) => {\n  const { slots, slotProps } = getSlotsNext<ToastTitleSlots>(state);\n\n  return (\n    <>\n      {slots.media ? <slots.media {...slotProps.media} /> : null}\n      <slots.root {...slotProps.root} />\n      {slots.action ? <slots.action {...slotProps.action} /> : null}\n    </>\n  );\n};\n"],"names":["createElement","Fragment","getSlotsNext","renderToastTitle_unstable","state","slots","slotProps","media","root","action"],"mappings":"AAAA,wBAAwB,GACxB,sBAAsB,GACtB,uBAAuB,GAEvB,SAASA,aAAa,EAAEC,QAAQ,QAAQ,8BAA8B;AACtE,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC,QAA2B;IACnE,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAA8BE;IAE3D,qBACE,AAbJ,cADA,gBAeOC,MAAME,KAAK,iBAAG,AAdrB,cAcsBF,MAAME,KAAK,EAAKD,UAAUC,KAAK,IAAO,IAAI,gBAC1D,AAfN,cAeOF,MAAMG,IAAI,EAAKF,UAAUE,IAAI,GAC7BH,MAAMI,MAAM,iBAAG,AAhBtB,cAgBuBJ,MAAMI,MAAM,EAAKH,UAAUG,MAAM,IAAO,IAAI;AAGnE,EAAE"}
+{"version":3,"sources":["renderToastTitle.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 type { ToastTitleState, ToastTitleSlots } from './ToastTitle.types';\n\n/**\n * Render the final JSX of ToastTitle\n */\nexport const renderToastTitle_unstable = (state: ToastTitleState) => {\n  assertSlots<ToastTitleSlots>(state);\n\n  return (\n    <>\n      {state.media ? <state.media /> : null}\n      <state.root />\n      {state.action ? <state.action /> : null}\n    </>\n  );\n};\n"],"names":["createElement","Fragment","assertSlots","renderToastTitle_unstable","state","media","root","action"],"mappings":"AAAA,wBAAwB,GACxB,sBAAsB,GACtB,uBAAuB,GAEvB,SAASA,aAAa,EAAEC,QAAQ,QAAQ,8BAA8B;AACtE,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC,QAA2B;IACnEF,YAA6BE;IAE7B,qBACE,AAbJ,cADA,gBAeOA,MAAMC,KAAK,iBAAG,AAdrB,cAcsBD,MAAMC,KAAK,UAAM,IAAI,gBACrC,AAfN,cAeOD,MAAME,IAAI,SACVF,MAAMG,MAAM,iBAAG,AAhBtB,cAgBuBH,MAAMG,MAAM,UAAM,IAAI;AAG7C,EAAE"}

package/lib/components/ToastTitle/useToastTitle.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { CheckmarkCircleFilled, DismissCircleFilled, InfoFilled, WarningFilled } from '@fluentui/react-icons';
-import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
+import { getNativeElementProps, slot } from '@fluentui/react-utilities';
 import { useBackgroundAppearance } from '@fluentui/react-shared-contexts';
 import { useToastContainerContext } from '../../contexts/toastContainerContext';
 /**
@@ -30,23 +30,28 @@ import { useToastContainerContext } from '../../contexts/toastContainerContext';
             break;
     }
     return {
-        action: resolveShorthand(props.action),
+        action: slot.optional(props.action, {
+            elementType: 'div'
+        }),
         components: {
             root: 'div',
             media: 'div',
             action: 'div'
         },
-        media: resolveShorthand(props.media, {
-            required: !!intent,
+        media: slot.optional(props.media, {
+            renderByDefault: !!intent,
             defaultProps: {
                 children: defaultIcon
-            }
+            },
+            elementType: 'div'
         }),
-        root: getNativeElementProps('div', {
+        root: slot.always(getNativeElementProps('div', {
             ref,
             children: props.children,
             id: titleId,
             ...props
+        }), {
+            elementType: 'div'
         }),
         intent,
         backgroundAppearance

package/lib/components/ToastTitle/useToastTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToastTitle.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircleFilled, DismissCircleFilled, InfoFilled, WarningFilled } from '@fluentui/react-icons';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { useBackgroundAppearance } from '@fluentui/react-shared-contexts';\n\nimport type { ToastTitleProps, ToastTitleState } from './ToastTitle.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\n\n/**\n * Create the state required to render ToastTitle.\n *\n * The returned state can be modified with hooks such as useToastTitleStyles_unstable,\n * before being passed to renderToastTitle_unstable.\n *\n * @param props - props from this instance of ToastTitle\n * @param ref - reference to root HTMLElement of ToastTitle\n */\nexport const useToastTitle_unstable = (props: ToastTitleProps, ref: React.Ref<HTMLElement>): ToastTitleState => {\n  const { intent, titleId } = useToastContainerContext();\n  const backgroundAppearance = useBackgroundAppearance();\n\n  /** Determine the role and media to render based on the intent */\n  let defaultIcon;\n  switch (intent) {\n    case 'success':\n      defaultIcon = <CheckmarkCircleFilled />;\n      break;\n    case 'error':\n      defaultIcon = <DismissCircleFilled />;\n      break;\n    case 'warning':\n      defaultIcon = <WarningFilled />;\n      break;\n    case 'info':\n      defaultIcon = <InfoFilled />;\n      break;\n  }\n\n  return {\n    action: resolveShorthand(props.action),\n    components: {\n      root: 'div',\n      media: 'div',\n      action: 'div',\n    },\n    media: resolveShorthand(props.media, { required: !!intent, defaultProps: { children: defaultIcon } }),\n    root: getNativeElementProps('div', {\n      ref,\n      children: props.children,\n      id: titleId,\n      ...props,\n    }),\n    intent,\n    backgroundAppearance,\n  };\n};\n"],"names":["React","CheckmarkCircleFilled","DismissCircleFilled","InfoFilled","WarningFilled","getNativeElementProps","resolveShorthand","useBackgroundAppearance","useToastContainerContext","useToastTitle_unstable","props","ref","intent","titleId","backgroundAppearance","defaultIcon","action","components","root","media","required","defaultProps","children","id"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,qBAAqB,EAAEC,mBAAmB,EAAEC,UAAU,EAAEC,aAAa,QAAQ,wBAAwB;AAC9G,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,4BAA4B;AACpF,SAASC,uBAAuB,QAAQ,kCAAkC;AAG1E,SAASC,wBAAwB,QAAQ,uCAAuC;AAEhF;;;;;;;;CAQC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAwBC,MAAiD;IAC9G,MAAM,EAAEC,OAAM,EAAEC,QAAO,EAAE,GAAGL;IAC5B,MAAMM,uBAAuBP;IAE7B,+DAA+D,GAC/D,IAAIQ;IACJ,OAAQH;QACN,KAAK;YACHG,4BAAc,oBAACd;YACf,KAAM;QACR,KAAK;YACHc,4BAAc,oBAACb;YACf,KAAM;QACR,KAAK;YACHa,4BAAc,oBAACX;YACf,KAAM;QACR,KAAK;YACHW,4BAAc,oBAACZ;YACf,KAAM;IACV;IAEA,OAAO;QACLa,QAAQV,iBAAiBI,MAAMM,MAAM;QACrCC,YAAY;YACVC,MAAM;YACNC,OAAO;YACPH,QAAQ;QACV;QACAG,OAAOb,iBAAiBI,MAAMS,KAAK,EAAE;YAAEC,UAAU,CAAC,CAACR;YAAQS,cAAc;gBAAEC,UAAUP;YAAY;QAAE;QACnGG,MAAMb,sBAAsB,OAAO;YACjCM;YACAW,UAAUZ,MAAMY,QAAQ;YACxBC,IAAIV;YACJ,GAAGH,KAAK;QACV;QACAE;QACAE;IACF;AACF,EAAE"}
+{"version":3,"sources":["useToastTitle.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircleFilled, DismissCircleFilled, InfoFilled, WarningFilled } from '@fluentui/react-icons';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useBackgroundAppearance } from '@fluentui/react-shared-contexts';\n\nimport type { ToastTitleProps, ToastTitleState } from './ToastTitle.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\n\n/**\n * Create the state required to render ToastTitle.\n *\n * The returned state can be modified with hooks such as useToastTitleStyles_unstable,\n * before being passed to renderToastTitle_unstable.\n *\n * @param props - props from this instance of ToastTitle\n * @param ref - reference to root HTMLElement of ToastTitle\n */\nexport const useToastTitle_unstable = (props: ToastTitleProps, ref: React.Ref<HTMLElement>): ToastTitleState => {\n  const { intent, titleId } = useToastContainerContext();\n  const backgroundAppearance = useBackgroundAppearance();\n\n  /** Determine the role and media to render based on the intent */\n  let defaultIcon;\n  switch (intent) {\n    case 'success':\n      defaultIcon = <CheckmarkCircleFilled />;\n      break;\n    case 'error':\n      defaultIcon = <DismissCircleFilled />;\n      break;\n    case 'warning':\n      defaultIcon = <WarningFilled />;\n      break;\n    case 'info':\n      defaultIcon = <InfoFilled />;\n      break;\n  }\n\n  return {\n    action: slot.optional(props.action, { elementType: 'div' }),\n    components: { root: 'div', media: 'div', action: 'div' },\n    media: slot.optional(props.media, {\n      renderByDefault: !!intent,\n      defaultProps: { children: defaultIcon },\n      elementType: 'div',\n    }),\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        children: props.children,\n        id: titleId,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    intent,\n    backgroundAppearance,\n  };\n};\n"],"names":["React","CheckmarkCircleFilled","DismissCircleFilled","InfoFilled","WarningFilled","getNativeElementProps","slot","useBackgroundAppearance","useToastContainerContext","useToastTitle_unstable","props","ref","intent","titleId","backgroundAppearance","defaultIcon","action","optional","elementType","components","root","media","renderByDefault","defaultProps","children","always","id"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,qBAAqB,EAAEC,mBAAmB,EAAEC,UAAU,EAAEC,aAAa,QAAQ,wBAAwB;AAC9G,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AACxE,SAASC,uBAAuB,QAAQ,kCAAkC;AAG1E,SAASC,wBAAwB,QAAQ,uCAAuC;AAEhF;;;;;;;;CAQC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAwBC,MAAiD;IAC9G,MAAM,EAAEC,OAAM,EAAEC,QAAO,EAAE,GAAGL;IAC5B,MAAMM,uBAAuBP;IAE7B,+DAA+D,GAC/D,IAAIQ;IACJ,OAAQH;QACN,KAAK;YACHG,4BAAc,oBAACd;YACf,KAAM;QACR,KAAK;YACHc,4BAAc,oBAACb;YACf,KAAM;QACR,KAAK;YACHa,4BAAc,oBAACX;YACf,KAAM;QACR,KAAK;YACHW,4BAAc,oBAACZ;YACf,KAAM;IACV;IAEA,OAAO;QACLa,QAAQV,KAAKW,QAAQ,CAACP,MAAMM,MAAM,EAAE;YAAEE,aAAa;QAAM;QACzDC,YAAY;YAAEC,MAAM;YAAOC,OAAO;YAAOL,QAAQ;QAAM;QACvDK,OAAOf,KAAKW,QAAQ,CAACP,MAAMW,KAAK,EAAE;YAChCC,iBAAiB,CAAC,CAACV;YACnBW,cAAc;gBAAEC,UAAUT;YAAY;YACtCG,aAAa;QACf;QACAE,MAAMd,KAAKmB,MAAM,CACfpB,sBAAsB,OAAO;YAC3BM;YACAa,UAAUd,MAAMc,QAAQ;YACxBE,IAAIb;YACJ,GAAGH,KAAK;QACV,IACA;YAAEQ,aAAa;QAAM;QAEvBN;QACAE;IACF;AACF,EAAE"}

package/lib/components/ToastTitle/useToastTitleStyles.styles.js

@@ -5,9 +5,9 @@ export const toastTitleClassNames = {
   media: 'fui-ToastTitle__media',
   action: 'fui-ToastTitle__action'
 };
-const useRootBaseClassName = /*#__PURE__*/__resetStyles("r1mlor6q", null, [".r1mlor6q{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-grid-column-span:3;grid-column-end:3;color:var(--colorNeutralForeground1);}"]);
-const useMediaBaseClassName = /*#__PURE__*/__resetStyles("rnm72z1", "rzj6g76", [".rnm72z1{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-grid-column-span:2;grid-column-end:2;padding-right:8px;font-size:16px;color:var(--colorNeutralForeground1);}", ".rzj6g76{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-grid-column-span:2;grid-column-end:2;padding-left:8px;font-size:16px;color:var(--colorNeutralForeground1);}"]);
-const useActionBaseClassName = /*#__PURE__*/__resetStyles("r5vrc68", "rzqb88z", [".r5vrc68{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:12px;-ms-grid-column-span:-1;grid-column-end:-1;color:var(--colorBrandForeground1);}", ".rzqb88z{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-right:12px;-ms-grid-column-span:-1;grid-column-end:-1;color:var(--colorBrandForeground1);}"]);
+const useRootBaseClassName = /*#__PURE__*/__resetStyles("r1mlor6q", null, [".r1mlor6q{display:flex;align-items:center;grid-column-end:3;color:var(--colorNeutralForeground1);}"]);
+const useMediaBaseClassName = /*#__PURE__*/__resetStyles("rnm72z1", "rzj6g76", [".rnm72z1{display:flex;align-items:center;grid-column-end:2;padding-right:8px;font-size:16px;color:var(--colorNeutralForeground1);}", ".rzj6g76{display:flex;align-items:center;grid-column-end:2;padding-left:8px;font-size:16px;color:var(--colorNeutralForeground1);}"]);
+const useActionBaseClassName = /*#__PURE__*/__resetStyles("r5vrc68", "rzqb88z", [".r5vrc68{display:flex;align-items:center;padding-left:12px;grid-column-end:-1;color:var(--colorBrandForeground1);}", ".rzqb88z{display:flex;align-items:center;padding-right:12px;grid-column-end:-1;color:var(--colorBrandForeground1);}"]);
 const useInvertedStyles = /*#__PURE__*/__styles({
   root: {
     sj55zd: "f1w7i9ko"

package/lib/components/ToastTitle/useToastTitleStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","__resetStyles","mergeClasses","tokens","toastTitleClassNames","root","media","action","useRootBaseClassName","useMediaBaseClassName","useActionBaseClassName","useInvertedStyles","sj55zd","d","useIntentIconStyles","success","error","warning","info","useIntentIconStylesInverted","useToastTitleStyles_unstable","state","rootBaseClassName","actionBaseClassName","mediaBaseClassName","intentIconStyles","intentIconStylesInverted","intent","invertedStyles","className","backgroundAppearance"],"sources":["useToastTitleStyles.styles.js"],"sourcesContent":["import { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const toastTitleClassNames = {\n    root: 'fui-ToastTitle',\n    media: 'fui-ToastTitle__media',\n    action: 'fui-ToastTitle__action'\n};\nconst useRootBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'center',\n    gridColumnEnd: 3,\n    color: tokens.colorNeutralForeground1\n});\nconst useMediaBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'center',\n    gridColumnEnd: 2,\n    paddingRight: '8px',\n    fontSize: '16px',\n    color: tokens.colorNeutralForeground1\n});\nconst useActionBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'center',\n    paddingLeft: '12px',\n    gridColumnEnd: -1,\n    color: tokens.colorBrandForeground1\n});\nconst useInvertedStyles = makeStyles({\n    root: {\n        color: tokens.colorNeutralForegroundInverted2\n    },\n    action: {\n        color: tokens.colorBrandForegroundInverted\n    },\n    media: {\n        color: tokens.colorNeutralForegroundInverted\n    }\n});\nconst useIntentIconStyles = makeStyles({\n    success: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteGreenForeground3\n    },\n    error: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteCranberryForeground2\n    },\n    warning: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    info: {\n        color: tokens.colorNeutralForeground2\n    }\n});\nconst useIntentIconStylesInverted = makeStyles({\n    success: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteGreenForegroundInverted\n    },\n    error: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteRedForegroundInverted\n    },\n    warning: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteYellowForegroundInverted\n    },\n    info: {\n        color: tokens.colorNeutralForegroundInverted2\n    }\n});\n/**\n * Apply styling to the ToastTitle slots based on the state\n */ export const useToastTitleStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    const actionBaseClassName = useActionBaseClassName();\n    const mediaBaseClassName = useMediaBaseClassName();\n    const intentIconStyles = useIntentIconStyles();\n    const intentIconStylesInverted = useIntentIconStylesInverted();\n    const { intent  } = state;\n    const invertedStyles = useInvertedStyles();\n    state.root.className = mergeClasses(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n    if (state.media) {\n        state.media.className = mergeClasses(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, state.media.className, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent]);\n    }\n    if (state.action) {\n        state.action.className = mergeClasses(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAAC,aAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE,gBAAgB;EACtBC,KAAK,EAAE,uBAAuB;EAC9BC,MAAM,EAAE;AACZ,CAAC;AACD,MAAMC,oBAAoB,gBAAGP,aAAA,uRAK5B,CAAC;AACF,MAAMQ,qBAAqB,gBAAGR,aAAA,8lBAO7B,CAAC;AACF,MAAMS,sBAAsB,gBAAGT,aAAA,kkBAM9B,CAAC;AACF,MAAMU,iBAAiB,gBAAGX,QAAA;EAAAK,IAAA;IAAAO,MAAA;EAAA;EAAAL,MAAA;IAAAK,MAAA;EAAA;EAAAN,KAAA;IAAAM,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAUzB,CAAC;AACF,MAAMC,mBAAmB,gBAAGd,QAAA;EAAAe,OAAA;IAAAH,MAAA;EAAA;EAAAI,KAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;EAAAM,IAAA;IAAAN,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAgB3B,CAAC;AACF,MAAMM,2BAA2B,gBAAGnB,QAAA;EAAAe,OAAA;IAAAH,MAAA;EAAA;EAAAI,KAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;EAAAM,IAAA;IAAAN,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAgBnC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,iBAAiB,GAAGd,oBAAoB,CAAC,CAAC;EAChD,MAAMe,mBAAmB,GAAGb,sBAAsB,CAAC,CAAC;EACpD,MAAMc,kBAAkB,GAAGf,qBAAqB,CAAC,CAAC;EAClD,MAAMgB,gBAAgB,GAAGX,mBAAmB,CAAC,CAAC;EAC9C,MAAMY,wBAAwB,GAAGP,2BAA2B,CAAC,CAAC;EAC9D,MAAM;IAAEQ;EAAQ,CAAC,GAAGN,KAAK;EACzB,MAAMO,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;EAC1CU,KAAK,CAAChB,IAAI,CAACwB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACC,IAAI,EAAEiB,iBAAiB,EAAED,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACvB,IAAI,EAAEgB,KAAK,CAAChB,IAAI,CAACwB,SAAS,CAAC;EACzK,IAAIR,KAAK,CAACf,KAAK,EAAE;IACbe,KAAK,CAACf,KAAK,CAACuB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACE,KAAK,EAAEkB,kBAAkB,EAAEH,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACtB,KAAK,EAAEe,KAAK,CAACf,KAAK,CAACuB,SAAS,EAAEF,MAAM,IAAIF,gBAAgB,CAACE,MAAM,CAAC,EAAEA,MAAM,IAAIN,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIJ,wBAAwB,CAACC,MAAM,CAAC,CAAC;EAC/S;EACA,IAAIN,KAAK,CAACd,MAAM,EAAE;IACdc,KAAK,CAACd,MAAM,CAACsB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACG,MAAM,EAAEgB,mBAAmB,EAAEF,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACrB,MAAM,EAAEc,KAAK,CAACd,MAAM,CAACsB,SAAS,CAAC;EACvL;EACA,OAAOR,KAAK;AAChB,CAAC"}
+{"version":3,"names":["__styles","__resetStyles","mergeClasses","tokens","toastTitleClassNames","root","media","action","useRootBaseClassName","useMediaBaseClassName","useActionBaseClassName","useInvertedStyles","sj55zd","d","useIntentIconStyles","success","error","warning","info","useIntentIconStylesInverted","useToastTitleStyles_unstable","state","rootBaseClassName","actionBaseClassName","mediaBaseClassName","intentIconStyles","intentIconStylesInverted","intent","invertedStyles","className","backgroundAppearance"],"sources":["useToastTitleStyles.styles.js"],"sourcesContent":["import { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const toastTitleClassNames = {\n    root: 'fui-ToastTitle',\n    media: 'fui-ToastTitle__media',\n    action: 'fui-ToastTitle__action'\n};\nconst useRootBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'center',\n    gridColumnEnd: 3,\n    color: tokens.colorNeutralForeground1\n});\nconst useMediaBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'center',\n    gridColumnEnd: 2,\n    paddingRight: '8px',\n    fontSize: '16px',\n    color: tokens.colorNeutralForeground1\n});\nconst useActionBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'center',\n    paddingLeft: '12px',\n    gridColumnEnd: -1,\n    color: tokens.colorBrandForeground1\n});\nconst useInvertedStyles = makeStyles({\n    root: {\n        color: tokens.colorNeutralForegroundInverted2\n    },\n    action: {\n        color: tokens.colorBrandForegroundInverted\n    },\n    media: {\n        color: tokens.colorNeutralForegroundInverted\n    }\n});\nconst useIntentIconStyles = makeStyles({\n    success: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteGreenForeground3\n    },\n    error: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteCranberryForeground2\n    },\n    warning: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteDarkOrangeForeground1\n    },\n    info: {\n        color: tokens.colorNeutralForeground2\n    }\n});\nconst useIntentIconStylesInverted = makeStyles({\n    success: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteGreenForegroundInverted\n    },\n    error: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteRedForegroundInverted\n    },\n    warning: {\n        // FIXME https://github.com/microsoft/fluentui/issues/28219\n        color: tokens.colorPaletteYellowForegroundInverted\n    },\n    info: {\n        color: tokens.colorNeutralForegroundInverted2\n    }\n});\n/**\n * Apply styling to the ToastTitle slots based on the state\n */ export const useToastTitleStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    const actionBaseClassName = useActionBaseClassName();\n    const mediaBaseClassName = useMediaBaseClassName();\n    const intentIconStyles = useIntentIconStyles();\n    const intentIconStylesInverted = useIntentIconStylesInverted();\n    const { intent  } = state;\n    const invertedStyles = useInvertedStyles();\n    state.root.className = mergeClasses(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n    if (state.media) {\n        state.media.className = mergeClasses(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, state.media.className, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent]);\n    }\n    if (state.action) {\n        state.action.className = mergeClasses(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAAC,aAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE,gBAAgB;EACtBC,KAAK,EAAE,uBAAuB;EAC9BC,MAAM,EAAE;AACZ,CAAC;AACD,MAAMC,oBAAoB,gBAAGP,aAAA,yHAK5B,CAAC;AACF,MAAMQ,qBAAqB,gBAAGR,aAAA,kSAO7B,CAAC;AACF,MAAMS,sBAAsB,gBAAGT,aAAA,oQAM9B,CAAC;AACF,MAAMU,iBAAiB,gBAAGX,QAAA;EAAAK,IAAA;IAAAO,MAAA;EAAA;EAAAL,MAAA;IAAAK,MAAA;EAAA;EAAAN,KAAA;IAAAM,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAUzB,CAAC;AACF,MAAMC,mBAAmB,gBAAGd,QAAA;EAAAe,OAAA;IAAAH,MAAA;EAAA;EAAAI,KAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;EAAAM,IAAA;IAAAN,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAgB3B,CAAC;AACF,MAAMM,2BAA2B,gBAAGnB,QAAA;EAAAe,OAAA;IAAAH,MAAA;EAAA;EAAAI,KAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;EAAAM,IAAA;IAAAN,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAgBnC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,iBAAiB,GAAGd,oBAAoB,CAAC,CAAC;EAChD,MAAMe,mBAAmB,GAAGb,sBAAsB,CAAC,CAAC;EACpD,MAAMc,kBAAkB,GAAGf,qBAAqB,CAAC,CAAC;EAClD,MAAMgB,gBAAgB,GAAGX,mBAAmB,CAAC,CAAC;EAC9C,MAAMY,wBAAwB,GAAGP,2BAA2B,CAAC,CAAC;EAC9D,MAAM;IAAEQ;EAAQ,CAAC,GAAGN,KAAK;EACzB,MAAMO,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;EAC1CU,KAAK,CAAChB,IAAI,CAACwB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACC,IAAI,EAAEiB,iBAAiB,EAAED,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACvB,IAAI,EAAEgB,KAAK,CAAChB,IAAI,CAACwB,SAAS,CAAC;EACzK,IAAIR,KAAK,CAACf,KAAK,EAAE;IACbe,KAAK,CAACf,KAAK,CAACuB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACE,KAAK,EAAEkB,kBAAkB,EAAEH,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACtB,KAAK,EAAEe,KAAK,CAACf,KAAK,CAACuB,SAAS,EAAEF,MAAM,IAAIF,gBAAgB,CAACE,MAAM,CAAC,EAAEA,MAAM,IAAIN,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIJ,wBAAwB,CAACC,MAAM,CAAC,CAAC;EAC/S;EACA,IAAIN,KAAK,CAACd,MAAM,EAAE;IACdc,KAAK,CAACd,MAAM,CAACsB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACG,MAAM,EAAEgB,mBAAmB,EAAEF,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACrB,MAAM,EAAEc,KAAK,CAACd,MAAM,CAACsB,SAAS,CAAC;EACvL;EACA,OAAOR,KAAK;AAChB,CAAC"}

package/lib/components/Toaster/renderToaster.js

@@ -1,14 +1,14 @@
 /** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';
-import { getSlotsNext } from '@fluentui/react-utilities';
+import { assertSlots } from '@fluentui/react-utilities';
 import { Portal } from '@fluentui/react-portal';
 import { AriaLive } from '../AriaLive';
 /**
  * Render the final JSX of Toaster
  */ export const renderToaster_unstable = (state)=>{
     const { announceRef , renderAriaLive  } = state;
-    const { slots , slotProps  } = getSlotsNext(state);
-    const hasToasts = !!slots.bottomStart || !!slots.bottomEnd || !!slots.topStart || !!slots.topEnd;
+    assertSlots(state);
+    const hasToasts = !!state.bottomStart || !!state.bottomEnd || !!state.topStart || !!state.topEnd;
     return /*#__PURE__*/ createElement(Fragment, null, renderAriaLive ? /*#__PURE__*/ createElement(AriaLive, {
         announceRef: announceRef
-    }) : null, hasToasts ? /*#__PURE__*/ createElement(Portal, null, slots.bottomStart ? /*#__PURE__*/ createElement(slots.bottomStart, slotProps.bottomStart) : null, slots.bottomEnd ? /*#__PURE__*/ createElement(slots.bottomEnd, slotProps.bottomEnd) : null, slots.topStart ? /*#__PURE__*/ createElement(slots.topStart, slotProps.topStart) : null, slots.topEnd ? /*#__PURE__*/ createElement(slots.topEnd, slotProps.topEnd) : null) : null);
+    }) : null, hasToasts ? /*#__PURE__*/ createElement(Portal, null, 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);
 };

package/lib/components/Toaster/renderToaster.js.map

@@ -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 { getSlotsNext } 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  const { slots, slotProps } = getSlotsNext<ToasterSlotsInternal>(state);\n\n  const hasToasts = !!slots.bottomStart || !!slots.bottomEnd || !!slots.topStart || !!slots.topEnd;\n\n  return (\n    <>\n      {renderAriaLive ? <AriaLive announceRef={announceRef} /> : null}\n      {hasToasts ? (\n        <Portal>\n          {slots.bottomStart ? <slots.bottomStart {...slotProps.bottomStart} /> : null}\n          {slots.bottomEnd ? <slots.bottomEnd {...slotProps.bottomEnd} /> : null}\n          {slots.topStart ? <slots.topStart {...slotProps.topStart} /> : null}\n          {slots.topEnd ? <slots.topEnd {...slotProps.topEnd} /> : null}\n        </Portal>\n      ) : null}\n    </>\n  );\n};\n"],"names":["createElement","Fragment","getSlotsNext","Portal","AriaLive","renderToaster_unstable","state","announceRef","renderAriaLive","slots","slotProps","hasToasts","bottomStart","bottomEnd","topStart","topEnd"],"mappings":"AAAA,wBAAwB,GACxB,sBAAsB,GACtB,uBAAuB,GAEvB,SAASA,aAAa,EAAEC,QAAQ,QAAQ,8BAA8B;AACtE,SAASC,YAAY,QAAQ,4BAA4B;AACzD,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;IACxC,MAAM,EAAEG,MAAK,EAAEC,UAAS,EAAE,GAAGR,aAAmCI;IAEhE,MAAMK,YAAY,CAAC,CAACF,MAAMG,WAAW,IAAI,CAAC,CAACH,MAAMI,SAAS,IAAI,CAAC,CAACJ,MAAMK,QAAQ,IAAI,CAAC,CAACL,MAAMM,MAAM;IAEhG,qBACE,AAlBJ,cADA,gBAoBOP,+BAAiB,AAnBxB,cAmByBJ;QAASG,aAAaA;SAAkB,IAAI,EAC9DI,0BACC,AArBR,cAqBSR,cACEM,MAAMG,WAAW,iBAAG,AAtB/B,cAsBgCH,MAAMG,WAAW,EAAKF,UAAUE,WAAW,IAAO,IAAI,EAC3EH,MAAMI,SAAS,iBAAG,AAvB7B,cAuB8BJ,MAAMI,SAAS,EAAKH,UAAUG,SAAS,IAAO,IAAI,EACrEJ,MAAMK,QAAQ,iBAAG,AAxB5B,cAwB6BL,MAAMK,QAAQ,EAAKJ,UAAUI,QAAQ,IAAO,IAAI,EAClEL,MAAMM,MAAM,iBAAG,AAzB1B,cAyB2BN,MAAMM,MAAM,EAAKL,UAAUK,MAAM,IAAO,IAAI,IAE7D,IAAI;AAGd,EAAE"}
+{"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,cACEG,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"}

package/lib/components/Toaster/useToaster.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { getNativeElementProps, resolveShorthand, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';
+import { getNativeElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
 import { useFocusableGroup } from '@fluentui/react-tabster';
 import { Escape } from '@fluentui/keyboard-keys';
@@ -17,7 +17,9 @@ import { useToastAnnounce } from './useToastAnnounce';
     const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus , closeAllToasts  } = useToaster(rest);
     const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);
     const { dir  } = useFluent();
-    const rootProps = getNativeElementProps('div', rest);
+    const rootProps = slot.always(getNativeElementProps('div', rest), {
+        elementType: 'div'
+    });
     const focusableGroupAttr = useFocusableGroup({
         tabBehavior: 'limited-trap-focus',
         ignoreDefaultKeydown: {
@@ -36,7 +38,7 @@ import { useToastAnnounce } from './useToastAnnounce';
         var _toastsToRender_get;
         const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);
         const { announceToast , toasterRef  } = useToastAnnounce(announceProp !== null && announceProp !== void 0 ? announceProp : announce);
-        return resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {
+        return slot.optional(toastsToRender.has(toastPosition) ? rootProps : null, {
             defaultProps: {
                 ref: useMergedRefs(focusManagementRef, toasterRef),
                 children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ React.createElement(ToastContainer, {
@@ -51,7 +53,8 @@ import { useToastAnnounce } from './useToastAnnounce';
                 ...focusableGroupAttr,
                 'data-toaster-position': toastPosition,
                 role: 'list'
-            }
+            },
+            elementType: 'div'
         });
     };
     return {
@@ -63,8 +66,8 @@ import { useToastAnnounce } from './useToastAnnounce';
             topStart: 'div',
             topEnd: 'div'
         },
-        root: resolveShorthand(rootProps, {
-            required: true
+        root: slot.always(rootProps, {
+            elementType: 'div'
         }),
         bottomStart: usePositionSlot(TOAST_POSITIONS.bottomStart),
         bottomEnd: usePositionSlot(TOAST_POSITIONS.bottomEnd),

package/lib/components/Toaster/useToaster.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToaster.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  ExtractSlotProps,\n  Slot,\n  getNativeElementProps,\n  resolveShorthand,\n  useEventCallback,\n  useMergedRefs,\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 = getNativeElementProps('div', rest);\n  const focusableGroupAttr = useFocusableGroup({\n    tabBehavior: 'limited-trap-focus',\n    ignoreDefaultKeydown: { Escape: true },\n  });\n\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === Escape) {\n      e.preventDefault();\n      closeAllToasts();\n    }\n\n    props.onKeyDown?.(e);\n  });\n\n  const usePositionSlot = (toastPosition: ToastPosition) => {\n    const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);\n    const { announceToast, toasterRef } = useToastAnnounce(announceProp ?? announce);\n    return resolveShorthand(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    });\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: 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","resolveShorthand","useEventCallback","useMergedRefs","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","focusableGroupAttr","tabBehavior","ignoreDefaultKeydown","onKeyDown","e","key","preventDefault","usePositionSlot","toastPosition","focusManagementRef","announceToast","toasterRef","has","defaultProps","ref","children","get","map","toast","intent","toastId","visible","content","role","components","root","bottomStart","bottomEnd","topStart","topEnd","required","renderAriaLive"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAGEC,qBAAqB,EACrBC,gBAAgB,EAChBC,gBAAgB,EAChBC,aAAa,QACR,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,GAAGJ;IACpD,MAAMK,cAAcpB,MAAMqB,MAAM,CAAW,IAAM,IAAI;IACrD,MAAM,EAAEC,eAAc,EAAEC,eAAc,EAAEC,eAAc,EAAEC,cAAa,EAAEC,gBAAe,EAAEC,eAAc,EAAE,GACtGjB,WAA2BS;IAC7B,MAAMF,WAAWjB,MAAM4B,WAAW,CAAW,CAACC,SAASC,UAAYV,YAAYW,OAAO,CAACF,SAASC,UAAU,EAAE;IAC5G,MAAM,EAAEE,IAAG,EAAE,GAAG1B;IAEhB,MAAM2B,YAAYhC,sBAAsB,OAAOkB;IAC/C,MAAMe,qBAAqB3B,kBAAkB;QAC3C4B,aAAa;QACbC,sBAAsB;YAAE5B,QAAQ,IAAI;QAAC;IACvC;IAEA,MAAM6B,YAAYlC,iBAAiB,CAACmC,IAA2C;YAM7EvB;QALA,IAAIuB,EAAEC,GAAG,KAAK/B,QAAQ;YACpB8B,EAAEE,cAAc;YAChBb;QACF,CAAC;QAEDZ,CAAAA,mBAAAA,MAAMsB,SAAS,cAAftB,8BAAAA,KAAAA,IAAAA,iBAAAA,KAAAA,OAAkBuB;IACpB;IAEA,MAAMG,kBAAkB,CAACC,gBAAiC;YAM1CpB;QALd,MAAMqB,qBAAqB/B,mCAAmCY,gBAAgBC;QAC9E,MAAM,EAAEmB,cAAa,EAAEC,WAAU,EAAE,GAAGhC,iBAAiBK,yBAAAA,0BAAAA,eAAgBD,QAAQ;QAC/E,OAAOf,iBAAiBoB,eAAewB,GAAG,CAACJ,iBAAiBT,YAAY,IAAI,EAAE;YAC5Ec,cAAc;gBACZC,KAAK5C,cAAcuC,oBAAoBE;gBACvCI,QAAQ,EAAE3B,CAAAA,sBAAAA,eAAe4B,GAAG,CAACR,4BAAnBpB,iCAAAA,KAAAA,IAAAA,oBAAmC6B,IAAIC,CAAAA,sBAC/C,oBAACzC;wBACE,GAAGyC,KAAK;wBACT1B,iBAAiBA;wBACjB2B,QAAQD,MAAMC,MAAM;wBACpBpC,UAAU2B;wBACVL,KAAKa,MAAME,OAAO;wBAClBC,SAAShC,eAAe6B,MAAME,OAAO;uBAEpCF,MAAMI,OAAO;gBAGlBnB;gBACA,GAAGH,kBAAkB;gBACrB,yBAAyBQ;gBACzBe,MAAM;YAER;QACF;IACF;IAEA,OAAO;QACLzB;QACA0B,YAAY;YACVC,MAAM;YACNC,aAAa;YACbC,WAAW;YACXC,UAAU;YACVC,QAAQ;QACV;QACAJ,MAAMzD,iBAAiB+B,WAAW;YAAE+B,UAAU,IAAI;QAAC;QACnDJ,aAAanB,gBAAgBhC,gBAAgBmD,WAAW;QACxDC,WAAWpB,gBAAgBhC,gBAAgBoD,SAAS;QACpDC,UAAUrB,gBAAgBhC,gBAAgBqD,QAAQ;QAClDC,QAAQtB,gBAAgBhC,gBAAgBsD,MAAM;QAC9C3C;QACAJ;QACAC,UAAUC,yBAAAA,0BAAAA,eAAgBD,QAAQ;QAClCgD,gBAAgB,CAAC/C;IACnB;AACF,EAAE"}
+{"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,GAAGJ;IACpD,MAAMK,cAAcpB,MAAMqB,MAAM,CAAW,IAAM,IAAI;IACrD,MAAM,EAAEC,eAAc,EAAEC,eAAc,EAAEC,eAAc,EAAEC,cAAa,EAAEC,gBAAe,EAAEC,eAAc,EAAE,GACtGjB,WAA2BS;IAC7B,MAAMF,WAAWjB,MAAM4B,WAAW,CAAW,CAACC,SAASC,UAAYV,YAAYW,OAAO,CAACF,SAASC,UAAU,EAAE;IAC5G,MAAM,EAAEE,IAAG,EAAE,GAAG1B;IAEhB,MAAM2B,YAAY7B,KAAK8B,MAAM,CAACjC,sBAAsB,OAAOkB,OAAO;QAAEgB,aAAa;IAAM;IACvF,MAAMC,qBAAqB7B,kBAAkB;QAC3C8B,aAAa;QACbC,sBAAsB;YAAE9B,QAAQ,IAAI;QAAC;IACvC;IACA,MAAM+B,YAAYrC,iBAAiB,CAACsC,IAA2C;YAK7EzB;QAJA,IAAIyB,EAAEC,GAAG,KAAKjC,QAAQ;YACpBgC,EAAEE,cAAc;YAChBf;QACF,CAAC;QACDZ,CAAAA,mBAAAA,MAAMwB,SAAS,cAAfxB,8BAAAA,KAAAA,IAAAA,iBAAAA,KAAAA,OAAkByB;IACpB;IACA,MAAMG,kBAAkB,CAACC,gBAAiC;YAM1CtB;QALd,MAAMuB,qBAAqBjC,mCAAmCY,gBAAgBC;QAC9E,MAAM,EAAEqB,cAAa,EAAEC,WAAU,EAAE,GAAGlC,iBAAiBK,yBAAAA,0BAAAA,eAAgBD,QAAQ;QAC/E,OAAOb,KAAK4C,QAAQ,CAAC1B,eAAe2B,GAAG,CAACL,iBAAiBX,YAAY,IAAI,EAAE;YACzEiB,cAAc;gBACZC,KAAKhD,cAAc0C,oBAAoBE;gBACvCK,QAAQ,EAAE9B,CAAAA,sBAAAA,eAAe+B,GAAG,CAACT,4BAAnBtB,iCAAAA,KAAAA,IAAAA,oBAAmCgC,IAAIC,CAAAA,sBAC/C,oBAAC5C;wBACE,GAAG4C,KAAK;wBACT7B,iBAAiBA;wBACjB8B,QAAQD,MAAMC,MAAM;wBACpBvC,UAAU6B;wBACVL,KAAKc,MAAME,OAAO;wBAClBC,SAASnC,eAAegC,MAAME,OAAO;uBAEpCF,MAAMI,OAAO;gBAGlBpB;gBACA,GAAGH,kBAAkB;gBACrB,yBAAyBQ;gBACzBgB,MAAM;YAER;YACAzB,aAAa;QACf;IACF;IACA,OAAO;QACLH;QACA6B,YAAY;YAAEC,MAAM;YAAOC,aAAa;YAAOC,WAAW;YAAOC,UAAU;YAAOC,QAAQ;QAAM;QAChGJ,MAAM1D,KAAK8B,MAAM,CAACD,WAAW;YAAEE,aAAa;QAAM;QAClD4B,aAAapB,gBAAgBlC,gBAAgBsD,WAAW;QACxDC,WAAWrB,gBAAgBlC,gBAAgBuD,SAAS;QACpDC,UAAUtB,gBAAgBlC,gBAAgBwD,QAAQ;QAClDC,QAAQvB,gBAAgBlC,gBAAgByD,MAAM;QAC9C9C;QACAJ;QACAC,UAAUC,yBAAAA,0BAAAA,eAAgBD,QAAQ;QAClCkD,gBAAgB,CAACjD;IACnB;AACF,EAAE"}

package/lib-commonjs/components/AriaLive/renderAriaLive.js

@@ -9,6 +9,6 @@ Object.defineProperty(exports, "renderAriaLive_unstable", {
 const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderAriaLive_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
-    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactJsxRuntime.Fragment, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.assertive, slotProps.assertive), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.polite, slotProps.polite));
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactJsxRuntime.Fragment, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.assertive, null), /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.polite, null));
 };

package/lib-commonjs/components/AriaLive/renderAriaLive.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderAriaLive.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of AriaLive\n */ export const renderAriaLive_unstable = (state)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(Fragment, null, /*#__PURE__*/ createElement(slots.assertive, slotProps.assertive), /*#__PURE__*/ createElement(slots.polite, slotProps.polite));\n};\n"],"names":["renderAriaLive_unstable","state","slots","slotProps","getSlotsNext","createElement","Fragment","assertive","polite"],"mappings":"AAAA,wBAAwB,GAAG,sBAAsB,GAAG,uBAAuB;;;;+BAI1DA;;aAAAA;;iCAJqG;gCACzF;AAGlB,MAAMA,0BAA0B,CAACC,QAAQ;IAChD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACC,yBAAQ,EAAE,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACH,MAAMK,SAAS,EAAEJ,UAAUI,SAAS,GAAG,WAAW,GAAGF,IAAAA,8BAAa,EAACH,MAAMM,MAAM,EAAEL,UAAUK,MAAM;AACpL"}
+{"version":3,"sources":["renderAriaLive.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of AriaLive\n */ export const renderAriaLive_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(Fragment, null, /*#__PURE__*/ createElement(state.assertive, null), /*#__PURE__*/ createElement(state.polite, null));\n};\n"],"names":["renderAriaLive_unstable","state","assertSlots","createElement","Fragment","assertive","polite"],"mappings":"AAAA,wBAAwB,GAAG,sBAAsB,GAAG,uBAAuB;;;;+BAI1DA;;aAAAA;;iCAJqG;gCAC1F;AAGjB,MAAMA,0BAA0B,CAACC,QAAQ;IAChDC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACC,yBAAQ,EAAE,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACF,MAAMI,SAAS,EAAE,IAAI,GAAG,WAAW,GAAGF,IAAAA,8BAAa,EAACF,MAAMK,MAAM,EAAE,IAAI;AACzJ"}

package/lib-commonjs/components/AriaLive/useAriaLive.js

@@ -57,19 +57,19 @@ const useAriaLive_unstable = (props)=>{
             assertive: 'div',
             polite: 'div'
         },
-        assertive: (0, _reactUtilities.resolveShorthand)(props.assertive, {
-            required: true,
+        assertive: _reactUtilities.slot.always(props.assertive, {
             defaultProps: {
                 'aria-live': 'assertive',
                 children: assertiveMessage
-            }
+            },
+            elementType: 'div'
         }),
-        polite: (0, _reactUtilities.resolveShorthand)(props.polite, {
-            required: true,
+        polite: _reactUtilities.slot.always(props.polite, {
             defaultProps: {
                 'aria-live': 'polite',
                 children: politeMessage
-            }
+            },
+            elementType: 'div'
         })
     };
 };

package/lib-commonjs/components/AriaLive/useAriaLive.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAriaLive.js"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand, createPriorityQueue, useEventCallback } from '@fluentui/react-utilities';\n/** The duration the message needs to be in present in DOM for screen readers to register a change and announce */ const MESSAGE_DURATION = 500;\n/**\n * Create the state required to render AriaLive.\n *\n * The returned state can be modified with hooks such as useAriaLiveStyles_unstable,\n * before being passed to renderAriaLive_unstable.\n *\n * @param props - props from this instance of AriaLive\n */ export const useAriaLive_unstable = (props)=>{\n    const [currentMessage, setCurrentMessage] = React.useState(undefined);\n    // Can't rely on Date.now() if user invokes announce more than once in a code block\n    const order = React.useRef(0);\n    const [messageQueue] = React.useState(()=>createPriorityQueue((a, b)=>{\n            if (a.politeness === b.politeness) {\n                return a.createdAt - b.createdAt;\n            }\n            return a.politeness === 'assertive' ? -1 : 1;\n        }));\n    const announce = useEventCallback((message, options)=>{\n        const { politeness  } = options;\n        if (message === (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.message)) {\n            return;\n        }\n        const liveMessage = {\n            message,\n            politeness,\n            createdAt: order.current++\n        };\n        if (!currentMessage) {\n            setCurrentMessage(liveMessage);\n        } else {\n            messageQueue.enqueue(liveMessage);\n        }\n    });\n    React.useEffect(()=>{\n        const timeout = setTimeout(()=>{\n            if (messageQueue.peek()) {\n                setCurrentMessage(messageQueue.dequeue());\n            } else {\n                setCurrentMessage(undefined);\n            }\n        }, MESSAGE_DURATION);\n        return ()=>clearTimeout(timeout);\n    }, [\n        currentMessage,\n        messageQueue\n    ]);\n    React.useImperativeHandle(props.announceRef, ()=>announce);\n    const politeMessage = (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.politeness) === 'polite' ? currentMessage.message : undefined;\n    const assertiveMessage = (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.politeness) === 'assertive' ? currentMessage.message : undefined;\n    return {\n        components: {\n            assertive: 'div',\n            polite: 'div'\n        },\n        assertive: resolveShorthand(props.assertive, {\n            required: true,\n            defaultProps: {\n                'aria-live': 'assertive',\n                children: assertiveMessage\n            }\n        }),\n        polite: resolveShorthand(props.polite, {\n            required: true,\n            defaultProps: {\n                'aria-live': 'polite',\n                children: politeMessage\n            }\n        })\n    };\n};\n"],"names":["useAriaLive_unstable","MESSAGE_DURATION","props","currentMessage","setCurrentMessage","React","useState","undefined","order","useRef","messageQueue","createPriorityQueue","a","b","politeness","createdAt","announce","useEventCallback","message","options","liveMessage","current","enqueue","useEffect","timeout","setTimeout","peek","dequeue","clearTimeout","useImperativeHandle","announceRef","politeMessage","assertiveMessage","components","assertive","polite","resolveShorthand","required","defaultProps","children"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACiD;AACxE,gHAAgH,GAAG,MAAMC,mBAAmB;AAQjI,MAAMD,uBAAuB,CAACE,QAAQ;IAC7C,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGC,OAAMC,QAAQ,CAACC;IAC3D,mFAAmF;IACnF,MAAMC,QAAQH,OAAMI,MAAM,CAAC;IAC3B,MAAM,CAACC,aAAa,GAAGL,OAAMC,QAAQ,CAAC,IAAIK,IAAAA,mCAAmB,EAAC,CAACC,GAAGC,IAAI;YAC9D,IAAID,EAAEE,UAAU,KAAKD,EAAEC,UAAU,EAAE;gBAC/B,OAAOF,EAAEG,SAAS,GAAGF,EAAEE,SAAS;YACpC,CAAC;YACD,OAAOH,EAAEE,UAAU,KAAK,cAAc,CAAC,IAAI,CAAC;QAChD;IACJ,MAAME,WAAWC,IAAAA,gCAAgB,EAAC,CAACC,SAASC,UAAU;QAClD,MAAM,EAAEL,WAAU,EAAG,GAAGK;QACxB,IAAID,YAAaf,CAAAA,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAee,OAAO,AAAD,GAAI;YACtG;QACJ,CAAC;QACD,MAAME,cAAc;YAChBF;YACAJ;YACAC,WAAWP,MAAMa,OAAO;QAC5B;QACA,IAAI,CAAClB,gBAAgB;YACjBC,kBAAkBgB;QACtB,OAAO;YACHV,aAAaY,OAAO,CAACF;QACzB,CAAC;IACL;IACAf,OAAMkB,SAAS,CAAC,IAAI;QAChB,MAAMC,UAAUC,WAAW,IAAI;YAC3B,IAAIf,aAAagB,IAAI,IAAI;gBACrBtB,kBAAkBM,aAAaiB,OAAO;YAC1C,OAAO;gBACHvB,kBAAkBG;YACtB,CAAC;QACL,GAAGN;QACH,OAAO,IAAI2B,aAAaJ;IAC5B,GAAG;QACCrB;QACAO;KACH;IACDL,OAAMwB,mBAAmB,CAAC3B,MAAM4B,WAAW,EAAE,IAAId;IACjD,MAAMe,gBAAgB,AAAC5B,CAAAA,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeW,UAAU,AAAD,MAAO,WAAWX,eAAee,OAAO,GAAGX,SAAS;IACnK,MAAMyB,mBAAmB,AAAC7B,CAAAA,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeW,UAAU,AAAD,MAAO,cAAcX,eAAee,OAAO,GAAGX,SAAS;IACzK,OAAO;QACH0B,YAAY;YACRC,WAAW;YACXC,QAAQ;QACZ;QACAD,WAAWE,IAAAA,gCAAgB,EAAClC,MAAMgC,SAAS,EAAE;YACzCG,UAAU,IAAI;YACdC,cAAc;gBACV,aAAa;gBACbC,UAAUP;YACd;QACJ;QACAG,QAAQC,IAAAA,gCAAgB,EAAClC,MAAMiC,MAAM,EAAE;YACnCE,UAAU,IAAI;YACdC,cAAc;gBACV,aAAa;gBACbC,UAAUR;YACd;QACJ;IACJ;AACJ"}
+{"version":3,"sources":["useAriaLive.js"],"sourcesContent":["import * as React from 'react';\nimport { createPriorityQueue, useEventCallback, slot } from '@fluentui/react-utilities';\n/** The duration the message needs to be in present in DOM for screen readers to register a change and announce */ const MESSAGE_DURATION = 500;\n/**\n * Create the state required to render AriaLive.\n *\n * The returned state can be modified with hooks such as useAriaLiveStyles_unstable,\n * before being passed to renderAriaLive_unstable.\n *\n * @param props - props from this instance of AriaLive\n */ export const useAriaLive_unstable = (props)=>{\n    const [currentMessage, setCurrentMessage] = React.useState(undefined);\n    // Can't rely on Date.now() if user invokes announce more than once in a code block\n    const order = React.useRef(0);\n    const [messageQueue] = React.useState(()=>createPriorityQueue((a, b)=>{\n            if (a.politeness === b.politeness) {\n                return a.createdAt - b.createdAt;\n            }\n            return a.politeness === 'assertive' ? -1 : 1;\n        }));\n    const announce = useEventCallback((message, options)=>{\n        const { politeness  } = options;\n        if (message === (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.message)) {\n            return;\n        }\n        const liveMessage = {\n            message,\n            politeness,\n            createdAt: order.current++\n        };\n        if (!currentMessage) {\n            setCurrentMessage(liveMessage);\n        } else {\n            messageQueue.enqueue(liveMessage);\n        }\n    });\n    React.useEffect(()=>{\n        const timeout = setTimeout(()=>{\n            if (messageQueue.peek()) {\n                setCurrentMessage(messageQueue.dequeue());\n            } else {\n                setCurrentMessage(undefined);\n            }\n        }, MESSAGE_DURATION);\n        return ()=>clearTimeout(timeout);\n    }, [\n        currentMessage,\n        messageQueue\n    ]);\n    React.useImperativeHandle(props.announceRef, ()=>announce);\n    const politeMessage = (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.politeness) === 'polite' ? currentMessage.message : undefined;\n    const assertiveMessage = (currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.politeness) === 'assertive' ? currentMessage.message : undefined;\n    return {\n        components: {\n            assertive: 'div',\n            polite: 'div'\n        },\n        assertive: slot.always(props.assertive, {\n            defaultProps: {\n                'aria-live': 'assertive',\n                children: assertiveMessage\n            },\n            elementType: 'div'\n        }),\n        polite: slot.always(props.polite, {\n            defaultProps: {\n                'aria-live': 'polite',\n                children: politeMessage\n            },\n            elementType: 'div'\n        })\n    };\n};\n"],"names":["useAriaLive_unstable","MESSAGE_DURATION","props","currentMessage","setCurrentMessage","React","useState","undefined","order","useRef","messageQueue","createPriorityQueue","a","b","politeness","createdAt","announce","useEventCallback","message","options","liveMessage","current","enqueue","useEffect","timeout","setTimeout","peek","dequeue","clearTimeout","useImperativeHandle","announceRef","politeMessage","assertiveMessage","components","assertive","polite","slot","always","defaultProps","children","elementType"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACqC;AAC5D,gHAAgH,GAAG,MAAMC,mBAAmB;AAQjI,MAAMD,uBAAuB,CAACE,QAAQ;IAC7C,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGC,OAAMC,QAAQ,CAACC;IAC3D,mFAAmF;IACnF,MAAMC,QAAQH,OAAMI,MAAM,CAAC;IAC3B,MAAM,CAACC,aAAa,GAAGL,OAAMC,QAAQ,CAAC,IAAIK,IAAAA,mCAAmB,EAAC,CAACC,GAAGC,IAAI;YAC9D,IAAID,EAAEE,UAAU,KAAKD,EAAEC,UAAU,EAAE;gBAC/B,OAAOF,EAAEG,SAAS,GAAGF,EAAEE,SAAS;YACpC,CAAC;YACD,OAAOH,EAAEE,UAAU,KAAK,cAAc,CAAC,IAAI,CAAC;QAChD;IACJ,MAAME,WAAWC,IAAAA,gCAAgB,EAAC,CAACC,SAASC,UAAU;QAClD,MAAM,EAAEL,WAAU,EAAG,GAAGK;QACxB,IAAID,YAAaf,CAAAA,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAee,OAAO,AAAD,GAAI;YACtG;QACJ,CAAC;QACD,MAAME,cAAc;YAChBF;YACAJ;YACAC,WAAWP,MAAMa,OAAO;QAC5B;QACA,IAAI,CAAClB,gBAAgB;YACjBC,kBAAkBgB;QACtB,OAAO;YACHV,aAAaY,OAAO,CAACF;QACzB,CAAC;IACL;IACAf,OAAMkB,SAAS,CAAC,IAAI;QAChB,MAAMC,UAAUC,WAAW,IAAI;YAC3B,IAAIf,aAAagB,IAAI,IAAI;gBACrBtB,kBAAkBM,aAAaiB,OAAO;YAC1C,OAAO;gBACHvB,kBAAkBG;YACtB,CAAC;QACL,GAAGN;QACH,OAAO,IAAI2B,aAAaJ;IAC5B,GAAG;QACCrB;QACAO;KACH;IACDL,OAAMwB,mBAAmB,CAAC3B,MAAM4B,WAAW,EAAE,IAAId;IACjD,MAAMe,gBAAgB,AAAC5B,CAAAA,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeW,UAAU,AAAD,MAAO,WAAWX,eAAee,OAAO,GAAGX,SAAS;IACnK,MAAMyB,mBAAmB,AAAC7B,CAAAA,mBAAmB,IAAI,IAAIA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeW,UAAU,AAAD,MAAO,cAAcX,eAAee,OAAO,GAAGX,SAAS;IACzK,OAAO;QACH0B,YAAY;YACRC,WAAW;YACXC,QAAQ;QACZ;QACAD,WAAWE,oBAAI,CAACC,MAAM,CAACnC,MAAMgC,SAAS,EAAE;YACpCI,cAAc;gBACV,aAAa;gBACbC,UAAUP;YACd;YACAQ,aAAa;QACjB;QACAL,QAAQC,oBAAI,CAACC,MAAM,CAACnC,MAAMiC,MAAM,EAAE;YAC9BG,cAAc;gBACV,aAAa;gBACbC,UAAUR;YACd;YACAS,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/components/Timer/useTimerStyles.styles.js

@@ -7,10 +7,8 @@ Object.defineProperty(exports, "useBaseAnimationStyles", {
     get: ()=>useBaseAnimationStyles
 });
 const _react = require("@griffel/react");
-const useBaseAnimationStyles = /*#__PURE__*/ (0, _react["__resetStyles"])("r17x0t3n", "r75casi", [
-    ".r17x0t3n{-webkit-animation-name:rsacmq1;animation-name:rsacmq1;}",
-    "@-webkit-keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}",
-    "@-webkit-keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}",
+const useBaseAnimationStyles = /*#__PURE__*/ (0, _react["__resetStyles"])("r16zaflb", "r75casi", [
+    ".r16zaflb{animation-name:rsacmq1;}",
     "@keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}",
-    ".r75casi{-webkit-animation-name:rsacmq1;animation-name:rsacmq1;}"
+    ".r75casi{animation-name:rsacmq1;}"
 ]); //# sourceMappingURL=useTimerStyles.styles.js.map

package/lib-commonjs/components/Timer/useTimerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTimerStyles.styles.js"],"sourcesContent":["import { __resetStyles } from '@griffel/react';\nexport const useBaseAnimationStyles = /*#__PURE__*/__resetStyles(\"r17x0t3n\", \"r75casi\", [\".r17x0t3n{-webkit-animation-name:rsacmq1;animation-name:rsacmq1;}\", \"@-webkit-keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}\", \"@-webkit-keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}\", \"@keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}\", \".r75casi{-webkit-animation-name:rsacmq1;animation-name:rsacmq1;}\"]);\n//# sourceMappingURL=useTimerStyles.styles.js.map"],"names":["useBaseAnimationStyles","__resetStyles"],"mappings":";;;;+BACaA;;aAAAA;;uBADiB;AACvB,MAAMA,yBAAyB,WAAW,GAAEC,IAAAA,uBAAa,EAAC,YAAY,WAAW;IAAC;IAAqE;IAA8D;IAA8D;IAAsD;CAAmE,GACnZ,iDAAiD"}
+{"version":3,"sources":["useTimerStyles.styles.js"],"sourcesContent":["import { __resetStyles } from '@griffel/react';\nexport const useBaseAnimationStyles = /*#__PURE__*/__resetStyles(\"r16zaflb\", \"r75casi\", [\".r16zaflb{animation-name:rsacmq1;}\", \"@keyframes rsacmq1{from{opacity:0;}to{opacity:0;}}\", \".r75casi{animation-name:rsacmq1;}\"]);\n//# sourceMappingURL=useTimerStyles.styles.js.map"],"names":["useBaseAnimationStyles","__resetStyles"],"mappings":";;;;+BACaA;;aAAAA;;uBADiB;AACvB,MAAMA,yBAAyB,WAAW,GAAEC,IAAAA,uBAAa,EAAC,YAAY,WAAW;IAAC;IAAsC;IAAsD;CAAoC,GACzN,iDAAiD"}

package/lib-commonjs/components/Toast/renderToast.js

@@ -10,8 +10,8 @@ const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const _reactSharedContexts = require("@fluentui/react-shared-contexts");
 const renderToast_unstable = (state, contextValues)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
+    (0, _reactUtilities.assertSlots)(state);
     return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactSharedContexts.BackgroundAppearanceProvider, {
         value: contextValues.backgroundAppearance
-    }, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root));
+    }, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null));
 };

package/lib-commonjs/components/Toast/renderToast.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderToast.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { BackgroundAppearanceProvider } from '@fluentui/react-shared-contexts';\n/**\n * Render the final JSX of Toast\n */ export const renderToast_unstable = (state, contextValues)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(BackgroundAppearanceProvider, {\n        value: contextValues.backgroundAppearance\n    }, /*#__PURE__*/ createElement(slots.root, slotProps.root));\n};\n"],"names":["renderToast_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","BackgroundAppearanceProvider","value","backgroundAppearance","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACtD;qCACgB;AAGlC,MAAMA,uBAAuB,CAACC,OAAOC,gBAAgB;IAC5D,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,OAAO,WAAW,GAAGK,IAAAA,8BAAa,EAACC,iDAA4B,EAAE;QAC7DC,OAAON,cAAcO,oBAAoB;IAC7C,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMO,IAAI,EAAEN,UAAUM,IAAI;AAC7D"}
+{"version":3,"sources":["renderToast.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { BackgroundAppearanceProvider } from '@fluentui/react-shared-contexts';\n/**\n * Render the final JSX of Toast\n */ export const renderToast_unstable = (state, contextValues)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(BackgroundAppearanceProvider, {\n        value: contextValues.backgroundAppearance\n    }, /*#__PURE__*/ createElement(state.root, null));\n};\n"],"names":["renderToast_unstable","state","contextValues","assertSlots","createElement","BackgroundAppearanceProvider","value","backgroundAppearance","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACvD;qCACiB;AAGlC,MAAMA,uBAAuB,CAACC,OAAOC,gBAAgB;IAC5DC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,8BAAa,EAACC,iDAA4B,EAAE;QAC7DC,OAAOJ,cAAcK,oBAAoB;IAC7C,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMO,IAAI,EAAE,IAAI;AACnD"}

package/lib-commonjs/components/Toast/useToast.js

@@ -14,9 +14,11 @@ const useToast_unstable = (props, ref)=>{
         components: {
             root: 'div'
         },
-        root: (0, _reactUtilities.getNativeElementProps)('div', {
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('div', {
             ref,
             ...props
+        }), {
+            elementType: 'div'
         }),
         backgroundAppearance: props.appearance
     };

package/lib-commonjs/components/Toast/useToast.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToast.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\n/**\n * Create the state required to render Toast.\n *\n * The returned state can be modified with hooks such as useToastStyles_unstable,\n * before being passed to renderToast_unstable.\n *\n * @param props - props from this instance of Toast\n * @param ref - reference to root HTMLElement of Toast\n */ export const useToast_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'div'\n        },\n        root: getNativeElementProps('div', {\n            ref,\n            ...props\n        }),\n        backgroundAppearance: props.appearance\n    };\n};\n"],"names":["useToast_unstable","props","ref","components","root","getNativeElementProps","backgroundAppearance","appearance"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACe;AAS3B,MAAMA,oBAAoB,CAACC,OAAOC,MAAM;IAC/C,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YAC/BH;YACA,GAAGD,KAAK;QACZ;QACAK,sBAAsBL,MAAMM,UAAU;IAC1C;AACJ"}
+{"version":3,"sources":["useToast.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render Toast.\n *\n * The returned state can be modified with hooks such as useToastStyles_unstable,\n * before being passed to renderToast_unstable.\n *\n * @param props - props from this instance of Toast\n * @param ref - reference to root HTMLElement of Toast\n */ export const useToast_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        backgroundAppearance: props.appearance\n    };\n};\n"],"names":["useToast_unstable","props","ref","components","root","slot","always","getNativeElementProps","elementType","backgroundAppearance","appearance"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACqB;AASjC,MAAMA,oBAAoB,CAACC,OAAOC,MAAM;IAC/C,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CL;YACA,GAAGD,KAAK;QACZ,IAAI;YACAO,aAAa;QACjB;QACAC,sBAAsBR,MAAMS,UAAU;IAC1C;AACJ"}

package/lib-commonjs/components/Toast/useToastStyles.styles.js

@@ -17,8 +17,8 @@ const toastClassNames = {
     root: 'fui-Toast'
 };
 const useRootBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("rzyoxeq", "r1lipnsg", [
-    ".rzyoxeq{display:-ms-grid;display:grid;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}",
-    ".r1lipnsg{display:-ms-grid;display:grid;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto;padding-top:12px;padding-left:12px;padding-bottom:12px;padding-right:12px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-width:1px;border-left-width:1px;border-bottom-width:1px;border-right-width:1px;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}"
+    ".rzyoxeq{display:grid;grid-template-columns:auto 1fr auto;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}",
+    ".r1lipnsg{display:grid;grid-template-columns:auto 1fr auto;padding-top:12px;padding-left:12px;padding-bottom:12px;padding-right:12px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-width:1px;border-left-width:1px;border-bottom-width:1px;border-right-width:1px;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}"
 ]);
 const useStyles = /*#__PURE__*/ (0, _react["__styles"])({
     inverted: {

package/lib-commonjs/components/Toast/useToastStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToastStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const toastClassNames = {\n  root: 'fui-Toast'\n};\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"rzyoxeq\", \"r1lipnsg\", [\".rzyoxeq{display:-ms-grid;display:grid;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}\", \".r1lipnsg{display:-ms-grid;display:grid;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto;padding-top:12px;padding-left:12px;padding-bottom:12px;padding-right:12px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-width:1px;border-left-width:1px;border-bottom-width:1px;border-right-width:1px;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n  inverted: {\n    sj55zd: \"f1w7i9ko\",\n    De3pzq: \"f5pduvr\"\n  }\n}, {\n  d: [\".f1w7i9ko{color:var(--colorNeutralForegroundInverted2);}\", \".f5pduvr{background-color:var(--colorNeutralBackgroundInverted);}\"]\n});\n/**\n * Apply styling to the Toast slots based on the state\n */\nexport const useToastStyles_unstable = state => {\n  const rootBaseClassName = useRootBaseClassName();\n  const styles = useStyles();\n  state.root.className = mergeClasses(toastClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && styles.inverted, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useToastStyles.styles.js.map"],"names":["toastClassNames","useToastStyles_unstable","root","useRootBaseClassName","__resetStyles","useStyles","__styles","inverted","sj55zd","De3pzq","d","state","rootBaseClassName","styles","className","mergeClasses","backgroundAppearance"],"mappings":";;;;;;;;;;;IAEaA,eAAe,MAAfA;IAeAC,uBAAuB,MAAvBA;;uBAjBqD;AAE3D,MAAMD,kBAAkB;IAC7BE,MAAM;AACR;AACA,MAAMC,uBAAuB,WAAW,GAAEC,IAAAA,uBAAa,EAAC,WAAW,YAAY;IAAC;IAA08B;CAA08B;AACp+D,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCC,UAAU;QACRC,QAAQ;QACRC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA4D;KAAoE;AACtI;AAIO,MAAMT,0BAA0BU,CAAAA,QAAS;IAC9C,MAAMC,oBAAoBT;IAC1B,MAAMU,SAASR;IACfM,MAAMT,IAAI,CAACY,SAAS,GAAGC,IAAAA,mBAAY,EAACf,gBAAgBE,IAAI,EAAEU,mBAAmBD,MAAMK,oBAAoB,KAAK,cAAcH,OAAON,QAAQ,EAAEI,MAAMT,IAAI,CAACY,SAAS;IAC/J,OAAOH;AACT,GACA,iDAAiD"}
+{"version":3,"sources":["useToastStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const toastClassNames = {\n  root: 'fui-Toast'\n};\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"rzyoxeq\", \"r1lipnsg\", [\".rzyoxeq{display:grid;grid-template-columns:auto 1fr auto;padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}\", \".r1lipnsg{display:grid;grid-template-columns:auto 1fr auto;padding-top:12px;padding-left:12px;padding-bottom:12px;padding-right:12px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-width:1px;border-left-width:1px;border-bottom-width:1px;border-right-width:1px;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-color:var(--colorTransparentStroke);border-left-color:var(--colorTransparentStroke);border-bottom-color:var(--colorTransparentStroke);border-right-color:var(--colorTransparentStroke);box-shadow:var(--shadow8);font-size:var(--fontSizeBase300);line-height:20px;font-weight:var(--fontWeightSemibold);color:var(--colorNeutralForeground1);background-color:var(--colorNeutralBackground1);}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n  inverted: {\n    sj55zd: \"f1w7i9ko\",\n    De3pzq: \"f5pduvr\"\n  }\n}, {\n  d: [\".f1w7i9ko{color:var(--colorNeutralForegroundInverted2);}\", \".f5pduvr{background-color:var(--colorNeutralBackgroundInverted);}\"]\n});\n/**\n * Apply styling to the Toast slots based on the state\n */\nexport const useToastStyles_unstable = state => {\n  const rootBaseClassName = useRootBaseClassName();\n  const styles = useStyles();\n  state.root.className = mergeClasses(toastClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && styles.inverted, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useToastStyles.styles.js.map"],"names":["toastClassNames","useToastStyles_unstable","root","useRootBaseClassName","__resetStyles","useStyles","__styles","inverted","sj55zd","De3pzq","d","state","rootBaseClassName","styles","className","mergeClasses","backgroundAppearance"],"mappings":";;;;;;;;;;;IAEaA,eAAe,MAAfA;IAeAC,uBAAuB,MAAvBA;;uBAjBqD;AAE3D,MAAMD,kBAAkB;IAC7BE,MAAM;AACR;AACA,MAAMC,uBAAuB,WAAW,GAAEC,IAAAA,uBAAa,EAAC,WAAW,YAAY;IAAC;IAA05B;CAA05B;AACp4D,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCC,UAAU;QACRC,QAAQ;QACRC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA4D;KAAoE;AACtI;AAIO,MAAMT,0BAA0BU,CAAAA,QAAS;IAC9C,MAAMC,oBAAoBT;IAC1B,MAAMU,SAASR;IACfM,MAAMT,IAAI,CAACY,SAAS,GAAGC,IAAAA,mBAAY,EAACf,gBAAgBE,IAAI,EAAEU,mBAAmBD,MAAMK,oBAAoB,KAAK,cAAcH,OAAON,QAAQ,EAAEI,MAAMT,IAAI,CAACY,SAAS;IAC/J,OAAOH;AACT,GACA,iDAAiD"}

package/lib-commonjs/components/ToastBody/renderToastBody.js

@@ -9,6 +9,6 @@ Object.defineProperty(exports, "renderToastBody_unstable", {
 const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderToastBody_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
-    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactJsxRuntime.Fragment, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root), slots.subtitle ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.subtitle, slotProps.subtitle) : null);
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactJsxRuntime.Fragment, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null), state.subtitle ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.subtitle, null) : null);
 };

package/lib-commonjs/components/ToastBody/renderToastBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderToastBody.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of ToastBody\n */ export const renderToastBody_unstable = (state)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(Fragment, null, /*#__PURE__*/ createElement(slots.root, slotProps.root), slots.subtitle ? /*#__PURE__*/ createElement(slots.subtitle, slotProps.subtitle) : null);\n};\n"],"names":["renderToastBody_unstable","state","slots","slotProps","getSlotsNext","createElement","Fragment","root","subtitle"],"mappings":"AAAA,wBAAwB,GAAG,sBAAsB,GAAG,uBAAuB;;;;+BAI1DA;;aAAAA;;iCAJqG;gCACzF;AAGlB,MAAMA,2BAA2B,CAACC,QAAQ;IACjD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACC,yBAAQ,EAAE,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACH,MAAMK,IAAI,EAAEJ,UAAUI,IAAI,GAAGL,MAAMM,QAAQ,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACH,MAAMM,QAAQ,EAAEL,UAAUK,QAAQ,IAAI,IAAI;AACvM"}
+{"version":3,"sources":["renderToastBody.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsxFrag Fragment */ /** @jsx createElement */ import { createElement, Fragment } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of ToastBody\n */ export const renderToastBody_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(Fragment, null, /*#__PURE__*/ createElement(state.root, null), state.subtitle ? /*#__PURE__*/ createElement(state.subtitle, null) : null);\n};\n"],"names":["renderToastBody_unstable","state","assertSlots","createElement","Fragment","root","subtitle"],"mappings":"AAAA,wBAAwB,GAAG,sBAAsB,GAAG,uBAAuB;;;;+BAI1DA;;aAAAA;;iCAJqG;gCAC1F;AAGjB,MAAMA,2BAA2B,CAACC,QAAQ;IACjDC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACC,yBAAQ,EAAE,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACF,MAAMI,IAAI,EAAE,IAAI,GAAGJ,MAAMK,QAAQ,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACF,MAAMK,QAAQ,EAAE,IAAI,IAAI,IAAI;AAC/K"}

package/lib-commonjs/components/ToastBody/useToastBody.js

@@ -19,11 +19,15 @@ const useToastBody_unstable = (props, ref)=>{
             root: 'div',
             subtitle: 'div'
         },
-        subtitle: (0, _reactUtilities.resolveShorthand)(props.subtitle),
-        root: (0, _reactUtilities.getNativeElementProps)('div', {
+        subtitle: _reactUtilities.slot.optional(props.subtitle, {
+            elementType: 'div'
+        }),
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('div', {
             ref,
             id: bodyId,
             ...props
+        }), {
+            elementType: 'div'
         }),
         backgroundAppearance
     };