@siemens/ix 0.0.0-20240419081748 → 0.0.0-20240508065324

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 (424) hide show
  1. package/components/dropdown.js +112 -9
  2. package/components/dropdown.js.map +1 -1
  3. package/components/group-context-menu.js +1 -1
  4. package/components/group-context-menu.js.map +1 -1
  5. package/components/group-item.js +3 -3
  6. package/components/group-item.js.map +1 -1
  7. package/components/ix-category-filter.js +34 -10
  8. package/components/ix-category-filter.js.map +1 -1
  9. package/components/ix-event-list-item.js +5 -4
  10. package/components/ix-event-list-item.js.map +1 -1
  11. package/components/ix-event-list.js +26 -25
  12. package/components/ix-event-list.js.map +1 -1
  13. package/components/ix-form-field.js +1 -1
  14. package/components/ix-form-field.js.map +1 -1
  15. package/components/ix-group.js +16 -9
  16. package/components/ix-group.js.map +1 -1
  17. package/components/ix-icon-toggle-button.js +1 -1
  18. package/components/ix-input-group.js +1 -1
  19. package/components/ix-key-value-list.js +1 -1
  20. package/components/ix-kpi.js +3 -3
  21. package/components/ix-link-button.js +3 -3
  22. package/components/ix-map-navigation.js +2 -2
  23. package/components/ix-menu-about-item.js +1 -1
  24. package/components/ix-menu-about-news.js +4 -4
  25. package/components/ix-menu-about.js +1 -1
  26. package/components/ix-menu-about.js.map +1 -1
  27. package/components/ix-menu-avatar.js +2 -2
  28. package/components/ix-menu-category.js +5 -5
  29. package/components/ix-menu-settings-item.js +1 -1
  30. package/components/ix-menu.js +11 -11
  31. package/components/ix-message-bar.js +1 -1
  32. package/components/ix-modal-example.js +1 -1
  33. package/components/ix-modal-footer.js +1 -1
  34. package/components/ix-modal-loading.js +1 -1
  35. package/components/ix-pagination.js +2 -2
  36. package/components/ix-pane-layout.js +1 -1
  37. package/components/ix-pill.js +4 -4
  38. package/components/ix-playground-internal.js +1 -1
  39. package/components/ix-split-button-item.js +1 -1
  40. package/components/ix-tile.js +4 -4
  41. package/components/ix-toggle-button.js +2 -2
  42. package/components/ix-toggle.js +2 -2
  43. package/components/ix-tree.js +1 -1
  44. package/components/ix-upload.js +3 -3
  45. package/components/ix-validation-tooltip.js +2 -2
  46. package/components/ix-workflow-step.js +3 -3
  47. package/components/ix-workflow-steps.js +1 -1
  48. package/components/map-navigation-overlay.js +2 -2
  49. package/components/menu-avatar-item.js +1 -1
  50. package/components/menu-expand-icon.js +1 -1
  51. package/components/menu-item.js +2 -2
  52. package/components/modal-content.js +1 -1
  53. package/components/modal-header.js +1 -1
  54. package/components/row.js +1 -1
  55. package/components/select-item.js +9 -1
  56. package/components/select-item.js.map +1 -1
  57. package/components/select.js +161 -42
  58. package/components/select.js.map +1 -1
  59. package/components/spinner.js +1 -1
  60. package/components/tabs.js +2 -2
  61. package/components/time-picker.js +1 -1
  62. package/components/time-picker.js.map +1 -1
  63. package/components/toast.js +2 -2
  64. package/components/tooltip.js +2 -2
  65. package/components/tree-item.js +4 -4
  66. package/dist/cjs/focus-9c8ffbb0.js +65 -0
  67. package/dist/cjs/focus-9c8ffbb0.js.map +1 -0
  68. package/dist/cjs/ix-avatar_2.cjs.entry.js +1 -1
  69. package/dist/cjs/ix-category-filter.cjs.entry.js +33 -10
  70. package/dist/cjs/ix-category-filter.cjs.entry.js.map +1 -1
  71. package/dist/cjs/ix-col_4.cjs.entry.js +1 -1
  72. package/dist/cjs/ix-dropdown.cjs.entry.js +52 -8
  73. package/dist/cjs/ix-dropdown.cjs.entry.js.map +1 -1
  74. package/dist/cjs/ix-event-list-item.cjs.entry.js +5 -4
  75. package/dist/cjs/ix-event-list-item.cjs.entry.js.map +1 -1
  76. package/dist/cjs/ix-event-list.cjs.entry.js +26 -25
  77. package/dist/cjs/ix-event-list.cjs.entry.js.map +1 -1
  78. package/dist/cjs/ix-filter-chip_2.cjs.entry.js +8 -1
  79. package/dist/cjs/ix-filter-chip_2.cjs.entry.js.map +1 -1
  80. package/dist/cjs/ix-form-field.cjs.entry.js +1 -1
  81. package/dist/cjs/ix-form-field.cjs.entry.js.map +1 -1
  82. package/dist/cjs/ix-group-context-menu_2.cjs.entry.js +4 -4
  83. package/dist/cjs/ix-group-context-menu_2.cjs.entry.js.map +1 -1
  84. package/dist/cjs/ix-group.cjs.entry.js +13 -7
  85. package/dist/cjs/ix-group.cjs.entry.js.map +1 -1
  86. package/dist/cjs/ix-icon-button_2.cjs.entry.js +1 -1
  87. package/dist/cjs/ix-icon-toggle-button.cjs.entry.js +1 -1
  88. package/dist/cjs/ix-input-group.cjs.entry.js +1 -1
  89. package/dist/cjs/ix-key-value-list.cjs.entry.js +1 -1
  90. package/dist/cjs/ix-kpi.cjs.entry.js +3 -3
  91. package/dist/cjs/ix-link-button.cjs.entry.js +3 -3
  92. package/dist/cjs/ix-map-navigation-overlay.cjs.entry.js +2 -2
  93. package/dist/cjs/ix-map-navigation.cjs.entry.js +2 -2
  94. package/dist/cjs/ix-menu-about-item.cjs.entry.js +1 -1
  95. package/dist/cjs/ix-menu-about-news.cjs.entry.js +4 -4
  96. package/dist/cjs/ix-menu-about.cjs.entry.js +1 -1
  97. package/dist/cjs/ix-menu-about.cjs.entry.js.map +1 -1
  98. package/dist/cjs/ix-menu-avatar.cjs.entry.js +2 -2
  99. package/dist/cjs/ix-menu-category.cjs.entry.js +5 -5
  100. package/dist/cjs/ix-menu-expand-icon.cjs.entry.js +1 -1
  101. package/dist/cjs/ix-menu-item.cjs.entry.js +2 -2
  102. package/dist/cjs/ix-menu-settings-item.cjs.entry.js +1 -1
  103. package/dist/cjs/ix-menu.cjs.entry.js +11 -11
  104. package/dist/cjs/ix-message-bar.cjs.entry.js +1 -1
  105. package/dist/cjs/ix-modal-content_2.cjs.entry.js +2 -2
  106. package/dist/cjs/ix-modal-example.cjs.entry.js +1 -1
  107. package/dist/cjs/ix-modal-footer.cjs.entry.js +1 -1
  108. package/dist/cjs/ix-modal-loading.cjs.entry.js +1 -1
  109. package/dist/cjs/ix-pagination.cjs.entry.js +2 -2
  110. package/dist/cjs/ix-pane-layout.cjs.entry.js +1 -1
  111. package/dist/cjs/ix-pill.cjs.entry.js +4 -4
  112. package/dist/cjs/ix-playground-internal.cjs.entry.js +1 -1
  113. package/dist/cjs/ix-select.cjs.entry.js +159 -39
  114. package/dist/cjs/ix-select.cjs.entry.js.map +1 -1
  115. package/dist/cjs/ix-split-button-item.cjs.entry.js +1 -1
  116. package/dist/cjs/ix-tab-item_2.cjs.entry.js +2 -2
  117. package/dist/cjs/ix-tile.cjs.entry.js +4 -4
  118. package/dist/cjs/ix-time-picker.cjs.entry.js +1 -1
  119. package/dist/cjs/ix-time-picker.cjs.entry.js.map +1 -1
  120. package/dist/cjs/ix-toast.cjs.entry.js +2 -2
  121. package/dist/cjs/ix-toggle-button.cjs.entry.js +2 -2
  122. package/dist/cjs/ix-toggle.cjs.entry.js +2 -2
  123. package/dist/cjs/ix-tooltip.cjs.entry.js +2 -2
  124. package/dist/cjs/ix-tree-item.cjs.entry.js +4 -4
  125. package/dist/cjs/ix-tree.cjs.entry.js +1 -1
  126. package/dist/cjs/ix-upload.cjs.entry.js +3 -3
  127. package/dist/cjs/ix-validation-tooltip.cjs.entry.js +2 -2
  128. package/dist/cjs/ix-workflow-step.cjs.entry.js +3 -3
  129. package/dist/cjs/ix-workflow-steps.cjs.entry.js +1 -1
  130. package/dist/cjs/loader.cjs.js +1 -1
  131. package/dist/cjs/siemens-ix.cjs.js +1 -1
  132. package/dist/collection/components/category-filter/category-filter.css +60 -24
  133. package/dist/collection/components/category-filter/category-filter.js +58 -9
  134. package/dist/collection/components/category-filter/category-filter.js.map +1 -1
  135. package/dist/collection/components/dropdown/dropdown.js +52 -8
  136. package/dist/collection/components/dropdown/dropdown.js.map +1 -1
  137. package/dist/collection/components/dropdown/test/dropdown.ct.js +42 -0
  138. package/dist/collection/components/dropdown/test/dropdown.ct.js.map +1 -1
  139. package/dist/collection/components/event-list/event-list.js +26 -25
  140. package/dist/collection/components/event-list/event-list.js.map +1 -1
  141. package/dist/collection/components/event-list/test/event-list.ct.js +61 -0
  142. package/dist/collection/components/event-list/test/event-list.ct.js.map +1 -0
  143. package/dist/collection/components/event-list/test/event-list.spec.js +0 -47
  144. package/dist/collection/components/event-list/test/event-list.spec.js.map +1 -1
  145. package/dist/collection/components/event-list-item/event-list-item.js +5 -4
  146. package/dist/collection/components/event-list-item/event-list-item.js.map +1 -1
  147. package/dist/collection/components/form-field/form-field.css +30 -12
  148. package/dist/collection/components/group/group-context-menu.css +3 -0
  149. package/dist/collection/components/group/group.js +16 -9
  150. package/dist/collection/components/group/group.js.map +1 -1
  151. package/dist/collection/components/group/test/group.ct.js +47 -0
  152. package/dist/collection/components/group/test/group.ct.js.map +1 -0
  153. package/dist/collection/components/group-item/group-item.css +9 -4
  154. package/dist/collection/components/group-item/group-item.js +2 -2
  155. package/dist/collection/components/icon-toggle-button/icon-toggle-button.js +1 -1
  156. package/dist/collection/components/input-group/input-group.js +1 -1
  157. package/dist/collection/components/key-value-list/key-value-list.js +1 -1
  158. package/dist/collection/components/kpi/kpi.js +3 -3
  159. package/dist/collection/components/link-button/link-button.js +3 -3
  160. package/dist/collection/components/map-navigation/map-navigation.js +2 -2
  161. package/dist/collection/components/map-navigation-overlay/map-navigation-overlay.js +2 -2
  162. package/dist/collection/components/menu/menu-expand-icon.js +1 -1
  163. package/dist/collection/components/menu/menu.js +11 -11
  164. package/dist/collection/components/menu-about/menu-about.js +2 -2
  165. package/dist/collection/components/menu-about/menu-about.js.map +1 -1
  166. package/dist/collection/components/menu-about-item/menu-about-item.js +1 -1
  167. package/dist/collection/components/menu-about-news/menu-about-news.js +4 -4
  168. package/dist/collection/components/menu-avatar/menu-avatar.js +2 -2
  169. package/dist/collection/components/menu-avatar-item/menu-avatar-item.js +1 -1
  170. package/dist/collection/components/menu-category/menu-category.js +5 -5
  171. package/dist/collection/components/menu-item/menu-item.js +2 -2
  172. package/dist/collection/components/menu-settings-item/menu-settings-item.js +1 -1
  173. package/dist/collection/components/message-bar/message-bar.js +1 -1
  174. package/dist/collection/components/modal-content/modal-content.js +1 -1
  175. package/dist/collection/components/modal-footer/modal-footer.js +1 -1
  176. package/dist/collection/components/modal-header/modal-header.js +1 -1
  177. package/dist/collection/components/modal-loading/modal-loading.js +1 -1
  178. package/dist/collection/components/pagination/pagination.js +2 -2
  179. package/dist/collection/components/pane-layout/pane-layout.js +1 -1
  180. package/dist/collection/components/pill/pill.js +4 -4
  181. package/dist/collection/components/playground/example-modal.js +1 -1
  182. package/dist/collection/components/playground/playground.js +1 -1
  183. package/dist/collection/components/row/row.js +1 -1
  184. package/dist/collection/components/select/select.css +27 -9
  185. package/dist/collection/components/select/select.js +159 -38
  186. package/dist/collection/components/select/select.js.map +1 -1
  187. package/dist/collection/components/select/test/select.ct.js +342 -0
  188. package/dist/collection/components/select/test/select.ct.js.map +1 -1
  189. package/dist/collection/components/select-item/select-item.js +32 -1
  190. package/dist/collection/components/select-item/select-item.js.map +1 -1
  191. package/dist/collection/components/spinner/spinner.js +1 -1
  192. package/dist/collection/components/split-button-item/split-button-item.js +1 -1
  193. package/dist/collection/components/tabs/tabs.js +2 -2
  194. package/dist/collection/components/tile/tile.js +4 -4
  195. package/dist/collection/components/time-picker/time-picker.css +30 -12
  196. package/dist/collection/components/toast/toast.js +2 -2
  197. package/dist/collection/components/toggle/toggle.js +2 -2
  198. package/dist/collection/components/toggle-button/toggle-button.js +2 -2
  199. package/dist/collection/components/tooltip/tooltip.js +2 -2
  200. package/dist/collection/components/tree/tree.js +1 -1
  201. package/dist/collection/components/tree-item/tree-item.js +4 -4
  202. package/dist/collection/components/upload/upload.js +3 -3
  203. package/dist/collection/components/utils/focus.js +60 -0
  204. package/dist/collection/components/utils/focus.js.map +1 -0
  205. package/dist/collection/components/validation-tooltip/validation-tooltip.js +2 -2
  206. package/dist/collection/components/workflow-step/workflow-step.js +3 -3
  207. package/dist/collection/components/workflow-steps/workflow-steps.js +1 -1
  208. package/dist/collection/tests/category-filter/category-filter.e2e.js +30 -0
  209. package/dist/collection/tests/category-filter/category-filter.e2e.js.map +1 -1
  210. package/dist/collection/tests/select/select.e2e.js +21 -0
  211. package/dist/collection/tests/select/select.e2e.js.map +1 -1
  212. package/dist/esm/focus-d4d3abaf.js +63 -0
  213. package/dist/esm/focus-d4d3abaf.js.map +1 -0
  214. package/dist/esm/ix-avatar_2.entry.js +1 -1
  215. package/dist/esm/ix-category-filter.entry.js +33 -10
  216. package/dist/esm/ix-category-filter.entry.js.map +1 -1
  217. package/dist/esm/ix-col_4.entry.js +1 -1
  218. package/dist/esm/ix-dropdown.entry.js +52 -8
  219. package/dist/esm/ix-dropdown.entry.js.map +1 -1
  220. package/dist/esm/ix-event-list-item.entry.js +5 -4
  221. package/dist/esm/ix-event-list-item.entry.js.map +1 -1
  222. package/dist/esm/ix-event-list.entry.js +26 -25
  223. package/dist/esm/ix-event-list.entry.js.map +1 -1
  224. package/dist/esm/ix-filter-chip_2.entry.js +8 -1
  225. package/dist/esm/ix-filter-chip_2.entry.js.map +1 -1
  226. package/dist/esm/ix-form-field.entry.js +1 -1
  227. package/dist/esm/ix-form-field.entry.js.map +1 -1
  228. package/dist/esm/ix-group-context-menu_2.entry.js +4 -4
  229. package/dist/esm/ix-group-context-menu_2.entry.js.map +1 -1
  230. package/dist/esm/ix-group.entry.js +14 -8
  231. package/dist/esm/ix-group.entry.js.map +1 -1
  232. package/dist/esm/ix-icon-button_2.entry.js +1 -1
  233. package/dist/esm/ix-icon-toggle-button.entry.js +1 -1
  234. package/dist/esm/ix-input-group.entry.js +1 -1
  235. package/dist/esm/ix-key-value-list.entry.js +1 -1
  236. package/dist/esm/ix-kpi.entry.js +3 -3
  237. package/dist/esm/ix-link-button.entry.js +3 -3
  238. package/dist/esm/ix-map-navigation-overlay.entry.js +2 -2
  239. package/dist/esm/ix-map-navigation.entry.js +2 -2
  240. package/dist/esm/ix-menu-about-item.entry.js +1 -1
  241. package/dist/esm/ix-menu-about-news.entry.js +4 -4
  242. package/dist/esm/ix-menu-about.entry.js +1 -1
  243. package/dist/esm/ix-menu-about.entry.js.map +1 -1
  244. package/dist/esm/ix-menu-avatar.entry.js +2 -2
  245. package/dist/esm/ix-menu-category.entry.js +5 -5
  246. package/dist/esm/ix-menu-expand-icon.entry.js +1 -1
  247. package/dist/esm/ix-menu-item.entry.js +2 -2
  248. package/dist/esm/ix-menu-settings-item.entry.js +1 -1
  249. package/dist/esm/ix-menu.entry.js +11 -11
  250. package/dist/esm/ix-message-bar.entry.js +1 -1
  251. package/dist/esm/ix-modal-content_2.entry.js +2 -2
  252. package/dist/esm/ix-modal-example.entry.js +1 -1
  253. package/dist/esm/ix-modal-footer.entry.js +1 -1
  254. package/dist/esm/ix-modal-loading.entry.js +1 -1
  255. package/dist/esm/ix-pagination.entry.js +2 -2
  256. package/dist/esm/ix-pane-layout.entry.js +1 -1
  257. package/dist/esm/ix-pill.entry.js +4 -4
  258. package/dist/esm/ix-playground-internal.entry.js +1 -1
  259. package/dist/esm/ix-select.entry.js +159 -39
  260. package/dist/esm/ix-select.entry.js.map +1 -1
  261. package/dist/esm/ix-split-button-item.entry.js +1 -1
  262. package/dist/esm/ix-tab-item_2.entry.js +2 -2
  263. package/dist/esm/ix-tile.entry.js +4 -4
  264. package/dist/esm/ix-time-picker.entry.js +1 -1
  265. package/dist/esm/ix-time-picker.entry.js.map +1 -1
  266. package/dist/esm/ix-toast.entry.js +2 -2
  267. package/dist/esm/ix-toggle-button.entry.js +2 -2
  268. package/dist/esm/ix-toggle.entry.js +2 -2
  269. package/dist/esm/ix-tooltip.entry.js +2 -2
  270. package/dist/esm/ix-tree-item.entry.js +4 -4
  271. package/dist/esm/ix-tree.entry.js +1 -1
  272. package/dist/esm/ix-upload.entry.js +3 -3
  273. package/dist/esm/ix-validation-tooltip.entry.js +2 -2
  274. package/dist/esm/ix-workflow-step.entry.js +3 -3
  275. package/dist/esm/ix-workflow-steps.entry.js +1 -1
  276. package/dist/esm/loader.js +1 -1
  277. package/dist/esm/siemens-ix.js +1 -1
  278. package/dist/playwright-ct.config.js +1 -1
  279. package/dist/playwright-ct.config.js.map +1 -1
  280. package/dist/siemens-ix/{p-d2ee87ae.entry.js → p-0a1bfcfc.entry.js} +2 -2
  281. package/dist/siemens-ix/{p-ca838b5c.entry.js → p-0b7741b7.entry.js} +2 -2
  282. package/dist/siemens-ix/{p-9c03b231.entry.js → p-114bb49b.entry.js} +2 -2
  283. package/dist/siemens-ix/{p-c2f6aaae.entry.js → p-262026ab.entry.js} +2 -2
  284. package/dist/siemens-ix/{p-d48a746d.entry.js → p-29b0bef3.entry.js} +2 -2
  285. package/dist/siemens-ix/{p-f2856faf.entry.js → p-30e8a26a.entry.js} +2 -2
  286. package/dist/siemens-ix/{p-1450ba99.entry.js → p-3b8e4fe5.entry.js} +2 -2
  287. package/dist/siemens-ix/{p-96615442.entry.js → p-418959d3.entry.js} +2 -2
  288. package/dist/siemens-ix/{p-96615442.entry.js.map → p-418959d3.entry.js.map} +1 -1
  289. package/dist/siemens-ix/p-4290098e.entry.js +2 -0
  290. package/dist/siemens-ix/{p-cb1c0d63.entry.js.map → p-4290098e.entry.js.map} +1 -1
  291. package/dist/siemens-ix/p-43a58a77.entry.js +2 -0
  292. package/dist/siemens-ix/{p-7289b0be.entry.js.map → p-43a58a77.entry.js.map} +1 -1
  293. package/dist/siemens-ix/p-4fd11865.entry.js +2 -0
  294. package/dist/siemens-ix/p-56bbdae4.entry.js +2 -0
  295. package/dist/siemens-ix/{p-0d268489.entry.js → p-5f08da2c.entry.js} +2 -2
  296. package/dist/siemens-ix/{p-26789c86.entry.js → p-601cfc6a.entry.js} +2 -2
  297. package/dist/siemens-ix/p-64c895ac.entry.js +2 -0
  298. package/dist/siemens-ix/p-64c895ac.entry.js.map +1 -0
  299. package/dist/siemens-ix/p-678d821f.entry.js +2 -0
  300. package/dist/siemens-ix/{p-b1ec7f32.entry.js → p-6ea6396e.entry.js} +2 -2
  301. package/dist/siemens-ix/{p-7c1fd9a0.entry.js → p-6eb4eefc.entry.js} +2 -2
  302. package/dist/siemens-ix/{p-af46164c.entry.js → p-784fe260.entry.js} +2 -2
  303. package/dist/siemens-ix/{p-9fcf9dcd.entry.js → p-8d161202.entry.js} +2 -2
  304. package/dist/siemens-ix/{p-d77fa665.entry.js → p-90c55341.entry.js} +2 -2
  305. package/dist/siemens-ix/p-90c55341.entry.js.map +1 -0
  306. package/dist/siemens-ix/p-96d2d21f.entry.js +2 -0
  307. package/dist/siemens-ix/p-96d2d21f.entry.js.map +1 -0
  308. package/dist/siemens-ix/{p-c5762d6c.entry.js → p-9dabe2f7.entry.js} +2 -2
  309. package/dist/siemens-ix/p-a039faa9.entry.js +2 -0
  310. package/dist/siemens-ix/p-a039faa9.entry.js.map +1 -0
  311. package/dist/siemens-ix/p-a35d02ea.entry.js +2 -0
  312. package/dist/siemens-ix/{p-31cc5367.entry.js → p-a3ad98bc.entry.js} +2 -2
  313. package/dist/siemens-ix/p-a6fbea5b.entry.js +2 -0
  314. package/dist/siemens-ix/p-a6fbea5b.entry.js.map +1 -0
  315. package/dist/siemens-ix/p-a9d1ab94.entry.js +2 -0
  316. package/dist/siemens-ix/{p-080653aa.entry.js.map → p-a9d1ab94.entry.js.map} +1 -1
  317. package/dist/siemens-ix/p-aa58d9d7.entry.js +2 -0
  318. package/dist/siemens-ix/p-aa58d9d7.entry.js.map +1 -0
  319. package/dist/siemens-ix/p-abb29515.entry.js +2 -0
  320. package/dist/siemens-ix/p-abb29515.entry.js.map +1 -0
  321. package/dist/siemens-ix/{p-f6635bfc.entry.js → p-ac1d46d6.entry.js} +2 -2
  322. package/dist/siemens-ix/p-add5b76c.entry.js +2 -0
  323. package/dist/siemens-ix/{p-33e903e1.entry.js.map → p-add5b76c.entry.js.map} +1 -1
  324. package/dist/siemens-ix/{p-d76ee9ff.entry.js → p-af74fc62.entry.js} +2 -2
  325. package/dist/siemens-ix/{p-32fa185a.entry.js → p-b02fd2c5.entry.js} +2 -2
  326. package/dist/siemens-ix/p-b32c2183.entry.js +2 -0
  327. package/dist/siemens-ix/{p-d0cf522c.entry.js.map → p-b32c2183.entry.js.map} +1 -1
  328. package/dist/siemens-ix/{p-6f056fc6.entry.js → p-bc5d33ce.entry.js} +2 -2
  329. package/dist/siemens-ix/{p-f17e4cce.entry.js → p-bd310180.entry.js} +2 -2
  330. package/dist/siemens-ix/p-c09553f3.js +2 -0
  331. package/dist/siemens-ix/p-c09553f3.js.map +1 -0
  332. package/dist/siemens-ix/{p-c89a070a.entry.js → p-c29aff68.entry.js} +2 -2
  333. package/dist/siemens-ix/{p-30f449bc.entry.js → p-ca65a043.entry.js} +2 -2
  334. package/dist/siemens-ix/{p-4bbae41b.entry.js → p-cbbe9dee.entry.js} +2 -2
  335. package/dist/siemens-ix/p-ccf1bd22.entry.js +2 -0
  336. package/dist/siemens-ix/{p-47017ce7.entry.js → p-d08cbeaf.entry.js} +2 -2
  337. package/dist/siemens-ix/p-d600ea55.entry.js +2 -0
  338. package/dist/siemens-ix/p-d600ea55.entry.js.map +1 -0
  339. package/dist/siemens-ix/{p-1255e76b.entry.js → p-d6a094cf.entry.js} +2 -2
  340. package/dist/siemens-ix/{p-3e4e3b23.entry.js → p-dbf234e5.entry.js} +2 -2
  341. package/dist/siemens-ix/{p-177f9a5c.entry.js → p-e2464e13.entry.js} +2 -2
  342. package/dist/siemens-ix/{p-d9d5389b.entry.js → p-e678bfc5.entry.js} +2 -2
  343. package/dist/siemens-ix/{p-c8e0563a.entry.js → p-ec741c06.entry.js} +2 -2
  344. package/dist/siemens-ix/{p-ca658a19.entry.js → p-ed2ec72f.entry.js} +2 -2
  345. package/dist/siemens-ix/{p-d9370972.entry.js → p-f2a81e70.entry.js} +2 -2
  346. package/dist/siemens-ix/{p-1ad7fd83.entry.js → p-fe273de4.entry.js} +2 -2
  347. package/dist/siemens-ix/siemens-ix-core.css +1 -1
  348. package/dist/siemens-ix/siemens-ix.css +30 -12
  349. package/dist/siemens-ix/siemens-ix.esm.js +1 -1
  350. package/dist/siemens-ix/siemens-ix.esm.js.map +1 -1
  351. package/dist/types/components/category-filter/category-filter.d.ts +10 -0
  352. package/dist/types/components/dropdown/dropdown.d.ts +7 -1
  353. package/dist/types/components/event-list/test/event-list.ct.d.ts +1 -0
  354. package/dist/types/components/group/group.d.ts +1 -0
  355. package/dist/types/components/group/test/group.ct.d.ts +1 -0
  356. package/dist/types/components/menu-about/menu-about.d.ts +1 -1
  357. package/dist/types/components/select/select.d.ts +15 -3
  358. package/dist/types/components/select-item/select-item.d.ts +5 -1
  359. package/dist/types/components/utils/focus.d.ts +10 -0
  360. package/dist/types/components.d.ts +15 -2
  361. package/package.json +1 -1
  362. package/scss/components/form/_input.scss +11 -8
  363. package/dist/siemens-ix/p-080653aa.entry.js +0 -2
  364. package/dist/siemens-ix/p-08bedeaa.entry.js +0 -2
  365. package/dist/siemens-ix/p-2a9673f3.entry.js +0 -2
  366. package/dist/siemens-ix/p-2a9673f3.entry.js.map +0 -1
  367. package/dist/siemens-ix/p-33e903e1.entry.js +0 -2
  368. package/dist/siemens-ix/p-37e4df76.entry.js +0 -2
  369. package/dist/siemens-ix/p-37e4df76.entry.js.map +0 -1
  370. package/dist/siemens-ix/p-7289b0be.entry.js +0 -2
  371. package/dist/siemens-ix/p-7b5ed355.entry.js +0 -2
  372. package/dist/siemens-ix/p-87fe9d5f.entry.js +0 -2
  373. package/dist/siemens-ix/p-87fe9d5f.entry.js.map +0 -1
  374. package/dist/siemens-ix/p-8a06a632.entry.js +0 -2
  375. package/dist/siemens-ix/p-96f2c71a.entry.js +0 -2
  376. package/dist/siemens-ix/p-96f2c71a.entry.js.map +0 -1
  377. package/dist/siemens-ix/p-9fd3ae7f.entry.js +0 -2
  378. package/dist/siemens-ix/p-a93df5f2.entry.js +0 -2
  379. package/dist/siemens-ix/p-a93df5f2.entry.js.map +0 -1
  380. package/dist/siemens-ix/p-ab446f83.entry.js +0 -2
  381. package/dist/siemens-ix/p-ab446f83.entry.js.map +0 -1
  382. package/dist/siemens-ix/p-b78fd38b.entry.js +0 -2
  383. package/dist/siemens-ix/p-b78fd38b.entry.js.map +0 -1
  384. package/dist/siemens-ix/p-c49701a0.entry.js +0 -2
  385. package/dist/siemens-ix/p-cb1c0d63.entry.js +0 -2
  386. package/dist/siemens-ix/p-d0cf522c.entry.js +0 -2
  387. package/dist/siemens-ix/p-d77fa665.entry.js.map +0 -1
  388. /package/dist/siemens-ix/{p-d2ee87ae.entry.js.map → p-0a1bfcfc.entry.js.map} +0 -0
  389. /package/dist/siemens-ix/{p-ca838b5c.entry.js.map → p-0b7741b7.entry.js.map} +0 -0
  390. /package/dist/siemens-ix/{p-9c03b231.entry.js.map → p-114bb49b.entry.js.map} +0 -0
  391. /package/dist/siemens-ix/{p-c2f6aaae.entry.js.map → p-262026ab.entry.js.map} +0 -0
  392. /package/dist/siemens-ix/{p-d48a746d.entry.js.map → p-29b0bef3.entry.js.map} +0 -0
  393. /package/dist/siemens-ix/{p-f2856faf.entry.js.map → p-30e8a26a.entry.js.map} +0 -0
  394. /package/dist/siemens-ix/{p-1450ba99.entry.js.map → p-3b8e4fe5.entry.js.map} +0 -0
  395. /package/dist/siemens-ix/{p-c49701a0.entry.js.map → p-4fd11865.entry.js.map} +0 -0
  396. /package/dist/siemens-ix/{p-9fd3ae7f.entry.js.map → p-56bbdae4.entry.js.map} +0 -0
  397. /package/dist/siemens-ix/{p-0d268489.entry.js.map → p-5f08da2c.entry.js.map} +0 -0
  398. /package/dist/siemens-ix/{p-26789c86.entry.js.map → p-601cfc6a.entry.js.map} +0 -0
  399. /package/dist/siemens-ix/{p-7b5ed355.entry.js.map → p-678d821f.entry.js.map} +0 -0
  400. /package/dist/siemens-ix/{p-b1ec7f32.entry.js.map → p-6ea6396e.entry.js.map} +0 -0
  401. /package/dist/siemens-ix/{p-7c1fd9a0.entry.js.map → p-6eb4eefc.entry.js.map} +0 -0
  402. /package/dist/siemens-ix/{p-af46164c.entry.js.map → p-784fe260.entry.js.map} +0 -0
  403. /package/dist/siemens-ix/{p-9fcf9dcd.entry.js.map → p-8d161202.entry.js.map} +0 -0
  404. /package/dist/siemens-ix/{p-c5762d6c.entry.js.map → p-9dabe2f7.entry.js.map} +0 -0
  405. /package/dist/siemens-ix/{p-08bedeaa.entry.js.map → p-a35d02ea.entry.js.map} +0 -0
  406. /package/dist/siemens-ix/{p-31cc5367.entry.js.map → p-a3ad98bc.entry.js.map} +0 -0
  407. /package/dist/siemens-ix/{p-f6635bfc.entry.js.map → p-ac1d46d6.entry.js.map} +0 -0
  408. /package/dist/siemens-ix/{p-d76ee9ff.entry.js.map → p-af74fc62.entry.js.map} +0 -0
  409. /package/dist/siemens-ix/{p-32fa185a.entry.js.map → p-b02fd2c5.entry.js.map} +0 -0
  410. /package/dist/siemens-ix/{p-6f056fc6.entry.js.map → p-bc5d33ce.entry.js.map} +0 -0
  411. /package/dist/siemens-ix/{p-f17e4cce.entry.js.map → p-bd310180.entry.js.map} +0 -0
  412. /package/dist/siemens-ix/{p-c89a070a.entry.js.map → p-c29aff68.entry.js.map} +0 -0
  413. /package/dist/siemens-ix/{p-30f449bc.entry.js.map → p-ca65a043.entry.js.map} +0 -0
  414. /package/dist/siemens-ix/{p-4bbae41b.entry.js.map → p-cbbe9dee.entry.js.map} +0 -0
  415. /package/dist/siemens-ix/{p-8a06a632.entry.js.map → p-ccf1bd22.entry.js.map} +0 -0
  416. /package/dist/siemens-ix/{p-47017ce7.entry.js.map → p-d08cbeaf.entry.js.map} +0 -0
  417. /package/dist/siemens-ix/{p-1255e76b.entry.js.map → p-d6a094cf.entry.js.map} +0 -0
  418. /package/dist/siemens-ix/{p-3e4e3b23.entry.js.map → p-dbf234e5.entry.js.map} +0 -0
  419. /package/dist/siemens-ix/{p-177f9a5c.entry.js.map → p-e2464e13.entry.js.map} +0 -0
  420. /package/dist/siemens-ix/{p-d9d5389b.entry.js.map → p-e678bfc5.entry.js.map} +0 -0
  421. /package/dist/siemens-ix/{p-c8e0563a.entry.js.map → p-ec741c06.entry.js.map} +0 -0
  422. /package/dist/siemens-ix/{p-ca658a19.entry.js.map → p-ed2ec72f.entry.js.map} +0 -0
  423. /package/dist/siemens-ix/{p-d9370972.entry.js.map → p-f2a81e70.entry.js.map} +0 -0
  424. /package/dist/siemens-ix/{p-1ad7fd83.entry.js.map → p-fe273de4.entry.js.map} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"names":["categoryFilterCss","IxCategoryFilterStyle0","CategoryFilter","this","ID_CUSTOM_FILTER_VALUE","LogicalFilterOperator","EQUAL","watchFilterState","newValue","setFilterState","componentDidLoad","filterState","undefined","setTimeout","_a","hostElement","addEventListener","handleFormElementKeyDown","bind","_b","formElement","e","preventDefault","textInput","console","warn","hasFocus","inputValue","value","inputState","InputState","category","inputChanged","emit","handleInputElementKeyDown","state","filterTokens","token","tokens","addToken","categoryLogicalOperator","categories","id","operator","emitFilterEvent","closeDropdown","disabled","readonly","shadowRoot","querySelector","show","code","document","activeElement","classList","contains","getAttribute","hasCategorySelection","selectCategory","focusPreviousItem","showDropdown","focusNextItem","sibling","previousSibling","HTMLElement","focus","nextSibling","selector","item","stopPropagation","suggestions","length","tokenCount","removeToken","filter","map","filterChanged","emitEvent","newToken","trim","hasToken","pair","isScrollStateDirty","index","_","i","getCategoryIds","ids","Object","prototype","hasOwnProperty","call","push","categoryChanged","resetFilter","filterMultiples","repeatCategories","isCategoryAlreadySet","find","some","filterToken","hasSameValue","filterDuplicateTokens","filterByInput","toLowerCase","indexOf","toggleCategoryOperator","NOT_EQUAL","getFilterChipLabel","operatorString","label","_c","nonSelectableCategories","getFilteredSuggestions","renderPlainSuggestions","h","class","suggestion","onClick","key","title","renderOperatorButton","params","type","variant","outline","ghost","iconOnly","iconOval","selected","loading","icon","extraClasses","BaseButton","assign","renderCategoryValues","options","renderDropdownContent","renderCategorySelection","tabindex","getDropdownHeader","labelCategories","i18nPlainText","componentDidRender","tmpDisableScrollIntoView","scrollIntoView","getResetButton","oval","size","getIconColor","render","Host","ref","el","hideIcon","color","name","toString","animate__animated","animate__fadein","onCloseClick","autocomplete","placeholder","closeBehavior","offset","mainAxis","anchor","trigger","header"],"sources":["src/components/category-filter/category-filter.scss?tag=ix-category-filter&encapsulation=shadow","src/components/category-filter/category-filter.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/shadows';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n@import '../button/button';\n@import 'legacy/components/dropdown';\n@import 'legacy/components/forms';\n@import 'components/form/input';\n\n:host {\n @include ix-component;\n\n display: block;\n position: relative;\n height: auto;\n\n @include host-focus-visible {\n border-color: var(--theme-color-primary);\n box-shadow: 0 0 $tiny-space 0 var(--theme-color-primary) !important;\n }\n\n .reset-button {\n position: absolute;\n top: $tiny-space;\n right: $tiny-space;\n }\n\n .reset-button.hide-reset-button {\n display: none;\n }\n\n .input-container {\n &:not(.readonly):not(.disabled) {\n @include element-input('false');\n }\n\n &.disabled {\n color: var(--theme-input--color--disabled);\n border-bottom: var(--theme-input--border-thickness, 1px) solid\n var(--theme-input--border-color-bottom--disabled);\n }\n\n &.readonly {\n @include element-input;\n }\n\n display: flex;\n height: auto;\n max-height: 3.75rem;\n padding: 1px $large-space 1px 1.75rem !important;\n\n &.no-icon {\n padding-left: $tiny-space;\n }\n }\n\n .token-container {\n flex-grow: 1;\n overflow: hidden;\n }\n\n .text-input {\n @include ellipsis;\n @include text-default;\n width: auto;\n height: 1.75rem;\n min-height: $large-space;\n background: transparent;\n flex-grow: 1;\n box-shadow: none;\n\n &,\n &:hover,\n &:focus-visible {\n border: none;\n outline: none;\n }\n\n &.hide-placeholder::placeholder {\n opacity: 0;\n }\n }\n\n .list-unstyled {\n display: flex;\n flex-wrap: wrap;\n list-style: none;\n padding: 0;\n margin: 0;\n overflow-y: auto;\n }\n\n ix-icon {\n position: absolute;\n top: $small-space;\n left: $small-space;\n }\n\n ix-filter-chip {\n margin-right: $tiny-space;\n }\n\n .category-preview {\n display: flex;\n align-items: center;\n height: $large-space;\n background-color: var(--theme-bg-3);\n border-top-left-radius: $default-space;\n border-bottom-left-radius: $default-space;\n padding: $small-space;\n margin: 2px 0;\n }\n\n ul {\n height: 100%;\n }\n\n ul > li,\n input {\n padding-inline-start: 0;\n padding-top: 2px;\n padding-bottom: 2px;\n }\n\n ix-dropdown {\n min-width: 10rem !important;\n\n .dropdown-item-container {\n display: flex;\n flex-direction: column;\n\n .dropdown-item {\n @include text-default-single;\n @include ellipsis;\n @include focus-visible {\n border-color: var(--theme-color-focus-bdr);\n }\n\n height: $large-control-height;\n margin: $tiny-space $small-space;\n padding-inline: $small-space;\n border: 1px solid transparent;\n border-radius: 100rem;\n width: auto;\n justify-content: flex-start;\n flex-grow: 1;\n }\n\n .category-item {\n border-end-end-radius: 0;\n border-start-end-radius: 0;\n }\n\n .category-item-value {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n\n .btn-toggle-operator {\n width: 2rem;\n height: 2rem;\n margin-inline: $small-space;\n }\n }\n\n .d-none {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { FilterState } from './filter-state';\nimport { InputState } from './input-state';\nimport { LogicalFilterOperator } from './logical-filter-operator';\n\n@Component({\n tag: 'ix-category-filter',\n styleUrl: 'category-filter.scss',\n shadow: true,\n})\nexport class CategoryFilter {\n private readonly ID_CUSTOM_FILTER_VALUE = 'CW_CUSTOM_FILTER_VALUE';\n\n @State() showDropdown: boolean;\n @State() private textInput?: HTMLInputElement;\n private formElement?: HTMLFormElement;\n private isScrollStateDirty: boolean;\n\n @Element() hostElement: HTMLIxCategoryFilterElement;\n\n @State() hasFocus: boolean;\n @State() categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n @State() inputValue: string;\n @State() category: string;\n @State() filterTokens: Array<{\n id: string;\n value: string;\n operator: LogicalFilterOperator;\n }> = [];\n\n /**\n * If true the filter will be in disabled state\n */\n @Prop() disabled = false;\n\n /**\n * If true the filter will be in readonly mode\n */\n @Prop() readonly = false;\n\n /**\n * A set of search criteria to populate the component with.\n */\n @Prop() filterState: FilterState;\n\n /**\n * Placeholder text to be displayed in an empty input field.\n */\n @Prop() placeholder: string;\n\n /**\n * Configuration object hash used to populate the dropwdown menu for typeahead and quick selection functionality.\n * Each ID maps to an object with a label and an array of options to select from.\n */\n @Prop() categories: {\n [id: string]: {\n label: string;\n options: string[];\n };\n };\n\n /**\n * In certain use cases some categories may not be available for selection anymore.\n * To allow proper display of set filters with these categories this ID to label mapping can be populated.\n *\n * Configuration object hash used to supply labels to the filter chips in the input field.\n * Each ID maps to a string representing the label to display.\n */\n @Prop() nonSelectableCategories?: {\n [id: string]: string;\n } = {};\n\n /**\n * A list of strings that will be supplied as typeahead suggestions not tied to any categories.\n */\n @Prop() suggestions: string[];\n\n /**\n * The icon next to the actual text input\n * Defaults to 'search'\n */\n @Prop() icon = 'search';\n\n /**\n * Allows to hide the icon inside the text input.\n * Defaults to false\n */\n @Prop() hideIcon: boolean;\n\n /**\n * If set to true allows that a single category can be set more than once.\n * An already set category will not appear in the category dropdown if set to false.\n *\n * Defaults to true\n */\n @Prop() repeatCategories = true;\n\n /**\n * @internal For debugging purposes only!\n */\n @Prop() tmpDisableScrollIntoView = true;\n\n /**\n * i18n\n */\n @Prop() labelCategories = 'Categories';\n\n /**\n * i18n\n */\n @Prop() i18nPlainText = 'Filter by text';\n\n /**\n * Event dispatched whenever the a category gets selected in the dropdown\n */\n @Event() categoryChanged: EventEmitter<string>;\n\n /**\n * Event dispatched whenever the text input changes.\n */\n @Event() inputChanged: EventEmitter<InputState>;\n\n /**\n * Event dispatched whenever the filter state changes.\n */\n @Event() filterChanged: EventEmitter<FilterState>;\n\n @Watch('filterState')\n watchFilterState(newValue) {\n this.setFilterState(newValue);\n }\n\n componentDidLoad() {\n if (this.filterState !== undefined) {\n setTimeout(() => this.setFilterState(this.filterState));\n }\n\n this.hostElement?.addEventListener(\n 'keydown',\n this.handleFormElementKeyDown.bind(this)\n );\n\n this.formElement?.addEventListener('submit', (e) => e.preventDefault());\n\n if (this.textInput == null) {\n console.warn(\n 'ix-category-filter - unable to add event listeners to native input element'\n );\n return;\n }\n\n this.textInput.addEventListener('focusin', () => {\n this.hasFocus = true;\n });\n this.textInput.addEventListener('focusout', () => (this.hasFocus = false));\n this.textInput.addEventListener('input', () => {\n this.inputValue = this.textInput.value;\n const inputState = new InputState(this.inputValue, this.category);\n this.inputChanged.emit(inputState);\n });\n this.textInput.addEventListener(\n 'keydown',\n this.handleInputElementKeyDown.bind(this)\n );\n }\n\n private setFilterState(state: FilterState) {\n this.filterTokens = [];\n\n for (const token of state.tokens) {\n this.addToken(\n token,\n this.ID_CUSTOM_FILTER_VALUE,\n this.categoryLogicalOperator,\n false\n );\n }\n\n for (const category of state.categories) {\n this.addToken(category.value, category.id, category.operator, false);\n }\n\n this.emitFilterEvent();\n }\n\n private closeDropdown() {\n if (this.disabled || this.readonly) {\n return;\n }\n\n this.hostElement.shadowRoot.querySelector('ix-dropdown').show = false;\n }\n\n private handleFormElementKeyDown(e: KeyboardEvent) {\n switch (e.code) {\n case 'Enter':\n case 'NumpadEnter':\n if (!document.activeElement.classList.contains('dropdown-item')) {\n return;\n }\n\n const token = document.activeElement.getAttribute('data-id');\n\n if (this.hasCategorySelection()) {\n if (this.category !== undefined) {\n this.addToken(token, this.category);\n } else if (\n document.activeElement.classList.contains('category-item-id')\n ) {\n this.selectCategory(token);\n }\n } else {\n this.addToken(token);\n }\n\n e.preventDefault();\n break;\n\n case 'ArrowUp':\n this.focusPreviousItem();\n e.preventDefault();\n break;\n\n case 'ArrowDown':\n this.showDropdown = true;\n this.focusNextItem();\n e.preventDefault();\n break;\n\n case 'Escape':\n this.closeDropdown();\n break;\n }\n }\n\n private focusPreviousItem() {\n const sibling = document.activeElement.previousSibling;\n if (sibling instanceof HTMLElement) {\n sibling.focus();\n }\n }\n\n private focusNextItem() {\n const sibling = document.activeElement.nextSibling;\n if (sibling instanceof HTMLElement) {\n sibling.focus();\n }\n }\n\n private handleInputElementKeyDown(e: KeyboardEvent) {\n switch (e.code) {\n case 'ArrowDown':\n const selector = `.category-item-${\n this.category !== undefined ? 'value' : 'id'\n }`;\n let item = this.hostElement.shadowRoot.querySelector(selector);\n\n if (item instanceof HTMLElement) {\n item.focus();\n e.stopPropagation();\n } else if (this.suggestions?.length) {\n item = this.hostElement.shadowRoot.querySelector('.category-item');\n if (item instanceof HTMLElement) {\n item.focus();\n e.stopPropagation();\n }\n }\n break;\n\n case 'Backspace':\n if (this.textInput.value !== '') {\n return;\n }\n\n if (this.category !== undefined) {\n this.category = undefined;\n return;\n }\n\n const tokenCount = this.filterTokens.length;\n if (tokenCount > 0) {\n this.removeToken(tokenCount - 1);\n }\n break;\n\n case 'Enter':\n case 'NumpadEnter':\n this.addToken(this.inputValue, this.category);\n e.preventDefault();\n break;\n }\n }\n\n private emitFilterEvent() {\n const tokens = this.filterTokens\n .filter((item) => item.id === this.ID_CUSTOM_FILTER_VALUE)\n .map((item) => item.value);\n const categories = this.filterTokens.filter(\n (item) => item.id !== this.ID_CUSTOM_FILTER_VALUE\n );\n const filterState: FilterState = {\n tokens,\n categories,\n };\n\n this.filterChanged.emit(filterState);\n }\n\n private addToken(\n token: string,\n category: string = this.ID_CUSTOM_FILTER_VALUE,\n operator = this.categoryLogicalOperator,\n emitEvent = true\n ) {\n if (token === undefined || token === null) {\n return;\n }\n\n const newToken = token.trim();\n\n if (newToken === '') {\n return;\n }\n\n if (this.hasToken(newToken)) {\n return;\n }\n\n const pair = { id: category, value: newToken, operator };\n this.filterTokens = [...this.filterTokens, pair];\n this.textInput.value = '';\n this.inputValue = '';\n this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n\n if (this.category !== undefined) {\n this.category = undefined;\n }\n\n this.isScrollStateDirty = true;\n\n this.textInput.focus();\n\n if (emitEvent) {\n this.emitFilterEvent();\n }\n\n this.closeDropdown();\n }\n\n private removeToken(index: number) {\n this.filterTokens = this.filterTokens.filter((_, i) => i !== index);\n this.emitFilterEvent();\n }\n\n private getCategoryIds() {\n const ids = [];\n for (const id in this.categories) {\n if (Object.prototype.hasOwnProperty.call(this.categories, id)) {\n ids.push(id);\n }\n }\n\n return ids;\n }\n\n private selectCategory(category: string) {\n this.category = category;\n this.textInput.value = '';\n this.inputValue = '';\n this.textInput.focus();\n this.categoryChanged.emit(category);\n }\n\n private resetFilter(e: Event) {\n e.stopPropagation();\n this.closeDropdown();\n this.filterTokens = [];\n this.emitFilterEvent();\n }\n\n private filterMultiples(value: string) {\n if (this.repeatCategories) {\n return true;\n }\n\n const isCategoryAlreadySet = this.filterTokens.find(\n (token) => token.id === value\n );\n\n return !isCategoryAlreadySet;\n }\n\n private hasToken(token: string) {\n return this.filterTokens.some((filterToken) => {\n const hasSameValue = filterToken.value === token;\n\n if (!hasSameValue) {\n return false;\n }\n\n if (this.category !== undefined) {\n return this.category === filterToken.id;\n }\n\n if (filterToken.id) {\n return filterToken.id === this.ID_CUSTOM_FILTER_VALUE;\n }\n\n return hasSameValue;\n });\n }\n\n private filterDuplicateTokens(value: string) {\n return !this.hasToken(value);\n }\n\n private filterByInput(value: string) {\n if (this.inputValue === undefined || this.inputValue === '') {\n return true;\n }\n\n return value.toLowerCase().indexOf(this.inputValue.toLowerCase()) !== -1;\n }\n\n private toggleCategoryOperator() {\n switch (this.categoryLogicalOperator) {\n case LogicalFilterOperator.EQUAL:\n this.categoryLogicalOperator = LogicalFilterOperator.NOT_EQUAL;\n break;\n\n case LogicalFilterOperator.NOT_EQUAL:\n this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n break;\n }\n }\n\n private getFilterChipLabel(value: {\n id: string;\n value: string;\n operator: LogicalFilterOperator;\n }): string {\n if (value.id === this.ID_CUSTOM_FILTER_VALUE) {\n return value.value;\n }\n\n const operatorString =\n value.operator === LogicalFilterOperator.EQUAL ? '=' : '!=';\n const label =\n this.categories[value.id]?.label ??\n this.nonSelectableCategories[value.id] ??\n value.id;\n\n return `${label} ${operatorString} ${value.value}`;\n }\n\n private getFilteredSuggestions() {\n if (!this.suggestions?.length) {\n return [];\n }\n\n return this.suggestions\n ?.filter((value) => this.filterByInput(value))\n .filter((value) => this.filterDuplicateTokens(value));\n }\n\n private hasCategorySelection() {\n return this.categories !== undefined;\n }\n\n private renderPlainSuggestions() {\n return (\n <div class=\"dropdown-item-container\">\n {this.getFilteredSuggestions().map((suggestion) => (\n <button\n class=\"dropdown-item\"\n data-id={suggestion}\n onClick={() => this.addToken(suggestion)}\n key={suggestion}\n title={suggestion}\n >\n {suggestion}\n </button>\n ))}\n </div>\n );\n }\n\n private renderOperatorButton() {\n const params: BaseButtonProps = {\n type: 'button',\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n selected: false,\n disabled: this.disabled,\n loading: false,\n icon: '',\n onClick: (e: Event) => {\n e.stopPropagation();\n this.toggleCategoryOperator();\n },\n extraClasses: {\n 'btn-icon-32': true,\n 'btn-toggle-operator': true,\n },\n };\n\n return (\n <BaseButton {...params}>\n {this.categoryLogicalOperator === LogicalFilterOperator.NOT_EQUAL\n ? '='\n : '!='}\n </BaseButton>\n );\n }\n\n private renderCategoryValues() {\n return (\n <div class=\"dropdown-item-container\">\n {this.renderOperatorButton()}\n <div class=\"dropdown-header\">\n {this.categories[this.category]?.label}\n </div>\n {this.categories[this.category]?.options\n .filter((value) => this.filterByInput(value))\n .filter((value) => this.filterDuplicateTokens(value))\n .map((id) => (\n <button\n class=\"dropdown-item category-item-value\"\n data-id={id}\n title={id}\n key={id}\n onClick={() => this.addToken(id, this.category)}\n >\n {`${\n this.categoryLogicalOperator === LogicalFilterOperator.EQUAL\n ? '='\n : '!='\n } ${id}`}\n </button>\n ))}\n </div>\n );\n }\n\n private renderDropdownContent() {\n if (this.hasCategorySelection()) {\n if (this.category !== undefined) {\n return this.renderCategoryValues();\n } else {\n return this.renderCategorySelection();\n }\n } else return this.renderPlainSuggestions();\n }\n\n private renderCategorySelection() {\n return (\n <div class=\"dropdown-item-container\">\n {this.getCategoryIds()\n ?.filter((id) => this.filterByInput(this.categories[id].label))\n .filter((id) => this.filterMultiples(id))\n .map((id) => (\n <button\n class=\"dropdown-item category-item category-item-id\"\n data-id={id}\n title={this.categories[id].label}\n key={id}\n onClick={(e) => {\n e.preventDefault();\n this.selectCategory(id);\n }}\n tabindex=\"0\"\n >\n {this.categories[id]?.label}\n </button>\n ))}\n </div>\n );\n }\n\n private getDropdownHeader() {\n if (this.categories !== undefined) {\n if (this.category !== undefined) {\n return null;\n } else {\n return this.labelCategories;\n }\n }\n\n return this.i18nPlainText;\n }\n\n componentDidRender() {\n if (this.isScrollStateDirty) {\n if (!this.tmpDisableScrollIntoView) {\n this.textInput.scrollIntoView();\n }\n this.isScrollStateDirty = false;\n }\n }\n\n private getResetButton() {\n return (\n <ix-icon-button\n onClick={(e) => this.resetFilter(e)}\n class={{\n 'reset-button': true,\n 'hide-reset-button':\n !this.filterTokens.length && this.category === undefined,\n }}\n ghost\n oval\n icon={'clear'}\n size=\"16\"\n ></ix-icon-button>\n );\n }\n\n private getIconColor() {\n if (this.disabled) {\n return 'color-componentn-1';\n }\n\n if (this.readonly) {\n return 'color-std-txt';\n }\n\n return 'color-primary';\n }\n\n render() {\n return (\n <Host>\n <form ref={(el) => (this.formElement = el)}>\n <div\n read-only={this.readonly}\n class={{\n 'input-container': true,\n disabled: this.disabled,\n focus: this.hasFocus,\n readonly: this.readonly,\n 'no-icon': this.hideIcon,\n }}\n >\n <ix-icon\n color={this.getIconColor()}\n class={{ 'd-none': this.hideIcon }}\n name={this.icon}\n size=\"16\"\n ></ix-icon>\n <div class=\"token-container\">\n <ul class=\"list-unstyled\">\n {this.filterTokens.map((value, index) => (\n <li\n key={value.toString()}\n class={{\n animate__animated: true,\n animate__fadein: true,\n }}\n >\n <ix-filter-chip\n disabled={this.disabled}\n readonly={this.readonly}\n onClick={(e) => e.stopPropagation()}\n onCloseClick={() => this.removeToken(index)}\n >\n {this.getFilterChipLabel(value)}\n </ix-filter-chip>\n </li>\n ))}\n {this.categories === undefined ? (\n ''\n ) : (\n <li\n class={{\n 'category-preview': true,\n 'd-none': this.category === undefined,\n }}\n >\n {this.categories[this.category]?.label}\n </li>\n )}\n <input\n class={{\n 'text-input': true,\n 'hide-placeholder':\n this.readonly ||\n this.disabled ||\n this.category !== undefined,\n }}\n autocomplete=\"off\"\n name=\"category-filter-input\"\n disabled={this.disabled}\n readonly={this.readonly}\n ref={(el) => (this.textInput = el)}\n type=\"text\"\n placeholder={this.placeholder}\n ></input>\n </ul>\n </div>\n {!this.readonly && !this.disabled && this.getResetButton()}\n </div>\n </form>\n\n {this.disabled || this.readonly ? (\n ''\n ) : (\n <ix-dropdown\n show={this.showDropdown}\n closeBehavior=\"outside\"\n offset={{ mainAxis: 2 }}\n anchor={this.textInput}\n trigger={this.hostElement}\n header={this.getDropdownHeader()}\n >\n {this.renderDropdownContent()}\n </ix-dropdown>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{r as e,h as r,H as t}from"./p-26e9d40e.js";const a=".sc-ix-playground-internal-h{display:block;position:relative;width:100vw;height:100vh;padding:0rem 0rem 0rem 0rem}";const n=a;const s=class{constructor(r){e(this,r)}render(){return r(t,{key:"d1a5b02febd62dcc43ea13c0a531990ec5fe2156"})}};s.style=n;export{s as ix_playground_internal};
2
- //# sourceMappingURL=p-33e903e1.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as t,h as e,H as s,g as i}from"./p-26e9d40e.js";import{c as r}from"./p-e898862b.js";import{a as o}from"./p-360b158e.js";const a=":host{display:block;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host ul{list-style:none;padding:0;margin-top:0;margin-bottom:0}:host(.item-size-l){--event-list-item-height:6.5rem;--event-list-item-content-white-space:normal}:host(.compact){--event-list-item-border-radius:0;--event-list-item-margin-bottom:0}";const h=a;const n=class{constructor(e){t(this,e);this.mutationObserver=r(this.onMutation.bind(this));this.itemHeight="S";this.compact=false;this.animated=true;this.chevron=undefined}watchChevron(t){this.handleChevron(t)}componentDidLoad(){if(this.animated){this.triggerFadeIn()}if(!Number.isNaN(Number(this.itemHeight))){const t=o(this.itemHeight);this.hostElement.querySelectorAll("ix-event-list-item").forEach((e=>{this.setCustomHeight(e,t)}))}this.handleChevron(this.chevron);this.mutationObserver.observe(this.hostElement,{childList:true,subtree:true})}onMutation(t){this.triggerFadeOut().then((()=>{if(typeof this.itemHeight==="number"){const e=o(this.itemHeight);t.filter((t=>t.type==="childList")).forEach((t=>t.addedNodes.forEach((t=>{const s=t;this.setCustomHeight(s,e)}))))}this.handleChevron(this.chevron);this.triggerFadeIn()}))}setCustomHeight(t,e){t.style.setProperty("--event-list-item-height",e)}triggerFadeOut(){if(!this.animated){return Promise.resolve()}const t=[{opacity:1,easing:"ease-in"},{opacity:0}];const e=this.hostElement.shadowRoot.querySelector("ul");return e.animate(t,{duration:n.fadeOutDuration}).finished}triggerFadeIn(){if(!this.animated){return}const t=this.hostElement.querySelectorAll("ix-event-list-item");t.forEach(((t,e)=>{const s=e*80;const i=s/(s+n.fadeInDuration);const r=[{opacity:0},{opacity:0,easing:"ease-out",offset:i},{opacity:1}];const o={duration:n.fadeInDuration+s,iterations:1};t.animate(r,o)}))}handleChevron(t){const e=this.hostElement.querySelectorAll("ix-event-list-item");e.forEach((e=>{if(t){e.setAttribute("chevron","true")}else if(t!==undefined){e.removeAttribute("chevron")}}))}render(){return e(s,{key:"753ef5eaecb97380a454359d59397b163a75c70f",class:{"item-size-s":this.itemHeight==="S","item-size-l":this.itemHeight==="L",compact:this.compact}},e("ul",{key:"c4264b59d439dc2dae8ec3153aa04fe5ee04383c"},e("slot",{key:"114837af21b63c7acec8eed2901aacc046608ab3"})))}get hostElement(){return i(this)}static get watchers(){return{chevron:["watchChevron"]}}};n.fadeOutDuration=50;n.fadeInDuration=150;n.style=h;export{n as ix_event_list};
2
- //# sourceMappingURL=p-37e4df76.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["eventListCss","IxEventListStyle0","EventList","this","mutationObserver","createMutationObserver","onMutation","bind","watchChevron","chevron","handleChevron","componentDidLoad","animated","triggerFadeIn","Number","isNaN","itemHeight","height","convertToRemString","hostElement","querySelectorAll","forEach","item","setCustomHeight","observe","childList","subtree","mutationRecords","triggerFadeOut","then","filter","mutation","type","addedNodes","itemHtml","style","setProperty","Promise","resolve","keyframes","opacity","easing","listElement","shadowRoot","querySelector","animate","duration","fadeOutDuration","finished","listItems","e","i","delay","offset","fadeInDuration","options","iterations","setAttribute","undefined","removeAttribute","render","h","Host","key","class","compact"],"sources":["src/components/event-list/event-list.scss?tag=ix-event-list&encapsulation=shadow","src/components/event-list/event-list.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n display: block;\n position: relative;\n\n ul {\n list-style: none;\n padding: 0;\n margin-top: 0;\n margin-bottom: 0;\n }\n}\n\n:host(.item-size-l) {\n --event-list-item-height: 6.5rem;\n --event-list-item-content-white-space: normal;\n}\n\n:host(.compact) {\n --event-list-item-border-radius: 0;\n --event-list-item-margin-bottom: 0;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { convertToRemString } from '../utils/rwd.util';\n\n@Component({\n tag: 'ix-event-list',\n styleUrl: 'event-list.scss',\n shadow: true,\n})\nexport class EventList {\n private readonly mutationObserver = createMutationObserver(\n this.onMutation.bind(this)\n );\n\n private static readonly fadeOutDuration = 50;\n private static readonly fadeInDuration = 150;\n\n @Element() hostElement!: HTMLIxEventListElement;\n\n /**\n * Determines the height of list items.\n * This can either be one of two predefined sizes ('S' or 'L') or an absolute pixel value.\n * In case a number is supplied it will get converted to rem internally.\n * Defaults to 'S'.\n */\n @Prop() itemHeight: 'S' | 'L' | number = 'S';\n\n /**\n * Make event-list items more compact\n */\n @Prop() compact = false;\n\n /**\n * Animate state change transitions. Defaults to 'true'.\n */\n @Prop() animated = true;\n\n /**\n * Display a chevron icon in list items. Defaults to 'false'\n */\n @Prop() chevron: boolean;\n\n @Watch('chevron')\n watchChevron(chevron: boolean | undefined) {\n this.handleChevron(chevron);\n }\n\n componentDidLoad() {\n if (this.animated) {\n this.triggerFadeIn();\n }\n\n if (!Number.isNaN(Number(this.itemHeight))) {\n const height = convertToRemString(this.itemHeight as number);\n this.hostElement\n .querySelectorAll('ix-event-list-item')\n .forEach((item) => {\n this.setCustomHeight(item as HTMLElement, height);\n });\n }\n\n this.handleChevron(this.chevron);\n\n this.mutationObserver.observe(this.hostElement, {\n childList: true,\n subtree: true,\n });\n }\n\n private onMutation(mutationRecords: Array<MutationRecord>) {\n this.triggerFadeOut().then(() => {\n if (typeof this.itemHeight === 'number') {\n const height = convertToRemString(this.itemHeight);\n\n mutationRecords\n .filter((mutation) => mutation.type === 'childList')\n .forEach((mutation) =>\n mutation.addedNodes.forEach((item) => {\n const itemHtml = item as HTMLElement;\n\n this.setCustomHeight(itemHtml, height);\n })\n );\n }\n\n this.handleChevron(this.chevron);\n\n this.triggerFadeIn();\n });\n }\n\n private setCustomHeight(item: HTMLElement, height: string) {\n item.style.setProperty('--event-list-item-height', height);\n }\n\n private triggerFadeOut(): Promise<any> {\n if (!this.animated) {\n return Promise.resolve();\n }\n\n const keyframes = [\n {\n opacity: 1,\n easing: 'ease-in',\n },\n { opacity: 0 },\n ];\n const listElement = this.hostElement.shadowRoot.querySelector('ul');\n return listElement.animate(keyframes, {\n duration: EventList.fadeOutDuration,\n }).finished;\n }\n\n private triggerFadeIn() {\n if (!this.animated) {\n return;\n }\n\n const listItems = this.hostElement.querySelectorAll('ix-event-list-item');\n listItems.forEach((e, i) => {\n const delay = i * 80;\n const offset = delay / (delay + EventList.fadeInDuration);\n const keyframes = [\n { opacity: 0 },\n { opacity: 0, easing: 'ease-out', offset },\n { opacity: 1 },\n ];\n const options = {\n duration: EventList.fadeInDuration + delay,\n iterations: 1,\n };\n e.animate(keyframes, options);\n });\n }\n\n private handleChevron(chevron: boolean | undefined): void {\n const listItems = this.hostElement.querySelectorAll('ix-event-list-item');\n\n listItems.forEach((e) => {\n if (chevron) {\n e.setAttribute('chevron', 'true');\n } else if (chevron !== undefined) {\n e.removeAttribute('chevron');\n }\n });\n }\n\n render() {\n return (\n <Host\n class={{\n 'item-size-s': this.itemHeight === 'S',\n 'item-size-l': this.itemHeight === 'L',\n compact: this.compact,\n }}\n >\n <ul>\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"mappings":"iIAAA,MAAMA,EAAe,03BACrB,MAAAC,EAAeD,E,MCiBFE,EAAS,M,yBACHC,KAAAC,iBAAmBC,EAClCF,KAAKG,WAAWC,KAAKJ,O,gBAckB,I,aAKvB,M,cAKC,K,uBAQnB,YAAAK,CAAaC,GACXN,KAAKO,cAAcD,E,CAGrB,gBAAAE,GACE,GAAIR,KAAKS,SAAU,CACjBT,KAAKU,e,CAGP,IAAKC,OAAOC,MAAMD,OAAOX,KAAKa,aAAc,CAC1C,MAAMC,EAASC,EAAmBf,KAAKa,YACvCb,KAAKgB,YACFC,iBAAiB,sBACjBC,SAASC,IACRnB,KAAKoB,gBAAgBD,EAAqBL,EAAO,G,CAIvDd,KAAKO,cAAcP,KAAKM,SAExBN,KAAKC,iBAAiBoB,QAAQrB,KAAKgB,YAAa,CAC9CM,UAAW,KACXC,QAAS,M,CAIL,UAAApB,CAAWqB,GACjBxB,KAAKyB,iBAAiBC,MAAK,KACzB,UAAW1B,KAAKa,aAAe,SAAU,CACvC,MAAMC,EAASC,EAAmBf,KAAKa,YAEvCW,EACGG,QAAQC,GAAaA,EAASC,OAAS,cACvCX,SAASU,GACRA,EAASE,WAAWZ,SAASC,IAC3B,MAAMY,EAAWZ,EAEjBnB,KAAKoB,gBAAgBW,EAAUjB,EAAO,K,CAK9Cd,KAAKO,cAAcP,KAAKM,SAExBN,KAAKU,eAAe,G,CAIhB,eAAAU,CAAgBD,EAAmBL,GACzCK,EAAKa,MAAMC,YAAY,2BAA4BnB,E,CAG7C,cAAAW,GACN,IAAKzB,KAAKS,SAAU,CAClB,OAAOyB,QAAQC,S,CAGjB,MAAMC,EAAY,CAChB,CACEC,QAAS,EACTC,OAAQ,WAEV,CAAED,QAAS,IAEb,MAAME,EAAcvC,KAAKgB,YAAYwB,WAAWC,cAAc,MAC9D,OAAOF,EAAYG,QAAQN,EAAW,CACpCO,SAAU5C,EAAU6C,kBACnBC,Q,CAGG,aAAAnC,GACN,IAAKV,KAAKS,SAAU,CAClB,M,CAGF,MAAMqC,EAAY9C,KAAKgB,YAAYC,iBAAiB,sBACpD6B,EAAU5B,SAAQ,CAAC6B,EAAGC,KACpB,MAAMC,EAAQD,EAAI,GAClB,MAAME,EAASD,GAASA,EAAQlD,EAAUoD,gBAC1C,MAAMf,EAAY,CAChB,CAAEC,QAAS,GACX,CAAEA,QAAS,EAAGC,OAAQ,WAAYY,UAClC,CAAEb,QAAS,IAEb,MAAMe,EAAU,CACdT,SAAU5C,EAAUoD,eAAiBF,EACrCI,WAAY,GAEdN,EAAEL,QAAQN,EAAWgB,EAAQ,G,CAIzB,aAAA7C,CAAcD,GACpB,MAAMwC,EAAY9C,KAAKgB,YAAYC,iBAAiB,sBAEpD6B,EAAU5B,SAAS6B,IACjB,GAAIzC,EAAS,CACXyC,EAAEO,aAAa,UAAW,O,MACrB,GAAIhD,IAAYiD,UAAW,CAChCR,EAAES,gBAAgB,U,KAKxB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,cAAe7D,KAAKa,aAAe,IACnC,cAAeb,KAAKa,aAAe,IACnCiD,QAAS9D,KAAK8D,UAGhBJ,EAAA,MAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,8C,2FA/IgB7D,EAAA6C,gBAAkB,GAClB7C,EAAAoD,eAAiB,I"}
@@ -1,2 +0,0 @@
1
- import{r as e,h as o,H as t,g as r}from"./p-26e9d40e.js";const a="label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input,input:-webkit-autofill{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-input--background) inset !important;-webkit-text-fill-color:var(--theme-input--color) !important;border-color:var(--theme-input--border-color) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover,input:hover{border-color:var(--theme-input--border-color--hover);background-color:var(--theme-input--background--hover)}input.focus,input:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus)}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder{color:transparent}input:disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{height:3.25rem;padding:0.375rem 1.25rem 0.375rem 0.5rem}textarea,textarea:-webkit-autofill{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-input--background) inset !important;-webkit-text-fill-color:var(--theme-input--color) !important;border-color:var(--theme-input--border-color) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover,textarea:hover{border-color:var(--theme-input--border-color--hover);background-color:var(--theme-input--background--hover)}textarea.focus,textarea:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus)}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder{color:transparent}textarea~.valid-feedback,textarea~.invalid-feedback,input~.valid-feedback,input~.invalid-feedback{display:none;font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}form textarea~.valid-feedback,form input~.valid-feedback{color:var(--theme-color-success)}form textarea~.invalid-feedback,form input~.invalid-feedback{color:var(--theme-color-alarm-text)}form:not([novalidate]) :invalid,form:not([novalidate]) .is-invalid,form.was-validated :invalid,form.was-validated .is-invalid{background-color:var(--theme-input-error--background);border-color:var(--theme-input-error--border-color);background-image:url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\") !important;background-position:left calc(0.375em + 0.1875rem) center;padding-right:0.75rem;padding-left:calc(1.5em + 0.75rem);background-size:18px;background-repeat:no-repeat}form:not([novalidate]) :invalid~.invalid-feedback,form:not([novalidate]) .is-invalid~.invalid-feedback,form.was-validated :invalid~.invalid-feedback,form.was-validated .is-invalid~.invalid-feedback{display:block}form:not([novalidate]) :valid~.valid-feedback,form:not([novalidate]) .is-valid~.valid-feedback,form.was-validated :valid~.valid-feedback,form.was-validated .is-valid~.valid-feedback{display:block}form:not(.was-validated) .invalid-feedback,form:not(.was-validated) .valid-feedback{display:none !important}:host{display:contents}";const n=a;const i=class{constructor(o){e(this,o);this.label=undefined}get inputElement(){return this.hostElement.querySelector("input")}componentWillLoad(){}render(){return o(t,{key:"e1313ac6762c322974a1a69f030c18e91c63d958"},this.label?o("label",{htmlFor:this.inputElement.id},this.label):null,o("slot",{key:"fbbe9a9eefffdce4b888d3dfb3ec80b1e6c8111d"}))}get hostElement(){return r(this)}};i.style=n;export{i as ix_form_field};
2
- //# sourceMappingURL=p-7289b0be.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as e,c as t,h as s,H as a}from"./p-26e9d40e.js";const n=":host{display:block}";const i=n;const c=class{constructor(s){e(this,s);this.labelChange=t(this,"labelChange",7);this.label=undefined}watchLabel(e,t){this.labelChange.emit({name:"ix-menu-settings-item",oldLabel:t,newLabel:e})}render(){return s(a,{key:"af7b6698864d0f6c2e893843787b07450f586259"},s("slot",{key:"5ced9613e2513330bd9d8152656dedb7320bdd74"}))}static get watchers(){return{label:["watchLabel"]}}};c.style=i;export{c as ix_menu_settings_item};
2
- //# sourceMappingURL=p-7b5ed355.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as e,h as t,H as o,g as r,c as s}from"./p-26e9d40e.js";import{g as i}from"./p-712e0ee0.js";const n=":host{display:block;position:relative;height:2rem;width:2rem;margin-block-start:0.3125rem;margin-inline-end:0.3125rem;margin-inline-start:auto}:host .hide{visibility:collapse}";const a=n;const c=class{constructor(t){e(this,t);this.showContextMenu=false}getTrigger(){return this.hostElement}configureDropdown(e,t){e.positioningStrategy="fixed";e.trigger=t}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector("slot");if(!e){return}const t=i(e);this.showContextMenu=t.length!==0;const o=t.find((e=>e.tagName==="IX-DROPDOWN"));const r=this.getTrigger();if(!r){return}if(!o){return}this.configureDropdown(o,r)}render(){return t(o,{key:"288d46637e80e99a79a01e071d69a77582edf051"},t("ix-icon-button",{key:"7c9ad1282215761c6d160799971114cc3533e30a",class:{hide:!this.showContextMenu},size:"24",ghost:true,icon:"context-menu"}),t("slot",{key:"c80375c5028e87d03c5af3b3deaa45fa2958e11f",onSlotchange:()=>this.onSlotChange()}))}get hostElement(){return r(this)}};c.style=a;const h=":host{display:flex;min-height:2.25rem;height:2.25rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host>button{display:flex;height:100%;width:100%;align-items:center;justify-content:flex-start;position:relative;outline:none;background-color:var(--theme-group-item--background);border:1px solid transparent;color:var(--theme-color-std-text);padding-left:2.5rem}:host>button:focus-visible{border:1px solid var(--theme-color-focus-bdr)}:host ix-icon{margin-right:0.25rem;margin-top:-0.125rem}:host .group-entry-selection-indicator{position:absolute;left:-1px;height:calc(100% + 2px);width:0.25rem}:host .group-entry-text{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .group-entry-text-secondary{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text)}:host .group-entry-text-secondary,:host .group-entry-text-secondary span{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.selected){border-top-width:0.062rem !important;background-color:var(--theme-color-ghost--selected)}:host(.selected) .group-entry-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host(:not(.suppress-selection):hover){background-color:var(--theme-color-ghost--selected-hover);border-color:var(--theme-group-item--border-color--hover)}:host(:not(.suppress-selection).selected:hover){background-color:var(--theme-color-ghost--selected-hover)}:host(:not(.suppress-selection):active){background-color:var(--theme-color-ghost--selected-active);border-color:var(--theme-group-item--border-color--active)}:host(:not(.suppress-selection).selected:active){background-color:var(--theme-color-ghost--selected-active)}";const l=h;const d=class{constructor(t){e(this,t);this.selectedChanged=s(this,"selectedChanged",7);this.icon=undefined;this.text=undefined;this.secondaryText=undefined;this.suppressSelection=false;this.selected=undefined;this.focusable=true;this.index=undefined}clickListen(){if(this.suppressSelection){return}this.selectedChanged.emit(this.hostElement)}render(){return t(o,{key:"5d465a80365854b2dc13389fcee91f0e824cf9c6",class:{selected:this.selected&&!this.suppressSelection,"suppress-selection":this.suppressSelection}},t("button",{key:"df47595b58a38860ec502bb9478b3626a47c9d9d",tabindex:this.focusable?0:-1},t("div",{key:"97b2949849401b49e746676b077b9b9f134ba4a0",class:"group-entry-selection-indicator"}),this.icon?t("ix-icon",{size:"16",name:this.icon}):null,this.text?t("span",{class:"group-entry-text"},t("span",{title:this.text},this.text)):null,this.secondaryText?t("span",{class:"group-entry-text-secondary"},t("span",{title:this.secondaryText},this.secondaryText)):null,t("slot",{key:"4b81d50e99262b562ffc5b4745059ad83973c8bf"})))}get hostElement(){return r(this)}};d.style=l;export{c as ix_group_context_menu,d as ix_group_item};
2
- //# sourceMappingURL=p-87fe9d5f.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["groupContextMenuCss","IxGroupContextMenuStyle0","GroupContextMenu","getTrigger","this","hostElement","configureDropdown","dropdownElement","triggerElement","positioningStrategy","trigger","onSlotChange","slot","shadowRoot","querySelector","elements","getSlottedElements","showContextMenu","length","find","elm","tagName","render","h","Host","key","class","hide","size","ghost","icon","onSlotchange","groupItemCss","IxGroupItemStyle0","GroupItem","clickListen","suppressSelection","selectedChanged","emit","selected","tabindex","focusable","name","text","title","secondaryText"],"sources":["src/components/group/group-context-menu.scss?tag=ix-group-context-menu&encapsulation=shadow","src/components/group/group-context-menu.tsx","src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=shadow","src/components/group-item/group-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n:host {\n display: block;\n position: relative;\n\n height: 2rem;\n width: 2rem;\n\n margin-block-start: 0.3125rem;\n margin-inline-end: 0.3125rem;\n margin-inline-start: auto;\n\n .hide {\n visibility: collapse;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, State } from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-group-context-menu',\n styleUrl: './group-context-menu.scss',\n shadow: true,\n})\nexport class GroupContextMenu {\n @Element() hostElement!: HTMLIxGroupContextMenuElement;\n\n @State() showContextMenu = false;\n\n private getTrigger() {\n return this.hostElement;\n }\n\n private configureDropdown(\n dropdownElement: HTMLIxDropdownElement,\n triggerElement: HTMLElement\n ) {\n dropdownElement.positioningStrategy = 'fixed';\n dropdownElement.trigger = triggerElement;\n }\n\n private onSlotChange() {\n const slot = this.hostElement.shadowRoot.querySelector('slot');\n if (!slot) {\n return;\n }\n const elements = getSlottedElements(slot);\n this.showContextMenu = elements.length !== 0;\n\n const dropdownElement = elements.find(\n (elm: Element) => elm.tagName === 'IX-DROPDOWN'\n );\n\n const triggerElement = this.getTrigger();\n\n if (!triggerElement) {\n return;\n }\n\n if (!dropdownElement) {\n return;\n }\n\n this.configureDropdown(dropdownElement, triggerElement);\n }\n\n render() {\n return (\n <Host>\n <ix-icon-button\n class={{ hide: !this.showContextMenu }}\n size=\"24\"\n ghost={true}\n icon={'context-menu'}\n ></ix-icon-button>\n <slot onSlotchange={() => this.onSlotChange()}></slot>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/shadow-dom/hover';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n$focusBorderWidth: 1px;\n\n:host {\n @include ix-component;\n display: flex;\n min-height: 2.25rem;\n height: 2.25rem;\n\n > button {\n display: flex;\n height: 100%;\n width: 100%;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n outline: none;\n background-color: var(--theme-group-item--background);\n border: 1px solid transparent;\n color: var(--theme-color-std-text);\n\n padding-left: 2.5rem;\n\n &:focus-visible {\n border: $focusBorderWidth solid var(--theme-color-focus-bdr);\n }\n }\n\n ix-icon {\n margin-right: $tiny-space;\n margin-top: -0.125rem;\n }\n\n .group-entry-selection-indicator {\n position: absolute;\n left: -#{$focusBorderWidth};\n height: calc(100% + #{$focusBorderWidth * 2});\n width: $tiny-space;\n }\n\n .group-entry-text {\n @include text-default;\n @include ellipsis();\n }\n\n .group-entry-text-secondary {\n &,\n span {\n @include text-default;\n @include ellipsis;\n }\n\n display: flex;\n justify-content: flex-end;\n flex-grow: 1;\n white-space: nowrap;\n color: var(--theme-color-soft-text);\n }\n}\n\n:host(.selected) {\n border-top-width: 0.062rem !important;\n background-color: var(--theme-color-ghost--selected);\n\n .group-entry-selection-indicator {\n background-color: var(--theme-group-item-indicator--background--selected);\n }\n}\n\n:host(:not(.suppress-selection):hover) {\n background-color: var(--theme-color-ghost--selected-hover);\n border-color: var(--theme-group-item--border-color--hover);\n}\n\n:host(:not(.suppress-selection).selected:hover) {\n background-color: var(--theme-color-ghost--selected-hover);\n}\n\n:host(:not(.suppress-selection):active) {\n background-color: var(--theme-color-ghost--selected-active);\n border-color: var(--theme-group-item--border-color--active);\n}\n\n:host(:not(.suppress-selection).selected:active) {\n background-color: var(--theme-color-ghost--selected-active);\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-group-item',\n styleUrl: 'group-item.scss',\n shadow: true,\n})\nexport class GroupItem {\n @Element() hostElement!: HTMLIxGroupItemElement;\n\n /**\n * Group item icon\n */\n @Prop() icon: string;\n\n /**\n * Group item text\n */\n @Prop() text: string;\n\n /**\n * Group item secondary text\n */\n @Prop() secondaryText: string;\n\n /**\n * Supress the selection of the group\n */\n @Prop() suppressSelection = false;\n\n /**\n * Show selected state\n */\n @Prop() selected: boolean;\n\n /**\n * The elements tabindex attribute will get set accordingly.\n * If true tabindex will be 0, -1 otherwise.\n */\n @Prop() focusable = true;\n\n /**\n * Selection changed\n */\n @Event() selectedChanged: EventEmitter<HTMLIxGroupItemElement>;\n\n /**\n * Index\n */\n @Prop() index: number;\n\n @Listen('click', { passive: true })\n clickListen() {\n if (this.suppressSelection) {\n return;\n }\n this.selectedChanged.emit(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n selected: this.selected && !this.suppressSelection,\n 'suppress-selection': this.suppressSelection,\n }}\n >\n <button tabindex={this.focusable ? 0 : -1}>\n <div class=\"group-entry-selection-indicator\"></div>\n {this.icon ? <ix-icon size=\"16\" name={this.icon}></ix-icon> : null}\n {this.text ? (\n <span class=\"group-entry-text\">\n <span title={this.text}>{this.text}</span>\n </span>\n ) : null}\n {this.secondaryText ? (\n <span class=\"group-entry-text-secondary\">\n <span title={this.secondaryText}>{this.secondaryText}</span>\n </span>\n ) : null}\n <slot></slot>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAsB,kLAC5B,MAAAC,EAAeD,E,MCgBFE,EAAgB,M,8CAGA,K,CAEnB,UAAAC,GACN,OAAOC,KAAKC,W,CAGN,iBAAAC,CACNC,EACAC,GAEAD,EAAgBE,oBAAsB,QACtCF,EAAgBG,QAAUF,C,CAGpB,YAAAG,GACN,MAAMC,EAAOR,KAAKC,YAAYQ,WAAWC,cAAc,QACvD,IAAKF,EAAM,CACT,M,CAEF,MAAMG,EAAWC,EAAmBJ,GACpCR,KAAKa,gBAAkBF,EAASG,SAAW,EAE3C,MAAMX,EAAkBQ,EAASI,MAC9BC,GAAiBA,EAAIC,UAAY,gBAGpC,MAAMb,EAAiBJ,KAAKD,aAE5B,IAAKK,EAAgB,CACnB,M,CAGF,IAAKD,EAAiB,CACpB,M,CAGFH,KAAKE,kBAAkBC,EAAiBC,E,CAG1C,MAAAc,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,kBAAAE,IAAA,2CACEC,MAAO,CAAEC,MAAOvB,KAAKa,iBACrBW,KAAK,KACLC,MAAO,KACPC,KAAM,iBAERP,EAAA,QAAAE,IAAA,2CAAMM,aAAc,IAAM3B,KAAKO,iB,8CCpEvC,MAAMqB,EAAe,2lFACrB,MAAAC,EAAeD,E,MCwBFE,EAAS,M,sKAqBQ,M,uCAWR,K,qBAapB,WAAAC,GACE,GAAI/B,KAAKgC,kBAAmB,CAC1B,M,CAEFhC,KAAKiC,gBAAgBC,KAAKlC,KAAKC,Y,CAGjC,MAAAiB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLa,SAAUnC,KAAKmC,WAAanC,KAAKgC,kBACjC,qBAAsBhC,KAAKgC,oBAG7Bb,EAAA,UAAAE,IAAA,2CAAQe,SAAUpC,KAAKqC,UAAY,GAAK,GACtClB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oCACVtB,KAAK0B,KAAOP,EAAA,WAASK,KAAK,KAAKc,KAAMtC,KAAK0B,OAAmB,KAC7D1B,KAAKuC,KACJpB,EAAA,QAAMG,MAAM,oBACVH,EAAA,QAAMqB,MAAOxC,KAAKuC,MAAOvC,KAAKuC,OAE9B,KACHvC,KAAKyC,cACJtB,EAAA,QAAMG,MAAM,8BACVH,EAAA,QAAMqB,MAAOxC,KAAKyC,eAAgBzC,KAAKyC,gBAEvC,KACJtB,EAAA,QAAAE,IAAA,8C"}
@@ -1,2 +0,0 @@
1
- import{r as e,c as t,h as a,H as s}from"./p-26e9d40e.js";const b=":host{display:block}";const c=b;const n=class{constructor(a){e(this,a);this.labelChange=t(this,"labelChange",7);this.label=undefined}watchLabel(e,t){this.labelChange.emit({name:"ix-menu-about-item",oldLabel:t,newLabel:e})}render(){return a(s,{key:"963b59afed12d8bba0b4107da846b433bc451b1f"},a("slot",{key:"fbea143350cd9850db1526e19363f7d8632035af"}))}static get watchers(){return{label:["watchLabel"]}}};n.style=c;export{n as ix_menu_about_item};
2
- //# sourceMappingURL=p-8a06a632.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as e,c as t,h as o,F as r,H as i,g as s}from"./p-26e9d40e.js";import{c as d}from"./p-e898862b.js";import{h as a}from"./p-712e0ee0.js";const h=":host{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:column;position:relative;max-width:19.75rem;border-color:var(--theme-group-item--border-color)}:host .group-header{height:4rem;min-height:4rem;max-height:4rem;border-radius:var(--theme-group--border-radius) var(--theme-group--border-radius) 0 0;display:flex;background-color:var(--theme-group-item--background);color:var(--theme-group-header--color);cursor:pointer}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover)}:host .group-header:not(.disabled):not(:disabled):hover.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled){cursor:pointer}:host .group-header:not(.disabled):not(:disabled):active,:host .group-header:not(.disabled):not(:disabled).active{background-color:var(--theme-group-item--background--active)}:host .group-header:not(.disabled):not(:disabled):active.selected,:host .group-header:not(.disabled):not(:disabled).active.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header:not(.disabled):not(:disabled):focus-visible{border:1px solid var(--theme-color-focus-bdr);border-radius:var(--theme-default-border-radius) var(--theme-default-border-radius) 0px 0px;outline:none}:host .group-header.selected{background-color:var(--theme-group-item--background--selected)}:host .group-header.selected .group-header-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header .group-header-selection-indicator{background-color:var(--theme-color-input--focus)}:host .group-header .group-header-selection-indicator.group-header-selection-indicator-item-selected{background-color:var(--theme-group-item-indicator--background--selected)}:host .group-header-clickable{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;width:100%;min-width:0}:host .group-header-selection-indicator{width:0.25rem;border-top-left-radius:var(--theme-group--border-radius)}:host .group-header-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-direction:row;justify-content:space-between;min-width:0;flex-grow:1;flex-basis:0;padding:0.5rem;padding-left:0}:host .group-header-content .group-header-props-container{width:100%}:host .group-header-content .group-header-title{display:flex;align-items:center;font-size:1rem;font-weight:700;height:1.5rem}:host .group-header-content .group-header-title>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;padding-right:0}:host .group-header-content .group-subheader{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:1.25rem;font-size:0.875rem;color:var(--theme-group-subheader--color)}:host .expand-icon{padding:0.125rem 0.437rem;color:var(--theme-color-std-text)}:host .btn-expand-header{margin:0.5rem;margin-inline-end:0.25rem;min-width:1.5rem}:host .group-content{display:flex;flex-direction:column;gap:1px;margin-top:1px}:host .footer{visibility:collapse;height:auto;min-height:0}:host .footer-visible{visibility:visible}:host .hidden{display:none}";const n=h;const l=class{constructor(o){e(this,o);this.selectGroup=t(this,"selectGroup",7);this.selectItem=t(this,"selectItem",7);this.collapsedChanged=t(this,"collapsedChanged",7);this.suppressHeaderSelection=false;this.header=undefined;this.subHeader=undefined;this.collapsed=true;this.selected=undefined;this.index=undefined;this.expandOnHeaderClick=false;this.itemSelected=false;this.dropdownTriggerRef=undefined;this.slotSize=this.groupItems.length;this.footerVisible=false}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-dropdown-item"))}get groupItems(){return Array.from(this.hostElement.querySelectorAll("ix-group-item:not(.footer)"))}get groupContent(){return this.hostElement.shadowRoot.querySelector(".group-content")}onExpandClick(e){this.collapsed=!this.collapsed;this.collapsedChanged.emit(this.collapsed);e.stopPropagation()}onHeaderClick(e){this.setGroupSelection(!this.selected);if(this.suppressHeaderSelection){this.onExpandClick(e)}}onItemClick(e){if(e===this.index){this.index=undefined;this.selectItem.emit(undefined)}else{this.index=e;this.selectItem.emit(e)}if(this.index>=0){this.itemSelected=true}else this.itemSelected=false;this.setGroupSelection(false)}setGroupSelection(e){if(!this.suppressHeaderSelection){this.selected=e;this.selectGroup.emit(this.selected)}}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector('slot[name="footer"]');if(e){this.footerVisible=a(e)}}componentWillRender(){this.groupItems.forEach(((e,t)=>{if(this.selected===true){e.selected=false;this.index=undefined;this.itemSelected=false;return}e.selected=t===this.index;e.index=t}))}componentDidLoad(){this.observer=d((()=>{this.slotSize=this.groupItems.length}));this.observer.observe(this.groupContent,{childList:true});this.groupContent.addEventListener("selectedChanged",(e=>{this.onItemClick(e.detail.index)}))}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){return o(i,{key:"ae563c8c4bd705c6c290eda0654aecabd90b441d"},o("div",{key:"833310ab5fb8f61ba9fd02ffe484e3357cdf8ba1",class:{"group-header":true,expand:!this.collapsed,selected:this.selected},tabindex:"0"},o("div",{key:"e19b49f36efe557aa18aa9b2f536fa0b5fe1c532",class:"group-header-clickable",onClick:e=>this.onHeaderClick(e)},o("div",{key:"82ac45359bd081ca6b0ebf725cc1c95e594edcbc",class:{"group-header-selection-indicator":true,"group-header-selection-indicator-item-selected":this.itemSelected}}),o("div",{key:"6854fb9a7d061149fc1d19329bad6b7b67277f15",class:"btn-expand-header"},o("ix-icon",{key:"342017a6a8dccb6d29c0ada93ee37620f7ab0237",class:{hidden:this.slotSize===0},name:this.collapsed?"chevron-right-small":"chevron-down-small",onClick:e=>this.onExpandClick(e)})),o("div",{key:"b829051829db7df20de99a3a523ced036acf3392",class:"group-header-content"},this.header?o("div",{class:"group-header-props-container"},o("div",{class:"group-header-title"},o("span",{title:this.header},this.header)),o("div",{class:"group-subheader",title:this.subHeader},this.subHeader)):null,o("slot",{key:"61e4435295d8875eac855da9542c89707bce9936",name:"header"}))),o("ix-group-context-menu",{key:"d88cfb86005c5ea3342d6327c799d2a80e0bb281"},o("slot",{key:"9bf82a1c5ff2c931995fff0a92eac522d5515bca",name:"dropdown"}))),o("div",{key:"b4b412f8704f3618443a18d191b05a4fa9604df7",class:{"group-content":true}},!this.collapsed?o(r,null,o("slot",null),o("ix-group-item",{suppressSelection:true,focusable:false,class:{footer:true,"footer-visible":this.footerVisible}},o("slot",{name:"footer",onSlotchange:()=>this.onSlotChange()}))):null))}get hostElement(){return s(this)}};l.style=n;export{l as ix_group};
2
- //# sourceMappingURL=p-96f2c71a.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["groupCss","IxGroupStyle0","Group","this","groupItems","length","dropdownItems","Array","from","hostElement","querySelectorAll","groupContent","shadowRoot","querySelector","onExpandClick","event","collapsed","collapsedChanged","emit","stopPropagation","onHeaderClick","setGroupSelection","selected","suppressHeaderSelection","onItemClick","index","undefined","selectItem","itemSelected","selection","selectGroup","onSlotChange","slot","footerVisible","hasSlottedElements","componentWillRender","forEach","item","componentDidLoad","observer","createMutationObserver","slotSize","observe","childList","addEventListener","evt","detail","disconnectedCallback","disconnect","render","h","Host","key","class","expand","tabindex","onClick","e","hidden","name","header","title","subHeader","Fragment","suppressSelection","focusable","footer","onSlotchange"],"sources":["src/components/group/group.scss?tag=ix-group&encapsulation=shadow","src/components/group/group.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n @include ellipsis;\n\n display: flex;\n flex-direction: column;\n position: relative;\n max-width: 19.75rem;\n border-color: var(--theme-group-item--border-color);\n\n .group-header {\n height: 4rem;\n min-height: 4rem;\n max-height: 4rem;\n border-radius: var(--theme-group--border-radius)\n var(--theme-group--border-radius) 0 0;\n display: flex;\n background-color: var(--theme-group-item--background);\n color: var(--theme-group-header--color);\n\n cursor: pointer;\n\n @include hover {\n background-color: var(--theme-group-item--background--hover);\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include focus-visible {\n border: 1px solid var(--theme-color-focus-bdr);\n border-radius: var(--theme-default-border-radius)\n var(--theme-default-border-radius) 0px 0px;\n outline: none;\n }\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n\n .group-header-selection-indicator {\n background-color: var(\n --theme-group-item-indicator--background--selected\n );\n }\n }\n\n .group-header-selection-indicator {\n background-color: var(--theme-color-input--focus);\n\n &.group-header-selection-indicator-item-selected {\n background-color: var(\n --theme-group-item-indicator--background--selected\n );\n }\n }\n }\n\n .group-header-clickable {\n @include ellipsis;\n\n display: flex;\n width: 100%;\n min-width: 0;\n }\n\n .group-header-selection-indicator {\n width: $tiny-space;\n border-top-left-radius: var(--theme-group--border-radius);\n }\n\n .group-header-content {\n @include ellipsis;\n\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n min-width: 0;\n flex-grow: 1;\n flex-basis: 0;\n padding: 0.5rem;\n padding-left: 0;\n\n .group-header-props-container {\n width: 100%;\n }\n\n .group-header-title {\n display: flex;\n align-items: center;\n font-size: 1rem;\n font-weight: $font-weight-bold;\n height: 1.5rem;\n\n & > * {\n @include ellipsis;\n\n min-width: 0;\n padding-right: 0;\n }\n }\n\n .group-subheader {\n @include ellipsis();\n\n height: 1.25rem;\n font-size: 0.875rem;\n color: var(--theme-group-subheader--color);\n }\n }\n\n .expand-icon {\n padding: 0.125rem 0.437rem;\n color: var(--theme-color-std-text);\n }\n\n .btn-expand-header {\n margin: $small-space;\n margin-inline-end: $tiny-space;\n min-width: 1.5rem;\n }\n\n .group-content {\n display: flex;\n flex-direction: column;\n gap: 1px;\n margin-top: 1px;\n }\n\n .footer {\n visibility: collapse;\n height: auto;\n min-height: 0;\n }\n\n .footer-visible {\n visibility: visible;\n }\n\n .hidden {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { hasSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-group',\n styleUrl: 'group.scss',\n shadow: true,\n})\nexport class Group {\n @Element() hostElement!: HTMLIxGroupElement;\n\n /**\n * Prevent header from being selectable\n */\n @Prop() suppressHeaderSelection = false;\n\n /**\n * Group header\n */\n @Prop() header: string;\n\n /**\n * Group header subtitle\n */\n @Prop() subHeader: string;\n\n /**\n * Whether the group is collapsed or expanded. Defaults to true.\n */\n @Prop({ mutable: true, reflect: true }) collapsed = true;\n\n /**\n * Whether the group is selected.\n */\n @Prop({ mutable: true, reflect: true }) selected: boolean;\n\n /**\n * The index of the selected group entry.\n * If undefined no group item is selected.\n */\n @Prop({ mutable: true, reflect: true }) index: number;\n\n /**\n * Expand the group if the header is clicked\n */\n @Prop() expandOnHeaderClick = false;\n\n /**\n * Emits when whole group gets selected.\n */\n @Event() selectGroup: EventEmitter<boolean>;\n\n /**\n * Emits when group item gets selected.\n */\n @Event() selectItem: EventEmitter<number>;\n\n /**\n * Group collapsed\n */\n @Event() collapsedChanged: EventEmitter<boolean>;\n\n @State() itemSelected = false;\n @State() dropdownTriggerRef: HTMLElement;\n @State() slotSize = this.groupItems.length;\n @State() footerVisible = false;\n\n private observer: MutationObserver;\n\n get dropdownItems() {\n return Array.from(\n this.hostElement.querySelectorAll('ix-group-dropdown-item')\n );\n }\n\n get groupItems(): Array<HTMLIxGroupItemElement> {\n return Array.from(\n this.hostElement.querySelectorAll('ix-group-item:not(.footer)')\n );\n }\n\n get groupContent() {\n return this.hostElement.shadowRoot.querySelector('.group-content');\n }\n\n private onExpandClick(event: Event) {\n this.collapsed = !this.collapsed;\n\n this.collapsedChanged.emit(this.collapsed);\n event.stopPropagation();\n }\n\n private onHeaderClick(event: Event) {\n this.setGroupSelection(!this.selected);\n\n if (this.suppressHeaderSelection) {\n this.onExpandClick(event);\n }\n }\n\n private onItemClick(index: number) {\n if (index === this.index) {\n this.index = undefined;\n this.selectItem.emit(undefined);\n } else {\n this.index = index;\n this.selectItem.emit(index);\n }\n\n if (this.index >= 0) {\n this.itemSelected = true;\n } else this.itemSelected = false;\n\n this.setGroupSelection(false);\n }\n\n private setGroupSelection(selection: boolean) {\n if (!this.suppressHeaderSelection) {\n this.selected = selection;\n this.selectGroup.emit(this.selected);\n }\n }\n\n private onSlotChange() {\n const slot = this.hostElement.shadowRoot.querySelector(\n 'slot[name=\"footer\"]'\n );\n\n if (slot) {\n this.footerVisible = hasSlottedElements(slot);\n }\n }\n\n componentWillRender() {\n this.groupItems.forEach((item, index) => {\n if (this.selected === true) {\n item.selected = false;\n this.index = undefined;\n this.itemSelected = false;\n return;\n }\n item.selected = index === this.index;\n item.index = index;\n });\n }\n\n componentDidLoad() {\n this.observer = createMutationObserver(() => {\n this.slotSize = this.groupItems.length;\n });\n\n this.observer.observe(this.groupContent, {\n childList: true,\n });\n\n this.groupContent.addEventListener(\n 'selectedChanged',\n (evt: CustomEvent<HTMLIxGroupItemElement>) => {\n this.onItemClick(evt.detail.index);\n }\n );\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'group-header': true,\n expand: !this.collapsed,\n selected: this.selected,\n }}\n tabindex=\"0\"\n >\n <div\n class=\"group-header-clickable\"\n onClick={(e) => this.onHeaderClick(e)}\n >\n <div\n class={{\n 'group-header-selection-indicator': true,\n 'group-header-selection-indicator-item-selected':\n this.itemSelected,\n }}\n ></div>\n <div class=\"btn-expand-header\">\n <ix-icon\n class={{\n hidden: this.slotSize === 0,\n }}\n name={\n this.collapsed ? 'chevron-right-small' : 'chevron-down-small'\n }\n onClick={(e) => this.onExpandClick(e)}\n ></ix-icon>\n </div>\n\n <div class=\"group-header-content\">\n {this.header ? (\n <div class=\"group-header-props-container\">\n <div class=\"group-header-title\">\n <span title={this.header}>{this.header}</span>\n </div>\n <div class=\"group-subheader\" title={this.subHeader}>\n {this.subHeader}\n </div>\n </div>\n ) : null}\n <slot name=\"header\"></slot>\n </div>\n </div>\n <ix-group-context-menu>\n <slot name=\"dropdown\"></slot>\n </ix-group-context-menu>\n </div>\n <div\n class={{\n 'group-content': true,\n }}\n >\n {!this.collapsed ? (\n <Fragment>\n <slot></slot>\n <ix-group-item\n suppressSelection={true}\n focusable={false}\n class={{\n footer: true,\n 'footer-visible': this.footerVisible,\n }}\n >\n <slot\n name=\"footer\"\n onSlotchange={() => this.onSlotChange()}\n ></slot>\n </ix-group-item>\n </Fragment>\n ) : null}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{r as e,h as a,H as t}from"./p-26e9d40e.js";const s=":host{display:flex;justify-content:flex-start;align-items:center;gap:0.5rem;overflow:hidden}:host .loading-text{display:block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}";const o=s;const i=class{constructor(a){e(this,a)}render(){return a(t,{key:"9333078e1c22a3307abb022ca8cf761667ce9d95"},a("ix-spinner",{key:"895d205873c13dfa9257627094b67a9bfb40e04a",variant:"primary"}),a("span",{key:"9c84db0939e4f9fbf359425251103ce9ba2cd968",class:"loading-text"},a("slot",{key:"b2fa68d8d6ab862b88cf7deadc4249c2775fd6e6"})))}};i.style=o;export{i as ix_modal_loading};
2
- //# sourceMappingURL=p-9fd3ae7f.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as e,c as t,h as i,H as r}from"./p-26e9d40e.js";const o=":host{}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .event-list-item{display:flex;align-items:center;position:relative;height:var(--event-list-item-height, 2.5rem);max-height:var(--event-list-item-height, 2.5rem);border-radius:var(--event-list-item-border-radius, 0.25rem);background-color:var(--theme-event-item--background);overflow:hidden;transition:var(--theme-default-time);cursor:pointer;margin-bottom:var(--event-list-item-margin-bottom, 0.5rem)}:host .event-list-item .indicator{height:100%;width:0.5rem;max-width:0.5rem;min-width:0.5rem;border-top-left-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:var(--event-list-item-border-radius, 0.25rem)}:host .event-list-item .indicator-empty{border:var(--theme-weak-bdr-1);border-right:none}:host .event-list-item .event-list-item-container{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;flex-grow:1;width:calc(100% - (1rem + 0.5rem));height:100%;border:0.062rem solid;border-color:var(--theme-event-item--border);border-top-left-radius:0;border-top-right-radius:var(--event-list-item-border-radius, 0.25rem);border-bottom-left-radius:0;border-bottom-right-radius:var(--event-list-item-border-radius, 0.25rem);border-left:none;padding-left:1rem}:host .event-list-item .event-content{display:flex;align-items:center;width:100%;height:var(--event-list-item-height, 100%);max-height:var(--event-list-item-height, 100%);white-space:var(--event-list-item-content-white-space, inherit);overflow:hidden;padding-inline-end:0.5rem}:host .event-list-item .chevron-icon{margin-left:auto;margin-right:0.5rem;opacity:0.6;align-self:center}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):hover{background-color:var(--theme-event-item--background--hover)}:host .event-list-item:not(.selected):not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected):not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected):not(.disabled):not(:disabled).active{background-color:var(--theme-event-item--background--active)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):hover{border-color:var(--theme-event-item--border--hover)}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled){cursor:pointer}:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled):active,:host .event-list-item:not(.selected) .event-list-item-container:not(.disabled):not(:disabled).active{border-color:var(--theme-event-item--border--active)}:host .event-list-item.selected .event-list-item-container{background-color:var(--theme-event-item--background--selected);border-color:var(--theme-event-item--border--selected)}:host .event-list-item[disabled],:host .event-list-item.disabled{pointer-events:none}:host .event-list-item[disabled] .event-list-item-container,:host .event-list-item.disabled .event-list-item-container{background-color:var(--theme-event-item--background--disabled);border-color:var(--theme-event-item--border--disabled)}:host(.disabled){pointer-events:none}";const s=o;const n=class{constructor(i){e(this,i);this.itemClick=t(this,"itemClick",7);this.color=undefined;this.itemColor=undefined;this.selected=undefined;this.disabled=undefined;this.chevron=undefined}handleItemClick(){this.itemClick.emit()}render(){var e,t,o,s;let n=((e=this.itemColor)===null||e===void 0?void 0:e.startsWith("--theme"))?`var(${this.itemColor})`:`var(--theme-${this.itemColor})`;if(this.color){n=((t=this.color)===null||t===void 0?void 0:t.startsWith("--theme"))?`var(${this.color})`:`var(--theme-${this.color})`}return i(r,{key:"ea6803280e270d6b6c4dc0023de76812bc7e90ed",class:{disabled:this.disabled}},i("div",{key:"75efa47c7a119ea2d7aa659f5c2709fa34cfb3eb",class:{"event-list-item":true,selected:this.selected,disabled:this.disabled}},i("div",{key:"74d747f6b58ce8b56343983e3f4cc1c97e0623fc",class:`indicator ${!((o=this.itemColor)!==null&&o!==void 0?o:this.color)?"indicator-empty":""}`,style:{"background-color":((s=this.itemColor)!==null&&s!==void 0?s:this.color)?n:"inherit",opacity:`${this.disabled?.4:1}`}}),i("div",{key:"b32602b0c89701f487cf10b1600c2ed039e86498",class:"event-list-item-container"},i("div",{key:"d3298c260d4f74aa91a747a61b93203fab354432",class:"event-content"},i("slot",{key:"45c7a053766b5f7ce3dcae9d74bb22201c0dba9b"})),this.chevron&&i("ix-icon",{name:"chevron-right",size:"16",class:"chevron-icon"}))))}};n.style=s;export{n as ix_event_list_item};
2
- //# sourceMappingURL=p-a93df5f2.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["eventListItemCss","IxEventListItemStyle0","EventListItem","handleItemClick","this","itemClick","emit","render","color","_a","itemColor","startsWith","_b","h","Host","key","class","disabled","selected","_c","style","_d","opacity","chevron","name","size"],"sources":["src/components/event-list-item/event-list-item.scss?tag=ix-event-list-item&encapsulation=shadow","src/components/event-list-item/event-list-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/shadow-dom/host-disabled';\n@import 'common-variables';\n\n$default-event-list-item-height: 2.5rem;\n\n:host {\n @include ix-component;\n\n .event-list-item {\n display: flex;\n align-items: center;\n position: relative;\n height: var(--event-list-item-height, $default-event-list-item-height);\n max-height: var(--event-list-item-height, $default-event-list-item-height);\n border-radius: var(--event-list-item-border-radius, $default-border-radius);\n background-color: var(--theme-event-item--background);\n overflow: hidden;\n transition: var(--theme-default-time);\n cursor: pointer;\n margin-bottom: var(--event-list-item-margin-bottom, $small-space);\n\n .indicator {\n height: 100%;\n width: $small-space;\n max-width: $small-space;\n min-width: $small-space;\n border-top-left-radius: var(\n --event-list-item-border-radius,\n $default-border-radius\n );\n border-bottom-left-radius: var(\n --event-list-item-border-radius,\n $default-border-radius\n );\n }\n\n .indicator-empty {\n border: var(--theme-weak-bdr-1);\n border-right: none;\n }\n\n .event-list-item-container {\n @include ellipsis;\n\n display: flex;\n flex-grow: 1;\n width: calc(100% - (#{$default-space} + #{$small-space}));\n height: 100%;\n border: 0.062rem solid;\n border-color: var(--theme-event-item--border);\n border-top-left-radius: 0;\n border-top-right-radius: var(\n --event-list-item-border-radius,\n $default-border-radius\n );\n border-bottom-left-radius: 0;\n border-bottom-right-radius: var(\n --event-list-item-border-radius,\n $default-border-radius\n );\n border-left: none;\n padding-left: $default-space;\n }\n\n .event-content {\n display: flex;\n align-items: center;\n width: 100%;\n height: var(--event-list-item-height, 100%);\n max-height: var(--event-list-item-height, 100%);\n white-space: var(--event-list-item-content-white-space, inherit);\n overflow: hidden;\n padding-inline-end: $small-space;\n }\n\n .chevron-icon {\n margin-left: auto;\n margin-right: $small-space;\n opacity: 0.6;\n align-self: center;\n }\n\n &:not(.selected) {\n @include hover {\n background-color: var(--theme-event-item--background--hover);\n }\n\n @include active {\n background-color: var(--theme-event-item--background--active);\n }\n\n .event-list-item-container {\n @include hover {\n border-color: var(--theme-event-item--border--hover);\n }\n\n @include active {\n border-color: var(--theme-event-item--border--active);\n }\n }\n }\n\n &.selected .event-list-item-container {\n background-color: var(--theme-event-item--background--selected);\n border-color: var(--theme-event-item--border--selected);\n }\n\n &[disabled],\n &.disabled {\n pointer-events: none;\n\n .event-list-item-container {\n background-color: var(--theme-event-item--background--disabled);\n border-color: var(--theme-event-item--border--disabled);\n }\n }\n }\n}\n\n@include host-disabled;\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-event-list-item',\n styleUrl: 'event-list-item.scss',\n shadow: true,\n})\nexport class EventListItem {\n /**\n * Color of the status indicator.\n * You can find a list of all available colors in our documentation.\n * Example values are `--theme-color-alarm` or `color-alarm`\n *\n * @link https://ix.siemens.io/docs/theming/colors/\n *\n * @deprecated since 2.1.0 use `item-color`\n */\n // eslint-disable-next-line @stencil-community/reserved-member-names\n @Prop() color: string;\n\n /**\n * Color of the status indicator.\n * You can find a list of all available colors in our documentation.\n * Example values are `--theme-color-alarm` or `color-alarm`\n *\n * @link https://ix.siemens.io/docs/theming/colors/\n */\n @Prop() itemColor: string;\n\n /**\n * Show event list item as selected\n */\n @Prop() selected: boolean;\n\n /**\n * Disable event list item\n */\n @Prop() disabled: boolean;\n\n /**\n * Show chevron on right side of the event list item\n */\n @Prop() chevron: boolean;\n\n /**\n * Event list item click\n */\n @Event() itemClick: EventEmitter;\n\n @Listen('click', { passive: true })\n handleItemClick() {\n this.itemClick.emit();\n }\n\n render() {\n let color = this.itemColor?.startsWith('--theme')\n ? `var(${this.itemColor})`\n : `var(--theme-${this.itemColor})`;\n\n if (this.color) {\n color = this.color?.startsWith('--theme')\n ? `var(${this.color})`\n : `var(--theme-${this.color})`;\n }\n\n return (\n <Host\n class={{\n disabled: this.disabled,\n }}\n >\n <div\n class={{\n 'event-list-item': true,\n selected: this.selected,\n disabled: this.disabled,\n }}\n >\n <div\n class={`indicator ${\n !(this.itemColor ?? this.color) ? 'indicator-empty' : ''\n }`}\n style={{\n 'background-color':\n this.itemColor ?? this.color ? color : 'inherit',\n opacity: `${this.disabled ? 0.4 : 1}`,\n }}\n ></div>\n\n <div class=\"event-list-item-container\">\n <div class=\"event-content\">\n <slot></slot>\n </div>\n {this.chevron && (\n <ix-icon\n name={'chevron-right'}\n size=\"16\"\n class=\"chevron-icon\"\n ></ix-icon>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAmB,wyHACzB,MAAAC,EAAeD,E,MCuBFE,EAAa,M,mLA2CxB,eAAAC,GACEC,KAAKC,UAAUC,M,CAGjB,MAAAC,G,YACE,IAAIC,IAAQC,EAAAL,KAAKM,aAAS,MAAAD,SAAA,SAAAA,EAAEE,WAAW,YACnC,OAAOP,KAAKM,aACZ,eAAeN,KAAKM,aAExB,GAAIN,KAAKI,MAAO,CACdA,IAAQI,EAAAR,KAAKI,SAAK,MAAAI,SAAA,SAAAA,EAAED,WAAW,YAC3B,OAAOP,KAAKI,SACZ,eAAeJ,KAAKI,Q,CAG1B,OACEK,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,SAAUb,KAAKa,WAGjBJ,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,kBAAmB,KACnBE,SAAUd,KAAKc,SACfD,SAAUb,KAAKa,WAGjBJ,EAAA,OAAAE,IAAA,2CACEC,MAAO,gBACHG,EAAAf,KAAKM,aAAS,MAAAS,SAAA,EAAAA,EAAIf,KAAKI,OAAS,kBAAoB,KAExDY,MAAO,CACL,qBACEC,EAAAjB,KAAKM,aAAS,MAAAW,SAAA,EAAAA,EAAIjB,KAAKI,OAAQA,EAAQ,UACzCc,QAAS,GAAGlB,KAAKa,SAAW,GAAM,OAItCJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,6BACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,iBACTH,EAAA,QAAAE,IAAA,8CAEDX,KAAKmB,SACJV,EAAA,WACEW,KAAM,gBACNC,KAAK,KACLT,MAAM,mB"}
@@ -1,2 +0,0 @@
1
- import{r as t,c as i,h as s,H as e,g as r}from"./p-26e9d40e.js";import{f as n,i as o,s as h,o as a,a as d,c}from"./p-b3f35666.js";function l(t){return t&&t.getDropdownItemElement!==undefined&&typeof t.getDropdownItemElement==="function"}class u{constructor(){this.dropdowns=new Map;this.submenuIds={};this.isWindowListenerActive=false}connected(t){if(!this.isWindowListenerActive){this.addOverlayListeners()}this.dropdowns.set(t.getId(),t);if(t.discoverAllSubmenus){this.discoverSubmenus()}}disconnected(t){this.dropdowns.delete(t.getId())}discoverSubmenus(){this.dropdowns.forEach((t=>{t.discoverSubmenu()}))}present(t){if(!t.isPresent()&&t.willPresent()){this.submenuIds[t.getId()]=t.getAssignedSubmenuIds();t.present()}}dismissChildren(t){const i=this.submenuIds[t]||[];for(const t of i){this.dismiss(this.dropdowns.get(t))}}dismiss(t){if(t.isPresent()&&t.willDismiss()){this.dismissChildren(t.getId());t.dismiss();delete this.submenuIds[t.getId()]}}dismissAll(t=[]){this.dropdowns.forEach((i=>{if(!t.includes(i.getId())&&(i.closeBehavior==="inside"||i.closeBehavior===false)){return}this.dismiss(i)}))}dismissOthers(t){let i=this.buildComposedPath(t,new Set);this.dropdowns.forEach((t=>{if(t.closeBehavior!=="inside"&&t.closeBehavior!==false&&!i.has(t.getId())){this.dismiss(t)}}))}pathIncludesTrigger(t){for(let i of t){if(i instanceof HTMLElement){if(i.hasAttribute("data-ix-dropdown-trigger")){return true}}}return false}pathIncludesDropdown(t){return!!t.find((t=>t.tagName==="IX-DROPDOWN"))}buildComposedPath(t,i){if(this.submenuIds[t]){i.add(t)}for(const s of Object.keys(this.submenuIds)){if(this.submenuIds[s].includes(t)){this.buildComposedPath(s,i).forEach((t=>i.add(t)))}}return i}addOverlayListeners(){this.isWindowListenerActive=true;window.addEventListener("click",(t=>{const i=this.pathIncludesTrigger(t.composedPath());const s=this.pathIncludesDropdown(t.composedPath());if(!i&&!s){this.dismissAll()}}));window.addEventListener("keydown",(t=>{if(t.key==="Escape"){this.dismissAll([...this.dropdowns.keys()])}}))}}const f=(t,i,s)=>{t.addEventListener(i,s);return()=>{t.removeEventListener(i,s)}};const b=new u;const m=":host{background-color:var(--theme-color-2);border-radius:var(--theme-default-border-radius);min-width:0px;z-index:var(--theme-z-index-dropdown);box-shadow:var(--theme-shadow-4);padding:0.25rem 0px}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .dropdown-header{display:flex;align-items:center;height:2.5rem;color:var(--theme-menu-header--color);padding:0 1rem}:host(.overflow){max-height:50vh;overflow-y:auto}:host(:not(.show)){display:none}";const w=m;let p=0;const g=class{constructor(s){t(this,s);this.showChanged=i(this,"showChanged",7);this.autoUpdateCleanup=null;this.localUId=`dropdown-${p++}`;this.assignedSubmenu=[];this.suppressAutomaticPlacement=false;this.show=false;this.trigger=undefined;this.anchor=undefined;this.closeBehavior="both";this.placement="bottom-start";this.positioningStrategy="fixed";this.header=undefined;this.offset=undefined;this.overwriteDropdownStyle=undefined;this.discoverAllSubmenus=false}connectedCallback(){b.connected(this);if(this.trigger!=undefined){this.registerListener(this.trigger)}}cacheSubmenuId(t){t.stopImmediatePropagation();t.preventDefault();const{detail:i}=t;if(this.assignedSubmenu.indexOf(i)===-1){this.assignedSubmenu.push(i)}}disconnectedCallback(){b.dismiss(this);b.disconnected(this);if(this.disposeListener){this.disposeListener()}if(this.autoUpdateCleanup){this.autoUpdateCleanup()}}getAssignedSubmenuIds(){return this.assignedSubmenu}isPresent(){return this.show}present(){this.show=true}dismiss(){this.show=false}getId(){return this.localUId}willDismiss(){const{defaultPrevented:t}=this.showChanged.emit(false);return!t}willPresent(){const{defaultPrevented:t}=this.showChanged.emit(true);return!t}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-dropdown-item"))}get slotElement(){return this.hostElement.shadowRoot.querySelector("slot")}addEventListenersFor(){var t,i;(t=this.disposeListener)===null||t===void 0?void 0:t.call(this);const s=()=>{if(!this.isPresent()){b.present(this)}else{b.dismiss(this)}b.dismissOthers(this.getId())};this.disposeListener=f(this.triggerElement,"click",(t=>{if(!t.defaultPrevented){s()}}));(i=this.triggerElement)===null||i===void 0?void 0:i.setAttribute("data-ix-dropdown-trigger",this.localUId)}async discoverSubmenu(){var t;(t=this.triggerElement)===null||t===void 0?void 0:t.dispatchEvent(new CustomEvent("ix-assign-sub-menu",{bubbles:true,composed:false,cancelable:true,detail:this.localUId}))}async registerListener(t){this.triggerElement=await this.resolveElement(t);if(this.triggerElement){this.addEventListenersFor();this.discoverSubmenu()}}async resolveElement(t){const i=await this.findElement(t);return this.checkForSubmenuAnchor(i)}async checkForSubmenuAnchor(t){if(!t){return null}if(l(t)){const i=await t.getDropdownItemElement();i.isSubMenu=true;this.hostElement.style.zIndex=`var(--theme-z-index-dropdown)`}if(t.tagName==="IX-DROPDOWN-ITEM"){t.isSubMenu=true;this.hostElement.style.zIndex=`var(--theme-z-index-dropdown)`}return t}findElement(t){if(t instanceof Promise){return t}if(typeof t==="object"){return Promise.resolve(t)}if(typeof t!="string"){return}const i=`#${t}`;return new Promise((t=>{if(document.querySelector(i)){return t(document.querySelector(i))}const s=new MutationObserver((()=>{if(document.querySelector(i)){t(document.querySelector(i));s.disconnect()}}));s.observe(document.body,{childList:true,subtree:true})}))}async changedShow(t){if(t){this.anchorElement=await(this.anchor?this.resolveElement(this.anchor):this.resolveElement(this.trigger));if(this.anchorElement){this.applyDropdownPosition()}}}changedTrigger(t){this.registerListener(t)}isAnchorSubmenu(){var t;if(!l(this.anchorElement)){return!!((t=this.anchorElement)===null||t===void 0?void 0:t.closest("ix-dropdown-item"))}return true}async applyDropdownPosition(){if(!this.show){return}if(!this.anchorElement){return}if(!this.dropdownRef){return}const t=this.isAnchorSubmenu();let i={strategy:this.positioningStrategy,middleware:[]};if(!this.suppressAutomaticPlacement){i.middleware.push(n({fallbackStrategy:"initialPlacement"}))}i.placement=t?"right-start":this.placement;i.middleware=[...i.middleware,o(),h()];if(this.offset){i.middleware.push(a(this.offset))}if(this.autoUpdateCleanup){this.autoUpdateCleanup();this.autoUpdateCleanup=null}this.autoUpdateCleanup=d(this.anchorElement,this.dropdownRef,(async()=>{const t=await c(this.anchorElement,this.dropdownRef,i);Object.assign(this.dropdownRef.style,{top:"0",left:"0",transform:`translate(${Math.round(t.x)}px,${Math.round(t.y)}px)`});if(this.overwriteDropdownStyle){const t=await this.overwriteDropdownStyle({dropdownRef:this.dropdownRef,triggerRef:this.triggerElement});Object.assign(this.dropdownRef.style,t)}}),{ancestorResize:true,ancestorScroll:true,elementResize:true})}async componentDidLoad(){this.changedTrigger(this.trigger)}async componentDidRender(){await this.applyDropdownPosition();this.anchorElement=await(this.anchor?this.resolveElement(this.anchor):this.resolveElement(this.trigger))}isTriggerElement(t){const i=!!t.hasAttribute("data-ix-dropdown-trigger");return i}onDropdownClick(t){if(b.pathIncludesTrigger(t.composedPath())){t.preventDefault();if(this.isTriggerElement(t.target)){return}}if(this.closeBehavior==="inside"||this.closeBehavior==="both"){b.dismissAll([this.getId()])}b.dismissOthers(this.getId())}async updatePosition(){this.applyDropdownPosition()}render(){return s(e,{key:"dd1442ad0a56be081ff7ad7c3fb365aa9c8f1d54","data-ix-dropdown":this.localUId,ref:t=>this.dropdownRef=t,class:{"dropdown-menu":true,show:this.show,overflow:true},style:{margin:"0",minWidth:"0px",position:this.positioningStrategy},role:"list",onClick:t=>this.onDropdownClick(t)},s("div",{key:"2d1edb55fd1066a9634955cefc3aa86ade333781",style:{display:"contents"}},this.header&&s("div",{class:"dropdown-header"},this.header),s("slot",{key:"259991ab41fb0f70f363ac195d202c5673262b2f"})))}get hostElement(){return r(this)}static get watchers(){return{show:["changedShow"],trigger:["changedTrigger"]}}};g.style=w;export{g as ix_dropdown};
2
- //# sourceMappingURL=p-ab446f83.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["hasDropdownItemWrapperImplemented","item","getDropdownItemElement","undefined","DropdownController","constructor","this","dropdowns","Map","submenuIds","isWindowListenerActive","connected","dropdown","addOverlayListeners","set","getId","discoverAllSubmenus","discoverSubmenus","disconnected","delete","forEach","discoverSubmenu","present","isPresent","willPresent","getAssignedSubmenuIds","dismissChildren","uid","childIds","id","dismiss","get","willDismiss","dismissAll","ignoreBehaviorForIds","includes","closeBehavior","dismissOthers","path","buildComposedPath","Set","has","pathIncludesTrigger","eventTargets","eventTarget","HTMLElement","hasAttribute","pathIncludesDropdown","find","element","tagName","add","ruleKey","Object","keys","key","window","addEventListener","event","hasTrigger","composedPath","hasDropdown","addDisposableEventListener","eventType","callback","removeEventListener","dropdownController","dropdownCss","IxDropdownStyle0","sequenceId","Dropdown","autoUpdateCleanup","localUId","assignedSubmenu","connectedCallback","trigger","registerListener","cacheSubmenuId","stopImmediatePropagation","preventDefault","detail","indexOf","push","disconnectedCallback","disposeListener","show","defaultPrevented","showChanged","emit","dropdownItems","Array","from","hostElement","querySelectorAll","slotElement","shadowRoot","querySelector","addEventListenersFor","_a","call","toggleController","triggerElement","_b","setAttribute","dispatchEvent","CustomEvent","bubbles","composed","cancelable","resolveElement","el","findElement","checkForSubmenuAnchor","dropdownItem","isSubMenu","style","zIndex","Promise","resolve","selector","document","observer","MutationObserver","disconnect","observe","body","childList","subtree","changedShow","newShow","anchorElement","anchor","applyDropdownPosition","changedTrigger","newTriggerValue","isAnchorSubmenu","closest","dropdownRef","isSubmenu","positionConfig","strategy","positioningStrategy","middleware","suppressAutomaticPlacement","flip","fallbackStrategy","placement","inline","shift","offset","autoUpdate","async","computeResponse","computePosition","assign","top","left","transform","Math","round","x","y","overwriteDropdownStyle","overwriteStyle","triggerRef","ancestorResize","ancestorScroll","elementResize","componentDidLoad","componentDidRender","isTriggerElement","onDropdownClick","target","updatePosition","render","h","Host","ref","class","overflow","margin","minWidth","position","role","onClick","display","header"],"sources":["src/components/dropdown/dropdown-controller.ts","src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { IxComponent } from '../utils/internal';\nexport type CloseBehavior = 'inside' | 'outside' | 'both' | boolean;\n\nexport interface DropdownInterface extends IxComponent {\n closeBehavior: CloseBehavior;\n discoverAllSubmenus: boolean;\n\n getAssignedSubmenuIds(): string[];\n getId(): string;\n\n discoverSubmenu(): void;\n\n isPresent(): boolean;\n\n willPresent?(): boolean;\n willDismiss?(): boolean;\n\n present(): void;\n dismiss(): void;\n}\n\nexport function hasDropdownItemWrapperImplemented(\n item: unknown\n): item is DropdownItemWrapper {\n return (\n item &&\n (item as DropdownItemWrapper).getDropdownItemElement !== undefined &&\n typeof (item as DropdownItemWrapper).getDropdownItemElement === 'function'\n );\n}\n\nexport interface DropdownItemWrapper {\n getDropdownItemElement(): Promise<HTMLIxDropdownItemElement>;\n}\n\ntype SubmenuIds = Record<string, string[]>;\n\nclass DropdownController {\n private dropdowns: Map<string, DropdownInterface> = new Map<\n string,\n DropdownInterface\n >();\n private submenuIds: SubmenuIds = {};\n\n private isWindowListenerActive = false;\n\n connected(dropdown: DropdownInterface) {\n if (!this.isWindowListenerActive) {\n this.addOverlayListeners();\n }\n this.dropdowns.set(dropdown.getId(), dropdown);\n\n if (dropdown.discoverAllSubmenus) {\n this.discoverSubmenus();\n }\n }\n\n disconnected(dropdown: DropdownInterface) {\n this.dropdowns.delete(dropdown.getId());\n }\n\n discoverSubmenus() {\n this.dropdowns.forEach((dropdown) => {\n dropdown.discoverSubmenu();\n });\n }\n\n present(dropdown: DropdownInterface) {\n if (!dropdown.isPresent() && dropdown.willPresent()) {\n this.submenuIds[dropdown.getId()] = dropdown.getAssignedSubmenuIds();\n dropdown.present();\n }\n }\n\n dismissChildren(uid: string) {\n const childIds = this.submenuIds[uid] || [];\n for (const id of childIds) {\n this.dismiss(this.dropdowns.get(id));\n }\n }\n\n dismiss(dropdown: DropdownInterface) {\n if (dropdown.isPresent() && dropdown.willDismiss()) {\n this.dismissChildren(dropdown.getId());\n dropdown.dismiss();\n delete this.submenuIds[dropdown.getId()];\n }\n }\n\n dismissAll(ignoreBehaviorForIds: string[] = []) {\n this.dropdowns.forEach((dropdown) => {\n if (\n !ignoreBehaviorForIds.includes(dropdown.getId()) &&\n (dropdown.closeBehavior === 'inside' ||\n dropdown.closeBehavior === false)\n ) {\n return;\n }\n\n this.dismiss(dropdown);\n });\n }\n\n dismissOthers(uid: string) {\n let path = this.buildComposedPath(uid, new Set<string>());\n\n this.dropdowns.forEach((dropdown) => {\n if (\n dropdown.closeBehavior !== 'inside' &&\n dropdown.closeBehavior !== false &&\n !path.has(dropdown.getId())\n ) {\n this.dismiss(dropdown);\n }\n });\n }\n\n pathIncludesTrigger(eventTargets: EventTarget[]) {\n for (let eventTarget of eventTargets) {\n if (eventTarget instanceof HTMLElement) {\n if (eventTarget.hasAttribute('data-ix-dropdown-trigger')) {\n return true;\n }\n }\n }\n\n return false;\n }\n\n private pathIncludesDropdown(eventTargets: EventTarget[]) {\n return !!eventTargets.find(\n (element: HTMLElement) => element.tagName === 'IX-DROPDOWN'\n );\n }\n\n private buildComposedPath(id: string, path: Set<string>): Set<string> {\n if (this.submenuIds[id]) {\n path.add(id);\n }\n\n for (const ruleKey of Object.keys(this.submenuIds)) {\n if (this.submenuIds[ruleKey].includes(id)) {\n this.buildComposedPath(ruleKey, path).forEach((key) => path.add(key));\n }\n }\n\n return path;\n }\n\n private addOverlayListeners() {\n this.isWindowListenerActive = true;\n\n window.addEventListener('click', (event: PointerEvent) => {\n const hasTrigger = this.pathIncludesTrigger(event.composedPath());\n const hasDropdown = this.pathIncludesDropdown(event.composedPath());\n\n if (!hasTrigger && !hasDropdown) {\n this.dismissAll();\n }\n });\n\n window.addEventListener('keydown', (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.dismissAll([...this.dropdowns.keys()]);\n }\n });\n }\n}\n\nexport const addDisposableEventListener = (\n element: Element | Window | Document,\n eventType: string,\n callback: EventListenerOrEventListenerObject\n) => {\n element.addEventListener(eventType, callback);\n\n return () => {\n element.removeEventListener(eventType, callback);\n };\n};\n\nexport const addDisposableEventListenerAsArray = (\n listener: {\n element: Element | Window | Document;\n eventType: string;\n callback: EventListenerOrEventListenerObject;\n }[]\n) => {\n const disposables = listener.map(({ callback, element, eventType }) =>\n addDisposableEventListener(element, eventType, callback)\n );\n\n return () => disposables.forEach((dispose) => dispose());\n};\n\nexport const dropdownController = new DropdownController();\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n\n@import 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n background-color: var(--theme-color-2);\n border-radius: var(--theme-default-border-radius);\n @include ix-component;\n min-width: 0px;\n z-index: var(--theme-z-index-dropdown);\n box-shadow: var(--theme-shadow-4);\n\n padding: 0.25rem 0px;\n\n .dropdown-header {\n display: flex;\n align-items: center;\n height: $large-control-height;\n color: var(--theme-menu-header--color);\n padding: 0 $default-space;\n }\n}\n\n:host(.overflow) {\n max-height: 50vh;\n overflow-y: auto;\n}\n\n:host(:not(.show)) {\n display: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport {\n addDisposableEventListener,\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /**\n * Suppress the automatic placement of the dropdown.\n *\n * @since 2.0.0\n */\n @Prop() suppressAutomaticPlacement = false;\n\n /**\n * Show dropdown\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n */\n @Prop() trigger: string | HTMLElement | Promise<HTMLElement>;\n\n /**\n * Define an anchor element\n */\n @Prop() anchor: string | HTMLElement;\n\n /**\n * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n */\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /**\n * Position strategy\n */\n @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n /**\n * An optional header shown at the top of the dropdown\n */\n @Prop() header?: string;\n\n /**\n * Move dropdown along main axis of alignment\n *\n * @internal\n */\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /**\n * @internal\n */\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /**\n * @internal\n * If initialisation of this dropdown is expected to be defered submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n */\n @Prop() discoverAllSubmenus = false;\n\n /**\n * Fire event after visibility of dropdown has changed\n */\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n connectedCallback(): void {\n dropdownController.connected(this);\n\n if (this.trigger != undefined) {\n this.registerListener(this.trigger);\n }\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n dropdownController.dismiss(this);\n dropdownController.disconnected(this);\n\n if (this.disposeListener) {\n this.disposeListener();\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot.querySelector('slot');\n }\n\n private disposeListener?: Function;\n\n private addEventListenersFor() {\n this.disposeListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n this.disposeListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: PointerEvent) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /** @internal */\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: false,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private async registerListener(\n element: string | HTMLElement | Promise<HTMLElement>\n ) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(\n element: string | HTMLElement | Promise<HTMLElement>\n ) {\n const el = await this.findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element: Element) {\n if (!element) {\n return null;\n }\n\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private findElement(\n element: string | HTMLElement | Promise<HTMLElement>\n ): Promise<Element> {\n if (element instanceof Promise) {\n return element;\n }\n\n if (typeof element === 'object') {\n return Promise.resolve(element);\n }\n\n if (typeof element != 'string') {\n return;\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: string | HTMLElement | Promise<HTMLElement>) {\n this.registerListener(newTriggerValue);\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async applyDropdownPosition() {\n if (!this.show) {\n return;\n }\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n async componentDidLoad() {\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n if (dropdownController.pathIncludesTrigger(event.composedPath())) {\n event.preventDefault();\n\n if (this.isTriggerElement(event.target as HTMLElement)) {\n return;\n }\n }\n\n if (this.closeBehavior === 'inside' || this.closeBehavior === 'both') {\n dropdownController.dismissAll([this.getId()]);\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /**\n * Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{r as t,c as e,h as i,H as s,g as o}from"./p-26e9d40e.js";import{O as r}from"./p-ced10144.js";const n=":host{display:inline-block;position:relative;min-height:2rem;height:auto;border-radius:var(--theme-input--border-radius)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .d-none{display:none}:host .select{position:relative;display:flex;align-items:center;background-color:var(--theme-input--background);border:var(--theme-input--border-thickness) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);padding:0 0 0 0.5rem;box-shadow:var(--theme-inset-shadow-1) !important}:host .select:not(.disabled):not(:disabled){cursor:pointer}:host .select:not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover)}:host .select:focus-within{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline:1px solid #119fff;outline-offset:var(--theme-input--focus--outline-offset)}:host .select.readonly{box-shadow:none !important;border:none;border-radius:0px;border-bottom:var(--theme-input--border-thickness) solid var(--theme-color-weak-bdr)}:host .select.readonly,:host .select.readonly:hover,:host .select.readonly:active{background-color:transparent !important}:host .select.readonly:focus,:host .select.readonly:focus-within,:host .select.readonly:focus-visible{outline:none}:host .select.readonly input{color:var(--theme-color-weak-text)}:host .select.readonly input:focus,:host .select.readonly input:focus-visible{outline:none}:host .hidden{display:none !important}:host .trigger{display:flex;align-items:center;flex-grow:1;height:100%}:host .input-container{display:flex;position:relative;align-items:flex-start;width:100%;height:100%}:host .input-container .chips{position:relative;display:flex;align-items:center;flex-wrap:wrap;height:100%;max-height:3.5rem;flex-grow:1;overflow-y:auto}:host .input-container .chips>ix-filter-chip{margin:0.1rem}:host .input-container input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);background:transparent;height:1.75rem;width:100%}:host .input-container input,:host .input-container input:hover,:host .input-container input:focus-visible{border:none;outline:none}:host .input-container input::-moz-placeholder{color:var(--theme-input-select-icon--color)}:host .input-container input::placeholder{color:var(--theme-input-select-icon--color)}:host .input-container input.hide-placeholder::-moz-placeholder{opacity:0}:host .input-container input.hide-placeholder::placeholder{opacity:0}:host .dropdown-visible{--ix-icon-button-color:var(--theme-color-dynamic--hover)}:host .add-item{display:flex;justify-content:flex-start;align-items:center;position:relative;width:100%}:host .select-list-header{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;height:2rem;color:var(--theme-select-list-item-hint--color);margin:0 0.5rem 0 1rem}";const h=n;var l=undefined&&undefined.__decorate||function(t,e,i,s){var o=arguments.length,r=o<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,i):s,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")r=Reflect.decorate(t,e,i,s);else for(var h=t.length-1;h>=0;h--)if(n=t[h])r=(o<3?n(r):o>3?n(e,i,r):n(e,i))||r;return o>3&&r&&Object.defineProperty(e,i,r),r};const a=class{constructor(i){t(this,i);this.valueChange=e(this,"valueChange",7);this.itemSelectionChange=e(this,"itemSelectionChange",7);this.inputChange=e(this,"inputChange",7);this.addItem=e(this,"addItem",7);this.selectedIndices=undefined;this.value=undefined;this.allowClear=false;this.mode="single";this.editable=false;this.disabled=false;this.readonly=false;this.i18nPlaceholder="Select an option";this.i18nPlaceholderEditable="Type of select option";this.i18nSelectListHeader="Please select an option";this.i18nNoMatches="No matches";this.hideListHeader=false;this.dropdownShow=false;this.selectedLabels=undefined;this.dropdownWrapperRef=undefined;this.dropdownAnchor=undefined;this.isDropdownEmpty=false;this.hasFocus=false;this.navigationItem=undefined;this.inputFilterText=undefined;this.inputValue=undefined}get items(){return[...Array.from(this.hostElement.querySelectorAll("ix-select-item")),...Array.from(this.hostElement.shadowRoot.querySelectorAll("ix-select-item"))]}get selectedItems(){return this.items.filter((t=>t.selected))}get addItemButton(){return this.hostElement.shadowRoot.querySelector(".add-item")}get isSingleMode(){return this.mode==="single"}get isMultipleMode(){return this.mode==="multiple"}get isEveryDropdownItemHidden(){return this.items.every((t=>t.classList.contains("d-none")))}watchSelectedIndices(t){this.value=t;this.updateSelection()}watchValue(t){this.selectedIndices=t;this.updateSelection()}onItemClicked(t){const e=t.detail;this.itemClick(e)}itemClick(t){this.value=this.toggleValue(t);this.updateSelection();this.emitValueChange()}emitAddItem(t){if(t.trim()===""){return}const e=document.createElement("ix-select-item");e.value=t;e.label=t;this.addItemRef.appendChild(e);this.clearInput();this.itemClick(t);this.addItem.emit(t)}toggleValue(t){if(!this.isMultipleMode){return t}if(!this.value){return[t]}let e=this.value;if(!Array.isArray(e)){e=[e]}if(e.includes(t)){return e.filter((e=>e!==t))}else{return[...e,t]}}updateSelection(){var t;let e=[];if(this.value){e=Array.isArray(this.value)?[...this.value]:[this.value]}this.items.forEach((t=>{t.selected=e.some((e=>e===(t.value!==undefined&&t.value!==null?t.value.toString():"")))}));this.selectedLabels=this.selectedItems.map((t=>t.label));if(this.isSingleMode){this.inputValue=((t=this.selectedLabels)===null||t===void 0?void 0:t.length)?this.selectedLabels[0]:null;return}this.inputValue=null}emitValueChange(){this.valueChange.emit(this.value);if(!this.value){this.itemSelectionChange.emit(null)}else{this.itemSelectionChange.emit(Array.isArray(this.value)?this.value:[this.value])}}componentDidLoad(){this.inputRef.addEventListener("input",(()=>{this.dropdownShow=true;this.inputChange.emit(this.inputRef.value)}))}componentWillLoad(){if(this.selectedIndices&&!this.value){this.value=this.selectedIndices}this.updateSelection()}onLabelChange(t){t.preventDefault();t.stopImmediatePropagation();this.updateSelection()}disconnectedCallback(){if(this.labelMutationObserver){this.labelMutationObserver.disconnect()}}itemExists(t){return this.items.find((e=>e.label===t))}dropdownVisibilityChanged(t){this.dropdownShow=t.detail;this.hasFocus=t.detail;if(t.detail){this.inputRef.focus();this.inputRef.select();this.removeHiddenFromItems();this.isDropdownEmpty=this.isEveryDropdownItemHidden}else{this.navigationItem=undefined}}async onKeyDown(t){if(t.code==="ArrowDown"||t.code==="ArrowUp"){this.onArrowNavigation(t,t.code)}if(!this.dropdownShow){return}if(t.code==="Enter"||t.code==="NumpadEnter"){await this.onEnterNavigation()}if(t.code==="Escape"){this.dropdownShow=false}}async onEnterNavigation(){var t,e;if(this.isMultipleMode){return}if(this.editable&&!this.itemExists(this.inputFilterText)){this.emitAddItem(this.inputFilterText);this.navigationItem=this.items[this.items.length-1]}(t=this.navigationItem)===null||t===void 0?void 0:t.onItemClick();await((e=this.dropdownRef)===null||e===void 0?void 0:e.updatePosition());if(this.isSingleMode&&!this.editable){this.dropdownShow=false}}onArrowNavigation(t,e){t.preventDefault();t.stopPropagation();this.dropdownShow=true;const i=this.items.filter((t=>!t.classList.contains("d-none")));if(this.navigationItem===undefined){this.applyFocusTo(i[0]);return}let s=i.findIndex((t=>t===this.navigationItem));if(e==="ArrowDown"){s++}else{s--}const o=i[s];this.applyFocusTo(o)}applyFocusTo(t){if(!t){return}this.navigationItem=t;setTimeout((()=>{t.shadowRoot.querySelector("ix-dropdown-item").shadowRoot.querySelector("button").focus()}))}filterItemsWithTypeahead(){this.inputFilterText=this.inputRef.value;if(this.isSingleMode&&this.inputFilterText===this.selectedLabels[0]){return}if(this.inputFilterText){this.items.forEach((t=>{t.classList.remove("d-none");if(!t.label.toLowerCase().includes(this.inputFilterText.toLowerCase())){t.classList.add("d-none")}}))}else{this.removeHiddenFromItems()}this.isDropdownEmpty=this.isEveryDropdownItemHidden}removeHiddenFromItems(){this.items.forEach((t=>{t.classList.remove("d-none")}))}clearInput(){this.inputRef.value="";this.inputFilterText=""}clear(){this.clearInput();this.selectedLabels=[];this.value=[];this.valueChange.emit(null);this.dropdownShow=false}onInputBlur(t){if(this.editable){return}if(this.isSingleMode){return}if(!this.dropdownShow&&this.mode!=="multiple"){t.target["value"]=this.selectedLabels}}placeholderValue(){if(this.editable){return this.i18nPlaceholderEditable}if(this.readonly){return""}return this.i18nPlaceholder}isAddItemVisible(){return!this.itemExists(this.inputFilterText)&&this.editable&&this.inputFilterText}render(){var t,e,o;return i(s,{key:"c3436b72b89db710173be26ccc34d44eaef48096"},i("div",{key:"19b6245bdbd79faa3d4bbf25a4d106e2084875d9",class:{select:true,disabled:this.disabled,readonly:this.readonly},ref:t=>{this.dropdownAnchor=t;if(!this.editable)this.dropdownWrapperRef=t}},i("div",{key:"283b9918b77987f4a5c943eeba63679cb4cd979c",class:"input-container"},i("div",{key:"eb809d645c40ae085805d0ec3fcbbb48534cfb2c",class:"chips"},this.isMultipleMode?(t=this.selectedItems)===null||t===void 0?void 0:t.map((t=>i("ix-filter-chip",{disabled:this.disabled||this.readonly,key:t.value,onCloseClick:e=>{e.preventDefault();e.stopPropagation();this.itemClick(t.value)}},t.label))):"",i("div",{key:"e2faa64250d72d63afaf05139a0f6ed144097f69",class:"trigger"},i("input",{key:"3aa2890f133b801bb14f8cc9d568cbee3eb83d13",autocomplete:"off","data-testid":"input",disabled:this.disabled,readOnly:this.readonly,type:"text",class:{"allow-clear":this.allowClear&&!!((e=this.selectedLabels)===null||e===void 0?void 0:e.length)},placeholder:this.placeholderValue(),value:this.inputValue,ref:t=>this.inputRef=t,onBlur:t=>this.onInputBlur(t),onFocus:()=>{this.navigationItem=undefined},onInput:()=>this.filterItemsWithTypeahead(),onKeyDown:t=>this.onKeyDown(t)}),this.allowClear&&(((o=this.selectedLabels)===null||o===void 0?void 0:o.length)||this.inputFilterText)?i("ix-icon-button",{class:"clear",icon:"clear",ghost:true,oval:true,size:"16",onClick:t=>{t.preventDefault();t.stopPropagation();this.clear()}}):null,this.disabled||this.readonly?null:i("ix-icon-button",{"data-select-dropdown":true,class:{"dropdown-visible":this.dropdownShow},icon:"chevron-down-small",ghost:true,ref:t=>{if(this.editable)this.dropdownWrapperRef=t}}))))),i("ix-dropdown",{key:"571d47a09fb16445a94a304e9fae4a1a592d078b",ref:t=>this.dropdownRef=t,show:this.dropdownShow,closeBehavior:this.isMultipleMode?"outside":"both",class:{"d-none":this.disabled||this.readonly},anchor:this.dropdownAnchor,trigger:this.dropdownWrapperRef,onShowChanged:t=>this.dropdownVisibilityChanged(t),placement:"bottom-start",overwriteDropdownStyle:async()=>({minWidth:`${this.hostElement.clientWidth}px`})},i("div",{key:"2751511a275b502709f59e600eb494cf33085d80",class:{"select-list-header":true,hidden:this.hideListHeader||this.isDropdownEmpty},title:this.i18nSelectListHeader},this.i18nSelectListHeader),i("slot",{key:"8f894985df712df0f0b0d4527ee7b136d2c84a60"}),i("div",{key:"4edce84e19a13a67defc8de67ca1e23fb7319be7",ref:t=>this.addItemRef=t,class:"d-contents"}),this.isAddItemVisible()?i("ix-dropdown-item",{"data-testid":"add-item",icon:"plus",class:{"add-item":true},label:this.inputFilterText,onItemClick:t=>{t.preventDefault();t.stopPropagation();this.emitAddItem(this.inputFilterText)}}):null,this.isDropdownEmpty&&!this.editable?i("div",{class:"select-list-header"},this.i18nNoMatches):""))}get hostElement(){return o(this)}static get watchers(){return{selectedIndices:["watchSelectedIndices"],value:["watchValue"]}}};l([r("keydown",(t=>t.dropdownShow))],a.prototype,"onKeyDown",null);a.style=h;export{a as ix_select};
2
- //# sourceMappingURL=p-b78fd38b.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["selectCss","IxSelectStyle0","Select","items","Array","from","this","hostElement","querySelectorAll","shadowRoot","selectedItems","filter","item","selected","addItemButton","querySelector","isSingleMode","mode","isMultipleMode","isEveryDropdownItemHidden","every","classList","contains","watchSelectedIndices","value","updateSelection","watchValue","selectedIndices","onItemClicked","event","newId","detail","itemClick","toggleValue","emitValueChange","emitAddItem","trim","newItem","document","createElement","label","addItemRef","appendChild","clearInput","addItem","emit","itemValue","isArray","includes","ids","forEach","some","i","undefined","toString","selectedLabels","map","inputValue","_a","length","valueChange","itemSelectionChange","componentDidLoad","inputRef","addEventListener","dropdownShow","inputChange","componentWillLoad","onLabelChange","preventDefault","stopImmediatePropagation","disconnectedCallback","labelMutationObserver","disconnect","itemExists","find","dropdownVisibilityChanged","hasFocus","focus","select","removeHiddenFromItems","isDropdownEmpty","navigationItem","onKeyDown","code","onArrowNavigation","onEnterNavigation","editable","inputFilterText","onItemClick","_b","dropdownRef","updatePosition","key","stopPropagation","applyFocusTo","indexOfNavigationItem","findIndex","newFocusItem","element","setTimeout","filterItemsWithTypeahead","remove","toLowerCase","add","clear","onInputBlur","e","target","placeholderValue","i18nPlaceholderEditable","readonly","i18nPlaceholder","isAddItemVisible","render","h","Host","class","disabled","ref","dropdownAnchor","dropdownWrapperRef","onCloseClick","autocomplete","readOnly","type","allowClear","placeholder","onBlur","onFocus","onInput","_c","icon","ghost","oval","size","onClick","show","closeBehavior","anchor","trigger","onShowChanged","placement","overwriteDropdownStyle","async","minWidth","clientWidth","hidden","hideListHeader","title","i18nSelectListHeader","i18nNoMatches","__decorate","OnListener","self"],"sources":["src/components/select/select.scss?tag=ix-select&encapsulation=shadow","src/components/select/select.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n display: inline-block;\n position: relative;\n min-height: 2rem;\n height: auto;\n border-radius: var(--theme-input--border-radius);\n\n .d-none {\n display: none;\n }\n\n .select {\n position: relative;\n display: flex;\n align-items: center;\n background-color: var(--theme-input--background);\n border: var(--theme-input--border-thickness) solid\n var(--theme-input--border-color);\n border-radius: var(--theme-input--border-radius);\n padding: 0 0 0 $small-space;\n box-shadow: var(--theme-inset-shadow-1) !important;\n\n @include hover {\n background-color: var(--theme-input--background--hover);\n border-color: var(--theme-input--border-color--hover);\n }\n\n &:focus-within {\n background-color: var(--theme-input--background--focus);\n border-color: var(--theme-input--border-color--focus);\n outline: 1px solid #119fff;\n outline-offset: var(--theme-input--focus--outline-offset);\n }\n }\n\n .select.readonly {\n box-shadow: none !important;\n border: none;\n border-radius: 0px;\n border-bottom: var(--theme-input--border-thickness) solid\n var(--theme-color-weak-bdr);\n\n &,\n &:hover,\n &:active {\n background-color: transparent !important;\n }\n\n &:focus,\n &:focus-within,\n &:focus-visible {\n outline: none;\n }\n\n input {\n color: var(--theme-color-weak-text);\n }\n\n input:focus,\n input:focus-visible {\n outline: none;\n }\n }\n\n .hidden {\n display: none !important;\n }\n\n .trigger {\n display: flex;\n align-items: center;\n flex-grow: 1;\n height: 100%;\n }\n\n .input-container {\n display: flex;\n position: relative;\n align-items: flex-start;\n width: 100%;\n height: 100%;\n\n .chips {\n position: relative;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n height: 100%;\n max-height: 3.5rem;\n flex-grow: 1;\n overflow-y: auto;\n\n > ix-filter-chip {\n margin: 0.1rem;\n }\n }\n\n input {\n @include ellipsis;\n @include text-default;\n background: transparent;\n height: 1.75rem;\n width: 100%;\n\n &,\n &:hover,\n &:focus-visible {\n border: none;\n outline: none;\n }\n\n &::placeholder {\n color: var(--theme-input-select-icon--color);\n }\n\n &.hide-placeholder::placeholder {\n opacity: 0;\n }\n }\n }\n\n .dropdown-visible {\n --ix-icon-button-color: var(--theme-color-dynamic--hover);\n }\n\n .add-item {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n position: relative;\n width: 100%;\n }\n\n .select-list-header {\n @include ellipsis;\n display: flex;\n align-items: center;\n height: $default-control-height;\n color: var(--theme-select-list-item-hint--color);\n margin: 0 $small-space 0 1rem;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from '../select-item/events';\nimport { OnListener } from '../utils/listener';\n\n@Component({\n tag: 'ix-select',\n styleUrl: 'select.scss',\n shadow: true,\n})\nexport class Select {\n @Element() hostElement!: HTMLIxSelectElement;\n\n /**\n * Indices of selected items.\n * This corresponds to the value property of ix-select-items and therefor not necessarily the indices of the items in the list.\n * @deprecated since 2.0.0. Use the `value` property instead.\n */\n @Prop({ mutable: true }) selectedIndices?: string | string[];\n\n /**\n * Current selected value.\n * This corresponds to the value property of ix-select-items\n * @since 2.0.0\n */\n @Prop({ mutable: true }) value?: string | string[];\n\n /**\n * Show clear button\n */\n @Prop() allowClear = false;\n\n /**\n * Selection mode\n */\n @Prop() mode: 'single' | 'multiple' = 'single';\n\n /**\n * Select is extendable\n */\n @Prop() editable = false;\n\n /**\n * If true the select will be in disabled state\n */\n @Prop() disabled = false;\n\n /**\n * If true the select will be in readonly mode\n */\n @Prop() readonly = false;\n\n /**\n * Input field placeholder\n */\n @Prop() i18nPlaceholder = 'Select an option';\n\n /**\n * Input field placeholder for editable select\n */\n @Prop() i18nPlaceholderEditable = 'Type of select option';\n\n /**\n * Select list header\n */\n @Prop() i18nSelectListHeader = 'Please select an option';\n\n /**\n * Hint inside of dropdown if no items where found with current filter text\n *\n * @since 1.5.0\n */\n @Prop() i18nNoMatches = 'No matches';\n\n /**\n * Hide list header\n *\n * @since 1.5.0\n */\n @Prop() hideListHeader = false;\n\n /**\n * Value changed\n * @since 2.0.0\n */\n @Event() valueChange: EventEmitter<string | string[]>;\n\n /**\n * Item selection changed\n * @deprecated since 2.0.0. Use `valueChange` instead.\n */\n @Event() itemSelectionChange: EventEmitter<string[]>;\n\n /**\n * Event dispatched whenever the text input changes.\n *\n * @since 2.0.0\n */\n @Event() inputChange: EventEmitter<string>;\n\n /**\n * Item added to selection\n */\n @Event() addItem: EventEmitter<string>;\n\n @State() dropdownShow = false;\n @State() selectedLabels: string[];\n @State() dropdownWrapperRef!: HTMLElement;\n @State() dropdownAnchor!: HTMLElement;\n @State() isDropdownEmpty = false;\n @State() hasFocus = false;\n @State() navigationItem: HTMLIxSelectItemElement;\n @State() inputFilterText: string;\n @State() inputValue: string;\n\n private inputRef!: HTMLInputElement;\n private dropdownRef!: HTMLIxDropdownElement;\n private addItemRef!: HTMLDivElement;\n\n private labelMutationObserver: MutationObserver;\n\n get items() {\n return [\n ...Array.from(this.hostElement.querySelectorAll('ix-select-item')),\n ...Array.from(\n this.hostElement.shadowRoot.querySelectorAll('ix-select-item')\n ),\n ];\n }\n\n get selectedItems() {\n return this.items.filter((item) => item.selected);\n }\n\n get addItemButton() {\n return this.hostElement.shadowRoot.querySelector('.add-item');\n }\n\n get isSingleMode() {\n return this.mode === 'single';\n }\n\n get isMultipleMode() {\n return this.mode === 'multiple';\n }\n\n get isEveryDropdownItemHidden() {\n return this.items.every((item) => item.classList.contains('d-none'));\n }\n\n @Watch('selectedIndices')\n watchSelectedIndices(value: string | string[]) {\n this.value = value;\n this.updateSelection();\n }\n\n @Watch('value')\n watchValue(value: string | string[]) {\n this.selectedIndices = value;\n this.updateSelection();\n }\n\n @Listen('itemClick')\n onItemClicked(event: CustomEvent<string>) {\n const newId = event.detail;\n this.itemClick(newId);\n }\n\n private itemClick(newId: string) {\n this.value = this.toggleValue(newId);\n this.updateSelection();\n this.emitValueChange();\n }\n\n private emitAddItem(value: string) {\n if (value.trim() === '') {\n return;\n }\n\n const newItem = document.createElement('ix-select-item');\n newItem.value = value;\n newItem.label = value;\n\n this.addItemRef.appendChild(newItem);\n\n this.clearInput();\n this.itemClick(value);\n this.addItem.emit(value);\n }\n\n private toggleValue(itemValue: string) {\n if (!this.isMultipleMode) {\n return itemValue;\n }\n\n if (!this.value) {\n return [itemValue];\n }\n\n let value = this.value;\n\n if (!Array.isArray(value)) {\n value = [value];\n }\n\n if (value.includes(itemValue)) {\n return value.filter((value) => value !== itemValue);\n } else {\n return [...value, itemValue];\n }\n }\n\n private updateSelection() {\n let ids = [];\n\n if (this.value) {\n ids = Array.isArray(this.value) ? [...this.value] : [this.value];\n }\n\n this.items.forEach((item) => {\n item.selected = ids.some(\n // Check can be removed if value is type of string in future releases\n (i) =>\n i ===\n (item.value !== undefined && item.value !== null\n ? item.value.toString()\n : '')\n );\n });\n\n this.selectedLabels = this.selectedItems.map((item) => item.label);\n\n if (this.isSingleMode) {\n this.inputValue = this.selectedLabels?.length\n ? this.selectedLabels[0]\n : null;\n return;\n }\n\n this.inputValue = null;\n }\n\n private emitValueChange() {\n this.valueChange.emit(this.value);\n\n if (!this.value) {\n this.itemSelectionChange.emit(null);\n } else {\n this.itemSelectionChange.emit(\n Array.isArray(this.value) ? this.value : [this.value]\n );\n }\n }\n\n componentDidLoad() {\n this.inputRef.addEventListener('input', () => {\n this.dropdownShow = true;\n this.inputChange.emit(this.inputRef.value);\n });\n }\n\n componentWillLoad() {\n if (this.selectedIndices && !this.value) {\n this.value = this.selectedIndices;\n }\n\n this.updateSelection();\n }\n\n @Listen('ix-select-item:labelChange')\n onLabelChange(event: IxSelectItemLabelChangeEvent) {\n event.preventDefault();\n event.stopImmediatePropagation();\n this.updateSelection();\n }\n\n disconnectedCallback() {\n if (this.labelMutationObserver) {\n this.labelMutationObserver.disconnect();\n }\n }\n\n private itemExists(item: string) {\n return this.items.find((i) => i.label === item);\n }\n\n private dropdownVisibilityChanged(event: CustomEvent<boolean>) {\n this.dropdownShow = event.detail;\n this.hasFocus = event.detail;\n\n if (event.detail) {\n this.inputRef.focus();\n this.inputRef.select();\n\n this.removeHiddenFromItems();\n this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n } else {\n this.navigationItem = undefined;\n }\n }\n\n @OnListener<Select>('keydown', (self) => self.dropdownShow)\n async onKeyDown(event: KeyboardEvent) {\n if (event.code === 'ArrowDown' || event.code === 'ArrowUp') {\n this.onArrowNavigation(event, event.code);\n }\n\n if (!this.dropdownShow) {\n return;\n }\n\n if (event.code === 'Enter' || event.code === 'NumpadEnter') {\n await this.onEnterNavigation();\n }\n\n if (event.code === 'Escape') {\n this.dropdownShow = false;\n }\n }\n\n private async onEnterNavigation() {\n if (this.isMultipleMode) {\n return;\n }\n\n if (this.editable && !this.itemExists(this.inputFilterText)) {\n this.emitAddItem(this.inputFilterText);\n this.navigationItem = this.items[this.items.length - 1];\n }\n\n this.navigationItem?.onItemClick();\n await this.dropdownRef?.updatePosition();\n\n if (this.isSingleMode && !this.editable) {\n this.dropdownShow = false;\n }\n }\n\n private onArrowNavigation(\n event: KeyboardEvent,\n key: 'ArrowDown' | 'ArrowUp'\n ) {\n event.preventDefault();\n event.stopPropagation();\n\n this.dropdownShow = true;\n\n const items = this.items.filter((i) => !i.classList.contains('d-none'));\n if (this.navigationItem === undefined) {\n this.applyFocusTo(items[0]);\n return;\n }\n\n let indexOfNavigationItem = items.findIndex(\n (item) => item === this.navigationItem\n );\n\n if (key === 'ArrowDown') {\n indexOfNavigationItem++;\n } else {\n indexOfNavigationItem--;\n }\n\n const newFocusItem = items[indexOfNavigationItem];\n this.applyFocusTo(newFocusItem);\n }\n\n private applyFocusTo(element: HTMLIxSelectItemElement) {\n if (!element) {\n return;\n }\n this.navigationItem = element;\n\n setTimeout(() => {\n element.shadowRoot\n .querySelector('ix-dropdown-item')\n .shadowRoot.querySelector('button')\n .focus();\n });\n }\n\n private filterItemsWithTypeahead() {\n this.inputFilterText = this.inputRef.value;\n\n if (this.isSingleMode && this.inputFilterText === this.selectedLabels[0]) {\n return;\n }\n\n if (this.inputFilterText) {\n this.items.forEach((item) => {\n item.classList.remove('d-none');\n if (\n !item.label.toLowerCase().includes(this.inputFilterText.toLowerCase())\n ) {\n item.classList.add('d-none');\n }\n });\n } else {\n this.removeHiddenFromItems();\n }\n\n this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n }\n\n private removeHiddenFromItems() {\n this.items.forEach((item) => {\n item.classList.remove('d-none');\n });\n }\n\n private clearInput() {\n this.inputRef.value = '';\n this.inputFilterText = '';\n }\n\n private clear() {\n this.clearInput();\n this.selectedLabels = [];\n this.value = [];\n this.valueChange.emit(null);\n this.dropdownShow = false;\n }\n\n private onInputBlur(e) {\n if (this.editable) {\n return;\n }\n\n if (this.isSingleMode) {\n return;\n }\n\n if (!this.dropdownShow && this.mode !== 'multiple') {\n e.target['value'] = this.selectedLabels;\n }\n }\n\n private placeholderValue() {\n if (this.editable) {\n return this.i18nPlaceholderEditable;\n }\n\n if (this.readonly) {\n return '';\n }\n\n return this.i18nPlaceholder;\n }\n\n private isAddItemVisible() {\n return (\n !this.itemExists(this.inputFilterText) &&\n this.editable &&\n this.inputFilterText\n );\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n select: true,\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n ref={(ref) => {\n this.dropdownAnchor = ref;\n if (!this.editable) this.dropdownWrapperRef = ref;\n }}\n >\n <div class=\"input-container\">\n <div class=\"chips\">\n {this.isMultipleMode\n ? this.selectedItems?.map((item) => (\n <ix-filter-chip\n disabled={this.disabled || this.readonly}\n key={item.value}\n onCloseClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.itemClick(item.value);\n }}\n >\n {item.label}\n </ix-filter-chip>\n ))\n : ''}\n <div class=\"trigger\">\n <input\n autocomplete=\"off\"\n data-testid=\"input\"\n disabled={this.disabled}\n readOnly={this.readonly}\n type=\"text\"\n class={{\n 'allow-clear':\n this.allowClear && !!this.selectedLabels?.length,\n }}\n placeholder={this.placeholderValue()}\n value={this.inputValue}\n ref={(ref) => (this.inputRef = ref)}\n onBlur={(e) => this.onInputBlur(e)}\n onFocus={() => {\n this.navigationItem = undefined;\n }}\n onInput={() => this.filterItemsWithTypeahead()}\n onKeyDown={(e) => this.onKeyDown(e)}\n />\n {this.allowClear &&\n (this.selectedLabels?.length || this.inputFilterText) ? (\n <ix-icon-button\n class=\"clear\"\n icon={'clear'}\n ghost\n oval\n size=\"16\"\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.clear();\n }}\n />\n ) : null}\n {this.disabled || this.readonly ? null : (\n <ix-icon-button\n data-select-dropdown\n class={{ 'dropdown-visible': this.dropdownShow }}\n icon=\"chevron-down-small\"\n ghost\n ref={(ref) => {\n if (this.editable) this.dropdownWrapperRef = ref;\n }}\n ></ix-icon-button>\n )}\n </div>\n </div>\n </div>\n </div>\n <ix-dropdown\n ref={(ref) => (this.dropdownRef = ref)}\n show={this.dropdownShow}\n closeBehavior={this.isMultipleMode ? 'outside' : 'both'}\n class={{\n 'd-none': this.disabled || this.readonly,\n }}\n anchor={this.dropdownAnchor}\n trigger={this.dropdownWrapperRef}\n onShowChanged={(e) => this.dropdownVisibilityChanged(e)}\n placement=\"bottom-start\"\n overwriteDropdownStyle={async () => {\n return {\n minWidth: `${this.hostElement.clientWidth}px`,\n };\n }}\n >\n <div\n class={{\n 'select-list-header': true,\n hidden: this.hideListHeader || this.isDropdownEmpty,\n }}\n title={this.i18nSelectListHeader}\n >\n {this.i18nSelectListHeader}\n </div>\n <slot></slot>\n <div ref={(ref) => (this.addItemRef = ref)} class=\"d-contents\"></div>\n {this.isAddItemVisible() ? (\n <ix-dropdown-item\n data-testid=\"add-item\"\n icon={'plus'}\n class={{\n 'add-item': true,\n }}\n label={this.inputFilterText}\n onItemClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.emitAddItem(this.inputFilterText);\n }}\n ></ix-dropdown-item>\n ) : null}\n {this.isDropdownEmpty && !this.editable ? (\n <div class=\"select-list-header\">{this.i18nNoMatches}</div>\n ) : (\n ''\n )}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import{r as e,h as t,H as s}from"./p-26e9d40e.js";const o=":host(.keyValueList) ::slotted(ix-key-value){border-bottom:1px solid var(--theme-color-weak-bdr)}:host(.keyValueList.keyValueList--striped) ::slotted(ix-key-value:nth-child(odd)){background:var(--theme-color-ghost-alt)}";const r=o;const a=class{constructor(t){e(this,t);this.striped=undefined}render(){return t(s,{key:"93f8b95ef19267858e92d059f1b2840ecf3a2e5c",class:{keyValueList:true,"keyValueList--striped":this.striped}},t("slot",{key:"7a41ec73e964e56550283fc740bb752e54e09882"}))}};a.style=r;export{a as ix_key_value_list};
2
- //# sourceMappingURL=p-c49701a0.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as o,c as e,h as t,H as r}from"./p-26e9d40e.js";import{D as n}from"./p-f5e574da.js";const a="label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input,input:-webkit-autofill{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-input--background) inset !important;-webkit-text-fill-color:var(--theme-input--color) !important;border-color:var(--theme-input--border-color) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover,input:hover{border-color:var(--theme-input--border-color--hover);background-color:var(--theme-input--background--hover)}input.focus,input:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus)}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder{color:transparent}input:disabled::placeholder{color:transparent}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea{height:3.25rem;padding:0.375rem 1.25rem 0.375rem 0.5rem}textarea,textarea:-webkit-autofill{font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:100%;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-input--background) inset !important;-webkit-text-fill-color:var(--theme-input--color) !important;border-color:var(--theme-input--border-color) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover,textarea:hover{border-color:var(--theme-input--border-color--hover);background-color:var(--theme-input--background--hover)}textarea.focus,textarea:focus{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus)}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled{box-shadow:none;background-color:transparent;outline:none;border:none;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder{color:transparent}textarea~.valid-feedback,textarea~.invalid-feedback,input~.valid-feedback,input~.invalid-feedback{display:none;font-feature-settings:\"clig\" off, \"liga\" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}form textarea~.valid-feedback,form input~.valid-feedback{color:var(--theme-color-success)}form textarea~.invalid-feedback,form input~.invalid-feedback{color:var(--theme-color-alarm-text)}form:not([novalidate]) :invalid,form:not([novalidate]) .is-invalid,form.was-validated :invalid,form.was-validated .is-invalid{background-color:var(--theme-input-error--background);border-color:var(--theme-input-error--border-color);background-image:url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='512px' height='512px' viewBox='0 0 512 512' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3C!-- Generator: sketchtool 62 (101010) - https://sketch.com --%3E%3Ctitle%3Eerror%3C/title%3E%3Cdesc%3ECreated with sketchtool.%3C/desc%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' fill-opacity='0.75'%3E%3Cg id='error' fill='%23ff2640'%3E%3Cg id='error/error'%3E%3Cpath d='M256,42.6666667 C373.626371,42.6666667 469.333333,138.373627 469.333333,256 C469.333333,373.626371 373.626371,469.333333 256,469.333333 C138.373627,469.333333 42.6666667,373.626371 42.6666667,256 C42.6666667,138.373627 138.373627,42.6666667 256,42.6666667 Z M256,85.3333333 C161.559631,85.3333333 85.3333333,161.559631 85.3333333,256 C85.3333333,350.44037 161.559631,426.666667 256,426.666667 C350.44037,426.666667 426.666667,350.44037 426.666667,256 C426.666667,161.559631 350.44037,85.3333333 256,85.3333333 Z M326.248389,155.581722 L356.418278,185.751611 L286.168667,255.999667 L356.418278,326.248389 L326.248389,356.418278 L255.999667,286.168667 L185.751611,356.418278 L155.581722,326.248389 L225.829667,255.999667 L155.581722,185.751611 L185.751611,155.581722 L255.999667,225.829667 L326.248389,155.581722 Z' id='Combined-Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\") !important;background-position:left calc(0.375em + 0.1875rem) center;padding-right:0.75rem;padding-left:calc(1.5em + 0.75rem);background-size:18px;background-repeat:no-repeat}form:not([novalidate]) :invalid~.invalid-feedback,form:not([novalidate]) .is-invalid~.invalid-feedback,form.was-validated :invalid~.invalid-feedback,form.was-validated .is-invalid~.invalid-feedback{display:block}form:not([novalidate]) :valid~.valid-feedback,form:not([novalidate]) .is-valid~.valid-feedback,form.was-validated :valid~.valid-feedback,form.was-validated .is-valid~.valid-feedback{display:block}form:not(.was-validated) .invalid-feedback,form:not(.was-validated) .valid-feedback{display:none !important}:host{display:block;position:relative;width:22rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .form-control,:host .form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}:host .form-control::-moz-placeholder,:host .form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}:host .form-control::placeholder,:host .form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}:host .form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),:host .form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}:host .form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,:host .form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}:host .form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,:host .form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}:host .form-control:focus-visible{color:var(--theme-input--color)}:host .form-control[type=number]{text-align:right}:host .form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}:host .form-control.readonly,:host .form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}:host .form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .form-control:read-only,:host .form-control[readonly],:host .form-control[readOnly],:host .form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}:host .form-control:read-only::-moz-placeholder,:host .form-control[readonly]::-moz-placeholder,:host .form-control[readOnly]::-moz-placeholder,:host .form-control.readonly::-moz-placeholder{color:transparent}:host .form-control:-moz-read-only::placeholder{color:transparent}:host .form-control:read-only::placeholder,:host .form-control[readonly]::placeholder,:host .form-control[readOnly]::placeholder,:host .form-control.readonly::placeholder{color:transparent}:host .form-control:disabled,:host .form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}:host .form-control:disabled::-moz-placeholder,:host .form-control.disabled::-moz-placeholder{color:transparent}:host .form-control:disabled::placeholder,:host .form-control.disabled::placeholder{color:transparent}:host .form-control-plaintext{outline:0}:host .form-group{position:relative}:host .input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}:host .input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}:host .input-wrapper>input{padding-inline-start:2.2rem}:host select.form-control{padding:0 0.312rem}:host textarea.form-control{padding:0.375rem 0.5rem}:host input.disabled,:host input:disabled{color:var(--theme-input--color--disabled)}:host input:-moz-read-only{cursor:default}:host input:read-only,:host input.readonly{cursor:default}@media (max-width: 576px){:host .clock{padding:1.5rem 0}:host .header{height:1.5rem !important}}@media (min-width: 576px){:host .clock{padding:4.25rem 0}:host .header{height:2.5rem !important}}:host .header{display:flex;align-items:center;justify-content:center;height:2.5rem}:host .flex{display:flex}:host .clock{display:flex;justify-content:center;align-items:center}:host input,:host .time-reference{width:2.625rem;height:1.5rem;text-align:center;margin-top:0.25rem;margin-bottom:0.25rem;}:host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button,:host .time-reference::-webkit-outer-spin-button,:host .time-reference::-webkit-inner-spin-button{-webkit-appearance:none;margin:0 0.3125rem}:host input[type=number],:host .time-reference[type=number]{-moz-appearance:textfield}:host .form-control[type=number]{text-align:center}:host .columns{display:flex;flex-direction:column;align-items:center;justify-content:space-around}:host .column-seperator{display:flex;align-items:center;margin:0 0.25rem}:host .button{display:flex;justify-content:flex-end}:host .default-space{margin-left:1rem}:host .text-align{text-align:center}:host .hidden{display:none}:host .time-reference{margin-top:0.5rem;margin-bottom:0.5rem}";const i=a;const l=class{constructor(t){o(this,t);this.timeSelect=e(this,"timeSelect",7);this.done=e(this,"done",7);this.timeChange=e(this,"timeChange",7);this.format="TT";this.corners="rounded";this.standaloneAppearance=true;this.individual=true;this.showHour=true;this.showMinutes=true;this.showSeconds=true;this.time=n.now().toFormat(this.format);this.showTimeReference=undefined;this.timeReference=undefined;this.textSelectTime="Done";this.textTime="Time";this._time=undefined;this._timeRef=undefined;this._formattedTime=undefined}watchTimePropHandler(o){this._time=n.fromFormat(o,this.format);if(!this._time.isValid){throw new Error("Format is not supported or not correct")}}componentWillLoad(){this._time=n.fromFormat(this.time,this.format);if(!this._time.isValid){console.error(`Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`);return}this._timeRef=this.format.includes("a")?n.fromFormat(this.time,this.format).toFormat("a"):undefined;this.formatTime()}formatTime(){const[o,e,t]=this._time.toFormat(this.format).split(" ")[0].split(":");this._formattedTime={hour:o,minute:e,second:t}}onInternalTimeChange(){this.timeChange.emit(this._time.toFormat(this.format));if(this._timeRef)this._timeRef=this._time.toFormat("a")}timeUpdate(o,e){let t=n.now().endOf("day").get(o);if(this._timeRef==="PM"&&o==="hour")e+=12;if(this._timeRef==="AM"&&o==="hour")t=12;if(e>t){e=t}else if(e<0){e=0}this._time=this._time.set({[o]:e});return e}changeTimeReference(){this._timeRef=this._timeRef==="AM"?"PM":"AM";if(!this._time.toFormat("a").includes(this._timeRef)){this._time=this._time.plus({hour:12})}}async getCurrentTime(){return this._time.toFormat(this.format)}render(){let o=[{unit:"hour",placeholder:"HH",hidden:!this.showHour},{unit:"minute",placeholder:"MM",hidden:!this.showMinutes},{unit:"second",placeholder:"SS",hidden:!this.showSeconds}];o=o.filter((o=>!o.hidden));return t(r,{key:"c09337ff6d0366929f77fe9bbdd89eb43bcc71ea"},t("ix-date-time-card",{key:"80c29872490f5968979a802b92113377ec9df678",standaloneAppearance:this.standaloneAppearance,corners:this.corners},t("div",{key:"35981c4cde62451368ee30fc4bcc19f894939cda",class:"header",slot:"header"},t("ix-typography",{key:"cd88a3f06e8907419acc45cd71d9954b7365096c",variant:"default-title"},this.textTime||"Time")),t("div",{key:"fd5d74523fd649fedac87ac0887fb643fd9795ce",class:"clock"},o.map(((e,r)=>t("div",{class:"flex"},t("div",{class:{columns:true,hidden:e.hidden}},t("ix-icon-button",{size:"16",onClick:()=>this._time=this._time.plus({[e.unit]:1}),ghost:true,icon:"chevron-up",variant:"primary",class:"arrows"}),t("input",{class:"form-control",name:e.unit,type:"number",placeholder:e.placeholder,value:this._formattedTime?this._formattedTime[e.unit]:null,onKeyDown:o=>{if(o.key!=="ArrowUp"&&o.key!=="ArrowDown")return;const t=o.key==="ArrowUp"?1:-1;this._time=this._time.plus({[e.unit]:t});o.preventDefault()},onChange:o=>{let t=o.target;t.value=this.timeUpdate(e.unit,+t.value).toString()}}),t("ix-icon-button",{size:"16",onClick:()=>this._time=this._time.minus({[e.unit]:1}),ghost:true,icon:"chevron-down",variant:"primary",class:"arrows"})),r!==o.length-1&&t("div",{class:{"column-seperator":true,hidden:e.hidden}},":")))),t("div",{key:"819d9ce8cdfc94e7c4a1d2f7190587f052a9d246",class:{columns:true,"default-space":true,hidden:this._timeRef===undefined}},t("ix-icon-button",{key:"6ec3654d6a81bb2420695dd3292677395bd6adc2",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:"chevron-up",variant:"primary",class:"arrows"}),t("div",{key:"09b1dd7076112d4dc5168a968ed0ebebaa67e69f",class:"time-reference"},this._timeRef),t("ix-icon-button",{key:"ff24cdad6df286cc2da51958c2b51fe43f1e4fea",size:"16",onClick:()=>this.changeTimeReference(),ghost:true,icon:"chevron-down",variant:"primary",class:"arrows"}))),t("div",{key:"82602709c4107324d9498426cb30959fe81bacc4",class:{button:true,hidden:!this.standaloneAppearance}},t("ix-button",{key:"64da9baed02906baad694bbe066bc355197d293e",onClick:()=>{this.timeSelect.emit(this._time.toFormat(this.format));this.done.emit(this._time.toFormat(this.format))}},this.textSelectTime))))}static get watchers(){return{time:["watchTimePropHandler"],_time:["formatTime","onInternalTimeChange"]}}};l.style=i;export{l as ix_time_picker};
2
- //# sourceMappingURL=p-cb1c0d63.entry.js.map
@@ -1,2 +0,0 @@
1
- import{r as e,h as d,H as a,g as c}from"./p-26e9d40e.js";import"./p-46a6cd9d.js";import{d as s,c as t}from"./p-6e6efb4c.js";import"./p-c4749812.js";const o=class{constructor(d){e(this,d)}dismiss(){s(this.host)}close(){t(this.host,"Done!")}render(){return d(a,{key:"6588eca80a4a796627317d549ced3d767792d528"},d("div",{key:"06a4f6cb97ef30f9bdc406ca7bad4a1978c8df03"},d("div",{key:"dfc00207c3d9ead47420a30768e216b7907588c9",class:"modal-header"},"Message headline",d("ix-icon-button",{key:"2b01ad4f2e9ca5e277c4d53b6d6cdb5d2b9b74c8","data-close-button":true,ghost:true,icon:"close",onClick:()=>this.dismiss()})),d("div",{key:"4d1ac160957975fe53162ebd42dd2bd8d6dee0d9",class:"modal-body"},"Message text lorem ipsum"),d("div",{key:"9709cda6c07d7c0abe13424dc87c64bb11162622",class:"modal-footer"},d("ix-button",{key:"f2c257ebea902ef30674ad2d24a150ad17b82df3",outline:true,onClick:()=>this.dismiss()},"Cancel"),d("ix-button",{key:"1f512110cfacee2259d709031be3e5a5869d9704",onClick:()=>this.close()},"OK"))))}get host(){return c(this)}};export{o as ix_modal_example};
2
- //# sourceMappingURL=p-d0cf522c.entry.js.map