@xplortech/apollo-core 2.7.0 → 2.7.1

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 (263) hide show
  1. package/.typings/apollo-components.html-data.json +97 -180
  2. package/build/style.css +220 -951
  3. package/dist/apollo-core/apollo-core.css +5 -35
  4. package/dist/apollo-core/apollo-core.esm.js +1 -1
  5. package/dist/apollo-core/{p-6c956d4e.entry.js → p-0bf50890.entry.js} +1 -1
  6. package/dist/apollo-core/p-1947e7a8.entry.js +1 -0
  7. package/dist/apollo-core/p-27928cb0.entry.js +1 -0
  8. package/dist/apollo-core/p-34438721.entry.js +1 -0
  9. package/dist/apollo-core/p-35c2f72d.entry.js +1 -0
  10. package/dist/apollo-core/p-368c81f1.entry.js +1 -0
  11. package/dist/apollo-core/p-36ba29da.entry.js +1 -0
  12. package/dist/apollo-core/p-406b27a8.entry.js +1 -0
  13. package/dist/apollo-core/p-5d63b4ce.entry.js +1 -0
  14. package/dist/apollo-core/{p-7eb86c63.entry.js → p-6a15f1e0.entry.js} +1 -1
  15. package/dist/apollo-core/p-8d692d05.entry.js +1 -0
  16. package/dist/apollo-core/{p-28d12fd3.entry.js → p-b61d7952.entry.js} +1 -1
  17. package/dist/apollo-core/{p-084d26ed.entry.js → p-ca127ee8.entry.js} +1 -1
  18. package/dist/apollo-core/p-d1c9c233.entry.js +1 -0
  19. package/dist/apollo-core/p-dc205893.entry.js +1 -0
  20. package/dist/apollo-core/p-e2a5d41c.entry.js +1 -0
  21. package/dist/cjs/apollo-core.cjs.js +1 -1
  22. package/dist/cjs/index-BQ97-AWw.js +10 -2
  23. package/dist/cjs/loader.cjs.js +1 -1
  24. package/dist/cjs/xpl-accordion.cjs.entry.js +2 -2
  25. package/dist/cjs/xpl-application-shell.cjs.entry.js +1 -1
  26. package/dist/cjs/{xpl-avatar_61.cjs.entry.js → xpl-avatar_54.cjs.entry.js} +238 -1683
  27. package/dist/cjs/xpl-button-row.cjs.entry.js +1 -1
  28. package/dist/cjs/xpl-calendar.cjs.entry.js +1 -1
  29. package/dist/cjs/xpl-dynamic-table-cell.cjs.entry.js +2 -2
  30. package/dist/cjs/xpl-dynamic-table-row.cjs.entry.js +2 -2
  31. package/dist/cjs/xpl-dynamic-table.cjs.entry.js +1 -1
  32. package/dist/cjs/xpl-grid-item.cjs.entry.js +1 -1
  33. package/dist/cjs/xpl-grid.cjs.entry.js +1 -1
  34. package/dist/cjs/xpl-large-card.cjs.entry.js +1 -1
  35. package/dist/cjs/xpl-main-nav.cjs.entry.js +1 -1
  36. package/dist/cjs/xpl-table-header-cell.cjs.entry.js +57 -0
  37. package/dist/cjs/xpl-table-header.cjs.entry.js +14 -0
  38. package/dist/cjs/xpl-toggle.cjs.entry.js +3 -3
  39. package/dist/cjs/xpl-toolbar.cjs.entry.js +2 -2
  40. package/dist/collection/collection-manifest.json +2 -7
  41. package/dist/collection/components/xpl-accordion/xpl-accordion.js +2 -2
  42. package/dist/collection/components/xpl-application-shell/xpl-application-shell.js +1 -1
  43. package/dist/collection/components/xpl-backdrop/xpl-backdrop.js +1 -1
  44. package/dist/collection/components/xpl-badge/xpl-badge.js +1 -1
  45. package/dist/collection/components/xpl-banner/xpl-banner.js +2 -2
  46. package/dist/collection/components/xpl-breadcrumbs/xpl-breadcrumb-item/xpl-breadcrumb-item.js +1 -1
  47. package/dist/collection/components/xpl-breadcrumbs/xpl-breadcrumbs/xpl-breadcrumbs.js +1 -1
  48. package/dist/collection/components/xpl-button/xpl-button.js +1 -1
  49. package/dist/collection/components/xpl-button-row/xpl-button-row.js +1 -1
  50. package/dist/collection/components/xpl-calendar/xpl-calendar.js +1 -1
  51. package/dist/collection/components/xpl-checkbox/xpl-checkbox.js +25 -25
  52. package/dist/collection/components/xpl-choicelist/xpl-choicelist.js +1 -1
  53. package/dist/collection/components/xpl-content-area/xpl-content-area.js +1 -1
  54. package/dist/collection/components/xpl-dashboard/xpl-dashboard.js +1 -1
  55. package/dist/collection/components/xpl-data-card/xpl-data-card.js +2 -2
  56. package/dist/collection/components/xpl-divider/xpl-divider.js +1 -1
  57. package/dist/collection/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.js +1 -1
  58. package/dist/collection/components/xpl-dropdown/xpl-dropdown-heading/xpl-dropdown-heading.js +1 -1
  59. package/dist/collection/components/xpl-dropdown/xpl-dropdown-option/xpl-dropdown-option.js +2 -2
  60. package/dist/collection/components/xpl-dropdown/xpl-dropdown.js +77 -7
  61. package/dist/collection/components/xpl-dynamic-table/xpl-dynamic-table.js +1 -1
  62. package/dist/collection/components/xpl-dynamic-table-cell/xpl-dynamic-table-cell.js +2 -2
  63. package/dist/collection/components/xpl-dynamic-table-row/xpl-dynamic-table-row.js +2 -2
  64. package/dist/collection/components/xpl-grid/xpl-grid.js +1 -1
  65. package/dist/collection/components/xpl-grid-item/xpl-grid-item.js +1 -1
  66. package/dist/collection/components/xpl-header-accordion/xpl-header-accordion.js +53 -46
  67. package/dist/collection/components/xpl-icon/xpl-icon.js +2 -2
  68. package/dist/collection/components/xpl-input/xpl-input-color/xpl-input-color.js +8 -8
  69. package/dist/collection/components/xpl-input/xpl-input-date/xpl-input-date.js +3 -3
  70. package/dist/collection/components/xpl-input/xpl-input-file/xpl-input-file.js +4 -4
  71. package/dist/collection/components/xpl-input/xpl-input-phone/xpl-input-phone.js +5 -5
  72. package/dist/collection/components/xpl-input/xpl-input-search/xpl-input-search.js +1 -1
  73. package/dist/collection/components/xpl-input/xpl-input-time/xpl-input-time.js +2 -2
  74. package/dist/collection/components/xpl-input/xpl-input.js +2 -2
  75. package/dist/collection/components/xpl-large-card/xpl-large-card.js +1 -1
  76. package/dist/collection/components/xpl-list/xpl-list.js +2 -2
  77. package/dist/collection/components/xpl-main-nav/xpl-main-nav.js +1 -1
  78. package/dist/collection/components/xpl-modal/xpl-modal.js +1 -1
  79. package/dist/collection/components/xpl-nav-item/xpl-nav-item.js +2 -2
  80. package/dist/collection/components/xpl-pagination/pagination.stories.js +18 -0
  81. package/dist/collection/components/xpl-pagination/xpl-pagination.js +7 -3
  82. package/dist/collection/components/xpl-panel/xpl-panel.js +2 -2
  83. package/dist/collection/components/xpl-popover/xpl-popover.js +4 -4
  84. package/dist/collection/components/xpl-progress-bar/xpl-progress-bar.js +2 -2
  85. package/dist/collection/components/xpl-progress-indicator/xpl-progress-indicator.js +1 -1
  86. package/dist/collection/components/xpl-radio/xpl-radio.js +3 -3
  87. package/dist/collection/components/xpl-secondary-nav/xpl-secondary-nav.js +1 -1
  88. package/dist/collection/components/xpl-select/xpl-select.js +58 -6
  89. package/dist/collection/components/xpl-side-nav/xpl-side-nav-item/xpl-side-nav-item.js +2 -2
  90. package/dist/collection/components/xpl-side-nav/xpl-side-nav.js +2 -2
  91. package/dist/collection/components/xpl-skeleton/xpl-skeleton.js +1 -1
  92. package/dist/collection/components/xpl-slideout/xpl-slideout.js +1 -1
  93. package/dist/collection/components/xpl-tab-panel/xpl-tab-panel.js +2 -2
  94. package/dist/collection/components/xpl-table/table.stories.js +67 -319
  95. package/dist/collection/components/xpl-table/xpl-table.js +151 -1456
  96. package/dist/collection/components/xpl-table-header/table-header.stories.js +126 -0
  97. package/dist/collection/components/xpl-table-header/xpl-table-header.js +7 -0
  98. package/dist/collection/components/xpl-table-header-cell/table-header-cell.stories.js +75 -0
  99. package/dist/collection/components/xpl-table-header-cell/xpl-table-header-cell.js +188 -0
  100. package/dist/collection/components/xpl-tabs/xpl-tabs.js +5 -5
  101. package/dist/collection/components/xpl-tag/xpl-tag.js +2 -2
  102. package/dist/collection/components/xpl-toast/xpl-toast.js +2 -2
  103. package/dist/collection/components/xpl-toggle/xpl-toggle.js +3 -3
  104. package/dist/collection/components/xpl-toolbar/xpl-toolbar.js +2 -2
  105. package/dist/collection/components/xpl-tooltip/xpl-tooltip.js +1 -1
  106. package/dist/collection/components/xpl-top-nav/xpl-nav-header-menu/xpl-nav-header-menu.js +2 -2
  107. package/dist/collection/components/xpl-top-nav/xpl-top-nav-item/xpl-top-nav-item.js +2 -2
  108. package/dist/collection/components/xpl-top-nav/xpl-top-nav.js +5 -5
  109. package/dist/collection/components/xpl-utility-bar/xpl-utility-bar.js +1 -1
  110. package/dist/components/index.js +1 -1
  111. package/dist/components/xpl-accordion.js +1 -1
  112. package/dist/components/xpl-application-shell.js +1 -1
  113. package/dist/components/xpl-backdrop2.js +1 -1
  114. package/dist/components/xpl-badge2.js +1 -1
  115. package/dist/components/xpl-banner.js +1 -1
  116. package/dist/components/xpl-breadcrumb-item.js +1 -1
  117. package/dist/components/xpl-breadcrumbs.js +1 -1
  118. package/dist/components/xpl-button-row.js +1 -1
  119. package/dist/components/xpl-button2.js +1 -1
  120. package/dist/components/xpl-calendar.js +1 -1
  121. package/dist/components/xpl-checkbox2.js +1 -1
  122. package/dist/components/xpl-choicelist.js +1 -1
  123. package/dist/components/xpl-content-area.js +1 -1
  124. package/dist/components/xpl-dashboard.js +1 -1
  125. package/dist/components/xpl-data-card.js +1 -1
  126. package/dist/components/xpl-divider2.js +1 -1
  127. package/dist/components/xpl-dropdown-group2.js +1 -1
  128. package/dist/components/xpl-dropdown-heading2.js +1 -1
  129. package/dist/components/xpl-dropdown-option2.js +1 -1
  130. package/dist/components/xpl-dropdown2.js +1 -1
  131. package/dist/components/xpl-dynamic-table-cell.js +1 -1
  132. package/dist/components/xpl-dynamic-table-row.js +1 -1
  133. package/dist/components/xpl-dynamic-table.js +1 -1
  134. package/dist/components/xpl-grid-item.js +1 -1
  135. package/dist/components/xpl-grid.js +1 -1
  136. package/dist/components/xpl-header-accordion.js +1 -1
  137. package/dist/components/xpl-icon2.js +1 -1
  138. package/dist/components/xpl-input-date2.js +1 -1
  139. package/dist/components/xpl-input-file2.js +1 -1
  140. package/dist/components/xpl-input-search2.js +1 -1
  141. package/dist/components/xpl-input2.js +1 -1
  142. package/dist/components/xpl-large-card.js +1 -1
  143. package/dist/components/xpl-list.js +1 -1
  144. package/dist/components/xpl-main-nav.js +1 -1
  145. package/dist/components/xpl-modal.js +1 -1
  146. package/dist/components/xpl-nav-header-menu.js +1 -1
  147. package/dist/components/xpl-nav-item.js +1 -1
  148. package/dist/components/xpl-pagination.js +1 -1
  149. package/dist/components/xpl-panel.js +1 -1
  150. package/dist/components/xpl-popover2.js +1 -1
  151. package/dist/components/xpl-progress-bar.js +1 -1
  152. package/dist/components/xpl-progress-indicator.js +1 -1
  153. package/dist/components/xpl-radio2.js +1 -1
  154. package/dist/components/xpl-secondary-nav.js +1 -1
  155. package/dist/components/xpl-select2.js +1 -1
  156. package/dist/components/xpl-side-nav-item.js +1 -1
  157. package/dist/components/xpl-side-nav.js +1 -1
  158. package/dist/components/xpl-skeleton.js +1 -1
  159. package/dist/components/xpl-slideout.js +1 -1
  160. package/dist/components/xpl-tab-panel.js +1 -1
  161. package/dist/components/xpl-table-header-cell.js +1 -1
  162. package/dist/components/xpl-table-header.js +1 -1
  163. package/dist/components/xpl-table.js +1 -1
  164. package/dist/components/xpl-tabs.js +1 -1
  165. package/dist/components/xpl-tag2.js +1 -1
  166. package/dist/components/xpl-toast.js +1 -1
  167. package/dist/components/xpl-toggle.js +1 -1
  168. package/dist/components/xpl-toolbar.js +1 -1
  169. package/dist/components/xpl-tooltip2.js +1 -1
  170. package/dist/components/xpl-top-nav-item2.js +1 -1
  171. package/dist/components/xpl-top-nav.js +1 -1
  172. package/dist/components/xpl-utility-bar.js +1 -1
  173. package/dist/docs/xpl-checkbox/readme.md +5 -7
  174. package/dist/docs/xpl-dropdown/readme.md +13 -11
  175. package/dist/docs/xpl-dynamic-table/readme.md +19 -22
  176. package/dist/docs/xpl-dynamic-table-cell/readme.md +18 -20
  177. package/dist/docs/xpl-dynamic-table-row/readme.md +19 -21
  178. package/dist/docs/xpl-icon/readme.md +1 -1
  179. package/dist/docs/xpl-select/readme.md +17 -15
  180. package/dist/docs/xpl-table/readme.md +46 -110
  181. package/dist/docs/{xpl-table/xpl-table-header → xpl-table-header}/readme.md +13 -13
  182. package/dist/docs/xpl-table-header-cell/readme.md +47 -0
  183. package/dist/esm/apollo-core.js +1 -1
  184. package/dist/esm/index-C7bgJs6C.js +10 -2
  185. package/dist/esm/loader.js +1 -1
  186. package/dist/esm/xpl-accordion.entry.js +2 -2
  187. package/dist/esm/xpl-application-shell.entry.js +1 -1
  188. package/dist/esm/{xpl-avatar_61.entry.js → xpl-avatar_54.entry.js} +239 -1677
  189. package/dist/esm/xpl-button-row.entry.js +1 -1
  190. package/dist/esm/xpl-calendar.entry.js +1 -1
  191. package/dist/esm/xpl-dynamic-table-cell.entry.js +2 -2
  192. package/dist/esm/xpl-dynamic-table-row.entry.js +2 -2
  193. package/dist/esm/xpl-dynamic-table.entry.js +1 -1
  194. package/dist/esm/xpl-grid-item.entry.js +1 -1
  195. package/dist/esm/xpl-grid.entry.js +1 -1
  196. package/dist/esm/xpl-large-card.entry.js +1 -1
  197. package/dist/esm/xpl-main-nav.entry.js +1 -1
  198. package/dist/esm/xpl-table-header-cell.entry.js +55 -0
  199. package/dist/esm/xpl-table-header.entry.js +12 -0
  200. package/dist/esm/xpl-toggle.entry.js +3 -3
  201. package/dist/esm/xpl-toolbar.entry.js +2 -2
  202. package/dist/types/components/xpl-checkbox/xpl-checkbox.d.ts +2 -2
  203. package/dist/types/components/xpl-dropdown/xpl-dropdown.d.ts +5 -0
  204. package/dist/types/components/xpl-header-accordion/xpl-header-accordion.d.ts +10 -9
  205. package/dist/types/components/xpl-pagination/pagination.stories.d.ts +13 -0
  206. package/dist/types/components/xpl-select/xpl-select.d.ts +3 -0
  207. package/dist/types/components/xpl-table/table.stories.d.ts +19 -161
  208. package/dist/types/components/xpl-table/xpl-table.d.ts +21 -123
  209. package/dist/types/components/{xpl-table/xpl-table-header → xpl-table-header}/table-header.stories.d.ts +16 -13
  210. package/dist/types/components/{xpl-table/xpl-table-header-cell → xpl-table-header-cell}/table-header-cell.stories.d.ts +20 -24
  211. package/dist/types/components/xpl-table-header-cell/xpl-table-header-cell.d.ts +13 -0
  212. package/dist/types/components.d.ts +89 -391
  213. package/package.json +10 -1
  214. package/dist/apollo-core/p-146d5d55.entry.js +0 -1
  215. package/dist/apollo-core/p-16742606.entry.js +0 -1
  216. package/dist/apollo-core/p-3eb5eb7c.entry.js +0 -1
  217. package/dist/apollo-core/p-4882f0bd.entry.js +0 -1
  218. package/dist/apollo-core/p-64b34268.entry.js +0 -1
  219. package/dist/apollo-core/p-71b75f36.entry.js +0 -1
  220. package/dist/apollo-core/p-84254a24.entry.js +0 -1
  221. package/dist/apollo-core/p-9f2a0321.entry.js +0 -1
  222. package/dist/apollo-core/p-cde83ab0.entry.js +0 -1
  223. package/dist/apollo-core/p-e7363036.entry.js +0 -1
  224. package/dist/collection/components/xpl-table/utils/move-row-dom.js +0 -50
  225. package/dist/collection/components/xpl-table/utils/table-internal.js +0 -58
  226. package/dist/collection/components/xpl-table/xpl-table-body/xpl-table-body.js +0 -7
  227. package/dist/collection/components/xpl-table/xpl-table-cell/xpl-table-cell.js +0 -155
  228. package/dist/collection/components/xpl-table/xpl-table-footer/xpl-table-footer.js +0 -7
  229. package/dist/collection/components/xpl-table/xpl-table-footer-cell/xpl-table-footer-cell.js +0 -37
  230. package/dist/collection/components/xpl-table/xpl-table-header/table-header.stories.js +0 -131
  231. package/dist/collection/components/xpl-table/xpl-table-header/xpl-table-header.js +0 -7
  232. package/dist/collection/components/xpl-table/xpl-table-header-cell/table-header-cell.stories.js +0 -105
  233. package/dist/collection/components/xpl-table/xpl-table-header-cell/xpl-table-header-cell.js +0 -402
  234. package/dist/collection/components/xpl-table/xpl-table-row/xpl-table-row.js +0 -121
  235. package/dist/components/lifecycle.js +0 -1
  236. package/dist/components/xpl-table-body.d.ts +0 -11
  237. package/dist/components/xpl-table-body.js +0 -1
  238. package/dist/components/xpl-table-cell.d.ts +0 -11
  239. package/dist/components/xpl-table-cell.js +0 -1
  240. package/dist/components/xpl-table-cell2.js +0 -1
  241. package/dist/components/xpl-table-footer-cell.d.ts +0 -11
  242. package/dist/components/xpl-table-footer-cell.js +0 -1
  243. package/dist/components/xpl-table-footer-cell2.js +0 -1
  244. package/dist/components/xpl-table-footer.d.ts +0 -11
  245. package/dist/components/xpl-table-footer.js +0 -1
  246. package/dist/components/xpl-table-header-cell2.js +0 -1
  247. package/dist/components/xpl-table-row.d.ts +0 -11
  248. package/dist/components/xpl-table-row.js +0 -1
  249. package/dist/docs/xpl-table/xpl-table-body/readme.md +0 -10
  250. package/dist/docs/xpl-table/xpl-table-cell/readme.md +0 -33
  251. package/dist/docs/xpl-table/xpl-table-footer/readme.md +0 -10
  252. package/dist/docs/xpl-table/xpl-table-footer-cell/readme.md +0 -30
  253. package/dist/docs/xpl-table/xpl-table-header-cell/readme.md +0 -66
  254. package/dist/docs/xpl-table/xpl-table-row/readme.md +0 -19
  255. package/dist/types/components/xpl-table/utils/move-row-dom.d.ts +0 -3
  256. package/dist/types/components/xpl-table/utils/table-internal.d.ts +0 -8
  257. package/dist/types/components/xpl-table/xpl-table-body/xpl-table-body.d.ts +0 -3
  258. package/dist/types/components/xpl-table/xpl-table-cell/xpl-table-cell.d.ts +0 -11
  259. package/dist/types/components/xpl-table/xpl-table-footer/xpl-table-footer.d.ts +0 -3
  260. package/dist/types/components/xpl-table/xpl-table-footer-cell/xpl-table-footer-cell.d.ts +0 -4
  261. package/dist/types/components/xpl-table/xpl-table-header-cell/xpl-table-header-cell.d.ts +0 -32
  262. package/dist/types/components/xpl-table/xpl-table-row/xpl-table-row.d.ts +0 -13
  263. /package/dist/types/components/{xpl-table/xpl-table-header → xpl-table-header}/xpl-table-header.d.ts +0 -0
