@fluentui/react-divider 9.72.9-experimental.component-base-hooks.20260122-49fc330360.0 → 9.74.3-experimental.esm.20260709-49ee7a20cf.0
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.
- package/CHANGELOG.md +87 -9
- package/dist/index.d.cts +84 -0
- package/dist/index.d.ts +2 -2
- package/lib/Divider.js +1 -1
- package/lib/Divider.js.map +1 -1
- package/lib/components/Divider/Divider.js +5 -5
- package/lib/components/Divider/Divider.js.map +1 -1
- package/lib/components/Divider/index.js +4 -4
- package/lib/components/Divider/index.js.map +1 -1
- package/lib/components/Divider/renderDivider.js +1 -1
- package/lib/components/Divider/renderDivider.js.map +1 -1
- package/lib/components/Divider/useDivider.js +1 -2
- package/lib/components/Divider/useDivider.js.map +1 -1
- package/lib/components/Divider/useDividerStyles.styles.js +4 -4
- package/lib/components/Divider/useDividerStyles.styles.js.map +1 -1
- package/lib/components/Divider/useDividerStyles.styles.raw.js +4 -3
- package/lib/components/Divider/useDividerStyles.styles.raw.js.map +1 -1
- package/lib/index.js +1 -3
- package/lib/index.js.map +1 -1
- package/lib-commonjs/{Divider.js → Divider.cjs} +1 -1
- package/lib-commonjs/{Divider.js.map → Divider.cjs.map} +1 -1
- package/lib-commonjs/components/Divider/{Divider.js → Divider.cjs} +3 -3
- package/lib-commonjs/components/Divider/{Divider.js.map → Divider.cjs.map} +1 -1
- package/lib-commonjs/components/Divider/{index.js → index.cjs} +4 -4
- package/lib-commonjs/components/Divider/{index.js.map → index.cjs.map} +1 -1
- package/lib-commonjs/components/Divider/renderDivider.cjs.map +1 -0
- package/lib-commonjs/components/Divider/{useDivider.js → useDivider.cjs} +0 -2
- package/lib-commonjs/components/Divider/useDivider.cjs.map +1 -0
- package/lib-commonjs/components/Divider/{useDividerStyles.styles.js → useDividerStyles.styles.cjs} +2 -1
- package/lib-commonjs/components/Divider/useDividerStyles.styles.cjs.map +1 -0
- package/lib-commonjs/components/Divider/{useDividerStyles.styles.raw.js → useDividerStyles.styles.raw.cjs} +2 -1
- package/lib-commonjs/components/Divider/useDividerStyles.styles.raw.cjs.map +1 -0
- package/lib-commonjs/{index.js → index.cjs} +1 -1
- package/lib-commonjs/index.cjs.map +1 -0
- package/package.json +17 -11
- package/lib-commonjs/components/Divider/renderDivider.js.map +0 -1
- package/lib-commonjs/components/Divider/useDivider.js.map +0 -1
- package/lib-commonjs/components/Divider/useDividerStyles.styles.js.map +0 -1
- package/lib-commonjs/components/Divider/useDividerStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/index.js.map +0 -1
- /package/lib-commonjs/components/Divider/{Divider.types.js → Divider.types.cjs} +0 -0
- /package/lib-commonjs/components/Divider/{Divider.types.js.map → Divider.types.cjs.map} +0 -0
- /package/lib-commonjs/components/Divider/{renderDivider.js → renderDivider.cjs} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,21 +1,99 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-divider
|
|
2
2
|
|
|
3
|
-
This log was last generated on Thu,
|
|
3
|
+
This log was last generated on Thu, 09 Jul 2026 17:34:05 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [9.
|
|
7
|
+
## [9.74.3-experimental.esm.20260709-49ee7a20cf.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.74.3-experimental.esm.20260709-49ee7a20cf.0)
|
|
8
8
|
|
|
9
|
-
Thu,
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.
|
|
9
|
+
Thu, 09 Jul 2026 17:34:05 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.7.3..@fluentui/react-divider_v9.74.3-experimental.esm.20260709-49ee7a20cf.0)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
|
-
- Release 9.
|
|
15
|
-
- Bump @fluentui/react-jsx-runtime to v9.
|
|
16
|
-
- Bump @fluentui/react-shared-contexts to v9.
|
|
17
|
-
- Bump @fluentui/react-theme to v9.
|
|
18
|
-
- Bump @fluentui/react-utilities to v9.
|
|
14
|
+
- Release 9.74.3-experimental.esm.20260709-49ee7a20cf ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-jsx-runtime to v9.74.3-experimental.esm.20260709-49ee7a20cf.0 ([commit](https://github.com/microsoft/fluentui/commit/175a26e0c520dd90a54578d1185a3b0b6c446e15) by beachball)
|
|
16
|
+
- Bump @fluentui/react-shared-contexts to v9.74.3-experimental.esm.20260709-49ee7a20cf.0 ([commit](https://github.com/microsoft/fluentui/commit/175a26e0c520dd90a54578d1185a3b0b6c446e15) by beachball)
|
|
17
|
+
- Bump @fluentui/react-theme to v9.74.3-experimental.esm.20260709-49ee7a20cf.0 ([commit](https://github.com/microsoft/fluentui/commit/175a26e0c520dd90a54578d1185a3b0b6c446e15) by beachball)
|
|
18
|
+
- Bump @fluentui/react-utilities to v9.74.3-experimental.esm.20260709-49ee7a20cf.0 ([commit](https://github.com/microsoft/fluentui/commit/175a26e0c520dd90a54578d1185a3b0b6c446e15) by beachball)
|
|
19
|
+
|
|
20
|
+
## [9.7.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.7.3)
|
|
21
|
+
|
|
22
|
+
Wed, 24 Jun 2026 11:09:43 GMT
|
|
23
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.7.2..@fluentui/react-divider_v9.7.3)
|
|
24
|
+
|
|
25
|
+
### Patches
|
|
26
|
+
|
|
27
|
+
- fix: remove redundant use no memo directives, and add justification to valid ones ([PR #36224](https://github.com/microsoft/fluentui/pull/36224) by martinhochel@microsoft.com)
|
|
28
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.4 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
29
|
+
- Bump @fluentui/react-utilities to v9.26.5 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
30
|
+
|
|
31
|
+
## [9.7.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.7.2)
|
|
32
|
+
|
|
33
|
+
Tue, 26 May 2026 09:39:56 GMT
|
|
34
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.7.1..@fluentui/react-divider_v9.7.2)
|
|
35
|
+
|
|
36
|
+
### Patches
|
|
37
|
+
|
|
38
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
39
|
+
- Bump @fluentui/react-utilities to v9.26.4 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
40
|
+
|
|
41
|
+
## [9.7.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.7.1)
|
|
42
|
+
|
|
43
|
+
Thu, 23 Apr 2026 14:21:15 GMT
|
|
44
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.7.0..@fluentui/react-divider_v9.7.1)
|
|
45
|
+
|
|
46
|
+
### Patches
|
|
47
|
+
|
|
48
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
49
|
+
- Bump @fluentui/react-utilities to v9.26.3 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
50
|
+
|
|
51
|
+
## [9.7.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.7.0)
|
|
52
|
+
|
|
53
|
+
Thu, 26 Mar 2026 08:12:49 GMT
|
|
54
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.6.2..@fluentui/react-divider_v9.7.0)
|
|
55
|
+
|
|
56
|
+
### Minor changes
|
|
57
|
+
|
|
58
|
+
- feat: expose base hook and types for Divider component ([PR #35889](https://github.com/microsoft/fluentui/pull/35889) by dmytrokirpa@microsoft.com)
|
|
59
|
+
|
|
60
|
+
## [9.6.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.6.2)
|
|
61
|
+
|
|
62
|
+
Wed, 25 Feb 2026 13:32:28 GMT
|
|
63
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.6.1..@fluentui/react-divider_v9.6.2)
|
|
64
|
+
|
|
65
|
+
### Patches
|
|
66
|
+
|
|
67
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.1 ([PR #35782](https://github.com/microsoft/fluentui/pull/35782) by beachball)
|
|
68
|
+
- Bump @fluentui/react-shared-contexts to v9.26.2 ([PR #35782](https://github.com/microsoft/fluentui/pull/35782) by beachball)
|
|
69
|
+
- Bump @fluentui/react-utilities to v9.26.2 ([PR #35782](https://github.com/microsoft/fluentui/pull/35782) by beachball)
|
|
70
|
+
|
|
71
|
+
## [9.6.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.6.1)
|
|
72
|
+
|
|
73
|
+
Thu, 12 Feb 2026 10:46:15 GMT
|
|
74
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.6.0..@fluentui/react-divider_v9.6.1)
|
|
75
|
+
|
|
76
|
+
### Patches
|
|
77
|
+
|
|
78
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.0 ([PR #35743](https://github.com/microsoft/fluentui/pull/35743) by beachball)
|
|
79
|
+
|
|
80
|
+
## [9.6.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.6.0)
|
|
81
|
+
|
|
82
|
+
Thu, 22 Jan 2026 17:06:52 GMT
|
|
83
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-divider_v9.5.1..@fluentui/react-divider_v9.6.0)
|
|
84
|
+
|
|
85
|
+
### Minor changes
|
|
86
|
+
|
|
87
|
+
- feat: add base hooks ([PR #35634](https://github.com/microsoft/fluentui/pull/35634) by dmytrokirpa@microsoft.com)
|
|
88
|
+
- Bump @fluentui/react-jsx-runtime to v9.3.5 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
|
|
89
|
+
- Bump @fluentui/react-shared-contexts to v9.26.1 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
|
|
90
|
+
- Bump @fluentui/react-theme to v9.2.1 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
|
|
91
|
+
- Bump @fluentui/react-utilities to v9.26.1 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
|
|
92
|
+
|
|
93
|
+
### Patches
|
|
94
|
+
|
|
95
|
+
- chore: remove experimental style hooks ([PR #35620](https://github.com/microsoft/fluentui/pull/35620) by dmytrokirpa@microsoft.com)
|
|
96
|
+
- refactor: refactor divider base hook ([PR #35679](https://github.com/microsoft/fluentui/pull/35679) by dmytrokirpa@microsoft.com)
|
|
19
97
|
|
|
20
98
|
## [9.5.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-divider_v9.5.1)
|
|
21
99
|
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import type { ComponentProps } from '@fluentui/react-utilities';
|
|
2
|
+
import type { ComponentState } from '@fluentui/react-utilities';
|
|
3
|
+
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
4
|
+
import type { JSXElement } from '@fluentui/react-utilities';
|
|
5
|
+
import type * as React_2 from 'react';
|
|
6
|
+
import type { Slot } from '@fluentui/react-utilities';
|
|
7
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* A divider visually segments content into groups.
|
|
11
|
+
*/
|
|
12
|
+
export declare const Divider: ForwardRefComponent<DividerProps>;
|
|
13
|
+
|
|
14
|
+
export declare type DividerBaseProps = Omit<DividerProps, 'alignContent' | 'appearance' | 'inset'>;
|
|
15
|
+
|
|
16
|
+
export declare type DividerBaseState = Omit<DividerState, 'alignContent' | 'appearance' | 'inset'>;
|
|
17
|
+
|
|
18
|
+
export declare const dividerClassNames: SlotClassNames<DividerSlots>;
|
|
19
|
+
|
|
20
|
+
export declare type DividerProps = ComponentProps<Partial<DividerSlots>> & {
|
|
21
|
+
/**
|
|
22
|
+
* Determines the alignment of the content within the divider.
|
|
23
|
+
*
|
|
24
|
+
* @default 'center'
|
|
25
|
+
*/
|
|
26
|
+
alignContent?: 'start' | 'center' | 'end';
|
|
27
|
+
/**
|
|
28
|
+
* A divider can have one of the preset appearances.
|
|
29
|
+
* When not specified, the divider has its default appearance.
|
|
30
|
+
*
|
|
31
|
+
* @default 'default'
|
|
32
|
+
*/
|
|
33
|
+
appearance?: 'brand' | 'default' | 'strong' | 'subtle';
|
|
34
|
+
/**
|
|
35
|
+
* Adds padding to the beginning and end of the divider.
|
|
36
|
+
*
|
|
37
|
+
* @default false
|
|
38
|
+
*/
|
|
39
|
+
inset?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* A divider can be horizontal (default) or vertical.
|
|
42
|
+
*
|
|
43
|
+
* @default false
|
|
44
|
+
*/
|
|
45
|
+
vertical?: boolean;
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
export declare type DividerSlots = {
|
|
49
|
+
/**
|
|
50
|
+
* Root of the component that renders as a `<div>` tag.
|
|
51
|
+
*/
|
|
52
|
+
root: NonNullable<Slot<'div'>>;
|
|
53
|
+
/**
|
|
54
|
+
* Wrapper for content when presented.
|
|
55
|
+
*/
|
|
56
|
+
wrapper: NonNullable<Slot<'div'>>;
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
export declare type DividerState = ComponentState<DividerSlots> & Required<Pick<DividerProps, 'alignContent' | 'appearance' | 'inset' | 'vertical'>>;
|
|
60
|
+
|
|
61
|
+
/**
|
|
62
|
+
* Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
|
|
63
|
+
*/
|
|
64
|
+
export declare const renderDivider_unstable: (state: DividerBaseState) => JSXElement;
|
|
65
|
+
|
|
66
|
+
/**
|
|
67
|
+
* Returns the props and state required to render the component
|
|
68
|
+
* @param props - User-provided props to the Divider component.
|
|
69
|
+
* @param ref - User-provided ref to be passed to the Divider component.
|
|
70
|
+
*/
|
|
71
|
+
export declare const useDivider_unstable: (props: DividerProps, ref: React_2.Ref<HTMLElement>) => DividerState;
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
* Base hook that provides behavior and structure of the Divider component.
|
|
75
|
+
* It doesn't include design-related features.
|
|
76
|
+
*
|
|
77
|
+
* @param props - User-provided props to the Divider component.
|
|
78
|
+
* @param ref - User-provided ref to be passed to the Divider component.
|
|
79
|
+
*/
|
|
80
|
+
export declare const useDividerBase_unstable: (props: DividerBaseProps, ref?: React_2.Ref<HTMLElement>) => DividerBaseState;
|
|
81
|
+
|
|
82
|
+
export declare const useDividerStyles_unstable: (state: DividerState) => DividerState;
|
|
83
|
+
|
|
84
|
+
export { }
|
package/dist/index.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ 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
4
|
import type { JSXElement } from '@fluentui/react-utilities';
|
|
5
|
-
import * as React_2 from 'react';
|
|
5
|
+
import type * as React_2 from 'react';
|
|
6
6
|
import type { Slot } from '@fluentui/react-utilities';
|
|
7
7
|
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
8
8
|
|
|
@@ -61,7 +61,7 @@ export declare type DividerState = ComponentState<DividerSlots> & Required<Pick<
|
|
|
61
61
|
/**
|
|
62
62
|
* Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
|
|
63
63
|
*/
|
|
64
|
-
export declare const renderDivider_unstable: (state:
|
|
64
|
+
export declare const renderDivider_unstable: (state: DividerBaseState) => JSXElement;
|
|
65
65
|
|
|
66
66
|
/**
|
|
67
67
|
* Returns the props and state required to render the component
|
package/lib/Divider.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { Divider, dividerClassNames, renderDivider_unstable, useDividerStyles_unstable, useDivider_unstable, useDividerBase_unstable } from
|
|
1
|
+
export { Divider, dividerClassNames, renderDivider_unstable, useDividerStyles_unstable, useDivider_unstable, useDividerBase_unstable } from "./components/Divider/index.js";
|
package/lib/Divider.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Divider.ts"],"sourcesContent":["export type {\n DividerBaseProps,\n DividerProps,\n DividerSlots,\n DividerBaseState,\n DividerState,\n} from './components/Divider/index';\nexport {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n useDividerBase_unstable,\n} from './components/Divider/index';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":"AAOA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,yBAAyB,EACzBC,mBAAmB,EACnBC,uBAAuB,QAClB,
|
|
1
|
+
{"version":3,"sources":["../src/Divider.ts"],"sourcesContent":["export type {\n DividerBaseProps,\n DividerProps,\n DividerSlots,\n DividerBaseState,\n DividerState,\n} from './components/Divider/index';\nexport {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n useDividerBase_unstable,\n} from './components/Divider/index';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":"AAOA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,yBAAyB,EACzBC,mBAAmB,EACnBC,uBAAuB,QAClB,gCAA6B"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import * as React from
|
|
3
|
-
import { renderDivider_unstable } from
|
|
4
|
-
import { useDivider_unstable } from
|
|
5
|
-
import { useDividerStyles_unstable } from
|
|
6
|
-
import { useCustomStyleHook_unstable } from
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { renderDivider_unstable } from "./renderDivider.js";
|
|
4
|
+
import { useDivider_unstable } from "./useDivider.js";
|
|
5
|
+
import { useDividerStyles_unstable } from "./useDividerStyles.styles.js";
|
|
6
|
+
import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
|
|
7
7
|
/**
|
|
8
8
|
* A divider visually segments content into groups.
|
|
9
9
|
*/ export const Divider = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/Divider.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles.styles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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 useCustomStyleHook_unstable('useDividerStyles_unstable')(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"names":["React","renderDivider_unstable","useDivider_unstable","useDividerStyles_unstable","useCustomStyleHook_unstable","Divider","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/Divider.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles.styles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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 useCustomStyleHook_unstable('useDividerStyles_unstable')(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"names":["React","renderDivider_unstable","useDivider_unstable","useDividerStyles_unstable","useCustomStyleHook_unstable","Divider","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,qBAAkB;AACzD,SAASC,mBAAmB,QAAQ,kBAAe;AACnD,SAASC,yBAAyB,QAAQ,+BAA4B;AAGtE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,wBAA6CL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,QAAQP,oBAAoBK,OAAOC;IAEzCL,0BAA0BM;IAE1BL,4BAA4B,6BAA6BK;IAEzD,OAAOR,uBAAuBQ;AAChC,GAAG;AAEHJ,QAAQK,WAAW,GAAG"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { Divider } from
|
|
2
|
-
export { renderDivider_unstable } from
|
|
3
|
-
export { useDivider_unstable, useDividerBase_unstable } from
|
|
4
|
-
export { dividerClassNames, useDividerStyles_unstable } from
|
|
1
|
+
export { Divider } from "./Divider.js";
|
|
2
|
+
export { renderDivider_unstable } from "./renderDivider.js";
|
|
3
|
+
export { useDivider_unstable, useDividerBase_unstable } from "./useDivider.js";
|
|
4
|
+
export { dividerClassNames, useDividerStyles_unstable } from "./useDividerStyles.styles.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/index.ts"],"sourcesContent":["export { Divider } from './Divider';\nexport type { DividerBaseProps, DividerProps, DividerSlots, DividerBaseState, DividerState } from './Divider.types';\nexport { renderDivider_unstable } from './renderDivider';\nexport { useDivider_unstable, useDividerBase_unstable } from './useDivider';\nexport { dividerClassNames, useDividerStyles_unstable } from './useDividerStyles.styles';\n"],"names":["Divider","renderDivider_unstable","useDivider_unstable","useDividerBase_unstable","dividerClassNames","useDividerStyles_unstable"],"mappings":"AAAA,SAASA,OAAO,QAAQ,
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/index.ts"],"sourcesContent":["export { Divider } from './Divider';\nexport type { DividerBaseProps, DividerProps, DividerSlots, DividerBaseState, DividerState } from './Divider.types';\nexport { renderDivider_unstable } from './renderDivider';\nexport { useDivider_unstable, useDividerBase_unstable } from './useDivider';\nexport { dividerClassNames, useDividerStyles_unstable } from './useDividerStyles.styles';\n"],"names":["Divider","renderDivider_unstable","useDivider_unstable","useDividerBase_unstable","dividerClassNames","useDividerStyles_unstable"],"mappings":"AAAA,SAASA,OAAO,QAAQ,eAAY;AAEpC,SAASC,sBAAsB,QAAQ,qBAAkB;AACzD,SAASC,mBAAmB,EAAEC,uBAAuB,QAAQ,kBAAe;AAC5E,SAASC,iBAAiB,EAAEC,yBAAyB,QAAQ,+BAA4B"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
|
-
import { assertSlots } from
|
|
2
|
+
import { assertSlots } from "@fluentui/react-utilities";
|
|
3
3
|
/**
|
|
4
4
|
* Renders a Divider component by passing the slot props (defined in `state`) to the appropriate slots.
|
|
5
5
|
*/ export const renderDivider_unstable = (state)=>{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/renderDivider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { DividerSlots,
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/renderDivider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DividerSlots, DividerBaseState } 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: DividerBaseState): JSXElement => {\n assertSlots<DividerSlots>(state);\n return (\n <state.root>{state.root.children !== undefined && <state.wrapper>{state.root.children}</state.wrapper>}</state.root>\n );\n};\n"],"names":["assertSlots","renderDivider_unstable","state","root","children","undefined","wrapper"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAIxD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC;IACrCF,YAA0BE;IAC1B,qBACE,KAACA,MAAMC,IAAI;kBAAED,MAAMC,IAAI,CAACC,QAAQ,KAAKC,2BAAa,KAACH,MAAMI,OAAO;sBAAEJ,MAAMC,IAAI,CAACC,QAAQ;;;AAEzF,EAAE"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import
|
|
3
|
-
import { useId, slot } from '@fluentui/react-utilities';
|
|
2
|
+
import { useId, slot } from "@fluentui/react-utilities";
|
|
4
3
|
/**
|
|
5
4
|
* Returns the props and state required to render the component
|
|
6
5
|
* @param props - User-provided props to the Divider component.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/useDivider.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId, slot } from '@fluentui/react-utilities';\nimport type { DividerBaseProps, DividerBaseState, 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 = 'default', inset = false, ...rest } = props;\n\n const state = useDividerBase_unstable(rest, ref);\n\n return {\n alignContent,\n appearance,\n inset,\n ...state,\n };\n};\n\n/**\n * Base hook that provides behavior and structure of the Divider component.\n * It doesn't include design-related features.\n *\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 useDividerBase_unstable = (props: DividerBaseProps, ref?: React.Ref<HTMLElement>): DividerBaseState => {\n const { vertical = false, wrapper, ...rest } = props;\n const dividerId = useId('divider-');\n\n return {\n vertical,\n components: {\n root: 'div',\n wrapper: 'div',\n },\n root: slot.always(\n {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ref: ref as React.Ref<HTMLDivElement>,\n ...rest,\n },\n { elementType: 'div' },\n ),\n wrapper: slot.always(wrapper, {\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n elementType: 'div',\n }),\n };\n};\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/useDivider.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useId, slot } from '@fluentui/react-utilities';\nimport type { DividerBaseProps, DividerBaseState, 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 = 'default', inset = false, ...rest } = props;\n\n const state = useDividerBase_unstable(rest, ref);\n\n return {\n alignContent,\n appearance,\n inset,\n ...state,\n };\n};\n\n/**\n * Base hook that provides behavior and structure of the Divider component.\n * It doesn't include design-related features.\n *\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 useDividerBase_unstable = (props: DividerBaseProps, ref?: React.Ref<HTMLElement>): DividerBaseState => {\n const { vertical = false, wrapper, ...rest } = props;\n const dividerId = useId('divider-');\n\n return {\n vertical,\n components: {\n root: 'div',\n wrapper: 'div',\n },\n root: slot.always(\n {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ref: ref as React.Ref<HTMLDivElement>,\n ...rest,\n },\n { elementType: 'div' },\n ),\n wrapper: slot.always(wrapper, {\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n elementType: 'div',\n }),\n };\n};\n"],"names":["useId","slot","useDivider_unstable","props","ref","alignContent","appearance","inset","rest","state","useDividerBase_unstable","vertical","wrapper","dividerId","components","root","always","role","children","undefined","elementType","defaultProps","id"],"mappings":"AAAA;AAGA,SAASA,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAGxD;;;;CAIC,GACD,OAAO,MAAMC,sBAAsB,CAACC,OAAqBC;IACvD,MAAM,EAAEC,eAAe,QAAQ,EAAEC,aAAa,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,MAAM,GAAGL;IAEpF,MAAMM,QAAQC,wBAAwBF,MAAMJ;IAE5C,OAAO;QACLC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AAEF;;;;;;CAMC,GACD,OAAO,MAAMC,0BAA0B,CAACP,OAAyBC;IAC/D,MAAM,EAAEO,WAAW,KAAK,EAAEC,OAAO,EAAE,GAAGJ,MAAM,GAAGL;IAC/C,MAAMU,YAAYb,MAAM;IAExB,OAAO;QACLW;QACAG,YAAY;YACVC,MAAM;YACNH,SAAS;QACX;QACAG,MAAMd,KAAKe,MAAM,CACf;YACEC,MAAM;YACN,oBAAoBN,WAAW,aAAa;YAC5C,mBAAmBR,MAAMe,QAAQ,GAAGL,YAAYM;YAChDf,KAAKA;YACL,GAAGI,IAAI;QACT,GACA;YAAEY,aAAa;QAAM;QAEvBR,SAASX,KAAKe,MAAM,CAACJ,SAAS;YAC5BS,cAAc;gBACZC,IAAIT;gBACJK,UAAUf,MAAMe,QAAQ;YAC1B;YACAE,aAAa;QACf;IACF;AACF,EAAE"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
-
import { mergeClasses, shorthands, __styles } from
|
|
4
|
-
import { tokens } from
|
|
3
|
+
import { mergeClasses, shorthands, __styles } from "@griffel/react";
|
|
4
|
+
import { tokens } from "@fluentui/react-theme";
|
|
5
5
|
export const dividerClassNames = {
|
|
6
6
|
root: 'fui-Divider',
|
|
7
7
|
wrapper: 'fui-Divider__wrapper'
|
|
@@ -167,8 +167,6 @@ const useVerticalStyles = /*#__PURE__*/__styles({
|
|
|
167
167
|
d: [".f1vx9l62{flex-direction:column;}", ".f16gbxbe{min-height:20px;}", ".f1yq6w5o::before{border-right-style:solid;}", ".f1jpmc5p::before{border-left-style:solid;}", ".f9sc749::before{border-right-width:var(--strokeWidthThin);}", ".f1x8pvcy::before{border-left-width:var(--strokeWidthThin);}", ".fhkwbjy::before{min-height:8px;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f13hvwk3::after{border-right-width:var(--strokeWidthThin);}", ".f1en4csx::after{border-left-width:var(--strokeWidthThin);}", ".f19onpk6::after{min-height:8px;}", ".f1xdg43u{margin-top:12px;}", ".f1jlhsmd{margin-bottom:12px;}", ".f1tjaq3g{min-height:84px;}", ".f1wl9k8s::before{content:\"\";}", ".fg2pwug::before{margin-bottom:12px;}", ".fkjtzyi::before{max-height:8px;}", ".f8vk40g::after{margin-top:12px;}", ".f13zj6fq::after{content:\"\";}", ".fqg5mu5::after{max-height:8px;}"]
|
|
168
168
|
});
|
|
169
169
|
export const useDividerStyles_unstable = state => {
|
|
170
|
-
'use no memo';
|
|
171
|
-
|
|
172
170
|
const baseStyles = useBaseStyles();
|
|
173
171
|
const horizontalStyles = useHorizontalStyles();
|
|
174
172
|
const verticalStyles = useVerticalStyles();
|
|
@@ -178,6 +176,7 @@ export const useDividerStyles_unstable = state => {
|
|
|
178
176
|
inset,
|
|
179
177
|
vertical
|
|
180
178
|
} = state;
|
|
179
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
181
180
|
state.root.className = mergeClasses(dividerClassNames.root,
|
|
182
181
|
// Base styles
|
|
183
182
|
baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance],
|
|
@@ -190,6 +189,7 @@ export const useDividerStyles_unstable = state => {
|
|
|
190
189
|
// User provided class name
|
|
191
190
|
state.root.className);
|
|
192
191
|
if (state.wrapper) {
|
|
192
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
193
193
|
state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);
|
|
194
194
|
}
|
|
195
195
|
return state;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","shorthands","__styles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","Bt984gj","B7ck84d","mc9l5x","Beiy3e4","Bh6795r","qhf8xq","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","fsow6f","Bcvre1j","Br0sdwz","Bn78ew0","li1rpt","ap17g6","B771hl4","childless","susq4k","Bicfajf","jwcpgy","B4rk6o","start","Bsft5z2","center","Ftih45","end","brand","sj55zd","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","B0n5ga8","s924m2","B1q35kw","Gp14am","subtle","strong","d","useHorizontalStyles","a9b677","Bdkvgpv","B0qfbqy","pbipgd","Bm2nyyq","xrcqlc","i5u598","inset","uwmqm3","z189sj","Bxwl2t9","Iy66sp","useVerticalStyles","sshi5w","m598lv","B4f6apu","zkzzav","Barhvk9","Ihftqj","Bde111x","B6of3ja","jrapky","withChildren","Bbdr6tz","gn64ia","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"sources":["useDividerStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const dividerClassNames = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper'\n};\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\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 fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n },\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n }\n },\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0\n },\n '::after': {\n marginLeft: 0,\n marginTop: 0\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 // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n }\n },\n default: {\n color: tokens.colorNeutralForeground2,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n }\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n }\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n }\n }\n});\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n },\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing\n },\n // Alignment variations\n start: {\n textAlign: 'left',\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n center: {\n textAlign: 'center',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n end: {\n textAlign: 'right',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength\n }\n }\n});\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n },\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing\n },\n // With children styles\n withChildren: {\n minHeight: '84px'\n },\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength\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});\nexport const useDividerStyles_unstable = (state)=>{\n 'use no memo';\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n const { alignContent, appearance, inset, vertical } = state;\n state.root.className = mergeClasses(dividerClassNames.root, // Base styles\n baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles\n !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles\n vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles\n state.root.children === undefined && baseStyles.childless, // User provided class name\n state.root.className);\n if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["mergeClasses","shorthands","__styles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","Bt984gj","B7ck84d","mc9l5x","Beiy3e4","Bh6795r","qhf8xq","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","fsow6f","Bcvre1j","Br0sdwz","Bn78ew0","li1rpt","ap17g6","B771hl4","childless","susq4k","Bicfajf","jwcpgy","B4rk6o","start","Bsft5z2","center","Ftih45","end","brand","sj55zd","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","B0n5ga8","s924m2","B1q35kw","Gp14am","subtle","strong","d","useHorizontalStyles","a9b677","Bdkvgpv","B0qfbqy","pbipgd","Bm2nyyq","xrcqlc","i5u598","inset","uwmqm3","z189sj","Bxwl2t9","Iy66sp","useVerticalStyles","sshi5w","m598lv","B4f6apu","zkzzav","Barhvk9","Ihftqj","Bde111x","B6of3ja","jrapky","withChildren","Bbdr6tz","gn64ia","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"sources":["useDividerStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, shorthands, makeStyles } from \"@griffel/react\";\nimport { tokens } from \"@fluentui/react-theme\";\nexport const dividerClassNames = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper'\n};\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\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 fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n },\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n }\n },\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0\n },\n '::after': {\n marginLeft: 0,\n marginTop: 0\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 // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n }\n },\n default: {\n color: tokens.colorNeutralForeground2,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n }\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n }\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n }\n }\n});\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n },\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing\n },\n // Alignment variations\n start: {\n textAlign: 'left',\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n center: {\n textAlign: 'center',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n end: {\n textAlign: 'right',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength\n }\n }\n});\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n },\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing\n },\n // With children styles\n withChildren: {\n minHeight: '84px'\n },\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength\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});\nexport const useDividerStyles_unstable = (state)=>{\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n const { alignContent, appearance, inset, vertical } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(dividerClassNames.root, // Base styles\n baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles\n !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles\n vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles\n state.root.children === undefined && baseStyles.childless, // User provided class name\n state.root.className);\n if (state.wrapper) {\n // eslint-disable-next-line react-hooks/immutability\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { mergeClasses, shorthands, makeStyles } from
|
|
3
|
-
import { tokens } from
|
|
2
|
+
import { mergeClasses, shorthands, makeStyles } from "@griffel/react";
|
|
3
|
+
import { tokens } from "@fluentui/react-theme";
|
|
4
4
|
export const dividerClassNames = {
|
|
5
5
|
root: 'fui-Divider',
|
|
6
6
|
wrapper: 'fui-Divider__wrapper'
|
|
@@ -211,11 +211,11 @@ const useVerticalStyles = makeStyles({
|
|
|
211
211
|
}
|
|
212
212
|
});
|
|
213
213
|
export const useDividerStyles_unstable = (state)=>{
|
|
214
|
-
'use no memo';
|
|
215
214
|
const baseStyles = useBaseStyles();
|
|
216
215
|
const horizontalStyles = useHorizontalStyles();
|
|
217
216
|
const verticalStyles = useVerticalStyles();
|
|
218
217
|
const { alignContent, appearance, inset, vertical } = state;
|
|
218
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
219
219
|
state.root.className = mergeClasses(dividerClassNames.root, // Base styles
|
|
220
220
|
baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles
|
|
221
221
|
!vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles
|
|
@@ -223,6 +223,7 @@ export const useDividerStyles_unstable = (state)=>{
|
|
|
223
223
|
state.root.children === undefined && baseStyles.childless, // User provided class name
|
|
224
224
|
state.root.className);
|
|
225
225
|
if (state.wrapper) {
|
|
226
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
226
227
|
state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);
|
|
227
228
|
}
|
|
228
229
|
return state;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/useDividerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\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 '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\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 default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n\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 textAlign: 'left',\n\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n textAlign: 'center',\n\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n textAlign: 'right',\n\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 'use no memo';\n\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 dividerClassNames.root,\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 if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"],"names":["mergeClasses","shorthands","makeStyles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","alignItems","boxSizing","display","flexDirection","flexGrow","position","fontFamily","fontFamilyBase","fontSize","fontSizeBase200","fontWeight","fontWeightRegular","lineHeight","lineHeightBase200","textAlign","childless","marginBottom","marginRight","marginLeft","marginTop","start","content","center","end","brand","color","colorBrandForeground1","borderColor","colorBrandStroke1","default","colorNeutralForeground2","colorNeutralStroke2","subtle","colorNeutralForeground3","colorNeutralStroke3","strong","colorNeutralForeground1","colorNeutralStroke1","useHorizontalStyles","width","borderTopStyle","borderTopWidth","strokeWidthThin","minWidth","inset","paddingLeft","paddingRight","maxWidth","useVerticalStyles","minHeight","borderRightStyle","borderRightWidth","withChildren","maxHeight","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/useDividerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\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 '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\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 default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n\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 textAlign: 'left',\n\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n textAlign: 'center',\n\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n textAlign: 'right',\n\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 // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n dividerClassNames.root,\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 if (state.wrapper) {\n // eslint-disable-next-line react-hooks/immutability\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"],"names":["mergeClasses","shorthands","makeStyles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","alignItems","boxSizing","display","flexDirection","flexGrow","position","fontFamily","fontFamilyBase","fontSize","fontSizeBase200","fontWeight","fontWeightRegular","lineHeight","lineHeightBase200","textAlign","childless","marginBottom","marginRight","marginLeft","marginTop","start","content","center","end","brand","color","colorBrandForeground1","borderColor","colorBrandStroke1","default","colorNeutralForeground2","colorNeutralStroke2","subtle","colorNeutralForeground3","colorNeutralStroke3","strong","colorNeutralForeground1","colorNeutralStroke1","useHorizontalStyles","width","borderTopStyle","borderTopWidth","strokeWidthThin","minWidth","inset","paddingLeft","paddingRight","maxWidth","useVerticalStyles","minHeight","borderRightStyle","borderRightWidth","withChildren","maxHeight","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"mappings":"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"}
|
package/lib/index.js
CHANGED
|
@@ -1,3 +1 @@
|
|
|
1
|
-
export { Divider, dividerClassNames, renderDivider_unstable, useDividerStyles_unstable, useDivider_unstable } from
|
|
2
|
-
// Experimental APIs - will be uncommented in the experimental release branch
|
|
3
|
-
export { useDividerBase_unstable } from './Divider';
|
|
1
|
+
export { Divider, dividerClassNames, renderDivider_unstable, useDividerStyles_unstable, useDivider_unstable, useDividerBase_unstable } from "./Divider.js";
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n useDividerBase_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState, DividerBaseProps, DividerBaseState } from './Divider';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,yBAAyB,EACzBC,mBAAmB,EACnBC,uBAAuB,QAClB,eAAY"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Divider.ts"],"sourcesContent":["export type {\n DividerBaseProps,\n DividerProps,\n DividerSlots,\n DividerBaseState,\n DividerState,\n} from './components/Divider/index';\nexport {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n useDividerBase_unstable,\n} from './components/Divider/index';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":";;;;;;;;;;;;eAQEA,cAAO;;;eACPC,wBAAiB;;;eACjBC,6BAAsB;;;eAGtBG,8BAAuB;;;eAFvBF,gCAAyB;;;eACzBC,0BAAmB;;;uBAEd,
|
|
1
|
+
{"version":3,"sources":["../src/Divider.ts"],"sourcesContent":["export type {\n DividerBaseProps,\n DividerProps,\n DividerSlots,\n DividerBaseState,\n DividerState,\n} from './components/Divider/index';\nexport {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n useDividerBase_unstable,\n} from './components/Divider/index';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":";;;;;;;;;;;;eAQEA,cAAO;;;eACPC,wBAAiB;;;eACjBC,6BAAsB;;;eAGtBG,8BAAuB;;;eAFvBF,gCAAyB;;;eACzBC,0BAAmB;;;uBAEd,gCAA6B"}
|
|
@@ -11,9 +11,9 @@ Object.defineProperty(exports, "Divider", {
|
|
|
11
11
|
});
|
|
12
12
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
13
13
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
14
|
-
const _renderDivider = require("./renderDivider");
|
|
15
|
-
const _useDivider = require("./useDivider");
|
|
16
|
-
const _useDividerStylesstyles = require("./useDividerStyles.styles");
|
|
14
|
+
const _renderDivider = require("./renderDivider.cjs");
|
|
15
|
+
const _useDivider = require("./useDivider.cjs");
|
|
16
|
+
const _useDividerStylesstyles = require("./useDividerStyles.styles.cjs");
|
|
17
17
|
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
|
|
18
18
|
const Divider = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
19
19
|
const state = (0, _useDivider.useDivider_unstable)(props, ref);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/Divider.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles.styles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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 useCustomStyleHook_unstable('useDividerStyles_unstable')(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"names":["React","renderDivider_unstable","useDivider_unstable","useDividerStyles_unstable","useCustomStyleHook_unstable","Divider","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;+BACQ,
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/Divider.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderDivider_unstable } from './renderDivider';\nimport { useDivider_unstable } from './useDivider';\nimport { useDividerStyles_unstable } from './useDividerStyles.styles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { DividerProps } from './Divider.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\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 useCustomStyleHook_unstable('useDividerStyles_unstable')(state);\n\n return renderDivider_unstable(state);\n});\n\nDivider.displayName = 'Divider';\n"],"names":["React","renderDivider_unstable","useDivider_unstable","useDividerStyles_unstable","useCustomStyleHook_unstable","Divider","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;+BACQ,qBAAkB;4BACrB,kBAAe;wCACT,+BAA4B;qCAG1B,kCAAkC;AAKvE,MAAMK,UAAAA,WAAAA,GAA6CL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,YAAQP,+BAAAA,EAAoBK,OAAOC;QAEzCL,iDAAAA,EAA0BM;QAE1BL,gDAAAA,EAA4B,6BAA6BK;IAEzD,WAAOR,qCAAAA,EAAuBQ;AAChC,GAAG;AAEHJ,QAAQK,WAAW,GAAG"}
|
|
@@ -28,7 +28,7 @@ _export(exports, {
|
|
|
28
28
|
return _useDivider.useDivider_unstable;
|
|
29
29
|
}
|
|
30
30
|
});
|
|
31
|
-
const _Divider = require("./Divider");
|
|
32
|
-
const _renderDivider = require("./renderDivider");
|
|
33
|
-
const _useDivider = require("./useDivider");
|
|
34
|
-
const _useDividerStylesstyles = require("./useDividerStyles.styles");
|
|
31
|
+
const _Divider = require("./Divider.cjs");
|
|
32
|
+
const _renderDivider = require("./renderDivider.cjs");
|
|
33
|
+
const _useDivider = require("./useDivider.cjs");
|
|
34
|
+
const _useDividerStylesstyles = require("./useDividerStyles.styles.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/index.ts"],"sourcesContent":["export { Divider } from './Divider';\nexport type { DividerBaseProps, DividerProps, DividerSlots, DividerBaseState, DividerState } from './Divider.types';\nexport { renderDivider_unstable } from './renderDivider';\nexport { useDivider_unstable, useDividerBase_unstable } from './useDivider';\nexport { dividerClassNames, useDividerStyles_unstable } from './useDividerStyles.styles';\n"],"names":["Divider","renderDivider_unstable","useDivider_unstable","useDividerBase_unstable","dividerClassNames","useDividerStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,gBAAO;;;eAIPI,yCAAiB;;;eAFjBH,qCAAsB;;;eACDE,mCAAuB;;;eACzBE,iDAAyB;;;eAD5CH,+BAAmB;;;yBAHJ,
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/index.ts"],"sourcesContent":["export { Divider } from './Divider';\nexport type { DividerBaseProps, DividerProps, DividerSlots, DividerBaseState, DividerState } from './Divider.types';\nexport { renderDivider_unstable } from './renderDivider';\nexport { useDivider_unstable, useDividerBase_unstable } from './useDivider';\nexport { dividerClassNames, useDividerStyles_unstable } from './useDividerStyles.styles';\n"],"names":["Divider","renderDivider_unstable","useDivider_unstable","useDividerBase_unstable","dividerClassNames","useDividerStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,gBAAO;;;eAIPI,yCAAiB;;;eAFjBH,qCAAsB;;;eACDE,mCAAuB;;;eACzBE,iDAAyB;;;eAD5CH,+BAAmB;;;yBAHJ,eAAY;+BAEG,qBAAkB;4BACI,kBAAe;wCACf,+BAA4B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/renderDivider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DividerSlots, DividerBaseState } 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: DividerBaseState): JSXElement => {\n assertSlots<DividerSlots>(state);\n return (\n <state.root>{state.root.children !== undefined && <state.wrapper>{state.root.children}</state.wrapper>}</state.root>\n );\n};\n"],"names":["assertSlots","renderDivider_unstable","state","root","children","undefined","wrapper"],"mappings":";;;;+BAUaC;;;;;;4BATb,gDAAiD;gCAErB,4BAA4B;AAOjD,+BAA+B,CAACC;QACrCF,2BAAAA,EAA0BE;IAC1B,OAAA,WAAA,OACE,eAAA,EAACA,MAAMC,IAAI,EAAA;kBAAED,MAAMC,IAAI,CAACC,QAAQ,KAAKC,aAAAA,WAAAA,OAAa,eAAA,EAACH,MAAMI,OAAO,EAAA;sBAAEJ,MAAMC,IAAI,CAACC,QAAQ;;;AAEzF,EAAE"}
|
|
@@ -17,8 +17,6 @@ _export(exports, {
|
|
|
17
17
|
return useDivider_unstable;
|
|
18
18
|
}
|
|
19
19
|
});
|
|
20
|
-
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
21
|
-
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
22
20
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
23
21
|
const useDivider_unstable = (props, ref)=>{
|
|
24
22
|
const { alignContent = 'center', appearance = 'default', inset = false, ...rest } = props;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/useDivider.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useId, slot } from '@fluentui/react-utilities';\nimport type { DividerBaseProps, DividerBaseState, 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 = 'default', inset = false, ...rest } = props;\n\n const state = useDividerBase_unstable(rest, ref);\n\n return {\n alignContent,\n appearance,\n inset,\n ...state,\n };\n};\n\n/**\n * Base hook that provides behavior and structure of the Divider component.\n * It doesn't include design-related features.\n *\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 useDividerBase_unstable = (props: DividerBaseProps, ref?: React.Ref<HTMLElement>): DividerBaseState => {\n const { vertical = false, wrapper, ...rest } = props;\n const dividerId = useId('divider-');\n\n return {\n vertical,\n components: {\n root: 'div',\n wrapper: 'div',\n },\n root: slot.always(\n {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ref: ref as React.Ref<HTMLDivElement>,\n ...rest,\n },\n { elementType: 'div' },\n ),\n wrapper: slot.always(wrapper, {\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n elementType: 'div',\n }),\n };\n};\n"],"names":["useId","slot","useDivider_unstable","props","ref","alignContent","appearance","inset","rest","state","useDividerBase_unstable","vertical","wrapper","dividerId","components","root","always","role","children","undefined","elementType","defaultProps","id"],"mappings":"AAAA;;;;;;;;;;;;2BA+BaU;eAAAA;;uBApBAR;;;;gCARe,4BAA4B;AAQjD,MAAMA,sBAAsB,CAACC,OAAqBC;IACvD,MAAM,EAAEC,eAAe,QAAQ,EAAEC,aAAa,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,MAAM,GAAGL;IAEpF,MAAMM,QAAQC,wBAAwBF,MAAMJ;IAE5C,OAAO;QACLC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AASK,gCAAgC,CAACN,OAAyBC;IAC/D,MAAM,EAAEO,WAAW,KAAK,EAAEC,OAAO,EAAE,GAAGJ,MAAM,GAAGL;IAC/C,MAAMU,gBAAYb,qBAAAA,EAAM;IAExB,OAAO;QACLW;QACAG,YAAY;YACVC,MAAM;YACNH,SAAS;QACX;QACAG,MAAMd,oBAAAA,CAAKe,MAAM,CACf;YACEC,MAAM;YACN,oBAAoBN,WAAW,aAAa;YAC5C,mBAAmBR,MAAMe,QAAQ,GAAGL,YAAYM;YAChDf,KAAKA;YACL,GAAGI,IAAI;QACT,GACA;YAAEY,aAAa;QAAM;QAEvBR,SAASX,oBAAAA,CAAKe,MAAM,CAACJ,SAAS;YAC5BS,cAAc;gBACZC,IAAIT;gBACJK,UAAUf,MAAMe,QAAQ;YAC1B;YACAE,aAAa;QACf;IACF;AACF,EAAE"}
|
package/lib-commonjs/components/Divider/{useDividerStyles.styles.js → useDividerStyles.styles.cjs}
RENAMED
|
@@ -384,11 +384,11 @@ const useVerticalStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
|
384
384
|
]
|
|
385
385
|
});
|
|
386
386
|
const useDividerStyles_unstable = (state)=>{
|
|
387
|
-
'use no memo';
|
|
388
387
|
const baseStyles = useBaseStyles();
|
|
389
388
|
const horizontalStyles = useHorizontalStyles();
|
|
390
389
|
const verticalStyles = useVerticalStyles();
|
|
391
390
|
const { alignContent, appearance, inset, vertical } = state;
|
|
391
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
392
392
|
state.root.className = (0, _react.mergeClasses)(dividerClassNames.root, // Base styles
|
|
393
393
|
baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles
|
|
394
394
|
!vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles
|
|
@@ -396,6 +396,7 @@ const useDividerStyles_unstable = (state)=>{
|
|
|
396
396
|
state.root.children === undefined && baseStyles.childless, // User provided class name
|
|
397
397
|
state.root.className);
|
|
398
398
|
if (state.wrapper) {
|
|
399
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
399
400
|
state.wrapper.className = (0, _react.mergeClasses)(dividerClassNames.wrapper, state.wrapper.className);
|
|
400
401
|
}
|
|
401
402
|
return state;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useDividerStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, shorthands, makeStyles } from \"@griffel/react\";\nimport { tokens } from \"@fluentui/react-theme\";\nexport const dividerClassNames = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper'\n};\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\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 fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n },\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n }\n },\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0\n },\n '::after': {\n marginLeft: 0,\n marginTop: 0\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 // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n }\n },\n default: {\n color: tokens.colorNeutralForeground2,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n }\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n }\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n }\n }\n});\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n },\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing\n },\n // Alignment variations\n start: {\n textAlign: 'left',\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n center: {\n textAlign: 'center',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n end: {\n textAlign: 'right',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength\n }\n }\n});\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n },\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing\n },\n // With children styles\n withChildren: {\n minHeight: '84px'\n },\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength\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});\nexport const useDividerStyles_unstable = (state)=>{\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n const { alignContent, appearance, inset, vertical } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(dividerClassNames.root, // Base styles\n baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles\n !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles\n vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles\n state.root.children === undefined && baseStyles.childless, // User provided class name\n state.root.className);\n if (state.wrapper) {\n // eslint-disable-next-line react-hooks/immutability\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n return state;\n};\n"],"names":["mergeClasses","shorthands","__styles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","Bt984gj","B7ck84d","mc9l5x","Beiy3e4","Bh6795r","qhf8xq","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","fsow6f","Bcvre1j","Br0sdwz","Bn78ew0","li1rpt","ap17g6","B771hl4","childless","susq4k","Bicfajf","jwcpgy","B4rk6o","start","Bsft5z2","center","Ftih45","end","brand","sj55zd","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","B0n5ga8","s924m2","B1q35kw","Gp14am","subtle","strong","d","useHorizontalStyles","a9b677","Bdkvgpv","B0qfbqy","pbipgd","Bm2nyyq","xrcqlc","i5u598","inset","uwmqm3","z189sj","Bxwl2t9","Iy66sp","useVerticalStyles","sshi5w","m598lv","B4f6apu","zkzzav","Barhvk9","Ihftqj","Bde111x","B6of3ja","jrapky","withChildren","Bbdr6tz","gn64ia","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"mappings":"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"}
|
|
@@ -229,13 +229,14 @@ const useVerticalStyles = (0, _react.makeStyles)({
|
|
|
229
229
|
}
|
|
230
230
|
});
|
|
231
231
|
const useDividerStyles_unstable = (state)=>{
|
|
232
|
-
'use no memo';
|
|
233
232
|
const baseStyles = useBaseStyles();
|
|
234
233
|
const horizontalStyles = useHorizontalStyles();
|
|
235
234
|
const verticalStyles = useVerticalStyles();
|
|
236
235
|
const { alignContent, appearance, inset, vertical } = state;
|
|
236
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
237
237
|
state.root.className = (0, _react.mergeClasses)(dividerClassNames.root, baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, state.root.children === undefined && baseStyles.childless, state.root.className);
|
|
238
238
|
if (state.wrapper) {
|
|
239
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
239
240
|
state.wrapper.className = (0, _react.mergeClasses)(dividerClassNames.wrapper, state.wrapper.className);
|
|
240
241
|
}
|
|
241
242
|
return state;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Divider/useDividerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\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 '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\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 default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n\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 textAlign: 'left',\n\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n textAlign: 'center',\n\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n textAlign: 'right',\n\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 // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n dividerClassNames.root,\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 if (state.wrapper) {\n // eslint-disable-next-line react-hooks/immutability\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"],"names":["mergeClasses","shorthands","makeStyles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","alignItems","boxSizing","display","flexDirection","flexGrow","position","fontFamily","fontFamilyBase","fontSize","fontSizeBase200","fontWeight","fontWeightRegular","lineHeight","lineHeightBase200","textAlign","childless","marginBottom","marginRight","marginLeft","marginTop","start","content","center","end","brand","color","colorBrandForeground1","borderColor","colorBrandStroke1","default","colorNeutralForeground2","colorNeutralStroke2","subtle","colorNeutralForeground3","colorNeutralStroke3","strong","colorNeutralForeground1","colorNeutralStroke1","useHorizontalStyles","width","borderTopStyle","borderTopWidth","strokeWidthThin","minWidth","inset","paddingLeft","paddingRight","maxWidth","useVerticalStyles","minHeight","borderRightStyle","borderRightWidth","withChildren","maxHeight","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"mappings":"AAAA;;;;;;;;;;;;IAOaI,iBAAAA;;;IAmPA+D,yBAAAA;;;;uBAxPwC,iBAAiB;4BAC/C,wBAAwB;AAIxC,0BAAwD;IAC7D9D,MAAM;IACNC,SAAS;AACX,EAAE;AAEF,MAAMC,iBAAiB;AACvB,MAAMC,eAAe;AACrB,MAAMC,oBAAoB;AAC1B,MAAMC,oBAAoB;AAE1B,MAAMC,oBAAgBT,iBAAAA,EAAW;IAC/B,cAAc;IACdU,MAAM;QACJC,YAAY;QACZC,WAAW;QACXC,SAAS;QACTC,eAAe;QACfC,UAAU;QACVC,UAAU;QAEVC,YAAYhB,kBAAAA,CAAOiB,cAAc;QACjCC,UAAUlB,kBAAAA,CAAOmB,eAAe;QAChCC,YAAYpB,kBAAAA,CAAOqB,iBAAiB;QACpCC,YAAYtB,kBAAAA,CAAOuB,iBAAiB;QACpCC,WAAW;QAEX,YAAY;YACVb,WAAW;YACXC,SAAS;YACTE,UAAU;QACZ;QAEA,WAAW;YACTH,WAAW;YACXC,SAAS;YACTE,UAAU;QACZ;IACF;IAEA,mBAAmB;IACnBW,WAAW;QACT,YAAY;YACVC,cAAc;YACdC,aAAa;QACf;QAEA,WAAW;YACTC,YAAY;YACZC,WAAW;QACb;IACF;IAEA,uBAAuB;IACvBC,OAAO;QACL,WAAW;YACTC,SAAS;QACX;IACF;IACAC,QAAQ;QACN,YAAY;YACVD,SAAS;QACX;QACA,WAAW;YACTA,SAAS;QACX;IACF;IACAE,KAAK;QACH,YAAY;YACVF,SAAS;QACX;IACF;IAEA,wBAAwB;IACxBG,OAAO;QACLC,OAAOnC,kBAAAA,CAAOoC,qBAAqB;QAEnC,YAAY;YACV,GAAGtC,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAOsC,iBAAiB,CAAC;QACrD;QAEA,WAAW;YACT,GAAGxC,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAOsC,iBAAiB,CAAC;QACrD;IACF;IACAC,SAAS;QACPJ,OAAOnC,kBAAAA,CAAOwC,uBAAuB;QAErC,YAAY;YACV,GAAG1C,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAOyC,mBAAmB,CAAC;QACvD;QAEA,WAAW;YACT,GAAG3C,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAOyC,mBAAmB,CAAC;QACvD;IACF;IACAC,QAAQ;QACNP,OAAOnC,kBAAAA,CAAO2C,uBAAuB;QAErC,YAAY;YACV,GAAG7C,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAO4C,mBAAmB,CAAC;QACvD;QAEA,WAAW;YACT,GAAG9C,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAO4C,mBAAmB,CAAC;QACvD;IACF;IACAC,QAAQ;QACNV,OAAOnC,kBAAAA,CAAO8C,uBAAuB;QAErC,YAAY;YACV,GAAGhD,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAO+C,mBAAmB,CAAC;QACvD;QAEA,WAAW;YACT,GAAGjD,iBAAAA,CAAWuC,WAAW,CAACrC,kBAAAA,CAAO+C,mBAAmB,CAAC;QACvD;IACF;AACF;AAEA,MAAMC,0BAAsBjD,iBAAAA,EAAW;IACrC,cAAc;IACdU,MAAM;QACJwC,OAAO;QAEP,YAAY;YACVC,gBAAgB;YAChBC,gBAAgBnD,kBAAAA,CAAOoD,eAAe;YACtCC,UAAU9C;QACZ;QAEA,WAAW;YACT2C,gBAAgB;YAChBC,gBAAgBnD,kBAAAA,CAAOoD,eAAe;YACtCC,UAAU9C;QACZ;IACF;IAEA,eAAe;IACf+C,OAAO;QACLC,aAAalD;QACbmD,cAAcnD;IAChB;IAEA,uBAAuB;IACvByB,OAAO;QACLN,WAAW;QAEX,YAAY;YACVO,SAAS;YACTJ,aAAavB;YACbqD,UAAUnD;QACZ;QAEA,WAAW;YACTsB,YAAYxB;QACd;IACF;IACA4B,QAAQ;QACNR,WAAW;QAEX,YAAY;YACVG,aAAavB;QACf;QACA,WAAW;YACTwB,YAAYxB;QACd;IACF;IACA6B,KAAK;QACHT,WAAW;QAEX,YAAY;YACVG,aAAavB;QACf;QACA,WAAW;YACT2B,SAAS;YACTH,YAAYxB;YACZqD,UAAUnD;QACZ;IACF;AACF;AAEA,MAAMoD,wBAAoB3D,iBAAAA,EAAW;IACnC,cAAc;IACdU,MAAM;QACJI,eAAe;QACf8C,WAAW;QAEX,YAAY;YACVC,kBAAkB;YAClBC,kBAAkB7D,kBAAAA,CAAOoD,eAAe;YACxCO,WAAWpD;QACb;QAEA,WAAW;YACTqD,kBAAkB;YAClBC,kBAAkB7D,kBAAAA,CAAOoD,eAAe;YACxCO,WAAWpD;QACb;IACF;IAEA,eAAe;IACf+C,OAAO;QACLzB,WAAWxB;QACXqB,cAAcrB;IAChB;IAEA,uBAAuB;IACvByD,cAAc;QACZH,WAAW;IACb;IAEA,uBAAuB;IACvB7B,OAAO;QACL,YAAY;YACVC,SAAS;YACTL,cAActB;YACd2D,WAAWzD;QACb;QAEA,WAAW;YACTuB,WAAWzB;QACb;IACF;IACA4B,QAAQ;QACN,YAAY;YACVN,cAActB;QAChB;QACA,WAAW;YACTyB,WAAWzB;QACb;IACF;IACA6B,KAAK;QACH,YAAY;YACVP,cAActB;QAChB;QACA,WAAW;YACT2B,SAAS;YACTF,WAAWzB;YACX2D,WAAWzD;QACb;IACF;AACF;AAEO,kCAAkC,CAAC2D;IACxC,MAAMC,aAAa1D;IACnB,MAAM2D,mBAAmBnB;IACzB,MAAMoB,iBAAiBV;IAEvB,MAAM,EAAEW,YAAY,EAAEC,UAAU,EAAEhB,KAAK,EAAEiB,QAAQ,EAAE,GAAGN;IAEtD,oDAAoD;IACpDA,MAAM/D,IAAI,CAACsE,SAAS,OAAG3E,mBAAAA,EACrBI,kBAAkBC,IAAI,EAEtB,AACAgE,WAAWzD,GADG,CACC,EACfyD,UAAU,CAACG,aAAa,EACxBC,cAAcJ,UAAU,CAACI,WAAW,EAEpC,AACA,CAACC,YAAYJ,OADO,UACU1D,IAAI,EAClC,CAAC8D,YAAYjB,SAASa,iBAAiBb,KAAK,EAC5C,CAACiB,YAAYJ,gBAAgB,CAACE,aAAa,EAE3C,AACAE,YAAYH,MADM,SACS3D,IAAI,EAC/B8D,YAAYjB,SAASc,eAAed,KAAK,EACzCiB,YAAYH,cAAc,CAACC,aAAa,EACxCE,YAAYN,MAAM/D,IAAI,CAACuE,QAAQ,KAAKC,aAAaN,eAAeN,YAAY,EAE5E,AACAG,MAAM/D,IAAI,CAACuE,QADQ,AACA,KAAKC,aAAaR,WAAWzC,SAAS,EAEzD,AACAwC,MAAM/D,IAAI,CAACsE,SAAS,OADO;IAI7B,IAAIP,MAAM9D,OAAO,EAAE;QACjB,oDAAoD;QACpD8D,MAAM9D,OAAO,CAACqE,SAAS,OAAG3E,mBAAAA,EAAaI,kBAAkBE,OAAO,EAAE8D,MAAM9D,OAAO,CAACqE,SAAS;IAC3F;IAEA,OAAOP;AACT,EAAE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n useDividerBase_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState, DividerBaseProps, DividerBaseState } from './Divider';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":";;;;;;;;;;;;eACEA,gBAAO;;;eACPC,0BAAiB;;;eACjBC,+BAAsB;;;eAGtBG,gCAAuB;;;eAFvBF,kCAAyB;;;eACzBC,4BAAmB;;;yBAEd,eAAY"}
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-divider",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
|
|
4
4
|
"description": "Fluent UI component to visually separate content.",
|
|
5
|
-
"main": "lib-commonjs/index.
|
|
5
|
+
"main": "lib-commonjs/index.cjs",
|
|
6
6
|
"module": "lib/index.js",
|
|
7
7
|
"typings": "./dist/index.d.ts",
|
|
8
8
|
"sideEffects": false,
|
|
@@ -12,10 +12,10 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui/react-jsx-runtime": "9.
|
|
16
|
-
"@fluentui/react-shared-contexts": "9.
|
|
17
|
-
"@fluentui/react-theme": "9.
|
|
18
|
-
"@fluentui/react-utilities": "9.
|
|
15
|
+
"@fluentui/react-jsx-runtime": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
|
|
16
|
+
"@fluentui/react-shared-contexts": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
|
|
17
|
+
"@fluentui/react-theme": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
|
|
18
|
+
"@fluentui/react-utilities": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
|
|
19
19
|
"@griffel/react": "^1.5.32",
|
|
20
20
|
"@swc/helpers": "^0.5.1"
|
|
21
21
|
},
|
|
@@ -28,17 +28,23 @@
|
|
|
28
28
|
"beachball": {},
|
|
29
29
|
"exports": {
|
|
30
30
|
".": {
|
|
31
|
-
"
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
31
|
+
"import": {
|
|
32
|
+
"types": "./dist/index.d.ts",
|
|
33
|
+
"default": "./lib/index.js"
|
|
34
|
+
},
|
|
35
|
+
"require": {
|
|
36
|
+
"types": "./dist/index.d.cts",
|
|
37
|
+
"default": "./lib-commonjs/index.cjs"
|
|
38
|
+
}
|
|
35
39
|
},
|
|
36
40
|
"./package.json": "./package.json"
|
|
37
41
|
},
|
|
38
42
|
"files": [
|
|
39
43
|
"*.md",
|
|
40
44
|
"dist/*.d.ts",
|
|
45
|
+
"dist/*.d.cts",
|
|
41
46
|
"lib",
|
|
42
47
|
"lib-commonjs"
|
|
43
|
-
]
|
|
48
|
+
],
|
|
49
|
+
"type": "module"
|
|
44
50
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/renderDivider.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } 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): JSXElement => {\n assertSlots<DividerSlots>(state);\n return (\n <state.root>{state.root.children !== undefined && <state.wrapper>{state.root.children}</state.wrapper>}</state.root>\n );\n};\n"],"names":["assertSlots","renderDivider_unstable","state","root","children","undefined","wrapper"],"mappings":";;;;+BAUaC;;;;;;4BATb,gDAAiD;gCAErB,4BAA4B;AAOjD,+BAA+B,CAACC;QACrCF,2BAAAA,EAA0BE;IAC1B,OAAA,WAAA,OACE,eAAA,EAACA,MAAMC,IAAI,EAAA;kBAAED,MAAMC,IAAI,CAACC,QAAQ,KAAKC,aAAAA,WAAAA,OAAa,eAAA,EAACH,MAAMI,OAAO,EAAA;sBAAEJ,MAAMC,IAAI,CAACC,QAAQ;;;AAEzF,EAAE"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/useDivider.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId, slot } from '@fluentui/react-utilities';\nimport type { DividerBaseProps, DividerBaseState, 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 = 'default', inset = false, ...rest } = props;\n\n const state = useDividerBase_unstable(rest, ref);\n\n return {\n alignContent,\n appearance,\n inset,\n ...state,\n };\n};\n\n/**\n * Base hook that provides behavior and structure of the Divider component.\n * It doesn't include design-related features.\n *\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 useDividerBase_unstable = (props: DividerBaseProps, ref?: React.Ref<HTMLElement>): DividerBaseState => {\n const { vertical = false, wrapper, ...rest } = props;\n const dividerId = useId('divider-');\n\n return {\n vertical,\n components: {\n root: 'div',\n wrapper: 'div',\n },\n root: slot.always(\n {\n role: 'separator',\n 'aria-orientation': vertical ? 'vertical' : 'horizontal',\n 'aria-labelledby': props.children ? dividerId : undefined,\n ref: ref as React.Ref<HTMLDivElement>,\n ...rest,\n },\n { elementType: 'div' },\n ),\n wrapper: slot.always(wrapper, {\n defaultProps: {\n id: dividerId,\n children: props.children,\n },\n elementType: 'div',\n }),\n };\n};\n"],"names":["React","useId","slot","useDivider_unstable","props","ref","alignContent","appearance","inset","rest","state","useDividerBase_unstable","vertical","wrapper","dividerId","components","root","always","role","children","undefined","elementType","defaultProps","id"],"mappings":"AAAA;;;;;;;;;;;;2BA+BaW;eAAAA;;uBApBAR;;;;;iEATU,QAAQ;gCACH,4BAA4B;AAQjD,MAAMA,sBAAsB,CAACC,OAAqBC;IACvD,MAAM,EAAEC,eAAe,QAAQ,EAAEC,aAAa,SAAS,EAAEC,QAAQ,KAAK,EAAE,GAAGC,MAAM,GAAGL;IAEpF,MAAMM,QAAQC,wBAAwBF,MAAMJ;IAE5C,OAAO;QACLC;QACAC;QACAC;QACA,GAAGE,KAAK;IACV;AACF,EAAE;AASK,gCAAgC,CAACN,OAAyBC;IAC/D,MAAM,EAAEO,WAAW,KAAK,EAAEC,OAAO,EAAE,GAAGJ,MAAM,GAAGL;IAC/C,MAAMU,gBAAYb,qBAAAA,EAAM;IAExB,OAAO;QACLW;QACAG,YAAY;YACVC,MAAM;YACNH,SAAS;QACX;QACAG,MAAMd,oBAAAA,CAAKe,MAAM,CACf;YACEC,MAAM;YACN,oBAAoBN,WAAW,aAAa;YAC5C,mBAAmBR,MAAMe,QAAQ,GAAGL,YAAYM;YAChDf,KAAKA;YACL,GAAGI,IAAI;QACT,GACA;YAAEY,aAAa;QAAM;QAEvBR,SAASX,oBAAAA,CAAKe,MAAM,CAACJ,SAAS;YAC5BS,cAAc;gBACZC,IAAIT;gBACJK,UAAUf,MAAMe,QAAQ;YAC1B;YACAE,aAAa;QACf;IACF;AACF,EAAE"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useDividerStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const dividerClassNames = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper'\n};\nconst contentSpacing = '12px';\nconst insetSpacing = '12px';\nconst maxStartEndLength = '8px';\nconst minStartEndLength = '8px;';\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 fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n textAlign: 'center',\n '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n },\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1\n }\n },\n // Childless styles\n childless: {\n '::before': {\n marginBottom: 0,\n marginRight: 0\n },\n '::after': {\n marginLeft: 0,\n marginTop: 0\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 // Appearance variations\n brand: {\n color: tokens.colorBrandForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorBrandStroke1)\n }\n },\n default: {\n color: tokens.colorNeutralForeground2,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n }\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3)\n }\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n }\n }\n});\nconst useHorizontalStyles = makeStyles({\n // Base styles\n base: {\n width: '100%',\n '::before': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n },\n '::after': {\n borderTopStyle: 'solid',\n borderTopWidth: tokens.strokeWidthThin,\n minWidth: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n paddingLeft: insetSpacing,\n paddingRight: insetSpacing\n },\n // Alignment variations\n start: {\n textAlign: 'left',\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n center: {\n textAlign: 'center',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n marginLeft: contentSpacing\n }\n },\n end: {\n textAlign: 'right',\n '::before': {\n marginRight: contentSpacing\n },\n '::after': {\n content: '\"\"',\n marginLeft: contentSpacing,\n maxWidth: maxStartEndLength\n }\n }\n});\nconst useVerticalStyles = makeStyles({\n // Base styles\n base: {\n flexDirection: 'column',\n minHeight: '20px',\n '::before': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n },\n '::after': {\n borderRightStyle: 'solid',\n borderRightWidth: tokens.strokeWidthThin,\n minHeight: minStartEndLength\n }\n },\n // Inset styles\n inset: {\n marginTop: insetSpacing,\n marginBottom: insetSpacing\n },\n // With children styles\n withChildren: {\n minHeight: '84px'\n },\n // Alignment variations\n start: {\n '::before': {\n content: '\"\"',\n marginBottom: contentSpacing,\n maxHeight: maxStartEndLength\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});\nexport const useDividerStyles_unstable = (state)=>{\n 'use no memo';\n const baseStyles = useBaseStyles();\n const horizontalStyles = useHorizontalStyles();\n const verticalStyles = useVerticalStyles();\n const { alignContent, appearance, inset, vertical } = state;\n state.root.className = mergeClasses(dividerClassNames.root, // Base styles\n baseStyles.base, baseStyles[alignContent], appearance && baseStyles[appearance], // Horizontal styles\n !vertical && horizontalStyles.base, !vertical && inset && horizontalStyles.inset, !vertical && horizontalStyles[alignContent], // Vertical styles\n vertical && verticalStyles.base, vertical && inset && verticalStyles.inset, vertical && verticalStyles[alignContent], vertical && state.root.children !== undefined && verticalStyles.withChildren, // Childless styles\n state.root.children === undefined && baseStyles.childless, // User provided class name\n state.root.className);\n if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n return state;\n};\n"],"names":["mergeClasses","shorthands","__styles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","Bt984gj","B7ck84d","mc9l5x","Beiy3e4","Bh6795r","qhf8xq","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","fsow6f","Bcvre1j","Br0sdwz","Bn78ew0","li1rpt","ap17g6","B771hl4","childless","susq4k","Bicfajf","jwcpgy","B4rk6o","start","Bsft5z2","center","Ftih45","end","brand","sj55zd","Bq4z7u6","Bk5zm6e","Bqjgrrk","Bm6vgfq","B0n5ga8","s924m2","B1q35kw","Gp14am","subtle","strong","d","useHorizontalStyles","a9b677","Bdkvgpv","B0qfbqy","pbipgd","Bm2nyyq","xrcqlc","i5u598","inset","uwmqm3","z189sj","Bxwl2t9","Iy66sp","useVerticalStyles","sshi5w","m598lv","B4f6apu","zkzzav","Barhvk9","Ihftqj","Bde111x","B6of3ja","jrapky","withChildren","Bbdr6tz","gn64ia","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Divider/useDividerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses, shorthands, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { DividerSlots, DividerState } from './Divider.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const dividerClassNames: SlotClassNames<DividerSlots> = {\n root: 'fui-Divider',\n wrapper: 'fui-Divider__wrapper',\n};\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 '::before': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\n },\n\n '::after': {\n boxSizing: 'border-box',\n display: 'flex',\n flexGrow: 1,\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 default: {\n color: tokens.colorNeutralForeground2,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n },\n subtle: {\n color: tokens.colorNeutralForeground3,\n\n '::before': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke3),\n },\n },\n strong: {\n color: tokens.colorNeutralForeground1,\n\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 textAlign: 'left',\n\n '::before': {\n content: '\"\"',\n marginRight: contentSpacing,\n maxWidth: maxStartEndLength,\n },\n\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n center: {\n textAlign: 'center',\n\n '::before': {\n marginRight: contentSpacing,\n },\n '::after': {\n marginLeft: contentSpacing,\n },\n },\n end: {\n textAlign: 'right',\n\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 'use no memo';\n\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 dividerClassNames.root,\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 if (state.wrapper) {\n state.wrapper.className = mergeClasses(dividerClassNames.wrapper, state.wrapper.className);\n }\n\n return state;\n};\n"],"names":["mergeClasses","shorthands","makeStyles","tokens","dividerClassNames","root","wrapper","contentSpacing","insetSpacing","maxStartEndLength","minStartEndLength","useBaseStyles","base","alignItems","boxSizing","display","flexDirection","flexGrow","position","fontFamily","fontFamilyBase","fontSize","fontSizeBase200","fontWeight","fontWeightRegular","lineHeight","lineHeightBase200","textAlign","childless","marginBottom","marginRight","marginLeft","marginTop","start","content","center","end","brand","color","colorBrandForeground1","borderColor","colorBrandStroke1","default","colorNeutralForeground2","colorNeutralStroke2","subtle","colorNeutralForeground3","colorNeutralStroke3","strong","colorNeutralForeground1","colorNeutralStroke1","useHorizontalStyles","width","borderTopStyle","borderTopWidth","strokeWidthThin","minWidth","inset","paddingLeft","paddingRight","maxWidth","useVerticalStyles","minHeight","borderRightStyle","borderRightWidth","withChildren","maxHeight","useDividerStyles_unstable","state","baseStyles","horizontalStyles","verticalStyles","alignContent","appearance","vertical","className","children","undefined"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Divider,\n dividerClassNames,\n renderDivider_unstable,\n useDividerStyles_unstable,\n useDivider_unstable,\n} from './Divider';\nexport type { DividerProps, DividerSlots, DividerState } from './Divider';\n\n// Experimental APIs - will be uncommented in the experimental release branch\nexport { useDividerBase_unstable } from './Divider';\nexport type { DividerBaseProps, DividerBaseState } from './Divider';\n"],"names":["Divider","dividerClassNames","renderDivider_unstable","useDividerStyles_unstable","useDivider_unstable","useDividerBase_unstable"],"mappings":";;;;;;;;;;;;eACEA,gBAAO;;;eACPC,0BAAiB;;;eACjBC,+BAAsB;;;eAOfG,gCAAuB,QAAQ,YAAY;;;eANlDF,kCAAyB;;;eACzBC,4BAAmB;;;yBACd,YAAY"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|