@fluentui/react-label 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (58) hide show
  1. package/CHANGELOG.json +520 -16
  2. package/CHANGELOG.md +194 -60
  3. package/README.md +17 -3
  4. package/Spec.md +34 -40
  5. package/dist/index.d.ts +78 -0
  6. package/{lib → dist}/tsdoc-metadata.json +0 -0
  7. package/lib/Label.js.map +1 -1
  8. package/lib/components/Label/Label.js +7 -7
  9. package/lib/components/Label/Label.js.map +1 -1
  10. package/lib/components/Label/Label.types.js.map +1 -1
  11. package/lib/components/Label/index.js.map +1 -1
  12. package/lib/components/Label/renderLabel.js +8 -8
  13. package/lib/components/Label/renderLabel.js.map +1 -1
  14. package/lib/components/Label/useLabel.js +18 -27
  15. package/lib/components/Label/useLabel.js.map +1 -1
  16. package/lib/components/Label/useLabelStyles.js +19 -6
  17. package/lib/components/Label/useLabelStyles.js.map +1 -1
  18. package/lib/index.js +2 -1
  19. package/lib/index.js.map +1 -1
  20. package/lib-commonjs/Label.js +1 -1
  21. package/lib-commonjs/Label.js.map +1 -1
  22. package/lib-commonjs/components/Label/Label.js +8 -8
  23. package/lib-commonjs/components/Label/Label.js.map +1 -1
  24. package/lib-commonjs/components/Label/Label.types.js.map +1 -1
  25. package/lib-commonjs/components/Label/index.js +1 -1
  26. package/lib-commonjs/components/Label/index.js.map +1 -1
  27. package/lib-commonjs/components/Label/renderLabel.js +12 -14
  28. package/lib-commonjs/components/Label/renderLabel.js.map +1 -1
  29. package/lib-commonjs/components/Label/useLabel.js +23 -33
  30. package/lib-commonjs/components/Label/useLabel.js.map +1 -1
  31. package/lib-commonjs/components/Label/useLabelStyles.js +23 -9
  32. package/lib-commonjs/components/Label/useLabelStyles.js.map +1 -1
  33. package/lib-commonjs/index.js +39 -2
  34. package/lib-commonjs/index.js.map +1 -1
  35. package/package.json +19 -23
  36. package/dist/react-label.d.ts +0 -80
  37. package/lib/Label.d.ts +0 -1
  38. package/lib/common/isConformant.d.ts +0 -4
  39. package/lib/common/isConformant.js +0 -11
  40. package/lib/common/isConformant.js.map +0 -1
  41. package/lib/components/Label/Label.d.ts +0 -6
  42. package/lib/components/Label/Label.types.d.ts +0 -38
  43. package/lib/components/Label/index.d.ts +0 -5
  44. package/lib/components/Label/renderLabel.d.ts +0 -5
  45. package/lib/components/Label/useLabel.d.ts +0 -17
  46. package/lib/components/Label/useLabelStyles.d.ts +0 -5
  47. package/lib/index.d.ts +0 -2
  48. package/lib-commonjs/Label.d.ts +0 -1
  49. package/lib-commonjs/common/isConformant.d.ts +0 -4
  50. package/lib-commonjs/common/isConformant.js +0 -22
  51. package/lib-commonjs/common/isConformant.js.map +0 -1
  52. package/lib-commonjs/components/Label/Label.d.ts +0 -6
  53. package/lib-commonjs/components/Label/Label.types.d.ts +0 -38
  54. package/lib-commonjs/components/Label/index.d.ts +0 -5
  55. package/lib-commonjs/components/Label/renderLabel.d.ts +0 -5
  56. package/lib-commonjs/components/Label/useLabel.d.ts +0 -17
  57. package/lib-commonjs/components/Label/useLabelStyles.d.ts +0 -5
  58. package/lib-commonjs/index.d.ts +0 -2
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Label/useLabel.tsx"],"names":[],"mappings":";;;;;;;;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAEA;;;AAGG;;;AACU,OAAA,CAAA,mBAAA,GAA+C,CAAC,MAAD,EAAS,UAAT,CAA/C;AAEb;;;;;;;;AAQG;;AACI,IAAM,QAAQ,GAAG,UAAC,KAAD,EAAoB,GAApB,EAA+C;AAC7D,MAAA,EAAA,GAAwE,KAAK,CAA7D,QAAhB;AAAA,MAAA,QAAQ,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQ,EAAhB;AAAA,MAAkB,EAAA,GAAsD,KAAK,CAA3C,QAAlC;AAAA,MAAkB,QAAQ,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQ,EAAlC;AAAA,MAAoC,EAAA,GAAoC,KAAK,CAA3B,MAAlD;AAAA,MAAoC,MAAM,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQ,EAAlD;AAAA,MAAoD,EAAA,GAAoB,KAAK,CAAV,IAAnE;AAAA,MAAoD,IAAI,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,QAAH,GAAW,EAAnE;AACR,SAAO;AACL,IAAA,QAAQ,EAAA,QADH;AAEL,IAAA,QAAQ,EAAE,iBAAA,CAAA,gBAAA,CAAiB,QAAQ,KAAK,KAAb,GAAqB,IAArB,GAA4B,QAA7C,EAAuD;AAC/D,MAAA,QAAQ,EAAE,CAAC,CAAC,QADmD;AAE/D,MAAA,YAAY,EAAE;AAAE,QAAA,QAAQ,EAAE;AAAZ;AAFiD,KAAvD,CAFL;AAML,IAAA,MAAM,EAAA,MAND;AAOL,IAAA,IAAI,EAAA,IAPC;AAQL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE,OAAR;AAAiB,MAAA,QAAQ,EAAE;AAA3B,KARP;AASL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,OAAtB,EAA6B,OAAA,CAAA,QAAA,CAAA;AAAI,MAAA,GAAG,EAAA;AAAP,KAAA,EAAY,KAAZ,CAA7B;AATD,GAAP;AAWD,CAbM;;AAAM,OAAA,CAAA,QAAA,GAAQ,QAAR","sourceRoot":""}
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,KAA/C;AAAsD,IAAA,IAAI,GAAG;AAA7D,MAA0E,KAAhF;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, strong = false, size = 'medium' } = props;\n return {\n disabled,\n required: resolveShorthand(required === true ? '*' : required || undefined, {\n defaultProps: { 'aria-hidden': 'true' },\n }),\n strong,\n size,\n components: { root: 'label', required: 'span' },\n root: getNativeElementProps('label', { ref, ...props }),\n };\n};\n"],"sourceRoot":"../src/"}
@@ -3,15 +3,26 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useLabelStyles = void 0;
6
+ exports.useLabelStyles_unstable = exports.labelClassNames = exports.labelClassName = void 0;
7
7
 
