igniteui-webcomponents 7.3.2 → 7.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (478) hide show
  1. package/CHANGELOG.md +87 -0
  2. package/animations/easings.d.ts +21 -31
  3. package/animations/easings.js +21 -34
  4. package/animations/easings.js.map +1 -1
  5. package/animations/player.d.ts +8 -16
  6. package/animations/player.js +5 -8
  7. package/animations/player.js.map +1 -1
  8. package/animations/view-transition.d.ts +10 -10
  9. package/animations/view-transition.js +26 -37
  10. package/animations/view-transition.js.map +1 -1
  11. package/components/breadcrumb/breadcrumb.d.ts +74 -0
  12. package/components/breadcrumb/breadcrumb.js +107 -0
  13. package/components/breadcrumb/breadcrumb.js.map +1 -0
  14. package/components/breadcrumb/breadcrumbs.d.ts +60 -0
  15. package/components/breadcrumb/breadcrumbs.js +50 -0
  16. package/components/breadcrumb/breadcrumbs.js.map +1 -0
  17. package/components/breadcrumb/themes/breadcrumb.base.css.js +3 -0
  18. package/components/breadcrumb/themes/breadcrumb.base.css.js.map +1 -0
  19. package/components/breadcrumb/themes/breadcrumbs.base.css.d.ts +1 -0
  20. package/components/{resize-container/themes/resize-container.base.css.js → breadcrumb/themes/breadcrumbs.base.css.js} +2 -2
  21. package/components/breadcrumb/themes/breadcrumbs.base.css.js.map +1 -0
  22. package/components/breadcrumb/themes/dark/breadcrumb.bootstrap.css.d.ts +1 -0
  23. package/components/breadcrumb/themes/dark/breadcrumb.bootstrap.css.js +3 -0
  24. package/components/breadcrumb/themes/dark/breadcrumb.bootstrap.css.js.map +1 -0
  25. package/components/breadcrumb/themes/dark/breadcrumb.fluent.css.d.ts +1 -0
  26. package/components/breadcrumb/themes/dark/breadcrumb.fluent.css.js +3 -0
  27. package/components/breadcrumb/themes/dark/breadcrumb.fluent.css.js.map +1 -0
  28. package/components/breadcrumb/themes/dark/breadcrumb.indigo.css.d.ts +1 -0
  29. package/components/breadcrumb/themes/dark/breadcrumb.indigo.css.js +3 -0
  30. package/components/breadcrumb/themes/dark/breadcrumb.indigo.css.js.map +1 -0
  31. package/components/breadcrumb/themes/dark/breadcrumb.material.css.d.ts +1 -0
  32. package/components/breadcrumb/themes/dark/breadcrumb.material.css.js +3 -0
  33. package/components/breadcrumb/themes/dark/breadcrumb.material.css.js.map +1 -0
  34. package/components/breadcrumb/themes/light/breadcrumb.bootstrap.css.d.ts +1 -0
  35. package/components/breadcrumb/themes/light/breadcrumb.bootstrap.css.js +3 -0
  36. package/components/breadcrumb/themes/light/breadcrumb.bootstrap.css.js.map +1 -0
  37. package/components/breadcrumb/themes/light/breadcrumb.fluent.css.d.ts +1 -0
  38. package/components/breadcrumb/themes/light/breadcrumb.fluent.css.js +3 -0
  39. package/components/breadcrumb/themes/light/breadcrumb.fluent.css.js.map +1 -0
  40. package/components/breadcrumb/themes/light/breadcrumb.indigo.css.d.ts +1 -0
  41. package/components/breadcrumb/themes/light/breadcrumb.indigo.css.js +3 -0
  42. package/components/breadcrumb/themes/light/breadcrumb.indigo.css.js.map +1 -0
  43. package/components/breadcrumb/themes/light/breadcrumb.material.css.d.ts +1 -0
  44. package/components/breadcrumb/themes/light/breadcrumb.material.css.js +3 -0
  45. package/components/breadcrumb/themes/light/breadcrumb.material.css.js.map +1 -0
  46. package/components/breadcrumb/themes/light/breadcrumb.shared.css.d.ts +1 -0
  47. package/components/breadcrumb/themes/light/breadcrumb.shared.css.js +3 -0
  48. package/components/breadcrumb/themes/light/breadcrumb.shared.css.js.map +1 -0
  49. package/components/breadcrumb/themes/shared/breadcrumb.bootstrap.css.d.ts +1 -0
  50. package/components/breadcrumb/themes/shared/breadcrumb.bootstrap.css.js +3 -0
  51. package/components/breadcrumb/themes/shared/breadcrumb.bootstrap.css.js.map +1 -0
  52. package/components/breadcrumb/themes/shared/breadcrumb.common.css.d.ts +1 -0
  53. package/components/breadcrumb/themes/shared/breadcrumb.common.css.js +3 -0
  54. package/components/breadcrumb/themes/shared/breadcrumb.common.css.js.map +1 -0
  55. package/components/breadcrumb/themes/shared/breadcrumb.fluent.css.d.ts +1 -0
  56. package/components/breadcrumb/themes/shared/breadcrumb.fluent.css.js +3 -0
  57. package/components/breadcrumb/themes/shared/breadcrumb.fluent.css.js.map +1 -0
  58. package/components/breadcrumb/themes/shared/breadcrumb.indigo.css.d.ts +1 -0
  59. package/components/breadcrumb/themes/shared/breadcrumb.indigo.css.js +3 -0
  60. package/components/breadcrumb/themes/shared/breadcrumb.indigo.css.js.map +1 -0
  61. package/components/breadcrumb/themes/shared/breadcrumb.material.css.d.ts +1 -0
  62. package/components/breadcrumb/themes/shared/breadcrumb.material.css.js +3 -0
  63. package/components/breadcrumb/themes/shared/breadcrumb.material.css.js.map +1 -0
  64. package/components/breadcrumb/themes/themes.d.ts +2 -0
  65. package/components/breadcrumb/themes/themes.js +50 -0
  66. package/components/breadcrumb/themes/themes.js.map +1 -0
  67. package/components/button/button.d.ts +0 -2
  68. package/components/button/button.js.map +1 -1
  69. package/components/button-group/button-group.d.ts +42 -12
  70. package/components/button-group/button-group.js +82 -34
  71. package/components/button-group/button-group.js.map +1 -1
  72. package/components/button-group/toggle-button.d.ts +6 -1
  73. package/components/button-group/toggle-button.js +28 -2
  74. package/components/button-group/toggle-button.js.map +1 -1
  75. package/components/calendar/base.js +2 -1
  76. package/components/calendar/base.js.map +1 -1
  77. package/components/calendar/calendar.d.ts +2 -3
  78. package/components/calendar/calendar.js.map +1 -1
  79. package/components/calendar/days-view/days-view.d.ts +2 -2
  80. package/components/calendar/days-view/days-view.js.map +1 -1
  81. package/components/carousel/carousel-indicator.js +1 -0
  82. package/components/carousel/carousel-indicator.js.map +1 -1
  83. package/components/carousel/carousel-slide.d.ts +1 -1
  84. package/components/carousel/carousel-slide.js.map +1 -1
  85. package/components/carousel/carousel.d.ts +3 -3
  86. package/components/carousel/carousel.js.map +1 -1
  87. package/components/chat/chat-input.d.ts +1 -2
  88. package/components/chat/chat-input.js +1 -1
  89. package/components/chat/chat-input.js.map +1 -1
  90. package/components/chat/chat-state.d.ts +8 -9
  91. package/components/chat/chat-state.js.map +1 -1
  92. package/components/chat/chat.d.ts +1 -3
  93. package/components/chat/chat.js +2 -2
  94. package/components/chat/chat.js.map +1 -1
  95. package/components/chat/message-attachments.d.ts +6 -15
  96. package/components/chat/message-attachments.js.map +1 -1
  97. package/components/chat/utils.d.ts +0 -1
  98. package/components/chat/utils.js +1 -1
  99. package/components/chat/utils.js.map +1 -1
  100. package/components/checkbox/checkbox-base.d.ts +3 -1
  101. package/components/checkbox/checkbox-base.js +4 -0
  102. package/components/checkbox/checkbox-base.js.map +1 -1
  103. package/components/checkbox/checkbox.js +4 -12
  104. package/components/checkbox/checkbox.js.map +1 -1
  105. package/components/checkbox/switch.js +1 -8
  106. package/components/checkbox/switch.js.map +1 -1
  107. package/components/chip/chip.d.ts +2 -2
  108. package/components/chip/chip.js.map +1 -1
  109. package/components/color-picker/color-picker.d.ts +35 -34
  110. package/components/color-picker/color-picker.js +12 -7
  111. package/components/color-picker/color-picker.js.map +1 -1
  112. package/components/color-picker/common.d.ts +0 -2
  113. package/components/color-picker/common.js +2 -2
  114. package/components/color-picker/common.js.map +1 -1
  115. package/components/color-picker/converters.js.map +1 -1
  116. package/components/color-picker/picker-canvas.js.map +1 -1
  117. package/components/combo/combo.d.ts +24 -24
  118. package/components/combo/combo.js +21 -26
  119. package/components/combo/combo.js.map +1 -1
  120. package/components/combo/controllers/data.d.ts +7 -10
  121. package/components/combo/controllers/data.js.map +1 -1
  122. package/components/date-picker/date-picker.base.d.ts +22 -27
  123. package/components/date-picker/date-picker.base.js +9 -3
  124. package/components/date-picker/date-picker.base.js.map +1 -1
  125. package/components/date-picker/date-picker.d.ts +1 -1
  126. package/components/date-picker/date-picker.js +5 -3
  127. package/components/date-picker/date-picker.js.map +1 -1
  128. package/components/date-range-picker/date-range-input.d.ts +0 -2
  129. package/components/date-range-picker/date-range-input.js +0 -6
  130. package/components/date-range-picker/date-range-input.js.map +1 -1
  131. package/components/date-range-picker/date-range-picker.d.ts +22 -31
  132. package/components/date-range-picker/date-range-picker.js +7 -7
  133. package/components/date-range-picker/date-range-picker.js.map +1 -1
  134. package/components/date-range-picker/i18n.d.ts +21 -0
  135. package/components/date-range-picker/i18n.js +10 -0
  136. package/components/date-range-picker/i18n.js.map +1 -0
  137. package/components/date-range-picker/predefined-ranges-area.d.ts +3 -3
  138. package/components/date-range-picker/predefined-ranges-area.js +2 -5
  139. package/components/date-range-picker/predefined-ranges-area.js.map +1 -1
  140. package/components/date-range-picker/validators.d.ts +0 -4
  141. package/components/date-range-picker/validators.js +4 -4
  142. package/components/date-range-picker/validators.js.map +1 -1
  143. package/components/date-time-input/date-time-input.base.d.ts +42 -40
  144. package/components/date-time-input/date-time-input.base.js +9 -5
  145. package/components/date-time-input/date-time-input.base.js.map +1 -1
  146. package/components/date-time-input/date-time-input.d.ts +1 -11
  147. package/components/date-time-input/date-time-input.js +0 -6
  148. package/components/date-time-input/date-time-input.js.map +1 -1
  149. package/components/date-time-input/datetime-mask-parser.d.ts +0 -10
  150. package/components/date-time-input/datetime-mask-parser.js +1 -1
  151. package/components/date-time-input/datetime-mask-parser.js.map +1 -1
  152. package/components/dialog/dialog.js.map +1 -1
  153. package/components/dropdown/dropdown-group.d.ts +2 -10
  154. package/components/dropdown/dropdown-group.js +2 -27
  155. package/components/dropdown/dropdown-group.js.map +1 -1
  156. package/components/dropdown/dropdown.d.ts +17 -23
  157. package/components/dropdown/dropdown.js +5 -17
  158. package/components/dropdown/dropdown.js.map +1 -1
  159. package/components/file-input/file-input.d.ts +7 -2
  160. package/components/file-input/file-input.js +4 -0
  161. package/components/file-input/file-input.js.map +1 -1
  162. package/components/icon/icon.d.ts +1 -1
  163. package/components/icon/icon.registry.d.ts +6 -6
  164. package/components/icon/icon.registry.js.map +1 -1
  165. package/components/input/input-base.d.ts +2 -2
  166. package/components/input/input-base.js +3 -5
  167. package/components/input/input-base.js.map +1 -1
  168. package/components/input/input.d.ts +3 -3
  169. package/components/input/input.js.map +1 -1
  170. package/components/mask-input/mask-history.d.ts +22 -18
  171. package/components/mask-input/mask-history.js.map +1 -1
  172. package/components/mask-input/mask-input.d.ts +1 -1
  173. package/components/mask-input/mask-parser.d.ts +11 -13
  174. package/components/mask-input/mask-parser.js.map +1 -1
  175. package/components/popover/popover.d.ts +45 -34
  176. package/components/popover/popover.js +54 -122
  177. package/components/popover/popover.js.map +1 -1
  178. package/components/popover/position/arrow.d.ts +19 -0
  179. package/components/popover/position/arrow.js +33 -0
  180. package/components/popover/position/arrow.js.map +1 -0
  181. package/components/popover/position/floating.d.ts +40 -0
  182. package/components/popover/position/floating.js +146 -0
  183. package/components/popover/position/floating.js.map +1 -0
  184. package/components/popover/position/native.d.ts +45 -0
  185. package/components/popover/position/native.js +158 -0
  186. package/components/popover/position/native.js.map +1 -0
  187. package/components/popover/position/strategy.d.ts +37 -0
  188. package/components/popover/position/strategy.js +21 -0
  189. package/components/popover/position/strategy.js.map +1 -0
  190. package/components/popover/position/types.d.ts +26 -0
  191. package/components/popover/position/types.js +15 -0
  192. package/components/popover/position/types.js.map +1 -0
  193. package/components/popover/themes/light/popover.base.css.js +1 -1
  194. package/components/popover/themes/light/popover.base.css.js.map +1 -1
  195. package/components/progress/circular-progress.d.ts +0 -5
  196. package/components/progress/circular-progress.js.map +1 -1
  197. package/components/qr-code/qr-code.d.ts +1 -1
  198. package/components/radio/radio.d.ts +6 -4
  199. package/components/radio/radio.js +24 -25
  200. package/components/radio/radio.js.map +1 -1
  201. package/components/radio-group/radio-group.js.map +1 -1
  202. package/components/rating/rating.d.ts +9 -6
  203. package/components/rating/rating.js +17 -18
  204. package/components/rating/rating.js.map +1 -1
  205. package/components/select/select-group.d.ts +5 -10
  206. package/components/select/select-group.js +10 -34
  207. package/components/select/select-group.js.map +1 -1
  208. package/components/select/select.d.ts +12 -20
  209. package/components/select/select.js +5 -15
  210. package/components/select/select.js.map +1 -1
  211. package/components/slider/range-slider.d.ts +0 -1
  212. package/components/slider/range-slider.js +6 -11
  213. package/components/slider/range-slider.js.map +1 -1
  214. package/components/slider/slider-base.d.ts +4 -1
  215. package/components/slider/slider-base.js +20 -18
  216. package/components/slider/slider-base.js.map +1 -1
  217. package/components/slider/slider.d.ts +2 -0
  218. package/components/slider/slider.js +5 -1
  219. package/components/slider/slider.js.map +1 -1
  220. package/components/splitter/splitter.d.ts +6 -6
  221. package/components/splitter/splitter.js.map +1 -1
  222. package/components/textarea/textarea.d.ts +2 -5
  223. package/components/textarea/textarea.js +3 -5
  224. package/components/textarea/textarea.js.map +1 -1
  225. package/components/tile-manager/tile-manager.d.ts +6 -7
  226. package/components/tile-manager/tile-manager.js.map +1 -1
  227. package/components/tile-manager/tile.d.ts +3 -3
  228. package/components/tile-manager/tile.js.map +1 -1
  229. package/components/toast/toast.d.ts +0 -2
  230. package/components/toast/toast.js.map +1 -1
  231. package/components/tooltip/controller.js.map +1 -1
  232. package/components/tooltip/service.js +4 -5
  233. package/components/tooltip/service.js.map +1 -1
  234. package/components/tooltip/tooltip.d.ts +34 -13
  235. package/components/tooltip/tooltip.js +8 -4
  236. package/components/tooltip/tooltip.js.map +1 -1
  237. package/components/tree/tree-item.d.ts +6 -6
  238. package/components/tree/tree-item.js.map +1 -1
  239. package/components/tree/tree.navigation.d.ts +5 -6
  240. package/components/tree/tree.navigation.js.map +1 -1
  241. package/components/tree/tree.selection.js.map +1 -1
  242. package/components/types.d.ts +1 -1
  243. package/components/types.js.map +1 -1
  244. package/components/validation-container/validation-container.js +2 -1
  245. package/components/validation-container/validation-container.js.map +1 -1
  246. package/components/virtualization/engine.d.ts +40 -9
  247. package/components/virtualization/engine.js +126 -61
  248. package/components/virtualization/engine.js.map +1 -1
  249. package/components/virtualization/recycle.d.ts +13 -0
  250. package/components/virtualization/recycle.js +152 -0
  251. package/components/virtualization/recycle.js.map +1 -0
  252. package/components/virtualization/virtualization.d.ts +84 -65
  253. package/components/virtualization/virtualization.js +20 -16
  254. package/components/virtualization/virtualization.js.map +1 -1
  255. package/custom-elements.json +18455 -19551
  256. package/igniteui-webcomponents.css-data.json +2 -2
  257. package/igniteui-webcomponents.html-data.json +1 -1
  258. package/index.d.ts +3 -1
  259. package/index.js +2 -0
  260. package/index.js.map +1 -1
  261. package/internals/abort-handler.d.ts +13 -25
  262. package/internals/abort-handler.js +4 -6
  263. package/internals/abort-handler.js.map +1 -1
  264. package/internals/context.d.ts +13 -7
  265. package/internals/context.js +2 -1
  266. package/internals/context.js.map +1 -1
  267. package/internals/controllers/adopt-styles.d.ts +19 -20
  268. package/internals/controllers/adopt-styles.js +3 -8
  269. package/internals/controllers/adopt-styles.js.map +1 -1
  270. package/internals/controllers/aria-projection.d.ts +100 -61
  271. package/internals/controllers/aria-projection.js +81 -31
  272. package/internals/controllers/aria-projection.js.map +1 -1
  273. package/internals/controllers/async-consumer.js.map +1 -1
  274. package/internals/controllers/command.d.ts +15 -30
  275. package/internals/controllers/command.js +2 -7
  276. package/internals/controllers/command.js.map +1 -1
  277. package/internals/controllers/context-provider.d.ts +7 -13
  278. package/internals/controllers/context-provider.js.map +1 -1
  279. package/internals/controllers/focus-ring.d.ts +10 -30
  280. package/internals/controllers/focus-ring.js +6 -12
  281. package/internals/controllers/focus-ring.js.map +1 -1
  282. package/internals/controllers/fullscreen.d.ts +7 -23
  283. package/internals/controllers/fullscreen.js +3 -9
  284. package/internals/controllers/fullscreen.js.map +1 -1
  285. package/internals/controllers/gestures.d.ts +10 -29
  286. package/internals/controllers/gestures.js +1 -3
  287. package/internals/controllers/gestures.js.map +1 -1
  288. package/internals/controllers/group.d.ts +13 -30
  289. package/internals/controllers/group.js.map +1 -1
  290. package/internals/controllers/host-listeners.d.ts +28 -0
  291. package/internals/controllers/host-listeners.js +27 -0
  292. package/internals/controllers/host-listeners.js.map +1 -0
  293. package/internals/controllers/id-resolver.d.ts +8 -9
  294. package/internals/controllers/id-resolver.js +6 -14
  295. package/internals/controllers/id-resolver.js.map +1 -1
  296. package/internals/controllers/internals.d.ts +53 -104
  297. package/internals/controllers/internals.js +40 -13
  298. package/internals/controllers/internals.js.map +1 -1
  299. package/internals/controllers/key-bindings.d.ts +61 -158
  300. package/internals/controllers/key-bindings.js +68 -67
  301. package/internals/controllers/key-bindings.js.map +1 -1
  302. package/internals/controllers/keys.d.ts +32 -0
  303. package/internals/controllers/keys.js +20 -0
  304. package/internals/controllers/keys.js.map +1 -0
  305. package/internals/controllers/mutation-observer.d.ts +14 -37
  306. package/internals/controllers/mutation-observer.js +1 -1
  307. package/internals/controllers/mutation-observer.js.map +1 -1
  308. package/internals/controllers/resize-observer.d.ts +9 -19
  309. package/internals/controllers/resize-observer.js.map +1 -1
  310. package/internals/controllers/root-click.d.ts +11 -42
  311. package/internals/controllers/root-click.js +4 -6
  312. package/internals/controllers/root-click.js.map +1 -1
  313. package/internals/controllers/roving-focus.d.ts +16 -35
  314. package/internals/controllers/roving-focus.js.map +1 -1
  315. package/internals/controllers/slot.d.ts +25 -54
  316. package/internals/controllers/slot.js +6 -6
  317. package/internals/controllers/slot.js.map +1 -1
  318. package/internals/controllers/toggle.d.ts +44 -48
  319. package/internals/controllers/toggle.js.map +1 -1
  320. package/internals/date/compare.js.map +1 -1
  321. package/internals/date/converters.d.ts +10 -7
  322. package/internals/date/converters.js.map +1 -1
  323. package/internals/date/model.d.ts +9 -16
  324. package/internals/date/model.js +22 -25
  325. package/internals/date/model.js.map +1 -1
  326. package/internals/decorators/blazorAdditionalDependencies.d.ts +4 -2
  327. package/internals/decorators/blazorAdditionalDependencies.js.map +1 -1
  328. package/internals/decorators/blazorDeepImport.d.ts +1 -3
  329. package/internals/decorators/blazorDeepImport.js.map +1 -1
  330. package/internals/decorators/blazorInclude.d.ts +3 -2
  331. package/internals/decorators/blazorInclude.js.map +1 -1
  332. package/internals/decorators/blazorIndirectRender.d.ts +1 -3
  333. package/internals/decorators/blazorIndirectRender.js.map +1 -1
  334. package/internals/decorators/blazorSuppressComponent.d.ts +1 -3
  335. package/internals/decorators/blazorSuppressComponent.js.map +1 -1
  336. package/internals/decorators/coerced-property.d.ts +14 -20
  337. package/internals/decorators/coerced-property.js.map +1 -1
  338. package/internals/decorators/shadow-options.d.ts +2 -5
  339. package/internals/decorators/shadow-options.js.map +1 -1
  340. package/internals/definitions/defineAllComponents.js +2 -0
  341. package/internals/definitions/defineAllComponents.js.map +1 -1
  342. package/internals/directives/drag.d.ts +51 -81
  343. package/internals/directives/drag.js +27 -89
  344. package/internals/directives/drag.js.map +1 -1
  345. package/internals/directives/pointer-operation.d.ts +75 -0
  346. package/internals/directives/pointer-operation.js +92 -0
  347. package/internals/directives/pointer-operation.js.map +1 -0
  348. package/internals/directives/resize.d.ts +36 -64
  349. package/internals/directives/resize.js +18 -85
  350. package/internals/directives/resize.js.map +1 -1
  351. package/internals/i18n/EN/calendar.resources.d.ts +8 -2
  352. package/internals/i18n/EN/calendar.resources.js +2 -2
  353. package/internals/i18n/EN/calendar.resources.js.map +1 -1
  354. package/internals/i18n/EN/chat.resources.d.ts +8 -2
  355. package/internals/i18n/EN/chat.resources.js +3 -10
  356. package/internals/i18n/EN/chat.resources.js.map +1 -1
  357. package/internals/i18n/EN/date-picker.resources.d.ts +6 -4
  358. package/internals/i18n/EN/date-picker.resources.js +1 -7
  359. package/internals/i18n/EN/date-picker.resources.js.map +1 -1
  360. package/internals/i18n/EN/date-range-picker.resources.d.ts +9 -2
  361. package/internals/i18n/EN/date-range-picker.resources.js +2 -2
  362. package/internals/i18n/EN/date-range-picker.resources.js.map +1 -1
  363. package/internals/i18n/i18n-controller.d.ts +44 -46
  364. package/internals/i18n/i18n-controller.js +46 -33
  365. package/internals/i18n/i18n-controller.js.map +1 -1
  366. package/internals/i18n/utils.d.ts +9 -4
  367. package/internals/i18n/utils.js +4 -27
  368. package/internals/i18n/utils.js.map +1 -1
  369. package/internals/mixins/alert.d.ts +10 -25
  370. package/internals/mixins/alert.js.map +1 -1
  371. package/internals/mixins/combo-box.d.ts +21 -11
  372. package/internals/mixins/combo-box.js +16 -22
  373. package/internals/mixins/combo-box.js.map +1 -1
  374. package/internals/mixins/event-emitter.js +9 -11
  375. package/internals/mixins/event-emitter.js.map +1 -1
  376. package/internals/mixins/forms/associated-required.d.ts +4 -4
  377. package/internals/mixins/forms/associated-required.js.map +1 -1
  378. package/internals/mixins/forms/associated.d.ts +4 -2
  379. package/internals/mixins/forms/associated.js +42 -19
  380. package/internals/mixins/forms/associated.js.map +1 -1
  381. package/internals/mixins/forms/form-transformers.js.map +1 -1
  382. package/internals/mixins/forms/types.d.ts +27 -78
  383. package/internals/mixins/forms/types.js.map +1 -1
  384. package/internals/mixins/group.d.ts +18 -0
  385. package/internals/mixins/group.js +37 -0
  386. package/internals/mixins/group.js.map +1 -0
  387. package/internals/mixins/i18n.d.ts +10 -16
  388. package/internals/mixins/i18n.js.map +1 -1
  389. package/internals/mixins/mask-behavior.d.ts +8 -22
  390. package/internals/mixins/mask-behavior.js +1 -2
  391. package/internals/mixins/mask-behavior.js.map +1 -1
  392. package/internals/mixins/option.d.ts +1 -2
  393. package/internals/mixins/option.js +2 -1
  394. package/internals/mixins/option.js.map +1 -1
  395. package/internals/part-map.d.ts +4 -2
  396. package/internals/part-map.js +1 -1
  397. package/internals/part-map.js.map +1 -1
  398. package/internals/templates/input-shell.d.ts +8 -17
  399. package/internals/templates/input-shell.js +4 -1
  400. package/internals/templates/input-shell.js.map +1 -1
  401. package/internals/templates/masked-input.d.ts +7 -8
  402. package/internals/templates/masked-input.js.map +1 -1
  403. package/internals/templates/slotted-icon.d.ts +7 -12
  404. package/internals/templates/slotted-icon.js.map +1 -1
  405. package/internals/templates/toggle-shell.d.ts +19 -19
  406. package/internals/templates/toggle-shell.js +12 -8
  407. package/internals/templates/toggle-shell.js.map +1 -1
  408. package/internals/timing.d.ts +5 -14
  409. package/internals/timing.js.map +1 -1
  410. package/internals/utils/arrays.d.ts +21 -21
  411. package/internals/utils/arrays.js +14 -0
  412. package/internals/utils/arrays.js.map +1 -1
  413. package/internals/utils/dom.d.ts +53 -41
  414. package/internals/utils/dom.js +3 -4
  415. package/internals/utils/dom.js.map +1 -1
  416. package/internals/utils/events.d.ts +29 -16
  417. package/internals/utils/events.js +9 -1
  418. package/internals/utils/events.js.map +1 -1
  419. package/internals/utils/lit.d.ts +5 -2
  420. package/internals/utils/lit.js.map +1 -1
  421. package/internals/utils/math.d.ts +8 -6
  422. package/internals/utils/math.js.map +1 -1
  423. package/internals/utils/objects.d.ts +3 -20
  424. package/internals/utils/objects.js +1 -39
  425. package/internals/utils/objects.js.map +1 -1
  426. package/internals/utils/strings.d.ts +9 -11
  427. package/internals/utils/strings.js.map +1 -1
  428. package/internals/utils/types.d.ts +16 -3
  429. package/internals/utils/types.js +3 -0
  430. package/internals/utils/types.js.map +1 -1
  431. package/internals/validators.d.ts +9 -8
  432. package/internals/validators.js +12 -6
  433. package/internals/validators.js.map +1 -1
  434. package/package.json +1 -1
  435. package/skills/README.md +4 -3
  436. package/skills/igniteui-wc-choose-components/SKILL.md +2 -1
  437. package/skills/igniteui-wc-customize-component-theme/SKILL.md +2 -1
  438. package/skills/igniteui-wc-figma-to-app/SKILL.md +328 -0
  439. package/skills/igniteui-wc-figma-to-app/references/asset-extraction.md +343 -0
  440. package/skills/igniteui-wc-figma-to-app/references/design-provenance.md +199 -0
  441. package/skills/igniteui-wc-figma-to-app/references/design-token-bridge.md +489 -0
  442. package/skills/igniteui-wc-figma-to-app/references/figma-component-map.md +370 -0
  443. package/skills/igniteui-wc-figma-to-app/references/figma-exploration.md +222 -0
  444. package/skills/igniteui-wc-figma-to-app/references/mcp-setup.md +363 -0
  445. package/skills/igniteui-wc-figma-to-app/references/project-setup.md +105 -0
  446. package/skills/igniteui-wc-figma-to-app/references/theme-generation.md +180 -0
  447. package/skills/igniteui-wc-figma-to-app/references/validation-patterns.md +370 -0
  448. package/skills/igniteui-wc-generate-from-image-design/SKILL.md +2 -1
  449. package/skills/igniteui-wc-generate-from-image-design/references/gotchas.md +3 -3
  450. package/skills/igniteui-wc-grids/SKILL.md +133 -0
  451. package/skills/igniteui-wc-integrate-with-framework/SKILL.md +2 -1
  452. package/skills/igniteui-wc-migrate-grid-lite-to-premium/SKILL.md +2 -1
  453. package/skills/igniteui-wc-optimize-bundle-size/SKILL.md +2 -1
  454. package/theming/config.d.ts +14 -5
  455. package/theming/config.js +38 -18
  456. package/theming/config.js.map +1 -1
  457. package/theming/context.d.ts +1 -23
  458. package/theming/context.js.map +1 -1
  459. package/theming/theming-controller.d.ts +2 -32
  460. package/theming/theming-controller.js +15 -21
  461. package/theming/theming-controller.js.map +1 -1
  462. package/theming/theming-event.d.ts +0 -7
  463. package/theming/theming-event.js +0 -13
  464. package/theming/theming-event.js.map +1 -1
  465. package/theming/types.d.ts +1 -8
  466. package/theming/types.js.map +1 -1
  467. package/web-types.json +3 -3
  468. package/animations/presets/slide/index.d.ts +0 -3
  469. package/animations/presets/slide/index.js +0 -16
  470. package/animations/presets/slide/index.js.map +0 -1
  471. package/components/resize-container/themes/resize-container.base.css.js.map +0 -1
  472. package/internals/controllers/root-scroll.d.ts +0 -31
  473. package/internals/controllers/root-scroll.js +0 -71
  474. package/internals/controllers/root-scroll.js.map +0 -1
  475. package/theming/utils.d.ts +0 -11
  476. package/theming/utils.js +0 -20
  477. package/theming/utils.js.map +0 -1
  478. /package/components/{resize-container/themes/resize-container.base.css.d.ts → breadcrumb/themes/breadcrumb.base.css.d.ts} +0 -0
