@foxy.io/elements 1.18.0-beta.2 → 1.18.0-beta.21

package/dist/cdn/shared-674c1c04.js

@@ -0,0 +1 @@
+import{_ as e}from"./shared-a8ced8bf.js";import{L as t,c as s,h as i}from"./shared-7f33a83a.js";import{A as a}from"./shared-a85afa33.js";import{C as o}from"./shared-43bcce74.js";import{T as n,R as l,a as d}from"./shared-459a5ec4.js";import{F as r}from"./shared-76b3d76a.js";import{c as h}from"./shared-4e709717.js";import{I as c}from"./shared-4f037e43.js";class u extends CustomEvent{constructor(e=!1){super("hide",{detail:{cancelled:e}})}}class m extends CustomEvent{constructor(){super("show")}}let p,v=e=>e;class b extends(n(l(t))){static get styles(){return[super.styles,s(p||(p=v`:host{position:relative;z-index:200}`))]}}let _,y,f,g,w,x,$,D=e=>e;const k=d(o(n(c(t))));class E extends k{constructor(){super(...arguments),this.closable=!1,this.editable=!1,this.header="",this.alert=!1,this.wide=!1,this.__handleKeyDown=e=>{"Escape"===e.key&&E.openDialogs[0]===this&&this.closable&&this.hide(this.editable)},this.__connected=!1,this.__visible=!1}static get properties(){return e(e({},super.properties),{},{__connected:{attribute:!1},__visible:{attribute:!1},centered:{type:Boolean},closable:{type:Boolean},editable:{type:Boolean},header:{type:String},alert:{type:Boolean},wide:{type:Boolean},open:{type:Boolean,noAccessor:!0}})}static get styles(){return[super.styles,s(_||(_=D`.grid-cols-header{grid-template-columns:1fr auto 1fr}.scale-85{--tw-scale-x:0.85;--tw-scale-y:0.85}`))]}get open(){return this.__visible&&this.__connected}set open(e){e===this.open||(e?this.show():this.hide(this.editable))}connectedCallback(){super.connectedCallback(),addEventListener("keydown",this.__handleKeyDown)}disconnectedCallback(){var e;super.disconnectedCallback(),removeEventListener("keydown",this.__handleKeyDown),null===(e=E.dialogWindows.get(this))||void 0===e||e.remove(),E.dialogWindows.delete(this)}createRenderRoot(){const e=new b,t=document.querySelectorAll(E.dialogWindowsHost),s=Array.from(t).pop();return e.addEventListener("fetch",(e=>{e instanceof r&&(e.stopImmediatePropagation(),e.preventDefault(),e.respondWith(new a(this).fetch(e.request)))})),null==s||s.appendChild(e),E.dialogWindows.set(this,e),e.shadowRoot}render(e){if(!this.__connected)return i(y||(y=D``));const t=E.openDialogs[0]===this,s=E.openDialogs[1]===this,a=E.openDialogs[2]===this,o=!t&&!s&&!a;return i(f||(f=D` <div class="${0}"> <div id="backdrop" class="${0}" tabindex="-1" @click="${0}"></div> <div role="dialog" aria-labelledby="dialog-title" class="${0}"> <div class="${0}"> <div class="h-l grid grid-cols-header text-m font-lumo font-medium border-b border-contrast-10"> ${0} <h1 id="dialog-title" class="truncate self-center text-center"> <foxy-i18n ns="${0}" lang="${0}" key="${0}"></foxy-i18n> </h1> ${0} </div> <div class="flex-1 overflow-y-auto overflow-x-hidden overscroll-contain"> <div class="p-m relative">${0}</div> </div> </div> </div> </div> `),h({"z-50 fixed inset-0":!0,"pointer-events-none":!this.__visible}),h({"select-none ease-in-out transition duration-500 absolute inset-0 bg-shade-50 focus-outline-none":!0,"opacity-100":this.__visible,"opacity-0":!this.__visible}),(()=>this.closable&&this.hide(this.editable)),h({"transform origin-bottom ease-in-out transition duration-500 relative h-full ml-auto sm-origin-center":!0,"sm-max-w-modal":!this.wide,"sm-max-w-modal-wide":this.wide,"flex justify-center items-end sm-items-center mr-auto":this.alert,"translate-y-full sm-translate-y-0":!this.__visible,"sm-translate-x-full":!this.alert&&!this.__visible,"sm-opacity-0 sm-scale-110":this.alert&&!this.__visible,"translate-y-0 translate-x-0":t&&this.__visible,"scale-95 -translate-y-s sm-translate-y-0":s&&this.__visible,"scale-90 -translate-y-m sm-translate-y-0":a&&this.__visible,"opacity-0 scale-85 -translate-y-l sm-translate-y-0":o&&this.__visible}),h({"overflow-hidden flex flex-col bg-base rounded-t-l sm-rounded-b-l":!0,"absolute inset-0 mt-xl sm-m-xl":!this.alert,"shadow-xxl":this.__visible,"flex-1":this.alert}),this.closable&&!this.hiddenSelector.matches("close-button",!0)?i(g||(g=D` <vaadin-button id="close-button" theme="tertiary-inline" class="mr-auto m-s px-s" ?disabled="${0}" @click="${0}"> <foxy-i18n lang="${0}" key="${0}" ns="${0}"> </foxy-i18n> </vaadin-button> `),this.disabledSelector.matches("close-button",!0),(()=>this.hide(this.editable)),this.lang,this.editable?"cancel":"close",this.ns):i(w||(w=D`<div></div>`)),this.ns,this.lang,this.header,this.editable&&!this.hiddenSelector.matches("save-button",!0)?i(x||(x=D` <vaadin-button data-testid="save-button" ?disabled="${0}" theme="primary" class="ml-auto h-auto min-h-0 min-w-0 m-xs px-m" @click="${0}"> <foxy-i18n ns="${0}" lang="${0}" key="save"></foxy-i18n> </vaadin-button> `),this.disabledSelector.matches("save-button",!0),this.save,this.ns,this.lang):i($||($=D`<div></div>`)),null==e?void 0:e())}async hide(e=!1){var t;null===(t=this.__returnFocusTo)||void 0===t||t.focus(),await this.__setOpenDialogs(E.openDialogs.filter((e=>e!==this))),await this.__setConnected(!1),this.dispatchEvent(new E.HideEvent(!!e))}async show(e){this.__returnFocusTo=e,await this.__setConnected(!0),await this.__setOpenDialogs([this,...E.openDialogs]);const t=this.renderRoot.querySelector("#close-button");null==t||t.focus(),this.dispatchEvent(new E.ShowEvent)}async save(){await this.hide(!1)}async __setOpenDialogs(e){E.openDialogs.length=0,E.openDialogs.push(...e),await Promise.all([Promise.all(E.openDialogs.map((e=>e.requestUpdate()))),new Promise((e=>{this.renderRoot.querySelector("#backdrop").addEventListener("transitionend",e,{once:!0}),this.__visible=E.openDialogs.includes(this)}))])}async __setConnected(e){this.__connected=e,await this.updateComplete.then((()=>this.getBoundingClientRect()))}}E.dialogWindowsHost="#foxy-dialog-windows-host, body",E.dialogWindows=new WeakMap,E.openDialogs=[],E.ShowEvent=m,E.HideEvent=u,customElements.define("foxy-dialog-window",b);export{E as D};

