@scania/tegel 0.0.1-beta.6 → 0.0.1-beta.9

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 (415) hide show
  1. package/package.json +4 -4
  2. package/readme.md +7 -8
  3. package/dist/cjs/index-e1c79686.js +0 -1912
  4. package/dist/cjs/index.cjs.js +0 -2
  5. package/dist/cjs/loader.cjs.js +0 -21
  6. package/dist/cjs/popper-11d5f714.js +0 -1801
  7. package/dist/cjs/sdds-accordion-item.cjs.entry.js +0 -34
  8. package/dist/cjs/sdds-accordion.cjs.entry.js +0 -21
  9. package/dist/cjs/sdds-badges.cjs.entry.js +0 -55
  10. package/dist/cjs/sdds-body-cell_2.cjs.entry.js +0 -173
  11. package/dist/cjs/sdds-button.cjs.entry.js +0 -36
  12. package/dist/cjs/sdds-datetime.cjs.entry.js +0 -66
  13. package/dist/cjs/sdds-dropdown-filter.cjs.entry.js +0 -92
  14. package/dist/cjs/sdds-dropdown_2.cjs.entry.js +0 -335
  15. package/dist/cjs/sdds-header-cell.cjs.entry.js +0 -141
  16. package/dist/cjs/sdds-icon.cjs.entry.js +0 -42
  17. package/dist/cjs/sdds-inline-tabs-fullbleed.cjs.entry.js +0 -96
  18. package/dist/cjs/sdds-inline-tabs.cjs.entry.js +0 -211
  19. package/dist/cjs/sdds-modal.cjs.entry.js +0 -49
  20. package/dist/cjs/sdds-navigation-tabs.cjs.entry.js +0 -95
  21. package/dist/cjs/sdds-popover-canvas.cjs.entry.js +0 -76
  22. package/dist/cjs/sdds-popover-menu.cjs.entry.js +0 -75
  23. package/dist/cjs/sdds-slider.cjs.entry.js +0 -336
  24. package/dist/cjs/sdds-spinner.cjs.entry.js +0 -21
  25. package/dist/cjs/sdds-table-body-row-expandable.cjs.entry.js +0 -81
  26. package/dist/cjs/sdds-table-body.cjs.entry.js +0 -289
  27. package/dist/cjs/sdds-table-footer.cjs.entry.js +0 -165
  28. package/dist/cjs/sdds-table-header.cjs.entry.js +0 -100
  29. package/dist/cjs/sdds-table-toolbar.cjs.entry.js +0 -66
  30. package/dist/cjs/sdds-table.cjs.entry.js +0 -69
  31. package/dist/cjs/sdds-textarea.cjs.entry.js +0 -61
  32. package/dist/cjs/sdds-textfield.cjs.entry.js +0 -82
  33. package/dist/cjs/sdds-tooltip.cjs.entry.js +0 -95
  34. package/dist/cjs/tegel.cjs.js +0 -19
  35. package/dist/collection/collection-manifest.json +0 -40
  36. package/dist/collection/components/accordion/accordion-item/accordion-item.css +0 -134
  37. package/dist/collection/components/accordion/accordion-item/accordion-item.js +0 -146
  38. package/dist/collection/components/accordion/accordion.css +0 -77
  39. package/dist/collection/components/accordion/accordion.js +0 -62
  40. package/dist/collection/components/accordion/accordion.stories.js +0 -91
  41. package/dist/collection/components/badge/badge.stories.js +0 -101
  42. package/dist/collection/components/badge/badges.css +0 -42
  43. package/dist/collection/components/badge/badges.js +0 -150
  44. package/dist/collection/components/banner/banner.stories.js +0 -93
  45. package/dist/collection/components/block/block.stories.js +0 -46
  46. package/dist/collection/components/breadcrumb/breadcrumb.stories.js +0 -26
  47. package/dist/collection/components/button/button-component.js +0 -154
  48. package/dist/collection/components/button/button-native.stories.js +0 -183
  49. package/dist/collection/components/button/button-webcomponent.stories.js +0 -182
  50. package/dist/collection/components/button/button.css +0 -658
  51. package/dist/collection/components/card/card.stories.js +0 -181
  52. package/dist/collection/components/checkbox/checkbox.stories.js +0 -54
  53. package/dist/collection/components/chips/chips.stories.js +0 -124
  54. package/dist/collection/components/data-table/native-table.stories.js +0 -182
  55. package/dist/collection/components/data-table/table/table.css +0 -15
  56. package/dist/collection/components/data-table/table/table.js +0 -253
  57. package/dist/collection/components/data-table/table-body/table-body.css +0 -22
  58. package/dist/collection/components/data-table/table-body/table-body.js +0 -425
  59. package/dist/collection/components/data-table/table-body-cell/table-body-cell.css +0 -40
  60. package/dist/collection/components/data-table/table-body-cell/table-body-cell.js +0 -169
  61. package/dist/collection/components/data-table/table-body-row/table-body-row.css +0 -196
  62. package/dist/collection/components/data-table/table-body-row/table-body-row.js +0 -164
  63. package/dist/collection/components/data-table/table-body-row-expandable/table-body-row-expandable.css +0 -79
  64. package/dist/collection/components/data-table/table-body-row-expandable/table-body-row-expandable.js +0 -155
  65. package/dist/collection/components/data-table/table-component-basic.stories.js +0 -163
  66. package/dist/collection/components/data-table/table-component-batch-actions.stories.js +0 -129
  67. package/dist/collection/components/data-table/table-component-bodydata.stories.js +0 -58
  68. package/dist/collection/components/data-table/table-component-custom-width.stories.js +0 -198
  69. package/dist/collection/components/data-table/table-component-event-listeners.stories.js +0 -153
  70. package/dist/collection/components/data-table/table-component-expandable-rows.stories.js +0 -137
  71. package/dist/collection/components/data-table/table-component-filtering.stories.js +0 -139
  72. package/dist/collection/components/data-table/table-component-multiselect.stories.js +0 -160
  73. package/dist/collection/components/data-table/table-component-pagination.stories.js +0 -129
  74. package/dist/collection/components/data-table/table-component-sorting.stories.js +0 -107
  75. package/dist/collection/components/data-table/table-footer/table-footer.css +0 -93
  76. package/dist/collection/components/data-table/table-footer/table-footer.js +0 -355
  77. package/dist/collection/components/data-table/table-header/table-header.css +0 -204
  78. package/dist/collection/components/data-table/table-header/table-header.js +0 -153
  79. package/dist/collection/components/data-table/table-header-cell/table-header-cell.css +0 -126
  80. package/dist/collection/components/data-table/table-header-cell/table-header-cell.js +0 -320
  81. package/dist/collection/components/data-table/table-toolbar/table-toolbar.css +0 -92
  82. package/dist/collection/components/data-table/table-toolbar/table-toolbar.js +0 -142
  83. package/dist/collection/components/datetime/datetime.css +0 -375
  84. package/dist/collection/components/datetime/datetime.js +0 -251
  85. package/dist/collection/components/datetime/datetime.stories.js +0 -149
  86. package/dist/collection/components/divider/divider.stories.js +0 -116
  87. package/dist/collection/components/dropdown/dropdown-filter/dropdown-filter.js +0 -339
  88. package/dist/collection/components/dropdown/dropdown-filter/dropdown-filter.stories.js +0 -130
  89. package/dist/collection/components/dropdown/dropdown-native.stories.js +0 -90
  90. package/dist/collection/components/dropdown/dropdown-option/dropdown-option.js +0 -185
  91. package/dist/collection/components/dropdown/dropdown-wc-default.stories.js +0 -151
  92. package/dist/collection/components/dropdown/dropdown-wc-multiselect.stories.js +0 -146
  93. package/dist/collection/components/dropdown/dropdown.css +0 -891
  94. package/dist/collection/components/dropdown/dropdown.js +0 -554
  95. package/dist/collection/components/footer/footer.stories.js +0 -100
  96. package/dist/collection/components/header/header-all.stories.js +0 -217
  97. package/dist/collection/components/header/header-default.stories.js +0 -47
  98. package/dist/collection/components/header/header-inline.stories.js +0 -113
  99. package/dist/collection/components/header/header-search.stories.js +0 -263
  100. package/dist/collection/components/header/header-toolbar.stories.js +0 -204
  101. package/dist/collection/components/icon/icon-font.stories.js +0 -57
  102. package/dist/collection/components/icon/icon-web-component.stories.js +0 -51
  103. package/dist/collection/components/icon/icon.css +0 -16
  104. package/dist/collection/components/icon/icon.js +0 -89
  105. package/dist/collection/components/icon/iconsArray.js +0 -2
  106. package/dist/collection/components/link/link.stories.js +0 -45
  107. package/dist/collection/components/message/message.stories.js +0 -117
  108. package/dist/collection/components/modal/modal-native.stories.js +0 -121
  109. package/dist/collection/components/modal/modal-webcomponent.stories.js +0 -78
  110. package/dist/collection/components/modal/modal.css +0 -324
  111. package/dist/collection/components/modal/modal.js +0 -146
  112. package/dist/collection/components/popover-canvas/popover-canvas.css +0 -20
  113. package/dist/collection/components/popover-canvas/popover-canvas.js +0 -190
  114. package/dist/collection/components/popover-canvas/popover-canvas.stories.js +0 -87
  115. package/dist/collection/components/popover-menu/popover-menu-icons.stories.js +0 -132
  116. package/dist/collection/components/popover-menu/popover-menu.css +0 -19
  117. package/dist/collection/components/popover-menu/popover-menu.js +0 -189
  118. package/dist/collection/components/popover-menu/popover-menu.stories.js +0 -109
  119. package/dist/collection/components/radio-button/radio-button.stories.js +0 -68
  120. package/dist/collection/components/side-menu/side-menu.stories.js +0 -182
  121. package/dist/collection/components/slider/slider.css +0 -260
  122. package/dist/collection/components/slider/slider.js +0 -682
  123. package/dist/collection/components/slider/slider.stories.js +0 -251
  124. package/dist/collection/components/spinner/spinner.css +0 -79
  125. package/dist/collection/components/spinner/spinner.js +0 -61
  126. package/dist/collection/components/spinner/spinner.stories.js +0 -59
  127. package/dist/collection/components/stepper/stepper.stories.js +0 -139
  128. package/dist/collection/components/tabs/inline-tabs-default/inline-tabs.css +0 -159
  129. package/dist/collection/components/tabs/inline-tabs-default/inline-tabs.js +0 -302
  130. package/dist/collection/components/tabs/inline-tabs-default/inline-tabs.stories.js +0 -65
  131. package/dist/collection/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.css +0 -172
  132. package/dist/collection/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.js +0 -126
  133. package/dist/collection/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.stories.js +0 -43
  134. package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.css +0 -153
  135. package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.js +0 -103
  136. package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.stories.js +0 -32
  137. package/dist/collection/components/textarea/textarea.css +0 -283
  138. package/dist/collection/components/textarea/textarea.js +0 -336
  139. package/dist/collection/components/textarea/textarea.stories.js +0 -149
  140. package/dist/collection/components/textfield/textfield.css +0 -494
  141. package/dist/collection/components/textfield/textfield.js +0 -359
  142. package/dist/collection/components/textfield/textfield.stories.js +0 -222
  143. package/dist/collection/components/toast/toast.stories.js +0 -119
  144. package/dist/collection/components/toggle/toggle.stories.js +0 -62
  145. package/dist/collection/components/tooltip/tooltip.css +0 -46
  146. package/dist/collection/components/tooltip/tooltip.js +0 -200
  147. package/dist/collection/components/tooltip/tooltip.stories.js +0 -113
  148. package/dist/collection/components/utility/colour/background-color.stories.js +0 -96
  149. package/dist/collection/components/utility/colour/text-color.stories.js +0 -94
  150. package/dist/collection/foundations-stories/colour/colour-brand.stories.js +0 -38
  151. package/dist/collection/foundations-stories/colour/colour-scales.stories.js +0 -71
  152. package/dist/collection/foundations-stories/colour/colour-semantic.stories.js +0 -40
  153. package/dist/collection/foundations-stories/grid/grid.stories.js +0 -386
  154. package/dist/collection/foundations-stories/spacing/spacing-element.stories.js +0 -100
  155. package/dist/collection/foundations-stories/spacing/spacing-layout.stories.js +0 -94
  156. package/dist/collection/foundations-stories/typography/typography-body.stories.js +0 -16
  157. package/dist/collection/foundations-stories/typography/typography-detail.stories.js +0 -17
  158. package/dist/collection/foundations-stories/typography/typography-headline.stories.js +0 -39
  159. package/dist/collection/foundations-stories/typography/typography-paragraph.stories.js +0 -12
  160. package/dist/collection/index.js +0 -1
  161. package/dist/collection/stories/assets/code-brackets.svg +0 -1
  162. package/dist/collection/stories/assets/colors.svg +0 -1
  163. package/dist/collection/stories/assets/comments.svg +0 -1
  164. package/dist/collection/stories/assets/direction.svg +0 -1
  165. package/dist/collection/stories/assets/flow.svg +0 -1
  166. package/dist/collection/stories/assets/plugin.svg +0 -1
  167. package/dist/collection/stories/assets/repo.svg +0 -1
  168. package/dist/collection/stories/assets/stackalt.svg +0 -1
  169. package/dist/collection/utils/utils.js +0 -12
  170. package/dist/components/dropdown-option.js +0 -100
  171. package/dist/components/dropdown.js +0 -296
  172. package/dist/components/icon.js +0 -58
  173. package/dist/components/index.d.ts +0 -50
  174. package/dist/components/index.js +0 -30
  175. package/dist/components/popper.js +0 -1799
  176. package/dist/components/sdds-accordion-item.d.ts +0 -11
  177. package/dist/components/sdds-accordion-item.js +0 -60
  178. package/dist/components/sdds-accordion.d.ts +0 -11
  179. package/dist/components/sdds-accordion.js +0 -38
  180. package/dist/components/sdds-badges.d.ts +0 -11
  181. package/dist/components/sdds-badges.js +0 -76
  182. package/dist/components/sdds-body-cell.d.ts +0 -11
  183. package/dist/components/sdds-body-cell.js +0 -6
  184. package/dist/components/sdds-button.d.ts +0 -11
  185. package/dist/components/sdds-button.js +0 -58
  186. package/dist/components/sdds-datetime.d.ts +0 -11
  187. package/dist/components/sdds-datetime.js +0 -90
  188. package/dist/components/sdds-dropdown-filter.d.ts +0 -11
  189. package/dist/components/sdds-dropdown-filter.js +0 -138
  190. package/dist/components/sdds-dropdown-option.d.ts +0 -11
  191. package/dist/components/sdds-dropdown-option.js +0 -6
  192. package/dist/components/sdds-dropdown.d.ts +0 -11
  193. package/dist/components/sdds-dropdown.js +0 -6
  194. package/dist/components/sdds-header-cell.d.ts +0 -11
  195. package/dist/components/sdds-header-cell.js +0 -173
  196. package/dist/components/sdds-icon.d.ts +0 -11
  197. package/dist/components/sdds-icon.js +0 -6
  198. package/dist/components/sdds-inline-tabs-fullbleed.d.ts +0 -11
  199. package/dist/components/sdds-inline-tabs-fullbleed.js +0 -115
  200. package/dist/components/sdds-inline-tabs.d.ts +0 -11
  201. package/dist/components/sdds-inline-tabs.js +0 -235
  202. package/dist/components/sdds-modal.d.ts +0 -11
  203. package/dist/components/sdds-modal.js +0 -69
  204. package/dist/components/sdds-navigation-tabs.d.ts +0 -11
  205. package/dist/components/sdds-navigation-tabs.js +0 -113
  206. package/dist/components/sdds-popover-canvas.d.ts +0 -11
  207. package/dist/components/sdds-popover-canvas.js +0 -97
  208. package/dist/components/sdds-popover-menu.d.ts +0 -11
  209. package/dist/components/sdds-popover-menu.js +0 -96
  210. package/dist/components/sdds-slider.d.ts +0 -11
  211. package/dist/components/sdds-slider.js +0 -366
  212. package/dist/components/sdds-spinner.d.ts +0 -11
  213. package/dist/components/sdds-spinner.js +0 -37
  214. package/dist/components/sdds-table-body-row-expandable.d.ts +0 -11
  215. package/dist/components/sdds-table-body-row-expandable.js +0 -104
  216. package/dist/components/sdds-table-body-row.d.ts +0 -11
  217. package/dist/components/sdds-table-body-row.js +0 -6
  218. package/dist/components/sdds-table-body.d.ts +0 -11
  219. package/dist/components/sdds-table-body.js +0 -337
  220. package/dist/components/sdds-table-footer.d.ts +0 -11
  221. package/dist/components/sdds-table-footer.js +0 -196
  222. package/dist/components/sdds-table-header.d.ts +0 -11
  223. package/dist/components/sdds-table-header.js +0 -125
  224. package/dist/components/sdds-table-toolbar.d.ts +0 -11
  225. package/dist/components/sdds-table-toolbar.js +0 -88
  226. package/dist/components/sdds-table.d.ts +0 -11
  227. package/dist/components/sdds-table.js +0 -92
  228. package/dist/components/sdds-textarea.d.ts +0 -11
  229. package/dist/components/sdds-textarea.js +0 -90
  230. package/dist/components/sdds-textfield.d.ts +0 -11
  231. package/dist/components/sdds-textfield.js +0 -111
  232. package/dist/components/sdds-tooltip.d.ts +0 -11
  233. package/dist/components/sdds-tooltip.js +0 -116
  234. package/dist/components/table-body-cell.js +0 -102
  235. package/dist/components/table-body-row.js +0 -119
  236. package/dist/esm/index-b67b15a6.js +0 -1884
  237. package/dist/esm/index.js +0 -1
  238. package/dist/esm/loader.js +0 -17
  239. package/dist/esm/polyfills/core-js.js +0 -11
  240. package/dist/esm/polyfills/css-shim.js +0 -1
  241. package/dist/esm/polyfills/dom.js +0 -79
  242. package/dist/esm/polyfills/es5-html-element.js +0 -1
  243. package/dist/esm/polyfills/index.js +0 -34
  244. package/dist/esm/polyfills/system.js +0 -6
  245. package/dist/esm/popper-f860750c.js +0 -1799
  246. package/dist/esm/sdds-accordion-item.entry.js +0 -30
  247. package/dist/esm/sdds-accordion.entry.js +0 -17
  248. package/dist/esm/sdds-badges.entry.js +0 -51
  249. package/dist/esm/sdds-body-cell_2.entry.js +0 -168
  250. package/dist/esm/sdds-button.entry.js +0 -32
  251. package/dist/esm/sdds-datetime.entry.js +0 -62
  252. package/dist/esm/sdds-dropdown-filter.entry.js +0 -88
  253. package/dist/esm/sdds-dropdown_2.entry.js +0 -330
  254. package/dist/esm/sdds-header-cell.entry.js +0 -137
  255. package/dist/esm/sdds-icon.entry.js +0 -38
  256. package/dist/esm/sdds-inline-tabs-fullbleed.entry.js +0 -92
  257. package/dist/esm/sdds-inline-tabs.entry.js +0 -207
  258. package/dist/esm/sdds-modal.entry.js +0 -45
  259. package/dist/esm/sdds-navigation-tabs.entry.js +0 -91
  260. package/dist/esm/sdds-popover-canvas.entry.js +0 -72
  261. package/dist/esm/sdds-popover-menu.entry.js +0 -71
  262. package/dist/esm/sdds-slider.entry.js +0 -332
  263. package/dist/esm/sdds-spinner.entry.js +0 -17
  264. package/dist/esm/sdds-table-body-row-expandable.entry.js +0 -77
  265. package/dist/esm/sdds-table-body.entry.js +0 -285
  266. package/dist/esm/sdds-table-footer.entry.js +0 -161
  267. package/dist/esm/sdds-table-header.entry.js +0 -96
  268. package/dist/esm/sdds-table-toolbar.entry.js +0 -62
  269. package/dist/esm/sdds-table.entry.js +0 -65
  270. package/dist/esm/sdds-textarea.entry.js +0 -57
  271. package/dist/esm/sdds-textfield.entry.js +0 -78
  272. package/dist/esm/sdds-tooltip.entry.js +0 -91
  273. package/dist/esm/tegel.js +0 -17
  274. package/dist/index.cjs.js +0 -1
  275. package/dist/index.js +0 -1
  276. package/dist/node_modules/@types/jest/index.d.ts +0 -1512
  277. package/dist/tegel/index.esm.js +0 -0
  278. package/dist/tegel/p-040efb32.entry.js +0 -1
  279. package/dist/tegel/p-12ca5cfa.entry.js +0 -1
  280. package/dist/tegel/p-157e1618.js +0 -2
  281. package/dist/tegel/p-1fe61cf6.entry.js +0 -1
  282. package/dist/tegel/p-2f376504.entry.js +0 -1
  283. package/dist/tegel/p-44ced895.entry.js +0 -1
  284. package/dist/tegel/p-4880f03d.entry.js +0 -1
  285. package/dist/tegel/p-4aba73a3.entry.js +0 -1
  286. package/dist/tegel/p-4b58a02c.entry.js +0 -1
  287. package/dist/tegel/p-4cb85347.entry.js +0 -1
  288. package/dist/tegel/p-52031b5a.entry.js +0 -1
  289. package/dist/tegel/p-677baf7f.entry.js +0 -1
  290. package/dist/tegel/p-71797eaf.entry.js +0 -1
  291. package/dist/tegel/p-7373284c.entry.js +0 -1
  292. package/dist/tegel/p-7451779b.entry.js +0 -1
  293. package/dist/tegel/p-77aeea3b.entry.js +0 -1
  294. package/dist/tegel/p-8582d6a7.entry.js +0 -1
  295. package/dist/tegel/p-96021bd0.entry.js +0 -1
  296. package/dist/tegel/p-9d8caf51.entry.js +0 -1
  297. package/dist/tegel/p-a5919930.entry.js +0 -1
  298. package/dist/tegel/p-b01cface.entry.js +0 -1
  299. package/dist/tegel/p-bf896643.entry.js +0 -1
  300. package/dist/tegel/p-c311725c.entry.js +0 -1
  301. package/dist/tegel/p-cf72dfd9.entry.js +0 -1
  302. package/dist/tegel/p-d91caec6.entry.js +0 -1
  303. package/dist/tegel/p-e10eec33.entry.js +0 -1
  304. package/dist/tegel/p-ec26fc38.js +0 -1
  305. package/dist/tegel/p-f2262a69.entry.js +0 -1
  306. package/dist/tegel/p-f2f7aa45.entry.js +0 -1
  307. package/dist/tegel/tegel.css +0 -101
  308. package/dist/tegel/tegel.esm.js +0 -1
  309. package/dist/types/components/accordion/accordion-item/accordion-item.d.ts +0 -17
  310. package/dist/types/components/accordion/accordion.d.ts +0 -7
  311. package/dist/types/components/accordion/accordion.stories.d.ts +0 -77
  312. package/dist/types/components/badge/badge.stories.d.ts +0 -66
  313. package/dist/types/components/badge/badges.d.ts +0 -16
  314. package/dist/types/components/banner/banner.stories.d.ts +0 -68
  315. package/dist/types/components/block/block.stories.d.ts +0 -31
  316. package/dist/types/components/breadcrumb/breadcrumb.stories.d.ts +0 -12
  317. package/dist/types/components/button/button-component.d.ts +0 -15
  318. package/dist/types/components/button/button-native.stories.d.ts +0 -144
  319. package/dist/types/components/button/button-webcomponent.stories.d.ts +0 -143
  320. package/dist/types/components/card/card.stories.d.ts +0 -114
  321. package/dist/types/components/checkbox/checkbox.stories.d.ts +0 -39
  322. package/dist/types/components/chips/chips.stories.d.ts +0 -81
  323. package/dist/types/components/data-table/native-table.stories.d.ts +0 -147
  324. package/dist/types/components/data-table/table/table.d.ts +0 -47
  325. package/dist/types/components/data-table/table-body/table-body.d.ts +0 -54
  326. package/dist/types/components/data-table/table-body-cell/table-body-cell.d.ts +0 -24
  327. package/dist/types/components/data-table/table-body-row/table-body-row.d.ts +0 -27
  328. package/dist/types/components/data-table/table-body-row-expandable/table-body-row-expandable.d.ts +0 -27
  329. package/dist/types/components/data-table/table-component-basic.stories.d.ts +0 -100
  330. package/dist/types/components/data-table/table-component-batch-actions.stories.d.ts +0 -98
  331. package/dist/types/components/data-table/table-component-bodydata.stories.d.ts +0 -38
  332. package/dist/types/components/data-table/table-component-custom-width.stories.d.ts +0 -147
  333. package/dist/types/components/data-table/table-component-event-listeners.stories.d.ts +0 -87
  334. package/dist/types/components/data-table/table-component-expandable-rows.stories.d.ts +0 -87
  335. package/dist/types/components/data-table/table-component-filtering.stories.d.ts +0 -100
  336. package/dist/types/components/data-table/table-component-multiselect.stories.d.ts +0 -100
  337. package/dist/types/components/data-table/table-component-pagination.stories.d.ts +0 -100
  338. package/dist/types/components/data-table/table-component-sorting.stories.d.ts +0 -79
  339. package/dist/types/components/data-table/table-footer/table-footer.d.ts +0 -50
  340. package/dist/types/components/data-table/table-header/table-header.d.ts +0 -27
  341. package/dist/types/components/data-table/table-header-cell/table-header-cell.d.ts +0 -45
  342. package/dist/types/components/data-table/table-toolbar/table-toolbar.d.ts +0 -22
  343. package/dist/types/components/datetime/datetime.d.ts +0 -32
  344. package/dist/types/components/datetime/datetime.stories.d.ts +0 -80
  345. package/dist/types/components/divider/divider.stories.d.ts +0 -72
  346. package/dist/types/components/dropdown/dropdown-filter/dropdown-filter.d.ts +0 -42
  347. package/dist/types/components/dropdown/dropdown-filter/dropdown-filter.stories.d.ts +0 -73
  348. package/dist/types/components/dropdown/dropdown-native.stories.d.ts +0 -57
  349. package/dist/types/components/dropdown/dropdown-option/dropdown-option.d.ts +0 -19
  350. package/dist/types/components/dropdown/dropdown-wc-default.stories.d.ts +0 -115
  351. package/dist/types/components/dropdown/dropdown-wc-multiselect.stories.d.ts +0 -115
  352. package/dist/types/components/dropdown/dropdown.d.ts +0 -56
  353. package/dist/types/components/footer/footer.stories.d.ts +0 -23
  354. package/dist/types/components/header/header-all.stories.d.ts +0 -29
  355. package/dist/types/components/header/header-default.stories.d.ts +0 -29
  356. package/dist/types/components/header/header-inline.stories.d.ts +0 -29
  357. package/dist/types/components/header/header-search.stories.d.ts +0 -29
  358. package/dist/types/components/header/header-toolbar.stories.d.ts +0 -29
  359. package/dist/types/components/icon/icon-font.stories.d.ts +0 -38
  360. package/dist/types/components/icon/icon-web-component.stories.d.ts +0 -38
  361. package/dist/types/components/icon/icon.d.ts +0 -12
  362. package/dist/types/components/link/link.stories.d.ts +0 -33
  363. package/dist/types/components/message/message.stories.d.ts +0 -67
  364. package/dist/types/components/modal/modal-native.stories.d.ts +0 -51
  365. package/dist/types/components/modal/modal-webcomponent.stories.d.ts +0 -44
  366. package/dist/types/components/modal/modal.d.ts +0 -16
  367. package/dist/types/components/popover-canvas/popover-canvas.d.ts +0 -18
  368. package/dist/types/components/popover-canvas/popover-canvas.stories.d.ts +0 -25
  369. package/dist/types/components/popover-menu/popover-menu-icons.stories.d.ts +0 -27
  370. package/dist/types/components/popover-menu/popover-menu.d.ts +0 -18
  371. package/dist/types/components/popover-menu/popover-menu.stories.d.ts +0 -27
  372. package/dist/types/components/radio-button/radio-button.stories.d.ts +0 -41
  373. package/dist/types/components/side-menu/side-menu.stories.d.ts +0 -42
  374. package/dist/types/components/slider/slider.d.ts +0 -82
  375. package/dist/types/components/slider/slider.stories.d.ts +0 -156
  376. package/dist/types/components/spinner/spinner.d.ts +0 -7
  377. package/dist/types/components/spinner/spinner.stories.d.ts +0 -37
  378. package/dist/types/components/stepper/stepper.stories.d.ts +0 -56
  379. package/dist/types/components/tabs/inline-tabs-default/inline-tabs.d.ts +0 -41
  380. package/dist/types/components/tabs/inline-tabs-default/inline-tabs.stories.d.ts +0 -41
  381. package/dist/types/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.d.ts +0 -20
  382. package/dist/types/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.stories.d.ts +0 -25
  383. package/dist/types/components/tabs/navigation-tabs/navigation-tabs.d.ts +0 -18
  384. package/dist/types/components/tabs/navigation-tabs/navigation-tabs.stories.d.ts +0 -13
  385. package/dist/types/components/textarea/textarea.d.ts +0 -41
  386. package/dist/types/components/textarea/textarea.stories.d.ts +0 -111
  387. package/dist/types/components/textfield/textfield.d.ts +0 -42
  388. package/dist/types/components/textfield/textfield.stories.d.ts +0 -176
  389. package/dist/types/components/toast/toast.stories.d.ts +0 -58
  390. package/dist/types/components/toggle/toggle.stories.d.ts +0 -42
  391. package/dist/types/components/tooltip/tooltip.d.ts +0 -20
  392. package/dist/types/components/tooltip/tooltip.stories.d.ts +0 -54
  393. package/dist/types/components/utility/colour/background-color.stories.d.ts +0 -58
  394. package/dist/types/components/utility/colour/text-color.stories.d.ts +0 -58
  395. package/dist/types/components.d.ts +0 -1752
  396. package/dist/types/foundations-stories/colour/colour-brand.stories.d.ts +0 -13
  397. package/dist/types/foundations-stories/colour/colour-scales.stories.d.ts +0 -13
  398. package/dist/types/foundations-stories/colour/colour-semantic.stories.d.ts +0 -13
  399. package/dist/types/foundations-stories/grid/grid.stories.d.ts +0 -35
  400. package/dist/types/foundations-stories/spacing/spacing-element.stories.d.ts +0 -8
  401. package/dist/types/foundations-stories/spacing/spacing-layout.stories.d.ts +0 -8
  402. package/dist/types/foundations-stories/typography/typography-body.stories.d.ts +0 -8
  403. package/dist/types/foundations-stories/typography/typography-detail.stories.d.ts +0 -8
  404. package/dist/types/foundations-stories/typography/typography-headline.stories.d.ts +0 -21
  405. package/dist/types/foundations-stories/typography/typography-paragraph.stories.d.ts +0 -8
  406. package/dist/types/global.d.ts +0 -2
  407. package/dist/types/index.d.ts +0 -1
  408. package/dist/types/stencil-public-runtime.d.ts +0 -1581
  409. package/dist/types/utils/utils.d.ts +0 -2
  410. package/loader/cdn.js +0 -3
  411. package/loader/index.cjs.js +0 -3
  412. package/loader/index.d.ts +0 -12
  413. package/loader/index.es2017.js +0 -3
  414. package/loader/index.js +0 -4
  415. package/loader/package.json +0 -11
