carbon-react 158.50.0 → 159.0.0

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 (293) hide show
  1. package/esm/__internal__/checkable-input/__next__/checkable-input.component.js +1 -1
  2. package/esm/__internal__/checkable-input/__next__/checkable-input.style.js +1 -1
  3. package/esm/__internal__/checkable-input/checkable-input.style.js +1 -1
  4. package/esm/__internal__/error-border/error-border.style.d.ts +4 -0
  5. package/esm/__internal__/error-border/error-border.style.js +1 -0
  6. package/esm/__internal__/fieldset/__next__/fieldset.component.js +1 -1
  7. package/esm/__internal__/fieldset/fieldset.component.js +1 -1
  8. package/esm/__internal__/fieldset-validation-context/fieldset-validation-context.d.ts +6 -0
  9. package/esm/__internal__/fieldset-validation-context/index.d.ts +1 -0
  10. package/esm/__internal__/fieldset-validation-context/index.js +1 -0
  11. package/esm/__internal__/form-field/form-field.component.d.ts +1 -1
  12. package/esm/__internal__/form-field/form-field.component.js +1 -1
  13. package/esm/__internal__/hint-text/hint-text.component.d.ts +6 -21
  14. package/esm/__internal__/hint-text/hint-text.component.js +1 -1
  15. package/esm/__internal__/hint-text/hint-text.style.d.ts +5 -2
  16. package/esm/__internal__/hint-text/hint-text.style.js +1 -1
  17. package/esm/__internal__/hint-text/index.d.ts +0 -1
  18. package/esm/__internal__/input/index.d.ts +2 -5
  19. package/esm/__internal__/input/index.js +1 -1
  20. package/esm/__internal__/input/input-style-overrides.style.d.ts +8 -0
  21. package/esm/__internal__/input/input-style-overrides.style.js +1 -0
  22. package/esm/__internal__/input/input.component.d.ts +22 -31
  23. package/esm/__internal__/input/input.component.js +1 -1
  24. package/esm/__internal__/input/input.style.d.ts +9 -5
  25. package/esm/__internal__/input/input.style.js +1 -1
  26. package/esm/__internal__/input-icon-toggle/input-icon-toggle.component.d.ts +9 -3
  27. package/esm/__internal__/input-icon-toggle/input-icon-toggle.component.js +1 -1
  28. package/esm/__internal__/input-icon-toggle/input-icon-toggle.style.d.ts +7 -9
  29. package/esm/__internal__/input-icon-toggle/input-icon-toggle.style.js +1 -1
  30. package/esm/__internal__/label/index.d.ts +0 -1
  31. package/esm/__internal__/label/label.component.d.ts +14 -31
  32. package/esm/__internal__/label/label.component.js +1 -1
  33. package/esm/__internal__/label/label.style.d.ts +5 -22
  34. package/esm/__internal__/label/label.style.js +1 -1
  35. package/esm/__internal__/legacy-error-border/error-border.style.js +1 -0
  36. package/esm/__internal__/legacy-hint-text/hint-text.component.d.ts +27 -0
  37. package/esm/__internal__/legacy-hint-text/hint-text.component.js +1 -0
  38. package/esm/__internal__/legacy-hint-text/hint-text.style.d.ts +3 -0
  39. package/esm/__internal__/legacy-hint-text/hint-text.style.js +1 -0
  40. package/esm/__internal__/legacy-hint-text/index.d.ts +2 -0
  41. package/esm/__internal__/legacy-hint-text/index.js +1 -0
  42. package/esm/__internal__/legacy-input/index.d.ts +5 -0
  43. package/esm/__internal__/legacy-input/index.js +1 -0
  44. package/{lib/__internal__/input → esm/__internal__/legacy-input}/input-presentation.style.d.ts +1 -1
  45. package/esm/__internal__/{input → legacy-input}/input-presentation.style.js +1 -1
  46. package/esm/__internal__/legacy-input/input.component.d.ts +54 -0
  47. package/esm/__internal__/legacy-input/input.component.js +1 -0
  48. package/esm/__internal__/legacy-input/input.style.d.ts +3 -0
  49. package/esm/__internal__/legacy-input/input.style.js +1 -0
  50. package/esm/__internal__/legacy-label/index.d.ts +2 -0
  51. package/esm/__internal__/legacy-label/index.js +1 -0
  52. package/esm/__internal__/legacy-label/label.component.d.ts +37 -0
  53. package/esm/__internal__/legacy-label/label.component.js +1 -0
  54. package/esm/__internal__/legacy-label/label.style.d.ts +25 -0
  55. package/esm/__internal__/legacy-label/label.style.js +1 -0
  56. package/esm/__internal__/utils/helpers/combine-refs/index.d.ts +3 -0
  57. package/esm/__internal__/utils/helpers/combine-refs/index.js +1 -0
  58. package/esm/__internal__/validation-message/__next__/index.d.ts +1 -0
  59. package/esm/__internal__/validation-message/__next__/index.js +1 -0
  60. package/esm/__internal__/validation-message/__next__/validation-message.component.d.ts +20 -0
  61. package/esm/__internal__/validation-message/__next__/validation-message.component.js +1 -0
  62. package/esm/__internal__/validation-message/__next__/validation-message.style.d.ts +6 -0
  63. package/esm/__internal__/validation-message/__next__/validation-message.style.js +1 -0
  64. package/esm/components/button-toggle/button-toggle-group/button-toggle-group.component.js +1 -1
  65. package/esm/components/checkbox/checkbox-group/checkbox-group.style.js +1 -1
  66. package/esm/components/checkbox/checkbox.style.js +1 -1
  67. package/esm/components/date/date.component.js +1 -1
  68. package/esm/components/date/date.style.js +1 -1
  69. package/esm/components/date-range/date-range.style.js +1 -1
  70. package/esm/components/file-input/file-input.component.d.ts +1 -1
  71. package/esm/components/file-input/file-input.component.js +1 -1
  72. package/esm/components/file-input/file-input.style.d.ts +1 -1
  73. package/esm/components/file-input/file-input.style.js +1 -1
  74. package/esm/components/icon/icon.style.js +1 -1
  75. package/esm/components/inline-inputs/inline-inputs.component.d.ts +5 -1
  76. package/esm/components/inline-inputs/inline-inputs.component.js +1 -1
  77. package/esm/components/inline-inputs/inline-inputs.style.js +1 -1
  78. package/esm/components/menu/menu-full-screen/menu-full-screen.style.js +1 -1
  79. package/esm/components/number/number.component.js +1 -1
  80. package/esm/components/numeral-date/numeral-date.component.d.ts +6 -3
  81. package/esm/components/numeral-date/numeral-date.component.js +1 -1
  82. package/esm/components/numeral-date/numeral-date.style.d.ts +2 -14
  83. package/esm/components/numeral-date/numeral-date.style.js +1 -1
  84. package/esm/components/pager/__internal__/pager-navigation.component.js +1 -1
  85. package/esm/components/pager/pager.component.js +1 -1
  86. package/esm/components/pager/pager.style.js +1 -1
  87. package/esm/components/search/search-button.style.js +1 -1
  88. package/esm/components/search/search.component.js +1 -1
  89. package/esm/components/search/search.style.js +1 -1
  90. package/esm/components/select/__internal__/select-textbox/select-textbox.component.d.ts +12 -3
  91. package/esm/components/select/__internal__/select-textbox/select-textbox.component.js +1 -1
  92. package/esm/components/select/__internal__/select-textbox/select-textbox.style.d.ts +10 -3
  93. package/esm/components/select/__internal__/select-textbox/select-textbox.style.js +1 -1
  94. package/esm/components/select/filterable-select/filterable-select.component.js +1 -1
  95. package/esm/components/select/multi-select/multi-select.component.js +1 -1
  96. package/esm/components/select/multi-select/multi-select.style.js +1 -1
  97. package/esm/components/select/select.style.js +1 -1
  98. package/esm/components/select/simple-select/simple-select.component.js +1 -1
  99. package/esm/components/simple-color-picker/simple-color/simple-color.style.d.ts +1 -1
  100. package/esm/components/simple-color-picker/simple-color/simple-color.style.js +1 -1
  101. package/esm/components/switch/switch.component.js +1 -1
  102. package/esm/components/text-editor/__internal__/__ui__/ContentEditor/content-editor.component.js +1 -1
  103. package/esm/components/text-editor/text-editor.component.js +1 -1
  104. package/esm/components/textarea/textarea.component.d.ts +4 -2
  105. package/esm/components/textarea/textarea.component.js +1 -1
  106. package/esm/components/textarea/textarea.style.js +1 -1
  107. package/esm/components/textbox/__internal__/__next__/index.d.ts +2 -0
  108. package/esm/components/textbox/__internal__/__next__/index.js +1 -0
  109. package/esm/components/textbox/__internal__/__next__/text-input.component.d.ts +91 -0
  110. package/esm/components/textbox/__internal__/__next__/text-input.component.js +1 -0
  111. package/esm/components/textbox/__internal__/__next__/text-input.style.d.ts +21 -0
  112. package/esm/components/textbox/__internal__/__next__/text-input.style.js +1 -0
  113. package/esm/components/textbox/__internal__/__next__/utils.d.ts +81 -0
  114. package/esm/components/textbox/__internal__/__next__/utils.js +1 -0
  115. package/esm/components/textbox/textbox.component.d.ts +21 -17
  116. package/esm/components/textbox/textbox.component.js +1 -1
  117. package/esm/components/tile-select/tile-select.style.d.ts +1 -1
  118. package/esm/components/tile-select/tile-select.style.js +1 -1
  119. package/esm/components/time/time.component.d.ts +1 -1
  120. package/esm/components/time/time.component.js +1 -1
  121. package/esm/components/time/time.style.d.ts +1 -1
  122. package/esm/components/time/time.style.js +1 -1
  123. package/esm/hooks/__internal__/useRegisterValidationToTabs/index.d.ts +0 -0
  124. package/esm/hooks/__internal__/useRegisterValidationToTabs/index.js +1 -0
  125. package/esm/hooks/__internal__/useRegisterValidationToTabs/useRegisterValidationToTabs.d.ts +2 -0
  126. package/esm/hooks/__internal__/useRegisterValidationToTabs/useRegisterValidationToTabs.js +1 -0
  127. package/esm/style/themes/apply-base-theme.d.ts +3 -1
  128. package/esm/style/themes/apply-base-theme.js +1 -1
  129. package/lib/__internal__/checkable-input/__next__/checkable-input.component.js +1 -1
  130. package/lib/__internal__/checkable-input/__next__/checkable-input.style.js +1 -1
  131. package/lib/__internal__/checkable-input/checkable-input.style.js +1 -1
  132. package/lib/__internal__/error-border/error-border.style.d.ts +4 -0
  133. package/lib/__internal__/error-border/error-border.style.js +1 -0
  134. package/lib/__internal__/fieldset/__next__/fieldset.component.js +1 -1
  135. package/lib/__internal__/fieldset/fieldset.component.js +1 -1
  136. package/lib/__internal__/fieldset-validation-context/fieldset-validation-context.d.ts +6 -0
  137. package/lib/__internal__/fieldset-validation-context/index.d.ts +1 -0
  138. package/lib/__internal__/fieldset-validation-context/index.js +1 -0
  139. package/lib/__internal__/fieldset-validation-context/package.json +6 -0
  140. package/lib/__internal__/form-field/form-field.component.d.ts +1 -1
  141. package/lib/__internal__/form-field/form-field.component.js +1 -1
  142. package/lib/__internal__/hint-text/hint-text.component.d.ts +6 -21
  143. package/lib/__internal__/hint-text/hint-text.component.js +1 -1
  144. package/lib/__internal__/hint-text/hint-text.style.d.ts +5 -2
  145. package/lib/__internal__/hint-text/hint-text.style.js +1 -1
  146. package/lib/__internal__/hint-text/index.d.ts +0 -1
  147. package/lib/__internal__/input/index.d.ts +2 -5
  148. package/lib/__internal__/input/index.js +1 -1
  149. package/lib/__internal__/input/input-style-overrides.style.d.ts +8 -0
  150. package/lib/__internal__/input/input-style-overrides.style.js +1 -0
  151. package/lib/__internal__/input/input.component.d.ts +22 -31
  152. package/lib/__internal__/input/input.component.js +1 -1
  153. package/lib/__internal__/input/input.style.d.ts +9 -5
  154. package/lib/__internal__/input/input.style.js +1 -1
  155. package/lib/__internal__/input-icon-toggle/input-icon-toggle.component.d.ts +9 -3
  156. package/lib/__internal__/input-icon-toggle/input-icon-toggle.component.js +1 -1
  157. package/lib/__internal__/input-icon-toggle/input-icon-toggle.style.d.ts +7 -9
  158. package/lib/__internal__/input-icon-toggle/input-icon-toggle.style.js +1 -1
  159. package/lib/__internal__/label/index.d.ts +0 -1
  160. package/lib/__internal__/label/label.component.d.ts +14 -31
  161. package/lib/__internal__/label/label.component.js +1 -1
  162. package/lib/__internal__/label/label.style.d.ts +5 -22
  163. package/lib/__internal__/label/label.style.js +1 -1
  164. package/lib/__internal__/legacy-error-border/error-border.style.js +1 -0
  165. package/lib/__internal__/legacy-hint-text/hint-text.component.d.ts +27 -0
  166. package/lib/__internal__/legacy-hint-text/hint-text.component.js +1 -0
  167. package/lib/__internal__/legacy-hint-text/hint-text.style.d.ts +3 -0
  168. package/lib/__internal__/legacy-hint-text/hint-text.style.js +1 -0
  169. package/lib/__internal__/legacy-hint-text/index.d.ts +2 -0
  170. package/lib/__internal__/legacy-hint-text/index.js +1 -0
  171. package/lib/__internal__/legacy-hint-text/package.json +6 -0
  172. package/lib/__internal__/legacy-input/index.d.ts +5 -0
  173. package/lib/__internal__/legacy-input/index.js +1 -0
  174. package/{esm/__internal__/input → lib/__internal__/legacy-input}/input-presentation.style.d.ts +1 -1
  175. package/lib/__internal__/{input → legacy-input}/input-presentation.style.js +1 -1
  176. package/lib/__internal__/legacy-input/input.component.d.ts +54 -0
  177. package/lib/__internal__/legacy-input/input.component.js +1 -0
  178. package/lib/__internal__/legacy-input/input.style.d.ts +3 -0
  179. package/lib/__internal__/legacy-input/input.style.js +1 -0
  180. package/lib/__internal__/legacy-input/package.json +6 -0
  181. package/lib/__internal__/legacy-label/index.d.ts +2 -0
  182. package/lib/__internal__/legacy-label/index.js +1 -0
  183. package/lib/__internal__/legacy-label/label.component.d.ts +37 -0
  184. package/lib/__internal__/legacy-label/label.component.js +1 -0
  185. package/lib/__internal__/legacy-label/label.style.d.ts +25 -0
  186. package/lib/__internal__/legacy-label/label.style.js +1 -0
  187. package/lib/__internal__/legacy-label/package.json +6 -0
  188. package/lib/__internal__/utils/helpers/combine-refs/index.d.ts +3 -0
  189. package/lib/__internal__/utils/helpers/combine-refs/index.js +1 -0
  190. package/lib/__internal__/utils/helpers/combine-refs/package.json +6 -0
  191. package/lib/__internal__/validation-message/__next__/index.d.ts +1 -0
  192. package/lib/__internal__/validation-message/__next__/index.js +1 -0
  193. package/lib/__internal__/validation-message/__next__/package.json +6 -0
  194. package/lib/__internal__/validation-message/__next__/validation-message.component.d.ts +20 -0
  195. package/lib/__internal__/validation-message/__next__/validation-message.component.js +1 -0
  196. package/lib/__internal__/validation-message/__next__/validation-message.style.d.ts +6 -0
  197. package/lib/__internal__/validation-message/__next__/validation-message.style.js +1 -0
  198. package/lib/components/button-toggle/button-toggle-group/button-toggle-group.component.js +1 -1
  199. package/lib/components/checkbox/checkbox-group/checkbox-group.style.js +1 -1
  200. package/lib/components/checkbox/checkbox.style.js +1 -1
  201. package/lib/components/date/date.component.js +1 -1
  202. package/lib/components/date/date.style.js +1 -1
  203. package/lib/components/date-range/date-range.style.js +1 -1
  204. package/lib/components/file-input/file-input.component.d.ts +1 -1
  205. package/lib/components/file-input/file-input.component.js +1 -1
  206. package/lib/components/file-input/file-input.style.d.ts +1 -1
  207. package/lib/components/file-input/file-input.style.js +1 -1
  208. package/lib/components/icon/icon.style.js +1 -1
  209. package/lib/components/inline-inputs/inline-inputs.component.d.ts +5 -1
  210. package/lib/components/inline-inputs/inline-inputs.component.js +1 -1
  211. package/lib/components/inline-inputs/inline-inputs.style.js +1 -1
  212. package/lib/components/menu/menu-full-screen/menu-full-screen.style.js +1 -1
  213. package/lib/components/number/number.component.js +1 -1
  214. package/lib/components/numeral-date/numeral-date.component.d.ts +6 -3
  215. package/lib/components/numeral-date/numeral-date.component.js +1 -1
  216. package/lib/components/numeral-date/numeral-date.style.d.ts +2 -14
  217. package/lib/components/numeral-date/numeral-date.style.js +1 -1
  218. package/lib/components/pager/__internal__/pager-navigation.component.js +1 -1
  219. package/lib/components/pager/pager.component.js +1 -1
  220. package/lib/components/pager/pager.style.js +1 -1
  221. package/lib/components/search/search-button.style.js +1 -1
  222. package/lib/components/search/search.component.js +1 -1
  223. package/lib/components/search/search.style.js +1 -1
  224. package/lib/components/select/__internal__/select-textbox/select-textbox.component.d.ts +12 -3
  225. package/lib/components/select/__internal__/select-textbox/select-textbox.component.js +1 -1
  226. package/lib/components/select/__internal__/select-textbox/select-textbox.style.d.ts +10 -3
  227. package/lib/components/select/__internal__/select-textbox/select-textbox.style.js +1 -1
  228. package/lib/components/select/filterable-select/filterable-select.component.js +1 -1
  229. package/lib/components/select/multi-select/multi-select.component.js +1 -1
  230. package/lib/components/select/multi-select/multi-select.style.js +1 -1
  231. package/lib/components/select/select.style.js +1 -1
  232. package/lib/components/select/simple-select/simple-select.component.js +1 -1
  233. package/lib/components/simple-color-picker/simple-color/simple-color.style.d.ts +1 -1
  234. package/lib/components/simple-color-picker/simple-color/simple-color.style.js +1 -1
  235. package/lib/components/switch/switch.component.js +1 -1
  236. package/lib/components/text-editor/__internal__/__ui__/ContentEditor/content-editor.component.js +1 -1
  237. package/lib/components/text-editor/text-editor.component.js +1 -1
  238. package/lib/components/textarea/textarea.component.d.ts +4 -2
  239. package/lib/components/textarea/textarea.component.js +1 -1
  240. package/lib/components/textarea/textarea.style.js +1 -1
  241. package/lib/components/textbox/__internal__/__next__/index.d.ts +2 -0
  242. package/lib/components/textbox/__internal__/__next__/index.js +1 -0
  243. package/lib/components/textbox/__internal__/__next__/package.json +6 -0
  244. package/lib/components/textbox/__internal__/__next__/text-input.component.d.ts +91 -0
  245. package/lib/components/textbox/__internal__/__next__/text-input.component.js +1 -0
  246. package/lib/components/textbox/__internal__/__next__/text-input.style.d.ts +21 -0
  247. package/lib/components/textbox/__internal__/__next__/text-input.style.js +1 -0
  248. package/lib/components/textbox/__internal__/__next__/utils.d.ts +81 -0
  249. package/lib/components/textbox/__internal__/__next__/utils.js +1 -0
  250. package/lib/components/textbox/textbox.component.d.ts +21 -17
  251. package/lib/components/textbox/textbox.component.js +1 -1
  252. package/lib/components/tile-select/tile-select.style.d.ts +1 -1
  253. package/lib/components/tile-select/tile-select.style.js +1 -1
  254. package/lib/components/time/time.component.d.ts +1 -1
  255. package/lib/components/time/time.component.js +1 -1
  256. package/lib/components/time/time.style.d.ts +1 -1
  257. package/lib/components/time/time.style.js +1 -1
  258. package/lib/hooks/__internal__/useRegisterValidationToTabs/index.d.ts +0 -0
  259. package/lib/hooks/__internal__/useRegisterValidationToTabs/index.js +1 -0
  260. package/lib/hooks/__internal__/useRegisterValidationToTabs/package.json +6 -0
  261. package/lib/hooks/__internal__/useRegisterValidationToTabs/useRegisterValidationToTabs.d.ts +2 -0
  262. package/lib/hooks/__internal__/useRegisterValidationToTabs/useRegisterValidationToTabs.js +1 -0
  263. package/lib/style/themes/apply-base-theme.d.ts +3 -1
  264. package/lib/style/themes/apply-base-theme.js +1 -1
  265. package/package.json +1 -1
  266. package/esm/components/numeral-date/__internal__/numeral-date.context.d.ts +0 -6
  267. package/esm/components/select/__internal__/select-textbox/select-textbox.context.d.ts +0 -5
  268. package/esm/components/select/__internal__/select-textbox/select-textbox.context.js +0 -1
  269. package/esm/components/textbox/__internal__/prefix.style.d.ts +0 -5
  270. package/esm/components/textbox/__internal__/prefix.style.js +0 -1
  271. package/esm/components/textbox/textbox.style.js +0 -1
  272. package/lib/components/numeral-date/__internal__/numeral-date.context.d.ts +0 -6
  273. package/lib/components/select/__internal__/select-textbox/select-textbox.context.d.ts +0 -5
  274. package/lib/components/select/__internal__/select-textbox/select-textbox.context.js +0 -1
  275. package/lib/components/textbox/__internal__/prefix.style.d.ts +0 -5
  276. package/lib/components/textbox/__internal__/prefix.style.js +0 -1
  277. package/lib/components/textbox/textbox.style.js +0 -1
  278. /package/esm/{components/numeral-date/__internal__/numeral-date.context.js → __internal__/fieldset-validation-context/fieldset-validation-context.js} +0 -0
  279. /package/esm/{components/textbox/textbox.style.d.ts → __internal__/legacy-error-border/error-border.style.d.ts} +0 -0
  280. /package/esm/__internal__/{input → legacy-input}/input-presentation.component.d.ts +0 -0
  281. /package/esm/__internal__/{input → legacy-input}/input-presentation.component.js +0 -0
  282. /package/esm/__internal__/{input → legacy-input}/input-sizes.style.d.ts +0 -0
  283. /package/esm/__internal__/{input → legacy-input}/input-sizes.style.js +0 -0
  284. /package/esm/__internal__/{label → legacy-label}/icon-wrapper.style.d.ts +0 -0
  285. /package/esm/__internal__/{label → legacy-label}/icon-wrapper.style.js +0 -0
  286. /package/lib/{components/numeral-date/__internal__/numeral-date.context.js → __internal__/fieldset-validation-context/fieldset-validation-context.js} +0 -0
  287. /package/lib/{components/textbox/textbox.style.d.ts → __internal__/legacy-error-border/error-border.style.d.ts} +0 -0
  288. /package/lib/__internal__/{input → legacy-input}/input-presentation.component.d.ts +0 -0
  289. /package/lib/__internal__/{input → legacy-input}/input-presentation.component.js +0 -0
  290. /package/lib/__internal__/{input → legacy-input}/input-sizes.style.d.ts +0 -0
  291. /package/lib/__internal__/{input → legacy-input}/input-sizes.style.js +0 -0
  292. /package/lib/__internal__/{label → legacy-label}/icon-wrapper.style.d.ts +0 -0
  293. /package/lib/__internal__/{label → legacy-label}/icon-wrapper.style.js +0 -0
