@ds-autonomie/web-components 1.1.0 → 1.3.0

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 (98) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/chunks/chunk.2WSMYCPC.js +24 -0
  3. package/dist/chunks/{chunk.7EWUWW3E.js → chunk.3Y4CKW7H.js} +1 -1
  4. package/dist/chunks/{chunk.V6V7AGDB.js → chunk.4XH7INOL.js} +1 -1
  5. package/dist/chunks/{chunk.DFTZEFHF.js → chunk.5DKPV25M.js} +1 -1
  6. package/dist/chunks/{chunk.3BL7JA77.js → chunk.5KOTVDN5.js} +2 -7
  7. package/dist/chunks/chunk.5NO4YOTV.js +126 -0
  8. package/dist/chunks/{chunk.GJCVGGCP.js → chunk.76JEX27F.js} +1 -1
  9. package/dist/chunks/{chunk.IQ7SDYSC.js → chunk.7BYKP4SA.js} +14 -0
  10. package/dist/chunks/{chunk.LSKBY2HF.js → chunk.BGNHUCCD.js} +1 -1
  11. package/dist/chunks/{chunk.HEOTAAPU.js → chunk.BHLKMLHB.js} +1 -1
  12. package/dist/chunks/{chunk.NOEQVLAW.js → chunk.BNJQHJKO.js} +1 -1
  13. package/dist/chunks/chunk.CCTWXABH.js +13 -0
  14. package/dist/chunks/{chunk.6BJBVSW4.js → chunk.E7NM6WTF.js} +1 -1
  15. package/dist/chunks/{chunk.DC6CT5PU.js → chunk.EM4JONLW.js} +0 -7
  16. package/dist/chunks/{chunk.W74UQSZJ.js → chunk.FN42VBEO.js} +1 -1
  17. package/dist/chunks/{chunk.VIULAG23.js → chunk.FSXPFNBX.js} +1 -1
  18. package/dist/chunks/{chunk.T7JSALXE.js → chunk.HCQNPYQZ.js} +1 -1
  19. package/dist/chunks/chunk.HRBNFVC5.js +16 -0
  20. package/dist/chunks/{chunk.ZVGZDTBF.js → chunk.IFXLU6P3.js} +8 -16
  21. package/dist/chunks/{chunk.AYXPVAYS.js → chunk.IH3JU5S6.js} +1 -1
  22. package/dist/chunks/{chunk.R37CT3PN.js → chunk.JJLAOWR2.js} +88 -13
  23. package/dist/chunks/{chunk.U5KRBVRP.js → chunk.JKHFW3KV.js} +2 -2
  24. package/dist/chunks/{chunk.DZWH4V6H.js → chunk.KAQ2HMPU.js} +1 -1
  25. package/dist/chunks/{chunk.2CCKS3CP.js → chunk.N5ZXUW7H.js} +1 -1
  26. package/dist/chunks/{chunk.CBMFAOZI.js → chunk.P7QMP76I.js} +4 -3
  27. package/dist/chunks/{chunk.VM355VAS.js → chunk.QDZXNGR6.js} +1 -5
  28. package/dist/chunks/chunk.QSNJ4FV6.js +54 -0
  29. package/dist/chunks/{chunk.L6LQN6AI.js → chunk.RVUFDCSS.js} +1 -1
  30. package/dist/chunks/{chunk.QSPKKO3T.js → chunk.SCNCYZ35.js} +3 -3
  31. package/dist/chunks/{chunk.NKPNQBLW.js → chunk.T4H7RAXS.js} +4 -4
  32. package/dist/chunks/{chunk.ST2QYN4S.js → chunk.WC7TOR3H.js} +1 -1
  33. package/dist/chunks/{chunk.7HGZSZJK.js → chunk.WFJLQFI3.js} +18 -0
  34. package/dist/chunks/{chunk.NBQ3AEK6.js → chunk.XV2S7PIY.js} +1 -1
  35. package/dist/chunks/{chunk.ILUHEJYG.js → chunk.XYHFMIYJ.js} +1 -1
  36. package/dist/chunks/{chunk.RSJYKNXT.js → chunk.Y3VP37FX.js} +1 -1
  37. package/dist/chunks/{chunk.4MC32HP7.js → chunk.YEVEBKAC.js} +1 -1
  38. package/dist/chunks/{chunk.F4XMSVNF.js → chunk.YHOA7MQN.js} +1 -1
  39. package/dist/chunks/chunk.YRBTSDUN.js +134 -0
  40. package/dist/components/accordion/accordion.js +2 -2
  41. package/dist/components/alert/alert.js +2 -2
  42. package/dist/components/badge/badge.d.ts +0 -2
  43. package/dist/components/badge/badge.js +2 -2
  44. package/dist/components/badge/badge.styles.js +1 -1
  45. package/dist/components/breadcrumb/breadcrumb.js +2 -2
  46. package/dist/components/breadcrumb-item/breadcrumb-item.js +2 -2
  47. package/dist/components/button/button.js +3 -3
  48. package/dist/components/combobox/combobox.d.ts +22 -1
  49. package/dist/components/combobox/combobox.js +7 -4
  50. package/dist/components/combobox/combobox.styles.js +1 -1
  51. package/dist/components/dialog/dialog.js +2 -2
  52. package/dist/components/drawer/drawer.js +2 -2
  53. package/dist/components/dropdown/dropdown.js +2 -2
  54. package/dist/components/format-bytes/format-bytes.js +2 -2
  55. package/dist/components/format-date/format-date.js +2 -2
  56. package/dist/components/format-number/format-number.js +2 -2
  57. package/dist/components/input/input.js +2 -2
  58. package/dist/components/input-mask/input-mask.js +2 -2
  59. package/dist/components/input-phone/input-phone.js +7 -7
  60. package/dist/components/option/option.js +2 -2
  61. package/dist/components/progress-bar/progress-bar.js +2 -2
  62. package/dist/components/radio-button/radio-button.js +2 -2
  63. package/dist/components/radio-button/radio-button.styles.js +1 -1
  64. package/dist/components/relative-time/relative-time.js +2 -2
  65. package/dist/components/select/select.js +3 -3
  66. package/dist/components/spinner/spinner.js +2 -2
  67. package/dist/components/step/step.d.ts +39 -0
  68. package/dist/components/step/step.js +24 -0
  69. package/dist/components/step/step.styles.d.ts +2 -0
  70. package/dist/components/step/step.styles.js +8 -0
  71. package/dist/components/step/step.utils.d.ts +3 -0
  72. package/dist/components/step/step.utils.js +7 -0
  73. package/dist/components/stepper/stepper.d.ts +23 -0
  74. package/dist/components/stepper/stepper.js +10 -0
  75. package/dist/components/stepper/stepper.styles.d.ts +2 -0
  76. package/dist/components/stepper/stepper.styles.js +8 -0
  77. package/dist/components/tab/tab.js +2 -2
  78. package/dist/components/tab-group/tab-group.js +2 -2
  79. package/dist/components/tag/tag.js +2 -2
  80. package/dist/components/tooltip/tooltip.js +2 -2
  81. package/dist/components/tree/tree.js +4 -4
  82. package/dist/components/tree-item/tree-item.js +3 -3
  83. package/dist/custom-elements.json +342 -24
  84. package/dist/design-system.d.ts +2 -0
  85. package/dist/design-system.js +56 -44
  86. package/dist/themes/dsa-wc-theme.css +43 -0
  87. package/dist/themes/dsa-wc-theme.min.css +1 -1
  88. package/dist/themes/dsa-wc-theme.styles.js +43 -0
  89. package/dist/translations/en-gb.js +1 -1
  90. package/dist/translations/en.js +1 -1
  91. package/dist/translations/fr.js +1 -1
  92. package/dist/utilities/debounce.d.ts +1 -0
  93. package/dist/utilities/debounce.js +7 -0
  94. package/dist/utilities/localize.d.ts +7 -0
  95. package/dist/utilities/localize.js +1 -1
  96. package/dist/vscode.html-custom-data.json +45 -6
  97. package/dist/web-types.json +167 -15
  98. package/package.json +5 -6
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk.ZQJVCRB2.js";
7
7
  import {
8
8
  LocalizeController
9
- } from "./chunk.IQ7SDYSC.js";
9
+ } from "./chunk.7BYKP4SA.js";
10
10
  import {
11
11
  ShoelaceElement
12
12
  } from "./chunk.YCXTCVAZ.js";
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk.S4ATPBQN.js";
4
4
  import {
5
5
  LocalizeController
6
- } from "./chunk.IQ7SDYSC.js";
6
+ } from "./chunk.7BYKP4SA.js";
7
7
  import {
8
8
  ShoelaceElement
9
9
  } from "./chunk.YCXTCVAZ.js";
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk.YIY5RM53.js";
7
7
  import {
8
8
  LocalizeController
9
- } from "./chunk.IQ7SDYSC.js";
9
+ } from "./chunk.7BYKP4SA.js";
10
10
  import {
11
11
  ShoelaceElement
12
12
  } from "./chunk.YCXTCVAZ.js";
