@fluentui/react-field 9.1.4 → 9.1.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (50) hide show
  1. package/CHANGELOG.json +79 -1
  2. package/CHANGELOG.md +28 -2
  3. package/lib/Field.js +0 -1
  4. package/lib/Field.js.map +1 -1
  5. package/lib/components/Field/Field.js +5 -6
  6. package/lib/components/Field/Field.js.map +1 -1
  7. package/lib/components/Field/Field.types.js +0 -1
  8. package/lib/components/Field/Field.types.js.map +1 -1
  9. package/lib/components/Field/index.js +0 -1
  10. package/lib/components/Field/index.js.map +1 -1
  11. package/lib/components/Field/renderField.js +10 -17
  12. package/lib/components/Field/renderField.js.map +1 -1
  13. package/lib/components/Field/useField.js +60 -66
  14. package/lib/components/Field/useField.js.map +1 -1
  15. package/lib/components/Field/useFieldStyles.styles.js.map +1 -1
  16. package/lib/contexts/FieldContext.js +2 -3
  17. package/lib/contexts/FieldContext.js.map +1 -1
  18. package/lib/contexts/index.js +0 -1
  19. package/lib/contexts/index.js.map +1 -1
  20. package/lib/contexts/useFieldContextValues.js +31 -29
  21. package/lib/contexts/useFieldContextValues.js.map +1 -1
  22. package/lib/contexts/useFieldControlProps.js +49 -55
  23. package/lib/contexts/useFieldControlProps.js.map +1 -1
  24. package/lib/index.js +0 -1
  25. package/lib/index.js.map +1 -1
  26. package/lib-commonjs/Field.js +0 -3
  27. package/lib-commonjs/Field.js.map +1 -1
  28. package/lib-commonjs/components/Field/Field.js +1 -3
  29. package/lib-commonjs/components/Field/Field.js.map +1 -1
  30. package/lib-commonjs/components/Field/Field.types.js +0 -3
  31. package/lib-commonjs/components/Field/Field.types.js.map +1 -1
  32. package/lib-commonjs/components/Field/index.js +0 -3
  33. package/lib-commonjs/components/Field/index.js.map +1 -1
  34. package/lib-commonjs/components/Field/renderField.js +1 -3
  35. package/lib-commonjs/components/Field/renderField.js.map +1 -1
  36. package/lib-commonjs/components/Field/useField.js +1 -3
  37. package/lib-commonjs/components/Field/useField.js.map +1 -1
  38. package/lib-commonjs/components/Field/useFieldStyles.styles.js +0 -2
  39. package/lib-commonjs/components/Field/useFieldStyles.styles.js.map +1 -1
  40. package/lib-commonjs/contexts/FieldContext.js +1 -3
  41. package/lib-commonjs/contexts/FieldContext.js.map +1 -1
  42. package/lib-commonjs/contexts/index.js +0 -3
  43. package/lib-commonjs/contexts/index.js.map +1 -1
  44. package/lib-commonjs/contexts/useFieldContextValues.js +1 -3
  45. package/lib-commonjs/contexts/useFieldContextValues.js.map +1 -1
  46. package/lib-commonjs/contexts/useFieldControlProps.js +1 -3
  47. package/lib-commonjs/contexts/useFieldControlProps.js.map +1 -1
  48. package/lib-commonjs/index.js +0 -3
  49. package/lib-commonjs/index.js.map +1 -1
  50. package/package.json +7 -7
package/CHANGELOG.json CHANGED
@@ -2,7 +2,85 @@
2
2
  "name": "@fluentui/react-field",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 24 May 2023 20:42:39 GMT",
