@warp-ds/elements 2.2.0-next.24 → 2.2.0-next.26
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/custom-elements.json +2 -2
- package/dist/packages/expandable/expandable.stories.js +0 -1
- package/dist/packages/expandable/index.js +2 -2
- package/dist/packages/expandable/index.js.map +2 -2
- package/dist/packages/expandable/styles.js +1 -1
- package/dist/packages/modal/index.js +4 -4
- package/dist/packages/modal/index.js.map +1 -1
- package/dist/packages/modal/modal-header.js +8 -8
- package/dist/packages/modal/modal-header.js.map +1 -1
- package/dist/packages/modal/modal.stories.d.ts +3 -3
- package/dist/packages/modal/modal.stories.js +164 -70
- package/dist/packages/select/index.js +23 -16
- package/dist/packages/select/index.js.map +3 -3
- package/dist/packages/select/select.stories.d.ts +7 -0
- package/dist/packages/select/select.stories.js +71 -2
- package/dist/web-types.json +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from
|
|
2
|
-
import type { WarpModal, WarpModalFooter, WarpModalHeader } from
|
|
3
|
-
import
|
|
1
|
+
import type { Meta, StoryObj } from "@storybook/web-components-vite";
|
|
2
|
+
import type { WarpModal, WarpModalFooter, WarpModalHeader } from "./index.ts";
|
|
3
|
+
import "./index.ts";
|
|
4
4
|
declare const modalArgs: Partial<WarpModal> & {
|
|
5
5
|
[key: string]: any;
|
|
6
6
|
};
|
|
@@ -1,122 +1,210 @@
|
|
|
1
|
-
import { spread } from
|
|
2
|
-
import { getStorybookHelpers } from
|
|
3
|
-
import { html } from
|
|
4
|
-
import { prespread } from
|
|
5
|
-
import
|
|
6
|
-
const { events: modalEvents, args: modalArgs, argTypes: modalArgTypes } = getStorybookHelpers(
|
|
7
|
-
const { events: modalHeaderEvents, args: modalHeaderArgs, argTypes: modalHeaderArgTypes, } = getStorybookHelpers(
|
|
8
|
-
const { events: modalFooterEvents, args: modalFooterArgs, argTypes: modalFooterArgTypes, } = getStorybookHelpers(
|
|
1
|
+
import { spread } from "@open-wc/lit-helpers";
|
|
2
|
+
import { getStorybookHelpers } from "@wc-toolkit/storybook-helpers";
|
|
3
|
+
import { html } from "lit";
|
|
4
|
+
import { prespread } from "../../.storybook/utilities.js";
|
|
5
|
+
import "./index.ts";
|
|
6
|
+
const { events: modalEvents, args: modalArgs, argTypes: modalArgTypes, } = getStorybookHelpers("w-modal");
|
|
7
|
+
const { events: modalHeaderEvents, args: modalHeaderArgs, argTypes: modalHeaderArgTypes, } = getStorybookHelpers("w-modal-header");
|
|
8
|
+
const { events: modalFooterEvents, args: modalFooterArgs, argTypes: modalFooterArgTypes, } = getStorybookHelpers("w-modal-footer");
|
|
9
9
|
const meta = {
|
|
10
|
-
title:
|
|
10
|
+
title: "Overlays/Modal",
|
|
11
11
|
};
|
|
12
12
|
export default meta;
|
|
13
13
|
export const Default = {
|
|
14
14
|
args: {},
|
|
15
15
|
render() {
|
|
16
16
|
return html `
|
|
17
|
-
<w-button id="modal-open-button-one" aria-haspopup="dialog"
|
|
17
|
+
<w-button id="modal-open-button-one" aria-haspopup="dialog"
|
|
18
|
+
>Open a modal</w-button
|
|
19
|
+
>
|
|
18
20
|
<w-modal id="example-modal-one">
|
|
19
|
-
<w-modal-header
|
|
21
|
+
<w-modal-header
|
|
22
|
+
id="modal-header-one"
|
|
23
|
+
slot="header"
|
|
24
|
+
title="An example modal"
|
|
25
|
+
></w-modal-header>
|
|
20
26
|
<div slot="content">
|
|
27
|
+
<h2 class="h4 mb-16">Triumph by Wu Tang Clan</h2>
|
|
21
28
|
<div style="margin-bottom: 12px">
|
|
22
|
-
<w-button id="modal-toggle-back-one" variant="utility" small
|
|
29
|
+
<w-button id="modal-toggle-back-one" variant="utility" small
|
|
30
|
+
>Toggle back button</w-button
|
|
31
|
+
>
|
|
23
32
|
</div>
|
|
24
33
|
<p>
|
|
25
|
-
I bomb atomically, Socrates' philosophies and hypotheses Can't
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
34
|
+
I bomb atomically, Socrates' philosophies and hypotheses Can't
|
|
35
|
+
define how I be droppin' these mockeries Lyrically perform armed
|
|
36
|
+
robbery Flee with the lottery, possibly they spotted me
|
|
37
|
+
Battle-scarred Shogun, explosion when my pen hits tremendous
|
|
38
|
+
Ultra-violet shine blind forensics I inspect view through the future
|
|
39
|
+
see millennium Killa Beez sold fifty gold, sixty platinum Shackling
|
|
40
|
+
the masses with drastic rap tactics Graphic displays melt the steel
|
|
41
|
+
like blacksmiths Black Wu jackets, Queen Beez ease the guns in
|
|
42
|
+
Rumble with patrolmen, tear gas laced the function Heads by the
|
|
43
|
+
score take flight, incite a war Chicks hit the floor, diehard fans
|
|
44
|
+
demand more Behold the bold soldier, control the globe slowly
|
|
45
|
+
Proceeds to blow, swingin' swords like Shinobi Stomp grounds and
|
|
46
|
+
pound footprints in solid rock Wu got it locked, performin' live on
|
|
47
|
+
your hottest block
|
|
32
48
|
</p>
|
|
33
49
|
<p>
|
|
34
|
-
First I'm gonna getcha, once I gotcha, I gat-cha, You could never
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
50
|
+
First I'm gonna getcha, once I gotcha, I gat-cha, You could never
|
|
51
|
+
capture the Method Man's stature. So uhh, tic toc and keep ticking,
|
|
52
|
+
while I get you flipping off what I'm kicking. Yes, the rhythm, the
|
|
53
|
+
rebel, alone in my level heat it up past the boiling point of metal.
|
|
54
|
+
Shackling the masses with drastic rap tactics, graphic displays melt
|
|
55
|
+
the steel like blacksmiths. My beats travel like a vortex through
|
|
56
|
+
your spine, to the top of your cerebral cortex. Yes, the rhythm, the
|
|
57
|
+
rebel, alone in my level heat it up past the boiling point of metal.
|
|
58
|
+
Small change, they putting shame in the game. Murderous material,
|
|
59
|
+
made by a madman, it's the mic wrecker, Inspector, bad man.
|
|
40
60
|
</p>
|
|
41
61
|
<p>
|
|
42
|
-
My beats travel like a vortex through your spine, to the top of your
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
62
|
+
My beats travel like a vortex through your spine, to the top of your
|
|
63
|
+
cerebral cortex. The rebel, I make more noise than heavy metal. Now,
|
|
64
|
+
lo and behold, another deadly episode, bound to catch another charge
|
|
65
|
+
when I explode Perpendicular to the square we stay in gold like
|
|
66
|
+
Flair, escape from your dragon's lair in particular. Handcuffed in
|
|
67
|
+
the back of a bus, forty of us. Slammin a hype verse til ya head
|
|
68
|
+
burst. Handcuffed in the back of a bus, forty of us. I bomb
|
|
69
|
+
atomically Socrates' philosophies and hypothesis can't define how I
|
|
70
|
+
be dropping these mockeries. I be that insane one from the psycho
|
|
71
|
+
ward, I'm on the trigger, plus I got the Wu-Tang sword. Step through
|
|
72
|
+
your section with the Force like Luke Skywalker, rhyme author,
|
|
73
|
+
orchestrate mind torture.
|
|
48
74
|
</p>
|
|
49
75
|
<p>
|
|
50
|
-
It was the night before New Year's all through the projects, not a
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
76
|
+
It was the night before New Year's all through the projects, not a
|
|
77
|
+
handgun was silent, not even a Tec. I smoke on the mic like smoking
|
|
78
|
+
Joe Frazier, the hell raiser, raising hell with the flavor. The Wu
|
|
79
|
+
is comin thru, the outcome is critical, Muckin wit my style, is sort
|
|
80
|
+
of like a Miracle. We got stick-up kids, corrupt cops, and pop
|
|
81
|
+
rocks. Step through your section with the Force like Luke Skywalker,
|
|
82
|
+
rhyme author, orchestrate mind torture. Rae got it going on pal,
|
|
83
|
+
call me the rap assassinator, rhymes rugged and built like
|
|
84
|
+
Schwarzenegger.
|
|
55
85
|
</p>
|
|
56
86
|
</div>
|
|
57
87
|
<w-modal-footer slot="footer">
|
|
58
|
-
<
|
|
88
|
+
<div class="flex gap-16">
|
|
89
|
+
<w-button variant="secondary" id="modal-close-button-cancel"
|
|
90
|
+
>Cancel</w-button
|
|
91
|
+
>
|
|
92
|
+
<w-button variant="primary" id="modal-close-button-one"
|
|
93
|
+
>Confirm</w-button
|
|
94
|
+
>
|
|
95
|
+
</div>
|
|
59
96
|
</w-modal-footer>
|
|
60
97
|
</w-modal>
|
|
61
|
-
|
|
62
|
-
<script>
|
|
63
|
-
const openButtonOne = document.querySelector('#modal-open-button-one');
|
|
64
|
-
const closeButtonOne = document.querySelector('#modal-close-button-one');
|
|
65
|
-
const toggleBackButtonOne = document.querySelector('#modal-toggle-back-one');
|
|
66
|
-
const modalOne = document.querySelector('#example-modal-one');
|
|
67
|
-
const modalHeaderOne = document.querySelector('#modal-header-one');
|
|
68
|
-
openButtonOne.addEventListener('click', () => modalOne.open());
|
|
69
|
-
closeButtonOne.addEventListener('click', () => modalOne.close());
|
|
70
|
-
toggleBackButtonOne.addEventListener('click', () => {
|
|
71
|
-
modalHeaderOne.back = !modalHeaderOne.back;
|
|
72
|
-
});
|
|
73
|
-
</script>
|
|
74
98
|
`;
|
|
75
99
|
},
|
|
100
|
+
play: async ({ canvasElement }) => {
|
|
101
|
+
await Promise.all([
|
|
102
|
+
customElements.whenDefined("w-button"),
|
|
103
|
+
customElements.whenDefined("w-modal"),
|
|
104
|
+
customElements.whenDefined("w-modal-header"),
|
|
105
|
+
customElements.whenDefined("w-modal-footer"),
|
|
106
|
+
]);
|
|
107
|
+
const openButton = canvasElement.querySelector("#modal-open-button-one");
|
|
108
|
+
const closeButton = canvasElement.querySelector("#modal-close-button-one");
|
|
109
|
+
const toggleBackButton = canvasElement.querySelector("#modal-toggle-back-one");
|
|
110
|
+
const cancelButton = canvasElement.querySelector("#modal-close-button-cancel");
|
|
111
|
+
const modal = canvasElement.querySelector("#example-modal-one");
|
|
112
|
+
const modalHeader = canvasElement.querySelector("#modal-header-one");
|
|
113
|
+
if (openButton && modal) {
|
|
114
|
+
openButton.addEventListener("click", () => modal.open());
|
|
115
|
+
}
|
|
116
|
+
if (closeButton && modal) {
|
|
117
|
+
closeButton.addEventListener("click", () => modal.close());
|
|
118
|
+
}
|
|
119
|
+
if (cancelButton && modal) {
|
|
120
|
+
cancelButton.addEventListener("click", () => modal.close());
|
|
121
|
+
}
|
|
122
|
+
if (toggleBackButton && modalHeader) {
|
|
123
|
+
toggleBackButton.addEventListener("click", () => {
|
|
124
|
+
modalHeader.back = !modalHeader.back;
|
|
125
|
+
});
|
|
126
|
+
}
|
|
127
|
+
},
|
|
128
|
+
parameters: {
|
|
129
|
+
docs: {
|
|
130
|
+
story: {
|
|
131
|
+
autoplay: true,
|
|
132
|
+
},
|
|
133
|
+
},
|
|
134
|
+
},
|
|
76
135
|
};
|
|
77
136
|
export const WithImage = {
|
|
78
137
|
args: {},
|
|
79
138
|
render() {
|
|
80
139
|
return html `
|
|
81
|
-
<w-button id="modal-open-button-two" aria-haspopup="dialog"
|
|
140
|
+
<w-button id="modal-open-button-two" aria-haspopup="dialog"
|
|
141
|
+
>Open a modal</w-button
|
|
142
|
+
>
|
|
82
143
|
<w-modal id="example-modal-two">
|
|
83
144
|
<w-modal-header slot="header" title="Look a doggo!">
|
|
84
145
|
<img
|
|
85
146
|
slot="top"
|
|
86
147
|
style="height: 256px; width: 100%; object-fit: cover;"
|
|
87
148
|
src="https://images.unsplash.com/photo-1534361960057-19889db9621e"
|
|
88
|
-
alt="A really nice dog"
|
|
149
|
+
alt="A really nice dog"
|
|
150
|
+
/>
|
|
89
151
|
</w-modal-header>
|
|
90
152
|
<div slot="content">
|
|
91
153
|
<p>
|
|
92
|
-
I bomb atomically, Socrates' philosophies and hypotheses Can't
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
154
|
+
I bomb atomically, Socrates' philosophies and hypotheses Can't
|
|
155
|
+
define how I be droppin' these mockeries Lyrically perform armed
|
|
156
|
+
robbery Flee with the lottery, possibly they spotted me
|
|
157
|
+
Battle-scarred Shogun, explosion when my pen hits tremendous
|
|
158
|
+
Ultra-violet shine blind forensics I inspect view through the future
|
|
159
|
+
see millennium Killa Beez sold fifty gold, sixty platinum Shackling
|
|
160
|
+
the masses with drastic rap tactics Graphic displays melt the steel
|
|
161
|
+
like blacksmiths Black Wu jackets, Queen Beez ease the guns in
|
|
162
|
+
Rumble with patrolmen, tear gas laced the function Heads by the
|
|
163
|
+
score take flight, incite a war Chicks hit the floor, diehard fans
|
|
164
|
+
demand more Behold the bold soldier, control the globe slowly
|
|
165
|
+
Proceeds to blow, swingin' swords like Shinobi Stomp grounds and
|
|
166
|
+
pound footprints in solid rock Wu got it locked, performin' live on
|
|
167
|
+
your hottest block
|
|
99
168
|
</p>
|
|
100
169
|
</div>
|
|
101
170
|
<w-modal-footer slot="footer">
|
|
102
171
|
<w-button variant="primary" id="modal-close-button-two">OK</w-button>
|
|
103
172
|
</w-modal-footer>
|
|
104
173
|
</w-modal>
|
|
105
|
-
|
|
106
|
-
<script>
|
|
107
|
-
const openButtonTwo = document.querySelector('#modal-open-button-two');
|
|
108
|
-
const closeButtonTwo = document.querySelector('#modal-close-button-two');
|
|
109
|
-
const modalTwo = document.querySelector('#example-modal-two');
|
|
110
|
-
openButtonTwo.addEventListener('click', () => modalTwo.open());
|
|
111
|
-
closeButtonTwo.addEventListener('click', () => modalTwo.close());
|
|
112
|
-
</script>
|
|
113
174
|
`;
|
|
114
175
|
},
|
|
176
|
+
play: async ({ canvasElement }) => {
|
|
177
|
+
await Promise.all([
|
|
178
|
+
customElements.whenDefined("w-button"),
|
|
179
|
+
customElements.whenDefined("w-modal"),
|
|
180
|
+
customElements.whenDefined("w-modal-header"),
|
|
181
|
+
customElements.whenDefined("w-modal-footer"),
|
|
182
|
+
]);
|
|
183
|
+
const openButton = canvasElement.querySelector("#modal-open-button-two");
|
|
184
|
+
const closeButton = canvasElement.querySelector("#modal-close-button-two");
|
|
185
|
+
const modal = canvasElement.querySelector("#example-modal-two");
|
|
186
|
+
if (openButton && modal) {
|
|
187
|
+
openButton.addEventListener("click", () => modal.open());
|
|
188
|
+
}
|
|
189
|
+
if (closeButton && modal) {
|
|
190
|
+
closeButton.addEventListener("click", () => modal.close());
|
|
191
|
+
}
|
|
192
|
+
},
|
|
193
|
+
parameters: {
|
|
194
|
+
docs: {
|
|
195
|
+
story: {
|
|
196
|
+
autoplay: true,
|
|
197
|
+
},
|
|
198
|
+
},
|
|
199
|
+
},
|
|
115
200
|
};
|
|
116
201
|
export const Modal = {
|
|
117
202
|
render(args) {
|
|
118
203
|
return html `
|
|
119
|
-
<p>
|
|
204
|
+
<p>
|
|
205
|
+
This is here to document attributes. See the Default example for a
|
|
206
|
+
complete usage example.
|
|
207
|
+
</p>
|
|
120
208
|
<w-modal ${spread(prespread(args))}></w-modal>
|
|
121
209
|
`;
|
|
122
210
|
},
|
|
@@ -131,7 +219,10 @@ export const Modal = {
|
|
|
131
219
|
export const ModalHeader = {
|
|
132
220
|
render(args) {
|
|
133
221
|
return html `
|
|
134
|
-
<p>
|
|
222
|
+
<p>
|
|
223
|
+
This is here to document attributes. See the Default example for a
|
|
224
|
+
complete usage example.
|
|
225
|
+
</p>
|
|
135
226
|
<w-modal-header ${spread(prespread(args))}></w-modal-header>
|
|
136
227
|
`;
|
|
137
228
|
},
|
|
@@ -146,7 +237,10 @@ export const ModalHeader = {
|
|
|
146
237
|
export const ModalFooter = {
|
|
147
238
|
render(args) {
|
|
148
239
|
return html `
|
|
149
|
-
<p>
|
|
240
|
+
<p>
|
|
241
|
+
This is here to document attributes. See the Default example for a
|
|
242
|
+
complete usage example.
|
|
243
|
+
</p>
|
|
150
244
|
<w-modal-footer ${spread(prespread(args))}></w-modal-footer>
|
|
151
245
|
`;
|
|
152
246
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
var
|
|
2
|
-
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function ir(r){return ar.get(r)||r}var nr=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function fe(r,e=!1){return r.replace(nr,function(o,t,a,
|
|
1
|
+
var Xe=Object.create;var re=Object.defineProperty;var he=Object.getOwnPropertyDescriptor;var Ze=Object.getOwnPropertyNames;var Je=Object.getPrototypeOf,qe=Object.prototype.hasOwnProperty;var pe=r=>{throw TypeError(r)};var ue=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports);var Ge=(r,e,o,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of Ze(e))!qe.call(r,a)&&a!==o&&re(r,a,{get:()=>e[a],enumerable:!(t=he(e,a))||t.enumerable});return r};var Ke=(r,e,o)=>(o=r!=null?Xe(Je(r)):{},Ge(e||!r||!r.__esModule?re(o,"default",{value:r,enumerable:!0}):o,r));var _=(r,e,o,t)=>{for(var a=t>1?void 0:t?he(e,o):e,s=r.length-1,i;s>=0;s--)(i=r[s])&&(a=(t?i(e,o,a):i(a))||a);return t&&a&&re(e,o,a),a};var We=(r,e,o)=>e.has(r)||pe("Cannot "+o);var M=(r,e,o)=>(We(r,e,"read from private field"),o?o.call(r):e.get(r)),ge=(r,e,o)=>e.has(r)?pe("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(r):e.set(r,o);var ve=ue(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});P.errorMessages=P.ErrorType=void 0;var j;(function(r){r.MalformedUnicode="MALFORMED_UNICODE",r.MalformedHexadecimal="MALFORMED_HEXADECIMAL",r.CodePointLimit="CODE_POINT_LIMIT",r.OctalDeprecation="OCTAL_DEPRECATION",r.EndOfString="END_OF_STRING"})(j=P.ErrorType||(P.ErrorType={}));P.errorMessages=new Map([[j.MalformedUnicode,"malformed Unicode character escape sequence"],[j.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[j.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[j.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[j.EndOfString,"malformed escape sequence at end of string"]])});var we=ue(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});O.unraw=O.errorMessages=O.ErrorType=void 0;var f=ve();Object.defineProperty(O,"ErrorType",{enumerable:!0,get:function(){return f.ErrorType}});Object.defineProperty(O,"errorMessages",{enumerable:!0,get:function(){return f.errorMessages}});function Qe(r){return!r.match(/[^a-f0-9]/i)?parseInt(r,16):NaN}function Z(r,e,o){let t=Qe(r);if(Number.isNaN(t)||o!==void 0&&o!==r.length)throw new SyntaxError(f.errorMessages.get(e));return t}function er(r){let e=Z(r,f.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(e)}function me(r,e){let o=Z(r,f.ErrorType.MalformedUnicode,4);if(e!==void 0){let t=Z(e,f.ErrorType.MalformedUnicode,4);return String.fromCharCode(o,t)}return String.fromCharCode(o)}function rr(r){return r.charAt(0)==="{"&&r.charAt(r.length-1)==="}"}function or(r){if(!rr(r))throw new SyntaxError(f.errorMessages.get(f.ErrorType.MalformedUnicode));let e=r.slice(1,-1),o=Z(e,f.ErrorType.MalformedUnicode);try{return String.fromCodePoint(o)}catch(t){throw t instanceof RangeError?new SyntaxError(f.errorMessages.get(f.ErrorType.CodePointLimit)):t}}function tr(r,e=!1){if(e)throw new SyntaxError(f.errorMessages.get(f.ErrorType.OctalDeprecation));let o=parseInt(r,8);return String.fromCharCode(o)}var ar=new Map([["b","\b"],["f","\f"],["n",`
|
|
2
|
+
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function ir(r){return ar.get(r)||r}var nr=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function fe(r,e=!1){return r.replace(nr,function(o,t,a,s,i,n,c,h,v){if(t!==void 0)return"\\";if(a!==void 0)return er(a);if(s!==void 0)return or(s);if(i!==void 0)return me(i,n);if(c!==void 0)return me(c);if(h==="0")return"\0";if(h!==void 0)return tr(h,!e);if(v!==void 0)return ir(v);throw new SyntaxError(f.errorMessages.get(f.ErrorType.EndOfString))})}O.unraw=fe;O.default=fe});import{css as Sr,html as I,LitElement as Pr}from"lit";var X=function(){for(var r=[],e=arguments.length;e--;)r[e]=arguments[e];return r.reduce(function(o,t){return o.concat(typeof t=="string"?t:Array.isArray(t)?X.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var ye=Ke(we(),1);var $=r=>typeof r=="string",sr=r=>typeof r=="function",xe=new Map,_e="en";function ie(r){return[...Array.isArray(r)?r:[r],_e]}function ne(r,e,o){let t=ie(r);o||(o="default");let a;if(typeof o=="string")switch(a={day:"numeric",month:"short",year:"numeric"},o){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=o;return J(()=>q("date",t,o),()=>new Intl.DateTimeFormat(t,a)).format($(e)?new Date(e):e)}function lr(r,e,o){let t;if(o||(o="default"),typeof o=="string")switch(t={second:"numeric",minute:"numeric",hour:"numeric"},o){case"full":case"long":t.timeZoneName="short";break;case"short":delete t.second}else t=o;return ne(r,e,t)}function oe(r,e,o){let t=ie(r);return J(()=>q("number",t,o),()=>new Intl.NumberFormat(t,o)).format(e)}function ke(r,e,o,{offset:t=0,...a}){var n,c;let s=ie(r),i=e?J(()=>q("plural-ordinal",s),()=>new Intl.PluralRules(s,{type:"ordinal"})):J(()=>q("plural-cardinal",s),()=>new Intl.PluralRules(s,{type:"cardinal"}));return(c=(n=a[o])!=null?n:a[i.select(o-t)])!=null?c:a.other}function J(r,e){let o=r(),t=xe.get(o);return t||(t=e(),xe.set(o,t)),t}function q(r,e,o){let t=e.join("-");return`${r}-${t}-${JSON.stringify(o)}`}var Ce=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,ze="%__lingui_octothorpe__%",cr=(r,e,o={})=>{let t=e||r,a=i=>typeof i=="object"?i:o[i],s=(i,n)=>{let c=Object.keys(o).length?a("number"):void 0,h=oe(t,i,c);return n.replace(new RegExp(ze,"g"),h)};return{plural:(i,n)=>{let{offset:c=0}=n,h=ke(t,!1,i,n);return s(i-c,h)},selectordinal:(i,n)=>{let{offset:c=0}=n,h=ke(t,!0,i,n);return s(i-c,h)},select:dr,number:(i,n)=>oe(t,i,a(n)||{style:n}),date:(i,n)=>ne(t,i,a(n)||n),time:(i,n)=>lr(t,i,a(n)||n)}},dr=(r,e)=>{var o;return(o=e[r])!=null?o:e.other};function br(r,e,o){return(t={},a)=>{let s=cr(e,o,a),i=(c,h=!1)=>Array.isArray(c)?c.reduce((v,C)=>{if(C==="#"&&h)return v+ze;if($(C))return v+C;let[F,k,A]=C,T={};k==="plural"||k==="selectordinal"||k==="select"?Object.entries(A).forEach(([S,Y])=>{T[S]=i(Y,k==="plural"||k==="selectordinal")}):T=A;let x;if(k){let S=s[k];x=S(t[F],T)}else x=t[F];return x==null?v:v+x},""):c,n=i(r);return $(n)&&Ce.test(n)?(0,ye.unraw)(n):$(n)?n:n?String(n):""}}var hr=Object.defineProperty,pr=(r,e,o)=>e in r?hr(r,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):r[e]=o,ur=(r,e,o)=>(pr(r,typeof e!="symbol"?e+"":e,o),o),te=class{constructor(){ur(this,"_events",{})}on(e,o){var a;var t;return(a=(t=this._events)[e])!=null||(t[e]=[]),this._events[e].push(o),()=>this.removeListener(e,o)}removeListener(e,o){let t=this._getListeners(e);if(!t)return;let a=t.indexOf(o);~a&&t.splice(a,1)}emit(e,...o){let t=this._getListeners(e);t&&t.map(a=>a.apply(this,o))}_getListeners(e){let o=this._events[e];return Array.isArray(o)?o:!1}},gr=Object.defineProperty,vr=(r,e,o)=>e in r?gr(r,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):r[e]=o,D=(r,e,o)=>(vr(r,typeof e!="symbol"?e+"":e,o),o),ae=class extends te{constructor(e){var o;super(),D(this,"_locale",""),D(this,"_locales"),D(this,"_localeData",{}),D(this,"_messages",{}),D(this,"_missing"),D(this,"_messageCompiler"),D(this,"t",this._.bind(this)),e.missing!=null&&(this._missing=e.missing),e.messages!=null&&this.load(e.messages),e.localeData!=null&&this.loadLocaleData(e.localeData),(typeof e.locale=="string"||e.locales)&&this.activate((o=e.locale)!=null?o:_e,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){var e;return(e=this._messages[this._locale])!=null?e:{}}get localeData(){var e;return(e=this._localeData[this._locale])!=null?e:{}}_loadLocaleData(e,o){let t=this._localeData[e];t?Object.assign(t,o):this._localeData[e]=o}setMessagesCompiler(e){return this._messageCompiler=e,this}loadLocaleData(e,o){typeof e=="string"?this._loadLocaleData(e,o):Object.keys(e).forEach(t=>this._loadLocaleData(t,e[t])),this.emit("change")}_load(e,o){let t=this._messages[e];t?Object.assign(t,o):this._messages[e]=o}load(e,o){typeof e=="string"&&typeof o=="object"?this._load(e,o):Object.entries(e).forEach(([t,a])=>this._load(t,a)),this.emit("change")}loadAndActivate({locale:e,locales:o,messages:t}){this._locale=e,this._locales=o||void 0,this._messages[this._locale]=t,this.emit("change")}activate(e,o){this._locale=e,this._locales=o,this.emit("change")}_(e,o,t){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let a=t==null?void 0:t.message;e||(e=""),$(e)||(o=e.values||o,a=e.message,e=e.id);let s=this.messages[e],i=s===void 0,n=this._missing;if(n&&i)return sr(n)?n(this._locale,e):n;i&&this.emit("missing",{id:e,locale:this._locale});let c=s||a||e;return $(c)&&(this._messageCompiler?c=this._messageCompiler(c):console.warn(`Uncompiled message detected! Message:
|
|
3
3
|
|
|
4
4
|
> ${c}
|
|
5
5
|
|
|
@@ -7,7 +7,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
|
|
|
7
7
|
ICU features such as interpolation and plurals will not work properly for that message.
|
|
8
8
|
|
|
9
9
|
Please compile your catalog first.
|
|
10
|
-
`))
|
|
10
|
+
`)),$(c)&&Ce.test(c)?JSON.parse(`"${c}"`):$(c)?c:br(c,this._locale,this._locales)(o,t==null?void 0:t.formats)}date(e,o){return ne(this._locales||this._locale,e,o)}number(e,o){return oe(this._locales||this._locale,e,o)}};function mr(r={}){return new ae(r)}var E=mr();var b=function(r,e,o,t){if(o==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?r!==e||!t:!e.has(r))throw new TypeError("Cannot read private member from an object whose class did not declare it");return o==="m"?t:o==="a"?t.call(r):t?t.value:e.get(r)},u=function(r,e,o,t,a){if(t==="m")throw new TypeError("Private method is not writable");if(t==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?r!==e||!a:!e.has(r))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(r,o):a?a.value=o:e.set(r,o),o};function Me(r){var e,o,t,a,s,i,n,c,h,v,C,F,k,A,T,x,S,Y,W;class He extends r{constructor(...l){var d,p,g;super(...l),e.add(this),this.internals=this.attachInternals(),o.set(this,!1),t.set(this,!1),a.set(this,!1),s.set(this,void 0),i.set(this,void 0),n.set(this,!0),h.set(this,""),v.set(this,()=>{u(this,a,!0,"f"),u(this,o,!0,"f"),b(this,e,"m",x).call(this)}),C.set(this,()=>{u(this,o,!1,"f"),b(this,e,"m",S).call(this,this.shouldFormValueUpdate()?b(this,h,"f"):""),!this.validity.valid&&b(this,a,"f")&&u(this,t,!0,"f");let L=b(this,e,"m",x).call(this);this.validationMessageCallback&&this.validationMessageCallback(L?this.internals.validationMessage:"")}),F.set(this,()=>{var L;b(this,n,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),u(this,n,!1,"f")),u(this,a,!0,"f"),u(this,t,!0,"f"),b(this,e,"m",x).call(this),(L=this===null||this===void 0?void 0:this.validationMessageCallback)===null||L===void 0||L.call(this,this.showError?this.internals.validationMessage:"")}),k.set(this,void 0),A.set(this,!1),T.set(this,Promise.resolve()),(d=this.addEventListener)===null||d===void 0||d.call(this,"focus",b(this,v,"f")),(p=this.addEventListener)===null||p===void 0||p.call(this,"blur",b(this,C,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"invalid",b(this,F,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(g=>g.attribute).flat(),d=super.observedAttributes||[];return[...new Set([...d,...l])]}static getValidator(l){return this.validators.find(d=>d.attribute===l)||null}static getValidators(l){return this.validators.filter(d=>{var p;if(d.attribute===l||!((p=d.attribute)===null||p===void 0)&&p.includes(l))return!0})}get form(){return this.internals.form}get showError(){return b(this,e,"m",x).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,d,p){var g;(g=super.attributeChangedCallback)===null||g===void 0||g.call(this,l,d,p);let R=this.constructor.getValidators(l);R!=null&&R.length&&this.validationTarget&&this.setValue(b(this,h,"f"))}setValue(l){var d;u(this,t,!1,"f"),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,""),u(this,h,l,"f");let g=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(g),b(this,e,"m",S).call(this,g),this.valueChangedCallback&&this.valueChangedCallback(g),b(this,e,"m",x).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(b(this,T,"f")))}formResetCallback(){var l,d;u(this,a,!1,"f"),u(this,t,!1,"f"),b(this,e,"m",x).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,b(this,e,"m",x).call(this)?this.validationMessage:"")}}return o=new WeakMap,t=new WeakMap,a=new WeakMap,s=new WeakMap,i=new WeakMap,n=new WeakMap,h=new WeakMap,v=new WeakMap,C=new WeakMap,F=new WeakMap,k=new WeakMap,A=new WeakMap,T=new WeakMap,e=new WeakSet,c=function(){let l=this.getRootNode(),d=`${this.localName}[name="${this.getAttribute("name")}"]`;return l.querySelectorAll(d)},x=function(){if(this.hasAttribute("disabled"))return!1;let l=b(this,t,"f")||b(this,a,"f")&&!this.validity.valid&&!b(this,o,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},S=function(l){let d=this.constructor,p={},g=d.validators,L=[],R=g.some(y=>y.isValid instanceof Promise);b(this,A,"f")||(u(this,T,new Promise(y=>{u(this,k,y,"f")}),"f"),u(this,A,!0,"f")),b(this,s,"f")&&(b(this,s,"f").abort(),u(this,i,b(this,s,"f"),"f"));let B=new AbortController;u(this,s,B,"f");let H,be=!1;g.length&&(g.forEach(y=>{let Q=y.key||"customError",V=y.isValid(this,l,B.signal);V instanceof Promise?(L.push(V),V.then(ee=>{ee!=null&&(p[Q]=!ee,H=b(this,e,"m",W).call(this,y,l),b(this,e,"m",Y).call(this,p,H))})):(p[Q]=!V,this.validity[Q]!==!V&&(be=!0),!V&&!H&&(H=b(this,e,"m",W).call(this,y,l)))}),Promise.allSettled(L).then(()=>{var y;B!=null&&B.signal.aborted||(u(this,A,!1,"f"),(y=b(this,k,"f"))===null||y===void 0||y.call(this))}),(be||!R)&&b(this,e,"m",Y).call(this,p,H))},Y=function(l,d){if(this.validationTarget)this.internals.setValidity(l,d,this.validationTarget),u(this,n,!1,"f");else{if(this.internals.setValidity(l,d),this.internals.validity.valid)return;u(this,n,!0,"f")}},W=function(l,d){if(this.validityCallback){let p=this.validityCallback(l.key||"customError");if(p)return p}return l.message instanceof Function?l.message(this,d):l.message},He}import{property as z}from"lit/decorators.js";import{ifDefined as le}from"lit/directives/if-defined.js";import{when as ce}from"lit/directives/when.js";var fr=["en","nb","fi","da","sv"],Fe="en",Ee=r=>fr.find(e=>r===e||r.toLowerCase().includes(e))||Fe;function wr(){if(typeof window=="undefined"){let r=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return Ee(r)}try{let r=document.documentElement.lang;return Ee(r)}catch(r){return console.warn("could not detect locale, falling back to source locale",r),Fe}}var xr=(r,e,o,t,a,s)=>r==="nb"?o:r==="fi"?t:r==="da"?a:r==="sv"?s:e,Le=(r,e,o,t,a)=>{let s=wr(),i=xr(s,r,e,o,t,a);E.load(s,i),E.activate(s)};import{css as Oe}from"lit";var Ne=Oe`
|
|
11
11
|
*,
|
|
12
12
|
:before,
|
|
13
13
|
:after {
|
|
@@ -280,7 +280,7 @@ Please compile your catalog first.
|
|
|
280
280
|
svg {
|
|
281
281
|
pointer-events: none;
|
|
282
282
|
}
|
|
283
|
-
`,
|
|
283
|
+
`,Jr=Oe`*, :before, :after {
|
|
284
284
|
--w-rotate: 0;
|
|
285
285
|
--w-rotate-x: 0;
|
|
286
286
|
--w-rotate-y: 0;
|
|
@@ -2446,29 +2446,36 @@ Please compile your catalog first.
|
|
|
2446
2446
|
display: none
|
|
2447
2447
|
}
|
|
2448
2448
|
}
|
|
2449
|
-
`;var
|
|
2450
|
-
${ce(this.label,()=>
|
|
2449
|
+
`;var Ae=JSON.parse('{"select.label.optional":["(valgfrit)"]}');var Te=JSON.parse('{"select.label.optional":["(optional)"]}');var $e=JSON.parse('{"select.label.optional":["(vapaaehtoinen)"]}');var Se=JSON.parse('{"select.label.optional":["(valgfritt)"]}');var Pe=JSON.parse('{"select.label.optional":["(valfritt)"]}');import{css as kr}from"lit";var De=kr`*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.focus\\:\\[--w-outline-offset\\:-2px\\]:focus{--w-outline-offset:-2px}.bg-transparent{background-color:#0000}.appearance-none{-webkit-appearance:none;appearance:none}.border-0{border-width:0}.border-1{border-width:1px}.rounded-4{border-radius:4px}.caret-current{caret-color:currentColor}.opacity-25{opacity:.25}.block,.before\\:block:before{display:block}.before\\:hidden:before{display:none}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.outline-\\[--w-s-color-border-negative\\]\\!{outline-color:var(--w-s-color-border-negative)!important}.bottom-0{bottom:0}.right-0{right:0}.before\\:bottom-0:before{bottom:0}.before\\:right-0:before{right:0}.top-\\[30\\%\\]{top:30%}.absolute{position:absolute}.relative{position:relative}.static{position:static}.before\\:absolute:before{position:absolute}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled-subtle{background-color:var(--w-s-color-background-disabled-subtle)}.s-text{color:var(--w-s-color-text)}.s-text-disabled{color:var(--w-s-color-text-disabled)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-text-subtle{color:var(--w-s-color-text-subtle)}.s-icon{color:var(--w-s-color-icon)}.s-border-disabled{border-color:var(--w-s-color-border-disabled)}.s-border-negative{border-color:var(--w-s-color-border-negative)}.s-border-strong{border-color:var(--w-s-color-border-strong)}.hover\\:s-border-disabled:hover{border-color:var(--w-s-color-border-disabled)}.hover\\:s-border-negative-hover:hover{border-color:var(--w-s-color-border-negative-hover)}.hover\\:s-border-strong-hover:hover{border-color:var(--w-s-color-border-strong-hover)}.active\\:s-border-active:active{border-color:var(--w-s-color-border-active)}.active\\:s-border-disabled:active{border-color:var(--w-s-color-border-disabled)}.h-full{height:100%}.w-32{width:3.2rem}.w-full{width:100%}.before\\:h-full:before{height:100%}.before\\:w-32:before{width:3.2rem}.mb-0{margin-bottom:0}.mt-4{margin-top:.4rem}.py-12{padding-top:1.2rem;padding-bottom:1.2rem}.pb-4{padding-bottom:.4rem}.pl-0{padding-left:0}.pl-8{padding-left:.8rem}.pr-32{padding-right:3.2rem}.cursor-pointer{cursor:pointer}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.font-bold{font-weight:700}.font-normal{font-weight:400}.pointer-events-none,.before\\:pointer-events-none:before{pointer-events:none}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-s{font-size:var(--w-font-size-s);line-height:var(--w-line-height-s)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}`;import{LitElement as yr}from"lit";import{unsafeStatic as _r,html as Cr}from"lit/static-html.js";var zr=JSON.parse('{"icon.title.chevron-down":["Nedoverpil"]}'),Mr=JSON.parse('{"icon.title.chevron-down":["Downward arrow"]}'),Er=JSON.parse('{"icon.title.chevron-down":["Nuoli alasp\xE4in"]}'),Fr=JSON.parse('{"icon.title.chevron-down":["Pil nedad"]}'),Lr=JSON.parse('{"icon.title.chevron-down":["Pil ned"]}'),Ve=["en","nb","fi","da","sv"],je="en",Or=()=>{var r;let e;switch((r=process==null?void 0:process.env)==null?void 0:r.NMP_BRAND){case"FINN":e="nb";break;case"TORI":e="fi";break;case"BLOCKET":e="sv";break;case"DBA":e="da";break;default:e="en"}return e},Ie=()=>{var r;let e=(r=document==null?void 0:document.location)==null?void 0:r.hostname;return e!=null&&e.includes("finn")?"nb":e.includes("tori")?"fi":e.includes("blocket")?"sv":e.includes("dba")?"da":je},se=r=>Ve.find(e=>r===e||r.toLowerCase().includes(e))||Ie();function Nr(){var r;if(typeof window=="undefined"){let e=Or();return se(e)}try{let e=(r=document==null?void 0:document.documentElement)==null?void 0:r.lang,o=Ie();return Ve.includes(e)?se(e!=null?e:o):(console.warn("Unsupported locale set in html lang tag, falling back to detection by hostname"),se(o))}catch(e){return console.warn("could not detect locale, falling back to source locale",e),je}}var Ar=(r,e,o,t,a,s)=>r==="nb"?o:r==="fi"?t:r==="da"?a:r==="sv"?s:e,Tr=(r,e,o,t,a)=>{let s=Nr(),i=Ar(s,r,e,o,t,a);E.load(s,i),E.activate(s)};Tr(Mr,zr,Er,Fr,Lr);var $r=class extends yr{render(){let r=E.t({message:"Downward arrow",id:"icon.title.chevron-down",comment:"Title for chevron-down icon"});return Cr`<svg xmlns="http://www.w3.org/2000/svg"width="16"height="16"fill="none"viewBox="0 0 16 16" part="w-icon-chevron-down-16-part">${_r(`<title>${r}</title>`)}<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m2.667 5.333 5.5 5.5 5.5-5.5"></path></svg>`}};customElements.get("w-icon-chevron-down-16")||customElements.define("w-icon-chevron-down-16",$r);var N={base:"block text-m mb-0 py-12 pr-32 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] appearance-none cursor-pointer caret-current",default:"s-text s-bg pl-8 border-1 s-border-strong hover:s-border-strong-hover active:s-border-active",disabled:"s-text-disabled s-bg-disabled-subtle pl-8 border-1 s-border-disabled hover:s-border-disabled active:s-border-disabled pointer-events-none",invalid:"s-text s-bg pl-8 border-1 s-border-negative hover:s-border-negative-hover active:s-border-active outline-[--w-s-color-border-negative]!",readOnly:"s-text bg-transparent pl-0 border-0 pointer-events-none before:hidden",wrapper:"relative",selectWrapper:"relative before:block before:absolute before:right-0 before:bottom-0 before:w-32 before:h-full before:pointer-events-none ",chevron:"block absolute top-[30%] right-0 bottom-0 w-32 h-full s-icon pointer-events-none cursor-pointer",chevronDisabled:"opacity-25"},Ye={base:"antialiased block relative text-s font-bold pb-4 cursor-pointer s-text",optional:"pl-8 font-normal text-s s-text-subtle"},de={base:"text-xs mt-4 block",color:"s-text-subtle",colorInvalid:"s-text-negative"},m,Ue,Re,Be,G,K,w=class extends Me(Pr){constructor(){super();ge(this,m);this._setValue=o=>{this.value=o,this.setValue(o)};Le(Te,Se,$e,Ae,Pe)}connectedCallback(){super.connectedCallback(),this.autoFocus&&this.shadowRoot.querySelector("select").focus();let t=Array.from(this.children).filter(a=>a.tagName.toLowerCase()==="option"||a.tagName.toLowerCase()==="w-option").map(a=>{var h,v;let s=(h=a.getAttribute("value"))!=null?h:"",i=(v=a.textContent)!=null?v:"",n=a.hasAttribute("selected"),c=a.hasAttribute("disabled");return n&&this._setValue(s),I`<option value="${s}" ?selected=${n} ?disabled=${c}>${i}</option>`});this._options=t}handleKeyDown(o){this.readOnly&&(o.key===" "||o.key==="ArrowDown"||o.key==="ArrowUp")&&o.preventDefault()}onChange({target:o}){this._setValue(o.value);let t=new CustomEvent("change",{detail:o.value}),s=Array.from(this.children).filter(i=>i.tagName.toLowerCase()==="option"||i.tagName.toLowerCase()==="w-option").map(i=>{var C,F;let n=(C=i.getAttribute("value"))!=null?C:"",c=n===o.value,h=(F=i.textContent)!=null?F:"",v=i.hasAttribute("disabled");return I`<option value="${n}" ?selected=${c} ?disabled=${v}>${h}</option>`});this._options=s,this.dispatchEvent(t)}render(){return I`<div class="${N.wrapper}">
|
|
2450
|
+
${ce(this.label,()=>I`<label class="${Ye.base}" for="${M(this,m,G)}">
|
|
2451
2451
|
${this.label}
|
|
2452
|
-
${ce(this.optional,()=>
|
|
2453
|
-
>${
|
|
2452
|
+
${ce(this.optional,()=>I`<span class="${Ye.optional}"
|
|
2453
|
+
>${E._({id:"select.label.optional",message:"(optional)",comment:"Shown behind label when marked as optional"})}</span
|
|
2454
2454
|
>`)}</label
|
|
2455
2455
|
>`)}
|
|
2456
|
-
<div class="${
|
|
2456
|
+
<div class="${N.selectWrapper}">
|
|
2457
2457
|
<select
|
|
2458
|
-
class="${
|
|
2459
|
-
id="${
|
|
2458
|
+
class="${M(this,m,Ue)}"
|
|
2459
|
+
id="${M(this,m,G)}"
|
|
2460
2460
|
?disabled=${this.disabled}
|
|
2461
|
-
aria-describedby="${le(
|
|
2461
|
+
aria-describedby="${le(M(this,m,K))}"
|
|
2462
2462
|
aria-invalid="${le(this.invalid)}"
|
|
2463
|
-
aria-errormessage="${le(this.invalid&&
|
|
2463
|
+
aria-errormessage="${le(this.invalid&&M(this,m,K))}"
|
|
2464
2464
|
@keydown=${this.handleKeyDown}
|
|
2465
2465
|
@change=${this.onChange}>
|
|
2466
2466
|
${this._options}
|
|
2467
2467
|
</select>
|
|
2468
|
-
<div class="${
|
|
2468
|
+
<div class="${M(this,m,Be)}">
|
|
2469
2469
|
<w-icon-chevron-down-16></w-icon-chevron-down-16>
|
|
2470
2470
|
</div>
|
|
2471
2471
|
</div>
|
|
2472
|
-
${ce(this.always||this.invalid,()=>
|
|
2473
|
-
</div>`}};
|
|
2472
|
+
${ce(this.always||this.invalid,()=>I`<div id="${M(this,m,K)}" class="${M(this,m,Re)}">${this.hint}</div>`)}
|
|
2473
|
+
</div>`}};m=new WeakSet,Ue=function(){return X([N.base,!this.invalid&&!this.disabled&&!this.readOnly&&N.default,this.invalid&&N.invalid,this.disabled&&N.disabled,this.readOnly&&N.readOnly])},Re=function(){return X([de.base,this.invalid?de.colorInvalid:de.color])},Be=function(){return X([N.chevron,this.disabled&&N.chevronDisabled])},G=function(){return"select_id"},K=function(){return this.hint?`${M(this,m,G)}__hint`:void 0},w.styles=[Ne,De,Sr`
|
|
2474
|
+
/* if there is an option with an empty value and it is selected */
|
|
2475
|
+
select:has(option[value=""][selected]),
|
|
2476
|
+
/* if there is an option with an empty value, and no other options are selected */
|
|
2477
|
+
select:has(option[value=""]):not(:has(option[selected])) {
|
|
2478
|
+
color: var(--w-s-color-text-placeholder);
|
|
2479
|
+
}
|
|
2480
|
+
`],_([z({attribute:"auto-focus",type:Boolean,reflect:!0})],w.prototype,"autoFocus",2),_([z({type:Boolean,reflect:!0})],w.prototype,"invalid",2),_([z({type:Boolean,reflect:!0})],w.prototype,"always",2),_([z({reflect:!0})],w.prototype,"hint",2),_([z({reflect:!0})],w.prototype,"label",2),_([z({type:Boolean,reflect:!0})],w.prototype,"optional",2),_([z({type:Boolean,reflect:!0})],w.prototype,"disabled",2),_([z({attribute:"read-only",type:Boolean,reflect:!0})],w.prototype,"readOnly",2),_([z({attribute:!1,state:!0})],w.prototype,"_options",2),_([z({reflect:!0})],w.prototype,"name",2),_([z({reflect:!0})],w.prototype,"value",2);customElements.get("w-select")||customElements.define("w-select",w);export{w as WarpSelect,de as ccHelpText,Ye as ccLabel,N as ccSelect};
|
|
2474
2481
|
//# sourceMappingURL=index.js.map
|