@fluentui/react-toast 9.7.17 → 9.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. package/CHANGELOG.md +33 -9
  2. package/dist/index.d.ts +155 -50
  3. package/lib/Toast.js +1 -1
  4. package/lib/Toast.js.map +1 -1
  5. package/lib/ToastBody.js +1 -1
  6. package/lib/ToastBody.js.map +1 -1
  7. package/lib/ToastTitle.js +1 -1
  8. package/lib/ToastTitle.js.map +1 -1
  9. package/lib/Toaster.js +1 -1
  10. package/lib/Toaster.js.map +1 -1
  11. package/lib/components/AriaLive/useAriaLiveStyles.styles.js +2 -0
  12. package/lib/components/AriaLive/useAriaLiveStyles.styles.js.map +1 -1
  13. package/lib/components/AriaLive/useAriaLiveStyles.styles.raw.js +2 -0
  14. package/lib/components/AriaLive/useAriaLiveStyles.styles.raw.js.map +1 -1
  15. package/lib/components/Toast/Toast.types.js +1 -1
  16. package/lib/components/Toast/Toast.types.js.map +1 -1
  17. package/lib/components/Toast/index.js +1 -1
  18. package/lib/components/Toast/index.js.map +1 -1
  19. package/lib/components/Toast/useToast.js +18 -7
  20. package/lib/components/Toast/useToast.js.map +1 -1
  21. package/lib/components/Toast/useToastStyles.styles.js +1 -0
  22. package/lib/components/Toast/useToastStyles.styles.js.map +1 -1
  23. package/lib/components/Toast/useToastStyles.styles.raw.js +1 -0
  24. package/lib/components/Toast/useToastStyles.styles.raw.js.map +1 -1
  25. package/lib/components/ToastBody/ToastBody.types.js +1 -1
  26. package/lib/components/ToastBody/ToastBody.types.js.map +1 -1
  27. package/lib/components/ToastBody/index.js +1 -1
  28. package/lib/components/ToastBody/index.js.map +1 -1
  29. package/lib/components/ToastBody/useToastBody.js +17 -7
  30. package/lib/components/ToastBody/useToastBody.js.map +1 -1
  31. package/lib/components/ToastBody/useToastBodyStyles.styles.js +2 -0
  32. package/lib/components/ToastBody/useToastBodyStyles.styles.js.map +1 -1
  33. package/lib/components/ToastBody/useToastBodyStyles.styles.raw.js +2 -0
  34. package/lib/components/ToastBody/useToastBodyStyles.styles.raw.js.map +1 -1
  35. package/lib/components/ToastContainer/useToastContainerStyles.styles.js +1 -0
  36. package/lib/components/ToastContainer/useToastContainerStyles.styles.js.map +1 -1
  37. package/lib/components/ToastContainer/useToastContainerStyles.styles.raw.js +1 -0
  38. package/lib/components/ToastContainer/useToastContainerStyles.styles.raw.js.map +1 -1
  39. package/lib/components/ToastFooter/useToastFooterStyles.styles.js +1 -0
  40. package/lib/components/ToastFooter/useToastFooterStyles.styles.js.map +1 -1
  41. package/lib/components/ToastFooter/useToastFooterStyles.styles.raw.js +1 -0
  42. package/lib/components/ToastFooter/useToastFooterStyles.styles.raw.js.map +1 -1
  43. package/lib/components/ToastTitle/ToastTitle.types.js +1 -1
  44. package/lib/components/ToastTitle/ToastTitle.types.js.map +1 -1
  45. package/lib/components/ToastTitle/index.js +1 -1
  46. package/lib/components/ToastTitle/index.js.map +1 -1
  47. package/lib/components/ToastTitle/useToastTitle.js +39 -23
  48. package/lib/components/ToastTitle/useToastTitle.js.map +1 -1
  49. package/lib/components/ToastTitle/useToastTitleStyles.styles.js +3 -0
  50. package/lib/components/ToastTitle/useToastTitleStyles.styles.js.map +1 -1
  51. package/lib/components/ToastTitle/useToastTitleStyles.styles.raw.js +3 -0
  52. package/lib/components/ToastTitle/useToastTitleStyles.styles.raw.js.map +1 -1
  53. package/lib/components/Toaster/index.js +1 -0
  54. package/lib/components/Toaster/index.js.map +1 -1
  55. package/lib/components/Toaster/useToastAnnounce.js +1 -1
  56. package/lib/components/Toaster/useToastAnnounce.js.map +1 -1
  57. package/lib/components/Toaster/useToasterStyles.styles.js +6 -0
  58. package/lib/components/Toaster/useToasterStyles.styles.js.map +1 -1
  59. package/lib/components/Toaster/useToasterStyles.styles.raw.js +6 -0
  60. package/lib/components/Toaster/useToasterStyles.styles.raw.js.map +1 -1
  61. package/lib/index.js +7 -5
  62. package/lib/index.js.map +1 -1
  63. package/lib/state/types.js.map +1 -1
  64. package/lib-commonjs/Toast.js +3 -0
  65. package/lib-commonjs/Toast.js.map +1 -1
  66. package/lib-commonjs/ToastBody.js +3 -0
  67. package/lib-commonjs/ToastBody.js.map +1 -1
  68. package/lib-commonjs/ToastTitle.js +3 -0
  69. package/lib-commonjs/ToastTitle.js.map +1 -1
  70. package/lib-commonjs/Toaster.js +3 -0
  71. package/lib-commonjs/Toaster.js.map +1 -1
  72. package/lib-commonjs/components/AriaLive/useAriaLiveStyles.styles.js +2 -0
  73. package/lib-commonjs/components/AriaLive/useAriaLiveStyles.styles.js.map +1 -1
  74. package/lib-commonjs/components/AriaLive/useAriaLiveStyles.styles.raw.js +2 -0
  75. package/lib-commonjs/components/AriaLive/useAriaLiveStyles.styles.raw.js.map +1 -1
  76. package/lib-commonjs/components/Toast/Toast.types.js +1 -1
  77. package/lib-commonjs/components/Toast/Toast.types.js.map +1 -1
  78. package/lib-commonjs/components/Toast/index.js +3 -0
  79. package/lib-commonjs/components/Toast/index.js.map +1 -1
  80. package/lib-commonjs/components/Toast/useToast.js +19 -5
  81. package/lib-commonjs/components/Toast/useToast.js.map +1 -1
  82. package/lib-commonjs/components/Toast/useToastStyles.styles.js +1 -0
  83. package/lib-commonjs/components/Toast/useToastStyles.styles.js.map +1 -1
  84. package/lib-commonjs/components/Toast/useToastStyles.styles.raw.js +1 -0
  85. package/lib-commonjs/components/Toast/useToastStyles.styles.raw.js.map +1 -1
  86. package/lib-commonjs/components/ToastBody/ToastBody.types.js +1 -1
  87. package/lib-commonjs/components/ToastBody/ToastBody.types.js.map +1 -1
  88. package/lib-commonjs/components/ToastBody/index.js +3 -0
  89. package/lib-commonjs/components/ToastBody/index.js.map +1 -1
  90. package/lib-commonjs/components/ToastBody/useToastBody.js +19 -6
  91. package/lib-commonjs/components/ToastBody/useToastBody.js.map +1 -1
  92. package/lib-commonjs/components/ToastBody/useToastBodyStyles.styles.js +2 -0
  93. package/lib-commonjs/components/ToastBody/useToastBodyStyles.styles.js.map +1 -1
  94. package/lib-commonjs/components/ToastBody/useToastBodyStyles.styles.raw.js +2 -0
  95. package/lib-commonjs/components/ToastBody/useToastBodyStyles.styles.raw.js.map +1 -1
  96. package/lib-commonjs/components/ToastContainer/useToastContainerStyles.styles.js +1 -0
  97. package/lib-commonjs/components/ToastContainer/useToastContainerStyles.styles.js.map +1 -1
  98. package/lib-commonjs/components/ToastContainer/useToastContainerStyles.styles.raw.js +1 -0
  99. package/lib-commonjs/components/ToastContainer/useToastContainerStyles.styles.raw.js.map +1 -1
  100. package/lib-commonjs/components/ToastFooter/useToastFooterStyles.styles.js +1 -0
  101. package/lib-commonjs/components/ToastFooter/useToastFooterStyles.styles.js.map +1 -1
  102. package/lib-commonjs/components/ToastFooter/useToastFooterStyles.styles.raw.js +1 -0
  103. package/lib-commonjs/components/ToastFooter/useToastFooterStyles.styles.raw.js.map +1 -1
  104. package/lib-commonjs/components/ToastTitle/ToastTitle.types.js +1 -1
  105. package/lib-commonjs/components/ToastTitle/ToastTitle.types.js.map +1 -1
  106. package/lib-commonjs/components/ToastTitle/index.js +3 -0
  107. package/lib-commonjs/components/ToastTitle/index.js.map +1 -1
  108. package/lib-commonjs/components/ToastTitle/useToastTitle.js +43 -24
  109. package/lib-commonjs/components/ToastTitle/useToastTitle.js.map +1 -1
  110. package/lib-commonjs/components/ToastTitle/useToastTitleStyles.styles.js +3 -0
  111. package/lib-commonjs/components/ToastTitle/useToastTitleStyles.styles.js.map +1 -1
  112. package/lib-commonjs/components/ToastTitle/useToastTitleStyles.styles.raw.js +3 -0
  113. package/lib-commonjs/components/ToastTitle/useToastTitleStyles.styles.raw.js.map +1 -1
  114. package/lib-commonjs/components/Toaster/index.js +4 -0
  115. package/lib-commonjs/components/Toaster/index.js.map +1 -1
  116. package/lib-commonjs/components/Toaster/useToastAnnounce.js.map +1 -1
  117. package/lib-commonjs/components/Toaster/useToasterStyles.styles.js +6 -0
  118. package/lib-commonjs/components/Toaster/useToasterStyles.styles.js.map +1 -1
  119. package/lib-commonjs/components/Toaster/useToasterStyles.styles.raw.js +6 -0
  120. package/lib-commonjs/components/Toaster/useToasterStyles.styles.raw.js.map +1 -1
  121. package/lib-commonjs/index.js +31 -0
  122. package/lib-commonjs/index.js.map +1 -1
  123. package/lib-commonjs/state/types.js.map +1 -1
  124. package/package.json +8 -8
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ToastBody/useToastBody.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ToastBodyProps, ToastBodyState } from './ToastBody.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\nimport { useBackgroundAppearance } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render ToastBody.\n *\n * The returned state can be modified with hooks such as useToastBodyStyles_unstable,\n * before being passed to renderToastBody_unstable.\n *\n * @param props - props from this instance of ToastBody\n * @param ref - reference to root HTMLElement of ToastBody\n */\nexport const useToastBody_unstable = (props: ToastBodyProps, ref: React.Ref<HTMLElement>): ToastBodyState => {\n const backgroundAppearance = useBackgroundAppearance();\n const { bodyId } = useToastContainerContext();\n return {\n components: {\n root: 'div',\n subtitle: 'div',\n },\n subtitle: slot.optional(props.subtitle, { elementType: 'div' }),\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 id: bodyId,\n ...props,\n }),\n { elementType: 'div' },\n ),\n backgroundAppearance,\n };\n};\n"],"names":["getIntrinsicElementProps","slot","useToastContainerContext","useBackgroundAppearance","useToastBody_unstable","props","ref","backgroundAppearance","bodyId","components","root","subtitle","optional","elementType","always","id"],"mappings":"AAAA;;;;;+BAiBaI;;;;;;gCAdkC,4BAA4B;uCAElC,uCAAuC;qCACxC,kCAAkC;AAWnE,8BAA8B,CAACC,OAAuBC;IAC3D,MAAMC,2BAAuBJ,4CAAAA;IAC7B,MAAM,EAAEK,MAAM,EAAE,OAAGN,+CAAAA;IACnB,OAAO;QACLO,YAAY;YACVC,MAAM;YACNC,UAAU;QACZ;QACAA,UAAUV,oBAAAA,CAAKW,QAAQ,CAACP,MAAMM,QAAQ,EAAE;YAAEE,aAAa;QAAM;QAC7DH,MAAMT,oBAAAA,CAAKa,MAAM,KACfd,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FM,KAAKA;YACLS,IAAIP;YACJ,GAAGH,KAAK;QACV,IACA;YAAEQ,aAAa;QAAM;QAEvBN;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/ToastBody/useToastBody.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ToastBodyBaseProps, ToastBodyBaseState, ToastBodyProps, ToastBodyState } from './ToastBody.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\nimport { useBackgroundAppearance } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the base state required to render ToastBody, without design-only props.\n *\n * @param props - props from this instance of ToastBody\n * @param ref - reference to root HTMLElement of ToastBody\n */\nexport const useToastBodyBase_unstable = (\n props: ToastBodyBaseProps,\n ref: React.Ref<HTMLElement>,\n): ToastBodyBaseState => {\n const { bodyId } = useToastContainerContext();\n return {\n components: {\n root: 'div',\n subtitle: 'div',\n },\n subtitle: slot.optional(props.subtitle, { elementType: 'div' }),\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 id: bodyId,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n};\n\n/**\n * Create the state required to render ToastBody.\n *\n * The returned state can be modified with hooks such as useToastBodyStyles_unstable,\n * before being passed to renderToastBody_unstable.\n *\n * @param props - props from this instance of ToastBody\n * @param ref - reference to root HTMLElement of ToastBody\n */\nexport const useToastBody_unstable = (props: ToastBodyProps, ref: React.Ref<HTMLElement>): ToastBodyState => {\n const backgroundAppearance = useBackgroundAppearance();\n return {\n ...useToastBodyBase_unstable(props, ref),\n backgroundAppearance,\n };\n};\n"],"names":["getIntrinsicElementProps","slot","useToastContainerContext","useBackgroundAppearance","useToastBodyBase_unstable","props","ref","bodyId","components","root","subtitle","optional","elementType","always","id","useToastBody_unstable","backgroundAppearance"],"mappings":"AAAA;;;;;;;;;;;;IAcaI,yBAAAA;;;yBAkCAW;;;;gCA7CkC,4BAA4B;uCAElC,uCAAuC;qCACxC,kCAAkC;AAQnE,kCAAkC,CACvCV,OACAC;IAEA,MAAM,EAAEC,MAAM,EAAE,OAAGL,+CAAAA;IACnB,OAAO;QACLM,YAAY;YACVC,MAAM;YACNC,UAAU;QACZ;QACAA,UAAUT,oBAAAA,CAAKU,QAAQ,CAACN,MAAMK,QAAQ,EAAE;YAAEE,aAAa;QAAM;QAC7DH,MAAMR,oBAAAA,CAAKY,MAAM,KACfb,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FM,KAAKA;YACLQ,IAAIP;YACJ,GAAGF,KAAK;QACV,IACA;YAAEO,aAAa;QAAM;IAEzB;AACF,EAAE;AAWK,MAAMG,wBAAwB,CAACV,OAAuBC;IAC3D,MAAMU,2BAAuBb,4CAAAA;IAC7B,OAAO;QACL,GAAGC,0BAA0BC,OAAOC,IAAI;QACxCU;IACF;AACF,EAAE"}
@@ -45,8 +45,10 @@ const useToastBodyStyles_unstable = (state)=>{
45
45
  const rootBaseClassName = useRootBaseClassName();
46
46
  const subtitleBaseClassName = useSubtitleBaseClassName();
47
47
  const invertedStyles = useInvertedStyles();
48
+ // eslint-disable-next-line react-hooks/immutability
48
49
  state.root.className = (0, _react.mergeClasses)(toastBodyClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);
49
50
  if (state.subtitle) {
51
+ // eslint-disable-next-line react-hooks/immutability
50
52
  state.subtitle.className = (0, _react.mergeClasses)(toastBodyClassNames.subtitle, subtitleBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.subtitle, state.subtitle.className);
51
53
  }
52
54
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["useToastBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const toastBodyClassNames = {\n root: 'fui-ToastBody',\n subtitle: 'fui-ToastBody__subtitle'\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});\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});\nconst useInvertedStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForegroundInverted2\n },\n subtitle: {\n color: tokens.colorNeutralForegroundInverted2\n }\n});\n/**\n * Apply styling to the ToastBody slots based on the state\n */ export const useToastBodyStyles_unstable = (state)=>{\n 'use no memo';\n const rootBaseClassName = useRootBaseClassName();\n const subtitleBaseClassName = useSubtitleBaseClassName();\n const invertedStyles = useInvertedStyles();\n state.root.className = mergeClasses(toastBodyClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n if (state.subtitle) {\n state.subtitle.className = mergeClasses(toastBodyClassNames.subtitle, subtitleBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.subtitle, state.subtitle.className);\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","toastBodyClassNames","root","subtitle","useRootBaseClassName","useSubtitleBaseClassName","useInvertedStyles","sj55zd","d","useToastBodyStyles_unstable","state","rootBaseClassName","subtitleBaseClassName","invertedStyles","className","backgroundAppearance"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCI,mBAAmB;;;+BAiCY;eAA3BQ;;;uBAnCyC,gBAAgB;AAEnE,4BAA4B;IAC/BP,IAAI,EAAE,eAAe;IACrBC,QAAQ,EAAE;AACd,CAAC;AACD,MAAMC,oBAAoB,GAAA,WAAA,GAAGP,wBAAA,EAAA,YAAA,MAAA;IAAA;CAS5B,CAAC;AACF,MAAMQ,wBAAwB,GAAA,WAAA,OAAGR,oBAAA,EAAA,WAAA,MAAA;IAAA;CAQhC,CAAC;AACF,MAAMS,iBAAiB,GAAA,WAAA,OAAGR,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAK,MAAA,EAAA;IAAA;IAAAJ,QAAA,EAAA;QAAAI,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAOzB,CAAC;AAGS,qCAAqCE,KAAK,IAAG;IACpD,aAAa;IACb,MAAMC,iBAAiB,GAAGP,oBAAoB,CAAC,CAAC;IAChD,MAAMQ,qBAAqB,GAAGP,wBAAwB,CAAC,CAAC;IACxD,MAAMQ,cAAc,GAAGP,iBAAiB,CAAC,CAAC;IAC1CI,KAAK,CAACR,IAAI,CAACY,SAAS,OAAGf,mBAAY,EAACE,mBAAmB,CAACC,IAAI,EAAES,iBAAiB,EAAED,KAAK,CAACK,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACX,IAAI,EAAEQ,KAAK,CAACR,IAAI,CAACY,SAAS,CAAC;IACxK,IAAIJ,KAAK,CAACP,QAAQ,EAAE;QAChBO,KAAK,CAACP,QAAQ,CAACW,SAAS,OAAGf,mBAAY,EAACE,mBAAmB,CAACE,QAAQ,EAAES,qBAAqB,EAAEF,KAAK,CAACK,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACV,QAAQ,EAAEO,KAAK,CAACP,QAAQ,CAACW,SAAS,CAAC;IAChM;IACA,OAAOJ,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useToastBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const toastBodyClassNames = {\n root: 'fui-ToastBody',\n subtitle: 'fui-ToastBody__subtitle'\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});\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});\nconst useInvertedStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForegroundInverted2\n },\n subtitle: {\n color: tokens.colorNeutralForegroundInverted2\n }\n});\n/**\n * Apply styling to the ToastBody slots based on the state\n */ export const useToastBodyStyles_unstable = (state)=>{\n 'use no memo';\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(toastBodyClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n if (state.subtitle) {\n // eslint-disable-next-line react-hooks/immutability\n state.subtitle.className = mergeClasses(toastBodyClassNames.subtitle, subtitleBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.subtitle, state.subtitle.className);\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","toastBodyClassNames","root","subtitle","useRootBaseClassName","useSubtitleBaseClassName","useInvertedStyles","sj55zd","d","useToastBodyStyles_unstable","state","rootBaseClassName","subtitleBaseClassName","invertedStyles","className","backgroundAppearance"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCI,mBAAmB;;;+BAiCY;eAA3BQ;;;uBAnCyC,gBAAgB;AAEnE,4BAA4B;IAC/BP,IAAI,EAAE,eAAe;IACrBC,QAAQ,EAAE;AACd,CAAC;AACD,MAAMC,oBAAoB,GAAA,WAAA,GAAGP,wBAAA,EAAA,YAAA,MAAA;IAAA;CAS5B,CAAC;AACF,MAAMQ,wBAAwB,GAAA,WAAA,OAAGR,oBAAA,EAAA,WAAA,MAAA;IAAA;CAQhC,CAAC;AACF,MAAMS,iBAAiB,GAAA,WAAA,OAAGR,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAK,MAAA,EAAA;IAAA;IAAAJ,QAAA,EAAA;QAAAI,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAOzB,CAAC;AAGS,qCAAqCE,KAAK,IAAG;IACpD,aAAa;IACb,MAAMC,iBAAiB,GAAGP,oBAAoB,CAAC,CAAC;IAChD,MAAMQ,qBAAqB,GAAGP,wBAAwB,CAAC,CAAC;IACxD,MAAMQ,cAAc,GAAGP,iBAAiB,CAAC,CAAC;IAC1C,oDAAA;IACAI,KAAK,CAACR,IAAI,CAACY,SAAS,OAAGf,mBAAY,EAACE,mBAAmB,CAACC,IAAI,EAAES,iBAAiB,EAAED,KAAK,CAACK,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACX,IAAI,EAAEQ,KAAK,CAACR,IAAI,CAACY,SAAS,CAAC;IACxK,IAAIJ,KAAK,CAACP,QAAQ,EAAE;QAChB,oDAAA;QACAO,KAAK,CAACP,QAAQ,CAACW,SAAS,OAAGf,mBAAY,EAACE,mBAAmB,CAACE,QAAQ,EAAES,qBAAqB,EAAEF,KAAK,CAACK,oBAAoB,KAAK,UAAU,IAAIF,cAAc,CAACV,QAAQ,EAAEO,KAAK,CAACP,QAAQ,CAACW,SAAS,CAAC;IAChM;IACA,OAAOJ,KAAK;AAChB,CAAC"}
@@ -55,8 +55,10 @@ const useToastBodyStyles_unstable = (state)=>{
55
55
  const rootBaseClassName = useRootBaseClassName();
56
56
  const subtitleBaseClassName = useSubtitleBaseClassName();
57
57
  const invertedStyles = useInvertedStyles();
58
+ // eslint-disable-next-line react-hooks/immutability
58
59
  state.root.className = (0, _react.mergeClasses)(toastBodyClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);
59
60
  if (state.subtitle) {
61
+ // eslint-disable-next-line react-hooks/immutability
60
62
  state.subtitle.className = (0, _react.mergeClasses)(toastBodyClassNames.subtitle, subtitleBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.subtitle, state.subtitle.className);
61
63
  }
62
64
  return state;
@@ -1 +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 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 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;;;;;;;;;;;;IAOaI,mBAAAA;;;IAsCAqB,2BAAAA;;;;uBA3C6C,iBAAiB;4BACpD,wBAAwB;AAIxC,4BAA4D;IACjEpB,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF,MAAMC,2BAAuBP,sBAAAA,EAAgB;IAC3CQ,iBAAiB;IACjBC,eAAe;IACfC,YAAY;IACZC,UAAUR,kBAAAA,CAAOS,eAAe;IAChCC,YAAYV,kBAAAA,CAAOW,iBAAiB;IACpCC,YAAYZ,kBAAAA,CAAOa,iBAAiB;IACpCC,OAAOd,kBAAAA,CAAOe,uBAAuB;IACrCC,WAAW;AACb;AAEA,MAAMC,2BAA2BpB,0BAAAA,EAAgB;IAC/CU,YAAY;IACZF,iBAAiB;IACjBC,eAAe;IACfE,UAAUR,kBAAAA,CAAOkB,eAAe;IAChCR,YAAYV,kBAAAA,CAAOkB,eAAe;IAClCN,YAAYZ,kBAAAA,CAAOa,iBAAiB;IACpCC,OAAOd,kBAAAA,CAAOmB,uBAAuB;AACvC;AAEA,MAAMC,wBAAoBtB,iBAAAA,EAAW;IACnCI,MAAM;QACJY,OAAOd,kBAAAA,CAAOqB,+BAA+B;IAC/C;IACAlB,UAAU;QACRW,OAAOd,kBAAAA,CAAOqB,+BAA+B;IAC/C;AACF;AAKO,oCAAoC,CAACE;IAC1C;IAEA,MAAMC,oBAAoBpB;IAC1B,MAAMqB,wBAAwBR;IAC9B,MAAMS,iBAAiBN;IACvBG,MAAMrB,IAAI,CAACyB,SAAS,OAAG5B,mBAAAA,EACrBE,oBAAoBC,IAAI,EACxBsB,mBACAD,MAAMK,oBAAoB,KAAK,cAAcF,eAAexB,IAAI,EAChEqB,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,QAAQ,EAAE;QAClBoB,MAAMpB,QAAQ,CAACwB,SAAS,OAAG5B,mBAAAA,EACzBE,oBAAoBE,QAAQ,EAC5BsB,uBACAF,MAAMK,oBAAoB,KAAK,cAAcF,eAAevB,QAAQ,EACpEoB,MAAMpB,QAAQ,CAACwB,SAAS;IAE5B;IAEA,OAAOJ;AACT,EAAE"}
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;;;;;;;;;;;;IAOaI,mBAAAA;;;IAsCAqB,2BAAAA;;;;uBA3C6C,iBAAiB;4BACpD,wBAAwB;AAIxC,4BAA4D;IACjEpB,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF,MAAMC,2BAAuBP,sBAAAA,EAAgB;IAC3CQ,iBAAiB;IACjBC,eAAe;IACfC,YAAY;IACZC,UAAUR,kBAAAA,CAAOS,eAAe;IAChCC,YAAYV,kBAAAA,CAAOW,iBAAiB;IACpCC,YAAYZ,kBAAAA,CAAOa,iBAAiB;IACpCC,OAAOd,kBAAAA,CAAOe,uBAAuB;IACrCC,WAAW;AACb;AAEA,MAAMC,2BAA2BpB,0BAAAA,EAAgB;IAC/CU,YAAY;IACZF,iBAAiB;IACjBC,eAAe;IACfE,UAAUR,kBAAAA,CAAOkB,eAAe;IAChCR,YAAYV,kBAAAA,CAAOkB,eAAe;IAClCN,YAAYZ,kBAAAA,CAAOa,iBAAiB;IACpCC,OAAOd,kBAAAA,CAAOmB,uBAAuB;AACvC;AAEA,MAAMC,wBAAoBtB,iBAAAA,EAAW;IACnCI,MAAM;QACJY,OAAOd,kBAAAA,CAAOqB,+BAA+B;IAC/C;IACAlB,UAAU;QACRW,OAAOd,kBAAAA,CAAOqB,+BAA+B;IAC/C;AACF;AAKO,oCAAoC,CAACE;IAC1C;IAEA,MAAMC,oBAAoBpB;IAC1B,MAAMqB,wBAAwBR;IAC9B,MAAMS,iBAAiBN;IACvB,oDAAoD;IACpDG,MAAMrB,IAAI,CAACyB,SAAS,OAAG5B,mBAAAA,EACrBE,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,OAAG5B,mBAAAA,EACzBE,oBAAoBE,QAAQ,EAC5BsB,uBACAF,MAAMK,oBAAoB,KAAK,cAAcF,eAAevB,QAAQ,EACpEoB,MAAMpB,QAAQ,CAACwB,SAAS;IAE5B;IAEA,OAAOJ;AACT,EAAE"}
@@ -29,6 +29,7 @@ const useRootBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r98b696",
29
29
  const useToastContainerStyles_unstable = (state)=>{
30
30
  'use no memo';
31
31
  const rootBaseClassName = useRootBaseClassName();
32
+ // eslint-disable-next-line react-hooks/immutability
32
33
  state.root.className = (0, _react.mergeClasses)(toastContainerClassNames.root, rootBaseClassName, state.root.className);
33
34
  return state;
34
35
  };
@@ -1 +1 @@
1
- {"version":3,"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 state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","toastContainerClassNames","root","timer","useRootBaseClassName","useToastContainerStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;4BAIyB;;;oCAeY;;;;uBAlBH,gBAAgB;AAGvD,MAAMI,2BAA2B;IACpCC,IAAI,EAAE,oBAAoB;IAC1BC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,oBAAoB,GAAA,WAAA,OAAGP,oBAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAQ5B,CAAC;AAGS,MAAMQ,oCAAoCC,KAAK,IAAG;IACzD,aAAa;IACb,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;IAChDE,KAAK,CAACJ,IAAI,CAACM,SAAS,OAAGV,mBAAY,EAACG,wBAAwB,CAACC,IAAI,EAAEK,iBAAiB,EAAED,KAAK,CAACJ,IAAI,CAACM,SAAS,CAAC;IAC3G,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"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"],"names":["__resetStyles","mergeClasses","tokens","createCustomFocusIndicatorStyle","toastContainerClassNames","root","timer","useRootBaseClassName","useToastContainerStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;4BAIyB;;;oCAeY;;;;uBAlBH,gBAAgB;AAGvD,MAAMI,2BAA2B;IACpCC,IAAI,EAAE,oBAAoB;IAC1BC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,oBAAoB,GAAA,WAAA,OAAGP,oBAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAQ5B,CAAC;AAGS,MAAMQ,oCAAoCC,KAAK,IAAG;IACzD,aAAa;IACb,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;IAChD,oDAAA;IACAE,KAAK,CAACJ,IAAI,CAACM,SAAS,OAAGV,mBAAY,EAACG,wBAAwB,CAACC,IAAI,EAAEK,iBAAiB,EAAED,KAAK,CAACJ,IAAI,CAACM,SAAS,CAAC;IAC3G,OAAOF,KAAK;AAChB,CAAC"}
@@ -36,6 +36,7 @@ const useRootBaseClassName = (0, _react.makeResetStyles)({
36
36
  const useToastContainerStyles_unstable = (state)=>{
37
37
  'use no memo';
38
38
  const rootBaseClassName = useRootBaseClassName();
39
+ // eslint-disable-next-line react-hooks/immutability
39
40
  state.root.className = (0, _react.mergeClasses)(toastContainerClassNames.root, rootBaseClassName, state.root.className);
40
41
  return state;
41
42
  };
@@ -1 +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 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;;;;;;;;;;;;IAQaI,wBAAAA;;;oCAkBAY;eAAAA;;;uBAxBiC,iBAAiB;4BACxC,wBAAwB;8BAEC,0BAA0B;AAGnE,iCAAsE;IAC3EX,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,2BAAuBP,sBAAAA,EAAgB;IAC3CQ,WAAW;IACXC,WAAW;IACXC,eAAe;IACfC,cAAcT,kBAAAA,CAAOU,kBAAkB;IACvC,OAAGT,6CAAAA,EAAgC;QACjCU,SAAS,GAAGX,kBAAAA,CAAOY,gBAAgB,CAAC,OAAO,EAAEZ,kBAAAA,CAAOa,iBAAiB,EAAE;IACzE,EAAE;AACJ;AAKO,yCAAyC,CAACE;IAC/C;IAEA,MAAMC,oBAAoBX;IAC1BU,MAAMZ,IAAI,CAACc,SAAS,OAAGlB,mBAAAA,EAAaG,yBAAyBC,IAAI,EAAEa,mBAAmBD,MAAMZ,IAAI,CAACc,SAAS;IAE1G,OAAOF;AACT,EAAE"}
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;;;;;;;;;;;;IAQaI,wBAAAA;;;oCAkBAY;eAAAA;;;uBAxBiC,iBAAiB;4BACxC,wBAAwB;8BAEC,0BAA0B;AAGnE,iCAAsE;IAC3EX,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,2BAAuBP,sBAAAA,EAAgB;IAC3CQ,WAAW;IACXC,WAAW;IACXC,eAAe;IACfC,cAAcT,kBAAAA,CAAOU,kBAAkB;IACvC,OAAGT,6CAAAA,EAAgC;QACjCU,SAAS,GAAGX,kBAAAA,CAAOY,gBAAgB,CAAC,OAAO,EAAEZ,kBAAAA,CAAOa,iBAAiB,EAAE;IACzE,EAAE;AACJ;AAKO,yCAAyC,CAACE;IAC/C;IAEA,MAAMC,oBAAoBX;IAC1B,oDAAoD;IACpDU,MAAMZ,IAAI,CAACc,SAAS,OAAGlB,mBAAAA,EAAaG,yBAAyBC,IAAI,EAAEa,mBAAmBD,MAAMZ,IAAI,CAACc,SAAS;IAE1G,OAAOF;AACT,EAAE"}
@@ -29,6 +29,7 @@ const toastFooterClassNames = {
29
29
  const useToastFooterStyles_unstable = (state)=>{
30
30
  'use no memo';
31
31
  const rootBaseClassName = useRootBaseClassName();
32
+ // eslint-disable-next-line react-hooks/immutability
32
33
  state.root.className = (0, _react.mergeClasses)(toastFooterClassNames.root, rootBaseClassName, state.root.className);
33
34
  return state;
34
35
  };
@@ -1 +1 @@
1
- {"version":3,"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 state.root.className = mergeClasses(toastFooterClassNames.root, rootBaseClassName, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","toastFooterClassNames","root","useRootBaseClassName","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;yBAEsB;;;iCAeY;;;;uBAhBA,gBAAgB;AACvD,MAAME,wBAAwB;IACjCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,oBAAoB,GAAA,WAAA,OAAGJ,oBAAA,EAAA,WAAA,MAAA;IAAA;CAOhC,CAAC;AAGS,MAAMK,iCAAiCC,KAAK,IAAG;IACtD,aAAa;IACb,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;IAChDE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGP,mBAAY,EAACC,qBAAqB,CAACC,IAAI,EAAEI,iBAAiB,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IACxG,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"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"],"names":["__resetStyles","mergeClasses","toastFooterClassNames","root","useRootBaseClassName","useToastFooterStyles_unstable","state","rootBaseClassName","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;yBAEsB;;;iCAeY;;;;uBAhBA,gBAAgB;AACvD,MAAME,wBAAwB;IACjCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,oBAAoB,GAAA,WAAA,OAAGJ,oBAAA,EAAA,WAAA,MAAA;IAAA;CAOhC,CAAC;AAGS,MAAMK,iCAAiCC,KAAK,IAAG;IACtD,aAAa;IACb,MAAMC,iBAAiB,GAAGH,oBAAoB,CAAC,CAAC;IAChD,oDAAA;IACAE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGP,mBAAY,EAACC,qBAAqB,CAACC,IAAI,EAAEI,iBAAiB,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IACxG,OAAOF,KAAK;AAChB,CAAC"}
@@ -34,6 +34,7 @@ const toastFooterClassNames = {
34
34
  const useToastFooterStyles_unstable = (state)=>{
35
35
  'use no memo';
36
36
  const rootBaseClassName = useRootBaseClassName();
37
+ // eslint-disable-next-line react-hooks/immutability
37
38
  state.root.className = (0, _react.mergeClasses)(toastFooterClassNames.root, rootBaseClassName, state.root.className);
38
39
  return state;
39
40
  };
@@ -1 +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 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;;;;;;;;;;;;yBAMaE;;;iCAmBAS;;;;uBAvBiC,iBAAiB;AAIxD,MAAMT,wBAA0D;IACrEC,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,2BAAuBJ,sBAAAA,EAAgB;IAC3CK,YAAY;IACZC,iBAAiB;IACjBC,eAAe;IACfC,SAAS;IACTC,YAAY;IACZC,KAAK;AACP;AAKO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,oBAAoBT;IAC1BQ,MAAMT,IAAI,CAACW,SAAS,OAAGb,mBAAAA,EAAaC,sBAAsBC,IAAI,EAAEU,mBAAmBD,MAAMT,IAAI,CAACW,SAAS;IAEvG,OAAOF;AACT,EAAE"}
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;;;;;;;;;;;;IAMaE,qBAAAA;;;iCAmBAS;eAAAA;;;uBAvBiC,iBAAiB;AAIxD,8BAAgE;IACrER,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,2BAAuBJ,sBAAAA,EAAgB;IAC3CK,YAAY;IACZC,iBAAiB;IACjBC,eAAe;IACfC,SAAS;IACTC,YAAY;IACZC,KAAK;AACP;AAKO,sCAAsC,CAACE;IAC5C;IAEA,MAAMC,oBAAoBT;IAC1B,oDAAoD;IACpDQ,MAAMT,IAAI,CAACW,SAAS,OAAGb,mBAAAA,EAAaC,sBAAsBC,IAAI,EAAEU,mBAAmBD,MAAMT,IAAI,CAACW,SAAS;IAEvG,OAAOF;AACT,EAAE"}
@@ -1,5 +1,5 @@
1
1
  /**
2
- * State used in rendering ToastTitle
2
+ * State used in rendering ToastTitle, without design-only state.
3
3
  */ "use strict";
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ToastTitle/ToastTitle.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { BackgroundAppearanceContextValue } from '@fluentui/react-shared-contexts';\nimport type { ToastContainerContextValue } from '../../contexts/toastContainerContext';\n\nexport type ToastTitleSlots = {\n root: NonNullable<Slot<'div'>>;\n media?: Slot<'div'>;\n action?: Slot<'div'>;\n};\n\n/**\n * ToastTitle Props\n */\nexport type ToastTitleProps = ComponentProps<ToastTitleSlots> & {};\n\n/**\n * State used in rendering ToastTitle\n */\nexport type ToastTitleState = ComponentState<ToastTitleSlots> &\n Pick<ToastContainerContextValue, 'intent'> & {\n backgroundAppearance: BackgroundAppearanceContextValue;\n };\n"],"names":[],"mappings":"AAeA;;CAEC,GACD,WAGI"}
1
+ {"version":3,"sources":["../src/components/ToastTitle/ToastTitle.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { BackgroundAppearanceContextValue } from '@fluentui/react-shared-contexts';\nimport type { ToastContainerContextValue } from '../../contexts/toastContainerContext';\n\nexport type ToastTitleSlots = {\n root: NonNullable<Slot<'div'>>;\n media?: Slot<'div'>;\n action?: Slot<'div'>;\n};\n\n/**\n * ToastTitle Props\n */\nexport type ToastTitleProps = ComponentProps<ToastTitleSlots> & {};\n\n/**\n * ToastTitle Props without design-only props.\n */\nexport type ToastTitleBaseProps = ToastTitleProps;\n\n/**\n * State used in rendering ToastTitle\n */\nexport type ToastTitleState = ComponentState<ToastTitleSlots> &\n Pick<ToastContainerContextValue, 'intent'> & {\n backgroundAppearance: BackgroundAppearanceContextValue;\n };\n\n/**\n * State used in rendering ToastTitle, without design-only state.\n */\nexport type ToastTitleBaseState = Omit<ToastTitleState, 'backgroundAppearance'>;\n"],"names":[],"mappings":"AA4BA;;CAEC,GACD,WAAgF"}
@@ -18,6 +18,9 @@ _export(exports, {
18
18
  toastTitleClassNames: function() {
19
19
  return _useToastTitleStylesstyles.toastTitleClassNames;
20
20
  },
21
+ useToastTitleBase_unstable: function() {
22
+ return _useToastTitle.useToastTitleBase_unstable;
23
+ },
21
24
  useToastTitleStyles_unstable: function() {
22
25
  return _useToastTitleStylesstyles.useToastTitleStyles_unstable;
23
26
  },
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ToastTitle/index.ts"],"sourcesContent":["export { ToastTitle } from './ToastTitle';\nexport type { ToastTitleProps, ToastTitleSlots, ToastTitleState } from './ToastTitle.types';\nexport { renderToastTitle_unstable } from './renderToastTitle';\nexport { useToastTitle_unstable } from './useToastTitle';\nexport { toastTitleClassNames, useToastTitleStyles_unstable } from './useToastTitleStyles.styles';\n"],"names":["ToastTitle","renderToastTitle_unstable","useToastTitle_unstable","toastTitleClassNames","useToastTitleStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,sBAAU;;;eAEVC,2CAAyB;;;eAEzBE,+CAAoB;;;eAAEC,uDAA4B;;;eADlDF,qCAAsB;;;4BAHJ,eAAe;kCAEA,qBAAqB;+BACxB,kBAAkB;2CACU,+BAA+B"}
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":";;;;;;;;;;;;eAASA,sBAAU;;;eAQVC,2CAAyB;;;eAEzBG,+CAAoB;;;eADpBF,yCAA0B;;;eACJG,uDAA4B;;;eADtBF,qCAAsB;;;4BAThC,eAAe;kCAQA,qBAAqB;+BACI,kBAAkB;2CAClB,+BAA+B"}
@@ -3,9 +3,17 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- Object.defineProperty(exports, "useToastTitle_unstable", {
7
- enumerable: true,
8
- get: function() {
6
+ function _export(target, all) {
7
+ for(var name in all)Object.defineProperty(target, name, {
8
+ enumerable: true,
9
+ get: all[name]
10
+ });
11
+ }
12
+ _export(exports, {
13
+ useToastTitleBase_unstable: function() {
14
+ return useToastTitleBase_unstable;
15
+ },
16
+ useToastTitle_unstable: function() {
9
17
  return useToastTitle_unstable;
10
18
  }
11
19
  });
@@ -15,24 +23,8 @@ const _reacticons = require("@fluentui/react-icons");
15
23
  const _reactutilities = require("@fluentui/react-utilities");
16
24
  const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
17
25
  const _toastContainerContext = require("../../contexts/toastContainerContext");
18
- const useToastTitle_unstable = (props, ref)=>{
26
+ const useToastTitleBase_unstable = (props, ref)=>{
19
27
  const { intent, titleId } = (0, _toastContainerContext.useToastContainerContext)();
20
- const backgroundAppearance = (0, _reactsharedcontexts.useBackgroundAppearance)();
21
- /** Determine the role and media to render based on the intent */ let defaultIcon;
22
- switch(intent){
23
- case 'success':
24
- defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.CheckmarkCircleFilled, null);
25
- break;
26
- case 'error':
27
- defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.DiamondDismissFilled, null);
28
- break;
29
- case 'warning':
30
- defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.WarningFilled, null);
31
- break;
32
- case 'info':
33
- defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.InfoFilled, null);
34
- break;
35
- }
36
28
  return {
37
29
  action: _reactutilities.slot.optional(props.action, {
38
30
  elementType: 'div'
@@ -44,9 +36,6 @@ const useToastTitle_unstable = (props, ref)=>{
44
36
  },
45
37
  media: _reactutilities.slot.optional(props.media, {
46
38
  renderByDefault: !!intent,
47
- defaultProps: {
48
- children: defaultIcon
49
- },
50
39
  elementType: 'div'
51
40
  }),
52
41
  root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
@@ -60,7 +49,37 @@ const useToastTitle_unstable = (props, ref)=>{
60
49
  }), {
61
50
  elementType: 'div'
62
51
  }),
63
- intent,
52
+ intent
53
+ };
54
+ };
55
+ const useToastTitle_unstable = (props, ref)=>{
56
+ 'use no memo';
57
+ const backgroundAppearance = (0, _reactsharedcontexts.useBackgroundAppearance)();
58
+ const baseState = useToastTitleBase_unstable(props, ref);
59
+ /** Determine the role and media to render based on the intent */ let defaultIcon;
60
+ switch(baseState.intent){
61
+ case 'success':
62
+ defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.CheckmarkCircleFilled, null);
63
+ break;
64
+ case 'error':
65
+ defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.DiamondDismissFilled, null);
66
+ break;
67
+ case 'warning':
68
+ defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.WarningFilled, null);
69
+ break;
70
+ case 'info':
71
+ defaultIcon = /*#__PURE__*/ _react.createElement(_reacticons.InfoFilled, null);
72
+ break;
73
+ }
74
+ return {
75
+ ...baseState,
76
+ media: _reactutilities.slot.optional(props.media, {
77
+ defaultProps: {
78
+ children: defaultIcon
79
+ },
80
+ renderByDefault: !!baseState.intent,
81
+ elementType: 'div'
82
+ }),
64
83
  backgroundAppearance
65
84
  };
66
85
  };
@@ -1 +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 { ToastTitleProps, ToastTitleState } from './ToastTitle.types';\nimport { useToastContainerContext } from '../../contexts/toastContainerContext';\n\n/**\n * Create the state required to render ToastTitle.\n *\n * The returned state can be modified with hooks such as useToastTitleStyles_unstable,\n * before being passed to renderToastTitle_unstable.\n *\n * @param props - props from this instance of ToastTitle\n * @param ref - reference to root HTMLElement of ToastTitle\n */\nexport const useToastTitle_unstable = (props: ToastTitleProps, ref: React.Ref<HTMLElement>): ToastTitleState => {\n const { intent, titleId } = useToastContainerContext();\n const backgroundAppearance = useBackgroundAppearance();\n\n /** Determine the role and media to render based on the intent */\n let defaultIcon;\n switch (intent) {\n case 'success':\n defaultIcon = <CheckmarkCircleFilled />;\n break;\n case 'error':\n defaultIcon = <DiamondDismissFilled />;\n break;\n case 'warning':\n defaultIcon = <WarningFilled />;\n break;\n case 'info':\n defaultIcon = <InfoFilled />;\n break;\n }\n\n return {\n action: slot.optional(props.action, { elementType: 'div' }),\n components: { root: 'div', media: 'div', action: 'div' },\n media: slot.optional(props.media, {\n renderByDefault: !!intent,\n defaultProps: { children: defaultIcon },\n elementType: 'div',\n }),\n root: slot.always(\n 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 backgroundAppearance,\n };\n};\n"],"names":["React","CheckmarkCircleFilled","DiamondDismissFilled","InfoFilled","WarningFilled","getIntrinsicElementProps","slot","useBackgroundAppearance","useToastContainerContext","useToastTitle_unstable","props","ref","intent","titleId","backgroundAppearance","defaultIcon","action","optional","elementType","components","root","media","renderByDefault","defaultProps","children","always","id"],"mappings":"AAAA;;;;;+BAoBaS;;;;;;;iEAlBU,QAAQ;4BAEwD,wBAAwB;gCAChE,4BAA4B;qCACnC,kCAAkC;uCAGjC,uCAAuC;AAWzE,+BAA+B,CAACC,OAAwBC;IAC7D,MAAM,EAAEC,MAAM,EAAEC,OAAO,EAAE,OAAGL,+CAAAA;IAC5B,MAAMM,uBAAuBP,gDAAAA;IAE7B,+DAA+D,GAC/D,IAAIQ;IACJ,OAAQH;QACN,KAAK;YACHG,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACd,iCAAAA,EAAAA;YACf;QACF,KAAK;YACHc,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACb,gCAAAA,EAAAA;YACf;QACF,KAAK;YACHa,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACX,yBAAAA,EAAAA;YACf;QACF,KAAK;YACHW,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACZ,sBAAAA,EAAAA;YACf;IACJ;IAEA,OAAO;QACLa,QAAQV,oBAAAA,CAAKW,QAAQ,CAACP,MAAMM,MAAM,EAAE;YAAEE,aAAa;QAAM;QACzDC,YAAY;YAAEC,MAAM;YAAOC,OAAO;YAAOL,QAAQ;QAAM;QACvDK,OAAOf,oBAAAA,CAAKW,QAAQ,CAACP,MAAMW,KAAK,EAAE;YAChCC,iBAAiB,CAAC,CAACV;YACnBW,cAAc;gBAAEC,UAAUT;YAAY;YACtCG,aAAa;QACf;QACAE,MAAMd,oBAAAA,CAAKmB,MAAM,KACfpB,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FM,KAAKA;YACLa,UAAUd,MAAMc,QAAQ;YACxBE,IAAIb;YACJ,GAAGH,KAAK;QACV,IACA;YAAEQ,aAAa;QAAM;QAEvBN;QACAE;IACF;AACF,EAAE"}
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;;;;;;;;;;;;IAiBaS,0BAAAA;;;0BAsCAe;eAAAA;;;;iEArDU,QAAQ;4BAEwD,wBAAwB;gCAChE,4BAA4B;qCACnC,kCAAkC;uCAGjC,uCAAuC;AAQzE,mCAAmC,CACxCd,OACAC;IAEA,MAAM,EAAEC,MAAM,EAAEC,OAAO,EAAE,OAAGL,+CAAAA;IAE5B,OAAO;QACLM,QAAQR,oBAAAA,CAAKS,QAAQ,CAACL,MAAMI,MAAM,EAAE;YAAEE,aAAa;QAAM;QACzDC,YAAY;YAAEC,MAAM;YAAOC,OAAO;YAAOL,QAAQ;QAAM;QACvDK,OAAOb,oBAAAA,CAAKS,QAAQ,CAACL,MAAMS,KAAK,EAAE;YAChCC,iBAAiB,CAAC,CAACR;YACnBI,aAAa;QACf;QACAE,MAAMZ,oBAAAA,CAAKe,MAAM,KACfhB,wCAAAA,EAAyB,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;AAWK,+BAA+B,CAACF,OAAwBC;IAC7D;IAEA,MAAMc,2BAAuBlB,4CAAAA;IAC7B,MAAMmB,YAAYjB,2BAA2BC,OAAOC;IAEpD,+DAA+D,GAC/D,IAAIgB;IACJ,OAAQD,UAAUd,MAAM;QACtB,KAAK;YACHe,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAAC1B,iCAAAA,EAAAA;YACf;QACF,KAAK;YACH0B,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACzB,gCAAAA,EAAAA;YACf;QACF,KAAK;YACHyB,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACvB,yBAAAA,EAAAA;YACf;QACF,KAAK;YACHuB,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACxB,sBAAAA,EAAAA;YACf;IACJ;IAEA,OAAO;QACL,GAAGuB,SAAS;QACZP,OAAOb,oBAAAA,CAAKS,QAAQ,CAACL,MAAMS,KAAK,EAAE;YAChCS,cAAc;gBAAEN,UAAUK;YAAY;YACtCP,iBAAiB,CAAC,CAACM,UAAUd,MAAM;YACnCI,aAAa;QACf;QACAS;IACF;AACF,EAAE"}
@@ -102,11 +102,14 @@ const useToastTitleStyles_unstable = (state)=>{
102
102
  const intentIconStylesInverted = useIntentIconStylesInverted();
103
103
  const { intent } = state;
104
104
  const invertedStyles = useInvertedStyles();
105
+ // eslint-disable-next-line react-hooks/immutability
105
106
  state.root.className = (0, _react.mergeClasses)(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);
106
107
  if (state.media) {
108
+ // eslint-disable-next-line react-hooks/immutability
107
109
  state.media.className = (0, _react.mergeClasses)(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent], state.media.className);
108
110
  }
109
111
  if (state.action) {
112
+ // eslint-disable-next-line react-hooks/immutability
110
113
  state.action.className = (0, _react.mergeClasses)(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);
111
114
  }
112
115
  return state;
@@ -1 +1 @@
1
- {"version":3,"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 state.root.className = mergeClasses(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);\n if (state.media) {\n state.media.className = mergeClasses(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent], state.media.className);\n }\n if (state.action) {\n state.action.className = mergeClasses(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);\n }\n return state;\n};\n"],"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"],"mappings":"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"}
1
+ {"version":3,"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"],"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"],"mappings":"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"}
@@ -93,11 +93,14 @@ const useToastTitleStyles_unstable = (state)=>{
93
93
  const intentIconStylesInverted = useIntentIconStylesInverted();
94
94
  const { intent } = state;
95
95
  const invertedStyles = useInvertedStyles();
96
+ // eslint-disable-next-line react-hooks/immutability
96
97
  state.root.className = (0, _react.mergeClasses)(toastTitleClassNames.root, rootBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.root, state.root.className);
97
98
  if (state.media) {
99
+ // eslint-disable-next-line react-hooks/immutability
98
100
  state.media.className = (0, _react.mergeClasses)(toastTitleClassNames.media, mediaBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.media, intent && intentIconStyles[intent], intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent], state.media.className);
99
101
  }
100
102
  if (state.action) {
103
+ // eslint-disable-next-line react-hooks/immutability
101
104
  state.action.className = (0, _react.mergeClasses)(toastTitleClassNames.action, actionBaseClassName, state.backgroundAppearance === 'inverted' && invertedStyles.action, state.action.className);
102
105
  }
103
106
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ToastTitle/useToastTitleStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ToastTitleSlots, ToastTitleState } from './ToastTitle.types';\n\nexport const toastTitleClassNames: SlotClassNames<ToastTitleSlots> = {\n root: 'fui-ToastTitle',\n media: 'fui-ToastTitle__media',\n action: 'fui-ToastTitle__action',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n display: 'flex',\n gridColumnEnd: 3,\n color: tokens.colorNeutralForeground1,\n wordBreak: 'break-word',\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n display: 'flex',\n paddingTop: '2px',\n gridColumnEnd: 2,\n paddingRight: '8px',\n fontSize: '16px',\n color: tokens.colorNeutralForeground1,\n});\n\nconst useActionBaseClassName = makeResetStyles({\n display: 'flex',\n alignItems: 'start',\n paddingLeft: '12px',\n gridColumnEnd: -1,\n color: tokens.colorBrandForeground1,\n});\n\nconst useInvertedStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForegroundInverted2,\n },\n\n action: {\n color: tokens.colorBrandForegroundInverted,\n },\n\n media: {\n color: tokens.colorNeutralForegroundInverted,\n },\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});\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/**\n * Apply styling to the ToastTitle slots based on the state\n */\nexport const useToastTitleStyles_unstable = (state: ToastTitleState): ToastTitleState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n const actionBaseClassName = useActionBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const intentIconStyles = useIntentIconStyles();\n const intentIconStylesInverted = useIntentIconStylesInverted();\n const { intent } = state;\n const invertedStyles = useInvertedStyles();\n state.root.className = mergeClasses(\n toastTitleClassNames.root,\n rootBaseClassName,\n state.backgroundAppearance === 'inverted' && invertedStyles.root,\n state.root.className,\n );\n\n if (state.media) {\n state.media.className = mergeClasses(\n toastTitleClassNames.media,\n mediaBaseClassName,\n state.backgroundAppearance === 'inverted' && invertedStyles.media,\n intent && intentIconStyles[intent],\n intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent],\n state.media.className,\n );\n }\n\n if (state.action) {\n state.action.className = mergeClasses(\n toastTitleClassNames.action,\n actionBaseClassName,\n state.backgroundAppearance === 'inverted' && invertedStyles.action,\n state.action.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","tokens","toastTitleClassNames","root","media","action","useRootBaseClassName","display","gridColumnEnd","color","colorNeutralForeground1","wordBreak","useMediaBaseClassName","paddingTop","paddingRight","fontSize","useActionBaseClassName","alignItems","paddingLeft","colorBrandForeground1","useInvertedStyles","colorNeutralForegroundInverted2","colorBrandForegroundInverted","colorNeutralForegroundInverted","useIntentIconStyles","success","colorStatusSuccessForeground1","error","colorStatusDangerForeground1","warning","colorStatusWarningForeground1","info","colorNeutralForeground2","useIntentIconStylesInverted","colorStatusSuccessForegroundInverted","colorStatusDangerForegroundInverted","colorStatusWarningForegroundInverted","useToastTitleStyles_unstable","state","rootBaseClassName","actionBaseClassName","mediaBaseClassName","intentIconStyles","intentIconStylesInverted","intent","invertedStyles","className","backgroundAppearance"],"mappings":"AAAA;;;;;;;;;;;;IAOaI,oBAAAA;;;gCA6EAmC;eAAAA;;;uBAlF6C,iBAAiB;4BACpD,wBAAwB;AAIxC,6BAA8D;IACnElC,MAAM;IACNC,OAAO;IACPC,QAAQ;AACV,EAAE;AAEF,MAAMC,2BAAuBP,sBAAAA,EAAgB;IAC3CQ,SAAS;IACTC,eAAe;IACfC,OAAOR,kBAAAA,CAAOS,uBAAuB;IACrCC,WAAW;AACb;AAEA,MAAMC,4BAAwBb,sBAAAA,EAAgB;IAC5CQ,SAAS;IACTM,YAAY;IACZL,eAAe;IACfM,cAAc;IACdC,UAAU;IACVN,OAAOR,kBAAAA,CAAOS,uBAAuB;AACvC;AAEA,MAAMM,6BAAyBjB,sBAAAA,EAAgB;IAC7CQ,SAAS;IACTU,YAAY;IACZC,aAAa;IACbV,eAAe,CAAC;IAChBC,OAAOR,kBAAAA,CAAOkB,qBAAqB;AACrC;AAEA,MAAMC,wBAAoBtB,iBAAAA,EAAW;IACnCK,MAAM;QACJM,OAAOR,kBAAAA,CAAOoB,+BAA+B;IAC/C;IAEAhB,QAAQ;QACNI,OAAOR,kBAAAA,CAAOqB,4BAA4B;IAC5C;IAEAlB,OAAO;QACLK,OAAOR,kBAAAA,CAAOsB,8BAA8B;IAC9C;AACF;AAEA,MAAMC,0BAAsB1B,iBAAAA,EAAW;IACrC2B,SAAS;QACPhB,OAAOR,kBAAAA,CAAOyB,6BAA6B;IAC7C;IACAC,OAAO;QACLlB,OAAOR,kBAAAA,CAAO2B,4BAA4B;IAC5C;IACAC,SAAS;QACPpB,OAAOR,kBAAAA,CAAO6B,6BAA6B;IAC7C;IACAC,MAAM;QACJtB,OAAOR,kBAAAA,CAAO+B,uBAAuB;IACvC;AACF;AAEA,MAAMC,kCAA8BnC,iBAAAA,EAAW;IAC7C2B,SAAS;QACPhB,OAAOR,kBAAAA,CAAOiC,oCAAoC;IACpD;IACAP,OAAO;QACLlB,OAAOR,kBAAAA,CAAOkC,mCAAmC;IACnD;IACAN,SAAS;QACPpB,OAAOR,kBAAAA,CAAOmC,oCAAoC;IACpD;IACAL,MAAM;QACJtB,OAAOR,kBAAAA,CAAOoB,+BAA+B;IAC/C;AACF;AAKO,qCAAqC,CAACiB;IAC3C;IAEA,MAAMC,oBAAoBjC;IAC1B,MAAMkC,sBAAsBxB;IAC5B,MAAMyB,qBAAqB7B;IAC3B,MAAM8B,mBAAmBlB;IACzB,MAAMmB,2BAA2BV;IACjC,MAAM,EAAEW,MAAM,EAAE,GAAGN;IACnB,MAAMO,iBAAiBzB;IACvBkB,MAAMnC,IAAI,CAAC2C,SAAS,OAAG9C,mBAAAA,EACrBE,qBAAqBC,IAAI,EACzBoC,mBACAD,MAAMS,oBAAoB,KAAK,cAAcF,eAAe1C,IAAI,EAChEmC,MAAMnC,IAAI,CAAC2C,SAAS;IAGtB,IAAIR,MAAMlC,KAAK,EAAE;QACfkC,MAAMlC,KAAK,CAAC0C,SAAS,GAAG9C,uBAAAA,EACtBE,qBAAqBE,KAAK,EAC1BqC,oBACAH,MAAMS,oBAAoB,KAAK,cAAcF,eAAezC,KAAK,EACjEwC,UAAUF,gBAAgB,CAACE,OAAO,EAClCA,UAAUN,MAAMS,oBAAoB,KAAK,cAAcJ,wBAAwB,CAACC,OAAO,EACvFN,MAAMlC,KAAK,CAAC0C,SAAS;IAEzB;IAEA,IAAIR,MAAMjC,MAAM,EAAE;QAChBiC,MAAMjC,MAAM,CAACyC,SAAS,OAAG9C,mBAAAA,EACvBE,qBAAqBG,MAAM,EAC3BmC,qBACAF,MAAMS,oBAAoB,KAAK,cAAcF,eAAexC,MAAM,EAClEiC,MAAMjC,MAAM,CAACyC,SAAS;IAE1B;IAEA,OAAOR;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/ToastTitle/useToastTitleStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ToastTitleSlots, ToastTitleState } from './ToastTitle.types';\n\nexport const toastTitleClassNames: SlotClassNames<ToastTitleSlots> = {\n root: 'fui-ToastTitle',\n media: 'fui-ToastTitle__media',\n action: 'fui-ToastTitle__action',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n display: 'flex',\n gridColumnEnd: 3,\n color: tokens.colorNeutralForeground1,\n wordBreak: 'break-word',\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n display: 'flex',\n paddingTop: '2px',\n gridColumnEnd: 2,\n paddingRight: '8px',\n fontSize: '16px',\n color: tokens.colorNeutralForeground1,\n});\n\nconst useActionBaseClassName = makeResetStyles({\n display: 'flex',\n alignItems: 'start',\n paddingLeft: '12px',\n gridColumnEnd: -1,\n color: tokens.colorBrandForeground1,\n});\n\nconst useInvertedStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForegroundInverted2,\n },\n\n action: {\n color: tokens.colorBrandForegroundInverted,\n },\n\n media: {\n color: tokens.colorNeutralForegroundInverted,\n },\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});\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/**\n * Apply styling to the ToastTitle slots based on the state\n */\nexport const useToastTitleStyles_unstable = (state: ToastTitleState): ToastTitleState => {\n 'use no memo';\n\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(\n toastTitleClassNames.root,\n rootBaseClassName,\n state.backgroundAppearance === 'inverted' && invertedStyles.root,\n state.root.className,\n );\n\n if (state.media) {\n // eslint-disable-next-line react-hooks/immutability\n state.media.className = mergeClasses(\n toastTitleClassNames.media,\n mediaBaseClassName,\n state.backgroundAppearance === 'inverted' && invertedStyles.media,\n intent && intentIconStyles[intent],\n intent && state.backgroundAppearance === 'inverted' && intentIconStylesInverted[intent],\n state.media.className,\n );\n }\n\n if (state.action) {\n // eslint-disable-next-line react-hooks/immutability\n state.action.className = mergeClasses(\n toastTitleClassNames.action,\n actionBaseClassName,\n state.backgroundAppearance === 'inverted' && invertedStyles.action,\n state.action.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","tokens","toastTitleClassNames","root","media","action","useRootBaseClassName","display","gridColumnEnd","color","colorNeutralForeground1","wordBreak","useMediaBaseClassName","paddingTop","paddingRight","fontSize","useActionBaseClassName","alignItems","paddingLeft","colorBrandForeground1","useInvertedStyles","colorNeutralForegroundInverted2","colorBrandForegroundInverted","colorNeutralForegroundInverted","useIntentIconStyles","success","colorStatusSuccessForeground1","error","colorStatusDangerForeground1","warning","colorStatusWarningForeground1","info","colorNeutralForeground2","useIntentIconStylesInverted","colorStatusSuccessForegroundInverted","colorStatusDangerForegroundInverted","colorStatusWarningForegroundInverted","useToastTitleStyles_unstable","state","rootBaseClassName","actionBaseClassName","mediaBaseClassName","intentIconStyles","intentIconStylesInverted","intent","invertedStyles","className","backgroundAppearance"],"mappings":"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"}
@@ -18,6 +18,9 @@ _export(exports, {
18
18
  toasterClassNames: function() {
19
19
  return _useToasterStylesstyles.toasterClassNames;
20
20
  },
21
+ useToastAnnounce: function() {
22
+ return _useToastAnnounce.useToastAnnounce;
23
+ },
21
24
  useToasterStyles_unstable: function() {
22
25
  return _useToasterStylesstyles.useToasterStyles_unstable;
23
26
  },
@@ -29,3 +32,4 @@ const _Toaster = require("./Toaster");
29
32
  const _renderToaster = require("./renderToaster");
30
33
  const _useToaster = require("./useToaster");
31
34
  const _useToasterStylesstyles = require("./useToasterStyles.styles");
35
+ const _useToastAnnounce = require("./useToastAnnounce");
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Toaster/index.ts"],"sourcesContent":["export { Toaster } from './Toaster';\nexport type { ToasterProps, ToasterSlots, ToasterSlotsInternal, ToasterState } from './Toaster.types';\nexport { renderToaster_unstable } from './renderToaster';\nexport { useToaster_unstable } from './useToaster';\nexport { toasterClassNames, useToasterStyles_unstable } from './useToasterStyles.styles';\n"],"names":["Toaster","renderToaster_unstable","useToaster_unstable","toasterClassNames","useToasterStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,gBAAO;;;eAEPC,qCAAsB;;;eAEtBE,yCAAiB;;;eAAEC,iDAAyB;;;eAD5CF,+BAAmB;;;yBAHJ,YAAY;+BAEG,kBAAkB;4BACrB,eAAe;wCACU,4BAA4B"}
1
+ {"version":3,"sources":["../src/components/Toaster/index.ts"],"sourcesContent":["export { Toaster } from './Toaster';\nexport type { ToasterProps, ToasterSlots, ToasterSlotsInternal, ToasterState } from './Toaster.types';\nexport { renderToaster_unstable } from './renderToaster';\nexport { useToaster_unstable } from './useToaster';\nexport { toasterClassNames, useToasterStyles_unstable } from './useToasterStyles.styles';\nexport { useToastAnnounce } from './useToastAnnounce';\n"],"names":["Toaster","renderToaster_unstable","useToaster_unstable","toasterClassNames","useToasterStyles_unstable","useToastAnnounce"],"mappings":";;;;;;;;;;;;eAASA,gBAAO;;;eAEPC,qCAAsB;;;eAEtBE,yCAAiB;;;eACjBE,kCAAgB;;;eADGD,iDAAyB;;;eAD5CF,+BAAmB;;;yBAHJ,YAAY;+BAEG,kBAAkB;4BACrB,eAAe;wCACU,4BAA4B;kCACxD,qBAAqB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Toaster/useToastAnnounce.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { Announce } from '../AriaLive';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\n/**\n * Wraps an aria live announcement function.\n * Aria live announcements can be detrimental once the user is already navigating\n * multiple toasts. Once the user is focused inside the toaster, the announecments should be disabled.\n * @param announce\n * @returns A function to announce a toast and a ref to attach to the toaster element\n */\nexport function useToastAnnounce(announce: Announce): {\n announceToast: Announce;\n toasterRef: React.RefCallback<HTMLDivElement>;\n} {\n const activeRef = React.useRef(true);\n const cleanupRef = React.useRef<() => void>(() => undefined);\n const announceToast = React.useCallback<Announce>(\n (message, options) => {\n if (activeRef.current) {\n announce(message, options);\n }\n },\n [announce],\n );\n\n const toasterRef = React.useCallback((el: HTMLDivElement | null) => {\n if (!el) {\n cleanupRef.current();\n return;\n }\n\n const onFocusIn = (e: FocusEvent) => {\n if (\n isHTMLElement(e.currentTarget) &&\n e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)\n ) {\n return;\n }\n\n activeRef.current = false;\n };\n\n const onFocusOut = (e: FocusEvent) => {\n if (\n isHTMLElement(e.currentTarget) &&\n e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)\n ) {\n return;\n }\n\n activeRef.current = true;\n };\n\n el.addEventListener('focusin', onFocusIn);\n el.addEventListener('focusout', onFocusOut);\n\n cleanupRef.current = () => {\n el.removeEventListener('focusin', onFocusIn);\n el.removeEventListener('focusout', onFocusOut);\n };\n }, []);\n\n return {\n announceToast,\n toasterRef,\n };\n}\n"],"names":["React","isHTMLElement","useToastAnnounce","announce","activeRef","useRef","cleanupRef","undefined","announceToast","useCallback","message","options","current","toasterRef","el","onFocusIn","e","currentTarget","contains","relatedTarget","onFocusOut","addEventListener","removeEventListener"],"mappings":"AAAA;;;;;+BAagBE;;;;;;;iEAXO,QAAQ;gCAED,4BAA4B;AASnD,0BAA0BC,QAAkB;IAIjD,MAAMC,YAAYJ,OAAMK,MAAM,CAAC;IAC/B,MAAMC,aAAaN,OAAMK,MAAM,CAAa,IAAME;IAClD,MAAMC,gBAAgBR,OAAMS,WAAW,CACrC,CAACC,SAASC;QACR,IAAIP,UAAUQ,OAAO,EAAE;YACrBT,SAASO,SAASC;QACpB;IACF,GACA;QAACR;KAAS;IAGZ,MAAMU,aAAab,OAAMS,WAAW,CAAC,CAACK;QACpC,IAAI,CAACA,IAAI;YACPR,WAAWM,OAAO;YAClB;QACF;QAEA,MAAMG,YAAY,CAACC;YACjB,QACEf,6BAAAA,EAAce,EAAEC,aAAa,KAC7BD,EAAEC,aAAa,CAACC,QAAQ,KAACjB,6BAAAA,EAAce,EAAEG,aAAa,IAAIH,EAAEG,aAAa,GAAG,OAC5E;gBACA;YACF;YAEAf,UAAUQ,OAAO,GAAG;QACtB;QAEA,MAAMQ,aAAa,CAACJ;YAClB,QACEf,6BAAAA,EAAce,EAAEC,aAAa,KAC7BD,EAAEC,aAAa,CAACC,QAAQ,CAACjB,iCAAAA,EAAce,EAAEG,aAAa,IAAIH,EAAEG,aAAa,GAAG,OAC5E;gBACA;YACF;YAEAf,UAAUQ,OAAO,GAAG;QACtB;QAEAE,GAAGO,gBAAgB,CAAC,WAAWN;QAC/BD,GAAGO,gBAAgB,CAAC,YAAYD;QAEhCd,WAAWM,OAAO,GAAG;YACnBE,GAAGQ,mBAAmB,CAAC,WAAWP;YAClCD,GAAGQ,mBAAmB,CAAC,YAAYF;QACrC;IACF,GAAG,EAAE;IAEL,OAAO;QACLZ;QACAK;IACF;AACF"}
1
+ {"version":3,"sources":["../src/components/Toaster/useToastAnnounce.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { Announce } from '../AriaLive';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\n/**\n * Wraps an aria live announcement function.\n * Aria live announcements can be detrimental once the user is already navigating\n * multiple toasts. Once the user is focused inside the toaster, the announecments should be disabled.\n * @param announce - The aria live announcement function to wrap\n * @returns A function to announce a toast and a ref to attach to the toaster element\n */\nexport function useToastAnnounce(announce: Announce): {\n announceToast: Announce;\n toasterRef: React.RefCallback<HTMLDivElement>;\n} {\n const activeRef = React.useRef(true);\n const cleanupRef = React.useRef<() => void>(() => undefined);\n const announceToast = React.useCallback<Announce>(\n (message, options) => {\n if (activeRef.current) {\n announce(message, options);\n }\n },\n [announce],\n );\n\n const toasterRef = React.useCallback((el: HTMLDivElement | null) => {\n if (!el) {\n cleanupRef.current();\n return;\n }\n\n const onFocusIn = (e: FocusEvent) => {\n if (\n isHTMLElement(e.currentTarget) &&\n e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)\n ) {\n return;\n }\n\n activeRef.current = false;\n };\n\n const onFocusOut = (e: FocusEvent) => {\n if (\n isHTMLElement(e.currentTarget) &&\n e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)\n ) {\n return;\n }\n\n activeRef.current = true;\n };\n\n el.addEventListener('focusin', onFocusIn);\n el.addEventListener('focusout', onFocusOut);\n\n cleanupRef.current = () => {\n el.removeEventListener('focusin', onFocusIn);\n el.removeEventListener('focusout', onFocusOut);\n };\n }, []);\n\n return {\n announceToast,\n toasterRef,\n };\n}\n"],"names":["React","isHTMLElement","useToastAnnounce","announce","activeRef","useRef","cleanupRef","undefined","announceToast","useCallback","message","options","current","toasterRef","el","onFocusIn","e","currentTarget","contains","relatedTarget","onFocusOut","addEventListener","removeEventListener"],"mappings":"AAAA;;;;;+BAagBE;;;;;;;iEAXO,QAAQ;gCAED,4BAA4B;AASnD,0BAA0BC,QAAkB;IAIjD,MAAMC,YAAYJ,OAAMK,MAAM,CAAC;IAC/B,MAAMC,aAAaN,OAAMK,MAAM,CAAa,IAAME;IAClD,MAAMC,gBAAgBR,OAAMS,WAAW,CACrC,CAACC,SAASC;QACR,IAAIP,UAAUQ,OAAO,EAAE;YACrBT,SAASO,SAASC;QACpB;IACF,GACA;QAACR;KAAS;IAGZ,MAAMU,aAAab,OAAMS,WAAW,CAAC,CAACK;QACpC,IAAI,CAACA,IAAI;YACPR,WAAWM,OAAO;YAClB;QACF;QAEA,MAAMG,YAAY,CAACC;YACjB,QACEf,6BAAAA,EAAce,EAAEC,aAAa,KAC7BD,EAAEC,aAAa,CAACC,QAAQ,KAACjB,6BAAAA,EAAce,EAAEG,aAAa,IAAIH,EAAEG,aAAa,GAAG,OAC5E;gBACA;YACF;YAEAf,UAAUQ,OAAO,GAAG;QACtB;QAEA,MAAMQ,aAAa,CAACJ;YAClB,QACEf,6BAAAA,EAAce,EAAEC,aAAa,KAC7BD,EAAEC,aAAa,CAACC,QAAQ,CAACjB,iCAAAA,EAAce,EAAEG,aAAa,IAAIH,EAAEG,aAAa,GAAG,OAC5E;gBACA;YACF;YAEAf,UAAUQ,OAAO,GAAG;QACtB;QAEAE,GAAGO,gBAAgB,CAAC,WAAWN;QAC/BD,GAAGO,gBAAgB,CAAC,YAAYD;QAEhCd,WAAWM,OAAO,GAAG;YACnBE,GAAGQ,mBAAmB,CAAC,WAAWP;YAClCD,GAAGQ,mBAAmB,CAAC,YAAYF;QACrC;IACF,GAAG,EAAE;IAEL,OAAO;QACLZ;QACAK;IACF;AACF"}
@@ -43,6 +43,7 @@ const useToasterStyles_unstable = (state)=>{
43
43
  const className = (0, _react.mergeClasses)(toasterClassNames.root, rootBaseClassName, state.inline && styles.inline, state.root.className);
44
44
  if (state.bottomStart) {
45
45
  var _state_bottomStart;
46
+ // eslint-disable-next-line react-hooks/immutability
46
47
  state.bottomStart.className = className;
47
48
  var _style;
48
49
  (_style = (_state_bottomStart = state.bottomStart).style) !== null && _style !== void 0 ? _style : _state_bottomStart.style = {};
@@ -50,6 +51,7 @@ const useToasterStyles_unstable = (state)=>{
50
51
  }
51
52
  if (state.bottomEnd) {
52
53
  var _state_bottomEnd;
54
+ // eslint-disable-next-line react-hooks/immutability
53
55
  state.bottomEnd.className = className;
54
56
  var _style1;
55
57
  (_style1 = (_state_bottomEnd = state.bottomEnd).style) !== null && _style1 !== void 0 ? _style1 : _state_bottomEnd.style = {};
@@ -57,6 +59,7 @@ const useToasterStyles_unstable = (state)=>{
57
59
  }
58
60
  if (state.topStart) {
59
61
  var _state_topStart;
62
+ // eslint-disable-next-line react-hooks/immutability
60
63
  state.topStart.className = className;
61
64
  var _style2;
62
65
  (_style2 = (_state_topStart = state.topStart).style) !== null && _style2 !== void 0 ? _style2 : _state_topStart.style = {};
@@ -64,6 +67,7 @@ const useToasterStyles_unstable = (state)=>{
64
67
  }
65
68
  if (state.topEnd) {
66
69
  var _state_topEnd;
70
+ // eslint-disable-next-line react-hooks/immutability
67
71
  state.topEnd.className = className;
68
72
  var _style3;
69
73
  (_style3 = (_state_topEnd = state.topEnd).style) !== null && _style3 !== void 0 ? _style3 : _state_topEnd.style = {};
@@ -71,6 +75,7 @@ const useToasterStyles_unstable = (state)=>{
71
75
  }
72
76
  if (state.top) {
73
77
  var _state_top;
78
+ // eslint-disable-next-line react-hooks/immutability
74
79
  state.top.className = className;
75
80
  var _style4;
76
81
  (_style4 = (_state_top = state.top).style) !== null && _style4 !== void 0 ? _style4 : _state_top.style = {};
@@ -78,6 +83,7 @@ const useToasterStyles_unstable = (state)=>{
78
83
  }
79
84
  if (state.bottom) {
80
85
  var _state_bottom;
86
+ // eslint-disable-next-line react-hooks/immutability
81
87
  state.bottom.className = className;
82
88
  var _style5;
83
89
  (_style5 = (_state_bottom = state.bottom).style) !== null && _style5 !== void 0 ? _style5 : _state_bottom.style = {};
@@ -1 +1 @@
1
- {"version":3,"sources":["useToasterStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { TOAST_POSITIONS, getPositionStyles } from '../../state/index';\nexport const toasterClassNames = {\n root: 'fui-Toaster'\n};\n/**\n * Styles for the root slot\n */ const useRootBaseClassName = makeResetStyles({\n position: 'fixed',\n width: '292px',\n pointerEvents: 'none'\n});\nconst useToasterStyles = makeStyles({\n inline: {\n position: 'absolute'\n }\n});\n/**\n * Apply styling to the Toaster slots based on the state\n */ export const useToasterStyles_unstable = (state)=>{\n 'use no memo';\n const rootBaseClassName = useRootBaseClassName();\n const styles = useToasterStyles();\n const className = mergeClasses(toasterClassNames.root, rootBaseClassName, state.inline && styles.inline, state.root.className);\n if (state.bottomStart) {\n var _state_bottomStart;\n state.bottomStart.className = className;\n var _style;\n (_style = (_state_bottomStart = state.bottomStart).style) !== null && _style !== void 0 ? _style : _state_bottomStart.style = {};\n Object.assign(state.bottomStart.style, getPositionStyles(TOAST_POSITIONS.bottomStart, state.dir, state.offset));\n }\n if (state.bottomEnd) {\n var _state_bottomEnd;\n state.bottomEnd.className = className;\n var _style1;\n (_style1 = (_state_bottomEnd = state.bottomEnd).style) !== null && _style1 !== void 0 ? _style1 : _state_bottomEnd.style = {};\n Object.assign(state.bottomEnd.style, getPositionStyles(TOAST_POSITIONS.bottomEnd, state.dir, state.offset));\n }\n if (state.topStart) {\n var _state_topStart;\n state.topStart.className = className;\n var _style2;\n (_style2 = (_state_topStart = state.topStart).style) !== null && _style2 !== void 0 ? _style2 : _state_topStart.style = {};\n Object.assign(state.topStart.style, getPositionStyles(TOAST_POSITIONS.topStart, state.dir, state.offset));\n }\n if (state.topEnd) {\n var _state_topEnd;\n state.topEnd.className = className;\n var _style3;\n (_style3 = (_state_topEnd = state.topEnd).style) !== null && _style3 !== void 0 ? _style3 : _state_topEnd.style = {};\n Object.assign(state.topEnd.style, getPositionStyles(TOAST_POSITIONS.topEnd, state.dir, state.offset));\n }\n if (state.top) {\n var _state_top;\n state.top.className = className;\n var _style4;\n (_style4 = (_state_top = state.top).style) !== null && _style4 !== void 0 ? _style4 : _state_top.style = {};\n Object.assign(state.top.style, getPositionStyles(TOAST_POSITIONS.top, state.dir, state.offset));\n }\n if (state.bottom) {\n var _state_bottom;\n state.bottom.className = className;\n var _style5;\n (_style5 = (_state_bottom = state.bottom).style) !== null && _style5 !== void 0 ? _style5 : _state_bottom.style = {};\n Object.assign(state.bottom.style, getPositionStyles(TOAST_POSITIONS.bottom, state.dir, state.offset));\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","TOAST_POSITIONS","getPositionStyles","toasterClassNames","root","useRootBaseClassName","useToasterStyles","inline","qhf8xq","d","useToasterStyles_unstable","state","rootBaseClassName","styles","className","bottomStart","_state_bottomStart","_style","style","Object","assign","dir","offset","bottomEnd","_state_bottomEnd","_style1","topStart","_state_topStart","_style2","topEnd","_state_topEnd","_style3","top","_state_top","_style4","bottom","_state_bottom","_style5"],"mappings":"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"}
1
+ {"version":3,"sources":["useToasterStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { TOAST_POSITIONS, getPositionStyles } from '../../state/index';\nexport const toasterClassNames = {\n root: 'fui-Toaster'\n};\n/**\n * Styles for the root slot\n */ const useRootBaseClassName = makeResetStyles({\n position: 'fixed',\n width: '292px',\n pointerEvents: 'none'\n});\nconst useToasterStyles = makeStyles({\n inline: {\n position: 'absolute'\n }\n});\n/**\n * Apply styling to the Toaster slots based on the state\n */ export const useToasterStyles_unstable = (state)=>{\n 'use no memo';\n const rootBaseClassName = useRootBaseClassName();\n const styles = useToasterStyles();\n const className = mergeClasses(toasterClassNames.root, rootBaseClassName, state.inline && styles.inline, state.root.className);\n if (state.bottomStart) {\n var _state_bottomStart;\n // eslint-disable-next-line react-hooks/immutability\n state.bottomStart.className = className;\n var _style;\n (_style = (_state_bottomStart = state.bottomStart).style) !== null && _style !== void 0 ? _style : _state_bottomStart.style = {};\n Object.assign(state.bottomStart.style, getPositionStyles(TOAST_POSITIONS.bottomStart, state.dir, state.offset));\n }\n if (state.bottomEnd) {\n var _state_bottomEnd;\n // eslint-disable-next-line react-hooks/immutability\n state.bottomEnd.className = className;\n var _style1;\n (_style1 = (_state_bottomEnd = state.bottomEnd).style) !== null && _style1 !== void 0 ? _style1 : _state_bottomEnd.style = {};\n Object.assign(state.bottomEnd.style, getPositionStyles(TOAST_POSITIONS.bottomEnd, state.dir, state.offset));\n }\n if (state.topStart) {\n var _state_topStart;\n // eslint-disable-next-line react-hooks/immutability\n state.topStart.className = className;\n var _style2;\n (_style2 = (_state_topStart = state.topStart).style) !== null && _style2 !== void 0 ? _style2 : _state_topStart.style = {};\n Object.assign(state.topStart.style, getPositionStyles(TOAST_POSITIONS.topStart, state.dir, state.offset));\n }\n if (state.topEnd) {\n var _state_topEnd;\n // eslint-disable-next-line react-hooks/immutability\n state.topEnd.className = className;\n var _style3;\n (_style3 = (_state_topEnd = state.topEnd).style) !== null && _style3 !== void 0 ? _style3 : _state_topEnd.style = {};\n Object.assign(state.topEnd.style, getPositionStyles(TOAST_POSITIONS.topEnd, state.dir, state.offset));\n }\n if (state.top) {\n var _state_top;\n // eslint-disable-next-line react-hooks/immutability\n state.top.className = className;\n var _style4;\n (_style4 = (_state_top = state.top).style) !== null && _style4 !== void 0 ? _style4 : _state_top.style = {};\n Object.assign(state.top.style, getPositionStyles(TOAST_POSITIONS.top, state.dir, state.offset));\n }\n if (state.bottom) {\n var _state_bottom;\n // eslint-disable-next-line react-hooks/immutability\n state.bottom.className = className;\n var _style5;\n (_style5 = (_state_bottom = state.bottom).style) !== null && _style5 !== void 0 ? _style5 : _state_bottom.style = {};\n Object.assign(state.bottom.style, getPositionStyles(TOAST_POSITIONS.bottom, state.dir, state.offset));\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","TOAST_POSITIONS","getPositionStyles","toasterClassNames","root","useRootBaseClassName","useToasterStyles","inline","qhf8xq","d","useToasterStyles_unstable","state","rootBaseClassName","styles","className","bottomStart","_state_bottomStart","_style","style","Object","assign","dir","offset","bottomEnd","_state_bottomEnd","_style1","topStart","_state_topStart","_style2","topEnd","_state_topEnd","_style3","top","_state_top","_style4","bottom","_state_bottom","_style5"],"mappings":"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"}