5
+ "date": "Wed, 31 May 2023 06:42:56 GMT",
6
+ "tag": "@fluentui/react-field_v9.1.6",
7
+ "version": "9.1.6",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "seanmonahan@microsoft.com",
12
+ "package": "@fluentui/react-field",
13
+ "commit": "d640b972d7ac86bfb76ae6c6329f12cdd33b3b7c",
14
+ "comment": "chore: Update Griffel to v1.5.7."
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-field",
19
+ "comment": "Bump @fluentui/react-context-selector to v9.1.22",
20
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-field",
25
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6",
26
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-field",
31
+ "comment": "Bump @fluentui/react-label to v9.1.15",
32
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-field",
37
+ "comment": "Bump @fluentui/react-utilities to v9.9.2",
38
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
39
+ },
40
+ {
41
+ "author": "beachball",
42
+ "package": "@fluentui/react-field",
43
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22",
44
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
45
+ }
46
+ ]
47
+ }
48
+ },
49
+ {
50
+ "date": "Thu, 25 May 2023 10:00:48 GMT",
51
+ "tag": "@fluentui/react-field_v9.1.5",
52
+ "version": "9.1.5",
53
+ "comments": {
54
+ "patch": [
55
+ {
56
+ "author": "beachball",
57
+ "package": "@fluentui/react-field",
58
+ "comment": "Bump @fluentui/react-context-selector to v9.1.21",
59
+ "commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
60
+ },
61
+ {
62
+ "author": "beachball",
63
+ "package": "@fluentui/react-field",
64
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.5",
65
+ "commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
66
+ },
67
+ {
68
+ "author": "beachball",
69
+ "package": "@fluentui/react-field",
70
+ "comment": "Bump @fluentui/react-label to v9.1.14",
71
+ "commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
72
+ },
73
+ {
74
+ "author": "beachball",
75
+ "package": "@fluentui/react-field",
76
+ "comment": "Bump @fluentui/react-utilities to v9.9.1",
77
+ "commit": "8f7c1b7591b3e665ae39e1b22ab0f0b28fb795c4"
78
+ }
79
+ ]
80
+ }
81
+ },
82
+ {
83
+ "date": "Wed, 24 May 2023 20:45:27 GMT",
6
84
  "tag": "@fluentui/react-field_v9.1.4",
7
85
  "version": "9.1.4",
8
86
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,38 @@
1
1
  # Change Log - @fluentui/react-field
2
2
 
3
- This log was last generated on Wed, 24 May 2023 20:42:39 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 31 May 2023 06:42:56 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.1.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.6)
8
+
9
+ Wed, 31 May 2023 06:42:56 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.5..@fluentui/react-field_v9.1.6)
11
+
12
+ ### Patches
13
+
14
+ - chore: Update Griffel to v1.5.7. ([PR #27925](https://github.com/microsoft/fluentui/pull/27925) by seanmonahan@microsoft.com)
15
+ - Bump @fluentui/react-context-selector to v9.1.22 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
16
+ - Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
17
+ - Bump @fluentui/react-label to v9.1.15 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
18
+ - Bump @fluentui/react-utilities to v9.9.2 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
19
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
20
+
21
+ ## [9.1.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.5)
22
+
23
+ Thu, 25 May 2023 10:00:48 GMT
24
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.4..@fluentui/react-field_v9.1.5)
25
+
26
+ ### Patches
27
+
28
+ - Bump @fluentui/react-context-selector to v9.1.21 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
29
+ - Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.5 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
30
+ - Bump @fluentui/react-label to v9.1.14 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
31
+ - Bump @fluentui/react-utilities to v9.9.1 ([PR #27988](https://github.com/microsoft/fluentui/pull/27988) by beachball)
32
+
7
33
  ## [9.1.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.1.4)
8
34
 
9
- Wed, 24 May 2023 20:42:39 GMT
35
+ Wed, 24 May 2023 20:45:27 GMT
10
36
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.1.3..@fluentui/react-field_v9.1.4)
11
37
 
12
38
  ### Patches
package/lib/Field.js CHANGED
@@ -1,2 +1 @@
1
1
  export * from './components/Field/index';
2
- //# sourceMappingURL=Field.js.map
package/lib/Field.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../src/Field.ts"],"sourcesContent":["export * from './components/Field/index';\n"],"mappings":"AAAA,cAAc"}
1
+ {"version":3,"sources":["Field.ts"],"sourcesContent":["export * from './components/Field/index';\n"],"names":[],"mappings":"AAAA,cAAc,2BAA2B"}
@@ -3,11 +3,10 @@ import { renderField_unstable } from './renderField';
3
3
  import { useField_unstable } from './useField';
4
4
  import { useFieldStyles_unstable } from './useFieldStyles.styles';
5
5
  import { useFieldContextValues_unstable } from '../../contexts/index';
6
- export const Field = /*#__PURE__*/React.forwardRef((props, ref) => {
7
- const state = useField_unstable(props, ref);
8
- useFieldStyles_unstable(state);
9
- const context = useFieldContextValues_unstable(state);
10
- return renderField_unstable(state, context);
6
+ export const Field = /*#__PURE__*/ React.forwardRef((props, ref)=>{
7
+ const state = useField_unstable(props, ref);
8
+ useFieldStyles_unstable(state);
9
+ const context = useFieldContextValues_unstable(state);
10
+ return renderField_unstable(state, context);
11
11
  });
12
12
  Field.displayName = 'Field';
13
- //# sourceMappingURL=Field.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","Field","forwardRef","props","ref","state","context","displayName"],"sources":["../../../src/components/Field/Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n const state = useField_unstable(props, ref);\n useFieldStyles_unstable(state);\n const context = useFieldContextValues_unstable(state);\n return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAGvB,SAASC,oBAAoB,QAAQ;AACrC,SAASC,iBAAiB,QAAQ;AAClC,SAASC,uBAAuB,QAAQ;AACxC,SAASC,8BAA8B,QAAQ;AAE/C,OAAO,MAAMC,KAAA,gBAAyCL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrF,MAAMC,KAAA,GAAQP,iBAAA,CAAkBK,KAAA,EAAOC,GAAA;EACvCL,uBAAA,CAAwBM,KAAA;EACxB,MAAMC,OAAA,GAAUN,8BAAA,CAA+BK,KAAA;EAC/C,OAAOR,oBAAA,CAAqBQ,KAAA,EAAOC,OAAA;AACrC;AAEAL,KAAA,CAAMM,WAAW,GAAG"}
1
+ {"version":3,"sources":["Field.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { FieldProps } from './Field.types';\nimport { renderField_unstable } from './renderField';\nimport { useField_unstable } from './useField';\nimport { useFieldStyles_unstable } from './useFieldStyles.styles';\nimport { useFieldContextValues_unstable } from '../../contexts/index';\n\nexport const Field: ForwardRefComponent<FieldProps> = React.forwardRef((props, ref) => {\n const state = useField_unstable(props, ref);\n useFieldStyles_unstable(state);\n const context = useFieldContextValues_unstable(state);\n return renderField_unstable(state, context);\n});\n\nField.displayName = 'Field';\n"],"names":["React","renderField_unstable","useField_unstable","useFieldStyles_unstable","useFieldContextValues_unstable","Field","forwardRef","props","ref","state","context","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,8BAA8B,QAAQ,uBAAuB;AAEtE,OAAO,MAAMC,sBAAyCL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrF,MAAMC,QAAQP,kBAAkBK,OAAOC;IACvCL,wBAAwBM;IACxB,MAAMC,UAAUN,+BAA+BK;IAC/C,OAAOR,qBAAqBQ,OAAOC;AACrC,GAAG;AAEHL,MAAMM,WAAW,GAAG"}
@@ -1,2 +1 @@
1
1
  import * as React from 'react';
2
- //# sourceMappingURL=Field.types.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React"],"sources":["../../../src/components/Field/Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the control inside the Field.\n */\nexport type FieldControlProps = Pick<\n React.HTMLAttributes<HTMLElement>,\n 'id' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-required'\n>;\n\n/**\n * Slots of the Field component\n */\nexport type FieldSlots = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * The label associated with the field.\n */\n label?: Slot<typeof Label>;\n\n /**\n * A message about the validation state. By default, this is an error message, but it can be a success, warning,\n * or custom message by setting `validationState`.\n */\n validationMessage?: Slot<'div'>;\n\n /**\n * The icon associated with the `validationMessage`. This will only be displayed if `validationMessage` is set.\n *\n * The default depends on `validationState`:\n * * error: `<ErrorCircle12Filled />`\n * * warning: `<Warning12Filled />`\n * * success: `<CheckmarkCircle12Filled />`\n * * none: `null`\n */\n validationMessageIcon?: Slot<'span'>;\n\n /**\n * Additional hint text below the field.\n */\n hint?: Slot<'div'>;\n};\n\n/**\n * Field Props\n */\nexport type FieldProps = Omit<ComponentProps<FieldSlots>, 'children'> & {\n /**\n * The Field's child can be a single form control, or a render function that takes the props that should be spread on\n * a form control.\n *\n * All form controls in this library can be used directly as children (such as `<Input>` or `<RadioGroup>`).\n *\n * For other controls, there are two options:\n * 1. The child of Field can be a render function that is given the props that should be spread on the control.\n * `<Field>{(props) => <MyInput {...props} />}</Field>`\n * 2. The control itself can merge props from field with useFieldControlProps_unstable().\n * `props = useFieldControlProps_unstable(props);`\n */\n children?: React.ReactNode | ((props: FieldControlProps) => React.ReactNode);\n\n /**\n * The orientation of the label relative to the field component.\n * This only affects the label, and not the validationMessage or hint (which always appear below the field component).\n *\n * @default vertical\n */\n orientation?: 'vertical' | 'horizontal';\n\n /**\n * The `validationState` affects the display of the `validationMessage` and `validationMessageIcon`.\n *\n * * error: (default) The validation message has a red error icon and red text, with `role=\"alert\"` so it is\n * announced by screen readers. Additionally, the control inside the field has `aria-invalid` set, which adds a\n * red border to some field components (such as `Input`).\n * * success: The validation message has a green checkmark icon and gray text.\n * * warning: The validation message has a yellow exclamation icon and gray text.\n * * none: The validation message has no icon and gray text.\n *\n * @default error when validationMessage is set; none otherwise.\n */\n validationState?: 'error' | 'warning' | 'success' | 'none';\n\n /**\n * Marks the Field as required. If `true`, an asterisk will be appended to the label, and `aria-required` will be set\n * on the Field's child.\n */\n required?: boolean;\n\n /**\n * The size of the Field's label.\n *\n * @default medium\n */\n size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState = ComponentState<Required<FieldSlots>> &\n Required<Pick<FieldProps, 'orientation' | 'required' | 'size' | 'validationState'>> &\n Pick<FieldProps, 'children'> & {\n /**\n * The ID generated for the control inside the field, and the default value of label.htmlFor prop.\n */\n generatedControlId: string;\n };\n\nexport type FieldContextValue = Readonly<\n Pick<FieldState, 'generatedControlId' | 'orientation' | 'required' | 'size' | 'validationState'> & {\n /** The label's for prop. Undefined if there is no label. */\n labelFor?: string;\n /** The label's id prop. Undefined if there is no label. */\n labelId?: string;\n /** The validationMessage's id prop. Undefined if there is no validationMessage. */\n validationMessageId?: string;\n /** The hint's id prop. Undefined if there is no hint. */\n hintId?: string;\n }\n>;\n\nexport type FieldContextValues = {\n field: FieldContextValue;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
1
+ {"version":3,"sources":["Field.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * The props added to the control inside the Field.\n */\nexport type FieldControlProps = Pick<\n React.HTMLAttributes<HTMLElement>,\n 'id' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-required'\n>;\n\n/**\n * Slots of the Field component\n */\nexport type FieldSlots = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * The label associated with the field.\n */\n label?: Slot<typeof Label>;\n\n /**\n * A message about the validation state. By default, this is an error message, but it can be a success, warning,\n * or custom message by setting `validationState`.\n */\n validationMessage?: Slot<'div'>;\n\n /**\n * The icon associated with the `validationMessage`. This will only be displayed if `validationMessage` is set.\n *\n * The default depends on `validationState`:\n * * error: `<ErrorCircle12Filled />`\n * * warning: `<Warning12Filled />`\n * * success: `<CheckmarkCircle12Filled />`\n * * none: `null`\n */\n validationMessageIcon?: Slot<'span'>;\n\n /**\n * Additional hint text below the field.\n */\n hint?: Slot<'div'>;\n};\n\n/**\n * Field Props\n */\nexport type FieldProps = Omit<ComponentProps<FieldSlots>, 'children'> & {\n /**\n * The Field's child can be a single form control, or a render function that takes the props that should be spread on\n * a form control.\n *\n * All form controls in this library can be used directly as children (such as `<Input>` or `<RadioGroup>`).\n *\n * For other controls, there are two options:\n * 1. The child of Field can be a render function that is given the props that should be spread on the control.\n * `<Field>{(props) => <MyInput {...props} />}</Field>`\n * 2. The control itself can merge props from field with useFieldControlProps_unstable().\n * `props = useFieldControlProps_unstable(props);`\n */\n children?: React.ReactNode | ((props: FieldControlProps) => React.ReactNode);\n\n /**\n * The orientation of the label relative to the field component.\n * This only affects the label, and not the validationMessage or hint (which always appear below the field component).\n *\n * @default vertical\n */\n orientation?: 'vertical' | 'horizontal';\n\n /**\n * The `validationState` affects the display of the `validationMessage` and `validationMessageIcon`.\n *\n * * error: (default) The validation message has a red error icon and red text, with `role=\"alert\"` so it is\n * announced by screen readers. Additionally, the control inside the field has `aria-invalid` set, which adds a\n * red border to some field components (such as `Input`).\n * * success: The validation message has a green checkmark icon and gray text.\n * * warning: The validation message has a yellow exclamation icon and gray text.\n * * none: The validation message has no icon and gray text.\n *\n * @default error when validationMessage is set; none otherwise.\n */\n validationState?: 'error' | 'warning' | 'success' | 'none';\n\n /**\n * Marks the Field as required. If `true`, an asterisk will be appended to the label, and `aria-required` will be set\n * on the Field's child.\n */\n required?: boolean;\n\n /**\n * The size of the Field's label.\n *\n * @default medium\n */\n size?: 'small' | 'medium' | 'large';\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState = ComponentState<Required<FieldSlots>> &\n Required<Pick<FieldProps, 'orientation' | 'required' | 'size' | 'validationState'>> &\n Pick<FieldProps, 'children'> & {\n /**\n * The ID generated for the control inside the field, and the default value of label.htmlFor prop.\n */\n generatedControlId: string;\n };\n\nexport type FieldContextValue = Readonly<\n Pick<FieldState, 'generatedControlId' | 'orientation' | 'required' | 'size' | 'validationState'> & {\n /** The label's for prop. Undefined if there is no label. */\n labelFor?: string;\n /** The label's id prop. Undefined if there is no label. */\n labelId?: string;\n /** The validationMessage's id prop. Undefined if there is no validationMessage. */\n validationMessageId?: string;\n /** The hint's id prop. Undefined if there is no hint. */\n hintId?: string;\n }\n>;\n\nexport type FieldContextValues = {\n field: FieldContextValue;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
@@ -3,4 +3,3 @@ export * from './Field';
3
3
  export * from './renderField';
4
4
  export * from './useField';
5
5
  export * from './useFieldStyles.styles';
6
- //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/Field/index.ts"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Field.types';\nexport * from './Field';\nexport * from './renderField';\nexport * from './useField';\nexport * from './useFieldStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,gBAAgB;AAC9B,cAAc,aAAa;AAC3B,cAAc,0BAA0B"}
@@ -1,22 +1,15 @@
1
- /** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
1
+ /** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
2
2
  import { getSlotsNext } from '@fluentui/react-utilities';
3
3
  import { FieldContextProvider, getFieldControlProps } from '../../contexts/index';
4
4
  /**
5
5
  * Render the final JSX of Field
6
- */
7
- export const renderField_unstable = (state, contextValues) => {
8
- const {
9
- slots,
10
- slotProps
11
- } = getSlotsNext(state);
12
- let {
13
- children
14
- } = state;
15
- if (typeof children === 'function') {
16
- children = children(getFieldControlProps(contextValues.field) || {});
17
- }
18
- return /*#__PURE__*/createElement(FieldContextProvider, {
19
- value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field
20
- }, /*#__PURE__*/createElement(slots.root, slotProps.root, slots.label && /*#__PURE__*/createElement(slots.label, slotProps.label), children, slots.validationMessage && /*#__PURE__*/createElement(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/createElement(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/createElement(slots.hint, slotProps.hint)));
6
+ */ export const renderField_unstable = (state, contextValues)=>{
7
+ const { slots , slotProps } = getSlotsNext(state);
8
+ let { children } = state;
9
+ if (typeof children === 'function') {
10
+ children = children(getFieldControlProps(contextValues.field) || {});
11
+ }
12
+ return /*#__PURE__*/ createElement(FieldContextProvider, {
13
+ value: contextValues === null || contextValues === void 0 ? void 0 : contextValues.field
14
+ }, /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.label && /*#__PURE__*/ createElement(slots.label, slotProps.label), children, slots.validationMessage && /*#__PURE__*/ createElement(slots.validationMessage, slotProps.validationMessage, slots.validationMessageIcon && /*#__PURE__*/ createElement(slots.validationMessageIcon, slotProps.validationMessageIcon), slotProps.validationMessage.children), slots.hint && /*#__PURE__*/ createElement(slots.hint, slotProps.hint)));
21
15
  };
22
- //# sourceMappingURL=renderField.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["createElement","getSlotsNext","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","slots","slotProps","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"sources":["../../../src/components/Field/renderField.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState, contextValues: FieldContextValues) => {\n const { slots, slotProps } = getSlotsNext<FieldSlots>(state);\n\n let { children } = state;\n if (typeof children === 'function') {\n children = children(getFieldControlProps(contextValues.field) || {});\n }\n\n return (\n <FieldContextProvider value={contextValues?.field}>\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {children}\n {slots.validationMessage && (\n <slots.validationMessage {...slotProps.validationMessage}>\n {slots.validationMessageIcon && <slots.validationMessageIcon {...slotProps.validationMessageIcon} />}\n {slotProps.validationMessage.children}\n </slots.validationMessage>\n )}\n {slots.hint && <slots.hint {...slotProps.hint} />}\n </slots.root>\n </FieldContextProvider>\n );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAC7B,SAASC,oBAAoB,EAAEC,oBAAoB,QAAQ;AAG3D;;;AAGA,OAAO,MAAMC,oBAAA,GAAuBA,CAACC,KAAA,EAAmBC,aAAA,KAAsC;EAC5F,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGP,YAAA,CAAyBI,KAAA;EAEtD,IAAI;IAAEI;EAAQ,CAAE,GAAGJ,KAAA;EACnB,IAAI,OAAOI,QAAA,KAAa,YAAY;IAClCA,QAAA,GAAWA,QAAA,CAASN,oBAAA,CAAqBG,aAAA,CAAcI,KAAK,KAAK,CAAC;EACpE;EAEA,oBACEV,aApBJ,CAoBKE,oBAAA;IAAqBS,KAAA,EAAOL,aAAA,aAAAA,aAAA,uBAAAA,aAAA,CAAeI;kBAC1CV,aArBN,CAqBOO,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,EAC3BL,KAAA,CAAMM,KAAK,iBAAIb,aAtBxB,CAsByBO,KAAA,CAAMM,KAAK,EAAKL,SAAA,CAAUK,KAAK,GAC/CJ,QAAA,EACAF,KAAA,CAAMO,iBAAiB,iBACtBd,aAzBV,CAyBWO,KAAA,CAAMO,iBAAiB,EAAKN,SAAA,CAAUM,iBAAiB,EACrDP,KAAA,CAAMQ,qBAAqB,iBAAIf,aA1B5C,CA0B6CO,KAAA,CAAMQ,qBAAqB,EAAKP,SAAA,CAAUO,qBAAqB,GAC/FP,SAAA,CAAUM,iBAAiB,CAACL,QAAQ,GAGxCF,KAAA,CAAMS,IAAI,iBAAIhB,aA9BvB,CA8BwBO,KAAA,CAAMS,IAAI,EAAKR,SAAA,CAAUQ,IAAI;AAIrD"}
1
+ {"version":3,"sources":["renderField.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { FieldContextProvider, getFieldControlProps } from '../../contexts/index';\nimport type { FieldContextValues, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = (state: FieldState, contextValues: FieldContextValues) => {\n const { slots, slotProps } = getSlotsNext<FieldSlots>(state);\n\n let { children } = state;\n if (typeof children === 'function') {\n children = children(getFieldControlProps(contextValues.field) || {});\n }\n\n return (\n <FieldContextProvider value={contextValues?.field}>\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {children}\n {slots.validationMessage && (\n <slots.validationMessage {...slotProps.validationMessage}>\n {slots.validationMessageIcon && <slots.validationMessageIcon {...slotProps.validationMessageIcon} />}\n {slotProps.validationMessage.children}\n </slots.validationMessage>\n )}\n {slots.hint && <slots.hint {...slotProps.hint} />}\n </slots.root>\n </FieldContextProvider>\n );\n};\n"],"names":["createElement","getSlotsNext","FieldContextProvider","getFieldControlProps","renderField_unstable","state","contextValues","slots","slotProps","children","field","value","root","label","validationMessage","validationMessageIcon","hint"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,oBAAoB,EAAEC,oBAAoB,QAAQ,uBAAuB;AAGlF;;CAEC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAmBC,gBAAsC;IAC5F,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGP,aAAyBI;IAEtD,IAAI,EAAEI,SAAQ,EAAE,GAAGJ;IACnB,IAAI,OAAOI,aAAa,YAAY;QAClCA,WAAWA,SAASN,qBAAqBG,cAAcI,KAAK,KAAK,CAAC;IACpE,CAAC;IAED,qBACE,AApBJ,cAoBKR;QAAqBS,OAAOL,0BAAAA,2BAAAA,KAAAA,IAAAA,cAAeI,KAAK;qBAC/C,AArBN,cAqBOH,MAAMK,IAAI,EAAKJ,UAAUI,IAAI,EAC3BL,MAAMM,KAAK,kBAAI,AAtBxB,cAsByBN,MAAMM,KAAK,EAAKL,UAAUK,KAAK,GAC/CJ,UACAF,MAAMO,iBAAiB,kBACtB,AAzBV,cAyBWP,MAAMO,iBAAiB,EAAKN,UAAUM,iBAAiB,EACrDP,MAAMQ,qBAAqB,kBAAI,AA1B5C,cA0B6CR,MAAMQ,qBAAqB,EAAKP,UAAUO,qBAAqB,GAC/FP,UAAUM,iBAAiB,CAACL,QAAQ,GAGxCF,MAAMS,IAAI,kBAAI,AA9BvB,cA8BwBT,MAAMS,IAAI,EAAKR,UAAUQ,IAAI;AAIrD,EAAE"}
@@ -3,10 +3,10 @@ import { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@
3
3
  import { Label } from '@fluentui/react-label';
4
4
  import { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';
5
5
  const validationMessageIcons = {
6
- error: /*#__PURE__*/React.createElement(ErrorCircle12Filled, null),
7
- warning: /*#__PURE__*/React.createElement(Warning12Filled, null),
8
- success: /*#__PURE__*/React.createElement(CheckmarkCircle12Filled, null),
9
- none: undefined
6
+ error: /*#__PURE__*/ React.createElement(ErrorCircle12Filled, null),
7
+ warning: /*#__PURE__*/ React.createElement(Warning12Filled, null),
8
+ success: /*#__PURE__*/ React.createElement(CheckmarkCircle12Filled, null),
9
+ none: undefined
10
10
  };
11
11
  /**
12
12
  * Create the state required to render Field.
@@ -16,66 +16,60 @@ const validationMessageIcons = {
16
16
  *
17
17
  * @param props - Props passed to this field
18
18
  * @param ref - Ref to the root
19
- */
20
- export const useField_unstable = (props, ref) => {
21
- const {
22
- children,
23
- orientation = 'vertical',
24
- required = false,
25
- validationState = props.validationMessage ? 'error' : 'none',
26
- size = 'medium'
27
- } = props;
28
- const baseId = useId('field-');
29
- const generatedControlId = baseId + '__control';
30
- const root = getNativeElementProps('div', {
31
- ...props,
32
- ref
33
- }, /*excludedPropNames:*/['children']);
34
- const label = resolveShorthand(props.label, {
35
- defaultProps: {
36
- htmlFor: generatedControlId,
37
- id: baseId + '__label',
38
- required,
39
- size
40
- }
41
- });
42
- const validationMessage = resolveShorthand(props.validationMessage, {
43
- defaultProps: {
44
- id: baseId + '__validationMessage',
45
- role: validationState === 'error' ? 'alert' : undefined
46
- }
47
- });
48
- const hint = resolveShorthand(props.hint, {
49
- defaultProps: {
50
- id: baseId + '__hint'
51
- }
52
- });
53
- const defaultIcon = validationMessageIcons[validationState];
54
- const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {
55
- required: !!defaultIcon,
56
- defaultProps: {
57
- children: defaultIcon
58
- }
59
- });
60
- return {
61
- children,
62
- generatedControlId,
63
- orientation,
64
- required,
65
- size,
66
- validationState,
67
- components: {
68
- root: 'div',
69
- label: Label,
70
- validationMessage: 'div',
71
- validationMessageIcon: 'span',
72
- hint: 'div'
73
- },
74
- root,
75
- label,
76
- validationMessageIcon,
77
- validationMessage,
78
- hint
79
- };
19
+ */ export const useField_unstable = (props, ref)=>{
20
+ const { children , orientation ='vertical' , required =false , validationState =props.validationMessage ? 'error' : 'none' , size ='medium' } = props;
21
+ const baseId = useId('field-');
22
+ const generatedControlId = baseId + '__control';
23
+ const root = getNativeElementProps('div', {
24
+ ...props,
25
+ ref
26
+ }, /*excludedPropNames:*/ [
27
+ 'children'
28
+ ]);
29
+ const label = resolveShorthand(props.label, {
30
+ defaultProps: {
31
+ htmlFor: generatedControlId,
32
+ id: baseId + '__label',
33
+ required,
34
+ size
35
+ }
36
+ });
37
+ const validationMessage = resolveShorthand(props.validationMessage, {
38
+ defaultProps: {
39
+ id: baseId + '__validationMessage',
40
+ role: validationState === 'error' ? 'alert' : undefined
41
+ }
42
+ });
43
+ const hint = resolveShorthand(props.hint, {
44
+ defaultProps: {
45
+ id: baseId + '__hint'
46
+ }
47
+ });
48
+ const defaultIcon = validationMessageIcons[validationState];
49
+ const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {
50
+ required: !!defaultIcon,
51
+ defaultProps: {
52
+ children: defaultIcon
53
+ }
54
+ });
55
+ return {
56
+ children,
57
+ generatedControlId,
58
+ orientation,
59
+ required,
60
+ size,
61
+ validationState,
62
+ components: {
63
+ root: 'div',
64
+ label: Label,
65
+ validationMessage: 'div',
66
+ validationMessageIcon: 'span',
67
+ hint: 'div'
68
+ },
69
+ root,
70
+ label,
71
+ validationMessageIcon,
72
+ validationMessage,
73
+ hint
74
+ };
80
75
  };
81
- //# sourceMappingURL=useField.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","CheckmarkCircle12Filled","ErrorCircle12Filled","Warning12Filled","Label","getNativeElementProps","resolveShorthand","useId","validationMessageIcons","error","createElement","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","generatedControlId","root","label","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","components"],"sources":["../../../src/components/Field/useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n error: <ErrorCircle12Filled />,\n warning: <Warning12Filled />,\n success: <CheckmarkCircle12Filled />,\n none: undefined,\n} as const;\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: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium',\n } = props;\n\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n\n const root = getNativeElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']);\n\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: generatedControlId,\n id: baseId + '__label',\n required,\n size,\n },\n });\n\n const validationMessage = resolveShorthand(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' ? 'alert' : undefined,\n },\n });\n\n const hint = resolveShorthand(props.hint, {\n defaultProps: {\n id: baseId + '__hint',\n },\n });\n\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n required: !!defaultIcon,\n defaultProps: {\n children: defaultIcon,\n },\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"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAEvB,SAASC,uBAAuB,EAAEC,mBAAmB,EAAEC,eAAe,QAAQ;AAC9E,SAASC,KAAK,QAAQ;AACtB,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ;AAG/D,MAAMC,sBAAA,GAAyB;EAC7BC,KAAA,eAAOT,KAAA,CAAAU,aAAA,CAACR,mBAAA;EACRS,OAAA,eAASX,KAAA,CAAAU,aAAA,CAACP,eAAA;EACVS,OAAA,eAASZ,KAAA,CAAAU,aAAA,CAACT,uBAAA;EACVY,IAAA,EAAMC;AACR;AAEA;;;;;;;;;AASA,OAAO,MAAMC,iBAAA,GAAoBA,CAACC,KAAA,EAAmBC,GAAA,KAA+C;EAClG,MAAM;IACJC,QAAA;IACAC,WAAA,GAAc;IACdC,QAAA,GAAW,KAAK;IAChBC,eAAA,GAAkBL,KAAA,CAAMM,iBAAiB,GAAG,UAAU,MAAM;IAC5DC,IAAA,GAAO;EAAQ,CAChB,GAAGP,KAAA;EAEJ,MAAMQ,MAAA,GAASjB,KAAA,CAAM;EACrB,MAAMkB,kBAAA,GAAqBD,MAAA,GAAS;EAEpC,MAAME,IAAA,GAAOrB,qBAAA,CAAsB,OAAO;IAAE,GAAGW,KAAK;IAAEC;EAAI,GAAG,sBAAuB,CAAC,WAAW;EAEhG,MAAMU,KAAA,GAAQrB,gBAAA,CAAiBU,KAAA,CAAMW,KAAK,EAAE;IAC1CC,YAAA,EAAc;MACZC,OAAA,EAASJ,kBAAA;MACTK,EAAA,EAAIN,MAAA,GAAS;MACbJ,QAAA;MACAG;IACF;EACF;EAEA,MAAMD,iBAAA,GAAoBhB,gBAAA,CAAiBU,KAAA,CAAMM,iBAAiB,EAAE;IAClEM,YAAA,EAAc;MACZE,EAAA,EAAIN,MAAA,GAAS;MACbO,IAAA,EAAMV,eAAA,KAAoB,UAAU,UAAUP;IAChD;EACF;EAEA,MAAMkB,IAAA,GAAO1B,gBAAA,CAAiBU,KAAA,CAAMgB,IAAI,EAAE;IACxCJ,YAAA,EAAc;MACZE,EAAA,EAAIN,MAAA,GAAS;IACf;EACF;EAEA,MAAMS,WAAA,GAAczB,sBAAsB,CAACa,eAAA,CAAgB;EAC3D,MAAMa,qBAAA,GAAwB5B,gBAAA,CAAiBU,KAAA,CAAMkB,qBAAqB,EAAE;IAC1Ed,QAAA,EAAU,CAAC,CAACa,WAAA;IACZL,YAAA,EAAc;MACZV,QAAA,EAAUe;IACZ;EACF;EAEA,OAAO;IACLf,QAAA;IACAO,kBAAA;IACAN,WAAA;IACAC,QAAA;IACAG,IAAA;IACAF,eAAA;IACAc,UAAA,EAAY;MACVT,IAAA,EAAM;MACNC,KAAA,EAAOvB,KAAA;MACPkB,iBAAA,EAAmB;MACnBY,qBAAA,EAAuB;MACvBF,IAAA,EAAM;IACR;IACAN,IAAA;IACAC,KAAA;IACAO,qBAAA;IACAZ,iBAAA;IACAU;EACF;AACF"}
1
+ {"version":3,"sources":["useField.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CheckmarkCircle12Filled, ErrorCircle12Filled, Warning12Filled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { FieldProps, FieldState } from './Field.types';\n\nconst validationMessageIcons = {\n error: <ErrorCircle12Filled />,\n warning: <Warning12Filled />,\n success: <CheckmarkCircle12Filled />,\n none: undefined,\n} as const;\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: FieldProps, ref: React.Ref<HTMLDivElement>): FieldState => {\n const {\n children,\n orientation = 'vertical',\n required = false,\n validationState = props.validationMessage ? 'error' : 'none',\n size = 'medium',\n } = props;\n\n const baseId = useId('field-');\n const generatedControlId = baseId + '__control';\n\n const root = getNativeElementProps('div', { ...props, ref }, /*excludedPropNames:*/ ['children']);\n\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: generatedControlId,\n id: baseId + '__label',\n required,\n size,\n },\n });\n\n const validationMessage = resolveShorthand(props.validationMessage, {\n defaultProps: {\n id: baseId + '__validationMessage',\n role: validationState === 'error' ? 'alert' : undefined,\n },\n });\n\n const hint = resolveShorthand(props.hint, {\n defaultProps: {\n id: baseId + '__hint',\n },\n });\n\n const defaultIcon = validationMessageIcons[validationState];\n const validationMessageIcon = resolveShorthand(props.validationMessageIcon, {\n required: !!defaultIcon,\n defaultProps: {\n children: defaultIcon,\n },\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"],"names":["React","CheckmarkCircle12Filled","ErrorCircle12Filled","Warning12Filled","Label","getNativeElementProps","resolveShorthand","useId","validationMessageIcons","error","warning","success","none","undefined","useField_unstable","props","ref","children","orientation","required","validationState","validationMessage","size","baseId","generatedControlId","root","label","defaultProps","htmlFor","id","role","hint","defaultIcon","validationMessageIcon","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,uBAAuB,EAAEC,mBAAmB,EAAEC,eAAe,QAAQ,wBAAwB;AACtG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,4BAA4B;AAG3F,MAAMC,yBAAyB;IAC7BC,qBAAO,oBAACP;IACRQ,uBAAS,oBAACP;IACVQ,uBAAS,oBAACV;IACVW,MAAMC;AACR;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC,MAA+C;IAClG,MAAM,EACJC,SAAQ,EACRC,aAAc,WAAU,EACxBC,UAAW,KAAK,CAAA,EAChBC,iBAAkBL,MAAMM,iBAAiB,GAAG,UAAU,MAAM,CAAA,EAC5DC,MAAO,SAAQ,EAChB,GAAGP;IAEJ,MAAMQ,SAAShB,MAAM;IACrB,MAAMiB,qBAAqBD,SAAS;IAEpC,MAAME,OAAOpB,sBAAsB,OAAO;QAAE,GAAGU,KAAK;QAAEC;IAAI,GAAG,oBAAoB,GAAG;QAAC;KAAW;IAEhG,MAAMU,QAAQpB,iBAAiBS,MAAMW,KAAK,EAAE;QAC1CC,cAAc;YACZC,SAASJ;YACTK,IAAIN,SAAS;YACbJ;YACAG;QACF;IACF;IAEA,MAAMD,oBAAoBf,iBAAiBS,MAAMM,iBAAiB,EAAE;QAClEM,cAAc;YACZE,IAAIN,SAAS;YACbO,MAAMV,oBAAoB,UAAU,UAAUP,SAAS;QACzD;IACF;IAEA,MAAMkB,OAAOzB,iBAAiBS,MAAMgB,IAAI,EAAE;QACxCJ,cAAc;YACZE,IAAIN,SAAS;QACf;IACF;IAEA,MAAMS,cAAcxB,sBAAsB,CAACY,gBAAgB;IAC3D,MAAMa,wBAAwB3B,iBAAiBS,MAAMkB,qBAAqB,EAAE;QAC1Ed,UAAU,CAAC,CAACa;QACZL,cAAc;YACZV,UAAUe;QACZ;IACF;IAEA,OAAO;QACLf;QACAO;QACAN;QACAC;QACAG;QACAF;QACAc,YAAY;YACVT,MAAM;YACNC,OAAOtB;YACPiB,mBAAmB;YACnBY,uBAAuB;YACvBF,MAAM;QACR;QACAN;QACAC;QACAO;QACAZ;QACAU;IACF;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","orientation","rootStyles","className","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["../../../src/components/Field/useFieldStyles.styles.ts"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { FieldSlots, FieldState } from './Field.types';\n\nexport const fieldClassNames: SlotClassNames<FieldSlots> = {\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\n// Size of the icon in the validation message\nconst iconSize = '12px';\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n base: {\n display: 'grid',\n },\n\n // In horizontal layout, the field is a grid with the label taking up the entire first column.\n // The last row is slack space in case the label is taller than the rest of the content.\n horizontal: {\n gridTemplateColumns: '33% 1fr',\n gridTemplateRows: 'auto auto auto 1fr',\n },\n\n // In horizontal layout without a label, replace the label's column with padding.\n // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n horizontalNoLabel: {\n paddingLeft: '33%',\n gridTemplateColumns: '1fr',\n },\n});\n\nconst useLabelStyles = makeStyles({\n base: {\n paddingTop: tokens.spacingVerticalXXS,\n paddingBottom: tokens.spacingVerticalXXS,\n },\n\n large: {\n paddingTop: '1px',\n paddingBottom: '1px',\n },\n\n vertical: {\n marginBottom: tokens.spacingVerticalXXS,\n },\n\n verticalLarge: {\n marginBottom: tokens.spacingVerticalXS,\n },\n\n horizontal: {\n marginRight: tokens.spacingHorizontalM,\n gridRowStart: '1',\n gridRowEnd: '-1',\n },\n});\n\nconst useSecondaryTextBaseClassName = makeResetStyles({\n marginTop: tokens.spacingVerticalXXS,\n color: tokens.colorNeutralForeground3,\n ...typographyStyles.caption1,\n});\n\nconst useSecondaryTextStyles = makeStyles({\n error: {\n color: tokens.colorPaletteRedForeground1,\n },\n\n withIcon: {\n // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`,\n },\n});\n\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n display: 'inline-block',\n fontSize: iconSize,\n // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n marginRight: tokens.spacingHorizontalXS,\n // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n lineHeight: '0',\n // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n verticalAlign: '-1px',\n});\n\nconst useValidationMessageIconStyles = makeStyles({\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 = (state: FieldState) => {\n const { validationState } = state;\n const horizontal = state.orientation === 'horizontal';\n\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(\n fieldClassNames.root,\n rootStyles.base,\n horizontal && rootStyles.horizontal,\n horizontal && !state.label && rootStyles.horizontalNoLabel,\n state.root.className,\n );\n\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(\n fieldClassNames.label,\n labelStyles.base,\n horizontal && labelStyles.horizontal,\n !horizontal && labelStyles.vertical,\n state.label.size === 'large' && labelStyles.large,\n !horizontal && state.label.size === 'large' && labelStyles.verticalLarge,\n state.label.className,\n );\n }\n\n const validationMessageIconBaseClassName = useValidationMessageIconBaseClassName();\n const validationMessageIconStyles = useValidationMessageIconStyles();\n if (state.validationMessageIcon) {\n state.validationMessageIcon.className = mergeClasses(\n fieldClassNames.validationMessageIcon,\n validationMessageIconBaseClassName,\n validationState !== 'none' && validationMessageIconStyles[validationState],\n state.validationMessageIcon.className,\n );\n }\n\n const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n const secondaryTextStyles = useSecondaryTextStyles();\n if (state.validationMessage) {\n state.validationMessage.className = mergeClasses(\n fieldClassNames.validationMessage,\n secondaryTextBaseClassName,\n validationState === 'error' && secondaryTextStyles.error,\n !!state.validationMessageIcon && secondaryTextStyles.withIcon,\n state.validationMessage.className,\n );\n }\n\n if (state.hint) {\n state.hint.className = mergeClasses(fieldClassNames.hint, secondaryTextBaseClassName, state.hint.className);\n }\n};\n"],"mappings":"AAAA,SAASA,MAAM,EAAEC,gBAAgB,QAAQ;AAEzC,SAAAC,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ;AAG1D,OAAO,MAAMC,eAAA,GAA8C;EACzDC,IAAA,EAAO,WAAU;EACjBC,KAAA,EAAQ,kBAAiB;EACzBC,iBAAA,EAAoB,8BAA6B;EACjDC,qBAAA,EAAwB,kCAAiC;EACzDC,IAAA,EAAO;AACT;AAEA;AACA,MAAMC,QAAA,GAAW;AAEjB;;;AAGA,MAAMC,aAAA,gBAAgBT,QAAA;EAAAU,IAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,iBAAA;IAAAC,MAAA;IAAAH,OAAA;EAAA;AAAA;EAAAI,CAAA;AAAA,EAkBtB;AAEA,MAAMC,cAAA,gBAAiBlB,QAAA;EAAAU,IAAA;IAAAS,MAAA;IAAAC,OAAA;EAAA;EAAAC,KAAA;IAAAF,MAAA;IAAAC,OAAA;EAAA;EAAAE,QAAA;IAAAC,MAAA;EAAA;EAAAC,aAAA;IAAAD,MAAA;EAAA;EAAAX,UAAA;IAAAa,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAV,CAAA;AAAA,EAwBvB;AAEA,MAAMW,6BAAA,gBAAgC7B,aAAA,wPAItC;AAEA,MAAM8B,sBAAA,gBAAyB7B,QAAA;EAAA8B,KAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAhB,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAS/B;AAEA,MAAMgB,qCAAA,gBAAwClC,aAAA,4XAU9C;AAEA,MAAMmC,8BAAA,gBAAiClC,QAAA;EAAA8B,KAAA;IAAAC,MAAA;EAAA;EAAAI,OAAA;IAAAJ,MAAA;EAAA;EAAAK,OAAA;IAAAL,MAAA;EAAA;AAAA;EAAAd,CAAA;AAAA,EAUvC;AAEA;;;AAGA,OAAO,MAAMoB,uBAAA,GAA2BC,KAAA,IAAsB;EAC5D,MAAM;IAAEC;EAAe,CAAE,GAAGD,KAAA;EAC5B,MAAM1B,UAAA,GAAa0B,KAAA,CAAME,WAAW,KAAK;EAEzC,MAAMC,UAAA,GAAahC,aAAA;EACnB6B,KAAA,CAAMnC,IAAI,CAACuC,SAAS,GAAGzC,YAAA,CACrBC,eAAA,CAAgBC,IAAI,EACpBsC,UAAA,CAAW/B,IAAI,EACfE,UAAA,IAAc6B,UAAA,CAAW7B,UAAU,EACnCA,UAAA,IAAc,CAAC0B,KAAA,CAAMlC,KAAK,IAAIqC,UAAA,CAAW1B,iBAAiB,EAC1DuB,KAAA,CAAMnC,IAAI,CAACuC,SAAS;EAGtB,MAAMC,WAAA,GAAczB,cAAA;EACpB,IAAIoB,KAAA,CAAMlC,KAAK,EAAE;IACfkC,KAAA,CAAMlC,KAAK,CAACsC,SAAS,GAAGzC,YAAA,CACtBC,eAAA,CAAgBE,KAAK,EACrBuC,WAAA,CAAYjC,IAAI,EAChBE,UAAA,IAAc+B,WAAA,CAAY/B,UAAU,EACpC,CAACA,UAAA,IAAc+B,WAAA,CAAYrB,QAAQ,EACnCgB,KAAA,CAAMlC,KAAK,CAACwC,IAAI,KAAK,WAAWD,WAAA,CAAYtB,KAAK,EACjD,CAACT,UAAA,IAAc0B,KAAA,CAAMlC,KAAK,CAACwC,IAAI,KAAK,WAAWD,WAAA,CAAYnB,aAAa,EACxEc,KAAA,CAAMlC,KAAK,CAACsC,SAAS;EAEzB;EAEA,MAAMG,kCAAA,GAAqCZ,qCAAA;EAC3C,MAAMa,2BAAA,GAA8BZ,8BAAA;EACpC,IAAII,KAAA,CAAMhC,qBAAqB,EAAE;IAC/BgC,KAAA,CAAMhC,qBAAqB,CAACoC,SAAS,GAAGzC,YAAA,CACtCC,eAAA,CAAgBI,qBAAqB,EACrCuC,kCAAA,EACAN,eAAA,KAAoB,UAAUO,2BAA2B,CAACP,eAAA,CAAgB,EAC1ED,KAAA,CAAMhC,qBAAqB,CAACoC,SAAS;EAEzC;EAEA,MAAMK,0BAAA,GAA6BnB,6BAAA;EACnC,MAAMoB,mBAAA,GAAsBnB,sBAAA;EAC5B,IAAIS,KAAA,CAAMjC,iBAAiB,EAAE;IAC3BiC,KAAA,CAAMjC,iBAAiB,CAACqC,SAAS,GAAGzC,YAAA,CAClCC,eAAA,CAAgBG,iBAAiB,EACjC0C,0BAAA,EACAR,eAAA,KAAoB,WAAWS,mBAAA,CAAoBlB,KAAK,EACxD,CAAC,CAACQ,KAAA,CAAMhC,qBAAqB,IAAI0C,mBAAA,CAAoBhB,QAAQ,EAC7DM,KAAA,CAAMjC,iBAAiB,CAACqC,SAAS;EAErC;EAEA,IAAIJ,KAAA,CAAM/B,IAAI,EAAE;IACd+B,KAAA,CAAM/B,IAAI,CAACmC,SAAS,GAAGzC,YAAA,CAAaC,eAAA,CAAgBK,IAAI,EAAEwC,0BAAA,EAA4BT,KAAA,CAAM/B,IAAI,CAACmC,SAAS;EAC5G;AACF"}
1
+ {"version":3,"names":["tokens","typographyStyles","__resetStyles","__styles","mergeClasses","fieldClassNames","root","label","validationMessage","validationMessageIcon","hint","iconSize","useRootStyles","base","mc9l5x","horizontal","Budl1dq","wkccdc","horizontalNoLabel","uwmqm3","d","useLabelStyles","z8tnut","Byoj8tv","large","vertical","jrapky","verticalLarge","t21cq0","Ijaq50","nk6f5a","useSecondaryTextBaseClassName","useSecondaryTextStyles","error","sj55zd","withIcon","useValidationMessageIconBaseClassName","useValidationMessageIconStyles","warning","success","useFieldStyles_unstable","state","validationState","orientation","rootStyles","className","labelStyles","size","validationMessageIconBaseClassName","validationMessageIconStyles","secondaryTextBaseClassName","secondaryTextStyles"],"sources":["useFieldStyles.styles.js"],"sourcesContent":["import { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, 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 */ const useRootStyles = makeStyles({\n base: {\n display: 'grid'\n },\n // In horizontal layout, the field is a grid with the label taking up the entire first column.\n // The last row is slack space in case the label is taller than the rest of the content.\n horizontal: {\n gridTemplateColumns: '33% 1fr',\n gridTemplateRows: 'auto auto auto 1fr'\n },\n // In horizontal layout without a label, replace the label's column with padding.\n // This lets grid auto-flow properly place the other children, and keeps fields with and without labels aligned.\n horizontalNoLabel: {\n paddingLeft: '33%',\n gridTemplateColumns: '1fr'\n }\n});\nconst useLabelStyles = makeStyles({\n base: {\n paddingTop: tokens.spacingVerticalXXS,\n paddingBottom: tokens.spacingVerticalXXS\n },\n large: {\n paddingTop: '1px',\n paddingBottom: '1px'\n },\n vertical: {\n marginBottom: tokens.spacingVerticalXXS\n },\n verticalLarge: {\n marginBottom: tokens.spacingVerticalXS\n },\n horizontal: {\n marginRight: tokens.spacingHorizontalM,\n gridRowStart: '1',\n gridRowEnd: '-1'\n }\n});\nconst useSecondaryTextBaseClassName = makeResetStyles({\n marginTop: tokens.spacingVerticalXXS,\n color: tokens.colorNeutralForeground3,\n ...typographyStyles.caption1\n});\nconst useSecondaryTextStyles = makeStyles({\n error: {\n color: tokens.colorPaletteRedForeground1\n },\n withIcon: {\n // Add a gutter for the icon, to allow multiple lines of text to line up to the right of the icon.\n paddingLeft: `calc(${iconSize} + ${tokens.spacingHorizontalXS})`\n }\n});\nconst useValidationMessageIconBaseClassName = makeResetStyles({\n display: 'inline-block',\n fontSize: iconSize,\n // Negative left margin puts the icon in the gutter of the validation message div's withIcon style.\n marginLeft: `calc(-${iconSize} - ${tokens.spacingHorizontalXS})`,\n marginRight: tokens.spacingHorizontalXS,\n // Line height of 0 prevents the verticalAlign from affecting the line height of the text.\n lineHeight: '0',\n // Negative verticalAlign shifts the inline icon down to align with the text (effectively top padding).\n verticalAlign: '-1px'\n});\nconst useValidationMessageIconStyles = makeStyles({\n error: {\n color: tokens.colorPaletteRedForeground1\n },\n warning: {\n color: tokens.colorPaletteDarkOrangeForeground1\n },\n success: {\n color: tokens.colorPaletteGreenForeground1\n }\n});\n/**\n * Apply styling to the Field slots based on the state\n */ export const useFieldStyles_unstable = (state)=>{\n const { validationState } = 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"],"mappings":"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"}
@@ -1,5 +1,4 @@
1
1
  import * as React from 'react';
2
- const FieldContext = /*#__PURE__*/React.createContext(undefined);
2
+ const FieldContext = React.createContext(undefined);
3
3
  export const FieldContextProvider = FieldContext.Provider;
4
- export const useFieldContext_unstable = () => React.useContext(FieldContext);
5
- //# sourceMappingURL=FieldContext.js.map
4
+ export const useFieldContext_unstable = ()=>React.useContext(FieldContext);
@@ -1 +1 @@
1
- {"version":3,"names":["React","FieldContext","createContext","undefined","FieldContextProvider","Provider","useFieldContext_unstable","useContext"],"sources":["../../src/contexts/FieldContext.ts"],"sourcesContent":["import * as React from 'react';\n\nimport type { FieldContextValue } from '../Field';\n\nconst FieldContext = React.createContext<FieldContextValue | undefined>(undefined);\n\nexport const FieldContextProvider = FieldContext.Provider;\n\nexport const useFieldContext_unstable = () => React.useContext(FieldContext);\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAIvB,MAAMC,YAAA,gBAAeD,KAAA,CAAME,aAAa,CAAgCC,SAAA;AAExE,OAAO,MAAMC,oBAAA,GAAuBH,YAAA,CAAaI,QAAQ;AAEzD,OAAO,MAAMC,wBAAA,GAA2BA,CAAA,KAAMN,KAAA,CAAMO,UAAU,CAACN,YAAA"}
1
+ {"version":3,"sources":["FieldContext.ts"],"sourcesContent":["import * as React from 'react';\n\nimport type { FieldContextValue } from '../Field';\n\nconst FieldContext = React.createContext<FieldContextValue | undefined>(undefined);\n\nexport const FieldContextProvider = FieldContext.Provider;\n\nexport const useFieldContext_unstable = () => React.useContext(FieldContext);\n"],"names":["React","FieldContext","createContext","undefined","FieldContextProvider","Provider","useFieldContext_unstable","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAI/B,MAAMC,eAAeD,MAAME,aAAa,CAAgCC;AAExE,OAAO,MAAMC,uBAAuBH,aAAaI,QAAQ,CAAC;AAE1D,OAAO,MAAMC,2BAA2B,IAAMN,MAAMO,UAAU,CAACN,cAAc"}
@@ -1,4 +1,3 @@
1
1
  export * from './FieldContext';
2
2
  export * from './useFieldContextValues';
3
3
  export * from './useFieldControlProps';
4
- //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../src/contexts/index.ts"],"sourcesContent":["export * from './FieldContext';\nexport * from './useFieldContextValues';\nexport * from './useFieldControlProps';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './FieldContext';\nexport * from './useFieldContextValues';\nexport * from './useFieldControlProps';\n"],"names":[],"mappings":"AAAA,cAAc,iBAAiB;AAC/B,cAAc,0BAA0B;AACxC,cAAc,yBAAyB"}
@@ -1,33 +1,35 @@
1
1
  import * as React from 'react';
2
2
  /**
3
3
  * Get the context values used when rendering Field.
4
- */
5
- export const useFieldContextValues_unstable = state => {
6
- var _state_label, _state_label1, _state_validationMessage, _state_hint;
7
- const {
8
- generatedControlId,
9
- orientation,
10
- required,
11
- size,
12
- validationState
13
- } = 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
- }), [generatedControlId, hintId, labelFor, labelId, orientation, required, size, validationMessageId, validationState]);
29
- return {
30
- field
31
- };
4
+ */ export const useFieldContextValues_unstable = (state)=>{
5
+ var _state_label, _state_label1, _state_validationMessage, _state_hint;
6
+ const { generatedControlId , orientation , required , size , validationState } = state;
7
+ const labelFor = (_state_label = state.label) === null || _state_label === void 0 ? void 0 : _state_label.htmlFor;
8
+ const labelId = (_state_label1 = state.label) === null || _state_label1 === void 0 ? void 0 : _state_label1.id;
9
+ const validationMessageId = (_state_validationMessage = state.validationMessage) === null || _state_validationMessage === void 0 ? void 0 : _state_validationMessage.id;
10
+ const hintId = (_state_hint = state.hint) === null || _state_hint === void 0 ? void 0 : _state_hint.id;
11
+ const field = React.useMemo(()=>({
12
+ generatedControlId,
13
+ hintId,
14
+ labelFor,
15
+ labelId,
16
+ orientation,
17
+ required,
18
+ size,
19
+ validationMessageId,
20
+ validationState
21
+ }), [
22
+ generatedControlId,
23
+ hintId,
24
+ labelFor,
25
+ labelId,
26
+ orientation,
27
+ required,
28
+ size,
29
+ validationMessageId,
30
+ validationState
31
+ ]);
32
+ return {
33
+ field
34
+ };
32
35
  };
33
- //# sourceMappingURL=useFieldContextValues.js.map