npm - @fluentui/react-dialog - Versions diffs - 9.1.16 → 9.3.0 - Mend

@fluentui/react-dialog 9.1.16 → 9.3.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 (134) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AACA,SACEA,qBAAqB,EACrBC,gBAAgB,EAChBC,gBAAgB,EAChBC,aAAa,EACbC,mBAAmB,QACd,2BAA2B;AAOlC,SAASC,yBAAyB,QAAQ,gBAAgB;AAC1D,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,kBAAkB,QAAQ,yBAAyB;AAE5D;;;;;;;;;AASA,OAAO,MAAMC,yBAAyB,GAAG,CACvCC,KAAyB,EACzBC,GAAoC,KACd;EACtB,MAAM;IAAEC,QAAQ;IAAEC;EAAE,CAAE,GAAGH,KAAK;EAC9B,MAAMI,SAAS,GAAGR,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACD,SAAS,CAAC;EACjE,MAAME,SAAS,GAAGV,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACC,SAAS,CAAC;EACjE,MAAMC,IAAI,GAAGX,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACE,IAAI,CAAC;EACvD,MAAMC,iBAAiB,GAAGZ,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACG,iBAAiB,CAAC;EACjF,MAAMC,aAAa,GAAGb,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACK,aAAa,CAAC;EAEzE,MAAMC,oBAAoB,GAAGlB,gBAAgB,CAAEmB,KAAuC,IAAI;;IACxF,IAAIjB,mBAAmB,CAACK,KAAK,CAACE,QAAQ,CAAC,EAAE;MACvC,iBAAK,CAACA,QAAQ,EAACW,OAAO,mDAAGD,KAAK,CAAC;;IAEjC,IAAIR,SAAS,KAAK,OAAO,IAAI,CAACQ,KAAK,CAACE,kBAAkB,EAAE,EAAE;MACxDN,iBAAiB,CAAC;QAChBI,KAAK;QACLL,IAAI,EAAE,KAAK;QACXQ,IAAI,EAAE;OACP,CAAC;;EAEN,CAAC,CAAC;EAEF,MAAMC,aAAa,GAAGvB,gBAAgB,CAAEmB,KAA4D,IAAI;;IACtG,WAAK,CAACK,SAAS,+CAAfjB,KAAK,EAAaY,KAAK,CAAC;IAExB,IAAIf,kBAAkB,CAACe,KAAK,EAAER,SAAS,CAAC,EAAE;MACxCI,iBAAiB,CAAC;QAChBI,KAAK;QACLL,IAAI,EAAE,KAAK;QACXQ,IAAI,EAAE;OACP,CAAC;MACF;MACA;MACAH,KAAK,CAACM,eAAe,EAAE;;EAE3B,CAAC,CAAC;EAEF,MAAM;IAAEC;EAAe,CAAE,GAAGrB,kBAAkB,CAAC;IAAEsB,SAAS,EAAEhB,SAAS,KAAK;EAAW,CAAE,CAAC;EAExF,OAAO;IACLiB,UAAU,EAAE;MACVnB,QAAQ,EAAE,KAAK;MACfoB,IAAI,EAAE;KACP;IACDpB,QAAQ,EAAEV,gBAAgB,CAACU,QAAQ,EAAE;MACnCqB,QAAQ,EAAEhB,IAAI,IAAIH,SAAS,KAAK,WAAW;MAC3CoB,YAAY,EAAE;QACZ,aAAa,EAAE,MAAM;QACrBX,OAAO,EAAEF;;KAEZ,CAAC;IACFW,IAAI,EAAE/B,qBAAqB,CAACY,EAAE,aAAFA,EAAE,cAAFA,EAAE,GAAI,KAAK,EAAE;MACvCsB,QAAQ,EAAE,CAAC,CAAC;MACZ,YAAY,EAAErB,SAAS,KAAK,WAAW;MACvCsB,IAAI,EAAEtB,SAAS,KAAK,OAAO,GAAG,aAAa,GAAG,QAAQ;MACtD,iBAAiB,EAAEJ,KAAK,CAAC,YAAY,CAAC,GAAG2B,SAAS,GAAGlB,aAAa;MAClE,GAAGT,KAAK;MACR,GAAGmB,eAAe;MAClBF,SAAS,EAAED,aAAa;MACxBf,GAAG,EAAEP,aAAa,CAACO,GAAG,EAAEK,SAAS;KAClC;GACF;AACH,CAAC","names":["getNativeElementProps","resolveShorthand","useEventCallback","useMergedRefs","isResolvedShorthand","useDialogContext_unstable","isEscapeKeyDismiss","useModalAttributes","useDialogSurface_unstable","props","ref","backdrop","as","modalType","ctx","dialogRef","open","requestOpenChange","dialogTitleID","dialogTitleId","handledBackdropClick","event","onClick","isDefaultPrevented","type","handleKeyDown","onKeyDown","stopPropagation","modalAttributes","trapFocus","components","root","required","defaultProps","tabIndex","role","undefined"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n getNativeElementProps,\n resolveShorthand,\n useEventCallback,\n useMergedRefs,\n isResolvedShorthand,\n} from '@fluentui/react-utilities';\nimport type {\n DialogSurfaceElement,\n DialogSurfaceElementIntersection,\n DialogSurfaceProps,\n DialogSurfaceState,\n} from './DialogSurface.types';\nimport { useDialogContext_unstable } from '../../contexts';\nimport { isEscapeKeyDismiss } from '../../utils';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\n/*\n Create the state required to render DialogSurface.\n \n The returned state can be modified with hooks such as useDialogSurfaceStyles_unstable,\n * before being passed to renderDialogSurface_unstable.\n \n @param props - props from this instance of DialogSurface\n * @param ref - reference to root HTMLElement of DialogSurface\n */\nexport const useDialogSurface_unstable = (\n props: DialogSurfaceProps,\n ref: React.Ref<DialogSurfaceElement>,\n): DialogSurfaceState => {\n const { backdrop, as } = props;\n const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n const dialogRef = useDialogContext_unstable(ctx => ctx.dialogRef);\n const open = useDialogContext_unstable(ctx => ctx.open);\n const requestOpenChange = useDialogContext_unstable(ctx => ctx.requestOpenChange);\n const dialogTitleID = useDialogContext_unstable(ctx => ctx.dialogTitleId);\n\n const handledBackdropClick = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n if (isResolvedShorthand(props.backdrop)) {\n props.backdrop.onClick?.(event);\n }\n if (modalType === 'modal' && !event.isDefaultPrevented()) {\n requestOpenChange({\n event,\n open: false,\n type: 'backdropClick',\n });\n }\n });\n\n const handleKeyDown = useEventCallback((event: React.KeyboardEvent<DialogSurfaceElementIntersection>) => {\n props.onKeyDown?.(event);\n\n if (isEscapeKeyDismiss(event, modalType)) {\n requestOpenChange({\n event,\n open: false,\n type: 'escapeKeyDown',\n });\n // stop propagation to avoid conflicting with other elements that listen for `Escape`\n // e,g: nested Dialog, Popover, Menu and Tooltip\n event.stopPropagation();\n }\n });\n\n const { modalAttributes } = useModalAttributes({ trapFocus: modalType !== 'non-modal' });\n\n return {\n components: {\n backdrop: 'div',\n root: 'div',\n },\n backdrop: resolveShorthand(backdrop, {\n required: open && modalType !== 'non-modal',\n defaultProps: {\n 'aria-hidden': 'true',\n onClick: handledBackdropClick,\n },\n }),\n root: getNativeElementProps(as ?? 'div', {\n tabIndex: -1, // https://github.com/microsoft/fluentui/issues/25150\n 'aria-modal': modalType !== 'non-modal',\n role: modalType === 'alert' ? 'alertdialog' : 'dialog',\n 'aria-labelledby': props['aria-label'] ? undefined : dialogTitleID,\n ...props,\n ...modalAttributes,\n onKeyDown: handleKeyDown,\n ref: useMergedRefs(ref, dialogRef),\n }),\n };\n};\n"]}
1	+ {"version":3,"names":["getNativeElementProps","resolveShorthand","useEventCallback","useMergedRefs","isResolvedShorthand","useDialogContext_unstable","isEscapeKeyDismiss","useModalAttributes","useDialogSurface_unstable","props","ref","backdrop","as","modalType","ctx","inertTrapFocus","dialogRef","open","requestOpenChange","dialogTitleID","dialogTitleId","handledBackdropClick","event","_b","_a","onClick","call","isDefaultPrevented","type","handleKeyDown","onKeyDown","stopPropagation","modalAttributes","trapFocus","legacyTrapFocus","components","root","required","defaultProps","tabIndex","role","undefined"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurface.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n getNativeElementProps,\n resolveShorthand,\n useEventCallback,\n useMergedRefs,\n isResolvedShorthand,\n} from '@fluentui/react-utilities';\nimport type {\n DialogSurfaceElement,\n DialogSurfaceElementIntersection,\n DialogSurfaceProps,\n DialogSurfaceState,\n} from './DialogSurface.types';\nimport { useDialogContext_unstable } from '../../contexts';\nimport { isEscapeKeyDismiss } from '../../utils';\nimport { useModalAttributes } from '@fluentui/react-tabster';\n\n/*\n Create the state required to render DialogSurface.\n \n The returned state can be modified with hooks such as useDialogSurfaceStyles_unstable,\n * before being passed to renderDialogSurface_unstable.\n \n @param props - props from this instance of DialogSurface\n * @param ref - reference to root HTMLElement of DialogSurface\n */\nexport const useDialogSurface_unstable = (\n props: DialogSurfaceProps,\n ref: React.Ref<DialogSurfaceElement>,\n): DialogSurfaceState => {\n const { backdrop, as } = props;\n const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n const inertTrapFocus = useDialogContext_unstable(ctx => ctx.inertTrapFocus);\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({\n trapFocus: modalType !== 'non-modal',\n legacyTrapFocus: !inertTrapFocus,\n });\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"],"mappings":"AACA,SACEA,qBAAqB,EACrBC,gBAAgB,EAChBC,gBAAgB,EAChBC,aAAa,EACbC,mBAAmB,QACd,2BAA2B;AAOlC,SAASC,yBAAyB,QAAQ,gBAAgB;AAC1D,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,kBAAkB,QAAQ,yBAAyB;AAE5D;;;;;;;;;AASA,OAAO,MAAMC,yBAAyB,GAAGA,CACvCC,KAAyB,EACzBC,GAAoC,KACd;EACtB,MAAM;IAAEC,QAAQ;IAAEC;EAAE,CAAE,GAAGH,KAAK;EAC9B,MAAMI,SAAS,GAAGR,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACD,SAAS,CAAC;EACjE,MAAME,cAAc,GAAGV,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACC,cAAc,CAAC;EAC3E,MAAMC,SAAS,GAAGX,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACE,SAAS,CAAC;EACjE,MAAMC,IAAI,GAAGZ,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACG,IAAI,CAAC;EACvD,MAAMC,iBAAiB,GAAGb,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACI,iBAAiB,CAAC;EACjF,MAAMC,aAAa,GAAGd,yBAAyB,CAACS,GAAG,IAAIA,GAAG,CAACM,aAAa,CAAC;EAEzE,MAAMC,oBAAoB,GAAGnB,gBAAgB,CAAEoB,KAAuC,IAAI;;IACxF,IAAIlB,mBAAmB,CAACK,KAAK,CAACE,QAAQ,CAAC,EAAE;MACvC,CAAAY,EAAA,IAAAC,EAAA,GAAAf,KAAK,CAACE,QAAQ,EAACc,OAAO,cAAAF,EAAA,uBAAAA,EAAA,CAAAG,IAAA,CAAAF,EAAA,EAAGF,KAAK,CAAC;;IAEjC,IAAIT,SAAS,KAAK,OAAO,IAAI,CAACS,KAAK,CAACK,kBAAkB,EAAE,EAAE;MACxDT,iBAAiB,CAAC;QAChBI,KAAK;QACLL,IAAI,EAAE,KAAK;QACXW,IAAI,EAAE;OACP,CAAC;;EAEN,CAAC,CAAC;EAEF,MAAMC,aAAa,GAAG3B,gBAAgB,CAAEoB,KAA4D,IAAI;;IACtG,CAAAE,EAAA,GAAAf,KAAK,CAACqB,SAAS,cAAAN,EAAA,uBAAAA,EAAA,CAAAE,IAAA,CAAfjB,KAAK,EAAaa,KAAK,CAAC;IAExB,IAAIhB,kBAAkB,CAACgB,KAAK,EAAET,SAAS,CAAC,EAAE;MACxCK,iBAAiB,CAAC;QAChBI,KAAK;QACLL,IAAI,EAAE,KAAK;QACXW,IAAI,EAAE;OACP,CAAC;MACF;MACA;MACAN,KAAK,CAACS,eAAe,EAAE;;EAE3B,CAAC,CAAC;EAEF,MAAM;IAAEC;EAAe,CAAE,GAAGzB,kBAAkB,CAAC;IAC7C0B,SAAS,EAAEpB,SAAS,KAAK,WAAW;IACpCqB,eAAe,EAAE,CAACnB;GACnB,CAAC;EAEF,OAAO;IACLoB,UAAU,EAAE;MACVxB,QAAQ,EAAE,KAAK;MACfyB,IAAI,EAAE;KACP;IACDzB,QAAQ,EAAEV,gBAAgB,CAACU,QAAQ,EAAE;MACnC0B,QAAQ,EAAEpB,IAAI,IAAIJ,SAAS,KAAK,WAAW;MAC3CyB,YAAY,EAAE;QACZ,aAAa,EAAE,MAAM;QACrBb,OAAO,EAAEJ;;KAEZ,CAAC;IACFe,IAAI,EAAEpC,qBAAqB,CAACY,EAAE,aAAFA,EAAE,cAAFA,EAAE,GAAI,KAAK,EAAE;MACvC2B,QAAQ,EAAE,CAAC,CAAC;MACZ,YAAY,EAAE1B,SAAS,KAAK,WAAW;MACvC2B,IAAI,EAAE3B,SAAS,KAAK,OAAO,GAAG,aAAa,GAAG,QAAQ;MACtD,iBAAiB,EAAEJ,KAAK,CAAC,YAAY,CAAC,GAAGgC,SAAS,GAAGtB,aAAa;MAClE,GAAGV,KAAK;MACR,GAAGuB,eAAe;MAClBF,SAAS,EAAED,aAAa;MACxBnB,GAAG,EAAEP,aAAa,CAACO,GAAG,EAAEM,SAAS;KAClC;GACF;AACH,CAAC"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"~~mappings~~":"~~AAAA~~,~~mBAAqBA~~,~~YAAY~~,~~EAAEC~~,~~UAAU~~,~~QAAQ~~,~~gBAAgB;AAErE~~,~~SAASC~~,~~MAAM~~,~~QAAQ~~,~~uBAAuB;AAC9C~~,~~SAASC~~,~~uBAAuB~~,~~QAAQ~~,~~yBAAyB;AACjE~~,~~SACEC,+BAA+B~~,~~EAC/BC~~,~~oBAAoB~~,~~EACpBC~~,~~eAAe~~,~~EACfC~~,~~yBAAyB~~,~~QACpB~~,~~gBAAgB;AAGvB~~,~~OAAO~~,~~MAAMC~~,~~uBAAuB~~,~~GAAuC;EACzEC~~,~~IAAI~~,~~EAAE~~,~~mBAAmB;EACzBC~~,~~QAAQ~~,~~EAAE;CACX;AAED;;;AAGA~~,~~MAAMC~~,~~SAAS~~,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;AAAA,~~EA2ChB;AAEF;;;AAGA~~,~~OAAO~~,~~MAAMC,+BAA+B~~,~~GAAIC~~,~~KAAyB~~,~~IAAwB;EAC/F~~,~~MAAMC~~,~~MAAM~~,~~GAAGH~~,~~SAAS~~,~~EAAE;EAC1B~~,~~MAAMI~~,~~cAAc~~,~~GAAGR~~,~~yBAAyB~~,~~CAACS~~,~~GAAG~~,~~IAAIA~~,~~GAAG~~,~~CAACD~~,~~cAAc~~,~~CAAC;EAE3EF~~,~~KAAK~~,~~CAACJ~~,~~IAAI~~,~~CAACQ~~,~~SAAS~~,~~GAAGjB~~,~~YAAY~~,~~CACjCQ~~,~~uBAAuB~~,~~CAACC~~,~~IAAI~~,~~EAC5BK~~,~~MAAM~~,~~CAACL~~,~~IAAI~~,~~EACXK~~,~~MAAM~~,CAACI,YAAY,EACnBH,cAAc,IAAID,MAAM,CAACK,0BAA0B,EACnDN,KAAK,CAACJ,IAAI,CAACQ,SAAS,CACrB;EACD,IAAIJ,KAAK,CAACH,QAAQ,EAAE;IAClBG,KAAK,CAACH,QAAQ,CAACO,SAAS,GAAGjB,YAAY,CACrCQ,uBAAuB,CAACE,QAAQ,EAChCI,MAAM,CAACJ,QAAQ,EACfK,cAAc,IAAID,MAAM,CAACM,oBAAoB,EAC7CP,KAAK,CAACH,QAAQ,CAACO,SAAS,CACzB;;EAEH,OAAOJ,KAAK;AACd,CAAC","~~names~~":["~~mergeClasses~~","~~shorthands~~","~~tokens~~","~~createFocusOutlineStyle~~","~~MEDIA_QUERY_BREAKPOINT_SELECTOR~~","~~SURFACE_BORDER_WIDTH~~","~~SURFACE_PADDING~~","~~useDialogContext_unstable~~","~~dialogSurfaceClassNames~~","~~root~~","~~backdrop~~","~~useStyles~~","~~useDialogSurfaceStyles_unstable~~","~~state~~","~~styles~~","~~isNestedDialog~~","~~ctx~~","~~className~~","~~focusOutline~~","~~nestedNativeDialogBackdrop~~","~~nestedDialogBackdrop~~"],"~~sourceRoot~~":"~~../src/~~","sources":["packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurfaceStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport {\n MEDIA_QUERY_BREAKPOINT_SELECTOR,\n SURFACE_BORDER_WIDTH,\n SURFACE_PADDING,\n useDialogContext_unstable,\n} from '../../contexts';\nimport type { DialogSurfaceSlots, DialogSurfaceState } from './DialogSurface.types';\n\nexport const dialogSurfaceClassNames: SlotClassNames<DialogSurfaceSlots> = {\n root: 'fui-DialogSurface',\n backdrop: 'fui-DialogSurface__backdrop',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n focusOutline: createFocusOutlineStyle(),\n root: {\n display: 'block',\n userSelect: 'unset',\n visibility: 'unset',\n ...shorthands.inset(0),\n ...shorthands.padding(0),\n ...shorthands.padding(SURFACE_PADDING),\n ...shorthands.margin('auto'),\n ...shorthands.borderStyle('none'),\n ...shorthands.overflow('unset'),\n '&::backdrop': {\n backgroundColor: 'rgba(0, 0, 0, 0.4)',\n },\n position: 'fixed',\n width: '100%',\n height: 'fit-content',\n maxWidth: '600px',\n maxHeight: '100vh',\n boxSizing: 'border-box',\n boxShadow: tokens.shadow64,\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n ...shorthands.border(SURFACE_BORDER_WIDTH, 'solid', tokens.colorTransparentStroke),\n ...shorthands.borderRadius(tokens.borderRadiusXLarge),\n [MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n maxWidth: '100vw',\n },\n },\n backdrop: {\n position: 'fixed',\n backgroundColor: 'rgba(0, 0, 0, 0.4)',\n ...shorthands.inset('0px'),\n },\n nestedDialogBackdrop: {\n backgroundColor: 'transparent',\n },\n nestedNativeDialogBackdrop: {\n '&::backdrop': {\n backgroundColor: 'transparent',\n },\n },\n});\n\n/\n Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = (state: DialogSurfaceState): DialogSurfaceState => {\n const styles = useStyles();\n const isNestedDialog = useDialogContext_unstable(ctx => ctx.isNestedDialog);\n\n state.root.className = mergeClasses(\n dialogSurfaceClassNames.root,\n styles.root,\n styles.focusOutline,\n isNestedDialog && styles.nestedNativeDialogBackdrop,\n state.root.className,\n );\n if (state.backdrop) {\n state.backdrop.className = mergeClasses(\n dialogSurfaceClassNames.backdrop,\n styles.backdrop,\n isNestedDialog && styles.nestedDialogBackdrop,\n state.backdrop.className,\n );\n }\n return state;\n};\n"]}
1	+ {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","createFocusOutlineStyle","MEDIA_QUERY_BREAKPOINT_SELECTOR","SURFACE_BORDER_WIDTH","SURFACE_PADDING","useDialogContext_unstable","dialogSurfaceClassNames","root","backdrop","useStyles","focusOutline","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","mc9l5x","famaaq","Bcdw1i0","Bhzewxz","j35jbq","B5kzvoi","oyh7mz","z8tnut","z189sj","Byoj8tv","uwmqm3","B6of3ja","t21cq0","jrapky","Frg6f3","icvyot","vrafjx","oivjwe","wvpqe5","B68tc82","Bmxbyg5","fshzfu","qhf8xq","a9b677","Bqenvij","B2u0y6b","Bxyxcbc","B7ck84d","E5pizo","De3pzq","sj55zd","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","g2u3we","h3c5rm","B9xav0g","zhjwy3","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","B5xtmjs","nestedDialogBackdrop","nestedNativeDialogBackdrop","f","i","d","m","useDialogSurfaceStyles_unstable","state","styles","isNestedDialog","ctx","className"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogSurface/useDialogSurfaceStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport {\n MEDIA_QUERY_BREAKPOINT_SELECTOR,\n SURFACE_BORDER_WIDTH,\n SURFACE_PADDING,\n useDialogContext_unstable,\n} from '../../contexts';\nimport type { DialogSurfaceSlots, DialogSurfaceState } from './DialogSurface.types';\n\nexport const dialogSurfaceClassNames: SlotClassNames<DialogSurfaceSlots> = {\n root: 'fui-DialogSurface',\n backdrop: 'fui-DialogSurface__backdrop',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n focusOutline: createFocusOutlineStyle(),\n root: {\n display: 'block',\n userSelect: 'unset',\n visibility: 'unset',\n ...shorthands.inset(0),\n ...shorthands.padding(0),\n ...shorthands.padding(SURFACE_PADDING),\n ...shorthands.margin('auto'),\n ...shorthands.borderStyle('none'),\n ...shorthands.overflow('unset'),\n '&::backdrop': {\n backgroundColor: 'rgba(0, 0, 0, 0.4)',\n },\n position: 'fixed',\n width: '100%',\n height: 'fit-content',\n maxWidth: '600px',\n maxHeight: '100vh',\n boxSizing: 'border-box',\n boxShadow: tokens.shadow64,\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n ...shorthands.border(SURFACE_BORDER_WIDTH, 'solid', tokens.colorTransparentStroke),\n ...shorthands.borderRadius(tokens.borderRadiusXLarge),\n [MEDIA_QUERY_BREAKPOINT_SELECTOR]: {\n maxWidth: '100vw',\n },\n },\n backdrop: {\n position: 'fixed',\n backgroundColor: 'rgba(0, 0, 0, 0.4)',\n ...shorthands.inset('0px'),\n },\n nestedDialogBackdrop: {\n backgroundColor: 'transparent',\n },\n nestedNativeDialogBackdrop: {\n '&::backdrop': {\n backgroundColor: 'transparent',\n },\n },\n});\n\n/\n Apply styling to the DialogSurface slots based on the state\n */\nexport const useDialogSurfaceStyles_unstable = (state: DialogSurfaceState): DialogSurfaceState => {\n const styles = useStyles();\n const isNestedDialog = useDialogContext_unstable(ctx => ctx.isNestedDialog);\n\n state.root.className = mergeClasses(\n dialogSurfaceClassNames.root,\n styles.root,\n styles.focusOutline,\n isNestedDialog && styles.nestedNativeDialogBackdrop,\n state.root.className,\n );\n if (state.backdrop) {\n state.backdrop.className = mergeClasses(\n dialogSurfaceClassNames.backdrop,\n styles.backdrop,\n isNestedDialog && styles.nestedDialogBackdrop,\n state.backdrop.className,\n );\n }\n return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAErE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,SACEC,+BAA+B,EAC/BC,oBAAoB,EACpBC,eAAe,EACfC,yBAAyB,QACpB,gBAAgB;AAGvB,OAAO,MAAMC,uBAAuB,GAAuC;EACzEC,IAAI,EAAE,mBAAmB;EACzBC,QAAQ,EAAE;CACX;AAED;;;AAGA,MAAMC,SAAS,gBAAGZ,QAAA;EAAAa,YAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAjC,IAAA;IAAAkC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAA5E,QAAA;IAAAuD,MAAA;IAAAO,MAAA;IAAA1B,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAsC,oBAAA;IAAAf,MAAA;EAAA;EAAAgB,0BAAA;IAAAxB,MAAA;EAAA;AAAA;EAAAyB,CAAA;EAAAC,CAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;AAAA,EA2ChB;AAEF;;;AAGA,OAAO,MAAMC,+BAA+B,GAAIC,KAAyB,IAAwB;EAC/F,MAAMC,MAAM,GAAGpF,SAAS,EAAE;EAC1B,MAAMqF,cAAc,GAAGzF,yBAAyB,CAAC0F,GAAG,IAAIA,GAAG,CAACD,cAAc,CAAC;EAE3EF,KAAK,CAACrF,IAAI,CAACyF,SAAS,GAAGlG,YAAY,CACjCQ,uBAAuB,CAACC,IAAI,EAC5BsF,MAAM,CAACtF,IAAI,EACXsF,MAAM,CAACnF,YAAY,EACnBoF,cAAc,IAAID,MAAM,CAACP,0BAA0B,EACnDM,KAAK,CAACrF,IAAI,CAACyF,SAAS,CACrB;EACD,IAAIJ,KAAK,CAACpF,QAAQ,EAAE;IAClBoF,KAAK,CAACpF,QAAQ,CAACwF,SAAS,GAAGlG,YAAY,CACrCQ,uBAAuB,CAACE,QAAQ,EAChCqF,MAAM,CAACrF,QAAQ,EACfsF,cAAc,IAAID,MAAM,CAACR,oBAAoB,EAC7CO,KAAK,CAACpF,QAAQ,CAACwF,SAAS,CACzB;;EAEH,OAAOJ,KAAK;AACd,CAAC"}

package/lib/components/DialogTitle/DialogTitle.js CHANGED Viewed

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { useDialogTitle_unstable } from './useDialogTitle';
 import { renderDialogTitle_unstable } from './renderDialogTitle';
 import { useDialogTitleStyles_unstable } from './useDialogTitleStyles';
+import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
 /**
  * The `DialogTitle` component expects to have a title/header
  * and when `Dialog` is `non-modal` a close (X icon) button is provided through `action` slot by default.
@@ -9,6 +10,10 @@ import { useDialogTitleStyles_unstable } from './useDialogTitleStyles';
 export const DialogTitle = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useDialogTitle_unstable(props, ref);
   useDialogTitleStyles_unstable(state);
+  const {
+    useDialogTitleStyles_unstable: useCustomStyles
+  } = useCustomStyleHooks_unstable();
+  useCustomStyles(state);
   return renderDialogTitle_unstable(state);
 });
 DialogTitle.displayName = 'DialogTitle';

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

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,6BAA6B,QAAQ,wBAAwB;AAItE;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGP,uBAAuB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEjDJ,6BAA6B,CAACK,KAAK,CAAC;EACpC,OAAON,0BAA0B,CAACM,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFJ,WAAW,CAACK,WAAW,GAAG,aAAa","names":["React","useDialogTitle_unstable","renderDialogTitle_unstable","useDialogTitleStyles_unstable","DialogTitle","forwardRef","props","ref","state","displayName"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTitle/DialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogTitle_unstable } from './useDialogTitle';\nimport { renderDialogTitle_unstable } from './renderDialogTitle';\nimport { useDialogTitleStyles_unstable } from './useDialogTitleStyles';\nimport type { DialogTitleProps } from './DialogTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n The `DialogTitle` component expects to have a title/header\n * and when `Dialog` is `non-modal` a close (X icon) button is provided through `action` slot by default.\n */\nexport const DialogTitle: ForwardRefComponent<DialogTitleProps> = React.forwardRef((props, ref) => {\n const state = useDialogTitle_unstable(props, ref);\n\n useDialogTitleStyles_unstable(state);\n return renderDialogTitle_unstable(state);\n});\n\nDialogTitle.displayName = 'DialogTitle';\n"]}
1	+ {"version":3,"names":["React","useDialogTitle_unstable","renderDialogTitle_unstable","useDialogTitleStyles_unstable","useCustomStyleHooks_unstable","DialogTitle","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTitle/DialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogTitle_unstable } from './useDialogTitle';\nimport { renderDialogTitle_unstable } from './renderDialogTitle';\nimport { useDialogTitleStyles_unstable } from './useDialogTitleStyles';\nimport type { DialogTitleProps } from './DialogTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n The `DialogTitle` component expects to have a title/header\n * and when `Dialog` is `non-modal` a close (X icon) button is provided through `action` slot by default.\n */\nexport const DialogTitle: ForwardRefComponent<DialogTitleProps> = React.forwardRef((props, ref) => {\n const state = useDialogTitle_unstable(props, ref);\n\n useDialogTitleStyles_unstable(state);\n\n const { useDialogTitleStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderDialogTitle_unstable(state);\n});\n\nDialogTitle.displayName = 'DialogTitle';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,6BAA6B,QAAQ,wBAAwB;AAGtE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGR,uBAAuB,CAACM,KAAK,EAAEC,GAAG,CAAC;EAEjDL,6BAA6B,CAACM,KAAK,CAAC;EAEpC,MAAM;IAAEN,6BAA6B,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACzFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOP,0BAA0B,CAACO,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFJ,WAAW,CAACM,WAAW,GAAG,aAAa"}

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

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAmBE,KAAK,CAAC;EAE9D,oBACEH,uDACEA,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,GAAGD,SAAS,CAACC,IAAI,CAACC,QAAQ,CAAc,EACrEH,KAAK,CAACI,MAAM,iBAAIR,oBAACI,KAAK,CAACI,MAAM;IAAA,GAAKH,SAAS,CAACG;EAAM,EAAI,CACtD;AAEP,CAAC","names":["React","getSlots","renderDialogTitle_unstable","state","slots","slotProps","root","children","action"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTitle/renderDialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DialogTitleState, DialogTitleSlots } from './DialogTitle.types';\n\n/*\n Render the final JSX of DialogTitle\n */\nexport const renderDialogTitle_unstable = (state: DialogTitleState) => {\n const { slots, slotProps } = getSlots<DialogTitleSlots>(state);\n\n return (\n <>\n <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root>\n {slots.action && <slots.action {...slotProps.action} />}\n </>\n );\n};\n"]}
1	+ {"version":3,"names":["React","getSlots","renderDialogTitle_unstable","state","slots","slotProps","createElement","Fragment","root","children","action"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTitle/renderDialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { DialogTitleState, DialogTitleSlots } from './DialogTitle.types';\n\n/*\n Render the final JSX of DialogTitle\n */\nexport const renderDialogTitle_unstable = (state: DialogTitleState) => {\n const { slots, slotProps } = getSlots<DialogTitleSlots>(state);\n\n return (\n <>\n <slots.root {...slotProps.root}>{slotProps.root.children}</slots.root>\n {slots.action && <slots.action {...slotProps.action} />}\n </>\n );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAmBE,KAAK,CAAC;EAE9D,oBACEH,KAAA,CAAAM,aAAA,CAAAN,KAAA,CAAAO,QAAA,qBACEP,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAAGH,SAAS,CAACG,IAAI,CAACC,QAAQ,CAAc,EACrEL,KAAK,CAACM,MAAM,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACM,MAAM;IAAA,GAAKL,SAAS,CAACK;EAAM,EAAI,CACtD;AAEP,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,2BAA2B;AAEjE,SAASC,yBAAyB,QAAQ,8BAA8B;AACxE,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,SAASC,gBAAgB,QAAQ,2BAA2B;AAC5D,SAASC,aAAa,QAAQ,gCAAgC;AAC9D,SAASC,4BAA4B,QAAQ,wBAAwB;AAErE;;;;;;;;;AASA,OAAO,MAAMC,uBAAuB,GAAG,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,MAAM;IAAEC,EAAE;IAAEC;EAAM,CAAE,GAAGH,KAAK;EAC5B,MAAMI,SAAS,GAAGV,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACD,SAAS,CAAC;EACjE,MAAME,cAAc,GAAGR,4BAA4B,EAAE;EAErD,OAAO;IACLS,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXL,MAAM,EAAE;KACT;IACDK,IAAI,EAAEf,qBAAqB,CAACS,EAAE,aAAFA,EAAE,cAAFA,EAAE,GAAI,KAAK,EAAE;MACvCD,GAAG;MACHQ,EAAE,EAAEf,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACK,aAAa,CAAC;MACvD,GAAGV;KACJ,CAAC;IACFG,MAAM,EAAEP,gBAAgB,CAACO,MAAM,EAAE;MAC/BQ,QAAQ,EAAEP,SAAS,KAAK,WAAW;MACnCQ,YAAY,EAAE;QACZC,QAAQ,eACNrB,oBAACK,aAAa;UAACiB,wBAAwB;UAACX,MAAM,EAAC;QAAO,gBACpDX;UACEuB,SAAS,EAAET,cAAc,CAACU,MAAM;UAAA,cAErB;QAAO,gBAElBxB,oBAACG,gBAAgB,OAAG,CACb;;KAIhB;GACF;AACH,CAAC","names":["React","getNativeElementProps","useDialogContext_unstable","Dismiss24Regular","resolveShorthand","DialogTrigger","useDialogTitleInternalStyles","useDialogTitle_unstable","props","ref","as","action","modalType","ctx","internalStyles","components","root","id","dialogTitleId","required","defaultProps","children","disableButtonEnhancement","className","button"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTitle/useDialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { DialogTitleProps, DialogTitleState } from './DialogTitle.types';\nimport { useDialogContext_unstable } from '../../contexts/dialogContext';\nimport { Dismiss24Regular } from '@fluentui/react-icons';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { DialogTrigger } from '../DialogTrigger/DialogTrigger';\nimport { useDialogTitleInternalStyles } from './useDialogTitleStyles';\n\n/*\n Create the state required to render DialogTitle.\n \n The returned state can be modified with hooks such as useDialogTitleStyles_unstable,\n * before being passed to renderDialogTitle_unstable.\n \n @param props - props from this instance of DialogTitle\n * @param ref - reference to root HTMLElement of DialogTitle\n */\nexport const useDialogTitle_unstable = (props: DialogTitleProps, ref: React.Ref<HTMLElement>): DialogTitleState => {\n const { as, action } = props;\n const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n const internalStyles = useDialogTitleInternalStyles();\n\n return {\n components: {\n root: 'div',\n action: 'div',\n },\n root: getNativeElementProps(as ?? 'div', {\n ref,\n id: useDialogContext_unstable(ctx => ctx.dialogTitleId),\n ...props,\n }),\n action: resolveShorthand(action, {\n required: modalType === 'non-modal',\n defaultProps: {\n children: (\n <DialogTrigger disableButtonEnhancement action=\"close\">\n <button\n className={internalStyles.button}\n // TODO: find a better way to add internal labels\n aria-label=\"close\"\n >\n <Dismiss24Regular />\n </button>\n </DialogTrigger>\n ),\n },\n }),\n };\n};\n"]}
1	+ {"version":3,"names":["React","getNativeElementProps","useDialogContext_unstable","Dismiss24Regular","resolveShorthand","DialogTrigger","useDialogTitleInternalStyles","useDialogTitle_unstable","props","ref","as","action","modalType","ctx","internalStyles","components","root","id","dialogTitleId","required","defaultProps","children","createElement","disableButtonEnhancement","className","button"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTitle/useDialogTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { DialogTitleProps, DialogTitleState } from './DialogTitle.types';\nimport { useDialogContext_unstable } from '../../contexts/dialogContext';\nimport { Dismiss24Regular } from '@fluentui/react-icons';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { DialogTrigger } from '../DialogTrigger/DialogTrigger';\nimport { useDialogTitleInternalStyles } from './useDialogTitleStyles';\n\n/*\n Create the state required to render DialogTitle.\n \n The returned state can be modified with hooks such as useDialogTitleStyles_unstable,\n * before being passed to renderDialogTitle_unstable.\n \n @param props - props from this instance of DialogTitle\n * @param ref - reference to root HTMLElement of DialogTitle\n */\nexport const useDialogTitle_unstable = (props: DialogTitleProps, ref: React.Ref<HTMLElement>): DialogTitleState => {\n const { as, action } = props;\n const modalType = useDialogContext_unstable(ctx => ctx.modalType);\n const internalStyles = useDialogTitleInternalStyles();\n\n return {\n components: {\n root: 'div',\n action: 'div',\n },\n root: getNativeElementProps(as ?? 'div', {\n ref,\n id: useDialogContext_unstable(ctx => ctx.dialogTitleId),\n ...props,\n }),\n action: resolveShorthand(action, {\n required: modalType === 'non-modal',\n defaultProps: {\n children: (\n <DialogTrigger disableButtonEnhancement action=\"close\">\n <button\n className={internalStyles.button}\n // TODO: find a better way to add internal labels\n aria-label=\"close\"\n >\n <Dismiss24Regular />\n </button>\n </DialogTrigger>\n ),\n },\n }),\n };\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,2BAA2B;AAEjE,SAASC,yBAAyB,QAAQ,8BAA8B;AACxE,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,SAASC,gBAAgB,QAAQ,2BAA2B;AAC5D,SAASC,aAAa,QAAQ,gCAAgC;AAC9D,SAASC,4BAA4B,QAAQ,wBAAwB;AAErE;;;;;;;;;AASA,OAAO,MAAMC,uBAAuB,GAAGA,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,MAAM;IAAEC,EAAE;IAAEC;EAAM,CAAE,GAAGH,KAAK;EAC5B,MAAMI,SAAS,GAAGV,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACD,SAAS,CAAC;EACjE,MAAME,cAAc,GAAGR,4BAA4B,EAAE;EAErD,OAAO;IACLS,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXL,MAAM,EAAE;KACT;IACDK,IAAI,EAAEf,qBAAqB,CAACS,EAAE,aAAFA,EAAE,cAAFA,EAAE,GAAI,KAAK,EAAE;MACvCD,GAAG;MACHQ,EAAE,EAAEf,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACK,aAAa,CAAC;MACvD,GAAGV;KACJ,CAAC;IACFG,MAAM,EAAEP,gBAAgB,CAACO,MAAM,EAAE;MAC/BQ,QAAQ,EAAEP,SAAS,KAAK,WAAW;MACnCQ,YAAY,EAAE;QACZC,QAAQ,eACNrB,KAAA,CAAAsB,aAAA,CAACjB,aAAa;UAACkB,wBAAwB;UAACZ,MAAM,EAAC;QAAO,gBACpDX,KAAA,CAAAsB,aAAA;UACEE,SAAS,EAAEV,cAAc,CAACW,MAAM;UAAA,cAErB;QAAO,gBAElBzB,KAAA,CAAAsB,aAAA,CAACnB,gBAAgB,OAAG,CACb;;KAIhB;GACF;AACH,CAAC"}

package/lib/components/DialogTitle/useDialogTitleStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~mappings~~":"~~AAAA~~,~~mBAAqBA~~,~~YAAY~~,~~EAAEC~~,~~UAAU~~,~~QAAQ~~,~~gBAAgB;AAGrE~~,~~SAASC~~,~~gBAAgB~~,~~QAAQ~~,~~uBAAuB;AACxD~~,~~SAASC~~,~~sBAAsB~~,~~EAAEC~~,~~eAAe~~,~~QAAQ~~,~~0BAA0B;AAClF~~,~~SAASC~~,~~uBAAuB~~,~~QAAQ~~,~~yBAAyB;AAEjE~~,~~OAAO~~,~~MAAMC~~,~~qBAAqB~~,~~GAAqC;EACrEC~~,~~IAAI~~,~~EAAE~~,~~iBAAiB;EACvBC~~,~~MAAM~~,~~EAAE;CACT;AAED;;;AAGA~~,~~MAAMC~~,~~SAAS~~,~~gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA~~,~~EAWhB;AAEF;;;;AAIA~~,~~OAAO~~,~~MAAMC~~,~~4BAA4B~~,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;AAAA,~~EAiB1C;AAEF;;;AAGA~~,~~OAAO~~,~~MAAMC~~,~~6BAA6B~~,~~GAAIC~~,~~KAAuB~~,~~IAAsB;EACzF~~,~~MAAMC~~,~~MAAM~~,~~GAAGJ~~,~~SAAS~~,~~EAAE;EAC1BG~~,~~KAAK~~,~~CAACL~~,~~IAAI~~,~~CAACO~~,~~SAAS~~,~~GAAGd~~,~~YAAY~~,~~CACjCM~~,~~qBAAqB~~,CAACC,IAAI,EAC1BM,MAAM,CAACN,IAAI,EACX,CAACK,KAAK,CAACJ,MAAM,IAAIK,MAAM,CAACE,sBAAsB,EAC9CH,KAAK,CAACL,IAAI,CAACO,SAAS,CACrB;EACD,IAAIF,KAAK,CAACJ,MAAM,EAAE;IAChBI,KAAK,CAACJ,MAAM,CAACM,SAAS,GAAGd,YAAY,CAACM,qBAAqB,CAACE,MAAM,EAAEK,MAAM,CAACL,MAAM,EAAEI,KAAK,CAACJ,MAAM,CAACM,SAAS,CAAC;;EAE5G,OAAOF,KAAK;AACd,CAAC","~~names~~":["~~mergeClasses~~","~~shorthands~~","~~typographyStyles~~","~~TITLE_ACTION_GRID_AREA~~","~~TITLE_GRID_AREA~~","~~createFocusOutlineStyle~~","~~dialogTitleClassNames~~","~~root~~","~~action~~","~~useStyles~~","~~useDialogTitleInternalStyles~~","useDialogTitleStyles_unstable","state","styles","className"~~,"rootWithoutCloseButton"~~],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTitle/useDialogTitleStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { DialogTitleSlots, DialogTitleState } from './DialogTitle.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\nimport { TITLE_ACTION_GRID_AREA, TITLE_GRID_AREA } from '../../contexts/constants';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\n\nexport const dialogTitleClassNames: SlotClassNames<DialogTitleSlots> = {\n root: 'fui-DialogTitle',\n action: 'fui-DialogTitle__action',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n ...typographyStyles.subtitle1,\n ...shorthands.gridArea(TITLE_GRID_AREA),\n },\n rootWithoutCloseButton: {\n ...shorthands.gridArea(TITLE_GRID_AREA, TITLE_GRID_AREA, TITLE_ACTION_GRID_AREA, TITLE_ACTION_GRID_AREA),\n },\n action: {\n ...shorthands.gridArea(TITLE_ACTION_GRID_AREA),\n },\n});\n\n/\n Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n /\nexport const useDialogTitleInternalStyles = makeStyles({\n button: {\n position: 'relative',\n boxSizing: 'content-box',\n backgroundColor: 'inherit',\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n cursor: 'pointer',\n lineHeight: 0,\n ...shorthands.overflow('visible'),\n ...shorthands.padding(0),\n ...shorthands.borderStyle('none'),\n WebkitAppearance: 'button',\n textAlign: 'unset',\n ...createFocusOutlineStyle(),\n },\n});\n\n/\n Apply styling to the DialogTitle slots based on the state\n */\nexport const useDialogTitleStyles_unstable = (state: DialogTitleState): DialogTitleState => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n dialogTitleClassNames.root,\n styles.root,\n !state.action && styles.rootWithoutCloseButton,\n state.root.className,\n );\n if (state.action) {\n state.action.className = mergeClasses(dialogTitleClassNames.action, styles.action, state.action.className);\n }\n return state;\n};\n"]}
1	+ {"version":3,"names":["__styles","mergeClasses","shorthands","typographyStyles","TITLE_ACTION_GRID_AREA","TITLE_GRID_AREA","createFocusOutlineStyle","dialogTitleClassNames","root","action","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","Ijaq50","Br312pm","nk6f5a","Bw0ie65","rootWithoutCloseButton","d","useDialogTitleInternalStyles","button","qhf8xq","B7ck84d","De3pzq","sj55zd","Bceei9c","B68tc82","Bmxbyg5","z8tnut","z189sj","Byoj8tv","uwmqm3","icvyot","vrafjx","oivjwe","wvpqe5","Bv0vk6g","fsow6f","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","Bf4ptjt","kclons","Bhdgwq3","Blkhhs4","Bqtpl0w","clg4pj","hgwjuy","Bonggc9","B1tsrr9","Dah5zi","Bkh64rk","qqdqy8","B6dhp37","i03rao","Boxcth7","Bsom6fd","J0r882","Bjwuhne","Ghsupd","Bule8hv","f","i","useDialogTitleStyles_unstable","state","styles","className"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTitle/useDialogTitleStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { DialogTitleSlots, DialogTitleState } from './DialogTitle.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { typographyStyles } from '@fluentui/react-theme';\nimport { TITLE_ACTION_GRID_AREA, TITLE_GRID_AREA } from '../../contexts/constants';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\n\nexport const dialogTitleClassNames: SlotClassNames<DialogTitleSlots> = {\n root: 'fui-DialogTitle',\n action: 'fui-DialogTitle__action',\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n ...typographyStyles.subtitle1,\n ...shorthands.gridArea(TITLE_GRID_AREA),\n },\n rootWithoutCloseButton: {\n ...shorthands.gridArea(TITLE_GRID_AREA, TITLE_GRID_AREA, TITLE_ACTION_GRID_AREA, TITLE_ACTION_GRID_AREA),\n },\n action: {\n ...shorthands.gridArea(TITLE_ACTION_GRID_AREA),\n },\n});\n\n/\n Styles to be applied on internal elements used by default action on non-modal Dialog\n * @internal\n /\nexport const useDialogTitleInternalStyles = makeStyles({\n button: {\n position: 'relative',\n boxSizing: 'content-box',\n backgroundColor: 'inherit',\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n cursor: 'pointer',\n lineHeight: 0,\n ...shorthands.overflow('visible'),\n ...shorthands.padding(0),\n ...shorthands.borderStyle('none'),\n WebkitAppearance: 'button',\n textAlign: 'unset',\n ...createFocusOutlineStyle(),\n },\n});\n\n/\n Apply styling to the DialogTitle slots based on the state\n */\nexport const useDialogTitleStyles_unstable = (state: DialogTitleState): DialogTitleState => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n dialogTitleClassNames.root,\n styles.root,\n !state.action && styles.rootWithoutCloseButton,\n state.root.className,\n );\n if (state.action) {\n state.action.className = mergeClasses(dialogTitleClassNames.action, styles.action, state.action.className);\n }\n return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAGrE,SAASC,gBAAgB,QAAQ,uBAAuB;AACxD,SAASC,sBAAsB,EAAEC,eAAe,QAAQ,0BAA0B;AAClF,SAASC,uBAAuB,QAAQ,yBAAyB;AAEjE,OAAO,MAAMC,qBAAqB,GAAqC;EACrEC,IAAI,EAAE,iBAAiB;EACvBC,MAAM,EAAE;CACT;AAED;;;AAGA,MAAMC,SAAS,gBAAGV,QAAA;EAAAQ,IAAA;IAAAG,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,sBAAA;IAAAJ,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAT,MAAA;IAAAM,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAE,CAAA;AAAA,EAWhB;AAEF;;;;AAIA,OAAO,MAAMC,4BAA4B,gBAAGrB,QAAA;EAAAsB,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAf,OAAA;IAAAC,OAAA;IAAAe,OAAA;IAAAb,OAAA;IAAAc,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAjD,CAAA;EAAAkD,CAAA;EAAAC,CAAA;AAAA,EAiB1C;AAEF;;;AAGA,OAAO,MAAMC,6BAA6B,GAAIC,KAAuB,IAAsB;EACzF,MAAMC,MAAM,GAAGhE,SAAS,EAAE;EAC1B+D,KAAK,CAACjE,IAAI,CAACmE,SAAS,GAAG1E,YAAY,CACjCM,qBAAqB,CAACC,IAAI,EAC1BkE,MAAM,CAAClE,IAAI,EACX,CAACiE,KAAK,CAAChE,MAAM,IAAIiE,MAAM,CAACvD,sBAAsB,EAC9CsD,KAAK,CAACjE,IAAI,CAACmE,SAAS,CACrB;EACD,IAAIF,KAAK,CAAChE,MAAM,EAAE;IAChBgE,KAAK,CAAChE,MAAM,CAACkE,SAAS,GAAG1E,YAAY,CAACM,qBAAqB,CAACE,MAAM,EAAEiE,MAAM,CAACjE,MAAM,EAAEgE,KAAK,CAAChE,MAAM,CAACkE,SAAS,CAAC;;EAE5G,OAAOF,KAAK;AACd,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AACA,SAASA,yBAAyB,QAAQ,oBAAoB;AAC9D,SAASC,4BAA4B,QAAQ,uBAAuB;AAIpE;;;;;;;;;;AAUA,OAAO,MAAMC,aAAa,GAAiCC,KAAK,IAAG;EACjE,MAAMC,KAAK,GAAGJ,yBAAyB,CAACG,KAAK,CAAC;EAE9C,OAAOF,4BAA4B,CAACG,KAAK,CAAC;AAC5C,CAAC;AAEDF,aAAa,CAACG,WAAW,GAAG,eAAe;AAC3C;AACCH,aAAwC,CAACI,wBAAwB,GAAG,IAAI","names":["useDialogTrigger_unstable","renderDialogTrigger_unstable","DialogTrigger","props","state","displayName","isFluentTriggerComponent"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTrigger/DialogTrigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogTrigger_unstable } from './useDialogTrigger';\nimport { renderDialogTrigger_unstable } from './renderDialogTrigger';\nimport type { DialogTriggerProps } from './DialogTrigger.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/*\n A non-visual component that wraps its child\n * and configures them to be the trigger that will open or close a `Dialog`.\n * This component should only accept one child.\n \n In case the trigger is used outside `Dialog` component\n * it'll still provide basic ARIA related attributes\n * to it's wrapped child, but it won't be able to alter the dialog `open` state anymore,\n * in that case the user must provide a `controlled state`\n */\nexport const DialogTrigger: React.FC<DialogTriggerProps> = props => {\n const state = useDialogTrigger_unstable(props);\n\n return renderDialogTrigger_unstable(state);\n};\n\nDialogTrigger.displayName = 'DialogTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(DialogTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"]}
1	+ {"version":3,"names":["useDialogTrigger_unstable","renderDialogTrigger_unstable","DialogTrigger","props","state","displayName","isFluentTriggerComponent"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTrigger/DialogTrigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDialogTrigger_unstable } from './useDialogTrigger';\nimport { renderDialogTrigger_unstable } from './renderDialogTrigger';\nimport type { DialogTriggerProps } from './DialogTrigger.types';\nimport type { FluentTriggerComponent } from '@fluentui/react-utilities';\n\n/*\n A non-visual component that wraps its child\n * and configures them to be the trigger that will open or close a `Dialog`.\n * This component should only accept one child.\n \n In case the trigger is used outside `Dialog` component\n * it'll still provide basic ARIA related attributes\n * to it's wrapped child, but it won't be able to alter the dialog `open` state anymore,\n * in that case the user must provide a `controlled state`\n */\nexport const DialogTrigger: React.FC<DialogTriggerProps> = props => {\n const state = useDialogTrigger_unstable(props);\n\n return renderDialogTrigger_unstable(state);\n};\n\nDialogTrigger.displayName = 'DialogTrigger';\n// type casting here is required to ensure internal type FluentTriggerComponent is not leaked\n(DialogTrigger as FluentTriggerComponent).isFluentTriggerComponent = true;\n"],"mappings":"AACA,SAASA,yBAAyB,QAAQ,oBAAoB;AAC9D,SAASC,4BAA4B,QAAQ,uBAAuB;AAIpE;;;;;;;;;;AAUA,OAAO,MAAMC,aAAa,GAAiCC,KAAK,IAAG;EACjE,MAAMC,KAAK,GAAGJ,yBAAyB,CAACG,KAAK,CAAC;EAE9C,OAAOF,4BAA4B,CAACG,KAAK,CAAC;AAC5C,CAAC;AAEDF,aAAa,CAACG,WAAW,GAAG,eAAe;AAC3C;AACCH,aAAwC,CAACI,wBAAwB,GAAG,IAAI"}

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

	@@ -1 +1 @@
1	- {"version":3,"~~mappings":"AAEA;;;;;AAKA,OAAO,MAAMA,4BAA4B,GAAIC,KAAyB,IAAKA,KAAK,CAACC,QAAQ","~~names":["renderDialogTrigger_unstable","state","children"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTrigger/renderDialogTrigger.tsx"],"sourcesContent":["import type { DialogTriggerState } from './DialogTrigger.types';\n\n/*\n Render the final JSX of MenuTrigger\n \n Only renders children\n */\nexport const renderDialogTrigger_unstable = (state: DialogTriggerState) => state.children;\n"]}
1	+ {"version":3,"names":["renderDialogTrigger_unstable","state","children"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTrigger/renderDialogTrigger.tsx"],"sourcesContent":["import type { DialogTriggerState } from './DialogTrigger.types';\n\n/*\n Render the final JSX of MenuTrigger\n \n Only renders children\n */\nexport const renderDialogTrigger_unstable = (state: DialogTriggerState) => state.children;\n"],"mappings":"AAEA;;;;;AAKA,OAAO,MAAMA,4BAA4B,GAAIC,KAAyB,IAAKA,KAAK,CAACC,QAAQ"}

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

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AACA,SAASA,kBAAkB,QAAQ,yBAAyB;AAC5D,SAASC,2BAA2B,EAAEC,eAAe,EAAEC,gBAAgB,QAAQ,2BAA2B;AAE1G,SAASC,yBAAyB,EAAEC,gCAAgC,QAAQ,gBAAgB;AAC5F,SAASC,kBAAkB,QAAQ,sBAAsB;AAEzD;;;;;;AAMA,OAAO,MAAMC,yBAAyB,GAAIC,KAAyB,IAAwB;EACzF,MAAMC,qBAAqB,GAAGJ,gCAAgC,EAAE;EAEhE,MAAM;IAAEK,QAAQ;IAAEC,wBAAwB,GAAG,KAAK;IAAEC,MAAM,GAAGH,qBAAqB,GAAG,OAAO,GAAG;EAAM,CAAE,GAAGD,KAAK;EAE/G,MAAMK,KAAK,GAAGX,eAAe,CAACQ,QAAQ,CAAC;EAEvC,MAAMI,iBAAiB,GAAGV,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACD,iBAAiB,CAAC;EACjF,MAAME,IAAI,GAAGZ,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACC,IAAI,CAAC;EAEvD,MAAM;IAAEC;EAAiB,CAAE,GAAGjB,kBAAkB,EAAE;EAElD,MAAMkB,WAAW,GAAGf,gBAAgB,CACjCgB,KAA+E,IAAI;;IAClF,WAAK,aAALN,KAAK,6BAALA,KAAK,CAAEL,KAAK,EAACY,OAAO,mDAAGD,KAAK,CAAC;IAC7B,IAAI,CAACA,KAAK,CAACE,kBAAkB,EAAE,EAAE;MAC/BP,iBAAiB,CAAC;QAChBK,KAAK;QACLG,IAAI,EAAE,cAAc;QACpBN,IAAI,EAAEJ,MAAM,KAAK;OAClB,CAAC;;EAEN,CAAC,CACF;EAED,MAAMW,iBAAiB,GAAG;IACxB,IAAGV,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEL,KAAK;IACf,eAAe,EAAEQ,IAAI;IACrBQ,GAAG,EAAEX,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEW,GAAG;IACfJ,OAAO,EAAEF,WAAW;IACpB,GAAGD;GACK;EAEV,MAAMQ,2BAA2B,GAAGnB,kBAAkB,CACpD,MAAK,aAALO,KAAK,uBAALA,KAAK,CAAES,IAAI,MAAK,QAAQ,IAAI,MAAK,aAALT,KAAK,uBAALA,KAAK,CAAES,IAAI,MAAK,GAAG,GAAGT,KAAK,CAACS,IAAI,GAAG,KAAK,EACpE;IACE,GAAGC,iBAAiB;IACpBD,IAAI,EAAE;GACP,CACF;EAED,OAAO;IACLZ,QAAQ,EAAET,2BAA2B,CACnCS,QAAQ,EACRC,wBAAwB,GAAGY,iBAAiB,GAAGE,2BAA2B;GAE7E;AACH,CAAC","names":["useModalAttributes","applyTriggerPropsToChildren","getTriggerChild","useEventCallback","useDialogContext_unstable","useDialogSurfaceContext_unstable","useARIAButtonProps","useDialogTrigger_unstable","props","isInsideSurfaceDialog","children","disableButtonEnhancement","action","child","requestOpenChange","ctx","open","triggerAttributes","handleClick","event","onClick","isDefaultPrevented","type","triggerChildProps","ref","ariaButtonTriggerChildProps"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/components/DialogTrigger/useDialogTrigger.ts"],"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"]}
1	+ {"version":3,"names":["useModalAttributes","applyTriggerPropsToChildren","getTriggerChild","useEventCallback","useDialogContext_unstable","useDialogSurfaceContext_unstable","useARIAButtonProps","useDialogTrigger_unstable","props","isInsideSurfaceDialog","children","disableButtonEnhancement","action","child","requestOpenChange","ctx","open","triggerAttributes","handleClick","event","_b","_a","onClick","call","isDefaultPrevented","type","triggerChildProps","ref","ariaButtonTriggerChildProps"],"sources":["../src/packages/react-components/react-dialog/src/components/DialogTrigger/useDialogTrigger.ts"],"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"],"mappings":"AACA,SAASA,kBAAkB,QAAQ,yBAAyB;AAC5D,SAASC,2BAA2B,EAAEC,eAAe,EAAEC,gBAAgB,QAAQ,2BAA2B;AAE1G,SAASC,yBAAyB,EAAEC,gCAAgC,QAAQ,gBAAgB;AAC5F,SAASC,kBAAkB,QAAQ,sBAAsB;AAEzD;;;;;;AAMA,OAAO,MAAMC,yBAAyB,GAAIC,KAAyB,IAAwB;EACzF,MAAMC,qBAAqB,GAAGJ,gCAAgC,EAAE;EAEhE,MAAM;IAAEK,QAAQ;IAAEC,wBAAwB,GAAG,KAAK;IAAEC,MAAM,GAAGH,qBAAqB,GAAG,OAAO,GAAG;EAAM,CAAE,GAAGD,KAAK;EAE/G,MAAMK,KAAK,GAAGX,eAAe,CAACQ,QAAQ,CAAC;EAEvC,MAAMI,iBAAiB,GAAGV,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACD,iBAAiB,CAAC;EACjF,MAAME,IAAI,GAAGZ,yBAAyB,CAACW,GAAG,IAAIA,GAAG,CAACC,IAAI,CAAC;EAEvD,MAAM;IAAEC;EAAiB,CAAE,GAAGjB,kBAAkB,EAAE;EAElD,MAAMkB,WAAW,GAAGf,gBAAgB,CACjCgB,KAA+E,IAAI;;IAClF,CAAAC,EAAA,GAAAP,KAAK,aAALA,KAAK,wBAAAQ,EAAA,GAALR,KAAK,CAAEL,KAAK,EAACc,OAAO,cAAAF,EAAA,uBAAAA,EAAA,CAAAG,IAAA,CAAAF,EAAA,EAAGF,KAAK,CAAC;IAC7B,IAAI,CAACA,KAAK,CAACK,kBAAkB,EAAE,EAAE;MAC/BV,iBAAiB,CAAC;QAChBK,KAAK;QACLM,IAAI,EAAE,cAAc;QACpBT,IAAI,EAAEJ,MAAM,KAAK;OAClB,CAAC;;EAEN,CAAC,CACF;EAED,MAAMc,iBAAiB,GAAG;IACxB,IAAGb,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEL,KAAK;IACf,eAAe,EAAEQ,IAAI;IACrBW,GAAG,EAAEd,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEc,GAAG;IACfL,OAAO,EAAEJ,WAAW;IACpB,GAAGD;GACK;EAEV,MAAMW,2BAA2B,GAAGtB,kBAAkB,CACpD,CAAAO,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEY,IAAI,MAAK,QAAQ,IAAI,CAAAZ,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEY,IAAI,MAAK,GAAG,GAAGZ,KAAK,CAACY,IAAI,GAAG,KAAK,EACpE;IACE,GAAGC,iBAAiB;IACpBD,IAAI,EAAE;GACP,CACF;EAED,OAAO;IACLf,QAAQ,EAAET,2BAA2B,CACnCS,QAAQ,EACRC,wBAAwB,GAAGe,iBAAiB,GAAGE,2BAA2B;GAE7E;AACH,CAAC"}

package/lib/contexts/dialogContext.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { createContext, useContextSelector } from '@fluentui/react-context-selector';
 const defaultContextValue = {
   open: false,
+  inertTrapFocus: false,
   modalType: 'modal',
   isNestedDialog: false,
   dialogRef: {

package/lib/contexts/dialogContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AACA,SAASA,aAAa,EAAmBC,kBAAkB,QAAQ,kCAAkC;AAiBrG,MAAMC,mBAAmB,GAAuB;EAC9CC,IAAI,EAAE,KAAK;EACXC,SAAS,EAAE,OAAO;EAClBC,cAAc,EAAE,KAAK;EACrBC,SAAS,EAAE;IAAEC,OAAO,EAAE;EAAI,CAAE;EAC5BC,iBAAiB;IACf;EAAA;CAEH;AAED;AACA,OAAO,MAAMC,aAAa,gBAA4CT,aAAa,CACjFU,SAAS,CACV;AAED,OAAO,MAAMC,cAAc,GAAGF,aAAa,CAACG,QAAQ;AACpD,OAAO,MAAMC,yBAAyB,GAAOC,QAAgD,IAC3Fb,kBAAkB,CAACQ,aAAa,EAAE,CAACM,GAAG,GAAGb,mBAAmB,KAAKY,QAAQ,CAACC,GAAG,CAAC,CAAC","names":["createContext","useContextSelector","defaultContextValue","open","modalType","isNestedDialog","dialogRef","current","requestOpenChange","DialogContext","undefined","DialogProvider","Provider","useDialogContext_unstable","selector","ctx"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/contexts/dialogContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, ContextSelector, useContextSelector } from '@fluentui/react-context-selector';\nimport { DialogSurfaceElement } from '../DialogSurface';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { DialogModalType, DialogOpenChangeData } from '../Dialog';\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"]}
1	+ {"version":3,"names":["createContext","useContextSelector","defaultContextValue","open","inertTrapFocus","modalType","isNestedDialog","dialogRef","current","requestOpenChange","DialogContext","undefined","DialogProvider","Provider","useDialogContext_unstable","selector","ctx"],"sources":["../src/packages/react-components/react-dialog/src/contexts/dialogContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, ContextSelector, useContextSelector } from '@fluentui/react-context-selector';\nimport { DialogSurfaceElement } from '../DialogSurface';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { DialogModalType, DialogOpenChangeData } from '../Dialog';\n\nexport type DialogContextValue = {\n open: boolean;\n inertTrapFocus: boolean;\n dialogTitleId?: string;\n isNestedDialog: boolean;\n dialogRef: React.Ref<DialogSurfaceElement>;\n modalType: DialogModalType;\n /*\n Requests dialog main component to update it's internal open state\n /\n requestOpenChange: (data: DialogOpenChangeData) => void;\n};\n\nconst defaultContextValue: DialogContextValue = {\n open: false,\n inertTrapFocus: false,\n modalType: 'modal',\n isNestedDialog: false,\n dialogRef: { current: null },\n requestOpenChange() {\n / noop */\n },\n};\n\n// Contexts should default to undefined\nexport const DialogContext: Context<DialogContextValue \| undefined> = createContext<DialogContextValue \| undefined>(\n undefined,\n);\n\nexport const DialogProvider = DialogContext.Provider;\nexport const useDialogContext_unstable = <T>(selector: ContextSelector<DialogContextValue, T>): T =>\n useContextSelector(DialogContext, (ctx = defaultContextValue) => selector(ctx));\n"],"mappings":"AACA,SAASA,aAAa,EAAmBC,kBAAkB,QAAQ,kCAAkC;AAkBrG,MAAMC,mBAAmB,GAAuB;EAC9CC,IAAI,EAAE,KAAK;EACXC,cAAc,EAAE,KAAK;EACrBC,SAAS,EAAE,OAAO;EAClBC,cAAc,EAAE,KAAK;EACrBC,SAAS,EAAE;IAAEC,OAAO,EAAE;EAAI,CAAE;EAC5BC,iBAAiBA,CAAA;IACf;EAAA;CAEH;AAED;AACA,OAAO,MAAMC,aAAa,gBAA4CV,aAAa,CACjFW,SAAS,CACV;AAED,OAAO,MAAMC,cAAc,GAAGF,aAAa,CAACG,QAAQ;AACpD,OAAO,MAAMC,yBAAyB,GAAOC,QAAgD,IAC3Fd,kBAAkB,CAACS,aAAa,EAAE,CAACM,GAAG,GAAGd,mBAAmB,KAAKa,QAAQ,CAACC,GAAG,CAAC,CAAC"}

package/lib/contexts/dialogSurfaceContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,SAASA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AAIjD,MAAMC,mBAAmB,GAA8B,KAAK;AAE5D,OAAO,MAAMC,oBAAoB,gBAAGH,aAAa,CAAwCI,SAAS,CAAC;AAEnG,OAAO,MAAMC,qBAAqB,GAAGF,oBAAoB,CAACG,QAAQ;AAElE,OAAO,MAAMC,gCAAgC,GAAG,MAAK;EAAA;EAAC,uBAAU,CAACJ,oBAAoB,CAAC,mCAAID,mBAAmB;AAAA","names":["createContext","useContext","defaultContextValue","DialogSurfaceContext","undefined","DialogSurfaceProvider","Provider","useDialogSurfaceContext_unstable"],"~~sourceRoot~~"~~:"../src/"~~,"sources":["packages/react-components/react-dialog/src/contexts/dialogSurfaceContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nexport type DialogSurfaceContextValue = boolean;\n\nconst defaultContextValue: DialogSurfaceContextValue = false;\n\nexport const DialogSurfaceContext = createContext<DialogSurfaceContextValue \| undefined>(undefined);\n\nexport const DialogSurfaceProvider = DialogSurfaceContext.Provider;\n\nexport const useDialogSurfaceContext_unstable = () => useContext(DialogSurfaceContext) ?? defaultContextValue;\n"]}
1	+ {"version":3,"names":["createContext","useContext","defaultContextValue","DialogSurfaceContext","undefined","DialogSurfaceProvider","Provider","useDialogSurfaceContext_unstable","_a"],"sources":["../src/packages/react-components/react-dialog/src/contexts/dialogSurfaceContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nexport type DialogSurfaceContextValue = boolean;\n\nconst defaultContextValue: DialogSurfaceContextValue = false;\n\nexport const DialogSurfaceContext = createContext<DialogSurfaceContextValue \| undefined>(undefined);\n\nexport const DialogSurfaceProvider = DialogSurfaceContext.Provider;\n\nexport const useDialogSurfaceContext_unstable = () => useContext(DialogSurfaceContext) ?? defaultContextValue;\n"],"mappings":"AAAA,SAASA,aAAa,EAAEC,UAAU,QAAQ,OAAO;AAIjD,MAAMC,mBAAmB,GAA8B,KAAK;AAE5D,OAAO,MAAMC,oBAAoB,gBAAGH,aAAa,CAAwCI,SAAS,CAAC;AAEnG,OAAO,MAAMC,qBAAqB,GAAGF,oBAAoB,CAACG,QAAQ;AAElE,OAAO,MAAMC,gCAAgC,GAAGA,CAAA,KAAK;EAAA,IAAAC,EAAA;EAAC,QAAAA,EAAA,GAAAP,UAAU,CAACE,oBAAoB,CAAC,cAAAK,EAAA,cAAAA,EAAA,GAAIN,mBAAmB;AAAA"}

package/lib/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,SAASA,MAAM,EAAEC,qBAAqB,EAAEC,kBAAkB,QAAQ,UAAU;AAU5E,SAASC,aAAa,EAAEC,yBAAyB,EAAEC,4BAA4B,QAAQ,iBAAiB;AAQxG,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,iBAAiB;AAQxB,SACEC,UAAU,EACVC,oBAAoB,EACpBC,sBAAsB,EACtBC,4BAA4B,EAC5BC,yBAAyB,QACpB,cAAc;AAGrB,SACEC,WAAW,EACXC,qBAAqB,EACrBC,uBAAuB,EACvBC,6BAA6B,EAC7BC,0BAA0B,QACrB,eAAe;AAGtB,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,iBAAiB;AAGxB,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,iBAAiB","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","renderDialogSurface_unstable","DialogContent","dialogContentClassNames","useDialogContent_unstable","useDialogContentStyles_unstable","renderDialogContent_unstable"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/index.ts"],"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"]}
1	+ {"version":3,"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","renderDialogSurface_unstable","DialogContent","dialogContentClassNames","useDialogContent_unstable","useDialogContentStyles_unstable","renderDialogContent_unstable"],"sources":["../src/packages/react-components/react-dialog/src/index.ts"],"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"],"mappings":"AAAA,SAASA,MAAM,EAAEC,qBAAqB,EAAEC,kBAAkB,QAAQ,UAAU;AAU5E,SAASC,aAAa,EAAEC,yBAAyB,EAAEC,4BAA4B,QAAQ,iBAAiB;AAQxG,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,iBAAiB;AAQxB,SACEC,UAAU,EACVC,oBAAoB,EACpBC,sBAAsB,EACtBC,4BAA4B,EAC5BC,yBAAyB,QACpB,cAAc;AAGrB,SACEC,WAAW,EACXC,qBAAqB,EACrBC,uBAAuB,EACvBC,6BAA6B,EAC7BC,0BAA0B,QACrB,eAAe;AAGtB,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,iBAAiB;AAGxB,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,iBAAiB"}

package/lib/utils/isEscapeKeyDown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~mappings":"AACA,SAASA,MAAM,QAAQ,yBAAyB;AAIhD;;;AAGA,OAAM,SAAUC,kBAAkB,CAChCC,KAAgD,EAChDC,SAA0B;EAE1B,OAAOD,KAAK,CAACE,GAAG,KAAKJ,MAAM,IAAIG,SAAS,KAAK,OAAO,IAAI,CAACD,KAAK,CAACG,kBAAkB,EAAE;AACrF","~~names":["Escape","isEscapeKeyDismiss","event","modalType","key","isDefaultPrevented"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/utils/isEscapeKeyDown.ts"],"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"]}
1	+ {"version":3,"names":["Escape","isEscapeKeyDismiss","event","modalType","key","isDefaultPrevented"],"sources":["../src/packages/react-components/react-dialog/src/utils/isEscapeKeyDown.ts"],"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"],"mappings":"AACA,SAASA,MAAM,QAAQ,yBAAyB;AAIhD;;;AAGA,OAAM,SAAUC,kBAAkBA,CAChCC,KAAgD,EAChDC,SAA0B;EAE1B,OAAOD,KAAK,CAACE,GAAG,KAAKJ,MAAM,IAAIG,SAAS,KAAK,OAAO,IAAI,CAACD,KAAK,CAACG,kBAAkB,EAAE;AACrF"}

