@infineon/infineon-design-system-stencil 35.5.0--canary.1904.0d4b003852c0b770dd57c6a1f84fbed5c045769e.0 → 36.0.0--canary.1926.3b76d5defe8b9a743d9ec0dd5e6879c04e8055c0.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 (731) hide show
  1. package/dist/cjs/ifx-accordion_2.cjs.entry.js +26 -33
  2. package/dist/cjs/ifx-accordion_2.cjs.entry.js.map +1 -1
  3. package/dist/cjs/ifx-alert_2.cjs.entry.js +1 -7
  4. package/dist/cjs/ifx-alert_2.cjs.entry.js.map +1 -1
  5. package/dist/cjs/ifx-badge.cjs.entry.js +1 -9
  6. package/dist/cjs/ifx-badge.cjs.entry.js.map +1 -1
  7. package/dist/cjs/ifx-basic-table.cjs.entry.js +4 -9
  8. package/dist/cjs/ifx-basic-table.cjs.entry.js.map +1 -1
  9. package/dist/cjs/ifx-breadcrumb.cjs.entry.js +1 -8
  10. package/dist/cjs/ifx-breadcrumb.cjs.entry.js.map +1 -1
  11. package/dist/cjs/ifx-button.cjs.entry.js +1 -6
  12. package/dist/cjs/ifx-button.cjs.entry.js.map +1 -1
  13. package/dist/cjs/ifx-card.cjs.entry.js +3 -8
  14. package/dist/cjs/ifx-card.cjs.entry.js.map +1 -1
  15. package/dist/cjs/ifx-checkbox-group.cjs.entry.js +1 -6
  16. package/dist/cjs/ifx-checkbox-group.cjs.entry.js.map +1 -1
  17. package/dist/cjs/ifx-checkbox.cjs.entry.js +3 -8
  18. package/dist/cjs/ifx-checkbox.cjs.entry.js.map +1 -1
  19. package/dist/cjs/ifx-chip_3.cjs.entry.js +9 -17
  20. package/dist/cjs/ifx-chip_3.cjs.entry.js.map +1 -1
  21. package/dist/cjs/ifx-content-switcher.cjs.entry.js +1 -6
  22. package/dist/cjs/ifx-content-switcher.cjs.entry.js.map +1 -1
  23. package/dist/cjs/ifx-date-picker.cjs.entry.js +2 -9
  24. package/dist/cjs/ifx-date-picker.cjs.entry.js.map +1 -1
  25. package/dist/cjs/ifx-dropdown.cjs.entry.js +1 -6
  26. package/dist/cjs/ifx-dropdown.cjs.entry.js.map +1 -1
  27. package/dist/cjs/ifx-faq.cjs.entry.js +1 -1
  28. package/dist/cjs/ifx-file-upload.cjs.entry.js +2 -9
  29. package/dist/cjs/ifx-file-upload.cjs.entry.js.map +1 -1
  30. package/dist/cjs/ifx-filter-accordion.cjs.entry.js +2 -2
  31. package/dist/cjs/ifx-filter-bar.cjs.entry.js +1 -1
  32. package/dist/cjs/ifx-filter-search.cjs.entry.js +1 -1
  33. package/dist/cjs/ifx-filter-type-group.cjs.entry.js +1 -1
  34. package/dist/cjs/ifx-footer.cjs.entry.js +4 -9
  35. package/dist/cjs/ifx-footer.cjs.entry.js.map +1 -1
  36. package/dist/cjs/ifx-icon-button.cjs.entry.js +1 -6
  37. package/dist/cjs/ifx-icon-button.cjs.entry.js.map +1 -1
  38. package/dist/cjs/ifx-icon.cjs.entry.js +3 -36
  39. package/dist/cjs/ifx-icon.cjs.entry.js.map +1 -1
  40. package/dist/cjs/ifx-indicator.cjs.entry.js +2 -7
  41. package/dist/cjs/ifx-indicator.cjs.entry.js.map +1 -1
  42. package/dist/cjs/ifx-link.cjs.entry.js +1 -9
  43. package/dist/cjs/ifx-link.cjs.entry.js.map +1 -1
  44. package/dist/cjs/ifx-list-entry.cjs.entry.js +1 -1
  45. package/dist/cjs/ifx-modal.cjs.entry.js +2 -9
  46. package/dist/cjs/ifx-modal.cjs.entry.js.map +1 -1
  47. package/dist/cjs/ifx-multiselect_2.cjs.entry.js +932 -0
  48. package/dist/cjs/ifx-multiselect_2.cjs.entry.js.map +1 -0
  49. package/dist/cjs/ifx-navbar.cjs.entry.js +3 -5
  50. package/dist/cjs/ifx-navbar.cjs.entry.js.map +1 -1
  51. package/dist/cjs/ifx-notification.cjs.entry.js +2 -10
  52. package/dist/cjs/ifx-notification.cjs.entry.js.map +1 -1
  53. package/dist/cjs/ifx-progress-bar.cjs.entry.js +1 -7
  54. package/dist/cjs/ifx-progress-bar.cjs.entry.js.map +1 -1
  55. package/dist/cjs/ifx-radio-button-group.cjs.entry.js +1 -6
  56. package/dist/cjs/ifx-radio-button-group.cjs.entry.js.map +1 -1
  57. package/dist/cjs/ifx-radio-button.cjs.entry.js +2 -7
  58. package/dist/cjs/ifx-radio-button.cjs.entry.js.map +1 -1
  59. package/dist/cjs/ifx-search-bar.cjs.entry.js +1 -6
  60. package/dist/cjs/ifx-search-bar.cjs.entry.js.map +1 -1
  61. package/dist/cjs/ifx-search-field.cjs.entry.js +1 -9
  62. package/dist/cjs/ifx-search-field.cjs.entry.js.map +1 -1
  63. package/dist/cjs/ifx-segmented-control.cjs.entry.js +2 -9
  64. package/dist/cjs/ifx-segmented-control.cjs.entry.js.map +1 -1
  65. package/dist/cjs/ifx-select.cjs.entry.js +2 -7
  66. package/dist/cjs/ifx-select.cjs.entry.js.map +1 -1
  67. package/dist/cjs/ifx-set-filter.cjs.entry.js +19 -2
  68. package/dist/cjs/ifx-set-filter.cjs.entry.js.map +1 -1
  69. package/dist/cjs/ifx-sidebar.cjs.entry.js +5 -7
  70. package/dist/cjs/ifx-sidebar.cjs.entry.js.map +1 -1
  71. package/dist/cjs/ifx-slider.cjs.entry.js +3 -8
  72. package/dist/cjs/ifx-slider.cjs.entry.js.map +1 -1
  73. package/dist/cjs/ifx-spinner_2.cjs.entry.js +6 -17
  74. package/dist/cjs/ifx-spinner_2.cjs.entry.js.map +1 -1
  75. package/dist/cjs/ifx-status.cjs.entry.js +1 -9
  76. package/dist/cjs/ifx-status.cjs.entry.js.map +1 -1
  77. package/dist/cjs/ifx-step.cjs.entry.js +4 -4
  78. package/dist/cjs/ifx-step.cjs.entry.js.map +1 -1
  79. package/dist/cjs/ifx-stepper.cjs.entry.js +2 -7
  80. package/dist/cjs/ifx-stepper.cjs.entry.js.map +1 -1
  81. package/dist/cjs/ifx-switch.cjs.entry.js +1 -6
  82. package/dist/cjs/ifx-switch.cjs.entry.js.map +1 -1
  83. package/dist/cjs/ifx-tab.cjs.entry.js +1 -1
  84. package/dist/cjs/ifx-table.cjs.entry.js +5 -10
  85. package/dist/cjs/ifx-table.cjs.entry.js.map +1 -1
  86. package/dist/cjs/ifx-tabs.cjs.entry.js +2 -7
  87. package/dist/cjs/ifx-tabs.cjs.entry.js.map +1 -1
  88. package/dist/cjs/ifx-tag.cjs.entry.js +1 -9
  89. package/dist/cjs/ifx-tag.cjs.entry.js.map +1 -1
  90. package/dist/cjs/ifx-templates-ui.cjs.entry.js +1 -1
  91. package/dist/cjs/ifx-textarea.cjs.entry.js +1 -6
  92. package/dist/cjs/ifx-textarea.cjs.entry.js.map +1 -1
  93. package/dist/cjs/ifx-tooltip.cjs.entry.js +4 -9
  94. package/dist/cjs/ifx-tooltip.cjs.entry.js.map +1 -1
  95. package/dist/cjs/ifx-tree-view-item.cjs.entry.js +2 -2
  96. package/dist/cjs/ifx-tree-view.cjs.entry.js +1 -9
  97. package/dist/cjs/ifx-tree-view.cjs.entry.js.map +1 -1
  98. package/dist/cjs/index-7f4df11a.js +14 -14
  99. package/dist/cjs/infineon-design-system-stencil.cjs.js +1 -1
  100. package/dist/cjs/loader.cjs.js +1 -1
  101. package/dist/collection/collection-manifest.json +1 -0
  102. package/dist/collection/components/accordion/accordion.js +2 -8
  103. package/dist/collection/components/accordion/accordion.js.map +1 -1
  104. package/dist/collection/components/accordion/accordionItem.css +4 -0
  105. package/dist/collection/components/accordion/accordionItem.js +24 -24
  106. package/dist/collection/components/accordion/accordionItem.js.map +1 -1
  107. package/dist/collection/components/alert/alert.js +0 -6
  108. package/dist/collection/components/alert/alert.js.map +1 -1
  109. package/dist/collection/components/badge/badge.js +1 -9
  110. package/dist/collection/components/badge/badge.js.map +1 -1
  111. package/dist/collection/components/breadcrumb/breadcrumb.js +1 -8
  112. package/dist/collection/components/breadcrumb/breadcrumb.js.map +1 -1
  113. package/dist/collection/components/button/button.js +1 -6
  114. package/dist/collection/components/button/button.js.map +1 -1
  115. package/dist/collection/components/card/card.js +3 -8
  116. package/dist/collection/components/card/card.js.map +1 -1
  117. package/dist/collection/components/checkbox/checkbox.js +3 -8
  118. package/dist/collection/components/checkbox/checkbox.js.map +1 -1
  119. package/dist/collection/components/checkbox-group/checkbox-group.js +1 -6
  120. package/dist/collection/components/checkbox-group/checkbox-group.js.map +1 -1
  121. package/dist/collection/components/chip/chip.js +8 -13
  122. package/dist/collection/components/chip/chip.js.map +1 -1
  123. package/dist/collection/components/content-switcher/content-switcher.js +1 -6
  124. package/dist/collection/components/content-switcher/content-switcher.js.map +1 -1
  125. package/dist/collection/components/date-picker/date-picker.js +2 -9
  126. package/dist/collection/components/date-picker/date-picker.js.map +1 -1
  127. package/dist/collection/components/dropdown/dropdown.js +1 -6
  128. package/dist/collection/components/dropdown/dropdown.js.map +1 -1
  129. package/dist/collection/components/file-upload/file-upload.js +2 -9
  130. package/dist/collection/components/file-upload/file-upload.js.map +1 -1
  131. package/dist/collection/components/footer/footer.js +4 -9
  132. package/dist/collection/components/footer/footer.js.map +1 -1
  133. package/dist/collection/components/footer/footer.stories.js +4 -4
  134. package/dist/collection/components/footer/footer.stories.js.map +1 -1
  135. package/dist/collection/components/icon/infineonIconStencil.js +3 -36
  136. package/dist/collection/components/icon/infineonIconStencil.js.map +1 -1
  137. package/dist/collection/components/icon-button/icon-button.js +1 -6
  138. package/dist/collection/components/icon-button/icon-button.js.map +1 -1
  139. package/dist/collection/components/indicator/indicator.js +2 -7
  140. package/dist/collection/components/indicator/indicator.js.map +1 -1
  141. package/dist/collection/components/link/link.js +1 -9
  142. package/dist/collection/components/link/link.js.map +1 -1
  143. package/dist/collection/components/modal/modal.js +2 -9
  144. package/dist/collection/components/modal/modal.js.map +1 -1
  145. package/dist/collection/components/navigation/navbar/navbar.js +3 -5
  146. package/dist/collection/components/navigation/navbar/navbar.js.map +1 -1
  147. package/dist/collection/components/navigation/sidebar/sidebar.js +5 -7
  148. package/dist/collection/components/navigation/sidebar/sidebar.js.map +1 -1
  149. package/dist/collection/components/notification/notification.js +2 -10
  150. package/dist/collection/components/notification/notification.js.map +1 -1
  151. package/dist/collection/components/pagination/pagination.js +1 -6
  152. package/dist/collection/components/pagination/pagination.js.map +1 -1
  153. package/dist/collection/components/progress-bar/progress-bar.js +1 -7
  154. package/dist/collection/components/progress-bar/progress-bar.js.map +1 -1
  155. package/dist/collection/components/radio-button/radio-button.js +2 -7
  156. package/dist/collection/components/radio-button/radio-button.js.map +1 -1
  157. package/dist/collection/components/radio-button-group/radio-button-group.js +1 -6
  158. package/dist/collection/components/radio-button-group/radio-button-group.js.map +1 -1
  159. package/dist/collection/components/search-bar/search-bar.js +1 -6
  160. package/dist/collection/components/search-bar/search-bar.js.map +1 -1
  161. package/dist/collection/components/search-field/search-field.js +1 -9
  162. package/dist/collection/components/search-field/search-field.js.map +1 -1
  163. package/dist/collection/components/segmented-control/segmented-control.js +2 -9
  164. package/dist/collection/components/segmented-control/segmented-control.js.map +1 -1
  165. package/dist/collection/components/select/multi-select/interfaces.js.map +1 -1
  166. package/dist/collection/components/select/multi-select/multiselect-option.css +112 -0
  167. package/dist/collection/components/select/multi-select/multiselect-option.js +505 -0
  168. package/dist/collection/components/select/multi-select/multiselect-option.js.map +1 -0
  169. package/dist/collection/components/select/multi-select/multiselect.css +56 -67
  170. package/dist/collection/components/select/multi-select/multiselect.js +678 -432
  171. package/dist/collection/components/select/multi-select/multiselect.js.map +1 -1
  172. package/dist/collection/components/select/multi-select/multiselect.stories.js +439 -135
  173. package/dist/collection/components/select/multi-select/multiselect.stories.js.map +1 -1
  174. package/dist/collection/components/select/single-select/select.js +2 -7
  175. package/dist/collection/components/select/single-select/select.js.map +1 -1
  176. package/dist/collection/components/slider/slider.css +2 -2
  177. package/dist/collection/components/slider/slider.js +2 -7
  178. package/dist/collection/components/slider/slider.js.map +1 -1
  179. package/dist/collection/components/spinner/spinner.js +2 -10
  180. package/dist/collection/components/spinner/spinner.js.map +1 -1
  181. package/dist/collection/components/status/status.js +1 -9
  182. package/dist/collection/components/status/status.js.map +1 -1
  183. package/dist/collection/components/stepper/step/step.js +4 -4
  184. package/dist/collection/components/stepper/step/step.js.map +1 -1
  185. package/dist/collection/components/stepper/stepper.js +2 -7
  186. package/dist/collection/components/stepper/stepper.js.map +1 -1
  187. package/dist/collection/components/switch/switch.js +1 -6
  188. package/dist/collection/components/switch/switch.js.map +1 -1
  189. package/dist/collection/components/table-advanced-version/filter-bar/filter-bar.js +1 -1
  190. package/dist/collection/components/table-advanced-version/filter-type-group/filter-accordion/filter-accordion.js +2 -2
  191. package/dist/collection/components/table-advanced-version/filter-type-group/filter-search/filter-search.js +1 -1
  192. package/dist/collection/components/table-advanced-version/filter-type-group/filter-type-group.js +1 -1
  193. package/dist/collection/components/table-advanced-version/list/list-entry/list-entry.js +1 -1
  194. package/dist/collection/components/table-advanced-version/set-filter/setFilter.js +19 -2
  195. package/dist/collection/components/table-advanced-version/set-filter/setFilter.js.map +1 -1
  196. package/dist/collection/components/table-advanced-version/table.js +5 -10
  197. package/dist/collection/components/table-advanced-version/table.js.map +1 -1
  198. package/dist/collection/components/table-advanced-version/table.stories.js +2 -3
  199. package/dist/collection/components/table-advanced-version/table.stories.js.map +1 -1
  200. package/dist/collection/components/table-basic-version/table.js +4 -9
  201. package/dist/collection/components/table-basic-version/table.js.map +1 -1
  202. package/dist/collection/components/tabs/tab.js +1 -1
  203. package/dist/collection/components/tabs/tabs.js +3 -7
  204. package/dist/collection/components/tabs/tabs.js.map +1 -1
  205. package/dist/collection/components/tag/tag.js +1 -9
  206. package/dist/collection/components/tag/tag.js.map +1 -1
  207. package/dist/collection/components/templates/template/template.js +1 -1
  208. package/dist/collection/components/templates/templates-ui/templates-ui.js +1 -1
  209. package/dist/collection/components/text-field/text-field.js +4 -9
  210. package/dist/collection/components/text-field/text-field.js.map +1 -1
  211. package/dist/collection/components/textarea/textarea.js +1 -6
  212. package/dist/collection/components/textarea/textarea.js.map +1 -1
  213. package/dist/collection/components/tooltip/tooltip.js +4 -9
  214. package/dist/collection/components/tooltip/tooltip.js.map +1 -1
  215. package/dist/collection/components/tree-view/tree-view-item.js +2 -2
  216. package/dist/collection/components/tree-view/tree-view.js +1 -9
  217. package/dist/collection/components/tree-view/tree-view.js.map +1 -1
  218. package/dist/collection/stories/setup-and-installation/faq/faq.js +1 -1
  219. package/dist/components/ifx-accordion-item.js +1 -1
  220. package/dist/components/ifx-accordion.js +1 -1
  221. package/dist/components/ifx-alert.js +1 -1
  222. package/dist/components/ifx-badge.js +1 -9
  223. package/dist/components/ifx-badge.js.map +1 -1
  224. package/dist/components/ifx-basic-table.js +4 -9
  225. package/dist/components/ifx-basic-table.js.map +1 -1
  226. package/dist/components/ifx-breadcrumb-item-label.js +1 -1
  227. package/dist/components/ifx-breadcrumb.js +1 -8
  228. package/dist/components/ifx-breadcrumb.js.map +1 -1
  229. package/dist/components/ifx-button.js +1 -1
  230. package/dist/components/ifx-card.js +3 -8
  231. package/dist/components/ifx-card.js.map +1 -1
  232. package/dist/components/ifx-checkbox-group.js +2 -7
  233. package/dist/components/ifx-checkbox-group.js.map +1 -1
  234. package/dist/components/ifx-checkbox.js +1 -1
  235. package/dist/components/ifx-chip-item.js +1 -1
  236. package/dist/components/ifx-chip.js +1 -1
  237. package/dist/components/ifx-content-switcher.js +1 -6
  238. package/dist/components/ifx-content-switcher.js.map +1 -1
  239. package/dist/components/ifx-date-picker.js +3 -10
  240. package/dist/components/ifx-date-picker.js.map +1 -1
  241. package/dist/components/ifx-download.js +1 -1
  242. package/dist/components/ifx-dropdown-item.js +1 -1
  243. package/dist/components/ifx-dropdown-separator.js +29 -1
  244. package/dist/components/ifx-dropdown-separator.js.map +1 -1
  245. package/dist/components/ifx-dropdown-trigger-button.js +2 -2
  246. package/dist/components/ifx-dropdown.js +1 -6
  247. package/dist/components/ifx-dropdown.js.map +1 -1
  248. package/dist/components/ifx-faq.js +4 -4
  249. package/dist/components/ifx-file-upload.js +6 -13
  250. package/dist/components/ifx-file-upload.js.map +1 -1
  251. package/dist/components/ifx-filter-accordion.js +4 -4
  252. package/dist/components/ifx-filter-bar.js +3 -3
  253. package/dist/components/ifx-filter-search.js +3 -3
  254. package/dist/components/ifx-filter-type-group.js +1 -1
  255. package/dist/components/ifx-footer.js +4 -9
  256. package/dist/components/ifx-footer.js.map +1 -1
  257. package/dist/components/ifx-icon-button.js +1 -1
  258. package/dist/components/ifx-icon.js +1 -1
  259. package/dist/components/ifx-icons-preview.js +4 -4
  260. package/dist/components/ifx-indicator.js +1 -1
  261. package/dist/components/ifx-link.js +1 -1
  262. package/dist/components/ifx-list-entry.js +4 -4
  263. package/dist/components/ifx-list.js +2 -2
  264. package/dist/components/ifx-modal.js +4 -11
  265. package/dist/components/ifx-modal.js.map +1 -1
  266. package/dist/components/ifx-multiselect-option.d.ts +11 -0
  267. package/dist/components/ifx-multiselect-option.js +8 -0
  268. package/dist/components/ifx-multiselect-option.js.map +1 -0
  269. package/dist/components/ifx-multiselect.js +1 -1
  270. package/dist/components/ifx-navbar-item.js +2 -2
  271. package/dist/components/ifx-navbar.js +4 -6
  272. package/dist/components/ifx-navbar.js.map +1 -1
  273. package/dist/components/ifx-notification.js +1 -1
  274. package/dist/components/ifx-overview-table.js +3 -3
  275. package/dist/components/ifx-pagination.js +1 -1
  276. package/dist/components/ifx-progress-bar.js +1 -1
  277. package/dist/components/ifx-radio-button-group.js +2 -7
  278. package/dist/components/ifx-radio-button-group.js.map +1 -1
  279. package/dist/components/ifx-radio-button.js +1 -1
  280. package/dist/components/ifx-search-bar.js +3 -8
  281. package/dist/components/ifx-search-bar.js.map +1 -1
  282. package/dist/components/ifx-search-field.js +1 -1
  283. package/dist/components/ifx-segment.js +1 -1
  284. package/dist/components/ifx-segmented-control.js +3 -10
  285. package/dist/components/ifx-segmented-control.js.map +1 -1
  286. package/dist/components/ifx-select.js +1 -1
  287. package/dist/components/ifx-set-filter.js +35 -12
  288. package/dist/components/ifx-set-filter.js.map +1 -1
  289. package/dist/components/ifx-sidebar-item.js +2 -2
  290. package/dist/components/ifx-sidebar.js +5 -7
  291. package/dist/components/ifx-sidebar.js.map +1 -1
  292. package/dist/components/ifx-slider.js +4 -9
  293. package/dist/components/ifx-slider.js.map +1 -1
  294. package/dist/components/ifx-spinner.js +1 -1
  295. package/dist/components/ifx-status.js +1 -9
  296. package/dist/components/ifx-status.js.map +1 -1
  297. package/dist/components/ifx-step.js +5 -5
  298. package/dist/components/ifx-step.js.map +1 -1
  299. package/dist/components/ifx-stepper.js +2 -7
  300. package/dist/components/ifx-stepper.js.map +1 -1
  301. package/dist/components/ifx-switch.js +1 -6
  302. package/dist/components/ifx-switch.js.map +1 -1
  303. package/dist/components/ifx-tab.js +1 -1
  304. package/dist/components/ifx-table.js +14 -19
  305. package/dist/components/ifx-table.js.map +1 -1
  306. package/dist/components/ifx-tabs.js +3 -8
  307. package/dist/components/ifx-tabs.js.map +1 -1
  308. package/dist/components/ifx-tag.js +2 -10
  309. package/dist/components/ifx-tag.js.map +1 -1
  310. package/dist/components/ifx-template.js +1 -1
  311. package/dist/components/ifx-templates-ui.js +9 -9
  312. package/dist/components/ifx-text-field.js +1 -1
  313. package/dist/components/ifx-textarea.js +1 -6
  314. package/dist/components/ifx-textarea.js.map +1 -1
  315. package/dist/components/ifx-tooltip.js +5 -10
  316. package/dist/components/ifx-tooltip.js.map +1 -1
  317. package/dist/components/ifx-tree-view-item.js +4 -4
  318. package/dist/components/ifx-tree-view.js +1 -9
  319. package/dist/components/ifx-tree-view.js.map +1 -1
  320. package/dist/components/p-09673a59.js +119 -0
  321. package/dist/components/p-09673a59.js.map +1 -0
  322. package/dist/components/{p-816b2612.js → p-17df0350.js} +2 -7
  323. package/dist/components/p-17df0350.js.map +1 -0
  324. package/dist/components/p-1bb40944.js +602 -0
  325. package/dist/components/p-1bb40944.js.map +1 -0
  326. package/dist/components/{p-e126ea6f.js → p-351949f1.js} +3 -11
  327. package/dist/components/p-351949f1.js.map +1 -0
  328. package/dist/components/{p-54b39a91.js → p-357107c5.js} +3 -8
  329. package/dist/components/p-357107c5.js.map +1 -0
  330. package/dist/components/p-3f51d740.js +432 -0
  331. package/dist/components/p-3f51d740.js.map +1 -0
  332. package/dist/components/{p-9ea9e274.js → p-53d4339c.js} +2 -10
  333. package/dist/components/p-53d4339c.js.map +1 -0
  334. package/dist/components/{p-6d95b3c1.js → p-5e9d3450.js} +2 -8
  335. package/dist/components/p-5e9d3450.js.map +1 -0
  336. package/dist/components/{p-465d3172.js → p-8a645052.js} +3 -11
  337. package/dist/components/p-8a645052.js.map +1 -0
  338. package/dist/components/{p-94da6823.js → p-9142f93b.js} +3 -8
  339. package/dist/components/p-9142f93b.js.map +1 -0
  340. package/dist/components/{p-4fc475c9.js → p-9a258534.js} +4 -37
  341. package/dist/components/p-9a258534.js.map +1 -0
  342. package/dist/components/{p-1ad917f9.js → p-9bdb8233.js} +4 -9
  343. package/dist/components/p-9bdb8233.js.map +1 -0
  344. package/dist/components/{p-830057b3.js → p-ba627b54.js} +2 -8
  345. package/dist/components/p-ba627b54.js.map +1 -0
  346. package/dist/components/{p-24382260.js → p-c90a8438.js} +6 -11
  347. package/dist/components/p-c90a8438.js.map +1 -0
  348. package/dist/components/{p-cf109552.js → p-cdac7da6.js} +5 -10
  349. package/dist/components/p-cdac7da6.js.map +1 -0
  350. package/dist/components/{p-8cb991f4.js → p-cf9adb93.js} +5 -13
  351. package/dist/components/p-cf9adb93.js.map +1 -0
  352. package/dist/components/{p-13578a85.js → p-dda8b55f.js} +7 -7
  353. package/dist/components/{p-13578a85.js.map → p-dda8b55f.js.map} +1 -1
  354. package/dist/components/{p-0905733d.js → p-e4c0ba88.js} +11 -16
  355. package/dist/components/p-e4c0ba88.js.map +1 -0
  356. package/dist/components/{p-cca71d97.js → p-ed739e86.js} +2 -9
  357. package/dist/components/p-ed739e86.js.map +1 -0
  358. package/dist/components/{p-0d6ca0f6.js → p-eebb75a8.js} +3 -8
  359. package/dist/components/p-eebb75a8.js.map +1 -0
  360. package/dist/components/{p-ee0f87ac.js → p-f38c3009.js} +3 -3
  361. package/dist/components/{p-ee0f87ac.js.map → p-f38c3009.js.map} +1 -1
  362. package/dist/components/{p-13126216.js → p-f5675de2.js} +5 -10
  363. package/dist/components/p-f5675de2.js.map +1 -0
  364. package/dist/esm/ifx-accordion_2.entry.js +26 -33
  365. package/dist/esm/ifx-accordion_2.entry.js.map +1 -1
  366. package/dist/esm/ifx-alert_2.entry.js +1 -7
  367. package/dist/esm/ifx-alert_2.entry.js.map +1 -1
  368. package/dist/esm/ifx-badge.entry.js +2 -10
  369. package/dist/esm/ifx-badge.entry.js.map +1 -1
  370. package/dist/esm/ifx-basic-table.entry.js +4 -9
  371. package/dist/esm/ifx-basic-table.entry.js.map +1 -1
  372. package/dist/esm/ifx-breadcrumb.entry.js +1 -8
  373. package/dist/esm/ifx-breadcrumb.entry.js.map +1 -1
  374. package/dist/esm/ifx-button.entry.js +1 -6
  375. package/dist/esm/ifx-button.entry.js.map +1 -1
  376. package/dist/esm/ifx-card.entry.js +3 -8
  377. package/dist/esm/ifx-card.entry.js.map +1 -1
  378. package/dist/esm/ifx-checkbox-group.entry.js +1 -6
  379. package/dist/esm/ifx-checkbox-group.entry.js.map +1 -1
  380. package/dist/esm/ifx-checkbox.entry.js +3 -8
  381. package/dist/esm/ifx-checkbox.entry.js.map +1 -1
  382. package/dist/esm/ifx-chip_3.entry.js +9 -17
  383. package/dist/esm/ifx-chip_3.entry.js.map +1 -1
  384. package/dist/esm/ifx-content-switcher.entry.js +1 -6
  385. package/dist/esm/ifx-content-switcher.entry.js.map +1 -1
  386. package/dist/esm/ifx-date-picker.entry.js +2 -9
  387. package/dist/esm/ifx-date-picker.entry.js.map +1 -1
  388. package/dist/esm/ifx-dropdown.entry.js +1 -6
  389. package/dist/esm/ifx-dropdown.entry.js.map +1 -1
  390. package/dist/esm/ifx-faq.entry.js +1 -1
  391. package/dist/esm/ifx-file-upload.entry.js +2 -9
  392. package/dist/esm/ifx-file-upload.entry.js.map +1 -1
  393. package/dist/esm/ifx-filter-accordion.entry.js +2 -2
  394. package/dist/esm/ifx-filter-bar.entry.js +1 -1
  395. package/dist/esm/ifx-filter-search.entry.js +1 -1
  396. package/dist/esm/ifx-filter-type-group.entry.js +1 -1
  397. package/dist/esm/ifx-footer.entry.js +4 -9
  398. package/dist/esm/ifx-footer.entry.js.map +1 -1
  399. package/dist/esm/ifx-icon-button.entry.js +1 -6
  400. package/dist/esm/ifx-icon-button.entry.js.map +1 -1
  401. package/dist/esm/ifx-icon.entry.js +4 -37
  402. package/dist/esm/ifx-icon.entry.js.map +1 -1
  403. package/dist/esm/ifx-indicator.entry.js +2 -7
  404. package/dist/esm/ifx-indicator.entry.js.map +1 -1
  405. package/dist/esm/ifx-link.entry.js +2 -10
  406. package/dist/esm/ifx-link.entry.js.map +1 -1
  407. package/dist/esm/ifx-list-entry.entry.js +1 -1
  408. package/dist/esm/ifx-modal.entry.js +2 -9
  409. package/dist/esm/ifx-modal.entry.js.map +1 -1
  410. package/dist/esm/ifx-multiselect_2.entry.js +927 -0
  411. package/dist/esm/ifx-multiselect_2.entry.js.map +1 -0
  412. package/dist/esm/ifx-navbar.entry.js +3 -5
  413. package/dist/esm/ifx-navbar.entry.js.map +1 -1
  414. package/dist/esm/ifx-notification.entry.js +3 -11
  415. package/dist/esm/ifx-notification.entry.js.map +1 -1
  416. package/dist/esm/ifx-progress-bar.entry.js +2 -8
  417. package/dist/esm/ifx-progress-bar.entry.js.map +1 -1
  418. package/dist/esm/ifx-radio-button-group.entry.js +1 -6
  419. package/dist/esm/ifx-radio-button-group.entry.js.map +1 -1
  420. package/dist/esm/ifx-radio-button.entry.js +2 -7
  421. package/dist/esm/ifx-radio-button.entry.js.map +1 -1
  422. package/dist/esm/ifx-search-bar.entry.js +1 -6
  423. package/dist/esm/ifx-search-bar.entry.js.map +1 -1
  424. package/dist/esm/ifx-search-field.entry.js +2 -10
  425. package/dist/esm/ifx-search-field.entry.js.map +1 -1
  426. package/dist/esm/ifx-segmented-control.entry.js +2 -9
  427. package/dist/esm/ifx-segmented-control.entry.js.map +1 -1
  428. package/dist/esm/ifx-select.entry.js +2 -7
  429. package/dist/esm/ifx-select.entry.js.map +1 -1
  430. package/dist/esm/ifx-set-filter.entry.js +19 -2
  431. package/dist/esm/ifx-set-filter.entry.js.map +1 -1
  432. package/dist/esm/ifx-sidebar.entry.js +5 -7
  433. package/dist/esm/ifx-sidebar.entry.js.map +1 -1
  434. package/dist/esm/ifx-slider.entry.js +3 -8
  435. package/dist/esm/ifx-slider.entry.js.map +1 -1
  436. package/dist/esm/ifx-spinner_2.entry.js +7 -18
  437. package/dist/esm/ifx-spinner_2.entry.js.map +1 -1
  438. package/dist/esm/ifx-status.entry.js +2 -10
  439. package/dist/esm/ifx-status.entry.js.map +1 -1
  440. package/dist/esm/ifx-step.entry.js +4 -4
  441. package/dist/esm/ifx-step.entry.js.map +1 -1
  442. package/dist/esm/ifx-stepper.entry.js +2 -7
  443. package/dist/esm/ifx-stepper.entry.js.map +1 -1
  444. package/dist/esm/ifx-switch.entry.js +1 -6
  445. package/dist/esm/ifx-switch.entry.js.map +1 -1
  446. package/dist/esm/ifx-tab.entry.js +1 -1
  447. package/dist/esm/ifx-table.entry.js +5 -10
  448. package/dist/esm/ifx-table.entry.js.map +1 -1
  449. package/dist/esm/ifx-tabs.entry.js +2 -7
  450. package/dist/esm/ifx-tabs.entry.js.map +1 -1
  451. package/dist/esm/ifx-tag.entry.js +2 -10
  452. package/dist/esm/ifx-tag.entry.js.map +1 -1
  453. package/dist/esm/ifx-templates-ui.entry.js +1 -1
  454. package/dist/esm/ifx-textarea.entry.js +1 -6
  455. package/dist/esm/ifx-textarea.entry.js.map +1 -1
  456. package/dist/esm/ifx-tooltip.entry.js +4 -9
  457. package/dist/esm/ifx-tooltip.entry.js.map +1 -1
  458. package/dist/esm/ifx-tree-view-item.entry.js +2 -2
  459. package/dist/esm/ifx-tree-view.entry.js +2 -10
  460. package/dist/esm/ifx-tree-view.entry.js.map +1 -1
  461. package/dist/esm/index-6c9eba32.js +14 -14
  462. package/dist/esm/infineon-design-system-stencil.js +1 -1
  463. package/dist/esm/loader.js +1 -1
  464. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js +1 -1
  465. package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js.map +1 -1
  466. package/dist/infineon-design-system-stencil/p-02496917.entry.js +2 -0
  467. package/dist/infineon-design-system-stencil/p-02496917.entry.js.map +1 -0
  468. package/dist/infineon-design-system-stencil/{p-f2bea855.entry.js → p-04d8ea38.entry.js} +2 -2
  469. package/dist/infineon-design-system-stencil/p-061bfdb1.entry.js +2 -0
  470. package/dist/infineon-design-system-stencil/p-061bfdb1.entry.js.map +1 -0
  471. package/dist/infineon-design-system-stencil/{p-87fbd617.entry.js → p-0c1c831c.entry.js} +2 -2
  472. package/dist/infineon-design-system-stencil/p-135110b2.entry.js +2 -0
  473. package/dist/infineon-design-system-stencil/p-135110b2.entry.js.map +1 -0
  474. package/dist/infineon-design-system-stencil/p-13c107bf.entry.js +2 -0
  475. package/dist/infineon-design-system-stencil/p-13c107bf.entry.js.map +1 -0
  476. package/dist/infineon-design-system-stencil/p-17f3f2f5.entry.js +2 -0
  477. package/dist/infineon-design-system-stencil/p-17f3f2f5.entry.js.map +1 -0
  478. package/dist/infineon-design-system-stencil/p-1bf2d4f8.entry.js +2 -0
  479. package/dist/infineon-design-system-stencil/p-1bf2d4f8.entry.js.map +1 -0
  480. package/dist/infineon-design-system-stencil/p-2006c7a0.entry.js +2 -0
  481. package/dist/infineon-design-system-stencil/p-2006c7a0.entry.js.map +1 -0
  482. package/dist/infineon-design-system-stencil/p-292cff35.entry.js +2 -0
  483. package/dist/infineon-design-system-stencil/p-292cff35.entry.js.map +1 -0
  484. package/dist/infineon-design-system-stencil/p-2d89c5e0.entry.js +2 -0
  485. package/dist/infineon-design-system-stencil/p-2d89c5e0.entry.js.map +1 -0
  486. package/dist/infineon-design-system-stencil/p-33a4fd0a.entry.js +2 -0
  487. package/dist/infineon-design-system-stencil/p-33a4fd0a.entry.js.map +1 -0
  488. package/dist/infineon-design-system-stencil/{p-a9cfb70d.entry.js → p-36dcebde.entry.js} +2 -2
  489. package/dist/infineon-design-system-stencil/p-37d6c639.entry.js +2 -0
  490. package/dist/infineon-design-system-stencil/p-37d6c639.entry.js.map +1 -0
  491. package/dist/infineon-design-system-stencil/{p-0f096cf1.entry.js → p-3d037fa4.entry.js} +2 -2
  492. package/dist/infineon-design-system-stencil/p-3d23deba.entry.js +2 -0
  493. package/dist/infineon-design-system-stencil/p-3d23deba.entry.js.map +1 -0
  494. package/dist/infineon-design-system-stencil/p-3ff96710.entry.js +2 -0
  495. package/dist/infineon-design-system-stencil/p-3ff96710.entry.js.map +1 -0
  496. package/dist/infineon-design-system-stencil/p-4764665d.entry.js +2 -0
  497. package/dist/infineon-design-system-stencil/p-4764665d.entry.js.map +1 -0
  498. package/dist/infineon-design-system-stencil/p-47a3e831.entry.js +2 -0
  499. package/dist/infineon-design-system-stencil/p-47a3e831.entry.js.map +1 -0
  500. package/dist/infineon-design-system-stencil/p-487d2155.entry.js +2 -0
  501. package/dist/infineon-design-system-stencil/p-487d2155.entry.js.map +1 -0
  502. package/dist/infineon-design-system-stencil/p-4f82fcfd.entry.js +2 -0
  503. package/dist/infineon-design-system-stencil/p-4f82fcfd.entry.js.map +1 -0
  504. package/dist/infineon-design-system-stencil/p-5e376887.entry.js +2 -0
  505. package/dist/infineon-design-system-stencil/p-5e376887.entry.js.map +1 -0
  506. package/dist/infineon-design-system-stencil/p-5f38cace.entry.js +2 -0
  507. package/dist/infineon-design-system-stencil/p-5f38cace.entry.js.map +1 -0
  508. package/dist/infineon-design-system-stencil/p-6250b9f6.entry.js +2 -0
  509. package/dist/infineon-design-system-stencil/p-6250b9f6.entry.js.map +1 -0
  510. package/dist/infineon-design-system-stencil/p-6790d912.entry.js +2 -0
  511. package/dist/infineon-design-system-stencil/p-6790d912.entry.js.map +1 -0
  512. package/dist/infineon-design-system-stencil/p-6bdca580.entry.js +2 -0
  513. package/dist/infineon-design-system-stencil/p-6bdca580.entry.js.map +1 -0
  514. package/dist/infineon-design-system-stencil/{p-babf3f2d.entry.js → p-6c2698a3.entry.js} +2 -2
  515. package/dist/infineon-design-system-stencil/p-6c999b11.entry.js +2 -0
  516. package/dist/infineon-design-system-stencil/p-6c999b11.entry.js.map +1 -0
  517. package/dist/infineon-design-system-stencil/{p-9c28f35f.entry.js → p-6e7b0250.entry.js} +3 -3
  518. package/dist/infineon-design-system-stencil/p-6e7b0250.entry.js.map +1 -0
  519. package/dist/infineon-design-system-stencil/p-70f4fd1b.entry.js +2 -0
  520. package/dist/infineon-design-system-stencil/p-70f4fd1b.entry.js.map +1 -0
  521. package/dist/infineon-design-system-stencil/p-741ee6fd.entry.js +2 -0
  522. package/dist/infineon-design-system-stencil/p-741ee6fd.entry.js.map +1 -0
  523. package/dist/infineon-design-system-stencil/p-7619bd75.entry.js +2 -0
  524. package/dist/infineon-design-system-stencil/p-7619bd75.entry.js.map +1 -0
  525. package/dist/infineon-design-system-stencil/p-76e0c34f.entry.js +2 -0
  526. package/dist/infineon-design-system-stencil/p-76e0c34f.entry.js.map +1 -0
  527. package/dist/infineon-design-system-stencil/{p-6d99d01d.entry.js → p-7adee2dd.entry.js} +2 -2
  528. package/dist/infineon-design-system-stencil/p-99faadcf.entry.js +2 -0
  529. package/dist/infineon-design-system-stencil/p-99faadcf.entry.js.map +1 -0
  530. package/dist/infineon-design-system-stencil/p-9fc0f50d.entry.js +2 -0
  531. package/dist/infineon-design-system-stencil/p-9fc0f50d.entry.js.map +1 -0
  532. package/dist/infineon-design-system-stencil/p-a2a44fbe.entry.js +2 -0
  533. package/dist/infineon-design-system-stencil/p-a356a82d.entry.js +2 -0
  534. package/dist/infineon-design-system-stencil/p-a356a82d.entry.js.map +1 -0
  535. package/dist/infineon-design-system-stencil/p-a80e321b.entry.js +2 -0
  536. package/dist/infineon-design-system-stencil/p-a80e321b.entry.js.map +1 -0
  537. package/dist/infineon-design-system-stencil/p-aadd1a9d.entry.js +2 -0
  538. package/dist/infineon-design-system-stencil/p-aadd1a9d.entry.js.map +1 -0
  539. package/dist/infineon-design-system-stencil/p-ad1ec9d6.entry.js +2 -0
  540. package/dist/infineon-design-system-stencil/p-ad1ec9d6.entry.js.map +1 -0
  541. package/dist/infineon-design-system-stencil/p-b73a5f18.entry.js +2 -0
  542. package/dist/infineon-design-system-stencil/p-b73a5f18.entry.js.map +1 -0
  543. package/dist/infineon-design-system-stencil/{p-2b38c405.entry.js → p-b7cb706f.entry.js} +2 -2
  544. package/dist/infineon-design-system-stencil/{p-2b38c405.entry.js.map → p-b7cb706f.entry.js.map} +1 -1
  545. package/dist/infineon-design-system-stencil/p-b9c761d3.entry.js +2 -0
  546. package/dist/infineon-design-system-stencil/p-b9c761d3.entry.js.map +1 -0
  547. package/dist/infineon-design-system-stencil/{p-7b7ac7fa.entry.js → p-c7e86c7c.entry.js} +2 -2
  548. package/dist/infineon-design-system-stencil/p-c84ef603.entry.js +2 -0
  549. package/dist/infineon-design-system-stencil/p-c84ef603.entry.js.map +1 -0
  550. package/dist/infineon-design-system-stencil/p-d890b0de.entry.js +2 -0
  551. package/dist/infineon-design-system-stencil/p-d890b0de.entry.js.map +1 -0
  552. package/dist/infineon-design-system-stencil/p-dd28f3a1.entry.js +2 -0
  553. package/dist/infineon-design-system-stencil/p-dd28f3a1.entry.js.map +1 -0
  554. package/dist/infineon-design-system-stencil/p-e571c002.entry.js +2 -0
  555. package/dist/infineon-design-system-stencil/p-e72e5fb2.entry.js +2 -0
  556. package/dist/infineon-design-system-stencil/p-e72e5fb2.entry.js.map +1 -0
  557. package/dist/infineon-design-system-stencil/p-ef6d0dc6.entry.js +2 -0
  558. package/dist/infineon-design-system-stencil/p-ef6d0dc6.entry.js.map +1 -0
  559. package/dist/infineon-design-system-stencil/p-f338fb85.entry.js +2 -0
  560. package/dist/infineon-design-system-stencil/p-f338fb85.entry.js.map +1 -0
  561. package/dist/infineon-design-system-stencil/p-f9a7ae20.entry.js +2 -0
  562. package/dist/infineon-design-system-stencil/p-f9a7ae20.entry.js.map +1 -0
  563. package/dist/types/components/accordion/accordion.d.ts +0 -1
  564. package/dist/types/components/accordion/accordionItem.d.ts +1 -2
  565. package/dist/types/components/alert/alert.d.ts +0 -1
  566. package/dist/types/components/badge/badge.d.ts +0 -2
  567. package/dist/types/components/breadcrumb/breadcrumb.d.ts +0 -1
  568. package/dist/types/components/date-picker/date-picker.d.ts +0 -1
  569. package/dist/types/components/file-upload/file-upload.d.ts +0 -1
  570. package/dist/types/components/icon/infineonIconStencil.d.ts +0 -3
  571. package/dist/types/components/link/link.d.ts +0 -2
  572. package/dist/types/components/modal/modal.d.ts +0 -1
  573. package/dist/types/components/notification/notification.d.ts +0 -2
  574. package/dist/types/components/progress-bar/progress-bar.d.ts +0 -1
  575. package/dist/types/components/search-field/search-field.d.ts +0 -2
  576. package/dist/types/components/segmented-control/segmented-control.d.ts +0 -1
  577. package/dist/types/components/select/multi-select/interfaces.d.ts +1 -1
  578. package/dist/types/components/select/multi-select/multiselect-option.d.ts +36 -0
  579. package/dist/types/components/select/multi-select/multiselect.d.ts +38 -61
  580. package/dist/types/components/select/multi-select/multiselect.stories.d.ts +219 -30
  581. package/dist/types/components/spinner/spinner.d.ts +0 -2
  582. package/dist/types/components/status/status.d.ts +0 -2
  583. package/dist/types/components/tag/tag.d.ts +0 -2
  584. package/dist/types/components/tree-view/tree-view.d.ts +0 -2
  585. package/dist/types/components.d.ts +54 -8
  586. package/package.json +2 -2
  587. package/dist/cjs/dom-utils-2c4573c2.js +0 -20
  588. package/dist/cjs/dom-utils-2c4573c2.js.map +0 -1
  589. package/dist/cjs/ifx-multiselect.cjs.entry.js +0 -550
  590. package/dist/cjs/ifx-multiselect.cjs.entry.js.map +0 -1
  591. package/dist/cjs/tracking-f00364dc.js +0 -41
  592. package/dist/cjs/tracking-f00364dc.js.map +0 -1
  593. package/dist/collection/global/utils/dom-utils.js +0 -15
  594. package/dist/collection/global/utils/dom-utils.js.map +0 -1
  595. package/dist/collection/global/utils/tracking.js +0 -37
  596. package/dist/collection/global/utils/tracking.js.map +0 -1
  597. package/dist/components/p-0905733d.js.map +0 -1
  598. package/dist/components/p-0d6ca0f6.js.map +0 -1
  599. package/dist/components/p-13126216.js.map +0 -1
  600. package/dist/components/p-1ad917f9.js.map +0 -1
  601. package/dist/components/p-1ecafb97.js +0 -18
  602. package/dist/components/p-1ecafb97.js.map +0 -1
  603. package/dist/components/p-24382260.js.map +0 -1
  604. package/dist/components/p-347a1b14.js +0 -603
  605. package/dist/components/p-347a1b14.js.map +0 -1
  606. package/dist/components/p-465d3172.js.map +0 -1
  607. package/dist/components/p-4fc475c9.js.map +0 -1
  608. package/dist/components/p-54b39a91.js.map +0 -1
  609. package/dist/components/p-68016aea.js +0 -33
  610. package/dist/components/p-68016aea.js.map +0 -1
  611. package/dist/components/p-6d95b3c1.js.map +0 -1
  612. package/dist/components/p-6ecb6a6f.js +0 -39
  613. package/dist/components/p-6ecb6a6f.js.map +0 -1
  614. package/dist/components/p-816b2612.js.map +0 -1
  615. package/dist/components/p-830057b3.js.map +0 -1
  616. package/dist/components/p-8cb991f4.js.map +0 -1
  617. package/dist/components/p-94da6823.js.map +0 -1
  618. package/dist/components/p-9ea9e274.js.map +0 -1
  619. package/dist/components/p-cca71d97.js.map +0 -1
  620. package/dist/components/p-cf109552.js.map +0 -1
  621. package/dist/components/p-e126ea6f.js.map +0 -1
  622. package/dist/components/p-fe90e932.js +0 -119
  623. package/dist/components/p-fe90e932.js.map +0 -1
  624. package/dist/esm/dom-utils-1988cdf1.js +0 -18
  625. package/dist/esm/dom-utils-1988cdf1.js.map +0 -1
  626. package/dist/esm/ifx-multiselect.entry.js +0 -546
  627. package/dist/esm/ifx-multiselect.entry.js.map +0 -1
  628. package/dist/esm/tracking-a7efdbcd.js +0 -39
  629. package/dist/esm/tracking-a7efdbcd.js.map +0 -1
  630. package/dist/infineon-design-system-stencil/p-0c60ce87.entry.js +0 -2
  631. package/dist/infineon-design-system-stencil/p-0c60ce87.entry.js.map +0 -1
  632. package/dist/infineon-design-system-stencil/p-14842bbb.entry.js +0 -2
  633. package/dist/infineon-design-system-stencil/p-14842bbb.entry.js.map +0 -1
  634. package/dist/infineon-design-system-stencil/p-19fcf1db.entry.js +0 -2
  635. package/dist/infineon-design-system-stencil/p-19fcf1db.entry.js.map +0 -1
  636. package/dist/infineon-design-system-stencil/p-1ecafb97.js +0 -2
  637. package/dist/infineon-design-system-stencil/p-1ecafb97.js.map +0 -1
  638. package/dist/infineon-design-system-stencil/p-1fd80576.entry.js +0 -2
  639. package/dist/infineon-design-system-stencil/p-1fd80576.entry.js.map +0 -1
  640. package/dist/infineon-design-system-stencil/p-227fa186.entry.js +0 -2
  641. package/dist/infineon-design-system-stencil/p-227fa186.entry.js.map +0 -1
  642. package/dist/infineon-design-system-stencil/p-26c73456.entry.js +0 -2
  643. package/dist/infineon-design-system-stencil/p-26c73456.entry.js.map +0 -1
  644. package/dist/infineon-design-system-stencil/p-296f215f.entry.js +0 -2
  645. package/dist/infineon-design-system-stencil/p-296f215f.entry.js.map +0 -1
  646. package/dist/infineon-design-system-stencil/p-32b0dfda.entry.js +0 -2
  647. package/dist/infineon-design-system-stencil/p-32b0dfda.entry.js.map +0 -1
  648. package/dist/infineon-design-system-stencil/p-34738a10.entry.js +0 -2
  649. package/dist/infineon-design-system-stencil/p-45ac2698.entry.js +0 -2
  650. package/dist/infineon-design-system-stencil/p-45ac2698.entry.js.map +0 -1
  651. package/dist/infineon-design-system-stencil/p-4eda4ef3.entry.js +0 -2
  652. package/dist/infineon-design-system-stencil/p-4eda4ef3.entry.js.map +0 -1
  653. package/dist/infineon-design-system-stencil/p-52420868.entry.js +0 -2
  654. package/dist/infineon-design-system-stencil/p-52420868.entry.js.map +0 -1
  655. package/dist/infineon-design-system-stencil/p-5493e6f5.entry.js +0 -2
  656. package/dist/infineon-design-system-stencil/p-5493e6f5.entry.js.map +0 -1
  657. package/dist/infineon-design-system-stencil/p-5a12d20a.entry.js +0 -2
  658. package/dist/infineon-design-system-stencil/p-5a12d20a.entry.js.map +0 -1
  659. package/dist/infineon-design-system-stencil/p-65255c40.entry.js +0 -2
  660. package/dist/infineon-design-system-stencil/p-65255c40.entry.js.map +0 -1
  661. package/dist/infineon-design-system-stencil/p-65e57b85.entry.js +0 -2
  662. package/dist/infineon-design-system-stencil/p-68423787.entry.js +0 -2
  663. package/dist/infineon-design-system-stencil/p-68423787.entry.js.map +0 -1
  664. package/dist/infineon-design-system-stencil/p-6d72ad32.entry.js +0 -2
  665. package/dist/infineon-design-system-stencil/p-6d72ad32.entry.js.map +0 -1
  666. package/dist/infineon-design-system-stencil/p-6ecb6a6f.js +0 -2
  667. package/dist/infineon-design-system-stencil/p-6ecb6a6f.js.map +0 -1
  668. package/dist/infineon-design-system-stencil/p-73d39ed6.entry.js +0 -2
  669. package/dist/infineon-design-system-stencil/p-73d39ed6.entry.js.map +0 -1
  670. package/dist/infineon-design-system-stencil/p-76914839.entry.js +0 -2
  671. package/dist/infineon-design-system-stencil/p-76914839.entry.js.map +0 -1
  672. package/dist/infineon-design-system-stencil/p-796675ed.entry.js +0 -2
  673. package/dist/infineon-design-system-stencil/p-796675ed.entry.js.map +0 -1
  674. package/dist/infineon-design-system-stencil/p-79b7d7a2.entry.js +0 -2
  675. package/dist/infineon-design-system-stencil/p-79b7d7a2.entry.js.map +0 -1
  676. package/dist/infineon-design-system-stencil/p-82c59e6b.entry.js +0 -2
  677. package/dist/infineon-design-system-stencil/p-82c59e6b.entry.js.map +0 -1
  678. package/dist/infineon-design-system-stencil/p-82dd7e7d.entry.js +0 -2
  679. package/dist/infineon-design-system-stencil/p-82dd7e7d.entry.js.map +0 -1
  680. package/dist/infineon-design-system-stencil/p-877e1d37.entry.js +0 -2
  681. package/dist/infineon-design-system-stencil/p-877e1d37.entry.js.map +0 -1
  682. package/dist/infineon-design-system-stencil/p-8a7bfe65.entry.js +0 -2
  683. package/dist/infineon-design-system-stencil/p-8a7bfe65.entry.js.map +0 -1
  684. package/dist/infineon-design-system-stencil/p-98532a0e.entry.js +0 -2
  685. package/dist/infineon-design-system-stencil/p-98532a0e.entry.js.map +0 -1
  686. package/dist/infineon-design-system-stencil/p-9c28f35f.entry.js.map +0 -1
  687. package/dist/infineon-design-system-stencil/p-a0006775.entry.js +0 -2
  688. package/dist/infineon-design-system-stencil/p-a0006775.entry.js.map +0 -1
  689. package/dist/infineon-design-system-stencil/p-ac7db8d1.entry.js +0 -2
  690. package/dist/infineon-design-system-stencil/p-ac7db8d1.entry.js.map +0 -1
  691. package/dist/infineon-design-system-stencil/p-ae8110b7.entry.js +0 -2
  692. package/dist/infineon-design-system-stencil/p-ae8110b7.entry.js.map +0 -1
  693. package/dist/infineon-design-system-stencil/p-aeaa6d0b.entry.js +0 -2
  694. package/dist/infineon-design-system-stencil/p-aeaa6d0b.entry.js.map +0 -1
  695. package/dist/infineon-design-system-stencil/p-b110d5d4.entry.js +0 -2
  696. package/dist/infineon-design-system-stencil/p-b110d5d4.entry.js.map +0 -1
  697. package/dist/infineon-design-system-stencil/p-b17a0e8c.entry.js +0 -2
  698. package/dist/infineon-design-system-stencil/p-b17a0e8c.entry.js.map +0 -1
  699. package/dist/infineon-design-system-stencil/p-bb7b2a3c.entry.js +0 -2
  700. package/dist/infineon-design-system-stencil/p-bb7b2a3c.entry.js.map +0 -1
  701. package/dist/infineon-design-system-stencil/p-c164c83b.entry.js +0 -2
  702. package/dist/infineon-design-system-stencil/p-c164c83b.entry.js.map +0 -1
  703. package/dist/infineon-design-system-stencil/p-c220733b.entry.js +0 -2
  704. package/dist/infineon-design-system-stencil/p-c220733b.entry.js.map +0 -1
  705. package/dist/infineon-design-system-stencil/p-c88876dc.entry.js +0 -2
  706. package/dist/infineon-design-system-stencil/p-c88876dc.entry.js.map +0 -1
  707. package/dist/infineon-design-system-stencil/p-e0978af0.entry.js +0 -2
  708. package/dist/infineon-design-system-stencil/p-e0978af0.entry.js.map +0 -1
  709. package/dist/infineon-design-system-stencil/p-e5018880.entry.js +0 -2
  710. package/dist/infineon-design-system-stencil/p-e5018880.entry.js.map +0 -1
  711. package/dist/infineon-design-system-stencil/p-ed869b07.entry.js +0 -2
  712. package/dist/infineon-design-system-stencil/p-ed869b07.entry.js.map +0 -1
  713. package/dist/infineon-design-system-stencil/p-eeb59f76.entry.js +0 -2
  714. package/dist/infineon-design-system-stencil/p-eeb59f76.entry.js.map +0 -1
  715. package/dist/infineon-design-system-stencil/p-f3f8d603.entry.js +0 -2
  716. package/dist/infineon-design-system-stencil/p-f3f8d603.entry.js.map +0 -1
  717. package/dist/infineon-design-system-stencil/p-fb6a813b.entry.js +0 -2
  718. package/dist/infineon-design-system-stencil/p-fb6a813b.entry.js.map +0 -1
  719. package/dist/infineon-design-system-stencil/p-fe22fc31.entry.js +0 -2
  720. package/dist/infineon-design-system-stencil/p-fe22fc31.entry.js.map +0 -1
  721. package/dist/types/global/utils/dom-utils.d.ts +0 -1
  722. package/dist/types/global/utils/tracking.d.ts +0 -9
  723. /package/dist/infineon-design-system-stencil/{p-f2bea855.entry.js.map → p-04d8ea38.entry.js.map} +0 -0
  724. /package/dist/infineon-design-system-stencil/{p-87fbd617.entry.js.map → p-0c1c831c.entry.js.map} +0 -0
  725. /package/dist/infineon-design-system-stencil/{p-a9cfb70d.entry.js.map → p-36dcebde.entry.js.map} +0 -0
  726. /package/dist/infineon-design-system-stencil/{p-0f096cf1.entry.js.map → p-3d037fa4.entry.js.map} +0 -0
  727. /package/dist/infineon-design-system-stencil/{p-babf3f2d.entry.js.map → p-6c2698a3.entry.js.map} +0 -0
  728. /package/dist/infineon-design-system-stencil/{p-6d99d01d.entry.js.map → p-7adee2dd.entry.js.map} +0 -0
  729. /package/dist/infineon-design-system-stencil/{p-65e57b85.entry.js.map → p-a2a44fbe.entry.js.map} +0 -0
  730. /package/dist/infineon-design-system-stencil/{p-7b7ac7fa.entry.js.map → p-c7e86c7c.entry.js.map} +0 -0
  731. /package/dist/infineon-design-system-stencil/{p-34738a10.entry.js.map → p-e571c002.entry.js.map} +0 -0