@@ -33,7 +33,8 @@ var DSABreadcrumbItem = class extends ShoelaceElement {
33
33
  render() {
34
34
  const isLink = this.href ? true : false;
35
35
  return html`
36
- <li
36
+ <div
37
+ role="listitem"
37
38
  part="base"
38
39
  class=${classMap({
39
40
  "breadcrumb-item": true,
@@ -79,7 +80,7 @@ var DSABreadcrumbItem = class extends ShoelaceElement {
79
80
  aria-hidden="true"
80
81
  name=${this.localize.dir() === "rtl" ? "keyboard_arrow_left" : "keyboard_arrow_right"}
81
82
  ></dsa-icon>
82
- </li>
83
+ </div>
83
84
  `;
84
85
  }
85
86
  };
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  radio_button_styles_default
3
- } from "./chunk.DC6CT5PU.js";
3
+ } from "./chunk.EM4JONLW.js";
4
4
  import {
5
5
  HasSlotController
6
6
  } from "./chunk.YIY5RM53.js";
@@ -96,10 +96,6 @@ var DSARadioButton = class extends ShoelaceElement {
96
96
  class="button__icon-readonly"
97
97
  ></dsa-icon>` : ""}
98
98
  <slot part="label" class="button__label"></slot>
99
- ${this.checked ? html`<dsa-icon
100
- name="check"
101
- class="button__icon-check"
102
- ></dsa-icon>` : ""}
103
99
  </button>
104
100
  </div>
105
101
  `;
@@ -0,0 +1,54 @@
1
+ import {
2
+ stepper_styles_default
3
+ } from "./chunk.2WSMYCPC.js";
4
+ import {
5
+ ShoelaceElement
6
+ } from "./chunk.YCXTCVAZ.js";
7
+ import {
8
+ __decorateClass
9
+ } from "./chunk.6M63UXML.js";
10
+
11
+ // src/components/stepper/stepper.ts
12
+ import { html } from "lit";
13
+ import { customElement, property } from "lit/decorators.js";
14
+ var STEP_TAG = "dsa-step";
15
+ var DSAStepper = class extends ShoelaceElement {
16
+ connectedCallback() {
17
+ super.connectedCallback();
18
+ }
19
+ // Gets an array of all <dsa-step> elements
20
+ getAllSteps() {
21
+ return [...this.querySelectorAll(STEP_TAG)];
22
+ }
23
+ handleDefaultSlotChange() {
24
+ const allSteps = this.getAllSteps();
25
+ if (customElements.get(STEP_TAG)) {
26
+ if (this.hideLabel) {
27
+ return;
28
+ }
29
+ allSteps.forEach((step, index) => {
30
+ step.index = index;
31
+ });
32
+ } else {
33
+ customElements.whenDefined(STEP_TAG).then(() => this.handleDefaultSlotChange());
34
+ }
35
+ }
36
+ render() {
37
+ return html`
38
+ <div role="list" class="stepper">
39
+ <slot @slotchange=${this.handleDefaultSlotChange}> </slot>
40
+ </div>
41
+ `;
42
+ }
43
+ };
44
+ DSAStepper.styles = stepper_styles_default;
45
+ __decorateClass([
46
+ property()
47
+ ], DSAStepper.prototype, "hideLabel", 2);
48
+ DSAStepper = __decorateClass([
49
+ customElement("dsa-stepper")
50
+ ], DSAStepper);
51
+
52
+ export {
53
+ DSAStepper
54
+ };
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk.EMIT7S33.js";
7
7
  import {
8
8
  LocalizeController
9
- } from "./chunk.IQ7SDYSC.js";
9
+ } from "./chunk.7BYKP4SA.js";
10
10
  import {
11
11
  watch
12
12
  } from "./chunk.6IH66JBY.js";
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk.IGYXUK7A.js";
4
4
  import {
5
5
  LocalizeController
6
- } from "./chunk.IQ7SDYSC.js";
6
+ } from "./chunk.7BYKP4SA.js";
7
7
  import {
8
8
  ShoelaceElement
9
9
  } from "./chunk.YCXTCVAZ.js";
