@fluentui/react-dialog 9.15.0 → 9.15.2

package/lib/components/DialogSurface/useDialogSurfaceStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';
 import { tokens } from '@fluentui/react-theme';
 import { createFocusOutlineStyle } from '@fluentui/react-tabster';

package/lib/components/DialogSurface/useDialogSurfaceStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogSurface/useDialogSurfaceStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport {\n  DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n  DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR,\n  DIALOG_MEDIA_QUERY_SHORT_SCREEN,\n  SURFACE_BORDER_WIDTH,\n  SURFACE_PADDING,\n} from '../../contexts';\nimport type { DialogSurfaceSlots, DialogSurfaceState } from './DialogSurface.types';\n\nexport const dialogSurfaceClassNames: SlotClassNames<Omit<DialogSurfaceSlots, 'backdropMotion'>> = {\n  root: 'fui-DialogSurface',\n  backdrop: 'fui-DialogSurface__backdrop',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootBaseStyle = makeResetStyles({\n  ...createFocusOutlineStyle(),\n  inset: 0,\n  padding: SURFACE_PADDING,\n  margin: 'auto',\n  borderStyle: 'none',\n  overflow: 'unset',\n  border: `${SURFACE_BORDER_WIDTH} solid ${tokens.colorTransparentStroke}`,\n  borderRadius: tokens.borderRadiusXLarge,\n\n  display: 'block',\n  userSelect: 'unset',\n  visibility: 'unset',\n  position: 'fixed',\n  height: 'fit-content',\n  maxWidth: '600px',\n  maxHeight: ['100vh', '100dvh'],\n  boxSizing: 'border-box',\n  backgroundColor: tokens.colorNeutralBackground1,\n  color: tokens.colorNeutralForeground1,\n  // Same styles as DialogSurfaceMotion last keyframe,\n  // to ensure dialog will be properly styled when surfaceMotion is opted-out\n  boxShadow: tokens.shadow64,\n\n  [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n    maxWidth: '100vw',\n  },\n\n  [DIALOG_MEDIA_QUERY_SHORT_SCREEN]: {\n    overflowY: 'auto',\n    // We need to offset the scrollbar by adding transparent borders otherwise\n    // it conflicts with the border radius.\n    paddingRight: `calc(${SURFACE_PADDING} - ${DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET})`,\n    borderRightWidth: DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n    borderTopWidth: DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n    borderBottomWidth: DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n  },\n});\n\nconst useBackdropBaseStyle = makeResetStyles({\n  inset: '0px',\n  backgroundColor: tokens.colorBackgroundOverlay,\n  position: 'fixed',\n});\n\nconst useStyles = makeStyles({\n  nestedDialogBackdrop: {\n    backgroundColor: tokens.colorTransparentBackground,\n  },\n});\n\n/**\n * Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = (state: DialogSurfaceState): DialogSurfaceState => {\n  'use no memo';\n\n  const { isNestedDialog, root, backdrop } = state;\n\n  const rootBaseStyle = useRootBaseStyle();\n\n  const backdropBaseStyle = useBackdropBaseStyle();\n  const styles = useStyles();\n\n  root.className = mergeClasses(dialogSurfaceClassNames.root, rootBaseStyle, root.className);\n\n  if (backdrop) {\n    backdrop.className = mergeClasses(\n      dialogSurfaceClassNames.backdrop,\n      backdropBaseStyle,\n      isNestedDialog && styles.nestedDialogBackdrop,\n      backdrop.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","createFocusOutlineStyle","DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","DIALOG_MEDIA_QUERY_SHORT_SCREEN","SURFACE_BORDER_WIDTH","SURFACE_PADDING","dialogSurfaceClassNames","root","backdrop","useRootBaseStyle","inset","padding","margin","borderStyle","overflow","border","colorTransparentStroke","borderRadius","borderRadiusXLarge","display","userSelect","visibility","position","height","maxWidth","maxHeight","boxSizing","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxShadow","shadow64","overflowY","paddingRight","borderRightWidth","borderTopWidth","borderBottomWidth","useBackdropBaseStyle","colorBackgroundOverlay","useStyles","nestedDialogBackdrop","colorTransparentBackground","useDialogSurfaceStyles_unstable","state","isNestedDialog","rootBaseStyle","backdropBaseStyle","styles","className"],"mappings":"AAAA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAE3E,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SACEC,yCAAyC,EACzCC,sCAAsC,EACtCC,+BAA+B,EAC/BC,oBAAoB,EACpBC,eAAe,QACV,iBAAiB;AAGxB,OAAO,MAAMC,0BAAsF;IACjGC,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF;;CAEC,GACD,MAAMC,mBAAmBb,gBAAgB;IACvC,GAAGI,yBAAyB;IAC5BU,OAAO;IACPC,SAASN;IACTO,QAAQ;IACRC,aAAa;IACbC,UAAU;IACVC,QAAQ,GAAGX,qBAAqB,OAAO,EAAEL,OAAOiB,sBAAsB,EAAE;IACxEC,cAAclB,OAAOmB,kBAAkB;IAEvCC,SAAS;IACTC,YAAY;IACZC,YAAY;IACZC,UAAU;IACVC,QAAQ;IACRC,UAAU;IACVC,WAAW;QAAC;QAAS;KAAS;IAC9BC,WAAW;IACXC,iBAAiB5B,OAAO6B,uBAAuB;IAC/CC,OAAO9B,OAAO+B,uBAAuB;IACrC,oDAAoD;IACpD,2EAA2E;IAC3EC,WAAWhC,OAAOiC,QAAQ;IAE1B,CAAC9B,uCAAuC,EAAE;QACxCsB,UAAU;IACZ;IAEA,CAACrB,gCAAgC,EAAE;QACjC8B,WAAW;QACX,0EAA0E;QAC1E,uCAAuC;QACvCC,cAAc,CAAC,KAAK,EAAE7B,gBAAgB,GAAG,EAAEJ,0CAA0C,CAAC,CAAC;QACvFkC,kBAAkBlC;QAClBmC,gBAAgBnC;QAChBoC,mBAAmBpC;IACrB;AACF;AAEA,MAAMqC,uBAAuB1C,gBAAgB;IAC3Cc,OAAO;IACPiB,iBAAiB5B,OAAOwC,sBAAsB;IAC9CjB,UAAU;AACZ;AAEA,MAAMkB,YAAY3C,WAAW;IAC3B4C,sBAAsB;QACpBd,iBAAiB5B,OAAO2C,0BAA0B;IACpD;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9C;IAEA,MAAM,EAAEC,cAAc,EAAEtC,IAAI,EAAEC,QAAQ,EAAE,GAAGoC;IAE3C,MAAME,gBAAgBrC;IAEtB,MAAMsC,oBAAoBT;IAC1B,MAAMU,SAASR;IAEfjC,KAAK0C,SAAS,GAAGnD,aAAaQ,wBAAwBC,IAAI,EAAEuC,eAAevC,KAAK0C,SAAS;IAEzF,IAAIzC,UAAU;QACZA,SAASyC,SAAS,GAAGnD,aACnBQ,wBAAwBE,QAAQ,EAChCuC,mBACAF,kBAAkBG,OAAOP,oBAAoB,EAC7CjC,SAASyC,SAAS;IAEtB;IAEA,OAAOL;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DialogSurface/useDialogSurfaceStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport {\n  DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n  DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR,\n  DIALOG_MEDIA_QUERY_SHORT_SCREEN,\n  SURFACE_BORDER_WIDTH,\n  SURFACE_PADDING,\n} from '../../contexts';\nimport type { DialogSurfaceSlots, DialogSurfaceState } from './DialogSurface.types';\n\nexport const dialogSurfaceClassNames: SlotClassNames<Omit<DialogSurfaceSlots, 'backdropMotion'>> = {\n  root: 'fui-DialogSurface',\n  backdrop: 'fui-DialogSurface__backdrop',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootBaseStyle = makeResetStyles({\n  ...createFocusOutlineStyle(),\n  inset: 0,\n  padding: SURFACE_PADDING,\n  margin: 'auto',\n  borderStyle: 'none',\n  overflow: 'unset',\n  border: `${SURFACE_BORDER_WIDTH} solid ${tokens.colorTransparentStroke}`,\n  borderRadius: tokens.borderRadiusXLarge,\n\n  display: 'block',\n  userSelect: 'unset',\n  visibility: 'unset',\n  position: 'fixed',\n  height: 'fit-content',\n  maxWidth: '600px',\n  maxHeight: ['100vh', '100dvh'],\n  boxSizing: 'border-box',\n  backgroundColor: tokens.colorNeutralBackground1,\n  color: tokens.colorNeutralForeground1,\n  // Same styles as DialogSurfaceMotion last keyframe,\n  // to ensure dialog will be properly styled when surfaceMotion is opted-out\n  boxShadow: tokens.shadow64,\n\n  [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n    maxWidth: '100vw',\n  },\n\n  [DIALOG_MEDIA_QUERY_SHORT_SCREEN]: {\n    overflowY: 'auto',\n    // We need to offset the scrollbar by adding transparent borders otherwise\n    // it conflicts with the border radius.\n    paddingRight: `calc(${SURFACE_PADDING} - ${DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET})`,\n    borderRightWidth: DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n    borderTopWidth: DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n    borderBottomWidth: DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET,\n  },\n});\n\nconst useBackdropBaseStyle = makeResetStyles({\n  inset: '0px',\n  backgroundColor: tokens.colorBackgroundOverlay,\n  position: 'fixed',\n});\n\nconst useStyles = makeStyles({\n  nestedDialogBackdrop: {\n    backgroundColor: tokens.colorTransparentBackground,\n  },\n});\n\n/**\n * Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = (state: DialogSurfaceState): DialogSurfaceState => {\n  'use no memo';\n\n  const { isNestedDialog, root, backdrop } = state;\n\n  const rootBaseStyle = useRootBaseStyle();\n\n  const backdropBaseStyle = useBackdropBaseStyle();\n  const styles = useStyles();\n\n  root.className = mergeClasses(dialogSurfaceClassNames.root, rootBaseStyle, root.className);\n\n  if (backdrop) {\n    backdrop.className = mergeClasses(\n      dialogSurfaceClassNames.backdrop,\n      backdropBaseStyle,\n      isNestedDialog && styles.nestedDialogBackdrop,\n      backdrop.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","createFocusOutlineStyle","DIALOG_FULLSCREEN_DIALOG_SCROLLBAR_OFFSET","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","DIALOG_MEDIA_QUERY_SHORT_SCREEN","SURFACE_BORDER_WIDTH","SURFACE_PADDING","dialogSurfaceClassNames","root","backdrop","useRootBaseStyle","inset","padding","margin","borderStyle","overflow","border","colorTransparentStroke","borderRadius","borderRadiusXLarge","display","userSelect","visibility","position","height","maxWidth","maxHeight","boxSizing","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground1","boxShadow","shadow64","overflowY","paddingRight","borderRightWidth","borderTopWidth","borderBottomWidth","useBackdropBaseStyle","colorBackgroundOverlay","useStyles","nestedDialogBackdrop","colorTransparentBackground","useDialogSurfaceStyles_unstable","state","isNestedDialog","rootBaseStyle","backdropBaseStyle","styles","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAE3E,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SACEC,yCAAyC,EACzCC,sCAAsC,EACtCC,+BAA+B,EAC/BC,oBAAoB,EACpBC,eAAe,QACV,iBAAiB;AAGxB,OAAO,MAAMC,0BAAsF;IACjGC,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF;;CAEC,GACD,MAAMC,mBAAmBb,gBAAgB;IACvC,GAAGI,yBAAyB;IAC5BU,OAAO;IACPC,SAASN;IACTO,QAAQ;IACRC,aAAa;IACbC,UAAU;IACVC,QAAQ,GAAGX,qBAAqB,OAAO,EAAEL,OAAOiB,sBAAsB,EAAE;IACxEC,cAAclB,OAAOmB,kBAAkB;IAEvCC,SAAS;IACTC,YAAY;IACZC,YAAY;IACZC,UAAU;IACVC,QAAQ;IACRC,UAAU;IACVC,WAAW;QAAC;QAAS;KAAS;IAC9BC,WAAW;IACXC,iBAAiB5B,OAAO6B,uBAAuB;IAC/CC,OAAO9B,OAAO+B,uBAAuB;IACrC,oDAAoD;IACpD,2EAA2E;IAC3EC,WAAWhC,OAAOiC,QAAQ;IAE1B,CAAC9B,uCAAuC,EAAE;QACxCsB,UAAU;IACZ;IAEA,CAACrB,gCAAgC,EAAE;QACjC8B,WAAW;QACX,0EAA0E;QAC1E,uCAAuC;QACvCC,cAAc,CAAC,KAAK,EAAE7B,gBAAgB,GAAG,EAAEJ,0CAA0C,CAAC,CAAC;QACvFkC,kBAAkBlC;QAClBmC,gBAAgBnC;QAChBoC,mBAAmBpC;IACrB;AACF;AAEA,MAAMqC,uBAAuB1C,gBAAgB;IAC3Cc,OAAO;IACPiB,iBAAiB5B,OAAOwC,sBAAsB;IAC9CjB,UAAU;AACZ;AAEA,MAAMkB,YAAY3C,WAAW;IAC3B4C,sBAAsB;QACpBd,iBAAiB5B,OAAO2C,0BAA0B;IACpD;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9C;IAEA,MAAM,EAAEC,cAAc,EAAEtC,IAAI,EAAEC,QAAQ,EAAE,GAAGoC;IAE3C,MAAME,gBAAgBrC;IAEtB,MAAMsC,oBAAoBT;IAC1B,MAAMU,SAASR;IAEfjC,KAAK0C,SAAS,GAAGnD,aAAaQ,wBAAwBC,IAAI,EAAEuC,eAAevC,KAAK0C,SAAS;IAEzF,IAAIzC,UAAU;QACZA,SAASyC,SAAS,GAAGnD,aACnBQ,wBAAwBE,QAAQ,EAChCuC,mBACAF,kBAAkBG,OAAOP,oBAAoB,EAC7CjC,SAASyC,SAAS;IAEtB;IAEA,OAAOL;AACT,EAAE"}

package/lib/components/DialogSurfaceMotion.js

@@ -1,25 +1,9 @@
-import { createPresenceComponent, motionTokens } from '@fluentui/react-motion';
-const keyframes = [
-    {
-        opacity: 0,
-        transform: 'scale(0.85) translateZ(0)'
-    },
-    {
-        transform: 'scale(1) translateZ(0)',
-        opacity: 1
-    }
-];
-export const DialogSurfaceMotion = createPresenceComponent({
-    enter: {
-        keyframes,
-        easing: motionTokens.curveDecelerateMid,
-        duration: motionTokens.durationGentle
-    },
-    exit: {
-        keyframes: [
-            ...keyframes
-        ].reverse(),
-        easing: motionTokens.curveAccelerateMin,
-        duration: motionTokens.durationGentle
-    }
+import { createPresenceComponentVariant, motionTokens } from '@fluentui/react-motion';
+import { Scale } from '@fluentui/react-motion-components-preview';
+export const DialogSurfaceMotion = createPresenceComponentVariant(Scale, {
+    fromScale: 0.85,
+    easing: motionTokens.curveDecelerateMid,
+    duration: motionTokens.durationGentle,
+    exitEasing: motionTokens.curveAccelerateMin,
+    exitDuration: motionTokens.durationGentle
 });

package/lib/components/DialogSurfaceMotion.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogSurfaceMotion.ts"],"sourcesContent":["import { createPresenceComponent, motionTokens } from '@fluentui/react-motion';\n\nconst keyframes = [\n  {\n    opacity: 0,\n    transform: 'scale(0.85) translateZ(0)',\n  },\n  {\n    transform: 'scale(1) translateZ(0)',\n    opacity: 1,\n  },\n];\n\nexport const DialogSurfaceMotion = createPresenceComponent({\n  enter: {\n    keyframes,\n    easing: motionTokens.curveDecelerateMid,\n    duration: motionTokens.durationGentle,\n  },\n  exit: {\n    keyframes: [...keyframes].reverse(),\n    easing: motionTokens.curveAccelerateMin,\n    duration: motionTokens.durationGentle,\n  },\n});\n"],"names":["createPresenceComponent","motionTokens","keyframes","opacity","transform","DialogSurfaceMotion","enter","easing","curveDecelerateMid","duration","durationGentle","exit","reverse","curveAccelerateMin"],"mappings":"AAAA,SAASA,uBAAuB,EAAEC,YAAY,QAAQ,yBAAyB;AAE/E,MAAMC,YAAY;IAChB;QACEC,SAAS;QACTC,WAAW;IACb;IACA;QACEA,WAAW;QACXD,SAAS;IACX;CACD;AAED,OAAO,MAAME,sBAAsBL,wBAAwB;IACzDM,OAAO;QACLJ;QACAK,QAAQN,aAAaO,kBAAkB;QACvCC,UAAUR,aAAaS,cAAc;IACvC;IACAC,MAAM;QACJT,WAAW;eAAIA;SAAU,CAACU,OAAO;QACjCL,QAAQN,aAAaY,kBAAkB;QACvCJ,UAAUR,aAAaS,cAAc;IACvC;AACF,GAAG"}
+{"version":3,"sources":["../src/components/DialogSurfaceMotion.ts"],"sourcesContent":["import { createPresenceComponentVariant, motionTokens } from '@fluentui/react-motion';\nimport { Scale } from '@fluentui/react-motion-components-preview';\n\nexport const DialogSurfaceMotion = createPresenceComponentVariant(Scale, {\n  fromScale: 0.85,\n  easing: motionTokens.curveDecelerateMid,\n  duration: motionTokens.durationGentle,\n  exitEasing: motionTokens.curveAccelerateMin,\n  exitDuration: motionTokens.durationGentle,\n});\n"],"names":["createPresenceComponentVariant","motionTokens","Scale","DialogSurfaceMotion","fromScale","easing","curveDecelerateMid","duration","durationGentle","exitEasing","curveAccelerateMin","exitDuration"],"mappings":"AAAA,SAASA,8BAA8B,EAAEC,YAAY,QAAQ,yBAAyB;AACtF,SAASC,KAAK,QAAQ,4CAA4C;AAElE,OAAO,MAAMC,sBAAsBH,+BAA+BE,OAAO;IACvEE,WAAW;IACXC,QAAQJ,aAAaK,kBAAkB;IACvCC,UAAUN,aAAaO,cAAc;IACrCC,YAAYR,aAAaS,kBAAkB;IAC3CC,cAAcV,aAAaO,cAAc;AAC3C,GAAG"}

package/lib/components/DialogTitle/DialogTitle.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useDialogTitle_unstable } from './useDialogTitle';
 import { renderDialogTitle_unstable } from './renderDialogTitle';

package/lib/components/DialogTitle/DialogTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTitle/DialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogTitle_unstable } from './useDialogTitle';\nimport { renderDialogTitle_unstable } from './renderDialogTitle';\nimport { useDialogTitleStyles_unstable } from './useDialogTitleStyles.styles';\nimport type { DialogTitleProps } from './DialogTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * The `DialogTitle` component expects to have a title/header\n * and when `Dialog` is `non-modal` a close (X icon) button is provided through `action` slot by default.\n */\nexport const DialogTitle: ForwardRefComponent<DialogTitleProps> = React.forwardRef((props, ref) => {\n  const state = useDialogTitle_unstable(props, ref);\n\n  useDialogTitleStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDialogTitleStyles_unstable')(state);\n\n  return renderDialogTitle_unstable(state);\n});\n\nDialogTitle.displayName = 'DialogTitle';\n"],"names":["React","useDialogTitle_unstable","renderDialogTitle_unstable","useDialogTitleStyles_unstable","useCustomStyleHook_unstable","DialogTitle","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CL,8BAA8BM;IAE9BL,4BAA4B,iCAAiCK;IAE7D,OAAOP,2BAA2BO;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/DialogTitle/DialogTitle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDialogTitle_unstable } from './useDialogTitle';\nimport { renderDialogTitle_unstable } from './renderDialogTitle';\nimport { useDialogTitleStyles_unstable } from './useDialogTitleStyles.styles';\nimport type { DialogTitleProps } from './DialogTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * The `DialogTitle` component expects to have a title/header\n * and when `Dialog` is `non-modal` a close (X icon) button is provided through `action` slot by default.\n */\nexport const DialogTitle: ForwardRefComponent<DialogTitleProps> = React.forwardRef((props, ref) => {\n  const state = useDialogTitle_unstable(props, ref);\n\n  useDialogTitleStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDialogTitleStyles_unstable')(state);\n\n  return renderDialogTitle_unstable(state);\n});\n\nDialogTitle.displayName = 'DialogTitle';\n"],"names":["React","useDialogTitle_unstable","renderDialogTitle_unstable","useDialogTitleStyles_unstable","useCustomStyleHook_unstable","DialogTitle","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAE7CL,8BAA8BM;IAE9BL,4BAA4B,iCAAiCK;IAE7D,OAAOP,2BAA2BO;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}

