@fluentui/react-field 9.0.0-alpha.8 → 9.0.0-beta.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (62) hide show
  1. package/.swcrc +30 -0
  2. package/CHANGELOG.json +668 -1
  3. package/CHANGELOG.md +241 -2
  4. package/README.md +66 -1
  5. package/dist/index.d.ts +153 -80
  6. package/lib/Field.js.map +1 -1
  7. package/lib/components/Field/Field.js +13 -0
  8. package/lib/components/Field/Field.js.map +1 -0
  9. package/lib/components/Field/Field.types.js +1 -1
  10. package/lib/components/Field/Field.types.js.map +1 -1
  11. package/lib/components/Field/index.js +1 -0
  12. package/lib/components/Field/index.js.map +1 -1
  13. package/lib/components/Field/renderField.js +11 -9
  14. package/lib/components/Field/renderField.js.map +1 -1
  15. package/lib/components/Field/useField.js +32 -98
  16. package/lib/components/Field/useField.js.map +1 -1
  17. package/lib/components/Field/useFieldStyles.js +61 -76
  18. package/lib/components/Field/useFieldStyles.js.map +1 -1
  19. package/lib/contexts/FieldContext.js +5 -0
  20. package/lib/contexts/FieldContext.js.map +1 -0
  21. package/lib/contexts/index.js +4 -0
  22. package/lib/contexts/index.js.map +1 -0
  23. package/lib/contexts/useFieldContextValues.js +33 -0
  24. package/lib/contexts/useFieldContextValues.js.map +1 -0
  25. package/lib/contexts/useFieldControlProps.js +65 -0
  26. package/lib/contexts/useFieldControlProps.js.map +1 -0
  27. package/lib/index.js +4 -1
  28. package/lib/index.js.map +1 -1
  29. package/lib/util/makeDeprecatedField.js +68 -0
  30. package/lib/util/makeDeprecatedField.js.map +1 -0
  31. package/lib-commonjs/Field.js +4 -5
  32. package/lib-commonjs/Field.js.map +1 -1
  33. package/lib-commonjs/components/Field/Field.js +23 -0
  34. package/lib-commonjs/components/Field/Field.js.map +1 -0
  35. package/lib-commonjs/components/Field/Field.types.js +5 -2
  36. package/lib-commonjs/components/Field/Field.types.js.map +1 -1
  37. package/lib-commonjs/components/Field/index.js +8 -11
  38. package/lib-commonjs/components/Field/index.js.map +1 -1
  39. package/lib-commonjs/components/Field/renderField.js +19 -26
  40. package/lib-commonjs/components/Field/renderField.js.map +1 -1
  41. package/lib-commonjs/components/Field/useField.js +71 -155
  42. package/lib-commonjs/components/Field/useField.js.map +1 -1
  43. package/lib-commonjs/components/Field/useFieldStyles.js +138 -118
  44. package/lib-commonjs/components/Field/useFieldStyles.js.map +1 -1
  45. package/lib-commonjs/contexts/FieldContext.js +21 -0
  46. package/lib-commonjs/contexts/FieldContext.js.map +1 -0
  47. package/lib-commonjs/contexts/index.js +11 -0
  48. package/lib-commonjs/contexts/index.js.map +1 -0
  49. package/lib-commonjs/contexts/useFieldContextValues.js +44 -0
  50. package/lib-commonjs/contexts/useFieldContextValues.js.map +1 -0
  51. package/lib-commonjs/contexts/useFieldControlProps.js +71 -0
  52. package/lib-commonjs/contexts/useFieldControlProps.js.map +1 -0
  53. package/lib-commonjs/index.js +24 -29
  54. package/lib-commonjs/index.js.map +1 -1
  55. package/lib-commonjs/util/makeDeprecatedField.js +61 -0
  56. package/lib-commonjs/util/makeDeprecatedField.js.map +1 -0
  57. package/package.json +15 -13
  58. package/Spec.md +0 -354
  59. package/lib/components/Field/SlotComponent.types.js +0 -2
  60. package/lib/components/Field/SlotComponent.types.js.map +0 -1
  61. package/lib-commonjs/components/Field/SlotComponent.types.js +0 -6
  62. package/lib-commonjs/components/Field/SlotComponent.types.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["components/Field/useField.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type {\n FieldConfig,\n FieldControl,\n FieldProps,\n FieldPropsWithOptionalComponentProps,\n FieldState,\n} from './Field.types';\n\nconst validationMessageIcons = {\n error: <ErrorCircle12Filled />,\n warning: <Warning12Filled />,\n success: <CheckmarkCircle12Filled />,\n} as const;\n\n/**\n * Partition the props used by the Field itself, from the props that are passed to the underlying field component.\n */\nexport const getPartitionedFieldProps = <Props extends FieldProps<FieldControl>>(props: Props) => {\n const {\n className,\n control,\n hint,\n label,\n orientation,\n root,\n style,\n validationMessage,\n validationMessageIcon,\n validationState,\n ...restOfProps\n } = props;\n\n const fieldProps = {\n className,\n control,\n hint,\n label,\n orientation,\n root,\n style,\n validationMessage,\n validationMessageIcon,\n validationState,\n };\n\n return [fieldProps, restOfProps] as const;\n};\n\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the control slot (primary slot)\n * @param params - Configuration parameters for this Field\n */\nexport const useField_unstable = <T extends FieldControl>(\n props: FieldPropsWithOptionalComponentProps<T>,\n ref: React.Ref<HTMLElement>,\n params: FieldConfig<T>,\n): FieldState<T> => {\n const [fieldProps, controlProps] = getPartitionedFieldProps(props);\n const { orientation = 'vertical', validationState } = fieldProps;\n const { labelConnection = 'htmlFor', ariaInvalidOnError = true } = params;\n\n const baseId = useId('field-');\n\n const root = resolveShorthand(fieldProps.root, {\n required: true,\n defaultProps: getNativeElementProps('div', fieldProps),\n });\n\n const control = resolveShorthand(fieldProps.control, {\n required: true,\n defaultProps: {\n ref,\n id: baseId + '__control',\n ...controlProps,\n },\n });\n\n const label = resolveShorthand(fieldProps.label, {\n defaultProps: {\n id: baseId + '__label',\n required: controlProps.required,\n size: typeof controlProps.size === 'string' ? controlProps.size : undefined,\n htmlFor: labelConnection === 'htmlFor' ? control.id : undefined,\n },\n });\n\n const validationMessage = resolveShorthand(fieldProps.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n },\n });\n\n const hint = resolveShorthand(fieldProps.hint, {\n defaultProps: {\n id: baseId + '__hint',\n },\n });\n\n const validationMessageIcon = resolveShorthand(fieldProps.validationMessageIcon, {\n required: !!validationState,\n defaultProps: {\n children: validationState ? validationMessageIcons[validationState] : undefined,\n },\n });\n\n // Hook up aria props on the control\n if (label && labelConnection === 'aria-labelledby') {\n control['aria-labelledby'] ??= label.id;\n }\n\n if (validationState === 'error' && ariaInvalidOnError) {\n control['aria-invalid'] ??= true;\n if (validationMessage) {\n control['aria-errormessage'] ??= validationMessage.id;\n }\n if (hint) {\n control['aria-describedby'] ??= hint.id;\n }\n } else {\n // If the state is not an error, then the control is described by the validation message, or hint, or both\n const describedby = validationMessage || hint;\n if (describedby) {\n control['aria-describedby'] ??= validationMessage && hint ? `${validationMessage.id} ${hint.id}` : describedby.id;\n }\n }\n\n const state: FieldState<FieldControl> = {\n orientation,\n validationState,\n classNames: params.classNames,\n components: {\n root: 'div',\n control: params.component,\n label: Label,\n validationMessage: 'div',\n validationMessageIcon: 'span',\n hint: 'div',\n },\n root,\n control,\n label,\n validationMessageIcon,\n validationMessage,\n hint,\n };\n\n return state as FieldState<T>;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["../../../lib/components/Field/useField.js"],"sourcesContent":["import * as React from 'react';\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nconst validationMessageIcons = {\n error: /*#__PURE__*/React.createElement(ErrorCircle12Filled, null),\n warning: /*#__PURE__*/React.createElement(Warning12Filled, null),\n success: /*#__PURE__*/React.createElement(CheckmarkCircle12Filled, null),\n none: undefined\n};\n/**\n * Create the state required to render Field.\n *\n * The returned state can be modified with hooks such as useFieldStyles_unstable,\n * before being passed to renderField_unstable.\n *\n * @param props - Props passed to this field\n * @param ref - Ref to the root\n */\nexport const useField_unstable = (props, ref) => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium'\n } = props;\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n const root = getNativeElementProps('div', {\n ...props,\n ref\n }, /*excludedPropNames:*/['children']);\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: generatedControlId,\n id: baseId + '__label',\n required,\n size\n }\n });\n const validationMessage = resolveShorthand(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' ? 'alert' : undefined\n }\n });\n const hint = resolveShorthand(props.hint, {\n defaultProps: {\n id: baseId + '__hint'\n }\n });\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n required: !!defaultIcon,\n defaultProps: {\n children: defaultIcon\n }\n });\n return {\n children,\n generatedControlId,\n orientation,\n required,\n size,\n validationState,\n components: {\n root: 'div',\n label: Label,\n validationMessage: 'div',\n validationMessageIcon: 'span',\n hint: 'div'\n },\n root,\n label,\n validationMessageIcon,\n validationMessage,\n hint\n };\n};\n//# sourceMappingURL=useField.js.map"],"names":["useField_unstable","validationMessageIcons","error","React","createElement","ErrorCircle12Filled","warning","Warning12Filled","success","CheckmarkCircle12Filled","none","undefined","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","useId","generatedControlId","root","getNativeElementProps","label","resolveShorthand","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","components","Label"],"mappings":";;;;+BAmBaA;;aAAAA;;;6DAnBU;4BACuD;4BACxD;gCACyC;AAC/D,MAAMC,yBAAyB;IAC7BC,OAAO,WAAW,GAAEC,OAAMC,aAAa,CAACC,+BAAmB,EAAE,IAAI;IACjEC,SAAS,WAAW,GAAEH,OAAMC,aAAa,CAACG,2BAAe,EAAE,IAAI;IAC/DC,SAAS,WAAW,GAAEL,OAAMC,aAAa,CAACK,mCAAuB,EAAE,IAAI;IACvEC,MAAMC;AACR;AAUO,MAAMX,oBAAoB,CAACY,OAAOC,MAAQ;IAC/C,MAAM,EACJC,SAAQ,EACRC,aAAc,WAAU,EACxBC,UAAW,KAAK,CAAA,EAChBC,iBAAkBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,CAAA,EAC5DC,MAAO,SAAQ,EAChB,GAAGP;IACJ,MAAMQ,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAMC,qBAAqBF,SAAS;IACpC,MAAMG,OAAOC,IAAAA,qCAAqB,EAAC,OAAO;QACxC,GAAGZ,KAAK;QACRC;IACF,GAAG,oBAAoB,GAAE;QAAC;KAAW;IACrC,MAAMY,QAAQC,IAAAA,gCAAgB,EAACd,MAAMa,KAAK,EAAE;QAC1CE,cAAc;YACZC,SAASN;YACTO,IAAIT,SAAS;YACbJ;YACAG;QACF;IACF;IACA,MAAMD,oBAAoBQ,IAAAA,gCAAgB,EAACd,MAAMM,iBAAiB,EAAE;QAClES,cAAc;YACZE,IAAIT,SAAS;YACbU,MAAMb,oBAAoB,UAAU,UAAUN,SAAS;QACzD;IACF;IACA,MAAMoB,OAAOL,IAAAA,gCAAgB,EAACd,MAAMmB,IAAI,EAAE;QACxCJ,cAAc;YACZE,IAAIT,SAAS;QACf;IACF;IACA,MAAMY,cAAc/B,sBAAsB,CAACgB,gBAAgB;IAC3D,MAAMgB,wBAAwBP,IAAAA,gCAAgB,EAACd,MAAMqB,qBAAqB,EAAE;QAC1EjB,UAAU,CAAC,CAACgB;QACZL,cAAc;YACZb,UAAUkB;QACZ;IACF;IACA,OAAO;QACLlB;QACAQ;QACAP;QACAC;QACAG;QACAF;QACAiB,YAAY;YACVX,MAAM;YACNE,OAAOU,iBAAK;YACZjB,mBAAmB;YACnBe,uBAAuB;YACvBF,MAAM;QACR;QACAR;QACAE;QACAQ;QACAf;QACAa;IACF;AACF,GACA,oCAAoC"}
