@fluentui/react-dialog 9.1.5 → 9.1.7

package/lib/components/DialogSurface/useDialogSurfaceStyles.js

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

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

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

package/lib/components/DialogTitle/DialogTitle.js

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

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

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

package/lib/components/DialogTitle/renderDialogTitle.js

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

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

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

package/lib/components/DialogTitle/useDialogTitle.js

@@ -14,7 +14,6 @@ import { useDialogTitleInternalStyles } from './useDialogTitleStyles';
  * @param props - props from this instance of DialogTitle
  * @param ref - reference to root HTMLElement of DialogTitle
  */
-
 export const useDialogTitle_unstable = (props, ref) => {
   const {
     as,

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTitle/useDialogTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAEA,SAAS,yBAAT,QAA0C,8BAA1C;AACA,SAAS,gBAAT,QAAiC,uBAAjC;AACA,SAAS,gBAAT,QAAiC,2BAAjC;AACA,SAAS,aAAT,QAA8B,gCAA9B;AACA,SAAS,4BAAT,QAA6C,wBAA7C;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,uBAAuB,GAAG,CAAC,KAAD,EAA0B,GAA1B,KAA2E;EAChH,MAAM;IAAE,EAAF;IAAM;EAAN,IAAiB,KAAvB;EACA,MAAM,SAAS,GAAG,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,SAAZ,CAA3C;EACA,MAAM,cAAc,GAAG,4BAA4B,EAAnD;EAEA,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,MAAM,EAAE;IAFE,CADP;IAKL,IAAI,EAAE,qBAAqB,CAAC,EAAE,KAAA,IAAF,IAAA,EAAE,KAAA,KAAA,CAAF,GAAA,EAAA,GAAM,KAAP,EAAc;MACvC,GADuC;MAEvC,EAAE,EAAE,yBAAyB,CAAC,GAAG,IAAI,GAAG,CAAC,aAAZ,CAFU;MAGvC,GAAG;IAHoC,CAAd,CALtB;IAUL,MAAM,EAAE,gBAAgB,CAAC,MAAD,EAAS;MAC/B,QAAQ,EAAE,SAAS,KAAK,WADO;MAE/B,YAAY,EAAE;QACZ,QAAQ,eACN,KAAA,CAAA,aAAA,CAAC,aAAD,EAAc;UAAC,wBAAwB,EAAA,IAAzB;UAA0B,MAAM,EAAC;QAAjC,CAAd,eACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;UACE,SAAS,EAAE,cAAc,CAAC,MAD5B;UACkC,cAErB;QAHb,CAAA,eAKE,KAAA,CAAA,aAAA,CAAC,gBAAD,EAAiB,IAAjB,CALF,CADF;MAFU;IAFiB,CAAT;EAVnB,CAAP;AA2BD,CAhCM","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"],"sourceRoot":"../src/"}
+{"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"]}

package/lib/components/DialogTitle/useDialogTitleStyles.js

@@ -9,109 +9,103 @@ export const dialogTitleClassNames = {
 /**
  * Styles for the root slot
  */
-
 const useStyles = /*#__PURE__*/__styles({
-  "root": {
-    "Bahqtrf": "fk6fouc",
-    "Be2twd7": "f1pp30po",
-    "Bhrd7zp": "fl43uef",
-    "Bg96gwp": "f106mvju",
-    "Ijaq50": "faq1aip",
-    "Br312pm": "f1m489tg",
-    "nk6f5a": "fv2srd9",
-    "Bw0ie65": "f1tz6hh8"
+  root: {
+    Bahqtrf: "fk6fouc",
+    Be2twd7: "f1pp30po",
+    Bhrd7zp: "fl43uef",
+    Bg96gwp: "f106mvju",
+    Ijaq50: "faq1aip",
+    Br312pm: "f1m489tg",
+    nk6f5a: "fv2srd9",
+    Bw0ie65: "f1tz6hh8"
   },
-  "rootWithoutCloseButton": {
-    "Ijaq50": "faq1aip",
-    "Br312pm": "f1m489tg",
-    "nk6f5a": "f11nczdl",
-    "Bw0ie65": "f98d4vj"
+  rootWithoutCloseButton: {
+    Ijaq50: "faq1aip",
+    Br312pm: "f1m489tg",
+    nk6f5a: "f11nczdl",
+    Bw0ie65: "f98d4vj"
   },
-  "action": {
-    "Ijaq50": "f1hysmiz",
-    "Br312pm": "f1379kmu",
-    "nk6f5a": "f11nczdl",
-    "Bw0ie65": "f98d4vj"
+  action: {
+    Ijaq50: "f1hysmiz",
+    Br312pm: "f1379kmu",
+    nk6f5a: "f11nczdl",
+    Bw0ie65: "f98d4vj"
   }
 }, {
-  "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;}"]
+  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;}"]
 });
 /**
  * Styles to be applied on internal elements used by default action on non-modal Dialog
  * @internal
  */
-
-
 export const useDialogTitleInternalStyles = /*#__PURE__*/__styles({
-  "button": {
-    "qhf8xq": "f10pi13n",
-    "B7ck84d": "f1e4lqlz",
-    "De3pzq": "f1u2r49w",
-    "sj55zd": "f1ym3bx4",
-    "Bahqtrf": "f1mo0ibp",
-    "Be2twd7": "fjoy568",
-    "Bceei9c": "f1k6fduh",
-    "Bg96gwp": "fez10in",
-    "B68tc82": "f1mtd64y",
-    "Bmxbyg5": "f1y7q3j9",
-    "z8tnut": "f1g0x7ka",
-    "z189sj": ["fhxju0i", "f1cnd47f"],
-    "Byoj8tv": "f1qch9an",
-    "uwmqm3": ["f1cnd47f", "fhxju0i"],
-    "icvyot": "f1ern45e",
-    "vrafjx": ["f1n71otn", "f1deefiw"],
-    "oivjwe": "f1h8hb77",
-    "wvpqe5": ["f1deefiw", "f1n71otn"],
-    "Bv0vk6g": "f37px4s",
-    "fsow6f": "fgusgyc",
-    "Brovlpu": "ftqa4ok",
-    "B486eqv": "f2hkw1w",
-    "B8q5s1w": "f8hki3x",
-    "Bci5o5g": ["f1d2448m", "ffh67wi"],
-    "n8qw10": "f1bjia2o",
-    "Bdrgwmp": ["ffh67wi", "f1d2448m"],
-    "Bm4h7ae": "f15bsgw9",
-    "B7ys5i9": "f14e48fq",
-    "Busjfv9": "f18yb2kv",
-    "Bhk32uz": "fd6o370",
-    "Bf4ptjt": "fh1cnn4",
-    "kclons": ["fy7oxxb", "f184ne2d"],
-    "Bhdgwq3": "fpukqih",
-    "Blkhhs4": ["f184ne2d", "fy7oxxb"],
-    "Bqtpl0w": "frrh606",
-    "clg4pj": ["f1v5zibi", "fo2hd23"],
-    "hgwjuy": "ful5kiu",
-    "Bonggc9": ["fo2hd23", "f1v5zibi"],
-    "B1tsrr9": ["f1jqcqds", "ftffrms"],
-    "Dah5zi": ["ftffrms", "f1jqcqds"],
-    "Bkh64rk": ["f2e7qr6", "fsr1zz6"],
-    "qqdqy8": ["fsr1zz6", "f2e7qr6"],
-    "B6dhp37": "f1dvezut",
-    "i03rao": ["fd0oaoj", "f1cwg4i8"],
-    "Boxcth7": "fjvm52t",
-    "Bsom6fd": ["f1cwg4i8", "fd0oaoj"],
-    "J0r882": "fdiulkx",
-    "Bjwuhne": "f1yalx80",
-    "Ghsupd": ["fq22d5a", "f1jw7pan"],
-    "Bule8hv": ["f1jw7pan", "fq22d5a"]
+  button: {
+    qhf8xq: "f10pi13n",
+    B7ck84d: "f1e4lqlz",
+    De3pzq: "f1u2r49w",
+    sj55zd: "f1ym3bx4",
+    Bahqtrf: "f1mo0ibp",
+    Be2twd7: "fjoy568",
+    Bceei9c: "f1k6fduh",
+    Bg96gwp: "fez10in",
+    B68tc82: "f1mtd64y",
+    Bmxbyg5: "f1y7q3j9",
+    z8tnut: "f1g0x7ka",
+    z189sj: ["fhxju0i", "f1cnd47f"],
+    Byoj8tv: "f1qch9an",
+    uwmqm3: ["f1cnd47f", "fhxju0i"],
+    icvyot: "f1ern45e",
+    vrafjx: ["f1n71otn", "f1deefiw"],
+    oivjwe: "f1h8hb77",
+    wvpqe5: ["f1deefiw", "f1n71otn"],
+    Bv0vk6g: "f37px4s",
+    fsow6f: "fgusgyc",
+    Brovlpu: "ftqa4ok",
+    B486eqv: "f2hkw1w",
+    B8q5s1w: "f8hki3x",
+    Bci5o5g: ["f1d2448m", "ffh67wi"],
+    n8qw10: "f1bjia2o",
+    Bdrgwmp: ["ffh67wi", "f1d2448m"],
+    Bm4h7ae: "f15bsgw9",
+    B7ys5i9: "f14e48fq",
+    Busjfv9: "f18yb2kv",
+    Bhk32uz: "fd6o370",
+    Bf4ptjt: "fh1cnn4",
+    kclons: ["fy7oxxb", "f184ne2d"],
+    Bhdgwq3: "fpukqih",
+    Blkhhs4: ["f184ne2d", "fy7oxxb"],
+    Bqtpl0w: "frrh606",
+    clg4pj: ["f1v5zibi", "fo2hd23"],
+    hgwjuy: "ful5kiu",
+    Bonggc9: ["fo2hd23", "f1v5zibi"],
+    B1tsrr9: ["f1jqcqds", "ftffrms"],
+    Dah5zi: ["ftffrms", "f1jqcqds"],
+    Bkh64rk: ["f2e7qr6", "fsr1zz6"],
+    qqdqy8: ["fsr1zz6", "f2e7qr6"],
+    B6dhp37: "f1dvezut",
+    i03rao: ["fd0oaoj", "f1cwg4i8"],
+    Boxcth7: "fjvm52t",
+    Bsom6fd: ["f1cwg4i8", "fd0oaoj"],
+    J0r882: "fdiulkx",
+    Bjwuhne: "f1yalx80",
+    Ghsupd: ["fq22d5a", "f1jw7pan"],
+    Bule8hv: ["f1jw7pan", "fq22d5a"]
   }
 }, {
-  "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;}"],
-  "f": [".ftqa4ok:focus{outline-style:none;}"],
-  "i": [".f2hkw1w:focus-visible{outline-style:none;}"]
+  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;}"],
+  f: [".ftqa4ok:focus{outline-style:none;}"],
+  i: [".f2hkw1w:focus-visible{outline-style:none;}"]
 });
 /**
  * Apply styling to the DialogTitle slots based on the state
  */
-
 export const useDialogTitleStyles_unstable = state => {
   const styles = useStyles();
   state.root.className = mergeClasses(dialogTitleClassNames.root, styles.root, !state.action && styles.rootWithoutCloseButton, state.root.className);
-
   if (state.action) {
     state.action.className = mergeClasses(dialogTitleClassNames.action, styles.action, state.action.className);
   }
-
   return state;
 };
 //# sourceMappingURL=useDialogTitleStyles.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTitle/useDialogTitleStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,gBAArD;AAGA,SAAS,gBAAT,QAAiC,uBAAjC;AACA,SAAS,sBAAT,EAAiC,eAAjC,QAAwD,0BAAxD;AACA,SAAS,uBAAT,QAAwC,yBAAxC;AAEA,OAAO,MAAM,qBAAqB,GAAqC;EACrE,IAAI,EAAE,iBAD+D;EAErE,MAAM,EAAE;AAF6D,CAAhE;AAKP;;AAEG;;AACH,MAAM,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,EAAlB;AAaA;;;AAGG;;;AACH,OAAO,MAAM,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,EAArC;AAmBP;;AAEG;;AACH,OAAO,MAAM,6BAA6B,GAAI,KAAD,IAA8C;EACzF,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,qBAAqB,CAAC,IADW,EAEjC,MAAM,CAAC,IAF0B,EAGjC,CAAC,KAAK,CAAC,MAAP,IAAiB,MAAM,CAAC,sBAHS,EAIjC,KAAK,CAAC,IAAN,CAAW,SAJsB,CAAnC;;EAMA,IAAI,KAAK,CAAC,MAAV,EAAkB;IAChB,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,YAAY,CAAC,qBAAqB,CAAC,MAAvB,EAA+B,MAAM,CAAC,MAAtC,EAA8C,KAAK,CAAC,MAAN,CAAa,SAA3D,CAArC;EACD;;EACD,OAAO,KAAP;AACD,CAZM","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"],"sourceRoot":"../src/"}
+{"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"]}

package/lib/components/DialogTrigger/DialogTrigger.js

@@ -10,12 +10,11 @@ import { renderDialogTrigger_unstable } from './renderDialogTrigger';
  * to it's wrapped child, but it won't be able to alter the dialog `open` state anymore,
  * in that case the user must provide a `controlled state`
  */
-
 export const DialogTrigger = props => {
   const state = useDialogTrigger_unstable(props);
   return renderDialogTrigger_unstable(state);
 };
-DialogTrigger.displayName = 'DialogTrigger'; // type casting here is required to ensure internal type FluentTriggerComponent is not leaked
-
+DialogTrigger.displayName = 'DialogTrigger';
+// type casting here is required to ensure internal type FluentTriggerComponent is not leaked
 DialogTrigger.isFluentTriggerComponent = true;
 //# sourceMappingURL=DialogTrigger.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-dialog/src/components/DialogTrigger/DialogTrigger.tsx"],"names":[],"mappings":"AACA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AAIA;;;;;;;;;AASG;;AACH,OAAO,MAAM,aAAa,GAAiC,KAAK,IAAG;EACjE,MAAM,KAAK,GAAG,yBAAyB,CAAC,KAAD,CAAvC;EAEA,OAAO,4BAA4B,CAAC,KAAD,CAAnC;AACD,CAJM;AAMP,aAAa,CAAC,WAAd,GAA4B,eAA5B,C,CACA;;AACC,aAAwC,CAAC,wBAAzC,GAAoE,IAApE","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"],"sourceRoot":"../src/"}
+{"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"]}