@infineon/infineon-design-system-stencil 32.1.3--canary.1732.d3813f209f738a14784b9c29ce072ceb36068e2f.0 → 32.2.0--canary.1735.73ac0fc3ba8a84e7408b2b0ddf5922d4ab28ecf8.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 (260) hide show
  1. package/dist/cjs/ifx-alert_2.cjs.entry.js +1 -1
  2. package/dist/cjs/ifx-basic-table.cjs.entry.js +1 -1
  3. package/dist/cjs/ifx-checkbox-group.cjs.entry.js +1 -1
  4. package/dist/cjs/ifx-checkbox-group.cjs.entry.js.map +1 -1
  5. package/dist/cjs/ifx-chip_3.cjs.entry.js +1 -1
  6. package/dist/cjs/ifx-faq.cjs.entry.js +1 -1
  7. package/dist/cjs/ifx-filter-accordion.cjs.entry.js +2 -2
  8. package/dist/cjs/ifx-filter-bar.cjs.entry.js +1 -1
  9. package/dist/cjs/ifx-filter-search.cjs.entry.js +1 -1
  10. package/dist/cjs/ifx-filter-type-group.cjs.entry.js +1 -1
  11. package/dist/cjs/ifx-list-entry.cjs.entry.js +1 -1
  12. package/dist/cjs/ifx-overview-table.cjs.entry.js +1 -1
  13. package/dist/cjs/ifx-overview-table.cjs.entry.js.map +1 -1
  14. package/dist/cjs/ifx-progress-bar.cjs.entry.js +1 -1
  15. package/dist/cjs/ifx-radio-button.cjs.entry.js +4 -11
  16. package/dist/cjs/ifx-radio-button.cjs.entry.js.map +1 -1
  17. package/dist/cjs/ifx-search-bar.cjs.entry.js +1 -1
  18. package/dist/cjs/ifx-search-field.cjs.entry.js +1 -1
  19. package/dist/cjs/ifx-segment.cjs.entry.js +1 -1
  20. package/dist/cjs/ifx-segmented-control.cjs.entry.js +2 -2
  21. package/dist/cjs/ifx-select.cjs.entry.js +11 -2
  22. package/dist/cjs/ifx-select.cjs.entry.js.map +1 -1
  23. package/dist/cjs/ifx-slider.cjs.entry.js +2 -2
  24. package/dist/cjs/ifx-spinner_2.cjs.entry.js +6 -6
  25. package/dist/cjs/ifx-status.cjs.entry.js +1 -1
  26. package/dist/cjs/ifx-step.cjs.entry.js +4 -4
  27. package/dist/cjs/ifx-stepper.cjs.entry.js +2 -2
  28. package/dist/cjs/ifx-switch.cjs.entry.js +1 -1
  29. package/dist/cjs/ifx-tab.cjs.entry.js +1 -1
  30. package/dist/cjs/ifx-table.cjs.entry.js +2 -2
  31. package/dist/cjs/ifx-tabs.cjs.entry.js +2 -2
  32. package/dist/cjs/ifx-tag.cjs.entry.js +1 -1
  33. package/dist/cjs/ifx-templates-ui.cjs.entry.js +1 -1
  34. package/dist/cjs/ifx-textarea.cjs.entry.js +1 -1
  35. package/dist/cjs/ifx-tooltip.cjs.entry.js +4 -4
  36. package/dist/cjs/index-1ce5aae1.js +0 -4
  37. package/dist/cjs/infineon-design-system-stencil.cjs.js +1 -1
  38. package/dist/cjs/loader.cjs.js +1 -1
  39. package/dist/collection/collection-manifest.json +0 -1
  40. package/dist/collection/components/checkbox-group/checkbox-group.css +2 -3
  41. package/dist/collection/components/overview-table/overview-table.js +1 -1
  42. package/dist/collection/components/overview-table/overview-table.js.map +1 -1
  43. package/dist/collection/components/pagination/pagination.js +1 -1
  44. package/dist/collection/components/progress-bar/progress-bar.js +1 -1
  45. package/dist/collection/components/radio-button/radio-button.css +0 -4
  46. package/dist/collection/components/radio-button/radio-button.js +2 -25
  47. package/dist/collection/components/radio-button/radio-button.js.map +1 -1
  48. package/dist/collection/components/radio-button/radio-button.stories.js +1 -13
  49. package/dist/collection/components/radio-button/radio-button.stories.js.map +1 -1
  50. package/dist/collection/components/search-bar/search-bar.js +1 -1
  51. package/dist/collection/components/search-field/search-field.js +1 -1
  52. package/dist/collection/components/segmented-control/segment/segment.js +1 -1
  53. package/dist/collection/components/segmented-control/segmented-control.js +2 -2
  54. package/dist/collection/components/select/single-select/select.js +11 -2
  55. package/dist/collection/components/select/single-select/select.js.map +1 -1
  56. package/dist/collection/components/slider/slider.js +2 -2
  57. package/dist/collection/components/spinner/spinner.js +2 -2
  58. package/dist/collection/components/status/status.js +1 -1
  59. package/dist/collection/components/stepper/step/step.js +4 -4
  60. package/dist/collection/components/stepper/stepper.js +2 -2
  61. package/dist/collection/components/switch/switch.js +1 -1
  62. package/dist/collection/components/table-advanced-version/filter-bar/filter-bar.js +1 -1
  63. package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js +2 -2
  64. package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js +1 -1
  65. package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js +1 -1
  66. package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js +1 -1
  67. package/dist/collection/components/table-advanced-version/table.js +2 -2
  68. package/dist/collection/components/table-basic-version/table.js +1 -1
  69. package/dist/collection/components/tabs/tab.js +1 -1
  70. package/dist/collection/components/tabs/tabs.js +2 -2
  71. package/dist/collection/components/tag/tag.js +1 -1
  72. package/dist/collection/components/templates/template/template.js +1 -1
  73. package/dist/collection/components/templates/templates-ui/templates-ui.js +1 -1
  74. package/dist/collection/components/text-field/text-field.js +4 -4
  75. package/dist/collection/components/textarea/textarea.js +1 -1
  76. package/dist/collection/components/tooltip/tooltip.js +4 -4
  77. package/dist/collection/stories/setup-and-installation/faq/faq.js +1 -1
  78. package/dist/components/ifx-basic-table.js +1 -1
  79. package/dist/components/ifx-checkbox-group.js +1 -1
  80. package/dist/components/ifx-checkbox-group.js.map +1 -1
  81. package/dist/components/ifx-faq.js +1 -1
  82. package/dist/components/ifx-filter-accordion.js +2 -2
  83. package/dist/components/ifx-filter-bar.js +1 -1
  84. package/dist/components/ifx-filter-search.js +2 -2
  85. package/dist/components/ifx-filter-type-group.js +1 -1
  86. package/dist/components/ifx-list-entry.js +2 -2
  87. package/dist/components/ifx-overview-table.js +1 -1
  88. package/dist/components/ifx-overview-table.js.map +1 -1
  89. package/dist/components/ifx-pagination.js +1 -1
  90. package/dist/components/ifx-progress-bar.js +1 -1
  91. package/dist/components/ifx-radio-button.js +1 -1
  92. package/dist/components/ifx-search-bar.js +2 -2
  93. package/dist/components/ifx-search-field.js +1 -1
  94. package/dist/components/ifx-segment.js +1 -1
  95. package/dist/components/ifx-segmented-control.js +2 -2
  96. package/dist/components/ifx-select.js +1 -1
  97. package/dist/components/ifx-set-filter.js +2 -2
  98. package/dist/components/ifx-slider.js +2 -2
  99. package/dist/components/ifx-spinner.js +1 -1
  100. package/dist/components/ifx-status.js +1 -1
  101. package/dist/components/ifx-step.js +4 -4
  102. package/dist/components/ifx-stepper.js +2 -2
  103. package/dist/components/ifx-switch.js +1 -1
  104. package/dist/components/ifx-tab.js +1 -1
  105. package/dist/components/ifx-table.js +4 -4
  106. package/dist/components/ifx-tabs.js +2 -2
  107. package/dist/components/ifx-tag.js +1 -1
  108. package/dist/components/ifx-template.js +1 -1
  109. package/dist/components/ifx-templates-ui.js +4 -4
  110. package/dist/components/ifx-text-field.js +1 -1
  111. package/dist/components/ifx-textarea.js +1 -1
  112. package/dist/components/ifx-tooltip.js +4 -4
  113. package/dist/components/{p-6758b716.js → p-25dce5bf.js} +2 -2
  114. package/dist/components/{p-6758b716.js.map → p-25dce5bf.js.map} +1 -1
  115. package/dist/components/{p-da211009.js → p-2eb42cd6.js} +12 -3
  116. package/dist/components/p-2eb42cd6.js.map +1 -0
  117. package/dist/components/{p-c24216e7.js → p-3d46d2af.js} +5 -5
  118. package/dist/components/{p-c24216e7.js.map → p-3d46d2af.js.map} +1 -1
  119. package/dist/components/{p-1ab9b2d3.js → p-432e892a.js} +3 -3
  120. package/dist/components/{p-1ab9b2d3.js.map → p-432e892a.js.map} +1 -1
  121. package/dist/components/{p-efb9a50a.js → p-47853a7b.js} +3 -3
  122. package/dist/components/{p-efb9a50a.js.map → p-47853a7b.js.map} +1 -1
  123. package/dist/components/{p-bf0b6855.js → p-80856f14.js} +4 -4
  124. package/dist/components/{p-bf0b6855.js.map → p-80856f14.js.map} +1 -1
  125. package/dist/components/{p-e3b1b73d.js → p-977668df.js} +6 -14
  126. package/dist/components/p-977668df.js.map +1 -0
  127. package/dist/esm/ifx-alert_2.entry.js +1 -1
  128. package/dist/esm/ifx-basic-table.entry.js +1 -1
  129. package/dist/esm/ifx-checkbox-group.entry.js +1 -1
  130. package/dist/esm/ifx-checkbox-group.entry.js.map +1 -1
  131. package/dist/esm/ifx-chip_3.entry.js +1 -1
  132. package/dist/esm/ifx-faq.entry.js +1 -1
  133. package/dist/esm/ifx-filter-accordion.entry.js +2 -2
  134. package/dist/esm/ifx-filter-bar.entry.js +1 -1
  135. package/dist/esm/ifx-filter-search.entry.js +1 -1
  136. package/dist/esm/ifx-filter-type-group.entry.js +1 -1
  137. package/dist/esm/ifx-list-entry.entry.js +1 -1
  138. package/dist/esm/ifx-overview-table.entry.js +1 -1
  139. package/dist/esm/ifx-overview-table.entry.js.map +1 -1
  140. package/dist/esm/ifx-progress-bar.entry.js +1 -1
  141. package/dist/esm/ifx-radio-button.entry.js +4 -11
  142. package/dist/esm/ifx-radio-button.entry.js.map +1 -1
  143. package/dist/esm/ifx-search-bar.entry.js +1 -1
  144. package/dist/esm/ifx-search-field.entry.js +1 -1
  145. package/dist/esm/ifx-segment.entry.js +1 -1
  146. package/dist/esm/ifx-segmented-control.entry.js +2 -2
  147. package/dist/esm/ifx-select.entry.js +11 -2
  148. package/dist/esm/ifx-select.entry.js.map +1 -1
  149. package/dist/esm/ifx-slider.entry.js +2 -2
  150. package/dist/esm/ifx-spinner_2.entry.js +6 -6
  151. package/dist/esm/ifx-status.entry.js +1 -1
  152. package/dist/esm/ifx-step.entry.js +4 -4
  153. package/dist/esm/ifx-stepper.entry.js +2 -2
  154. package/dist/esm/ifx-switch.entry.js +1 -1
  155. package/dist/esm/ifx-tab.entry.js +1 -1
  156. package/dist/esm/ifx-table.entry.js +2 -2
  157. package/dist/esm/ifx-tabs.entry.js +2 -2
  158. package/dist/esm/ifx-tag.entry.js +1 -1
  159. package/dist/esm/ifx-templates-ui.entry.js +1 -1
  160. package/dist/esm/ifx-textarea.entry.js +1 -1
  161. package/dist/esm/ifx-tooltip.entry.js +4 -4
  162. package/dist/esm/index-b4eaf00e.js +0 -4
  163. package/dist/esm/infineon-design-system-stencil.js +1 -1
  164. package/dist/esm/loader.js +1 -1
  165. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
  166. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js.map +1 -1
  167. package/dist/infineon-design-system-stencil/p-094349b2.entry.js +2 -0
  168. package/dist/infineon-design-system-stencil/p-094349b2.entry.js.map +1 -0
  169. package/dist/infineon-design-system-stencil/{p-0ed489eb.entry.js → p-0c747aac.entry.js} +2 -2
  170. package/dist/infineon-design-system-stencil/{p-724a6be7.entry.js → p-0c8e65cc.entry.js} +2 -2
  171. package/dist/infineon-design-system-stencil/p-0c8e65cc.entry.js.map +1 -0
  172. package/dist/infineon-design-system-stencil/{p-a2616b8d.entry.js → p-16430d76.entry.js} +2 -2
  173. package/dist/infineon-design-system-stencil/{p-44c3ef6d.entry.js → p-182854c8.entry.js} +2 -2
  174. package/dist/infineon-design-system-stencil/p-19ebd7a9.entry.js +2 -0
  175. package/dist/infineon-design-system-stencil/p-19ebd7a9.entry.js.map +1 -0
  176. package/dist/infineon-design-system-stencil/{p-48701f83.entry.js → p-1a93de53.entry.js} +2 -2
  177. package/dist/infineon-design-system-stencil/{p-137b4109.entry.js → p-1b907dbd.entry.js} +2 -2
  178. package/dist/infineon-design-system-stencil/{p-ce37b499.entry.js → p-1c869534.entry.js} +2 -2
  179. package/dist/infineon-design-system-stencil/{p-2c83ff9d.entry.js → p-260c4f53.entry.js} +2 -2
  180. package/dist/infineon-design-system-stencil/{p-e58a1c25.entry.js → p-272aab7f.entry.js} +2 -2
  181. package/dist/infineon-design-system-stencil/{p-0682ec9e.entry.js → p-2d8c79bc.entry.js} +2 -2
  182. package/dist/infineon-design-system-stencil/{p-9bc3708f.entry.js → p-37e5b4b4.entry.js} +2 -2
  183. package/dist/infineon-design-system-stencil/{p-8a92bb07.entry.js → p-386f62f0.entry.js} +2 -2
  184. package/dist/infineon-design-system-stencil/{p-73b7e3a5.entry.js → p-4ea09b73.entry.js} +2 -2
  185. package/dist/infineon-design-system-stencil/{p-6ede583b.entry.js → p-65b50486.entry.js} +2 -2
  186. package/dist/infineon-design-system-stencil/{p-bb2885be.entry.js → p-7b9fd2df.entry.js} +2 -2
  187. package/dist/infineon-design-system-stencil/{p-1d4fc278.entry.js → p-8276469c.entry.js} +2 -2
  188. package/dist/infineon-design-system-stencil/p-89c4fae2.entry.js +2 -0
  189. package/dist/infineon-design-system-stencil/{p-ece5ec08.entry.js → p-8ab52cac.entry.js} +2 -2
  190. package/dist/infineon-design-system-stencil/{p-e69d348c.entry.js → p-8c0927d0.entry.js} +2 -2
  191. package/dist/infineon-design-system-stencil/p-939f2f37.entry.js +2 -0
  192. package/dist/infineon-design-system-stencil/{p-484ab7c4.entry.js.map → p-939f2f37.entry.js.map} +1 -1
  193. package/dist/infineon-design-system-stencil/{p-ebef8ea8.entry.js → p-9901114e.entry.js} +2 -2
  194. package/dist/infineon-design-system-stencil/p-a1d3859e.entry.js +2 -0
  195. package/dist/infineon-design-system-stencil/p-a1d3859e.entry.js.map +1 -0
  196. package/dist/infineon-design-system-stencil/{p-62396204.entry.js → p-b0156752.entry.js} +2 -2
  197. package/dist/infineon-design-system-stencil/{p-a8fdba36.entry.js → p-b1bd480b.entry.js} +2 -2
  198. package/dist/infineon-design-system-stencil/{p-daa1ac45.entry.js → p-c8fecc8e.entry.js} +2 -2
  199. package/dist/infineon-design-system-stencil/{p-b4982f52.entry.js → p-ccba569e.entry.js} +2 -2
  200. package/dist/infineon-design-system-stencil/{p-c70eddd7.entry.js → p-d2998185.entry.js} +2 -2
  201. package/dist/infineon-design-system-stencil/{p-6cf93534.entry.js → p-f8f10567.entry.js} +2 -2
  202. package/dist/infineon-design-system-stencil/{p-42103a85.entry.js → p-f9298124.entry.js} +2 -2
  203. package/dist/types/components/radio-button/radio-button.d.ts +0 -2
  204. package/dist/types/components/radio-button/radio-button.stories.d.ts +0 -11
  205. package/dist/types/components/select/single-select/select.d.ts +1 -0
  206. package/dist/types/components.d.ts +0 -30
  207. package/package.json +1 -1
  208. package/dist/cjs/ifx-radio-button-group.cjs.entry.js +0 -61
  209. package/dist/cjs/ifx-radio-button-group.cjs.entry.js.map +0 -1
  210. package/dist/collection/components/radio-button-group/radio-button-group.css +0 -60
  211. package/dist/collection/components/radio-button-group/radio-button-group.js +0 -238
  212. package/dist/collection/components/radio-button-group/radio-button-group.js.map +0 -1
  213. package/dist/collection/components/radio-button-group/radio-button-group.stories.js +0 -143
  214. package/dist/collection/components/radio-button-group/radio-button-group.stories.js.map +0 -1
  215. package/dist/components/ifx-radio-button-group.d.ts +0 -11
  216. package/dist/components/ifx-radio-button-group.js +0 -91
  217. package/dist/components/ifx-radio-button-group.js.map +0 -1
  218. package/dist/components/p-da211009.js.map +0 -1
  219. package/dist/components/p-e3b1b73d.js.map +0 -1
  220. package/dist/esm/ifx-radio-button-group.entry.js +0 -57
  221. package/dist/esm/ifx-radio-button-group.entry.js.map +0 -1
  222. package/dist/infineon-design-system-stencil/p-484ab7c4.entry.js +0 -2
  223. package/dist/infineon-design-system-stencil/p-71b5d16a.entry.js +0 -2
  224. package/dist/infineon-design-system-stencil/p-71b5d16a.entry.js.map +0 -1
  225. package/dist/infineon-design-system-stencil/p-724a6be7.entry.js.map +0 -1
  226. package/dist/infineon-design-system-stencil/p-778a65ae.entry.js +0 -2
  227. package/dist/infineon-design-system-stencil/p-7a2688a5.entry.js +0 -2
  228. package/dist/infineon-design-system-stencil/p-7a2688a5.entry.js.map +0 -1
  229. package/dist/infineon-design-system-stencil/p-9631e187.entry.js +0 -2
  230. package/dist/infineon-design-system-stencil/p-9631e187.entry.js.map +0 -1
  231. package/dist/infineon-design-system-stencil/p-f24935f6.entry.js +0 -2
  232. package/dist/infineon-design-system-stencil/p-f24935f6.entry.js.map +0 -1
  233. package/dist/types/components/radio-button-group/radio-button-group.d.ts +0 -19
  234. package/dist/types/components/radio-button-group/radio-button-group.stories.d.ts +0 -171
  235. /package/dist/infineon-design-system-stencil/{p-0ed489eb.entry.js.map → p-0c747aac.entry.js.map} +0 -0
  236. /package/dist/infineon-design-system-stencil/{p-a2616b8d.entry.js.map → p-16430d76.entry.js.map} +0 -0
  237. /package/dist/infineon-design-system-stencil/{p-44c3ef6d.entry.js.map → p-182854c8.entry.js.map} +0 -0
  238. /package/dist/infineon-design-system-stencil/{p-48701f83.entry.js.map → p-1a93de53.entry.js.map} +0 -0
  239. /package/dist/infineon-design-system-stencil/{p-137b4109.entry.js.map → p-1b907dbd.entry.js.map} +0 -0
  240. /package/dist/infineon-design-system-stencil/{p-ce37b499.entry.js.map → p-1c869534.entry.js.map} +0 -0
  241. /package/dist/infineon-design-system-stencil/{p-2c83ff9d.entry.js.map → p-260c4f53.entry.js.map} +0 -0
  242. /package/dist/infineon-design-system-stencil/{p-e58a1c25.entry.js.map → p-272aab7f.entry.js.map} +0 -0
  243. /package/dist/infineon-design-system-stencil/{p-0682ec9e.entry.js.map → p-2d8c79bc.entry.js.map} +0 -0
  244. /package/dist/infineon-design-system-stencil/{p-9bc3708f.entry.js.map → p-37e5b4b4.entry.js.map} +0 -0
  245. /package/dist/infineon-design-system-stencil/{p-8a92bb07.entry.js.map → p-386f62f0.entry.js.map} +0 -0
  246. /package/dist/infineon-design-system-stencil/{p-73b7e3a5.entry.js.map → p-4ea09b73.entry.js.map} +0 -0
  247. /package/dist/infineon-design-system-stencil/{p-6ede583b.entry.js.map → p-65b50486.entry.js.map} +0 -0
  248. /package/dist/infineon-design-system-stencil/{p-bb2885be.entry.js.map → p-7b9fd2df.entry.js.map} +0 -0
  249. /package/dist/infineon-design-system-stencil/{p-1d4fc278.entry.js.map → p-8276469c.entry.js.map} +0 -0
  250. /package/dist/infineon-design-system-stencil/{p-778a65ae.entry.js.map → p-89c4fae2.entry.js.map} +0 -0
  251. /package/dist/infineon-design-system-stencil/{p-ece5ec08.entry.js.map → p-8ab52cac.entry.js.map} +0 -0
  252. /package/dist/infineon-design-system-stencil/{p-e69d348c.entry.js.map → p-8c0927d0.entry.js.map} +0 -0
  253. /package/dist/infineon-design-system-stencil/{p-ebef8ea8.entry.js.map → p-9901114e.entry.js.map} +0 -0
  254. /package/dist/infineon-design-system-stencil/{p-62396204.entry.js.map → p-b0156752.entry.js.map} +0 -0
  255. /package/dist/infineon-design-system-stencil/{p-a8fdba36.entry.js.map → p-b1bd480b.entry.js.map} +0 -0
  256. /package/dist/infineon-design-system-stencil/{p-daa1ac45.entry.js.map → p-c8fecc8e.entry.js.map} +0 -0
  257. /package/dist/infineon-design-system-stencil/{p-b4982f52.entry.js.map → p-ccba569e.entry.js.map} +0 -0
  258. /package/dist/infineon-design-system-stencil/{p-c70eddd7.entry.js.map → p-d2998185.entry.js.map} +0 -0
  259. /package/dist/infineon-design-system-stencil/{p-6cf93534.entry.js.map → p-f8f10567.entry.js.map} +0 -0
  260. /package/dist/infineon-design-system-stencil/{p-42103a85.entry.js.map → p-f9298124.entry.js.map} +0 -0
