@fluentui/react-divider 0.0.0-nightly3bc051736320220112.1 → 0.0.0-nightly43b133e62020220224.1

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 (36) hide show
  1. package/CHANGELOG.json +128 -20
  2. package/CHANGELOG.md +39 -10
  3. package/dist/react-divider.d.ts +8 -8
  4. package/lib/Divider.js.map +1 -1
  5. package/lib/components/Divider/Divider.js +6 -6
  6. package/lib/components/Divider/Divider.js.map +1 -1
  7. package/lib/components/Divider/Divider.types.d.ts +6 -5
  8. package/lib/components/Divider/Divider.types.js.map +1 -1
  9. package/lib/components/Divider/index.js.map +1 -1
  10. package/lib/components/Divider/renderDivider.d.ts +1 -1
  11. package/lib/components/Divider/renderDivider.js +2 -2
  12. package/lib/components/Divider/renderDivider.js.map +1 -1
  13. package/lib/components/Divider/useDivider.d.ts +1 -1
  14. package/lib/components/Divider/useDivider.js +2 -1
  15. package/lib/components/Divider/useDivider.js.map +1 -1
  16. package/lib/components/Divider/useDividerStyles.d.ts +1 -1
  17. package/lib/components/Divider/useDividerStyles.js +14 -8
  18. package/lib/components/Divider/useDividerStyles.js.map +1 -1
  19. package/lib/index.js.map +1 -1
  20. package/lib-commonjs/Divider.js.map +1 -1
  21. package/lib-commonjs/components/Divider/Divider.js +3 -3
  22. package/lib-commonjs/components/Divider/Divider.js.map +1 -1
  23. package/lib-commonjs/components/Divider/Divider.types.d.ts +6 -5
  24. package/lib-commonjs/components/Divider/Divider.types.js.map +1 -1
  25. package/lib-commonjs/components/Divider/index.js.map +1 -1
  26. package/lib-commonjs/components/Divider/renderDivider.d.ts +1 -1
  27. package/lib-commonjs/components/Divider/renderDivider.js +4 -4
  28. package/lib-commonjs/components/Divider/renderDivider.js.map +1 -1
  29. package/lib-commonjs/components/Divider/useDivider.d.ts +1 -1
  30. package/lib-commonjs/components/Divider/useDivider.js +4 -3
  31. package/lib-commonjs/components/Divider/useDivider.js.map +1 -1
  32. package/lib-commonjs/components/Divider/useDividerStyles.d.ts +1 -1
  33. package/lib-commonjs/components/Divider/useDividerStyles.js +20 -14
  34. package/lib-commonjs/components/Divider/useDividerStyles.js.map +1 -1
  35. package/lib-commonjs/index.js.map +1 -1
  36. package/package.json +6 -7
package/CHANGELOG.json CHANGED
@@ -2,29 +2,125 @@
2
2
  "name": "@fluentui/react-divider",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 12 Jan 2022 04:19:42 GMT",
6
- "tag": "@fluentui/react-divider_v0.0.0-nightly3bc051736320220112.1",
7
- "version": "0.0.0-nightly3bc051736320220112.1",
5
+ "date": "Thu, 24 Feb 2022 04:13:24 GMT",
6
+ "tag": "@fluentui/react-divider_v0.0.0-nightly43b133e62020220224.1",
7
+ "version": "0.0.0-nightly43b133e62020220224.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
11
11
  "author": "email not defined",
12
12
  "package": "@fluentui/react-divider",
13
- "commit": "480c16821614e08014fbc10b62ebbf1964c0058d",
13
+ "commit": "27a2c814edc7e5d9bb79037b2fabfff4a516ab8c",
14
14
  "comment": "Release nightly v9"
15
15
  },
16
+ {
17
+ "author": "olfedias@microsoft.com",
18
+ "package": "@fluentui/react-divider",
19
+ "commit": "084d7408855f3e52b67cbca172da1acef9dcb98f",
20
+ "comment": "fix: Add react-theme as dependency"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-divider",
25
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly43b133e62020220224.1",
26
+ "commit": "27a2c814edc7e5d9bb79037b2fabfff4a516ab8c"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-divider",
31
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly43b133e62020220224.1",
32
+ "commit": "27a2c814edc7e5d9bb79037b2fabfff4a516ab8c"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-divider",
37
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly43b133e62020220224.1",
38
+ "commit": "27a2c814edc7e5d9bb79037b2fabfff4a516ab8c"
39
+ }
40
+ ]
41
+ }
42
+ },
43
+ {
44
+ "date": "Fri, 18 Feb 2022 13:35:31 GMT",
45
+ "tag": "@fluentui/react-divider_v9.0.0-rc.3",
46
+ "version": "9.0.0-rc.3",
47
+ "comments": {
48
+ "prerelease": [
49
+ {
50
+ "author": "lingfangao@hotmail.com",
51
+ "package": "@fluentui/react-divider",
52
+ "commit": "1aa9e691fcccd9a64168cea7941c0f1e71fa1d14",
53
+ "comment": "fix: Source maps contain original source code"
54
+ },
55
+ {
56
+ "author": "beachball",
57
+ "package": "@fluentui/react-divider",
58
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.3",
59
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
60
+ },
61
+ {
62
+ "author": "beachball",
63
+ "package": "@fluentui/react-divider",
64
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3",
65
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
66
+ }
67
+ ]
68
+ }
69
+ },
70
+ {
71
+ "date": "Thu, 10 Feb 2022 08:51:10 GMT",
72
+ "tag": "@fluentui/react-divider_v9.0.0-rc.1",
73
+ "version": "9.0.0-rc.1",
74
+ "comments": {
75
+ "prerelease": [
76
+ {
77
+ "author": "gcox@microsoft.com",
78
+ "package": "@fluentui/react-divider",
79
+ "commit": "f6116328d6599342eef231f81d3c0724478a3d47",
80
+ "comment": "set minimum line length based on a11y review"
81
+ },
16
82
  {
17
83
  "author": "olfedias@microsoft.com",
18
84
  "package": "@fluentui/react-divider",
19
85
  "commit": "203cf1b61b1238c81ebe502678fe4714722cb435",
20
86
  "comment": "update styles to not use CSS shorthands"
21
87
  },
88
+ {
89
+ "author": "Humberto.Morimoto@microsoft.com",
90
+ "package": "@fluentui/react-divider",
91
+ "commit": "e0b8e1fa6980077e7b311fd1c72c28d3e4305db0",
92
+ "comment": "Updating based on changes to composition types."
93
+ },
22
94
  {
23
95
  "author": "Humberto.Morimoto@microsoft.com",
24
96
  "package": "@fluentui/react-divider",
25
97
  "commit": "034044d59be68915df76c57a84edc8299d3ca175",
26
98
  "comment": "react-divider: Replacing use of functions in makeStyles with direct use of tokens."
27
99
  },
100
+ {
101
+ "author": "behowell@microsoft.com",
102
+ "package": "@fluentui/react-divider",
103
+ "commit": "7cc28ed8320b00f42d91c63882f10316db2205c5",
104
+ "comment": "Remove component's shorthandProps array"
105
+ },
106
+ {
107
+ "author": "mgodbolt@microsoft.com",
108
+ "package": "@fluentui/react-divider",
109
+ "commit": "839ec14849e112b85aa321d034739ec421199141",
110
+ "comment": "remove export of commons types"
111
+ },
112
+ {
113
+ "author": "lingfangao@hotmail.com",
114
+ "package": "@fluentui/react-divider",
115
+ "commit": "c00913d50e2dd15bbfbb0757cefe43b192ff1d7f",
116
+ "comment": "Bump Fluent UI packages to 9.0.0-rc"
117
+ },
118
+ {
119
+ "author": "gcox@microsoft.com",
120
+ "package": "@fluentui/react-divider",
121
+ "commit": "ae269d1c40fce9dcfb41d9dafa4678d025576201",
122
+ "comment": "Added aria-orientation to divider"
123
+ },
28
124
  {
29
125
  "author": "gcox@microsoft.com",
30
126
  "package": "@fluentui/react-divider",
@@ -32,40 +128,40 @@
32
128
  "comment": "Added missing descriptions to divider stories"
33
129
  },
34
130
  {
35
- "author": "Humberto.Morimoto@microsoft.com",
131
+ "author": "behowell@microsoft.com",
36
132
  "package": "@fluentui/react-divider",
37
- "commit": "00a5d945904c896a0664de6ba72c145a255f0848",
38
- "comment": "Updating use of tokens.fontWeight now that we don't need to use casting."
133
+ "commit": "53b01d71e335715fda91b33e3d7bbd9d471d5ed3",
134
+ "comment": "Refactor component Slot typings"
39
135
  },
40
136
  {
41
- "author": "beachball",
137
+ "author": "behowell@microsoft.com",
42
138
  "package": "@fluentui/react-divider",
43
- "comment": "Bump @fluentui/react-make-styles to v0.0.0-nightly3bc051736320220112.1",
44
- "commit": "480c16821614e08014fbc10b62ebbf1964c0058d"
139
+ "commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
140
+ "comment": "BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
45
141
  },
46
142
  {
47
- "author": "beachball",
143
+ "author": "Humberto.Morimoto@microsoft.com",
48
144
  "package": "@fluentui/react-divider",
49
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly3bc051736320220112.1",
50
- "commit": "480c16821614e08014fbc10b62ebbf1964c0058d"
145
+ "commit": "00a5d945904c896a0664de6ba72c145a255f0848",
146
+ "comment": "Updating use of tokens.fontWeight now that we don't need to use casting."
51
147
  },
52
148
  {
53
- "author": "beachball",
149
+ "author": "olfedias@microsoft.com",
54
150
  "package": "@fluentui/react-divider",
55
- "comment": "Bump @fluentui/babel-make-styles to v0.0.0-nightly3bc051736320220112.1",
56
- "commit": "480c16821614e08014fbc10b62ebbf1964c0058d"
151
+ "commit": "7f2bb0ceb2a4d079c34fb58ebc9a5e15245a2cbe",
152
+ "comment": "Replace make-styles packages with griffel equivalents."
57
153
  },
58
154
  {
59
155
  "author": "beachball",
60
156
  "package": "@fluentui/react-divider",
61
- "comment": "Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightly3bc051736320220112.1",
62
- "commit": "480c16821614e08014fbc10b62ebbf1964c0058d"
157
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.1",
158
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
63
159
  },
64
160
  {
65
161
  "author": "beachball",
66
162
  "package": "@fluentui/react-divider",
67
- "comment": "Bump @fluentui/react-conformance-make-styles to v0.0.0-nightly3bc051736320220112.1",
68
- "commit": "480c16821614e08014fbc10b62ebbf1964c0058d"
163
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.1",
164
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
69
165
  }
70
166
  ],
71
167
  "none": [
@@ -74,6 +170,18 @@
74
170
  "package": "@fluentui/react-divider",
75
171
  "commit": "57677496452840365886d4f12a98b62739e65286",
76
172
  "comment": "Migration to ts config solution"
173
+ },
174
+ {
175
+ "author": "olfedias@microsoft.com",
176
+ "package": "@fluentui/react-divider",
177
+ "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
178
+ "comment": "remove inline-style-expand-shorthand from tsconfigs"
179
+ },
180
+ {
181
+ "author": "martinhochel@microsoft.com",
182
+ "package": "@fluentui/react-divider",
183
+ "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
184
+ "comment": "chore: use storybook runner for all vNext packages"
77
185
  }
78
186
  ]
79
187
  }
