@fluentui/react-dialog 9.1.5 → 9.1.6

package/lib/components/DialogContent/DialogContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogContent/DialogContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AACA,SAAS,+BAAT,QAAgD,0BAAhD;AAIA;;;AAGG;;AACH,OAAO,MAAM,aAAa,gBAA4C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACpG,MAAM,KAAK,GAAG,yBAAyB,CAAC,KAAD,EAAQ,GAAR,CAAvC;EAEA,+BAA+B,CAAC,KAAD,CAA/B;EACA,OAAO,4BAA4B,CAAC,KAAD,CAAnC;AACD,CALqE,CAA/D;AAOP,aAAa,CAAC,WAAd,GAA4B,eAA5B","sourcesContent":["import * as React from 'react';\nimport { useDialogContent_unstable } from './useDialogContent';\nimport { renderDialogContent_unstable } from './renderDialogContent';\nimport { useDialogContentStyles_unstable } from './useDialogContentStyles';\nimport type { DialogContentProps } from './DialogContent.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The `DialogContent` 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 DialogContent: ForwardRefComponent<DialogContentProps> = React.forwardRef((props, ref) => {\n  const state = useDialogContent_unstable(props, ref);\n\n  useDialogContentStyles_unstable(state);\n  return renderDialogContent_unstable(state);\n});\n\nDialogContent.displayName = 'DialogContent';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,yBAAyB,QAAQ,oBAAoB;AAC9D,SAASC,4BAA4B,QAAQ,uBAAuB;AACpE,SAASC,+BAA+B,QAAQ,0BAA0B;AAI1E;;;;AAIA,OAAO,MAAMC,aAAa,gBAA4CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpG,MAAMC,KAAK,GAAGP,yBAAyB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEnDJ,+BAA+B,CAACK,KAAK,CAAC;EACtC,OAAON,4BAA4B,CAACM,KAAK,CAAC;AAC5C,CAAC,CAAC;AAEFJ,aAAa,CAACK,WAAW,GAAG,eAAe","names":["React","useDialogContent_unstable","renderDialogContent_unstable","useDialogContentStyles_unstable","DialogContent","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogContent/DialogContent.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogContent_unstable } from './useDialogContent';\nimport { renderDialogContent_unstable } from './renderDialogContent';\nimport { useDialogContentStyles_unstable } from './useDialogContentStyles';\nimport type { DialogContentProps } from './DialogContent.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The `DialogContent` 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 DialogContent: ForwardRefComponent<DialogContentProps> = React.forwardRef((props, ref) => {\n  const state = useDialogContent_unstable(props, ref);\n\n  useDialogContentStyles_unstable(state);\n  return renderDialogContent_unstable(state);\n});\n\nDialogContent.displayName = 'DialogContent';\n"]}

package/lib/components/DialogContent/renderDialogContent.js