@@ -1,134 +1,154 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- exports.useFieldStyles_unstable = exports.getFieldClassNames = void 0;
7
-
8
- const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
9
-
10
- const react_1 = /*#__PURE__*/require("@griffel/react");
11
-
12
- const getFieldClassNames = name => ({
13
- root: `fui-${name}`,
14
- control: `fui-${name}__control`,
15
- label: `fui-${name}__label`,
16
- validationMessage: `fui-${name}__validationMessage`,
17
- validationMessageIcon: `fui-${name}__validationMessageIcon`,
18
- hint: `fui-${name}__hint`
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ fieldClassNames: ()=>fieldClassNames,
13
+ useFieldStyles_unstable: ()=>useFieldStyles_unstable
19
14
  });
20
-
21
- exports.getFieldClassNames = getFieldClassNames;
15
+ const _react = require("@griffel/react");
16
+ const fieldClassNames = {
17
+ root: `fui-Field`,
18
+ label: `fui-Field__label`,
19
+ validationMessage: `fui-Field__validationMessage`,
20
+ validationMessageIcon: `fui-Field__validationMessageIcon`,
21
+ hint: `fui-Field__hint`
22
+ };
23
+ // Size of the icon in the validation message
24
+ const iconSize = '12px';
22
25
  /**
23
26
  * Styles for the root slot
24
- */
25
-
26
- const useRootStyles = /*#__PURE__*/react_1.__styles({
27
- "base": {
28
- "mc9l5x": "f13qh94s",
29
- "Bxotwcr": "f14np9u9",
30
- "B7hvi0a": "f1m2n5bn"
31
- },
32
- "horizontal": {
33
- "wkccdc": "fai812u",
34
- "Budl1dq": "fckz59x"
35
- },
36
- "secondColumn": {
37
- "Br312pm": "fd46tj4"
38
- }
27
+ */ const useRootStyles = /*#__PURE__*/ (0, _react["__styles"])({
28
+ base: {
29
+ mc9l5x: "f13qh94s"
30
+ },
31
+ horizontal: {
32
+ Budl1dq: "f2wwaib",
33
+ wkccdc: "f1645dqt"
34
+ },
35
+ horizontalNoLabel: {
36
+ uwmqm3: [
37
+ "f15jqgz8",
38
+ "fggqkej"
39
+ ],
40
+ Budl1dq: "f1c2z91y"
41
+ }
39
42
  }, {
40
- "d": [".f13qh94s{display:grid;}", ".f14np9u9{grid-auto-flow:row;}", ".f1m2n5bn{justify-items:start;}", ".fai812u{grid-template-rows:auto auto auto auto;}", ".fckz59x{grid-template-columns:1fr 2fr;}", ".fd46tj4{grid-column-start:2;}"]
43
+ d: [
44
+ ".f13qh94s{display:grid;}",
45
+ ".f2wwaib{grid-template-columns:33% 1fr;}",
46
+ ".f1645dqt{grid-template-rows:auto auto auto 1fr;}",
47
+ ".f15jqgz8{padding-left:33%;}",
48
+ ".fggqkej{padding-right:33%;}",
49
+ ".f1c2z91y{grid-template-columns:1fr;}"
50
+ ]
41
51
  });
42
-
43
- const useLabelStyles = /*#__PURE__*/react_1.__styles({
44
- "base": {
45
- "B6of3ja": "fg30ohd",
46
- "jrapky": "fyacil5"
47
- },
48
- "horizontal": {
49
- "Ijaq50": "f16hsg94",
50
- "nk6f5a": "f1nzqi2z",
51
- "t21cq0": ["fkujibs", "f199hnxi"],
52
- "qb2dma": "f9h729m",
53
- "Bdqf98w": "fhb5wj7"
54
- }
52
+ const useLabelStyles = /*#__PURE__*/ (0, _react["__styles"])({
53
+ base: {
54
+ z8tnut: "fclwglc",
55
+ Byoj8tv: "fywfov9"
56
+ },
57
+ large: {
58
+ z8tnut: "f1sl3k7w",
59
+ Byoj8tv: "f1brlhvm"
60
+ },
61
+ vertical: {
62
+ jrapky: "fyacil5"
63
+ },
64
+ verticalLarge: {
65
+ jrapky: "f8l5zjj"
66
+ },
67
+ horizontal: {
68
+ t21cq0: [
69
+ "fkujibs",
70
+ "f199hnxi"
71
+ ],
72
+ Ijaq50: "f16hsg94",
73
+ nk6f5a: "f1nzqi2z"
74
+ }
55
75
  }, {
56
- "d": [".fg30ohd{margin-top:var(--spacingVerticalXXS);}", ".fyacil5{margin-bottom:var(--spacingVerticalXXS);}", ".f16hsg94{grid-row-start:1;}", ".f1nzqi2z{grid-row-end:-1;}", ".fkujibs{margin-right:var(--spacingHorizontalM);}", ".f199hnxi{margin-left:var(--spacingHorizontalM);}", ".f9h729m{-webkit-align-self:start;-ms-flex-item-align:start;align-self:start;}", ".fhb5wj7{justify-self:stretch;}"]
76
+ d: [
77
+ ".fclwglc{padding-top:var(--spacingVerticalXXS);}",
78
+ ".fywfov9{padding-bottom:var(--spacingVerticalXXS);}",
79
+ ".f1sl3k7w{padding-top:1px;}",
80
+ ".f1brlhvm{padding-bottom:1px;}",
81
+ ".fyacil5{margin-bottom:var(--spacingVerticalXXS);}",
82
+ ".f8l5zjj{margin-bottom:var(--spacingVerticalXS);}",
83
+ ".fkujibs{margin-right:var(--spacingHorizontalM);}",
84
+ ".f199hnxi{margin-left:var(--spacingHorizontalM);}",
85
+ ".f16hsg94{grid-row-start:1;}",
86
+ ".f1nzqi2z{grid-row-end:-1;}"
87
+ ]
57
88
  });
58
-
59
- const useSecondaryTextStyles = /*#__PURE__*/react_1.__styles({
60
- "base": {
61
- "B6of3ja": "fg30ohd",
62
- "sj55zd": "f11d4kpn",
63
- "Bahqtrf": "fk6fouc",
64
- "Be2twd7": "fy9rknc",
65
- "Bhrd7zp": "figsok6",
66
- "Bg96gwp": "fwrc4pm"
67
- },
68
- "error": {
69
- "sj55zd": "f1hcrxcs"
70
- }
89
+ const useSecondaryTextBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("r5c4z9l", null, [
90
+ ".r5c4z9l{margin-top:var(--spacingVerticalXXS);color:var(--colorNeutralForeground3);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);}"
91
+ ]);
92
+ const useSecondaryTextStyles = /*#__PURE__*/ (0, _react["__styles"])({
93
+ error: {
94
+ sj55zd: "f1hcrxcs"
95
+ },
96
+ withIcon: {
97
+ uwmqm3: [
98
+ "frawy03",
99
+ "fg4c52"
100
+ ]
101
+ }
71
102
  }, {
72
- "d": [".fg30ohd{margin-top:var(--spacingVerticalXXS);}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}"]
103
+ d: [
104
+ ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
105
+ ".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}",
106
+ ".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}"
107
+ ]
73
108
  });
74
-
75
- const useValidationMessageIconStyles = /*#__PURE__*/react_1.__styles({
76
- "base": {
77
- "Be2twd7": "f1ugzwwg",
78
- "Bg96gwp": "fp4gqsa",
79
- "ha4doy": "fmrv4ls",
80
- "t21cq0": ["fm0x6gh", "fbyavb5"]
81
- },
82
- "error": {
83
- "sj55zd": "f1hcrxcs"
84
- },
85
- "warning": {
86
- "sj55zd": "f1k5f75o"
87
- },
88
- "success": {
89
- "sj55zd": "ffmvakt"
90
- }
109
+ const useValidationMessageIconBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("ra7h1uk", "r1rh6bd7", [
110
+ ".ra7h1uk{display:inline-block;font-size:12px;margin-left:calc(-12px - var(--spacingHorizontalXS));margin-right:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}",
111
+ ".r1rh6bd7{display:inline-block;font-size:12px;margin-right:calc(-12px - var(--spacingHorizontalXS));margin-left:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}"
112
+ ]);
113
+ const useValidationMessageIconStyles = /*#__PURE__*/ (0, _react["__styles"])({
114
+ error: {
115
+ sj55zd: "f1hcrxcs"
116
+ },
117
+ warning: {
118
+ sj55zd: "f1k5f75o"
119
+ },
120
+ success: {
121
+ sj55zd: "ffmvakt"
122
+ }
91
123
  }, {
92
- "d": [".f1ugzwwg{font-size:12px;}", ".fp4gqsa{line-height:12px;}", ".fmrv4ls{vertical-align:middle;}", ".fm0x6gh{margin-right:var(--spacingHorizontalXS);}", ".fbyavb5{margin-left:var(--spacingHorizontalXS);}", ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}", ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}", ".ffmvakt{color:var(--colorPaletteGreenForeground1);}"]
124
+ d: [
125
+ ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
126
+ ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}",
127
+ ".ffmvakt{color:var(--colorPaletteGreenForeground1);}"
128
+ ]
93
129
  });
94
- /**
95
- * Apply styling to the Field slots based on the state
96
- */
97
-
98
-
99
- const useFieldStyles_unstable = state => {
100
- const classNames = state.classNames;
101
- const validationState = state.validationState;
102
- const horizontal = state.orientation === 'horizontal';
103
- const rootStyles = useRootStyles();
104
- state.root.className = react_1.mergeClasses(classNames.root, rootStyles.base, horizontal && rootStyles.horizontal, state.root.className);
105
-
106
- if (state.control) {
107
- state.control.className = react_1.mergeClasses(classNames.control, horizontal && rootStyles.secondColumn, state.control.className);
108
- }
109
-
110
- const labelStyles = useLabelStyles();
111
-
112
- if (state.label) {
113
- state.label.className = react_1.mergeClasses(classNames.label, labelStyles.base, horizontal && labelStyles.horizontal, state.label.className);
114
- }
115
-
116
- const validationMessageIconStyles = useValidationMessageIconStyles();
117
-
118
- if (state.validationMessageIcon) {
119
- state.validationMessageIcon.className = react_1.mergeClasses(classNames.validationMessageIcon, validationMessageIconStyles.base, !!validationState && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
120
- }
121
-
122
- const secondaryTextStyles = useSecondaryTextStyles();
123
-
124
- if (state.validationMessage) {
125
- state.validationMessage.className = react_1.mergeClasses(classNames.validationMessage, secondaryTextStyles.base, horizontal && rootStyles.secondColumn, validationState === 'error' && secondaryTextStyles.error, state.validationMessage.className);
126
- }
127
-
128
- if (state.hint) {
129
- state.hint.className = react_1.mergeClasses(classNames.hint, secondaryTextStyles.base, horizontal && rootStyles.secondColumn, state.hint.className);
130
- }
131
- };
130
+ const useFieldStyles_unstable = (state)=>{
131
+ const { validationState } = state;
132
+ const horizontal = state.orientation === 'horizontal';
133
+ const rootStyles = useRootStyles();
134
+ state.root.className = (0, _react.mergeClasses)(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);
135
+ const labelStyles = useLabelStyles();
136
+ if (state.label) {
137
+ state.label.className = (0, _react.mergeClasses)(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, !horizontal && labelStyles.vertical, state.label.size === 'large' && labelStyles.large, !horizontal && state.label.size === 'large' && labelStyles.verticalLarge, state.label.className);
138
+ }
139
+ const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();
140
+ const validationMessageIconStyles = useValidationMessageIconStyles();
141
+ if (state.validationMessageIcon) {
142
+ state.validationMessageIcon.className = (0, _react.mergeClasses)(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);
143
+ }
144
+ const secondaryTextBaseClassName = useSecondaryTextBaseClassName();
145
+ const secondaryTextStyles = useSecondaryTextStyles();
146
+ if (state.validationMessage) {
147
+ state.validationMessage.className = (0, _react.mergeClasses)(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);
148
+ }
149
+ if (state.hint) {
150
+ state.hint.className = (0, _react.mergeClasses)(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);
151
+ }
152
+ }; //# sourceMappingURL=useFieldStyles.js.map
132
153
 
133
- exports.useFieldStyles_unstable = useFieldStyles_unstable;
134
154
  //# sourceMappingURL=useFieldStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["components/Field/useFieldStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { FieldControl, FieldProps, FieldSlots, FieldState } from './Field.types';\n\nexport const getFieldClassNames = (name: string): SlotClassNames<FieldSlots<FieldControl>> => ({\n root: `fui-${name}`,\n control: `fui-${name}__control`,\n label: `fui-${name}__label`,\n validationMessage: `fui-${name}__validationMessage`,\n validationMessageIcon: `fui-${name}__validationMessageIcon`,\n hint: `fui-${name}__hint`,\n});\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n base: {\n display: 'grid',\n gridAutoFlow: 'row',\n justifyItems: 'start',\n },\n\n horizontal: {\n gridTemplateRows: 'auto auto auto auto',\n gridTemplateColumns: '1fr 2fr',\n },\n\n secondColumn: {\n gridColumnStart: '2',\n },\n});\n\nconst useLabelStyles = makeStyles({\n base: {\n marginTop: tokens.spacingVerticalXXS,\n marginBottom: tokens.spacingVerticalXXS,\n },\n\n horizontal: {\n gridRowStart: '1',\n gridRowEnd: '-1',\n marginRight: tokens.spacingHorizontalM,\n alignSelf: 'start',\n justifySelf: 'stretch',\n },\n});\n\nconst useSecondaryTextStyles = makeStyles({\n base: {\n marginTop: tokens.spacingVerticalXXS,\n color: tokens.colorNeutralForeground3,\n ...typographyStyles.caption1,\n },\n\n error: {\n color: tokens.colorPaletteRedForeground1,\n },\n});\n\nconst useValidationMessageIconStyles = makeStyles({\n base: {\n fontSize: '12px',\n lineHeight: '12px',\n verticalAlign: 'middle',\n marginRight: tokens.spacingHorizontalXS,\n },\n\n error: {\n color: tokens.colorPaletteRedForeground1,\n },\n warning: {\n color: tokens.colorPaletteDarkOrangeForeground1,\n },\n success: {\n color: tokens.colorPaletteGreenForeground1,\n },\n});\n\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = <T extends FieldControl>(state: FieldState<T>) => {\n const classNames = state.classNames;\n const validationState: FieldProps<FieldControl>['validationState'] = state.validationState;\n const horizontal = state.orientation === 'horizontal';\n\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(\n classNames.root,\n rootStyles.base,\n horizontal && rootStyles.horizontal,\n state.root.className,\n );\n\n if (state.control) {\n state.control.className = mergeClasses(\n classNames.control,\n horizontal && rootStyles.secondColumn,\n state.control.className,\n );\n }\n\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(\n classNames.label,\n labelStyles.base,\n horizontal && labelStyles.horizontal,\n state.label.className,\n );\n }\n\n const validationMessageIconStyles = useValidationMessageIconStyles();\n if (state.validationMessageIcon) {\n state.validationMessageIcon.className = mergeClasses(\n classNames.validationMessageIcon,\n validationMessageIconStyles.base,\n !!validationState && validationMessageIconStyles[validationState],\n state.validationMessageIcon.className,\n );\n }\n\n const secondaryTextStyles = useSecondaryTextStyles();\n if (state.validationMessage) {\n state.validationMessage.className = mergeClasses(\n classNames.validationMessage,\n secondaryTextStyles.base,\n horizontal && rootStyles.secondColumn,\n validationState === 'error' && secondaryTextStyles.error,\n state.validationMessage.className,\n );\n }\n\n if (state.hint) {\n state.hint.className = mergeClasses(\n classNames.hint,\n secondaryTextStyles.base,\n horizontal && rootStyles.secondColumn,\n state.hint.className,\n );\n }\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["../../../lib/components/Field/useFieldStyles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { __resetStyles, __styles, mergeClasses } from '@griffel/react';\nexport const fieldClassNames = {\n root: `fui-Field`,\n label: `fui-Field__label`,\n validationMessage: `fui-Field__validationMessage`,\n validationMessageIcon: `fui-Field__validationMessageIcon`,\n hint: `fui-Field__hint`\n};\n// Size of the icon in the validation message\nconst iconSize = '12px';\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n base: {\n mc9l5x: \"f13qh94s\"\n },\n horizontal: {\n Budl1dq: \"f2wwaib\",\n wkccdc: \"f1645dqt\"\n },\n horizontalNoLabel: {\n uwmqm3: [\"f15jqgz8\", \"fggqkej\"],\n Budl1dq: \"f1c2z91y\"\n }\n}, {\n d: [\".f13qh94s{display:grid;}\", \".f2wwaib{grid-template-columns:33% 1fr;}\", \".f1645dqt{grid-template-rows:auto auto auto 1fr;}\", \".f15jqgz8{padding-left:33%;}\", \".fggqkej{padding-right:33%;}\", \".f1c2z91y{grid-template-columns:1fr;}\"]\n});\nconst useLabelStyles = /*#__PURE__*/__styles({\n base: {\n z8tnut: \"fclwglc\",\n Byoj8tv: \"fywfov9\"\n },\n large: {\n z8tnut: \"f1sl3k7w\",\n Byoj8tv: \"f1brlhvm\"\n },\n vertical: {\n jrapky: \"fyacil5\"\n },\n verticalLarge: {\n jrapky: \"f8l5zjj\"\n },\n horizontal: {\n t21cq0: [\"fkujibs\", \"f199hnxi\"],\n Ijaq50: \"f16hsg94\",\n nk6f5a: \"f1nzqi2z\"\n }\n}, {\n d: [\".fclwglc{padding-top:var(--spacingVerticalXXS);}\", \".fywfov9{padding-bottom:var(--spacingVerticalXXS);}\", \".f1sl3k7w{padding-top:1px;}\", \".f1brlhvm{padding-bottom:1px;}\", \".fyacil5{margin-bottom:var(--spacingVerticalXXS);}\", \".f8l5zjj{margin-bottom:var(--spacingVerticalXS);}\", \".fkujibs{margin-right:var(--spacingHorizontalM);}\", \".f199hnxi{margin-left:var(--spacingHorizontalM);}\", \".f16hsg94{grid-row-start:1;}\", \".f1nzqi2z{grid-row-end:-1;}\"]\n});\nconst useSecondaryTextBaseClassName = /*#__PURE__*/__resetStyles(\"r5c4z9l\", null, [\".r5c4z9l{margin-top:var(--spacingVerticalXXS);color:var(--colorNeutralForeground3);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);}\"]);\nconst useSecondaryTextStyles = /*#__PURE__*/__styles({\n error: {\n sj55zd: \"f1hcrxcs\"\n },\n withIcon: {\n uwmqm3: [\"frawy03\", \"fg4c52\"]\n }\n}, {\n d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".frawy03{padding-left:calc(12px + var(--spacingHorizontalXS));}\", \".fg4c52{padding-right:calc(12px + var(--spacingHorizontalXS));}\"]\n});\nconst useValidationMessageIconBaseClassName = /*#__PURE__*/__resetStyles(\"ra7h1uk\", \"r1rh6bd7\", [\".ra7h1uk{display:inline-block;font-size:12px;margin-left:calc(-12px - var(--spacingHorizontalXS));margin-right:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}\", \".r1rh6bd7{display:inline-block;font-size:12px;margin-right:calc(-12px - var(--spacingHorizontalXS));margin-left:var(--spacingHorizontalXS);line-height:0;vertical-align:-1px;}\"]);\nconst useValidationMessageIconStyles = /*#__PURE__*/__styles({\n error: {\n sj55zd: \"f1hcrxcs\"\n },\n warning: {\n sj55zd: \"f1k5f75o\"\n },\n success: {\n sj55zd: \"ffmvakt\"\n }\n}, {\n d: [\".f1hcrxcs{color:var(--colorPaletteRedForeground1);}\", \".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}\", \".ffmvakt{color:var(--colorPaletteGreenForeground1);}\"]\n});\n/**\n * Apply styling to the Field slots based on the state\n */\nexport const useFieldStyles_unstable = state => {\n const {\n validationState\n } = state;\n const horizontal = state.orientation === 'horizontal';\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(fieldClassNames.root, rootStyles.base, horizontal && rootStyles.horizontal, horizontal && !state.label && rootStyles.horizontalNoLabel, state.root.className);\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(fieldClassNames.label, labelStyles.base, horizontal && labelStyles.horizontal, !horizontal && labelStyles.vertical, state.label.size === 'large' && labelStyles.large, !horizontal && state.label.size === 'large' && labelStyles.verticalLarge, state.label.className);\n }\n const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n const validationMessageIconStyles = useValidationMessageIconStyles();\n if (state.validationMessageIcon) {\n state.validationMessageIcon.className = mergeClasses(fieldClassNames.validationMessageIcon, validationMessageIconBaseClassName, validationState !== 'none' && validationMessageIconStyles[validationState], state.validationMessageIcon.className);\n }\n const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n const secondaryTextStyles = useSecondaryTextStyles();\n if (state.validationMessage) {\n state.validationMessage.className = mergeClasses(fieldClassNames.validationMessage, secondaryTextBaseClassName, validationState === 'error' && secondaryTextStyles.error, !!state.validationMessageIcon && secondaryTextStyles.withIcon, state.validationMessage.className);\n }\n if (state.hint) {\n state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n }\n};\n//# sourceMappingURL=useFieldStyles.js.map"],"names":["fieldClassNames","useFieldStyles_unstable","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","__styles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","__resetStyles","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","state","validationState","orientation","rootStyles","className","mergeClasses","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"mappings":"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"}
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ FieldContextProvider: ()=>FieldContextProvider,
13
+ useFieldContext_unstable: ()=>useFieldContext_unstable
14
+ });
15
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
16
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
17
+ const FieldContext = /*#__PURE__*/ _react.createContext(undefined);
18
+ const FieldContextProvider = FieldContext.Provider;
19
+ const useFieldContext_unstable = ()=>_react.useContext(FieldContext); //# sourceMappingURL=FieldContext.js.map
20
+
21
+ //# sourceMappingURL=FieldContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../lib/contexts/FieldContext.js"],"sourcesContent":["import * as React from 'react';\nconst FieldContext = /*#__PURE__*/React.createContext(undefined);\nexport const FieldContextProvider = FieldContext.Provider;\nexport const useFieldContext_unstable = () => React.useContext(FieldContext);\n//# sourceMappingURL=FieldContext.js.map"],"names":["FieldContextProvider","useFieldContext_unstable","FieldContext","React","createContext","undefined","Provider","useContext"],"mappings":";;;;;;;;;;;IAEaA,oBAAoB,MAApBA;IACAC,wBAAwB,MAAxBA;;;6DAHU;AACvB,MAAMC,eAAe,WAAW,GAAEC,OAAMC,aAAa,CAACC;AAC/C,MAAML,uBAAuBE,aAAaI,QAAQ;AAClD,MAAML,2BAA2B,IAAME,OAAMI,UAAU,CAACL,eAC/D,wCAAwC"}
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./FieldContext"), exports);
7
+ _exportStar(require("./useFieldContextValues"), exports);
8
+ _exportStar(require("./useFieldControlProps"), exports);
9
+ //# sourceMappingURL=index.js.map
10
+
11
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../lib/contexts/index.js"],"sourcesContent":["export * from './FieldContext';\nexport * from './useFieldContextValues';\nexport * from './useFieldControlProps';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;CACd,iCAAiC"}
@@ -0,0 +1,44 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useFieldContextValues_unstable", {
6
+ enumerable: true,
7
+ get: ()=>useFieldContextValues_unstable
8
+ });
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
+ const useFieldContextValues_unstable = (state)=>{
12
+ var _state_label, _state_label1, _state_validationMessage, _state_hint;
13
+ const { generatedControlId , orientation , required , size , validationState } = state;
14
+ const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;
15
+ const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;
16
+ const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;
17
+ const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;
18
+ const field = _react.useMemo(()=>({
19
+ generatedControlId,
20
+ hintId,
21
+ labelFor,
22
+ labelId,
23
+ orientation,
24
+ required,
25
+ size,
26
+ validationMessageId,
27
+ validationState
28
+ }), [
29
+ generatedControlId,
30
+ hintId,
31
+ labelFor,
32
+ labelId,
33
+ orientation,
34
+ required,
35
+ size,
36
+ validationMessageId,
37
+ validationState
38
+ ]);
39
+ return {
40
+ field
41
+ };
42
+ }; //# sourceMappingURL=useFieldContextValues.js.map
43
+
44
+ //# sourceMappingURL=useFieldContextValues.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../lib/contexts/useFieldContextValues.js"],"sourcesContent":["import * as React from 'react';\n/**\n * Get the context values used when rendering Field.\n */\nexport const useFieldContextValues_unstable = state => {\n var _state_label, _state_label1, _state_validationMessage, _state_hint;\n const {\n generatedControlId,\n orientation,\n required,\n size,\n validationState\n } = state;\n const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;\n const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;\n const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;\n const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;\n const field = React.useMemo(() => ({\n generatedControlId,\n hintId,\n labelFor,\n labelId,\n orientation,\n required,\n size,\n validationMessageId,\n validationState\n }), [generatedControlId, hintId, labelFor, labelId, orientation, required, size, validationMessageId, validationState]);\n return {\n field\n };\n};\n//# sourceMappingURL=useFieldContextValues.js.map"],"names":["useFieldContextValues_unstable","state","_state_label","_state_label1","_state_validationMessage","_state_hint","generatedControlId","orientation","required","size","validationState","labelFor","label","htmlFor","labelId","id","validationMessageId","validationMessage","hintId","hint","field","React","useMemo"],"mappings":";;;;+BAIaA;;aAAAA;;;6DAJU;AAIhB,MAAMA,iCAAiCC,CAAAA,QAAS;IACrD,IAAIC,cAAcC,eAAeC,0BAA0BC;IAC3D,MAAM,EACJC,mBAAkB,EAClBC,YAAW,EACXC,SAAQ,EACRC,KAAI,EACJC,gBAAe,EAChB,GAAGT;IACJ,MAAMU,WAAW,AAACT,CAAAA,eAAeD,MAAMW,KAAK,AAAD,MAAO,IAAI,IAAIV,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAaW,OAAO;IACjH,MAAMC,UAAU,AAACX,CAAAA,gBAAgBF,MAAMW,KAAK,AAAD,MAAO,IAAI,IAAIT,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcY,EAAE;IAC9G,MAAMC,sBAAsB,AAACZ,CAAAA,2BAA2BH,MAAMgB,iBAAiB,AAAD,MAAO,IAAI,IAAIb,6BAA6B,KAAK,IAAI,KAAK,IAAIA,yBAAyBW,EAAE;IACvK,MAAMG,SAAS,AAACb,CAAAA,cAAcJ,MAAMkB,IAAI,AAAD,MAAO,IAAI,IAAId,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYU,EAAE;IACtG,MAAMK,QAAQC,OAAMC,OAAO,CAAC,IAAO,CAAA;YACjChB;YACAY;YACAP;YACAG;YACAP;YACAC;YACAC;YACAO;YACAN;QACF,CAAA,GAAI;QAACJ;QAAoBY;QAAQP;QAAUG;QAASP;QAAaC;QAAUC;QAAMO;QAAqBN;KAAgB;IACtH,OAAO;QACLU;IACF;AACF,GACA,iDAAiD"}
@@ -0,0 +1,71 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ useFieldControlProps_unstable: ()=>useFieldControlProps_unstable,
13
+ getFieldControlProps: ()=>getFieldControlProps
14
+ });
15
+ const _fieldContext = require("./FieldContext");
16
+ var _props, _props1, _arialabelledby, _props2, _ariainvalid, _props3, _props4, _ariarequired, _props5;
17
+ function useFieldControlProps_unstable(props, options) {
18
+ return getFieldControlProps((0, _fieldContext.useFieldContext_unstable)(), props, options);
19
+ }
20
+ function getFieldControlProps(context, props, options) {
21
+ if (!context) {
22
+ return props;
23
+ }
24
+ // Create a copy of props so we don't modify the original
25
+ props = {
26
+ ...props
27
+ };
28
+ const { generatedControlId , hintId , labelFor , labelId , required , validationMessageId , validationState } = context;
29
+ if (generatedControlId) {
30
+ var _id;
31
+ (_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;
32
+ }
33
+ // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer
34
+ // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).
35
+ if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {
36
+ var _;
37
+ (_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;
38
+ }
39
+ // The control is described by the validation message, or hint, or both.
40
+ // We also preserve and append any aria-describedby from props.
41
+ // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933
42
+ if (validationMessageId || hintId) {
43
+ // NOTE: Not using ??= since we're merging and overriding the user-provided value.
44
+ props['aria-describedby'] = [
45
+ validationMessageId,
46
+ hintId,
47
+ props === null || props === void 0 ? void 0 : props['aria-describedby']
48
+ ].filter(Boolean).join(' ');
49
+ }
50
+ if (validationState === 'error') {
51
+ var _1;
52
+ (_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;
53
+ }
54
+ if (required) {
55
+ if (options === null || options === void 0 ? void 0 : options.supportsRequired) {
56
+ var _required;
57
+ (_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;
58
+ } else {
59
+ var _2;
60
+ (_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;
61
+ }
62
+ }
63
+ // Include the size prop if this control supports it
64
+ if (options === null || options === void 0 ? void 0 : options.supportsSize) {
65
+ var _size;
66
+ (_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;
67
+ }
68
+ return props;
69
+ } //# sourceMappingURL=useFieldControlProps.js.map
70
+
71
+ //# sourceMappingURL=useFieldControlProps.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../lib/contexts/useFieldControlProps.js"],"sourcesContent":["var _props, _props1, _arialabelledby, _props2, _ariainvalid, _props3, _props4, _ariarequired, _props5;\nimport { useFieldContext_unstable } from './FieldContext';\nexport function useFieldControlProps_unstable(props, options) {\n return getFieldControlProps(useFieldContext_unstable(), props, options);\n}\n/**\n * @internal\n * Implementation of useFieldControlProps_unstable.\n * Split out so it can be used directly in renderField_unstable.\n */\nexport function getFieldControlProps(context, props, options) {\n if (!context) {\n return props;\n }\n // Create a copy of props so we don't modify the original\n props = {\n ...props\n };\n const {\n generatedControlId,\n hintId,\n labelFor,\n labelId,\n required,\n validationMessageId,\n validationState\n } = context;\n if (generatedControlId) {\n var _id;\n (_id = (_props = props).id) !== null && _id !== void 0 ? _id : _props.id = generatedControlId;\n }\n // Set aria-labelledby if the control doesn't support label.htmlFor, or if the label's htmlFor doesn't refer\n // to this control (i.e. the user set this control's id prop without also setting the Field's label.htmlFor).\n if (labelId && (!(options === null || options === void 0 ? void 0 : options.supportsLabelFor) || labelFor !== props.id)) {\n var _;\n (_ = (_props1 = props)[_arialabelledby = 'aria-labelledby']) !== null && _ !== void 0 ? _ : _props1[_arialabelledby] = labelId;\n }\n // The control is described by the validation message, or hint, or both.\n // We also preserve and append any aria-describedby from props.\n // For reference: https://github.com/microsoft/fluentui/pull/25580#discussion_r1017259933\n if (validationMessageId || hintId) {\n // NOTE: Not using ??= since we're merging and overriding the user-provided value.\n props['aria-describedby'] = [validationMessageId, hintId, props === null || props === void 0 ? void 0 : props['aria-describedby']].filter(Boolean).join(' ');\n }\n if (validationState === 'error') {\n var _1;\n (_1 = (_props2 = props)[_ariainvalid = 'aria-invalid']) !== null && _1 !== void 0 ? _1 : _props2[_ariainvalid] = true;\n }\n if (required) {\n if (options === null || options === void 0 ? void 0 : options.supportsRequired) {\n var _required;\n (_required = (_props3 = props).required) !== null && _required !== void 0 ? _required : _props3.required = true;\n } else {\n var _2;\n (_2 = (_props4 = props)[_ariarequired = 'aria-required']) !== null && _2 !== void 0 ? _2 : _props4[_ariarequired] = true;\n }\n }\n // Include the size prop if this control supports it\n if (options === null || options === void 0 ? void 0 : options.supportsSize) {\n var _size;\n (_size = (_props5 = props).size) !== null && _size !== void 0 ? _size : _props5.size = context.size;\n }\n return props;\n}\n//# sourceMappingURL=useFieldControlProps.js.map"],"names":["useFieldControlProps_unstable","getFieldControlProps","_props","_props1","_arialabelledby","_props2","_ariainvalid","_props3","_props4","_ariarequired","_props5","props","options","useFieldContext_unstable","context","generatedControlId","hintId","labelFor","labelId","required","validationMessageId","validationState","_id","id","supportsLabelFor","_","filter","Boolean","join","_1","supportsRequired","_required","_2","supportsSize","_size","size"],"mappings":"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"}
@@ -1,34 +1,29 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.useField_unstable = exports.useFieldStyles_unstable = exports.renderField_unstable = exports.getFieldClassNames = void 0;
7
-
8
- var Field_1 = /*#__PURE__*/require("./Field");
9
-
10
- Object.defineProperty(exports, "getFieldClassNames", {
11
- enumerable: true,
12
- get: function () {
13
- return Field_1.getFieldClassNames;
14
- }
3
+ value: true
15
4
  });
16
- Object.defineProperty(exports, "renderField_unstable", {
17
- enumerable: true,
18
- get: function () {
19
- return Field_1.renderField_unstable;
20
- }
21
- });
22
- Object.defineProperty(exports, "useFieldStyles_unstable", {
23
- enumerable: true,
24
- get: function () {
25
- return Field_1.useFieldStyles_unstable;
26
- }
27
- });
28
- Object.defineProperty(exports, "useField_unstable", {
29
- enumerable: true,
30
- get: function () {
31
- return Field_1.useField_unstable;
32
- }
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ Field: ()=>_field.Field,
13
+ fieldClassNames: ()=>_field.fieldClassNames,
14
+ renderField_unstable: ()=>_field.renderField_unstable,
15
+ useFieldStyles_unstable: ()=>_field.useFieldStyles_unstable,
16
+ useField_unstable: ()=>_field.useField_unstable,
17
+ FieldContextProvider: ()=>_index.FieldContextProvider,
18
+ useFieldContext_unstable: ()=>_index.useFieldContext_unstable,
19
+ useFieldContextValues_unstable: ()=>_index.useFieldContextValues_unstable,
20
+ useFieldControlProps_unstable: ()=>_index.useFieldControlProps_unstable,
21
+ getDeprecatedFieldClassNames: ()=>_makeDeprecatedField.getDeprecatedFieldClassNames,
22
+ makeDeprecatedField: ()=>_makeDeprecatedField.makeDeprecatedField
33
23
  });
24
+ const _field = require("./Field");
25
+ const _index = require("./contexts/index");
26
+ const _makeDeprecatedField = require("./util/makeDeprecatedField");
27
+ //# sourceMappingURL=index.js.map
28
+
34
29
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,oBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,kBAAA;EAAkB;AAAlB,CAAA;AAAoB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;AAAsB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AAAyB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA","sourcesContent":["export { getFieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type { FieldConfig, FieldControl, FieldProps, FieldSlots, FieldState } from './Field';\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["../lib/index.js"],"sourcesContent":["export { Field, fieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport { FieldContextProvider, useFieldContext_unstable, useFieldContextValues_unstable, useFieldControlProps_unstable } from './contexts/index';\n// eslint-disable-next-line deprecation/deprecation\nexport { getDeprecatedFieldClassNames, makeDeprecatedField } from './util/makeDeprecatedField';\n//# sourceMappingURL=index.js.map"],"names":["Field","fieldClassNames","renderField_unstable","useFieldStyles_unstable","useField_unstable","FieldContextProvider","useFieldContext_unstable","useFieldContextValues_unstable","useFieldControlProps_unstable","getDeprecatedFieldClassNames","makeDeprecatedField"],"mappings":";;;;;;;;;;;IAASA,KAAK,MAALA,YAAK;IAAEC,eAAe,MAAfA,sBAAe;IAAEC,oBAAoB,MAApBA,2BAAoB;IAAEC,uBAAuB,MAAvBA,8BAAuB;IAAEC,iBAAiB,MAAjBA,wBAAiB;IACxFC,oBAAoB,MAApBA,2BAAoB;IAAEC,wBAAwB,MAAxBA,+BAAwB;IAAEC,8BAA8B,MAA9BA,qCAA8B;IAAEC,6BAA6B,MAA7BA,oCAA6B;IAE7GC,4BAA4B,MAA5BA,iDAA4B;IAAEC,mBAAmB,MAAnBA,wCAAmB;;uBAH+C;uBACqB;qCAE5D;CAClE,iCAAiC"}