@fluentui/react-label 9.0.14 → 9.0.15
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +42 -1
- package/CHANGELOG.md +13 -2
- package/lib/components/Label/Label.js +0 -1
- package/lib/components/Label/Label.js.map +1 -1
- package/lib/components/Label/renderLabel.js +4 -3
- package/lib/components/Label/renderLabel.js.map +1 -1
- package/lib/components/Label/useLabel.js +0 -1
- package/lib/components/Label/useLabel.js.map +1 -1
- package/lib/components/Label/useLabelStyles.js +23 -28
- package/lib/components/Label/useLabelStyles.js.map +1 -1
- package/lib-commonjs/Label.js +0 -2
- package/lib-commonjs/Label.js.map +1 -1
- package/lib-commonjs/components/Label/Label.js +0 -6
- package/lib-commonjs/components/Label/Label.js.map +1 -1
- package/lib-commonjs/components/Label/Label.types.js.map +1 -1
- package/lib-commonjs/components/Label/index.js +0 -6
- package/lib-commonjs/components/Label/index.js.map +1 -1
- package/lib-commonjs/components/Label/renderLabel.js +4 -7
- package/lib-commonjs/components/Label/renderLabel.js.map +1 -1
- package/lib-commonjs/components/Label/useLabel.js +0 -5
- package/lib-commonjs/components/Label/useLabel.js.map +1 -1
- package/lib-commonjs/components/Label/useLabelStyles.js +23 -32
- package/lib-commonjs/components/Label/useLabelStyles.js.map +1 -1
- package/lib-commonjs/index.js +0 -2
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +5 -5
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,48 @@
|
|
2
2
|
"name": "@fluentui/react-label",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "Wed,
|
5
|
+
"date": "Wed, 04 Jan 2023 01:35:31 GMT",
|
6
|
+
"tag": "@fluentui/react-label_v9.0.15",
|
7
|
+
"version": "9.0.15",
|
8
|
+
"comments": {
|
9
|
+
"none": [
|
10
|
+
{
|
11
|
+
"author": "martinhochel@microsoft.com",
|
12
|
+
"package": "@fluentui/react-label",
|
13
|
+
"commit": "194b0cf0cc27c1c1233aa945f09b3ad29778d8ca",
|
14
|
+
"comment": "chore(scripts): use for @fluentui/scripts version within all package.json"
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "martinhochel@microsoft.com",
|
18
|
+
"package": "@fluentui/react-label",
|
19
|
+
"commit": "4ec2b998b294d6d9c3196d3d82893bdd97d0c105",
|
20
|
+
"comment": "chore(scripts): move index.ts to to follow sub-folder domain packaging"
|
21
|
+
}
|
22
|
+
],
|
23
|
+
"patch": [
|
24
|
+
{
|
25
|
+
"author": "olfedias@microsoft.com",
|
26
|
+
"package": "@fluentui/react-label",
|
27
|
+
"commit": "2c38f1e4ae07b2b60df596efe11015a68f166dbf",
|
28
|
+
"comment": "chore: Update Griffel to latest version"
|
29
|
+
},
|
30
|
+
{
|
31
|
+
"author": "beachball",
|
32
|
+
"package": "@fluentui/react-label",
|
33
|
+
"comment": "Bump @fluentui/react-utilities to v9.3.1",
|
34
|
+
"commit": "3e322d15529451be153e97298873253e21af4082"
|
35
|
+
},
|
36
|
+
{
|
37
|
+
"author": "beachball",
|
38
|
+
"package": "@fluentui/react-label",
|
39
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19",
|
40
|
+
"commit": "3e322d15529451be153e97298873253e21af4082"
|
41
|
+
}
|
42
|
+
]
|
43
|
+
}
|
44
|
+
},
|
45
|
+
{
|
46
|
+
"date": "Wed, 21 Dec 2022 10:20:33 GMT",
|
6
47
|
"tag": "@fluentui/react-label_v9.0.14",
|
7
48
|
"version": "9.0.14",
|
8
49
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,23 @@
|
|
1
1
|
# Change Log - @fluentui/react-label
|
2
2
|
|
3
|
-
This log was last generated on Wed,
|
3
|
+
This log was last generated on Wed, 04 Jan 2023 01:35:31 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.0.15](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.15)
|
8
|
+
|
9
|
+
Wed, 04 Jan 2023 01:35:31 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.14..@fluentui/react-label_v9.0.15)
|
11
|
+
|
12
|
+
### Patches
|
13
|
+
|
14
|
+
- chore: Update Griffel to latest version ([PR #26045](https://github.com/microsoft/fluentui/pull/26045) by olfedias@microsoft.com)
|
15
|
+
- Bump @fluentui/react-utilities to v9.3.1 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
|
16
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
|
17
|
+
|
7
18
|
## [9.0.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.14)
|
8
19
|
|
9
|
-
Wed, 21 Dec 2022 10:
|
20
|
+
Wed, 21 Dec 2022 10:20:33 GMT
|
10
21
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.13..@fluentui/react-label_v9.0.14)
|
11
22
|
|
12
23
|
### Patches
|
@@ -5,7 +5,6 @@ import { useLabelStyles_unstable } from './useLabelStyles';
|
|
5
5
|
/**
|
6
6
|
* A label component provides a title or name to a component.
|
7
7
|
*/
|
8
|
-
|
9
8
|
export const Label = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
9
|
const state = useLabel_unstable(props, ref);
|
11
10
|
useLabelStyles_unstable(state);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,oBAAoB,QAAQ,eAAe;AACpD,SAASC,uBAAuB,QAAQ,kBAAkB;AAI1D;;;AAGA,OAAO,MAAMC,KAAK,gBAAoCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpF,MAAMC,KAAK,GAAGP,iBAAiB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAE3CJ,uBAAuB,CAACK,KAAK,CAAC;EAC9B,OAAON,oBAAoB,CAACM,KAAK,CAAC;AACpC,CAAC,CAAC;AAEFJ,KAAK,CAACK,WAAW,GAAG,OAAO","names":["React","useLabel_unstable","renderLabel_unstable","useLabelStyles_unstable","Label","forwardRef","props","ref","state","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/Label.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useLabel_unstable } from './useLabel';\nimport { renderLabel_unstable } from './renderLabel';\nimport { useLabelStyles_unstable } from './useLabelStyles';\nimport type { LabelProps } from './Label.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * A label component provides a title or name to a component.\n */\nexport const Label: ForwardRefComponent<LabelProps> = React.forwardRef((props, ref) => {\n const state = useLabel_unstable(props, ref);\n\n useLabelStyles_unstable(state);\n return renderLabel_unstable(state);\n});\n\nLabel.displayName = 'Label';\n"]}
|
@@ -3,14 +3,15 @@ import { getSlots } from '@fluentui/react-utilities';
|
|
3
3
|
/**
|
4
4
|
* Render the final JSX of Label
|
5
5
|
*/
|
6
|
-
|
7
6
|
export const renderLabel_unstable = state => {
|
8
7
|
const {
|
9
8
|
slots,
|
10
9
|
slotProps
|
11
10
|
} = getSlots(state);
|
12
|
-
return /*#__PURE__*/React.createElement(slots.root, {
|
13
|
-
|
11
|
+
return /*#__PURE__*/React.createElement(slots.root, {
|
12
|
+
...slotProps.root
|
13
|
+
}, state.root.children, slots.required && /*#__PURE__*/React.createElement(slots.required, {
|
14
|
+
...slotProps.required
|
14
15
|
}));
|
15
16
|
};
|
16
17
|
//# sourceMappingURL=renderLabel.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,oBAAoB,GAAIC,KAAiB,IAAI;EACxD,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAaE,KAAK,CAAC;EAExD,oBACEH,oBAACI,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,GAC3BH,KAAK,CAACG,IAAI,CAACC,QAAQ,EACnBH,KAAK,CAACI,QAAQ,iBAAIR,oBAACI,KAAK,CAACI,QAAQ;IAAA,GAAKH,SAAS,CAACG;EAAQ,EAAI,CAClD;AAEjB,CAAC","names":["React","getSlots","renderLabel_unstable","state","slots","slotProps","root","children","required"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/renderLabel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { LabelState, LabelSlots } from './Label.types';\n\n/**\n * Render the final JSX of Label\n */\nexport const renderLabel_unstable = (state: LabelState) => {\n const { slots, slotProps } = getSlots<LabelSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {state.root.children}\n {slots.required && <slots.required {...slotProps.required} />}\n </slots.root>\n );\n};\n"]}
|
@@ -9,7 +9,6 @@ import { resolveShorthand } from '@fluentui/react-utilities';
|
|
9
9
|
* @param props - props from this instance of Label
|
10
10
|
* @param ref - reference to root HTMLElement of Label
|
11
11
|
*/
|
12
|
-
|
13
12
|
export const useLabel_unstable = (props, ref) => {
|
14
13
|
const {
|
15
14
|
disabled = false,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":"AACA,SAASA,qBAAqB,QAAQ,2BAA2B;AAEjE,SAASC,gBAAgB,QAAQ,2BAA2B;AAE5D;;;;;;;;;AASA,OAAO,MAAMC,iBAAiB,GAAG,CAACC,KAAiB,EAAEC,GAA2B,KAAgB;EAC9F,MAAM;IAAEC,QAAQ,GAAG,KAAK;IAAEC,QAAQ,GAAG,KAAK;IAAEC,MAAM,GAAG,SAAS;IAAEC,IAAI,GAAG;EAAQ,CAAE,GAAGL,KAAK;EACzF,OAAO;IACLE,QAAQ;IACRC,QAAQ,EAAEL,gBAAgB,CAACK,QAAQ,KAAK,IAAI,GAAG,GAAG,GAAGA,QAAQ,IAAIG,SAAS,EAAE;MAC1EC,YAAY,EAAE;QAAE,aAAa,EAAE;MAAM;KACtC,CAAC;IACFH,MAAM;IACNC,IAAI;IACJG,UAAU,EAAE;MAAEC,IAAI,EAAE,OAAO;MAAEN,QAAQ,EAAE;IAAM,CAAE;IAC/CM,IAAI,EAAEZ,qBAAqB,CAAC,OAAO,EAAE;MAAEI,GAAG;MAAE,GAAGD;IAAK,CAAE;GACvD;AACH,CAAC","names":["getNativeElementProps","resolveShorthand","useLabel_unstable","props","ref","disabled","required","weight","size","undefined","defaultProps","components","root"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/useLabel.tsx"],"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"]}
|
@@ -7,54 +7,49 @@ export const labelClassNames = {
|
|
7
7
|
/**
|
8
8
|
* Styles for the label
|
9
9
|
*/
|
10
|
-
|
11
10
|
const useStyles = /*#__PURE__*/__styles({
|
12
|
-
|
13
|
-
|
14
|
-
|
11
|
+
root: {
|
12
|
+
Bahqtrf: "fk6fouc",
|
13
|
+
sj55zd: "f19n0e5"
|
15
14
|
},
|
16
|
-
|
17
|
-
|
15
|
+
disabled: {
|
16
|
+
sj55zd: "f1s2aq7o"
|
18
17
|
},
|
19
|
-
|
20
|
-
|
21
|
-
|
18
|
+
required: {
|
19
|
+
sj55zd: "f1whyuy6",
|
20
|
+
uwmqm3: ["fycuoez", "f8wuabp"]
|
22
21
|
},
|
23
|
-
|
24
|
-
|
22
|
+
requiredDisabled: {
|
23
|
+
sj55zd: "f1s2aq7o"
|
25
24
|
},
|
26
|
-
|
27
|
-
|
28
|
-
|
25
|
+
small: {
|
26
|
+
Be2twd7: "fy9rknc",
|
27
|
+
Bg96gwp: "fwrc4pm"
|
29
28
|
},
|
30
|
-
|
31
|
-
|
32
|
-
|
29
|
+
medium: {
|
30
|
+
Be2twd7: "fkhj508",
|
31
|
+
Bg96gwp: "f1i3iumi"
|
33
32
|
},
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
33
|
+
large: {
|
34
|
+
Be2twd7: "fod5ikn",
|
35
|
+
Bg96gwp: "faaz57k",
|
36
|
+
Bhrd7zp: "fl43uef"
|
38
37
|
},
|
39
|
-
|
40
|
-
|
38
|
+
semibold: {
|
39
|
+
Bhrd7zp: "fl43uef"
|
41
40
|
}
|
42
41
|
}, {
|
43
|
-
|
42
|
+
d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".f1whyuy6{color:var(--colorPaletteRedForeground3);}", ".fycuoez{padding-left:4px;}", ".f8wuabp{padding-right:4px;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".faaz57k{line-height:var(--lineHeightBase400);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}"]
|
44
43
|
});
|
45
44
|
/**
|
46
45
|
* Apply styling to the Label slots based on the state
|
47
46
|
*/
|
48
|
-
|
49
|
-
|
50
47
|
export const useLabelStyles_unstable = state => {
|
51
48
|
const styles = useStyles();
|
52
49
|
state.root.className = mergeClasses(labelClassNames.root, styles.root, state.disabled && styles.disabled, styles[state.size], state.weight === 'semibold' && styles.semibold, state.root.className);
|
53
|
-
|
54
50
|
if (state.required) {
|
55
51
|
state.required.className = mergeClasses(labelClassNames.required, styles.required, state.disabled && styles.requiredDisabled, state.required.className);
|
56
52
|
}
|
57
|
-
|
58
53
|
return state;
|
59
54
|
};
|
60
55
|
//# sourceMappingURL=useLabelStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":"AAAA,mBAAqBA,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAI9C,OAAO,MAAMC,eAAe,GAA+B;EACzDC,IAAI,EAAE,WAAW;EACjBC,QAAQ,EAAE;CACX;AAED;;;AAGA,MAAMC,SAAS,gBAAG;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAsChB;AAEF;;;AAGA,OAAO,MAAMC,uBAAuB,GAAIC,KAAiB,IAAgB;EACvE,MAAMC,MAAM,GAAGH,SAAS,EAAE;EAC1BE,KAAK,CAACJ,IAAI,CAACM,SAAS,GAAGT,YAAY,CACjCE,eAAe,CAACC,IAAI,EACpBK,MAAM,CAACL,IAAI,EACXI,KAAK,CAACG,QAAQ,IAAIF,MAAM,CAACE,QAAQ,EACjCF,MAAM,CAACD,KAAK,CAACI,IAAI,CAAC,EAClBJ,KAAK,CAACK,MAAM,KAAK,UAAU,IAAIJ,MAAM,CAACK,QAAQ,EAC9CN,KAAK,CAACJ,IAAI,CAACM,SAAS,CACrB;EAED,IAAIF,KAAK,CAACH,QAAQ,EAAE;IAClBG,KAAK,CAACH,QAAQ,CAACK,SAAS,GAAGT,YAAY,CACrCE,eAAe,CAACE,QAAQ,EACxBI,MAAM,CAACJ,QAAQ,EACfG,KAAK,CAACG,QAAQ,IAAIF,MAAM,CAACM,gBAAgB,EACzCP,KAAK,CAACH,QAAQ,CAACK,SAAS,CACzB;;EAGH,OAAOF,KAAK;AACd,CAAC","names":["mergeClasses","tokens","labelClassNames","root","required","useStyles","useLabelStyles_unstable","state","styles","className","disabled","size","weight","semibold","requiredDisabled"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/useLabelStyles.ts"],"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"]}
|
package/lib-commonjs/Label.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["packages/react-components/react-label/src/Label.ts"],"
|
1
|
+
{"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/Label.ts"],"sourcesContent":["export * from './components/Label/index';\n"]}
|
@@ -4,19 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.Label = void 0;
|
7
|
-
|
8
7
|
const React = /*#__PURE__*/require("react");
|
9
|
-
|
10
8
|
const useLabel_1 = /*#__PURE__*/require("./useLabel");
|
11
|
-
|
12
9
|
const renderLabel_1 = /*#__PURE__*/require("./renderLabel");
|
13
|
-
|
14
10
|
const useLabelStyles_1 = /*#__PURE__*/require("./useLabelStyles");
|
15
11
|
/**
|
16
12
|
* A label component provides a title or name to a component.
|
17
13
|
*/
|
18
|
-
|
19
|
-
|
20
14
|
exports.Label = /*#__PURE__*/React.forwardRef((props, ref) => {
|
21
15
|
const state = useLabel_1.useLabel_unstable(props, ref);
|
22
16
|
useLabelStyles_1.useLabelStyles_unstable(state);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,aAAK,gBAAoCC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACpF,MAAMC,KAAK,GAAGC,4BAAiB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE3CG,wCAAuB,CAACF,KAAK,CAAC;EAC9B,OAAOG,kCAAoB,CAACH,KAAK,CAAC;AACpC,CAAC,CAAC;AAEFL,aAAK,CAACS,WAAW,GAAG,OAAO","names":["exports","React","forwardRef","props","ref","state","useLabel_1","useLabelStyles_1","renderLabel_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/Label.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useLabel_unstable } from './useLabel';\nimport { renderLabel_unstable } from './renderLabel';\nimport { useLabelStyles_unstable } from './useLabelStyles';\nimport type { LabelProps } from './Label.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * A label component provides a title or name to a component.\n */\nexport const Label: ForwardRefComponent<LabelProps> = React.forwardRef((props, ref) => {\n const state = useLabel_unstable(props, ref);\n\n useLabelStyles_unstable(state);\n return renderLabel_unstable(state);\n});\n\nLabel.displayName = 'Label';\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":"","names":[],"sourceRoot":"../src/","sources":[],"sourcesContent":[]}
|
@@ -3,16 +3,10 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
|
7
6
|
const tslib_1 = /*#__PURE__*/require("tslib");
|
8
|
-
|
9
7
|
tslib_1.__exportStar(require("./Label"), exports);
|
10
|
-
|
11
8
|
tslib_1.__exportStar(require("./Label.types"), exports);
|
12
|
-
|
13
9
|
tslib_1.__exportStar(require("./renderLabel"), exports);
|
14
|
-
|
15
10
|
tslib_1.__exportStar(require("./useLabel"), exports);
|
16
|
-
|
17
11
|
tslib_1.__exportStar(require("./useLabelStyles"), exports);
|
18
12
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["packages/react-components/react-label/src/components/Label/index.ts"],"
|
1
|
+
{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/index.ts"],"sourcesContent":["export * from './Label';\nexport * from './Label.types';\nexport * from './renderLabel';\nexport * from './useLabel';\nexport * from './useLabelStyles';\n"]}
|
@@ -4,24 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.renderLabel_unstable = void 0;
|
7
|
-
|
8
7
|
const React = /*#__PURE__*/require("react");
|
9
|
-
|
10
8
|
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
11
9
|
/**
|
12
10
|
* Render the final JSX of Label
|
13
11
|
*/
|
14
|
-
|
15
|
-
|
16
12
|
const renderLabel_unstable = state => {
|
17
13
|
const {
|
18
14
|
slots,
|
19
15
|
slotProps
|
20
16
|
} = react_utilities_1.getSlots(state);
|
21
|
-
return React.createElement(slots.root, {
|
22
|
-
|
17
|
+
return React.createElement(slots.root, {
|
18
|
+
...slotProps.root
|
19
|
+
}, state.root.children, slots.required && React.createElement(slots.required, {
|
20
|
+
...slotProps.required
|
23
21
|
}));
|
24
22
|
};
|
25
|
-
|
26
23
|
exports.renderLabel_unstable = renderLabel_unstable;
|
27
24
|
//# sourceMappingURL=renderLabel.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,oBAAoB,GAAIC,KAAiB,IAAI;EACxD,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAaH,KAAK,CAAC;EAExD,OACEI,oBAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BL,KAAK,CAACK,IAAI,CAACC,QAAQ,EACnBL,KAAK,CAACM,QAAQ,IAAIH,oBAACH,KAAK,CAACM,QAAQ;IAAA,GAAKL,SAAS,CAACK;EAAQ,EAAI,CAClD;AAEjB,CAAC;AATYC,4BAAoB","names":["renderLabel_unstable","state","slots","slotProps","react_utilities_1","React","root","children","required","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/renderLabel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { LabelState, LabelSlots } from './Label.types';\n\n/**\n * Render the final JSX of Label\n */\nexport const renderLabel_unstable = (state: LabelState) => {\n const { slots, slotProps } = getSlots<LabelSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {state.root.children}\n {slots.required && <slots.required {...slotProps.required} />}\n </slots.root>\n );\n};\n"]}
|
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.useLabel_unstable = void 0;
|
7
|
-
|
8
7
|
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
9
|
-
|
10
8
|
const react_utilities_2 = /*#__PURE__*/require("@fluentui/react-utilities");
|
11
9
|
/**
|
12
10
|
* Create the state required to render Label.
|
@@ -17,8 +15,6 @@ const react_utilities_2 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
17
15
|
* @param props - props from this instance of Label
|
18
16
|
* @param ref - reference to root HTMLElement of Label
|
19
17
|
*/
|
20
|
-
|
21
|
-
|
22
18
|
const useLabel_unstable = (props, ref) => {
|
23
19
|
const {
|
24
20
|
disabled = false,
|
@@ -45,6 +41,5 @@ const useLabel_unstable = (props, ref) => {
|
|
45
41
|
})
|
46
42
|
};
|
47
43
|
};
|
48
|
-
|
49
44
|
exports.useLabel_unstable = useLabel_unstable;
|
50
45
|
//# sourceMappingURL=useLabel.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":";;;;;;AACA;AAEA;AAEA;;;;;;;;;AASO,MAAMA,iBAAiB,GAAG,CAACC,KAAiB,EAAEC,GAA2B,KAAgB;EAC9F,MAAM;IAAEC,QAAQ,GAAG,KAAK;IAAEC,QAAQ,GAAG,KAAK;IAAEC,MAAM,GAAG,SAAS;IAAEC,IAAI,GAAG;EAAQ,CAAE,GAAGL,KAAK;EACzF,OAAO;IACLE,QAAQ;IACRC,QAAQ,EAAEG,kCAAgB,CAACH,QAAQ,KAAK,IAAI,GAAG,GAAG,GAAGA,QAAQ,IAAII,SAAS,EAAE;MAC1EC,YAAY,EAAE;QAAE,aAAa,EAAE;MAAM;KACtC,CAAC;IACFJ,MAAM;IACNC,IAAI;IACJI,UAAU,EAAE;MAAEC,IAAI,EAAE,OAAO;MAAEP,QAAQ,EAAE;IAAM,CAAE;IAC/CO,IAAI,EAAEC,uCAAqB,CAAC,OAAO,EAAE;MAAEV,GAAG;MAAE,GAAGD;IAAK,CAAE;GACvD;AACH,CAAC;AAZYY,yBAAiB","names":["useLabel_unstable","props","ref","disabled","required","weight","size","react_utilities_2","undefined","defaultProps","components","root","react_utilities_1","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/useLabel.tsx"],"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"]}
|
@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.useLabelStyles_unstable = exports.labelClassNames = void 0;
|
7
|
-
|
8
7
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
9
|
-
|
10
8
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
11
|
-
|
12
9
|
exports.labelClassNames = {
|
13
10
|
root: 'fui-Label',
|
14
11
|
required: 'fui-Label__required'
|
@@ -16,56 +13,50 @@ exports.labelClassNames = {
|
|
16
13
|
/**
|
17
14
|
* Styles for the label
|
18
15
|
*/
|
19
|
-
|
20
16
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
21
|
-
|
22
|
-
|
23
|
-
|
17
|
+
root: {
|
18
|
+
Bahqtrf: "fk6fouc",
|
19
|
+
sj55zd: "f19n0e5"
|
24
20
|
},
|
25
|
-
|
26
|
-
|
21
|
+
disabled: {
|
22
|
+
sj55zd: "f1s2aq7o"
|
27
23
|
},
|
28
|
-
|
29
|
-
|
30
|
-
|
24
|
+
required: {
|
25
|
+
sj55zd: "f1whyuy6",
|
26
|
+
uwmqm3: ["fycuoez", "f8wuabp"]
|
31
27
|
},
|
32
|
-
|
33
|
-
|
28
|
+
requiredDisabled: {
|
29
|
+
sj55zd: "f1s2aq7o"
|
34
30
|
},
|
35
|
-
|
36
|
-
|
37
|
-
|
31
|
+
small: {
|
32
|
+
Be2twd7: "fy9rknc",
|
33
|
+
Bg96gwp: "fwrc4pm"
|
38
34
|
},
|
39
|
-
|
40
|
-
|
41
|
-
|
35
|
+
medium: {
|
36
|
+
Be2twd7: "fkhj508",
|
37
|
+
Bg96gwp: "f1i3iumi"
|
42
38
|
},
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
39
|
+
large: {
|
40
|
+
Be2twd7: "fod5ikn",
|
41
|
+
Bg96gwp: "faaz57k",
|
42
|
+
Bhrd7zp: "fl43uef"
|
47
43
|
},
|
48
|
-
|
49
|
-
|
44
|
+
semibold: {
|
45
|
+
Bhrd7zp: "fl43uef"
|
50
46
|
}
|
51
47
|
}, {
|
52
|
-
|
48
|
+
d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".f1whyuy6{color:var(--colorPaletteRedForeground3);}", ".fycuoez{padding-left:4px;}", ".f8wuabp{padding-right:4px;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".faaz57k{line-height:var(--lineHeightBase400);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}"]
|
53
49
|
});
|
54
50
|
/**
|
55
51
|
* Apply styling to the Label slots based on the state
|
56
52
|
*/
|
57
|
-
|
58
|
-
|
59
53
|
const useLabelStyles_unstable = state => {
|
60
54
|
const styles = useStyles();
|
61
55
|
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);
|
62
|
-
|
63
56
|
if (state.required) {
|
64
57
|
state.required.className = react_1.mergeClasses(exports.labelClassNames.required, styles.required, state.disabled && styles.requiredDisabled, state.required.className);
|
65
58
|
}
|
66
|
-
|
67
59
|
return state;
|
68
60
|
};
|
69
|
-
|
70
61
|
exports.useLabelStyles_unstable = useLabelStyles_unstable;
|
71
62
|
//# sourceMappingURL=useLabelStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":";;;;;;AAAA;AACA;AAIaA,uBAAe,GAA+B;EACzDC,IAAI,EAAE,WAAW;EACjBC,QAAQ,EAAE;CACX;AAED;;;AAGA,MAAMC,SAAS,gBAAGC,gBAAU;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAsC1B;AAEF;;;AAGO,MAAMC,uBAAuB,GAAIC,KAAiB,IAAgB;EACvE,MAAMC,MAAM,GAAGJ,SAAS,EAAE;EAC1BG,KAAK,CAACL,IAAI,CAACO,SAAS,GAAGJ,oBAAY,CACjCJ,uBAAe,CAACC,IAAI,EACpBM,MAAM,CAACN,IAAI,EACXK,KAAK,CAACG,QAAQ,IAAIF,MAAM,CAACE,QAAQ,EACjCF,MAAM,CAACD,KAAK,CAACI,IAAI,CAAC,EAClBJ,KAAK,CAACK,MAAM,KAAK,UAAU,IAAIJ,MAAM,CAACK,QAAQ,EAC9CN,KAAK,CAACL,IAAI,CAACO,SAAS,CACrB;EAED,IAAIF,KAAK,CAACJ,QAAQ,EAAE;IAClBI,KAAK,CAACJ,QAAQ,CAACM,SAAS,GAAGJ,oBAAY,CACrCJ,uBAAe,CAACE,QAAQ,EACxBK,MAAM,CAACL,QAAQ,EACfI,KAAK,CAACG,QAAQ,IAAIF,MAAM,CAACM,gBAAgB,EACzCP,KAAK,CAACJ,QAAQ,CAACM,SAAS,CACzB;;EAGH,OAAOF,KAAK;AACd,CAAC;AArBYN,+BAAuB","names":["exports","root","required","useStyles","react_1","useLabelStyles_unstable","state","styles","className","disabled","size","weight","semibold","requiredDisabled"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/components/Label/useLabelStyles.ts"],"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"]}
|
package/lib-commonjs/index.js
CHANGED
@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.useLabel_unstable = exports.useLabelStyles_unstable = exports.renderLabel_unstable = exports.labelClassNames = exports.Label = void 0;
|
7
|
-
|
8
7
|
var Label_1 = /*#__PURE__*/require("./Label");
|
9
|
-
|
10
8
|
Object.defineProperty(exports, "Label", {
|
11
9
|
enumerable: true,
|
12
10
|
get: function () {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"mappings":";;;;;;AAAA;AAASA;EAAAC;EAAAC;IAAA,oBAAK;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,8BAAe;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,mCAAoB;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,sCAAuB;EAAA;AAAA;AAAEF;EAAAC;EAAAC;IAAA,gCAAiB;EAAA;AAAA","names":["Object","enumerable","get"],"sourceRoot":"../src/","sources":["packages/react-components/react-label/src/index.ts"],"sourcesContent":["export { Label, labelClassNames, renderLabel_unstable, useLabelStyles_unstable, useLabel_unstable } from './Label';\nexport type { LabelProps, LabelSlots, LabelState } from './Label';\n"]}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-label",
|
3
|
-
"version": "9.0.
|
3
|
+
"version": "9.0.15",
|
4
4
|
"description": "Fluent UI React Label component",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -27,13 +27,13 @@
|
|
27
27
|
"devDependencies": {
|
28
28
|
"@fluentui/eslint-plugin": "*",
|
29
29
|
"@fluentui/react-conformance": "*",
|
30
|
-
"@fluentui/react-conformance-griffel": "9.0.0-beta.
|
31
|
-
"@fluentui/scripts": "
|
30
|
+
"@fluentui/react-conformance-griffel": "9.0.0-beta.19",
|
31
|
+
"@fluentui/scripts": "*"
|
32
32
|
},
|
33
33
|
"dependencies": {
|
34
34
|
"@fluentui/react-theme": "^9.1.5",
|
35
|
-
"@fluentui/react-utilities": "^9.3.
|
36
|
-
"@griffel/react": "^1.
|
35
|
+
"@fluentui/react-utilities": "^9.3.1",
|
36
|
+
"@griffel/react": "^1.5.2",
|
37
37
|
"tslib": "^2.1.0"
|
38
38
|
},
|
39
39
|
"peerDependencies": {
|