@fluentui/react-drawer 9.0.0-beta.26 → 9.0.0-beta.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/CHANGELOG.json +172 -1
  2. package/CHANGELOG.md +50 -2
  3. package/dist/index.d.ts +8 -11
  4. package/lib/components/DrawerBody/useDrawerBodyStyles.styles.js +3 -30
  5. package/lib/components/DrawerBody/useDrawerBodyStyles.styles.js.map +1 -1
  6. package/lib/components/DrawerFooter/DrawerFooter.js +1 -1
  7. package/lib/components/DrawerFooter/DrawerFooter.js.map +1 -1
  8. package/lib/components/DrawerFooter/useDrawerFooterStyles.styles.js +3 -16
  9. package/lib/components/DrawerFooter/useDrawerFooterStyles.styles.js.map +1 -1
  10. package/lib/components/DrawerHeader/useDrawerHeaderStyles.styles.js +3 -17
  11. package/lib/components/DrawerHeader/useDrawerHeaderStyles.styles.js.map +1 -1
  12. package/lib/components/DrawerHeaderNavigation/useDrawerHeaderNavigationStyles.styles.js +3 -13
  13. package/lib/components/DrawerHeaderNavigation/useDrawerHeaderNavigationStyles.styles.js.map +1 -1
  14. package/lib/components/DrawerHeaderTitle/useDrawerHeaderTitle.js +4 -5
  15. package/lib/components/DrawerHeaderTitle/useDrawerHeaderTitle.js.map +1 -1
  16. package/lib/components/DrawerInline/useDrawerInline.js +2 -7
  17. package/lib/components/DrawerInline/useDrawerInline.js.map +1 -1
  18. package/lib/components/DrawerInline/useDrawerInlineStyles.styles.js +6 -10
  19. package/lib/components/DrawerInline/useDrawerInlineStyles.styles.js.map +1 -1
  20. package/lib/components/DrawerOverlay/DrawerOverlay.types.js.map +1 -1
  21. package/lib/components/DrawerOverlay/renderDrawerOverlay.js +2 -4
  22. package/lib/components/DrawerOverlay/renderDrawerOverlay.js.map +1 -1
  23. package/lib/components/DrawerOverlay/useDrawerOverlay.js +17 -14
  24. package/lib/components/DrawerOverlay/useDrawerOverlay.js.map +1 -1
  25. package/lib/components/DrawerOverlay/useDrawerOverlayStyles.styles.js +25 -2
  26. package/lib/components/DrawerOverlay/useDrawerOverlayStyles.styles.js.map +1 -1
  27. package/lib/shared/DrawerBase.types.js.map +1 -1
  28. package/lib/shared/useDrawerBaseStyles.styles.js +23 -30
  29. package/lib/shared/useDrawerBaseStyles.styles.js.map +1 -1
  30. package/lib/shared/useDrawerDefaultProps.js +2 -3
  31. package/lib/shared/useDrawerDefaultProps.js.map +1 -1
  32. package/lib-commonjs/components/DrawerBody/useDrawerBodyStyles.styles.js +9 -64
  33. package/lib-commonjs/components/DrawerBody/useDrawerBodyStyles.styles.js.map +1 -1
  34. package/lib-commonjs/components/DrawerFooter/DrawerFooter.js.map +1 -1
  35. package/lib-commonjs/components/DrawerFooter/useDrawerFooterStyles.styles.js +5 -30
  36. package/lib-commonjs/components/DrawerFooter/useDrawerFooterStyles.styles.js.map +1 -1
  37. package/lib-commonjs/components/DrawerHeader/useDrawerHeaderStyles.styles.js +5 -32
  38. package/lib-commonjs/components/DrawerHeader/useDrawerHeaderStyles.styles.js.map +1 -1
  39. package/lib-commonjs/components/DrawerHeaderNavigation/useDrawerHeaderNavigationStyles.styles.js +5 -24
  40. package/lib-commonjs/components/DrawerHeaderNavigation/useDrawerHeaderNavigationStyles.styles.js.map +1 -1
  41. package/lib-commonjs/components/DrawerHeaderTitle/useDrawerHeaderTitle.js +3 -4
  42. package/lib-commonjs/components/DrawerHeaderTitle/useDrawerHeaderTitle.js.map +1 -1
  43. package/lib-commonjs/components/DrawerInline/useDrawerInline.js +1 -6
  44. package/lib-commonjs/components/DrawerInline/useDrawerInline.js.map +1 -1
  45. package/lib-commonjs/components/DrawerInline/useDrawerInlineStyles.styles.js +6 -11
  46. package/lib-commonjs/components/DrawerInline/useDrawerInlineStyles.styles.js.map +1 -1
  47. package/lib-commonjs/components/DrawerOverlay/renderDrawerOverlay.js +2 -4
  48. package/lib-commonjs/components/DrawerOverlay/renderDrawerOverlay.js.map +1 -1
  49. package/lib-commonjs/components/DrawerOverlay/useDrawerOverlay.js +15 -12
  50. package/lib-commonjs/components/DrawerOverlay/useDrawerOverlay.js.map +1 -1
  51. package/lib-commonjs/components/DrawerOverlay/useDrawerOverlayStyles.styles.js +70 -0
  52. package/lib-commonjs/components/DrawerOverlay/useDrawerOverlayStyles.styles.js.map +1 -1
  53. package/lib-commonjs/shared/useDrawerBaseStyles.styles.js +23 -77
  54. package/lib-commonjs/shared/useDrawerBaseStyles.styles.js.map +1 -1
  55. package/lib-commonjs/shared/useDrawerDefaultProps.js +2 -3
  56. package/lib-commonjs/shared/useDrawerDefaultProps.js.map +1 -1
  57. package/package.json +7 -7
package/CHANGELOG.json CHANGED
@@ -2,7 +2,178 @@
2
2
  "name": "@fluentui/react-drawer",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 20 Sep 2023 14:13:57 GMT",
