@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
package/components/ix-category-filter.js CHANGED
@@ -6,7 +6,7 @@ import { d as defineCustomElement$4 } from './filter-chip.js';
6
6
  import { d as defineCustomElement$3 } from './icon-button.js';
7
7
  import { d as defineCustomElement$2 } from './spinner.js';
8
8
 
9
- const categoryFilterCss = ":host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}: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{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}:host .btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host .btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}:host .btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}:host .btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}:host{min-width:5rem}.dropdown-group{margin:0.687rem;display:block;position:relative;width:21.562rem;border-radius:0.25rem;background-color:#f8f9fa;border:solid 0.062rem rgba(0, 0, 0, 0.25)}.dropdown-group .dropdown-group-title{display:block;position:relative;font-size:0.875rem;text-align:left;margin:0.937rem 0 1.25rem 0.937rem}.dropdown-group .dropdown-group-content{position:relative;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:11.562rem;margin:0.937rem 0 0.937rem 0.937rem}.dropdown-group .dropdown-group-content>*{margin-bottom:1rem}.dropdown-group-submit{display:flex;justify-content:space-between;margin:0 0.687rem 0 0.687rem}.dropdown-menu{position:absolute;background-color:var(--theme-menu--background);-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.143em;color:var(--theme-color-std-text);border:var(--theme-menu--border-thickness) solid var(--theme-menu--border--color);border-radius:var(--theme-menu--border-radius);max-width:100vw;padding:0.25rem 0;transition:background-color var(--theme-default-time);box-shadow:var(--theme-menu--box-shadow)}.dropdown-menu.xl>.dropdown-item{height:2.5rem;line-height:2.187rem}.dropdown-header{display:flex;align-items:center;height:2.5rem;color:var(--theme-menu-header--color);padding:0 1rem}.dropdown-buttons{display:flex;padding:0.25rem 0.5rem}.dropdown-buttons ix-icon-button+ix-icon-button{margin-inline-start:0.5rem}.dropdown-item{display:flex;height:2.5rem;position:relative;align-items:center;cursor:pointer;padding:0 2rem;border:1px solid transparent;color:var(--theme-menu-item--color);background-color:transparent}.dropdown-item:focus-visible{background-color:var(--theme-menu-item--background);color:var(--theme-menu-item--color)}.dropdown-item:focus-visible{outline:none;background-color:var(--theme-menu-item--background);border-color:#119fff;color:var(--theme-menu-item--color--focus)}.dropdown-item:not(.disabled):not(:disabled){cursor:pointer}.dropdown-item:not(.disabled):not(:disabled):hover{color:var(--theme-menu-item--color--hover);background-color:var(--theme-menu-item--background--hover)}.dropdown-item:not(.disabled):not(:disabled){cursor:pointer}.dropdown-item:not(.disabled):not(:disabled):active,.dropdown-item:not(.disabled):not(:disabled).active{color:var(--theme-menu-item--color--active);background-color:var(--theme-menu-item--background--active)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--theme-menu-item--color--disabled);background-color:var(--theme-menu-item--background--disabled)}.dropdown-item>a,.dropdown-item a:hover,.dropdown-item a:active{color:var(--theme-color-std-text)}.dropdown-item>.glyph{color:var(--theme-menu-item-icon--color);margin-inline-end:0.5rem}.dropdown-item>.glyph.disabled{color:var(--color-weak-text)}.dropdown-item>.glyph.glyph-single-check{color:var(--theme-menu-item-icon-check--color)}.dropdown-item>input[type=checkbox]+label{margin-bottom:0px}.dropdown-item>input[type=checkbox]+label::before{margin-right:1rem}.dropdown-divider{border-top:1px solid var(--theme-menu-separator--background);margin:0.25rem 0}button.dropdown-toggle{position:relative;padding-right:1.5rem}button.dropdown-toggle::after{position:absolute;top:45%;right:0.5rem}.form-control,.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}.form-control::-moz-placeholder,.form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.form-control::placeholder,.form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.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}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.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}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.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)}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.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)}.form-control:focus-visible{color:var(--theme-input--color)}.form-control[type=number]{text-align:right}.form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.form-control.readonly,.form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only,.form-control[readonly],.form-control[readOnly],.form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only::-moz-placeholder,.form-control[readonly]::-moz-placeholder,.form-control[readOnly]::-moz-placeholder,.form-control.readonly::-moz-placeholder{color:transparent}.form-control:-moz-read-only::placeholder{color:transparent}.form-control:read-only::placeholder,.form-control[readonly]::placeholder,.form-control[readOnly]::placeholder,.form-control.readonly::placeholder{color:transparent}.form-control:disabled,.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)}.form-control:disabled::-moz-placeholder,.form-control.disabled::-moz-placeholder{color:transparent}.form-control:disabled::placeholder,.form-control.disabled::placeholder{color:transparent}.form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.form-control{padding:0 0.312rem}textarea.form-control{padding:0.375rem 0.5rem}input.disabled,input:disabled{color:var(--theme-input--color--disabled)}input:-moz-read-only{cursor:default}input:read-only,input.readonly{cursor:default}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;height:auto}: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 :host(:focus-visible:not(.disabled):not(:disabled)){border-color:var(--theme-color-primary);box-shadow:0 0 0.25rem 0 var(--theme-color-primary) !important}:host .reset-button{position:absolute;top:0.25rem;right:0.25rem}:host .reset-button.hide-reset-button{display:none}:host .input-container{display:flex;height:auto;max-height:3.75rem;padding:1px 1.5rem 1px 1.75rem !important}:host .input-container:not(.readonly):not(.disabled),:host .input-container:not(.readonly):not(.disabled):-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)}:host .input-container:not(.readonly):not(.disabled):-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}:host .input-container:not(.readonly):not(.disabled)::-moz-placeholder{color:var(--theme-input-hint--color)}:host .input-container:not(.readonly):not(.disabled)::placeholder{color:var(--theme-input-hint--color)}:host .input-container:not(.readonly):not(.disabled).hover,:host .input-container:not(.readonly):not(.disabled):hover{border-color:var(--theme-input--border-color--hover);background-color:var(--theme-input--background--hover)}:host .input-container:not(.readonly):not(.disabled).focus,:host .input-container:not(.readonly):not(.disabled):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)}:host .input-container:not(.readonly):not(.disabled):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)}:host .input-container:not(.readonly):not(.disabled):disabled::-moz-placeholder{color:transparent}:host .input-container:not(.readonly):not(.disabled):disabled::placeholder{color:transparent}:host .input-container.disabled{color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}:host .input-container.readonly,:host .input-container.readonly:-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)}:host .input-container.readonly:-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}:host .input-container.readonly::-moz-placeholder{color:var(--theme-input-hint--color)}:host .input-container.readonly::placeholder{color:var(--theme-input-hint--color)}:host .input-container.readonly.hover,:host .input-container.readonly:hover{border-color:var(--theme-input--border-color--hover);background-color:var(--theme-input--background--hover)}:host .input-container.readonly.focus,:host .input-container.readonly: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)}:host .input-container.readonly:-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)}:host .input-container.readonly.read-only,:host .input-container.readonly: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)}:host .input-container.readonly.read-only::-moz-placeholder,:host .input-container.readonly:read-only::-moz-placeholder{color:transparent}:host .input-container.readonly:-moz-read-only::placeholder{color:transparent}:host .input-container.readonly.read-only::placeholder,:host .input-container.readonly:read-only::placeholder{color:transparent}:host .input-container.readonly: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)}:host .input-container.readonly:disabled::-moz-placeholder{color:transparent}:host .input-container.readonly:disabled::placeholder{color:transparent}:host .input-container.no-icon{padding-left:0.25rem}:host .token-container{flex-grow:1;overflow:hidden}:host .text-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);width:auto;height:1.75rem;min-height:1.5rem;background:transparent;flex-grow:1;box-shadow:none}:host .text-input,:host .text-input:hover,:host .text-input:focus-visible{border:none;outline:none}:host .text-input.hide-placeholder::-moz-placeholder{opacity:0}:host .text-input.hide-placeholder::placeholder{opacity:0}:host .list-unstyled{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0;overflow-y:auto}:host ix-icon{position:absolute;top:0.5rem;left:0.5rem}:host ix-filter-chip{margin-right:0.25rem}:host .category-preview{display:flex;align-items:center;height:1.5rem;background-color:var(--theme-bg-3);border-top-left-radius:1rem;border-bottom-left-radius:1rem;padding:0.5rem;margin:2px 0}:host ul{height:100%}:host ul>li,:host input{padding-inline-start:0;padding-top:2px;padding-bottom:2px}:host ix-dropdown{min-width:10rem !important}:host ix-dropdown .dropdown-item-container{display:flex;flex-direction:column}:host ix-dropdown .dropdown-item-container .dropdown-item{-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.143em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:2.5rem;margin:0.25rem 0.5rem;padding-inline:0.5rem;border:1px solid transparent;border-radius:100rem;width:auto;justify-content:flex-start;flex-grow:1}:host ix-dropdown .dropdown-item-container .dropdown-item:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr)}:host ix-dropdown .dropdown-item-container .category-item{border-end-end-radius:0;border-start-end-radius:0}:host ix-dropdown .dropdown-item-container .category-item-value{border-start-start-radius:0;border-end-start-radius:0}:host ix-dropdown .btn-toggle-operator{width:2rem;height:2rem;margin-inline:0.5rem}:host .d-none{display:none}";
9
+ const categoryFilterCss = ":host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}: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{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}:host .btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host .btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}:host .btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}:host .btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}:host{min-width:5rem}.dropdown-group{margin:0.687rem;display:block;position:relative;width:21.562rem;border-radius:0.25rem;background-color:#f8f9fa;border:solid 0.062rem rgba(0, 0, 0, 0.25)}.dropdown-group .dropdown-group-title{display:block;position:relative;font-size:0.875rem;text-align:left;margin:0.937rem 0 1.25rem 0.937rem}.dropdown-group .dropdown-group-content{position:relative;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;height:11.562rem;margin:0.937rem 0 0.937rem 0.937rem}.dropdown-group .dropdown-group-content>*{margin-bottom:1rem}.dropdown-group-submit{display:flex;justify-content:space-between;margin:0 0.687rem 0 0.687rem}.dropdown-menu{position:absolute;background-color:var(--theme-menu--background);-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.143em;color:var(--theme-color-std-text);border:var(--theme-menu--border-thickness) solid var(--theme-menu--border--color);border-radius:var(--theme-menu--border-radius);max-width:100vw;padding:0.25rem 0;transition:background-color var(--theme-default-time);box-shadow:var(--theme-menu--box-shadow)}.dropdown-menu.xl>.dropdown-item{height:2.5rem;line-height:2.187rem}.dropdown-header{display:flex;align-items:center;height:2.5rem;color:var(--theme-menu-header--color);padding:0 1rem}.dropdown-buttons{display:flex;padding:0.25rem 0.5rem}.dropdown-buttons ix-icon-button+ix-icon-button{margin-inline-start:0.5rem}.dropdown-item{display:flex;height:2.5rem;position:relative;align-items:center;cursor:pointer;padding:0 2rem;border:1px solid transparent;color:var(--theme-menu-item--color);background-color:transparent}.dropdown-item:focus-visible{background-color:var(--theme-menu-item--background);color:var(--theme-menu-item--color)}.dropdown-item:focus-visible{outline:none;background-color:var(--theme-menu-item--background);border-color:#119fff;color:var(--theme-menu-item--color--focus)}.dropdown-item:not(.disabled):not(:disabled){cursor:pointer}.dropdown-item:not(.disabled):not(:disabled):hover{color:var(--theme-menu-item--color--hover);background-color:var(--theme-menu-item--background--hover)}.dropdown-item:not(.disabled):not(:disabled){cursor:pointer}.dropdown-item:not(.disabled):not(:disabled):active,.dropdown-item:not(.disabled):not(:disabled).active{color:var(--theme-menu-item--color--active);background-color:var(--theme-menu-item--background--active)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--theme-menu-item--color--disabled);background-color:var(--theme-menu-item--background--disabled)}.dropdown-item>a,.dropdown-item a:hover,.dropdown-item a:active{color:var(--theme-color-std-text)}.dropdown-item>.glyph{color:var(--theme-menu-item-icon--color);margin-inline-end:0.5rem}.dropdown-item>.glyph.disabled{color:var(--color-weak-text)}.dropdown-item>.glyph.glyph-single-check{color:var(--theme-menu-item-icon-check--color)}.dropdown-item>input[type=checkbox]+label{margin-bottom:0px}.dropdown-item>input[type=checkbox]+label::before{margin-right:1rem}.dropdown-divider{border-top:1px solid var(--theme-menu-separator--background);margin:0.25rem 0}button.dropdown-toggle{position:relative;padding-right:1.5rem}button.dropdown-toggle::after{position:absolute;top:45%;right:0.5rem}.form-control,.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}.form-control::-moz-placeholder,.form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.form-control::placeholder,.form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.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}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.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}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.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)}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.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)}.form-control:focus-visible{color:var(--theme-input--color)}.form-control[type=number]{text-align:right}.form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.form-control.readonly,.form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only,.form-control[readonly],.form-control[readOnly],.form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only::-moz-placeholder,.form-control[readonly]::-moz-placeholder,.form-control[readOnly]::-moz-placeholder,.form-control.readonly::-moz-placeholder{color:transparent}.form-control:-moz-read-only::placeholder{color:transparent}.form-control:read-only::placeholder,.form-control[readonly]::placeholder,.form-control[readOnly]::placeholder,.form-control.readonly::placeholder{color:transparent}.form-control:disabled,.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)}.form-control:disabled::-moz-placeholder,.form-control.disabled::-moz-placeholder{color:transparent}.form-control:disabled::placeholder,.form-control.disabled::placeholder{color:transparent}.form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.form-control{padding:0 0.312rem}textarea.form-control{padding:0.375rem 0.5rem}input.disabled,input:disabled{color:var(--theme-input--color--disabled)}input:-moz-read-only{cursor:default}input:read-only,input.readonly{cursor:default}label{color:var(--theme-color-soft-text);padding:2px 0px}label.label-alignment-left{padding:6px 0px}input{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-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !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) !important;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) !important}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{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-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !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) !important;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) !important}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;height:auto}: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 :host(:focus-visible:not(.disabled):not(:disabled)){border-color:var(--theme-color-primary);box-shadow:0 0 0.25rem 0 var(--theme-color-primary) !important}:host .reset-button{position:absolute;top:0.25rem;right:0.25rem}:host .reset-button.hide-reset-button{display:none}:host .input-container{display:flex;height:auto;max-height:3.75rem;padding:1px 1.5rem 1px 1.75rem !important}:host .input-container:not(.readonly):not(.disabled){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)}:host .input-container:not(.readonly):not(.disabled):-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container:not(.readonly):not(.disabled):-webkit-autofill,:host .input-container:not(.readonly):not(.disabled):autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container:not(.readonly):not(.disabled)::-moz-placeholder{color:var(--theme-input-hint--color)}:host .input-container:not(.readonly):not(.disabled)::placeholder{color:var(--theme-input-hint--color)}:host .input-container:not(.readonly):not(.disabled).hover,:host .input-container:not(.readonly):not(.disabled):hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container:not(.readonly):not(.disabled).focus,:host .input-container:not(.readonly):not(.disabled):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) !important}:host .input-container:not(.readonly):not(.disabled):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)}:host .input-container:not(.readonly):not(.disabled):disabled::-moz-placeholder{color:transparent}:host .input-container:not(.readonly):not(.disabled):disabled::placeholder{color:transparent}:host .input-container.disabled{color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}:host .input-container.readonly{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)}:host .input-container.readonly:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container.readonly:-webkit-autofill,:host .input-container.readonly:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}:host .input-container.readonly::-moz-placeholder{color:var(--theme-input-hint--color)}:host .input-container.readonly::placeholder{color:var(--theme-input-hint--color)}:host .input-container.readonly.hover,:host .input-container.readonly:hover{border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}:host .input-container.readonly.focus,:host .input-container.readonly: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) !important}:host .input-container.readonly:-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)}:host .input-container.readonly.read-only,:host .input-container.readonly: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)}:host .input-container.readonly.read-only::-moz-placeholder,:host .input-container.readonly:read-only::-moz-placeholder{color:transparent}:host .input-container.readonly:-moz-read-only::placeholder{color:transparent}:host .input-container.readonly.read-only::placeholder,:host .input-container.readonly:read-only::placeholder{color:transparent}:host .input-container.readonly: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)}:host .input-container.readonly:disabled::-moz-placeholder{color:transparent}:host .input-container.readonly:disabled::placeholder{color:transparent}:host .input-container.no-icon{padding-left:0.25rem}:host .token-container{flex-grow:1;overflow:hidden}:host .text-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);width:auto;height:1.75rem;min-height:1.5rem;background:transparent;flex-grow:1;box-shadow:none}:host .text-input,:host .text-input:hover,:host .text-input:focus-visible{border:none;outline:none}:host .text-input.hide-placeholder::-moz-placeholder{opacity:0}:host .text-input.hide-placeholder::placeholder{opacity:0}:host .list-unstyled{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0;overflow-y:auto}:host ix-icon{position:absolute;top:0.5rem;left:0.5rem}:host ix-filter-chip{margin-right:0.25rem}:host .category-preview{display:flex;align-items:center;height:1.5rem;background-color:var(--theme-bg-3);border-top-left-radius:1rem;border-bottom-left-radius:1rem;padding:0.5rem;margin:2px 0}:host ul{height:100%}:host ul>li,:host input{padding-inline-start:0;padding-top:2px;padding-bottom:2px}:host ix-dropdown{min-width:10rem !important}:host ix-dropdown .dropdown-item-container{display:flex;flex-direction:column}:host ix-dropdown .dropdown-item-container .dropdown-item{-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.143em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:2.5rem;margin:0.25rem 0.5rem;padding-inline:0.5rem;border:1px solid transparent;border-radius:100rem;width:auto;justify-content:flex-start;flex-grow:1}:host ix-dropdown .dropdown-item-container .dropdown-item:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr)}:host ix-dropdown .dropdown-item-container .category-item{border-end-end-radius:0;border-start-end-radius:0}:host ix-dropdown .dropdown-item-container .category-item-value{border-start-start-radius:0;border-end-start-radius:0}:host ix-dropdown .btn-toggle-operator{width:2rem;height:2rem;margin-inline:0.5rem}:host .d-none{display:none}";
10
10
  const IxCategoryFilterStyle0 = categoryFilterCss;
