@fluentui/react-drawer 9.0.0-beta.20 → 9.0.0-beta.22

package/CHANGELOG.json

@@ -2,7 +2,127 @@
   "name": "@fluentui/react-drawer",
   "entries": [
     {
-      "date": "Tue, 29 Aug 2023 12:53:36 GMT",
+      "date": "Tue, 05 Sep 2023 15:35:06 GMT",
+      "tag": "@fluentui/react-drawer_v9.0.0-beta.22",
+      "version": "9.0.0-beta.22",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "marcosvmmoura@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91",
+            "comment": "refactor: organize code imports"
+          },
+          {
+            "author": "marcosvmmoura@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "c6a8055e413d7efca7c968e11b70638f869b610a",
+            "comment": "test: add e2e tests for base Drawer components"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-dialog to v9.6.2",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-jsx-runtime to v9.0.5",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-motion-preview to v0.2.1",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-utilities to v9.13.2",
+            "commit": "94019033dfe3fd39ec0cde7dfb3b57c22805aa91"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 05 Sep 2023 13:29:22 GMT",
+      "tag": "@fluentui/react-drawer_v9.0.0-beta.21",
+      "version": "9.0.0-beta.21",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "marcosvmmoura@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "6363e77de4ed560ea8dbd53f5eb0511b65f19b77",
+            "comment": "fix: refactor DrawerHeaderTitle slot creation while keeping the same API"
+          },
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "eea6d93a62249ba4fba3347fb291c67ee1a3fb24",
+            "comment": "chore: migrate package to use JSX importSource"
+          },
+          {
+            "author": "bernardo.sunderhus@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "b93c2ac22355b6cb6f33dd509c6cd9c21f4fffc8",
+            "comment": "bumps @swc/helpers version to 0.5.1"
+          },
+          {
+            "author": "marcosvmmoura@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "c506263acc723358ae1d5ead3f9448b1bf1c49bd",
+            "comment": "test: add simple renderization tests for sub components"
+          },
+          {
+            "author": "marcosvmmoura@gmail.com",
+            "package": "@fluentui/react-drawer",
+            "commit": "b27e08e64320103ff77f1aed3ed05a592485acb9",
+            "comment": "feat: add motion for Drawer"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-dialog to v9.6.1",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-jsx-runtime to v9.0.4",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-motion-preview to v0.2.0",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.7.3",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-theme to v9.1.12",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-drawer",
+            "comment": "Bump @fluentui/react-utilities to v9.13.1",
+            "commit": "da959e66f36b429e40ae61810d08dc71c16e154a"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 29 Aug 2023 12:57:36 GMT",
       "tag": "@fluentui/react-drawer_v9.0.0-beta.20",
       "version": "9.0.0-beta.20",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,45 @@
 # Change Log - @fluentui/react-drawer
 
-This log was last generated on Tue, 29 Aug 2023 12:53:36 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Sep 2023 15:35:06 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.0.0-beta.22](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.22)
+
+Tue, 05 Sep 2023 15:35:06 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.21..@fluentui/react-drawer_v9.0.0-beta.22)
+
+### Changes
+
+- refactor: organize code imports ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by marcosvmmoura@gmail.com)
+- test: add e2e tests for base Drawer components ([PR #29029](https://github.com/microsoft/fluentui/pull/29029) by marcosvmmoura@gmail.com)
+- Bump @fluentui/react-dialog to v9.6.2 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.5 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-motion-preview to v0.2.1 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+- Bump @fluentui/react-utilities to v9.13.2 ([PR #29055](https://github.com/microsoft/fluentui/pull/29055) by beachball)
+
+## [9.0.0-beta.21](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.21)
+
+Tue, 05 Sep 2023 13:29:22 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.20..@fluentui/react-drawer_v9.0.0-beta.21)
+
+### Changes
+
+- fix: refactor DrawerHeaderTitle slot creation while keeping the same API ([PR #29042](https://github.com/microsoft/fluentui/pull/29042) by marcosvmmoura@gmail.com)
+- chore: migrate package to use JSX importSource ([PR #28959](https://github.com/microsoft/fluentui/pull/28959) by bernardo.sunderhus@gmail.com)
+- bumps @swc/helpers version to 0.5.1 ([PR #28989](https://github.com/microsoft/fluentui/pull/28989) by bernardo.sunderhus@gmail.com)
+- test: add simple renderization tests for sub components ([PR #29043](https://github.com/microsoft/fluentui/pull/29043) by marcosvmmoura@gmail.com)
+- feat: add motion for Drawer ([PR #28999](https://github.com/microsoft/fluentui/pull/28999) by marcosvmmoura@gmail.com)
+- Bump @fluentui/react-dialog to v9.6.1 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.4 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-motion-preview to v0.2.0 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.7.3 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-theme to v9.1.12 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+- Bump @fluentui/react-utilities to v9.13.1 ([PR #29056](https://github.com/microsoft/fluentui/pull/29056) by beachball)
+
 ## [9.0.0-beta.20](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.20)
 
-Tue, 29 Aug 2023 12:53:36 GMT 
+Tue, 29 Aug 2023 12:57:36 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.19..@fluentui/react-drawer_v9.0.0-beta.20)
 
 ### Changes

package/dist/index.d.ts

@@ -5,8 +5,9 @@ import type { ComponentState } from '@fluentui/react-utilities';
 import { DialogProps } from '@fluentui/react-dialog';
 import { DialogSurfaceProps } from '@fluentui/react-dialog';
 import { DialogSurfaceSlots } from '@fluentui/react-dialog';
-import { DialogTitleSlots } from '@fluentui/react-dialog';
 import type { ForwardRefComponent } from '@fluentui/react-utilities';
+import { MotionShorthand } from '@fluentui/react-motion-preview';
+import { MotionState } from '@fluentui/react-motion-preview';
 import * as React_2 from 'react';
 import type { Slot } from '@fluentui/react-utilities';
 import type { SlotClassNames } from '@fluentui/react-utilities';
@@ -39,7 +40,7 @@ declare type DrawerBaseProps = {
      *
      * @default false
      */
-    open?: boolean;
+    open?: MotionShorthand<HTMLDivElement>;
     /**
      * Default value for the uncontrolled open state of the Drawer.
      *
@@ -48,6 +49,10 @@ declare type DrawerBaseProps = {
     defaultOpen?: boolean;
 };
 
+declare type DrawerBaseState = Required<Pick<DrawerBaseProps, 'position' | 'size'>> & {
+    motion: MotionState<HTMLDivElement>;
+};
+
 /**
  * DrawerBody provides with a container for the main content of a Drawer.
  */
@@ -145,13 +150,7 @@ export declare const drawerHeaderTitleClassNames: SlotClassNames<DrawerHeaderTit
 /**
  * DrawerHeaderTitle Props
  */
-export declare type DrawerHeaderTitleProps = ComponentProps<DrawerHeaderTitleSlots> & {
-    /**
-     * Content of the DrawerHeaderTitle
-     * Children is mandatory because DrawerHeaderTitle is a wrapper component
-     */
-    children: React_2.ReactNode | undefined;
-};
+export declare type DrawerHeaderTitleProps = ComponentProps<DrawerHeaderTitleSlots>;
 
 export declare type DrawerHeaderTitleSlots = {
     root: Slot<'div'>;
@@ -159,11 +158,11 @@ export declare type DrawerHeaderTitleSlots = {
      * By default this is a h2, but can be any heading or div.
      * If `div` is provided do not forget to also provide proper `role="heading"` and `aria-level` attributes
      */
-    heading?: DialogTitleSlots['root'];
+    heading?: Slot<'h2', 'h1' | 'h3' | 'h4' | 'h5' | 'h6' | 'div'>;
     /**
      * Action slot for the close button
      */
-    action?: DialogTitleSlots['action'];
+    action?: Slot<'div'>;
 };
 
 /**
@@ -172,7 +171,7 @@ export declare type DrawerHeaderTitleSlots = {
 export declare type DrawerHeaderTitleState = ComponentState<DrawerHeaderTitleSlots>;
 
 /**
- * DrawerInline is often used for navigation that is not dissmissable. As it is on the same level as
+ * DrawerInline is often used for navigation that is not dismissible. As it is on the same level as
  * the main surface, users can still interact with other UI elements.
  */
 export declare const DrawerInline: ForwardRefComponent<DrawerInlineProps>;
@@ -198,7 +197,7 @@ export declare type DrawerInlineSlots = {
 /**
  * State used in rendering DrawerInline
  */
-export declare type DrawerInlineState = ComponentState<DrawerInlineSlots> & DrawerInlineProps;
+export declare type DrawerInlineState = Required<ComponentState<DrawerInlineSlots> & DrawerBaseState & Pick<DrawerInlineProps, 'separator'>>;
 
 /**
  * DrawerOverlay contains supplementary content and are used for complex creation, edit, or management experiences.
@@ -219,14 +218,15 @@ export declare type DrawerOverlaySlots = DialogSurfaceSlots & {
 /**
  * State used in rendering DrawerOverlay
  */
-export declare type DrawerOverlayState = ComponentState<DrawerOverlaySlots> & DrawerBaseProps & {
+export declare type DrawerOverlayState = Required<Omit<ComponentState<DrawerOverlaySlots>, 'backdrop'> & DrawerBaseState & {
     dialog: DialogProps;
-};
+    backdropMotion: MotionState<HTMLDivElement>;
+}>;
 
 /**
  * Drawer Props
  */
-export declare type DrawerProps = ComponentProps<Partial<DrawerSlots>> & {
+export declare type DrawerProps = ComponentProps<DrawerSlots> & {
     /**
      * Type of the drawer.
      * @default overlay
@@ -287,7 +287,7 @@ export declare const renderDrawerInline_unstable: (state: DrawerInlineState) =>
 /**
  * Render the final JSX of DrawerOverlay
  */
-export declare const renderDrawerOverlay_unstable: (state: DrawerOverlayState) => JSX.Element;
+export declare const renderDrawerOverlay_unstable: (state: DrawerOverlayState) => JSX.Element | null;
 
 /**
  * Create the state required to render Drawer.
@@ -389,7 +389,7 @@ export declare const useDrawerHeaderTitleStyles_unstable: (state: DrawerHeaderTi
  * @param props - props from this instance of DrawerInline
  * @param ref - reference to root HTMLElement of DrawerInline
  */
-export declare const useDrawerInline_unstable: (props: DrawerInlineProps, ref: React_2.Ref<HTMLElement>) => DrawerInlineState;
+export declare const useDrawerInline_unstable: (props: DrawerInlineProps, ref: React_2.Ref<HTMLDivElement>) => DrawerInlineState;
 
 /**
  * Apply styling to the DrawerInline slots based on the state
@@ -403,9 +403,9 @@ export declare const useDrawerInlineStyles_unstable: (state: DrawerInlineState)
  * before being passed to renderDrawerOverlay_unstable.
  *
  * @param props - props from this instance of DrawerOverlay
- * @param ref - reference to root HTMLElement of DrawerOverlay
+ * @param ref - reference to root HTMLDivElement of DrawerOverlay
  */
-export declare const useDrawerOverlay_unstable: (props: DrawerOverlayProps, ref: React_2.Ref<HTMLElement>) => DrawerOverlayState;
+export declare const useDrawerOverlay_unstable: (props: DrawerOverlayProps, ref: React_2.Ref<HTMLDivElement>) => DrawerOverlayState;
 
 /**
  * Apply styling to the DrawerOverlay slots based on the state

package/lib/components/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Drawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawer_unstable } from './useDrawer';\nimport { renderDrawer_unstable } from './renderDrawer';\nimport { useDrawerStyles_unstable } from './useDrawerStyles.styles';\nimport type { DrawerProps } from './Drawer.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Drawer contains supplementary content and are used for complex creation, edit, or management experiences.\n */\nexport const Drawer: ForwardRefComponent<DrawerProps> = React.forwardRef((props, ref) => {\n  const state = useDrawer_unstable(props, ref);\n\n  useDrawerStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerStyles_unstable')(state);\n\n  return renderDrawer_unstable(state);\n});\n\nDrawer.displayName = 'Drawer';\n"],"names":["React","useDrawer_unstable","renderDrawer_unstable","useDrawerStyles_unstable","useCustomStyleHook_unstable","Drawer","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,2BAA2B;AAGpE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,uBAA2CL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACvF,MAAMC,QAAQR,mBAAmBM,OAAOC;IAExCL,yBAAyBM;IACzBL,4BAA4B,4BAA4BK;IAExD,OAAOP,sBAAsBO;AAC/B,GAAG;AAEHJ,OAAOK,WAAW,GAAG"}
+{"version":3,"sources":["Drawer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawer_unstable } from './useDrawer';\nimport { renderDrawer_unstable } from './renderDrawer';\nimport { useDrawerStyles_unstable } from './useDrawerStyles.styles';\nimport type { DrawerProps } from './Drawer.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Drawer contains supplementary content and are used for complex creation, edit, or management experiences.\n */\nexport const Drawer: ForwardRefComponent<DrawerProps> = React.forwardRef((props, ref) => {\n  const state = useDrawer_unstable(props, ref);\n\n  useDrawerStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerStyles_unstable')(state);\n\n  return renderDrawer_unstable(state);\n});\n\nDrawer.displayName = 'Drawer';\n"],"names":["React","useDrawer_unstable","renderDrawer_unstable","useDrawerStyles_unstable","useCustomStyleHook_unstable","Drawer","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,2BAA2B;AAGpE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,uBAA2CL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/E,MAAMC,QAAQR,mBAAmBM,OAAOC;IAExCL,yBAAyBM;IACzBL,4BAA4B,4BAA4BK;IAExD,OAAOP,sBAAsBO;AAC/B,GAAG;AAEHJ,OAAOK,WAAW,GAAG"}

package/lib/components/Drawer/Drawer.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Drawer.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { DrawerOverlayProps } from '../DrawerOverlay/DrawerOverlay.types';\nimport { DrawerInlineProps } from '../DrawerInline/DrawerInline.types';\n\nexport type DrawerSlots = {\n  /**\n   * Root slot of the Drawer.\n   */\n  root: Slot<DrawerOverlayProps | DrawerInlineProps>;\n};\n\n/**\n * Drawer Props\n */\nexport type DrawerProps = ComponentProps<Partial<DrawerSlots>> & {\n  /**\n   * Type of the drawer.\n   * @default overlay\n   *\n   * - 'overlay' - Drawer is hidden by default and can be opened by clicking on the trigger.\n   * - 'inline' - Drawer is stacked with the content\n   */\n  type?: 'inline' | 'overlay';\n};\n\n/**\n * State used in rendering Drawer\n */\nexport type DrawerState = ComponentState<DrawerSlots>;\n"],"names":[],"mappings":"AAAA,WA4BsD"}
+{"version":3,"sources":["Drawer.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nimport type { DrawerOverlayProps } from '../DrawerOverlay';\nimport type { DrawerInlineProps } from '../DrawerInline';\n\nexport type DrawerSlots = {\n  /**\n   * Root slot of the Drawer.\n   */\n  root: Slot<DrawerOverlayProps | DrawerInlineProps>;\n};\n\n/**\n * Drawer Props\n */\nexport type DrawerProps = ComponentProps<DrawerSlots> & {\n  /**\n   * Type of the drawer.\n   * @default overlay\n   *\n   * - 'overlay' - Drawer is hidden by default and can be opened by clicking on the trigger.\n   * - 'inline' - Drawer is stacked with the content\n   */\n  type?: 'inline' | 'overlay';\n};\n\n/**\n * State used in rendering Drawer\n */\nexport type DrawerState = ComponentState<DrawerSlots>;\n"],"names":[],"mappings":"AAAA,WA6BsD"}

package/lib/components/Drawer/renderDrawer.js

@@ -1,8 +1,8 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of Drawer
  */ export const renderDrawer_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null);
+    return /*#__PURE__*/ _jsx(state.root, {});
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawer.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DrawerState, DrawerSlots } from './Drawer.types';\n\n/**\n * Render the final JSX of Drawer\n */\nexport const renderDrawer_unstable = (state: DrawerState) => {\n  assertSlots<DrawerSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["createElement","assertSlots","renderDrawer_unstable","state","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,wBAAwB,CAACC,QAAuB;IAC3DF,YAAyBE;IAEzB,qBAAO,AAbT,cAaUA,MAAMC,IAAI;AACpB,EAAE"}
+{"version":3,"sources":["renderDrawer.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\n\nimport type { DrawerState, DrawerSlots } from './Drawer.types';\n\n/**\n * Render the final JSX of Drawer\n */\nexport const renderDrawer_unstable = (state: DrawerState) => {\n  assertSlots<DrawerSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDrawer_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,wBAAwB,CAACC;IACpCF,YAAyBE;IAEzB,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/Drawer/useDrawer.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { slot } from '@fluentui/react-utilities';
-import { DrawerOverlay } from '../DrawerOverlay/DrawerOverlay';
-import { DrawerInline } from '../DrawerInline/DrawerInline';
+import { DrawerOverlay } from '../DrawerOverlay';
+import { DrawerInline } from '../DrawerInline';
 /**
  * Create the state required to render Drawer.
  *
@@ -11,16 +11,17 @@ import { DrawerInline } from '../DrawerInline/DrawerInline';
  * @param props - props from this instance of Drawer
  * @param ref - reference to root HTMLElement of Drawer
  */ export const useDrawer_unstable = (props, ref)=>{
-    const { type ='overlay'  } = props;
+    const { type = 'overlay' } = props;
+    const elementType = type === 'overlay' ? DrawerOverlay : DrawerInline;
     return {
         components: {
-            root: type === 'overlay' ? DrawerOverlay : DrawerInline
+            root: elementType
         },
-        root: slot.always(props, {
-            defaultProps: {
-                ref
-            },
-            elementType: type === 'overlay' ? DrawerOverlay : DrawerInline
+        root: slot.always(slot.resolveShorthand({
+            ref,
+            ...props
+        }), {
+            elementType
         })
     };
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["useDrawer.ts"],"sourcesContent":["import * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\n\nimport type { DrawerProps, DrawerState } from './Drawer.types';\nimport { DrawerOverlay } from '../DrawerOverlay/DrawerOverlay';\nimport { DrawerInline } from '../DrawerInline/DrawerInline';\n\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 */\nexport const useDrawer_unstable = (props: DrawerProps, ref: React.Ref<HTMLElement>): DrawerState => {\n  const { type = 'overlay' } = props;\n\n  return {\n    components: {\n      root: type === 'overlay' ? DrawerOverlay : DrawerInline,\n    },\n\n    root: slot.always(props, {\n      defaultProps: {\n        ref,\n      } as DrawerProps,\n      elementType: type === 'overlay' ? DrawerOverlay : DrawerInline,\n    }),\n  };\n};\n"],"names":["React","slot","DrawerOverlay","DrawerInline","useDrawer_unstable","props","ref","type","components","root","always","defaultProps","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AAGjD,SAASC,aAAa,QAAQ,iCAAiC;AAC/D,SAASC,YAAY,QAAQ,+BAA+B;AAE5D;;;;;;;;CAQC,GACD,OAAO,MAAMC,qBAAqB,CAACC,OAAoBC,MAA6C;IAClG,MAAM,EAAEC,MAAO,UAAS,EAAE,GAAGF;IAE7B,OAAO;QACLG,YAAY;YACVC,MAAMF,SAAS,YAAYL,gBAAgBC,YAAY;QACzD;QAEAM,MAAMR,KAAKS,MAAM,CAACL,OAAO;YACvBM,cAAc;gBACZL;YACF;YACAM,aAAaL,SAAS,YAAYL,gBAAgBC,YAAY;QAChE;IACF;AACF,EAAE"}
+{"version":3,"sources":["useDrawer.ts"],"sourcesContent":["import * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\n\nimport type { DrawerProps, DrawerState } from './Drawer.types';\nimport { DrawerOverlay } from '../DrawerOverlay';\nimport { DrawerInline } from '../DrawerInline';\n\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 */\nexport const useDrawer_unstable = (props: DrawerProps, ref: React.Ref<HTMLElement>): DrawerState => {\n  const { type = 'overlay' } = props;\n\n  const elementType = type === 'overlay' ? DrawerOverlay : DrawerInline;\n\n  return {\n    components: {\n      root: elementType,\n    },\n\n    root: slot.always<DrawerProps>(\n      slot.resolveShorthand({\n        ref,\n        ...props,\n      }),\n      {\n        elementType,\n      },\n    ),\n  };\n};\n"],"names":["React","slot","DrawerOverlay","DrawerInline","useDrawer_unstable","props","ref","type","elementType","components","root","always","resolveShorthand"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AAGjD,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,YAAY,QAAQ,kBAAkB;AAE/C;;;;;;;;CAQC,GACD,OAAO,MAAMC,qBAAqB,CAACC,OAAoBC;IACrD,MAAM,EAAEC,OAAO,SAAS,EAAE,GAAGF;IAE7B,MAAMG,cAAcD,SAAS,YAAYL,gBAAgBC;IAEzD,OAAO;QACLM,YAAY;YACVC,MAAMF;QACR;QAEAE,MAAMT,KAAKU,MAAM,CACfV,KAAKW,gBAAgB,CAAC;YACpBN;YACA,GAAGD,KAAK;QACV,IACA;YACEG;QACF;IAEJ;AACF,EAAE"}

package/lib/components/DrawerBody/DrawerBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DrawerBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerBody_unstable } from './useDrawerBody';\nimport { renderDrawerBody_unstable } from './renderDrawerBody';\nimport { useDrawerBodyStyles_unstable } from './useDrawerBodyStyles.styles';\nimport type { DrawerBodyProps } from './DrawerBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerBody provides with a container for the main content of a Drawer.\n */\nexport const DrawerBody: ForwardRefComponent<DrawerBodyProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerBody_unstable(props, ref);\n\n  useDrawerBodyStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerBodyStyles_unstable')(state);\n\n  return renderDrawerBody_unstable(state);\n});\n\nDrawerBody.displayName = 'DrawerBody';\n"],"names":["React","useDrawerBody_unstable","renderDrawerBody_unstable","useDrawerBodyStyles_unstable","useCustomStyleHook_unstable","DrawerBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC/F,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAC7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
+{"version":3,"sources":["DrawerBody.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerBody_unstable } from './useDrawerBody';\nimport { renderDrawerBody_unstable } from './renderDrawerBody';\nimport { useDrawerBodyStyles_unstable } from './useDrawerBodyStyles.styles';\nimport type { DrawerBodyProps } from './DrawerBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerBody provides with a container for the main content of a Drawer.\n */\nexport const DrawerBody: ForwardRefComponent<DrawerBodyProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerBody_unstable(props, ref);\n\n  useDrawerBodyStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerBodyStyles_unstable')(state);\n\n  return renderDrawerBody_unstable(state);\n});\n\nDrawerBody.displayName = 'DrawerBody';\n"],"names":["React","useDrawerBody_unstable","renderDrawerBody_unstable","useDrawerBodyStyles_unstable","useCustomStyleHook_unstable","DrawerBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAC7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib/components/DrawerBody/renderDrawerBody.js

@@ -1,8 +1,8 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DrawerBody
  */ export const renderDrawerBody_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null);
+    return /*#__PURE__*/ _jsx(state.root, {});
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerBody.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DrawerBodyState, DrawerBodySlots } from './DrawerBody.types';\n\n/**\n * Render the final JSX of DrawerBody\n */\nexport const renderDrawerBody_unstable = (state: DrawerBodyState) => {\n  assertSlots<DrawerBodySlots>(state);\n\n  return <state.root />;\n};\n"],"names":["createElement","assertSlots","renderDrawerBody_unstable","state","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC,QAA2B;IACnEF,YAA6BE;IAE7B,qBAAO,AAZT,cAYUA,MAAMC,IAAI;AACpB,EAAE"}
+{"version":3,"sources":["renderDrawerBody.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\n\nimport type { DrawerBodySlots, DrawerBodyState } from './DrawerBody.types';\n\n/**\n * Render the final JSX of DrawerBody\n */\nexport const renderDrawerBody_unstable = (state: DrawerBodyState) => {\n  assertSlots<DrawerBodySlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDrawerBody_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxCF,YAA6BE;IAE7B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerBody.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport type { DrawerBodyProps, DrawerBodyState } from './DrawerBody.types';\n\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 */\nexport const useDrawerBody_unstable = (props: DrawerBodyProps, ref: React.Ref<HTMLElement>): DrawerBodyState => {\n  return {\n    components: {\n      root: 'div',\n    },\n\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerBody_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAGxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAwBC,MAAiD;IAC9G,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,OAAO;YAC3BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}
+{"version":3,"sources":["useDrawerBody.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n\nimport type { DrawerBodyProps, DrawerBodyState } from './DrawerBody.types';\n\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 */\nexport const useDrawerBody_unstable = (props: DrawerBodyProps, ref: React.Ref<HTMLElement>): DrawerBodyState => {\n  return {\n    components: {\n      root: 'div',\n    },\n\n    root: slot.always(\n      getNativeElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerBody_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAIxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAwBC;IAC7D,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,OAAO;YAC3BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/DrawerFooter/DrawerFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DrawerFooter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerFooter_unstable } from './useDrawerFooter';\nimport { renderDrawerFooter_unstable } from './renderDrawerFooter';\nimport { useDrawerFooterStyles_unstable } from './useDrawerFooterStyles.styles';\nimport type { DrawerFooterProps } from './DrawerFooter.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DrawerFooter component - TODO: add more docs\n */\nexport const DrawerFooter: ForwardRefComponent<DrawerFooterProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerFooter_unstable(props, ref);\n\n  useDrawerFooterStyles_unstable(state);\n  return renderDrawerFooter_unstable(state);\n});\n\nDrawerFooter.displayName = 'DrawerFooter';\n"],"names":["React","useDrawerFooter_unstable","renderDrawerFooter_unstable","useDrawerFooterStyles_unstable","DrawerFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAIhF;;CAEC,GACD,OAAO,MAAMC,6BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnG,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAC/B,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["DrawerFooter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerFooter_unstable } from './useDrawerFooter';\nimport { renderDrawerFooter_unstable } from './renderDrawerFooter';\nimport { useDrawerFooterStyles_unstable } from './useDrawerFooterStyles.styles';\nimport type { DrawerFooterProps } from './DrawerFooter.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * DrawerFooter component - TODO: add more docs\n */\nexport const DrawerFooter: ForwardRefComponent<DrawerFooterProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerFooter_unstable(props, ref);\n\n  useDrawerFooterStyles_unstable(state);\n  return renderDrawerFooter_unstable(state);\n});\n\nDrawerFooter.displayName = 'DrawerFooter';\n"],"names":["React","useDrawerFooter_unstable","renderDrawerFooter_unstable","useDrawerFooterStyles_unstable","DrawerFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAIhF;;CAEC,GACD,OAAO,MAAMC,6BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAC/B,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib/components/DrawerFooter/renderDrawerFooter.js

@@ -1,8 +1,8 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DrawerFooter
  */ export const renderDrawerFooter_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null);
+    return /*#__PURE__*/ _jsx(state.root, {});
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerFooter.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DrawerFooterState, DrawerFooterSlots } from './DrawerFooter.types';\n\n/**\n * Render the final JSX of DrawerFooter\n */\nexport const renderDrawerFooter_unstable = (state: DrawerFooterState) => {\n  assertSlots<DrawerFooterSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["createElement","assertSlots","renderDrawerFooter_unstable","state","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC,QAA6B;IACvEF,YAA+BE;IAE/B,qBAAO,AAZT,cAYUA,MAAMC,IAAI;AACpB,EAAE"}
+{"version":3,"sources":["renderDrawerFooter.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\n\nimport type { DrawerFooterSlots, DrawerFooterState } from './DrawerFooter.types';\n\n/**\n * Render the final JSX of DrawerFooter\n */\nexport const renderDrawerFooter_unstable = (state: DrawerFooterState) => {\n  assertSlots<DrawerFooterSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDrawerFooter_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerFooter.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport type { DrawerFooterProps, DrawerFooterState } from './DrawerFooter.types';\n\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 */\nexport const useDrawerFooter_unstable = (props: DrawerFooterProps, ref: React.Ref<HTMLElement>): DrawerFooterState => {\n  return {\n    components: {\n      root: 'footer',\n    },\n\n    root: slot.always(\n      getNativeElementProps('footer', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'footer' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerFooter_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAGxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC,MAAmD;IACpH,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,UAAU;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAS;IAE5B;AACF,EAAE"}
+{"version":3,"sources":["useDrawerFooter.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n\nimport type { DrawerFooterProps, DrawerFooterState } from './DrawerFooter.types';\n\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 */\nexport const useDrawerFooter_unstable = (props: DrawerFooterProps, ref: React.Ref<HTMLElement>): DrawerFooterState => {\n  return {\n    components: {\n      root: 'footer',\n    },\n\n    root: slot.always(\n      getNativeElementProps('footer', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'footer' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerFooter_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAIxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,UAAU;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAS;IAE5B;AACF,EAAE"}

package/lib/components/DrawerHeader/DrawerHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DrawerHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerHeader_unstable } from './useDrawerHeader';\nimport { renderDrawerHeader_unstable } from './renderDrawerHeader';\nimport { useDrawerHeaderStyles_unstable } from './useDrawerHeaderStyles.styles';\nimport type { DrawerHeaderProps } from './DrawerHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerHeader provides a structured header for the drawer component.\n */\nexport const DrawerHeader: ForwardRefComponent<DrawerHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerHeader_unstable(props, ref);\n\n  useDrawerHeaderStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerHeaderStyles_unstable')(state);\n\n  return renderDrawerHeader_unstable(state);\n});\n\nDrawerHeader.displayName = 'DrawerHeader';\n"],"names":["React","useDrawerHeader_unstable","renderDrawerHeader_unstable","useDrawerHeaderStyles_unstable","useCustomStyleHook_unstable","DrawerHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnG,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAC/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["DrawerHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerHeader_unstable } from './useDrawerHeader';\nimport { renderDrawerHeader_unstable } from './renderDrawerHeader';\nimport { useDrawerHeaderStyles_unstable } from './useDrawerHeaderStyles.styles';\nimport type { DrawerHeaderProps } from './DrawerHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerHeader provides a structured header for the drawer component.\n */\nexport const DrawerHeader: ForwardRefComponent<DrawerHeaderProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerHeader_unstable(props, ref);\n\n  useDrawerHeaderStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerHeaderStyles_unstable')(state);\n\n  return renderDrawerHeader_unstable(state);\n});\n\nDrawerHeader.displayName = 'DrawerHeader';\n"],"names":["React","useDrawerHeader_unstable","renderDrawerHeader_unstable","useDrawerHeaderStyles_unstable","useCustomStyleHook_unstable","DrawerHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAC/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib/components/DrawerHeader/renderDrawerHeader.js

@@ -1,8 +1,8 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DrawerHeader
  */ export const renderDrawerHeader_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null);
+    return /*#__PURE__*/ _jsx(state.root, {});
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerHeader.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DrawerHeaderState, DrawerHeaderSlots } from './DrawerHeader.types';\n\n/**\n * Render the final JSX of DrawerHeader\n */\nexport const renderDrawerHeader_unstable = (state: DrawerHeaderState) => {\n  assertSlots<DrawerHeaderSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["createElement","assertSlots","renderDrawerHeader_unstable","state","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC,QAA6B;IACvEF,YAA+BE;IAE/B,qBAAO,AAZT,cAYUA,MAAMC,IAAI;AACpB,EAAE"}
+{"version":3,"sources":["renderDrawerHeader.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\n\nimport type { DrawerHeaderState, DrawerHeaderSlots } from './DrawerHeader.types';\n\n/**\n * Render the final JSX of DrawerHeader\n */\nexport const renderDrawerHeader_unstable = (state: DrawerHeaderState) => {\n  assertSlots<DrawerHeaderSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDrawerHeader_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport type { DrawerHeaderProps, DrawerHeaderState } from './DrawerHeader.types';\n\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 */\nexport const useDrawerHeader_unstable = (props: DrawerHeaderProps, ref: React.Ref<HTMLElement>): DrawerHeaderState => {\n  return {\n    components: {\n      root: 'header',\n    },\n\n    root: slot.always(\n      getNativeElementProps('header', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'header' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerHeader_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAGxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC,MAAmD;IACpH,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,UAAU;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAS;IAE5B;AACF,EAAE"}
+{"version":3,"sources":["useDrawerHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n\nimport type { DrawerHeaderProps, DrawerHeaderState } from './DrawerHeader.types';\n\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 */\nexport const useDrawerHeader_unstable = (props: DrawerHeaderProps, ref: React.Ref<HTMLElement>): DrawerHeaderState => {\n  return {\n    components: {\n      root: 'header',\n    },\n\n    root: slot.always(\n      getNativeElementProps('header', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'header' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerHeader_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAIxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,UAAU;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAS;IAE5B;AACF,EAAE"}

package/lib/components/DrawerHeaderNavigation/DrawerHeaderNavigation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DrawerHeaderNavigation.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerHeaderNavigation_unstable } from './useDrawerHeaderNavigation';\nimport { renderDrawerHeaderNavigation_unstable } from './renderDrawerHeaderNavigation';\nimport { useDrawerHeaderNavigationStyles_unstable } from './useDrawerHeaderNavigationStyles.styles';\nimport type { DrawerHeaderNavigationProps } from './DrawerHeaderNavigation.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerHeaderNavigation provides a header navigation area for the Drawer.\n */\nexport const DrawerHeaderNavigation: ForwardRefComponent<DrawerHeaderNavigationProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useDrawerHeaderNavigation_unstable(props, ref);\n\n    useDrawerHeaderNavigationStyles_unstable(state);\n    useCustomStyleHook_unstable('useDrawerHeaderNavigationStyles_unstable')(state);\n\n    return renderDrawerHeaderNavigation_unstable(state);\n  },\n);\n\nDrawerHeaderNavigation.displayName = 'DrawerHeaderNavigation';\n"],"names":["React","useDrawerHeaderNavigation_unstable","renderDrawerHeaderNavigation_unstable","useDrawerHeaderNavigationStyles_unstable","useCustomStyleHook_unstable","DrawerHeaderNavigation","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kCAAkC,QAAQ,8BAA8B;AACjF,SAASC,qCAAqC,QAAQ,iCAAiC;AACvF,SAASC,wCAAwC,QAAQ,2CAA2C;AAGpG,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,uCAA2EL,MAAMM,UAAU,CACtG,CAACC,OAAOC,MAAQ;IACd,MAAMC,QAAQR,mCAAmCM,OAAOC;IAExDL,yCAAyCM;IACzCL,4BAA4B,4CAA4CK;IAExE,OAAOP,sCAAsCO;AAC/C,GACA;AAEFJ,uBAAuBK,WAAW,GAAG"}
+{"version":3,"sources":["DrawerHeaderNavigation.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerHeaderNavigation_unstable } from './useDrawerHeaderNavigation';\nimport { renderDrawerHeaderNavigation_unstable } from './renderDrawerHeaderNavigation';\nimport { useDrawerHeaderNavigationStyles_unstable } from './useDrawerHeaderNavigationStyles.styles';\nimport type { DrawerHeaderNavigationProps } from './DrawerHeaderNavigation.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerHeaderNavigation provides a header navigation area for the Drawer.\n */\nexport const DrawerHeaderNavigation: ForwardRefComponent<DrawerHeaderNavigationProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useDrawerHeaderNavigation_unstable(props, ref);\n\n    useDrawerHeaderNavigationStyles_unstable(state);\n    useCustomStyleHook_unstable('useDrawerHeaderNavigationStyles_unstable')(state);\n\n    return renderDrawerHeaderNavigation_unstable(state);\n  },\n);\n\nDrawerHeaderNavigation.displayName = 'DrawerHeaderNavigation';\n"],"names":["React","useDrawerHeaderNavigation_unstable","renderDrawerHeaderNavigation_unstable","useDrawerHeaderNavigationStyles_unstable","useCustomStyleHook_unstable","DrawerHeaderNavigation","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kCAAkC,QAAQ,8BAA8B;AACjF,SAASC,qCAAqC,QAAQ,iCAAiC;AACvF,SAASC,wCAAwC,QAAQ,2CAA2C;AAGpG,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,uCAA2EL,MAAMM,UAAU,CACtG,CAACC,OAAOC;IACN,MAAMC,QAAQR,mCAAmCM,OAAOC;IAExDL,yCAAyCM;IACzCL,4BAA4B,4CAA4CK;IAExE,OAAOP,sCAAsCO;AAC/C,GACA;AAEFJ,uBAAuBK,WAAW,GAAG"}

package/lib/components/DrawerHeaderNavigation/renderDrawerHeaderNavigation.js

@@ -1,8 +1,8 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DrawerHeaderNavigation
  */ export const renderDrawerHeaderNavigation_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null);
+    return /*#__PURE__*/ _jsx(state.root, {});
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["renderDrawerHeaderNavigation.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { DrawerHeaderNavigationState, DrawerHeaderNavigationSlots } from './DrawerHeaderNavigation.types';\n\n/**\n * Render the final JSX of DrawerHeaderNavigation\n */\nexport const renderDrawerHeaderNavigation_unstable = (state: DrawerHeaderNavigationState) => {\n  assertSlots<DrawerHeaderNavigationSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["createElement","assertSlots","renderDrawerHeaderNavigation_unstable","state","root"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,wCAAwC,CAACC,QAAuC;IAC3FF,YAAyCE;IAEzC,qBAAO,AAZT,cAYUA,MAAMC,IAAI;AACpB,EAAE"}
+{"version":3,"sources":["renderDrawerHeaderNavigation.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\n\nimport type { DrawerHeaderNavigationSlots, DrawerHeaderNavigationState } from './DrawerHeaderNavigation.types';\n\n/**\n * Render the final JSX of DrawerHeaderNavigation\n */\nexport const renderDrawerHeaderNavigation_unstable = (state: DrawerHeaderNavigationState) => {\n  assertSlots<DrawerHeaderNavigationSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderDrawerHeaderNavigation_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,wCAAwC,CAACC;IACpDF,YAAyCE;IAEzC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useDrawerHeaderNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport type { DrawerHeaderNavigationProps, DrawerHeaderNavigationState } from './DrawerHeaderNavigation.types';\n\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 */\nexport const useDrawerHeaderNavigation_unstable = (\n  props: DrawerHeaderNavigationProps,\n  ref: React.Ref<HTMLElement>,\n): DrawerHeaderNavigationState => {\n  return {\n    components: {\n      root: 'nav',\n    },\n\n    root: slot.always(\n      getNativeElementProps('nav', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'nav' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerHeaderNavigation_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAGxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,qCAAqC,CAChDC,OACAC,MACgC;IAChC,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,OAAO;YAC3BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}
+{"version":3,"sources":["useDrawerHeaderNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n\nimport type { DrawerHeaderNavigationProps, DrawerHeaderNavigationState } from './DrawerHeaderNavigation.types';\n\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 */\nexport const useDrawerHeaderNavigation_unstable = (\n  props: DrawerHeaderNavigationProps,\n  ref: React.Ref<HTMLElement>,\n): DrawerHeaderNavigationState => {\n  return {\n    components: {\n      root: 'nav',\n    },\n\n    root: slot.always(\n      getNativeElementProps('nav', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'nav' },\n    ),\n  };\n};\n"],"names":["React","getNativeElementProps","slot","useDrawerHeaderNavigation_unstable","props","ref","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAIxE;;;;;;;;CAQC,GACD,OAAO,MAAMC,qCAAqC,CAChDC,OACAC;IAEA,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAML,KAAKM,MAAM,CACfP,sBAAsB,OAAO;YAC3BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/DrawerHeaderTitle/DrawerHeaderTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DrawerHeaderTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerHeaderTitle_unstable } from './useDrawerHeaderTitle';\nimport { renderDrawerHeaderTitle_unstable } from './renderDrawerHeaderTitle';\nimport { useDrawerHeaderTitleStyles_unstable } from './useDrawerHeaderTitleStyles.styles';\nimport type { DrawerHeaderTitleProps } from './DrawerHeaderTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerHeader provides a structured header for the drawer component.\n */\nexport const DrawerHeaderTitle: ForwardRefComponent<DrawerHeaderTitleProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerHeaderTitle_unstable(props, ref);\n\n  useDrawerHeaderTitleStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerHeaderTitleStyles_unstable')(state);\n\n  return renderDrawerHeaderTitle_unstable(state);\n});\n\nDrawerHeaderTitle.displayName = 'DrawerHeaderTitle';\n"],"names":["React","useDrawerHeaderTitle_unstable","renderDrawerHeaderTitle_unstable","useDrawerHeaderTitleStyles_unstable","useCustomStyleHook_unstable","DrawerHeaderTitle","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,mCAAmC,QAAQ,sCAAsC;AAG1F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,kCAAiEL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC7G,MAAMC,QAAQR,8BAA8BM,OAAOC;IAEnDL,oCAAoCM;IACpCL,4BAA4B,uCAAuCK;IAEnE,OAAOP,iCAAiCO;AAC1C,GAAG;AAEHJ,kBAAkBK,WAAW,GAAG"}
+{"version":3,"sources":["DrawerHeaderTitle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useDrawerHeaderTitle_unstable } from './useDrawerHeaderTitle';\nimport { renderDrawerHeaderTitle_unstable } from './renderDrawerHeaderTitle';\nimport { useDrawerHeaderTitleStyles_unstable } from './useDrawerHeaderTitleStyles.styles';\nimport type { DrawerHeaderTitleProps } from './DrawerHeaderTitle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DrawerHeader provides a structured header for the drawer component.\n */\nexport const DrawerHeaderTitle: ForwardRefComponent<DrawerHeaderTitleProps> = React.forwardRef((props, ref) => {\n  const state = useDrawerHeaderTitle_unstable(props, ref);\n\n  useDrawerHeaderTitleStyles_unstable(state);\n  useCustomStyleHook_unstable('useDrawerHeaderTitleStyles_unstable')(state);\n\n  return renderDrawerHeaderTitle_unstable(state);\n});\n\nDrawerHeaderTitle.displayName = 'DrawerHeaderTitle';\n"],"names":["React","useDrawerHeaderTitle_unstable","renderDrawerHeaderTitle_unstable","useDrawerHeaderTitleStyles_unstable","useCustomStyleHook_unstable","DrawerHeaderTitle","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,mCAAmC,QAAQ,sCAAsC;AAG1F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,kCAAiEL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACrG,MAAMC,QAAQR,8BAA8BM,OAAOC;IAEnDL,oCAAoCM;IACpCL,4BAA4B,uCAAuCK;IAEnE,OAAOP,iCAAiCO;AAC1C,GAAG;AAEHJ,kBAAkBK,WAAW,GAAG"}

package/lib/components/DrawerHeaderTitle/DrawerHeaderTitle.types.js

@@ -1 +1 @@
-import * as React from 'react';
+export { };

package/lib/components/DrawerHeaderTitle/DrawerHeaderTitle.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DrawerHeaderTitle.types.ts"],"sourcesContent":["import { DialogTitleSlots } from '@fluentui/react-dialog';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport type DrawerHeaderTitleSlots = {\n  root: Slot<'div'>;\n\n  /**\n   * By default this is a h2, but can be any heading or div.\n   * If `div` is provided do not forget to also provide proper `role=\"heading\"` and `aria-level` attributes\n   */\n  heading?: DialogTitleSlots['root'];\n\n  /**\n   * Action slot for the close button\n   */\n  action?: DialogTitleSlots['action'];\n};\n\n/**\n * DrawerHeaderTitle Props\n */\nexport type DrawerHeaderTitleProps = ComponentProps<DrawerHeaderTitleSlots> & {\n  /**\n   * Content of the DrawerHeaderTitle\n   * Children is mandatory because DrawerHeaderTitle is a wrapper component\n   */\n  children: React.ReactNode | undefined;\n};\n\n/**\n * State used in rendering DrawerHeaderTitle\n */\nexport type DrawerHeaderTitleState = ComponentState<DrawerHeaderTitleSlots>;\n"],"names":["React"],"mappings":"AAEA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["DrawerHeaderTitle.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type DrawerHeaderTitleSlots = {\n  root: Slot<'div'>;\n\n  /**\n   * By default this is a h2, but can be any heading or div.\n   * If `div` is provided do not forget to also provide proper `role=\"heading\"` and `aria-level` attributes\n   */\n  heading?: Slot<'h2', 'h1' | 'h3' | 'h4' | 'h5' | 'h6' | 'div'>;\n\n  /**\n   * Action slot for the close button\n   */\n  action?: Slot<'div'>;\n};\n\n/**\n * DrawerHeaderTitle Props\n */\nexport type DrawerHeaderTitleProps = ComponentProps<DrawerHeaderTitleSlots>;\n\n/**\n * State used in rendering DrawerHeaderTitle\n */\nexport type DrawerHeaderTitleState = ComponentState<DrawerHeaderTitleSlots>;\n"],"names":[],"mappings":"AAAA,WAyB4E"}

package/lib/components/DrawerHeaderTitle/renderDrawerHeaderTitle.js

@@ -1,8 +1,13 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of DrawerHeaderTitle
  */ export const renderDrawerHeaderTitle_unstable = (state)=>{
     assertSlots(state);
-    return /*#__PURE__*/ createElement(state.root, null, state.heading && /*#__PURE__*/ createElement(state.heading, null), state.action && /*#__PURE__*/ createElement(state.action, null));
+    return /*#__PURE__*/ _jsxs(state.root, {
+        children: [
+            state.heading && /*#__PURE__*/ _jsx(state.heading, {}),
+            state.action && /*#__PURE__*/ _jsx(state.action, {})
+        ]
+    });
 };