package/lib/utils/useDisableBodyScroll.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,SAASA,kBAAkB,QAAQ,iCAAiC;AACpE,SAASC,WAAW,QAAQ,OAAO;AAEnC,MAAMC,wBAAwB,GAAG,8BAAuC;AAUxE;;;AAGA,OAAM,SAAUC,oBAAoB;EAClC,MAAM;IAAEC;EAAc,CAAE,GAAGJ,kBAAkB,EAAE;EAC/C,OAAOC,WAAW,CAAC,MAAK;IACtB,IAAIG,cAAc,EAAE;MAClB,OAAOC,aAAa,CAACD,cAAc,CAACE,IAAI,CAAC;;EAE7C,CAAC,EAAE,CAACF,cAAc,CAAC,CAAC;AACtB;AAEA;;;;;AAKA,OAAM,SAAUC,aAAa,CAACE,MAAmB;;EAC/C,MAAM;IAAEC;EAAW,CAAE,GAAGD,MAAM,CAACE,aAAa,CAACC,eAAe;EAC5D,MAAMC,UAAU,GAAG,kBAAM,CAACF,aAAa,CAACG,WAAW,0CAAED,UAAU,mCAAI,CAAC;EACpEE,4BAA4B,CAACN,MAAM,CAAC;EACpC,IAAIA,MAAM,CAACL,wBAAwB,CAAC,CAACY,KAAK,KAAK,CAAC,EAAE;IAChDP,MAAM,CAACQ,KAAK,CAACC,QAAQ,GAAG,QAAQ;IAChCT,MAAM,CAACQ,KAAK,CAACE,YAAY,GAAG,GAAGN,UAAU,GAAGH,WAAW,IAAI;;EAE7DD,MAAM,CAACL,wBAAwB,CAAC,CAACY,KAAK,EAAE;EACxC,OAAO,MAAK;IACVP,MAAM,CAACL,wBAAwB,CAAC,CAACY,KAAK,EAAE;IACxC,IAAIP,MAAM,CAACL,wBAAwB,CAAC,CAACY,KAAK,KAAK,CAAC,EAAE;MAChDP,MAAM,CAACQ,KAAK,CAACC,QAAQ,GAAGT,MAAM,CAACL,wBAAwB,CAAC,CAACgB,qBAAqB;MAC9EX,MAAM,CAACQ,KAAK,CAACE,YAAY,GAAGV,MAAM,CAACL,wBAAwB,CAAC,CAACiB,yBAAyB;;EAE1F,CAAC;AACH;AAEA,SAASN,4BAA4B,CAACO,OAAoB;;;EACxD,YAACA,OAAsC,EAAClB,wBAAwB,uCAAxBA,wBAAwB,IAAM;IACpEY,KAAK,EAAE,CAAC;IACRI,qBAAqB,EAAEE,OAAO,CAACL,KAAK,CAACC,QAAQ;IAC7CG,yBAAyB,EAAEC,OAAO,CAACL,KAAK,CAACE;GAC1C;AACH","names":["useFluent_unstable","useCallback","disableScrollElementProp","useDisableBodyScroll","targetDocument","disableScroll","body","target","clientWidth","ownerDocument","documentElement","innerWidth","defaultView","assertIsDisableScrollElement","count","style","overflow","paddingRight","previousOverflowStyle","previousPaddingRightStyle","element"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/utils/useDisableBodyScroll.ts"],"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"]}
1	+ {"version":3,"names":["useFluent_unstable","useCallback","disableScrollElementProp","useDisableBodyScroll","targetDocument","disableScroll","body","target","clientWidth","ownerDocument","documentElement","innerWidth","_b","_a","defaultView","assertIsDisableScrollElement","count","style","overflow","paddingRight","previousOverflowStyle","previousPaddingRightStyle","element"],"sources":["../src/packages/react-components/react-dialog/src/utils/useDisableBodyScroll.ts"],"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"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,iCAAiC;AACpE,SAASC,WAAW,QAAQ,OAAO;AAEnC,MAAMC,wBAAwB,GAAG,8BAAuC;AAUxE;;;AAGA,OAAM,SAAUC,oBAAoBA,CAAA;EAClC,MAAM;IAAEC;EAAc,CAAE,GAAGJ,kBAAkB,EAAE;EAC/C,OAAOC,WAAW,CAAC,MAAK;IACtB,IAAIG,cAAc,EAAE;MAClB,OAAOC,aAAa,CAACD,cAAc,CAACE,IAAI,CAAC;;EAE7C,CAAC,EAAE,CAACF,cAAc,CAAC,CAAC;AACtB;AAEA;;;;;AAKA,OAAM,SAAUC,aAAaA,CAACE,MAAmB;;EAC/C,MAAM;IAAEC;EAAW,CAAE,GAAGD,MAAM,CAACE,aAAa,CAACC,eAAe;EAC5D,MAAMC,UAAU,GAAG,CAAAC,EAAA,IAAAC,EAAA,GAAAN,MAAM,CAACE,aAAa,CAACK,WAAW,cAAAD,EAAA,uBAAAA,EAAA,CAAEF,UAAU,cAAAC,EAAA,cAAAA,EAAA,GAAI,CAAC;EACpEG,4BAA4B,CAACR,MAAM,CAAC;EACpC,IAAIA,MAAM,CAACL,wBAAwB,CAAC,CAACc,KAAK,KAAK,CAAC,EAAE;IAChDT,MAAM,CAACU,KAAK,CAACC,QAAQ,GAAG,QAAQ;IAChCX,MAAM,CAACU,KAAK,CAACE,YAAY,GAAG,GAAGR,UAAU,GAAGH,WAAW,IAAI;;EAE7DD,MAAM,CAACL,wBAAwB,CAAC,CAACc,KAAK,EAAE;EACxC,OAAO,MAAK;IACVT,MAAM,CAACL,wBAAwB,CAAC,CAACc,KAAK,EAAE;IACxC,IAAIT,MAAM,CAACL,wBAAwB,CAAC,CAACc,KAAK,KAAK,CAAC,EAAE;MAChDT,MAAM,CAACU,KAAK,CAACC,QAAQ,GAAGX,MAAM,CAACL,wBAAwB,CAAC,CAACkB,qBAAqB;MAC9Eb,MAAM,CAACU,KAAK,CAACE,YAAY,GAAGZ,MAAM,CAACL,wBAAwB,CAAC,CAACmB,yBAAyB;;EAE1F,CAAC;AACH;AAEA,SAASN,4BAA4BA,CAACO,OAAoB;;;EACxD,CAAAT,EAAA,IAAAD,EAAA,GAACU,OAAsC,EAACpB,wBAAwB,eAAAW,EAAA,cAAAA,EAAA,GAAAD,EAAA,CAAxBV,wBAAwB,IAAM;IACpEc,KAAK,EAAE,CAAC;IACRI,qBAAqB,EAAEE,OAAO,CAACL,KAAK,CAACC,QAAQ;IAC7CG,yBAAyB,EAAEC,OAAO,CAACL,KAAK,CAACE;GAC1C;AACH"}

package/lib/utils/useFocusFirstElement.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe,QAAQ,yBAAyB;AACzD,SAASC,kBAAkB,QAAQ,iCAAiC;AAIpE;;;AAGA,OAAM,SAAUC,oBAAoB,CAACC,IAAa,EAAEC,SAA0B;EAC5E,MAAM;IAAEC;EAAkB,CAAE,GAAGL,eAAe,EAAE;EAChD,MAAM;IAAEM;EAAc,CAAE,GAAGL,kBAAkB,EAAE;EAC/C,MAAMM,SAAS,GAAGR,KAAK,CAACS,MAAM,CAAuB,IAAI,CAAC;EAC1D,MAAMC,UAAU,GAAGV,KAAK,CAACS,MAAM,EAAe;EAE9CT,KAAK,CAACW,SAAS,CAAC,MAAK;;IACnB,IAAI,CAACP,IAAI,EAAE;MACT,OAAO,gBAAU,CAACQ,OAAO,0CAAEC,KAAK,EAAE;;IAEpCH,UAAU,CAACE,OAAO,GAAGL,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEO,aAAwC;IAC7E,MAAMC,OAAO,GAAGP,SAAS,CAACI,OAAO,IAAIN,kBAAkB,CAACE,SAAS,CAACI,OAAO,CAAC;IAC1E,IAAIG,OAAO,EAAE;MACXA,OAAO,CAACF,KAAK,EAAE;KAChB,MAAM;MACL,eAAS,CAACD,OAAO,0CAAEC,KAAK,EAAE,CAAC,CAAC;MAC5B,IAAIG,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,EAAE;QACzC;QACAC,OAAO,CAACC,IAAI,CACV,CACE,mGAAmG,EACnG,kGAAkG,CACnG,CAACC,IAAI,CAAC,IAAI,CAAC,CACb;;;EAGP,CAAC,EAAE,CAACf,kBAAkB,EAAEF,IAAI,EAAEC,SAAS,EAAEE,cAAc,CAAC,CAAC;EAEzD,OAAOC,SAAS;AAClB","names":["React","useFocusFinders","useFluent_unstable","useFocusFirstElement","open","modalType","findFirstFocusable","targetDocument","dialogRef","useRef","triggerRef","useEffect","current","focus","activeElement","element","process","env","NODE_ENV","console","warn","join"],"~~sourceRoot~~":"../src/~~","sources":["~~packages/react-components/react-dialog/src/utils/useFocusFirstElement.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface';\nimport type { DialogModalType } from '../Dialog';\n\n/*\n Focus first element on content when dialog is opened,\n */\nexport function useFocusFirstElement(open: boolean, modalType: DialogModalType) {\n const { findFirstFocusable } = useFocusFinders();\n const { targetDocument } = useFluent_unstable();\n const dialogRef = React.useRef<DialogSurfaceElement>(null);\n 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"]}
1	+ {"version":3,"names":["React","useFocusFinders","useFluent_unstable","useFocusFirstElement","open","modalType","findFirstFocusable","targetDocument","dialogRef","useRef","triggerRef","useEffect","_a","current","focus","activeElement","element","_b","process","env","NODE_ENV","console","warn","join"],"sources":["../src/packages/react-components/react-dialog/src/utils/useFocusFirstElement.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface';\nimport type { DialogModalType } from '../Dialog';\n\n/*\n Focus first element on content when dialog is opened,\n */\nexport function useFocusFirstElement(open: boolean, modalType: DialogModalType) {\n const { findFirstFocusable } = useFocusFinders();\n const { targetDocument } = useFluent_unstable();\n const dialogRef = React.useRef<DialogSurfaceElement>(null);\n 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"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe,QAAQ,yBAAyB;AACzD,SAASC,kBAAkB,QAAQ,iCAAiC;AAIpE;;;AAGA,OAAM,SAAUC,oBAAoBA,CAACC,IAAa,EAAEC,SAA0B;EAC5E,MAAM;IAAEC;EAAkB,CAAE,GAAGL,eAAe,EAAE;EAChD,MAAM;IAAEM;EAAc,CAAE,GAAGL,kBAAkB,EAAE;EAC/C,MAAMM,SAAS,GAAGR,KAAK,CAACS,MAAM,CAAuB,IAAI,CAAC;EAC1D,MAAMC,UAAU,GAAGV,KAAK,CAACS,MAAM,EAAe;EAE9CT,KAAK,CAACW,SAAS,CAAC,MAAK;;IACnB,IAAI,CAACP,IAAI,EAAE;MACT,OAAO,CAAAQ,EAAA,GAAAF,UAAU,CAACG,OAAO,cAAAD,EAAA,uBAAAA,EAAA,CAAEE,KAAK,EAAE;;IAEpCJ,UAAU,CAACG,OAAO,GAAGN,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEQ,aAAwC;IAC7E,MAAMC,OAAO,GAAGR,SAAS,CAACK,OAAO,IAAIP,kBAAkB,CAACE,SAAS,CAACK,OAAO,CAAC;IAC1E,IAAIG,OAAO,EAAE;MACXA,OAAO,CAACF,KAAK,EAAE;KAChB,MAAM;MACL,CAAAG,EAAA,GAAAT,SAAS,CAACK,OAAO,cAAAI,EAAA,uBAAAA,EAAA,CAAEH,KAAK,EAAE,CAAC,CAAC;MAC5B,IAAII,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,EAAE;QACzC;QACAC,OAAO,CAACC,IAAI,CACV,CACE,mGAAmG,EACnG,kGAAkG,CACnG,CAACC,IAAI,CAAC,IAAI,CAAC,CACb;;;EAGP,CAAC,EAAE,CAACjB,kBAAkB,EAAEF,IAAI,EAAEC,SAAS,EAAEE,cAAc,CAAC,CAAC;EAEzD,OAAOC,SAAS;AAClB"}

package/lib-amd/components/Dialog/Dialog.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/Dialog/Dialog.types.ts"],"names":[],"mappings":"","sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { DialogContextValue, DialogSurfaceContextValue } from '../../contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface/DialogSurface.types';\n\nexport type DialogSlots = {};\n\nexport type DialogOpenChangeEvent = DialogOpenChangeData['event'];\n\nexport type DialogOpenChangeData =\n \| {\n type: 'escapeKeyDown';\n open: boolean;\n event: React.KeyboardEvent<DialogSurfaceElement>;\n }\n \| {\n type: 'backdropClick';\n open: boolean;\n event: React.MouseEvent<DialogSurfaceElement>;\n }\n \| {\n type: 'triggerClick';\n open: boolean;\n event: React.MouseEvent<DialogSurfaceElement>;\n };\n\nexport type DialogModalType = 'modal' \| 'non-modal' \| 'alert';\n\n/*\n Callback fired when the component changes value from open state.\n \n @param event - a React's Synthetic event or a KeyboardEvent in case of `documentEscapeKeyDown`\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event\n /\nexport type DialogOpenChangeEventHandler = (event: DialogOpenChangeEvent, data: DialogOpenChangeData) => void;\n\nexport type DialogContextValues = {\n dialog: DialogContextValue;\n /\n dialogSurface context is provided by Dialog as false\n * to ensure components inside Dialog but outside DialogSurface will consume this as false\n /\n dialogSurface: DialogSurfaceContextValue;\n};\n\nexport type DialogProps = ComponentProps<Partial<DialogSlots>> & {\n /\n Dialog variations.\n \n `modal`: When this type of dialog is open, the rest of the page is dimmed out and cannot be interacted with.\n * The tab sequence is kept within the dialog and moving the focus outside\n * the dialog will imply closing it. This is the default type of the component.\n \n `non-modal`: When a non-modal dialog is open, the rest of the page is not dimmed out\n * and users can interact with the rest of the page.\n * This also implies that the tab focus can move outside the dialog when it reaches the last focusable element.\n \n `alert`: is a special type of modal dialogs that interrupts the user's workflow\n * to communicate an important message or ask for a decision.\n * Unlike a typical modal dialog, the user must take an action through the options given to dismiss the dialog,\n * and it cannot be dismissed through the dimmed background or escape key.\n \n @default modal\n /\n modalType?: DialogModalType;\n /\n Controls the open state of the dialog\n * @default false\n /\n open?: boolean;\n /\n Default value for the uncontrolled open state of the dialog.\n * @default false\n /\n defaultOpen?: boolean;\n /\n Callback fired when the component changes value from open state.\n \n @param event - a React's Synthetic event or a KeyboardEvent in case of `documentEscapeKeyDown`\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event\n /\n onOpenChange?: DialogOpenChangeEventHandler;\n /\n Can contain two children including {@link DialogTrigger} and {@link DialogSurface}.\n * Alternatively can only contain {@link DialogSurface} if using trigger outside dialog, or controlling state.\n */\n children: [JSX.Element, JSX.Element] \| JSX.Element;\n};\n\nexport type DialogState = ComponentState<DialogSlots> &\n DialogContextValue & {\n content: React.ReactNode;\n trigger: React.ReactNode;\n };\n"]}
1	+ {"version":3,"file":"Dialog.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/Dialog/Dialog.types.ts"],"names":[],"mappings":"","sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { DialogContextValue, DialogSurfaceContextValue } from '../../contexts';\nimport type { DialogSurfaceElement } from '../DialogSurface/DialogSurface.types';\n\nexport type DialogSlots = {};\n\nexport type DialogOpenChangeEvent = DialogOpenChangeData['event'];\n\nexport type DialogOpenChangeData =\n \| {\n type: 'escapeKeyDown';\n open: boolean;\n event: React.KeyboardEvent<DialogSurfaceElement>;\n }\n \| {\n type: 'backdropClick';\n open: boolean;\n event: React.MouseEvent<DialogSurfaceElement>;\n }\n \| {\n type: 'triggerClick';\n open: boolean;\n event: React.MouseEvent<DialogSurfaceElement>;\n };\n\nexport type DialogModalType = 'modal' \| 'non-modal' \| 'alert';\n\n/*\n Callback fired when the component changes value from open state.\n \n @param event - a React's Synthetic event or a KeyboardEvent in case of `documentEscapeKeyDown`\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event\n /\nexport type DialogOpenChangeEventHandler = (event: DialogOpenChangeEvent, data: DialogOpenChangeData) => void;\n\nexport type DialogContextValues = {\n dialog: DialogContextValue;\n /\n dialogSurface context is provided by Dialog as false\n * to ensure components inside Dialog but outside DialogSurface will consume this as false\n /\n dialogSurface: DialogSurfaceContextValue;\n};\n\nexport type DialogProps = ComponentProps<Partial<DialogSlots>> & {\n /\n Dialog variations.\n \n `modal`: When this type of dialog is open, the rest of the page is dimmed out and cannot be interacted with.\n * The tab sequence is kept within the dialog and moving the focus outside\n * the dialog will imply closing it. This is the default type of the component.\n \n `non-modal`: When a non-modal dialog is open, the rest of the page is not dimmed out\n * and users can interact with the rest of the page.\n * This also implies that the tab focus can move outside the dialog when it reaches the last focusable element.\n \n `alert`: is a special type of modal dialogs that interrupts the user's workflow\n * to communicate an important message or ask for a decision.\n * Unlike a typical modal dialog, the user must take an action through the options given to dismiss the dialog,\n * and it cannot be dismissed through the dimmed background or escape key.\n \n @default modal\n /\n modalType?: DialogModalType;\n /\n Controls the open state of the dialog\n * @default false\n /\n open?: boolean;\n /\n Default value for the uncontrolled open state of the dialog.\n * @default false\n /\n defaultOpen?: boolean;\n /\n Callback fired when the component changes value from open state.\n \n @param event - a React's Synthetic event or a KeyboardEvent in case of `documentEscapeKeyDown`\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event\n /\n onOpenChange?: DialogOpenChangeEventHandler;\n /\n Can contain two children including {@link DialogTrigger} and {@link DialogSurface}.\n * Alternatively can only contain {@link DialogSurface} if using trigger outside dialog, or controlling state.\n /\n children: [JSX.Element, JSX.Element] \| JSX.Element;\n /\n Enables standard behavior according to the [HTML dialog spec](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/showModal)\n * where the focus trap involves setting outside elements inert.\n \n @default false\n */\n inertTrapFocus?: boolean;\n};\n\nexport type DialogState = ComponentState<DialogSlots> &\n DialogContextValue & {\n content: React.ReactNode;\n trigger: React.ReactNode;\n };\n"]}

