@fluentui/react-dialog 9.1.5 → 9.1.6
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.
- package/CHANGELOG.json +66 -1
- package/CHANGELOG.md +17 -2
- package/lib/components/Dialog/Dialog.js +0 -1
- package/lib/components/Dialog/Dialog.js.map +1 -1
- package/lib/components/Dialog/renderDialog.js +0 -1
- package/lib/components/Dialog/renderDialog.js.map +1 -1
- package/lib/components/Dialog/useDialog.js +2 -8
- package/lib/components/Dialog/useDialog.js.map +1 -1
- package/lib/components/Dialog/useDialogContextValues.js +0 -1
- package/lib/components/Dialog/useDialogContextValues.js.map +1 -1
- package/lib/components/DialogActions/DialogActions.js +0 -1
- package/lib/components/DialogActions/DialogActions.js.map +1 -1
- package/lib/components/DialogActions/renderDialogActions.js +4 -4
- package/lib/components/DialogActions/renderDialogActions.js.map +1 -1
- package/lib/components/DialogActions/useDialogActions.js +0 -1
- package/lib/components/DialogActions/useDialogActions.js.map +1 -1
- package/lib/components/DialogActions/useDialogActionsStyles.js +24 -27
- package/lib/components/DialogActions/useDialogActionsStyles.js.map +1 -1
- package/lib/components/DialogBody/DialogBody.js +0 -1
- package/lib/components/DialogBody/DialogBody.js.map +1 -1
- package/lib/components/DialogBody/renderDialogBody.js +4 -4
- package/lib/components/DialogBody/renderDialogBody.js.map +1 -1
- package/lib/components/DialogBody/useDialogBody.js +0 -2
- package/lib/components/DialogBody/useDialogBody.js.map +1 -1
- package/lib/components/DialogBody/useDialogBodyStyles.js +23 -26
- package/lib/components/DialogBody/useDialogBodyStyles.js.map +1 -1
- package/lib/components/DialogContent/DialogContent.js +0 -1
- package/lib/components/DialogContent/DialogContent.js.map +1 -1
- package/lib/components/DialogContent/renderDialogContent.js +2 -2
- package/lib/components/DialogContent/renderDialogContent.js.map +1 -1
- package/lib/components/DialogContent/useDialogContent.js +0 -2
- package/lib/components/DialogContent/useDialogContent.js.map +1 -1
- package/lib/components/DialogContent/useDialogContentStyles.js +15 -18
- package/lib/components/DialogContent/useDialogContentStyles.js.map +1 -1
- package/lib/components/DialogSurface/DialogSurface.js +0 -1
- package/lib/components/DialogSurface/DialogSurface.js.map +1 -1
- package/lib/components/DialogSurface/renderDialogSurface.js +4 -3
- package/lib/components/DialogSurface/renderDialogSurface.js.map +1 -1
- package/lib/components/DialogSurface/useDialogSurface.js +2 -7
- package/lib/components/DialogSurface/useDialogSurface.js.map +1 -1
- package/lib/components/DialogSurface/useDialogSurfaceContextValues.js.map +1 -1
- package/lib/components/DialogSurface/useDialogSurfaceStyles.js +92 -97
- package/lib/components/DialogSurface/useDialogSurfaceStyles.js.map +1 -1
- package/lib/components/DialogTitle/DialogTitle.js +0 -1
- package/lib/components/DialogTitle/DialogTitle.js.map +1 -1
- package/lib/components/DialogTitle/renderDialogTitle.js +4 -3
- package/lib/components/DialogTitle/renderDialogTitle.js.map +1 -1
- package/lib/components/DialogTitle/useDialogTitle.js +0 -1
- package/lib/components/DialogTitle/useDialogTitle.js.map +1 -1
- package/lib/components/DialogTitle/useDialogTitleStyles.js +74 -80
- package/lib/components/DialogTitle/useDialogTitleStyles.js.map +1 -1
- package/lib/components/DialogTrigger/DialogTrigger.js +2 -3
- package/lib/components/DialogTrigger/DialogTrigger.js.map +1 -1
- package/lib/components/DialogTrigger/renderDialogTrigger.js.map +1 -1
- package/lib/components/DialogTrigger/useDialogTrigger.js +4 -5
- package/lib/components/DialogTrigger/useDialogTrigger.js.map +1 -1
- package/lib/contexts/dialogContext.js +2 -4
- package/lib/contexts/dialogContext.js.map +1 -1
- package/lib/contexts/dialogSurfaceContext.js +0 -1
- package/lib/contexts/dialogSurfaceContext.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/isEscapeKeyDown.js +0 -1
- package/lib/utils/isEscapeKeyDown.js.map +1 -1
- package/lib/utils/useDisableBodyScroll.js +0 -9
- package/lib/utils/useDisableBodyScroll.js.map +1 -1
- package/lib/utils/useFocusFirstElement.js +0 -5
- package/lib/utils/useFocusFirstElement.js.map +1 -1
- package/lib-commonjs/Dialog.js +0 -2
- package/lib-commonjs/Dialog.js.map +1 -1
- package/lib-commonjs/DialogActions.js +0 -2
- package/lib-commonjs/DialogActions.js.map +1 -1
- package/lib-commonjs/DialogBody.js +0 -2
- package/lib-commonjs/DialogBody.js.map +1 -1
- package/lib-commonjs/DialogContent.js +0 -2
- package/lib-commonjs/DialogContent.js.map +1 -1
- package/lib-commonjs/DialogSurface.js +0 -2
- package/lib-commonjs/DialogSurface.js.map +1 -1
- package/lib-commonjs/DialogTitle.js +0 -2
- package/lib-commonjs/DialogTitle.js.map +1 -1
- package/lib-commonjs/DialogTrigger.js +0 -2
- package/lib-commonjs/DialogTrigger.js.map +1 -1
- package/lib-commonjs/components/Dialog/Dialog.js +0 -6
- package/lib-commonjs/components/Dialog/Dialog.js.map +1 -1
- package/lib-commonjs/components/Dialog/Dialog.types.js.map +1 -1
- package/lib-commonjs/components/Dialog/index.js +0 -5
- package/lib-commonjs/components/Dialog/index.js.map +1 -1
- package/lib-commonjs/components/Dialog/renderDialog.js +0 -5
- package/lib-commonjs/components/Dialog/renderDialog.js.map +1 -1
- package/lib-commonjs/components/Dialog/useDialog.js +2 -15
- package/lib-commonjs/components/Dialog/useDialog.js.map +1 -1
- package/lib-commonjs/components/Dialog/useDialogContextValues.js +0 -3
- package/lib-commonjs/components/Dialog/useDialogContextValues.js.map +1 -1
- package/lib-commonjs/components/DialogActions/DialogActions.js +0 -6
- package/lib-commonjs/components/DialogActions/DialogActions.js.map +1 -1
- package/lib-commonjs/components/DialogActions/DialogActions.types.js.map +1 -1
- package/lib-commonjs/components/DialogActions/index.js +0 -6
- package/lib-commonjs/components/DialogActions/index.js.map +1 -1
- package/lib-commonjs/components/DialogActions/renderDialogActions.js +4 -8
- package/lib-commonjs/components/DialogActions/renderDialogActions.js.map +1 -1
- package/lib-commonjs/components/DialogActions/useDialogActions.js +0 -4
- package/lib-commonjs/components/DialogActions/useDialogActions.js.map +1 -1
- package/lib-commonjs/components/DialogActions/useDialogActionsStyles.js +24 -31
- package/lib-commonjs/components/DialogActions/useDialogActionsStyles.js.map +1 -1
- package/lib-commonjs/components/DialogBody/DialogBody.js +0 -6
- package/lib-commonjs/components/DialogBody/DialogBody.js.map +1 -1
- package/lib-commonjs/components/DialogBody/DialogBody.types.js.map +1 -1
- package/lib-commonjs/components/DialogBody/index.js +0 -6
- package/lib-commonjs/components/DialogBody/index.js.map +1 -1
- package/lib-commonjs/components/DialogBody/renderDialogBody.js +4 -8
- package/lib-commonjs/components/DialogBody/renderDialogBody.js.map +1 -1
- package/lib-commonjs/components/DialogBody/useDialogBody.js +0 -5
- package/lib-commonjs/components/DialogBody/useDialogBody.js.map +1 -1
- package/lib-commonjs/components/DialogBody/useDialogBodyStyles.js +23 -30
- package/lib-commonjs/components/DialogBody/useDialogBodyStyles.js.map +1 -1
- package/lib-commonjs/components/DialogContent/DialogContent.js +0 -6
- package/lib-commonjs/components/DialogContent/DialogContent.js.map +1 -1
- package/lib-commonjs/components/DialogContent/DialogContent.types.js.map +1 -1
- package/lib-commonjs/components/DialogContent/index.js +0 -6
- package/lib-commonjs/components/DialogContent/index.js.map +1 -1
- package/lib-commonjs/components/DialogContent/renderDialogContent.js +2 -6
- package/lib-commonjs/components/DialogContent/renderDialogContent.js.map +1 -1
- package/lib-commonjs/components/DialogContent/useDialogContent.js +0 -5
- package/lib-commonjs/components/DialogContent/useDialogContent.js.map +1 -1
- package/lib-commonjs/components/DialogContent/useDialogContentStyles.js +15 -23
- package/lib-commonjs/components/DialogContent/useDialogContentStyles.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/DialogSurface.js +0 -7
- package/lib-commonjs/components/DialogSurface/DialogSurface.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/DialogSurface.types.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/index.js +0 -6
- package/lib-commonjs/components/DialogSurface/index.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/renderDialogSurface.js +4 -9
- package/lib-commonjs/components/DialogSurface/renderDialogSurface.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/useDialogSurface.js +2 -13
- package/lib-commonjs/components/DialogSurface/useDialogSurface.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/useDialogSurfaceContextValues.js +0 -2
- package/lib-commonjs/components/DialogSurface/useDialogSurfaceContextValues.js.map +1 -1
- package/lib-commonjs/components/DialogSurface/useDialogSurfaceStyles.js +92 -103
- package/lib-commonjs/components/DialogSurface/useDialogSurfaceStyles.js.map +1 -1
- package/lib-commonjs/components/DialogTitle/DialogTitle.js +0 -6
- package/lib-commonjs/components/DialogTitle/DialogTitle.js.map +1 -1
- package/lib-commonjs/components/DialogTitle/DialogTitle.types.js.map +1 -1
- package/lib-commonjs/components/DialogTitle/index.js +0 -6
- package/lib-commonjs/components/DialogTitle/index.js.map +1 -1
- package/lib-commonjs/components/DialogTitle/renderDialogTitle.js +4 -7
- package/lib-commonjs/components/DialogTitle/renderDialogTitle.js.map +1 -1
- package/lib-commonjs/components/DialogTitle/useDialogTitle.js +0 -10
- package/lib-commonjs/components/DialogTitle/useDialogTitle.js.map +1 -1
- package/lib-commonjs/components/DialogTitle/useDialogTitleStyles.js +74 -86
- package/lib-commonjs/components/DialogTitle/useDialogTitleStyles.js.map +1 -1
- package/lib-commonjs/components/DialogTrigger/DialogTrigger.js +2 -7
- package/lib-commonjs/components/DialogTrigger/DialogTrigger.js.map +1 -1
- package/lib-commonjs/components/DialogTrigger/DialogTrigger.types.js.map +1 -1
- package/lib-commonjs/components/DialogTrigger/index.js +0 -5
- package/lib-commonjs/components/DialogTrigger/index.js.map +1 -1
- package/lib-commonjs/components/DialogTrigger/renderDialogTrigger.js +0 -2
- package/lib-commonjs/components/DialogTrigger/renderDialogTrigger.js.map +1 -1
- package/lib-commonjs/components/DialogTrigger/useDialogTrigger.js +4 -11
- package/lib-commonjs/components/DialogTrigger/useDialogTrigger.js.map +1 -1
- package/lib-commonjs/contexts/constants.js.map +1 -1
- package/lib-commonjs/contexts/dialogContext.js +2 -8
- package/lib-commonjs/contexts/dialogContext.js.map +1 -1
- package/lib-commonjs/contexts/dialogSurfaceContext.js +0 -5
- package/lib-commonjs/contexts/dialogSurfaceContext.js.map +1 -1
- package/lib-commonjs/contexts/index.js +0 -4
- package/lib-commonjs/contexts/index.js.map +1 -1
- package/lib-commonjs/index.js +0 -14
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/index.js +0 -4
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/isEscapeKeyDown.js +0 -4
- package/lib-commonjs/utils/isEscapeKeyDown.js.map +1 -1
- package/lib-commonjs/utils/useDisableBodyScroll.js +0 -14
- package/lib-commonjs/utils/useDisableBodyScroll.js.map +1 -1
- package/lib-commonjs/utils/useFocusFirstElement.js +0 -10
- package/lib-commonjs/utils/useFocusFirstElement.js.map +1 -1
- package/package.json +9 -9
|
@@ -14,7 +14,6 @@ import { useDialogTitleInternalStyles } from './useDialogTitleStyles';
|
|
|
14
14
|
* @param props - props from this instance of DialogTitle
|
|
15
15
|
* @param ref - reference to root HTMLElement of DialogTitle
|
|
16
16
|
*/
|
|
17
|
-
|
|
18
17
|
export const useDialogTitle_unstable = (props, ref) => {
|
|
19
18
|
const {
|
|
20
19
|
as,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
|
@@ -9,109 +9,103 @@ export const dialogTitleClassNames = {
|
|
|
9
9
|
/**
|
|
10
10
|
* Styles for the root slot
|
|
11
11
|
*/
|
|
12
|
-
|
|
13
12
|
const useStyles = /*#__PURE__*/__styles({
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
13
|
+
root: {
|
|
14
|
+
Bahqtrf: "fk6fouc",
|
|
15
|
+
Be2twd7: "f1pp30po",
|
|
16
|
+
Bhrd7zp: "fl43uef",
|
|
17
|
+
Bg96gwp: "f106mvju",
|
|
18
|
+
Ijaq50: "faq1aip",
|
|
19
|
+
Br312pm: "f1m489tg",
|
|
20
|
+
nk6f5a: "fv2srd9",
|
|
21
|
+
Bw0ie65: "f1tz6hh8"
|
|
23
22
|
},
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
23
|
+
rootWithoutCloseButton: {
|
|
24
|
+
Ijaq50: "faq1aip",
|
|
25
|
+
Br312pm: "f1m489tg",
|
|
26
|
+
nk6f5a: "f11nczdl",
|
|
27
|
+
Bw0ie65: "f98d4vj"
|
|
29
28
|
},
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
action: {
|
|
30
|
+
Ijaq50: "f1hysmiz",
|
|
31
|
+
Br312pm: "f1379kmu",
|
|
32
|
+
nk6f5a: "f11nczdl",
|
|
33
|
+
Bw0ie65: "f98d4vj"
|
|
35
34
|
}
|
|
36
35
|
}, {
|
|
37
|
-
|
|
36
|
+
d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".f106mvju{line-height:var(--lineHeightBase500);}", ".faq1aip{grid-row-start:title;}", ".f1m489tg{grid-column-start:title;}", ".fv2srd9{grid-row-end:title;}", ".f1tz6hh8{grid-column-end:title;}", ".f11nczdl{grid-row-end:close-button;}", ".f98d4vj{grid-column-end:close-button;}", ".f1hysmiz{grid-row-start:close-button;}", ".f1379kmu{grid-column-start:close-button;}"]
|
|
38
37
|
});
|
|
39
38
|
/**
|
|
40
39
|
* Styles to be applied on internal elements used by default action on non-modal Dialog
|
|
41
40
|
* @internal
|
|
42
41
|
*/
|
|
43
|
-
|
|
44
|
-
|
|
45
42
|
export const useDialogTitleInternalStyles = /*#__PURE__*/__styles({
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
43
|
+
button: {
|
|
44
|
+
qhf8xq: "f10pi13n",
|
|
45
|
+
B7ck84d: "f1e4lqlz",
|
|
46
|
+
De3pzq: "f1u2r49w",
|
|
47
|
+
sj55zd: "f1ym3bx4",
|
|
48
|
+
Bahqtrf: "f1mo0ibp",
|
|
49
|
+
Be2twd7: "fjoy568",
|
|
50
|
+
Bceei9c: "f1k6fduh",
|
|
51
|
+
Bg96gwp: "fez10in",
|
|
52
|
+
B68tc82: "f1mtd64y",
|
|
53
|
+
Bmxbyg5: "f1y7q3j9",
|
|
54
|
+
z8tnut: "f1g0x7ka",
|
|
55
|
+
z189sj: ["fhxju0i", "f1cnd47f"],
|
|
56
|
+
Byoj8tv: "f1qch9an",
|
|
57
|
+
uwmqm3: ["f1cnd47f", "fhxju0i"],
|
|
58
|
+
icvyot: "f1ern45e",
|
|
59
|
+
vrafjx: ["f1n71otn", "f1deefiw"],
|
|
60
|
+
oivjwe: "f1h8hb77",
|
|
61
|
+
wvpqe5: ["f1deefiw", "f1n71otn"],
|
|
62
|
+
Bv0vk6g: "f37px4s",
|
|
63
|
+
fsow6f: "fgusgyc",
|
|
64
|
+
Brovlpu: "ftqa4ok",
|
|
65
|
+
B486eqv: "f2hkw1w",
|
|
66
|
+
B8q5s1w: "f8hki3x",
|
|
67
|
+
Bci5o5g: ["f1d2448m", "ffh67wi"],
|
|
68
|
+
n8qw10: "f1bjia2o",
|
|
69
|
+
Bdrgwmp: ["ffh67wi", "f1d2448m"],
|
|
70
|
+
Bm4h7ae: "f15bsgw9",
|
|
71
|
+
B7ys5i9: "f14e48fq",
|
|
72
|
+
Busjfv9: "f18yb2kv",
|
|
73
|
+
Bhk32uz: "fd6o370",
|
|
74
|
+
Bf4ptjt: "fh1cnn4",
|
|
75
|
+
kclons: ["fy7oxxb", "f184ne2d"],
|
|
76
|
+
Bhdgwq3: "fpukqih",
|
|
77
|
+
Blkhhs4: ["f184ne2d", "fy7oxxb"],
|
|
78
|
+
Bqtpl0w: "frrh606",
|
|
79
|
+
clg4pj: ["f1v5zibi", "fo2hd23"],
|
|
80
|
+
hgwjuy: "ful5kiu",
|
|
81
|
+
Bonggc9: ["fo2hd23", "f1v5zibi"],
|
|
82
|
+
B1tsrr9: ["f1jqcqds", "ftffrms"],
|
|
83
|
+
Dah5zi: ["ftffrms", "f1jqcqds"],
|
|
84
|
+
Bkh64rk: ["f2e7qr6", "fsr1zz6"],
|
|
85
|
+
qqdqy8: ["fsr1zz6", "f2e7qr6"],
|
|
86
|
+
B6dhp37: "f1dvezut",
|
|
87
|
+
i03rao: ["fd0oaoj", "f1cwg4i8"],
|
|
88
|
+
Boxcth7: "fjvm52t",
|
|
89
|
+
Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
|
|
90
|
+
J0r882: "fdiulkx",
|
|
91
|
+
Bjwuhne: "f1yalx80",
|
|
92
|
+
Ghsupd: ["fq22d5a", "f1jw7pan"],
|
|
93
|
+
Bule8hv: ["f1jw7pan", "fq22d5a"]
|
|
97
94
|
}
|
|
98
95
|
}, {
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
96
|
+
d: [".f10pi13n{position:relative;}", ".f1e4lqlz{box-sizing:content-box;}", ".f1u2r49w{background-color:inherit;}", ".f1ym3bx4{color:inherit;}", ".f1mo0ibp{font-family:inherit;}", ".fjoy568{font-size:inherit;}", ".f1k6fduh{cursor:pointer;}", ".fez10in{line-height:0;}", ".f1mtd64y{overflow-x:visible;}", ".f1y7q3j9{overflow-y:visible;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".f37px4s{-webkit-appearance:button;}", ".fgusgyc{text-align:unset;}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", ".fh1cnn4[data-fui-focus-visible]::after{border-top-style:solid;}", ".fy7oxxb[data-fui-focus-visible]::after{border-right-style:solid;}", ".f184ne2d[data-fui-focus-visible]::after{border-left-style:solid;}", ".fpukqih[data-fui-focus-visible]::after{border-bottom-style:solid;}", ".frrh606[data-fui-focus-visible]::after{border-top-width:2px;}", ".f1v5zibi[data-fui-focus-visible]::after{border-right-width:2px;}", ".fo2hd23[data-fui-focus-visible]::after{border-left-width:2px;}", ".ful5kiu[data-fui-focus-visible]::after{border-bottom-width:2px;}", ".f1jqcqds[data-fui-focus-visible]::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".ftffrms[data-fui-focus-visible]::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f2e7qr6[data-fui-focus-visible]::after{border-top-right-radius:var(--borderRadiusMedium);}", ".fsr1zz6[data-fui-focus-visible]::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1dvezut[data-fui-focus-visible]::after{border-top-color:var(--colorStrokeFocus2);}", ".fd0oaoj[data-fui-focus-visible]::after{border-right-color:var(--colorStrokeFocus2);}", ".f1cwg4i8[data-fui-focus-visible]::after{border-left-color:var(--colorStrokeFocus2);}", ".fjvm52t[data-fui-focus-visible]::after{border-bottom-color:var(--colorStrokeFocus2);}", ".fdiulkx[data-fui-focus-visible]::after{top:-2px;}", ".f1yalx80[data-fui-focus-visible]::after{bottom:-2px;}", ".fq22d5a[data-fui-focus-visible]::after{left:-2px;}", ".f1jw7pan[data-fui-focus-visible]::after{right:-2px;}"],
|
|
97
|
+
f: [".ftqa4ok:focus{outline-style:none;}"],
|
|
98
|
+
i: [".f2hkw1w:focus-visible{outline-style:none;}"]
|
|
102
99
|
});
|
|
103
100
|
/**
|
|
104
101
|
* Apply styling to the DialogTitle slots based on the state
|
|
105
102
|
*/
|
|
106
|
-
|
|
107
103
|
export const useDialogTitleStyles_unstable = state => {
|
|
108
104
|
const styles = useStyles();
|
|
109
105
|
state.root.className = mergeClasses(dialogTitleClassNames.root, styles.root, !state.action && styles.rootWithoutCloseButton, state.root.className);
|
|
110
|
-
|
|
111
106
|
if (state.action) {
|
|
112
107
|
state.action.className = mergeClasses(dialogTitleClassNames.action, styles.action, state.action.className);
|
|
113
108
|
}
|
|
114
|
-
|
|
115
109
|
return state;
|
|
116
110
|
};
|
|
117
111
|
//# sourceMappingURL=useDialogTitleStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
|
@@ -10,12 +10,11 @@ import { renderDialogTrigger_unstable } from './renderDialogTrigger';
|
|
|
10
10
|
* to it's wrapped child, but it won't be able to alter the dialog `open` state anymore,
|
|
11
11
|
* in that case the user must provide a `controlled state`
|
|
12
12
|
*/
|
|
13
|
-
|
|
14
13
|
export const DialogTrigger = props => {
|
|
15
14
|
const state = useDialogTrigger_unstable(props);
|
|
16
15
|
return renderDialogTrigger_unstable(state);
|
|
17
16
|
};
|
|
18
|
-
DialogTrigger.displayName = 'DialogTrigger';
|
|
19
|
-
|
|
17
|
+
DialogTrigger.displayName = 'DialogTrigger';
|
|
18
|
+
// type casting here is required to ensure internal type FluentTriggerComponent is not leaked
|
|
20
19
|
DialogTrigger.isFluentTriggerComponent = true;
|
|
21
20
|
//# sourceMappingURL=DialogTrigger.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTrigger/renderDialogTrigger.tsx"],"
|
|
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"]}
|
|
@@ -8,7 +8,6 @@ import { useARIAButtonProps } from '@fluentui/react-aria';
|
|
|
8
8
|
*
|
|
9
9
|
* @param props - props from this instance of DialogTrigger
|
|
10
10
|
*/
|
|
11
|
-
|
|
12
11
|
export const useDialogTrigger_unstable = props => {
|
|
13
12
|
const isInsideSurfaceDialog = useDialogSurfaceContext_unstable();
|
|
14
13
|
const {
|
|
@@ -24,9 +23,7 @@ export const useDialogTrigger_unstable = props => {
|
|
|
24
23
|
} = useModalAttributes();
|
|
25
24
|
const handleClick = useEventCallback(event => {
|
|
26
25
|
var _a, _b;
|
|
27
|
-
|
|
28
26
|
(_b = child === null || child === void 0 ? void 0 : (_a = child.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
|
|
29
|
-
|
|
30
27
|
if (!event.isDefaultPrevented()) {
|
|
31
28
|
requestOpenChange({
|
|
32
29
|
event,
|
|
@@ -35,13 +32,15 @@ export const useDialogTrigger_unstable = props => {
|
|
|
35
32
|
});
|
|
36
33
|
}
|
|
37
34
|
});
|
|
38
|
-
const triggerChildProps = {
|
|
35
|
+
const triggerChildProps = {
|
|
36
|
+
...(child === null || child === void 0 ? void 0 : child.props),
|
|
39
37
|
'aria-expanded': open,
|
|
40
38
|
ref: child === null || child === void 0 ? void 0 : child.ref,
|
|
41
39
|
onClick: handleClick,
|
|
42
40
|
...triggerAttributes
|
|
43
41
|
};
|
|
44
|
-
const ariaButtonTriggerChildProps = useARIAButtonProps((child === null || child === void 0 ? void 0 : child.type) === 'button' || (child === null || child === void 0 ? void 0 : child.type) === 'a' ? child.type : 'div', {
|
|
42
|
+
const ariaButtonTriggerChildProps = useARIAButtonProps((child === null || child === void 0 ? void 0 : child.type) === 'button' || (child === null || child === void 0 ? void 0 : child.type) === 'a' ? child.type : 'div', {
|
|
43
|
+
...triggerChildProps,
|
|
45
44
|
type: 'button'
|
|
46
45
|
});
|
|
47
46
|
return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
|
@@ -6,13 +6,11 @@ const defaultContextValue = {
|
|
|
6
6
|
dialogRef: {
|
|
7
7
|
current: null
|
|
8
8
|
},
|
|
9
|
-
|
|
10
9
|
requestOpenChange() {
|
|
11
10
|
/* noop */
|
|
12
11
|
}
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
};
|
|
13
|
+
// Contexts should default to undefined
|
|
16
14
|
export const DialogContext = /*#__PURE__*/createContext(undefined);
|
|
17
15
|
export const DialogProvider = DialogContext.Provider;
|
|
18
16
|
export const useDialogContext_unstable = selector => useContextSelector(DialogContext, (ctx = defaultContextValue) => selector(ctx));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
|
@@ -4,7 +4,6 @@ export const DialogSurfaceContext = /*#__PURE__*/createContext(undefined);
|
|
|
4
4
|
export const DialogSurfaceProvider = DialogSurfaceContext.Provider;
|
|
5
5
|
export const useDialogSurfaceContext_unstable = () => {
|
|
6
6
|
var _a;
|
|
7
|
-
|
|
8
7
|
return (_a = useContext(DialogSurfaceContext)) !== null && _a !== void 0 ? _a : defaultContextValue;
|
|
9
8
|
};
|
|
10
9
|
//# sourceMappingURL=dialogSurfaceContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
|
@@ -4,7 +4,6 @@ const disableScrollElementProp = '__fluentDisableScrollElement';
|
|
|
4
4
|
/**
|
|
5
5
|
* hook that disables body scrolling through `overflow: hidden` CSS property
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
7
|
export function useDisableBodyScroll() {
|
|
9
8
|
const {
|
|
10
9
|
targetDocument
|
|
@@ -20,37 +19,29 @@ export function useDisableBodyScroll() {
|
|
|
20
19
|
* @param target - element to disable scrolling from
|
|
21
20
|
* @returns a method for enabling scrolling again
|
|
22
21
|
*/
|
|
23
|
-
|
|
24
22
|
export function disableScroll(target) {
|
|
25
23
|
var _a, _b;
|
|
26
|
-
|
|
27
24
|
const {
|
|
28
25
|
clientWidth
|
|
29
26
|
} = target.ownerDocument.documentElement;
|
|
30
27
|
const innerWidth = (_b = (_a = target.ownerDocument.defaultView) === null || _a === void 0 ? void 0 : _a.innerWidth) !== null && _b !== void 0 ? _b : 0;
|
|
31
28
|
assertIsDisableScrollElement(target);
|
|
32
|
-
|
|
33
29
|
if (target[disableScrollElementProp].count === 0) {
|
|
34
30
|
target.style.overflow = 'hidden';
|
|
35
31
|
target.style.paddingRight = `${innerWidth - clientWidth}px`;
|
|
36
32
|
}
|
|
37
|
-
|
|
38
33
|
target[disableScrollElementProp].count++;
|
|
39
34
|
return () => {
|
|
40
35
|
target[disableScrollElementProp].count--;
|
|
41
|
-
|
|
42
36
|
if (target[disableScrollElementProp].count === 0) {
|
|
43
37
|
target.style.overflow = target[disableScrollElementProp].previousOverflowStyle;
|
|
44
38
|
target.style.paddingRight = target[disableScrollElementProp].previousPaddingRightStyle;
|
|
45
39
|
}
|
|
46
40
|
};
|
|
47
41
|
}
|
|
48
|
-
|
|
49
42
|
function assertIsDisableScrollElement(element) {
|
|
50
43
|
var _a;
|
|
51
|
-
|
|
52
44
|
var _b;
|
|
53
|
-
|
|
54
45
|
(_a = (_b = element)[disableScrollElementProp]) !== null && _a !== void 0 ? _a : _b[disableScrollElementProp] = {
|
|
55
46
|
count: 0,
|
|
56
47
|
previousOverflowStyle: element.style.overflow,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
|
@@ -4,7 +4,6 @@ import { useFluent_unstable } from '@fluentui/react-shared-contexts';
|
|
|
4
4
|
/**
|
|
5
5
|
* Focus first element on content when dialog is opened,
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
7
|
export function useFocusFirstElement(open, modalType) {
|
|
9
8
|
const {
|
|
10
9
|
findFirstFocusable
|
|
@@ -16,19 +15,15 @@ export function useFocusFirstElement(open, modalType) {
|
|
|
16
15
|
const triggerRef = React.useRef();
|
|
17
16
|
React.useEffect(() => {
|
|
18
17
|
var _a, _b;
|
|
19
|
-
|
|
20
18
|
if (!open) {
|
|
21
19
|
return (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
22
20
|
}
|
|
23
|
-
|
|
24
21
|
triggerRef.current = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
|
|
25
22
|
const element = dialogRef.current && findFirstFocusable(dialogRef.current);
|
|
26
|
-
|
|
27
23
|
if (element) {
|
|
28
24
|
element.focus();
|
|
29
25
|
} else {
|
|
30
26
|
(_b = dialogRef.current) === null || _b === void 0 ? void 0 : _b.focus(); // https://github.com/microsoft/fluentui/issues/25150
|
|
31
|
-
|
|
32
27
|
if (process.env.NODE_ENV !== 'production') {
|
|
33
28
|
// eslint-disable-next-line no-console
|
|
34
29
|
console.warn(['@fluentui/react-dialog: a Dialog should have at least one focusable element inside DialogSurface.', 'Please add at least a close button either on `DialogTitle` action slot or inside `DialogActions`'].join('\n'));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
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"]}
|
package/lib-commonjs/Dialog.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["packages/react-components/react-dialog/src/Dialog.ts"],"
|
|
1
|
+
{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-dialog/src/Dialog.ts"],"sourcesContent":["export * from './components/Dialog/index';\n"]}
|