@@ -16,11 +16,6 @@ import { IgcProgressBaseComponent } from './base.js';
16
16
  * @csspart label - The circular progress label.
17
17
  * @csspart value - The circular progress label value.
18
18
  * @csspart indeterminate - The circular progress indeterminate state.
19
- * @csspart primary - The circular progress primary state.
20
- * @csspart danger - The circular progress error state.
21
- * @csspart warning - The circular progress warning state.
22
- * @csspart info - The circular progress info state.
23
- * @csspart success - The circular progress success state.
24
19
  */
25
20
  export default class IgcCircularProgressComponent extends IgcProgressBaseComponent {
26
21
  static readonly tagName = "igc-circular-progress";
@@ -1 +1 @@
1
- {"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["../../../src/components/progress/circular-progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,4BAA4B,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,iDAAiD,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,0DAA0D,CAAC;AAC5F,OAAO,EAAE,GAAG,EAAE,MAAM,6BAA6B,CAAC;AAElD,MAAM,MAAM,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;AAyBtD,MAAM,CAAC,OAAO,OAAO,4BAA6B,SAAQ,wBAAwB;aACzD,YAAO,GAAG,uBAAuB,AAA1B,CAA2B;aAClC,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CACf,4BAA4B,EAC5B,4BAA4B,CAC7B,CAAC;IACJ,CAAC;IAOD;QACE,KAAK,EAAE,CAAC;QANO,gBAAW,GAAG,MAAM,EAAE,CAAC;QACZ,WAAM,GAAG,iBAAiB,CAAC,IAAI,EAAE;YAC3D,KAAK,EAAE,QAAQ,CAAC,UAAU,CAAC;SAC5B,CAAC,CAAC;QAID,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAES,UAAU;QAClB,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,UAAU,CAAC;YAC3D,CAAC,CAAC,IAAI,CAAC,MAAM;iBACR,mBAAmB,CAA+B,UAAU,EAAE;gBAC7D,QAAQ,EAAE,4BAA4B,CAAC,OAAO;aAC/C,CAAC;iBACD,GAAG,CACF,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAC7B,GAAG,CAAA,gBAAgB,MAAM,eAAe,KAAK,iBAAiB,OAAO,IAAI,CAC5E;YACL,CAAC,CAAC,GAAG,CAAA;;;OAGJ,CAAC;QAEJ,OAAO,GAAG,CAAA;qBACO,OAAO,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC;sBAC1D,QAAQ,CAAC,EAAE,MAAM,EAAE,QAAQ,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;;;+BAGxC,IAAI,CAAC,WAAW;YACnC,SAAS;;;KAGhB,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;+BACgB,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC;oBACpC,OAAO,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC;YACjE,IAAI,CAAC,UAAU,EAAE;;;UAGnB,IAAI,CAAC,kBAAkB,EAAE;;KAE9B,CAAC;IACJ,CAAC","sourcesContent":["import { html, svg } from 'lit';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { partMap } from '#internals/part-map.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport { IgcProgressBaseComponent } from './base.js';\nimport IgcCircularGradientComponent from './circular-gradient.js';\nimport { styles } from './themes/circular/circular.progress.base.css.js';\nimport { styles as shared } from './themes/circular/shared/circular.progress.common.css.js';\nimport { all } from './themes/circular/themes.js';\n\nconst nextId = createIdGenerator('circular-progress');\n\n/**\n * A circular progress indicator used to express unspecified wait time or display\n * the length of a process.\n *\n * @element igc-circular-progress\n *\n * @slot - The text area container.\n * @slot gradient - Customize the progress bar in order to use a color gradient instead of a solid color. Accepts circular gradient elements.\n *\n * @csspart svg - The circular progress SVG element.\n * @csspart gradient_start - The circular progress linear-gradient start color.\n * @csspart gradient_end - The circular progress linear-gradient end color.\n * @csspart track - The circular progress ring track area.\n * @csspart fill - The circular progress indicator area.\n * @csspart label - The circular progress label.\n * @csspart value - The circular progress label value.\n * @csspart indeterminate - The circular progress indeterminate state.\n * @csspart primary - The circular progress primary state.\n * @csspart danger - The circular progress error state.\n * @csspart warning - The circular progress warning state.\n * @csspart info - The circular progress info state.\n * @csspart success - The circular progress success state.\n */\nexport default class IgcCircularProgressComponent extends IgcProgressBaseComponent {\n public static readonly tagName = 'igc-circular-progress';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(\n IgcCircularProgressComponent,\n IgcCircularGradientComponent\n );\n }\n\n private readonly _gradientId = nextId();\n protected override readonly _slots = addSlotController(this, {\n slots: setSlots('gradient'),\n });\n\n constructor() {\n super();\n addThemingController(this, all);\n }\n\n protected _renderSvg() {\n const gradients = this._slots.hasAssignedElements('gradient')\n ? this._slots\n .getAssignedElements<IgcCircularGradientComponent>('gradient', {\n selector: IgcCircularGradientComponent.tagName,\n })\n .map(\n ({ offset, color, opacity }) =>\n svg`<stop offset=${offset} stop-color=${color} stop-opacity=${opacity}/>`\n )\n : svg`\n <stop offset=\"0%\" part=\"gradient_start\" />\n <stop offset=\"100%\" part=\"gradient_end\" />\n `;\n\n return svg`\n <circle part=${partMap({ track: true, indeterminate: this.indeterminate })}/>\n <circle style=${styleMap({ stroke: `url(#${this._gradientId})` })} part=\"fill\"/>\n\n <defs>\n <linearGradient id=${this._gradientId} gradientTransform=\"rotate(90)\">\n ${gradients}\n </linearGradient>\n </defs>\n `;\n }\n\n protected override render() {\n return html`\n <div part=\"base\" style=${styleMap(this._styleInfo)}>\n <svg part=${partMap({ svg: true, indeterminate: this.indeterminate })}>\n ${this._renderSvg()}\n </svg>\n <slot name=\"gradient\"></slot>\n ${this._renderDefaultSlot()}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-circular-progress': IgcCircularProgressComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["../../../src/components/progress/circular-progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAE,wBAAwB,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,4BAA4B,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,iDAAiD,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,0DAA0D,CAAC;AAC5F,OAAO,EAAE,GAAG,EAAE,MAAM,6BAA6B,CAAC;AAElD,MAAM,MAAM,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;AAoBtD,MAAM,CAAC,OAAO,OAAO,4BAA6B,SAAQ,wBAAwB;aACzD,YAAO,GAAG,uBAAuB,AAA1B,CAA2B;aAClC,WAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnB,CAAoB;IAG1C,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CACf,4BAA4B,EAC5B,4BAA4B,CAC7B,CAAC;IACJ,CAAC;IAOD;QACE,KAAK,EAAE,CAAC;QANO,gBAAW,GAAG,MAAM,EAAE,CAAC;QACZ,WAAM,GAAG,iBAAiB,CAAC,IAAI,EAAE;YAC3D,KAAK,EAAE,QAAQ,CAAC,UAAU,CAAC;SAC5B,CAAC,CAAC;QAID,oBAAoB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClC,CAAC;IAES,UAAU;QAClB,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,UAAU,CAAC;YAC3D,CAAC,CAAC,IAAI,CAAC,MAAM;iBACR,mBAAmB,CAA+B,UAAU,EAAE;gBAC7D,QAAQ,EAAE,4BAA4B,CAAC,OAAO;aAC/C,CAAC;iBACD,GAAG,CACF,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAC7B,GAAG,CAAA,gBAAgB,MAAM,eAAe,KAAK,iBAAiB,OAAO,IAAI,CAC5E;YACL,CAAC,CAAC,GAAG,CAAA;;;OAGJ,CAAC;QAEJ,OAAO,GAAG,CAAA;qBACO,OAAO,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC;sBAC1D,QAAQ,CAAC,EAAE,MAAM,EAAE,QAAQ,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;;;+BAGxC,IAAI,CAAC,WAAW;YACnC,SAAS;;;KAGhB,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;+BACgB,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC;oBACpC,OAAO,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC;YACjE,IAAI,CAAC,UAAU,EAAE;;;UAGnB,IAAI,CAAC,kBAAkB,EAAE;;KAE9B,CAAC;IACJ,CAAC","sourcesContent":["import { html, svg } from 'lit';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { partMap } from '#internals/part-map.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport { IgcProgressBaseComponent } from './base.js';\nimport IgcCircularGradientComponent from './circular-gradient.js';\nimport { styles } from './themes/circular/circular.progress.base.css.js';\nimport { styles as shared } from './themes/circular/shared/circular.progress.common.css.js';\nimport { all } from './themes/circular/themes.js';\n\nconst nextId = createIdGenerator('circular-progress');\n\n/**\n * A circular progress indicator used to express unspecified wait time or display\n * the length of a process.\n *\n * @element igc-circular-progress\n *\n * @slot - The text area container.\n * @slot gradient - Customize the progress bar in order to use a color gradient instead of a solid color. Accepts circular gradient elements.\n *\n * @csspart svg - The circular progress SVG element.\n * @csspart gradient_start - The circular progress linear-gradient start color.\n * @csspart gradient_end - The circular progress linear-gradient end color.\n * @csspart track - The circular progress ring track area.\n * @csspart fill - The circular progress indicator area.\n * @csspart label - The circular progress label.\n * @csspart value - The circular progress label value.\n * @csspart indeterminate - The circular progress indeterminate state.\n */\nexport default class IgcCircularProgressComponent extends IgcProgressBaseComponent {\n public static readonly tagName = 'igc-circular-progress';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(\n IgcCircularProgressComponent,\n IgcCircularGradientComponent\n );\n }\n\n private readonly _gradientId = nextId();\n protected override readonly _slots = addSlotController(this, {\n slots: setSlots('gradient'),\n });\n\n constructor() {\n super();\n addThemingController(this, all);\n }\n\n protected _renderSvg() {\n const gradients = this._slots.hasAssignedElements('gradient')\n ? this._slots\n .getAssignedElements<IgcCircularGradientComponent>('gradient', {\n selector: IgcCircularGradientComponent.tagName,\n })\n .map(\n ({ offset, color, opacity }) =>\n svg`<stop offset=${offset} stop-color=${color} stop-opacity=${opacity}/>`\n )\n : svg`\n <stop offset=\"0%\" part=\"gradient_start\" />\n <stop offset=\"100%\" part=\"gradient_end\" />\n `;\n\n return svg`\n <circle part=${partMap({ track: true, indeterminate: this.indeterminate })}/>\n <circle style=${styleMap({ stroke: `url(#${this._gradientId})` })} part=\"fill\"/>\n\n <defs>\n <linearGradient id=${this._gradientId} gradientTransform=\"rotate(90)\">\n ${gradients}\n </linearGradient>\n </defs>\n `;\n }\n\n protected override render() {\n return html`\n <div part=\"base\" style=${styleMap(this._styleInfo)}>\n <svg part=${partMap({ svg: true, indeterminate: this.indeterminate })}>\n ${this._renderSvg()}\n </svg>\n <slot name=\"gradient\"></slot>\n ${this._renderDefaultSlot()}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-circular-progress': IgcCircularProgressComponent;\n }\n}\n"]}
@@ -152,7 +152,7 @@ export default class IgcQrCodeComponent extends LitElement {
152
152
  * is not a positive finite number, or when the resulting image exceeds the maximum canvas size.
153
153
  */
154
154
  toImage(options?: QrCodeExportOptions): Promise<File>;
155
- protected render(): typeof nothing | import("lit-html").TemplateResult<1>;
155
+ protected render(): import("lit-html").TemplateResult<1> | typeof nothing;
156
156
  }
157
157
  declare global {
158
158
  interface HTMLElementTagNameMap {
@@ -49,12 +49,12 @@ export default class IgcRadioComponent extends IgcRadioComponent_base {
49
49
  private _tabIndex;
50
50
  /** All radios of the group, that is having the same name property, in DOM order. */
51
51
  private get _radios();
52
- /** All radios of the group except the one that invokes the getter. */
53
- private get _siblings();
54
52
  /** All radios of the group that are not disabled. */
55
53
  private get _activeRadios();
56
- /** All radios of the group that are checked. */
57
- private get _checkedRadios();
54
+ /** All radios of the group except this one. Yields, so it copies nothing. */
55
+ private _siblings;
56
+ /** Whether this radio is the last checked one of its group. */
57
+ private _isLastChecked;
58
58
  set required(value: boolean);
59
59
  get required(): boolean;
60
60
  /**
@@ -78,6 +78,8 @@ export default class IgcRadioComponent extends IgcRadioComponent_base {
78
78
  protected willUpdate(properties: PropertyValues<this>): void;
79
79
  protected firstUpdated(): Promise<void>;
80
80
  protected _handleSlotChange(): void;
81
+ /** Focuses and checks the radio, as a native radio label does. */
82
+ protected _handleLabelActivation(): void;
81
83
  protected _setDefaultValue(current: string | null): void;
82
84
  /**
83
85
  * Restores the default state without the `checked` setter. That setter unchecks all
@@ -6,6 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { html, LitElement } from 'lit';
8
8
  import { property, query, state } from 'lit/decorators.js';
9
+ import { helperText } from '#internals/controllers/aria-projection.js';
9
10
  import { addKeyboardFocusRing } from '#internals/controllers/focus-ring.js';
10
11
  import { addRovingFocusController } from '#internals/controllers/roving-focus.js';
11
12
  import { addSlotController, setSlots } from '#internals/controllers/slot.js';
@@ -16,7 +17,6 @@ import { FormValueBooleanTransformers } from '#internals/mixins/forms/form-trans
16
17
  import { createFormValueState } from '#internals/mixins/forms/form-value.js';
17
18
  import { partMap } from '#internals/part-map.js';
18
19
  import { renderToggleShell } from '#internals/templates/toggle-shell.js';
19
- import { lastOf } from '#internals/utils/arrays.js';
20
20
  import { createIdGenerator } from '#internals/utils/strings.js';
21
21
  import { isString } from '#internals/utils/types.js';
22
22
  import { addThemingController } from '#theming/theming-controller.js';
@@ -39,19 +39,23 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
39
39
  get _radios() {
40
40
  return getGroupMembers(this);
41
41
  }
42
- get _siblings() {
43
- return this._radios.filter((radio) => radio !== this);
44
- }
45
42
  get _activeRadios() {
46
43
  return this._radios.filter((radio) => !radio.disabled);
47
44
  }
48
- get _checkedRadios() {
49
- return this._radios.filter((radio) => radio.checked);
45
+ *_siblings() {
46
+ for (const radio of this._radios) {
47
+ if (radio !== this) {
48
+ yield radio;
49
+ }
50
+ }
51
+ }
52
+ _isLastChecked() {
53
+ return this._radios.findLast((radio) => radio.checked) === this;
50
54
  }
51
55
  set required(value) {
52
56
  super.required = value;
53
57
  if (this.hasUpdated) {
54
- for (const radio of this._siblings) {
58
+ for (const radio of this._siblings()) {
55
59
  radio._validate();
56
60
  }
57
61
  }
@@ -123,8 +127,8 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
123
127
  }
124
128
  async firstUpdated() {
125
129
  await this.updateComplete;
126
- if (this.checked && this === lastOf(this._checkedRadios)) {
127
- for (const radio of this._siblings) {
130
+ if (this.checked && this._isLastChecked()) {
131
+ for (const radio of this._siblings()) {
128
132
  radio.checked = false;
129
133
  radio.defaultChecked = false;
130
134
  }
@@ -136,9 +140,13 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
136
140
  _handleSlotChange() {
137
141
  this._hideLabel = !this._slots.hasAssignedNodes('[default]', true);
138
142
  }
143
+ _handleLabelActivation() {
144
+ this._input.focus();
145
+ this._input.click();
146
+ }
139
147
  _setDefaultValue(current) {
140
148
  this._formValue.defaultValue = isString(current);
141
- for (const radio of this._siblings) {
149
+ for (const radio of this._siblings()) {
142
150
  radio.defaultChecked = false;
143
151
  }
144
152
  }
@@ -163,13 +171,13 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
163
171
  return super.reportValidity();
164
172
  }
165
173
  checkValidity() {
166
- for (const radio of this._siblings) {
174
+ for (const radio of this._siblings()) {
167
175
  radio._checkValidity();
168
176
  }
169
177
  return this._checkValidity();
170
178
  }
171
179
  reportValidity() {
172
- for (const radio of this._siblings) {
180
+ for (const radio of this._siblings()) {
173
181
  radio._reportValidity();
174
182
  }
175
183
  return this._reportValidity();
@@ -181,7 +189,7 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
181
189
  }
182
190
  }
183
191
  _updateCheckedState() {
184
- for (const radio of this._siblings) {
192
+ for (const radio of this._siblings()) {
185
193
  radio.checked = false;
186
194
  }
187
195
  }
@@ -218,10 +226,9 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
218
226
  });
219
227
  }
220
228
  render() {
221
- const labelledBy = this.getAttribute('aria-labelledby');
222
229
  const checked = this.checked;
223
230
  return html `
224
- ${renderToggleShell({
231
+ ${renderToggleShell(this, {
225
232
  type: 'radio',
226
233
  inputId: this._inputId,
227
234
  labelId: this._labelId,
@@ -238,21 +245,13 @@ export default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMix
238
245
  ?hidden=${this.disabled}
239
246
  ></span>
240
247
  `,
241
- checked,
242
248
  hideLabel: this._hideLabel,
243
- name: this.name,
244
- value: this.value,
245
- required: this.required,
246
- disabled: this.disabled,
247
249
  tabindex: this._tabIndex,
248
- ariaLabelledBy: labelledBy ? labelledBy : this._labelId,
249
- ariaDescribedBy: this._slots.hasAssignedElements('helper-text')
250
- ? 'helper-text'
251
- : undefined,
250
+ describedBy: helperText(this, this._slots)?.id,
252
251
  onClick: this._handleClick,
253
252
  onKeyDown: this._handleEnterKeydown,
254
253
  })}
255
- ${this._renderValidationContainer()}
254
+ ${IgcValidationContainerComponent.create(this)}
256
255
  `;
257
256
  }
258
257
  }
@@ -1 +1 @@
1
- {"version":3,"file":"radio.js","sourceRoot":"","sources":["../../../src/components/radio/radio.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, type PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { addKeyboardFocusRing } from '#internals/controllers/focus-ring.js';\nimport { addRovingFocusController } from '#internals/controllers/roving-focus.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedCheckboxRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport { FormValueBooleanTransformers } from '#internals/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { partMap } from '#internals/part-map.js';\nimport { renderToggleShell } from '#internals/templates/toggle-shell.js';\nimport { lastOf } from '#internals/utils/arrays.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { isString } from '#internals/utils/types.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type { ToggleLabelPosition } from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { addRadioGroupController, getGroupMembers } from './controller.js';\nimport { styles } from './themes/radio.base.css.js';\nimport { styles as shared } from './themes/shared/radio.common.css.js';\nimport { all } from './themes/themes.js';\nimport { radioValidators } from './validators.js';\n\nexport interface IgcRadioChangeEventArgs {\n checked: boolean;\n value?: string;\n}\n\nexport interface IgcRadioComponentEventMap {\n igcChange: CustomEvent<IgcRadioChangeEventArgs>;\n // For analyzer meta only:\n /* skipWCPrefix */\n focus: FocusEvent;\n /* skipWCPrefix */\n blur: FocusEvent;\n}\n\nconst nextId = createIdGenerator('radio');\n\n/**\n * The radio component allows the user to select a single option from an available set of options that are listed side by side.\n *\n * @element igc-radio\n *\n * @slot - The radio label.\n * @slot helper-text - Renders content below the input.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n *\n * @csspart base - The radio control base wrapper.\n * @csspart control - The radio input control.\n * @csspart label - The radio control label.\n */\nexport default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMixin(\n EventEmitterMixin<IgcRadioComponentEventMap, Constructor<LitElement>>(\n LitElement\n )\n) {\n public static readonly tagName = 'igc-radio';\n protected static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcRadioComponent, IgcValidationContainerComponent);\n }\n\n protected override get __validators() {\n return radioValidators;\n }\n\n private readonly _inputId = nextId();\n private readonly _labelId = `radio-label-${this._inputId}`;\n private readonly _focusRingManager = addKeyboardFocusRing(this);\n\n /**\n * Keeps the roving tab index of the group. The checked radio is the only tab\n * stop. If the group has no selection, each radio is a tab stop.\n */\n private readonly _group = addRadioGroupController(this, (hasCheckedRadio) => {\n this._tabIndex = !hasCheckedRadio || this.checked ? 0 : -1;\n });\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots('helper-text', 'value-missing', 'custom-error', 'invalid'),\n onChange: this._handleSlotChange,\n });\n\n protected override readonly _formValue = createFormValueState(this, {\n initialValue: false,\n transformers: FormValueBooleanTransformers,\n });\n\n protected _value!: string;\n\n @query('input', true)\n protected readonly _input!: HTMLInputElement;\n\n @state()\n protected _hideLabel = true;\n\n @state()\n private _tabIndex = 0;\n\n /** All radios of the group, that is having the same name property, in DOM order. */\n private get _radios(): IgcRadioComponent[] {\n return getGroupMembers(this);\n }\n\n /** All radios of the group except the one that invokes the getter. */\n private get _siblings(): IgcRadioComponent[] {\n return this._radios.filter((radio) => radio !== this);\n }\n\n /** All radios of the group that are not disabled. */\n private get _activeRadios(): IgcRadioComponent[] {\n return this._radios.filter((radio) => !radio.disabled);\n }\n\n /** All radios of the group that are checked. */\n private get _checkedRadios(): IgcRadioComponent[] {\n return this._radios.filter((radio) => radio.checked);\n }\n\n @property({ type: Boolean, reflect: true })\n public override set required(value: boolean) {\n super.required = value;\n\n if (this.hasUpdated) {\n for (const radio of this._siblings) {\n radio._validate();\n }\n }\n }\n\n public override get required(): boolean {\n return this._required;\n }\n\n /**\n * The value of the control.\n * @attr\n */\n @property()\n public set value(value: string) {\n this._value = value;\n if (this.checked) {\n this._formValue.setValueAndFormState(this.checked);\n }\n }\n\n public get value(): string {\n return this._value;\n }\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail.checked\", false) */\n /**\n * The checked state of the control.\n * @attr\n */\n @property({ type: Boolean })\n public set checked(value: boolean) {\n const previous = this.checked;\n\n this._formValue.setValueAndFormState(value);\n if (this.hasUpdated && this.checked) {\n this._updateCheckedState();\n }\n\n // The tab stop is a state of the group, so a change of the selection derives it\n // again. A write of the same state leaves the group as it is.\n if (this.checked !== previous) {\n this._group.sync();\n }\n }\n\n public get checked(): boolean {\n return this._formValue.value;\n }\n\n /**\n * The label position of the radio control.\n * @attr label-position\n */\n @property({ reflect: true, attribute: 'label-position' })\n public labelPosition: ToggleLabelPosition = 'after';\n\n constructor() {\n super();\n\n addThemingController(this, all);\n\n addRovingFocusController(this, {\n keybindings: {\n skip: () => this.disabled,\n bindingDefaults: { preventDefault: true, repeat: true },\n },\n vertical: true,\n homeEnd: false,\n items: () => this._activeRadios,\n current: () => this,\n focusItem: (radio) => this._navigate(radio),\n });\n }\n\n protected override willUpdate(properties: PropertyValues<this>): void {\n // The name is half of the identity of a group, so a new name moves this radio to another one.\n if (properties.has('name')) {\n this._group.updateMembership();\n }\n\n // The tab stop of the group depends on which of its radios are disabled.\n if (properties.has('disabled')) {\n this._group.sync();\n }\n }\n\n protected override async firstUpdated(): Promise<void> {\n await this.updateComplete;\n\n if (this.checked && this === lastOf(this._checkedRadios)) {\n for (const radio of this._siblings) {\n radio.checked = false;\n radio.defaultChecked = false;\n }\n } else {\n this._validate();\n }\n }\n\n protected _handleSlotChange(): void {\n this._hideLabel = !this._slots.hasAssignedNodes('[default]', true);\n }\n\n protected override _setDefaultValue(current: string | null): void {\n // The base mixin passes 'true' if the `checked` attribute is present, and null\n // if it is removed. `isDefined` would accept null as present and check the radio\n // again on a form reset.\n this._formValue.defaultValue = isString(current);\n for (const radio of this._siblings) {\n radio.defaultChecked = false;\n }\n }\n\n /**\n * Restores the default state without the `checked` setter. That setter unchecks all\n * siblings, which damages the state of the radios that the browser already reset in\n * the same `form.reset()` pass.\n */\n protected override _restoreDefaultValue(): void {\n const checked = this.checked;\n this._formValue.setValueAndFormState(this.defaultChecked);\n this.requestUpdate('checked', checked);\n }\n\n /** Simulates a click on the radio control. */\n public override click(): void {\n this._input.click();\n }\n\n /* alternateName: focusComponent */\n /** Sets focus on the radio control. */\n public override focus(options?: FocusOptions): void {\n this._input.focus(options);\n }\n\n /* alternateName: blurComponent */\n /** Removes focus from the radio control. */\n public override blur(): void {\n this._input.blur();\n }\n\n private _checkValidity(): boolean {\n return super.checkValidity();\n }\n\n private _reportValidity(): boolean {\n return super.reportValidity();\n }\n\n /** Checks for validity of the control and emits the invalid event if it's invalid. */\n public override checkValidity(): boolean {\n for (const radio of this._siblings) {\n radio._checkValidity();\n }\n\n return this._checkValidity();\n }\n\n /** Checks for validity of the control and shows the browser message if it's invalid. */\n public override reportValidity(): boolean {\n for (const radio of this._siblings) {\n radio._reportValidity();\n }\n\n return this._reportValidity();\n }\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public override setCustomValidity(message: string): void {\n for (const radio of this._radios) {\n radio._validate(message);\n radio.requestUpdate();\n }\n }\n\n private _updateCheckedState(): void {\n for (const radio of this._siblings) {\n radio.checked = false;\n }\n }\n\n protected override formResetCallback(): void {\n super.formResetCallback();\n this._group.sync();\n this.updateComplete.then(() => this._validate());\n }\n\n protected override formAssociatedCallback(form: HTMLFormElement): void {\n super.formAssociatedCallback(form);\n\n // The form owner is the other half, so a new one moves this radio as well.\n this._group.updateMembership();\n }\n\n protected _handleClick(event: PointerEvent) {\n event.stopPropagation();\n this._setTouchedState();\n\n if (this.checked) {\n return;\n }\n\n this.checked = true;\n this._input.focus();\n this.emitEvent('igcChange', {\n detail: {\n checked: this.checked,\n value: this.value,\n },\n });\n }\n\n protected _navigate(radio: IgcRadioComponent): void {\n this._setTouchedState();\n radio.focus();\n radio.checked = true;\n radio.emitEvent('igcChange', {\n detail: { checked: radio.checked, value: radio.value },\n });\n }\n\n protected override render() {\n const labelledBy = this.getAttribute('aria-labelledby');\n const checked = this.checked;\n\n return html`\n ${renderToggleShell({\n type: 'radio',\n inputId: this._inputId,\n labelId: this._labelId,\n baseParts: {\n base: true,\n checked,\n focused: this._focusRingManager.focused,\n },\n controlParts: { control: true, checked },\n labelParts: { label: true, checked },\n renderControl: () => html`\n <span\n part=${partMap({ ripple: true, checked })}\n ?hidden=${this.disabled}\n ></span>\n `,\n checked,\n hideLabel: this._hideLabel,\n name: this.name,\n value: this.value,\n required: this.required,\n disabled: this.disabled,\n tabindex: this._tabIndex,\n ariaLabelledBy: labelledBy ? labelledBy : this._labelId,\n ariaDescribedBy: this._slots.hasAssignedElements('helper-text')\n ? 'helper-text'\n : undefined,\n onClick: this._handleClick,\n onKeyDown: this._handleEnterKeydown,\n })}\n ${this._renderValidationContainer()}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio': IgcRadioComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"radio.js","sourceRoot":"","sources":["../../../src/components/radio/radio.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, type PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { helperText } from '#internals/controllers/aria-projection.js';\nimport { addKeyboardFocusRing } from '#internals/controllers/focus-ring.js';\nimport { addRovingFocusController } from '#internals/controllers/roving-focus.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { Constructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedCheckboxRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport { FormValueBooleanTransformers } from '#internals/mixins/forms/form-transformers.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { partMap } from '#internals/part-map.js';\nimport { renderToggleShell } from '#internals/templates/toggle-shell.js';\nimport { createIdGenerator } from '#internals/utils/strings.js';\nimport { isString } from '#internals/utils/types.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type { ToggleLabelPosition } from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport { addRadioGroupController, getGroupMembers } from './controller.js';\nimport { styles } from './themes/radio.base.css.js';\nimport { styles as shared } from './themes/shared/radio.common.css.js';\nimport { all } from './themes/themes.js';\nimport { radioValidators } from './validators.js';\n\nexport interface IgcRadioChangeEventArgs {\n checked: boolean;\n value?: string;\n}\n\nexport interface IgcRadioComponentEventMap {\n igcChange: CustomEvent<IgcRadioChangeEventArgs>;\n // For analyzer meta only:\n /* skipWCPrefix */\n focus: FocusEvent;\n /* skipWCPrefix */\n blur: FocusEvent;\n}\n\nconst nextId = createIdGenerator('radio');\n\n/**\n * The radio component allows the user to select a single option from an available set of options that are listed side by side.\n *\n * @element igc-radio\n *\n * @slot - The radio label.\n * @slot helper-text - Renders content below the input.\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n *\n * @csspart base - The radio control base wrapper.\n * @csspart control - The radio input control.\n * @csspart label - The radio control label.\n */\nexport default class IgcRadioComponent extends FormAssociatedCheckboxRequiredMixin(\n EventEmitterMixin<IgcRadioComponentEventMap, Constructor<LitElement>>(\n LitElement\n )\n) {\n public static readonly tagName = 'igc-radio';\n protected static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcRadioComponent, IgcValidationContainerComponent);\n }\n\n protected override get __validators() {\n return radioValidators;\n }\n\n private readonly _inputId = nextId();\n private readonly _labelId = `radio-label-${this._inputId}`;\n private readonly _focusRingManager = addKeyboardFocusRing(this);\n\n /**\n * Keeps the roving tab index of the group. The checked radio is the only tab\n * stop. If the group has no selection, each radio is a tab stop.\n */\n private readonly _group = addRadioGroupController(this, (hasCheckedRadio) => {\n this._tabIndex = !hasCheckedRadio || this.checked ? 0 : -1;\n });\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots('helper-text', 'value-missing', 'custom-error', 'invalid'),\n onChange: this._handleSlotChange,\n });\n\n protected override readonly _formValue = createFormValueState(this, {\n initialValue: false,\n transformers: FormValueBooleanTransformers,\n });\n\n protected _value!: string;\n\n @query('input', true)\n protected readonly _input!: HTMLInputElement;\n\n @state()\n protected _hideLabel = true;\n\n @state()\n private _tabIndex = 0;\n\n /** All radios of the group, that is having the same name property, in DOM order. */\n private get _radios(): IgcRadioComponent[] {\n return getGroupMembers(this);\n }\n\n /** All radios of the group that are not disabled. */\n private get _activeRadios(): IgcRadioComponent[] {\n return this._radios.filter((radio) => !radio.disabled);\n }\n\n /** All radios of the group except this one. Yields, so it copies nothing. */\n private *_siblings(): Generator<IgcRadioComponent> {\n for (const radio of this._radios) {\n if (radio !== this) {\n yield radio;\n }\n }\n }\n\n /** Whether this radio is the last checked one of its group. */\n private _isLastChecked(): boolean {\n return this._radios.findLast((radio) => radio.checked) === this;\n }\n\n @property({ type: Boolean, reflect: true })\n public override set required(value: boolean) {\n super.required = value;\n\n if (this.hasUpdated) {\n for (const radio of this._siblings()) {\n radio._validate();\n }\n }\n }\n\n public override get required(): boolean {\n return this._required;\n }\n\n /**\n * The value of the control.\n * @attr\n */\n @property()\n public set value(value: string) {\n this._value = value;\n if (this.checked) {\n this._formValue.setValueAndFormState(this.checked);\n }\n }\n\n public get value(): string {\n return this._value;\n }\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail.checked\", false) */\n /**\n * The checked state of the control.\n * @attr\n */\n @property({ type: Boolean })\n public set checked(value: boolean) {\n const previous = this.checked;\n\n this._formValue.setValueAndFormState(value);\n if (this.hasUpdated && this.checked) {\n this._updateCheckedState();\n }\n\n // The tab stop is a state of the group, so a change of the selection derives it\n // again. A write of the same state leaves the group as it is.\n if (this.checked !== previous) {\n this._group.sync();\n }\n }\n\n public get checked(): boolean {\n return this._formValue.value;\n }\n\n /**\n * The label position of the radio control.\n * @attr label-position\n */\n @property({ reflect: true, attribute: 'label-position' })\n public labelPosition: ToggleLabelPosition = 'after';\n\n constructor() {\n super();\n\n addThemingController(this, all);\n\n addRovingFocusController(this, {\n keybindings: {\n skip: () => this.disabled,\n bindingDefaults: { preventDefault: true, repeat: true },\n },\n vertical: true,\n homeEnd: false,\n items: () => this._activeRadios,\n current: () => this,\n focusItem: (radio) => this._navigate(radio),\n });\n }\n\n protected override willUpdate(properties: PropertyValues<this>): void {\n // The name is half of the identity of a group, so a new name moves this radio to another one.\n if (properties.has('name')) {\n this._group.updateMembership();\n }\n\n // The tab stop of the group depends on which of its radios are disabled.\n if (properties.has('disabled')) {\n this._group.sync();\n }\n }\n\n protected override async firstUpdated(): Promise<void> {\n await this.updateComplete;\n\n if (this.checked && this._isLastChecked()) {\n for (const radio of this._siblings()) {\n radio.checked = false;\n radio.defaultChecked = false;\n }\n } else {\n this._validate();\n }\n }\n\n protected _handleSlotChange(): void {\n this._hideLabel = !this._slots.hasAssignedNodes('[default]', true);\n }\n\n /** Focuses and checks the radio, as a native radio label does. */\n protected override _handleLabelActivation(): void {\n this._input.focus();\n this._input.click();\n }\n\n protected override _setDefaultValue(current: string | null): void {\n // The base mixin gives 'true' if the `checked` attribute is there, and null\n // if it is removed. `isDefined` accepts null as present, and would check the\n // radio again on a form reset.\n this._formValue.defaultValue = isString(current);\n for (const radio of this._siblings()) {\n radio.defaultChecked = false;\n }\n }\n\n /**\n * Restores the default state without the `checked` setter. That setter unchecks all\n * siblings, which damages the state of the radios that the browser already reset in\n * the same `form.reset()` pass.\n */\n protected override _restoreDefaultValue(): void {\n const checked = this.checked;\n this._formValue.setValueAndFormState(this.defaultChecked);\n this.requestUpdate('checked', checked);\n }\n\n /** Simulates a click on the radio control. */\n public override click(): void {\n this._input.click();\n }\n\n /* alternateName: focusComponent */\n /** Sets focus on the radio control. */\n public override focus(options?: FocusOptions): void {\n this._input.focus(options);\n }\n\n /* alternateName: blurComponent */\n /** Removes focus from the radio control. */\n public override blur(): void {\n this._input.blur();\n }\n\n private _checkValidity(): boolean {\n return super.checkValidity();\n }\n\n private _reportValidity(): boolean {\n return super.reportValidity();\n }\n\n /** Checks for validity of the control and emits the invalid event if it's invalid. */\n public override checkValidity(): boolean {\n for (const radio of this._siblings()) {\n radio._checkValidity();\n }\n\n return this._checkValidity();\n }\n\n /** Checks for validity of the control and shows the browser message if it's invalid. */\n public override reportValidity(): boolean {\n for (const radio of this._siblings()) {\n radio._reportValidity();\n }\n\n return this._reportValidity();\n }\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public override setCustomValidity(message: string): void {\n for (const radio of this._radios) {\n radio._validate(message);\n radio.requestUpdate();\n }\n }\n\n private _updateCheckedState(): void {\n for (const radio of this._siblings()) {\n radio.checked = false;\n }\n }\n\n protected override formResetCallback(): void {\n super.formResetCallback();\n this._group.sync();\n this.updateComplete.then(() => this._validate());\n }\n\n protected override formAssociatedCallback(form: HTMLFormElement): void {\n super.formAssociatedCallback(form);\n\n // The form owner is the other half, so a new one moves this radio as well.\n this._group.updateMembership();\n }\n\n protected _handleClick(event: PointerEvent) {\n event.stopPropagation();\n this._setTouchedState();\n\n if (this.checked) {\n return;\n }\n\n this.checked = true;\n this._input.focus();\n this.emitEvent('igcChange', {\n detail: {\n checked: this.checked,\n value: this.value,\n },\n });\n }\n\n protected _navigate(radio: IgcRadioComponent): void {\n this._setTouchedState();\n radio.focus();\n radio.checked = true;\n radio.emitEvent('igcChange', {\n detail: { checked: radio.checked, value: radio.value },\n });\n }\n\n protected override render() {\n const checked = this.checked;\n\n return html`\n ${renderToggleShell(this, {\n type: 'radio',\n inputId: this._inputId,\n labelId: this._labelId,\n baseParts: {\n base: true,\n checked,\n focused: this._focusRingManager.focused,\n },\n controlParts: { control: true, checked },\n labelParts: { label: true, checked },\n renderControl: () => html`\n <span\n part=${partMap({ ripple: true, checked })}\n ?hidden=${this.disabled}\n ></span>\n `,\n hideLabel: this._hideLabel,\n tabindex: this._tabIndex,\n describedBy: helperText(this, this._slots)?.id,\n onClick: this._handleClick,\n onKeyDown: this._handleEnterKeydown,\n })}\n ${IgcValidationContainerComponent.create(this)}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio': IgcRadioComponent;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport { createMutationController } from '#internals/controllers/mutation-observer.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { isEmpty } from '#internals/utils/arrays.js';\nimport { isDefined } from '#internals/utils/types.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcRadioComponent from '../radio/radio.js';\nimport type { ContentOrientation } from '../types.js';\nimport { styles } from './themes/radio-group.base.css.js';\nimport { styles as shared } from './themes/shared/radio-group.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * Unifies one or more radio components into a single group.\n *\n * @element igc-radio-group\n *\n * @slot - The radio controls of the group. They must be direct children of the group -\n * radios nested in a wrapper element are neither part of it, nor laid out by it.\n */\nexport default class IgcRadioGroupComponent extends LitElement {\n public static readonly tagName = 'igc-radio-group';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcRadioGroupComponent, IgcRadioComponent);\n }\n\n private readonly _internals = addInternalsController(this, {\n initialARIA: { role: 'radiogroup' },\n reflectRole: true,\n aria: () => ({ ariaOrientation: this.alignment }),\n });\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots(),\n onChange: this._syncRadios,\n });\n\n private _defaultValue!: string;\n private _name!: string;\n /** The value that no radio holds yet. Empty as soon as a radio takes it. */\n private _pendingValue = '';\n\n private get _radios(): IgcRadioComponent[] {\n return this._slots.getAssignedElements<IgcRadioComponent>('[default]', {\n selector: IgcRadioComponent.tagName,\n flatten: true,\n });\n }\n\n /**\n * Alignment of the radio controls inside this group.\n * @attr\n */\n @property({ reflect: true })\n public alignment: ContentOrientation = 'vertical';\n\n /* blazorCSSuppress */\n @property({ attribute: false })\n public set defaultValue(value: string) {\n this._defaultValue = value;\n this._setRadiosDefaultChecked();\n }\n\n public get defaultValue(): string {\n return this._defaultValue;\n }\n\n /**\n * The name applied to all radio buttons in the group.\n * @attr\n */\n @property({ reflect: true })\n public set name(value: string) {\n this._name = value;\n this._setRadiosName();\n }\n\n public get name(): string {\n return this._name;\n }\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail.value\", false) */\n /**\n * The value of the group, reflecting the value of the currently checked radio button.\n * Setting it checks the radio button in the group with a matching value.\n * @attr\n */\n @property()\n public set value(value: string) {\n this._pendingValue = value;\n this._setSelectedRadio();\n }\n\n public get value(): string {\n const radios = this._radios;\n\n // The checked radio holds the value of the group. Without radios to apply it to,\n // the group reports the value that is still pending.\n return isEmpty(radios)\n ? this._pendingValue\n : (radios.find((radio) => radio.checked)?.value ?? '');\n }\n\n constructor() {\n super();\n\n addThemingController(this, all);\n\n createMutationController(this, {\n callback: this._syncStates,\n filter: [IgcRadioComponent.tagName],\n config: {\n attributeFilter: ['disabled', 'label-position'],\n subtree: true,\n },\n });\n }\n\n protected override firstUpdated(): void {\n this._syncRadios();\n }\n\n /**\n * Brings the group in sync with its radios. Runs after the first render and after each\n * change of the slotted content, to adopt the radios that come in at run time. Without\n * the name of the group, such a radio makes a group of its own, outside of the keyboard\n * navigation and the single selection of this one.\n */\n private _syncRadios(): void {\n const radios = this._radios;\n\n this._setRadiosName();\n this._setRadiosDefaultChecked();\n\n // The value of the group applies while no radio holds a selection of its own. This\n // is the first render, or the moment a radio with a value that had no match comes in.\n // The `checked` attribute then makes that selection the default state.\n if (this._pendingValue && !radios.some((radio) => radio.checked)) {\n this._setSelectedRadio();\n\n for (const radio of radios) {\n radio.toggleAttribute('checked', radio.checked);\n }\n }\n\n this._syncStates();\n this.style.setProperty('--layout-count', `${radios.length}`);\n }\n\n private _syncStates(): void {\n const radios = this._radios;\n\n this._internals.setState(\n 'disabled',\n !isEmpty(radios) && radios.every((radio) => radio.disabled)\n );\n this._internals.setState(\n 'label-before',\n radios.some((radio) => radio.labelPosition === 'before')\n );\n }\n\n private _setRadiosDefaultChecked(): void {\n if (isDefined(this._defaultValue)) {\n for (const radio of this._radios) {\n radio.defaultChecked = radio.value === this._defaultValue;\n }\n }\n }\n\n private _setRadiosName(): void {\n if (isDefined(this._name)) {\n for (const radio of this._radios) {\n radio.name = this._name;\n }\n }\n }\n\n private _setSelectedRadio(): void {\n let applied = false;\n\n for (const radio of this._radios) {\n radio.checked = radio.value === this._pendingValue;\n applied ||= radio.checked;\n }\n\n // A radio holds the value now, so the group reads it from that radio. A value that\n // stays pending applies again each time the group loses its selection.\n if (applied) {\n this._pendingValue = '';\n }\n }\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio-group': IgcRadioGroupComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { addInternalsController } from '#internals/controllers/internals.js';\nimport { createMutationController } from '#internals/controllers/mutation-observer.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { isEmpty } from '#internals/utils/arrays.js';\nimport { isDefined } from '#internals/utils/types.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcRadioComponent from '../radio/radio.js';\nimport type { ContentOrientation } from '../types.js';\nimport { styles } from './themes/radio-group.base.css.js';\nimport { styles as shared } from './themes/shared/radio-group.common.css.js';\nimport { all } from './themes/themes.js';\n\n/**\n * Unifies one or more radio components into a single group.\n *\n * @element igc-radio-group\n *\n * @slot - The radio controls of the group. They must be direct children of the group -\n * radios nested in a wrapper element are neither part of it, nor laid out by it.\n */\nexport default class IgcRadioGroupComponent extends LitElement {\n public static readonly tagName = 'igc-radio-group';\n public static override styles = [styles, shared];\n\n /* blazorSuppress */\n public static register(): void {\n registerComponent(IgcRadioGroupComponent, IgcRadioComponent);\n }\n\n private readonly _internals = addInternalsController(this, {\n initialARIA: { role: 'radiogroup' },\n reflectRole: true,\n aria: () => ({ ariaOrientation: this.alignment }),\n });\n\n private readonly _slots = addSlotController(this, {\n slots: setSlots(),\n onChange: this._syncRadios,\n });\n\n private _defaultValue!: string;\n private _name!: string;\n /** The value that no radio holds yet. Empty as soon as a radio takes it. */\n private _pendingValue = '';\n\n private get _radios(): IgcRadioComponent[] {\n return this._slots.getAssignedElements<IgcRadioComponent>('[default]', {\n selector: IgcRadioComponent.tagName,\n flatten: true,\n });\n }\n\n /**\n * Alignment of the radio controls inside this group.\n * @attr\n */\n @property({ reflect: true })\n public alignment: ContentOrientation = 'vertical';\n\n /* blazorCSSuppress */\n @property({ attribute: false })\n public set defaultValue(value: string) {\n this._defaultValue = value;\n this._setRadiosDefaultChecked();\n }\n\n public get defaultValue(): string {\n return this._defaultValue;\n }\n\n /**\n * The name applied to all radio buttons in the group.\n * @attr\n */\n @property({ reflect: true })\n public set name(value: string) {\n this._name = value;\n this._setRadiosName();\n }\n\n public get name(): string {\n return this._name;\n }\n\n /* @tsTwoWayProperty(true, \"igcChange\", \"detail.value\", false) */\n /**\n * The value of the group, reflecting the value of the currently checked radio button.\n * Setting it checks the radio button in the group with a matching value.\n * @attr\n */\n @property()\n public set value(value: string) {\n this._pendingValue = value;\n this._setSelectedRadio();\n }\n\n public get value(): string {\n const radios = this._radios;\n\n // The checked radio holds the value of the group. Without radios to apply it to,\n // the group reports the value that is still pending.\n return isEmpty(radios)\n ? this._pendingValue\n : (radios.find((radio) => radio.checked)?.value ?? '');\n }\n\n constructor() {\n super();\n\n addThemingController(this, all);\n\n createMutationController(this, {\n callback: this._syncStates,\n filter: [IgcRadioComponent.tagName],\n config: {\n attributeFilter: ['disabled', 'label-position'],\n subtree: true,\n },\n });\n }\n\n protected override firstUpdated(): void {\n this._syncRadios();\n }\n\n /**\n * Brings the group in sync with its radios. Runs after the first render and after each\n * change of the slotted content, to adopt the radios that come in at run time. Without\n * the name of the group, such a radio makes a group of its own, outside of the keyboard\n * navigation and the single selection of this one.\n */\n private _syncRadios(): void {\n const radios = this._radios;\n\n this._setRadiosName();\n this._setRadiosDefaultChecked();\n\n // The value of the group applies while no radio holds its own selection:\n // the first render, or the moment a radio with an unmatched value arrives.\n // The `checked` attribute then makes that selection the default.\n if (this._pendingValue && !radios.some((radio) => radio.checked)) {\n this._setSelectedRadio();\n\n for (const radio of radios) {\n radio.toggleAttribute('checked', radio.checked);\n }\n }\n\n this._syncStates();\n this.style.setProperty('--layout-count', `${radios.length}`);\n }\n\n private _syncStates(): void {\n const radios = this._radios;\n\n this._internals.setState(\n 'disabled',\n !isEmpty(radios) && radios.every((radio) => radio.disabled)\n );\n this._internals.setState(\n 'label-before',\n radios.some((radio) => radio.labelPosition === 'before')\n );\n }\n\n private _setRadiosDefaultChecked(): void {\n if (isDefined(this._defaultValue)) {\n for (const radio of this._radios) {\n radio.defaultChecked = radio.value === this._defaultValue;\n }\n }\n }\n\n private _setRadiosName(): void {\n if (isDefined(this._name)) {\n for (const radio of this._radios) {\n radio.name = this._name;\n }\n }\n }\n\n private _setSelectedRadio(): void {\n let applied = false;\n\n for (const radio of this._radios) {\n radio.checked = radio.value === this._pendingValue;\n applied ||= radio.checked;\n }\n\n // A radio holds the value now, so the group reads it from that radio. A value that\n // stays pending applies again each time the group loses its selection.\n if (applied) {\n this._pendingValue = '';\n }\n }\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio-group': IgcRadioGroupComponent;\n }\n}\n"]}
@@ -56,8 +56,8 @@ declare const IgcRatingComponent_base: Constructor<import("../../internals/mixin
56
56
  * @cssproperty --symbol-size - The size of the symbols.
57
57
  * @cssproperty --symbol-full-color - The color of the filled symbol.
58
58
  * @cssproperty --symbol-empty-color - The color of the empty symbol.
59
- * @cssproperty --symbol-full-filter - The filter(s) used for the filled symbol.
60
- * @cssproperty --symbol-empty-filter - The filter(s) used for the empty symbol.
59
+ * @cssproperty --symbol-full-filter - The filter(s) applied to projected full symbols, other than icons, when the rating is disabled.
60
+ * @cssproperty --symbol-empty-filter - The filter(s) applied to projected empty symbols, other than icons, when the rating is disabled.
61
61
  */
62
62
  export default class IgcRatingComponent extends IgcRatingComponent_base {
63
63
  static readonly tagName = "igc-rating";
@@ -67,6 +67,7 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
67
67
  protected readonly _formValue: import("#internals/mixins/forms/form-value.js").FormValue<number>;
68
68
  private _symbols;
69
69
  private _container?;
70
+ private readonly _slider;
70
71
  private _hoverValue;
71
72
  private _hoverState;
72
73
  private get _isInteractive();
@@ -147,6 +148,8 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
147
148
  private _handleClick;
148
149
  private _handlePointerMove;
149
150
  private _handleSlotChange;
151
+ /** Focuses the slider, as a native range input label does. */
152
+ protected _handleLabelActivation(): void;
150
153
  private _handleHoverEnabled;
151
154
  private _handleHoverDisabled;
152
155
  private _emitValueUpdate;
@@ -154,10 +157,10 @@ export default class IgcRatingComponent extends IgcRatingComponent_base {
154
157
  /** Rounds a value up to the next multiple of the step. */
155
158
  private _ceilToStep;
156
159
  /**
157
- * Removes the floating point noise that the step arithmetic introduces. The
158
- * decimals of the current value and of the step stay, thus a value that the
159
- * consumer sets keeps its precision, and the value, the event payload and
160
- * `aria-valuenow` stay readable.
160
+ * Removes the floating point noise of the step arithmetic. The decimals of
161
+ * the value and of the step stay, so a value from the consumer keeps its
162
+ * precision, and the value, the event payload and `aria-valuenow` stay
163
+ * readable.
161
164
  */
162
165
  private _normalize;
163
166
  private _updateProjectedSymbols;
@@ -6,12 +6,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { html, LitElement, nothing } from 'lit';
8
8
  import { property, query, state } from 'lit/decorators.js';
9
- import { ifDefined } from 'lit/directives/if-defined.js';
10
9
  import { map } from 'lit/directives/map.js';
11
10
  import { range } from 'lit/directives/range.js';
12
11
  import { styleMap } from 'lit/directives/style-map.js';
12
+ import { ariaBindings, resolveNaming, } from '#internals/controllers/aria-projection.js';
13
13
  import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, endKey, homeKey, } from '#internals/controllers/key-bindings.js';
14
- import { createMutationController } from '#internals/controllers/mutation-observer.js';
15
14
  import { addSlotController, setSlots, } from '#internals/controllers/slot.js';
16
15
  import { coercedProperty } from '#internals/decorators/coerced-property.js';
17
16
  import { registerComponent } from '#internals/definitions/register.js';
@@ -74,10 +73,6 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
74
73
  this.single = false;
75
74
  this.allowReset = false;
76
75
  addThemingController(this, all);
77
- createMutationController(this, {
78
- callback: () => this.requestUpdate(),
79
- config: { attributeFilter: ['aria-label'] },
80
- });
81
76
  addKeybindings(this, {
82
77
  skip: () => !this._isInteractive,
83
78
  bindingDefaults: { repeat: true },
@@ -125,6 +120,9 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
125
120
  }
126
121
  }
127
122
  }
123
+ _handleLabelActivation() {
124
+ this._slider.focus();
125
+ }
128
126
  _handleHoverEnabled() {
129
127
  this._hoverState = true;
130
128
  }
@@ -168,18 +166,19 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
168
166
  }
169
167
  }
