@lukso/web-components 1.42.0 → 1.44.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/dist/components/index.cjs +3 -3
- package/dist/components/index.js +3 -3
- package/dist/components/lukso-button/index.cjs +1 -1
- package/dist/components/lukso-button/index.js +1 -1
- package/dist/components/lukso-card/index.cjs +35 -42
- package/dist/components/lukso-card/index.d.ts.map +1 -1
- package/dist/components/lukso-card/index.js +35 -42
- package/dist/components/lukso-checkbox/index.cjs +3 -2
- package/dist/components/lukso-checkbox/index.d.ts.map +1 -1
- package/dist/components/lukso-checkbox/index.js +3 -2
- package/dist/components/lukso-footer/index.cjs +1 -1
- package/dist/components/lukso-footer/index.js +1 -1
- package/dist/components/lukso-icon/index.cjs +2 -2
- package/dist/components/lukso-icon/index.js +2 -2
- package/dist/components/lukso-input/index.cjs +14 -7
- package/dist/components/lukso-input/index.d.ts.map +1 -1
- package/dist/components/lukso-input/index.js +14 -7
- package/dist/components/lukso-modal/index.cjs +1 -1
- package/dist/components/lukso-modal/index.js +1 -1
- package/dist/components/lukso-navbar/index.cjs +2 -2
- package/dist/components/lukso-navbar/index.js +2 -2
- package/dist/components/lukso-profile/index.cjs +2 -2
- package/dist/components/lukso-profile/index.js +2 -2
- package/dist/components/lukso-progress/index.cjs +2 -2
- package/dist/components/lukso-progress/index.js +2 -2
- package/dist/components/lukso-sanitize/index.cjs +1 -1
- package/dist/components/lukso-sanitize/index.js +1 -1
- package/dist/components/lukso-search/index.cjs +133 -38
- package/dist/components/lukso-search/index.d.ts +20 -12
- package/dist/components/lukso-search/index.d.ts.map +1 -1
- package/dist/components/lukso-search/index.js +133 -38
- package/dist/components/lukso-search/lukso-search.stories.d.ts +2 -0
- package/dist/components/lukso-search/lukso-search.stories.d.ts.map +1 -1
- package/dist/components/lukso-share/index.cjs +1 -1
- package/dist/components/lukso-share/index.js +1 -1
- package/dist/components/lukso-switch/index.cjs +5 -4
- package/dist/components/lukso-switch/index.d.ts.map +1 -1
- package/dist/components/lukso-switch/index.js +5 -4
- package/dist/components/lukso-tag/index.cjs +2 -2
- package/dist/components/lukso-tag/index.js +2 -2
- package/dist/components/lukso-terms/index.cjs +2 -2
- package/dist/components/lukso-terms/index.js +2 -2
- package/dist/components/lukso-test/index.cjs +2 -2
- package/dist/components/lukso-test/index.js +2 -2
- package/dist/components/lukso-username/index.cjs +2 -2
- package/dist/components/lukso-username/index.js +2 -2
- package/dist/components/lukso-wizard/index.cjs +2 -2
- package/dist/components/lukso-wizard/index.js +2 -2
- package/dist/{directive-helpers-8f79cbe5.js → directive-helpers-422da386.js} +1 -1
- package/dist/{directive-helpers-01f1c3b1.cjs → directive-helpers-b2851157.cjs} +1 -1
- package/dist/index-5b6b1166.js +59 -0
- package/dist/index-7ef6f8a1.cjs +67 -0
- package/dist/index.cjs +3 -3
- package/dist/index.js +3 -3
- package/dist/shared/tailwind-element/index.cjs +1 -1
- package/dist/shared/tailwind-element/index.js +1 -1
- package/dist/{style-map-5daca6c4.js → style-map-6cdbbb8b.js} +1 -1
- package/dist/{style-map-3b9af808.cjs → style-map-c00f9dd9.cjs} +1 -1
- package/package.json +1 -1
- package/tailwind.config.cjs +1 -0
- package/dist/index-930f6cf2.cjs +0 -67
- package/dist/index-ed87f41b.js +0 -59
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { T as TailwindStyledElement, x, A } from '../../index-
|
|
1
|
+
import { T as TailwindStyledElement, x, A } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
|
|
3
3
|
import { t } from '../../state-02a92ffa.js';
|
|
4
4
|
import { c as customClassMap } from '../../index-5e194caf.js';
|
|
@@ -6,7 +6,7 @@ import '../lukso-icon/index.js';
|
|
|
6
6
|
import '../lukso-profile/index.js';
|
|
7
7
|
import '../lukso-username/index.js';
|
|
8
8
|
import '../../directive-2bb7789e.js';
|
|
9
|
-
import '../../style-map-
|
|
9
|
+
import '../../style-map-6cdbbb8b.js';
|
|
10
10
|
|
|
11
11
|
const style = ":host {\n\n display: inline-flex\n}\n\n:host([is-full-width]) {\n\n display: flex;\n\n width: 100%\n}";
|
|
12
12
|
|
|
@@ -26,7 +26,6 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
26
26
|
super(...arguments);
|
|
27
27
|
this.value = "";
|
|
28
28
|
this.name = "";
|
|
29
|
-
this.type = "text";
|
|
30
29
|
this.placeholder = "";
|
|
31
30
|
this.label = "";
|
|
32
31
|
this.autocomplete = "off";
|
|
@@ -44,18 +43,35 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
44
43
|
this.isSearching = false;
|
|
45
44
|
this.noResultsText = "";
|
|
46
45
|
this.showNoResults = false;
|
|
46
|
+
this.selected = void 0;
|
|
47
47
|
this.hasFocus = false;
|
|
48
48
|
this.hasHighlight = false;
|
|
49
49
|
this.isDebouncing = false;
|
|
50
|
+
this.resultsParsed = [];
|
|
51
|
+
this.searchTerm = "";
|
|
50
52
|
this.defaultInputStyles = `bg-neutral-100 paragraph-inter-14-regular px-4 py-3 pr-10
|
|
51
53
|
border-solid h-[48px] placeholder:text-neutral-70
|
|
52
54
|
outline-none transition transition-all duration-150 appearance-none rounded-12`;
|
|
53
55
|
}
|
|
56
|
+
willUpdate(changedProperties) {
|
|
57
|
+
if (changedProperties.has("selected")) {
|
|
58
|
+
const selectedOption = this.shadowRoot?.querySelector(
|
|
59
|
+
`[data-index="${changedProperties.get("selected")}"`
|
|
60
|
+
);
|
|
61
|
+
if (selectedOption) {
|
|
62
|
+
selectedOption.scrollIntoView({
|
|
63
|
+
behavior: "smooth",
|
|
64
|
+
block: "center",
|
|
65
|
+
inline: "nearest"
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
}
|
|
54
70
|
inputTemplate() {
|
|
55
71
|
return x`
|
|
56
72
|
<input
|
|
57
73
|
name=${this.name}
|
|
58
|
-
type
|
|
74
|
+
type="text"
|
|
59
75
|
.value=${this.value}
|
|
60
76
|
placeholder=${this.placeholder}
|
|
61
77
|
?autofocus=${this.autofocus}
|
|
@@ -79,6 +95,7 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
79
95
|
@focus=${this.handleFocus}
|
|
80
96
|
@input=${this.handleSearch}
|
|
81
97
|
@blur=${this.handleBlur}
|
|
98
|
+
@click=${this.handleInputClick}
|
|
82
99
|
@mouseenter=${this.handleMouseOver}
|
|
83
100
|
@mouseleave=${this.handleMouseOut}
|
|
84
101
|
/>
|
|
@@ -107,47 +124,87 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
107
124
|
}
|
|
108
125
|
resultsTemplate() {
|
|
109
126
|
const resultTemplates = [];
|
|
110
|
-
|
|
111
|
-
|
|
127
|
+
this.resultsParsed = JSON.parse(this.results);
|
|
128
|
+
for (const result of Object.entries(this.resultsParsed)) {
|
|
129
|
+
const index = Number(result[0]);
|
|
130
|
+
if ("value" in result[1]) {
|
|
131
|
+
resultTemplates.push(this.resultStringTemplate(result[1], index));
|
|
132
|
+
} else if ("address" in result[1]) {
|
|
133
|
+
resultTemplates.push(this.resultProfileTemplate(result[1], index));
|
|
134
|
+
} else {
|
|
135
|
+
console.error("Unknown result type", result);
|
|
136
|
+
}
|
|
112
137
|
}
|
|
138
|
+
return x`${this.dropdownWrapperTemplate(resultTemplates)}`;
|
|
139
|
+
}
|
|
140
|
+
noResultsTemplate() {
|
|
141
|
+
return x`${this.dropdownWrapperTemplate(
|
|
142
|
+
x`<div class="paragraph-inter-14-semi-bold text-neutral-20 pl-1">
|
|
143
|
+
${this.noResultsText}
|
|
144
|
+
</div>`
|
|
145
|
+
)}`;
|
|
146
|
+
}
|
|
147
|
+
loadingTemplate() {
|
|
113
148
|
if (this.showNoResults) {
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
149
|
+
return x`${this.dropdownWrapperTemplate(x`
|
|
150
|
+
<div role="status" class="flex flex-col gap-1">
|
|
151
|
+
<div
|
|
152
|
+
class="h-10 bg-neutral-95 w-full rounded-8 animate-pulse animation-delay-none"
|
|
153
|
+
></div>
|
|
154
|
+
</div>
|
|
155
|
+
`)}`;
|
|
156
|
+
}
|
|
157
|
+
if (this.resultsParsed.length === 0 || this.resultsParsed.length > 5) {
|
|
158
|
+
return x`${this.dropdownWrapperTemplate(x`
|
|
159
|
+
<div role="status" class="flex flex-col gap-1">
|
|
160
|
+
${[...Array(5)].map(
|
|
161
|
+
() => x`<div
|
|
162
|
+
class="h-10 bg-neutral-95 w-full rounded-8 animate-pulse animation-delay-none"
|
|
163
|
+
></div>`
|
|
164
|
+
)}
|
|
165
|
+
</div>
|
|
166
|
+
`)}`;
|
|
126
167
|
}
|
|
168
|
+
return x`${this.dropdownWrapperTemplate(x`
|
|
169
|
+
<div role="status" class="flex flex-col gap-1">
|
|
170
|
+
${this.resultsParsed.map(
|
|
171
|
+
() => x`<div
|
|
172
|
+
class="h-10 bg-neutral-95 w-full rounded-8 animate-pulse animation-delay-none"
|
|
173
|
+
></div>`
|
|
174
|
+
)}
|
|
175
|
+
</div>
|
|
176
|
+
`)}`;
|
|
177
|
+
}
|
|
178
|
+
dropdownWrapperTemplate(innerTemplate) {
|
|
127
179
|
return x`<div
|
|
128
180
|
class="bg-neutral-100 border border-neutral-90 shadow-1xl rounded-12 p-3 mt-2 z-50 flex absolute w-full flex-col gap-1 overflow-y-auto max-h-64"
|
|
129
181
|
>
|
|
130
|
-
${
|
|
182
|
+
${innerTemplate}
|
|
131
183
|
</div>`;
|
|
132
184
|
}
|
|
133
|
-
|
|
134
|
-
return x`<div class="paragraph-inter-14-semi-bold text-neutral-20 pl-1">
|
|
135
|
-
${this.noResultsText}
|
|
136
|
-
</div>`;
|
|
137
|
-
}
|
|
138
|
-
resultStringTemplate(result) {
|
|
185
|
+
resultStringTemplate(result, index) {
|
|
139
186
|
return x`<div
|
|
140
187
|
data-id="${result.id}"
|
|
141
|
-
|
|
188
|
+
data-index="${index + 1}"
|
|
189
|
+
class="paragraph-inter-14-regular text-neutral-20 cursor-pointer hover:bg-neutral-98 rounded-8 p-2 ${customClassMap(
|
|
190
|
+
{
|
|
191
|
+
["bg-neutral-98"]: this.selected === index + 1
|
|
192
|
+
}
|
|
193
|
+
)}'"
|
|
142
194
|
@click=${() => this.handleSelect(result)}
|
|
143
195
|
>
|
|
144
196
|
${result.value}
|
|
145
197
|
</div>`;
|
|
146
198
|
}
|
|
147
|
-
resultProfileTemplate(result) {
|
|
199
|
+
resultProfileTemplate(result, index) {
|
|
148
200
|
return x`<div
|
|
149
201
|
data-id="${result.address}"
|
|
150
|
-
|
|
202
|
+
data-index="${index + 1}"
|
|
203
|
+
class="cursor-pointer hover:bg-neutral-98 rounded-8 p-2 flex gap-2 items-center ${customClassMap(
|
|
204
|
+
{
|
|
205
|
+
["bg-neutral-98"]: this.selected === index + 1
|
|
206
|
+
}
|
|
207
|
+
)}"
|
|
151
208
|
@click=${() => this.handleSelect(result)}
|
|
152
209
|
>
|
|
153
210
|
<lukso-profile
|
|
@@ -165,7 +222,8 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
165
222
|
></lukso-username>
|
|
166
223
|
</div>`;
|
|
167
224
|
}
|
|
168
|
-
handleSelect(result) {
|
|
225
|
+
async handleSelect(result) {
|
|
226
|
+
await this.updateComplete;
|
|
169
227
|
const selectEvent = new CustomEvent("on-select", {
|
|
170
228
|
detail: {
|
|
171
229
|
value: result
|
|
@@ -181,11 +239,37 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
181
239
|
this.hasHighlight = true;
|
|
182
240
|
}
|
|
183
241
|
}
|
|
184
|
-
handleBlur() {
|
|
242
|
+
async handleBlur(event) {
|
|
243
|
+
await this.updateComplete;
|
|
185
244
|
this.hasFocus = false;
|
|
186
245
|
this.hasHighlight = false;
|
|
246
|
+
const target = event.target;
|
|
247
|
+
const blurEvent = new CustomEvent("on-blur", {
|
|
248
|
+
detail: {
|
|
249
|
+
value: target.value,
|
|
250
|
+
event
|
|
251
|
+
},
|
|
252
|
+
bubbles: false,
|
|
253
|
+
composed: true
|
|
254
|
+
});
|
|
255
|
+
this.dispatchEvent(blurEvent);
|
|
256
|
+
}
|
|
257
|
+
async handleInputClick(event) {
|
|
258
|
+
await this.updateComplete;
|
|
259
|
+
const target = event.target;
|
|
260
|
+
const clickEvent = new CustomEvent("on-input-click", {
|
|
261
|
+
detail: {
|
|
262
|
+
value: target.value,
|
|
263
|
+
event
|
|
264
|
+
},
|
|
265
|
+
bubbles: false,
|
|
266
|
+
composed: true
|
|
267
|
+
});
|
|
268
|
+
this.dispatchEvent(clickEvent);
|
|
187
269
|
}
|
|
188
|
-
searchDebounce(searchTerm) {
|
|
270
|
+
async searchDebounce(searchTerm) {
|
|
271
|
+
await this.updateComplete;
|
|
272
|
+
this.value = searchTerm;
|
|
189
273
|
this.debounceTimer = setTimeout(() => {
|
|
190
274
|
const changeEvent = new CustomEvent("on-search", {
|
|
191
275
|
detail: {
|
|
@@ -224,16 +308,21 @@ let LuksoSearch = class extends TailwindStyledElement(style) {
|
|
|
224
308
|
<div class="flex relative items-center">
|
|
225
309
|
${this.inputTemplate()}
|
|
226
310
|
<lukso-icon
|
|
227
|
-
name="
|
|
311
|
+
name="search"
|
|
228
312
|
class="absolute right-0 mr-3 ${customClassMap({
|
|
229
313
|
["opacity-60 cursor-not-allowed"]: this.isDisabled,
|
|
230
|
-
["cursor-not-allowed"]: this.isReadonly
|
|
231
|
-
["animate-spin"]: this.isSearching || this.isDebouncing
|
|
314
|
+
["cursor-not-allowed"]: this.isReadonly
|
|
232
315
|
})}"
|
|
233
316
|
@mouseenter=${this.handleMouseOver}
|
|
234
317
|
></lukso-icon>
|
|
235
318
|
</div>
|
|
236
|
-
|
|
319
|
+
<!-- results dropdown -->
|
|
320
|
+
${this.results && !(this.isSearching || this.isDebouncing) ? this.resultsTemplate() : A}
|
|
321
|
+
<!-- no results dropdown -->
|
|
322
|
+
${this.showNoResults && !(this.isSearching || this.isDebouncing) ? this.noResultsTemplate() : A}
|
|
323
|
+
<!-- loading dropdown -->
|
|
324
|
+
${this.value && (this.isSearching || this.isDebouncing) ? this.loadingTemplate() : A}
|
|
325
|
+
<!-- error -->
|
|
237
326
|
${this.error ? this.errorTemplate() : A}
|
|
238
327
|
</div>
|
|
239
328
|
`;
|
|
@@ -245,9 +334,6 @@ __decorateClass([
|
|
|
245
334
|
__decorateClass([
|
|
246
335
|
e({ type: String })
|
|
247
336
|
], LuksoSearch.prototype, "name", 2);
|
|
248
|
-
__decorateClass([
|
|
249
|
-
e({ type: String })
|
|
250
|
-
], LuksoSearch.prototype, "type", 2);
|
|
251
337
|
__decorateClass([
|
|
252
338
|
e({ type: String })
|
|
253
339
|
], LuksoSearch.prototype, "placeholder", 2);
|
|
@@ -299,6 +385,9 @@ __decorateClass([
|
|
|
299
385
|
__decorateClass([
|
|
300
386
|
e({ type: Boolean, attribute: "show-no-results" })
|
|
301
387
|
], LuksoSearch.prototype, "showNoResults", 2);
|
|
388
|
+
__decorateClass([
|
|
389
|
+
e({ type: Number })
|
|
390
|
+
], LuksoSearch.prototype, "selected", 2);
|
|
302
391
|
__decorateClass([
|
|
303
392
|
t()
|
|
304
393
|
], LuksoSearch.prototype, "hasFocus", 2);
|
|
@@ -311,6 +400,12 @@ __decorateClass([
|
|
|
311
400
|
__decorateClass([
|
|
312
401
|
t()
|
|
313
402
|
], LuksoSearch.prototype, "debounceTimer", 2);
|
|
403
|
+
__decorateClass([
|
|
404
|
+
t()
|
|
405
|
+
], LuksoSearch.prototype, "resultsParsed", 2);
|
|
406
|
+
__decorateClass([
|
|
407
|
+
t()
|
|
408
|
+
], LuksoSearch.prototype, "searchTerm", 2);
|
|
314
409
|
LuksoSearch = __decorateClass([
|
|
315
410
|
e$1("lukso-search")
|
|
316
411
|
], LuksoSearch);
|
|
@@ -10,4 +10,6 @@ export declare const ProfileSearch: any;
|
|
|
10
10
|
export declare const SearchingState: any;
|
|
11
11
|
/** To show that search hes no results add `show-no-results` attribute. You can also customize no results text with `no-results-text` attribute. */
|
|
12
12
|
export declare const NoResults: any;
|
|
13
|
+
/** Example of selected option. */
|
|
14
|
+
export declare const SelectedOption: any;
|
|
13
15
|
//# sourceMappingURL=lukso-search.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lukso-search.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-search/lukso-search.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAGhD,OAAO,SAAS,CAAA;AAEhB,mHAAmH;AACnH,QAAA,MAAM,IAAI,EAAE,
|
|
1
|
+
{"version":3,"file":"lukso-search.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-search/lukso-search.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,2BAA2B,CAAA;AAGhD,OAAO,SAAS,CAAA;AAEhB,mHAAmH;AACnH,QAAA,MAAM,IAAI,EAAE,IA6OX,CAAA;AAED,eAAe,IAAI,CAAA;AA8EnB,+CAA+C;AAC/C,eAAO,MAAM,aAAa,KAAoB,CAAA;AAM9C,gDAAgD;AAChD,eAAO,MAAM,aAAa,KAAoB,CAAA;AAsB9C,0FAA0F;AAC1F,eAAO,MAAM,cAAc,KAAoB,CAAA;AAQ/C,mJAAmJ;AACnJ,eAAO,MAAM,SAAS,KAAoB,CAAA;AAQ1C,mCAAmC;AACnC,eAAO,MAAM,cAAc,KAAoB,CAAA"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
7
|
|
|
8
8
|
const style = ":host {\n display: inline-flex\n}";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { T as TailwindStyledElement, x } from '../../index-
|
|
1
|
+
import { T as TailwindStyledElement, x } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
|
|
3
3
|
|
|
4
4
|
const style = ":host {\n display: inline-flex\n}";
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
|
-
const styleMap = require('../../style-map-
|
|
7
|
+
const styleMap = require('../../style-map-c00f9dd9.cjs');
|
|
8
8
|
const index = require('../../index-e9668573.cjs');
|
|
9
9
|
require('../../directive-8278ab14.cjs');
|
|
10
10
|
|
|
@@ -28,9 +28,10 @@ exports.LuksoSwitch = class LuksoSwitch extends shared_tailwindElement_index.Tai
|
|
|
28
28
|
this.defaultLabelStyles = `transition duration-300 ease-in block h-6 overflow-hidden rounded-full relative inline-block w-10`;
|
|
29
29
|
this.defaultInputStyles = `absolute block w-6 h-6 rounded-full bg-white border-2 appearance-none transition duration-300 ease-in`;
|
|
30
30
|
}
|
|
31
|
-
handleChange(event) {
|
|
32
|
-
this.isChecked = !this.isChecked;
|
|
31
|
+
async handleChange(event) {
|
|
33
32
|
const target = event.target;
|
|
33
|
+
this.isChecked = target.checked;
|
|
34
|
+
await this.updateComplete;
|
|
34
35
|
const changeEvent = new CustomEvent("on-change", {
|
|
35
36
|
detail: {
|
|
36
37
|
value: target.checked,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-switch/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAG3D,qBACa,WAAY,SAAQ,eAAe;IAE9C,KAAK,SAAa;IAGlB,OAAO,CAAC,SAAS,CAAQ;IAMzB,OAAO,CAAC,UAAU,CAAQ;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/lukso-switch/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAG3D,qBACa,WAAY,SAAQ,eAAe;IAE9C,KAAK,SAAa;IAGlB,OAAO,CAAC,SAAS,CAAQ;IAMzB,OAAO,CAAC,UAAU,CAAQ;YAEZ,YAAY;IAe1B,OAAO,CAAC,kBAAkB,CAAsG;IAEhI,OAAO,CAAC,kBAAkB,CAA0G;IAEpI,MAAM;CAiCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAA;KAC5B;CACF"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { a as TailwindElement, x } from '../../index-
|
|
1
|
+
import { a as TailwindElement, x } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
|
|
3
|
-
import { o } from '../../style-map-
|
|
3
|
+
import { o } from '../../style-map-6cdbbb8b.js';
|
|
4
4
|
import { c as customClassMap } from '../../index-5e194caf.js';
|
|
5
5
|
import '../../directive-2bb7789e.js';
|
|
6
6
|
|
|
@@ -24,9 +24,10 @@ let LuksoSwitch = class extends TailwindElement {
|
|
|
24
24
|
this.defaultLabelStyles = `transition duration-300 ease-in block h-6 overflow-hidden rounded-full relative inline-block w-10`;
|
|
25
25
|
this.defaultInputStyles = `absolute block w-6 h-6 rounded-full bg-white border-2 appearance-none transition duration-300 ease-in`;
|
|
26
26
|
}
|
|
27
|
-
handleChange(event) {
|
|
28
|
-
this.isChecked = !this.isChecked;
|
|
27
|
+
async handleChange(event) {
|
|
29
28
|
const target = event.target;
|
|
29
|
+
this.isChecked = target.checked;
|
|
30
|
+
await this.updateComplete;
|
|
30
31
|
const changeEvent = new CustomEvent("on-change", {
|
|
31
32
|
detail: {
|
|
32
33
|
value: target.checked,
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
|
-
const styleMap = require('../../style-map-
|
|
7
|
+
const styleMap = require('../../style-map-c00f9dd9.cjs');
|
|
8
8
|
const index = require('../../index-e9668573.cjs');
|
|
9
9
|
require('../../directive-8278ab14.cjs');
|
|
10
10
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { T as TailwindStyledElement, x } from '../../index-
|
|
1
|
+
import { T as TailwindStyledElement, x } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
|
|
3
|
-
import { o } from '../../style-map-
|
|
3
|
+
import { o } from '../../style-map-6cdbbb8b.js';
|
|
4
4
|
import { c as customClassMap } from '../../index-5e194caf.js';
|
|
5
5
|
import '../../directive-2bb7789e.js';
|
|
6
6
|
|
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
7
|
const state = require('../../state-51b50a6b.cjs');
|
|
8
8
|
const index = require('../../index-e9668573.cjs');
|
|
9
9
|
require('../lukso-icon/index.cjs');
|
|
10
10
|
require('../lukso-sanitize/index.cjs');
|
|
11
11
|
require('../../directive-8278ab14.cjs');
|
|
12
|
-
require('../../style-map-
|
|
12
|
+
require('../../style-map-c00f9dd9.cjs');
|
|
13
13
|
|
|
14
14
|
const style = ":host {\n display: flex;\n height: 100%\n}";
|
|
15
15
|
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { T as TailwindStyledElement, x } from '../../index-
|
|
1
|
+
import { T as TailwindStyledElement, x } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
|
|
3
3
|
import { t } from '../../state-02a92ffa.js';
|
|
4
4
|
import { c as customClassMap } from '../../index-5e194caf.js';
|
|
5
5
|
import '../lukso-icon/index.js';
|
|
6
6
|
import '../lukso-sanitize/index.js';
|
|
7
7
|
import '../../directive-2bb7789e.js';
|
|
8
|
-
import '../../style-map-
|
|
8
|
+
import '../../style-map-6cdbbb8b.js';
|
|
9
9
|
|
|
10
10
|
const style = ":host {\n display: flex;\n height: 100%\n}";
|
|
11
11
|
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
7
|
const directive = require('../../directive-8278ab14.cjs');
|
|
8
|
-
const directiveHelpers = require('../../directive-helpers-
|
|
8
|
+
const directiveHelpers = require('../../directive-helpers-b2851157.cjs');
|
|
9
9
|
|
|
10
10
|
/**
|
|
11
11
|
* @license
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { c as A$1, b as T, T as TailwindStyledElement, x as x$1 } from '../../index-
|
|
1
|
+
import { c as A$1, b as T, T as TailwindStyledElement, x as x$1 } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e as e$2, a as e$3 } from '../../query-assigned-elements-e36df787.js';
|
|
3
3
|
import { i as i$1, t as t$1, e as e$1 } from '../../directive-2bb7789e.js';
|
|
4
|
-
import { e } from '../../directive-helpers-
|
|
4
|
+
import { e } from '../../directive-helpers-422da386.js';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* @license
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
|
-
const styleMap = require('../../style-map-
|
|
7
|
+
const styleMap = require('../../style-map-c00f9dd9.cjs');
|
|
8
8
|
const index = require('../../index-e9668573.cjs');
|
|
9
9
|
require('../../directive-8278ab14.cjs');
|
|
10
10
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { T as TailwindStyledElement, x, c as A } from '../../index-
|
|
1
|
+
import { T as TailwindStyledElement, x, c as A } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e, a as e$1 } from '../../query-assigned-elements-e36df787.js';
|
|
3
|
-
import { o } from '../../style-map-
|
|
3
|
+
import { o } from '../../style-map-6cdbbb8b.js';
|
|
4
4
|
import { c as customClassMap } from '../../index-5e194caf.js';
|
|
5
5
|
import '../../directive-2bb7789e.js';
|
|
6
6
|
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const shared_tailwindElement_index = require('../../index-
|
|
5
|
+
const shared_tailwindElement_index = require('../../index-7ef6f8a1.cjs');
|
|
6
6
|
const queryAssignedElements = require('../../query-assigned-elements-5200f974.cjs');
|
|
7
7
|
const directive = require('../../directive-8278ab14.cjs');
|
|
8
|
-
const directiveHelpers = require('../../directive-helpers-
|
|
8
|
+
const directiveHelpers = require('../../directive-helpers-b2851157.cjs');
|
|
9
9
|
const index = require('../../index-e9668573.cjs');
|
|
10
10
|
|
|
11
11
|
/**
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { b as T, T as TailwindStyledElement, x } from '../../index-
|
|
1
|
+
import { b as T, T as TailwindStyledElement, x } from '../../index-5b6b1166.js';
|
|
2
2
|
import { e as e$1, a as e$2 } from '../../query-assigned-elements-e36df787.js';
|
|
3
3
|
import { e, i, t } from '../../directive-2bb7789e.js';
|
|
4
|
-
import { m, f, c as c$1, p, a } from '../../directive-helpers-
|
|
4
|
+
import { m, f, c as c$1, p, a } from '../../directive-helpers-422da386.js';
|
|
5
5
|
import { c as customClassMap } from '../../index-5e194caf.js';
|
|
6
6
|
|
|
7
7
|
/**
|