@fluentui/react-field 0.0.0-nightly-20221109-0420.1 → 0.0.0-nightly-20221110-0427.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/CHANGELOG.json +13 -73
  2. package/CHANGELOG.md +9 -19
  3. package/dist/index.d.ts +18 -100
  4. package/lib/components/Field/Field.types.js.map +1 -1
  5. package/lib/components/Field/renderField.js.map +1 -1
  6. package/lib/components/Field/useField.js.map +1 -1
  7. package/lib/components/Field/useFieldStyles.js +1 -1
  8. package/lib/components/Field/useFieldStyles.js.map +1 -1
  9. package/lib/index.js +0 -10
  10. package/lib/index.js.map +1 -1
  11. package/lib-commonjs/components/Field/renderField.js.map +1 -1
  12. package/lib-commonjs/components/Field/useField.js.map +1 -1
  13. package/lib-commonjs/components/Field/useFieldStyles.js +2 -2
  14. package/lib-commonjs/components/Field/useFieldStyles.js.map +1 -1
  15. package/lib-commonjs/index.js +1 -151
  16. package/lib-commonjs/index.js.map +1 -1
  17. package/package.json +6 -16
  18. package/lib/CheckboxField.js +0 -2
  19. package/lib/CheckboxField.js.map +0 -1
  20. package/lib/ComboboxField.js +0 -2
  21. package/lib/ComboboxField.js.map +0 -1
  22. package/lib/InputField.js +0 -2
  23. package/lib/InputField.js.map +0 -1
  24. package/lib/ProgressField.js +0 -2
  25. package/lib/ProgressField.js.map +0 -1
  26. package/lib/RadioGroupField.js +0 -2
  27. package/lib/RadioGroupField.js.map +0 -1
  28. package/lib/SelectField.js +0 -2
  29. package/lib/SelectField.js.map +0 -1
  30. package/lib/SliderField.js +0 -2
  31. package/lib/SliderField.js.map +0 -1
  32. package/lib/SpinButtonField.js +0 -2
  33. package/lib/SpinButtonField.js.map +0 -1
  34. package/lib/SwitchField.js +0 -2
  35. package/lib/SwitchField.js.map +0 -1
  36. package/lib/TextareaField.js +0 -2
  37. package/lib/TextareaField.js.map +0 -1
  38. package/lib/components/CheckboxField/CheckboxField.js +0 -32
  39. package/lib/components/CheckboxField/CheckboxField.js.map +0 -1
  40. package/lib/components/CheckboxField/index.js +0 -2
  41. package/lib/components/CheckboxField/index.js.map +0 -1
  42. package/lib/components/ComboboxField/ComboboxField.js +0 -14
  43. package/lib/components/ComboboxField/ComboboxField.js.map +0 -1
  44. package/lib/components/ComboboxField/index.js +0 -2
  45. package/lib/components/ComboboxField/index.js.map +0 -1
  46. package/lib/components/InputField/InputField.js +0 -14
  47. package/lib/components/InputField/InputField.js.map +0 -1
  48. package/lib/components/InputField/index.js +0 -2
  49. package/lib/components/InputField/index.js.map +0 -1
  50. package/lib/components/ProgressField/ProgressField.js +0 -17
  51. package/lib/components/ProgressField/ProgressField.js.map +0 -1
  52. package/lib/components/ProgressField/index.js +0 -2
  53. package/lib/components/ProgressField/index.js.map +0 -1
  54. package/lib/components/RadioGroupField/RadioGroupField.js +0 -15
  55. package/lib/components/RadioGroupField/RadioGroupField.js.map +0 -1
  56. package/lib/components/RadioGroupField/index.js +0 -2
  57. package/lib/components/RadioGroupField/index.js.map +0 -1
  58. package/lib/components/SelectField/SelectField.js +0 -14
  59. package/lib/components/SelectField/SelectField.js.map +0 -1
  60. package/lib/components/SelectField/index.js +0 -2
  61. package/lib/components/SelectField/index.js.map +0 -1
  62. package/lib/components/SliderField/SliderField.js +0 -14
  63. package/lib/components/SliderField/SliderField.js.map +0 -1
  64. package/lib/components/SliderField/index.js +0 -2
  65. package/lib/components/SliderField/index.js.map +0 -1
  66. package/lib/components/SpinButtonField/SpinButtonField.js +0 -14
  67. package/lib/components/SpinButtonField/SpinButtonField.js.map +0 -1
  68. package/lib/components/SpinButtonField/index.js +0 -2
  69. package/lib/components/SpinButtonField/index.js.map +0 -1
  70. package/lib/components/SwitchField/SwitchField.js +0 -14
  71. package/lib/components/SwitchField/SwitchField.js.map +0 -1
  72. package/lib/components/SwitchField/index.js +0 -2
  73. package/lib/components/SwitchField/index.js.map +0 -1
  74. package/lib/components/TextareaField/TextareaField.js +0 -14
  75. package/lib/components/TextareaField/TextareaField.js.map +0 -1
  76. package/lib/components/TextareaField/index.js +0 -2
  77. package/lib/components/TextareaField/index.js.map +0 -1
  78. package/lib-commonjs/CheckboxField.js +0 -10
  79. package/lib-commonjs/CheckboxField.js.map +0 -1
  80. package/lib-commonjs/ComboboxField.js +0 -10
  81. package/lib-commonjs/ComboboxField.js.map +0 -1
  82. package/lib-commonjs/InputField.js +0 -10
  83. package/lib-commonjs/InputField.js.map +0 -1
  84. package/lib-commonjs/ProgressField.js +0 -10
  85. package/lib-commonjs/ProgressField.js.map +0 -1
  86. package/lib-commonjs/RadioGroupField.js +0 -10
  87. package/lib-commonjs/RadioGroupField.js.map +0 -1
  88. package/lib-commonjs/SelectField.js +0 -10
  89. package/lib-commonjs/SelectField.js.map +0 -1
  90. package/lib-commonjs/SliderField.js +0 -10
  91. package/lib-commonjs/SliderField.js.map +0 -1
  92. package/lib-commonjs/SpinButtonField.js +0 -10
  93. package/lib-commonjs/SpinButtonField.js.map +0 -1
  94. package/lib-commonjs/SwitchField.js +0 -10
  95. package/lib-commonjs/SwitchField.js.map +0 -1
  96. package/lib-commonjs/TextareaField.js +0 -10
  97. package/lib-commonjs/TextareaField.js.map +0 -1
  98. package/lib-commonjs/components/CheckboxField/CheckboxField.js +0 -42
  99. package/lib-commonjs/components/CheckboxField/CheckboxField.js.map +0 -1
  100. package/lib-commonjs/components/CheckboxField/index.js +0 -10
  101. package/lib-commonjs/components/CheckboxField/index.js.map +0 -1
  102. package/lib-commonjs/components/ComboboxField/ComboboxField.js +0 -24
  103. package/lib-commonjs/components/ComboboxField/ComboboxField.js.map +0 -1
  104. package/lib-commonjs/components/ComboboxField/index.js +0 -10
  105. package/lib-commonjs/components/ComboboxField/index.js.map +0 -1
  106. package/lib-commonjs/components/InputField/InputField.js +0 -24
  107. package/lib-commonjs/components/InputField/InputField.js.map +0 -1
  108. package/lib-commonjs/components/InputField/index.js +0 -10
  109. package/lib-commonjs/components/InputField/index.js.map +0 -1
  110. package/lib-commonjs/components/ProgressField/ProgressField.js +0 -27
  111. package/lib-commonjs/components/ProgressField/ProgressField.js.map +0 -1
  112. package/lib-commonjs/components/ProgressField/index.js +0 -10
  113. package/lib-commonjs/components/ProgressField/index.js.map +0 -1
  114. package/lib-commonjs/components/RadioGroupField/RadioGroupField.js +0 -25
  115. package/lib-commonjs/components/RadioGroupField/RadioGroupField.js.map +0 -1
  116. package/lib-commonjs/components/RadioGroupField/index.js +0 -10
  117. package/lib-commonjs/components/RadioGroupField/index.js.map +0 -1
  118. package/lib-commonjs/components/SelectField/SelectField.js +0 -24
  119. package/lib-commonjs/components/SelectField/SelectField.js.map +0 -1
  120. package/lib-commonjs/components/SelectField/index.js +0 -10
  121. package/lib-commonjs/components/SelectField/index.js.map +0 -1
  122. package/lib-commonjs/components/SliderField/SliderField.js +0 -24
  123. package/lib-commonjs/components/SliderField/SliderField.js.map +0 -1
  124. package/lib-commonjs/components/SliderField/index.js +0 -10
  125. package/lib-commonjs/components/SliderField/index.js.map +0 -1
  126. package/lib-commonjs/components/SpinButtonField/SpinButtonField.js +0 -24
  127. package/lib-commonjs/components/SpinButtonField/SpinButtonField.js.map +0 -1
  128. package/lib-commonjs/components/SpinButtonField/index.js +0 -10
  129. package/lib-commonjs/components/SpinButtonField/index.js.map +0 -1
  130. package/lib-commonjs/components/SwitchField/SwitchField.js +0 -24
  131. package/lib-commonjs/components/SwitchField/SwitchField.js.map +0 -1
  132. package/lib-commonjs/components/SwitchField/index.js +0 -10
  133. package/lib-commonjs/components/SwitchField/index.js.map +0 -1
  134. package/lib-commonjs/components/TextareaField/TextareaField.js +0 -24
  135. package/lib-commonjs/components/TextareaField/TextareaField.js.map +0 -1
  136. package/lib-commonjs/components/TextareaField/index.js +0 -10
  137. package/lib-commonjs/components/TextareaField/index.js.map +0 -1