@@ -1,138 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
- import { d as defineCustomElement$3 } from './dropdown.js';
3
- import { d as defineCustomElement$2 } from './dropdown-option.js';
4
-
5
- const dropdownCss = ":root{--sdds-headline-01:normal normal bold 40px/40px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-01-ls:0;--sdds-headline-02:normal normal bold 32px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-02-ls:-0.04em;--sdds-headline-03:normal normal bold 24px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-03-ls:-0.03em;--sdds-headline-04:normal normal bold 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-04-ls:-0.02em;--sdds-headline-05:normal normal bold 14px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-05-ls:-0.02em;--sdds-headline-06:normal normal bold 14px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-06-ls:-0.02em;--sdds-headline-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n sans-serif;--sdds-headline-07-ls:-0.01em;--sdds-paragraph-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-01-ls:-0.03em;--sdds-paragraph-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-02-ls:-0.01em;--sdds-body-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-01-ls:-0.02em;--sdds-body-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-02-ls:-0.02em;--sdds-detail-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-01-ls:-0.01em;--sdds-detail-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-02-ls:-0.01em;--sdds-detail-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-03-ls:-0.01em;--sdds-detail-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-04-ls:0.08em;--sdds-detail-04-tt:uppercase;--sdds-detail-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-05-ls:0;--sdds-detail-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-06-ls:0.08em;--sdds-detail-06-tt:uppercase;--sdds-detail-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-07-ls:0;--sdds-expressive-headline-01:normal normal bold 80px/80px \"Scania Sans Headline\", arial,\n helvetica, sans-serif;--sdds-expressive-headline-01-ls:0;--sdds-expressive-headline-02:normal normal bold 56px/56px \"Scania Sans Headline\", arial,\n helvetica, sans-serif;--sdds-expressive-headline-02-ls:0;--sdds-headline-ex-01:normal normal bold 40px/40px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-01-ls:0;--sdds-headline-ex-02:normal normal bold 32px/32px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-02-ls:-0.04em;--sdds-headline-ex-03:normal normal bold 24px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-03-ls:-0.03em;--sdds-headline-ex-04:normal normal bold 20px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-04-ls:-0.01em;--sdds-headline-ex-05:normal normal bold 16px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-05-ls:-0.02em;--sdds-headline-ex-06:normal normal bold 14px/16px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-06-ls:-0.02em;--sdds-headline-ex-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n sans-serif;--sdds-headline-ex-07-ls:-0.01em;--sdds-paragraph-ex-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-01-ls:-0.03em;--sdds-paragraph-ex-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-02-ls:-0.01em;--sdds-body-ex-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-01-ls:-0.02em;--sdds-body-ex-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-02-ls:-0.01em;--sdds-detail-ex-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-01-ls:-0.01em;--sdds-detail-ex-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-02-ls:-0.01em;--sdds-detail-ex-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-03-ls:-0.01em;--sdds-detail-ex-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-04-ls:0.08em;--sdds-detail-ex-04-tt:uppercase;--sdds-detail-ex-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-05-ls:0;--sdds-detail-ex-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-06-ls:0.08em;--sdds-detail-ex-06-tt:uppercase;--sdds-detail-ex-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-07-ls:0}:root,:host,::slotted(*),.sdds-theme-light{--sdds-link:var(--sdds-grey-958);--sdds-link-text-decoration:none;--sdds-dropdown-bg:var(--sdds-white);--sdds-dropdown-bg-hover:var(--sdds-grey-50)}:root .sdds-on-white-bg,:host .sdds-on-white-bg,::slotted(*) .sdds-on-white-bg,.sdds-theme-light .sdds-on-white-bg{--sdds-dropdown-bg:var(--sdds-grey-50);--sdds-dropdown-bg-hover:var(--sdds-grey-100)}.sdds-dropdown-helper{font:var(--sdds-detail-ex-05);letter-spacing:var(--sdds-detail-ex-05-ls);color:var(--sdds-grey-700);margin-top:var(--sdds-spacing-element-4);display:flex}.sdds-dropdown-helper .sdds-dropdown-error-icon{width:16px;height:16px;padding-right:9px;display:none}.sdds-dropdown-label-inside{font:var(--sdds-detail-ex-07);letter-spacing:var(--sdds-detail-ex-07-ls);color:var(--sdds-grey-700)}.sdds-dropdown-label-outside{font:var(--sdds-detail-ex-05);letter-spacing:var(--sdds-detail-ex-05-ls);display:block;color:var(--sdds-grey-958);margin-bottom:var(--sdds-spacing-element-8)}:root{--sdds-headline-01:normal normal bold 40px/40px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-01-ls:0;--sdds-headline-02:normal normal bold 32px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-02-ls:-0.04em;--sdds-headline-03:normal normal bold 24px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-03-ls:-0.03em;--sdds-headline-04:normal normal bold 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-04-ls:-0.02em;--sdds-headline-05:normal normal bold 14px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-05-ls:-0.02em;--sdds-headline-06:normal normal bold 14px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-06-ls:-0.02em;--sdds-headline-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n sans-serif;--sdds-headline-07-ls:-0.01em;--sdds-paragraph-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-01-ls:-0.03em;--sdds-paragraph-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-02-ls:-0.01em;--sdds-body-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-01-ls:-0.02em;--sdds-body-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-02-ls:-0.02em;--sdds-detail-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-01-ls:-0.01em;--sdds-detail-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-02-ls:-0.01em;--sdds-detail-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-03-ls:-0.01em;--sdds-detail-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-04-ls:0.08em;--sdds-detail-04-tt:uppercase;--sdds-detail-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-05-ls:0;--sdds-detail-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-06-ls:0.08em;--sdds-detail-06-tt:uppercase;--sdds-detail-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-07-ls:0;--sdds-expressive-headline-01:normal normal bold 80px/80px \"Scania Sans Headline\", arial,\n helvetica, sans-serif;--sdds-expressive-headline-01-ls:0;--sdds-expressive-headline-02:normal normal bold 56px/56px \"Scania Sans Headline\", arial,\n helvetica, sans-serif;--sdds-expressive-headline-02-ls:0;--sdds-headline-ex-01:normal normal bold 40px/40px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-01-ls:0;--sdds-headline-ex-02:normal normal bold 32px/32px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-02-ls:-0.04em;--sdds-headline-ex-03:normal normal bold 24px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-03-ls:-0.03em;--sdds-headline-ex-04:normal normal bold 20px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-04-ls:-0.01em;--sdds-headline-ex-05:normal normal bold 16px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-05-ls:-0.02em;--sdds-headline-ex-06:normal normal bold 14px/16px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-06-ls:-0.02em;--sdds-headline-ex-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n sans-serif;--sdds-headline-ex-07-ls:-0.01em;--sdds-paragraph-ex-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-01-ls:-0.03em;--sdds-paragraph-ex-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-02-ls:-0.01em;--sdds-body-ex-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-01-ls:-0.02em;--sdds-body-ex-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-02-ls:-0.01em;--sdds-detail-ex-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-01-ls:-0.01em;--sdds-detail-ex-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-02-ls:-0.01em;--sdds-detail-ex-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-03-ls:-0.01em;--sdds-detail-ex-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-04-ls:0.08em;--sdds-detail-ex-04-tt:uppercase;--sdds-detail-ex-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-05-ls:0;--sdds-detail-ex-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-06-ls:0.08em;--sdds-detail-ex-06-tt:uppercase;--sdds-detail-ex-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-07-ls:0}:root,:host,::slotted(*),.sdds-theme-light{--sdds-link:var(--sdds-grey-958);--sdds-link-text-decoration:none;--sdds-dropdown-bg:var(--sdds-white);--sdds-dropdown-bg-hover:var(--sdds-grey-50)}:root .sdds-on-white-bg,:host .sdds-on-white-bg,::slotted(*) .sdds-on-white-bg,.sdds-theme-light .sdds-on-white-bg{--sdds-dropdown-bg:var(--sdds-grey-50);--sdds-dropdown-bg-hover:var(--sdds-grey-100)}:root{--sdds-headline-01:normal normal bold 40px/40px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-01-ls:0;--sdds-headline-02:normal normal bold 32px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-02-ls:-0.04em;--sdds-headline-03:normal normal bold 24px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-03-ls:-0.03em;--sdds-headline-04:normal normal bold 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-04-ls:-0.02em;--sdds-headline-05:normal normal bold 14px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-05-ls:-0.02em;--sdds-headline-06:normal normal bold 14px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-headline-06-ls:-0.02em;--sdds-headline-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n sans-serif;--sdds-headline-07-ls:-0.01em;--sdds-paragraph-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-01-ls:-0.03em;--sdds-paragraph-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-02-ls:-0.01em;--sdds-body-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-01-ls:-0.02em;--sdds-body-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-02-ls:-0.02em;--sdds-detail-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-01-ls:-0.01em;--sdds-detail-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-02-ls:-0.01em;--sdds-detail-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-03-ls:-0.01em;--sdds-detail-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-04-ls:0.08em;--sdds-detail-04-tt:uppercase;--sdds-detail-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-05-ls:0;--sdds-detail-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-06-ls:0.08em;--sdds-detail-06-tt:uppercase;--sdds-detail-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-07-ls:0;--sdds-expressive-headline-01:normal normal bold 80px/80px \"Scania Sans Headline\", arial,\n helvetica, sans-serif;--sdds-expressive-headline-01-ls:0;--sdds-expressive-headline-02:normal normal bold 56px/56px \"Scania Sans Headline\", arial,\n helvetica, sans-serif;--sdds-expressive-headline-02-ls:0;--sdds-headline-ex-01:normal normal bold 40px/40px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-01-ls:0;--sdds-headline-ex-02:normal normal bold 32px/32px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-02-ls:-0.04em;--sdds-headline-ex-03:normal normal bold 24px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-03-ls:-0.03em;--sdds-headline-ex-04:normal normal bold 20px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-04-ls:-0.01em;--sdds-headline-ex-05:normal normal bold 16px/24px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-05-ls:-0.02em;--sdds-headline-ex-06:normal normal bold 14px/16px \"Scania Sans Headline\", arial, helvetica,\n sans-serif;--sdds-headline-ex-06-ls:-0.02em;--sdds-headline-ex-07:normal normal bold 14px/16px \"Scania Sans Semi Condensed\", arial, helvetica,\n sans-serif;--sdds-headline-ex-07-ls:-0.01em;--sdds-paragraph-ex-01:normal normal normal 24px/32px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-01-ls:-0.03em;--sdds-paragraph-ex-02:normal normal normal 20px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-paragraph-ex-02-ls:-0.01em;--sdds-body-ex-01:normal normal normal 16px/24px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-01-ls:-0.02em;--sdds-body-ex-02:normal normal normal 14px/20px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-body-ex-02-ls:-0.01em;--sdds-detail-ex-01:normal normal normal 16px/24px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-01-ls:-0.01em;--sdds-detail-ex-02:normal normal normal 14px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-02-ls:-0.01em;--sdds-detail-ex-03:normal normal normal 14px/20px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-03-ls:-0.01em;--sdds-detail-ex-04:normal normal bold 12px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-04-ls:0.08em;--sdds-detail-ex-04-tt:uppercase;--sdds-detail-ex-05:normal normal normal 12px/16px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-05-ls:0;--sdds-detail-ex-06:normal normal bold 10px/16px \"Scania Sans\", arial, helvetica, sans-serif;--sdds-detail-ex-06-ls:0.08em;--sdds-detail-ex-06-tt:uppercase;--sdds-detail-ex-07:normal normal normal 10px/8px \"Scania Sans Semi Condensed\",\n \"Scania Sans Condensed\", arial, helvetica, sans-serif;--sdds-detail-ex-07-ls:0}:root,.sdds-theme-light{--sdds-checkbox-color:var(--sdds-grey-900);--sdds-checkbox-interaction-01:var(--sdds-blue-800);--sdds-checkbox-interaction-02:var(--sdds-white);--sdds-checkbox-bg-hover:var(--sdds-blue-800);--sdds-checkbox-bg-focus:var(--sdds-blue-800);--sdds-checkbox-disabled:var(--sdds-grey-400);--sdds-checkbox-bg-img:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-bg-img-disabled:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%23b0b7c4' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-border-color-disabled-after:var(--sdds-grey-500);--sdds-checkbox-color-disabled-after:var(--sdds-grey-500)}:root .sdds-theme-dark,.sdds-theme-light .sdds-theme-dark{--sdds-checkbox-color:var(--sdds-white);--sdds-checkbox-interaction-01:var(--sdds-white);--sdds-checkbox-interaction-02:var(--sdds-grey-958);--sdds-checkbox-bg-hover:white;--sdds-checkbox-bg-focus:white;--sdds-checkbox-disabled:white;--sdds-checkbox-bg-img:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%230D0F13' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-bg-img-disabled:url(\"data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1 2.33333L3.4 5C4.80589 3.4379 5.59411 2.5621 7 1' stroke='%2356657A' stroke-linecap='round' stroke-linejoin='round'/></svg>\");--sdds-checkbox-border-color-disabled-after:var(--sdds-grey-700);--sdds-checkbox-color-disabled-after:var(--sdds-grey-700)}.sdds-checkbox-item{box-sizing:border-box;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-checkbox-text);display:flex;align-items:center;margin-left:-4px}.sdds-checkbox-item *{box-sizing:border-box}.sdds-checkbox-item .sdds-form-input[type=checkbox]{appearance:none;outline:none;margin:0;border:0;border-radius:2px;width:24px;height:24px;position:relative;cursor:pointer}.sdds-checkbox-item .sdds-form-input[type=checkbox]+label{color:var(--sdds-checkbox-color);padding-left:var(--sdds-spacing-element-8);padding-top:var(--sdds-spacing-element-4);padding-bottom:var(--sdds-spacing-element-4);cursor:pointer}.sdds-checkbox-item .sdds-form-input[type=checkbox]::before,.sdds-checkbox-item .sdds-form-input[type=checkbox]::after{content:\"\";position:absolute;box-sizing:border-box;border-radius:2px}.sdds-checkbox-item .sdds-form-input[type=checkbox]::before{width:24px;height:24px;left:0;top:0}.sdds-checkbox-item .sdds-form-input[type=checkbox]::after{border:1px solid var(--sdds-checkbox-interaction-01);background-color:var(--sdds-checkbox-interaction-02);width:16px;height:16px;left:4px;top:4px}.sdds-checkbox-item .sdds-form-input[type=checkbox]:hover::before{background-color:var(--sdds-checkbox-bg-hover);opacity:0.12}.sdds-checkbox-item .sdds-form-input[type=checkbox]:focus::before{background-color:var(--sdds-checkbox-bg-focus);opacity:0.24;animation:cb-focus 0.4s cubic-bezier(0.65, 0.05, 0.38, 0.95) forwards}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled{cursor:not-allowed}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled::after,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled::after{border-color:var(--sdds-checkbox-border-color-disabled-after)}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled+label,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled+label{color:var(--sdds-grey-600);cursor:not-allowed}.sdds-checkbox-item .sdds-form-input[type=checkbox]:disabled:hover::before,.sdds-checkbox-item .sdds-form-input[type=checkbox].disabled:hover::before{display:none}.sdds-form-input[type=checkbox]:checked::after{background-image:var(--sdds-checkbox-bg-img);background-color:var(--sdds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.sdds-form-input[type=checkbox]:checked:disabled:hover::before,.sdds-form-input[type=checkbox]:checked:disabled::before,.sdds-form-input[type=checkbox]:checked.disabled:hover::before,.sdds-form-input[type=checkbox]:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.sdds-form-input[type=checkbox]:checked:disabled::after,.sdds-form-input[type=checkbox]:checked.disabled::after{background-image:var(--sdds-checkbox-bg-img-disabled);background-color:var(--sdds-checkbox-interaction-02);color:var(--sdds-checkbox-color-disabled-after)}@keyframes cb-focus{0%{transform:scale(0);opacity:0}50%{transform:scale(1);opacity:1}100%{transform:scale(1);opacity:0}}:host,::slotted(*){color:var(--sdds-grey-958);box-sizing:border-box;box-sizing:border-box}:host *,::slotted(*) *{box-sizing:border-box}:host,::slotted(*){--sdds-link:var(--sdds-grey-958);--sdds-link-text-decoration:none;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-958);box-sizing:border-box}:host{position:relative;z-index:auto}:host::part(dropdown-filter-disabled){cursor:not-allowed;caret-color:transparent;pointer-events:none;color:var(--sdds-grey-400);border:none}:host::part(dropdown-filter-disabled)::placeholder{color:var(--sdds-grey-400)}.sdds-dropdown{position:relative;display:flex;flex-flow:column wrap;width:100%;border:0}.sdds-dropdown,.sdds-dropdown *{box-sizing:border-box}.sdds-dropdown .sdds-dropdown-toggle{font:var(--sdds-detail-ex-02);letter-spacing:var(--sdds-detail-ex-02-ls);color:var(--sdds-grey-958);display:flex;align-items:center;background-color:var(--sdds-dropdown-bg);cursor:pointer;transition:box-shadow 0.1s ease-in, border-bottom-color 150ms ease;border-radius:4px 4px 0 0;border:none;border-bottom:1px solid var(--sdds-grey-400);box-shadow:none;width:100%;text-align:left;outline:none;padding:20px 16px;display:flex;align-items:center}.sdds-dropdown .sdds-dropdown-toggle:hover{border-bottom-color:var(--sdds-grey-600)}.sdds-dropdown .sdds-dropdown-toggle:focus::before{content:\" \";position:absolute;z-index:2;bottom:0;left:0;width:100%;border-bottom:2px solid var(--sdds-blue-400)}.sdds-dropdown .sdds-dropdown-toggle:active,.sdds-dropdown .sdds-dropdown-toggle.active .sdds-dropdown .sdds-dropdown-toggle.selected{border-bottom-color:var(--sdds-grey-800)}.sdds-dropdown .sdds-dropdown-toggle.is-filter{transition:border 0.1s ease-in 0.1s;cursor:text}.sdds-dropdown .sdds-dropdown-toggle-lg{padding:20px 16px}.sdds-dropdown .sdds-dropdown-toggle-md{padding:16px}.sdds-dropdown .sdds-dropdown-toggle-sm{padding:12px 16px}.sdds-dropdown .sdds-dropdown-toggle.sdds-dropdown-toggle-label-inside-lg{padding:20px 16px 16px}.sdds-dropdown .sdds-dropdown-toggle.sdds-dropdown-toggle-label-inside-md{padding:16px 16px 12px}.sdds-dropdown .sdds-dropdown-toggle--selected:not(:focus){border-bottom:1px solid var(--sdds-grey-800)}.sdds-dropdown .sdds-dropdown-arrow{width:20px;position:absolute;right:16px;color:inherit;transform:rotate(0);transition:transform ease 250ms}.sdds-dropdown .sdds-dropdown-placeholder{color:var(--sdds-grey-700)}.sdds-dropdown .sdds-dropdown-label{display:grid;width:calc(100% - 25px)}.sdds-dropdown .sdds-dropdown-label-container{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sdds-dropdown.sdds-dropdown.sdds-dropdown-sm .sdds-dropdown-label-container--label-inside{padding-bottom:12px}.sdds-dropdown .sdds-dropdown-filter{border:0;outline:none;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-958);width:100%;background:transparent}.sdds-dropdown .sdds-dropdown-filter:focus{outline:none}.sdds-dropdown .sdds-dropdown-filter::placeholder{color:var(--sdds-grey-700);opacity:1}.sdds-dropdown .sdds-dropdown-menu{z-index:10000;background-color:var(--sdds-white);position:absolute;top:100%;left:0;min-width:100%;max-height:360px;border-color:transparent;border-style:solid;border-width:0 1px;box-shadow:0 2px 3px 0 rgba(0, 0, 0, 0.1);border-left-color:var(--sdds-grey-100);border-right-color:var(--sdds-grey-100);overflow-x:hidden;overflow-y:auto;transform:scaleY(0);transform-origin:top;transition:transform 250ms ease}.sdds-dropdown .sdds-dropdown-menu::-webkit-scrollbar{width:4px;background-color:inherit}.sdds-dropdown .sdds-dropdown-menu::-webkit-scrollbar-thumb{background-color:var(--sdds-grey-300)}.sdds-dropdown .sdds-dropdown-menu ::-webkit-scrollbar-button{height:0;width:0}.sdds-dropdown.sdds-dropdown-lg .sdds-dropdown-toggle{height:56px}.sdds-dropdown.sdds-dropdown-md .sdds-dropdown-toggle{height:48px}.sdds-dropdown.sdds-dropdown-sm .sdds-dropdown-toggle{height:40px}:host(.sdds-dropdown--open-upwards) .sdds-dropdown .sdds-dropdown-menu{top:auto;bottom:100%;box-shadow:0 -1px 3px 0 rgba(0, 0, 0, 0.1);transform-origin:bottom}:host(.sdds-dropdown--open-upwards[label-position=outside]) span.sdds-dropdown-menu{bottom:calc(100% - 24px)}:host([disabled=true]){cursor:not-allowed}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle{pointer-events:none;color:var(--sdds-grey-400);border:none;padding:0 16px}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle .sdds-dropdown-placeholder{color:var(--sdds-grey-400)}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle .sdds-dropdown-label-inside{color:var(--sdds-grey-400)}:host([disabled=true]) .sdds-dropdown .sdds-dropdown-toggle:focus::before{content:none}:host(.sdds-dropdown--error) .sdds-dropdown .sdds-dropdown-toggle{border-color:var(--sdds-negative)}:host(.sdds-dropdown--error) .sdds-dropdown .sdds-dropdown-toggle:focus::before{border-color:var(--sdds-negative)}:host(.sdds-dropdown--error) .sdds-dropdown-helper{color:var(--sdds-negative)}:host(.sdds-dropdown--error) .sdds-dropdown-helper .sdds-dropdown-error-icon{display:flex}:host ::slotted(sdds-dropdown-option){display:flex;padding:var(--sdds-spacing-element-16);background-color:var(--sdds-white);border-top:1px solid transparent;border-bottom:1px solid var(--sdds-grey-100);opacity:0;visibility:hidden;cursor:pointer;box-sizing:border-box}:host ::slotted(sdds-dropdown-option:last-child){border-bottom-color:transparent;border-bottom-left-radius:4px;border-bottom-right-radius:4px}:host ::slotted(sdds-dropdown-option:hover),:host ::slotted(sdds-dropdown-option:focus){background-color:var(--sdds-dropdown-bg-hover)}:host ::slotted(sdds-dropdown-option:hover:not(:focus):not(sdds-dropdown-option.selected)){background-color:var(--sdds-dropdown-bg-hover)}:host ::slotted(sdds-dropdown-option:hover:focus){outline:none}:host ::slotted(sdds-dropdown-option:focus){outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host ::slotted(sdds-dropdown-option.sdds-dropdown--selected),:host ::slotted(sdds-dropdown-option.selected),:host ::slotted(sdds-dropdown-option.active),:host ::slotted(sdds-dropdown-option:active){background-color:var(--sdds-grey-300);border-top:1px solid var(--sdds-grey-300);border-bottom:1px solid var(--sdds-grey-300)}:host ::slotted(sdds-dropdown-option.sdds-option--no-result){cursor:not-allowed;pointer-events:none}:host ::slotted(sdds-dropdown-option.sdds-dropdown-option-disabled),:host ::slotted(sdds-dropdown-option.selected.sdds-dropdown-option-disabled){cursor:not-allowed;color:var(--sdds-grey-400);background-color:var(--sdds-white)}:host(.sdds-dropdown--open-upwards) ::slotted(sdds-dropdown-option:first-child){border-radius:4px 4px 0 0}:host(.sdds-dropdown--open-upwards) ::slotted(sdds-dropdown-option:last-child){border-radius:0;border-bottom:1px solid var(--sdds-grey-300)}.sdds-option-label{margin:auto 0;display:flex;align-content:center;text-decoration:none;flex-grow:2}.sdds-option-checkmark{color:inherit;opacity:0;transition:opacity 0.1s cubic-bezier(0.075, 0.82, 0.165, 1);margin-left:var(--sdds-spacing-element-16)}:host([size=sm]) ::slotted(sdds-dropdown-option){padding:var(--sdds-spacing-element-12) var(--sdds-spacing-element-16)}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-toggle{box-shadow:0 -1px 3px -1px rgba(0, 0, 0, 0.1);border-bottom-left-radius:0;border-bottom-right-radius:0}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-toggle.is-filter::before{content:\" \";position:absolute;z-index:2;bottom:0;left:0;width:100%;border-bottom:1px solid var(--sdds-blue-400)}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-arrow{transform:rotate(180deg)}:host(.sdds-dropdown--open) .sdds-dropdown .sdds-dropdown-menu{transform:scaleY(1)}:host(.sdds-dropdown--open) ::slotted(sdds-dropdown-option){visibility:visible;opacity:1}:host(.selected) .sdds-option-checkmark{opacity:1}.sdds-dropdown-label-inside{font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-700);position:absolute;transition:transform 250ms ease, color 200ms ease;width:calc(100% - 63px);overflow:hidden;text-overflow:ellipsis;transform:translate(0, -10px);font-size:10px}.sdds-dropdown-label-container.sdds-dropdown-label-container--label-inside .sdds-dropdown-placeholder{display:block;padding-top:4px}.sdds-dropdown-lg .sdds-dropdown-label-inside{display:block;top:16px}.sdds-dropdown-md .sdds-dropdown-label-inside{display:block;top:12px}.sdds-dropdown.sdds-dropdown-sm .sdds-dropdown-label-inside{display:none}.sdds-dropdown-multiselect-result{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sdds-option-checkbox{margin-right:8px}.sdds-form-label{display:flex}";
6
-
7
- const DropdownFilter = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
8
- constructor() {
9
- super();
10
- this.__registerHost();
11
- this.__attachShadow();
12
- this.dataOptions = [];
13
- this.filteredContent = [];
14
- this.searchTerm = '';
15
- this.selectedOptionState = undefined;
16
- this.dropdownRef = undefined;
17
- this.placeholder = '';
18
- this.label = undefined;
19
- this.defaultOption = undefined;
20
- this.selectedOption = undefined;
21
- this.disabled = undefined;
22
- this.size = 'lg';
23
- this.inline = false;
24
- this.labelPosition = 'no-label';
25
- this.state = 'default';
26
- this.helper = '';
27
- this.data = undefined;
28
- this.selectedLabel = 'no-selected';
29
- this.selectedValue = 'no-selected';
30
- }
31
- componentWillLoad() {
32
- this.parseData(this.data);
33
- if (this.defaultOption) {
34
- this.selectedOptionState = this.defaultOption;
35
- }
36
- }
37
- parseData(newValue) {
38
- if (newValue)
39
- this.dataOptions = JSON.parse(newValue);
40
- this.filteredContent = this.dataOptions;
41
- }
42
- updateOptionsContent(event) {
43
- this.searchTerm = event.detail;
44
- this.findData();
45
- }
46
- selectOptionHandler(event) {
47
- this.selectedOptionState = event.detail.value;
48
- this.selectedLabel = event.detail.label;
49
- this.selectedValue = event.detail.value;
50
- // Reset list when search is done and user have selected one option
51
- // To match with animation time for option list to fadeout first
52
- setTimeout(() => {
53
- this.filteredContent = this.dataOptions;
54
- }, 200);
55
- }
56
- findData() {
57
- const searchAsRegEx = new RegExp(this.searchTerm, 'gmi');
58
- this.filteredContent = this.dataOptions.filter(option => {
59
- if (option.label) {
60
- const listItem = option.label.toLowerCase();
61
- const searchResultList = listItem.match(searchAsRegEx);
62
- if (searchResultList) {
63
- return searchResultList;
64
- }
65
- this.selectedOptionState = null;
66
- this.selectedLabel = 'no-result';
67
- this.selectedValue = 'no-result';
68
- }
69
- });
70
- }
71
- setOptionsContent() {
72
- const newList = this.filteredContent.map(obj => (h("sdds-dropdown-option", { tabindex: "0", value: obj.value, class: `${this.selectedOptionState === obj.value ? 'selected' : ''}` }, obj.label)));
73
- if (newList.length > 0) {
74
- return newList;
75
- }
76
- return (h("sdds-dropdown-option", { tabindex: "-1", value: "no-result", class: "sdds-option--no-result" }, "No result"));
77
- }
78
- /** Use this method to reset the dropdown. Then it will go back to its initial state. */
79
- async resetOption() {
80
- var _a;
81
- await ((_a = this.dropdownRef) === null || _a === void 0 ? void 0 : _a.resetOption());
82
- }
83
- render() {
84
- return (h(Host, { "selected-value": this.selectedValue, "selected-text": this.selectedLabel }, h("sdds-dropdown", { ref: el => (this.dropdownRef = el), exportparts: "dropdown-filter-disabled", size: this.size, label: this.label, disabled: this.disabled, labelPosition: this.labelPosition, helper: this.helper, state: this.state, placeholder: this.placeholder, defaultOption: this.defaultOption, selectedOption: this.selectedOption, type: "filter", tabindex: this.disabled ? '-1' : null }, this.setOptionsContent())));
85
- }
86
- static get watchers() { return {
87
- "data": ["parseData"]
88
- }; }
89
- static get style() { return dropdownCss; }
90
- }, [1, "sdds-dropdown-filter", {
91
- "placeholder": [1],
92
- "label": [1],
93
- "defaultOption": [1, "default-option"],
94
- "selectedOption": [1, "selected-option"],
95
- "disabled": [4],
96
- "size": [1],
97
- "inline": [4],
98
- "labelPosition": [1, "label-position"],
99
- "state": [1],
100
- "helper": [1],
101
- "data": [1],
102
- "dataOptions": [32],
103
- "filteredContent": [32],
104
- "searchTerm": [32],
105
- "selectedOptionState": [32],
106
- "dropdownRef": [32],
107
- "selectedLabel": [32],
108
- "selectedValue": [32],
109
- "resetOption": [64]
110
- }, [[0, "inputSearch", "updateOptionsContent"], [0, "selectOption", "selectOptionHandler"]]]);
111
- function defineCustomElement$1() {
112
- if (typeof customElements === "undefined") {
113
- return;
114
- }
115
- const components = ["sdds-dropdown-filter", "sdds-dropdown", "sdds-dropdown-option"];
116
- components.forEach(tagName => { switch (tagName) {
117
- case "sdds-dropdown-filter":
118
- if (!customElements.get(tagName)) {
119
- customElements.define(tagName, DropdownFilter);
120
- }
121
- break;
122
- case "sdds-dropdown":
123
- if (!customElements.get(tagName)) {
124
- defineCustomElement$3();
125
- }
126
- break;
127
- case "sdds-dropdown-option":
128
- if (!customElements.get(tagName)) {
129
- defineCustomElement$2();
130
- }
131
- break;
132
- } });
133
- }
134
-
135
- const SddsDropdownFilter = DropdownFilter;
136
- const defineCustomElement = defineCustomElement$1;
137
-
138
- export { SddsDropdownFilter, defineCustomElement };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface SddsDropdownOption extends Components.SddsDropdownOption, HTMLElement {}
4
- export const SddsDropdownOption: {
5
- prototype: SddsDropdownOption;
6
- new (): SddsDropdownOption;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;
@@ -1,6 +0,0 @@
1
- import { D as DropdownOption, d as defineCustomElement$1 } from './dropdown-option.js';
2
-
3
- const SddsDropdownOption = DropdownOption;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { SddsDropdownOption, defineCustomElement };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface SddsDropdown extends Components.SddsDropdown, HTMLElement {}
4
- export const SddsDropdown: {
5
- prototype: SddsDropdown;
6
- new (): SddsDropdown;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;
@@ -1,6 +0,0 @@
1
- import { D as Dropdown, d as defineCustomElement$1 } from './dropdown.js';
2
-
3
- const SddsDropdown = Dropdown;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { SddsDropdown, defineCustomElement };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface SddsHeaderCell extends Components.SddsHeaderCell, HTMLElement {}
4
- export const SddsHeaderCell: {
5
- prototype: SddsHeaderCell;
6
- new (): SddsHeaderCell;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;
@@ -1,173 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
2
-
3
- const tableHeaderCellCss = ":host(.sdds-table__header-cell){box-sizing:border-box;font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);display:table-cell;text-align:left;color:var(--sdds-grey-958);background-color:var(--sdds-grey-300);border-bottom:1px solid var(--sdds-grey-400);padding:0;height:48px;min-width:192px;box-sizing:border-box;vertical-align:middle;overflow:hidden;transition:background-color 200ms ease}:host(.sdds-table__header-cell) *{box-sizing:border-box}:host(.sdds-table__header-cell) .sdds-table__header-text{padding:0 16px;margin:0}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button{display:flex;align-items:center;gap:8px;justify-content:start;flex-direction:row;width:100%;height:100%;padding:0 16px;background-color:transparent;border:none;cursor:pointer;transition:background-color 200ms ease}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button:focus .sdds-table__header-button-icon{opacity:1}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button .sdds-table__header-button-text{font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);text-align:left;color:var(--sdds-grey-958)}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button .sdds-table__header-button-icon{flex:0 0 16px;height:16px;opacity:0;transform-origin:center;transition:opacity 200ms ease-in, transform 200ms ease}:host(.sdds-table__header-cell--sortable) .sdds-table__header-button:hover .sdds-table__header-button-icon{opacity:1}:host(.sdds-table__header-cell--right-align) .sdds-table__header-button{text-align:right;justify-content:end;flex-direction:row-reverse}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button{background-color:var(--sdds-grey-500)}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button:hover{background-color:var(--sdds-grey-400)}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button .sdds-table__header-button-icon{opacity:1}:host(.sdds-table__header-cell--is-sorted) .sdds-table__header-button .sdds-table__header-button-icon--rotate{transform:rotate(180deg)}:host(.sdds-table--compact){height:33px}:host(.sdds-table--divider){border-right:1px solid var(--sdds-grey-400)}:host(.sdds-table--divider:last-of-type){border-right:none}:host(.sdds-table--no-min-width){min-width:unset}:host(.sdds-table__header-cell:first-of-type){border-top-left-radius:4px}:host(.sdds-table__header-cell:last-of-type){border-top-right-radius:4px}:host(.sdds-table--extra-column:first-of-type){border-top-left-radius:0}:host(.sdds-table--toolbar-available){border-radius:0}:host(.sdds-table--extra-column.sdds-table--toolbar-available){border-radius:0}:host(.sdds-table__header-cell.sdds-table--toolbar-available:first-of-type){border-top-left-radius:0}:host(.sdds-table__header-cell.sdds-table--toolbar-available:last-of-type){border-top-right-radius:0}";
4
-
5
- const relevantTableProps = [
6
- 'enableMultiselect',
7
- 'enableExpandableRows',
8
- 'compactDesign',
9
- 'noMinWidth',
10
- 'verticalDividers',
11
- 'whiteBackground',
12
- ];
13
- const TableHeaderCell = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
14
- constructor() {
15
- super();
16
- this.__registerHost();
17
- this.__attachShadow();
18
- this.sortColumnDataEvent = createEvent(this, "sortColumnDataEvent", 7);
19
- this.textAlignEvent = createEvent(this, "textAlignEvent", 7);
20
- this.headCellHoverEvent = createEvent(this, "headCellHoverEvent", 7);
21
- this.sortButtonClick = (key) => {
22
- // Toggling direction of sorting as we only use one button for sorting
23
- if (this.sortingDirection !== 'asc') {
24
- this.sortingDirection = 'asc';
25
- }
26
- else {
27
- this.sortingDirection = 'desc';
28
- }
29
- // Setting to true we can set enable CSS class for "active" state of column
30
- this.sortedByMyKey = true;
31
- // Use array to send both key and sorting direction
32
- this.sortColumnDataEvent.emit([this.tableId, key, this.sortingDirection]);
33
- };
34
- this.headerCellContent = () => {
35
- if (this.sortable && !this.disableSortingBtn) {
36
- return (h("button", { class: "sdds-table__header-button", onClick: () => this.sortButtonClick(this.columnKey) }, h("span", { class: "sdds-table__header-button-text", style: { textAlign: this.textAlignState } }, this.columnTitle), this.sortingDirection === '' && (h("svg", { class: "sdds-table__header-button-icon", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 15" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8.45 13.67V4.62a.5.5 0 0 1 1 0v9.05h-1Z", fill: "currentColor" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6.07 10.28a.5.5 0 0 1 .7.08l2.1 2.66a.1.1 0 0 0 .15 0l2.09-2.66a.5.5 0 1 1 .78.62l-2.08 2.66a1.1 1.1 0 0 1-1.73 0l-2.1-2.66a.5.5 0 0 1 .1-.7ZM3.55.4v9.04a.5.5 0 1 1-1 0V.39h1Z", fill: "currentColor" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5.93 3.78a.5.5 0 0 1-.7-.08l-2.1-2.66a.1.1 0 0 0-.15 0L.89 3.7a.5.5 0 0 1-.78-.62L2.19.42a1.1 1.1 0 0 1 1.73 0l2.1 2.66a.5.5 0 0 1-.1.7Z", fill: "currentColor" }))), this.sortingDirection !== '' && (h("svg", { class: `sdds-table__header-button-icon ${this.sortingDirection === 'desc' ? 'sdds-table__header-button-icon--rotate' : ''}`, fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M17 2.974a1 1 0 0 0-2 0v24.3l-9.312-9.312a1 1 0 0 0-1.414 1.414l9.887 9.888a2.6 2.6 0 0 0 3.677 0l9.888-9.888a1 1 0 0 0-1.414-1.414L17 27.274v-24.3Z", fill: "currentColor" })))));
37
- }
38
- return (h("p", { class: "sdds-table__header-text", style: { textAlign: this.textAlignState } }, this.columnTitle));
39
- };
40
- this.onHeadCellHover = (key) => {
41
- this.headCellHoverEvent.emit([this.tableId, key]);
42
- };
43
- this.columnKey = undefined;
44
- this.columnTitle = undefined;
45
- this.customWidth = undefined;
46
- this.sortable = false;
47
- this.textAlign = undefined;
48
- this.textAlignState = undefined;
49
- this.sortingDirection = '';
50
- this.sortedByMyKey = false;
51
- this.disableSortingBtn = false;
52
- this.verticalDividers = false;
53
- this.compactDesign = false;
54
- this.noMinWidth = false;
55
- this.whiteBackground = false;
56
- this.enableMultiselect = false;
57
- this.enableToolbarDesign = false;
58
- this.tableId = '';
59
- this.enableExpandableRows = false;
60
- }
61
- tablePropsChangedEventListener(event) {
62
- if (this.tableId === event.detail.tableId) {
63
- event.detail.changed
64
- .filter((changedProp) => relevantTableProps.includes(changedProp))
65
- .forEach((changedProp) => {
66
- if (typeof this[changedProp] === 'undefined') {
67
- throw new Error(`Table prop is not supported: ${changedProp}`);
68
- }
69
- this[changedProp] = event.detail[changedProp];
70
- });
71
- }
72
- }
73
- // Listen to parent data-table if sorting is allowed
74
- sortingSwitcherEventListener(event) {
75
- const [receivedID, receivedSortingStatus] = event.detail;
76
- if (this.tableId === receivedID) {
77
- this.disableSortingBtn = receivedSortingStatus;
78
- }
79
- }
80
- // target is set to body so other instances of same component "listen" and react to the change
81
- updateOptionsContent(event) {
82
- if (this.tableId === event.detail[0]) {
83
- // grab only value at position 1 as it is the "key"
84
- if (this.columnKey !== event.detail[1]) {
85
- this.sortedByMyKey = false;
86
- // To sync with CSS transition timing
87
- setTimeout(() => {
88
- this.sortingDirection = '';
89
- }, 200);
90
- }
91
- }
92
- }
93
- enableMultiselectEventListener(event) {
94
- if (this.tableId === event.detail[0])
95
- [, this.enableMultiselect] = event.detail;
96
- }
97
- connectedCallback() {
98
- this.tableEl = this.host.closest('sdds-table');
99
- this.tableId = this.tableEl.tableId;
100
- }
101
- componentWillLoad() {
102
- relevantTableProps.forEach((tablePropName) => {
103
- this[tablePropName] = this.tableEl[tablePropName];
104
- });
105
- }
106
- componentWillRender() {
107
- // enable only right or left text align
108
- if (this.textAlign === 'right' || this.textAlign === 'end') {
109
- this.textAlignState = 'right';
110
- }
111
- else {
112
- this.textAlignState = 'left';
113
- }
114
- // To enable body cells text align per rules set in head cell
115
- this.textAlignEvent.emit([this.tableId, this.columnKey, this.textAlignState]);
116
- this.enableToolbarDesign =
117
- this.host.closest('sdds-table').getElementsByTagName('sdds-table-toolbar').length >= 1;
118
- }
119
- render() {
120
- return (h(Host, { class: {
121
- 'sdds-table__header-cell': true,
122
- 'sdds-table__header-cell--sortable': this.sortable,
123
- 'sdds-table__header-cell--is-sorted': this.sortedByMyKey,
124
- 'sdds-table__header-cell--custom-width': this.customWidth !== '',
125
- 'sdds-table__header-cell--right-align': this.textAlignState === 'right',
126
- 'sdds-table--compact': this.compactDesign,
127
- 'sdds-table--divider': this.verticalDividers,
128
- 'sdds-table--no-min-width': this.noMinWidth,
129
- 'sdds-table--extra-column': this.enableMultiselect || this.enableExpandableRows,
130
- 'sdds-table--toolbar-available': this.enableToolbarDesign,
131
- }, style: { width: this.customWidth },
132
- // Calling actions from here to enable hover functionality for both sortable and un-sortable tables
133
- onMouseOver: () => this.onHeadCellHover(this.columnKey), onMouseLeave: () => this.onHeadCellHover('') }, this.headerCellContent()));
134
- }
135
- get host() { return this; }
136
- static get style() { return tableHeaderCellCss; }
137
- }, [1, "sdds-header-cell", {
138
- "columnKey": [513, "column-key"],
139
- "columnTitle": [513, "column-title"],
140
- "customWidth": [513, "custom-width"],
141
- "sortable": [4],
142
- "textAlign": [513, "text-align"],
143
- "textAlignState": [32],
144
- "sortingDirection": [32],
145
- "sortedByMyKey": [32],
146
- "disableSortingBtn": [32],
147
- "verticalDividers": [32],
148
- "compactDesign": [32],
149
- "noMinWidth": [32],
150
- "whiteBackground": [32],
151
- "enableMultiselect": [32],
152
- "enableToolbarDesign": [32],
153
- "tableId": [32],
154
- "enableExpandableRows": [32]
155
- }, [[16, "tablePropsChangedEvent", "tablePropsChangedEventListener"], [16, "sortingSwitcherEvent", "sortingSwitcherEventListener"], [16, "sortColumnDataEvent", "updateOptionsContent"], [16, "enableMultiselectEvent", "enableMultiselectEventListener"]]]);
156
- function defineCustomElement$1() {
157
- if (typeof customElements === "undefined") {
158
- return;
159
- }
160
- const components = ["sdds-header-cell"];
161
- components.forEach(tagName => { switch (tagName) {
162
- case "sdds-header-cell":
163
- if (!customElements.get(tagName)) {
164
- customElements.define(tagName, TableHeaderCell);
165
- }
166
- break;
167
- } });
168
- }
169
-
170
- const SddsHeaderCell = TableHeaderCell;
171
- const defineCustomElement = defineCustomElement$1;
172
-
173
- export { SddsHeaderCell, defineCustomElement };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface SddsIcon extends Components.SddsIcon, HTMLElement {}
4
- export const SddsIcon: {
5
- prototype: SddsIcon;
6
- new (): SddsIcon;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;
@@ -1,6 +0,0 @@
1
- import { I as Icon, d as defineCustomElement$1 } from './icon.js';
2
-
3
- const SddsIcon = Icon;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { SddsIcon, defineCustomElement };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface SddsInlineTabsFullbleed extends Components.SddsInlineTabsFullbleed, HTMLElement {}
4
- export const SddsInlineTabsFullbleed: {
5
- prototype: SddsInlineTabsFullbleed;
6
- new (): SddsInlineTabsFullbleed;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;
@@ -1,115 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
-
3
- const inlineTabsFullbleedCss = ".sdds-inline-tabs-fullbleed{box-sizing:border-box;display:flex;position:relative;}.sdds-inline-tabs-fullbleed *{box-sizing:border-box}.sdds-inline-tabs-fullbleed::after{content:\" \";display:block;border-bottom:1px solid var(--sdds-inline-tabs-fullbleed-horizontal-divider-bg);left:0;right:0;bottom:0;position:absolute}.sdds-inline-tabs-fullbleed-wrapper{display:flex;flex-wrap:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none}.sdds-inline-tabs-fullbleed-wrapper::-webkit-scrollbar{display:none}.sdds-inline-tabs-fullbleed--forward{cursor:pointer;width:48px;height:100%;border:0;position:absolute;right:0;top:0;background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-bg);display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none}.sdds-inline-tabs-fullbleed--forward__show{opacity:1;pointer-events:all}.sdds-inline-tabs-fullbleed--forward:hover{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-hover-bg)}.sdds-inline-tabs-fullbleed--forward:active{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-active-bg)}.sdds-inline-tabs-fullbleed--forward:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-inline-tabs-fullbleed--back{cursor:pointer;width:48px;height:100%;border:0;position:absolute;left:0;top:0;background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-bg);display:flex;justify-content:center;align-items:center;opacity:0;pointer-events:none}.sdds-inline-tabs-fullbleed--back__show{opacity:1;pointer-events:all}.sdds-inline-tabs-fullbleed--back:hover{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-hover-bg)}.sdds-inline-tabs-fullbleed--back:active{background-color:var(--sdds-inline-tabs-fullbleed-scroll-btn-active-bg)}.sdds-inline-tabs-fullbleed--back:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-inline-tabs-fullbleed-centered{justify-content:center}::slotted(.sdds-inline-tabs-fullbleed--tab){font:var(--sdds-headline-07);letter-spacing:var(--sdds-headline-07-ls);color:rgba(0, 21, 51, 0.6);padding:16px 0;margin-right:32px;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out;white-space:nowrap;text-align:left}::slotted(.sdds-inline-tabs-fullbleed--tab)::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0;margin-right:auto;height:2px;background-color:var(--sdds-inline-tabs-fullbleed-tab-hover-indicator-bg);transition:width 0.15s ease-in-out;z-index:10}::slotted(.sdds-inline-tabs-fullbleed--tab:first-child){margin-left:32px}::slotted(.sdds-inline-tabs-fullbleed--tab:last-child){margin-right:32px}::slotted(.sdds-inline-tabs-fullbleed--tab:hover){color:var(--sdds-inline-tabs-fullbleed-tab-hover-color)}::slotted(.sdds-inline-tabs-fullbleed--tab:hover)::after{width:100%}::slotted(.sdds-inline-tabs-fullbleed--tab:focus){outline:2px solid var(--sdds-blue-400);outline-offset:-2px;color:var(--sdds-inline-tabs-fullbleed-tab-focus-color)}::slotted(.sdds-inline-tabs-fullbleed--tab:focus)::after{width:0}::slotted(.sdds-inline-tabs-fullbleed--tab__active){color:var(--sdds-inline-tabs-fullbleed-tab-active-color)}::slotted(.sdds-inline-tabs-fullbleed--tab__active)::after{width:100%;background-color:var(--sdds-inline-tabs-fullbleed-tab-active-indicator-bg)}::slotted(.sdds-inline-tabs-fullbleed--tab__active:focus)::after{width:100%}::slotted(.sdds-inline-tabs-fullbleed--tab__disabled){color:var(--sdds-inline-tabs-fullbleed-tab-active-color);pointer-events:none;opacity:0.16}.sdds-inline-tabs-fullbleed-primary{background-color:var(--sdds-white)}.sdds-inline-tabs-fullbleed-primary .sdds-inline-tabs-fullbleed--forward{background-color:var(--sdds-white)}.sdds-inline-tabs-fullbleed-primary .sdds-inline-tabs-fullbleed--back{background-color:var(--sdds-white)}.sdds-inline-tabs-fullbleed-secondary{background-color:var(--sdds-grey-50)}.sdds-inline-tabs-fullbleed-secondary .sdds-inline-tabs-fullbleed--forward{background-color:var(--sdds-grey-50)}.sdds-inline-tabs-fullbleed-secondary .sdds-inline-tabs-fullbleed--back{background-color:var(--sdds-grey-50)}";
4
-
5
- const InlineTabsFullbleed = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
- constructor() {
7
- super();
8
- this.__registerHost();
9
- this.__attachShadow();
10
- this.navWrapperElement = null; // reference to container with nav buttons
11
- this.componentWidth = 0; // visible width of this component
12
- this.buttonsWidth = 0; // total width of all nav items combined
13
- this.scrollWidth = 0; // total amount that is possible to scroll in the nav wrapper
14
- this.buttonWidth = 0; // current calculated width of the largest nav button
15
- this.modeVariant = 'primary';
16
- this.tabs = [];
17
- this.showLeftScroll = false;
18
- this.showRightScroll = false;
19
- }
20
- componentDidRender() {
21
- this._calculateButtonWidth();
22
- }
23
- componentDidLoad() {
24
- const resizeObserver = new ResizeObserver((entries) => {
25
- for (const entry of entries) {
26
- const componentWidth = entry.contentRect.width;
27
- let buttonsWidth = 0;
28
- const navButtons = Array.from(this.host.children);
29
- navButtons.forEach((navButton) => {
30
- const style = window.getComputedStyle(navButton);
31
- buttonsWidth +=
32
- navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);
33
- navButton.classList.add('sdds-inline-tabs-fullbleed--tab');
34
- });
35
- this.componentWidth = componentWidth;
36
- this.buttonsWidth = buttonsWidth;
37
- this.scrollWidth = buttonsWidth - componentWidth;
38
- if (this.buttonsWidth > this.componentWidth) {
39
- this._evaluateScrollButtons();
40
- }
41
- else {
42
- this.showLeftScroll = false;
43
- this.showRightScroll = false;
44
- }
45
- }
46
- });
47
- resizeObserver.observe(this.navWrapperElement);
48
- this._calculateButtonWidth();
49
- }
50
- _calculateButtonWidth() {
51
- let best = 0;
52
- const navButtons = Array.from(this.host.children);
53
- navButtons.forEach((navButton) => {
54
- const style = window.getComputedStyle(navButton);
55
- const width = navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);
56
- if (width > best) {
57
- best = width;
58
- }
59
- });
60
- this.buttonWidth = best;
61
- }
62
- _scrollRight() {
63
- const scroll = this.navWrapperElement.scrollLeft;
64
- this.navWrapperElement.scrollLeft = scroll + this.buttonWidth;
65
- this._evaluateScrollButtons();
66
- }
67
- _scrollLeft() {
68
- const scroll = this.navWrapperElement.scrollLeft;
69
- this.navWrapperElement.scrollLeft = scroll - this.buttonWidth;
70
- this._evaluateScrollButtons();
71
- }
72
- _evaluateScrollButtons() {
73
- const scroll = this.navWrapperElement.scrollLeft;
74
- if (scroll >= this.scrollWidth) {
75
- this.showRightScroll = false;
76
- }
77
- else {
78
- this.showRightScroll = true;
79
- }
80
- if (scroll <= 0) {
81
- this.showLeftScroll = false;
82
- }
83
- else {
84
- this.showLeftScroll = true;
85
- }
86
- }
87
- render() {
88
- return (h(Host, null, h("div", { class: `sdds-inline-tabs-fullbleed sdds-inline-tabs-fullbleed-${this.modeVariant}` }, h("div", { class: "sdds-inline-tabs-fullbleed-wrapper", ref: (el) => (this.navWrapperElement = el) }, h("slot", null)), h("div", { class: "sdds-inline-tabs-fullbleed-navigation" }, h("button", { class: `sdds-inline-tabs-fullbleed--forward ${this.showRightScroll ? 'sdds-inline-tabs-fullbleed--back__show' : ''}`, onClick: () => this._scrollRight() }, h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6.1147 17.3291C5.87062 17.0851 5.87062 16.6893 6.1147 16.4453L12.2948 10.2652C12.4412 10.1187 12.4412 9.8813 12.2948 9.73485L6.1147 3.55476C5.87062 3.31068 5.87062 2.91496 6.1147 2.67088C6.35878 2.4268 6.75451 2.4268 6.99858 2.67088L13.1787 8.85097C13.8133 9.48557 13.8133 10.5145 13.1787 11.1491L6.99858 17.3291C6.75451 17.5732 6.35878 17.5732 6.1147 17.3291Z", fill: "#0D0F13" }))), h("button", { class: `sdds-inline-tabs-fullbleed--back ${this.showLeftScroll ? 'sdds-inline-tabs-fullbleed--back__show' : ''}`, onClick: () => this._scrollLeft() }, h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.8853 2.67085C14.1294 2.91493 14.1294 3.31066 13.8853 3.55473L7.70522 9.73482C7.55878 9.88127 7.55878 10.1187 7.70522 10.2652L13.8853 16.4452C14.1294 16.6893 14.1294 17.085 13.8853 17.3291C13.6412 17.5732 13.2455 17.5732 13.0014 17.3291L6.82134 11.149C6.18674 10.5144 6.18674 9.48554 6.82134 8.85094L13.0014 2.67085C13.2455 2.42677 13.6412 2.42677 13.8853 2.67085Z", fill: "#0D0F13" })))))));
89
- }
90
- get host() { return this; }
91
- static get style() { return inlineTabsFullbleedCss; }
92
- }, [1, "sdds-inline-tabs-fullbleed", {
93
- "modeVariant": [1, "mode-variant"],
94
- "tabs": [32],
95
- "showLeftScroll": [32],
96
- "showRightScroll": [32]
97
- }]);
98
- function defineCustomElement$1() {
99
- if (typeof customElements === "undefined") {
100
- return;
101
- }
102
- const components = ["sdds-inline-tabs-fullbleed"];
103
- components.forEach(tagName => { switch (tagName) {
104
- case "sdds-inline-tabs-fullbleed":
105
- if (!customElements.get(tagName)) {
106
- customElements.define(tagName, InlineTabsFullbleed);
107
- }
108
- break;
109
- } });
110
- }
111
-
112
- const SddsInlineTabsFullbleed = InlineTabsFullbleed;
113
- const defineCustomElement = defineCustomElement$1;
114
-
115
- export { SddsInlineTabsFullbleed, defineCustomElement };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface SddsInlineTabs extends Components.SddsInlineTabs, HTMLElement {}
4
- export const SddsInlineTabs: {
5
- prototype: SddsInlineTabs;
6
- new (): SddsInlineTabs;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;