@fluentui/react-dialog 9.1.0 → 9.1.2

package/lib-amd/index.js

@@ -0,0 +1,37 @@
+define(["require", "exports", "./Dialog", "./DialogTrigger", "./DialogActions", "./DialogBody", "./DialogTitle", "./DialogSurface", "./DialogContent"], function (require, exports, Dialog_1, DialogTrigger_1, DialogActions_1, DialogBody_1, DialogTitle_1, DialogSurface_1, DialogContent_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.renderDialogContent_unstable = exports.useDialogContentStyles_unstable = exports.useDialogContent_unstable = exports.dialogContentClassNames = exports.DialogContent = exports.renderDialogSurface_unstable = exports.useDialogSurfaceStyles_unstable = exports.useDialogSurface_unstable = exports.dialogSurfaceClassNames = exports.DialogSurface = exports.renderDialogTitle_unstable = exports.useDialogTitleStyles_unstable = exports.useDialogTitle_unstable = exports.dialogTitleClassNames = exports.DialogTitle = exports.renderDialogBody_unstable = exports.useDialogBodyStyles_unstable = exports.useDialogBody_unstable = exports.dialogBodyClassNames = exports.DialogBody = exports.renderDialogActions_unstable = exports.useDialogActionsStyles_unstable = exports.useDialogActions_unstable = exports.dialogActionsClassNames = exports.DialogActions = exports.renderDialogTrigger_unstable = exports.useDialogTrigger_unstable = exports.DialogTrigger = exports.useDialog_unstable = exports.renderDialog_unstable = exports.Dialog = void 0;
+    Object.defineProperty(exports, "Dialog", { enumerable: true, get: function () { return Dialog_1.Dialog; } });
+    Object.defineProperty(exports, "renderDialog_unstable", { enumerable: true, get: function () { return Dialog_1.renderDialog_unstable; } });
+    Object.defineProperty(exports, "useDialog_unstable", { enumerable: true, get: function () { return Dialog_1.useDialog_unstable; } });
+    Object.defineProperty(exports, "DialogTrigger", { enumerable: true, get: function () { return DialogTrigger_1.DialogTrigger; } });
+    Object.defineProperty(exports, "useDialogTrigger_unstable", { enumerable: true, get: function () { return DialogTrigger_1.useDialogTrigger_unstable; } });
+    Object.defineProperty(exports, "renderDialogTrigger_unstable", { enumerable: true, get: function () { return DialogTrigger_1.renderDialogTrigger_unstable; } });
+    Object.defineProperty(exports, "DialogActions", { enumerable: true, get: function () { return DialogActions_1.DialogActions; } });
+    Object.defineProperty(exports, "dialogActionsClassNames", { enumerable: true, get: function () { return DialogActions_1.dialogActionsClassNames; } });
+    Object.defineProperty(exports, "useDialogActions_unstable", { enumerable: true, get: function () { return DialogActions_1.useDialogActions_unstable; } });
+    Object.defineProperty(exports, "useDialogActionsStyles_unstable", { enumerable: true, get: function () { return DialogActions_1.useDialogActionsStyles_unstable; } });
+    Object.defineProperty(exports, "renderDialogActions_unstable", { enumerable: true, get: function () { return DialogActions_1.renderDialogActions_unstable; } });
+    Object.defineProperty(exports, "DialogBody", { enumerable: true, get: function () { return DialogBody_1.DialogBody; } });
+    Object.defineProperty(exports, "dialogBodyClassNames", { enumerable: true, get: function () { return DialogBody_1.dialogBodyClassNames; } });
+    Object.defineProperty(exports, "useDialogBody_unstable", { enumerable: true, get: function () { return DialogBody_1.useDialogBody_unstable; } });
+    Object.defineProperty(exports, "useDialogBodyStyles_unstable", { enumerable: true, get: function () { return DialogBody_1.useDialogBodyStyles_unstable; } });
+    Object.defineProperty(exports, "renderDialogBody_unstable", { enumerable: true, get: function () { return DialogBody_1.renderDialogBody_unstable; } });
+    Object.defineProperty(exports, "DialogTitle", { enumerable: true, get: function () { return DialogTitle_1.DialogTitle; } });
+    Object.defineProperty(exports, "dialogTitleClassNames", { enumerable: true, get: function () { return DialogTitle_1.dialogTitleClassNames; } });
+    Object.defineProperty(exports, "useDialogTitle_unstable", { enumerable: true, get: function () { return DialogTitle_1.useDialogTitle_unstable; } });
+    Object.defineProperty(exports, "useDialogTitleStyles_unstable", { enumerable: true, get: function () { return DialogTitle_1.useDialogTitleStyles_unstable; } });
+    Object.defineProperty(exports, "renderDialogTitle_unstable", { enumerable: true, get: function () { return DialogTitle_1.renderDialogTitle_unstable; } });
+    Object.defineProperty(exports, "DialogSurface", { enumerable: true, get: function () { return DialogSurface_1.DialogSurface; } });
+    Object.defineProperty(exports, "dialogSurfaceClassNames", { enumerable: true, get: function () { return DialogSurface_1.dialogSurfaceClassNames; } });
+    Object.defineProperty(exports, "useDialogSurface_unstable", { enumerable: true, get: function () { return DialogSurface_1.useDialogSurface_unstable; } });
+    Object.defineProperty(exports, "useDialogSurfaceStyles_unstable", { enumerable: true, get: function () { return DialogSurface_1.useDialogSurfaceStyles_unstable; } });
+    Object.defineProperty(exports, "renderDialogSurface_unstable", { enumerable: true, get: function () { return DialogSurface_1.renderDialogSurface_unstable; } });
+    Object.defineProperty(exports, "DialogContent", { enumerable: true, get: function () { return DialogContent_1.DialogContent; } });
+    Object.defineProperty(exports, "dialogContentClassNames", { enumerable: true, get: function () { return DialogContent_1.dialogContentClassNames; } });
+    Object.defineProperty(exports, "useDialogContent_unstable", { enumerable: true, get: function () { return DialogContent_1.useDialogContent_unstable; } });
+    Object.defineProperty(exports, "useDialogContentStyles_unstable", { enumerable: true, get: function () { return DialogContent_1.useDialogContentStyles_unstable; } });
+    Object.defineProperty(exports, "renderDialogContent_unstable", { enumerable: true, get: function () { return DialogContent_1.renderDialogContent_unstable; } });
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-dialog/src/index.ts"],"names":[],"mappings":";;;;IAAS,gGAAA,MAAM,OAAA;IAAE,+GAAA,qBAAqB,OAAA;IAAE,4GAAA,kBAAkB,OAAA;IAUjD,8GAAA,aAAa,OAAA;IAAE,0HAAA,yBAAyB,OAAA;IAAE,6HAAA,4BAA4B,OAAA;IAS7E,8GAAA,aAAa,OAAA;IACb,wHAAA,uBAAuB,OAAA;IACvB,0HAAA,yBAAyB,OAAA;IACzB,gIAAA,+BAA+B,OAAA;IAC/B,6HAAA,4BAA4B,OAAA;IAU5B,wGAAA,UAAU,OAAA;IACV,kHAAA,oBAAoB,OAAA;IACpB,oHAAA,sBAAsB,OAAA;IACtB,0HAAA,4BAA4B,OAAA;IAC5B,uHAAA,yBAAyB,OAAA;IAKzB,0GAAA,WAAW,OAAA;IACX,oHAAA,qBAAqB,OAAA;IACrB,sHAAA,uBAAuB,OAAA;IACvB,4HAAA,6BAA6B,OAAA;IAC7B,yHAAA,0BAA0B,OAAA;IAK1B,8GAAA,aAAa,OAAA;IACb,wHAAA,uBAAuB,OAAA;IACvB,0HAAA,yBAAyB,OAAA;IACzB,gIAAA,+BAA+B,OAAA;IAC/B,6HAAA,4BAA4B,OAAA;IAK5B,8GAAA,aAAa,OAAA;IACb,wHAAA,uBAAuB,OAAA;IACvB,0HAAA,yBAAyB,OAAA;IACzB,gIAAA,+BAA+B,OAAA;IAC/B,6HAAA,4BAA4B,OAAA","sourcesContent":["export { Dialog, renderDialog_unstable, useDialog_unstable } from './Dialog';\nexport type {\n  DialogSlots,\n  DialogProps,\n  DialogState,\n  DialogOpenChangeData,\n  DialogOpenChangeEvent,\n  DialogOpenChangeEventHandler,\n} from './Dialog';\n\nexport { DialogTrigger, useDialogTrigger_unstable, renderDialogTrigger_unstable } from './DialogTrigger';\nexport type {\n  DialogTriggerProps,\n  DialogTriggerChildProps,\n  DialogTriggerState,\n  DialogTriggerAction,\n} from './DialogTrigger';\n\nexport {\n  DialogActions,\n  dialogActionsClassNames,\n  useDialogActions_unstable,\n  useDialogActionsStyles_unstable,\n  renderDialogActions_unstable,\n} from './DialogActions';\nexport type {\n  DialogActionsProps,\n  DialogActionsSlots,\n  DialogActionsState,\n  DialogActionsPosition,\n} from './DialogActions';\n\nexport {\n  DialogBody,\n  dialogBodyClassNames,\n  useDialogBody_unstable,\n  useDialogBodyStyles_unstable,\n  renderDialogBody_unstable,\n} from './DialogBody';\nexport type { DialogBodyProps, DialogBodySlots, DialogBodyState } from './DialogBody';\n\nexport {\n  DialogTitle,\n  dialogTitleClassNames,\n  useDialogTitle_unstable,\n  useDialogTitleStyles_unstable,\n  renderDialogTitle_unstable,\n} from './DialogTitle';\nexport type { DialogTitleProps, DialogTitleSlots, DialogTitleState } from './DialogTitle';\n\nexport {\n  DialogSurface,\n  dialogSurfaceClassNames,\n  useDialogSurface_unstable,\n  useDialogSurfaceStyles_unstable,\n  renderDialogSurface_unstable,\n} from './DialogSurface';\nexport type { DialogSurfaceProps, DialogSurfaceSlots, DialogSurfaceState, DialogSurfaceElement } from './DialogSurface';\n\nexport {\n  DialogContent,\n  dialogContentClassNames,\n  useDialogContent_unstable,\n  useDialogContentStyles_unstable,\n  renderDialogContent_unstable,\n} from './DialogContent';\nexport type { DialogContentProps, DialogContentSlots, DialogContentState } from './DialogContent';\n"]}

package/lib-amd/utils/index.js

@@ -0,0 +1,8 @@
+define(["require", "exports", "tslib", "./isEscapeKeyDown", "./useDisableBodyScroll", "./useFocusFirstElement"], function (require, exports, tslib_1, isEscapeKeyDown_1, useDisableBodyScroll_1, useFocusFirstElement_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(isEscapeKeyDown_1, exports);
+    tslib_1.__exportStar(useDisableBodyScroll_1, exports);
+    tslib_1.__exportStar(useFocusFirstElement_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-dialog/src/utils/index.ts"],"names":[],"mappings":";;;IAAA,iDAAkC;IAClC,sDAAuC;IACvC,sDAAuC","sourcesContent":["export * from './isEscapeKeyDown';\nexport * from './useDisableBodyScroll';\nexport * from './useFocusFirstElement';\n"]}

package/lib-amd/utils/isEscapeKeyDown.js

@@ -0,0 +1,13 @@
+define(["require", "exports", "@fluentui/keyboard-keys"], function (require, exports, keyboard_keys_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.isEscapeKeyDismiss = void 0;
+    /**
+     * Checks if keydown event is a proper Escape key dismiss
+     */
+    function isEscapeKeyDismiss(event, modalType) {
+        return event.key === keyboard_keys_1.Escape && modalType !== 'alert' && !event.isDefaultPrevented();
+    }
+    exports.isEscapeKeyDismiss = isEscapeKeyDismiss;
+});
+//# sourceMappingURL=isEscapeKeyDown.js.map

package/lib-amd/utils/isEscapeKeyDown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isEscapeKeyDown.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-dialog/src/utils/isEscapeKeyDown.ts"],"names":[],"mappings":";;;;IAKA;;OAEG;IACH,SAAgB,kBAAkB,CAChC,KAAgD,EAChD,SAA0B;QAE1B,OAAO,KAAK,CAAC,GAAG,KAAK,sBAAM,IAAI,SAAS,KAAK,OAAO,IAAI,CAAC,KAAK,CAAC,kBAAkB,EAAE,CAAC;IACtF,CAAC;IALD,gDAKC","sourcesContent":["import * as React from 'react';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport type { DialogModalType } from '../components/Dialog/Dialog.types';\nimport { DialogSurfaceElement } from '../DialogSurface';\n\n/**\n * Checks if keydown event is a proper Escape key dismiss\n */\nexport function isEscapeKeyDismiss(\n  event: React.KeyboardEvent<DialogSurfaceElement>,\n  modalType: DialogModalType,\n): boolean {\n  return event.key === Escape && modalType !== 'alert' && !event.isDefaultPrevented();\n}\n"]}

package/lib-amd/utils/useDisableBodyScroll.js

@@ -0,0 +1,52 @@
+define(["require", "exports", "@fluentui/react-shared-contexts", "react"], function (require, exports, react_shared_contexts_1, react_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.disableScroll = exports.useDisableBodyScroll = void 0;
+    var disableScrollElementProp = '__fluentDisableScrollElement';
+    /**
+     * hook that disables body scrolling through `overflow: hidden` CSS property
+     */
+    function useDisableBodyScroll() {
+        var targetDocument = react_shared_contexts_1.useFluent_unstable().targetDocument;
+        return react_1.useCallback(function () {
+            if (targetDocument) {
+                return disableScroll(targetDocument.body);
+            }
+        }, [targetDocument]);
+    }
+    exports.useDisableBodyScroll = useDisableBodyScroll;
+    /**
+     * disables scrolling from a given element through `overflow: hidden` CSS property
+     * @param target - element to disable scrolling from
+     * @returns a method for enabling scrolling again
+     */
+    function disableScroll(target) {
+        var _a, _b;
+        var clientWidth = target.ownerDocument.documentElement.clientWidth;
+        var innerWidth = (_b = (_a = target.ownerDocument.defaultView) === null || _a === void 0 ? void 0 : _a.innerWidth) !== null && _b !== void 0 ? _b : 0;
+        assertIsDisableScrollElement(target);
+        if (target[disableScrollElementProp].count === 0) {
+            target.style.overflow = 'hidden';
+            target.style.paddingRight = innerWidth - clientWidth + "px";
+        }
+        target[disableScrollElementProp].count++;
+        return function () {
+            target[disableScrollElementProp].count--;
+            if (target[disableScrollElementProp].count === 0) {
+                target.style.overflow = target[disableScrollElementProp].previousOverflowStyle;
+                target.style.paddingRight = target[disableScrollElementProp].previousPaddingRightStyle;
+            }
+        };
+    }
+    exports.disableScroll = disableScroll;
+    function assertIsDisableScrollElement(element) {
+        var _a;
+        var _b;
+        (_a = (_b = element)[disableScrollElementProp]) !== null && _a !== void 0 ? _a : (_b[disableScrollElementProp] = {
+            count: 0,
+            previousOverflowStyle: element.style.overflow,
+            previousPaddingRightStyle: element.style.paddingRight,
+        });
+    }
+});
+//# sourceMappingURL=useDisableBodyScroll.js.map

package/lib-amd/utils/useDisableBodyScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDisableBodyScroll.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-dialog/src/utils/useDisableBodyScroll.ts"],"names":[],"mappings":";;;;IAGA,IAAM,wBAAwB,GAAG,8BAAuC,CAAC;IAUzE;;OAEG;IACH,SAAgB,oBAAoB;QAC1B,IAAA,cAAc,GAAK,0CAAkB,EAAE,eAAzB,CAA0B;QAChD,OAAO,mBAAW,CAAC;YACjB,IAAI,cAAc,EAAE;gBAClB,OAAO,aAAa,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;aAC3C;QACH,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IACvB,CAAC;IAPD,oDAOC;IAED;;;;OAIG;IACH,SAAgB,aAAa,CAAC,MAAmB;;QACvC,IAAA,WAAW,GAAK,MAAM,CAAC,aAAa,CAAC,eAAe,YAAzC,CAA0C;QAC7D,IAAM,UAAU,GAAG,MAAA,MAAA,MAAM,CAAC,aAAa,CAAC,WAAW,0CAAE,UAAU,mCAAI,CAAC,CAAC;QACrE,4BAA4B,CAAC,MAAM,CAAC,CAAC;QACrC,IAAI,MAAM,CAAC,wBAAwB,CAAC,CAAC,KAAK,KAAK,CAAC,EAAE;YAChD,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;YACjC,MAAM,CAAC,KAAK,CAAC,YAAY,GAAM,UAAU,GAAG,WAAW,OAAI,CAAC;SAC7D;QACD,MAAM,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;QACzC,OAAO;YACL,MAAM,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;YACzC,IAAI,MAAM,CAAC,wBAAwB,CAAC,CAAC,KAAK,KAAK,CAAC,EAAE;gBAChD,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,CAAC,wBAAwB,CAAC,CAAC,qBAAqB,CAAC;gBAC/E,MAAM,CAAC,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC,wBAAwB,CAAC,CAAC,yBAAyB,CAAC;aACxF;QACH,CAAC,CAAC;IACJ,CAAC;IAhBD,sCAgBC;IAED,SAAS,4BAA4B,CAAC,OAAoB;;;QACxD,YAAC,OAAsC,EAAC,wBAAwB,wCAAxB,wBAAwB,IAAM;YACpE,KAAK,EAAE,CAAC;YACR,qBAAqB,EAAE,OAAO,CAAC,KAAK,CAAC,QAAQ;YAC7C,yBAAyB,EAAE,OAAO,CAAC,KAAK,CAAC,YAAY;SACtD,EAAC;IACJ,CAAC","sourcesContent":["import { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { useCallback } from 'react';\n\nconst disableScrollElementProp = '__fluentDisableScrollElement' as const;\n\ntype FluentDisableScrollElement = HTMLElement & {\n  [disableScrollElementProp]: {\n    count: number;\n    previousOverflowStyle: string;\n    previousPaddingRightStyle: string;\n  };\n};\n\n/**\n * hook that disables body scrolling through `overflow: hidden` CSS property\n */\nexport function useDisableBodyScroll() {\n  const { targetDocument } = useFluent_unstable();\n  return useCallback(() => {\n    if (targetDocument) {\n      return disableScroll(targetDocument.body);\n    }\n  }, [targetDocument]);\n}\n\n/**\n * disables scrolling from a given element through `overflow: hidden` CSS property\n * @param target - element to disable scrolling from\n * @returns a method for enabling scrolling again\n */\nexport function disableScroll(target: HTMLElement) {\n  const { clientWidth } = target.ownerDocument.documentElement;\n  const innerWidth = target.ownerDocument.defaultView?.innerWidth ?? 0;\n  assertIsDisableScrollElement(target);\n  if (target[disableScrollElementProp].count === 0) {\n    target.style.overflow = 'hidden';\n    target.style.paddingRight = `${innerWidth - clientWidth}px`;\n  }\n  target[disableScrollElementProp].count++;\n  return () => {\n    target[disableScrollElementProp].count--;\n    if (target[disableScrollElementProp].count === 0) {\n      target.style.overflow = target[disableScrollElementProp].previousOverflowStyle;\n      target.style.paddingRight = target[disableScrollElementProp].previousPaddingRightStyle;\n    }\n  };\n}\n\nfunction assertIsDisableScrollElement(element: HTMLElement): asserts element is FluentDisableScrollElement {\n  (element as FluentDisableScrollElement)[disableScrollElementProp] ??= {\n    count: 0,\n    previousOverflowStyle: element.style.overflow,\n    previousPaddingRightStyle: element.style.paddingRight,\n  };\n}\n"]}

package/lib-amd/utils/useFocusFirstElement.js

@@ -0,0 +1,38 @@
+define(["require", "exports", "react", "@fluentui/react-tabster", "@fluentui/react-shared-contexts"], function (require, exports, React, react_tabster_1, react_shared_contexts_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useFocusFirstElement = void 0;
+    /**
+     * Focus first element on content when dialog is opened,
+     */
+    function useFocusFirstElement(open, modalType) {
+        var findFirstFocusable = react_tabster_1.useFocusFinders().findFirstFocusable;
+        var targetDocument = react_shared_contexts_1.useFluent_unstable().targetDocument;
+        var dialogRef = React.useRef(null);
+        var triggerRef = React.useRef();
+        React.useEffect(function () {
+            var _a, _b;
+            if (!open) {
+                return (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }
+            triggerRef.current = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
+            var element = dialogRef.current && findFirstFocusable(dialogRef.current);
+            if (element) {
+                element.focus();
+            }
+            else {
+                (_b = dialogRef.current) === null || _b === void 0 ? void 0 : _b.focus(); // https://github.com/microsoft/fluentui/issues/25150
+                if (process.env.NODE_ENV !== 'production') {
+                    // eslint-disable-next-line no-console
+                    console.warn([
+                        '@fluentui/react-dialog: a Dialog should have at least one focusable element inside DialogSurface.',
+                        'Please add at least a close button either on `DialogTitle` action slot or inside `DialogActions`',
+                    ].join('\n'));
+                }
+            }
+        }, [findFirstFocusable, open, modalType, targetDocument]);
+        return dialogRef;
+    }
+    exports.useFocusFirstElement = useFocusFirstElement;
+});
+//# sourceMappingURL=useFocusFirstElement.js.map

package/lib-amd/utils/useFocusFirstElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusFirstElement.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-dialog/src/utils/useFocusFirstElement.ts"],"names":[],"mappings":";;;;IAMA;;OAEG;IACH,SAAgB,oBAAoB,CAAC,IAAa,EAAE,SAA0B;QACpE,IAAA,kBAAkB,GAAK,+BAAe,EAAE,mBAAtB,CAAuB;QACzC,IAAA,cAAc,GAAK,0CAAkB,EAAE,eAAzB,CAA0B;QAChD,IAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAuB,IAAI,CAAC,CAAC;QAC3D,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,EAAe,CAAC;QAE/C,KAAK,CAAC,SAAS,CAAC;;YACd,IAAI,CAAC,IAAI,EAAE;gBACT,OAAO,MAAA,UAAU,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;aACpC;YACD,UAAU,CAAC,OAAO,GAAG,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,aAAwC,CAAC;YAC9E,IAAM,OAAO,GAAG,SAAS,CAAC,OAAO,IAAI,kBAAkB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;YAC3E,IAAI,OAAO,EAAE;gBACX,OAAO,CAAC,KAAK,EAAE,CAAC;aACjB;iBAAM;gBACL,MAAA,SAAS,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC,CAAC,qDAAqD;gBACjF,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;oBACzC,sCAAsC;oBACtC,OAAO,CAAC,IAAI,CACV;wBACE,mGAAmG;wBACnG,kGAAkG;qBACnG,CAAC,IAAI,CAAC,IAAI,CAAC,CACb,CAAC;iBACH;aACF;QACH,CAAC,EAAE,CAAC,kBAAkB,EAAE,IAAI,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;QAE1D,OAAO,SAAS,CAAC;IACnB,CAAC;IA7BD,oDA6BC","sourcesContent":["import * as React from 'react';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface';\nimport type { DialogModalType } from '../Dialog';\n\n/**\n * Focus first element on content when dialog is opened,\n */\nexport function useFocusFirstElement(open: boolean, modalType: DialogModalType) {\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent_unstable();\n  const dialogRef = React.useRef<DialogSurfaceElement>(null);\n  const triggerRef = React.useRef<HTMLElement>();\n\n  React.useEffect(() => {\n    if (!open) {\n      return triggerRef.current?.focus();\n    }\n    triggerRef.current = targetDocument?.activeElement as HTMLElement | undefined;\n    const element = dialogRef.current && findFirstFocusable(dialogRef.current);\n    if (element) {\n      element.focus();\n    } else {\n      dialogRef.current?.focus(); // https://github.com/microsoft/fluentui/issues/25150\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.warn(\n          [\n            '@fluentui/react-dialog: a Dialog should have at least one focusable element inside DialogSurface.',\n            'Please add at least a close button either on `DialogTitle` action slot or inside `DialogActions`',\n          ].join('\\n'),\n        );\n      }\n    }\n  }, [findFirstFocusable, open, modalType, targetDocument]);\n\n  return dialogRef;\n}\n"]}

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

@@ -61,7 +61,6 @@ const useDialog_unstable = props => {
     content: open ? content : null,
     trigger,
     requestOpenChange,
-    dialogContentId: react_utilities_1.useId('dialog-content-'),
     dialogTitleId: react_utilities_1.useId('dialog-title-'),
     isNestedDialog: react_context_selector_1.useHasParentContext(contexts_1.DialogContext),
     dialogRef: focusRef

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/Dialog/useDialog.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAIA;;;;;;;AAOG;;;AACI,MAAM,kBAAkB,GAAI,KAAD,IAAoC;EACpE,MAAM;IAAE,QAAF;IAAY,SAAS,GAAG,OAAxB;IAAiC;EAAjC,IAAkD,KAAxD;EAEA,MAAM,CAAC,OAAD,EAAU,OAAV,IAAqB,2BAA2B,CAAC,QAAD,CAAtD;EAEA,MAAM,CAAC,IAAD,EAAO,OAAP,IAAkB,iBAAA,CAAA,oBAAA,CAAqB;IAC3C,KAAK,EAAE,KAAK,CAAC,IAD8B;IAE3C,YAAY,EAAE,KAAK,CAAC,WAFuB;IAG3C,YAAY,EAAE;EAH6B,CAArB,CAAxB;EAMA,MAAM,iBAAiB,GAAG,iBAAA,CAAA,gBAAA,CAAkB,IAAD,IAA+B;IACxE,YAAY,KAAA,IAAZ,IAAA,YAAY,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAA,YAAY,CAAG,IAAI,CAAC,KAAR,EAAe,IAAf,CAAZ,CADwE,CAGxE;IACA;;IACA,IAAI,CAAC,IAAI,CAAC,KAAL,CAAW,kBAAX,EAAL,EAAsC;MACpC,OAAO,CAAC,IAAI,CAAC,IAAN,CAAP;IACD;EACF,CARyB,CAA1B;EAUA,MAAM,QAAQ,GAAG,OAAA,CAAA,oBAAA,CAAqB,IAArB,EAA2B,SAA3B,CAAjB;EACA,MAAM,iBAAiB,GAAG,OAAA,CAAA,oBAAA,EAA1B;EACA,MAAM,kBAAkB,GAAG,OAAO,CAAC,IAAI,IAAI,SAAS,KAAK,WAAvB,CAAlC;EAEA,iBAAA,CAAA,yBAAA,CAA0B,MAAK;IAC7B,IAAI,kBAAJ,EAAwB;MACtB,OAAO,iBAAiB,EAAxB;IACD;EACF,CAJD,EAIG,CAAC,iBAAD,EAAoB,kBAApB,CAJH;EAMA,OAAO;IACL,UAAU,EAAE;MACV,QAAQ,EAAE;IADA,CADP;IAIL,IAJK;IAKL,SALK;IAML,OAAO,EAAE,IAAI,GAAG,OAAH,GAAa,IANrB;IAOL,OAPK;IAQL,iBARK;IASL,eAAe,EAAE,iBAAA,CAAA,KAAA,CAAM,iBAAN,CATZ;IAUL,aAAa,EAAE,iBAAA,CAAA,KAAA,CAAM,eAAN,CAVV;IAWL,cAAc,EAAE,wBAAA,CAAA,mBAAA,CAAoB,UAAA,CAAA,aAApB,CAXX;IAYL,SAAS,EAAE;EAZN,CAAP;AAcD,CA7CM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB;AA+Cb;;AAEG;;AACH,SAAS,2BAAT,CACE,QADF,EAC2B;EAEzB,MAAM,aAAa,GAAG,KAAK,CAAC,QAAN,CAAe,OAAf,CAAuB,QAAvB,CAAtB;;EACA,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;IACzC,IAAI,aAAa,CAAC,MAAd,KAAyB,CAAzB,IAA8B,aAAa,CAAC,MAAd,KAAyB,CAA3D,EAA8D;MAC5D;MACA,OAAO,CAAC,IAAR,CACE,+DACE,4EAFJ;IAID;EACF;;EACD,QAAQ,aAAa,CAAC,MAAtB;IACE;IACA,KAAK,CAAL;MACE,OAAO,aAAP;IACF;;IACA,KAAK,CAAL;MACE,OAAO,CAAC,SAAD,EAAY,aAAa,CAAC,CAAD,CAAzB,CAAP;IACF;;IACA;MACE,OAAO,CAAC,SAAD,EAAY,SAAZ,CAAP;EATJ;AAWD","sourcesContent":["import * as React from 'react';\nimport { useControllableState, useEventCallback, useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useDisableBodyScroll, useFocusFirstElement } from '../../utils';\nimport { DialogContext } from '../../contexts';\n\nimport type { DialogOpenChangeData, DialogProps, DialogState } from './Dialog.types';\n\n/**\n * Create the state required to render Dialog.\n *\n * The returned state can be modified with hooks such as useDialogStyles_unstable,\n * before being passed to renderDialog_unstable.\n *\n * @param props - props from this instance of Dialog\n */\nexport const useDialog_unstable = (props: DialogProps): DialogState => {\n  const { children, modalType = 'modal', onOpenChange } = props;\n\n  const [trigger, content] = childrenToTriggerAndContent(children);\n\n  const [open, setOpen] = useControllableState({\n    state: props.open,\n    defaultState: props.defaultOpen,\n    initialState: false,\n  });\n\n  const requestOpenChange = useEventCallback((data: DialogOpenChangeData) => {\n    onOpenChange?.(data.event, data);\n\n    // if user prevents default then do not change state value\n    // otherwise updates state value and trigger reference to the element that caused the opening\n    if (!data.event.isDefaultPrevented()) {\n      setOpen(data.open);\n    }\n  });\n\n  const focusRef = useFocusFirstElement(open, modalType);\n  const disableBodyScroll = useDisableBodyScroll();\n  const isBodyScrollLocked = Boolean(open && modalType !== 'non-modal');\n\n  useIsomorphicLayoutEffect(() => {\n    if (isBodyScrollLocked) {\n      return disableBodyScroll();\n    }\n  }, [disableBodyScroll, isBodyScrollLocked]);\n\n  return {\n    components: {\n      backdrop: 'div',\n    },\n    open,\n    modalType,\n    content: open ? content : null,\n    trigger,\n    requestOpenChange,\n    dialogContentId: useId('dialog-content-'),\n    dialogTitleId: useId('dialog-title-'),\n    isNestedDialog: useHasParentContext(DialogContext),\n    dialogRef: focusRef,\n  };\n};\n\n/**\n * Extracts trigger and content from children\n */\nfunction childrenToTriggerAndContent(\n  children: React.ReactNode,\n): readonly [trigger: React.ReactNode, content: React.ReactNode] {\n  const childrenArray = React.Children.toArray(children) as React.ReactElement[];\n  if (process.env.NODE_ENV !== 'production') {\n    if (childrenArray.length !== 1 && childrenArray.length !== 2) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        'Dialog must contain at least one child <DialogSurface/>,\\n' +\n          'and at most two children <DialogTrigger/> <DialogSurface/> (in this order)',\n      );\n    }\n  }\n  switch (childrenArray.length) {\n    // case where there's a trigger followed by content\n    case 2:\n      return childrenArray as [trigger: React.ReactNode, content: React.ReactNode];\n    // case where there's only content\n    case 1:\n      return [undefined, childrenArray[0]];\n    // unknown case\n    default:\n      return [undefined, undefined];\n  }\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-dialog/src/components/Dialog/useDialog.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,aAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAIA;;;;;;;AAOG;;;AACI,MAAM,kBAAkB,GAAI,KAAD,IAAoC;EACpE,MAAM;IAAE,QAAF;IAAY,SAAS,GAAG,OAAxB;IAAiC;EAAjC,IAAkD,KAAxD;EAEA,MAAM,CAAC,OAAD,EAAU,OAAV,IAAqB,2BAA2B,CAAC,QAAD,CAAtD;EAEA,MAAM,CAAC,IAAD,EAAO,OAAP,IAAkB,iBAAA,CAAA,oBAAA,CAAqB;IAC3C,KAAK,EAAE,KAAK,CAAC,IAD8B;IAE3C,YAAY,EAAE,KAAK,CAAC,WAFuB;IAG3C,YAAY,EAAE;EAH6B,CAArB,CAAxB;EAMA,MAAM,iBAAiB,GAAG,iBAAA,CAAA,gBAAA,CAAkB,IAAD,IAA+B;IACxE,YAAY,KAAA,IAAZ,IAAA,YAAY,KAAA,KAAA,CAAZ,GAAY,KAAA,CAAZ,GAAA,YAAY,CAAG,IAAI,CAAC,KAAR,EAAe,IAAf,CAAZ,CADwE,CAGxE;IACA;;IACA,IAAI,CAAC,IAAI,CAAC,KAAL,CAAW,kBAAX,EAAL,EAAsC;MACpC,OAAO,CAAC,IAAI,CAAC,IAAN,CAAP;IACD;EACF,CARyB,CAA1B;EAUA,MAAM,QAAQ,GAAG,OAAA,CAAA,oBAAA,CAAqB,IAArB,EAA2B,SAA3B,CAAjB;EACA,MAAM,iBAAiB,GAAG,OAAA,CAAA,oBAAA,EAA1B;EACA,MAAM,kBAAkB,GAAG,OAAO,CAAC,IAAI,IAAI,SAAS,KAAK,WAAvB,CAAlC;EAEA,iBAAA,CAAA,yBAAA,CAA0B,MAAK;IAC7B,IAAI,kBAAJ,EAAwB;MACtB,OAAO,iBAAiB,EAAxB;IACD;EACF,CAJD,EAIG,CAAC,iBAAD,EAAoB,kBAApB,CAJH;EAMA,OAAO;IACL,UAAU,EAAE;MACV,QAAQ,EAAE;IADA,CADP;IAIL,IAJK;IAKL,SALK;IAML,OAAO,EAAE,IAAI,GAAG,OAAH,GAAa,IANrB;IAOL,OAPK;IAQL,iBARK;IASL,aAAa,EAAE,iBAAA,CAAA,KAAA,CAAM,eAAN,CATV;IAUL,cAAc,EAAE,wBAAA,CAAA,mBAAA,CAAoB,UAAA,CAAA,aAApB,CAVX;IAWL,SAAS,EAAE;EAXN,CAAP;AAaD,CA5CM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB;AA8Cb;;AAEG;;AACH,SAAS,2BAAT,CACE,QADF,EAC2B;EAEzB,MAAM,aAAa,GAAG,KAAK,CAAC,QAAN,CAAe,OAAf,CAAuB,QAAvB,CAAtB;;EACA,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;IACzC,IAAI,aAAa,CAAC,MAAd,KAAyB,CAAzB,IAA8B,aAAa,CAAC,MAAd,KAAyB,CAA3D,EAA8D;MAC5D;MACA,OAAO,CAAC,IAAR,CACE,+DACE,4EAFJ;IAID;EACF;;EACD,QAAQ,aAAa,CAAC,MAAtB;IACE;IACA,KAAK,CAAL;MACE,OAAO,aAAP;IACF;;IACA,KAAK,CAAL;MACE,OAAO,CAAC,SAAD,EAAY,aAAa,CAAC,CAAD,CAAzB,CAAP;IACF;;IACA;MACE,OAAO,CAAC,SAAD,EAAY,SAAZ,CAAP;EATJ;AAWD","sourcesContent":["import * as React from 'react';\nimport { useControllableState, useEventCallback, useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport { useDisableBodyScroll, useFocusFirstElement } from '../../utils';\nimport { DialogContext } from '../../contexts';\n\nimport type { DialogOpenChangeData, DialogProps, DialogState } from './Dialog.types';\n\n/**\n * Create the state required to render Dialog.\n *\n * The returned state can be modified with hooks such as useDialogStyles_unstable,\n * before being passed to renderDialog_unstable.\n *\n * @param props - props from this instance of Dialog\n */\nexport const useDialog_unstable = (props: DialogProps): DialogState => {\n  const { children, modalType = 'modal', onOpenChange } = props;\n\n  const [trigger, content] = childrenToTriggerAndContent(children);\n\n  const [open, setOpen] = useControllableState({\n    state: props.open,\n    defaultState: props.defaultOpen,\n    initialState: false,\n  });\n\n  const requestOpenChange = useEventCallback((data: DialogOpenChangeData) => {\n    onOpenChange?.(data.event, data);\n\n    // if user prevents default then do not change state value\n    // otherwise updates state value and trigger reference to the element that caused the opening\n    if (!data.event.isDefaultPrevented()) {\n      setOpen(data.open);\n    }\n  });\n\n  const focusRef = useFocusFirstElement(open, modalType);\n  const disableBodyScroll = useDisableBodyScroll();\n  const isBodyScrollLocked = Boolean(open && modalType !== 'non-modal');\n\n  useIsomorphicLayoutEffect(() => {\n    if (isBodyScrollLocked) {\n      return disableBodyScroll();\n    }\n  }, [disableBodyScroll, isBodyScrollLocked]);\n\n  return {\n    components: {\n      backdrop: 'div',\n    },\n    open,\n    modalType,\n    content: open ? content : null,\n    trigger,\n    requestOpenChange,\n    dialogTitleId: useId('dialog-title-'),\n    isNestedDialog: useHasParentContext(DialogContext),\n    dialogRef: focusRef,\n  };\n};\n\n/**\n * Extracts trigger and content from children\n */\nfunction childrenToTriggerAndContent(\n  children: React.ReactNode,\n): readonly [trigger: React.ReactNode, content: React.ReactNode] {\n  const childrenArray = React.Children.toArray(children) as React.ReactElement[];\n  if (process.env.NODE_ENV !== 'production') {\n    if (childrenArray.length !== 1 && childrenArray.length !== 2) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        'Dialog must contain at least one child <DialogSurface/>,\\n' +\n          'and at most two children <DialogTrigger/> <DialogSurface/> (in this order)',\n      );\n    }\n  }\n  switch (childrenArray.length) {\n    // case where there's a trigger followed by content\n    case 2:\n      return childrenArray as [trigger: React.ReactNode, content: React.ReactNode];\n    // case where there's only content\n    case 1:\n      return [undefined, childrenArray[0]];\n    // unknown case\n    default:\n      return [undefined, undefined];\n  }\n}\n"],"sourceRoot":"../src/"}

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

@@ -9,7 +9,6 @@ function useDialogContextValues_unstable(state) {
   const {
     modalType,
     open,
-    dialogContentId,
     dialogRef,
     dialogTitleId,
     isNestedDialog,
@@ -24,7 +23,6 @@ function useDialogContextValues_unstable(state) {
     open,
     modalType,
     dialogRef,
-    dialogContentId,
     dialogTitleId,
     isNestedDialog,
     requestOpenChange

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/Dialog/useDialogContextValues.ts"],"names":[],"mappings":";;;;;;;AAGA,SAAgB,+BAAhB,CAAgD,KAAhD,EAAkE;EAChE,MAAM;IAAE,SAAF;IAAa,IAAb;IAAmB,eAAnB;IAAoC,SAApC;IAA+C,aAA/C;IAA8D,cAA9D;IAA8E;EAA9E,IAAoG,KAA1G;EAEA;;;AAGG;;EACH,MAAM,MAAM,GAAuB;IACjC,IADiC;IAEjC,SAFiC;IAGjC,SAHiC;IAIjC,eAJiC;IAKjC,aALiC;IAMjC,cANiC;IAOjC;EAPiC,CAAnC;EAUA,MAAM,aAAa,GAA8B,KAAjD;EAEA,OAAO;IAAE,MAAF;IAAU;EAAV,CAAP;AACD;;AApBD,OAAA,CAAA,+BAAA,GAAA,+BAAA","sourcesContent":["import type { DialogContextValue, DialogSurfaceContextValue } from '../../contexts';\nimport type { DialogContextValues, DialogState } from './Dialog.types';\n\nexport function useDialogContextValues_unstable(state: DialogState): DialogContextValues {\n  const { modalType, open, dialogContentId, dialogRef, dialogTitleId, isNestedDialog, requestOpenChange } = state;\n\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const dialog: DialogContextValue = {\n    open,\n    modalType,\n    dialogRef,\n    dialogContentId,\n    dialogTitleId,\n    isNestedDialog,\n    requestOpenChange,\n  };\n\n  const dialogSurface: DialogSurfaceContextValue = false;\n\n  return { dialog, dialogSurface };\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-dialog/src/components/Dialog/useDialogContextValues.ts"],"names":[],"mappings":";;;;;;;AAGA,SAAgB,+BAAhB,CAAgD,KAAhD,EAAkE;EAChE,MAAM;IAAE,SAAF;IAAa,IAAb;IAAmB,SAAnB;IAA8B,aAA9B;IAA6C,cAA7C;IAA6D;EAA7D,IAAmF,KAAzF;EAEA;;;AAGG;;EACH,MAAM,MAAM,GAAuB;IACjC,IADiC;IAEjC,SAFiC;IAGjC,SAHiC;IAIjC,aAJiC;IAKjC,cALiC;IAMjC;EANiC,CAAnC;EASA,MAAM,aAAa,GAA8B,KAAjD;EAEA,OAAO;IAAE,MAAF;IAAU;EAAV,CAAP;AACD;;AAnBD,OAAA,CAAA,+BAAA,GAAA,+BAAA","sourcesContent":["import type { DialogContextValue, DialogSurfaceContextValue } from '../../contexts';\nimport type { DialogContextValues, DialogState } from './Dialog.types';\n\nexport function useDialogContextValues_unstable(state: DialogState): DialogContextValues {\n  const { modalType, open, dialogRef, dialogTitleId, isNestedDialog, requestOpenChange } = state;\n\n  /**\n   * This context is created with \"@fluentui/react-context-selector\",\n   * there is no sense to memoize it\n   */\n  const dialog: DialogContextValue = {\n    open,\n    modalType,\n    dialogRef,\n    dialogTitleId,\n    isNestedDialog,\n    requestOpenChange,\n  };\n\n  const dialogSurface: DialogSurfaceContextValue = false;\n\n  return { dialog, dialogSurface };\n}\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/DialogContent/useDialogContent.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.useDialogContent_unstable = void 0;
 
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-
-const contexts_1 = /*#__PURE__*/require("../../contexts");
 /**
  * Create the state required to render DialogBody.
  *
@@ -22,14 +20,12 @@ const contexts_1 = /*#__PURE__*/require("../../contexts");
 const useDialogContent_unstable = (props, ref) => {
   var _a;
 
-  const dialogContentId = contexts_1.useDialogContext_unstable(ctx => ctx.dialogContentId);
   return {
     components: {
       root: 'div'
     },
     root: react_utilities_1.getNativeElementProps((_a = props.as) !== null && _a !== void 0 ? _a : 'div', {
       ref,
-      id: dialogContentId,
       ...props
     })
   };

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogContent/useDialogContent.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,yBAAyB,GAAG,CACvC,KADuC,EAEvC,GAFuC,KAGjB;;;EACtB,MAAM,eAAe,GAAG,UAAA,CAAA,yBAAA,CAA0B,GAAG,IAAI,GAAG,CAAC,eAArC,CAAxB;EACA,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CADP;IAIL,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,CAAA,EAAA,GAAA,KAAK,CAAC,EAAN,MAAQ,IAAR,IAAQ,EAAA,KAAA,KAAA,CAAR,GAAQ,EAAR,GAAY,KAAlC,EAAyC;MAC7C,GAD6C;MAE7C,EAAE,EAAE,eAFyC;MAG7C,GAAG;IAH0C,CAAzC;EAJD,CAAP;AAUD,CAfM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { useDialogContext_unstable } from '../../contexts';\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  const dialogContentId = useDialogContext_unstable(ctx => ctx.dialogContentId);\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps(props.as ?? 'div', {\n      ref,\n      id: dialogContentId,\n      ...props,\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogContent/useDialogContent.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,yBAAyB,GAAG,CACvC,KADuC,EAEvC,GAFuC,KAGjB;;;EACtB,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CADP;IAIL,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,CAAA,EAAA,GAAA,KAAK,CAAC,EAAN,MAAQ,IAAR,IAAQ,EAAA,KAAA,KAAA,CAAR,GAAQ,EAAR,GAAY,KAAlC,EAAyC;MAC7C,GAD6C;MAE7C,GAAG;IAF0C,CAAzC;EAJD,CAAP;AASD,CAbM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","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/"}

package/lib-commonjs/components/DialogSurface/useDialogSurface.js

@@ -33,7 +33,6 @@ const useDialogSurface_unstable = (props, ref) => {
   const open = contexts_1.useDialogContext_unstable(ctx => ctx.open);
   const requestOpenChange = contexts_1.useDialogContext_unstable(ctx => ctx.requestOpenChange);
   const dialogTitleID = contexts_1.useDialogContext_unstable(ctx => ctx.dialogTitleId);
-  const dialogContentId = contexts_1.useDialogContext_unstable(ctx => ctx.dialogContentId);
   const handledBackdropClick = react_utilities_1.useEventCallback(event => {
     var _a, _b;
 
@@ -86,7 +85,6 @@ const useDialogSurface_unstable = (props, ref) => {
       tabIndex: -1,
       'aria-modal': modalType !== 'non-modal',
       role: modalType === 'alert' ? 'alertdialog' : 'dialog',
-      'aria-describedby': dialogContentId,
       'aria-labelledby': props['aria-label'] ? undefined : dialogTitleID,
       ...props,
       ...modalAttributes,

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurface.ts"],"names":[],"mappings":"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","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  const dialogContentId = useDialogContext_unstable(ctx => ctx.dialogContentId);\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-describedby': dialogContentId,\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,"sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurface.ts"],"names":[],"mappings":"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","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/"}

package/lib-commonjs/components/DialogTrigger/useDialogTrigger.js

@@ -29,6 +29,7 @@ const useDialogTrigger_unstable = props => {
   } = props;
   const child = react_utilities_1.getTriggerChild(children);
   const requestOpenChange = contexts_1.useDialogContext_unstable(ctx => ctx.requestOpenChange);
+  const open = contexts_1.useDialogContext_unstable(ctx => ctx.open);
   const {
     triggerAttributes
   } = react_tabster_1.useModalAttributes();
@@ -46,7 +47,7 @@ const useDialogTrigger_unstable = props => {
     }
   });
   const triggerChildProps = { ...(child === null || child === void 0 ? void 0 : child.props),
-    'aria-haspopup': action === 'close' ? undefined : 'dialog',
+    'aria-expanded': open,
     ref: child === null || child === void 0 ? void 0 : child.ref,
     onClick: handleClick,
     ...triggerAttributes

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTrigger/useDialogTrigger.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,UAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;AAEA;;;;;AAKG;;;AACI,MAAM,yBAAyB,GAAI,KAAD,IAAkD;EACzF,MAAM,qBAAqB,GAAG,UAAA,CAAA,gCAAA,EAA9B;EAEA,MAAM;IAAE,QAAF;IAAY,wBAAwB,GAAG,KAAvC;IAA8C,MAAM,GAAG,qBAAqB,GAAG,OAAH,GAAa;EAAzF,IAAoG,KAA1G;EAEA,MAAM,KAAK,GAAG,iBAAA,CAAA,eAAA,CAAgB,QAAhB,CAAd;EAEA,MAAM,iBAAiB,GAAG,UAAA,CAAA,yBAAA,CAA0B,GAAG,IAAI,GAAG,CAAC,iBAArC,CAA1B;EAEA,MAAM;IAAE;EAAF,IAAwB,eAAA,CAAA,kBAAA,EAA9B;EAEA,MAAM,WAAW,GAAG,iBAAA,CAAA,gBAAA,CACjB,KAAD,IAAoF;;;IAClF,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAK,CAAA,EAAA,GAAL,KAAK,CAAE,KAAF,EAAQ,OAAb,MAAoB,IAApB,IAAoB,EAAA,KAAA,KAAA,CAApB,GAAoB,KAAA,CAApB,GAAoB,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,KAAH,CAApB;;IACA,IAAI,CAAC,KAAK,CAAC,kBAAN,EAAL,EAAiC;MAC/B,iBAAiB,CAAC;QAChB,KADgB;QAEhB,IAAI,EAAE,cAFU;QAGhB,IAAI,EAAE,MAAM,KAAK;MAHD,CAAD,CAAjB;IAKD;EACF,CAViB,CAApB;EAaA,MAAM,iBAAiB,GAAG,EACxB,IAAG,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAV,CADwB;IAExB,iBAAiB,MAAM,KAAK,OAAX,GAAqB,SAArB,GAAiC,QAF1B;IAGxB,GAAG,EAAE,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,GAHY;IAIxB,OAAO,EAAE,WAJe;IAKxB,GAAG;EALqB,CAA1B;EAQA,MAAM,2BAA2B,GAAG,YAAA,CAAA,kBAAA,CAClC,CAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,IAAP,MAAgB,QAAhB,IAA4B,CAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,IAAP,MAAgB,GAA5C,GAAkD,KAAK,CAAC,IAAxD,GAA+D,KAD7B,EAElC,EACE,GAAG,iBADL;IAEE,IAAI,EAAE;EAFR,CAFkC,CAApC;EAQA,OAAO;IACL,QAAQ,EAAE,iBAAA,CAAA,2BAAA,CACR,QADQ,EAER,wBAAwB,GAAG,iBAAH,GAAuB,2BAFvC;EADL,CAAP;AAMD,CA9CM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { applyTriggerPropsToChildren, getTriggerChild, useEventCallback } from '@fluentui/react-utilities';\nimport type { DialogTriggerProps, DialogTriggerState } from './DialogTrigger.types';\nimport { useDialogContext_unstable, useDialogSurfaceContext_unstable } from '../../contexts';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\n\n/**\n * Create the state required to render DialogTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup Dialog\n *\n * @param props - props from this instance of DialogTrigger\n */\nexport const useDialogTrigger_unstable = (props: DialogTriggerProps): DialogTriggerState => {\n  const isInsideSurfaceDialog = useDialogSurfaceContext_unstable();\n\n  const { children, disableButtonEnhancement = false, action = isInsideSurfaceDialog ? 'close' : 'open' } = props;\n\n  const child = getTriggerChild(children);\n\n  const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n\n  const { triggerAttributes } = useModalAttributes();\n\n  const handleClick = useEventCallback(\n    (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n      child?.props.onClick?.(event);\n      if (!event.isDefaultPrevented()) {\n        requestOpenChange({\n          event,\n          type: 'triggerClick',\n          open: action === 'open',\n        });\n      }\n    },\n  );\n\n  const triggerChildProps = {\n    ...child?.props,\n    'aria-haspopup': action === 'close' ? undefined : 'dialog',\n    ref: child?.ref,\n    onClick: handleClick,\n    ...triggerAttributes,\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    {\n      ...triggerChildProps,\n      type: 'button',\n    },\n  );\n\n  return {\n    children: applyTriggerPropsToChildren(\n      children,\n      disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTrigger/useDialogTrigger.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,UAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;AAEA;;;;;AAKG;;;AACI,MAAM,yBAAyB,GAAI,KAAD,IAAkD;EACzF,MAAM,qBAAqB,GAAG,UAAA,CAAA,gCAAA,EAA9B;EAEA,MAAM;IAAE,QAAF;IAAY,wBAAwB,GAAG,KAAvC;IAA8C,MAAM,GAAG,qBAAqB,GAAG,OAAH,GAAa;EAAzF,IAAoG,KAA1G;EAEA,MAAM,KAAK,GAAG,iBAAA,CAAA,eAAA,CAAgB,QAAhB,CAAd;EAEA,MAAM,iBAAiB,GAAG,UAAA,CAAA,yBAAA,CAA0B,GAAG,IAAI,GAAG,CAAC,iBAArC,CAA1B;EACA,MAAM,IAAI,GAAG,UAAA,CAAA,yBAAA,CAA0B,GAAG,IAAI,GAAG,CAAC,IAArC,CAAb;EAEA,MAAM;IAAE;EAAF,IAAwB,eAAA,CAAA,kBAAA,EAA9B;EAEA,MAAM,WAAW,GAAG,iBAAA,CAAA,gBAAA,CACjB,KAAD,IAAoF;;;IAClF,CAAA,EAAA,GAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAK,CAAA,EAAA,GAAL,KAAK,CAAE,KAAF,EAAQ,OAAb,MAAoB,IAApB,IAAoB,EAAA,KAAA,KAAA,CAApB,GAAoB,KAAA,CAApB,GAAoB,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,KAAH,CAApB;;IACA,IAAI,CAAC,KAAK,CAAC,kBAAN,EAAL,EAAiC;MAC/B,iBAAiB,CAAC;QAChB,KADgB;QAEhB,IAAI,EAAE,cAFU;QAGhB,IAAI,EAAE,MAAM,KAAK;MAHD,CAAD,CAAjB;IAKD;EACF,CAViB,CAApB;EAaA,MAAM,iBAAiB,GAAG,EACxB,IAAG,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAV,CADwB;IAExB,iBAAiB,IAFO;IAGxB,GAAG,EAAE,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,GAHY;IAIxB,OAAO,EAAE,WAJe;IAKxB,GAAG;EALqB,CAA1B;EAQA,MAAM,2BAA2B,GAAG,YAAA,CAAA,kBAAA,CAClC,CAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,IAAP,MAAgB,QAAhB,IAA4B,CAAA,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,IAAP,MAAgB,GAA5C,GAAkD,KAAK,CAAC,IAAxD,GAA+D,KAD7B,EAElC,EACE,GAAG,iBADL;IAEE,IAAI,EAAE;EAFR,CAFkC,CAApC;EAQA,OAAO;IACL,QAAQ,EAAE,iBAAA,CAAA,2BAAA,CACR,QADQ,EAER,wBAAwB,GAAG,iBAAH,GAAuB,2BAFvC;EADL,CAAP;AAMD,CA/CM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { applyTriggerPropsToChildren, getTriggerChild, useEventCallback } from '@fluentui/react-utilities';\nimport type { DialogTriggerProps, DialogTriggerState } from './DialogTrigger.types';\nimport { useDialogContext_unstable, useDialogSurfaceContext_unstable } from '../../contexts';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\n\n/**\n * Create the state required to render DialogTrigger.\n * Clones the only child component and adds necessary event handling behaviours to open a popup Dialog\n *\n * @param props - props from this instance of DialogTrigger\n */\nexport const useDialogTrigger_unstable = (props: DialogTriggerProps): DialogTriggerState => {\n  const isInsideSurfaceDialog = useDialogSurfaceContext_unstable();\n\n  const { children, disableButtonEnhancement = false, action = isInsideSurfaceDialog ? 'close' : 'open' } = props;\n\n  const child = getTriggerChild(children);\n\n  const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n  const open = useDialogContext_unstable(ctx => ctx.open);\n\n  const { triggerAttributes } = useModalAttributes();\n\n  const handleClick = useEventCallback(\n    (event: React.MouseEvent<HTMLButtonElement & HTMLAnchorElement & HTMLDivElement>) => {\n      child?.props.onClick?.(event);\n      if (!event.isDefaultPrevented()) {\n        requestOpenChange({\n          event,\n          type: 'triggerClick',\n          open: action === 'open',\n        });\n      }\n    },\n  );\n\n  const triggerChildProps = {\n    ...child?.props,\n    'aria-expanded': open,\n    ref: child?.ref,\n    onClick: handleClick,\n    ...triggerAttributes,\n  } as const;\n\n  const ariaButtonTriggerChildProps = useARIAButtonProps(\n    child?.type === 'button' || child?.type === 'a' ? child.type : 'div',\n    {\n      ...triggerChildProps,\n      type: 'button',\n    },\n  );\n\n  return {\n    children: applyTriggerPropsToChildren(\n      children,\n      disableButtonEnhancement ? triggerChildProps : ariaButtonTriggerChildProps,\n    ),\n  };\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/contexts/dialogContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/contexts/dialogContext.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAkBA,MAAM,mBAAmB,GAAuB;EAC9C,IAAI,EAAE,KADwC;EAE9C,SAAS,EAAE,OAFmC;EAG9C,cAAc,EAAE,KAH8B;EAI9C,SAAS,EAAE;IAAE,OAAO,EAAE;EAAX,CAJmC;;EAK9C,iBAAiB,GAAA;IACf;EACD;;AAP6C,CAAhD,C,CAUA;;AACa,OAAA,CAAA,aAAA,gBAAyD,wBAAA,CAAA,aAAA,CACpE,SADoE,CAAzD;AAIA,OAAA,CAAA,cAAA,GAAiB,OAAA,CAAA,aAAA,CAAc,QAA/B;;AACN,MAAM,yBAAyB,GAAO,QAAJ,IACvC,wBAAA,CAAA,kBAAA,CAAmB,OAAA,CAAA,aAAnB,EAAkC,CAAC,GAAG,GAAG,mBAAP,KAA+B,QAAQ,CAAC,GAAD,CAAzE,CADK;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { createContext, ContextSelector, useContextSelector } from '@fluentui/react-context-selector';\nimport { DialogSurfaceElement } from '../DialogSurface';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { DialogModalType, DialogOpenChangeData } from '../Dialog';\n\nexport type DialogContextValue = {\n  open: boolean;\n  dialogContentId?: string;\n  dialogTitleId?: string;\n  isNestedDialog: boolean;\n  dialogRef: React.Ref<DialogSurfaceElement>;\n  modalType: DialogModalType;\n  /**\n   * Requests dialog main component to update it's internal open state\n   */\n  requestOpenChange: (data: DialogOpenChangeData) => void;\n};\n\nconst defaultContextValue: DialogContextValue = {\n  open: false,\n  modalType: 'modal',\n  isNestedDialog: false,\n  dialogRef: { current: null },\n  requestOpenChange() {\n    /* noop */\n  },\n};\n\n// Contexts should default to undefined\nexport const DialogContext: Context<DialogContextValue | undefined> = createContext<DialogContextValue | undefined>(\n  undefined,\n);\n\nexport const DialogProvider = DialogContext.Provider;\nexport const useDialogContext_unstable = <T>(selector: ContextSelector<DialogContextValue, T>): T =>\n  useContextSelector(DialogContext, (ctx = defaultContextValue) => selector(ctx));\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-dialog/src/contexts/dialogContext.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAiBA,MAAM,mBAAmB,GAAuB;EAC9C,IAAI,EAAE,KADwC;EAE9C,SAAS,EAAE,OAFmC;EAG9C,cAAc,EAAE,KAH8B;EAI9C,SAAS,EAAE;IAAE,OAAO,EAAE;EAAX,CAJmC;;EAK9C,iBAAiB,GAAA;IACf;EACD;;AAP6C,CAAhD,C,CAUA;;AACa,OAAA,CAAA,aAAA,gBAAyD,wBAAA,CAAA,aAAA,CACpE,SADoE,CAAzD;AAIA,OAAA,CAAA,cAAA,GAAiB,OAAA,CAAA,aAAA,CAAc,QAA/B;;AACN,MAAM,yBAAyB,GAAO,QAAJ,IACvC,wBAAA,CAAA,kBAAA,CAAmB,OAAA,CAAA,aAAnB,EAAkC,CAAC,GAAG,GAAG,mBAAP,KAA+B,QAAQ,CAAC,GAAD,CAAzE,CADK;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { createContext, ContextSelector, useContextSelector } from '@fluentui/react-context-selector';\nimport { DialogSurfaceElement } from '../DialogSurface';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { DialogModalType, DialogOpenChangeData } from '../Dialog';\n\nexport type DialogContextValue = {\n  open: boolean;\n  dialogTitleId?: string;\n  isNestedDialog: boolean;\n  dialogRef: React.Ref<DialogSurfaceElement>;\n  modalType: DialogModalType;\n  /**\n   * Requests dialog main component to update it's internal open state\n   */\n  requestOpenChange: (data: DialogOpenChangeData) => void;\n};\n\nconst defaultContextValue: DialogContextValue = {\n  open: false,\n  modalType: 'modal',\n  isNestedDialog: false,\n  dialogRef: { current: null },\n  requestOpenChange() {\n    /* noop */\n  },\n};\n\n// Contexts should default to undefined\nexport const DialogContext: Context<DialogContextValue | undefined> = createContext<DialogContextValue | undefined>(\n  undefined,\n);\n\nexport const DialogProvider = DialogContext.Provider;\nexport const useDialogContext_unstable = <T>(selector: ContextSelector<DialogContextValue, T>): T =>\n  useContextSelector(DialogContext, (ctx = defaultContextValue) => selector(ctx));\n"],"sourceRoot":"../src/"}

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@fluentui/react-dialog",
-  "version": "9.1.0",
+  "version": "9.1.2",
   "description": "Dialog component for Fluent UI React",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
-  "typings": "dist/index.d.ts",
+  "typings": "./dist/index.d.ts",
   "sideEffects": false,
   "repository": {
     "type": "git",
@@ -29,20 +29,20 @@
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "9.0.0-beta.17",
+    "@fluentui/react-conformance-griffel": "9.0.0-beta.18",
     "@fluentui/scripts": "^1.0.0"
   },
   "dependencies": {
     "@griffel/react": "^1.4.2",
-    "@fluentui/react-utilities": "^9.2.0",
-    "@fluentui/keyboard-keys": "^9.0.0",
-    "@fluentui/react-context-selector": "^9.1.0",
-    "@fluentui/react-shared-contexts": "^9.1.0",
-    "@fluentui/react-aria": "^9.3.0",
+    "@fluentui/react-utilities": "^9.2.2",
+    "@fluentui/keyboard-keys": "^9.0.1",
+    "@fluentui/react-context-selector": "^9.1.2",
+    "@fluentui/react-shared-contexts": "^9.1.1",
+    "@fluentui/react-aria": "^9.3.2",
     "@fluentui/react-icons": "^2.0.175",
-    "@fluentui/react-tabster": "^9.2.1",
-    "@fluentui/react-theme": "^9.1.1",
-    "@fluentui/react-portal": "^9.0.9",
+    "@fluentui/react-tabster": "^9.3.1",
+    "@fluentui/react-theme": "^9.1.2",
+    "@fluentui/react-portal": "^9.0.11",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {
@@ -59,9 +59,10 @@
   },
   "exports": {
     ".": {
-      "types": "./lib/index.d.ts",
+      "types": "./dist/index.d.ts",
       "import": "./lib/index.js",
       "require": "./lib-commonjs/index.js"
-    }
+    },
+    "./package.json": "./package.json"
   }
 }