package/CHANGELOG.json CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@fluentui/react-field",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 09 Nov 2022 04:26:43 GMT",
6
- "tag": "@fluentui/react-field_v0.0.0-nightly-20221109-0420.1",
7
- "version": "0.0.0-nightly-20221109-0420.1",
5
+ "date": "Thu, 10 Nov 2022 04:33:19 GMT",
6
+ "tag": "@fluentui/react-field_v0.0.0-nightly-20221110-0427.1",
7
+ "version": "0.0.0-nightly-20221110-0427.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
@@ -16,92 +16,32 @@
16
16
  {
17
17
  "author": "beachball",
18
18
  "package": "@fluentui/react-field",
19
- "comment": "Bump @fluentui/react-checkbox to v0.0.0-nightly-20221109-0420.1",
20
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
19
+ "comment": "Bump @fluentui/react-context-selector to v0.0.0-nightly-20221110-0427.1",
20
+ "commit": "355dcaf0cfd4937890081a47fedf50324b210145"
21
21
  },
22
22
  {
23
23
  "author": "beachball",
24
24
  "package": "@fluentui/react-field",
25
- "comment": "Bump @fluentui/react-combobox to v0.0.0-nightly-20221109-0420.1",
26
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
25
+ "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20221110-0427.1",
26
+ "commit": "355dcaf0cfd4937890081a47fedf50324b210145"
27
27
  },
28
28
  {
29
29
  "author": "beachball",
30
30
  "package": "@fluentui/react-field",
31
- "comment": "Bump @fluentui/react-context-selector to v0.0.0-nightly-20221109-0420.1",
32
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
31
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20221110-0427.1",
32
+ "commit": "355dcaf0cfd4937890081a47fedf50324b210145"
33
33
  },
34
34
  {
35
35
  "author": "beachball",
36
36
  "package": "@fluentui/react-field",
37
- "comment": "Bump @fluentui/react-input to v0.0.0-nightly-20221109-0420.1",
38
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
37
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20221110-0427.1",
38
+ "commit": "355dcaf0cfd4937890081a47fedf50324b210145"
39
39
  },
40
40
  {
41
41
  "author": "beachball",
42
42
  "package": "@fluentui/react-field",
43
- "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20221109-0420.1",
44
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
45
- },
46
- {
47
- "author": "beachball",
48
- "package": "@fluentui/react-field",
49
- "comment": "Bump @fluentui/react-progress to v0.0.0-nightly-20221109-0420.1",
50
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
51
- },
52
- {
53
- "author": "beachball",
54
- "package": "@fluentui/react-field",
55
- "comment": "Bump @fluentui/react-radio to v0.0.0-nightly-20221109-0420.1",
56
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
57
- },
58
- {
59
- "author": "beachball",
60
- "package": "@fluentui/react-field",
61
- "comment": "Bump @fluentui/react-select to v0.0.0-nightly-20221109-0420.1",
62
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
63
- },
64
- {
65
- "author": "beachball",
66
- "package": "@fluentui/react-field",
67
- "comment": "Bump @fluentui/react-slider to v0.0.0-nightly-20221109-0420.1",
68
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
69
- },
70
- {
71
- "author": "beachball",
72
- "package": "@fluentui/react-field",
73
- "comment": "Bump @fluentui/react-spinbutton to v0.0.0-nightly-20221109-0420.1",
74
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
75
- },
76
- {
77
- "author": "beachball",
78
- "package": "@fluentui/react-field",
79
- "comment": "Bump @fluentui/react-switch to v0.0.0-nightly-20221109-0420.1",
80
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
81
- },
82
- {
83
- "author": "beachball",
84
- "package": "@fluentui/react-field",
85
- "comment": "Bump @fluentui/react-textarea to v0.0.0-nightly-20221109-0420.1",
86
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
87
- },
88
- {
89
- "author": "beachball",
90
- "package": "@fluentui/react-field",
91
- "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20221109-0420.1",
92
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
93
- },
94
- {
95
- "author": "beachball",
96
- "package": "@fluentui/react-field",
97
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20221109-0420.1",
98
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
99
- },
100
- {
101
- "author": "beachball",
102
- "package": "@fluentui/react-field",
103
- "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221109-0420.1",
104
- "commit": "47a7111d5c8ff57f72c53633547be3355ab50770"
43
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221110-0427.1",
44
+ "commit": "355dcaf0cfd4937890081a47fedf50324b210145"
105
45
  }
