@warp-ds/elements 2.8.2-next.5 → 2.9.0-next.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/custom-elements.json +79 -6
- package/dist/index.d.ts +28 -6
- package/dist/packages/attention/attention.js +506 -233
- package/dist/packages/attention/attention.js.map +4 -4
- package/dist/packages/button/button.d.ts +8 -17
- package/dist/packages/button/button.js +494 -221
- package/dist/packages/button/button.js.map +4 -4
- package/dist/packages/button/button.react.stories.d.ts +1 -1
- package/dist/packages/button/styles/w-button.styles.d.ts +1 -0
- package/dist/packages/button/styles/w-button.styles.js +282 -0
- package/dist/packages/combobox/combobox.hydration.test.js +57 -0
- package/dist/packages/combobox/combobox.js +25 -11
- package/dist/packages/combobox/combobox.js.map +2 -2
- package/dist/packages/datepicker/datepicker.js +8 -15
- package/dist/packages/datepicker/datepicker.js.map +2 -2
- package/dist/packages/datepicker/styles/w-datepicker.styles.js +3 -9
- package/dist/packages/link/link.js +197 -217
- package/dist/packages/link/link.js.map +4 -4
- package/dist/packages/link/link.test.js +0 -14
- package/dist/packages/link/styles/w-link.styles.js +213 -0
- package/dist/packages/slider/slider.js +18 -17
- package/dist/packages/slider/slider.js.map +3 -3
- package/dist/packages/slider/slider.react.stories.js +6 -2
- package/dist/packages/slider/slider.stories.js +18 -12
- package/dist/packages/slider-thumb/slider-thumb.js +12 -12
- package/dist/packages/slider-thumb/slider-thumb.js.map +2 -2
- package/dist/web-types.json +27 -11
- package/package.json +1 -1
- package/dist/packages/link/styles.js +0 -236
- /package/dist/packages/link/{styles.d.ts → styles/w-link.styles.d.ts} +0 -0
|
@@ -3,7 +3,7 @@ import React from 'react';
|
|
|
3
3
|
import { Button } from './react';
|
|
4
4
|
declare const _default: {
|
|
5
5
|
title: string;
|
|
6
|
-
render(args: Omit<React.HTMLAttributes<import("./button").WarpButton>, "value" | "form" | "small" | "name" | "rel" | "
|
|
6
|
+
render(args: Omit<React.HTMLAttributes<import("./button").WarpButton>, "value" | "form" | "small" | "name" | "rel" | "render" | "renderOptions" | "connectedCallback" | "disconnectedCallback" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "variant" | "quiet" | "href" | "disabled" | "target" | "fullWidth" | "type" | "iconOnly" | "loading" | "buttonClass" | "ariaValueTextLoading" | "updated" | "firstUpdated" | "_handleButtonClick" | "resetFormControl" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate"> & {} & Partial<Omit<import("./button").WarpButton, keyof HTMLElement>> & React.RefAttributes<import("./button").WarpButton>): React.JSX.Element;
|
|
7
7
|
component: import("@lit/react").ReactWebComponent<import("./button").WarpButton, {}>;
|
|
8
8
|
};
|
|
9
9
|
export default _default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const wButtonStyles: import("lit").CSSResult;
|
|
@@ -0,0 +1,282 @@
|
|
|
1
|
+
import { css } from "lit";
|
|
2
|
+
export const wButtonStyles = css `
|
|
3
|
+
:host {
|
|
4
|
+
/* Local scoped variables, given the default button (the secondary variant) as a default */
|
|
5
|
+
--_background: var(--background, var(--w-s-color-background));
|
|
6
|
+
--_background-hover: var(
|
|
7
|
+
--background-hover,
|
|
8
|
+
var(--w-s-color-background-hover)
|
|
9
|
+
);
|
|
10
|
+
--_background-active: var(
|
|
11
|
+
--background-active,
|
|
12
|
+
var(--w-s-color-background-active)
|
|
13
|
+
);
|
|
14
|
+
--_text-color: var(--color, var(--w-s-color-text-link));
|
|
15
|
+
--_text-color-hover: var(--color-hover, var(--w-s-color-text-link));
|
|
16
|
+
--_text-color-active: var(--color-active, var(--w-s-color-text-link));
|
|
17
|
+
--_border-width: var(--border-width, 2px);
|
|
18
|
+
--_border: var(--border, var(--w-s-color-border));
|
|
19
|
+
--_border-hover: var(--border-hover, var(--w-s-color-border-hover));
|
|
20
|
+
--_border-active: var(--border-active, var(--w-s-color-border-active));
|
|
21
|
+
--_border-radius: var(--border-radius, var(--w-button-radius-default, 8px));
|
|
22
|
+
--_font-size: var(--font-size, var(--w-font-size-m));
|
|
23
|
+
--_line-height: var(--line-height, var(--w-line-height-m));
|
|
24
|
+
--_font-weight: var(--font-weight, bold);
|
|
25
|
+
--_padding-x: var(--padding-x, 16px);
|
|
26
|
+
--_padding-y: var(--padding-y, 13px);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
button {
|
|
30
|
+
/* Base setup for all buttons */
|
|
31
|
+
display: inline-flex;
|
|
32
|
+
justify-content: center;
|
|
33
|
+
align-items: center;
|
|
34
|
+
text-align: center;
|
|
35
|
+
cursor: pointer;
|
|
36
|
+
transition:
|
|
37
|
+
color 150ms cubic-bezier(0.4, 0, 0.2, 1),
|
|
38
|
+
background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
|
|
39
|
+
border-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
|
|
40
|
+
fill 150ms cubic-bezier(0.4, 0, 0.2, 1),
|
|
41
|
+
stroke 150ms cubic-bezier(0.4, 0, 0.2, 1);
|
|
42
|
+
|
|
43
|
+
/* Hook the local vars up to the button stuff */
|
|
44
|
+
background-color: var(--_background);
|
|
45
|
+
color: var(--_text-color);
|
|
46
|
+
border: var(--_border-width) solid var(--_border);
|
|
47
|
+
border-radius: var(--_border-radius);
|
|
48
|
+
padding: calc(var(--_padding-y) - var(--_border-width))
|
|
49
|
+
calc(var(--_padding-x) - var(--_border-width));
|
|
50
|
+
font-size: var(--_font-size);
|
|
51
|
+
line-height: var(--_line-height);
|
|
52
|
+
font-weight: var(--_font-weight);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
button:hover {
|
|
56
|
+
background-color: var(--_background-hover);
|
|
57
|
+
border-color: var(--_border-hover);
|
|
58
|
+
color: var(--_text-color-hover);
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
button:active {
|
|
62
|
+
background-color: var(--_background-active);
|
|
63
|
+
border-color: var(--_border-active);
|
|
64
|
+
color: var(--_text-color-active);
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
button:focus-visible {
|
|
68
|
+
outline: 2px solid var(--w-s-color-border-focus);
|
|
69
|
+
outline-offset: var(--w-outline-offset, 1px);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
/* Variants config */
|
|
73
|
+
:host([variant="primary"]) {
|
|
74
|
+
--background: var(--w-s-color-background-primary);
|
|
75
|
+
--background-hover: var(--w-s-color-background-primary-hover);
|
|
76
|
+
--background-active: var(--w-s-color-background-primary-active);
|
|
77
|
+
--color: var(--w-s-color-text-inverted);
|
|
78
|
+
--color-hover: var(--w-s-color-text-inverted);
|
|
79
|
+
--color-active: var(--w-s-color-text-inverted);
|
|
80
|
+
--border-width: 0px;
|
|
81
|
+
}
|
|
82
|
+
:host([variant="quiet"]),
|
|
83
|
+
:host([quiet]) /* deprecated, backwards compatibility, use variant="quiet" */ {
|
|
84
|
+
--background: transparent;
|
|
85
|
+
--color: var(--w-s-color-text-link);
|
|
86
|
+
--color-hover: var(--w-s-color-text-link-hover);
|
|
87
|
+
--color-active: var(--w-s-color-text-link-active);
|
|
88
|
+
--border-width: 0px;
|
|
89
|
+
}
|
|
90
|
+
:host([variant="negative"]) {
|
|
91
|
+
--background: var(--w-s-color-background-negative);
|
|
92
|
+
--background-hover: var(--w-s-color-background-negative-hover);
|
|
93
|
+
--background-active: var(--w-s-color-background-negative-active);
|
|
94
|
+
--color: var(--w-s-color-text-inverted);
|
|
95
|
+
--color-hover: var(--w-s-color-text-inverted);
|
|
96
|
+
--color-active: var(--w-s-color-text-inverted);
|
|
97
|
+
--border-width: 0px;
|
|
98
|
+
}
|
|
99
|
+
:host([variant="negativeQuiet"]),
|
|
100
|
+
:host([quiet][variant="negative"]) /* deprecated, backwards compatibility */ {
|
|
101
|
+
--background: transparent;
|
|
102
|
+
--background-hover: var(--w-s-color-background-negative-subtle-hover);
|
|
103
|
+
--background-active: var(--w-s-color-background-negative-subtle-active);
|
|
104
|
+
--color: var(--w-s-color-text-negative);
|
|
105
|
+
--color-hover: var(--w-s-color-text-negative);
|
|
106
|
+
--color-active: var(--w-s-color-text-negative);
|
|
107
|
+
--border-width: 0px;
|
|
108
|
+
}
|
|
109
|
+
:host([variant="utility"]) {
|
|
110
|
+
--background: var(--w-s-color-background);
|
|
111
|
+
--background-hover: var(--w-s-color-background-hover);
|
|
112
|
+
--background-active: var(--w-s-color-background-active);
|
|
113
|
+
--color: var(--w-s-color-text);
|
|
114
|
+
--color-hover: var(--w-s-color-text);
|
|
115
|
+
--color-active: var(--w-s-color-text);
|
|
116
|
+
--border-radius: var(--w-button-radius-utility, 4px);
|
|
117
|
+
--border-width: 1px;
|
|
118
|
+
}
|
|
119
|
+
:host([variant="utilityQuiet"]),
|
|
120
|
+
:host([quiet][variant="utility"]) /* deprecated, backwards compatibility */ {
|
|
121
|
+
--background: transparent;
|
|
122
|
+
--color: var(--w-s-color-text);
|
|
123
|
+
--color-hover: var(--w-s-color-text);
|
|
124
|
+
--color-active: var(--w-s-color-text);
|
|
125
|
+
--border-width: 0px;
|
|
126
|
+
}
|
|
127
|
+
:host([variant="overlay"]) {
|
|
128
|
+
--background: var(--w-color-background);
|
|
129
|
+
--background-hover: var(--w-color-background-hover);
|
|
130
|
+
--background-active: var(--w-color-background-active);
|
|
131
|
+
--color: var(--w-s-color-text);
|
|
132
|
+
--color-hover: var(--w-s-color-text);
|
|
133
|
+
--color-active: var(--w-s-color-text);
|
|
134
|
+
--border-radius: 9999px;
|
|
135
|
+
--border-width: 0px;
|
|
136
|
+
}
|
|
137
|
+
:host([variant="overlayQuiet"]),
|
|
138
|
+
:host([quiet][variant="overlay"]) /* deprecated, backwards compatibility */ {
|
|
139
|
+
--background: transparent;
|
|
140
|
+
--background-hover: var(--w-s-color-background-hover);
|
|
141
|
+
--background-active: var(--w-s-color-background-active);
|
|
142
|
+
--color: var(--w-s-color-text);
|
|
143
|
+
--color-hover: var(--w-s-color-text);
|
|
144
|
+
--color-active: var(--w-s-color-text);
|
|
145
|
+
--border-radius: 9999px;
|
|
146
|
+
--border-width: 0px;
|
|
147
|
+
}
|
|
148
|
+
:host([variant="overlayInverted"]) {
|
|
149
|
+
--background: var(--w-s-color-background-inverted);
|
|
150
|
+
--background-hover: var(--w-s-color-background-inverted-hover);
|
|
151
|
+
--background-active: var(--w-s-color-background-inverted-active);
|
|
152
|
+
--color: var(--w-s-color-text-inverted);
|
|
153
|
+
--color-hover: var(--w-s-color-text-inverted);
|
|
154
|
+
--color-active: var(--w-s-color-text-inverted);
|
|
155
|
+
--border-radius: 9999px;
|
|
156
|
+
--border-width: 0px;
|
|
157
|
+
}
|
|
158
|
+
:host([variant="overlayInvertedQuiet"]),
|
|
159
|
+
:host([quiet][variant="overlayInverted"]) /* deprecated, backwards compatibility */ {
|
|
160
|
+
--background: transparent;
|
|
161
|
+
--background-hover: var(--w-s-color-background-inverted-hover);
|
|
162
|
+
--background-active: var(--w-s-color-background-inverted-active);
|
|
163
|
+
--color: var(--w-s-color-text-inverted);
|
|
164
|
+
--color-hover: var(--w-s-color-text-inverted);
|
|
165
|
+
--color-active: var(--w-s-color-text-inverted);
|
|
166
|
+
--border-radius: 9999px;
|
|
167
|
+
--border-width: 0px;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
:host([variant="link"]) {
|
|
171
|
+
--background: none;
|
|
172
|
+
--background-hover: none;
|
|
173
|
+
--background-active: none;
|
|
174
|
+
--border-width: 0px;
|
|
175
|
+
--font-weight: normal;
|
|
176
|
+
display: inline;
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
:host([variant="pill"]) {
|
|
180
|
+
--background: transparent;
|
|
181
|
+
--background-hover: var(--w-color-button-pill-background-hover); /** TODO: this should use a semantic token */
|
|
182
|
+
--background-active: var(--w-color-button-pill-background-active); /** TODO: this should use a semantic token */
|
|
183
|
+
--border-radius: 50%;
|
|
184
|
+
--border-width: 0px;
|
|
185
|
+
--color: var(--w-s-color-icon);
|
|
186
|
+
--color-hover: var(--w-s-color-icon-hover);
|
|
187
|
+
--color-active: var(--w-s-color-icon-active);
|
|
188
|
+
--padding-x: 14px; /* get a total height and width of 44px, matching atomic CSS variant */
|
|
189
|
+
--padding-y: 14px;
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
/* States config, selects --loading as well since loading is always supposed to be disabled */
|
|
193
|
+
:host(:disabled),
|
|
194
|
+
:host([disabled]) {
|
|
195
|
+
--background: var(--w-s-color-background-disabled);
|
|
196
|
+
--background-hover: var(--w-s-color-background-disabled);
|
|
197
|
+
--background-active: var(--w-s-color-background-disabled);
|
|
198
|
+
--color: var(--w-s-color-text-inverted);
|
|
199
|
+
--color-hover: var(--w-s-color-text-inverted);
|
|
200
|
+
--color-active: var(--w-s-color-text-inverted);
|
|
201
|
+
--border-width: 0px;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
:host(:disabled) button,
|
|
205
|
+
:host([disabled]) button {
|
|
206
|
+
cursor: not-allowed;
|
|
207
|
+
pointer-events: none;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
:host([loading]) {
|
|
211
|
+
--background: var(--w-s-color-background-subtle);
|
|
212
|
+
--background-hover: var(--w-s-color-background-subtle);
|
|
213
|
+
--background-active: var(--w-s-color-background-subtle);
|
|
214
|
+
--color: var(--w-s-color-text);
|
|
215
|
+
--color-hover: var(--w-s-color-text);
|
|
216
|
+
--color-active: var(--w-s-color-text);
|
|
217
|
+
--border-width: 0px;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
:host([loading]) button {
|
|
221
|
+
cursor: wait;
|
|
222
|
+
pointer-events: none;
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
:host([variant="link"]):hover {
|
|
226
|
+
text-decoration: underline;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
/* Sizes config */
|
|
230
|
+
:host([small]) {
|
|
231
|
+
--padding-x: 12px;
|
|
232
|
+
--padding-y: 8px;
|
|
233
|
+
--font-size: var(--w-font-size-xs);
|
|
234
|
+
--line-height: var(--w-line-height-xs);
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
:host([small][variant="pill"]) {
|
|
238
|
+
--padding-x: 8px; /* get a total height and width of 32px, matching atomic CSS variant */
|
|
239
|
+
--padding-y: 8px;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
/* Width config */
|
|
243
|
+
:host([full-width]) button {
|
|
244
|
+
width: 100%;
|
|
245
|
+
max-width: 100%;
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
:host([has-icon-only]) {
|
|
249
|
+
--_padding-x: var(--_padding-y);
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
:host([has-icon-only]) button {
|
|
253
|
+
width: auto;
|
|
254
|
+
max-width: none;
|
|
255
|
+
aspect-ratio: 1 / 1;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
/* Copy of loading animation from warp */
|
|
259
|
+
:host([loading]) button {
|
|
260
|
+
background-image: linear-gradient(
|
|
261
|
+
135deg,
|
|
262
|
+
rgba(0, 0, 0, 0.05) 25%,
|
|
263
|
+
transparent 25%,
|
|
264
|
+
transparent 50%,
|
|
265
|
+
rgba(0, 0, 0, 0.05) 50%,
|
|
266
|
+
rgba(0, 0, 0, 0.05) 75%,
|
|
267
|
+
transparent 75%,
|
|
268
|
+
transparent
|
|
269
|
+
);
|
|
270
|
+
background-size: 30px 30px;
|
|
271
|
+
animation: animate-inprogress 3s linear infinite;
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
@keyframes animate-inprogress {
|
|
275
|
+
0% {
|
|
276
|
+
background-position: 0 0;
|
|
277
|
+
}
|
|
278
|
+
100% {
|
|
279
|
+
background-position: 60px 0;
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
`;
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { describe, expect, test, beforeEach, afterEach } from 'vitest';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { hydrateRoot } from 'react-dom/client';
|
|
2
4
|
import { setupHydrationWarningCapture, testHydration } from '../../tests/react-hydration';
|
|
3
5
|
import './combobox.js';
|
|
4
6
|
describe('w-combobox React SSR hydration', () => {
|
|
@@ -40,4 +42,59 @@ describe('w-combobox React SSR hydration', () => {
|
|
|
40
42
|
});
|
|
41
43
|
expect(warnings).toEqual([]);
|
|
42
44
|
});
|
|
45
|
+
test('options array prop hydrates without runtime errors', async () => {
|
|
46
|
+
const unhandledRejections = [];
|
|
47
|
+
const onUnhandledRejection = (event) => {
|
|
48
|
+
unhandledRejections.push(String(event.reason));
|
|
49
|
+
event.preventDefault();
|
|
50
|
+
};
|
|
51
|
+
window.addEventListener('unhandledrejection', onUnhandledRejection);
|
|
52
|
+
try {
|
|
53
|
+
await testHydration('w-combobox', {
|
|
54
|
+
options: [
|
|
55
|
+
{ value: 'apple', label: 'Apple' },
|
|
56
|
+
{ value: 'banana', label: 'Banana' },
|
|
57
|
+
],
|
|
58
|
+
});
|
|
59
|
+
expect(unhandledRejections).toEqual([]);
|
|
60
|
+
}
|
|
61
|
+
finally {
|
|
62
|
+
window.removeEventListener('unhandledrejection', onUnhandledRejection);
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
test('dangerouslySetInnerHTML wrapper hydrates without attribute mismatch warnings', async () => {
|
|
66
|
+
const container = document.createElement('div');
|
|
67
|
+
container.id = 'hydration-innerhtml-root';
|
|
68
|
+
document.body.appendChild(container);
|
|
69
|
+
const innerHtml = '<w-combobox id="demo-combobox" placeholder="Search"></w-combobox>';
|
|
70
|
+
try {
|
|
71
|
+
container.innerHTML = `<section class="example">${innerHtml}</section>`;
|
|
72
|
+
// Give the custom element a tick to upgrade and reflect defaults
|
|
73
|
+
// before React hydrates the tree.
|
|
74
|
+
await new Promise((resolve) => setTimeout(resolve, 50));
|
|
75
|
+
function App() {
|
|
76
|
+
return React.createElement('section', {
|
|
77
|
+
className: 'example',
|
|
78
|
+
// biome-ignore lint/security/noDangerouslySetInnerHtml: test reproduces React hydration mismatch path
|
|
79
|
+
dangerouslySetInnerHTML: { __html: innerHtml },
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
hydrateRoot(container, React.createElement(App), {
|
|
83
|
+
onRecoverableError: (error) => {
|
|
84
|
+
const msg = error instanceof Error ? error.message : String(error);
|
|
85
|
+
if (msg.includes('Hydration') ||
|
|
86
|
+
msg.includes('hydrat') ||
|
|
87
|
+
msg.includes('did not match') ||
|
|
88
|
+
msg.includes("didn't match")) {
|
|
89
|
+
window.__HYDRATION_WARNINGS__.push(msg);
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
});
|
|
93
|
+
await new Promise((resolve) => setTimeout(resolve, 200));
|
|
94
|
+
expect(window.__HYDRATION_WARNINGS__).toEqual([]);
|
|
95
|
+
}
|
|
96
|
+
finally {
|
|
97
|
+
document.body.removeChild(container);
|
|
98
|
+
}
|
|
99
|
+
});
|
|
43
100
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var je=Object.create;var Q=Object.defineProperty;var le=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var Ye=Object.getPrototypeOf,Be=Object.prototype.hasOwnProperty;var ce=o=>{throw TypeError(o)};var de=(o,r)=>()=>(r||o((r={exports:{}}).exports,r),r.exports);var qe=(o,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let a of Ue(r))!Be.call(o,a)&&a!==e&&Q(o,a,{get:()=>r[a],enumerable:!(t=le(r,a))||t.enumerable});return o};var He=(o,r,e)=>(e=o!=null?je(Ye(o)):{},qe(r||!o||!o.__esModule?Q(e,"default",{value:o,enumerable:!0}):e,o));var p=(o,r,e,t)=>{for(var a=t>1?void 0:t?le(r,e):r,i=o.length-1,s;i>=0;i--)(s=o[i])&&(a=(t?s(r,e,a):s(a))||a);return t&&a&&Q(r,e,a),a};var ue=(o,r,e)=>r.has(o)||ce("Cannot "+e);var he=(o,r,e)=>(ue(o,r,"read from private field"),e?e.call(o):r.get(o)),pe=(o,r,e)=>r.has(o)?ce("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(o):r.set(o,e),ge=(o,r,e,t)=>(ue(o,r,"write to private field"),t?t.call(o,e):r.set(o,e),e);var be=de(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});L.errorMessages=L.ErrorType=void 0;var
|
|
1
|
+
var je=Object.create;var Q=Object.defineProperty;var le=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var Ye=Object.getPrototypeOf,Be=Object.prototype.hasOwnProperty;var ce=o=>{throw TypeError(o)};var de=(o,r)=>()=>(r||o((r={exports:{}}).exports,r),r.exports);var qe=(o,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let a of Ue(r))!Be.call(o,a)&&a!==e&&Q(o,a,{get:()=>r[a],enumerable:!(t=le(r,a))||t.enumerable});return o};var He=(o,r,e)=>(e=o!=null?je(Ye(o)):{},qe(r||!o||!o.__esModule?Q(e,"default",{value:o,enumerable:!0}):e,o));var p=(o,r,e,t)=>{for(var a=t>1?void 0:t?le(r,e):r,i=o.length-1,s;i>=0;i--)(s=o[i])&&(a=(t?s(r,e,a):s(a))||a);return t&&a&&Q(r,e,a),a};var ue=(o,r,e)=>r.has(o)||ce("Cannot "+e);var he=(o,r,e)=>(ue(o,r,"read from private field"),e?e.call(o):r.get(o)),pe=(o,r,e)=>r.has(o)?ce("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(o):r.set(o,e),ge=(o,r,e,t)=>(ue(o,r,"write to private field"),t?t.call(o,e):r.set(o,e),e);var be=de(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});L.errorMessages=L.ErrorType=void 0;var $;(function(o){o.MalformedUnicode="MALFORMED_UNICODE",o.MalformedHexadecimal="MALFORMED_HEXADECIMAL",o.CodePointLimit="CODE_POINT_LIMIT",o.OctalDeprecation="OCTAL_DEPRECATION",o.EndOfString="END_OF_STRING"})($=L.ErrorType||(L.ErrorType={}));L.errorMessages=new Map([[$.MalformedUnicode,"malformed Unicode character escape sequence"],[$.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[$.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[$.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[$.EndOfString,"malformed escape sequence at end of string"]])});var fe=de(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});M.unraw=M.errorMessages=M.ErrorType=void 0;var f=be();Object.defineProperty(M,"ErrorType",{enumerable:!0,get:function(){return f.ErrorType}});Object.defineProperty(M,"errorMessages",{enumerable:!0,get:function(){return f.errorMessages}});function Xe(o){return!o.match(/[^a-f0-9]/i)?parseInt(o,16):NaN}function H(o,r,e){let t=Xe(o);if(Number.isNaN(t)||e!==void 0&&e!==o.length)throw new SyntaxError(f.errorMessages.get(r));return t}function Ze(o){let r=H(o,f.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(r)}function ve(o,r){let e=H(o,f.ErrorType.MalformedUnicode,4);if(r!==void 0){let t=H(r,f.ErrorType.MalformedUnicode,4);return String.fromCharCode(e,t)}return String.fromCharCode(e)}function Ke(o){return o.charAt(0)==="{"&&o.charAt(o.length-1)==="}"}function Ge(o){if(!Ke(o))throw new SyntaxError(f.errorMessages.get(f.ErrorType.MalformedUnicode));let r=o.slice(1,-1),e=H(r,f.ErrorType.MalformedUnicode);try{return String.fromCodePoint(e)}catch(t){throw t instanceof RangeError?new SyntaxError(f.errorMessages.get(f.ErrorType.CodePointLimit)):t}}function Je(o,r=!1){if(r)throw new SyntaxError(f.errorMessages.get(f.ErrorType.OctalDeprecation));let e=parseInt(o,8);return String.fromCharCode(e)}var We=new Map([["b","\b"],["f","\f"],["n",`
|
|
2
2
|
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function Qe(o){return We.get(o)||o}var er=/\\(?:(\\)|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 me(o,r=!1){return o.replace(er,function(e,t,a,i,s,n,c,v,O){if(t!==void 0)return"\\";if(a!==void 0)return Ze(a);if(i!==void 0)return Ge(i);if(s!==void 0)return ve(s,n);if(c!==void 0)return ve(c);if(v==="0")return"\0";if(v!==void 0)return Je(v,!r);if(O!==void 0)return Qe(O);throw new SyntaxError(f.errorMessages.get(f.ErrorType.EndOfString))})}M.unraw=me;M.default=me});var Y=function(){for(var o=[],r=arguments.length;r--;)o[r]=arguments[r];return o.reduce(function(e,t){return e.concat(typeof t=="string"?t:Array.isArray(t)?Y.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var ke=He(fe(),1);var F=o=>typeof o=="string",rr=o=>typeof o=="function",we=new Map,ye="en";function oe(o){return[...Array.isArray(o)?o:[o],ye]}function ae(o,r,e){let t=oe(o);e||(e="default");let a;if(typeof e=="string")switch(a={day:"numeric",month:"short",year:"numeric"},e){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=e;return X(()=>Z("date",t,e),()=>new Intl.DateTimeFormat(t,a)).format(F(r)?new Date(r):r)}function tr(o,r,e){let t;if(e||(e="default"),typeof e=="string")switch(t={second:"numeric",minute:"numeric",hour:"numeric"},e){case"full":case"long":t.timeZoneName="short";break;case"short":delete t.second}else t=e;return ae(o,r,t)}function ee(o,r,e){let t=oe(o);return X(()=>Z("number",t,e),()=>new Intl.NumberFormat(t,e)).format(r)}function xe(o,r,e,{offset:t=0,...a}){var n,c;let i=oe(o),s=r?X(()=>Z("plural-ordinal",i),()=>new Intl.PluralRules(i,{type:"ordinal"})):X(()=>Z("plural-cardinal",i),()=>new Intl.PluralRules(i,{type:"cardinal"}));return(c=(n=a[e])!=null?n:a[s.select(e-t)])!=null?c:a.other}function X(o,r){let e=o(),t=we.get(e);return t||(t=r(),we.set(e,t)),t}function Z(o,r,e){let t=r.join("-");return`${o}-${t}-${JSON.stringify(e)}`}var _e=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,Oe="%__lingui_octothorpe__%",or=(o,r,e={})=>{let t=r||o,a=s=>typeof s=="object"?s:e[s],i=(s,n)=>{let c=Object.keys(e).length?a("number"):void 0,v=ee(t,s,c);return n.replace(new RegExp(Oe,"g"),v)};return{plural:(s,n)=>{let{offset:c=0}=n,v=xe(t,!1,s,n);return i(s-c,v)},selectordinal:(s,n)=>{let{offset:c=0}=n,v=xe(t,!0,s,n);return i(s-c,v)},select:ar,number:(s,n)=>ee(t,s,a(n)||{style:n}),date:(s,n)=>ae(t,s,a(n)||n),time:(s,n)=>tr(t,s,a(n)||n)}},ar=(o,r)=>{var e;return(e=r[o])!=null?e:r.other};function ir(o,r,e){return(t={},a)=>{let i=or(r,e,a),s=(c,v=!1)=>Array.isArray(c)?c.reduce((O,E)=>{if(E==="#"&&v)return O+Oe;if(F(E))return O+E;let[T,k,z]=E,S={};k==="plural"||k==="selectordinal"||k==="select"?Object.entries(z).forEach(([I,N])=>{S[I]=s(N,k==="plural"||k==="selectordinal")}):S=z;let x;if(k){let I=i[k];x=I(t[T],S)}else x=t[T];return x==null?O:O+x},""):c,n=s(o);return F(n)&&_e.test(n)?(0,ke.unraw)(n):F(n)?n:n?String(n):""}}var nr=Object.defineProperty,sr=(o,r,e)=>r in o?nr(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,lr=(o,r,e)=>(sr(o,typeof r!="symbol"?r+"":r,e),e),re=class{constructor(){lr(this,"_events",{})}on(r,e){var a;var t;return(a=(t=this._events)[r])!=null||(t[r]=[]),this._events[r].push(e),()=>this.removeListener(r,e)}removeListener(r,e){let t=this._getListeners(r);if(!t)return;let a=t.indexOf(e);~a&&t.splice(a,1)}emit(r,...e){let t=this._getListeners(r);t&&t.map(a=>a.apply(this,e))}_getListeners(r){let e=this._events[r];return Array.isArray(e)?e:!1}},cr=Object.defineProperty,dr=(o,r,e)=>r in o?cr(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,V=(o,r,e)=>(dr(o,typeof r!="symbol"?r+"":r,e),e),te=class extends re{constructor(r){var e;super(),V(this,"_locale",""),V(this,"_locales"),V(this,"_localeData",{}),V(this,"_messages",{}),V(this,"_missing"),V(this,"_messageCompiler"),V(this,"t",this._.bind(this)),r.missing!=null&&(this._missing=r.missing),r.messages!=null&&this.load(r.messages),r.localeData!=null&&this.loadLocaleData(r.localeData),(typeof r.locale=="string"||r.locales)&&this.activate((e=r.locale)!=null?e:ye,r.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){var r;return(r=this._messages[this._locale])!=null?r:{}}get localeData(){var r;return(r=this._localeData[this._locale])!=null?r:{}}_loadLocaleData(r,e){let t=this._localeData[r];t?Object.assign(t,e):this._localeData[r]=e}setMessagesCompiler(r){return this._messageCompiler=r,this}loadLocaleData(r,e){typeof r=="string"?this._loadLocaleData(r,e):Object.keys(r).forEach(t=>this._loadLocaleData(t,r[t])),this.emit("change")}_load(r,e){let t=this._messages[r];t?Object.assign(t,e):this._messages[r]=e}load(r,e){typeof r=="string"&&typeof e=="object"?this._load(r,e):Object.entries(r).forEach(([t,a])=>this._load(t,a)),this.emit("change")}loadAndActivate({locale:r,locales:e,messages:t}){this._locale=r,this._locales=e||void 0,this._messages[this._locale]=t,this.emit("change")}activate(r,e){this._locale=r,this._locales=e,this.emit("change")}_(r,e,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;r||(r=""),F(r)||(e=r.values||e,a=r.message,r=r.id);let i=this.messages[r],s=i===void 0,n=this._missing;if(n&&s)return rr(n)?n(this._locale,r):n;s&&this.emit("missing",{id:r,locale:this._locale});let c=i||a||r;return F(c)&&(this._messageCompiler?c=this._messageCompiler(c):console.warn(`Uncompiled message detected! Message:
|
|
3
3
|
|
|
4
4
|
> ${c}
|
|
@@ -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
|
-
`)),F(c)&&_e.test(c)?JSON.parse(`"${c}"`):F(c)?c:ir(c,this._locale,this._locales)(e,t==null?void 0:t.formats)}date(r,e){return ae(this._locales||this._locale,r,e)}number(r,e){return ee(this._locales||this._locale,r,e)}};function ur(o={}){return new te(o)}var _=ur();var u=function(o,r,e,t){if(e==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?o!==r||!t:!r.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?t:e==="a"?t.call(o):t?t.value:r.get(o)},b=function(o,r,e,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 r=="function"?o!==r||!a:!r.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,e):a?a.value=e:r.set(o,e),e};function Ce(o){var r,e,t,a,i,s,n,c,v,O,E,T,k,z,S,x,I,N,G;class Re extends o{constructor(...l){var d,g,m;super(...l),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),t.set(this,!1),a.set(this,!1),i.set(this,void 0),s.set(this,void 0),n.set(this,!0),v.set(this,""),O.set(this,()=>{b(this,a,!0,"f"),b(this,e,!0,"f"),u(this,r,"m",x).call(this)}),E.set(this,()=>{b(this,e,!1,"f"),u(this,r,"m",I).call(this,this.shouldFormValueUpdate()?u(this,v,"f"):""),!this.validity.valid&&u(this,a,"f")&&b(this,t,!0,"f");let C=u(this,r,"m",x).call(this);this.validationMessageCallback&&this.validationMessageCallback(C?this.internals.validationMessage:"")}),T.set(this,()=>{var C;u(this,n,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),b(this,n,!1,"f")),b(this,a,!0,"f"),b(this,t,!0,"f"),u(this,r,"m",x).call(this),(C=this===null||this===void 0?void 0:this.validationMessageCallback)===null||C===void 0||C.call(this,this.showError?this.internals.validationMessage:"")}),k.set(this,void 0),z.set(this,!1),S.set(this,Promise.resolve()),(d=this.addEventListener)===null||d===void 0||d.call(this,"focus",u(this,O,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"blur",u(this,E,"f")),(m=this.addEventListener)===null||m===void 0||m.call(this,"invalid",u(this,T,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(m=>m.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 g;if(d.attribute===l||!((g=d.attribute)===null||g===void 0)&&g.includes(l))return!0})}get form(){return this.internals.form}get showError(){return u(this,r,"m",x).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,d,g){var m;(m=super.attributeChangedCallback)===null||m===void 0||m.call(this,l,d,g);let R=this.constructor.getValidators(l);R!=null&&R.length&&this.validationTarget&&this.setValue(u(this,v,"f"))}setValue(l){var d;b(this,t,!1,"f"),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,""),b(this,v,l,"f");let m=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(m),u(this,r,"m",I).call(this,m),this.valueChangedCallback&&this.valueChangedCallback(m),u(this,r,"m",x).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(u(this,S,"f")))}formResetCallback(){var l,d;b(this,a,!1,"f"),b(this,t,!1,"f"),u(this,r,"m",x).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,u(this,r,"m",x).call(this)?this.validationMessage:"")}}return e=new WeakMap,t=new WeakMap,a=new WeakMap,i=new WeakMap,s=new WeakMap,n=new WeakMap,v=new WeakMap,O=new WeakMap,E=new WeakMap,T=new WeakMap,k=new WeakMap,z=new WeakMap,S=new WeakMap,r=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=u(this,t,"f")||u(this,a,"f")&&!this.validity.valid&&!u(this,e,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},I=function(l){let d=this.constructor,g={},m=d.validators,C=[],R=m.some(y=>y.isValid instanceof Promise);u(this,z,"f")||(b(this,S,new Promise(y=>{b(this,k,y,"f")}),"f"),b(this,z,!0,"f")),u(this,i,"f")&&(u(this,i,"f").abort(),b(this,s,u(this,i,"f"),"f"));let j=new AbortController;b(this,i,j,"f");let U,se=!1;m.length&&(m.forEach(y=>{let J=y.key||"customError"
|
|
10
|
+
`)),F(c)&&_e.test(c)?JSON.parse(`"${c}"`):F(c)?c:ir(c,this._locale,this._locales)(e,t==null?void 0:t.formats)}date(r,e){return ae(this._locales||this._locale,r,e)}number(r,e){return ee(this._locales||this._locale,r,e)}};function ur(o={}){return new te(o)}var _=ur();var u=function(o,r,e,t){if(e==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?o!==r||!t:!r.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?t:e==="a"?t.call(o):t?t.value:r.get(o)},b=function(o,r,e,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 r=="function"?o!==r||!a:!r.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,e):a?a.value=e:r.set(o,e),e};function Ce(o){var r,e,t,a,i,s,n,c,v,O,E,T,k,z,S,x,I,N,G;class Re extends o{constructor(...l){var d,g,m;super(...l),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),t.set(this,!1),a.set(this,!1),i.set(this,void 0),s.set(this,void 0),n.set(this,!0),v.set(this,""),O.set(this,()=>{b(this,a,!0,"f"),b(this,e,!0,"f"),u(this,r,"m",x).call(this)}),E.set(this,()=>{b(this,e,!1,"f"),u(this,r,"m",I).call(this,this.shouldFormValueUpdate()?u(this,v,"f"):""),!this.validity.valid&&u(this,a,"f")&&b(this,t,!0,"f");let C=u(this,r,"m",x).call(this);this.validationMessageCallback&&this.validationMessageCallback(C?this.internals.validationMessage:"")}),T.set(this,()=>{var C;u(this,n,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),b(this,n,!1,"f")),b(this,a,!0,"f"),b(this,t,!0,"f"),u(this,r,"m",x).call(this),(C=this===null||this===void 0?void 0:this.validationMessageCallback)===null||C===void 0||C.call(this,this.showError?this.internals.validationMessage:"")}),k.set(this,void 0),z.set(this,!1),S.set(this,Promise.resolve()),(d=this.addEventListener)===null||d===void 0||d.call(this,"focus",u(this,O,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"blur",u(this,E,"f")),(m=this.addEventListener)===null||m===void 0||m.call(this,"invalid",u(this,T,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(m=>m.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 g;if(d.attribute===l||!((g=d.attribute)===null||g===void 0)&&g.includes(l))return!0})}get form(){return this.internals.form}get showError(){return u(this,r,"m",x).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,d,g){var m;(m=super.attributeChangedCallback)===null||m===void 0||m.call(this,l,d,g);let R=this.constructor.getValidators(l);R!=null&&R.length&&this.validationTarget&&this.setValue(u(this,v,"f"))}setValue(l){var d;b(this,t,!1,"f"),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,""),b(this,v,l,"f");let m=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(m),u(this,r,"m",I).call(this,m),this.valueChangedCallback&&this.valueChangedCallback(m),u(this,r,"m",x).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(u(this,S,"f")))}formResetCallback(){var l,d;b(this,a,!1,"f"),b(this,t,!1,"f"),u(this,r,"m",x).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,u(this,r,"m",x).call(this)?this.validationMessage:"")}}return e=new WeakMap,t=new WeakMap,a=new WeakMap,i=new WeakMap,s=new WeakMap,n=new WeakMap,v=new WeakMap,O=new WeakMap,E=new WeakMap,T=new WeakMap,k=new WeakMap,z=new WeakMap,S=new WeakMap,r=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=u(this,t,"f")||u(this,a,"f")&&!this.validity.valid&&!u(this,e,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},I=function(l){let d=this.constructor,g={},m=d.validators,C=[],R=m.some(y=>y.isValid instanceof Promise);u(this,z,"f")||(b(this,S,new Promise(y=>{b(this,k,y,"f")}),"f"),b(this,z,!0,"f")),u(this,i,"f")&&(u(this,i,"f").abort(),b(this,s,u(this,i,"f"),"f"));let j=new AbortController;b(this,i,j,"f");let U,se=!1;m.length&&(m.forEach(y=>{let J=y.key||"customError",D=y.isValid(this,l,j.signal);D instanceof Promise?(C.push(D),D.then(W=>{W!=null&&(g[J]=!W,U=u(this,r,"m",G).call(this,y,l),u(this,r,"m",N).call(this,g,U))})):(g[J]=!D,this.validity[J]!==!D&&(se=!0),!D&&!U&&(U=u(this,r,"m",G).call(this,y,l)))}),Promise.allSettled(C).then(()=>{var y;j!=null&&j.signal.aborted||(b(this,z,!1,"f"),(y=u(this,k,"f"))===null||y===void 0||y.call(this))}),(se||!R)&&u(this,r,"m",N).call(this,g,U))},N=function(l,d){if(this.validationTarget)this.internals.setValidity(l,d,this.validationTarget),b(this,n,!1,"f");else{if(this.internals.setValidity(l,d),this.internals.validity.valid)return;b(this,n,!0,"f")}},G=function(l,d){if(this.validityCallback){let g=this.validityCallback(l.key||"customError");if(g)return g}return l.message instanceof Function?l.message(this,d):l.message},Re}import{html as ne,LitElement as fr}from"lit";import{property as w,state as B}from"lit/decorators.js";import{repeat as wr}from"lit/directives/repeat.js";var hr=["en","nb","fi","da","sv"],ie="en",K=o=>hr.find(r=>o===r||o.toLowerCase().includes(r))||ie;function ze(){if(typeof window=="undefined"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return K(o)}try{let o=Ee(document);if(o)return K(o);let r=vr();if(r)return K(r);let e=Ee(Ae());return e?K(e):ie}catch(o){return console.warn("could not detect locale, falling back to source locale",o),ie}}var Se=(o,r,e,t,a)=>{_.load("en",o),_.load("nb",r),_.load("fi",e),_.load("da",t),_.load("sv",a);let i=ze();_.activate(i),Fe(),gr()},pr="warp-i18n-change";function Fe(){typeof window!="undefined"&&window.dispatchEvent(new Event(pr))}var Me=!1;function gr(){if(Me||typeof window=="undefined"||!(document!=null&&document.documentElement))return;Me=!0;let o=()=>{let a=ze();_.locale!==a&&(_.activate(a),Fe())},r=new MutationObserver(a=>{for(let i of a)if(i.type==="attributes"&&i.attributeName==="lang"){o();break}});r.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let e=Ae();e&&e.documentElement&&e!==document&&r.observe(e.documentElement,{attributes:!0,attributeFilter:["lang"]});let t=br();t&&r.observe(t,{attributes:!0,attributeFilter:["lang"]})}function Ae(){var o,r;try{return(r=(o=window.parent)==null?void 0:o.document)!=null?r:null}catch(e){return null}}function Ee(o){var r,e;try{return(e=(r=o==null?void 0:o.documentElement)==null?void 0:r.lang)!=null?e:""}catch(t){return""}}function br(){var o;try{return(o=window.frameElement)!=null?o:null}catch(r){return null}}function vr(){var o,r,e;try{return(e=(r=(o=window.frameElement)==null?void 0:o.getAttribute)==null?void 0:r.call(o,"lang"))!=null?e:""}catch(t){return""}}import{css as Ie}from"lit";var Le=Ie`
|
|
11
11
|
*,
|
|
12
12
|
:before,
|
|
13
13
|
:after {
|
|
@@ -2446,10 +2446,15 @@ Please compile your catalog first.
|
|
|
2446
2446
|
display: none
|
|
2447
2447
|
}
|
|
2448
2448
|
}
|
|
2449
|
-
`;var Ve=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultater"]}]],"combobox.aria.noResults":["Ingen resultater"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," forslag"],"other":["#"," forslag"]}]],"combobox.aria.noSuggestions":["Ingen forslag"]}');var Te=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," result"],"other":["#"," results"]}]],"combobox.aria.noResults":["No results"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," suggestion"],"other":["#"," suggestions"]}]],"combobox.aria.noSuggestions":["No suggestions"]}');var
|
|
2450
|
-
.z-0{z-index:0;}.z-20{z-index:20;}`;var A={wrapper:"relative z-0",base:"absolute z-20 left-0 right-0 s-bg pb-4 rounded-8 overflow-hidden shadow-m",listbox:"m-0 p-0 select-none list-none",option:"block cursor-pointer p-8",optionUnselected:"hover:s-bg-hover",optionSelected:"s-bg-selected hover:s-bg-selected-hover",textMatch:"font-bold",a11y:"sr-only"},q,h=class extends Ce(fr){constructor(){super();this.options=[];this.value="";this.openOnFocus=!1;this.selectOnBlur=!0;this.matchTextSegments=!1;this.disableStaticFiltering=!1;this.invalid=!1;this.disabled=!1;this.required=!1;this.optional=!1;this._isOpen=!1;this._navigationOption=null;this._currentOptions=[];this._optionIdCounter=0;this._displayValue="";pe(this,q,null);Se(Te
|
|
2451
|
-
|
|
2452
|
-
|
|
2449
|
+
`;var Ve=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultater"]}]],"combobox.aria.noResults":["Ingen resultater"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," forslag"],"other":["#"," forslag"]}]],"combobox.aria.noSuggestions":["Ingen forslag"]}');var Te=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," result"],"other":["#"," results"]}]],"combobox.aria.noResults":["No results"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," suggestion"],"other":["#"," suggestions"]}]],"combobox.aria.noSuggestions":["No suggestions"]}');var De=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," tulos"],"other":["#"," tulosta"]}]],"combobox.aria.noResults":["Ei tuloksia"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," ehdotus"],"other":["#"," ehdotusta"]}]],"combobox.aria.noSuggestions":["Ei ehdotuksia"]}');var $e=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultater"]}]],"combobox.aria.noResults":["Ingen resultater"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," forslag"],"other":["#"," forslag"]}]],"combobox.aria.noSuggestions":["Ingen forslag"]}');var Ne=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultat"]}]],"combobox.aria.noResults":["Inga resultat"],"combobox.aria.pluralSuggestions":[["numSuggestions","plural",{"one":["#"," f\xF6rslag"],"other":["#"," f\xF6rslag"]}]],"combobox.aria.noSuggestions":["Inga f\xF6rslag"]}');import{css as mr}from"lit";var Pe=mr`*,: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}.rounded-8{border-radius:8px}.block{display:block}.overflow-hidden{overflow:hidden}.list-none{list-style-type:none}.left-0{left:0}.right-0{right:0}.absolute{position:absolute}.relative{position:relative}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-selected{background-color:var(--w-s-color-background-selected)}.hover\\:s-bg-hover:hover{background-color:var(--w-s-color-background-hover)}.hover\\:s-bg-selected-hover:hover{background-color:var(--w-s-color-background-selected-hover)}.shadow-m{box-shadow:var(--w-shadow-m)}.m-0{margin:0}.p-0{padding:0}.p-8{padding:.8rem}.pb-4{padding-bottom:.4rem}.cursor-pointer{cursor:pointer}.font-bold{font-weight:700}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.select-none{-webkit-user-select:none;user-select:none};
|
|
2450
|
+
.z-0{z-index:0;}.z-20{z-index:20;}`;var A={wrapper:"relative z-0",base:"absolute z-20 left-0 right-0 s-bg pb-4 rounded-8 overflow-hidden shadow-m",listbox:"m-0 p-0 select-none list-none",option:"block cursor-pointer p-8",optionUnselected:"hover:s-bg-hover",optionSelected:"s-bg-selected hover:s-bg-selected-hover",textMatch:"font-bold",a11y:"sr-only"},q,h=class extends Ce(fr){constructor(){super();this.options=[];this.label="";this.placeholder="";this.value="";this.openOnFocus=!1;this.selectOnBlur=!0;this.matchTextSegments=!1;this.disableStaticFiltering=!1;this.invalid=!1;this.helpText="";this.disabled=!1;this.required=!1;this.optional=!1;this.name="";this.autocomplete="off";this._isOpen=!1;this._navigationOption=null;this._currentOptions=[];this._optionIdCounter=0;this._displayValue="";pe(this,q,null);Se(Te,$e,De,Ve,Ne)}firstUpdated(e){ge(this,q,this.value)}updated(e){e.has("value")&&this.setValue(this.value)}resetFormControl(){this.value=he(this,q)}get _listboxId(){return`${this._id}-listbox`}get _id(){return"combobox"}get _helpId(){return this.helpText?`${this._id}__hint`:void 0}get _navigationLabelOrDisplayValue(){return this._navigationOption?this._navigationOption.label||this._navigationOption.value:this._displayValue}get _navigationValueOrInputValue(){var e;return((e=this._navigationOption)==null?void 0:e.value)||this.value}_createOptionsWithIdAndMatch(e,t){return e.map((a,i)=>({...a,id:`${this._id}-option-${this._optionIdCounter+i}`,key:a.key||a.value,currentInputValue:t}))}_getAriaText(e,t,a){if(!e||!a)return"";let i=e.filter(c=>(c.label||c.value).toLowerCase().includes(t.toLowerCase())),s=_._({id:"combobox.aria.pluralSuggestions",message:"{numSuggestions, plural, one {# suggestion} other {# suggestions}}",comment:"Aria text for combobox when there are one or more suggestions",values:{numSuggestions:i.length}}),n=_._({id:"combobox.aria.noSuggestions",message:"No suggestions",comment:"Aria text for combobox when no suggestions"});return i.length?s:n}_getOptionClasses(e){var t;return Y(A.option,((t=this._navigationOption)==null?void 0:t.id)===(e==null?void 0:e.id)?A.optionSelected:A.optionUnselected)}_handleKeyDown(e){let t=["ArrowDown","ArrowUp","PageUp","PageDown","Home","End"].includes(e.key),a=["ArrowDown","ArrowLeft","ArrowUp","ArrowRight"];if(t&&!this._isOpen){this._isOpen=!0;return}if(t&&this._isOpen){this._findAndSetActiveOption(e);return}if(!(e.altKey||e.ctrlKey||e.metaKey||e.shiftKey))switch(e.key){case"Enter":this._navigationOption&&(e.preventDefault(),this._handleSelect(this._navigationOption),requestAnimationFrame(()=>{var n,c;let i=(n=this.shadowRoot)==null?void 0:n.querySelector("w-textfield"),s=(c=i==null?void 0:i.shadowRoot)==null?void 0:c.querySelector("input");s&&(s.value=this._displayValue)})),this._isOpen=!1;break;case"Tab":case"Delete":this._isOpen=!1;break;case"Escape":this._isOpen?this._isOpen=!1:this._handleChange(""),this._navigationOption=null;break;case"Backspace":this._handleChange(this._navigationLabelOrDisplayValue),this._navigationOption=null,this._isOpen=!0;break;default:if(a.includes(e.key))break;this._isOpen=!0,this._navigationOption?(this._handleChange(this._navigationOption.value),this._navigationOption=null):this._handleChange(this.value);break}}_findAndSetActiveOption(e){e.preventDefault();let t=this._currentOptions.findIndex(s=>{var n;return s.id===((n=this._navigationOption)==null?void 0:n.id)}),a=t+1,i=t-1;switch(e.key){case"ArrowDown":this._navigationOption=a>this._currentOptions.length-1?null:this._currentOptions[a];break;case"ArrowUp":this._navigationOption=i===-2?this._currentOptions[this._currentOptions.length-1]:i<0?null:this._currentOptions[i];break;case"PageUp":this._navigationOption=t-10<0?this._currentOptions[0]:this._currentOptions[t-10];break;case"PageDown":this._navigationOption=t+10>this._currentOptions.length-1?this._currentOptions[this._currentOptions.length-1]:this._currentOptions[t+10];break;case"Home":this._navigationOption=this._currentOptions[0];break;case"End":this._navigationOption=this._currentOptions[this._currentOptions.length-1];break}}_handleSelect(e){this.value=e.value,this._displayValue=e.label||e.value,this.setValue(this.value);let t=new CustomEvent("select",{detail:{value:e.value},bubbles:!0,composed:!0});this.dispatchEvent(t),this._isOpen=!1,this._navigationOption=null,this.disableStaticFiltering&&(this._currentOptions=[])}_handleChange(e){if(e===void 0)return;this.value=e,this._displayValue=e;let t=new CustomEvent("change",{detail:{value:e},bubbles:!0,composed:!0});this.dispatchEvent(t)}_handleFocus(){if(!this.openOnFocus)return;let e=new CustomEvent("focus",{bubbles:!0,composed:!0});this.dispatchEvent(e),this._isOpen=!0}_handleBlur(e){var i,s;let t=e.relatedTarget;if(t&&((i=this.shadowRoot)!=null&&i.contains(t)))return;if(this._isOpen=!1,this.selectOnBlur&&(this._navigationOption||!this._navigationOption&&this._currentOptions.findIndex(n=>n.value===this.value)!==-1)){let n=((s=this._navigationOption)==null?void 0:s.value)||this.value;this.value=n;let c=new CustomEvent("select",{detail:{value:n},bubbles:!0,composed:!0});this.dispatchEvent(c)}this._navigationOption=null;let a=new CustomEvent("blur",{detail:{value:this._navigationValueOrInputValue},bubbles:!0,composed:!0});this.dispatchEvent(a)}_handleOptionClick(e,t){this._handleSelect(t),requestAnimationFrame(()=>{var s,n;let a=(s=this.shadowRoot)==null?void 0:s.querySelector("w-textfield"),i=(n=a==null?void 0:a.shadowRoot)==null?void 0:n.querySelector("input");i&&(i.value=t.label||t.value)})}_handleContainerBlur(e){(!e.currentTarget||!e.currentTarget.contains(e.relatedTarget))&&(this._isOpen=!1)}_renderTextMatch(e,t){if(!this.matchTextSegments)return e;let a=e.toLowerCase().indexOf(t.currentInputValue.toLowerCase());if(a!==-1){let i=a+t.currentInputValue.length;return ne`${e.substring(0,a)}<span
|
|
2451
|
+
class="${A.textMatch}"
|
|
2452
|
+
>${e.substring(a,i)}</span
|
|
2453
|
+
>${e.substring(i)}`}return e}willUpdate(e){let t=Array.isArray(this.options)?this.options:[];if(e.has("value")||e.has("options")){let a=t.find(s=>s.value===this.value),i=a?a.label||a.value:this.value;this._displayValue!==i&&this._displayValue!==this.value&&(this._displayValue=i),!this._displayValue&&this.value&&(this._displayValue=i)}(e.has("options")||e.has("value")||e.has("disableStaticFiltering")||e.has("_displayValue"))&&(this._optionIdCounter+=t.length,this._currentOptions=this._createOptionsWithIdAndMatch(t,this._displayValue).filter(a=>this.disableStaticFiltering?!0:(a.label||a.value).toLowerCase().includes(this._displayValue.toLowerCase()))),this.disableStaticFiltering&&this._currentOptions.length&&this._currentOptions.length===1&&!this._currentOptions.some(a=>a.value===this.value)&&!this._isOpen&&(this._isOpen=!0)}render(){var e;return ne`
|
|
2454
|
+
<div
|
|
2455
|
+
class=${Y(A.wrapper)}
|
|
2456
|
+
@blur=${this._handleContainerBlur}
|
|
2457
|
+
>
|
|
2453
2458
|
<w-textfield
|
|
2454
2459
|
class="w-combobox-textfield"
|
|
2455
2460
|
.value=${this._navigationLabelOrDisplayValue}
|
|
@@ -2470,14 +2475,22 @@ Please compile your catalog first.
|
|
|
2470
2475
|
@input=${t=>{var a;return this._handleChange((a=t==null?void 0:t.detail)==null?void 0:a.value)}}
|
|
2471
2476
|
@focus=${this._handleFocus}
|
|
2472
2477
|
@blur=${this._handleBlur}
|
|
2473
|
-
@keydown=${this._handleKeyDown}
|
|
2478
|
+
@keydown=${this._handleKeyDown}
|
|
2479
|
+
></w-textfield>
|
|
2474
2480
|
|
|
2475
2481
|
<span class="${A.a11y}" role="status">
|
|
2476
2482
|
${this._getAriaText(this._currentOptions,this._displayValue,this._isOpen)}
|
|
2477
2483
|
</span>
|
|
2478
2484
|
|
|
2479
|
-
<div
|
|
2480
|
-
|
|
2485
|
+
<div
|
|
2486
|
+
?hidden=${!this._isOpen||!this._currentOptions.length}
|
|
2487
|
+
class=${Y(A.base)}
|
|
2488
|
+
>
|
|
2489
|
+
<ul
|
|
2490
|
+
id=${this._listboxId}
|
|
2491
|
+
role="listbox"
|
|
2492
|
+
class="${A.listbox}"
|
|
2493
|
+
>
|
|
2481
2494
|
${wr(this._currentOptions,t=>t.key,t=>{var i;let a=t.label||t.value;return ne`
|
|
2482
2495
|
<li
|
|
2483
2496
|
id=${t.id}
|
|
@@ -2485,12 +2498,13 @@ Please compile your catalog first.
|
|
|
2485
2498
|
aria-selected=${((i=this._navigationOption)==null?void 0:i.id)===t.id}
|
|
2486
2499
|
tabindex="-1"
|
|
2487
2500
|
class=${this._getOptionClasses(t)}
|
|
2488
|
-
@mousedown=${s=>this._handleOptionClick(s,t)}
|
|
2501
|
+
@mousedown=${s=>this._handleOptionClick(s,t)}
|
|
2502
|
+
>
|
|
2489
2503
|
${this._renderTextMatch(a,t)}
|
|
2490
2504
|
</li>
|
|
2491
2505
|
`})}
|
|
2492
2506
|
</ul>
|
|
2493
2507
|
</div>
|
|
2494
2508
|
</div>
|
|
2495
|
-
`}};q=new WeakMap,h.styles=[Le,Pe],p([w({type:Array})],h.prototype,"options",2),p([w({type:String,reflect:!0})],h.prototype,"label",2),p([w({type:String,reflect:!0})],h.prototype,"placeholder",2),p([w({type:String,reflect:!0})],h.prototype,"value",2),p([w({type:Boolean,attribute:"open-on-focus"})],h.prototype,"openOnFocus",2),p([w({type:Boolean,attribute:"select-on-blur"})],h.prototype,"selectOnBlur",2),p([w({type:Boolean,attribute:"match-text-segments"})],h.prototype,"matchTextSegments",2),p([w({type:Boolean,attribute:"disable-static-filtering"})],h.prototype,"disableStaticFiltering",2),p([w({type:Boolean,reflect:!0})],h.prototype,"invalid",2),p([w({type:String,attribute:"help-text",reflect:!0})],h.prototype,"helpText",2),p([w({type:Boolean,reflect:!0})],h.prototype,"disabled",2),p([w({type:Boolean,reflect:!0})],h.prototype,"required",2),p([w({type:Boolean,reflect:!0})],h.prototype,"optional",2),p([w({type:String,reflect:!0})],h.prototype,"name",2),p([w({type:String,reflect:!0})],h.prototype,"autocomplete",2),p([B()],h.prototype,"_isOpen",2),p([B()],h.prototype,"_navigationOption",2),p([B()],h.prototype,"_currentOptions",2),p([B()],h.prototype,"_optionIdCounter",2),p([B()],h.prototype,"_displayValue",2);customElements.get("w-combobox")||customElements.define("w-combobox",h);export{h as WarpCombobox};
|
|
2509
|
+
`}};q=new WeakMap,h.styles=[Le,Pe],p([w({type:Array})],h.prototype,"options",2),p([w({type:String,reflect:!0,useDefault:!0})],h.prototype,"label",2),p([w({type:String,reflect:!0,useDefault:!0})],h.prototype,"placeholder",2),p([w({type:String,reflect:!0,useDefault:!0})],h.prototype,"value",2),p([w({type:Boolean,attribute:"open-on-focus",reflect:!0})],h.prototype,"openOnFocus",2),p([w({type:Boolean,attribute:"select-on-blur",reflect:!0,useDefault:!0})],h.prototype,"selectOnBlur",2),p([w({type:Boolean,attribute:"match-text-segments",reflect:!0})],h.prototype,"matchTextSegments",2),p([w({type:Boolean,attribute:"disable-static-filtering",reflect:!0})],h.prototype,"disableStaticFiltering",2),p([w({type:Boolean,reflect:!0})],h.prototype,"invalid",2),p([w({type:String,attribute:"help-text",reflect:!0,useDefault:!0})],h.prototype,"helpText",2),p([w({type:Boolean,reflect:!0})],h.prototype,"disabled",2),p([w({type:Boolean,reflect:!0})],h.prototype,"required",2),p([w({type:Boolean,reflect:!0})],h.prototype,"optional",2),p([w({type:String,reflect:!0,useDefault:!0})],h.prototype,"name",2),p([w({type:String,reflect:!0,useDefault:!0})],h.prototype,"autocomplete",2),p([B()],h.prototype,"_isOpen",2),p([B()],h.prototype,"_navigationOption",2),p([B()],h.prototype,"_currentOptions",2),p([B()],h.prototype,"_optionIdCounter",2),p([B()],h.prototype,"_displayValue",2);customElements.get("w-combobox")||customElements.define("w-combobox",h);export{h as WarpCombobox};
|
|
2496
2510
|
//# sourceMappingURL=combobox.js.map
|