@everymatrix/general-input 1.22.1 → 1.22.2
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/cjs/checkbox-group-input_10.cjs.entry.js +18187 -27766
- package/dist/components/active-mixin.js +2 -92
- package/dist/components/checkbox-group-input2.js +273 -2801
- package/dist/components/date-input2.js +69 -2525
- package/dist/components/field-mixin.js +2321 -1307
- package/dist/components/input-field-shared-styles.js +25 -679
- package/dist/components/password-input2.js +7 -1736
- package/dist/components/vaadin-button.js +1 -1346
- package/dist/components/vaadin-combo-box.js +47 -1758
- package/dist/components/virtual-keyboard-controller.js +83 -161
- package/dist/esm/checkbox-group-input_10.entry.js +18187 -27766
- package/dist/general-input/general-input.esm.js +1 -1
- package/dist/general-input/p-bcde6ed8.entry.js +3646 -0
- package/package.json +1 -1
- package/dist/general-input/p-983d18d7.entry.js +0 -4143
|
@@ -1,73 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import { i as inputFieldShared, I as InputConstraintsMixin,
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* @license
|
|
7
|
-
* Copyright (c) 2017 - 2023 Vaadin Ltd.
|
|
8
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Check if the custom element type has themes applied.
|
|
13
|
-
* @param {Function} elementClass
|
|
14
|
-
* @returns {boolean}
|
|
15
|
-
*/
|
|
16
|
-
function classHasThemes$1(elementClass) {
|
|
17
|
-
return elementClass && Object.prototype.hasOwnProperty.call(elementClass, '__themes');
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* Check if the custom element type has themes applied.
|
|
22
|
-
* @param {string} tagName
|
|
23
|
-
* @returns {boolean}
|
|
24
|
-
*/
|
|
25
|
-
function hasThemes$1(tagName) {
|
|
26
|
-
return classHasThemes$1(customElements.get(tagName));
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
/**
|
|
30
|
-
* Flattens the styles into a single array of styles.
|
|
31
|
-
* @param {CSSResultGroup} styles
|
|
32
|
-
* @param {CSSResult[]} result
|
|
33
|
-
* @returns {CSSResult[]}
|
|
34
|
-
*/
|
|
35
|
-
function flattenStyles$1(styles = []) {
|
|
36
|
-
return [styles].flat(Infinity).filter((style) => {
|
|
37
|
-
if (style instanceof o) {
|
|
38
|
-
return true;
|
|
39
|
-
}
|
|
40
|
-
console.warn('An item in styles is not of type CSSResult. Use `unsafeCSS` or `css`.');
|
|
41
|
-
return false;
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
/**
|
|
46
|
-
* Registers CSS styles for a component type. Make sure to register the styles before
|
|
47
|
-
* the first instance of a component of the type is attached to DOM.
|
|
48
|
-
*
|
|
49
|
-
* @param {string} themeFor The local/tag name of the component type to register the styles for
|
|
50
|
-
* @param {CSSResultGroup} styles The CSS style rules to be registered for the component type
|
|
51
|
-
* matching themeFor and included in the local scope of each component instance
|
|
52
|
-
* @param {{moduleId?: string, include?: string | string[]}} options Additional options
|
|
53
|
-
* @return {void}
|
|
54
|
-
*/
|
|
55
|
-
function registerStyles$1(themeFor, styles, options = {}) {
|
|
56
|
-
if (themeFor) {
|
|
57
|
-
if (hasThemes$1(themeFor)) {
|
|
58
|
-
console.warn(`The custom element definition for "${themeFor}"
|
|
59
|
-
was finalized before a style module was registered.
|
|
60
|
-
Make sure to add component specific style modules before
|
|
61
|
-
importing the corresponding custom element.`);
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
styles = flattenStyles$1(styles);
|
|
66
|
-
|
|
67
|
-
if (window.Vaadin && window.Vaadin.styleModules) {
|
|
68
|
-
window.Vaadin.styleModules.registerStyles(themeFor, styles, options);
|
|
69
|
-
}
|
|
70
|
-
}
|
|
1
|
+
import { i, r as registerStyles, g as defineCustomElement, h as html, j as ThemableMixin, o as DirMixin, P as PolymerElement, n as microTask, R as idlePeriod, U as animationFrame, W as flush, p as Debouncer, X as enqueueDebouncer, t as timeOut, q as generateUniqueId, J as ControllerMixin, V as ValidateMixin, m as FocusMixin, K as KeyboardMixin, I as InputMixin, a as DisabledMixin, b as isElementFocused, e as InputController, f as LabelledInputController, T as TooltipController, E as ElementMixin } from './field-mixin.js';
|
|
2
|
+
import { c as overlay, d as menuOverlayCore, P as PositionMixin, O as OverlayMixin, o as overlayStyles, b as OverlayClassMixin, V as VirtualKeyboardController } from './virtual-keyboard-controller.js';
|
|
3
|
+
import { i as inputFieldShared, e as isSafari, I as InputConstraintsMixin, f as isTouch, c as InputControlMixin, d as inputFieldShared$1 } from './input-field-shared-styles.js';
|
|
71
4
|
|
|
72
5
|
const item = i`
|
|
73
6
|
:host {
|
|
@@ -150,300 +83,7 @@ const item = i`
|
|
|
150
83
|
}
|
|
151
84
|
`;
|
|
152
85
|
|
|
153
|
-
registerStyles
|
|
154
|
-
|
|
155
|
-
/**
|
|
156
|
-
* @license
|
|
157
|
-
* Copyright (c) 2017 - 2023 Vaadin Ltd.
|
|
158
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
159
|
-
*/
|
|
160
|
-
/**
|
|
161
|
-
* @polymerMixin
|
|
162
|
-
*/
|
|
163
|
-
const ThemePropertyMixin = (superClass) =>
|
|
164
|
-
class VaadinThemePropertyMixin extends superClass {
|
|
165
|
-
static get properties() {
|
|
166
|
-
return {
|
|
167
|
-
/**
|
|
168
|
-
* Helper property with theme attribute value facilitating propagation
|
|
169
|
-
* in shadow DOM.
|
|
170
|
-
*
|
|
171
|
-
* Enables the component implementation to propagate the `theme`
|
|
172
|
-
* attribute value to the sub-components in Shadow DOM by binding
|
|
173
|
-
* the sub-component's "theme" attribute to the `theme` property of
|
|
174
|
-
* the host.
|
|
175
|
-
*
|
|
176
|
-
* **NOTE:** Extending the mixin only provides the property for binding,
|
|
177
|
-
* and does not make the propagation alone.
|
|
178
|
-
*
|
|
179
|
-
* See [Styling Components: Sub-components](https://vaadin.com/docs/latest/styling/styling-components/#sub-components).
|
|
180
|
-
* page for more information.
|
|
181
|
-
*
|
|
182
|
-
* @protected
|
|
183
|
-
*/
|
|
184
|
-
_theme: {
|
|
185
|
-
type: String,
|
|
186
|
-
readOnly: true,
|
|
187
|
-
},
|
|
188
|
-
};
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
static get observedAttributes() {
|
|
192
|
-
return [...super.observedAttributes, 'theme'];
|
|
193
|
-
}
|
|
194
|
-
|
|
195
|
-
/** @protected */
|
|
196
|
-
attributeChangedCallback(name, oldValue, newValue) {
|
|
197
|
-
super.attributeChangedCallback(name, oldValue, newValue);
|
|
198
|
-
|
|
199
|
-
if (name === 'theme') {
|
|
200
|
-
this._set_theme(newValue);
|
|
201
|
-
}
|
|
202
|
-
}
|
|
203
|
-
};
|
|
204
|
-
|
|
205
|
-
/**
|
|
206
|
-
* @license
|
|
207
|
-
* Copyright (c) 2017 - 2023 Vaadin Ltd.
|
|
208
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
209
|
-
*/
|
|
210
|
-
|
|
211
|
-
/**
|
|
212
|
-
* @typedef {Object} Theme
|
|
213
|
-
* @property {string} themeFor
|
|
214
|
-
* @property {CSSResult[]} styles
|
|
215
|
-
* @property {string | string[]} [include]
|
|
216
|
-
* @property {string} [moduleId]
|
|
217
|
-
*
|
|
218
|
-
* @typedef {CSSResult[] | CSSResult} CSSResultGroup
|
|
219
|
-
*/
|
|
220
|
-
|
|
221
|
-
/**
|
|
222
|
-
* @type {Theme[]}
|
|
223
|
-
*/
|
|
224
|
-
const themeRegistry = [];
|
|
225
|
-
|
|
226
|
-
/**
|
|
227
|
-
* Check if the custom element type has themes applied.
|
|
228
|
-
* @param {Function} elementClass
|
|
229
|
-
* @returns {boolean}
|
|
230
|
-
*/
|
|
231
|
-
function classHasThemes(elementClass) {
|
|
232
|
-
return elementClass && Object.prototype.hasOwnProperty.call(elementClass, '__themes');
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
/**
|
|
236
|
-
* Check if the custom element type has themes applied.
|
|
237
|
-
* @param {string} tagName
|
|
238
|
-
* @returns {boolean}
|
|
239
|
-
*/
|
|
240
|
-
function hasThemes(tagName) {
|
|
241
|
-
return classHasThemes(customElements.get(tagName));
|
|
242
|
-
}
|
|
243
|
-
|
|
244
|
-
/**
|
|
245
|
-
* Flattens the styles into a single array of styles.
|
|
246
|
-
* @param {CSSResultGroup} styles
|
|
247
|
-
* @param {CSSResult[]} result
|
|
248
|
-
* @returns {CSSResult[]}
|
|
249
|
-
*/
|
|
250
|
-
function flattenStyles(styles = []) {
|
|
251
|
-
return [styles].flat(Infinity).filter((style) => {
|
|
252
|
-
if (style instanceof o) {
|
|
253
|
-
return true;
|
|
254
|
-
}
|
|
255
|
-
console.warn('An item in styles is not of type CSSResult. Use `unsafeCSS` or `css`.');
|
|
256
|
-
return false;
|
|
257
|
-
});
|
|
258
|
-
}
|
|
259
|
-
|
|
260
|
-
/**
|
|
261
|
-
* Registers CSS styles for a component type. Make sure to register the styles before
|
|
262
|
-
* the first instance of a component of the type is attached to DOM.
|
|
263
|
-
*
|
|
264
|
-
* @param {string} themeFor The local/tag name of the component type to register the styles for
|
|
265
|
-
* @param {CSSResultGroup} styles The CSS style rules to be registered for the component type
|
|
266
|
-
* matching themeFor and included in the local scope of each component instance
|
|
267
|
-
* @param {{moduleId?: string, include?: string | string[]}} options Additional options
|
|
268
|
-
* @return {void}
|
|
269
|
-
*/
|
|
270
|
-
function registerStyles(themeFor, styles, options = {}) {
|
|
271
|
-
if (themeFor) {
|
|
272
|
-
if (hasThemes(themeFor)) {
|
|
273
|
-
console.warn(`The custom element definition for "${themeFor}"
|
|
274
|
-
was finalized before a style module was registered.
|
|
275
|
-
Make sure to add component specific style modules before
|
|
276
|
-
importing the corresponding custom element.`);
|
|
277
|
-
}
|
|
278
|
-
}
|
|
279
|
-
|
|
280
|
-
styles = flattenStyles(styles);
|
|
281
|
-
|
|
282
|
-
if (window.Vaadin && window.Vaadin.styleModules) {
|
|
283
|
-
window.Vaadin.styleModules.registerStyles(themeFor, styles, options);
|
|
284
|
-
} else {
|
|
285
|
-
themeRegistry.push({
|
|
286
|
-
themeFor,
|
|
287
|
-
styles,
|
|
288
|
-
include: options.include,
|
|
289
|
-
moduleId: options.moduleId,
|
|
290
|
-
});
|
|
291
|
-
}
|
|
292
|
-
}
|
|
293
|
-
|
|
294
|
-
/**
|
|
295
|
-
* Returns all registered themes. By default the themeRegistry is returned as is.
|
|
296
|
-
* In case the style-modules adapter is imported, the themes are obtained from there instead
|
|
297
|
-
* @returns {Theme[]}
|
|
298
|
-
*/
|
|
299
|
-
function getAllThemes() {
|
|
300
|
-
if (window.Vaadin && window.Vaadin.styleModules) {
|
|
301
|
-
return window.Vaadin.styleModules.getAllThemes();
|
|
302
|
-
}
|
|
303
|
-
return themeRegistry;
|
|
304
|
-
}
|
|
305
|
-
|
|
306
|
-
/**
|
|
307
|
-
* Returns true if the themeFor string matches the tag name
|
|
308
|
-
* @param {string} themeFor
|
|
309
|
-
* @param {string} tagName
|
|
310
|
-
* @returns {boolean}
|
|
311
|
-
*/
|
|
312
|
-
function matchesThemeFor(themeFor, tagName) {
|
|
313
|
-
return (themeFor || '').split(' ').some((themeForToken) => {
|
|
314
|
-
return new RegExp(`^${themeForToken.split('*').join('.*')}$`, 'u').test(tagName);
|
|
315
|
-
});
|
|
316
|
-
}
|
|
317
|
-
|
|
318
|
-
/**
|
|
319
|
-
* Maps the moduleName to an include priority number which is used for
|
|
320
|
-
* determining the order in which styles are applied.
|
|
321
|
-
* @param {string} moduleName
|
|
322
|
-
* @returns {number}
|
|
323
|
-
*/
|
|
324
|
-
function getIncludePriority(moduleName = '') {
|
|
325
|
-
let includePriority = 0;
|
|
326
|
-
if (moduleName.startsWith('lumo-') || moduleName.startsWith('material-')) {
|
|
327
|
-
includePriority = 1;
|
|
328
|
-
} else if (moduleName.startsWith('vaadin-')) {
|
|
329
|
-
includePriority = 2;
|
|
330
|
-
}
|
|
331
|
-
return includePriority;
|
|
332
|
-
}
|
|
333
|
-
|
|
334
|
-
/**
|
|
335
|
-
* Gets an array of CSSResults matching the include property of the theme.
|
|
336
|
-
* @param {Theme} theme
|
|
337
|
-
* @returns {CSSResult[]}
|
|
338
|
-
*/
|
|
339
|
-
function getIncludedStyles(theme) {
|
|
340
|
-
const includedStyles = [];
|
|
341
|
-
if (theme.include) {
|
|
342
|
-
[].concat(theme.include).forEach((includeModuleId) => {
|
|
343
|
-
const includedTheme = getAllThemes().find((s) => s.moduleId === includeModuleId);
|
|
344
|
-
if (includedTheme) {
|
|
345
|
-
includedStyles.push(...getIncludedStyles(includedTheme), ...includedTheme.styles);
|
|
346
|
-
} else {
|
|
347
|
-
console.warn(`Included moduleId ${includeModuleId} not found in style registry`);
|
|
348
|
-
}
|
|
349
|
-
}, theme.styles);
|
|
350
|
-
}
|
|
351
|
-
return includedStyles;
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
/**
|
|
355
|
-
* Includes the styles to the template.
|
|
356
|
-
* @param {CSSResult[]} styles
|
|
357
|
-
* @param {HTMLTemplateElement} template
|
|
358
|
-
*/
|
|
359
|
-
function addStylesToTemplate(styles, template) {
|
|
360
|
-
const styleEl = document.createElement('style');
|
|
361
|
-
styleEl.innerHTML = styles.map((style) => style.cssText).join('\n');
|
|
362
|
-
template.content.appendChild(styleEl);
|
|
363
|
-
}
|
|
364
|
-
|
|
365
|
-
/**
|
|
366
|
-
* Returns an array of themes that should be used for styling a component matching
|
|
367
|
-
* the tag name. The array is sorted by the include order.
|
|
368
|
-
* @param {string} tagName
|
|
369
|
-
* @returns {Theme[]}
|
|
370
|
-
*/
|
|
371
|
-
function getThemes(tagName) {
|
|
372
|
-
const defaultModuleName = `${tagName}-default-theme`;
|
|
373
|
-
|
|
374
|
-
const themes = getAllThemes()
|
|
375
|
-
// Filter by matching themeFor properties
|
|
376
|
-
.filter((theme) => theme.moduleId !== defaultModuleName && matchesThemeFor(theme.themeFor, tagName))
|
|
377
|
-
.map((theme) => ({
|
|
378
|
-
...theme,
|
|
379
|
-
// Prepend styles from included themes
|
|
380
|
-
styles: [...getIncludedStyles(theme), ...theme.styles],
|
|
381
|
-
// Map moduleId to includePriority
|
|
382
|
-
includePriority: getIncludePriority(theme.moduleId),
|
|
383
|
-
}))
|
|
384
|
-
// Sort by includePriority
|
|
385
|
-
.sort((themeA, themeB) => themeB.includePriority - themeA.includePriority);
|
|
386
|
-
|
|
387
|
-
if (themes.length > 0) {
|
|
388
|
-
return themes;
|
|
389
|
-
}
|
|
390
|
-
// No theme modules found, return the default module if it exists
|
|
391
|
-
return getAllThemes().filter((theme) => theme.moduleId === defaultModuleName);
|
|
392
|
-
}
|
|
393
|
-
|
|
394
|
-
/**
|
|
395
|
-
* @polymerMixin
|
|
396
|
-
* @mixes ThemePropertyMixin
|
|
397
|
-
*/
|
|
398
|
-
const ThemableMixin = (superClass) =>
|
|
399
|
-
class VaadinThemableMixin extends ThemePropertyMixin(superClass) {
|
|
400
|
-
/**
|
|
401
|
-
* Covers PolymerElement based component styling
|
|
402
|
-
* @protected
|
|
403
|
-
*/
|
|
404
|
-
static finalize() {
|
|
405
|
-
super.finalize();
|
|
406
|
-
|
|
407
|
-
// Make sure not to run the logic intended for PolymerElement when LitElement is used.
|
|
408
|
-
if (this.elementStyles) {
|
|
409
|
-
return;
|
|
410
|
-
}
|
|
411
|
-
|
|
412
|
-
const template = this.prototype._template;
|
|
413
|
-
if (!template || classHasThemes(this)) {
|
|
414
|
-
return;
|
|
415
|
-
}
|
|
416
|
-
|
|
417
|
-
addStylesToTemplate(this.getStylesForThis(), template);
|
|
418
|
-
}
|
|
419
|
-
|
|
420
|
-
/**
|
|
421
|
-
* Covers LitElement based component styling
|
|
422
|
-
*
|
|
423
|
-
* @protected
|
|
424
|
-
*/
|
|
425
|
-
static finalizeStyles(styles) {
|
|
426
|
-
// The "styles" object originates from the "static get styles()" function of
|
|
427
|
-
// a LitElement based component. The theme styles are added after it
|
|
428
|
-
// so that they can override the component styles.
|
|
429
|
-
const themeStyles = this.getStylesForThis();
|
|
430
|
-
return styles ? [...super.finalizeStyles(styles), ...themeStyles] : themeStyles;
|
|
431
|
-
}
|
|
432
|
-
|
|
433
|
-
/**
|
|
434
|
-
* Get styles for the component type
|
|
435
|
-
*
|
|
436
|
-
* @private
|
|
437
|
-
*/
|
|
438
|
-
static getStylesForThis() {
|
|
439
|
-
const parent = Object.getPrototypeOf(this.prototype);
|
|
440
|
-
const inheritedThemes = (parent ? parent.constructor.__themes : []) || [];
|
|
441
|
-
this.__themes = [...inheritedThemes, ...getThemes(this.is)];
|
|
442
|
-
const themeStyles = this.__themes.flatMap((theme) => theme.styles);
|
|
443
|
-
// Remove duplicates
|
|
444
|
-
return themeStyles.filter((style, index) => index === themeStyles.lastIndexOf(style));
|
|
445
|
-
}
|
|
446
|
-
};
|
|
86
|
+
registerStyles('vaadin-item', item, { moduleId: 'lumo-item' });
|
|
447
87
|
|
|
448
88
|
const comboBoxItem = i`
|
|
449
89
|
:host {
|
|
@@ -585,174 +225,6 @@ const comboBox = i`
|
|
|
585
225
|
|
|
586
226
|
registerStyles('vaadin-combo-box', [inputFieldShared, comboBox], { moduleId: 'lumo-combo-box' });
|
|
587
227
|
|
|
588
|
-
/**
|
|
589
|
-
* @license
|
|
590
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
591
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
592
|
-
*/
|
|
593
|
-
function defineCustomElement(CustomElement) {
|
|
594
|
-
const defined = customElements.get(CustomElement.is);
|
|
595
|
-
if (!defined) {
|
|
596
|
-
customElements.define(CustomElement.is, CustomElement);
|
|
597
|
-
} else {
|
|
598
|
-
const definedVersion = defined.version;
|
|
599
|
-
if (definedVersion && CustomElement.version && definedVersion === CustomElement.version) {
|
|
600
|
-
// Just loading the same thing again
|
|
601
|
-
console.warn(`The component ${CustomElement.is} has been loaded twice`);
|
|
602
|
-
} else {
|
|
603
|
-
console.error(
|
|
604
|
-
`Tried to define ${CustomElement.is} version ${CustomElement.version} when version ${defined.version} is already in use. Something will probably break.`,
|
|
605
|
-
);
|
|
606
|
-
}
|
|
607
|
-
}
|
|
608
|
-
}
|
|
609
|
-
|
|
610
|
-
/**
|
|
611
|
-
* @license
|
|
612
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
613
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
614
|
-
*/
|
|
615
|
-
|
|
616
|
-
/**
|
|
617
|
-
* Array of Vaadin custom element classes that have been subscribed to the dir changes.
|
|
618
|
-
*/
|
|
619
|
-
const directionSubscribers = [];
|
|
620
|
-
|
|
621
|
-
function alignDirs(element, documentDir, elementDir = element.getAttribute('dir')) {
|
|
622
|
-
if (documentDir) {
|
|
623
|
-
element.setAttribute('dir', documentDir);
|
|
624
|
-
} else if (elementDir != null) {
|
|
625
|
-
element.removeAttribute('dir');
|
|
626
|
-
}
|
|
627
|
-
}
|
|
628
|
-
|
|
629
|
-
function getDocumentDir() {
|
|
630
|
-
return document.documentElement.getAttribute('dir');
|
|
631
|
-
}
|
|
632
|
-
|
|
633
|
-
function directionUpdater() {
|
|
634
|
-
const documentDir = getDocumentDir();
|
|
635
|
-
directionSubscribers.forEach((element) => {
|
|
636
|
-
alignDirs(element, documentDir);
|
|
637
|
-
});
|
|
638
|
-
}
|
|
639
|
-
|
|
640
|
-
const directionObserver = new MutationObserver(directionUpdater);
|
|
641
|
-
directionObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['dir'] });
|
|
642
|
-
|
|
643
|
-
/**
|
|
644
|
-
* A mixin to handle `dir` attribute based on the one set on the `<html>` element.
|
|
645
|
-
*
|
|
646
|
-
* @polymerMixin
|
|
647
|
-
*/
|
|
648
|
-
const DirMixin = (superClass) =>
|
|
649
|
-
class VaadinDirMixin extends superClass {
|
|
650
|
-
static get properties() {
|
|
651
|
-
return {
|
|
652
|
-
/**
|
|
653
|
-
* @protected
|
|
654
|
-
*/
|
|
655
|
-
dir: {
|
|
656
|
-
type: String,
|
|
657
|
-
value: '',
|
|
658
|
-
reflectToAttribute: true,
|
|
659
|
-
converter: {
|
|
660
|
-
fromAttribute: (attr) => {
|
|
661
|
-
return !attr ? '' : attr;
|
|
662
|
-
},
|
|
663
|
-
toAttribute: (prop) => {
|
|
664
|
-
return prop === '' ? null : prop;
|
|
665
|
-
},
|
|
666
|
-
},
|
|
667
|
-
},
|
|
668
|
-
};
|
|
669
|
-
}
|
|
670
|
-
|
|
671
|
-
/**
|
|
672
|
-
* @return {boolean}
|
|
673
|
-
* @protected
|
|
674
|
-
*/
|
|
675
|
-
get __isRTL() {
|
|
676
|
-
return this.getAttribute('dir') === 'rtl';
|
|
677
|
-
}
|
|
678
|
-
|
|
679
|
-
/** @protected */
|
|
680
|
-
connectedCallback() {
|
|
681
|
-
super.connectedCallback();
|
|
682
|
-
|
|
683
|
-
if (!this.hasAttribute('dir') || this.__restoreSubscription) {
|
|
684
|
-
this.__subscribe();
|
|
685
|
-
alignDirs(this, getDocumentDir(), null);
|
|
686
|
-
}
|
|
687
|
-
}
|
|
688
|
-
|
|
689
|
-
/** @protected */
|
|
690
|
-
attributeChangedCallback(name, oldValue, newValue) {
|
|
691
|
-
super.attributeChangedCallback(name, oldValue, newValue);
|
|
692
|
-
if (name !== 'dir') {
|
|
693
|
-
return;
|
|
694
|
-
}
|
|
695
|
-
|
|
696
|
-
const documentDir = getDocumentDir();
|
|
697
|
-
|
|
698
|
-
// New value equals to the document direction and the element is not subscribed to the changes
|
|
699
|
-
const newValueEqlDocDir = newValue === documentDir && directionSubscribers.indexOf(this) === -1;
|
|
700
|
-
// Value was emptied and the element is not subscribed to the changes
|
|
701
|
-
const newValueEmptied = !newValue && oldValue && directionSubscribers.indexOf(this) === -1;
|
|
702
|
-
// New value is different and the old equals to document direction and the element is not subscribed to the changes
|
|
703
|
-
const newDiffValue = newValue !== documentDir && oldValue === documentDir;
|
|
704
|
-
|
|
705
|
-
if (newValueEqlDocDir || newValueEmptied) {
|
|
706
|
-
this.__subscribe();
|
|
707
|
-
alignDirs(this, documentDir, newValue);
|
|
708
|
-
} else if (newDiffValue) {
|
|
709
|
-
this.__unsubscribe();
|
|
710
|
-
}
|
|
711
|
-
}
|
|
712
|
-
|
|
713
|
-
/** @protected */
|
|
714
|
-
disconnectedCallback() {
|
|
715
|
-
super.disconnectedCallback();
|
|
716
|
-
this.__restoreSubscription = directionSubscribers.includes(this);
|
|
717
|
-
this.__unsubscribe();
|
|
718
|
-
}
|
|
719
|
-
|
|
720
|
-
/** @protected */
|
|
721
|
-
_valueToNodeAttribute(node, value, attribute) {
|
|
722
|
-
// Override default Polymer attribute reflection to match native behavior of HTMLElement.dir property
|
|
723
|
-
// If the property contains an empty string then it should not create an empty attribute
|
|
724
|
-
if (attribute === 'dir' && value === '' && !node.hasAttribute('dir')) {
|
|
725
|
-
return;
|
|
726
|
-
}
|
|
727
|
-
super._valueToNodeAttribute(node, value, attribute);
|
|
728
|
-
}
|
|
729
|
-
|
|
730
|
-
/** @protected */
|
|
731
|
-
_attributeToProperty(attribute, value, type) {
|
|
732
|
-
// Override default Polymer attribute reflection to match native behavior of HTMLElement.dir property
|
|
733
|
-
// If the attribute is removed, then the dir property should contain an empty string instead of null
|
|
734
|
-
if (attribute === 'dir' && !value) {
|
|
735
|
-
this.dir = '';
|
|
736
|
-
} else {
|
|
737
|
-
super._attributeToProperty(attribute, value, type);
|
|
738
|
-
}
|
|
739
|
-
}
|
|
740
|
-
|
|
741
|
-
/** @private */
|
|
742
|
-
__subscribe() {
|
|
743
|
-
if (!directionSubscribers.includes(this)) {
|
|
744
|
-
directionSubscribers.push(this);
|
|
745
|
-
}
|
|
746
|
-
}
|
|
747
|
-
|
|
748
|
-
/** @private */
|
|
749
|
-
__unsubscribe() {
|
|
750
|
-
if (directionSubscribers.includes(this)) {
|
|
751
|
-
directionSubscribers.splice(directionSubscribers.indexOf(this), 1);
|
|
752
|
-
}
|
|
753
|
-
}
|
|
754
|
-
};
|
|
755
|
-
|
|
756
228
|
/**
|
|
757
229
|
* @license
|
|
758
230
|
* Copyright (c) 2015 - 2023 Vaadin Ltd.
|
|
@@ -1088,434 +560,6 @@ function get(path, object) {
|
|
|
1088
560
|
return path.split('.').reduce((obj, property) => (obj ? obj[property] : undefined), object);
|
|
1089
561
|
}
|
|
1090
562
|
|
|
1091
|
-
/**
|
|
1092
|
-
* @license
|
|
1093
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
1094
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
1095
|
-
*/
|
|
1096
|
-
|
|
1097
|
-
let uniqueId = 0;
|
|
1098
|
-
|
|
1099
|
-
/**
|
|
1100
|
-
* Returns a unique integer id.
|
|
1101
|
-
*
|
|
1102
|
-
* @return {number}
|
|
1103
|
-
*/
|
|
1104
|
-
function generateUniqueId() {
|
|
1105
|
-
// eslint-disable-next-line no-plusplus
|
|
1106
|
-
return uniqueId++;
|
|
1107
|
-
}
|
|
1108
|
-
|
|
1109
|
-
/**
|
|
1110
|
-
* @license
|
|
1111
|
-
* Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
|
|
1112
|
-
* This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
|
1113
|
-
* The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
|
1114
|
-
* The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
|
1115
|
-
* Code distributed by Google as part of the polymer project is also
|
|
1116
|
-
* subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
|
1117
|
-
*/
|
|
1118
|
-
|
|
1119
|
-
/**
|
|
1120
|
-
* @fileoverview
|
|
1121
|
-
*
|
|
1122
|
-
* This module provides a number of strategies for enqueuing asynchronous
|
|
1123
|
-
* tasks. Each sub-module provides a standard `run(fn)` interface that returns a
|
|
1124
|
-
* handle, and a `cancel(handle)` interface for canceling async tasks before
|
|
1125
|
-
* they run.
|
|
1126
|
-
*
|
|
1127
|
-
* @summary Module that provides a number of strategies for enqueuing
|
|
1128
|
-
* asynchronous tasks.
|
|
1129
|
-
*/
|
|
1130
|
-
|
|
1131
|
-
let microtaskCurrHandle = 0;
|
|
1132
|
-
let microtaskLastHandle = 0;
|
|
1133
|
-
const microtaskCallbacks = [];
|
|
1134
|
-
let microtaskScheduled = false;
|
|
1135
|
-
|
|
1136
|
-
function microtaskFlush() {
|
|
1137
|
-
microtaskScheduled = false;
|
|
1138
|
-
const len = microtaskCallbacks.length;
|
|
1139
|
-
for (let i = 0; i < len; i++) {
|
|
1140
|
-
const cb = microtaskCallbacks[i];
|
|
1141
|
-
if (cb) {
|
|
1142
|
-
try {
|
|
1143
|
-
cb();
|
|
1144
|
-
} catch (e) {
|
|
1145
|
-
setTimeout(() => {
|
|
1146
|
-
throw e;
|
|
1147
|
-
});
|
|
1148
|
-
}
|
|
1149
|
-
}
|
|
1150
|
-
}
|
|
1151
|
-
microtaskCallbacks.splice(0, len);
|
|
1152
|
-
microtaskLastHandle += len;
|
|
1153
|
-
}
|
|
1154
|
-
|
|
1155
|
-
/**
|
|
1156
|
-
* Async interface wrapper around `setTimeout`.
|
|
1157
|
-
*
|
|
1158
|
-
* @namespace
|
|
1159
|
-
* @summary Async interface wrapper around `setTimeout`.
|
|
1160
|
-
*/
|
|
1161
|
-
const timeOut = {
|
|
1162
|
-
/**
|
|
1163
|
-
* Returns a sub-module with the async interface providing the provided
|
|
1164
|
-
* delay.
|
|
1165
|
-
*
|
|
1166
|
-
* @memberof timeOut
|
|
1167
|
-
* @param {number=} delay Time to wait before calling callbacks in ms
|
|
1168
|
-
* @return {!AsyncInterface} An async timeout interface
|
|
1169
|
-
*/
|
|
1170
|
-
after(delay) {
|
|
1171
|
-
return {
|
|
1172
|
-
run(fn) {
|
|
1173
|
-
return window.setTimeout(fn, delay);
|
|
1174
|
-
},
|
|
1175
|
-
cancel(handle) {
|
|
1176
|
-
window.clearTimeout(handle);
|
|
1177
|
-
},
|
|
1178
|
-
};
|
|
1179
|
-
},
|
|
1180
|
-
/**
|
|
1181
|
-
* Enqueues a function called in the next task.
|
|
1182
|
-
*
|
|
1183
|
-
* @memberof timeOut
|
|
1184
|
-
* @param {!Function} fn Callback to run
|
|
1185
|
-
* @param {number=} delay Delay in milliseconds
|
|
1186
|
-
* @return {number} Handle used for canceling task
|
|
1187
|
-
*/
|
|
1188
|
-
run(fn, delay) {
|
|
1189
|
-
return window.setTimeout(fn, delay);
|
|
1190
|
-
},
|
|
1191
|
-
/**
|
|
1192
|
-
* Cancels a previously enqueued `timeOut` callback.
|
|
1193
|
-
*
|
|
1194
|
-
* @memberof timeOut
|
|
1195
|
-
* @param {number} handle Handle returned from `run` of callback to cancel
|
|
1196
|
-
* @return {void}
|
|
1197
|
-
*/
|
|
1198
|
-
cancel(handle) {
|
|
1199
|
-
window.clearTimeout(handle);
|
|
1200
|
-
},
|
|
1201
|
-
};
|
|
1202
|
-
|
|
1203
|
-
/**
|
|
1204
|
-
* Async interface wrapper around `requestAnimationFrame`.
|
|
1205
|
-
*
|
|
1206
|
-
* @namespace
|
|
1207
|
-
* @summary Async interface wrapper around `requestAnimationFrame`.
|
|
1208
|
-
*/
|
|
1209
|
-
const animationFrame = {
|
|
1210
|
-
/**
|
|
1211
|
-
* Enqueues a function called at `requestAnimationFrame` timing.
|
|
1212
|
-
*
|
|
1213
|
-
* @memberof animationFrame
|
|
1214
|
-
* @param {function(number):void} fn Callback to run
|
|
1215
|
-
* @return {number} Handle used for canceling task
|
|
1216
|
-
*/
|
|
1217
|
-
run(fn) {
|
|
1218
|
-
return window.requestAnimationFrame(fn);
|
|
1219
|
-
},
|
|
1220
|
-
/**
|
|
1221
|
-
* Cancels a previously enqueued `animationFrame` callback.
|
|
1222
|
-
*
|
|
1223
|
-
* @memberof animationFrame
|
|
1224
|
-
* @param {number} handle Handle returned from `run` of callback to cancel
|
|
1225
|
-
* @return {void}
|
|
1226
|
-
*/
|
|
1227
|
-
cancel(handle) {
|
|
1228
|
-
window.cancelAnimationFrame(handle);
|
|
1229
|
-
},
|
|
1230
|
-
};
|
|
1231
|
-
|
|
1232
|
-
/**
|
|
1233
|
-
* Async interface wrapper around `requestIdleCallback`. Falls back to
|
|
1234
|
-
* `setTimeout` on browsers that do not support `requestIdleCallback`.
|
|
1235
|
-
*
|
|
1236
|
-
* @namespace
|
|
1237
|
-
* @summary Async interface wrapper around `requestIdleCallback`.
|
|
1238
|
-
*/
|
|
1239
|
-
const idlePeriod = {
|
|
1240
|
-
/**
|
|
1241
|
-
* Enqueues a function called at `requestIdleCallback` timing.
|
|
1242
|
-
*
|
|
1243
|
-
* @memberof idlePeriod
|
|
1244
|
-
* @param {function(!IdleDeadline):void} fn Callback to run
|
|
1245
|
-
* @return {number} Handle used for canceling task
|
|
1246
|
-
*/
|
|
1247
|
-
run(fn) {
|
|
1248
|
-
return window.requestIdleCallback ? window.requestIdleCallback(fn) : window.setTimeout(fn, 16);
|
|
1249
|
-
},
|
|
1250
|
-
/**
|
|
1251
|
-
* Cancels a previously enqueued `idlePeriod` callback.
|
|
1252
|
-
*
|
|
1253
|
-
* @memberof idlePeriod
|
|
1254
|
-
* @param {number} handle Handle returned from `run` of callback to cancel
|
|
1255
|
-
* @return {void}
|
|
1256
|
-
*/
|
|
1257
|
-
cancel(handle) {
|
|
1258
|
-
if (window.cancelIdleCallback) {
|
|
1259
|
-
window.cancelIdleCallback(handle);
|
|
1260
|
-
} else {
|
|
1261
|
-
window.clearTimeout(handle);
|
|
1262
|
-
}
|
|
1263
|
-
},
|
|
1264
|
-
};
|
|
1265
|
-
|
|
1266
|
-
/**
|
|
1267
|
-
* Async interface for enqueuing callbacks that run at microtask timing.
|
|
1268
|
-
*
|
|
1269
|
-
* @namespace
|
|
1270
|
-
* @summary Async interface for enqueuing callbacks that run at microtask
|
|
1271
|
-
* timing.
|
|
1272
|
-
*/
|
|
1273
|
-
const microTask = {
|
|
1274
|
-
/**
|
|
1275
|
-
* Enqueues a function called at microtask timing.
|
|
1276
|
-
*
|
|
1277
|
-
* @memberof microTask
|
|
1278
|
-
* @param {!Function=} callback Callback to run
|
|
1279
|
-
* @return {number} Handle used for canceling task
|
|
1280
|
-
*/
|
|
1281
|
-
run(callback) {
|
|
1282
|
-
if (!microtaskScheduled) {
|
|
1283
|
-
microtaskScheduled = true;
|
|
1284
|
-
queueMicrotask(() => microtaskFlush());
|
|
1285
|
-
}
|
|
1286
|
-
microtaskCallbacks.push(callback);
|
|
1287
|
-
const result = microtaskCurrHandle;
|
|
1288
|
-
microtaskCurrHandle += 1;
|
|
1289
|
-
return result;
|
|
1290
|
-
},
|
|
1291
|
-
|
|
1292
|
-
/**
|
|
1293
|
-
* Cancels a previously enqueued `microTask` callback.
|
|
1294
|
-
*
|
|
1295
|
-
* @memberof microTask
|
|
1296
|
-
* @param {number} handle Handle returned from `run` of callback to cancel
|
|
1297
|
-
* @return {void}
|
|
1298
|
-
*/
|
|
1299
|
-
cancel(handle) {
|
|
1300
|
-
const idx = handle - microtaskLastHandle;
|
|
1301
|
-
if (idx >= 0) {
|
|
1302
|
-
if (!microtaskCallbacks[idx]) {
|
|
1303
|
-
throw new Error(`invalid async handle: ${handle}`);
|
|
1304
|
-
}
|
|
1305
|
-
microtaskCallbacks[idx] = null;
|
|
1306
|
-
}
|
|
1307
|
-
},
|
|
1308
|
-
};
|
|
1309
|
-
|
|
1310
|
-
/**
|
|
1311
|
-
* @license
|
|
1312
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
1313
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
1314
|
-
*/
|
|
1315
|
-
|
|
1316
|
-
const testUserAgent = (regexp) => regexp.test(navigator.userAgent);
|
|
1317
|
-
|
|
1318
|
-
const testPlatform = (regexp) => regexp.test(navigator.platform);
|
|
1319
|
-
|
|
1320
|
-
const testVendor = (regexp) => regexp.test(navigator.vendor);
|
|
1321
|
-
|
|
1322
|
-
testUserAgent(/Android/u);
|
|
1323
|
-
|
|
1324
|
-
testUserAgent(/Chrome/u) && testVendor(/Google Inc/u);
|
|
1325
|
-
|
|
1326
|
-
testUserAgent(/Firefox/u);
|
|
1327
|
-
|
|
1328
|
-
// IPadOS 13 lies and says it's a Mac, but we can distinguish by detecting touch support.
|
|
1329
|
-
testPlatform(/^iPad/u) || (testPlatform(/^Mac/u) && navigator.maxTouchPoints > 1);
|
|
1330
|
-
|
|
1331
|
-
testPlatform(/^iPhone/u);
|
|
1332
|
-
|
|
1333
|
-
const isSafari = testUserAgent(/^((?!chrome|android).)*safari/iu);
|
|
1334
|
-
|
|
1335
|
-
const isTouch = (() => {
|
|
1336
|
-
try {
|
|
1337
|
-
document.createEvent('TouchEvent');
|
|
1338
|
-
return true;
|
|
1339
|
-
} catch (e) {
|
|
1340
|
-
return false;
|
|
1341
|
-
}
|
|
1342
|
-
})();
|
|
1343
|
-
|
|
1344
|
-
/**
|
|
1345
|
-
@license
|
|
1346
|
-
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
|
|
1347
|
-
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
|
1348
|
-
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
|
1349
|
-
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
|
1350
|
-
Code distributed by Google as part of the polymer project is also
|
|
1351
|
-
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
|
|
1352
|
-
*/
|
|
1353
|
-
|
|
1354
|
-
const debouncerQueue = new Set();
|
|
1355
|
-
|
|
1356
|
-
/**
|
|
1357
|
-
* @summary Collapse multiple callbacks into one invocation after a timer.
|
|
1358
|
-
*/
|
|
1359
|
-
class Debouncer {
|
|
1360
|
-
/**
|
|
1361
|
-
* Creates a debouncer if no debouncer is passed as a parameter
|
|
1362
|
-
* or it cancels an active debouncer otherwise. The following
|
|
1363
|
-
* example shows how a debouncer can be called multiple times within a
|
|
1364
|
-
* microtask and "debounced" such that the provided callback function is
|
|
1365
|
-
* called once. Add this method to a custom element:
|
|
1366
|
-
*
|
|
1367
|
-
* ```js
|
|
1368
|
-
* import {microTask} from '@vaadin/component-base/src/async.js';
|
|
1369
|
-
* import {Debouncer} from '@vaadin/component-base/src/debounce.js';
|
|
1370
|
-
* // ...
|
|
1371
|
-
*
|
|
1372
|
-
* _debounceWork() {
|
|
1373
|
-
* this._debounceJob = Debouncer.debounce(this._debounceJob,
|
|
1374
|
-
* microTask, () => this._doWork());
|
|
1375
|
-
* }
|
|
1376
|
-
* ```
|
|
1377
|
-
*
|
|
1378
|
-
* If the `_debounceWork` method is called multiple times within the same
|
|
1379
|
-
* microtask, the `_doWork` function will be called only once at the next
|
|
1380
|
-
* microtask checkpoint.
|
|
1381
|
-
*
|
|
1382
|
-
* Note: In testing it is often convenient to avoid asynchrony. To accomplish
|
|
1383
|
-
* this with a debouncer, you can use `enqueueDebouncer` and
|
|
1384
|
-
* `flush`. For example, extend the above example by adding
|
|
1385
|
-
* `enqueueDebouncer(this._debounceJob)` at the end of the
|
|
1386
|
-
* `_debounceWork` method. Then in a test, call `flush` to ensure
|
|
1387
|
-
* the debouncer has completed.
|
|
1388
|
-
*
|
|
1389
|
-
* @param {Debouncer?} debouncer Debouncer object.
|
|
1390
|
-
* @param {!AsyncInterface} asyncModule Object with Async interface
|
|
1391
|
-
* @param {function()} callback Callback to run.
|
|
1392
|
-
* @return {!Debouncer} Returns a debouncer object.
|
|
1393
|
-
*/
|
|
1394
|
-
static debounce(debouncer, asyncModule, callback) {
|
|
1395
|
-
if (debouncer instanceof Debouncer) {
|
|
1396
|
-
// Cancel the async callback, but leave in debouncerQueue if it was
|
|
1397
|
-
// enqueued, to maintain 1.x flush order
|
|
1398
|
-
debouncer._cancelAsync();
|
|
1399
|
-
} else {
|
|
1400
|
-
debouncer = new Debouncer();
|
|
1401
|
-
}
|
|
1402
|
-
debouncer.setConfig(asyncModule, callback);
|
|
1403
|
-
return debouncer;
|
|
1404
|
-
}
|
|
1405
|
-
|
|
1406
|
-
constructor() {
|
|
1407
|
-
this._asyncModule = null;
|
|
1408
|
-
this._callback = null;
|
|
1409
|
-
this._timer = null;
|
|
1410
|
-
}
|
|
1411
|
-
|
|
1412
|
-
/**
|
|
1413
|
-
* Sets the scheduler; that is, a module with the Async interface,
|
|
1414
|
-
* a callback and optional arguments to be passed to the run function
|
|
1415
|
-
* from the async module.
|
|
1416
|
-
*
|
|
1417
|
-
* @param {!AsyncInterface} asyncModule Object with Async interface.
|
|
1418
|
-
* @param {function()} callback Callback to run.
|
|
1419
|
-
* @return {void}
|
|
1420
|
-
*/
|
|
1421
|
-
setConfig(asyncModule, callback) {
|
|
1422
|
-
this._asyncModule = asyncModule;
|
|
1423
|
-
this._callback = callback;
|
|
1424
|
-
this._timer = this._asyncModule.run(() => {
|
|
1425
|
-
this._timer = null;
|
|
1426
|
-
debouncerQueue.delete(this);
|
|
1427
|
-
this._callback();
|
|
1428
|
-
});
|
|
1429
|
-
}
|
|
1430
|
-
|
|
1431
|
-
/**
|
|
1432
|
-
* Cancels an active debouncer and returns a reference to itself.
|
|
1433
|
-
*
|
|
1434
|
-
* @return {void}
|
|
1435
|
-
*/
|
|
1436
|
-
cancel() {
|
|
1437
|
-
if (this.isActive()) {
|
|
1438
|
-
this._cancelAsync();
|
|
1439
|
-
// Canceling a debouncer removes its spot from the flush queue,
|
|
1440
|
-
// so if a debouncer is manually canceled and re-debounced, it
|
|
1441
|
-
// will reset its flush order (this is a very minor difference from 1.x)
|
|
1442
|
-
// Re-debouncing via the `debounce` API retains the 1.x FIFO flush order
|
|
1443
|
-
debouncerQueue.delete(this);
|
|
1444
|
-
}
|
|
1445
|
-
}
|
|
1446
|
-
|
|
1447
|
-
/**
|
|
1448
|
-
* Cancels a debouncer's async callback.
|
|
1449
|
-
*
|
|
1450
|
-
* @return {void}
|
|
1451
|
-
*/
|
|
1452
|
-
_cancelAsync() {
|
|
1453
|
-
if (this.isActive()) {
|
|
1454
|
-
this._asyncModule.cancel(/** @type {number} */ (this._timer));
|
|
1455
|
-
this._timer = null;
|
|
1456
|
-
}
|
|
1457
|
-
}
|
|
1458
|
-
|
|
1459
|
-
/**
|
|
1460
|
-
* Flushes an active debouncer and returns a reference to itself.
|
|
1461
|
-
*
|
|
1462
|
-
* @return {void}
|
|
1463
|
-
*/
|
|
1464
|
-
flush() {
|
|
1465
|
-
if (this.isActive()) {
|
|
1466
|
-
this.cancel();
|
|
1467
|
-
this._callback();
|
|
1468
|
-
}
|
|
1469
|
-
}
|
|
1470
|
-
|
|
1471
|
-
/**
|
|
1472
|
-
* Returns true if the debouncer is active.
|
|
1473
|
-
*
|
|
1474
|
-
* @return {boolean} True if active.
|
|
1475
|
-
*/
|
|
1476
|
-
isActive() {
|
|
1477
|
-
return this._timer != null;
|
|
1478
|
-
}
|
|
1479
|
-
}
|
|
1480
|
-
|
|
1481
|
-
/**
|
|
1482
|
-
* Adds a `Debouncer` to a list of globally flushable tasks.
|
|
1483
|
-
*
|
|
1484
|
-
* @param {!Debouncer} debouncer Debouncer to enqueue
|
|
1485
|
-
* @return {void}
|
|
1486
|
-
*/
|
|
1487
|
-
function enqueueDebouncer(debouncer) {
|
|
1488
|
-
debouncerQueue.add(debouncer);
|
|
1489
|
-
}
|
|
1490
|
-
|
|
1491
|
-
/**
|
|
1492
|
-
* Flushes any enqueued debouncers
|
|
1493
|
-
*
|
|
1494
|
-
* @return {boolean} Returns whether any debouncers were flushed
|
|
1495
|
-
*/
|
|
1496
|
-
function flushDebouncers() {
|
|
1497
|
-
const didFlush = Boolean(debouncerQueue.size);
|
|
1498
|
-
// If new debouncers are added while flushing, Set.forEach will ensure
|
|
1499
|
-
// newly added ones are also flushed
|
|
1500
|
-
debouncerQueue.forEach((debouncer) => {
|
|
1501
|
-
try {
|
|
1502
|
-
debouncer.flush();
|
|
1503
|
-
} catch (e) {
|
|
1504
|
-
setTimeout(() => {
|
|
1505
|
-
throw e;
|
|
1506
|
-
});
|
|
1507
|
-
}
|
|
1508
|
-
});
|
|
1509
|
-
return didFlush;
|
|
1510
|
-
}
|
|
1511
|
-
|
|
1512
|
-
const flush = () => {
|
|
1513
|
-
let debouncers;
|
|
1514
|
-
do {
|
|
1515
|
-
debouncers = flushDebouncers();
|
|
1516
|
-
} while (debouncers);
|
|
1517
|
-
};
|
|
1518
|
-
|
|
1519
563
|
/**
|
|
1520
564
|
* @license
|
|
1521
565
|
* Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
|
|
@@ -3473,661 +2517,67 @@ defineCustomElement(ComboBoxScroller);
|
|
|
3473
2517
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
3474
2518
|
*/
|
|
3475
2519
|
|
|
3476
|
-
if (!window.Vaadin) {
|
|
3477
|
-
window.Vaadin = {};
|
|
3478
|
-
}
|
|
3479
|
-
|
|
3480
|
-
/**
|
|
3481
|
-
* Array of Vaadin custom element classes that have been finalized.
|
|
3482
|
-
*/
|
|
3483
|
-
if (!window.Vaadin.registrations) {
|
|
3484
|
-
window.Vaadin.registrations = [];
|
|
3485
|
-
}
|
|
3486
|
-
|
|
3487
|
-
if (!window.Vaadin.developmentModeCallback) {
|
|
3488
|
-
window.Vaadin.developmentModeCallback = {};
|
|
3489
|
-
}
|
|
3490
|
-
|
|
3491
|
-
window.Vaadin.developmentModeCallback['vaadin-usage-statistics'] = function () {
|
|
3492
|
-
usageStatistics();
|
|
3493
|
-
};
|
|
3494
|
-
|
|
3495
|
-
let statsJob;
|
|
3496
|
-
|
|
3497
|
-
const registered = new Set();
|
|
3498
|
-
|
|
3499
2520
|
/**
|
|
2521
|
+
* A mixin to provide `pattern` property.
|
|
2522
|
+
*
|
|
3500
2523
|
* @polymerMixin
|
|
3501
|
-
* @mixes
|
|
2524
|
+
* @mixes InputConstraintsMixin
|
|
3502
2525
|
*/
|
|
3503
|
-
const
|
|
3504
|
-
class
|
|
3505
|
-
static get
|
|
3506
|
-
return
|
|
2526
|
+
const PatternMixin = (superclass) =>
|
|
2527
|
+
class PatternMixinClass extends InputConstraintsMixin(superclass) {
|
|
2528
|
+
static get properties() {
|
|
2529
|
+
return {
|
|
2530
|
+
/**
|
|
2531
|
+
* A regular expression that the value is checked against.
|
|
2532
|
+
* The pattern must match the entire value, not just some subset.
|
|
2533
|
+
*/
|
|
2534
|
+
pattern: {
|
|
2535
|
+
type: String,
|
|
2536
|
+
},
|
|
2537
|
+
};
|
|
3507
2538
|
}
|
|
3508
2539
|
|
|
3509
|
-
|
|
3510
|
-
|
|
3511
|
-
super.finalize();
|
|
3512
|
-
|
|
3513
|
-
const { is } = this;
|
|
3514
|
-
|
|
3515
|
-
// Registers a class prototype for telemetry purposes.
|
|
3516
|
-
if (is && !registered.has(is)) {
|
|
3517
|
-
window.Vaadin.registrations.push(this);
|
|
3518
|
-
registered.add(is);
|
|
3519
|
-
|
|
3520
|
-
if (window.Vaadin.developmentModeCallback) {
|
|
3521
|
-
statsJob = Debouncer.debounce(statsJob, idlePeriod, () => {
|
|
3522
|
-
window.Vaadin.developmentModeCallback['vaadin-usage-statistics']();
|
|
3523
|
-
});
|
|
3524
|
-
enqueueDebouncer(statsJob);
|
|
3525
|
-
}
|
|
3526
|
-
}
|
|
2540
|
+
static get delegateAttrs() {
|
|
2541
|
+
return [...super.delegateAttrs, 'pattern'];
|
|
3527
2542
|
}
|
|
3528
2543
|
|
|
3529
|
-
|
|
3530
|
-
super
|
|
3531
|
-
|
|
3532
|
-
if (document.doctype === null) {
|
|
3533
|
-
console.warn(
|
|
3534
|
-
'Vaadin components require the "standards mode" declaration. Please add <!DOCTYPE html> to the HTML document.',
|
|
3535
|
-
);
|
|
3536
|
-
}
|
|
2544
|
+
static get constraints() {
|
|
2545
|
+
return [...super.constraints, 'pattern'];
|
|
3537
2546
|
}
|
|
3538
2547
|
};
|
|
3539
2548
|
|
|
3540
2549
|
/**
|
|
3541
2550
|
* @license
|
|
3542
|
-
* Copyright (c)
|
|
2551
|
+
* Copyright (c) 2015 - 2023 Vaadin Ltd.
|
|
3543
2552
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
3544
2553
|
*/
|
|
3545
2554
|
|
|
3546
2555
|
/**
|
|
3547
|
-
*
|
|
3548
|
-
*
|
|
3549
|
-
* @param {Node} node
|
|
3550
|
-
* @return {boolean}
|
|
2556
|
+
* @polymerMixin
|
|
3551
2557
|
*/
|
|
3552
|
-
|
|
3553
|
-
|
|
3554
|
-
|
|
2558
|
+
const ComboBoxDataProviderMixin = (superClass) =>
|
|
2559
|
+
class DataProviderMixin extends superClass {
|
|
2560
|
+
static get properties() {
|
|
2561
|
+
return {
|
|
2562
|
+
/**
|
|
2563
|
+
* Number of items fetched at a time from the dataprovider.
|
|
2564
|
+
* @attr {number} page-size
|
|
2565
|
+
* @type {number}
|
|
2566
|
+
*/
|
|
2567
|
+
pageSize: {
|
|
2568
|
+
type: Number,
|
|
2569
|
+
value: 50,
|
|
2570
|
+
observer: '_pageSizeChanged',
|
|
2571
|
+
},
|
|
3555
2572
|
|
|
3556
|
-
/**
|
|
3557
|
-
|
|
3558
|
-
|
|
3559
|
-
|
|
3560
|
-
|
|
3561
|
-
|
|
3562
|
-
|
|
3563
|
-
|
|
3564
|
-
*/
|
|
3565
|
-
class SlotObserver {
|
|
3566
|
-
constructor(slot, callback) {
|
|
3567
|
-
/** @type HTMLSlotElement */
|
|
3568
|
-
this.slot = slot;
|
|
3569
|
-
|
|
3570
|
-
/** @type Function */
|
|
3571
|
-
this.callback = callback;
|
|
3572
|
-
|
|
3573
|
-
/** @type {Node[]} */
|
|
3574
|
-
this._storedNodes = [];
|
|
3575
|
-
|
|
3576
|
-
this._connected = false;
|
|
3577
|
-
this._scheduled = false;
|
|
3578
|
-
|
|
3579
|
-
this._boundSchedule = () => {
|
|
3580
|
-
this._schedule();
|
|
3581
|
-
};
|
|
3582
|
-
|
|
3583
|
-
this.connect();
|
|
3584
|
-
this._schedule();
|
|
3585
|
-
}
|
|
3586
|
-
|
|
3587
|
-
/**
|
|
3588
|
-
* Activates an observer. This method is automatically called when
|
|
3589
|
-
* a `SlotObserver` is created. It should only be called to re-activate
|
|
3590
|
-
* an observer that has been deactivated via the `disconnect` method.
|
|
3591
|
-
*/
|
|
3592
|
-
connect() {
|
|
3593
|
-
this.slot.addEventListener('slotchange', this._boundSchedule);
|
|
3594
|
-
this._connected = true;
|
|
3595
|
-
}
|
|
3596
|
-
|
|
3597
|
-
/**
|
|
3598
|
-
* Deactivates the observer. After calling this method the observer callback
|
|
3599
|
-
* will not be called when changes to slotted nodes occur. The `connect` method
|
|
3600
|
-
* may be subsequently called to reactivate the observer.
|
|
3601
|
-
*/
|
|
3602
|
-
disconnect() {
|
|
3603
|
-
this.slot.removeEventListener('slotchange', this._boundSchedule);
|
|
3604
|
-
this._connected = false;
|
|
3605
|
-
}
|
|
3606
|
-
|
|
3607
|
-
/** @private */
|
|
3608
|
-
_schedule() {
|
|
3609
|
-
if (!this._scheduled) {
|
|
3610
|
-
this._scheduled = true;
|
|
3611
|
-
|
|
3612
|
-
queueMicrotask(() => {
|
|
3613
|
-
this.flush();
|
|
3614
|
-
});
|
|
3615
|
-
}
|
|
3616
|
-
}
|
|
3617
|
-
|
|
3618
|
-
/**
|
|
3619
|
-
* Run the observer callback synchronously.
|
|
3620
|
-
*/
|
|
3621
|
-
flush() {
|
|
3622
|
-
if (!this._connected) {
|
|
3623
|
-
return;
|
|
3624
|
-
}
|
|
3625
|
-
|
|
3626
|
-
this._scheduled = false;
|
|
3627
|
-
|
|
3628
|
-
this._processNodes();
|
|
3629
|
-
}
|
|
3630
|
-
|
|
3631
|
-
/** @private */
|
|
3632
|
-
_processNodes() {
|
|
3633
|
-
const currentNodes = this.slot.assignedNodes({ flatten: true });
|
|
3634
|
-
|
|
3635
|
-
let addedNodes = [];
|
|
3636
|
-
const removedNodes = [];
|
|
3637
|
-
const movedNodes = [];
|
|
3638
|
-
|
|
3639
|
-
if (currentNodes.length) {
|
|
3640
|
-
addedNodes = currentNodes.filter((node) => !this._storedNodes.includes(node));
|
|
3641
|
-
}
|
|
3642
|
-
|
|
3643
|
-
if (this._storedNodes.length) {
|
|
3644
|
-
this._storedNodes.forEach((node, index) => {
|
|
3645
|
-
const idx = currentNodes.indexOf(node);
|
|
3646
|
-
if (idx === -1) {
|
|
3647
|
-
removedNodes.push(node);
|
|
3648
|
-
} else if (idx !== index) {
|
|
3649
|
-
movedNodes.push(node);
|
|
3650
|
-
}
|
|
3651
|
-
});
|
|
3652
|
-
}
|
|
3653
|
-
|
|
3654
|
-
if (addedNodes.length || removedNodes.length || movedNodes.length) {
|
|
3655
|
-
this.callback({ addedNodes, movedNodes, removedNodes });
|
|
3656
|
-
}
|
|
3657
|
-
|
|
3658
|
-
this._storedNodes = currentNodes;
|
|
3659
|
-
}
|
|
3660
|
-
}
|
|
3661
|
-
|
|
3662
|
-
/**
|
|
3663
|
-
* @license
|
|
3664
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
3665
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
3666
|
-
*/
|
|
3667
|
-
|
|
3668
|
-
/**
|
|
3669
|
-
* A controller for providing content to slot element and observing changes.
|
|
3670
|
-
*/
|
|
3671
|
-
class SlotController extends EventTarget {
|
|
3672
|
-
/**
|
|
3673
|
-
* Ensure that every instance has unique ID.
|
|
3674
|
-
*
|
|
3675
|
-
* @param {HTMLElement} host
|
|
3676
|
-
* @param {string} slotName
|
|
3677
|
-
* @return {string}
|
|
3678
|
-
* @protected
|
|
3679
|
-
*/
|
|
3680
|
-
static generateId(host, slotName) {
|
|
3681
|
-
const prefix = slotName || 'default';
|
|
3682
|
-
return `${prefix}-${host.localName}-${generateUniqueId()}`;
|
|
3683
|
-
}
|
|
3684
|
-
|
|
3685
|
-
constructor(host, slotName, tagName, config = {}) {
|
|
3686
|
-
super();
|
|
3687
|
-
|
|
3688
|
-
const { initializer, multiple, observe, useUniqueId } = config;
|
|
3689
|
-
|
|
3690
|
-
this.host = host;
|
|
3691
|
-
this.slotName = slotName;
|
|
3692
|
-
this.tagName = tagName;
|
|
3693
|
-
this.observe = typeof observe === 'boolean' ? observe : true;
|
|
3694
|
-
this.multiple = typeof multiple === 'boolean' ? multiple : false;
|
|
3695
|
-
this.slotInitializer = initializer;
|
|
3696
|
-
|
|
3697
|
-
if (multiple) {
|
|
3698
|
-
this.nodes = [];
|
|
3699
|
-
}
|
|
3700
|
-
|
|
3701
|
-
// Only generate the default ID if requested by the controller.
|
|
3702
|
-
if (useUniqueId) {
|
|
3703
|
-
this.defaultId = this.constructor.generateId(host, slotName);
|
|
3704
|
-
}
|
|
3705
|
-
}
|
|
3706
|
-
|
|
3707
|
-
hostConnected() {
|
|
3708
|
-
if (!this.initialized) {
|
|
3709
|
-
if (this.multiple) {
|
|
3710
|
-
this.initMultiple();
|
|
3711
|
-
} else {
|
|
3712
|
-
this.initSingle();
|
|
3713
|
-
}
|
|
3714
|
-
|
|
3715
|
-
if (this.observe) {
|
|
3716
|
-
this.observeSlot();
|
|
3717
|
-
}
|
|
3718
|
-
|
|
3719
|
-
this.initialized = true;
|
|
3720
|
-
}
|
|
3721
|
-
}
|
|
3722
|
-
|
|
3723
|
-
/** @protected */
|
|
3724
|
-
initSingle() {
|
|
3725
|
-
let node = this.getSlotChild();
|
|
3726
|
-
|
|
3727
|
-
if (!node) {
|
|
3728
|
-
node = this.attachDefaultNode();
|
|
3729
|
-
this.initNode(node);
|
|
3730
|
-
} else {
|
|
3731
|
-
this.node = node;
|
|
3732
|
-
this.initAddedNode(node);
|
|
3733
|
-
}
|
|
3734
|
-
}
|
|
3735
|
-
|
|
3736
|
-
/** @protected */
|
|
3737
|
-
initMultiple() {
|
|
3738
|
-
const children = this.getSlotChildren();
|
|
3739
|
-
|
|
3740
|
-
if (children.length === 0) {
|
|
3741
|
-
const defaultNode = this.attachDefaultNode();
|
|
3742
|
-
if (defaultNode) {
|
|
3743
|
-
this.nodes = [defaultNode];
|
|
3744
|
-
this.initNode(defaultNode);
|
|
3745
|
-
}
|
|
3746
|
-
} else {
|
|
3747
|
-
this.nodes = children;
|
|
3748
|
-
children.forEach((node) => {
|
|
3749
|
-
this.initAddedNode(node);
|
|
3750
|
-
});
|
|
3751
|
-
}
|
|
3752
|
-
}
|
|
3753
|
-
|
|
3754
|
-
/**
|
|
3755
|
-
* Create and attach default node using the provided tag name, if any.
|
|
3756
|
-
* @return {Node | undefined}
|
|
3757
|
-
* @protected
|
|
3758
|
-
*/
|
|
3759
|
-
attachDefaultNode() {
|
|
3760
|
-
const { host, slotName, tagName } = this;
|
|
3761
|
-
|
|
3762
|
-
// Check if the node was created previously and if so, reuse it.
|
|
3763
|
-
let node = this.defaultNode;
|
|
3764
|
-
|
|
3765
|
-
// Tag name is optional, sometimes we don't init default content.
|
|
3766
|
-
if (!node && tagName) {
|
|
3767
|
-
node = document.createElement(tagName);
|
|
3768
|
-
if (node instanceof Element) {
|
|
3769
|
-
if (slotName !== '') {
|
|
3770
|
-
node.setAttribute('slot', slotName);
|
|
3771
|
-
}
|
|
3772
|
-
this.node = node;
|
|
3773
|
-
this.defaultNode = node;
|
|
3774
|
-
}
|
|
3775
|
-
}
|
|
3776
|
-
|
|
3777
|
-
if (node) {
|
|
3778
|
-
host.appendChild(node);
|
|
3779
|
-
}
|
|
3780
|
-
|
|
3781
|
-
return node;
|
|
3782
|
-
}
|
|
3783
|
-
|
|
3784
|
-
/**
|
|
3785
|
-
* Return the list of nodes matching the slot managed by the controller.
|
|
3786
|
-
* @return {Node}
|
|
3787
|
-
*/
|
|
3788
|
-
getSlotChildren() {
|
|
3789
|
-
const { slotName } = this;
|
|
3790
|
-
return Array.from(this.host.childNodes).filter((node) => {
|
|
3791
|
-
// Either an element (any slot) or a text node (only un-named slot).
|
|
3792
|
-
return (
|
|
3793
|
-
(node.nodeType === Node.ELEMENT_NODE && node.slot === slotName) ||
|
|
3794
|
-
(node.nodeType === Node.TEXT_NODE && node.textContent.trim() && slotName === '')
|
|
3795
|
-
);
|
|
3796
|
-
});
|
|
3797
|
-
}
|
|
3798
|
-
|
|
3799
|
-
/**
|
|
3800
|
-
* Return a reference to the node managed by the controller.
|
|
3801
|
-
* @return {Node}
|
|
3802
|
-
*/
|
|
3803
|
-
getSlotChild() {
|
|
3804
|
-
return this.getSlotChildren()[0];
|
|
3805
|
-
}
|
|
3806
|
-
|
|
3807
|
-
/**
|
|
3808
|
-
* Run `slotInitializer` for the node managed by the controller.
|
|
3809
|
-
*
|
|
3810
|
-
* @param {Node} node
|
|
3811
|
-
* @protected
|
|
3812
|
-
*/
|
|
3813
|
-
initNode(node) {
|
|
3814
|
-
const { slotInitializer } = this;
|
|
3815
|
-
// Don't try to bind `this` to initializer (normally it's arrow function).
|
|
3816
|
-
// Instead, pass the host as a first argument to access component's state.
|
|
3817
|
-
if (slotInitializer) {
|
|
3818
|
-
slotInitializer(node, this.host);
|
|
3819
|
-
}
|
|
3820
|
-
}
|
|
3821
|
-
|
|
3822
|
-
/**
|
|
3823
|
-
* Override to initialize the newly added custom node.
|
|
3824
|
-
*
|
|
3825
|
-
* @param {Node} _node
|
|
3826
|
-
* @protected
|
|
3827
|
-
*/
|
|
3828
|
-
initCustomNode(_node) {}
|
|
3829
|
-
|
|
3830
|
-
/**
|
|
3831
|
-
* Override to teardown slotted node when it's removed.
|
|
3832
|
-
*
|
|
3833
|
-
* @param {Node} _node
|
|
3834
|
-
* @protected
|
|
3835
|
-
*/
|
|
3836
|
-
teardownNode(_node) {}
|
|
3837
|
-
|
|
3838
|
-
/**
|
|
3839
|
-
* Run both `initCustomNode` and `initNode` for a custom slotted node.
|
|
3840
|
-
*
|
|
3841
|
-
* @param {Node} node
|
|
3842
|
-
* @protected
|
|
3843
|
-
*/
|
|
3844
|
-
initAddedNode(node) {
|
|
3845
|
-
if (node !== this.defaultNode) {
|
|
3846
|
-
this.initCustomNode(node);
|
|
3847
|
-
this.initNode(node);
|
|
3848
|
-
}
|
|
3849
|
-
}
|
|
3850
|
-
|
|
3851
|
-
/**
|
|
3852
|
-
* Setup the observer to manage slot content changes.
|
|
3853
|
-
* @protected
|
|
3854
|
-
*/
|
|
3855
|
-
observeSlot() {
|
|
3856
|
-
const { slotName } = this;
|
|
3857
|
-
const selector = slotName === '' ? 'slot:not([name])' : `slot[name=${slotName}]`;
|
|
3858
|
-
const slot = this.host.shadowRoot.querySelector(selector);
|
|
3859
|
-
|
|
3860
|
-
this.__slotObserver = new SlotObserver(slot, ({ addedNodes, removedNodes }) => {
|
|
3861
|
-
const current = this.multiple ? this.nodes : [this.node];
|
|
3862
|
-
|
|
3863
|
-
// Calling `slot.assignedNodes()` includes whitespace text nodes in case of default slot:
|
|
3864
|
-
// unlike comment nodes, they are not filtered out. So we need to manually ignore them.
|
|
3865
|
-
const newNodes = addedNodes.filter((node) => !isEmptyTextNode(node) && !current.includes(node));
|
|
3866
|
-
|
|
3867
|
-
if (removedNodes.length) {
|
|
3868
|
-
this.nodes = current.filter((node) => !removedNodes.includes(node));
|
|
3869
|
-
|
|
3870
|
-
removedNodes.forEach((node) => {
|
|
3871
|
-
this.teardownNode(node);
|
|
3872
|
-
});
|
|
3873
|
-
}
|
|
3874
|
-
|
|
3875
|
-
if (newNodes && newNodes.length > 0) {
|
|
3876
|
-
if (this.multiple) {
|
|
3877
|
-
// Remove default node if exists
|
|
3878
|
-
if (this.defaultNode) {
|
|
3879
|
-
this.defaultNode.remove();
|
|
3880
|
-
}
|
|
3881
|
-
this.nodes = [...current, ...newNodes].filter((node) => node !== this.defaultNode);
|
|
3882
|
-
newNodes.forEach((node) => {
|
|
3883
|
-
this.initAddedNode(node);
|
|
3884
|
-
});
|
|
3885
|
-
} else {
|
|
3886
|
-
// Remove previous node if exists
|
|
3887
|
-
if (this.node) {
|
|
3888
|
-
this.node.remove();
|
|
3889
|
-
}
|
|
3890
|
-
this.node = newNodes[0];
|
|
3891
|
-
this.initAddedNode(this.node);
|
|
3892
|
-
}
|
|
3893
|
-
}
|
|
3894
|
-
});
|
|
3895
|
-
}
|
|
3896
|
-
}
|
|
3897
|
-
|
|
3898
|
-
/**
|
|
3899
|
-
* @license
|
|
3900
|
-
* Copyright (c) 2022 - 2023 Vaadin Ltd.
|
|
3901
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
3902
|
-
*/
|
|
3903
|
-
|
|
3904
|
-
/**
|
|
3905
|
-
* A controller that manages the slotted tooltip element.
|
|
3906
|
-
*/
|
|
3907
|
-
class TooltipController extends SlotController {
|
|
3908
|
-
constructor(host) {
|
|
3909
|
-
// Do not provide slot factory to create tooltip lazily.
|
|
3910
|
-
super(host, 'tooltip');
|
|
3911
|
-
|
|
3912
|
-
this.setTarget(host);
|
|
3913
|
-
}
|
|
3914
|
-
|
|
3915
|
-
/**
|
|
3916
|
-
* Override to initialize the newly added custom tooltip.
|
|
3917
|
-
*
|
|
3918
|
-
* @param {Node} tooltipNode
|
|
3919
|
-
* @protected
|
|
3920
|
-
* @override
|
|
3921
|
-
*/
|
|
3922
|
-
initCustomNode(tooltipNode) {
|
|
3923
|
-
tooltipNode.target = this.target;
|
|
3924
|
-
|
|
3925
|
-
if (this.ariaTarget !== undefined) {
|
|
3926
|
-
tooltipNode.ariaTarget = this.ariaTarget;
|
|
3927
|
-
}
|
|
3928
|
-
|
|
3929
|
-
if (this.context !== undefined) {
|
|
3930
|
-
tooltipNode.context = this.context;
|
|
3931
|
-
}
|
|
3932
|
-
|
|
3933
|
-
if (this.manual !== undefined) {
|
|
3934
|
-
tooltipNode.manual = this.manual;
|
|
3935
|
-
}
|
|
3936
|
-
|
|
3937
|
-
if (this.opened !== undefined) {
|
|
3938
|
-
tooltipNode.opened = this.opened;
|
|
3939
|
-
}
|
|
3940
|
-
|
|
3941
|
-
if (this.position !== undefined) {
|
|
3942
|
-
tooltipNode._position = this.position;
|
|
3943
|
-
}
|
|
3944
|
-
|
|
3945
|
-
if (this.shouldShow !== undefined) {
|
|
3946
|
-
tooltipNode.shouldShow = this.shouldShow;
|
|
3947
|
-
}
|
|
3948
|
-
|
|
3949
|
-
this.__notifyChange();
|
|
3950
|
-
}
|
|
3951
|
-
|
|
3952
|
-
/**
|
|
3953
|
-
* Override to notify the host when the tooltip is removed.
|
|
3954
|
-
*
|
|
3955
|
-
* @param {Node} tooltipNode
|
|
3956
|
-
* @protected
|
|
3957
|
-
* @override
|
|
3958
|
-
*/
|
|
3959
|
-
teardownNode() {
|
|
3960
|
-
this.__notifyChange();
|
|
3961
|
-
}
|
|
3962
|
-
|
|
3963
|
-
/**
|
|
3964
|
-
* Set an HTML element for linking with the tooltip overlay
|
|
3965
|
-
* via `aria-describedby` attribute used by screen readers.
|
|
3966
|
-
* @param {HTMLElement} ariaTarget
|
|
3967
|
-
*/
|
|
3968
|
-
setAriaTarget(ariaTarget) {
|
|
3969
|
-
this.ariaTarget = ariaTarget;
|
|
3970
|
-
|
|
3971
|
-
const tooltipNode = this.node;
|
|
3972
|
-
if (tooltipNode) {
|
|
3973
|
-
tooltipNode.ariaTarget = ariaTarget;
|
|
3974
|
-
}
|
|
3975
|
-
}
|
|
3976
|
-
|
|
3977
|
-
/**
|
|
3978
|
-
* Set a context object to be used by generator.
|
|
3979
|
-
* @param {object} context
|
|
3980
|
-
*/
|
|
3981
|
-
setContext(context) {
|
|
3982
|
-
this.context = context;
|
|
3983
|
-
|
|
3984
|
-
const tooltipNode = this.node;
|
|
3985
|
-
if (tooltipNode) {
|
|
3986
|
-
tooltipNode.context = context;
|
|
3987
|
-
}
|
|
3988
|
-
}
|
|
3989
|
-
|
|
3990
|
-
/**
|
|
3991
|
-
* Toggle manual state on the slotted tooltip.
|
|
3992
|
-
* @param {boolean} manual
|
|
3993
|
-
*/
|
|
3994
|
-
setManual(manual) {
|
|
3995
|
-
this.manual = manual;
|
|
3996
|
-
|
|
3997
|
-
const tooltipNode = this.node;
|
|
3998
|
-
if (tooltipNode) {
|
|
3999
|
-
tooltipNode.manual = manual;
|
|
4000
|
-
}
|
|
4001
|
-
}
|
|
4002
|
-
|
|
4003
|
-
/**
|
|
4004
|
-
* Toggle opened state on the slotted tooltip.
|
|
4005
|
-
* @param {boolean} opened
|
|
4006
|
-
*/
|
|
4007
|
-
setOpened(opened) {
|
|
4008
|
-
this.opened = opened;
|
|
4009
|
-
|
|
4010
|
-
const tooltipNode = this.node;
|
|
4011
|
-
if (tooltipNode) {
|
|
4012
|
-
tooltipNode.opened = opened;
|
|
4013
|
-
}
|
|
4014
|
-
}
|
|
4015
|
-
|
|
4016
|
-
/**
|
|
4017
|
-
* Set default position for the slotted tooltip.
|
|
4018
|
-
* This can be overridden by setting the position
|
|
4019
|
-
* using corresponding property or attribute.
|
|
4020
|
-
* @param {string} position
|
|
4021
|
-
*/
|
|
4022
|
-
setPosition(position) {
|
|
4023
|
-
this.position = position;
|
|
4024
|
-
|
|
4025
|
-
const tooltipNode = this.node;
|
|
4026
|
-
if (tooltipNode) {
|
|
4027
|
-
tooltipNode._position = position;
|
|
4028
|
-
}
|
|
4029
|
-
}
|
|
4030
|
-
|
|
4031
|
-
/**
|
|
4032
|
-
* Set function used to detect whether to show
|
|
4033
|
-
* the tooltip based on a condition.
|
|
4034
|
-
* @param {Function} shouldShow
|
|
4035
|
-
*/
|
|
4036
|
-
setShouldShow(shouldShow) {
|
|
4037
|
-
this.shouldShow = shouldShow;
|
|
4038
|
-
|
|
4039
|
-
const tooltipNode = this.node;
|
|
4040
|
-
if (tooltipNode) {
|
|
4041
|
-
tooltipNode.shouldShow = shouldShow;
|
|
4042
|
-
}
|
|
4043
|
-
}
|
|
4044
|
-
|
|
4045
|
-
/**
|
|
4046
|
-
* Set an HTML element to attach the tooltip to.
|
|
4047
|
-
* @param {HTMLElement} target
|
|
4048
|
-
*/
|
|
4049
|
-
setTarget(target) {
|
|
4050
|
-
this.target = target;
|
|
4051
|
-
|
|
4052
|
-
const tooltipNode = this.node;
|
|
4053
|
-
if (tooltipNode) {
|
|
4054
|
-
tooltipNode.target = target;
|
|
4055
|
-
}
|
|
4056
|
-
}
|
|
4057
|
-
|
|
4058
|
-
/** @private */
|
|
4059
|
-
__notifyChange() {
|
|
4060
|
-
this.dispatchEvent(new CustomEvent('tooltip-changed', { detail: { node: this.node } }));
|
|
4061
|
-
}
|
|
4062
|
-
}
|
|
4063
|
-
|
|
4064
|
-
/**
|
|
4065
|
-
* @license
|
|
4066
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
4067
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
4068
|
-
*/
|
|
4069
|
-
|
|
4070
|
-
/**
|
|
4071
|
-
* A mixin to provide `pattern` property.
|
|
4072
|
-
*
|
|
4073
|
-
* @polymerMixin
|
|
4074
|
-
* @mixes InputConstraintsMixin
|
|
4075
|
-
*/
|
|
4076
|
-
const PatternMixin = (superclass) =>
|
|
4077
|
-
class PatternMixinClass extends InputConstraintsMixin(superclass) {
|
|
4078
|
-
static get properties() {
|
|
4079
|
-
return {
|
|
4080
|
-
/**
|
|
4081
|
-
* A regular expression that the value is checked against.
|
|
4082
|
-
* The pattern must match the entire value, not just some subset.
|
|
4083
|
-
*/
|
|
4084
|
-
pattern: {
|
|
4085
|
-
type: String,
|
|
4086
|
-
},
|
|
4087
|
-
};
|
|
4088
|
-
}
|
|
4089
|
-
|
|
4090
|
-
static get delegateAttrs() {
|
|
4091
|
-
return [...super.delegateAttrs, 'pattern'];
|
|
4092
|
-
}
|
|
4093
|
-
|
|
4094
|
-
static get constraints() {
|
|
4095
|
-
return [...super.constraints, 'pattern'];
|
|
4096
|
-
}
|
|
4097
|
-
};
|
|
4098
|
-
|
|
4099
|
-
/**
|
|
4100
|
-
* @license
|
|
4101
|
-
* Copyright (c) 2015 - 2023 Vaadin Ltd.
|
|
4102
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
4103
|
-
*/
|
|
4104
|
-
|
|
4105
|
-
/**
|
|
4106
|
-
* @polymerMixin
|
|
4107
|
-
*/
|
|
4108
|
-
const ComboBoxDataProviderMixin = (superClass) =>
|
|
4109
|
-
class DataProviderMixin extends superClass {
|
|
4110
|
-
static get properties() {
|
|
4111
|
-
return {
|
|
4112
|
-
/**
|
|
4113
|
-
* Number of items fetched at a time from the dataprovider.
|
|
4114
|
-
* @attr {number} page-size
|
|
4115
|
-
* @type {number}
|
|
4116
|
-
*/
|
|
4117
|
-
pageSize: {
|
|
4118
|
-
type: Number,
|
|
4119
|
-
value: 50,
|
|
4120
|
-
observer: '_pageSizeChanged',
|
|
4121
|
-
},
|
|
4122
|
-
|
|
4123
|
-
/**
|
|
4124
|
-
* Total number of items.
|
|
4125
|
-
* @type {number | undefined}
|
|
4126
|
-
*/
|
|
4127
|
-
size: {
|
|
4128
|
-
type: Number,
|
|
4129
|
-
observer: '_sizeChanged',
|
|
4130
|
-
},
|
|
2573
|
+
/**
|
|
2574
|
+
* Total number of items.
|
|
2575
|
+
* @type {number | undefined}
|
|
2576
|
+
*/
|
|
2577
|
+
size: {
|
|
2578
|
+
type: Number,
|
|
2579
|
+
observer: '_sizeChanged',
|
|
2580
|
+
},
|
|
4131
2581
|
|
|
4132
2582
|
/**
|
|
4133
2583
|
* Function that provides items lazily. Receives arguments `params`, `callback`
|
|
@@ -4423,167 +2873,6 @@ const ComboBoxDataProviderMixin = (superClass) =>
|
|
|
4423
2873
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
4424
2874
|
*/
|
|
4425
2875
|
|
|
4426
|
-
/**
|
|
4427
|
-
* @typedef ReactiveController
|
|
4428
|
-
* @type {import('lit').ReactiveController}
|
|
4429
|
-
*/
|
|
4430
|
-
|
|
4431
|
-
/**
|
|
4432
|
-
* A mixin for connecting controllers to the element.
|
|
4433
|
-
*
|
|
4434
|
-
* @polymerMixin
|
|
4435
|
-
*/
|
|
4436
|
-
const ControllerMixin = dedupingMixin((superClass) => {
|
|
4437
|
-
// If the superclass extends from LitElement,
|
|
4438
|
-
// use its own controllers implementation.
|
|
4439
|
-
if (typeof superClass.prototype.addController === 'function') {
|
|
4440
|
-
return superClass;
|
|
4441
|
-
}
|
|
4442
|
-
|
|
4443
|
-
return class ControllerMixinClass extends superClass {
|
|
4444
|
-
constructor() {
|
|
4445
|
-
super();
|
|
4446
|
-
|
|
4447
|
-
/**
|
|
4448
|
-
* @type {Set<ReactiveController>}
|
|
4449
|
-
*/
|
|
4450
|
-
this.__controllers = new Set();
|
|
4451
|
-
}
|
|
4452
|
-
|
|
4453
|
-
/** @protected */
|
|
4454
|
-
connectedCallback() {
|
|
4455
|
-
super.connectedCallback();
|
|
4456
|
-
|
|
4457
|
-
this.__controllers.forEach((c) => {
|
|
4458
|
-
if (c.hostConnected) {
|
|
4459
|
-
c.hostConnected();
|
|
4460
|
-
}
|
|
4461
|
-
});
|
|
4462
|
-
}
|
|
4463
|
-
|
|
4464
|
-
/** @protected */
|
|
4465
|
-
disconnectedCallback() {
|
|
4466
|
-
super.disconnectedCallback();
|
|
4467
|
-
|
|
4468
|
-
this.__controllers.forEach((c) => {
|
|
4469
|
-
if (c.hostDisconnected) {
|
|
4470
|
-
c.hostDisconnected();
|
|
4471
|
-
}
|
|
4472
|
-
});
|
|
4473
|
-
}
|
|
4474
|
-
|
|
4475
|
-
/**
|
|
4476
|
-
* Registers a controller to participate in the element update cycle.
|
|
4477
|
-
*
|
|
4478
|
-
* @param {ReactiveController} controller
|
|
4479
|
-
* @protected
|
|
4480
|
-
*/
|
|
4481
|
-
addController(controller) {
|
|
4482
|
-
this.__controllers.add(controller);
|
|
4483
|
-
// Call hostConnected if a controller is added after the element is attached.
|
|
4484
|
-
if (this.$ !== undefined && this.isConnected && controller.hostConnected) {
|
|
4485
|
-
controller.hostConnected();
|
|
4486
|
-
}
|
|
4487
|
-
}
|
|
4488
|
-
|
|
4489
|
-
/**
|
|
4490
|
-
* Removes a controller from the element.
|
|
4491
|
-
*
|
|
4492
|
-
* @param {ReactiveController} controller
|
|
4493
|
-
* @protected
|
|
4494
|
-
*/
|
|
4495
|
-
removeController(controller) {
|
|
4496
|
-
this.__controllers.delete(controller);
|
|
4497
|
-
}
|
|
4498
|
-
};
|
|
4499
|
-
});
|
|
4500
|
-
|
|
4501
|
-
/**
|
|
4502
|
-
* @license
|
|
4503
|
-
* Copyright (c) 2023 Vaadin Ltd.
|
|
4504
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
4505
|
-
*/
|
|
4506
|
-
|
|
4507
|
-
/**
|
|
4508
|
-
* A mixin that forwards CSS class names to the internal overlay element
|
|
4509
|
-
* by setting the `overlayClass` property or `overlay-class` attribute.
|
|
4510
|
-
*
|
|
4511
|
-
* @polymerMixin
|
|
4512
|
-
*/
|
|
4513
|
-
const OverlayClassMixin = (superclass) =>
|
|
4514
|
-
class OverlayClassMixinClass extends superclass {
|
|
4515
|
-
static get properties() {
|
|
4516
|
-
return {
|
|
4517
|
-
/**
|
|
4518
|
-
* A space-delimited list of CSS class names to set on the overlay element.
|
|
4519
|
-
* This property does not affect other CSS class names set manually via JS.
|
|
4520
|
-
*
|
|
4521
|
-
* Note, if the CSS class name was set with this property, clearing it will
|
|
4522
|
-
* remove it from the overlay, even if the same class name was also added
|
|
4523
|
-
* manually, e.g. by using `classList.add()` in the `renderer` function.
|
|
4524
|
-
*
|
|
4525
|
-
* @attr {string} overlay-class
|
|
4526
|
-
*/
|
|
4527
|
-
overlayClass: {
|
|
4528
|
-
type: String,
|
|
4529
|
-
},
|
|
4530
|
-
|
|
4531
|
-
/**
|
|
4532
|
-
* An overlay element on which CSS class names are set.
|
|
4533
|
-
*
|
|
4534
|
-
* @protected
|
|
4535
|
-
*/
|
|
4536
|
-
_overlayElement: {
|
|
4537
|
-
type: Object,
|
|
4538
|
-
},
|
|
4539
|
-
};
|
|
4540
|
-
}
|
|
4541
|
-
|
|
4542
|
-
static get observers() {
|
|
4543
|
-
return ['__updateOverlayClassNames(overlayClass, _overlayElement)'];
|
|
4544
|
-
}
|
|
4545
|
-
|
|
4546
|
-
/** @private */
|
|
4547
|
-
__updateOverlayClassNames(overlayClass, overlayElement) {
|
|
4548
|
-
if (!overlayElement) {
|
|
4549
|
-
return;
|
|
4550
|
-
}
|
|
4551
|
-
|
|
4552
|
-
// Overlay is set but overlayClass is not set
|
|
4553
|
-
if (overlayClass === undefined) {
|
|
4554
|
-
return;
|
|
4555
|
-
}
|
|
4556
|
-
|
|
4557
|
-
const { classList } = overlayElement;
|
|
4558
|
-
|
|
4559
|
-
if (!this.__initialClasses) {
|
|
4560
|
-
this.__initialClasses = new Set(classList);
|
|
4561
|
-
}
|
|
4562
|
-
|
|
4563
|
-
if (Array.isArray(this.__previousClasses)) {
|
|
4564
|
-
// Remove old classes that no longer apply
|
|
4565
|
-
const classesToRemove = this.__previousClasses.filter((name) => !this.__initialClasses.has(name));
|
|
4566
|
-
if (classesToRemove.length > 0) {
|
|
4567
|
-
classList.remove(...classesToRemove);
|
|
4568
|
-
}
|
|
4569
|
-
}
|
|
4570
|
-
|
|
4571
|
-
// Add new classes based on the overlayClass
|
|
4572
|
-
const classesToAdd = typeof overlayClass === 'string' ? overlayClass.split(' ') : [];
|
|
4573
|
-
if (classesToAdd.length > 0) {
|
|
4574
|
-
classList.add(...classesToAdd);
|
|
4575
|
-
}
|
|
4576
|
-
|
|
4577
|
-
this.__previousClasses = classesToAdd;
|
|
4578
|
-
}
|
|
4579
|
-
};
|
|
4580
|
-
|
|
4581
|
-
/**
|
|
4582
|
-
* @license
|
|
4583
|
-
* Copyright (c) 2021 - 2023 Vaadin Ltd.
|
|
4584
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
4585
|
-
*/
|
|
4586
|
-
|
|
4587
2876
|
/**
|
|
4588
2877
|
* Passes the component to the template renderer callback if the template renderer is imported.
|
|
4589
2878
|
* Otherwise, if there is a template, it warns that the template renderer needs to be imported.
|