@descope/web-components-ui 1.7.0 → 1.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/dist/cjs/index.cjs.js +2024 -1650
  2. package/dist/cjs/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +2266 -1619
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/umd/1484.js +1 -1
  6. package/dist/umd/1738.js +1 -0
  7. package/dist/umd/1902.js +373 -0
  8. package/dist/umd/404.js +1 -1
  9. package/dist/umd/4127.js +1 -1
  10. package/dist/umd/4619.js +1 -1
  11. package/dist/umd/6050.js +237 -0
  12. package/dist/umd/{2159.js.LICENSE.txt → 6050.js.LICENSE.txt} +0 -6
  13. package/dist/umd/8823.js +1 -1
  14. package/dist/umd/DescopeDev.js +1 -1
  15. package/dist/umd/descope-alert-index-js.js +1 -1
  16. package/dist/umd/descope-autocomplete-field.js +1 -0
  17. package/dist/umd/descope-combo-box.js +7 -7
  18. package/dist/umd/descope-date-field-descope-calendar-index-js.js +1 -1
  19. package/dist/umd/descope-hybrid-field-index-js.js +3 -3
  20. package/dist/umd/descope-passcode-descope-passcode-internal-index-js.js +1 -1
  21. package/dist/umd/descope-passcode-index-js.js +37 -1
  22. package/dist/umd/descope-passcode-index-js.js.LICENSE.txt +11 -0
  23. package/dist/umd/descope-security-questions-setup-index-js.js +1 -1
  24. package/dist/umd/index.js +1 -1
  25. package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
  26. package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js +1 -1
  27. package/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
  28. package/dist/umd/phone-fields-descope-phone-field-index-js.js +1 -1
  29. package/dist/umd/phone-fields-descope-phone-input-box-field-index-js.js +8 -8
  30. package/package.json +6 -5
  31. package/src/mixins/normalizeBooleanAttributesMixin.js +1 -0
  32. package/src/theme/components/index.js +2 -0
  33. package/dist/umd/1396.js +0 -37
  34. package/dist/umd/2159.js +0 -608
  35. /package/dist/umd/{1396.js.LICENSE.txt → 1902.js.LICENSE.txt} +0 -0