@@ -1,2 +0,0 @@
1
- import{r as t,c as s,h as e,g as a}from"./p-c808c7d2.js";const o=":host{display:block}";const r=o;const c=class{constructor(e){t(this,e);this.tabHeaderChange=s(this,"tabHeaderChange",7);this.icon="";this.iconPosition="left"}componentWillUpdate(){this.tabHeaderChange.emit(this.header)}render(){return e("slot",{key:"37043a27bd989be177366265767fcd7a9ed21e87"})}get el(){return a(this)}};c.style=r;export{c as ifx_tab};
2
- //# sourceMappingURL=p-778a65ae.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as t,h as i,g as o}from"./p-c808c7d2.js";const e=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.radio-button-group-container{display:flex;flex-direction:column}.radio-button-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.radio-button-group.horizontal{flex-direction:row;column-gap:12px}.radio-button-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem "Source Sans 3";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem "Source Sans 3";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}';const n=e;const r=class{constructor(i){t(this,i);this.errorStates=new Map;this.alignment="vertical";this.groupLabelText="Group Label Text";this.hasErrors=false;this.handleSlotChange=()=>{this.initializeState()}}handleRadioButtonError(t){const i=t.target;if(i.tagName==="ifx-radio-button"){this.errorStates.set(i,t.detail);this.updateHasErrors()}}async setGroupError(t){const i=Array.from(this.el.querySelectorAll("ifx-radio-button"));i.forEach((i=>{i.error=t}))}componentWillLoad(){this.initializeState()}initializeState(){this.errorStates.clear();const t=Array.from(this.el.querySelectorAll("ifx-radio-button"));t.forEach((t=>{if(!this.errorStates.has(t)){this.errorStates.set(t,t.error||false)}}));this.updateHasErrors()}updateHasErrors(){this.hasErrors=Array.from(this.errorStates.values()).some((t=>t))}render(){return i("div",{key:"0c359fed41079b31dae0c28ace5192cdd43cc076",class:"radio-button-group-container"},this.showGroupLabel?i("div",{class:"group-label"},this.groupLabelText," *"):"",i("div",{key:"735ec208d1aee30020ccd60621f90690c765c8bb",class:`radio-button-group ${this.alignment} ${this.size}`},i("slot",{key:"1d42c5173fc75d43c3497a2ed602fc781e98271b",onSlotchange:this.handleSlotChange})),this.showCaption?i("div",{class:`caption ${this.hasErrors?"error":"default"}`},this.showCaptionIcon?i("div",{class:"caption-icon"},i("ifx-icon",{icon:"c-info-16"})):"",i("div",{class:"caption-text"},this.captionText)):"")}static get formAssociated(){return true}get el(){return o(this)}};r.style=n;export{r as ifx_radio_button_group};
2
- //# sourceMappingURL=p-7a2688a5.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["radioButtonGroupCss","IfxRadioButtonGroupStyle0","RadioButtonGroup","constructor","hostRef","this","errorStates","Map","alignment","groupLabelText","hasErrors","handleSlotChange","initializeState","handleRadioButtonError","event","radioButton","target","tagName","set","detail","updateHasErrors","setGroupError","error","radioButtons","Array","from","el","querySelectorAll","forEach","componentWillLoad","clear","has","values","some","render","h","key","class","showGroupLabel","size","onSlotchange","showCaption","showCaptionIcon","icon","captionText"],"sources":["src/components/radio-button-group/radio-button-group.scss?tag=ifx-radio-button-group&encapsulation=shadow","src/components/radio-button-group/radio-button-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.radio-button-group-container {\n display: flex;\n flex-direction: column;\n}\n\n.radio-button-group {\n display: flex;\n font-family: var(--ifx-font-family);\n gap: tokens.$ifxSpace100;\n\n &.horizontal {\n flex-direction: row;\n column-gap: tokens.$ifxSpace150;\n }\n\n &.vertical {\n flex-direction: column;\n row-gap: tokens.$ifxSpace150;\n }\n}\n\n.group-label {\n font: tokens.$ifxBodyBody05;\n margin-bottom: tokens.$ifxSpace100;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n}\n\n.caption {\n margin-top: tokens.$ifxSpace100;\n align-self: flex-start;\n display: flex;\n width: 100%;\n column-gap: tokens.$ifxSpace100;\n justify-content: space-between;\n align-items: center;\n\n &.default {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.error {\n color: tokens.$ifxColorRed500;\n }\n}\n\n.caption-text {\n font: tokens.$ifxBodyBody05;\n flex: 1;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n}\n\n.caption-icon {\n flex:0;\n display: flex;\n}","import { Component, State, Prop, h, Element, Listen, Method } from '@stencil/core';\n\n@Component({\n tag: 'ifx-radio-button-group',\n styleUrl: 'radio-button-group.scss',\n shadow: true,\n formAssociated: true\n})\n\nexport class RadioButtonGroup {\n private errorStates: Map<HTMLElement, boolean> = new Map();\n\n @Element() el: HTMLElement;\n @Prop() alignment: 'horizontal' | 'vertical' = 'vertical';\n @Prop() size: string;\n @Prop() showGroupLabel: boolean;\n @Prop() groupLabelText: string = 'Group Label Text';\n @Prop() showCaption: boolean;\n @Prop() captionText: string;\n @Prop() showCaptionIcon: boolean;\n @State() hasErrors: boolean = false;\n \n @Listen('ifxError')\n handleRadioButtonError(event: CustomEvent) {\n const radioButton = event.target as HTMLElement;\n if (radioButton.tagName === 'ifx-radio-button') {\n this.errorStates.set(radioButton, event.detail);\n this.updateHasErrors();\n }\n }\n\n // Method to set the error state of all radio-butttons in the group\n @Method()\n async setGroupError(error: boolean) {\n const radioButtons = Array.from(this.el.querySelectorAll('ifx-radio-button'));\n radioButtons.forEach((radioButton) => {\n (radioButton as any).error = error;\n });\n }\n\n componentWillLoad() {\n this.initializeState();\n }\n\n handleSlotChange = () => {\n this.initializeState();\n };\n\n private initializeState() {\n this.errorStates.clear();\n const radioButtons = Array.from(this.el.querySelectorAll('ifx-radio-button'));\n radioButtons.forEach((radioButton) => {\n if (!this.errorStates.has(radioButton)) {\n this.errorStates.set(radioButton, (radioButton as any).error || false);\n }\n });\n this.updateHasErrors();\n }\n\n private updateHasErrors() {\n this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);\n }\n\n render() {\n return (\n <div class='radio-button-group-container'>\n {this.showGroupLabel ? <div class='group-label'>{this.groupLabelText} *</div> : ''}\n <div class={`radio-button-group ${this.alignment} ${this.size}`}>\n <slot onSlotchange={this.handleSlotChange} ></slot>\n </div>\n {this.showCaption ? (\n <div class={`caption ${this.hasErrors ? 'error' : 'default'}`}>\n {this.showCaptionIcon ? <div class='caption-icon'><ifx-icon icon=\"c-info-16\">\n </ifx-icon></div> : ''}\n <div class='caption-text'>{this.captionText}</div>\n </div>) : ''}\n </div>\n );\n }\n}"],"mappings":"kDAAA,MAAMA,EAAsB,62BAC5B,MAAAC,EAAeD,E,MCQFE,EAAgB,MAP7B,WAAAC,CAAAC,G,UAQYC,KAAAC,YAAyC,IAAIC,IAG7CF,KAAAG,UAAuC,WAGvCH,KAAAI,eAAyB,mBAIxBJ,KAAAK,UAAqB,MAwB9BL,KAAAM,iBAAmB,KACfN,KAAKO,iBAAiB,C,CAtB1B,sBAAAC,CAAuBC,GACnB,MAAMC,EAAcD,EAAME,OAC1B,GAAID,EAAYE,UAAY,mBAAoB,CAC5CZ,KAAKC,YAAYY,IAAIH,EAAaD,EAAMK,QACxCd,KAAKe,iB,EAMX,mBAAMC,CAAcC,GAClB,MAAMC,EAAeC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,qBACzDJ,EAAaK,SAASb,IACnBA,EAAoBO,MAAQA,CAAK,G,CAIxC,iBAAAO,GACIxB,KAAKO,iB,CAOD,eAAAA,GACJP,KAAKC,YAAYwB,QACjB,MAAMP,EAAeC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,qBACzDJ,EAAaK,SAASb,IAClB,IAAKV,KAAKC,YAAYyB,IAAIhB,GAAc,CACpCV,KAAKC,YAAYY,IAAIH,EAAcA,EAAoBO,OAAS,M,KAGxEjB,KAAKe,iB,CAGD,eAAAA,GACJf,KAAKK,UAAYc,MAAMC,KAAKpB,KAAKC,YAAY0B,UAAUC,MAAMX,GAAUA,G,CAG3E,MAAAY,GACI,OACIC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,gCACNhC,KAAKiC,eAAiBH,EAAA,OAAKE,MAAM,eAAehC,KAAKI,eAAc,MAAY,GAChF0B,EAAA,OAAAC,IAAA,2CAAKC,MAAO,sBAAsBhC,KAAKG,aAAaH,KAAKkC,QACrDJ,EAAA,QAAAC,IAAA,2CAAMI,aAAcnC,KAAKM,oBAE5BN,KAAKoC,YACFN,EAAA,OAAKE,MAAO,WAAWhC,KAAKK,UAAY,QAAU,aAC7CL,KAAKqC,gBAAkBP,EAAA,OAAKE,MAAM,gBAAeF,EAAA,YAAUQ,KAAK,eAC7C,GACpBR,EAAA,OAAKE,MAAM,gBAAgBhC,KAAKuC,cAC1B,G","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as t,c as r,h as o,g as i}from"./p-c808c7d2.js";const e=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex;--_ifx-fallback-display:none !important}._ifx-radiobutton-fallback{display:var(--_ifx-fallback-display);position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;border:0 !important}.radioButton__container{box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;padding:0px;gap:8px;cursor:pointer;font-family:var(--ifx-font-family)}.radioButton__container.m .radioButton__wrapper{width:24px;height:24px}.radioButton__container .radioButton__wrapper{width:20px;height:20px;position:relative;display:block;border-radius:50%;background-color:#FFFFFF;border:1px solid #575352}.radioButton__container .radioButton__wrapper:focus{outline:none}.radioButton__container .radioButton__wrapper:focus::before{content:"";position:absolute;width:calc(100% + 4px);height:calc(100% + 4px);top:50%;left:50%;transform:translate(-50%, -50%);border:2px solid #0A8276;border-radius:50%}.radioButton__container .radioButton__wrapper .radioButton__wrapper-mark{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background-color:#0A8276;border-radius:50%;display:flex;justify-content:center;align-items:center;border-color:transparent}.radioButton__container .radioButton__wrapper:hover{background-color:#EEEDED}.radioButton__container .radioButton__wrapper.disabled{background-color:#BFBBBB;border-color:#BFBBBB}.radioButton__container .radioButton__wrapper.disabled.error:hover,.radioButton__container .radioButton__wrapper.disabled.error:focus-visible{border-color:#CD002F}.radioButton__container .radioButton__wrapper.checked{border-color:#0A8276}.radioButton__container .radioButton__wrapper.checked::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;background-color:#0A8276;border-radius:50%}.radioButton__container .radioButton__wrapper.checked.disabled::after{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked:hover{border-color:#08665C}.radioButton__container .radioButton__wrapper.checked:hover .radioButton__wrapper-mark{background-color:#08665C}.radioButton__container .radioButton__wrapper.checked.disabled{background-color:#FFFFFF;border-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.disabled.disabled::after{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.disabled .radioButton__wrapper-mark{background-color:#BFBBBB}.radioButton__container .radioButton__wrapper.checked.error::after{border-color:#CD002F;background-color:#CD002F}.radioButton__container .radioButton__wrapper.error:not(.disabled){border-color:#CD002F}.radioButton__container .radioButton__wrapper.error:not(.disabled):hover,.radioButton__container .radioButton__wrapper.error:not(.disabled):focus-visible{border-color:#CD002F}.radioButton__container .label{display:flex;align-items:center;height:20px;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:#1D1D1D;flex:none;order:1;flex-grow:0}.radioButton__container .label.label-m{height:24px;font-size:1rem;line-height:1.5rem}.radioButton__container .label.disabled{color:#BFBBBB}.radioButton__container .label:hover{cursor:pointer}';const a=e;const n=class{constructor(o){t(this,o);this.ifxChange=r(this,"ifxChange",7);this.ifxError=r(this,"ifxError",7);this.disabled=false;this.error=false;this.size="s";this.internalChecked=false;this.hasSlot=false}componentWillLoad(){this.fallbackInput=document.createElement("input");this.fallbackInput.type="radio";this.fallbackInput.hidden=true;this.fallbackInput.className="_ifx-radiobutton-fallback";this.fallbackInput.style.cssText=`\n display: none !important;\n position: absolute !important;\n opacity: 0 !important;\n pointer-events: none !important;\n width: 0 !important;\n height: 0 !important;\n `;this.fallbackInput.setAttribute("aria-hidden","true");this.fallbackInput.tabIndex=-1;this.el.appendChild(this.fallbackInput);if("attachInternals"in HTMLElement.prototype){try{this.internals=this.el.attachInternals()}catch(t){console.warn("ElementInternals not supported")}}this.internalChecked=this.checked||false;this.hasSlot=!!this.el.querySelector("[slot]")||this.el.innerHTML.trim()!==""}handleCheckedChange(t){this.internalChecked=t}updateFormValue(){var t;if((t=this.internals)===null||t===void 0?void 0:t.setFormValue){this.internals.setFormValue(this.internalChecked?this.value:null)}this.fallbackInput.checked=this.internalChecked;this.fallbackInput.name=this.name;this.fallbackInput.value=this.value;this.fallbackInput.disabled=this.disabled}errorChanged(t,r){if(t!==r){this.ifxError.emit(t)}}handleRadioButtonClick(t){if(this.disabled){t.stopPropagation();return}this.inputElement.click();this.internalChecked=this.inputElement.checked;this.checked=this.internalChecked;this.ifxChange.emit(this.internalChecked);const r=new CustomEvent("change",{bubbles:true,composed:true,detail:{checked:this.internalChecked}});this.el.dispatchEvent(r)}handleKeyDown(t){if([" ","Enter"].includes(t.key)){t.preventDefault();this.handleRadioButtonClick(new PointerEvent("click"))}}handleExternalChange(t){const r=t.target;if(r===this.el||r.tagName.toLowerCase()!=="ifx-radio-button")return;if(r.getAttribute("name")===this.name){this.internalChecked=false}}render(){return o("div",{key:"d77cdd158994c94969dca737cb524625e36a3178",role:"radio","aria-checked":String(this.internalChecked),"aria-disabled":String(this.disabled),class:`radioButton__container ${this.size} ${this.disabled?"disabled":""}`,onClick:t=>this.handleRadioButtonClick(t),tabindex:this.disabled?-1:0},o("div",{key:"d3057ff92826d2b482bb24f813d938d239e04c96",class:`radioButton__wrapper \n ${this.internalChecked?"checked":""} \n ${this.disabled?"disabled":""} \n ${this.error?"error":""}`},this.internalChecked&&o("div",{key:"9bf957a824cc53794df205c719772d14a8727137",class:"radioButton__wrapper-mark"})),this.hasSlot&&o("div",{key:"38b619b9b9eba2d9ff59b22b0dac7afc14df170e",class:`label ${this.size==="m"?"label-m":""} ${this.disabled?"disabled":""}`},o("slot",{key:"af664f76c38c0a6b5e0a74209e93da583c2e292b"})),o("input",{key:"04b94bf5849d08d28cda7cefba44c42a10dd1b17",type:"radio",hidden:true,ref:t=>this.inputElement=t,name:this.name,value:this.value,checked:this.internalChecked,disabled:this.disabled,onClick:t=>t.stopPropagation()}))}static get formAssociated(){return true}get el(){return i(this)}static get watchers(){return{checked:["handleCheckedChange"],internalChecked:["updateFormValue"],error:["errorChanged"]}}};n.style=a;export{n as ifx_radio_button};
2
- //# sourceMappingURL=p-9631e187.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["radioButtonCss","IfxRadioButtonStyle0","RadioButton","constructor","hostRef","this","disabled","error","size","internalChecked","hasSlot","componentWillLoad","fallbackInput","document","createElement","type","hidden","className","style","cssText","setAttribute","tabIndex","el","appendChild","HTMLElement","prototype","internals","attachInternals","e","console","warn","checked","querySelector","innerHTML","trim","handleCheckedChange","newValue","updateFormValue","_a","setFormValue","value","name","errorChanged","oldValue","ifxError","emit","handleRadioButtonClick","event","stopPropagation","inputElement","click","ifxChange","changeEvent","CustomEvent","bubbles","composed","detail","dispatchEvent","handleKeyDown","ev","includes","key","preventDefault","PointerEvent","handleExternalChange","target","tagName","toLowerCase","getAttribute","render","h","role","String","class","onClick","tabindex","ref"],"sources":["src/components/radio-button/radio-button.scss?tag=ifx-radio-button&encapsulation=shadow","src/components/radio-button/radio-button.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n --_ifx-fallback-display: none !important;\n}\n\n._ifx-radiobutton-fallback {\n display: var(--_ifx-fallback-display);\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important;\n overflow: hidden !important;\n clip: rect(0,0,0,0) !important;\n border: 0 !important;\n }\n\n.radioButton__container {\n box-sizing: border-box;\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 0px;\n gap: tokens.$ifxSpace100;\n cursor: pointer;\n font-family: var(--ifx-font-family);\n\n &.m .radioButton__wrapper {\n width: tokens.$ifxSize300;\n height: tokens.$ifxSize300;\n }\n\n .radioButton__wrapper {\n width: tokens.$ifxSize250;\n height: tokens.$ifxSize250;\n position: relative;\n display: block;\n border-radius: 50%;\n background-color: tokens.$ifxColorBaseWhite;\n border: 1px solid #575352;\n\n &:focus {\n outline: none;\n\n &::before {\n content: '';\n position: absolute;\n width: calc(100% + 4px);\n height: calc(100% + 4px);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border: 2px solid tokens.$ifxColorOcean500;\n border-radius: 50%;\n }\n }\n\n .radioButton__wrapper-mark {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: #0A8276;\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n border-color: tokens.$ifxColorBaseTransparent;\n }\n\n &:hover {\n background-color: tokens.$ifxColorEngineering200;\n }\n\n &.disabled {\n background-color: #BFBBBB;\n border-color: #BFBBBB;\n\n &.error {\n\n &:hover,\n &:focus-visible {\n border-color: #CD002F;\n }\n }\n }\n\n &.checked {\n border-color: #0A8276;\n\n &::after {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 10px;\n height: 10px;\n background-color: #0A8276;\n border-radius: 50%;\n }\n\n &.disabled::after {\n background-color: #BFBBBB;\n }\n\n\n &:hover {\n border-color: tokens.$ifxColorOcean600;\n\n & .radioButton__wrapper-mark {\n background-color: tokens.$ifxColorOcean600;\n }\n }\n\n &.disabled {\n background-color: tokens.$ifxColorBaseWhite;\n border-color: #BFBBBB;\n\n &.disabled::after {\n background-color: #BFBBBB;\n }\n\n & .radioButton__wrapper-mark {\n background-color: #BFBBBB;\n }\n }\n &.error::after {\n border-color: #CD002F;\n background-color: #CD002F;\n }\n }\n\n &.error:not(.disabled) {\n border-color: #CD002F;\n\n &:hover,\n &:focus-visible {\n border-color: #CD002F;\n }\n }\n }\n\n .label {\n display: flex;\n align-items: center;\n height: tokens.$ifxSize250;\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 1;\n flex-grow: 0;\n\n &.label-m {\n height: tokens.$ifxSize300;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n }\n\n &.disabled {\n color: #BFBBBB;\n }\n\n\n\n &:hover {\n cursor: pointer;\n }\n }\n}\n\n","import { Component, h, Prop, Element, State, Event, EventEmitter, Listen, Watch } from '@stencil/core';\n\n@Component({\n tag: 'ifx-radio-button',\n styleUrl: 'radio-button.scss',\n shadow: true,\n formAssociated: true\n})\nexport class RadioButton {\n @Element() el: HTMLElement;\n @Prop() disabled: boolean = false;\n @Prop() value: string;\n @Prop() error: boolean = false;\n @Prop({ reflect: true }) size: \"s\" | \"m\" = \"s\";\n @Prop({ reflect: true }) name: string;\n @Prop({ mutable: true }) checked: boolean;\n @State() internalChecked: boolean = false;\n @State() hasSlot: boolean = false;\n\n private inputElement: HTMLInputElement;\n private internals: ElementInternals;\n private fallbackInput: HTMLInputElement;\n\n @Event({ eventName: 'ifxChange' }) ifxChange: EventEmitter;\n @Event({ eventName: 'ifxError' }) ifxError: EventEmitter;\n\n componentWillLoad() {\n // Fallback for form association\n this.fallbackInput = document.createElement('input');\n this.fallbackInput.type = 'radio';\n this.fallbackInput.hidden = true;\n this.fallbackInput.className = '_ifx-radiobutton-fallback';\n this.fallbackInput.style.cssText = `\n display: none !important;\n position: absolute !important;\n opacity: 0 !important;\n pointer-events: none !important;\n width: 0 !important;\n height: 0 !important;\n `;\n this.fallbackInput.setAttribute('aria-hidden', 'true');\n this.fallbackInput.tabIndex = -1;\n this.el.appendChild(this.fallbackInput);\n\n // Initialize ElementInternals if supported\n if ('attachInternals' in HTMLElement.prototype) {\n try {\n this.internals = this.el.attachInternals();\n } catch (e) {\n console.warn('ElementInternals not supported');\n }\n }\n\n // Initial state\n this.internalChecked = this.checked || false;\n this.hasSlot = !!this.el.querySelector('[slot]') || this.el.innerHTML.trim() !== '';\n }\n\n @Watch('checked')\n handleCheckedChange(newValue: boolean) {\n this.internalChecked = newValue;\n }\n\n @Watch('internalChecked')\n updateFormValue() {\n // Update both ElementInternals and fallback input\n if (this.internals?.setFormValue) {\n this.internals.setFormValue(this.internalChecked ? this.value : null);\n }\n this.fallbackInput.checked = this.internalChecked;\n this.fallbackInput.name = this.name;\n this.fallbackInput.value = this.value;\n this.fallbackInput.disabled = this.disabled;\n }\n\n @Watch('error')\n errorChanged(newValue: boolean, oldValue: boolean) {\n if (newValue !== oldValue) {\n this.ifxError.emit(newValue);\n }\n }\n\n handleRadioButtonClick(event: Event) {\n if (this.disabled) {\n event.stopPropagation();\n return;\n }\n\n this.inputElement.click();\n this.internalChecked = this.inputElement.checked;\n this.checked = this.internalChecked;\n this.ifxChange.emit(this.internalChecked);\n\n const changeEvent = new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: { checked: this.internalChecked }\n });\n this.el.dispatchEvent(changeEvent);\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if ([' ', 'Enter'].includes(ev.key)) {\n ev.preventDefault();\n this.handleRadioButtonClick(new PointerEvent('click'));\n }\n }\n\n @Listen('change', { target: 'document' })\n handleExternalChange(event: Event) {\n const target = event.target as HTMLElement;\n if (target === this.el || target.tagName.toLowerCase() !== 'ifx-radio-button') return;\n \n if (target.getAttribute('name') === this.name) {\n this.internalChecked = false;\n }\n }\n\n render() {\n return (\n <div\n role=\"radio\"\n aria-checked={String(this.internalChecked)}\n aria-disabled={String(this.disabled)}\n class={`radioButton__container ${this.size} ${this.disabled ? 'disabled' : ''}`}\n onClick={(e) => this.handleRadioButtonClick(e)}\n tabindex={this.disabled ? -1 : 0}\n >\n <div\n class={`radioButton__wrapper \n ${this.internalChecked ? 'checked' : ''} \n ${this.disabled ? 'disabled' : ''} \n ${this.error ? 'error' : ''}`}\n >\n {this.internalChecked && <div class=\"radioButton__wrapper-mark\"></div>}\n </div>\n\n {this.hasSlot && (\n <div class={`label ${this.size === \"m\" ? \"label-m\" : \"\"} ${this.disabled ? 'disabled' : ''}`}>\n <slot />\n </div>\n )}\n\n <input\n type=\"radio\"\n hidden\n ref={el => this.inputElement = el}\n name={this.name}\n value={this.value}\n checked={this.internalChecked}\n disabled={this.disabled}\n onClick={(e) => e.stopPropagation()}\n />\n </div>\n );\n }\n}"],"mappings":"yDAAA,MAAMA,EAAiB,szGACvB,MAAAC,EAAeD,E,MCOFE,EAAW,MANxB,WAAAC,CAAAC,G,kFAQUC,KAAAC,SAAoB,MAEpBD,KAAAE,MAAiB,MACAF,KAAAG,KAAkB,IAGlCH,KAAAI,gBAA2B,MAC3BJ,KAAAK,QAAmB,K,CAS5B,iBAAAC,GAEEN,KAAKO,cAAgBC,SAASC,cAAc,SAC5CT,KAAKO,cAAcG,KAAO,QAC1BV,KAAKO,cAAcI,OAAS,KAC5BX,KAAKO,cAAcK,UAAY,4BAC/BZ,KAAKO,cAAcM,MAAMC,QAAU,+MAQnCd,KAAKO,cAAcQ,aAAa,cAAe,QAC/Cf,KAAKO,cAAcS,UAAY,EAC/BhB,KAAKiB,GAAGC,YAAYlB,KAAKO,eAGzB,GAAI,oBAAqBY,YAAYC,UAAW,CAC9C,IACEpB,KAAKqB,UAAYrB,KAAKiB,GAAGK,iB,CACzB,MAAOC,GACPC,QAAQC,KAAK,iC,EAKjBzB,KAAKI,gBAAkBJ,KAAK0B,SAAW,MACvC1B,KAAKK,UAAYL,KAAKiB,GAAGU,cAAc,WAAa3B,KAAKiB,GAAGW,UAAUC,SAAW,E,CAInF,mBAAAC,CAAoBC,GAClB/B,KAAKI,gBAAkB2B,C,CAIzB,eAAAC,G,MAEE,IAAIC,EAAAjC,KAAKqB,aAAS,MAAAY,SAAA,SAAAA,EAAEC,aAAc,CAChClC,KAAKqB,UAAUa,aAAalC,KAAKI,gBAAkBJ,KAAKmC,MAAQ,K,CAElEnC,KAAKO,cAAcmB,QAAU1B,KAAKI,gBAClCJ,KAAKO,cAAc6B,KAAOpC,KAAKoC,KAC/BpC,KAAKO,cAAc4B,MAAQnC,KAAKmC,MAChCnC,KAAKO,cAAcN,SAAWD,KAAKC,Q,CAInC,YAAAoC,CAAaN,EAAmBO,GAC9B,GAAIP,IAAaO,EAAU,CACzBtC,KAAKuC,SAASC,KAAKT,E,EAIzB,sBAAAU,CAAuBC,GACrB,GAAI1C,KAAKC,SAAU,CACjByC,EAAMC,kBACN,M,CAGF3C,KAAK4C,aAAaC,QAClB7C,KAAKI,gBAAkBJ,KAAK4C,aAAalB,QACzC1B,KAAK0B,QAAU1B,KAAKI,gBACpBJ,KAAK8C,UAAUN,KAAKxC,KAAKI,iBAEzB,MAAM2C,EAAc,IAAIC,YAAY,SAAU,CAC5CC,QAAS,KACTC,SAAU,KACVC,OAAQ,CAAEzB,QAAS1B,KAAKI,mBAE1BJ,KAAKiB,GAAGmC,cAAcL,E,CAIxB,aAAAM,CAAcC,GACZ,GAAI,CAAC,IAAK,SAASC,SAASD,EAAGE,KAAM,CACnCF,EAAGG,iBACHzD,KAAKyC,uBAAuB,IAAIiB,aAAa,S,EAKjD,oBAAAC,CAAqBjB,GACnB,MAAMkB,EAASlB,EAAMkB,OACrB,GAAIA,IAAW5D,KAAKiB,IAAM2C,EAAOC,QAAQC,gBAAkB,mBAAoB,OAE/E,GAAIF,EAAOG,aAAa,UAAY/D,KAAKoC,KAAM,CAC7CpC,KAAKI,gBAAkB,K,EAI3B,MAAA4D,GACE,OACEC,EAAA,OAAAT,IAAA,2CACEU,KAAK,QAAO,eACEC,OAAOnE,KAAKI,iBAAgB,gBAC3B+D,OAAOnE,KAAKC,UAC3BmE,MAAO,0BAA0BpE,KAAKG,QAAQH,KAAKC,SAAW,WAAa,KAC3EoE,QAAU9C,GAAMvB,KAAKyC,uBAAuBlB,GAC5C+C,SAAUtE,KAAKC,UAAY,EAAI,GAE/BgE,EAAA,OAAAT,IAAA,2CACEY,MAAO,sCACHpE,KAAKI,gBAAkB,UAAY,oBACnCJ,KAAKC,SAAW,WAAa,oBAC7BD,KAAKE,MAAQ,QAAU,MAE1BF,KAAKI,iBAAmB6D,EAAA,OAAAT,IAAA,2CAAKY,MAAM,+BAGrCpE,KAAKK,SACJ4D,EAAA,OAAAT,IAAA,2CAAKY,MAAO,SAASpE,KAAKG,OAAS,IAAM,UAAY,MAAMH,KAAKC,SAAW,WAAa,MACtFgE,EAAA,QAAAT,IAAA,8CAIJS,EAAA,SAAAT,IAAA,2CACE9C,KAAK,QACLC,OAAM,KACN4D,IAAKtD,GAAMjB,KAAK4C,aAAe3B,EAC/BmB,KAAMpC,KAAKoC,KACXD,MAAOnC,KAAKmC,MACZT,QAAS1B,KAAKI,gBACdH,SAAUD,KAAKC,SACfoE,QAAU9C,GAAMA,EAAEoB,oB","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as t,h as i,g as o}from"./p-c808c7d2.js";const e=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}.checkbox-group-container{display:flex;flex-direction:column}.checkbox-group{display:flex;font-family:var(--ifx-font-family);gap:8px}.checkbox-group.horizontal{flex-direction:row;column-gap:12px}.checkbox-group.vertical{flex-direction:column;row-gap:12px}.group-label{font:400 0.75rem/1rem "Source Sans 3";margin-bottom:8px;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption{margin-top:8px;align-self:flex-start;display:flex;width:100%;column-gap:8px;justify-content:space-between;align-items:center}.caption.default{color:#1D1D1D}.caption.error{color:#CD002F}.caption-text{font:400 0.75rem/1rem "Source Sans 3";flex:1;text-align:left;text-underline-position:from-font;text-decoration-skip-ink:none}.caption-icon{flex:0;display:flex}';const a=e;const s=class{constructor(i){t(this,i);this.errorStates=new Map;this.alignment="vertical";this.groupLabelText="Group Label Text";this.hasErrors=false;this.handleSlotChange=()=>{this.initializeState()}}handleCheckboxError(t){const i=t.target;if(i.tagName==="ifx-checkbox"){this.errorStates.set(i,t.detail);this.updateHasErrors()}}async setGroupError(t){const i=Array.from(this.el.querySelectorAll("ifx-checkbox"));i.forEach((i=>{i.error=t}))}componentWillLoad(){this.initializeState()}initializeState(){this.errorStates.clear();const t=Array.from(this.el.querySelectorAll("ifx-checkbox"));t.forEach((t=>{if(!this.errorStates.has(t)){this.errorStates.set(t,t.error||false)}}));this.updateHasErrors()}updateHasErrors(){this.hasErrors=Array.from(this.errorStates.values()).some((t=>t))}render(){return i("div",{key:"2f455a4fa40d089e1aafab0b669aa4f4ded80be0",class:"checkbox-group-container"},this.showGroupLabel?i("div",{class:"group-label"},this.groupLabelText," *"):"",i("div",{key:"eb6f16bf53e13620681c87eb7cb4062a37abd068",class:`checkbox-group ${this.alignment} ${this.size}`},i("slot",{key:"00ec08507a2ef1ff8e893b6c8b9aa917a7735224",onSlotchange:this.handleSlotChange})),this.showCaption?i("div",{class:`caption ${this.hasErrors?"error":"default"}`},this.showCaptionIcon?i("div",{class:"caption-icon"},i("ifx-icon",{icon:"c-info-16"})):"",i("div",{class:"caption-text"},this.captionText)):"")}static get formAssociated(){return true}get el(){return o(this)}};s.style=a;export{s as ifx_checkbox_group};
2
- //# sourceMappingURL=p-f24935f6.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["checkboxGroupCss","IfxCheckboxGroupStyle0","CheckboxGroup","constructor","hostRef","this","errorStates","Map","alignment","groupLabelText","hasErrors","handleSlotChange","initializeState","handleCheckboxError","event","checkbox","target","tagName","set","detail","updateHasErrors","setGroupError","error","checkboxes","Array","from","el","querySelectorAll","forEach","componentWillLoad","clear","has","values","some","render","h","key","class","showGroupLabel","size","onSlotchange","showCaption","showCaptionIcon","icon","captionText"],"sources":["src/components/checkbox-group/checkbox-group.scss?tag=ifx-checkbox-group&encapsulation=shadow","src/components/checkbox-group/checkbox-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.checkbox-group-container {\n display: flex;\n flex-direction: column;\n}\n\n.checkbox-group {\n display: flex;\n font-family: var(--ifx-font-family);\n gap: tokens.$ifxSpace100;\n\n &.horizontal {\n flex-direction: row;\n column-gap: tokens.$ifxSpace150;\n }\n\n &.vertical {\n flex-direction: column;\n row-gap: tokens.$ifxSpace150;\n }\n}\n\n.group-label {\n font: tokens.$ifxBodyBody05;\n margin-bottom: tokens.$ifxSpace100;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n}\n\n.caption {\n margin-top: tokens.$ifxSpace100;\n align-self: flex-start;\n display: flex;\n width: 100%;\n column-gap: tokens.$ifxSpace100;\n justify-content: space-between;\n align-items: center;\n\n &.default {\n color: tokens.$ifxColorBaseBlack;\n }\n\n &.error {\n color: tokens.$ifxColorRed500;\n }\n}\n\n.caption-text {\n font: tokens.$ifxBodyBody05;\n flex: 1;\n text-align: left;\n text-underline-position: from-font;\n text-decoration-skip-ink: none;\n}\n\n.caption-icon {\n flex:0;\n display: flex;\n}","import { Component, State, Prop, h, Element, Listen, Method } from '@stencil/core';\n\n@Component({\n tag: 'ifx-checkbox-group',\n styleUrl: 'checkbox-group.scss',\n shadow: true,\n formAssociated: true\n})\n\nexport class CheckboxGroup {\n private errorStates: Map<HTMLElement, boolean> = new Map();\n\n @Element() el: HTMLElement;\n @Prop() alignment: 'horizontal' | 'vertical' = 'vertical';\n @Prop() size: string;\n @Prop() showGroupLabel: boolean;\n @Prop() groupLabelText: string = 'Group Label Text';\n @Prop() showCaption: boolean;\n @Prop() captionText: string;\n @Prop() showCaptionIcon: boolean;\n @State() hasErrors: boolean = false;\n\n @Listen('ifxError')\n handleCheckboxError(event: CustomEvent) {\n const checkbox = event.target as HTMLElement;\n if (checkbox.tagName === 'ifx-checkbox') {\n this.errorStates.set(checkbox, event.detail);\n this.updateHasErrors();\n }\n }\n\n // Method to set the error state of all checkboxes in the group\n @Method()\n async setGroupError(error: boolean) {\n const checkboxes = Array.from(this.el.querySelectorAll('ifx-checkbox'));\n checkboxes.forEach((checkbox) => {\n (checkbox as any).error = error;\n });\n }\n\n componentWillLoad() {\n this.initializeState();\n }\n\n handleSlotChange = () => {\n this.initializeState();\n };\n\n private initializeState() {\n this.errorStates.clear();\n const checkboxes = Array.from(this.el.querySelectorAll('ifx-checkbox'));\n checkboxes.forEach((checkbox) => {\n if (!this.errorStates.has(checkbox)) {\n this.errorStates.set(checkbox, (checkbox as any).error || false);\n }\n });\n this.updateHasErrors();\n }\n\n private updateHasErrors() {\n this.hasErrors = Array.from(this.errorStates.values()).some((error) => error);\n }\n\n render() {\n return (\n <div class='checkbox-group-container'>\n {this.showGroupLabel ? <div class='group-label'>{this.groupLabelText} *</div> : ''}\n <div class={`checkbox-group ${this.alignment} ${this.size}`}>\n <slot onSlotchange={this.handleSlotChange}></slot>\n </div>\n {this.showCaption ? (\n <div class={`caption ${this.hasErrors ? 'error' : 'default'}`}>\n {this.showCaptionIcon ? <div class='caption-icon'><ifx-icon icon=\"c-info-16\">\n </ifx-icon></div> : ''}\n <div class='caption-text'>{this.captionText}</div>\n </div>) : ''}\n </div>\n );\n }\n}"],"mappings":"kDAAA,MAAMA,EAAmB,61BACzB,MAAAC,EAAeD,E,MCQFE,EAAa,MAP1B,WAAAC,CAAAC,G,UAQUC,KAAAC,YAAyC,IAAIC,IAG7CF,KAAAG,UAAuC,WAGvCH,KAAAI,eAAyB,mBAIxBJ,KAAAK,UAAqB,MAwB9BL,KAAAM,iBAAmB,KACjBN,KAAKO,iBAAiB,C,CAtBxB,mBAAAC,CAAoBC,GAClB,MAAMC,EAAWD,EAAME,OACvB,GAAID,EAASE,UAAY,eAAgB,CACvCZ,KAAKC,YAAYY,IAAIH,EAAUD,EAAMK,QACrCd,KAAKe,iB,EAMT,mBAAMC,CAAcC,GAClB,MAAMC,EAAaC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,iBACvDJ,EAAWK,SAASb,IACjBA,EAAiBO,MAAQA,CAAK,G,CAInC,iBAAAO,GACExB,KAAKO,iB,CAOC,eAAAA,GACNP,KAAKC,YAAYwB,QACjB,MAAMP,EAAaC,MAAMC,KAAKpB,KAAKqB,GAAGC,iBAAiB,iBACvDJ,EAAWK,SAASb,IAClB,IAAKV,KAAKC,YAAYyB,IAAIhB,GAAW,CACnCV,KAAKC,YAAYY,IAAIH,EAAWA,EAAiBO,OAAS,M,KAG9DjB,KAAKe,iB,CAGC,eAAAA,GACNf,KAAKK,UAAYc,MAAMC,KAAKpB,KAAKC,YAAY0B,UAAUC,MAAMX,GAAUA,G,CAGzE,MAAAY,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,4BACRhC,KAAKiC,eAAiBH,EAAA,OAAKE,MAAM,eAAehC,KAAKI,eAAc,MAAY,GAChF0B,EAAA,OAAAC,IAAA,2CAAKC,MAAO,kBAAkBhC,KAAKG,aAAaH,KAAKkC,QACnDJ,EAAA,QAAAC,IAAA,2CAAMI,aAAcnC,KAAKM,oBAE1BN,KAAKoC,YACJN,EAAA,OAAKE,MAAO,WAAWhC,KAAKK,UAAY,QAAU,aAC/CL,KAAKqC,gBAAkBP,EAAA,OAAKE,MAAM,gBAAeF,EAAA,YAAUQ,KAAK,eAC7C,GACpBR,EAAA,OAAKE,MAAM,gBAAgBhC,KAAKuC,cACxB,G","ignoreList":[]}
@@ -1,19 +0,0 @@
1
- export declare class RadioButtonGroup {
2
- private errorStates;
3
- el: HTMLElement;
4
- alignment: 'horizontal' | 'vertical';
5
- size: string;
6
- showGroupLabel: boolean;
7
- groupLabelText: string;
8
- showCaption: boolean;
9
- captionText: string;
10
- showCaptionIcon: boolean;
11
- hasErrors: boolean;
12
- handleRadioButtonError(event: CustomEvent): void;
13
- setGroupError(error: boolean): Promise<void>;
14
- componentWillLoad(): void;
15
- handleSlotChange: () => void;
16
- private initializeState;
17
- private updateHasErrors;
18
- render(): any;
19
- }
@@ -1,171 +0,0 @@
1
- declare const _default: {
2
- title: string;
3
- tags: string[];
4
- args: {
5
- amountOfItems: number;
6
- alignment: string;
7
- size: string;
8
- checked: boolean;
9
- disabled: boolean;
10
- error: boolean;
11
- showGroupLabel: boolean;
12
- groupLabelText: string;
13
- showCaption: boolean;
14
- captionText: string;
15
- showCaptionIcon: boolean;
16
- };
17
- argTypes: {
18
- amountOfItems: {
19
- categpry: string;
20
- name: string;
21
- description: string;
22
- control: {
23
- type: string;
24
- };
25
- table: {
26
- category: string;
27
- defaultValue: {
28
- summary: number;
29
- };
30
- };
31
- };
32
- alignment: {
33
- description: string;
34
- options: string[];
35
- control: {
36
- type: string;
37
- };
38
- table: {
39
- category: string;
40
- defaultValue: {
41
- summary: string;
42
- };
43
- };
44
- };
45
- size: {
46
- description: string;
47
- options: string[];
48
- control: {
49
- type: string;
50
- };
51
- table: {
52
- category: string;
53
- defaultValue: {
54
- summary: string;
55
- };
56
- type: {
57
- summary: string;
58
- };
59
- };
60
- };
61
- checked: {
62
- description: string;
63
- control: {
64
- type: string;
65
- };
66
- table: {
67
- category: string;
68
- defaultValue: {
69
- summary: string;
70
- };
71
- };
72
- };
73
- disabled: {
74
- description: string;
75
- control: {
76
- type: string;
77
- };
78
- table: {
79
- category: string;
80
- defaultValue: {
81
- summary: string;
82
- };
83
- };
84
- };
85
- error: {
86
- description: string;
87
- control: {
88
- type: string;
89
- };
90
- table: {
91
- category: string;
92
- defaultValue: {
93
- summary: string;
94
- };
95
- };
96
- };
97
- showGroupLabel: {
98
- description: string;
99
- control: {
100
- type: string;
101
- };
102
- table: {
103
- category: string;
104
- defaultValue: {
105
- summary: string;
106
- };
107
- };
108
- };
109
- groupLabelText: {
110
- description: string;
111
- control: {
112
- type: string;
113
- };
114
- table: {
115
- category: string;
116
- defaultValue: {
117
- summary: string;
118
- };
119
- };
120
- };
121
- showCaption: {
122
- description: string;
123
- control: {
124
- type: string;
125
- };
126
- table: {
127
- category: string;
128
- defaultValue: {
129
- summary: string;
130
- };
131
- };
132
- };
133
- captionText: {
134
- description: string;
135
- control: {
136
- type: string;
137
- };
138
- table: {
139
- category: string;
140
- defaultValue: {
141
- summary: string;
142
- };
143
- };
144
- };
145
- showCaptionIcon: {
146
- description: string;
147
- control: {
148
- type: string;
149
- };
150
- table: {
151
- category: string;
152
- defaultValue: {
153
- summary: string;
154
- };
155
- };
156
- };
157
- setGroupError: {
158
- action: string;
159
- description: string;
160
- table: {
161
- category: string;
162
- type: {
163
- summary: string;
164
- detail: string;
165
- };
166
- };
167
- };
168
- };
169
- };
170
- export default _default;
171
- export declare const Default: any;