@foxy.io/elements 1.22.0 → 1.22.1

package/dist/cdn/{shared-bc36bc72.js → shared-fcc22aca.js}

@@ -1 +1 @@
-import{_ as e}from"./shared-98755831.js";import{L as t,c as s,h as i}from"./shared-7f33a83a.js";import{A as o}from"./shared-509a2f52.js";import{C as a}from"./shared-de790de9.js";import{T as n,R as l,a as d}from"./shared-e9c81269.js";import{I as r}from"./shared-a8cf402a.js";import{F as h}from"./shared-64657919.js";import{c}from"./shared-4e709717.js";class u extends CustomEvent{constructor(e=!1){super("hide",{detail:{cancelled:e}})}}class p extends CustomEvent{constructor(){super("show")}}let m,v=e=>e;class b extends(a(n(l(d(r(t)))))){constructor(){super(...arguments),this.group=""}static get properties(){return e(e({},super.properties),{},{group:{}})}static get styles(){return[super.styles,s(m||(m=v`:host{position:relative;z-index:200}`))]}}let _,g,y,f,w,x,$,C=e=>e;const D=d(a(n(r(t))));class k extends D{constructor(){super(...arguments),this.closable=!1,this.editable=!1,this.header="",this.group="",this.alert=!1,this.wide=!1,this.__handleKeyDown=e=>{"Escape"===e.key&&k.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},group:{},alert:{type:Boolean},wide:{type:Boolean},open:{type:Boolean,noAccessor:!0}})}static get styles(){return[super.styles,s(_||(_=C`.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=k.dialogWindows.get(this))||void 0===e||e.remove(),k.dialogWindows.delete(this)}createRenderRoot(){const e=new b,t=document.querySelectorAll(k.dialogWindowsHost),s=Array.from(t).pop();return e.addEventListener("fetch",(e=>{e instanceof h&&(e.stopImmediatePropagation(),e.preventDefault(),e.respondWith(new o(this).fetch(e.request)))})),null==s||s.appendChild(e),k.dialogWindows.set(this,e),e.shadowRoot}render(e){if(!this.__connected)return i(g||(g=C``));const t=k.openDialogs[0]===this,s=k.openDialogs[1]===this,o=k.openDialogs[2]===this,a=!t&&!s&&!o;return i(y||(y=C` <div class="${0}"> <div id="backdrop" class="${0}" tabindex="-1" @click="${0}"></div> <div tabindex="0" 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> `),c({"z-50 fixed inset-0":!0,"pointer-events-none":!this.__visible}),c({"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)),c({"transform ease-in-out transition duration-500 relative h-full ml-auto":!0,"origin-bottom sm-origin-center":!0,"focus-outline-none":!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":o&&this.__visible,"opacity-0 scale-85 -translate-y-l sm-translate-y-0":a&&this.__visible}),c({"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(f||(f=C` <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=C`<div></div>`)),this.ns,this.lang,this.header,this.editable&&!this.hiddenSelector.matches("save-button",!0)?i(x||(x=C` <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($||($=C`<div></div>`)),null==e?void 0:e())}updated(e){super.updated(e);const t=k.dialogWindows.get(this);t&&(t.disabledControls=this.disabledControls,t.disabled=this.disabled,t.readonlyControls=this.readonlyControls,t.readonly=this.readonly,t.hiddenControls=this.hiddenControls,t.hidden=this.hidden,t.group=this.group,t.lang=this.lang,t.ns=this.ns)}async hide(e=!1){var t;null===(t=this.__returnFocusTo)||void 0===t||t.focus(),await this.__setOpenDialogs(k.openDialogs.filter((e=>e!==this))),await this.__setConnected(!1),this.dispatchEvent(new k.HideEvent(!!e))}async show(e){var t;this.__returnFocusTo=e,await this.__setConnected(!0),await this.__setOpenDialogs([this,...k.openDialogs]),null===(t=this.renderRoot.querySelector('[role="dialog"]'))||void 0===t||t.focus(),this.dispatchEvent(new k.ShowEvent)}async save(){await this.hide(!1)}async __setOpenDialogs(e){k.openDialogs.length=0,k.openDialogs.push(...e),await Promise.all([Promise.all(k.openDialogs.map((e=>e.requestUpdate()))),new Promise((e=>{this.renderRoot.querySelector("#backdrop").addEventListener("transitionend",e,{once:!0}),this.__visible=k.openDialogs.includes(this)}))])}async __setConnected(e){this.__connected=e,await this.updateComplete.then((()=>this.getBoundingClientRect()))}}k.dialogWindowsHost="#foxy-dialog-windows-host, body",k.dialogWindows=new WeakMap,k.openDialogs=[],k.ShowEvent=p,k.HideEvent=u,customElements.define("foxy-dialog-window",b);export{k as D};
+import{_ as e}from"./shared-98755831.js";import{L as t,c as s,h as i}from"./shared-7f33a83a.js";import{A as o}from"./shared-509a2f52.js";import{C as a}from"./shared-de790de9.js";import{T as n,R as l,a as d}from"./shared-e65fe03a.js";import{I as r}from"./shared-a8cf402a.js";import{F as h}from"./shared-64657919.js";import{c}from"./shared-4e709717.js";class u extends CustomEvent{constructor(e=!1){super("hide",{detail:{cancelled:e}})}}class p extends CustomEvent{constructor(){super("show")}}let m,v=e=>e;class b extends(a(n(l(d(r(t)))))){constructor(){super(...arguments),this.group=""}static get properties(){return e(e({},super.properties),{},{group:{}})}static get styles(){return[super.styles,s(m||(m=v`:host{position:relative;z-index:200}`))]}}let _,g,y,f,w,x,$,C=e=>e;const D=d(a(n(r(t))));class k extends D{constructor(){super(...arguments),this.closable=!1,this.editable=!1,this.header="",this.group="",this.alert=!1,this.wide=!1,this.__handleKeyDown=e=>{"Escape"===e.key&&k.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},group:{},alert:{type:Boolean},wide:{type:Boolean},open:{type:Boolean,noAccessor:!0}})}static get styles(){return[super.styles,s(_||(_=C`.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=k.dialogWindows.get(this))||void 0===e||e.remove(),k.dialogWindows.delete(this)}createRenderRoot(){const e=new b,t=document.querySelectorAll(k.dialogWindowsHost),s=Array.from(t).pop();return e.addEventListener("fetch",(e=>{e instanceof h&&(e.stopImmediatePropagation(),e.preventDefault(),e.respondWith(new o(this).fetch(e.request)))})),null==s||s.appendChild(e),k.dialogWindows.set(this,e),e.shadowRoot}render(e){if(!this.__connected)return i(g||(g=C``));const t=k.openDialogs[0]===this,s=k.openDialogs[1]===this,o=k.openDialogs[2]===this,a=!t&&!s&&!o;return i(y||(y=C` <div class="${0}"> <div id="backdrop" class="${0}" tabindex="-1" @click="${0}"></div> <div tabindex="0" 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> `),c({"z-50 fixed inset-0":!0,"pointer-events-none":!this.__visible}),c({"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)),c({"transform ease-in-out transition duration-500 relative h-full ml-auto":!0,"origin-bottom sm-origin-center":!0,"focus-outline-none":!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":o&&this.__visible,"opacity-0 scale-85 -translate-y-l sm-translate-y-0":a&&this.__visible}),c({"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(f||(f=C` <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=C`<div></div>`)),this.ns,this.lang,this.header,this.editable&&!this.hiddenSelector.matches("save-button",!0)?i(x||(x=C` <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($||($=C`<div></div>`)),null==e?void 0:e())}updated(e){super.updated(e);const t=k.dialogWindows.get(this);t&&(t.disabledControls=this.disabledControls,t.disabled=this.disabled,t.readonlyControls=this.readonlyControls,t.readonly=this.readonly,t.hiddenControls=this.hiddenControls,t.hidden=this.hidden,t.group=this.group,t.lang=this.lang,t.ns=this.ns)}async hide(e=!1){var t;null===(t=this.__returnFocusTo)||void 0===t||t.focus(),await this.__setOpenDialogs(k.openDialogs.filter((e=>e!==this))),await this.__setConnected(!1),this.dispatchEvent(new k.HideEvent(!!e))}async show(e){var t;this.__returnFocusTo=e,await this.__setConnected(!0),await this.__setOpenDialogs([this,...k.openDialogs]),null===(t=this.renderRoot.querySelector('[role="dialog"]'))||void 0===t||t.focus(),this.dispatchEvent(new k.ShowEvent)}async save(){await this.hide(!1)}async __setOpenDialogs(e){k.openDialogs.length=0,k.openDialogs.push(...e),await Promise.all([Promise.all(k.openDialogs.map((e=>e.requestUpdate()))),new Promise((e=>{this.renderRoot.querySelector("#backdrop").addEventListener("transitionend",e,{once:!0}),this.__visible=k.openDialogs.includes(this)}))])}async __setConnected(e){this.__connected=e,await this.updateComplete.then((()=>this.getBoundingClientRect()))}}k.dialogWindowsHost="#foxy-dialog-windows-host, body",k.dialogWindows=new WeakMap,k.openDialogs=[],k.ShowEvent=p,k.HideEvent=u,customElements.define("foxy-dialog-window",b);export{k as D};

package/dist/cdn/{shared-8b0c77a7.js → shared-fce91408.js}

@@ -1 +1 @@
-import{_ as e}from"./shared-98755831.js";import"./shared-24a762c1.js";import"./shared-9e8bff76.js";import"./shared-950875f2.js";import{L as s,c as t,h as r}from"./shared-7f33a83a.js";import{T as a}from"./shared-e9c81269.js";import{c as i}from"./shared-4e709717.js";class c extends CustomEvent{constructor(e){super("change",{detail:e})}}let o,l,d=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=d`: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(l||(l=d` <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-98755831.js";import"./shared-f300770c.js";import"./shared-03082012.js";import"./shared-da9a7425.js";import{L as s,c as t,h as r}from"./shared-7f33a83a.js";import{T as a}from"./shared-e65fe03a.js";import{c as i}from"./shared-4e709717.js";class o extends CustomEvent{constructor(e){super("change",{detail:e})}}let c,l,d=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(c||(c=d`: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(l||(l=d` <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 o(this.checked))}),i({"font-lumo ml-xxl transition-colors":!0,"text-disabled":this.disabled}))}}export{h as C,o as a};

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.d.ts

@@ -4,6 +4,10 @@ import type { FormDialog } from '../../index';
 import { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';
 export declare class InternalAsyncListControl extends InternalEditableControl {
     static get properties(): PropertyDeclarations;
+    /** If true, FormDialog won't automatically close after the associated form deletes the resource. */
+    keepDialogOpenOnDelete: boolean;
+    /** If true, FormDialog won't automatically close after the associated form creates a resource. */
+    keepDialogOpenOnPost: boolean;
     /** If provided, renders Create button as a link to this page. */
     createPageHref: string | null;
     /** Same as the `related` property of `NucleonElement`. */

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.js

@@ -5,6 +5,10 @@ import { html } from 'lit-element';
 export class InternalAsyncListControl extends InternalEditableControl {
     constructor() {
         super(...arguments);
+        /** If true, FormDialog won't automatically close after the associated form deletes the resource. */
+        this.keepDialogOpenOnDelete = false;
+        /** If true, FormDialog won't automatically close after the associated form creates a resource. */
+        this.keepDialogOpenOnPost = false;
         /** If provided, renders Create button as a link to this page. */
         this.createPageHref = null;
         /** Same as the `related` property of `NucleonElement`. */
@@ -98,6 +102,8 @@ export class InternalAsyncListControl extends InternalEditableControl {
     static get properties() {
         return {
             ...super.properties,
+            keepDialogOpenOnDelete: { type: Boolean, attribute: 'keep-dialog-open-on-delete' },
+            keepDialogOpenOnPost: { type: Boolean, attribute: 'keep-dialog-open-on-post' },
             hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },
             hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },
             createPageHref: { attribute: 'create-page-href' },
@@ -131,6 +137,8 @@ export class InternalAsyncListControl extends InternalEditableControl {
               id="form"
               ?wide=${this.wide}
               ?alert=${this.alert}
+              ?keep-open-on-post=${this.keepDialogOpenOnPost}
+              ?keep-open-on-delete=${this.keepDialogOpenOnDelete}
               .related=${this.related}
               .form=${this.form}
             >

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalAsyncListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControl.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { CollectionPage, NucleonElement } from '../../public/index';\nimport type { InternalConfirmDialog } from '../InternalConfirmDialog';\nimport type { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport type { ItemRenderer } from '../../public/CollectionPage/types';\nimport type { FormDialog } from '../../index';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\nimport { html } from 'lit-element';\n\nexport class InternalAsyncListControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },\n      hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },\n      createPageHref: { attribute: 'create-page-href' },\n      getPageHref: { attribute: false },\n      related: { type: Array },\n      first: {},\n      limit: { type: Number },\n      form: {},\n      item: {},\n      wide: { type: Boolean },\n      alert: { type: Boolean },\n    };\n  }\n\n  /** If provided, renders Create button as a link to this page. */\n  createPageHref: string | null = null;\n\n  /** Same as the `related` property of `NucleonElement`. */\n  related = [] as string[];\n\n  /** Limit query parameter to apply to the `first` URL. */\n  limit = 20;\n\n  /** URI of the first page of the hAPI collection to display. */\n  first: string | null = null;\n\n  /** Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. */\n  form: FormDialog['form'] = null;\n\n  /** Same as the `item` property of `CollectionPage`. */\n  item: CollectionPage<any>['item'] = null;\n\n  /** Same as the `wide` property of `FormDialog`. */\n  wide = false;\n\n  /** Same as the `alert` property of `FormDialog`. */\n  alert = false;\n\n  /** Hides Delete Swipe Action if true. */\n  hideDeleteButton = false;\n\n  /** Hides Create button if true. */\n  hideCreateButton = false;\n\n  /** If set, renders list items as <a> tags. */\n  getPageHref: ((itemHref: string, item: unknown) => string | null) | null = null;\n\n  private __deletionConfimationCallback: (() => void) | null = null;\n\n  private __cachedCardRenderer: {\n    item: InternalAsyncListControl['item'];\n    render: ItemRenderer;\n  } | null = null;\n\n  private __itemRenderer: ItemRenderer = ctx => {\n    if (!ctx.data) return this.__cardRenderer(ctx);\n\n    const href = this.getPageHref?.(ctx.href, ctx.data);\n    if (typeof href !== 'string' && !this.form) return this.__cardRenderer(ctx);\n\n    const isDisabled = this.disabledSelector.matches('card', true);\n    const card = this.__cardRenderer(ctx);\n    let clickableItem: TemplateResult;\n\n    const wrapperClass = classMap({\n      'rounded-t': !ctx.previous,\n      'rounded-b': !ctx.next,\n      'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n      'text-left w-full block transition-colors': true,\n      'hover-bg-contrast-5': !isDisabled,\n    });\n\n    if (this.getPageHref) {\n      if (isDisabled) {\n        clickableItem = html`<div class=${wrapperClass}>${card}</div>`;\n      } else {\n        const href = this.getPageHref(ctx.href, ctx.data);\n        clickableItem = html`<a class=${wrapperClass} href=${href}>${card}</a>`;\n      }\n    } else {\n      const handleClick = (evt: Event) => {\n        const button = evt.currentTarget as HTMLButtonElement;\n        const dialog = this.__dialog;\n\n        dialog.header = 'header_update';\n        dialog.href = ctx.href;\n        dialog.show(button);\n      };\n\n      clickableItem = html`\n        <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>\n      `;\n    }\n\n    if (this.hideDeleteButton) return clickableItem;\n\n    return html`\n      <foxy-swipe-actions class=\"block\">\n        ${clickableItem}\n\n        <vaadin-button\n          theme=\"primary error\"\n          class=\"h-full\"\n          slot=\"action\"\n          @click=${(evt: CustomEvent) => {\n            const button = evt.currentTarget as HTMLElement;\n            const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n\n            confirm.show(button);\n\n            this.__deletionConfimationCallback = () => {\n              const cardButton = button.previousElementSibling!;\n              const card = cardButton.querySelector<NucleonElement<any>>('[href]');\n\n              card?.delete();\n              this.__deletionConfimationCallback = null;\n            };\n          }}\n        >\n          <foxy-i18n infer=\"\" key=\"delete_button_text\"></foxy-i18n>\n        </vaadin-button>\n      </foxy-swipe-actions>\n    `;\n  };\n\n  renderControl(): TemplateResult {\n    let first: string | undefined;\n\n    try {\n      const url = new URL(this.first ?? '');\n      url.searchParams.set('limit', String(this.limit));\n      first = url.toString();\n    } catch {\n      first = undefined;\n    }\n\n    return html`\n      ${this.form\n        ? html`\n            <foxy-form-dialog\n              parent=${ifDefined(this.first ?? void 0)}\n              infer=\"dialog\"\n              id=\"form\"\n              ?wide=${this.wide}\n              ?alert=${this.alert}\n              .related=${this.related}\n              .form=${this.form as any}\n            >\n            </foxy-form-dialog>\n          `\n        : ''}\n      ${this.hideDeleteButton\n        ? ''\n        : html`\n            <foxy-internal-confirm-dialog\n              message=\"delete_message\"\n              confirm=\"delete_confirm\"\n              cancel=\"delete_cancel\"\n              header=\"delete_header\"\n              theme=\"error\"\n              infer=\"\"\n              id=\"confirm\"\n              @hide=${(evt: DialogHideEvent) => {\n                if (!evt.detail.cancelled) this.__deletionConfimationCallback?.();\n              }}\n            >\n            </foxy-internal-confirm-dialog>\n          `}\n      ${this.label && this.label !== 'label'\n        ? html`<div class=\"font-medium text-secondary text-s mb-xs\">${this.label}</div>`\n        : ''}\n\n      <foxy-pagination first=${ifDefined(first)} infer=\"pagination\">\n        <foxy-collection-page\n          class=\"mb-s block divide-y divide-contrast-5 rounded overflow-hidden bg-contrast-5\"\n          infer=\"card\"\n          .related=${this.related}\n          .item=${this.__itemRenderer as any}\n        >\n        </foxy-collection-page>\n\n        ${(!this.form && !this.createPageHref) || this.readonly || this.hideCreateButton\n          ? ''\n          : this.createPageHref && !this.disabled\n          ? html`\n              <a\n                class=\"mb-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                href=${this.createPageHref}\n              >\n                <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n              </a>\n            `\n          : html`\n              <vaadin-button\n                class=\"mb-s w-full\"\n                theme=\"success\"\n                ?disabled=${this.disabled}\n                @click=${(evt: Event) => {\n                  evt.preventDefault();\n                  evt.stopPropagation();\n\n                  const dialog = this.__dialog;\n                  const button = evt.currentTarget as HTMLButtonElement;\n\n                  dialog.header = 'header_create';\n                  dialog.href = '';\n                  dialog.show(button);\n                }}\n              >\n                <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n              </vaadin-button>\n            `}\n      </foxy-pagination>\n    `;\n  }\n\n  private get __dialog() {\n    return this.renderRoot.querySelector('#form') as FormDialog;\n  }\n\n  private get __cardRenderer() {\n    const item = this.item;\n\n    if (this.__cachedCardRenderer?.item !== item) {\n      this.__cachedCardRenderer = {\n        item: item,\n        render:\n          typeof item === 'string'\n            ? (new Function(\n                'ctx',\n                `return ctx.html\\`<${item} related=\\${JSON.stringify(ctx.related)} parent=\\${ctx.parent} style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\" infer href=\\${ctx.href}></${item}>\\``\n              ) as ItemRenderer)\n            : ctx => html`\n                <div style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\">\n                  ${item?.(ctx)}\n                </div>\n              `,\n      };\n    }\n\n    return this.__cachedCardRenderer.render;\n  }\n}\n"]}
+{"version":3,"file":"InternalAsyncListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControl.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { CollectionPage, NucleonElement } from '../../public/index';\nimport type { InternalConfirmDialog } from '../InternalConfirmDialog';\nimport type { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport type { ItemRenderer } from '../../public/CollectionPage/types';\nimport type { FormDialog } from '../../index';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\nimport { html } from 'lit-element';\n\nexport class InternalAsyncListControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      keepDialogOpenOnDelete: { type: Boolean, attribute: 'keep-dialog-open-on-delete' },\n      keepDialogOpenOnPost: { type: Boolean, attribute: 'keep-dialog-open-on-post' },\n      hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },\n      hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },\n      createPageHref: { attribute: 'create-page-href' },\n      getPageHref: { attribute: false },\n      related: { type: Array },\n      first: {},\n      limit: { type: Number },\n      form: {},\n      item: {},\n      wide: { type: Boolean },\n      alert: { type: Boolean },\n    };\n  }\n\n  /** If true, FormDialog won't automatically close after the associated form deletes the resource. */\n  keepDialogOpenOnDelete = false;\n\n  /** If true, FormDialog won't automatically close after the associated form creates a resource. */\n  keepDialogOpenOnPost = false;\n\n  /** If provided, renders Create button as a link to this page. */\n  createPageHref: string | null = null;\n\n  /** Same as the `related` property of `NucleonElement`. */\n  related = [] as string[];\n\n  /** Limit query parameter to apply to the `first` URL. */\n  limit = 20;\n\n  /** URI of the first page of the hAPI collection to display. */\n  first: string | null = null;\n\n  /** Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. */\n  form: FormDialog['form'] = null;\n\n  /** Same as the `item` property of `CollectionPage`. */\n  item: CollectionPage<any>['item'] = null;\n\n  /** Same as the `wide` property of `FormDialog`. */\n  wide = false;\n\n  /** Same as the `alert` property of `FormDialog`. */\n  alert = false;\n\n  /** Hides Delete Swipe Action if true. */\n  hideDeleteButton = false;\n\n  /** Hides Create button if true. */\n  hideCreateButton = false;\n\n  /** If set, renders list items as <a> tags. */\n  getPageHref: ((itemHref: string, item: unknown) => string | null) | null = null;\n\n  private __deletionConfimationCallback: (() => void) | null = null;\n\n  private __cachedCardRenderer: {\n    item: InternalAsyncListControl['item'];\n    render: ItemRenderer;\n  } | null = null;\n\n  private __itemRenderer: ItemRenderer = ctx => {\n    if (!ctx.data) return this.__cardRenderer(ctx);\n\n    const href = this.getPageHref?.(ctx.href, ctx.data);\n    if (typeof href !== 'string' && !this.form) return this.__cardRenderer(ctx);\n\n    const isDisabled = this.disabledSelector.matches('card', true);\n    const card = this.__cardRenderer(ctx);\n    let clickableItem: TemplateResult;\n\n    const wrapperClass = classMap({\n      'rounded-t': !ctx.previous,\n      'rounded-b': !ctx.next,\n      'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n      'text-left w-full block transition-colors': true,\n      'hover-bg-contrast-5': !isDisabled,\n    });\n\n    if (this.getPageHref) {\n      if (isDisabled) {\n        clickableItem = html`<div class=${wrapperClass}>${card}</div>`;\n      } else {\n        const href = this.getPageHref(ctx.href, ctx.data);\n        clickableItem = html`<a class=${wrapperClass} href=${href}>${card}</a>`;\n      }\n    } else {\n      const handleClick = (evt: Event) => {\n        const button = evt.currentTarget as HTMLButtonElement;\n        const dialog = this.__dialog;\n\n        dialog.header = 'header_update';\n        dialog.href = ctx.href;\n        dialog.show(button);\n      };\n\n      clickableItem = html`\n        <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>\n      `;\n    }\n\n    if (this.hideDeleteButton) return clickableItem;\n\n    return html`\n      <foxy-swipe-actions class=\"block\">\n        ${clickableItem}\n\n        <vaadin-button\n          theme=\"primary error\"\n          class=\"h-full\"\n          slot=\"action\"\n          @click=${(evt: CustomEvent) => {\n            const button = evt.currentTarget as HTMLElement;\n            const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n\n            confirm.show(button);\n\n            this.__deletionConfimationCallback = () => {\n              const cardButton = button.previousElementSibling!;\n              const card = cardButton.querySelector<NucleonElement<any>>('[href]');\n\n              card?.delete();\n              this.__deletionConfimationCallback = null;\n            };\n          }}\n        >\n          <foxy-i18n infer=\"\" key=\"delete_button_text\"></foxy-i18n>\n        </vaadin-button>\n      </foxy-swipe-actions>\n    `;\n  };\n\n  renderControl(): TemplateResult {\n    let first: string | undefined;\n\n    try {\n      const url = new URL(this.first ?? '');\n      url.searchParams.set('limit', String(this.limit));\n      first = url.toString();\n    } catch {\n      first = undefined;\n    }\n\n    return html`\n      ${this.form\n        ? html`\n            <foxy-form-dialog\n              parent=${ifDefined(this.first ?? void 0)}\n              infer=\"dialog\"\n              id=\"form\"\n              ?wide=${this.wide}\n              ?alert=${this.alert}\n              ?keep-open-on-post=${this.keepDialogOpenOnPost}\n              ?keep-open-on-delete=${this.keepDialogOpenOnDelete}\n              .related=${this.related}\n              .form=${this.form as any}\n            >\n            </foxy-form-dialog>\n          `\n        : ''}\n      ${this.hideDeleteButton\n        ? ''\n        : html`\n            <foxy-internal-confirm-dialog\n              message=\"delete_message\"\n              confirm=\"delete_confirm\"\n              cancel=\"delete_cancel\"\n              header=\"delete_header\"\n              theme=\"error\"\n              infer=\"\"\n              id=\"confirm\"\n              @hide=${(evt: DialogHideEvent) => {\n                if (!evt.detail.cancelled) this.__deletionConfimationCallback?.();\n              }}\n            >\n            </foxy-internal-confirm-dialog>\n          `}\n      ${this.label && this.label !== 'label'\n        ? html`<div class=\"font-medium text-secondary text-s mb-xs\">${this.label}</div>`\n        : ''}\n\n      <foxy-pagination first=${ifDefined(first)} infer=\"pagination\">\n        <foxy-collection-page\n          class=\"mb-s block divide-y divide-contrast-5 rounded overflow-hidden bg-contrast-5\"\n          infer=\"card\"\n          .related=${this.related}\n          .item=${this.__itemRenderer as any}\n        >\n        </foxy-collection-page>\n\n        ${(!this.form && !this.createPageHref) || this.readonly || this.hideCreateButton\n          ? ''\n          : this.createPageHref && !this.disabled\n          ? html`\n              <a\n                class=\"mb-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                href=${this.createPageHref}\n              >\n                <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n              </a>\n            `\n          : html`\n              <vaadin-button\n                class=\"mb-s w-full\"\n                theme=\"success\"\n                ?disabled=${this.disabled}\n                @click=${(evt: Event) => {\n                  evt.preventDefault();\n                  evt.stopPropagation();\n\n                  const dialog = this.__dialog;\n                  const button = evt.currentTarget as HTMLButtonElement;\n\n                  dialog.header = 'header_create';\n                  dialog.href = '';\n                  dialog.show(button);\n                }}\n              >\n                <foxy-i18n infer=\"\" key=\"create_button_text\"></foxy-i18n>\n              </vaadin-button>\n            `}\n      </foxy-pagination>\n    `;\n  }\n\n  private get __dialog() {\n    return this.renderRoot.querySelector('#form') as FormDialog;\n  }\n\n  private get __cardRenderer() {\n    const item = this.item;\n\n    if (this.__cachedCardRenderer?.item !== item) {\n      this.__cachedCardRenderer = {\n        item: item,\n        render:\n          typeof item === 'string'\n            ? (new Function(\n                'ctx',\n                `return ctx.html\\`<${item} related=\\${JSON.stringify(ctx.related)} parent=\\${ctx.parent} style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\" infer href=\\${ctx.href}></${item}>\\``\n              ) as ItemRenderer)\n            : ctx => html`\n                <div style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\">\n                  ${item?.(ctx)}\n                </div>\n              `,\n      };\n    }\n\n    return this.__cachedCardRenderer.render;\n  }\n}\n"]}

package/dist/elements/public/CustomerPortal/InternalCustomerPortalChangePassword.js

@@ -73,7 +73,7 @@ export class InternalCustomerPortalChangePassword extends Base {
         readonlycontrols=${readonlyControls.join(' ')}
         hiddencontrols=${hiddenControls.join(' ')}
         parent=${this.session}
-        class="mt-s sm-w-narrow-modal"
+        class="mt-s"
         lang=${ctx.dialog.lang}
         ns=${ctx.dialog.ns}
         @update=${(evt) => this.__handleSignInFormUpdate(evt, ctx)}
@@ -116,6 +116,7 @@ export class InternalCustomerPortalChangePassword extends Base {
         ns=${this.ns}
         alert
         id="dialog"
+        keep-open-on-post
         .form=${this.__renderSignInForm}
       >
       </foxy-form-dialog>

package/dist/elements/public/CustomerPortal/InternalCustomerPortalChangePassword.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalCustomerPortalChangePassword.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomerPortal/InternalCustomerPortalChangePassword.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormRenderer, FormRendererContext } from '../FormDialog/types';\nimport { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { API } from '../NucleonElement/API';\nimport { ButtonElement } from '@vaadin/vaadin-button';\nimport { FormDialog } from '../FormDialog/FormDialog';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { SignInForm } from '../SignInForm/SignInForm';\nimport { Data as SignInFormData } from '../SignInForm/types';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\nconst enum Steps {\n  CurrentPassword = 1,\n  NewPassword = 2,\n  Done = 3,\n}\n\nconst Base = ResponsiveMixin(ThemeableMixin(TranslatableMixin(InferrableMixin(LitElement))));\n\ntype UpdateEvent = InstanceType<typeof SignInForm.UpdateEvent>;\ntype FetchEvent = InstanceType<typeof SignInForm.API.FetchEvent>;\n\nexport class InternalCustomerPortalChangePassword extends Base {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      isErrorVisible: { attribute: false },\n      disabled: { type: Boolean },\n      customer: { type: String },\n      session: { type: String },\n      email: { type: String },\n      step: { attribute: false },\n      fail: { attribute: false },\n    };\n  }\n\n  isErrorVisible = false;\n\n  disabled = false;\n\n  customer = '';\n\n  session = '';\n\n  email = '';\n\n  step = Steps.CurrentPassword;\n\n  private readonly __handleTriggerClick = (evt: CustomEvent<void>) => {\n    const button = evt.currentTarget as ButtonElement;\n    const dialog = this.renderRoot.querySelector('#dialog') as FormDialog;\n\n    this.isErrorVisible = false;\n    this.step = Steps.CurrentPassword;\n\n    dialog.show(button);\n  };\n\n  private readonly __handleSignInFormUpdate = (evt: UpdateEvent, ctx: FormRendererContext) => {\n    ctx.handleUpdate(evt);\n\n    const target = evt.currentTarget as SignInForm;\n    if (target.form.credential?.email || !this.email) return;\n\n    target.edit({\n      type: target.form.type ?? 'password',\n      credential: {\n        email: this.email,\n        password: target.form.credential?.password ?? '',\n      },\n    });\n  };\n\n  private readonly __handleSignInFormFetch = (evt: FetchEvent) => {\n    if (evt.defaultPrevented) return;\n    if (evt.request.method !== 'POST') return;\n    if (evt.request.url !== this.session) return;\n\n    evt.preventDefault();\n    evt.stopImmediatePropagation();\n    evt.respondWith(this.__getResponse(evt.request));\n  };\n\n  private readonly __renderSignInForm: FormRenderer = ctx => {\n    const readonlyControls: string[] = [];\n    const hiddenControls: string[] = ['email'];\n\n    let background = 'bg-primary-10';\n    let foreground = 'text-primary';\n    let icon = 'icons:lock-outline';\n    let slot = 'password:before';\n\n    if (this.step === Steps.NewPassword) {\n      hiddenControls.push('password');\n      slot = 'new-password:before';\n      icon = 'icons:lock-open';\n    }\n\n    if (this.step === Steps.Done) {\n      readonlyControls.push('new-password');\n      hiddenControls.push('password', 'submit');\n      background = 'bg-success-10';\n      foreground = 'text-success';\n      slot = 'new-password:before';\n      icon = 'icons:done-all';\n    }\n\n    if (!this.isErrorVisible) hiddenControls.push('error');\n\n    return html`\n      <foxy-sign-in-form\n        readonlycontrols=${readonlyControls.join(' ')}\n        hiddencontrols=${hiddenControls.join(' ')}\n        parent=${this.session}\n        class=\"mt-s sm-w-narrow-modal\"\n        lang=${ctx.dialog.lang}\n        ns=${ctx.dialog.ns}\n        @update=${(evt: UpdateEvent) => this.__handleSignInFormUpdate(evt, ctx)}\n        @fetch=${this.__handleSignInFormFetch}\n      >\n        <div class=\"mx-auto flex mb-m w-l h-l rounded-t-l rounded-b-l ${background}\" slot=${slot}>\n          <iron-icon icon=${icon} class=\"m-auto ${foreground}\"></iron-icon>\n        </div>\n\n        <foxy-i18n\n          class=\"block text-center text-m text-secondary leading-m mb-m\"\n          lang=${ctx.dialog.lang}\n          slot=${slot}\n          key=\"change_password_step_${this.step}\"\n          ns=${ctx.dialog.ns}\n        >\n        </foxy-i18n>\n      </foxy-sign-in-form>\n    `;\n  };\n\n  render(): TemplateResult {\n    return html`\n      <foxy-form-dialog\n        hiddencontrols=\"save-button\"\n        header=\"change_password\"\n        lang=${this.lang}\n        ns=${this.ns}\n        alert\n        id=\"dialog\"\n        .form=${this.__renderSignInForm}\n      >\n      </foxy-form-dialog>\n\n      <vaadin-button class=\"w-full\" ?disabled=${this.disabled} @click=${this.__handleTriggerClick}>\n        <foxy-i18n lang=${this.lang} key=\"change_password\" ns=${this.ns}></foxy-i18n>\n      </vaadin-button>\n    `;\n  }\n\n  private async __getResponse(request: Request): Promise<Response> {\n    const json = (await request.clone().json()) as SignInFormData;\n    const api = new API(this);\n\n    this.isErrorVisible = false;\n\n    if (this.step === Steps.CurrentPassword) {\n      const response = await api.fetch(request.url, {\n        method: request.method,\n        body: JSON.stringify(json),\n      });\n\n      if (response.ok) {\n        this.step = Steps.NewPassword;\n        const body = { _embedded: { 'fx:errors': [{ code: 'new_password_required_error' }] } };\n        return new API.WHATWGResponse(JSON.stringify(body), { status: 400 });\n      } else {\n        this.isErrorVisible = true;\n        return response;\n      }\n    }\n\n    if (this.step === Steps.NewPassword) {\n      const response = await api.fetch(this.customer, {\n        method: 'PATCH',\n        body: JSON.stringify({\n          password: json.credential.new_password,\n          password_old: json.credential.password,\n        }),\n      });\n\n      if (response.ok) {\n        this.step = Steps.Done;\n        json._links = { self: { href: request.url } };\n        return new API.WHATWGResponse(JSON.stringify(json));\n      } else {\n        this.isErrorVisible = true;\n        return response;\n      }\n    }\n\n    return api.fetch(request);\n  }\n}\n"]}
+{"version":3,"file":"InternalCustomerPortalChangePassword.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomerPortal/InternalCustomerPortalChangePassword.ts"],"names":[],"mappings":"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","sourcesContent":["import { FormRenderer, FormRendererContext } from '../FormDialog/types';\nimport { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { API } from '../NucleonElement/API';\nimport { ButtonElement } from '@vaadin/vaadin-button';\nimport { FormDialog } from '../FormDialog/FormDialog';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { SignInForm } from '../SignInForm/SignInForm';\nimport { Data as SignInFormData } from '../SignInForm/types';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\nconst enum Steps {\n  CurrentPassword = 1,\n  NewPassword = 2,\n  Done = 3,\n}\n\nconst Base = ResponsiveMixin(ThemeableMixin(TranslatableMixin(InferrableMixin(LitElement))));\n\ntype UpdateEvent = InstanceType<typeof SignInForm.UpdateEvent>;\ntype FetchEvent = InstanceType<typeof SignInForm.API.FetchEvent>;\n\nexport class InternalCustomerPortalChangePassword extends Base {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      isErrorVisible: { attribute: false },\n      disabled: { type: Boolean },\n      customer: { type: String },\n      session: { type: String },\n      email: { type: String },\n      step: { attribute: false },\n      fail: { attribute: false },\n    };\n  }\n\n  isErrorVisible = false;\n\n  disabled = false;\n\n  customer = '';\n\n  session = '';\n\n  email = '';\n\n  step = Steps.CurrentPassword;\n\n  private readonly __handleTriggerClick = (evt: CustomEvent<void>) => {\n    const button = evt.currentTarget as ButtonElement;\n    const dialog = this.renderRoot.querySelector('#dialog') as FormDialog;\n\n    this.isErrorVisible = false;\n    this.step = Steps.CurrentPassword;\n\n    dialog.show(button);\n  };\n\n  private readonly __handleSignInFormUpdate = (evt: UpdateEvent, ctx: FormRendererContext) => {\n    ctx.handleUpdate(evt);\n\n    const target = evt.currentTarget as SignInForm;\n    if (target.form.credential?.email || !this.email) return;\n\n    target.edit({\n      type: target.form.type ?? 'password',\n      credential: {\n        email: this.email,\n        password: target.form.credential?.password ?? '',\n      },\n    });\n  };\n\n  private readonly __handleSignInFormFetch = (evt: FetchEvent) => {\n    if (evt.defaultPrevented) return;\n    if (evt.request.method !== 'POST') return;\n    if (evt.request.url !== this.session) return;\n\n    evt.preventDefault();\n    evt.stopImmediatePropagation();\n    evt.respondWith(this.__getResponse(evt.request));\n  };\n\n  private readonly __renderSignInForm: FormRenderer = ctx => {\n    const readonlyControls: string[] = [];\n    const hiddenControls: string[] = ['email'];\n\n    let background = 'bg-primary-10';\n    let foreground = 'text-primary';\n    let icon = 'icons:lock-outline';\n    let slot = 'password:before';\n\n    if (this.step === Steps.NewPassword) {\n      hiddenControls.push('password');\n      slot = 'new-password:before';\n      icon = 'icons:lock-open';\n    }\n\n    if (this.step === Steps.Done) {\n      readonlyControls.push('new-password');\n      hiddenControls.push('password', 'submit');\n      background = 'bg-success-10';\n      foreground = 'text-success';\n      slot = 'new-password:before';\n      icon = 'icons:done-all';\n    }\n\n    if (!this.isErrorVisible) hiddenControls.push('error');\n\n    return html`\n      <foxy-sign-in-form\n        readonlycontrols=${readonlyControls.join(' ')}\n        hiddencontrols=${hiddenControls.join(' ')}\n        parent=${this.session}\n        class=\"mt-s\"\n        lang=${ctx.dialog.lang}\n        ns=${ctx.dialog.ns}\n        @update=${(evt: UpdateEvent) => this.__handleSignInFormUpdate(evt, ctx)}\n        @fetch=${this.__handleSignInFormFetch}\n      >\n        <div class=\"mx-auto flex mb-m w-l h-l rounded-t-l rounded-b-l ${background}\" slot=${slot}>\n          <iron-icon icon=${icon} class=\"m-auto ${foreground}\"></iron-icon>\n        </div>\n\n        <foxy-i18n\n          class=\"block text-center text-m text-secondary leading-m mb-m\"\n          lang=${ctx.dialog.lang}\n          slot=${slot}\n          key=\"change_password_step_${this.step}\"\n          ns=${ctx.dialog.ns}\n        >\n        </foxy-i18n>\n      </foxy-sign-in-form>\n    `;\n  };\n\n  render(): TemplateResult {\n    return html`\n      <foxy-form-dialog\n        hiddencontrols=\"save-button\"\n        header=\"change_password\"\n        lang=${this.lang}\n        ns=${this.ns}\n        alert\n        id=\"dialog\"\n        keep-open-on-post\n        .form=${this.__renderSignInForm}\n      >\n      </foxy-form-dialog>\n\n      <vaadin-button class=\"w-full\" ?disabled=${this.disabled} @click=${this.__handleTriggerClick}>\n        <foxy-i18n lang=${this.lang} key=\"change_password\" ns=${this.ns}></foxy-i18n>\n      </vaadin-button>\n    `;\n  }\n\n  private async __getResponse(request: Request): Promise<Response> {\n    const json = (await request.clone().json()) as SignInFormData;\n    const api = new API(this);\n\n    this.isErrorVisible = false;\n\n    if (this.step === Steps.CurrentPassword) {\n      const response = await api.fetch(request.url, {\n        method: request.method,\n        body: JSON.stringify(json),\n      });\n\n      if (response.ok) {\n        this.step = Steps.NewPassword;\n        const body = { _embedded: { 'fx:errors': [{ code: 'new_password_required_error' }] } };\n        return new API.WHATWGResponse(JSON.stringify(body), { status: 400 });\n      } else {\n        this.isErrorVisible = true;\n        return response;\n      }\n    }\n\n    if (this.step === Steps.NewPassword) {\n      const response = await api.fetch(this.customer, {\n        method: 'PATCH',\n        body: JSON.stringify({\n          password: json.credential.new_password,\n          password_old: json.credential.password,\n        }),\n      });\n\n      if (response.ok) {\n        this.step = Steps.Done;\n        json._links = { self: { href: request.url } };\n        return new API.WHATWGResponse(JSON.stringify(json));\n      } else {\n        this.isErrorVisible = true;\n        return response;\n      }\n    }\n\n    return api.fetch(request);\n  }\n}\n"]}

package/dist/elements/public/ItemForm/ItemForm.js

@@ -82,6 +82,22 @@ export class ItemForm extends TranslatableMixin(InternalForm, 'item-form') {
       </div>
 
       <foxy-internal-item-form-subscription-control></foxy-internal-item-form-subscription-control>
+
+      ${this.data
+            ? html `
+            <foxy-internal-async-details-control
+              infer="item-options"
+              first=${this.data._links['fx:item_options'].href}
+              limit="5"
+              form="foxy-item-option-form"
+              item="foxy-item-option-card"
+              .related=${this.__itemOptionRelatedUrls}
+              .props=${{ 'locale-codes': (_a = this.localeCodes) !== null && _a !== void 0 ? _a : '' }}
+            >
+            </foxy-internal-async-details-control>
+          `
+            : ''}
+
       <foxy-internal-item-form-line-item-discount-control></foxy-internal-item-form-line-item-discount-control>
       <foxy-internal-item-form-cart-control></foxy-internal-item-form-cart-control>
       <foxy-internal-item-form-shipping-control></foxy-internal-item-form-shipping-control>
@@ -113,17 +129,6 @@ export class ItemForm extends TranslatableMixin(InternalForm, 'item-form') {
               form="foxy-attribute-form"
             >
             </foxy-internal-async-details-control>
-
-            <foxy-internal-async-details-control
-              infer="item-options"
-              first=${this.data._links['fx:item_options'].href}
-              limit="5"
-              form="foxy-item-option-form"
-              item="foxy-item-option-card"
-              .related=${this.__itemOptionRelatedUrls}
-              .props=${{ 'locale-codes': (_a = this.localeCodes) !== null && _a !== void 0 ? _a : '' }}
-            >
-            </foxy-internal-async-details-control>
           `
             : ''}
       ${super.renderBody()}

package/dist/elements/public/ItemForm/ItemForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ItemForm.js","sourceRoot":"","sources":["../../../../src/elements/public/ItemForm/ItemForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { html } from 'lit-html';\n\n/**\n * Form element for creating or editing items (`fx:item`).\n *\n * @slot name:before\n * @slot name:after\n *\n * @slot price:before\n * @slot price:after\n *\n * @slot quantity:before\n * @slot quantity:after\n *\n * @slot subscription:before\n * @slot subscription:after\n *\n * @slot line-item-discount:before\n * @slot line-item-discount:after\n *\n * @slot cart:before\n * @slot cart:after\n *\n * @slot shipping:before\n * @slot shipping:after\n *\n * @slot inventory:before\n * @slot inventory:after\n *\n * @slot timestamps:before\n * @slot timestamps:after\n *\n * @slot delete:before\n * @slot delete:after\n *\n * @slot create:before\n * @slot create:after\n *\n * @element foxy-item-form\n * @since 1.17.0\n */\nexport class ItemForm extends TranslatableMixin(InternalForm, 'item-form')<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      customerAddresses: { type: String, attribute: 'customer-addresses' },\n      itemCategories: { type: String, attribute: 'item-categories' },\n      localeCodes: { attribute: 'locale-codes' },\n      coupons: { type: String },\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ name: v }) => !!v || 'name:v8n_required',\n      ({ name: v }) => (!!v && v.length <= 255) || 'name:v8n_too_long',\n      ({ price: v }) => (typeof v === 'number' && !isNaN(v)) || 'price:v8n_required',\n      ({ price: v }) => (typeof v === 'number' && v >= 0) || 'price:v8n_negative',\n      ({ quantity: v }) => (typeof v === 'number' && v >= 1) || 'quantity:v8n_less_than_one',\n    ];\n  }\n\n  /** Link to the collection of customer addresses that can be used with this item. */\n  customerAddresses: string | null = null;\n\n  /** Link to the collection of item categories that can be used with this item. */\n  itemCategories: string | null = null;\n\n  /** Link to the `fx:locale_codes` property helper for currency formatting. */\n  localeCodes: string | null = null;\n\n  /** Link to the collection of coupons that can be used with this item. */\n  coupons: string | null = null;\n\n  private __itemsLink = '';\n\n  renderBody(): TemplateResult {\n    return html`\n      <foxy-internal-text-control infer=\"name\"></foxy-internal-text-control>\n\n      <div class=\"grid grid-cols-2 gap-m\">\n        <foxy-internal-number-control infer=\"price\"></foxy-internal-number-control>\n        <foxy-internal-integer-control infer=\"quantity\"></foxy-internal-integer-control>\n      </div>\n\n      <foxy-internal-item-form-subscription-control></foxy-internal-item-form-subscription-control>\n      <foxy-internal-item-form-line-item-discount-control></foxy-internal-item-form-line-item-discount-control>\n      <foxy-internal-item-form-cart-control></foxy-internal-item-form-cart-control>\n      <foxy-internal-item-form-shipping-control></foxy-internal-item-form-shipping-control>\n      <foxy-internal-item-form-inventory-control></foxy-internal-item-form-inventory-control>\n\n      ${this.data\n        ? html`\n            <foxy-internal-async-details-control\n              infer=\"discount-details\"\n              first=${this.data._links['fx:discount_details'].href}\n              limit=\"5\"\n              item=\"foxy-discount-detail-card\"\n            >\n            </foxy-internal-async-details-control>\n\n            <foxy-internal-async-details-control\n              infer=\"coupon-details\"\n              first=${this.data._links['fx:coupon_details'].href}\n              limit=\"5\"\n              item=\"foxy-coupon-detail-card\"\n            >\n            </foxy-internal-async-details-control>\n\n            <foxy-internal-async-details-control\n              infer=\"attributes\"\n              first=${this.data._links['fx:attributes'].href}\n              limit=\"5\"\n              item=\"foxy-attribute-card\"\n              form=\"foxy-attribute-form\"\n            >\n            </foxy-internal-async-details-control>\n\n            <foxy-internal-async-details-control\n              infer=\"item-options\"\n              first=${this.data._links['fx:item_options'].href}\n              limit=\"5\"\n              form=\"foxy-item-option-form\"\n              item=\"foxy-item-option-card\"\n              .related=${this.__itemOptionRelatedUrls}\n              .props=${{ 'locale-codes': this.localeCodes ?? '' }}\n            >\n            </foxy-internal-async-details-control>\n          `\n        : ''}\n      ${super.renderBody()}\n    `;\n  }\n\n  protected async _sendGet(): Promise<Data> {\n    type TransactionTemplate = Resource<Rels.TransactionTemplate>;\n    type Subscription = Resource<Rels.Subscription>;\n    type Transaction = Resource<Rels.Transaction>;\n    type Cart = Resource<Rels.Cart>;\n\n    const item = await super._sendGet();\n\n    if (item._links['fx:subscription']) {\n      const subscriptionHref = item._links['fx:subscription'].href;\n      const subscription = await super._fetch<Subscription>(subscriptionHref);\n\n      const transactionTemplateHref = subscription._links['fx:transaction_template'].href;\n      const transactionTemplate = await super._fetch<TransactionTemplate>(transactionTemplateHref);\n\n      this.__itemsLink = transactionTemplate._links['fx:items'].href;\n      return item;\n    }\n\n    if (item._links['fx:transaction']) {\n      const transaction = await super._fetch<Transaction>(item._links['fx:transaction'].href);\n      this.__itemsLink = transaction._links['fx:items'].href;\n      return item;\n    }\n\n    if (item._links['fx:cart']) {\n      const cart = await super._fetch<Cart>(item._links['fx:cart'].href);\n      this.__itemsLink = cart._links['fx:items'].href;\n      return item;\n    }\n\n    return item;\n  }\n\n  private get __itemOptionRelatedUrls() {\n    const links = (this.data?._links ?? {}) as Record<string, { href: string }>;\n    const urls: string[] = [];\n\n    if (links['fx:subscription']) urls.push(links['fx:subscription'].href);\n    if (links['fx:transaction']) urls.push(links['fx:transaction'].href);\n    if (links['fx:shipment']) urls.push(links['fx:shipment'].href);\n    if (links['fx:cart']) urls.push(links['fx:cart'].href);\n    if (this.__itemsLink) urls.push(this.__itemsLink);\n\n    return urls;\n  }\n}\n"]}
+{"version":3,"file":"ItemForm.js","sourceRoot":"","sources":["../../../../src/elements/public/ItemForm/ItemForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { html } from 'lit-html';\n\n/**\n * Form element for creating or editing items (`fx:item`).\n *\n * @slot name:before\n * @slot name:after\n *\n * @slot price:before\n * @slot price:after\n *\n * @slot quantity:before\n * @slot quantity:after\n *\n * @slot subscription:before\n * @slot subscription:after\n *\n * @slot line-item-discount:before\n * @slot line-item-discount:after\n *\n * @slot cart:before\n * @slot cart:after\n *\n * @slot shipping:before\n * @slot shipping:after\n *\n * @slot inventory:before\n * @slot inventory:after\n *\n * @slot timestamps:before\n * @slot timestamps:after\n *\n * @slot delete:before\n * @slot delete:after\n *\n * @slot create:before\n * @slot create:after\n *\n * @element foxy-item-form\n * @since 1.17.0\n */\nexport class ItemForm extends TranslatableMixin(InternalForm, 'item-form')<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      customerAddresses: { type: String, attribute: 'customer-addresses' },\n      itemCategories: { type: String, attribute: 'item-categories' },\n      localeCodes: { attribute: 'locale-codes' },\n      coupons: { type: String },\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ name: v }) => !!v || 'name:v8n_required',\n      ({ name: v }) => (!!v && v.length <= 255) || 'name:v8n_too_long',\n      ({ price: v }) => (typeof v === 'number' && !isNaN(v)) || 'price:v8n_required',\n      ({ price: v }) => (typeof v === 'number' && v >= 0) || 'price:v8n_negative',\n      ({ quantity: v }) => (typeof v === 'number' && v >= 1) || 'quantity:v8n_less_than_one',\n    ];\n  }\n\n  /** Link to the collection of customer addresses that can be used with this item. */\n  customerAddresses: string | null = null;\n\n  /** Link to the collection of item categories that can be used with this item. */\n  itemCategories: string | null = null;\n\n  /** Link to the `fx:locale_codes` property helper for currency formatting. */\n  localeCodes: string | null = null;\n\n  /** Link to the collection of coupons that can be used with this item. */\n  coupons: string | null = null;\n\n  private __itemsLink = '';\n\n  renderBody(): TemplateResult {\n    return html`\n      <foxy-internal-text-control infer=\"name\"></foxy-internal-text-control>\n\n      <div class=\"grid grid-cols-2 gap-m\">\n        <foxy-internal-number-control infer=\"price\"></foxy-internal-number-control>\n        <foxy-internal-integer-control infer=\"quantity\"></foxy-internal-integer-control>\n      </div>\n\n      <foxy-internal-item-form-subscription-control></foxy-internal-item-form-subscription-control>\n\n      ${this.data\n        ? html`\n            <foxy-internal-async-details-control\n              infer=\"item-options\"\n              first=${this.data._links['fx:item_options'].href}\n              limit=\"5\"\n              form=\"foxy-item-option-form\"\n              item=\"foxy-item-option-card\"\n              .related=${this.__itemOptionRelatedUrls}\n              .props=${{ 'locale-codes': this.localeCodes ?? '' }}\n            >\n            </foxy-internal-async-details-control>\n          `\n        : ''}\n\n      <foxy-internal-item-form-line-item-discount-control></foxy-internal-item-form-line-item-discount-control>\n      <foxy-internal-item-form-cart-control></foxy-internal-item-form-cart-control>\n      <foxy-internal-item-form-shipping-control></foxy-internal-item-form-shipping-control>\n      <foxy-internal-item-form-inventory-control></foxy-internal-item-form-inventory-control>\n\n      ${this.data\n        ? html`\n            <foxy-internal-async-details-control\n              infer=\"discount-details\"\n              first=${this.data._links['fx:discount_details'].href}\n              limit=\"5\"\n              item=\"foxy-discount-detail-card\"\n            >\n            </foxy-internal-async-details-control>\n\n            <foxy-internal-async-details-control\n              infer=\"coupon-details\"\n              first=${this.data._links['fx:coupon_details'].href}\n              limit=\"5\"\n              item=\"foxy-coupon-detail-card\"\n            >\n            </foxy-internal-async-details-control>\n\n            <foxy-internal-async-details-control\n              infer=\"attributes\"\n              first=${this.data._links['fx:attributes'].href}\n              limit=\"5\"\n              item=\"foxy-attribute-card\"\n              form=\"foxy-attribute-form\"\n            >\n            </foxy-internal-async-details-control>\n          `\n        : ''}\n      ${super.renderBody()}\n    `;\n  }\n\n  protected async _sendGet(): Promise<Data> {\n    type TransactionTemplate = Resource<Rels.TransactionTemplate>;\n    type Subscription = Resource<Rels.Subscription>;\n    type Transaction = Resource<Rels.Transaction>;\n    type Cart = Resource<Rels.Cart>;\n\n    const item = await super._sendGet();\n\n    if (item._links['fx:subscription']) {\n      const subscriptionHref = item._links['fx:subscription'].href;\n      const subscription = await super._fetch<Subscription>(subscriptionHref);\n\n      const transactionTemplateHref = subscription._links['fx:transaction_template'].href;\n      const transactionTemplate = await super._fetch<TransactionTemplate>(transactionTemplateHref);\n\n      this.__itemsLink = transactionTemplate._links['fx:items'].href;\n      return item;\n    }\n\n    if (item._links['fx:transaction']) {\n      const transaction = await super._fetch<Transaction>(item._links['fx:transaction'].href);\n      this.__itemsLink = transaction._links['fx:items'].href;\n      return item;\n    }\n\n    if (item._links['fx:cart']) {\n      const cart = await super._fetch<Cart>(item._links['fx:cart'].href);\n      this.__itemsLink = cart._links['fx:items'].href;\n      return item;\n    }\n\n    return item;\n  }\n\n  private get __itemOptionRelatedUrls() {\n    const links = (this.data?._links ?? {}) as Record<string, { href: string }>;\n    const urls: string[] = [];\n\n    if (links['fx:subscription']) urls.push(links['fx:subscription'].href);\n    if (links['fx:transaction']) urls.push(links['fx:transaction'].href);\n    if (links['fx:shipment']) urls.push(links['fx:shipment'].href);\n    if (links['fx:cart']) urls.push(links['fx:cart'].href);\n    if (this.__itemsLink) urls.push(this.__itemsLink);\n\n    return urls;\n  }\n}\n"]}

package/dist/mixins/themeable.js

@@ -2420,10 +2420,6 @@ input::-webkit-date-and-time-value{
 :host([sm]) .sm-max-w-modal-wide{
   max-width:50rem;
 }
-
-:host([sm]) .sm-w-narrow-modal{
-  width:18rem;
-}
         `,
             ];
         }

package/dist/mixins/themeable.js.map

@@ -1 +1 @@
-{"version":3,"file":"themeable.js","sourceRoot":"","sources":["../../src/mixins/themeable.ts"],"names":[],"mappings":"AAAA,sEAAsE;AAEtE,OAAO,EAA0C,UAAU,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAEtF,OAAO,EAAE,eAAe,EAAE,wBAAqB;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,+CAA+C,CAAC;AAI/E,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,WAAkB,EACkB,EAAE;IACtC,OAAO,MAAM,gBAAiB,SAAQ,WAAW;QAC/C,MAAM,KAAK,MAAM;YACf,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC;YAEjC,OAAO;gBACL,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;gBAClF,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SA2IF;aACF,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CACZ,yBAAyB,EACzB,GAAG;;;;;;;;GASF,CACF,CAAC;AAEF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;GAOF,CACF,CAAC;AAEF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;GAOF,CACF,CAAC;AAEF,cAAc,CACZ,eAAe,EACf,GAAG;;;GAIF,CACF,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,OAAgB,SAAU,SAAQ,mBAAmB,CACzD,eAAe,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAC5C;CAAG","sourcesContent":["/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n\nimport { CSSResult, CSSResultArray, Constructor, LitElement, css } from 'lit-element';\n\nimport { ResponsiveMixin } from './responsive';\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { registerStyles } from '@vaadin/vaadin-themable-mixin/register-styles';\n\ntype Base = Constructor<LitElement> & { styles?: CSSResult | CSSResultArray | CSSStyleSheet };\n\nexport const ThemeableMixin = <TBase extends Base>(\n  BaseElement: TBase\n): TBase & { styles: CSSResultArray } => {\n  return class ThemeableElement extends BaseElement {\n    static get styles(): CSSResultArray {\n      const originalCSS = super.styles;\n\n      return [\n        ...(originalCSS ? (Array.isArray(originalCSS) ? originalCSS : [originalCSS]) : []),\n        css`\n          @tailwind base;\n\n          * {\n            -webkit-tap-highlight-color: transparent;\n            -webkit-font-smoothing: antialiased;\n            -moz-osx-font-smoothing: grayscale;\n          }\n\n          :host {\n            display: block;\n            color: var(--lumo-body-text-color);\n            line-height: var(--lumo-line-height-m);\n            font: normal var(--lumo-font-size-m) var(--lumo-font-family);\n          }\n\n          details > summary::-webkit-details-marker {\n            display: none;\n          }\n\n          details > summary {\n            list-style: none;\n          }\n\n          vaadin-select {\n            margin-top: -4px;\n            margin-bottom: -4px;\n          }\n\n          vaadin-text-area,\n          vaadin-text-field,\n          vaadin-date-picker,\n          vaadin-email-field,\n          vaadin-number-field,\n          vaadin-custom-field,\n          vaadin-integer-field,\n          vaadin-password-field,\n          vaadin-checkbox-group,\n          vaadin-radio-group,\n          vaadin-combo-box::part(text-field),\n          vaadin-date-picker::part(text-field) {\n            padding-top: 0;\n            padding-bottom: 0;\n          }\n\n          vaadin-text-area::part(label),\n          vaadin-text-field::part(label),\n          vaadin-date-picker::part(label),\n          vaadin-email-field::part(label),\n          vaadin-number-field::part(label),\n          vaadin-custom-field::part(label),\n          vaadin-integer-field::part(label),\n          vaadin-password-field::part(label),\n          vaadin-checkbox-group::part(label),\n          vaadin-radio-group::part(label),\n          vaadin-combo-box::part(label),\n          vaadin-date-picker::part(label) {\n            margin-left: 0;\n          }\n\n          vaadin-time-picker,\n          vaadin-date-time-picker {\n            width: 100%;\n          }\n\n          vaadin-button,\n          vaadin-checkbox::part(checkbox) {\n            margin: 0;\n          }\n\n          vaadin-checkbox::part(label) {\n            margin: 0.1875em var(--lumo-space-m);\n          }\n\n          .appearance-none {\n            -webkit-appearance: none;\n            -moz-appearance: none;\n            appearance: none;\n          }\n\n          .appearance-none::-webkit-calendar-picker-indicator,\n          .appearance-none::-webkit-outer-spin-button,\n          .appearance-none::-webkit-inner-spin-button,\n          .appearance-none::-webkit-list-button {\n            opacity: 0 !important;\n            width: 0 !important;\n            margin: 0 !important;\n            padding: 0 !important;\n          }\n\n          input::-webkit-date-and-time-value {\n            text-align: inherit !important;\n          }\n\n          @tailwind components;\n\n          @tailwind utilities;\n\n          @layer utilities {\n            .border-radius-overflow-fix {\n              -webkit-mask-image: -webkit-radial-gradient(white, black);\n            }\n\n            @variants sm, md, lg, xl {\n              .grid-rows-auto {\n                grid-auto-rows: 1fr;\n              }\n\n              .icon-inline {\n                --iron-icon-height: 1em;\n                --iron-icon-width: 1em;\n              }\n\n              .bg-blurred {\n                backdrop-filter: blur(25px);\n                background: var(--lumo-tint-80pct);\n              }\n\n              .max-w-modal {\n                max-width: 28rem;\n              }\n\n              .max-w-modal-wide {\n                max-width: 50rem;\n              }\n\n              .w-narrow-modal {\n                width: 18rem;\n              }\n\n              .snap-x-mandatory {\n                scroll-snap-type: x mandatory;\n              }\n\n              .snap-start {\n                scroll-snap-align: start;\n              }\n            }\n          }\n        `,\n      ];\n    }\n  };\n};\n\nregisterStyles(\n  'vaadin-date-time-picker',\n  css`\n    vaadin-date-time-picker-custom-field {\n      --lumo-text-field-size: auto;\n      padding: 0;\n    }\n\n    vaadin-date-time-picker-custom-field::part(label) {\n      padding-bottom: 0.5em;\n    }\n  `\n);\n\nregisterStyles(\n  'vaadin-date-time-picker-date-picker',\n  css`\n    :host {\n      --lumo-text-field-size: auto;\n    }\n    vaadin-date-time-picker-date-text-field {\n      padding: 0;\n    }\n  `\n);\n\nregisterStyles(\n  'vaadin-date-time-picker-time-picker',\n  css`\n    :host {\n      --lumo-text-field-size: auto;\n    }\n    vaadin-date-time-picker-time-text-field {\n      padding: 0;\n    }\n  `\n);\n\nregisterStyles(\n  'vaadin-button',\n  css`\n    :host([theme~='primary']) {\n      font-weight: 500;\n    }\n  `\n);\n\n/**\n * One of the base classes for each rel-specific element in the collection\n * providing shared TailwindCSS styles for Shadow DOM content.\n * This class MUST NOT be used on its own (hence the `abstract` keyword) or\n * referenced externally (outside of the package).\n *\n * @deprecated\n */\nexport abstract class Themeable extends ScopedElementsMixin(\n  ResponsiveMixin(ThemeableMixin(LitElement))\n) {}\n"]}
+{"version":3,"file":"themeable.js","sourceRoot":"","sources":["../../src/mixins/themeable.ts"],"names":[],"mappings":"AAAA,sEAAsE;AAEtE,OAAO,EAA0C,UAAU,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAEtF,OAAO,EAAE,eAAe,EAAE,wBAAqB;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,+CAA+C,CAAC;AAI/E,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,WAAkB,EACkB,EAAE;IACtC,OAAO,MAAM,gBAAiB,SAAQ,WAAW;QAC/C,MAAM,KAAK,MAAM;YACf,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC;YAEjC,OAAO;gBACL,GAAG,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;gBAClF,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SA2IF;aACF,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CACZ,yBAAyB,EACzB,GAAG;;;;;;;;GASF,CACF,CAAC;AAEF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;GAOF,CACF,CAAC;AAEF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;GAOF,CACF,CAAC;AAEF,cAAc,CACZ,eAAe,EACf,GAAG;;;GAIF,CACF,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,OAAgB,SAAU,SAAQ,mBAAmB,CACzD,eAAe,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAC5C;CAAG","sourcesContent":["/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n\nimport { CSSResult, CSSResultArray, Constructor, LitElement, css } from 'lit-element';\n\nimport { ResponsiveMixin } from './responsive';\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { registerStyles } from '@vaadin/vaadin-themable-mixin/register-styles';\n\ntype Base = Constructor<LitElement> & { styles?: CSSResult | CSSResultArray | CSSStyleSheet };\n\nexport const ThemeableMixin = <TBase extends Base>(\n  BaseElement: TBase\n): TBase & { styles: CSSResultArray } => {\n  return class ThemeableElement extends BaseElement {\n    static get styles(): CSSResultArray {\n      const originalCSS = super.styles;\n\n      return [\n        ...(originalCSS ? (Array.isArray(originalCSS) ? originalCSS : [originalCSS]) : []),\n        css`\n          @tailwind base;\n\n          * {\n            -webkit-tap-highlight-color: transparent;\n            -webkit-font-smoothing: antialiased;\n            -moz-osx-font-smoothing: grayscale;\n          }\n\n          :host {\n            display: block;\n            color: var(--lumo-body-text-color);\n            line-height: var(--lumo-line-height-m);\n            font: normal var(--lumo-font-size-m) var(--lumo-font-family);\n          }\n\n          details > summary::-webkit-details-marker {\n            display: none;\n          }\n\n          details > summary {\n            list-style: none;\n          }\n\n          vaadin-select {\n            margin-top: -4px;\n            margin-bottom: -4px;\n          }\n\n          vaadin-text-area,\n          vaadin-text-field,\n          vaadin-date-picker,\n          vaadin-email-field,\n          vaadin-number-field,\n          vaadin-custom-field,\n          vaadin-integer-field,\n          vaadin-password-field,\n          vaadin-checkbox-group,\n          vaadin-radio-group,\n          vaadin-combo-box::part(text-field),\n          vaadin-date-picker::part(text-field) {\n            padding-top: 0;\n            padding-bottom: 0;\n          }\n\n          vaadin-text-area::part(label),\n          vaadin-text-field::part(label),\n          vaadin-date-picker::part(label),\n          vaadin-email-field::part(label),\n          vaadin-number-field::part(label),\n          vaadin-custom-field::part(label),\n          vaadin-integer-field::part(label),\n          vaadin-password-field::part(label),\n          vaadin-checkbox-group::part(label),\n          vaadin-radio-group::part(label),\n          vaadin-combo-box::part(label),\n          vaadin-date-picker::part(label) {\n            margin-left: 0;\n          }\n\n          vaadin-time-picker,\n          vaadin-date-time-picker {\n            width: 100%;\n          }\n\n          vaadin-button,\n          vaadin-checkbox::part(checkbox) {\n            margin: 0;\n          }\n\n          vaadin-checkbox::part(label) {\n            margin: 0.1875em var(--lumo-space-m);\n          }\n\n          .appearance-none {\n            -webkit-appearance: none;\n            -moz-appearance: none;\n            appearance: none;\n          }\n\n          .appearance-none::-webkit-calendar-picker-indicator,\n          .appearance-none::-webkit-outer-spin-button,\n          .appearance-none::-webkit-inner-spin-button,\n          .appearance-none::-webkit-list-button {\n            opacity: 0 !important;\n            width: 0 !important;\n            margin: 0 !important;\n            padding: 0 !important;\n          }\n\n          input::-webkit-date-and-time-value {\n            text-align: inherit !important;\n          }\n\n          @tailwind components;\n\n          @tailwind utilities;\n\n          @layer utilities {\n            .border-radius-overflow-fix {\n              -webkit-mask-image: -webkit-radial-gradient(white, black);\n            }\n\n            @variants sm, md, lg, xl {\n              .grid-rows-auto {\n                grid-auto-rows: 1fr;\n              }\n\n              .icon-inline {\n                --iron-icon-height: 1em;\n                --iron-icon-width: 1em;\n              }\n\n              .bg-blurred {\n                backdrop-filter: blur(25px);\n                background: var(--lumo-tint-80pct);\n              }\n\n              .max-w-modal {\n                max-width: 28rem;\n              }\n\n              .max-w-modal-wide {\n                max-width: 50rem;\n              }\n\n              .w-narrow-modal {\n                width: 18rem;\n              }\n\n              .snap-x-mandatory {\n                scroll-snap-type: x mandatory;\n              }\n\n              .snap-start {\n                scroll-snap-align: start;\n              }\n            }\n          }\n        `,\n      ];\n    }\n  };\n};\n\nregisterStyles(\n  'vaadin-date-time-picker',\n  css`\n    vaadin-date-time-picker-custom-field {\n      --lumo-text-field-size: auto;\n      padding: 0;\n    }\n\n    vaadin-date-time-picker-custom-field::part(label) {\n      padding-bottom: 0.5em;\n    }\n  `\n);\n\nregisterStyles(\n  'vaadin-date-time-picker-date-picker',\n  css`\n    :host {\n      --lumo-text-field-size: auto;\n    }\n    vaadin-date-time-picker-date-text-field {\n      padding: 0;\n    }\n  `\n);\n\nregisterStyles(\n  'vaadin-date-time-picker-time-picker',\n  css`\n    :host {\n      --lumo-text-field-size: auto;\n    }\n    vaadin-date-time-picker-time-text-field {\n      padding: 0;\n    }\n  `\n);\n\nregisterStyles(\n  'vaadin-button',\n  css`\n    :host([theme~='primary']) {\n      font-weight: 500;\n    }\n  `\n);\n\n/**\n * One of the base classes for each rel-specific element in the collection\n * providing shared TailwindCSS styles for Shadow DOM content.\n * This class MUST NOT be used on its own (hence the `abstract` keyword) or\n * referenced externally (outside of the package).\n *\n * @deprecated\n */\nexport abstract class Themeable extends ScopedElementsMixin(\n  ResponsiveMixin(ThemeableMixin(LitElement))\n) {}\n"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@foxy.io/elements",
   "type": "module",
-  "version": "1.22.0",
+  "version": "1.22.1",
   "description": "E-commerce web components by Foxy.",
   "repository": {
     "type": "git",

package/dist/cdn/shared-1a9496d4.js

@@ -1 +0,0 @@
-import{L as s,h as r}from"./shared-7f33a83a.js";import{w as e}from"./shared-e9c81269.js";let t,o=s=>s;class n extends s{static get styles(){return e.styles}render(){return r(t||(t=o` <p class="flex text-s border border-contrast-10 rounded 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(s){const[r,e,t]=s.split("-").map((s=>parseInt(s,10)));return[r,e,t].some((s=>"number"!=typeof s||isNaN(s)))?null:new Date(r,e-1,t)}export{n as W,a as p};

package/dist/cdn/shared-963c4a87.js

@@ -1 +0,0 @@
-import"./shared-c0ec65fa.js";import"./foxy-collection-page.js";import"./foxy-swipe-actions.js";import"./foxy-form-dialog.js";import"./foxy-pagination.js";import"./shared-b137f17a.js";import{I as e}from"./shared-06c64816.js";import"./shared-15c94a90.js";import{_ as t}from"./shared-98755831.js";import{i as r}from"./shared-d3bf9ac0.js";import{c as i}from"./shared-4e709717.js";import{h as a}from"./shared-7f33a83a.js";let o,s,n,l,d,c,h,f,u,m,g,p=e=>e;customElements.define("foxy-internal-async-list-control",class extends e{constructor(){super(...arguments),this.createPageHref=null,this.related=[],this.limit=20,this.first=null,this.form=null,this.item=null,this.wide=!1,this.alert=!1,this.hideDeleteButton=!1,this.hideCreateButton=!1,this.getPageHref=null,this.__deletionConfimationCallback=null,this.__cachedCardRenderer=null,this.__itemRenderer=e=>{var t;if(!e.data)return this.__cardRenderer(e);if("string"!=typeof(null===(t=this.getPageHref)||void 0===t?void 0:t.call(this,e.href,e.data))&&!this.form)return this.__cardRenderer(e);const r=this.disabledSelector.matches("card",!0),d=this.__cardRenderer(e);let c;const h=i({"rounded-t":!e.previous,"rounded-b":!e.next,"focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50":!0,"text-left w-full block transition-colors":!0,"hover-bg-contrast-5":!r});if(this.getPageHref)if(r)c=a(o||(o=p`<div class="${0}">${0}</div>`),h,d);else{const t=this.getPageHref(e.href,e.data);c=a(s||(s=p`<a class="${0}" href="${0}">${0}</a>`),h,t,d)}else{c=a(n||(n=p` <button ?disabled="${0}" class="${0}" @click="${0}">${0}</button> `),r,h,(t=>{const r=t.currentTarget,i=this.__dialog;i.header="header_update",i.href=e.href,i.show(r)}),d)}return this.hideDeleteButton?c:a(l||(l=p` <foxy-swipe-actions class="block"> ${0} <vaadin-button theme="primary error" class="h-full" slot="action" @click="${0}"> <foxy-i18n infer="" key="delete_button_text"></foxy-i18n> </vaadin-button> </foxy-swipe-actions> `),c,(e=>{const t=e.currentTarget;this.renderRoot.querySelector("#confirm").show(t),this.__deletionConfimationCallback=()=>{const e=t.previousElementSibling.querySelector("[href]");null==e||e.delete(),this.__deletionConfimationCallback=null}}))}}static get properties(){return t(t({},super.properties),{},{hideDeleteButton:{type:Boolean,attribute:"hide-delete-button"},hideCreateButton:{type:Boolean,attribute:"hide-create-button"},createPageHref:{attribute:"create-page-href"},getPageHref:{attribute:!1},related:{type:Array},first:{},limit:{type:Number},form:{},item:{},wide:{type:Boolean},alert:{type:Boolean}})}renderControl(){var e,t;let i;try{const t=new URL(null!==(e=this.first)&&void 0!==e?e:"");t.searchParams.set("limit",String(this.limit)),i=t.toString()}catch(e){i=void 0}return a(d||(d=p` ${0} ${0} ${0} <foxy-pagination first="${0}" infer="pagination"> <foxy-collection-page class="mb-s block divide-y divide-contrast-5 rounded overflow-hidden bg-contrast-5" infer="card" .related="${0}" .item="${0}"> </foxy-collection-page> ${0} </foxy-pagination> `),this.form?a(c||(c=p` <foxy-form-dialog parent="${0}" infer="dialog" id="form" ?wide="${0}" ?alert="${0}" .related="${0}" .form="${0}"> </foxy-form-dialog> `),r(null!==(t=this.first)&&void 0!==t?t:void 0),this.wide,this.alert,this.related,this.form):"",this.hideDeleteButton?"":a(h||(h=p` <foxy-internal-confirm-dialog message="delete_message" confirm="delete_confirm" cancel="delete_cancel" header="delete_header" theme="error" infer="" id="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> `),(e=>{var t;e.detail.cancelled||null===(t=this.__deletionConfimationCallback)||void 0===t||t.call(this)})),this.label&&"label"!==this.label?a(f||(f=p`<div class="font-medium text-secondary text-s mb-xs">${0}</div>`),this.label):"",r(i),this.related,this.__itemRenderer,!this.form&&!this.createPageHref||this.readonly||this.hideCreateButton?"":this.createPageHref&&!this.disabled?a(u||(u=p` <a class="mb-s w-full flex items-center justify-center h-m px-m rounded text-m font-medium transition-colors bg-contrast-5 text-success hover-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50" href="${0}"> <foxy-i18n infer="" key="create_button_text"></foxy-i18n> </a> `),this.createPageHref):a(m||(m=p` <vaadin-button class="mb-s w-full" theme="success" ?disabled="${0}" @click="${0}"> <foxy-i18n infer="" key="create_button_text"></foxy-i18n> </vaadin-button> `),this.disabled,(e=>{e.preventDefault(),e.stopPropagation();const t=this.__dialog,r=e.currentTarget;t.header="header_create",t.href="",t.show(r)})))}get __dialog(){return this.renderRoot.querySelector("#form")}get __cardRenderer(){var e;const t=this.item;return(null===(e=this.__cachedCardRenderer)||void 0===e?void 0:e.item)!==t&&(this.__cachedCardRenderer={item:t,render:"string"==typeof t?new Function("ctx",`return ctx.html\`<${t} related=\${JSON.stringify(ctx.related)} parent=\${ctx.parent} style="padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)" infer href=\${ctx.href}></${t}>\``):e=>a(g||(g=p` <div style="padding:calc(.625em + (var(--lumo-border-radius)/ 4) - 1px)"> ${0} </div> `),null==t?void 0:t(e))}),this.__cachedCardRenderer.render}});

package/dist/cdn/shared-cb34d19f.js

@@ -1 +0,0 @@
-import"./foxy-spinner.js";import{I as e}from"./shared-9e04b9c3.js";customElements.define("foxy-internal-card",e);