package/dist/umd/2159.js DELETED
@@ -1,608 +0,0 @@
1
- /*! For license information please see 2159.js.LICENSE.txt */
2
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[404,2159,4127],{84312:(t,e,o)=>{o.d(e,{$:()=>m});var a=o(98633),r=o(56096),i=o(65211),s=o(27150),n=o(83798),l=o(57224);const d=o(44720).AH`
3
- :host {
4
- display: inline-block;
5
- position: relative;
6
- outline: none;
7
- white-space: nowrap;
8
- -webkit-user-select: none;
9
- -moz-user-select: none;
10
- user-select: none;
11
- }
12
-
13
- :host([hidden]) {
14
- display: none !important;
15
- }
16
-
17
- /* Aligns the button with form fields when placed on the same line.
18
- Note, to make it work, the form fields should have the same "::before" pseudo-element. */
19
- .vaadin-button-container::before {
20
- content: '\\2003';
21
- display: inline-block;
22
- width: 0;
23
- max-height: 100%;
24
- }
25
-
26
- .vaadin-button-container {
27
- display: inline-flex;
28
- align-items: center;
29
- justify-content: center;
30
- text-align: center;
31
- width: 100%;
32
- height: 100%;
33
- min-height: inherit;
34
- text-shadow: inherit;
35
- }
36
-
37
- [part='prefix'],
38
- [part='suffix'] {
39
- flex: none;
40
- }
41
-
42
- [part='label'] {
43
- white-space: nowrap;
44
- overflow: hidden;
45
- text-overflow: ellipsis;
46
- }
47
-
48
- @media (forced-colors: active) {
49
- :host {
50
- outline: 1px solid;
51
- outline-offset: -1px;
52
- }
53
-
54
- :host([focused]) {
55
- outline-width: 2px;
56
- }
57
-
58
- :host([disabled]) {
59
- outline-color: GrayText;
60
- }
61
- }
62
- `;var u=o(63437),c=o(73595),h=o(45898);const p=t=>class extends((0,u.e)((0,h.l)((0,c.y)(t)))){static get properties(){return{tabindex:{type:Number,value:0,reflectToAttribute:!0}}}get _activeKeys(){return["Enter"," "]}ready(){super.ready(),this.hasAttribute("role")||this.setAttribute("role","button")}_onKeyDown(t){super._onKeyDown(t),t.altKey||t.shiftKey||t.ctrlKey||t.metaKey||this._activeKeys.includes(t.key)&&(t.preventDefault(),this.click())}};(0,l.SF)("vaadin-button",d,{moduleId:"vaadin-button-styles"});class m extends(p((0,s.q)((0,l.cp)((0,r.w)(a.Pu))))){static get is(){return"vaadin-button"}static get template(){return a.qy`
63
- <div class="vaadin-button-container">
64
- <span part="prefix" aria-hidden="true">
65
- <slot name="prefix"></slot>
66
- </span>
67
- <span part="label">
68
- <slot></slot>
69
- </span>
70
- <span part="suffix" aria-hidden="true">
71
- <slot name="suffix"></slot>
72
- </span>
73
- </div>
74
- <slot name="tooltip"></slot>
75
- `}ready(){super.ready(),this._tooltipController=new n.I(this),this.addController(this._tooltipController)}}(0,i.X)(m)},89685:(t,e,o)=>{o.d(e,{x:()=>r}),o(44497),o(4082),o(19155),o(40999),o(52301);var a=o(57224);const r=a.AH`
76
- :host {
77
- /* Sizing */
78
- --lumo-button-size: var(--lumo-size-m);
79
- min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));
80
- height: var(--_button-size);
81
- padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));
82
- margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);
83
- box-sizing: border-box;
84
- /* Style */
85
- font-family: var(--lumo-font-family);
86
- font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));
87
- font-weight: var(--vaadin-button-font-weight, 500);
88
- color: var(--_lumo-button-text-color);
89
- background: var(--_lumo-button-background);
90
- border: var(--vaadin-button-border, none);
91
- border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));
92
- cursor: var(--lumo-clickable-cursor);
93
- -webkit-tap-highlight-color: transparent;
94
- -webkit-font-smoothing: antialiased;
95
- -moz-osx-font-smoothing: grayscale;
96
- flex-shrink: 0;
97
- --_button-size: var(--vaadin-button-height, var(--lumo-button-size));
98
- --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
99
- --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
100
- /* Used by notification */
101
- --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));
102
- --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));
103
- --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));
104
- --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));
105
- }
106
-
107
- /* Set only for the internal parts so we don't affect the host vertical alignment */
108
- [part='label'],
109
- [part='prefix'],
110
- [part='suffix'] {
111
- line-height: var(--lumo-line-height-xs);
112
- }
113
-
114
- [part='label'] {
115
- padding: calc(var(--lumo-button-size) / 6) 0;
116
- }
117
-
118
- :host([theme~='small']) {
119
- font-size: var(--lumo-font-size-s);
120
- --lumo-button-size: var(--lumo-size-s);
121
- }
122
-
123
- :host([theme~='large']) {
124
- font-size: var(--lumo-font-size-l);
125
- --lumo-button-size: var(--lumo-size-l);
126
- }
127
-
128
- /* For interaction states */
129
- :host::before,
130
- :host::after {
131
- content: '';
132
- /* We rely on the host always being relative */
133
- position: absolute;
134
- z-index: 1;
135
- inset: 0;
136
- background-color: currentColor;
137
- border-radius: inherit;
138
- opacity: 0;
139
- pointer-events: none;
140
- }
141
-
142
- /* Hover */
143
-
144
- @media (any-hover: hover) {
145
- :host(:hover)::before {
146
- opacity: 0.02;
147
- }
148
- }
149
-
150
- /* Active */
151
-
152
- :host::after {
153
- transition: opacity 1.4s, transform 0.1s;
154
- filter: blur(8px);
155
- }
156
-
157
- :host([active])::before {
158
- opacity: 0.05;
159
- transition-duration: 0s;
160
- }
161
-
162
- :host([active])::after {
163
- opacity: 0.1;
164
- transition-duration: 0s, 0s;
165
- transform: scale(0);
166
- }
167
-
168
- /* Keyboard focus */
169
-
170
- :host([focus-ring]) {
171
- box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
172
- }
173
-
174
- :host([theme~='primary'][focus-ring]) {
175
- box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);
176
- }
177
-
178
- /* Types (primary, tertiary, tertiary-inline */
179
-
180
- :host([theme~='tertiary']),
181
- :host([theme~='tertiary-inline']) {
182
- --_background: transparent !important;
183
- background: var(--vaadin-button-tertiary-background, var(--_background));
184
- min-width: 0;
185
- }
186
-
187
- :host([theme~='tertiary']) {
188
- border: var(--vaadin-button-tertiary-border, none);
189
- color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));
190
- font-weight: var(--vaadin-button-tertiary-font-weight, 500);
191
- padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));
192
- }
193
-
194
- :host([theme~='tertiary-inline'])::before {
195
- display: none;
196
- }
197
-
198
- :host([theme~='tertiary-inline']) {
199
- margin: 0;
200
- height: auto;
201
- padding: 0;
202
- line-height: inherit;
203
- font-size: inherit;
204
- }
205
-
206
- :host([theme~='tertiary-inline']) [part='label'] {
207
- padding: 0;
208
- overflow: visible;
209
- line-height: inherit;
210
- }
211
-
212
- :host([theme~='primary']) {
213
- background: var(--_lumo-button-primary-background);
214
- border: var(--vaadin-button-primary-border, none);
215
- color: var(--_lumo-button-primary-text-color);
216
- font-weight: var(--vaadin-button-primary-font-weight, 600);
217
- min-width: calc(var(--lumo-button-size) * 2.5);
218
- }
219
-
220
- :host([theme~='primary'])::before {
221
- background-color: black;
222
- }
223
-
224
- @media (any-hover: hover) {
225
- :host([theme~='primary']:hover)::before {
226
- opacity: 0.05;
227
- }
228
- }
229
-
230
- :host([theme~='primary'][active])::before {
231
- opacity: 0.1;
232
- }
233
-
234
- :host([theme~='primary'][active])::after {
235
- opacity: 0.2;
236
- }
237
-
238
- /* Colors (success, error, contrast) */
239
-
240
- :host([theme~='success']) {
241
- color: var(--lumo-success-text-color);
242
- }
243
-
244
- :host([theme~='success'][theme~='primary']) {
245
- background-color: var(--lumo-success-color);
246
- color: var(--lumo-success-contrast-color);
247
- }
248
-
249
- :host([theme~='error']) {
250
- color: var(--lumo-error-text-color);
251
- }
252
-
253
- :host([theme~='error'][theme~='primary']) {
254
- background-color: var(--lumo-error-color);
255
- color: var(--lumo-error-contrast-color);
256
- }
257
-
258
- :host([theme~='contrast']) {
259
- color: var(--lumo-contrast);
260
- }
261
-
262
- :host([theme~='contrast'][theme~='primary']) {
263
- background-color: var(--lumo-contrast);
264
- color: var(--lumo-base-color);
265
- }
266
-
267
- /* Disabled state. Keep selectors after other color variants. */
268
-
269
- :host([disabled]) {
270
- pointer-events: none;
271
- color: var(--lumo-disabled-text-color);
272
- }
273
-
274
- :host([theme~='primary'][disabled]) {
275
- background-color: var(--lumo-contrast-30pct);
276
- color: var(--lumo-base-color);
277
- }
278
-
279
- :host([theme~='primary'][disabled]) [part] {
280
- opacity: 0.7;
281
- }
282
-
283
- /* Icons */
284
-
285
- [part] ::slotted(vaadin-icon) {
286
- display: inline-block;
287
- width: var(--lumo-icon-size-m);
288
- height: var(--lumo-icon-size-m);
289
- }
290
-
291
- /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */
292
- [part] ::slotted(vaadin-icon[icon^='vaadin:']) {
293
- padding: 0.25em;
294
- box-sizing: border-box !important;
295
- }
296
-
297
- [part='prefix'] {
298
- margin-left: -0.25em;
299
- margin-right: 0.25em;
300
- }
301
-
302
- [part='suffix'] {
303
- margin-left: 0.25em;
304
- margin-right: -0.25em;
305
- }
306
-
307
- /* Icon-only */
308
-
309
- :host([theme~='icon']:not([theme~='tertiary-inline'])) {
310
- min-width: var(--lumo-button-size);
311
- padding-left: calc(var(--lumo-button-size) / 4);
312
- padding-right: calc(var(--lumo-button-size) / 4);
313
- }
314
-
315
- :host([theme~='icon']) [part='prefix'],
316
- :host([theme~='icon']) [part='suffix'] {
317
- margin-left: 0;
318
- margin-right: 0;
319
- }
320
-
321
- /* RTL specific styles */
322
-
323
- :host([dir='rtl']) [part='prefix'] {
324
- margin-left: 0.25em;
325
- margin-right: -0.25em;
326
- }
327
-
328
- :host([dir='rtl']) [part='suffix'] {
329
- margin-left: -0.25em;
330
- margin-right: 0.25em;
331
- }
332
-
333
- :host([dir='rtl'][theme~='icon']) [part='prefix'],
334
- :host([dir='rtl'][theme~='icon']) [part='suffix'] {
335
- margin-left: 0;
336
- margin-right: 0;
337
- }
338
- `;(0,a.SF)("vaadin-button",r,{moduleId:"lumo-button"})},55093:(t,e,o)=>{o(89685),o(84312)},91011:(t,e,o)=>{o(73593),o(97612),o(67239),o(34123);var a=o(80704),r=o(57224);const i=r.AH`
339
- :host {
340
- outline: none;
341
- }
342
-
343
- [part='toggle-button']::before {
344
- content: var(--lumo-icons-dropdown);
345
- }
346
- `;(0,r.SF)("vaadin-combo-box",[a.k,i],{moduleId:"lumo-combo-box"}),o(94009);var s=o(98633),n=o(65211),l=o(38785),d=o(14495);class u extends((0,d.y)((0,r.cp)((0,l.v)(s.Pu)))){static get template(){return s.qy`
347
- <style>
348
- :host {
349
- display: block;
350
- }
351
-
352
- :host([hidden]) {
353
- display: none;
354
- }
355
- </style>
356
- <span part="checkmark" aria-hidden="true"></span>
357
- <div part="content">
358
- <slot></slot>
359
- </div>
360
- `}static get is(){return"vaadin-combo-box-item"}}(0,n.X)(u);var c=o(6019),h=o(31146),p=o(31278);const m=r.AH`
361
- #overlay {
362
- width: var(--vaadin-combo-box-overlay-width, var(--_vaadin-combo-box-overlay-default-width, auto));
363
- }
364
-
365
- [part='content'] {
366
- display: flex;
367
- flex-direction: column;
368
- height: 100%;
369
- }
370
- `;(0,r.SF)("vaadin-combo-box-overlay",[h.B,m],{moduleId:"vaadin-combo-box-overlay-styles"});class v extends((0,p.p)((0,c.c)((0,l.v)((0,r.cp)(s.Pu))))){static get is(){return"vaadin-combo-box-overlay"}static get template(){return s.qy`
371
- <div id="backdrop" part="backdrop" hidden></div>
372
- <div part="overlay" id="overlay">
373
- <div part="loader"></div>
374
- <div part="content" id="content"><slot></slot></div>
375
- </div>
376
- `}}(0,n.X)(v);var b=o(82642);class g extends((0,b.N)(s.Pu)){static get is(){return"vaadin-combo-box-scroller"}static get template(){return s.qy`
377
- <style>
378
- :host {
379
- display: block;
380
- min-height: 1px;
381
- overflow: auto;
382
-
383
- /* Fixes item background from getting on top of scrollbars on Safari */
384
- transform: translate3d(0, 0, 0);
385
-
386
- /* Enable momentum scrolling on iOS */
387
- -webkit-overflow-scrolling: touch;
388
-
389
- /* Fixes scrollbar disappearing when 'Show scroll bars: Always' enabled in Safari */
390
- box-shadow: 0 0 0 white;
391
- }
392
-
393
- #selector {
394
- border-width: var(--_vaadin-combo-box-items-container-border-width);
395
- border-style: var(--_vaadin-combo-box-items-container-border-style);
396
- border-color: var(--_vaadin-combo-box-items-container-border-color, transparent);
397
- position: relative;
398
- }
399
- </style>
400
- <div id="selector">
401
- <slot></slot>
402
- </div>
403
- `}}(0,n.X)(g);var f=o(27150),y=o(83798),x=o(60354),_=o(21860),w=o(19074),k=o(45446);const z=t=>class extends((0,k.U)(t)){static get properties(){return{pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"pattern"]}static get constraints(){return[...super.constraints,"pattern"]}};var C=o(9685),S=o(79372),I=o(34060);(0,r.SF)("vaadin-combo-box",C.k,{moduleId:"vaadin-combo-box-styles"});class F extends((0,S.K)((0,I.x)(z((0,x.R)((0,r.cp)((0,f.q)(s.Pu))))))){static get is(){return"vaadin-combo-box"}static get template(){return s.qy`
404
- <style>
405
- :host([opened]) {
406
- pointer-events: auto;
407
- }
408
- </style>
409
-
410
- <div class="vaadin-combo-box-container">
411
- <div part="label">
412
- <slot name="label"></slot>
413
- <span part="required-indicator" aria-hidden="true" on-click="focus"></span>
414
- </div>
415
-
416
- <vaadin-input-container
417
- part="input-field"
418
- readonly="[[readonly]]"
419
- disabled="[[disabled]]"
420
- invalid="[[invalid]]"
421
- theme$="[[_theme]]"
422
- >
423
- <slot name="prefix" slot="prefix"></slot>
424
- <slot name="input"></slot>
425
- <div id="clearButton" part="clear-button" slot="suffix" aria-hidden="true"></div>
426
- <div id="toggleButton" part="toggle-button" slot="suffix" aria-hidden="true"></div>
427
- </vaadin-input-container>
428
-
429
- <div part="helper-text">
430
- <slot name="helper"></slot>
431
- </div>
432
-
433
- <div part="error-message">
434
- <slot name="error-message"></slot>
435
- </div>
436
- </div>
437
-
438
- <vaadin-combo-box-overlay
439
- id="overlay"
440
- opened="[[_overlayOpened]]"
441
- loading$="[[loading]]"
442
- theme$="[[_theme]]"
443
- position-target="[[_positionTarget]]"
444
- no-vertical-overlap
445
- restore-focus-node="[[inputElement]]"
446
- ></vaadin-combo-box-overlay>
447
-
448
- <slot name="tooltip"></slot>
449
- `}static get properties(){return{_positionTarget:{type:Object}}}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new _.f(this,(t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t}))),this.addController(new w.q(this.inputElement,this._labelController)),this._tooltipController=new y.I(this),this.addController(this._tooltipController),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this._tooltipController.setShouldShow((t=>!t.opened)),this._positionTarget=this.shadowRoot.querySelector('[part="input-field"]'),this._toggleElement=this.$.toggleButton}_onClearButtonClick(t){t.stopPropagation(),super._onClearButtonClick(t)}_onHostClick(t){const e=t.composedPath();(e.includes(this._labelNode)||e.includes(this._positionTarget))&&super._onHostClick(t)}}(0,n.X)(F)},40200:(t,e,o)=>{o(44497),o(4082),o(19155),o(52301);var a=o(71005),r=o(4749),i=o(57224);const s=i.AH`
450
- :host {
451
- --lumo-text-field-size: var(--lumo-size-m);
452
- color: var(--lumo-body-text-color);
453
- font-size: var(--lumo-font-size-m);
454
- /* align with text-field height + vertical paddings */
455
- line-height: calc(var(--lumo-text-field-size) + 2 * var(--lumo-space-xs));
456
- font-family: var(--lumo-font-family);
457
- -webkit-font-smoothing: antialiased;
458
- -moz-osx-font-smoothing: grayscale;
459
- -webkit-tap-highlight-color: transparent;
460
- padding: 0;
461
- }
462
-
463
- :host::before {
464
- margin-top: var(--lumo-space-xs);
465
- height: var(--lumo-text-field-size);
466
- box-sizing: border-box;
467
- display: inline-flex;
468
- align-items: center;
469
- }
470
-
471
- /* align with text-field label */
472
- :host([has-label]) [part='label'] {
473
- padding-bottom: calc(0.5em - var(--lumo-space-xs));
474
- }
475
-
476
- :host(:not([has-label])) [part='label'],
477
- :host(:not([has-label]))::before {
478
- display: none;
479
- }
480
-
481
- /* align with text-field error message */
482
- :host([has-error-message]) [part='error-message']::before {
483
- height: calc(0.4em - var(--lumo-space-xs));
484
- }
485
-
486
- :host([focused]:not([readonly]):not([disabled])) [part='label'] {
487
- color: var(--lumo-primary-text-color);
488
- }
489
-
490
- :host(:hover:not([readonly]):not([disabled]):not([focused])) [part='label'],
491
- :host(:hover:not([readonly]):not([disabled]):not([focused])) [part='helper-text'] {
492
- color: var(--lumo-body-text-color);
493
- }
494
-
495
- /* Touch device adjustment */
496
- @media (pointer: coarse) {
497
- :host(:hover:not([readonly]):not([disabled]):not([focused])) [part='label'] {
498
- color: var(--lumo-secondary-text-color);
499
- }
500
- }
501
-
502
- /* Disabled */
503
- :host([disabled]) [part='label'] {
504
- color: var(--lumo-disabled-text-color);
505
- -webkit-text-fill-color: var(--lumo-disabled-text-color);
506
- }
507
-
508
- /* Small theme */
509
- :host([theme~='small']) {
510
- font-size: var(--lumo-font-size-s);
511
- --lumo-text-field-size: var(--lumo-size-s);
512
- }
513
-
514
- :host([theme~='small'][has-label]) [part='label'] {
515
- font-size: var(--lumo-font-size-xs);
516
- }
517
-
518
- :host([theme~='small'][has-label]) [part='error-message'] {
519
- font-size: var(--lumo-font-size-xxs);
520
- }
521
-
522
- /* When custom-field is used with components without outer margin */
523
- :host([theme~='whitespace'][has-label]) [part='label'] {
524
- padding-bottom: 0.5em;
525
- }
526
- `;(0,i.SF)("vaadin-custom-field",[r.Q,a.d,s],{moduleId:"lumo-custom-field"});var n=o(98633),l=o(65211),d=o(27150),u=o(73595),c=o(79258),h=o(7094),p=o(83798),m=o(12850);const v=t=>t.split("\t"),b=t=>t.join("\t"),g=t=>class extends((0,m.Y)((0,u.y)((0,c.f)(t)))){static get properties(){return{name:String,value:{type:String,observer:"__valueChanged",notify:!0},inputs:{type:Array,readOnly:!0},formatValue:{type:Function},parseValue:{type:Function}}}ready(){super.ready(),this.setAttribute("role","group"),this.ariaTarget=this,this.__childrenObserver=new MutationObserver((()=>{this.__setInputsFromSlot()})),this.__setInputsFromSlot(),this.$.slot.addEventListener("slotchange",(()=>{this.__setInputsFromSlot(),(0,h.J$)(this.$.slot).filter((t=>!this.__isInput(t))).forEach((t=>{this.__childrenObserver.observe(t,{childList:!0})}))})),this._tooltipController=new p.I(this),this.addController(this._tooltipController),this._tooltipController.setShouldShow((t=>!(t.inputs||[]).some((t=>t.opened))))}focus(){this.inputs&&this.inputs[0]&&this.inputs[0].focus()}_setFocused(t){super._setFocused(t),t||this.validate()}_shouldRemoveFocus(t){const{relatedTarget:e}=t;return!this.inputs.some((t=>e===(t.focusElement||t)))}checkValidity(){return!(this.inputs.filter((t=>!(t.validate||t.checkValidity).call(t))).length||this.required&&!this.value.trim())}_onKeyDown(t){"Tab"===t.key&&(this.inputs.indexOf(t.target)<this.inputs.length-1&&!t.shiftKey||this.inputs.indexOf(t.target)>0&&t.shiftKey?this.dispatchEvent(new CustomEvent("internal-tab")):this.__setValue())}_onInputChange(t){t.stopPropagation(),this.__setValue(),this.validate(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!1,detail:{value:this.value}}))}__setValue(){this.__settingValue=!0;const t=this.formatValue||b;this.value=t.apply(this,[this.inputs.map((t=>t.value))]),this.__settingValue=!1}__isInput(t){return!("input"===t.getAttribute("slot")||"textarea"===t.getAttribute("slot"))&&(t.validate||t.checkValidity)}__getInputsFromSlot(){return(0,h.J$)(this.$.slot).filter((t=>this.__isInput(t)))}__setInputsFromSlot(){this._setInputs(this.__getInputsFromSlot()),this.__setValue()}__toggleHasValue(t){this.toggleAttribute("has-value",null!==t&&""!==t.trim())}__valueChanged(t,e){if(this.__settingValue||!this.inputs)return;this.__toggleHasValue(t);const o=(this.parseValue||v).apply(this,[t]);o&&0!==o.length?(this.inputs.forEach(((t,e)=>{t.value=o[e]})),void 0!==e&&this.validate()):console.warn("Value parser has not provided values array")}},f=o(44720).AH`
527
- :host {
528
- display: inline-flex;
529
- }
530
-
531
- :host::before {
532
- content: '\\2003';
533
- width: 0;
534
- display: inline-block;
535
- /* Size and position this element on the same vertical position as the input-field element
536
- to make vertical align for the host element work as expected */
537
- }
538
-
539
- :host([hidden]) {
540
- display: none !important;
541
- }
542
-
543
- .vaadin-custom-field-container {
544
- width: 100%;
545
- display: flex;
546
- flex-direction: column;
547
- }
548
-
549
- .inputs-wrapper {
550
- flex: none;
551
- }
552
- `;(0,i.SF)("vaadin-custom-field",f,{moduleId:"vaadin-custom-field-styles"});class y extends(g((0,i.cp)((0,d.q)(n.Pu)))){static get is(){return"vaadin-custom-field"}static get template(){return n.qy`
553
- <div class="vaadin-custom-field-container">
554
- <div part="label" on-click="focus">
555
- <slot name="label"></slot>
556
- <span part="required-indicator" aria-hidden="true"></span>
557
- </div>
558
-
559
- <div class="inputs-wrapper" part="input-fields" on-change="_onInputChange">
560
- <slot id="slot"></slot>
561
- </div>
562
-
563
- <div part="helper-text">
564
- <slot name="helper"></slot>
565
- </div>
566
-
567
- <div part="error-message">
568
- <slot name="error-message"></slot>
569
- </div>
570
- </div>
571
-
572
- <slot name="tooltip"></slot>
573
- `}}(0,l.X)(y)},60978:(t,e,o)=>{o.d(e,{a:()=>r});var a=o(60354);const r=t=>class extends((0,a.R)(t)){static get properties(){return{autocomplete:{type:String},autocorrect:{type:String},autocapitalize:{type:String,reflectToAttribute:!0}}}static get delegateAttrs(){return[...super.delegateAttrs,"autocapitalize","autocomplete","autocorrect"]}get __data(){return this.__dataValue||{}}set __data(t){this.__dataValue=t}_inputElementChanged(t){super._inputElementChanged(t),t&&(t.value&&t.value!==this.value&&(console.warn(`Please define value on the <${this.localName}> component!`),t.value=""),this.value&&(t.value=this.value))}_setFocused(t){super._setFocused(t),!t&&document.hasFocus()&&this.validate()}_onInput(t){super._onInput(t),this.invalid&&this.validate()}_valueChanged(t,e){super._valueChanged(t,e),void 0!==e&&this.invalid&&this.validate()}}},10056:(t,e,o)=>{o.d(e,{A:()=>p}),o(94009);var a=o(98633),r=o(65211),i=o(27150),s=o(83798),n=o(9685),l=o(57224),d=o(21860),u=o(60978),c=o(19074);const h=t=>class extends((0,u.a)(t)){static get properties(){return{maxlength:{type:Number},minlength:{type:Number},pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"maxlength","minlength","pattern"]}static get constraints(){return[...super.constraints,"maxlength","minlength","pattern"]}constructor(){super(),this._setType("text")}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new d.f(this,(t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t}))),this.addController(new c.q(this.inputElement,this._labelController))}};(0,l.SF)("vaadin-text-field",n.k,{moduleId:"vaadin-text-field-styles"});class p extends(h((0,l.cp)((0,i.q)(a.Pu)))){static get is(){return"vaadin-text-field"}static get template(){return a.qy`
574
- <style>
575
- [part='input-field'] {
576
- flex-grow: 0;
577
- }
578
- </style>
579
-
580
- <div class="vaadin-field-container">
581
- <div part="label">
582
- <slot name="label"></slot>
583
- <span part="required-indicator" aria-hidden="true" on-click="focus"></span>
584
- </div>
585
-
586
- <vaadin-input-container
587
- part="input-field"
588
- readonly="[[readonly]]"
589
- disabled="[[disabled]]"
590
- invalid="[[invalid]]"
591
- theme$="[[_theme]]"
592
- >
593
- <slot name="prefix" slot="prefix"></slot>
594
- <slot name="input"></slot>
595
- <slot name="suffix" slot="suffix"></slot>
596
- <div id="clearButton" part="clear-button" slot="suffix" aria-hidden="true"></div>
597
- </vaadin-input-container>
598
-
599
- <div part="helper-text">
600
- <slot name="helper"></slot>
601
- </div>
602
-
603
- <div part="error-message">
604
- <slot name="error-message"></slot>
605
- </div>
606
- </div>
607
- <slot name="tooltip"></slot>
608
- `}static get properties(){return{maxlength:{type:Number},minlength:{type:Number}}}ready(){super.ready(),this._tooltipController=new s.I(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this.addController(this._tooltipController)}}(0,r.X)(p)},44085:(t,e,o)=>{o(67239);var a=o(80704);(0,o(57224).SF)("vaadin-text-field",a.k,{moduleId:"lumo-text-field-styles"}),o(10056)},63970:(t,e,o)=>{o(44085),o(10056)}}]);