@@ -1,7 +1,5 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
2
- import { t as trackComponent } from './p-6ecb6a6f.js';
3
- import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
4
- import { d as defineCustomElement$1 } from './p-4fc475c9.js';
2
+ import { d as defineCustomElement$1 } from './p-9a258534.js';
5
3
 
6
4
  const alertCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:block}.alert__info-wrapper{display:flex;padding:16px 24px;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert__info-wrapper .info__text-wrapper{display:flex;flex-direction:column;gap:8px;width:100%}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper{display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper,.alert__info-wrapper .info__text-wrapper .info__description-wrapper{color:#1D1D1D;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.alert__info-wrapper .info__text-wrapper .info__headline-wrapper ::slotted(p),.alert__info-wrapper .info__text-wrapper .info__description-wrapper ::slotted(p){padding:0;margin:0}.alert__info-wrapper .info__text-wrapper .info__description-wrapper{font-weight:400}.alert__info-wrapper .close-icon-wrapper{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}.alert__info-wrapper .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert__info-wrapper .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert{display:flex;border:1px solid #0A8276;border-radius:1px;color:#1D1D1D;background-color:#FFFFFF;font-family:var(--ifx-font-family);box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843)}.alert .close-icon-wrapper{display:flex;align-items:center;justify-content:center;min-width:40px}.alert .close-icon-wrapper button{all:unset;display:flex;align-items:center;justify-content:center;line-height:0;color:#1D1D1D;height:24px;width:24px}.alert .close-icon-wrapper button:focus{outline:2px solid #0A8276;outline-offset:2px}.alert .icon-wrapper{position:relative;min-width:48px;display:flex;justify-content:center;align-items:center;background-color:#0A8276}.alert .alert-text{font-size:16px;width:100%;padding:12px 0px 12px 12px;color:#1D1D1D;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;}.alert.primary{border:1px solid #0A8276}.alert.primary .icon-wrapper{background-color:#0A8276;color:#FFFFFF}.alert.success{border:1px solid #4CA460}.alert.success .icon-wrapper{background-color:#4CA460;color:#FFFFFF}.alert.danger{border:1px solid #CD002F}.alert.danger .icon-wrapper{background-color:#CD002F;color:#FFFFFF}.alert.warning{border:1px solid #E16B25}.alert.warning .icon-wrapper{background-color:#E16B25;color:#FFFFFF}.close-icon-wrapper ifx-icon:hover{cursor:pointer}";
7
5
  const IfxAlertStyle0 = alertCss;
@@ -36,14 +34,10 @@ const Alert = /*@__PURE__*/ proxyCustomElement(class Alert extends H {
36
34
  if (!this.uniqueId) {
37
35
  this.uniqueId = this.generateUniqueId('alert');
38
36
  }
39
- if (!isNestedInIfxComponent(this.el)) {
40
- trackComponent('ifx-alert');
41
- }
42
37
  }
43
38
  render() {
44
39
  return this.variant === 'info' ? (h("div", { class: "alert__info-wrapper", role: "alert", "aria-live": this.AriaLive, "aria-describedby": this.alertTypeDescription[this.variant], "aria-labelledby": "alert-text alert-description" }, h("div", { class: "info__text-wrapper" }, h("div", { class: "info__headline-wrapper" }, h("slot", { name: "headline" })), h("div", { id: `alert-description-${this.uniqueId}`, class: "info__description-wrapper" }, h("slot", { name: "desc" }))), this.closable ? this.renderCloseButton() : null)) : (h("div", { class: `alert ${this.variant}`, role: "alert" }, this.icon && (h("div", { class: "icon-wrapper" }, h("ifx-icon", { icon: this.icon }))), h("div", { class: "alert-text", id: `alert-text-${this.uniqueId}` }, h("slot", null)), this.closable ? this.renderCloseButton() : null));
45
40
  }
46
- get el() { return this; }
47
41
  static get style() { return IfxAlertStyle0; }
48
42
  }, [1, "ifx-alert", {
49
43
  "variant": [1],
@@ -73,4 +67,4 @@ function defineCustomElement() {
73
67
 
74
68
  export { Alert as A, defineCustomElement as d };
75
69
 
76
- //# sourceMappingURL=p-830057b3.js.map
70
+ //# sourceMappingURL=p-ba627b54.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-ba627b54.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,8mFAA8mF,CAAC;AAChoF,uBAAe,QAAQ;;MCMV,KAAK;IALlB;;;;;QAMU,YAAO,GAA0D,SAAS,CAAC;QAG3E,aAAQ,GAAY,IAAI,CAAC;QACzB,aAAQ,GAAG,WAAW,CAAC;QAG/B,yBAAoB,GAAG;YACrB,SAAS,EAAE,eAAe;YAC1B,SAAS,EAAE,eAAe;YAC1B,QAAQ,EAAE,aAAa;YACvB,SAAS,EAAE,eAAe;YAC1B,MAAM,EAAE,eAAe;SACxB,CAAC;KAqDH;IAnDC,WAAW;QACT,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;KACtB;IAED,iBAAiB;QACf,QACE,WAAK,KAAK,EAAC,oBAAoB,IAC7B,cAAQ,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAa,eAAe,IACtE,gBAAU,IAAI,EAAC,UAAU,GAAG,CACrB,CACL,EACN;KACH;IAED,gBAAgB,CAAC,MAAM,GAAG,IAAI;QAC5B,OAAO,GAAG,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC;KAClE;IAED,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;SAChD;KACF;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,OAAO,KAAK,MAAM,IAC5B,WAAK,KAAK,EAAC,qBAAqB,EAAC,IAAI,EAAC,OAAO,eAAY,IAAI,CAAC,QAAQ,sBAAoB,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,qBAAkB,8BAA8B,IAC/K,WAAK,KAAK,EAAC,oBAAoB,IAC7B,WAAK,KAAK,EAAC,wBAAwB,IACjC,YAAM,IAAI,EAAC,UAAU,GAAG,CACpB,EACN,WAAK,EAAE,EAAE,qBAAqB,IAAI,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAC,2BAA2B,IAC9E,YAAM,IAAI,EAAC,MAAM,GAAG,CAChB,CACF,EACL,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAC5C,KAEN,WAAK,KAAK,EAAE,SAAS,IAAI,CAAC,OAAO,EAAE,EAAE,IAAI,EAAC,OAAO,IAC9C,IAAI,CAAC,IAAI,KACR,WAAK,KAAK,EAAC,cAAc,IACvB,gBAAU,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CACzB,CACP,EACD,WAAK,KAAK,EAAC,YAAY,EAAC,EAAE,EAAE,cAAc,IAAI,CAAC,QAAQ,EAAE,IACvD,eAAQ,CACJ,EACL,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAC5C,CACP,CAAC;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/alert/alert.scss?tag=ifx-alert&encapsulation=shadow","src/components/alert/alert.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: block;\n}\n\n.alert__info-wrapper {\n display: flex;\n padding: 16px 24px;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n box-shadow: 0px 6px 9px 0px #1D1D1D1A;\n\n & .info__text-wrapper {\n display: flex;\n flex-direction: column;\n gap: tokens.$ifxSpace100;\n width: 100%;\n\n & .info__headline-wrapper {\n display: -webkit-box;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n & .info__headline-wrapper,\n .info__description-wrapper {\n color: #1D1D1D;\n font-size: 16px;\n font-style: normal;\n font-weight: 600;\n line-height: 24px;\n\n ::slotted(p) {\n padding: 0;\n margin: 0;\n }\n }\n\n & .info__description-wrapper {\n font-weight: 400;\n }\n }\n\n & .close-icon-wrapper {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: flex-start;\n //min-width: tokens.$ifxSize500;\n\n & button {\n all: unset;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 0;\n color: tokens.$ifxColorBaseBlack;\n height: tokens.$ifxSize300;\n width: tokens.$ifxSize300;\n\n\n &:focus {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n }\n }\n}\n\n.alert {\n display: flex;\n border: 1px solid tokens.$ifxColorOcean500;\n border-radius: tokens.$ifxBorderRadius12;\n color: tokens.$ifxColorBaseBlack;\n background-color: tokens.$ifxColorBaseWhite;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n box-shadow: 0px 6px 9px 0px #1D1D1D1A;\n\n\n & .close-icon-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: tokens.$ifxSize500;\n\n & button {\n all: unset;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 0;\n color: tokens.$ifxColorBaseBlack;\n height: tokens.$ifxSize300;\n width: tokens.$ifxSize300;\n\n &:focus {\n outline: 2px solid tokens.$ifxColorOcean500;\n outline-offset: 2px;\n }\n }\n }\n\n & .icon-wrapper {\n position: relative;\n min-width: tokens.$ifxSize600;\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: tokens.$ifxColorOcean500;\n }\n\n & .alert-text {\n font-size: 16px;\n width: 100%;\n padding: 12px 0px 12px 12px;\n color: tokens.$ifxColorBaseBlack;\n\n white-space: pre-wrap;\n /* wraps text at spaces and within words */\n word-wrap: break-word;\n /* breaks text within a word if necessary */\n overflow-wrap: anywhere;\n /* breaks text at arbitrary points when needed */\n }\n\n &.primary {\n border: 1px solid tokens.$ifxColorOcean500;\n\n & .icon-wrapper {\n background-color: tokens.$ifxColorOcean500;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &.success {\n border: 1px solid tokens.$ifxColorGreen500;\n\n & .icon-wrapper {\n background-color: tokens.$ifxColorGreen500;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &.danger {\n border: 1px solid tokens.$ifxColorRed500;\n\n & .icon-wrapper {\n background-color: tokens.$ifxColorRed500;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n\n &.warning {\n border: 1px solid tokens.$ifxColorOrange500;\n\n & .icon-wrapper {\n background-color: tokens.$ifxColorOrange500;\n color: tokens.$ifxColorBaseWhite;\n }\n }\n}\n\n.close-icon-wrapper {\n & ifx-icon {\n &:hover {\n cursor: pointer;\n }\n }\n}","import { Component, Prop, h, Event, EventEmitter, State } from '@stencil/core';\n\n@Component({\n tag: 'ifx-alert',\n styleUrl: 'alert.scss',\n shadow: true,\n})\nexport class Alert {\n @Prop() variant: 'primary' | 'success' | 'danger' | 'warning' | 'info' = 'primary';\n @Prop() icon: string;\n @Event() ifxClose: EventEmitter;\n @Prop() closable: boolean = true;\n @Prop() AriaLive = 'assertive';\n @State() uniqueId: string;\n\n alertTypeDescription = {\n \"primary\": 'Neutral alert',\n \"success\": 'Success Alert',\n \"danger\": 'Error Alert',\n \"warning\": 'Warning Alert',\n \"info\": 'Neutral alert',\n };\n\n handleClose() {\n this.ifxClose.emit();\n }\n\n renderCloseButton() {\n return (\n <div class=\"close-icon-wrapper\">\n <button onClick={this.handleClose.bind(this)} aria-label=\"Dismiss alert\">\n <ifx-icon icon=\"cross-16\" />\n </button>\n </div>\n );\n }\n\n generateUniqueId(prefix = 'id') {\n return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n }\n\n componentWillLoad() { \n if (!this.uniqueId) {\n this.uniqueId = this.generateUniqueId('alert');\n }\n }\n\n render() {\n return this.variant === 'info' ? (\n <div class=\"alert__info-wrapper\" role=\"alert\" aria-live={this.AriaLive} aria-describedby={this.alertTypeDescription[this.variant]} aria-labelledby=\"alert-text alert-description\">\n <div class=\"info__text-wrapper\">\n <div class=\"info__headline-wrapper\">\n <slot name=\"headline\" />\n </div>\n <div id={`alert-description-${this.uniqueId}`} class=\"info__description-wrapper\">\n <slot name=\"desc\" />\n </div>\n </div>\n {this.closable ? this.renderCloseButton() : null}\n </div>\n ) : (\n <div class={`alert ${this.variant}`} role=\"alert\">\n {this.icon && (\n <div class=\"icon-wrapper\">\n <ifx-icon icon={this.icon} />\n </div>\n )}\n <div class=\"alert-text\" id={`alert-text-${this.uniqueId}`}>\n <slot />\n </div>\n {this.closable ? this.renderCloseButton() : null}\n </div>\n );\n }\n}\n"],"version":3}
@@ -1,7 +1,5 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
2
- import { t as trackComponent } from './p-6ecb6a6f.js';
3
- import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
4
- import { d as defineCustomElement$1 } from './p-4fc475c9.js';
2
+ import { d as defineCustomElement$1 } from './p-9a258534.js';
5
3
 
6
4
  const textFieldCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:flex}.textInput__container{display:flex;flex-direction:column;align-items:flex-start;padding:0px;width:100%;flex:none;order:0;align-self:stretch;flex-grow:0;font-family:var(--ifx-font-family)}.textInput__container.disabled .textInput__top-wrapper label{color:#575352}.textInput__container.disabled .textInput__bottom-wrapper input{border:1px solid #575352;background-color:#EEEDED}.textInput__container.disabled .textInput__bottom-wrapper input::placeholder{font-size:0.875rem;color:#575352}.textInput__container .textInput__top-wrapper{display:flex;flex-direction:row;align-items:flex-start;padding:0px;gap:4px;flex:none;order:0;align-self:stretch;flex-grow:0}.textInput__container .textInput__top-wrapper label{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;display:flex;align-items:center;color:#1D1D1D;flex:none;order:0;flex-grow:0}.textInput__container .textInput__top-wrapper label .optional-required{margin-left:4px}.textInput__container .textInput__top-wrapper label .optional{margin-left:4px}.textInput__container .textInput__top-wrapper label .required{margin-left:4px}.textInput__container .textInput__top-wrapper label .required.error{color:#CD002F}.textInput__container .input-container{position:relative;display:flex;align-items:center;width:100%}.textInput__container .textInput__bottom-wrapper{flex-grow:1;position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:0px;gap:4px;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper input{width:100%;box-sizing:border-box;display:flex;flex-direction:row;align-items:center;padding:8px 16px;gap:8px;height:40px;background-color:#FFFFFF;color:#1D1D1D;font-family:var(--ifx-font-family);font-size:1rem;line-height:1.5rem;border:1px solid #8D8786;border-radius:1px;flex:none;order:0;align-self:stretch;flex-grow:0;text-overflow:ellipsis}.textInput__container .textInput__bottom-wrapper input.input-s{height:36px;font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.input-s::placeholder{font-size:0.875rem;line-height:1.25rem}.textInput__container .textInput__bottom-wrapper input.icon{padding-left:40px}.textInput__container .textInput__bottom-wrapper input.error{border:1px solid #CD002F}.textInput__container .textInput__bottom-wrapper input.error:focus{outline:none}.textInput__container .textInput__bottom-wrapper input.success{border:1px solid #4CA460}.textInput__container .textInput__bottom-wrapper input.success:focus{outline:none}.textInput__container .textInput__bottom-wrapper input:focus:not(.error,.success){outline:none;border:1px solid #0A8276}.textInput__container .textInput__bottom-wrapper input:hover:not(:disabled,:focus,.error,.success){border:1px solid #575352}.textInput__container .textInput__bottom-wrapper input::placeholder{font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;color:#8D8786;flex:none;order:1;flex-grow:1}.textInput__container .textInput__bottom-wrapper .input-icon{position:absolute;top:50%;transform:translateY(-50%);left:16px;transition:0.3s;color:#8D8786}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption{font-style:normal;font-weight:400;font-size:0.75rem;line-height:1rem;letter-spacing:0.2px;color:#1D1D1D;flex:none;order:1;align-self:stretch;flex-grow:0}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.error{color:#CD002F}.textInput__container .textInput__bottom-wrapper .textInput__bottom-wrapper-caption.disabled{color:#575352}.textInput__container .delete-icon{position:absolute;right:16px}.textInput__container .delete-icon :hover{cursor:pointer}";
7
5
  const IfxTextFieldStyle0 = textFieldCss;
@@ -56,18 +54,15 @@ const TextField = /*@__PURE__*/ proxyCustomElement(class TextField extends H {
56
54
  this.internals.setFormValue("");
57
55
  }
58
56
  componentWillLoad() {
59
- if (!isNestedInIfxComponent(this.el)) {
60
- trackComponent('ifx-text-field');
61
- }
62
57
  this.handleTypeProp();
63
58
  }
64
59
  render() {
65
- return (h("div", { key: '90c91e0f48e309cb22ec297c8a58d3b4cf463b47', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: '0253d226dd7a7d403cadd756c41e8f64abc3c5fa', class: "textInput__top-wrapper" }, h("label", { key: '82f3fc69f50222c97dcf3ac8e721b1fa1009775b', htmlFor: this.internalId }, h("slot", { key: 'c59dd8bd987946944ce216e605c0eff6a8002e04' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: '47b74b65d7700e7f85e328fdfcf42d929b763f75', class: "textInput__bottom-wrapper" }, h("div", { key: '63050336a9989dcbfd1d4fa7ff0c9e9d65ff8708', class: "input-container" }, this.icon && (h("ifx-icon", { key: '7528bf901b9f6f5ebf56851334885cc36806f923', class: 'input-icon', icon: this.icon })), h("input", { key: 'e6eefe13d1b70f5166cce2ca7978155707c75909', ref: (el) => (this.inputElement = el), disabled: this.disabled, autocomplete: this.autocomplete, type: this.internalType, id: this.internalId, value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
60
+ return (h("div", { key: '7e6d9942880560a221d43b3b0a0d5af928ec5a08', "aria-label": "a text field for user input", "aria-value": this.value, "aria-disabled": this.disabled, class: `textInput__container ${this.disabled ? 'disabled' : ""}` }, h("div", { key: '51d490a767e8dd89b86ec21f502e02f0d5cbdc09', class: "textInput__top-wrapper" }, h("label", { key: '7ea9c6e9cae679fd1ba3a5f5a05ec18a44ead60f', htmlFor: this.internalId }, h("slot", { key: '9e3771cd10ad31856f3f4a4bb1873b4ffb255658' }), this.optional && this.required ? (h("span", { class: "optional-required" }, "(optional) *")) : this.optional ? (h("span", { class: "optional" }, "(optional)")) : this.required ? (h("span", { class: `required ${this.error ? 'error' : ""}` }, "*")) : null)), h("div", { key: 'cbce67112a8fd5941bd656f9073142609393318b', class: "textInput__bottom-wrapper" }, h("div", { key: '922d433c60dc90b097fdaa1bb6616c986b0e5f5a', class: "input-container" }, this.icon && (h("ifx-icon", { key: '46cfc15b14449c14dccb67d3feaff46492f1e917', class: 'input-icon', icon: this.icon })), h("input", { key: 'f66cc1e95cdb64937f8231dfbdcae41ecb98fd7e', ref: (el) => (this.inputElement = el), disabled: this.disabled, autocomplete: this.autocomplete, type: this.internalType, id: this.internalId, value: this.value, onInput: () => this.handleInput(), placeholder: this.placeholder, maxlength: this.maxlength, class: `${this.icon ? 'icon' : ""}
66
61
  ${this.error ? 'error' : ""}
67
62
  ${this.size === "s" ? "input-s" : ""}
68
- ${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: '752cf422732168c7aa6ac8d33ec00813e74f0848', class: "delete-icon", icon: "cRemove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
69
- h("div", { key: '9bd4fb69119c920c957a933ba3d9c30927feaa35', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
70
- h("div", { key: 'b41ade4b3db695e6238e8549ed933f65fdce974d', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
63
+ ${this.success ? "success" : ""}` }), (this.showDeleteIcon && this.value) && (h("ifx-icon", { key: 'b6fbd2ec39451aa061a53150cd2519c3648241ad', class: "delete-icon", icon: "cremove16", onClick: () => this.handleDeleteContent() }))), this.caption && !this.error &&
64
+ h("div", { key: 'f78fbb3244d64e9ec1aa5643a06f706db13eb0e3', class: `textInput__bottom-wrapper-caption ${this.disabled} ? disabled : ""` }, this.caption), this.error &&
65
+ h("div", { key: '6290ff909a864d53e4a44859b34307773250ff64', class: "textInput__bottom-wrapper-caption error" }, this.caption))));
71
66
  }
72
67
  static get formAssociated() { return true; }
73
68
  get el() { return this; }
@@ -118,4 +113,4 @@ function defineCustomElement() {
118
113
 
119
114
  export { TextField as T, defineCustomElement as d };
120
115
 
121
- //# sourceMappingURL=p-24382260.js.map
116
+ //# sourceMappingURL=p-c90a8438.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-c90a8438.js","mappings":"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","names":[],"sources":["src/components/text-field/text-field.scss?tag=ifx-text-field&encapsulation=shadow","src/components/text-field/text-field.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: flex;\n}\n\n.textInput__container {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 0px;\n width: 100%;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n &.disabled {\n & .textInput__top-wrapper {\n & label {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n & .textInput__bottom-wrapper {\n input {\n border: 1px solid tokens.$ifxColorEngineering500;\n background-color: tokens.$ifxColorEngineering200;\n\n &::placeholder {\n font-size: tokens.$ifxFontSizeS;\n color: tokens.$ifxColorEngineering500;\n }\n }\n }\n }\n\n & .textInput__top-wrapper {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 0px;\n gap: 4px;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n\n & label {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n display: flex;\n align-items: center;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 0;\n flex-grow: 0;\n\n & .optional-required {\n margin-left: 4px;\n }\n\n & .optional {\n margin-left: 4px;\n }\n\n & .required {\n margin-left: 4px;\n \n &.error {\n color: #CD002F;\n }\n }\n }\n }\n\n .input-container {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n }\n\n\n & .textInput__bottom-wrapper {\n flex-grow: 1;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 0px;\n gap: 4px;\n flex: none;\n order: 1;\n align-self: stretch;\n flex-grow: 0;\n\n & input {\n width: 100%;\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n gap: tokens.$ifxSpace100;\n height: tokens.$ifxSize500;\n background-color: tokens.$ifxColorBaseWhite;\n color: tokens.$ifxColorBaseBlack;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n border: 1px solid tokens.$ifxColorEngineering400;\n border-radius: tokens.$ifxBorderRadius12;\n flex: none;\n order: 0;\n align-self: stretch;\n flex-grow: 0;\n text-overflow: ellipsis;\n\n &.input-s {\n height: tokens.$ifxSize450;\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n\n &::placeholder {\n font-size: tokens.$ifxFontSizeS;\n line-height: tokens.$ifxLineHeightS;\n }\n\n }\n\n &.icon {\n padding-left: tokens.$ifxSpace500;\n }\n\n &.error {\n border: 1px solid #CD002F;\n\n &:focus {\n outline: none;\n }\n }\n\n &.success {\n border: 1px solid #4CA460;\n\n &:focus {\n outline: none;\n }\n }\n\n\n &:focus:not(.error, .success) {\n outline: none;\n border: 1px solid tokens.$ifxColorOcean500;\n }\n\n &:hover:not(:disabled, :focus, .error, .success) {\n border: 1px solid tokens.$ifxColorEngineering500;\n }\n\n &::placeholder {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeM;\n line-height: tokens.$ifxLineHeightM;\n color: #8D8786;\n flex: none;\n order: 1;\n flex-grow: 1;\n }\n }\n\n & .input-icon {\n // Position the icon within the icon container\n // Adjust the positioning as needed\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n left: tokens.$ifxSpace200;\n /* Adjust this value to control the icon's left offset */\n transition: .3s;\n color: tokens.$ifxColorEngineering400;\n }\n\n & .textInput__bottom-wrapper-caption {\n font-style: normal;\n font-weight: 400;\n font-size: tokens.$ifxFontSizeXs;\n line-height: tokens.$ifxLineHeightXs;\n letter-spacing: 0.2px;\n color: tokens.$ifxColorBaseBlack;\n flex: none;\n order: 1;\n align-self: stretch;\n flex-grow: 0;\n\n &.error {\n color: #CD002F;\n\n }\n\n &.disabled {\n color: tokens.$ifxColorEngineering500;\n }\n }\n\n \n }\n .delete-icon {\n position: absolute;\n right: tokens.$ifxSpace200;\n\n :hover {\n cursor: pointer;\n }\n }\n}","import { Component, h, Event, Element, Prop, EventEmitter, Watch, Method, AttachInternals, State } from '@stencil/core';\n \n\n@Component({\n tag: 'ifx-text-field',\n styleUrl: 'text-field.scss',\n shadow: true,\n formAssociated: true\n})\n\nexport class TextField {\n private inputElement: HTMLInputElement;\n @Element() el;\n @Prop() placeholder: string = \"Placeholder\"\n @Prop({ mutable: true }) value: string = '';\n @Prop() error: boolean = false;\n @Prop() label: string = \"\";\n @Prop() icon: string = \"\";\n @Prop() caption: string = \"\";\n @Prop() size: string = 'm';\n @Prop() required: boolean = false;\n @Prop() optional: boolean = false;\n @Prop() success: boolean = false;\n @Prop() disabled: boolean = false;\n @Prop() maxlength?: number;\n @Prop() showDeleteIcon: boolean = false;\n @Prop() autocomplete: string = 'on'\n @Prop() type: 'text' | 'password' = 'text';\n @Prop() internalId: string = \"text-field\"\n @State() internalType: string;\n @Event() ifxInput: EventEmitter<String>;\n // @Prop({ reflect: true })\n // resetOnSubmit: boolean = false;\n\n @AttachInternals() internals: ElementInternals;\n\n\n @Watch('value')\n valueWatcher(newValue: string) {\n if (newValue !== this.inputElement.value) {\n this.inputElement.value = newValue;\n }\n }\n\n @Method()\n async reset() {\n this.value = '';\n this.inputElement.value = '';\n }\n\n handleDeleteContent() {\n this.reset();\n this.ifxInput.emit(this.value);\n }\n\n handleInput() {\n const query = this.inputElement.value;\n this.value = query; // update the value property when input changes\n this.internals.setFormValue(query) // update form value\n this.ifxInput.emit(this.value);\n }\n\n handleTypeProp() { \n this.internalType = this.type === 'text' || this.type === 'password' ? this.type : 'text'\n }\n\n formResetCallback() {\n this.internals.setValidity({});\n this.internals.setFormValue(\"\");\n }\n\n componentWillLoad() { \n this.handleTypeProp()\n }\n\n render() {\n return (\n <div aria-label=\"a text field for user input\" aria-value={this.value} aria-disabled={this.disabled} class={`textInput__container ${this.disabled ? 'disabled' : \"\"}`}>\n <div class=\"textInput__top-wrapper\">\n <label htmlFor={this.internalId}>\n <slot></slot>\n {this.optional && this.required ? (\n <span class=\"optional-required\">(optional) *</span>\n ) : this.optional ? (\n <span class=\"optional\">(optional)</span>\n ) : this.required ? (\n <span class={`required ${this.error ? 'error' : \"\"}`}>*</span>\n ) : null}\n </label>\n </div>\n\n <div class=\"textInput__bottom-wrapper\">\n <div class=\"input-container\">\n {this.icon && (\n <ifx-icon class='input-icon' icon={this.icon} />\n )}\n <input\n ref={(el) => (this.inputElement = el)}\n disabled={this.disabled}\n autocomplete={this.autocomplete}\n type={this.internalType}\n id={this.internalId}\n value={this.value}\n onInput={() => this.handleInput()}\n placeholder={this.placeholder}\n maxlength={this.maxlength}\n class={\n `${this.icon ? 'icon' : \"\"}\n ${this.error ? 'error' : \"\"} \n ${this.size === \"s\" ? \"input-s\" : \"\"}\n ${this.success ? \"success\" : \"\"}`} />\n\n { (this.showDeleteIcon && this.value) && (\n <ifx-icon class=\"delete-icon\" icon=\"cremove16\" onClick={() => this.handleDeleteContent()}></ifx-icon> \n )}\n </div>\n {this.caption && !this.error &&\n <div class={`textInput__bottom-wrapper-caption ${this.disabled} ? disabled : \"\"`}>\n {this.caption}\n </div>}\n {this.error &&\n <div class=\"textInput__bottom-wrapper-caption error\">\n {this.caption}\n </div>}\n </div>\n </div>\n );\n }\n}\n"],"version":3}
@@ -1,9 +1,7 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
2
- import { t as trackComponent } from './p-6ecb6a6f.js';
3
- import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
4
- import { d as defineCustomElement$3 } from './p-4fc475c9.js';
5
- import { d as defineCustomElement$2 } from './p-0d6ca0f6.js';
6
- import { d as defineCustomElement$1 } from './p-1ad917f9.js';
2
+ import { d as defineCustomElement$3 } from './p-9a258534.js';
3
+ import { d as defineCustomElement$2 } from './p-eebb75a8.js';
4
+ import { d as defineCustomElement$1 } from './p-9bdb8233.js';
7
5
 
8
6
  const paginationCss = "@charset \"UTF-8\";:root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-flex}.container{display:inline-flex;justify-content:center;align-items:center;gap:32px;font-family:var(--ifx-font-family)}.container .items__per-page-wrapper{display:flex;align-items:center;gap:16px}.container .items__per-page-wrapper .items__per-page-label{color:#1D1D1D;font-size:14px;font-style:normal;font-weight:600;line-height:20px}.container .items__per-page-wrapper .items__per-page-field{display:flex;flex-direction:column;align-items:flex-start}.container .items__per-page-wrapper .items__per-page-field ifx-select{width:92px}.container .items__total-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .items__total-button{display:flex;width:40px;height:40px;justify-content:center;align-items:center;border-radius:100px;border:1px solid #BFBBBB;background:#FFF}.container .items__total-wrapper .page__numbers-wrapper{display:flex;justify-content:center;align-items:center;gap:12px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item{display:flex;padding:6px;flex-direction:column;justify-content:center;align-items:center;gap:10px;border-radius:100px}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active{background-color:#0A8276}.container .items__total-wrapper .page__numbers-wrapper .page__number-item.active span{color:#fff}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover{cursor:pointer}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:hover:not(.active){background-color:#ddd}.container .items__total-wrapper .page__numbers-wrapper .page__number-item:active:not(.active){background-color:#575352}.container .items__total-wrapper .page__numbers-wrapper .page__number-item span{display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px}.pagination{display:flex}.pagination ifx-icon-button:first-of-type{margin-right:12px}.pagination ifx-icon-button:last-of-type{margin-left:12px}a{padding:8px;border-radius:100px}ol{list-style-type:none;padding:0;margin:0;display:inline-flex;align-items:center;gap:12px}li{display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:100px}li:hover:not(.active) a{background-color:#EEEDED}li:active:not(.active) a{background-color:#575352;color:#fff}li.active{background-color:#0A8276}li.active a{color:#fff}li:hover{cursor:pointer}li a{text-decoration:none;display:flex;width:16px;height:16px;flex-direction:column;justify-content:center;color:#1D1D1D;text-align:center;font-size:13px;font-style:normal;font-weight:400;line-height:20px;align-items:center}.prev.disabled,.next.disabled{cursor:default}.prev.disabled:hover,.next.disabled:hover{cursor:default;text-decoration:none}.prev{margin-right:2.5px}.next{margin-left:2.5px}@media (min-width: 400px){li:first-child,li.active-sibling,li.active,li.active+li,li:last-child{display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8)~li{display:none}li:first-child:nth-last-child(n+8)~li.active-sibling:before{content:\"…\";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li.active+li:after{content:\"…\";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+5){display:inline-flex;flex-direction:row}li:first-child:nth-last-child(n+8)~li:nth-last-child(5):before{content:\"…\";font-size:13px;display:inline-block;margin-right:6px}li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-child(-n+2):after,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):before,li:first-child:nth-last-child(n+8)~li:nth-last-child(-n+2):after,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):before,li:first-child:nth-last-child(n+8)~li.active-sibling:nth-last-child(-n+4):after{display:none !important}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5){display:none}li:first-child:nth-last-child(n+8).active~li:nth-last-child(-n+5):before,li:first-child:nth-last-child(n+8)~li.active~li:nth-last-child(-n+5):before{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+5),li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+5){display:inline-flex !important;flex-direction:row}li:first-child:nth-last-child(n+8).active~li:nth-child(-n+4):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(-n+4):after{display:none}li:first-child:nth-last-child(n+8).active~li:nth-child(5):after,li:first-child:nth-last-child(n+8)~li.active~li:nth-child(5):after{content:\"…\";font-size:13px;display:inline-block;margin-left:6px}li:first-child:nth-last-child(n+8).active:before,li:first-child:nth-last-child(n+8).active:after,li:first-child:nth-last-child(n+8)~li.active:before,li:first-child:nth-last-child(n+8)~li.active:after{display:none}}";
9
7
  const IfxPaginationStyle0 = paginationCss;
@@ -83,9 +81,6 @@ const Pagination = /*@__PURE__*/ proxyCustomElement(class Pagination extends H {
83
81
  this.filteredItemsPerPage = items.map(item => (Object.assign(Object.assign({}, item), { label: item.label || item.value })));
84
82
  }
85
83
  componentWillLoad() {
86
- if (!isNestedInIfxComponent(this.el)) {
87
- trackComponent('ifx-pagination');
88
- }
89
84
  this.calculateNumberOfPages();
90
85
  this.filterOptionsArray();
91
86
  this.updateVisiblePages();
@@ -137,7 +132,7 @@ const Pagination = /*@__PURE__*/ proxyCustomElement(class Pagination extends H {
137
132
  this.initPagination();
138
133
  }
139
134
  render() {
140
- return (h("div", { key: '120f6db1f0899a6cf1a0c8418c1712e1b50726d2', class: "container" }, h("div", { key: 'd21a7b940b7235c1d67c3ffa2bbb87463e9e0e1f', class: "items__per-page-wrapper" }, h("div", { key: '1747ac5690181c57305189fd2ace9e9651a01d28', class: "items__per-page-label" }, "Results per Page"), h("div", { key: 'a437b3410a46f1059b57ba2c9b7d3ac96a73d0b1', class: "items__per-page-field" }, h("ifx-select", { key: '6f01aaf8efecbbdeeb7180077e98dcf1851b130f', placeholder: 'false', "show-search": 'false', value: undefined, disabled: false, error: false, size: "s", options: this.filteredItemsPerPage, "placeholder-value": "Select" }))), h("div", { key: '45379d16c815cb271eab074bfb334256d0b8293e', class: "items__total-wrapper" }, h("div", { key: '8c567a2f79cee9affcd7002fcf6808dca68945d3', class: "pagination" }, h("ifx-icon-button", { key: '681ffc9a5f5d61520176fb2e4dfe44035d566a41', class: "prev", icon: "arrow-left-16", onClick: () => this.changePage(this.internalPage - 1) }), h("ol", { key: '19e46d1c5f3846f13186d587d5a01e1e2169db4f' }, this.visiblePages.map((page, i) => typeof page === 'number' ? (h("li", { key: `page-${page}`, class: { [this.CLASS_ACTIVE]: page === this.internalPage }, "data-page": page }, h("a", { href: "javascript:void(0)" }, page))) : (h("li", { class: "ellipsis", key: `ellipsis-${i}` }, h("span", null, "..."))))), h("ifx-icon-button", { key: '65b5dfd4edde059345875a0443edb218cde7d6ac', class: "next", icon: "arrow-right-16", onClick: () => this.changePage(this.internalPage + 1) })))));
135
+ return (h("div", { key: 'f34d51257e81560aec1de209b91a18f8d3b80909', class: "container" }, h("div", { key: 'b437f38a7c494793ef43392a5200602d1ea280f7', class: "items__per-page-wrapper" }, h("div", { key: '54fb7a4952ad76351188a3177611bf4bca95b007', class: "items__per-page-label" }, "Results per Page"), h("div", { key: 'd0bc72f83111f631485da2b6fe52b29c98208c83', class: "items__per-page-field" }, h("ifx-select", { key: '62eea5b69a124994a159f04119cdcf5e54cb6e8e', placeholder: 'false', "show-search": 'false', value: undefined, disabled: false, error: false, size: "s", options: this.filteredItemsPerPage, "placeholder-value": "Select" }))), h("div", { key: '689680c6df19027528fffd8e9ff4938952e9245f', class: "items__total-wrapper" }, h("div", { key: 'be26d81808f23878a51cf1fb9992433c6abeed26', class: "pagination" }, h("ifx-icon-button", { key: '6abeed920c4f97763170459f714a3c2a0f7b144c', class: "prev", icon: "arrow-left-16", onClick: () => this.changePage(this.internalPage - 1) }), h("ol", { key: 'bce48e8aed58fa1f92a04a294fa1dcffd04ed42c' }, this.visiblePages.map((page, i) => typeof page === 'number' ? (h("li", { key: `page-${page}`, class: { [this.CLASS_ACTIVE]: page === this.internalPage }, "data-page": page }, h("a", { href: "javascript:void(0)" }, page))) : (h("li", { class: "ellipsis", key: `ellipsis-${i}` }, h("span", null, "..."))))), h("ifx-icon-button", { key: '7e63ce955d14f7f19219bc856ca0bce02b180e08', class: "next", icon: "arrow-right-16", onClick: () => this.changePage(this.internalPage + 1) })))));
141
136
  }
142
137
  get el() { return this; }
143
138
  static get style() { return IfxPaginationStyle0; }
@@ -182,4 +177,4 @@ function defineCustomElement() {
182
177
 
183
178
  export { Pagination as P, defineCustomElement as d };
184
179
 
185
- //# sourceMappingURL=p-cf109552.js.map
180
+ //# sourceMappingURL=p-cdac7da6.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-cdac7da6.js","mappings":"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","names":[],"sources":["src/components/pagination/pagination.scss?tag=ifx-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-flex;\n}\n\n.container {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n gap: 32px;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n\n\n & .items__per-page-wrapper {\n display: flex;\n align-items: center;\n gap: 16px;\n\n & .items__per-page-label {\n color: #1D1D1D;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: 20px;\n }\n\n & .items__per-page-field {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n\n & ifx-select {\n width: 92px;\n }\n }\n }\n\n & .items__total-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 12px;\n\n & .items__total-button {\n display: flex;\n width: 40px;\n height: 40px;\n justify-content: center;\n align-items: center;\n border-radius: 100px;\n border: 1px solid #BFBBBB;\n background: #FFF;\n }\n\n & .page__numbers-wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 12px;\n\n & .page__number-item {\n display: flex;\n padding: 6px;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 10px;\n border-radius: 100px;\n\n &.active {\n background-color: #0A8276;\n\n & span {\n color: #fff;\n }\n }\n\n &:hover {\n cursor: pointer;\n }\n\n &:hover:not(.active) {\n background-color: #ddd;\n\n }\n\n &:active:not(.active) {\n background-color: #575352;\n }\n\n & span {\n display: flex;\n width: 16px;\n height: 16px;\n flex-direction: column;\n justify-content: center;\n color: #1D1D1D;\n text-align: center;\n font-size: 13px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n }\n }\n }\n}\n\n\n.pagination {\n display: flex;\n\n & ifx-icon-button:first-of-type {\n margin-right: 12px;\n }\n\n & ifx-icon-button:last-of-type {\n margin-left: 12px;\n }\n}\n\na {\n padding: 8px;\n border-radius: 100px;\n}\n\nol {\n list-style-type: none;\n padding: 0;\n margin: 0;\n display: inline-flex;\n align-items: center;\n gap: 12px;\n}\n\nli {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n border-radius: 100px;\n\n &:hover:not(.active) {\n & a {\n background-color: #EEEDED;\n }\n }\n\n &:active:not(.active) {\n & a {\n background-color: #575352;\n color: #fff;\n }\n }\n\n &.active {\n background-color: #0A8276;\n\n & a {\n color: #fff;\n }\n }\n\n &:hover {\n cursor: pointer;\n }\n\n & a {\n text-decoration: none;\n display: flex;\n width: 16px;\n height: 16px;\n flex-direction: column;\n justify-content: center;\n color: #1D1D1D;\n text-align: center;\n font-size: 13px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n align-items: center;\n }\n}\n\n.prev,\n.next {\n &.disabled {\n cursor: default;\n\n &:hover {\n cursor: default;\n text-decoration: none;\n }\n }\n}\n\n.prev {\n margin-right: 2.5px;\n}\n\n.next {\n margin-left: 2.5px;\n}\n\n\n@mixin ellipsis($before: true) {\n content: \"\\2026\";\n font-size: 13px;\n display: inline-block;\n\n @if($before) {\n margin-right: 6px;\n }\n\n @else {\n margin-left: 6px;\n }\n}\n\n\n// @media(max-width:460px) {\n// li {\n\n// &:first-child,\n// &.active,\n// &.active-sibling:nth-last-child(2), // Show second to last child if the last one is active\n// &:last-child {\n// //display: inline-block !important;\n// display: inline-flex !important;\n// flex-direction: row;\n// }\n\n// $how-many-on-ends: 3; // 1,2,3,...,10 || 1,...,8,9,10\n// // There are >= 5 pages\n// &:first-child:nth-last-child(n+6) {\n\n// &~li {\n// // Start out with all siblings hidden\n// display: none;\n\n// // Show the last children in the list by default\n// &:nth-last-child(-n+#{$how-many-on-ends}) {\n// //display: inline-block;\n// display: inline-flex;\n// flex-direction: row;\n\n// }\n\n// // The child at the beginning of the last group shows ellipsis for the group\n// &:nth-last-child(#{$how-many-on-ends}) {\n// &:before {\n// @include ellipsis(true);\n// }\n// }\n\n// // The very beginning elements do not need to show ellipsis\n// // The very end elements do not need to show ellipsis\n// }\n\n\n// &.active,\n// &~li.active {\n\n// // Show ellipsis before and after the active element\n// &:before {\n// @include ellipsis(true);\n// }\n// &:after {\n// @include ellipsis(false);\n// }\n\n\n// // If the active element is in the first or last group, don't show ellipsis (siblings will take care of it)\n// &:nth-child(-n+#{$how-many-on-ends - 1}),\n// &:nth-last-child(-n+#{$how-many-on-ends - 1}) {\n// &:before, &:after {\n// display: none;\n// }\n// }\n\n// // Hide the last group if \"active\" comes before them\n// &~li:nth-last-child(-n+#{$how-many-on-ends}) {\n// display: none;\n// }\n\n// // Show the first group together if \"active\" comes before them\n// &~li:nth-child(-n+#{$how-many-on-ends}) {\n// //display: inline-block;\n// display: inline-flex;\n// flex-direction: row;\n// }\n\n// // If \"active\" is before the last member in the group, don't show ellipsis\n// &~li:nth-child(-n+#{$how-many-on-ends - 1}) {\n// &:after {\n// display: none;\n// }\n// }\n\n\n// // The child at the end of the first group shows ellipsis for the group\n// &~li:nth-child(#{$how-many-on-ends}) {\n// &:after {\n// @include ellipsis(false);\n// }\n// }\n// }\n// }\n// }\n// }\n\n@media (min-width: 400px) {\n li {\n\n &:first-child,\n &.active-sibling,\n &.active,\n &.active+li,\n &:last-child {\n //display: inline-block!important;\n display: inline-flex !important;\n flex-direction: row;\n }\n\n // There are >= 7 pages\n &:first-child:nth-last-child(n+8) {\n $how-many-on-ends: 5; // 1,2,3,4,5,...,10 || 1,...6,7,8,9,10\n\n &~li {\n // Start out with all siblings hidden\n display: none;\n\n // Show ellipsis before the previous one\n &.active-sibling:before {\n @include ellipsis(true);\n }\n\n // Show ellipsis after the next one\n &.active+li:after {\n @include ellipsis(false);\n }\n\n // Show the last children in the list by default\n &:nth-last-child(-n+#{$how-many-on-ends}) {\n //display: inline-block;\n display: inline-flex;\n flex-direction: row;\n }\n\n // The child at the beginning of the last group shows ellipsis for the group\n &:nth-last-child(#{$how-many-on-ends}) {\n &:before {\n @include ellipsis(true);\n }\n }\n\n // The very beginning elements do not need to show ellipsis\n &:nth-child(-n+#{$how-many-on-ends - 3}),\n // The very end elements do not need to show ellipsis\n &:nth-last-child(-n+#{$how-many-on-ends - 3}),\n // Even if it's a sibling to \"active\"\n &.active-sibling:nth-last-child(-n+#{$how-many-on-ends - 1}) {\n\n &:before,\n &:after {\n display: none !important;\n }\n }\n }\n\n &.active,\n &~li.active {\n\n // Hide the last group if \"active\" comes before them\n &~li:nth-last-child(-n+#{$how-many-on-ends}) {\n display: none;\n\n // If there is overlap, the element will show, but hide it's ellipsis\n &:before {\n display: none;\n }\n }\n\n // Show the first group together if \"active\" comes before them\n &~li:nth-child(-n+#{$how-many-on-ends}) {\n //display: inline-block;\n display: inline-flex !important;\n flex-direction: row;\n }\n\n // If \"active\" is before the last member in the group, don't show ellipsis\n &~li:nth-child(-n+#{$how-many-on-ends - 1}) {\n &:after {\n display: none;\n }\n }\n\n\n // The child at the end of the first group shows ellipsis for the group\n &~li:nth-child(#{$how-many-on-ends}) {\n &:after {\n @include ellipsis(false);\n }\n }\n\n // \"active\" should never show ellipsis\n &:before,\n &:after {\n display: none;\n }\n }\n }\n }\n}","import { Component, h, Element, Event, EventEmitter, Prop, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'ifx-pagination',\n styleUrl: 'pagination.scss',\n shadow: true\n})\nexport class Pagination {\n @Element() el: HTMLElement;\n @Event() ifxPageChange: EventEmitter;\n @Prop() currentPage: number = 1;\n @State() internalPage: number = 1;\n @State() internalItemsPerPage: number = 10;\n @State() numberOfPages: number[] = [];\n @Prop() total: number = 1;\n @Prop() itemsPerPage: any[] | string;\n @State() filteredItemsPerPage: any[] = [];\n @State() visiblePages: (number | string)[] = [];\n\n private CLASS_DISABLED = \"disabled\";\n private CLASS_ACTIVE = \"active\";\n private prevInternalPage: number;\n\n @Listen('ifxSelect')\n setItemsPerPage(e: CustomEvent) {\n const selectedValue = e.detail?.value || e.detail?.label; \n const newItemsPerPage = parseInt(selectedValue) || 10;\n\n if (newItemsPerPage === this.internalItemsPerPage) {\n return;\n }\n\n this.internalItemsPerPage = newItemsPerPage;\n this.internalPage = 1; \n this.calculateNumberOfPages();\n this.updateVisiblePages();\n this.handleEventEmission();\n }\n\n componentDidLoad() {\n this.initPagination();\n }\n\n updateVisiblePages() {\n const buffer = 2;\n const totalPages = this.numberOfPages.length;\n const current = this.internalPage;\n let pages: (number | string)[] = [];\n \n if (totalPages <= 5) {\n pages = [...this.numberOfPages];\n } else {\n pages.push(1);\n \n if (current > buffer + 1) pages.push('...');\n \n let start = Math.max(2, current - buffer);\n let end = Math.min(totalPages - 1, current + buffer);\n \n if (current <= buffer + 1) end = buffer * 2 + 1;\n if (current >= totalPages - buffer) start = totalPages - buffer * 2;\n \n for (let i = start; i <= end; i++) pages.push(i);\n \n if (current < totalPages - buffer) pages.push('...');\n pages.push(totalPages);\n }\n \n this.visiblePages = [...new Set(pages)];\n }\n\n calculateNumberOfPages() {\n const totalPages = Math.ceil(this.total / this.internalItemsPerPage);\n this.numberOfPages = Array.from({ length: totalPages }, (_, i) => i + 1);\n this.internalPage = Math.max(1, Math.min(this.currentPage, totalPages));\n }\n\n filterOptionsArray() { \n const items = typeof this.itemsPerPage === 'string' ? \n JSON.parse(this.itemsPerPage) : this.itemsPerPage;\n this.filteredItemsPerPage = items.map(item => ({\n ...item,\n label: item.label || item.value\n }));\n }\n\n componentWillLoad() {\n this.calculateNumberOfPages();\n this.filterOptionsArray();\n this.updateVisiblePages();\n }\n\n componentWillUpdate() { \n if (this.prevInternalPage !== this.internalPage) {\n this.updateVisiblePages();\n this.prevInternalPage = this.internalPage;\n }\n }\n\n componentDidUpdate() {\n this.initPagination();\n }\n\n handleEventEmission() {\n this.ifxPageChange.emit({\n currentPage: this.internalPage,\n totalPages: this.numberOfPages.length,\n itemsPerPage: this.internalItemsPerPage\n });\n }\n\n initPagination() {\n const pagination = this.el.shadowRoot.querySelector('.pagination');\n if (!pagination) return;\n\n const updateButtons = () => {\n const prev = pagination.querySelector<HTMLButtonElement>('.prev');\n const next = pagination.querySelector<HTMLButtonElement>('.next');\n if (prev) {\n prev.disabled = this.internalPage === 1;\n prev.classList.toggle(this.CLASS_DISABLED, this.internalPage === 1);\n }\n if (next) {\n next.disabled = this.internalPage === this.numberOfPages.length;\n next.classList.toggle(this.CLASS_DISABLED, this.internalPage === this.numberOfPages.length);\n }\n };\n\n pagination.querySelectorAll('li').forEach(li => {\n li.removeEventListener('click', this.handlePageClick);\n li.addEventListener('click', this.handlePageClick);\n });\n\n updateButtons();\n }\n\n private handlePageClick = (e: Event) => {\n const li = e.currentTarget as HTMLLIElement;\n const page = parseInt(li.dataset.page);\n if (!isNaN(page)) this.changePage(page);\n };\n\n changePage(newPage: number) {\n newPage = Math.max(1, Math.min(newPage, this.numberOfPages.length));\n if (newPage === this.internalPage) return;\n \n this.internalPage = newPage;\n this.handleEventEmission();\n this.initPagination();\n }\n\n render() {\n return (\n <div class=\"container\">\n <div class=\"items__per-page-wrapper\">\n <div class=\"items__per-page-label\">Results per Page</div>\n <div class=\"items__per-page-field\">\n <ifx-select\n placeholder='false'\n show-search='false'\n value={undefined}\n disabled={false}\n error={false}\n size=\"s\"\n options={this.filteredItemsPerPage}\n placeholder-value=\"Select\"\n ></ifx-select>\n </div>\n </div>\n \n <div class=\"items__total-wrapper\">\n <div class=\"pagination\">\n <ifx-icon-button\n class=\"prev\"\n icon=\"arrow-left-16\"\n onClick={() => this.changePage(this.internalPage - 1)}\n ></ifx-icon-button>\n \n <ol>\n {this.visiblePages.map((page, i) => typeof page === 'number' ? (\n <li \n key={`page-${page}`}\n class={{ [this.CLASS_ACTIVE]: page === this.internalPage }}\n data-page={page}\n >\n <a href=\"javascript:void(0)\">{page}</a>\n </li>\n ) : (\n <li class=\"ellipsis\" key={`ellipsis-${i}`}>\n <span>...</span>\n </li>\n ))}\n </ol>\n \n <ifx-icon-button\n class=\"next\"\n icon=\"arrow-right-16\"\n onClick={() => this.changePage(this.internalPage + 1)}\n ></ifx-icon-button>\n </div>\n </div>\n </div>\n );\n }\n}"],"version":3}
@@ -1,8 +1,6 @@
1
1
  import { p as proxyCustomElement, H, h, d as Host } from './p-f8e6a4ef.js';
2
- import { t as trackComponent } from './p-6ecb6a6f.js';
3
- import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
4
- import { d as defineCustomElement$2 } from './p-4fc475c9.js';
5
- import { d as defineCustomElement$1 } from './p-9ea9e274.js';
2
+ import { d as defineCustomElement$2 } from './p-9a258534.js';
3
+ import { d as defineCustomElement$1 } from './p-53d4339c.js';
6
4
 
7
5
  const notificationCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}.ifx-notification__wrapper{display:flex;flex-direction:row;align-items:center;padding:8px 16px;background-color:#FFFFFF;font-family:var(--ifx-font-family);color:#1D1D1D;border:1px solid #EEEDED}.ifx-notification__wrapper.ifx-notification__wrapper--success{border-left:4px solid #4CA460}.ifx-notification__wrapper.ifx-notification__wrapper--success .ifx-notification__icon{color:#4CA460}.ifx-notification__wrapper.ifx-notification__wrapper--locked{border-left:4px solid #E16B25}.ifx-notification__wrapper.ifx-notification__wrapper--locked .ifx-notification__icon{color:#E16B25}.ifx-notification__wrapper.ifx-notification__wrapper--error{border-left:4px solid #CD002F}.ifx-notification__wrapper.ifx-notification__wrapper--error .ifx-notification__icon{color:#CD002F}.ifx-notification__wrapper.ifx-notification__wrapper--neutral{border-left:4px solid #0A8276}.ifx-notification__wrapper.ifx-notification__wrapper--neutral .ifx-notification__icon{color:#0A8276}.ifx-notification__wrapper .ifx-notification__icon{margin-right:8px;display:flex;align-self:center}.ifx-notification__wrapper .ifx-notification__body{display:flex;flex-direction:row;flex-grow:1;font-size:0.875rem}.ifx-notification__wrapper .ifx-notification__body .ifx-notification__slot{flex-grow:1;display:inline-flex;align-items:center}.ifx-notification__wrapper .ifx-notification__link{font-size:0.875rem}@media (max-width: 576px){.ifx-notification__wrapper .ifx-notification__icon{align-self:flex-start}.ifx-notification__wrapper .ifx-notification__body{flex-direction:column}.ifx-notification__wrapper .ifx-notification__link{margin-top:8px}}";
8
6
  const IfxNotificationStyle0 = notificationCss;
@@ -15,11 +13,6 @@ const Notification = /*@__PURE__*/ proxyCustomElement(class Notification extends
15
13
  this.variant = 'success';
16
14
  this.linkTarget = '_blank';
17
15
  }
18
- componentWillLoad() {
19
- if (!isNestedInIfxComponent(this.el)) {
20
- trackComponent('ifx-notification');
21
- }
22
- }
23
16
  getClassName() {
24
17
  switch (this.variant) {
25
18
  case 'success':
@@ -35,10 +28,9 @@ const Notification = /*@__PURE__*/ proxyCustomElement(class Notification extends
35
28
  }
36
29
  }
37
30
  render() {
38
- return (h(Host, { key: 'f4778d8c9d176d004af0356716b3f7dd6bdaaf2e' }, h("div", { key: 'be795f7d0819ad1f6847a5dd44e5c4d87f712956', class: "ifx-notification__wrapper " + this.getClassName() }, h("div", { key: 'c016988ac10a8f5b5bd7c808eb9a32ab624a88ec', class: "ifx-notification__icon" }, h("ifx-icon", { key: '52b0087e6be1fb1a2a53b7dc911a1f9cb82e241c', icon: this.icon })), h("div", { key: 'b474db0e0f1e233439efd5c296902a6e003f4da7', class: "ifx-notification__body" }, h("div", { key: 'ffa148a9926bb29a4b111e64c9a9a3f57f41a5a2', class: "ifx-notification__slot" }, h("slot", { key: '570ec61f92ff65c2cac316c6edcf2df46276ae51' })), this.linkText && this.linkHref &&
39
- h("div", { key: 'dad0818ba2662f839a68a34e57a48e653fbae0c4', class: "ifx-notification__link" }, h("ifx-link", { key: '595e62d8ebeb1e71bbd5e963e06a7d8f6beffbfa', href: this.linkHref, target: this.linkTarget }, this.linkText, h("ifx-icon", { key: '63a580c022a66faaf91f7f92ff23d61158944555', icon: "arrow-right-16" })))))));
31
+ return (h(Host, { key: 'e2ab3e7cd454516b3c9bacded8acd514f8acf6bb' }, h("div", { key: 'd697282d6b47fed553f2130b63b32858adb6e69a', class: "ifx-notification__wrapper " + this.getClassName() }, h("div", { key: '9380c5dc81b6be5fe94f135e68af584c0be33999', class: "ifx-notification__icon" }, h("ifx-icon", { key: 'd93f47c6edf12e5578f681a1e2833e13cf316a73', icon: this.icon })), h("div", { key: 'cb4074d0f34c00043da6a25d86e9a7f0026fc0f3', class: "ifx-notification__body" }, h("div", { key: '8d6c5a5fb3e7dc4a17fec88b0f0e5818c5c4dacd', class: "ifx-notification__slot" }, h("slot", { key: 'ddc531bff82a4f0503dc5a31a44936bc06278a30' })), this.linkText && this.linkHref &&
32
+ h("div", { key: '5a04c972588dcad668fe4f177b2dfe1073ea1a8a', class: "ifx-notification__link" }, h("ifx-link", { key: 'e1a479722c277eec76e5d2f77fd1308047d1ed15', href: this.linkHref, target: this.linkTarget }, this.linkText, h("ifx-icon", { key: '68d0ab0162a138cafdca9bfe26ae321b510ed8fe', icon: "arrow-right-16" })))))));
40
33
  }
41
- get el() { return this; }
42
34
  static get style() { return IfxNotificationStyle0; }
43
35
  }, [1, "ifx-notification", {
44
36
  "icon": [1],
@@ -73,4 +65,4 @@ function defineCustomElement() {
73
65
 
74
66
  export { Notification as N, defineCustomElement as d };
75
67
 
76
- //# sourceMappingURL=p-8cb991f4.js.map
68
+ //# sourceMappingURL=p-cf9adb93.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-cf9adb93.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,uoDAAuoD,CAAC;AAChqD,8BAAe,eAAe;;MCQjB,YAAY;IALzB;;;;QAOU,YAAO,GAAwB,SAAS,CAAC;QAGzC,eAAU,GAAW,QAAQ,CAAC;KA0CvC;IAvCS,YAAY;QAClB,QAAQ,IAAI,CAAC,OAAO;YAClB,KAAK,SAAS;gBACZ,OAAO,oCAAoC,CAAC;YAC9C,KAAK,QAAQ;gBACX,OAAO,mCAAmC,CAAC;YAC7C,KAAK,OAAO;gBACV,OAAO,kCAAkC,CAAC;YAC5C,KAAK,SAAS;gBACZ,OAAO,oCAAoC,CAAC;YAC9C;gBACE,OAAO,oCAAoC,CAAC;SAC/C;KACF;IAED,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAE,4BAA4B,GAAG,IAAI,CAAC,YAAY,EAAE,IAC5D,4DAAK,KAAK,EAAC,wBAAwB,IACjC,iEAAU,IAAI,EAAE,IAAI,CAAC,IAAI,GAAa,CAClC,EACN,4DAAK,KAAK,EAAC,wBAAwB,IACjC,4DAAK,KAAK,EAAC,wBAAwB,IACjC,8DAAO,CACH,EACJ,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;YAChC,4DAAK,KAAK,EAAC,wBAAwB,IACjC,iEAAU,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,UAAU,IACnD,IAAI,CAAC,QAAQ,EAAC,iEAAU,IAAI,EAAC,gBAAgB,GACrC,CACA,CACP,CAEF,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/notification/notification.scss?tag=ifx-notification&encapsulation=shadow","src/components/notification/notification.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n.ifx-notification__wrapper {\n display: flex;\n flex-direction: row;\n align-items: center;\n\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n\n background-color: tokens.$ifxColorBaseWhite;\n font-family: var(--ifx-font-family); // tokens.$ifxFontFamilyBody;\n\n\n color: tokens.$ifxColorBaseBlack;\n\n border: tokens.$ifxBorderWidth12 solid tokens.$ifxColorEngineering200;\n\n &.ifx-notification__wrapper--success {\n border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorGreen500;\n\n & .ifx-notification__icon {\n color: tokens.$ifxColorGreen500;\n }\n }\n\n &.ifx-notification__wrapper--locked {\n border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorOrange500;\n\n & .ifx-notification__icon {\n color: tokens.$ifxColorOrange500;\n }\n }\n\n &.ifx-notification__wrapper--error {\n border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorRed500;\n\n & .ifx-notification__icon {\n color: tokens.$ifxColorRed500;\n }\n }\n\n &.ifx-notification__wrapper--neutral{\n border-left: tokens.$ifxBorderWidth50 solid tokens.$ifxColorOcean500;\n\n & .ifx-notification__icon {\n color: tokens.$ifxColorOcean500;\n }\n }\n\n & .ifx-notification__icon {\n margin-right: tokens.$ifxSpace100;\n display: flex;\n align-self: center;\n }\n\n & .ifx-notification__body {\n display: flex;\n flex-direction: row;\n flex-grow: 1;\n font-size: tokens.$ifxFontSizeS;\n\n & .ifx-notification__slot {\n flex-grow: 1;\n display: inline-flex;\n align-items: center;\n }\n }\n\n & .ifx-notification__link {\n font-size: tokens.$ifxFontSizeS;\n }\n\n @media (max-width: tokens.$ifxBreakpointXs) {\n & .ifx-notification__icon {\n align-self: flex-start;\n }\n\n & .ifx-notification__body {\n flex-direction: column;\n }\n\n & .ifx-notification__link {\n margin-top: tokens.$ifxSpace100;\n }\n }\n}","import { Component, h, Host, Prop } from '@stencil/core';\n \nexport type NotificationVariant = 'success' | 'locked' | 'error' | 'neutral';\n\n@Component({\n tag: 'ifx-notification',\n styleUrl: 'notification.scss',\n shadow: true\n})\nexport class Notification {\n @Prop() icon: string;\n @Prop() variant: NotificationVariant = 'success';\n @Prop() linkText: string; \n @Prop() linkHref: string;\n @Prop() linkTarget: string = '_blank';\n\n\n private getClassName(): string {\n switch (this.variant) {\n case 'success':\n return 'ifx-notification__wrapper--success';\n case 'locked':\n return 'ifx-notification__wrapper--locked';\n case 'error':\n return 'ifx-notification__wrapper--error';\n case 'neutral':\n return 'ifx-notification__wrapper--neutral';\n default:\n return 'ifx-notification__wrapper--success';\n }\n }\n\n render() {\n return (\n <Host>\n <div class={\"ifx-notification__wrapper \" + this.getClassName()}>\n <div class=\"ifx-notification__icon\">\n <ifx-icon icon={this.icon}></ifx-icon>\n </div>\n <div class=\"ifx-notification__body\">\n <div class=\"ifx-notification__slot\">\n <slot/>\n </div>\n { this.linkText && this.linkHref && \n <div class=\"ifx-notification__link\">\n <ifx-link href={this.linkHref} target={this.linkTarget}>\n {this.linkText}<ifx-icon icon=\"arrow-right-16\">\n </ifx-icon>\n </ifx-link>\n </div>\n }\n </div>\n </div>\n </Host>\n );\n }\n}"],"version":3}
@@ -1,9 +1,9 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
2
- import { d as defineCustomElement$5 } from './p-816b2612.js';
3
- import { d as defineCustomElement$4 } from './p-4fc475c9.js';
4
- import { d as defineCustomElement$3 } from './p-9ea9e274.js';
5
- import { d as defineCustomElement$2 } from './p-e126ea6f.js';
6
- import { d as defineCustomElement$1 } from './p-24382260.js';
2
+ import { d as defineCustomElement$5 } from './p-17df0350.js';
3
+ import { d as defineCustomElement$4 } from './p-9a258534.js';
4
+ import { d as defineCustomElement$3 } from './p-53d4339c.js';
5
+ import { d as defineCustomElement$2 } from './p-351949f1.js';
6
+ import { d as defineCustomElement$1 } from './p-c90a8438.js';
7
7
 
8
8
  const templateCss = ".react__template-wrapper{display:flex;width:300px;height:200px;border-radius:3px;border:1px solid #ccc}.react__template-wrapper.hide{display:none}.react__template-wrapper:hover{cursor:pointer}.template__page-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.template__page-wrapper .repository__url{text-decoration:none}.input__fields-wrapper{display:flex;flex-direction:column;gap:10px}.details__wrapper{display:flex;flex-direction:column;gap:10px}.selection__buttons-wrapper{display:flex;gap:10px;padding-top:10px;align-items:center}.selection__buttons-wrapper .vue__label{color:#ccc}.selection__buttons-wrapper label:not(.vue__label):hover{cursor:pointer}.selection__buttons-wrapper .selection__input{display:flex;align-items:center;gap:5px}.selection__buttons-wrapper .selection__input input{margin:0;height:20px;width:20px}.selection__buttons-wrapper .selection__input input:hover:not(.vue__input){cursor:pointer}.image__wrapper img{position:relative;width:300px;height:100%;border-radius:3px;object-fit:contain;transition:transform 0.2s}.image__wrapper img:hover{transform:scale(2);top:50px;z-index:100}";
9
9
  const IfxTemplateStyle0 = templateCss;
@@ -142,7 +142,7 @@ const Template = /*@__PURE__*/ proxyCustomElement(class Template extends H {
142
142
  }
143
143
  }
144
144
  render() {
145
- return (h("div", { key: '993f20bb1a7970d938d09ea001ee77b777d2a817' }, this.isTemplatePage
145
+ return (h("div", { key: 'a6433871f9175e0616c40389d0a39a94797d67b3' }, this.isTemplatePage
146
146
  ?
147
147
  h("div", { class: "template__page-wrapper" }, !this.repoUrl && !this.repoError &&
148
148
  h("div", null, h("h3", null, "Your repository is getting ready.."), h("p", null, "This will only take a minute.")), this.isLoading && !this.repoError && h("div", null, h("ifx-spinner", { variant: 'default', size: 's' })), this.repoUrl && h("ifx-link", { href: this.repoUrl, target: "_parent", size: "m", variant: "underlined" }, "Your repository"), this.repoError && h("div", null, this.repoError))
@@ -204,4 +204,4 @@ function defineCustomElement() {
204
204
 
205
205
  export { Template as T, defineCustomElement as d };
206
206
 
207
- //# sourceMappingURL=p-13578a85.js.map
207
+ //# sourceMappingURL=p-dda8b55f.js.map
@@ -1 +1 @@
1
- {"file":"p-13578a85.js","mappings":"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","names":[],"sources":["src/components/templates/template/template.scss?tag=ifx-template&encapsulation=shadow","src/components/templates/template/template.tsx"],"sourcesContent":["\n.react__template-wrapper { \n display: flex;\n width: 300px;\n height: 200px;\n border-radius: 3px;\n border: 1px solid #ccc;\n\n &.hide { \n display: none;\n }\n \n &:hover { \n cursor: pointer;\n }\n}\n\n.template__page-wrapper {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center;\n\n & .repository__url { \n text-decoration: none;\n }\n}\n\n.input__fields-wrapper { \n display: flex;\n flex-direction: column;\n gap: 10px;\n\n}\n\n.details__wrapper { \n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.selection__buttons-wrapper { \n display: flex;\n gap: 10px;\n padding-top: 10px;\n align-items: center;\n & .vue__label { \n color: #ccc;\n }\n\n & label:not(.vue__label) { \n &:hover { \n cursor: pointer;\n }\n }\n\n & .selection__input { \n display: flex;\n align-items: center;\n gap: 5px;\n & input { \n margin: 0;\n height: 20px;\n width: 20px;\n &:hover:not(.vue__input) { \n cursor: pointer;\n }\n }\n }\n}\n\n.image__wrapper { \n img { \n position: relative;\n width: 300px;\n height: 100%;\n border-radius: 3px;\n object-fit: contain;\n transition: transform .2s;\n &:hover { \n transform: scale(2);\n top: 50px;\n z-index: 100;\n }\n }\n}","import { Component, h, Element, State, Prop, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n tag: 'ifx-template',\n styleUrl: 'template.scss',\n shadow: true,\n})\nexport class Template {\n @Element() el: HTMLElement;\n @State() repoDetails: { name: string, desc: string, framework: string } = { name: \"\", desc: \"\", framework: \"\" };\n @State() repoUrl: string;\n @State() showDetails: boolean = false;\n @State() isTemplatePage: boolean = false;\n @State() isLoading: boolean = true;\n @State() repoError: string;\n @Prop() name: string;\n @Event() toggleTemplates: EventEmitter;\n @Event() fieldError: EventEmitter;\n @Prop() thumbnail: string;\n \n private clientId = 'Ov23lixmXiNTTNb6V5W6'\n private redirectUri = 'https://infineon.github.io/infineon-design-system-stencil/?path=/docs/dds-templates--development';\n private scope = 'repo workflow'\n private state = 'template123'\n\n authUser() { \n const authorizationUrl = `https://github.com/login/oauth/authorize?` +\n `client_id=${this.clientId}&` +\n `redirect_uri=${this.redirectUri}&` +\n `scope=${this.scope}&` +\n `state=${this.state}`;\n \n window.open(authorizationUrl, '_blank'); \n }\n\n componentDidLoad() { \n const url = new URL(window.location.href);\n const code = url.searchParams.get('code');\n const { templateName } = this.getLocalStorageValues()\n if(code && this.name === templateName) { \n this.isTemplatePage = true;\n this.toggleTemplates.emit('details')\n this.getUserToken(code)\n } \n }\n\n getLocalStorageValues() { \n const repoName = localStorage.getItem('repo_name');\n const repoDesc = localStorage.getItem('repo_desc');\n const repoFramework = localStorage.getItem('repo_framework');\n const templateName = localStorage.getItem('selectedTemplate');\n return { repoName, repoDesc, repoFramework, templateName }\n }\n\n async getUserToken(authCode) {\n const { repoName, repoDesc, repoFramework, templateName } = this.getLocalStorageValues();\n\n fetch(`https://ddstemplate-srv.cfapps.eu10-004.hana.ondemand.com/token/${authCode}/${repoName}/${repoDesc}/${repoFramework}/${templateName}`)\n .then(response => {\n if (response.ok) {\n return response.text();\n } else {\n return response.text().then(errorMessage => {\n throw new Error(errorMessage);\n });\n }\n })\n .then(data => { \n if(data) { \n this.isLoading = false;\n this.repoUrl = data;\n localStorage.clear();\n } \n })\n .catch(error => {\n this.repoError = error.message;\n console.error('Error:', error.message)\n });\n }\n\n handleUserInput(e, type) { \n if (type === 'name') {\n this.repoDetails = { ...this.repoDetails, name: e.target.value };\n } else if (type === 'desc') {\n this.repoDetails = { ...this.repoDetails, desc: e.target.value };\n } else if(type === 'framework') { \n this.repoDetails = { ...this.repoDetails, framework: e.target.value };\n }\n }\n\n submitUserData() { \n if(this.repoDetails.name && this.repoDetails.desc && this.repoDetails.framework) { \n localStorage.setItem('repo_name', this.repoDetails.name);\n localStorage.setItem('repo_desc', this.repoDetails.desc);\n localStorage.setItem('repo_framework', this.repoDetails.framework);\n localStorage.setItem('selectedTemplate', this.name);\n this.fieldError.emit(false)\n this.authUser()\n } else { \n this.fieldError.emit('All fields are mandatory')\n }\n }\n\n togglePadding(action) { \n let parent = this.el.parentElement;\n if (parent) {\n const rootNode = parent.getRootNode();\n if (rootNode instanceof ShadowRoot) {\n parent = rootNode.host.parentElement;\n } else {\n parent = parent.parentElement;\n }\n if(action === 'remove') { \n parent.parentElement.style.padding = '0px';\n } else if(action === 'add') { \n parent.parentElement.style.padding = '4rem 20px';\n }\n }\n }\n\n handleCurrentTemplate(e) { \n if(e && !this.showDetails) { \n this.togglePadding('remove')\n const targetTemplate = e.currentTarget;\n this.toggleTemplates.emit(targetTemplate)\n this.showDetails = true;\n } \n }\n\n @Method()\n async toggleTemplate(currTemp) { \n const templateWrapper = this.el.shadowRoot.querySelector('.react__template-wrapper');\n if(templateWrapper) { \n if(!templateWrapper.classList.contains('hide') && currTemp ) { \n if(templateWrapper !== currTemp) {\n templateWrapper.classList.add('hide')\n }\n } else { \n if(this.showDetails) { \n this.showDetails = false;\n }\n this.togglePadding('add')\n templateWrapper.classList.remove('hide')\n }\n }\n }\n\n \n render() {\n return (\n <div>\n {this.isTemplatePage \n ? \n <div class=\"template__page-wrapper\">\n {!this.repoUrl && !this.repoError && \n <div>\n <h3>Your repository is getting ready..</h3>\n <p>This will only take a minute.</p>\n </div>}\n {this.isLoading && !this.repoError && <div><ifx-spinner variant='default' size='s' /></div>}\n {this.repoUrl && <ifx-link href={this.repoUrl} target=\"_parent\" size=\"m\" variant=\"underlined\">Your repository</ifx-link>}\n {this.repoError && <div>{this.repoError}</div>}\n </div> \n : \n <div class=\"react__template-container\">\n <div class=\"react__template-wrapper\" onClick={(e) => this.handleCurrentTemplate(e)}>\n <div class=\"image__wrapper\">\n <img src={this.thumbnail} />\n </div>\n </div>\n {this.showDetails && \n <div class=\"details__wrapper\">\n <div class=\"selection__buttons-wrapper\">\n <div class=\"selection__input\">\n <input type=\"radio\" id=\"react\" name=\"chosen_framework\" value=\"react\" onInput={(e) => this.handleUserInput(e, 'framework')} />\n <label htmlFor=\"react\">React</label>\n </div>\n <div class=\"selection__input vue\">\n <input class=\"vue__input\" disabled type=\"radio\" id=\"vue\" name=\"chosen_framework\" value=\"vue\" onInput={(e) => this.handleUserInput(e, 'framework')}/>\n <label class=\"vue__label\" htmlFor=\"vue\">Vue</label> (Soon)\n </div>\n </div>\n \n\n <div class=\"input__fields-wrapper\">\n <ifx-text-field required={true} onInput={(e) => this.handleUserInput(e, 'name')} size=\"m\" icon=\"c-info-16\" placeholder=\"Your repository name\">Repository Name</ifx-text-field>\n\n <ifx-text-field required={true} size=\"m\" icon=\"c-info-16\" onInput={(e) => this.handleUserInput(e, 'desc')} placeholder=\"Your repository description\">Repository Description</ifx-text-field>\n\n <ifx-button fullWidth={true} onClick={() => this.submitUserData()} variant='primary'>Generate template</ifx-button>\n </div>\n \n </div>}\n </div>}\n </div>\n );\n }\n}"],"version":3}
1
+ {"file":"p-dda8b55f.js","mappings":"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","names":[],"sources":["src/components/templates/template/template.scss?tag=ifx-template&encapsulation=shadow","src/components/templates/template/template.tsx"],"sourcesContent":["\n.react__template-wrapper { \n display: flex;\n width: 300px;\n height: 200px;\n border-radius: 3px;\n border: 1px solid #ccc;\n\n &.hide { \n display: none;\n }\n \n &:hover { \n cursor: pointer;\n }\n}\n\n.template__page-wrapper {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center;\n\n & .repository__url { \n text-decoration: none;\n }\n}\n\n.input__fields-wrapper { \n display: flex;\n flex-direction: column;\n gap: 10px;\n\n}\n\n.details__wrapper { \n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.selection__buttons-wrapper { \n display: flex;\n gap: 10px;\n padding-top: 10px;\n align-items: center;\n & .vue__label { \n color: #ccc;\n }\n\n & label:not(.vue__label) { \n &:hover { \n cursor: pointer;\n }\n }\n\n & .selection__input { \n display: flex;\n align-items: center;\n gap: 5px;\n & input { \n margin: 0;\n height: 20px;\n width: 20px;\n &:hover:not(.vue__input) { \n cursor: pointer;\n }\n }\n }\n}\n\n.image__wrapper { \n img { \n position: relative;\n width: 300px;\n height: 100%;\n border-radius: 3px;\n object-fit: contain;\n transition: transform .2s;\n &:hover { \n transform: scale(2);\n top: 50px;\n z-index: 100;\n }\n }\n}","import { Component, h, Element, State, Prop, Event, EventEmitter, Method } from '@stencil/core';\n\n@Component({\n tag: 'ifx-template',\n styleUrl: 'template.scss',\n shadow: true,\n})\nexport class Template {\n @Element() el: HTMLElement;\n @State() repoDetails: { name: string, desc: string, framework: string } = { name: \"\", desc: \"\", framework: \"\" };\n @State() repoUrl: string;\n @State() showDetails: boolean = false;\n @State() isTemplatePage: boolean = false;\n @State() isLoading: boolean = true;\n @State() repoError: string;\n @Prop() name: string;\n @Event() toggleTemplates: EventEmitter;\n @Event() fieldError: EventEmitter;\n @Prop() thumbnail: string;\n \n private clientId = 'Ov23lixmXiNTTNb6V5W6'\n private redirectUri = 'https://infineon.github.io/infineon-design-system-stencil/?path=/docs/dds-templates--development';\n private scope = 'repo workflow'\n private state = 'template123'\n\n authUser() { \n const authorizationUrl = `https://github.com/login/oauth/authorize?` +\n `client_id=${this.clientId}&` +\n `redirect_uri=${this.redirectUri}&` +\n `scope=${this.scope}&` +\n `state=${this.state}`;\n \n window.open(authorizationUrl, '_blank'); \n }\n\n componentDidLoad() { \n const url = new URL(window.location.href);\n const code = url.searchParams.get('code');\n const { templateName } = this.getLocalStorageValues()\n if(code && this.name === templateName) { \n this.isTemplatePage = true;\n this.toggleTemplates.emit('details')\n this.getUserToken(code)\n } \n }\n\n getLocalStorageValues() { \n const repoName = localStorage.getItem('repo_name');\n const repoDesc = localStorage.getItem('repo_desc');\n const repoFramework = localStorage.getItem('repo_framework');\n const templateName = localStorage.getItem('selectedTemplate');\n return { repoName, repoDesc, repoFramework, templateName }\n }\n\n async getUserToken(authCode) {\n const { repoName, repoDesc, repoFramework, templateName } = this.getLocalStorageValues();\n\n fetch(`https://ddstemplate-srv.cfapps.eu10-004.hana.ondemand.com/token/${authCode}/${repoName}/${repoDesc}/${repoFramework}/${templateName}`)\n .then(response => {\n if (response.ok) {\n return response.text();\n } else {\n return response.text().then(errorMessage => {\n throw new Error(errorMessage);\n });\n }\n })\n .then(data => { \n if(data) { \n this.isLoading = false;\n this.repoUrl = data;\n localStorage.clear();\n } \n })\n .catch(error => {\n this.repoError = error.message;\n console.error('Error:', error.message)\n });\n }\n\n handleUserInput(e, type) { \n if (type === 'name') {\n this.repoDetails = { ...this.repoDetails, name: e.target.value };\n } else if (type === 'desc') {\n this.repoDetails = { ...this.repoDetails, desc: e.target.value };\n } else if(type === 'framework') { \n this.repoDetails = { ...this.repoDetails, framework: e.target.value };\n }\n }\n\n submitUserData() { \n if(this.repoDetails.name && this.repoDetails.desc && this.repoDetails.framework) { \n localStorage.setItem('repo_name', this.repoDetails.name);\n localStorage.setItem('repo_desc', this.repoDetails.desc);\n localStorage.setItem('repo_framework', this.repoDetails.framework);\n localStorage.setItem('selectedTemplate', this.name);\n this.fieldError.emit(false)\n this.authUser()\n } else { \n this.fieldError.emit('All fields are mandatory')\n }\n }\n\n togglePadding(action) { \n let parent = this.el.parentElement;\n if (parent) {\n const rootNode = parent.getRootNode();\n if (rootNode instanceof ShadowRoot) {\n parent = rootNode.host.parentElement;\n } else {\n parent = parent.parentElement;\n }\n if(action === 'remove') { \n parent.parentElement.style.padding = '0px';\n } else if(action === 'add') { \n parent.parentElement.style.padding = '4rem 20px';\n }\n }\n }\n\n handleCurrentTemplate(e) { \n if(e && !this.showDetails) { \n this.togglePadding('remove')\n const targetTemplate = e.currentTarget;\n this.toggleTemplates.emit(targetTemplate)\n this.showDetails = true;\n } \n }\n\n @Method()\n async toggleTemplate(currTemp) { \n const templateWrapper = this.el.shadowRoot.querySelector('.react__template-wrapper');\n if(templateWrapper) { \n if(!templateWrapper.classList.contains('hide') && currTemp ) { \n if(templateWrapper !== currTemp) {\n templateWrapper.classList.add('hide')\n }\n } else { \n if(this.showDetails) { \n this.showDetails = false;\n }\n this.togglePadding('add')\n templateWrapper.classList.remove('hide')\n }\n }\n }\n\n \n render() {\n return (\n <div>\n {this.isTemplatePage \n ? \n <div class=\"template__page-wrapper\">\n {!this.repoUrl && !this.repoError && \n <div>\n <h3>Your repository is getting ready..</h3>\n <p>This will only take a minute.</p>\n </div>}\n {this.isLoading && !this.repoError && <div><ifx-spinner variant='default' size='s' /></div>}\n {this.repoUrl && <ifx-link href={this.repoUrl} target=\"_parent\" size=\"m\" variant=\"underlined\">Your repository</ifx-link>}\n {this.repoError && <div>{this.repoError}</div>}\n </div> \n : \n <div class=\"react__template-container\">\n <div class=\"react__template-wrapper\" onClick={(e) => this.handleCurrentTemplate(e)}>\n <div class=\"image__wrapper\">\n <img src={this.thumbnail} />\n </div>\n </div>\n {this.showDetails && \n <div class=\"details__wrapper\">\n <div class=\"selection__buttons-wrapper\">\n <div class=\"selection__input\">\n <input type=\"radio\" id=\"react\" name=\"chosen_framework\" value=\"react\" onInput={(e) => this.handleUserInput(e, 'framework')} />\n <label htmlFor=\"react\">React</label>\n </div>\n <div class=\"selection__input vue\">\n <input class=\"vue__input\" disabled type=\"radio\" id=\"vue\" name=\"chosen_framework\" value=\"vue\" onInput={(e) => this.handleUserInput(e, 'framework')}/>\n <label class=\"vue__label\" htmlFor=\"vue\">Vue</label> (Soon)\n </div>\n </div>\n \n\n <div class=\"input__fields-wrapper\">\n <ifx-text-field required={true} onInput={(e) => this.handleUserInput(e, 'name')} size=\"m\" icon=\"c-info-16\" placeholder=\"Your repository name\">Repository Name</ifx-text-field>\n\n <ifx-text-field required={true} size=\"m\" icon=\"c-info-16\" onInput={(e) => this.handleUserInput(e, 'desc')} placeholder=\"Your repository description\">Repository Description</ifx-text-field>\n\n <ifx-button fullWidth={true} onClick={() => this.submitUserData()} variant='primary'>Generate template</ifx-button>\n </div>\n \n </div>}\n </div>}\n </div>\n );\n }\n}"],"version":3}
@@ -1,8 +1,6 @@
1
1
  import { p as proxyCustomElement, H, c as createEvent, h } from './p-f8e6a4ef.js';
2
- import { t as trackComponent } from './p-6ecb6a6f.js';
3
- import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
4
- import { d as defineCustomElement$2 } from './p-4fc475c9.js';
5
- import { d as defineCustomElement$1 } from './p-94da6823.js';
2
+ import { d as defineCustomElement$2 } from './p-9a258534.js';
3
+ import { d as defineCustomElement$1 } from './p-9142f93b.js';
6
4
 
7
5
  const chipCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:inline-block}.chip{position:relative}.chip__wrapper{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;border:1px solid #BFBBBB;border-radius:9999px;background:#FFFFFF;cursor:pointer;transition:border 100ms ease;font:400 0.875rem/1.25rem \"Source Sans 3\"}.chip__wrapper:hover,.chip__wrapper:focus-visible{outline:none;border:1px solid #575352}.chip__wrapper:focus{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--small{padding:4px 12px}.chip__wrapper.chip__wrapper--large{padding:8px 16px}.chip__wrapper.chip__wrapper--opened{border:1px solid #0A8276}.chip__wrapper.chip__wrapper--opened .wrapper__open-button{transform:rotate(-180deg)}.chip__wrapper.chip__wrapper--selected{outline:3px solid #0A8276;outline-offset:-3px;color:#0A8276}.chip__wrapper.chip__wrapper--selected:hover,.chip__wrapper.chip__wrapper--selected:focus-visible{outline:3px solid #08665C;color:#08665C}.wrapper__label{display:inline-flex;align-items:center;gap:4px;font:400 0.875rem/1.25rem \"Source Sans 3\"}.wrapper__label .label__selected-options{font:600 0.875rem/1.25rem \"Source Sans 3\"}.wrapper__open-button{display:flex;align-items:center;transition:all 300ms ease}.wrapper__unselect-button{display:flex;align-items:center}.chip__dropdown{position:absolute;z-index:1;box-shadow:0px 6px 9px 0px rgba(29, 29, 29, 0.1019607843);border:1px solid #EEEDED;border-radius:1px;padding:8px 0;min-width:222px;background-color:#FFFFFF}";
8
6
  const IfxChipStyle0 = chipCss;
@@ -265,22 +263,19 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class Chip extends H {
265
263
  }
266
264
  componentWillLoad() {
267
265
  this.syncSelectedOptionsWithProp(this.value);
268
- if (!isNestedInIfxComponent(this.chip)) {
269
- trackComponent('ifx-chip');
270
- }
271
266
  }
272
267
  render() {
273
- return (h("div", { key: '0e0e72db529b3835f0b5de328f211d0768c6ddee', class: 'chip' }, h("div", { key: '2b61f018f055c39601c1024dee6e1858c01c7863', class: `chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}
268
+ return (h("div", { key: 'e14109cde5a4d4a9ed84c98ec91f12061c870fd7', class: 'chip' }, h("div", { key: 'c53a4141e3c632b7b191c473af84fcea0f1734c6', class: `chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}
274
269
  chip__wrapper--${this.variant === 'multi' ? 'multi' : 'single'}
275
270
  ${this.opened && !this.readOnly ? 'chip__wrapper--opened' : ''}
276
- ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`, tabIndex: 0, onClick: !this.readOnly ? () => { this.handleWrapperClick(); } : undefined, role: 'combobox', "aria-label": this.ariaLabel, "aria-value": this.getSelectedOptions(), "aria-haspopup": !this.readOnly ? 'listbox' : undefined, "aria-expanded": !this.readOnly ? this.opened.toString() : undefined, "aria-controls": !this.readOnly ? 'dropdown' : undefined, "aria-readonly": this.readOnly ? 'true' : undefined, "aria-multiselectable": this.variant === 'multi' ? 'true' : undefined }, h("div", { key: '61c7ae5868a0ce18faabb0e9f19b643178a22828', class: 'wrapper__label' }, (this.selectedOptions.length === 0) && `${this.placeholder}`, (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&
271
+ ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`, tabIndex: 0, onClick: !this.readOnly ? () => { this.handleWrapperClick(); } : undefined, role: 'combobox', "aria-label": this.ariaLabel, "aria-value": this.getSelectedOptions(), "aria-haspopup": !this.readOnly ? 'listbox' : undefined, "aria-expanded": !this.readOnly ? this.opened.toString() : undefined, "aria-controls": !this.readOnly ? 'dropdown' : undefined, "aria-readonly": this.readOnly ? 'true' : undefined, "aria-multiselectable": this.variant === 'multi' ? 'true' : undefined }, h("div", { key: '2dd2d3efa423414c1b2f1d4bb14439ac5f79b6e3', class: 'wrapper__label' }, (this.selectedOptions.length === 0) && `${this.placeholder}`, (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&
277
272
  `${this.placeholder}:`, (this.selectedOptions.length !== 0) &&
278
- h("div", { key: '33ef743d96c35968e93033e558585c6a942efa70', class: 'label__selected-options' }, this.getSelectedOptions()), (this.selectedOptions.length > 2 && this.variant === 'multi') &&
279
- h("ifx-indicator", { key: '5f5e12b89d03af3c5333f13af1f7a4f1eff4355e', variant: 'number', number: this.selectedOptions.length - 2 })), !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&
280
- h("div", { key: '77ac62cec78ededc4e01793f33cc236582ae4adf', class: 'wrapper__open-button' }, h("ifx-icon", { key: 1, icon: `chevron-down-16` })), (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&
281
- h("div", { key: '22c2f37f9f073cd2e8fe31cf3095f89a49bbeca9', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` })), ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&
282
- h("div", { key: 'bf670388198eb70b9cd14823fc34efd2184489e5', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` }))), this.opened && !this.readOnly &&
283
- h("div", { key: 'd2ab296e12ff492e87c73bc34e6a2a8e0a2752e4', id: 'dropdown', role: 'listbox', class: 'chip__dropdown' }, h("slot", { key: '2cd227969f98e74a6e18cbab4a1bb271e0782def' }))));
273
+ h("div", { key: 'fa10908eb3780826670e4d571a64803d54022d6e', class: 'label__selected-options' }, this.getSelectedOptions()), (this.selectedOptions.length > 2 && this.variant === 'multi') &&
274
+ h("ifx-indicator", { key: '1f80e8bffce5a08f712d4e0b8ecb138290752ca2', variant: 'number', number: this.selectedOptions.length - 2 })), !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&
275
+ h("div", { key: 'f9f144b629d6c21c91da36b37ac10667f30a3278', class: 'wrapper__open-button' }, h("ifx-icon", { key: 1, icon: `chevrondown16` })), (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&
276
+ h("div", { key: '86f82b0569d2602bfbead599ed43702bc8accce2', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` })), ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&
277
+ h("div", { key: '9832048fb9641b7093730b60d085bd4aa72ff6aa', class: 'wrapper__unselect-button', onClick: (e) => { this.handleUnselectButtonClick(e); } }, h("ifx-icon", { key: 2, icon: `cross16` }))), this.opened && !this.readOnly &&
278
+ h("div", { key: 'c8255be2c95eba78e7597e42021c0b7356af8966', id: 'dropdown', role: 'listbox', class: 'chip__dropdown' }, h("slot", { key: '05a3f33d374bed185021467a73a86c9ceef9913c' }))));
284
279
  }
285
280
  get chip() { return this; }
286
281
  static get watchers() { return {
@@ -327,4 +322,4 @@ function defineCustomElement() {
327
322
 
328
323
  export { Chip as C, defineCustomElement as d };
329
324
 
330
- //# sourceMappingURL=p-0905733d.js.map
325
+ //# sourceMappingURL=p-e4c0ba88.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-e4c0ba88.js","mappings":"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","names":[],"sources":["src/components/chip/chip.scss?tag=ifx-chip&encapsulation=shadow","src/components/chip/chip.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: inline-block;\n}\n\n.chip {\n position: relative;\n}\n\n.chip__wrapper {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: tokens.$ifxSpace100;\n\n box-sizing: border-box;\n border: 1px solid tokens.$ifxColorEngineering300;\n border-radius: tokens.$ifxBorderRadiusRound;\n \n background: tokens.$ifxColorBaseWhite;\n \n cursor: pointer; \n \n transition: border 100ms ease;\n\n font: tokens.$ifxBodyBody04;\n \n &:hover, &:focus-visible {\n outline: none;\n border: 1px solid tokens.$ifxColorEngineering500;\n }\n\n &:focus {\n border: 1px solid tokens.$ifxColorOcean500;\n }\n \n &.chip__wrapper--small {\n padding: tokens.$ifxSpace50 tokens.$ifxSpace150;\n }\n \n &.chip__wrapper--large {\n padding: tokens.$ifxSpace100 tokens.$ifxSpace200;\n }\n \n &.chip__wrapper--opened {\n border: 1px solid tokens.$ifxColorOcean500;\n \n .wrapper__open-button {\n transform: rotate(-180deg);\n }\n }\n \n &.chip__wrapper--selected {\n outline: 3px solid tokens.$ifxColorOcean500;\n outline-offset: -3px;\n \n color: tokens.$ifxColorOcean500;\n \n &:hover, &:focus-visible {\n outline: 3px solid tokens.$ifxColorOcean600;\n \n color: tokens.$ifxColorOcean600;\n }\n }\n}\n\n.wrapper__label {\n display: inline-flex;\n align-items: center;\n gap: tokens.$ifxSpace50;\n\n font: tokens.$ifxBodyBody04;\n \n .label__selected-options {\n font: tokens.$ifxBodyBodySemibold04;\n }\n}\n\n.wrapper__open-button {\n display:flex;\n align-items: center;\n \n transition: all 300ms ease;\n}\n\n.wrapper__unselect-button {\n display:flex;\n align-items: center;\n}\n\n.chip__dropdown {\n position: absolute;\n z-index: 1;\n\n box-shadow: 0px 6px 9px 0px #1D1D1D1A;\n border: 1px solid tokens.$ifxColorEngineering200;\n border-radius: tokens.$ifxBorderRadius12;\n padding: tokens.$ifxSpace100 0;\n\n min-width: 222px;\n \n background-color: tokens.$ifxColorBaseWhite;\n}\n","import { h, Component, Element, Event, EventEmitter, Listen, Prop, State, Watch } from '@stencil/core';\nimport { ChipItemSelectEvent } from './interfaces';\n\n@Component({\n tag: 'ifx-chip',\n styleUrl: 'chip.scss',\n shadow: true\n})\nexport class Chip {\n @Element() chip: HTMLIfxChipElement;\n\n @Event() ifxChange: EventEmitter<{ previousSelection: Array<ChipItemSelectEvent>, currentSelection: Array<ChipItemSelectEvent>, name: string }>;\n @Prop() placeholder: string = '';\n @Prop() size: 'small' | 'large' = 'large';\n @Prop({ mutable: true }) value: Array<string> | string = undefined;\n @Prop() variant: 'single' | 'multi' = 'single';\n @Prop() readOnly: boolean = false;\n @Prop() ariaLabel: string | null;\n\n @State() opened: boolean = false;\n @State() selectedOptions: Array<ChipItemSelectEvent> = [];\n\n @Watch('value')\n handleValueChange(newValue: Array<string> | string) {\n this.syncSelectedOptionsWithProp(newValue);\n }\n\n @Watch('readOnly')\n handleReadOnlyChange(newValue: boolean) {\n if (newValue) {\n this.opened = false;\n }\n }\n\n @Listen('mousedown', { target: 'document' })\n closeDropdownOnOutsideClick(event: MouseEvent) {\n const path = event.composedPath();\n const chipWrapper: HTMLElement = this.chip.shadowRoot.querySelector('.chip__wrapper');\n const chipDropdown: HTMLElement = this.chip.shadowRoot.querySelector('.chip__dropdown');\n if (!path.includes(chipDropdown) && !path.includes(chipWrapper) && this.opened) {\n this.toggleDropdownMenu();\n }\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n // override behavior of all keys except Tab. Users should be able to tab out of the component.\n if (event.code !== 'Tab') {\n event.preventDefault(); \n }\n\n if ((event.target as HTMLElement).tagName === 'IFX-CHIP') {\n this.handleWrapperKeyDown(event);\n } else if ((event.target as HTMLElement).tagName === 'IFX-CHIP-ITEM') {\n this.handleDropdownKeyDown(event);\n }\n }\n\n @Listen('ifxChipItemSelect')\n updateSelectedOptions(event: CustomEvent<ChipItemSelectEvent>) {\n const eventDetail: ChipItemSelectEvent = event.detail;\n const previousSelection: Array<ChipItemSelectEvent> = [...this.selectedOptions];\n\n if (this.variant !== 'multi') {\n if (eventDetail.selected) {\n this.opened = false;\n const chipItems: NodeList = this.getChipItems();\n chipItems.forEach((chipItem: HTMLIfxChipItemElement) => {\n if (chipItem.selected && chipItem !== event.target) {\n chipItem.chipState = {\n ...chipItem.chipState,\n emitIfxChipItemSelect: false,\n };\n chipItem.selected = false;\n }\n });\n this.selectedOptions = [eventDetail];\n } else {\n this.selectedOptions = [];\n }\n this.value = this.selectedOptions[0] ? this.selectedOptions[0].value : undefined;\n } else {\n if (eventDetail.selected) {\n // Prevent duplicate entries\n if (!this.selectedOptions.find(option => option.value === eventDetail.value)) {\n this.selectedOptions = [...this.selectedOptions, eventDetail];\n }\n } else {\n this.selectedOptions = this.selectedOptions.filter((option) => option.value !== eventDetail.value);\n }\n this.value = this.selectedOptions.map((option) => option.value);\n }\n\n if (eventDetail.emitIfxChange) {\n this.ifxChange.emit({\n previousSelection: previousSelection,\n currentSelection: this.selectedOptions,\n name: this.placeholder\n });\n }\n }\n\n getChipItems(): NodeList {\n return this.chip.querySelectorAll('ifx-chip-item');\n }\n\n getSelectedOptions(): string {\n if (this.variant !== 'multi') {\n return this.selectedOptions.map(option => option.label).join('');\n }\n return this.selectedOptions.slice(0, 2).map(option => option.label).join(', ');\n }\n\n toggleDropdownMenu() {\n if (this.readOnly) return;\n this.opened = !this.opened;\n }\n\n /**\n * Focuses the chip item at the specified index.\n * @param index the index of the chip item to focus. -1 will focus the last chip item.\n */\n focusChipItemAt(index: number = 0) {\n this.opened = true;\n const chipItems: NodeList = this.getChipItems();\n let item: HTMLIfxChipItemElement;\n \n if (index === -1) {\n item = chipItems.item(chipItems.length - 1) as HTMLIfxChipItemElement;\n } else if (index >= 0 && index < chipItems.length) {\n item = chipItems.item(index) as HTMLIfxChipItemElement;\n } else {\n console.error(`Invalid index: ${index}`);\n return;\n }\n\n const shadowItem = item.shadowRoot.querySelector('.chip-item') as HTMLDivElement;\n if (shadowItem) {\n // Delay needed for the shadow item to be rendered.\n setTimeout(() => {\n shadowItem.focus();\n }, 1);\n }\n }\n\n focusChip() {\n const chipWrapper: HTMLElement = this.chip.shadowRoot.querySelector('.chip__wrapper');\n chipWrapper.focus();\n }\n\n handleUnselectButtonClick(event: MouseEvent) {\n event.stopPropagation();\n this.opened = false;\n\n let itemGotUnselected = false;\n const chipItems: NodeList = this.getChipItems();\n chipItems.forEach((chipItem: HTMLIfxChipItemElement) => {\n if (chipItem.selected) {\n itemGotUnselected = true;\n chipItem.chipState = {\n ...chipItem.chipState,\n emitIfxChipItemSelect: false,\n }\n chipItem.selected = false;\n }\n });\n\n /* Emit event only if at least one item was unselected. */\n if (itemGotUnselected) {\n const previousSelection: Array<ChipItemSelectEvent> = this.selectedOptions;\n this.selectedOptions = [];\n this.value = [];\n this.ifxChange.emit({\n previousSelection: previousSelection,\n currentSelection: [],\n name: this.placeholder\n });\n }\n }\n\n handleWrapperClick() {\n if (!this.readOnly) {\n this.toggleDropdownMenu();\n }\n }\n\n handleWrapperKeyDown(event: KeyboardEvent) {\n // Keymap oriented at https://www.w3.org/WAI/ARIA/apg/patterns/combobox/#keyboard_interaction\n if (this.readOnly) return;\n\n if (!this.opened) {\n switch (event.code) {\n case 'Space':\n case 'Enter':\n case 'ArrowDown':\n this.focusChipItemAt(0);\n break;\n case 'ArrowUp':\n this.focusChipItemAt(-1);\n break;\n }\n } else {\n switch (event.code) {\n case 'Escape':\n this.opened = false;\n this.focusChip();\n break;\n }\n }\n }\n\n handleDropdownKeyDown(event: KeyboardEvent) {\n let chipitems = this.getChipItems();\n\n let targetIndex = Array.from(chipitems).indexOf(event.target as HTMLIfxChipItemElement);\n if (targetIndex === -1) {\n console.error('Target not found in chip items');\n return;\n }\n\n switch (event.code) {\n case 'ArrowDown':\n if (targetIndex === chipitems.length - 1) break;\n this.focusChipItemAt(targetIndex + 1);\n break;\n case 'ArrowUp':\n if (targetIndex === 0) break;\n this.focusChipItemAt( targetIndex - 1);\n break;\n case 'Escape':\n this.opened = false;\n this.focusChip();\n break;\n case 'Space':\n // selection is handled by the chip-item component\n if (this.variant === 'single') {\n // only close dropdown if single select\n this.opened = false;\n this.focusChip();\n }\n break;\n case 'Enter':\n // selection is handled by the chip-item component\n this.opened = false;\n this.focusChip();\n break;\n }\n }\n\n syncChipState() {\n const chipItems: NodeList = this.getChipItems();\n let key: number = 0;\n chipItems.forEach((chipItem: HTMLIfxChipItemElement) => {\n chipItem.chipState = {\n emitIfxChipItemSelect: true,\n size: (this.size === 'small' ? 'small' : 'large'),\n variant: (this.variant === 'multi' ? 'multi' : 'single'),\n key: key++\n };\n });\n }\n\n syncSelectedOptionsWithProp(newValue: Array<string> | string) {\n // Clear old selected options\n this.selectedOptions = [];\n\n const generateKey = (() => {\n let count = 0;\n return () => count++;\n })();\n\n if (Array.isArray(newValue)) {\n this.selectedOptions = newValue.map(value => ({\n value,\n label: value,\n selected: true,\n key: generateKey(),\n emitIfxChange: true\n }));\n } else if (typeof newValue === 'string') {\n this.selectedOptions = [{\n value: newValue,\n label: newValue,\n selected: true,\n key: generateKey(),\n emitIfxChange: true\n }];\n }\n\n this.syncChipState();\n }\n\n componentWillLoad() {\n this.syncSelectedOptionsWithProp(this.value);\n }\n\n render() {\n return (\n <div class='chip'>\n <div class={`chip__wrapper chip__wrapper--${this.size === 'small' ? 'small' : 'large'}\n chip__wrapper--${this.variant === 'multi' ? 'multi' : 'single'}\n ${this.opened && !this.readOnly ? 'chip__wrapper--opened' : ''}\n ${this.selectedOptions.length ? 'chip__wrapper--selected' : ''}`}\n tabIndex={0}\n onClick={!this.readOnly ? () => { this.handleWrapperClick() } : undefined}\n role='combobox'\n aria-label={this.ariaLabel}\n aria-value={this.getSelectedOptions()}\n aria-haspopup={!this.readOnly ? 'listbox' : undefined}\n aria-expanded={!this.readOnly ? this.opened.toString() : undefined}\n aria-controls={!this.readOnly ? 'dropdown' : undefined}\n aria-readonly={this.readOnly ? 'true' : undefined}\n aria-multiselectable={this.variant === 'multi' ? 'true' : undefined}\n >\n\n <div class='wrapper__label'>\n {\n (this.selectedOptions.length === 0) && `${this.placeholder}`\n }\n\n {\n (this.selectedOptions.length !== 0 && (this.variant === 'multi' || this.readOnly) && this.placeholder !== '') &&\n `${this.placeholder}:`\n }\n\n {\n (this.selectedOptions.length !== 0) &&\n <div class='label__selected-options'>\n {this.getSelectedOptions()}\n </div>\n }\n\n {\n (this.selectedOptions.length > 2 && this.variant === 'multi') &&\n <ifx-indicator variant='number' number={this.selectedOptions.length - 2}></ifx-indicator>\n }\n </div>\n\n {\n !this.readOnly && (this.variant !== 'multi' || (this.variant === 'multi' && this.selectedOptions.length === 0)) &&\n <div class='wrapper__open-button'>\n <ifx-icon key={1} icon={`chevrondown16`} />\n </div>\n }\n\n\n { \n (this.variant !== 'multi' && this.readOnly !== false && this.selectedOptions.length > 0) &&\n <div class='wrapper__unselect-button' onClick={(e) => { this.handleUnselectButtonClick(e) }}>\n <ifx-icon key={2} icon={`cross16`} />\n </div>\n }\n\n {\n ((this.selectedOptions.length >= 1) && this.variant === 'multi') &&\n <div class='wrapper__unselect-button' onClick={(e) => { this.handleUnselectButtonClick(e) }}>\n <ifx-icon key={2} icon={`cross16`} />\n </div>\n }\n\n </div>\n\n {\n this.opened && !this.readOnly &&\n <div id='dropdown' role='listbox' class='chip__dropdown'>\n <slot />\n </div>\n }\n </div>\n );\n }\n}\n"],"version":3}
@@ -1,6 +1,4 @@
1
1
  import { p as proxyCustomElement, H, h } from './p-f8e6a4ef.js';
2
- import { t as trackComponent } from './p-6ecb6a6f.js';
3
- import { i as isNestedInIfxComponent } from './p-1ecafb97.js';
4
2
 
5
3
  const accordionCss = ":root{--ifx-font-family:\"Source Sans 3\", \"Arial, sans-serif\"}:host{display:block}.accordion-wrapper{display:flex;flex-direction:column;gap:8px;font-family:var(--ifx-font-family)}";
6
4
  const IfxAccordionStyle0 = accordionCss;
@@ -12,11 +10,6 @@ const Accordion = /*@__PURE__*/ proxyCustomElement(class Accordion extends H {
12
10
  this.__attachShadow();
13
11
  this.autoCollapse = false;
14
12
  }
15
- componentWillLoad() {
16
- if (!isNestedInIfxComponent(this.el)) {
17
- trackComponent('ifx-accordion');
18
- }
19
- }
20
13
  async onItemOpen(event) {
21
14
  if (this.autoCollapse) {
22
15
  const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));
@@ -29,7 +22,7 @@ const Accordion = /*@__PURE__*/ proxyCustomElement(class Accordion extends H {
29
22
  }
30
23
  }
31
24
  render() {
32
- return (h("div", { key: '09e451a9b0b348566d74ad71741d57bd48d3ec3a', class: "accordion-wrapper" }, h("slot", { key: '9338154dc8adc933eb6b6b6cbd1396adf839e80a' })));
25
+ return (h("div", { key: '663e6aac2f3002d3898856b854dbfd96d9519a68', class: "accordion-wrapper" }, h("slot", { key: '0f54044bc1e0d2860ccd3096ee2711eb0a1cb927' })));
33
26
  }
34
27
  static get delegatesFocus() { return true; }
35
28
  get el() { return this; }
@@ -53,4 +46,4 @@ function defineCustomElement() {
53
46
 
54
47
  export { Accordion as A, defineCustomElement as d };
55
48
 
56
- //# sourceMappingURL=p-cca71d97.js.map
49
+ //# sourceMappingURL=p-ed739e86.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-ed739e86.js","mappings":";;AAAA,MAAM,YAAY,GAAG,wLAAwL,CAAC;AAC9M,2BAAe,YAAY;;MCOd,SAAS;IALtB;;;;QAOU,iBAAY,GAAY,KAAK,CAAC;KAuBvC;IAnBC,MAAM,UAAU,CAAC,KAAkB;QACjC,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,CAAC;YACzE,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;gBACxB,MAAM,WAAW,GAAG,IAAmC,CAAC;gBACxD,IAAI,WAAW,KAAK,KAAK,CAAC,MAAM,KAAK,MAAM,WAAW,CAAC,IAAI,CAAC,EAAE;oBAC5D,WAAW,CAAC,IAAI,GAAG,KAAK,CAAC;iBAC1B;aACF;SACF;KACF;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,mBAAmB,IAC5B,8DAAQ,CACJ,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/accordion/accordion.scss?tag=ifx-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx"],"sourcesContent":["// ifxAccordion.scss\n@use \"~@infineon/design-system-tokens/dist/tokens\";\n@use \"../../global/font.scss\";\n\n:host {\n display: block;\n}\n\n.accordion-wrapper {\n display: flex;\n flex-direction: column;\n gap: tokens.$ifxSpace100;\n font-family: var(--ifx-font-family) // tokens.$ifxFontFamilyBody;\n}","//ifxAccordion.tsx\nimport { Component, h, Listen, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ifx-accordion',\n styleUrl: 'accordion.scss',\n shadow: { delegatesFocus: true },\n})\nexport class Accordion {\n @Element() el: HTMLElement;\n @Prop() autoCollapse: boolean = false;\n\n\n @Listen('ifxOpen')\n async onItemOpen(event: CustomEvent) {\n if (this.autoCollapse) {\n const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));\n for (const item of items) {\n const itemElement = item as HTMLIfxAccordionItemElement;\n if (itemElement !== event.target && (await itemElement.open)) {\n itemElement.open = false;\n }\n }\n }\n }\n\n render() {\n return (\n <div class=\"accordion-wrapper\">\n <slot />\n </div>\n );\n }\n}\n"],"version":3}