@foxy.io/elements 1.14.0-beta.3 → 1.14.0-beta.7

package/dist/cdn/shared-7629a1a5.js

@@ -0,0 +1,314 @@
+import{C as e,j as t,L as s,_ as i,h as n}from"./shared-63eaded9.js";import{a as r,E as o,T as l,C as a}from"./shared-df573cea.js";import{T as d}from"./shared-bb824ab4.js";import{O as A,I as h}from"./shared-ec861f31.js";import{h as c,a as m,t as u,P as p}from"./shared-ff79f3f9.js";import{F as g,P as v,a as y}from"./shared-46ee137f.js";import{D as _}from"./shared-8edee4e1.js";import{b as f,c as b}from"./shared-3f35fa81.js";class w extends CustomEvent{constructor(e){super("change",{detail:e})}}class x extends w{}const E=c`<dom-module id="lumo-list-box" theme-for="vaadin-list-box">
+  <template>
+    <style>
+      :host {
+        -webkit-tap-highlight-color: transparent;
+        --_lumo-item-selected-icon-display: var(--_lumo-list-box-item-selected-icon-display, block);
+      }
+
+      /* IE11 flexbox issue workaround (vaadin-items are flex containers with min-height) */
+      [part="items"] {
+        display: flex;
+        flex-direction: column;
+      }
+
+      [part="items"] ::slotted(*) {
+        flex: none;
+      }
+
+      /* Normal item */
+
+      [part="items"] ::slotted(vaadin-item) {
+        -webkit-tap-highlight-color: var(--lumo-primary-color-10pct);
+        cursor: default;
+      }
+
+      [part="items"] ::slotted(vaadin-item) {
+        outline: none;
+        border-radius: var(--lumo-border-radius);
+        padding-left: var(--_lumo-list-box-item-padding-left, calc(var(--lumo-border-radius) / 4));
+        padding-right: calc(var(--lumo-space-l) + var(--lumo-border-radius) / 4);
+      }
+
+      /* Workaround to display checkmark in IE11 when list-box is not used in dropdown-menu */
+      [part="items"] ::slotted(vaadin-item)::before {
+        display: var(--_lumo-item-selected-icon-display);
+      }
+
+      /* Hovered item */
+      /* TODO a workaround until we have "focus-follows-mouse". After that, use the hover style for focus-ring as well */
+
+      [part="items"] ::slotted(vaadin-item:hover:not([disabled])) {
+        background-color: var(--lumo-primary-color-10pct);
+      }
+
+      /* Focused item */
+
+      [part="items"] ::slotted([focus-ring]:not([disabled])) {
+        box-shadow: inset 0 0 0 2px var(--lumo-primary-color-50pct);
+      }
+
+      @media (pointer: coarse) {
+        [part="items"] ::slotted(vaadin-item:hover:not([disabled])) {
+          background-color: transparent;
+        }
+
+        [part="items"] ::slotted([focus-ring]:not([disabled])) {
+          box-shadow: none;
+        }
+      }
+
+      /* Easily add section dividers */
+
+      [part="items"] ::slotted(hr) {
+        height: 1px;
+        border: 0;
+        padding: 0;
+        margin: var(--lumo-space-s) var(--lumo-border-radius);
+        background-color: var(--lumo-contrast-10pct);
+      }
+
+      /* RTL specific styles */
+
+      :host([dir="rtl"]) [part="items"] ::slotted(vaadin-item) {
+        padding-left: calc(var(--lumo-space-l) + var(--lumo-border-radius) / 4);
+        padding-right: var(--_lumo-list-box-item-padding-left, calc(var(--lumo-border-radius) / 4));
+      }
+    </style>
+  </template>
+</dom-module>`;document.head.appendChild(E.content);
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/
+const k=e=>class extends e{static get properties(){return{_hasVaadinListMixin:{value:!0},selected:{type:Number,reflectToAttribute:!0,notify:!0},orientation:{type:String,reflectToAttribute:!0,value:""},items:{type:Array,readOnly:!0,notify:!0},_searchBuf:{type:String,value:""}}}static get observers(){return["_enhanceItems(items, orientation, selected, disabled)"]}ready(){super.ready(),this.addEventListener("keydown",(e=>this._onKeydown(e))),this.addEventListener("click",(e=>this._onClick(e))),this._observer=new g(this,(e=>{this._setItems(this._filterItems(Array.from(this.children)))}))}_enhanceItems(e,t,s,i){if(!i&&e){this.setAttribute("aria-orientation",t||"vertical"),this.items.forEach((e=>{t?e.setAttribute("orientation",t):e.removeAttribute("orientation"),e.updateStyles()})),this._setFocusable(s);const i=e[s];e.forEach((e=>e.selected=e===i)),i&&!i.disabled&&this._scrollToItem(s)}}get focused(){return this.getRootNode().activeElement}_filterItems(e){return e.filter((e=>e._hasVaadinItemMixin))}_onClick(e){if(e.metaKey||e.shiftKey||e.ctrlKey||e.defaultPrevented)return;const t=this._filterItems(e.composedPath())[0];let s;t&&!t.disabled&&(s=this.items.indexOf(t))>=0&&(this.selected=s)}_searchKey(e,t){this._searchReset=m.debounce(this._searchReset,u.after(500),(()=>this._searchBuf="")),this._searchBuf+=t.toLowerCase();this.items.some((e=>0===e.textContent.replace(/[^a-zA-Z0-9]/g,"").toLowerCase().indexOf(this._searchBuf)))||(this._searchBuf=t.toLowerCase());const s=1===this._searchBuf.length?e+1:e;return this._getAvailableIndex(s,1,(e=>!(e.disabled||this._isItemHidden(e))&&0===e.textContent.replace(/[^a-zA-Z0-9]/g,"").toLowerCase().indexOf(this._searchBuf)))}get _isRTL(){return!this._vertical&&"rtl"===this.getAttribute("dir")}_onKeydown(e){if(e.metaKey||e.ctrlKey)return;const t=e.key.replace(/^Arrow/,""),s=this.items.indexOf(this.focused);if(/[a-zA-Z0-9]/.test(t)&&1===t.length){const e=this._searchKey(s,t);return void(e>=0&&this._focus(e))}let i,n;const r=this._isRTL?-1:1;this._vertical&&"Up"===t||!this._vertical&&"Left"===t?(n=-r,i=s-r):this._vertical&&"Down"===t||!this._vertical&&"Right"===t?(n=r,i=s+r):"Home"===t?(n=1,i=0):"End"===t&&(n=-1,i=this.items.length-1),i=this._getAvailableIndex(i,n,(e=>!(e.disabled||this._isItemHidden(e)))),i>=0&&(this._focus(i),e.preventDefault())}_getAvailableIndex(e,t,s){const i=this.items.length;for(let n=0;"number"==typeof e&&n<i;n++,e+=t||1){e<0?e=i-1:e>=i&&(e=0);if(s(this.items[e]))return e}return-1}_isItemHidden(e){return"none"===getComputedStyle(e).display}_setFocusable(e){e=this._getAvailableIndex(e,1,(e=>!e.disabled));const t=this.items[e]||this.items[0];this.items.forEach((e=>e.tabIndex=e===t?0:-1))}_focus(e){const t=this.items[e];this.items.forEach((e=>e.focused=e===t)),this._setFocusable(e),this._scrollToItem(e),t.focus()}focus(){this._observer&&this._observer.flush();const e=this.querySelector('[tabindex="0"]')||(this.items?this.items[0]:null);e&&e.focus()}get _scrollerElement(){}_scrollToItem(e){const t=this.items[e];if(!t)return;const s=this._vertical?["top","bottom"]:this._isRTL?["right","left"]:["left","right"],i=this._scrollerElement.getBoundingClientRect(),n=(this.items[e+1]||t).getBoundingClientRect(),r=(this.items[e-1]||t).getBoundingClientRect();let o=0;!this._isRTL&&n[s[1]]>=i[s[1]]||this._isRTL&&n[s[1]]<=i[s[1]]?o=n[s[1]]-i[s[1]]:(!this._isRTL&&r[s[0]]<=i[s[0]]||this._isRTL&&r[s[0]]>=i[s[0]])&&(o=r[s[0]]-i[s[0]]),this._scroll(o)}get _vertical(){return"horizontal"!==this.orientation}_scroll(e){if(this._vertical)this._scrollerElement.scrollTop+=e;else{const t=r.detectScrollType(),s=r.getNormalizedScrollLeft(t,this.getAttribute("dir")||"ltr",this._scrollerElement)+e;r.setNormalizedScrollLeft(t,this.getAttribute("dir")||"ltr",this._scrollerElement,s)}}}
+/**
+@license
+Copyright (c) 2019 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/,C=e=>class extends(k(e)){static get properties(){return{multiple:{type:Boolean,value:!1,reflectToAttribute:!0,observer:"_multipleChanged"},selectedValues:{type:Array,notify:!0,value:function(){return[]}}}}static get observers(){return["_enhanceMultipleItems(items, multiple, selected, selectedValues, selectedValues.*)"]}ready(){this.addEventListener("click",(e=>this._onMultipleClick(e))),super.ready()}_enhanceMultipleItems(e,t,s,i){if(e&&t){if(i){const t=i.map((t=>e[t]));e.forEach((e=>e.selected=-1!==t.indexOf(e)))}this._scrollToLastSelectedItem()}}_scrollToLastSelectedItem(){const e=this.selectedValues.slice(-1)[0];e&&!e.disabled&&this._scrollToItem(e)}_onMultipleClick(e){const t=this._filterItems(e.composedPath())[0],s=t&&!t.disabled?this.items.indexOf(t):-1;s<0||!this.multiple||(e.preventDefault(),-1!==this.selectedValues.indexOf(s)?this.selectedValues=this.selectedValues.filter((e=>e!==s)):this.selectedValues=this.selectedValues.concat(s))}_multipleChanged(e,t){!e&&t&&(this.selectedValues=[],this.items.forEach((e=>e.selected=!1))),e&&!t&&void 0!==this.selected&&(this.push("selectedValues",this.selected),this.selected=void 0)}}
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/;class I extends(o(C(l(p)))){static get template(){return c`
+    <style>
+      :host {
+        display: flex;
+      }
+
+      :host([hidden]) {
+        display: none !important;
+      }
+
+      [part="items"] {
+        height: 100%;
+        width: 100%;
+        overflow-y: auto;
+        -webkit-overflow-scrolling: touch;
+      }
+    </style>
+    <div part="items">
+      <slot></slot>
+    </div>
+`}static get is(){return"vaadin-list-box"}static get version(){return"1.4.0"}static get properties(){return{orientation:{readOnly:!0}}}constructor(){super(),this.focused}ready(){super.ready(),this.setAttribute("role","list"),setTimeout(this._checkImport.bind(this),2e3)}get _scrollerElement(){return this.shadowRoot.querySelector('[part="items"]')}_checkImport(){var e=this.querySelector("vaadin-item");!e||e instanceof p||console.warn("Make sure you have imported the vaadin-item element.")}}customElements.define(I.is,I);const B=c`<dom-module id="lumo-select" theme-for="vaadin-select">
+  <template>
+    <style include="lumo-field-button">
+      :host {
+        outline: none;
+        -webkit-tap-highlight-color: transparent;
+      }
+
+      [selected] {
+        padding-left: 0;
+        padding-right: 0;
+        flex: auto;
+      }
+
+      :host([theme~="small"]) [selected] {
+        padding: 0;
+        min-height: var(--lumo-size-s);
+      }
+
+      :host([theme~="align-left"]) [selected] {
+        text-align: left;
+      }
+
+      :host([theme~="align-right"]) [selected] {
+        text-align: right;
+      }
+
+      :host([theme~="align-center"]) [selected] {
+        text-align: center;
+      }
+
+      [part="toggle-button"]::before {
+        content: var(--lumo-icons-dropdown);
+      }
+
+      /* Highlight the toggle button when hovering over the entire component */
+      :host(:hover:not([readonly]):not([disabled])) [part="toggle-button"] {
+        color: var(--lumo-contrast-80pct);
+      }
+    </style>
+  </template>
+</dom-module><dom-module id="lumo-select-text-field" theme-for="vaadin-select-text-field">
+  <template>
+    <style>
+      :host([theme~="align-center"]) ::slotted([part~="value"]) {
+        --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent 0.25em, #000 1.5em);
+      }
+
+      :host([theme~="align-center"]) ::slotted([part~="value"]) {
+        --_lumo-text-field-overflow-mask-image: none;
+      }
+
+      :host([theme~="align-right"]) ::slotted([part~="value"]) {
+        --_lumo-text-field-overflow-mask-image: linear-gradient(to right, transparent 0.25em, #000 1.5em);
+      }
+
+      [part="input-field"] {
+        cursor: default;
+      }
+
+      [part="input-field"] ::slotted([part="value"]) {
+        display: flex;
+      }
+
+      /* ShadyCSS limitation workaround */
+      [part="input-field"] ::slotted([part="value"]) [selected]::before {
+        display: none;
+      }
+
+      [part="input-field"]:focus {
+        outline: none;
+      }
+
+      /* RTL specific styles */
+
+      :host([theme~="align-left"][dir="rtl"]) ::slotted([part~="value"]) {
+        --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent 0.25em, #000 1.5em);
+      }
+
+      :host([theme~="align-center"][dir="rtl"]) ::slotted([part~="value"]) {
+        --_lumo-text-field-overflow-mask-image: none;
+      }
+
+      :host([dir="rtl"]) ::slotted([part~="value"]),
+      :host([theme~="align-right"][dir="rtl"]) ::slotted([part~="value"]) {
+        --_lumo-text-field-overflow-mask-image: linear-gradient(to right, transparent 0.25em, #000 1.5em);
+      }
+    </style>
+  </template>
+</dom-module><dom-module id="lumo-select-overlay" theme-for="vaadin-select-overlay">
+  <template>
+    <style include="lumo-menu-overlay">
+      :host {
+        --_lumo-item-selected-icon-display: block;
+      }
+
+      :host([bottom-aligned]) {
+        justify-content: flex-end;
+      }
+
+      [part~="overlay"] {
+        min-width: var(--vaadin-select-text-field-width);
+      }
+
+      /* Small viewport adjustment */
+      :host([phone]) {
+        top: 0 !important;
+        right: 0 !important;
+        bottom: var(--vaadin-overlay-viewport-bottom, 0) !important;
+        left: 0 !important;
+        align-items: stretch;
+        justify-content: flex-end;
+      }
+
+      :host([theme~="align-left"]) {
+        text-align: left;
+      }
+
+      :host([theme~="align-right"]) {
+        text-align: right;
+      }
+
+      :host([theme~="align-center"]) {
+        text-align: center;
+      }
+    </style>
+  </template>
+</dom-module>`;document.head.appendChild(B.content),
+/**
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at
+http://polymer.github.io/LICENSE.txt The complete set of authors may be found at
+http://polymer.github.io/AUTHORS.txt The complete set of contributors may be
+found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as
+part of the polymer project is also subject to an additional IP rights grant
+found at http://polymer.github.io/PATENTS.txt
+*/
+v({is:"iron-media-query",properties:{queryMatches:{type:Boolean,value:!1,readOnly:!0,notify:!0},query:{type:String,observer:"queryChanged"},full:{type:Boolean,value:!1},_boundMQHandler:{value:function(){return this.queryHandler.bind(this)}},_mq:{value:null}},attached:function(){this.style.display="none",this.queryChanged()},detached:function(){this._remove()},_add:function(){this._mq&&this._mq.addListener(this._boundMQHandler)},_remove:function(){this._mq&&this._mq.removeListener(this._boundMQHandler),this._mq=null},queryChanged:function(){this._remove();var e=this.query;e&&(this.full||"("===e[0]||(e="("+e+")"),this._mq=window.matchMedia(e),this._add(),this.queryHandler(this._mq))},queryHandler:function(e){this._setQueryMatches(e.matches)}});
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/
+const S=document.createElement("template");S.innerHTML='<dom-module id="vaadin-select-overlay-styles" theme-for="vaadin-select-overlay">\n  <template>\n    <style>\n      :host {\n        align-items: flex-start;\n        justify-content: flex-start;\n      }\n    </style>\n  </template>\n</dom-module>',document.head.appendChild(S.content);class T extends A{static get is(){return"vaadin-select-overlay"}}
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/
+let L;customElements.define(T.is,T);class M extends d{static get is(){return"vaadin-select-text-field"}static get template(){if(super.template.content.querySelector('slot[name="input"]'))return super.template;if(!L){L=super.template.cloneNode(!0);const e=document.createElement("slot");e.setAttribute("name","value");const t=L.content.querySelector("input");t.parentElement.replaceChild(e,t),e.appendChild(t)}return L}get focusElement(){return this.shadowRoot.querySelector("[part=input-field]")}get inputElement(){return this.shadowRoot.querySelector("input")}}customElements.define(M.is,M);
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/
+const R=document.createElement("template");R.innerHTML="<custom-style>\n  <style>\n    @font-face {\n      font-family: \"vaadin-select-icons\";\n      src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAASEAAsAAAAABDgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABCAAAAGAAAABgDxIGKmNtYXAAAAFoAAAAVAAAAFQXVtKHZ2FzcAAAAbwAAAAIAAAACAAAABBnbHlmAAABxAAAAHwAAAB8CohkJ2hlYWQAAAJAAAAANgAAADYOavgEaGhlYQAAAngAAAAkAAAAJAarA8ZobXR4AAACnAAAABQAAAAUCAABP2xvY2EAAAKwAAAADAAAAAwAKABSbWF4cAAAArwAAAAgAAAAIAAHABduYW1lAAAC3AAAAYYAAAGGmUoJ+3Bvc3QAAARkAAAAIAAAACAAAwAAAAMEAAGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA6QADwP/AAEADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAwAAAAMAAAAcAAEAAwAAABwAAwABAAAAHAAEADgAAAAKAAgAAgACAAEAIOkA//3//wAAAAAAIOkA//3//wAB/+MXBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQE/AUAC6QIVABQAAAEwFx4BFxYxMDc+ATc2MTAjKgEjIgE/ISJPIiEhIk8iIUNCoEJDAhUhIk8iISEiTyIhAAEAAAABAABvL5bdXw889QALBAAAAAAA1jHaeQAAAADWMdp5AAAAAALpAhUAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAAukAAQAAAAAAAAAAAAAAAAAAAAUEAAAAAAAAAAAAAAAAAAAABAABPwAAAAAACgAUAB4APgABAAAABQAVAAEAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEABwAAAAEAAAAAAAIABwBgAAEAAAAAAAMABwA2AAEAAAAAAAQABwB1AAEAAAAAAAUACwAVAAEAAAAAAAYABwBLAAEAAAAAAAoAGgCKAAMAAQQJAAEADgAHAAMAAQQJAAIADgBnAAMAAQQJAAMADgA9AAMAAQQJAAQADgB8AAMAAQQJAAUAFgAgAAMAAQQJAAYADgBSAAMAAQQJAAoANACkaWNvbW9vbgBpAGMAbwBtAG8AbwBuVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwaWNvbW9vbgBpAGMAbwBtAG8AbwBuaWNvbW9vbgBpAGMAbwBtAG8AbwBuUmVndWxhcgBSAGUAZwB1AGwAYQByaWNvbW9vbgBpAGMAbwBtAG8AbwBuRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==) format('woff');\n      font-weight: normal;\n      font-style: normal;\n    }\n  </style>\n</custom-style>",document.head.appendChild(R.content);class Q extends(o(a(l(y(h,p))))){static get template(){return c`
+    <style>
+      :host {
+        display: inline-block;
+      }
+
+      vaadin-select-text-field {
+        width: 100%;
+        min-width: 0;
+      }
+
+      :host([hidden]) {
+        display: none !important;
+      }
+
+      [part="toggle-button"] {
+        font-family: "vaadin-select-icons";
+      }
+
+      [part="toggle-button"]::before {
+        content: "\\e900";
+      }
+    </style>
+
+    <vaadin-select-text-field placeholder="[[placeholder]]" label="[[label]]" required="[[required]]" invalid="[[invalid]]" error-message="[[errorMessage]]" readonly\$="[[readonly]]" helper-text="[[helperText]]" theme\$="[[theme]]">
+      <slot name="prefix" slot="prefix"></slot>
+      <slot name="helper" slot="helper">[[helperText]]</slot>
+      <div part="value"></div>
+      <div part="toggle-button" slot="suffix" role="button" aria-haspopup="listbox" aria-label="Toggle"></div>
+    </vaadin-select-text-field>
+    <vaadin-select-overlay opened="{{opened}}" with-backdrop="[[_phone]]" phone\$="[[_phone]]" theme\$="[[theme]]"></vaadin-select-overlay>
+
+    <iron-media-query query="[[_phoneMediaQuery]]" query-matches="{{_phone}}"></iron-media-query>
+`}static get is(){return"vaadin-select"}static get version(){return"2.4.0"}static get properties(){return{opened:{type:Boolean,value:!1,notify:!0,reflectToAttribute:!0,observer:"_openedChanged"},renderer:Function,errorMessage:{type:String,value:""},label:{type:String},value:{type:String,value:"",notify:!0,observer:"_valueChanged"},required:{type:Boolean,reflectToAttribute:!0,observer:"_requiredChanged"},invalid:{type:Boolean,reflectToAttribute:!0,notify:!0,value:!1},name:{type:String,reflectToAttribute:!0},placeholder:{type:String},helperText:{type:String,value:""},readonly:{type:Boolean,value:!1,reflectToAttribute:!0},_phone:Boolean,_phoneMediaQuery:{value:"(max-width: 420px), (max-height: 420px)"},_overlayElement:Object,_inputElement:Object,_toggleElement:Object,_items:Object,_contentTemplate:Object,_oldTemplate:Object,_oldRenderer:Object}}static get observers(){return["_updateSelectedItem(value, _items)","_updateAriaExpanded(opened, _toggleElement, _inputElement)","_templateOrRendererChanged(_contentTemplate, renderer, _overlayElement)"]}constructor(){super(),this._boundSetPosition=this._setPosition.bind(this)}connectedCallback(){super.connectedCallback(),this.addEventListener("iron-resize",this._boundSetPosition)}ready(){super.ready(),this._overlayElement=this.shadowRoot.querySelector("vaadin-select-overlay"),this._valueElement=this.shadowRoot.querySelector('[part="value"]'),this._toggleElement=this.shadowRoot.querySelector('[part="toggle-button"]'),this._nativeInput=this.focusElement.shadowRoot.querySelector("input"),this._nativeInput.setAttribute("aria-hidden",!0),this._nativeInput.setAttribute("tabindex",-1),this._nativeInput.style.pointerEvents="none",this.focusElement.addEventListener("click",(e=>{const t=Array.from(e.composedPath()).some((e=>e.nodeType===Node.ELEMENT_NODE&&"helper"===e.getAttribute("slot")));this.opened=!this.readonly&&!t})),this.focusElement.addEventListener("keydown",(e=>this._onKeyDown(e))),this._observer=new g(this,(e=>this._setTemplateFromNodes(e.addedNodes))),this._observer.flush()}_setTemplateFromNodes(e){const t=Array.from(e).filter((e=>e.localName&&"template"===e.localName))[0]||this._contentTemplate;this._overlayElement.template=this._contentTemplate=t,this._setForwardHostProps()}_setForwardHostProps(){if(this._overlayElement.content){const e=this._overlayElement._instance&&this._overlayElement._instance.forwardHostProp;this._overlayElement._instance&&(this._overlayElement._instance.forwardHostProp=(...t)=>{e.apply(this._overlayElement._instance,t),setTimeout((()=>{this._updateValueSlot()}))},this._assignMenuElement())}}render(){this._overlayElement.render(),this._menuElement&&this._menuElement.items&&this._updateSelectedItem(this.value,this._menuElement.items)}_removeNewRendererOrTemplate(e,t,s,i){e!==t?this._contentTemplate=void 0:s!==i&&(this.renderer=void 0)}_templateOrRendererChanged(e,t,s){if(s){if(e&&t)throw this._removeNewRendererOrTemplate(e,this._oldTemplate,t,this._oldRenderer),new Error("You should only use either a renderer or a template for select content");this._oldTemplate=e,this._oldRenderer=t,t&&(s.setProperties({owner:this,renderer:t}),this.render(),s.content.firstChild&&this._assignMenuElement())}}_assignMenuElement(){this._menuElement=Array.from(this._overlayElement.content.children).filter((e=>"style"!==e.localName))[0],this._menuElement&&(this._menuElement.addEventListener("items-changed",(e=>{this._items=this._menuElement.items,this._items.forEach((e=>e.setAttribute("role","option")))})),this._menuElement.addEventListener("selected-changed",(e=>this._updateValueSlot())),this._menuElement.addEventListener("keydown",(e=>this._onKeyDownInside(e))),this._menuElement.addEventListener("click",(e=>{this.__userInteraction=!0,this.opened=!1}),!0),this._menuElement.setAttribute("role","listbox"))}get focusElement(){return this._inputElement||(this._inputElement=this.shadowRoot.querySelector("vaadin-select-text-field"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("iron-resize",this._boundSetPosition),this.opened=!1}notifyResize(){super.notifyResize(),this.positionTarget&&this.opened&&(this._setPosition(),requestAnimationFrame(this._setPosition.bind(this)))}_requiredChanged(e){this.setAttribute("aria-required",e)}_valueChanged(e,t){""===e?this.focusElement.removeAttribute("has-value"):this.focusElement.setAttribute("has-value",""),""===e&&void 0===t||this.validate()}_onKeyDown(e){if(!this.readonly&&!this.opened)if(/^(Enter|SpaceBar|\s|ArrowDown|Down|ArrowUp|Up)$/.test(e.key))e.preventDefault(),this.opened=!0;else if(/[a-zA-Z0-9]/.test(e.key)&&1===e.key.length){const t=this._menuElement.selected,s=void 0!==t?t:-1,i=this._menuElement._searchKey(s,e.key);i>=0&&(this.__userInteraction=!0,this._updateSelectedItem(this._items[i].value,this._items))}}_onKeyDownInside(e){/^(Tab)$/.test(e.key)&&(this.opened=!1)}_openedChanged(e,t){if(e){if(!this._overlayElement||!this._menuElement||!this._toggleElement||!this.focusElement||this.disabled||this.readonly)return void(this.opened=!1);this._openedWithFocusRing=this.hasAttribute("focus-ring")||this.focusElement.hasAttribute("focus-ring"),this._menuElement.focus(),this._setPosition(),window.addEventListener("scroll",this._boundSetPosition,!0)}else t&&(this._phone?this._setFocused(!1):(this.focusElement.focus(),this._openedWithFocusRing&&this.focusElement.setAttribute("focus-ring","")),this.validate(),window.removeEventListener("scroll",this._boundSetPosition,!0))}_hasContent(e){return!!e&&Boolean(e.hasAttribute("label")?e.getAttribute("label"):e.textContent.trim()||e.children.length)}_attachSelectedItem(e){if(!e)return;let t;e.hasAttribute("label")?(t=document.createElement("vaadin-item"),t.textContent=e.getAttribute("label")):t=e.cloneNode(!0),t._sourceItem=e,t.removeAttribute("tabindex"),t.removeAttribute("role"),this._valueElement.appendChild(t),t.selected=!0}_updateAriaExpanded(e,t,s){t&&t.setAttribute("aria-expanded",e),s&&s.focusElement&&s.focusElement.setAttribute("aria-expanded",e)}_updateValueSlot(){this.opened=!1,this._valueElement.innerHTML="";const e=this._items[this._menuElement.selected],t=this._hasContent(e),s=this._inputElement.shadowRoot.querySelector('slot[name="input"]')?"input":"value";this._valueElement.slot=t?s:"",t&&window.ShadyDOM&&window.ShadyDOM.flush(),this._attachSelectedItem(e),!this._valueChanging&&e&&(this._selectedChanging=!0,this.value=e.value||"",this.__userInteraction&&(this.dispatchEvent(new CustomEvent("change",{bubbles:!0})),this.__userInteraction=!1),delete this._selectedChanging)}_updateSelectedItem(e,t){t&&(this._menuElement.selected=t.reduce(((t,s,i)=>void 0===t&&s.value===e?i:t),void 0),this._selectedChanging||(this._valueChanging=!0,this._updateValueSlot(),delete this._valueChanging))}_setFocused(e){super._setFocused(this.opened||e),this.focusElement._setFocused(this.hasAttribute("focused")),!this.hasAttribute("focused")&&this.validate()}_setPosition(){const e=this._inputElement.shadowRoot.querySelector('[part~="input-field"]').getBoundingClientRect(),t=Math.min(window.innerHeight,document.documentElement.clientHeight),s=e.top>(t-e.height)/2;"rtl"===this.getAttribute("dir")?this._overlayElement.style.right=document.documentElement.clientWidth-e.right+"px":this._overlayElement.style.left=e.left+"px",s?(this._overlayElement.setAttribute("bottom-aligned",""),this._overlayElement.style.removeProperty("top"),this._overlayElement.style.bottom=t-e.bottom+"px"):(this._overlayElement.removeAttribute("bottom-aligned"),this._overlayElement.style.removeProperty("bottom"),this._overlayElement.style.top=e.top+"px"),this._overlayElement.updateStyles({"--vaadin-select-text-field-width":e.width+"px"})}validate(){return!(this.invalid=!(this.disabled||!this.required||this.value))}}customElements.define(Q.is,Q);let D=0;const q={},$=(t,s,i)=>{const n=i&&i.moduleId||"custom-style-module-"+D++;Array.isArray(s)||(s=s?[s]:[]),s.forEach((t=>{if(!(t instanceof e))throw new Error("An item in styles is not of type CSSResult. Use `unsafeCSS` or `css`.");if(!q[t]){const e=document.createElement("dom-module");e.innerHTML=`\n        <template>\n          <style>${t.toString()}</style>\n        </template>\n      `;const s="custom-style-module-"+D++;e.register(s),q[t]=s}}));const r=document.createElement("dom-module");if(t){const e=window.customElements&&window.customElements.get(t);e&&e.hasOwnProperty("__finalized")&&console.warn(`The custom element definition for "${t}"\n      was finalized before a style module was registered.\n      Make sure to add component specific style modules before\n      importing the corresponding custom element.`),r.setAttribute("theme-for",t)}const o=i&&i.include||[];r.innerHTML=`\n    <template>\n      ${o.map((e=>`<style include=${e}></style>`))}\n      ${s.map((e=>`<style include=${q[e]}></style>`))}\n    </template>\n  `,r.register(n)};let O,P,H=e=>e;$("vaadin-list-box",t(O||(O=H`
+[part='items'] ::slotted(vaadin-item.dropdown-divisor){
+  color:var(--lumo-contrast-40pct);
+  box-shadow:0 1px var(--lumo-contrast-10pct);
+  border-radius:0;
+}
+
+[part='items'] ::slotted(vaadin-item.dropdown-sub-item){
+  margin-left:var(--lumo-space-l);
+}
+  `)));class j extends s{constructor(){super(),this.disabled=!1,this.label="",this.value=null,this.items=null,this.getText=e=>e,this.__unexistentValue=`@foxy.io/elements#dropdown-${Math.random().toFixed(16).substr(2)}`,this.__renderedItems={},this.__list=document.createElement("vaadin-list-box")}static get properties(){return i(i({},super.properties),{},{disabled:{type:Boolean},getText:{type:Object,attribute:!1},items:{type:Array},label:{type:String},value:{type:String}})}static get styles(){return f.styles}render(){return n(P||(P=H` <vaadin-select class="w-full ${0}" data-testid="select" .label="${0}" .value="${0}" .disabled="${0}" .renderer="${0}" @change="${0}"> </vaadin-select> `),this.label?"-mt-m":"",this.label,null===this.value?this.__unexistentValue:this.value,this.disabled,this.__renderItems.bind(this),this.__handleChange)}__renderItems(e){var t;let s=e.querySelector("vaadin-list-box");null===s&&(e.appendChild(this.__list),s=this.__list);for(const e of Object.values(this.__renderedItems))e.dataset.keep="";const i=null!==(t=this.items)&&void 0!==t?t:[];for(let e=0;e<i.length;++e)if("string"==typeof i[e])this.__addOrKeepItem(i[e],i[e],s).classList.add("dropdown-item");else if(Array.isArray(i[e])){const t=this.__addOrKeepItem(i[e][0],i[e][0],s);t.classList.add("dropdown-item","dropdown-divisor"),t.disabled=!0;for(const t of i[e][1])this.__addOrKeepItem(i[e][0]+": "+t,t,s).classList.add("dropdown-sub-item")}for(const e of Object.values(this.__renderedItems)){const t=e;t.dataset.keep||(e.remove(),delete this.__renderedItems[t.dataset.trackId])}}__addOrKeepItem(e,t,s){let i;return this.__renderedItems[e]?i=this.__renderedItems[e]:(i=document.createElement("vaadin-item"),this.__renderedItems[e]=i,i.value=e,s.appendChild(i)),i.dataset.keep="true",i.dataset.trackId=e,i.textContent=this.getText(t),i}__handleChange(e){const t=e.target.value,s=t===this.__unexistentValue?null:t;this.dispatchEvent(new _(s))}}let V,N,z=e=>e;class F extends s{constructor(){super(...arguments),this.variant=null}static get styles(){return[f.styles,t(V||(V=z`@keyframes blink{from{opacity:.5}to{opacity:1}}.animated{animation:blink .5s infinite alternate}:host{display:inline-block;min-width:4rem}`))]}static get properties(){return i(i({},super.properties),{},{variant:{type:String}})}render(){const e="error"===this.variant?"bg-error-10":"bg-contrast-10",t=null===this.variant?"animated":"";return n(N||(N=z` <div class="relative"> <span class="opacity-0"><slot></slot></span> <div class="${0} ${0} rounded my-xs absolute inset-0"></div> </div> `),e,t)}}let K,G,W,U=e=>e;class Y extends b{constructor(){super(...arguments),this.key=""}static get scopedElements(){return{"x-skeleton":F}}static get properties(){return i(i({},super.properties),{},{key:{type:String,reflect:!0},opts:{type:Object}})}static get styles(){return[super.styles,t(K||(K=U`:host{display:inline-block}`))]}get whenReady(){return this._whenI18nReady.then((()=>this.updateComplete))}render(){return this._isI18nReady?n(G||(G=U`${0}<slot></slot>`),this._t(this.key,this.opts)):n(W||(W=U`<x-skeleton class="block">${0}<slot></slot></x-skeleton>`),this.key)}}function J(...e){return e.filter((e=>!!e))}let Z,X,ee,te,se=e=>e;class ie extends b{constructor(){super(...arguments),this.disabled=!1,this.value=[]}static get scopedElements(){return{"x-i18n":Y}}static get properties(){return i(i({},super.properties),{},{disabled:{type:Boolean},value:{type:Array}})}render(){const e=ie._allDays.map((e=>{try{return e.toLocaleString(this.lang,{minimumIntegerDigits:2})}catch(t){return e.toString()}}));return n(Z||(Z=se` <div class="space-y-s"> <div class="flex flex-wrap -mx-xs -mb-xs" style="max-width:364px;font-feature-settings:'tnum' 1"> ${0} </div> ${0} </div> `),ie._allDays.map(((t,s)=>n(X||(X=se` <label class="${0}"> ${0} <input type="checkbox" class="sr-only" ?disabled="${0}" ?checked="${0}" @change="${0}"> </label> `),this._getLabelClass(t),e[s],this.disabled,this.value.includes(t),(e=>this._handleChange(e,t))))),J(this.value.length>0&&n(ee||(ee=se` <p class="text-s text-tertiary leading-s"> <x-i18n key="monthday-picker.hint" .opts="${0}" .lang="${0}"> </x-i18n> ${0} </p> `),{days:this.value},this.lang,J([29,30,31].some((e=>this.value.includes(e)))&&n(te||(te=se`<x-i18n key="monthday-picker.warning" .lang="${0}"></x-i18n>`),this.lang)))))}_getLabelClass(e){let t="flex items-center justify-center m-xs p-s rounded text-m font-medium transition duration-200 sm-p-0 sm-h-m sm-w-l ";return this.value.includes(e)||(t+="bg-contrast-5 "),this._isI18nReady&&!this.disabled?(t+="cursor-pointer ",t+=this.value.includes(e)?"text-base ":"hover-bg-primary-10 ",e<29?(t+="focus-within-shadow-outline ",t+=this.value.includes(e)?"bg-primary":"text-body"):(t+="focus-within-shadow-outline-error ",t+=this.value.includes(e)?"bg-error":"text-error")):(t+="text-transparent ",this.value.includes(e)&&(t+=e<29?"bg-primary-50":"bg-error-10")),t}_handleChange(e,t){e.stopPropagation(),this._toggle(t),this._sendChange()}_sendChange(){this.dispatchEvent(new w(this.value))}_toggle(e){const t=this.value.indexOf(e);this.value=-1===t?[...this.value,e]:this.value.filter(((e,s)=>s!==t))}}ie._allDays=Array.from(new Array(31),((e,t)=>t+1));const ne=document.createElement("template");function re(e,t,s="long"){const i=new Date;for(;i.getDay()!==e;)i.setDate(i.getDate()+1);return i.toLocaleDateString(t,{weekday:s})}ne.innerHTML='<dom-module id="lumo-badge">\n  <template>\n    <style>\n      [theme~="badge"] {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        box-sizing: border-box;\n        padding: 0.4em calc(0.5em + var(--lumo-border-radius-s) / 4);\n        color: var(--lumo-primary-text-color);\n        background-color: var(--lumo-primary-color-10pct);\n        border-radius: var(--lumo-border-radius-s);\n        font-family: var(--lumo-font-family);\n        font-size: var(--lumo-font-size-s);\n        line-height: 1;\n        font-weight: 500;\n        text-transform: initial;\n        letter-spacing: initial;\n        min-width: calc(var(--lumo-line-height-xs) * 1em + 0.45em);\n      }\n\n      /* Ensure proper vertical alignment */\n      [theme~="badge"]::before {\n        display: inline-block;\n        content: "\\2003";\n        width: 0;\n      }\n\n      [theme~="badge"][theme~="small"] {\n        font-size: var(--lumo-font-size-xxs);\n        line-height: 1;\n      }\n\n      /* Colors */\n\n      [theme~="badge"][theme~="success"] {\n        color: var(--lumo-success-text-color);\n        background-color: var(--lumo-success-color-10pct);\n      }\n\n      [theme~="badge"][theme~="error"] {\n        color: var(--lumo-error-text-color);\n        background-color: var(--lumo-error-color-10pct);\n      }\n\n      [theme~="badge"][theme~="contrast"] {\n        color: var(--lumo-contrast-80pct);\n        background-color: var(--lumo-contrast-5pct);\n      }\n\n      /* Primary */\n\n      [theme~="badge"][theme~="primary"] {\n        color: var(--lumo-primary-contrast-color);\n        background-color: var(--lumo-primary-color);\n      }\n\n      [theme~="badge"][theme~="success"][theme~="primary"] {\n        color: var(--lumo-success-contrast-color);\n        background-color: var(--lumo-success-color);\n      }\n\n      [theme~="badge"][theme~="error"][theme~="primary"] {\n        color: var(--lumo-error-contrast-color);\n        background-color: var(--lumo-error-color);\n      }\n\n      [theme~="badge"][theme~="contrast"][theme~="primary"] {\n        color: var(--lumo-base-color);\n        background-color: var(--lumo-contrast);\n      }\n\n      /* Links */\n\n      [theme~="badge"][href]:hover {\n        text-decoration: none;\n      }\n\n      /* Icon */\n\n      [theme~="badge"] iron-icon {\n        margin: -0.25em 0;\n        --iron-icon-width: 1.5em;\n        --iron-icon-height: 1.5em;\n      }\n\n      [theme~="badge"] iron-icon:first-child {\n        margin-left: -0.375em;\n      }\n\n      [theme~="badge"] iron-icon:last-child {\n        margin-right: -0.375em;\n      }\n\n      [theme~="badge"][icon] {\n        min-width: 0;\n        padding: 0;\n        font-size: 1rem;\n        --iron-icon-width: var(--lumo-icon-size-m);\n        --iron-icon-height: var(--lumo-icon-size-m);\n      }\n\n      [theme~="badge"][icon][theme~="small"] {\n        --iron-icon-width: var(--lumo-icon-size-s);\n        --iron-icon-height: var(--lumo-icon-size-s);\n      }\n\n      /* Empty */\n\n      [theme~="badge"]:not([icon]):empty {\n        min-width: 0;\n        width: 1em;\n        height: 1em;\n        padding: 0;\n        border-radius: 50%;\n        background-color: var(--lumo-primary-color);\n      }\n\n      [theme~="badge"][theme~="small"]:not([icon]):empty {\n        width: 0.75em;\n        height: 0.75em;\n      }\n\n      [theme~="badge"][theme~="contrast"]:not([icon]):empty {\n        background-color: var(--lumo-contrast);\n      }\n\n      [theme~="badge"][theme~="success"]:not([icon]):empty {\n        background-color: var(--lumo-success-color);\n      }\n\n      [theme~="badge"][theme~="error"]:not([icon]):empty {\n        background-color: var(--lumo-error-color);\n      }\n\n      /* Pill */\n\n      [theme~="badge"][theme~="pill"] {\n        --lumo-border-radius-s: 1em;\n      }\n\n      /* RTL specific styles */\n\n      [dir="rtl"][theme~="badge"] iron-icon:first-child {\n        margin-right: -0.375em;\n        margin-left: 0;\n      }\n\n      [dir="rtl"][theme~="badge"] iron-icon:last-child {\n        margin-left: -0.375em;\n        margin-right: 0;\n      }\n    </style>\n  </template>\n</dom-module>',document.head.appendChild(ne.content);let oe,le,ae,de=e=>e;class Ae extends ie{render(){return n(oe||(oe=de` <div class="space-y-s"> <div class="flex flex-wrap -mx-xs -mb-xs text-m uppercase"> ${0} </div> ${0} </div> `),Ae._allDays.map((e=>n(le||(le=de` <label class="${0}"> ${0} <input type="checkbox" class="sr-only" ?disabled="${0}" ?checked="${0}" @change="${0}"> </label> `),this._getLabelClass(e),re(e,this.lang,"short"),this.disabled||!this._isI18nReady,this.value.includes(e),(t=>this._handleChange(t,e))))),J(this.value.length>0&&n(ae||(ae=de` <p class="text-s text-tertiary leading-s"> <x-i18n key="weekday-picker.hint" .lang="${0}" .opts="${0}"> </x-i18n> </p> `),this.lang,{days:this.value})))}_getLabelClass(e){let t="flex items-center justify-center m-xs h-m w-xl rounded font-medium transition duration-200 ";return this._isI18nReady&&!this.disabled?(t+="cursor-pointer focus-within-shadow-outline ",t+=this.value.includes(e)?"text-base bg-primary":"bg-contrast-5 hover-bg-contrast-10 text-body"):(t+="text-transparent ",t+=this.value.includes(e)?"bg-primary-50":"bg-contrast-5"),t}_sendChange(){this.dispatchEvent(new x(this.value))}}Ae._allDays=new Array(7).fill(0).map(((e,t)=>t));export{j as D,Y as I,ie as M,F as S,Ae as W,Q as a,J as c,$ as r,re as t};