11
11
 
12
12
  const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter extends HTMLElement {
@@ -34,11 +34,15 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
34
34
  this.suggestions = undefined;
35
35
  this.icon = 'search';
36
36
  this.hideIcon = undefined;
37
+ this.staticOperator = undefined;
37
38
  this.repeatCategories = true;
38
39
  this.tmpDisableScrollIntoView = true;
39
40
  this.labelCategories = 'Categories';
40
41
  this.i18nPlainText = 'Filter by text';
41
42
  }
43
+ get dropdown() {
44
+ return this.hostElement.shadowRoot.querySelector('ix-dropdown');
45
+ }
42
46
  watchFilterState(newValue) {
43
47
  this.setFilterState(newValue);
44
48
  }
@@ -61,6 +65,9 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
61
65
  this.inputValue = this.textInput.value;
62
66
  const inputState = new InputState(this.inputValue, this.category);
63
67
  this.inputChanged.emit(inputState);
68
+ if (!this.dropdown.show) {
69
+ this.openDropdown();
70
+ }
64
71
  });
65
72
  this.textInput.addEventListener('keydown', this.handleInputElementKeyDown.bind(this));
66
73
  }
@@ -78,7 +85,13 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
78
85
  if (this.disabled || this.readonly) {
79
86
  return;
80
87
  }