@@ -3,13 +3,13 @@ import { getSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DialogContent
  */
-
 export const renderDialogContent_unstable = state => {
   const {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
+  return /*#__PURE__*/React.createElement(slots.root, {
+    ...slotProps.root
   });
 };
 //# sourceMappingURL=renderDialogContent.js.map

package/lib/components/DialogContent/renderDialogContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogContent/renderDialogContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,4BAA4B,GAAI,KAAD,IAA8B;EACxE,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAqB,KAArB,CAArC;EAEA,oBAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAAP;AACD,CAJM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DialogContentState, DialogContentSlots } from './DialogContent.types';\n\n/**\n * Render the final JSX of DialogContent\n */\nexport const renderDialogContent_unstable = (state: DialogContentState) => {\n  const { slots, slotProps } = getSlots<DialogContentSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,4BAA4B,GAAIC,KAAyB,IAAI;EACxE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAqBE,KAAK,CAAC;EAEhE,oBAAOH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,EAAI;AAC3C,CAAC","names":["React","getSlots","renderDialogContent_unstable","state","slots","slotProps","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogContent/renderDialogContent.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DialogContentState, DialogContentSlots } from './DialogContent.types';\n\n/**\n * Render the final JSX of DialogContent\n */\nexport const renderDialogContent_unstable = (state: DialogContentState) => {\n  const { slots, slotProps } = getSlots<DialogContentSlots>(state);\n\n  return <slots.root {...slotProps.root} />;\n};\n"]}

package/lib/components/DialogContent/useDialogContent.js

@@ -8,10 +8,8 @@ import { getNativeElementProps } from '@fluentui/react-utilities';
  * @param props - props from this instance of DialogBody
  * @param ref - reference to root HTMLElement of DialogBody
  */
-
 export const useDialogContent_unstable = (props, ref) => {
   var _a;
-
   return {
     components: {
       root: 'div'

package/lib/components/DialogContent/useDialogContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogContent/useDialogContent.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,yBAAyB,GAAG,CACvC,KADuC,EAEvC,GAFuC,KAGjB;;;EACtB,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CADP;IAIL,IAAI,EAAE,qBAAqB,CAAC,CAAA,EAAA,GAAA,KAAK,CAAC,EAAN,MAAQ,IAAR,IAAQ,EAAA,KAAA,KAAA,CAAR,GAAQ,EAAR,GAAY,KAAb,EAAoB;MAC7C,GAD6C;MAE7C,GAAG;IAF0C,CAApB;EAJtB,CAAP;AASD,CAbM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { DialogContentProps, DialogContentState } from './DialogContent.types';\n\n/**\n * Create the state required to render DialogBody.\n *\n * The returned state can be modified with hooks such as useDialogBodyStyles_unstable,\n * before being passed to renderDialogBody_unstable.\n *\n * @param props - props from this instance of DialogBody\n * @param ref - reference to root HTMLElement of DialogBody\n */\nexport const useDialogContent_unstable = (\n  props: DialogContentProps,\n  ref: React.Ref<HTMLElement>,\n): DialogContentState => {\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(props.as ?? 'div', {\n      ref,\n      ...props,\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AACA,SAASA,qBAAqB,QAAQ,2BAA2B;AAGjE;;;;;;;;;AASA,OAAO,MAAMC,yBAAyB,GAAG,CACvCC,KAAyB,EACzBC,GAA2B,KACL;;EACtB,OAAO;IACLC,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAEL,qBAAqB,CAAC,WAAK,CAACM,EAAE,mCAAI,KAAK,EAAE;MAC7CH,GAAG;MACH,GAAGD;KACJ;GACF;AACH,CAAC","names":["getNativeElementProps","useDialogContent_unstable","props","ref","components","root","as"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogContent/useDialogContent.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { DialogContentProps, DialogContentState } from './DialogContent.types';\n\n/**\n * Create the state required to render DialogBody.\n *\n * The returned state can be modified with hooks such as useDialogBodyStyles_unstable,\n * before being passed to renderDialogBody_unstable.\n *\n * @param props - props from this instance of DialogBody\n * @param ref - reference to root HTMLElement of DialogBody\n */\nexport const useDialogContent_unstable = (\n  props: DialogContentProps,\n  ref: React.Ref<HTMLElement>,\n): DialogContentState => {\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(props.as ?? 'div', {\n      ref,\n      ...props,\n    }),\n  };\n};\n"]}

package/lib/components/DialogContent/useDialogContentStyles.js

@@ -7,31 +7,28 @@ export const dialogContentClassNames = {
 /**
  * Styles for the root slot
  */
-
 const useStyles = /*#__PURE__*/__styles({
-  "root": {
-    "a9b677": "fly5x3f",
-    "Bqenvij": "f1l02sjl",
-    "Bmxbyg5": "f5zp4f",
-    "sshi5w": "f1nxs5xn",
-    "B7ck84d": "f1ewtqcl",
-    "Ijaq50": "f6owso0",
-    "Br312pm": "fupswjn",
-    "nk6f5a": "foucsne",
-    "Bw0ie65": "f1ka72gx",
-    "Bahqtrf": "fk6fouc",
-    "Be2twd7": "fkhj508",
-    "Bhrd7zp": "figsok6",
-    "Bg96gwp": "f1i3iumi"
+  root: {
+    a9b677: "fly5x3f",
+    Bqenvij: "f1l02sjl",
+    Bmxbyg5: "f5zp4f",
+    sshi5w: "f1nxs5xn",
+    B7ck84d: "f1ewtqcl",
+    Ijaq50: "f6owso0",
+    Br312pm: "fupswjn",
+    nk6f5a: "foucsne",
+    Bw0ie65: "f1ka72gx",
+    Bahqtrf: "fk6fouc",
+    Be2twd7: "fkhj508",
+    Bhrd7zp: "figsok6",
+    Bg96gwp: "f1i3iumi"
   }
 }, {
-  "d": [".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f5zp4f{overflow-y:auto;}", ".f1nxs5xn{min-height:32px;}", ".f1ewtqcl{box-sizing:border-box;}", ".f6owso0{grid-row-start:body;}", ".fupswjn{grid-column-start:body;}", ".foucsne{grid-row-end:body;}", ".f1ka72gx{grid-column-end:body;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}"]
+  d: [".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f5zp4f{overflow-y:auto;}", ".f1nxs5xn{min-height:32px;}", ".f1ewtqcl{box-sizing:border-box;}", ".f6owso0{grid-row-start:body;}", ".fupswjn{grid-column-start:body;}", ".foucsne{grid-row-end:body;}", ".f1ka72gx{grid-column-end:body;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}"]
 });
 /**
  * Apply styling to the DialogContent slots based on the state
  */
-
-
 export const useDialogContentStyles_unstable = state => {
   const styles = useStyles();
   state.root.className = mergeClasses(dialogContentClassNames.root, styles.root, state.root.className);

package/lib/components/DialogContent/useDialogContentStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogContent/useDialogContentStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,gBAArD;AAGA,SAAS,iBAAT,QAAkC,0BAAlC;AACA,SAAS,gBAAT,QAAiC,uBAAjC;AAEA,OAAO,MAAM,uBAAuB,GAAuC;EACzE,IAAI,EAAE;AADmE,CAApE;AAIP;;AAEG;;AACH,MAAM,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;AAYA;;AAEG;;;AACH,OAAO,MAAM,+BAA+B,GAAI,KAAD,IAAkD;EAC/F,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAuB,CAAC,IAAzB,EAA+B,MAAM,CAAC,IAAtC,EAA4C,KAAK,CAAC,IAAN,CAAW,SAAvD,CAAnC;EACA,OAAO,KAAP;AACD,CAJM","sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { DialogContentSlots, DialogContentState } from './DialogContent.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { CONTENT_GRID_AREA } from '../../contexts/constants';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const dialogContentClassNames: SlotClassNames<DialogContentSlots> = {\n  root: 'fui-DialogContent',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    width: '100%',\n    height: '100%',\n    overflowY: 'auto',\n    minHeight: '32px',\n    boxSizing: 'border-box',\n    ...shorthands.gridArea(CONTENT_GRID_AREA),\n    ...typographyStyles.body1,\n  },\n});\n\n/**\n * Apply styling to the DialogContent slots based on the state\n */\nexport const useDialogContentStyles_unstable = (state: DialogContentState): DialogContentState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(dialogContentClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,mBAAqBA,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAGrE,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,gBAAgB,QAAQ,uBAAuB;AAExD,OAAO,MAAMC,uBAAuB,GAAuC;EACzEC,IAAI,EAAE;CACP;AAED;;;AAGA,MAAMC,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAUhB;AAEF;;;AAGA,OAAO,MAAMC,+BAA+B,GAAIC,KAAyB,IAAwB;EAC/F,MAAMC,MAAM,GAAGH,SAAS,EAAE;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGV,YAAY,CAACI,uBAAuB,CAACC,IAAI,EAAEI,MAAM,CAACJ,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EACpG,OAAOF,KAAK;AACd,CAAC","names":["mergeClasses","shorthands","CONTENT_GRID_AREA","typographyStyles","dialogContentClassNames","root","useStyles","useDialogContentStyles_unstable","state","styles","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogContent/useDialogContentStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { DialogContentSlots, DialogContentState } from './DialogContent.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { CONTENT_GRID_AREA } from '../../contexts/constants';\nimport { typographyStyles } from '@fluentui/react-theme';\n\nexport const dialogContentClassNames: SlotClassNames<DialogContentSlots> = {\n  root: 'fui-DialogContent',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    width: '100%',\n    height: '100%',\n    overflowY: 'auto',\n    minHeight: '32px',\n    boxSizing: 'border-box',\n    ...shorthands.gridArea(CONTENT_GRID_AREA),\n    ...typographyStyles.body1,\n  },\n});\n\n/**\n * Apply styling to the DialogContent slots based on the state\n */\nexport const useDialogContentStyles_unstable = (state: DialogContentState): DialogContentState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(dialogContentClassNames.root, styles.root, state.root.className);\n  return state;\n};\n"]}

package/lib/components/DialogSurface/DialogSurface.js

@@ -7,7 +7,6 @@ import { useDialogSurfaceContextValues_unstable } from './useDialogSurfaceContex
  * DialogSurface component represents the visual part of a `Dialog` as a whole,
  * it contains everything that should be visible.
  */
-
 export const DialogSurface = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDialogSurface_unstable(props, ref);
   const contextValues = useDialogSurfaceContextValues_unstable(state);

package/lib/components/DialogSurface/DialogSurface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/DialogSurface.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AACA,SAAS,+BAAT,QAAgD,0BAAhD;AAGA,SAAS,sCAAT,QAAuD,iCAAvD;AAEA;;;AAGG;;AACH,OAAO,MAAM,aAAa,gBAA4C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACpG,MAAM,KAAK,GAAG,yBAAyB,CAAC,KAAD,EAAQ,GAAR,CAAvC;EACA,MAAM,aAAa,GAAG,sCAAsC,CAAC,KAAD,CAA5D;EAEA,+BAA+B,CAAC,KAAD,CAA/B;EACA,OAAO,4BAA4B,CAAC,KAAD,EAAQ,aAAR,CAAnC;AACD,CANqE,CAA/D;AAQP,aAAa,CAAC,WAAd,GAA4B,eAA5B","sourcesContent":["import * as React from 'react';\nimport { useDialogSurface_unstable } from './useDialogSurface';\nimport { renderDialogSurface_unstable } from './renderDialogSurface';\nimport { useDialogSurfaceStyles_unstable } from './useDialogSurfaceStyles';\nimport type { DialogSurfaceProps } from './DialogSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDialogSurfaceContextValues_unstable } from './useDialogSurfaceContextValues';\n\n/**\n * DialogSurface component represents the visual part of a `Dialog` as a whole,\n * it contains everything that should be visible.\n */\nexport const DialogSurface: ForwardRefComponent<DialogSurfaceProps> = React.forwardRef((props, ref) => {\n  const state = useDialogSurface_unstable(props, ref);\n  const contextValues = useDialogSurfaceContextValues_unstable(state);\n\n  useDialogSurfaceStyles_unstable(state);\n  return renderDialogSurface_unstable(state, contextValues);\n});\n\nDialogSurface.displayName = 'DialogSurface';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,yBAAyB,QAAQ,oBAAoB;AAC9D,SAASC,4BAA4B,QAAQ,uBAAuB;AACpE,SAASC,+BAA+B,QAAQ,0BAA0B;AAG1E,SAASC,sCAAsC,QAAQ,iCAAiC;AAExF;;;;AAIA,OAAO,MAAMC,aAAa,gBAA4CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpG,MAAMC,KAAK,GAAGR,yBAAyB,CAACM,KAAK,EAAEC,GAAG,CAAC;EACnD,MAAME,aAAa,GAAGN,sCAAsC,CAACK,KAAK,CAAC;EAEnEN,+BAA+B,CAACM,KAAK,CAAC;EACtC,OAAOP,4BAA4B,CAACO,KAAK,EAAEC,aAAa,CAAC;AAC3D,CAAC,CAAC;AAEFL,aAAa,CAACM,WAAW,GAAG,eAAe","names":["React","useDialogSurface_unstable","renderDialogSurface_unstable","useDialogSurfaceStyles_unstable","useDialogSurfaceContextValues_unstable","DialogSurface","forwardRef","props","ref","state","contextValues","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogSurface/DialogSurface.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogSurface_unstable } from './useDialogSurface';\nimport { renderDialogSurface_unstable } from './renderDialogSurface';\nimport { useDialogSurfaceStyles_unstable } from './useDialogSurfaceStyles';\nimport type { DialogSurfaceProps } from './DialogSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDialogSurfaceContextValues_unstable } from './useDialogSurfaceContextValues';\n\n/**\n * DialogSurface component represents the visual part of a `Dialog` as a whole,\n * it contains everything that should be visible.\n */\nexport const DialogSurface: ForwardRefComponent<DialogSurfaceProps> = React.forwardRef((props, ref) => {\n  const state = useDialogSurface_unstable(props, ref);\n  const contextValues = useDialogSurfaceContextValues_unstable(state);\n\n  useDialogSurfaceStyles_unstable(state);\n  return renderDialogSurface_unstable(state, contextValues);\n});\n\nDialogSurface.displayName = 'DialogSurface';\n"]}

package/lib/components/DialogSurface/renderDialogSurface.js

@@ -5,16 +5,17 @@ import { Portal } from '@fluentui/react-portal';
 /**
  * Render the final JSX of DialogSurface
  */
-
 export const renderDialogSurface_unstable = (state, contextValues) => {
   const {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(Portal, null, slots.backdrop && /*#__PURE__*/React.createElement(slots.backdrop, { ...slotProps.backdrop
+  return /*#__PURE__*/React.createElement(Portal, null, slots.backdrop && /*#__PURE__*/React.createElement(slots.backdrop, {
+    ...slotProps.backdrop
   }), /*#__PURE__*/React.createElement(DialogSurfaceProvider, {
     value: contextValues.dialogSurface
-  }, /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
+  }, /*#__PURE__*/React.createElement(slots.root, {
+    ...slotProps.root
   })));
 };
 //# sourceMappingURL=renderDialogSurface.js.map

package/lib/components/DialogSurface/renderDialogSurface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/renderDialogSurface.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAEA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,MAAT,QAAuB,wBAAvB;AAEA;;AAEG;;AACH,OAAO,MAAM,4BAA4B,GAAG,CAAC,KAAD,EAA4B,aAA5B,KAAyE;EACnH,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAqB,KAArB,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,MAAD,EAAO,IAAP,EACG,KAAK,CAAC,QAAN,iBAAkB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,QAAP,EAAe,EAAA,GAAK,SAAS,CAAC;EAAf,CAAf,CADrB,eAEE,KAAA,CAAA,aAAA,CAAC,qBAAD,EAAsB;IAAC,KAAK,EAAE,aAAa,CAAC;EAAtB,CAAtB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CADF,CAFF,CADF;AAQD,CAXM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DialogSurfaceState, DialogSurfaceSlots, DialogSurfaceContextValues } from './DialogSurface.types';\nimport { DialogSurfaceProvider } from '../../contexts';\nimport { Portal } from '@fluentui/react-portal';\n\n/**\n * Render the final JSX of DialogSurface\n */\nexport const renderDialogSurface_unstable = (state: DialogSurfaceState, contextValues: DialogSurfaceContextValues) => {\n  const { slots, slotProps } = getSlots<DialogSurfaceSlots>(state);\n\n  return (\n    <Portal>\n      {slots.backdrop && <slots.backdrop {...slotProps.backdrop} />}\n      <DialogSurfaceProvider value={contextValues.dialogSurface}>\n        <slots.root {...slotProps.root} />\n      </DialogSurfaceProvider>\n    </Portal>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,MAAM,QAAQ,wBAAwB;AAE/C;;;AAGA,OAAO,MAAMC,4BAA4B,GAAG,CAACC,KAAyB,EAAEC,aAAyC,KAAI;EACnH,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGP,QAAQ,CAAqBI,KAAK,CAAC;EAEhE,oBACEL,oBAACG,MAAM,QACJI,KAAK,CAACE,QAAQ,iBAAIT,oBAACO,KAAK,CAACE,QAAQ;IAAA,GAAKD,SAAS,CAACC;EAAQ,EAAI,eAC7DT,oBAACE,qBAAqB;IAACQ,KAAK,EAAEJ,aAAa,CAACK;EAAa,gBACvDX,oBAACO,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,CACZ,CACjB;AAEb,CAAC","names":["React","getSlots","DialogSurfaceProvider","Portal","renderDialogSurface_unstable","state","contextValues","slots","slotProps","backdrop","value","dialogSurface","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogSurface/renderDialogSurface.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DialogSurfaceState, DialogSurfaceSlots, DialogSurfaceContextValues } from './DialogSurface.types';\nimport { DialogSurfaceProvider } from '../../contexts';\nimport { Portal } from '@fluentui/react-portal';\n\n/**\n * Render the final JSX of DialogSurface\n */\nexport const renderDialogSurface_unstable = (state: DialogSurfaceState, contextValues: DialogSurfaceContextValues) => {\n  const { slots, slotProps } = getSlots<DialogSurfaceSlots>(state);\n\n  return (\n    <Portal>\n      {slots.backdrop && <slots.backdrop {...slotProps.backdrop} />}\n      <DialogSurfaceProvider value={contextValues.dialogSurface}>\n        <slots.root {...slotProps.root} />\n      </DialogSurfaceProvider>\n    </Portal>\n  );\n};\n"]}

package/lib/components/DialogSurface/useDialogSurface.js

@@ -11,7 +11,6 @@ import { useModalAttributes } from '@fluentui/react-tabster';
  * @param props - props from this instance of DialogSurface
  * @param ref - reference to root HTMLElement of DialogSurface
  */
-
 export const useDialogSurface_unstable = (props, ref) => {
   const {
     backdrop,
@@ -24,11 +23,9 @@ export const useDialogSurface_unstable = (props, ref) => {
   const dialogTitleID = useDialogContext_unstable(ctx => ctx.dialogTitleId);
   const handledBackdropClick = useEventCallback(event => {
     var _a, _b;
-
     if (isResolvedShorthand(props.backdrop)) {
       (_b = (_a = props.backdrop).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
     }
-
     if (modalType === 'modal' && !event.isDefaultPrevented()) {
       requestOpenChange({
         event,
@@ -39,17 +36,15 @@ export const useDialogSurface_unstable = (props, ref) => {
   });
   const handleKeyDown = useEventCallback(event => {
     var _a;
-
     (_a = props.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(props, event);
-
     if (isEscapeKeyDismiss(event, modalType)) {
       requestOpenChange({
         event,
         open: false,
         type: 'escapeKeyDown'
-      }); // stop propagation to avoid conflicting with other elements that listen for `Escape`
+      });
+      // stop propagation to avoid conflicting with other elements that listen for `Escape`
       // e,g: nested Dialog, Popover, Menu and Tooltip
-
       event.stopPropagation();
     }
   });

package/lib/components/DialogSurface/useDialogSurface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurface.ts"],"names":[],"mappings":"AACA,SACE,qBADF,EAEE,gBAFF,EAGE,gBAHF,EAIE,aAJF,EAKE,mBALF,QAMO,2BANP;AAaA,SAAS,yBAAT,QAA0C,gBAA1C;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,kBAAT,QAAmC,yBAAnC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,yBAAyB,GAAG,CACvC,KADuC,EAEvC,GAFuC,KAGjB;EACtB,MAAM;IAAE,QAAF;IAAY;EAAZ,IAAmB,KAAzB;EACA,MAAM,SAAS,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,SAAZ,CAA3C;EACA,MAAM,SAAS,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,SAAZ,CAA3C;EACA,MAAM,IAAI,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,IAAZ,CAAtC;EACA,MAAM,iBAAiB,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,iBAAZ,CAAnD;EACA,MAAM,aAAa,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,aAAZ,CAA/C;EAEA,MAAM,oBAAoB,GAAG,gBAAgB,CAAE,KAAD,IAA4C;;;IACxF,IAAI,mBAAmB,CAAC,KAAK,CAAC,QAAP,CAAvB,EAAyC;MACvC,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,KAAK,CAAC,QAAN,EAAe,OAAf,MAAsB,IAAtB,IAAsB,EAAA,KAAA,KAAA,CAAtB,GAAsB,KAAA,CAAtB,GAAsB,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,KAAH,CAAtB;IACD;;IACD,IAAI,SAAS,KAAK,OAAd,IAAyB,CAAC,KAAK,CAAC,kBAAN,EAA9B,EAA0D;MACxD,iBAAiB,CAAC;QAChB,KADgB;QAEhB,IAAI,EAAE,KAFU;QAGhB,IAAI,EAAE;MAHU,CAAD,CAAjB;IAKD;EACF,CAX4C,CAA7C;EAaA,MAAM,aAAa,GAAG,gBAAgB,CAAE,KAAD,IAAiE;;;IACtG,CAAA,EAAA,GAAA,KAAK,CAAC,SAAN,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAA,IAAA,CAAf,KAAe,EAAG,KAAH,CAAf;;IAEA,IAAI,kBAAkB,CAAC,KAAD,EAAQ,SAAR,CAAtB,EAA0C;MACxC,iBAAiB,CAAC;QAChB,KADgB;QAEhB,IAAI,EAAE,KAFU;QAGhB,IAAI,EAAE;MAHU,CAAD,CAAjB,CADwC,CAMxC;MACA;;MACA,KAAK,CAAC,eAAN;IACD;EACF,CAbqC,CAAtC;EAeA,MAAM;IAAE;EAAF,IAAsB,kBAAkB,CAAC;IAAE,SAAS,EAAE,SAAS,KAAK;EAA3B,CAAD,CAA9C;EAEA,OAAO;IACL,UAAU,EAAE;MACV,QAAQ,EAAE,KADA;MAEV,IAAI,EAAE;IAFI,CADP;IAKL,QAAQ,EAAE,gBAAgB,CAAC,QAAD,EAAW;MACnC,QAAQ,EAAE,IAAI,IAAI,SAAS,KAAK,WADG;MAEnC,YAAY,EAAE;QACZ,eAAe,MADH;QAEZ,OAAO,EAAE;MAFG;IAFqB,CAAX,CALrB;IAYL,IAAI,EAAE,qBAAqB,CAAC,EAAE,KAAA,IAAF,IAAA,EAAE,KAAA,KAAA,CAAF,GAAA,EAAA,GAAM,KAAP,EAAc;MACvC,QAAQ,EAAE,CAAC,CAD4B;MAEvC,cAAc,SAAS,KAAK,WAFW;MAGvC,IAAI,EAAE,SAAS,KAAK,OAAd,GAAwB,aAAxB,GAAwC,QAHP;MAIvC,mBAAmB,KAAK,CAAC,YAAD,CAAL,GAAsB,SAAtB,GAAkC,aAJd;MAKvC,GAAG,KALoC;MAMvC,GAAG,eANoC;MAOvC,SAAS,EAAE,aAP4B;MAQvC,GAAG,EAAE,aAAa,CAAC,GAAD,EAAM,SAAN;IARqB,CAAd;EAZtB,CAAP;AAuBD,CAhEM","sourcesContent":["import * as React from 'react';\nimport {\n  getNativeElementProps,\n  resolveShorthand,\n  useEventCallback,\n  useMergedRefs,\n  isResolvedShorthand,\n} from '@fluentui/react-utilities';\nimport type {\n  DialogSurfaceElement,\n  DialogSurfaceElementIntersection,\n  DialogSurfaceProps,\n  DialogSurfaceState,\n} from './DialogSurface.types';\nimport { useDialogContext_unstable } from '../../contexts';\nimport { isEscapeKeyDismiss } from '../../utils';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render DialogSurface.\n *\n * The returned state can be modified with hooks such as useDialogSurfaceStyles_unstable,\n * before being passed to renderDialogSurface_unstable.\n *\n * @param props - props from this instance of DialogSurface\n * @param ref - reference to root HTMLElement of DialogSurface\n */\nexport const useDialogSurface_unstable = (\n  props: DialogSurfaceProps,\n  ref: React.Ref<DialogSurfaceElement>,\n): DialogSurfaceState => {\n  const { backdrop, as } = props;\n  const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n  const dialogRef = useDialogContext_unstable(ctx => ctx.dialogRef);\n  const open = useDialogContext_unstable(ctx => ctx.open);\n  const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n  const dialogTitleID = useDialogContext_unstable(ctx => ctx.dialogTitleId);\n\n  const handledBackdropClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    if (isResolvedShorthand(props.backdrop)) {\n      props.backdrop.onClick?.(event);\n    }\n    if (modalType === 'modal' && !event.isDefaultPrevented()) {\n      requestOpenChange({\n        event,\n        open: false,\n        type: 'backdropClick',\n      });\n    }\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<DialogSurfaceElementIntersection>) => {\n    props.onKeyDown?.(event);\n\n    if (isEscapeKeyDismiss(event, modalType)) {\n      requestOpenChange({\n        event,\n        open: false,\n        type: 'escapeKeyDown',\n      });\n      // stop propagation to avoid conflicting with other elements that listen for `Escape`\n      // e,g: nested Dialog, Popover, Menu and Tooltip\n      event.stopPropagation();\n    }\n  });\n\n  const { modalAttributes } = useModalAttributes({ trapFocus: modalType !== 'non-modal' });\n\n  return {\n    components: {\n      backdrop: 'div',\n      root: 'div',\n    },\n    backdrop: resolveShorthand(backdrop, {\n      required: open && modalType !== 'non-modal',\n      defaultProps: {\n        'aria-hidden': 'true',\n        onClick: handledBackdropClick,\n      },\n    }),\n    root: getNativeElementProps(as ?? 'div', {\n      tabIndex: -1, // https://github.com/microsoft/fluentui/issues/25150\n      'aria-modal': modalType !== 'non-modal',\n      role: modalType === 'alert' ? 'alertdialog' : 'dialog',\n      'aria-labelledby': props['aria-label'] ? undefined : dialogTitleID,\n      ...props,\n      ...modalAttributes,\n      onKeyDown: handleKeyDown,\n      ref: useMergedRefs(ref, dialogRef),\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AACA,SACEA,qBAAqB,EACrBC,gBAAgB,EAChBC,gBAAgB,EAChBC,aAAa,EACbC,mBAAmB,QACd,2BAA2B;AAOlC,SAASC,yBAAyB,QAAQ,gBAAgB;AAC1D,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,kBAAkB,QAAQ,yBAAyB;AAE5D;;;;;;;;;AASA,OAAO,MAAMC,yBAAyB,GAAG,CACvCC,KAAyB,EACzBC,GAAoC,KACd;EACtB,MAAM;IAAEC,QAAQ;IAAEC;EAAE,CAAE,GAAGH,KAAK;EAC9B,MAAMI,SAAS,GAAGR,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACD,SAAS,CAAC;EACjE,MAAME,SAAS,GAAGV,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACC,SAAS,CAAC;EACjE,MAAMC,IAAI,GAAGX,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACE,IAAI,CAAC;EACvD,MAAMC,iBAAiB,GAAGZ,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACG,iBAAiB,CAAC;EACjF,MAAMC,aAAa,GAAGb,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACK,aAAa,CAAC;EAEzE,MAAMC,oBAAoB,GAAGlB,gBAAgB,CAAEmB,KAAuC,IAAI;;IACxF,IAAIjB,mBAAmB,CAACK,KAAK,CAACE,QAAQ,CAAC,EAAE;MACvC,iBAAK,CAACA,QAAQ,EAACW,OAAO,mDAAGD,KAAK,CAAC;;IAEjC,IAAIR,SAAS,KAAK,OAAO,IAAI,CAACQ,KAAK,CAACE,kBAAkB,EAAE,EAAE;MACxDN,iBAAiB,CAAC;QAChBI,KAAK;QACLL,IAAI,EAAE,KAAK;QACXQ,IAAI,EAAE;OACP,CAAC;;EAEN,CAAC,CAAC;EAEF,MAAMC,aAAa,GAAGvB,gBAAgB,CAAEmB,KAA4D,IAAI;;IACtG,WAAK,CAACK,SAAS,+CAAfjB,KAAK,EAAaY,KAAK,CAAC;IAExB,IAAIf,kBAAkB,CAACe,KAAK,EAAER,SAAS,CAAC,EAAE;MACxCI,iBAAiB,CAAC;QAChBI,KAAK;QACLL,IAAI,EAAE,KAAK;QACXQ,IAAI,EAAE;OACP,CAAC;MACF;MACA;MACAH,KAAK,CAACM,eAAe,EAAE;;EAE3B,CAAC,CAAC;EAEF,MAAM;IAAEC;EAAe,CAAE,GAAGrB,kBAAkB,CAAC;IAAEsB,SAAS,EAAEhB,SAAS,KAAK;EAAW,CAAE,CAAC;EAExF,OAAO;IACLiB,UAAU,EAAE;MACVnB,QAAQ,EAAE,KAAK;MACfoB,IAAI,EAAE;KACP;IACDpB,QAAQ,EAAEV,gBAAgB,CAACU,QAAQ,EAAE;MACnCqB,QAAQ,EAAEhB,IAAI,IAAIH,SAAS,KAAK,WAAW;MAC3CoB,YAAY,EAAE;QACZ,aAAa,EAAE,MAAM;QACrBX,OAAO,EAAEF;;KAEZ,CAAC;IACFW,IAAI,EAAE/B,qBAAqB,CAACY,EAAE,aAAFA,EAAE,cAAFA,EAAE,GAAI,KAAK,EAAE;MACvCsB,QAAQ,EAAE,CAAC,CAAC;MACZ,YAAY,EAAErB,SAAS,KAAK,WAAW;MACvCsB,IAAI,EAAEtB,SAAS,KAAK,OAAO,GAAG,aAAa,GAAG,QAAQ;MACtD,iBAAiB,EAAEJ,KAAK,CAAC,YAAY,CAAC,GAAG2B,SAAS,GAAGlB,aAAa;MAClE,GAAGT,KAAK;MACR,GAAGmB,eAAe;MAClBF,SAAS,EAAED,aAAa;MACxBf,GAAG,EAAEP,aAAa,CAACO,GAAG,EAAEK,SAAS;KAClC;GACF;AACH,CAAC","names":["getNativeElementProps","resolveShorthand","useEventCallback","useMergedRefs","isResolvedShorthand","useDialogContext_unstable","isEscapeKeyDismiss","useModalAttributes","useDialogSurface_unstable","props","ref","backdrop","as","modalType","ctx","dialogRef","open","requestOpenChange","dialogTitleID","dialogTitleId","handledBackdropClick","event","onClick","isDefaultPrevented","type","handleKeyDown","onKeyDown","stopPropagation","modalAttributes","trapFocus","components","root","required","defaultProps","tabIndex","role","undefined"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  getNativeElementProps,\n  resolveShorthand,\n  useEventCallback,\n  useMergedRefs,\n  isResolvedShorthand,\n} from '@fluentui/react-utilities';\nimport type {\n  DialogSurfaceElement,\n  DialogSurfaceElementIntersection,\n  DialogSurfaceProps,\n  DialogSurfaceState,\n} from './DialogSurface.types';\nimport { useDialogContext_unstable } from '../../contexts';\nimport { isEscapeKeyDismiss } from '../../utils';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render DialogSurface.\n *\n * The returned state can be modified with hooks such as useDialogSurfaceStyles_unstable,\n * before being passed to renderDialogSurface_unstable.\n *\n * @param props - props from this instance of DialogSurface\n * @param ref - reference to root HTMLElement of DialogSurface\n */\nexport const useDialogSurface_unstable = (\n  props: DialogSurfaceProps,\n  ref: React.Ref<DialogSurfaceElement>,\n): DialogSurfaceState => {\n  const { backdrop, as } = props;\n  const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n  const dialogRef = useDialogContext_unstable(ctx => ctx.dialogRef);\n  const open = useDialogContext_unstable(ctx => ctx.open);\n  const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n  const dialogTitleID = useDialogContext_unstable(ctx => ctx.dialogTitleId);\n\n  const handledBackdropClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    if (isResolvedShorthand(props.backdrop)) {\n      props.backdrop.onClick?.(event);\n    }\n    if (modalType === 'modal' && !event.isDefaultPrevented()) {\n      requestOpenChange({\n        event,\n        open: false,\n        type: 'backdropClick',\n      });\n    }\n  });\n\n  const handleKeyDown = useEventCallback((event: React.KeyboardEvent<DialogSurfaceElementIntersection>) => {\n    props.onKeyDown?.(event);\n\n    if (isEscapeKeyDismiss(event, modalType)) {\n      requestOpenChange({\n        event,\n        open: false,\n        type: 'escapeKeyDown',\n      });\n      // stop propagation to avoid conflicting with other elements that listen for `Escape`\n      // e,g: nested Dialog, Popover, Menu and Tooltip\n      event.stopPropagation();\n    }\n  });\n\n  const { modalAttributes } = useModalAttributes({ trapFocus: modalType !== 'non-modal' });\n\n  return {\n    components: {\n      backdrop: 'div',\n      root: 'div',\n    },\n    backdrop: resolveShorthand(backdrop, {\n      required: open && modalType !== 'non-modal',\n      defaultProps: {\n        'aria-hidden': 'true',\n        onClick: handledBackdropClick,\n      },\n    }),\n    root: getNativeElementProps(as ?? 'div', {\n      tabIndex: -1, // https://github.com/microsoft/fluentui/issues/25150\n      'aria-modal': modalType !== 'non-modal',\n      role: modalType === 'alert' ? 'alertdialog' : 'dialog',\n      'aria-labelledby': props['aria-label'] ? undefined : dialogTitleID,\n      ...props,\n      ...modalAttributes,\n      onKeyDown: handleKeyDown,\n      ref: useMergedRefs(ref, dialogRef),\n    }),\n  };\n};\n"]}

package/lib/components/DialogSurface/useDialogSurfaceContextValues.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurfaceContextValues.ts"],"names":[],"mappings":"AAGA,OAAM,SAAU,sCAAV,CAAiD,KAAjD,EAA0E;EAC9E,MAAM,aAAa,GAA8B,IAAjD;EAEA,OAAO;IAAE;EAAF,CAAP;AACD","sourcesContent":["import type { DialogSurfaceContextValues, DialogSurfaceState } from './DialogSurface.types';\nimport type { DialogSurfaceContextValue } from '../../contexts';\n\nexport function useDialogSurfaceContextValues_unstable(state: DialogSurfaceState): DialogSurfaceContextValues {\n  const dialogSurface: DialogSurfaceContextValue = true;\n\n  return { dialogSurface };\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAGA,OAAM,SAAUA,sCAAsC,CAACC,KAAyB;EAC9E,MAAMC,aAAa,GAA8B,IAAI;EAErD,OAAO;IAAEA;EAAa,CAAE;AAC1B","names":["useDialogSurfaceContextValues_unstable","state","dialogSurface"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurfaceContextValues.ts"],"sourcesContent":["import type { DialogSurfaceContextValues, DialogSurfaceState } from './DialogSurface.types';\nimport type { DialogSurfaceContextValue } from '../../contexts';\n\nexport function useDialogSurfaceContextValues_unstable(state: DialogSurfaceState): DialogSurfaceContextValues {\n  const dialogSurface: DialogSurfaceContextValue = true;\n\n  return { dialogSurface };\n}\n"]}

package/lib/components/DialogSurface/useDialogSurfaceStyles.js

@@ -9,122 +9,117 @@ export const dialogSurfaceClassNames = {
 /**
  * Styles for the root slot
  */
-
 const useStyles = /*#__PURE__*/__styles({
-  "focusOutline": {
-    "Brovlpu": "ftqa4ok",
-    "B486eqv": "f2hkw1w",
-    "B8q5s1w": "f8hki3x",
-    "Bci5o5g": ["f1d2448m", "ffh67wi"],
-    "n8qw10": "f1bjia2o",
-    "Bdrgwmp": ["ffh67wi", "f1d2448m"],
-    "Bm4h7ae": "f15bsgw9",
-    "B7ys5i9": "f14e48fq",
-    "Busjfv9": "f18yb2kv",
-    "Bhk32uz": "fd6o370",
-    "Bf4ptjt": "fh1cnn4",
-    "kclons": ["fy7oxxb", "f184ne2d"],
-    "Bhdgwq3": "fpukqih",
-    "Blkhhs4": ["f184ne2d", "fy7oxxb"],
-    "Bqtpl0w": "frrh606",
-    "clg4pj": ["f1v5zibi", "fo2hd23"],
-    "hgwjuy": "ful5kiu",
-    "Bonggc9": ["fo2hd23", "f1v5zibi"],
-    "B1tsrr9": ["f1jqcqds", "ftffrms"],
-    "Dah5zi": ["ftffrms", "f1jqcqds"],
-    "Bkh64rk": ["f2e7qr6", "fsr1zz6"],
-    "qqdqy8": ["fsr1zz6", "f2e7qr6"],
-    "B6dhp37": "f1dvezut",
-    "i03rao": ["fd0oaoj", "f1cwg4i8"],
-    "Boxcth7": "fjvm52t",
-    "Bsom6fd": ["f1cwg4i8", "fd0oaoj"],
-    "J0r882": "fdiulkx",
-    "Bjwuhne": "f1yalx80",
-    "Ghsupd": ["fq22d5a", "f1jw7pan"],
-    "Bule8hv": ["f1jw7pan", "fq22d5a"]
+  focusOutline: {
+    Brovlpu: "ftqa4ok",
+    B486eqv: "f2hkw1w",
+    B8q5s1w: "f8hki3x",
+    Bci5o5g: ["f1d2448m", "ffh67wi"],
+    n8qw10: "f1bjia2o",
+    Bdrgwmp: ["ffh67wi", "f1d2448m"],
+    Bm4h7ae: "f15bsgw9",
+    B7ys5i9: "f14e48fq",
+    Busjfv9: "f18yb2kv",
+    Bhk32uz: "fd6o370",
+    Bf4ptjt: "fh1cnn4",
+    kclons: ["fy7oxxb", "f184ne2d"],
+    Bhdgwq3: "fpukqih",
+    Blkhhs4: ["f184ne2d", "fy7oxxb"],
+    Bqtpl0w: "frrh606",
+    clg4pj: ["f1v5zibi", "fo2hd23"],
+    hgwjuy: "ful5kiu",
+    Bonggc9: ["fo2hd23", "f1v5zibi"],
+    B1tsrr9: ["f1jqcqds", "ftffrms"],
+    Dah5zi: ["ftffrms", "f1jqcqds"],
+    Bkh64rk: ["f2e7qr6", "fsr1zz6"],
+    qqdqy8: ["fsr1zz6", "f2e7qr6"],
+    B6dhp37: "f1dvezut",
+    i03rao: ["fd0oaoj", "f1cwg4i8"],
+    Boxcth7: "fjvm52t",
+    Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
+    J0r882: "fdiulkx",
+    Bjwuhne: "f1yalx80",
+    Ghsupd: ["fq22d5a", "f1jw7pan"],
+    Bule8hv: ["f1jw7pan", "fq22d5a"]
   },
-  "root": {
-    "mc9l5x": "ftgm304",
-    "famaaq": "f1c515w",
-    "Bcdw1i0": "f1bitti",
-    "Bhzewxz": "f15twtuk",
-    "j35jbq": ["f1e31b4d", "f1vgc2s3"],
-    "B5kzvoi": "f1yab3r1",
-    "oyh7mz": ["f1vgc2s3", "f1e31b4d"],
-    "z8tnut": "fuq56rw",
-    "z189sj": ["f15kemlc", "fdgang7"],
-    "Byoj8tv": "fl2zwns",
-    "uwmqm3": ["fdgang7", "f15kemlc"],
-    "B6of3ja": "fgr6219",
-    "t21cq0": ["f1ujusj6", "fcgxt0o"],
-    "jrapky": "f10jk5vf",
-    "Frg6f3": ["fcgxt0o", "f1ujusj6"],
-    "icvyot": "fzkkow9",
-    "vrafjx": ["fcdblym", "fjik90z"],
-    "oivjwe": "fg706s2",
-    "wvpqe5": ["fjik90z", "fcdblym"],
-    "B68tc82": "f1ln0qer",
-    "Bmxbyg5": "fa2wlxz",
-    "fshzfu": "f120kxnn",
-    "qhf8xq": "f19dog8a",
-    "a9b677": "fly5x3f",
-    "Bqenvij": "f3052tw",
-    "B2u0y6b": "fvgz9i8",
-    "Bxyxcbc": "f6a9g1z",
-    "B7ck84d": "f1ewtqcl",
-    "E5pizo": "f10nrhrw",
-    "De3pzq": "fxugw4r",
-    "sj55zd": "f19n0e5",
-    "B4j52fo": "f5ogflp",
-    "Bekrc4i": ["f1hqa2wf", "finvdd3"],
-    "Bn0qgzm": "f1f09k3d",
-    "ibv6hh": ["finvdd3", "f1hqa2wf"],
-    "g2u3we": "fghlq4f",
-    "h3c5rm": ["f1gn591s", "fjscplz"],
-    "B9xav0g": "fb073pr",
-    "zhjwy3": ["fjscplz", "f1gn591s"],
-    "Bbmb7ep": ["f1erghxr", "f1ehz9de"],
-    "Beyfa6y": ["f1ehz9de", "f1erghxr"],
-    "B7oj6ja": ["f1spoy8", "fmb70yw"],
-    "Btl43ni": ["fmb70yw", "f1spoy8"],
-    "B5xtmjs": "ff54dml"
+  root: {
+    mc9l5x: "ftgm304",
+    famaaq: "f1c515w",
+    Bcdw1i0: "f1bitti",
+    Bhzewxz: "f15twtuk",
+    j35jbq: ["f1e31b4d", "f1vgc2s3"],
+    B5kzvoi: "f1yab3r1",
+    oyh7mz: ["f1vgc2s3", "f1e31b4d"],
+    z8tnut: "fuq56rw",
+    z189sj: ["f15kemlc", "fdgang7"],
+    Byoj8tv: "fl2zwns",
+    uwmqm3: ["fdgang7", "f15kemlc"],
+    B6of3ja: "fgr6219",
+    t21cq0: ["f1ujusj6", "fcgxt0o"],
+    jrapky: "f10jk5vf",
+    Frg6f3: ["fcgxt0o", "f1ujusj6"],
+    icvyot: "fzkkow9",
+    vrafjx: ["fcdblym", "fjik90z"],
+    oivjwe: "fg706s2",
+    wvpqe5: ["fjik90z", "fcdblym"],
+    B68tc82: "f1ln0qer",
+    Bmxbyg5: "fa2wlxz",
+    fshzfu: "f120kxnn",
+    qhf8xq: "f19dog8a",
+    a9b677: "fly5x3f",
+    Bqenvij: "f3052tw",
+    B2u0y6b: "fvgz9i8",
+    Bxyxcbc: "f6a9g1z",
+    B7ck84d: "f1ewtqcl",
+    E5pizo: "f10nrhrw",
+    De3pzq: "fxugw4r",
+    sj55zd: "f19n0e5",
+    B4j52fo: "f5ogflp",
+    Bekrc4i: ["f1hqa2wf", "finvdd3"],
+    Bn0qgzm: "f1f09k3d",
+    ibv6hh: ["finvdd3", "f1hqa2wf"],
+    g2u3we: "fghlq4f",
+    h3c5rm: ["f1gn591s", "fjscplz"],
+    B9xav0g: "fb073pr",
+    zhjwy3: ["fjscplz", "f1gn591s"],
+    Bbmb7ep: ["f1erghxr", "f1ehz9de"],
+    Beyfa6y: ["f1ehz9de", "f1erghxr"],
+    B7oj6ja: ["f1spoy8", "fmb70yw"],
+    Btl43ni: ["fmb70yw", "f1spoy8"],
+    B5xtmjs: "ff54dml"
   },
-  "backdrop": {
-    "qhf8xq": "f19dog8a",
-    "De3pzq": "fju19wo",
-    "Bhzewxz": "f113wtx2",
-    "j35jbq": ["f10k790i", "f1xynx9j"],
-    "B5kzvoi": "f5gq2j6",
-    "oyh7mz": ["f1xynx9j", "f10k790i"]
+  backdrop: {
+    qhf8xq: "f19dog8a",
+    De3pzq: "fju19wo",
+    Bhzewxz: "f113wtx2",
+    j35jbq: ["f10k790i", "f1xynx9j"],
+    B5kzvoi: "f5gq2j6",
+    oyh7mz: ["f1xynx9j", "f10k790i"]
   },
-  "nestedDialogBackdrop": {
-    "De3pzq": "f3rmtva"
+  nestedDialogBackdrop: {
+    De3pzq: "f3rmtva"
   },
-  "nestedNativeDialogBackdrop": {
-    "fshzfu": "foe20jx"
+  nestedNativeDialogBackdrop: {
+    fshzfu: "foe20jx"
   }
 }, {
-  "f": [".ftqa4ok:focus{outline-style:none;}"],
-  "i": [".f2hkw1w:focus-visible{outline-style:none;}"],
-  "d": [".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}", ".ftgm304{display:block;}", ".f1c515w{-webkit-user-select:unset;-moz-user-select:unset;-ms-user-select:unset;user-select:unset;}", ".f1bitti{visibility:unset;}", ".f15twtuk{top:0;}", ".f1e31b4d{right:0;}", ".f1vgc2s3{left:0;}", ".f1yab3r1{bottom:0;}", ".fuq56rw{padding-top:24px;}", ".f15kemlc{padding-right:24px;}", ".fdgang7{padding-left:24px;}", ".fl2zwns{padding-bottom:24px;}", ".fgr6219{margin-top:auto;}", ".f1ujusj6{margin-right:auto;}", ".fcgxt0o{margin-left:auto;}", ".f10jk5vf{margin-bottom:auto;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1ln0qer{overflow-x:unset;}", ".fa2wlxz{overflow-y:unset;}", ".f120kxnn::backdrop{background-color:rgba(0, 0, 0, 0.4);}", ".f19dog8a{position:fixed;}", ".fly5x3f{width:100%;}", ".f3052tw{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;}", ".fvgz9i8{max-width:600px;}", ".f6a9g1z{max-height:100vh;}", ".f1ewtqcl{box-sizing:border-box;}", ".f10nrhrw{box-shadow:var(--shadow64);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f1erghxr{border-bottom-right-radius:8px;}", ".f1ehz9de{border-bottom-left-radius:8px;}", ".f1spoy8{border-top-right-radius:8px;}", ".fmb70yw{border-top-left-radius:8px;}", ".fju19wo{background-color:rgba(0, 0, 0, 0.4);}", ".f113wtx2{top:0px;}", ".f10k790i{right:0px;}", ".f1xynx9j{left:0px;}", ".f5gq2j6{bottom:0px;}", ".f3rmtva{background-color:transparent;}", ".foe20jx::backdrop{background-color:transparent;}"],
-  "m": [["@media screen and (max-width: 480px){.ff54dml{max-width:100vw;}}", {
-    "m": "screen and (max-width: 480px)"
+  f: [".ftqa4ok:focus{outline-style:none;}"],
+  i: [".f2hkw1w:focus-visible{outline-style:none;}"],
+  d: [".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}", ".ftgm304{display:block;}", ".f1c515w{-webkit-user-select:unset;-moz-user-select:unset;-ms-user-select:unset;user-select:unset;}", ".f1bitti{visibility:unset;}", ".f15twtuk{top:0;}", ".f1e31b4d{right:0;}", ".f1vgc2s3{left:0;}", ".f1yab3r1{bottom:0;}", ".fuq56rw{padding-top:24px;}", ".f15kemlc{padding-right:24px;}", ".fdgang7{padding-left:24px;}", ".fl2zwns{padding-bottom:24px;}", ".fgr6219{margin-top:auto;}", ".f1ujusj6{margin-right:auto;}", ".fcgxt0o{margin-left:auto;}", ".f10jk5vf{margin-bottom:auto;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1ln0qer{overflow-x:unset;}", ".fa2wlxz{overflow-y:unset;}", ".f120kxnn::backdrop{background-color:rgba(0, 0, 0, 0.4);}", ".f19dog8a{position:fixed;}", ".fly5x3f{width:100%;}", ".f3052tw{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;}", ".fvgz9i8{max-width:600px;}", ".f6a9g1z{max-height:100vh;}", ".f1ewtqcl{box-sizing:border-box;}", ".f10nrhrw{box-shadow:var(--shadow64);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f1erghxr{border-bottom-right-radius:8px;}", ".f1ehz9de{border-bottom-left-radius:8px;}", ".f1spoy8{border-top-right-radius:8px;}", ".fmb70yw{border-top-left-radius:8px;}", ".fju19wo{background-color:rgba(0, 0, 0, 0.4);}", ".f113wtx2{top:0px;}", ".f10k790i{right:0px;}", ".f1xynx9j{left:0px;}", ".f5gq2j6{bottom:0px;}", ".f3rmtva{background-color:transparent;}", ".foe20jx::backdrop{background-color:transparent;}"],
+  m: [["@media screen and (max-width: 480px){.ff54dml{max-width:100vw;}}", {
+    m: "screen and (max-width: 480px)"
   }]]
 });
 /**
  * Apply styling to the DialogSurface slots based on the state
  */
-
-
 export const useDialogSurfaceStyles_unstable = state => {
   const styles = useStyles();
   const isNestedDialog = useDialogContext_unstable(ctx => ctx.isNestedDialog);
   state.root.className = mergeClasses(dialogSurfaceClassNames.root, styles.root, styles.focusOutline, isNestedDialog && styles.nestedNativeDialogBackdrop, state.root.className);
-
   if (state.backdrop) {
     state.backdrop.className = mergeClasses(dialogSurfaceClassNames.backdrop, styles.backdrop, isNestedDialog && styles.nestedDialogBackdrop, state.backdrop.className);
   }
-
   return state;
 };
 //# sourceMappingURL=useDialogSurfaceStyles.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurfaceStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,gBAArD;AAEA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,uBAAT,QAAwC,yBAAxC;AACA,SACE,+BADF,EAEE,qBAFF,EAGE,oBAHF,EAIE,eAJF,EAKE,yBALF,QAMO,gBANP;AASA,OAAO,MAAM,uBAAuB,GAAuC;EACzE,IAAI,EAAE,mBADmE;EAEzE,QAAQ,EAAE;AAF+D,CAApE;AAKP;;AAEG;;AACH,MAAM,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;AAAA,EAAlB;AA6CA;;AAEG;;;AACH,OAAO,MAAM,+BAA+B,GAAI,KAAD,IAAkD;EAC/F,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,MAAM,cAAc,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,cAAZ,CAAhD;EAEA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,uBAAuB,CAAC,IADS,EAEjC,MAAM,CAAC,IAF0B,EAGjC,MAAM,CAAC,YAH0B,EAIjC,cAAc,IAAI,MAAM,CAAC,0BAJQ,EAKjC,KAAK,CAAC,IAAN,CAAW,SALsB,CAAnC;;EAOA,IAAI,KAAK,CAAC,QAAV,EAAoB;IAClB,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,YAAY,CACrC,uBAAuB,CAAC,QADa,EAErC,MAAM,CAAC,QAF8B,EAGrC,cAAc,IAAI,MAAM,CAAC,oBAHY,EAIrC,KAAK,CAAC,QAAN,CAAe,SAJsB,CAAvC;EAMD;;EACD,OAAO,KAAP;AACD,CApBM","sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport {\n  MEDIA_QUERY_BREAKPOINT_SELECTOR,\n  SURFACE_BORDER_RADIUS,\n  SURFACE_BORDER_WIDTH,\n  SURFACE_PADDING,\n  useDialogContext_unstable,\n} from '../../contexts';\nimport type { DialogSurfaceSlots, DialogSurfaceState } from './DialogSurface.types';\n\nexport const dialogSurfaceClassNames: SlotClassNames<DialogSurfaceSlots> = {\n  root: 'fui-DialogSurface',\n  backdrop: 'fui-DialogSurface__backdrop',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  focusOutline: createFocusOutlineStyle(),\n  root: {\n    display: 'block',\n    userSelect: 'unset',\n    visibility: 'unset',\n    ...shorthands.inset(0),\n    ...shorthands.padding(0),\n    ...shorthands.padding(SURFACE_PADDING),\n    ...shorthands.margin('auto'),\n    ...shorthands.borderStyle('none'),\n    ...shorthands.overflow('unset'),\n    '&::backdrop': {\n      backgroundColor: 'rgba(0, 0, 0, 0.4)',\n    },\n    position: 'fixed',\n    width: '100%',\n    height: 'fit-content',\n    maxWidth: '600px',\n    maxHeight: '100vh',\n    boxSizing: 'border-box',\n    boxShadow: tokens.shadow64,\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground1,\n    ...shorthands.border(SURFACE_BORDER_WIDTH, 'solid', tokens.colorTransparentStroke),\n    ...shorthands.borderRadius(SURFACE_BORDER_RADIUS),\n    [MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n      maxWidth: '100vw',\n    },\n  },\n  backdrop: {\n    position: 'fixed',\n    backgroundColor: 'rgba(0, 0, 0, 0.4)',\n    ...shorthands.inset('0px'),\n  },\n  nestedDialogBackdrop: {\n    backgroundColor: 'transparent',\n  },\n  nestedNativeDialogBackdrop: {\n    '&::backdrop': {\n      backgroundColor: 'transparent',\n    },\n  },\n});\n\n/**\n * Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = (state: DialogSurfaceState): DialogSurfaceState => {\n  const styles = useStyles();\n  const isNestedDialog = useDialogContext_unstable(ctx => ctx.isNestedDialog);\n\n  state.root.className = mergeClasses(\n    dialogSurfaceClassNames.root,\n    styles.root,\n    styles.focusOutline,\n    isNestedDialog && styles.nestedNativeDialogBackdrop,\n    state.root.className,\n  );\n  if (state.backdrop) {\n    state.backdrop.className = mergeClasses(\n      dialogSurfaceClassNames.backdrop,\n      styles.backdrop,\n      isNestedDialog && styles.nestedDialogBackdrop,\n      state.backdrop.className,\n    );\n  }\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,mBAAqBA,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAErE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,SACEC,+BAA+B,EAC/BC,qBAAqB,EACrBC,oBAAoB,EACpBC,eAAe,EACfC,yBAAyB,QACpB,gBAAgB;AAGvB,OAAO,MAAMC,uBAAuB,GAAuC;EACzEC,IAAI,EAAE,mBAAmB;EACzBC,QAAQ,EAAE;CACX;AAED;;;AAGA,MAAMC,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;AAAA,EA2ChB;AAEF;;;AAGA,OAAO,MAAMC,+BAA+B,GAAIC,KAAyB,IAAwB;EAC/F,MAAMC,MAAM,GAAGH,SAAS,EAAE;EAC1B,MAAMI,cAAc,GAAGR,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACD,cAAc,CAAC;EAE3EF,KAAK,CAACJ,IAAI,CAACQ,SAAS,GAAGlB,YAAY,CACjCS,uBAAuB,CAACC,IAAI,EAC5BK,MAAM,CAACL,IAAI,EACXK,MAAM,CAACI,YAAY,EACnBH,cAAc,IAAID,MAAM,CAACK,0BAA0B,EACnDN,KAAK,CAACJ,IAAI,CAACQ,SAAS,CACrB;EACD,IAAIJ,KAAK,CAACH,QAAQ,EAAE;IAClBG,KAAK,CAACH,QAAQ,CAACO,SAAS,GAAGlB,YAAY,CACrCS,uBAAuB,CAACE,QAAQ,EAChCI,MAAM,CAACJ,QAAQ,EACfK,cAAc,IAAID,MAAM,CAACM,oBAAoB,EAC7CP,KAAK,CAACH,QAAQ,CAACO,SAAS,CACzB;;EAEH,OAAOJ,KAAK;AACd,CAAC","names":["mergeClasses","shorthands","tokens","createFocusOutlineStyle","MEDIA_QUERY_BREAKPOINT_SELECTOR","SURFACE_BORDER_RADIUS","SURFACE_BORDER_WIDTH","SURFACE_PADDING","useDialogContext_unstable","dialogSurfaceClassNames","root","backdrop","useStyles","useDialogSurfaceStyles_unstable","state","styles","isNestedDialog","ctx","className","focusOutline","nestedNativeDialogBackdrop","nestedDialogBackdrop"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurfaceStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport {\n  MEDIA_QUERY_BREAKPOINT_SELECTOR,\n  SURFACE_BORDER_RADIUS,\n  SURFACE_BORDER_WIDTH,\n  SURFACE_PADDING,\n  useDialogContext_unstable,\n} from '../../contexts';\nimport type { DialogSurfaceSlots, DialogSurfaceState } from './DialogSurface.types';\n\nexport const dialogSurfaceClassNames: SlotClassNames<DialogSurfaceSlots> = {\n  root: 'fui-DialogSurface',\n  backdrop: 'fui-DialogSurface__backdrop',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  focusOutline: createFocusOutlineStyle(),\n  root: {\n    display: 'block',\n    userSelect: 'unset',\n    visibility: 'unset',\n    ...shorthands.inset(0),\n    ...shorthands.padding(0),\n    ...shorthands.padding(SURFACE_PADDING),\n    ...shorthands.margin('auto'),\n    ...shorthands.borderStyle('none'),\n    ...shorthands.overflow('unset'),\n    '&::backdrop': {\n      backgroundColor: 'rgba(0, 0, 0, 0.4)',\n    },\n    position: 'fixed',\n    width: '100%',\n    height: 'fit-content',\n    maxWidth: '600px',\n    maxHeight: '100vh',\n    boxSizing: 'border-box',\n    boxShadow: tokens.shadow64,\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground1,\n    ...shorthands.border(SURFACE_BORDER_WIDTH, 'solid', tokens.colorTransparentStroke),\n    ...shorthands.borderRadius(SURFACE_BORDER_RADIUS),\n    [MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n      maxWidth: '100vw',\n    },\n  },\n  backdrop: {\n    position: 'fixed',\n    backgroundColor: 'rgba(0, 0, 0, 0.4)',\n    ...shorthands.inset('0px'),\n  },\n  nestedDialogBackdrop: {\n    backgroundColor: 'transparent',\n  },\n  nestedNativeDialogBackdrop: {\n    '&::backdrop': {\n      backgroundColor: 'transparent',\n    },\n  },\n});\n\n/**\n * Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = (state: DialogSurfaceState): DialogSurfaceState => {\n  const styles = useStyles();\n  const isNestedDialog = useDialogContext_unstable(ctx => ctx.isNestedDialog);\n\n  state.root.className = mergeClasses(\n    dialogSurfaceClassNames.root,\n    styles.root,\n    styles.focusOutline,\n    isNestedDialog && styles.nestedNativeDialogBackdrop,\n    state.root.className,\n  );\n  if (state.backdrop) {\n    state.backdrop.className = mergeClasses(\n      dialogSurfaceClassNames.backdrop,\n      styles.backdrop,\n      isNestedDialog && styles.nestedDialogBackdrop,\n      state.backdrop.className,\n    );\n  }\n  return state;\n};\n"]}

package/lib/components/DialogTitle/DialogTitle.js

@@ -6,7 +6,6 @@ import { useDialogTitleStyles_unstable } from './useDialogTitleStyles';
  * The `DialogTitle` component expects to have a title/header
  * and when `Dialog` is `non-modal` a close (X icon) button is provided through `action` slot by default.
  */
-
 export const DialogTitle = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDialogTitle_unstable(props, ref);
   useDialogTitleStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTitle/DialogTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,uBAAT,QAAwC,kBAAxC;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AAIA;;;AAGG;;AACH,OAAO,MAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAChG,MAAM,KAAK,GAAG,uBAAuB,CAAC,KAAD,EAAQ,GAAR,CAArC;EAEA,6BAA6B,CAAC,KAAD,CAA7B;EACA,OAAO,0BAA0B,CAAC,KAAD,CAAjC;AACD,CALiE,CAA3D;AAOP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { useDialogTitle_unstable } from './useDialogTitle';\nimport { renderDialogTitle_unstable } from './renderDialogTitle';\nimport { useDialogTitleStyles_unstable } from './useDialogTitleStyles';\nimport type { DialogTitleProps } from './DialogTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderDialogTitle_unstable(state);\n});\n\nDialogTitle.displayName = 'DialogTitle';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,6BAA6B,QAAQ,wBAAwB;AAItE;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGP,uBAAuB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEjDJ,6BAA6B,CAACK,KAAK,CAAC;EACpC,OAAON,0BAA0B,CAACM,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFJ,WAAW,CAACK,WAAW,GAAG,aAAa","names":["React","useDialogTitle_unstable","renderDialogTitle_unstable","useDialogTitleStyles_unstable","DialogTitle","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/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';\nimport type { DialogTitleProps } from './DialogTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderDialogTitle_unstable(state);\n});\n\nDialogTitle.displayName = 'DialogTitle';\n"]}

package/lib/components/DialogTitle/renderDialogTitle.js

@@ -3,14 +3,15 @@ import { getSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DialogTitle
  */
-
 export const renderDialogTitle_unstable = state => {
   const {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
-  }, slotProps.root.children), slots.action && /*#__PURE__*/React.createElement(slots.action, { ...slotProps.action
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(slots.root, {
+    ...slotProps.root
+  }, slotProps.root.children), slots.action && /*#__PURE__*/React.createElement(slots.action, {
+    ...slotProps.action
   }));
 };
 //# sourceMappingURL=renderDialogTitle.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTitle/renderDialogTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,0BAA0B,GAAI,KAAD,IAA4B;EACpE,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAmB,KAAnB,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EAAiC,SAAS,CAAC,IAAV,CAAe,QAAhD,CADF,EAEG,KAAK,CAAC,MAAN,iBAAgB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,EAAA,GAAK,SAAS,CAAC;EAAf,CAAb,CAFnB,CADF;AAMD,CATM","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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  const { slots, slotProps } = getSlots<DialogTitleSlots>(state);\n\n  return (\n    <>\n      <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root>\n      {slots.action && <slots.action {...slotProps.action} />}\n    </>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAmBE,KAAK,CAAC;EAE9D,oBACEH,uDACEA,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,GAAGD,SAAS,CAACC,IAAI,CAACC,QAAQ,CAAc,EACrEH,KAAK,CAACI,MAAM,iBAAIR,oBAACI,KAAK,CAACI,MAAM;IAAA,GAAKH,SAAS,CAACG;EAAM,EAAI,CACtD;AAEP,CAAC","names":["React","getSlots","renderDialogTitle_unstable","state","slots","slotProps","root","children","action"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/components/DialogTitle/renderDialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } 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  const { slots, slotProps } = getSlots<DialogTitleSlots>(state);\n\n  return (\n    <>\n      <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root>\n      {slots.action && <slots.action {...slotProps.action} />}\n    </>\n  );\n};\n"]}