@fluentui/react-dialog 9.10.6 → 9.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/CHANGELOG.md +157 -125
  2. package/dist/index.d.ts +7 -2
  3. package/lib/components/Dialog/index.js +1 -0
  4. package/lib/components/Dialog/index.js.map +1 -1
  5. package/lib/components/Dialog/renderDialog.js +7 -17
  6. package/lib/components/Dialog/renderDialog.js.map +1 -1
  7. package/lib/components/DialogBackdropMotion.js +23 -0
  8. package/lib/components/DialogBackdropMotion.js.map +1 -0
  9. package/lib/components/DialogSurface/DialogSurface.types.js.map +1 -1
  10. package/lib/components/DialogSurface/renderDialogSurface.js +7 -2
  11. package/lib/components/DialogSurface/renderDialogSurface.js.map +1 -1
  12. package/lib/components/DialogSurface/useDialogSurface.js +12 -16
  13. package/lib/components/DialogSurface/useDialogSurface.js.map +1 -1
  14. package/lib/components/DialogSurface/useDialogSurfaceStyles.styles.js +9 -79
  15. package/lib/components/DialogSurface/useDialogSurfaceStyles.styles.js.map +1 -1
  16. package/lib/components/DialogSurfaceMotion.js +28 -0
  17. package/lib/components/DialogSurfaceMotion.js.map +1 -0
  18. package/lib/components/DialogTitle/useDialogTitleStyles.styles.js +3 -3
  19. package/lib/index.js +1 -1
  20. package/lib/index.js.map +1 -1
  21. package/lib-commonjs/components/Dialog/index.js +1 -0
  22. package/lib-commonjs/components/Dialog/index.js.map +1 -1
  23. package/lib-commonjs/components/Dialog/renderDialog.js +8 -17
  24. package/lib-commonjs/components/Dialog/renderDialog.js.map +1 -1
  25. package/lib-commonjs/components/DialogBackdropMotion.js +33 -0
  26. package/lib-commonjs/components/DialogBackdropMotion.js.map +1 -0
  27. package/lib-commonjs/components/DialogSurface/renderDialogSurface.js +7 -2
  28. package/lib-commonjs/components/DialogSurface/renderDialogSurface.js.map +1 -1
  29. package/lib-commonjs/components/DialogSurface/useDialogSurface.js +12 -16
  30. package/lib-commonjs/components/DialogSurface/useDialogSurface.js.map +1 -1
  31. package/lib-commonjs/components/DialogSurface/useDialogSurfaceStyles.styles.js +24 -106
  32. package/lib-commonjs/components/DialogSurface/useDialogSurfaceStyles.styles.js.map +1 -1
  33. package/lib-commonjs/components/DialogSurfaceMotion.js +38 -0
  34. package/lib-commonjs/components/DialogSurfaceMotion.js.map +1 -0
  35. package/lib-commonjs/components/DialogTitle/useDialogTitleStyles.styles.js +13 -13
  36. package/lib-commonjs/components/DialogTitle/useDialogTitleStyles.styles.js.map +1 -1
  37. package/lib-commonjs/index.js +3 -0
  38. package/lib-commonjs/index.js.map +1 -1
  39. package/package.json +13 -13
  40. package/lib/contexts/dialogTransitionContext.js +0 -17
  41. package/lib/contexts/dialogTransitionContext.js.map +0 -1
  42. package/lib-commonjs/contexts/dialogTransitionContext.js +0 -32
  43. package/lib-commonjs/contexts/dialogTransitionContext.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["renderDialog.js"],"sourcesContent":[" import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { Transition } from 'react-transition-group';\nimport { DialogProvider, DialogSurfaceProvider } from '../../contexts';\nimport { DialogTransitionProvider } from '../../contexts/dialogTransitionContext';\n/**\n * Render the final JSX of Dialog\n */ export const renderDialog_unstable = (state, contextValues)=>{\n const { content, trigger } = state;\n return /*#__PURE__*/ _jsx(DialogProvider, {\n value: contextValues.dialog,\n children: /*#__PURE__*/ _jsxs(DialogSurfaceProvider, {\n value: contextValues.dialogSurface,\n children: [\n trigger,\n process.env.NODE_ENV === 'test' ? state.open && /*#__PURE__*/ _jsx(DialogTransitionProvider, {\n value: undefined,\n children: content\n }) : /*#__PURE__*/ _jsx(Transition, {\n mountOnEnter: true,\n unmountOnExit: true,\n in: state.open,\n nodeRef: state.dialogRef,\n appear: true,\n // FIXME: this should not be hardcoded tokens.durationGentle\n timeout: 250,\n children: (status)=>/*#__PURE__*/ _jsx(DialogTransitionProvider, {\n value: status,\n children: content\n })\n })\n ]\n })\n });\n};\n"],"names":["renderDialog_unstable","state","contextValues","content","trigger","_jsx","DialogProvider","value","dialog","children","_jsxs","DialogSurfaceProvider","dialogSurface","process","env","NODE_ENV","open","DialogTransitionProvider","undefined","Transition","mountOnEnter","unmountOnExit","in","nodeRef","dialogRef","appear","timeout","status"],"mappings":";;;;+BAMiBA;;;eAAAA;;;4BAN4B;sCAClB;0BAC2B;yCACb;AAG9B,MAAMA,wBAAwB,CAACC,OAAOC;IAC7C,MAAM,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGH;IAC7B,OAAO,WAAW,GAAGI,IAAAA,eAAI,EAACC,wBAAc,EAAE;QACtCC,OAAOL,cAAcM,MAAM;QAC3BC,UAAU,WAAW,GAAGC,IAAAA,gBAAK,EAACC,+BAAqB,EAAE;YACjDJ,OAAOL,cAAcU,aAAa;YAClCH,UAAU;gBACNL;gBACAS,QAAQC,GAAG,CAACC,QAAQ,KAAK,SAASd,MAAMe,IAAI,IAAI,WAAW,GAAGX,IAAAA,eAAI,EAACY,iDAAwB,EAAE;oBACzFV,OAAOW;oBACPT,UAAUN;gBACd,KAAK,WAAW,GAAGE,IAAAA,eAAI,EAACc,gCAAU,EAAE;oBAChCC,cAAc;oBACdC,eAAe;oBACfC,IAAIrB,MAAMe,IAAI;oBACdO,SAAStB,MAAMuB,SAAS;oBACxBC,QAAQ;oBACR,4DAA4D;oBAC5DC,SAAS;oBACTjB,UAAU,CAACkB,SAAS,WAAW,GAAGtB,IAAAA,eAAI,EAACY,iDAAwB,EAAE;4BACzDV,OAAOoB;4BACPlB,UAAUN;wBACd;gBACR;aACH;QACL;IACJ;AACJ"}
1
+ {"version":3,"sources":["renderDialog.js"],"sourcesContent":[" import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport * as React from 'react';\nimport { DialogProvider, DialogSurfaceProvider } from '../../contexts';\nimport { DialogSurfaceMotion } from '../DialogSurfaceMotion';\n/**\n * Render the final JSX of Dialog\n */ export const renderDialog_unstable = (state, contextValues)=>{\n const { content, open, trigger } = state;\n return /*#__PURE__*/ _jsx(DialogProvider, {\n value: contextValues.dialog,\n children: /*#__PURE__*/ _jsxs(DialogSurfaceProvider, {\n value: contextValues.dialogSurface,\n children: [\n trigger,\n content && /*#__PURE__*/ _jsx(DialogSurfaceMotion, {\n appear: true,\n visible: open,\n unmountOnExit: true,\n children: content\n })\n ]\n })\n });\n};\n"],"names":["renderDialog_unstable","state","contextValues","content","open","trigger","_jsx","DialogProvider","value","dialog","children","_jsxs","DialogSurfaceProvider","dialogSurface","DialogSurfaceMotion","appear","visible","unmountOnExit"],"mappings":";;;;+BAMiBA;;;eAAAA;;;;4BAN4B;iEACtB;0BAC+B;qCAClB;AAGzB,MAAMA,wBAAwB,CAACC,OAAOC;IAC7C,MAAM,EAAEC,OAAO,EAAEC,IAAI,EAAEC,OAAO,EAAE,GAAGJ;IACnC,OAAO,WAAW,GAAGK,IAAAA,eAAI,EAACC,wBAAc,EAAE;QACtCC,OAAON,cAAcO,MAAM;QAC3BC,UAAU,WAAW,GAAGC,IAAAA,gBAAK,EAACC,+BAAqB,EAAE;YACjDJ,OAAON,cAAcW,aAAa;YAClCH,UAAU;gBACNL;gBACAF,WAAW,WAAW,GAAGG,IAAAA,eAAI,EAACQ,wCAAmB,EAAE;oBAC/CC,QAAQ;oBACRC,SAASZ;oBACTa,eAAe;oBACfP,UAAUP;gBACd;aACH;QACL;IACJ;AACJ"}
@@ -0,0 +1,33 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "DialogBackdropMotion", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return DialogBackdropMotion;
9
+ }
10
+ });
11
+ const _reactmotion = require("@fluentui/react-motion");
12
+ const keyframes = [
13
+ {
14
+ opacity: 0
15
+ },
16
+ {
17
+ opacity: 1
18
+ }
19
+ ];
20
+ const DialogBackdropMotion = (0, _reactmotion.createPresenceComponent)({
21
+ enter: {
22
+ keyframes,
23
+ easing: _reactmotion.motionTokens.curveLinear,
24
+ duration: _reactmotion.motionTokens.durationGentle
25
+ },
26
+ exit: {
27
+ keyframes: [
28
+ ...keyframes
29
+ ].reverse(),
30
+ easing: _reactmotion.motionTokens.curveLinear,
31
+ duration: _reactmotion.motionTokens.durationGentle
32
+ }
33
+ });
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["DialogBackdropMotion.js"],"sourcesContent":["import { createPresenceComponent, motionTokens } from '@fluentui/react-motion';\nconst keyframes = [\n {\n opacity: 0\n },\n {\n opacity: 1\n }\n];\nexport const DialogBackdropMotion = createPresenceComponent({\n enter: {\n keyframes,\n easing: motionTokens.curveLinear,\n duration: motionTokens.durationGentle\n },\n exit: {\n keyframes: [\n ...keyframes\n ].reverse(),\n easing: motionTokens.curveLinear,\n duration: motionTokens.durationGentle\n }\n});\n"],"names":["DialogBackdropMotion","keyframes","opacity","createPresenceComponent","enter","easing","motionTokens","curveLinear","duration","durationGentle","exit","reverse"],"mappings":";;;;+BASaA;;;eAAAA;;;6BATyC;AACtD,MAAMC,YAAY;IACd;QACIC,SAAS;IACb;IACA;QACIA,SAAS;IACb;CACH;AACM,MAAMF,uBAAuBG,IAAAA,oCAAuB,EAAC;IACxDC,OAAO;QACHH;QACAI,QAAQC,yBAAY,CAACC,WAAW;QAChCC,UAAUF,yBAAY,CAACG,cAAc;IACzC;IACAC,MAAM;QACFT,WAAW;eACJA;SACN,CAACU,OAAO;QACTN,QAAQC,yBAAY,CAACC,WAAW;QAChCC,UAAUF,yBAAY,CAACG,cAAc;IACzC;AACJ"}
@@ -9,15 +9,20 @@ Object.defineProperty(exports, "renderDialogSurface_unstable", {
9
9
  }
10
10
  });