@@ -41,9 +41,9 @@ var DSABreadcrumb = class extends ShoelaceElement {
41
41
  aria-label=${this.localize.term("youAreHere")}
42
42
  role="navigation"
43
43
  >
44
- <ol>
44
+ <div role="list">
45
45
  <slot @slotchange=${this.handleSlotChange}></slot>
46
- </ol>
46
+ </div>
47
47
  </nav>
48
48
  `;
49
49
  }
@@ -1,12 +1,12 @@
1
- import {
2
- DSATreeItem
3
- } from "./chunk.NBQ3AEK6.js";
4
1
  import {
5
2
  tree_styles_default
6
3
  } from "./chunk.73T7TU6S.js";
4
+ import {
5
+ DSATreeItem
6
+ } from "./chunk.XV2S7PIY.js";
7
7
  import {
8
8
  LocalizeController
9
- } from "./chunk.IQ7SDYSC.js";
9
+ } from "./chunk.7BYKP4SA.js";
10
10
  import {
11
11
  watch
12
12
  } from "./chunk.6IH66JBY.js";
@@ -27,7 +27,7 @@ import {
27
27
  } from "./chunk.V7RJROLH.js";
28
28
  import {
29
29
  LocalizeController
30
- } from "./chunk.IQ7SDYSC.js";
30
+ } from "./chunk.7BYKP4SA.js";
31
31
  import {
32
32
  watch
33
33
  } from "./chunk.6IH66JBY.js";
@@ -402,6 +402,24 @@ var combobox_styles_default = css`
402
402
  color: var(--dsa-wc-combobox-empty-label-color);
403
403
  padding-inline: var(--dsa-wc-combobox-listbox-padding-inline);
404
404
  }