81
- this.hostElement.shadowRoot.querySelector('ix-dropdown').show = false;
88
+ this.dropdown.show = false;
89
+ }
90
+ openDropdown() {
91
+ if (this.disabled || this.readonly) {
92
+ return;
93
+ }
94
+ this.dropdown.show = true;
82
95
  }
83
96
  handleFormElementKeyDown(e) {
84
97
  switch (e.code) {
@@ -200,7 +213,6 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
200
213
  if (emitEvent) {
201
214
  this.emitFilterEvent();
202
215
  }
203
- this.closeDropdown();
204
216
  }
205
217
  removeToken(index) {
206
218
  this.filterTokens = this.filterTokens.filter((_, i) => i !== index);
@@ -292,6 +304,9 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
292
304
  return (h("div", { class: "dropdown-item-container" }, this.getFilteredSuggestions().map((suggestion) => (h("button", { class: "dropdown-item", "data-id": suggestion, onClick: () => this.addToken(suggestion), key: suggestion, title: suggestion }, suggestion)))));
293
305
  }
294
306
  renderOperatorButton() {
307
+ if (this.staticOperator) {
308
+ return '';
309
+ }
295
310
  const params = {
296
311
  type: 'button',
297
312
  variant: 'secondary',
@@ -300,7 +315,7 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
300
315
  iconOnly: true,
301
316
  iconOval: false,
302
317
  selected: false,
303
- disabled: this.disabled,
318
+ disabled: this.disabled || this.staticOperator !== undefined,
304
319
  loading: false,
305
320
  icon: '',
306
321
  onClick: (e) => {
@@ -316,12 +331,20 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
316
331
  ? '='
317
332
  : '!='));
318
333
  }
334
+ getFilterOperatorString() {
335
+ let operator;
336
+ if (this.staticOperator !== undefined) {
337
+ operator = this.staticOperator;
338
+ }
339
+ else {
340
+ operator = this.categoryLogicalOperator;
341
+ }
342
+ return `${operator === LogicalFilterOperator.EQUAL ? '=' : '!='} `;
343
+ }
319
344
  renderCategoryValues() {
320
345
  var _a, _b;
321
346
  return (h("div", { class: "dropdown-item-container" }, this.renderOperatorButton(), h("div", { class: "dropdown-header" }, (_a = this.categories[this.category]) === null || _a === void 0 ? void 0 : _a.label), (_b = this.categories[this.category]) === null || _b === void 0 ? void 0 :
322
- _b.options.filter((value) => this.filterByInput(value)).filter((value) => this.filterDuplicateTokens(value)).map((id) => (h("button", { class: "dropdown-item category-item-value", "data-id": id, title: id, key: id, onClick: () => this.addToken(id, this.category) }, `${this.categoryLogicalOperator === LogicalFilterOperator.EQUAL
323
- ? '='
324
- : '!='} ${id}`)))));
347
+ _b.options.filter((value) => this.filterByInput(value)).filter((value) => this.filterDuplicateTokens(value)).map((id) => (h("button", { class: "dropdown-item category-item-value", "data-id": id, title: id, key: id, onClick: () => this.addToken(id, this.category) }, `${this.getFilterOperatorString()} ${id}`)))));
325
348
  }