11
11
  const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
12
+ const _reactportal = require("@fluentui/react-portal");
12
13
  const _reactutilities = require("@fluentui/react-utilities");
13
14
  const _contexts = require("../../contexts");
14
- const _reactportal = require("@fluentui/react-portal");
15
+ const _DialogBackdropMotion = require("../DialogBackdropMotion");
15
16
  const renderDialogSurface_unstable = (state, contextValues)=>{
16
17
  (0, _reactutilities.assertSlots)(state);
17
18
  return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_reactportal.Portal, {
18
19
  mountNode: state.mountNode,
19
20
  children: [
20
- state.backdrop && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.backdrop, {}),
21
+ state.backdrop && /*#__PURE__*/ (0, _jsxruntime.jsx)(_DialogBackdropMotion.DialogBackdropMotion, {
22
+ appear: true,
23
+ visible: state.open,
24
+ children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.backdrop, {})
25
+ }),
21
26
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_contexts.DialogSurfaceProvider, {
22
27
  value: contextValues.dialogSurface,
23
28
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {})
@@ -1 +1 @@
1
- {"version":3,"sources":["renderDialogSurface.js"],"sourcesContent":[" import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { DialogSurfaceProvider } from '../../contexts';\nimport { Portal } from '@fluentui/react-portal';\n/**\n * Render the final JSX of DialogSurface\n */ export const renderDialogSurface_unstable = (state, contextValues)=>{\n assertSlots(state);\n return /*#__PURE__*/ _jsxs(Portal, {\n mountNode: state.mountNode,\n children: [\n state.backdrop && /*#__PURE__*/ _jsx(state.backdrop, {}),\n /*#__PURE__*/ _jsx(DialogSurfaceProvider, {\n value: contextValues.dialogSurface,\n children: /*#__PURE__*/ _jsx(state.root, {})\n })\n ]\n });\n};\n"],"names":["renderDialogSurface_unstable","state","contextValues","assertSlots","_jsxs","Portal","mountNode","children","backdrop","_jsx","DialogSurfaceProvider","value","dialogSurface","root"],"mappings":";;;;+BAMiBA;;;eAAAA;;;4BAN4B;gCACjB;0BACU;6BACf;AAGZ,MAAMA,+BAA+B,CAACC,OAAOC;IACpDC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,gBAAK,EAACC,mBAAM,EAAE;QAC/BC,WAAWL,MAAMK,SAAS;QAC1BC,UAAU;YACNN,MAAMO,QAAQ,IAAI,WAAW,GAAGC,IAAAA,eAAI,EAACR,MAAMO,QAAQ,EAAE,CAAC;YACtD,WAAW,GAAGC,IAAAA,eAAI,EAACC,+BAAqB,EAAE;gBACtCC,OAAOT,cAAcU,aAAa;gBAClCL,UAAU,WAAW,GAAGE,IAAAA,eAAI,EAACR,MAAMY,IAAI,EAAE,CAAC;YAC9C;SACH;IACL;AACJ"}
1
+ {"version":3,"sources":["renderDialogSurface.js"],"sourcesContent":[" import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { Portal } from '@fluentui/react-portal';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { DialogSurfaceProvider } from '../../contexts';\nimport { DialogBackdropMotion } from '../DialogBackdropMotion';\n/**\n * Render the final JSX of DialogSurface\n */ export const renderDialogSurface_unstable = (state, contextValues)=>{\n assertSlots(state);\n return /*#__PURE__*/ _jsxs(Portal, {\n mountNode: state.mountNode,\n children: [\n state.backdrop && /*#__PURE__*/ _jsx(DialogBackdropMotion, {\n appear: true,\n visible: state.open,\n children: /*#__PURE__*/ _jsx(state.backdrop, {})\n }),\n /*#__PURE__*/ _jsx(DialogSurfaceProvider, {\n value: contextValues.dialogSurface,\n children: /*#__PURE__*/ _jsx(state.root, {})\n })\n ]\n });\n};\n"],"names":["renderDialogSurface_unstable","state","contextValues","assertSlots","_jsxs","Portal","mountNode","children","backdrop","_jsx","DialogBackdropMotion","appear","visible","open","DialogSurfaceProvider","value","dialogSurface","root"],"mappings":";;;;+BAOiBA;;;eAAAA;;;4BAP4B;6BACtB;gCACK;0BACU;sCACD;AAG1B,MAAMA,+BAA+B,CAACC,OAAOC;IACpDC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,gBAAK,EAACC,mBAAM,EAAE;QAC/BC,WAAWL,MAAMK,SAAS;QAC1BC,UAAU;YACNN,MAAMO,QAAQ,IAAI,WAAW,GAAGC,IAAAA,eAAI,EAACC,0CAAoB,EAAE;gBACvDC,QAAQ;gBACRC,SAASX,MAAMY,IAAI;gBACnBN,UAAU,WAAW,GAAGE,IAAAA,eAAI,EAACR,MAAMO,QAAQ,EAAE,CAAC;YAClD;YACA,WAAW,GAAGC,IAAAA,eAAI,EAACK,+BAAqB,EAAE;gBACtCC,OAAOb,cAAcc,aAAa;gBAClCT,UAAU,WAAW,GAAGE,IAAAA,eAAI,EAACR,MAAMgB,IAAI,EAAE,CAAC;YAC9C;SACH;IACL;AACJ"}
@@ -9,16 +9,14 @@ Object.defineProperty(exports, "useDialogSurface_unstable", {
9
9
  }
10
10
  });
11
11
  const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
12
- const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
12
+ const _keyboardkeys = require("@fluentui/keyboard-keys");
13
13
  const _reactutilities = require("@fluentui/react-utilities");
14
+ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
14
15
  const _contexts = require("../../contexts");
15
- const _keyboardkeys = require("@fluentui/keyboard-keys");
16
- const _dialogTransitionContext = require("../../contexts/dialogTransitionContext");
17
16
  const _useDisableBodyScroll = require("../../utils/useDisableBodyScroll");
18
17
  const useDialogSurface_unstable = (props, ref)=>{
19
18
  const modalType = (0, _contexts.useDialogContext_unstable)((ctx)=>ctx.modalType);
20
19
  const isNestedDialog = (0, _contexts.useDialogContext_unstable)((ctx)=>ctx.isNestedDialog);
21
- const transitionStatus = (0, _dialogTransitionContext.useDialogTransitionContext_unstable)();
22
20
  const modalAttributes = (0, _contexts.useDialogContext_unstable)((ctx)=>ctx.modalAttributes);
23
21
  const dialogRef = (0, _contexts.useDialogContext_unstable)((ctx)=>ctx.dialogRef);
24
22
  const requestOpenChange = (0, _contexts.useDialogContext_unstable)((ctx)=>ctx.requestOpenChange);
@@ -62,32 +60,28 @@ const useDialogSurface_unstable = (props, ref)=>{
62
60
  backdrop.onClick = handledBackdropClick;
63
61
  }
64
62
  const { disableBodyScroll, enableBodyScroll } = (0, _useDisableBodyScroll.useDisableBodyScroll)();
65
- const isBodyScrollLocked = Boolean(open && modalType !== 'non-modal');
66
63
  (0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
67
- if (isNestedDialog) {
64
+ if (isNestedDialog || modalType === 'non-modal') {
68
65
  return;
69
66
  }
70
- if (open && isBodyScrollLocked && transitionStatus === 'entering') {
71
- disableBodyScroll();
72
- } else if (transitionStatus === 'exited') {
67
+ disableBodyScroll();
68
+ return ()=>{
73
69
  enableBodyScroll();
74
- }
70
+ };
75
71
  }, [
76
- disableBodyScroll,
77
72
  enableBodyScroll,
78
- isBodyScrollLocked,
79
73
  isNestedDialog,
80
- open,
81
- transitionStatus
74
+ disableBodyScroll,
75
+ modalType
82
76
  ]);
83
77
  return {
84
78
  components: {
85
79
  backdrop: 'div',
86
80
  root: 'div'
87
81
  },
82
+ open,
88
83
  backdrop,
89
84
  isNestedDialog,
90
- transitionStatus,
91
85
  mountNode: props.mountNode,
92
86
  root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
93
87
  tabIndex: -1,
@@ -103,6 +97,8 @@ const useDialogSurface_unstable = (props, ref)=>{
103
97
  ref: (0, _reactutilities.useMergedRefs)(ref, dialogRef)
104
98
  }), {
105
99
  elementType: 'div'
106
- })
100
+ }),
101
+ // Deprecated properties
102
+ transitionStatus: undefined
107
103
  };
