@scania/tegel 0.0.1-beta.7 → 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 (281) hide show
  1. package/package.json +1 -1
  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/badge/badges.css +0 -42
  41. package/dist/collection/components/badge/badges.js +0 -150
  42. package/dist/collection/components/button/button-component.js +0 -154
  43. package/dist/collection/components/button/button.css +0 -658
  44. package/dist/collection/components/data-table/table/table.css +0 -15
  45. package/dist/collection/components/data-table/table/table.js +0 -253
  46. package/dist/collection/components/data-table/table-body/table-body.css +0 -22
  47. package/dist/collection/components/data-table/table-body/table-body.js +0 -425
  48. package/dist/collection/components/data-table/table-body-cell/table-body-cell.css +0 -40
  49. package/dist/collection/components/data-table/table-body-cell/table-body-cell.js +0 -169
  50. package/dist/collection/components/data-table/table-body-row/table-body-row.css +0 -196
  51. package/dist/collection/components/data-table/table-body-row/table-body-row.js +0 -164
  52. package/dist/collection/components/data-table/table-body-row-expandable/table-body-row-expandable.css +0 -79
  53. package/dist/collection/components/data-table/table-body-row-expandable/table-body-row-expandable.js +0 -155
  54. package/dist/collection/components/data-table/table-footer/table-footer.css +0 -93
  55. package/dist/collection/components/data-table/table-footer/table-footer.js +0 -355
  56. package/dist/collection/components/data-table/table-header/table-header.css +0 -204
  57. package/dist/collection/components/data-table/table-header/table-header.js +0 -153
  58. package/dist/collection/components/data-table/table-header-cell/table-header-cell.css +0 -126
  59. package/dist/collection/components/data-table/table-header-cell/table-header-cell.js +0 -320
  60. package/dist/collection/components/data-table/table-toolbar/table-toolbar.css +0 -92
  61. package/dist/collection/components/data-table/table-toolbar/table-toolbar.js +0 -142
  62. package/dist/collection/components/datetime/datetime.css +0 -375
  63. package/dist/collection/components/datetime/datetime.js +0 -251
  64. package/dist/collection/components/dropdown/dropdown-filter/dropdown-filter.js +0 -339
  65. package/dist/collection/components/dropdown/dropdown-option/dropdown-option.js +0 -185
  66. package/dist/collection/components/dropdown/dropdown.css +0 -891
  67. package/dist/collection/components/dropdown/dropdown.js +0 -554
  68. package/dist/collection/components/icon/icon.css +0 -16
  69. package/dist/collection/components/icon/icon.js +0 -89
  70. package/dist/collection/components/icon/iconsArray.js +0 -2
  71. package/dist/collection/components/modal/modal.css +0 -324
  72. package/dist/collection/components/modal/modal.js +0 -146
  73. package/dist/collection/components/popover-canvas/popover-canvas.css +0 -20
  74. package/dist/collection/components/popover-canvas/popover-canvas.js +0 -190
  75. package/dist/collection/components/popover-menu/popover-menu.css +0 -19
  76. package/dist/collection/components/popover-menu/popover-menu.js +0 -189
  77. package/dist/collection/components/slider/slider.css +0 -260
  78. package/dist/collection/components/slider/slider.js +0 -682
  79. package/dist/collection/components/spinner/spinner.css +0 -79
  80. package/dist/collection/components/spinner/spinner.js +0 -61
  81. package/dist/collection/components/tabs/inline-tabs-default/inline-tabs.css +0 -159
  82. package/dist/collection/components/tabs/inline-tabs-default/inline-tabs.js +0 -302
  83. package/dist/collection/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.css +0 -172
  84. package/dist/collection/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.js +0 -126
  85. package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.css +0 -153
  86. package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.js +0 -103
  87. package/dist/collection/components/textarea/textarea.css +0 -283
  88. package/dist/collection/components/textarea/textarea.js +0 -336
  89. package/dist/collection/components/textfield/textfield.css +0 -494
  90. package/dist/collection/components/textfield/textfield.js +0 -359
  91. package/dist/collection/components/tooltip/tooltip.css +0 -46
  92. package/dist/collection/components/tooltip/tooltip.js +0 -200
  93. package/dist/collection/index.js +0 -1
  94. package/dist/collection/stories/assets/code-brackets.svg +0 -1
  95. package/dist/collection/stories/assets/colors.svg +0 -1
  96. package/dist/collection/stories/assets/comments.svg +0 -1
  97. package/dist/collection/stories/assets/direction.svg +0 -1
  98. package/dist/collection/stories/assets/flow.svg +0 -1
  99. package/dist/collection/stories/assets/plugin.svg +0 -1
  100. package/dist/collection/stories/assets/repo.svg +0 -1
  101. package/dist/collection/stories/assets/stackalt.svg +0 -1
  102. package/dist/collection/utils/utils.js +0 -12
  103. package/dist/components/dropdown-option.js +0 -100
  104. package/dist/components/dropdown.js +0 -296
  105. package/dist/components/icon.js +0 -58
  106. package/dist/components/index.d.ts +0 -50
  107. package/dist/components/index.js +0 -30
  108. package/dist/components/popper.js +0 -1799
  109. package/dist/components/sdds-accordion-item.d.ts +0 -11
  110. package/dist/components/sdds-accordion-item.js +0 -60
  111. package/dist/components/sdds-accordion.d.ts +0 -11
  112. package/dist/components/sdds-accordion.js +0 -38
  113. package/dist/components/sdds-badges.d.ts +0 -11
  114. package/dist/components/sdds-badges.js +0 -76
  115. package/dist/components/sdds-body-cell.d.ts +0 -11
  116. package/dist/components/sdds-body-cell.js +0 -6
  117. package/dist/components/sdds-button.d.ts +0 -11
  118. package/dist/components/sdds-button.js +0 -58
  119. package/dist/components/sdds-datetime.d.ts +0 -11
  120. package/dist/components/sdds-datetime.js +0 -90
  121. package/dist/components/sdds-dropdown-filter.d.ts +0 -11
  122. package/dist/components/sdds-dropdown-filter.js +0 -138
  123. package/dist/components/sdds-dropdown-option.d.ts +0 -11
  124. package/dist/components/sdds-dropdown-option.js +0 -6
  125. package/dist/components/sdds-dropdown.d.ts +0 -11
  126. package/dist/components/sdds-dropdown.js +0 -6
  127. package/dist/components/sdds-header-cell.d.ts +0 -11
  128. package/dist/components/sdds-header-cell.js +0 -173
  129. package/dist/components/sdds-icon.d.ts +0 -11
  130. package/dist/components/sdds-icon.js +0 -6
  131. package/dist/components/sdds-inline-tabs-fullbleed.d.ts +0 -11
  132. package/dist/components/sdds-inline-tabs-fullbleed.js +0 -115
  133. package/dist/components/sdds-inline-tabs.d.ts +0 -11
  134. package/dist/components/sdds-inline-tabs.js +0 -235
  135. package/dist/components/sdds-modal.d.ts +0 -11
  136. package/dist/components/sdds-modal.js +0 -69
  137. package/dist/components/sdds-navigation-tabs.d.ts +0 -11
  138. package/dist/components/sdds-navigation-tabs.js +0 -113
  139. package/dist/components/sdds-popover-canvas.d.ts +0 -11
  140. package/dist/components/sdds-popover-canvas.js +0 -97
  141. package/dist/components/sdds-popover-menu.d.ts +0 -11
  142. package/dist/components/sdds-popover-menu.js +0 -96
  143. package/dist/components/sdds-slider.d.ts +0 -11
  144. package/dist/components/sdds-slider.js +0 -366
  145. package/dist/components/sdds-spinner.d.ts +0 -11
  146. package/dist/components/sdds-spinner.js +0 -37
  147. package/dist/components/sdds-table-body-row-expandable.d.ts +0 -11
  148. package/dist/components/sdds-table-body-row-expandable.js +0 -104
  149. package/dist/components/sdds-table-body-row.d.ts +0 -11
  150. package/dist/components/sdds-table-body-row.js +0 -6
  151. package/dist/components/sdds-table-body.d.ts +0 -11
  152. package/dist/components/sdds-table-body.js +0 -337
  153. package/dist/components/sdds-table-footer.d.ts +0 -11
  154. package/dist/components/sdds-table-footer.js +0 -196
  155. package/dist/components/sdds-table-header.d.ts +0 -11
  156. package/dist/components/sdds-table-header.js +0 -125
  157. package/dist/components/sdds-table-toolbar.d.ts +0 -11
  158. package/dist/components/sdds-table-toolbar.js +0 -88
  159. package/dist/components/sdds-table.d.ts +0 -11
  160. package/dist/components/sdds-table.js +0 -92
  161. package/dist/components/sdds-textarea.d.ts +0 -11
  162. package/dist/components/sdds-textarea.js +0 -90
  163. package/dist/components/sdds-textfield.d.ts +0 -11
  164. package/dist/components/sdds-textfield.js +0 -111
  165. package/dist/components/sdds-tooltip.d.ts +0 -11
  166. package/dist/components/sdds-tooltip.js +0 -116
  167. package/dist/components/table-body-cell.js +0 -102
  168. package/dist/components/table-body-row.js +0 -119
  169. package/dist/esm/index-b67b15a6.js +0 -1884
  170. package/dist/esm/index.js +0 -1
  171. package/dist/esm/loader.js +0 -17
  172. package/dist/esm/polyfills/core-js.js +0 -11
  173. package/dist/esm/polyfills/css-shim.js +0 -1
  174. package/dist/esm/polyfills/dom.js +0 -79
  175. package/dist/esm/polyfills/es5-html-element.js +0 -1
  176. package/dist/esm/polyfills/index.js +0 -34
  177. package/dist/esm/polyfills/system.js +0 -6
  178. package/dist/esm/popper-f860750c.js +0 -1799
  179. package/dist/esm/sdds-accordion-item.entry.js +0 -30
  180. package/dist/esm/sdds-accordion.entry.js +0 -17
  181. package/dist/esm/sdds-badges.entry.js +0 -51
  182. package/dist/esm/sdds-body-cell_2.entry.js +0 -168
  183. package/dist/esm/sdds-button.entry.js +0 -32
  184. package/dist/esm/sdds-datetime.entry.js +0 -62
  185. package/dist/esm/sdds-dropdown-filter.entry.js +0 -88
  186. package/dist/esm/sdds-dropdown_2.entry.js +0 -330
  187. package/dist/esm/sdds-header-cell.entry.js +0 -137
  188. package/dist/esm/sdds-icon.entry.js +0 -38
  189. package/dist/esm/sdds-inline-tabs-fullbleed.entry.js +0 -92
  190. package/dist/esm/sdds-inline-tabs.entry.js +0 -207
  191. package/dist/esm/sdds-modal.entry.js +0 -45
  192. package/dist/esm/sdds-navigation-tabs.entry.js +0 -91
  193. package/dist/esm/sdds-popover-canvas.entry.js +0 -72
  194. package/dist/esm/sdds-popover-menu.entry.js +0 -71
  195. package/dist/esm/sdds-slider.entry.js +0 -332
  196. package/dist/esm/sdds-spinner.entry.js +0 -17
  197. package/dist/esm/sdds-table-body-row-expandable.entry.js +0 -77
  198. package/dist/esm/sdds-table-body.entry.js +0 -285
  199. package/dist/esm/sdds-table-footer.entry.js +0 -161
  200. package/dist/esm/sdds-table-header.entry.js +0 -96
  201. package/dist/esm/sdds-table-toolbar.entry.js +0 -62
  202. package/dist/esm/sdds-table.entry.js +0 -65
  203. package/dist/esm/sdds-textarea.entry.js +0 -57
  204. package/dist/esm/sdds-textfield.entry.js +0 -78
  205. package/dist/esm/sdds-tooltip.entry.js +0 -91
  206. package/dist/esm/tegel.js +0 -17
  207. package/dist/index.cjs.js +0 -1
  208. package/dist/index.js +0 -1
  209. package/dist/node_modules/@types/jest/index.d.ts +0 -1512
  210. package/dist/tegel/index.esm.js +0 -0
  211. package/dist/tegel/p-040efb32.entry.js +0 -1
  212. package/dist/tegel/p-12ca5cfa.entry.js +0 -1
  213. package/dist/tegel/p-157e1618.js +0 -2
  214. package/dist/tegel/p-1fe61cf6.entry.js +0 -1
  215. package/dist/tegel/p-2f376504.entry.js +0 -1
  216. package/dist/tegel/p-44ced895.entry.js +0 -1
  217. package/dist/tegel/p-4880f03d.entry.js +0 -1
  218. package/dist/tegel/p-4aba73a3.entry.js +0 -1
  219. package/dist/tegel/p-4b58a02c.entry.js +0 -1
  220. package/dist/tegel/p-4cb85347.entry.js +0 -1
  221. package/dist/tegel/p-52031b5a.entry.js +0 -1
  222. package/dist/tegel/p-677baf7f.entry.js +0 -1
  223. package/dist/tegel/p-71797eaf.entry.js +0 -1
  224. package/dist/tegel/p-7373284c.entry.js +0 -1
  225. package/dist/tegel/p-7451779b.entry.js +0 -1
  226. package/dist/tegel/p-77aeea3b.entry.js +0 -1
  227. package/dist/tegel/p-8582d6a7.entry.js +0 -1
  228. package/dist/tegel/p-96021bd0.entry.js +0 -1
  229. package/dist/tegel/p-9d8caf51.entry.js +0 -1
  230. package/dist/tegel/p-a5919930.entry.js +0 -1
  231. package/dist/tegel/p-b01cface.entry.js +0 -1
  232. package/dist/tegel/p-bf896643.entry.js +0 -1
  233. package/dist/tegel/p-c311725c.entry.js +0 -1
  234. package/dist/tegel/p-cf72dfd9.entry.js +0 -1
  235. package/dist/tegel/p-d91caec6.entry.js +0 -1
  236. package/dist/tegel/p-e10eec33.entry.js +0 -1
  237. package/dist/tegel/p-ec26fc38.js +0 -1
  238. package/dist/tegel/p-f2262a69.entry.js +0 -1
  239. package/dist/tegel/p-f2f7aa45.entry.js +0 -1
  240. package/dist/tegel/tegel.css +0 -101
  241. package/dist/tegel/tegel.esm.js +0 -1
  242. package/dist/types/components/accordion/accordion-item/accordion-item.d.ts +0 -17
  243. package/dist/types/components/accordion/accordion.d.ts +0 -7
  244. package/dist/types/components/badge/badges.d.ts +0 -16
  245. package/dist/types/components/button/button-component.d.ts +0 -15
  246. package/dist/types/components/data-table/table/table.d.ts +0 -47
  247. package/dist/types/components/data-table/table-body/table-body.d.ts +0 -54
  248. package/dist/types/components/data-table/table-body-cell/table-body-cell.d.ts +0 -24
  249. package/dist/types/components/data-table/table-body-row/table-body-row.d.ts +0 -27
  250. package/dist/types/components/data-table/table-body-row-expandable/table-body-row-expandable.d.ts +0 -27
  251. package/dist/types/components/data-table/table-footer/table-footer.d.ts +0 -50
  252. package/dist/types/components/data-table/table-header/table-header.d.ts +0 -27
  253. package/dist/types/components/data-table/table-header-cell/table-header-cell.d.ts +0 -45
  254. package/dist/types/components/data-table/table-toolbar/table-toolbar.d.ts +0 -22
  255. package/dist/types/components/datetime/datetime.d.ts +0 -32
  256. package/dist/types/components/dropdown/dropdown-filter/dropdown-filter.d.ts +0 -42
  257. package/dist/types/components/dropdown/dropdown-option/dropdown-option.d.ts +0 -19
  258. package/dist/types/components/dropdown/dropdown.d.ts +0 -56
  259. package/dist/types/components/icon/icon.d.ts +0 -12
  260. package/dist/types/components/modal/modal.d.ts +0 -16
  261. package/dist/types/components/popover-canvas/popover-canvas.d.ts +0 -18
  262. package/dist/types/components/popover-menu/popover-menu.d.ts +0 -18
  263. package/dist/types/components/slider/slider.d.ts +0 -82
  264. package/dist/types/components/spinner/spinner.d.ts +0 -7
  265. package/dist/types/components/tabs/inline-tabs-default/inline-tabs.d.ts +0 -41
  266. package/dist/types/components/tabs/inline-tabs-fullbleed/inline-tabs-fullbleed.d.ts +0 -20
  267. package/dist/types/components/tabs/navigation-tabs/navigation-tabs.d.ts +0 -18
  268. package/dist/types/components/textarea/textarea.d.ts +0 -41
  269. package/dist/types/components/textfield/textfield.d.ts +0 -42
  270. package/dist/types/components/tooltip/tooltip.d.ts +0 -20
  271. package/dist/types/components.d.ts +0 -1752
  272. package/dist/types/global.d.ts +0 -2
  273. package/dist/types/index.d.ts +0 -1
  274. package/dist/types/stencil-public-runtime.d.ts +0 -1581
  275. package/dist/types/utils/utils.d.ts +0 -2
  276. package/loader/cdn.js +0 -3
  277. package/loader/index.cjs.js +0 -3
  278. package/loader/index.d.ts +0 -12
  279. package/loader/index.es2017.js +0 -3
  280. package/loader/index.js +0 -4
  281. package/loader/package.json +0 -11