package/lib/components/DialogTitle/renderDialogTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTitle/renderDialogTitle.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DialogTitleState, DialogTitleSlots } from './DialogTitle.types';\n\n/**\n * Render the final JSX of DialogTitle\n */\nexport const renderDialogTitle_unstable = (state: DialogTitleState) => {\n  assertSlots<DialogTitleSlots>(state);\n\n  return (\n    <>\n      <state.root>{state.root.children}</state.root>\n      {state.action && <state.action />}\n    </>\n  );\n};\n"],"names":["assertSlots","renderDialogTitle_unstable","state","root","children","action"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCF,YAA8BE;IAE9B,qBACE;;0BACE,KAACA,MAAMC,IAAI;0BAAED,MAAMC,IAAI,CAACC,QAAQ;;YAC/BF,MAAMG,MAAM,kBAAI,KAACH,MAAMG,MAAM;;;AAGpC,EAAE"}
+{"version":3,"sources":["../src/components/DialogTitle/renderDialogTitle.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DialogTitleState, DialogTitleSlots } from './DialogTitle.types';\n\n/**\n * Render the final JSX of DialogTitle\n */\nexport const renderDialogTitle_unstable = (state: DialogTitleState): JSXElement => {\n  assertSlots<DialogTitleSlots>(state);\n\n  return (\n    <>\n      <state.root>{state.root.children}</state.root>\n      {state.action && <state.action />}\n    </>\n  );\n};\n"],"names":["assertSlots","renderDialogTitle_unstable","state","root","children","action"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCF,YAA8BE;IAE9B,qBACE;;0BACE,KAACA,MAAMC,IAAI;0BAAED,MAAMC,IAAI,CAACC,QAAQ;;YAC/BF,MAAMG,MAAM,kBAAI,KAACH,MAAMG,MAAM;;;AAGpC,EAAE"}

package/lib/components/DialogTitle/useDialogTitle.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
 import { useDialogContext_unstable } from '../../contexts/dialogContext';

package/lib/components/DialogTitle/useDialogTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTitle/useDialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { DialogTitleProps, DialogTitleState } from './DialogTitle.types';\nimport { useDialogContext_unstable } from '../../contexts/dialogContext';\nimport { Dismiss20Regular } from '@fluentui/react-icons';\nimport { DialogTrigger } from '../DialogTrigger/DialogTrigger';\nimport { useDialogTitleInternalStyles } from './useDialogTitleStyles.styles';\n\n/**\n * Create the state required to render DialogTitle.\n *\n * The returned state can be modified with hooks such as useDialogTitleStyles_unstable,\n * before being passed to renderDialogTitle_unstable.\n *\n * @param props - props from this instance of DialogTitle\n * @param ref - reference to root HTMLElement of DialogTitle\n */\nexport const useDialogTitle_unstable = (props: DialogTitleProps, ref: React.Ref<HTMLDivElement>): DialogTitleState => {\n  const { action } = props;\n  const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n  const internalStyles = useDialogTitleInternalStyles();\n\n  return {\n    components: {\n      root: 'h2',\n      action: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('h2', {\n        ref,\n        id: useDialogContext_unstable(ctx => ctx.dialogTitleId),\n        ...props,\n      }),\n      { elementType: 'h2' },\n    ),\n    action: slot.optional(action, {\n      renderByDefault: modalType === 'non-modal',\n      defaultProps: {\n        children: (\n          <DialogTrigger disableButtonEnhancement action=\"close\">\n            <button\n              type=\"button\"\n              className={internalStyles}\n              // TODO: find a better way to add internal labels\n              aria-label=\"close\"\n            >\n              <Dismiss20Regular />\n            </button>\n          </DialogTrigger>\n        ),\n      },\n      elementType: 'div',\n    }),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useDialogContext_unstable","Dismiss20Regular","DialogTrigger","useDialogTitleInternalStyles","useDialogTitle_unstable","props","ref","action","modalType","ctx","internalStyles","components","root","always","id","dialogTitleId","elementType","optional","renderByDefault","defaultProps","children","disableButtonEnhancement","button","type","className","aria-label"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,yBAAyB,QAAQ,+BAA+B;AACzE,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,4BAA4B,QAAQ,gCAAgC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC;IAC/D,MAAM,EAAEC,MAAM,EAAE,GAAGF;IACnB,MAAMG,YAAYR,0BAA0BS,CAAAA,MAAOA,IAAID,SAAS;IAChE,MAAME,iBAAiBP;IAEvB,OAAO;QACLQ,YAAY;YACVC,MAAM;YACNL,QAAQ;QACV;QACAK,MAAMb,KAAKc,MAAM,CACff,yBAAyB,MAAM;YAC7BQ;YACAQ,IAAId,0BAA0BS,CAAAA,MAAOA,IAAIM,aAAa;YACtD,GAAGV,KAAK;QACV,IACA;YAAEW,aAAa;QAAK;QAEtBT,QAAQR,KAAKkB,QAAQ,CAACV,QAAQ;YAC5BW,iBAAiBV,cAAc;YAC/BW,cAAc;gBACZC,wBACE,oBAAClB;oBAAcmB,0BAAAA;oBAAyBd,QAAO;iCAC7C,oBAACe;oBACCC,MAAK;oBACLC,WAAWd;oBACX,iDAAiD;oBACjDe,cAAW;iCAEX,oBAACxB;YAIT;YACAe,aAAa;QACf;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/DialogTitle/useDialogTitle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { DialogTitleProps, DialogTitleState } from './DialogTitle.types';\nimport { useDialogContext_unstable } from '../../contexts/dialogContext';\nimport { Dismiss20Regular } from '@fluentui/react-icons';\nimport { DialogTrigger } from '../DialogTrigger/DialogTrigger';\nimport { useDialogTitleInternalStyles } from './useDialogTitleStyles.styles';\n\n/**\n * Create the state required to render DialogTitle.\n *\n * The returned state can be modified with hooks such as useDialogTitleStyles_unstable,\n * before being passed to renderDialogTitle_unstable.\n *\n * @param props - props from this instance of DialogTitle\n * @param ref - reference to root HTMLElement of DialogTitle\n */\nexport const useDialogTitle_unstable = (props: DialogTitleProps, ref: React.Ref<HTMLDivElement>): DialogTitleState => {\n  const { action } = props;\n  const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n  const internalStyles = useDialogTitleInternalStyles();\n\n  return {\n    components: {\n      root: 'h2',\n      action: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('h2', {\n        ref,\n        id: useDialogContext_unstable(ctx => ctx.dialogTitleId),\n        ...props,\n      }),\n      { elementType: 'h2' },\n    ),\n    action: slot.optional(action, {\n      renderByDefault: modalType === 'non-modal',\n      defaultProps: {\n        children: (\n          <DialogTrigger disableButtonEnhancement action=\"close\">\n            <button\n              type=\"button\"\n              className={internalStyles}\n              // TODO: find a better way to add internal labels\n              aria-label=\"close\"\n            >\n              <Dismiss20Regular />\n            </button>\n          </DialogTrigger>\n        ),\n      },\n      elementType: 'div',\n    }),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useDialogContext_unstable","Dismiss20Regular","DialogTrigger","useDialogTitleInternalStyles","useDialogTitle_unstable","props","ref","action","modalType","ctx","internalStyles","components","root","always","id","dialogTitleId","elementType","optional","renderByDefault","defaultProps","children","disableButtonEnhancement","button","type","className","aria-label"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,yBAAyB,QAAQ,+BAA+B;AACzE,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,4BAA4B,QAAQ,gCAAgC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC;IAC/D,MAAM,EAAEC,MAAM,EAAE,GAAGF;IACnB,MAAMG,YAAYR,0BAA0BS,CAAAA,MAAOA,IAAID,SAAS;IAChE,MAAME,iBAAiBP;IAEvB,OAAO;QACLQ,YAAY;YACVC,MAAM;YACNL,QAAQ;QACV;QACAK,MAAMb,KAAKc,MAAM,CACff,yBAAyB,MAAM;YAC7BQ;YACAQ,IAAId,0BAA0BS,CAAAA,MAAOA,IAAIM,aAAa;YACtD,GAAGV,KAAK;QACV,IACA;YAAEW,aAAa;QAAK;QAEtBT,QAAQR,KAAKkB,QAAQ,CAACV,QAAQ;YAC5BW,iBAAiBV,cAAc;YAC/BW,cAAc;gBACZC,wBACE,oBAAClB;oBAAcmB,0BAAAA;oBAAyBd,QAAO;iCAC7C,oBAACe;oBACCC,MAAK;oBACLC,WAAWd;oBACX,iDAAiD;oBACjDe,cAAW;iCAEX,oBAACxB;YAIT;YACAe,aAAa;QACf;IACF;AACF,EAAE"}

package/lib/components/DialogTitle/useDialogTitleStyles.styles.js

@@ -1,3 +1,5 @@
+'use client';
+
 import { __resetStyles, __styles, mergeClasses } from '@griffel/react';
 import { typographyStyles } from '@fluentui/react-theme';
 import { createFocusOutlineStyle } from '@fluentui/react-tabster';

package/lib/components/DialogTitle/useDialogTitleStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__resetStyles","__styles","mergeClasses","typographyStyles","createFocusOutlineStyle","dialogTitleClassNames","root","action","useRootResetStyles","useStyles","rootWithoutAction","Bw0ie65","d","useActionResetStyles","useDialogTitleInternalStyles","r","s","useDialogTitleStyles_unstable","state","rootResetStyles","actionResetStyles","styles","className"],"sources":["useDialogTitleStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nexport const dialogTitleClassNames = {\n    root: 'fui-DialogTitle',\n    action: 'fui-DialogTitle__action'\n};\n/**\n * Styles for the root slot\n */ const useRootResetStyles = makeResetStyles({\n    ...typographyStyles.subtitle1,\n    margin: 0,\n    gridRowStart: 1,\n    gridRowEnd: 1,\n    gridColumnStart: 1,\n    gridColumnEnd: 3\n});\nconst useStyles = makeStyles({\n    rootWithoutAction: {\n        gridColumnEnd: 4\n    }\n});\n/**\n * Styles for the action slot\n */ const useActionResetStyles = makeResetStyles({\n    gridRowStart: 1,\n    gridRowEnd: 1,\n    gridColumnStart: 3,\n    justifySelf: 'end',\n    alignSelf: 'start'\n});\n/**\n * Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n */ export const useDialogTitleInternalStyles = makeResetStyles({\n    ...createFocusOutlineStyle(),\n    overflow: 'visible',\n    padding: 0,\n    borderStyle: 'none',\n    position: 'relative',\n    boxSizing: 'content-box',\n    backgroundColor: 'inherit',\n    color: 'inherit',\n    fontFamily: 'inherit',\n    fontSize: 'inherit',\n    cursor: 'pointer',\n    lineHeight: 0,\n    WebkitAppearance: 'button',\n    textAlign: 'unset'\n});\n/**\n * Apply styling to the DialogTitle slots based on the state\n */ export const useDialogTitleStyles_unstable = (state)=>{\n    'use no memo';\n    const rootResetStyles = useRootResetStyles();\n    const actionResetStyles = useActionResetStyles();\n    const styles = useStyles();\n    state.root.className = mergeClasses(dialogTitleClassNames.root, rootResetStyles, !state.action && styles.rootWithoutAction, state.root.className);\n    if (state.action) {\n        state.action.className = mergeClasses(dialogTitleClassNames.action, actionResetStyles, state.action.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE,iBAAiB;EACvBC,MAAM,EAAE;AACZ,CAAC;AACD;AACA;AACA;AAAI,MAAMC,kBAAkB,gBAAGR,aAAA,6PAO9B,CAAC;AACF,MAAMS,SAAS,gBAAGR,QAAA;EAAAS,iBAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIjB,CAAC;AACF;AACA;AACA;AAAI,MAAMC,oBAAoB,gBAAGb,aAAA,wHAMhC,CAAC;AACF;AACA;AACA;AACA;AAAI,OAAO,MAAMc,4BAA4B,gBAAGd,aAAA;EAAAe,CAAA;EAAAC,CAAA;AAAA,CAe/C,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,eAAe,GAAGX,kBAAkB,CAAC,CAAC;EAC5C,MAAMY,iBAAiB,GAAGP,oBAAoB,CAAC,CAAC;EAChD,MAAMQ,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1BS,KAAK,CAACZ,IAAI,CAACgB,SAAS,GAAGpB,YAAY,CAACG,qBAAqB,CAACC,IAAI,EAAEa,eAAe,EAAE,CAACD,KAAK,CAACX,MAAM,IAAIc,MAAM,CAACX,iBAAiB,EAAEQ,KAAK,CAACZ,IAAI,CAACgB,SAAS,CAAC;EACjJ,IAAIJ,KAAK,CAACX,MAAM,EAAE;IACdW,KAAK,CAACX,MAAM,CAACe,SAAS,GAAGpB,YAAY,CAACG,qBAAqB,CAACE,MAAM,EAAEa,iBAAiB,EAAEF,KAAK,CAACX,MAAM,CAACe,SAAS,CAAC;EAClH;EACA,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["__resetStyles","__styles","mergeClasses","typographyStyles","createFocusOutlineStyle","dialogTitleClassNames","root","action","useRootResetStyles","useStyles","rootWithoutAction","Bw0ie65","d","useActionResetStyles","useDialogTitleInternalStyles","r","s","useDialogTitleStyles_unstable","state","rootResetStyles","actionResetStyles","styles","className"],"sources":["useDialogTitleStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { typographyStyles } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nexport const dialogTitleClassNames = {\n    root: 'fui-DialogTitle',\n    action: 'fui-DialogTitle__action'\n};\n/**\n * Styles for the root slot\n */ const useRootResetStyles = makeResetStyles({\n    ...typographyStyles.subtitle1,\n    margin: 0,\n    gridRowStart: 1,\n    gridRowEnd: 1,\n    gridColumnStart: 1,\n    gridColumnEnd: 3\n});\nconst useStyles = makeStyles({\n    rootWithoutAction: {\n        gridColumnEnd: 4\n    }\n});\n/**\n * Styles for the action slot\n */ const useActionResetStyles = makeResetStyles({\n    gridRowStart: 1,\n    gridRowEnd: 1,\n    gridColumnStart: 3,\n    justifySelf: 'end',\n    alignSelf: 'start'\n});\n/**\n * Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n */ export const useDialogTitleInternalStyles = makeResetStyles({\n    ...createFocusOutlineStyle(),\n    overflow: 'visible',\n    padding: 0,\n    borderStyle: 'none',\n    position: 'relative',\n    boxSizing: 'content-box',\n    backgroundColor: 'inherit',\n    color: 'inherit',\n    fontFamily: 'inherit',\n    fontSize: 'inherit',\n    cursor: 'pointer',\n    lineHeight: 0,\n    WebkitAppearance: 'button',\n    textAlign: 'unset'\n});\n/**\n * Apply styling to the DialogTitle slots based on the state\n */ export const useDialogTitleStyles_unstable = (state)=>{\n    'use no memo';\n    const rootResetStyles = useRootResetStyles();\n    const actionResetStyles = useActionResetStyles();\n    const styles = useStyles();\n    state.root.className = mergeClasses(dialogTitleClassNames.root, rootResetStyles, !state.action && styles.rootWithoutAction, state.root.className);\n    if (state.action) {\n        state.action.className = mergeClasses(dialogTitleClassNames.action, actionResetStyles, state.action.className);\n    }\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,OAAO,MAAMC,qBAAqB,GAAG;EACjCC,IAAI,EAAE,iBAAiB;EACvBC,MAAM,EAAE;AACZ,CAAC;AACD;AACA;AACA;AAAI,MAAMC,kBAAkB,gBAAGR,aAAA,6PAO9B,CAAC;AACF,MAAMS,SAAS,gBAAGR,QAAA;EAAAS,iBAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIjB,CAAC;AACF;AACA;AACA;AAAI,MAAMC,oBAAoB,gBAAGb,aAAA,wHAMhC,CAAC;AACF;AACA;AACA;AACA;AAAI,OAAO,MAAMc,4BAA4B,gBAAGd,aAAA;EAAAe,CAAA;EAAAC,CAAA;AAAA,CAe/C,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,6BAA6B,GAAIC,KAAK,IAAG;EACtD,aAAa;;EACb,MAAMC,eAAe,GAAGX,kBAAkB,CAAC,CAAC;EAC5C,MAAMY,iBAAiB,GAAGP,oBAAoB,CAAC,CAAC;EAChD,MAAMQ,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1BS,KAAK,CAACZ,IAAI,CAACgB,SAAS,GAAGpB,YAAY,CAACG,qBAAqB,CAACC,IAAI,EAAEa,eAAe,EAAE,CAACD,KAAK,CAACX,MAAM,IAAIc,MAAM,CAACX,iBAAiB,EAAEQ,KAAK,CAACZ,IAAI,CAACgB,SAAS,CAAC;EACjJ,IAAIJ,KAAK,CAACX,MAAM,EAAE;IACdW,KAAK,CAACX,MAAM,CAACe,SAAS,GAAGpB,YAAY,CAACG,qBAAqB,CAACE,MAAM,EAAEa,iBAAiB,EAAEF,KAAK,CAACX,MAAM,CAACe,SAAS,CAAC;EAClH;EACA,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/DialogTitle/useDialogTitleStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';
 import { typographyStyles } from '@fluentui/react-theme';
 import { createFocusOutlineStyle } from '@fluentui/react-tabster';

package/lib/components/DialogTitle/useDialogTitleStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTitle/useDialogTitleStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { DialogTitleSlots, DialogTitleState } from './DialogTitle.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\n\nexport const dialogTitleClassNames: SlotClassNames<DialogTitleSlots> = {\n  root: 'fui-DialogTitle',\n  action: 'fui-DialogTitle__action',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootResetStyles = makeResetStyles({\n  ...typographyStyles.subtitle1,\n  margin: 0,\n  gridRowStart: 1,\n  gridRowEnd: 1,\n  gridColumnStart: 1,\n  gridColumnEnd: 3,\n});\n\nconst useStyles = makeStyles({\n  rootWithoutAction: {\n    gridColumnEnd: 4,\n  },\n});\n\n/**\n * Styles for the action slot\n */\nconst useActionResetStyles = makeResetStyles({\n  gridRowStart: 1,\n  gridRowEnd: 1,\n  gridColumnStart: 3,\n  justifySelf: 'end',\n  alignSelf: 'start',\n});\n\n/**\n * Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n */\nexport const useDialogTitleInternalStyles = makeResetStyles({\n  ...createFocusOutlineStyle(),\n  overflow: 'visible',\n  padding: 0,\n  borderStyle: 'none',\n  position: 'relative',\n  boxSizing: 'content-box',\n  backgroundColor: 'inherit',\n  color: 'inherit',\n  fontFamily: 'inherit',\n  fontSize: 'inherit',\n  cursor: 'pointer',\n  lineHeight: 0,\n  WebkitAppearance: 'button',\n  textAlign: 'unset',\n});\n\n/**\n * Apply styling to the DialogTitle slots based on the state\n */\nexport const useDialogTitleStyles_unstable = (state: DialogTitleState): DialogTitleState => {\n  'use no memo';\n\n  const rootResetStyles = useRootResetStyles();\n  const actionResetStyles = useActionResetStyles();\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(\n    dialogTitleClassNames.root,\n    rootResetStyles,\n    !state.action && styles.rootWithoutAction,\n    state.root.className,\n  );\n\n  if (state.action) {\n    state.action.className = mergeClasses(dialogTitleClassNames.action, actionResetStyles, state.action.className);\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","typographyStyles","createFocusOutlineStyle","dialogTitleClassNames","root","action","useRootResetStyles","subtitle1","margin","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","useStyles","rootWithoutAction","useActionResetStyles","justifySelf","alignSelf","useDialogTitleInternalStyles","overflow","padding","borderStyle","position","boxSizing","backgroundColor","color","fontFamily","fontSize","cursor","lineHeight","WebkitAppearance","textAlign","useDialogTitleStyles_unstable","state","rootResetStyles","actionResetStyles","styles","className"],"mappings":"AAAA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG3E,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,uBAAuB,QAAQ,0BAA0B;AAElE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;IACNC,QAAQ;AACV,EAAE;AAEF;;CAEC,GACD,MAAMC,qBAAqBR,gBAAgB;IACzC,GAAGG,iBAAiBM,SAAS;IAC7BC,QAAQ;IACRC,cAAc;IACdC,YAAY;IACZC,iBAAiB;IACjBC,eAAe;AACjB;AAEA,MAAMC,YAAYd,WAAW;IAC3Be,mBAAmB;QACjBF,eAAe;IACjB;AACF;AAEA;;CAEC,GACD,MAAMG,uBAAuBjB,gBAAgB;IAC3CW,cAAc;IACdC,YAAY;IACZC,iBAAiB;IACjBK,aAAa;IACbC,WAAW;AACb;AAEA;;;CAGC,GACD,OAAO,MAAMC,+BAA+BpB,gBAAgB;IAC1D,GAAGI,yBAAyB;IAC5BiB,UAAU;IACVC,SAAS;IACTC,aAAa;IACbC,UAAU;IACVC,WAAW;IACXC,iBAAiB;IACjBC,OAAO;IACPC,YAAY;IACZC,UAAU;IACVC,QAAQ;IACRC,YAAY;IACZC,kBAAkB;IAClBC,WAAW;AACb,GAAG;AAEH;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,kBAAkB5B;IACxB,MAAM6B,oBAAoBpB;IAC1B,MAAMqB,SAASvB;IAEfoB,MAAM7B,IAAI,CAACiC,SAAS,GAAGrC,aACrBG,sBAAsBC,IAAI,EAC1B8B,iBACA,CAACD,MAAM5B,MAAM,IAAI+B,OAAOtB,iBAAiB,EACzCmB,MAAM7B,IAAI,CAACiC,SAAS;IAGtB,IAAIJ,MAAM5B,MAAM,EAAE;QAChB4B,MAAM5B,MAAM,CAACgC,SAAS,GAAGrC,aAAaG,sBAAsBE,MAAM,EAAE8B,mBAAmBF,MAAM5B,MAAM,CAACgC,SAAS;IAC/G;IAEA,OAAOJ;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DialogTitle/useDialogTitleStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { DialogTitleSlots, DialogTitleState } from './DialogTitle.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\n\nexport const dialogTitleClassNames: SlotClassNames<DialogTitleSlots> = {\n  root: 'fui-DialogTitle',\n  action: 'fui-DialogTitle__action',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootResetStyles = makeResetStyles({\n  ...typographyStyles.subtitle1,\n  margin: 0,\n  gridRowStart: 1,\n  gridRowEnd: 1,\n  gridColumnStart: 1,\n  gridColumnEnd: 3,\n});\n\nconst useStyles = makeStyles({\n  rootWithoutAction: {\n    gridColumnEnd: 4,\n  },\n});\n\n/**\n * Styles for the action slot\n */\nconst useActionResetStyles = makeResetStyles({\n  gridRowStart: 1,\n  gridRowEnd: 1,\n  gridColumnStart: 3,\n  justifySelf: 'end',\n  alignSelf: 'start',\n});\n\n/**\n * Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n */\nexport const useDialogTitleInternalStyles = makeResetStyles({\n  ...createFocusOutlineStyle(),\n  overflow: 'visible',\n  padding: 0,\n  borderStyle: 'none',\n  position: 'relative',\n  boxSizing: 'content-box',\n  backgroundColor: 'inherit',\n  color: 'inherit',\n  fontFamily: 'inherit',\n  fontSize: 'inherit',\n  cursor: 'pointer',\n  lineHeight: 0,\n  WebkitAppearance: 'button',\n  textAlign: 'unset',\n});\n\n/**\n * Apply styling to the DialogTitle slots based on the state\n */\nexport const useDialogTitleStyles_unstable = (state: DialogTitleState): DialogTitleState => {\n  'use no memo';\n\n  const rootResetStyles = useRootResetStyles();\n  const actionResetStyles = useActionResetStyles();\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(\n    dialogTitleClassNames.root,\n    rootResetStyles,\n    !state.action && styles.rootWithoutAction,\n    state.root.className,\n  );\n\n  if (state.action) {\n    state.action.className = mergeClasses(dialogTitleClassNames.action, actionResetStyles, state.action.className);\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","typographyStyles","createFocusOutlineStyle","dialogTitleClassNames","root","action","useRootResetStyles","subtitle1","margin","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","useStyles","rootWithoutAction","useActionResetStyles","justifySelf","alignSelf","useDialogTitleInternalStyles","overflow","padding","borderStyle","position","boxSizing","backgroundColor","color","fontFamily","fontSize","cursor","lineHeight","WebkitAppearance","textAlign","useDialogTitleStyles_unstable","state","rootResetStyles","actionResetStyles","styles","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG3E,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,uBAAuB,QAAQ,0BAA0B;AAElE,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;IACNC,QAAQ;AACV,EAAE;AAEF;;CAEC,GACD,MAAMC,qBAAqBR,gBAAgB;IACzC,GAAGG,iBAAiBM,SAAS;IAC7BC,QAAQ;IACRC,cAAc;IACdC,YAAY;IACZC,iBAAiB;IACjBC,eAAe;AACjB;AAEA,MAAMC,YAAYd,WAAW;IAC3Be,mBAAmB;QACjBF,eAAe;IACjB;AACF;AAEA;;CAEC,GACD,MAAMG,uBAAuBjB,gBAAgB;IAC3CW,cAAc;IACdC,YAAY;IACZC,iBAAiB;IACjBK,aAAa;IACbC,WAAW;AACb;AAEA;;;CAGC,GACD,OAAO,MAAMC,+BAA+BpB,gBAAgB;IAC1D,GAAGI,yBAAyB;IAC5BiB,UAAU;IACVC,SAAS;IACTC,aAAa;IACbC,UAAU;IACVC,WAAW;IACXC,iBAAiB;IACjBC,OAAO;IACPC,YAAY;IACZC,UAAU;IACVC,QAAQ;IACRC,YAAY;IACZC,kBAAkB;IAClBC,WAAW;AACb,GAAG;AAEH;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAMC,kBAAkB5B;IACxB,MAAM6B,oBAAoBpB;IAC1B,MAAMqB,SAASvB;IAEfoB,MAAM7B,IAAI,CAACiC,SAAS,GAAGrC,aACrBG,sBAAsBC,IAAI,EAC1B8B,iBACA,CAACD,MAAM5B,MAAM,IAAI+B,OAAOtB,iBAAiB,EACzCmB,MAAM7B,IAAI,CAACiC,SAAS;IAGtB,IAAIJ,MAAM5B,MAAM,EAAE;QAChB4B,MAAM5B,MAAM,CAACgC,SAAS,GAAGrC,aAAaG,sBAAsBE,MAAM,EAAE8B,mBAAmBF,MAAM5B,MAAM,CAACgC,SAAS;IAC/G;IAEA,OAAOJ;AACT,EAAE"}

package/lib/components/DialogTrigger/DialogTrigger.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useDialogTrigger_unstable } from './useDialogTrigger';
 import { renderDialogTrigger_unstable } from './renderDialogTrigger';

package/lib/components/DialogTrigger/DialogTrigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTrigger/DialogTrigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogTrigger_unstable } from './useDialogTrigger';\nimport { renderDialogTrigger_unstable } from './renderDialogTrigger';\nimport type { DialogTriggerProps } from './DialogTrigger.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/**\n * A non-visual component that wraps its child\n * and configures them to be the trigger that will open or close a `Dialog`.\n * This component should only accept one child.\n *\n * This component sole purpose is to avoid opting out of the internal controlled open state of a `Dialog`\n * Besides being a trigger that opens/close a dialog through context this component doesn't do much,\n * making it basically unnecessary in cases where the trigger is outside of the `Dialog` component.\n */\nexport const DialogTrigger: React.FC<DialogTriggerProps> = props => {\n  const state = useDialogTrigger_unstable(props);\n\n  return renderDialogTrigger_unstable(state);\n};\n\nDialogTrigger.displayName = 'DialogTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(DialogTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"names":["React","useDialogTrigger_unstable","renderDialogTrigger_unstable","DialogTrigger","props","state","displayName","isFluentTriggerComponent"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AAIrE;;;;;;;;CAQC,GACD,OAAO,MAAMC,gBAA8CC,CAAAA;IACzD,MAAMC,QAAQJ,0BAA0BG;IAExC,OAAOF,6BAA6BG;AACtC,EAAE;AAEFF,cAAcG,WAAW,GAAG;AAC5B,6FAA6F;AAC5FH,cAAyCI,wBAAwB,GAAG"}
+{"version":3,"sources":["../src/components/DialogTrigger/DialogTrigger.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDialogTrigger_unstable } from './useDialogTrigger';\nimport { renderDialogTrigger_unstable } from './renderDialogTrigger';\nimport type { DialogTriggerProps } from './DialogTrigger.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/**\n * A non-visual component that wraps its child\n * and configures them to be the trigger that will open or close a `Dialog`.\n * This component should only accept one child.\n *\n * This component sole purpose is to avoid opting out of the internal controlled open state of a `Dialog`\n * Besides being a trigger that opens/close a dialog through context this component doesn't do much,\n * making it basically unnecessary in cases where the trigger is outside of the `Dialog` component.\n */\nexport const DialogTrigger: React.FC<DialogTriggerProps> = props => {\n  const state = useDialogTrigger_unstable(props);\n\n  return renderDialogTrigger_unstable(state);\n};\n\nDialogTrigger.displayName = 'DialogTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(DialogTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"names":["React","useDialogTrigger_unstable","renderDialogTrigger_unstable","DialogTrigger","props","state","displayName","isFluentTriggerComponent"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AAIrE;;;;;;;;CAQC,GACD,OAAO,MAAMC,gBAA8CC,CAAAA;IACzD,MAAMC,QAAQJ,0BAA0BG;IAExC,OAAOF,6BAA6BG;AACtC,EAAE;AAEFF,cAAcG,WAAW,GAAG;AAC5B,6FAA6F;AAC5FH,cAAyCI,wBAAwB,GAAG"}

package/lib/components/DialogTrigger/renderDialogTrigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTrigger/renderDialogTrigger.tsx"],"sourcesContent":["import type { DialogTriggerState } from './DialogTrigger.types';\n\n/**\n * Render the final JSX of MenuTrigger\n *\n * Only renders children\n */\nexport const renderDialogTrigger_unstable = (state: DialogTriggerState) => state.children;\n"],"names":["renderDialogTrigger_unstable","state","children"],"mappings":"AAEA;;;;CAIC,GACD,OAAO,MAAMA,+BAA+B,CAACC,QAA8BA,MAAMC,QAAQ,CAAC"}
+{"version":3,"sources":["../src/components/DialogTrigger/renderDialogTrigger.tsx"],"sourcesContent":["import type { DialogTriggerState } from './DialogTrigger.types';\nimport type { JSXElement } from '@fluentui/react-utilities';\n\n/**\n * Render the final JSX of MenuTrigger\n *\n * Only renders children\n */\nexport const renderDialogTrigger_unstable = (state: DialogTriggerState): JSXElement | null => state.children;\n"],"names":["renderDialogTrigger_unstable","state","children"],"mappings":"AAGA;;;;CAIC,GACD,OAAO,MAAMA,+BAA+B,CAACC,QAAiDA,MAAMC,QAAQ,CAAC"}

package/lib/components/DialogTrigger/useDialogTrigger.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { applyTriggerPropsToChildren, getTriggerChild, getReactElementRef, useEventCallback } from '@fluentui/react-utilities';
 import { useDialogContext_unstable, useDialogSurfaceContext_unstable } from '../../contexts';

package/lib/components/DialogTrigger/useDialogTrigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogTrigger/useDialogTrigger.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  applyTriggerPropsToChildren,\n  getTriggerChild,\n  getReactElementRef,\n  useEventCallback,\n} from '@fluentui/react-utilities';\nimport type { DialogTriggerProps, DialogTriggerState } from './DialogTrigger.types';\nimport { useDialogContext_unstable, useDialogSurfaceContext_unstable } from '../../contexts';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render DialogTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup Dialog\n *\n * @param props - props from this instance of DialogTrigger\n */\nexport const useDialogTrigger_unstable = (props: DialogTriggerProps): DialogTriggerState => {\n  const isInsideSurfaceDialog = useDialogSurfaceContext_unstable();\n\n  const { children, disableButtonEnhancement = false, action = isInsideSurfaceDialog ? 'close' : 'open' } = props;\n\n  const child = getTriggerChild(children);\n\n  const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n  const { triggerAttributes } = useModalAttributes();\n\n  const handleClick = useEventCallback(\n    (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n      child?.props.onClick?.(event);\n      if (!event.isDefaultPrevented()) {\n        requestOpenChange({\n          event,\n          type: 'triggerClick',\n          open: action === 'open',\n        });\n      }\n    },\n  );\n\n  const triggerChildProps = {\n    ...child?.props,\n    ref: getReactElementRef<HTMLAnchorElement>(child),\n    onClick: handleClick,\n    ...triggerAttributes,\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    {\n      ...triggerChildProps,\n      type: 'button',\n    },\n  );\n\n  return {\n    children: applyTriggerPropsToChildren(\n      children,\n      disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n"],"names":["React","applyTriggerPropsToChildren","getTriggerChild","getReactElementRef","useEventCallback","useDialogContext_unstable","useDialogSurfaceContext_unstable","useARIAButtonProps","useModalAttributes","useDialogTrigger_unstable","props","isInsideSurfaceDialog","children","disableButtonEnhancement","action","child","requestOpenChange","ctx","triggerAttributes","handleClick","event","onClick","isDefaultPrevented","type","open","triggerChildProps","ref","ariaButtonTriggerChildProps"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,2BAA2B,EAC3BC,eAAe,EACfC,kBAAkB,EAClBC,gBAAgB,QACX,4BAA4B;AAEnC,SAASC,yBAAyB,EAAEC,gCAAgC,QAAQ,iBAAiB;AAC7F,SAASC,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,kBAAkB,QAAQ,0BAA0B;AAE7D;;;;;CAKC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxC,MAAMC,wBAAwBL;IAE9B,MAAM,EAAEM,QAAQ,EAAEC,2BAA2B,KAAK,EAAEC,SAASH,wBAAwB,UAAU,MAAM,EAAE,GAAGD;IAE1G,MAAMK,QAAQb,gBAAgBU;IAE9B,MAAMI,oBAAoBX,0BAA0BY,CAAAA,MAAOA,IAAID,iBAAiB;IAChF,MAAM,EAAEE,iBAAiB,EAAE,GAAGV;IAE9B,MAAMW,cAAcf,iBAClB,CAACgB;YACCL,sBAAAA;QAAAA,kBAAAA,6BAAAA,uBAAAA,CAAAA,eAAAA,MAAOL,KAAK,EAACW,OAAO,cAApBN,2CAAAA,0BAAAA,cAAuBK;QACvB,IAAI,CAACA,MAAME,kBAAkB,IAAI;YAC/BN,kBAAkB;gBAChBI;gBACAG,MAAM;gBACNC,MAAMV,WAAW;YACnB;QACF;IACF;IAGF,MAAMW,oBAAoB;WACrBV,kBAAAA,4BAAAA,MAAOL,KAAK,AAAf;QACAgB,KAAKvB,mBAAsCY;QAC3CM,SAASF;QACT,GAAGD,iBAAiB;IACtB;IAEA,MAAMS,8BAA8BpB,mBAClCQ,CAAAA,kBAAAA,4BAAAA,MAAOQ,IAAI,MAAK,YAAYR,CAAAA,kBAAAA,4BAAAA,MAAOQ,IAAI,MAAK,MAAMR,MAAMQ,IAAI,GAAG,OAC/D;QACE,GAAGE,iBAAiB;QACpBF,MAAM;IACR;IAGF,OAAO;QACLX,UAAUX,4BACRW,UACAC,2BAA2BY,oBAAoBE;IAEnD;AACF,EAAE"}
+{"version":3,"sources":["../src/components/DialogTrigger/useDialogTrigger.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n  applyTriggerPropsToChildren,\n  getTriggerChild,\n  getReactElementRef,\n  useEventCallback,\n} from '@fluentui/react-utilities';\nimport type { DialogTriggerProps, DialogTriggerState } from './DialogTrigger.types';\nimport { useDialogContext_unstable, useDialogSurfaceContext_unstable } from '../../contexts';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render DialogTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup Dialog\n *\n * @param props - props from this instance of DialogTrigger\n */\nexport const useDialogTrigger_unstable = (props: DialogTriggerProps): DialogTriggerState => {\n  const isInsideSurfaceDialog = useDialogSurfaceContext_unstable();\n\n  const { children, disableButtonEnhancement = false, action = isInsideSurfaceDialog ? 'close' : 'open' } = props;\n\n  const child = getTriggerChild(children);\n\n  const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n  const { triggerAttributes } = useModalAttributes();\n\n  const handleClick = useEventCallback(\n    (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n      child?.props.onClick?.(event);\n      if (!event.isDefaultPrevented()) {\n        requestOpenChange({\n          event,\n          type: 'triggerClick',\n          open: action === 'open',\n        });\n      }\n    },\n  );\n\n  const triggerChildProps = {\n    ...child?.props,\n    ref: getReactElementRef<HTMLAnchorElement>(child),\n    onClick: handleClick,\n    ...triggerAttributes,\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    {\n      ...triggerChildProps,\n      type: 'button',\n    },\n  );\n\n  return {\n    children: applyTriggerPropsToChildren(\n      children,\n      disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n"],"names":["React","applyTriggerPropsToChildren","getTriggerChild","getReactElementRef","useEventCallback","useDialogContext_unstable","useDialogSurfaceContext_unstable","useARIAButtonProps","useModalAttributes","useDialogTrigger_unstable","props","isInsideSurfaceDialog","children","disableButtonEnhancement","action","child","requestOpenChange","ctx","triggerAttributes","handleClick","event","onClick","isDefaultPrevented","type","open","triggerChildProps","ref","ariaButtonTriggerChildProps"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,2BAA2B,EAC3BC,eAAe,EACfC,kBAAkB,EAClBC,gBAAgB,QACX,4BAA4B;AAEnC,SAASC,yBAAyB,EAAEC,gCAAgC,QAAQ,iBAAiB;AAC7F,SAASC,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,kBAAkB,QAAQ,0BAA0B;AAE7D;;;;;CAKC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxC,MAAMC,wBAAwBL;IAE9B,MAAM,EAAEM,QAAQ,EAAEC,2BAA2B,KAAK,EAAEC,SAASH,wBAAwB,UAAU,MAAM,EAAE,GAAGD;IAE1G,MAAMK,QAAQb,gBAAgBU;IAE9B,MAAMI,oBAAoBX,0BAA0BY,CAAAA,MAAOA,IAAID,iBAAiB;IAChF,MAAM,EAAEE,iBAAiB,EAAE,GAAGV;IAE9B,MAAMW,cAAcf,iBAClB,CAACgB;YACCL,sBAAAA;QAAAA,kBAAAA,6BAAAA,uBAAAA,CAAAA,eAAAA,MAAOL,KAAK,EAACW,OAAO,cAApBN,2CAAAA,0BAAAA,cAAuBK;QACvB,IAAI,CAACA,MAAME,kBAAkB,IAAI;YAC/BN,kBAAkB;gBAChBI;gBACAG,MAAM;gBACNC,MAAMV,WAAW;YACnB;QACF;IACF;IAGF,MAAMW,oBAAoB;WACrBV,kBAAAA,4BAAAA,MAAOL,KAAK,AAAf;QACAgB,KAAKvB,mBAAsCY;QAC3CM,SAASF;QACT,GAAGD,iBAAiB;IACtB;IAEA,MAAMS,8BAA8BpB,mBAClCQ,CAAAA,kBAAAA,4BAAAA,MAAOQ,IAAI,MAAK,YAAYR,CAAAA,kBAAAA,4BAAAA,MAAOQ,IAAI,MAAK,MAAMR,MAAMQ,IAAI,GAAG,OAC/D;QACE,GAAGE,iBAAiB;QACpBF,MAAM;IACR;IAGF,OAAO;QACLX,UAAUX,4BACRW,UACAC,2BAA2BY,oBAAoBE;IAEnD;AACF,EAAE"}

package/lib/components/MotionRefForwarder.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 const MotionRefForwarderContext = /*#__PURE__*/ React.createContext(undefined);
 /**

package/lib/components/MotionRefForwarder.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/MotionRefForwarder.tsx"],"sourcesContent":["import * as React from 'react';\n\nconst MotionRefForwarderContext = React.createContext<React.Ref<HTMLElement> | undefined>(undefined);\n\n/**\n * @internal\n */\nexport function useMotionForwardedRef() {\n  return React.useContext(MotionRefForwarderContext);\n}\n\n/**\n * A component that forwards a ref to its children via a React context.\n *\n * @internal\n */\nexport const MotionRefForwarder = React.forwardRef<HTMLElement, { children: React.ReactElement }>((props, ref) => {\n  return <MotionRefForwarderContext.Provider value={ref}>{props.children}</MotionRefForwarderContext.Provider>;\n});\n"],"names":["React","MotionRefForwarderContext","createContext","undefined","useMotionForwardedRef","useContext","MotionRefForwarder","forwardRef","props","ref","Provider","value","children"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,0CAA4BD,MAAME,aAAa,CAAqCC;AAE1F;;CAEC,GACD,OAAO,SAASC;IACd,OAAOJ,MAAMK,UAAU,CAACJ;AAC1B;AAEA;;;;CAIC,GACD,OAAO,MAAMK,mCAAqBN,MAAMO,UAAU,CAAgD,CAACC,OAAOC;IACxG,qBAAO,oBAACR,0BAA0BS,QAAQ;QAACC,OAAOF;OAAMD,MAAMI,QAAQ;AACxE,GAAG"}
+{"version":3,"sources":["../src/components/MotionRefForwarder.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nconst MotionRefForwarderContext = React.createContext<React.Ref<HTMLElement> | undefined>(undefined);\n\n/**\n * @internal\n */\nexport function useMotionForwardedRef(): React.Ref<HTMLElement> | undefined {\n  return React.useContext(MotionRefForwarderContext);\n}\n\n/**\n * A component that forwards a ref to its children via a React context.\n *\n * @internal\n */\nexport const MotionRefForwarder = React.forwardRef<HTMLElement, { children: React.ReactElement }>((props, ref) => {\n  return <MotionRefForwarderContext.Provider value={ref}>{props.children}</MotionRefForwarderContext.Provider>;\n});\n"],"names":["React","MotionRefForwarderContext","createContext","undefined","useMotionForwardedRef","useContext","MotionRefForwarder","forwardRef","props","ref","Provider","value","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,0CAA4BD,MAAME,aAAa,CAAqCC;AAE1F;;CAEC,GACD,OAAO,SAASC;IACd,OAAOJ,MAAMK,UAAU,CAACJ;AAC1B;AAEA;;;;CAIC,GACD,OAAO,MAAMK,mCAAqBN,MAAMO,UAAU,CAAgD,CAACC,OAAOC;IACxG,qBAAO,oBAACR,0BAA0BS,QAAQ;QAACC,OAAOF;OAAMD,MAAMI,QAAQ;AACxE,GAAG"}

package/lib/contexts/dialogContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { createContext, useContextSelector } from '@fluentui/react-context-selector';
 const defaultContextValue = {

package/lib/contexts/dialogContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/dialogContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, ContextSelector, useContextSelector } from '@fluentui/react-context-selector';\nimport { DialogSurfaceElement } from '../DialogSurface';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { DialogModalType, DialogOpenChangeData } from '../Dialog';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\nexport type DialogContextValue = {\n  open: boolean;\n  inertTrapFocus: boolean;\n  dialogTitleId?: string;\n  isNestedDialog: boolean;\n  dialogRef: React.Ref<DialogSurfaceElement>;\n  modalType: DialogModalType;\n  /**\n   * Requests dialog main component to update it's internal open state\n   */\n  requestOpenChange: (data: DialogOpenChangeData) => void;\n} & Partial<ReturnType<typeof useModalAttributes>>;\n\nconst defaultContextValue: DialogContextValue = {\n  open: false,\n  inertTrapFocus: false,\n  modalType: 'modal',\n  isNestedDialog: false,\n  dialogRef: { current: null },\n  requestOpenChange() {\n    /* noop */\n  },\n};\n\n// Contexts should default to undefined\nexport const DialogContext: Context<DialogContextValue | undefined> = createContext<DialogContextValue | undefined>(\n  undefined,\n);\n\nexport const DialogProvider = DialogContext.Provider;\nexport const useDialogContext_unstable = <T>(selector: ContextSelector<DialogContextValue, T>): T =>\n  useContextSelector(DialogContext, (ctx = defaultContextValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","defaultContextValue","open","inertTrapFocus","modalType","isNestedDialog","dialogRef","current","requestOpenChange","DialogContext","undefined","DialogProvider","Provider","useDialogContext_unstable","selector","ctx"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAmBC,kBAAkB,QAAQ,mCAAmC;AAmBtG,MAAMC,sBAA0C;IAC9CC,MAAM;IACNC,gBAAgB;IAChBC,WAAW;IACXC,gBAAgB;IAChBC,WAAW;QAAEC,SAAS;IAAK;IAC3BC;IACE,QAAQ,GACV;AACF;AAEA,uCAAuC;AACvC,OAAO,MAAMC,gBAAyDV,cACpEW,WACA;AAEF,OAAO,MAAMC,iBAAiBF,cAAcG,QAAQ,CAAC;AACrD,OAAO,MAAMC,4BAA4B,CAAIC,WAC3Cd,mBAAmBS,eAAe,CAACM,MAAMd,mBAAmB,GAAKa,SAASC,MAAM"}
+{"version":3,"sources":["../src/contexts/dialogContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createContext, ContextSelector, useContextSelector } from '@fluentui/react-context-selector';\nimport { DialogSurfaceElement } from '../DialogSurface';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { DialogModalType, DialogOpenChangeData } from '../Dialog';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\nexport type DialogContextValue = {\n  open: boolean;\n  inertTrapFocus: boolean;\n  dialogTitleId?: string;\n  isNestedDialog: boolean;\n  dialogRef: React.Ref<DialogSurfaceElement | null>;\n  modalType: DialogModalType;\n  /**\n   * Requests dialog main component to update it's internal open state\n   */\n  requestOpenChange: (data: DialogOpenChangeData) => void;\n} & Partial<ReturnType<typeof useModalAttributes>>;\n\nconst defaultContextValue: DialogContextValue = {\n  open: false,\n  inertTrapFocus: false,\n  modalType: 'modal',\n  isNestedDialog: false,\n  dialogRef: { current: null },\n  requestOpenChange() {\n    /* noop */\n  },\n};\n\n// Contexts should default to undefined\nexport const DialogContext: Context<DialogContextValue | undefined> = createContext<DialogContextValue | undefined>(\n  undefined,\n);\n\nexport const DialogProvider = DialogContext.Provider;\nexport const useDialogContext_unstable = <T>(selector: ContextSelector<DialogContextValue, T>): T =>\n  useContextSelector(DialogContext, (ctx = defaultContextValue) => selector(ctx));\n"],"names":["React","createContext","useContextSelector","defaultContextValue","open","inertTrapFocus","modalType","isNestedDialog","dialogRef","current","requestOpenChange","DialogContext","undefined","DialogProvider","Provider","useDialogContext_unstable","selector","ctx"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAmBC,kBAAkB,QAAQ,mCAAmC;AAmBtG,MAAMC,sBAA0C;IAC9CC,MAAM;IACNC,gBAAgB;IAChBC,WAAW;IACXC,gBAAgB;IAChBC,WAAW;QAAEC,SAAS;IAAK;IAC3BC;IACE,QAAQ,GACV;AACF;AAEA,uCAAuC;AACvC,OAAO,MAAMC,gBAAyDV,cACpEW,WACA;AAEF,OAAO,MAAMC,iBAAiBF,cAAcG,QAAQ,CAAC;AACrD,OAAO,MAAMC,4BAA4B,CAAIC,WAC3Cd,mBAAmBS,eAAe,CAACM,MAAMd,mBAAmB,GAAKa,SAASC,MAAM"}

package/lib/contexts/dialogSurfaceContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 const defaultContextValue = false;
 export const DialogSurfaceContext = React.createContext(undefined);

package/lib/contexts/dialogSurfaceContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/contexts/dialogSurfaceContext.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type DialogSurfaceContextValue = boolean;\n\nconst defaultContextValue: DialogSurfaceContextValue = false;\n\nexport const DialogSurfaceContext = React.createContext<DialogSurfaceContextValue | undefined>(undefined);\n\nexport const DialogSurfaceProvider = DialogSurfaceContext.Provider;\n\nexport const useDialogSurfaceContext_unstable = () => React.useContext(DialogSurfaceContext) ?? defaultContextValue;\n"],"names":["React","defaultContextValue","DialogSurfaceContext","createContext","undefined","DialogSurfaceProvider","Provider","useDialogSurfaceContext_unstable","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,MAAMC,sBAAiD;AAEvD,OAAO,MAAMC,uBAAuBF,MAAMG,aAAa,CAAwCC,WAAW;AAE1G,OAAO,MAAMC,wBAAwBH,qBAAqBI,QAAQ,CAAC;AAEnE,OAAO,MAAMC,mCAAmC;QAAMP;WAAAA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACN,mCAAjBF,+BAAAA,oBAA0CC;EAAoB"}
+{"version":3,"sources":["../src/contexts/dialogSurfaceContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nexport type DialogSurfaceContextValue = boolean;\n\nconst defaultContextValue: DialogSurfaceContextValue = false;\n\nexport const DialogSurfaceContext = React.createContext<DialogSurfaceContextValue | undefined>(undefined);\n\nexport const DialogSurfaceProvider = DialogSurfaceContext.Provider;\n\nexport const useDialogSurfaceContext_unstable = (): DialogSurfaceContextValue =>\n  React.useContext(DialogSurfaceContext) ?? defaultContextValue;\n"],"names":["React","defaultContextValue","DialogSurfaceContext","createContext","undefined","DialogSurfaceProvider","Provider","useDialogSurfaceContext_unstable","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAI/B,MAAMC,sBAAiD;AAEvD,OAAO,MAAMC,uBAAuBF,MAAMG,aAAa,CAAwCC,WAAW;AAE1G,OAAO,MAAMC,wBAAwBH,qBAAqBI,QAAQ,CAAC;AAEnE,OAAO,MAAMC,mCAAmC;QAC9CP;WAAAA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACN,mCAAjBF,+BAAAA,oBAA0CC;EAAoB"}

package/lib/utils/useDisableBodyScroll.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useFluent_unstable } from '@fluentui/react-shared-contexts';
 import { useBodyNoScrollStyles, useHTMLNoScrollStyles } from './useDisableBodyScroll.styles';

package/lib/utils/useDisableBodyScroll.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useDisableBodyScroll.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useBodyNoScrollStyles, useHTMLNoScrollStyles } from './useDisableBodyScroll.styles';\n\n/**\n * @internal\n * A React *hook* that disables body scrolling through `overflowY: hidden` CSS property\n */\nexport function useDisableBodyScroll(): {\n  disableBodyScroll: () => void;\n  enableBodyScroll: () => void;\n} {\n  const htmlNoScrollStyles = useHTMLNoScrollStyles();\n  const bodyNoScrollStyles = useBodyNoScrollStyles();\n  const { targetDocument } = useFluent_unstable();\n\n  const disableBodyScroll = React.useCallback(() => {\n    if (!targetDocument) {\n      return;\n    }\n    const isHorizontalScrollbarVisible =\n      // When the window is a fractional height, `innerHeight` always rounds down but `clientHeight` rounds either up or down depending on the value.\n      // To properly compare the body clientHeight to the window innerHeight, manually round down the fractional value to match innerHeight's calculation.\n      Math.floor(targetDocument.body.getBoundingClientRect().height) > (targetDocument.defaultView?.innerHeight ?? 0);\n    if (!isHorizontalScrollbarVisible) {\n      return;\n    }\n    targetDocument.documentElement.classList.add(htmlNoScrollStyles);\n    targetDocument.body.classList.add(bodyNoScrollStyles);\n    return;\n  }, [targetDocument, htmlNoScrollStyles, bodyNoScrollStyles]);\n\n  const enableBodyScroll = React.useCallback(() => {\n    if (!targetDocument) {\n      return;\n    }\n    targetDocument.documentElement.classList.remove(htmlNoScrollStyles);\n    targetDocument.body.classList.remove(bodyNoScrollStyles);\n  }, [targetDocument, htmlNoScrollStyles, bodyNoScrollStyles]);\n\n  return {\n    disableBodyScroll,\n    enableBodyScroll,\n  };\n}\n"],"names":["React","useFluent_unstable","useBodyNoScrollStyles","useHTMLNoScrollStyles","useDisableBodyScroll","htmlNoScrollStyles","bodyNoScrollStyles","targetDocument","disableBodyScroll","useCallback","isHorizontalScrollbarVisible","Math","floor","body","getBoundingClientRect","height","defaultView","innerHeight","documentElement","classList","add","enableBodyScroll","remove"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,kCAAkC;AAErE,SAASC,qBAAqB,EAAEC,qBAAqB,QAAQ,gCAAgC;AAE7F;;;CAGC,GACD,OAAO,SAASC;IAId,MAAMC,qBAAqBF;IAC3B,MAAMG,qBAAqBJ;IAC3B,MAAM,EAAEK,cAAc,EAAE,GAAGN;IAE3B,MAAMO,oBAAoBR,MAAMS,WAAW,CAAC;YAO0BF;QANpE,IAAI,CAACA,gBAAgB;YACnB;QACF;YAIoEA;QAHpE,MAAMG,+BACJ,+IAA+I;QAC/I,oJAAoJ;QACpJC,KAAKC,KAAK,CAACL,eAAeM,IAAI,CAACC,qBAAqB,GAAGC,MAAM,IAAKR,CAAAA,CAAAA,2CAAAA,8BAAAA,eAAeS,WAAW,cAA1BT,kDAAAA,4BAA4BU,WAAW,cAAvCV,qDAAAA,0CAA2C,CAAA;QAC/G,IAAI,CAACG,8BAA8B;YACjC;QACF;QACAH,eAAeW,eAAe,CAACC,SAAS,CAACC,GAAG,CAACf;QAC7CE,eAAeM,IAAI,CAACM,SAAS,CAACC,GAAG,CAACd;QAClC;IACF,GAAG;QAACC;QAAgBF;QAAoBC;KAAmB;IAE3D,MAAMe,mBAAmBrB,MAAMS,WAAW,CAAC;QACzC,IAAI,CAACF,gBAAgB;YACnB;QACF;QACAA,eAAeW,eAAe,CAACC,SAAS,CAACG,MAAM,CAACjB;QAChDE,eAAeM,IAAI,CAACM,SAAS,CAACG,MAAM,CAAChB;IACvC,GAAG;QAACC;QAAgBF;QAAoBC;KAAmB;IAE3D,OAAO;QACLE;QACAa;IACF;AACF"}
+{"version":3,"sources":["../src/utils/useDisableBodyScroll.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useBodyNoScrollStyles, useHTMLNoScrollStyles } from './useDisableBodyScroll.styles';\n\n/**\n * @internal\n * A React *hook* that disables body scrolling through `overflowY: hidden` CSS property\n */\nexport function useDisableBodyScroll(): {\n  disableBodyScroll: () => void;\n  enableBodyScroll: () => void;\n} {\n  const htmlNoScrollStyles = useHTMLNoScrollStyles();\n  const bodyNoScrollStyles = useBodyNoScrollStyles();\n  const { targetDocument } = useFluent_unstable();\n\n  const disableBodyScroll = React.useCallback(() => {\n    if (!targetDocument) {\n      return;\n    }\n    const isHorizontalScrollbarVisible =\n      // When the window is a fractional height, `innerHeight` always rounds down but `clientHeight` rounds either up or down depending on the value.\n      // To properly compare the body clientHeight to the window innerHeight, manually round down the fractional value to match innerHeight's calculation.\n      Math.floor(targetDocument.body.getBoundingClientRect().height) > (targetDocument.defaultView?.innerHeight ?? 0);\n    if (!isHorizontalScrollbarVisible) {\n      return;\n    }\n    targetDocument.documentElement.classList.add(htmlNoScrollStyles);\n    targetDocument.body.classList.add(bodyNoScrollStyles);\n    return;\n  }, [targetDocument, htmlNoScrollStyles, bodyNoScrollStyles]);\n\n  const enableBodyScroll = React.useCallback(() => {\n    if (!targetDocument) {\n      return;\n    }\n    targetDocument.documentElement.classList.remove(htmlNoScrollStyles);\n    targetDocument.body.classList.remove(bodyNoScrollStyles);\n  }, [targetDocument, htmlNoScrollStyles, bodyNoScrollStyles]);\n\n  return {\n    disableBodyScroll,\n    enableBodyScroll,\n  };\n}\n"],"names":["React","useFluent_unstable","useBodyNoScrollStyles","useHTMLNoScrollStyles","useDisableBodyScroll","htmlNoScrollStyles","bodyNoScrollStyles","targetDocument","disableBodyScroll","useCallback","isHorizontalScrollbarVisible","Math","floor","body","getBoundingClientRect","height","defaultView","innerHeight","documentElement","classList","add","enableBodyScroll","remove"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,kCAAkC;AAErE,SAASC,qBAAqB,EAAEC,qBAAqB,QAAQ,gCAAgC;AAE7F;;;CAGC,GACD,OAAO,SAASC;IAId,MAAMC,qBAAqBF;IAC3B,MAAMG,qBAAqBJ;IAC3B,MAAM,EAAEK,cAAc,EAAE,GAAGN;IAE3B,MAAMO,oBAAoBR,MAAMS,WAAW,CAAC;YAO0BF;QANpE,IAAI,CAACA,gBAAgB;YACnB;QACF;YAIoEA;QAHpE,MAAMG,+BACJ,+IAA+I;QAC/I,oJAAoJ;QACpJC,KAAKC,KAAK,CAACL,eAAeM,IAAI,CAACC,qBAAqB,GAAGC,MAAM,IAAKR,CAAAA,CAAAA,2CAAAA,8BAAAA,eAAeS,WAAW,cAA1BT,kDAAAA,4BAA4BU,WAAW,cAAvCV,qDAAAA,0CAA2C,CAAA;QAC/G,IAAI,CAACG,8BAA8B;YACjC;QACF;QACAH,eAAeW,eAAe,CAACC,SAAS,CAACC,GAAG,CAACf;QAC7CE,eAAeM,IAAI,CAACM,SAAS,CAACC,GAAG,CAACd;QAClC;IACF,GAAG;QAACC;QAAgBF;QAAoBC;KAAmB;IAE3D,MAAMe,mBAAmBrB,MAAMS,WAAW,CAAC;QACzC,IAAI,CAACF,gBAAgB;YACnB;QACF;QACAA,eAAeW,eAAe,CAACC,SAAS,CAACG,MAAM,CAACjB;QAChDE,eAAeM,IAAI,CAACM,SAAS,CAACG,MAAM,CAAChB;IACvC,GAAG;QAACC;QAAgBF;QAAoBC;KAAmB;IAE3D,OAAO;QACLE;QACAa;IACF;AACF"}

package/lib/utils/useFocusFirstElement.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useFocusFinders } from '@fluentui/react-tabster';
 import { useFluent_unstable } from '@fluentui/react-shared-contexts';

package/lib/utils/useFocusFirstElement.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useFocusFirstElement.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface';\nimport type { DialogModalType } from '../Dialog';\n\n/**\n * Focus first element on content when dialog is opened,\n */\nexport function useFocusFirstElement(open: boolean, modalType: DialogModalType) {\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent_unstable();\n  const dialogRef = React.useRef<DialogSurfaceElement>(null);\n\n  React.useEffect(() => {\n    if (!open) {\n      return;\n    }\n    const element = dialogRef.current && findFirstFocusable(dialogRef.current);\n    if (element) {\n      element.focus();\n    } else {\n      dialogRef.current?.focus(); // https://github.com/microsoft/fluentui/issues/25150\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.warn(/** #__DE-INDENT__ */ `\n          @fluentui/react-dialog [useFocusFirstElement]:\n          A Dialog should have at least one focusable element inside DialogSurface.\n          Please add at least a close button either on \\`DialogTitle\\` action slot or inside \\`DialogActions\\`\n        `);\n      }\n    }\n  }, [findFirstFocusable, open, modalType, targetDocument]);\n\n  return dialogRef;\n}\n"],"names":["React","useFocusFinders","useFluent_unstable","useFocusFirstElement","open","modalType","findFirstFocusable","targetDocument","dialogRef","useRef","useEffect","element","current","focus","process","env","NODE_ENV","console","warn"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,kBAAkB,QAAQ,kCAAkC;AAIrE;;CAEC,GACD,OAAO,SAASC,qBAAqBC,IAAa,EAAEC,SAA0B;IAC5E,MAAM,EAAEC,kBAAkB,EAAE,GAAGL;IAC/B,MAAM,EAAEM,cAAc,EAAE,GAAGL;IAC3B,MAAMM,YAAYR,MAAMS,MAAM,CAAuB;IAErDT,MAAMU,SAAS,CAAC;QACd,IAAI,CAACN,MAAM;YACT;QACF;QACA,MAAMO,UAAUH,UAAUI,OAAO,IAAIN,mBAAmBE,UAAUI,OAAO;QACzE,IAAID,SAAS;YACXA,QAAQE,KAAK;QACf,OAAO;gBACLL;aAAAA,qBAAAA,UAAUI,OAAO,cAAjBJ,yCAAAA,mBAAmBK,KAAK,IAAI,qDAAqD;YACjF,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;gBAC1C,sCAAsC;gBACtCC,QAAQC,IAAI,CAAuB,CAAC;;oGAIpC,CAAC;YACH;QACF;IACF,GAAG;QAACZ;QAAoBF;QAAMC;QAAWE;KAAe;IAExD,OAAOC;AACT"}
+{"version":3,"sources":["../src/utils/useFocusFirstElement.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface';\nimport type { DialogModalType } from '../Dialog';\n\n/**\n * Focus first element on content when dialog is opened,\n */\nexport function useFocusFirstElement(\n  open: boolean,\n  modalType: DialogModalType,\n): React.RefObject<DialogSurfaceElement | null> {\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent_unstable();\n  const dialogRef = React.useRef<DialogSurfaceElement | null>(null);\n\n  React.useEffect(() => {\n    if (!open) {\n      return;\n    }\n    const element = dialogRef.current && findFirstFocusable(dialogRef.current);\n    if (element) {\n      element.focus();\n    } else {\n      dialogRef.current?.focus(); // https://github.com/microsoft/fluentui/issues/25150\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.warn(/** #__DE-INDENT__ */ `\n          @fluentui/react-dialog [useFocusFirstElement]:\n          A Dialog should have at least one focusable element inside DialogSurface.\n          Please add at least a close button either on \\`DialogTitle\\` action slot or inside \\`DialogActions\\`\n        `);\n      }\n    }\n  }, [findFirstFocusable, open, modalType, targetDocument]);\n\n  return dialogRef;\n}\n"],"names":["React","useFocusFinders","useFluent_unstable","useFocusFirstElement","open","modalType","findFirstFocusable","targetDocument","dialogRef","useRef","useEffect","element","current","focus","process","env","NODE_ENV","console","warn"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,kBAAkB,QAAQ,kCAAkC;AAIrE;;CAEC,GACD,OAAO,SAASC,qBACdC,IAAa,EACbC,SAA0B;IAE1B,MAAM,EAAEC,kBAAkB,EAAE,GAAGL;IAC/B,MAAM,EAAEM,cAAc,EAAE,GAAGL;IAC3B,MAAMM,YAAYR,MAAMS,MAAM,CAA8B;IAE5DT,MAAMU,SAAS,CAAC;QACd,IAAI,CAACN,MAAM;YACT;QACF;QACA,MAAMO,UAAUH,UAAUI,OAAO,IAAIN,mBAAmBE,UAAUI,OAAO;QACzE,IAAID,SAAS;YACXA,QAAQE,KAAK;QACf,OAAO;gBACLL;aAAAA,qBAAAA,UAAUI,OAAO,cAAjBJ,yCAAAA,mBAAmBK,KAAK,IAAI,qDAAqD;YACjF,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;gBAC1C,sCAAsC;gBACtCC,QAAQC,IAAI,CAAuB,CAAC;;oGAIpC,CAAC;YACH;QACF;IACF,GAAG;QAACZ;QAAoBF;QAAMC;QAAWE;KAAe;IAExD,OAAOC;AACT"}

package/lib-commonjs/components/Dialog/Dialog.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialog_unstable } from './useDialog';\nimport { renderDialog_unstable } from './renderDialog';\nimport type { DialogProps } from './Dialog.types';\nimport { useDialogContextValues_unstable } from './useDialogContextValues';\n\n/**\n * The `Dialog` root level component serves as an interface for interaction with all possible behaviors exposed.\n * It provides context down the hierarchy to `children` compound components to allow functionality.\n * This component expects to receive as children either a `DialogSurface` or a `DialogTrigger`\n * and a `DialogSurface` (or some component that will eventually render one of those compound components)\n * in this specific order\n */\nexport const Dialog: React.FC<DialogProps> = React.memo(props => {\n  const state = useDialog_unstable(props);\n  const contextValues = useDialogContextValues_unstable(state);\n\n  return renderDialog_unstable(state, contextValues);\n});\n\nDialog.displayName = 'Dialog';\n"],"names":["React","useDialog_unstable","renderDialog_unstable","useDialogContextValues_unstable","Dialog","memo","props","state","contextValues","displayName"],"mappings":";;;;+BAaaI;;;;;;;iEAbU,QAAQ;2BACI,cAAc;8BACX,iBAAiB;wCAEP,2BAA2B;AASpE,eAAMA,WAAAA,GAAgCJ,OAAMK,IAAI,CAACC,CAAAA;IACtD,MAAMC,YAAQN,6BAAAA,EAAmBK;IACjC,MAAME,oBAAgBL,uDAAAA,EAAgCI;IAEtD,WAAOL,mCAAAA,EAAsBK,OAAOC;AACtC,GAAG;AAEHJ,OAAOK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/Dialog/Dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDialog_unstable } from './useDialog';\nimport { renderDialog_unstable } from './renderDialog';\nimport type { DialogProps } from './Dialog.types';\nimport { useDialogContextValues_unstable } from './useDialogContextValues';\n\n/**\n * The `Dialog` root level component serves as an interface for interaction with all possible behaviors exposed.\n * It provides context down the hierarchy to `children` compound components to allow functionality.\n * This component expects to receive as children either a `DialogSurface` or a `DialogTrigger`\n * and a `DialogSurface` (or some component that will eventually render one of those compound components)\n * in this specific order\n */\nexport const Dialog: React.FC<DialogProps> = React.memo(props => {\n  const state = useDialog_unstable(props);\n  const contextValues = useDialogContextValues_unstable(state);\n\n  return renderDialog_unstable(state, contextValues);\n});\n\nDialog.displayName = 'Dialog';\n"],"names":["React","useDialog_unstable","renderDialog_unstable","useDialogContextValues_unstable","Dialog","memo","props","state","contextValues","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;2BACI,cAAc;8BACX,iBAAiB;wCAEP,2BAA2B;AASpE,MAAMI,SAAAA,WAAAA,GAAgCJ,OAAMK,IAAI,CAACC,CAAAA;IACtD,MAAMC,YAAQN,6BAAAA,EAAmBK;IACjC,MAAME,oBAAgBL,uDAAAA,EAAgCI;IAEtD,WAAOL,mCAAAA,EAAsBK,OAAOC;AACtC,GAAG;AAEHJ,OAAOK,WAAW,GAAG"}

package/lib-commonjs/components/Dialog/renderDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Dialog/renderDialog.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { MotionRefForwarder } from '../MotionRefForwarder';\nimport { DialogProvider, DialogSurfaceProvider } from '../../contexts';\nimport type { DialogState, DialogContextValues, InternalDialogSlots } from './Dialog.types';\n\n/**\n * Render the final JSX of Dialog\n */\nexport const renderDialog_unstable = (state: DialogState, contextValues: DialogContextValues) => {\n  assertSlots<InternalDialogSlots>(state);\n\n  return (\n    <DialogProvider value={contextValues.dialog}>\n      <DialogSurfaceProvider value={contextValues.dialogSurface}>\n        {state.trigger}\n        {state.content && (\n          <state.surfaceMotion>\n            <MotionRefForwarder>\n              {/* Casting here as content should be equivalent to <DialogSurface/> */}\n              {/* FIXME: content should not be ReactNode it should be ReactElement instead. */}\n              {state.content as React.ReactElement}\n            </MotionRefForwarder>\n          </state.surfaceMotion>\n        )}\n      </DialogSurfaceProvider>\n    </DialogProvider>\n  );\n};\n"],"names":["assertSlots","React","MotionRefForwarder","DialogProvider","DialogSurfaceProvider","renderDialog_unstable","state","contextValues","value","dialog","dialogSurface","trigger","content","surfaceMotion"],"mappings":";;;;+BAaaK;;;;;;;4BAZb,iCAAiD;gCAErB,4BAA4B;iEACjC,QAAQ;oCAEI,wBAAwB;0BACL,iBAAiB;AAMhE,8BAA8B,CAACC,OAAoBC;QACxDP,2BAAAA,EAAiCM;IAEjC,OAAA,WAAA,OACE,eAAA,EAACH,wBAAAA,EAAAA;QAAeK,OAAOD,cAAcE,MAAM;kBACzC,WAAA,OAAA,gBAAA,EAACL,+BAAAA,EAAAA;YAAsBI,OAAOD,cAAcG,aAAa;;gBACtDJ,MAAMK,OAAO;gBACbL,MAAMM,OAAO,IAAA,WAAA,OACZ,eAAA,EAACN,MAAMO,aAAa,EAAA;8BAClB,WAAA,OAAA,eAAA,EAACX,sCAAAA,EAAAA;kCAGEI,MAAMM,OAAO;;;;;;AAO5B,EAAE"}
+{"version":3,"sources":["../src/components/Dialog/renderDialog.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { MotionRefForwarder } from '../MotionRefForwarder';\nimport { DialogProvider, DialogSurfaceProvider } from '../../contexts';\nimport type { DialogState, DialogContextValues, InternalDialogSlots } from './Dialog.types';\n\n/**\n * Render the final JSX of Dialog\n */\nexport const renderDialog_unstable = (state: DialogState, contextValues: DialogContextValues): JSXElement => {\n  assertSlots<InternalDialogSlots>(state);\n\n  return (\n    <DialogProvider value={contextValues.dialog}>\n      <DialogSurfaceProvider value={contextValues.dialogSurface}>\n        {state.trigger}\n        {state.content && (\n          <state.surfaceMotion>\n            <MotionRefForwarder>\n              {/* Casting here as content should be equivalent to <DialogSurface/> */}\n              {/* FIXME: content should not be ReactNode it should be ReactElement instead. */}\n              {state.content as React.ReactElement}\n            </MotionRefForwarder>\n          </state.surfaceMotion>\n        )}\n      </DialogSurfaceProvider>\n    </DialogProvider>\n  );\n};\n"],"names":["assertSlots","React","MotionRefForwarder","DialogProvider","DialogSurfaceProvider","renderDialog_unstable","state","contextValues","value","dialog","dialogSurface","trigger","content","surfaceMotion"],"mappings":";;;;+BAcaK;;;;;;;4BAbb,iCAAiD;gCAErB,4BAA4B;iEAEjC,QAAQ;oCAEI,wBAAwB;0BACL,iBAAiB;AAMhE,8BAA8B,CAACC,OAAoBC;QACxDP,2BAAAA,EAAiCM;IAEjC,OAAA,WAAA,OACE,eAAA,EAACH,wBAAAA,EAAAA;QAAeK,OAAOD,cAAcE,MAAM;kBACzC,WAAA,OAAA,gBAAA,EAACL,+BAAAA,EAAAA;YAAsBI,OAAOD,cAAcG,aAAa;;gBACtDJ,MAAMK,OAAO;gBACbL,MAAMM,OAAO,IAAA,WAAA,OACZ,eAAA,EAACN,MAAMO,aAAa,EAAA;8BAClB,WAAA,OAAA,eAAA,EAACX,sCAAAA,EAAAA;kCAGEI,MAAMM,OAAO;;;;;;AAO5B,EAAE"}

package/lib-commonjs/components/Dialog/useDialog.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/Dialog/useDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Dialog/useDialog.ts"],"sourcesContent":["import { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { useControllableState, useEventCallback, useId } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { useFocusFirstElement } from '../../utils';\nimport { DialogContext } from '../../contexts';\nimport { DialogSurfaceMotion } from '../DialogSurfaceMotion';\nimport type { DialogOpenChangeData, DialogProps, DialogState } from './Dialog.types';\n\n/**\n * Create the state required to render Dialog.\n *\n * The returned state can be modified with hooks such as useDialogStyles_unstable,\n * before being passed to renderDialog_unstable.\n *\n * @param props - props from this instance of Dialog\n */\nexport const useDialog_unstable = (props: DialogProps): DialogState => {\n  const { children, modalType = 'modal', onOpenChange, inertTrapFocus = false } = props;\n\n  const [trigger, content] = childrenToTriggerAndContent(children);\n\n  const [open, setOpen] = useControllableState({\n    state: props.open,\n    defaultState: props.defaultOpen,\n    initialState: false,\n  });\n\n  const requestOpenChange = useEventCallback((data: DialogOpenChangeData) => {\n    onOpenChange?.(data.event, data);\n\n    // if user prevents default then do not change state value\n    // otherwise updates state value and trigger reference to the element that caused the opening\n    if (!data.event.isDefaultPrevented()) {\n      setOpen(data.open);\n    }\n  });\n\n  const focusRef = useFocusFirstElement(open, modalType);\n\n  const { modalAttributes, triggerAttributes } = useModalAttributes({\n    trapFocus: modalType !== 'non-modal',\n    legacyTrapFocus: !inertTrapFocus,\n  });\n  const isNestedDialog = useHasParentContext(DialogContext);\n\n  return {\n    components: {\n      surfaceMotion: DialogSurfaceMotion,\n    },\n    inertTrapFocus,\n    open,\n    modalType,\n    content,\n    trigger,\n    requestOpenChange,\n    dialogTitleId: useId('dialog-title-'),\n    isNestedDialog,\n    dialogRef: focusRef,\n    modalAttributes,\n    triggerAttributes,\n    surfaceMotion: presenceMotionSlot(props.surfaceMotion, {\n      elementType: DialogSurfaceMotion,\n      defaultProps: {\n        appear: true,\n        visible: open,\n        unmountOnExit: true,\n      },\n    }),\n  };\n};\n\n/**\n * Extracts trigger and content from children\n */\nfunction childrenToTriggerAndContent(\n  children: React.ReactNode,\n): readonly [trigger: React.ReactNode, content: React.ReactNode] {\n  const childrenArray = React.Children.toArray(children) as React.ReactElement[];\n  if (process.env.NODE_ENV !== 'production') {\n    if (childrenArray.length !== 1 && childrenArray.length !== 2) {\n      // eslint-disable-next-line no-console\n      console.warn(/* #__DE-INDENT__ */ `\n        @fluentui/react-dialog [useDialog]:\n        Dialog must contain at least one child <DialogSurface/>,\n        and at most two children <DialogTrigger/> <DialogSurface/> (in this order).\n      `);\n    }\n  }\n  switch (childrenArray.length) {\n    // case where there's a trigger followed by content\n    case 2:\n      return childrenArray as [trigger: React.ReactNode, content: React.ReactNode];\n    // case where there's only content\n    case 1:\n      return [undefined, childrenArray[0]];\n    // unknown case\n    default:\n      return [undefined, undefined];\n  }\n}\n"],"names":["useHasParentContext","useModalAttributes","presenceMotionSlot","useControllableState","useEventCallback","useId","React","useFocusFirstElement","DialogContext","DialogSurfaceMotion","useDialog_unstable","props","children","modalType","onOpenChange","inertTrapFocus","trigger","content","childrenToTriggerAndContent","open","setOpen","state","defaultState","defaultOpen","initialState","requestOpenChange","data","event","isDefaultPrevented","focusRef","modalAttributes","triggerAttributes","trapFocus","legacyTrapFocus","isNestedDialog","components","surfaceMotion","dialogTitleId","dialogRef","elementType","defaultProps","appear","visible","unmountOnExit","childrenArray","Children","toArray","process","env","NODE_ENV","length","console","warn","undefined"],"mappings":";;;;+BAmBaU;;;;;;;sCAnBuB,mCAAmC;8BACpC,0BAA0B;6BAC1B,yBAAyB;gCACE,4BAA4B;iEACnE,QAAQ;uBAEM,cAAc;0BACrB,iBAAiB;qCACX,yBAAyB;AAWtD,2BAA2B,CAACC;IACjC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,OAAO,EAAEC,YAAY,EAAEC,iBAAiB,KAAK,EAAE,GAAGJ;IAEhF,MAAM,CAACK,SAASC,QAAQ,GAAGC,4BAA4BN;IAEvD,MAAM,CAACO,MAAMC,QAAQ,OAAGjB,oCAAAA,EAAqB;QAC3CkB,OAAOV,MAAMQ,IAAI;QACjBG,cAAcX,MAAMY,WAAW;QAC/BC,cAAc;IAChB;IAEA,MAAMC,wBAAoBrB,gCAAAA,EAAiB,CAACsB;QAC1CZ,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeY,KAAKC,KAAK,EAAED;QAE3B,0DAA0D;QAC1D,6FAA6F;QAC7F,IAAI,CAACA,KAAKC,KAAK,CAACC,kBAAkB,IAAI;YACpCR,QAAQM,KAAKP,IAAI;QACnB;IACF;IAEA,MAAMU,eAAWtB,2BAAAA,EAAqBY,MAAMN;IAE5C,MAAM,EAAEiB,eAAe,EAAEC,iBAAiB,EAAE,OAAG9B,gCAAAA,EAAmB;QAChE+B,WAAWnB,cAAc;QACzBoB,iBAAiB,CAAClB;IACpB;IACA,MAAMmB,qBAAiBlC,yCAAAA,EAAoBQ,uBAAAA;IAE3C,OAAO;QACL2B,YAAY;YACVC,eAAe3B,wCAAAA;QACjB;QACAM;QACAI;QACAN;QACAI;QACAD;QACAS;QACAY,mBAAehC,qBAAAA,EAAM;QACrB6B;QACAI,WAAWT;QACXC;QACAC;QACAK,mBAAelC,+BAAAA,EAAmBS,MAAMyB,aAAa,EAAE;YACrDG,aAAa9B,wCAAAA;YACb+B,cAAc;gBACZC,QAAQ;gBACRC,SAASvB;gBACTwB,eAAe;YACjB;QACF;IACF;AACF,EAAE;AAEF;;CAEC,GACD,SAASzB,4BACPN,QAAyB;IAEzB,MAAMgC,gBAAgBtC,OAAMuC,QAAQ,CAACC,OAAO,CAAClC;IAC7C,IAAImC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAIL,cAAcM,MAAM,KAAK,KAAKN,cAAcM,MAAM,KAAK,GAAG;YAC5D,sCAAsC;YACtCC,QAAQC,IAAI,CAAsB,CAAC;;2EAInC,CAAC;QACH;IACF;IACA,OAAQR,cAAcM,MAAM;QAC1B,mDAAmD;QACnD,KAAK;YACH,OAAON;QACT,kCAAkC;QAClC,KAAK;YACH,OAAO;gBAACS;gBAAWT,aAAa,CAAC,EAAE;aAAC;QACtC,eAAe;QACf;YACE,OAAO;gBAACS;gBAAWA;aAAU;IACjC;AACF"}
+{"version":3,"sources":["../src/components/Dialog/useDialog.ts"],"sourcesContent":["'use client';\n\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { useControllableState, useEventCallback, useId } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { useFocusFirstElement } from '../../utils';\nimport { DialogContext } from '../../contexts';\nimport { DialogSurfaceMotion } from '../DialogSurfaceMotion';\nimport type { DialogOpenChangeData, DialogProps, DialogState } from './Dialog.types';\n\n/**\n * Create the state required to render Dialog.\n *\n * The returned state can be modified with hooks such as useDialogStyles_unstable,\n * before being passed to renderDialog_unstable.\n *\n * @param props - props from this instance of Dialog\n */\nexport const useDialog_unstable = (props: DialogProps): DialogState => {\n  const { children, modalType = 'modal', onOpenChange, inertTrapFocus = false } = props;\n\n  const [trigger, content] = childrenToTriggerAndContent(children);\n\n  const [open, setOpen] = useControllableState({\n    state: props.open,\n    defaultState: props.defaultOpen,\n    initialState: false,\n  });\n\n  const requestOpenChange = useEventCallback((data: DialogOpenChangeData) => {\n    onOpenChange?.(data.event, data);\n\n    // if user prevents default then do not change state value\n    // otherwise updates state value and trigger reference to the element that caused the opening\n    if (!data.event.isDefaultPrevented()) {\n      setOpen(data.open);\n    }\n  });\n\n  const focusRef = useFocusFirstElement(open, modalType);\n\n  const { modalAttributes, triggerAttributes } = useModalAttributes({\n    trapFocus: modalType !== 'non-modal',\n    legacyTrapFocus: !inertTrapFocus,\n  });\n  const isNestedDialog = useHasParentContext(DialogContext);\n\n  return {\n    components: {\n      surfaceMotion: DialogSurfaceMotion,\n    },\n    inertTrapFocus,\n    open,\n    modalType,\n    content,\n    trigger,\n    requestOpenChange,\n    dialogTitleId: useId('dialog-title-'),\n    isNestedDialog,\n    dialogRef: focusRef,\n    modalAttributes,\n    triggerAttributes,\n    surfaceMotion: presenceMotionSlot(props.surfaceMotion, {\n      elementType: DialogSurfaceMotion,\n      defaultProps: {\n        appear: true,\n        visible: open,\n        unmountOnExit: true,\n      },\n    }),\n  };\n};\n\n/**\n * Extracts trigger and content from children\n */\nfunction childrenToTriggerAndContent(\n  children: React.ReactNode,\n): readonly [trigger: React.ReactNode, content: React.ReactNode] {\n  const childrenArray = React.Children.toArray(children) as React.ReactElement[];\n  if (process.env.NODE_ENV !== 'production') {\n    if (childrenArray.length !== 1 && childrenArray.length !== 2) {\n      // eslint-disable-next-line no-console\n      console.warn(/* #__DE-INDENT__ */ `\n        @fluentui/react-dialog [useDialog]:\n        Dialog must contain at least one child <DialogSurface/>,\n        and at most two children <DialogTrigger/> <DialogSurface/> (in this order).\n      `);\n    }\n  }\n  switch (childrenArray.length) {\n    // case where there's a trigger followed by content\n    case 2:\n      return childrenArray as [trigger: React.ReactNode, content: React.ReactNode];\n    // case where there's only content\n    case 1:\n      return [undefined, childrenArray[0]];\n    // unknown case\n    default:\n      return [undefined, undefined];\n  }\n}\n"],"names":["useHasParentContext","useModalAttributes","presenceMotionSlot","useControllableState","useEventCallback","useId","React","useFocusFirstElement","DialogContext","DialogSurfaceMotion","useDialog_unstable","props","children","modalType","onOpenChange","inertTrapFocus","trigger","content","childrenToTriggerAndContent","open","setOpen","state","defaultState","defaultOpen","initialState","requestOpenChange","data","event","isDefaultPrevented","focusRef","modalAttributes","triggerAttributes","trapFocus","legacyTrapFocus","isNestedDialog","components","surfaceMotion","dialogTitleId","dialogRef","elementType","defaultProps","appear","visible","unmountOnExit","childrenArray","Children","toArray","process","env","NODE_ENV","length","console","warn","undefined"],"mappings":"AAAA;;;;;+BAqBaU;;;;;;;sCAnBuB,mCAAmC;8BACpC,0BAA0B;6BAC1B,yBAAyB;gCACE,4BAA4B;iEACnE,QAAQ;uBAEM,cAAc;0BACrB,iBAAiB;qCACX,yBAAyB;AAWtD,2BAA2B,CAACC;IACjC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,OAAO,EAAEC,YAAY,EAAEC,iBAAiB,KAAK,EAAE,GAAGJ;IAEhF,MAAM,CAACK,SAASC,QAAQ,GAAGC,4BAA4BN;IAEvD,MAAM,CAACO,MAAMC,QAAQ,GAAGjB,wCAAAA,EAAqB;QAC3CkB,OAAOV,MAAMQ,IAAI;QACjBG,cAAcX,MAAMY,WAAW;QAC/BC,cAAc;IAChB;IAEA,MAAMC,wBAAoBrB,gCAAAA,EAAiB,CAACsB;QAC1CZ,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeY,KAAKC,KAAK,EAAED;QAE3B,0DAA0D;QAC1D,6FAA6F;QAC7F,IAAI,CAACA,KAAKC,KAAK,CAACC,kBAAkB,IAAI;YACpCR,QAAQM,KAAKP,IAAI;QACnB;IACF;IAEA,MAAMU,eAAWtB,2BAAAA,EAAqBY,MAAMN;IAE5C,MAAM,EAAEiB,eAAe,EAAEC,iBAAiB,EAAE,OAAG9B,gCAAAA,EAAmB;QAChE+B,WAAWnB,cAAc;QACzBoB,iBAAiB,CAAClB;IACpB;IACA,MAAMmB,qBAAiBlC,yCAAAA,EAAoBQ,uBAAAA;IAE3C,OAAO;QACL2B,YAAY;YACVC,eAAe3B,wCAAAA;QACjB;QACAM;QACAI;QACAN;QACAI;QACAD;QACAS;QACAY,mBAAehC,qBAAAA,EAAM;QACrB6B;QACAI,WAAWT;QACXC;QACAC;QACAK,mBAAelC,+BAAAA,EAAmBS,MAAMyB,aAAa,EAAE;YACrDG,aAAa9B,wCAAAA;YACb+B,cAAc;gBACZC,QAAQ;gBACRC,SAASvB;gBACTwB,eAAe;YACjB;QACF;IACF;AACF,EAAE;AAEF;;CAEC,GACD,SAASzB,4BACPN,QAAyB;IAEzB,MAAMgC,gBAAgBtC,OAAMuC,QAAQ,CAACC,OAAO,CAAClC;IAC7C,IAAImC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAIL,cAAcM,MAAM,KAAK,KAAKN,cAAcM,MAAM,KAAK,GAAG;YAC5D,sCAAsC;YACtCC,QAAQC,IAAI,CAAsB,CAAC;;2EAInC,CAAC;QACH;IACF;IACA,OAAQR,cAAcM,MAAM;QAC1B,mDAAmD;QACnD,KAAK;YACH,OAAON;QACT,kCAAkC;QAClC,KAAK;YACH,OAAO;gBAACS;gBAAWT,aAAa,CAAC,EAAE;aAAC;QACtC,eAAe;QACf;YACE,OAAO;gBAACS;gBAAWA;aAAU;IACjC;AACF"}

package/lib-commonjs/components/DialogActions/DialogActions.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/DialogActions/DialogActions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogActions/DialogActions.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogActions_unstable } from './useDialogActions';\nimport { renderDialogActions_unstable } from './renderDialogActions';\nimport { useDialogActionsStyles_unstable } from './useDialogActionsStyles.styles';\nimport type { DialogActionsProps } from './DialogActions.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * `DialogActions` is a container for the actions of the dialog.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogActions: ForwardRefComponent<DialogActionsProps> = React.forwardRef((props, ref) => {\n  const state = useDialogActions_unstable(props, ref);\n\n  useDialogActionsStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDialogActionsStyles_unstable')(state);\n\n  return renderDialogActions_unstable(state);\n});\n\nDialogActions.displayName = 'DialogActions';\n"],"names":["React","useDialogActions_unstable","renderDialogActions_unstable","useDialogActionsStyles_unstable","useCustomStyleHook_unstable","DialogActions","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAYaK;;;;;;;iEAZU,QAAQ;kCACW,qBAAqB;qCAClB,wBAAwB;8CACrB,kCAAkC;qCAGtC,kCAAkC;AAMvE,sBAAMA,WAAAA,GAAyDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,+CAAAA,EAA0BM,OAAOC;QAE/CL,6DAAAA,EAAgCM;QAEhCL,gDAAAA,EAA4B,mCAAmCK;IAE/D,WAAOP,iDAAAA,EAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/DialogActions/DialogActions.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDialogActions_unstable } from './useDialogActions';\nimport { renderDialogActions_unstable } from './renderDialogActions';\nimport { useDialogActionsStyles_unstable } from './useDialogActionsStyles.styles';\nimport type { DialogActionsProps } from './DialogActions.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * `DialogActions` is a container for the actions of the dialog.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogActions: ForwardRefComponent<DialogActionsProps> = React.forwardRef((props, ref) => {\n  const state = useDialogActions_unstable(props, ref);\n\n  useDialogActionsStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDialogActionsStyles_unstable')(state);\n\n  return renderDialogActions_unstable(state);\n});\n\nDialogActions.displayName = 'DialogActions';\n"],"names":["React","useDialogActions_unstable","renderDialogActions_unstable","useDialogActionsStyles_unstable","useCustomStyleHook_unstable","DialogActions","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;kCACW,qBAAqB;qCAClB,wBAAwB;8CACrB,kCAAkC;qCAGtC,kCAAkC;AAMvE,MAAMK,gBAAAA,WAAAA,GAAyDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,YAAQR,2CAAAA,EAA0BM,OAAOC;QAE/CL,6DAAAA,EAAgCM;QAEhCL,gDAAAA,EAA4B,mCAAmCK;IAE/D,WAAOP,iDAAAA,EAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

package/lib-commonjs/components/DialogActions/renderDialogActions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogActions/renderDialogActions.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DialogActionsState, DialogActionsSlots } from './DialogActions.types';\n\n/**\n * Render the final JSX of DialogActions\n */\nexport const renderDialogActions_unstable = (state: DialogActionsState) => {\n  assertSlots<DialogActionsSlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDialogActions_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAMjD,MAAMC,+BAA+B,CAACC;QAC3CF,2BAAAA,EAAgCE;IAEhC,qDAAqD;IACrD,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}
+{"version":3,"sources":["../src/components/DialogActions/renderDialogActions.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DialogActionsState, DialogActionsSlots } from './DialogActions.types';\n\n/**\n * Render the final JSX of DialogActions\n */\nexport const renderDialogActions_unstable = (state: DialogActionsState): JSXElement => {\n  assertSlots<DialogActionsSlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDialogActions_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAOjD,MAAMC,+BAA+B,CAACC;QAC3CF,2BAAAA,EAAgCE;IAEhC,qDAAqD;IACrD,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

package/lib-commonjs/components/DialogActions/useDialogActionsStyles.styles.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/DialogActions/useDialogActionsStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDialogActionsStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { DIALOG_GAP, DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR } from '../../contexts/constants';\nexport const dialogActionsClassNames = {\n    root: 'fui-DialogActions'\n};\n/**\n * Styles for the root slot\n */ const useResetStyles = makeResetStyles({\n    gap: DIALOG_GAP,\n    height: 'fit-content',\n    boxSizing: 'border-box',\n    display: 'flex',\n    gridRowStart: 3,\n    gridRowEnd: 3,\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n        flexDirection: 'column',\n        justifySelf: 'stretch'\n    }\n});\nconst useStyles = makeStyles({\n    gridPositionEnd: {\n        justifySelf: 'end',\n        gridColumnStart: 2,\n        gridColumnEnd: 4,\n        [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n            gridColumnStart: 1,\n            gridRowStart: 4,\n            gridRowEnd: 'auto'\n        }\n    },\n    gridPositionStart: {\n        justifySelf: 'start',\n        gridColumnStart: 1,\n        gridColumnEnd: 2,\n        [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n            gridColumnEnd: 4,\n            gridRowStart: 3,\n            gridRowEnd: 'auto'\n        }\n    },\n    fluidStart: {\n        gridColumnEnd: 4\n    },\n    fluidEnd: {\n        gridColumnStart: 1\n    }\n});\n/**\n * Apply styling to the DialogActions slots based on the state\n */ export const useDialogActionsStyles_unstable = (state)=>{\n    'use no memo';\n    const resetStyles = useResetStyles();\n    const styles = useStyles();\n    state.root.className = mergeClasses(dialogActionsClassNames.root, resetStyles, state.position === 'start' && styles.gridPositionStart, state.position === 'end' && styles.gridPositionEnd, state.fluid && state.position === 'start' && styles.fluidStart, state.fluid && state.position === 'end' && styles.fluidEnd, state.root.className);\n    return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","DIALOG_GAP","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","dialogActionsClassNames","root","useResetStyles","r","s","useStyles","gridPositionEnd","Bdqf98w","Br312pm","Bw0ie65","B6n781s","Bv5d0be","v4ugfu","gridPositionStart","Bojbm9c","fluidStart","fluidEnd","d","m","useDialogActionsStyles_unstable","state","resetStyles","styles","className","position","fluid"],"mappings":";;;;;;;;;;;IAEaK,uBAAuB;;;mCA+CY;;;;uBAjDU,gBAAgB;AAEnE,gCAAgC;IACnCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,cAAc,GAAA,WAAA,OAAGP,oBAAA,EAAA,WAAA,MAAA;IAAAQ,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAW1B,CAAC;AACF,MAAMC,SAAS,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAU,eAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,iBAAA,EAAA;QAAAN,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAK,OAAA,EAAA;QAAAH,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAG,UAAA,EAAA;QAAAN,OAAA,EAAA;IAAA;IAAAO,QAAA,EAAA;QAAAR,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAS,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;KAAA;AAAA,CA2BjB,CAAC;AAGS,MAAMC,mCAAmCC,KAAK,IAAG;IACxD,aAAa;IACb,MAAMC,WAAW,GAAGnB,cAAc,CAAC,CAAC;IACpC,MAAMoB,MAAM,GAAGjB,SAAS,CAAC,CAAC;IAC1Be,KAAK,CAACnB,IAAI,CAACsB,SAAS,OAAG1B,mBAAY,EAACG,uBAAuB,CAACC,IAAI,EAAEoB,WAAW,EAAED,KAAK,CAACI,QAAQ,KAAK,OAAO,IAAIF,MAAM,CAACT,iBAAiB,EAAEO,KAAK,CAACI,QAAQ,KAAK,KAAK,IAAIF,MAAM,CAAChB,eAAe,EAAEc,KAAK,CAACK,KAAK,IAAIL,KAAK,CAACI,QAAQ,KAAK,OAAO,IAAIF,MAAM,CAACP,UAAU,EAAEK,KAAK,CAACK,KAAK,IAAIL,KAAK,CAACI,QAAQ,KAAK,KAAK,IAAIF,MAAM,CAACN,QAAQ,EAAEI,KAAK,CAACnB,IAAI,CAACsB,SAAS,CAAC;IAC5U,OAAOH,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useDialogActionsStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { DIALOG_GAP, DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR } from '../../contexts/constants';\nexport const dialogActionsClassNames = {\n    root: 'fui-DialogActions'\n};\n/**\n * Styles for the root slot\n */ const useResetStyles = makeResetStyles({\n    gap: DIALOG_GAP,\n    height: 'fit-content',\n    boxSizing: 'border-box',\n    display: 'flex',\n    gridRowStart: 3,\n    gridRowEnd: 3,\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n        flexDirection: 'column',\n        justifySelf: 'stretch'\n    }\n});\nconst useStyles = makeStyles({\n    gridPositionEnd: {\n        justifySelf: 'end',\n        gridColumnStart: 2,\n        gridColumnEnd: 4,\n        [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n            gridColumnStart: 1,\n            gridRowStart: 4,\n            gridRowEnd: 'auto'\n        }\n    },\n    gridPositionStart: {\n        justifySelf: 'start',\n        gridColumnStart: 1,\n        gridColumnEnd: 2,\n        [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n            gridColumnEnd: 4,\n            gridRowStart: 3,\n            gridRowEnd: 'auto'\n        }\n    },\n    fluidStart: {\n        gridColumnEnd: 4\n    },\n    fluidEnd: {\n        gridColumnStart: 1\n    }\n});\n/**\n * Apply styling to the DialogActions slots based on the state\n */ export const useDialogActionsStyles_unstable = (state)=>{\n    'use no memo';\n    const resetStyles = useResetStyles();\n    const styles = useStyles();\n    state.root.className = mergeClasses(dialogActionsClassNames.root, resetStyles, state.position === 'start' && styles.gridPositionStart, state.position === 'end' && styles.gridPositionEnd, state.fluid && state.position === 'start' && styles.fluidStart, state.fluid && state.position === 'end' && styles.fluidEnd, state.root.className);\n    return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","DIALOG_GAP","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","dialogActionsClassNames","root","useResetStyles","r","s","useStyles","gridPositionEnd","Bdqf98w","Br312pm","Bw0ie65","B6n781s","Bv5d0be","v4ugfu","gridPositionStart","Bojbm9c","fluidStart","fluidEnd","d","m","useDialogActionsStyles_unstable","state","resetStyles","styles","className","position","fluid"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCK,uBAAuB;;;IA+CnBmB,+BAA+B;;;;uBAjDU,gBAAgB;AAEnE,gCAAgC;IACnClB,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,cAAc,GAAA,WAAA,OAAGP,oBAAA,EAAA,WAAA,MAAA;IAAAQ,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAW1B,CAAC;AACF,MAAMC,SAAS,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAU,eAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,iBAAA,EAAA;QAAAN,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAK,OAAA,EAAA;QAAAH,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAG,UAAA,EAAA;QAAAN,OAAA,EAAA;IAAA;IAAAO,QAAA,EAAA;QAAAR,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAS,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;KAAA;AAAA,CA2BjB,CAAC;AAGS,wCAAyCE,KAAK,IAAG;IACxD,aAAa;IACb,MAAMC,WAAW,GAAGnB,cAAc,CAAC,CAAC;IACpC,MAAMoB,MAAM,GAAGjB,SAAS,CAAC,CAAC;IAC1Be,KAAK,CAACnB,IAAI,CAACsB,SAAS,OAAG1B,mBAAY,EAACG,uBAAuB,CAACC,IAAI,EAAEoB,WAAW,EAAED,KAAK,CAACI,QAAQ,KAAK,OAAO,IAAIF,MAAM,CAACT,iBAAiB,EAAEO,KAAK,CAACI,QAAQ,KAAK,KAAK,IAAIF,MAAM,CAAChB,eAAe,EAAEc,KAAK,CAACK,KAAK,IAAIL,KAAK,CAACI,QAAQ,KAAK,OAAO,IAAIF,MAAM,CAACP,UAAU,EAAEK,KAAK,CAACK,KAAK,IAAIL,KAAK,CAACI,QAAQ,KAAK,KAAK,IAAIF,MAAM,CAACN,QAAQ,EAAEI,KAAK,CAACnB,IAAI,CAACsB,SAAS,CAAC;IAC5U,OAAOH,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/DialogActions/useDialogActionsStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/DialogActions/useDialogActionsStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogActions/useDialogActionsStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { DialogActionsSlots, DialogActionsState } from './DialogActions.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { DIALOG_GAP, DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR } from '../../contexts/constants';\n\nexport const dialogActionsClassNames: SlotClassNames<DialogActionsSlots> = {\n  root: 'fui-DialogActions',\n};\n\n/**\n * Styles for the root slot\n */\nconst useResetStyles = makeResetStyles({\n  gap: DIALOG_GAP,\n  height: 'fit-content',\n  boxSizing: 'border-box',\n  display: 'flex',\n  gridRowStart: 3,\n  gridRowEnd: 3,\n  [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n    flexDirection: 'column',\n    justifySelf: 'stretch',\n  },\n});\n\nconst useStyles = makeStyles({\n  gridPositionEnd: {\n    justifySelf: 'end',\n    gridColumnStart: 2,\n    gridColumnEnd: 4,\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n      gridColumnStart: 1,\n      gridRowStart: 4,\n      gridRowEnd: 'auto',\n    },\n  },\n  gridPositionStart: {\n    justifySelf: 'start',\n    gridColumnStart: 1,\n    gridColumnEnd: 2,\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n      gridColumnEnd: 4,\n      gridRowStart: 3,\n      gridRowEnd: 'auto',\n    },\n  },\n  fluidStart: {\n    gridColumnEnd: 4,\n  },\n  fluidEnd: {\n    gridColumnStart: 1,\n  },\n});\n\n/**\n * Apply styling to the DialogActions slots based on the state\n */\nexport const useDialogActionsStyles_unstable = (state: DialogActionsState): DialogActionsState => {\n  'use no memo';\n\n  const resetStyles = useResetStyles();\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    dialogActionsClassNames.root,\n    resetStyles,\n    state.position === 'start' && styles.gridPositionStart,\n    state.position === 'end' && styles.gridPositionEnd,\n    state.fluid && state.position === 'start' && styles.fluidStart,\n    state.fluid && state.position === 'end' && styles.fluidEnd,\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","DIALOG_GAP","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","dialogActionsClassNames","root","useResetStyles","gap","height","boxSizing","display","gridRowStart","gridRowEnd","flexDirection","justifySelf","useStyles","gridPositionEnd","gridColumnStart","gridColumnEnd","gridPositionStart","fluidStart","fluidEnd","useDialogActionsStyles_unstable","state","resetStyles","styles","className","position","fluid"],"mappings":";;;;;;;;;;;IAKaK,uBAAAA;;;IAoDAkB,+BAAAA;;;;uBAzD6C,iBAAiB;2BAGR,2BAA2B;AAEvF,gCAAoE;IACzEjB,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,qBAAiBP,sBAAAA,EAAgB;IACrCQ,KAAKL,qBAAAA;IACLM,QAAQ;IACRC,WAAW;IACXC,SAAS;IACTC,cAAc;IACdC,YAAY;IACZ,CAACT,iDAAAA,CAAuC,EAAE;QACxCU,eAAe;QACfC,aAAa;IACf;AACF;AAEA,MAAMC,gBAAYf,iBAAAA,EAAW;IAC3BgB,iBAAiB;QACfF,aAAa;QACbG,iBAAiB;QACjBC,eAAe;QACf,CAACf,iDAAAA,CAAuC,EAAE;YACxCc,iBAAiB;YACjBN,cAAc;YACdC,YAAY;QACd;IACF;IACAO,mBAAmB;QACjBL,aAAa;QACbG,iBAAiB;QACjBC,eAAe;QACf,CAACf,iDAAAA,CAAuC,EAAE;YACxCe,eAAe;YACfP,cAAc;YACdC,YAAY;QACd;IACF;IACAQ,YAAY;QACVF,eAAe;IACjB;IACAG,UAAU;QACRJ,iBAAiB;IACnB;AACF;AAKO,wCAAwC,CAACM;IAC9C;IAEA,MAAMC,cAAclB;IACpB,MAAMmB,SAASV;IACfQ,MAAMlB,IAAI,CAACqB,SAAS,OAAGzB,mBAAAA,EACrBG,wBAAwBC,IAAI,EAC5BmB,aACAD,MAAMI,QAAQ,KAAK,WAAWF,OAAON,iBAAiB,EACtDI,MAAMI,QAAQ,KAAK,SAASF,OAAOT,eAAe,EAClDO,MAAMK,KAAK,IAAIL,MAAMI,QAAQ,KAAK,WAAWF,OAAOL,UAAU,EAC9DG,MAAMK,KAAK,IAAIL,MAAMI,QAAQ,KAAK,SAASF,OAAOJ,QAAQ,EAC1DE,MAAMlB,IAAI,CAACqB,SAAS;IAEtB,OAAOH;AACT,EAAE"}
+{"version":3,"sources":["../src/components/DialogActions/useDialogActionsStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { DialogActionsSlots, DialogActionsState } from './DialogActions.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { DIALOG_GAP, DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR } from '../../contexts/constants';\n\nexport const dialogActionsClassNames: SlotClassNames<DialogActionsSlots> = {\n  root: 'fui-DialogActions',\n};\n\n/**\n * Styles for the root slot\n */\nconst useResetStyles = makeResetStyles({\n  gap: DIALOG_GAP,\n  height: 'fit-content',\n  boxSizing: 'border-box',\n  display: 'flex',\n  gridRowStart: 3,\n  gridRowEnd: 3,\n  [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n    flexDirection: 'column',\n    justifySelf: 'stretch',\n  },\n});\n\nconst useStyles = makeStyles({\n  gridPositionEnd: {\n    justifySelf: 'end',\n    gridColumnStart: 2,\n    gridColumnEnd: 4,\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n      gridColumnStart: 1,\n      gridRowStart: 4,\n      gridRowEnd: 'auto',\n    },\n  },\n  gridPositionStart: {\n    justifySelf: 'start',\n    gridColumnStart: 1,\n    gridColumnEnd: 2,\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n      gridColumnEnd: 4,\n      gridRowStart: 3,\n      gridRowEnd: 'auto',\n    },\n  },\n  fluidStart: {\n    gridColumnEnd: 4,\n  },\n  fluidEnd: {\n    gridColumnStart: 1,\n  },\n});\n\n/**\n * Apply styling to the DialogActions slots based on the state\n */\nexport const useDialogActionsStyles_unstable = (state: DialogActionsState): DialogActionsState => {\n  'use no memo';\n\n  const resetStyles = useResetStyles();\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    dialogActionsClassNames.root,\n    resetStyles,\n    state.position === 'start' && styles.gridPositionStart,\n    state.position === 'end' && styles.gridPositionEnd,\n    state.fluid && state.position === 'start' && styles.fluidStart,\n    state.fluid && state.position === 'end' && styles.fluidEnd,\n    state.root.className,\n  );\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","DIALOG_GAP","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","dialogActionsClassNames","root","useResetStyles","gap","height","boxSizing","display","gridRowStart","gridRowEnd","flexDirection","justifySelf","useStyles","gridPositionEnd","gridColumnStart","gridColumnEnd","gridPositionStart","fluidStart","fluidEnd","useDialogActionsStyles_unstable","state","resetStyles","styles","className","position","fluid"],"mappings":"AAAA;;;;;;;;;;;;IAOaK,uBAAAA;;;mCAoDAkB;eAAAA;;;uBAzD6C,iBAAiB;2BAGR,2BAA2B;AAEvF,gCAAoE;IACzEjB,MAAM;AACR,EAAE;AAEF;;CAEC,GACD,MAAMC,qBAAiBP,sBAAAA,EAAgB;IACrCQ,KAAKL,qBAAAA;IACLM,QAAQ;IACRC,WAAW;IACXC,SAAS;IACTC,cAAc;IACdC,YAAY;IACZ,CAACT,iDAAAA,CAAuC,EAAE;QACxCU,eAAe;QACfC,aAAa;IACf;AACF;AAEA,MAAMC,gBAAYf,iBAAAA,EAAW;IAC3BgB,iBAAiB;QACfF,aAAa;QACbG,iBAAiB;QACjBC,eAAe;QACf,CAACf,iDAAAA,CAAuC,EAAE;YACxCc,iBAAiB;YACjBN,cAAc;YACdC,YAAY;QACd;IACF;IACAO,mBAAmB;QACjBL,aAAa;QACbG,iBAAiB;QACjBC,eAAe;QACf,CAACf,iDAAAA,CAAuC,EAAE;YACxCe,eAAe;YACfP,cAAc;YACdC,YAAY;QACd;IACF;IACAQ,YAAY;QACVF,eAAe;IACjB;IACAG,UAAU;QACRJ,iBAAiB;IACnB;AACF;AAKO,wCAAwC,CAACM;IAC9C;IAEA,MAAMC,cAAclB;IACpB,MAAMmB,SAASV;IACfQ,MAAMlB,IAAI,CAACqB,SAAS,OAAGzB,mBAAAA,EACrBG,wBAAwBC,IAAI,EAC5BmB,aACAD,MAAMI,QAAQ,KAAK,WAAWF,OAAON,iBAAiB,EACtDI,MAAMI,QAAQ,KAAK,SAASF,OAAOT,eAAe,EAClDO,MAAMK,KAAK,IAAIL,MAAMI,QAAQ,KAAK,WAAWF,OAAOL,UAAU,EAC9DG,MAAMK,KAAK,IAAIL,MAAMI,QAAQ,KAAK,SAASF,OAAOJ,QAAQ,EAC1DE,MAAMlB,IAAI,CAACqB,SAAS;IAEtB,OAAOH;AACT,EAAE"}

package/lib-commonjs/components/DialogBody/DialogBody.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/DialogBody/DialogBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogBody/DialogBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogBody_unstable } from './useDialogBody';\nimport { renderDialogBody_unstable } from './renderDialogBody';\nimport { useDialogBodyStyles_unstable } from './useDialogBodyStyles.styles';\nimport type { DialogBodyProps } from './DialogBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * The `DialogBody` is a container where the content of the dialog is rendered.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogBody: ForwardRefComponent<DialogBodyProps> = React.forwardRef((props, ref) => {\n  const state = useDialogBody_unstable(props, ref);\n\n  useDialogBodyStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDialogBodyStyles_unstable')(state);\n\n  return renderDialogBody_unstable(state);\n});\n\nDialogBody.displayName = 'DialogBody';\n"],"names":["React","useDialogBody_unstable","renderDialogBody_unstable","useDialogBodyStyles_unstable","useCustomStyleHook_unstable","DialogBody","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAYaK;;;;;;;iEAZU,QAAQ;+BACQ,kBAAkB;kCACf,qBAAqB;2CAClB,+BAA+B;qCAGhC,kCAAkC;AAMvE,mBAAMA,WAAAA,GAAmDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,yCAAAA,EAAuBM,OAAOC;QAE5CL,uDAAAA,EAA6BM;QAE7BL,gDAAAA,EAA4B,gCAAgCK;IAE5D,WAAOP,2CAAAA,EAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/DialogBody/DialogBody.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDialogBody_unstable } from './useDialogBody';\nimport { renderDialogBody_unstable } from './renderDialogBody';\nimport { useDialogBodyStyles_unstable } from './useDialogBodyStyles.styles';\nimport type { DialogBodyProps } from './DialogBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * The `DialogBody` is a container where the content of the dialog is rendered.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogBody: ForwardRefComponent<DialogBodyProps> = React.forwardRef((props, ref) => {\n  const state = useDialogBody_unstable(props, ref);\n\n  useDialogBodyStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useDialogBodyStyles_unstable')(state);\n\n  return renderDialogBody_unstable(state);\n});\n\nDialogBody.displayName = 'DialogBody';\n"],"names":["React","useDialogBody_unstable","renderDialogBody_unstable","useDialogBodyStyles_unstable","useCustomStyleHook_unstable","DialogBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;+BACQ,kBAAkB;kCACf,qBAAqB;2CAClB,+BAA+B;qCAGhC,kCAAkC;AAMvE,MAAMK,aAAAA,WAAAA,GAAmDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,YAAQR,qCAAAA,EAAuBM,OAAOC;QAE5CL,uDAAAA,EAA6BM;QAE7BL,gDAAAA,EAA4B,gCAAgCK;IAE5D,WAAOP,2CAAAA,EAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib-commonjs/components/DialogBody/renderDialogBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DialogBody/renderDialogBody.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DialogBodyState, DialogBodySlots } from './DialogBody.types';\n\n/**\n * Render the final JSX of DialogBody\n */\nexport const renderDialogBody_unstable = (state: DialogBodyState) => {\n  assertSlots<DialogBodySlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDialogBody_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAMjD,MAAMC,4BAA4B,CAACC;QACxCF,2BAAAA,EAA6BE;IAE7B,qDAAqD;IACrD,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}
+{"version":3,"sources":["../src/components/DialogBody/renderDialogBody.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DialogBodyState, DialogBodySlots } from './DialogBody.types';\n\n/**\n * Render the final JSX of DialogBody\n */\nexport const renderDialogBody_unstable = (state: DialogBodyState): JSXElement => {\n  assertSlots<DialogBodySlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDialogBody_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAOjD,MAAMC,4BAA4B,CAACC;QACxCF,2BAAAA,EAA6BE;IAE7B,qDAAqD;IACrD,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

package/lib-commonjs/components/DialogBody/useDialogBodyStyles.styles.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/components/DialogBody/useDialogBodyStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDialogBodyStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { DIALOG_GAP, DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR, DIALOG_MEDIA_QUERY_SHORT_SCREEN, SURFACE_PADDING } from '../../contexts';\nexport const dialogBodyClassNames = {\n    root: 'fui-DialogBody'\n};\n/**\n * Styles for the root slot\n */ const useResetStyles = makeResetStyles({\n    overflow: 'unset',\n    gap: DIALOG_GAP,\n    display: 'grid',\n    maxHeight: [\n        `calc(100vh - 2 * ${SURFACE_PADDING})`,\n        `calc(100dvh - 2 * ${SURFACE_PADDING})`\n    ],\n    boxSizing: 'border-box',\n    gridTemplateRows: 'auto 1fr',\n    gridTemplateColumns: '1fr 1fr auto',\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n        maxWidth: '100vw',\n        gridTemplateRows: 'auto 1fr auto'\n    },\n    [DIALOG_MEDIA_QUERY_SHORT_SCREEN]: {\n        maxHeight: 'unset'\n    }\n});\n/**\n * Apply styling to the DialogBody slots based on the state\n */ export const useDialogBodyStyles_unstable = (state)=>{\n    'use no memo';\n    const resetStyles = useResetStyles();\n    state.root.className = mergeClasses(dialogBodyClassNames.root, resetStyles, state.root.className);\n    return state;\n};\n"],"names":["__resetStyles","mergeClasses","DIALOG_GAP","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","DIALOG_MEDIA_QUERY_SHORT_SCREEN","SURFACE_PADDING","dialogBodyClassNames","root","useResetStyles","r","s","useDialogBodyStyles_unstable","state","resetStyles","className"],"mappings":";;;;;;;;;;;IAEaM,oBAAoB;;;gCA0BY;eAA5BK;;;uBA5B6B,gBAAgB;AAEvD,6BAA6B;IAChCJ,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,cAAc,GAAA,WAAA,OAAGR,oBAAA,EAAA,WAAA,MAAA;IAAAS,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAkB1B,CAAC;AAGS,sCAAsCE,KAAK,IAAG;IACrD,aAAa;IACb,MAAMC,WAAW,GAAGL,cAAc,CAAC,CAAC;IACpCI,KAAK,CAACL,IAAI,CAACO,SAAS,OAAGb,mBAAY,EAACK,oBAAoB,CAACC,IAAI,EAAEM,WAAW,EAAED,KAAK,CAACL,IAAI,CAACO,SAAS,CAAC;IACjG,OAAOF,KAAK;AAChB,CAAC"}
+{"version":3,"sources":["useDialogBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { DIALOG_GAP, DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR, DIALOG_MEDIA_QUERY_SHORT_SCREEN, SURFACE_PADDING } from '../../contexts';\nexport const dialogBodyClassNames = {\n    root: 'fui-DialogBody'\n};\n/**\n * Styles for the root slot\n */ const useResetStyles = makeResetStyles({\n    overflow: 'unset',\n    gap: DIALOG_GAP,\n    display: 'grid',\n    maxHeight: [\n        `calc(100vh - 2 * ${SURFACE_PADDING})`,\n        `calc(100dvh - 2 * ${SURFACE_PADDING})`\n    ],\n    boxSizing: 'border-box',\n    gridTemplateRows: 'auto 1fr',\n    gridTemplateColumns: '1fr 1fr auto',\n    [DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n        maxWidth: '100vw',\n        gridTemplateRows: 'auto 1fr auto'\n    },\n    [DIALOG_MEDIA_QUERY_SHORT_SCREEN]: {\n        maxHeight: 'unset'\n    }\n});\n/**\n * Apply styling to the DialogBody slots based on the state\n */ export const useDialogBodyStyles_unstable = (state)=>{\n    'use no memo';\n    const resetStyles = useResetStyles();\n    state.root.className = mergeClasses(dialogBodyClassNames.root, resetStyles, state.root.className);\n    return state;\n};\n"],"names":["__resetStyles","mergeClasses","DIALOG_GAP","DIALOG_MEDIA_QUERY_BREAKPOINT_SELECTOR","DIALOG_MEDIA_QUERY_SHORT_SCREEN","SURFACE_PADDING","dialogBodyClassNames","root","useResetStyles","r","s","useDialogBodyStyles_unstable","state","resetStyles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCM,oBAAoB;;;gCA0BY;;;;uBA5BC,gBAAgB;AAEvD,6BAA6B;IAChCC,IAAI,EAAE;AACV,CAAC;AACD;;CAEA,GAAI,MAAMC,cAAc,GAAA,WAAA,OAAGR,oBAAA,EAAA,WAAA,MAAA;IAAAS,CAAA,EAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;KAAA;AAAA,CAkB1B,CAAC;AAGS,MAAMC,gCAAgCC,KAAK,IAAG;IACrD,aAAa;IACb,MAAMC,WAAW,GAAGL,cAAc,CAAC,CAAC;IACpCI,KAAK,CAACL,IAAI,CAACO,SAAS,OAAGb,mBAAY,EAACK,oBAAoB,CAACC,IAAI,EAAEM,WAAW,EAAED,KAAK,CAACL,IAAI,CAACO,SAAS,CAAC;IACjG,OAAOF,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/DialogBody/useDialogBodyStyles.styles.raw.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true