@fluentui/react-toast 9.8.0 → 9.8.2

package/lib/components/ToastBody/useToastBodyStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastBody/useToastBodyStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ToastBodySlots, ToastBodyState } from './ToastBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const toastBodyClassNames: SlotClassNames<ToastBodySlots> = {\n  root: 'fui-ToastBody',\n  subtitle: 'fui-ToastBody__subtitle',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n  gridColumnStart: 2,\n  gridColumnEnd: 3,\n  paddingTop: '6px',\n  fontSize: tokens.fontSizeBase300,\n  lineHeight: tokens.lineHeightBase300,\n  fontWeight: tokens.fontWeightRegular,\n  color: tokens.colorNeutralForeground1,\n  wordBreak: 'break-word',\n});\n\nconst useSubtitleBaseClassName = makeResetStyles({\n  paddingTop: '4px',\n  gridColumnStart: 2,\n  gridColumnEnd: 3,\n  fontSize: tokens.fontSizeBase200,\n  lineHeight: tokens.fontSizeBase200,\n  fontWeight: tokens.fontWeightRegular,\n  color: tokens.colorNeutralForeground2,\n});\n\nconst useInvertedStyles = makeStyles({\n  root: {\n    color: tokens.colorNeutralForegroundInverted2,\n  },\n  subtitle: {\n    color: tokens.colorNeutralForegroundInverted2,\n  },\n});\n\n/**\n * Apply styling to the ToastBody slots based on the state\n */\nexport const useToastBodyStyles_unstable = (state: ToastBodyState): ToastBodyState => {\n  'use no memo';\n\n  const rootBaseClassName = useRootBaseClassName();\n  const subtitleBaseClassName = useSubtitleBaseClassName();\n  const invertedStyles = useInvertedStyles();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    toastBodyClassNames.root,\n    rootBaseClassName,\n    state.backgroundAppearance === 'inverted' && invertedStyles.root,\n    state.root.className,\n  );\n\n  if (state.subtitle) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.subtitle.className = mergeClasses(\n      toastBodyClassNames.subtitle,\n      subtitleBaseClassName,\n      state.backgroundAppearance === 'inverted' && invertedStyles.subtitle,\n      state.subtitle.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","toastBodyClassNames","root","subtitle","useRootBaseClassName","gridColumnStart","gridColumnEnd","paddingTop","fontSize","fontSizeBase300","lineHeight","lineHeightBase300","fontWeight","fontWeightRegular","color","colorNeutralForeground1","wordBreak","useSubtitleBaseClassName","fontSizeBase200","colorNeutralForeground2","useInvertedStyles","colorNeutralForegroundInverted2","useToastBodyStyles_unstable","state","rootBaseClassName","subtitleBaseClassName","invertedStyles","className","backgroundAppearance"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,MAAM,QAAQ,wBAAwB;AAI/C,OAAO,MAAMC,sBAAsD;IACjEC,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF,MAAMC,uBAAuBP,gBAAgB;IAC3CQ,iBAAiB;IACjBC,eAAe;IACfC,YAAY;IACZC,UAAUR,OAAOS,eAAe;IAChCC,YAAYV,OAAOW,iBAAiB;IACpCC,YAAYZ,OAAOa,iBAAiB;IACpCC,OAAOd,OAAOe,uBAAuB;IACrCC,WAAW;AACb;AAEA,MAAMC,2BAA2BpB,gBAAgB;IAC/CU,YAAY;IACZF,iBAAiB;IACjBC,eAAe;IACfE,UAAUR,OAAOkB,eAAe;IAChCR,YAAYV,OAAOkB,eAAe;IAClCN,YAAYZ,OAAOa,iBAAiB;IACpCC,OAAOd,OAAOmB,uBAAuB;AACvC;AAEA,MAAMC,oBAAoBtB,WAAW;IACnCI,MAAM;QACJY,OAAOd,OAAOqB,+BAA+B;IAC/C;IACAlB,UAAU;QACRW,OAAOd,OAAOqB,+BAA+B;IAC/C;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1C;IAEA,MAAMC,oBAAoBpB;IAC1B,MAAMqB,wBAAwBR;IAC9B,MAAMS,iBAAiBN;IACvB,oDAAoD;IACpDG,MAAMrB,IAAI,CAACyB,SAAS,GAAG5B,aACrBE,oBAAoBC,IAAI,EACxBsB,mBACAD,MAAMK,oBAAoB,KAAK,cAAcF,eAAexB,IAAI,EAChEqB,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,QAAQ,EAAE;QAClB,oDAAoD;QACpDoB,MAAMpB,QAAQ,CAACwB,SAAS,GAAG5B,aACzBE,oBAAoBE,QAAQ,EAC5BsB,uBACAF,MAAMK,oBAAoB,KAAK,cAAcF,eAAevB,QAAQ,EACpEoB,MAAMpB,QAAQ,CAACwB,SAAS;IAE5B;IAEA,OAAOJ;AACT,EAAE"}
+{"version":3,"sources":["../src/components/ToastBody/useToastBodyStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ToastBodySlots, ToastBodyState } from './ToastBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const toastBodyClassNames: SlotClassNames<ToastBodySlots> = {\n  root: 'fui-ToastBody',\n  subtitle: 'fui-ToastBody__subtitle',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n  gridColumnStart: 2,\n  gridColumnEnd: 3,\n  paddingTop: '6px',\n  fontSize: tokens.fontSizeBase300,\n  lineHeight: tokens.lineHeightBase300,\n  fontWeight: tokens.fontWeightRegular,\n  color: tokens.colorNeutralForeground1,\n  wordBreak: 'break-word',\n});\n\nconst useSubtitleBaseClassName = makeResetStyles({\n  paddingTop: '4px',\n  gridColumnStart: 2,\n  gridColumnEnd: 3,\n  fontSize: tokens.fontSizeBase200,\n  lineHeight: tokens.fontSizeBase200,\n  fontWeight: tokens.fontWeightRegular,\n  color: tokens.colorNeutralForeground2,\n});\n\nconst useInvertedStyles = makeStyles({\n  root: {\n    color: tokens.colorNeutralForegroundInverted2,\n  },\n  subtitle: {\n    color: tokens.colorNeutralForegroundInverted2,\n  },\n});\n\n/**\n * Apply styling to the ToastBody slots based on the state\n */\nexport const useToastBodyStyles_unstable = (state: ToastBodyState): ToastBodyState => {\n  const rootBaseClassName = useRootBaseClassName();\n  const subtitleBaseClassName = useSubtitleBaseClassName();\n  const invertedStyles = useInvertedStyles();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    toastBodyClassNames.root,\n    rootBaseClassName,\n    state.backgroundAppearance === 'inverted' && invertedStyles.root,\n    state.root.className,\n  );\n\n  if (state.subtitle) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.subtitle.className = mergeClasses(\n      toastBodyClassNames.subtitle,\n      subtitleBaseClassName,\n      state.backgroundAppearance === 'inverted' && invertedStyles.subtitle,\n      state.subtitle.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","toastBodyClassNames","root","subtitle","useRootBaseClassName","gridColumnStart","gridColumnEnd","paddingTop","fontSize","fontSizeBase300","lineHeight","lineHeightBase300","fontWeight","fontWeightRegular","color","colorNeutralForeground1","wordBreak","useSubtitleBaseClassName","fontSizeBase200","colorNeutralForeground2","useInvertedStyles","colorNeutralForegroundInverted2","useToastBodyStyles_unstable","state","rootBaseClassName","subtitleBaseClassName","invertedStyles","className","backgroundAppearance"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,MAAM,QAAQ,wBAAwB;AAI/C,OAAO,MAAMC,sBAAsD;IACjEC,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF,MAAMC,uBAAuBP,gBAAgB;IAC3CQ,iBAAiB;IACjBC,eAAe;IACfC,YAAY;IACZC,UAAUR,OAAOS,eAAe;IAChCC,YAAYV,OAAOW,iBAAiB;IACpCC,YAAYZ,OAAOa,iBAAiB;IACpCC,OAAOd,OAAOe,uBAAuB;IACrCC,WAAW;AACb;AAEA,MAAMC,2BAA2BpB,gBAAgB;IAC/CU,YAAY;IACZF,iBAAiB;IACjBC,eAAe;IACfE,UAAUR,OAAOkB,eAAe;IAChCR,YAAYV,OAAOkB,eAAe;IAClCN,YAAYZ,OAAOa,iBAAiB;IACpCC,OAAOd,OAAOmB,uBAAuB;AACvC;AAEA,MAAMC,oBAAoBtB,WAAW;IACnCI,MAAM;QACJY,OAAOd,OAAOqB,+BAA+B;IAC/C;IACAlB,UAAU;QACRW,OAAOd,OAAOqB,+BAA+B;IAC/C;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1C,MAAMC,oBAAoBpB;IAC1B,MAAMqB,wBAAwBR;IAC9B,MAAMS,iBAAiBN;IACvB,oDAAoD;IACpDG,MAAMrB,IAAI,CAACyB,SAAS,GAAG5B,aACrBE,oBAAoBC,IAAI,EACxBsB,mBACAD,MAAMK,oBAAoB,KAAK,cAAcF,eAAexB,IAAI,EAChEqB,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,QAAQ,EAAE;QAClB,oDAAoD;QACpDoB,MAAMpB,QAAQ,CAACwB,SAAS,GAAG5B,aACzBE,oBAAoBE,QAAQ,EAC5BsB,uBACAF,MAAMK,oBAAoB,KAAK,cAAcF,eAAevB,QAAQ,EACpEoB,MAAMpB,QAAQ,CAACwB,SAAS;IAE5B;IAEA,OAAOJ;AACT,EAAE"}

package/lib/components/ToastContainer/ToastContainer.js

@@ -1,10 +1,10 @@
 'use client';
-import * as React from 'react';
-import { useToastContainer_unstable } from './useToastContainer';
-import { renderToastContainer_unstable } from './renderToastContainer';
-import { useToastContainerStyles_unstable } from './useToastContainerStyles.styles';
-import { useToastContainerContextValues_unstable } from './useToastContainerContextValues';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useToastContainer_unstable } from "./useToastContainer.js";
+import { renderToastContainer_unstable } from "./renderToastContainer.js";
+import { useToastContainerStyles_unstable } from "./useToastContainerStyles.styles.js";
+import { useToastContainerContextValues_unstable } from "./useToastContainerContextValues.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 /**
  * ToastContainer component
  */ export const ToastContainer = /*#__PURE__*/ React.forwardRef((props, ref)=>{

package/lib/components/ToastContainer/ToastContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastContainer/ToastContainer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useToastContainer_unstable } from './useToastContainer';\nimport { renderToastContainer_unstable } from './renderToastContainer';\nimport { useToastContainerStyles_unstable } from './useToastContainerStyles.styles';\nimport type { ToastContainerProps } from './ToastContainer.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToastContainerContextValues_unstable } from './useToastContainerContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToastContainer component\n */\nexport const ToastContainer: ForwardRefComponent<ToastContainerProps> = React.forwardRef((props, ref) => {\n  const state = useToastContainer_unstable(props, ref);\n\n  useToastContainerStyles_unstable(state);\n  useCustomStyleHook_unstable('useToastContainerStyles_unstable')(state);\n\n  return renderToastContainer_unstable(state, useToastContainerContextValues_unstable(state));\n});\n\nToastContainer.displayName = 'ToastContainer';\n"],"names":["React","useToastContainer_unstable","renderToastContainer_unstable","useToastContainerStyles_unstable","useToastContainerContextValues_unstable","useCustomStyleHook_unstable","ToastContainer","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAGpF,SAASC,uCAAuC,QAAQ,mCAAmC;AAC3F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDN,iCAAiCO;IACjCL,4BAA4B,oCAAoCK;IAEhE,OAAOR,8BAA8BQ,OAAON,wCAAwCM;AACtF,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/ToastContainer/ToastContainer.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useToastContainer_unstable } from './useToastContainer';\nimport { renderToastContainer_unstable } from './renderToastContainer';\nimport { useToastContainerStyles_unstable } from './useToastContainerStyles.styles';\nimport type { ToastContainerProps } from './ToastContainer.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToastContainerContextValues_unstable } from './useToastContainerContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToastContainer component\n */\nexport const ToastContainer: ForwardRefComponent<ToastContainerProps> = React.forwardRef((props, ref) => {\n  const state = useToastContainer_unstable(props, ref);\n\n  useToastContainerStyles_unstable(state);\n  useCustomStyleHook_unstable('useToastContainerStyles_unstable')(state);\n\n  return renderToastContainer_unstable(state, useToastContainerContextValues_unstable(state));\n});\n\nToastContainer.displayName = 'ToastContainer';\n"],"names":["React","useToastContainer_unstable","renderToastContainer_unstable","useToastContainerStyles_unstable","useToastContainerContextValues_unstable","useCustomStyleHook_unstable","ToastContainer","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,6BAA6B,QAAQ,4BAAyB;AACvE,SAASC,gCAAgC,QAAQ,sCAAmC;AAGpF,SAASC,uCAAuC,QAAQ,sCAAmC;AAC3F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDN,iCAAiCO;IACjCL,4BAA4B,oCAAoCK;IAEhE,OAAOR,8BAA8BQ,OAAON,wCAAwCM;AACtF,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}