@@ -1,37 +1,20 @@
1
1
  import React from "react";
2
- import { StyledLabelProps, StyledLabelContainerProps } from "./label.style";
3
- import { ValidationProps } from "../validations";
4
- import { IconType } from "../../components/icon";
5
- export interface LabelProps extends ValidationProps, StyledLabelProps, StyledLabelContainerProps {
6
- as?: "span" | "label";
2
+ export interface LabelProps {
7
3
  /** Children elements */
8
4
  children?: React.ReactNode;
9
- /** A message that the Help component will display */
10
- help?: React.ReactNode;
11
- /** Icon type */
12
- helpIcon?: IconType;
13
- /** A string that represents the ID of another form element */
5
+ /** HTML for attribute to associate label with input */
14
6
  htmlFor?: string;
15
- /** The unique id of the label element */
16
- labelId?: string;
17
- /** The unique id of the Help component tooltip, used for accessibility */
18
- tooltipId?: string;
19
- /** Whether to show the validation icon */
20
- useValidationIcon?: boolean;
21
- /** Id of the validation icon */
22
- validationIconId?: string;
23
- /**
24
- * @private
25
- * @internal
26
- * Sets className for component. INTERNAL USE ONLY. */
27
- className?: string;
28
- /** Sets aria-label for label element */
29
- "aria-label"?: string;
30
- /** Whether this component is shown against a dark background */
31
- isDarkBackground?: boolean;
32
- /** @internal @private */
33
- onClick?: () => void;
7
+ /** Sets the id for the component */
8
+ id?: string;
9
+ /** If true, uses large font size */
10
+ size: "small" | "medium" | "large";
11
+ /** If true, displays a required indicator (*) */
12
+ isRequired?: boolean;
13
+ /** If true, the label will display in disabled styling */
14
+ disabled?: boolean;
15
+ /** If true, the label will display in read-only styling */
16
+ readOnly?: boolean;
34
17
  }
35
- export declare const Label: ({ align, as, children, disabled, error, help, helpIcon, htmlFor, info, inline, isDarkBackground, isRequired, labelId, pr, pl, tooltipId, useValidationIcon, validationIconId, warning, width, className, onClick, "aria-label": ariaLabel, isLarge, }: LabelProps) => React.JSX.Element;
36
- declare const _default: React.MemoExoticComponent<({ align, as, children, disabled, error, help, helpIcon, htmlFor, info, inline, isDarkBackground, isRequired, labelId, pr, pl, tooltipId, useValidationIcon, validationIconId, warning, width, className, onClick, "aria-label": ariaLabel, isLarge, }: LabelProps) => React.JSX.Element>;
18
+ export declare const Label: ({ children, id, htmlFor, size, isRequired, disabled, readOnly, }: LabelProps) => React.JSX.Element;
19
+ declare const _default: React.MemoExoticComponent<({ children, id, htmlFor, size, isRequired, disabled, readOnly, }: LabelProps) => React.JSX.Element>;
37
20
  export default _default;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../components/help/help.component.js"),n=require("./label.style.js"),o=require("../validations/validation-icon.component.js"),i=require("./icon-wrapper.style.js"),l=require("../input-behaviour/input-behaviour.component.js"),a=require("../input-behaviour/input-group-behaviour.component.js"),u=require("../utils/helpers/guid/index.js");function s(e){return e&&e.__esModule?e:{default:e}}function c(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function p(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){c(e,r,t[r])}))}return e}function d(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const b=({align:s,as:c="label",children:b,disabled:f,error:j,help:g,helpIcon:h,htmlFor:y,info:O,inline:m,isDarkBackground:v=!1,isRequired:w,labelId:x,pr:P,pl:q,tooltipId:I,useValidationIcon:k=!0,validationIconId:M,warning:C,width:L=30,className:D,onClick:S,"aria-label":E,isLarge:F})=>{const[_,B]=r.useState(!1),{onMouseEnter:R,onMouseLeave:N}=r.useContext(l.InputContext),{onMouseEnter:V,onMouseLeave:G}=r.useContext(a.InputGroupContext),H=r.useRef(u.default());let $;return $=m&&!s?"right":s||"left",e.jsxs(n.StyledLabelContainer,{"data-role":"label-container",id:`label-container-${null!=x?x:H.current}`,align:$,inline:m,width:L,pr:P,pl:q,className:D,onClick:S,children:[e.jsx(n.default,d(p({"data-element":"label",disabled:f,id:x},"label"===c?{htmlFor:y}:{}),{onMouseEnter:()=>{R&&R(),V&&V()},onMouseLeave:()=>{N&&N(),G&&G()},isRequired:w,as:c,"aria-label":E,isDarkBackground:v,isLarge:F,children:b})),(()=>{const r={onFocus:()=>B(!0),onBlur:()=>B(!1)};if(k&&(({error:e,warning:r,info:t,disabled:n})=>!n&&"string"==typeof(e||r||t))({error:j,warning:C,info:O,disabled:f})){const r=(({error:e,warning:r,info:t,inline:n})=>(e||r||t)&&n?"top":"right")({error:j,warning:C,info:O,inline:m});return e.jsx(i.default,{children:e.jsx(o.ValidationIcon,{tooltipId:M,error:j,warning:C,info:O,tooltipPosition:r,tooltipFlipOverrides:["top","bottom"]})})}return g&&e.jsx(i.default,d(p({},r),{children:e.jsx(t.Help,{tooltipId:I,type:h,isFocused:_,children:g})}))})()]})};var f=s(r).default.memo(b);exports.Label=b,exports.default=f;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),l=require("./label.style.js");function t(e){return e&&e.__esModule?e:{default:e}}const a=({children:r,id:t,htmlFor:a,size:d,isRequired:i,disabled:s,readOnly:u})=>e.jsx(l.default,{id:t,htmlFor:a,$size:d,$isRequired:i,$disabled:s,$readOnly:u,"data-component":"label","data-element":"label",children:r});var d=t(r).default.memo(a);exports.Label=a,exports.default=d;
@@ -1,25 +1,8 @@
1
- export interface StyledLabelProps {
2
- /** If true, the component will be disabled */
3
- disabled?: boolean;
4
- /** Flag to configure component as mandatory */
5
- isRequired?: boolean;
6
- /** Flag to determine whether to use colours for dark backgrounds */
7
- isDarkBackground?: boolean;
8
- /** Set large font-size */
9
- isLarge?: boolean;
1
+ interface StyledLabelProps {
2
+ $size: "small" | "medium" | "large";
3
+ $isRequired?: boolean;
4
+ $disabled?: boolean;
5
+ $readOnly?: boolean;
10
6
  }
11
7
  declare const StyledLabel: import("styled-components").StyledComponent<"label", any, StyledLabelProps, never>;
12
- export interface StyledLabelContainerProps {
13
- /** Label alignment */
14
- align?: "left" | "right";
15
- /** When true, label is placed in line an input */
16
- inline?: boolean;
17
- /** Padding right, integer multiplied by base spacing constant (8) */
18
- pr?: 1 | 2;
19
- /** Padding left, integer multiplied by base spacing constant (8) */
20
- pl?: 1 | 2;
21
- /** Label width */
22
- width?: number;
23
- }
24
- export declare const StyledLabelContainer: import("styled-components").StyledComponent<"div", any, StyledLabelContainerProps, never>;
25
8
  export default StyledLabel;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components");function t(e){return e&&e.__esModule?e:{default:e}}var i=t(e);const s=i.default.label.withConfig({displayName:"label.style__StyledLabel",componentId:"sc-16363be4-0"})([""," display:block;font-weight:var(--fontWeights500);&:hover{cursor:pointer;}"," "," ",""],(({isDarkBackground:t})=>e.css(["color:",";"],t?"var(--colorsUtilityYang100)":"var(--colorsUtilityYin090)")),(({isLarge:t})=>t&&e.css(["font-size:var(--fontSizes200);"])),(({isRequired:t})=>t&&e.css(['::after{content:"*";color:var(--colorsSemanticNegative500);font-weight:var(--fontWeights500);margin-left:var(--spacing050);}'])),(({disabled:t})=>t&&e.css(["color:var(--colorsUtilityYin030);&:hover{cursor:not-allowed;}"]))),o=i.default.div.withConfig({displayName:"label.style__StyledLabelContainer",componentId:"sc-16363be4-1"})(["display:flex;align-items:center;margin-bottom:8px;"," ",""],(({align:t})=>e.css(["justify-content:",";"],"right"!==t?"flex-start":"flex-end")),(({inline:t,pr:i,pl:s,width:o})=>t&&e.css(["box-sizing:border-box;margin-bottom:0;",";",";width:","%;"],i&&e.css(["padding-right:var(",");"],1===i?"--spacing100":"--spacing200"),s&&e.css(["padding-left:var(",");"],1===s?"--spacing100":"--spacing200"),o)));exports.StyledLabelContainer=o,exports.default=s;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components");function l(e){return e&&e.__esModule?e:{default:e}}const t=e=>{switch(e){case"small":return"var(--global-font-static-comp-medium-s)";case"large":return"var(--global-font-static-comp-medium-l)";default:return"var(--global-font-static-comp-medium-m)"}},a=l(e).default.label.withConfig({displayName:"label.style__StyledLabel",componentId:"sc-bf6c67e5-0"})(["",";font:",";"," .numeral-date-wrapper &,.time &{font:var(--global-font-static-comp-regular-m);}"],(({$disabled:e,$readOnly:l})=>e?"\n cursor: not-allowed;\n color: var(--input-labelset-label-disabled);\n ":l?"\n cursor: pointer;\n color: var(--input-labelset-label-readOnly);\n ":"\n cursor: pointer;\n color: var(--input-labelset-label-default);\n "),(({$size:e})=>t(e)),(({$isRequired:l,$size:a,$disabled:r})=>l&&e.css(['display:inline-flex;align-items:center;::after{content:"*";color:',";font:",";margin-left:4px;}"],r?"var(--input-labelset-label-disabled)":"var(--input-labelset-label-required)",t(a))));exports.default=a;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components");function o(e){return e&&e.__esModule?e:{default:e}}const t=o(e).default.span.withConfig({displayName:"error-border.style__ErrorBorder",componentId:"sc-16eee200-0"})(["",""],(({warning:o})=>e.css(["position:absolute;z-index:6;width:2px;background-color:",";left:-12px;bottom:0px;top:0px;"],o?"var(--colorsSemanticCaution500)":"var(--colorsSemanticNegative500)")));exports.default=t;
@@ -0,0 +1,27 @@
1
+ import React from "react";
2
+ export interface HintTextProps {
3
+ /** The alignment of the hint text */
4
+ align?: "left" | "right";
5
+ /** Children elements */
6
+ children?: React.ReactNode;
7
+ /** Sets the font weight for the hint text */
8
+ fontWeight?: string;
9
+ /** Sets the id for the component. */
10
+ id?: string;
11
+ /** Indicates whether the parent component is inline. */
12
+ isComponentInline?: boolean;
13
+ /** Indicates whether the parent component has a dark background. */
14
+ isDarkBackground?: boolean;
15
+ /** Indicates whether the parent component is disabled. */
16
+ isDisabled?: boolean;
17
+ /** Margin bottom for the hint text */
18
+ marginBottom?: string;
19
+ /** Margin top for the hint text */
20
+ marginTop?: string;
21
+ /** Max width for the hint text */
22
+ maxWidth?: string;
23
+ /** Set large font-size */
24
+ isLarge?: boolean;
25
+ }
26
+ export declare const HintText: ({ align, children, fontWeight, id, isComponentInline, isDarkBackground, isDisabled, marginBottom, marginTop, maxWidth, isLarge, }: HintTextProps) => React.JSX.Element | null;
27
+ export default HintText;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("./hint-text.style.js"),n=require("../../components/carbon-provider/__internal__/new-validation.context.js");const r=({align:r,children:a,fontWeight:o,id:s,isComponentInline:d=!1,isDarkBackground:l=!1,isDisabled:u=!1,marginBottom:c="var(--spacing100)",marginTop:g="var(--spacing000)",maxWidth:p,isLarge:m})=>{const{validationRedesignOptIn:x}=t.useContext(n.default);return d&&!x?null:e.jsx(i.default,{align:r,"data-element":"input-hint","data-role":"hint-text",fontWeight:o,id:s,isDarkBackground:l,isDisabled:u,marginBottom:c,marginTop:g,maxWidth:p,isLarge:m,children:a})};exports.HintText=r,exports.default=r;
@@ -0,0 +1,3 @@
1
+ import { HintTextProps } from "./hint-text.component";
2
+ declare const StyledHintText: import("styled-components").StyledComponent<"div", any, HintTextProps, never>;
3
+ export default StyledHintText;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components");function e(t){return t&&t.__esModule?t:{default:t}}const i=e(t).default.div.withConfig({displayName:"hint-text.style__StyledHintText",componentId:"sc-92b90b9-0"})(["display:flex;align-items:center;font-size:14px;"," "," margin-bottom:",";margin-top:",";"," "," ",' ::after{content:" ";}'],(({isLarge:e})=>e&&t.css(["font-size:var(--fontSizes200);"])),(({align:e})=>t.css(["justify-content:",";"],"right"!==e?"flex-start":"flex-end")),(({marginBottom:t})=>t),(({marginTop:t})=>t),(({isDarkBackground:e,isDisabled:i})=>t.css(["color:",";"],((t,e)=>t?"var(--colorsUtilityYang080)":e?"var(--colorsUtilityYin030)":"var(--colorsUtilityYin055)")(e,i))),(({fontWeight:e})=>e&&t.css(["font-weight:",";"],e)),(({maxWidth:e})=>e&&t.css(["max-width:",";"],e)));exports.default=i;
@@ -0,0 +1,2 @@
1
+ export { default } from "./hint-text.component";
2
+ export type { HintTextProps } from "./hint-text.component";
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./hint-text.component.js");exports.default=e.HintText;
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/__internal__/legacy-hint-text/index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -0,0 +1,5 @@
1
+ import Input from "./input.component";
2
+ import InputPresentation from "./input-presentation.component";
3
+ export type { InputProps, CommonInputProps, EnterKeyHintTypes, } from "./input.component";
4
+ export { Input, InputPresentation };
5
+ export default Input;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./input.component.js"),t=require("./input-presentation.component.js");exports.Input=e.default,exports.default=e.default,exports.InputPresentation=t.default;
@@ -2,5 +2,5 @@ import { CommonInputPresentationProps } from "./input-presentation.component";
2
2
  import { InputContextProps } from "../input-behaviour";
3
3
  import { CarbonProviderProps } from "../../components/carbon-provider";
4
4
  export declare const StyledInputPresentationContainer: import("styled-components").StyledComponent<"div", any, Pick<CommonInputPresentationProps, "maxWidth" | "inputWidth">, never>;
5
- declare const InputPresentationStyle: import("styled-components").StyledComponent<"div", any, Pick<InputContextProps, "hasFocus"> & Pick<CommonInputPresentationProps, "disabled" | "error" | "info" | "warning" | "prefix" | "readOnly" | "size" | "align" | "borderRadius" | "hasIcon" | "hideBorders"> & Pick<CarbonProviderProps, "validationRedesignOptIn">, never>;
5
+ declare const InputPresentationStyle: import("styled-components").StyledComponent<"div", any, Pick<InputContextProps, "hasFocus"> & Pick<CommonInputPresentationProps, "disabled" | "error" | "info" | "warning" | "readOnly" | "size" | "align" | "borderRadius" | "hasIcon" | "hideBorders"> & Pick<CarbonProviderProps, "validationRedesignOptIn">, never>;
6
6
  export default InputPresentationStyle;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("./input-sizes.style.js"),t=require("./input.style.js"),i=require("../../style/utils/add-focus-styling.js");function o(e){return e&&e.__esModule?e:{default:e}}var n=o(e);const a=n.default.div.withConfig({displayName:"input-presentation.style__StyledInputPresentationContainer",componentId:"sc-5369fb17-0"})(["flex:0 0 ","%;display:flex;position:relative;max-width:",";"],(({inputWidth:e})=>e),(({maxWidth:e})=>e?`${e}`:"100%")),s=n.default.div.withConfig({displayName:"input-presentation.style__InputPresentationStyle",componentId:"sc-5369fb17-1"})(["align-items:stretch;background:var(--colorsUtilityYang100);"," box-sizing:border-box;cursor:text;display:flex;flex-wrap:wrap;width:100%;margin:0;"," "," "," "," "," "," "," input::-ms-clear{display:none;}input::-webkit-contacts-auto-fill-button{display:none !important;}"],(({hideBorders:e})=>e?"border: 1px solid transparent;":"border: 1px solid var(--colorsUtilityMajor300);"),(({borderRadius:e})=>Array.isArray(e)?`border-radius: ${e.map((e=>`var(--${e})`)).join(" ")};`:`border-radius: var(--${e});`),(({size:i,hasIcon:o,align:n})=>i&&e.css(["min-height:",";","{padding:0 ",";"," ","}"],r.default[i].height,t.default,r.default[i].horizontalPadding,o&&"right"===n&&"padding-left: 0;",o&&"left"===n&&"padding-right: 0;")),(({disabled:r,hideBorders:t})=>r&&e.css(["background:var(--colorsUtilityDisabled400);border-color:",";cursor:not-allowed;"],t?"transparent":"var(--colorsUtilityDisabled600)")),(({hasFocus:r})=>r&&e.css(["&{"," z-index:2;}"],i.default())),(function({error:r,warning:t,info:i,disabled:o,validationRedesignOptIn:n}){let a;if(o)return"";if(r)a="var(--colorsSemanticNegative500)";else if(t)a=n?"var(--colorsUtilityMajor300)":"var(--colorsSemanticCaution500)";else{if(!i)return"";a="var(--colorsSemanticInfo500)"}return e.css(["border-color:"," !important;z-index:1;",""],a,r&&`box-shadow: inset 1px 1px 0 ${a}, inset -1px -1px 0 ${a};`)}),(({readOnly:r,hideBorders:t})=>r&&e.css(["background-color:var(--colorsUtilityReadOnly400);border-color:",";"],t?"transparent":"var(--colorsUtilityReadOnly600)")),(({align:e,prefix:r})=>"right"===e&&`flex-direction: ${r?"row":"row-reverse"};\n `));exports.StyledInputPresentationContainer=a,exports.default=s;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("./input-sizes.style.js"),t=require("./input.style.js"),i=require("../../style/utils/add-focus-styling.js");function o(e){return e&&e.__esModule?e:{default:e}}var n=o(e);const a=n.default.div.withConfig({displayName:"input-presentation.style__StyledInputPresentationContainer",componentId:"sc-83661d80-0"})(["flex:0 0 ","%;display:flex;position:relative;max-width:",";"],(({inputWidth:e})=>e),(({maxWidth:e})=>e?`${e}`:"100%")),s=n.default.div.withConfig({displayName:"input-presentation.style__InputPresentationStyle",componentId:"sc-83661d80-1"})(["align-items:stretch;background:var(--colorsUtilityYang100);"," box-sizing:border-box;cursor:text;display:flex;flex-wrap:wrap;width:100%;margin:0;"," "," "," "," "," "," "," input::-ms-clear{display:none;}input::-webkit-contacts-auto-fill-button{display:none !important;}"],(({hideBorders:e})=>e?"border: 1px solid transparent;":"border: 1px solid var(--colorsUtilityMajor300);"),(({borderRadius:e})=>Array.isArray(e)?`border-radius: ${e.map((e=>`var(--${e})`)).join(" ")};`:`border-radius: var(--${e});`),(({size:i,hasIcon:o,align:n})=>i&&e.css(["min-height:",";","{padding:0 ",";"," ","}"],r.default[i].height,t.default,r.default[i].horizontalPadding,o&&"right"===n&&"padding-left: 0;",o&&"left"===n&&"padding-right: 0;")),(({disabled:r,hideBorders:t})=>r&&e.css(["background:var(--colorsUtilityDisabled400);border-color:",";cursor:not-allowed;"],t?"transparent":"var(--colorsUtilityDisabled600)")),(({hasFocus:r})=>r&&e.css(["&{"," z-index:2;}"],i.default())),(function({error:r,warning:t,info:i,disabled:o,validationRedesignOptIn:n}){let a;if(o)return"";if(r)a="var(--colorsSemanticNegative500)";else if(t)a=n?"var(--colorsUtilityMajor300)":"var(--colorsSemanticCaution500)";else{if(!i)return"";a="var(--colorsSemanticInfo500)"}return e.css(["border-color:"," !important;z-index:1;",""],a,r&&`box-shadow: inset 1px 1px 0 ${a}, inset -1px -1px 0 ${a};`)}),(({readOnly:r})=>r&&e.css(["background-color:var(--colorsUtilityReadOnly400);border-color:transparent;"])),(({align:e})=>"right"===e&&"flex-direction: row-reverse;\n "));exports.StyledInputPresentationContainer=a,exports.default=s;
@@ -0,0 +1,54 @@
1
+ import React from "react";
2
+ import { BorderRadiusType } from "../../components/box/box.component";
3
+ export type EnterKeyHintTypes = "enter" | "done" | "go" | "next" | "previous" | "search" | "send";
4
+ export interface CommonInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "value"> {
5
+ align?: "right" | "left";
6
+ /** The ID of the input's description, is set along with hint text and error message. */
7
+ "aria-describedby"?: string;
8
+ /** Override the variant component */
9
+ as?: React.ElementType;
10
+ /** If true the Component will be focused when rendered */
11
+ autoFocus?: boolean;
12
+ /** If true, the component will be disabled */
13
+ disabled?: boolean;
14
+ /** HTML id attribute of the input */
15
+ id?: string;
16
+ /** Specify a custom border radius for the input. Any valid border-radius design token, or an array of border-radius design tokens. */
17
+ inputBorderRadius?: BorderRadiusType | BorderRadiusType[];
18
+ /** Name of the input */
19
+ name?: string;
20
+ /** Specify a callback triggered on blur */
21
+ onBlur?: (ev: React.FocusEvent<HTMLInputElement>) => void;
22
+ /** Specify a callback triggered on change */
23
+ onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
24
+ /** Specify a callback triggered on click */
25
+ onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
26
+ /** Specify a callback triggered on focus */
27
+ onFocus?: (ev: React.FocusEvent<HTMLInputElement>) => void;
28
+ /** Specify a callback triggered on keyDown */
29
+ onKeyDown?: (ev: React.KeyboardEvent<HTMLInputElement>) => void;
30
+ /** Placeholder string to be displayed in input */
31
+ placeholder?: string;
32
+ /** If true, the component will be read-only */
33
+ readOnly?: boolean;
34
+ /** Flag to configure component as mandatory */
35
+ required?: boolean;
36
+ /** Id of the validation icon */
37
+ validationIconId?: string;
38
+ /** The value of the input */
39
+ value: string | readonly string[] | number | undefined;
40
+ }
41
+ export interface InputProps extends CommonInputProps {
42
+ /** The visible width of the text control, in average character widths */
43
+ cols?: number;
44
+ /** Integer to determine a timeout for the deferred callback */
45
+ deferTimeout?: number;
46
+ /** Deferred callback to be called after the onChange event */
47
+ onChangeDeferred?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
48
+ /** The number of visible text lines for the control */
49
+ rows?: number;
50
+ /** HTML type attribute of the input */
51
+ type?: string;
52
+ }
53
+ declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
54
+ export default Input;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("./input.style.js"),n=require("../input-behaviour/input-behaviour.component.js"),o=require("../input-behaviour/input-group-behaviour.component.js");function u(e){return e&&e.__esModule?e:{default:e}}function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const a=u(t).default.forwardRef(((u,a)=>{var{align:l,"aria-labelledby":c,"aria-describedby":s,placeholder:d,disabled:f,readOnly:p,autoFocus:b,onClick:y,onChangeDeferred:O,onChange:v,onBlur:h,onFocus:g,deferTimeout:j,type:m="text",id:P,name:B,validationIconId:C,inputBorderRadius:w="borderRadius050",enterKeyHint:x}=u,F=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},u=Object.keys(e);for(n=0;n<u.length;n++)r=u[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var u=Object.getOwnPropertySymbols(e);for(n=0;n<u.length;n++)r=u[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(u,["align","aria-labelledby","aria-describedby","placeholder","disabled","readOnly","autoFocus","onClick","onChangeDeferred","onChange","onBlur","onFocus","deferTimeout","type","id","name","validationIconId","inputBorderRadius","enterKeyHint"]);const R=t.useContext(n.InputContext),k=t.useContext(o.InputGroupContext),I=t.useRef(null);let S=t.useRef(null);a&&"current"in a&&(S=a);const E=t.useCallback((e=>{S.current=e,"function"==typeof a&&a(e),b&&e&&e.focus(),x&&e&&e.setAttribute("enterkeyhint",x)}),[b,a,x]);t.useEffect((()=>{R.inputRef&&R.inputRef(S)}),[R,S]),t.useEffect((()=>{f&&R.onBlur&&R.onBlur()}),[f,R]);const D=s?[s]:[];(R.hasFocus||k.hasFocus||R.hasMouseOver||k.hasMouseOver)&&C&&D.push(C);const q=D.length?D.filter(Boolean).join(" "):void 0;return e.jsx(r.default,(T=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){i(e,t,r[t])}))}return e}({},F),M={"data-has-autofocus":!!b||void 0,"aria-describedby":q,"aria-labelledby":c,align:l,placeholder:d,disabled:f,readOnly:p,name:B,type:m,id:P||B,ref:E,"data-element":"input",onFocus:e=>{g&&g(e),R.onFocus&&R.onFocus(),k.onFocus&&k.onFocus(),"text"===m&&function(e){setTimeout((()=>{if(null==e?void 0:e.current){const{selectionStart:t,selectionEnd:r,value:n}=e.current,{length:o}=n;(0===t&&0===r||t===o&&r===o)&&document.activeElement===e.current&&e.current.setSelectionRange(0,o)}}))}(S)},onBlur:e=>{h&&h(e),R.onBlur&&R.onBlur(),k.onBlur&&k.onBlur()},onClick:f||p?void 0:e=>{var t;y&&y(e),null==S||null===(t=S.current)||void 0===t||t.focus()},onChange:e=>{v&&v(e),(e=>{O&&(I.current&&clearTimeout(I.current),I.current=setTimeout((()=>{O(e)}),j||750))})(e)},inputBorderRadius:w},M=null!=M?M:{},Object.getOwnPropertyDescriptors?Object.defineProperties(T,Object.getOwnPropertyDescriptors(M)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(M)).forEach((function(e){Object.defineProperty(T,e,Object.getOwnPropertyDescriptor(M,e))})),T));var T,M}));a.displayName="Input",exports.default=a;
@@ -0,0 +1,3 @@
1
+ import { CommonInputProps } from "./input.component";
2
+ declare const StyledInput: import("styled-components").StyledComponent<"input", any, Pick<CommonInputProps, "disabled" | "align" | "inputBorderRadius">, never>;
3
+ export default StyledInput;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("styled-components");function e(r){return r&&r.__esModule?r:{default:r}}const t=e(r).default.input.withConfig({displayName:"input.style__StyledInput",componentId:"sc-745cf632-0"})(["background:transparent;border:none;color:var(--colorsUtilityYin090);flex-grow:1;font-size:var(--fontSizes100);outline:none;padding:0;margin:0;width:30px;&:-webkit-autofill{background-clip:text;-webkit-background-clip:text;}"," &::placeholder{color:var(--colorsUtilityYin055);}"," ",""],(({inputBorderRadius:r})=>Array.isArray(r)?`border-radius: ${r.map((r=>`var(--${r})`)).join(" ")};`:`border-radius: var(--${r});`),(({align:e})=>e&&r.css(["text-align:",";"],e)),(({disabled:e})=>e&&r.css(["color:var(--colorsUtilityYin030);cursor:not-allowed;"])));exports.default=t;
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/__internal__/legacy-input/index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -0,0 +1,2 @@
1
+ export { default } from "./label.component";
2
+ export type { LabelProps } from "./label.component";
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./label.component.js");exports.default=e.default;
@@ -0,0 +1,37 @@
1
+ import React from "react";
2
+ import { StyledLabelProps, StyledLabelContainerProps } from "./label.style";
3
+ import { ValidationProps } from "../validations";
4
+ import { IconType } from "../../components/icon";
5
+ export interface LabelProps extends ValidationProps, StyledLabelProps, StyledLabelContainerProps {
6
+ as?: "span" | "label";
7
+ /** Children elements */
8
+ children?: React.ReactNode;
9
+ /** A message that the Help component will display */
10
+ help?: React.ReactNode;
11
+ /** Icon type */
12
+ helpIcon?: IconType;
13
+ /** A string that represents the ID of another form element */
14
+ htmlFor?: string;
15
+ /** The unique id of the label element */
16
+ labelId?: string;
17
+ /** The unique id of the Help component tooltip, used for accessibility */
18
+ tooltipId?: string;
19
+ /** Whether to show the validation icon */
20
+ useValidationIcon?: boolean;
21
+ /** Id of the validation icon */
22
+ validationIconId?: string;
23
+ /**
24
+ * @private
25
+ * @internal
26
+ * Sets className for component. INTERNAL USE ONLY. */
27
+ className?: string;
28
+ /** Sets aria-label for label element */
29
+ "aria-label"?: string;
30
+ /** Whether this component is shown against a dark background */
31
+ isDarkBackground?: boolean;
32
+ /** @internal @private */
33
+ onClick?: () => void;
34
+ }
35
+ export declare const Label: ({ align, as, children, disabled, error, help, helpIcon, htmlFor, info, inline, isDarkBackground, isRequired, labelId, pr, pl, tooltipId, useValidationIcon, validationIconId, warning, width, className, onClick, "aria-label": ariaLabel, isLarge, }: LabelProps) => React.JSX.Element;
36
+ declare const _default: React.MemoExoticComponent<({ align, as, children, disabled, error, help, helpIcon, htmlFor, info, inline, isDarkBackground, isRequired, labelId, pr, pl, tooltipId, useValidationIcon, validationIconId, warning, width, className, onClick, "aria-label": ariaLabel, isLarge, }: LabelProps) => React.JSX.Element>;
37
+ export default _default;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../components/help/help.component.js"),n=require("./label.style.js"),o=require("../validations/validation-icon.component.js"),i=require("./icon-wrapper.style.js"),l=require("../input-behaviour/input-behaviour.component.js"),a=require("../input-behaviour/input-group-behaviour.component.js"),u=require("../utils/helpers/guid/index.js");function s(e){return e&&e.__esModule?e:{default:e}}function c(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function p(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){c(e,r,t[r])}))}return e}function d(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const b=({align:s,as:c="label",children:b,disabled:f,error:j,help:g,helpIcon:h,htmlFor:y,info:O,inline:m,isDarkBackground:v=!1,isRequired:w,labelId:x,pr:P,pl:q,tooltipId:I,useValidationIcon:k=!0,validationIconId:M,warning:C,width:L=30,className:D,onClick:S,"aria-label":E,isLarge:F})=>{const[_,B]=r.useState(!1),{onMouseEnter:R,onMouseLeave:N}=r.useContext(l.InputContext),{onMouseEnter:V,onMouseLeave:G}=r.useContext(a.InputGroupContext),H=r.useRef(u.default());let $;return $=m&&!s?"right":s||"left",e.jsxs(n.StyledLabelContainer,{"data-role":"label-container",id:`label-container-${null!=x?x:H.current}`,align:$,inline:m,width:L,pr:P,pl:q,className:D,onClick:S,children:[e.jsx(n.default,d(p({"data-element":"label",disabled:f,id:x},"label"===c?{htmlFor:y}:{}),{onMouseEnter:()=>{R&&R(),V&&V()},onMouseLeave:()=>{N&&N(),G&&G()},isRequired:w,as:c,"aria-label":E,isDarkBackground:v,isLarge:F,children:b})),(()=>{const r={onFocus:()=>B(!0),onBlur:()=>B(!1)};if(k&&(({error:e,warning:r,info:t,disabled:n})=>!n&&"string"==typeof(e||r||t))({error:j,warning:C,info:O,disabled:f})){const r=(({error:e,warning:r,info:t,inline:n})=>(e||r||t)&&n?"top":"right")({error:j,warning:C,info:O,inline:m});return e.jsx(i.default,{children:e.jsx(o.ValidationIcon,{tooltipId:M,error:j,warning:C,info:O,tooltipPosition:r,tooltipFlipOverrides:["top","bottom"]})})}return g&&e.jsx(i.default,d(p({},r),{children:e.jsx(t.Help,{tooltipId:I,type:h,isFocused:_,children:g})}))})()]})};var f=s(r).default.memo(b);exports.Label=b,exports.default=f;
@@ -0,0 +1,25 @@
1
+ export interface StyledLabelProps {
2
+ /** If true, the component will be disabled */
3
+ disabled?: boolean;
4
+ /** Flag to configure component as mandatory */
5
+ isRequired?: boolean;
6
+ /** Flag to determine whether to use colours for dark backgrounds */
7
+ isDarkBackground?: boolean;
8
+ /** Set large font-size */
9
+ isLarge?: boolean;
10
+ }
11
+ declare const StyledLabel: import("styled-components").StyledComponent<"label", any, StyledLabelProps, never>;
12
+ export interface StyledLabelContainerProps {
13
+ /** Label alignment */
14
+ align?: "left" | "right";
15
+ /** When true, label is placed in line an input */
16
+ inline?: boolean;
17
+ /** Padding right, integer multiplied by base spacing constant (8) */
18
+ pr?: 1 | 2;
19
+ /** Padding left, integer multiplied by base spacing constant (8) */
20
+ pl?: 1 | 2;
21
+ /** Label width */
22
+ width?: number;
23
+ }
24
+ export declare const StyledLabelContainer: import("styled-components").StyledComponent<"div", any, StyledLabelContainerProps, never>;
25
+ export default StyledLabel;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components");function t(e){return e&&e.__esModule?e:{default:e}}var i=t(e);const s=i.default.label.withConfig({displayName:"label.style__StyledLabel",componentId:"sc-e75e7420-0"})([""," display:block;font-weight:var(--fontWeights500);"," "," ",""],(({isDarkBackground:t})=>e.css(["color:",";"],t?"var(--colorsUtilityYang100)":"var(--colorsUtilityYin090)")),(({isLarge:t})=>t&&e.css(["font-size:var(--fontSizes200);"])),(({isRequired:t})=>t&&e.css(['::after{content:"*";color:var(--colorsSemanticNegative500);font-weight:var(--fontWeights500);margin-left:var(--spacing050);}'])),(({disabled:t})=>t&&e.css(["color:var(--colorsUtilityYin030);"]))),a=i.default.div.withConfig({displayName:"label.style__StyledLabelContainer",componentId:"sc-e75e7420-1"})(["display:flex;align-items:center;margin-bottom:8px;"," ",""],(({align:t})=>e.css(["justify-content:",";"],"right"!==t?"flex-start":"flex-end")),(({inline:t,pr:i,pl:s,width:a})=>t&&e.css(["box-sizing:border-box;margin-bottom:0;",";",";width:","%;"],i&&e.css(["padding-right:var(",");"],1===i?"--spacing100":"--spacing200"),s&&e.css(["padding-left:var(",");"],1===s?"--spacing100":"--spacing200"),a)));exports.StyledLabelContainer=a,exports.default=s;
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/__internal__/legacy-label/index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -0,0 +1,3 @@
1
+ import { MutableRefObject, RefCallback } from "react";
2
+ declare const _default: <T = unknown>(...refs: (MutableRefObject<T | null> | RefCallback<T> | null | undefined)[]) => RefCallback<T>;
3
+ export default _default;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=(...e)=>t=>{e.forEach((e=>{e&&("function"!=typeof e?"current"in e&&(e.current=t):e(t))}))};
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/__internal__/utils/helpers/combine-refs/index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -0,0 +1 @@
1
+ export { default } from "./validation-message.component";
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./validation-message.component.js");exports.default=e.default;
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/__internal__/validation-message/__next__/index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -0,0 +1,20 @@
1
+ import React from "react";
2
+ import { TagProps } from "../../../__internal__/utils/helpers/tags";
3
+ export interface ValidationMessageProps extends TagProps {
4
+ /**
5
+ * If true, displays error styling. If passed as a valid string, displays error styling
6
+ * and the message as children.
7
+ */
8
+ error?: boolean | string;
9
+ /** Id of the component, to be used for accessibility purposes */
10
+ id?: string;
11
+ /**
12
+ * If true, displays warning styling. If passed as a valid string, displays warning styling
13
+ * and the message as children.
14
+ */
15
+ warning?: boolean | string;
16
+ /** Size of the validation message font */
17
+ size?: "small" | "medium" | "large";
18
+ }
19
+ declare const ValidationMessage: ({ error, id, warning, "data-element": dataElement, "data-role": dataRole, size, }: ValidationMessageProps) => React.JSX.Element | null;
20
+ export default ValidationMessage;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("react");var r=require("./validation-message.style.js"),t=require("../../utils/helpers/tags/tags.js");function n(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}exports.default=({error:o,id:a,warning:i,"data-element":s,"data-role":c="validation-message",size:l})=>{const u=o||i;return"string"==typeof u?e.jsx(r.default,(p=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),o.forEach((function(r){n(e,r,t[r])}))}return e}({id:a,$isError:Boolean(o)},t.default("validation-message",{"data-element":s,"data-role":c})),b=null!=(b={$size:l,children:u})?b:{},Object.getOwnPropertyDescriptors?Object.defineProperties(p,Object.getOwnPropertyDescriptors(b)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(b)).forEach((function(e){Object.defineProperty(p,e,Object.getOwnPropertyDescriptor(b,e))})),p)):null;var p,b};
@@ -0,0 +1,6 @@
1
+ interface StyledValidationMessageProps {
2
+ $isError?: boolean;
3
+ $size?: "small" | "medium" | "large";
4
+ }
5
+ declare const StyledValidationMessage: import("styled-components").StyledComponent<"span", any, StyledValidationMessageProps, never>;
6
+ export default StyledValidationMessage;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("styled-components");function t(a){return a&&a.__esModule?a:{default:a}}const e=t(a).default.span.withConfig({displayName:"validation-message.style__StyledValidationMessage",componentId:"sc-554aba6-0"})(["",""],(({$isError:t,$size:e})=>a.css(["display:flex;align-items:center;align-content:center;align-self:stretch;flex-wrap:wrap;margin:0px;color:",";"," "," ",""],t?"var(--input-validation-label-error)":"var(--input-validation-label-warn)","large"===e&&a.css(["font:",";"],t?"var(--global-font-static-comp-medium-l)":"var(--global-font-static-comp-regular-l)"),"medium"===e&&a.css(["font:",";"],t?"var(--global-font-static-comp-medium-m)":"var(--global-font-static-comp-regular-m)"),"small"===e&&a.css(["font:",";"],t?"var(--global-font-static-comp-medium-s)":"var(--global-font-static-comp-regular-s)"))));exports.default=e;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("invariant"),r=require("../../../__internal__/form-field/form-field.component.js"),n=require("../../../__internal__/utils/helpers/tags/tags.js"),i=require("../../../__internal__/utils/helpers/guid/index.js"),o=require("./button-toggle-group.style.js"),a=require("../button-toggle.component.js");require("../../../style/utils/filter-styled-system-padding-props.js");var u=require("../../../style/utils/filter-styled-system-margin-props.js"),s=require("../../../__internal__/tooltip-provider/index.js"),d=require("../../../__internal__/input-behaviour/input-group-behaviour.component.js"),c=require("../../../__internal__/utils/helpers/events/events.js"),p=require("../../carbon-provider/__internal__/new-validation.context.js"),f=require("./__internal__/button-toggle-group.context.js"),b=require("../../../__internal__/hint-text/hint-text.component.js");function g(e){return e&&e.__esModule?e:{default:e}}var y=g(t),h=g(l);function _(e,t,l){return t in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}function j(e){for(var t=1;t<arguments.length;t++){var l=null!=arguments[t]?arguments[t]:{},r=Object.keys(l);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(l).filter((function(e){return Object.getOwnPropertyDescriptor(l,e).enumerable})))),r.forEach((function(t){_(e,t,l[t])}))}return e}function v(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);t.push.apply(t,l)}return t}(Object(t)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(t,l))})),e}const m=l=>{var{children:g,fieldHelp:_,fieldHelpInline:m,"aria-label":O,label:x,labelHelp:q,labelSpacing:w,inputHint:P,inputWidth:H,fullWidth:I,labelInline:B,labelWidth:S,onChange:D,value:T,helpAriaLabel:W,id:A,allowDeselect:C=!1,disabled:E=!1}=l,R=function(e,t){if(null==e)return{};var l,r,n=function(e,t){if(null==e)return{};var l,r,n={},i=Object.keys(e);for(r=0;r<i.length;r++)l=i[r],t.indexOf(l)>=0||(n[l]=e[l]);return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)l=i[r],t.indexOf(l)>=0||Object.prototype.propertyIsEnumerable.call(e,l)&&(n[l]=e[l])}return n}(l,["children","fieldHelp","fieldHelpInline","aria-label","label","labelHelp","labelSpacing","inputHint","inputWidth","fullWidth","labelInline","labelWidth","onChange","value","helpAriaLabel","id","allowDeselect","disabled"]);const k=t.useMemo((()=>!y.default.Children.toArray(g).find((e=>!y.default.isValidElement(e)||"ButtonToggle"!==e.type.displayName))),[g]);h.default(k,`\`ButtonToggleGroup\` only accepts children of type \`${a.ButtonToggle.displayName}\``);const G=t.useRef(i.default()),L=t.useRef(i.default()),M=t.useRef(null),{validationRedesignOptIn:K}=t.useContext(p.default),N=e=>K?void 0:e,V=()=>{var e;return null===(e=M.current)||void 0===e?void 0:e.querySelectorAll('[data-element="button-toggle-button"]')},[$,z]=t.useState();var F;return e.jsx(s.TooltipProvider,{helpAriaLabel:W,children:e.jsx(d.InputGroupBehaviour,{children:e.jsx(r.default,v(j({label:x,labelHelp:N(q),labelSpacing:N(w),fieldHelp:N(_),fieldHelpInline:N(m),labelInline:N(B),labelWidth:N(S),labelId:G.current,id:A,labelAs:"span",disabled:E},u.default(R),n.default(null!==(F=R["data-component"])&&void 0!==F?F:"button-toggle-group",R)),{children:e.jsxs(f.ButtonToggleGroupProvider,{value:{onButtonClick:()=>{},handleKeyDown:e=>{const t=V();if(!t||!document.activeElement)return;const l=Array.from(t).indexOf(document.activeElement);let r;c.default.isLeftKey(e)?r=t[0===l?t.length-1:l-1]:c.default.isRightKey(e)&&(r=t[(l+1)%t.length]),r instanceof HTMLButtonElement&&r.focus()},pressedButtonValue:T,onChange:D,allowDeselect:C,isInGroup:!0,isDisabled:E,firstButton:$,childButtonCallbackRef:e=>{setTimeout((()=>{if(e){const t=V();t?e===t[0]&&z(e):z(void 0)}}),0)},hintTextId:P?L.current:void 0},children:[P&&e.jsx(b.HintText,{id:L.current,isDisabled:E,marginBottom:"var(--spacing150)",children:P}),e.jsx(o.default,v(j({ref:M},x?{"aria-labelledby":G.current}:{"aria-label":O}),{labelInline:B,inputWidth:H,fullWidth:I,role:"group",id:A,disabled:E,children:g}))]})}))})})};m.displayName="ButtonToggleGroup",exports.default=m;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("invariant"),r=require("../../../__internal__/form-field/form-field.component.js"),n=require("../../../__internal__/utils/helpers/tags/tags.js"),i=require("../../../__internal__/utils/helpers/guid/index.js"),o=require("./button-toggle-group.style.js"),a=require("../button-toggle.component.js");require("../../../style/utils/filter-styled-system-padding-props.js");var u=require("../../../style/utils/filter-styled-system-margin-props.js"),s=require("../../../__internal__/tooltip-provider/index.js"),d=require("../../../__internal__/input-behaviour/input-group-behaviour.component.js"),c=require("../../../__internal__/utils/helpers/events/events.js"),p=require("../../carbon-provider/__internal__/new-validation.context.js"),f=require("./__internal__/button-toggle-group.context.js"),b=require("../../../__internal__/legacy-hint-text/hint-text.component.js");function g(e){return e&&e.__esModule?e:{default:e}}var y=g(t),h=g(l);function _(e,t,l){return t in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}function j(e){for(var t=1;t<arguments.length;t++){var l=null!=arguments[t]?arguments[t]:{},r=Object.keys(l);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(l).filter((function(e){return Object.getOwnPropertyDescriptor(l,e).enumerable})))),r.forEach((function(t){_(e,t,l[t])}))}return e}function v(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);t.push.apply(t,l)}return t}(Object(t)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(t,l))})),e}const m=l=>{var{children:g,fieldHelp:_,fieldHelpInline:m,"aria-label":O,label:x,labelHelp:q,labelSpacing:w,inputHint:P,inputWidth:H,fullWidth:I,labelInline:B,labelWidth:S,onChange:D,value:T,helpAriaLabel:W,id:A,allowDeselect:C=!1,disabled:E=!1}=l,R=function(e,t){if(null==e)return{};var l,r,n=function(e,t){if(null==e)return{};var l,r,n={},i=Object.keys(e);for(r=0;r<i.length;r++)l=i[r],t.indexOf(l)>=0||(n[l]=e[l]);return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)l=i[r],t.indexOf(l)>=0||Object.prototype.propertyIsEnumerable.call(e,l)&&(n[l]=e[l])}return n}(l,["children","fieldHelp","fieldHelpInline","aria-label","label","labelHelp","labelSpacing","inputHint","inputWidth","fullWidth","labelInline","labelWidth","onChange","value","helpAriaLabel","id","allowDeselect","disabled"]);const k=t.useMemo((()=>!y.default.Children.toArray(g).find((e=>!y.default.isValidElement(e)||"ButtonToggle"!==e.type.displayName))),[g]);h.default(k,`\`ButtonToggleGroup\` only accepts children of type \`${a.ButtonToggle.displayName}\``);const G=t.useRef(i.default()),L=t.useRef(i.default()),M=t.useRef(null),{validationRedesignOptIn:K}=t.useContext(p.default),N=e=>K?void 0:e,V=()=>{var e;return null===(e=M.current)||void 0===e?void 0:e.querySelectorAll('[data-element="button-toggle-button"]')},[$,z]=t.useState();var F;return e.jsx(s.TooltipProvider,{helpAriaLabel:W,children:e.jsx(d.InputGroupBehaviour,{children:e.jsx(r.default,v(j({label:x,labelHelp:N(q),labelSpacing:N(w),fieldHelp:N(_),fieldHelpInline:N(m),labelInline:N(B),labelWidth:N(S),labelId:G.current,id:A,labelAs:"span",disabled:E},u.default(R),n.default(null!==(F=R["data-component"])&&void 0!==F?F:"button-toggle-group",R)),{children:e.jsxs(f.ButtonToggleGroupProvider,{value:{onButtonClick:()=>{},handleKeyDown:e=>{const t=V();if(!t||!document.activeElement)return;const l=Array.from(t).indexOf(document.activeElement);let r;c.default.isLeftKey(e)?r=t[0===l?t.length-1:l-1]:c.default.isRightKey(e)&&(r=t[(l+1)%t.length]),r instanceof HTMLButtonElement&&r.focus()},pressedButtonValue:T,onChange:D,allowDeselect:C,isInGroup:!0,isDisabled:E,firstButton:$,childButtonCallbackRef:e=>{setTimeout((()=>{if(e){const t=V();t?e===t[0]&&z(e):z(void 0)}}),0)},hintTextId:P?L.current:void 0},children:[P&&e.jsx(b.HintText,{id:L.current,isDisabled:E,marginBottom:"var(--spacing150)",children:P}),e.jsx(o.default,v(j({ref:M},x?{"aria-labelledby":G.current}:{"aria-label":O}),{labelInline:B,inputWidth:H,fullWidth:I,role:"group",id:A,disabled:E,children:g}))]})}))})})};m.displayName="ButtonToggleGroup",exports.default=m;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../__internal__/form-field/form-field.style.js"),i=require("../../icon/icon.style.js"),l=require("../checkbox.style.js"),n=require("../../../__internal__/label/label.style.js"),o=require("../../../__internal__/validations/validation-icon.style.js");function r(e){return e&&e.__esModule?e:{default:e}}const a=r(e).default.div.withConfig({displayName:"checkbox-group.style__StyledCheckboxGroup",componentId:"sc-e51b1b6e-0"})(["display:flex;flex-direction:column;","::before{font-size:16px;}&& ","{margin:0;}& ","{margin-bottom:var(--spacing150);:last-of-type{margin-bottom:0;}}& > ","{& > ","{margin-bottom:4px;vertical-align:middle;","{display:inline-block;}}}"," ",""],i.default,t.default,l.default,t.default,n.StyledLabelContainer,o.default,(({legendInline:t})=>t&&e.css(["",":first-child{padding-top:4px;}"],l.default)),(({inline:t})=>t&&e.css(["flex-direction:row;","{margin:0;:not(:first-of-type){margin-left:32px;}}"],l.default)));exports.default=a;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../__internal__/form-field/form-field.style.js"),l=require("../../icon/icon.style.js"),i=require("../checkbox.style.js"),n=require("../../../__internal__/legacy-label/label.style.js"),o=require("../../../__internal__/validations/validation-icon.style.js");function r(e){return e&&e.__esModule?e:{default:e}}const a=r(e).default.div.withConfig({displayName:"checkbox-group.style__StyledCheckboxGroup",componentId:"sc-ffa9ebbb-0"})(["display:flex;flex-direction:column;","::before{font-size:16px;}&& ","{margin:0;}& ","{margin-bottom:var(--spacing150);:last-of-type{margin-bottom:0;}}& > ","{& > ","{margin-bottom:4px;vertical-align:middle;","{display:inline-block;}}}"," ",""],l.default,t.default,i.default,t.default,n.StyledLabelContainer,o.default,(({legendInline:t})=>t&&e.css(["",":first-child{padding-top:4px;}"],i.default)),(({inline:t})=>t&&e.css(["flex-direction:row;","{margin:0;:not(:first-of-type){margin-left:32px;}}"],i.default)));exports.default=a;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),l=require("styled-system"),t=require("../../__internal__/checkable-input/checkable-input.style.js"),a=require("../../__internal__/field-help/field-help.style.js"),i=require("../../__internal__/checkable-input/hidden-checkable-input.style.js"),r=require("../../__internal__/checkable-input/checkable-input-svg-wrapper.style.js"),d=require("../../__internal__/label/label.style.js"),n=require("../../__internal__/validations/validation-icon.style.js"),o=require("../../style/themes/apply-base-theme.js"),s=require("../../style/utils/add-focus-styling.js");function u(e){return e&&e.__esModule?e:{default:e}}const c=u(e).default.div.attrs(o.default).withConfig({displayName:"checkbox.style__StyledCheckbox",componentId:"sc-ac6c7db0-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],l.margin,(({disabled:l,error:o,warning:u,info:c,fieldHelpInline:p,labelSpacing:f,inputWidth:g,reverse:b,size:h,adaptiveSpacingSmallScreen:v,applyNewValidation:y})=>e.css([""," ","{padding-top:1px;}","{height:16px;}svg{background-color:var(--colorsUtilityYang100);","}",",svg{height:16px;position:absolute;padding:1px;}",",",",",",svg{box-sizing:border-box;min-width:16px;width:16px;border-radius:var(--borderRadius025);",";}",":not([disabled]){&:focus + ",",&:hover + ","{","}}","{width:auto;flex:0 1 auto;}","{margin-left:16px;margin-top:0;padding-left:",";}","{position:relative;display:inline-block;}"," ",":checked ~ "," svg path{fill:var(--colorsUtilityYin090);}"," "," "," ",""],v&&"margin-left: 0;",t.StyledCheckableInput,r.default,!l&&e.css(["border:1px solid var(--colorsUtilityMajor300);"," "," "," ",""],c&&"border: 1px solid var(--colorsSemanticInfo500);",u&&"border: 1px solid var(--colorsSemanticCaution500);",o&&"border: 2px solid var(--colorsSemanticNegative500);",u&&y&&"border: 1px solid var(--colorsUtilityMajor300);"),i.default,t.StyledCheckableInput,i.default,r.default,"large"===h&&"border-radius: var(--borderRadius050)",i.default,r.default,r.default,s.default(),d.StyledLabelContainer,a.default,1===f?"var(--spacing100)":"var(--spacing200)",n.default,"large"===h&&e.css(["","{height:24px;}",",",",",",svg{height:24px;width:24px;min-width:24px;}","{margin-left:24px;}",""],r.default,t.StyledCheckableInput,i.default,r.default,a.default,p&&e.css(["",",","{align-self:center;}"],a.default,d.StyledLabelContainer)),i.default,r.default,l&&e.css(["svg{background-color:var(--colorsUtilityDisabled400);border:1px solid var(--colorsUtilityDisabled600);}svg path{fill:var(--colorsUtilityDisabled400);}",":checked ~ "," svg path{fill:var(--colorsUtilityYin030);}","{&:hover,&:focus{outline:none;cursor:not-allowed;}}"],i.default,r.default,r.default),p&&`\n ${a.default} {\n margin-left: 0;\n }\n\n ${d.default} {\n flex: 0 1 auto;\n }\n `,void 0!==g&&0!==g&&`\n ${a.default} {\n ${b?"margin-right":"margin-left"}: ${g}% !important;\n }\n `,b&&e.css(["","{margin-left:0;padding-left:0;}","{flex:0 1 auto;}",""],a.default,d.default,p&&e.css(["","{margin-right:8px;}","{padding-left:6px;}"],t.StyledCheckableInput,a.default)))));exports.default=c;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),l=require("styled-system"),t=require("../../__internal__/checkable-input/checkable-input.style.js"),a=require("../../__internal__/field-help/field-help.style.js"),i=require("../../__internal__/checkable-input/hidden-checkable-input.style.js"),r=require("../../__internal__/checkable-input/checkable-input-svg-wrapper.style.js"),d=require("../../__internal__/legacy-label/label.style.js"),n=require("../../__internal__/validations/validation-icon.style.js"),o=require("../../style/themes/apply-base-theme.js"),s=require("../../style/utils/add-focus-styling.js");function u(e){return e&&e.__esModule?e:{default:e}}const c=u(e).default.div.attrs(o.default).withConfig({displayName:"checkbox.style__StyledCheckbox",componentId:"sc-4f65151c-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],l.margin,(({disabled:l,error:o,warning:u,info:c,fieldHelpInline:p,labelSpacing:f,inputWidth:g,reverse:b,size:h,adaptiveSpacingSmallScreen:v,applyNewValidation:y})=>e.css([""," ","{padding-top:1px;}","{height:16px;}svg{background-color:var(--colorsUtilityYang100);","}",",svg{height:16px;position:absolute;padding:1px;}",",",",",",svg{box-sizing:border-box;min-width:16px;width:16px;border-radius:var(--borderRadius025);",";}",":not([disabled]){&:focus + ",",&:hover + ","{","}}","{width:auto;flex:0 1 auto;}","{margin-left:16px;margin-top:0;padding-left:",";}","{position:relative;display:inline-block;}"," ",":checked ~ "," svg path{fill:var(--colorsUtilityYin090);}"," "," "," ",""],v&&"margin-left: 0;",t.StyledCheckableInput,r.default,!l&&e.css(["border:1px solid var(--colorsUtilityMajor300);"," "," "," ",""],c&&"border: 1px solid var(--colorsSemanticInfo500);",u&&"border: 1px solid var(--colorsSemanticCaution500);",o&&"border: 2px solid var(--colorsSemanticNegative500);",u&&y&&"border: 1px solid var(--colorsUtilityMajor300);"),i.default,t.StyledCheckableInput,i.default,r.default,"large"===h&&"border-radius: var(--borderRadius050)",i.default,r.default,r.default,s.default(),d.StyledLabelContainer,a.default,1===f?"var(--spacing100)":"var(--spacing200)",n.default,"large"===h&&e.css(["","{height:24px;}",",",",",",svg{height:24px;width:24px;min-width:24px;}","{margin-left:24px;}",""],r.default,t.StyledCheckableInput,i.default,r.default,a.default,p&&e.css(["",",","{align-self:center;}"],a.default,d.StyledLabelContainer)),i.default,r.default,l&&e.css(["svg{background-color:var(--colorsUtilityDisabled400);border:1px solid var(--colorsUtilityDisabled600);}svg path{fill:var(--colorsUtilityDisabled400);}",":checked ~ "," svg path{fill:var(--colorsUtilityYin030);}","{&:hover,&:focus{outline:none;cursor:not-allowed;}}"],i.default,r.default,r.default),p&&`\n ${a.default} {\n margin-left: 0;\n }\n\n ${d.default} {\n flex: 0 1 auto;\n }\n `,void 0!==g&&0!==g&&`\n ${a.default} {\n ${b?"margin-right":"margin-left"}: ${g}% !important;\n }\n `,b&&e.css(["","{margin-left:0;padding-left:0;}","{flex:0 1 auto;}",""],a.default,d.default,p&&e.css(["","{margin-right:8px;}","{padding-left:6px;}"],t.StyledCheckableInput,a.default)))));exports.default=c;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("./__internal__/utils.js"),a=require("../../hooks/__internal__/useLocale/useLocale.js"),n=require("../../__internal__/utils/helpers/events/events.js");require("../../style/utils/filter-styled-system-padding-props.js");var l=require("../../style/utils/filter-styled-system-margin-props.js"),i=require("../../style/utils/filter-out-styled-system-spacing-props.js"),o=require("./__internal__/date-formats/index.js"),u=require("./date.style.js"),s=require("../textbox/textbox.component.js"),d=require("./__internal__/date-picker/date-picker.component.js"),c=require("../date-range/__internal__/date-range.context.js"),p=require("../../hooks/__internal__/useClickAwayListener/useClickAwayListener.js"),f=require("../../__internal__/utils/helpers/guid/index.js"),m=require("../../__internal__/utils/helpers/tags/tags.js");function b(e){return e&&e.__esModule?e:{default:e}}function y(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},a=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),a.forEach((function(t){y(e,t,r[t])}))}return e}function g(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const v=b(t).default.forwardRef(((b,y)=>{var{adaptiveLabelBreakpoint:v,allowEmptyValue:h,autoFocus:_,"data-element":j,"data-role":k,disabled:D,disablePortal:P=!0,helpAriaLabel:x,labelInline:w,minDate:L,maxDate:S,onBlur:V,onChange:F,onClick:I,onFocus:q,onKeyDown:A,pickerProps:M,readOnly:C,size:R="medium",tooltipPosition:B,value:W,inputWidth:E,labelWidth:T,maxWidth:K,inputName:z,onPickerClose:Y,onPickerOpen:N,dateFormatOverride:G,datePickerAriaLabel:$,datePickerAriaLabelledBy:H,validationMessagePositionTop:J=!0}=b,Q=function(e,t){if(null==e)return{};var r,a,n=function(e,t){if(null==e)return{};var r,a,n={},l=Object.keys(e);for(a=0;a<l.length;a++)r=l[a],t.indexOf(r)>=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(a=0;a<l.length;a++)r=l[a],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(b,["adaptiveLabelBreakpoint","allowEmptyValue","autoFocus","data-element","data-role","disabled","disablePortal","helpAriaLabel","labelInline","minDate","maxDate","onBlur","onChange","onClick","onFocus","onKeyDown","pickerProps","readOnly","size","tooltipPosition","value","inputWidth","labelWidth","maxWidth","inputName","onPickerClose","onPickerOpen","dateFormatOverride","datePickerAriaLabel","datePickerAriaLabelledBy","validationMessagePositionTop"]);const U=t.useRef(null),X=t.useRef(null),Z=t.useRef(null),ee=t.useRef(!1),te=t.useRef(!1),re=t.useRef(!1),ae=a.default(),{dateFnsLocale:ne,dateFormatOverride:le}=ae.date,{format:ie,formats:oe}=t.useMemo((()=>o.default(ne(),G||le)),[ne,le,G]),{inputRefMap:ue,setInputRefMap:se,validationMessagePositionTop:de}=t.useContext(c.default),[ce,pe]=t.useState(!1),[fe,me]=t.useState((()=>{if(r.isValidLocaleDate(W,ne()))return r.checkISOFormatAndLength(W)?r.parseISODate(W):r.parseDate(ie,W)})),be=t.useRef(!0),ye=t.useRef(f.default()),Oe=null!=de?de:J,ge=e=>h&&!e.length?e:null,ve=e=>{const{id:t,name:a}=e.target,[n,l]=r.findMatchedFormatAndValue(e.target.value,oe),i="blur"===e.type?r.formattedValue(ie,fe):e.target.value,o=r.isDateValid(r.parseDate(n,l))?r.formatToISO(...r.additionalYears(n,l)):ge(e.target.value);return{target:g(O({},a&&{name:a},t&&{id:t}),{value:{formattedValue:i,rawValue:o}})}},he=p.default((()=>{var e,t;ce&&(ee.current=!0,null===(e=Z.current)||void 0===e||e.focus(),te.current=!1,null===(t=Z.current)||void 0===t||t.blur(),pe(!1),null==Y||Y(),ee.current=!1)}),"mousedown"),_e=e=>{I&&I(e)},je=t.useCallback((e=>{var t;Z.current=e,X.current=null==e?void 0:e.parentElement,y&&("function"==typeof y?y(e):y.current=e),z&&(null==ue||null===(t=ue[z])||void 0===t?void 0:t.setOpen)!==pe&&(null==se||se({[z]:{isBlurBlocked:te,setOpen:pe}}))}),[z,ue,se,y]);t.useEffect((()=>{const[e,t]=r.findMatchedFormatAndValue(W,oe);e&&t&&r.isDateValid(r.parseDate(e,t))?me(r.parseDate(...r.additionalYears(e,t))):r.checkISOFormatAndLength(W)&&be.current?me(r.parseISODate(W)):me(void 0)}),[W,oe]);const ke=l.default(Q);return e.jsxs(u.default,g(O(g(O({ref:U,role:"presentation",size:R,labelInline:w},ke),{applyDateRangeStyling:!!ue,maxWidth:K,inputWidth:E}),m.default("date",{"data-element":j,"data-role":k})),{children:[e.jsx(s.Textbox,g(O({},i.default(Q)),{"data-component":"date-input",value:(()=>{if(r.checkISOFormatAndLength(W)&&be.current)return r.formattedValue(ie,r.parseISODate(W));const e=r.getSeparator(W),t=r.getSeparator(ie),a=()=>W.split("").map((r=>r===e?t:r)).join("");if(be.current&&e!==t&&r.isDateValid(r.parseDate(ie,a()))){be.current=!1;const[e,t]=r.findMatchedFormatAndValue(a(),oe);return r.formattedValue(ie,r.parseDate(...r.additionalYears(e,t)))}return W})(),onBlur:e=>{if(D||C)return;let t;if(r.isDateValid(fe)){t=ve(e);const a=r.checkISOFormatAndLength(W)?r.formattedValue(ie,r.parseISODate(W)):W,[,n]=r.findMatchedFormatAndValue(a,oe);r.formattedValue(ie,fe)!==n&&F(t)}else{const{id:r,name:a}=e.target;t={target:g(O({},a&&{name:a},r&&{id:r}),{value:{formattedValue:e.target.value,rawValue:ge(e.target.value)}})}}te.current||V&&V(t)},onChange:e=>{be.current=!1,F(ve(e))},onClick:_e,onFocus:e=>{D||C||(te.current=!1,q&&q(e))},onKeyDown:e=>{if(A&&A(e),ce&&n.default.isTabKey(e)){if(n.default.isShiftKey(e))pe(!1),null==Y||Y();else if(!P){var t,r;e.preventDefault(),null===(r=document)||void 0===r||null===(t=r.querySelector(`[id="${ye.current}"]`))||void 0===t||t.focus()}ee.current=!1}},iconOnClick:_e,onMouseDown:()=>{he(),se&&(te.current=!0),ce||null==N||N()},iconOnMouseDown:()=>{te.current=!0,ee.current=!0,he(),ce?(pe(!1),null==Y||Y()):(pe(!0),null==N||N())},inputIcon:"calendar",labelInline:w,ref:je,adaptiveLabelBreakpoint:v,tooltipPosition:B,helpAriaLabel:x,autoFocus:_,size:R,disabled:D,readOnly:C,inputWidth:E,labelWidth:T,maxWidth:K,m:0,validationMessagePositionTop:Oe})),e.jsx(d.DatePicker,{disablePortal:P,inputElement:X,pickerProps:M,selectedDays:fe,onDayClick:(e,t)=>{var a;me(e),F(ve(g(O({},t),{target:g(O({},t.target),{value:r.formattedValue(ie,e)})}))),re.current=!0,null===(a=Z.current)||void 0===a||a.focus(),pe(!1)},minDate:L,maxDate:S,pickerMouseDown:()=>{te.current=!0,he()},open:ce,setOpen:pe,pickerTabGuardId:ye.current,onPickerClose:Y,ariaLabel:$,ariaLabelledBy:H})]}))}));exports.DateInput=v,exports.default=v;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("./__internal__/utils.js"),a=require("../../hooks/__internal__/useLocale/useLocale.js"),n=require("../../__internal__/utils/helpers/events/events.js");require("../../style/utils/filter-styled-system-padding-props.js");var l=require("../../style/utils/filter-styled-system-margin-props.js"),i=require("../../style/utils/filter-out-styled-system-spacing-props.js"),o=require("./__internal__/date-formats/index.js"),u=require("./date.style.js"),s=require("../textbox/textbox.component.js"),d=require("./__internal__/date-picker/date-picker.component.js"),c=require("../date-range/__internal__/date-range.context.js"),p=require("../../hooks/__internal__/useClickAwayListener/useClickAwayListener.js"),f=require("../../__internal__/utils/helpers/guid/index.js"),m=require("../../__internal__/utils/helpers/tags/tags.js");function b(e){return e&&e.__esModule?e:{default:e}}function y(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},a=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),a.forEach((function(t){y(e,t,r[t])}))}return e}function g(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const v={large:"140px",medium:"135px",small:"120px"},h=b(t).default.forwardRef(((b,y)=>{var{adaptiveLabelBreakpoint:h,allowEmptyValue:_,autoFocus:j,"data-element":k,"data-role":D,disabled:P,disablePortal:x=!0,helpAriaLabel:w,labelInline:L,minDate:S,maxDate:V,onBlur:F,onChange:I,onClick:q,onFocus:A,onKeyDown:M,pickerProps:C,readOnly:R,size:B="medium",tooltipPosition:W,value:E,inputWidth:T,labelWidth:K,maxWidth:z,inputName:N,onPickerClose:Y,onPickerOpen:G,dateFormatOverride:$,datePickerAriaLabel:H,datePickerAriaLabelledBy:J,validationMessagePositionTop:Q=!0}=b,U=function(e,t){if(null==e)return{};var r,a,n=function(e,t){if(null==e)return{};var r,a,n={},l=Object.keys(e);for(a=0;a<l.length;a++)r=l[a],t.indexOf(r)>=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(a=0;a<l.length;a++)r=l[a],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(b,["adaptiveLabelBreakpoint","allowEmptyValue","autoFocus","data-element","data-role","disabled","disablePortal","helpAriaLabel","labelInline","minDate","maxDate","onBlur","onChange","onClick","onFocus","onKeyDown","pickerProps","readOnly","size","tooltipPosition","value","inputWidth","labelWidth","maxWidth","inputName","onPickerClose","onPickerOpen","dateFormatOverride","datePickerAriaLabel","datePickerAriaLabelledBy","validationMessagePositionTop"]);const X=t.useRef(null),Z=t.useRef(null),ee=t.useRef(null),te=t.useRef(!1),re=t.useRef(!1),ae=t.useRef(!1),ne=a.default(),{dateFnsLocale:le,dateFormatOverride:ie}=ne.date,{format:oe,formats:ue}=t.useMemo((()=>o.default(le(),$||ie)),[le,ie,$]),{inputRefMap:se,setInputRefMap:de,validationMessagePositionTop:ce}=t.useContext(c.default),[pe,fe]=t.useState(!1),[me,be]=t.useState((()=>{if(r.isValidLocaleDate(E,le()))return r.checkISOFormatAndLength(E)?r.parseISODate(E):r.parseDate(oe,E)})),ye=t.useRef(!0),Oe=t.useRef(f.default()),ge=null!=ce?ce:Q,ve=e=>_&&!e.length?e:null,he=e=>{const{id:t,name:a}=e.target,[n,l]=r.findMatchedFormatAndValue(e.target.value,ue),i="blur"===e.type?r.formattedValue(oe,me):e.target.value,o=r.isDateValid(r.parseDate(n,l))?r.formatToISO(...r.additionalYears(n,l)):ve(e.target.value);return{target:g(O({},a&&{name:a},t&&{id:t}),{value:{formattedValue:i,rawValue:o}})}},_e=p.default((()=>{var e,t;pe&&(te.current=!0,null===(e=ee.current)||void 0===e||e.focus(),re.current=!1,null===(t=ee.current)||void 0===t||t.blur(),fe(!1),null==Y||Y(),te.current=!1)}),"mousedown"),je=e=>{q&&q(e)},ke=t.useCallback((e=>{var t;ee.current=e,Z.current=null==e?void 0:e.parentElement,y&&("function"==typeof y?y(e):y.current=e),N&&(null==se||null===(t=se[N])||void 0===t?void 0:t.setOpen)!==fe&&(null==de||de({[N]:{isBlurBlocked:re,setOpen:fe}}))}),[N,se,de,y]);t.useEffect((()=>{const[e,t]=r.findMatchedFormatAndValue(E,ue);e&&t&&r.isDateValid(r.parseDate(e,t))?be(r.parseDate(...r.additionalYears(e,t))):r.checkISOFormatAndLength(E)&&ye.current?be(r.parseISODate(E)):be(void 0)}),[E,ue]);const De=l.default(U);return e.jsxs(u.default,g(O(g(O({ref:X,role:"presentation",size:B,labelInline:L},De),{applyDateRangeStyling:!!se,maxWidth:z,inputWidth:T}),m.default("date",{"data-element":k,"data-role":D})),{onMouseDown:_e,className:"date",children:[e.jsx(s.Textbox,g(O({},i.default(U)),{"data-component":"date-input",value:(()=>{if(r.checkISOFormatAndLength(E)&&ye.current)return r.formattedValue(oe,r.parseISODate(E));const e=r.getSeparator(E),t=r.getSeparator(oe),a=()=>E.split("").map((r=>r===e?t:r)).join("");if(ye.current&&e!==t&&r.isDateValid(r.parseDate(oe,a()))){ye.current=!1;const[e,t]=r.findMatchedFormatAndValue(a(),ue);return r.formattedValue(oe,r.parseDate(...r.additionalYears(e,t)))}return E})(),onBlur:e=>{if(P||R)return;let t;if(r.isDateValid(me)){t=he(e);const a=r.checkISOFormatAndLength(E)?r.formattedValue(oe,r.parseISODate(E)):E,[,n]=r.findMatchedFormatAndValue(a,ue);r.formattedValue(oe,me)!==n&&I(t)}else{const{id:r,name:a}=e.target;t={target:g(O({},a&&{name:a},r&&{id:r}),{value:{formattedValue:e.target.value,rawValue:ve(e.target.value)}})}}re.current||F&&F(t)},onChange:e=>{ye.current=!1,I(he(e))},onClick:je,onFocus:e=>{P||R||(re.current=!1,A&&A(e))},onKeyDown:e=>{if(M&&M(e),pe&&n.default.isTabKey(e)){if(n.default.isShiftKey(e))fe(!1),null==Y||Y();else if(!x){var t,r;e.preventDefault(),null===(r=document)||void 0===r||null===(t=r.querySelector(`[id="${Oe.current}"]`))||void 0===t||t.focus()}te.current=!1}},iconOnClick:je,onMouseDown:()=>{de&&(re.current=!0),pe||null==G||G()},iconOnMouseDown:()=>{re.current=!0,te.current=!0,pe?(fe(!1),null==Y||Y()):(fe(!0),null==G||G())},inputIcon:"calendar",labelInline:L,ref:ke,adaptiveLabelBreakpoint:h,tooltipPosition:W,helpAriaLabel:w,autoFocus:j,size:B,disabled:P,readOnly:R,inputWidth:T,labelWidth:K,maxWidth:null!=z?z:v[B],m:0,validationMessagePositionTop:ge})),e.jsx(d.DatePicker,{disablePortal:x,inputElement:Z,pickerProps:C,selectedDays:me,onDayClick:(e,t)=>{var a;be(e),I(he(g(O({},t),{target:g(O({},t.target),{value:r.formattedValue(oe,e)})}))),ae.current=!0,null===(a=ee.current)||void 0===a||a.focus(),fe(!1)},minDate:S,maxDate:V,pickerMouseDown:()=>{re.current=!0},open:pe,setOpen:fe,pickerTabGuardId:Oe.current,onPickerClose:Y,ariaLabel:H,ariaLabelledBy:J})]}))}));exports.DateInput=h,exports.default=h;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("styled-system"),i=require("../../style/themes/apply-base-theme.js"),l=require("../../__internal__/input/input.style.js"),a=require("../../__internal__/input/input-presentation.style.js"),n=require("../../__internal__/form-field/form-field.style.js"),r=require("../../__internal__/validation-message/validation-message.style.js"),s=require("../../__internal__/label/label.style.js");function d(e){return e&&e.__esModule?e:{default:e}}const u={large:"140px",medium:"135px",small:"120px"},_=d(e).default.div.attrs(i.default).withConfig({displayName:"date.style__StyledDateInput",componentId:"sc-7be40934-0"})(["margin-bottom:var(--fieldSpacing);"," & ","{flex:none;width:",";","{margin-right:-8px;}}",""],t.margin,a.default,(({inputWidth:e,maxWidth:t,size:i})=>t||e?"":u[i]),l.default,(({applyDateRangeStyling:t,maxWidth:i,size:l,labelInline:a})=>t&&!a&&e.css(["","{max-width:",";}",",","{overflow-wrap:anywhere;}"],n.FieldLineStyle,i||u[l],r.default,s.default)));exports.default=_;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("styled-system"),a=require("../../style/themes/apply-base-theme.js"),l=require("../../__internal__/validation-message/validation-message.style.js"),s=require("../../__internal__/label/label.style.js");function r(e){return e&&e.__esModule?e:{default:e}}const n=r(e).default.div.attrs(a.default).withConfig({displayName:"date.style__StyledDateInput",componentId:"sc-24718135-0"})(["margin-bottom:var(--fieldSpacing);"," ",""],t.margin,(({applyDateRangeStyling:t,labelInline:a})=>t&&!a&&e.css(["",",","{overflow-wrap:anywhere;}"],l.default,s.default)));exports.default=n;