@fluentui/react-drawer 9.0.0-beta.12 → 9.0.0-beta.13

package/lib/components/DrawerOverlay/useDrawerOverlay.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { getNativeElementProps } from '@fluentui/react-utilities';
+import { getNativeElementProps, slot } from '@fluentui/react-utilities';
 import { DialogSurface } from '@fluentui/react-dialog';
 import { getDefaultDrawerProps } from '../../util/getDefaultDrawerProps';
 /**
@@ -18,9 +18,11 @@ import { getDefaultDrawerProps } from '../../util/getDefaultDrawerProps';
             root: DialogSurface,
             backdrop: 'div'
         },
-        root: getNativeElementProps('div', {
+        root: slot.always(getNativeElementProps('div', {
             ref,
             ...props
+        }), {
+            elementType: DialogSurface
         }),
         dialog: {
             open,

package/lib/components/DrawerOverlay/useDrawerOverlay.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerOverlay.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { DrawerOverlayProps, DrawerOverlayState } from './DrawerOverlay.types';\nimport { DialogProps, DialogSurface } from '@fluentui/react-dialog';\nimport { getDefaultDrawerProps } from '../../util/getDefaultDrawerProps';\n\n/**\n * Create the state required to render DrawerOverlay.\n *\n * The returned state can be modified with hooks such as useDrawerOverlayStyles_unstable,\n * before being passed to renderDrawerOverlay_unstable.\n *\n * @param props - props from this instance of DrawerOverlay\n * @param ref - reference to root HTMLElement of DrawerOverlay\n */\nexport const useDrawerOverlay_unstable = (\n  props: DrawerOverlayProps,\n  ref: React.Ref<HTMLElement>,\n): DrawerOverlayState => {\n  const { open, defaultOpen, size, position } = getDefaultDrawerProps(props);\n  const { modalType = 'modal', inertTrapFocus, onOpenChange } = props;\n\n  return {\n    components: {\n      root: DialogSurface,\n      backdrop: 'div',\n    },\n\n    root: getNativeElementProps('div', {\n      ref,\n      ...props,\n    }),\n    dialog: {\n      open,\n      defaultOpen,\n      onOpenChange,\n      inertTrapFocus,\n      modalType,\n    } as DialogProps,\n\n    size,\n    position,\n  };\n};\n"],"names":["React","getNativeElementProps","DialogSurface","getDefaultDrawerProps","useDrawerOverlay_unstable","props","ref","open","defaultOpen","size","position","modalType","inertTrapFocus","onOpenChange","components","root","backdrop","dialog"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,4BAA4B;AAElE,SAAsBC,aAAa,QAAQ,yBAAyB;AACpE,SAASC,qBAAqB,QAAQ,mCAAmC;AAEzE;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC,MACuB;IACvB,MAAM,EAAEC,KAAI,EAAEC,YAAW,EAAEC,KAAI,EAAEC,SAAQ,EAAE,GAAGP,sBAAsBE;IACpE,MAAM,EAAEM,WAAY,QAAO,EAAEC,eAAc,EAAEC,aAAY,EAAE,GAAGR;IAE9D,OAAO;QACLS,YAAY;YACVC,MAAMb;YACNc,UAAU;QACZ;QAEAD,MAAMd,sBAAsB,OAAO;YACjCK;YACA,GAAGD,KAAK;QACV;QACAY,QAAQ;YACNV;YACAC;YACAK;YACAD;YACAD;QACF;QAEAF;QACAC;IACF;AACF,EAAE"}
+{"version":3,"sources":["useDrawerOverlay.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport type { DrawerOverlayProps, DrawerOverlayState } from './DrawerOverlay.types';\nimport { DialogProps, DialogSurface } from '@fluentui/react-dialog';\nimport { getDefaultDrawerProps } from '../../util/getDefaultDrawerProps';\n\n/**\n * Create the state required to render DrawerOverlay.\n *\n * The returned state can be modified with hooks such as useDrawerOverlayStyles_unstable,\n * before being passed to renderDrawerOverlay_unstable.\n *\n * @param props - props from this instance of DrawerOverlay\n * @param ref - reference to root HTMLElement of DrawerOverlay\n */\nexport const useDrawerOverlay_unstable = (\n  props: DrawerOverlayProps,\n  ref: React.Ref<HTMLElement>,\n): DrawerOverlayState => {\n  const { open, defaultOpen, size, position } = getDefaultDrawerProps(props);\n  const { modalType = 'modal', inertTrapFocus, onOpenChange } = props;\n\n  return {\n    components: {\n      root: DialogSurface,\n      backdrop: 'div',\n    },\n\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: DialogSurface },\n    ),\n    dialog: {\n      open,\n      defaultOpen,\n      onOpenChange,\n      inertTrapFocus,\n      modalType,\n    } as DialogProps,\n\n    size,\n    position,\n  };\n};\n"],"names":["React","getNativeElementProps","slot","DialogSurface","getDefaultDrawerProps","useDrawerOverlay_unstable","props","ref","open","defaultOpen","size","position","modalType","inertTrapFocus","onOpenChange","components","root","backdrop","always","elementType","dialog"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAExE,SAAsBC,aAAa,QAAQ,yBAAyB;AACpE,SAASC,qBAAqB,QAAQ,mCAAmC;AAEzE;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC,MACuB;IACvB,MAAM,EAAEC,KAAI,EAAEC,YAAW,EAAEC,KAAI,EAAEC,SAAQ,EAAE,GAAGP,sBAAsBE;IACpE,MAAM,EAAEM,WAAY,QAAO,EAAEC,eAAc,EAAEC,aAAY,EAAE,GAAGR;IAE9D,OAAO;QACLS,YAAY;YACVC,MAAMb;YACNc,UAAU;QACZ;QAEAD,MAAMd,KAAKgB,MAAM,CACfjB,sBAAsB,OAAO;YAC3BM;YACA,GAAGD,KAAK;QACV,IACA;YAAEa,aAAahB;QAAc;QAE/BiB,QAAQ;YACNZ;YACAC;YACAK;YACAD;YACAD;QACF;QAEAF;QACAC;IACF;AACF,EAAE"}

package/lib/util/useDrawerBaseStyles.styles.js

@@ -50,6 +50,6 @@ export const useDrawerBaseStyles = /*#__PURE__*/__styles({
     B2u0y6b: "f1w39fev"
   }
 }, {
-  d: [".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f1krrbdw{border-bottom-right-radius:0;}", ".f1deotkl{border-bottom-left-radius:0;}", ".f10ostut{border-top-right-radius:0;}", ".f1ozlkrg{border-top-left-radius:0;}", ".fre7gi1{border-top-width:0;}", ".f1358rze{border-right-width:0;}", ".f1rvrf73{border-left-width:0;}", ".fqdk4by{border-bottom-width:0;}", ".f1w39fev{max-width:100vw;}", ".f11ysow2{height:auto;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f6jr5hl{-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;}", ".fbhxue7{-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1vgc2s3{left:0;}", ".f1e31b4d{right:0;}", ".fvfyk4{right:auto;}", ".frppm18{left:auto;}", ".f1nfxovz{width:320px;}", ".fb8d3vz{width:592px;}", ".fi96w9z{width:940px;}", ".fr97h3j{width:100vw;}"]
+  d: [".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f1krrbdw{border-bottom-right-radius:0;}", ".f1deotkl{border-bottom-left-radius:0;}", ".f10ostut{border-top-right-radius:0;}", ".f1ozlkrg{border-top-left-radius:0;}", ".fre7gi1{border-top-width:0;}", ".f1358rze{border-right-width:0;}", ".f1rvrf73{border-left-width:0;}", ".fqdk4by{border-bottom-width:0;}", ".f1w39fev{max-width:100vw;}", ".f11ysow2{height:auto;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:flex;}", ".f1vx9l62{flex-direction:column;}", ".f6jr5hl{align-items:flex-start;}", ".fbhxue7{justify-content:flex-start;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1vgc2s3{left:0;}", ".f1e31b4d{right:0;}", ".fvfyk4{right:auto;}", ".frppm18{left:auto;}", ".f1nfxovz{width:320px;}", ".fb8d3vz{width:592px;}", ".fi96w9z{width:940px;}", ".fr97h3j{width:100vw;}"]
 });
 //# sourceMappingURL=useDrawerBaseStyles.styles.js.map

package/lib-commonjs/components/Drawer/renderDrawer.js

@@ -9,6 +9,6 @@ Object.defineProperty(exports, "renderDrawer_unstable", {
 const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderDrawer_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlotsNext)(state);
-    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root);
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null);
 };

