@fluentui/react-divider 9.0.0-alpha.9 → 9.0.0-nightly.46b9ea7036.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.json +1888 -1
- package/CHANGELOG.md +738 -2
- package/Spec.md +48 -53
- package/dist/react-divider.d.ts +28 -43
- package/lib/Divider.js.map +1 -1
- package/lib/common/isConformant.d.ts +3 -1
- package/lib/common/isConformant.js +7 -5
- package/lib/common/isConformant.js.map +1 -1
- package/lib/components/Divider/Divider.d.ts +3 -4
- package/lib/components/Divider/Divider.js +5 -5
- package/lib/components/Divider/Divider.js.map +1 -1
- package/lib/components/Divider/Divider.types.d.ts +25 -38
- package/lib/components/Divider/Divider.types.js +1 -0
- package/lib/components/Divider/Divider.types.js.map +1 -1
- package/lib/components/Divider/index.js +1 -0
- package/lib/components/Divider/index.js.map +1 -1
- package/lib/components/Divider/renderDivider.js +6 -4
- package/lib/components/Divider/renderDivider.js.map +1 -1
- package/lib/components/Divider/useDivider.d.ts +2 -7
- package/lib/components/Divider/useDivider.js +35 -17
- package/lib/components/Divider/useDivider.js.map +1 -1
- package/lib/components/Divider/useDividerStyles.d.ts +1 -1
- package/lib/components/Divider/useDividerStyles.js +143 -203
- package/lib/components/Divider/useDividerStyles.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/tsdoc-metadata.json +1 -1
- package/lib-commonjs/Divider.js +7 -2
- package/lib-commonjs/Divider.js.map +1 -1
- package/lib-commonjs/common/isConformant.d.ts +3 -1
- package/lib-commonjs/common/isConformant.js +17 -7
- package/lib-commonjs/common/isConformant.js.map +1 -1
- package/lib-commonjs/components/Divider/Divider.d.ts +3 -4
- package/lib-commonjs/components/Divider/Divider.js +19 -10
- package/lib-commonjs/components/Divider/Divider.js.map +1 -1
- package/lib-commonjs/components/Divider/Divider.types.d.ts +25 -38
- package/lib-commonjs/components/Divider/Divider.types.js +4 -1
- package/lib-commonjs/components/Divider/Divider.types.js.map +1 -1
- package/lib-commonjs/components/Divider/index.js +12 -2
- package/lib-commonjs/components/Divider/index.js.map +1 -1
- package/lib-commonjs/components/Divider/renderDivider.js +21 -9
- package/lib-commonjs/components/Divider/renderDivider.js.map +1 -1
- package/lib-commonjs/components/Divider/useDivider.d.ts +2 -7
- package/lib-commonjs/components/Divider/useDivider.js +45 -18
- package/lib-commonjs/components/Divider/useDivider.js.map +1 -1
- package/lib-commonjs/components/Divider/useDividerStyles.d.ts +1 -1
- package/lib-commonjs/components/Divider/useDividerStyles.js +151 -204
- package/lib-commonjs/components/Divider/useDividerStyles.js.map +1 -1
- package/lib-commonjs/index.js +7 -2
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +16 -12
- package/NOTICE.txt +0 -0
- package/config/api-extractor.json +0 -3
- package/config/tests.js +0 -7
- package/etc/react-divider.api.md +0 -45
- package/just.config.ts +0 -3
- package/lib-amd/Divider.d.ts +0 -1
- package/lib-amd/Divider.js +0 -6
- package/lib-amd/Divider.js.map +0 -1
- package/lib-amd/common/isConformant.d.ts +0 -2
- package/lib-amd/common/isConformant.js +0 -13
- package/lib-amd/common/isConformant.js.map +0 -1
- package/lib-amd/components/Divider/Divider.d.ts +0 -7
- package/lib-amd/components/Divider/Divider.js +0 -15
- package/lib-amd/components/Divider/Divider.js.map +0 -1
- package/lib-amd/components/Divider/Divider.types.d.ts +0 -48
- package/lib-amd/components/Divider/Divider.types.js +0 -5
- package/lib-amd/components/Divider/Divider.types.js.map +0 -1
- package/lib-amd/components/Divider/index.d.ts +0 -5
- package/lib-amd/components/Divider/index.js +0 -9
- package/lib-amd/components/Divider/index.js.map +0 -1
- package/lib-amd/components/Divider/renderDivider.d.ts +0 -5
- package/lib-amd/components/Divider/renderDivider.js +0 -13
- package/lib-amd/components/Divider/renderDivider.js.map +0 -1
- package/lib-amd/components/Divider/useDivider.d.ts +0 -13
- package/lib-amd/components/Divider/useDivider.js +0 -26
- package/lib-amd/components/Divider/useDivider.js.map +0 -1
- package/lib-amd/components/Divider/useDividerStyles.d.ts +0 -3
- package/lib-amd/components/Divider/useDividerStyles.js +0 -210
- package/lib-amd/components/Divider/useDividerStyles.js.map +0 -1
- package/lib-amd/index.d.ts +0 -1
- package/lib-amd/index.js +0 -6
- package/lib-amd/index.js.map +0 -1
- package/src/components/Divider/Divider.types.ts +0 -56
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA","sourceRoot":""}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-divider",
|
3
|
-
"version": "9.0.0-
|
3
|
+
"version": "9.0.0-nightly.46b9ea7036.0",
|
4
4
|
"description": "Fluent UI component to visually separate content.",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -13,18 +13,23 @@
|
|
13
13
|
"license": "MIT",
|
14
14
|
"scripts": {
|
15
15
|
"build": "just-scripts build",
|
16
|
+
"bundle-size": "bundle-size measure",
|
16
17
|
"clean": "just-scripts clean",
|
17
18
|
"code-style": "just-scripts code-style",
|
18
19
|
"just": "just-scripts",
|
19
20
|
"lint": "just-scripts lint",
|
20
|
-
"start": "
|
21
|
-
"
|
22
|
-
"
|
23
|
-
"
|
21
|
+
"start": "yarn storybook",
|
22
|
+
"test": "jest",
|
23
|
+
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
24
|
+
"build:local": "tsc -p . --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output dist/react-divider/src && yarn docs",
|
25
|
+
"storybook": "start-storybook"
|
24
26
|
},
|
25
27
|
"devDependencies": {
|
26
|
-
"@fluentui/
|
27
|
-
"@fluentui/
|
28
|
+
"@fluentui/babel-make-styles": "9.0.0-nightly.46b9ea7036.0",
|
29
|
+
"@fluentui/eslint-plugin": "*",
|
30
|
+
"@fluentui/jest-serializer-make-styles": "9.0.0-nightly.46b9ea7036.0",
|
31
|
+
"@fluentui/react-conformance": "*",
|
32
|
+
"@fluentui/react-conformance-make-styles": "9.0.0-nightly.46b9ea7036.0",
|
28
33
|
"@fluentui/scripts": "^1.0.0",
|
29
34
|
"@types/enzyme": "3.10.3",
|
30
35
|
"@types/enzyme-adapter-react-16": "1.0.3",
|
@@ -34,14 +39,13 @@
|
|
34
39
|
"enzyme": "~3.10.0",
|
35
40
|
"enzyme-adapter-react-16": "^1.15.0",
|
36
41
|
"react": "16.8.6",
|
37
|
-
"react-app-polyfill": "~1.0.1",
|
38
42
|
"react-dom": "16.8.6",
|
39
43
|
"react-test-renderer": "^16.3.0"
|
40
44
|
},
|
41
45
|
"dependencies": {
|
42
|
-
"@fluentui/react-make-styles": "
|
43
|
-
"@fluentui/react-utilities": "
|
44
|
-
"tslib": "^1.
|
46
|
+
"@fluentui/react-make-styles": "9.0.0-nightly.46b9ea7036.0",
|
47
|
+
"@fluentui/react-utilities": "9.0.0-nightly.46b9ea7036.0",
|
48
|
+
"tslib": "^2.1.0"
|
45
49
|
},
|
46
50
|
"peerDependencies": {
|
47
51
|
"@types/react": ">=16.8.0 <18.0.0",
|
@@ -50,7 +54,7 @@
|
|
50
54
|
"react-dom": ">=16.8.0 <18.0.0"
|
51
55
|
},
|
52
56
|
"beachball": {
|
53
|
-
"tag": "
|
57
|
+
"tag": "beta",
|
54
58
|
"disallowedChangeTypes": [
|
55
59
|
"major",
|
56
60
|
"minor",
|
package/NOTICE.txt
DELETED
File without changes
|
package/config/tests.js
DELETED
package/etc/react-divider.api.md
DELETED
@@ -1,45 +0,0 @@
|
|
1
|
-
## API Report File for "@fluentui/react-divider"
|
2
|
-
|
3
|
-
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
|
4
|
-
|
5
|
-
```ts
|
6
|
-
|
7
|
-
import { ComponentProps } from '@fluentui/react-utilities';
|
8
|
-
import * as React from 'react';
|
9
|
-
import { ShorthandProps } from '@fluentui/react-utilities';
|
10
|
-
|
11
|
-
// @public
|
12
|
-
export const Divider: React.ForwardRefExoticComponent<DividerProps & React.RefAttributes<HTMLElement>>;
|
13
|
-
|
14
|
-
// @public (undocumented)
|
15
|
-
export interface DividerProps extends ComponentProps, React.HTMLAttributes<HTMLElement> {
|
16
|
-
alignContent?: 'start' | 'end' | 'center';
|
17
|
-
appearance?: 'default' | 'subtle' | 'brand' | 'strong';
|
18
|
-
important?: boolean;
|
19
|
-
inset?: boolean;
|
20
|
-
vertical?: boolean;
|
21
|
-
wrapper?: ShorthandProps<React.HTMLAttributes<HTMLDivElement>>;
|
22
|
-
}
|
23
|
-
|
24
|
-
// @public
|
25
|
-
export const dividerShorthandProps: readonly ["wrapper", "children"];
|
26
|
-
|
27
|
-
// @public (undocumented)
|
28
|
-
export interface DividerState extends DividerProps {
|
29
|
-
labelledById?: string;
|
30
|
-
ref: React.RefObject<HTMLElement>;
|
31
|
-
}
|
32
|
-
|
33
|
-
// @public
|
34
|
-
export const renderDivider: (state: DividerState) => JSX.Element;
|
35
|
-
|
36
|
-
// @public
|
37
|
-
export const useDivider: (props: DividerProps, ref: React.Ref<HTMLElement>, defaultProps?: DividerProps | undefined) => DividerState;
|
38
|
-
|
39
|
-
// @public
|
40
|
-
export const useDividerStyles: (s: DividerState) => DividerState;
|
41
|
-
|
42
|
-
|
43
|
-
// (No @packageDocumentation comment for this package)
|
44
|
-
|
45
|
-
```
|
package/just.config.ts
DELETED
package/lib-amd/Divider.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/Divider/index';
|
package/lib-amd/Divider.js
DELETED
@@ -1,6 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "./components/Divider/index"], function (require, exports, tslib_1, index_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
tslib_1.__exportStar(index_1, exports);
|
5
|
-
});
|
6
|
-
//# sourceMappingURL=Divider.js.map
|
package/lib-amd/Divider.js.map
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"Divider.js","sourceRoot":"../src/","sources":["Divider.ts"],"names":[],"mappings":";;;IAAA,uCAA2C","sourcesContent":["export * from './components/Divider/index';\n"]}
|
@@ -1,13 +0,0 @@
|
|
1
|
-
define(["require", "exports", "@fluentui/react-conformance"], function (require, exports, react_conformance_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
function isConformant(testInfo) {
|
5
|
-
var defaultOptions = {
|
6
|
-
asPropHandlesRef: true,
|
7
|
-
componentPath: module.parent.filename.replace('.test', ''),
|
8
|
-
};
|
9
|
-
react_conformance_1.isConformant(defaultOptions, testInfo);
|
10
|
-
}
|
11
|
-
exports.isConformant = isConformant;
|
12
|
-
});
|
13
|
-
//# sourceMappingURL=isConformant.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"isConformant.js","sourceRoot":"../src/","sources":["common/isConformant.ts"],"names":[],"mappings":";;;IAEA,SAAgB,YAAY,CAAC,QAAoD;QAC/E,IAAM,cAAc,GAAG;YACrB,gBAAgB,EAAE,IAAI;YACtB,aAAa,EAAE,MAAO,CAAC,MAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC;SAC7D,CAAC;QAEF,gCAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;IAC7C,CAAC;IAPD,oCAOC","sourcesContent":["import { isConformant as baseIsConformant, IsConformantOptions } from '@fluentui/react-conformance';\n\nexport function isConformant(testInfo: Omit<IsConformantOptions, 'componentPath'>) {\n const defaultOptions = {\n asPropHandlesRef: true,\n componentPath: module!.parent!.filename.replace('.test', ''),\n };\n\n baseIsConformant(defaultOptions, testInfo);\n}\n"]}
|
@@ -1,7 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import { DividerProps } from './Divider.types';
|
3
|
-
/**
|
4
|
-
* Define a styled Divider, using the `useDivider` and `useDividerStyles` hooks.
|
5
|
-
* {@docCategory Divider}
|
6
|
-
*/
|
7
|
-
export declare const Divider: React.ForwardRefExoticComponent<DividerProps & React.RefAttributes<HTMLElement>>;
|
@@ -1,15 +0,0 @@
|
|
1
|
-
define(["require", "exports", "react", "./renderDivider", "./useDivider", "./useDividerStyles"], function (require, exports, React, renderDivider_1, useDivider_1, useDividerStyles_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
/**
|
5
|
-
* Define a styled Divider, using the `useDivider` and `useDividerStyles` hooks.
|
6
|
-
* {@docCategory Divider}
|
7
|
-
*/
|
8
|
-
exports.Divider = React.forwardRef(function (props, ref) {
|
9
|
-
var state = useDivider_1.useDivider(props, ref);
|
10
|
-
useDividerStyles_1.useDividerStyles(state);
|
11
|
-
return renderDivider_1.renderDivider(state);
|
12
|
-
});
|
13
|
-
exports.Divider.displayName = 'Divider';
|
14
|
-
});
|
15
|
-
//# sourceMappingURL=Divider.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"Divider.js","sourceRoot":"../src/","sources":["components/Divider/Divider.tsx"],"names":[],"mappings":";;;IAMA;;;OAGG;IACU,QAAA,OAAO,GAAG,KAAK,CAAC,UAAU,CAA4B,UAAC,KAAK,EAAE,GAAG;QAC5E,IAAM,KAAK,GAAG,uBAAU,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAErC,mCAAgB,CAAC,KAAK,CAAC,CAAC;QACxB,OAAO,6BAAa,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;IAEH,eAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import * as React from 'react';\nimport { DividerProps } from './Divider.types';\nimport { renderDivider } from './renderDivider';\nimport { useDivider } from './useDivider';\nimport { useDividerStyles } from './useDividerStyles';\n\n/**\n * Define a styled Divider, using the `useDivider` and `useDividerStyles` hooks.\n * {@docCategory Divider}\n */\nexport const Divider = React.forwardRef<HTMLElement, DividerProps>((props, ref) => {\n const state = useDivider(props, ref);\n\n useDividerStyles(state);\n return renderDivider(state);\n});\n\nDivider.displayName = 'Divider';\n"]}
|
@@ -1,48 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import { ComponentProps, ShorthandProps } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* {@docCategory Divider}
|
5
|
-
*/
|
6
|
-
export interface DividerProps extends ComponentProps, React.HTMLAttributes<HTMLElement> {
|
7
|
-
/**
|
8
|
-
* Determines the alignment of the content within the divider.
|
9
|
-
* @defaultvalue 'center'
|
10
|
-
*/
|
11
|
-
alignContent?: 'start' | 'end' | 'center';
|
12
|
-
/**
|
13
|
-
* Predefined visual styles
|
14
|
-
* @defaultvalue 'default'
|
15
|
-
*/
|
16
|
-
appearance?: 'default' | 'subtle' | 'brand' | 'strong';
|
17
|
-
/**
|
18
|
-
* A divider can be classified as important to emphasize its content
|
19
|
-
*/
|
20
|
-
important?: boolean;
|
21
|
-
/**
|
22
|
-
* Adds a 12px padding to the begining and end of the divider
|
23
|
-
*/
|
24
|
-
inset?: boolean;
|
25
|
-
/**
|
26
|
-
* A divider can be horizontal (default) or vertical*/
|
27
|
-
vertical?: boolean;
|
28
|
-
/**
|
29
|
-
* Accessibility wrapper for content when presented.
|
30
|
-
* A shorthand prop can be a literal, object, or
|
31
|
-
* JSX. The `children` prop of the object can be a render function,
|
32
|
-
* taking in the original slot component and props.
|
33
|
-
*/
|
34
|
-
wrapper?: ShorthandProps<React.HTMLAttributes<HTMLDivElement>>;
|
35
|
-
}
|
36
|
-
/**
|
37
|
-
* {@docCategory Divider}
|
38
|
-
*/
|
39
|
-
export interface DividerState extends DividerProps {
|
40
|
-
/**
|
41
|
-
* Ref to the root slot
|
42
|
-
*/
|
43
|
-
ref: React.RefObject<HTMLElement>;
|
44
|
-
/**
|
45
|
-
* The Id created to expose accessability for readers
|
46
|
-
*/
|
47
|
-
labelledById?: string;
|
48
|
-
}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"Divider.types.js","sourceRoot":"../src/","sources":["components/Divider/Divider.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ComponentProps, ShorthandProps } from '@fluentui/react-utilities';\n\n/**\n * {@docCategory Divider}\n */\nexport interface DividerProps extends ComponentProps, React.HTMLAttributes<HTMLElement> {\n /**\n * Determines the alignment of the content within the divider.\n * @defaultvalue 'center'\n */\n alignContent?: 'start' | 'end' | 'center';\n\n /**\n * Predefined visual styles\n * @defaultvalue 'default'\n */\n appearance?: 'default' | 'subtle' | 'brand' | 'strong';\n\n /**\n * A divider can be classified as important to emphasize its content\n */\n important?: boolean;\n\n /**\n * Adds a 12px padding to the begining and end of the divider\n */\n inset?: boolean;\n\n /**\n * A divider can be horizontal (default) or vertical*/\n vertical?: boolean;\n\n /**\n * Accessibility wrapper for content when presented.\n * A shorthand prop can be a literal, object, or\n * JSX. The `children` prop of the object can be a render function,\n * taking in the original slot component and props.\n */\n wrapper?: ShorthandProps<React.HTMLAttributes<HTMLDivElement>>;\n}\n\n/**\n * {@docCategory Divider}\n */\nexport interface DividerState extends DividerProps {\n /**\n * Ref to the root slot\n */\n ref: React.RefObject<HTMLElement>;\n\n /**\n * The Id created to expose accessability for readers\n */\n labelledById?: string;\n}\n"]}
|
@@ -1,9 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "./Divider", "./renderDivider", "./useDivider", "./useDividerStyles"], function (require, exports, tslib_1, Divider_1, renderDivider_1, useDivider_1, useDividerStyles_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
tslib_1.__exportStar(Divider_1, exports);
|
5
|
-
tslib_1.__exportStar(renderDivider_1, exports);
|
6
|
-
tslib_1.__exportStar(useDivider_1, exports);
|
7
|
-
tslib_1.__exportStar(useDividerStyles_1, exports);
|
8
|
-
});
|
9
|
-
//# sourceMappingURL=index.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Divider/index.ts"],"names":[],"mappings":";;;IAAA,yCAA0B;IAE1B,+CAAgC;IAChC,4CAA6B;IAC7B,kDAAmC","sourcesContent":["export * from './Divider';\nexport * from './Divider.types';\nexport * from './renderDivider';\nexport * from './useDivider';\nexport * from './useDividerStyles';\n"]}
|
@@ -1,13 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "./useDivider"], function (require, exports, tslib_1, React, react_utilities_1, useDivider_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
/**
|
5
|
-
* Function that renders the final JSX of the component
|
6
|
-
*/
|
7
|
-
exports.renderDivider = function (state) {
|
8
|
-
var _a = react_utilities_1.getSlots(state, useDivider_1.dividerShorthandProps), slots = _a.slots, slotProps = _a.slotProps;
|
9
|
-
var children = state.children;
|
10
|
-
return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root, { role: "separator" }), children !== undefined && React.createElement(slots.wrapper, tslib_1.__assign({}, slotProps.wrapper))));
|
11
|
-
};
|
12
|
-
});
|
13
|
-
//# sourceMappingURL=renderDivider.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"renderDivider.js","sourceRoot":"../src/","sources":["components/Divider/renderDivider.tsx"],"names":[],"mappings":";;;IAKA;;OAEG;IACU,QAAA,aAAa,GAAG,UAAC,KAAmB;QACzC,IAAA,0EAA6D,EAA3D,gBAAK,EAAE,wBAAoD,CAAC;QAC5D,IAAA,yBAAQ,CAAW;QAE3B,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,IAAE,IAAI,EAAC,WAAW,KAC7C,QAAQ,KAAK,SAAS,IAAI,oBAAC,KAAK,CAAC,OAAO,uBAAK,SAAS,CAAC,OAAO,EAAI,CACxD,CACd,CAAC;IACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { DividerState } from './Divider.types';\nimport { dividerShorthandProps } from './useDivider';\n\n/**\n * Function that renders the final JSX of the component\n */\nexport const renderDivider = (state: DividerState) => {\n const { slots, slotProps } = getSlots(state, dividerShorthandProps);\n const { children } = state;\n\n return (\n <slots.root {...slotProps.root} role=\"separator\">\n {children !== undefined && <slots.wrapper {...slotProps.wrapper} />}\n </slots.root>\n );\n};\n"]}
|
@@ -1,13 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import { DividerProps, DividerState } from './Divider.types';
|
3
|
-
/**
|
4
|
-
* Consts listing which props are shorthand props.
|
5
|
-
*/
|
6
|
-
export declare const dividerShorthandProps: readonly ["wrapper", "children"];
|
7
|
-
/**
|
8
|
-
* Returns the props and state required to render the component
|
9
|
-
* @param props - Divider properties
|
10
|
-
* @param ref - reference to root HTMLElement of Divider
|
11
|
-
* @param defaultProps - default values for the properties of Divider
|
12
|
-
*/
|
13
|
-
export declare const useDivider: (props: DividerProps, ref: React.Ref<HTMLElement>, defaultProps?: DividerProps | undefined) => DividerState;
|
@@ -1,26 +0,0 @@
|
|
1
|
-
define(["require", "exports", "react", "@fluentui/react-utilities"], function (require, exports, React, react_utilities_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
/**
|
5
|
-
* Consts listing which props are shorthand props.
|
6
|
-
*/
|
7
|
-
exports.dividerShorthandProps = ['wrapper', 'children'];
|
8
|
-
var mergeProps = react_utilities_1.makeMergeProps({ deepMerge: exports.dividerShorthandProps });
|
9
|
-
/**
|
10
|
-
* Returns the props and state required to render the component
|
11
|
-
* @param props - Divider properties
|
12
|
-
* @param ref - reference to root HTMLElement of Divider
|
13
|
-
* @param defaultProps - default values for the properties of Divider
|
14
|
-
*/
|
15
|
-
exports.useDivider = function (props, ref, defaultProps) {
|
16
|
-
var dividerId = react_utilities_1.useId('divider-');
|
17
|
-
var state = mergeProps({
|
18
|
-
ref: react_utilities_1.useMergedRefs(ref, React.useRef(null)),
|
19
|
-
/* The Id created to expose accessibility for readers */
|
20
|
-
'aria-labelledby': props.children ? dividerId : undefined,
|
21
|
-
wrapper: { as: 'div', children: props.children, id: dividerId },
|
22
|
-
}, defaultProps && react_utilities_1.resolveShorthandProps(defaultProps, exports.dividerShorthandProps), react_utilities_1.resolveShorthandProps(props, exports.dividerShorthandProps));
|
23
|
-
return state;
|
24
|
-
};
|
25
|
-
});
|
26
|
-
//# sourceMappingURL=useDivider.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"useDivider.js","sourceRoot":"../src/","sources":["components/Divider/useDivider.ts"],"names":[],"mappings":";;;IAIA;;OAEG;IACU,QAAA,qBAAqB,GAAG,CAAC,SAAS,EAAE,UAAU,CAAU,CAAC;IAEtE,IAAM,UAAU,GAAG,gCAAc,CAAe,EAAE,SAAS,EAAE,6BAAqB,EAAE,CAAC,CAAC;IAEtF;;;;;OAKG;IACU,QAAA,UAAU,GAAG,UACxB,KAAmB,EACnB,GAA2B,EAC3B,YAA2B;QAE3B,IAAM,SAAS,GAAG,uBAAK,CAAC,UAAU,CAAC,CAAC;QACpC,IAAM,KAAK,GAAG,UAAU,CACtB;YACE,GAAG,EAAE,+BAAa,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;YAC3C,wDAAwD;YACxD,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YACzD,OAAO,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,EAAE,SAAS,EAAE;SAChE,EACD,YAAY,IAAI,uCAAqB,CAAC,YAAY,EAAE,6BAAqB,CAAC,EAC1E,uCAAqB,CAAC,KAAK,EAAE,6BAAqB,CAAC,CACpD,CAAC;QAEF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { makeMergeProps, resolveShorthandProps, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport { DividerProps, DividerState } from './Divider.types';\n\n/**\n * Consts listing which props are shorthand props.\n */\nexport const dividerShorthandProps = ['wrapper', 'children'] as const;\n\nconst mergeProps = makeMergeProps<DividerState>({ deepMerge: dividerShorthandProps });\n\n/**\n * Returns the props and state required to render the component\n * @param props - Divider properties\n * @param ref - reference to root HTMLElement of Divider\n * @param defaultProps - default values for the properties of Divider\n */\nexport const useDivider = (\n props: DividerProps,\n ref: React.Ref<HTMLElement>,\n defaultProps?: DividerProps,\n): DividerState => {\n const dividerId = useId('divider-');\n const state = mergeProps(\n {\n ref: useMergedRefs(ref, React.useRef(null)),\n /* The Id created to expose accessibility for readers */\n 'aria-labelledby': props.children ? dividerId : undefined,\n wrapper: { as: 'div', children: props.children, id: dividerId },\n },\n defaultProps && resolveShorthandProps(defaultProps, dividerShorthandProps),\n resolveShorthandProps(props, dividerShorthandProps),\n );\n\n return state;\n};\n"]}
|
@@ -1,210 +0,0 @@
|
|
1
|
-
define(["require", "exports", "@fluentui/react-make-styles"], function (require, exports, react_make_styles_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
var useStylesOverride = react_make_styles_1.makeStyles({
|
5
|
-
root: function (tokens) { return ({
|
6
|
-
/* CSS Vars */
|
7
|
-
'--divider-borderMargin': '12px',
|
8
|
-
'--divider-flexDirection': 'row',
|
9
|
-
'--divider-fontColor': tokens.alias.color.neutral.neutralForeground2,
|
10
|
-
'--divider-fontFamily': 'Segoe UI',
|
11
|
-
'--divider-fontSize': '12px',
|
12
|
-
'--divider-fontWeight': '400',
|
13
|
-
'--divider-lineHeight': '17px',
|
14
|
-
'--divider-borderSize': '1px',
|
15
|
-
'--divider-borderStyle': 'solid',
|
16
|
-
'--divider-color': tokens.alias.color.neutral.neutralStroke2,
|
17
|
-
alignItems: 'center',
|
18
|
-
color: 'var(--divider-fontColor)',
|
19
|
-
display: 'flex',
|
20
|
-
flexGrow: 1,
|
21
|
-
flexDirection: 'var(--divider-flexDirection)',
|
22
|
-
fontFamily: 'var(--divider-fontFamily)',
|
23
|
-
fontSize: 'var(--divider-fontSize)',
|
24
|
-
fontWeight: 'var(--divider-fontWeight)',
|
25
|
-
position: 'relative',
|
26
|
-
boxSizing: 'border-box',
|
27
|
-
lineHeight: 'var(--divider-lineHeight)',
|
28
|
-
':before': {
|
29
|
-
display: 'flex',
|
30
|
-
flexGrow: 1,
|
31
|
-
boxSizing: 'border-box',
|
32
|
-
},
|
33
|
-
':after': {
|
34
|
-
display: 'flex',
|
35
|
-
flexGrow: 1,
|
36
|
-
boxSizing: 'border-box',
|
37
|
-
},
|
38
|
-
}); },
|
39
|
-
childless: {
|
40
|
-
'--divider-borderMargin': 0,
|
41
|
-
},
|
42
|
-
subtle: function (tokens) { return ({
|
43
|
-
'--divider-color': tokens.alias.color.neutral.neutralStroke3,
|
44
|
-
}); },
|
45
|
-
brand: function (tokens) { return ({
|
46
|
-
'--divider-fontColor': tokens.alias.color.brand.brandBackgroundStatic,
|
47
|
-
'--divider-color': tokens.alias.color.brand.brandBackgroundStatic,
|
48
|
-
}); },
|
49
|
-
strong: function (tokens) { return ({
|
50
|
-
'--divider-color': tokens.alias.color.neutral.neutralStroke1,
|
51
|
-
}); },
|
52
|
-
horizontal: {
|
53
|
-
width: '100%',
|
54
|
-
':before': {
|
55
|
-
borderTopColor: 'var(--divider-color)',
|
56
|
-
borderTopWidth: 'var(--divider-borderSize)',
|
57
|
-
borderTopStyle: 'var(--divider-borderStyle)',
|
58
|
-
},
|
59
|
-
':after': {
|
60
|
-
borderTopColor: 'var(--divider-color)',
|
61
|
-
borderTopWidth: 'var(--divider-borderSize)',
|
62
|
-
borderTopStyle: 'var(--divider-borderStyle)',
|
63
|
-
},
|
64
|
-
'&>:only-child': {
|
65
|
-
display: 'flex',
|
66
|
-
textAlign: 'center',
|
67
|
-
},
|
68
|
-
},
|
69
|
-
vertical: {
|
70
|
-
//alignSelf: 'stretch',
|
71
|
-
minHeight: '20px',
|
72
|
-
flexDirection: 'column',
|
73
|
-
':before': {
|
74
|
-
borderRightColor: 'var(--divider-color)',
|
75
|
-
borderRightWidth: 'var(--divider-borderSize)',
|
76
|
-
borderRightStyle: 'var(--divider-borderStyle)',
|
77
|
-
},
|
78
|
-
':after': {
|
79
|
-
borderRightColor: 'var(--divider-color)',
|
80
|
-
borderRightWidth: 'var(--divider-borderSize)',
|
81
|
-
borderRightStyle: 'var(--divider-borderStyle)',
|
82
|
-
},
|
83
|
-
'&>:only-child': {
|
84
|
-
display: 'flex',
|
85
|
-
textAlign: 'center',
|
86
|
-
},
|
87
|
-
},
|
88
|
-
verticalWithChildren: {
|
89
|
-
minHeight: '84px',
|
90
|
-
},
|
91
|
-
start: {
|
92
|
-
':after': {
|
93
|
-
content: '""',
|
94
|
-
},
|
95
|
-
},
|
96
|
-
end: {
|
97
|
-
':before': {
|
98
|
-
content: '""',
|
99
|
-
},
|
100
|
-
},
|
101
|
-
center: {
|
102
|
-
':before': {
|
103
|
-
content: '""',
|
104
|
-
},
|
105
|
-
':after': {
|
106
|
-
content: '""',
|
107
|
-
},
|
108
|
-
},
|
109
|
-
centerWithoutContent: {
|
110
|
-
':before': {
|
111
|
-
content: '""',
|
112
|
-
},
|
113
|
-
},
|
114
|
-
verticalStart: {
|
115
|
-
':before': {
|
116
|
-
content: '""',
|
117
|
-
maxHeight: '8px',
|
118
|
-
marginBottom: 'var(--divider-borderMargin)',
|
119
|
-
},
|
120
|
-
':after': {
|
121
|
-
marginTop: 'var(--divider-borderMargin)',
|
122
|
-
},
|
123
|
-
},
|
124
|
-
verticalEnd: {
|
125
|
-
':before': {
|
126
|
-
marginBottom: 'var(--divider-borderMargin)',
|
127
|
-
},
|
128
|
-
':after': {
|
129
|
-
content: '""',
|
130
|
-
maxHeight: '8px',
|
131
|
-
marginTop: 'var(--divider-borderMargin)',
|
132
|
-
},
|
133
|
-
},
|
134
|
-
verticalCenter: {
|
135
|
-
':before': {
|
136
|
-
marginBottom: 'var(--divider-borderMargin)',
|
137
|
-
},
|
138
|
-
':after': {
|
139
|
-
marginTop: 'var(--divider-borderMargin)',
|
140
|
-
},
|
141
|
-
},
|
142
|
-
horizontalStart: {
|
143
|
-
':before': {
|
144
|
-
marginRight: 'var(--divider-borderMargin)',
|
145
|
-
maxWidth: '8px',
|
146
|
-
content: '""',
|
147
|
-
},
|
148
|
-
':after': {
|
149
|
-
marginLeft: 'var(--divider-borderMargin)',
|
150
|
-
},
|
151
|
-
},
|
152
|
-
horizontalEnd: {
|
153
|
-
':before': {
|
154
|
-
marginRight: 'var(--divider-borderMargin)',
|
155
|
-
},
|
156
|
-
':after': {
|
157
|
-
maxWidth: '8px',
|
158
|
-
content: '""',
|
159
|
-
marginLeft: 'var(--divider-borderMargin)',
|
160
|
-
},
|
161
|
-
},
|
162
|
-
horizontalCenter: {
|
163
|
-
':before': {
|
164
|
-
marginRight: 'var(--divider-borderMargin)',
|
165
|
-
},
|
166
|
-
':after': {
|
167
|
-
marginLeft: 'var(--divider-borderMargin)',
|
168
|
-
},
|
169
|
-
},
|
170
|
-
important: {
|
171
|
-
'--divider-fontWeight': "700",
|
172
|
-
},
|
173
|
-
verticalColored: {
|
174
|
-
':before': {
|
175
|
-
borderRightColor: 'var(--divider-color)',
|
176
|
-
},
|
177
|
-
':after': {
|
178
|
-
borderRightColor: 'var(--divider-color)',
|
179
|
-
},
|
180
|
-
},
|
181
|
-
horizontalColored: {
|
182
|
-
':before': {
|
183
|
-
borderTopColor: 'var(--divider-color)',
|
184
|
-
},
|
185
|
-
':after': {
|
186
|
-
borderTopColor: 'var(--divider-color)',
|
187
|
-
},
|
188
|
-
},
|
189
|
-
verticalChildless: {
|
190
|
-
':before': {
|
191
|
-
marginBottom: 0,
|
192
|
-
},
|
193
|
-
},
|
194
|
-
inset: {
|
195
|
-
paddingLeft: '12px',
|
196
|
-
paddingRight: '12px',
|
197
|
-
},
|
198
|
-
verticalInset: {
|
199
|
-
marginTop: '12px',
|
200
|
-
marginBottom: '12px',
|
201
|
-
},
|
202
|
-
});
|
203
|
-
/** Applies style classnames to slots */
|
204
|
-
exports.useDividerStyles = function (s) {
|
205
|
-
var styles = useStylesOverride();
|
206
|
-
s.className = react_make_styles_1.ax(styles.root, !s.children && styles.childless, s.appearance === 'subtle' && styles.subtle, s.appearance === 'brand' && styles.brand, s.appearance === 'strong' && styles.strong, s.vertical ? styles.vertical : styles.horizontal, s.vertical && s.children !== undefined && styles.verticalWithChildren, s.alignContent === 'start' && styles.start, s.alignContent === 'end' && styles.end, (s.alignContent === 'center' || !s.alignContent) && s.children !== undefined && s.vertical && styles.center, (s.alignContent === 'center' || !s.alignContent) && s.children !== undefined && !s.vertical && styles.center, (s.alignContent === 'center' || !s.alignContent) && s.children === undefined && styles.centerWithoutContent, s.alignContent === 'start' && (s.vertical ? styles.verticalStart : styles.horizontalStart), s.alignContent === 'end' && (s.vertical ? styles.verticalEnd : styles.horizontalEnd), (s.alignContent === 'center' || !s.alignContent) && (s.vertical ? styles.verticalCenter : styles.horizontalCenter), s.important && styles.important, s.color && (s.vertical ? styles.verticalColored : styles.horizontalColored), s.children === undefined && s.vertical && styles.verticalChildless, s.inset && (s.vertical ? styles.verticalInset : styles.inset), s.className);
|
207
|
-
return s;
|
208
|
-
};
|
209
|
-
});
|
210
|
-
//# sourceMappingURL=useDividerStyles.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"useDividerStyles.js","sourceRoot":"../src/","sources":["components/Divider/useDividerStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { ax, makeStyles } from '@fluentui/react-make-styles';\nimport { DividerState } from './Divider.types';\n\nconst useStylesOverride = makeStyles({\n root: tokens => ({\n /* CSS Vars */\n '--divider-borderMargin': '12px',\n '--divider-flexDirection': 'row',\n '--divider-fontColor': tokens.alias.color.neutral.neutralForeground2,\n '--divider-fontFamily': 'Segoe UI',\n '--divider-fontSize': '12px',\n '--divider-fontWeight': '400',\n '--divider-lineHeight': '17px',\n '--divider-borderSize': '1px',\n '--divider-borderStyle': 'solid',\n '--divider-color': tokens.alias.color.neutral.neutralStroke2,\n\n alignItems: 'center',\n color: 'var(--divider-fontColor)',\n display: 'flex',\n flexGrow: 1,\n flexDirection: 'var(--divider-flexDirection)',\n fontFamily: 'var(--divider-fontFamily)',\n fontSize: 'var(--divider-fontSize)',\n fontWeight: 'var(--divider-fontWeight)',\n position: 'relative',\n boxSizing: 'border-box',\n lineHeight: 'var(--divider-lineHeight)',\n ':before': {\n display: 'flex',\n flexGrow: 1,\n boxSizing: 'border-box',\n },\n\n ':after': {\n display: 'flex',\n flexGrow: 1,\n boxSizing: 'border-box',\n },\n }),\n childless: {\n '--divider-borderMargin': 0,\n },\n subtle: tokens => ({\n '--divider-color': tokens.alias.color.neutral.neutralStroke3,\n }),\n brand: tokens => ({\n '--divider-fontColor': tokens.alias.color.brand.brandBackgroundStatic,\n '--divider-color': tokens.alias.color.brand.brandBackgroundStatic,\n }),\n strong: tokens => ({\n '--divider-color': tokens.alias.color.neutral.neutralStroke1,\n }),\n horizontal: {\n width: '100%',\n ':before': {\n borderTopColor: 'var(--divider-color)',\n borderTopWidth: 'var(--divider-borderSize)',\n borderTopStyle: 'var(--divider-borderStyle)',\n },\n ':after': {\n borderTopColor: 'var(--divider-color)',\n borderTopWidth: 'var(--divider-borderSize)',\n borderTopStyle: 'var(--divider-borderStyle)',\n },\n '&>:only-child': {\n display: 'flex',\n textAlign: 'center',\n },\n },\n vertical: {\n //alignSelf: 'stretch',\n minHeight: '20px',\n flexDirection: 'column',\n ':before': {\n borderRightColor: 'var(--divider-color)',\n borderRightWidth: 'var(--divider-borderSize)',\n borderRightStyle: 'var(--divider-borderStyle)',\n },\n ':after': {\n borderRightColor: 'var(--divider-color)',\n borderRightWidth: 'var(--divider-borderSize)',\n borderRightStyle: 'var(--divider-borderStyle)',\n },\n '&>:only-child': {\n display: 'flex',\n textAlign: 'center',\n },\n },\n verticalWithChildren: {\n minHeight: '84px',\n },\n start: {\n ':after': {\n content: '\"\"',\n },\n },\n end: {\n ':before': {\n content: '\"\"',\n },\n },\n center: {\n ':before': {\n content: '\"\"',\n },\n ':after': {\n content: '\"\"',\n },\n },\n centerWithoutContent: {\n ':before': {\n content: '\"\"',\n },\n },\n verticalStart: {\n ':before': {\n content: '\"\"',\n maxHeight: '8px',\n marginBottom: 'var(--divider-borderMargin)',\n },\n\n ':after': {\n marginTop: 'var(--divider-borderMargin)',\n },\n },\n verticalEnd: {\n ':before': {\n marginBottom: 'var(--divider-borderMargin)',\n },\n ':after': {\n content: '\"\"',\n maxHeight: '8px',\n marginTop: 'var(--divider-borderMargin)',\n },\n },\n verticalCenter: {\n ':before': {\n marginBottom: 'var(--divider-borderMargin)',\n },\n ':after': {\n marginTop: 'var(--divider-borderMargin)',\n },\n },\n horizontalStart: {\n ':before': {\n marginRight: 'var(--divider-borderMargin)',\n maxWidth: '8px',\n content: '\"\"',\n },\n ':after': {\n marginLeft: 'var(--divider-borderMargin)',\n },\n },\n horizontalEnd: {\n ':before': {\n marginRight: 'var(--divider-borderMargin)',\n },\n ':after': {\n maxWidth: '8px',\n content: '\"\"',\n marginLeft: 'var(--divider-borderMargin)',\n },\n },\n horizontalCenter: {\n ':before': {\n marginRight: 'var(--divider-borderMargin)',\n },\n ':after': {\n marginLeft: 'var(--divider-borderMargin)',\n },\n },\n important: {\n '--divider-fontWeight': `700`,\n },\n verticalColored: {\n ':before': {\n borderRightColor: 'var(--divider-color)',\n },\n ':after': {\n borderRightColor: 'var(--divider-color)',\n },\n },\n horizontalColored: {\n ':before': {\n borderTopColor: 'var(--divider-color)',\n },\n ':after': {\n borderTopColor: 'var(--divider-color)',\n },\n },\n verticalChildless: {\n ':before': {\n marginBottom: 0,\n },\n },\n inset: {\n paddingLeft: '12px',\n paddingRight: '12px',\n },\n verticalInset: {\n marginTop: '12px',\n marginBottom: '12px',\n },\n});\n\n/** Applies style classnames to slots */\nexport const useDividerStyles = (s: DividerState) => {\n const styles = useStylesOverride();\n s.className = ax(\n styles.root,\n !s.children && styles.childless,\n s.appearance === 'subtle' && styles.subtle,\n s.appearance === 'brand' && styles.brand,\n s.appearance === 'strong' && styles.strong,\n s.vertical ? styles.vertical : styles.horizontal,\n s.vertical && s.children !== undefined && styles.verticalWithChildren,\n s.alignContent === 'start' && styles.start,\n s.alignContent === 'end' && styles.end,\n (s.alignContent === 'center' || !s.alignContent) && s.children !== undefined && s.vertical && styles.center,\n (s.alignContent === 'center' || !s.alignContent) && s.children !== undefined && !s.vertical && styles.center,\n (s.alignContent === 'center' || !s.alignContent) && s.children === undefined && styles.centerWithoutContent,\n s.alignContent === 'start' && (s.vertical ? styles.verticalStart : styles.horizontalStart),\n s.alignContent === 'end' && (s.vertical ? styles.verticalEnd : styles.horizontalEnd),\n (s.alignContent === 'center' || !s.alignContent) && (s.vertical ? styles.verticalCenter : styles.horizontalCenter),\n s.important && styles.important,\n s.color && (s.vertical ? styles.verticalColored : styles.horizontalColored),\n s.children === undefined && s.vertical && styles.verticalChildless,\n s.inset && (s.vertical ? styles.verticalInset : styles.inset),\n s.className,\n );\n\n return s;\n};\n"]}
|
package/lib-amd/index.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './Divider';
|
package/lib-amd/index.js
DELETED
package/lib-amd/index.js.map
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;IAAA,yCAA0B","sourcesContent":["export * from './Divider';\n"]}
|