@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.
- package/CHANGELOG.md +25 -0
- package/dist/chunks/chunk.2WSMYCPC.js +24 -0
- package/dist/chunks/{chunk.7EWUWW3E.js → chunk.3Y4CKW7H.js} +1 -1
- package/dist/chunks/{chunk.V6V7AGDB.js → chunk.4XH7INOL.js} +1 -1
- package/dist/chunks/{chunk.DFTZEFHF.js → chunk.5DKPV25M.js} +1 -1
- package/dist/chunks/{chunk.3BL7JA77.js → chunk.5KOTVDN5.js} +2 -7
- package/dist/chunks/chunk.5NO4YOTV.js +126 -0
- package/dist/chunks/{chunk.GJCVGGCP.js → chunk.76JEX27F.js} +1 -1
- package/dist/chunks/{chunk.IQ7SDYSC.js → chunk.7BYKP4SA.js} +14 -0
- package/dist/chunks/{chunk.LSKBY2HF.js → chunk.BGNHUCCD.js} +1 -1
- package/dist/chunks/{chunk.HEOTAAPU.js → chunk.BHLKMLHB.js} +1 -1
- package/dist/chunks/{chunk.NOEQVLAW.js → chunk.BNJQHJKO.js} +1 -1
- package/dist/chunks/chunk.CCTWXABH.js +13 -0
- package/dist/chunks/{chunk.6BJBVSW4.js → chunk.E7NM6WTF.js} +1 -1
- package/dist/chunks/{chunk.DC6CT5PU.js → chunk.EM4JONLW.js} +0 -7
- package/dist/chunks/{chunk.W74UQSZJ.js → chunk.FN42VBEO.js} +1 -1
- package/dist/chunks/{chunk.VIULAG23.js → chunk.FSXPFNBX.js} +1 -1
- package/dist/chunks/{chunk.T7JSALXE.js → chunk.HCQNPYQZ.js} +1 -1
- package/dist/chunks/chunk.HRBNFVC5.js +16 -0
- package/dist/chunks/{chunk.ZVGZDTBF.js → chunk.IFXLU6P3.js} +8 -16
- package/dist/chunks/{chunk.AYXPVAYS.js → chunk.IH3JU5S6.js} +1 -1
- package/dist/chunks/{chunk.R37CT3PN.js → chunk.JJLAOWR2.js} +88 -13
- package/dist/chunks/{chunk.U5KRBVRP.js → chunk.JKHFW3KV.js} +2 -2
- package/dist/chunks/{chunk.DZWH4V6H.js → chunk.KAQ2HMPU.js} +1 -1
- package/dist/chunks/{chunk.2CCKS3CP.js → chunk.N5ZXUW7H.js} +1 -1
- package/dist/chunks/{chunk.CBMFAOZI.js → chunk.P7QMP76I.js} +4 -3
- package/dist/chunks/{chunk.VM355VAS.js → chunk.QDZXNGR6.js} +1 -5
- package/dist/chunks/chunk.QSNJ4FV6.js +54 -0
- package/dist/chunks/{chunk.L6LQN6AI.js → chunk.RVUFDCSS.js} +1 -1
- package/dist/chunks/{chunk.QSPKKO3T.js → chunk.SCNCYZ35.js} +3 -3
- package/dist/chunks/{chunk.NKPNQBLW.js → chunk.T4H7RAXS.js} +4 -4
- package/dist/chunks/{chunk.ST2QYN4S.js → chunk.WC7TOR3H.js} +1 -1
- package/dist/chunks/{chunk.7HGZSZJK.js → chunk.WFJLQFI3.js} +18 -0
- package/dist/chunks/{chunk.NBQ3AEK6.js → chunk.XV2S7PIY.js} +1 -1
- package/dist/chunks/{chunk.ILUHEJYG.js → chunk.XYHFMIYJ.js} +1 -1
- package/dist/chunks/{chunk.RSJYKNXT.js → chunk.Y3VP37FX.js} +1 -1
- package/dist/chunks/{chunk.4MC32HP7.js → chunk.YEVEBKAC.js} +1 -1
- package/dist/chunks/{chunk.F4XMSVNF.js → chunk.YHOA7MQN.js} +1 -1
- package/dist/chunks/chunk.YRBTSDUN.js +134 -0
- package/dist/components/accordion/accordion.js +2 -2
- package/dist/components/alert/alert.js +2 -2
- package/dist/components/badge/badge.d.ts +0 -2
- package/dist/components/badge/badge.js +2 -2
- package/dist/components/badge/badge.styles.js +1 -1
- package/dist/components/breadcrumb/breadcrumb.js +2 -2
- package/dist/components/breadcrumb-item/breadcrumb-item.js +2 -2
- package/dist/components/button/button.js +3 -3
- package/dist/components/combobox/combobox.d.ts +22 -1
- package/dist/components/combobox/combobox.js +7 -4
- package/dist/components/combobox/combobox.styles.js +1 -1
- package/dist/components/dialog/dialog.js +2 -2
- package/dist/components/drawer/drawer.js +2 -2
- package/dist/components/dropdown/dropdown.js +2 -2
- package/dist/components/format-bytes/format-bytes.js +2 -2
- package/dist/components/format-date/format-date.js +2 -2
- package/dist/components/format-number/format-number.js +2 -2
- package/dist/components/input/input.js +2 -2
- package/dist/components/input-mask/input-mask.js +2 -2
- package/dist/components/input-phone/input-phone.js +7 -7
- package/dist/components/option/option.js +2 -2
- package/dist/components/progress-bar/progress-bar.js +2 -2
- package/dist/components/radio-button/radio-button.js +2 -2
- package/dist/components/radio-button/radio-button.styles.js +1 -1
- package/dist/components/relative-time/relative-time.js +2 -2
- package/dist/components/select/select.js +3 -3
- package/dist/components/spinner/spinner.js +2 -2
- package/dist/components/step/step.d.ts +39 -0
- package/dist/components/step/step.js +24 -0
- package/dist/components/step/step.styles.d.ts +2 -0
- package/dist/components/step/step.styles.js +8 -0
- package/dist/components/step/step.utils.d.ts +3 -0
- package/dist/components/step/step.utils.js +7 -0
- package/dist/components/stepper/stepper.d.ts +23 -0
- package/dist/components/stepper/stepper.js +10 -0
- package/dist/components/stepper/stepper.styles.d.ts +2 -0
- package/dist/components/stepper/stepper.styles.js +8 -0
- package/dist/components/tab/tab.js +2 -2
- package/dist/components/tab-group/tab-group.js +2 -2
- package/dist/components/tag/tag.js +2 -2
- package/dist/components/tooltip/tooltip.js +2 -2
- package/dist/components/tree/tree.js +4 -4
- package/dist/components/tree-item/tree-item.js +3 -3
- package/dist/custom-elements.json +342 -24
- package/dist/design-system.d.ts +2 -0
- package/dist/design-system.js +56 -44
- package/dist/themes/dsa-wc-theme.css +43 -0
- package/dist/themes/dsa-wc-theme.min.css +1 -1
- package/dist/themes/dsa-wc-theme.styles.js +43 -0
- package/dist/translations/en-gb.js +1 -1
- package/dist/translations/en.js +1 -1
- package/dist/translations/fr.js +1 -1
- package/dist/utilities/debounce.d.ts +1 -0
- package/dist/utilities/debounce.js +7 -0
- package/dist/utilities/localize.d.ts +7 -0
- package/dist/utilities/localize.js +1 -1
- package/dist/vscode.html-custom-data.json +45 -6
- package/dist/web-types.json +167 -15
- package/package.json +5 -6
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
} from "./chunk.YIY5RM53.js";
|
|
7
7
|
import {
|
|
8
8
|
LocalizeController
|
|
9
|
-
} from "./chunk.
|
|
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
|
-
<
|
|
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
|
-
</
|
|
83
|
+
</div>
|
|
83
84
|
`;
|
|
84
85
|
}
|
|
85
86
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
radio_button_styles_default
|
|
3
|
-
} from "./chunk.
|
|
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
|
+
};
|
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
} from "./chunk.IGYXUK7A.js";
|
|
4
4
|
import {
|
|
5
5
|
LocalizeController
|
|
6
|
-
} from "./chunk.
|
|
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
|
-
<
|
|
44
|
+
<div role="list">
|
|
45
45
|
<slot @slotchange=${this.handleSlotChange}></slot>
|
|
46
|
-
</
|
|
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.
|
|
9
|
+
} from "./chunk.7BYKP4SA.js";
|
|
10
10
|
import {
|
|
11
11
|
watch
|
|
12
12
|
} 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 {
|
|
@@ -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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
4
|
-
import "../../chunks/chunk.
|
|
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,8 +1,8 @@
|
|
|
1
1
|
import {
|
|
2
2
|
DSABreadcrumb
|
|
3
|
-
} from "../../chunks/chunk.
|
|
3
|
+
} from "../../chunks/chunk.SCNCYZ35.js";
|
|
4
4
|
import "../../chunks/chunk.IGYXUK7A.js";
|
|
5
|
-
import "../../chunks/chunk.
|
|
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.
|
|
3
|
+
} from "../../chunks/chunk.P7QMP76I.js";
|
|
4
4
|
import "../../chunks/chunk.PULHNCDM.js";
|
|
5
5
|
import "../../chunks/chunk.YIY5RM53.js";
|
|
6
|
-
import "../../chunks/chunk.
|
|
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.
|
|
4
|
-
import "../../chunks/chunk.
|
|
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.
|
|
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.
|
|
4
|
-
import "../../chunks/chunk.
|
|
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.
|
|
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.
|
|
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
|
DSADialog
|
|
3
|
-
} from "../../chunks/chunk.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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";
|