108
104
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["useDialogSurface.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useMergedRefs, isResolvedShorthand, slot, getIntrinsicElementProps, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useDialogContext_unstable } from '../../contexts';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport { useDialogTransitionContext_unstable } from '../../contexts/dialogTransitionContext';\nimport { useDisableBodyScroll } from '../../utils/useDisableBodyScroll';\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 */ export const useDialogSurface_unstable = (props, ref)=>{\n const modalType = useDialogContext_unstable((ctx)=>ctx.modalType);\n const isNestedDialog = useDialogContext_unstable((ctx)=>ctx.isNestedDialog);\n const transitionStatus = useDialogTransitionContext_unstable();\n const modalAttributes = useDialogContext_unstable((ctx)=>ctx.modalAttributes);\n const dialogRef = useDialogContext_unstable((ctx)=>ctx.dialogRef);\n const requestOpenChange = useDialogContext_unstable((ctx)=>ctx.requestOpenChange);\n const dialogTitleID = useDialogContext_unstable((ctx)=>ctx.dialogTitleId);\n const open = useDialogContext_unstable((ctx)=>ctx.open);\n const handledBackdropClick = useEventCallback((event)=>{\n if (isResolvedShorthand(props.backdrop)) {\n var _props_backdrop_onClick, _props_backdrop;\n (_props_backdrop_onClick = (_props_backdrop = props.backdrop).onClick) === null || _props_backdrop_onClick === void 0 ? void 0 : _props_backdrop_onClick.call(_props_backdrop, event);\n }\n if (modalType === 'modal' && !event.isDefaultPrevented()) {\n requestOpenChange({\n event,\n open: false,\n type: 'backdropClick'\n });\n }\n });\n const handleKeyDown = useEventCallback((event)=>{\n var _props_onKeyDown;\n (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, event);\n if (event.key === Escape && !event.isDefaultPrevented()) {\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.preventDefault();\n }\n });\n const backdrop = slot.optional(props.backdrop, {\n renderByDefault: modalType !== 'non-modal',\n defaultProps: {\n 'aria-hidden': 'true'\n },\n elementType: 'div'\n });\n if (backdrop) {\n backdrop.onClick = handledBackdropClick;\n }\n const { disableBodyScroll, enableBodyScroll } = useDisableBodyScroll();\n const isBodyScrollLocked = Boolean(open && modalType !== 'non-modal');\n useIsomorphicLayoutEffect(()=>{\n if (isNestedDialog) {\n return;\n }\n if (open && isBodyScrollLocked && transitionStatus === 'entering') {\n disableBodyScroll();\n } else if (transitionStatus === 'exited') {\n enableBodyScroll();\n }\n }, [\n disableBodyScroll,\n enableBodyScroll,\n isBodyScrollLocked,\n isNestedDialog,\n open,\n transitionStatus\n ]);\n return {\n components: {\n backdrop: 'div',\n root: 'div'\n },\n backdrop,\n isNestedDialog,\n transitionStatus,\n mountNode: props.mountNode,\n root: slot.always(getIntrinsicElementProps('div', {\n tabIndex: -1,\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 // FIXME:\n // `DialogSurfaceElement` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, dialogRef)\n }), {\n elementType: 'div'\n })\n };\n};\n"],"names":["useDialogSurface_unstable","props","ref","modalType","useDialogContext_unstable","ctx","isNestedDialog","transitionStatus","useDialogTransitionContext_unstable","modalAttributes","dialogRef","requestOpenChange","dialogTitleID","dialogTitleId","open","handledBackdropClick","useEventCallback","event","isResolvedShorthand","backdrop","_props_backdrop_onClick","_props_backdrop","onClick","call","isDefaultPrevented","type","handleKeyDown","_props_onKeyDown","onKeyDown","key","Escape","preventDefault","slot","optional","renderByDefault","defaultProps","elementType","disableBodyScroll","enableBodyScroll","useDisableBodyScroll","isBodyScrollLocked","Boolean","useIsomorphicLayoutEffect","components","root","mountNode","always","getIntrinsicElementProps","tabIndex","role","undefined","useMergedRefs"],"mappings":"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"}
1
+ {"version":3,"sources":["useDialogSurface.js"],"sourcesContent":["import { Escape } from '@fluentui/keyboard-keys';\nimport { useEventCallback, useMergedRefs, isResolvedShorthand, slot, getIntrinsicElementProps, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useDialogContext_unstable } from '../../contexts';\nimport { useDisableBodyScroll } from '../../utils/useDisableBodyScroll';\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 */ export const useDialogSurface_unstable = (props, ref)=>{\n const modalType = useDialogContext_unstable((ctx)=>ctx.modalType);\n const isNestedDialog = useDialogContext_unstable((ctx)=>ctx.isNestedDialog);\n const modalAttributes = useDialogContext_unstable((ctx)=>ctx.modalAttributes);\n const dialogRef = useDialogContext_unstable((ctx)=>ctx.dialogRef);\n const requestOpenChange = useDialogContext_unstable((ctx)=>ctx.requestOpenChange);\n const dialogTitleID = useDialogContext_unstable((ctx)=>ctx.dialogTitleId);\n const open = useDialogContext_unstable((ctx)=>ctx.open);\n const handledBackdropClick = useEventCallback((event)=>{\n if (isResolvedShorthand(props.backdrop)) {\n var _props_backdrop_onClick, _props_backdrop;\n (_props_backdrop_onClick = (_props_backdrop = props.backdrop).onClick) === null || _props_backdrop_onClick === void 0 ? void 0 : _props_backdrop_onClick.call(_props_backdrop, event);\n }\n if (modalType === 'modal' && !event.isDefaultPrevented()) {\n requestOpenChange({\n event,\n open: false,\n type: 'backdropClick'\n });\n }\n });\n const handleKeyDown = useEventCallback((event)=>{\n var _props_onKeyDown;\n (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, event);\n if (event.key === Escape && !event.isDefaultPrevented()) {\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.preventDefault();\n }\n });\n const backdrop = slot.optional(props.backdrop, {\n renderByDefault: modalType !== 'non-modal',\n defaultProps: {\n 'aria-hidden': 'true'\n },\n elementType: 'div'\n });\n if (backdrop) {\n backdrop.onClick = handledBackdropClick;\n }\n const { disableBodyScroll, enableBodyScroll } = useDisableBodyScroll();\n useIsomorphicLayoutEffect(()=>{\n if (isNestedDialog || modalType === 'non-modal') {\n return;\n }\n disableBodyScroll();\n return ()=>{\n enableBodyScroll();\n };\n }, [\n enableBodyScroll,\n isNestedDialog,\n disableBodyScroll,\n modalType\n ]);\n return {\n components: {\n backdrop: 'div',\n root: 'div'\n },\n open,\n backdrop,\n isNestedDialog,\n mountNode: props.mountNode,\n root: slot.always(getIntrinsicElementProps('div', {\n tabIndex: -1,\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 // FIXME:\n // `DialogSurfaceElement` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, dialogRef)\n }), {\n elementType: 'div'\n }),\n // Deprecated properties\n transitionStatus: undefined\n };\n};\n"],"names":["useDialogSurface_unstable","props","ref","modalType","useDialogContext_unstable","ctx","isNestedDialog","modalAttributes","dialogRef","requestOpenChange","dialogTitleID","dialogTitleId","open","handledBackdropClick","useEventCallback","event","isResolvedShorthand","backdrop","_props_backdrop_onClick","_props_backdrop","onClick","call","isDefaultPrevented","type","handleKeyDown","_props_onKeyDown","onKeyDown","key","Escape","preventDefault","slot","optional","renderByDefault","defaultProps","elementType","disableBodyScroll","enableBodyScroll","useDisableBodyScroll","useIsomorphicLayoutEffect","components","root","mountNode","always","getIntrinsicElementProps","tabIndex","role","undefined","useMergedRefs","transitionStatus"],"mappings":"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"}
@@ -17,136 +17,54 @@ _export(exports, {
17
17
  }
18
18
  });
19
19
  const _react = require("@griffel/react");
20
- const _reacttheme = require("@fluentui/react-theme");
21
20
  const dialogSurfaceClassNames = {
22
21
  root: 'fui-DialogSurface',
23
22
  backdrop: 'fui-DialogSurface__backdrop'
24
23
  };