405
+
406
+ .select__loading_text {
407
+ display: flex;
408
+ align-items: center;
409
+ font: var(--dsa-wc-combobox-empty-label-font);
410
+ color: var(--dsa-wc-combobox-empty-label-color);
411
+ padding-inline: var(--dsa-wc-combobox-listbox-padding-inline);
412
+ }
413
+
414
+ .select__error_text {
415
+ font: var(--dsa-wc-combobox-empty-label-font);
416
+ color: var(--dsa-wc-combobox-empty-label-color);
417
+ padding-inline: var(--dsa-wc-combobox-listbox-padding-inline);
418
+ }
419
+
420
+ .select__loading_text > p {
421
+ padding-left: var(--dsa-spacing-8);
422
+ }
405
423
  `;
406
424
 
407
425
  export {
@@ -12,7 +12,7 @@ import {
12
12
  } from "./chunk.V7RJROLH.js";
13
13
  import {
14
14
  LocalizeController
15
- } from "./chunk.IQ7SDYSC.js";
15
+ } from "./chunk.7BYKP4SA.js";
16
16
  import {
17
17
  watch
18
18
  } from "./chunk.6IH66JBY.js";
@@ -11,7 +11,7 @@ import {
11
11
  } from "./chunk.V7RJROLH.js";
12
12
  import {
13
13
  LocalizeController
14
- } from "./chunk.IQ7SDYSC.js";
14
+ } from "./chunk.7BYKP4SA.js";
15
15
  import {
16
16
  alert_styles_default
17
17
  } from "./chunk.Z6TBD2AC.js";
@@ -27,7 +27,7 @@ import {
27
27
  } from "./chunk.V7RJROLH.js";
28
28
  import {
29
29
  LocalizeController
30
- } from "./chunk.IQ7SDYSC.js";
30
+ } from "./chunk.7BYKP4SA.js";
31
31
  import {
32
32
  watch
33
33
  } from "./chunk.6IH66JBY.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  DSASelect
3
- } from "./chunk.GJCVGGCP.js";
3
+ } from "./chunk.76JEX27F.js";
4
4
  import {
5
5
  frenchFlag,
6
6
  frenchNumberPrefix,
@@ -19,7 +19,7 @@ import {
19
19
  } from "./chunk.ZQJVCRB2.js";
20
20
  import {
21
21
  LocalizeController
22
- } from "./chunk.IQ7SDYSC.js";
22
+ } from "./chunk.7BYKP4SA.js";
23
23
  import {
24
24
  watch
25
25
  } from "./chunk.6IH66JBY.js";
@@ -0,0 +1,134 @@
1
+ import {
2
+ component_styles_default
3
+ } from "./chunk.TUVJKY7S.js";
4
+
5
+ // src/components/step/step.styles.ts
6
+ import { css } from "lit";
7
+ var step_styles_default = css`
8
+ ${component_styles_default}
9
+
10
+ :host(:first-of-type) .step:before {
11
+ content: unset;
12
+ }
13
+
14
+ .step-container {
15
+ display: grid;
16
+ position: relative;
17
+ align-content: start;
18
+ grid-template:
19
+ 'icon .'
20
+ 'index .'
21
+ 'title title'
22
+ 'content content' 1fr
23
+ / auto minmax(0, 1fr);
24
+ padding-right: var(--dsa-spacing-24);
25
+ }
26
+
27
+ .step-container .step-title-container {
28
+ grid-area: title;
29
+ display: none;
30
+ }
31
+
32
+ .step-container--has-title .step-title-container {
33
+ display: inline-flex;
34
+ }
35
+
36
+ .step-title {
37
+ color: var(--dsa-wc-stepper-color-title);
38
+ font: var(--dsa-wc-stepper-font-title);
39
+ }
40
+
41
+ .step-tooltip {
42
+ display: inline-block;
43
+ margin-left: auto;
44
+ position: relative;
45
+ top: 2px;
46
+ }
47
+
48
+ .step:before {
49
+ content: '';
50
+ position: absolute;
51
+ width: 100%;
52
+ height: 1.4px;
53
+ background-color: var(--dsa-wc-stepper-color-progress-default);
54
+ right: calc(100% + var(--dsa-spacing-4));
55
+ width: calc(100% - calc(var(--dsa-spacing-4) + var(--dsa-spacing-32)));
56
+ z-index: -1;
57
+ }
58
+
59
+ .step--complete:before {
60
+ background-color: var(--dsa-wc-stepper-color-progress-complete);
61
+ }
62
+
63
+ .step {
64
+ grid-area: icon;
65
+ height: var(--dsa-wc-stepper-icon-size);
66
+ width: var(--dsa-wc-stepper-icon-size);
67
+ display: flex;
68
+ justify-content: center;
69
+ align-items: center;
70
+ border-radius: var(--dsa-radius-32);
71
+ border-width: var(--dsa-wc-stepper-icon-border-width);
72
+ border-style: var(--dsa-wc-stepper-icon-border-style);
73
+ margin-bottom: var(--dsa-spacing-16);
74
+ }
75
+
76
+ .step--default {
77
+ border-color: var(--dsa-wc-stepper-color-tag-blocked-base);
78
+ }
79
+
80
+ .step--complete {
81
+ border-color: var(--dsa-wc-stepper-color-tag-complete-base);
82
+ background-color: var(--dsa-wc-stepper-color-tag-complete-base);
83
+ }
84
+
85
+ .step--complete .step-icon {
86
+ color: var(--dsa-wc-stepper-color-tag-complete-on-base);
87
+ }
88
+
89
+ .step--error {
90
+ border-color: var(--dsa-wc-stepper-color-tag-error-base);
91
+ background-color: var(--dsa-wc-stepper-color-tag-error-base);
92
+ }
93
+
94
+ .step--error .step-icon {
95
+ color: var(--dsa-wc-stepper-color-tag-error-on-base);
96
+ }
97
+
98
+ .step--in-progress {
99
+ border-color: var(--dsa-wc-stepper-color-tag-in-progress-base);
100
+ }
101
+
102
+ .step-icon--in-progress {
103
+ height: var(--dsa-wc-stepper-icon-in-progress-size);
104
+ width: var(--dsa-wc-stepper-icon-in-progress-size);
105
+ background-color: var(--dsa-wc-stepper-color-tag-in-progress-base);
106
+ border-radius: var(--dsa-radius-8);
107
+ }
108
+
109
+ .step-container .step-content {
110
+ grid-area: content;
111
+ display: none;
112
+ }
113
+
114
+ .step-container--has-content .step-content {
115
+ display: inline-block;
116
+ margin: 0;
117
+ margin-top: var(--dsa-spacing-8);
118
+ color: var(--dsa-wc-stepper-color-content);
119
+ font: var(--dsa-wc-stepper-font-content);
120
+ }
121
+
122
+ .step-index {
123
+ grid-area: index;
124
+ margin: 0;
125
+ margin-bottom: var(--dsa-spacing-4);
126
+ text-transform: uppercase;
127
+ color: var(--dsa-wc-stepper-color-index);
128
+ font: var(--dsa-wc-stepper-font-index);
129
+ }
130
+ `;
131
+
132
+ export {
133
+ step_styles_default
134
+ };
@@ -1,11 +1,11 @@
1
1
  import {
2
2
  DSAAccordion
3
- } from "../../chunks/chunk.HEOTAAPU.js";
3
+ } from "../../chunks/chunk.BHLKMLHB.js";
4
4
  import "../../chunks/chunk.LC54322H.js";
5
5
  import "../../chunks/chunk.B4BZKR24.js";
6
6
  import "../../chunks/chunk.2FK6USFR.js";
7
7
  import "../../chunks/chunk.V7RJROLH.js";
8
- import "../../chunks/chunk.IQ7SDYSC.js";
8
+ import "../../chunks/chunk.7BYKP4SA.js";
9
9
  import "../../chunks/chunk.VRU3XH45.js";
10
10
  import "../../chunks/chunk.7J7CS3BK.js";
11
11
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -1,13 +1,13 @@
1
1
  import {
2
2
  DSAAlert
3
- } from "../../chunks/chunk.ILUHEJYG.js";
3
+ } from "../../chunks/chunk.XYHFMIYJ.js";
4
4
  import "../../chunks/chunk.EXIGM5NV.js";
5
5
  import "../../chunks/chunk.QFJA3MTV.js";
6
6
  import "../../chunks/chunk.ZQJVCRB2.js";
7
7
  import "../../chunks/chunk.B4BZKR24.js";
8
8
  import "../../chunks/chunk.2FK6USFR.js";
9
9
  import "../../chunks/chunk.V7RJROLH.js";
10
- import "../../chunks/chunk.IQ7SDYSC.js";
10
+ import "../../chunks/chunk.7BYKP4SA.js";
11
11
  import "../../chunks/chunk.VRU3XH45.js";
12
12
  import "../../chunks/chunk.7J7CS3BK.js";
13
13
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -10,8 +10,6 @@ export default class DSABadge extends ShoelaceElement {
10
10
  static styles: CSSResultGroup;
11
11
  /** The badge's theme variant. */
12
12
  variant: 'primary' | 'success' | 'neutral' | 'warning' | 'danger';
13
- /**Draws a dot-style badge with centered text. Useful for displaying notifications. */
14
- dot: boolean;
15
13
  /** Makes the badge pulsate to draw attention. */
16
14
  pulse: boolean;
17
15
  render(): import("lit").TemplateResult<1>;
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  DSABadge
3
- } from "../../chunks/chunk.3BL7JA77.js";
4
- import "../../chunks/chunk.ZVGZDTBF.js";
3
+ } from "../../chunks/chunk.5KOTVDN5.js";
4
+ import "../../chunks/chunk.IFXLU6P3.js";
5
5
  import "../../chunks/chunk.YCXTCVAZ.js";
6
6
  import "../../chunks/chunk.TUVJKY7S.js";
7
7
  import "../../chunks/chunk.6M63UXML.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  badge_styles_default
3
- } from "../../chunks/chunk.ZVGZDTBF.js";
3
+ } from "../../chunks/chunk.IFXLU6P3.js";
4
4
  import "../../chunks/chunk.TUVJKY7S.js";
5
5
  import "../../chunks/chunk.6M63UXML.js";
6
6
  export {
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  DSABreadcrumb
3
- } from "../../chunks/chunk.QSPKKO3T.js";
3
+ } from "../../chunks/chunk.SCNCYZ35.js";
4
4
  import "../../chunks/chunk.IGYXUK7A.js";
5
- import "../../chunks/chunk.IQ7SDYSC.js";
5
+ import "../../chunks/chunk.7BYKP4SA.js";
6
6
  import "../../chunks/chunk.VRU3XH45.js";
7
7
  import "../../chunks/chunk.7J7CS3BK.js";
8
8
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  DSABreadcrumbItem
3
- } from "../../chunks/chunk.CBMFAOZI.js";
3
+ } from "../../chunks/chunk.P7QMP76I.js";
4
4
  import "../../chunks/chunk.PULHNCDM.js";
5
5
  import "../../chunks/chunk.YIY5RM53.js";
6
- import "../../chunks/chunk.IQ7SDYSC.js";
6
+ import "../../chunks/chunk.7BYKP4SA.js";
7
7
  import "../../chunks/chunk.YCXTCVAZ.js";
8
8
  import "../../chunks/chunk.TUVJKY7S.js";
9
9
  import "../../chunks/chunk.6M63UXML.js";
@@ -1,13 +1,13 @@
1
1
  import {
2
2
  DSAButton
3
- } from "../../chunks/chunk.W74UQSZJ.js";
4
- import "../../chunks/chunk.2CCKS3CP.js";
3
+ } from "../../chunks/chunk.FN42VBEO.js";
4
+ import "../../chunks/chunk.N5ZXUW7H.js";
5
5
  import "../../chunks/chunk.S4ATPBQN.js";
6
6
  import "../../chunks/chunk.KIFBWPW5.js";
7
7
  import "../../chunks/chunk.J2XNYTTZ.js";
8
8
  import "../../chunks/chunk.YIY5RM53.js";
9
9
  import "../../chunks/chunk.ZQJVCRB2.js";
10
- import "../../chunks/chunk.IQ7SDYSC.js";
10
+ import "../../chunks/chunk.7BYKP4SA.js";
11
11
  import "../../chunks/chunk.VRU3XH45.js";
12
12
  import "../../chunks/chunk.7J7CS3BK.js";
13
13
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -6,6 +6,7 @@ import '../icon/icon';
6
6
  import type DSAOption from '../option/option';
7
7
  import '../popup/popup';
8
8
  import type DSAPopup from '../popup/popup';
9
+ import '../spinner/spinner';
9
10
  import '../tag/tag';
10
11
  /**
11
12
  * @summary Comboboxes allow you to type a value directly or select a value from a menu of predefined options. Values are filtered by checking the presence of the search term.
@@ -16,6 +17,7 @@ import '../tag/tag';
16
17
  * @dependency dsa-popup
17
18
  * @dependency dsa-tag
18
19
  * @dependency dsa-error-text
20
+ * @dependency dsa-spinner
19
21
  *
20
22
  * @slot - The listbox options. Must be `<dsa-option>` elements. Alternatively, you can use the `items` property.
21
23
  * @slot label - The input's label. Alternatively, you can use the `label` attribute.
@@ -32,6 +34,8 @@ import '../tag/tag';
32
34
  * @event dsa-hide - Emitted when the combobox's menu closes.
33
35
  * @event dsa-after-hide - Emitted after the combobox's menu closes and all animations are complete.
34
36
  * @event dsa-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
37
+ * @event dsa-load - Emitted when the remote options have loaded.
38
+ * @event dsa-error - Emitted when the remote options fail to load due to an error.
35
39
  */
36
40
  export default class DSACombobox extends ShoelaceElement implements ShoelaceFormControl {
37
41
  static styles: CSSResultGroup;
@@ -44,6 +48,7 @@ export default class DSACombobox extends ShoelaceElement implements ShoelaceForm
44
48
  valueInput: HTMLInputElement;
45
49
  listbox: HTMLSlotElement;
46
50
  private hasVisualFocus;
51
+ private fetchingState;
47
52
  displayLabel: string;
48
53
  currentOption: DSAOption | undefined;
49
54
  selectedOptions: DSAOption[];
@@ -111,11 +116,24 @@ export default class DSACombobox extends ShoelaceElement implements ShoelaceForm
111
116
  * indicate the number of additional items that are selected. Set to 0 to remove the limit.
112
117
  */
113
118
  maxOptionsVisible: number;
119
+ /**
120
+ * This function searches for a list of remote options based on the inputed text.
121
+ * @param value The text used for searching options.
122
+ * @param selectedOptions Option list already selected.
123
+ * @default undefined
124
+ * @returns A list of options or a Promise resolving to an array of options, matching the search criteria.
125
+ */
126
+ onSearch: ((value: string, selectedOptions: string[]) => DSAOption[] | Promise<DSAOption[]>) | undefined;
127
+ /**
128
+ * Delay between when a user types into an input. It is only used when `onSearch` attribute is defined.
129
+ * @default 300
130
+ */
131
+ debounceTimeout: number;
114
132
  /** Gets the validity state object */
115
133
  get validity(): ValidityState;
116
134
  /** Gets the validation message */
117
135
  get validationMessage(): string;
118
- connectedCallback(): void;
136
+ connectedCallback(): Promise<void>;
119
137
  /** Input events */
120
138
  private handleBlur;
121
139
  private handleFocus;
@@ -123,6 +141,8 @@ export default class DSACombobox extends ShoelaceElement implements ShoelaceForm
123
141
  private handleComboboxKeyDown;
124
142
  private handleChange;
125
143
  private handleInput;
144
+ private filterRemoteOptions;
145
+ private asyncFetchOptions;
126
146
  private handleClearClick;
127
147
  private filterOptions;
128
148
  private toggleOptionSelection;
@@ -130,6 +150,7 @@ export default class DSACombobox extends ShoelaceElement implements ShoelaceForm
130
150
  private handleDefaultSlotChange;
131
151
  private handleTagRemove;
132
152
  private getAllOptions;
153
+ private getRemoteOptions;
133
154
  private clearSelectedOptions;
134
155
  private setCurrentOption;
135
156
  private setSelectedOptions;
@@ -1,7 +1,8 @@
1
1
  import {
2
2
  DSACombobox
3
- } from "../../chunks/chunk.R37CT3PN.js";
4
- import "../../chunks/chunk.U5KRBVRP.js";
3
+ } from "../../chunks/chunk.JJLAOWR2.js";
4
+ import "../../chunks/chunk.HRBNFVC5.js";
5
+ import "../../chunks/chunk.JKHFW3KV.js";
5
6
  import "../../chunks/chunk.WFHOSUOX.js";
6
7
  import "../../chunks/chunk.ENKP2IFW.js";
7
8
  import "../../chunks/chunk.6PS5KB3O.js";
@@ -9,7 +10,9 @@ import "../../chunks/chunk.EMIT7S33.js";
9
10
  import "../../chunks/chunk.CMJ2SRTL.js";
10
11
  import "../../chunks/chunk.CPXD6UYZ.js";
11
12
  import "../../chunks/chunk.EYZGEU3G.js";
12
- import "../../chunks/chunk.7HGZSZJK.js";
13
+ import "../../chunks/chunk.WFJLQFI3.js";
14
+ import "../../chunks/chunk.N5ZXUW7H.js";
15
+ import "../../chunks/chunk.S4ATPBQN.js";
13
16
  import "../../chunks/chunk.KIFBWPW5.js";
14
17
  import "../../chunks/chunk.YIY5RM53.js";
15
18
  import "../../chunks/chunk.3RBCYA4F.js";
@@ -19,7 +22,7 @@ import "../../chunks/chunk.ZQJVCRB2.js";
19
22
  import "../../chunks/chunk.B4BZKR24.js";
20
23
  import "../../chunks/chunk.2FK6USFR.js";
21
24
  import "../../chunks/chunk.V7RJROLH.js";
22
- import "../../chunks/chunk.IQ7SDYSC.js";
25
+ import "../../chunks/chunk.7BYKP4SA.js";
23
26
  import "../../chunks/chunk.VRU3XH45.js";
24
27
  import "../../chunks/chunk.7J7CS3BK.js";
25
28
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  combobox_styles_default
3
- } from "../../chunks/chunk.7HGZSZJK.js";
3
+ } from "../../chunks/chunk.WFJLQFI3.js";
4
4
  import "../../chunks/chunk.3RBCYA4F.js";
5
5
  import "../../chunks/chunk.TUVJKY7S.js";
6
6
  import "../../chunks/chunk.6M63UXML.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  DSADialog
3
- } from "../../chunks/chunk.RSJYKNXT.js";
3
+ } from "../../chunks/chunk.Y3VP37FX.js";
4
4
  import "../../chunks/chunk.ISAFRNR2.js";
5
5
  import "../../chunks/chunk.EMIT7S33.js";
6
6
  import "../../chunks/chunk.PQWQ42E2.js";
@@ -11,7 +11,7 @@ import "../../chunks/chunk.ZQJVCRB2.js";
11
11
  import "../../chunks/chunk.B4BZKR24.js";
12
12
  import "../../chunks/chunk.2FK6USFR.js";
13
13
  import "../../chunks/chunk.V7RJROLH.js";
14
- import "../../chunks/chunk.IQ7SDYSC.js";
14
+ import "../../chunks/chunk.7BYKP4SA.js";
15
15
  import "../../chunks/chunk.VRU3XH45.js";
16
16
  import "../../chunks/chunk.7J7CS3BK.js";
17
17
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  DSADrawer
3
- } from "../../chunks/chunk.ST2QYN4S.js";
3
+ } from "../../chunks/chunk.WC7TOR3H.js";
4
4
  import "../../chunks/chunk.ISAFRNR2.js";
5
5
  import "../../chunks/chunk.DXVNWE2M.js";
6
6
  import "../../chunks/chunk.EMIT7S33.js";
@@ -11,7 +11,7 @@ import "../../chunks/chunk.ZQJVCRB2.js";
11
11
  import "../../chunks/chunk.B4BZKR24.js";
12
12
  import "../../chunks/chunk.2FK6USFR.js";
13
13
  import "../../chunks/chunk.V7RJROLH.js";
14
- import "../../chunks/chunk.IQ7SDYSC.js";
14
+ import "../../chunks/chunk.7BYKP4SA.js";
15
15
  import "../../chunks/chunk.VRU3XH45.js";
16
16
  import "../../chunks/chunk.7J7CS3BK.js";
17
17
  import "../../chunks/chunk.23TOS4ZE.js";
@@ -1,11 +1,11 @@
1
1
  import {
2
2
  DSADropdown
3
- } from "../../chunks/chunk.T7JSALXE.js";
3
+ } from "../../chunks/chunk.HCQNPYQZ.js";
4
4
  import "../../chunks/chunk.UEUTSYIH.js";
5
5
  import "../../chunks/chunk.B4BZKR24.js";
6
6
  import "../../chunks/chunk.2FK6USFR.js";
7
7
  import "../../chunks/chunk.V7RJROLH.js";
8
- import "../../chunks/chunk.IQ7SDYSC.js";
8
+ import "../../chunks/chunk.7BYKP4SA.js";
9
9
  import "../../chunks/chunk.6IH66JBY.js";
10
10
  import "../../chunks/chunk.YCXTCVAZ.js";
11
11
  import "../../chunks/chunk.TUVJKY7S.js";