5
+ "date": "Tue, 26 Sep 2023 17:44:10 GMT",
6
+ "tag": "@fluentui/react-drawer_v9.0.0-beta.29",
7
+ "version": "9.0.0-beta.29",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "yuanboxue@microsoft.com",
12
+ "package": "@fluentui/react-drawer",
13
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d",
14
+ "comment": "chore: trigger manual version bump after broken release"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-drawer",
19
+ "comment": "Bump @fluentui/react-dialog to v9.7.3",
20
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-drawer",
25
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.12",
26
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-drawer",
31
+ "comment": "Bump @fluentui/react-motion-preview to v0.2.8",
32
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-drawer",
37
+ "comment": "Bump @fluentui/react-shared-contexts to v9.9.1",
38
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
39
+ },
40
+ {
41
+ "author": "beachball",
42
+ "package": "@fluentui/react-drawer",
43
+ "comment": "Bump @fluentui/react-theme to v9.1.14",
44
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
45
+ },
46
+ {
47
+ "author": "beachball",
48
+ "package": "@fluentui/react-drawer",
49
+ "comment": "Bump @fluentui/react-utilities to v9.13.5",
50
+ "commit": "05a23f6f5f331841c9ac9fb63764440c543f791d"
51
+ }
52
+ ]
53
+ }
54
+ },
55
+ {
56
+ "date": "Tue, 26 Sep 2023 15:31:59 GMT",
57
+ "tag": "@fluentui/react-drawer_v9.0.0-beta.28",
58
+ "version": "9.0.0-beta.28",
59
+ "comments": {
60
+ "prerelease": [
61
+ {
62
+ "author": "marcosvmmoura@gmail.com",
63
+ "package": "@fluentui/react-drawer",
64
+ "commit": "afa2b8ebd2a09cbb1af23888736c7e3a21ec4a90",
65
+ "comment": "fix: improve performance of CSS classes"
66
+ },
67
+ {
68
+ "author": "marcosvmmoura@gmail.com",
69
+ "package": "@fluentui/react-drawer",
70
+ "commit": "2828134c6385b70d2d11de50729480993ce1fc3a",
71
+ "comment": "fix: resolve technical debts"
72
+ },
73
+ {
74
+ "author": "martinhochel@microsoft.com",
75
+ "package": "@fluentui/react-drawer",
76
+ "commit": "e61473fa10195f6ebf2308205c1e72e91b711831",
77
+ "comment": "fix: bump swc core to mitigate transpilation memory leaks"
78
+ },
79
+ {
80
+ "author": "marcosvmmoura@gmail.com",
81
+ "package": "@fluentui/react-drawer",
82
+ "commit": "a56c408d4ed860a48e22780289e5c4a00ebec6c4",
83
+ "comment": "fix: use context to fetch dialog id"
84
+ },
85
+ {
86
+ "author": "marcosvmmoura@gmail.com",
87
+ "package": "@fluentui/react-drawer",
88
+ "commit": "fbaba50e246b708d0fcac7d79d0f99df5228ce15",
89
+ "comment": "fix: remove defaultOpen prop from DrawerInline as it had no effect"
90
+ },
91
+ {
92
+ "author": "marcosvmmoura@gmail.com",
93
+ "package": "@fluentui/react-drawer",
94
+ "commit": "e31d18c0326a4c3f8f0966aaf2bb889cf44e4ce4",
95
+ "comment": "feat: add dialog slot"
96
+ },
97
+ {
98
+ "author": "beachball",
99
+ "package": "@fluentui/react-drawer",
100
+ "comment": "Bump @fluentui/react-dialog to v9.7.2",
101
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
102
+ },
103
+ {
104
+ "author": "beachball",
105
+ "package": "@fluentui/react-drawer",
106
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.11",
107
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
108
+ },
109
+ {
110
+ "author": "beachball",
111
+ "package": "@fluentui/react-drawer",
112
+ "comment": "Bump @fluentui/react-motion-preview to v0.2.7",
113
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
114
+ },
115
+ {
116
+ "author": "beachball",
117
+ "package": "@fluentui/react-drawer",
118
+ "comment": "Bump @fluentui/react-shared-contexts to v9.9.0",
119
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
120
+ },
121
+ {
122
+ "author": "beachball",
123
+ "package": "@fluentui/react-drawer",
124
+ "comment": "Bump @fluentui/react-theme to v9.1.13",
125
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
126
+ },
127
+ {
128
+ "author": "beachball",
129
+ "package": "@fluentui/react-drawer",
130
+ "comment": "Bump @fluentui/react-utilities to v9.13.4",
131
+ "commit": "e16520437e10cd824ac254dd797e32762b5de72d"
132
+ }
133
+ ]
134
+ }
135
+ },
136
+ {
137
+ "date": "Wed, 20 Sep 2023 17:47:37 GMT",
138
+ "tag": "@fluentui/react-drawer_v9.0.0-beta.27",
139
+ "version": "9.0.0-beta.27",
140
+ "comments": {
141
+ "prerelease": [
142
+ {
143
+ "author": "martinhochel@microsoft.com",
144
+ "package": "@fluentui/react-drawer",
145
+ "commit": "41d0ed0376ad79f1f5f5c4c7487515a1c6be35f0",
146
+ "comment": "chore: trigger manual version bump after broken release"
147
+ },
148
+ {
149
+ "author": "beachball",
150
+ "package": "@fluentui/react-drawer",
151
+ "comment": "Bump @fluentui/react-dialog to v9.7.1",
152
+ "commit": "41d0ed0376ad79f1f5f5c4c7487515a1c6be35f0"
153
+ },
154
+ {
155
+ "author": "beachball",
156
+ "package": "@fluentui/react-drawer",
157
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.10",
158
+ "commit": "41d0ed0376ad79f1f5f5c4c7487515a1c6be35f0"
159
+ },
160
+ {
161
+ "author": "beachball",
162
+ "package": "@fluentui/react-drawer",
163
+ "comment": "Bump @fluentui/react-motion-preview to v0.2.6",
164
+ "commit": "41d0ed0376ad79f1f5f5c4c7487515a1c6be35f0"
165
+ },
166
+ {
167
+ "author": "beachball",
168
+ "package": "@fluentui/react-drawer",
169
+ "comment": "Bump @fluentui/react-shared-contexts to v9.8.1",
170
+ "commit": "41d0ed0376ad79f1f5f5c4c7487515a1c6be35f0"
171
+ }
172
+ ]
173
+ }
174
+ },
175
+ {
176
+ "date": "Wed, 20 Sep 2023 14:59:52 GMT",
6
177
  "tag": "@fluentui/react-drawer_v9.0.0-beta.26",
7
178
  "version": "9.0.0-beta.26",
8
179
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,60 @@
1
1
  # Change Log - @fluentui/react-drawer
2
2
 
3
- This log was last generated on Wed, 20 Sep 2023 14:13:57 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 26 Sep 2023 17:44:10 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.0-beta.29](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.29)
8
+
9
+ Tue, 26 Sep 2023 17:44:10 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.28..@fluentui/react-drawer_v9.0.0-beta.29)
11
+
12
+ ### Changes
13
+
14
+ - chore: trigger manual version bump after broken release ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by yuanboxue@microsoft.com)
15
+ - Bump @fluentui/react-dialog to v9.7.3 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
16
+ - Bump @fluentui/react-jsx-runtime to v9.0.12 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
17
+ - Bump @fluentui/react-motion-preview to v0.2.8 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
18
+ - Bump @fluentui/react-shared-contexts to v9.9.1 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
19
+ - Bump @fluentui/react-theme to v9.1.14 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
20
+ - Bump @fluentui/react-utilities to v9.13.5 ([PR #29303](https://github.com/microsoft/fluentui/pull/29303) by beachball)
21
+
22
+ ## [9.0.0-beta.28](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.28)
23
+
24
+ Tue, 26 Sep 2023 15:31:59 GMT
25
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.27..@fluentui/react-drawer_v9.0.0-beta.28)
26
+
27
+ ### Changes
28
+
29
+ - fix: improve performance of CSS classes ([PR #29263](https://github.com/microsoft/fluentui/pull/29263) by marcosvmmoura@gmail.com)
30
+ - fix: resolve technical debts ([PR #29272](https://github.com/microsoft/fluentui/pull/29272) by marcosvmmoura@gmail.com)
31
+ - fix: bump swc core to mitigate transpilation memory leaks ([PR #29253](https://github.com/microsoft/fluentui/pull/29253) by martinhochel@microsoft.com)
32
+ - fix: use context to fetch dialog id ([PR #29273](https://github.com/microsoft/fluentui/pull/29273) by marcosvmmoura@gmail.com)
33
+ - fix: remove defaultOpen prop from DrawerInline as it had no effect ([PR #29274](https://github.com/microsoft/fluentui/pull/29274) by marcosvmmoura@gmail.com)
34
+ - feat: add dialog slot ([PR #29217](https://github.com/microsoft/fluentui/pull/29217) by marcosvmmoura@gmail.com)
35
+ - Bump @fluentui/react-dialog to v9.7.2 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
36
+ - Bump @fluentui/react-jsx-runtime to v9.0.11 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
37
+ - Bump @fluentui/react-motion-preview to v0.2.7 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
38
+ - Bump @fluentui/react-shared-contexts to v9.9.0 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
39
+ - Bump @fluentui/react-theme to v9.1.13 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
40
+ - Bump @fluentui/react-utilities to v9.13.4 ([PR #29300](https://github.com/microsoft/fluentui/pull/29300) by beachball)
41
+
42
+ ## [9.0.0-beta.27](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.27)
43
+
44
+ Wed, 20 Sep 2023 17:47:37 GMT
45
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.26..@fluentui/react-drawer_v9.0.0-beta.27)
46
+
47
+ ### Changes
48
+
49
+ - chore: trigger manual version bump after broken release ([PR #29197](https://github.com/microsoft/fluentui/pull/29197) by martinhochel@microsoft.com)
50
+ - Bump @fluentui/react-dialog to v9.7.1 ([PR #29197](https://github.com/microsoft/fluentui/pull/29197) by beachball)
51
+ - Bump @fluentui/react-jsx-runtime to v9.0.10 ([PR #29197](https://github.com/microsoft/fluentui/pull/29197) by beachball)
52
+ - Bump @fluentui/react-motion-preview to v0.2.6 ([PR #29197](https://github.com/microsoft/fluentui/pull/29197) by beachball)
53
+ - Bump @fluentui/react-shared-contexts to v9.8.1 ([PR #29197](https://github.com/microsoft/fluentui/pull/29197) by beachball)
54
+
7
55
  ## [9.0.0-beta.26](https://github.com/microsoft/fluentui/tree/@fluentui/react-drawer_v9.0.0-beta.26)
8
56
 
9
- Wed, 20 Sep 2023 14:13:57 GMT
57
+ Wed, 20 Sep 2023 14:59:52 GMT
10
58
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-drawer_v9.0.0-beta.25..@fluentui/react-drawer_v9.0.0-beta.26)
11
59
 
12
60
  ### Changes
package/dist/index.d.ts CHANGED
@@ -41,12 +41,6 @@ declare type DrawerBaseProps = {
41
41
  * @default false
42
42
  */
43
43
  open?: MotionShorthand<HTMLDivElement>;
44
- /**
45
- * Default value for the uncontrolled open state of the Drawer.
46
- *
47
- * @default false
48
- */
49
- defaultOpen?: boolean;
50
44
  };
51
45
 
52
46
  declare type DrawerBaseState = Required<Pick<DrawerBaseProps, 'position' | 'size'>> & {
@@ -75,7 +69,7 @@ export declare type DrawerBodySlots = {
75
69
  export declare type DrawerBodyState = ComponentState<DrawerBodySlots>;
76
70
 
77
71
  /**
78
- * DrawerFooter component - TODO: add more docs
72
+ * DrawerFooter provides a structured footer for the drawer component.
79
73
  */
80
74
  export declare const DrawerFooter: ForwardRefComponent<DrawerFooterProps>;
81
75
 
@@ -204,22 +198,25 @@ export declare type DrawerInlineState = Required<ComponentState<DrawerInlineSlot
204
198
  */
205
199
  export declare const DrawerOverlay: ForwardRefComponent<DrawerOverlayProps>;
206
200
 
207
- export declare const drawerOverlayClassNames: SlotClassNames<DrawerOverlaySlots>;
201
+ export declare const drawerOverlayClassNames: Omit<SlotClassNames<DrawerOverlaySlots>, 'dialog'>;
208
202
 
209
203
  /**
210
204
  * DrawerOverlay Props
211
205
  */
212
- export declare type DrawerOverlayProps = ComponentProps<DrawerOverlaySlots> & DrawerBaseProps & Pick<DialogProps, 'modalType' | 'onOpenChange' | 'inertTrapFocus'>;
206
+ export declare type DrawerOverlayProps = ComponentProps<DrawerOverlaySlots> & Pick<DialogProps, 'modalType' | 'onOpenChange' | 'inertTrapFocus' | 'defaultOpen'> & DrawerBaseProps;
213
207
 
214
208
  export declare type DrawerOverlaySlots = DialogSurfaceSlots & {
215
209
  root: Slot<DialogSurfaceProps>;
210
+ /**
211
+ * Slot for the dialog component that wraps the drawer.
212
+ */
213
+ dialog?: Slot<DialogProps>;
216
214
  };
217
215
 
218
216
  /**
219
217
  * State used in rendering DrawerOverlay
220
218
  */
221
- export declare type DrawerOverlayState = Required<Omit<ComponentState<DrawerOverlaySlots>, 'backdrop'> & DrawerBaseState & {
222
- dialog: DialogProps;
219
+ export declare type DrawerOverlayState = Omit<ComponentState<DrawerOverlaySlots>, 'backdrop'> & Required<DrawerBaseState & {
223
220
  backdropMotion: MotionState<HTMLDivElement>;
224
221
  }>;
225
222
 
@@ -1,4 +1,4 @@
1
- import { __styles, mergeClasses, shorthands } from '@griffel/react';
1
+ import { __resetStyles, mergeClasses, shorthands } from '@griffel/react';
2
2
  import { tokens } from '@fluentui/react-theme';
3
3
  export const drawerBodyClassNames = {
4
4
  root: 'fui-DrawerBody'
@@ -6,40 +6,13 @@ export const drawerBodyClassNames = {
6
6
  /**
7
7
  * Styles for the root slot
8
8
  */
9
- const useStyles = /*#__PURE__*/__styles({
10
- root: {
11
- B6of3ja: "fkrn0sh",
12
- t21cq0: ["f11qmguv", "f1tyq0we"],
13
- jrapky: "fmxx68s",
14
- Frg6f3: ["f1tyq0we", "f11qmguv"],
15
- z8tnut: "f1sl3k7w",
16
- z189sj: ["fnbas0t", "f1mswpri"],
17
- Byoj8tv: "f1brlhvm",
18
- uwmqm3: ["f1mswpri", "fnbas0t"],
19
- B68tc82: "f1oy3dpc",
20
- Bmxbyg5: "f5zp4f",
21
- Bh6795r: "fqerorx",
22
- Bnnss6s: "f1neuvcm",
23
- xawz: "f1pztt34",
24
- qb2dma: "f1ub7u0d",
25
- Bcmaq0h: "f1igvcbx",
26
- B676am1: "f1fofb6i",
27
- e5kdtc: "fo6xqva",
28
- De3pzq: "fxugw4r",
29
- Bkjc3bi: "fcre6b6",
30
- Bgh53k4: "f1besv5s",
31
- Bcx2cba: "f1pqm9hp",
32
- gonrqn: "f2c46kh"
33
- }
34
- }, {
35
- 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);}"]
36
- });
9
+ const useStyles = /*#__PURE__*/__resetStyles("r10z3gsy", "r1ppc5ap", [".r10z3gsy{margin-top:-1px;margin-right:0;margin-bottom:-1px;margin-left:0;padding-top:1px;padding-right:var(--spacingHorizontalXXL);padding-bottom:1px;padding-left:var(--spacingHorizontalXXL);overflow-x:auto;overflow-y:auto;flex-grow:1;flex-shrink:1;flex-basis:0;align-self:stretch;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));-webkit-background-position:bottom center,top center,bottom center,top center;background-position:bottom center,top center,bottom center,top center;background-repeat:no-repeat;background-color:var(--colorNeutralBackground1);background-size:100% 2px,100% 2px,100% 1px,100% 1px;background-attachment:local,local,scroll,scroll;}", ".r10z3gsy:last-child{padding-bottom:calc(var(--spacingHorizontalXXL) + 1px);}", ".r10z3gsy:first-child{padding-top:calc(var(--spacingHorizontalXXL) + 1px);}", ".r1ppc5ap{margin-top:-1px;margin-left:0;margin-bottom:-1px;margin-right:0;padding-top:1px;padding-left:var(--spacingHorizontalXXL);padding-bottom:1px;padding-right:var(--spacingHorizontalXXL);overflow-x:auto;overflow-y:auto;flex-grow:1;flex-shrink:1;flex-basis:0;align-self:stretch;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));-webkit-background-position:bottom center,top center,bottom center,top center;background-position:bottom center,top center,bottom center,top center;background-repeat:no-repeat;background-color:var(--colorNeutralBackground1);background-size:100% 2px,100% 2px,100% 1px,100% 1px;background-attachment:local,local,scroll,scroll;}", ".r1ppc5ap:last-child{padding-bottom:calc(var(--spacingHorizontalXXL) + 1px);}", ".r1ppc5ap:first-child{padding-top:calc(var(--spacingHorizontalXXL) + 1px);}"]);
37
10
  /**
38
11
  * Apply styling to the DrawerBody slots based on the state
39
12
  */
40
13
  export const useDrawerBodyStyles_unstable = state => {
41
14
  const styles = useStyles();
42
- state.root.className = mergeClasses(drawerBodyClassNames.root, styles.root, state.root.className);
15
+ state.root.className = mergeClasses(drawerBodyClassNames.root, styles, state.root.className);
43
16
  return state;
44
17
  };
45
18
  //# sourceMappingURL=useDrawerBodyStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","drawerBodyClassNames","root","useStyles","B6of3ja","t21cq0","jrapky","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","B68tc82","Bmxbyg5","Bh6795r","Bnnss6s","xawz","qb2dma","Bcmaq0h","B676am1","e5kdtc","De3pzq","Bkjc3bi","Bgh53k4","Bcx2cba","gonrqn","d","useDrawerBodyStyles_unstable","state","styles","className"],"sources":["useDrawerBodyStyles.styles.js"],"sourcesContent":["import { makeStyles, 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 */ const useStyles = makeStyles({\n root: {\n ...shorthands.margin('-1px', 0),\n ...shorthands.padding('1px', tokens.spacingHorizontalXXL),\n ...shorthands.overflow('auto'),\n ...shorthands.flex(1),\n alignSelf: 'stretch',\n // A \"good hack\" to display top and bottom borders based on the scroll position\n backgroundImage: `linear-gradient(to top, ${tokens.colorNeutralBackground1}, ${tokens.colorNeutralBackground1}),\n linear-gradient(to top, ${tokens.colorNeutralBackground1}, ${tokens.colorNeutralBackground1}),\n linear-gradient(to top, ${tokens.colorNeutralStroke1}, ${tokens.colorNeutralBackground1}),\n linear-gradient(to bottom, ${tokens.colorNeutralStroke1}, ${tokens.colorNeutralBackground1})`,\n 'background-position': 'bottom center, top center, bottom center, top center',\n backgroundRepeat: 'no-repeat',\n backgroundColor: tokens.colorNeutralBackground1,\n backgroundSize: '100% 2px, 100% 2px, 100% 1px, 100% 1px',\n backgroundAttachment: 'local, local, scroll, scroll',\n ':last-child': {\n paddingBottom: `calc(${tokens.spacingHorizontalXXL} + 1px)`\n },\n ':first-child': {\n paddingTop: `calc(${tokens.spacingHorizontalXXL} + 1px)`\n }\n }\n});\n/**\n * Apply styling to the DrawerBody slots based on the state\n */ export 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"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAwBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,MAAM,GAAG1B,SAAS,CAAC,CAAC;EAC1ByB,KAAK,CAAC1B,IAAI,CAAC4B,SAAS,GAAGhC,YAAY,CAACG,oBAAoB,CAACC,IAAI,EAAE2B,MAAM,CAAC3B,IAAI,EAAE0B,KAAK,CAAC1B,IAAI,CAAC4B,SAAS,CAAC;EACjG,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"names":["__resetStyles","mergeClasses","shorthands","tokens","drawerBodyClassNames","root","useStyles","useDrawerBodyStyles_unstable","state","styles","className"],"sources":["useDrawerBodyStyles.styles.js"],"sourcesContent":["import { makeResetStyles, 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 */ const useStyles = makeResetStyles({\n ...shorthands.margin('-1px', 0),\n ...shorthands.padding('1px', tokens.spacingHorizontalXXL),\n ...shorthands.overflow('auto'),\n ...shorthands.flex(1),\n alignSelf: 'stretch',\n // A \"good hack\" to display top and bottom borders based on the scroll position\n backgroundImage: `linear-gradient(to top, ${tokens.colorNeutralBackground1}, ${tokens.colorNeutralBackground1}),\n linear-gradient(to top, ${tokens.colorNeutralBackground1}, ${tokens.colorNeutralBackground1}),\n linear-gradient(to top, ${tokens.colorNeutralStroke1}, ${tokens.colorNeutralBackground1}),\n linear-gradient(to bottom, ${tokens.colorNeutralStroke1}, ${tokens.colorNeutralBackground1})`,\n 'background-position': 'bottom center, top center, bottom center, top center',\n backgroundRepeat: 'no-repeat',\n backgroundColor: tokens.colorNeutralBackground1,\n backgroundSize: '100% 2px, 100% 2px, 100% 1px, 100% 1px',\n backgroundAttachment: 'local, local, scroll, scroll',\n ':last-child': {\n paddingBottom: `calc(${tokens.spacingHorizontalXXL} + 1px)`\n },\n ':first-child': {\n paddingTop: `calc(${tokens.spacingHorizontalXXL} + 1px)`\n }\n});\n/**\n * Apply styling to the DrawerBody slots based on the state\n */ export const useDrawerBodyStyles_unstable = (state)=>{\n const styles = useStyles();\n state.root.className = mergeClasses(drawerBodyClassNames.root, styles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,aAAA,uvEAsBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGT,YAAY,CAACG,oBAAoB,CAACC,IAAI,EAAEI,MAAM,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC5F,OAAOF,KAAK;AAChB,CAAC"}
@@ -4,7 +4,7 @@ import { useDrawerFooter_unstable } from './useDrawerFooter';
4
4
  import { renderDrawerFooter_unstable } from './renderDrawerFooter';
5
5
  import { useDrawerFooterStyles_unstable } from './useDrawerFooterStyles.styles';
6
6
  /**
7
- * DrawerFooter component - TODO: add more docs
7
+ * DrawerFooter provides a structured footer for the drawer component.
8
8
  */ export const DrawerFooter = /*#__PURE__*/ React.forwardRef((props, ref)=>{
9
9
  const state = useDrawerFooter_unstable(props, ref);
10
10
  useDrawerFooterStyles_unstable(state);
@@ -1 +1 @@
1
- {"version":3,"sources":["DrawerFooter.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useDrawerFooter_unstable } from './useDrawerFooter';\nimport { renderDrawerFooter_unstable } from './renderDrawerFooter';\nimport { useDrawerFooterStyles_unstable } from './useDrawerFooterStyles.styles';\nimport type { DrawerFooterProps } from './DrawerFooter.types';\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 useCustomStyleHook_unstable('useDrawerFooterStyles_unstable')(state);\n\n return renderDrawerFooter_unstable(state);\n});\n\nDrawerFooter.displayName = 'DrawerFooter';\n"],"names":["React","useCustomStyleHook_unstable","useDrawerFooter_unstable","renderDrawerFooter_unstable","useDrawerFooterStyles_unstable","DrawerFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAC/BR,4BAA4B,kCAAkCQ;IAE9D,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
1
+ {"version":3,"sources":["DrawerFooter.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nimport { useDrawerFooter_unstable } from './useDrawerFooter';\nimport { renderDrawerFooter_unstable } from './renderDrawerFooter';\nimport { useDrawerFooterStyles_unstable } from './useDrawerFooterStyles.styles';\nimport type { DrawerFooterProps } from './DrawerFooter.types';\n\n/**\n * DrawerFooter provides a structured footer for the drawer component.\n */\nexport const DrawerFooter: ForwardRefComponent<DrawerFooterProps> = React.forwardRef((props, ref) => {\n const state = useDrawerFooter_unstable(props, ref);\n\n useDrawerFooterStyles_unstable(state);\n useCustomStyleHook_unstable('useDrawerFooterStyles_unstable')(state);\n\n return renderDrawerFooter_unstable(state);\n});\n\nDrawerFooter.displayName = 'DrawerFooter';\n"],"names":["React","useCustomStyleHook_unstable","useDrawerFooter_unstable","renderDrawerFooter_unstable","useDrawerFooterStyles_unstable","DrawerFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAC/BR,4BAA4B,kCAAkCQ;IAE9D,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
@@ -1,4 +1,4 @@
1
- import { __styles, mergeClasses, shorthands } from '@griffel/react';
1
+ import { __resetStyles, mergeClasses, shorthands } from '@griffel/react';
2
2
  import { tokens } from '@fluentui/react-theme';
3
3
  export const drawerFooterClassNames = {
4
4
  root: 'fui-DrawerFooter'
@@ -6,26 +6,13 @@ export const drawerFooterClassNames = {
6
6
  /**
7
7
  * Styles for the root slot
8
8
  */
9
- const useStyles = /*#__PURE__*/__styles({
10
- root: {
11
- z8tnut: "fikn0iw",
12
- z189sj: ["fnbas0t", "f1mswpri"],
13
- Byoj8tv: "fz66xbh",
14
- uwmqm3: ["f1mswpri", "fnbas0t"],
15
- mc9l5x: "f22iagw",
16
- Brf1p80: "fbhxue7",
17
- Bt984gj: "f122n59",
18
- i8kkvl: "fsnqrgy"
19
- }
20
- }, {
21
- 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);}"]
22
- });
9
+ const useStyles = /*#__PURE__*/__resetStyles("rli1cm2", "r1xlf3nx", [".rli1cm2{padding-top:var(--spacingVerticalL);padding-right:var(--spacingHorizontalXXL);padding-bottom:var(--spacingVerticalXXL);padding-left:var(--spacingHorizontalXXL);display:flex;justify-content:flex-start;align-items:center;column-gap:var(--spacingHorizontalS);}", ".r1xlf3nx{padding-top:var(--spacingVerticalL);padding-left:var(--spacingHorizontalXXL);padding-bottom:var(--spacingVerticalXXL);padding-right:var(--spacingHorizontalXXL);display:flex;justify-content:flex-start;align-items:center;column-gap:var(--spacingHorizontalS);}"]);
23
10
  /**
24
11
  * Apply styling to the DrawerFooter slots based on the state
25
12
  */
26
13
  export const useDrawerFooterStyles_unstable = state => {
27
14
  const styles = useStyles();
28
- state.root.className = mergeClasses(drawerFooterClassNames.root, styles.root, state.root.className);
15
+ state.root.className = mergeClasses(drawerFooterClassNames.root, styles, state.root.className);
29
16
  return state;
30
17
  };
31
18
  //# sourceMappingURL=useDrawerFooterStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","drawerFooterClassNames","root","useStyles","z8tnut","z189sj","Byoj8tv","uwmqm3","mc9l5x","Brf1p80","Bt984gj","i8kkvl","d","useDrawerFooterStyles_unstable","state","styles","className"],"sources":["useDrawerFooterStyles.styles.js"],"sourcesContent":["import { makeStyles, 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 */ const useStyles = makeStyles({\n root: {\n ...shorthands.padding(tokens.spacingVerticalL, tokens.spacingHorizontalXXL, tokens.spacingVerticalXXL),\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalS\n }\n});\n/**\n * Apply styling to the DrawerFooter slots based on the state\n */ export 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"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;EACvD,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGlB,YAAY,CAACG,sBAAsB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EACnG,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"names":["__resetStyles","mergeClasses","shorthands","tokens","drawerFooterClassNames","root","useStyles","useDrawerFooterStyles_unstable","state","styles","className"],"sources":["useDrawerFooterStyles.styles.js"],"sourcesContent":["import { makeResetStyles, 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 */ const useStyles = makeResetStyles({\n ...shorthands.padding(tokens.spacingVerticalL, tokens.spacingHorizontalXXL, tokens.spacingVerticalXXL),\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalS\n});\n/**\n * Apply styling to the DrawerFooter slots based on the state\n */ export const useDrawerFooterStyles_unstable = (state)=>{\n const styles = useStyles();\n state.root.className = mergeClasses(drawerFooterClassNames.root, styles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,aAAA,qjBAMrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,8BAA8B,GAAIC,KAAK,IAAG;EACvD,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGT,YAAY,CAACG,sBAAsB,CAACC,IAAI,EAAEI,MAAM,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC9F,OAAOF,KAAK;AAChB,CAAC"}
@@ -1,4 +1,4 @@
1
- import { __styles, mergeClasses, shorthands } from '@griffel/react';
1
+ import { __resetStyles, mergeClasses, shorthands } from '@griffel/react';
2
2
  import { tokens } from '@fluentui/react-theme';
3
3
  export const drawerHeaderClassNames = {
4
4
  root: 'fui-DrawerHeader'
@@ -6,27 +6,13 @@ export const drawerHeaderClassNames = {
6
6
  /**
7
7
  * Styles for the root slot
8
8
  */
9
- const useStyles = /*#__PURE__*/__styles({
10
- root: {
11
- z8tnut: "f1ggmyuv",
12
- z189sj: ["fnbas0t", "f1mswpri"],
13
- Byoj8tv: "f5b47ha",
14
- uwmqm3: ["f1mswpri", "fnbas0t"],
15
- i8kkvl: "fsnqrgy",
16
- Belr9w4: "fylz90v",
17
- qb2dma: "f1ub7u0d",
18
- mc9l5x: "f22iagw",
19
- Beiy3e4: "f1vx9l62"
20
- }
21
- }, {
22
- 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;}"]
23
- });
9
+ const useStyles = /*#__PURE__*/__resetStyles("r10tpwon", "r53n3g6", [".r10tpwon{padding-top:var(--spacingVerticalXXL);padding-right:var(--spacingHorizontalXXL);padding-bottom:var(--spacingVerticalS);padding-left:var(--spacingHorizontalXXL);column-gap:var(--spacingHorizontalS);row-gap:var(--spacingHorizontalS);align-self:stretch;display:flex;flex-direction:column;}", ".r53n3g6{padding-top:var(--spacingVerticalXXL);padding-left:var(--spacingHorizontalXXL);padding-bottom:var(--spacingVerticalS);padding-right:var(--spacingHorizontalXXL);column-gap:var(--spacingHorizontalS);row-gap:var(--spacingHorizontalS);align-self:stretch;display:flex;flex-direction:column;}"]);
24
10
  /**
25
11
  * Apply styling to the DrawerHeader slots based on the state
26
12
  */
27
13
  export const useDrawerHeaderStyles_unstable = state => {
28
14
  const styles = useStyles();
29
- state.root.className = mergeClasses(drawerHeaderClassNames.root, styles.root, state.root.className);
15
+ state.root.className = mergeClasses(drawerHeaderClassNames.root, styles, state.root.className);
30
16
  return state;
31
17
  };
32
18
  //# sourceMappingURL=useDrawerHeaderStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","drawerHeaderClassNames","root","useStyles","z8tnut","z189sj","Byoj8tv","uwmqm3","i8kkvl","Belr9w4","qb2dma","mc9l5x","Beiy3e4","d","useDrawerHeaderStyles_unstable","state","styles","className"],"sources":["useDrawerHeaderStyles.styles.js"],"sourcesContent":["import { makeStyles, 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 */ const useStyles = makeStyles({\n root: {\n ...shorthands.padding(tokens.spacingVerticalXXL, tokens.spacingHorizontalXXL, tokens.spacingVerticalS),\n ...shorthands.gap(tokens.spacingHorizontalS),\n alignSelf: 'stretch',\n display: 'flex',\n flexDirection: 'column'\n }\n});\n/**\n * Apply styling to the DrawerHeader slots based on the state\n */ export 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"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;EACvD,MAAMC,MAAM,GAAGb,SAAS,CAAC,CAAC;EAC1BY,KAAK,CAACb,IAAI,CAACe,SAAS,GAAGnB,YAAY,CAACG,sBAAsB,CAACC,IAAI,EAAEc,MAAM,CAACd,IAAI,EAAEa,KAAK,CAACb,IAAI,CAACe,SAAS,CAAC;EACnG,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"names":["__resetStyles","mergeClasses","shorthands","tokens","drawerHeaderClassNames","root","useStyles","useDrawerHeaderStyles_unstable","state","styles","className"],"sources":["useDrawerHeaderStyles.styles.js"],"sourcesContent":["import { makeResetStyles, 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 */ const useStyles = makeResetStyles({\n ...shorthands.padding(tokens.spacingVerticalXXL, tokens.spacingHorizontalXXL, tokens.spacingVerticalS),\n ...shorthands.gap(tokens.spacingHorizontalS),\n alignSelf: 'stretch',\n display: 'flex',\n flexDirection: 'column'\n});\n/**\n * Apply styling to the DrawerHeader slots based on the state\n */ export const useDrawerHeaderStyles_unstable = (state)=>{\n const styles = useStyles();\n state.root.className = mergeClasses(drawerHeaderClassNames.root, styles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,aAAA,+mBAMrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,8BAA8B,GAAIC,KAAK,IAAG;EACvD,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGT,YAAY,CAACG,sBAAsB,CAACC,IAAI,EAAEI,MAAM,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC9F,OAAOF,KAAK;AAChB,CAAC"}
@@ -1,4 +1,4 @@
1
- import { __styles, mergeClasses, shorthands } from '@griffel/react';
1
+ import { __resetStyles, mergeClasses, shorthands } from '@griffel/react';
2
2
  import { tokens } from '@fluentui/react-theme';
3
3
  export const drawerHeaderNavigationClassNames = {
4
4
  root: 'fui-DrawerHeaderNavigation'
@@ -6,23 +6,13 @@ export const drawerHeaderNavigationClassNames = {
6
6
  /**
7
7
  * Styles for the root slot
8
8
  */
9
- const useStyles = /*#__PURE__*/__styles({
10
- root: {
11
- B6of3ja: "f19304h5",
12
- t21cq0: ["f1qb19o0", "f1p10pdi"],
13
- jrapky: "f118i8d9",
14
- Frg6f3: ["f1p10pdi", "f1qb19o0"],
15
- Bxn5svx: "f1ftwmyh"
16
- }
17
- }, {
18
- 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;}"]
19
- });
9
+ const useStyles = /*#__PURE__*/__resetStyles("rfs9jc2", "r4yk2e8", [".rfs9jc2{margin-top:calc(var(--spacingVerticalS) * -1);margin-right:calc(var(--spacingHorizontalL) * -1);margin-bottom:calc(var(--spacingVerticalS) * -1);margin-left:calc(var(--spacingHorizontalL) * -1);}", ".r4yk2e8{margin-top:calc(var(--spacingVerticalS) * -1);margin-left:calc(var(--spacingHorizontalL) * -1);margin-bottom:calc(var(--spacingVerticalS) * -1);margin-right:calc(var(--spacingHorizontalL) * -1);}"]);
20
10
  /**
21
11
  * Apply styling to the DrawerHeaderNavigation slots based on the state
22
12
  */
23
13
  export const useDrawerHeaderNavigationStyles_unstable = state => {
24
14
  const styles = useStyles();
25
- state.root.className = mergeClasses(drawerHeaderNavigationClassNames.root, styles.root, state.root.className);
15
+ state.root.className = mergeClasses(drawerHeaderNavigationClassNames.root, styles, state.root.className);
26
16
  return state;
27
17
  };
28
18
  //# sourceMappingURL=useDrawerHeaderNavigationStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","tokens","drawerHeaderNavigationClassNames","root","useStyles","B6of3ja","t21cq0","jrapky","Frg6f3","Bxn5svx","d","useDrawerHeaderNavigationStyles_unstable","state","styles","className"],"sources":["useDrawerHeaderNavigationStyles.styles.js"],"sourcesContent":["import { makeStyles, 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 */ const useStyles = makeStyles({\n root: {\n ...shorthands.margin(`calc(${tokens.spacingVerticalS} * -1)`, `calc(${tokens.spacingHorizontalL} * -1)`),\n order: 0\n }\n});\n/**\n * Apply styling to the DrawerHeaderNavigation slots based on the state\n */ export 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"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,gCAAgC,GAAG;EAC5CC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,QAAA;EAAAK,IAAA;IAAAE,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAKrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,wCAAwC,GAAIC,KAAK,IAAG;EACjE,MAAMC,MAAM,GAAGT,SAAS,CAAC,CAAC;EAC1BQ,KAAK,CAACT,IAAI,CAACW,SAAS,GAAGf,YAAY,CAACG,gCAAgC,CAACC,IAAI,EAAEU,MAAM,CAACV,IAAI,EAAES,KAAK,CAACT,IAAI,CAACW,SAAS,CAAC;EAC7G,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"names":["__resetStyles","mergeClasses","shorthands","tokens","drawerHeaderNavigationClassNames","root","useStyles","useDrawerHeaderNavigationStyles_unstable","state","styles","className"],"sources":["useDrawerHeaderNavigationStyles.styles.js"],"sourcesContent":["import { makeResetStyles, 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 */ const useStyles = makeResetStyles({\n ...shorthands.margin(`calc(${tokens.spacingVerticalS} * -1)`, `calc(${tokens.spacingHorizontalL} * -1)`)\n});\n/**\n * Apply styling to the DrawerHeaderNavigation slots based on the state\n */ export const useDrawerHeaderNavigationStyles_unstable = (state)=>{\n const styles = useStyles();\n state.root.className = mergeClasses(drawerHeaderNavigationClassNames.root, styles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,gCAAgC,GAAG;EAC5CC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGN,aAAA,ubAErB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,wCAAwC,GAAIC,KAAK,IAAG;EACjE,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;EAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGT,YAAY,CAACG,gCAAgC,CAACC,IAAI,EAAEI,MAAM,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EACxG,OAAOF,KAAK;AAChB,CAAC"}
@@ -1,16 +1,15 @@
1
1
  import * as React from 'react';
2
2
  import { getNativeElementProps, slot } from '@fluentui/react-utilities';
3
- import { useDialogTitle_unstable } from '@fluentui/react-dialog';
3
+ import { useDialogContext_unstable } from '@fluentui/react-dialog';
4
4
  /**
5
5
  * @internal
6
6
  * Create the shorthand for the heading element.
7
7
  * @param props - props from this instance of DrawerHeaderTitle
8
8
  */ const useHeadingProps = ({ children, heading })=>{
9
- const resolvedHeading = slot.resolveShorthand(heading) || {};
10
- const { root: titleProps } = useDialogTitle_unstable(resolvedHeading, React.createRef());
11
- return slot.optional(titleProps, {
9
+ const id = useDialogContext_unstable((ctx)=>ctx.dialogTitleId);
10
+ return slot.optional(heading, {
12
11
  defaultProps: {
13
- ...titleProps,
12
+ id,
14
13
  children
15
14
  },
16
15
  renderByDefault: true,
@@ -1 +1 @@
1
- {"version":3,"sources":["useDrawerHeaderTitle.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useDialogTitle_unstable } from '@fluentui/react-dialog';\n\nimport type { DrawerHeaderTitleProps, DrawerHeaderTitleState } from './DrawerHeaderTitle.types';\n\n/**\n * @internal\n * Create the shorthand for the heading element.\n * @param props - props from this instance of DrawerHeaderTitle\n */\nconst useHeadingProps = ({ children, heading }: DrawerHeaderTitleProps) => {\n const resolvedHeading = slot.resolveShorthand(heading) || {};\n const { root: titleProps } = useDialogTitle_unstable(resolvedHeading, React.createRef());\n\n return slot.optional(titleProps, {\n defaultProps: {\n ...titleProps,\n children,\n },\n renderByDefault: true,\n elementType: 'h2',\n });\n};\n\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 */\nexport const useDrawerHeaderTitle_unstable = (\n props: DrawerHeaderTitleProps,\n ref: React.Ref<HTMLDivElement>,\n): DrawerHeaderTitleState => {\n const headingProps = useHeadingProps(props);\n\n return {\n components: {\n root: 'div',\n heading: 'h2',\n action: 'div',\n },\n\n root: slot.always(\n getNativeElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n ),\n heading: headingProps,\n action: slot.optional(props.action, {\n elementType: 'div',\n }),\n };\n};\n"],"names":["React","getNativeElementProps","slot","useDialogTitle_unstable","useHeadingProps","children","heading","resolvedHeading","resolveShorthand","root","titleProps","createRef","optional","defaultProps","renderByDefault","elementType","useDrawerHeaderTitle_unstable","props","ref","headingProps","components","action","always"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AACxE,SAASC,uBAAuB,QAAQ,yBAAyB;AAIjE;;;;CAIC,GACD,MAAMC,kBAAkB,CAAC,EAAEC,QAAQ,EAAEC,OAAO,EAA0B;IACpE,MAAMC,kBAAkBL,KAAKM,gBAAgB,CAACF,YAAY,CAAC;IAC3D,MAAM,EAAEG,MAAMC,UAAU,EAAE,GAAGP,wBAAwBI,iBAAiBP,MAAMW,SAAS;IAErF,OAAOT,KAAKU,QAAQ,CAACF,YAAY;QAC/BG,cAAc;YACZ,GAAGH,UAAU;YACbL;QACF;QACAS,iBAAiB;QACjBC,aAAa;IACf;AACF;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEA,MAAMC,eAAef,gBAAgBa;IAErC,OAAO;QACLG,YAAY;YACVX,MAAM;YACNH,SAAS;YACTe,QAAQ;QACV;QAEAZ,MAAMP,KAAKoB,MAAM,CACfrB,sBAAsB,OAAO;YAC3BiB;YACA,GAAGD,KAAK;QACV,IACA;YAAEF,aAAa;QAAM;QAEvBT,SAASa;QACTE,QAAQnB,KAAKU,QAAQ,CAACK,MAAMI,MAAM,EAAE;YAClCN,aAAa;QACf;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["useDrawerHeaderTitle.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useDialogContext_unstable } from '@fluentui/react-dialog';\n\nimport type { DrawerHeaderTitleProps, DrawerHeaderTitleState } from './DrawerHeaderTitle.types';\n\n/**\n * @internal\n * Create the shorthand for the heading element.\n * @param props - props from this instance of DrawerHeaderTitle\n */\nconst useHeadingProps = ({ children, heading }: DrawerHeaderTitleProps) => {\n const id = useDialogContext_unstable(ctx => ctx.dialogTitleId);\n\n return slot.optional(heading, {\n defaultProps: {\n id,\n children,\n },\n renderByDefault: true,\n elementType: 'h2',\n });\n};\n\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 */\nexport const useDrawerHeaderTitle_unstable = (\n props: DrawerHeaderTitleProps,\n ref: React.Ref<HTMLDivElement>,\n): DrawerHeaderTitleState => {\n const headingProps = useHeadingProps(props);\n\n return {\n components: {\n root: 'div',\n heading: 'h2',\n action: 'div',\n },\n\n root: slot.always(\n getNativeElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n ),\n heading: headingProps,\n action: slot.optional(props.action, {\n elementType: 'div',\n }),\n };\n};\n"],"names":["React","getNativeElementProps","slot","useDialogContext_unstable","useHeadingProps","children","heading","id","ctx","dialogTitleId","optional","defaultProps","renderByDefault","elementType","useDrawerHeaderTitle_unstable","props","ref","headingProps","components","root","action","always"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AACxE,SAASC,yBAAyB,QAAQ,yBAAyB;AAInE;;;;CAIC,GACD,MAAMC,kBAAkB,CAAC,EAAEC,QAAQ,EAAEC,OAAO,EAA0B;IACpE,MAAMC,KAAKJ,0BAA0BK,CAAAA,MAAOA,IAAIC,aAAa;IAE7D,OAAOP,KAAKQ,QAAQ,CAACJ,SAAS;QAC5BK,cAAc;YACZJ;YACAF;QACF;QACAO,iBAAiB;QACjBC,aAAa;IACf;AACF;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEA,MAAMC,eAAeb,gBAAgBW;IAErC,OAAO;QACLG,YAAY;YACVC,MAAM;YACNb,SAAS;YACTc,QAAQ;QACV;QAEAD,MAAMjB,KAAKmB,MAAM,CACfpB,sBAAsB,OAAO;YAC3Be;YACA,GAAGD,KAAK;QACV,IACA;YAAEF,aAAa;QAAM;QAEvBP,SAASW;QACTG,QAAQlB,KAAKQ,QAAQ,CAACK,MAAMK,MAAM,EAAE;YAClCP,aAAa;QACf;IACF;AACF,EAAE"}
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { getNativeElementProps, slot, useControllableState, useMergedRefs } from '@fluentui/react-utilities';
2
+ import { getNativeElementProps, slot, useMergedRefs } from '@fluentui/react-utilities';
3
3
  import { useMotion } from '@fluentui/react-motion-preview';
4
4
  import { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';
5
5
  /**
@@ -11,13 +11,8 @@ import { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';
11
11
  * @param props - props from this instance of DrawerInline
12
12
  * @param ref - reference to root HTMLElement of DrawerInline
13
13
  */ export const useDrawerInline_unstable = (props, ref)=>{
14
- const { size, position, ...defaultProps } = useDrawerDefaultProps(props);
14
+ const { size, position, open } = useDrawerDefaultProps(props);
15
15
  const { separator = false } = props;
16
- const [open] = useControllableState({
17
- state: defaultProps.open,
18
- defaultState: defaultProps.defaultOpen,
19
- initialState: false
20
- });
21
16
  const motion = useMotion(open);
22
17
  return {
23
18
  components: {
@@ -1 +1 @@
1
- {"version":3,"sources":["useDrawerInline.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot, useControllableState, useMergedRefs } from '@fluentui/react-utilities';\nimport { useMotion } from '@fluentui/react-motion-preview';\n\nimport type { DrawerInlineProps, DrawerInlineState } from './DrawerInline.types';\nimport { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';\n\n/**\n * Create the state required to render DrawerInline.\n *\n * The returned state can be modified with hooks such as useDrawerInlineStyles_unstable,\n * before being passed to renderDrawerInline_unstable.\n *\n * @param props - props from this instance of DrawerInline\n * @param ref - reference to root HTMLElement of DrawerInline\n */\nexport const useDrawerInline_unstable = (\n props: DrawerInlineProps,\n ref: React.Ref<HTMLDivElement>,\n): DrawerInlineState => {\n const { size, position, ...defaultProps } = useDrawerDefaultProps(props);\n const { separator = false } = props;\n\n const [open] = useControllableState({\n state: defaultProps.open,\n defaultState: defaultProps.defaultOpen,\n initialState: false,\n });\n\n const motion = useMotion<HTMLDivElement>(open);\n\n return {\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getNativeElementProps('div', {\n ...props,\n ref: useMergedRefs(ref, motion.ref),\n }),\n { elementType: 'div' },\n ),\n\n size,\n position,\n separator,\n motion,\n };\n};\n"],"names":["React","getNativeElementProps","slot","useControllableState","useMergedRefs","useMotion","useDrawerDefaultProps","useDrawerInline_unstable","props","ref","size","position","defaultProps","separator","open","state","defaultState","defaultOpen","initialState","motion","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,EAAEC,oBAAoB,EAAEC,aAAa,QAAQ,4BAA4B;AAC7G,SAASC,SAAS,QAAQ,iCAAiC;AAG3D,SAASC,qBAAqB,QAAQ,qCAAqC;AAE3E;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,MAAM,EAAEC,IAAI,EAAEC,QAAQ,EAAE,GAAGC,cAAc,GAAGN,sBAAsBE;IAClE,MAAM,EAAEK,YAAY,KAAK,EAAE,GAAGL;IAE9B,MAAM,CAACM,KAAK,GAAGX,qBAAqB;QAClCY,OAAOH,aAAaE,IAAI;QACxBE,cAAcJ,aAAaK,WAAW;QACtCC,cAAc;IAChB;IAEA,MAAMC,SAASd,UAA0BS;IAEzC,OAAO;QACLM,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMnB,KAAKoB,MAAM,CACfrB,sBAAsB,OAAO;YAC3B,GAAGO,KAAK;YACRC,KAAKL,cAAcK,KAAKU,OAAOV,GAAG;QACpC,IACA;YAAEc,aAAa;QAAM;QAGvBb;QACAC;QACAE;QACAM;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["useDrawerInline.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot, useMergedRefs } from '@fluentui/react-utilities';\nimport { useMotion } from '@fluentui/react-motion-preview';\n\nimport type { DrawerInlineProps, DrawerInlineState } from './DrawerInline.types';\nimport { useDrawerDefaultProps } from '../../shared/useDrawerDefaultProps';\n\n/**\n * Create the state required to render DrawerInline.\n *\n * The returned state can be modified with hooks such as useDrawerInlineStyles_unstable,\n * before being passed to renderDrawerInline_unstable.\n *\n * @param props - props from this instance of DrawerInline\n * @param ref - reference to root HTMLElement of DrawerInline\n */\nexport const useDrawerInline_unstable = (\n props: DrawerInlineProps,\n ref: React.Ref<HTMLDivElement>,\n): DrawerInlineState => {\n const { size, position, open } = useDrawerDefaultProps(props);\n const { separator = false } = props;\n\n const motion = useMotion<HTMLDivElement>(open);\n\n return {\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getNativeElementProps('div', {\n ...props,\n ref: useMergedRefs(ref, motion.ref),\n }),\n { elementType: 'div' },\n ),\n\n size,\n position,\n separator,\n motion,\n };\n};\n"],"names":["React","getNativeElementProps","slot","useMergedRefs","useMotion","useDrawerDefaultProps","useDrawerInline_unstable","props","ref","size","position","open","separator","motion","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,EAAEC,aAAa,QAAQ,4BAA4B;AACvF,SAASC,SAAS,QAAQ,iCAAiC;AAG3D,SAASC,qBAAqB,QAAQ,qCAAqC;AAE3E;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,MAAM,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GAAGN,sBAAsBE;IACvD,MAAM,EAAEK,YAAY,KAAK,EAAE,GAAGL;IAE9B,MAAMM,SAAST,UAA0BO;IAEzC,OAAO;QACLG,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMb,KAAKc,MAAM,CACff,sBAAsB,OAAO;YAC3B,GAAGM,KAAK;YACRC,KAAKL,cAAcK,KAAKK,OAAOL,GAAG;QACpC,IACA;YAAES,aAAa;QAAM;QAGvBR;QACAC;QACAE;QACAC;IACF;AACF,EAAE"}