package/CHANGELOG.md CHANGED
@@ -1,26 +1,55 @@
1
1
  # Change Log - @fluentui/react-divider
2
2
 
3
- This log was last generated on Wed, 12 Jan 2022 04:19:42 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 24 Feb 2022 04:13:24 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly3bc051736320220112.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v0.0.0-nightly3bc051736320220112.1)
7
+ ## [0.0.0-nightly43b133e62020220224.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v0.0.0-nightly43b133e62020220224.1)
8
8
 
9
- Wed, 12 Jan 2022 04:19:42 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.0.0-beta.4..@fluentui/react-divider_v0.0.0-nightly3bc051736320220112.1)
9
+ Thu, 24 Feb 2022 04:13:24 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.0.0-rc.3..@fluentui/react-divider_v0.0.0-nightly43b133e62020220224.1)
11
11
 
12
12
  ### Changes
13
13
 
14
- - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/480c16821614e08014fbc10b62ebbf1964c0058d) by email not defined)
14
+ - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/27a2c814edc7e5d9bb79037b2fabfff4a516ab8c) by email not defined)
15
+ - fix: Add react-theme as dependency ([PR #21825](https://github.com/microsoft/fluentui/pull/21825) by olfedias@microsoft.com)
16
+ - Bump @fluentui/react-theme to v0.0.0-nightly43b133e62020220224.1 ([commit](https://github.com/microsoft/fluentui/commit/27a2c814edc7e5d9bb79037b2fabfff4a516ab8c) by beachball)
17
+ - Bump @fluentui/react-utilities to v0.0.0-nightly43b133e62020220224.1 ([commit](https://github.com/microsoft/fluentui/commit/27a2c814edc7e5d9bb79037b2fabfff4a516ab8c) by beachball)
18
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly43b133e62020220224.1 ([commit](https://github.com/microsoft/fluentui/commit/27a2c814edc7e5d9bb79037b2fabfff4a516ab8c) by beachball)
19
+
20
+ ## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.0.0-rc.3)
21
+
22
+ Fri, 18 Feb 2022 13:35:31 GMT
23
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.0.0-rc.1..@fluentui/react-divider_v9.0.0-rc.3)
24
+
25
+ ### Changes
26
+
27
+ - fix: Source maps contain original source code ([PR #21690](https://github.com/microsoft/fluentui/pull/21690) by lingfangao@hotmail.com)
28
+ - Bump @fluentui/react-utilities to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
29
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
30
+
31
+ ## [9.0.0-rc.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.0.0-rc.1)
32
+
33
+ Thu, 10 Feb 2022 08:51:10 GMT
34
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.0.0-beta.4..@fluentui/react-divider_v9.0.0-rc.1)
35
+
36
+ ### Changes
37
+
38
+ - set minimum line length based on a11y review ([PR #21362](https://github.com/microsoft/fluentui/pull/21362) by gcox@microsoft.com)
15
39
  - update styles to not use CSS shorthands ([PR #20817](https://github.com/microsoft/fluentui/pull/20817) by olfedias@microsoft.com)
40
+ - Updating based on changes to composition types. ([PR #20891](https://github.com/microsoft/fluentui/pull/20891) by Humberto.Morimoto@microsoft.com)
16
41
  - react-divider: Replacing use of functions in makeStyles with direct use of tokens. ([PR #21043](https://github.com/microsoft/fluentui/pull/21043) by Humberto.Morimoto@microsoft.com)
42
+ - Remove component's shorthandProps array ([PR #21134](https://github.com/microsoft/fluentui/pull/21134) by behowell@microsoft.com)
43
+ - remove export of commons types ([PR #21660](https://github.com/microsoft/fluentui/pull/21660) by mgodbolt@microsoft.com)
44
+ - Bump Fluent UI packages to 9.0.0-rc ([PR #21623](https://github.com/microsoft/fluentui/pull/21623) by lingfangao@hotmail.com)
45
+ - Added aria-orientation to divider ([PR #21292](https://github.com/microsoft/fluentui/pull/21292) by gcox@microsoft.com)
17
46
  - Added missing descriptions to divider stories ([PR #21067](https://github.com/microsoft/fluentui/pull/21067) by gcox@microsoft.com)
47
+ - Refactor component Slot typings ([PR #21518](https://github.com/microsoft/fluentui/pull/21518) by behowell@microsoft.com)
48
+ - BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet ([PR #21365](https://github.com/microsoft/fluentui/pull/21365) by behowell@microsoft.com)
18
49
  - Updating use of tokens.fontWeight now that we don't need to use casting. ([PR #21217](https://github.com/microsoft/fluentui/pull/21217) by Humberto.Morimoto@microsoft.com)
19
- - Bump @fluentui/react-make-styles to v0.0.0-nightly3bc051736320220112.1 ([commit](https://github.com/microsoft/fluentui/commit/480c16821614e08014fbc10b62ebbf1964c0058d) by beachball)
20
- - Bump @fluentui/react-utilities to v0.0.0-nightly3bc051736320220112.1 ([commit](https://github.com/microsoft/fluentui/commit/480c16821614e08014fbc10b62ebbf1964c0058d) by beachball)
21
- - Bump @fluentui/babel-make-styles to v0.0.0-nightly3bc051736320220112.1 ([commit](https://github.com/microsoft/fluentui/commit/480c16821614e08014fbc10b62ebbf1964c0058d) by beachball)
22
- - Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightly3bc051736320220112.1 ([commit](https://github.com/microsoft/fluentui/commit/480c16821614e08014fbc10b62ebbf1964c0058d) by beachball)
23
- - Bump @fluentui/react-conformance-make-styles to v0.0.0-nightly3bc051736320220112.1 ([commit](https://github.com/microsoft/fluentui/commit/480c16821614e08014fbc10b62ebbf1964c0058d) by beachball)
50
+ - Replace make-styles packages with griffel equivalents. ([PR #21433](https://github.com/microsoft/fluentui/pull/21433) by olfedias@microsoft.com)
51
+ - Bump @fluentui/react-utilities to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
52
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
24
53
 
25
54
  ## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.0.0-beta.4)
26
55
 
package/dist/react-divider.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  import type { ComponentProps } from '@fluentui/react-utilities';
2
2
  import type { ComponentState } from '@fluentui/react-utilities';
3
3
  import type { ForwardRefComponent } from '@fluentui/react-utilities';
4
- import type { IntrinsicShorthandProps } from '@fluentui/react-utilities';
5
4
  import * as React_2 from 'react';
5
+ import type { Slot } from '@fluentui/react-utilities';
6
6
 
7
7
  /**
8
8
  * A divider visually segments content into groups.
@@ -11,7 +11,7 @@ export declare const Divider: ForwardRefComponent<DividerProps>;
11
11
 
12
12
  export declare const dividerClassName = "fui-Divider";
13
13
 
14
- export declare type DividerCommons = {
14
+ declare type DividerCommons = {
15
15
  /**
16
16
  * Determines the alignment of the content within the divider.
17
17
  * @defaultvalue 'center'
@@ -34,17 +34,17 @@ export declare type DividerCommons = {
34
34
  vertical: boolean;
35
35
  };
36
36
 
37
- export declare type DividerProps = ComponentProps<DividerSlots> & Partial<DividerCommons>;
37
+ export declare type DividerProps = ComponentProps<Partial<DividerSlots>> & Partial<DividerCommons>;
38
38
 
39
39
  export declare type DividerSlots = {
40
40
  /**
41
41
  * Root of the component that renders as a `<div>` tag.
42
42
  */
43
- root: IntrinsicShorthandProps<'div'>;
43
+ root: Slot<'div'>;
44
44
  /**
45
45
  * Accessibility wrapper for content when presented.
46
46
  */
47
- wrapper: IntrinsicShorthandProps<'div'>;
47
+ wrapper: Slot<'div'>;
48
48
  };
49
49
 
50
50
  export declare type DividerState = ComponentState<DividerSlots> & DividerCommons;
@@ -52,15 +52,15 @@ export declare type DividerState = ComponentState<DividerSlots> & DividerCommons
52
52
  /**
53
53
  * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
54
54
  */
55
- export declare const renderDivider: (state: DividerState) => JSX.Element;
55
+ export declare const renderDivider_unstable: (state: DividerState) => JSX.Element;
56
56
 
57
57
  /**
58
58
  * Returns the props and state required to render the component
59
59
  * @param props - User-provided props to the Divider component.
60
60
  * @param ref - User-provided ref to be passed to the Divider component.
61
61
  */
62
- export declare const useDivider: (props: DividerProps, ref: React_2.Ref<HTMLElement>) => DividerState;
62
+ export declare const useDivider_unstable: (props: DividerProps, ref: React_2.Ref<HTMLElement>) => DividerState;
63
63
 
64
- export declare const useDividerStyles: (state: DividerState) => DividerState;
64
+ export declare const useDividerStyles_unstable: (state: DividerState) => DividerState;
65
65
 
66
66
  export { }
package/lib/Divider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Divider.js","sourceRoot":"","sources":["../src/Divider.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC"}
1
+ {"version":3,"file":"Divider.js","sourceRoot":"../src/","sources":["Divider.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './components/Divider/index';\n"]}
package/lib/components/Divider/Divider.js CHANGED
@@ -1,15 +1,15 @@
1
1
  import * as React from 'react';
2
- import { renderDivider } from './renderDivider';
3
- import { useDivider } from './useDivider';
4
- import { useDividerStyles } from './useDividerStyles';
2
+ import { renderDivider_unstable } from './renderDivider';
3
+ import { useDivider_unstable } from './useDivider';
4
+ import { useDividerStyles_unstable } from './useDividerStyles';
5
5
  /**
6
6
  * A divider visually segments content into groups.
7
7
  */
8
8
 
9
9
  export const Divider = /*#__PURE__*/React.forwardRef((props, ref) => {
10
- const state = useDivider(props, ref);
11
- useDividerStyles(state);
12
- return renderDivider(state);
10
+ const state = useDivider_unstable(props, ref);
11
+ useDividerStyles_unstable(state);
12
+ return renderDivider_unstable(state);
13
13
  });
14
14
  Divider.displayName = 'Divider';
15
15
  //# sourceMappingURL=Divider.js.map
package/lib/components/Divider/Divider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,UAAT,QAA2B,cAA3B;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AAIA;;AAEG;;AACH,OAAO,MAAM,OAAO,gBAAsC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACxF,QAAM,KAAK,GAAG,UAAU,CAAC,KAAD,EAAQ,GAAR,CAAxB;AAEA,EAAA,gBAAgB,CAAC,KAAD,CAAhB;AAEA,SAAO,aAAa,CAAC,KAAD,CAApB;AACD,CANyD,CAAnD;AAQP,OAAO,CAAC,WAAR,GAAsB,SAAtB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,mBAAT,QAAoC,cAApC;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AAIA;;AAEG;;AACH,OAAO,MAAM,OAAO,gBAAsC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACxF,QAAM,KAAK,GAAG,mBAAmB,CAAC,KAAD,EAAQ,GAAR,CAAjC;AAEA,EAAA,yBAAyB,CAAC,KAAD,CAAzB;AAEA,SAAO,sBAAsB,CAAC,KAAD,CAA7B;AACD,CANyD,CAAnD;AAQP,OAAO,CAAC,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\n\n/**\n * A divider visually segments content into groups.\n */\nexport const Divider: ForwardRefComponent<DividerProps> = React.forwardRef((props, ref) => {\n const state = useDivider_unstable(props, ref);\n\n useDividerStyles_unstable(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"sourceRoot":"../src/"}
package/lib/components/Divider/Divider.types.d.ts CHANGED
@@ -1,15 +1,15 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
1
+ import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
2
2
  export declare type DividerSlots = {
3
3
  /**
4
4
  * Root of the component that renders as a `<div>` tag.
5
5
  */
6
- root: IntrinsicShorthandProps<'div'>;
6
+ root: Slot<'div'>;
7
7
  /**
8
8
  * Accessibility wrapper for content when presented.
9
9
  */
10
- wrapper: IntrinsicShorthandProps<'div'>;
10
+ wrapper: Slot<'div'>;
11
11
  };
12
- export declare type DividerCommons = {
12
+ declare type DividerCommons = {
13
13
  /**
14
14
  * Determines the alignment of the content within the divider.
15
15
  * @defaultvalue 'center'
@@ -31,5 +31,6 @@ export declare type DividerCommons = {
31
31
  */
32
32
  vertical: boolean;
33
33
  };
34
- export declare type DividerProps = ComponentProps<DividerSlots> & Partial<DividerCommons>;
34
+ export declare type DividerProps = ComponentProps<Partial<DividerSlots>> & Partial<DividerCommons>;
35
35
  export declare type DividerState = ComponentState<DividerSlots> & DividerCommons;
36
+ export {};
package/lib/components/Divider/Divider.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Divider.types.js","sourceRoot":"","sources":["../../../src/components/Divider/Divider.types.ts"],"names":[],"mappings":""}
1
+ {"version":3,"file":"Divider.types.js","sourceRoot":"../src/","sources":["components/Divider/Divider.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type DividerSlots = {\n /**\n * Root of the component that renders as a `<div>` tag.\n */\n root: Slot<'div'>;\n\n /**\n * Accessibility wrapper for content when presented.\n */\n wrapper: Slot<'div'>;\n};\n\ntype DividerCommons = {\n /**\n * Determines the alignment of the content within the divider.\n * @defaultvalue 'center'\n */\n alignContent: 'start' | 'center' | 'end';\n\n /**\n * A divider can have one of the preset appearances.\n * When not specified, the divider has its default appearance.\n */\n appearance?: 'brand' | 'strong' | 'subtle';\n\n /**\n * Adds padding to the beginning and end of the divider.\n * @default false\n */\n inset: boolean;\n\n /**\n * A divider can be horizontal (default) or vertical.\n * @default false\n */\n vertical: boolean;\n};\n\nexport type DividerProps = ComponentProps<Partial<DividerSlots>> & Partial<DividerCommons>;\n\nexport type DividerState = ComponentState<DividerSlots> & DividerCommons;\n"]}
package/lib/components/Divider/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Divider/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Divider/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './Divider';\nexport * from './Divider.types';\nexport * from './renderDivider';\nexport * from './useDivider';\nexport * from './useDividerStyles';\n"]}
package/lib/components/Divider/renderDivider.d.ts CHANGED
@@ -2,4 +2,4 @@ import { DividerState } from './Divider.types';
2
2
  /**
3
3
  * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
4
4
  */
5
- export declare const renderDivider: (state: DividerState) => JSX.Element;
5
+ export declare const renderDivider_unstable: (state: DividerState) => JSX.Element;
package/lib/components/Divider/renderDivider.js CHANGED
@@ -4,11 +4,11 @@ import { getSlots } from '@fluentui/react-utilities';
4
4
  * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
5
5
  */
6
6
 
7
- export const renderDivider = state => {
7
+ export const renderDivider_unstable = state => {
8
8
  const {
9
9
  slots,
10
10
  slotProps
11
- } = getSlots(state, ['root', 'wrapper']);
11
+ } = getSlots(state);
12
12
  return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
13
13
  }, slotProps.root.children !== undefined && /*#__PURE__*/React.createElement(slots.wrapper, { ...slotProps.wrapper
14
14
  }, slotProps.root.children));
package/lib/components/Divider/renderDivider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/renderDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,aAAa,GAAI,KAAD,IAAwB;AACnD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAe,KAAf,EAAsB,CAAC,MAAD,EAAS,SAAT,CAAtB,CAArC;AACA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,SAAS,CAAC,IAAV,CAAe,QAAf,KAA4B,SAA5B,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;AAAf,GAAd,EAAuC,SAAS,CAAC,IAAV,CAAe,QAAtD,CAFJ,CADF;AAOD,CATM","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/renderDivider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,sBAAsB,GAAI,KAAD,IAAwB;AAC5D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAe,KAAf,CAArC;AACA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,SAAS,CAAC,IAAV,CAAe,QAAf,KAA4B,SAA5B,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;AAAf,GAAd,EAAuC,SAAS,CAAC,IAAV,CAAe,QAAtD,CAFJ,CADF;AAOD,CATM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from './Divider.types';\n\n/**\n * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.\n */\nexport const renderDivider_unstable = (state: DividerState) => {\n const { slots, slotProps } = getSlots<DividerSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children !== undefined && (\n <slots.wrapper {...slotProps.wrapper}>{slotProps.root.children}</slots.wrapper>\n )}\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
package/lib/components/Divider/useDivider.d.ts CHANGED
@@ -5,4 +5,4 @@ import type { DividerProps, DividerState } from './Divider.types';
5
5
  * @param props - User-provided props to the Divider component.
6
6
  * @param ref - User-provided ref to be passed to the Divider component.
7
7
  */
8
- export declare const useDivider: (props: DividerProps, ref: React.Ref<HTMLElement>) => DividerState;
8
+ export declare const useDivider_unstable: (props: DividerProps, ref: React.Ref<HTMLElement>) => DividerState;
package/lib/components/Divider/useDivider.js CHANGED
@@ -5,7 +5,7 @@ import { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-
5
5
  * @param ref - User-provided ref to be passed to the Divider component.
6
6
  */
7
7
 
8
- export const useDivider = (props, ref) => {
8
+ export const useDivider_unstable = (props, ref) => {
9
9
  const {
10
10
  alignContent = 'center',
11
11
  appearance,
@@ -28,6 +28,7 @@ export const useDivider = (props, ref) => {
28
28
  root: getNativeElementProps('div', { ...props,
29
29
  ref,
30
30
  role: 'separator',
31
+ 'aria-orientation': vertical ? 'vertical' : 'horizontal',
31
32
  'aria-labelledby': props.children ? dividerId : undefined
32
33
  }),
33
34
  wrapper: resolveShorthand(wrapper, {
package/lib/components/Divider/useDivider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/useDivider.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AAGA;;;;AAIG;;AACH,OAAO,MAAM,UAAU,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;AAC3F,QAAM;AAAE,IAAA,YAAY,GAAG,QAAjB;AAA2B,IAAA,UAA3B;AAAuC,IAAA,KAAK,GAAG,KAA/C;AAAsD,IAAA,QAAQ,GAAG,KAAjE;AAAwE,IAAA;AAAxE,MAAoF,KAA1F;AACA,QAAM,SAAS,GAAG,KAAK,CAAC,UAAD,CAAvB;AAEA,SAAO;AACL;AACA,IAAA,YAFK;AAGL,IAAA,UAHK;AAIL,IAAA,KAJK;AAKL,IAAA,QALK;AAOL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,OAAO,EAAE;AAFC,KARP;AAaL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,IAAI,EAAE,WAH2B;AAIjC,yBAAmB,KAAK,CAAC,QAAN,GAAiB,SAAjB,GAA6B;AAJf,KAAR,CAbtB;AAmBL,IAAA,OAAO,EAAE,gBAAgB,CAAC,OAAD,EAAU;AACjC,MAAA,QAAQ,EAAE,IADuB;AAEjC,MAAA,YAAY,EAAE;AACZ,QAAA,EAAE,EAAE,SADQ;AAEZ,QAAA,QAAQ,EAAE,KAAK,CAAC;AAFJ;AAFmB,KAAV;AAnBpB,GAAP;AA2BD,CA/BM","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/useDivider.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AAGA;;;;AAIG;;AACH,OAAO,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;AACpG,QAAM;AAAE,IAAA,YAAY,GAAG,QAAjB;AAA2B,IAAA,UAA3B;AAAuC,IAAA,KAAK,GAAG,KAA/C;AAAsD,IAAA,QAAQ,GAAG,KAAjE;AAAwE,IAAA;AAAxE,MAAoF,KAA1F;AACA,QAAM,SAAS,GAAG,KAAK,CAAC,UAAD,CAAvB;AAEA,SAAO;AACL;AACA,IAAA,YAFK;AAGL,IAAA,UAHK;AAIL,IAAA,KAJK;AAKL,IAAA,QALK;AAOL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,OAAO,EAAE;AAFC,KARP;AAaL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,IAAI,EAAE,WAH2B;AAIjC,0BAAoB,QAAQ,GAAG,UAAH,GAAgB,YAJX;AAKjC,yBAAmB,KAAK,CAAC,QAAN,GAAiB,SAAjB,GAA6B;AALf,KAAR,CAbtB;AAoBL,IAAA,OAAO,EAAE,gBAAgB,CAAC,OAAD,EAAU;AACjC,MAAA,QAAQ,EAAE,IADuB;AAEjC,MAAA,YAAY,EAAE;AACZ,QAAA,EAAE,EAAE,SADQ;AAEZ,QAAA,QAAQ,EAAE,KAAK,CAAC;AAFJ;AAFmB,KAAV;AApBpB,GAAP;AA4BD,CAhCM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - User-provided props to the Divider component.\n * @param ref - User-provided ref to be passed to the Divider component.\n */\nexport const useDivider_unstable = (props: DividerProps, ref: React.Ref<HTMLElement>): DividerState => {\n const { alignContent = 'center', appearance, inset = false, vertical = false, wrapper } = props;\n const dividerId = useId('divider-');\n\n return {\n // Props passed at the top-level\n alignContent,\n appearance,\n inset,\n vertical,\n\n // Slots definition\n components: {\n root: 'div',\n wrapper: 'div',\n },\n\n root: getNativeElementProps('div', {\n ...props,\n ref,\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n }),\n wrapper: resolveShorthand(wrapper, {\n required: true,\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n }),\n };\n};\n"],"sourceRoot":"../src/"}
package/lib/components/Divider/useDividerStyles.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { DividerState } from './Divider.types';
2
2
  export declare const dividerClassName = "fui-Divider";
3
- export declare const useDividerStyles: (state: DividerState) => DividerState;
3
+ export declare const useDividerStyles_unstable: (state: DividerState) => DividerState;
package/lib/components/Divider/useDividerStyles.js CHANGED
@@ -1,9 +1,10 @@
1
- import { mergeClasses, shorthands, __styles } from '@fluentui/react-make-styles';
1
+ import { mergeClasses, shorthands, __styles } from '@griffel/react';
2
2
  import { tokens } from '@fluentui/react-theme';
3
3
  export const dividerClassName = 'fui-Divider';
4
4
  const contentSpacing = '12px';
5
5
  const insetSpacing = '12px';
6
- const startEndMaxHeight = '8px';
6
+ const maxStartEndLength = '8px';
7
+ const minStartEndLength = '8px;';
7
8
 
8
9
  const useBaseStyles = /*#__PURE__*/__styles({
9
10
  "base": {
@@ -17,6 +18,7 @@ const useBaseStyles = /*#__PURE__*/__styles({
17
18
  "Be2twd7": "fy9rknc",
18
19
  "Bhrd7zp": "figsok6",
19
20
  "Bg96gwp": "fwrc4pm",
21
+ "fsow6f": "f17mccla",
20
22
  "sj55zd": "fkfq4zb",
21
23
  "Bmqnesq": "f170vdtw",
22
24
  "pmf9yy": "fkmkm9e",
@@ -81,7 +83,7 @@ const useBaseStyles = /*#__PURE__*/__styles({
81
83
  "Bpbi4o9": ["f10n3jjp", "f4wmtn9"]
82
84
  }
83
85
  }, {
84
- "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f10pi13n{position:relative;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f170vdtw:before{box-sizing:border-box;}", ".fkmkm9e:before{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fbxxcv3:before{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1vdjgj:before{border-top-color:var(--colorNeutralStroke2);}", ".fz0g6r7:before{border-right-color:var(--colorNeutralStroke2);}", ".f1h60vep:before{border-left-color:var(--colorNeutralStroke2);}", ".fn9f2qq:before{border-bottom-color:var(--colorNeutralStroke2);}", ".ffdc0f3:after{box-sizing:border-box;}", ".fsnc50s:after{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fjrry2l:after{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fii7hsz:after{border-top-color:var(--colorNeutralStroke2);}", ".fp9yzmz:after{border-right-color:var(--colorNeutralStroke2);}", ".f1n0fcl2:after{border-left-color:var(--colorNeutralStroke2);}", ".f13jg1wd:after{border-bottom-color:var(--colorNeutralStroke2);}", ".fc3uzr1:before{margin-bottom:0;}", ".fhlqc5k:before{margin-right:0;}", ".flnsm0g:before{margin-left:0;}", ".f1957mjw:after{margin-left:0;}", ".fxrad5j:after{margin-right:0;}", ".f1hmx8el:after{margin-top:0;}", ".fqc6z8f:after{content:\"\";}", ".fuzzvh5:before{content:\"\";}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".fob59v2:before{border-top-color:var(--colorBrandStroke1);}", ".f2pevzt:before{border-right-color:var(--colorBrandStroke1);}", ".fuyeql9:before{border-left-color:var(--colorBrandStroke1);}", ".f14lh9hz:before{border-bottom-color:var(--colorBrandStroke1);}", ".fd73d1p:after{border-top-color:var(--colorBrandStroke1);}", ".f11ucet6:after{border-right-color:var(--colorBrandStroke1);}", ".f1yegzx5:after{border-left-color:var(--colorBrandStroke1);}", ".f1tupb0d:after{border-bottom-color:var(--colorBrandStroke1);}", ".f8mhi1x:before{border-top-color:var(--colorNeutralStroke3);}", ".f18m2ouc:before{border-right-color:var(--colorNeutralStroke3);}", ".fddukvx:before{border-left-color:var(--colorNeutralStroke3);}", ".f9zmk3m:before{border-bottom-color:var(--colorNeutralStroke3);}", ".fxli1ey:after{border-top-color:var(--colorNeutralStroke3);}", ".f1qvt1bb:after{border-right-color:var(--colorNeutralStroke3);}", ".f5ob950:after{border-left-color:var(--colorNeutralStroke3);}", ".f1nn0kgk:after{border-bottom-color:var(--colorNeutralStroke3);}", ".fkxqtrn:before{border-top-color:var(--colorNeutralStroke1);}", ".f1yx8xct:before{border-right-color:var(--colorNeutralStroke1);}", ".f2jll41:before{border-left-color:var(--colorNeutralStroke1);}", ".f1k9rjtw:before{border-bottom-color:var(--colorNeutralStroke1);}", ".f1i58boq:after{border-top-color:var(--colorNeutralStroke1);}", ".f4wmtn9:after{border-right-color:var(--colorNeutralStroke1);}", ".f10n3jjp:after{border-left-color:var(--colorNeutralStroke1);}", ".ft17it6:after{border-bottom-color:var(--colorNeutralStroke1);}"]
86
+ "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f10pi13n{position:relative;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f17mccla{text-align:center;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f170vdtw:before{box-sizing:border-box;}", ".fkmkm9e:before{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fbxxcv3:before{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1vdjgj:before{border-top-color:var(--colorNeutralStroke2);}", ".fz0g6r7:before{border-right-color:var(--colorNeutralStroke2);}", ".f1h60vep:before{border-left-color:var(--colorNeutralStroke2);}", ".fn9f2qq:before{border-bottom-color:var(--colorNeutralStroke2);}", ".ffdc0f3:after{box-sizing:border-box;}", ".fsnc50s:after{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fjrry2l:after{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fii7hsz:after{border-top-color:var(--colorNeutralStroke2);}", ".fp9yzmz:after{border-right-color:var(--colorNeutralStroke2);}", ".f1n0fcl2:after{border-left-color:var(--colorNeutralStroke2);}", ".f13jg1wd:after{border-bottom-color:var(--colorNeutralStroke2);}", ".fc3uzr1:before{margin-bottom:0;}", ".fhlqc5k:before{margin-right:0;}", ".flnsm0g:before{margin-left:0;}", ".f1957mjw:after{margin-left:0;}", ".fxrad5j:after{margin-right:0;}", ".f1hmx8el:after{margin-top:0;}", ".fqc6z8f:after{content:\"\";}", ".fuzzvh5:before{content:\"\";}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".fob59v2:before{border-top-color:var(--colorBrandStroke1);}", ".f2pevzt:before{border-right-color:var(--colorBrandStroke1);}", ".fuyeql9:before{border-left-color:var(--colorBrandStroke1);}", ".f14lh9hz:before{border-bottom-color:var(--colorBrandStroke1);}", ".fd73d1p:after{border-top-color:var(--colorBrandStroke1);}", ".f11ucet6:after{border-right-color:var(--colorBrandStroke1);}", ".f1yegzx5:after{border-left-color:var(--colorBrandStroke1);}", ".f1tupb0d:after{border-bottom-color:var(--colorBrandStroke1);}", ".f8mhi1x:before{border-top-color:var(--colorNeutralStroke3);}", ".f18m2ouc:before{border-right-color:var(--colorNeutralStroke3);}", ".fddukvx:before{border-left-color:var(--colorNeutralStroke3);}", ".f9zmk3m:before{border-bottom-color:var(--colorNeutralStroke3);}", ".fxli1ey:after{border-top-color:var(--colorNeutralStroke3);}", ".f1qvt1bb:after{border-right-color:var(--colorNeutralStroke3);}", ".f5ob950:after{border-left-color:var(--colorNeutralStroke3);}", ".f1nn0kgk:after{border-bottom-color:var(--colorNeutralStroke3);}", ".fkxqtrn:before{border-top-color:var(--colorNeutralStroke1);}", ".f1yx8xct:before{border-right-color:var(--colorNeutralStroke1);}", ".f2jll41:before{border-left-color:var(--colorNeutralStroke1);}", ".f1k9rjtw:before{border-bottom-color:var(--colorNeutralStroke1);}", ".f1i58boq:after{border-top-color:var(--colorNeutralStroke1);}", ".f4wmtn9:after{border-right-color:var(--colorNeutralStroke1);}", ".f10n3jjp:after{border-left-color:var(--colorNeutralStroke1);}", ".ft17it6:after{border-bottom-color:var(--colorNeutralStroke1);}"]
85
87
  });
86
88
 
87
89
  const useHorizontalStyles = /*#__PURE__*/__styles({
@@ -89,8 +91,10 @@ const useHorizontalStyles = /*#__PURE__*/__styles({
89
91
  "a9b677": "fly5x3f",
90
92
  "Bdixowu": "f1bwkb58",
91
93
  "dj0dih": "fn88edj",
94
+ "Bxms0xd": "f1lo4gz5",
92
95
  "rskduk": "f1iq3fds",
93
- "Bouo9z4": "f1oiuz89"
96
+ "Bouo9z4": "f1oiuz89",
97
+ "Bcqngy1": "f108ofon"
94
98
  },
95
99
  "inset": {
96
100
  "uwmqm3": ["fjlbh76", "f11qrl6u"],
@@ -113,7 +117,7 @@ const useHorizontalStyles = /*#__PURE__*/__styles({
113
117
  "B79fe3b": "f3tzpys"
114
118
  }
115
119
  }, {
116
- "d": [".fly5x3f{width:100%;}", ".f1bwkb58:before{border-top-style:solid;}", ".fn88edj:before{border-top-width:var(--strokeWidthThin);}", ".f1iq3fds:after{border-top-style:solid;}", ".f1oiuz89:after{border-top-width:var(--strokeWidthThin);}", ".fjlbh76{padding-left:12px;}", ".f11qrl6u{padding-right:12px;}", ".fuzzvh5:before{content:\"\";}", ".fncq426:before{margin-right:12px;}", ".f12b5w6c:before{margin-left:12px;}", ".f19fn84r:before{max-width:8px;}", ".f1io6r2y:after{margin-left:12px;}", ".fn6j208:after{margin-right:12px;}", ".fqc6z8f:after{content:\"\";}", ".f3tzpys:after{max-width:8px;}"]
120
+ "d": [".fly5x3f{width:100%;}", ".f1bwkb58:before{border-top-style:solid;}", ".fn88edj:before{border-top-width:var(--strokeWidthThin);}", ".f1lo4gz5:before{min-width:8px;}", ".f1iq3fds:after{border-top-style:solid;}", ".f1oiuz89:after{border-top-width:var(--strokeWidthThin);}", ".f108ofon:after{min-width:8px;}", ".fjlbh76{padding-left:12px;}", ".f11qrl6u{padding-right:12px;}", ".fuzzvh5:before{content:\"\";}", ".fncq426:before{margin-right:12px;}", ".f12b5w6c:before{margin-left:12px;}", ".f19fn84r:before{max-width:8px;}", ".f1io6r2y:after{margin-left:12px;}", ".fn6j208:after{margin-right:12px;}", ".fqc6z8f:after{content:\"\";}", ".f3tzpys:after{max-width:8px;}"]
117
121
  });
118
122
 
119
123
  const useVerticalStyles = /*#__PURE__*/__styles({
@@ -122,8 +126,10 @@ const useVerticalStyles = /*#__PURE__*/__styles({
122
126
  "sshi5w": "f16gbxbe",
123
127
  "cqycoz": ["fiio4mc", "fc8z0qo"],
124
128
  "D4ky5z": ["f54lnp5", "f5hao24"],
129
+ "Bxq2otu": "f11zhyjz",
125
130
  "Dctjco": ["f1r2jemi", "f11olovk"],
126
- "Bjz4wo8": ["f1o2ol1z", "f20720x"]
131
+ "Bjz4wo8": ["f1o2ol1z", "f20720x"],
132
+ "B5p8dqe": "f14bbtgr"
127
133
  },
128
134
  "inset": {
129
135
  "B6of3ja": "f1xdg43u",
@@ -149,10 +155,10 @@ const useVerticalStyles = /*#__PURE__*/__styles({
149
155
  "iiodbw": "fp342oa"
150
156
  }
151
157
  }, {
152
- "d": [".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f54lnp5:before{border-right-width:var(--strokeWidthThin);}", ".f5hao24:before{border-left-width:var(--strokeWidthThin);}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".f1o2ol1z:after{border-right-width:var(--strokeWidthThin);}", ".f20720x:after{border-left-width:var(--strokeWidthThin);}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".fuzzvh5:before{content:\"\";}", ".f1xy8239:before{margin-bottom:12px;}", ".f1hheky8:before{max-height:8px;}", ".f1mz1b17:after{margin-top:12px;}", ".fqc6z8f:after{content:\"\";}", ".fp342oa:after{max-height:8px;}"]
158
+ "d": [".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f54lnp5:before{border-right-width:var(--strokeWidthThin);}", ".f5hao24:before{border-left-width:var(--strokeWidthThin);}", ".f11zhyjz:before{min-height:8px;}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".f1o2ol1z:after{border-right-width:var(--strokeWidthThin);}", ".f20720x:after{border-left-width:var(--strokeWidthThin);}", ".f14bbtgr:after{min-height:8px;}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".fuzzvh5:before{content:\"\";}", ".f1xy8239:before{margin-bottom:12px;}", ".f1hheky8:before{max-height:8px;}", ".f1mz1b17:after{margin-top:12px;}", ".fqc6z8f:after{content:\"\";}", ".fp342oa:after{max-height:8px;}"]
153
159
  });
154
160
 
155
- export const useDividerStyles = state => {
161
+ export const useDividerStyles_unstable = state => {
156
162
  const baseStyles = useBaseStyles();
157
163
  const horizontalStyles = useHorizontalStyles();
158
164
  const verticalStyles = useVerticalStyles();
package/lib/components/Divider/useDividerStyles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/useDividerStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,EAAuB,UAAvB,kBAAqD,6BAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAGA,OAAO,MAAM,gBAAgB,GAAG,aAAzB;AAEP,MAAM,cAAc,GAAG,MAAvB;AACA,MAAM,YAAY,GAAG,MAArB;AACA,MAAM,iBAAiB,GAAG,KAA1B;;AAEA,MAAM,aAAa,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAtB;;AAmGA,MAAM,mBAAmB,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA5B;;AAsDA,MAAM,iBAAiB,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AA4DA,OAAO,MAAM,gBAAgB,GAAI,KAAD,IAAsC;AACpE,QAAM,UAAU,GAAG,aAAa,EAAhC;AACA,QAAM,gBAAgB,GAAG,mBAAmB,EAA5C;AACA,QAAM,cAAc,GAAG,iBAAiB,EAAxC;AAEA,QAAM;AAAE,IAAA,YAAF;AAAgB,IAAA,UAAhB;AAA4B,IAAA,KAA5B;AAAmC,IAAA;AAAnC,MAAgD,KAAtD;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,gBADiC,EAGjC;AACA,EAAA,UAAU,CAAC,IAJsB,EAKjC,UAAU,CAAC,YAAD,CALuB,EAMjC,UAAU,IAAI,UAAU,CAAC,UAAD,CANS,EAQjC;AACA,GAAC,QAAD,IAAa,gBAAgB,CAAC,IATG,EAUjC,CAAC,QAAD,IAAa,KAAb,IAAsB,gBAAgB,CAAC,KAVN,EAWjC,CAAC,QAAD,IAAa,gBAAgB,CAAC,YAAD,CAXI,EAajC;AACA,EAAA,QAAQ,IAAI,cAAc,CAAC,IAdM,EAejC,QAAQ,IAAI,KAAZ,IAAqB,cAAc,CAAC,KAfH,EAgBjC,QAAQ,IAAI,cAAc,CAAC,YAAD,CAhBO,EAiBjC,QAAQ,IAAI,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAApC,IAAiD,cAAc,CAAC,YAjB/B,EAmBjC;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAAxB,IAAqC,UAAU,CAAC,SApBf,EAsBjC;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAvBsB,CAAnC;AA0BA,SAAO,KAAP;AACD,CAlCM","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/useDividerStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,EAAuB,UAAvB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAGA,OAAO,MAAM,gBAAgB,GAAG,aAAzB;AAEP,MAAM,cAAc,GAAG,MAAvB;AACA,MAAM,YAAY,GAAG,MAArB;AACA,MAAM,iBAAiB,GAAG,KAA1B;AACA,MAAM,iBAAiB,GAAG,MAA1B;;AAEA,MAAM,aAAa,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAtB;;AAkGA,MAAM,mBAAmB,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA5B;;AAwDA,MAAM,iBAAiB,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AA8DA,OAAO,MAAM,yBAAyB,GAAI,KAAD,IAAsC;AAC7E,QAAM,UAAU,GAAG,aAAa,EAAhC;AACA,QAAM,gBAAgB,GAAG,mBAAmB,EAA5C;AACA,QAAM,cAAc,GAAG,iBAAiB,EAAxC;AAEA,QAAM;AAAE,IAAA,YAAF;AAAgB,IAAA,UAAhB;AAA4B,IAAA,KAA5B;AAAmC,IAAA;AAAnC,MAAgD,KAAtD;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,gBADiC,EAGjC;AACA,EAAA,UAAU,CAAC,IAJsB,EAKjC,UAAU,CAAC,YAAD,CALuB,EAMjC,UAAU,IAAI,UAAU,CAAC,UAAD,CANS,EAQjC;AACA,GAAC,QAAD,IAAa,gBAAgB,CAAC,IATG,EAUjC,CAAC,QAAD,IAAa,KAAb,IAAsB,gBAAgB,CAAC,KAVN,EAWjC,CAAC,QAAD,IAAa,gBAAgB,CAAC,YAAD,CAXI,EAajC;AACA,EAAA,QAAQ,IAAI,cAAc,CAAC,IAdM,EAejC,QAAQ,IAAI,KAAZ,IAAqB,cAAc,CAAC,KAfH,EAgBjC,QAAQ,IAAI,cAAc,CAAC,YAAD,CAhBO,EAiBjC,QAAQ,IAAI,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAApC,IAAiD,cAAc,CAAC,YAjB/B,EAmBjC;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAAxB,IAAqC,UAAU,CAAC,SApBf,EAsBjC;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAvBsB,CAAnC;AA0BA,SAAO,KAAP;AACD,CAlCM","sourcesContent":["import { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerState } from './Divider.types';\n\nexport const dividerClassName = 'fui-Divider';\n\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\n\nconst useBaseStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n flexGrow: 1,\n position: 'relative',\n\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n\n color: tokens.colorNeutralForeground2,\n\n ':before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n ':after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n\n // Childless styles\n childless: {\n ':before': {\n marginBottom: 0,\n marginRight: 0,\n },\n\n ':after': {\n marginLeft: 0,\n marginTop: 0,\n },\n },\n\n // Alignment variations\n start: {\n ':after': {\n content: '\"\"',\n },\n },\n center: {\n ':before': {\n content: '\"\"',\n },\n ':after': {\n content: '\"\"',\n },\n },\n end: {\n ':before': {\n content: '\"\"',\n },\n },\n\n // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n\n ':before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n\n ':after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n },\n subtle: {\n ':before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n ':after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n ':before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n ':after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n});\n\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n\n ':before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n\n ':after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing,\n },\n\n // Alignment variations\n start: {\n ':before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n ':after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n ':before': {\n marginRight: contentSpacing,\n },\n ':after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n ':before': {\n marginRight: contentSpacing,\n },\n ':after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n },\n});\n\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n\n ':before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n\n ':after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing,\n },\n\n // With children styles\n withChildren: {\n minHeight: '84px',\n },\n\n // Alignment variations\n start: {\n ':before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n\n ':after': {\n marginTop: contentSpacing,\n },\n },\n center: {\n ':before': {\n marginBottom: contentSpacing,\n },\n ':after': {\n marginTop: contentSpacing,\n },\n },\n end: {\n ':before': {\n marginBottom: contentSpacing,\n },\n ':after': {\n content: '\"\"',\n marginTop: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n },\n});\n\nexport const useDividerStyles_unstable = (state: DividerState): DividerState => {\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n\n const { alignContent, appearance, inset, vertical } = state;\n\n state.root.className = mergeClasses(\n dividerClassName,\n\n // Base styles\n baseStyles.base,\n baseStyles[alignContent],\n appearance && baseStyles[appearance],\n\n // Horizontal styles\n !vertical && horizontalStyles.base,\n !vertical && inset && horizontalStyles.inset,\n !vertical && horizontalStyles[alignContent],\n\n // Vertical styles\n vertical && verticalStyles.base,\n vertical && inset && verticalStyles.inset,\n vertical && verticalStyles[alignContent],\n vertical && state.root.children !== undefined && verticalStyles.withChildren,\n\n // Childless styles\n state.root.children === undefined && baseStyles.childless,\n\n // User provided class name\n state.root.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC","sourcesContent":["export * from './Divider';\n"]}
package/lib-commonjs/Divider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Divider.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["Divider.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Divider/index';\n"],"sourceRoot":"../src/"}
package/lib-commonjs/components/Divider/Divider.js CHANGED
@@ -18,9 +18,9 @@ const useDividerStyles_1 = /*#__PURE__*/require("./useDividerStyles");
18
18
 
19
19
 
20
20
  exports.Divider = /*#__PURE__*/React.forwardRef((props, ref) => {
21
- const state = useDivider_1.useDivider(props, ref);
22
- useDividerStyles_1.useDividerStyles(state);
23
- return renderDivider_1.renderDivider(state);
21
+ const state = useDivider_1.useDivider_unstable(props, ref);
22
+ useDividerStyles_1.useDividerStyles_unstable(state);
23
+ return renderDivider_1.renderDivider_unstable(state);
24
24
  });
25
25
  exports.Divider.displayName = 'Divider';
26
26
  //# sourceMappingURL=Divider.js.map
package/lib-commonjs/components/Divider/Divider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/Divider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,OAAA,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACxF,QAAM,KAAK,GAAG,YAAA,CAAA,UAAA,CAAW,KAAX,EAAkB,GAAlB,CAAd;AAEA,EAAA,kBAAA,CAAA,gBAAA,CAAiB,KAAjB;AAEA,SAAO,eAAA,CAAA,aAAA,CAAc,KAAd,CAAP;AACD,CANyD,CAA7C;AAQb,OAAA,CAAA,OAAA,CAAQ,WAAR,GAAsB,SAAtB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/Divider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,OAAA,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACxF,QAAM,KAAK,GAAG,YAAA,CAAA,mBAAA,CAAoB,KAApB,EAA2B,GAA3B,CAAd;AAEA,EAAA,kBAAA,CAAA,yBAAA,CAA0B,KAA1B;AAEA,SAAO,eAAA,CAAA,sBAAA,CAAuB,KAAvB,CAAP;AACD,CANyD,CAA7C;AAQb,OAAA,CAAA,OAAA,CAAQ,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\n\n/**\n * A divider visually segments content into groups.\n */\nexport const Divider: ForwardRefComponent<DividerProps> = React.forwardRef((props, ref) => {\n const state = useDivider_unstable(props, ref);\n\n useDividerStyles_unstable(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"sourceRoot":"../src/"}
package/lib-commonjs/components/Divider/Divider.types.d.ts CHANGED
@@ -1,15 +1,15 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
1
+ import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
2
2
  export declare type DividerSlots = {
3
3
  /**
4
4
  * Root of the component that renders as a `<div>` tag.
5
5
  */
6
- root: IntrinsicShorthandProps<'div'>;
6
+ root: Slot<'div'>;
7
7
  /**
8
8
  * Accessibility wrapper for content when presented.
9
9
  */
10
- wrapper: IntrinsicShorthandProps<'div'>;
10
+ wrapper: Slot<'div'>;
11
11
  };
12
- export declare type DividerCommons = {
12
+ declare type DividerCommons = {
13
13
  /**
14
14
  * Determines the alignment of the content within the divider.
15
15
  * @defaultvalue 'center'
@@ -31,5 +31,6 @@ export declare type DividerCommons = {
31
31
  */
32
32
  vertical: boolean;
33
33
  };
34
- export declare type DividerProps = ComponentProps<DividerSlots> & Partial<DividerCommons>;
34
+ export declare type DividerProps = ComponentProps<Partial<DividerSlots>> & Partial<DividerCommons>;
35
35
  export declare type DividerState = ComponentState<DividerSlots> & DividerCommons;
36
+ export {};
package/lib-commonjs/components/Divider/Divider.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
package/lib-commonjs/components/Divider/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Divider';\nexport * from './Divider.types';\nexport * from './renderDivider';\nexport * from './useDivider';\nexport * from './useDividerStyles';\n"],"sourceRoot":"../src/"}
package/lib-commonjs/components/Divider/renderDivider.d.ts CHANGED
@@ -2,4 +2,4 @@ import { DividerState } from './Divider.types';
2
2
  /**
3
3
  * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
4
4
  */
5
- export declare const renderDivider: (state: DividerState) => JSX.Element;
5
+ export declare const renderDivider_unstable: (state: DividerState) => JSX.Element;
package/lib-commonjs/components/Divider/renderDivider.js CHANGED
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.renderDivider = void 0;
6
+ exports.renderDivider_unstable = void 0;
7
7
 
8
8
  const React = /*#__PURE__*/require("react");
9
9
 
@@ -13,15 +13,15 @@ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
13
13
  */
14
14
 
15
15
 
16
- const renderDivider = state => {
16
+ const renderDivider_unstable = state => {
17
17
  const {
18
18
  slots,
19
19
  slotProps
20
- } = react_utilities_1.getSlots(state, ['root', 'wrapper']);
20
+ } = react_utilities_1.getSlots(state);
21
21
  return React.createElement(slots.root, { ...slotProps.root
22
22
  }, slotProps.root.children !== undefined && React.createElement(slots.wrapper, { ...slotProps.wrapper
23
23
  }, slotProps.root.children));
24
24
  };
25
25
 
26
- exports.renderDivider = renderDivider;
26
+ exports.renderDivider_unstable = renderDivider_unstable;
27
27
  //# sourceMappingURL=renderDivider.js.map
package/lib-commonjs/components/Divider/renderDivider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/renderDivider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,aAAa,GAAI,KAAD,IAAwB;AACnD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,EAA8B,CAAC,MAAD,EAAS,SAAT,CAA9B,CAA7B;AACA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,SAAS,CAAC,IAAV,CAAe,QAAf,KAA4B,SAA5B,IACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;AAAf,GAAd,EAAuC,SAAS,CAAC,IAAV,CAAe,QAAtD,CAFJ,CADF;AAOD,CATM;;AAAM,OAAA,CAAA,aAAA,GAAa,aAAb","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/renderDivider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,sBAAsB,GAAI,KAAD,IAAwB;AAC5D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,CAA7B;AACA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,SAAS,CAAC,IAAV,CAAe,QAAf,KAA4B,SAA5B,IACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;AAAf,GAAd,EAAuC,SAAS,CAAC,IAAV,CAAe,QAAtD,CAFJ,CADF;AAOD,CATM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from './Divider.types';\n\n/**\n * Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.\n */\nexport const renderDivider_unstable = (state: DividerState) => {\n const { slots, slotProps } = getSlots<DividerSlots>(state);\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children !== undefined && (\n <slots.wrapper {...slotProps.wrapper}>{slotProps.root.children}</slots.wrapper>\n )}\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
package/lib-commonjs/components/Divider/useDivider.d.ts CHANGED
@@ -5,4 +5,4 @@ import type { DividerProps, DividerState } from './Divider.types';
5
5
  * @param props - User-provided props to the Divider component.
6
6
  * @param ref - User-provided ref to be passed to the Divider component.
7
7
  */
8
- export declare const useDivider: (props: DividerProps, ref: React.Ref<HTMLElement>) => DividerState;
8
+ export declare const useDivider_unstable: (props: DividerProps, ref: React.Ref<HTMLElement>) => DividerState;
package/lib-commonjs/components/Divider/useDivider.js CHANGED
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useDivider = void 0;
6
+ exports.useDivider_unstable = void 0;
7
7
 
8
8
  const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
9
  /**
@@ -13,7 +13,7 @@ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
13
13
  */
14
14
 
15
15
 
16
- const useDivider = (props, ref) => {
16
+ const useDivider_unstable = (props, ref) => {
17
17
  const {
18
18
  alignContent = 'center',
19
19
  appearance,
@@ -36,6 +36,7 @@ const useDivider = (props, ref) => {
36
36
  root: react_utilities_1.getNativeElementProps('div', { ...props,
37
37
  ref,
38
38
  role: 'separator',
39
+ 'aria-orientation': vertical ? 'vertical' : 'horizontal',
39
40
  'aria-labelledby': props.children ? dividerId : undefined
40
41
  }),
41
42
  wrapper: react_utilities_1.resolveShorthand(wrapper, {
@@ -48,5 +49,5 @@ const useDivider = (props, ref) => {
48
49
  };
49
50
  };
50
51
 
51
- exports.useDivider = useDivider;
52
+ exports.useDivider_unstable = useDivider_unstable;
52
53
  //# sourceMappingURL=useDivider.js.map
package/lib-commonjs/components/Divider/useDivider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/useDivider.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;;AAIG;;;AACI,MAAM,UAAU,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;AAC3F,QAAM;AAAE,IAAA,YAAY,GAAG,QAAjB;AAA2B,IAAA,UAA3B;AAAuC,IAAA,KAAK,GAAG,KAA/C;AAAsD,IAAA,QAAQ,GAAG,KAAjE;AAAwE,IAAA;AAAxE,MAAoF,KAA1F;AACA,QAAM,SAAS,GAAG,iBAAA,CAAA,KAAA,CAAM,UAAN,CAAlB;AAEA,SAAO;AACL;AACA,IAAA,YAFK;AAGL,IAAA,UAHK;AAIL,IAAA,KAJK;AAKL,IAAA,QALK;AAOL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,OAAO,EAAE;AAFC,KARP;AAaL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,IAAI,EAAE,WAH2B;AAIjC,yBAAmB,KAAK,CAAC,QAAN,GAAiB,SAAjB,GAA6B;AAJf,KAA7B,CAbD;AAmBL,IAAA,OAAO,EAAE,iBAAA,CAAA,gBAAA,CAAiB,OAAjB,EAA0B;AACjC,MAAA,QAAQ,EAAE,IADuB;AAEjC,MAAA,YAAY,EAAE;AACZ,QAAA,EAAE,EAAE,SADQ;AAEZ,QAAA,QAAQ,EAAE,KAAK,CAAC;AAFJ;AAFmB,KAA1B;AAnBJ,GAAP;AA2BD,CA/BM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/useDivider.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;;AAIG;;;AACI,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;AACpG,QAAM;AAAE,IAAA,YAAY,GAAG,QAAjB;AAA2B,IAAA,UAA3B;AAAuC,IAAA,KAAK,GAAG,KAA/C;AAAsD,IAAA,QAAQ,GAAG,KAAjE;AAAwE,IAAA;AAAxE,MAAoF,KAA1F;AACA,QAAM,SAAS,GAAG,iBAAA,CAAA,KAAA,CAAM,UAAN,CAAlB;AAEA,SAAO;AACL;AACA,IAAA,YAFK;AAGL,IAAA,UAHK;AAIL,IAAA,KAJK;AAKL,IAAA,QALK;AAOL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,OAAO,EAAE;AAFC,KARP;AAaL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,IAAI,EAAE,WAH2B;AAIjC,0BAAoB,QAAQ,GAAG,UAAH,GAAgB,YAJX;AAKjC,yBAAmB,KAAK,CAAC,QAAN,GAAiB,SAAjB,GAA6B;AALf,KAA7B,CAbD;AAoBL,IAAA,OAAO,EAAE,iBAAA,CAAA,gBAAA,CAAiB,OAAjB,EAA0B;AACjC,MAAA,QAAQ,EAAE,IADuB;AAEjC,MAAA,YAAY,EAAE;AACZ,QAAA,EAAE,EAAE,SADQ;AAEZ,QAAA,QAAQ,EAAE,KAAK,CAAC;AAFJ;AAFmB,KAA1B;AApBJ,GAAP;AA4BD,CAhCM;;AAAM,OAAA,CAAA,mBAAA,GAAmB,mBAAnB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - User-provided props to the Divider component.\n * @param ref - User-provided ref to be passed to the Divider component.\n */\nexport const useDivider_unstable = (props: DividerProps, ref: React.Ref<HTMLElement>): DividerState => {\n const { alignContent = 'center', appearance, inset = false, vertical = false, wrapper } = props;\n const dividerId = useId('divider-');\n\n return {\n // Props passed at the top-level\n alignContent,\n appearance,\n inset,\n vertical,\n\n // Slots definition\n components: {\n root: 'div',\n wrapper: 'div',\n },\n\n root: getNativeElementProps('div', {\n ...props,\n ref,\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n }),\n wrapper: resolveShorthand(wrapper, {\n required: true,\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n }),\n };\n};\n"],"sourceRoot":"../src/"}
package/lib-commonjs/components/Divider/useDividerStyles.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { DividerState } from './Divider.types';
2
2
  export declare const dividerClassName = "fui-Divider";
3
- export declare const useDividerStyles: (state: DividerState) => DividerState;
3
+ export declare const useDividerStyles_unstable: (state: DividerState) => DividerState;
package/lib-commonjs/components/Divider/useDividerStyles.js CHANGED
@@ -3,18 +3,19 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useDividerStyles = exports.dividerClassName = void 0;
6
+ exports.useDividerStyles_unstable = exports.dividerClassName = void 0;
7
7
 
8
- const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
 
10
10
  const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
11
 
12
12
  exports.dividerClassName = 'fui-Divider';
13
13
  const contentSpacing = '12px';
14
14
  const insetSpacing = '12px';
15
- const startEndMaxHeight = '8px';
15
+ const maxStartEndLength = '8px';
16
+ const minStartEndLength = '8px;';
16
17
 
17
- const useBaseStyles = /*#__PURE__*/react_make_styles_1.__styles({
18
+ const useBaseStyles = /*#__PURE__*/react_1.__styles({
18
19
  "base": {
19
20
  "Bt984gj": "f122n59",
20
21
  "B7ck84d": "f1ewtqcl",
@@ -26,6 +27,7 @@ const useBaseStyles = /*#__PURE__*/react_make_styles_1.__styles({
26
27
  "Be2twd7": "fy9rknc",
27
28
  "Bhrd7zp": "figsok6",
28
29
  "Bg96gwp": "fwrc4pm",
30
+ "fsow6f": "f17mccla",
29
31
  "sj55zd": "fkfq4zb",
30
32
  "Bmqnesq": "f170vdtw",
31
33
  "pmf9yy": "fkmkm9e",
@@ -90,16 +92,18 @@ const useBaseStyles = /*#__PURE__*/react_make_styles_1.__styles({
90
92
  "Bpbi4o9": ["f10n3jjp", "f4wmtn9"]
91
93
  }
92
94
  }, {
93
- "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f10pi13n{position:relative;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f170vdtw:before{box-sizing:border-box;}", ".fkmkm9e:before{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fbxxcv3:before{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1vdjgj:before{border-top-color:var(--colorNeutralStroke2);}", ".fz0g6r7:before{border-right-color:var(--colorNeutralStroke2);}", ".f1h60vep:before{border-left-color:var(--colorNeutralStroke2);}", ".fn9f2qq:before{border-bottom-color:var(--colorNeutralStroke2);}", ".ffdc0f3:after{box-sizing:border-box;}", ".fsnc50s:after{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fjrry2l:after{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fii7hsz:after{border-top-color:var(--colorNeutralStroke2);}", ".fp9yzmz:after{border-right-color:var(--colorNeutralStroke2);}", ".f1n0fcl2:after{border-left-color:var(--colorNeutralStroke2);}", ".f13jg1wd:after{border-bottom-color:var(--colorNeutralStroke2);}", ".fc3uzr1:before{margin-bottom:0;}", ".fhlqc5k:before{margin-right:0;}", ".flnsm0g:before{margin-left:0;}", ".f1957mjw:after{margin-left:0;}", ".fxrad5j:after{margin-right:0;}", ".f1hmx8el:after{margin-top:0;}", ".fqc6z8f:after{content:\"\";}", ".fuzzvh5:before{content:\"\";}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".fob59v2:before{border-top-color:var(--colorBrandStroke1);}", ".f2pevzt:before{border-right-color:var(--colorBrandStroke1);}", ".fuyeql9:before{border-left-color:var(--colorBrandStroke1);}", ".f14lh9hz:before{border-bottom-color:var(--colorBrandStroke1);}", ".fd73d1p:after{border-top-color:var(--colorBrandStroke1);}", ".f11ucet6:after{border-right-color:var(--colorBrandStroke1);}", ".f1yegzx5:after{border-left-color:var(--colorBrandStroke1);}", ".f1tupb0d:after{border-bottom-color:var(--colorBrandStroke1);}", ".f8mhi1x:before{border-top-color:var(--colorNeutralStroke3);}", ".f18m2ouc:before{border-right-color:var(--colorNeutralStroke3);}", ".fddukvx:before{border-left-color:var(--colorNeutralStroke3);}", ".f9zmk3m:before{border-bottom-color:var(--colorNeutralStroke3);}", ".fxli1ey:after{border-top-color:var(--colorNeutralStroke3);}", ".f1qvt1bb:after{border-right-color:var(--colorNeutralStroke3);}", ".f5ob950:after{border-left-color:var(--colorNeutralStroke3);}", ".f1nn0kgk:after{border-bottom-color:var(--colorNeutralStroke3);}", ".fkxqtrn:before{border-top-color:var(--colorNeutralStroke1);}", ".f1yx8xct:before{border-right-color:var(--colorNeutralStroke1);}", ".f2jll41:before{border-left-color:var(--colorNeutralStroke1);}", ".f1k9rjtw:before{border-bottom-color:var(--colorNeutralStroke1);}", ".f1i58boq:after{border-top-color:var(--colorNeutralStroke1);}", ".f4wmtn9:after{border-right-color:var(--colorNeutralStroke1);}", ".f10n3jjp:after{border-left-color:var(--colorNeutralStroke1);}", ".ft17it6:after{border-bottom-color:var(--colorNeutralStroke1);}"]
95
+ "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1ewtqcl{box-sizing:border-box;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f10pi13n{position:relative;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f17mccla{text-align:center;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".f170vdtw:before{box-sizing:border-box;}", ".fkmkm9e:before{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fbxxcv3:before{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1vdjgj:before{border-top-color:var(--colorNeutralStroke2);}", ".fz0g6r7:before{border-right-color:var(--colorNeutralStroke2);}", ".f1h60vep:before{border-left-color:var(--colorNeutralStroke2);}", ".fn9f2qq:before{border-bottom-color:var(--colorNeutralStroke2);}", ".ffdc0f3:after{box-sizing:border-box;}", ".fsnc50s:after{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fjrry2l:after{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fii7hsz:after{border-top-color:var(--colorNeutralStroke2);}", ".fp9yzmz:after{border-right-color:var(--colorNeutralStroke2);}", ".f1n0fcl2:after{border-left-color:var(--colorNeutralStroke2);}", ".f13jg1wd:after{border-bottom-color:var(--colorNeutralStroke2);}", ".fc3uzr1:before{margin-bottom:0;}", ".fhlqc5k:before{margin-right:0;}", ".flnsm0g:before{margin-left:0;}", ".f1957mjw:after{margin-left:0;}", ".fxrad5j:after{margin-right:0;}", ".f1hmx8el:after{margin-top:0;}", ".fqc6z8f:after{content:\"\";}", ".fuzzvh5:before{content:\"\";}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".fob59v2:before{border-top-color:var(--colorBrandStroke1);}", ".f2pevzt:before{border-right-color:var(--colorBrandStroke1);}", ".fuyeql9:before{border-left-color:var(--colorBrandStroke1);}", ".f14lh9hz:before{border-bottom-color:var(--colorBrandStroke1);}", ".fd73d1p:after{border-top-color:var(--colorBrandStroke1);}", ".f11ucet6:after{border-right-color:var(--colorBrandStroke1);}", ".f1yegzx5:after{border-left-color:var(--colorBrandStroke1);}", ".f1tupb0d:after{border-bottom-color:var(--colorBrandStroke1);}", ".f8mhi1x:before{border-top-color:var(--colorNeutralStroke3);}", ".f18m2ouc:before{border-right-color:var(--colorNeutralStroke3);}", ".fddukvx:before{border-left-color:var(--colorNeutralStroke3);}", ".f9zmk3m:before{border-bottom-color:var(--colorNeutralStroke3);}", ".fxli1ey:after{border-top-color:var(--colorNeutralStroke3);}", ".f1qvt1bb:after{border-right-color:var(--colorNeutralStroke3);}", ".f5ob950:after{border-left-color:var(--colorNeutralStroke3);}", ".f1nn0kgk:after{border-bottom-color:var(--colorNeutralStroke3);}", ".fkxqtrn:before{border-top-color:var(--colorNeutralStroke1);}", ".f1yx8xct:before{border-right-color:var(--colorNeutralStroke1);}", ".f2jll41:before{border-left-color:var(--colorNeutralStroke1);}", ".f1k9rjtw:before{border-bottom-color:var(--colorNeutralStroke1);}", ".f1i58boq:after{border-top-color:var(--colorNeutralStroke1);}", ".f4wmtn9:after{border-right-color:var(--colorNeutralStroke1);}", ".f10n3jjp:after{border-left-color:var(--colorNeutralStroke1);}", ".ft17it6:after{border-bottom-color:var(--colorNeutralStroke1);}"]
94
96
  });
95
97
 
96
- const useHorizontalStyles = /*#__PURE__*/react_make_styles_1.__styles({
98
+ const useHorizontalStyles = /*#__PURE__*/react_1.__styles({
97
99
  "base": {
98
100
  "a9b677": "fly5x3f",
99
101
  "Bdixowu": "f1bwkb58",
100
102
  "dj0dih": "fn88edj",
103
+ "Bxms0xd": "f1lo4gz5",
101
104
  "rskduk": "f1iq3fds",
102
- "Bouo9z4": "f1oiuz89"
105
+ "Bouo9z4": "f1oiuz89",
106
+ "Bcqngy1": "f108ofon"
103
107
  },
104
108
  "inset": {
105
109
  "uwmqm3": ["fjlbh76", "f11qrl6u"],
@@ -122,17 +126,19 @@ const useHorizontalStyles = /*#__PURE__*/react_make_styles_1.__styles({
122
126
  "B79fe3b": "f3tzpys"
123
127
  }
124
128
  }, {
125
- "d": [".fly5x3f{width:100%;}", ".f1bwkb58:before{border-top-style:solid;}", ".fn88edj:before{border-top-width:var(--strokeWidthThin);}", ".f1iq3fds:after{border-top-style:solid;}", ".f1oiuz89:after{border-top-width:var(--strokeWidthThin);}", ".fjlbh76{padding-left:12px;}", ".f11qrl6u{padding-right:12px;}", ".fuzzvh5:before{content:\"\";}", ".fncq426:before{margin-right:12px;}", ".f12b5w6c:before{margin-left:12px;}", ".f19fn84r:before{max-width:8px;}", ".f1io6r2y:after{margin-left:12px;}", ".fn6j208:after{margin-right:12px;}", ".fqc6z8f:after{content:\"\";}", ".f3tzpys:after{max-width:8px;}"]
129
+ "d": [".fly5x3f{width:100%;}", ".f1bwkb58:before{border-top-style:solid;}", ".fn88edj:before{border-top-width:var(--strokeWidthThin);}", ".f1lo4gz5:before{min-width:8px;}", ".f1iq3fds:after{border-top-style:solid;}", ".f1oiuz89:after{border-top-width:var(--strokeWidthThin);}", ".f108ofon:after{min-width:8px;}", ".fjlbh76{padding-left:12px;}", ".f11qrl6u{padding-right:12px;}", ".fuzzvh5:before{content:\"\";}", ".fncq426:before{margin-right:12px;}", ".f12b5w6c:before{margin-left:12px;}", ".f19fn84r:before{max-width:8px;}", ".f1io6r2y:after{margin-left:12px;}", ".fn6j208:after{margin-right:12px;}", ".fqc6z8f:after{content:\"\";}", ".f3tzpys:after{max-width:8px;}"]
126
130
  });
127
131
 
128
- const useVerticalStyles = /*#__PURE__*/react_make_styles_1.__styles({
132
+ const useVerticalStyles = /*#__PURE__*/react_1.__styles({
129
133
  "base": {
130
134
  "Beiy3e4": "f1vx9l62",
131
135
  "sshi5w": "f16gbxbe",
132
136
  "cqycoz": ["fiio4mc", "fc8z0qo"],
133
137
  "D4ky5z": ["f54lnp5", "f5hao24"],
138
+ "Bxq2otu": "f11zhyjz",
134
139
  "Dctjco": ["f1r2jemi", "f11olovk"],
135
- "Bjz4wo8": ["f1o2ol1z", "f20720x"]
140
+ "Bjz4wo8": ["f1o2ol1z", "f20720x"],
141
+ "B5p8dqe": "f14bbtgr"
136
142
  },
137
143
  "inset": {
138
144
  "B6of3ja": "f1xdg43u",
@@ -158,10 +164,10 @@ const useVerticalStyles = /*#__PURE__*/react_make_styles_1.__styles({
158
164
  "iiodbw": "fp342oa"
159
165
  }
160
166
  }, {
161
- "d": [".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f54lnp5:before{border-right-width:var(--strokeWidthThin);}", ".f5hao24:before{border-left-width:var(--strokeWidthThin);}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".f1o2ol1z:after{border-right-width:var(--strokeWidthThin);}", ".f20720x:after{border-left-width:var(--strokeWidthThin);}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".fuzzvh5:before{content:\"\";}", ".f1xy8239:before{margin-bottom:12px;}", ".f1hheky8:before{max-height:8px;}", ".f1mz1b17:after{margin-top:12px;}", ".fqc6z8f:after{content:\"\";}", ".fp342oa:after{max-height:8px;}"]
167
+ "d": [".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".fiio4mc:before{border-right-style:solid;}", ".fc8z0qo:before{border-left-style:solid;}", ".f54lnp5:before{border-right-width:var(--strokeWidthThin);}", ".f5hao24:before{border-left-width:var(--strokeWidthThin);}", ".f11zhyjz:before{min-height:8px;}", ".f1r2jemi:after{border-right-style:solid;}", ".f11olovk:after{border-left-style:solid;}", ".f1o2ol1z:after{border-right-width:var(--strokeWidthThin);}", ".f20720x:after{border-left-width:var(--strokeWidthThin);}", ".f14bbtgr:after{min-height:8px;}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".fuzzvh5:before{content:\"\";}", ".f1xy8239:before{margin-bottom:12px;}", ".f1hheky8:before{max-height:8px;}", ".f1mz1b17:after{margin-top:12px;}", ".fqc6z8f:after{content:\"\";}", ".fp342oa:after{max-height:8px;}"]
162
168
  });
163
169
 
164
- const useDividerStyles = state => {
170
+ const useDividerStyles_unstable = state => {
165
171
  const baseStyles = useBaseStyles();
166
172
  const horizontalStyles = useHorizontalStyles();
167
173
  const verticalStyles = useVerticalStyles();
@@ -171,7 +177,7 @@ const useDividerStyles = state => {
171
177
  inset,
172
178
  vertical
173
179
  } = state;
174
- state.root.className = react_make_styles_1.mergeClasses(exports.dividerClassName, // Base styles
180
+ state.root.className = react_1.mergeClasses(exports.dividerClassName, // Base styles
175
181
  baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles
176
182
  !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles
177
183
  vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles
@@ -180,5 +186,5 @@ const useDividerStyles = state => {
180
186
  return state;
181
187
  };
182
188
 
183
- exports.useDividerStyles = useDividerStyles;
189
+ exports.useDividerStyles_unstable = useDividerStyles_unstable;
184
190
  //# sourceMappingURL=useDividerStyles.js.map
package/lib-commonjs/components/Divider/useDividerStyles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Divider/useDividerStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,gBAAA,GAAmB,aAAnB;AAEb,MAAM,cAAc,GAAG,MAAvB;AACA,MAAM,YAAY,GAAG,MAArB;AACA,MAAM,iBAAiB,GAAG,KAA1B;;AAEA,MAAM,aAAa,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAtB;;AAmGA,MAAM,mBAAmB,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA5B;;AAsDA,MAAM,iBAAiB,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AA4DO,MAAM,gBAAgB,GAAI,KAAD,IAAsC;AACpE,QAAM,UAAU,GAAG,aAAa,EAAhC;AACA,QAAM,gBAAgB,GAAG,mBAAmB,EAA5C;AACA,QAAM,cAAc,GAAG,iBAAiB,EAAxC;AAEA,QAAM;AAAE,IAAA,YAAF;AAAgB,IAAA,UAAhB;AAA4B,IAAA,KAA5B;AAAmC,IAAA;AAAnC,MAAgD,KAAtD;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,mBAAA,CAAA,YAAA,CACrB,OAAA,CAAA,gBADqB,EAGrB;AACA,EAAA,UAAU,CAAC,IAJU,EAKrB,UAAU,CAAC,YAAD,CALW,EAMrB,UAAU,IAAI,UAAU,CAAC,UAAD,CANH,EAQrB;AACA,GAAC,QAAD,IAAa,gBAAgB,CAAC,IATT,EAUrB,CAAC,QAAD,IAAa,KAAb,IAAsB,gBAAgB,CAAC,KAVlB,EAWrB,CAAC,QAAD,IAAa,gBAAgB,CAAC,YAAD,CAXR,EAarB;AACA,EAAA,QAAQ,IAAI,cAAc,CAAC,IAdN,EAerB,QAAQ,IAAI,KAAZ,IAAqB,cAAc,CAAC,KAff,EAgBrB,QAAQ,IAAI,cAAc,CAAC,YAAD,CAhBL,EAiBrB,QAAQ,IAAI,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAApC,IAAiD,cAAc,CAAC,YAjB3C,EAmBrB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAAxB,IAAqC,UAAU,CAAC,SApB3B,EAsBrB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAvBU,CAAvB;AA0BA,SAAO,KAAP;AACD,CAlCM;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourceRoot":""}
1
+ {"version":3,"sources":["components/Divider/useDividerStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,gBAAA,GAAmB,aAAnB;AAEb,MAAM,cAAc,GAAG,MAAvB;AACA,MAAM,YAAY,GAAG,MAArB;AACA,MAAM,iBAAiB,GAAG,KAA1B;AACA,MAAM,iBAAiB,GAAG,MAA1B;;AAEA,MAAM,aAAa,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAtB;;AAkGA,MAAM,mBAAmB,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA5B;;AAwDA,MAAM,iBAAiB,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AA8DO,MAAM,yBAAyB,GAAI,KAAD,IAAsC;AAC7E,QAAM,UAAU,GAAG,aAAa,EAAhC;AACA,QAAM,gBAAgB,GAAG,mBAAmB,EAA5C;AACA,QAAM,cAAc,GAAG,iBAAiB,EAAxC;AAEA,QAAM;AAAE,IAAA,YAAF;AAAgB,IAAA,UAAhB;AAA4B,IAAA,KAA5B;AAAmC,IAAA;AAAnC,MAAgD,KAAtD;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,gBADqB,EAGrB;AACA,EAAA,UAAU,CAAC,IAJU,EAKrB,UAAU,CAAC,YAAD,CALW,EAMrB,UAAU,IAAI,UAAU,CAAC,UAAD,CANH,EAQrB;AACA,GAAC,QAAD,IAAa,gBAAgB,CAAC,IATT,EAUrB,CAAC,QAAD,IAAa,KAAb,IAAsB,gBAAgB,CAAC,KAVlB,EAWrB,CAAC,QAAD,IAAa,gBAAgB,CAAC,YAAD,CAXR,EAarB;AACA,EAAA,QAAQ,IAAI,cAAc,CAAC,IAdN,EAerB,QAAQ,IAAI,KAAZ,IAAqB,cAAc,CAAC,KAff,EAgBrB,QAAQ,IAAI,cAAc,CAAC,YAAD,CAhBL,EAiBrB,QAAQ,IAAI,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAApC,IAAiD,cAAc,CAAC,YAjB3C,EAmBrB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,QAAX,KAAwB,SAAxB,IAAqC,UAAU,CAAC,SApB3B,EAsBrB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAvBU,CAAvB;AA0BA,SAAO,KAAP;AACD,CAlCM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerState } from './Divider.types';\n\nexport const dividerClassName = 'fui-Divider';\n\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\n\nconst useBaseStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n boxSizing: 'border-box',\n display: 'flex',\n flexDirection: 'row',\n flexGrow: 1,\n position: 'relative',\n\n fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n\n color: tokens.colorNeutralForeground2,\n\n ':before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n ':after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n\n // Childless styles\n childless: {\n ':before': {\n marginBottom: 0,\n marginRight: 0,\n },\n\n ':after': {\n marginLeft: 0,\n marginTop: 0,\n },\n },\n\n // Alignment variations\n start: {\n ':after': {\n content: '\"\"',\n },\n },\n center: {\n ':before': {\n content: '\"\"',\n },\n ':after': {\n content: '\"\"',\n },\n },\n end: {\n ':before': {\n content: '\"\"',\n },\n },\n\n // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n\n ':before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n\n ':after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1),\n },\n },\n subtle: {\n ':before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n ':after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n ':before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n ':after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n});\n\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n\n ':before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n\n ':after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing,\n },\n\n // Alignment variations\n start: {\n ':before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n ':after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n ':before': {\n marginRight: contentSpacing,\n },\n ':after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n ':before': {\n marginRight: contentSpacing,\n },\n ':after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n },\n});\n\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n\n ':before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n\n ':after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength,\n },\n },\n\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing,\n },\n\n // With children styles\n withChildren: {\n minHeight: '84px',\n },\n\n // Alignment variations\n start: {\n ':before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n\n ':after': {\n marginTop: contentSpacing,\n },\n },\n center: {\n ':before': {\n marginBottom: contentSpacing,\n },\n ':after': {\n marginTop: contentSpacing,\n },\n },\n end: {\n ':before': {\n marginBottom: contentSpacing,\n },\n ':after': {\n content: '\"\"',\n marginTop: contentSpacing,\n maxHeight: maxStartEndLength,\n },\n },\n});\n\nexport const useDividerStyles_unstable = (state: DividerState): DividerState => {\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n\n const { alignContent, appearance, inset, vertical } = state;\n\n state.root.className = mergeClasses(\n dividerClassName,\n\n // Base styles\n baseStyles.base,\n baseStyles[alignContent],\n appearance && baseStyles[appearance],\n\n // Horizontal styles\n !vertical && horizontalStyles.base,\n !vertical && inset && horizontalStyles.inset,\n !vertical && horizontalStyles[alignContent],\n\n // Vertical styles\n vertical && verticalStyles.base,\n vertical && inset && verticalStyles.inset,\n vertical && verticalStyles[alignContent],\n vertical && state.root.children !== undefined && verticalStyles.withChildren,\n\n // Childless styles\n state.root.children === undefined && baseStyles.childless,\n\n // User provided class name\n state.root.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
package/lib-commonjs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Divider';\n"],"sourceRoot":"../src/"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-divider",
3
- "version": "0.0.0-nightly3bc051736320220112.1",
3
+ "version": "0.0.0-nightly43b133e62020220224.1",
4
4
  "description": "Fluent UI component to visually separate content.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -22,15 +22,13 @@
22
22
  "test": "jest --passWithNoTests",
23
23
  "docs": "api-extractor run --config=config/api-extractor.local.json --local",
24
24
  "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-divider/src && yarn docs",
25
- "storybook": "start-storybook",
25
+ "storybook": "node ../../scripts/storybook/runner",
26
26
  "type-check": "tsc -b tsconfig.json"
27
27
  },
28
28
  "devDependencies": {
29
- "@fluentui/babel-make-styles": "0.0.0-nightly3bc051736320220112.1",
30
29
  "@fluentui/eslint-plugin": "*",
31
- "@fluentui/jest-serializer-make-styles": "0.0.0-nightly3bc051736320220112.1",
32
30
  "@fluentui/react-conformance": "*",
33
- "@fluentui/react-conformance-make-styles": "0.0.0-nightly3bc051736320220112.1",
31
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly43b133e62020220224.1",
34
32
  "@fluentui/scripts": "^1.0.0",
35
33
  "@types/enzyme": "3.10.3",
36
34
  "@types/enzyme-adapter-react-16": "1.0.3",
@@ -44,8 +42,9 @@
44
42
  "react-test-renderer": "^16.3.0"
45
43
  },
46
44
  "dependencies": {
47
- "@fluentui/react-make-styles": "0.0.0-nightly3bc051736320220112.1",
48
- "@fluentui/react-utilities": "0.0.0-nightly3bc051736320220112.1",
45
+ "@griffel/react": "1.0.0",
46
+ "@fluentui/react-theme": "0.0.0-nightly43b133e62020220224.1",
47
+ "@fluentui/react-utilities": "0.0.0-nightly43b133e62020220224.1",
49
48
  "tslib": "^2.1.0"
50
49
  },
51
50
  "peerDependencies": {