@descope/web-components-ui 3.12.1 → 3.13.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 (93) hide show
  1. package/dist/cjs/index.cjs.js +4121 -2426
  2. package/dist/cjs/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +3165 -1468
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/umd/6618.js +591 -0
  6. package/dist/umd/{7387.js.LICENSE.txt → 6618.js.LICENSE.txt} +6 -0
  7. package/dist/umd/6618.js.map +1 -0
  8. package/dist/umd/8350.js +2 -0
  9. package/dist/umd/8350.js.map +1 -0
  10. package/dist/umd/9265.js +2 -0
  11. package/dist/umd/9265.js.map +1 -0
  12. package/dist/umd/DescopeDev.js +1 -1
  13. package/dist/umd/DescopeDev.js.map +1 -1
  14. package/dist/umd/descope-date-field-descope-calendar-index-js.js +449 -1
  15. package/dist/umd/descope-date-field-descope-calendar-index-js.js.map +1 -1
  16. package/dist/umd/descope-date-field-index-js.js +1 -1
  17. package/dist/umd/descope-date-field-index-js.js.map +1 -1
  18. package/dist/umd/descope-email-field-index-js.js +2 -2
  19. package/dist/umd/descope-email-field-index-js.js.map +1 -1
  20. package/dist/umd/descope-hybrid-field-index-js.js +1 -1
  21. package/dist/umd/descope-hybrid-field-index-js.js.map +1 -1
  22. package/dist/umd/descope-month-day-field-picker.js +114 -0
  23. package/dist/umd/descope-month-day-field-picker.js.LICENSE.txt +11 -0
  24. package/dist/umd/descope-month-day-field-picker.js.map +1 -0
  25. package/dist/umd/descope-month-day-field.js +2 -0
  26. package/dist/umd/descope-month-day-field.js.map +1 -0
  27. package/dist/umd/descope-new-password-index-js.js +1 -1
  28. package/dist/umd/descope-new-password-index-js.js.map +1 -1
  29. package/dist/umd/descope-number-field-index-js.js +1 -1
  30. package/dist/umd/descope-number-field-index-js.js.map +1 -1
  31. package/dist/umd/descope-passcode-index-js.js +1 -1
  32. package/dist/umd/descope-passcode-index-js.js.map +1 -1
  33. package/dist/umd/descope-radio-group-index-js.js +1 -1
  34. package/dist/umd/descope-radio-group-index-js.js.map +1 -1
  35. package/dist/umd/descope-security-questions-setup-index-js.js +1 -1
  36. package/dist/umd/descope-security-questions-setup-index-js.js.map +1 -1
  37. package/dist/umd/descope-security-questions-verify-index-js.js +1 -1
  38. package/dist/umd/descope-security-questions-verify-index-js.js.map +1 -1
  39. package/dist/umd/descope-text-field.js +38 -0
  40. package/dist/umd/descope-text-field.js.map +1 -0
  41. package/dist/umd/index.js +1 -1
  42. package/dist/umd/index.js.map +1 -1
  43. package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
  44. package/dist/umd/mapping-fields-descope-mappings-field-index-js.js.map +1 -1
  45. package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js +1 -1
  46. package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js.map +1 -1
  47. package/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
  48. package/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js.map +1 -1
  49. package/dist/umd/phone-fields-descope-phone-field-index-js.js +1 -1
  50. package/dist/umd/phone-fields-descope-phone-field-index-js.js.map +1 -1
  51. package/dist/umd/phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js +1 -1
  52. package/dist/umd/phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js.map +1 -1
  53. package/dist/umd/phone-fields-descope-phone-input-box-field-index-js.js +1 -1
  54. package/dist/umd/phone-fields-descope-phone-input-box-field-index-js.js.map +1 -1
  55. package/package.json +39 -36
  56. package/src/components/descope-date-field/DateFieldClass.js +1 -1
  57. package/src/components/descope-date-field/index.js +1 -1
  58. package/src/components/descope-email-field/EmailFieldClass.js +1 -1
  59. package/src/components/descope-new-password/index.js +1 -1
  60. package/src/components/descope-number-field/NumberFieldClass.js +1 -1
  61. package/src/components/descope-passcode/PasscodeClass.js +1 -1
  62. package/src/components/descope-passcode/index.js +1 -1
  63. package/src/components/descope-radio-group/RadioGroupClass.js +1 -1
  64. package/src/components/descope-security-questions-setup/SecurityQuestionsSetupClass.js +1 -1
  65. package/src/components/descope-security-questions-setup/index.js +1 -1
  66. package/src/components/descope-security-questions-verify/SecurityQuestionsVerifyClass.js +1 -1
  67. package/src/components/descope-security-questions-verify/index.js +1 -1
  68. package/src/components/mapping-fields/descope-mappings-field/index.js +1 -1
  69. package/src/components/mapping-fields/descope-saml-group-mappings/index.js +1 -1
  70. package/src/components/phone-fields/descope-phone-field/PhoneFieldClass.js +1 -1
  71. package/src/components/phone-fields/descope-phone-field/descope-phone-field-internal/index.js +1 -1
  72. package/src/components/phone-fields/descope-phone-field/index.js +1 -1
  73. package/src/components/phone-fields/descope-phone-input-box-field/PhoneFieldInputBoxClass.js +1 -1
  74. package/src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/index.js +1 -1
  75. package/src/components/phone-fields/descope-phone-input-box-field/index.js +1 -1
  76. package/src/index.cjs.js +2 -2
  77. package/src/index.js +0 -1
  78. package/src/theme/components/index.js +5 -1
  79. package/stories/descope-text-field.stories.js +1 -1
  80. package/dist/umd/3685.js +0 -2
  81. package/dist/umd/3685.js.map +0 -1
  82. package/dist/umd/4518.js +0 -450
  83. package/dist/umd/4518.js.map +0 -1
  84. package/dist/umd/7387.js +0 -144
  85. package/dist/umd/7387.js.map +0 -1
  86. package/dist/umd/descope-text-field-index-js.js +0 -38
  87. package/dist/umd/descope-text-field-index-js.js.map +0 -1
  88. package/src/components/descope-text-field/TextFieldClass.js +0 -142
  89. package/src/components/descope-text-field/index.js +0 -9
  90. package/src/components/descope-text-field/textFieldMappings.js +0 -169
  91. package/src/theme/components/textField.js +0 -71
  92. /package/dist/umd/{4518.js.LICENSE.txt → descope-date-field-descope-calendar-index-js.js.LICENSE.txt} +0 -0
  93. /package/dist/umd/{descope-text-field-index-js.js.LICENSE.txt → descope-text-field.js.LICENSE.txt} +0 -0