@@ -1,72 +0,0 @@
1
- import { r as registerInstance, h, H as Host, g as getElement } from './index-b67b15a6.js';
2
- import { c as createPopper } from './popper-f860750c.js';
3
-
4
- const popoverCanvasCss = ":host{box-sizing:border-box;min-width:160px;min-height:160px;background-color:var(--sdds-popover-bg-default);padding:16px;box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;z-index:20000;display:none}:host *{box-sizing:border-box}:host(.sdds-popover-canvas-show){opacity:1;display:block}";
5
-
6
- const PopoverCanvas = class {
7
- constructor(hostRef) {
8
- registerInstance(this, hostRef);
9
- this.selector = '';
10
- this.show = false;
11
- this.placement = 'auto';
12
- this.offsetSkidding = 0;
13
- this.offsetDistance = 8;
14
- this.target = undefined;
15
- }
16
- handleOutsideClick() {
17
- if (this.show) {
18
- this.show = false;
19
- }
20
- }
21
- componentDidLoad() {
22
- this.target = document.querySelector(this.selector);
23
- const _this = this;
24
- createPopper(this.target, this.popoverCanvasElement, {
25
- placement: _this.placement,
26
- modifiers: [
27
- {
28
- name: 'positionCalc',
29
- enabled: true,
30
- phase: 'main',
31
- fn({ state }) {
32
- console.log('popover fn', state);
33
- },
34
- },
35
- {
36
- name: 'offset',
37
- options: {
38
- offset: [this.offsetSkidding, this.offsetDistance],
39
- },
40
- },
41
- ],
42
- });
43
- const showCanvas = () => {
44
- this.show = true;
45
- };
46
- const hideCanvas = () => {
47
- this.show = false;
48
- };
49
- this.target.addEventListener('mousedown', event => {
50
- event.stopPropagation();
51
- if (this.show) {
52
- hideCanvas();
53
- }
54
- else {
55
- showCanvas();
56
- }
57
- });
58
- this.popoverCanvasElement.addEventListener('mousemove', event => {
59
- event.stopPropagation();
60
- });
61
- this.popoverCanvasElement.addEventListener('mousedown', event => {
62
- event.stopPropagation();
63
- });
64
- }
65
- render() {
66
- return (h(Host, { class: `sdds-popover-canvas ${this.show ? 'sdds-popover-canvas-show' : ''}` }, h("slot", null)));
67
- }
68
- get popoverCanvasElement() { return getElement(this); }
69
- };
70
- PopoverCanvas.style = popoverCanvasCss;
71
-
72
- export { PopoverCanvas as sdds_popover_canvas };
@@ -1,71 +0,0 @@
1
- import { r as registerInstance, h, H as Host, g as getElement } from './index-b67b15a6.js';
2
- import { c as createPopper } from './popper-f860750c.js';
3
-
4
- const popoverMenuCss = ":host{box-sizing:border-box;overflow:hidden;width:160px;background-color:var(--sdds-popover-bg-default);padding:16px;box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;display:none;z-index:20000}:host *{box-sizing:border-box}:host(.sdds-popover-menu-show){opacity:1;display:block}";
5
-
6
- const PopoverMenu = class {
7
- constructor(hostRef) {
8
- registerInstance(this, hostRef);
9
- this.selector = '';
10
- this.show = false;
11
- this.placement = 'auto';
12
- this.offsetSkidding = 0;
13
- this.offsetDistance = 8;
14
- this.target = undefined;
15
- }
16
- handleOutsideClick() {
17
- if (this.show) {
18
- this.show = false;
19
- }
20
- }
21
- componentDidLoad() {
22
- this.target = document.querySelector(this.selector);
23
- const _this = this;
24
- createPopper(this.target, this.popoverMenuElement, {
25
- strategy: 'fixed',
26
- placement: _this.placement,
27
- modifiers: [
28
- {
29
- name: 'positionCalc',
30
- enabled: true,
31
- phase: 'main',
32
- fn({}) { },
33
- },
34
- {
35
- name: 'offset',
36
- options: {
37
- offset: [this.offsetSkidding, this.offsetDistance],
38
- },
39
- },
40
- ],
41
- });
42
- const showMenu = () => {
43
- this.show = true;
44
- };
45
- const hideMenu = () => {
46
- this.show = false;
47
- };
48
- this.target.addEventListener('mousedown', event => {
49
- event.stopPropagation();
50
- if (this.show) {
51
- hideMenu();
52
- }
53
- else {
54
- showMenu();
55
- }
56
- });
57
- this.popoverMenuElement.addEventListener('mousemove', event => {
58
- event.stopPropagation();
59
- });
60
- this.popoverMenuElement.addEventListener('mousedown', event => {
61
- event.stopPropagation();
62
- });
63
- }
64
- render() {
65
- return (h(Host, { class: `sdds-popover-menu ${this.show ? 'sdds-popover-menu-show' : ''}` }, h("slot", null)));
66
- }
67
- get popoverMenuElement() { return getElement(this); }
68
- };
69
- PopoverMenu.style = popoverMenuCss;
70
-
71
- export { PopoverMenu as sdds_popover_menu };
@@ -1,332 +0,0 @@
1
- import { r as registerInstance, c as createEvent, h } from './index-b67b15a6.js';
2
-
3
- const sliderCss = "sdds-slider{box-sizing:border-box;width:100%;--sdds-slider-inputfield-bg:var(--sdds-white)}sdds-slider *{box-sizing:border-box}sdds-slider input[type=range].sdds-slider-native-element{display:none}.sdds-slider-wrapper{width:100%}.sdds-slider-wrapper.read-only{pointer-events:none}.sdds-slider{width:100%;display:flex;flex-wrap:nowrap;padding-top:65px}.sdds-slider .sdds-slider-inner{width:100%;height:20px;position:relative}.sdds-slider .sdds-slider__controls{position:relative;top:-25px}.sdds-slider .sdds-slider__controls .sdds-slider__control{cursor:pointer}.sdds-slider .sdds-slider__controls .sdds-slider__control.sdds-slider__control-minus{padding:18px 18px 18px 0}.sdds-slider .sdds-slider__controls .sdds-slider__control.sdds-slider__control-plus{padding:18px 0 18px 18px}.sdds-slider .sdds-slider__input-values{position:relative;top:-25px;display:flex;flex-wrap:nowrap;align-items:center}.sdds-slider .sdds-slider__input-values .sdds-slider__input-value{user-select:none;padding:18px;color:var(--sdds-grey-700);font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls)}.sdds-slider .sdds-slider__input-values .sdds-slider__input-field-wrapper{background-color:var(--sdds-slider-inputfield-bg);display:flex;align-items:center;justify-content:center}.sdds-slider .sdds-slider__input-values .sdds-slider__input-field-wrapper input.sdds-slider__input-field{font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);color:var(--sdds-grey-700);border:0;background-color:transparent;text-align:center;padding:12px;box-shadow:inset 0 -1px 0 var(--sdds-grey-400);border-radius:4px 4px 0 0}.sdds-slider .sdds-slider__input-values .sdds-slider__input-field-wrapper input.sdds-slider__input-field:hover{box-shadow:inset 0 -1px 0 var(--sdds-grey-600)}.sdds-slider .sdds-slider__input-values .sdds-slider__input-field-wrapper input.sdds-slider__input-field:focus{box-shadow:inset 0 -2px 0 var(--sdds-blue-400);outline:0}.sdds-slider label{font:var(--sdds-detail-05);letter-spacing:var(--sdds-detail-05-ls);user-select:none;position:absolute;color:var(--sdds-grey-958);top:-16px;transform:translateY(-100%)}.sdds-slider label.offset{top:-35px}.sdds-slider .sdds-slider__value{font:var(--sdds-detail-01);letter-spacing:var(--sdds-detail-01-ls);user-select:none;border-radius:4px;padding:8px;position:absolute;transform:translate(-50%, -100%);top:-24px;background-color:var(--sdds-grey-800);color:var(--sdds-white)}.sdds-slider .sdds-slider__value svg{position:absolute;left:50%;transform:translateX(-50%);top:34px}.sdds-slider .sdds-slider__scrubber{position:absolute}.sdds-slider .sdds-slider__scrubber .sdds-slider__scrubber-inner{width:20px;height:20px;border-radius:100%;background-color:var(--sdds-blue-800);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);cursor:pointer;z-index:10}.sdds-slider .sdds-slider__scrubber .sdds-slider__scrubber-inner::before{content:\" \";display:none;width:48px;height:48px;background-color:var(--sdds-blue-800);position:absolute;border-radius:100%;top:50%;left:50%;transform:translate(-50%, -50%)}.sdds-slider .sdds-slider__scrubber .sdds-slider__scrubber-inner:hover::before{display:block;opacity:0.08}.sdds-slider .sdds-slider__scrubber .sdds-slider__scrubber-inner.pressed{width:24px;height:24px}.sdds-slider .sdds-slider__scrubber .sdds-slider__scrubber-inner.pressed::before{display:block;opacity:0.16 !important}.sdds-slider .sdds-slider__value-dividers-wrapper{position:relative;width:100%;pointer-events:none}.sdds-slider .sdds-slider__value-dividers{pointer-events:none;position:absolute;display:flex;justify-content:space-between;width:100%}.sdds-slider .sdds-slider__value-dividers .sdds-slider__value-divider{transform:translateY(-50%);height:16px;background-color:var(--sdds-grey-400);width:1px}.sdds-slider .sdds-slider__value-dividers .sdds-slider__value-divider span{display:block;user-select:none;color:var(-sdds-grey-700);font:var(--sdds-detail-05);letter-spacing:var(--sdds-detail-05-ls);position:relative;top:-7px;left:50%;transform:translate(-50%, -100%);width:50px;text-align:center}.sdds-slider .sdds-slider__track{width:100%;height:2px;border-radius:1px;background-color:var(--sdds-grey-400);position:relative}.sdds-slider .sdds-slider__track:focus{outline:0}.sdds-slider .sdds-slider__track:focus .sdds-slider__scrubber .sdds-slider__scrubber-inner{width:24px;height:24px}.sdds-slider .sdds-slider__track:focus .sdds-slider__scrubber .sdds-slider__scrubber-inner::before{display:block;opacity:0.08}.sdds-slider .sdds-slider__track .sdds-slider__track-fill{background-color:var(--sdds-blue-800);border-radius:2px;height:4px;position:absolute;left:0;top:-1px}.sdds-slider.disabled{cursor:not-allowed}.sdds-slider.disabled>*{pointer-events:none}.sdds-slider.disabled label{color:var(--sdds-grey-400)}.sdds-slider.disabled .sdds-slider__controls .sdds-slider__control{cursor:default}.sdds-slider.disabled .sdds-slider__controls .sdds-slider__control.sdds-slider__control-minus svg path,.sdds-slider.disabled .sdds-slider__controls .sdds-slider__control.sdds-slider__control-plus svg path{fill:var(--sdds-grey-400)}.sdds-slider.disabled .sdds-slider__input-values .sdds-slider__input-value{color:var(--sdds-grey-400)}.sdds-slider.disabled .sdds-slider__input-values .sdds-slider__input-field-wrapper{pointer-events:none}.sdds-slider.disabled .sdds-slider__input-values .sdds-slider__input-field-wrapper input.sdds-slider__input-field{color:var(--sdds-grey-400);pointer-events:none}.sdds-slider.disabled .sdds-slider__value{display:none}.sdds-slider.disabled .sdds-slider__track .sdds-slider__track-fill{background-color:var(--sdds-grey-400)}.sdds-slider.disabled .sdds-slider__value-dividers .sdds-slider__value-divider span{color:var(--sdds-grey-400)}.sdds-slider.disabled .sdds-slider__scrubber{pointer-events:none}.sdds-slider.disabled .sdds-slider__scrubber .sdds-slider__scrubber-inner{background:var(--sdds-grey-400);cursor:default}.sdds-slider.sdds-slider-small .sdds-slider__scrubber .sdds-slider__scrubber-inner{width:16px;height:16px}.sdds-slider.sdds-slider-small .sdds-slider__scrubber .sdds-slider__scrubber-inner::before{width:40px;height:40px}.sdds-slider.sdds-slider-small .sdds-slider__scrubber .sdds-slider__scrubber-inner.pressed{width:20px;height:20px}";
4
-
5
- const Slider = class {
6
- constructor(hostRef) {
7
- registerInstance(this, hostRef);
8
- this.sliderChangeEmitter = createEvent(this, "sliderChange", 7);
9
- this.wrapperElement = null;
10
- this.scrubberElement = null;
11
- this.scrubberInnerElement = null;
12
- this.dividersElement = null;
13
- this.trackElement = null;
14
- this.trackFillElement = null;
15
- this.minusElement = null;
16
- this.plusElement = null;
17
- this.inputElement = null;
18
- this.nativeRangeInputElement = null;
19
- this.scrubberGrabPos = { x: 0, y: 0 };
20
- this.scrubberGrabbed = false;
21
- this.scrubberLeft = 0;
22
- this.tickValues = [];
23
- this.disabledState = false;
24
- this.readonlyState = false;
25
- this.useControls = false;
26
- this.useInput = false;
27
- this.useSmall = false;
28
- this.useSnapping = false;
29
- this.supposedValueSlot = -1;
30
- this.eventListenersAdded = false;
31
- this.resizeObserverAdded = false;
32
- this.label = '';
33
- this.value = '0';
34
- this.min = '0';
35
- this.max = '100';
36
- this.ticks = '0';
37
- this.showTickNumbers = false;
38
- this.tooltip = null;
39
- this.disabled = null;
40
- this.readOnly = null;
41
- this.controls = null;
42
- this.input = null;
43
- this.step = '1';
44
- this.name = '';
45
- this.size = '';
46
- this.snap = null;
47
- }
48
- /** Public method to re-initialise the slider if some configuration props are changed */
49
- async reset() {
50
- // @TODO: maybe refactor to use watch-decorators instead
51
- this.componentWillLoad();
52
- this.componentDidLoad();
53
- }
54
- handleKeydown(event) {
55
- switch (event.key) {
56
- case 'ArrowLeft':
57
- this.stepLeft();
58
- break;
59
- case 'ArrowRight':
60
- this.stepRight();
61
- break;
62
- }
63
- }
64
- handleMouseUp() {
65
- if (!this.scrubberGrabbed) {
66
- return;
67
- }
68
- this.scrubberGrabbed = false;
69
- this.scrubberInnerElement.classList.remove('pressed');
70
- this.updateValue();
71
- this.trackElement.focus();
72
- }
73
- handleTouchEnd() {
74
- if (!this.scrubberGrabbed) {
75
- return;
76
- }
77
- this.scrubberGrabbed = false;
78
- this.scrubberInnerElement.classList.remove('pressed');
79
- this.updateValue();
80
- this.trackElement.focus();
81
- }
82
- handleMouseMove(event) {
83
- if (!this.scrubberGrabbed) {
84
- return;
85
- }
86
- const numTicks = parseInt(this.ticks);
87
- const trackRect = this.trackElement.getBoundingClientRect();
88
- let localLeft = event.clientX - trackRect.left;
89
- this.supposedValueSlot = -1;
90
- if (this.useSnapping && numTicks > 0) {
91
- const v = Math.round(this.getTrackWidth() / (numTicks + 1));
92
- localLeft = Math.round(localLeft / v) * v;
93
- this.supposedValueSlot = Math.round(localLeft / v);
94
- }
95
- this.scrubberLeft = this.constrainScrubber(localLeft);
96
- this.scrubberElement.style.left = `${this.scrubberLeft}px`;
97
- this.updateValue();
98
- this.updateTrack();
99
- }
100
- handleTouchMove(event) {
101
- event.preventDefault();
102
- if (!this.scrubberGrabbed) {
103
- return;
104
- }
105
- const numTicks = parseInt(this.ticks);
106
- const trackRect = this.trackElement.getBoundingClientRect();
107
- let localLeft = event.touches[0].clientX - trackRect.left;
108
- this.supposedValueSlot = -1;
109
- if (this.useSnapping && numTicks > 0) {
110
- const v = Math.round(this.getTrackWidth() / (numTicks + 1));
111
- localLeft = Math.round(localLeft / v) * v;
112
- this.supposedValueSlot = Math.round(localLeft / v);
113
- }
114
- this.scrubberLeft = this.constrainScrubber(localLeft);
115
- this.scrubberElement.style.left = `${this.scrubberLeft}px`;
116
- this.updateValue();
117
- this.updateTrack();
118
- }
119
- updateTrack() {
120
- const trackWidth = this.getTrackWidth();
121
- const percentageFilled = (this.scrubberLeft / trackWidth) * 100;
122
- this.trackFillElement.style.width = `${percentageFilled}%`;
123
- }
124
- dispatchChangeEvent() {
125
- this.sliderChangeEmitter.emit({ value: this.value });
126
- }
127
- updateValue() {
128
- const trackWidth = this.getTrackWidth();
129
- /* if snapping (supposedValueSlot > 0) is enabled, make sure we display the supposed value (instead of maybe getting a -1/+1 depending on rounding) */
130
- if (this.supposedValueSlot > 0) {
131
- const supposedValue = this.tickValues[this.supposedValueSlot];
132
- this.value = `${supposedValue}`;
133
- }
134
- else {
135
- const percentage = this.scrubberLeft / trackWidth;
136
- this.value = `${Math.trunc(this.getMin() + percentage * (this.getMax() - this.getMin()))}`;
137
- }
138
- this.dispatchChangeEvent();
139
- }
140
- updateValueForced(value) {
141
- this.value = value;
142
- this.dispatchChangeEvent();
143
- }
144
- getMin() {
145
- return parseFloat(this.min);
146
- }
147
- getMax() {
148
- return parseFloat(this.max);
149
- }
150
- constrainScrubber(x) {
151
- const width = this.getTrackWidth();
152
- if (x < 0) {
153
- return 0;
154
- }
155
- if (x > width) {
156
- return width;
157
- }
158
- return x;
159
- }
160
- getTrackWidth() {
161
- const trackRect = this.trackElement.getBoundingClientRect();
162
- return trackRect.right - trackRect.left;
163
- }
164
- calculateScrubberLeftFromValue(value) {
165
- const initValue = value;
166
- const trackWidth = this.getTrackWidth();
167
- const normalizedValue = initValue - this.getMin();
168
- const normalizedMax = this.getMax() - this.getMin();
169
- const calculatedLeft = (normalizedValue / normalizedMax) * trackWidth;
170
- this.scrubberLeft = calculatedLeft;
171
- this.scrubberElement.style.left = `${this.scrubberLeft}px`;
172
- }
173
- componentDidLoad() {
174
- if (!this.resizeObserverAdded) {
175
- this.resizeObserverAdded = true;
176
- const resizeObserver = new ResizeObserver(( /* entries */) => {
177
- this.calculateScrubberLeftFromValue(this.value);
178
- this.updateTrack();
179
- });
180
- resizeObserver.observe(this.wrapperElement);
181
- }
182
- if (!this.eventListenersAdded) {
183
- this.eventListenersAdded = true;
184
- this.scrubberElement.addEventListener('mousedown', event => {
185
- event.preventDefault();
186
- this.grabScrubber(event.offsetX, event.offsetY);
187
- });
188
- this.scrubberElement.addEventListener('touchstart', event => {
189
- const rect = this.scrubberElement.getBoundingClientRect();
190
- const x = event.targetTouches[0].pageX - rect.left;
191
- const y = event.targetTouches[0].pageY - rect.top;
192
- this.grabScrubber(x, y);
193
- });
194
- if (this.useControls) {
195
- this.minusElement.addEventListener('click', () => {
196
- this.stepLeft();
197
- });
198
- this.plusElement.addEventListener('click', () => {
199
- this.stepRight();
200
- });
201
- }
202
- if (this.inputElement) {
203
- this.inputElement.addEventListener('keydown', event => {
204
- event.stopPropagation();
205
- if (event.key === 'Enter') {
206
- let newValue = parseInt(this.inputElement.value);
207
- if (newValue < this.getMin()) {
208
- newValue = this.getMin();
209
- }
210
- else if (newValue > this.getMax()) {
211
- newValue = this.getMax();
212
- }
213
- this.calculateScrubberLeftFromValue(newValue);
214
- this.updateValueForced(newValue);
215
- this.updateTrack();
216
- this.inputElement.blur();
217
- this.wrapperElement.focus();
218
- }
219
- });
220
- }
221
- }
222
- this.calculateScrubberLeftFromValue(this.value);
223
- this.updateTrack();
224
- }
225
- grabScrubber(xOffset, yOffset) {
226
- if (this.readonlyState) {
227
- return;
228
- }
229
- this.scrubberGrabPos = {
230
- x: xOffset,
231
- y: yOffset,
232
- };
233
- this.scrubberGrabbed = true;
234
- this.scrubberInnerElement.classList.add('pressed');
235
- }
236
- calculateInputSizeFromMax() {
237
- return this.max.length;
238
- }
239
- controlsStep(delta) {
240
- if (this.readonlyState) {
241
- return;
242
- }
243
- const trackWidth = this.getTrackWidth();
244
- const percentage = this.scrubberLeft / trackWidth;
245
- const numTicks = parseInt(this.ticks);
246
- let currentValue = this.getMin() + percentage * (this.getMax() - this.getMin());
247
- currentValue += delta;
248
- if (currentValue < this.getMin()) {
249
- currentValue = this.getMin();
250
- }
251
- else if (currentValue > this.getMax()) {
252
- currentValue = this.getMax();
253
- }
254
- this.value = `${currentValue}`;
255
- /* if snapping is enabled, instead just increment or decrement the current "fixed" value from our ticknumber array */
256
- if (this.useSnapping && numTicks > 0) {
257
- const stepDir = delta > 0 ? 1 : -1;
258
- this.supposedValueSlot += stepDir;
259
- if (this.supposedValueSlot < 0) {
260
- this.supposedValueSlot = 0;
261
- }
262
- else if (this.supposedValueSlot > numTicks + 1) {
263
- this.supposedValueSlot = numTicks + 1;
264
- }
265
- }
266
- this.calculateScrubberLeftFromValue(currentValue);
267
- this.updateTrack();
268
- this.updateValue();
269
- }
270
- stepLeft() {
271
- this.controlsStep(-parseInt(this.step));
272
- }
273
- stepRight() {
274
- this.controlsStep(parseInt(this.step));
275
- }
276
- componentWillLoad() {
277
- const numTicks = parseInt(this.ticks);
278
- if (numTicks > 0) {
279
- this.tickValues = [this.getMin()];
280
- const step = (this.getMax() - this.getMin()) / (numTicks + 1);
281
- for (let i = 1; i < numTicks + 1; i++) {
282
- this.tickValues.push(this.getMin() + Math.round(step * i));
283
- }
284
- this.tickValues.push(this.getMax());
285
- }
286
- if (this.disabled !== null) {
287
- this.disabledState = true;
288
- }
289
- else {
290
- this.disabledState = false;
291
- }
292
- if (this.readOnly !== null) {
293
- this.readonlyState = true;
294
- }
295
- else {
296
- this.readonlyState = false;
297
- }
298
- this.useInput = false;
299
- this.useControls = false;
300
- if (this.controls !== null) {
301
- this.useControls = true;
302
- }
303
- else if (this.input !== null) {
304
- this.useInput = true;
305
- }
306
- this.useSmall = false;
307
- if (this.size === 'sm') {
308
- this.useSmall = true;
309
- }
310
- this.useSnapping = false;
311
- if (this.snap !== null) {
312
- this.useSnapping = true;
313
- }
314
- const min = this.getMin();
315
- const max = this.getMax();
316
- if (min > max) {
317
- console.warn('min-prop must have a higher value than max-prop for the component to work correctly.');
318
- this.disabledState = true;
319
- }
320
- }
321
- render() {
322
- return (h("div", { class: 'sdds-slider-wrapper ' + (this.readonlyState && 'read-only') }, h("input", { ref: el => (this.nativeRangeInputElement = el), class: "sdds-slider-native-element", type: "range", value: this.value, name: this.name, min: this.min, max: this.max }), h("div", { class: `sdds-slider ${this.disabledState ? 'disabled' : ''} ${this.useSmall ? 'sdds-slider-small' : ''}`, ref: el => (this.wrapperElement = el) }, this.useInput && (h("div", { class: "sdds-slider__input-values" }, h("div", { ref: el => (this.minusElement = el), class: "sdds-slider__input-value" }, this.min))), this.useControls && (h("div", { class: "sdds-slider__controls" }, h("div", { ref: el => (this.minusElement = el), class: "sdds-slider__control sdds-slider__control-minus" }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M1.98975 8.00005C1.98975 8.27619 2.2136 8.50005 2.48975 8.50005H13.5104C13.7866 8.50005 14.0104 8.27619 14.0104 8.00005C14.0104 7.72391 13.7866 7.50005 13.5104 7.50005L2.48975 7.50005C2.2136 7.50005 1.98975 7.72391 1.98975 8.00005Z", fill: "#0D0F13" }))))), h("div", { class: "sdds-slider-inner" }, h("label", { class: this.tickValues.length > 0 && 'offset' }, this.label), this.tickValues.length > 0 && (h("div", { class: "sdds-slider__value-dividers-wrapper" }, h("div", { ref: el => (this.dividersElement = el), class: "sdds-slider__value-dividers" }, this.tickValues.map(value => (h("div", { class: "sdds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { class: "sdds-slider__track", ref: el => (this.trackElement = el), tabindex: "1" }, h("div", { class: "sdds-slider__track-fill", ref: el => (this.trackFillElement = el) }), h("div", { class: "sdds-slider__scrubber", ref: el => (this.scrubberElement = el) }, this.tooltip !== null && (h("div", { class: "sdds-slider__value" }, this.value, h("svg", { width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "#37414F" })))), h("div", { class: "sdds-slider__scrubber-inner", ref: el => (this.scrubberInnerElement = el) })))), this.useInput && (h("div", { class: "sdds-slider__input-values" }, h("div", { ref: el => (this.minusElement = el), class: "sdds-slider__input-value", tabindex: "2" }, this.max), h("div", { class: "sdds-slider__input-field-wrapper" }, h("input", { onFocus: e => {
323
- if (this.readonlyState) {
324
- e.preventDefault();
325
- this.inputElement.blur();
326
- }
327
- }, size: this.calculateInputSizeFromMax(), class: "sdds-slider__input-field", value: this.value, ref: el => (this.inputElement = el) })))), this.useControls && (h("div", { class: "sdds-slider__controls" }, h("div", { ref: el => (this.plusElement = el), class: "sdds-slider__control sdds-slider__control-plus" }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M8.50005 13.5104C8.50005 13.7865 8.27619 14.0104 8.00005 14.0104C7.7239 14.0104 7.50005 13.7865 7.50005 13.5104V8.5H2.48975C2.2136 8.5 1.98975 8.27614 1.98975 8C1.98975 7.72386 2.2136 7.5 2.48975 7.5H7.50005V2.48965C7.50005 2.21351 7.7239 1.98965 8.00005 1.98965C8.27619 1.98965 8.50005 2.21351 8.50005 2.48965V7.5H13.5104C13.7866 7.5 14.0104 7.72386 14.0104 8C14.0104 8.27614 13.7866 8.5 13.5104 8.5H8.50005V13.5104Z", fill: "#0D0F13" }))))))));
328
- }
329
- };
330
- Slider.style = sliderCss;
331
-
332
- export { Slider as sdds_slider };
@@ -1,17 +0,0 @@
1
- import { r as registerInstance, h } from './index-b67b15a6.js';
2
-
3
- const spinnerCss = ":root,html{--sdds-spinner-background:var(--sdds-blue-400);--sdds-spinner-background-inverted:var(--sdds-white);--sdds-spinner-speed:1.8s;--sdds-spinner-speed-lg:2s;--sdds-spinner-radius-xs:8px;--sdds-spinner-radius-sm:12px;--sdds-spinner-radius-md:26px;--sdds-spinner-radius-lg:42px;--sdds-spinner-radius:var(--sdds-spinner-radius-lg);--sdds-spinner-stroke-width-xs:3px;--sdds-spinner-stroke-width-sm:4px;--sdds-spinner-stroke-width-md:6px;--sdds-spinner-stroke-width-lg:8px;--sdds-spinner-stroke-width:var(--sdds-spinner-stroke-width-lg);--PI:3.14159265358979}:host{box-sizing:border-box;display:block}:host *{box-sizing:border-box}.sdds-spinner-svg{width:calc(var(--sdds-spinner-radius) * 2);height:calc(var(--sdds-spinner-radius) * 2);transform:scale(-1, 1) rotate(-90deg)}.sdds-spinner-svg-xs{--sdds-spinner-radius:var(--sdds-spinner-radius-xs);--sdds-spinner-stroke-width:var(--sdds-spinner-stroke-width-xs);--sdds-spinner-animation-speed:var(--sdds-spinner-speed)}.sdds-spinner-svg-sm{--sdds-spinner-radius:var(--sdds-spinner-radius-sm);--sdds-spinner-stroke-width:var(--sdds-spinner-stroke-width-sm);--sdds-spinner-animation-speed:var(--sdds-spinner-speed)}.sdds-spinner-svg-md{--sdds-spinner-radius:var(--sdds-spinner-radius-md);--sdds-spinner-stroke-width:var(--sdds-spinner-stroke-width-md);--sdds-spinner-animation-speed:var(--sdds-spinner-speed)}.sdds-spinner-svg-lg{--sdds-spinner-radius:var(--sdds-spinner-radius-lg);--sdds-spinner-stroke-width:var(--sdds-spinner-stroke-width-lg);--sdds-spinner-animation-speed:var(--sdds-spinner-speed-lg)}.sdds-spinner-circle{cx:var(--sdds-spinner-radius);cy:var(--sdds-spinner-radius);r:calc(var(--sdds-spinner-radius) - var(--sdds-spinner-stroke-width) / 2);stroke-width:var(--sdds-spinner-stroke-width);fill:none;--sdds-spinner-stroke-dash:calc((2 * var(--PI)) * var(--sdds-spinner-radius));stroke-dasharray:var(--sdds-spinner-stroke-dash);stroke-width:var(--sdds-spinner-stroke-width);animation:dash var(--sdds-spinner-animation-speed) cubic-bezier(0.55, 0.15, 0.45, 0.85) infinite}.sdds-spinner-circle-standard{stroke:var(--sdds-spinner-background)}.sdds-spinner-circle-inverted{stroke:var(--sdds-spinner-background-inverted)}@keyframes dash{from{stroke-dashoffset:calc(-1 * var(--sdds-spinner-stroke-dash))}to{stroke-dashoffset:var(--sdds-spinner-stroke-dash)}}";
4
-
5
- const Spinner = class {
6
- constructor(hostRef) {
7
- registerInstance(this, hostRef);
8
- this.size = 'lg';
9
- this.variant = 'standard';
10
- }
11
- render() {
12
- return (h("div", { "aria-live": "assertive", role: "status", "aria-label": "loading" }, h("svg", { class: `sdds-spinner-svg sdds-spinner-svg-${this.size}`, "aria-hidden": "true" }, h("circle", { class: `sdds-spinner-circle sdds-spinner-circle-${this.variant}` }))));
13
- }
14
- };
15
- Spinner.style = spinnerCss;
16
-
17
- export { Spinner as sdds_spinner };
@@ -1,77 +0,0 @@
1
- import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b67b15a6.js';
2
-
3
- const tableBodyRowExpandableCss = ":host{box-sizing:border-box;display:contents}:host *{box-sizing:border-box}:host .sdds-table__row,:host .sdds-table__row-extend{display:table-row;border-bottom:1px solid var(--sdds-grey-400);background-color:var(--sdds-white);transition:background-color 200ms ease}:host .sdds-table__row:hover,:host .sdds-table__row-extend:hover{background-color:var(--sdds-grey-100)}:host .sdds-table__expand-control-container{display:flex;justify-content:center;align-items:center;height:46px;cursor:pointer;padding:0 16px}:host .sdds-table__expand-control-container .sdds-table__expand-input{display:none}:host .sdds-table__expand-control-container .sdds-expendable-row-icon{height:16px;width:16px;transition:transform 200ms ease;transform:rotate(0)}:host .sdds-table__row-expand{visibility:collapse;transition:background-color 200ms ease}:host .sdds-table__row-expand .sdds-table__cell-expand{padding:16px 16px 16px 66px}:host(.sdds-table__row-expand--active) .sdds-table__row{background-color:var(--sdds-grey-300)}:host(.sdds-table__row-expand--active) .sdds-table__expand-control-container .sdds-expendable-row-icon{transform:rotate(180deg)}:host(.sdds-table__row-expand--active) .sdds-table__row-expand{background-color:var(--sdds-grey-300);visibility:visible}:host(.sdds-table__compact) .sdds-table__expand-control-container{height:30px}:host(.sdds-table__compact) .sdds-table__row-expand .sdds-table__cell-expand{padding:8px 16px 8px 66px}:host(.sdds-table--divider) .sdds-table__cell--expand{border-right:1px solid var(--sdds-grey-400)}:host(.sdds-table--on-white-bg) .sdds-table__row,:host(.sdds-table--on-white-bg) .sdds-table__row-extend{background-color:var(--sdds-grey-50)}:host(.sdds-table--on-white-bg:hover) .sdds-table__row,:host(.sdds-table--on-white-bg:hover) .sdds-table__row-extend{background-color:var(--sdds-grey-200)}:host(.sdds-table__row-expand--active.sdds-table--on-white-bg) .sdds-table__row,:host(.sdds-table__row-expand--active.sdds-table--on-white-bg) .sdds-table__row-extend{background-color:var(--sdds-grey-300)}";
4
-
5
- const relevantTableProps = [
6
- 'verticalDividers',
7
- 'compactDesign',
8
- 'noMinWidth',
9
- 'whiteBackground',
10
- ];
11
- const TableBodyRowExpandable = class {
12
- constructor(hostRef) {
13
- registerInstance(this, hostRef);
14
- this.singleRowExpandedEvent = createEvent(this, "singleRowExpandedEvent", 7);
15
- this.runPaginationEvent = createEvent(this, "runPaginationEvent", 7);
16
- this.colSpan = null;
17
- this.isExpanded = false;
18
- this.tableId = '';
19
- this.columnsNumber = null;
20
- this.verticalDividers = false;
21
- this.compactDesign = false;
22
- this.noMinWidth = false;
23
- this.whiteBackground = false;
24
- }
25
- tablePropsChangedEventListener(event) {
26
- if (this.tableId === event.detail.tableId) {
27
- event.detail.changed
28
- .filter((changedProp) => relevantTableProps.includes(changedProp))
29
- .forEach((changedProp) => {
30
- if (typeof this[changedProp] === 'undefined') {
31
- throw new Error(`Table prop is not supported: ${changedProp}`);
32
- }
33
- this[changedProp] = event.detail[changedProp];
34
- });
35
- }
36
- }
37
- connectedCallback() {
38
- this.tableEl = this.host.closest('sdds-table');
39
- this.tableId = this.tableEl.tableId;
40
- }
41
- componentWillLoad() {
42
- relevantTableProps.forEach((tablePropName) => {
43
- this[tablePropName] = this.tableEl[tablePropName];
44
- });
45
- }
46
- componentDidLoad() {
47
- this.runPaginationEvent.emit(this.tableId);
48
- }
49
- componentWillRender() {
50
- if (this.colSpan !== null) {
51
- this.columnsNumber = this.colSpan;
52
- }
53
- else {
54
- this.columnsNumber = this.tableEl.querySelector('sdds-table-header').childElementCount + 1;
55
- }
56
- }
57
- sendValue() {
58
- this.singleRowExpandedEvent.emit([this.tableId, this.isExpanded]);
59
- }
60
- onChangeHandler(event) {
61
- this.isExpanded = event.currentTarget.checked === true;
62
- this.sendValue();
63
- }
64
- render() {
65
- return (h(Host, { class: {
66
- 'sdds-table__row': true,
67
- 'sdds-table__row-expand--active': this.isExpanded,
68
- 'sdds-table__compact': this.compactDesign,
69
- 'sdds-table--divider': this.verticalDividers,
70
- 'sdds-table--on-white-bg': this.whiteBackground,
71
- } }, h("tr", { class: "sdds-table__row" }, h("td", { class: "sdds-table__cell sdds-table__cell--expand" }, h("label", { class: "sdds-table__expand-control-container" }, h("input", { class: "sdds-table__expand-input", type: "checkbox", onChange: (event) => this.onChangeHandler(event), checked: this.isExpanded }), h("span", { class: "sdds-expendable-row-icon" }, h("svg", { fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M4.273 9.783a1 1 0 0 1 1.415 0l9.888 9.888a.6.6 0 0 0 .848 0l9.888-9.888a1 1 0 1 1 1.415 1.414l-9.889 9.889a2.6 2.6 0 0 1-3.677 0l-9.888-9.889a1 1 0 0 1 0-1.414Z", fill: "currentColor" }))))), h("slot", null)), h("tr", { class: "sdds-table__row-expand" }, h("td", { class: "sdds-table__cell-expand", colSpan: this.columnsNumber }, h("slot", { name: "expand-row" })))));
72
- }
73
- get host() { return getElement(this); }
74
- };
75
- TableBodyRowExpandable.style = tableBodyRowExpandableCss;
76
-
77
- export { TableBodyRowExpandable as sdds_table_body_row_expandable };