@siemens/ix 1.5.0-beta.1 → 1.5.0-beta.3

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 (276) hide show
  1. package/dist/cjs/index-478a4b66.js.map +1 -1
  2. package/dist/cjs/ix-blind.cjs.entry.js +24 -6
  3. package/dist/cjs/ix-blind.cjs.entry.js.map +1 -1
  4. package/dist/cjs/ix-breadcrumb_2.cjs.entry.js +6 -2
  5. package/dist/cjs/ix-breadcrumb_2.cjs.entry.js.map +1 -1
  6. package/dist/cjs/ix-category-filter.cjs.entry.js +17 -3
  7. package/dist/cjs/ix-category-filter.cjs.entry.js.map +1 -1
  8. package/dist/cjs/ix-date-picker_2.cjs.entry.js +3133 -3872
  9. package/dist/cjs/ix-date-picker_2.cjs.entry.js.map +1 -1
  10. package/dist/cjs/ix-datetime-picker.cjs.entry.js +2 -2
  11. package/dist/cjs/ix-datetime-picker.cjs.entry.js.map +1 -1
  12. package/dist/cjs/ix-dropdown_2.cjs.entry.js +4 -3
  13. package/dist/cjs/ix-dropdown_2.cjs.entry.js.map +1 -1
  14. package/dist/cjs/ix-group_3.cjs.entry.js +33 -11
  15. package/dist/cjs/ix-group_3.cjs.entry.js.map +1 -1
  16. package/dist/cjs/ix-modal_2.cjs.entry.js +17 -5
  17. package/dist/cjs/ix-modal_2.cjs.entry.js.map +1 -1
  18. package/dist/cjs/ix-pagination.cjs.entry.js +17 -9
  19. package/dist/cjs/ix-pagination.cjs.entry.js.map +1 -1
  20. package/dist/cjs/ix-select_2.cjs.entry.js +54 -35
  21. package/dist/cjs/ix-select_2.cjs.entry.js.map +1 -1
  22. package/dist/cjs/ix-toggle.cjs.entry.js +1 -1
  23. package/dist/cjs/ix-toggle.cjs.entry.js.map +1 -1
  24. package/dist/cjs/ix-tooltip.cjs.entry.js +34 -10
  25. package/dist/cjs/ix-tooltip.cjs.entry.js.map +1 -1
  26. package/dist/cjs/ix-workflow-step_2.cjs.entry.js +51 -36
  27. package/dist/cjs/ix-workflow-step_2.cjs.entry.js.map +1 -1
  28. package/dist/cjs/loader.cjs.js +2 -2
  29. package/dist/cjs/loader.cjs.js.map +1 -1
  30. package/dist/cjs/siemens-ix.cjs.js +2 -2
  31. package/dist/cjs/siemens-ix.cjs.js.map +1 -1
  32. package/dist/collection/collection-manifest.json +1 -1
  33. package/dist/collection/components/blind/blind.css +10 -2
  34. package/dist/collection/components/blind/blind.js +12 -5
  35. package/dist/collection/components/blind/blind.js.map +1 -1
  36. package/dist/collection/components/breadcrumb/breadcrumb.css +2 -1
  37. package/dist/collection/components/breadcrumb/breadcrumb.js +5 -1
  38. package/dist/collection/components/breadcrumb/breadcrumb.js.map +1 -1
  39. package/dist/collection/components/category-filter/category-filter.js +17 -3
  40. package/dist/collection/components/category-filter/category-filter.js.map +1 -1
  41. package/dist/collection/components/date-picker/date-picker.css +3 -0
  42. package/dist/collection/components/date-picker/date-picker.js +64 -45
  43. package/dist/collection/components/date-picker/date-picker.js.map +1 -1
  44. package/dist/collection/components/datetime-picker/datetime-picker.css +6 -5
  45. package/dist/collection/components/datetime-picker/datetime-picker.js +1 -1
  46. package/dist/collection/components/datetime-picker/datetime-picker.js.map +1 -1
  47. package/dist/collection/components/dropdown/dropdown.js +2 -1
  48. package/dist/collection/components/dropdown/dropdown.js.map +1 -1
  49. package/dist/collection/components/dropdown-item/dropdown-item.css +0 -1
  50. package/dist/collection/components/dropdown-item/dropdown-item.js +1 -1
  51. package/dist/collection/components/dropdown-item/dropdown-item.js.map +1 -1
  52. package/dist/collection/components/group/group.css +21 -12
  53. package/dist/collection/components/group/group.js +34 -10
  54. package/dist/collection/components/group/group.js.map +1 -1
  55. package/dist/collection/components/group-item/group-item.css +8 -4
  56. package/dist/collection/components/modal/modal.js +6 -1
  57. package/dist/collection/components/modal/modal.js.map +1 -1
  58. package/dist/collection/components/modal-container/modal-container.js +11 -4
  59. package/dist/collection/components/modal-container/modal-container.js.map +1 -1
  60. package/dist/collection/components/pagination/pagination.css +1 -1
  61. package/dist/collection/components/pagination/pagination.js +17 -9
  62. package/dist/collection/components/pagination/pagination.js.map +1 -1
  63. package/dist/collection/components/select/select.css +4 -1
  64. package/dist/collection/components/select/select.js +96 -34
  65. package/dist/collection/components/select/select.js.map +1 -1
  66. package/dist/collection/components/select-item/select-item.css +0 -3
  67. package/dist/collection/components/select-item/select-item.js +1 -1
  68. package/dist/collection/components/select-item/select-item.js.map +1 -1
  69. package/dist/collection/components/toggle/toggle.css +7 -4
  70. package/dist/collection/components/tooltip/tooltip.js +55 -10
  71. package/dist/collection/components/tooltip/tooltip.js.map +1 -1
  72. package/dist/collection/components/utils/a11y.js +10 -0
  73. package/dist/collection/components/utils/a11y.js.map +1 -0
  74. package/dist/collection/components/workflow-step/workflow-step.css +6 -3
  75. package/dist/collection/components/workflow-step/workflow-step.js +45 -6
  76. package/dist/collection/components/workflow-step/workflow-step.js.map +1 -1
  77. package/dist/collection/components/workflow-steps/workflow-steps.css +0 -3
  78. package/dist/collection/components/workflow-steps/workflow-steps.js +48 -39
  79. package/dist/collection/components/workflow-steps/workflow-steps.js.map +1 -1
  80. package/dist/collection/tests/utils/test/page.js +29 -1
  81. package/dist/collection/tests/utils/test/page.js.map +1 -1
  82. package/dist/components/application-header.js +1 -1
  83. package/dist/components/burger-menu.js +1 -1
  84. package/dist/components/button.js +1 -1
  85. package/dist/components/date-picker.js +63 -44
  86. package/dist/components/date-picker.js.map +1 -1
  87. package/dist/components/date-time-card.js +1 -1
  88. package/dist/components/dropdown-item.js +3 -3
  89. package/dist/components/dropdown-item.js.map +1 -1
  90. package/dist/components/dropdown.js +3 -2
  91. package/dist/components/dropdown.js.map +1 -1
  92. package/dist/components/filter-chip.js +1 -1
  93. package/dist/components/group-context-menu.js +1 -1
  94. package/dist/components/group-item.js +2 -2
  95. package/dist/components/group-item.js.map +1 -1
  96. package/dist/components/icon-button.js +1 -1
  97. package/dist/components/icon.js +1 -1
  98. package/dist/components/index-button.js +1 -1
  99. package/dist/components/ix-animated-tab.js +1 -1
  100. package/dist/components/ix-animated-tabs.js +1 -1
  101. package/dist/components/ix-basic-navigation.js +1 -1
  102. package/dist/components/ix-blind.js +26 -7
  103. package/dist/components/ix-blind.js.map +1 -1
  104. package/dist/components/ix-breadcrumb-item.js +1 -1
  105. package/dist/components/ix-breadcrumb.js +7 -3
  106. package/dist/components/ix-breadcrumb.js.map +1 -1
  107. package/dist/components/ix-category-filter.js +18 -4
  108. package/dist/components/ix-category-filter.js.map +1 -1
  109. package/dist/components/ix-chip.js +1 -1
  110. package/dist/components/ix-counter-pill.js +1 -1
  111. package/dist/components/ix-datetime-picker.js +3 -3
  112. package/dist/components/ix-datetime-picker.js.map +1 -1
  113. package/dist/components/ix-divider.js +1 -1
  114. package/dist/components/ix-drawer.js +1 -1
  115. package/dist/components/ix-dropdown-button.js +1 -1
  116. package/dist/components/ix-dropdown-quick-actions.js +1 -1
  117. package/dist/components/ix-event-list-item.js +1 -1
  118. package/dist/components/ix-event-list.js +1 -1
  119. package/dist/components/ix-expanding-search.js +1 -1
  120. package/dist/components/ix-flip-tile-content.js +1 -1
  121. package/dist/components/ix-flip-tile.js +1 -1
  122. package/dist/components/ix-group-dropdown-item.js +1 -1
  123. package/dist/components/ix-group.js +36 -12
  124. package/dist/components/ix-group.js.map +1 -1
  125. package/dist/components/ix-input-group.js +1 -1
  126. package/dist/components/ix-kpi.js +1 -1
  127. package/dist/components/ix-map-navigation.js +1 -1
  128. package/dist/components/ix-menu-about-item.js +1 -1
  129. package/dist/components/ix-menu-about-news.js +1 -1
  130. package/dist/components/ix-menu-about.js +1 -1
  131. package/dist/components/ix-menu-avatar.js +1 -1
  132. package/dist/components/ix-menu-settings-item.js +1 -1
  133. package/dist/components/ix-menu-settings.js +1 -1
  134. package/dist/components/ix-menu.js +1 -1
  135. package/dist/components/ix-message-bar.js +1 -1
  136. package/dist/components/ix-modal-example.js +1 -1
  137. package/dist/components/ix-pagination.js +18 -10
  138. package/dist/components/ix-pagination.js.map +1 -1
  139. package/dist/components/ix-pill.js +1 -1
  140. package/dist/components/ix-split-button-item.js +1 -1
  141. package/dist/components/ix-split-button.js +1 -1
  142. package/dist/components/ix-tile.js +1 -1
  143. package/dist/components/ix-toast-container.js +1 -1
  144. package/dist/components/ix-toggle.js +2 -2
  145. package/dist/components/ix-toggle.js.map +1 -1
  146. package/dist/components/ix-tooltip.js +36 -11
  147. package/dist/components/ix-tooltip.js.map +1 -1
  148. package/dist/components/ix-tree.js +1 -1
  149. package/dist/components/ix-upload.js +1 -1
  150. package/dist/components/ix-validation-tooltip.js +1 -1
  151. package/dist/components/ix-workflow-step.js +10 -4
  152. package/dist/components/ix-workflow-step.js.map +1 -1
  153. package/dist/components/ix-workflow-steps.js +45 -36
  154. package/dist/components/ix-workflow-steps.js.map +1 -1
  155. package/dist/components/luxon.js +3077 -3835
  156. package/dist/components/luxon.js.map +1 -1
  157. package/dist/components/map-navigation-overlay.js +1 -1
  158. package/dist/components/menu-avatar-item.js +1 -1
  159. package/dist/components/menu-item.js +1 -1
  160. package/dist/components/modal-container.js +12 -5
  161. package/dist/components/modal-container.js.map +1 -1
  162. package/dist/components/modal.js +7 -2
  163. package/dist/components/modal.js.map +1 -1
  164. package/dist/components/my-component.js +1 -1
  165. package/dist/components/select-item.js +3 -3
  166. package/dist/components/select-item.js.map +1 -1
  167. package/dist/components/select.js +55 -34
  168. package/dist/components/select.js.map +1 -1
  169. package/dist/components/spinner.js +1 -1
  170. package/dist/components/tab-item.js +1 -1
  171. package/dist/components/tabs.js +1 -1
  172. package/dist/components/time-picker.js +1 -1
  173. package/dist/components/toast.js +1 -1
  174. package/dist/components/tree-item.js +1 -1
  175. package/dist/components/typography.js +1 -1
  176. package/dist/esm/index-3d163acd.js.map +1 -1
  177. package/dist/esm/ix-blind.entry.js +24 -6
  178. package/dist/esm/ix-blind.entry.js.map +1 -1
  179. package/dist/esm/ix-breadcrumb_2.entry.js +6 -2
  180. package/dist/esm/ix-breadcrumb_2.entry.js.map +1 -1
  181. package/dist/esm/ix-category-filter.entry.js +17 -3
  182. package/dist/esm/ix-category-filter.entry.js.map +1 -1
  183. package/dist/esm/ix-date-picker_2.entry.js +3133 -3872
  184. package/dist/esm/ix-date-picker_2.entry.js.map +1 -1
  185. package/dist/esm/ix-datetime-picker.entry.js +2 -2
  186. package/dist/esm/ix-datetime-picker.entry.js.map +1 -1
  187. package/dist/esm/ix-dropdown_2.entry.js +4 -3
  188. package/dist/esm/ix-dropdown_2.entry.js.map +1 -1
  189. package/dist/esm/ix-group_3.entry.js +33 -11
  190. package/dist/esm/ix-group_3.entry.js.map +1 -1
  191. package/dist/esm/ix-modal_2.entry.js +17 -5
  192. package/dist/esm/ix-modal_2.entry.js.map +1 -1
  193. package/dist/esm/ix-pagination.entry.js +18 -10
  194. package/dist/esm/ix-pagination.entry.js.map +1 -1
  195. package/dist/esm/ix-select_2.entry.js +54 -35
  196. package/dist/esm/ix-select_2.entry.js.map +1 -1
  197. package/dist/esm/ix-toggle.entry.js +1 -1
  198. package/dist/esm/ix-toggle.entry.js.map +1 -1
  199. package/dist/esm/ix-tooltip.entry.js +34 -10
  200. package/dist/esm/ix-tooltip.entry.js.map +1 -1
  201. package/dist/esm/ix-workflow-step_2.entry.js +52 -37
  202. package/dist/esm/ix-workflow-step_2.entry.js.map +1 -1
  203. package/dist/esm/loader.js +2 -2
  204. package/dist/esm/loader.js.map +1 -1
  205. package/dist/esm/siemens-ix.js +2 -2
  206. package/dist/esm/siemens-ix.js.map +1 -1
  207. package/dist/siemens-ix/{p-41f0a2b2.entry.js → p-2ea2fc07.entry.js} +2 -2
  208. package/dist/siemens-ix/{p-41f0a2b2.entry.js.map → p-2ea2fc07.entry.js.map} +1 -1
  209. package/dist/siemens-ix/p-33160fe4.entry.js +2 -0
  210. package/dist/siemens-ix/p-33160fe4.entry.js.map +1 -0
  211. package/dist/siemens-ix/p-4c8d5207.entry.js +2 -0
  212. package/dist/siemens-ix/p-4c8d5207.entry.js.map +1 -0
  213. package/dist/siemens-ix/p-53c69375.entry.js +2 -0
  214. package/dist/siemens-ix/p-53c69375.entry.js.map +1 -0
  215. package/dist/siemens-ix/p-626b3af5.entry.js +2 -0
  216. package/dist/siemens-ix/p-626b3af5.entry.js.map +1 -0
  217. package/dist/siemens-ix/p-663724a8.entry.js +2 -0
  218. package/dist/siemens-ix/p-663724a8.entry.js.map +1 -0
  219. package/dist/siemens-ix/p-78f2b858.entry.js +2 -0
  220. package/dist/siemens-ix/p-78f2b858.entry.js.map +1 -0
  221. package/dist/siemens-ix/p-7fb5fa79.entry.js +2 -0
  222. package/dist/siemens-ix/p-7fb5fa79.entry.js.map +1 -0
  223. package/dist/siemens-ix/p-8fcd6f85.js.map +1 -1
  224. package/dist/siemens-ix/p-b998abe4.entry.js +2 -0
  225. package/dist/siemens-ix/p-b998abe4.entry.js.map +1 -0
  226. package/dist/siemens-ix/{p-24d2d95e.entry.js → p-c9c9f2b5.entry.js} +2 -2
  227. package/dist/siemens-ix/p-c9c9f2b5.entry.js.map +1 -0
  228. package/dist/siemens-ix/p-caae2fa5.entry.js +2 -0
  229. package/dist/siemens-ix/p-caae2fa5.entry.js.map +1 -0
  230. package/dist/siemens-ix/p-dbcf33de.entry.js +2 -0
  231. package/dist/siemens-ix/p-dbcf33de.entry.js.map +1 -0
  232. package/dist/siemens-ix/{p-28f50519.entry.js → p-eb799bdd.entry.js} +2 -2
  233. package/dist/siemens-ix/p-eb799bdd.entry.js.map +1 -0
  234. package/dist/siemens-ix/siemens-ix.css +15 -0
  235. package/dist/siemens-ix/siemens-ix.esm.js +1 -1
  236. package/dist/siemens-ix/siemens-ix.esm.js.map +1 -1
  237. package/dist/types/components/blind/blind.d.ts +1 -0
  238. package/dist/types/components/category-filter/category-filter.d.ts +1 -0
  239. package/dist/types/components/date-picker/date-picker.d.ts +7 -6
  240. package/dist/types/components/group/group.d.ts +4 -0
  241. package/dist/types/components/modal/modal.d.ts +1 -0
  242. package/dist/types/components/modal-container/modal-container.d.ts +1 -0
  243. package/dist/types/components/pagination/pagination.d.ts +2 -0
  244. package/dist/types/components/select/select.d.ts +17 -1
  245. package/dist/types/components/time-picker/time-picker.d.ts +3 -3
  246. package/dist/types/components/tooltip/tooltip.d.ts +8 -0
  247. package/dist/types/components/utils/a11y.d.ts +1 -0
  248. package/dist/types/components/workflow-step/workflow-step.d.ts +9 -1
  249. package/dist/types/components/workflow-steps/workflow-steps.d.ts +6 -2
  250. package/dist/types/components.d.ts +49 -9
  251. package/dist/types/tests/utils/test/page.d.ts +5 -0
  252. package/loader/index.d.ts +1 -1
  253. package/package.json +7 -8
  254. package/scss/components/_forms.scss +6 -0
  255. package/dist/siemens-ix/p-01f9f803.entry.js +0 -2
  256. package/dist/siemens-ix/p-01f9f803.entry.js.map +0 -1
  257. package/dist/siemens-ix/p-030078b4.entry.js +0 -2
  258. package/dist/siemens-ix/p-030078b4.entry.js.map +0 -1
  259. package/dist/siemens-ix/p-1701b127.entry.js +0 -2
  260. package/dist/siemens-ix/p-1701b127.entry.js.map +0 -1
  261. package/dist/siemens-ix/p-24d2d95e.entry.js.map +0 -1
  262. package/dist/siemens-ix/p-28f50519.entry.js.map +0 -1
  263. package/dist/siemens-ix/p-446a0a3f.entry.js +0 -2
  264. package/dist/siemens-ix/p-446a0a3f.entry.js.map +0 -1
  265. package/dist/siemens-ix/p-58ef1328.entry.js +0 -2
  266. package/dist/siemens-ix/p-58ef1328.entry.js.map +0 -1
  267. package/dist/siemens-ix/p-6facc3cc.entry.js +0 -2
  268. package/dist/siemens-ix/p-6facc3cc.entry.js.map +0 -1
  269. package/dist/siemens-ix/p-73f7ef87.entry.js +0 -2
  270. package/dist/siemens-ix/p-73f7ef87.entry.js.map +0 -1
  271. package/dist/siemens-ix/p-a4178e26.entry.js +0 -2
  272. package/dist/siemens-ix/p-a4178e26.entry.js.map +0 -1
  273. package/dist/siemens-ix/p-a92126b5.entry.js +0 -2
  274. package/dist/siemens-ix/p-a92126b5.entry.js.map +0 -1
  275. package/dist/siemens-ix/p-b64e82ce.entry.js +0 -2
  276. package/dist/siemens-ix/p-b64e82ce.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"date-picker.js","mappings":"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","names":["Info","DateTime"],"sources":["./src/components/date-picker/date-picker.scss?tag=ix-date-picker&encapsulation=scoped","./src/components/date-picker/date-picker.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\n:host {\n .header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .selector {\n flex-basis: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: $tiny-space $default-space;\n\n .dropdown {\n color: var(--theme-menu-item--color);\n font-size: 14px;\n line-height: 20px;\n }\n\n .fontSize {\n font-size: 16px;\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .arrowYear {\n display: flex;\n position: relative;\n padding: $medium-space $x-large-space;\n align-items: center;\n cursor: pointer;\n\n &:hover {\n background-color: var(--theme-select-list-item--background--hover);\n }\n\n &.selected {\n background-color: var(--theme-select-list-item--background--selected);\n }\n\n .arrowPosition {\n position: absolute;\n left: calc(($x-large-space / 2) - 6px);\n top: calc(50% - 6px);\n }\n\n .checkPosition {\n position: absolute;\n left: calc(($x-large-space / 2) - 6px);\n top: calc(50% - 8px);\n }\n\n .monthMargin {\n margin-left: 10px;\n }\n }\n }\n\n .wrapper {\n display: flex;\n\n .overflow {\n overflow-y: scroll;\n max-height: 250px;\n }\n }\n\n .grid {\n display: grid;\n grid-template-columns: repeat(8, 40px);\n grid-template-rows: repeat(7, 40px);\n align-items: center;\n justify-items: center;\n justify-content: center;\n color: var(--theme-datepicker-today--color);\n\n .calendar-item {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: var(--theme-datepicker-day--background);\n border: 1px solid var(--theme-datepicker-day--background);\n width: 40px;\n height: 40px;\n cursor: pointer;\n\n &.today {\n border: 1px solid var(--theme-datepicker-today--border-color);\n\n &:hover {\n background-color: var(--theme-datepicker-day--background--hover);\n }\n\n &:active {\n background-color: var(--theme-datepicker-day--background--active);\n }\n\n &.selected {\n box-shadow: inset 0 0 0 1px white;\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--selected-hover\n );\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--selected-active\n );\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(\n --theme-datepicker-day--background--selected-disabled\n );\n border: 1px solid\n var(--theme-datepicker-day--background--selected-disabled);\n color: var(--theme-datepicker-day--color--selected-disabled);\n }\n }\n\n &.range {\n background-color: var(--theme-datepicker-day--background--range);\n color: var(--theme-datepicker-day--color--range);\n border: 1px solid var(--theme-datepicker-today--border-color--range);\n box-shadow: inset 0 0 0 1px white;\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--range-hover\n );\n border: 1px solid\n var(--theme-datepicker-today--border-color--range-hover);\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--range-active\n );\n border: 1px solid\n var(--theme-datepicker-today--border-color--range-active);\n }\n\n &.disabled {\n background-color: var(\n --theme-datepicker-day--background--range-disabled\n );\n color: var(--theme-datepicker-day--color--range-disabled);\n border: 1px solid\n var(--theme-datepicker-today--border-color--range-disabled);\n }\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(--theme-datepicker-day--background--disabled);\n color: var(--theme-datepicker-day--color--disabled);\n cursor: default;\n pointer-events: none;\n }\n }\n\n &:hover {\n background-color: var(--theme-datepicker-day--background--hover);\n }\n\n &:active {\n background-color: var(--theme-datepicker-day--background--active);\n }\n\n &.selected {\n background-color: var(--theme-datepicker-day--background--selected);\n color: var(--theme-datepicker-day--color--selected);\n border: 1px solid var(--theme-datepicker-day--background--selected);\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--selected-hover\n );\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--selected-active\n );\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(\n --theme-datepicker-day--background--selected-disabled\n );\n color: var(--theme-datepicker-day--color--selected-disabled);\n }\n }\n\n &.range {\n background-color: var(--theme-datepicker-day--background--range);\n color: var(--theme-datepicker-day--color--range);\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--range-hover\n );\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--range-active\n );\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(\n --theme-datepicker-day--background--range-disabled\n );\n color: var(--theme-datepicker-day--color--range-disabled);\n }\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(--theme-datepicker-day--background--disabled);\n color: var(--theme-datepicker-day--color--disabled);\n }\n\n &.week-day {\n color: var(--theme-datepicker-weekday--color);\n font-size: 12px;\n line-height: 20px;\n border: none;\n background: none;\n cursor: initial;\n }\n\n &.empty-day {\n border: none;\n background: none;\n cursor: initial;\n }\n\n &.week-number {\n font-size: 10px;\n line-height: 14px;\n color: var(--theme-datepicker-ix--color);\n border: none;\n background: none;\n cursor: initial;\n }\n\n &:focus-visible {\n background-color: var(--theme-datepicker-day--background--selected);\n border: inset 1px solid\n var(--theme-datepicker-day--border-color--selected);\n color: var(--theme-datepicker-day--color--selected);\n font-size: 14px;\n line-height: 20px;\n letter-spacing: 0;\n }\n }\n }\n\n .button {\n display: flex;\n justify-content: flex-end;\n }\n\n .hidden {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { DateTime, Info, MonthNumbers } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nexport type DateChangeEvent = {\n from: string;\n to: string;\n};\n\nexport type LegacyDateChangeEvent = DateChangeEvent | string;\n\nexport type DateTimeCorners = DateTimeCardCorners;\n\n@Component({\n tag: 'ix-date-picker',\n styleUrl: 'date-picker.scss',\n scoped: true,\n})\nexport class DatePicker {\n private daysInWeek = 7;\n private dayNames = Info.weekdays();\n private monthNames = Info.months();\n\n /**\n * Date format string.\n * See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens.\n */\n @Prop() format: string = 'yyyy/LL/dd';\n\n /**\n * If true a range of dates can be selected.\n */\n @Prop() range: boolean = true;\n\n /**\n * @deprecated Will be removed in 2.0.0\n */\n @Prop() individual: boolean = true;\n\n /**\n * Corner style\n */\n @Prop() corners: DateTimeCardCorners = 'rounded';\n\n /**\n * Picker date. If the picker is in range mode this property is the start date.\n *\n * Format is based on `format`\n *\n * @since 1.1.0\n */\n @Prop() from: string = DateTime.now().toFormat(this.format);\n\n /**\n * Picker date. If the picker is in range mode this property is the end date.\n * If the picker is not in range mode leave this value `null`\n *\n * Format is based on `format`\n *\n * @since 1.1.0\n */\n @Prop() to: string | null = null;\n\n /**\n * The earliest date that can be selected by the date picker.\n * If not set there will be no restriction.\n *\n * @since 1.1.0\n */\n @Prop() minDate: string;\n\n /**\n * The latest date that can be selected by the date picker.\n * If not set there will be no restriction.\n *\n * @since 1.1.0\n */\n @Prop() maxDate: string;\n\n /**\n * Default behavior of the done event is to join the two events (date and time) into one combined string output.\n * This combination can be configured over the delimiter\n *\n * @since 1.1.0\n */\n @Prop() eventDelimiter = ' - ';\n\n /**\n * Text of date select button\n *\n * @since 1.1.0\n */\n @Prop() textSelectDate = 'Done';\n\n @State() yearValue = this.year;\n @State() today = DateTime.now();\n @State() monthValue: number = this.month;\n @State() calendar: [number, number[]][] = [];\n\n @State() years = [...Array(10).keys()].map((year) => year + this.year - 5);\n @State() tempYear: number = this.yearValue;\n @State() tempMonth: number = this.monthValue;\n @State() start: DateTime = DateTime.fromObject({\n year: this.year,\n month: this.month,\n day: this.day,\n });\n\n @State() end: DateTime = this.to\n ? DateTime.fromFormat(this.to, this.format)\n : null;\n\n @State() dropdownButtonRef: HTMLElement;\n @State() yearContainerRef: HTMLElement;\n\n /**\n * Date change event\n *\n * If datepicker is in range mode the event detail will be sperated with a `-` e.g.\n * `2022/10/22 - 2022/10/24` (start and end). If range mode is choosen consider to use `dateRangeChange`.\n *\n * @deprecated String output will be removed. Set ´doneEventDelimiter´ to undefined or null to get date change object instead of a string\n */\n @Event() dateChange: EventEmitter<LegacyDateChangeEvent>;\n\n /**\n * Date range change.\n * Only triggered if datepicker is in range mode\n *\n * @since 1.1.0\n */\n @Event() dateRangeChange: EventEmitter<DateChangeEvent>;\n\n /**\n * Date selection confirmed via button action\n *\n * @deprecated Will be removed in 2.0.0. Use `dateSelect`\n */\n @Event() done: EventEmitter<string>;\n\n /**\n * Date selection confirmed via button action\n *\n * @since 1.1.0\n */\n @Event() dateSelect: EventEmitter<DateChangeEvent>;\n\n get year() {\n return DateTime.fromFormat(this.from, this.format).year;\n }\n\n get day() {\n return DateTime.fromFormat(this.from, this.format).day;\n }\n\n get month() {\n return DateTime.fromFormat(this.from, this.format).month;\n }\n\n private onDone() {\n this.done.emit(this.getOutputFormat());\n\n this.dateSelect.emit({\n from: this.start?.toFormat(this.format),\n to: this.end?.toFormat(this.format),\n });\n }\n\n private onDateChange() {\n if (this.eventDelimiter) {\n this.dateChange.emit(this.getOutputFormat());\n } else {\n this.dateChange.emit({\n from: this.start?.toFormat(this.format),\n to: this.end?.toFormat(this.format),\n });\n }\n\n if (this.range) {\n this.dateRangeChange.emit({\n from: this.start?.toFormat(this.format),\n to: this.end?.toFormat(this.format),\n });\n }\n }\n\n private getStartOfMonth(\n year = DateTime.local().get('year'),\n month = DateTime.local().get('month')\n ) {\n return DateTime.local(year, month).startOf('month');\n }\n\n private getEndOfMonth(\n year = DateTime.local().get('year'),\n month = DateTime.local().get('month')\n ) {\n return DateTime.local(year, month).endOf('month');\n }\n\n private getDaysInMonth(\n start = this.getStartOfMonth(),\n end = this.getEndOfMonth()\n ) {\n return Math.ceil(end.diff(start, 'days').days);\n }\n\n private calculateCalendar() {\n const start = this.getStartOfMonth(this.yearValue, this.monthValue);\n const end = this.getEndOfMonth(this.yearValue, this.monthValue);\n const totalDays = this.getDaysInMonth(start, end);\n const totalWeeks = 6;\n const totalDaysInWeeks = totalWeeks * this.daysInWeek;\n const startWeekDay = start.weekday;\n const prependDays = startWeekDay - 1;\n const appendDays = totalDaysInWeeks - totalDays - prependDays;\n let weekdays: number[][] = [];\n const calendar: [number, number[]][] = [];\n\n // create list of days\n let days = [...new Array(totalDaysInWeeks).keys()].map((day) => day + 1);\n\n // add start empty days\n days.unshift(...new Array(prependDays));\n\n // remove & add end days\n days = days.slice(0, days.length - prependDays - appendDays);\n days.push(...new Array(appendDays));\n\n // make weeks\n weekdays = days.reduce((result, item, index) => {\n const weekIndex = Math.floor(index / this.daysInWeek);\n\n if (!result[weekIndex]) result[weekIndex] = [];\n\n result[weekIndex].push(item);\n\n return result;\n }, []);\n\n for (let index = 1; index <= totalWeeks; index++) {\n const week = weekdays[index - 1];\n const firstWeekDay = week.find((day) => day !== undefined);\n const weekNumber = firstWeekDay\n ? DateTime.local(\n this.yearValue,\n this.monthValue,\n weekdays[index - 1][0]\n ).weekNumber\n : undefined;\n calendar.push([weekNumber, week]);\n }\n\n this.calendar = calendar;\n }\n\n private changeMonth(number) {\n if (this.monthValue + number < 1) {\n this.yearValue--;\n this.monthValue = 12;\n } else if (this.monthValue + number > 12) {\n this.yearValue++;\n this.monthValue = 1;\n } else {\n this.monthValue += number;\n }\n this.calculateCalendar();\n }\n\n private selectMonth(month: MonthNumbers) {\n this.monthValue = month;\n this.yearValue = this.tempYear;\n this.tempMonth = month;\n }\n\n private infiniteScrollYears() {\n const scroll = this.yearContainerRef.scrollTop;\n const maxScroll = this.yearContainerRef.scrollHeight;\n const atTop = scroll === 0;\n const atBottom =\n scroll + this.yearContainerRef.getBoundingClientRect().height ===\n maxScroll;\n const limit = 200;\n\n if (this.years.length > limit) return;\n\n if (atTop) {\n this.years = [\n ...[...Array(5).keys()].map((year) => year + this.years[0] - 5),\n ...this.years,\n ];\n this.yearContainerRef.scroll({ behavior: 'smooth', top: scroll + 100 });\n }\n\n if (atBottom) {\n this.years = [\n ...this.years,\n ...[...Array(5).keys()].map(\n (year) => year + this.years[this.years.length - 1]\n ),\n ];\n this.yearContainerRef.scroll({ behavior: 'smooth', top: scroll - 50 });\n }\n }\n\n private selectTempYear(event: MouseEvent, year: number) {\n event.stopPropagation();\n this.tempYear = year;\n }\n\n private todayClass(day: number) {\n const today = DateTime.local();\n const daaay = DateTime.local(this.yearValue, this.monthValue, day);\n const isToday = Math.ceil(daaay.diff(today, 'days').days) === 0;\n return {\n 'calendar-item': true,\n 'empty-day': day === undefined,\n today: isToday,\n selected:\n (this.start && daaay.toISO() === this.start.toISO()) ||\n (this.end && daaay.toISO() === this.end.toISO()),\n range:\n this.start &&\n this.end &&\n daaay.toISO() > this.start.toISO() &&\n daaay.toISO() < this.end.toISO(),\n disabled:\n !this.isWithinMinMax(daaay) ||\n (this.start &&\n daaay.toISO() < this.start.toISO() &&\n this.end === null &&\n this.range),\n };\n }\n\n private selectDay(day: number) {\n const date = DateTime.local(this.yearValue, this.monthValue, day);\n const isNotDay = day === undefined;\n const isFirstDay = this.start === null;\n const isLastDay = this.end === null;\n const isPeriod = this.start !== null && this.end !== null;\n const isStartBeforeEnd = this.start && this.start.toISO() < date.toISO();\n const isSameDay =\n this.start && !this.end && this.start.toISO() === date.toISO();\n\n if (isNotDay) return;\n\n if (isSameDay) {\n this.start = null;\n this.onDateChange();\n return;\n }\n\n if (!this.range) {\n this.start = date;\n }\n\n if (this.range && isFirstDay) {\n this.start = date;\n }\n\n if (this.range && isLastDay && isStartBeforeEnd) {\n this.end = date;\n }\n\n if (this.range && isPeriod) {\n this.start = date;\n this.end = null;\n }\n\n this.onDateChange();\n }\n\n private getOutputFormat() {\n if (!this.start) {\n return null;\n }\n\n if (!this.end) {\n return this.start.toFormat(this.format);\n }\n\n return [\n this.start.toFormat(this.format),\n this.end.toFormat(this.format),\n ].join(this.eventDelimiter);\n }\n\n private isWithinMinMax(date: DateTime) {\n const dateIso = date.toISO();\n const _minDate = this.minDate\n ? DateTime.fromFormat(this.minDate, this.format)\n : null;\n const _maxDate = this.maxDate\n ? DateTime.fromFormat(this.maxDate, this.format)\n : null;\n return (\n (!_minDate || _minDate.toISO() <= dateIso) &&\n (!_maxDate || _maxDate.toISO() >= dateIso)\n );\n }\n\n componentWillLoad() {\n if (this.year !== null) {\n this.yearValue = this.year;\n }\n if (this.month) {\n this.monthValue = this.month;\n }\n }\n\n componentWillRender() {\n this.calculateCalendar();\n }\n\n /**\n * Get the current DateTime\n */\n @Method()\n async getCurrentDate() {\n return {\n start: this.start?.toFormat(this.format),\n end: this.end?.toFormat(this.format),\n };\n }\n\n render() {\n return (\n <Host>\n <ix-date-time-card individual={this.individual} corners={this.corners}>\n <div class=\"header\" slot=\"header\">\n <ix-icon-button\n onClick={() => this.changeMonth(-1)}\n ghost\n icon=\"chevron-left\"\n variant=\"Primary\"\n class=\"arrows\"\n ></ix-icon-button>\n\n <div class=\"selector\">\n <ix-button ghost ref={(ref) => (this.dropdownButtonRef = ref)}>\n <span class=\"fontSize capitalize\">\n {this.monthNames[this.monthValue - 1]} {this.yearValue}\n </span>\n </ix-button>\n <ix-dropdown\n class=\"dropdown\"\n trigger={this.dropdownButtonRef}\n placement=\"bottom\"\n >\n <div class=\"wrapper\">\n <div\n class=\"overflow\"\n onScroll={() => this.infiniteScrollYears()}\n ref={(ref) => (this.yearContainerRef = ref)}\n >\n {this.years.map((year) => (\n <div\n class={{ arrowYear: true }}\n onClick={(event) => this.selectTempYear(event, year)}\n >\n <ix-icon\n class={{\n hidden: this.tempYear !== year,\n arrowPosition: true,\n }}\n name=\"chevron-right\"\n size=\"12\"\n ></ix-icon>\n <div\n style={{ 'min-width': 'max-content' }}\n >{`${year}`}</div>\n </div>\n ))}\n </div>\n <div class=\"overflow\">\n {this.monthNames.map((month, index) => (\n <div\n class={{\n arrowYear: true,\n selected: this.tempMonth - 1 === index,\n }}\n onClick={() =>\n this.selectMonth((index + 1) as MonthNumbers)\n }\n >\n <ix-icon\n class={{\n hidden: this.tempMonth - 1 !== index,\n checkPosition: true,\n }}\n name=\"single-check\"\n size=\"16\"\n ></ix-icon>\n <div>\n <span\n class={{ capitalize: true, monthMargin: true }}\n >{`${month} ${this.tempYear}`}</span>\n </div>\n </div>\n ))}\n </div>\n </div>\n </ix-dropdown>\n </div>\n\n <ix-icon-button\n onClick={() => this.changeMonth(1)}\n ghost\n icon=\"chevron-right\"\n variant=\"Primary\"\n class=\"arrows\"\n ></ix-icon-button>\n </div>\n\n <div class=\"grid\">\n <div class=\"calendar-item week-day\"></div>\n {this.dayNames.map((name) => (\n <div class=\"calendar-item week-day\">{name.slice(0, 3)}</div>\n ))}\n\n {this.calendar.map((week) => {\n return (\n <Fragment>\n <div class=\"calendar-item week-number\">{week[0]}</div>\n {week[1].map((day) => (\n <div\n class={this.todayClass(day)}\n onClick={() => this.selectDay(day)}\n >\n {day}\n </div>\n ))}\n </Fragment>\n );\n })}\n </div>\n\n <div class={{ button: true, hidden: !this.individual }}>\n <ix-button onClick={() => this.onDone()}>\n {this.textSelectDate}\n </ix-button>\n </div>\n </ix-date-time-card>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"date-picker.js","mappings":"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","names":["Info","DateTime"],"sources":["./src/components/date-picker/date-picker.scss?tag=ix-date-picker&encapsulation=scoped","./src/components/date-picker/date-picker.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\n:host {\n ix-date-time-card {\n display: inline-block;\n }\n\n .header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .selector {\n flex-basis: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: $tiny-space $default-space;\n\n .dropdown {\n color: var(--theme-menu-item--color);\n font-size: 14px;\n line-height: 20px;\n }\n\n .fontSize {\n font-size: 16px;\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .arrowYear {\n display: flex;\n position: relative;\n padding: $medium-space $x-large-space;\n align-items: center;\n cursor: pointer;\n\n &:hover {\n background-color: var(--theme-select-list-item--background--hover);\n }\n\n &.selected {\n background-color: var(--theme-select-list-item--background--selected);\n }\n\n .arrowPosition {\n position: absolute;\n left: calc(($x-large-space / 2) - 6px);\n top: calc(50% - 6px);\n }\n\n .checkPosition {\n position: absolute;\n left: calc(($x-large-space / 2) - 6px);\n top: calc(50% - 8px);\n }\n\n .monthMargin {\n margin-left: 10px;\n }\n }\n }\n\n .wrapper {\n display: flex;\n\n .overflow {\n overflow-y: scroll;\n max-height: 250px;\n }\n }\n\n .grid {\n display: grid;\n grid-template-columns: repeat(8, 40px);\n grid-template-rows: repeat(7, 40px);\n align-items: center;\n justify-items: center;\n justify-content: center;\n color: var(--theme-datepicker-today--color);\n\n .calendar-item {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: var(--theme-datepicker-day--background);\n border: 1px solid var(--theme-datepicker-day--background);\n width: 40px;\n height: 40px;\n cursor: pointer;\n\n &.today {\n border: 1px solid var(--theme-datepicker-today--border-color);\n\n &:hover {\n background-color: var(--theme-datepicker-day--background--hover);\n }\n\n &:active {\n background-color: var(--theme-datepicker-day--background--active);\n }\n\n &.selected {\n box-shadow: inset 0 0 0 1px white;\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--selected-hover\n );\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--selected-active\n );\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(\n --theme-datepicker-day--background--selected-disabled\n );\n border: 1px solid\n var(--theme-datepicker-day--background--selected-disabled);\n color: var(--theme-datepicker-day--color--selected-disabled);\n }\n }\n\n &.range {\n background-color: var(--theme-datepicker-day--background--range);\n color: var(--theme-datepicker-day--color--range);\n border: 1px solid var(--theme-datepicker-today--border-color--range);\n box-shadow: inset 0 0 0 1px white;\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--range-hover\n );\n border: 1px solid\n var(--theme-datepicker-today--border-color--range-hover);\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--range-active\n );\n border: 1px solid\n var(--theme-datepicker-today--border-color--range-active);\n }\n\n &.disabled {\n background-color: var(\n --theme-datepicker-day--background--range-disabled\n );\n color: var(--theme-datepicker-day--color--range-disabled);\n border: 1px solid\n var(--theme-datepicker-today--border-color--range-disabled);\n }\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(--theme-datepicker-day--background--disabled);\n color: var(--theme-datepicker-day--color--disabled);\n cursor: default;\n pointer-events: none;\n }\n }\n\n &:hover {\n background-color: var(--theme-datepicker-day--background--hover);\n }\n\n &:active {\n background-color: var(--theme-datepicker-day--background--active);\n }\n\n &.selected {\n background-color: var(--theme-datepicker-day--background--selected);\n color: var(--theme-datepicker-day--color--selected);\n border: 1px solid var(--theme-datepicker-day--background--selected);\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--selected-hover\n );\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--selected-active\n );\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(\n --theme-datepicker-day--background--selected-disabled\n );\n color: var(--theme-datepicker-day--color--selected-disabled);\n }\n }\n\n &.range {\n background-color: var(--theme-datepicker-day--background--range);\n color: var(--theme-datepicker-day--color--range);\n\n &:hover {\n background-color: var(\n --theme-datepicker-day--background--range-hover\n );\n }\n\n &:active {\n background-color: var(\n --theme-datepicker-day--background--range-active\n );\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(\n --theme-datepicker-day--background--range-disabled\n );\n color: var(--theme-datepicker-day--color--range-disabled);\n }\n }\n\n &.disabled {\n pointer-events: none;\n background-color: var(--theme-datepicker-day--background--disabled);\n color: var(--theme-datepicker-day--color--disabled);\n }\n\n &.week-day {\n color: var(--theme-datepicker-weekday--color);\n font-size: 12px;\n line-height: 20px;\n border: none;\n background: none;\n cursor: initial;\n }\n\n &.empty-day {\n border: none;\n background: none;\n cursor: initial;\n }\n\n &.week-number {\n font-size: 10px;\n line-height: 14px;\n color: var(--theme-datepicker-ix--color);\n border: none;\n background: none;\n cursor: initial;\n }\n\n &:focus-visible {\n background-color: var(--theme-datepicker-day--background--selected);\n border: inset 1px solid\n var(--theme-datepicker-day--border-color--selected);\n color: var(--theme-datepicker-day--color--selected);\n font-size: 14px;\n line-height: 20px;\n letter-spacing: 0;\n }\n }\n }\n\n .button {\n display: flex;\n justify-content: flex-end;\n }\n\n .hidden {\n display: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Event,\n EventEmitter,\n Fragment,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { DateTime, Info, MonthNumbers } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\n\nexport type DateChangeEvent = {\n from: string;\n to: string;\n};\n\nexport type LegacyDateChangeEvent = DateChangeEvent | string;\n\nexport type DateTimeCorners = DateTimeCardCorners;\n\n@Component({\n tag: 'ix-date-picker',\n styleUrl: 'date-picker.scss',\n scoped: true,\n})\nexport class DatePicker {\n private daysInWeek = 7;\n private dayNames = Info.weekdays();\n private monthNames = Info.months();\n\n /**\n * Date format string.\n * See @link https://moment.github.io/luxon/#/formatting?id=table-of-tokens for all available tokens.\n */\n @Prop() format: string = 'yyyy/LL/dd';\n\n /**\n * If true a range of dates can be selected.\n */\n @Prop() range: boolean = true;\n\n /**\n * @deprecated Will be removed in 2.0.0\n */\n @Prop() individual: boolean = true;\n\n /**\n * Corner style\n */\n @Prop() corners: DateTimeCardCorners = 'rounded';\n\n /**\n * Picker date. If the picker is in range mode this property is the start date.\n * If set to `null` no default start date will be pre-selected.\n *\n * Format is based on `format`\n *\n * @since 1.1.0\n */\n @Prop() from: string | null = DateTime.now().toFormat(this.format);\n\n /**\n * Picker date. If the picker is in range mode this property is the end date.\n * If the picker is not in range mode leave this value `null`\n *\n * Format is based on `format`\n *\n * @since 1.1.0\n */\n @Prop() to: string | null = null;\n\n /**\n * The earliest date that can be selected by the date picker.\n * If not set there will be no restriction.\n *\n * @since 1.1.0\n */\n @Prop() minDate: string;\n\n /**\n * The latest date that can be selected by the date picker.\n * If not set there will be no restriction.\n *\n * @since 1.1.0\n */\n @Prop() maxDate: string;\n\n /**\n * Default behavior of the done event is to join the two events (date and time) into one combined string output.\n * This combination can be configured over the delimiter\n *\n * @since 1.1.0\n */\n @Prop() eventDelimiter = ' - ';\n\n /**\n * Text of date select button\n *\n * @since 1.1.0\n */\n @Prop() textSelectDate = 'Done';\n\n @State() yearValue = this.year;\n @State() today = DateTime.now();\n @State() monthValue: number = this.month;\n @State() calendar: [number, number[]][] = [];\n\n @State() years = [...Array(10).keys()].map((year) => year + this.year - 5);\n @State() tempYear: number = this.yearValue;\n @State() tempMonth: number = this.monthValue;\n @State() start: DateTime = DateTime.fromObject({\n year: this.year,\n month: this.month,\n day: this.day,\n });\n\n @State() end: DateTime = this.to\n ? DateTime.fromFormat(this.to, this.format)\n : null;\n\n @State() dropdownButtonRef: HTMLElement;\n @State() yearContainerRef: HTMLElement;\n\n /**\n * Date change event\n *\n * If datepicker is in range mode the event detail will be sperated with a `-` e.g.\n * `2022/10/22 - 2022/10/24` (start and end). If range mode is chosen consider to use `dateRangeChange`.\n *\n * @deprecated String output will be removed. Set ´doneEventDelimiter´ to undefined or null to get date change object instead of a string\n */\n @Event() dateChange: EventEmitter<LegacyDateChangeEvent>;\n\n /**\n * Date range change.\n * Only triggered if datepicker is in range mode\n *\n * @since 1.1.0\n */\n @Event() dateRangeChange: EventEmitter<DateChangeEvent>;\n\n /**\n * Date selection confirmed via button action\n *\n * @deprecated Will be removed in 2.0.0. Use `dateSelect`\n */\n @Event() done: EventEmitter<string>;\n\n /**\n * Date selection confirmed via button action\n *\n * @since 1.1.0\n */\n @Event() dateSelect: EventEmitter<DateChangeEvent>;\n\n get year() {\n if (this.from !== null) {\n return DateTime.fromFormat(this.from, this.format).year;\n }\n\n return DateTime.now().year;\n }\n\n get day() {\n if (this.from !== null) {\n return DateTime.fromFormat(this.from, this.format).day;\n }\n\n return null;\n }\n\n get month() {\n if (this.from !== null) {\n return DateTime.fromFormat(this.from, this.format).month;\n }\n\n return DateTime.now().month;\n }\n\n private onDone() {\n this.done.emit(this.getOutputFormat());\n\n this.dateSelect.emit({\n from: this.start?.toFormat(this.format),\n to: this.end?.toFormat(this.format),\n });\n }\n\n private onDateChange() {\n const from = this.start?.toFormat(this.format);\n const to = this.end?.toFormat(this.format);\n\n this.from = from;\n this.to = to;\n\n if (this.eventDelimiter) {\n this.dateChange.emit(this.getOutputFormat());\n } else {\n this.dateChange.emit({\n from,\n to,\n });\n }\n\n if (this.range) {\n this.dateRangeChange.emit({\n from,\n to,\n });\n }\n }\n\n private getStartOfMonth(\n year = DateTime.local().get('year'),\n month = DateTime.local().get('month')\n ) {\n return DateTime.local(year, month).startOf('month');\n }\n\n private getEndOfMonth(\n year = DateTime.local().get('year'),\n month = DateTime.local().get('month')\n ) {\n return DateTime.local(year, month).endOf('month');\n }\n\n private getDaysInMonth(\n start = this.getStartOfMonth(),\n end = this.getEndOfMonth()\n ) {\n return Math.ceil(end.diff(start, 'days').days);\n }\n\n private calculateCalendar() {\n const start = this.getStartOfMonth(this.yearValue, this.monthValue);\n const end = this.getEndOfMonth(this.yearValue, this.monthValue);\n const totalDays = this.getDaysInMonth(start, end);\n const totalWeeks = 6;\n const totalDaysInWeeks = totalWeeks * this.daysInWeek;\n const startWeekDay = start.weekday;\n const prependDays = startWeekDay - 1;\n const appendDays = totalDaysInWeeks - totalDays - prependDays;\n let weekdays: number[][] = [];\n const calendar: [number, number[]][] = [];\n\n // create list of days\n let days = [...new Array(totalDaysInWeeks).keys()].map((day) => day + 1);\n\n // add start empty days\n days.unshift(...new Array(prependDays));\n\n // remove & add end days\n days = days.slice(0, days.length - prependDays - appendDays);\n days.push(...new Array(appendDays));\n\n // make weeks\n weekdays = days.reduce((result, item, index) => {\n const weekIndex = Math.floor(index / this.daysInWeek);\n\n if (!result[weekIndex]) result[weekIndex] = [];\n\n result[weekIndex].push(item);\n\n return result;\n }, []);\n\n for (let index = 1; index <= totalWeeks; index++) {\n const week = weekdays[index - 1];\n const firstWeekDay = week.find((day) => day !== undefined);\n const weekNumber = firstWeekDay\n ? DateTime.local(\n this.yearValue,\n this.monthValue,\n weekdays[index - 1][0]\n ).weekNumber\n : undefined;\n calendar.push([weekNumber, week]);\n }\n\n this.calendar = calendar;\n }\n\n private changeMonth(number) {\n if (this.monthValue + number < 1) {\n this.yearValue--;\n this.monthValue = 12;\n } else if (this.monthValue + number > 12) {\n this.yearValue++;\n this.monthValue = 1;\n } else {\n this.monthValue += number;\n }\n this.calculateCalendar();\n }\n\n private selectMonth(month: MonthNumbers) {\n this.monthValue = month;\n this.yearValue = this.tempYear;\n this.tempMonth = month;\n }\n\n private infiniteScrollYears() {\n const scroll = this.yearContainerRef.scrollTop;\n const maxScroll = this.yearContainerRef.scrollHeight;\n const atTop = scroll === 0;\n const atBottom =\n scroll + this.yearContainerRef.getBoundingClientRect().height ===\n maxScroll;\n const limit = 200;\n\n if (this.years.length > limit) return;\n\n if (atTop) {\n this.years = [\n ...[...Array(5).keys()].map((year) => year + this.years[0] - 5),\n ...this.years,\n ];\n this.yearContainerRef.scroll({ behavior: 'smooth', top: scroll + 100 });\n }\n\n if (atBottom) {\n this.years = [\n ...this.years,\n ...[...Array(5).keys()].map(\n (year) => year + this.years[this.years.length - 1]\n ),\n ];\n this.yearContainerRef.scroll({ behavior: 'smooth', top: scroll - 50 });\n }\n }\n\n private selectTempYear(event: MouseEvent, year: number) {\n event.stopPropagation();\n this.tempYear = year;\n }\n\n private getDayClasses(day: number) {\n if (!day) {\n return;\n }\n\n const todayLocal = DateTime.local();\n const dayLocal = DateTime.local(this.yearValue, this.monthValue, day);\n const dayIso = dayLocal.toISO();\n const startIso = this.start?.toISO();\n const endIso = this.end?.toISO();\n const isToday = Math.ceil(dayLocal.diff(todayLocal, 'days').days) === 0;\n\n return {\n 'calendar-item': true,\n 'empty-day': day === undefined,\n today: isToday,\n selected:\n (this.start && dayIso === startIso) || (this.end && dayIso === endIso),\n range: this.start && this.end && dayIso > startIso && dayIso < endIso,\n disabled: !this.isWithinMinMax(dayLocal),\n };\n }\n\n private selectDay(day: number) {\n const date = DateTime.local(this.yearValue, this.monthValue, day);\n const isStartBeforeEnd = this.start && this.start.toISO() < date.toISO();\n const isSameDay =\n this.start && !this.end && this.start.toISO() === date.toISO();\n\n if (day === undefined) return;\n\n if (isSameDay) {\n this.start = null;\n this.onDateChange();\n return;\n }\n\n if (this.range) {\n if (this.start === null) {\n this.start = date;\n } else if (this.end === null) {\n if (isStartBeforeEnd) {\n this.end = date;\n } else {\n this.end = this.start;\n this.start = date;\n }\n } else {\n this.start = date;\n this.end = null;\n }\n } else {\n this.start = date;\n }\n\n this.onDateChange();\n }\n\n private getOutputFormat() {\n if (!this.start) {\n return null;\n }\n\n if (!this.end) {\n return this.start.toFormat(this.format);\n }\n\n return [\n this.start.toFormat(this.format),\n this.end.toFormat(this.format),\n ].join(this.eventDelimiter);\n }\n\n private isWithinMinMax(date: DateTime) {\n const dateIso = date.toISO();\n const _minDate = this.minDate\n ? DateTime.fromFormat(this.minDate, this.format)\n : null;\n const _maxDate = this.maxDate\n ? DateTime.fromFormat(this.maxDate, this.format)\n : null;\n return (\n (!_minDate || _minDate.toISO() <= dateIso) &&\n (!_maxDate || _maxDate.toISO() >= dateIso)\n );\n }\n\n componentWillLoad() {\n if (this.from === null) {\n this.start = null;\n }\n\n if (this.year !== null) {\n this.yearValue = this.year;\n }\n if (this.month) {\n this.monthValue = this.month;\n }\n }\n\n componentWillRender() {\n this.calculateCalendar();\n }\n\n /**\n * Get the current DateTime\n */\n @Method()\n async getCurrentDate() {\n return {\n start: this.start?.toFormat(this.format),\n end: this.end?.toFormat(this.format),\n };\n }\n\n render() {\n return (\n <Host>\n <ix-date-time-card individual={this.individual} corners={this.corners}>\n <div class=\"header\" slot=\"header\">\n <ix-icon-button\n onClick={() => this.changeMonth(-1)}\n ghost\n icon=\"chevron-left\"\n variant=\"Primary\"\n class=\"arrows\"\n ></ix-icon-button>\n\n <div class=\"selector\">\n <ix-button ghost ref={(ref) => (this.dropdownButtonRef = ref)}>\n <span class=\"fontSize capitalize\">\n {this.monthNames[this.monthValue - 1]} {this.yearValue}\n </span>\n </ix-button>\n <ix-dropdown\n class=\"dropdown\"\n trigger={this.dropdownButtonRef}\n placement=\"bottom\"\n >\n <div class=\"wrapper\">\n <div\n class=\"overflow\"\n onScroll={() => this.infiniteScrollYears()}\n ref={(ref) => (this.yearContainerRef = ref)}\n >\n {this.years.map((year) => (\n <div\n key={year}\n class={{ arrowYear: true }}\n onClick={(event) => this.selectTempYear(event, year)}\n >\n <ix-icon\n class={{\n hidden: this.tempYear !== year,\n arrowPosition: true,\n }}\n name=\"chevron-right\"\n size=\"12\"\n ></ix-icon>\n <div\n style={{ 'min-width': 'max-content' }}\n >{`${year}`}</div>\n </div>\n ))}\n </div>\n <div class=\"overflow\">\n {this.monthNames.map((month, index) => (\n <div\n key={month}\n class={{\n arrowYear: true,\n selected: this.tempMonth - 1 === index,\n }}\n onClick={() =>\n this.selectMonth((index + 1) as MonthNumbers)\n }\n >\n <ix-icon\n class={{\n hidden: this.tempMonth - 1 !== index,\n checkPosition: true,\n }}\n name=\"single-check\"\n size=\"16\"\n ></ix-icon>\n <div>\n <span\n class={{ capitalize: true, monthMargin: true }}\n >{`${month} ${this.tempYear}`}</span>\n </div>\n </div>\n ))}\n </div>\n </div>\n </ix-dropdown>\n </div>\n\n <ix-icon-button\n onClick={() => this.changeMonth(1)}\n ghost\n icon=\"chevron-right\"\n variant=\"Primary\"\n class=\"arrows\"\n ></ix-icon-button>\n </div>\n\n <div class=\"grid\">\n <div class=\"calendar-item week-day\"></div>\n {this.dayNames.map((name) => (\n <div key={name} class=\"calendar-item week-day\">\n {name.slice(0, 3)}\n </div>\n ))}\n\n {this.calendar.map((week) => {\n return (\n <Fragment>\n <div class=\"calendar-item week-number\">{week[0]}</div>\n {week[1].map((day) => (\n <div\n key={day}\n class={this.getDayClasses(day)}\n onClick={() => this.selectDay(day)}\n >\n {day}\n </div>\n ))}\n </Fragment>\n );\n })}\n </div>\n\n <div class={{ button: true, hidden: !this.individual }}>\n <ix-button onClick={() => this.onDone()}>\n {this.textSelectDate}\n </ix-button>\n </div>\n </ix-date-time-card>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
2
2
 
3
3
  const dateTimeCardCss = ".card.sc-ix-date-time-card{background-color:var(--theme-menu--background);width:100%;box-shadow:none;border:none;border-radius:unset}.card.individual.sc-ix-date-time-card{box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 12px 18px 0px rgba(0, 0, 0, 0.1);border:1px solid var(--theme-menu--border-color);border-radius:4px}.card.left.sc-ix-date-time-card{border-radius:4px 0 0 4px;height:100%}.card.right.sc-ix-date-time-card{border-radius:0 4px 4px 0;height:100%}.card.sc-ix-date-time-card .header.sc-ix-date-time-card{padding:1rem}.card.sc-ix-date-time-card .separator.sc-ix-date-time-card{border:1px solid var(--theme-datepicker-separator--background);width:100%}.card.sc-ix-date-time-card .content.sc-ix-date-time-card{height:100%;padding:0px 1rem 1rem 1rem}";
4
4
 
5
- const DateTimeCard = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
5
+ const DateTimeCard = /*@__PURE__*/ proxyCustomElement(class DateTimeCard extends HTMLElement {
6
6
  constructor() {
7
7
  super();
8
8
  this.__registerHost();
@@ -1,9 +1,9 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
2
  import { d as defineCustomElement$1 } from './icon.js';
3
3
 
4
- const dropdownItemCss = ".sc-ix-dropdown-item-h{display:block;min-width:10rem}.icon-only.sc-ix-dropdown-item-h{min-width:0}.icon-only.sc-ix-dropdown-item-h .dropdown-item.sc-ix-dropdown-item>.glyph.sc-ix-dropdown-item{-webkit-margin-end:0;margin-inline-end:0}.icon-only.sc-ix-dropdown-item-h .dropdown-item.sc-ix-dropdown-item{padding:0.25rem 0.5rem}.icon-only.sc-ix-dropdown-item-h .dropdown-item.sc-ix-dropdown-item:not(.disabled):not(:disabled):focus-visible{border-color:#199fff}.sc-ix-dropdown-item-h .sc-ix-dropdown-item:focus{background-color:transparent;color:var(--theme-menu-item--color)}.sc-ix-dropdown-item-h .checkmark.sc-ix-dropdown-item{position:absolute;left:0.5rem}.checked.sc-ix-dropdown-item-h{background-color:var(--theme-select-list-item--background--selected)}.sc-ix-dropdown-item-h .label.sc-ix-dropdown-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.disabled.sc-ix-dropdown-item-h{pointer-events:none}.sc-ix-dropdown-item-s>ix-icon{-webkit-margin-start:auto;margin-inline-start:auto}";
4
+ const dropdownItemCss = ".sc-ix-dropdown-item-h{display:block}.icon-only.sc-ix-dropdown-item-h{min-width:0}.icon-only.sc-ix-dropdown-item-h .dropdown-item.sc-ix-dropdown-item>.glyph.sc-ix-dropdown-item{-webkit-margin-end:0;margin-inline-end:0}.icon-only.sc-ix-dropdown-item-h .dropdown-item.sc-ix-dropdown-item{padding:0.25rem 0.5rem}.icon-only.sc-ix-dropdown-item-h .dropdown-item.sc-ix-dropdown-item:not(.disabled):not(:disabled):focus-visible{border-color:#199fff}.sc-ix-dropdown-item-h .sc-ix-dropdown-item:focus{background-color:transparent;color:var(--theme-menu-item--color)}.sc-ix-dropdown-item-h .checkmark.sc-ix-dropdown-item{position:absolute;left:0.5rem}.checked.sc-ix-dropdown-item-h{background-color:var(--theme-select-list-item--background--selected)}.sc-ix-dropdown-item-h .label.sc-ix-dropdown-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.disabled.sc-ix-dropdown-item-h{pointer-events:none}.sc-ix-dropdown-item-s>ix-icon{-webkit-margin-start:auto;margin-inline-start:auto}";
5
5
 
6
- const DropdownItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
+ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends HTMLElement {
7
7
  constructor() {
8
8
  super();
9
9
  this.__registerHost();
@@ -30,7 +30,7 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
30
30
  'dropdown-item': true,
31
31
  hover: this.hover,
32
32
  disabled: this.disabled,
33
- }, onClick: () => this.emitItemClick() }, this.checked ? (h("ix-icon", { class: "checkmark", name: "single-check", size: "16" })) : null, this.icon ? (h("span", { class: {
33
+ }, onClick: () => this.emitItemClick(), tabindex: 0 }, this.checked ? (h("ix-icon", { class: "checkmark", name: "single-check", size: "16" })) : null, this.icon ? (h("span", { class: {
34
34
  glyph: true,
35
35
  [`glyph-${this.icon}`]: true,
36
36
  disabled: this.disabled,
@@ -1 +1 @@
1
- {"file":"dropdown-item.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,y+BAAy+B;;MCyBp/B,YAAY;;;;;;;iBAgBP,KAAK;oBAKF,KAAK;mBAKN,KAAK;;;;;EAWvB,MAAM,aAAa;IACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GACvC;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,OAAO,EAAE,IAAI,CAAC,OAAO;QACrB,WAAW,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;QAChE,WAAW,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;QAChE,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,IAED,cACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE;QACL,eAAe,EAAE,IAAI;QACrB,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,IAElC,IAAI,CAAC,OAAO,IACX,eAAS,KAAK,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAW,IACjE,IAAI,EAEP,IAAI,CAAC,IAAI,IACR,YACE,KAAK,EAAE;QACL,KAAK,EAAE,IAAI;QACX,CAAC,SAAS,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;QAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,GACK,IACN,IAAI,EAEP,IAAI,CAAC,KAAK,GAAG,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,GAAG,IAAI,EAC5D,eAAa,CACN,CACJ,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/dropdown-item/dropdown-item.scss?tag=ix-dropdown-item&encapsulation=scoped","./src/components/dropdown-item/dropdown-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 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: block;\n min-width: 10rem;\n\n &.icon-only {\n min-width: 0;\n\n .dropdown-item > .glyph {\n margin-inline-end: 0;\n }\n\n .dropdown-item {\n padding: $tiny-space $small-space;\n\n @include focus-visible {\n border-color: #199fff;\n }\n }\n }\n\n :focus {\n background-color: transparent;\n color: var(--theme-menu-item--color);\n }\n\n .checkmark {\n position: absolute;\n left: $small-space;\n }\n\n &.checked {\n background-color: var(--theme-select-list-item--background--selected);\n }\n\n .label {\n @include ellipsis;\n }\n\n &.disabled {\n pointer-events: none;\n }\n}\n\n::slotted(ix-icon) {\n margin-inline-start: auto;\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 Method,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-dropdown-item',\n styleUrl: 'dropdown-item.scss',\n scoped: true,\n})\nexport class DropdownItem {\n @Element() hostElement!: HTMLIxDropdownItemElement;\n\n /**\n * Label of dropdown item\n */\n @Prop() label: string;\n\n /**\n * Icon of dropdown item\n */\n @Prop() icon: string;\n\n /**\n * Display hover state\n */\n @Prop() hover = false;\n\n /**\n * Disable item and remove event listeners\n */\n @Prop() disabled = false;\n\n /**\n * Whether the item is checked or not. If true a checkmark will mark the item as checked.\n */\n @Prop() checked = false;\n\n /**\n * Click on item\n */\n @Event() itemClick: EventEmitter<HTMLIxDropdownItemElement>;\n\n /**\n * Internal usage only\n */\n @Method()\n async emitItemClick() {\n this.itemClick.emit(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n checked: this.checked,\n 'icon-text': this.label !== undefined && this.icon !== undefined,\n 'icon-only': this.label === undefined && this.icon !== undefined,\n disabled: this.disabled,\n }}\n >\n <button\n type=\"button\"\n class={{\n 'dropdown-item': true,\n hover: this.hover,\n disabled: this.disabled,\n }}\n onClick={() => this.emitItemClick()}\n >\n {this.checked ? (\n <ix-icon class=\"checkmark\" name=\"single-check\" size=\"16\"></ix-icon>\n ) : null}\n\n {this.icon ? (\n <span\n class={{\n glyph: true,\n [`glyph-${this.icon}`]: true,\n disabled: this.disabled,\n }}\n ></span>\n ) : null}\n\n {this.label ? <span class=\"label\">{this.label}</span> : null}\n <slot></slot>\n </button>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"dropdown-item.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,y9BAAy9B;;MCyBp+B,YAAY;;;;;;;iBAgBP,KAAK;oBAKF,KAAK;mBAKN,KAAK;;;;;EAWvB,MAAM,aAAa;IACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GACvC;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,OAAO,EAAE,IAAI,CAAC,OAAO;QACrB,WAAW,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;QAChE,WAAW,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;QAChE,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,IAED,cACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE;QACL,eAAe,EAAE,IAAI;QACrB,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,EACnC,QAAQ,EAAE,CAAC,IAEV,IAAI,CAAC,OAAO,IACX,eAAS,KAAK,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAW,IACjE,IAAI,EAEP,IAAI,CAAC,IAAI,IACR,YACE,KAAK,EAAE;QACL,KAAK,EAAE,IAAI;QACX,CAAC,SAAS,IAAI,CAAC,IAAI,EAAE,GAAG,IAAI;QAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ;OACxB,GACK,IACN,IAAI,EAEP,IAAI,CAAC,KAAK,GAAG,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,GAAG,IAAI,EAC5D,eAAa,CACN,CACJ,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/dropdown-item/dropdown-item.scss?tag=ix-dropdown-item&encapsulation=scoped","./src/components/dropdown-item/dropdown-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 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: block;\n\n &.icon-only {\n min-width: 0;\n\n .dropdown-item > .glyph {\n margin-inline-end: 0;\n }\n\n .dropdown-item {\n padding: $tiny-space $small-space;\n\n @include focus-visible {\n border-color: #199fff;\n }\n }\n }\n\n :focus {\n background-color: transparent;\n color: var(--theme-menu-item--color);\n }\n\n .checkmark {\n position: absolute;\n left: $small-space;\n }\n\n &.checked {\n background-color: var(--theme-select-list-item--background--selected);\n }\n\n .label {\n @include ellipsis;\n }\n\n &.disabled {\n pointer-events: none;\n }\n}\n\n::slotted(ix-icon) {\n margin-inline-start: auto;\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 Method,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-dropdown-item',\n styleUrl: 'dropdown-item.scss',\n scoped: true,\n})\nexport class DropdownItem {\n @Element() hostElement!: HTMLIxDropdownItemElement;\n\n /**\n * Label of dropdown item\n */\n @Prop() label: string;\n\n /**\n * Icon of dropdown item\n */\n @Prop() icon: string;\n\n /**\n * Display hover state\n */\n @Prop() hover = false;\n\n /**\n * Disable item and remove event listeners\n */\n @Prop() disabled = false;\n\n /**\n * Whether the item is checked or not. If true a checkmark will mark the item as checked.\n */\n @Prop() checked = false;\n\n /**\n * Click on item\n */\n @Event() itemClick: EventEmitter<HTMLIxDropdownItemElement>;\n\n /**\n * Internal usage only\n */\n @Method()\n async emitItemClick() {\n this.itemClick.emit(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n checked: this.checked,\n 'icon-text': this.label !== undefined && this.icon !== undefined,\n 'icon-only': this.label === undefined && this.icon !== undefined,\n disabled: this.disabled,\n }}\n >\n <button\n type=\"button\"\n class={{\n 'dropdown-item': true,\n hover: this.hover,\n disabled: this.disabled,\n }}\n onClick={() => this.emitItemClick()}\n tabindex={0}\n >\n {this.checked ? (\n <ix-icon class=\"checkmark\" name=\"single-check\" size=\"16\"></ix-icon>\n ) : null}\n\n {this.icon ? (\n <span\n class={{\n glyph: true,\n [`glyph-${this.icon}`]: true,\n disabled: this.disabled,\n }}\n ></span>\n ) : null}\n\n {this.label ? <span class=\"label\">{this.label}</span> : null}\n <slot></slot>\n </button>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@ import { f as flip, i as inline, s as shift, o as offset, a as autoUpdate, c as
3
3
 
4
4
  const dropdownCss = ".dropup,.dropend,.dropdown,.dropstart,.dropup-center,.dropdown-center{position:relative}.dropdown-toggle{white-space:nowrap}.dropdown-toggle::after{display:inline-block;margin-left:0.255em;vertical-align:0.255em;content:\"\";border-top:0.3em solid;border-right:0.3em solid transparent;border-bottom:0;border-left:0.3em solid transparent}.dropdown-toggle:empty::after{margin-left:0}.dropdown-menu{--bs-dropdown-zindex:1000;--bs-dropdown-min-width:10rem;--bs-dropdown-padding-x:0;--bs-dropdown-padding-y:0.5rem;--bs-dropdown-spacer:0.125rem;--bs-dropdown-font-size:1rem;--bs-dropdown-color:#212529;--bs-dropdown-bg:#fff;--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-border-radius:0.375rem;--bs-dropdown-border-width:1px;--bs-dropdown-inner-border-radius:calc(0.375rem - 1px);--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y:0.5rem;--bs-dropdown-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-dropdown-link-color:#212529;--bs-dropdown-link-hover-color:#1e2125;--bs-dropdown-link-hover-bg:#e9ecef;--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:#adb5bd;--bs-dropdown-item-padding-x:1rem;--bs-dropdown-item-padding-y:0.25rem;--bs-dropdown-header-color:#6c757d;--bs-dropdown-header-padding-x:1rem;--bs-dropdown-header-padding-y:0.5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}.dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}.dropdown-menu-start{--bs-position:start}.dropdown-menu-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-end{--bs-position:end}.dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media (min-width: 576px){.dropdown-menu-sm-start{--bs-position:start}.dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-sm-end{--bs-position:end}.dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media (min-width: 768px){.dropdown-menu-md-start{--bs-position:start}.dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-md-end{--bs-position:end}.dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media (min-width: 992px){.dropdown-menu-lg-start{--bs-position:start}.dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-lg-end{--bs-position:end}.dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media (min-width: 1200px){.dropdown-menu-xl-start{--bs-position:start}.dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xl-end{--bs-position:end}.dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media (min-width: 1400px){.dropdown-menu-xxl-start{--bs-position:start}.dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xxl-end{--bs-position:end}.dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}.dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}.dropup .dropdown-toggle::after{display:inline-block;margin-left:0.255em;vertical-align:0.255em;content:\"\";border-top:0;border-right:0.3em solid transparent;border-bottom:0.3em solid;border-left:0.3em solid transparent}.dropup .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}.dropend .dropdown-toggle::after{display:inline-block;margin-left:0.255em;vertical-align:0.255em;content:\"\";border-top:0.3em solid transparent;border-right:0;border-bottom:0.3em solid transparent;border-left:0.3em solid}.dropend .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-toggle::after{vertical-align:0}.dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}.dropstart .dropdown-toggle::after{display:inline-block;margin-left:0.255em;vertical-align:0.255em;content:\"\"}.dropstart .dropdown-toggle::after{display:none}.dropstart .dropdown-toggle::before{display:inline-block;margin-right:0.255em;vertical-align:0.255em;content:\"\";border-top:0.3em solid transparent;border-right:0.3em solid;border-bottom:0.3em solid transparent}.dropstart .dropdown-toggle:empty::after{margin-left:0}.dropstart .dropdown-toggle::before{vertical-align:0}.dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}.dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0}.dropdown-item:hover,.dropdown-item:focus{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}.dropdown-item.active,.dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:transparent}.dropdown-menu.show{display:block}.dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:0.875rem;color:var(--bs-dropdown-header-color);white-space:nowrap}.dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}.dropdown-menu-dark{--bs-dropdown-color:#dee2e6;--bs-dropdown-bg:#343a40;--bs-dropdown-border-color:var(--bs-border-color-translucent);--bs-dropdown-link-color:#dee2e6;--bs-dropdown-link-hover-color:#fff;--bs-dropdown-divider-bg:var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg:rgba(255, 255, 255, 0.15);--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-active-bg:#0d6efd;--bs-dropdown-link-disabled-color:#adb5bd;--bs-dropdown-header-color:#adb5bd}.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 150ms;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{-webkit-margin-start:0.5rem;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)}.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{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);-webkit-margin-end:0.5rem;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}:host{min-width:0px}:host(.overflow){max-height:50vh;overflow-y:auto}";
5
5
 
6
- const Dropdown = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
+ const Dropdown = /*@__PURE__*/ proxyCustomElement(class Dropdown extends HTMLElement {
7
7
  constructor() {
8
8
  super();
9
9
  this.__registerHost();
@@ -205,7 +205,8 @@ const Dropdown = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
205
205
  positionConfig.placement = 'right-start';
206
206
  }
207
207
  if (this.placement.includes('auto') || isSubmenu) {
208
- positionConfig.middleware.push(flip());
208
+ positionConfig.middleware.push(flip({ fallbackStrategy: 'initialPlacement' }));
209
+ positionConfig.placement = 'bottom-start';
209
210
  }
210
211
  else {
211
212
  positionConfig.placement = this.placement;
@@ -1 +1 @@
1
- {"file":"dropdown.js","mappings":"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","names":[],"sources":["./src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","./src/components/dropdown/dropdown.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 '~bootstrap/scss/functions';\n@import 'common-variables';\n@import '~bootstrap/scss/variables';\n@import '~bootstrap/scss/mixins';\n@import '~bootstrap/scss/dropdown';\n\n@import 'mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'components/dropdown';\n\n:host {\n min-width: 0px;\n}\n\n:host(.overflow) {\n max-height: 50vh;\n overflow-y: auto;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { BasePlacement, Placement, PlacementWithAlignment } from './placement';\n\n/**\n * @internal\n */\nexport type DropdownTriggerEvent = 'click' | 'hover' | 'focus';\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /**\n * Show dropdown\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n */\n @Prop() trigger: string | HTMLElement;\n\n /**\n * Define an anchor element\n */\n @Prop() anchor: string | HTMLElement;\n\n /**\n * Close behavior\n */\n @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: Placement = 'bottom-start';\n\n /**\n * Position strategy\n */\n @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n /**\n * Adjust dropdown width to the parent width\n * @deprecated Will be removed in 2.0.0. Property has a typo use `adjustDropdownWidthToReferenceWidth` instead.\n */\n @Prop() adjustDropdownWidthToReferenceWith = false;\n\n /**\n * Adjust dropdown width to the parent width\n *\n * @deprecated Will be removed. Not used anymore\n */\n @Prop() adjustDropdownWidthToReferenceWidth = false;\n\n /**\n * An optional header shown at the top of the dropdown\n */\n @Prop() header?: string;\n\n /**\n * Move dropdown along main axis of alignment\n *\n * @internal\n */\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /**\n * Define one or more events to open dropdown\n * @internal\n */\n @Prop() triggerEvent: DropdownTriggerEvent | DropdownTriggerEvent[] = 'click';\n\n /**\n * @internal\n */\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /**\n * Fire event after visibility of dropdown has changed\n */\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n\n private toggleBind: any;\n private openBind: any;\n\n constructor() {\n this.toggleBind = this.toggle.bind(this);\n this.openBind = this.open.bind(this);\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n private addEventListenersFor(triggerEvent: DropdownTriggerEvent) {\n switch (triggerEvent) {\n case 'click':\n if (this.closeBehavior === 'outside') {\n this.triggerElement.addEventListener('click', this.openBind);\n } else {\n this.triggerElement.addEventListener('click', this.toggleBind);\n }\n break;\n\n case 'hover':\n this.triggerElement.addEventListener('mouseenter', this.openBind);\n break;\n\n case 'focus':\n this.triggerElement.addEventListener('focusin', this.openBind);\n break;\n }\n }\n\n private removeEventListenersFor(\n triggerEvent: DropdownTriggerEvent,\n triggerElement: Element\n ) {\n switch (triggerEvent) {\n case 'click':\n if (this.closeBehavior === 'outside') {\n triggerElement.removeEventListener('click', this.openBind);\n } else {\n triggerElement.removeEventListener('click', this.toggleBind);\n }\n break;\n\n case 'hover':\n triggerElement.removeEventListener('mouseenter', this.openBind);\n break;\n\n case 'focus':\n triggerElement.removeEventListener('focusin', this.openBind);\n break;\n }\n }\n\n private async registerListener(element: string | HTMLElement) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n if (Array.isArray(this.triggerEvent)) {\n this.triggerEvent.forEach((triggerEvent) => {\n this.addEventListenersFor(triggerEvent);\n });\n } else {\n this.addEventListenersFor(this.triggerEvent);\n }\n }\n }\n\n private async unregisterListener(element: string | HTMLElement) {\n const trigger = await this.resolveElement(element);\n if (Array.isArray(this.triggerEvent)) {\n this.triggerEvent.forEach((triggerEvent) => {\n this.removeEventListenersFor(triggerEvent, trigger);\n });\n } else {\n this.removeEventListenersFor(this.triggerEvent, trigger);\n }\n }\n\n private resolveElement(element: string | HTMLElement): Promise<Element> {\n if (typeof element !== 'string') {\n return Promise.resolve(element);\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n }\n }\n\n @Watch('trigger')\n changedTrigger(\n newTriggerValue: string | HTMLElement,\n oldTriggerValue: string | HTMLElement\n ) {\n if (newTriggerValue) {\n this.registerListener(newTriggerValue);\n }\n\n if (oldTriggerValue) {\n this.unregisterListener(oldTriggerValue);\n }\n }\n\n @Listen('click', {\n target: 'window',\n })\n clickOutside(event: Event) {\n const target = event.target as HTMLElement;\n\n if (\n this.show === false ||\n this.closeBehavior === false ||\n this.anchorElement?.contains(target) ||\n this.triggerElement?.contains(target)\n ) {\n return;\n }\n\n switch (this.closeBehavior) {\n case 'outside':\n if (!this.dropdownRef.contains(target)) {\n this.close();\n }\n break;\n case 'inside':\n if (this.dropdownRef.contains(target) && this.hostElement !== target) {\n this.close();\n }\n break;\n case 'both':\n if (this.hostElement !== target) this.close();\n break;\n default:\n this.close();\n }\n }\n\n private isNestedDropdown(element: Element) {\n return element.closest('ix-dropdown');\n }\n\n private isAnchorSubmenu() {\n const anchor = this.anchorElement?.closest('ix-dropdown-item');\n if (!anchor) {\n return false;\n }\n\n return true;\n }\n\n private toggle(event?: Event) {\n event?.preventDefault();\n\n if (this.isNestedDropdown(event.target as HTMLElement)) {\n event?.stopPropagation();\n }\n\n this.show = !this.show;\n this.showChanged.emit(this.show);\n }\n\n private open(event?: Event) {\n event?.preventDefault();\n\n if (this.isNestedDropdown(event.target as HTMLElement)) {\n event?.stopPropagation();\n }\n\n this.show = true;\n this.showChanged.emit(true);\n }\n\n private close(event?: Event) {\n if (event?.defaultPrevented) {\n return;\n }\n\n this.show = false;\n this.showChanged.emit(false);\n }\n\n private async applyDropdownPosition() {\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (isSubmenu) {\n positionConfig.placement = 'right-start';\n }\n\n if (this.placement.includes('auto') || isSubmenu) {\n positionConfig.middleware.push(flip());\n } else {\n positionConfig.placement = this.placement as\n | BasePlacement\n | PlacementWithAlignment;\n }\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n async componentDidLoad() {\n if (this.trigger) {\n this.registerListener(this.trigger);\n }\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n }\n\n disconnectedCallback() {\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n /**\n * Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n >\n <div style={{ display: 'contents' }}>\n {this.header ? <div class=\"dropdown-header\">{this.header}</div> : ''}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"dropdown.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,i+SAAi+S;;MC0Cx+S,QAAQ;EA4FnB;;;;;IAVQ,sBAAiB,GAAe,IAAI,CAAC;gBA5EE,KAAK;;;yBAgBa,MAAM;qBAKxC,cAAc;+BAKO,OAAO;8CAMd,KAAK;+CAOJ,KAAK;;;wBAsBmB,OAAO;;IA0B3E,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GACtC;EAED,IAAI,aAAa;IACf,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC;GAC1E;EAEO,oBAAoB,CAAC,YAAkC;IAC7D,QAAQ,YAAY;MAClB,KAAK,OAAO;QACV,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE;UACpC,IAAI,CAAC,cAAc,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;SAC9D;aAAM;UACL,IAAI,CAAC,cAAc,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;SAChE;QACD,MAAM;MAER,KAAK,OAAO;QACV,IAAI,CAAC,cAAc,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAClE,MAAM;MAER,KAAK,OAAO;QACV,IAAI,CAAC,cAAc,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC/D,MAAM;KACT;GACF;EAEO,uBAAuB,CAC7B,YAAkC,EAClC,cAAuB;IAEvB,QAAQ,YAAY;MAClB,KAAK,OAAO;QACV,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE;UACpC,cAAc,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;SAC5D;aAAM;UACL,cAAc,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;SAC9D;QACD,MAAM;MAER,KAAK,OAAO;QACV,cAAc,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAChE,MAAM;MAER,KAAK,OAAO;QACV,cAAc,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC7D,MAAM;KACT;GACF;EAEO,MAAM,gBAAgB,CAAC,OAA6B;IAC1D,IAAI,CAAC,cAAc,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;IACzD,IAAI,IAAI,CAAC,cAAc,EAAE;MACvB,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;QACpC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,YAAY;UACrC,IAAI,CAAC,oBAAoB,CAAC,YAAY,CAAC,CAAC;SACzC,CAAC,CAAC;OACJ;WAAM;QACL,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;OAC9C;KACF;GACF;EAEO,MAAM,kBAAkB,CAAC,OAA6B;IAC5D,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;IACnD,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;MACpC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,YAAY;QACrC,IAAI,CAAC,uBAAuB,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC;OACrD,CAAC,CAAC;KACJ;SAAM;MACL,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC;KAC1D;GACF;EAEO,cAAc,CAAC,OAA6B;IAClD,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE;MAC/B,OAAO,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;KACjC;IAED,MAAM,QAAQ,GAAG,IAAI,OAAO,EAAE,CAAC;IAC/B,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO;MACzB,IAAI,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;QACpC,OAAO,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC;OAClD;MAED,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC;QACpC,IAAI,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;UACpC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC;UAC1C,QAAQ,CAAC,UAAU,EAAE,CAAC;SACvB;OACF,CAAC,CAAC;MAEH,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,EAAE;QAC9B,SAAS,EAAE,IAAI;QACf,OAAO,EAAE,IAAI;OACd,CAAC,CAAC;KACJ,CAAC,CAAC;GACJ;EAGD,MAAM,WAAW,CAAC,OAAgB;IAChC,IAAI,OAAO,EAAE;MACX,IAAI,CAAC,aAAa,GAAG,OAAO,IAAI,CAAC,MAAM;UACnC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC;UAChC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;MAEvC,IAAI,IAAI,CAAC,aAAa,EAAE;QACtB,IAAI,CAAC,qBAAqB,EAAE,CAAC;OAC9B;KACF;GACF;EAGD,cAAc,CACZ,eAAqC,EACrC,eAAqC;IAErC,IAAI,eAAe,EAAE;MACnB,IAAI,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;KACxC;IAED,IAAI,eAAe,EAAE;MACnB,IAAI,CAAC,kBAAkB,CAAC,eAAe,CAAC,CAAC;KAC1C;GACF;EAKD,YAAY,CAAC,KAAY;;IACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;IAE3C,IACE,IAAI,CAAC,IAAI,KAAK,KAAK;MACnB,IAAI,CAAC,aAAa,KAAK,KAAK;OAC5B,MAAA,IAAI,CAAC,aAAa,0CAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;OACpC,MAAA,IAAI,CAAC,cAAc,0CAAE,QAAQ,CAAC,MAAM,CAAC,CAAA,EACrC;MACA,OAAO;KACR;IAED,QAAQ,IAAI,CAAC,aAAa;MACxB,KAAK,SAAS;QACZ,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;UACtC,IAAI,CAAC,KAAK,EAAE,CAAC;SACd;QACD,MAAM;MACR,KAAK,QAAQ;QACX,IAAI,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,WAAW,KAAK,MAAM,EAAE;UACpE,IAAI,CAAC,KAAK,EAAE,CAAC;SACd;QACD,MAAM;MACR,KAAK,MAAM;QACT,IAAI,IAAI,CAAC,WAAW,KAAK,MAAM;UAAE,IAAI,CAAC,KAAK,EAAE,CAAC;QAC9C,MAAM;MACR;QACE,IAAI,CAAC,KAAK,EAAE,CAAC;KAChB;GACF;EAEO,gBAAgB,CAAC,OAAgB;IACvC,OAAO,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;GACvC;EAEO,eAAe;;IACrB,MAAM,MAAM,GAAG,MAAA,IAAI,CAAC,aAAa,0CAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IAC/D,IAAI,CAAC,MAAM,EAAE;MACX,OAAO,KAAK,CAAC;KACd;IAED,OAAO,IAAI,CAAC;GACb;EAEO,MAAM,CAAC,KAAa;IAC1B,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,cAAc,EAAE,CAAC;IAExB,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,MAAqB,CAAC,EAAE;MACtD,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,eAAe,EAAE,CAAC;KAC1B;IAED,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IACvB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAClC;EAEO,IAAI,CAAC,KAAa;IACxB,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,cAAc,EAAE,CAAC;IAExB,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,MAAqB,CAAC,EAAE;MACtD,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,eAAe,EAAE,CAAC;KAC1B;IAED,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACjB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAC7B;EAEO,KAAK,CAAC,KAAa;IACzB,IAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,gBAAgB,EAAE;MAC3B,OAAO;KACR;IAED,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAClB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC9B;EAEO,MAAM,qBAAqB;IACjC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;MACvB,OAAO;KACR;IACD,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;MACrB,OAAO;KACR;IACD,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IAEzC,IAAI,cAAc,GAAmC;MACnD,QAAQ,EAAE,IAAI,CAAC,mBAAmB;MAClC,UAAU,EAAE,EAAE;KACf,CAAC;IAEF,IAAI,SAAS,EAAE;MACb,cAAc,CAAC,SAAS,GAAG,aAAa,CAAC;KAC1C;IAED,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,SAAS,EAAE;MAChD,cAAc,CAAC,UAAU,CAAC,IAAI,CAC5B,IAAI,CAAC,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,CAAC,CAC/C,CAAC;MACF,cAAc,CAAC,SAAS,GAAG,cAAc,CAAC;KAC3C;SAAM;MACL,cAAc,CAAC,SAAS,GAAG,IAAI,CAAC,SAEN,CAAC;KAC5B;IAED,cAAc,CAAC,UAAU,GAAG;MAC1B,GAAG,cAAc,CAAC,UAAU;MAC5B,MAAM,EAAE;MACR,KAAK,EAAE;KACR,CAAC;IAEF,IAAI,IAAI,CAAC,MAAM,EAAE;MACf,cAAc,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;KACrD;IAED,IAAI,IAAI,CAAC,iBAAiB,EAAE;MAC1B,IAAI,CAAC,iBAAiB,EAAE,CAAC;MACzB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;KAC/B;IACD,IAAI,CAAC,iBAAiB,GAAG,UAAU,CACjC,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,WAAW,EAChB;MACE,MAAM,eAAe,GAAG,MAAM,eAAe,CAC3C,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,WAAW,EAChB,cAAc,CACf,CAAC;MACF,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE;QACpC,GAAG,EAAE,GAAG;QACR,IAAI,EAAE,GAAG;QACT,SAAS,EAAE,aAAa,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,KAAK,CACnE,eAAe,CAAC,CAAC,CAClB,KAAK;OACP,CAAC,CAAC;MACH,IAAI,IAAI,CAAC,sBAAsB,EAAE;QAC/B,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,sBAAsB,CAAC;UACvD,WAAW,EAAE,IAAI,CAAC,WAAW;UAC7B,UAAU,EAAE,IAAI,CAAC,cAA6B;SAC/C,CAAC,CAAC;QAEH,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC;OACvD;KACF,EACD;MACE,cAAc,EAAE,IAAI;MACpB,cAAc,EAAE,IAAI;MACpB,aAAa,EAAE,IAAI;KACpB,CACF,CAAC;GACH;EAED,MAAM,gBAAgB;IACpB,IAAI,IAAI,CAAC,OAAO,EAAE;MAChB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACrC;GACF;EAED,MAAM,kBAAkB;IACtB,MAAM,IAAI,CAAC,qBAAqB,EAAE,CAAC;GACpC;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,iBAAiB,EAAE;MAC1B,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;GACF;;;;EAMD,MAAM,cAAc;IAClB,IAAI,CAAC,qBAAqB,EAAE,CAAC;GAC9B;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,GAAG,EAAE,CAAC,GAAG,MAAM,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,EACtC,KAAK,EAAE;QACL,eAAe,EAAE,IAAI;QACrB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,QAAQ,EAAE,IAAI;OACf,EACD,KAAK,EAAE;QACL,MAAM,EAAE,GAAG;QACX,QAAQ,EAAE,KAAK;QACf,QAAQ,EAAE,IAAI,CAAC,mBAAmB;OACnC,IAED,WAAK,KAAK,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE,IAChC,IAAI,CAAC,MAAM,GAAG,WAAK,KAAK,EAAC,iBAAiB,IAAE,IAAI,CAAC,MAAM,CAAO,GAAG,EAAE,EAEpE,eAAa,CACT,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","./src/components/dropdown/dropdown.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 '~bootstrap/scss/functions';\n@import 'common-variables';\n@import '~bootstrap/scss/variables';\n@import '~bootstrap/scss/mixins';\n@import '~bootstrap/scss/dropdown';\n\n@import 'mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'components/dropdown';\n\n:host {\n min-width: 0px;\n}\n\n:host(.overflow) {\n max-height: 50vh;\n overflow-y: auto;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { BasePlacement, Placement, PlacementWithAlignment } from './placement';\n\n/**\n * @internal\n */\nexport type DropdownTriggerEvent = 'click' | 'hover' | 'focus';\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /**\n * Show dropdown\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n */\n @Prop() trigger: string | HTMLElement;\n\n /**\n * Define an anchor element\n */\n @Prop() anchor: string | HTMLElement;\n\n /**\n * Close behavior\n */\n @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: Placement = 'bottom-start';\n\n /**\n * Position strategy\n */\n @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n /**\n * Adjust dropdown width to the parent width\n * @deprecated Will be removed in 2.0.0. Property has a typo use `adjustDropdownWidthToReferenceWidth` instead.\n */\n @Prop() adjustDropdownWidthToReferenceWith = false;\n\n /**\n * Adjust dropdown width to the parent width\n *\n * @deprecated Will be removed. Not used anymore\n */\n @Prop() adjustDropdownWidthToReferenceWidth = false;\n\n /**\n * An optional header shown at the top of the dropdown\n */\n @Prop() header?: string;\n\n /**\n * Move dropdown along main axis of alignment\n *\n * @internal\n */\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /**\n * Define one or more events to open dropdown\n * @internal\n */\n @Prop() triggerEvent: DropdownTriggerEvent | DropdownTriggerEvent[] = 'click';\n\n /**\n * @internal\n */\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /**\n * Fire event after visibility of dropdown has changed\n */\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n\n private toggleBind: any;\n private openBind: any;\n\n constructor() {\n this.toggleBind = this.toggle.bind(this);\n this.openBind = this.open.bind(this);\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n private addEventListenersFor(triggerEvent: DropdownTriggerEvent) {\n switch (triggerEvent) {\n case 'click':\n if (this.closeBehavior === 'outside') {\n this.triggerElement.addEventListener('click', this.openBind);\n } else {\n this.triggerElement.addEventListener('click', this.toggleBind);\n }\n break;\n\n case 'hover':\n this.triggerElement.addEventListener('mouseenter', this.openBind);\n break;\n\n case 'focus':\n this.triggerElement.addEventListener('focusin', this.openBind);\n break;\n }\n }\n\n private removeEventListenersFor(\n triggerEvent: DropdownTriggerEvent,\n triggerElement: Element\n ) {\n switch (triggerEvent) {\n case 'click':\n if (this.closeBehavior === 'outside') {\n triggerElement.removeEventListener('click', this.openBind);\n } else {\n triggerElement.removeEventListener('click', this.toggleBind);\n }\n break;\n\n case 'hover':\n triggerElement.removeEventListener('mouseenter', this.openBind);\n break;\n\n case 'focus':\n triggerElement.removeEventListener('focusin', this.openBind);\n break;\n }\n }\n\n private async registerListener(element: string | HTMLElement) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n if (Array.isArray(this.triggerEvent)) {\n this.triggerEvent.forEach((triggerEvent) => {\n this.addEventListenersFor(triggerEvent);\n });\n } else {\n this.addEventListenersFor(this.triggerEvent);\n }\n }\n }\n\n private async unregisterListener(element: string | HTMLElement) {\n const trigger = await this.resolveElement(element);\n if (Array.isArray(this.triggerEvent)) {\n this.triggerEvent.forEach((triggerEvent) => {\n this.removeEventListenersFor(triggerEvent, trigger);\n });\n } else {\n this.removeEventListenersFor(this.triggerEvent, trigger);\n }\n }\n\n private resolveElement(element: string | HTMLElement): Promise<Element> {\n if (typeof element !== 'string') {\n return Promise.resolve(element);\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n }\n }\n\n @Watch('trigger')\n changedTrigger(\n newTriggerValue: string | HTMLElement,\n oldTriggerValue: string | HTMLElement\n ) {\n if (newTriggerValue) {\n this.registerListener(newTriggerValue);\n }\n\n if (oldTriggerValue) {\n this.unregisterListener(oldTriggerValue);\n }\n }\n\n @Listen('click', {\n target: 'window',\n })\n clickOutside(event: Event) {\n const target = event.target as HTMLElement;\n\n if (\n this.show === false ||\n this.closeBehavior === false ||\n this.anchorElement?.contains(target) ||\n this.triggerElement?.contains(target)\n ) {\n return;\n }\n\n switch (this.closeBehavior) {\n case 'outside':\n if (!this.dropdownRef.contains(target)) {\n this.close();\n }\n break;\n case 'inside':\n if (this.dropdownRef.contains(target) && this.hostElement !== target) {\n this.close();\n }\n break;\n case 'both':\n if (this.hostElement !== target) this.close();\n break;\n default:\n this.close();\n }\n }\n\n private isNestedDropdown(element: Element) {\n return element.closest('ix-dropdown');\n }\n\n private isAnchorSubmenu() {\n const anchor = this.anchorElement?.closest('ix-dropdown-item');\n if (!anchor) {\n return false;\n }\n\n return true;\n }\n\n private toggle(event?: Event) {\n event?.preventDefault();\n\n if (this.isNestedDropdown(event.target as HTMLElement)) {\n event?.stopPropagation();\n }\n\n this.show = !this.show;\n this.showChanged.emit(this.show);\n }\n\n private open(event?: Event) {\n event?.preventDefault();\n\n if (this.isNestedDropdown(event.target as HTMLElement)) {\n event?.stopPropagation();\n }\n\n this.show = true;\n this.showChanged.emit(true);\n }\n\n private close(event?: Event) {\n if (event?.defaultPrevented) {\n return;\n }\n\n this.show = false;\n this.showChanged.emit(false);\n }\n\n private async applyDropdownPosition() {\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (isSubmenu) {\n positionConfig.placement = 'right-start';\n }\n\n if (this.placement.includes('auto') || isSubmenu) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n positionConfig.placement = 'bottom-start';\n } else {\n positionConfig.placement = this.placement as\n | BasePlacement\n | PlacementWithAlignment;\n }\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n async componentDidLoad() {\n if (this.trigger) {\n this.registerListener(this.trigger);\n }\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n }\n\n disconnectedCallback() {\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n }\n\n /**\n * Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n >\n <div style={{ display: 'contents' }}>\n {this.header ? <div class=\"dropdown-header\">{this.header}</div> : ''}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -3,7 +3,7 @@ import { d as defineCustomElement$1 } from './icon.js';
3
3
 
4
4
  const filterChipCss = ".sc-ix-filter-chip-h{display:flex;align-items:center;justify-content:space-between;height:1.5rem;padding-left:0.5rem;border:var(--theme-focus--border-thickness) solid var(--theme-chip-primary-outline--border-color);border-radius:2rem;background-color:var(--theme-color-ghost);color:var(--theme-chip-primary-outline--color)}.sc-ix-filter-chip-h:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-filter-chip-h:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost-primary--hover);border-color:var(--theme-chip-primary-outline--border-color--hover);color:var(--theme-chip-primary-outline--color--hover)}.sc-ix-filter-chip-h:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-filter-chip-h:not(.disabled):not(:disabled):active{background-color:var(--theme-color-ghost-primary--active);border-color:var(--theme-chip-primary-outline--border-color--active);color:var(--theme-chip-primary-outline--color--active)}.sc-ix-filter-chip-h:not(.disabled):not(:disabled):focus-visible{outline:var(--theme-color-focus-bdr) solid var(--theme-focus--border-thickness);outline-offset:-0.125rem}.sc-ix-filter-chip-h .slot-container.sc-ix-filter-chip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-filter-chip-h .slot-container.sc-ix-filter-chip .disabled.sc-ix-filter-chip-h,.disabled .sc-ix-filter-chip-h{background-color:var(--theme-color-ghost);border-color:var(--theme-color-component-4);color:var(--theme-color-weak-text)}.sc-ix-filter-chip-h .btn-oval.sc-ix-filter-chip{height:1.5rem;width:1.5rem;min-width:1.5rem;margin-left:0.25rem;padding:0;vertical-align:top}.sc-ix-filter-chip-h .btn-oval.sc-ix-filter-chip:not(.disabled):not(:disabled):focus-visible{outline:none;border-color:#199fff}";
5
5
 
6
- const FilterChip = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
+ const FilterChip = /*@__PURE__*/ proxyCustomElement(class FilterChip extends HTMLElement {
7
7
  constructor() {
8
8
  super();
9
9
  this.__registerHost();
@@ -4,7 +4,7 @@ import { d as defineCustomElement$1 } from './icon-button.js';
4
4
 
5
5
  const groupContextMenuCss = ".sc-ix-group-context-menu-h{display:block;position:relative;-webkit-margin-before:0.3125rem;margin-block-start:0.3125rem;-webkit-margin-end:0.3125rem;margin-inline-end:0.3125rem;-webkit-margin-start:auto;margin-inline-start:auto}.sc-ix-group-context-menu-h ix-icon-button.sc-ix-group-context-menu::after{display:none}.sc-ix-group-context-menu-h .hide.sc-ix-group-context-menu{visibility:collapse}";
6
6
 
7
- const GroupContextMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
7
+ const GroupContextMenu = /*@__PURE__*/ proxyCustomElement(class GroupContextMenu extends HTMLElement {
8
8
  constructor() {
9
9
  super();
10
10
  this.__registerHost();
@@ -1,9 +1,9 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
2
  import { d as defineCustomElement$1 } from './icon.js';
3
3
 
4
- const groupItemCss = ".sc-ix-group-item-h{display:flex;min-height:2.25rem;height:2.25rem;align-items:center;justify-content:space-between;padding:0.5rem 1.5rem 0.5rem 2.5rem;position:relative;margin-top:0.0625rem;border:1px solid var(--theme-group-item--border-color);outline:none;background-color:var(--theme-group-item--background)}.last.sc-ix-group-item-h{border-bottom-left-radius:0.25rem;border-bottom-right-radius:0.25rem}.sc-ix-group-item-h ix-icon.sc-ix-group-item{margin-right:0.25rem;margin-top:-0.125rem}.sc-ix-group-item-h .group-entry-selection-indicator.sc-ix-group-item{position:absolute;left:0;height:100%;width:0.25rem}.sc-ix-group-item-h .group-entry-text.sc-ix-group-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text);font-size:0.875rem}.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item,.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item span.sc-ix-group-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover);border-color:var(--theme-group-item--border-color--hover)}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):active{background-color:var(--theme-group-item--background--active);border-color:var(--theme-group-item--border-color--active)}.selected.sc-ix-group-item-h{border-top-width:0.062rem !important;border-color:var(--theme-group-item--border-color--selected);background-color:var(--theme-group-item--background--selected)}.selected.sc-ix-group-item-h .group-entry-selection-indicator.sc-ix-group-item{background-color:var(--theme-color-input--focus)}.sc-ix-group-item-h:not(.disabled):not(:disabled):focus-visible{border-color:var(--focus--border-color) !important}";
4
+ const groupItemCss = ".sc-ix-group-item-h{display:flex;min-height:2.25rem;height:2.25rem;align-items:center;justify-content:space-between;padding:0.5rem 1.5rem 0.5rem 2.5rem;position:relative;margin-top:0.0625rem;outline:none;background-color:var(--theme-group-item--background)}.last.sc-ix-group-item-h{border-bottom-left-radius:0.25rem;border-bottom-right-radius:0.25rem}.sc-ix-group-item-h ix-icon.sc-ix-group-item{margin-right:0.25rem;margin-top:-0.125rem}.sc-ix-group-item-h .group-entry-selection-indicator.sc-ix-group-item{position:absolute;left:0;height:100%;width:0.25rem}.sc-ix-group-item-h .group-entry-text.sc-ix-group-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text);font-size:0.875rem}.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item,.sc-ix-group-item-h .group-entry-text-secondary.sc-ix-group-item span.sc-ix-group-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):hover{background-color:var(--theme-group-item--background--hover);border-color:var(--theme-group-item--border-color--hover)}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):hover.selected{background-color:var(--theme-group-item--background--selected)}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled){cursor:pointer}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):active{background-color:var(--theme-group-item--background--active);border-color:var(--theme-group-item--border-color--active)}.sc-ix-group-item-h:not(.suppress-selection):not(.disabled):not(:disabled):active.selected{background-color:var(--theme-group-item--background--selected)}.selected.sc-ix-group-item-h{border-top-width:0.062rem !important;background-color:var(--theme-group-item--background--selected)}.selected.sc-ix-group-item-h .group-entry-selection-indicator.sc-ix-group-item{background-color:var(--theme-group-item-indicator--background--selected)}.sc-ix-group-item-h:not(.disabled):not(:disabled):focus-visible{border:1px solid var(--theme-color-focus-bdr) !important}";
5
5
 
6
- const GroupItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
+ const GroupItem = /*@__PURE__*/ proxyCustomElement(class GroupItem extends HTMLElement {
7
7
  constructor() {
8
8
  super();
9
9
  this.__registerHost();
@@ -1 +1 @@
1
- {"file":"group-item.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,ymEAAymE;;MCyBjnE,SAAS;;;;;;;;6BAqBQ,KAAK;;qBAWb,IAAI;;;EAaxB,WAAW;IACT,IAAI,IAAI,CAAC,iBAAiB,EAAE;MAC1B,OAAO;KACR;IACD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GAC7C;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,iBAAiB;QAClD,oBAAoB,EAAE,IAAI,CAAC,iBAAiB;OAC7C,EACD,QAAQ,EAAE,IAAI,CAAC,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC,IAEjC,WAAK,KAAK,EAAC,iCAAiC,GAAO,EAClD,IAAI,CAAC,IAAI,GAAG,eAAS,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,GAAG,IAAI,EACjE,IAAI,CAAC,IAAI,IACR,YAAM,KAAK,EAAC,kBAAkB,IAC5B,YAAM,KAAK,EAAE,IAAI,CAAC,IAAI,IAAG,IAAI,CAAC,IAAI,CAAQ,CACrC,IACL,IAAI,EACP,IAAI,CAAC,aAAa,IACjB,YAAM,KAAK,EAAC,4BAA4B,IACtC,YAAM,KAAK,EAAE,IAAI,CAAC,aAAa,IAAG,IAAI,CAAC,aAAa,CAAQ,CACvD,IACL,IAAI,EACR,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=scoped","./src/components/group-item/group-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: flex;\n min-height: 2.25rem;\n height: 2.25rem;\n align-items: center;\n justify-content: space-between;\n padding: $small-space $large-space $small-space 2.5rem;\n position: relative;\n margin-top: 0.0625rem;\n border: 1px solid var(--theme-group-item--border-color);\n outline: none;\n\n background-color: var(--theme-group-item--background);\n\n &.last {\n border-bottom-left-radius: 0.25rem;\n border-bottom-right-radius: 0.25rem;\n }\n\n ix-icon {\n margin-right: $tiny-space;\n margin-top: -0.125rem;\n }\n\n .group-entry-selection-indicator {\n position: absolute;\n left: 0;\n height: 100%;\n width: $tiny-space;\n }\n\n .group-entry-text {\n @include ellipsis();\n flex-grow: 1;\n }\n\n .group-entry-text-secondary {\n &,\n span {\n @include ellipsis;\n }\n\n display: flex;\n justify-content: flex-end;\n flex-grow: 1;\n white-space: nowrap;\n color: var(--theme-color-soft-text);\n font-size: 0.875rem;\n }\n\n &:not(.suppress-selection) {\n @include hover {\n background-color: var(--theme-group-item--background--hover);\n border-color: var(--theme-group-item--border-color--hover);\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n border-color: var(--theme-group-item--border-color--active);\n }\n }\n\n &.selected {\n border-top-width: 0.062rem !important;\n border-color: var(--theme-group-item--border-color--selected);\n background-color: var(--theme-group-item--background--selected);\n\n .group-entry-selection-indicator {\n background-color: var(--theme-color-input--focus);\n }\n }\n\n @include focus-visible {\n border-color: var(--focus--border-color) !important;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-group-item',\n styleUrl: 'group-item.scss',\n scoped: true,\n})\nexport class GroupItem {\n @Element() hostElement!: HTMLIxGroupItemElement;\n\n /**\n * Group item icon\n */\n @Prop() icon: string;\n\n /**\n * Group item text\n */\n @Prop() text: string;\n\n /**\n * Group item secondary text\n */\n @Prop() secondaryText: string;\n\n /**\n * Supress the selection of the group\n */\n @Prop() suppressSelection = false;\n\n /**\n * Show selected state\n */\n @Prop() selected: boolean;\n\n /**\n * The elements tabindex attribute will get set accordingly.\n * If true tabindex will be 0, -1 otherwise.\n */\n @Prop() focusable = true;\n\n /**\n * Selection changed\n */\n @Event() selectedChanged: EventEmitter<HTMLIxGroupItemElement>;\n\n /**\n * Index\n */\n @Prop() index: number;\n\n @Listen('click', { passive: true })\n clickListen() {\n if (this.suppressSelection) {\n return;\n }\n this.selectedChanged.emit(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n selected: this.selected && !this.suppressSelection,\n 'suppress-selection': this.suppressSelection,\n }}\n tabindex={this.focusable ? 0 : -1}\n >\n <div class=\"group-entry-selection-indicator\"></div>\n {this.icon ? <ix-icon size=\"16\" name={this.icon}></ix-icon> : null}\n {this.text ? (\n <span class=\"group-entry-text\">\n <span title={this.text}>{this.text}</span>\n </span>\n ) : null}\n {this.secondaryText ? (\n <span class=\"group-entry-text-secondary\">\n <span title={this.secondaryText}>{this.secondaryText}</span>\n </span>\n ) : null}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"group-item.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,s0EAAs0E;;MCyB90E,SAAS;;;;;;;;6BAqBQ,KAAK;;qBAWb,IAAI;;;EAaxB,WAAW;IACT,IAAI,IAAI,CAAC,iBAAiB,EAAE;MAC1B,OAAO;KACR;IACD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GAC7C;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,iBAAiB;QAClD,oBAAoB,EAAE,IAAI,CAAC,iBAAiB;OAC7C,EACD,QAAQ,EAAE,IAAI,CAAC,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC,IAEjC,WAAK,KAAK,EAAC,iCAAiC,GAAO,EAClD,IAAI,CAAC,IAAI,GAAG,eAAS,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,GAAG,IAAI,EACjE,IAAI,CAAC,IAAI,IACR,YAAM,KAAK,EAAC,kBAAkB,IAC5B,YAAM,KAAK,EAAE,IAAI,CAAC,IAAI,IAAG,IAAI,CAAC,IAAI,CAAQ,CACrC,IACL,IAAI,EACP,IAAI,CAAC,aAAa,IACjB,YAAM,KAAK,EAAC,4BAA4B,IACtC,YAAM,KAAK,EAAE,IAAI,CAAC,aAAa,IAAG,IAAI,CAAC,aAAa,CAAQ,CACvD,IACL,IAAI,EACR,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=scoped","./src/components/group-item/group-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n display: flex;\n min-height: 2.25rem;\n height: 2.25rem;\n align-items: center;\n justify-content: space-between;\n padding: $small-space $large-space $small-space 2.5rem;\n position: relative;\n margin-top: 0.0625rem;\n outline: none;\n background-color: var(--theme-group-item--background);\n\n &.last {\n border-bottom-left-radius: 0.25rem;\n border-bottom-right-radius: 0.25rem;\n }\n\n ix-icon {\n margin-right: $tiny-space;\n margin-top: -0.125rem;\n }\n\n .group-entry-selection-indicator {\n position: absolute;\n left: 0;\n height: 100%;\n width: $tiny-space;\n }\n\n .group-entry-text {\n @include ellipsis();\n flex-grow: 1;\n }\n\n .group-entry-text-secondary {\n &,\n span {\n @include ellipsis;\n }\n\n display: flex;\n justify-content: flex-end;\n flex-grow: 1;\n white-space: nowrap;\n color: var(--theme-color-soft-text);\n font-size: 0.875rem;\n }\n\n &:not(.suppress-selection) {\n @include hover {\n background-color: var(--theme-group-item--background--hover);\n border-color: var(--theme-group-item--border-color--hover);\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n\n @include active {\n background-color: var(--theme-group-item--background--active);\n border-color: var(--theme-group-item--border-color--active);\n\n &.selected {\n background-color: var(--theme-group-item--background--selected);\n }\n }\n }\n\n &.selected {\n border-top-width: 0.062rem !important;\n background-color: var(--theme-group-item--background--selected);\n\n .group-entry-selection-indicator {\n background-color: var(--theme-group-item-indicator--background--selected);\n }\n }\n\n @include focus-visible {\n border: 1px solid var(--theme-color-focus-bdr) !important;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-group-item',\n styleUrl: 'group-item.scss',\n scoped: true,\n})\nexport class GroupItem {\n @Element() hostElement!: HTMLIxGroupItemElement;\n\n /**\n * Group item icon\n */\n @Prop() icon: string;\n\n /**\n * Group item text\n */\n @Prop() text: string;\n\n /**\n * Group item secondary text\n */\n @Prop() secondaryText: string;\n\n /**\n * Supress the selection of the group\n */\n @Prop() suppressSelection = false;\n\n /**\n * Show selected state\n */\n @Prop() selected: boolean;\n\n /**\n * The elements tabindex attribute will get set accordingly.\n * If true tabindex will be 0, -1 otherwise.\n */\n @Prop() focusable = true;\n\n /**\n * Selection changed\n */\n @Event() selectedChanged: EventEmitter<HTMLIxGroupItemElement>;\n\n /**\n * Index\n */\n @Prop() index: number;\n\n @Listen('click', { passive: true })\n clickListen() {\n if (this.suppressSelection) {\n return;\n }\n this.selectedChanged.emit(this.hostElement);\n }\n\n render() {\n return (\n <Host\n class={{\n selected: this.selected && !this.suppressSelection,\n 'suppress-selection': this.suppressSelection,\n }}\n tabindex={this.focusable ? 0 : -1}\n >\n <div class=\"group-entry-selection-indicator\"></div>\n {this.icon ? <ix-icon size=\"16\" name={this.icon}></ix-icon> : null}\n {this.text ? (\n <span class=\"group-entry-text\">\n <span title={this.text}>{this.text}</span>\n </span>\n ) : null}\n {this.secondaryText ? (\n <span class=\"group-entry-text-secondary\">\n <span title={this.secondaryText}>{this.secondaryText}</span>\n </span>\n ) : null}\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -4,7 +4,7 @@ import { d as defineCustomElement$1 } from './icon.js';
4
4
 
5
5
  const iconButtonCss = ".disabled.sc-ix-icon-button-h{pointer-events:none}.sc-ix-icon-button-h .icon-button.sc-ix-icon-button{padding:0;overflow:hidden}";
6
6
 
7
- const IconButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
7
+ const IconButton = /*@__PURE__*/ proxyCustomElement(class IconButton extends HTMLElement {
8
8
  constructor() {
9
9
  super();
10
10
  this.__registerHost();
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
2
2
 
3
3
  const iconCss = ".sc-ix-icon-h{display:inline-flex;height:1.5rem;width:1.5rem;color:var(--theme-color-std-text)}.sc-ix-icon-h i.sc-ix-icon{color:inherit;transition:color 150ms}.size-12.sc-ix-icon-h{height:0.75rem;width:0.75rem}.size-16.sc-ix-icon-h{height:1rem;width:1rem}.size-32.sc-ix-icon-h{height:2rem;width:2rem}";
4
4
 
5
- const Icon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
5
+ const Icon = /*@__PURE__*/ proxyCustomElement(class Icon extends HTMLElement {
6
6
  constructor() {
7
7
  super();
8
8
  this.__registerHost();
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
2
2
 
3
3
  const indexButtonCss = ".sc-ix-index-button-h{max-height:2rem}.sc-ix-index-button-h .btn.sc-ix-index-button{min-width:2rem;height:2rem}.sc-ix-index-button-h .btn.selected.sc-ix-index-button{background-color:var(--theme-btn-invisible-secondary--background--selected);color:var(--theme-btn-invisible-secondary--color--selected)}";
4
4
 
5
- const IxIndexButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
5
+ const IxIndexButton = /*@__PURE__*/ proxyCustomElement(class IxIndexButton extends HTMLElement {
6
6
  constructor() {
7
7
  super();
8
8
  this.__registerHost();
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
2
2
 
3
3
  const animatedTabCss = ".sc-ix-animated-tab-h{display:block;height:100%;width:100%;position:absolute}";
4
4
 
5
- const AnimatedTab = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
5
+ const AnimatedTab = /*@__PURE__*/ proxyCustomElement(class AnimatedTab extends HTMLElement {
6
6
  constructor() {
7
7
  super();
8
8
  this.__registerHost();
@@ -6,7 +6,7 @@ import { d as defineCustomElement$2 } from './icon.js';
6
6
 
7
7
  const animatedTabsCss = ".sc-ix-animated-tabs-h{--animate-duration:300ms;display:flex;flex-direction:column;align-items:center;height:100%;width:100%;position:relative}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs{display:flex;padding:0;margin:0;position:relative}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs{display:flex;justify-content:center;width:5rem;height:4.5rem;cursor:pointer;padding-top:0.625rem}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.bottom.sc-ix-animated-tabs{padding-top:0.875rem}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs{background:var(--theme-animated-tab-circle--background);border:solid 1px var(--theme-animated-tab-circle--border-color);display:flex;align-items:center;justify-content:center;border-radius:6.25rem;width:3rem;height:3rem;position:relative;transition:150ms}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs ix-icon.sc-ix-animated-tabs{color:var(--theme-animated-tab-icon--color) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled):hover{background:var(--theme-animated-tab-circle--background--hover);border-color:var(--theme-animated-tab-circle--border-color--hover)}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled):hover ix-icon.sc-ix-animated-tabs{color:var(--theme-animated-tab-icon--color--hover) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled):active{background:var(--theme-animated-tab-circle--background--active);border-color:var(--theme-animated-tab-circle--border-color--active)}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled):active ix-icon.sc-ix-animated-tabs{color:var(--theme-animated-tab-icon--color--active) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.selected.sc-ix-animated-tabs{background:var(--theme-animated-tab-circle--background--selected);border-color:var(--theme-animated-tab-circle--border-color--selected) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.selected.sc-ix-animated-tabs ix-icon.sc-ix-animated-tabs{color:var(--theme-animated-tab-icon--color--selected) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.selected.sc-ix-animated-tabs .count.sc-ix-animated-tabs{border-color:var(--theme-tab-pill--border-color--selected) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.disabled.sc-ix-animated-tabs ix-icon.sc-ix-animated-tabs,.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:disabled ix-icon.sc-ix-animated-tabs{color:var(--theme-animated-tab-icon--color--disabled) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-focus--border-color) !important}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs .count.sc-ix-animated-tabs{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text);display:flex;align-items:center;height:1rem;position:absolute;background-color:var(--theme-pill-outline--background);bottom:-0.55rem;border:1px solid var(--theme-tab-pill--border-color);border-radius:6.25rem;color:var(--theme-pill-outline--color);padding:0 0.25rem;background:var(--theme-color-1);transition:150ms}.sc-ix-animated-tabs-h ul.sc-ix-animated-tabs li.sc-ix-animated-tabs .tab-container.sc-ix-animated-tabs .count.bottom.sc-ix-animated-tabs{top:-0.55rem}.sc-ix-animated-tabs-h .content-container.sc-ix-animated-tabs{display:flex;flex-direction:row;height:calc(100% - 4.5rem);width:100%;overflow-y:auto;overflow-x:hidden}.sc-ix-animated-tabs-h .tab-active-underline.sc-ix-animated-tabs{background-color:var(--theme-animated-tab-indicator--background--selected);height:0.125rem;width:5rem;margin-top:-0.125rem;transition:150ms;position:absolute;top:4.5rem}.sc-ix-animated-tabs-h .tab-active-underline.bottom.sc-ix-animated-tabs{top:0;margin-top:0}";
8
8
 
9
- const AnimatedTabs = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
9
+ const AnimatedTabs = /*@__PURE__*/ proxyCustomElement(class AnimatedTabs extends HTMLElement {
10
10
  constructor() {
11
11
  super();
12
12
  this.__registerHost();
@@ -5,7 +5,7 @@ import { d as defineCustomElement$2 } from './burger-menu.js';
5
5
 
6
6
  const basicNavigationCss = ".sc-ix-basic-navigation-h{display:flex;position:relative;width:100%;height:100%;flex-direction:column}.sc-ix-basic-navigation-h ix-application-header.sc-ix-basic-navigation{z-index:calc(var(--theme-z-index-sticky) + 1)}.sc-ix-basic-navigation-h .content.sc-ix-basic-navigation{display:flex;height:calc(100% - 2.75rem);width:calc(100% - 4rem);position:relative;margin-left:4rem;overflow:auto}.hide-header.sc-ix-basic-navigation-h .content.sc-ix-basic-navigation{height:100%}.mode-mobile.sc-ix-basic-navigation-h .content.sc-ix-basic-navigation{margin-left:0px;width:100%}";
7
7
 
8
- const BasicNavigation = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
8
+ const BasicNavigation = /*@__PURE__*/ proxyCustomElement(class BasicNavigation extends HTMLElement {
9
9
  constructor() {
10
10
  super();
11
11
  this.__registerHost();