25
24
  /**
26
25
  * Styles for the root slot
27
- */ const useRootBaseStyle = /*#__PURE__*/ (0, _react.__resetStyles)("rhzkxut", "r1dhpx9", {
26
+ */ const useRootBaseStyle = /*#__PURE__*/ (0, _react.__resetStyles)("r1svjbtt", "r131yuoq", {
28
27
  r: [
29
- ".rhzkxut{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}",
30
- ".rhzkxut:focus{outline-style:none;}",
31
- ".rhzkxut:focus-visible{outline-style:none;}",
32
- ".rhzkxut[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
33
- ".rhzkxut[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
34
- ".r1dhpx9{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}",
35
- ".r1dhpx9:focus{outline-style:none;}",
36
- ".r1dhpx9:focus-visible{outline-style:none;}",
37
- ".r1dhpx9[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
38
- ".r1dhpx9[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
28
+ ".r1svjbtt{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}",
29
+ ".r1svjbtt:focus{outline-style:none;}",
30
+ ".r1svjbtt:focus-visible{outline-style:none;}",
31
+ ".r1svjbtt[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
32
+ ".r1svjbtt[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
33
+ ".r131yuoq{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}",
34
+ ".r131yuoq:focus{outline-style:none;}",
35
+ ".r131yuoq:focus-visible{outline-style:none;}",
36
+ ".r131yuoq[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
37
+ ".r131yuoq[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
39
38
  ],
40
39
  s: [
41
- "@media (forced-colors: active){.rhzkxut[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
42
- "@media screen and (max-width: 480px){.rhzkxut{max-width:100vw;}}",
43
- "@media screen and (max-height: 359px){.rhzkxut{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}",
44
- "@media (forced-colors: active){.r1dhpx9[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}",
45
- "@media screen and (max-width: 480px){.r1dhpx9{max-width:100vw;}}",
46
- "@media screen and (max-height: 359px){.r1dhpx9{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}"
40
+ "@media (forced-colors: active){.r1svjbtt[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
41
+ "@media screen and (max-width: 480px){.r1svjbtt{max-width:100vw;}}",
42
+ "@media screen and (max-height: 359px){.r1svjbtt{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}",
43
+ "@media (forced-colors: active){.r131yuoq[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}",
44
+ "@media screen and (max-width: 480px){.r131yuoq{max-width:100vw;}}",
45
+ "@media screen and (max-height: 359px){.r131yuoq{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}"
47
46
  ]
48
47
  });
49
- const rootVisible = {
50
- boxShadow: _reacttheme.tokens.shadow64,
51
- transform: 'scale(1) translateZ(0)',
52
- opacity: 1
53
- };
54
- const rootWhenAnimating = {
55
- transitionDuration: _reacttheme.tokens.durationGentle,
56
- transitionProperty: 'opacity, transform, box-shadow',
57
- // // FIXME: https://github.com/microsoft/fluentui/issues/29473
58
- transitionTimingFunction: _reacttheme.tokens.curveDecelerateMid
59
- };
60
- const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
61
- animated: {
62
- abs64n: "fk73vx1",
63
- E5pizo: "f1yzz98r",
64
- Bz10aip: "f15ofi6c"
65
- },
66
- "static": {
67
- E5pizo: "f10nrhrw"
68
- },
69
- unmounted: {},
70
- entering: {
71
- B3o57yi: "fc397y7",
72
- Bmy1vo4: "f1b86uth",
73
- Bkqvd7p: "f18ad807",
74
- E5pizo: "f10nrhrw",
75
- Bz10aip: "f186d0ee",
76
- abs64n: "f5p0z4x"
77
- },
78
- entered: {
79
- E5pizo: "f10nrhrw",
80
- Bz10aip: "f186d0ee",
81
- abs64n: "f5p0z4x"
82
- },
83
- idle: {
84
- E5pizo: "f10nrhrw",
85
- Bz10aip: "f186d0ee",
86
- abs64n: "f5p0z4x"
87
- },
88
- exiting: {
89
- B3o57yi: "fc397y7",
90
- Bmy1vo4: "f1b86uth",
91
- Bkqvd7p: "f1mfizis"
92
- },
93
- exited: {}
94
- }, {
95
- d: [
96
- ".fk73vx1{opacity:0;}",
97
- ".f1yzz98r{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.1);}",
98
- ".f15ofi6c{transform:scale(0.85) translateZ(0);}",
99
- ".f10nrhrw{box-shadow:var(--shadow64);}",
100
- ".fc397y7{transition-duration:var(--durationGentle);}",
101
- ".f1b86uth{transition-property:opacity,transform,box-shadow;}",
102
- ".f18ad807{transition-timing-function:var(--curveDecelerateMid);}",
103
- ".f186d0ee{transform:scale(1) translateZ(0);}",
104
- ".f5p0z4x{opacity:1;}",
105
- ".f1mfizis{transition-timing-function:var(--curveAccelerateMin);}"
106
- ]
107
- });
108
- /**
109
- * Styles for the backdrop slot
110
- */ const backdropVisible = {
111
- opacity: 1
112
- };
113
- const useBackdropBaseStyle = /*#__PURE__*/ (0, _react.__resetStyles)("r19ug08i", null, [
114
- ".r19ug08i{inset:0px;background-color:rgba(0, 0, 0, 0.4);position:fixed;transition-duration:var(--durationGentle);transition-timing-function:var(--curveLinear);transition-property:opacity;will-change:opacity;opacity:0;}"
48
+ const useBackdropBaseStyle = /*#__PURE__*/ (0, _react.__resetStyles)("rsptlh5", null, [
49
+ ".rsptlh5{inset:0px;background-color:rgba(0, 0, 0, 0.4);position:fixed;}"
115
50
  ]);
116
51
  const useBackdropStyles = /*#__PURE__*/ (0, _react.__styles)({
117
52
  nestedDialogBackdrop: {
118
53
  De3pzq: "f1c21dwh"
119
- },
120
- unmounted: {},
121
- entering: {
122
- abs64n: "f5p0z4x"
123
- },
124
- entered: {
125
- abs64n: "f5p0z4x"
126
- },
127
- idle: {
128
- abs64n: "f5p0z4x"
129
- },
130
- exiting: {
131
- Bkqvd7p: "f1mfizis"
132
- },
133
- exited: {}
54
+ }
134
55
  }, {
135
56
  d: [
136
- ".f1c21dwh{background-color:var(--colorTransparentBackground);}",
137
- ".f5p0z4x{opacity:1;}",
138
- ".f1mfizis{transition-timing-function:var(--curveAccelerateMin);}"
57
+ ".f1c21dwh{background-color:var(--colorTransparentBackground);}"
139
58
  ]
140
59
  });
141
60
  const useDialogSurfaceStyles_unstable = (state)=>{
142
- const { isNestedDialog, root, backdrop, transitionStatus } = state;
61
+ const { isNestedDialog, root, backdrop } = state;
143
62
  const rootBaseStyle = useRootBaseStyle();
144
- const rootStyles = useRootStyles();
145
63
  const backdropBaseStyle = useBackdropBaseStyle();
146
64
  const backdropStyles = useBackdropStyles();
147
- root.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.root, rootBaseStyle, transitionStatus ? rootStyles.animated : rootStyles.static, transitionStatus && rootStyles[transitionStatus], root.className);
65
+ root.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.root, rootBaseStyle, root.className);
148
66
  if (backdrop) {
149
- backdrop.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && backdropStyles.nestedDialogBackdrop, transitionStatus && backdropStyles[transitionStatus], backdrop.className);
67
+ backdrop.className = (0, _react.mergeClasses)(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && backdropStyles.nestedDialogBackdrop, backdrop.className);
150
68
  }
151
69
  return state;