package/dist/umd/4518.js DELETED
@@ -1,450 +0,0 @@
1
- /*! For license information please see 4518.js.LICENSE.txt */
2
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4518,5691],{89389(t,o,e){e.d(o,{$:()=>p});var r=e(13256),a=e(55774),i=e(82901),n=e(72562),s=e(81488),l=e(87550);const d=e(51450).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 c=e(84467),u=e(53149),m=e(36176);const h=t=>class extends((0,c.e)((0,m.l)((0,u.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 p extends(h((0,n.q)((0,l.cp)((0,a.w)(r.Pu))))){static get is(){return"vaadin-button"}static get template(){return r.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 s.I(this),this.addController(this._tooltipController)}}(0,i.X)(p)},93555(t,o,e){e.d(o,{x:()=>a}),e(64511),e(42068),e(9433),e(3241),e(83315);var r=e(87550);const a=r.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,r.SF)("vaadin-button",a,{moduleId:"lumo-button"})},83799(t,o,e){e(93555),e(89389)},1632(t,o,e){e(52915),e(54886),e(27397),e(25244);var r=e(47642),a=e(87550);const i=a.AH`
339
- :host {
340
- outline: none;
341
- }
342
-
343
- [part='toggle-button']::before {
344
- content: var(--lumo-icons-dropdown);
345
- }
346
- `;(0,a.SF)("vaadin-combo-box",[r.k,i],{moduleId:"lumo-combo-box"}),e(86689);var n=e(13256),s=e(82901),l=e(23927),d=e(79769);class c extends((0,d.y)((0,a.cp)((0,l.v)(n.Pu)))){static get template(){return n.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,s.X)(c);var u=e(58069),m=e(5072),h=e(32888);const p=a.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,a.SF)("vaadin-combo-box-overlay",[m.B,p],{moduleId:"vaadin-combo-box-overlay-styles"});class v extends((0,h.p)((0,u.c)((0,l.v)((0,a.cp)(n.Pu))))){static get is(){return"vaadin-combo-box-overlay"}static get template(){return n.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,s.X)(v);var b=e(70616);class g extends((0,b.N)(n.Pu)){static get is(){return"vaadin-combo-box-scroller"}static get template(){return n.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,s.X)(g);var y=e(72562),f=e(81488),x=e(44218),w=e(18330),_=e(37720),k=e(83304);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=e(86314),S=e(11402),A=e(65909);(0,a.SF)("vaadin-combo-box",C.k,{moduleId:"vaadin-combo-box-styles"});class K extends((0,S.K)((0,A.x)(z((0,x.R)((0,a.cp)((0,y.q)(n.Pu))))))){static get is(){return"vaadin-combo-box"}static get template(){return n.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 w.f(this,t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t})),this.addController(new _.q(this.inputElement,this._labelController)),this._tooltipController=new f.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 o=t.composedPath();(o.includes(this._labelNode)||o.includes(this._positionTarget))&&super._onHostClick(t)}}(0,s.X)(K)}}]);
450
- //# sourceMappingURL=4518.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"4518.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/theme/lumo/vaadin-combo-box-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-item.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-overlay.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-scroller.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/field-base/src/pattern-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box.js"],"sourcesContent":["/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n :host {\n display: inline-block;\n position: relative;\n outline: none;\n white-space: nowrap;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n /* Aligns the button with form fields when placed on the same line.\n Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n .vaadin-button-container::before {\n content: '\\\\2003';\n display: inline-block;\n width: 0;\n max-height: 100%;\n }\n\n .vaadin-button-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n width: 100%;\n height: 100%;\n min-height: inherit;\n text-shadow: inherit;\n }\n\n [part='prefix'],\n [part='suffix'] {\n flex: none;\n }\n\n [part='label'] {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n @media (forced-colors: active) {\n :host {\n outline: 1px solid;\n outline-offset: -1px;\n }\n\n :host([focused]) {\n outline-width: 2px;\n }\n\n :host([disabled]) {\n outline-color: GrayText;\n }\n }\n`;\n\nexport const buttonTemplate = (html) => html`\n <div class=\"vaadin-button-container\">\n <span part=\"prefix\" aria-hidden=\"true\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" aria-hidden=\"true\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n static get properties() {\n return {\n /**\n * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n *\n * @override\n * @protected\n */\n tabindex: {\n type: Number,\n value: 0,\n reflectToAttribute: true,\n },\n };\n }\n\n /**\n * By default, `Space` is the only possible activation key for a focusable HTML element.\n * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n *\n * @protected\n * @override\n */\n get _activeKeys() {\n return ['Enter', ' '];\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n // By default, if the user hasn't provided a custom role,\n // the role attribute is set to \"button\".\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n /**\n * Since the button component is designed on the base of the `[role=button]` attribute,\n * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n * it should manually fire the `click` event once an activation key is pressed,\n * as it follows from the WAI-ARIA specifications:\n * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n *\n * According to the UI Events specifications,\n * the `click` event should be fired exactly on `keydown`:\n * https://www.w3.org/TR/uievents/#event-type-keydown\n *\n * @param {KeyboardEvent} event\n * @protected\n * @override\n */\n _onKeyDown(event) {\n super._onKeyDown(event);\n\n if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n return;\n }\n\n if (this._activeKeys.includes(event.key)) {\n event.preventDefault();\n\n // `DisabledMixin` overrides the standard `click()` method\n // so that it doesn't fire the `click` event when the element is disabled.\n this.click();\n }\n }\n };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label` | The label (text) inside the button.\n * `prefix` | A slot for content before the label (e.g. an icon).\n * `suffix` | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `active` | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled` | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused` | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-button';\n }\n\n static get template() {\n return buttonTemplate(html);\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n :host {\n /* Sizing */\n --lumo-button-size: var(--lumo-size-m);\n min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n height: var(--_button-size);\n padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n box-sizing: border-box;\n /* Style */\n font-family: var(--lumo-font-family);\n font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n font-weight: var(--vaadin-button-font-weight, 500);\n color: var(--_lumo-button-text-color);\n background: var(--_lumo-button-background);\n border: var(--vaadin-button-border, none);\n border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n cursor: var(--lumo-clickable-cursor);\n -webkit-tap-highlight-color: transparent;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n flex-shrink: 0;\n --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n /* Used by notification */\n --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n }\n\n /* Set only for the internal parts so we don't affect the host vertical alignment */\n [part='label'],\n [part='prefix'],\n [part='suffix'] {\n line-height: var(--lumo-line-height-xs);\n }\n\n [part='label'] {\n padding: calc(var(--lumo-button-size) / 6) 0;\n }\n\n :host([theme~='small']) {\n font-size: var(--lumo-font-size-s);\n --lumo-button-size: var(--lumo-size-s);\n }\n\n :host([theme~='large']) {\n font-size: var(--lumo-font-size-l);\n --lumo-button-size: var(--lumo-size-l);\n }\n\n /* For interaction states */\n :host::before,\n :host::after {\n content: '';\n /* We rely on the host always being relative */\n position: absolute;\n z-index: 1;\n inset: 0;\n background-color: currentColor;\n border-radius: inherit;\n opacity: 0;\n pointer-events: none;\n }\n\n /* Hover */\n\n @media (any-hover: hover) {\n :host(:hover)::before {\n opacity: 0.02;\n }\n }\n\n /* Active */\n\n :host::after {\n transition: opacity 1.4s, transform 0.1s;\n filter: blur(8px);\n }\n\n :host([active])::before {\n opacity: 0.05;\n transition-duration: 0s;\n }\n\n :host([active])::after {\n opacity: 0.1;\n transition-duration: 0s, 0s;\n transform: scale(0);\n }\n\n /* Keyboard focus */\n\n :host([focus-ring]) {\n box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n }\n\n :host([theme~='primary'][focus-ring]) {\n box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n }\n\n /* Types (primary, tertiary, tertiary-inline */\n\n :host([theme~='tertiary']),\n :host([theme~='tertiary-inline']) {\n --_background: transparent !important;\n background: var(--vaadin-button-tertiary-background, var(--_background));\n min-width: 0;\n }\n\n :host([theme~='tertiary']) {\n border: var(--vaadin-button-tertiary-border, none);\n color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n }\n\n :host([theme~='tertiary-inline'])::before {\n display: none;\n }\n\n :host([theme~='tertiary-inline']) {\n margin: 0;\n height: auto;\n padding: 0;\n line-height: inherit;\n font-size: inherit;\n }\n\n :host([theme~='tertiary-inline']) [part='label'] {\n padding: 0;\n overflow: visible;\n line-height: inherit;\n }\n\n :host([theme~='primary']) {\n background: var(--_lumo-button-primary-background);\n border: var(--vaadin-button-primary-border, none);\n color: var(--_lumo-button-primary-text-color);\n font-weight: var(--vaadin-button-primary-font-weight, 600);\n min-width: calc(var(--lumo-button-size) * 2.5);\n }\n\n :host([theme~='primary'])::before {\n background-color: black;\n }\n\n @media (any-hover: hover) {\n :host([theme~='primary']:hover)::before {\n opacity: 0.05;\n }\n }\n\n :host([theme~='primary'][active])::before {\n opacity: 0.1;\n }\n\n :host([theme~='primary'][active])::after {\n opacity: 0.2;\n }\n\n /* Colors (success, error, contrast) */\n\n :host([theme~='success']) {\n color: var(--lumo-success-text-color);\n }\n\n :host([theme~='success'][theme~='primary']) {\n background-color: var(--lumo-success-color);\n color: var(--lumo-success-contrast-color);\n }\n\n :host([theme~='error']) {\n color: var(--lumo-error-text-color);\n }\n\n :host([theme~='error'][theme~='primary']) {\n background-color: var(--lumo-error-color);\n color: var(--lumo-error-contrast-color);\n }\n\n :host([theme~='contrast']) {\n color: var(--lumo-contrast);\n }\n\n :host([theme~='contrast'][theme~='primary']) {\n background-color: var(--lumo-contrast);\n color: var(--lumo-base-color);\n }\n\n /* Disabled state. Keep selectors after other color variants. */\n\n :host([disabled]) {\n pointer-events: none;\n color: var(--lumo-disabled-text-color);\n }\n\n :host([theme~='primary'][disabled]) {\n background-color: var(--lumo-contrast-30pct);\n color: var(--lumo-base-color);\n }\n\n :host([theme~='primary'][disabled]) [part] {\n opacity: 0.7;\n }\n\n /* Icons */\n\n [part] ::slotted(vaadin-icon) {\n display: inline-block;\n width: var(--lumo-icon-size-m);\n height: var(--lumo-icon-size-m);\n }\n\n /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n padding: 0.25em;\n box-sizing: border-box !important;\n }\n\n [part='prefix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n [part='suffix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n /* Icon-only */\n\n :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n min-width: var(--lumo-button-size);\n padding-left: calc(var(--lumo-button-size) / 4);\n padding-right: calc(var(--lumo-button-size) / 4);\n }\n\n :host([theme~='icon']) [part='prefix'],\n :host([theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* RTL specific styles */\n\n :host([dir='rtl']) [part='prefix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n :host([dir='rtl']) [part='suffix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n :host([dir='rtl'][theme~='icon']) [part='prefix'],\n :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\n","import '@vaadin/input-container/theme/lumo/vaadin-input-container-styles.js';\nimport '@vaadin/vaadin-lumo-styles/font-icons.js';\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst comboBox = css`\n :host {\n outline: none;\n }\n\n [part='toggle-button']::before {\n content: var(--lumo-icons-dropdown);\n }\n`;\n\nregisterStyles('vaadin-combo-box', [inputFieldShared, comboBox], { moduleId: 'lumo-combo-box' });\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';\nimport { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxItemMixin } from './vaadin-combo-box-item-mixin.js';\n\n/**\n * An item element used by the `<vaadin-combo-box>` dropdown.\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ------------|--------------\n * `checkmark` | The graphical checkmark shown for a selected item\n * `content` | The element that wraps the item content\n *\n * The following state attributes are exposed for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `selected` | Set when the item is selected\n * `focused` | Set when the item is focused\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @mixes ComboBoxItemMixin\n * @mixes ThemableMixin\n * @mixes DirMixin\n * @private\n */\nexport class ComboBoxItem extends ComboBoxItemMixin(ThemableMixin(DirMixin(PolymerElement))) {\n static get template() {\n return html`\n <style>\n :host {\n display: block;\n }\n\n :host([hidden]) {\n display: none;\n }\n </style>\n <span part=\"checkmark\" aria-hidden=\"true\"></span>\n <div part=\"content\">\n <slot></slot>\n </div>\n `;\n }\n\n static get is() {\n return 'vaadin-combo-box-item';\n }\n}\n\ndefineCustomElement(ComboBoxItem);\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';\nimport { OverlayMixin } from '@vaadin/overlay/src/vaadin-overlay-mixin.js';\nimport { overlayStyles } from '@vaadin/overlay/src/vaadin-overlay-styles.js';\nimport { css, registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxOverlayMixin } from './vaadin-combo-box-overlay-mixin.js';\n\nconst comboBoxOverlayStyles = css`\n #overlay {\n width: var(--vaadin-combo-box-overlay-width, var(--_vaadin-combo-box-overlay-default-width, auto));\n }\n\n [part='content'] {\n display: flex;\n flex-direction: column;\n height: 100%;\n }\n`;\n\nregisterStyles('vaadin-combo-box-overlay', [overlayStyles, comboBoxOverlayStyles], {\n moduleId: 'vaadin-combo-box-overlay-styles',\n});\n\n/**\n * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ComboBoxOverlayMixin\n * @mixes DirMixin\n * @mixes OverlayMixin\n * @mixes ThemableMixin\n * @private\n */\nexport class ComboBoxOverlay extends ComboBoxOverlayMixin(OverlayMixin(DirMixin(ThemableMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-combo-box-overlay';\n }\n\n static get template() {\n return html`\n <div id=\"backdrop\" part=\"backdrop\" hidden></div>\n <div part=\"overlay\" id=\"overlay\">\n <div part=\"loader\"></div>\n <div part=\"content\" id=\"content\"><slot></slot></div>\n </div>\n `;\n }\n}\n\ndefineCustomElement(ComboBoxOverlay);\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ComboBoxScrollerMixin } from './vaadin-combo-box-scroller-mixin.js';\n\n/**\n * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ComboBoxScrollerMixin\n * @private\n */\nexport class ComboBoxScroller extends ComboBoxScrollerMixin(PolymerElement) {\n static get is() {\n return 'vaadin-combo-box-scroller';\n }\n\n static get template() {\n return html`\n <style>\n :host {\n display: block;\n min-height: 1px;\n overflow: auto;\n\n /* Fixes item background from getting on top of scrollbars on Safari */\n transform: translate3d(0, 0, 0);\n\n /* Enable momentum scrolling on iOS */\n -webkit-overflow-scrolling: touch;\n\n /* Fixes scrollbar disappearing when 'Show scroll bars: Always' enabled in Safari */\n box-shadow: 0 0 0 white;\n }\n\n #selector {\n border-width: var(--_vaadin-combo-box-items-container-border-width);\n border-style: var(--_vaadin-combo-box-items-container-border-style);\n border-color: var(--_vaadin-combo-box-items-container-border-color, transparent);\n position: relative;\n }\n </style>\n <div id=\"selector\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndefineCustomElement(ComboBoxScroller);\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { InputConstraintsMixin } from './input-constraints-mixin.js';\n\n/**\n * A mixin to provide `pattern` property.\n *\n * @polymerMixin\n * @mixes InputConstraintsMixin\n */\nexport const PatternMixin = (superclass) =>\n class PatternMixinClass extends InputConstraintsMixin(superclass) {\n static get properties() {\n return {\n /**\n * A regular expression that the value is checked against.\n * The pattern must match the entire value, not just some subset.\n */\n pattern: {\n type: String,\n },\n };\n }\n\n static get delegateAttrs() {\n return [...super.delegateAttrs, 'pattern'];\n }\n\n static get constraints() {\n return [...super.constraints, 'pattern'];\n }\n };\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport '@vaadin/input-container/src/vaadin-input-container.js';\nimport './vaadin-combo-box-item.js';\nimport './vaadin-combo-box-overlay.js';\nimport './vaadin-combo-box-scroller.js';\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { InputControlMixin } from '@vaadin/field-base/src/input-control-mixin.js';\nimport { InputController } from '@vaadin/field-base/src/input-controller.js';\nimport { LabelledInputController } from '@vaadin/field-base/src/labelled-input-controller.js';\nimport { PatternMixin } from '@vaadin/field-base/src/pattern-mixin.js';\nimport { inputFieldShared } from '@vaadin/field-base/src/styles/input-field-shared-styles.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxDataProviderMixin } from './vaadin-combo-box-data-provider-mixin.js';\nimport { ComboBoxMixin } from './vaadin-combo-box-mixin.js';\n\nregisterStyles('vaadin-combo-box', inputFieldShared, { moduleId: 'vaadin-combo-box-styles' });\n\n/**\n * `<vaadin-combo-box>` is a web component for choosing a value from a filterable list of options\n * presented in a dropdown overlay. The options can be provided as a list of strings or objects\n * by setting [`items`](#/elements/vaadin-combo-box#property-items) property on the element.\n *\n * ```html\n * <vaadin-combo-box id=\"combo-box\"></vaadin-combo-box>\n * ```\n *\n * ```js\n * document.querySelector('#combo-box').items = ['apple', 'orange', 'banana'];\n * ```\n *\n * When the selected `value` is changed, a `value-changed` event is triggered.\n *\n * ### Item rendering\n *\n * To customize the content of the `<vaadin-combo-box-item>` elements placed in the dropdown, use\n * [`renderer`](#/elements/vaadin-combo-box#property-renderer) property which accepts a function.\n * The renderer function is called with `root`, `comboBox`, and `model` as arguments.\n *\n * Generate DOM content by using `model` object properties if needed, and append it to the `root`\n * element. The `comboBox` reference is provided to access the combo-box element state. Do not\n * set combo-box properties in a `renderer` function.\n *\n * ```js\n * const comboBox = document.querySelector('#combo-box');\n * comboBox.items = [{'label': 'Hydrogen', 'value': 'H'}];\n * comboBox.renderer = (root, comboBox, model) => {\n * const item = model.item;\n * root.innerHTML = `${model.index}: ${item.label} <b>${item.value}</b>`;\n * };\n * ```\n *\n * Renderer is called on the opening of the combo-box and each time the related model is updated.\n * Before creating new content, it is recommended to check if there is already an existing DOM\n * element in `root` from a previous renderer call for reusing it. Even though combo-box uses\n * infinite scrolling, reducing DOM operations might improve performance.\n *\n * The following properties are available in the `model` argument:\n *\n * Property | Type | Description\n * -----------|------------------|-------------\n * `index` | Number | Index of the item in the `items` array\n * `item` | String or Object | The item reference\n * `selected` | Boolean | True when item is selected\n * `focused` | Boolean | True when item is focused\n *\n * ### Lazy Loading with Function Data Provider\n *\n * In addition to assigning an array to the items property, you can alternatively use the\n * [`dataProvider`](#/elements/vaadin-combo-box#property-dataProvider) function property.\n * The `<vaadin-combo-box>` calls this function lazily, only when it needs more data\n * to be displayed.\n *\n * __Note that when using function data providers, the total number of items\n * needs to be set manually. The total number of items can be returned\n * in the second argument of the data provider callback:__\n *\n * ```js\n * comboBox.dataProvider = async (params, callback) => {\n * const API = 'https://demo.vaadin.com/demo-data/1.0/filtered-countries';\n * const { filter, page, pageSize } = params;\n * const index = page * pageSize;\n *\n * const res = await fetch(`${API}?index=${index}&count=${pageSize}&filter=${filter}`);\n * if (res.ok) {\n * const { result, size } = await res.json();\n * callback(result, size);\n * }\n * };\n * ```\n *\n * ### Styling\n *\n * The following custom properties are available for styling:\n *\n * Custom property | Description | Default\n * ----------------------------------------|----------------------------|---------\n * `--vaadin-field-default-width` | Default width of the field | `12em`\n * `--vaadin-combo-box-overlay-width` | Width of the overlay | `auto`\n * `--vaadin-combo-box-overlay-max-height` | Max height of the overlay | `65vh`\n *\n * `<vaadin-combo-box>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\n * See [`<vaadin-text-field>`](#/elements/vaadin-text-field) for the styling documentation.\n *\n * In addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n *\n * Part name | Description\n * ----------------|----------------\n * `toggle-button` | The toggle button\n *\n * In addition to `<vaadin-text-field>` state attributes, the following state attributes are available for theming:\n *\n * Attribute | Description | Part name\n * ----------|-------------|------------\n * `opened` | Set when the combo box dropdown is open | :host\n * `loading` | Set when new items are expected | :host\n *\n * If you want to replace the default `<input>` and its container with a custom implementation to get full control\n * over the input field, consider using the [`<vaadin-combo-box-light>`](#/elements/vaadin-combo-box-light) element.\n *\n * ### Internal components\n *\n * In addition to `<vaadin-combo-box>` itself, the following internal\n * components are themable:\n *\n * - `<vaadin-combo-box-overlay>` - has the same API as [`<vaadin-overlay>`](#/elements/vaadin-overlay).\n * - `<vaadin-combo-box-item>` - has the same API as [`<vaadin-item>`](#/elements/vaadin-item).\n * - [`<vaadin-input-container>`](#/elements/vaadin-input-container) - an internal element wrapping the input.\n *\n * Note: the `theme` attribute value set on `<vaadin-combo-box>` is\n * propagated to the internal components listed above.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} custom-value-set - Fired when the user sets a custom value.\n * @fires {CustomEvent} filter-changed - Fired when the `filter` property changes.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.\n * @fires {CustomEvent} selected-item-changed - Fired when the `selectedItem` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ElementMixin\n * @mixes ThemableMixin\n * @mixes InputControlMixin\n * @mixes PatternMixin\n * @mixes ComboBoxDataProviderMixin\n * @mixes ComboBoxMixin\n */\nclass ComboBox extends ComboBoxDataProviderMixin(\n ComboBoxMixin(PatternMixin(InputControlMixin(ThemableMixin(ElementMixin(PolymerElement))))),\n) {\n static get is() {\n return 'vaadin-combo-box';\n }\n\n static get template() {\n return html`\n <style>\n :host([opened]) {\n pointer-events: auto;\n }\n </style>\n\n <div class=\"vaadin-combo-box-container\">\n <div part=\"label\">\n <slot name=\"label\"></slot>\n <span part=\"required-indicator\" aria-hidden=\"true\" on-click=\"focus\"></span>\n </div>\n\n <vaadin-input-container\n part=\"input-field\"\n readonly=\"[[readonly]]\"\n disabled=\"[[disabled]]\"\n invalid=\"[[invalid]]\"\n theme$=\"[[_theme]]\"\n >\n <slot name=\"prefix\" slot=\"prefix\"></slot>\n <slot name=\"input\"></slot>\n <div id=\"clearButton\" part=\"clear-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n <div id=\"toggleButton\" part=\"toggle-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n </vaadin-input-container>\n\n <div part=\"helper-text\">\n <slot name=\"helper\"></slot>\n </div>\n\n <div part=\"error-message\">\n <slot name=\"error-message\"></slot>\n </div>\n </div>\n\n <vaadin-combo-box-overlay\n id=\"overlay\"\n opened=\"[[_overlayOpened]]\"\n loading$=\"[[loading]]\"\n theme$=\"[[_theme]]\"\n position-target=\"[[_positionTarget]]\"\n no-vertical-overlap\n restore-focus-node=\"[[inputElement]]\"\n ></vaadin-combo-box-overlay>\n\n <slot name=\"tooltip\"></slot>\n `;\n }\n\n static get properties() {\n return {\n /**\n * @protected\n */\n _positionTarget: {\n type: Object,\n },\n };\n }\n\n /**\n * Used by `InputControlMixin` as a reference to the clear button element.\n * @protected\n * @return {!HTMLElement}\n */\n get clearElement() {\n return this.$.clearButton;\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this.addController(\n new InputController(this, (input) => {\n this._setInputElement(input);\n this._setFocusElement(input);\n this.stateTarget = input;\n this.ariaTarget = input;\n }),\n );\n this.addController(new LabelledInputController(this.inputElement, this._labelController));\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n this._tooltipController.setPosition('top');\n this._tooltipController.setAriaTarget(this.inputElement);\n this._tooltipController.setShouldShow((target) => !target.opened);\n\n this._positionTarget = this.shadowRoot.querySelector('[part=\"input-field\"]');\n this._toggleElement = this.$.toggleButton;\n }\n\n /**\n * Override the method from `InputControlMixin`\n * to stop event propagation to prevent `ComboBoxMixin`\n * from handling this click event also on its own.\n *\n * @param {Event} event\n * @protected\n * @override\n */\n _onClearButtonClick(event) {\n event.stopPropagation();\n super._onClearButtonClick(event);\n }\n\n /**\n * @param {Event} event\n * @protected\n */\n _onHostClick(event) {\n const path = event.composedPath();\n\n // Open dropdown only when clicking on the label or input field\n if (path.includes(this._labelNode) || path.includes(this._positionTarget)) {\n super._onHostClick(event);\n }\n }\n}\n\ndefineCustomElement(ComboBox);\n\nexport { ComboBox };\n"],"names":["buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","value","reflectToAttribute","_activeKeys","ready","super","this","hasAttribute","setAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","click","moduleId","Button","is","template","_tooltipController","addController","button","comboBox","ComboBoxItem","comboBoxOverlayStyles","ComboBoxOverlay","ComboBoxScroller","PatternMixin","superclass","pattern","String","delegateAttrs","constraints","ComboBox","_positionTarget","Object","clearElement","$","clearButton","input","_setInputElement","_setFocusElement","stateTarget","ariaTarget","inputElement","_labelController","setPosition","setAriaTarget","setShouldShow","target","opened","shadowRoot","querySelector","_toggleElement","toggleButton","_onClearButtonClick","stopPropagation","_onHostClick","path","composedPath","_labelNode"],"sourceRoot":""}