package/lib/components/ToastContainer/index.js

@@ -1,5 +1,5 @@
-export { ToastContainer } from './ToastContainer';
-export { renderToastContainer_unstable } from './renderToastContainer';
-export { useToastContainer_unstable } from './useToastContainer';
-export { toastContainerClassNames, useToastContainerStyles_unstable } from './useToastContainerStyles.styles';
-export { useToastContainerContextValues_unstable } from './useToastContainerContextValues';
+export { ToastContainer } from "./ToastContainer.js";
+export { renderToastContainer_unstable } from "./renderToastContainer.js";
+export { useToastContainer_unstable } from "./useToastContainer.js";
+export { toastContainerClassNames, useToastContainerStyles_unstable } from "./useToastContainerStyles.styles.js";
+export { useToastContainerContextValues_unstable } from "./useToastContainerContextValues.js";

package/lib/components/ToastContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastContainer/index.ts"],"sourcesContent":["export { ToastContainer } from './ToastContainer';\nexport type {\n  ToastContainerContextValues,\n  ToastContainerProps,\n  ToastContainerSlots,\n  ToastContainerState,\n} from './ToastContainer.types';\nexport { renderToastContainer_unstable } from './renderToastContainer';\nexport { useToastContainer_unstable } from './useToastContainer';\nexport { toastContainerClassNames, useToastContainerStyles_unstable } from './useToastContainerStyles.styles';\nexport { useToastContainerContextValues_unstable } from './useToastContainerContextValues';\n"],"names":["ToastContainer","renderToastContainer_unstable","useToastContainer_unstable","toastContainerClassNames","useToastContainerStyles_unstable","useToastContainerContextValues_unstable"],"mappings":"AAAA,SAASA,cAAc,QAAQ,mBAAmB;AAOlD,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,wBAAwB,EAAEC,gCAAgC,QAAQ,mCAAmC;AAC9G,SAASC,uCAAuC,QAAQ,mCAAmC"}
+{"version":3,"sources":["../src/components/ToastContainer/index.ts"],"sourcesContent":["export { ToastContainer } from './ToastContainer';\nexport type {\n  ToastContainerContextValues,\n  ToastContainerProps,\n  ToastContainerSlots,\n  ToastContainerState,\n} from './ToastContainer.types';\nexport { renderToastContainer_unstable } from './renderToastContainer';\nexport { useToastContainer_unstable } from './useToastContainer';\nexport { toastContainerClassNames, useToastContainerStyles_unstable } from './useToastContainerStyles.styles';\nexport { useToastContainerContextValues_unstable } from './useToastContainerContextValues';\n"],"names":["ToastContainer","renderToastContainer_unstable","useToastContainer_unstable","toastContainerClassNames","useToastContainerStyles_unstable","useToastContainerContextValues_unstable"],"mappings":"AAAA,SAASA,cAAc,QAAQ,sBAAmB;AAOlD,SAASC,6BAA6B,QAAQ,4BAAyB;AACvE,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,wBAAwB,EAAEC,gCAAgC,QAAQ,sCAAmC;AAC9G,SAASC,uCAAuC,QAAQ,sCAAmC"}

package/lib/components/ToastContainer/renderToastContainer.js

@@ -1,8 +1,8 @@
   'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