152
70
  }; //# sourceMappingURL=useDialogSurfaceStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["useDialogSurfaceStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { FULLSCREEN_DIALOG_SCROLLBAR_OFFSET, MEDIA_QUERY_BREAKPOINT_SELECTOR, MEDIA_QUERY_SHORT_SCREEN, SURFACE_BORDER_WIDTH, SURFACE_PADDING } from '../../contexts';\nexport const dialogSurfaceClassNames = {\n root: 'fui-DialogSurface',\n backdrop: 'fui-DialogSurface__backdrop'\n};\n/**\n * Styles for the root slot\n */\nconst useRootBaseStyle = /*#__PURE__*/__resetStyles(\"rhzkxut\", \"r1dhpx9\", {\n r: [\".rhzkxut{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}\", \".rhzkxut:focus{outline-style:none;}\", \".rhzkxut:focus-visible{outline-style:none;}\", \".rhzkxut[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".rhzkxut[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".r1dhpx9{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}\", \".r1dhpx9:focus{outline-style:none;}\", \".r1dhpx9:focus-visible{outline-style:none;}\", \".r1dhpx9[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".r1dhpx9[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n s: [\"@media (forced-colors: active){.rhzkxut[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media screen and (max-width: 480px){.rhzkxut{max-width:100vw;}}\", \"@media screen and (max-height: 359px){.rhzkxut{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}\", \"@media (forced-colors: active){.r1dhpx9[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\", \"@media screen and (max-width: 480px){.r1dhpx9{max-width:100vw;}}\", \"@media screen and (max-height: 359px){.r1dhpx9{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}\"]\n});\nconst rootVisible = {\n boxShadow: tokens.shadow64,\n transform: 'scale(1) translateZ(0)',\n opacity: 1\n};\nconst rootWhenAnimating = {\n transitionDuration: tokens.durationGentle,\n transitionProperty: 'opacity, transform, box-shadow',\n // // FIXME: https://github.com/microsoft/fluentui/issues/29473\n transitionTimingFunction: tokens.curveDecelerateMid\n};\nconst useRootStyles = /*#__PURE__*/__styles({\n animated: {\n abs64n: \"fk73vx1\",\n E5pizo: \"f1yzz98r\",\n Bz10aip: \"f15ofi6c\"\n },\n \"static\": {\n E5pizo: \"f10nrhrw\"\n },\n unmounted: {},\n entering: {\n B3o57yi: \"fc397y7\",\n Bmy1vo4: \"f1b86uth\",\n Bkqvd7p: \"f18ad807\",\n E5pizo: \"f10nrhrw\",\n Bz10aip: \"f186d0ee\",\n abs64n: \"f5p0z4x\"\n },\n entered: {\n E5pizo: \"f10nrhrw\",\n Bz10aip: \"f186d0ee\",\n abs64n: \"f5p0z4x\"\n },\n idle: {\n E5pizo: \"f10nrhrw\",\n Bz10aip: \"f186d0ee\",\n abs64n: \"f5p0z4x\"\n },\n exiting: {\n B3o57yi: \"fc397y7\",\n Bmy1vo4: \"f1b86uth\",\n Bkqvd7p: \"f1mfizis\"\n },\n exited: {}\n}, {\n d: [\".fk73vx1{opacity:0;}\", \".f1yzz98r{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.1);}\", \".f15ofi6c{transform:scale(0.85) translateZ(0);}\", \".f10nrhrw{box-shadow:var(--shadow64);}\", \".fc397y7{transition-duration:var(--durationGentle);}\", \".f1b86uth{transition-property:opacity,transform,box-shadow;}\", \".f18ad807{transition-timing-function:var(--curveDecelerateMid);}\", \".f186d0ee{transform:scale(1) translateZ(0);}\", \".f5p0z4x{opacity:1;}\", \".f1mfizis{transition-timing-function:var(--curveAccelerateMin);}\"]\n});\n/**\n * Styles for the backdrop slot\n */\nconst backdropVisible = {\n opacity: 1\n};\nconst useBackdropBaseStyle = /*#__PURE__*/__resetStyles(\"r19ug08i\", null, [\".r19ug08i{inset:0px;background-color:rgba(0, 0, 0, 0.4);position:fixed;transition-duration:var(--durationGentle);transition-timing-function:var(--curveLinear);transition-property:opacity;will-change:opacity;opacity:0;}\"]);\nconst useBackdropStyles = /*#__PURE__*/__styles({\n nestedDialogBackdrop: {\n De3pzq: \"f1c21dwh\"\n },\n unmounted: {},\n entering: {\n abs64n: \"f5p0z4x\"\n },\n entered: {\n abs64n: \"f5p0z4x\"\n },\n idle: {\n abs64n: \"f5p0z4x\"\n },\n exiting: {\n Bkqvd7p: \"f1mfizis\"\n },\n exited: {}\n}, {\n d: [\".f1c21dwh{background-color:var(--colorTransparentBackground);}\", \".f5p0z4x{opacity:1;}\", \".f1mfizis{transition-timing-function:var(--curveAccelerateMin);}\"]\n});\n/**\n * Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = state => {\n const {\n isNestedDialog,\n root,\n backdrop,\n transitionStatus\n } = state;\n const rootBaseStyle = useRootBaseStyle();\n const rootStyles = useRootStyles();\n const backdropBaseStyle = useBackdropBaseStyle();\n const backdropStyles = useBackdropStyles();\n root.className = mergeClasses(dialogSurfaceClassNames.root, rootBaseStyle, transitionStatus ? rootStyles.animated : rootStyles.static, transitionStatus && rootStyles[transitionStatus], root.className);\n if (backdrop) {\n backdrop.className = mergeClasses(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && backdropStyles.nestedDialogBackdrop, transitionStatus && backdropStyles[transitionStatus], backdrop.className);\n }\n return state;\n};\n//# sourceMappingURL=useDialogSurfaceStyles.styles.js.map"],"names":["dialogSurfaceClassNames","useDialogSurfaceStyles_unstable","root","backdrop","useRootBaseStyle","__resetStyles","r","s","rootVisible","boxShadow","tokens","shadow64","transform","opacity","rootWhenAnimating","transitionDuration","durationGentle","transitionProperty","transitionTimingFunction","curveDecelerateMid","useRootStyles","__styles","animated","abs64n","E5pizo","Bz10aip","unmounted","entering","B3o57yi","Bmy1vo4","Bkqvd7p","entered","idle","exiting","exited","d","backdropVisible","useBackdropBaseStyle","useBackdropStyles","nestedDialogBackdrop","De3pzq","state","isNestedDialog","transitionStatus","rootBaseStyle","rootStyles","backdropBaseStyle","backdropStyles","className","mergeClasses","static"],"mappings":";;;;;;;;;;;IAIaA,uBAAuB;eAAvBA;;IA0FAC,+BAA+B;eAA/BA;;;uBA9FyC;4BAC/B;AAGhB,MAAMD,0BAA0B;IACrCE,MAAM;IACNC,UAAU;AACZ;AACA;;CAEC,GACD,MAAMC,mBAAmB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,WAAW,WAAW;IACxEC,GAAG;QAAC;QAAub;QAAuC;QAA+C;QAAgK;QAAkvB;QAAub;QAAuC;QAA+C;QAAgK;KAAivB;IACj0FC,GAAG;QAAC;QAA+L;QAAoE;QAAwK;QAA+L;QAAoE;KAAqK;AACz1B;AACA,MAAMC,cAAc;IAClBC,WAAWC,kBAAM,CAACC,QAAQ;IAC1BC,WAAW;IACXC,SAAS;AACX;AACA,MAAMC,oBAAoB;IACxBC,oBAAoBL,kBAAM,CAACM,cAAc;IACzCC,oBAAoB;IACpB,+DAA+D;IAC/DC,0BAA0BR,kBAAM,CAACS,kBAAkB;AACrD;AACA,MAAMC,gBAAgB,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IAC1CC,UAAU;QACRC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;IACA,UAAU;QACRD,QAAQ;IACV;IACAE,WAAW,CAAC;IACZC,UAAU;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTN,QAAQ;QACRC,SAAS;QACTF,QAAQ;IACV;IACAQ,SAAS;QACPP,QAAQ;QACRC,SAAS;QACTF,QAAQ;IACV;IACAS,MAAM;QACJR,QAAQ;QACRC,SAAS;QACTF,QAAQ;IACV;IACAU,SAAS;QACPL,SAAS;QACTC,SAAS;QACTC,SAAS;IACX;IACAI,QAAQ,CAAC;AACX,GAAG;IACDC,GAAG;QAAC;QAAwB;QAA6D;QAAmD;QAA0C;QAAwD;QAAgE;QAAoE;QAAgD;QAAwB;KAAmE;AAC/f;AACA;;CAEC,GACD,MAAMC,kBAAkB;IACtBvB,SAAS;AACX;AACA,MAAMwB,uBAAuB,WAAW,GAAEhC,IAAAA,oBAAa,EAAC,YAAY,MAAM;IAAC;CAA6N;AACxS,MAAMiC,oBAAoB,WAAW,GAAEjB,IAAAA,eAAQ,EAAC;IAC9CkB,sBAAsB;QACpBC,QAAQ;IACV;IACAd,WAAW,CAAC;IACZC,UAAU;QACRJ,QAAQ;IACV;IACAQ,SAAS;QACPR,QAAQ;IACV;IACAS,MAAM;QACJT,QAAQ;IACV;IACAU,SAAS;QACPH,SAAS;IACX;IACAI,QAAQ,CAAC;AACX,GAAG;IACDC,GAAG;QAAC;QAAkE;QAAwB;KAAmE;AACnK;AAIO,MAAMlC,kCAAkCwC,CAAAA;IAC7C,MAAM,EACJC,cAAc,EACdxC,IAAI,EACJC,QAAQ,EACRwC,gBAAgB,EACjB,GAAGF;IACJ,MAAMG,gBAAgBxC;IACtB,MAAMyC,aAAazB;IACnB,MAAM0B,oBAAoBT;IAC1B,MAAMU,iBAAiBT;IACvBpC,KAAK8C,SAAS,GAAGC,IAAAA,mBAAY,EAACjD,wBAAwBE,IAAI,EAAE0C,eAAeD,mBAAmBE,WAAWvB,QAAQ,GAAGuB,WAAWK,MAAM,EAAEP,oBAAoBE,UAAU,CAACF,iBAAiB,EAAEzC,KAAK8C,SAAS;IACvM,IAAI7C,UAAU;QACZA,SAAS6C,SAAS,GAAGC,IAAAA,mBAAY,EAACjD,wBAAwBG,QAAQ,EAAE2C,mBAAmBJ,kBAAkBK,eAAeR,oBAAoB,EAAEI,oBAAoBI,cAAc,CAACJ,iBAAiB,EAAExC,SAAS6C,SAAS;IACxN;IACA,OAAOP;AACT,GACA,yDAAyD"}
