@fluentui/react-label 0.0.0-nightly-20220519-0420.1 → 0.0.0-nightly-20220526-0422.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +65 -9
- package/CHANGELOG.md +28 -7
- package/dist/index.d.ts +4 -9
- package/lib/components/Label/Label.types.js.map +1 -1
- package/lib/components/Label/useLabel.js +2 -2
- package/lib/components/Label/useLabel.js.map +1 -1
- package/lib/components/Label/useLabelStyles.js +2 -7
- package/lib/components/Label/useLabelStyles.js.map +1 -1
- package/lib/index.js +1 -2
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Label/useLabel.js +2 -2
- package/lib-commonjs/components/Label/useLabel.js.map +1 -1
- package/lib-commonjs/components/Label/useLabelStyles.js +3 -8
- package/lib-commonjs/components/Label/useLabelStyles.js.map +1 -1
- package/lib-commonjs/index.js +1 -8
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +5 -5
package/CHANGELOG.json
CHANGED
@@ -2,9 +2,59 @@
|
|
2
2
|
"name": "@fluentui/react-label",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "Thu,
|
6
|
-
"tag": "@fluentui/react-label_v0.0.0-nightly-
|
7
|
-
"version": "0.0.0-nightly-
|
5
|
+
"date": "Thu, 26 May 2022 04:32:14 GMT",
|
6
|
+
"tag": "@fluentui/react-label_v0.0.0-nightly-20220526-0422.1",
|
7
|
+
"version": "0.0.0-nightly-20220526-0422.1",
|
8
|
+
"comments": {
|
9
|
+
"prerelease": [
|
10
|
+
{
|
11
|
+
"author": "esteban.230@hotmail.com",
|
12
|
+
"package": "@fluentui/react-label",
|
13
|
+
"commit": "a83d94f03515a893750637eb4e8e97d24dd2d915",
|
14
|
+
"comment": "Renaming strong prop to weight to align with Text."
|
15
|
+
}
|
16
|
+
],
|
17
|
+
"none": [
|
18
|
+
{
|
19
|
+
"author": "olfedias@microsoft.com",
|
20
|
+
"package": "@fluentui/react-label",
|
21
|
+
"commit": "f3f38785ed2cd5fda98b03672d6e7ba70c05b5da",
|
22
|
+
"comment": "remove a notice about unstable"
|
23
|
+
}
|
24
|
+
]
|
25
|
+
}
|
26
|
+
},
|
27
|
+
{
|
28
|
+
"date": "Mon, 23 May 2022 18:56:45 GMT",
|
29
|
+
"tag": "@fluentui/react-label_v9.0.0-rc.3",
|
30
|
+
"version": "9.0.0-rc.3",
|
31
|
+
"comments": {
|
32
|
+
"prerelease": [
|
33
|
+
{
|
34
|
+
"author": "esteban.230@hotmail.com",
|
35
|
+
"package": "@fluentui/react-label",
|
36
|
+
"commit": "5ed22515a7542b432ed694f22606ac3718d501cb",
|
37
|
+
"comment": "Removing <componentName>ClassName exports."
|
38
|
+
},
|
39
|
+
{
|
40
|
+
"author": "beachball",
|
41
|
+
"package": "@fluentui/react-label",
|
42
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.9",
|
43
|
+
"commit": "d4f80b17690e962d6a24e68959608d1ffe84aef6"
|
44
|
+
},
|
45
|
+
{
|
46
|
+
"author": "beachball",
|
47
|
+
"package": "@fluentui/react-label",
|
48
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.7",
|
49
|
+
"commit": "d4f80b17690e962d6a24e68959608d1ffe84aef6"
|
50
|
+
}
|
51
|
+
]
|
52
|
+
}
|
53
|
+
},
|
54
|
+
{
|
55
|
+
"date": "Mon, 23 May 2022 12:14:19 GMT",
|
56
|
+
"tag": "@fluentui/react-label_v9.0.0-rc.2",
|
57
|
+
"version": "9.0.0-rc.2",
|
8
58
|
"comments": {
|
9
59
|
"prerelease": [
|
10
60
|
{
|
@@ -25,6 +75,12 @@
|
|
25
75
|
"commit": "6b3b09b6f05e6a17a578a65fc36b606e3004efe9",
|
26
76
|
"comment": "Removing commons type from Label."
|
27
77
|
},
|
78
|
+
{
|
79
|
+
"author": "olfedias@microsoft.com",
|
80
|
+
"package": "@fluentui/react-label",
|
81
|
+
"commit": "60804cec07a495b8a5d1fc66338bf0443b212144",
|
82
|
+
"comment": "chore: Update Griffel to latest version"
|
83
|
+
},
|
28
84
|
{
|
29
85
|
"author": "olfedias@microsoft.com",
|
30
86
|
"package": "@fluentui/react-label",
|
@@ -34,20 +90,20 @@
|
|
34
90
|
{
|
35
91
|
"author": "beachball",
|
36
92
|
"package": "@fluentui/react-label",
|
37
|
-
"comment": "Bump @fluentui/react-theme to
|
38
|
-
"commit": "
|
93
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.8",
|
94
|
+
"commit": "8d58f08997acf595e3eb7f628123e7fa7830c394"
|
39
95
|
},
|
40
96
|
{
|
41
97
|
"author": "beachball",
|
42
98
|
"package": "@fluentui/react-label",
|
43
|
-
"comment": "Bump @fluentui/react-utilities to
|
44
|
-
"commit": "
|
99
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.9",
|
100
|
+
"commit": "8d58f08997acf595e3eb7f628123e7fa7830c394"
|
45
101
|
},
|
46
102
|
{
|
47
103
|
"author": "beachball",
|
48
104
|
"package": "@fluentui/react-label",
|
49
|
-
"comment": "Bump @fluentui/react-conformance-griffel to
|
50
|
-
"commit": "
|
105
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.6",
|
106
|
+
"commit": "8d58f08997acf595e3eb7f628123e7fa7830c394"
|
51
107
|
}
|
52
108
|
]
|
53
109
|
}
|
package/CHANGELOG.md
CHANGED
@@ -1,23 +1,44 @@
|
|
1
1
|
# Change Log - @fluentui/react-label
|
2
2
|
|
3
|
-
This log was last generated on Thu,
|
3
|
+
This log was last generated on Thu, 26 May 2022 04:32:14 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
-
## [0.0.0-nightly-
|
7
|
+
## [0.0.0-nightly-20220526-0422.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v0.0.0-nightly-20220526-0422.1)
|
8
8
|
|
9
|
-
Thu,
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.0-
|
9
|
+
Thu, 26 May 2022 04:32:14 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.0-rc.3..@fluentui/react-label_v0.0.0-nightly-20220526-0422.1)
|
11
|
+
|
12
|
+
### Changes
|
13
|
+
|
14
|
+
- Renaming strong prop to weight to align with Text. ([PR #23250](https://github.com/microsoft/fluentui/pull/23250) by esteban.230@hotmail.com)
|
15
|
+
|
16
|
+
## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.0-rc.3)
|
17
|
+
|
18
|
+
Mon, 23 May 2022 18:56:45 GMT
|
19
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.0-rc.2..@fluentui/react-label_v9.0.0-rc.3)
|
20
|
+
|
21
|
+
### Changes
|
22
|
+
|
23
|
+
- Removing <componentName>ClassName exports. ([PR #23092](https://github.com/microsoft/fluentui/pull/23092) by esteban.230@hotmail.com)
|
24
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.9 ([PR #23146](https://github.com/microsoft/fluentui/pull/23146) by beachball)
|
25
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.7 ([PR #23146](https://github.com/microsoft/fluentui/pull/23146) by beachball)
|
26
|
+
|
27
|
+
## [9.0.0-rc.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.0-rc.2)
|
28
|
+
|
29
|
+
Mon, 23 May 2022 12:14:19 GMT
|
30
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.0-beta.12..@fluentui/react-label_v9.0.0-rc.2)
|
11
31
|
|
12
32
|
### Changes
|
13
33
|
|
14
34
|
- update README and package version ([PR #22865](https://github.com/microsoft/fluentui/pull/22865) by esteban.230@hotmail.com)
|
15
35
|
- feat: ship rolluped only dts ([PR #22793](https://github.com/microsoft/fluentui/pull/22793) by martinhochel@microsoft.com)
|
16
36
|
- Removing commons type from Label. ([PR #22880](https://github.com/microsoft/fluentui/pull/22880) by esteban.230@hotmail.com)
|
37
|
+
- chore: Update Griffel to latest version ([PR #23029](https://github.com/microsoft/fluentui/pull/23029) by olfedias@microsoft.com)
|
17
38
|
- chore: Update Griffel to latest version ([PR #22894](https://github.com/microsoft/fluentui/pull/22894) by olfedias@microsoft.com)
|
18
|
-
- Bump @fluentui/react-theme to
|
19
|
-
- Bump @fluentui/react-utilities to
|
20
|
-
- Bump @fluentui/react-conformance-griffel to
|
39
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.8 ([PR #23030](https://github.com/microsoft/fluentui/pull/23030) by beachball)
|
40
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.9 ([PR #23030](https://github.com/microsoft/fluentui/pull/23030) by beachball)
|
41
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.6 ([PR #23030](https://github.com/microsoft/fluentui/pull/23030) by beachball)
|
21
42
|
|
22
43
|
## [9.0.0-beta.12](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.0-beta.12)
|
23
44
|
|
package/dist/index.d.ts
CHANGED
@@ -10,11 +10,6 @@ import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
10
10
|
*/
|
11
11
|
export declare const Label: ForwardRefComponent<LabelProps>;
|
12
12
|
|
13
|
-
/**
|
14
|
-
* @deprecated Use `labelClassNames.root` instead.
|
15
|
-
*/
|
16
|
-
export declare const labelClassName = "fui-Label";
|
17
|
-
|
18
13
|
export declare const labelClassNames: SlotClassNames<LabelSlots>;
|
19
14
|
|
20
15
|
/**
|
@@ -38,10 +33,10 @@ export declare type LabelProps = Omit<ComponentProps<LabelSlots>, 'required'> &
|
|
38
33
|
*/
|
39
34
|
size?: 'small' | 'medium' | 'large';
|
40
35
|
/**
|
41
|
-
* A label supports semibold
|
42
|
-
* @default
|
36
|
+
* A label supports regular and semibold fontweight.
|
37
|
+
* @default regular
|
43
38
|
*/
|
44
|
-
|
39
|
+
weight?: 'regular' | 'semibold';
|
45
40
|
};
|
46
41
|
|
47
42
|
export declare type LabelSlots = {
|
@@ -52,7 +47,7 @@ export declare type LabelSlots = {
|
|
52
47
|
/**
|
53
48
|
* State used in rendering Label
|
54
49
|
*/
|
55
|
-
export declare type LabelState = ComponentState<LabelSlots> & Required<Pick<LabelProps, 'disabled' | 'size' | '
|
50
|
+
export declare type LabelState = ComponentState<LabelSlots> & Required<Pick<LabelProps, 'disabled' | 'size' | 'weight'>>;
|
56
51
|
|
57
52
|
/**
|
58
53
|
* Render the final JSX of Label
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Label.types.js","sourceRoot":"../src/","sources":["components/Label/Label.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * Label Props\n */\nexport type LabelProps = Omit<ComponentProps<LabelSlots>, 'required'> & {\n /**\n * Renders the label as disabled\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Displays an indicator that the label is for a required field. The required prop can be set to true to display\n * an asterisk (*). Or it can be set to a string or jsx content to display a different indicator.\n * @default false\n */\n required?: boolean | Slot<'span'>;\n\n /**\n * A label supports different sizes.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A label supports semibold
|
1
|
+
{"version":3,"file":"Label.types.js","sourceRoot":"../src/","sources":["components/Label/Label.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * Label Props\n */\nexport type LabelProps = Omit<ComponentProps<LabelSlots>, 'required'> & {\n /**\n * Renders the label as disabled\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Displays an indicator that the label is for a required field. The required prop can be set to true to display\n * an asterisk (*). Or it can be set to a string or jsx content to display a different indicator.\n * @default false\n */\n required?: boolean | Slot<'span'>;\n\n /**\n * A label supports different sizes.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A label supports regular and semibold fontweight.\n * @default regular\n */\n weight?: 'regular' | 'semibold';\n};\n\nexport type LabelSlots = {\n root: Slot<'label'>;\n required?: Slot<'span'>;\n};\n\n/**\n * State used in rendering Label\n */\nexport type LabelState = ComponentState<LabelSlots> & Required<Pick<LabelProps, 'disabled' | 'size' | 'weight'>>;\n"]}
|
@@ -14,7 +14,7 @@ export const useLabel_unstable = (props, ref) => {
|
|
14
14
|
const {
|
15
15
|
disabled = false,
|
16
16
|
required = false,
|
17
|
-
|
17
|
+
weight = 'regular',
|
18
18
|
size = 'medium'
|
19
19
|
} = props;
|
20
20
|
return {
|
@@ -24,7 +24,7 @@ export const useLabel_unstable = (props, ref) => {
|
|
24
24
|
'aria-hidden': 'true'
|
25
25
|
}
|
26
26
|
}),
|
27
|
-
|
27
|
+
weight,
|
28
28
|
size,
|
29
29
|
components: {
|
30
30
|
root: 'label',
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/Label/useLabel.tsx"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAEA,SAAS,gBAAT,QAAiC,2BAAjC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAA+D;AAC9F,QAAM;AAAE,IAAA,QAAQ,GAAG,KAAb;AAAoB,IAAA,QAAQ,GAAG,KAA/B;AAAsC,IAAA,MAAM,GAAG,
|
1
|
+
{"version":3,"sources":["components/Label/useLabel.tsx"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAEA,SAAS,gBAAT,QAAiC,2BAAjC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAA+D;AAC9F,QAAM;AAAE,IAAA,QAAQ,GAAG,KAAb;AAAoB,IAAA,QAAQ,GAAG,KAA/B;AAAsC,IAAA,MAAM,GAAG,SAA/C;AAA0D,IAAA,IAAI,GAAG;AAAjE,MAA8E,KAApF;AACA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,QAAQ,EAAE,gBAAgB,CAAC,QAAQ,KAAK,IAAb,GAAoB,GAApB,GAA0B,QAAQ,IAAI,SAAvC,EAAkD;AAC1E,MAAA,YAAY,EAAE;AAAE,uBAAe;AAAjB;AAD4D,KAAlD,CAFrB;AAKL,IAAA,MALK;AAML,IAAA,IANK;AAOL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE,OAAR;AAAiB,MAAA,QAAQ,EAAE;AAA3B,KAPP;AAQL,IAAA,IAAI,EAAE,qBAAqB,CAAC,OAAD,EAAU;AAAE,MAAA,GAAF;AAAO,SAAG;AAAV,KAAV;AARtB,GAAP;AAUD,CAZM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { LabelProps, LabelState } from './Label.types';\nimport { resolveShorthand } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render Label.\n *\n * The returned state can be modified with hooks such as useLabelStyles_unstable,\n * before being passed to renderLabel_unstable.\n *\n * @param props - props from this instance of Label\n * @param ref - reference to root HTMLElement of Label\n */\nexport const useLabel_unstable = (props: LabelProps, ref: React.Ref<HTMLElement>): LabelState => {\n const { disabled = false, required = false, weight = 'regular', size = 'medium' } = props;\n return {\n disabled,\n required: resolveShorthand(required === true ? '*' : required || undefined, {\n defaultProps: { 'aria-hidden': 'true' },\n }),\n weight,\n size,\n components: { root: 'label', required: 'span' },\n root: getNativeElementProps('label', { ref, ...props }),\n };\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,10 +1,5 @@
|
|
1
1
|
import { __styles, mergeClasses } from '@griffel/react';
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
3
|
-
/**
|
4
|
-
* @deprecated Use `labelClassNames.root` instead.
|
5
|
-
*/
|
6
|
-
|
7
|
-
export const labelClassName = 'fui-Label';
|
8
3
|
export const labelClassNames = {
|
9
4
|
root: 'fui-Label',
|
10
5
|
required: 'fui-Label__required'
|
@@ -41,7 +36,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
41
36
|
"Bg96gwp": "faaz57k",
|
42
37
|
"Bhrd7zp": "fl43uef"
|
43
38
|
},
|
44
|
-
"
|
39
|
+
"semibold": {
|
45
40
|
"Bhrd7zp": "fl43uef"
|
46
41
|
}
|
47
42
|
}, {
|
@@ -54,7 +49,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
54
49
|
|
55
50
|
export const useLabelStyles_unstable = state => {
|
56
51
|
const styles = useStyles();
|
57
|
-
state.root.className = mergeClasses(labelClassNames.root, styles.root, state.disabled && styles.disabled, styles[state.size], state.
|
52
|
+
state.root.className = mergeClasses(labelClassNames.root, styles.root, state.disabled && styles.disabled, styles[state.size], state.weight === 'semibold' && styles.semibold, state.root.className);
|
58
53
|
|
59
54
|
if (state.required) {
|
60
55
|
state.required.className = mergeClasses(labelClassNames.required, styles.required, state.disabled && styles.requiredDisabled, state.required.className);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/Label/useLabelStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA
|
1
|
+
{"version":3,"sources":["components/Label/useLabelStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA,OAAO,MAAM,eAAe,GAA+B;AACzD,EAAA,IAAI,EAAE,WADmD;AAEzD,EAAA,QAAQ,EAAE;AAF+C,CAApD;AAKP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAwCA;;AAEG;;;AACH,OAAO,MAAM,uBAAuB,GAAI,KAAD,IAAkC;AACvE,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,eAAe,CAAC,IADiB,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAHQ,EAIjC,MAAM,CAAC,KAAK,CAAC,IAAP,CAJ2B,EAKjC,KAAK,CAAC,MAAN,KAAiB,UAAjB,IAA+B,MAAM,CAAC,QALL,EAMjC,KAAK,CAAC,IAAN,CAAW,SANsB,CAAnC;;AASA,MAAI,KAAK,CAAC,QAAV,EAAoB;AAClB,IAAA,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,YAAY,CACrC,eAAe,CAAC,QADqB,EAErC,MAAM,CAAC,QAF8B,EAGrC,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,gBAHY,EAIrC,KAAK,CAAC,QAAN,CAAe,SAJsB,CAAvC;AAMD;;AAED,SAAO,KAAP;AACD,CArBM","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { LabelSlots, LabelState } from './Label.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const labelClassNames: SlotClassNames<LabelSlots> = {\n root: 'fui-Label',\n required: 'fui-Label__required',\n};\n\n/**\n * Styles for the label\n */\nconst useStyles = makeStyles({\n root: {\n fontFamily: tokens.fontFamilyBase,\n color: tokens.colorNeutralForeground1,\n },\n\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n required: {\n color: tokens.colorPaletteRedForeground3,\n paddingLeft: '4px', // TODO: Once spacing tokens are added, change this to Horizontal XS\n },\n\n requiredDisabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n small: {\n fontSize: tokens.fontSizeBase200,\n lineHeight: tokens.lineHeightBase200,\n },\n\n medium: {\n fontSize: tokens.fontSizeBase300,\n lineHeight: tokens.lineHeightBase300,\n },\n\n large: {\n fontSize: tokens.fontSizeBase400,\n lineHeight: tokens.lineHeightBase400,\n fontWeight: tokens.fontWeightSemibold,\n },\n\n semibold: {\n fontWeight: tokens.fontWeightSemibold,\n },\n});\n\n/**\n * Apply styling to the Label slots based on the state\n */\nexport const useLabelStyles_unstable = (state: LabelState): LabelState => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n labelClassNames.root,\n styles.root,\n state.disabled && styles.disabled,\n styles[state.size],\n state.weight === 'semibold' && styles.semibold,\n state.root.className,\n );\n\n if (state.required) {\n state.required.className = mergeClasses(\n labelClassNames.required,\n styles.required,\n state.disabled && styles.requiredDisabled,\n state.required.className,\n );\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
package/lib/index.js
CHANGED
@@ -1,3 +1,2 @@
|
|
1
|
-
export { Label,
|
2
|
-
labelClassName, labelClassNames, renderLabel_unstable, useLabelStyles_unstable, useLabel_unstable } from './Label';
|
1
|
+
export { Label, labelClassNames, renderLabel_unstable, useLabelStyles_unstable, useLabel_unstable } from './Label';
|
3
2
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { Label, labelClassNames, renderLabel_unstable, useLabelStyles_unstable, useLabel_unstable } from './Label';\nexport type { LabelProps, LabelSlots, LabelState } from './Label';\n"]}
|
@@ -23,7 +23,7 @@ const useLabel_unstable = (props, ref) => {
|
|
23
23
|
const {
|
24
24
|
disabled = false,
|
25
25
|
required = false,
|
26
|
-
|
26
|
+
weight = 'regular',
|
27
27
|
size = 'medium'
|
28
28
|
} = props;
|
29
29
|
return {
|
@@ -33,7 +33,7 @@ const useLabel_unstable = (props, ref) => {
|
|
33
33
|
'aria-hidden': 'true'
|
34
34
|
}
|
35
35
|
}),
|
36
|
-
|
36
|
+
weight,
|
37
37
|
size,
|
38
38
|
components: {
|
39
39
|
root: 'label',
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/Label/useLabel.tsx"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAA+D;AAC9F,QAAM;AAAE,IAAA,QAAQ,GAAG,KAAb;AAAoB,IAAA,QAAQ,GAAG,KAA/B;AAAsC,IAAA,MAAM,GAAG,
|
1
|
+
{"version":3,"sources":["components/Label/useLabel.tsx"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAA+D;AAC9F,QAAM;AAAE,IAAA,QAAQ,GAAG,KAAb;AAAoB,IAAA,QAAQ,GAAG,KAA/B;AAAsC,IAAA,MAAM,GAAG,SAA/C;AAA0D,IAAA,IAAI,GAAG;AAAjE,MAA8E,KAApF;AACA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,QAAQ,EAAE,iBAAA,CAAA,gBAAA,CAAiB,QAAQ,KAAK,IAAb,GAAoB,GAApB,GAA0B,QAAQ,IAAI,SAAvD,EAAkE;AAC1E,MAAA,YAAY,EAAE;AAAE,uBAAe;AAAjB;AAD4D,KAAlE,CAFL;AAKL,IAAA,MALK;AAML,IAAA,IANK;AAOL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE,OAAR;AAAiB,MAAA,QAAQ,EAAE;AAA3B,KAPP;AAQL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,OAAtB,EAA+B;AAAE,MAAA,GAAF;AAAO,SAAG;AAAV,KAA/B;AARD,GAAP;AAUD,CAZM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { LabelProps, LabelState } from './Label.types';\nimport { resolveShorthand } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render Label.\n *\n * The returned state can be modified with hooks such as useLabelStyles_unstable,\n * before being passed to renderLabel_unstable.\n *\n * @param props - props from this instance of Label\n * @param ref - reference to root HTMLElement of Label\n */\nexport const useLabel_unstable = (props: LabelProps, ref: React.Ref<HTMLElement>): LabelState => {\n const { disabled = false, required = false, weight = 'regular', size = 'medium' } = props;\n return {\n disabled,\n required: resolveShorthand(required === true ? '*' : required || undefined, {\n defaultProps: { 'aria-hidden': 'true' },\n }),\n weight,\n size,\n components: { root: 'label', required: 'span' },\n root: getNativeElementProps('label', { ref, ...props }),\n };\n};\n"],"sourceRoot":"../src/"}
|
@@ -3,17 +3,12 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useLabelStyles_unstable = exports.labelClassNames =
|
6
|
+
exports.useLabelStyles_unstable = exports.labelClassNames = void 0;
|
7
7
|
|
8
8
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
9
9
|
|
10
10
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
11
|
-
/**
|
12
|
-
* @deprecated Use `labelClassNames.root` instead.
|
13
|
-
*/
|
14
|
-
|
15
11
|
|
16
|
-
exports.labelClassName = 'fui-Label';
|
17
12
|
exports.labelClassNames = {
|
18
13
|
root: 'fui-Label',
|
19
14
|
required: 'fui-Label__required'
|
@@ -50,7 +45,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
50
45
|
"Bg96gwp": "faaz57k",
|
51
46
|
"Bhrd7zp": "fl43uef"
|
52
47
|
},
|
53
|
-
"
|
48
|
+
"semibold": {
|
54
49
|
"Bhrd7zp": "fl43uef"
|
55
50
|
}
|
56
51
|
}, {
|
@@ -63,7 +58,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
63
58
|
|
64
59
|
const useLabelStyles_unstable = state => {
|
65
60
|
const styles = useStyles();
|
66
|
-
state.root.className = react_1.mergeClasses(exports.labelClassNames.root, styles.root, state.disabled && styles.disabled, styles[state.size], state.
|
61
|
+
state.root.className = react_1.mergeClasses(exports.labelClassNames.root, styles.root, state.disabled && styles.disabled, styles[state.size], state.weight === 'semibold' && styles.semibold, state.root.className);
|
67
62
|
|
68
63
|
if (state.required) {
|
69
64
|
state.required.className = react_1.mergeClasses(exports.labelClassNames.required, styles.required, state.disabled && styles.requiredDisabled, state.required.className);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/Label/useLabelStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA
|
1
|
+
{"version":3,"sources":["components/Label/useLabelStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,eAAA,GAA8C;AACzD,EAAA,IAAI,EAAE,WADmD;AAEzD,EAAA,QAAQ,EAAE;AAF+C,CAA9C;AAKb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAwCA;;AAEG;;;AACI,MAAM,uBAAuB,GAAI,KAAD,IAAkC;AACvE,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,eAAA,CAAgB,IADK,EAErB,MAAM,CAAC,IAFc,EAGrB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAHJ,EAIrB,MAAM,CAAC,KAAK,CAAC,IAAP,CAJe,EAKrB,KAAK,CAAC,MAAN,KAAiB,UAAjB,IAA+B,MAAM,CAAC,QALjB,EAMrB,KAAK,CAAC,IAAN,CAAW,SANU,CAAvB;;AASA,MAAI,KAAK,CAAC,QAAV,EAAoB;AAClB,IAAA,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,OAAA,CAAA,YAAA,CACzB,OAAA,CAAA,eAAA,CAAgB,QADS,EAEzB,MAAM,CAAC,QAFkB,EAGzB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,gBAHA,EAIzB,KAAK,CAAC,QAAN,CAAe,SAJU,CAA3B;AAMD;;AAED,SAAO,KAAP;AACD,CArBM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { LabelSlots, LabelState } from './Label.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const labelClassNames: SlotClassNames<LabelSlots> = {\n root: 'fui-Label',\n required: 'fui-Label__required',\n};\n\n/**\n * Styles for the label\n */\nconst useStyles = makeStyles({\n root: {\n fontFamily: tokens.fontFamilyBase,\n color: tokens.colorNeutralForeground1,\n },\n\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n required: {\n color: tokens.colorPaletteRedForeground3,\n paddingLeft: '4px', // TODO: Once spacing tokens are added, change this to Horizontal XS\n },\n\n requiredDisabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n small: {\n fontSize: tokens.fontSizeBase200,\n lineHeight: tokens.lineHeightBase200,\n },\n\n medium: {\n fontSize: tokens.fontSizeBase300,\n lineHeight: tokens.lineHeightBase300,\n },\n\n large: {\n fontSize: tokens.fontSizeBase400,\n lineHeight: tokens.lineHeightBase400,\n fontWeight: tokens.fontWeightSemibold,\n },\n\n semibold: {\n fontWeight: tokens.fontWeightSemibold,\n },\n});\n\n/**\n * Apply styling to the Label slots based on the state\n */\nexport const useLabelStyles_unstable = (state: LabelState): LabelState => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n labelClassNames.root,\n styles.root,\n state.disabled && styles.disabled,\n styles[state.size],\n state.weight === 'semibold' && styles.semibold,\n state.root.className,\n );\n\n if (state.required) {\n state.required.className = mergeClasses(\n labelClassNames.required,\n styles.required,\n state.disabled && styles.requiredDisabled,\n state.required.className,\n );\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
package/lib-commonjs/index.js
CHANGED
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useLabel_unstable = exports.useLabelStyles_unstable = exports.renderLabel_unstable = exports.labelClassNames = exports.
|
6
|
+
exports.useLabel_unstable = exports.useLabelStyles_unstable = exports.renderLabel_unstable = exports.labelClassNames = exports.Label = void 0;
|
7
7
|
|
8
8
|
var Label_1 = /*#__PURE__*/require("./Label");
|
9
9
|
|
@@ -12,13 +12,6 @@ Object.defineProperty(exports, "Label", {
|
|
12
12
|
get: function () {
|
13
13
|
return Label_1.Label;
|
14
14
|
}
|
15
|
-
}); // eslint-disable-next-line deprecation/deprecation
|
16
|
-
|
17
|
-
Object.defineProperty(exports, "labelClassName", {
|
18
|
-
enumerable: true,
|
19
|
-
get: function () {
|
20
|
-
return Label_1.labelClassName;
|
21
|
-
}
|
22
15
|
});
|
23
16
|
Object.defineProperty(exports, "labelClassNames", {
|
24
17
|
enumerable: true,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,OAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,KAAA;AAAK;AAAL,CAAA;AAAO,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,eAAA;AAAe;AAAf,CAAA;AAAiB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,oBAAA;AAAoB;AAApB,CAAA;AAAsB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,uBAAA;AAAuB;AAAvB,CAAA;AAAyB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,iBAAA;AAAiB;AAAjB,CAAA","sourcesContent":["export { Label, labelClassNames, renderLabel_unstable, useLabelStyles_unstable, useLabel_unstable } from './Label';\nexport type { LabelProps, LabelSlots, LabelState } from './Label';\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-label",
|
3
|
-
"version": "0.0.0-nightly-
|
3
|
+
"version": "0.0.0-nightly-20220526-0422.1",
|
4
4
|
"description": "Fluent UI React Label component",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -28,13 +28,13 @@
|
|
28
28
|
"devDependencies": {
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
30
30
|
"@fluentui/react-conformance": "*",
|
31
|
-
"@fluentui/react-conformance-griffel": "0.0.0-nightly-
|
31
|
+
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20220526-0422.0",
|
32
32
|
"@fluentui/scripts": "^1.0.0"
|
33
33
|
},
|
34
34
|
"dependencies": {
|
35
|
-
"@fluentui/react-theme": "0.0.0-nightly-
|
36
|
-
"@fluentui/react-utilities": "0.0.0-nightly-
|
37
|
-
"@griffel/react": "1.0.
|
35
|
+
"@fluentui/react-theme": "0.0.0-nightly-20220526-0422.0",
|
36
|
+
"@fluentui/react-utilities": "0.0.0-nightly-20220526-0422.0",
|
37
|
+
"@griffel/react": "1.0.5",
|
38
38
|
"tslib": "^2.1.0"
|
39
39
|
},
|
40
40
|
"peerDependencies": {
|