@@ -11,23 +11,26 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  return t;
12
12
  };
13
13
  import { h, Host, } from "@stencil/core";
14
- import { autoUpdate, computePosition, flip, hide, offset, size } from "@floating-ui/dom";
14
+ import { autoUpdate, computePosition, flip, hide, offset, size, } from "@floating-ui/dom";
15
15
  export class Dropdown {
16
16
  constructor() {
17
17
  this.isOpen = false;
18
18
  this.closeOnSelect = true;
19
19
  this.mode = 'single';
20
20
  this.anchorToTrigger = false;
21
+ this.placement = 'bottom-start';
21
22
  this.selectOnFocus = false;
22
23
  this.cleanupAutoUpdate = null;
23
24
  this.updateDropdownPosition = async (triggerEl) => {
24
- var _a;
25
+ var _a, _b;
25
26
  const { x, y, placement, middlewareData } = await computePosition(triggerEl, this.hostElement, {
26
27
  strategy: 'fixed',
27
- placement: 'bottom-start',
28
+ placement: this.placement,
28
29
  middleware: [
29
30
  offset(4),
30
- flip(),
31
+ flip(((_a = this.flipFallbackPlacements) === null || _a === void 0 ? void 0 : _a.length)
32
+ ? { fallbackPlacements: this.flipFallbackPlacements }
33
+ : {}),
31
34
  size({
32
35
  apply: ({ availableHeight, rects }) => {
33
36
  const listEl = this.hostElement.querySelector('.xpl-dropdown-list');
@@ -63,7 +66,7 @@ export class Dropdown {
63
66
  });
64
67
  if (!this.cleanupAutoUpdate)
65
68
  return;
66
- if ((_a = middlewareData.hide) === null || _a === void 0 ? void 0 : _a.referenceHidden) {
69
+ if ((_b = middlewareData.hide) === null || _b === void 0 ? void 0 : _b.referenceHidden) {
67
70
  this.isOpen = false;
68
71
  return;
69
72
  }
@@ -95,6 +98,16 @@ export class Dropdown {
95
98
  this.startPositioning();
96
99
  }
97
100
  }
101
+ onFlipFallbackPlacementsChanged() {
102
+ if (this.isOpen && this.anchorToTrigger) {
103
+ this.startPositioning();
104
+ }
105
+ }
106
+ onPlacementChanged() {
107
+ if (this.isOpen && this.anchorToTrigger) {
108
+ this.startPositioning();
109
+ }
110
+ }
98
111
  onTriggerIdChanged() {
99
112
  if (this.isOpen) {
100
113
  this.startPositioning();
@@ -222,12 +235,12 @@ export class Dropdown {
222
235
  var { groupName, options: opts, subtitle } = _a, properties = __rest(_a, ["groupName", "options", "subtitle"]);
223
236
  return groupName ? (h("xpl-dropdown-group", Object.assign({ groupName: groupName, options: opts }, properties))) : (h("xpl-dropdown-option", Object.assign({ subtitle: subtitle }, properties)));
224
237
  });
225
- return (h(Host, { key: 'ef1637b50d96200219f93a992cecd838bdc37ae7', "aria-expanded": isOpen ? 'true' : 'false', class: {
238
+ return (h(Host, { key: '1ef465611f9a8501af41c17523352714a7921f29', "aria-expanded": isOpen ? 'true' : 'false', class: {
226
239
  'xpl-dropdown': true,
227
240
  'xpl-dropdown--multi': mode === 'multi',
228
241
  'xpl-dropdown--open': isOpen,
229
242
  'xpl-dropdown--anchor-to-trigger': this.anchorToTrigger,
230
- }, role: "listbox" }, h("slot", { key: '69889998dda0b69e3e582b089baf295c8cfca39d', name: "header" }), h("ul", { key: 'dcb7e840e724ebae950f8c85fca142bcf767cc5d', class: "xpl-dropdown-list" }, mappedOptions || h("slot", { key: 'b33fd8bb6a1871db5e04173f0ad55a6485ee474a', name: "options" }))));
243
+ }, role: "listbox" }, h("slot", { key: '118c8b34e72aa6ab018e6fa9ff29a18ae540b89e', name: "header" }), h("ul", { key: '01544e6aa8d785c48b4f677de102efe4ecc7b53a', class: "xpl-dropdown-list" }, mappedOptions || h("slot", { key: 'f70619995bed02540cef11deaeb6c3e5704165ff', name: "options" }))));
231
244
  }
232
245
  static get is() { return "xpl-dropdown"; }
233
246
  static get properties() {
@@ -336,6 +349,57 @@ export class Dropdown {
336
349
  "attribute": "anchor-to-trigger",
337
350
  "defaultValue": "false"
338
351
  },
352
+ "flipFallbackPlacements": {
353
+ "type": "unknown",
354
+ "mutable": false,
355
+ "complexType": {
356
+ "original": "Placement[]",
357
+ "resolved": "Placement[]",
358
+ "references": {
359
+ "Placement": {
360
+ "location": "import",
361
+ "path": "@floating-ui/dom",
362
+ "id": "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.d.mts::Placement",
363
+ "referenceLocation": "Placement"
364
+ }
365
+ }
366
+ },
367
+ "required": false,
368
+ "optional": true,
369
+ "docs": {
370
+ "tags": [],
371
+ "text": "When `anchorToTrigger` is true, additional placements to try when the\ndefault `placement` does not fit (passed to Floating UI `flip`)."
372
+ },
373
+ "getter": false,
374
+ "setter": false
375
+ },
376
+ "placement": {
377
+ "type": "string",
378
+ "mutable": false,
379
+ "complexType": {
380
+ "original": "Placement",
381
+ "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
382
+ "references": {
383
+ "Placement": {
384
+ "location": "import",
385
+ "path": "@floating-ui/dom",
386
+ "id": "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.d.mts::Placement",
387
+ "referenceLocation": "Placement"
388
+ }
389
+ }
390
+ },
391
+ "required": false,
392
+ "optional": false,
393
+ "docs": {
394
+ "tags": [],
395
+ "text": "Floating UI placement when `anchorToTrigger` is true (e.g. `bottom-start`, `top-start`)."
396
+ },
397
+ "getter": false,
398
+ "setter": false,
399
+ "reflect": false,
400
+ "attribute": "placement",
401
+ "defaultValue": "'bottom-start'"
402
+ },
339
403
  "selectedValues": {
340
404
  "type": "string",
341
405
  "mutable": false,
@@ -480,6 +544,12 @@ export class Dropdown {
480
544
  return [{
481
545
  "propName": "anchorToTrigger",
482
546
  "methodName": "onAnchorToTriggerChanged"
547
+ }, {
548
+ "propName": "flipFallbackPlacements",
549
+ "methodName": "onFlipFallbackPlacementsChanged"
550
+ }, {
551
+ "propName": "placement",
552
+ "methodName": "onPlacementChanged"
483
553
  }, {
484
554
  "propName": "triggerId",
485
555
  "methodName": "onTriggerIdChanged"
@@ -51,7 +51,7 @@ export class DynamicTable {
51
51
  this.updateColumnCount();
52
52
  }
53
53
  render() {
54
- return (h("div", { key: '9ae7568410463f24a85e39da8b14dc70e99730c3', role: "grid", class: "xpl-dynamic-table", "aria-colcount": this.colCount }, h("slot", { key: 'c84c62c9eb47d1bf02c6e7d8a8c3d59542ef5f7b', name: "header" }), h("slot", { key: '26012976f5d8474f4a648816e9dc92355611177a', name: "body" })));
54
+ return (h("div", { key: '8f33da5fa8815400447b1690172bdaddd1079c1a', role: "grid", class: "xpl-dynamic-table", "aria-colcount": this.colCount }, h("slot", { key: '221aced83acf1fc4c904533eaedb1cd79914c5d3', name: "header" }), h("slot", { key: '6087119ce1499e94a30d09a1917d9371331f6add', name: "body" })));
55
55
  }
56
56
  static get is() { return "xpl-dynamic-table"; }
57
57
  static get states() {
@@ -19,9 +19,9 @@ export class DynamicTableCell {
19
19
  }
20
20
  render() {
21
21
  const colIndex = Array.from(this.el.parentElement.children).indexOf(this.el) + 1;
22
- return (h(Host, { key: '924f54186ae2eb07bb4fab65eed7815f60be3a95', role: "gridcell", "aria-colindex": colIndex, class: "xpl-dynamic-table-cell", ref: (el) => {
22
+ return (h(Host, { key: '7cfa2d58f634e41ccf1604a581fcc83a2b51676f', role: "gridcell", "aria-colindex": colIndex, class: "xpl-dynamic-table-cell", ref: (el) => {
23
23
  this.hostElement = el;
24
- } }, h("slot", { key: 'a18ef630d9f7f4c8b4079f2d83afe6b28700fb90' })));
24
+ } }, h("slot", { key: 'c6a04082cb8aa1089d9f6cb82f3db8d7f0addf6e' })));
25
25
  }
26
26
  static get is() { return "xpl-dynamic-table-cell"; }
27
27
  static get properties() {
@@ -24,9 +24,9 @@ export class DynamicTableRow {
24
24
  const classList = `xpl-dynamic-table-row
25
25
  ${this.isDisabled ? 'disabled' : ''}
26
26
  ${this.selected ? 'selected' : ''}`;
27
- return (h(Host, { key: 'b1a117c4961d5a2f618510159b292184c2c1aed3', role: "row", class: classList, ref: (el) => {
27
+ return (h(Host, { key: '0d099456d2016263a2bdcd42b46794e08adb64cf', role: "row", class: classList, ref: (el) => {
28
28
  this.hostElement = el;
29
- } }, h("slot", { key: 'be0ef005b0ed337272e92d29dda61dcbe966c4ed' })));
29
+ } }, h("slot", { key: 'c923f7f8dc4bb8a4527693259d1a8b5932bb6c10' })));
30
30
  }
31
31
  static get is() { return "xpl-dynamic-table-row"; }
32
32
  static get properties() {
@@ -22,7 +22,7 @@ export class Grid {
22
22
  });
23
23
  }
24
24
  render() {
25
- return h(Host, { key: '0036b594c89e75a9b302e7a7d9c99d4703a8b729', class: "xpl-grid" });
25
+ return h(Host, { key: 'aeee950fb242a14f50ceda1d199cf427597b70f6', class: "xpl-grid" });
26
26
  }
27
27
  static get is() { return "xpl-grid"; }
28
28
  static get elementRef() { return "container"; }
@@ -12,7 +12,7 @@ export class GridItem {
12
12
  className += ` xpl-grid-item-sm-${this.sm}`;
13
13
  className += ` xpl-grid-item-md-${this.md}`;
14
14
  className += ` xpl-grid-item-lg-${this.lg}`;
15
- return (h(Host, { key: 'bb28d83b6fd6ee92390ffcb5a505f5084f5624b9', class: className }, h("slot", { key: 'db3cf487db67044879425c830a14a44e06d19414' })));
15
+ return (h(Host, { key: '43cf6dd21d3d06e2d8012b716e5db5aeee676aac', class: className }, h("slot", { key: 'e08e03e4152007df7158d7122f883da1050dfde7' })));
16
16
  }
17
17
  static get is() { return "xpl-grid-item"; }
18
18
  static get properties() {
@@ -1,13 +1,13 @@
1
1
  import { Host, h } from "@stencil/core";
2
2
  export class HeaderAccordion {
3
3
  constructor() {
4
- this.expanded = false;
5
- this.parentChecked = false;
6
- this.parentIndeterminate = false;
7
- this.disabled = false;
8
- this.hasCheckbox = true;
9
4
  this.initialExpanded = false;
5
+ this.disabled = false;
10
6
  this.selectedCount = -1;
7
+ this.hasCheckbox = true;
8
+ this.expanded = this.initialExpanded;
9
+ this.parentChecked = false;
10
+ this.parentIndeterminate = false;
11
11
  this.toggleAccordion = () => {
12
12
  this.expanded = !this.expanded;
13
13
  };
@@ -21,24 +21,19 @@ export class HeaderAccordion {
21
21
  });
22
22
  };
23
23
  }
24
- watchSelectedCount(selectedCount) {
25
- if (selectedCount > -1) {
26
- this.updateParentCheckbox(selectedCount);
24
+ applyBorderRadiusToLastRow() {
25
+ var _a;
26
+ if (this.expanded) {
27
+ const rows = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('xpl-dynamic-table-row');
28
+ const lastRow = rows[rows.length - 1];
29
+ const cells = lastRow === null || lastRow === void 0 ? void 0 : lastRow.querySelectorAll('xpl-dynamic-table-cell');
30
+ cells[0].style.borderBottomLeftRadius = '0.5rem';
31
+ cells[cells.length - 1].style.borderBottomRightRadius = '0.5rem';
27
32
  }
28
33
  }
29
- componentWillLoad() {
30
- this.expanded = this.initialExpanded;
31
- }
32
- componentDidLoad() {
33
- const initialCheckboxesValue = this.selectedCount > -1 ? this.selectedCount : 0;
34
- this.updateParentCheckbox(initialCheckboxesValue);
35
- }
36
- handleChildCheckboxChange() {
37
- var _a;
38
- if (this.selectedCount === -1) {
39
- const childCheckboxes = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('[role="region"] xpl-checkbox input:not([disabled])');
40
- const checkedCount = Array.from(childCheckboxes).filter((checkbox) => checkbox.checked).length;
41
- this.updateParentCheckbox(checkedCount);
34
+ watchSelectedCount(selectedCount, _previousCount) {
35
+ if (selectedCount > -1) {
36
+ this.updateParentCheckbox(selectedCount);
42
37
  }
43
38
  }
44
39
  updateParentCheckbox(selectedCount) {
@@ -57,11 +52,23 @@ export class HeaderAccordion {
57
52
  this.parentIndeterminate = true;
58
53
  }
59
54
  }
55
+ handleChildCheckboxChange() {
56
+ var _a;
57
+ if (this.selectedCount === -1) {
58
+ const childCheckboxes = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('[role="region"] xpl-checkbox input:not([disabled])');
59
+ const checkedCount = Array.from(childCheckboxes).filter((checkbox) => checkbox.checked).length;
60
+ this.updateParentCheckbox(checkedCount);
61
+ }
62
+ }
63
+ componentDidLoad() {
64
+ const initialCheckoxesValue = this.selectedCount > -1 ? this.selectedCount : 0;
65
+ this.updateParentCheckbox(initialCheckoxesValue);
66
+ }
67
+ componentWillRender() {
68
+ this.applyBorderRadiusToLastRow();
69
+ }
60
70
  render() {
61
- return (h(Host, { key: '216b10c02e1248c374ec646d30f835163b9b7792', class: {
62
- 'xpl-header-accordion': true,
63
- 'xpl-header-accordion--expanded': this.expanded,
64
- } }, h("div", { key: '41cbb9358a5d76f44f135d76c945fe801cafc474', class: `header-accordion header-accordion--${this.expanded ? 'expanded' : 'collapsed'}` }, this.hasCheckbox && (h("xpl-checkbox", { key: 'c939d100f687b14455424ee3f0b6bdfd7de785bb', class: "xpl-header-accordion__parent-checkbox", checked: this.parentChecked, disabled: this.disabled, indeterminate: this.parentIndeterminate, onCheckboxChange: (event) => this.handleParentCheckboxChange(event.detail) })), h("button", { key: '4d98d8d75b4c7c7ba8e50ce6d43ed3b83919d624', "aria-expanded": this.expanded, "aria-controls": this.contentId, class: "toggle-area", onClick: this.toggleAccordion, type: "button" }, h("slot", { key: 'd9c993b7e8e6cf0b46014d6c535a52c84386b8ed', name: "title" }), h("xpl-icon", { key: '58d114ae4dd93c9ec15e3d74cfb2d33c6c1b57cb', size: 20, icon: "chevron-down", class: this.expanded && 'rotate' }))), h("div", { key: '46a98c094621ec02c9416bcfa7a2d33e6ce468d4', id: this.contentId, role: "region", class: !this.expanded ? 'content--hidden' : 'content--shown' }, h("slot", { key: '7966e352ec17125afa59a7590dbc8e9372a39f41', name: "content" }))));
71
+ return (h(Host, { key: '33b59f238ef5eabce7a83dec5e189459038ac2e0', class: "xpl-header-accordion" }, h("div", { key: '1269fe93be898a0300a1c840ad8919608c86bbff', class: `header-accordion header-accordion--${this.expanded ? 'expanded' : 'collapsed'}` }, this.hasCheckbox && (h("xpl-checkbox", { key: '16a93cbaab64072990502ed7d1bc2a496ad31425', class: "xpl-header-accordion__parent-checkbox", checked: this.parentChecked, disabled: this.disabled, indeterminate: this.parentIndeterminate, onCheckboxChange: (event) => this.handleParentCheckboxChange(event.detail) })), h("button", { key: '00e7024adcd3c8cef52cc5d11be8e4dc6319c1a8', "aria-expanded": this.expanded, "aria-controls": this.contentId, class: "toggle-area", onClick: this.toggleAccordion, type: "button" }, h("slot", { key: '16fc847fff7d27f73c589bff9670fdbdec9f58cc', name: "title" }), h("xpl-icon", { key: '44e27d19feb130c0903949d24a9c71f19f8475b6', size: 16, icon: "chevron-down", class: this.expanded && 'rotate' }))), h("div", { key: 'aa8bd514da7666ed09c72c5b271ea0eeda729ef8', id: this.contentId, role: "region", class: !this.expanded ? 'content--hidden' : 'content--shown' }, h("slot", { key: 'b8adf0af8ea58edad1036fc45277ef6621bc8fbb', name: "content" }))));
65
72
  }
66
73
  static get is() { return "xpl-header-accordion"; }
67
74
  static get properties() {
@@ -85,7 +92,7 @@ export class HeaderAccordion {
85
92
  "reflect": false,
86
93
  "attribute": "content-id"
87
94
  },
88
- "disabled": {
95
+ "initialExpanded": {
89
96
  "type": "boolean",
90
97
  "mutable": false,
91
98
  "complexType": {
@@ -97,15 +104,15 @@ export class HeaderAccordion {
97
104
  "optional": false,
98
105
  "docs": {
99
106
  "tags": [],
100
- "text": "Whether the accordion is disabled."
107
+ "text": "Whether the accordion is expanded initially."
101
108
  },
102
109
  "getter": false,
103
110
  "setter": false,
104
111
  "reflect": false,
105
- "attribute": "disabled",
112
+ "attribute": "initial-expanded",
106
113
  "defaultValue": "false"
107
114
  },
108
- "hasCheckbox": {
115
+ "disabled": {
109
116
  "type": "boolean",
110
117
  "mutable": false,
111
118
  "complexType": {
@@ -117,53 +124,53 @@ export class HeaderAccordion {
117
124
  "optional": false,
118
125
  "docs": {
119
126
  "tags": [],
120
- "text": "Whether to display a parent checkbox in the accordion header."
127
+ "text": "Whether the accordion is disabled."
121
128
  },
122
129
  "getter": false,
123
130
  "setter": false,
124
131
  "reflect": false,
125
- "attribute": "has-checkbox",
126
- "defaultValue": "true"
132
+ "attribute": "disabled",
133
+ "defaultValue": "false"
127
134
  },
128
- "initialExpanded": {
129
- "type": "boolean",
135
+ "selectedCount": {
136
+ "type": "number",
130
137
  "mutable": false,
131
138
  "complexType": {
132
- "original": "boolean",
133
- "resolved": "boolean",
139
+ "original": "number",
140
+ "resolved": "number",
134
141
  "references": {}
135
142
  },
136
143
  "required": false,
137
144
  "optional": false,
138
145
  "docs": {
139
146
  "tags": [],
140
- "text": "Whether the accordion is expanded initially."
147
+ "text": "The number of selected child items, or -1 to auto-calculate."
141
148
  },
142
149
  "getter": false,
143
150
  "setter": false,
144
151
  "reflect": false,
145
- "attribute": "initial-expanded",
146
- "defaultValue": "false"
152
+ "attribute": "selected-count",
153
+ "defaultValue": "-1"
147
154
  },
148
- "selectedCount": {
149
- "type": "number",
155
+ "hasCheckbox": {
156
+ "type": "boolean",
150
157
  "mutable": false,
151
158
  "complexType": {
152
- "original": "number",
153
- "resolved": "number",
159
+ "original": "boolean",
160
+ "resolved": "boolean",
154
161
  "references": {}
155
162
  },
156
163
  "required": false,
157
164
  "optional": false,
158
165
  "docs": {
159
166
  "tags": [],
160
- "text": "The number of selected child items, or -1 to auto-calculate."
167
+ "text": "Whether to display a parent checkbox in the accordion header."
161
168
  },
162
169
  "getter": false,
163
170
  "setter": false,
164
171
  "reflect": false,
165
- "attribute": "selected-count",
166
- "defaultValue": "-1"
172
+ "attribute": "has-checkbox",
173
+ "defaultValue": "true"
167
174
  }
168
175
  };
169
176
  }
@@ -16,10 +16,10 @@ export class Icon {
16
16
  let wrapperClasses = 'xpl-icon__wrapper ';
17
17
  if (this.backgroundColor)
18
18
  wrapperClasses += `xpl-icon__wrapper--with-background xpl-icon__wrapper--with-background--${this.backgroundColor}`;
19
- return (h(Host, { key: 'cf84ae3e7ff4ae0b4ae8e1b1cf3b9331bc887c6c' }, h("figure", { key: '74e2727f9bf4ff8d710eff9b99632ffa669b84ae', class: wrapperClasses }, h("span", { key: '2d8be2bd318bd27e0bc4299cfe518668e424fffe', "aria-label": this.icon, role: "img", class: "xpl-icon", style: {
19
+ return (h(Host, { key: '07522771501e6e67b0ae91bbee9cc8699d79fb8b' }, h("figure", { key: '2acf41e3e20ff3998050c948fcae5d0990cb706a', class: wrapperClasses }, h("span", { key: '560b2e62366ee0842442c29280a7e37b53edf2be', "aria-label": this.icon, role: "img", class: "xpl-icon", style: {
20
20
  width: `${options.width}px`,
21
21
  height: `${options.height}px`,
22
- }, innerHTML: (_a = apolloIcons.getIcon(this.icon)) === null || _a === void 0 ? void 0 : _a.toSVG(options) }), h("figcaption", { key: '3c7a383da59ac0766500273799b203a28c7c7ff3' }, this.icon, " icon"))));
22
+ }, innerHTML: (_a = apolloIcons.getIcon(this.icon)) === null || _a === void 0 ? void 0 : _a.toSVG(options) }), h("figcaption", { key: '256c0d05be8026b24a139f8bfff4f00c65112030' }, this.icon, " icon"))));
23
23
  }
24
24
  static get is() { return "xpl-icon"; }
25
25
  static get originalStyleUrls() {
@@ -193,16 +193,16 @@ export class InputColor {
193
193
  top: `${y}px`,
194
194
  background: `rgb(${r}, ${g}, ${b})`,
195
195
  };
196
- return (h(Host, { key: '6f03535db1b5f451c74a0f1a1abc586605e5c9ca', class: "xpl-input-color" }, h("xpl-popover", { key: 'dae1f3a3b7afdd9231b6feba2d3711fbd1d6716e', disabled: this.disabled, display: "menu" }, h("div", { key: 'a8402cf534186d06f940c3e3436db17afb0152e8', slot: "trigger" }, h("div", { key: 'e9e775229df2a4f8afa252ef03c0a0cd15a93aa4', class: {
196
+ return (h(Host, { key: 'f665a747f8938212d0c9ada4f251a9fc880ba82c', class: "xpl-input-color" }, h("xpl-popover", { key: 'eac77d1e9f350b3b0dd66001a7a596d156a75a53', disabled: this.disabled, display: "menu" }, h("div", { key: '73d1468c4261fd9a8e957189129cc660757d849f', slot: "trigger" }, h("div", { key: 'fa098788863247a7c87e4efe628b5b47f0bb3113', class: {
197
197
  'xpl-input-color__display': true,
198
198
  'xpl-input-color__display--disabled': this.disabled,
199
199
  'xpl-input-color__display--error': !!this.hasErrorState,
200
- } }, h("span", { key: '9abe3e899192f4f08e682f8d7a9a9af9adf5982f', class: "xpl-input-color__color", style: {
200
+ } }, h("span", { key: 'd471146ff3ba7b026dba1424599361d0aa0fe49c', class: "xpl-input-color__color", style: {
201
201
  background: objectToStringColor(this.colorValues),
202
- } }), this.colorValues.hex ? (h("span", { class: "xpl-input-color__value" }, objectToStringColor(this.colorValues))) : (h("span", { class: "xpl-input-color__placeholder" }, this.placeholder)), this.eyeDropperSupported && !this.hideEyeDropper && (h("xpl-icon", { key: '9e6832ca2ca1b91c9bf91b1816c1f7c8169202f3', size: 20, icon: "eye-dropper", class: "xpl-input-color__icon", onClick: (e) => {
202
+ } }), this.colorValues.hex ? (h("span", { class: "xpl-input-color__value" }, objectToStringColor(this.colorValues))) : (h("span", { class: "xpl-input-color__placeholder" }, this.placeholder)), this.eyeDropperSupported && !this.hideEyeDropper && (h("xpl-icon", { key: '5cd87456ef093611b6be8906c24b235ea7f19524', size: 20, icon: "eye-dropper", class: "xpl-input-color__icon", onClick: (e) => {
203
203
  e.stopPropagation();
204
204
  this.openEyeDropper();
205
- } })))), h("div", { key: '86643ca93847cff19653ebb54160588f2764ae17', class: "xpl-input-color__menu" }, h("div", { key: '40f43b769954163f0d22ff8dc80bcd2e0df4777e', class: "xpl-input-color__sl-grid", ref: (el) => {
205
+ } })))), h("div", { key: 'df7bdf567c9a697f8a5e737e5a8cb1b1b962dbb9', class: "xpl-input-color__menu" }, h("div", { key: 'ae630752b48e9d211273da6f3dadda8ace603ba2', class: "xpl-input-color__sl-grid", ref: (el) => {
206
206
  this.colorInputElements.slGrid = el;
207
207
  }, style: {
208
208
  background: [
@@ -210,9 +210,9 @@ export class InputColor {
210
210
  `linear-gradient(to right, #fff, #fff0)`,
211
211
  `rgb(${hueBaseColor.r} ${hueBaseColor.g} ${hueBaseColor.b})`,
212
212
  ].join(', '),
213
- }, onMouseDown: this.startDrag, onTouchStart: this.startDrag }, h("div", { key: '29f42021c1e55827f1fffcdd416608f01b6bda81', class: "xpl-input-color__sl-thumb", style: slThumbStyle })), h("div", { key: 'e727c66cd44ff40c672f58ae9264485cda3698b7', class: "xpl-input-color__grid" }, h("input", { key: '899cdc6cf61d1452809850dbc847c9df8265437b', type: "range", min: "0", max: "360", value: this.hue, class: "xpl-input-color__slider xpl-input-color__hue", name: "color-hue-slider", ref: (el) => {
213
+ }, onMouseDown: this.startDrag, onTouchStart: this.startDrag }, h("div", { key: '25ffc6bb94f0e861a3bc5a6da5c01e0901d1779e', class: "xpl-input-color__sl-thumb", style: slThumbStyle })), h("div", { key: '7d256baab084f96c56724b4eede835a13bee7055', class: "xpl-input-color__grid" }, h("input", { key: '227309d4590722c24c2d053c013a6d473e44a3ee', type: "range", min: "0", max: "360", value: this.hue, class: "xpl-input-color__slider xpl-input-color__hue", name: "color-hue-slider", ref: (el) => {
214
214
  this.colorInputElements.hue = el;
215
- } }), h("input", { key: '3e72ef16b142fe44bebbcbbd2686fcfa3fb958bc', type: "range", min: "0", max: "1", step: "0.01", value: a, class: "xpl-input-color__slider xpl-input-color__alpha", name: "color-alpha-slider", ref: (el) => {
215
+ } }), h("input", { key: '2d43e7c9f98fd5cdcccde7206c0cf4e5ae6bde6d', type: "range", min: "0", max: "1", step: "0.01", value: a, class: "xpl-input-color__slider xpl-input-color__alpha", name: "color-alpha-slider", ref: (el) => {
216
216
  this.colorInputElements.alpha = el;
217
217
  }, style: {
218
218
  backgroundImage: [
@@ -222,9 +222,9 @@ export class InputColor {
222
222
  `linear-gradient(45deg, transparent 75%, #ccc 75%)`,
223
223
  `linear-gradient(-45deg, transparent 75%, #ccc 75%)`,
224
224
  ].join(', '),
225
- } }), h("div", { key: 'c389627f5c0fa8878ead7d6765ecbe9b2f82debb', class: "xpl-input-color__preview", style: {
225
+ } }), h("div", { key: '26a562a220b2458e0ee99906d27d8a11e38f2d02', class: "xpl-input-color__preview", style: {
226
226
  background: `rgba(${r}, ${g}, ${b}, ${a})`,
227
- } })), h("div", { key: 'efd8daf09c022fdc19a6373f0bcd1d32b7548fd2', class: "xpl-input-color__inputs" }, Object.entries(this.colorInputElements)
227
+ } })), h("div", { key: 'a77a7325f72ef73e6aa2d6968ae4afd1e010cf2c', class: "xpl-input-color__inputs" }, Object.entries(this.colorInputElements)
228
228
  .filter(([key]) => ['hex', 'r', 'g', 'b', 'a'].includes(key))
229
229
  .map(([key]) => (h("xpl-input", { key: key, label: key.toLocaleUpperCase(), name: `color-${key}-input`, placeholder: key === 'hex' ? '793EF7' : '0', value: this.colorValues[key], ref: (elRef) => {
230
230
  this.colorInputElements[key] = elRef;
@@ -78,16 +78,16 @@ export class InputDate {
78
78
  parent.removeChild(wrapper);
79
79
  }
80
80
  render() {
81
- return (h(Host, { key: 'c2707549e3285693ce4c7e0449e047be90640504', class: {
81
+ return (h(Host, { key: '35b39ed37afa33603772cdd0dce79cf7533d36ec', class: {
82
82
  'xpl-input-date': true,
83
83
  [`xpl-input-date--mode-${this.mode}`]: true,
84
84
  'xpl-input-date--error': !!this.hasErrorState,
85
85
  'xpl-input-date--flatpickr-static': this.flatpickrStaticLayout,
86
- } }, h("div", { key: 'e6ac05a6d58d92570331489b8a317d17c0726873', class: "xpl-input-wrapper" }, this.pre && (h("label", { key: 'ef746e91506c2bd2c2bc9986bfbb7f0b82a0f079', class: "xpl-input-pre", htmlFor: this.inputId }, this.pre)), h("input", { key: '125e566456a2de4d75fe38fee50a78de886b8009', type: "date", id: this.inputId, disabled: this.disabled, name: this.name, required: this.required, readonly: this.readonly, placeholder: this.placeholder, max: this.max, min: this.min, ref: (el) => {
86
+ } }, h("div", { key: '14940421a3f9fb4e7a5acbd5abb222d927a701cf', class: "xpl-input-wrapper" }, this.pre && (h("label", { key: '108b33b4f0a87bacff90480633327dd221f6b1d4', class: "xpl-input-pre", htmlFor: this.inputId }, this.pre)), h("input", { key: '00633c5b69d25a94d7cd8501bde70459e8ebf2ce', type: "date", id: this.inputId, disabled: this.disabled, name: this.name, required: this.required, readonly: this.readonly, placeholder: this.placeholder, max: this.max, min: this.min, ref: (el) => {
87
87
  this.input = el;
88
88
  }, onChange: (event) => {
89
89
  this.valueChanged(event);
90
- } }), h("xpl-icon", { key: '399495edb8791cda73084dcef21663a3d207da2f', class: "xpl-input-calendar", icon: "calendar-month", size: 24 }), this.post && (h("label", { key: '6570bf947a23280b04389ed591f7ea401f14f1a5', class: "xpl-input-post", htmlFor: this.inputId }, this.post)))));
90
+ } }), h("xpl-icon", { key: 'ba0d694b7ace1359d6901c0110dce40a78805f74', class: "xpl-input-calendar", icon: "calendar-month", size: 24 }), this.post && (h("label", { key: '5ca7564e2096b697a75ebfb573654c0c23125245', class: "xpl-input-post", htmlFor: this.inputId }, this.post)))));
91
91
  }
92
92
  static get is() { return "xpl-input-date"; }
93
93
  static get properties() {
@@ -33,18 +33,18 @@ export class InputFile {
33
33
  }
34
34
  render() {
35
35
  var _a, _b;
36
- return (h(Host, { key: '579d1ec1094bc5b1aeec622996694728fb1facca', class: {
36
+ return (h(Host, { key: 'ec1645e7d48cf2b146727a6c131dbd7572468f17', class: {
37
37
  'xpl-input-file': true,
38
38
  'xpl-input-file--hide-trigger-on-select': this.hideTriggerOnSelect,
39
39
  'xpl-input-file--disabled': this.disabled,
40
- } }, h("span", { key: '66b3cc31f1e2bfa4ee1896e64a667e2a26166b50', class: {
40
+ } }, h("span", { key: '8dc3e290dcddba706316ec41443e2e87aa82f79f', class: {
41
41
  'xpl-input-file__trigger-wrapper': true,
42
42
  'xpl-input-file__trigger-wrapper--hidden': this.hideTriggerOnSelect && ((_a = this.files) === null || _a === void 0 ? void 0 : _a.length) > 0,
43
- }, role: "button", tabIndex: 0, onClick: this.openFileDialog }, h("slot", { key: '53b23be4e2a5b0f920e650c14e591cb1de3b8bac', name: "trigger" })), ((_b = this.files) === null || _b === void 0 ? void 0 : _b.length) > 0 && !this.hideFileNames && (h("ul", { key: '53a294c3765d5b6229f5ed79023095538a1c5edf', class: "xpl-input-file__file-list" }, this.files.map((file, fileIndex) => (h("li", { class: "xpl-input-file__file-item" }, h("span", { class: "xpl-text-callout" }, file.name), h("xpl-icon", { icon: "x-circle", size: 24, onClick: (e) => {
43
+ }, role: "button", tabIndex: 0, onClick: this.openFileDialog }, h("slot", { key: '2d2391a2ccca22170bfa0b9ace50a42fdba54284', name: "trigger" })), ((_b = this.files) === null || _b === void 0 ? void 0 : _b.length) > 0 && !this.hideFileNames && (h("ul", { key: 'c302bbbb5c1977c513dba82db70da1615f39a217', class: "xpl-input-file__file-list" }, this.files.map((file, fileIndex) => (h("li", { class: "xpl-input-file__file-item" }, h("span", { class: "xpl-text-callout" }, file.name), h("xpl-icon", { icon: "x-circle", size: 24, onClick: (e) => {
44
44
  e.preventDefault();
45
45
  e.stopPropagation();
46
46
  this.onRemoveFileByIndex(fileIndex);
47
- }, class: "xpl-input-file__remove-icon" })))))), this.accept && !this.hideAcceptText && (h("span", { key: 'afcd0be79ed4ffa5696990eb76d8615f61c430f9', class: "xpl-input-file__accept xpl-text-caption" }, "Accepted file types: ", this.accept)), h("input", { key: '08ffdfed6e25b11363e664abe7bdb66ae6b96bb7', onChange: this.handleFileChange, type: "file", ref: (el) => {
47
+ }, class: "xpl-input-file__remove-icon" })))))), this.accept && !this.hideAcceptText && (h("span", { key: '9252c5450f32e8d2ed478af9f84eef4a26cee49f', class: "xpl-input-file__accept xpl-text-caption" }, "Accepted file types: ", this.accept)), h("input", { key: 'd44213b6fd075bfb12c7857d3a56e06f78ef0fdc', onChange: this.handleFileChange, type: "file", ref: (el) => {
48
48
  this.fileInput = el;
49
49
  }, hidden: true, accept: this.accept, multiple: this.multiple, name: this.name })));
50
50
  }
@@ -196,21 +196,21 @@ export class InputPhone {
196
196
  }
197
197
  render() {
198
198
  var _a;
199
- return (h(Host, { key: '79d8146efc51fb1fba4e595655274beff9e2f09a', class: {
199
+ return (h(Host, { key: '4a55afb3d85dc5882eca2cab0a23b11374cc053e', class: {
200
200
  'xpl-input-phone': true,
201
201
  'xpl-input-phone--error': !!this.hasErrorState,
202
202
  'xpl-input-phone--open': this.dropdownOpen,
203
203
  'xpl-input-phone--domestic': !this.isInternational,
204
- } }, h("div", { key: 'f617abbc8656f0d9418e3bb87f0fdcd8b1646138', class: "xpl-input-wrapper" }, this.isInternational && (h("button", { key: '133d07a3d70e8c9e3c3a6690ae2296f176a409f7', type: "button", id: this.triggerId, class: "xpl-input-phone__trigger", disabled: this.disabled, "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpen ? 'true' : 'false', "aria-label": "Select country", onClick: this.handleTriggerClick }, ((_a = this.selectedCountry) === null || _a === void 0 ? void 0 : _a.name) && (h("xpl-icon", { key: '20928aee771232962454e469210a31718922286c', class: "xpl-input-phone__flag", icon: getCountryIconName(this.selectedCountry.name), size: 24, "aria-hidden": "true" })), h("xpl-icon", { key: '22078ac403d3965ba72ee9164520778f3f65cc56', class: "xpl-input-phone__trigger-icon", icon: "chevron-down", size: 20, "aria-hidden": "true" }))), h("div", { key: '29cab6a655c36fd5add277b6d3c0f06c498a742d', class: "xpl-input-phone__input-wrap" }, this.isInternational && (h("span", { key: 'e83457a14cd689f43082afb611c7641f1353da36', class: "xpl-input-phone__dial-code" }, this.effectiveDialCode)), h("input", { key: 'ee747daab159986e319599ec6705c8f5edc78c3e', ref: (el) => {
204
+ } }, h("div", { key: 'c7e46df1b58b6e76dda47b3b32f5a6abe29f048c', class: "xpl-input-wrapper" }, this.isInternational && (h("button", { key: 'ef1bedb4bad96760c81ad4dbf2cadb5a29d4abb9', type: "button", id: this.triggerId, class: "xpl-input-phone__trigger", disabled: this.disabled, "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpen ? 'true' : 'false', "aria-label": "Select country", onClick: this.handleTriggerClick }, ((_a = this.selectedCountry) === null || _a === void 0 ? void 0 : _a.name) && (h("xpl-icon", { key: 'a307f620c2815d63b17dbeb6c270d2972884e9d9', class: "xpl-input-phone__flag", icon: getCountryIconName(this.selectedCountry.name), size: 24, "aria-hidden": "true" })), h("xpl-icon", { key: 'c16e66d315877cec35e322a1164f765cd387931f', class: "xpl-input-phone__trigger-icon", icon: "chevron-down", size: 20, "aria-hidden": "true" }))), h("div", { key: '7a33b994588e4c5ea868a4e092709b8acd50a36f', class: "xpl-input-phone__input-wrap" }, this.isInternational && (h("span", { key: '5a39cfd472f5287fc8cf0648ce618e21dabf5e97', class: "xpl-input-phone__dial-code" }, this.effectiveDialCode)), h("input", { key: 'dfb25910769594bc9b9d1c861049605d7bdd9d0e', ref: (el) => {
205
205
  this.inputEl = el;
206
- }, type: "tel", id: this.inputId, class: "xpl-input-phone__input", name: this.name, disabled: this.disabled, readonly: this.readonly, required: this.required, "aria-invalid": this.hasErrorState ? 'true' : 'false', placeholder: this.effectivePlaceholder, autocomplete: this.isInternational ? 'tel-national' : 'tel', inputmode: "numeric", maxlength: this.maxInputLength, value: this.displayValue, onInput: this.handleNumberInput }), this.nationalNumber && this.isEditable && (h("button", { key: 'ddb1bb6cf9ab3fb4bc3295db64fc986fe5dbf69b', type: "button", class: "xpl-input-phone__clear", "aria-label": "Clear phone number", onClick: this.handleClear }, h("xpl-icon", { key: 'c0f3201d0b34f9cbe5af9247540199db0c184514', icon: "x-circle", size: 16 }))))), this.isInternational && this.isEditable && (h("xpl-dropdown", { key: '8d4e50ee17d880272eaccf08cf8c84fc4400c36d', ref: (el) => {
206
+ }, type: "tel", id: this.inputId, class: "xpl-input-phone__input", name: this.name, disabled: this.disabled, readonly: this.readonly, required: this.required, "aria-invalid": this.hasErrorState ? 'true' : 'false', placeholder: this.effectivePlaceholder, autocomplete: this.isInternational ? 'tel-national' : 'tel', inputmode: "numeric", maxlength: this.maxInputLength, value: this.displayValue, onInput: this.handleNumberInput }), this.nationalNumber && this.isEditable && (h("button", { key: '8db932d94550aa6d947e2564d8a94a12bef43bce', type: "button", class: "xpl-input-phone__clear", "aria-label": "Clear phone number", onClick: this.handleClear }, h("xpl-icon", { key: '87e55c3a5ae6b8774d3ce64af843b7e63448fe25', icon: "x-circle", size: 16 }))))), this.isInternational && this.isEditable && (h("xpl-dropdown", { key: '467b0e2fde23a45b2c36138affa26467e0b6c9d0', ref: (el) => {
207
207
  this.dropdownRef = el;
208
208
  }, isOpen: this.dropdownOpen, triggerId: this.triggerId, anchorToTrigger: true, closeOnSelect: true, mode: "single", options: this.dropdownOptions, update: this.handleDropdownUpdate, onIsOpenChange: (e) => {
209
209
  this.dropdownOpen = e.detail;
210
- }, "aria-label": "Country" }, h("div", { key: '5808ecb917ee94ba31c8ab106152d2d61feae74a', slot: "header", class: "xpl-input-phone__search-wrap" }, h("xpl-input", { key: '76a2477f0e039e390dd26a0c34cdab758d3c10d6', class: "xpl-input-phone__search", type: "text", label: "", placeholder: "Search", value: this.searchQuery, autocomplete: "off", onInputEvent: (e) => {
210
+ }, "aria-label": "Country" }, h("div", { key: 'f4f3665ab8286faed45c3a3a510bd247c7a31842', slot: "header", class: "xpl-input-phone__search-wrap" }, h("xpl-input", { key: '659875e60e85bac085deb8f6648623eccc76d560', class: "xpl-input-phone__search", type: "text", label: "", placeholder: "Search", value: this.searchQuery, autocomplete: "off", onInputEvent: (e) => {
211
211
  var _a;
212
212
  this.searchQuery = (_a = e.detail) !== null && _a !== void 0 ? _a : '';
213
- } }, h("xpl-icon", { key: '0a6b49b3a0df0769fb5dfa59f97c40adeaee8dd1', slot: "pre", class: "xpl-input-phone__search-icon", icon: "magnifier", size: 20 })))))));
213
+ } }, h("xpl-icon", { key: '987941768e8494d9c898fc93e531da03bd57ad71', slot: "pre", class: "xpl-input-phone__search-icon", icon: "magnifier", size: 20 })))))));
214
214
  }
215
215
  static get is() { return "xpl-input-phone"; }
216
216
  static get properties() {
@@ -96,7 +96,7 @@ export class InputSearch {
96
96
  return shell;
97
97
  }
98
98
  render() {
99
- return (h(Host, { key: 'ac235500df2d6958d9070535f922a018bce14906', class: {
99
+ return (h(Host, { key: 'c8f0c2b1c96cc8c6d9a2c390e791977b031adb9b', class: {
100
100
  'xpl-input-search': true,
101
101
  'xpl-input-search--disabled': this.disabled,
102
102
  'xpl-input-search--error': this.hasError,
@@ -105,11 +105,11 @@ export class InputTime {
105
105
  }));
106
106
  }
107
107
  render() {
108
- return (h(Host, { key: '6ed0e8da81a96e0e4e7078a7477c9a4ee92532ba', class: {
108
+ return (h(Host, { key: 'a48ebfd7cd0578b33bd11059f9bebb342bf954f7', class: {
109
109
  'xpl-input-time': true,
110
110
  [`xpl-input-time--mode-${this.mode}`]: true,
111
111
  'xpl-input-time--error': !!this.hasErrorState,
112
- } }, h("xpl-input", { key: 'bae0f7e9b9e3f14b5d780a0300ef672da9301596', pre: h("xpl-icon", { class: "xpl-input-time__clock-icon", icon: "clock", size: 24 }), post: this.timeFormat === '12h' ? this.amPm || 'AM' : null, type: "text", _id: this.inputId, disabled: this.disabled, name: this.name, required: this.required, readonly: this.readonly, placeholder: this.placeholder, max: this.max, min: this.min, onInput: this.handleInput, value: this.formattedValue, onFocusEvent: this.handleFocus, onBlurEvent: this.handleBlur, onClick: this.handleClick }), !this.readonly && !this.disabled && (h("xpl-dropdown", { key: 'cd8ae7e4c7d130bdbf44aeb2f806b3c9a490d8bb', options: this.options, isOpen: this.showOptions, ref: (el) => {
112
+ } }, h("xpl-input", { key: '68089e0bd5b0ed7d88917094eafe529637947380', pre: h("xpl-icon", { class: "xpl-input-time__clock-icon", icon: "clock", size: 24 }), post: this.timeFormat === '12h' ? this.amPm || 'AM' : null, type: "text", _id: this.inputId, disabled: this.disabled, name: this.name, required: this.required, readonly: this.readonly, placeholder: this.placeholder, max: this.max, min: this.min, onInput: this.handleInput, value: this.formattedValue, onFocusEvent: this.handleFocus, onBlurEvent: this.handleBlur, onClick: this.handleClick }), !this.readonly && !this.disabled && (h("xpl-dropdown", { key: '1bbe4a3a42c02ff985a26e7547c54f0bbdc92ce0', options: this.options, isOpen: this.showOptions, ref: (el) => {
113
113
  this.dropdown = el;
114
114
  }, class: "xpl-input-time__dropdown" }))));
115
115
  }
@@ -147,13 +147,13 @@ export class Input {
147
147
  if (type === 'password' && this.passwordVisible) {
148
148
  type = 'text';
149
149
  }
150
- return (h(Host, { key: '21535bfebdb899ef3bf28ae4ac252ffcc8b03388', class: {
150
+ return (h(Host, { key: '4b60d50e8b88f905777d76197afe181026ae5a94', class: {
151
151
  'xpl-input': true,
152
152
  'xpl-input--disabled': this.disabled,
153
153
  'xpl-input--error': hasError,
154
154
  'xpl-input--readonly': this.readonly,
155
155
  [`xpl-input--${this.type}`]: true,
156
- } }, this.label && (h("label", { key: 'f72b35d866295451cf74832dd191853e77190590', class: "xpl-input-label", htmlFor: this._id }, this.label, this.description && h("small", { key: '712910cd0e7a1db84add0f1483fdc0da6c38a07d' }, this.description))), this.renderInput(), ((_a = this.error) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("label", { key: 'd8fcab92ea7f4989e9d2db1117e689ad9a26ced8', class: "xpl-input-error", htmlFor: this._id, id: `${this._id}-error` }, h("xpl-icon", { key: 'cbe4f7792ea586c78b7bc0f34d277bfa5977d50e', icon: "alert-circle", size: 16 }), h("span", { key: '91f88da21c48f0bf069e4c20205a81cfbb30fb1e' }, this.error)))));
156
+ } }, this.label && (h("label", { key: '8b0dc01150607c2943ccc541b9acd3a7fa5d2143', class: "xpl-input-label", htmlFor: this._id }, this.label, this.description && h("small", { key: '8d1f988983fd54e3bc231c0a8091b4fe83ed8ab8' }, this.description))), this.renderInput(), ((_a = this.error) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("label", { key: '349492ed192e6105dd549634da1ce2c0371f5b9d', class: "xpl-input-error", htmlFor: this._id, id: `${this._id}-error` }, h("xpl-icon", { key: '7903d2f35033ceefcf94eff8081997b4aec3c1a9', icon: "alert-circle", size: 16 }), h("span", { key: 'e3d557f705647eb304b4bf38151dcf01c17fce15' }, this.error)))));
157
157
  }
158
158
  static get is() { return "xpl-input"; }
159
159
  static get properties() {
@@ -13,7 +13,7 @@ export class LargeCard {
13
13
  render() {
14
14
  const contentSlot = 'graph-content';
15
15
  const hasContentSlot = this.el.querySelector(`[slot="${contentSlot}"]`);
16
- return (h(Host, { key: '886078965cb1ca87fd9c4f45a8b06f089a4b2e04', role: "group", class: `xpl-large-card ${this.link ? 'xpl-large-card__link' : ''}`, tabindex: "0" }, h("dt", { key: '1c2006c9167b2d46262b222ace3c5e9135863783', class: "xpl-large-card__header" }, h("header", { key: '21ba4629c7e3d0d9dff98f9dde2ac4bc9f1f494e' }, h("slot", { key: 'd50991dc4fcca6c56c04c7cc9a401f0894035aa2', name: "title" }, this.name), this.link && (h("span", { key: '35b1b15786c1674f6d1797ec3b04da81b27d5d3a', class: "xpl-data-card__header-arrow" }, h("xpl-icon", { key: 'f52a7a39b3d044341296d88adb9d2bc07cdec9ab', icon: "chevron-right", size: 16 })))), this.description && (h("div", { key: 'bac9d6cec27272d277c991c81e651714603066a2', class: "xpl-large-card__description" }, this.description))), h("dd", { key: '9da3ca8ec575a6755f1f47065299ec3ab3e5169b', class: "xpl-large-card__body" }, hasContentSlot && h("slot", { key: '022da3c1e07c264441c58f7d42d6edca109a504d', name: contentSlot }))));
16
+ return (h(Host, { key: '9b45179112de8d1ac309520425a1a5c340493487', role: "group", class: `xpl-large-card ${this.link ? 'xpl-large-card__link' : ''}`, tabindex: "0" }, h("dt", { key: '4838c93a72df9ea794b3bbbd7f78f3e84a606109', class: "xpl-large-card__header" }, h("header", { key: 'eb4b2e8515be1e0763595e1cf646dc2b25bfb739' }, h("slot", { key: '62fdafe4b8ce03af5ff353c3ffa377fa547b572b', name: "title" }, this.name), this.link && (h("span", { key: 'ac0086a3402af5f12668a560ad418aaf40a56357', class: "xpl-data-card__header-arrow" }, h("xpl-icon", { key: '74eaffc571098a88d69d7248166889671ba441a2', icon: "chevron-right", size: 16 })))), this.description && (h("div", { key: 'd7d2499b7d8da9c09062ea5a456b588e52df2d82', class: "xpl-large-card__description" }, this.description))), h("dd", { key: '652e32e8b200e783f03608f97cbbcc70f59421e3', class: "xpl-large-card__body" }, hasContentSlot && h("slot", { key: '9d9f285d34bd8e2b6666577bd2023ae474636c4c', name: contentSlot }))));
17
17
  }
18
18
  static get is() { return "xpl-large-card"; }
19
19
  static get properties() {