8
- var react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
+
10
+ const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
9
11
  /**
10
- * Styles for the label
12
+ * @deprecated Use `labelClassNames.root` instead.
11
13
  */
12
14
 
13
15
 
14
- var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
16
+ exports.labelClassName = 'fui-Label';
17
+ exports.labelClassNames = {
18
+ root: 'fui-Label',
19
+ required: 'fui-Label__required'
20
+ };
21
+ /**
22
+ * Styles for the label
23
+ */
24
+
25
+ const useStyles = /*#__PURE__*/react_1.__styles({
15
26
  "root": {
16
27
  "Bahqtrf": "fk6fouc",
17
28
  "sj55zd": "f19n0e5"
@@ -23,6 +34,9 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
23
34
  "sj55zd": "f1whyuy6",
24
35
  "uwmqm3": ["fycuoez", "f8wuabp"]
25
36
  },
37
+ "requiredDisabled": {
38
+ "sj55zd": "f1s2aq7o"
39
+ },
26
40
  "small": {
27
41
  "Be2twd7": "fy9rknc",
28
42
  "Bg96gwp": "fwrc4pm"
@@ -47,16 +61,16 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
47
61
  */
48
62
 
49
63
 
50
- var useLabelStyles = function (state) {
51
- var styles = useStyles();
52
- state.root.className = react_make_styles_1.mergeClasses(styles.root, state.disabled && styles.disabled, styles[state.size], state.strong && styles.strong, state.root.className);
64
+ const useLabelStyles_unstable = state => {
65
+ const styles = useStyles();
66
+ state.root.className = react_1.mergeClasses(exports.labelClassNames.root, styles.root, state.disabled && styles.disabled, styles[state.size], state.strong && styles.strong, state.root.className);
53
67
 
54
68
  if (state.required) {
55
- state.required.className = react_make_styles_1.mergeClasses(styles.required, state.required.className);
69
+ state.required.className = react_1.mergeClasses(exports.labelClassNames.required, styles.required, state.disabled && styles.requiredDisabled, state.required.className);
56
70
  }
57
71
 
58
72
  return state;
59
73
  };
60
74
 
61
- exports.useLabelStyles = useLabelStyles;
75
+ exports.useLabelStyles_unstable = useLabelStyles_unstable;
62
76
  //# sourceMappingURL=useLabelStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Label/useLabelStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;AAGA;;AAEG;;;AACH,IAAM,SAAS,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAoCA;;AAEG;;;AACI,IAAM,cAAc,GAAG,UAAC,KAAD,EAAkB;AAC9C,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,mBAAA,CAAA,YAAA,CACrB,MAAM,CAAC,IADc,EAErB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAFJ,EAGrB,MAAM,CAAC,KAAK,CAAC,IAAP,CAHe,EAIrB,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,MAJF,EAKrB,KAAK,CAAC,IAAN,CAAW,SALU,CAAvB;;AAQA,MAAI,KAAK,CAAC,QAAV,EAAoB;AAClB,IAAA,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,mBAAA,CAAA,YAAA,CAAa,MAAM,CAAC,QAApB,EAA8B,KAAK,CAAC,QAAN,CAAe,SAA7C,CAA3B;AACD;;AAED,SAAO,KAAP;AACD,CAfM;;AAAM,OAAA,CAAA,cAAA,GAAc,cAAd","sourceRoot":""}
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;;AAEG;;;AACU,OAAA,CAAA,cAAA,GAAiB,WAAjB;AACA,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,IAAgB,MAAM,CAAC,MALF,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\n/**\n * @deprecated Use `labelClassNames.root` instead.\n */\nexport const labelClassName = 'fui-Label';\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 strong: {\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.strong && styles.strong,\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/"}
@@ -3,8 +3,45 @@
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.labelClassName = exports.Label = void 0;
6
7
 
7
- var tslib_1 = /*#__PURE__*/require("tslib");
8
+ var Label_1 = /*#__PURE__*/require("./Label");
8
9
 
9
- tslib_1.__exportStar(require("./Label"), exports);
10
+ Object.defineProperty(exports, "Label", {
11
+ enumerable: true,
12
+ get: function () {
13
+ return Label_1.Label;
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
+ });
23
+ Object.defineProperty(exports, "labelClassNames", {
24
+ enumerable: true,
25
+ get: function () {
26
+ return Label_1.labelClassNames;
27
+ }
28
+ });
29
+ Object.defineProperty(exports, "renderLabel_unstable", {
30
+ enumerable: true,
31
+ get: function () {
32
+ return Label_1.renderLabel_unstable;
33
+ }
34
+ });
35
+ Object.defineProperty(exports, "useLabelStyles_unstable", {
36
+ enumerable: true,
37
+ get: function () {
38
+ return Label_1.useLabelStyles_unstable;
39
+ }
40
+ });
41
+ Object.defineProperty(exports, "useLabel_unstable", {
42
+ enumerable: true,
43
+ get: function () {
44
+ return Label_1.useLabel_unstable;
45
+ }
46
+ });
10
47
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;AAEA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACE,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,E,CACA;;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,gBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,cAAA;AAAc;AAAd,CAAA;AACA,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;AACA,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;AACA,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;AACA,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 {\n Label,\n // eslint-disable-next-line deprecation/deprecation\n labelClassName,\n labelClassNames,\n renderLabel_unstable,\n useLabelStyles_unstable,\n useLabel_unstable,\n} from './Label';\nexport type { LabelProps, LabelSlots, LabelState } from './Label';\n"],"sourceRoot":"../src/"}
package/package.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "name": "@fluentui/react-label",
3
- "version": "9.0.0-nightly.f81b28ceb3.1",
4
- "description": "Label component for FluentUI library.",
3
+ "version": "9.0.0-rc.2",
4
+ "description": "Fluent UI React Label component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
7
- "typings": "lib/index.d.ts",
7
+ "typings": "dist/index.d.ts",
8
8
  "sideEffects": false,
9
9
  "repository": {
10
10
  "type": "git",
@@ -19,32 +19,22 @@
19
19
  "just": "just-scripts",
20
20
  "lint": "just-scripts lint",
21
21
  "start": "yarn storybook",
22
- "test": "jest",
22
+ "test": "jest --passWithNoTests",
23
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/packages/react-label/src && yarn docs",
25
- "storybook": "start-storybook"
24
+ "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/packages/react-components/react-label/src && yarn docs",
25
+ "storybook": "node ../../../scripts/storybook/runner",
26
+ "type-check": "tsc -b tsconfig.json"
26
27
  },
27
28
  "devDependencies": {
28
- "@fluentui/babel-make-styles": "9.0.0-nightly.f81b28ceb3.1",
29
29
  "@fluentui/eslint-plugin": "*",
30
- "@fluentui/jest-serializer-make-styles": "9.0.0-nightly.f81b28ceb3.1",
31
30
  "@fluentui/react-conformance": "*",
32
- "@fluentui/react-conformance-make-styles": "9.0.0-nightly.f81b28ceb3.1",
33
- "@fluentui/scripts": "^1.0.0",
34
- "@types/enzyme": "3.10.3",
35
- "@types/enzyme-adapter-react-16": "1.0.3",
36
- "@types/react": "16.9.42",
37
- "@types/react-dom": "16.9.10",
38
- "@types/react-test-renderer": "^16.0.0",
39
- "enzyme": "~3.10.0",
40
- "enzyme-adapter-react-16": "^1.15.0",
41
- "react": "16.8.6",
42
- "react-dom": "16.8.6",
43
- "react-test-renderer": "^16.3.0"
31
+ "@fluentui/react-conformance-griffel": "9.0.0-beta.6",
32
+ "@fluentui/scripts": "^1.0.0"
44
33
  },
45
34
  "dependencies": {
46
- "@fluentui/react-make-styles": "9.0.0-nightly.f81b28ceb3.1",
47
- "@fluentui/react-utilities": "9.0.0-nightly.f81b28ceb3.1",
35
+ "@fluentui/react-theme": "9.0.0-rc.8",
36
+ "@fluentui/react-utilities": "9.0.0-rc.9",
37
+ "@griffel/react": "1.0.5",
48
38
  "tslib": "^2.1.0"
49
39
  },
50
40
  "peerDependencies": {
@@ -54,11 +44,17 @@
54
44
  "react-dom": ">=16.8.0 <18.0.0"
55
45
  },
56
46
  "beachball": {
57
- "tag": "beta",
58
47
  "disallowedChangeTypes": [
59
48
  "major",
60
49
  "minor",
61
50
  "patch"
62
51
  ]
52
+ },
53
+ "exports": {
54
+ ".": {
55
+ "types": "./lib/index.d.ts",
56
+ "import": "./lib/index.js",
57
+ "require": "./lib-commonjs/index.js"
58
+ }
63
59
  }
64
60
  }
@@ -1,80 +0,0 @@
1
- import type { ComponentProps } from '@fluentui/react-utilities';
2
- import type { ComponentState } from '@fluentui/react-utilities';
3
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
4
- import type { IntrinsicShorthandProps } from '@fluentui/react-utilities';
5
- import type { ObjectShorthandProps } from '@fluentui/react-utilities';
6
- import * as React_2 from 'react';
7
-
8
- /**
9
- * A label component provides a title or name to a component.
10
- */
11
- export declare const Label: ForwardRefComponent<LabelProps>;
12
-
13
- /**
14
- * Label Props
15
- */
16
- export declare type LabelCommons = {
17
- /**
18
- * Renders the label as disabled
19
- * @defaultvalue false
20
- */
21
- disabled: boolean;
22
- /**
23
- * A label supports different sizes.
24
- * @defaultvalue 'medium'
25
- */
26
- size: 'small' | 'medium' | 'large';
27
- /**
28
- * A label supports semibold/strong fontweight.
29
- * @defaultvalue false
30
- */
31
- strong: boolean;
32
- };
33
-
34
- export declare type LabelProps = Omit<ComponentProps<LabelSlots>, 'required'> & Partial<LabelCommons> & {
35
- /**
36
- * Displays and indicator that the label is for a required field. The required prop can be set to true to display
37
- * an asterisk (*). Or it can be set to a string or jsx content to display a different indicator.
38
- * @defaultvalue false
39
- */
40
- required?: boolean | ObjectShorthandProps<React_2.HTMLAttributes<HTMLElement>> | React_2.ReactNode;
41
- };
42
-
43
- /**
44
- * Array of all shorthand properties listed in LabelShorthandProps
45
- * {@docCatergory Label}
46
- */
47
- export declare const labelShorthandProps: Array<keyof LabelSlots>;
48
-
49
- export declare type LabelSlots = {
50
- root: IntrinsicShorthandProps<'label'>;
51
- required?: IntrinsicShorthandProps<'span'>;
52
- };
53
-
54
- /**
55
- * State used in rendering Label
56
- */
57
- export declare type LabelState = ComponentState<LabelSlots> & LabelCommons;
58
-
59
- /**
60
- * Render the final JSX of Label
61
- */
62
- export declare const renderLabel: (state: LabelState) => JSX.Element;
63
-
64
- /**
65
- * Create the state required to render Label.
66
- *
67
- * The returned state can be modified with hooks such as useLabelStyles,
68
- * before being passed to renderLabel.
69
- *
70
- * @param props - props from this instance of Label
71
- * @param ref - reference to root HTMLElement of Label
72
- */
73
- export declare const useLabel: (props: LabelProps, ref: React_2.Ref<HTMLElement>) => LabelState;
74
-
75
- /**
76
- * Apply styling to the Label slots based on the state
77
- */
78
- export declare const useLabelStyles: (state: LabelState) => LabelState;
79
-
80
- export { }
package/lib/Label.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './components/Label/index';
@@ -1,4 +0,0 @@
1
- import type { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -1,11 +0,0 @@
1
- import { isConformant as baseIsConformant } from '@fluentui/react-conformance';
2
- import makeStylesTests from '@fluentui/react-conformance-make-styles';
3
- export function isConformant(testInfo) {
4
- var defaultOptions = {
5
- asPropHandlesRef: true,
6
- componentPath: module.parent.filename.replace('.test', ''),
7
- extraTests: makeStylesTests
8
- };
9
- baseIsConformant(defaultOptions, testInfo);
10
- }
11
- //# sourceMappingURL=isConformant.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":"AAAA,SAAS,YAAY,IAAI,gBAAzB,QAAiD,6BAAjD;AAEA,OAAO,eAAP,MAA4B,yCAA5B;AAEA,OAAM,SAAU,YAAV,CACJ,QADI,EACqF;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,UAAU,EAAE;AAH+C,GAA7D;AAMA,EAAA,gBAAgB,CAAC,cAAD,EAAiB,QAAjB,CAAhB;AACD","sourceRoot":""}
@@ -1,6 +0,0 @@
1
- import type { LabelProps } from './Label.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * A label component provides a title or name to a component.
5
- */
6
- export declare const Label: ForwardRefComponent<LabelProps>;
@@ -1,38 +0,0 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps, ObjectShorthandProps } from '@fluentui/react-utilities';
2
- import * as React from 'react';
3
- /**
4
- * Label Props
5
- */
6
- export declare type LabelCommons = {
7
- /**
8
- * Renders the label as disabled
9
- * @defaultvalue false
10
- */
11
- disabled: boolean;
12
- /**
13
- * A label supports different sizes.
14
- * @defaultvalue 'medium'
15
- */
16
- size: 'small' | 'medium' | 'large';
17
- /**
18
- * A label supports semibold/strong fontweight.
19
- * @defaultvalue false
20
- */
21
- strong: boolean;
22
- };
23
- export declare type LabelSlots = {
24
- root: IntrinsicShorthandProps<'label'>;
25
- required?: IntrinsicShorthandProps<'span'>;
26
- };
27
- /**
28
- * State used in rendering Label
29
- */
30
- export declare type LabelState = ComponentState<LabelSlots> & LabelCommons;
31
- export declare type LabelProps = Omit<ComponentProps<LabelSlots>, 'required'> & Partial<LabelCommons> & {
32
- /**
33
- * Displays and indicator that the label is for a required field. The required prop can be set to true to display
34
- * an asterisk (*). Or it can be set to a string or jsx content to display a different indicator.
35
- * @defaultvalue false
36
- */
37
- required?: boolean | ObjectShorthandProps<React.HTMLAttributes<HTMLElement>> | React.ReactNode;
38
- };
@@ -1,5 +0,0 @@
1
- export * from './Label';
2
- export * from './Label.types';
3
- export * from './renderLabel';
4
- export * from './useLabel';
5
- export * from './useLabelStyles';
@@ -1,5 +0,0 @@
1
- import type { LabelState } from './Label.types';
2
- /**
3
- * Render the final JSX of Label
4
- */
5
- export declare const renderLabel: (state: LabelState) => JSX.Element;
@@ -1,17 +0,0 @@
1
- import * as React from 'react';
2
- import type { LabelProps, LabelSlots, LabelState } from './Label.types';
3
- /**
4
- * Array of all shorthand properties listed in LabelShorthandProps
5
- * {@docCatergory Label}
6
- */
7
- export declare const labelShorthandProps: Array<keyof LabelSlots>;
8
- /**
9
- * Create the state required to render Label.
10
- *
11
- * The returned state can be modified with hooks such as useLabelStyles,
12
- * before being passed to renderLabel.
13
- *
14
- * @param props - props from this instance of Label
15
- * @param ref - reference to root HTMLElement of Label
16
- */
17
- export declare const useLabel: (props: LabelProps, ref: React.Ref<HTMLElement>) => LabelState;
@@ -1,5 +0,0 @@
1
- import type { LabelState } from './Label.types';
2
- /**
3
- * Apply styling to the Label slots based on the state
4
- */
5
- export declare const useLabelStyles: (state: LabelState) => LabelState;
package/lib/index.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export {};
2
- export * from './Label';
@@ -1 +0,0 @@
1
- export * from './components/Label/index';
@@ -1,4 +0,0 @@
1
- import type { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -1,22 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.isConformant = void 0;
7
-
8
- var react_conformance_1 = /*#__PURE__*/require("@fluentui/react-conformance");
9
-
10
- var react_conformance_make_styles_1 = /*#__PURE__*/require("@fluentui/react-conformance-make-styles");
11
-
12
- function isConformant(testInfo) {
13
- var defaultOptions = {
14
- asPropHandlesRef: true,
15
- componentPath: module.parent.filename.replace('.test', ''),
16
- extraTests: react_conformance_make_styles_1.default
17
- };
18
- react_conformance_1.isConformant(defaultOptions, testInfo);
19
- }
20
-
21
- exports.isConformant = isConformant;
22
- //# sourceMappingURL=isConformant.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAEA,IAAA,+BAAA,gBAAA,OAAA,CAAA,yCAAA,CAAA;;AAEA,SAAgB,YAAhB,CACE,QADF,EAC2F;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,UAAU,EAAE,+BAAA,CAAA;AAH+C,GAA7D;AAMA,EAAA,mBAAA,CAAA,YAAA,CAAiB,cAAjB,EAAiC,QAAjC;AACD;;AAVD,OAAA,CAAA,YAAA,GAAA,YAAA","sourceRoot":""}
@@ -1,6 +0,0 @@
1
- import type { LabelProps } from './Label.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * A label component provides a title or name to a component.
5
- */
6
- export declare const Label: ForwardRefComponent<LabelProps>;
@@ -1,38 +0,0 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps, ObjectShorthandProps } from '@fluentui/react-utilities';
2
- import * as React from 'react';
3
- /**
4
- * Label Props
5
- */
6
- export declare type LabelCommons = {
7
- /**
8
- * Renders the label as disabled
9
- * @defaultvalue false
10
- */
11
- disabled: boolean;
12
- /**
13
- * A label supports different sizes.
14
- * @defaultvalue 'medium'
15
- */
16
- size: 'small' | 'medium' | 'large';
17
- /**
18
- * A label supports semibold/strong fontweight.
19
- * @defaultvalue false
20
- */
21
- strong: boolean;
22
- };
23
- export declare type LabelSlots = {
24
- root: IntrinsicShorthandProps<'label'>;
25
- required?: IntrinsicShorthandProps<'span'>;
26
- };
27
- /**
28
- * State used in rendering Label
29
- */
30
- export declare type LabelState = ComponentState<LabelSlots> & LabelCommons;
31
- export declare type LabelProps = Omit<ComponentProps<LabelSlots>, 'required'> & Partial<LabelCommons> & {
32
- /**
33
- * Displays and indicator that the label is for a required field. The required prop can be set to true to display
34
- * an asterisk (*). Or it can be set to a string or jsx content to display a different indicator.
35
- * @defaultvalue false
36
- */
37
- required?: boolean | ObjectShorthandProps<React.HTMLAttributes<HTMLElement>> | React.ReactNode;
38
- };
@@ -1,5 +0,0 @@
1
- export * from './Label';
2
- export * from './Label.types';
3
- export * from './renderLabel';
4
- export * from './useLabel';
5
- export * from './useLabelStyles';
@@ -1,5 +0,0 @@
1
- import type { LabelState } from './Label.types';
2
- /**
3
- * Render the final JSX of Label
4
- */
5
- export declare const renderLabel: (state: LabelState) => JSX.Element;
@@ -1,17 +0,0 @@
1
- import * as React from 'react';
2
- import type { LabelProps, LabelSlots, LabelState } from './Label.types';
3
- /**
4
- * Array of all shorthand properties listed in LabelShorthandProps
5
- * {@docCatergory Label}
6
- */
7
- export declare const labelShorthandProps: Array<keyof LabelSlots>;
8
- /**
9
- * Create the state required to render Label.
10
- *
11
- * The returned state can be modified with hooks such as useLabelStyles,
12
- * before being passed to renderLabel.
13
- *
14
- * @param props - props from this instance of Label
15
- * @param ref - reference to root HTMLElement of Label
16
- */
17
- export declare const useLabel: (props: LabelProps, ref: React.Ref<HTMLElement>) => LabelState;
@@ -1,5 +0,0 @@
1
- import type { LabelState } from './Label.types';
2
- /**
3
- * Apply styling to the Label slots based on the state
4
- */
5
- export declare const useLabelStyles: (state: LabelState) => LabelState;
@@ -1,2 +0,0 @@
1
- export {};
2
- export * from './Label';