package/dist/cdn/shared-6ac71f60.js

@@ -0,0 +1,25 @@
+import{u as e}from"./shared-459a5ec4.js";import{d as t}from"./shared-d7c271d2.js";
+/**
+@license
+Copyright (c) 2017 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
+*/let i=!1,s=[],n=[];function o(){i=!0,requestAnimationFrame((function(){i=!1,function(e){for(;e.length;)r(e.shift())}(s),setTimeout((function(){!function(e){for(let t=0,i=e.length;t<i;t++)r(e.shift())}(n)}))}))}function r(e){const t=e[0],i=e[1],s=e[2];try{i.apply(t,s)}catch(e){setTimeout((()=>{throw e}))}}function a(e,t,s){i||o(),n.push([e,t,s])}
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/const d=e=>class extends e{static get properties(){return{_hasVaadinItemMixin:{value:!0},disabled:{type:Boolean,value:!1,observer:"_disabledChanged",reflectToAttribute:!0},selected:{type:Boolean,value:!1,reflectToAttribute:!0,observer:"_selectedChanged"},_value:String}}get value(){return void 0!==this._value?this._value:this.textContent.trim()}set value(e){this._value=e}ready(){super.ready();const e=this.getAttribute("value");null!==e&&(this.value=e),this.addEventListener("focus",(e=>this._setFocused(!0)),!0),this.addEventListener("blur",(e=>this._setFocused(!1)),!0),this.addEventListener("mousedown",(e=>{this._setActive(this._mousedown=!0);const t=()=>{this._setActive(this._mousedown=!1),document.removeEventListener("mouseup",t)};document.addEventListener("mouseup",t)})),this.addEventListener("keydown",(e=>this._onKeydown(e))),this.addEventListener("keyup",(e=>this._onKeyup(e)))}disconnectedCallback(){super.disconnectedCallback(),this.hasAttribute("active")&&this._setFocused(!1)}_selectedChanged(e){this.setAttribute("aria-selected",e)}_disabledChanged(e){e?(this.selected=!1,this.setAttribute("aria-disabled","true"),this.blur()):this.removeAttribute("aria-disabled")}_setFocused(e){e?(this.setAttribute("focused",""),this._mousedown||this.setAttribute("focus-ring","")):(this.removeAttribute("focused"),this.removeAttribute("focus-ring"),this._setActive(!1))}_setActive(e){e?this.setAttribute("active",""):this.removeAttribute("active")}_onKeydown(e){/^( |SpaceBar|Enter)$/.test(e.key)&&!e.defaultPrevented&&(e.preventDefault(),this._setActive(!0))}_onKeyup(e){this.hasAttribute("active")&&(this._setActive(!1),this.click())}}
+/**
+@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
+*/;var h=new Set;const u={properties:{_parentResizable:{type:Object,observer:"_parentResizableChanged"},_notifyingDescendant:{type:Boolean,value:!1}},listeners:{"iron-request-resize-notifications":"_onIronRequestResizeNotifications"},created:function(){this._interestedResizables=[],this._boundNotifyResize=this.notifyResize.bind(this),this._boundOnDescendantIronResize=this._onDescendantIronResize.bind(this)},attached:function(){this._requestResizeNotifications()},detached:function(){this._parentResizable?this._parentResizable.stopResizeNotificationsFor(this):(h.delete(this),window.removeEventListener("resize",this._boundNotifyResize)),this._parentResizable=null},notifyResize:function(){this.isAttached&&(this._interestedResizables.forEach((function(e){this.resizerShouldNotify(e)&&this._notifyDescendant(e)}),this),this._fireResize())},assignParentResizable:function(e){this._parentResizable&&this._parentResizable.stopResizeNotificationsFor(this),this._parentResizable=e,e&&-1===e._interestedResizables.indexOf(this)&&(e._interestedResizables.push(this),e._subscribeIronResize(this))},stopResizeNotificationsFor:function(e){var t=this._interestedResizables.indexOf(e);t>-1&&(this._interestedResizables.splice(t,1),this._unsubscribeIronResize(e))},_subscribeIronResize:function(e){e.addEventListener("iron-resize",this._boundOnDescendantIronResize)},_unsubscribeIronResize:function(e){e.removeEventListener("iron-resize",this._boundOnDescendantIronResize)},resizerShouldNotify:function(e){return!0},_onDescendantIronResize:function(t){this._notifyingDescendant?t.stopPropagation():e||this._fireResize()},_fireResize:function(){this.fire("iron-resize",null,{node:this,bubbles:!1})},_onIronRequestResizeNotifications:function(e){var i=t(e).rootTarget;i!==this&&(i.assignParentResizable(this),this._notifyDescendant(i),e.stopPropagation())},_parentResizableChanged:function(e){e&&window.removeEventListener("resize",this._boundNotifyResize)},_notifyDescendant:function(e){this.isAttached&&(this._notifyingDescendant=!0,e.notifyResize(),this._notifyingDescendant=!1)},_requestResizeNotifications:function(){if(this.isAttached)if("loading"===document.readyState){var e=this._requestResizeNotifications.bind(this);document.addEventListener("readystatechange",(function t(){document.removeEventListener("readystatechange",t),e()}))}else this._findParent(),this._parentResizable?this._parentResizable._interestedResizables.forEach((function(e){e!==this&&e._findParent()}),this):(h.forEach((function(e){e!==this&&e._findParent()}),this),window.addEventListener("resize",this._boundNotifyResize),this.notifyResize())},_findParent:function(){this.assignParentResizable(null),this.fire("iron-request-resize-notifications",null,{node:this,bubbles:!0,cancelable:!0}),this._parentResizable?h.delete(this):h.add(this)}};export{d as I,a,u as b};