package/lib-commonjs/components/Drawer/renderDrawer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawer.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Drawer\n */ export const renderDrawer_unstable = (state)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root);\n};\n"],"names":["renderDrawer_unstable","state","slots","slotProps","getSlotsNext","createElement","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACtD;AAGlB,MAAMA,wBAAwB,CAACC,QAAQ;IAC9C,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,OAAO,WAAW,GAAGI,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI;AACjE"}
+{"version":3,"sources":["renderDrawer.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Drawer\n */ export const renderDrawer_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null);\n};\n"],"names":["renderDrawer_unstable","state","assertSlots","createElement","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,wBAAwB,CAACC,QAAQ;IAC9CC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACF,MAAMG,IAAI,EAAE,IAAI;AACvD"}

package/lib-commonjs/components/Drawer/useDrawer.js

@@ -17,11 +17,11 @@ const useDrawer_unstable = (props, ref)=>{
         components: {
             root: type === 'overlay' ? _drawerOverlay.DrawerOverlay : _drawerInline.DrawerInline
         },
-        root: (0, _reactUtilities.resolveShorthand)(props, {
-            required: true,
+        root: _reactUtilities.slot.always(props, {
             defaultProps: {
                 ref
-            }
+            },
+            elementType: type === 'overlay' ? _drawerOverlay.DrawerOverlay : _drawerInline.DrawerInline
         })
     };
 };

package/lib-commonjs/components/Drawer/useDrawer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawer.js"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { DrawerOverlay } from '../DrawerOverlay/DrawerOverlay';\nimport { DrawerInline } from '../DrawerInline/DrawerInline';\n/**\n * Create the state required to render Drawer.\n *\n * The returned state can be modified with hooks such as useDrawerStyles_unstable,\n * before being passed to renderDrawer_unstable.\n *\n * @param props - props from this instance of Drawer\n * @param ref - reference to root HTMLElement of Drawer\n */ export const useDrawer_unstable = (props, ref)=>{\n    const { type ='overlay'  } = props;\n    return {\n        components: {\n            root: type === 'overlay' ? DrawerOverlay : DrawerInline\n        },\n        root: resolveShorthand(props, {\n            required: true,\n            defaultProps: {\n                ref\n            }\n        })\n    };\n};\n"],"names":["useDrawer_unstable","props","ref","type","components","root","DrawerOverlay","DrawerInline","resolveShorthand","required","defaultProps"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACU;+BACH;8BACD;AASlB,MAAMA,qBAAqB,CAACC,OAAOC,MAAM;IAChD,MAAM,EAAEC,MAAM,UAAS,EAAG,GAAGF;IAC7B,OAAO;QACHG,YAAY;YACRC,MAAMF,SAAS,YAAYG,4BAAa,GAAGC,0BAAY;QAC3D;QACAF,MAAMG,IAAAA,gCAAgB,EAACP,OAAO;YAC1BQ,UAAU,IAAI;YACdC,cAAc;gBACVR;YACJ;QACJ;IACJ;AACJ"}
+{"version":3,"sources":["useDrawer.js"],"sourcesContent":["import * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport { DrawerOverlay } from '../DrawerOverlay/DrawerOverlay';\nimport { DrawerInline } from '../DrawerInline/DrawerInline';\n/**\n * Create the state required to render Drawer.\n *\n * The returned state can be modified with hooks such as useDrawerStyles_unstable,\n * before being passed to renderDrawer_unstable.\n *\n * @param props - props from this instance of Drawer\n * @param ref - reference to root HTMLElement of Drawer\n */ export const useDrawer_unstable = (props, ref)=>{\n    const { type ='overlay'  } = props;\n    return {\n        components: {\n            root: type === 'overlay' ? DrawerOverlay : DrawerInline\n        },\n        root: slot.always(props, {\n            defaultProps: {\n                ref\n            },\n            elementType: type === 'overlay' ? DrawerOverlay : DrawerInline\n        })\n    };\n};\n"],"names":["useDrawer_unstable","props","ref","type","components","root","DrawerOverlay","DrawerInline","slot","always","defaultProps","elementType"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACF;+BACS;8BACD;AASlB,MAAMA,qBAAqB,CAACC,OAAOC,MAAM;IAChD,MAAM,EAAEC,MAAM,UAAS,EAAG,GAAGF;IAC7B,OAAO;QACHG,YAAY;YACRC,MAAMF,SAAS,YAAYG,4BAAa,GAAGC,0BAAY;QAC3D;QACAF,MAAMG,oBAAI,CAACC,MAAM,CAACR,OAAO;YACrBS,cAAc;gBACVR;YACJ;YACAS,aAAaR,SAAS,YAAYG,4BAAa,GAAGC,0BAAY;QAClE;IACJ;AACJ"}

package/lib-commonjs/components/DrawerBody/renderDrawerBody.js

@@ -1,4 +1,4 @@
-"use strict";
+/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -6,10 +6,9 @@ Object.defineProperty(exports, "renderDrawerBody_unstable", {
     enumerable: true,
     get: ()=>renderDrawerBody_unstable
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderDrawerBody_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
-    return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root);
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null);
 };

package/lib-commonjs/components/DrawerBody/renderDrawerBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerBody.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerBody\n */ export const renderDrawerBody_unstable = (state)=>{\n    const { slots , slotProps  } = getSlots(state);\n    return /*#__PURE__*/ React.createElement(slots.root, slotProps.root);\n};\n"],"names":["renderDrawerBody_unstable","state","slots","slotProps","getSlots","React","createElement","root"],"mappings":";;;;+BAIiBA;;aAAAA;;;6DAJM;gCACE;AAGd,MAAMA,4BAA4B,CAACC,QAAQ;IAClD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,wBAAQ,EAACH;IACxC,OAAO,WAAW,GAAGI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEJ,UAAUI,IAAI;AACvE"}
+{"version":3,"sources":["renderDrawerBody.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerBody\n */ export const renderDrawerBody_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null);\n};\n"],"names":["renderDrawerBody_unstable","state","assertSlots","createElement","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,4BAA4B,CAACC,QAAQ;IAClDC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACF,MAAMG,IAAI,EAAE,IAAI;AACvD"}

package/lib-commonjs/components/DrawerBody/useDrawerBody.js

@@ -14,9 +14,11 @@ const useDrawerBody_unstable = (props, ref)=>{
         components: {
             root: 'div'
         },
-        root: (0, _reactUtilities.getNativeElementProps)('div', {
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('div', {
             ref,
             ...props
+        }), {
+            elementType: 'div'
         })
     };
 };

package/lib-commonjs/components/DrawerBody/useDrawerBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerBody.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerBody.\n *\n * The returned state can be modified with hooks such as useDrawerBodyStyles_unstable,\n * before being passed to renderDrawerBody_unstable.\n *\n * @param props - props from this instance of DrawerBody\n * @param ref - reference to root HTMLElement of DrawerBody\n */ export const useDrawerBody_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'div'\n        },\n        root: getNativeElementProps('div', {\n            ref,\n            ...props\n        })\n    };\n};\n"],"names":["useDrawerBody_unstable","props","ref","components","root","getNativeElementProps"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACe;AAS3B,MAAMA,yBAAyB,CAACC,OAAOC,MAAM;IACpD,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YAC/BH;YACA,GAAGD,KAAK;QACZ;IACJ;AACJ"}
+{"version":3,"sources":["useDrawerBody.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerBody.\n *\n * The returned state can be modified with hooks such as useDrawerBodyStyles_unstable,\n * before being passed to renderDrawerBody_unstable.\n *\n * @param props - props from this instance of DrawerBody\n * @param ref - reference to root HTMLElement of DrawerBody\n */ export const useDrawerBody_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props\n        }), {\n            elementType: 'div'\n        })\n    };\n};\n"],"names":["useDrawerBody_unstable","props","ref","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACqB;AASjC,MAAMA,yBAAyB,CAACC,OAAOC,MAAM;IACpD,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CL;YACA,GAAGD,KAAK;QACZ,IAAI;YACAO,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/components/DrawerBody/useDrawerBodyStyles.styles.js

@@ -67,15 +67,15 @@ const drawerBodyClassNames = {
         ".f1brlhvm{padding-bottom:1px;}",
         ".f1oy3dpc{overflow-x:auto;}",
         ".f5zp4f{overflow-y:auto;}",
-        ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}",
-        ".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}",
-        ".f1pztt34{-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;}",
-        ".f1ub7u0d{-webkit-align-self:stretch;-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch;}",
+        ".fqerorx{flex-grow:1;}",
+        ".f1neuvcm{flex-shrink:1;}",
+        ".f1pztt34{flex-basis:0;}",
+        ".f1ub7u0d{align-self:stretch;}",
         ".f1igvcbx{background-image:linear-gradient(to top, var(--colorNeutralBackground1), var(--colorNeutralBackground1)),linear-gradient(to top, var(--colorNeutralBackground1), var(--colorNeutralBackground1)),linear-gradient(to top, var(--colorNeutralStroke1), var(--colorNeutralBackground1)),linear-gradient(to bottom, var(--colorNeutralStroke1), var(--colorNeutralBackground1));}",
         ".f1fofb6i{-webkit-background-position:bottom center,top center,bottom center,top center;background-position:bottom center,top center,bottom center,top center;}",
         ".fo6xqva{background-repeat:no-repeat;}",
         ".fxugw4r{background-color:var(--colorNeutralBackground1);}",
-        ".fcre6b6{-webkit-background-size:100% 2px,100% 2px,100% 1px,100% 1px;background-size:100% 2px,100% 2px,100% 1px,100% 1px;}",
+        ".fcre6b6{background-size:100% 2px,100% 2px,100% 1px,100% 1px;}",
         ".f1besv5s{background-attachment:local,local,scroll,scroll;}",
         ".f1pqm9hp:last-child{padding-bottom:calc(var(--spacingHorizontalXXL) + 1px);}",
         ".f2c46kh:first-child{padding-top:calc(var(--spacingHorizontalXXL) + 1px);}"

package/lib-commonjs/components/DrawerBody/useDrawerBodyStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerBodyStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerBodyClassNames = {\n  root: 'fui-DrawerBody'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    B6of3ja: \"fkrn0sh\",\n    t21cq0: [\"f11qmguv\", \"f1tyq0we\"],\n    jrapky: \"fmxx68s\",\n    Frg6f3: [\"f1tyq0we\", \"f11qmguv\"],\n    z8tnut: \"f1sl3k7w\",\n    z189sj: [\"fnbas0t\", \"f1mswpri\"],\n    Byoj8tv: \"f1brlhvm\",\n    uwmqm3: [\"f1mswpri\", \"fnbas0t\"],\n    B68tc82: \"f1oy3dpc\",\n    Bmxbyg5: \"f5zp4f\",\n    Bh6795r: \"fqerorx\",\n    Bnnss6s: \"f1neuvcm\",\n    xawz: \"f1pztt34\",\n    qb2dma: \"f1ub7u0d\",\n    Bcmaq0h: \"f1igvcbx\",\n    B676am1: \"f1fofb6i\",\n    e5kdtc: \"fo6xqva\",\n    De3pzq: \"fxugw4r\",\n    Bkjc3bi: \"fcre6b6\",\n    Bgh53k4: \"f1besv5s\",\n    Bcx2cba: \"f1pqm9hp\",\n    gonrqn: \"f2c46kh\"\n  }\n}, {\n  d: [\".fkrn0sh{margin-top:-1px;}\", \".f11qmguv{margin-right:0;}\", \".f1tyq0we{margin-left:0;}\", \".fmxx68s{margin-bottom:-1px;}\", \".f1sl3k7w{padding-top:1px;}\", \".fnbas0t{padding-right:var(--spacingHorizontalXXL);}\", \".f1mswpri{padding-left:var(--spacingHorizontalXXL);}\", \".f1brlhvm{padding-bottom:1px;}\", \".f1oy3dpc{overflow-x:auto;}\", \".f5zp4f{overflow-y:auto;}\", \".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}\", \".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}\", \".f1pztt34{-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;}\", \".f1ub7u0d{-webkit-align-self:stretch;-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch;}\", \".f1igvcbx{background-image:linear-gradient(to top, var(--colorNeutralBackground1), var(--colorNeutralBackground1)),linear-gradient(to top, var(--colorNeutralBackground1), var(--colorNeutralBackground1)),linear-gradient(to top, var(--colorNeutralStroke1), var(--colorNeutralBackground1)),linear-gradient(to bottom, var(--colorNeutralStroke1), var(--colorNeutralBackground1));}\", \".f1fofb6i{-webkit-background-position:bottom center,top center,bottom center,top center;background-position:bottom center,top center,bottom center,top center;}\", \".fo6xqva{background-repeat:no-repeat;}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".fcre6b6{-webkit-background-size:100% 2px,100% 2px,100% 1px,100% 1px;background-size:100% 2px,100% 2px,100% 1px,100% 1px;}\", \".f1besv5s{background-attachment:local,local,scroll,scroll;}\", \".f1pqm9hp:last-child{padding-bottom:calc(var(--spacingHorizontalXXL) + 1px);}\", \".f2c46kh:first-child{padding-top:calc(var(--spacingHorizontalXXL) + 1px);}\"]\n});\n/**\n * Apply styling to the DrawerBody slots based on the state\n */\nexport const useDrawerBodyStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerBodyClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerBodyStyles.styles.js.map"],"names":["drawerBodyClassNames","useDrawerBodyStyles_unstable","root","useStyles","__styles","B6of3ja","t21cq0","jrapky","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","B68tc82","Bmxbyg5","Bh6795r","Bnnss6s","xawz","qb2dma","Bcmaq0h","B676am1","e5kdtc","De3pzq","Bkjc3bi","Bgh53k4","Bcx2cba","gonrqn","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,oBAAoB,MAApBA;IAqCAC,4BAA4B,MAA5BA;;uBAvCsC;AAE5C,MAAMD,uBAAuB;IAClCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,MAAM;QACNC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA8B;QAA8B;QAA6B;QAAiC;QAA+B;QAAwD;QAAwD;QAAkC;QAA+B;QAA6B;QAAqF;QAAuE;QAA2E;QAAoH;QAA2X;QAAmK;QAA0C;QAA8D;QAA8H;QAA+D;QAAiF;KAA6E;AACzqD;AAIO,MAAM1B,+BAA+B2B,CAAAA,QAAS;IACnD,MAAMC,SAAS1B;IACfyB,MAAM1B,IAAI,CAAC4B,SAAS,GAAGC,IAAAA,mBAAY,EAAC/B,qBAAqBE,IAAI,EAAE2B,OAAO3B,IAAI,EAAE0B,MAAM1B,IAAI,CAAC4B,SAAS;IAChG,OAAOF;AACT,GACA,sDAAsD"}
+{"version":3,"sources":["useDrawerBodyStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerBodyClassNames = {\n  root: 'fui-DrawerBody'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    B6of3ja: \"fkrn0sh\",\n    t21cq0: [\"f11qmguv\", \"f1tyq0we\"],\n    jrapky: \"fmxx68s\",\n    Frg6f3: [\"f1tyq0we\", \"f11qmguv\"],\n    z8tnut: \"f1sl3k7w\",\n    z189sj: [\"fnbas0t\", \"f1mswpri\"],\n    Byoj8tv: \"f1brlhvm\",\n    uwmqm3: [\"f1mswpri\", \"fnbas0t\"],\n    B68tc82: \"f1oy3dpc\",\n    Bmxbyg5: \"f5zp4f\",\n    Bh6795r: \"fqerorx\",\n    Bnnss6s: \"f1neuvcm\",\n    xawz: \"f1pztt34\",\n    qb2dma: \"f1ub7u0d\",\n    Bcmaq0h: \"f1igvcbx\",\n    B676am1: \"f1fofb6i\",\n    e5kdtc: \"fo6xqva\",\n    De3pzq: \"fxugw4r\",\n    Bkjc3bi: \"fcre6b6\",\n    Bgh53k4: \"f1besv5s\",\n    Bcx2cba: \"f1pqm9hp\",\n    gonrqn: \"f2c46kh\"\n  }\n}, {\n  d: [\".fkrn0sh{margin-top:-1px;}\", \".f11qmguv{margin-right:0;}\", \".f1tyq0we{margin-left:0;}\", \".fmxx68s{margin-bottom:-1px;}\", \".f1sl3k7w{padding-top:1px;}\", \".fnbas0t{padding-right:var(--spacingHorizontalXXL);}\", \".f1mswpri{padding-left:var(--spacingHorizontalXXL);}\", \".f1brlhvm{padding-bottom:1px;}\", \".f1oy3dpc{overflow-x:auto;}\", \".f5zp4f{overflow-y:auto;}\", \".fqerorx{flex-grow:1;}\", \".f1neuvcm{flex-shrink:1;}\", \".f1pztt34{flex-basis:0;}\", \".f1ub7u0d{align-self:stretch;}\", \".f1igvcbx{background-image:linear-gradient(to top, var(--colorNeutralBackground1), var(--colorNeutralBackground1)),linear-gradient(to top, var(--colorNeutralBackground1), var(--colorNeutralBackground1)),linear-gradient(to top, var(--colorNeutralStroke1), var(--colorNeutralBackground1)),linear-gradient(to bottom, var(--colorNeutralStroke1), var(--colorNeutralBackground1));}\", \".f1fofb6i{-webkit-background-position:bottom center,top center,bottom center,top center;background-position:bottom center,top center,bottom center,top center;}\", \".fo6xqva{background-repeat:no-repeat;}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".fcre6b6{background-size:100% 2px,100% 2px,100% 1px,100% 1px;}\", \".f1besv5s{background-attachment:local,local,scroll,scroll;}\", \".f1pqm9hp:last-child{padding-bottom:calc(var(--spacingHorizontalXXL) + 1px);}\", \".f2c46kh:first-child{padding-top:calc(var(--spacingHorizontalXXL) + 1px);}\"]\n});\n/**\n * Apply styling to the DrawerBody slots based on the state\n */\nexport const useDrawerBodyStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerBodyClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerBodyStyles.styles.js.map"],"names":["drawerBodyClassNames","useDrawerBodyStyles_unstable","root","useStyles","__styles","B6of3ja","t21cq0","jrapky","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","B68tc82","Bmxbyg5","Bh6795r","Bnnss6s","xawz","qb2dma","Bcmaq0h","B676am1","e5kdtc","De3pzq","Bkjc3bi","Bgh53k4","Bcx2cba","gonrqn","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,oBAAoB,MAApBA;IAqCAC,4BAA4B,MAA5BA;;uBAvCsC;AAE5C,MAAMD,uBAAuB;IAClCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,MAAM;QACNC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA8B;QAA8B;QAA6B;QAAiC;QAA+B;QAAwD;QAAwD;QAAkC;QAA+B;QAA6B;QAA0B;QAA6B;QAA4B;QAAkC;QAA2X;QAAmK;QAA0C;QAA8D;QAAkE;QAA+D;QAAiF;KAA6E;AACv4C;AAIO,MAAM1B,+BAA+B2B,CAAAA,QAAS;IACnD,MAAMC,SAAS1B;IACfyB,MAAM1B,IAAI,CAAC4B,SAAS,GAAGC,IAAAA,mBAAY,EAAC/B,qBAAqBE,IAAI,EAAE2B,OAAO3B,IAAI,EAAE0B,MAAM1B,IAAI,CAAC4B,SAAS;IAChG,OAAOF;AACT,GACA,sDAAsD"}

package/lib-commonjs/components/DrawerFooter/renderDrawerFooter.js

@@ -1,4 +1,4 @@
-"use strict";
+/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -6,10 +6,9 @@ Object.defineProperty(exports, "renderDrawerFooter_unstable", {
     enumerable: true,
     get: ()=>renderDrawerFooter_unstable
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderDrawerFooter_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
-    return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root);
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null);
 };

package/lib-commonjs/components/DrawerFooter/renderDrawerFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerFooter.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerFooter\n */ export const renderDrawerFooter_unstable = (state)=>{\n    const { slots , slotProps  } = getSlots(state);\n    return /*#__PURE__*/ React.createElement(slots.root, slotProps.root);\n};\n"],"names":["renderDrawerFooter_unstable","state","slots","slotProps","getSlots","React","createElement","root"],"mappings":";;;;+BAIiBA;;aAAAA;;;6DAJM;gCACE;AAGd,MAAMA,8BAA8B,CAACC,QAAQ;IACpD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,wBAAQ,EAACH;IACxC,OAAO,WAAW,GAAGI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEJ,UAAUI,IAAI;AACvE"}
+{"version":3,"sources":["renderDrawerFooter.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerFooter\n */ export const renderDrawerFooter_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null);\n};\n"],"names":["renderDrawerFooter_unstable","state","assertSlots","createElement","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,8BAA8B,CAACC,QAAQ;IACpDC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACF,MAAMG,IAAI,EAAE,IAAI;AACvD"}

package/lib-commonjs/components/DrawerFooter/useDrawerFooter.js

@@ -14,9 +14,11 @@ const useDrawerFooter_unstable = (props, ref)=>{
         components: {
             root: 'footer'
         },
-        root: (0, _reactUtilities.getNativeElementProps)('footer', {
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('footer', {
             ref,
             ...props
+        }), {
+            elementType: 'footer'
         })
     };
 };

package/lib-commonjs/components/DrawerFooter/useDrawerFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerFooter.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerFooter.\n *\n * The returned state can be modified with hooks such as useDrawerFooterStyles_unstable,\n * before being passed to renderDrawerFooter_unstable.\n *\n * @param props - props from this instance of DrawerFooter\n * @param ref - reference to root HTMLElement of DrawerFooter\n */ export const useDrawerFooter_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'footer'\n        },\n        root: getNativeElementProps('footer', {\n            ref,\n            ...props\n        })\n    };\n};\n"],"names":["useDrawerFooter_unstable","props","ref","components","root","getNativeElementProps"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACe;AAS3B,MAAMA,2BAA2B,CAACC,OAAOC,MAAM;IACtD,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,UAAU;YAClCH;YACA,GAAGD,KAAK;QACZ;IACJ;AACJ"}
+{"version":3,"sources":["useDrawerFooter.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerFooter.\n *\n * The returned state can be modified with hooks such as useDrawerFooterStyles_unstable,\n * before being passed to renderDrawerFooter_unstable.\n *\n * @param props - props from this instance of DrawerFooter\n * @param ref - reference to root HTMLElement of DrawerFooter\n */ export const useDrawerFooter_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'footer'\n        },\n        root: slot.always(getNativeElementProps('footer', {\n            ref,\n            ...props\n        }), {\n            elementType: 'footer'\n        })\n    };\n};\n"],"names":["useDrawerFooter_unstable","props","ref","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACqB;AASjC,MAAMA,2BAA2B,CAACC,OAAOC,MAAM;IACtD,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,UAAU;YAC9CL;YACA,GAAGD,KAAK;QACZ,IAAI;YACAO,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/components/DrawerFooter/useDrawerFooterStyles.styles.js

@@ -41,10 +41,10 @@ const drawerFooterClassNames = {
         ".fnbas0t{padding-right:var(--spacingHorizontalXXL);}",
         ".f1mswpri{padding-left:var(--spacingHorizontalXXL);}",
         ".fz66xbh{padding-bottom:var(--spacingVerticalXXL);}",
-        ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
-        ".fbhxue7{-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;}",
-        ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
-        ".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}"
+        ".f22iagw{display:flex;}",
+        ".fbhxue7{justify-content:flex-start;}",
+        ".f122n59{align-items:center;}",
+        ".fsnqrgy{column-gap:var(--spacingHorizontalS);}"
     ]
 });
 const useDrawerFooterStyles_unstable = (state)=>{

package/lib-commonjs/components/DrawerFooter/useDrawerFooterStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerFooterStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerFooterClassNames = {\n  root: 'fui-DrawerFooter'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    z8tnut: \"fikn0iw\",\n    z189sj: [\"fnbas0t\", \"f1mswpri\"],\n    Byoj8tv: \"fz66xbh\",\n    uwmqm3: [\"f1mswpri\", \"fnbas0t\"],\n    mc9l5x: \"f22iagw\",\n    Brf1p80: \"fbhxue7\",\n    Bt984gj: \"f122n59\",\n    i8kkvl: \"fsnqrgy\"\n  }\n}, {\n  d: [\".fikn0iw{padding-top:var(--spacingVerticalL);}\", \".fnbas0t{padding-right:var(--spacingHorizontalXXL);}\", \".f1mswpri{padding-left:var(--spacingHorizontalXXL);}\", \".fz66xbh{padding-bottom:var(--spacingVerticalXXL);}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".fbhxue7{-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}\"]\n});\n/**\n * Apply styling to the DrawerFooter slots based on the state\n */\nexport const useDrawerFooterStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerFooterClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerFooterStyles.styles.js.map"],"names":["drawerFooterClassNames","useDrawerFooterStyles_unstable","root","useStyles","__styles","z8tnut","z189sj","Byoj8tv","uwmqm3","mc9l5x","Brf1p80","Bt984gj","i8kkvl","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,sBAAsB,MAAtBA;IAuBAC,8BAA8B,MAA9BA;;uBAzBsC;AAE5C,MAAMD,yBAAyB;IACpCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAAkD;QAAwD;QAAwD;QAAuD;QAAwF;QAAuH;QAA2G;KAA+F;AACxnB;AAIO,MAAMZ,iCAAiCa,CAAAA,QAAS;IACrD,MAAMC,SAASZ;IACfW,MAAMZ,IAAI,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAACjB,uBAAuBE,IAAI,EAAEa,OAAOb,IAAI,EAAEY,MAAMZ,IAAI,CAACc,SAAS;IAClG,OAAOF;AACT,GACA,wDAAwD"}
+{"version":3,"sources":["useDrawerFooterStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerFooterClassNames = {\n  root: 'fui-DrawerFooter'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    z8tnut: \"fikn0iw\",\n    z189sj: [\"fnbas0t\", \"f1mswpri\"],\n    Byoj8tv: \"fz66xbh\",\n    uwmqm3: [\"f1mswpri\", \"fnbas0t\"],\n    mc9l5x: \"f22iagw\",\n    Brf1p80: \"fbhxue7\",\n    Bt984gj: \"f122n59\",\n    i8kkvl: \"fsnqrgy\"\n  }\n}, {\n  d: [\".fikn0iw{padding-top:var(--spacingVerticalL);}\", \".fnbas0t{padding-right:var(--spacingHorizontalXXL);}\", \".f1mswpri{padding-left:var(--spacingHorizontalXXL);}\", \".fz66xbh{padding-bottom:var(--spacingVerticalXXL);}\", \".f22iagw{display:flex;}\", \".fbhxue7{justify-content:flex-start;}\", \".f122n59{align-items:center;}\", \".fsnqrgy{column-gap:var(--spacingHorizontalS);}\"]\n});\n/**\n * Apply styling to the DrawerFooter slots based on the state\n */\nexport const useDrawerFooterStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerFooterClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerFooterStyles.styles.js.map"],"names":["drawerFooterClassNames","useDrawerFooterStyles_unstable","root","useStyles","__styles","z8tnut","z189sj","Byoj8tv","uwmqm3","mc9l5x","Brf1p80","Bt984gj","i8kkvl","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,sBAAsB,MAAtBA;IAuBAC,8BAA8B,MAA9BA;;uBAzBsC;AAE5C,MAAMD,yBAAyB;IACpCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAAkD;QAAwD;QAAwD;QAAuD;QAA2B;QAAyC;QAAiC;KAAkD;AACtX;AAIO,MAAMZ,iCAAiCa,CAAAA,QAAS;IACrD,MAAMC,SAASZ;IACfW,MAAMZ,IAAI,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAACjB,uBAAuBE,IAAI,EAAEa,OAAOb,IAAI,EAAEY,MAAMZ,IAAI,CAACc,SAAS;IAClG,OAAOF;AACT,GACA,wDAAwD"}

package/lib-commonjs/components/DrawerHeader/renderDrawerHeader.js

@@ -1,4 +1,4 @@
-"use strict";
+/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -6,10 +6,9 @@ Object.defineProperty(exports, "renderDrawerHeader_unstable", {
     enumerable: true,
     get: ()=>renderDrawerHeader_unstable
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderDrawerHeader_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
-    return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root);
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null);
 };

package/lib-commonjs/components/DrawerHeader/renderDrawerHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerHeader\n */ export const renderDrawerHeader_unstable = (state)=>{\n    const { slots , slotProps  } = getSlots(state);\n    return /*#__PURE__*/ React.createElement(slots.root, slotProps.root);\n};\n"],"names":["renderDrawerHeader_unstable","state","slots","slotProps","getSlots","React","createElement","root"],"mappings":";;;;+BAIiBA;;aAAAA;;;6DAJM;gCACE;AAGd,MAAMA,8BAA8B,CAACC,QAAQ;IACpD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,wBAAQ,EAACH;IACxC,OAAO,WAAW,GAAGI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEJ,UAAUI,IAAI;AACvE"}
+{"version":3,"sources":["renderDrawerHeader.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerHeader\n */ export const renderDrawerHeader_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null);\n};\n"],"names":["renderDrawerHeader_unstable","state","assertSlots","createElement","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,8BAA8B,CAACC,QAAQ;IACpDC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACF,MAAMG,IAAI,EAAE,IAAI;AACvD"}

package/lib-commonjs/components/DrawerHeader/useDrawerHeader.js

@@ -14,9 +14,11 @@ const useDrawerHeader_unstable = (props, ref)=>{
         components: {
             root: 'header'
         },
-        root: (0, _reactUtilities.getNativeElementProps)('header', {
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('header', {
             ref,
             ...props
+        }), {
+            elementType: 'header'
         })
     };
 };

package/lib-commonjs/components/DrawerHeader/useDrawerHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerHeader.\n *\n * The returned state can be modified with hooks such as useDrawerHeaderStyles_unstable,\n * before being passed to renderDrawerHeader_unstable.\n *\n * @param props - props from this instance of DrawerHeader\n * @param ref - reference to root HTMLElement of DrawerHeader\n */ export const useDrawerHeader_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'header'\n        },\n        root: getNativeElementProps('header', {\n            ref,\n            ...props\n        })\n    };\n};\n"],"names":["useDrawerHeader_unstable","props","ref","components","root","getNativeElementProps"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACe;AAS3B,MAAMA,2BAA2B,CAACC,OAAOC,MAAM;IACtD,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,UAAU;YAClCH;YACA,GAAGD,KAAK;QACZ;IACJ;AACJ"}
+{"version":3,"sources":["useDrawerHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerHeader.\n *\n * The returned state can be modified with hooks such as useDrawerHeaderStyles_unstable,\n * before being passed to renderDrawerHeader_unstable.\n *\n * @param props - props from this instance of DrawerHeader\n * @param ref - reference to root HTMLElement of DrawerHeader\n */ export const useDrawerHeader_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'header'\n        },\n        root: slot.always(getNativeElementProps('header', {\n            ref,\n            ...props\n        }), {\n            elementType: 'header'\n        })\n    };\n};\n"],"names":["useDrawerHeader_unstable","props","ref","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACqB;AASjC,MAAMA,2BAA2B,CAACC,OAAOC,MAAM;IACtD,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,UAAU;YAC9CL;YACA,GAAGD,KAAK;QACZ,IAAI;YACAO,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/components/DrawerHeader/useDrawerHeaderStyles.styles.js

@@ -42,11 +42,11 @@ const drawerHeaderClassNames = {
         ".fnbas0t{padding-right:var(--spacingHorizontalXXL);}",
         ".f1mswpri{padding-left:var(--spacingHorizontalXXL);}",
         ".f5b47ha{padding-bottom:var(--spacingVerticalS);}",
-        ".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}",
+        ".fsnqrgy{column-gap:var(--spacingHorizontalS);}",
         ".fylz90v{row-gap:var(--spacingHorizontalS);}",
-        ".f1ub7u0d{-webkit-align-self:stretch;-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch;}",
-        ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
-        ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}"
+        ".f1ub7u0d{align-self:stretch;}",
+        ".f22iagw{display:flex;}",
+        ".f1vx9l62{flex-direction:column;}"
     ]
 });
 const useDrawerHeaderStyles_unstable = (state)=>{

package/lib-commonjs/components/DrawerHeader/useDrawerHeaderStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeaderStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerHeaderClassNames = {\n  root: 'fui-DrawerHeader'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    z8tnut: \"f1ggmyuv\",\n    z189sj: [\"fnbas0t\", \"f1mswpri\"],\n    Byoj8tv: \"f5b47ha\",\n    uwmqm3: [\"f1mswpri\", \"fnbas0t\"],\n    i8kkvl: \"fsnqrgy\",\n    Belr9w4: \"fylz90v\",\n    qb2dma: \"f1ub7u0d\",\n    mc9l5x: \"f22iagw\",\n    Beiy3e4: \"f1vx9l62\"\n  }\n}, {\n  d: [\".f1ggmyuv{padding-top:var(--spacingVerticalXXL);}\", \".fnbas0t{padding-right:var(--spacingHorizontalXXL);}\", \".f1mswpri{padding-left:var(--spacingHorizontalXXL);}\", \".f5b47ha{padding-bottom:var(--spacingVerticalS);}\", \".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}\", \".fylz90v{row-gap:var(--spacingHorizontalS);}\", \".f1ub7u0d{-webkit-align-self:stretch;-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch;}\", \".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\"]\n});\n/**\n * Apply styling to the DrawerHeader slots based on the state\n */\nexport const useDrawerHeaderStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerHeaderClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerHeaderStyles.styles.js.map"],"names":["drawerHeaderClassNames","useDrawerHeaderStyles_unstable","root","useStyles","__styles","z8tnut","z189sj","Byoj8tv","uwmqm3","i8kkvl","Belr9w4","qb2dma","mc9l5x","Beiy3e4","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,sBAAsB,MAAtBA;IAwBAC,8BAA8B,MAA9BA;;uBA1BsC;AAE5C,MAAMD,yBAAyB;IACpCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAAqD;QAAwD;QAAwD;QAAqD;QAAgG;QAAgD;QAAoH;QAAwF;KAA4F;AACxpB;AAIO,MAAMb,iCAAiCc,CAAAA,QAAS;IACrD,MAAMC,SAASb;IACfY,MAAMb,IAAI,CAACe,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,uBAAuBE,IAAI,EAAEc,OAAOd,IAAI,EAAEa,MAAMb,IAAI,CAACe,SAAS;IAClG,OAAOF;AACT,GACA,wDAAwD"}
+{"version":3,"sources":["useDrawerHeaderStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerHeaderClassNames = {\n  root: 'fui-DrawerHeader'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    z8tnut: \"f1ggmyuv\",\n    z189sj: [\"fnbas0t\", \"f1mswpri\"],\n    Byoj8tv: \"f5b47ha\",\n    uwmqm3: [\"f1mswpri\", \"fnbas0t\"],\n    i8kkvl: \"fsnqrgy\",\n    Belr9w4: \"fylz90v\",\n    qb2dma: \"f1ub7u0d\",\n    mc9l5x: \"f22iagw\",\n    Beiy3e4: \"f1vx9l62\"\n  }\n}, {\n  d: [\".f1ggmyuv{padding-top:var(--spacingVerticalXXL);}\", \".fnbas0t{padding-right:var(--spacingHorizontalXXL);}\", \".f1mswpri{padding-left:var(--spacingHorizontalXXL);}\", \".f5b47ha{padding-bottom:var(--spacingVerticalS);}\", \".fsnqrgy{column-gap:var(--spacingHorizontalS);}\", \".fylz90v{row-gap:var(--spacingHorizontalS);}\", \".f1ub7u0d{align-self:stretch;}\", \".f22iagw{display:flex;}\", \".f1vx9l62{flex-direction:column;}\"]\n});\n/**\n * Apply styling to the DrawerHeader slots based on the state\n */\nexport const useDrawerHeaderStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerHeaderClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerHeaderStyles.styles.js.map"],"names":["drawerHeaderClassNames","useDrawerHeaderStyles_unstable","root","useStyles","__styles","z8tnut","z189sj","Byoj8tv","uwmqm3","i8kkvl","Belr9w4","qb2dma","mc9l5x","Beiy3e4","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,sBAAsB,MAAtBA;IAwBAC,8BAA8B,MAA9BA;;uBA1BsC;AAE5C,MAAMD,yBAAyB;IACpCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAAqD;QAAwD;QAAwD;QAAqD;QAAmD;QAAgD;QAAkC;QAA2B;KAAoC;AACpa;AAIO,MAAMb,iCAAiCc,CAAAA,QAAS;IACrD,MAAMC,SAASb;IACfY,MAAMb,IAAI,CAACe,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,uBAAuBE,IAAI,EAAEc,OAAOd,IAAI,EAAEa,MAAMb,IAAI,CAACe,SAAS;IAClG,OAAOF;AACT,GACA,wDAAwD"}

package/lib-commonjs/components/DrawerHeaderNavigation/renderDrawerHeaderNavigation.js

@@ -1,4 +1,4 @@
-"use strict";
+/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -6,10 +6,9 @@ Object.defineProperty(exports, "renderDrawerHeaderNavigation_unstable", {
     enumerable: true,
     get: ()=>renderDrawerHeaderNavigation_unstable
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderDrawerHeaderNavigation_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
-    return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root);
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null);
 };

package/lib-commonjs/components/DrawerHeaderNavigation/renderDrawerHeaderNavigation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerHeaderNavigation.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerHeaderNavigation\n */ export const renderDrawerHeaderNavigation_unstable = (state)=>{\n    const { slots , slotProps  } = getSlots(state);\n    return /*#__PURE__*/ React.createElement(slots.root, slotProps.root);\n};\n"],"names":["renderDrawerHeaderNavigation_unstable","state","slots","slotProps","getSlots","React","createElement","root"],"mappings":";;;;+BAIiBA;;aAAAA;;;6DAJM;gCACE;AAGd,MAAMA,wCAAwC,CAACC,QAAQ;IAC9D,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,wBAAQ,EAACH;IACxC,OAAO,WAAW,GAAGI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEJ,UAAUI,IAAI;AACvE"}
+{"version":3,"sources":["renderDrawerHeaderNavigation.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerHeaderNavigation\n */ export const renderDrawerHeaderNavigation_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null);\n};\n"],"names":["renderDrawerHeaderNavigation_unstable","state","assertSlots","createElement","root"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,wCAAwC,CAACC,QAAQ;IAC9DC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACF,MAAMG,IAAI,EAAE,IAAI;AACvD"}

package/lib-commonjs/components/DrawerHeaderNavigation/useDrawerHeaderNavigation.js

@@ -14,9 +14,11 @@ const useDrawerHeaderNavigation_unstable = (props, ref)=>{
         components: {
             root: 'nav'
         },
-        root: (0, _reactUtilities.getNativeElementProps)('nav', {
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('nav', {
             ref,
             ...props
+        }), {
+            elementType: 'nav'
         })
     };
 };

package/lib-commonjs/components/DrawerHeaderNavigation/useDrawerHeaderNavigation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeaderNavigation.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerHeaderNavigation.\n *\n * The returned state can be modified with hooks such as useDrawerHeaderNavigationStyles_unstable,\n * before being passed to renderDrawerHeaderNavigation_unstable.\n *\n * @param props - props from this instance of DrawerHeaderNavigation\n * @param ref - reference to root HTMLElement of DrawerHeaderNavigation\n */ export const useDrawerHeaderNavigation_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'nav'\n        },\n        root: getNativeElementProps('nav', {\n            ref,\n            ...props\n        })\n    };\n};\n"],"names":["useDrawerHeaderNavigation_unstable","props","ref","components","root","getNativeElementProps"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACe;AAS3B,MAAMA,qCAAqC,CAACC,OAAOC,MAAM;IAChE,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YAC/BH;YACA,GAAGD,KAAK;QACZ;IACJ;AACJ"}
+{"version":3,"sources":["useDrawerHeaderNavigation.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render DrawerHeaderNavigation.\n *\n * The returned state can be modified with hooks such as useDrawerHeaderNavigationStyles_unstable,\n * before being passed to renderDrawerHeaderNavigation_unstable.\n *\n * @param props - props from this instance of DrawerHeaderNavigation\n * @param ref - reference to root HTMLElement of DrawerHeaderNavigation\n */ export const useDrawerHeaderNavigation_unstable = (props, ref)=>{\n    return {\n        components: {\n            root: 'nav'\n        },\n        root: slot.always(getNativeElementProps('nav', {\n            ref,\n            ...props\n        }), {\n            elementType: 'nav'\n        })\n    };\n};\n"],"names":["useDrawerHeaderNavigation_unstable","props","ref","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;aAAAA;;;6DAVM;gCACqB;AASjC,MAAMA,qCAAqC,CAACC,OAAOC,MAAM;IAChE,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CL;YACA,GAAGD,KAAK;QACZ,IAAI;YACAO,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/components/DrawerHeaderNavigation/useDrawerHeaderNavigationStyles.styles.js

@@ -38,7 +38,7 @@ const drawerHeaderNavigationClassNames = {
         ".f1qb19o0{margin-right:calc(var(--spacingHorizontalL) * -1);}",
         ".f1p10pdi{margin-left:calc(var(--spacingHorizontalL) * -1);}",
         ".f118i8d9{margin-bottom:calc(var(--spacingVerticalS) * -1);}",
-        ".f1ftwmyh{-webkit-order:0;-ms-flex-order:0;order:0;}"
+        ".f1ftwmyh{order:0;}"
     ]
 });
 const useDrawerHeaderNavigationStyles_unstable = (state)=>{

package/lib-commonjs/components/DrawerHeaderNavigation/useDrawerHeaderNavigationStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeaderNavigationStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerHeaderNavigationClassNames = {\n  root: 'fui-DrawerHeaderNavigation'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    B6of3ja: \"f19304h5\",\n    t21cq0: [\"f1qb19o0\", \"f1p10pdi\"],\n    jrapky: \"f118i8d9\",\n    Frg6f3: [\"f1p10pdi\", \"f1qb19o0\"],\n    Bxn5svx: \"f1ftwmyh\"\n  }\n}, {\n  d: [\".f19304h5{margin-top:calc(var(--spacingVerticalS) * -1);}\", \".f1qb19o0{margin-right:calc(var(--spacingHorizontalL) * -1);}\", \".f1p10pdi{margin-left:calc(var(--spacingHorizontalL) * -1);}\", \".f118i8d9{margin-bottom:calc(var(--spacingVerticalS) * -1);}\", \".f1ftwmyh{-webkit-order:0;-ms-flex-order:0;order:0;}\"]\n});\n/**\n * Apply styling to the DrawerHeaderNavigation slots based on the state\n */\nexport const useDrawerHeaderNavigationStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerHeaderNavigationClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerHeaderNavigationStyles.styles.js.map"],"names":["drawerHeaderNavigationClassNames","useDrawerHeaderNavigationStyles_unstable","root","useStyles","__styles","B6of3ja","t21cq0","jrapky","Frg6f3","Bxn5svx","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,gCAAgC,MAAhCA;IAoBAC,wCAAwC,MAAxCA;;uBAtBsC;AAE5C,MAAMD,mCAAmC;IAC9CE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA6D;QAAiE;QAAgE;QAAgE;KAAuD;AAC3T;AAIO,MAAMT,2CAA2CU,CAAAA,QAAS;IAC/D,MAAMC,SAAST;IACfQ,MAAMT,IAAI,CAACW,SAAS,GAAGC,IAAAA,mBAAY,EAACd,iCAAiCE,IAAI,EAAEU,OAAOV,IAAI,EAAES,MAAMT,IAAI,CAACW,SAAS;IAC5G,OAAOF;AACT,GACA,kEAAkE"}
+{"version":3,"sources":["useDrawerHeaderNavigationStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerHeaderNavigationClassNames = {\n  root: 'fui-DrawerHeaderNavigation'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    B6of3ja: \"f19304h5\",\n    t21cq0: [\"f1qb19o0\", \"f1p10pdi\"],\n    jrapky: \"f118i8d9\",\n    Frg6f3: [\"f1p10pdi\", \"f1qb19o0\"],\n    Bxn5svx: \"f1ftwmyh\"\n  }\n}, {\n  d: [\".f19304h5{margin-top:calc(var(--spacingVerticalS) * -1);}\", \".f1qb19o0{margin-right:calc(var(--spacingHorizontalL) * -1);}\", \".f1p10pdi{margin-left:calc(var(--spacingHorizontalL) * -1);}\", \".f118i8d9{margin-bottom:calc(var(--spacingVerticalS) * -1);}\", \".f1ftwmyh{order:0;}\"]\n});\n/**\n * Apply styling to the DrawerHeaderNavigation slots based on the state\n */\nexport const useDrawerHeaderNavigationStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(drawerHeaderNavigationClassNames.root, styles.root, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useDrawerHeaderNavigationStyles.styles.js.map"],"names":["drawerHeaderNavigationClassNames","useDrawerHeaderNavigationStyles_unstable","root","useStyles","__styles","B6of3ja","t21cq0","jrapky","Frg6f3","Bxn5svx","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,gCAAgC,MAAhCA;IAoBAC,wCAAwC,MAAxCA;;uBAtBsC;AAE5C,MAAMD,mCAAmC;IAC9CE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCF,MAAM;QACJG,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAA6D;QAAiE;QAAgE;QAAgE;KAAsB;AAC1R;AAIO,MAAMT,2CAA2CU,CAAAA,QAAS;IAC/D,MAAMC,SAAST;IACfQ,MAAMT,IAAI,CAACW,SAAS,GAAGC,IAAAA,mBAAY,EAACd,iCAAiCE,IAAI,EAAEU,OAAOV,IAAI,EAAES,MAAMT,IAAI,CAACW,SAAS;IAC5G,OAAOF;AACT,GACA,kEAAkE"}

package/lib-commonjs/components/DrawerHeaderTitle/renderDrawerHeaderTitle.js

@@ -1,4 +1,4 @@
-"use strict";
+/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -6,10 +6,9 @@ Object.defineProperty(exports, "renderDrawerHeaderTitle_unstable", {
     enumerable: true,
     get: ()=>renderDrawerHeaderTitle_unstable
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
 const _reactUtilities = require("@fluentui/react-utilities");
 const renderDrawerHeaderTitle_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
-    return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root, slots.heading && /*#__PURE__*/ _react.createElement(slots.heading, slotProps.heading), slots.action && /*#__PURE__*/ _react.createElement(slots.action, slotProps.action));
+    (0, _reactUtilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null, state.heading && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.heading, null), state.action && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.action, null));
 };