-import { ToastContainerContextProvider } from '../../contexts/toastContainerContext';
-import { CollapseDelayed } from '@fluentui/react-motion-components-preview';
+import { assertSlots } from "@fluentui/react-utilities";
+import { ToastContainerContextProvider } from "../../contexts/toastContainerContext.js";
+import { CollapseDelayed } from "@fluentui/react-motion-components-preview";
 /**
  * Render the final JSX of ToastContainer
  */ export const renderToastContainer_unstable = (state, contextValues)=>{

package/lib/components/ToastContainer/renderToastContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastContainer/renderToastContainer.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\n'use client';\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { ToastContainerState, ToastContainerSlots, ToastContainerContextValues } from './ToastContainer.types';\nimport { ToastContainerContextProvider } from '../../contexts/toastContainerContext';\nimport { CollapseDelayed } from '@fluentui/react-motion-components-preview';\n\n/**\n * Render the final JSX of ToastContainer\n */\nexport const renderToastContainer_unstable = (\n  state: ToastContainerState,\n  contextValues: ToastContainerContextValues,\n): JSXElement => {\n  const { onMotionFinish, visible, updateId } = state;\n  assertSlots<ToastContainerSlots>(state);\n\n  return (\n    <ToastContainerContextProvider value={contextValues.toast}>\n      <CollapseDelayed appear onMotionFinish={onMotionFinish} visible={visible} unmountOnExit>\n        <state.root>\n          {state.root.children}\n          <state.timer key={updateId} />\n        </state.root>\n      </CollapseDelayed>\n    </ToastContainerContextProvider>\n  );\n};\n"],"names":["assertSlots","ToastContainerContextProvider","CollapseDelayed","renderToastContainer_unstable","state","contextValues","onMotionFinish","visible","updateId","value","toast","appear","unmountOnExit","root","children","timer"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD,GAEjD;;AAEA,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,6BAA6B,QAAQ,uCAAuC;AACrF,SAASC,eAAe,QAAQ,4CAA4C;AAE5E;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEA,MAAM,EAAEC,cAAc,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGJ;IAC9CJ,YAAiCI;IAEjC,qBACE,KAACH;QAA8BQ,OAAOJ,cAAcK,KAAK;kBACvD,cAAA,KAACR;YAAgBS,MAAM;YAACL,gBAAgBA;YAAgBC,SAASA;YAASK,aAAa;sBACrF,cAAA,MAACR,MAAMS,IAAI;;oBACRT,MAAMS,IAAI,CAACC,QAAQ;kCACpB,KAACV,MAAMW,KAAK,MAAMP;;;;;AAK5B,EAAE"}
+{"version":3,"sources":["../src/components/ToastContainer/renderToastContainer.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\n'use client';\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { ToastContainerState, ToastContainerSlots, ToastContainerContextValues } from './ToastContainer.types';\nimport { ToastContainerContextProvider } from '../../contexts/toastContainerContext';\nimport { CollapseDelayed } from '@fluentui/react-motion-components-preview';\n\n/**\n * Render the final JSX of ToastContainer\n */\nexport const renderToastContainer_unstable = (\n  state: ToastContainerState,\n  contextValues: ToastContainerContextValues,\n): JSXElement => {\n  const { onMotionFinish, visible, updateId } = state;\n  assertSlots<ToastContainerSlots>(state);\n\n  return (\n    <ToastContainerContextProvider value={contextValues.toast}>\n      <CollapseDelayed appear onMotionFinish={onMotionFinish} visible={visible} unmountOnExit>\n        <state.root>\n          {state.root.children}\n          <state.timer key={updateId} />\n        </state.root>\n      </CollapseDelayed>\n    </ToastContainerContextProvider>\n  );\n};\n"],"names":["assertSlots","ToastContainerContextProvider","CollapseDelayed","renderToastContainer_unstable","state","contextValues","onMotionFinish","visible","updateId","value","toast","appear","unmountOnExit","root","children","timer"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD,GAEjD;;AAEA,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,6BAA6B,QAAQ,0CAAuC;AACrF,SAASC,eAAe,QAAQ,4CAA4C;AAE5E;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEA,MAAM,EAAEC,cAAc,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGJ;IAC9CJ,YAAiCI;IAEjC,qBACE,KAACH;QAA8BQ,OAAOJ,cAAcK,KAAK;kBACvD,cAAA,KAACR;YAAgBS,MAAM;YAACL,gBAAgBA;YAAgBC,SAASA;YAASK,aAAa;sBACrF,cAAA,MAACR,MAAMS,IAAI;;oBACRT,MAAMS,IAAI,CAACC,QAAQ;kCACpB,KAACV,MAAMW,KAAK,MAAMP;;;;;AAK5B,EAAE"}

package/lib/components/ToastContainer/useToastContainer.js

@@ -1,10 +1,10 @@
 'use client';
-import * as React from 'react';
-import { getIntrinsicElementProps, useMergedRefs, useEventCallback, useId, slot } from '@fluentui/react-utilities';
-import { useFluent_unstable } from '@fluentui/react-shared-contexts';
-import { Delete, Tab } from '@fluentui/keyboard-keys';
-import { useFocusableGroup, useFocusFinders } from '@fluentui/react-tabster';
-import { Timer } from '../Timer/Timer';
+import * as React from "react";
+import { getIntrinsicElementProps, useMergedRefs, useEventCallback, useId, slot } from "@fluentui/react-utilities";
+import { useFluent_unstable } from "@fluentui/react-shared-contexts";
+import { Delete, Tab } from "@fluentui/keyboard-keys";
+import { useFocusableGroup, useFocusFinders } from "@fluentui/react-tabster";
+import { Timer } from "../Timer/Timer.js";
 const intentPolitenessMap = {
     success: 'assertive',
     warning: 'assertive',

package/lib/components/ToastContainer/useToastContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastContainer/useToastContainer.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getIntrinsicElementProps, useMergedRefs, useEventCallback, useId, slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { Delete, Tab } from '@fluentui/keyboard-keys';\nimport { useFocusableGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport type { ToastStatus } from '../../state';\nimport type { ToastContainerProps, ToastContainerState } from './ToastContainer.types';\nimport type { TimerProps } from '../Timer/Timer';\nimport { Timer } from '../Timer/Timer';\n\nconst intentPolitenessMap = {\n  success: 'assertive',\n  warning: 'assertive',\n  error: 'assertive',\n  info: 'polite',\n} as const;\n\n/**\n * Create the state required to render ToastContainer.\n *\n * The returned state can be modified with hooks such as useToastContainerStyles_unstable,\n * before being passed to renderToastContainer_unstable.\n *\n * @param props - props from this instance of ToastContainer\n * @param ref - reference to root HTMLElement of ToastContainer\n */\nexport const useToastContainer_unstable = (\n  props: ToastContainerProps,\n  ref: React.Ref<HTMLElement>,\n): ToastContainerState => {\n  const {\n    visible,\n    children,\n    close: closeProp,\n    remove,\n    updateId,\n    announce,\n    data,\n    timeout: timerTimeout,\n    politeness: desiredPoliteness,\n    intent = 'info',\n    pauseOnHover,\n    pauseOnWindowBlur,\n    imperativeRef,\n    tryRestoreFocus,\n    content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n    ...rest\n  } = props;\n  const titleId = useId('toast-title');\n  const bodyId = useId('toast-body');\n  const toastRef = React.useRef<HTMLDivElement | null>(null);\n  const { targetDocument } = useFluent_unstable();\n  const [running, setRunning] = React.useState(false);\n  const imperativePauseRef = React.useRef(false);\n  const focusedToastBeforeClose = React.useRef(false);\n  const focusableGroupAttribute = useFocusableGroup({\n    tabBehavior: 'limited-trap-focus',\n    // Users should only use Tab to focus into the toast\n    // Escape is already reserved to dismiss all toasts\n    ignoreDefaultKeydown: { Tab: true, Escape: true, Enter: true },\n  });\n\n  const close = useEventCallback(() => {\n    const activeElement = targetDocument?.activeElement;\n    if (activeElement && toastRef.current?.contains(activeElement)) {\n      focusedToastBeforeClose.current = true;\n    }\n\n    closeProp();\n  });\n  const onStatusChange = useEventCallback((status: ToastStatus) => props.onStatusChange?.(null, { status, ...props }));\n  const pause = useEventCallback(() => setRunning(false));\n  const play = useEventCallback(() => {\n    if (imperativePauseRef.current) {\n      return;\n    }\n    const containsActive = !!toastRef.current?.contains(targetDocument?.activeElement ?? null);\n    if (timerTimeout < 0) {\n      setRunning(true);\n      return;\n    }\n\n    if (!containsActive) {\n      setRunning(true);\n    }\n  });\n\n  React.useImperativeHandle(imperativeRef, () => ({\n    focus: () => {\n      if (!toastRef.current) {\n        return;\n      }\n\n      toastRef.current.focus();\n    },\n\n    play: () => {\n      imperativePauseRef.current = false;\n      play();\n    },\n    pause: () => {\n      imperativePauseRef.current = true;\n      pause();\n    },\n  }));\n\n  React.useEffect(() => {\n    return () => onStatusChange('unmounted');\n  }, [onStatusChange]);\n\n  React.useEffect(() => {\n    if (!targetDocument) {\n      return;\n    }\n\n    if (pauseOnWindowBlur) {\n      targetDocument.defaultView?.addEventListener('focus', play);\n      targetDocument.defaultView?.addEventListener('blur', pause);\n      return () => {\n        targetDocument.defaultView?.removeEventListener('focus', play);\n        targetDocument.defaultView?.removeEventListener('blur', pause);\n      };\n    }\n  }, [targetDocument, pause, play, pauseOnWindowBlur]);\n\n  // Users never actually use ToastContainer as a JSX but imperatively through useToastContainerController\n  const userRootSlot = (data as { root?: ExtractSlotProps<Slot<'div'>> }).root;\n  const onMotionFinish = React.useCallback(\n    (_: null, { direction }: { direction: 'exit' | 'enter' }) => {\n      if (direction === 'exit') {\n        remove();\n      }\n\n      if (direction === 'enter') {\n        // start toast once it's fully animated in\n        play();\n        onStatusChange('visible');\n      }\n    },\n    [onStatusChange, play, remove],\n  );\n\n  const onMouseEnter = useEventCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    pause();\n    userRootSlot?.onMouseEnter?.(e);\n  });\n\n  const onMouseLeave = useEventCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    play();\n    userRootSlot?.onMouseEnter?.(e);\n  });\n\n  const { findFirstFocusable, findLastFocusable } = useFocusFinders();\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === Delete) {\n      e.preventDefault();\n      close();\n    }\n\n    if (e.key === Tab && e.currentTarget === e.target) {\n      e.preventDefault();\n      if (e.shiftKey) {\n        findLastFocusable(e.currentTarget)?.focus();\n      } else {\n        findFirstFocusable(e.currentTarget)?.focus();\n      }\n    }\n\n    userRootSlot?.onKeyDown?.(e);\n  });\n\n  React.useEffect(() => {\n    if (!visible) {\n      return;\n    }\n\n    const politeness = desiredPoliteness ?? intentPolitenessMap[intent];\n    announce(toastRef.current?.textContent ?? '', { politeness });\n  }, [announce, desiredPoliteness, toastRef, visible, updateId, intent]);\n\n  React.useEffect(() => {\n    return () => {\n      if (focusedToastBeforeClose.current) {\n        focusedToastBeforeClose.current = false;\n        tryRestoreFocus();\n      }\n    };\n  }, [tryRestoreFocus]);\n\n  return {\n    components: {\n      timer: Timer,\n      root: 'div',\n    },\n    timer: slot.always<TimerProps>({ onTimeout: close, running, timeout: timerTimeout ?? -1 }, { elementType: Timer }),\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, toastRef) as React.Ref<HTMLDivElement>,\n        children,\n        tabIndex: 0,\n        role: 'listitem',\n        'aria-labelledby': titleId,\n        'aria-describedby': bodyId,\n        ...rest,\n        ...userRootSlot,\n        ...focusableGroupAttribute,\n        onMouseEnter,\n        onMouseLeave,\n        onKeyDown,\n      }),\n      { elementType: 'div' },\n    ),\n    timerTimeout,\n    transitionTimeout: 0,\n    running,\n    visible,\n    remove,\n    close,\n    onTransitionEntering: () => {\n      /* no-op */\n    },\n    updateId,\n    nodeRef: toastRef,\n    intent,\n    titleId,\n    bodyId,\n    onMotionFinish,\n  };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","useEventCallback","useId","slot","useFluent_unstable","Delete","Tab","useFocusableGroup","useFocusFinders","Timer","intentPolitenessMap","success","warning","error","info","useToastContainer_unstable","props","ref","visible","children","close","closeProp","remove","updateId","announce","data","timeout","timerTimeout","politeness","desiredPoliteness","intent","pauseOnHover","pauseOnWindowBlur","imperativeRef","tryRestoreFocus","content","_content","rest","titleId","bodyId","toastRef","useRef","targetDocument","running","setRunning","useState","imperativePauseRef","focusedToastBeforeClose","focusableGroupAttribute","tabBehavior","ignoreDefaultKeydown","Escape","Enter","activeElement","current","contains","onStatusChange","status","pause","play","containsActive","useImperativeHandle","focus","useEffect","defaultView","addEventListener","removeEventListener","userRootSlot","root","onMotionFinish","useCallback","_","direction","onMouseEnter","e","onMouseLeave","findFirstFocusable","findLastFocusable","onKeyDown","key","preventDefault","currentTarget","target","shiftKey","textContent","components","timer","always","onTimeout","elementType","tabIndex","role","transitionTimeout","onTransitionEntering","nodeRef"],"mappings":"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"}
+{"version":3,"sources":["../src/components/ToastContainer/useToastContainer.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getIntrinsicElementProps, useMergedRefs, useEventCallback, useId, slot } from '@fluentui/react-utilities';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { Delete, Tab } from '@fluentui/keyboard-keys';\nimport { useFocusableGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport type { ToastStatus } from '../../state';\nimport type { ToastContainerProps, ToastContainerState } from './ToastContainer.types';\nimport type { TimerProps } from '../Timer/Timer';\nimport { Timer } from '../Timer/Timer';\n\nconst intentPolitenessMap = {\n  success: 'assertive',\n  warning: 'assertive',\n  error: 'assertive',\n  info: 'polite',\n} as const;\n\n/**\n * Create the state required to render ToastContainer.\n *\n * The returned state can be modified with hooks such as useToastContainerStyles_unstable,\n * before being passed to renderToastContainer_unstable.\n *\n * @param props - props from this instance of ToastContainer\n * @param ref - reference to root HTMLElement of ToastContainer\n */\nexport const useToastContainer_unstable = (\n  props: ToastContainerProps,\n  ref: React.Ref<HTMLElement>,\n): ToastContainerState => {\n  const {\n    visible,\n    children,\n    close: closeProp,\n    remove,\n    updateId,\n    announce,\n    data,\n    timeout: timerTimeout,\n    politeness: desiredPoliteness,\n    intent = 'info',\n    pauseOnHover,\n    pauseOnWindowBlur,\n    imperativeRef,\n    tryRestoreFocus,\n    content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n    ...rest\n  } = props;\n  const titleId = useId('toast-title');\n  const bodyId = useId('toast-body');\n  const toastRef = React.useRef<HTMLDivElement | null>(null);\n  const { targetDocument } = useFluent_unstable();\n  const [running, setRunning] = React.useState(false);\n  const imperativePauseRef = React.useRef(false);\n  const focusedToastBeforeClose = React.useRef(false);\n  const focusableGroupAttribute = useFocusableGroup({\n    tabBehavior: 'limited-trap-focus',\n    // Users should only use Tab to focus into the toast\n    // Escape is already reserved to dismiss all toasts\n    ignoreDefaultKeydown: { Tab: true, Escape: true, Enter: true },\n  });\n\n  const close = useEventCallback(() => {\n    const activeElement = targetDocument?.activeElement;\n    if (activeElement && toastRef.current?.contains(activeElement)) {\n      focusedToastBeforeClose.current = true;\n    }\n\n    closeProp();\n  });\n  const onStatusChange = useEventCallback((status: ToastStatus) => props.onStatusChange?.(null, { status, ...props }));\n  const pause = useEventCallback(() => setRunning(false));\n  const play = useEventCallback(() => {\n    if (imperativePauseRef.current) {\n      return;\n    }\n    const containsActive = !!toastRef.current?.contains(targetDocument?.activeElement ?? null);\n    if (timerTimeout < 0) {\n      setRunning(true);\n      return;\n    }\n\n    if (!containsActive) {\n      setRunning(true);\n    }\n  });\n\n  React.useImperativeHandle(imperativeRef, () => ({\n    focus: () => {\n      if (!toastRef.current) {\n        return;\n      }\n\n      toastRef.current.focus();\n    },\n\n    play: () => {\n      imperativePauseRef.current = false;\n      play();\n    },\n    pause: () => {\n      imperativePauseRef.current = true;\n      pause();\n    },\n  }));\n\n  React.useEffect(() => {\n    return () => onStatusChange('unmounted');\n  }, [onStatusChange]);\n\n  React.useEffect(() => {\n    if (!targetDocument) {\n      return;\n    }\n\n    if (pauseOnWindowBlur) {\n      targetDocument.defaultView?.addEventListener('focus', play);\n      targetDocument.defaultView?.addEventListener('blur', pause);\n      return () => {\n        targetDocument.defaultView?.removeEventListener('focus', play);\n        targetDocument.defaultView?.removeEventListener('blur', pause);\n      };\n    }\n  }, [targetDocument, pause, play, pauseOnWindowBlur]);\n\n  // Users never actually use ToastContainer as a JSX but imperatively through useToastContainerController\n  const userRootSlot = (data as { root?: ExtractSlotProps<Slot<'div'>> }).root;\n  const onMotionFinish = React.useCallback(\n    (_: null, { direction }: { direction: 'exit' | 'enter' }) => {\n      if (direction === 'exit') {\n        remove();\n      }\n\n      if (direction === 'enter') {\n        // start toast once it's fully animated in\n        play();\n        onStatusChange('visible');\n      }\n    },\n    [onStatusChange, play, remove],\n  );\n\n  const onMouseEnter = useEventCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    pause();\n    userRootSlot?.onMouseEnter?.(e);\n  });\n\n  const onMouseLeave = useEventCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    play();\n    userRootSlot?.onMouseEnter?.(e);\n  });\n\n  const { findFirstFocusable, findLastFocusable } = useFocusFinders();\n  const onKeyDown = useEventCallback((e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === Delete) {\n      e.preventDefault();\n      close();\n    }\n\n    if (e.key === Tab && e.currentTarget === e.target) {\n      e.preventDefault();\n      if (e.shiftKey) {\n        findLastFocusable(e.currentTarget)?.focus();\n      } else {\n        findFirstFocusable(e.currentTarget)?.focus();\n      }\n    }\n\n    userRootSlot?.onKeyDown?.(e);\n  });\n\n  React.useEffect(() => {\n    if (!visible) {\n      return;\n    }\n\n    const politeness = desiredPoliteness ?? intentPolitenessMap[intent];\n    announce(toastRef.current?.textContent ?? '', { politeness });\n  }, [announce, desiredPoliteness, toastRef, visible, updateId, intent]);\n\n  React.useEffect(() => {\n    return () => {\n      if (focusedToastBeforeClose.current) {\n        focusedToastBeforeClose.current = false;\n        tryRestoreFocus();\n      }\n    };\n  }, [tryRestoreFocus]);\n\n  return {\n    components: {\n      timer: Timer,\n      root: 'div',\n    },\n    timer: slot.always<TimerProps>({ onTimeout: close, running, timeout: timerTimeout ?? -1 }, { elementType: Timer }),\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: useMergedRefs(ref, toastRef) as React.Ref<HTMLDivElement>,\n        children,\n        tabIndex: 0,\n        role: 'listitem',\n        'aria-labelledby': titleId,\n        'aria-describedby': bodyId,\n        ...rest,\n        ...userRootSlot,\n        ...focusableGroupAttribute,\n        onMouseEnter,\n        onMouseLeave,\n        onKeyDown,\n      }),\n      { elementType: 'div' },\n    ),\n    timerTimeout,\n    transitionTimeout: 0,\n    running,\n    visible,\n    remove,\n    close,\n    onTransitionEntering: () => {\n      /* no-op */\n    },\n    updateId,\n    nodeRef: toastRef,\n    intent,\n    titleId,\n    bodyId,\n    onMotionFinish,\n  };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","useEventCallback","useId","slot","useFluent_unstable","Delete","Tab","useFocusableGroup","useFocusFinders","Timer","intentPolitenessMap","success","warning","error","info","useToastContainer_unstable","props","ref","visible","children","close","closeProp","remove","updateId","announce","data","timeout","timerTimeout","politeness","desiredPoliteness","intent","pauseOnHover","pauseOnWindowBlur","imperativeRef","tryRestoreFocus","content","_content","rest","titleId","bodyId","toastRef","useRef","targetDocument","running","setRunning","useState","imperativePauseRef","focusedToastBeforeClose","focusableGroupAttribute","tabBehavior","ignoreDefaultKeydown","Escape","Enter","activeElement","current","contains","onStatusChange","status","pause","play","containsActive","useImperativeHandle","focus","useEffect","defaultView","addEventListener","removeEventListener","userRootSlot","root","onMotionFinish","useCallback","_","direction","onMouseEnter","e","onMouseLeave","findFirstFocusable","findLastFocusable","onKeyDown","key","preventDefault","currentTarget","target","shiftKey","textContent","components","timer","always","onTimeout","elementType","tabIndex","role","transitionTimeout","onTransitionEntering","nodeRef"],"mappings":"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"}

package/lib/components/ToastContainer/useToastContainerContextValues.js

@@ -1,5 +1,5 @@
 'use client';
-import * as React from 'react';
+import * as React from "react";
 export function useToastContainerContextValues_unstable(state) {
     const { close, intent, titleId, bodyId } = state;
     const toastContainerContext = React.useMemo(()=>({

package/lib/components/ToastContainer/useToastContainerStyles.styles.js

@@ -1,8 +1,8 @@
 'use client';
 
-import { __resetStyles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
-import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';
+import { __resetStyles, mergeClasses } from "@griffel/react";
+import { tokens } from "@fluentui/react-theme";
+import { createCustomFocusIndicatorStyle } from "@fluentui/react-tabster";
 export const toastContainerClassNames = {
   root: 'fui-ToastContainer',
   timer: 'fui-ToastContainer__timer'
@@ -12,8 +12,6 @@ const useRootBaseClassName = /*#__PURE__*/__resetStyles("r98b696", null, [".r98b
  * Apply styling to the ToastContainer slots based on the state
  */
 export const useToastContainerStyles_unstable = state => {
-  'use no memo';
-
   const rootBaseClassName = useRootBaseClassName();
   // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);

package/lib/components/ToastContainer/useToastContainerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__resetStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","toastContainerClassNames","root","timer","useRootBaseClassName","useToastContainerStyles_unstable","state","rootBaseClassName","className"],"sources":["useToastContainerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const toastContainerClassNames = {\n    root: 'fui-ToastContainer',\n    timer: 'fui-ToastContainer__timer'\n};\nconst useRootBaseClassName = makeResetStyles({\n    boxSizing: 'border-box',\n    marginTop: '16px',\n    pointerEvents: 'all',\n    borderRadius: tokens.borderRadiusMedium,\n    ...createCustomFocusIndicatorStyle({\n        outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`\n    })\n});\n/**\n * Apply styling to the ToastContainer slots based on the state\n */ export const useToastContainerStyles_unstable = (state)=>{\n    'use no memo';\n    const rootBaseClassName = useRootBaseClassName();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE,oBAAoB;EAC1BC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,oBAAoB,gBAAGP,aAAA,sOAQ5B,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMQ,gCAAgC,GAAIC,KAAK,IAAG;EACzD,aAAa;;EACb,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;EAChD;EACAE,KAAK,CAACJ,IAAI,CAACM,SAAS,GAAGV,YAAY,CAACG,wBAAwB,CAACC,IAAI,EAAEK,iBAAiB,EAAED,KAAK,CAACJ,IAAI,CAACM,SAAS,CAAC;EAC3G,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["__resetStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","toastContainerClassNames","root","timer","useRootBaseClassName","useToastContainerStyles_unstable","state","rootBaseClassName","className"],"sources":["useToastContainerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from \"@griffel/react\";\nimport { tokens } from \"@fluentui/react-theme\";\nimport { createCustomFocusIndicatorStyle } from \"@fluentui/react-tabster\";\nexport const toastContainerClassNames = {\n    root: 'fui-ToastContainer',\n    timer: 'fui-ToastContainer__timer'\n};\nconst useRootBaseClassName = makeResetStyles({\n    boxSizing: 'border-box',\n    marginTop: '16px',\n    pointerEvents: 'all',\n    borderRadius: tokens.borderRadiusMedium,\n    ...createCustomFocusIndicatorStyle({\n        outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`\n    })\n});\n/**\n * Apply styling to the ToastContainer slots based on the state\n */ export const useToastContainerStyles_unstable = (state)=>{\n    const rootBaseClassName = useRootBaseClassName();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,OAAO,MAAMC,wBAAwB,GAAG;EACpCC,IAAI,EAAE,oBAAoB;EAC1BC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,oBAAoB,gBAAGP,aAAA,sOAQ5B,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMQ,gCAAgC,GAAIC,KAAK,IAAG;EACzD,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;EAChD;EACAE,KAAK,CAACJ,IAAI,CAACM,SAAS,GAAGV,YAAY,CAACG,wBAAwB,CAACC,IAAI,EAAEK,iBAAiB,EAAED,KAAK,CAACJ,IAAI,CAACM,SAAS,CAAC;EAC3G,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/ToastContainer/useToastContainerStyles.styles.raw.js

@@ -1,7 +1,7 @@
 'use client';
-import { makeResetStyles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
-import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';
+import { makeResetStyles, mergeClasses } from "@griffel/react";
+import { tokens } from "@fluentui/react-theme";
+import { createCustomFocusIndicatorStyle } from "@fluentui/react-tabster";
 export const toastContainerClassNames = {
     root: 'fui-ToastContainer',
     timer: 'fui-ToastContainer__timer'
@@ -18,7 +18,6 @@ const useRootBaseClassName = makeResetStyles({
 /**
  * Apply styling to the ToastContainer slots based on the state
  */ export const useToastContainerStyles_unstable = (state)=>{
-    'use no memo';
     const rootBaseClassName = useRootBaseClassName();
     // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);

package/lib/components/ToastContainer/useToastContainerStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastContainer/useToastContainerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ToastContainerSlots, ToastContainerState } from './ToastContainer.types';\n\nexport const toastContainerClassNames: SlotClassNames<ToastContainerSlots> = {\n  root: 'fui-ToastContainer',\n  timer: 'fui-ToastContainer__timer',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n  boxSizing: 'border-box',\n  marginTop: '16px',\n  pointerEvents: 'all',\n  borderRadius: tokens.borderRadiusMedium,\n  ...createCustomFocusIndicatorStyle({\n    outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n  }),\n});\n\n/**\n * Apply styling to the ToastContainer slots based on the state\n */\nexport const useToastContainerStyles_unstable = (state: ToastContainerState): ToastContainerState => {\n  'use no memo';\n\n  const rootBaseClassName = useRootBaseClassName();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","toastContainerClassNames","root","timer","useRootBaseClassName","boxSizing","marginTop","pointerEvents","borderRadius","borderRadiusMedium","outline","strokeWidthThick","colorStrokeFocus2","useToastContainerStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAC/D,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,SAASC,+BAA+B,QAAQ,0BAA0B;AAG1E,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,uBAAuBP,gBAAgB;IAC3CQ,WAAW;IACXC,WAAW;IACXC,eAAe;IACfC,cAAcT,OAAOU,kBAAkB;IACvC,GAAGT,gCAAgC;QACjCU,SAAS,GAAGX,OAAOY,gBAAgB,CAAC,OAAO,EAAEZ,OAAOa,iBAAiB,EAAE;IACzE,EAAE;AACJ;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,oBAAoBX;IAC1B,oDAAoD;IACpDU,MAAMZ,IAAI,CAACc,SAAS,GAAGlB,aAAaG,yBAAyBC,IAAI,EAAEa,mBAAmBD,MAAMZ,IAAI,CAACc,SAAS;IAE1G,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/ToastContainer/useToastContainerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ToastContainerSlots, ToastContainerState } from './ToastContainer.types';\n\nexport const toastContainerClassNames: SlotClassNames<ToastContainerSlots> = {\n  root: 'fui-ToastContainer',\n  timer: 'fui-ToastContainer__timer',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n  boxSizing: 'border-box',\n  marginTop: '16px',\n  pointerEvents: 'all',\n  borderRadius: tokens.borderRadiusMedium,\n  ...createCustomFocusIndicatorStyle({\n    outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n  }),\n});\n\n/**\n * Apply styling to the ToastContainer slots based on the state\n */\nexport const useToastContainerStyles_unstable = (state: ToastContainerState): ToastContainerState => {\n  const rootBaseClassName = useRootBaseClassName();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","toastContainerClassNames","root","timer","useRootBaseClassName","boxSizing","marginTop","pointerEvents","borderRadius","borderRadiusMedium","outline","strokeWidthThick","colorStrokeFocus2","useToastContainerStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAC/D,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,SAASC,+BAA+B,QAAQ,0BAA0B;AAG1E,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,uBAAuBP,gBAAgB;IAC3CQ,WAAW;IACXC,WAAW;IACXC,eAAe;IACfC,cAAcT,OAAOU,kBAAkB;IACvC,GAAGT,gCAAgC;QACjCU,SAAS,GAAGX,OAAOY,gBAAgB,CAAC,OAAO,EAAEZ,OAAOa,iBAAiB,EAAE;IACzE,EAAE;AACJ;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C,MAAMC,oBAAoBX;IAC1B,oDAAoD;IACpDU,MAAMZ,IAAI,CAACc,SAAS,GAAGlB,aAAaG,yBAAyBC,IAAI,EAAEa,mBAAmBD,MAAMZ,IAAI,CAACc,SAAS;IAE1G,OAAOF;AACT,EAAE"}

package/lib/components/ToastFooter/ToastFooter.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { useToastFooter_unstable } from './useToastFooter';
-import { renderToastFooter_unstable } from './renderToastFooter';
-import { useToastFooterStyles_unstable } from './useToastFooterStyles.styles';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useToastFooter_unstable } from "./useToastFooter.js";
+import { renderToastFooter_unstable } from "./renderToastFooter.js";
+import { useToastFooterStyles_unstable } from "./useToastFooterStyles.styles.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 /**
  * ToastFooter component
  */ export const ToastFooter = /*#__PURE__*/ React.forwardRef((props, ref)=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastFooter/ToastFooter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useToastFooter_unstable } from './useToastFooter';\nimport { renderToastFooter_unstable } from './renderToastFooter';\nimport { useToastFooterStyles_unstable } from './useToastFooterStyles.styles';\nimport type { ToastFooterProps } from './ToastFooter.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToastFooter component\n */\nexport const ToastFooter: ForwardRefComponent<ToastFooterProps> = React.forwardRef((props, ref) => {\n  const state = useToastFooter_unstable(props, ref);\n\n  useToastFooterStyles_unstable(state);\n  useCustomStyleHook_unstable('useToastFooterStyles_unstable')(state);\n\n  return renderToastFooter_unstable(state);\n});\n\nToastFooter.displayName = 'ToastFooter';\n"],"names":["React","useToastFooter_unstable","renderToastFooter_unstable","useToastFooterStyles_unstable","useCustomStyleHook_unstable","ToastFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CL,8BAA8BM;IAC9BL,4BAA4B,iCAAiCK;IAE7D,OAAOP,2BAA2BO;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/ToastFooter/ToastFooter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useToastFooter_unstable } from './useToastFooter';\nimport { renderToastFooter_unstable } from './renderToastFooter';\nimport { useToastFooterStyles_unstable } from './useToastFooterStyles.styles';\nimport type { ToastFooterProps } from './ToastFooter.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToastFooter component\n */\nexport const ToastFooter: ForwardRefComponent<ToastFooterProps> = React.forwardRef((props, ref) => {\n  const state = useToastFooter_unstable(props, ref);\n\n  useToastFooterStyles_unstable(state);\n  useCustomStyleHook_unstable('useToastFooterStyles_unstable')(state);\n\n  return renderToastFooter_unstable(state);\n});\n\nToastFooter.displayName = 'ToastFooter';\n"],"names":["React","useToastFooter_unstable","renderToastFooter_unstable","useToastFooterStyles_unstable","useCustomStyleHook_unstable","ToastFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,sBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,6BAA6B,QAAQ,mCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CL,8BAA8BM;IAC9BL,4BAA4B,iCAAiCK;IAE7D,OAAOP,2BAA2BO;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}

package/lib/components/ToastFooter/index.js

@@ -1,4 +1,4 @@
-export { ToastFooter } from './ToastFooter';
-export { renderToastFooter_unstable } from './renderToastFooter';
-export { useToastFooter_unstable } from './useToastFooter';
-export { toastFooterClassNames, useToastFooterStyles_unstable } from './useToastFooterStyles.styles';
+export { ToastFooter } from "./ToastFooter.js";
+export { renderToastFooter_unstable } from "./renderToastFooter.js";
+export { useToastFooter_unstable } from "./useToastFooter.js";
+export { toastFooterClassNames, useToastFooterStyles_unstable } from "./useToastFooterStyles.styles.js";

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastFooter/index.ts"],"sourcesContent":["export { ToastFooter } from './ToastFooter';\nexport type { ToastFooterProps, ToastFooterSlots, ToastFooterState } from './ToastFooter.types';\nexport { renderToastFooter_unstable } from './renderToastFooter';\nexport { useToastFooter_unstable } from './useToastFooter';\nexport { toastFooterClassNames, useToastFooterStyles_unstable } from './useToastFooterStyles.styles';\n"],"names":["ToastFooter","renderToastFooter_unstable","useToastFooter_unstable","toastFooterClassNames","useToastFooterStyles_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,gCAAgC"}
+{"version":3,"sources":["../src/components/ToastFooter/index.ts"],"sourcesContent":["export { ToastFooter } from './ToastFooter';\nexport type { ToastFooterProps, ToastFooterSlots, ToastFooterState } from './ToastFooter.types';\nexport { renderToastFooter_unstable } from './renderToastFooter';\nexport { useToastFooter_unstable } from './useToastFooter';\nexport { toastFooterClassNames, useToastFooterStyles_unstable } from './useToastFooterStyles.styles';\n"],"names":["ToastFooter","renderToastFooter_unstable","useToastFooter_unstable","toastFooterClassNames","useToastFooterStyles_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,mBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,uBAAuB,QAAQ,sBAAmB;AAC3D,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,mCAAgC"}

package/lib/components/ToastFooter/renderToastFooter.js

@@ -1,5 +1,5 @@
   import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
+import { assertSlots } from "@fluentui/react-utilities";
 /**
  * Render the final JSX of ToastFooter
  */ export const renderToastFooter_unstable = (state)=>{

package/lib/components/ToastFooter/useToastFooter.js

@@ -1,4 +1,4 @@
-import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
+import { getIntrinsicElementProps, slot } from "@fluentui/react-utilities";
 /**
  * Create the state required to render ToastFooter.
  *

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

@@ -1,6 +1,6 @@
 'use client';
 
-import { __resetStyles, mergeClasses } from '@griffel/react';
+import { __resetStyles, mergeClasses } from "@griffel/react";
 export const toastFooterClassNames = {
   root: 'fui-ToastFooter'
 };
@@ -12,8 +12,6 @@ const useRootBaseClassName = /*#__PURE__*/__resetStyles("r56x6h2", null, [".r56x
  * Apply styling to the ToastFooter slots based on the state
  */
 export const useToastFooterStyles_unstable = state => {
-  'use no memo';
-
   const rootBaseClassName = useRootBaseClassName();
   // eslint-disable-next-line react-hooks/immutability
   state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);

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

@@ -1 +1 @@
-{"version":3,"names":["__resetStyles","mergeClasses","toastFooterClassNames","root","useRootBaseClassName","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"sources":["useToastFooterStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } 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    gap: '14px'\n});\n/**\n * Apply styling to the ToastFooter slots based on the state\n */ export const useToastFooterStyles_unstable = (state)=>{\n    'use no memo';\n    const rootBaseClassName = useRootBaseClassName();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,oBAAoB,gBAAGJ,aAAA,gIAOhC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMK,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;EAChD;EACAE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGP,YAAY,CAACC,qBAAqB,CAACC,IAAI,EAAEI,iBAAiB,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EACxG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["__resetStyles","mergeClasses","toastFooterClassNames","root","useRootBaseClassName","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"sources":["useToastFooterStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } 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    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    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,oBAAoB,gBAAGJ,aAAA,gIAOhC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMK,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;EAChD;EACAE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGP,YAAY,CAACC,qBAAqB,CAACC,IAAI,EAAEI,iBAAiB,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EACxG,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

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

@@ -1,5 +1,5 @@
 'use client';
-import { makeResetStyles, mergeClasses } from '@griffel/react';
+import { makeResetStyles, mergeClasses } from "@griffel/react";
 export const toastFooterClassNames = {
     root: 'fui-ToastFooter'
 };
@@ -16,7 +16,6 @@ export const toastFooterClassNames = {
 /**
  * Apply styling to the ToastFooter slots based on the state
  */ export const useToastFooterStyles_unstable = (state)=>{
-    'use no memo';
     const rootBaseClassName = useRootBaseClassName();
     // eslint-disable-next-line react-hooks/immutability
     state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastFooter/useToastFooterStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ToastFooterSlots, ToastFooterState } from './ToastFooter.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const toastFooterClassNames: SlotClassNames<ToastFooterSlots> = {\n  root: 'fui-ToastFooter',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootBaseClassName = makeResetStyles({\n  paddingTop: '16px',\n  gridColumnStart: 2,\n  gridColumnEnd: 3,\n  display: 'flex',\n  alignItems: 'center',\n  gap: '14px',\n});\n\n/**\n * Apply styling to the ToastFooter slots based on the state\n */\nexport const useToastFooterStyles_unstable = (state: ToastFooterState): ToastFooterState => {\n  'use no memo';\n\n  const rootBaseClassName = useRootBaseClassName();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","toastFooterClassNames","root","useRootBaseClassName","paddingTop","gridColumnStart","gridColumnEnd","display","alignItems","gap","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAI/D,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,uBAAuBJ,gBAAgB;IAC3CK,YAAY;IACZC,iBAAiB;IACjBC,eAAe;IACfC,SAAS;IACTC,YAAY;IACZC,KAAK;AACP;AAEA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,oBAAoBT;IAC1B,oDAAoD;IACpDQ,MAAMT,IAAI,CAACW,SAAS,GAAGb,aAAaC,sBAAsBC,IAAI,EAAEU,mBAAmBD,MAAMT,IAAI,CAACW,SAAS;IAEvG,OAAOF;AACT,EAAE"}
+{"version":3,"sources":["../src/components/ToastFooter/useToastFooterStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ToastFooterSlots, ToastFooterState } from './ToastFooter.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const toastFooterClassNames: SlotClassNames<ToastFooterSlots> = {\n  root: 'fui-ToastFooter',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootBaseClassName = makeResetStyles({\n  paddingTop: '16px',\n  gridColumnStart: 2,\n  gridColumnEnd: 3,\n  display: 'flex',\n  alignItems: 'center',\n  gap: '14px',\n});\n\n/**\n * Apply styling to the ToastFooter slots based on the state\n */\nexport const useToastFooterStyles_unstable = (state: ToastFooterState): ToastFooterState => {\n  const rootBaseClassName = useRootBaseClassName();\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","toastFooterClassNames","root","useRootBaseClassName","paddingTop","gridColumnStart","gridColumnEnd","display","alignItems","gap","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAI/D,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,uBAAuBJ,gBAAgB;IAC3CK,YAAY;IACZC,iBAAiB;IACjBC,eAAe;IACfC,SAAS;IACTC,YAAY;IACZC,KAAK;AACP;AAEA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C,MAAMC,oBAAoBT;IAC1B,oDAAoD;IACpDQ,MAAMT,IAAI,CAACW,SAAS,GAAGb,aAAaC,sBAAsBC,IAAI,EAAEU,mBAAmBD,MAAMT,IAAI,CAACW,SAAS;IAEvG,OAAOF;AACT,EAAE"}

package/lib/components/ToastTitle/ToastTitle.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { useToastTitle_unstable } from './useToastTitle';
-import { renderToastTitle_unstable } from './renderToastTitle';
-import { useToastTitleStyles_unstable } from './useToastTitleStyles.styles';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useToastTitle_unstable } from "./useToastTitle.js";
+import { renderToastTitle_unstable } from "./renderToastTitle.js";
+import { useToastTitleStyles_unstable } from "./useToastTitleStyles.styles.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 /**
  * ToastTitle component
  */ export const ToastTitle = /*#__PURE__*/ React.forwardRef((props, ref)=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastTitle/ToastTitle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useToastTitle_unstable } from './useToastTitle';\nimport { renderToastTitle_unstable } from './renderToastTitle';\nimport { useToastTitleStyles_unstable } from './useToastTitleStyles.styles';\nimport type { ToastTitleProps } from './ToastTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToastTitle component\n */\nexport const ToastTitle: ForwardRefComponent<ToastTitleProps> = React.forwardRef((props, ref) => {\n  const state = useToastTitle_unstable(props, ref);\n\n  useToastTitleStyles_unstable(state);\n  useCustomStyleHook_unstable('useToastTitleStyles_unstable')(state);\n\n  return renderToastTitle_unstable(state);\n});\n\nToastTitle.displayName = 'ToastTitle';\n"],"names":["React","useToastTitle_unstable","renderToastTitle_unstable","useToastTitleStyles_unstable","useCustomStyleHook_unstable","ToastTitle","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAC7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/ToastTitle/ToastTitle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useToastTitle_unstable } from './useToastTitle';\nimport { renderToastTitle_unstable } from './renderToastTitle';\nimport { useToastTitleStyles_unstable } from './useToastTitleStyles.styles';\nimport type { ToastTitleProps } from './ToastTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToastTitle component\n */\nexport const ToastTitle: ForwardRefComponent<ToastTitleProps> = React.forwardRef((props, ref) => {\n  const state = useToastTitle_unstable(props, ref);\n\n  useToastTitleStyles_unstable(state);\n  useCustomStyleHook_unstable('useToastTitleStyles_unstable')(state);\n\n  return renderToastTitle_unstable(state);\n});\n\nToastTitle.displayName = 'ToastTitle';\n"],"names":["React","useToastTitle_unstable","renderToastTitle_unstable","useToastTitleStyles_unstable","useCustomStyleHook_unstable","ToastTitle","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,qBAAkB;AACzD,SAASC,yBAAyB,QAAQ,wBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,kCAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAC7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib/components/ToastTitle/index.js

@@ -1,4 +1,4 @@
-export { ToastTitle } from './ToastTitle';
-export { renderToastTitle_unstable } from './renderToastTitle';
-export { useToastTitleBase_unstable, useToastTitle_unstable } from './useToastTitle';
-export { toastTitleClassNames, useToastTitleStyles_unstable } from './useToastTitleStyles.styles';
+export { ToastTitle } from "./ToastTitle.js";
+export { renderToastTitle_unstable } from "./renderToastTitle.js";
+export { useToastTitleBase_unstable, useToastTitle_unstable } from "./useToastTitle.js";
+export { toastTitleClassNames, useToastTitleStyles_unstable } from "./useToastTitleStyles.styles.js";

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastTitle/index.ts"],"sourcesContent":["export { ToastTitle } from './ToastTitle';\nexport type {\n  ToastTitleBaseProps,\n  ToastTitleBaseState,\n  ToastTitleProps,\n  ToastTitleSlots,\n  ToastTitleState,\n} from './ToastTitle.types';\nexport { renderToastTitle_unstable } from './renderToastTitle';\nexport { useToastTitleBase_unstable, useToastTitle_unstable } from './useToastTitle';\nexport { toastTitleClassNames, useToastTitleStyles_unstable } from './useToastTitleStyles.styles';\n"],"names":["ToastTitle","renderToastTitle_unstable","useToastTitleBase_unstable","useToastTitle_unstable","toastTitleClassNames","useToastTitleStyles_unstable"],"mappings":"AAAA,SAASA,UAAU,QAAQ,eAAe;AAQ1C,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,0BAA0B,EAAEC,sBAAsB,QAAQ,kBAAkB;AACrF,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,+BAA+B"}
+{"version":3,"sources":["../src/components/ToastTitle/index.ts"],"sourcesContent":["export { ToastTitle } from './ToastTitle';\nexport type {\n  ToastTitleBaseProps,\n  ToastTitleBaseState,\n  ToastTitleProps,\n  ToastTitleSlots,\n  ToastTitleState,\n} from './ToastTitle.types';\nexport { renderToastTitle_unstable } from './renderToastTitle';\nexport { useToastTitleBase_unstable, useToastTitle_unstable } from './useToastTitle';\nexport { toastTitleClassNames, useToastTitleStyles_unstable } from './useToastTitleStyles.styles';\n"],"names":["ToastTitle","renderToastTitle_unstable","useToastTitleBase_unstable","useToastTitle_unstable","toastTitleClassNames","useToastTitleStyles_unstable"],"mappings":"AAAA,SAASA,UAAU,QAAQ,kBAAe;AAQ1C,SAASC,yBAAyB,QAAQ,wBAAqB;AAC/D,SAASC,0BAA0B,EAAEC,sBAAsB,QAAQ,qBAAkB;AACrF,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,kCAA+B"}

package/lib/components/ToastTitle/renderToastTitle.js

@@ -1,5 +1,5 @@
   import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
+import { assertSlots } from "@fluentui/react-utilities";
 /**
  * Render the final JSX of ToastTitle
  */ export const renderToastTitle_unstable = (state)=>{

package/lib/components/ToastTitle/useToastTitle.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { CheckmarkCircleFilled, DiamondDismissFilled, InfoFilled, WarningFilled } from '@fluentui/react-icons';
-import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
-import { useBackgroundAppearance } from '@fluentui/react-shared-contexts';
-import { useToastContainerContext } from '../../contexts/toastContainerContext';
+import * as React from "react";
+import { CheckmarkCircleFilled, DiamondDismissFilled, InfoFilled, WarningFilled } from "@fluentui/react-icons";
+import { getIntrinsicElementProps, slot } from "@fluentui/react-utilities";
+import { useBackgroundAppearance } from "@fluentui/react-shared-contexts";
+import { useToastContainerContext } from "../../contexts/toastContainerContext.js";
 /**
  * Create the base state required to render ToastTitle, without design-only props.
  *

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ToastTitle/useToastTitle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { CheckmarkCircleFilled, DiamondDismissFilled, InfoFilled, WarningFilled } from '@fluentui/react-icons';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useBackgroundAppearance } from '@fluentui/react-shared-contexts';\n\nimport type { ToastTitleBaseProps, ToastTitleBaseState, ToastTitleProps, ToastTitleState } from './ToastTitle.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\n\n/**\n * Create the base state required to render ToastTitle, without design-only props.\n *\n * @param props - props from this instance of ToastTitle\n * @param ref - reference to root HTMLElement of ToastTitle\n */\nexport const useToastTitleBase_unstable = (\n  props: ToastTitleBaseProps,\n  ref: React.Ref<HTMLElement>,\n): ToastTitleBaseState => {\n  const { intent, titleId } = useToastContainerContext();\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      elementType: 'div',\n    }),\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: ref as React.Ref<HTMLDivElement>,\n        children: props.children,\n        id: titleId,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    intent,\n  };\n};\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  'use no memo';\n\n  const backgroundAppearance = useBackgroundAppearance();\n  const baseState = useToastTitleBase_unstable(props, ref);\n\n  /** Determine the role and media to render based on the intent */\n  let defaultIcon;\n  switch (baseState.intent) {\n    case 'success':\n      defaultIcon = <CheckmarkCircleFilled />;\n      break;\n    case 'error':\n      defaultIcon = <DiamondDismissFilled />;\n      break;\n    case 'warning':\n      defaultIcon = <WarningFilled />;\n      break;\n    case 'info':\n      defaultIcon = <InfoFilled />;\n      break;\n  }\n\n  return {\n    ...baseState,\n    media: slot.optional(props.media, {\n      defaultProps: { children: defaultIcon },\n      renderByDefault: !!baseState.intent,\n      elementType: 'div',\n    }),\n    backgroundAppearance,\n  };\n};\n"],"names":["React","CheckmarkCircleFilled","DiamondDismissFilled","InfoFilled","WarningFilled","getIntrinsicElementProps","slot","useBackgroundAppearance","useToastContainerContext","useToastTitleBase_unstable","props","ref","intent","titleId","action","optional","elementType","components","root","media","renderByDefault","always","children","id","useToastTitle_unstable","backgroundAppearance","baseState","defaultIcon","defaultProps"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,qBAAqB,EAAEC,oBAAoB,EAAEC,UAAU,EAAEC,aAAa,QAAQ,wBAAwB;AAC/G,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,uBAAuB,QAAQ,kCAAkC;AAG1E,SAASC,wBAAwB,QAAQ,uCAAuC;AAEhF;;;;;CAKC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGL;IAE5B,OAAO;QACLM,QAAQR,KAAKS,QAAQ,CAACL,MAAMI,MAAM,EAAE;YAAEE,aAAa;QAAM;QACzDC,YAAY;YAAEC,MAAM;YAAOC,OAAO;YAAOL,QAAQ;QAAM;QACvDK,OAAOb,KAAKS,QAAQ,CAACL,MAAMS,KAAK,EAAE;YAChCC,iBAAiB,CAAC,CAACR;YACnBI,aAAa;QACf;QACAE,MAAMZ,KAAKe,MAAM,CACfhB,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FM,KAAKA;YACLW,UAAUZ,MAAMY,QAAQ;YACxBC,IAAIV;YACJ,GAAGH,KAAK;QACV,IACA;YAAEM,aAAa;QAAM;QAEvBJ;IACF;AACF,EAAE;AAEF;;;;;;;;CAQC,GACD,OAAO,MAAMY,yBAAyB,CAACd,OAAwBC;IAC7D;IAEA,MAAMc,uBAAuBlB;IAC7B,MAAMmB,YAAYjB,2BAA2BC,OAAOC;IAEpD,+DAA+D,GAC/D,IAAIgB;IACJ,OAAQD,UAAUd,MAAM;QACtB,KAAK;YACHe,4BAAc,oBAAC1B;YACf;QACF,KAAK;YACH0B,4BAAc,oBAACzB;YACf;QACF,KAAK;YACHyB,4BAAc,oBAACvB;YACf;QACF,KAAK;YACHuB,4BAAc,oBAACxB;YACf;IACJ;IAEA,OAAO;QACL,GAAGuB,SAAS;QACZP,OAAOb,KAAKS,QAAQ,CAACL,MAAMS,KAAK,EAAE;YAChCS,cAAc;gBAAEN,UAAUK;YAAY;YACtCP,iBAAiB,CAAC,CAACM,UAAUd,MAAM;YACnCI,aAAa;QACf;QACAS;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/ToastTitle/useToastTitle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { CheckmarkCircleFilled, DiamondDismissFilled, InfoFilled, WarningFilled } from '@fluentui/react-icons';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useBackgroundAppearance } from '@fluentui/react-shared-contexts';\n\nimport type { ToastTitleBaseProps, ToastTitleBaseState, ToastTitleProps, ToastTitleState } from './ToastTitle.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\n\n/**\n * Create the base state required to render ToastTitle, without design-only props.\n *\n * @param props - props from this instance of ToastTitle\n * @param ref - reference to root HTMLElement of ToastTitle\n */\nexport const useToastTitleBase_unstable = (\n  props: ToastTitleBaseProps,\n  ref: React.Ref<HTMLElement>,\n): ToastTitleBaseState => {\n  const { intent, titleId } = useToastContainerContext();\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      elementType: 'div',\n    }),\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: ref as React.Ref<HTMLDivElement>,\n        children: props.children,\n        id: titleId,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    intent,\n  };\n};\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  'use no memo';\n\n  const backgroundAppearance = useBackgroundAppearance();\n  const baseState = useToastTitleBase_unstable(props, ref);\n\n  /** Determine the role and media to render based on the intent */\n  let defaultIcon;\n  switch (baseState.intent) {\n    case 'success':\n      defaultIcon = <CheckmarkCircleFilled />;\n      break;\n    case 'error':\n      defaultIcon = <DiamondDismissFilled />;\n      break;\n    case 'warning':\n      defaultIcon = <WarningFilled />;\n      break;\n    case 'info':\n      defaultIcon = <InfoFilled />;\n      break;\n  }\n\n  return {\n    ...baseState,\n    media: slot.optional(props.media, {\n      defaultProps: { children: defaultIcon },\n      renderByDefault: !!baseState.intent,\n      elementType: 'div',\n    }),\n    backgroundAppearance,\n  };\n};\n"],"names":["React","CheckmarkCircleFilled","DiamondDismissFilled","InfoFilled","WarningFilled","getIntrinsicElementProps","slot","useBackgroundAppearance","useToastContainerContext","useToastTitleBase_unstable","props","ref","intent","titleId","action","optional","elementType","components","root","media","renderByDefault","always","children","id","useToastTitle_unstable","backgroundAppearance","baseState","defaultIcon","defaultProps"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,qBAAqB,EAAEC,oBAAoB,EAAEC,UAAU,EAAEC,aAAa,QAAQ,wBAAwB;AAC/G,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,uBAAuB,QAAQ,kCAAkC;AAG1E,SAASC,wBAAwB,QAAQ,0CAAuC;AAEhF;;;;;CAKC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGL;IAE5B,OAAO;QACLM,QAAQR,KAAKS,QAAQ,CAACL,MAAMI,MAAM,EAAE;YAAEE,aAAa;QAAM;QACzDC,YAAY;YAAEC,MAAM;YAAOC,OAAO;YAAOL,QAAQ;QAAM;QACvDK,OAAOb,KAAKS,QAAQ,CAACL,MAAMS,KAAK,EAAE;YAChCC,iBAAiB,CAAC,CAACR;YACnBI,aAAa;QACf;QACAE,MAAMZ,KAAKe,MAAM,CACfhB,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FM,KAAKA;YACLW,UAAUZ,MAAMY,QAAQ;YACxBC,IAAIV;YACJ,GAAGH,KAAK;QACV,IACA;YAAEM,aAAa;QAAM;QAEvBJ;IACF;AACF,EAAE;AAEF;;;;;;;;CAQC,GACD,OAAO,MAAMY,yBAAyB,CAACd,OAAwBC;IAC7D;IAEA,MAAMc,uBAAuBlB;IAC7B,MAAMmB,YAAYjB,2BAA2BC,OAAOC;IAEpD,+DAA+D,GAC/D,IAAIgB;IACJ,OAAQD,UAAUd,MAAM;QACtB,KAAK;YACHe,4BAAc,oBAAC1B;YACf;QACF,KAAK;YACH0B,4BAAc,oBAACzB;YACf;QACF,KAAK;YACHyB,4BAAc,oBAACvB;YACf;QACF,KAAK;YACHuB,4BAAc,oBAACxB;YACf;IACJ;IAEA,OAAO;QACL,GAAGuB,SAAS;QACZP,OAAOb,KAAKS,QAAQ,CAACL,MAAMS,KAAK,EAAE;YAChCS,cAAc;gBAAEN,UAAUK;YAAY;YACtCP,iBAAiB,CAAC,CAACM,UAAUd,MAAM;YACnCI,aAAa;QACf;QACAS;IACF;AACF,EAAE"}

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

@@ -1,7 +1,7 @@
 'use client';
 
-import { __styles, __resetStyles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
+import { __styles, __resetStyles, mergeClasses } from "@griffel/react";
+import { tokens } from "@fluentui/react-theme";
 export const toastTitleClassNames = {
   root: 'fui-ToastTitle',
   media: 'fui-ToastTitle__media',
@@ -59,8 +59,6 @@ const useIntentIconStylesInverted = /*#__PURE__*/__styles({
  * Apply styling to the ToastTitle slots based on the state
  */
 export const useToastTitleStyles_unstable = state => {
-  'use no memo';
-
   const rootBaseClassName = useRootBaseClassName();
   const actionBaseClassName = useActionBaseClassName();
   const mediaBaseClassName = useMediaBaseClassName();

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":["'use client';\nimport { 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    gridColumnEnd: 3,\n    color: tokens.colorNeutralForeground1,\n    wordBreak: 'break-word'\n});\nconst useMediaBaseClassName = makeResetStyles({\n    display: 'flex',\n    paddingTop: '2px',\n    gridColumnEnd: 2,\n    paddingRight: '8px',\n    fontSize: '16px',\n    color: tokens.colorNeutralForeground1\n});\nconst useActionBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'start',\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        color: tokens.colorStatusSuccessForeground1\n    },\n    error: {\n        color: tokens.colorStatusDangerForeground1\n    },\n    warning: {\n        color: tokens.colorStatusWarningForeground1\n    },\n    info: {\n        color: tokens.colorNeutralForeground2\n    }\n});\nconst useIntentIconStylesInverted = makeStyles({\n    success: {\n        color: tokens.colorStatusSuccessForegroundInverted\n    },\n    error: {\n        color: tokens.colorStatusDangerForegroundInverted\n    },\n    warning: {\n        color: tokens.colorStatusWarningForegroundInverted\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    'use no memo';\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    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n    if (state.media) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.media.className = mergeClasses(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent], state.media.className);\n    }\n    if (state.action) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.action.className = mergeClasses(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,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,0HAK5B,CAAC;AACF,MAAMQ,qBAAqB,gBAAGR,aAAA,8RAO7B,CAAC;AACF,MAAMS,sBAAsB,gBAAGT,aAAA,kQAM9B,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,CAa3B,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,CAanC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,4BAA4B,GAAIC,KAAK,IAAG;EACrD,aAAa;;EACb,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;EAAO,CAAC,GAAGN,KAAK;EACxB,MAAMO,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;EAC1C;EACAU,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;IACb;IACAe,KAAK,CAACf,KAAK,CAACuB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACE,KAAK,EAAEkB,kBAAkB,EAAEH,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACtB,KAAK,EAAEqB,MAAM,IAAIF,gBAAgB,CAACE,MAAM,CAAC,EAAEA,MAAM,IAAIN,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIJ,wBAAwB,CAACC,MAAM,CAAC,EAAEN,KAAK,CAACf,KAAK,CAACuB,SAAS,CAAC;EAC/S;EACA,IAAIR,KAAK,CAACd,MAAM,EAAE;IACd;IACAc,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","ignoreList":[]}
+{"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":["'use client';\nimport { 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    gridColumnEnd: 3,\n    color: tokens.colorNeutralForeground1,\n    wordBreak: 'break-word'\n});\nconst useMediaBaseClassName = makeResetStyles({\n    display: 'flex',\n    paddingTop: '2px',\n    gridColumnEnd: 2,\n    paddingRight: '8px',\n    fontSize: '16px',\n    color: tokens.colorNeutralForeground1\n});\nconst useActionBaseClassName = makeResetStyles({\n    display: 'flex',\n    alignItems: 'start',\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        color: tokens.colorStatusSuccessForeground1\n    },\n    error: {\n        color: tokens.colorStatusDangerForeground1\n    },\n    warning: {\n        color: tokens.colorStatusWarningForeground1\n    },\n    info: {\n        color: tokens.colorNeutralForeground2\n    }\n});\nconst useIntentIconStylesInverted = makeStyles({\n    success: {\n        color: tokens.colorStatusSuccessForegroundInverted\n    },\n    error: {\n        color: tokens.colorStatusDangerForegroundInverted\n    },\n    warning: {\n        color: tokens.colorStatusWarningForegroundInverted\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    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n    if (state.media) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.media.className = mergeClasses(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent], state.media.className);\n    }\n    if (state.action) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.action.className = mergeClasses(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,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,0HAK5B,CAAC;AACF,MAAMQ,qBAAqB,gBAAGR,aAAA,8RAO7B,CAAC;AACF,MAAMS,sBAAsB,gBAAGT,aAAA,kQAM9B,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,CAa3B,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,CAanC,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;EAAO,CAAC,GAAGN,KAAK;EACxB,MAAMO,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;EAC1C;EACAU,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;IACb;IACAe,KAAK,CAACf,KAAK,CAACuB,SAAS,GAAG3B,YAAY,CAACE,oBAAoB,CAACE,KAAK,EAAEkB,kBAAkB,EAAEH,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACtB,KAAK,EAAEqB,MAAM,IAAIF,gBAAgB,CAACE,MAAM,CAAC,EAAEA,MAAM,IAAIN,KAAK,CAACS,oBAAoB,KAAK,UAAU,IAAIJ,wBAAwB,CAACC,MAAM,CAAC,EAAEN,KAAK,CAACf,KAAK,CAACuB,SAAS,CAAC;EAC/S;EACA,IAAIR,KAAK,CAACd,MAAM,EAAE;IACd;IACAc,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","ignoreList":[]}

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

@@ -1,6 +1,6 @@
 'use client';
-import { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
+import { makeStyles, makeResetStyles, mergeClasses } from "@griffel/react";
+import { tokens } from "@fluentui/react-theme";
 export const toastTitleClassNames = {
     root: 'fui-ToastTitle',
     media: 'fui-ToastTitle__media',
@@ -69,7 +69,6 @@ const useIntentIconStylesInverted = makeStyles({
 /**
  * Apply styling to the ToastTitle slots based on the state
  */ export const useToastTitleStyles_unstable = (state)=>{
-    'use no memo';
     const rootBaseClassName = useRootBaseClassName();
     const actionBaseClassName = useActionBaseClassName();
     const mediaBaseClassName = useMediaBaseClassName();