170
168
  }
171
- _clipSymbol(index, isLTR = true) {
169
+ _clipSymbol(index, ltr) {
172
170
  const value = this._hoverState ? this._hoverValue : this.value;
173
171
  const progress = index + 1 - value;
174
172
  const exclusive = progress === 0 ? 0 : 1;
175
173
  const selection = this.single ? exclusive : progress;
176
- const activate = (p) => clamp(p * 100, 0, 100);
177
- const forward = `inset(0 ${activate(isLTR ? selection : 1 - selection)}% 0 0)`;
178
- const backward = `inset(0 0 0 ${activate(isLTR ? 1 - selection : selection)}%)`;
179
- return {
180
- backward: isLTR ? backward : forward,
181
- forward: isLTR ? forward : backward,
182
- };
174
+ const full = clamp(selection * 100, 0, 100);
175
+ const empty = clamp((1 - selection) * 100, 0, 100);
176
+ return ltr
177
+ ? { forward: `inset(0 ${full}% 0 0)`, backward: `inset(0 0 0 ${empty}%)` }
178
+ : {
179
+ forward: `inset(0 0 0 ${full}%)`,
180
+ backward: `inset(0 ${empty}% 0 0)`,
181
+ };
183
182
  }
184
183
  stepUp(n = 1) {
185
184
  this.value = this._normalize(this.value + n * this.step);
@@ -211,18 +210,15 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
211
210
  render() {
212
211
  const hoverActive = this.hoverPreview && this._isInteractive;
213
212
  const valueLabelHidden = !this._slots.hasAssignedNodes('value-label', true);
214
- const labelId = this.label ? 'rating-label' : undefined;
215
- const ariaLabel = this.label ? undefined : (this.ariaLabel ?? undefined);
216
213
  return html `
217
214
  <label part="label" id="rating-label" ?hidden=${!this.label}
218
215
  >${this.label}</label
219
216
  >
220
217
  <div
218
+ ${ariaBindings(resolveNaming(this, Boolean(this.label) && 'rating-label'))}
221
219
  part="base"
222
220
  role="slider"
223
221
  tabindex=${this.disabled ? -1 : 0}
224
- aria-labelledby=${ifDefined(labelId)}
225
- aria-label=${ifDefined(ariaLabel)}
226
222
  aria-valuemin="0"
227
223
  aria-valuenow=${this.value}
228
224
  aria-valuemax=${this.max}
@@ -253,6 +249,9 @@ export default class IgcRatingComponent extends FormAssociatedMixin(EventEmitter
253
249
  __decorate([
254
250
  query('[part="symbols"]', true)
255
251
  ], IgcRatingComponent.prototype, "_container", void 0);
252
+ __decorate([
253
+ query('[part="base"]', true)
254
+ ], IgcRatingComponent.prototype, "_slider", void 0);
256
255
  __decorate([
257
256
  state()
258
257
  ], IgcRatingComponent.prototype, "_hoverValue", void 0);