1
+ {"version":3,"sources":["useDialogSurfaceStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { FULLSCREEN_DIALOG_SCROLLBAR_OFFSET, MEDIA_QUERY_BREAKPOINT_SELECTOR, MEDIA_QUERY_SHORT_SCREEN, SURFACE_BORDER_WIDTH, SURFACE_PADDING } from '../../contexts';\nexport const dialogSurfaceClassNames = {\n root: 'fui-DialogSurface',\n backdrop: 'fui-DialogSurface__backdrop'\n};\n/**\n * Styles for the root slot\n */\nconst useRootBaseStyle = /*#__PURE__*/__resetStyles(\"r1svjbtt\", \"r131yuoq\", {\n r: [\".r1svjbtt{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}\", \".r1svjbtt:focus{outline-style:none;}\", \".r1svjbtt:focus-visible{outline-style:none;}\", \".r1svjbtt[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".r1svjbtt[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".r131yuoq{inset:0;padding:24px;margin:auto;border-style:none;overflow:unset;border:1px solid var(--colorTransparentStroke);border-radius:var(--borderRadiusXLarge);display:block;-webkit-user-select:unset;-moz-user-select:unset;user-select:unset;visibility:unset;position:fixed;height:fit-content;max-width:600px;max-height:100vh;box-sizing:border-box;background-color:var(--colorNeutralBackground1);color:var(--colorNeutralForeground1);}\", \".r131yuoq:focus{outline-style:none;}\", \".r131yuoq:focus-visible{outline-style:none;}\", \".r131yuoq[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".r131yuoq[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n s: [\"@media (forced-colors: active){.r1svjbtt[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media screen and (max-width: 480px){.r1svjbtt{max-width:100vw;}}\", \"@media screen and (max-height: 359px){.r1svjbtt{overflow-y:auto;padding-right:calc(24px - 4px);border-right-width:4px;border-top-width:4px;border-bottom-width:4px;}}\", \"@media (forced-colors: active){.r131yuoq[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\", \"@media screen and (max-width: 480px){.r131yuoq{max-width:100vw;}}\", \"@media screen and (max-height: 359px){.r131yuoq{overflow-y:auto;padding-left:calc(24px - 4px);border-left-width:4px;border-top-width:4px;border-bottom-width:4px;}}\"]\n});\nconst useBackdropBaseStyle = /*#__PURE__*/__resetStyles(\"rsptlh5\", null, [\".rsptlh5{inset:0px;background-color:rgba(0, 0, 0, 0.4);position:fixed;}\"]);\nconst useBackdropStyles = /*#__PURE__*/__styles({\n nestedDialogBackdrop: {\n De3pzq: \"f1c21dwh\"\n }\n}, {\n d: [\".f1c21dwh{background-color:var(--colorTransparentBackground);}\"]\n});\n/**\n * Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = state => {\n const {\n isNestedDialog,\n root,\n backdrop\n } = state;\n const rootBaseStyle = useRootBaseStyle();\n const backdropBaseStyle = useBackdropBaseStyle();\n const backdropStyles = useBackdropStyles();\n root.className = mergeClasses(dialogSurfaceClassNames.root, rootBaseStyle, root.className);\n if (backdrop) {\n backdrop.className = mergeClasses(dialogSurfaceClassNames.backdrop, backdropBaseStyle, isNestedDialog && backdropStyles.nestedDialogBackdrop, backdrop.className);\n }\n return state;\n};\n//# sourceMappingURL=useDialogSurfaceStyles.styles.js.map"],"names":["dialogSurfaceClassNames","useDialogSurfaceStyles_unstable","root","backdrop","useRootBaseStyle","__resetStyles","r","s","useBackdropBaseStyle","useBackdropStyles","__styles","nestedDialogBackdrop","De3pzq","d","state","isNestedDialog","rootBaseStyle","backdropBaseStyle","backdropStyles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAIaA,uBAAuB;eAAvBA;;IAsBAC,+BAA+B;eAA/BA;;;uBA1ByC;AAI/C,MAAMD,0BAA0B;IACrCE,MAAM;IACNC,UAAU;AACZ;AACA;;CAEC,GACD,MAAMC,mBAAmB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,YAAY,YAAY;IAC1EC,GAAG;QAAC;QAAwb;QAAwC;QAAgD;QAAiK;QAA+Q;QAAwb;QAAwC;QAAgD;QAAiK;KAA8Q;IACn4DC,GAAG;QAAC;QAAgM;QAAqE;QAAyK;QAAgM;QAAqE;KAAsK;AAC/1B;AACA,MAAMC,uBAAuB,WAAW,GAAEH,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAA0E;AACpJ,MAAMI,oBAAoB,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IAC9CC,sBAAsB;QACpBC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;KAAiE;AACvE;AAIO,MAAMZ,kCAAkCa,CAAAA;IAC7C,MAAM,EACJC,cAAc,EACdb,IAAI,EACJC,QAAQ,EACT,GAAGW;IACJ,MAAME,gBAAgBZ;IACtB,MAAMa,oBAAoBT;IAC1B,MAAMU,iBAAiBT;IACvBP,KAAKiB,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,wBAAwBE,IAAI,EAAEc,eAAed,KAAKiB,SAAS;IACzF,IAAIhB,UAAU;QACZA,SAASgB,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,wBAAwBG,QAAQ,EAAEc,mBAAmBF,kBAAkBG,eAAeP,oBAAoB,EAAER,SAASgB,SAAS;IAClK;IACA,OAAOL;AACT,GACA,yDAAyD"}
@@ -0,0 +1,38 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "DialogSurfaceMotion", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return DialogSurfaceMotion;
9
+ }
10
+ });
11
+ const _reactmotion = require("@fluentui/react-motion");
12
+ const _reacttheme = require("@fluentui/react-theme");
13
+ const keyframes = [
14
+ {
15
+ opacity: 0,
16
+ boxShadow: '0px 0px 0px 0px rgba(0, 0, 0, 0.1)',
17
+ transform: 'scale(0.85) translateZ(0)'
18
+ },
19
+ {
20
+ boxShadow: _reacttheme.tokens.shadow64,
21
+ transform: 'scale(1) translateZ(0)',
22
+ opacity: 1
23
+ }
24
+ ];
25
+ const DialogSurfaceMotion = (0, _reactmotion.createPresenceComponent)({
26
+ enter: {
27
+ keyframes,
28
+ easing: _reactmotion.motionTokens.curveDecelerateMid,
29
+ duration: _reactmotion.motionTokens.durationGentle
30
+ },
31
+ exit: {
32
+ keyframes: [
33
+ ...keyframes
34
+ ].reverse(),
35
+ easing: _reactmotion.motionTokens.curveAccelerateMin,
36
+ duration: _reactmotion.motionTokens.durationGentle
37
+ }
38
+ });
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["DialogSurfaceMotion.js"],"sourcesContent":["import { createPresenceComponent, motionTokens } from '@fluentui/react-motion';\nimport { tokens } from '@fluentui/react-theme';\nconst keyframes = [\n {\n opacity: 0,\n boxShadow: '0px 0px 0px 0px rgba(0, 0, 0, 0.1)',\n transform: 'scale(0.85) translateZ(0)'\n },\n {\n boxShadow: tokens.shadow64,\n transform: 'scale(1) translateZ(0)',\n opacity: 1\n }\n];\nexport const DialogSurfaceMotion = createPresenceComponent({\n enter: {\n keyframes,\n easing: motionTokens.curveDecelerateMid,\n duration: motionTokens.durationGentle\n },\n exit: {\n keyframes: [\n ...keyframes\n ].reverse(),\n easing: motionTokens.curveAccelerateMin,\n duration: motionTokens.durationGentle\n }\n});\n"],"names":["DialogSurfaceMotion","keyframes","opacity","boxShadow","transform","tokens","shadow64","createPresenceComponent","enter","easing","motionTokens","curveDecelerateMid","duration","durationGentle","exit","reverse","curveAccelerateMin"],"mappings":";;;;+BAcaA;;;eAAAA;;;6BAdyC;4BAC/B;AACvB,MAAMC,YAAY;IACd;QACIC,SAAS;QACTC,WAAW;QACXC,WAAW;IACf;IACA;QACID,WAAWE,kBAAM,CAACC,QAAQ;QAC1BF,WAAW;QACXF,SAAS;IACb;CACH;AACM,MAAMF,sBAAsBO,IAAAA,oCAAuB,EAAC;IACvDC,OAAO;QACHP;QACAQ,QAAQC,yBAAY,CAACC,kBAAkB;QACvCC,UAAUF,yBAAY,CAACG,cAAc;IACzC;IACAC,MAAM;QACFb,WAAW;eACJA;SACN,CAACc,OAAO;QACTN,QAAQC,yBAAY,CAACM,kBAAkB;QACvCJ,UAAUF,yBAAY,CAACG,cAAc;IACzC;AACJ"}
@@ -43,22 +43,22 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
43
43
  */ const useActionResetStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r13kcrze", null, [
44
44
  ".r13kcrze{grid-row-start:1;grid-row-end:1;grid-column-start:3;justify-self:end;align-self:start;}"
45
45
  ]);
46
- const useDialogTitleInternalStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r8i4vpr", "r15ezg2h", {
46
+ const useDialogTitleInternalStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r2avt6e", "roj2bbc", {
47
47
  r: [
48
- ".r8i4vpr{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}",
49
- ".r8i4vpr:focus{outline-style:none;}",
50
- ".r8i4vpr:focus-visible{outline-style:none;}",
51
- ".r8i4vpr[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
52
- ".r8i4vpr[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
53
- ".r15ezg2h{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}",
54
- ".r15ezg2h:focus{outline-style:none;}",
55
- ".r15ezg2h:focus-visible{outline-style:none;}",
56
- ".r15ezg2h[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
57
- ".r15ezg2h[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
48
+ ".r2avt6e{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}",
49
+ ".r2avt6e:focus{outline-style:none;}",
50
+ ".r2avt6e:focus-visible{outline-style:none;}",
51
+ ".r2avt6e[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}",
52
+ ".r2avt6e[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}",
53
+ ".roj2bbc{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}",
54
+ ".roj2bbc:focus{outline-style:none;}",
55
+ ".roj2bbc:focus-visible{outline-style:none;}",
56
+ ".roj2bbc[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}",
57
+ ".roj2bbc[data-fui-focus-visible]::after{content:\"\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}"
58
58
  ],