package/dist/cdn/{shared-6eeb69e7.js → shared-715ee51e.js}

@@ -1,4 +1,4 @@
-import{_ as t}from"./shared-fadcb2e1.js";import{T as e}from"./shared-4473f0cf.js";import{a as s}from"./shared-33b47806.js";import{p as a}from"./shared-fcdc4903.js";let n,o,r,i,c=t=>t;class l extends(s(e,"subscriptions-table")){constructor(){super(...arguments),this.columns=[l.priceColumn,l.summaryColumn,l.statusColumn,l.subTokenURLColumn]}}l.priceColumn={cell:e=>{const s=e.data._embedded["fx:last_transaction"],o=`${s.total_order} ${s.currency_code}`;return e.html(n||(n=c`
+import{_ as t}from"./shared-a8ced8bf.js";import{T as e}from"./shared-e0615601.js";import{a as s}from"./shared-459a5ec4.js";import{p as a}from"./shared-0301f5c5.js";let n,o,r,i,c=t=>t;class l extends(s(e,"subscriptions-table")){constructor(){super(...arguments),this.columns=[l.priceColumn,l.summaryColumn,l.statusColumn,l.subTokenURLColumn]}}l.priceColumn={cell:e=>{const s=e.data._embedded["fx:last_transaction"],o=`${s.total_order} ${s.currency_code}`;return e.html(n||(n=c`
         <foxy-i18n
           data-testclass="i18n frequencies"
           class="font-semibold text-m font-tnum"

package/dist/cdn/shared-71beb422.js

@@ -0,0 +1,553 @@
+import{E as t,T as e}from"./shared-0d3bec9f.js";import{h as o,P as r}from"./shared-13e6fe8a.js";import"./shared-7788977c.js";import{L as a}from"./shared-d0c5c38f.js";import{I as i,b as s,a as n}from"./shared-6ac71f60.js";import{a as l}from"./shared-d7c271d2.js";const c=o`<dom-module id="lumo-tab" theme-for="vaadin-tab">
+  <template>
+    <style>
+      :host {
+        box-sizing: border-box;
+        padding: 0.5rem 0.75rem;
+        font-family: var(--lumo-font-family);
+        font-size: var(--lumo-font-size-m);
+        line-height: var(--lumo-line-height-xs);
+        font-weight: 500;
+        opacity: 1;
+        color: var(--lumo-contrast-60pct);
+        transition: 0.15s color, 0.2s transform;
+        flex-shrink: 0;
+        display: flex;
+        align-items: center;
+        position: relative;
+        cursor: pointer;
+        transform-origin: 50% 100%;
+        outline: none;
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        overflow: hidden;
+        min-width: var(--lumo-size-m);
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        -ms-user-select: none;
+        user-select: none;
+      }
+
+      :host(:not([orientation="vertical"])) {
+        text-align: center;
+      }
+
+      :host([orientation="vertical"]) {
+        transform-origin: 0% 50%;
+        padding: 0.25rem 1rem;
+        min-height: var(--lumo-size-m);
+        min-width: 0;
+      }
+
+      :host(:hover),
+      :host([focus-ring]) {
+        color: var(--lumo-body-text-color);
+      }
+
+      :host([selected]) {
+        color: var(--lumo-primary-text-color);
+        transition: 0.6s color;
+      }
+
+      :host([active]:not([selected])) {
+        color: var(--lumo-primary-text-color);
+        transition-duration: 0.1s;
+      }
+
+      :host::before,
+      :host::after {
+        content: "";
+        position: absolute;
+        display: var(--_lumo-tab-marker-display, block);
+        bottom: 0;
+        left: 50%;
+        width: var(--lumo-size-s);
+        height: 2px;
+        background-color: var(--lumo-contrast-60pct);
+        border-radius: var(--lumo-border-radius) var(--lumo-border-radius) 0 0;
+        transform: translateX(-50%) scale(0);
+        transform-origin: 50% 100%;
+        transition: 0.14s transform cubic-bezier(.12, .32, .54, 1);
+        will-change: transform;
+      }
+
+      :host([selected])::before,
+      :host([selected])::after {
+        background-color: var(--lumo-primary-color);
+      }
+
+      :host([orientation="vertical"])::before,
+      :host([orientation="vertical"])::after {
+        left: 0;
+        bottom: 50%;
+        transform: translateY(50%) scale(0);
+        width: 2px;
+        height: var(--lumo-size-xs);
+        border-radius: 0 var(--lumo-border-radius) var(--lumo-border-radius) 0;
+        transform-origin: 100% 50%;
+      }
+
+      :host::after {
+        box-shadow: 0 0 0 4px var(--lumo-primary-color);
+        opacity: 0.15;
+        transition: 0.15s 0.02s transform, 0.8s 0.17s opacity;
+      }
+
+      :host([selected])::before,
+      :host([selected])::after {
+        transform: translateX(-50%) scale(1);
+        transition-timing-function: cubic-bezier(.12, .32, .54, 1.5);
+      }
+
+      :host([orientation="vertical"][selected])::before,
+      :host([orientation="vertical"][selected])::after {
+        transform: translateY(50%) scale(1);
+      }
+
+      :host([selected]:not([active]))::after {
+        opacity: 0;
+      }
+
+      :host(:not([orientation="vertical"])) ::slotted(a[href]) {
+        justify-content: center;
+      }
+
+      :host ::slotted(a) {
+        display: flex;
+        width: 100%;
+        align-items: center;
+        height: 100%;
+        margin: -0.5rem -0.75rem;
+        padding: 0.5rem 0.75rem;
+        outline: none;
+
+        /*
+          Override the CSS inherited from \`lumo-color\` and \`lumo-typography\`.
+          Note: \`!important\` is needed because of the \`:slotted\` specificity.
+        */
+        text-decoration: none !important;
+        color: inherit !important;
+      }
+
+      :host ::slotted(iron-icon) {
+        margin: 0 4px;
+        width: var(--lumo-icon-size-m);
+        height: var(--lumo-icon-size-m);
+      }
+
+      /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */
+      :host ::slotted(iron-icon[icon^="vaadin:"]) {
+        padding: 0.25rem;
+        box-sizing: border-box !important;
+      }
+
+      :host(:not([dir="rtl"])) ::slotted(iron-icon:first-child) {
+        margin-left: 0;
+      }
+
+      :host(:not([dir="rtl"])) ::slotted(iron-icon:last-child) {
+        margin-right: 0;
+      }
+
+      :host([theme~="icon-on-top"]) {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: space-around;
+        text-align: center;
+        padding-bottom: 0.5rem;
+        padding-top: 0.25rem;
+      }
+
+      :host([theme~="icon-on-top"]) ::slotted(a) {
+        flex-direction: column;
+        align-items: center;
+        margin-top: -0.25rem;
+        padding-top: 0.25rem;
+      }
+
+      :host([theme~="icon-on-top"]) ::slotted(iron-icon) {
+        margin: 0;
+      }
+
+      /* Disabled */
+
+      :host([disabled]) {
+        pointer-events: none;
+        opacity: 1;
+        color: var(--lumo-disabled-text-color);
+      }
+
+      /* Focus-ring */
+
+      :host([focus-ring]) {
+        box-shadow: inset 0 0 0 2px var(--lumo-primary-color-50pct);
+        border-radius: var(--lumo-border-radius);
+      }
+
+      /* RTL specific styles */
+
+      :host([dir="rtl"])::before,
+      :host([dir="rtl"])::after {
+        left: auto;
+        right: 50%;
+        transform: translateX(50%) scale(0);
+      }
+
+      :host([dir="rtl"][selected]:not([orientation="vertical"]))::before,
+      :host([dir="rtl"][selected]:not([orientation="vertical"]))::after {
+        transform: translateX(50%) scale(1);
+      }
+
+      :host([dir="rtl"]) ::slotted(iron-icon:first-child) {
+        margin-right: 0;
+      }
+
+      :host([dir="rtl"]) ::slotted(iron-icon:last-child) {
+        margin-left: 0;
+      }
+
+      :host([orientation="vertical"][dir="rtl"]) {
+        transform-origin: 100% 50%;
+      }
+
+      :host([dir="rtl"][orientation="vertical"])::before,
+      :host([dir="rtl"][orientation="vertical"])::after {
+        left: auto;
+        right: 0;
+        border-radius: var(--lumo-border-radius) 0 0 var(--lumo-border-radius);
+        transform-origin: 0% 50%;
+      }
+    </style>
+  </template>
+</dom-module>`;document.head.appendChild(c.content);
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/
+class d extends(t(e(i(r)))){static get template(){return o`
+    <slot></slot>
+`}static get is(){return"vaadin-tab"}static get version(){return"3.2.0"}ready(){super.ready(),this.setAttribute("role","tab")}_onKeyup(t){const e=this.hasAttribute("active");if(super._onKeyup(t),e){const t=this.querySelector("a");t&&t.click()}}}customElements.define(d.is,d);const m=o`<dom-module id="lumo-tabs" theme-for="vaadin-tabs">
+  <template>
+    <style>
+      :host {
+        -webkit-tap-highlight-color: transparent;
+      }
+
+      :host(:not([orientation="vertical"])) {
+        box-shadow: inset 0 -1px 0 0 var(--lumo-contrast-10pct);
+        position: relative;
+        min-height: var(--lumo-size-l);
+      }
+
+      :host([orientation="horizontal"]) [part="tabs"] ::slotted(vaadin-tab:not([theme~="icon-on-top"])) {
+        justify-content: center;
+      }
+
+      :host([orientation="vertical"]) {
+        box-shadow: -1px 0 0 0 var(--lumo-contrast-10pct);
+      }
+
+      :host([orientation="horizontal"]) [part="tabs"] {
+        margin: 0 0.75rem;
+      }
+
+      :host([orientation="vertical"]) [part="tabs"] {
+        width: 100%;
+        margin: 0.5rem 0;
+      }
+
+      [part="forward-button"],
+      [part="back-button"] {
+        position: absolute;
+        z-index: 1;
+        font-family: lumo-icons;
+        color: var(--lumo-tertiary-text-color);
+        font-size: var(--lumo-icon-size-m);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 1.5em;
+        height: 100%;
+        transition: 0.2s opacity;
+        top: 0;
+      }
+
+      [part="forward-button"]:hover,
+      [part="back-button"]:hover {
+        color: inherit;
+      }
+
+      :host(:not([dir="rtl"])) [part="forward-button"] {
+        right: 0;
+      }
+
+      [part="forward-button"]::after {
+        content: var(--lumo-icons-angle-right);
+      }
+
+      [part="back-button"]::after {
+        content: var(--lumo-icons-angle-left);
+      }
+
+      /* Tabs overflow */
+
+      [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: none;
+        -webkit-mask-image: var(--_lumo-tabs-overflow-mask-image);
+        /* For IE11 */
+        min-height: var(--lumo-size-l);
+      }
+
+      /*
+        TODO: CSS custom property in \`mask-image\` causes crash in Edge
+        see https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/15415089/
+      */
+      @-moz-document url-prefix() {
+        [part="tabs"] {
+          mask-image: var(--_lumo-tabs-overflow-mask-image);
+        }
+      }
+
+      /* Horizontal tabs overflow */
+
+      /* Both ends overflowing */
+      :host([overflow~="start"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(90deg, transparent 2em, #000 4em, #000 calc(100% - 4em), transparent calc(100% - 2em));
+      }
+
+      /* End overflowing */
+      :host([overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(90deg, #000 calc(100% - 4em), transparent calc(100% - 2em));
+      }
+
+      /* Start overflowing */
+      :host([overflow~="start"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(90deg, transparent 2em, #000 4em);
+      }
+
+      /* Vertical tabs overflow */
+
+      /* Both ends overflowing */
+      :host([overflow~="start"][overflow~="end"][orientation="vertical"]) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(transparent, #000 2em, #000 calc(100% - 2em), transparent);
+      }
+
+      /* End overflowing */
+      :host([overflow~="end"][orientation="vertical"]) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(#000 calc(100% - 2em), transparent);
+      }
+
+      /* Start overflowing */
+      :host([overflow~="start"][orientation="vertical"]) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(transparent, #000 2em);
+      }
+
+      :host [part="tabs"] ::slotted(:not(vaadin-tab)) {
+        margin-left: var(--lumo-space-m);
+      }
+
+      /* Centered */
+
+      :host([theme~="centered"][orientation="horizontal"]) [part="tabs"] {
+        justify-content: center;
+      }
+
+      /* Small */
+
+      :host([theme~="small"]),
+      :host([theme~="small"]) [part="tabs"] {
+        min-height: var(--lumo-size-m);
+      }
+
+      :host([theme~="small"]) [part="tabs"] ::slotted(vaadin-tab) {
+        font-size: var(--lumo-font-size-s);
+      }
+
+      /* Minimal */
+
+      :host([theme~="minimal"]) {
+        box-shadow: none;
+        /* This doesn't work with ShadyCSS */
+        --_lumo-tab-marker-display: none;
+      }
+
+      /* Workaround for the above ShadyCSS issue */
+      :host([theme~="minimal"]) [part="tabs"] ::slotted(vaadin-tab[selected])::before,
+      :host([theme~="minimal"]) [part="tabs"] ::slotted(vaadin-tab[selected])::after {
+        display: none;
+      }
+
+      /* Hide-scroll-buttons */
+
+      :host([theme~="hide-scroll-buttons"]) [part="back-button"],
+      :host([theme~="hide-scroll-buttons"]) [part="forward-button"] {
+        display: none;
+      }
+
+      :host([theme~="hide-scroll-buttons"][overflow~="start"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(90deg, transparent, #000 2em, #000 calc(100% - 2em), transparent 100%);
+      }
+
+      :host([theme~="hide-scroll-buttons"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(90deg, #000 calc(100% - 2em), transparent 100%);
+      }
+
+      :host([theme~="hide-scroll-buttons"][overflow~="start"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(90deg, transparent, #000 2em);
+      }
+
+      /* Equal-width tabs */
+      :host([theme~="equal-width-tabs"]) {
+        flex: auto;
+      }
+
+      :host([theme~="equal-width-tabs"]) [part="tabs"] ::slotted(vaadin-tab) {
+        flex: 1 0 0%;
+      }
+
+      /* RTL specific styles */
+
+      :host([dir="rtl"]) [part="forward-button"]::after {
+        content: var(--lumo-icons-angle-left);
+      }
+
+      :host([dir="rtl"]) [part="back-button"]::after {
+        content: var(--lumo-icons-angle-right);
+      }
+
+      :host([orientation="vertical"][dir="rtl"]) {
+        box-shadow: 1px 0 0 0 var(--lumo-contrast-10pct);
+      }
+
+      :host([dir="rtl"]) [part="forward-button"] {
+        left: 0;
+      }
+
+      :host([dir="rtl"]) [part="tabs"] ::slotted(:not(vaadin-tab)) {
+        margin-left: 0;
+        margin-right: var(--lumo-space-m);
+      }
+
+      /* Both ends overflowing */
+      :host([dir="rtl"][overflow~="start"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(-90deg, transparent 2em, #000 4em, #000 calc(100% - 4em), transparent calc(100% - 2em));
+      }
+
+      /* End overflowing */
+      :host([dir="rtl"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(-90deg, #000 calc(100% - 4em), transparent calc(100% - 2em));
+      }
+
+      /* Start overflowing */
+      :host([dir="rtl"][overflow~="start"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(-90deg, transparent 2em, #000 4em);
+      }
+
+      :host([dir="rtl"][theme~="hide-scroll-buttons"][overflow~="start"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(-90deg, transparent, #000 2em, #000 calc(100% - 2em), transparent 100%);
+      }
+
+      :host([dir="rtl"][theme~="hide-scroll-buttons"][overflow~="end"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(-90deg, #000 calc(100% - 2em), transparent 100%);
+      }
+
+      :host([dir="rtl"][theme~="hide-scroll-buttons"][overflow~="start"]:not([orientation="vertical"])) [part="tabs"] {
+        --_lumo-tabs-overflow-mask-image: linear-gradient(-90deg, transparent, #000 2em);
+      }
+    </style>
+  </template>
+</dom-module>`;document.head.appendChild(m.content);
+/**
+@license
+Copyright (c) 2017 Vaadin Ltd.
+This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+*/
+const h=/Apple.* Version\/(9|10)/.test(navigator.userAgent);class f extends(t(a(e(l([s],r))))){static get template(){return o`
+    <style>
+      :host {
+        display: flex;
+        align-items: center;
+      }
+
+      :host([hidden]) {
+        display: none !important;
+      }
+
+      :host([orientation="vertical"]) {
+        display: block;
+      }
+
+      :host([orientation="horizontal"]) [part="tabs"] {
+        flex-grow: 1;
+        display: flex;
+        align-self: stretch;
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+        -ms-overflow-style: none;
+      }
+
+      /* This seems more future-proof than \`overflow: -moz-scrollbars-none\` which is marked obsolete
+         and is no longer guaranteed to work:
+         https://developer.mozilla.org/en-US/docs/Web/CSS/overflow#Mozilla_Extensions */
+      @-moz-document url-prefix() {
+        :host([orientation="horizontal"]) [part="tabs"] {
+          overflow: hidden;
+        }
+      }
+
+      :host([orientation="horizontal"]) [part="tabs"]::-webkit-scrollbar {
+        display: none;
+      }
+
+      :host([orientation="vertical"]) [part="tabs"] {
+        height: 100%;
+        overflow-y: auto;
+        -webkit-overflow-scrolling: touch;
+      }
+
+      [part="back-button"],
+      [part="forward-button"] {
+        pointer-events: none;
+        opacity: 0;
+        cursor: default;
+      }
+
+      :host([overflow~="start"]) [part="back-button"],
+      :host([overflow~="end"]) [part="forward-button"] {
+        pointer-events: auto;
+        opacity: 1;
+      }
+
+      [part="back-button"]::after {
+        content: '◀';
+      }
+
+      [part="forward-button"]::after {
+        content: '▶';
+      }
+
+      :host([orientation="vertical"]) [part="back-button"],
+      :host([orientation="vertical"]) [part="forward-button"] {
+        display: none;
+      }
+
+      /* RTL specific styles */
+
+      :host([dir="rtl"]) [part="back-button"]::after {
+        content: '▶';
+      }
+
+      :host([dir="rtl"]) [part="forward-button"]::after {
+        content: '◀';
+      }
+    </style>
+    <div on-click="_scrollBack" part="back-button"></div>
+
+    <div id="scroll" part="tabs">
+      <slot></slot>
+    </div>
+
+    <div on-click="_scrollForward" part="forward-button"></div>
+`}static get is(){return"vaadin-tabs"}static get version(){return"3.2.0"}static get properties(){return{orientation:{value:"horizontal",type:String},selected:{value:0,type:Number}}}static get observers(){return["_updateOverflow(items.*, vertical)"]}ready(){super.ready(),this.addEventListener("iron-resize",(()=>this._updateOverflow())),this._scrollerElement.addEventListener("scroll",(()=>this._updateOverflow())),this.setAttribute("role","tablist"),n(this,(()=>{this._updateOverflow()}))}_scrollForward(){this._scroll(-this.__direction*this._scrollOffset)}_scrollBack(){this._scroll(this.__direction*this._scrollOffset)}get _scrollOffset(){return this._vertical?this._scrollerElement.offsetHeight:this._scrollerElement.offsetWidth}get _scrollerElement(){return this.$.scroll}get __direction(){return this._vertical||"rtl"!==this.getAttribute("dir")?-1:1}_updateOverflow(){const t=this._vertical?this._scrollerElement.scrollTop:this.__getNormalizedScrollLeft(this._scrollerElement);let e=this._vertical?this._scrollerElement.scrollHeight:this._scrollerElement.scrollWidth;e-=1;let o=t>0?"start":"";o+=t+this._scrollOffset<e?" end":"",1==this.__direction&&(o=o.replace(/start|end/gi,(t=>"start"===t?"end":"start"))),o?this.setAttribute("overflow",o.trim()):this.removeAttribute("overflow"),this._repaintShadowNodesHack()}_repaintShadowNodesHack(){if(h&&this.root){const t="-webkit-backface-visibility";this.root.querySelectorAll("*").forEach((e=>{e.style[t]="visible",e.style[t]=""}))}}}customElements.define(f.is,f);

package/dist/cdn/{shared-e06de519.js → shared-72279946.js}

@@ -1 +1 @@
-import{_ as e}from"./shared-fadcb2e1.js";import"./shared-fd001fd3.js";import"./shared-8936b109.js";import"./shared-dbdc2a38.js";import{L as s,c as t,h as r}from"./shared-dc73b9a5.js";import{T as a}from"./shared-33b47806.js";import{c as i}from"./shared-4e709717.js";class c extends CustomEvent{constructor(e){super("change",{detail:e})}}let o,d,l=e=>e;class h extends(a(s)){constructor(){super(...arguments),this.readonly=!1,this.disabled=!1,this.checked=!1}static get properties(){return e(e({},super.properties),{},{readonly:{type:Boolean},disabled:{type:Boolean},checked:{type:Boolean}})}static get styles(){return[super.styles,t(o||(o=l`:host{--check-size:1.125rem}label{margin:calc(((1rem * var(--lumo-line-height-s)) - var(--check-size))/ -2) 0}label>:first-child{height:calc(1rem * var(--lumo-line-height-s))}.ml-xxl{margin-left:calc(var(--lumo-space-m) + var(--check-size))}.check{height:var(--check-size);width:var(--check-size)}`))]}render(){return r(d||(d=l` <label class="${0}"> <div class="flex items-center"> <div class="${0}"> <iron-icon icon="lumo:checkmark" class="${0}"> </iron-icon> <input type="checkbox" class="sr-only" .checked="${0}" ?disabled="${0}" data-testid="input" @change="${0}"> </div> </div> <div class="flex-1 font-lumo leading-s ml-m"> <slot></slot> </div> </label> <div class="${0}"> <slot name="content"></slot> </div> `),i({"flex items-start group transition-colors":!0,"cursor-default":this.disabled||this.readonly,"text-disabled":this.disabled,"text-secondary":this.readonly,"cursor-pointer":!this.disabled}),i({"flex-shrink-0 check transition-colors rounded-s border":!0,"focus-within-shadow-outline":!0,"bg-primary text-primary-contrast":!this.readonly&&this.checked,"border-dashed border-contrast-30":this.readonly,"border-transparent":!this.readonly,"opacity-50":this.disabled,"text-secondary bg-contrast-20":!this.readonly&&!this.checked,"group-hover-bg-contrast-30":!this.readonly&&!this.checked}),i({"block w-full h-full transition-transform transform":!0,"scale-100":this.checked,"scale-0":!this.checked}),this.checked,this.disabled,(e=>{if(this.readonly)return e.preventDefault();e.stopPropagation(),this.checked=!this.checked,this.dispatchEvent(new c(this.checked))}),i({"font-lumo ml-xxl transition-colors":!0,"text-disabled":this.disabled}))}}export{h as C,c as a};
+import{_ as e}from"./shared-a8ced8bf.js";import"./shared-d7c271d2.js";import"./shared-0d3bec9f.js";import"./shared-780ead03.js";import{L as s,c as t,h as r}from"./shared-7f33a83a.js";import{T as a}from"./shared-459a5ec4.js";import{c as i}from"./shared-4e709717.js";class c extends CustomEvent{constructor(e){super("change",{detail:e})}}let o,d,l=e=>e;class h extends(a(s)){constructor(){super(...arguments),this.readonly=!1,this.disabled=!1,this.checked=!1}static get properties(){return e(e({},super.properties),{},{readonly:{type:Boolean},disabled:{type:Boolean},checked:{type:Boolean}})}static get styles(){return[super.styles,t(o||(o=l`:host{--check-size:1.125rem}label{margin:calc(((1rem * var(--lumo-line-height-s)) - var(--check-size))/ -2) 0}label>:first-child{height:calc(1rem * var(--lumo-line-height-s))}.ml-xxl{margin-left:calc(var(--lumo-space-m) + var(--check-size))}.check{height:var(--check-size);width:var(--check-size)}`))]}render(){return r(d||(d=l` <label class="${0}"> <div class="flex items-center"> <div class="${0}"> <iron-icon icon="lumo:checkmark" class="${0}"> </iron-icon> <input type="checkbox" class="sr-only" .checked="${0}" ?disabled="${0}" data-testid="input" @change="${0}"> </div> </div> <div class="flex-1 font-lumo leading-s ml-m"> <slot></slot> </div> </label> <div class="${0}"> <slot name="content"></slot> </div> `),i({"flex items-start group transition-colors":!0,"cursor-default":this.disabled||this.readonly,"text-disabled":this.disabled,"text-secondary":this.readonly,"cursor-pointer":!this.disabled}),i({"flex-shrink-0 check transition-colors rounded-s border":!0,"focus-within-shadow-outline":!0,"bg-primary text-primary-contrast":!this.readonly&&this.checked,"border-dashed border-contrast-30":this.readonly,"border-transparent":!this.readonly,"opacity-50":this.disabled,"text-secondary bg-contrast-20":!this.readonly&&!this.checked,"group-hover-bg-contrast-30":!this.readonly&&!this.checked}),i({"block w-full h-full transition-transform transform":!0,"scale-100":this.checked,"scale-0":!this.checked}),this.checked,this.disabled,(e=>{if(this.readonly)return e.preventDefault();e.stopPropagation(),this.checked=!this.checked,this.dispatchEvent(new c(this.checked))}),i({"font-lumo ml-xxl transition-colors":!0,"text-disabled":this.disabled}))}}export{h as C,c as a};

package/dist/cdn/{shared-7ed7818e.js → shared-7304a1ab.js}

@@ -1 +1 @@
-import{L as r,h as s}from"./shared-dc73b9a5.js";import{w as e}from"./shared-33b47806.js";let t,o=r=>r;class n extends r{static get styles(){return e.styles}render(){return s(t||(t=o` <p class="flex text-s border border-contrast-10 rounded-t-l rounded-b-l p-s text-body leading-s"> <iron-icon icon="lumo:error" class="text-error flex-shrink-0 mr-s"></iron-icon> <slot></slot> </p> `))}}function a(r){const[s,e,t]=r.split("-").map((r=>parseInt(r,10)));return[s,e,t].some((r=>"number"!=typeof r||isNaN(r)))?null:new Date(s,e-1,t)}export{n as W,a as p};
+import{L as r,h as s}from"./shared-7f33a83a.js";import{w as e}from"./shared-459a5ec4.js";let t,o=r=>r;class n extends r{static get styles(){return e.styles}render(){return s(t||(t=o` <p class="flex text-s border border-contrast-10 rounded-t-l rounded-b-l p-s text-body leading-s"> <iron-icon icon="lumo:error" class="text-error flex-shrink-0 mr-s"></iron-icon> <slot></slot> </p> `))}}function a(r){const[s,e,t]=r.split("-").map((r=>parseInt(r,10)));return[s,e,t].some((r=>"number"!=typeof r||isNaN(r)))?null:new Date(s,e-1,t)}export{n as W,a as p};