@descope/web-components-ui 1.0.239 → 1.0.240
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +1418 -894
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1401 -877
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1438.js +374 -0
- package/dist/umd/1438.js.LICENSE.txt +5 -0
- package/dist/umd/1940.js +303 -0
- package/dist/umd/{849.js → 4595.js} +5 -5
- package/dist/umd/63.js +2 -0
- package/dist/umd/63.js.LICENSE.txt +5 -0
- package/dist/umd/6687.js +9 -0
- package/dist/umd/6687.js.LICENSE.txt +5 -0
- package/dist/umd/7583.js +113 -0
- package/dist/umd/{5977.js.LICENSE.txt → 7583.js.LICENSE.txt} +0 -6
- package/dist/umd/8866.js +183 -0
- package/dist/umd/8866.js.LICENSE.txt +11 -0
- package/dist/umd/9558.js +1 -1
- package/dist/umd/descope-combo-box-index-js.js +1 -1
- package/dist/umd/descope-grid-index-js.js +1 -1
- package/dist/umd/descope-modal-index-js.js +1 -1
- package/dist/umd/descope-multi-select-combo-box-index-js.js +1 -0
- package/dist/umd/index.js +1 -1
- package/dist/umd/phone-fields-descope-phone-field-index-js.js +1 -1
- package/dist/umd/phone-fields-descope-phone-input-box-field-index-js.js +1 -1
- package/package.json +2 -1
- package/src/components/descope-multi-select-combo-box/MultiSelectComboBoxClass.js +488 -0
- package/src/components/descope-multi-select-combo-box/index.js +6 -0
- package/src/theme/components/index.js +2 -0
- package/src/theme/components/inputWrapper.js +4 -4
- package/src/theme/components/multiSelectComboBox.js +57 -0
- package/dist/umd/1932.js +0 -310
- package/dist/umd/5977.js +0 -294
- /package/dist/umd/{1932.js.LICENSE.txt → 1940.js.LICENSE.txt} +0 -0
- /package/dist/umd/{849.js.LICENSE.txt → 4595.js.LICENSE.txt} +0 -0
package/dist/umd/1932.js
DELETED
@@ -1,310 +0,0 @@
|
|
1
|
-
/*! For license information please see 1932.js.LICENSE.txt */
|
2
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[1932],{1932:(e,t,r)=>{var o=r(510),s=r(6570);(0,s.hC)("vaadin-overlay",o.I,{moduleId:"lumo-vaadin-overlay"});var i=r(4241),a=r(2807),n=r(1914),d=r(262),l=r(4457),h=r(6196);(0,s.hC)("vaadin-overlay",h.r,{moduleId:"vaadin-overlay-styles"});class p extends((0,l.F)((0,s.Tb)((0,n.U)(i.H3)))){static get template(){return i.dy`
|
3
|
-
<div id="backdrop" part="backdrop" hidden$="[[!withBackdrop]]"></div>
|
4
|
-
<div part="overlay" id="overlay" tabindex="0">
|
5
|
-
<div part="content" id="content">
|
6
|
-
<slot></slot>
|
7
|
-
</div>
|
8
|
-
</div>
|
9
|
-
`}static get is(){return"vaadin-overlay"}ready(){super.ready(),(0,d.k)(this)}}(0,a.M)(p),r(9416);const c=s.iv`
|
10
|
-
/* Optical centering */
|
11
|
-
:host::before,
|
12
|
-
:host::after {
|
13
|
-
content: '';
|
14
|
-
flex-basis: 0;
|
15
|
-
flex-grow: 1;
|
16
|
-
}
|
17
|
-
|
18
|
-
:host::after {
|
19
|
-
flex-grow: 1.1;
|
20
|
-
}
|
21
|
-
|
22
|
-
[part='overlay'] {
|
23
|
-
border-radius: var(--lumo-border-radius-l);
|
24
|
-
box-shadow: 0 0 0 1px var(--lumo-shade-5pct), var(--lumo-box-shadow-xl);
|
25
|
-
background-image: none;
|
26
|
-
outline: none;
|
27
|
-
-webkit-tap-highlight-color: transparent;
|
28
|
-
}
|
29
|
-
|
30
|
-
[part='content'] {
|
31
|
-
padding: var(--lumo-space-l);
|
32
|
-
}
|
33
|
-
|
34
|
-
:host(:is([has-header], [has-title])) [part='header'] + [part='content'] {
|
35
|
-
padding-top: 0;
|
36
|
-
}
|
37
|
-
|
38
|
-
[part='header'],
|
39
|
-
[part='header-content'],
|
40
|
-
[part='footer'] {
|
41
|
-
gap: var(--lumo-space-xs) var(--lumo-space-s);
|
42
|
-
line-height: var(--lumo-line-height-s);
|
43
|
-
}
|
44
|
-
|
45
|
-
[part='header'] {
|
46
|
-
padding: var(--lumo-space-m);
|
47
|
-
background-color: var(--lumo-base-color);
|
48
|
-
border-radius: var(--lumo-border-radius-l) var(--lumo-border-radius-l) 0 0; /* Needed for Safari */
|
49
|
-
}
|
50
|
-
|
51
|
-
[part='footer'] {
|
52
|
-
padding: var(--lumo-space-s) var(--lumo-space-m);
|
53
|
-
background-color: var(--lumo-contrast-5pct);
|
54
|
-
border-radius: 0 0 var(--lumo-border-radius-l) var(--lumo-border-radius-l); /* Needed for Safari */
|
55
|
-
}
|
56
|
-
|
57
|
-
[part='title'] {
|
58
|
-
font-size: var(--lumo-font-size-xl);
|
59
|
-
font-weight: 600;
|
60
|
-
color: var(--lumo-header-text-color);
|
61
|
-
margin-inline-start: calc(var(--lumo-space-l) - var(--lumo-space-m));
|
62
|
-
}
|
63
|
-
|
64
|
-
/* No padding */
|
65
|
-
:host([theme~='no-padding']) [part='content'] {
|
66
|
-
padding: 0 !important;
|
67
|
-
}
|
68
|
-
|
69
|
-
@media (min-height: 320px) {
|
70
|
-
:host([overflow~='top']) [part='header'] {
|
71
|
-
box-shadow: 0 1px 0 0 var(--lumo-contrast-10pct);
|
72
|
-
}
|
73
|
-
}
|
74
|
-
|
75
|
-
/* Animations */
|
76
|
-
|
77
|
-
:host([opening]),
|
78
|
-
:host([closing]) {
|
79
|
-
animation: 0.25s lumo-overlay-dummy-animation;
|
80
|
-
}
|
81
|
-
|
82
|
-
:host([opening]) [part='overlay'] {
|
83
|
-
animation: 0.12s 0.05s vaadin-dialog-enter cubic-bezier(0.215, 0.61, 0.355, 1) both;
|
84
|
-
}
|
85
|
-
|
86
|
-
@keyframes vaadin-dialog-enter {
|
87
|
-
0% {
|
88
|
-
opacity: 0;
|
89
|
-
transform: scale(0.95);
|
90
|
-
}
|
91
|
-
}
|
92
|
-
|
93
|
-
:host([closing]) [part='overlay'] {
|
94
|
-
animation: 0.1s 0.03s vaadin-dialog-exit cubic-bezier(0.55, 0.055, 0.675, 0.19) both;
|
95
|
-
}
|
96
|
-
|
97
|
-
:host([closing]) [part='backdrop'] {
|
98
|
-
animation-delay: 0.05s;
|
99
|
-
}
|
100
|
-
|
101
|
-
@keyframes vaadin-dialog-exit {
|
102
|
-
100% {
|
103
|
-
opacity: 0;
|
104
|
-
transform: scale(1.02);
|
105
|
-
}
|
106
|
-
}
|
107
|
-
`;(0,s.hC)("vaadin-dialog-overlay",[o.I,c],{moduleId:"lumo-dialog"});const u=e=>class extends((0,l.F)(e)){static get properties(){return{headerTitle:{type:String},headerRenderer:{type:Object},footerRenderer:{type:Object}}}static get observers(){return["_headerFooterRendererChange(headerRenderer, footerRenderer, opened)","_headerTitleChanged(headerTitle, opened)"]}ready(){super.ready(),this.__resizeObserver=new ResizeObserver((()=>{this.__updateOverflow()})),this.__resizeObserver.observe(this.$.resizerContainer),this.$.content.addEventListener("scroll",(()=>{this.__updateOverflow()}))}__createContainer(e){const t=document.createElement("div");return t.setAttribute("slot",e),t}__clearContainer(e){e.innerHTML="",delete e._$litPart$}__initContainer(e,t){return e?this.__clearContainer(e):e=this.__createContainer(t),e}_headerFooterRendererChange(e,t,r){const o=this.__oldHeaderRenderer!==e;this.__oldHeaderRenderer=e;const s=this.__oldFooterRenderer!==t;this.__oldFooterRenderer=t;const i=this._oldOpenedFooterHeader!==r;this._oldOpenedFooterHeader=r,this.toggleAttribute("has-header",!!e),this.toggleAttribute("has-footer",!!t),o&&(e?this.headerContainer=this.__initContainer(this.headerContainer,"header-content"):this.headerContainer&&(this.headerContainer.remove(),this.headerContainer=null,this.__updateOverflow())),s&&(t?this.footerContainer=this.__initContainer(this.footerContainer,"footer"):this.footerContainer&&(this.footerContainer.remove(),this.footerContainer=null,this.__updateOverflow())),(e&&(o||i)||t&&(s||i))&&r&&this.requestContentUpdate()}_headerTitleChanged(e,t){this.toggleAttribute("has-title",!!e),t&&(e||this._oldHeaderTitle)&&this.requestContentUpdate(),this._oldHeaderTitle=e}_headerTitleRenderer(){this.headerTitle?(this.headerTitleElement||(this.headerTitleElement=document.createElement("h2"),this.headerTitleElement.setAttribute("slot","title"),this.headerTitleElement.classList.add("draggable")),this.appendChild(this.headerTitleElement),this.headerTitleElement.textContent=this.headerTitle):this.headerTitleElement&&(this.headerTitleElement.remove(),this.headerTitleElement=null)}requestContentUpdate(){super.requestContentUpdate(),this.headerContainer&&(this.headerContainer.parentElement||this.appendChild(this.headerContainer),this.headerRenderer&&this.headerRenderer.call(this.owner,this.headerContainer,this.owner)),this.footerContainer&&(this.footerContainer.parentElement||this.appendChild(this.footerContainer),this.footerRenderer&&this.footerRenderer.call(this.owner,this.footerContainer,this.owner)),this._headerTitleRenderer(),this.__updateOverflow()}setBounds(e){const t=this.$.overlay,r={...e};"absolute"!==t.style.position&&(t.style.position="absolute",this.setAttribute("has-bounds-set","")),Object.keys(r).forEach((e=>{"number"==typeof r[e]&&(r[e]=`${r[e]}px`)})),Object.assign(t.style,r)}getBounds(){const e=this.$.overlay.getBoundingClientRect(),t=this.getBoundingClientRect();return{top:e.top-t.top,left:e.left-t.left,width:e.width,height:e.height}}__updateOverflow(){let e="";if(this.hasAttribute("has-header")||this.hasAttribute("has-footer")||this.headerTitle){const t=this.$.content;t.scrollTop>0&&(e+=" top"),t.scrollTop<t.scrollHeight-t.clientHeight&&(e+=" bottom")}const t=e.trim();t.length>0&&this.getAttribute("overflow")!==t?this.setAttribute("overflow",t):0===t.length&&this.hasAttribute("overflow")&&this.removeAttribute("overflow")}};var v=r(9392);const g=v.iv`
|
108
|
-
[part='header'],
|
109
|
-
[part='header-content'],
|
110
|
-
[part='footer'] {
|
111
|
-
display: flex;
|
112
|
-
align-items: center;
|
113
|
-
flex-wrap: wrap;
|
114
|
-
flex: none;
|
115
|
-
pointer-events: none;
|
116
|
-
z-index: 1;
|
117
|
-
}
|
118
|
-
|
119
|
-
[part='header'] {
|
120
|
-
flex-wrap: nowrap;
|
121
|
-
}
|
122
|
-
|
123
|
-
::slotted([slot='header-content']),
|
124
|
-
::slotted([slot='title']),
|
125
|
-
::slotted([slot='footer']) {
|
126
|
-
display: contents;
|
127
|
-
pointer-events: auto;
|
128
|
-
}
|
129
|
-
|
130
|
-
::slotted([slot='title']) {
|
131
|
-
font: inherit !important;
|
132
|
-
overflow-wrap: anywhere;
|
133
|
-
}
|
134
|
-
|
135
|
-
[part='header-content'] {
|
136
|
-
flex: 1;
|
137
|
-
}
|
138
|
-
|
139
|
-
:host([has-title]) [part='header-content'],
|
140
|
-
[part='footer'] {
|
141
|
-
justify-content: flex-end;
|
142
|
-
}
|
143
|
-
|
144
|
-
:host(:not([has-title]):not([has-header])) [part='header'],
|
145
|
-
:host(:not([has-header])) [part='header-content'],
|
146
|
-
:host(:not([has-title])) [part='title'],
|
147
|
-
:host(:not([has-footer])) [part='footer'] {
|
148
|
-
display: none !important;
|
149
|
-
}
|
150
|
-
|
151
|
-
:host(:is([has-title], [has-header], [has-footer])) [part='content'] {
|
152
|
-
height: auto;
|
153
|
-
}
|
154
|
-
|
155
|
-
@media (min-height: 320px) {
|
156
|
-
:host(:is([has-title], [has-header], [has-footer])) .resizer-container {
|
157
|
-
overflow: hidden;
|
158
|
-
display: flex;
|
159
|
-
flex-direction: column;
|
160
|
-
}
|
161
|
-
|
162
|
-
:host(:is([has-title], [has-header], [has-footer])) [part='content'] {
|
163
|
-
flex: 1;
|
164
|
-
overflow: auto;
|
165
|
-
}
|
166
|
-
}
|
167
|
-
|
168
|
-
/*
|
169
|
-
NOTE(platosha): Make some min-width to prevent collapsing of the content
|
170
|
-
taking the parent width, e. g., <vaadin-grid> and such.
|
171
|
-
*/
|
172
|
-
[part='content'] {
|
173
|
-
min-width: 12em; /* matches the default <vaadin-text-field> width */
|
174
|
-
}
|
175
|
-
|
176
|
-
:host([has-bounds-set]) [part='overlay'] {
|
177
|
-
max-width: none;
|
178
|
-
}
|
179
|
-
|
180
|
-
@media (forced-colors: active) {
|
181
|
-
[part='overlay'] {
|
182
|
-
outline: 3px solid !important;
|
183
|
-
}
|
184
|
-
}
|
185
|
-
`,m=v.iv`
|
186
|
-
[part='overlay'] {
|
187
|
-
position: relative;
|
188
|
-
overflow: visible;
|
189
|
-
max-height: 100%;
|
190
|
-
display: flex;
|
191
|
-
}
|
192
|
-
|
193
|
-
[part='content'] {
|
194
|
-
box-sizing: border-box;
|
195
|
-
height: 100%;
|
196
|
-
}
|
197
|
-
|
198
|
-
.resizer-container {
|
199
|
-
overflow: auto;
|
200
|
-
flex-grow: 1;
|
201
|
-
border-radius: inherit; /* prevent child elements being drawn outside part=overlay */
|
202
|
-
}
|
203
|
-
|
204
|
-
[part='overlay'][style] .resizer-container {
|
205
|
-
min-height: 100%;
|
206
|
-
width: 100%;
|
207
|
-
}
|
208
|
-
|
209
|
-
:host(:not([resizable])) .resizer {
|
210
|
-
display: none;
|
211
|
-
}
|
212
|
-
|
213
|
-
:host([resizable]) [part='title'] {
|
214
|
-
cursor: move;
|
215
|
-
-webkit-user-select: none;
|
216
|
-
user-select: none;
|
217
|
-
}
|
218
|
-
|
219
|
-
.resizer {
|
220
|
-
position: absolute;
|
221
|
-
height: 16px;
|
222
|
-
width: 16px;
|
223
|
-
}
|
224
|
-
|
225
|
-
.resizer.edge {
|
226
|
-
height: 8px;
|
227
|
-
width: 8px;
|
228
|
-
inset: -4px;
|
229
|
-
}
|
230
|
-
|
231
|
-
.resizer.edge.n {
|
232
|
-
width: auto;
|
233
|
-
bottom: auto;
|
234
|
-
cursor: ns-resize;
|
235
|
-
}
|
236
|
-
|
237
|
-
.resizer.ne {
|
238
|
-
top: -4px;
|
239
|
-
right: -4px;
|
240
|
-
cursor: nesw-resize;
|
241
|
-
}
|
242
|
-
|
243
|
-
.resizer.edge.e {
|
244
|
-
height: auto;
|
245
|
-
left: auto;
|
246
|
-
cursor: ew-resize;
|
247
|
-
}
|
248
|
-
|
249
|
-
.resizer.se {
|
250
|
-
bottom: -4px;
|
251
|
-
right: -4px;
|
252
|
-
cursor: nwse-resize;
|
253
|
-
}
|
254
|
-
|
255
|
-
.resizer.edge.s {
|
256
|
-
width: auto;
|
257
|
-
top: auto;
|
258
|
-
cursor: ns-resize;
|
259
|
-
}
|
260
|
-
|
261
|
-
.resizer.sw {
|
262
|
-
bottom: -4px;
|
263
|
-
left: -4px;
|
264
|
-
cursor: nesw-resize;
|
265
|
-
}
|
266
|
-
|
267
|
-
.resizer.edge.w {
|
268
|
-
height: auto;
|
269
|
-
right: auto;
|
270
|
-
cursor: ew-resize;
|
271
|
-
}
|
272
|
-
|
273
|
-
.resizer.nw {
|
274
|
-
top: -4px;
|
275
|
-
left: -4px;
|
276
|
-
cursor: nwse-resize;
|
277
|
-
}
|
278
|
-
`;(0,s.hC)("vaadin-dialog-overlay",[h.r,g,m],{moduleId:"vaadin-dialog-overlay-styles"});class _ extends(u((0,n.U)((0,s.Tb)(i.H3)))){static get is(){return"vaadin-dialog-overlay"}static get template(){return i.dy`
|
279
|
-
<div id="backdrop" part="backdrop" hidden$="[[!withBackdrop]]"></div>
|
280
|
-
<div part="overlay" id="overlay" tabindex="0">
|
281
|
-
<section id="resizerContainer" class="resizer-container">
|
282
|
-
<header part="header">
|
283
|
-
<div part="title"><slot name="title"></slot></div>
|
284
|
-
<div part="header-content"><slot name="header-content"></slot></div>
|
285
|
-
</header>
|
286
|
-
<div part="content" id="content"><slot></slot></div>
|
287
|
-
<footer part="footer"><slot name="footer"></slot></footer>
|
288
|
-
</section>
|
289
|
-
</div>
|
290
|
-
`}}(0,a.M)(_);var y=r(2521),f=r(9320),b=r(1462);const w=e=>class extends e{static get properties(){return{opened:{type:Boolean,value:!1,notify:!0},noCloseOnOutsideClick:{type:Boolean,value:!1},noCloseOnEsc:{type:Boolean,value:!1},modeless:{type:Boolean,value:!1}}}ready(){super.ready();const e=this.$.overlay;e.addEventListener("vaadin-overlay-outside-click",this._handleOutsideClick.bind(this)),e.addEventListener("vaadin-overlay-escape-press",this._handleEscPress.bind(this)),this._overlayElement=e}connectedCallback(){super.connectedCallback(),this.__restoreOpened&&(this.opened=!0)}disconnectedCallback(){super.disconnectedCallback(),setTimeout((()=>{this.isConnected||(this.__restoreOpened=this.opened,this.opened=!1)}))}_onOverlayOpened(e){!1===e.detail.value&&(this.opened=!1)}_handleOutsideClick(e){this.noCloseOnOutsideClick&&e.preventDefault()}_handleEscPress(e){this.noCloseOnEsc&&e.preventDefault()}_bringOverlayToFront(){this.modeless&&this._overlayElement.bringToFront()}};var C=r(1037);function z(e){return e.touches?e.touches[0]:e}function x(e){return e.clientX>=0&&e.clientX<=window.innerWidth&&e.clientY>=0&&e.clientY<=window.innerHeight}const E=e=>class extends e{static get properties(){return{draggable:{type:Boolean,value:!1,reflectToAttribute:!0},_touchDevice:{type:Boolean,value:C.T},__dragHandleClassName:{type:String}}}async ready(){super.ready(),this._originalBounds={},this._originalMouseCoords={},this._startDrag=this._startDrag.bind(this),this._drag=this._drag.bind(this),this._stopDrag=this._stopDrag.bind(this),await new Promise(requestAnimationFrame),this.$.overlay.$.overlay.addEventListener("mousedown",this._startDrag),this.$.overlay.$.overlay.addEventListener("touchstart",this._startDrag)}_startDrag(e){if(!("touchstart"===e.type&&e.touches.length>1)&&this.draggable&&(0===e.button||e.touches)){const t=this.$.overlay.$.resizerContainer,r=e.target===t,o=e.offsetX>t.clientWidth||e.offsetY>t.clientHeight,s=e.target===this.$.overlay.$.content,i=e.composedPath().some(((e,t)=>{if(!e.classList)return!1;const r=e.classList.contains(this.__dragHandleClassName||"draggable"),o=e.classList.contains("draggable-leaf-only"),s=0===t;return o&&s||r&&(!o||s)}));if(r&&!o||s||i){i||e.preventDefault(),this._originalBounds=this.$.overlay.getBounds();const t=z(e);this._originalMouseCoords={top:t.pageY,left:t.pageX},window.addEventListener("mouseup",this._stopDrag),window.addEventListener("touchend",this._stopDrag),window.addEventListener("mousemove",this._drag),window.addEventListener("touchmove",this._drag),"absolute"!==this.$.overlay.$.overlay.style.position&&this.$.overlay.setBounds(this._originalBounds)}}}_drag(e){const t=z(e);if(x(t)){const e=this._originalBounds.top+(t.pageY-this._originalMouseCoords.top),r=this._originalBounds.left+(t.pageX-this._originalMouseCoords.left);this.$.overlay.setBounds({top:e,left:r})}}_stopDrag(){window.removeEventListener("mouseup",this._stopDrag),window.removeEventListener("touchend",this._stopDrag),window.removeEventListener("mousemove",this._drag),window.removeEventListener("touchmove",this._drag)}},L=e=>class extends e{static get properties(){return{renderer:{type:Object},headerTitle:String,headerRenderer:{type:Object},footerRenderer:{type:Object}}}requestContentUpdate(){this._overlayElement&&this._overlayElement.requestContentUpdate()}},$=e=>class extends e{static get properties(){return{resizable:{type:Boolean,value:!1,reflectToAttribute:!0}}}async ready(){super.ready(),this._originalBounds={},this._originalMouseCoords={},this._resizeListeners={start:{},resize:{},stop:{}},await new Promise(requestAnimationFrame),this._addResizeListeners()}_addResizeListeners(){["n","e","s","w","nw","ne","se","sw"].forEach((e=>{const t=document.createElement("div");this._resizeListeners.start[e]=t=>this._startResize(t,e),this._resizeListeners.resize[e]=t=>this._resize(t,e),this._resizeListeners.stop[e]=()=>this._stopResize(e),1===e.length&&t.classList.add("edge"),t.classList.add("resizer"),t.classList.add(e),t.addEventListener("mousedown",this._resizeListeners.start[e]),t.addEventListener("touchstart",this._resizeListeners.start[e]),this.$.overlay.$.resizerContainer.appendChild(t)}))}_startResize(e,t){if(!("touchstart"===e.type&&e.touches.length>1)&&(0===e.button||e.touches)){e.preventDefault(),this._originalBounds=this.$.overlay.getBounds();const r=z(e);this._originalMouseCoords={top:r.pageY,left:r.pageX},window.addEventListener("mousemove",this._resizeListeners.resize[t]),window.addEventListener("touchmove",this._resizeListeners.resize[t]),window.addEventListener("mouseup",this._resizeListeners.stop[t]),window.addEventListener("touchend",this._resizeListeners.stop[t]),"absolute"!==this.$.overlay.$.overlay.style.position&&this.$.overlay.setBounds(this._originalBounds)}}_resize(e,t){const r=z(e);if(x(r)){const e=40;t.split("").forEach((t=>{switch(t){case"n":{const t=this._originalBounds.height-(r.pageY-this._originalMouseCoords.top),o=this._originalBounds.top+(r.pageY-this._originalMouseCoords.top);t>e&&this.$.overlay.setBounds({top:o,height:t});break}case"e":{const t=this._originalBounds.width+(r.pageX-this._originalMouseCoords.left);t>e&&this.$.overlay.setBounds({width:t});break}case"s":{const t=this._originalBounds.height+(r.pageY-this._originalMouseCoords.top);t>e&&this.$.overlay.setBounds({height:t});break}case"w":{const t=this._originalBounds.width-(r.pageX-this._originalMouseCoords.left),o=this._originalBounds.left+(r.pageX-this._originalMouseCoords.left);t>e&&this.$.overlay.setBounds({left:o,width:t});break}}}))}}_stopResize(e){window.removeEventListener("mousemove",this._resizeListeners.resize[e]),window.removeEventListener("touchmove",this._resizeListeners.resize[e]),window.removeEventListener("mouseup",this._resizeListeners.stop[e]),window.removeEventListener("touchend",this._resizeListeners.stop[e]),this.dispatchEvent(new CustomEvent("resize",{detail:this._getResizeDimensions()}))}_getResizeDimensions(){const e=this.$.overlay.$.resizerContainer.scrollTop,{width:t,height:r}=getComputedStyle(this.$.overlay.$.overlay),o=this.$.overlay.$.content;o.setAttribute("style","position: absolute; top: 0; right: 0; bottom: 0; left: 0; box-sizing: content-box; height: auto;");const{width:s,height:i}=getComputedStyle(o);return o.removeAttribute("style"),this.$.overlay.$.resizerContainer.scrollTop=e,{width:t,height:r,contentWidth:s,contentHeight:i}}};class T extends(E($(L(w((0,f.u)((0,b.I)((0,y.S)(i.H3)))))))){static get template(){return i.dy`
|
291
|
-
<style>
|
292
|
-
:host {
|
293
|
-
display: none !important;
|
294
|
-
}
|
295
|
-
</style>
|
296
|
-
|
297
|
-
<vaadin-dialog-overlay
|
298
|
-
id="overlay"
|
299
|
-
header-title="[[headerTitle]]"
|
300
|
-
on-opened-changed="_onOverlayOpened"
|
301
|
-
on-mousedown="_bringOverlayToFront"
|
302
|
-
on-touchstart="_bringOverlayToFront"
|
303
|
-
theme$="[[_theme]]"
|
304
|
-
modeless="[[modeless]]"
|
305
|
-
with-backdrop="[[!modeless]]"
|
306
|
-
resizable$="[[resizable]]"
|
307
|
-
restore-focus-on-close
|
308
|
-
focus-trap
|
309
|
-
></vaadin-dialog-overlay>
|
310
|
-
`}static get is(){return"vaadin-dialog"}static get properties(){return{ariaLabel:{type:String,value:""}}}static get observers(){return["_openedChanged(opened)","_ariaLabelChanged(ariaLabel, headerTitle)","_rendererChanged(renderer, headerRenderer, footerRenderer)"]}ready(){super.ready(),this._overlayElement.setAttribute("role","dialog"),(0,d.k)(this)}_rendererChanged(e,t,r){this.$.overlay.setProperties({owner:this,renderer:e,headerRenderer:t,footerRenderer:r})}_openedChanged(e){this.$.overlay.opened=e}_ariaLabelChanged(e,t){e||t?this.$.overlay.setAttribute("aria-label",e||t):this.$.overlay.removeAttribute("aria-label")}}(0,a.M)(T)}}]);
|
package/dist/umd/5977.js
DELETED
@@ -1,294 +0,0 @@
|
|
1
|
-
/*! For license information please see 5977.js.LICENSE.txt */
|
2
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[5977],{5977:(e,t,i)=>{i(1195),i(9416),i(9849),i(1735),i(9098),i(4173);var s=i(6570);const o=s.iv`
|
3
|
-
:host {
|
4
|
-
display: flex;
|
5
|
-
align-items: center;
|
6
|
-
box-sizing: border-box;
|
7
|
-
font-family: var(--lumo-font-family);
|
8
|
-
font-size: var(--lumo-font-size-m);
|
9
|
-
line-height: var(--lumo-line-height-xs);
|
10
|
-
padding: 0.5em calc(var(--lumo-space-l) + var(--lumo-border-radius-m) / 4) 0.5em
|
11
|
-
var(--_lumo-list-box-item-padding-left, calc(var(--lumo-border-radius-m) / 4));
|
12
|
-
min-height: var(--lumo-size-m);
|
13
|
-
outline: none;
|
14
|
-
border-radius: var(--lumo-border-radius-m);
|
15
|
-
cursor: var(--lumo-clickable-cursor);
|
16
|
-
-webkit-font-smoothing: antialiased;
|
17
|
-
-moz-osx-font-smoothing: grayscale;
|
18
|
-
-webkit-tap-highlight-color: var(--lumo-primary-color-10pct);
|
19
|
-
--_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
|
20
|
-
--_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
|
21
|
-
--_selection-color-text: var(--vaadin-selection-color-text, var(--lumo-primary-text-color));
|
22
|
-
}
|
23
|
-
|
24
|
-
/* Checkmark */
|
25
|
-
[part='checkmark']::before {
|
26
|
-
display: var(--_lumo-item-selected-icon-display, none);
|
27
|
-
content: var(--lumo-icons-checkmark);
|
28
|
-
font-family: lumo-icons;
|
29
|
-
font-size: var(--lumo-icon-size-m);
|
30
|
-
line-height: 1;
|
31
|
-
font-weight: normal;
|
32
|
-
width: 1em;
|
33
|
-
height: 1em;
|
34
|
-
margin: calc((1 - var(--lumo-line-height-xs)) * var(--lumo-font-size-m) / 2) 0;
|
35
|
-
color: var(--_selection-color-text);
|
36
|
-
flex: none;
|
37
|
-
opacity: 0;
|
38
|
-
transition: transform 0.2s cubic-bezier(0.12, 0.32, 0.54, 2), opacity 0.1s;
|
39
|
-
}
|
40
|
-
|
41
|
-
:host([selected]) [part='checkmark']::before {
|
42
|
-
opacity: 1;
|
43
|
-
}
|
44
|
-
|
45
|
-
:host([active]:not([selected])) [part='checkmark']::before {
|
46
|
-
transform: scale(0.8);
|
47
|
-
opacity: 0;
|
48
|
-
transition-duration: 0s;
|
49
|
-
}
|
50
|
-
|
51
|
-
[part='content'] {
|
52
|
-
flex: auto;
|
53
|
-
}
|
54
|
-
|
55
|
-
/* Disabled */
|
56
|
-
:host([disabled]) {
|
57
|
-
color: var(--lumo-disabled-text-color);
|
58
|
-
cursor: default;
|
59
|
-
pointer-events: none;
|
60
|
-
}
|
61
|
-
|
62
|
-
/* TODO a workaround until we have "focus-follows-mouse". After that, use the hover style for focus-ring as well */
|
63
|
-
@media (any-hover: hover) {
|
64
|
-
:host(:hover:not([disabled])) {
|
65
|
-
background-color: var(--lumo-primary-color-10pct);
|
66
|
-
}
|
67
|
-
|
68
|
-
:host([focus-ring]:not([disabled])) {
|
69
|
-
box-shadow: inset 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
|
70
|
-
}
|
71
|
-
}
|
72
|
-
|
73
|
-
/* RTL specific styles */
|
74
|
-
:host([dir='rtl']) {
|
75
|
-
padding-left: calc(var(--lumo-space-l) + var(--lumo-border-radius-m) / 4);
|
76
|
-
padding-right: var(--_lumo-list-box-item-padding-left, calc(var(--lumo-border-radius-m) / 4));
|
77
|
-
}
|
78
|
-
|
79
|
-
/* Slotted icons */
|
80
|
-
:host ::slotted(vaadin-icon) {
|
81
|
-
width: var(--lumo-icon-size-m);
|
82
|
-
height: var(--lumo-icon-size-m);
|
83
|
-
}
|
84
|
-
`;(0,s.hC)("vaadin-item",o,{moduleId:"lumo-item"});const r=s.iv`
|
85
|
-
:host {
|
86
|
-
transition: background-color 100ms;
|
87
|
-
overflow: hidden;
|
88
|
-
--_lumo-item-selected-icon-display: block;
|
89
|
-
--_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
|
90
|
-
--_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
|
91
|
-
}
|
92
|
-
|
93
|
-
@media (any-hover: hover) {
|
94
|
-
:host([focused]:not([disabled])) {
|
95
|
-
box-shadow: inset 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
|
96
|
-
}
|
97
|
-
}
|
98
|
-
`;(0,s.hC)("vaadin-combo-box-item",[o,r],{moduleId:"lumo-combo-box-item"});const n=s.iv`
|
99
|
-
[part~='loader'] {
|
100
|
-
box-sizing: border-box;
|
101
|
-
width: var(--lumo-icon-size-s);
|
102
|
-
height: var(--lumo-icon-size-s);
|
103
|
-
border: 2px solid transparent;
|
104
|
-
border-color: var(--lumo-primary-color-10pct) var(--lumo-primary-color-10pct) var(--lumo-primary-color)
|
105
|
-
var(--lumo-primary-color);
|
106
|
-
border-radius: calc(0.5 * var(--lumo-icon-size-s));
|
107
|
-
opacity: 0;
|
108
|
-
pointer-events: none;
|
109
|
-
}
|
110
|
-
|
111
|
-
:host(:not([loading])) [part~='loader'] {
|
112
|
-
display: none;
|
113
|
-
}
|
114
|
-
|
115
|
-
:host([loading]) [part~='loader'] {
|
116
|
-
animation: 1s linear infinite lumo-loader-rotate, 0.3s 0.1s lumo-loader-fade-in both;
|
117
|
-
}
|
118
|
-
|
119
|
-
@keyframes lumo-loader-fade-in {
|
120
|
-
0% {
|
121
|
-
opacity: 0;
|
122
|
-
}
|
123
|
-
|
124
|
-
100% {
|
125
|
-
opacity: 1;
|
126
|
-
}
|
127
|
-
}
|
128
|
-
|
129
|
-
@keyframes lumo-loader-rotate {
|
130
|
-
0% {
|
131
|
-
transform: rotate(0deg);
|
132
|
-
}
|
133
|
-
|
134
|
-
100% {
|
135
|
-
transform: rotate(360deg);
|
136
|
-
}
|
137
|
-
}
|
138
|
-
`;var a=i(6754),l=i(510);const d=s.iv`
|
139
|
-
[part='content'] {
|
140
|
-
padding: 0;
|
141
|
-
}
|
142
|
-
|
143
|
-
/* When items are empty, the spinner needs some room */
|
144
|
-
:host(:not([closing])) [part~='content'] {
|
145
|
-
min-height: calc(2 * var(--lumo-space-s) + var(--lumo-icon-size-s));
|
146
|
-
}
|
147
|
-
|
148
|
-
[part~='overlay'] {
|
149
|
-
position: relative;
|
150
|
-
}
|
151
|
-
|
152
|
-
:host([top-aligned]) [part~='overlay'] {
|
153
|
-
margin-top: var(--lumo-space-xs);
|
154
|
-
}
|
155
|
-
|
156
|
-
:host([bottom-aligned]) [part~='overlay'] {
|
157
|
-
margin-bottom: var(--lumo-space-xs);
|
158
|
-
}
|
159
|
-
`,h=s.iv`
|
160
|
-
[part~='loader'] {
|
161
|
-
position: absolute;
|
162
|
-
z-index: 1;
|
163
|
-
left: var(--lumo-space-s);
|
164
|
-
right: var(--lumo-space-s);
|
165
|
-
top: var(--lumo-space-s);
|
166
|
-
margin-left: auto;
|
167
|
-
margin-inline-start: auto;
|
168
|
-
margin-inline-end: 0;
|
169
|
-
}
|
170
|
-
|
171
|
-
:host([dir='rtl']) [part~='loader'] {
|
172
|
-
left: auto;
|
173
|
-
margin-left: 0;
|
174
|
-
margin-right: auto;
|
175
|
-
margin-inline-start: 0;
|
176
|
-
margin-inline-end: auto;
|
177
|
-
}
|
178
|
-
`;(0,s.hC)("vaadin-combo-box-overlay",[l.I,a.e,d,n,h,s.iv`
|
179
|
-
:host {
|
180
|
-
--_vaadin-combo-box-items-container-border-width: var(--lumo-space-xs);
|
181
|
-
--_vaadin-combo-box-items-container-border-style: solid;
|
182
|
-
}
|
183
|
-
`],{moduleId:"lumo-combo-box-overlay"}),i(1578);var u=i(2279);const c=s.iv`
|
184
|
-
:host {
|
185
|
-
outline: none;
|
186
|
-
}
|
187
|
-
|
188
|
-
[part='toggle-button']::before {
|
189
|
-
content: var(--lumo-icons-dropdown);
|
190
|
-
}
|
191
|
-
`;(0,s.hC)("vaadin-combo-box",[u.J,c],{moduleId:"lumo-combo-box"}),i(3553);var m=i(4241),p=i(2807),_=i(1914);const v=e=>class extends e{static get properties(){return{index:{type:Number},item:{type:Object},label:{type:String},selected:{type:Boolean,value:!1,reflectToAttribute:!0},focused:{type:Boolean,value:!1,reflectToAttribute:!0},renderer:{type:Function}}}static get observers(){return["__rendererOrItemChanged(renderer, index, item.*, selected, focused)","__updateLabel(label, renderer)"]}static get observedAttributes(){return[...super.observedAttributes,"hidden"]}attributeChangedCallback(e,t,i){"hidden"===e&&null!==i?this.index=void 0:super.attributeChangedCallback(e,t,i)}connectedCallback(){super.connectedCallback(),this._owner=this.parentNode.owner;const e=this._owner.getAttribute("dir");e&&this.setAttribute("dir",e)}requestContentUpdate(){if(!this.renderer)return;const e={index:this.index,item:this.item,focused:this.focused,selected:this.selected};this.renderer(this,this._owner,e)}__rendererOrItemChanged(e,t,i){void 0!==i&&void 0!==t&&(this._oldRenderer!==e&&(this.innerHTML="",delete this._$litPart$),e&&(this._oldRenderer=e,this.requestContentUpdate()))}__updateLabel(e,t){t||(this.textContent=e)}};class g extends(v((0,s.Tb)((0,_.U)(m.H3)))){static get template(){return m.dy`
|
192
|
-
<style>
|
193
|
-
:host {
|
194
|
-
display: block;
|
195
|
-
}
|
196
|
-
|
197
|
-
:host([hidden]) {
|
198
|
-
display: none;
|
199
|
-
}
|
200
|
-
</style>
|
201
|
-
<span part="checkmark" aria-hidden="true"></span>
|
202
|
-
<div part="content">
|
203
|
-
<slot></slot>
|
204
|
-
</div>
|
205
|
-
`}static get is(){return"vaadin-combo-box-item"}}(0,p.M)(g);var b=i(4457),f=i(6196),I=i(3373);const y=e=>class extends((0,I.y)(e)){static get observers(){return["_setOverlayWidth(positionTarget, opened)"]}constructor(){super(),this.requiredVerticalSpace=200}connectedCallback(){super.connectedCallback();const e=this._comboBox,t=e&&e.getAttribute("dir");t&&this.setAttribute("dir",t)}_shouldCloseOnOutsideClick(e){const t=e.composedPath();return!t.includes(this.positionTarget)&&!t.includes(this)}_updateOverlayWidth(){const e=this.localName;this.style.setProperty(`--_${e}-default-width`,`${this.positionTarget.clientWidth}px`);const t=getComputedStyle(this._comboBox).getPropertyValue(`--${e}-width`);""===t?this.style.removeProperty(`--${e}-width`):this.style.setProperty(`--${e}-width`,t)}_setOverlayWidth(e,t){e&&t&&(this._updateOverlayWidth(),this._updatePosition())}},C=s.iv`
|
206
|
-
#overlay {
|
207
|
-
width: var(--vaadin-combo-box-overlay-width, var(--_vaadin-combo-box-overlay-default-width, auto));
|
208
|
-
}
|
209
|
-
|
210
|
-
[part='content'] {
|
211
|
-
display: flex;
|
212
|
-
flex-direction: column;
|
213
|
-
height: 100%;
|
214
|
-
}
|
215
|
-
`;(0,s.hC)("vaadin-combo-box-overlay",[f.r,C],{moduleId:"vaadin-combo-box-overlay-styles"});class x extends(y((0,b.F)((0,_.U)((0,s.Tb)(m.H3))))){static get is(){return"vaadin-combo-box-overlay"}static get template(){return m.dy`
|
216
|
-
<div id="backdrop" part="backdrop" hidden></div>
|
217
|
-
<div part="overlay" id="overlay">
|
218
|
-
<div part="loader"></div>
|
219
|
-
<div part="content" id="content"><slot></slot></div>
|
220
|
-
</div>
|
221
|
-
`}}(0,p.M)(x);var w=i(4905),V=i(3971),E=i(3003);const P=class{toString(){return""}},k=e=>class extends e{static get properties(){return{items:{type:Array,observer:"__itemsChanged"},focusedIndex:{type:Number,observer:"__focusedIndexChanged"},loading:{type:Boolean,observer:"__loadingChanged"},opened:{type:Boolean,observer:"__openedChanged"},selectedItem:{type:Object,observer:"__selectedItemChanged"},itemIdPath:{type:String},owner:{type:Object},getItemLabel:{type:Object},renderer:{type:Object,observer:"__rendererChanged"},theme:{type:String}}}constructor(){super(),this.__boundOnItemClick=this.__onItemClick.bind(this)}get _viewportTotalPaddingBottom(){if(void 0===this._cachedViewportTotalPaddingBottom){const e=window.getComputedStyle(this.$.selector);this._cachedViewportTotalPaddingBottom=[e.paddingBottom,e.borderBottomWidth].map((e=>parseInt(e,10))).reduce(((e,t)=>e+t))}return this._cachedViewportTotalPaddingBottom}ready(){super.ready(),this.setAttribute("role","listbox"),this.id=`${this.localName}-${(0,V.l)()}`,this.__hostTagName=this.constructor.is.replace("-scroller",""),this.addEventListener("click",(e=>e.stopPropagation())),this.__patchWheelOverScrolling(),this.__virtualizer=new E.d({createElements:this.__createElements.bind(this),updateElement:this._updateElement.bind(this),elementsContainer:this,scrollTarget:this,scrollContainer:this.$.selector})}requestContentUpdate(){this.__virtualizer&&this.__virtualizer.update()}scrollIntoView(e){if(!(this.opened&&e>=0))return;const t=this._visibleItemsCount();let i=e;e>this.__virtualizer.lastVisibleIndex-1?(this.__virtualizer.scrollToIndex(e),i=e-t+1):e>this.__virtualizer.firstVisibleIndex&&(i=this.__virtualizer.firstVisibleIndex),this.__virtualizer.scrollToIndex(Math.max(0,i));const s=[...this.children].find((e=>!e.hidden&&e.index===this.__virtualizer.lastVisibleIndex));if(!s||e!==s.index)return;const o=s.getBoundingClientRect(),r=this.getBoundingClientRect(),n=o.bottom-r.bottom+this._viewportTotalPaddingBottom;n>0&&(this.scrollTop+=n)}_isItemSelected(e,t,i){return!(e instanceof P)&&(i&&void 0!==e&&void 0!==t?(0,w.U)(i,e)===(0,w.U)(i,t):e===t)}__itemsChanged(e){this.__virtualizer&&e&&(this.__virtualizer.size=e.length,this.__virtualizer.flush(),this.requestContentUpdate())}__loadingChanged(){this.requestContentUpdate()}__openedChanged(e){e&&this.requestContentUpdate()}__selectedItemChanged(){this.requestContentUpdate()}__focusedIndexChanged(e,t){e!==t&&this.requestContentUpdate(),e>=0&&!this.loading&&this.scrollIntoView(e)}__rendererChanged(e,t){(e||t)&&this.requestContentUpdate()}__createElements(e){return[...Array(e)].map((()=>{const e=document.createElement(`${this.__hostTagName}-item`);return e.addEventListener("click",this.__boundOnItemClick),e.tabIndex="-1",e.style.width="100%",e}))}_updateElement(e,t){const i=this.items[t],s=this.focusedIndex,o=this._isItemSelected(i,this.selectedItem,this.itemIdPath);e.setProperties({item:i,index:t,label:this.getItemLabel(i),selected:o,renderer:this.renderer,focused:!this.loading&&s===t}),e.id=`${this.__hostTagName}-item-${t}`,e.setAttribute("role",void 0!==t&&"option"),e.setAttribute("aria-selected",o.toString()),e.setAttribute("aria-posinset",t+1),e.setAttribute("aria-setsize",this.items.length),this.theme?e.setAttribute("theme",this.theme):e.removeAttribute("theme"),i instanceof P&&this.__requestItemByIndex(t)}__onItemClick(e){this.dispatchEvent(new CustomEvent("selection-changed",{detail:{item:e.currentTarget.item}}))}__patchWheelOverScrolling(){this.$.selector.addEventListener("wheel",(e=>{const t=0===this.scrollTop,i=this.scrollHeight-this.scrollTop-this.clientHeight<=1;(t&&e.deltaY<0||i&&e.deltaY>0)&&e.preventDefault()}))}__requestItemByIndex(e){requestAnimationFrame((()=>{this.dispatchEvent(new CustomEvent("index-requested",{detail:{index:e,currentScrollerPos:this._oldScrollerPosition}}))}))}_visibleItemsCount(){return this.__virtualizer.scrollToIndex(this.__virtualizer.firstVisibleIndex),this.__virtualizer.size>0?this.__virtualizer.lastVisibleIndex-this.__virtualizer.firstVisibleIndex+1:0}};class O extends(k(m.H3)){static get is(){return"vaadin-combo-box-scroller"}static get template(){return m.dy`
|
222
|
-
<style>
|
223
|
-
:host {
|
224
|
-
display: block;
|
225
|
-
min-height: 1px;
|
226
|
-
overflow: auto;
|
227
|
-
|
228
|
-
/* Fixes item background from getting on top of scrollbars on Safari */
|
229
|
-
transform: translate3d(0, 0, 0);
|
230
|
-
|
231
|
-
/* Enable momentum scrolling on iOS */
|
232
|
-
-webkit-overflow-scrolling: touch;
|
233
|
-
|
234
|
-
/* Fixes scrollbar disappearing when 'Show scroll bars: Always' enabled in Safari */
|
235
|
-
box-shadow: 0 0 0 white;
|
236
|
-
}
|
237
|
-
|
238
|
-
#selector {
|
239
|
-
border-width: var(--_vaadin-combo-box-items-container-border-width);
|
240
|
-
border-style: var(--_vaadin-combo-box-items-container-border-style);
|
241
|
-
border-color: var(--_vaadin-combo-box-items-container-border-color, transparent);
|
242
|
-
position: relative;
|
243
|
-
}
|
244
|
-
</style>
|
245
|
-
<div id="selector">
|
246
|
-
<slot></slot>
|
247
|
-
</div>
|
248
|
-
`}}(0,p.M)(O);var S=i(2521),A=i(4463),T=i(1174),z=i(3208),B=i(6729),L=i(9091);const D=e=>class extends((0,L.t)(e)){static get properties(){return{pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"pattern"]}static get constraints(){return[...super.constraints,"pattern"]}};var F=i(2743);const q=e=>class extends e{static get properties(){return{pageSize:{type:Number,value:50,observer:"_pageSizeChanged"},size:{type:Number,observer:"_sizeChanged"},dataProvider:{type:Object,observer:"_dataProviderChanged"},_pendingRequests:{value:()=>({})},__placeHolder:{value:new P},__previousDataProviderFilter:{type:String}}}static get observers(){return["_dataProviderFilterChanged(filter)","_warnDataProviderValue(dataProvider, value)","_ensureFirstPage(opened)"]}ready(){super.ready(),this._scroller.addEventListener("index-requested",(e=>{const t=e.detail.index,i=e.detail.currentScrollerPos,s=Math.floor(1.5*this.pageSize);if(!this._shouldSkipIndex(t,s,i)&&void 0!==t){const e=this._getPageForIndex(t);this._shouldLoadPage(e)&&this._loadPage(e)}}))}_dataProviderFilterChanged(e){void 0!==this.__previousDataProviderFilter||""!==e?this.__previousDataProviderFilter!==e&&(this.__previousDataProviderFilter=e,this._pendingRequests={},this.loading=this._shouldFetchData(),this.size=void 0,this.clearCache()):this.__previousDataProviderFilter=e}_shouldFetchData(){return!!this.dataProvider&&(this.opened||this.filter&&this.filter.length)}_ensureFirstPage(e){e&&this._shouldLoadPage(0)&&this._loadPage(0)}_shouldSkipIndex(e,t,i){return 0!==i&&e>=i-t&&e<=i+t}_shouldLoadPage(e){if(!this.filteredItems||this._forceNextRequest)return this._forceNextRequest=!1,!0;const t=this.filteredItems[e*this.pageSize];return void 0!==t?t instanceof P:void 0===this.size}_loadPage(e){if(this._pendingRequests[e]||!this.dataProvider)return;const t={page:e,pageSize:this.pageSize,filter:this.filter},i=(s,o)=>{if(this._pendingRequests[e]!==i)return;const r=this.filteredItems?[...this.filteredItems]:[];r.splice(t.page*t.pageSize,s.length,...s),this.filteredItems=r,this.opened||this._isInputFocused()||this._commitValue(),void 0!==o&&(this.size=o),delete this._pendingRequests[e],0===Object.keys(this._pendingRequests).length&&(this.loading=!1)};this._pendingRequests[e]=i,this.loading=!0,this.dataProvider(t,i)}_getPageForIndex(e){return Math.floor(e/this.pageSize)}clearCache(){if(!this.dataProvider)return;this._pendingRequests={};const e=[];for(let t=0;t<(this.size||0);t++)e.push(this.__placeHolder);this.filteredItems=e,this._shouldFetchData()?(this._forceNextRequest=!1,this._loadPage(0)):this._forceNextRequest=!0}_sizeChanged(e=0){const t=(this.filteredItems||[]).slice(0,e);for(let i=0;i<e;i++)t[i]=void 0!==t[i]?t[i]:this.__placeHolder;this.filteredItems=t,this._flushPendingRequests(e)}_pageSizeChanged(e,t){if(Math.floor(e)!==e||e<1)throw this.pageSize=t,new Error("`pageSize` value must be an integer > 0");this.clearCache()}_dataProviderChanged(e,t){this._ensureItemsOrDataProvider((()=>{this.dataProvider=t})),this.clearCache()}_ensureItemsOrDataProvider(e){if(void 0!==this.items&&void 0!==this.dataProvider)throw e(),new Error("Using `items` and `dataProvider` together is not supported");this.dataProvider&&!this.filteredItems&&(this.filteredItems=[])}_warnDataProviderValue(e,t){if(e&&""!==t&&(void 0===this.selectedItem||null===this.selectedItem)){const e=this.__getItemIndexByValue(this.filteredItems,t);(e<0||!this._getItemLabel(this.filteredItems[e]))&&console.warn("Warning: unable to determine the label for the provided `value`. Nothing to display in the text field. This usually happens when setting an initial `value` before any items are returned from the `dataProvider` callback. Consider setting `selectedItem` instead of `value`")}}_flushPendingRequests(e){if(this._pendingRequests){const t=Math.ceil(e/this.pageSize);Object.entries(this._pendingRequests).forEach((([i,s])=>{parseInt(i)>=t&&s([],e)}))}}};var R=i(5229),U=i(1360),$=i(3550),N=i(2628),H=i(1037),M=i(6155),W=i(9320),j=i(262),J=i(6326),Y=i(4524),K=i(9580);function Q(e){return null!=e}function G(e,t){return e.findIndex((e=>!(e instanceof P)&&t(e)))}const X=e=>class extends((0,W.u)((0,M.k)((0,Y.n)((0,U.W)((0,N.L)((0,J.J)((0,R.f)(e)))))))){static get properties(){return{opened:{type:Boolean,notify:!0,value:!1,reflectToAttribute:!0,observer:"_openedChanged"},autoOpenDisabled:{type:Boolean},readonly:{type:Boolean,value:!1,reflectToAttribute:!0},renderer:Function,items:{type:Array,observer:"_itemsChanged"},allowCustomValue:{type:Boolean,value:!1},filteredItems:{type:Array,observer:"_filteredItemsChanged"},_lastCommittedValue:String,loading:{type:Boolean,value:!1,reflectToAttribute:!0},_focusedIndex:{type:Number,observer:"_focusedIndexChanged",value:-1},filter:{type:String,value:"",notify:!0},selectedItem:{type:Object,notify:!0},itemLabelPath:{type:String,value:"label",observer:"_itemLabelPathChanged"},itemValuePath:{type:String,value:"value"},itemIdPath:String,_toggleElement:{type:Object,observer:"_toggleElementChanged"},_dropdownItems:{type:Array},_closeOnBlurIsPrevented:Boolean,_scroller:Object,_overlayOpened:{type:Boolean,observer:"_overlayOpenedChanged"}}}static get observers(){return["_selectedItemChanged(selectedItem, itemValuePath, itemLabelPath)","_openedOrItemsChanged(opened, _dropdownItems, loading)","_updateScroller(_scroller, _dropdownItems, opened, loading, selectedItem, itemIdPath, _focusedIndex, renderer, theme)"]}constructor(){super(),this._boundOverlaySelectedItemChanged=this._overlaySelectedItemChanged.bind(this),this._boundOnClearButtonMouseDown=this.__onClearButtonMouseDown.bind(this),this._boundOnClick=this._onClick.bind(this),this._boundOnOverlayTouchAction=this._onOverlayTouchAction.bind(this),this._boundOnTouchend=this._onTouchend.bind(this)}get _tagNamePrefix(){return"vaadin-combo-box"}get _nativeInput(){return this.inputElement}_inputElementChanged(e){super._inputElementChanged(e);const t=this._nativeInput;t&&(t.autocomplete="off",t.autocapitalize="off",t.setAttribute("role","combobox"),t.setAttribute("aria-autocomplete","list"),t.setAttribute("aria-expanded",!!this.opened),t.setAttribute("spellcheck","false"),t.setAttribute("autocorrect","off"),this._revertInputValueToValue(),this.clearElement&&this.clearElement.addEventListener("mousedown",this._boundOnClearButtonMouseDown))}ready(){super.ready(),this._initOverlay(),this._initScroller(),this._lastCommittedValue=this.value,this.addEventListener("click",this._boundOnClick),this.addEventListener("touchend",this._boundOnTouchend);const e=()=>{requestAnimationFrame((()=>{this._overlayElement.bringToFront()}))};this.addEventListener("mousedown",e),this.addEventListener("touchstart",e),(0,j.k)(this),this.addController(new K.B(this))}disconnectedCallback(){super.disconnectedCallback(),this.close()}requestContentUpdate(){this._scroller&&(this._scroller.requestContentUpdate(),this._getItemElements().forEach((e=>{e.requestContentUpdate()})))}open(){this.disabled||this.readonly||(this.opened=!0)}close(){this.opened=!1}_propertiesChanged(e,t,i){super._propertiesChanged(e,t,i),void 0!==t.filter&&this._filterChanged(t.filter)}_initOverlay(){const e=this.$.overlay;e._comboBox=this,e.addEventListener("touchend",this._boundOnOverlayTouchAction),e.addEventListener("touchmove",this._boundOnOverlayTouchAction),e.addEventListener("mousedown",(e=>e.preventDefault())),e.addEventListener("opened-changed",(e=>{this._overlayOpened=e.detail.value})),this._overlayElement=e}_initScroller(e){const t=`${this._tagNamePrefix}-scroller`,i=this._overlayElement;i.renderer=e=>{e.firstChild||e.appendChild(document.createElement(t))},i.requestContentUpdate();const s=i.querySelector(t);s.owner=e||this,s.getItemLabel=this._getItemLabel.bind(this),s.addEventListener("selection-changed",this._boundOverlaySelectedItemChanged),this._scroller=s}_updateScroller(e,t,i,s,o,r,n,a,l){e&&(i&&(e.style.maxHeight=getComputedStyle(this).getPropertyValue(`--${this._tagNamePrefix}-overlay-max-height`)||"65vh"),e.setProperties({items:i?t:[],opened:i,loading:s,selectedItem:o,itemIdPath:r,focusedIndex:n,renderer:a,theme:l}))}_openedOrItemsChanged(e,t,i){this._overlayOpened=!(!e||!(i||t&&t.length))}_overlayOpenedChanged(e,t){e?(this.dispatchEvent(new CustomEvent("vaadin-combo-box-dropdown-opened",{bubbles:!0,composed:!0})),this._onOpened()):t&&this._dropdownItems&&this._dropdownItems.length&&(this.close(),this.dispatchEvent(new CustomEvent("vaadin-combo-box-dropdown-closed",{bubbles:!0,composed:!0})))}_focusedIndexChanged(e,t){void 0!==t&&this._updateActiveDescendant(e)}_isInputFocused(){return this.inputElement&&(0,$.Qw)(this.inputElement)}_updateActiveDescendant(e){const t=this._nativeInput;if(!t)return;const i=this._getItemElements().find((t=>t.index===e));i?t.setAttribute("aria-activedescendant",i.id):t.removeAttribute("aria-activedescendant")}_openedChanged(e,t){if(void 0===t)return;e?(this._openedWithFocusRing=this.hasAttribute("focus-ring"),this._isInputFocused()||H.T||this.inputElement&&this.inputElement.focus(),this._overlayElement.restoreFocusOnClose=!0):(this._onClosed(),this._openedWithFocusRing&&this._isInputFocused()&&this.setAttribute("focus-ring",""));const i=this._nativeInput;i&&(i.setAttribute("aria-expanded",!!e),e?i.setAttribute("aria-controls",this._scroller.id):i.removeAttribute("aria-controls"))}_onOverlayTouchAction(){this._closeOnBlurIsPrevented=!0,this.inputElement.blur(),this._closeOnBlurIsPrevented=!1}_isClearButton(e){return e.composedPath()[0]===this.clearElement}__onClearButtonMouseDown(e){e.preventDefault(),this.inputElement.focus()}_onClearButtonClick(e){e.preventDefault(),this._onClearAction(),this.opened&&this.requestContentUpdate()}_onToggleButtonClick(e){e.preventDefault(),this.opened?this.close():this.open()}_onHostClick(e){this.autoOpenDisabled||(e.preventDefault(),this.open())}_onClick(e){this._isClearButton(e)?this._onClearButtonClick(e):e.composedPath().includes(this._toggleElement)?this._onToggleButtonClick(e):this._onHostClick(e)}_onKeyDown(e){super._onKeyDown(e),"Tab"===e.key?this._overlayElement.restoreFocusOnClose=!1:"ArrowDown"===e.key?(this._onArrowDown(),e.preventDefault()):"ArrowUp"===e.key&&(this._onArrowUp(),e.preventDefault())}_getItemLabel(e){let t=e&&this.itemLabelPath?(0,w.U)(this.itemLabelPath,e):void 0;return null==t&&(t=e?e.toString():""),t}_getItemValue(e){let t=e&&this.itemValuePath?(0,w.U)(this.itemValuePath,e):void 0;return void 0===t&&(t=e?e.toString():""),t}_onArrowDown(){if(this.opened){const e=this._dropdownItems;e&&(this._focusedIndex=Math.min(e.length-1,this._focusedIndex+1),this._prefillFocusedItemLabel())}else this.open()}_onArrowUp(){if(this.opened){if(this._focusedIndex>-1)this._focusedIndex=Math.max(0,this._focusedIndex-1);else{const e=this._dropdownItems;e&&(this._focusedIndex=e.length-1)}this._prefillFocusedItemLabel()}else this.open()}_prefillFocusedItemLabel(){if(this._focusedIndex>-1){const e=this._dropdownItems[this._focusedIndex];this._inputElementValue=this._getItemLabel(e),this._markAllSelectionRange()}}_setSelectionRange(e,t){this._isInputFocused()&&this.inputElement.setSelectionRange&&this.inputElement.setSelectionRange(e,t)}_markAllSelectionRange(){void 0!==this._inputElementValue&&this._setSelectionRange(0,this._inputElementValue.length)}_clearSelectionRange(){if(void 0!==this._inputElementValue){const e=this._inputElementValue?this._inputElementValue.length:0;this._setSelectionRange(e,e)}}_closeOrCommit(){this.opened||this.loading?this.close():this._commitValue()}_onEnter(e){if(!this._hasValidInputValue())return e.preventDefault(),void e.stopPropagation();this.opened&&(e.preventDefault(),e.stopPropagation()),this._closeOrCommit()}_hasValidInputValue(){const e=this._focusedIndex<0&&""!==this._inputElementValue&&this._getItemLabel(this.selectedItem)!==this._inputElementValue;return this.allowCustomValue||!e}_onEscape(e){this.autoOpenDisabled?this.opened||this.value!==this._inputElementValue&&this._inputElementValue.length>0?(e.stopPropagation(),this._focusedIndex=-1,this.cancel()):this.clearButtonVisible&&!this.opened&&this.value&&(e.stopPropagation(),this._onClearAction()):this.opened?(e.stopPropagation(),this._focusedIndex>-1?(this._focusedIndex=-1,this._revertInputValue()):this.cancel()):this.clearButtonVisible&&this.value&&(e.stopPropagation(),this._onClearAction())}_toggleElementChanged(e){e&&(e.addEventListener("mousedown",(e=>e.preventDefault())),e.addEventListener("click",(()=>{H.T&&!this._isInputFocused()&&document.activeElement.blur()})))}_onClearAction(){this.selectedItem=null,this.allowCustomValue&&(this.value=""),this._detectAndDispatchChange()}cancel(){this._revertInputValueToValue(),this._lastCommittedValue=this.value,this._closeOrCommit()}_onOpened(){this._lastCommittedValue=this.value}_onClosed(){this.loading&&!this.allowCustomValue||this._commitValue()}_commitValue(){if(this._focusedIndex>-1){const e=this._dropdownItems[this._focusedIndex];this.selectedItem!==e&&(this.selectedItem=e),this._inputElementValue=this._getItemLabel(this.selectedItem),this._focusedIndex=-1}else if(""===this._inputElementValue||void 0===this._inputElementValue)this.selectedItem=null,this.allowCustomValue&&(this.value="");else{const e=[this.selectedItem,...this._dropdownItems||[]],t=e[this.__getItemIndexByLabel(e,this._inputElementValue)];if(this.allowCustomValue&&!t){const e=this._inputElementValue;this._lastCustomValue=e;const t=new CustomEvent("custom-value-set",{detail:e,composed:!0,cancelable:!0,bubbles:!0});this.dispatchEvent(t),t.defaultPrevented||(this.value=e)}else this.allowCustomValue||this.opened||!t?this._inputElementValue=this.selectedItem?this._getItemLabel(this.selectedItem):this.value||"":this.value=this._getItemValue(t)}this._detectAndDispatchChange(),this._clearSelectionRange(),this.filter=""}_onInput(e){const t=this._inputElementValue,i={};this.filter===t?this._filterChanged(this.filter):i.filter=t,this.opened||this._isClearButton(e)||this.autoOpenDisabled||(i.opened=!0),this.setProperties(i)}_onChange(e){e.stopPropagation()}_itemLabelPathChanged(e){"string"!=typeof e&&console.error("You should set itemLabelPath to a valid string")}_filterChanged(e){this._scrollIntoView(0),this._focusedIndex=-1,this.items?this.filteredItems=this._filterItems(this.items,e):this._filteredItemsChanged(this.filteredItems)}_revertInputValue(){""!==this.filter?this._inputElementValue=this.filter:this._revertInputValueToValue(),this._clearSelectionRange()}_revertInputValueToValue(){this.allowCustomValue&&!this.selectedItem?this._inputElementValue=this.value:this._inputElementValue=this._getItemLabel(this.selectedItem)}_selectedItemChanged(e){if(null==e)this.filteredItems&&(this.allowCustomValue||(this.value=""),this._toggleHasValue(this._hasValue),this._inputElementValue=this.value);else{const t=this._getItemValue(e);if(this.value!==t&&(this.value=t,this.value!==t))return;this._toggleHasValue(!0),this._inputElementValue=this._getItemLabel(e)}}_valueChanged(e,t){""===e&&void 0===t||(Q(e)?(this._getItemValue(this.selectedItem)!==e&&this._selectItemForValue(e),!this.selectedItem&&this.allowCustomValue&&(this._inputElementValue=e),this._toggleHasValue(this._hasValue)):this.selectedItem=null,this.filter="",this._lastCommittedValue=void 0)}_detectAndDispatchChange(){document.hasFocus()&&this.validate(),this.value!==this._lastCommittedValue&&(this.dispatchEvent(new CustomEvent("change",{bubbles:!0})),this._lastCommittedValue=this.value)}_itemsChanged(e,t){this._ensureItemsOrDataProvider((()=>{this.items=t})),e?this.filteredItems=e.slice(0):t&&(this.filteredItems=null)}_filteredItemsChanged(e,t){this._setDropdownItems(e);const i=t?t[this._focusedIndex]:null,s=this.__getItemIndexByValue(e,this.value);(null===this.selectedItem||void 0===this.selectedItem)&&s>=0&&(this.selectedItem=e[s]);const o=this.__getItemIndexByValue(e,this._getItemValue(i));this._focusedIndex=o>-1?o:this.__getItemIndexByLabel(this.filteredItems,this.filter)}_filterItems(e,t){if(!e)return e;const i=e.filter((e=>(t=t?t.toString().toLowerCase():"",this._getItemLabel(e).toString().toLowerCase().indexOf(t)>-1)));return i}_selectItemForValue(e){const t=this.__getItemIndexByValue(this.filteredItems,e),i=this.selectedItem;t>=0?this.selectedItem=this.filteredItems[t]:this.dataProvider&&void 0===this.selectedItem?this.selectedItem=void 0:this.selectedItem=null,null===this.selectedItem&&null===i&&this._selectedItemChanged(this.selectedItem)}_setDropdownItems(e){this._dropdownItems=e}_getItemElements(){return Array.from(this._scroller.querySelectorAll(`${this._tagNamePrefix}-item`))}_scrollIntoView(e){this._scroller&&this._scroller.scrollIntoView(e)}__getItemIndexByValue(e,t){return e&&Q(t)?G(e,(e=>this._getItemValue(e)===t)):-1}__getItemIndexByLabel(e,t){return e&&t?G(e,(e=>this._getItemLabel(e).toString().toLowerCase()===t.toString().toLowerCase())):-1}_overlaySelectedItemChanged(e){e.stopPropagation(),e.detail.item instanceof P||this.opened&&(this._focusedIndex=this.filteredItems.indexOf(e.detail.item),this.close())}_setFocused(e){if(super._setFocused(e),!e&&!this.readonly&&!this._closeOnBlurIsPrevented){if(!this.opened&&this.allowCustomValue&&this._inputElementValue===this._lastCustomValue)return void delete this._lastCustomValue;this._closeOrCommit()}}_shouldRemoveFocus(e){return!(e.relatedTarget&&e.relatedTarget.localName===`${this._tagNamePrefix}-item`||e.relatedTarget===this._overlayElement&&(e.composedPath()[0].focus(),1))}_onTouchend(e){this.clearElement&&e.composedPath()[0]===this.clearElement&&(e.preventDefault(),this._onClearAction())}};(0,s.hC)("vaadin-combo-box",F.J,{moduleId:"vaadin-combo-box-styles"});class Z extends(q(X(D((0,T.L)((0,s.Tb)((0,S.S)(m.H3))))))){static get is(){return"vaadin-combo-box"}static get template(){return m.dy`
|
249
|
-
<style>
|
250
|
-
:host([opened]) {
|
251
|
-
pointer-events: auto;
|
252
|
-
}
|
253
|
-
</style>
|
254
|
-
|
255
|
-
<div class="vaadin-combo-box-container">
|
256
|
-
<div part="label">
|
257
|
-
<slot name="label"></slot>
|
258
|
-
<span part="required-indicator" aria-hidden="true" on-click="focus"></span>
|
259
|
-
</div>
|
260
|
-
|
261
|
-
<vaadin-input-container
|
262
|
-
part="input-field"
|
263
|
-
readonly="[[readonly]]"
|
264
|
-
disabled="[[disabled]]"
|
265
|
-
invalid="[[invalid]]"
|
266
|
-
theme$="[[_theme]]"
|
267
|
-
>
|
268
|
-
<slot name="prefix" slot="prefix"></slot>
|
269
|
-
<slot name="input"></slot>
|
270
|
-
<div id="clearButton" part="clear-button" slot="suffix" aria-hidden="true"></div>
|
271
|
-
<div id="toggleButton" part="toggle-button" slot="suffix" aria-hidden="true"></div>
|
272
|
-
</vaadin-input-container>
|
273
|
-
|
274
|
-
<div part="helper-text">
|
275
|
-
<slot name="helper"></slot>
|
276
|
-
</div>
|
277
|
-
|
278
|
-
<div part="error-message">
|
279
|
-
<slot name="error-message"></slot>
|
280
|
-
</div>
|
281
|
-
</div>
|
282
|
-
|
283
|
-
<vaadin-combo-box-overlay
|
284
|
-
id="overlay"
|
285
|
-
opened="[[_overlayOpened]]"
|
286
|
-
loading$="[[loading]]"
|
287
|
-
theme$="[[_theme]]"
|
288
|
-
position-target="[[_positionTarget]]"
|
289
|
-
no-vertical-overlap
|
290
|
-
restore-focus-node="[[inputElement]]"
|
291
|
-
></vaadin-combo-box-overlay>
|
292
|
-
|
293
|
-
<slot name="tooltip"></slot>
|
294
|
-
`}static get properties(){return{_positionTarget:{type:Object}}}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new z.b(this,(e=>{this._setInputElement(e),this._setFocusElement(e),this.stateTarget=e,this.ariaTarget=e}))),this.addController(new B.v(this.inputElement,this._labelController)),this._tooltipController=new A.f(this),this.addController(this._tooltipController),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this._tooltipController.setShouldShow((e=>!e.opened)),this._positionTarget=this.shadowRoot.querySelector('[part="input-field"]'),this._toggleElement=this.$.toggleButton}_onClearButtonClick(e){e.stopPropagation(),super._onClearButtonClick(e)}_onHostClick(e){const t=e.composedPath();(t.includes(this._labelNode)||t.includes(this._positionTarget))&&super._onHostClick(e)}}(0,p.M)(Z)}}]);
|
File without changes
|
File without changes
|