106
46
  ]
107
47
  }
package/CHANGELOG.md CHANGED
@@ -1,32 +1,22 @@
1
1
  # Change Log - @fluentui/react-field
2
2
 
3
- This log was last generated on Wed, 09 Nov 2022 04:26:43 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 10 Nov 2022 04:33:19 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20221109-0420.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v0.0.0-nightly-20221109-0420.1)
7
+ ## [0.0.0-nightly-20221110-0427.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v0.0.0-nightly-20221110-0427.1)
8
8
 
9
- Wed, 09 Nov 2022 04:26:43 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.0.0-alpha.7..@fluentui/react-field_v0.0.0-nightly-20221109-0420.1)
9
+ Thu, 10 Nov 2022 04:33:19 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-field_v9.0.0-alpha.7..@fluentui/react-field_v0.0.0-nightly-20221110-0427.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/react-checkbox to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
16
- - Bump @fluentui/react-combobox to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
17
- - Bump @fluentui/react-context-selector to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
18
- - Bump @fluentui/react-input to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
19
- - Bump @fluentui/react-label to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
20
- - Bump @fluentui/react-progress to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
21
- - Bump @fluentui/react-radio to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
22
- - Bump @fluentui/react-select to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
23
- - Bump @fluentui/react-slider to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
24
- - Bump @fluentui/react-spinbutton to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
25
- - Bump @fluentui/react-switch to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
26
- - Bump @fluentui/react-textarea to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
27
- - Bump @fluentui/react-theme to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
28
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
29
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221109-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/47a7111d5c8ff57f72c53633547be3355ab50770) by beachball)
15
+ - Bump @fluentui/react-context-selector to v0.0.0-nightly-20221110-0427.1 ([commit](https://github.com/microsoft/fluentui/commit/355dcaf0cfd4937890081a47fedf50324b210145) by beachball)
16
+ - Bump @fluentui/react-label to v0.0.0-nightly-20221110-0427.1 ([commit](https://github.com/microsoft/fluentui/commit/355dcaf0cfd4937890081a47fedf50324b210145) by beachball)
17
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20221110-0427.1 ([commit](https://github.com/microsoft/fluentui/commit/355dcaf0cfd4937890081a47fedf50324b210145) by beachball)
18
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20221110-0427.1 ([commit](https://github.com/microsoft/fluentui/commit/355dcaf0cfd4937890081a47fedf50324b210145) by beachball)
19
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221110-0427.1 ([commit](https://github.com/microsoft/fluentui/commit/355dcaf0cfd4937890081a47fedf50324b210145) by beachball)
30
20
 
31
21
  ## [9.0.0-alpha.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-field_v9.0.0-alpha.7)
32
22
 
package/dist/index.d.ts CHANGED
@@ -1,60 +1,18 @@
1
1
  /// <reference types="react" />
2
2
 
3
- import { Checkbox } from '@fluentui/react-checkbox';
4
- import type { CheckboxProps } from '@fluentui/react-checkbox';
5
- import { Combobox } from '@fluentui/react-combobox';
6
3
  import type { ComponentProps } from '@fluentui/react-utilities';
7
4
  import type { ComponentState } from '@fluentui/react-utilities';
8
- import { ForwardRefComponent } from '@fluentui/react-utilities';
9
- import { Input } from '@fluentui/react-input';
10
5
  import { Label } from '@fluentui/react-label';
11
- import { Progress } from '@fluentui/react-progress';
12
- import { RadioGroup } from '@fluentui/react-radio';
13
6
  import * as React_2 from 'react';
14
- import { Select } from '@fluentui/react-select';
15
- import { Slider } from '@fluentui/react-slider';
16
7
  import type { Slot } from '@fluentui/react-utilities';
17
- import { SlotClassNames } from '@fluentui/react-utilities';
8
+ import type { SlotClassNames } from '@fluentui/react-utilities';
18
9
  import type { SlotRenderFunction } from '@fluentui/react-utilities';
19
10
  import type { SlotShorthandValue } from '@fluentui/react-utilities';
20
- import { SpinButton } from '@fluentui/react-spinbutton';
21
- import { Switch } from '@fluentui/react-switch';
22
- import { Textarea } from '@fluentui/react-textarea';
23
-
24
- export declare const CheckboxField: ForwardRefComponent<CheckboxFieldProps>;
25
-
26
- export declare const checkboxFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
27
-
28
- export declare type CheckboxFieldProps = Omit<FieldProps<typeof Checkbox>, 'label'> & {
29
- /**
30
- * The Checkbox's label.
31
- */
32
- label?: CheckboxProps['label'];
33
- /**
34
- * The label for the CheckboxField, which appears above or before the Checkbox, depending on the `orientation` prop.
35
- * It is recommended to only set the `label` prop, and not `fieldLabel`.
36
- */
37
- fieldLabel?: FieldProps<typeof Checkbox>['label'];
38
- };
39
-
40
- export declare const ComboboxField: ForwardRefComponent<ComboboxFieldProps>;
41
-
42
- export declare const comboboxFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
43
-
44
- export declare type ComboboxFieldProps = FieldProps<typeof Combobox>;
45
-
46
- /**
47
- * The minimum requirement for a component used by Field.
48
- *
49
- * Note: the use of VoidFunctionComponent means that component is not *required* to have a children prop,
50
- * but it is still allowed to have a children prop.
51
- */
52
- declare type FieldComponent = React_2.VoidFunctionComponent<Pick<React_2.HTMLAttributes<HTMLElement>, 'id' | 'className' | 'style' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-errormessage'>>;
53
11
 
54
12
  /**
55
13
  * Configuration parameters for a Field class, passed to useField_unstable
56
14
  */
57
- export declare type FieldConfig<T extends FieldComponent> = {
15
+ export declare type FieldConfig<T extends FieldControl> = {
58
16
  /**
59
17
  * The underlying input component that this field is wrapping.
60
18
  */
@@ -81,10 +39,18 @@ export declare type FieldConfig<T extends FieldComponent> = {
81
39
  ariaInvalidOnError?: boolean;
82
40
  };
83
41
 
42
+ /**
43
+ * The minimum requirement for a component used by Field.
44
+ *
45
+ * Note: the use of VoidFunctionComponent means that component is not *required* to have a children prop,
46
+ * but it is still allowed to have a children prop.
47
+ */
48
+ export declare type FieldControl = React_2.VoidFunctionComponent<Pick<React_2.HTMLAttributes<HTMLElement>, 'id' | 'className' | 'style' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-errormessage'>>;
49
+
84
50
  /**
85
51
  * Field Props
86
52
  */
87
- export declare type FieldProps<T extends FieldComponent> = ComponentProps<Partial<FieldSlots<T>>, 'control'> & {
53
+ export declare type FieldProps<T extends FieldControl> = ComponentProps<Partial<FieldSlots<T>>, 'control'> & {
88
54
  /**
89
55
  * The orientation of the label relative to the field component.
90
56
  * This only affects the label, and not the validationMessage or hint (which always appear below the field component).
@@ -108,7 +74,7 @@ export declare type FieldProps<T extends FieldComponent> = ComponentProps<Partia
108
74
  * This allows Field to forward the required and size props to the label if the underlying component supports them,
109
75
  * but doesn't add them to the public API of fields that don't support them.
110
76
  */
111
- declare type FieldPropsWithOptionalComponentProps<T extends FieldComponent> = FieldProps<T> & {
77
+ declare type FieldPropsWithOptionalComponentProps<T extends FieldControl> = FieldProps<T> & {
112
78
  /**
113
79
  * Whether the field label should be marked as required.
114
80
  */
@@ -124,7 +90,7 @@ declare type FieldPropsWithOptionalComponentProps<T extends FieldComponent> = Fi
124
90
  /**
125
91
  * Slots added by Field
126
92
  */
127
- export declare type FieldSlots<T extends FieldComponent> = {
93
+ export declare type FieldSlots<T extends FieldControl> = {
128
94
  root: NonNullable<Slot<'div'>>;
129
95
  /**
130
96
  * The underlying component wrapped by this field.
@@ -154,46 +120,16 @@ export declare type FieldSlots<T extends FieldComponent> = {
154
120
  /**
155
121
  * State used in rendering Field
156
122
  */
157
- export declare type FieldState<T extends FieldComponent> = ComponentState<Required<FieldSlots<T>>> & Pick<FieldProps<T>, 'orientation' | 'validationState'> & {
123
+ export declare type FieldState<T extends FieldControl> = ComponentState<Required<FieldSlots<T>>> & Pick<FieldProps<T>, 'orientation' | 'validationState'> & {
158
124
  classNames: SlotClassNames<FieldSlots<T>>;
159
125
  };
160
126
 
161
- export declare const getFieldClassNames: (name: string) => SlotClassNames<FieldSlots<FieldComponent>>;
162
-
163
- export declare const InputField: ForwardRefComponent<InputFieldProps>;
164
-
165
- export declare const inputFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
166
-
167
- export declare type InputFieldProps = FieldProps<typeof Input>;
168
-
169
- export declare const ProgressField: ForwardRefComponent<ProgressFieldProps>;
170
-
171
- export declare const progressFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
172
-
173
- export declare type ProgressFieldProps = FieldProps<typeof Progress>;
174
-
175
- export declare const RadioGroupField: ForwardRefComponent<RadioGroupFieldProps>;
176
-
177
- export declare const radioGroupFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
178
-
179
- export declare type RadioGroupFieldProps = FieldProps<typeof RadioGroup>;
127
+ export declare const getFieldClassNames: (name: string) => SlotClassNames<FieldSlots<FieldControl>>;
180
128
 
181
129
  /**
182
130
  * Render the final JSX of Field
183
131
  */
184
- export declare const renderField_unstable: <T extends FieldComponent>(state: FieldState<T>) => JSX.Element;
185
-
186
- export declare const SelectField: ForwardRefComponent<SelectFieldProps>;
187
-
188
- export declare const selectFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
189
-
190
- export declare type SelectFieldProps = FieldProps<typeof Select>;
191
-
192
- export declare const SliderField: ForwardRefComponent<SliderFieldProps>;
193
-
194
- export declare const sliderFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
195
-
196
- export declare type SliderFieldProps = FieldProps<typeof Slider>;
132
+ export declare const renderField_unstable: <T extends FieldControl>(state: FieldState<T>) => JSX.Element;
197
133
 
198
134
  declare type SlotComponent<Type extends React_2.ComponentType | React_2.VoidFunctionComponent> = WithSlotShorthandValue<Type extends React_2.ComponentType<infer Props> ? WithSlotRenderFunction<Props extends {
199
135
  children?: unknown;
@@ -201,24 +137,6 @@ declare type SlotComponent<Type extends React_2.ComponentType | React_2.VoidFunc
201
137
  children?: never;
202
138
  }> : never>;
203
139
 
204
- export declare const SpinButtonField: ForwardRefComponent<SpinButtonFieldProps>;
205
-
206
- export declare const spinButtonFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
207
-
208
- export declare type SpinButtonFieldProps = FieldProps<typeof SpinButton>;
209
-
210
- export declare const SwitchField: ForwardRefComponent<SwitchFieldProps>;
211
-
212
- export declare const switchFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
213
-
214
- export declare type SwitchFieldProps = Omit<FieldProps<typeof Switch>, 'labelPosition'>;
215
-
216
- export declare const TextareaField: ForwardRefComponent<TextareaFieldProps>;
217
-
218
- export declare const textareaFieldClassNames: SlotClassNames<FieldSlots<FieldComponent>>;
219
-
220
- export declare type TextareaFieldProps = FieldProps<typeof Textarea>;
221
-
222
140
  /**
223
141
  * Create the state required to render Field.
224
142
  *
@@ -229,12 +147,12 @@ export declare type TextareaFieldProps = FieldProps<typeof Textarea>;
229
147
  * @param ref - Ref to the control slot (primary slot)
230
148
  * @param params - Configuration parameters for this Field
231
149
  */
232
- export declare const useField_unstable: <T extends FieldComponent>(props: FieldPropsWithOptionalComponentProps<T>, ref: React_2.Ref<HTMLElement>, params: FieldConfig<T>) => FieldState<T>;
150
+ export declare const useField_unstable: <T extends FieldControl>(props: FieldPropsWithOptionalComponentProps<T>, ref: React_2.Ref<HTMLElement>, params: FieldConfig<T>) => FieldState<T>;
233
151
 
234
152
  /**
235
153
  * Apply styling to the Field slots based on the state
236
154
  */
237
- export declare const useFieldStyles_unstable: <T extends FieldComponent>(state: FieldState<T>) => void;
155
+ export declare const useFieldStyles_unstable: <T extends FieldControl>(state: FieldState<T>) => void;
238
156
 
239
157
  declare type WithSlotRenderFunction<Props extends {
240
158
  children?: unknown;
@@ -1 +1 @@
1
- {"version":3,"file":"Field.types.js","sourceRoot":"","sources":["../../../src/components/Field/Field.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot, SlotClassNames } from '@fluentui/react-utilities';\nimport type { SlotComponent } from './SlotComponent.types';\n\n/**\n * The minimum requirement for a component used by Field.\n *\n * Note: the use of VoidFunctionComponent means that component is not *required* to have a children prop,\n * but it is still allowed to have a children prop.\n */\nexport type FieldComponent = React.VoidFunctionComponent<\n Pick<\n React.HTMLAttributes<HTMLElement>,\n 'id' | 'className' | 'style' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-errormessage'\n >\n>;\n\n/**\n * Slots added by Field\n */\nexport type FieldSlots<T extends FieldComponent> = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * The underlying component wrapped by this field.\n */\n control: SlotComponent<T>;\n\n /**\n * The label associated with the field.\n */\n label?: Slot<typeof Label>;\n\n /**\n * A message about the validation state. The appearance of the `validationMessage` depends on `validationState`.\n */\n validationMessage?: Slot<'div'>;\n\n /**\n * The icon associated with the `validationMessage`. If the `validationState` prop is set, this will default to an\n * icon corresponding to that state.\n *\n * This will only be displayed if `validationMessage` is set.\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<T extends FieldComponent> = ComponentProps<Partial<FieldSlots<T>>, 'control'> & {\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 color of the `validationMessage`, the `validationMessageIcon`, and for some\n * field components, an `validationState=\"error\"` causes the border to become red.\n *\n * @default undefined\n */\n validationState?: 'error' | 'warning' | 'success';\n};\n\n/**\n * FieldProps plus extra optional props that are supported by useField_unstable, but not required to be part of the\n * API of every Field component.\n *\n * This allows Field to forward the required and size props to the label if the underlying component supports them,\n * but doesn't add them to the public API of fields that don't support them.\n */\nexport type FieldPropsWithOptionalComponentProps<T extends FieldComponent> = FieldProps<T> & {\n /**\n * Whether the field label should be marked as required.\n */\n required?: boolean;\n\n /**\n * Size of the field label.\n *\n * Number sizes will be ignored, but are allowed because the HTML `<input>` element has a prop `size?: number`.\n */\n size?: 'small' | 'medium' | 'large' | number;\n};\n\n/**\n * Configuration parameters for a Field class, passed to useField_unstable\n */\nexport type FieldConfig<T extends FieldComponent> = {\n /**\n * The underlying input component that this field is wrapping.\n */\n component: T;\n\n /**\n * Class names for this component, created by `getFieldClassNames`.\n */\n classNames: SlotClassNames<FieldSlots<T>>;\n\n /**\n * How the label be connected to the control.\n * * htmlFor - Set the Label's htmlFor prop to the component's ID (and generate an ID if not provided).\n * This is the preferred method for components that use the underlying <input> tag.\n * * aria-labelledby - Set the component's aria-labelledby prop to the Label's ID. Use this for components\n * that are not directly <input> elements (such as RadioGroup).\n *\n * @default htmlFor\n */\n labelConnection?: 'htmlFor' | 'aria-labelledby';\n\n /**\n * Should the aria-invalid and aria-errormessage attributes be set when validationState=\"error\".\n *\n * @default true\n */\n ariaInvalidOnError?: boolean;\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState<T extends FieldComponent> = ComponentState<Required<FieldSlots<T>>> &\n Pick<FieldProps<T>, 'orientation' | 'validationState'> & {\n classNames: SlotClassNames<FieldSlots<T>>;\n };\n"]}
1
+ {"version":3,"file":"Field.types.js","sourceRoot":"","sources":["../../../src/components/Field/Field.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot, SlotClassNames } from '@fluentui/react-utilities';\nimport type { SlotComponent } from './SlotComponent.types';\n\n/**\n * The minimum requirement for a component used by Field.\n *\n * Note: the use of VoidFunctionComponent means that component is not *required* to have a children prop,\n * but it is still allowed to have a children prop.\n */\nexport type FieldControl = React.VoidFunctionComponent<\n Pick<\n React.HTMLAttributes<HTMLElement>,\n 'id' | 'className' | 'style' | 'aria-labelledby' | 'aria-describedby' | 'aria-invalid' | 'aria-errormessage'\n >\n>;\n\n/**\n * Slots added by Field\n */\nexport type FieldSlots<T extends FieldControl> = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * The underlying component wrapped by this field.\n */\n control: SlotComponent<T>;\n\n /**\n * The label associated with the field.\n */\n label?: Slot<typeof Label>;\n\n /**\n * A message about the validation state. The appearance of the `validationMessage` depends on `validationState`.\n */\n validationMessage?: Slot<'div'>;\n\n /**\n * The icon associated with the `validationMessage`. If the `validationState` prop is set, this will default to an\n * icon corresponding to that state.\n *\n * This will only be displayed if `validationMessage` is set.\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<T extends FieldControl> = ComponentProps<Partial<FieldSlots<T>>, 'control'> & {\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 color of the `validationMessage`, the `validationMessageIcon`, and for some\n * field components, an `validationState=\"error\"` causes the border to become red.\n *\n * @default undefined\n */\n validationState?: 'error' | 'warning' | 'success';\n};\n\n/**\n * FieldProps plus extra optional props that are supported by useField_unstable, but not required to be part of the\n * API of every Field component.\n *\n * This allows Field to forward the required and size props to the label if the underlying component supports them,\n * but doesn't add them to the public API of fields that don't support them.\n */\nexport type FieldPropsWithOptionalComponentProps<T extends FieldControl> = FieldProps<T> & {\n /**\n * Whether the field label should be marked as required.\n */\n required?: boolean;\n\n /**\n * Size of the field label.\n *\n * Number sizes will be ignored, but are allowed because the HTML `<input>` element has a prop `size?: number`.\n */\n size?: 'small' | 'medium' | 'large' | number;\n};\n\n/**\n * Configuration parameters for a Field class, passed to useField_unstable\n */\nexport type FieldConfig<T extends FieldControl> = {\n /**\n * The underlying input component that this field is wrapping.\n */\n component: T;\n\n /**\n * Class names for this component, created by `getFieldClassNames`.\n */\n classNames: SlotClassNames<FieldSlots<T>>;\n\n /**\n * How the label be connected to the control.\n * * htmlFor - Set the Label's htmlFor prop to the component's ID (and generate an ID if not provided).\n * This is the preferred method for components that use the underlying <input> tag.\n * * aria-labelledby - Set the component's aria-labelledby prop to the Label's ID. Use this for components\n * that are not directly <input> elements (such as RadioGroup).\n *\n * @default htmlFor\n */\n labelConnection?: 'htmlFor' | 'aria-labelledby';\n\n /**\n * Should the aria-invalid and aria-errormessage attributes be set when validationState=\"error\".\n *\n * @default true\n */\n ariaInvalidOnError?: boolean;\n};\n\n/**\n * State used in rendering Field\n */\nexport type FieldState<T extends FieldControl> = ComponentState<Required<FieldSlots<T>>> &\n Pick<FieldProps<T>, 'orientation' | 'validationState'> & {\n classNames: SlotClassNames<FieldSlots<T>>;\n };\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Field/renderField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,oBAAoB,GAA8B,KAA3B,IAAmD;EACrF,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAA6B,KAA7B,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,iBAAe,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADlB,EAGG,KAAK,CAAC,OAAN,iBAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAM,SAAS,CAAC;EAAhB,CAAd,CAHpB,EAIG,KAAK,CAAC,iBAAN,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,iBAAP,EAAwB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAxB,EACG,KAAK,CAAC,qBAAN,iBAA+B,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,qBAAP,EAA4B,EAAA,GAAK,SAAS,CAAC;EAAf,CAA5B,CADlC,EAEG,SAAS,CAAC,iBAAV,CAA4B,QAF/B,CALJ,EAUG,KAAK,CAAC,IAAN,iBAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAVjB,CADF;AAcD,CAjBM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FieldComponent, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = <T extends FieldComponent>(state: FieldState<T>) => {\n const { slots, slotProps } = getSlots<FieldSlots<FieldComponent>>(state as FieldState<FieldComponent>);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n {slots.control && <slots.control {...(slotProps.control as any)} />}\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 );\n};\n"],"sourceRoot":""}
1
+ {"version":3,"sources":["../../../src/components/Field/renderField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,oBAAoB,GAA4B,KAAzB,IAAiD;EACnF,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAA2B,KAA3B,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,iBAAe,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADlB,EAGG,KAAK,CAAC,OAAN,iBAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAM,SAAS,CAAC;EAAhB,CAAd,CAHpB,EAIG,KAAK,CAAC,iBAAN,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,iBAAP,EAAwB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAxB,EACG,KAAK,CAAC,qBAAN,iBAA+B,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,qBAAP,EAA4B,EAAA,GAAK,SAAS,CAAC;EAAf,CAA5B,CADlC,EAEG,SAAS,CAAC,iBAAV,CAA4B,QAF/B,CALJ,EAUG,KAAK,CAAC,IAAN,iBAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAVjB,CADF;AAcD,CAjBM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FieldControl, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = <T extends FieldControl>(state: FieldState<T>) => {\n const { slots, slotProps } = getSlots<FieldSlots<FieldControl>>(state as FieldState<FieldControl>);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n {slots.control && <slots.control {...(slotProps.control as any)} />}\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 );\n};\n"],"sourceRoot":""}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/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 FieldComponent,\n FieldConfig,\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<FieldComponent>>(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 FieldComponent>(\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<FieldComponent> = {\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":""}
1
+ {"version":3,"sources":["../../../src/components/Field/useField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,uBAAT,EAAkC,mBAAlC,EAAuD,eAAvD,QAA8E,uBAA9E;AACA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AASA,MAAM,sBAAsB,GAAG;EAC7B,KAAK,eAAE,KAAA,CAAA,aAAA,CAAC,mBAAD,EAAoB,IAApB,CADsB;EAE7B,OAAO,eAAE,KAAA,CAAA,aAAA,CAAC,eAAD,EAAgB,IAAhB,CAFoB;EAG7B,OAAO,eAAE,KAAA,CAAA,aAAA,CAAC,uBAAD,EAAwB,IAAxB;AAHoB,CAA/B;AAMA;;AAEG;;AACH,OAAO,MAAM,wBAAwB,GAA4C,KAAzC,IAAyD;EAC/F,MAAM;IACJ,SADI;IAEJ,OAFI;IAGJ,IAHI;IAIJ,KAJI;IAKJ,WALI;IAMJ,IANI;IAOJ,KAPI;IAQJ,iBARI;IASJ,qBATI;IAUJ,eAVI;IAWJ,GAAG;EAXC,IAYF,KAZJ;EAcA,MAAM,UAAU,GAAG;IACjB,SADiB;IAEjB,OAFiB;IAGjB,IAHiB;IAIjB,KAJiB;IAKjB,WALiB;IAMjB,IANiB;IAOjB,KAPiB;IAQjB,iBARiB;IASjB,qBATiB;IAUjB;EAViB,CAAnB;EAaA,OAAO,CAAC,UAAD,EAAa,WAAb,CAAP;AACD,CA7BM;AA+BP;;;;;;;;;AASG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAC/B,KAD+B,EAE/B,GAF+B,EAG/B,MAH+B,KAId;;;EACjB,MAAM,CAAC,UAAD,EAAa,YAAb,IAA6B,wBAAwB,CAAC,KAAD,CAA3D;EACA,MAAM;IAAE,WAAW,GAAG,UAAhB;IAA4B;EAA5B,IAAgD,UAAtD;EACA,MAAM;IAAE,eAAe,GAAG,SAApB;IAA+B,kBAAkB,GAAG;EAApD,IAA6D,MAAnE;EAEA,MAAM,MAAM,GAAG,KAAK,CAAC,QAAD,CAApB;EAEA,MAAM,IAAI,GAAG,gBAAgB,CAAC,UAAU,CAAC,IAAZ,EAAkB;IAC7C,QAAQ,EAAE,IADmC;IAE7C,YAAY,EAAE,qBAAqB,CAAC,KAAD,EAAQ,UAAR;EAFU,CAAlB,CAA7B;EAKA,MAAM,OAAO,GAAG,gBAAgB,CAAC,UAAU,CAAC,OAAZ,EAAqB;IACnD,QAAQ,EAAE,IADyC;IAEnD,YAAY,EAAE;MACZ,GADY;MAEZ,EAAE,EAAE,MAAM,GAAG,WAFD;MAGZ,GAAG;IAHS;EAFqC,CAArB,CAAhC;EASA,MAAM,KAAK,GAAG,gBAAgB,CAAC,UAAU,CAAC,KAAZ,EAAmB;IAC/C,YAAY,EAAE;MACZ,EAAE,EAAE,MAAM,GAAG,SADD;MAEZ,QAAQ,EAAE,YAAY,CAAC,QAFX;MAGZ,IAAI,EAAE,OAAO,YAAY,CAAC,IAApB,KAA6B,QAA7B,GAAwC,YAAY,CAAC,IAArD,GAA4D,SAHtD;MAIZ,OAAO,EAAE,eAAe,KAAK,SAApB,GAAgC,OAAO,CAAC,EAAxC,GAA6C;IAJ1C;EADiC,CAAnB,CAA9B;EASA,MAAM,iBAAiB,GAAG,gBAAgB,CAAC,UAAU,CAAC,iBAAZ,EAA+B;IACvE,YAAY,EAAE;MACZ,EAAE,EAAE,MAAM,GAAG;IADD;EADyD,CAA/B,CAA1C;EAMA,MAAM,IAAI,GAAG,gBAAgB,CAAC,UAAU,CAAC,IAAZ,EAAkB;IAC7C,YAAY,EAAE;MACZ,EAAE,EAAE,MAAM,GAAG;IADD;EAD+B,CAAlB,CAA7B;EAMA,MAAM,qBAAqB,GAAG,gBAAgB,CAAC,UAAU,CAAC,qBAAZ,EAAmC;IAC/E,QAAQ,EAAE,CAAC,CAAC,eADmE;IAE/E,YAAY,EAAE;MACZ,QAAQ,EAAE,eAAe,GAAG,sBAAsB,CAAC,eAAD,CAAzB,GAA6C;IAD1D;EAFiE,CAAnC,CAA9C,CA1CiB,CAiDjB;;EACA,IAAI,KAAK,IAAI,eAAe,KAAK,iBAAjC,EAAoD;IAClD,CAAA,EAAA,GAAA,OAAO,CAAC,iBAAD,CAAP,MAAyB,IAAzB,IAAyB,EAAA,KAAA,KAAA,CAAzB,GAAyB,EAAzB,GAAA,OAAO,CAAC,iBAAD,CAAP,GAA+B,KAAK,CAAC,EAArC;EACD;;EAED,IAAI,eAAe,KAAK,OAApB,IAA+B,kBAAnC,EAAuD;IACrD,CAAA,EAAA,GAAA,OAAO,CAAC,cAAD,CAAP,MAAsB,IAAtB,IAAsB,EAAA,KAAA,KAAA,CAAtB,GAAsB,EAAtB,GAAA,OAAO,CAAC,cAAD,CAAP,GAA4B,IAA5B;;IACA,IAAI,iBAAJ,EAAuB;MACrB,CAAA,EAAA,GAAA,OAAO,CAAC,mBAAD,CAAP,MAA2B,IAA3B,IAA2B,EAAA,KAAA,KAAA,CAA3B,GAA2B,EAA3B,GAAA,OAAO,CAAC,mBAAD,CAAP,GAAiC,iBAAiB,CAAC,EAAnD;IACD;;IACD,IAAI,IAAJ,EAAU;MACR,CAAA,EAAA,GAAA,OAAO,CAAC,kBAAD,CAAP,MAA0B,IAA1B,IAA0B,EAAA,KAAA,KAAA,CAA1B,GAA0B,EAA1B,GAAA,OAAO,CAAC,kBAAD,CAAP,GAAgC,IAAI,CAAC,EAArC;IACD;EACF,CARD,MAQO;IACL;IACA,MAAM,WAAW,GAAG,iBAAiB,IAAI,IAAzC;;IACA,IAAI,WAAJ,EAAiB;MACf,CAAA,EAAA,GAAA,OAAO,CAAC,kBAAD,CAAP,MAA0B,IAA1B,IAA0B,EAAA,KAAA,KAAA,CAA1B,GAA0B,EAA1B,GAAA,OAAO,CAAC,kBAAD,CAAP,GAAgC,iBAAiB,IAAI,IAArB,GAA4B,GAAG,iBAAiB,CAAC,EAAE,IAAI,IAAI,CAAC,EAAE,EAA9D,GAAmE,WAAW,CAAC,EAA/G;IACD;EACF;;EAED,MAAM,KAAK,GAA6B;IACtC,WADsC;IAEtC,eAFsC;IAGtC,UAAU,EAAE,MAAM,CAAC,UAHmB;IAItC,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE,MAAM,CAAC,SAFN;MAGV,KAAK,EAAE,KAHG;MAIV,iBAAiB,EAAE,KAJT;MAKV,qBAAqB,EAAE,MALb;MAMV,IAAI,EAAE;IANI,CAJ0B;IAYtC,IAZsC;IAatC,OAbsC;IActC,KAdsC;IAetC,qBAfsC;IAgBtC,iBAhBsC;IAiBtC;EAjBsC,CAAxC;EAoBA,OAAO,KAAP;AACD,CA/FM","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":""}
@@ -1,5 +1,5 @@
1
- import { __styles, mergeClasses } from '@griffel/react';
2
1
  import { tokens, typographyStyles } from '@fluentui/react-theme';
2
+ import { __styles, mergeClasses } from '@griffel/react';
3
3
  export const getFieldClassNames = name => ({
4
4
  root: `fui-${name}`,
5
5
  control: `fui-${name}__control`,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Field/useFieldStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AAGA,SAAS,MAAT,EAAiB,gBAAjB,QAAyC,uBAAzC;AAEA,OAAO,MAAM,kBAAkB,GAAI,IAAD,KAA+D;EAC/F,IAAI,EAAE,OAAO,IAAI,EAD8E;EAE/F,OAAO,EAAE,OAAO,IAAI,WAF2E;EAG/F,KAAK,EAAE,OAAO,IAAI,SAH6E;EAI/F,iBAAiB,EAAE,OAAO,IAAI,qBAJiE;EAK/F,qBAAqB,EAAE,OAAO,IAAI,yBAL6D;EAM/F,IAAI,EAAE,OAAO,IAAI;AAN8E,CAA/D,CAA3B;AASP;;AAEG;;AACH,MAAM,aAAa,gBAAG;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAtB;;AAiBA,MAAM,cAAc,gBAAG;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAvB;;AAeA,MAAM,sBAAsB,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAA/B;;AAYA,MAAM,8BAA8B,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAvC;AAmBA;;AAEG;;;AACH,OAAO,MAAM,uBAAuB,GAA8B,KAA3B,IAAmD;EACxF,MAAM,UAAU,GAAG,KAAK,CAAC,UAAzB;EACA,MAAM,eAAe,GAAkD,KAAK,CAAC,eAA7E;EACA,MAAM,UAAU,GAAG,KAAK,CAAC,WAAN,KAAsB,YAAzC;EAEA,MAAM,UAAU,GAAG,aAAa,EAAhC;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,UAAU,CAAC,IADsB,EAEjC,UAAU,CAAC,IAFsB,EAGjC,UAAU,IAAI,UAAU,CAAC,UAHQ,EAIjC,KAAK,CAAC,IAAN,CAAW,SAJsB,CAAnC;;EAOA,IAAI,KAAK,CAAC,OAAV,EAAmB;IACjB,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,YAAY,CACpC,UAAU,CAAC,OADyB,EAEpC,UAAU,IAAI,UAAU,CAAC,YAFW,EAGpC,KAAK,CAAC,OAAN,CAAc,SAHsB,CAAtC;EAKD;;EAED,MAAM,WAAW,GAAG,cAAc,EAAlC;;EACA,IAAI,KAAK,CAAC,KAAV,EAAiB;IACf,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,YAAY,CAClC,UAAU,CAAC,KADuB,EAElC,WAAW,CAAC,IAFsB,EAGlC,UAAU,IAAI,WAAW,CAAC,UAHQ,EAIlC,KAAK,CAAC,KAAN,CAAY,SAJsB,CAApC;EAMD;;EAED,MAAM,2BAA2B,GAAG,8BAA8B,EAAlE;;EACA,IAAI,KAAK,CAAC,qBAAV,EAAiC;IAC/B,KAAK,CAAC,qBAAN,CAA4B,SAA5B,GAAwC,YAAY,CAClD,UAAU,CAAC,qBADuC,EAElD,2BAA2B,CAAC,IAFsB,EAGlD,CAAC,CAAC,eAAF,IAAqB,2BAA2B,CAAC,eAAD,CAHE,EAIlD,KAAK,CAAC,qBAAN,CAA4B,SAJsB,CAApD;EAMD;;EAED,MAAM,mBAAmB,GAAG,sBAAsB,EAAlD;;EACA,IAAI,KAAK,CAAC,iBAAV,EAA6B;IAC3B,KAAK,CAAC,iBAAN,CAAwB,SAAxB,GAAoC,YAAY,CAC9C,UAAU,CAAC,iBADmC,EAE9C,mBAAmB,CAAC,IAF0B,EAG9C,UAAU,IAAI,UAAU,CAAC,YAHqB,EAI9C,eAAe,KAAK,OAApB,IAA+B,mBAAmB,CAAC,KAJL,EAK9C,KAAK,CAAC,iBAAN,CAAwB,SALsB,CAAhD;EAOD;;EAED,IAAI,KAAK,CAAC,IAAV,EAAgB;IACd,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,UAAU,CAAC,IADsB,EAEjC,mBAAmB,CAAC,IAFa,EAGjC,UAAU,IAAI,UAAU,CAAC,YAHQ,EAIjC,KAAK,CAAC,IAAN,CAAW,SAJsB,CAAnC;EAMD;AACF,CA5DM","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { FieldComponent, FieldProps, FieldSlots, FieldState } from './Field.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\n\nexport const getFieldClassNames = (name: string): SlotClassNames<FieldSlots<FieldComponent>> => ({\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 FieldComponent>(state: FieldState<T>) => {\n const classNames = state.classNames;\n const validationState: FieldProps<FieldComponent>['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":""}
1
+ {"version":3,"sources":["../../../src/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":""}
package/lib/index.js CHANGED
@@ -1,12 +1,2 @@
1
1
  export { getFieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';
2
- export { CheckboxField, checkboxFieldClassNames } from './CheckboxField';
3
- export { ComboboxField, comboboxFieldClassNames } from './ComboboxField';
4
- export { InputField, inputFieldClassNames } from './InputField';
5
- export { ProgressField, progressFieldClassNames } from './ProgressField';
6
- export { RadioGroupField, radioGroupFieldClassNames } from './RadioGroupField';
7
- export { SelectField, selectFieldClassNames } from './SelectField';
8
- export { SliderField, sliderFieldClassNames } from './SliderField';
9
- export { SpinButtonField, spinButtonFieldClassNames } from './SpinButtonField';
10
- export { SwitchField, switchFieldClassNames } from './SwitchField';
11
- export { TextareaField, textareaFieldClassNames } from './TextareaField';
12
2
  //# sourceMappingURL=index.js.map
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAG/G,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAGzE,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAGzE,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAGhE,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAGzE,OAAO,EAAE,eAAe,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAG/E,OAAO,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAGnE,OAAO,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAGnE,OAAO,EAAE,eAAe,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAG/E,OAAO,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAGnE,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { getFieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type { FieldProps, FieldSlots, FieldState, FieldConfig } from './Field';\n\nexport { CheckboxField, checkboxFieldClassNames } from './CheckboxField';\nexport type { CheckboxFieldProps } from './CheckboxField';\n\nexport { ComboboxField, comboboxFieldClassNames } from './ComboboxField';\nexport type { ComboboxFieldProps } from './ComboboxField';\n\nexport { InputField, inputFieldClassNames } from './InputField';\nexport type { InputFieldProps } from './InputField';\n\nexport { ProgressField, progressFieldClassNames } from './ProgressField';\nexport type { ProgressFieldProps } from './ProgressField';\n\nexport { RadioGroupField, radioGroupFieldClassNames } from './RadioGroupField';\nexport type { RadioGroupFieldProps } from './RadioGroupField';\n\nexport { SelectField, selectFieldClassNames } from './SelectField';\nexport type { SelectFieldProps } from './SelectField';\n\nexport { SliderField, sliderFieldClassNames } from './SliderField';\nexport type { SliderFieldProps } from './SliderField';\n\nexport { SpinButtonField, spinButtonFieldClassNames } from './SpinButtonField';\nexport type { SpinButtonFieldProps } from './SpinButtonField';\n\nexport { SwitchField, switchFieldClassNames } from './SwitchField';\nexport type { SwitchFieldProps } from './SwitchField';\n\nexport { TextareaField, textareaFieldClassNames } from './TextareaField';\nexport type { TextareaFieldProps } from './TextareaField';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { getFieldClassNames, renderField_unstable, useFieldStyles_unstable, useField_unstable } from './Field';\nexport type { FieldConfig, FieldControl, FieldProps, FieldSlots, FieldState } from './Field';\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/Field/renderField.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,oBAAoB,GAA8B,KAA3B,IAAmD;EACrF,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAqC,KAArC,CAA7B;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,IAAe,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADlB,EAGG,KAAK,CAAC,OAAN,IAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAM,SAAS,CAAC;EAAhB,CAAd,CAHpB,EAIG,KAAK,CAAC,iBAAN,IACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,iBAAP,EAAwB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAxB,EACG,KAAK,CAAC,qBAAN,IAA+B,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,qBAAP,EAA4B,EAAA,GAAK,SAAS,CAAC;EAAf,CAA5B,CADlC,EAEG,SAAS,CAAC,iBAAV,CAA4B,QAF/B,CALJ,EAUG,KAAK,CAAC,IAAN,IAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAVjB,CADF;AAcD,CAjBM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FieldComponent, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = <T extends FieldComponent>(state: FieldState<T>) => {\n const { slots, slotProps } = getSlots<FieldSlots<FieldComponent>>(state as FieldState<FieldComponent>);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n {slots.control && <slots.control {...(slotProps.control as any)} />}\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 );\n};\n"],"sourceRoot":""}
1
+ {"version":3,"sources":["../../../src/components/Field/renderField.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,oBAAoB,GAA4B,KAAzB,IAAiD;EACnF,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAmC,KAAnC,CAA7B;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,IAAe,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADlB,EAGG,KAAK,CAAC,OAAN,IAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAM,SAAS,CAAC;EAAhB,CAAd,CAHpB,EAIG,KAAK,CAAC,iBAAN,IACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,iBAAP,EAAwB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAxB,EACG,KAAK,CAAC,qBAAN,IAA+B,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,qBAAP,EAA4B,EAAA,GAAK,SAAS,CAAC;EAAf,CAA5B,CADlC,EAEG,SAAS,CAAC,iBAAV,CAA4B,QAF/B,CALJ,EAUG,KAAK,CAAC,IAAN,IAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAVjB,CADF;AAcD,CAjBM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FieldControl, FieldSlots, FieldState } from './Field.types';\n\n/**\n * Render the final JSX of Field\n */\nexport const renderField_unstable = <T extends FieldControl>(state: FieldState<T>) => {\n const { slots, slotProps } = getSlots<FieldSlots<FieldControl>>(state as FieldState<FieldControl>);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.label && <slots.label {...slotProps.label} />}\n {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n {slots.control && <slots.control {...(slotProps.control as any)} />}\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 );\n};\n"],"sourceRoot":""}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/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 FieldComponent,\n FieldConfig,\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<FieldComponent>>(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 FieldComponent>(\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<FieldComponent> = {\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":""}
1
+ {"version":3,"sources":["../../../src/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":""}
@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.useFieldStyles_unstable = exports.getFieldClassNames = void 0;
7
7
 
8
- const react_1 = /*#__PURE__*/require("@griffel/react");
9
-
10
8
  const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
9
 
10
+ const react_1 = /*#__PURE__*/require("@griffel/react");
11
+
12
12
  const getFieldClassNames = name => ({
13
13
  root: `fui-${name}`,
14
14
  control: `fui-${name}__control`,