package/lib-commonjs/components/DrawerHeaderTitle/renderDrawerHeaderTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerHeaderTitle.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerHeaderTitle\n */ export const renderDrawerHeaderTitle_unstable = (state)=>{\n    const { slots , slotProps  } = getSlots(state);\n    return /*#__PURE__*/ React.createElement(slots.root, slotProps.root, slots.heading && /*#__PURE__*/ React.createElement(slots.heading, slotProps.heading), slots.action && /*#__PURE__*/ React.createElement(slots.action, slotProps.action));\n};\n"],"names":["renderDrawerHeaderTitle_unstable","state","slots","slotProps","getSlots","React","createElement","root","heading","action"],"mappings":";;;;+BAIiBA;;aAAAA;;;6DAJM;gCACE;AAGd,MAAMA,mCAAmC,CAACC,QAAQ;IACzD,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,wBAAQ,EAACH;IACxC,OAAO,WAAW,GAAGI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEJ,UAAUI,IAAI,EAAEL,MAAMM,OAAO,IAAI,WAAW,GAAGH,OAAMC,aAAa,CAACJ,MAAMM,OAAO,EAAEL,UAAUK,OAAO,GAAGN,MAAMO,MAAM,IAAI,WAAW,GAAGJ,OAAMC,aAAa,CAACJ,MAAMO,MAAM,EAAEN,UAAUM,MAAM;AAC/O"}
+{"version":3,"sources":["renderDrawerHeaderTitle.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of DrawerHeaderTitle\n */ export const renderDrawerHeaderTitle_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null, state.heading && /*#__PURE__*/ createElement(state.heading, null), state.action && /*#__PURE__*/ createElement(state.action, null));\n};\n"],"names":["renderDrawerHeaderTitle_unstable","state","assertSlots","createElement","root","heading","action"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACvD;AAGjB,MAAMA,mCAAmC,CAACC,QAAQ;IACzDC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,8BAAa,EAACF,MAAMG,IAAI,EAAE,IAAI,EAAEH,MAAMI,OAAO,IAAI,WAAW,GAAGF,IAAAA,8BAAa,EAACF,MAAMI,OAAO,EAAE,IAAI,GAAGJ,MAAMK,MAAM,IAAI,WAAW,GAAGH,IAAAA,8BAAa,EAACF,MAAMK,MAAM,EAAE,IAAI;AAC1L"}

package/lib-commonjs/components/DrawerHeaderTitle/useDrawerHeaderTitle.js

@@ -18,19 +18,23 @@ const useDrawerHeaderTitle_unstable = (props, ref)=>{
             heading: titleComponents.root,
             action: titleComponents.action
         },
-        root: (0, _reactUtilities.getNativeElementProps)('div', {
+        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('div', {
             ref,
             ...props
+        }), {
+            elementType: 'div'
         }),
-        heading: (0, _reactUtilities.resolveShorthand)(props.heading, {
-            required: true,
+        heading: _reactUtilities.slot.optional(props.heading, {
+            renderByDefault: true,
             defaultProps: {
                 ...heading,
                 className: undefined
-            }
+            },
+            elementType: titleComponents.root
         }),
-        action: (0, _reactUtilities.resolveShorthand)(props.action, {
-            defaultProps: action
+        action: _reactUtilities.slot.optional(props.action, {
+            defaultProps: action,
+            elementType: titleComponents.action
         })
     };
 };

package/lib-commonjs/components/DrawerHeaderTitle/useDrawerHeaderTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeaderTitle.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { useDialogTitle_unstable } from '@fluentui/react-dialog';\n/**\n * Create the state required to render DrawerHeaderTitle.\n *\n * The returned state can be modified with hooks such as useDrawerHeaderTitleStyles_unstable,\n * before being passed to renderDrawerHeaderTitle_unstable.\n *\n * @param props - props from this instance of DrawerHeaderTitle\n * @param ref - reference to root HTMLElement of DrawerHeaderTitle\n */ export const useDrawerHeaderTitle_unstable = (props, ref)=>{\n    const { root: heading , action , components: titleComponents  } = useDialogTitle_unstable(props, ref);\n    return {\n        components: {\n            root: 'div',\n            heading: titleComponents.root,\n            action: titleComponents.action\n        },\n        root: getNativeElementProps('div', {\n            ref,\n            ...props\n        }),\n        heading: resolveShorthand(props.heading, {\n            required: true,\n            defaultProps: {\n                ...heading,\n                className: undefined\n            }\n        }),\n        action: resolveShorthand(props.action, {\n            defaultProps: action\n        })\n    };\n};\n"],"names":["useDrawerHeaderTitle_unstable","props","ref","root","heading","action","components","titleComponents","useDialogTitle_unstable","getNativeElementProps","resolveShorthand","required","defaultProps","className","undefined"],"mappings":";;;;+BAWiBA;;aAAAA;;;6DAXM;gCACiC;6BAChB;AAS7B,MAAMA,gCAAgC,CAACC,OAAOC,MAAM;IAC3D,MAAM,EAAEC,MAAMC,QAAO,EAAGC,OAAM,EAAGC,YAAYC,gBAAe,EAAG,GAAGC,IAAAA,oCAAuB,EAACP,OAAOC;IACjG,OAAO;QACHI,YAAY;YACRH,MAAM;YACNC,SAASG,gBAAgBJ,IAAI;YAC7BE,QAAQE,gBAAgBF,MAAM;QAClC;QACAF,MAAMM,IAAAA,qCAAqB,EAAC,OAAO;YAC/BP;YACA,GAAGD,KAAK;QACZ;QACAG,SAASM,IAAAA,gCAAgB,EAACT,MAAMG,OAAO,EAAE;YACrCO,UAAU,IAAI;YACdC,cAAc;gBACV,GAAGR,OAAO;gBACVS,WAAWC;YACf;QACJ;QACAT,QAAQK,IAAAA,gCAAgB,EAACT,MAAMI,MAAM,EAAE;YACnCO,cAAcP;QAClB;IACJ;AACJ"}
+{"version":3,"sources":["useDrawerHeaderTitle.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useDialogTitle_unstable } from '@fluentui/react-dialog';\n/**\n * Create the state required to render DrawerHeaderTitle.\n *\n * The returned state can be modified with hooks such as useDrawerHeaderTitleStyles_unstable,\n * before being passed to renderDrawerHeaderTitle_unstable.\n *\n * @param props - props from this instance of DrawerHeaderTitle\n * @param ref - reference to root HTMLElement of DrawerHeaderTitle\n */ export const useDrawerHeaderTitle_unstable = (props, ref)=>{\n    const { root: heading , action , components: titleComponents  } = useDialogTitle_unstable(props, ref);\n    return {\n        components: {\n            root: 'div',\n            heading: titleComponents.root,\n            action: titleComponents.action\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        heading: slot.optional(props.heading, {\n            renderByDefault: true,\n            defaultProps: {\n                ...heading,\n                className: undefined\n            },\n            elementType: titleComponents.root\n        }),\n        action: slot.optional(props.action, {\n            defaultProps: action,\n            elementType: titleComponents.action\n        })\n    };\n};\n"],"names":["useDrawerHeaderTitle_unstable","props","ref","root","heading","action","components","titleComponents","useDialogTitle_unstable","slot","always","getNativeElementProps","elementType","optional","renderByDefault","defaultProps","className","undefined"],"mappings":";;;;+BAWiBA;;aAAAA;;;6DAXM;gCACqB;6BACJ;AAS7B,MAAMA,gCAAgC,CAACC,OAAOC,MAAM;IAC3D,MAAM,EAAEC,MAAMC,QAAO,EAAGC,OAAM,EAAGC,YAAYC,gBAAe,EAAG,GAAGC,IAAAA,oCAAuB,EAACP,OAAOC;IACjG,OAAO;QACHI,YAAY;YACRH,MAAM;YACNC,SAASG,gBAAgBJ,IAAI;YAC7BE,QAAQE,gBAAgBF,MAAM;QAClC;QACAF,MAAMM,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CT;YACA,GAAGD,KAAK;QACZ,IAAI;YACAW,aAAa;QACjB;QACAR,SAASK,oBAAI,CAACI,QAAQ,CAACZ,MAAMG,OAAO,EAAE;YAClCU,iBAAiB,IAAI;YACrBC,cAAc;gBACV,GAAGX,OAAO;gBACVY,WAAWC;YACf;YACAL,aAAaL,gBAAgBJ,IAAI;QACrC;QACAE,QAAQI,oBAAI,CAACI,QAAQ,CAACZ,MAAMI,MAAM,EAAE;YAChCU,cAAcV;YACdO,aAAaL,gBAAgBF,MAAM;QACvC;IACJ;AACJ"}

package/lib-commonjs/components/DrawerHeaderTitle/useDrawerHeaderTitleStyles.styles.js

@@ -36,10 +36,10 @@ const drawerHeaderTitleClassNames = {
     }
 }, {
     d: [
-        ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}",
-        ".f1869bpl{-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}",
-        ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
-        ".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}",
+        ".f22iagw{display:flex;}",
+        ".f1869bpl{justify-content:space-between;}",
+        ".f122n59{align-items:center;}",
+        ".fsnqrgy{column-gap:var(--spacingHorizontalS);}",
         ".faqnl2i{margin-right:calc(var(--spacingHorizontalS) * -1);}",
         ".fd75udd{margin-left:calc(var(--spacingHorizontalS) * -1);}"
     ]

package/lib-commonjs/components/DrawerHeaderTitle/useDrawerHeaderTitleStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeaderTitleStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses } from '@griffel/react';\nimport { useDialogTitleStyles_unstable } from '@fluentui/react-dialog';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerHeaderTitleClassNames = {\n  root: 'fui-DrawerHeaderTitle',\n  heading: 'fui-DrawerHeaderTitle__heading',\n  action: 'fui-DrawerHeaderTitle__action'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Brf1p80: \"f1869bpl\",\n    Bt984gj: \"f122n59\",\n    i8kkvl: \"fsnqrgy\"\n  },\n  action: {\n    t21cq0: [\"faqnl2i\", \"fd75udd\"]\n  }\n}, {\n  d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f1869bpl{-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".fsnqrgy{-webkit-column-gap:var(--spacingHorizontalS);column-gap:var(--spacingHorizontalS);}\", \".faqnl2i{margin-right:calc(var(--spacingHorizontalS) * -1);}\", \".fd75udd{margin-left:calc(var(--spacingHorizontalS) * -1);}\"]\n});\n/**\n * Apply styling to the DrawerHeaderTitle slots based on the state\n */\nexport const useDrawerHeaderTitleStyles_unstable = state => {\n  const styles = useStyles();\n  const {\n    heading: root = {},\n    action,\n    components\n  } = state;\n  useDialogTitleStyles_unstable({\n    components: {\n      root: components.heading,\n      action: components.action\n    },\n    root,\n    action\n  });\n  state.root.className = mergeClasses(drawerHeaderTitleClassNames.root, styles.root, state.root.className);\n  if (state.heading) {\n    state.heading.className = mergeClasses(drawerHeaderTitleClassNames.heading, state.heading.className);\n  }\n  if (state.action) {\n    state.action.className = mergeClasses(drawerHeaderTitleClassNames.action, styles.action, state.action.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useDrawerHeaderTitleStyles.styles.js.map"],"names":["drawerHeaderTitleClassNames","useDrawerHeaderTitleStyles_unstable","root","heading","action","useStyles","__styles","mc9l5x","Brf1p80","Bt984gj","i8kkvl","t21cq0","d","state","styles","components","useDialogTitleStyles_unstable","className","mergeClasses"],"mappings":";;;;;;;;;;;IAGaA,2BAA2B,MAA3BA;IAwBAC,mCAAmC,MAAnCA;;uBA3B0B;6BACO;AAEvC,MAAMD,8BAA8B;IACzCE,MAAM;IACNC,SAAS;IACTC,QAAQ;AACV;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCJ,MAAM;QACJK,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;IACAN,QAAQ;QACNO,QAAQ;YAAC;YAAW;SAAU;IAChC;AACF,GAAG;IACDC,GAAG;QAAC;QAAwF;QAA4G;QAA2G;QAAgG;QAAgE;KAA8D;AACnhB;AAIO,MAAMX,sCAAsCY,CAAAA,QAAS;IAC1D,MAAMC,SAAST;IACf,MAAM,EACJF,SAASD,OAAO,CAAC,CAAC,CAAA,EAClBE,OAAM,EACNW,WAAU,EACX,GAAGF;IACJG,IAAAA,0CAA6B,EAAC;QAC5BD,YAAY;YACVb,MAAMa,WAAWZ,OAAO;YACxBC,QAAQW,WAAWX,MAAM;QAC3B;QACAF;QACAE;IACF;IACAS,MAAMX,IAAI,CAACe,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,4BAA4BE,IAAI,EAAEY,OAAOZ,IAAI,EAAEW,MAAMX,IAAI,CAACe,SAAS;IACvG,IAAIJ,MAAMV,OAAO,EAAE;QACjBU,MAAMV,OAAO,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,4BAA4BG,OAAO,EAAEU,MAAMV,OAAO,CAACc,SAAS;IACrG,CAAC;IACD,IAAIJ,MAAMT,MAAM,EAAE;QAChBS,MAAMT,MAAM,CAACa,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,4BAA4BI,MAAM,EAAEU,OAAOV,MAAM,EAAES,MAAMT,MAAM,CAACa,SAAS;IACjH,CAAC;IACD,OAAOJ;AACT,GACA,6DAA6D"}
+{"version":3,"sources":["useDrawerHeaderTitleStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses } from '@griffel/react';\nimport { useDialogTitleStyles_unstable } from '@fluentui/react-dialog';\nimport { tokens } from '@fluentui/react-theme';\nexport const drawerHeaderTitleClassNames = {\n  root: 'fui-DrawerHeaderTitle',\n  heading: 'fui-DrawerHeaderTitle__heading',\n  action: 'fui-DrawerHeaderTitle__action'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Brf1p80: \"f1869bpl\",\n    Bt984gj: \"f122n59\",\n    i8kkvl: \"fsnqrgy\"\n  },\n  action: {\n    t21cq0: [\"faqnl2i\", \"fd75udd\"]\n  }\n}, {\n  d: [\".f22iagw{display:flex;}\", \".f1869bpl{justify-content:space-between;}\", \".f122n59{align-items:center;}\", \".fsnqrgy{column-gap:var(--spacingHorizontalS);}\", \".faqnl2i{margin-right:calc(var(--spacingHorizontalS) * -1);}\", \".fd75udd{margin-left:calc(var(--spacingHorizontalS) * -1);}\"]\n});\n/**\n * Apply styling to the DrawerHeaderTitle slots based on the state\n */\nexport const useDrawerHeaderTitleStyles_unstable = state => {\n  const styles = useStyles();\n  const {\n    heading: root = {},\n    action,\n    components\n  } = state;\n  useDialogTitleStyles_unstable({\n    components: {\n      root: components.heading,\n      action: components.action\n    },\n    root,\n    action\n  });\n  state.root.className = mergeClasses(drawerHeaderTitleClassNames.root, styles.root, state.root.className);\n  if (state.heading) {\n    state.heading.className = mergeClasses(drawerHeaderTitleClassNames.heading, state.heading.className);\n  }\n  if (state.action) {\n    state.action.className = mergeClasses(drawerHeaderTitleClassNames.action, styles.action, state.action.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useDrawerHeaderTitleStyles.styles.js.map"],"names":["drawerHeaderTitleClassNames","useDrawerHeaderTitleStyles_unstable","root","heading","action","useStyles","__styles","mc9l5x","Brf1p80","Bt984gj","i8kkvl","t21cq0","d","state","styles","components","useDialogTitleStyles_unstable","className","mergeClasses"],"mappings":";;;;;;;;;;;IAGaA,2BAA2B,MAA3BA;IAwBAC,mCAAmC,MAAnCA;;uBA3B0B;6BACO;AAEvC,MAAMD,8BAA8B;IACzCE,MAAM;IACNC,SAAS;IACTC,QAAQ;AACV;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCJ,MAAM;QACJK,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;IACAN,QAAQ;QACNO,QAAQ;YAAC;YAAW;SAAU;IAChC;AACF,GAAG;IACDC,GAAG;QAAC;QAA2B;QAA6C;QAAiC;QAAmD;QAAgE;KAA8D;AAChS;AAIO,MAAMX,sCAAsCY,CAAAA,QAAS;IAC1D,MAAMC,SAAST;IACf,MAAM,EACJF,SAASD,OAAO,CAAC,CAAC,CAAA,EAClBE,OAAM,EACNW,WAAU,EACX,GAAGF;IACJG,IAAAA,0CAA6B,EAAC;QAC5BD,YAAY;YACVb,MAAMa,WAAWZ,OAAO;YACxBC,QAAQW,WAAWX,MAAM;QAC3B;QACAF;QACAE;IACF;IACAS,MAAMX,IAAI,CAACe,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,4BAA4BE,IAAI,EAAEY,OAAOZ,IAAI,EAAEW,MAAMX,IAAI,CAACe,SAAS;IACvG,IAAIJ,MAAMV,OAAO,EAAE;QACjBU,MAAMV,OAAO,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,4BAA4BG,OAAO,EAAEU,MAAMV,OAAO,CAACc,SAAS;IACrG,CAAC;IACD,IAAIJ,MAAMT,MAAM,EAAE;QAChBS,MAAMT,MAAM,CAACa,SAAS,GAAGC,IAAAA,mBAAY,EAAClB,4BAA4BI,MAAM,EAAEU,OAAOV,MAAM,EAAES,MAAMT,MAAM,CAACa,SAAS;IACjH,CAAC;IACD,OAAOJ;AACT,GACA,6DAA6D"}