package/lib-amd/components/Dialog/useDialog.js CHANGED Viewed

@@ -11,13 +11,13 @@ define(["require", "exports", "react", "@fluentui/react-utilities", "@fluentui/r
      * @param props - props from this instance of Dialog
      */
     var useDialog_unstable = function (props) {
-        var children = props.children, _a = props.modalType, modalType = _a === void 0 ? 'modal' : _a, onOpenChange = props.onOpenChange;
-        var _b = childrenToTriggerAndContent(children), trigger = _b[0], content = _b[1];
-        var _c = react_utilities_1.useControllableState({
+        var children = props.children, _a = props.modalType, modalType = _a === void 0 ? 'modal' : _a, onOpenChange = props.onOpenChange, _b = props.inertTrapFocus, inertTrapFocus = _b === void 0 ? false : _b;
+        var _c = childrenToTriggerAndContent(children), trigger = _c[0], content = _c[1];
+        var _d = react_utilities_1.useControllableState({
             state: props.open,
             defaultState: props.defaultOpen,
             initialState: false,
-        }), open = _c[0], setOpen = _c[1];
+        }), open = _d[0], setOpen = _d[1];
         var requestOpenChange = react_utilities_1.useEventCallback(function (data) {
             onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(data.event, data);
             // if user prevents default then do not change state value
@@ -38,6 +38,7 @@ define(["require", "exports", "react", "@fluentui/react-utilities", "@fluentui/r
             components: {
                 backdrop: 'div',
             },
+            inertTrapFocus: inertTrapFocus,
             open: open,
             modalType: modalType,
             content: open ? content : null,

package/lib-amd/components/Dialog/useDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDialog.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/Dialog/useDialog.ts"],"names":[],"mappings":";;;;IAQA;;;;;;;OAOG;IACI,IAAM,kBAAkB,GAAG,UAAC,KAAkB;QAC3C,IAAA,QAAQ,~~GAAwC~~,KAAK,~~SAA7C~~,EAAE,~~KAAsC~~,KAAK,~~UAAxB~~,EAAnB,SAAS,mBAAG,OAAO,KAAA,EAAE,YAAY,~~GAAK~~,KAAK,~~aAAV~~,CAAW;~~QAExD~~,IAAA,KAAqB,2BAA2B,CAAC,QAAQ,CAAC,EAAzD,OAAO,QAAA,EAAE,OAAO,QAAyC,CAAC;QAE3D,IAAA,KAAkB,sCAAoB,CAAC;YAC3C,KAAK,EAAE,KAAK,CAAC,IAAI;YACjB,YAAY,EAAE,KAAK,CAAC,WAAW;YAC/B,YAAY,EAAE,KAAK;SACpB,CAAC,EAJK,IAAI,QAAA,EAAE,OAAO,QAIlB,CAAC;QAEH,IAAM,iBAAiB,GAAG,kCAAgB,CAAC,UAAC,IAA0B;YACpE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YAEjC,0DAA0D;YAC1D,6FAA6F;YAC7F,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,EAAE,EAAE;gBACpC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aACpB;QACH,CAAC,CAAC,CAAC;QAEH,IAAM,QAAQ,GAAG,4BAAoB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;QACvD,IAAM,iBAAiB,GAAG,4BAAoB,EAAE,CAAC;QACjD,IAAM,kBAAkB,GAAG,OAAO,CAAC,IAAI,IAAI,SAAS,KAAK,WAAW,CAAC,CAAC;QAEtE,2CAAyB,CAAC;YACxB,IAAI,kBAAkB,EAAE;gBACtB,OAAO,iBAAiB,EAAE,CAAC;aAC5B;QACH,CAAC,EAAE,CAAC,iBAAiB,EAAE,kBAAkB,CAAC,CAAC,CAAC;QAE5C,OAAO;YACL,UAAU,EAAE;gBACV,QAAQ,EAAE,KAAK;aAChB;YACD,IAAI,MAAA;YACJ,SAAS,WAAA;YACT,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI;YAC9B,OAAO,SAAA;YACP,iBAAiB,mBAAA;YACjB,aAAa,EAAE,uBAAK,CAAC,eAAe,CAAC;YACrC,cAAc,EAAE,4CAAmB,CAAC,wBAAa,CAAC;YAClD,SAAS,EAAE,QAAQ;SACpB,CAAC;IACJ,CAAC,CAAC;~~IA5CW~~,QAAA,kBAAkB,~~sBA4C7B~~;IAEF;;OAEG;IACH,SAAS,2BAA2B,CAClC,QAAyB;QAEzB,IAAM,aAAa,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAyB,CAAC;QAC/E,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;YACzC,IAAI,aAAa,CAAC,MAAM,KAAK,CAAC,IAAI,aAAa,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC5D,sCAAsC;gBACtC,OAAO,CAAC,IAAI,CACV,4DAA4D;oBAC1D,4EAA4E,CAC/E,CAAC;aACH;SACF;QACD,QAAQ,aAAa,CAAC,MAAM,EAAE;YAC5B,mDAAmD;YACnD,KAAK,CAAC;gBACJ,OAAO,aAAqE,CAAC;YAC/E,kCAAkC;YAClC,KAAK,CAAC;gBACJ,OAAO,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;YACvC,eAAe;YACf;gBACE,OAAO,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;SACjC;IACH,CAAC","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"]}
1	+ {"version":3,"file":"useDialog.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/Dialog/useDialog.ts"],"names":[],"mappings":";;;;IAQA;;;;;;;OAOG;IACI,IAAM,kBAAkB,GAAG,UAAC,KAAkB;QAC3C,IAAA,QAAQ,GAAgE,KAAK,SAArE,EAAE,KAA8D,KAAK,UAAhD,EAAnB,SAAS,mBAAG,OAAO,KAAA,EAAE,YAAY,GAA6B,KAAK,aAAlC,EAAE,KAA2B,KAAK,eAAV,EAAtB,cAAc,mBAAG,KAAK,KAAA,CAAW;QAEhF,IAAA,KAAqB,2BAA2B,CAAC,QAAQ,CAAC,EAAzD,OAAO,QAAA,EAAE,OAAO,QAAyC,CAAC;QAE3D,IAAA,KAAkB,sCAAoB,CAAC;YAC3C,KAAK,EAAE,KAAK,CAAC,IAAI;YACjB,YAAY,EAAE,KAAK,CAAC,WAAW;YAC/B,YAAY,EAAE,KAAK;SACpB,CAAC,EAJK,IAAI,QAAA,EAAE,OAAO,QAIlB,CAAC;QAEH,IAAM,iBAAiB,GAAG,kCAAgB,CAAC,UAAC,IAA0B;YACpE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YAEjC,0DAA0D;YAC1D,6FAA6F;YAC7F,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,kBAAkB,EAAE,EAAE;gBACpC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aACpB;QACH,CAAC,CAAC,CAAC;QAEH,IAAM,QAAQ,GAAG,4BAAoB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;QACvD,IAAM,iBAAiB,GAAG,4BAAoB,EAAE,CAAC;QACjD,IAAM,kBAAkB,GAAG,OAAO,CAAC,IAAI,IAAI,SAAS,KAAK,WAAW,CAAC,CAAC;QAEtE,2CAAyB,CAAC;YACxB,IAAI,kBAAkB,EAAE;gBACtB,OAAO,iBAAiB,EAAE,CAAC;aAC5B;QACH,CAAC,EAAE,CAAC,iBAAiB,EAAE,kBAAkB,CAAC,CAAC,CAAC;QAE5C,OAAO;YACL,UAAU,EAAE;gBACV,QAAQ,EAAE,KAAK;aAChB;YACD,cAAc,gBAAA;YACd,IAAI,MAAA;YACJ,SAAS,WAAA;YACT,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI;YAC9B,OAAO,SAAA;YACP,iBAAiB,mBAAA;YACjB,aAAa,EAAE,uBAAK,CAAC,eAAe,CAAC;YACrC,cAAc,EAAE,4CAAmB,CAAC,wBAAa,CAAC;YAClD,SAAS,EAAE,QAAQ;SACpB,CAAC;IACJ,CAAC,CAAC;IA7CW,QAAA,kBAAkB,sBA6C7B;IAEF;;OAEG;IACH,SAAS,2BAA2B,CAClC,QAAyB;QAEzB,IAAM,aAAa,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAyB,CAAC;QAC/E,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;YACzC,IAAI,aAAa,CAAC,MAAM,KAAK,CAAC,IAAI,aAAa,CAAC,MAAM,KAAK,CAAC,EAAE;gBAC5D,sCAAsC;gBACtC,OAAO,CAAC,IAAI,CACV,4DAA4D;oBAC1D,4EAA4E,CAC/E,CAAC;aACH;SACF;QACD,QAAQ,aAAa,CAAC,MAAM,EAAE;YAC5B,mDAAmD;YACnD,KAAK,CAAC;gBACJ,OAAO,aAAqE,CAAC;YAC/E,kCAAkC;YAClC,KAAK,CAAC;gBACJ,OAAO,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;YACvC,eAAe;YACf;gBACE,OAAO,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;SACjC;IACH,CAAC","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, inertTrapFocus = false } = props;\n\n const [trigger, content] = childrenToTriggerAndContent(children);\n\n const [open, setOpen] = useControllableState({\n state: props.open,\n defaultState: props.defaultOpen,\n initialState: false,\n });\n\n const requestOpenChange = useEventCallback((data: DialogOpenChangeData) => {\n onOpenChange?.(data.event, data);\n\n // if user prevents default then do not change state value\n // otherwise updates state value and trigger reference to the element that caused the opening\n if (!data.event.isDefaultPrevented()) {\n setOpen(data.open);\n }\n });\n\n const focusRef = useFocusFirstElement(open, modalType);\n 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 inertTrapFocus,\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"]}

package/lib-amd/components/Dialog/useDialogContextValues.js CHANGED Viewed

@@ -3,7 +3,7 @@ define(["require", "exports"], function (require, exports) {
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.useDialogContextValues_unstable = void 0;
     function useDialogContextValues_unstable(state) {
-        var modalType = state.modalType, open = state.open, dialogRef = state.dialogRef, dialogTitleId = state.dialogTitleId, isNestedDialog = state.isNestedDialog, requestOpenChange = state.requestOpenChange;
+        var modalType = state.modalType, open = state.open, dialogRef = state.dialogRef, dialogTitleId = state.dialogTitleId, isNestedDialog = state.isNestedDialog, inertTrapFocus = state.inertTrapFocus, requestOpenChange = state.requestOpenChange;
         /**
          * This context is created with "@fluentui/react-context-selector",
          * there is no sense to memoize it
@@ -14,6 +14,7 @@ define(["require", "exports"], function (require, exports) {
             dialogRef: dialogRef,
             dialogTitleId: dialogTitleId,
             isNestedDialog: isNestedDialog,
+            inertTrapFocus: inertTrapFocus,
             requestOpenChange: requestOpenChange,
         };
         var dialogSurface = false;

package/lib-amd/components/Dialog/useDialogContextValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDialogContextValues.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/Dialog/useDialogContextValues.ts"],"names":[],"mappings":";;;;IAGA,SAAgB,+BAA+B,CAAC,KAAkB;QACxD,IAAA,SAAS,~~GAAwE~~,KAAK,~~UAA7E~~,EAAE,IAAI,~~GAAkE~~,KAAK,~~KAAvE~~,EAAE,SAAS,~~GAAuD~~,KAAK,~~UAA5D~~,EAAE,aAAa,GAAwC,KAAK,~~cAA7C~~,EAAE,cAAc,GAAwB,KAAK,eAA7B,EAAE,iBAAiB,GAAK,KAAK,kBAAV,CAAW;QAE/F;;;WAGG;QACH,IAAM,MAAM,GAAuB;YACjC,IAAI,MAAA;YACJ,SAAS,WAAA;YACT,SAAS,WAAA;YACT,aAAa,eAAA;YACb,cAAc,gBAAA;YACd,iBAAiB,mBAAA;SAClB,CAAC;QAEF,IAAM,aAAa,GAA8B,KAAK,CAAC;QAEvD,OAAO,EAAE,MAAM,QAAA,EAAE,aAAa,eAAA,EAAE,CAAC;IACnC,CAAC;~~IAnBD~~,~~0EAmBC~~","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"]}
1	+ {"version":3,"file":"useDialogContextValues.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/Dialog/useDialogContextValues.ts"],"names":[],"mappings":";;;;IAGA,SAAgB,+BAA+B,CAAC,KAAkB;QACxD,IAAA,SAAS,GAAwF,KAAK,UAA7F,EAAE,IAAI,GAAkF,KAAK,KAAvF,EAAE,SAAS,GAAuE,KAAK,UAA5E,EAAE,aAAa,GAAwD,KAAK,cAA7D,EAAE,cAAc,GAAwC,KAAK,eAA7C,EAAE,cAAc,GAAwB,KAAK,eAA7B,EAAE,iBAAiB,GAAK,KAAK,kBAAV,CAAW;QAE/G;;;WAGG;QACH,IAAM,MAAM,GAAuB;YACjC,IAAI,MAAA;YACJ,SAAS,WAAA;YACT,SAAS,WAAA;YACT,aAAa,eAAA;YACb,cAAc,gBAAA;YACd,cAAc,gBAAA;YACd,iBAAiB,mBAAA;SAClB,CAAC;QAEF,IAAM,aAAa,GAA8B,KAAK,CAAC;QAEvD,OAAO,EAAE,MAAM,QAAA,EAAE,aAAa,eAAA,EAAE,CAAC;IACnC,CAAC;IApBD,0EAoBC","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, inertTrapFocus, 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 inertTrapFocus,\n requestOpenChange,\n };\n\n const dialogSurface: DialogSurfaceContextValue = false;\n\n return { dialog, dialogSurface };\n}\n"]}

package/lib-amd/components/DialogActions/DialogActions.js CHANGED Viewed

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useDialogActions", "./renderDialogActions", "./useDialogActionsStyles"], function (require, exports, React, useDialogActions_1, renderDialogActions_1, useDialogActionsStyles_1) {
+define(["require", "exports", "react", "./useDialogActions", "./renderDialogActions", "./useDialogActionsStyles", "@fluentui/react-shared-contexts"], function (require, exports, React, useDialogActions_1, renderDialogActions_1, useDialogActionsStyles_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.DialogActions = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "react", "./useDialogActions", "./renderDialogActi
     exports.DialogActions = React.forwardRef(function (props, ref) {
         var state = useDialogActions_1.useDialogActions_unstable(props, ref);
         useDialogActionsStyles_1.useDialogActionsStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useDialogActionsStyles_unstable;
+        useCustomStyles(state);
         return renderDialogActions_1.renderDialogActions_unstable(state);
     });
     exports.DialogActions.displayName = 'DialogActions';

package/lib-amd/components/DialogActions/DialogActions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogActions.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogActions/DialogActions.tsx"],"names":[],"mappings":";;;;~~IAOA~~;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;~~QACvC~~,OAAO,kDAA4B,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogActions_unstable } from './useDialogActions';\nimport { renderDialogActions_unstable } from './renderDialogActions';\nimport { useDialogActionsStyles_unstable } from './useDialogActionsStyles';\nimport type { DialogActionsProps } from './DialogActions.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n `DialogActions` is a container for the actions of the dialog.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogActions: ForwardRefComponent<DialogActionsProps> = React.forwardRef((props, ref) => {\n const state = useDialogActions_unstable(props, ref);\n\n useDialogActionsStyles_unstable(state);\n return renderDialogActions_unstable(state);\n});\n\nDialogActions.displayName = 'DialogActions';\n"]}
1	+ {"version":3,"file":"DialogActions.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogActions/DialogActions.tsx"],"names":[],"mappings":";;;;IAQA;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAE/B,IAAiC,eAAe,GAAK,oDAA4B,EAAE,gCAAnC,CAAoC;QAC5F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,kDAA4B,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogActions_unstable } from './useDialogActions';\nimport { renderDialogActions_unstable } from './renderDialogActions';\nimport { useDialogActionsStyles_unstable } from './useDialogActionsStyles';\nimport type { DialogActionsProps } from './DialogActions.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n `DialogActions` is a container for the actions of the dialog.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogActions: ForwardRefComponent<DialogActionsProps> = React.forwardRef((props, ref) => {\n const state = useDialogActions_unstable(props, ref);\n\n useDialogActionsStyles_unstable(state);\n\n const { useDialogActionsStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderDialogActions_unstable(state);\n});\n\nDialogActions.displayName = 'DialogActions';\n"]}

package/lib-amd/components/DialogBody/DialogBody.js CHANGED Viewed

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useDialogBody", "./renderDialogBody", "./useDialogBodyStyles"], function (require, exports, React, useDialogBody_1, renderDialogBody_1, useDialogBodyStyles_1) {
+define(["require", "exports", "react", "./useDialogBody", "./renderDialogBody", "./useDialogBodyStyles", "@fluentui/react-shared-contexts"], function (require, exports, React, useDialogBody_1, renderDialogBody_1, useDialogBodyStyles_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.DialogBody = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "react", "./useDialogBody", "./renderDialogBody",
     exports.DialogBody = React.forwardRef(function (props, ref) {
         var state = useDialogBody_1.useDialogBody_unstable(props, ref);
         useDialogBodyStyles_1.useDialogBodyStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useDialogBodyStyles_unstable;
+        useCustomStyles(state);
         return renderDialogBody_1.renderDialogBody_unstable(state);
     });
     exports.DialogBody.displayName = 'DialogBody';

package/lib-amd/components/DialogBody/DialogBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogBody.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogBody/DialogBody.tsx"],"names":[],"mappings":";;;;~~IAOA~~;;;OAGG;IACU,QAAA,UAAU,GAAyC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC1F,IAAM,KAAK,GAAG,sCAAsB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEjD,kDAA4B,CAAC,KAAK,CAAC,CAAC;~~QACpC~~,OAAO,4CAAyB,CAAC,KAAK,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogBody_unstable } from './useDialogBody';\nimport { renderDialogBody_unstable } from './renderDialogBody';\nimport { useDialogBodyStyles_unstable } from './useDialogBodyStyles';\nimport type { DialogBodyProps } from './DialogBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n The `DialogBody` is a container where the content of the dialog is rendered.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogBody: ForwardRefComponent<DialogBodyProps> = React.forwardRef((props, ref) => {\n const state = useDialogBody_unstable(props, ref);\n\n useDialogBodyStyles_unstable(state);\n return renderDialogBody_unstable(state);\n});\n\nDialogBody.displayName = 'DialogBody';\n"]}
1	+ {"version":3,"file":"DialogBody.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogBody/DialogBody.tsx"],"names":[],"mappings":";;;;IAQA;;;OAGG;IACU,QAAA,UAAU,GAAyC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC1F,IAAM,KAAK,GAAG,sCAAsB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEjD,kDAA4B,CAAC,KAAK,CAAC,CAAC;QAE5B,IAA8B,eAAe,GAAK,oDAA4B,EAAE,6BAAnC,CAAoC;QACzF,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,4CAAyB,CAAC,KAAK,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogBody_unstable } from './useDialogBody';\nimport { renderDialogBody_unstable } from './renderDialogBody';\nimport { useDialogBodyStyles_unstable } from './useDialogBodyStyles';\nimport type { DialogBodyProps } from './DialogBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n The `DialogBody` is a container where the content of the dialog is rendered.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogBody: ForwardRefComponent<DialogBodyProps> = React.forwardRef((props, ref) => {\n const state = useDialogBody_unstable(props, ref);\n\n useDialogBodyStyles_unstable(state);\n\n const { useDialogBodyStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderDialogBody_unstable(state);\n});\n\nDialogBody.displayName = 'DialogBody';\n"]}

package/lib-amd/components/DialogContent/DialogContent.js CHANGED Viewed

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useDialogContent", "./renderDialogContent", "./useDialogContentStyles"], function (require, exports, React, useDialogContent_1, renderDialogContent_1, useDialogContentStyles_1) {
+define(["require", "exports", "react", "./useDialogContent", "./renderDialogContent", "./useDialogContentStyles", "@fluentui/react-shared-contexts"], function (require, exports, React, useDialogContent_1, renderDialogContent_1, useDialogContentStyles_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.DialogContent = void 0;
@@ -9,6 +9,8 @@ define(["require", "exports", "react", "./useDialogContent", "./renderDialogCont
     exports.DialogContent = React.forwardRef(function (props, ref) {
         var state = useDialogContent_1.useDialogContent_unstable(props, ref);
         useDialogContentStyles_1.useDialogContentStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useDialogContentStyles_unstable;
+        useCustomStyles(state);
         return renderDialogContent_1.renderDialogContent_unstable(state);
     });
     exports.DialogContent.displayName = 'DialogContent';

package/lib-amd/components/DialogContent/DialogContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogContent.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogContent/DialogContent.tsx"],"names":[],"mappings":";;;;~~IAOA~~;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;~~QACvC~~,OAAO,kDAA4B,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogContent_unstable } from './useDialogContent';\nimport { renderDialogContent_unstable } from './renderDialogContent';\nimport { useDialogContentStyles_unstable } from './useDialogContentStyles';\nimport type { DialogContentProps } from './DialogContent.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/*\n The `DialogContent` is a container where the content of the dialog is rendered.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogContent: ForwardRefComponent<DialogContentProps> = React.forwardRef((props, ref) => {\n const state = useDialogContent_unstable(props, ref);\n\n useDialogContentStyles_unstable(state);\n return renderDialogContent_unstable(state);\n});\n\nDialogContent.displayName = 'DialogContent';\n"]}
1	+ {"version":3,"file":"DialogContent.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogContent/DialogContent.tsx"],"names":[],"mappings":";;;;IAQA;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEpD,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAE/B,IAAiC,eAAe,GAAK,oDAA4B,EAAE,gCAAnC,CAAoC;QAC5F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,kDAA4B,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogContent_unstable } from './useDialogContent';\nimport { renderDialogContent_unstable } from './renderDialogContent';\nimport { useDialogContentStyles_unstable } from './useDialogContentStyles';\nimport type { DialogContentProps } from './DialogContent.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n The `DialogContent` is a container where the content of the dialog is rendered.\n * Apart from styling, this component does not have other behavior.\n */\nexport const DialogContent: ForwardRefComponent<DialogContentProps> = React.forwardRef((props, ref) => {\n const state = useDialogContent_unstable(props, ref);\n\n useDialogContentStyles_unstable(state);\n\n const { useDialogContentStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderDialogContent_unstable(state);\n});\n\nDialogContent.displayName = 'DialogContent';\n"]}

package/lib-amd/components/DialogSurface/DialogSurface.js CHANGED Viewed

@@ -1,4 +1,4 @@
-define(["require", "exports", "react", "./useDialogSurface", "./renderDialogSurface", "./useDialogSurfaceStyles", "./useDialogSurfaceContextValues"], function (require, exports, React, useDialogSurface_1, renderDialogSurface_1, useDialogSurfaceStyles_1, useDialogSurfaceContextValues_1) {
+define(["require", "exports", "react", "./useDialogSurface", "./renderDialogSurface", "./useDialogSurfaceStyles", "./useDialogSurfaceContextValues", "@fluentui/react-shared-contexts"], function (require, exports, React, useDialogSurface_1, renderDialogSurface_1, useDialogSurfaceStyles_1, useDialogSurfaceContextValues_1, react_shared_contexts_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.DialogSurface = void 0;
@@ -10,6 +10,8 @@ define(["require", "exports", "react", "./useDialogSurface", "./renderDialogSurf
         var state = useDialogSurface_1.useDialogSurface_unstable(props, ref);
         var contextValues = useDialogSurfaceContextValues_1.useDialogSurfaceContextValues_unstable(state);
         useDialogSurfaceStyles_1.useDialogSurfaceStyles_unstable(state);
+        var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useDialogSurfaceStyles_unstable;
+        useCustomStyles(state);
         return renderDialogSurface_1.renderDialogSurface_unstable(state, contextValues);
     });
     exports.DialogSurface.displayName = 'DialogSurface';

package/lib-amd/components/DialogSurface/DialogSurface.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogSurface.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogSurface/DialogSurface.tsx"],"names":[],"mappings":";;;;~~IAQA~~;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACpD,IAAM,aAAa,GAAG,sEAAsC,CAAC,KAAK,CAAC,CAAC;QAEpE,wDAA+B,CAAC,KAAK,CAAC,CAAC;~~QACvC~~,OAAO,kDAA4B,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAC5D,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogSurface_unstable } from './useDialogSurface';\nimport { renderDialogSurface_unstable } from './renderDialogSurface';\nimport { useDialogSurfaceStyles_unstable } from './useDialogSurfaceStyles';\nimport type { DialogSurfaceProps } from './DialogSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDialogSurfaceContextValues_unstable } from './useDialogSurfaceContextValues';\n\n/*\n DialogSurface component represents the visual part of a `Dialog` as a whole,\n * it contains everything that should be visible.\n */\nexport const DialogSurface: ForwardRefComponent<DialogSurfaceProps> = React.forwardRef((props, ref) => {\n const state = useDialogSurface_unstable(props, ref);\n const contextValues = useDialogSurfaceContextValues_unstable(state);\n\n useDialogSurfaceStyles_unstable(state);\n return renderDialogSurface_unstable(state, contextValues);\n});\n\nDialogSurface.displayName = 'DialogSurface';\n"]}
1	+ {"version":3,"file":"DialogSurface.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-dialog/src/components/DialogSurface/DialogSurface.tsx"],"names":[],"mappings":";;;;IASA;;;OAGG;IACU,QAAA,aAAa,GAA4C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAChG,IAAM,KAAK,GAAG,4CAAyB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACpD,IAAM,aAAa,GAAG,sEAAsC,CAAC,KAAK,CAAC,CAAC;QAEpE,wDAA+B,CAAC,KAAK,CAAC,CAAC;QAE/B,IAAiC,eAAe,GAAK,oDAA4B,EAAE,gCAAnC,CAAoC;QAC5F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,kDAA4B,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAC5D,CAAC,CAAC,CAAC;IAEH,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport { useDialogSurface_unstable } from './useDialogSurface';\nimport { renderDialogSurface_unstable } from './renderDialogSurface';\nimport { useDialogSurfaceStyles_unstable } from './useDialogSurfaceStyles';\nimport type { DialogSurfaceProps } from './DialogSurface.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDialogSurfaceContextValues_unstable } from './useDialogSurfaceContextValues';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n DialogSurface component represents the visual part of a `Dialog` as a whole,\n * it contains everything that should be visible.\n */\nexport const DialogSurface: ForwardRefComponent<DialogSurfaceProps> = React.forwardRef((props, ref) => {\n const state = useDialogSurface_unstable(props, ref);\n const contextValues = useDialogSurfaceContextValues_unstable(state);\n\n useDialogSurfaceStyles_unstable(state);\n\n const { useDialogSurfaceStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderDialogSurface_unstable(state, contextValues);\n});\n\nDialogSurface.displayName = 'DialogSurface';\n"]}

package/lib-amd/components/DialogSurface/useDialogSurface.js CHANGED Viewed

@@ -14,6 +14,7 @@ define(["require", "exports", "tslib", "@fluentui/react-utilities", "../../conte
     var useDialogSurface_unstable = function (props, ref) {
         var backdrop = props.backdrop, as = props.as;
         var modalType = contexts_1.useDialogContext_unstable(function (ctx) { return ctx.modalType; });
+        var inertTrapFocus = contexts_1.useDialogContext_unstable(function (ctx) { return ctx.inertTrapFocus; });
         var dialogRef = contexts_1.useDialogContext_unstable(function (ctx) { return ctx.dialogRef; });
         var open = contexts_1.useDialogContext_unstable(function (ctx) { return ctx.open; });
         var requestOpenChange = contexts_1.useDialogContext_unstable(function (ctx) { return ctx.requestOpenChange; });
@@ -45,7 +46,10 @@ define(["require", "exports", "tslib", "@fluentui/react-utilities", "../../conte
                 event.stopPropagation();
             }
         });
-        var modalAttributes = react_tabster_1.useModalAttributes({ trapFocus: modalType !== 'non-modal' }).modalAttributes;
+        var modalAttributes = react_tabster_1.useModalAttributes({
+            trapFocus: modalType !== 'non-modal',
+            legacyTrapFocus: !inertTrapFocus,
+        }).modalAttributes;
         return {
             components: {
                 backdrop: 'div',