326
349
  renderDropdownContent() {
327
350
  if (this.hasCategorySelection()) {
@@ -381,19 +404,19 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
381
404
  }
382
405
  render() {
383
406
  var _a;
384
- return (h(Host, { key: '0f9a572e6a88a431b40ca329d9205c2178bc1af4' }, h("form", { key: 'ab1d823c5dc0e8b730fbf7ecc9fa0600399b14e1', ref: (el) => (this.formElement = el) }, h("div", { key: '041f20e0c8fbfb9253c771baa556cecb43108959', "read-only": this.readonly, class: {
407
+ return (h(Host, { key: 'ed593bf02543787202e00fd780a7ed5e1aa70822' }, h("form", { key: '5ca9f28201cc5d6b505cb2c1d61251c8a527a100', ref: (el) => (this.formElement = el) }, h("div", { key: '3ea203f7eb77c54e8c2a76a8a19fd74284de496c', "read-only": this.readonly, class: {
385
408
  'input-container': true,
386
409
  disabled: this.disabled,
387
410
  focus: this.hasFocus,
388
411
  readonly: this.readonly,
389
412
  'no-icon': this.hideIcon,
390
- } }, h("ix-icon", { key: '941c38fef02caf91f76cc226affd9acb144e7bd7', color: this.getIconColor(), class: { 'd-none': this.hideIcon }, name: this.icon, size: "16" }), h("div", { key: 'f01d496f95fbaefab743090ea6543116f8a7b6f5', class: "token-container" }, h("ul", { key: '763b53af79ac6f3dadfc88f5321c18770a12b1d4', class: "list-unstyled" }, this.filterTokens.map((value, index) => (h("li", { key: value.toString(), class: {
413
+ } }, h("ix-icon", { key: '18474d20426046a25a00a2d4388709eace1b0de8', color: this.getIconColor(), class: { 'd-none': this.hideIcon }, name: this.icon, size: "16" }), h("div", { key: 'd9da49fe378d75b691704dea0c4dc0eb4140eb31', class: "token-container" }, h("ul", { key: '3ddb28dbe2a41cfaab3e43ac216c97ab6580a2fd', class: "list-unstyled" }, this.filterTokens.map((value, index) => (h("li", { key: value.toString(), class: {
391
414
  animate__animated: true,
392
415
  animate__fadein: true,
393
416
  } }, h("ix-filter-chip", { disabled: this.disabled, readonly: this.readonly, onClick: (e) => e.stopPropagation(), onCloseClick: () => this.removeToken(index) }, this.getFilterChipLabel(value))))), this.categories === undefined ? ('') : (h("li", { class: {
394
417
  'category-preview': true,
395
418
  'd-none': this.category === undefined,
396
- } }, (_a = this.categories[this.category]) === null || _a === void 0 ? void 0 : _a.label)), h("input", { key: '0c8f637bb0033bb87fce7e48da5d4334ae11a609', class: {
419
+ } }, (_a = this.categories[this.category]) === null || _a === void 0 ? void 0 : _a.label)), h("input", { key: '095e0450f11f61f9a30b8f3e680bbab05c519113', class: {
397
420
  'text-input': true,
398
421
  'hide-placeholder': this.readonly ||
399
422
  this.disabled ||
@@ -415,6 +438,7 @@ const CategoryFilter = /*@__PURE__*/ proxyCustomElement(class CategoryFilter ext
415
438
  "suggestions": [16],
416
439
  "icon": [1],
417
440
  "hideIcon": [4, "hide-icon"],
441
+ "staticOperator": [1, "static-operator"],
418
442
  "repeatCategories": [4, "repeat-categories"],
419
443
  "tmpDisableScrollIntoView": [4, "tmp-disable-scroll-into-view"],
420
444
  "labelCategories": [1, "label-categories"],
package/components/ix-category-filter.js.map CHANGED
@@ -1 +1 @@
1
- {"file":"ix-category-filter.js","mappings":"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","names":[],"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"],"version":3}
1
+ {"file":"ix-category-filter.js","mappings":"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","names":[],"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 categories will always be filtered via the respective logical operator.\n * Toggling of the operator will not be available to the user.\n *\n * @since 2.2.0\n */\n @Prop() staticOperator?: LogicalFilterOperator;\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 get dropdown() {\n return this.hostElement.shadowRoot.querySelector('ix-dropdown');\n }\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 if (!this.dropdown.show) {\n this.openDropdown();\n }\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.dropdown.show = false;\n }\n\n private openDropdown() {\n if (this.disabled || this.readonly) {\n return;\n }\n\n this.dropdown.show = true;\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\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 if (this.staticOperator) {\n return '';\n }\n\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 || this.staticOperator !== undefined,\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 getFilterOperatorString() {\n let operator: LogicalFilterOperator;\n if (this.staticOperator !== undefined) {\n operator = this.staticOperator;\n } else {\n operator = this.categoryLogicalOperator;\n }\n return `${operator === LogicalFilterOperator.EQUAL ? '=' : '!='} `;\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 {`${this.getFilterOperatorString()} ${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"],"version":3}
package/components/ix-event-list-item.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
+ import { a as a11yBoolean } from './a11y.js';
2
3
 
3
4
  const eventListItemCss = ":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}";
4
5
  const IxEventListItemStyle0 = eventListItemCss;
@@ -28,16 +29,16 @@ const EventListItem = /*@__PURE__*/ proxyCustomElement(class EventListItem exten
28
29
  ? `var(${this.color})`
29
30
  : `var(--theme-${this.color})`;
30
31
  }
31
- return (h(Host, { key: 'ea6803280e270d6b6c4dc0023de76812bc7e90ed', class: {
32
+ return (h(Host, { key: '886fd04038ed9b7ae7e9137b2e939ce5a391889b', class: {
32
33
  disabled: this.disabled,
33
- } }, h("div", { key: '75efa47c7a119ea2d7aa659f5c2709fa34cfb3eb', class: {
34
+ } }, h("li", { key: 'abcf0a5109a0a267482a21cf5daf0aa1190b14df', "aria-disabled": a11yBoolean(this.disabled), class: {
34
35
  'event-list-item': true,
35
36
  selected: this.selected,
36
37
  disabled: this.disabled,
37
- } }, h("div", { key: '74d747f6b58ce8b56343983e3f4cc1c97e0623fc', class: `indicator ${!((_c = this.itemColor) !== null && _c !== void 0 ? _c : this.color) ? 'indicator-empty' : ''}`, style: {
38
+ } }, h("div", { key: '80965a6f06a8e06e7fd4eb3c7e18a42cfb1fe68d', class: `indicator ${!((_c = this.itemColor) !== null && _c !== void 0 ? _c : this.color) ? 'indicator-empty' : ''}`, style: {
38
39
  'background-color': ((_d = this.itemColor) !== null && _d !== void 0 ? _d : this.color) ? color : 'inherit',
39
40
  opacity: `${this.disabled ? 0.4 : 1}`,
40
- } }), h("div", { key: 'b32602b0c89701f487cf10b1600c2ed039e86498', class: "event-list-item-container" }, h("div", { key: 'd3298c260d4f74aa91a747a61b93203fab354432', class: "event-content" }, h("slot", { key: '45c7a053766b5f7ce3dcae9d74bb22201c0dba9b' })), this.chevron && (h("ix-icon", { name: 'chevron-right', size: "16", class: "chevron-icon" }))))));
41
+ } }), h("div", { key: '1848fb6081def3209f3089713c1fee3e5f10379f', class: "event-list-item-container" }, h("div", { key: '93938c03d5576c5ecc35006b1620ff5170e37fb7', class: "event-content" }, h("slot", { key: 'e35b7858bf2766e1e546e850b037bf98880083fc' })), this.chevron && (h("ix-icon", { name: 'chevron-right', size: "16", class: "chevron-icon" }))))));
41
42
  }
42
43
  static get style() { return IxEventListItemStyle0; }
43
44
  }, [1, "ix-event-list-item", {
package/components/ix-event-list-item.js.map CHANGED
@@ -1 +1 @@
1
- {"file":"ix-event-list-item.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,uyHAAuyH,CAAC;AACj0H,8BAAe,gBAAgB;;MCuBlB,aAAa;;;;;;;;;;;;IA2CxB,eAAe;QACb,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;KACvB;IAED,MAAM;;QACJ,IAAI,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,UAAU,CAAC,SAAS,CAAC;cAC7C,OAAO,IAAI,CAAC,SAAS,GAAG;cACxB,eAAe,IAAI,CAAC,SAAS,GAAG,CAAC;QAErC,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,UAAU,CAAC,SAAS,CAAC;kBACrC,OAAO,IAAI,CAAC,KAAK,GAAG;kBACpB,eAAe,IAAI,CAAC,KAAK,GAAG,CAAC;SAClC;QAED,QACE,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAED,4DACE,KAAK,EAAE;gBACL,iBAAiB,EAAE,IAAI;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAED,4DACE,KAAK,EAAE,aACL,EAAE,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC,GAAG,iBAAiB,GAAG,EACxD,EAAE,EACF,KAAK,EAAE;gBACL,kBAAkB,EAChB,CAAA,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,IAAG,KAAK,GAAG,SAAS;gBAClD,OAAO,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,CAAC,EAAE;aACtC,GACI,EAEP,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAC,eAAe,IACxB,8DAAa,CACT,EACL,IAAI,CAAC,OAAO,KACX,eACE,IAAI,EAAE,eAAe,EACrB,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,cAAc,GACX,CACZ,CACG,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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"],"version":3}
1
+ {"file":"ix-event-list-item.js","mappings":";;;AAAA,MAAM,gBAAgB,GAAG,uyHAAuyH,CAAC;AACj0H,8BAAe,gBAAgB;;MCwBlB,aAAa;;;;;;;;;;;;IA2CxB,eAAe;QACb,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;KACvB;IAED,MAAM;;QACJ,IAAI,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,UAAU,CAAC,SAAS,CAAC;cAC7C,OAAO,IAAI,CAAC,SAAS,GAAG;cACxB,eAAe,IAAI,CAAC,SAAS,GAAG,CAAC;QAErC,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,KAAK,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,UAAU,CAAC,SAAS,CAAC;kBACrC,OAAO,IAAI,CAAC,KAAK,GAAG;kBACpB,eAAe,IAAI,CAAC,KAAK,GAAG,CAAC;SAClC;QAED,QACE,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAED,4EACiB,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,EACzC,KAAK,EAAE;gBACL,iBAAiB,EAAE,IAAI;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAED,4DACE,KAAK,EAAE,aACL,EAAE,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,CAAC,GAAG,iBAAiB,GAAG,EACxD,EAAE,EACF,KAAK,EAAE;gBACL,kBAAkB,EAChB,CAAA,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,IAAG,KAAK,GAAG,SAAS;gBAClD,OAAO,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,CAAC,EAAE;aACtC,GACI,EAEP,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAC,eAAe,IACxB,8DAAa,CACT,EACL,IAAI,CAAC,OAAO,KACX,eACE,IAAI,EAAE,eAAe,EACrB,IAAI,EAAC,IAAI,EACT,KAAK,EAAC,cAAc,GACX,CACZ,CACG,CACH,CACA,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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';\nimport { a11yBoolean } from '../utils/a11y';\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 <li\n aria-disabled={a11yBoolean(this.disabled)}\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 </li>\n </Host>\n );\n }\n}\n"],"version":3}