59
59
  s: [
60
- "@media (forced-colors: active){.r8i4vpr[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
61
- "@media (forced-colors: active){.r15ezg2h[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
60
+ "@media (forced-colors: active){.r2avt6e[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}",
61
+ "@media (forced-colors: active){.roj2bbc[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}"
62
62
  ]
63
63
  });
64
64
  const useDialogTitleStyles_unstable = (state)=>{
@@ -1 +1 @@
1
- {"version":3,"sources":["useDialogTitleStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, 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 */\nconst useRootResetStyles = /*#__PURE__*/__resetStyles(\"rxjm636\", null, [\".rxjm636{font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase500);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase500);margin:0;grid-row-start:1;grid-row-end:1;grid-column-start:1;grid-column-end:3;}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n rootWithoutAction: {\n Bw0ie65: \"fsyjsko\"\n }\n}, {\n d: [\".fsyjsko{grid-column-end:4;}\"]\n});\n/**\n * Styles for the action slot\n */\nconst useActionResetStyles = /*#__PURE__*/__resetStyles(\"r13kcrze\", null, [\".r13kcrze{grid-row-start:1;grid-row-end:1;grid-column-start:3;justify-self:end;align-self:start;}\"]);\n/**\n * Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n */\nexport const useDialogTitleInternalStyles = /*#__PURE__*/__resetStyles(\"r8i4vpr\", \"r15ezg2h\", {\n r: [\".r8i4vpr{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}\", \".r8i4vpr:focus{outline-style:none;}\", \".r8i4vpr:focus-visible{outline-style:none;}\", \".r8i4vpr[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".r8i4vpr[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".r15ezg2h{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}\", \".r15ezg2h:focus{outline-style:none;}\", \".r15ezg2h:focus-visible{outline-style:none;}\", \".r15ezg2h[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".r15ezg2h[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:2px;border-left-width:2px;border-bottom-width:2px;border-right-width:2px;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-color:var(--colorStrokeFocus2);border-left-color:var(--colorStrokeFocus2);border-bottom-color:var(--colorStrokeFocus2);border-right-color:var(--colorStrokeFocus2);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n s: [\"@media (forced-colors: active){.r8i4vpr[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.r15ezg2h[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\n/**\n * Apply styling to the DialogTitle slots based on the state\n */\nexport const useDialogTitleStyles_unstable = state => {\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//# sourceMappingURL=useDialogTitleStyles.styles.js.map"],"names":["dialogTitleClassNames","useDialogTitleInternalStyles","useDialogTitleStyles_unstable","root","action","useRootResetStyles","__resetStyles","useStyles","__styles","rootWithoutAction","Bw0ie65","d","useActionResetStyles","r","s","state","rootResetStyles","actionResetStyles","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAGaA,qBAAqB;eAArBA;;IAuBAC,4BAA4B;eAA5BA;;IAOAC,6BAA6B;eAA7BA;;;uBAjCyC;AAG/C,MAAMF,wBAAwB;IACnCG,MAAM;IACNC,QAAQ;AACV;AACA;;CAEC,GACD,MAAMC,qBAAqB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAA0O;AAClT,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCC,mBAAmB;QACjBC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;KAA+B;AACrC;AACA;;CAEC,GACD,MAAMC,uBAAuB,WAAW,GAAEN,IAAAA,oBAAa,EAAC,YAAY,MAAM;IAAC;CAAoG;AAKxK,MAAML,+BAA+B,WAAW,GAAEK,IAAAA,oBAAa,EAAC,WAAW,YAAY;IAC5FO,GAAG;QAAC;QAAyP;QAAuC;QAA+C;QAAgK;QAAkvB;QAA0P;QAAwC;QAAgD;QAAiK;KAAkvB;IAC18EC,GAAG;QAAC;QAA+L;KAA+L;AACpY;AAIO,MAAMZ,gCAAgCa,CAAAA;IAC3C,MAAMC,kBAAkBX;IACxB,MAAMY,oBAAoBL;IAC1B,MAAMM,SAASX;IACfQ,MAAMZ,IAAI,CAACgB,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,sBAAsBG,IAAI,EAAEa,iBAAiB,CAACD,MAAMX,MAAM,IAAIc,OAAOT,iBAAiB,EAAEM,MAAMZ,IAAI,CAACgB,SAAS;IAChJ,IAAIJ,MAAMX,MAAM,EAAE;QAChBW,MAAMX,MAAM,CAACe,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,sBAAsBI,MAAM,EAAEa,mBAAmBF,MAAMX,MAAM,CAACe,SAAS;IAC/G;IACA,OAAOJ;AACT,GACA,uDAAuD"}
1
+ {"version":3,"sources":["useDialogTitleStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, 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 */\nconst useRootResetStyles = /*#__PURE__*/__resetStyles(\"rxjm636\", null, [\".rxjm636{font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase500);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase500);margin:0;grid-row-start:1;grid-row-end:1;grid-column-start:1;grid-column-end:3;}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n rootWithoutAction: {\n Bw0ie65: \"fsyjsko\"\n }\n}, {\n d: [\".fsyjsko{grid-column-end:4;}\"]\n});\n/**\n * Styles for the action slot\n */\nconst useActionResetStyles = /*#__PURE__*/__resetStyles(\"r13kcrze\", null, [\".r13kcrze{grid-row-start:1;grid-row-end:1;grid-column-start:3;justify-self:end;align-self:start;}\"]);\n/**\n * Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n */\nexport const useDialogTitleInternalStyles = /*#__PURE__*/__resetStyles(\"r2avt6e\", \"roj2bbc\", {\n r: [\".r2avt6e{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}\", \".r2avt6e:focus{outline-style:none;}\", \".r2avt6e:focus-visible{outline-style:none;}\", \".r2avt6e[data-fui-focus-visible]{border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;}\", \".r2avt6e[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);right:calc(2px * -1);bottom:calc(2px * -1);left:calc(2px * -1);}\", \".roj2bbc{overflow:visible;padding:0;border-style:none;position:relative;box-sizing:content-box;background-color:inherit;color:inherit;font-family:inherit;font-size:inherit;cursor:pointer;line-height:0;-webkit-appearance:button;text-align:unset;}\", \".roj2bbc:focus{outline-style:none;}\", \".roj2bbc:focus-visible{outline-style:none;}\", \".roj2bbc[data-fui-focus-visible]{border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:transparent;}\", \".roj2bbc[data-fui-focus-visible]::after{content:\\\"\\\";position:absolute;pointer-events:none;z-index:1;border:2px solid var(--colorStrokeFocus2);border-radius:var(--borderRadiusMedium);top:calc(2px * -1);left:calc(2px * -1);bottom:calc(2px * -1);right:calc(2px * -1);}\"],\n s: [\"@media (forced-colors: active){.r2avt6e[data-fui-focus-visible]::after{border-top-color:Highlight;border-right-color:Highlight;border-bottom-color:Highlight;border-left-color:Highlight;}}\", \"@media (forced-colors: active){.roj2bbc[data-fui-focus-visible]::after{border-top-color:Highlight;border-left-color:Highlight;border-bottom-color:Highlight;border-right-color:Highlight;}}\"]\n});\n/**\n * Apply styling to the DialogTitle slots based on the state\n */\nexport const useDialogTitleStyles_unstable = state => {\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//# sourceMappingURL=useDialogTitleStyles.styles.js.map"],"names":["dialogTitleClassNames","useDialogTitleInternalStyles","useDialogTitleStyles_unstable","root","action","useRootResetStyles","__resetStyles","useStyles","__styles","rootWithoutAction","Bw0ie65","d","useActionResetStyles","r","s","state","rootResetStyles","actionResetStyles","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAGaA,qBAAqB;eAArBA;;IAuBAC,4BAA4B;eAA5BA;;IAOAC,6BAA6B;eAA7BA;;;uBAjCyC;AAG/C,MAAMF,wBAAwB;IACnCG,MAAM;IACNC,QAAQ;AACV;AACA;;CAEC,GACD,MAAMC,qBAAqB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,WAAW,MAAM;IAAC;CAA0O;AAClT,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCC,mBAAmB;QACjBC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;KAA+B;AACrC;AACA;;CAEC,GACD,MAAMC,uBAAuB,WAAW,GAAEN,IAAAA,oBAAa,EAAC,YAAY,MAAM;IAAC;CAAoG;AAKxK,MAAML,+BAA+B,WAAW,GAAEK,IAAAA,oBAAa,EAAC,WAAW,WAAW;IAC3FO,GAAG;QAAC;QAAyP;QAAuC;QAA+C;QAAgK;QAA8Q;QAAyP;QAAuC;QAA+C;QAAgK;KAA6Q;IAC7/CC,GAAG;QAAC;QAA+L;KAA8L;AACnY;AAIO,MAAMZ,gCAAgCa,CAAAA;IAC3C,MAAMC,kBAAkBX;IACxB,MAAMY,oBAAoBL;IAC1B,MAAMM,SAASX;IACfQ,MAAMZ,IAAI,CAACgB,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,sBAAsBG,IAAI,EAAEa,iBAAiB,CAACD,MAAMX,MAAM,IAAIc,OAAOT,iBAAiB,EAAEM,MAAMZ,IAAI,CAACgB,SAAS;IAChJ,IAAIJ,MAAMX,MAAM,EAAE;QAChBW,MAAMX,MAAM,CAACe,SAAS,GAAGC,IAAAA,mBAAY,EAACpB,sBAAsBI,MAAM,EAAEa,mBAAmBF,MAAMX,MAAM,CAACe,SAAS;IAC/G;IACA,OAAOJ;AACT,GACA,uDAAuD"}
@@ -18,6 +18,9 @@ _export(exports, {
18
18
  useDialog_unstable: function() {
19
19
  return _Dialog.useDialog_unstable;
20
20
  },
21
+ useDialogContextValues_unstable: function() {
22
+ return _Dialog.useDialogContextValues_unstable;
23
+ },
21
24
  DialogTrigger: function() {
22
25
  return _DialogTrigger.DialogTrigger;
23
26
  },
@@ -1 +1 @@
1
- {"version":3,"sources":["index.js"],"sourcesContent":["export { Dialog, renderDialog_unstable, useDialog_unstable } from './Dialog';\nexport { DialogTrigger, useDialogTrigger_unstable, renderDialogTrigger_unstable } from './DialogTrigger';\nexport { DialogActions, dialogActionsClassNames, useDialogActions_unstable, useDialogActionsStyles_unstable, renderDialogActions_unstable } from './DialogActions';\nexport { DialogBody, dialogBodyClassNames, useDialogBody_unstable, useDialogBodyStyles_unstable, renderDialogBody_unstable } from './DialogBody';\nexport { DialogTitle, dialogTitleClassNames, useDialogTitle_unstable, useDialogTitleStyles_unstable, renderDialogTitle_unstable } from './DialogTitle';\nexport { DialogSurface, dialogSurfaceClassNames, useDialogSurface_unstable, useDialogSurfaceStyles_unstable, useDialogSurfaceContextValues_unstable, renderDialogSurface_unstable } from './DialogSurface';\nexport { DialogContent, dialogContentClassNames, useDialogContent_unstable, useDialogContentStyles_unstable, renderDialogContent_unstable } from './DialogContent';\nexport { useDialogContext_unstable, useDialogSurfaceContext_unstable, DialogProvider, DialogSurfaceProvider } from './contexts/index';\n"],"names":["Dialog","renderDialog_unstable","useDialog_unstable","DialogTrigger","useDialogTrigger_unstable","renderDialogTrigger_unstable","DialogActions","dialogActionsClassNames","useDialogActions_unstable","useDialogActionsStyles_unstable","renderDialogActions_unstable","DialogBody","dialogBodyClassNames","useDialogBody_unstable","useDialogBodyStyles_unstable","renderDialogBody_unstable","DialogTitle","dialogTitleClassNames","useDialogTitle_unstable","useDialogTitleStyles_unstable","renderDialogTitle_unstable","DialogSurface","dialogSurfaceClassNames","useDialogSurface_unstable","useDialogSurfaceStyles_unstable","useDialogSurfaceContextValues_unstable","renderDialogSurface_unstable","DialogContent","dialogContentClassNames","useDialogContent_unstable","useDialogContentStyles_unstable","renderDialogContent_unstable","useDialogContext_unstable","useDialogSurfaceContext_unstable","DialogProvider","DialogSurfaceProvider"],"mappings":";;;;;;;;;;;IAASA,MAAM;eAANA,cAAM;;IAAEC,qBAAqB;eAArBA,6BAAqB;;IAAEC,kBAAkB;eAAlBA,0BAAkB;;IACjDC,aAAa;eAAbA,4BAAa;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IACtEC,aAAa;eAAbA,4BAAa;;IAAEC,uBAAuB;eAAvBA,sCAAuB;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,+BAA+B;eAA/BA,8CAA+B;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IAChIC,UAAU;eAAVA,sBAAU;;IAAEC,oBAAoB;eAApBA,gCAAoB;;IAAEC,sBAAsB;eAAtBA,kCAAsB;;IAAEC,4BAA4B;eAA5BA,wCAA4B;;IAAEC,yBAAyB;eAAzBA,qCAAyB;;IACjHC,WAAW;eAAXA,wBAAW;;IAAEC,qBAAqB;eAArBA,kCAAqB;;IAAEC,uBAAuB;eAAvBA,oCAAuB;;IAAEC,6BAA6B;eAA7BA,0CAA6B;;IAAEC,0BAA0B;eAA1BA,uCAA0B;;IACtHC,aAAa;eAAbA,4BAAa;;IAAEC,uBAAuB;eAAvBA,sCAAuB;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,+BAA+B;eAA/BA,8CAA+B;;IAAEC,sCAAsC;eAAtCA,qDAAsC;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IACxKC,aAAa;eAAbA,4BAAa;;IAAEC,uBAAuB;eAAvBA,sCAAuB;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,+BAA+B;eAA/BA,8CAA+B;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IAChIC,yBAAyB;eAAzBA,gCAAyB;;IAAEC,gCAAgC;eAAhCA,uCAAgC;;IAAEC,cAAc;eAAdA,qBAAc;;IAAEC,qBAAqB;eAArBA,4BAAqB;;;wBAPzC;+BACqB;+BAC0D;4BACf;6BACK;+BACkD;+BACxC;uBAC9B"}
1
+ {"version":3,"sources":["index.js"],"sourcesContent":["export { Dialog, renderDialog_unstable, useDialog_unstable, useDialogContextValues_unstable } from './Dialog';\nexport { DialogTrigger, useDialogTrigger_unstable, renderDialogTrigger_unstable } from './DialogTrigger';\nexport { DialogActions, dialogActionsClassNames, useDialogActions_unstable, useDialogActionsStyles_unstable, renderDialogActions_unstable } from './DialogActions';\nexport { DialogBody, dialogBodyClassNames, useDialogBody_unstable, useDialogBodyStyles_unstable, renderDialogBody_unstable } from './DialogBody';\nexport { DialogTitle, dialogTitleClassNames, useDialogTitle_unstable, useDialogTitleStyles_unstable, renderDialogTitle_unstable } from './DialogTitle';\nexport { DialogSurface, dialogSurfaceClassNames, useDialogSurface_unstable, useDialogSurfaceStyles_unstable, useDialogSurfaceContextValues_unstable, renderDialogSurface_unstable } from './DialogSurface';\nexport { DialogContent, dialogContentClassNames, useDialogContent_unstable, useDialogContentStyles_unstable, renderDialogContent_unstable } from './DialogContent';\nexport { useDialogContext_unstable, useDialogSurfaceContext_unstable, DialogProvider, DialogSurfaceProvider } from './contexts/index';\n"],"names":["Dialog","renderDialog_unstable","useDialog_unstable","useDialogContextValues_unstable","DialogTrigger","useDialogTrigger_unstable","renderDialogTrigger_unstable","DialogActions","dialogActionsClassNames","useDialogActions_unstable","useDialogActionsStyles_unstable","renderDialogActions_unstable","DialogBody","dialogBodyClassNames","useDialogBody_unstable","useDialogBodyStyles_unstable","renderDialogBody_unstable","DialogTitle","dialogTitleClassNames","useDialogTitle_unstable","useDialogTitleStyles_unstable","renderDialogTitle_unstable","DialogSurface","dialogSurfaceClassNames","useDialogSurface_unstable","useDialogSurfaceStyles_unstable","useDialogSurfaceContextValues_unstable","renderDialogSurface_unstable","DialogContent","dialogContentClassNames","useDialogContent_unstable","useDialogContentStyles_unstable","renderDialogContent_unstable","useDialogContext_unstable","useDialogSurfaceContext_unstable","DialogProvider","DialogSurfaceProvider"],"mappings":";;;;;;;;;;;IAASA,MAAM;eAANA,cAAM;;IAAEC,qBAAqB;eAArBA,6BAAqB;;IAAEC,kBAAkB;eAAlBA,0BAAkB;;IAAEC,+BAA+B;eAA/BA,uCAA+B;;IAClFC,aAAa;eAAbA,4BAAa;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IACtEC,aAAa;eAAbA,4BAAa;;IAAEC,uBAAuB;eAAvBA,sCAAuB;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,+BAA+B;eAA/BA,8CAA+B;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IAChIC,UAAU;eAAVA,sBAAU;;IAAEC,oBAAoB;eAApBA,gCAAoB;;IAAEC,sBAAsB;eAAtBA,kCAAsB;;IAAEC,4BAA4B;eAA5BA,wCAA4B;;IAAEC,yBAAyB;eAAzBA,qCAAyB;;IACjHC,WAAW;eAAXA,wBAAW;;IAAEC,qBAAqB;eAArBA,kCAAqB;;IAAEC,uBAAuB;eAAvBA,oCAAuB;;IAAEC,6BAA6B;eAA7BA,0CAA6B;;IAAEC,0BAA0B;eAA1BA,uCAA0B;;IACtHC,aAAa;eAAbA,4BAAa;;IAAEC,uBAAuB;eAAvBA,sCAAuB;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,+BAA+B;eAA/BA,8CAA+B;;IAAEC,sCAAsC;eAAtCA,qDAAsC;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IACxKC,aAAa;eAAbA,4BAAa;;IAAEC,uBAAuB;eAAvBA,sCAAuB;;IAAEC,yBAAyB;eAAzBA,wCAAyB;;IAAEC,+BAA+B;eAA/BA,8CAA+B;;IAAEC,4BAA4B;eAA5BA,2CAA4B;;IAChIC,yBAAyB;eAAzBA,gCAAyB;;IAAEC,gCAAgC;eAAhCA,uCAAgC;;IAAEC,cAAc;eAAdA,qBAAc;;IAAEC,qBAAqB;eAArBA,4BAAqB;;;wBAPR;+BACZ;+BAC0D;4BACf;6BACK;+BACkD;+BACxC;uBAC9B"}