@foxy.io/elements 1.41.0-beta.2 → 1.41.0-beta.3

package/dist/cdn/{shared-e3421ca1.js → shared-ef4d09da.js}

@@ -1 +1 @@
-import{_ as e}from"./shared-cb58dfcd.js";import{h as t}from"./shared-ba5c42c7.js";import{C as l}from"./shared-5afb584d.js";import"./foxy-nucleon-element.js";import{R as s,T as a,a as i}from"./shared-11351c00.js";import{c as r}from"./shared-4e709717.js";import{N as d}from"./shared-f83207fb.js";let n,o,h,c,m,u=e=>e;const b=l(s(a(i(d))));class p extends b{constructor(){super(...arguments),this.columns=[]}static get properties(){return e(e({},super.properties),{},{columns:{attribute:!1}})}render(){var e,l;const s=this.columns.some((e=>!!e.header));return t(n||(n=u` <div data-testid="wrapper" aria-busy="${0}" aria-live="polite" class="relative font-lumo text-m"> <table class="table-fixed w-full" data-testid="table"> <thead class="${0}"> <tr> ${0} </tr> </thead> <tbody class="divide-y divide-contrast-10"> ${0} </tbody> </table> ${0} </div> ${0} `),this.in("busy"),s?"border-b border-contrast-10":"sr-only",this.columns.map(((e,l)=>{var s;return t(o||(o=u` <th class="${0}"> ${0} </th> `),r({"truncate h-l text-tertiary text-m text-left font-medium":!0,"text-right":l===this.columns.length-1,"hidden sm-table-cell":"sm"===e.hideBelow,"hidden md-table-cell":"md"===e.hideBelow,"hidden lg-table-cell":"lg"===e.hideBelow,"hidden xl-table-cell":"xl"===e.hideBelow}),null===(s=e.header)||void 0===s?void 0:s.call(e,{html:t,lang:this.lang,data:this.data,ns:this.ns}))})),this.__rows.map((e=>{var l;return t(h||(h=u` <tr class="h-l"> ${0} </tr> `),null===(l=this.columns)||void 0===l?void 0:l.map(((l,s)=>{var a;return t(c||(c=u` <td class="${0}"> ${0} </td> `),r({"text-right":s===this.columns.length-1,"hidden sm-table-cell":"sm"===l.hideBelow,"hidden md-table-cell":"md"===l.hideBelow,"hidden lg-table-cell":"lg"===l.hideBelow,"hidden xl-table-cell":"xl"===l.hideBelow,"truncate h-l text-body":!0}),e?null===(a=l.cell)||void 0===a?void 0:a.call(l,{html:t,lang:this.lang,data:e,ns:this.ns}):"")})))})),this.in({idle:"snapshot"})?"":t(m||(m=u` <div class="absolute inset-0 flex items-center justify-center"> <foxy-spinner data-testid="spinner" layout="vertical" state="${0}" class="p-m bg-base shadow-xs rounded-t-l rounded-b-l" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> `),this.in("busy")?"busy":this.in("idle")?"empty":"error",this.lang,this.ns,null!==(l=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==l?l:""),this.renderTemplateOrSlot())}get __rows(){var e,t,l;const s=Object.values(null!==(t=null===(e=this.data)||void 0===e?void 0:e._embedded)&&void 0!==t?t:{}).reduce(((e,t)=>[...e,...t]),[]);let a;if(0===s.length)try{const e=new URL(null!==(l=this.href)&&void 0!==l?l:"").searchParams.get("limit"),t=parseInt(null!=e?e:"");a=isNaN(t)?20:t}catch(e){a=20}else a=s.length;return new Array(a).fill(null).map(((e,t)=>{var l;return null!==(l=s[t])&&void 0!==l?l:e}))}}export{p as T};
+import{_ as e}from"./shared-cb58dfcd.js";import{h as t}from"./shared-ba5c42c7.js";import{C as l}from"./shared-5afb584d.js";import"./foxy-nucleon-element.js";import{R as s,T as a,a as i}from"./shared-3c0dcb9e.js";import{c as r}from"./shared-4e709717.js";import{N as d}from"./shared-f83207fb.js";let n,o,h,c,m,u=e=>e;const b=l(s(a(i(d))));class p extends b{constructor(){super(...arguments),this.columns=[]}static get properties(){return e(e({},super.properties),{},{columns:{attribute:!1}})}render(){var e,l;const s=this.columns.some((e=>!!e.header));return t(n||(n=u` <div data-testid="wrapper" aria-busy="${0}" aria-live="polite" class="relative font-lumo text-m"> <table class="table-fixed w-full" data-testid="table"> <thead class="${0}"> <tr> ${0} </tr> </thead> <tbody class="divide-y divide-contrast-10"> ${0} </tbody> </table> ${0} </div> ${0} `),this.in("busy"),s?"border-b border-contrast-10":"sr-only",this.columns.map(((e,l)=>{var s;return t(o||(o=u` <th class="${0}"> ${0} </th> `),r({"truncate h-l text-tertiary text-m text-left font-medium":!0,"text-right":l===this.columns.length-1,"hidden sm-table-cell":"sm"===e.hideBelow,"hidden md-table-cell":"md"===e.hideBelow,"hidden lg-table-cell":"lg"===e.hideBelow,"hidden xl-table-cell":"xl"===e.hideBelow}),null===(s=e.header)||void 0===s?void 0:s.call(e,{html:t,lang:this.lang,data:this.data,ns:this.ns}))})),this.__rows.map((e=>{var l;return t(h||(h=u` <tr class="h-l"> ${0} </tr> `),null===(l=this.columns)||void 0===l?void 0:l.map(((l,s)=>{var a;return t(c||(c=u` <td class="${0}"> ${0} </td> `),r({"text-right":s===this.columns.length-1,"hidden sm-table-cell":"sm"===l.hideBelow,"hidden md-table-cell":"md"===l.hideBelow,"hidden lg-table-cell":"lg"===l.hideBelow,"hidden xl-table-cell":"xl"===l.hideBelow,"truncate h-l text-body":!0}),e?null===(a=l.cell)||void 0===a?void 0:a.call(l,{html:t,lang:this.lang,data:e,ns:this.ns}):"")})))})),this.in({idle:"snapshot"})?"":t(m||(m=u` <div class="absolute inset-0 flex items-center justify-center"> <foxy-spinner data-testid="spinner" layout="vertical" state="${0}" class="p-m bg-base shadow-xs rounded-t-l rounded-b-l" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> `),this.in("busy")?"busy":this.in("idle")?"empty":"error",this.lang,this.ns,null!==(l=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==l?l:""),this.renderTemplateOrSlot())}get __rows(){var e,t,l;const s=Object.values(null!==(t=null===(e=this.data)||void 0===e?void 0:e._embedded)&&void 0!==t?t:{}).reduce(((e,t)=>[...e,...t]),[]);let a;if(0===s.length)try{const e=new URL(null!==(l=this.href)&&void 0!==l?l:"").searchParams.get("limit"),t=parseInt(null!=e?e:"");a=isNaN(t)?20:t}catch(e){a=20}else a=s.length;return new Array(a).fill(null).map(((e,t)=>{var l;return null!==(l=s[t])&&void 0!==l?l:e}))}}export{p as T};

package/dist/cdn/{shared-1100bca8.js → shared-f2f81cda.js}

@@ -1 +1 @@
-import"./shared-8ef0ca65.js";import"./shared-4d32d19e.js";import{_ as t}from"./shared-cb58dfcd.js";import{h as e}from"./shared-ba5c42c7.js";import{D as s}from"./shared-048d5cae.js";let i,n=t=>t;customElements.define("foxy-internal-confirm-dialog",class extends s{constructor(){super(...arguments),this.closable=!1,this.editable=!1,this.alert=!0,this.messageOptions={},this.confirm="confirm",this.message="message",this.cancel="cancel",this.theme="primary"}static get properties(){return t(t({},super.properties),{},{messageOptions:{type:Object,attribute:"message-options"},confirm:{type:String},message:{type:String},cancel:{type:String},theme:{type:String}})}render(){return super.render((()=>e(i||(i=n` <foxy-i18n class="block font-lumo text-m text-body text-center mb-m" lang="${0}" key="${0}" ns="${0}" .options="${0}"> </foxy-i18n> <div class="grid grid-cols-2 gap-m"> <vaadin-button data-testid="cancelButton" @click="${0}"> <foxy-i18n ns="${0}" lang="${0}" key="${0}"></foxy-i18n> </vaadin-button> <vaadin-button theme="${0}" data-testid="confirmButton" @click="${0}"> <foxy-i18n ns="${0}" lang="${0}" key="${0}"></foxy-i18n> </vaadin-button> </div> `),this.lang,this.message,this.ns,this.messageOptions,this.__handleCancel,this.ns,this.lang,this.cancel,this.theme,this.__handleConfirm,this.ns,this.lang,this.confirm)))}async __handleCancel(){await this.hide(!0)}async __handleConfirm(){await this.hide()}});
+import"./shared-2fe84d72.js";import"./shared-72ebbdcd.js";import{_ as t}from"./shared-cb58dfcd.js";import{h as e}from"./shared-ba5c42c7.js";import{D as s}from"./shared-c003fbf3.js";let i,n=t=>t;customElements.define("foxy-internal-confirm-dialog",class extends s{constructor(){super(...arguments),this.closable=!1,this.editable=!1,this.alert=!0,this.messageOptions={},this.confirm="confirm",this.message="message",this.cancel="cancel",this.theme="primary"}static get properties(){return t(t({},super.properties),{},{messageOptions:{type:Object,attribute:"message-options"},confirm:{type:String},message:{type:String},cancel:{type:String},theme:{type:String}})}render(){return super.render((()=>e(i||(i=n` <foxy-i18n class="block font-lumo text-m text-body text-center mb-m" lang="${0}" key="${0}" ns="${0}" .options="${0}"> </foxy-i18n> <div class="grid grid-cols-2 gap-m"> <vaadin-button data-testid="cancelButton" @click="${0}"> <foxy-i18n ns="${0}" lang="${0}" key="${0}"></foxy-i18n> </vaadin-button> <vaadin-button theme="${0}" data-testid="confirmButton" @click="${0}"> <foxy-i18n ns="${0}" lang="${0}" key="${0}"></foxy-i18n> </vaadin-button> </div> `),this.lang,this.message,this.ns,this.messageOptions,this.__handleCancel,this.ns,this.lang,this.cancel,this.theme,this.__handleConfirm,this.ns,this.lang,this.confirm)))}async __handleCancel(){await this.hide(!0)}async __handleConfirm(){await this.hide()}});

package/dist/cdn/{shared-6683daed.js → shared-fe56bcdb.js}

@@ -1,4 +1,4 @@
-import"./shared-f9ac8763.js";import"./shared-f989c70e.js";import{h as e,P as t}from"./shared-21e68b72.js";import{E as s,T as r}from"./shared-315d7620.js";import{F as l}from"./shared-37348820.js";const i=e`<dom-module id="lumo-custom-field" theme-for="vaadin-custom-field">
+import"./shared-3ad093b5.js";import"./shared-a4a847e4.js";import{h as e,P as t}from"./shared-cfea6000.js";import{E as s,T as r}from"./shared-65763e6f.js";import{F as l}from"./shared-58c0c5cc.js";const i=e`<dom-module id="lumo-custom-field" theme-for="vaadin-custom-field">
   <template>
     <style include="lumo-required-field">
       :host {

package/dist/cdn/{shared-77132fe8.js → shared-ffa49371.js}

@@ -1 +1 @@
-import"./shared-b65d169b.js";import"./shared-edeeb089.js";import"./shared-83c5e004.js";import"./shared-6683daed.js";import"./shared-243456aa.js";import{a as e}from"./shared-109ec474.js";import{_ as t}from"./shared-cb58dfcd.js";import{c as i,h as a,s}from"./shared-ba5c42c7.js";import{i as l}from"./shared-53e42a77.js";import{c as o}from"./shared-4e709717.js";let n,r,d,h,u,c,p=e=>e;customElements.define("foxy-internal-frequency-control",class extends e{constructor(){super(...arguments),this.allowTwiceAMonth=!1,this.options=[{value:"d",label:"day"},{value:"w",label:"week"},{value:"m",label:"month"},{value:"y",label:"year"}],this.layout=null,this.max=999,this.__i18n={formatValue:e=>e.join(""),parseValue:e=>{var t;const i=e.startsWith(".")?`0${e}`:e,a=parseFloat(e.substring(0,Math.max(i.length-1,0))),s=null!==(t=i[i.length-1])&&void 0!==t?t:"";return isNaN(a)?["0",""]:[a.toString(),s]}}}static get properties(){return t(t({},super.properties),{},{allowTwiceAMonth:{type:Boolean,attribute:"allow-twice-a-month"},options:{attribute:!1},layout:{},max:{type:Number}})}static get styles(){return[super.styles,i(n||(n=p`:host{display:block}vaadin-custom-field{width:100%;font-size:0;line-height:0;padding-top:0!important}vaadin-custom-field::part(label){padding-bottom:var(--lumo-space-s)}vaadin-custom-field::part(error-message)[aria-hidden=false]{padding-top:var(--lumo-space-xs)}vaadin-combo-box,vaadin-integer-field{width:calc(50% - (var(--lumo-space-s)/ 2))}vaadin-integer-field{margin-right:var(--lumo-space-s);padding:0}vaadin-combo-box::part(text-field){padding:0}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input{-moz-appearance:textfield}`))]}renderControl(){var e,t;if("summary-item"===this.layout)return this.__renderSummaryItemLayout();const i=null!==(e=this._value)&&void 0!==e?e:"",s=parseFloat(this.__i18n.parseValue(i)[0]),o=this.options.map((({value:e,label:t})=>({label:this.t(t,{count:s}),value:e})));return a(r||(r=p` <vaadin-custom-field ?disabled="${0}" ?readonly="${0}" .checkValidity="${0}" .errorMessage="${0}" .helperText="${0}" .label="${0}" .value="${0}" .i18n="${0}" @change="${0}"> <vaadin-integer-field max="${0}" min="1" prevent-invalid-input has-controls ?disabled="${0}" ?readonly="${0}" ?invalid="${0}" @keydown="${0}"> </vaadin-integer-field> <vaadin-combo-box item-value-path="value" item-label-path="label" ?disabled="${0}" ?readonly="${0}" ?invalid="${0}" .items="${0}" @keydown="${0}"> </vaadin-combo-box> </vaadin-custom-field> `),this.disabled,this.readonly,this._checkValidity,null!==(t=this._errorMessage)&&void 0!==t?t:"",this.helperText,this.label,i,this.__i18n,(e=>{const t=e.currentTarget;this._value=t.value}),l(this.max||void 0),this.disabled,this.readonly,!this._checkValidity(),(e=>{var t;return"Enter"===e.key&&(null===(t=this.nucleon)||void 0===t?void 0:t.submit())}),this.disabled,this.readonly,!this._checkValidity(),o,(e=>{var t;return"Enter"===e.key&&(null===(t=this.nucleon)||void 0===t?void 0:t.submit())}))}updated(e){var t;super.updated(e);const i=this.renderRoot.querySelector("vaadin-custom-field");i&&i.value!==this._value&&(i.value=null!==(t=this._value)&&void 0!==t?t:"")}__renderSummaryItemLayout(){var e,t;const i=null!==(e=this._value)&&void 0!==e?e:"",[n,r]=this.__i18n.parseValue(i),m=parseFloat(n),v=".5m"!==this._value||this.allowTwiceAMonth?this.options.find((e=>e.value===r)):void 0;return a(d||(d=p` <div class="leading-xs"> <div class="flex items-center gap-xs"> <label class="text-m text-body flex-1 whitespace-nowrap" for="input">${0}</label> <input placeholder="${0}" inputmode="numeric" style="min-width:10ch" class="${0}" type="number" step="1" min="1" max="${0}" id="input" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <div class="${0}"> <div class="flex items-center gap-xs"> <div class="whitespace-nowrap"> ${0} </div> ${0} </div> <select class="${0}" id="select" ?disabled="${0}" ?hidden="${0}" @change="${0}"> <option value="" ?selected="${0}" disabled="disabled" hidden>${0}</option> ${0} ${0} </select> </div> </div> <div style="max-width:32rem"> <p class="text-xs text-secondary">${0}</p> <p class="text-xs text-error" ?hidden="${0}"> ${0} </p> </div> </div> `),this.label,this.placeholder,o({"w-full appearance-none text-right bg-transparent transition-colors":!0,"text-m rounded-s focus-outline-none":!0,"text-secondary":this.readonly,"text-disabled":this.disabled,"font-medium":!this.readonly}),l(null!==(t=this.max)&&void 0!==t?t:void 0),".5m"===i?this.allowTwiceAMonth?2:"":m,this.disabled,this.readonly,(e=>{var t;return"Enter"===e.key&&(null===(t=this.nucleon)||void 0===t?void 0:t.submit())}),(e=>{e.stopPropagation();const t=e.currentTarget;this._value=this.__i18n.formatValue([t.value,r])}),o({"relative rounded-s transition-colors transition-opacity":!0,"focus-within-ring-2 focus-within-ring-primary-50":!this.disabled&&!this.readonly,"text-body hover-opacity-80 cursor-pointer":!this.disabled&&!this.readonly,"text-secondary":this.readonly,"text-disabled":this.disabled,"font-medium":!this.readonly}),".5m"===i?this.t("times_a_month"):v?this.t(v.label,{count:m}):this.t("select"),this.readonly?"":s(h||(h=p`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" style="width: 1em; height: 1em; transform: scale(1.25)"><path fill-rule="evenodd" d="M10.53 3.47a.75.75 0 0 0-1.06 0L6.22 6.72a.75.75 0 0 0 1.06 1.06L10 5.06l2.72 2.72a.75.75 0 1 0 1.06-1.06l-3.25-3.25Zm-4.31 9.81 3.25 3.25a.75.75 0 0 0 1.06 0l3.25-3.25a.75.75 0 1 0-1.06-1.06L10 14.94l-2.72-2.72a.75.75 0 0 0-1.06 1.06Z" clip-rule="evenodd" /></svg>`)),o({"absolute inset-0 opacity-0":!0,"cursor-pointer":!this.disabled&&!this.readonly}),this.disabled,this.readonly,(e=>{e.stopPropagation();const t=e.currentTarget.value;this._value="times_a_month"===t?".5m":this.__i18n.formatValue([m,t])}),!v,this.t("select"),!this.allowTwiceAMonth||2!==m&&".5m"!==i?"":a(u||(u=p` <option value="times_a_month" ?selected="${0}"> ${0} </option> `),".5m"===i,this.t("times_a_month")),this.options.map((e=>a(c||(c=p` <option value="${0}" ?selected="${0}"> ${0} </option> `),e.value,".5m"!==i&&e.value===(null==v?void 0:v.value),this.t(e.label,{count:m})))),this.helperText,this.disabled||this.readonly,this._errorMessage)}});
+import"./shared-e69c94bd.js";import"./shared-acbcad2e.js";import"./shared-619235ab.js";import"./shared-fe56bcdb.js";import"./shared-1cd9967e.js";import{a as e}from"./shared-92f7ee94.js";import{_ as t}from"./shared-cb58dfcd.js";import{c as i,h as a,s}from"./shared-ba5c42c7.js";import{i as l}from"./shared-53e42a77.js";import{c as o}from"./shared-4e709717.js";let n,r,d,h,u,c,p=e=>e;customElements.define("foxy-internal-frequency-control",class extends e{constructor(){super(...arguments),this.allowTwiceAMonth=!1,this.options=[{value:"d",label:"day"},{value:"w",label:"week"},{value:"m",label:"month"},{value:"y",label:"year"}],this.layout=null,this.max=999,this.__i18n={formatValue:e=>e.join(""),parseValue:e=>{var t;const i=e.startsWith(".")?`0${e}`:e,a=parseFloat(e.substring(0,Math.max(i.length-1,0))),s=null!==(t=i[i.length-1])&&void 0!==t?t:"";return isNaN(a)?["0",""]:[a.toString(),s]}}}static get properties(){return t(t({},super.properties),{},{allowTwiceAMonth:{type:Boolean,attribute:"allow-twice-a-month"},options:{attribute:!1},layout:{},max:{type:Number}})}static get styles(){return[super.styles,i(n||(n=p`:host{display:block}vaadin-custom-field{width:100%;font-size:0;line-height:0;padding-top:0!important}vaadin-custom-field::part(label){padding-bottom:var(--lumo-space-s)}vaadin-custom-field::part(error-message)[aria-hidden=false]{padding-top:var(--lumo-space-xs)}vaadin-combo-box,vaadin-integer-field{width:calc(50% - (var(--lumo-space-s)/ 2))}vaadin-integer-field{margin-right:var(--lumo-space-s);padding:0}vaadin-combo-box::part(text-field){padding:0}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input{-moz-appearance:textfield}`))]}renderControl(){var e,t;if("summary-item"===this.layout)return this.__renderSummaryItemLayout();const i=null!==(e=this._value)&&void 0!==e?e:"",s=parseFloat(this.__i18n.parseValue(i)[0]),o=this.options.map((({value:e,label:t})=>({label:this.t(t,{count:s}),value:e})));return a(r||(r=p` <vaadin-custom-field ?disabled="${0}" ?readonly="${0}" .checkValidity="${0}" .errorMessage="${0}" .helperText="${0}" .label="${0}" .value="${0}" .i18n="${0}" @change="${0}"> <vaadin-integer-field max="${0}" min="1" prevent-invalid-input has-controls ?disabled="${0}" ?readonly="${0}" ?invalid="${0}" @keydown="${0}"> </vaadin-integer-field> <vaadin-combo-box item-value-path="value" item-label-path="label" ?disabled="${0}" ?readonly="${0}" ?invalid="${0}" .items="${0}" @keydown="${0}"> </vaadin-combo-box> </vaadin-custom-field> `),this.disabled,this.readonly,this._checkValidity,null!==(t=this._errorMessage)&&void 0!==t?t:"",this.helperText,this.label,i,this.__i18n,(e=>{const t=e.currentTarget;this._value=t.value}),l(this.max||void 0),this.disabled,this.readonly,!this._checkValidity(),(e=>{var t;return"Enter"===e.key&&(null===(t=this.nucleon)||void 0===t?void 0:t.submit())}),this.disabled,this.readonly,!this._checkValidity(),o,(e=>{var t;return"Enter"===e.key&&(null===(t=this.nucleon)||void 0===t?void 0:t.submit())}))}updated(e){var t;super.updated(e);const i=this.renderRoot.querySelector("vaadin-custom-field");i&&i.value!==this._value&&(i.value=null!==(t=this._value)&&void 0!==t?t:"")}__renderSummaryItemLayout(){var e,t;const i=null!==(e=this._value)&&void 0!==e?e:"",[n,r]=this.__i18n.parseValue(i),m=parseFloat(n),v=".5m"!==this._value||this.allowTwiceAMonth?this.options.find((e=>e.value===r)):void 0;return a(d||(d=p` <div class="leading-xs"> <div class="flex items-center gap-xs"> <label class="text-m text-body flex-1 whitespace-nowrap" for="input">${0}</label> <input placeholder="${0}" inputmode="numeric" style="min-width:10ch" class="${0}" type="number" step="1" min="1" max="${0}" id="input" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <div class="${0}"> <div class="flex items-center gap-xs"> <div class="whitespace-nowrap"> ${0} </div> ${0} </div> <select class="${0}" id="select" ?disabled="${0}" ?hidden="${0}" @change="${0}"> <option value="" ?selected="${0}" disabled="disabled" hidden>${0}</option> ${0} ${0} </select> </div> </div> <div style="max-width:32rem"> <p class="text-xs text-secondary">${0}</p> <p class="text-xs text-error" ?hidden="${0}"> ${0} </p> </div> </div> `),this.label,this.placeholder,o({"w-full appearance-none text-right bg-transparent transition-colors":!0,"text-m rounded-s focus-outline-none":!0,"text-secondary":this.readonly,"text-disabled":this.disabled,"font-medium":!this.readonly}),l(null!==(t=this.max)&&void 0!==t?t:void 0),".5m"===i?this.allowTwiceAMonth?2:"":m,this.disabled,this.readonly,(e=>{var t;return"Enter"===e.key&&(null===(t=this.nucleon)||void 0===t?void 0:t.submit())}),(e=>{e.stopPropagation();const t=e.currentTarget;this._value=this.__i18n.formatValue([t.value,r])}),o({"relative rounded-s transition-colors transition-opacity":!0,"focus-within-ring-2 focus-within-ring-primary-50":!this.disabled&&!this.readonly,"text-body hover-opacity-80 cursor-pointer":!this.disabled&&!this.readonly,"text-secondary":this.readonly,"text-disabled":this.disabled,"font-medium":!this.readonly}),".5m"===i?this.t("times_a_month"):v?this.t(v.label,{count:m}):this.t("select"),this.readonly?"":s(h||(h=p`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" style="width: 1em; height: 1em; transform: scale(1.25)"><path fill-rule="evenodd" d="M10.53 3.47a.75.75 0 0 0-1.06 0L6.22 6.72a.75.75 0 0 0 1.06 1.06L10 5.06l2.72 2.72a.75.75 0 1 0 1.06-1.06l-3.25-3.25Zm-4.31 9.81 3.25 3.25a.75.75 0 0 0 1.06 0l3.25-3.25a.75.75 0 1 0-1.06-1.06L10 14.94l-2.72-2.72a.75.75 0 0 0-1.06 1.06Z" clip-rule="evenodd" /></svg>`)),o({"absolute inset-0 opacity-0":!0,"cursor-pointer":!this.disabled&&!this.readonly}),this.disabled,this.readonly,(e=>{e.stopPropagation();const t=e.currentTarget.value;this._value="times_a_month"===t?".5m":this.__i18n.formatValue([m,t])}),!v,this.t("select"),!this.allowTwiceAMonth||2!==m&&".5m"!==i?"":a(u||(u=p` <option value="times_a_month" ?selected="${0}"> ${0} </option> `),".5m"===i,this.t("times_a_month")),this.options.map((e=>a(c||(c=p` <option value="${0}" ?selected="${0}"> ${0} </option> `),e.value,".5m"!==i&&e.value===(null==v?void 0:v.value),this.t(e.label,{count:m})))),this.helperText,this.disabled||this.readonly,this._errorMessage)}});

package/dist/cdn/translations/admin-subscription-form/en.json

@@ -88,6 +88,7 @@
   "overdue": {
     "label": "",
     "helper_text": "",
+    "error_with_zero_past_due_hint": "A past due amount has been successfully captured. Click to see the details.",
     "past-due-amount": {
       "label": "Past due amount",
       "helper_text": "Missing payments increase this amount. Depending on your store settings, we may charge it automatically on the next billing cycle.",

package/dist/elements/public/AdminSubscriptionForm/AdminSubscriptionForm.js

@@ -19,11 +19,11 @@ export class AdminSubscriptionForm extends Base {
         };
     }
     get hiddenSelector() {
-        var _a, _b;
         const alwaysMatch = ['delete', super.hiddenSelector.toString()];
-        if (!((_a = this.data) === null || _a === void 0 ? void 0 : _a.error_message))
+        const data = this.data;
+        if (!(data === null || data === void 0 ? void 0 : data.error_message) || !data.past_due_amount)
             alwaysMatch.unshift('error-message');
-        if (!((_b = this.data) === null || _b === void 0 ? void 0 : _b.is_active))
+        if (!(data === null || data === void 0 ? void 0 : data.is_active))
             alwaysMatch.unshift('view-action', 'cancel-action');
         return new BooleanSelector(alwaysMatch.join(' ').trim());
     }
@@ -32,20 +32,21 @@ export class AdminSubscriptionForm extends Base {
         return status ? `subtitle_${status}` : super.headerSubtitleKey;
     }
     renderBody() {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
         let transactionsHref;
         try {
             const url = new URL((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a._links['fx:transactions'].href) !== null && _b !== void 0 ? _b : '');
             url.searchParams.set('zoom', 'items');
             transactionsHref = url.toString();
         }
-        catch (_j) {
+        catch (_k) {
             transactionsHref = undefined;
         }
         // @ts-expect-error - SDK doesn't know yet about the `fx:charge_past_due` link.
         const chargePastDueHref = (_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c._links['fx:charge_past_due']) === null || _d === void 0 ? void 0 : _d.href;
         const pastDueAmount = (_e = this.data) === null || _e === void 0 ? void 0 : _e.past_due_amount;
-        const currencyCode = (_f = this.data) === null || _f === void 0 ? void 0 : _f._embedded['fx:transaction_template'].currency_code;
+        const errorMessage = (_f = this.data) === null || _f === void 0 ? void 0 : _f.error_message;
+        const currencyCode = (_g = this.data) === null || _g === void 0 ? void 0 : _g._embedded['fx:transaction_template'].currency_code;
         return html `
       ${this.renderHeader()}
 
@@ -87,7 +88,26 @@ export class AdminSubscriptionForm extends Base {
               >
               </foxy-internal-post-action-control>
             `
-            : ''}
+            : errorMessage && !pastDueAmount
+                ? html `
+              <details
+                class="leading-xs text-xs text-secondary rounded-b focus-within-ring-2 focus-within-ring-inset focus-within-ring-primary-50"
+                style="--gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
+              >
+                <summary
+                  class="cursor-pointer transition-colors hover-text-body focus-outline-none"
+                >
+                  <span class="flex items-start" style="gap: var(--gap)">
+                    ${svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="flex-shrink-0" style="width: 1.25em"><path fill-rule="evenodd" d="M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0ZM9 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM6.75 8a.75.75 0 0 0 0 1.5h.75v1.75a.75.75 0 0 0 1.5 0v-2.5A.75.75 0 0 0 8.25 8h-1.5Z" clip-rule="evenodd" /></svg>`}
+                    <foxy-i18n infer="" key="error_with_zero_past_due_hint"></foxy-i18n>
+                  </span>
+                </summary>
+                <p style="padding-left: calc(1.25em + var(--gap))" class="pt-xs">
+                  <span class="whitespace-pre-line">${errorMessage}</span>
+                </p>
+              </details>
+            `
+                : ''}
       </foxy-internal-summary-control>
 
       <foxy-internal-summary-control infer="self-service-links">
@@ -139,7 +159,7 @@ export class AdminSubscriptionForm extends Base {
       <foxy-internal-async-list-control
         infer="attributes"
         class="min-w-0"
-        first=${ifDefined((_h = (_g = this.data) === null || _g === void 0 ? void 0 : _g._links) === null || _h === void 0 ? void 0 : _h['fx:attributes'].href)}
+        first=${ifDefined((_j = (_h = this.data) === null || _h === void 0 ? void 0 : _h._links) === null || _j === void 0 ? void 0 : _j['fx:attributes'].href)}
         item="foxy-attribute-card"
         form="foxy-attribute-form"
         alert

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

@@ -1 +1 @@
-{"version":3,"file":"AdminSubscriptionForm.js","sourceRoot":"","sources":["../../../../src/elements/public/AdminSubscriptionForm/AdminSubscriptionForm.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,qBAAqB,EAAE,kDAA+C;AAC/E,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAErC,MAAM,EAAE,GAAG,yBAAyB,CAAC;AACrC,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD,MAAM,OAAO,qBAAsB,SAAQ,IAAU;IAArD;;QAQE,yHAAyH;QACzH,oBAAe,GAAkB,IAAI,CAAC;IAkJxC,CAAC;IA1JC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,eAAe,EAAE,EAAE,SAAS,EAAE,mBAAmB,EAAE;SACpD,CAAC;IACJ,CAAC;IAKD,IAAI,cAAc;;QAChB,MAAM,WAAW,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;QAChE,IAAI,QAAC,IAAI,CAAC,IAAI,0CAAE,aAAa,CAAA;YAAE,WAAW,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;QACpE,IAAI,QAAC,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAA;YAAE,WAAW,CAAC,OAAO,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC;QAC/E,OAAO,IAAI,eAAe,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,iBAAiB;QACnB,MAAM,MAAM,GAAG,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAChD,OAAO,MAAM,CAAC,CAAC,CAAC,YAAY,MAAM,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,iBAAiB,CAAC;IACjE,CAAC;IAED,UAAU;;QACR,IAAI,gBAAoC,CAAC;QAEzC,IAAI;YACF,MAAM,GAAG,GAAG,IAAI,GAAG,aAAC,IAAI,CAAC,IAAI,0CAAE,MAAM,CAAC,iBAAiB,EAAE,IAAI,mCAAI,EAAE,CAAC,CAAC;YACrE,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YACtC,gBAAgB,GAAG,GAAG,CAAC,QAAQ,EAAE,CAAC;SACnC;QAAC,WAAM;YACN,gBAAgB,GAAG,SAAS,CAAC;SAC9B;QAED,+EAA+E;QAC/E,MAAM,iBAAiB,eAAuB,IAAI,CAAC,IAAI,0CAAE,MAAM,CAAC,oBAAoB,2CAAG,IAAI,CAAC;QAC5F,MAAM,aAAa,SAAG,IAAI,CAAC,IAAI,0CAAE,eAAe,CAAC;QACjD,MAAM,YAAY,SAAG,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,yBAAyB,EAAE,aAAa,CAAC;QAEnF,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,EAAE;;;;;;;;;;;;;;;;;;;;;;;mBAuBR,SAAS,CAAC,YAAY,CAAC;;;;;;UAMhC,iBAAiB,IAAI,YAAY,IAAI,aAAa;YAClD,CAAC,CAAC,IAAI,CAAA;;kCAEkB,IAAI,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,aAAa,IAAI,YAAY,EAAE,EAAE,CAAC;;;uBAGzE,iBAAiB;2BACb,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE;;;aAGlC;YACH,CAAC,CAAC,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YA6BF,GAAG,CAAA,qWAAqW;;;cAGtW,IAAI,CAAC,eAAe;YACpB,CAAC,CAAC,IAAI,CAAA;;;;2BAIO,IAAI,CAAC,eAAe;;;;iBAI9B;YACH,CAAC,CAAC,EAAE;;;;;QAKV,IAAI,CAAC,oBAAoB,EAAE;;;;;gBAKnB,SAAS,aAAC,IAAI,CAAC,IAAI,0CAAE,MAAM,0CAAG,eAAe,EAAE,IAAI,CAAC;;;;;;;;;;gBAUpD,SAAS,CAAC,gBAAgB,CAAC;;;;;;;;;;QAUnC,KAAK,CAAC,UAAU,EAAE;KACrB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { Data } from './types';\n\nimport { getSubscriptionStatus } from '../../../utils/get-subscription-status';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html, svg } from 'lit-html';\n\nconst NS = 'admin-subscription-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\nexport class AdminSubscriptionForm extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      uoeSettingsPage: { attribute: 'uoe-settings-page' },\n    };\n  }\n\n  /** URL of the UOE settings page in the admin. If set, displays a link to that page in the self-service links section. */\n  uoeSettingsPage: string | null = null;\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['delete', super.hiddenSelector.toString()];\n    if (!this.data?.error_message) alwaysMatch.unshift('error-message');\n    if (!this.data?.is_active) alwaysMatch.unshift('view-action', 'cancel-action');\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get headerSubtitleKey(): string {\n    const status = getSubscriptionStatus(this.data);\n    return status ? `subtitle_${status}` : super.headerSubtitleKey;\n  }\n\n  renderBody(): TemplateResult {\n    let transactionsHref: string | undefined;\n\n    try {\n      const url = new URL(this.data?._links['fx:transactions'].href ?? '');\n      url.searchParams.set('zoom', 'items');\n      transactionsHref = url.toString();\n    } catch {\n      transactionsHref = undefined;\n    }\n\n    // @ts-expect-error - SDK doesn't know yet about the `fx:charge_past_due` link.\n    const chargePastDueHref: string | undefined = this.data?._links['fx:charge_past_due']?.href;\n    const pastDueAmount = this.data?.past_due_amount;\n    const currencyCode = this.data?._embedded['fx:transaction_template'].currency_code;\n\n    return html`\n      ${this.renderHeader()}\n\n      <foxy-internal-admin-subscription-form-error infer=\"error-message\">\n      </foxy-internal-admin-subscription-form-error>\n\n      <foxy-internal-summary-control infer=\"general\">\n        <foxy-internal-date-control layout=\"summary-item\" infer=\"start-date\">\n        </foxy-internal-date-control>\n        <foxy-internal-frequency-control\n          layout=\"summary-item\"\n          infer=\"frequency\"\n          allow-twice-a-month\n        >\n        </foxy-internal-frequency-control>\n        <foxy-internal-date-control layout=\"summary-item\" infer=\"next-transaction-date\">\n        </foxy-internal-date-control>\n        <foxy-internal-date-control layout=\"summary-item\" infer=\"end-date\">\n        </foxy-internal-date-control>\n      </foxy-internal-summary-control>\n\n      <foxy-internal-summary-control infer=\"overdue\">\n        <foxy-internal-number-control\n          layout=\"summary-item\"\n          suffix=${ifDefined(currencyCode)}\n          infer=\"past-due-amount\"\n          min=\"0\"\n        >\n        </foxy-internal-number-control>\n\n        ${chargePastDueHref && currencyCode && pastDueAmount\n          ? html`\n              <foxy-internal-post-action-control\n                message-options=${JSON.stringify({ amount: `${pastDueAmount} ${currencyCode}` })}\n                theme=\"tertiary-inline\"\n                infer=\"charge-past-due\"\n                href=${chargePastDueHref}\n                @success=${() => this.refresh()}\n              >\n              </foxy-internal-post-action-control>\n            `\n          : ''}\n      </foxy-internal-summary-control>\n\n      <foxy-internal-summary-control infer=\"self-service-links\">\n        <foxy-internal-admin-subscription-form-link-control infer=\"load-in-cart\">\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <foxy-internal-admin-subscription-form-link-control\n          search=\"cart=checkout\"\n          infer=\"load-on-checkout\"\n        >\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <foxy-internal-admin-subscription-form-link-control\n          search=\"sub_cancel=next_transaction_date\"\n          infer=\"cancel-at-end-of-billing-period\"\n        >\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <foxy-internal-admin-subscription-form-link-control\n          search=\"sub_cancel=true\"\n          infer=\"cancel-next-day\"\n        >\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <div\n          class=\"flex items-start leading-xs text-xs text-secondary\"\n          style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        >\n          ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0ZM9 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM6.75 8a.75.75 0 0 0 0 1.5h.75v1.75a.75.75 0 0 0 1.5 0v-2.5A.75.75 0 0 0 8.25 8h-1.5Z\" clip-rule=\"evenodd\" /></svg>`}\n          <p>\n            <foxy-i18n infer=\"\" key=\"uoe_hint_text\"></foxy-i18n>\n            ${this.uoeSettingsPage\n              ? html`\n                  <a\n                    target=\"_blank\"\n                    class=\"inline-block rounded font-medium text-body cursor-pointer hover-underline focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                    href=${this.uoeSettingsPage}\n                  >\n                    <foxy-i18n infer=\"\" key=\"uoe_link_text\"></foxy-i18n>\n                  </a>\n                `\n              : ''}\n          </p>\n        </div>\n      </foxy-internal-summary-control>\n\n      ${this.renderTemplateOrSlot()}\n\n      <foxy-internal-async-list-control\n        infer=\"attributes\"\n        class=\"min-w-0\"\n        first=${ifDefined(this.data?._links?.['fx:attributes'].href)}\n        item=\"foxy-attribute-card\"\n        form=\"foxy-attribute-form\"\n        alert\n      >\n      </foxy-internal-async-list-control>\n\n      <foxy-internal-async-list-control\n        infer=\"transactions\"\n        class=\"min-w-0\"\n        first=${ifDefined(transactionsHref)}\n        item=\"foxy-transaction-card\"\n        form=\"foxy-transaction\"\n        hide-create-button\n        hide-delete-button\n        alert\n        wide\n      >\n      </foxy-internal-async-list-control>\n\n      ${super.renderBody()}\n    `;\n  }\n}\n"]}
+{"version":3,"file":"AdminSubscriptionForm.js","sourceRoot":"","sources":["../../../../src/elements/public/AdminSubscriptionForm/AdminSubscriptionForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { Data } from './types';\n\nimport { getSubscriptionStatus } from '../../../utils/get-subscription-status';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html, svg } from 'lit-html';\n\nconst NS = 'admin-subscription-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\nexport class AdminSubscriptionForm extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      uoeSettingsPage: { attribute: 'uoe-settings-page' },\n    };\n  }\n\n  /** URL of the UOE settings page in the admin. If set, displays a link to that page in the self-service links section. */\n  uoeSettingsPage: string | null = null;\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['delete', super.hiddenSelector.toString()];\n    const data = this.data;\n\n    if (!data?.error_message || !data.past_due_amount) alwaysMatch.unshift('error-message');\n    if (!data?.is_active) alwaysMatch.unshift('view-action', 'cancel-action');\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get headerSubtitleKey(): string {\n    const status = getSubscriptionStatus(this.data);\n    return status ? `subtitle_${status}` : super.headerSubtitleKey;\n  }\n\n  renderBody(): TemplateResult {\n    let transactionsHref: string | undefined;\n\n    try {\n      const url = new URL(this.data?._links['fx:transactions'].href ?? '');\n      url.searchParams.set('zoom', 'items');\n      transactionsHref = url.toString();\n    } catch {\n      transactionsHref = undefined;\n    }\n\n    // @ts-expect-error - SDK doesn't know yet about the `fx:charge_past_due` link.\n    const chargePastDueHref: string | undefined = this.data?._links['fx:charge_past_due']?.href;\n    const pastDueAmount = this.data?.past_due_amount;\n    const errorMessage = this.data?.error_message;\n    const currencyCode = this.data?._embedded['fx:transaction_template'].currency_code;\n\n    return html`\n      ${this.renderHeader()}\n\n      <foxy-internal-admin-subscription-form-error infer=\"error-message\">\n      </foxy-internal-admin-subscription-form-error>\n\n      <foxy-internal-summary-control infer=\"general\">\n        <foxy-internal-date-control layout=\"summary-item\" infer=\"start-date\">\n        </foxy-internal-date-control>\n        <foxy-internal-frequency-control\n          layout=\"summary-item\"\n          infer=\"frequency\"\n          allow-twice-a-month\n        >\n        </foxy-internal-frequency-control>\n        <foxy-internal-date-control layout=\"summary-item\" infer=\"next-transaction-date\">\n        </foxy-internal-date-control>\n        <foxy-internal-date-control layout=\"summary-item\" infer=\"end-date\">\n        </foxy-internal-date-control>\n      </foxy-internal-summary-control>\n\n      <foxy-internal-summary-control infer=\"overdue\">\n        <foxy-internal-number-control\n          layout=\"summary-item\"\n          suffix=${ifDefined(currencyCode)}\n          infer=\"past-due-amount\"\n          min=\"0\"\n        >\n        </foxy-internal-number-control>\n\n        ${chargePastDueHref && currencyCode && pastDueAmount\n          ? html`\n              <foxy-internal-post-action-control\n                message-options=${JSON.stringify({ amount: `${pastDueAmount} ${currencyCode}` })}\n                theme=\"tertiary-inline\"\n                infer=\"charge-past-due\"\n                href=${chargePastDueHref}\n                @success=${() => this.refresh()}\n              >\n              </foxy-internal-post-action-control>\n            `\n          : errorMessage && !pastDueAmount\n          ? html`\n              <details\n                class=\"leading-xs text-xs text-secondary rounded-b focus-within-ring-2 focus-within-ring-inset focus-within-ring-primary-50\"\n                style=\"--gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n              >\n                <summary\n                  class=\"cursor-pointer transition-colors hover-text-body focus-outline-none\"\n                >\n                  <span class=\"flex items-start\" style=\"gap: var(--gap)\">\n                    ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0ZM9 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM6.75 8a.75.75 0 0 0 0 1.5h.75v1.75a.75.75 0 0 0 1.5 0v-2.5A.75.75 0 0 0 8.25 8h-1.5Z\" clip-rule=\"evenodd\" /></svg>`}\n                    <foxy-i18n infer=\"\" key=\"error_with_zero_past_due_hint\"></foxy-i18n>\n                  </span>\n                </summary>\n                <p style=\"padding-left: calc(1.25em + var(--gap))\" class=\"pt-xs\">\n                  <span class=\"whitespace-pre-line\">${errorMessage}</span>\n                </p>\n              </details>\n            `\n          : ''}\n      </foxy-internal-summary-control>\n\n      <foxy-internal-summary-control infer=\"self-service-links\">\n        <foxy-internal-admin-subscription-form-link-control infer=\"load-in-cart\">\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <foxy-internal-admin-subscription-form-link-control\n          search=\"cart=checkout\"\n          infer=\"load-on-checkout\"\n        >\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <foxy-internal-admin-subscription-form-link-control\n          search=\"sub_cancel=next_transaction_date\"\n          infer=\"cancel-at-end-of-billing-period\"\n        >\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <foxy-internal-admin-subscription-form-link-control\n          search=\"sub_cancel=true\"\n          infer=\"cancel-next-day\"\n        >\n        </foxy-internal-admin-subscription-form-link-control>\n\n        <div\n          class=\"flex items-start leading-xs text-xs text-secondary\"\n          style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        >\n          ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0ZM9 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM6.75 8a.75.75 0 0 0 0 1.5h.75v1.75a.75.75 0 0 0 1.5 0v-2.5A.75.75 0 0 0 8.25 8h-1.5Z\" clip-rule=\"evenodd\" /></svg>`}\n          <p>\n            <foxy-i18n infer=\"\" key=\"uoe_hint_text\"></foxy-i18n>\n            ${this.uoeSettingsPage\n              ? html`\n                  <a\n                    target=\"_blank\"\n                    class=\"inline-block rounded font-medium text-body cursor-pointer hover-underline focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                    href=${this.uoeSettingsPage}\n                  >\n                    <foxy-i18n infer=\"\" key=\"uoe_link_text\"></foxy-i18n>\n                  </a>\n                `\n              : ''}\n          </p>\n        </div>\n      </foxy-internal-summary-control>\n\n      ${this.renderTemplateOrSlot()}\n\n      <foxy-internal-async-list-control\n        infer=\"attributes\"\n        class=\"min-w-0\"\n        first=${ifDefined(this.data?._links?.['fx:attributes'].href)}\n        item=\"foxy-attribute-card\"\n        form=\"foxy-attribute-form\"\n        alert\n      >\n      </foxy-internal-async-list-control>\n\n      <foxy-internal-async-list-control\n        infer=\"transactions\"\n        class=\"min-w-0\"\n        first=${ifDefined(transactionsHref)}\n        item=\"foxy-transaction-card\"\n        form=\"foxy-transaction\"\n        hide-create-button\n        hide-delete-button\n        alert\n        wide\n      >\n      </foxy-internal-async-list-control>\n\n      ${super.renderBody()}\n    `;\n  }\n}\n"]}

package/dist/elements/public/FilterAttributeForm/FilterAttributeForm.d.ts

@@ -22,6 +22,8 @@ export declare class FilterAttributeForm extends Base<Data> {
     static readonly attributeName: string;
     static readonly filterNameKey: string;
     static get properties(): PropertyDeclarations;
+    /** Default filter query. */
+    defaults: string | null;
     /** Admin page pathname. */
     pathname: string | null;
     /** Filter options passed down to `QueryBuilder.options.` */

package/dist/elements/public/FilterAttributeForm/FilterAttributeForm.js

@@ -17,6 +17,8 @@ const Base = TranslatableMixin(InternalForm, NS);
 export class FilterAttributeForm extends Base {
     constructor() {
         super(...arguments);
+        /** Default filter query. */
+        this.defaults = null;
         /** Admin page pathname. */
         this.pathname = null;
         /** Filter options passed down to `QueryBuilder.options.` */
@@ -33,6 +35,7 @@ export class FilterAttributeForm extends Base {
     static get properties() {
         return {
             ...super.properties,
+            defaults: {},
             pathname: {},
             options: { type: Array },
         };
@@ -42,9 +45,10 @@ export class FilterAttributeForm extends Base {
         const constructor = this.constructor;
         const filterQuery = this.__getValueParam(constructor.filterQueryKey);
         const hasData = !!this.data;
+        const hasValue = !!this.form.value;
         if (!hasData)
             alwaysHidden.push('filter-name');
-        if (!filterQuery && !hasData)
+        if (!hasValue || (!filterQuery && !hasData))
             alwaysHidden.push('action');
         return new BooleanSelector(`${alwaysHidden.join(' ')} ${super.hiddenSelector}`.trim());
     }
@@ -90,12 +94,26 @@ export class FilterAttributeForm extends Base {
         super.submit();
     }
     __getValueParam(key) {
-        var _a, _b;
+        var _a, _b, _c;
         try {
+            const constructor = this.constructor;
             const url = new URL(decode((_a = this.form.value) !== null && _a !== void 0 ? _a : ''), 'https://example.com');
-            return (_b = url.searchParams.get(key)) !== null && _b !== void 0 ? _b : '';
+            let result = (_b = url.searchParams.get(key)) !== null && _b !== void 0 ? _b : '';
+            if (key === constructor.filterQueryKey &&
+                (this.in({ idle: { snapshot: 'clean' } }) || this.in({ idle: { template: 'clean' } }))) {
+                try {
+                    const fullQuery = new URLSearchParams(result);
+                    const defaults = new URLSearchParams((_c = this.defaults) !== null && _c !== void 0 ? _c : '');
+                    fullQuery.forEach((v, k) => defaults.set(k, v));
+                    result = defaults.toString();
+                }
+                catch (_d) {
+                    // no-op
+                }
+            }
+            return result;
         }
-        catch (_c) {
+        catch (_e) {
             return '';
         }
     }

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

@@ -1 +1 @@
-{"version":3,"file":"FilterAttributeForm.js","sourceRoot":"","sources":["../../../../src/elements/public/FilterAttributeForm/FilterAttributeForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { QueryBuilder } from '../QueryBuilder/QueryBuilder';\nimport type { Option } from '../QueryBuilder/types';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { encode, decode } from 'html-entities';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { html } from 'lit-html';\n\nconst NS = 'filter-attribute-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for creating and editing saved filters in Admin. Saved filters\n * are powered by the Bookmark attribute format that allows adding custom sidebar items\n * to Admin. Bookmark attributes are named `foxy-admin-bookmark` and contain a\n * relative URL of the bookmarked Admin page in the value.\n *\n * @element foxy-filter-attribute-form\n * @since 1.24.0\n */\nexport class FilterAttributeForm extends Base<Data> {\n  static readonly attributeVisibility: Data['visibility'] = 'restricted';\n\n  static readonly filterQueryKey: string = 'filter_query';\n\n  static readonly attributeName: string = 'foxy-admin-bookmark';\n\n  static readonly filterNameKey: string = 'filter_name';\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      pathname: {},\n      options: { type: Array },\n    };\n  }\n\n  /** Admin page pathname. */\n  pathname: string | null = null;\n\n  /** Filter options passed down to `QueryBuilder.options.` */\n  options: Option[] = [];\n\n  private readonly __filterNameGetValue = () => {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    return this.__getValueParam(constructor.filterNameKey);\n  };\n\n  private readonly __filterNameSetValue = (v: string) => {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    this.__setValueParam(constructor.filterNameKey, v);\n  };\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysHidden: string[] = [];\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    const filterQuery = this.__getValueParam(constructor.filterQueryKey);\n    const hasData = !!this.data;\n\n    if (!hasData) alwaysHidden.push('filter-name');\n    if (!filterQuery && !hasData) alwaysHidden.push('action');\n\n    return new BooleanSelector(`${alwaysHidden.join(' ')} ${super.hiddenSelector}`.trim());\n  }\n\n  renderBody(): TemplateResult {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n\n    return html`\n      <foxy-query-builder\n        infer=\"filter-query\"\n        .options=${this.options}\n        .value=${this.__getValueParam(constructor.filterQueryKey)}\n        @change=${this.__handleFilterQueryChange}\n      >\n      </foxy-query-builder>\n\n      <foxy-internal-text-control\n        infer=\"filter-name\"\n        .getValue=${this.__filterNameGetValue}\n        .setValue=${this.__filterNameSetValue}\n      >\n      </foxy-internal-text-control>\n\n      <foxy-internal-filter-attribute-form-action-control infer=\"action\">\n      </foxy-internal-filter-attribute-form-action-control>\n    `;\n  }\n\n  updated(changes: Map<keyof this, unknown>): void {\n    super.updated(changes);\n    if (typeof this.form.value === 'string') {\n      const url = new URL(decode(this.form.value), 'https://example.com');\n      url.pathname = this.pathname ?? '';\n      const value = encode(url.toString().substring(url.origin.length));\n      if (value !== this.form.value) this.edit({ value });\n    }\n  }\n\n  submit(): void {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n\n    this.edit({\n      visibility: constructor.attributeVisibility,\n      name: constructor.attributeName,\n    });\n\n    super.submit();\n  }\n\n  private __getValueParam(key: string) {\n    try {\n      const url = new URL(decode(this.form.value ?? ''), 'https://example.com');\n      return url.searchParams.get(key) ?? '';\n    } catch {\n      return '';\n    }\n  }\n\n  private __setValueParam(key: string, value: string) {\n    try {\n      const url = new URL(decode(this.form.value ?? ''), 'https://example.com');\n      url.searchParams.set(key, value);\n      this.edit({ value: encode(url.toString().substring(url.origin.length)) });\n    } catch {\n      // ignore\n    }\n  }\n\n  private __handleFilterQueryChange(evt: CustomEvent) {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    const element = evt.currentTarget as QueryBuilder;\n    this.__setValueParam(constructor.filterQueryKey, element.value ?? '');\n  }\n}\n"]}
+{"version":3,"file":"FilterAttributeForm.js","sourceRoot":"","sources":["../../../../src/elements/public/FilterAttributeForm/FilterAttributeForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { QueryBuilder } from '../QueryBuilder/QueryBuilder';\nimport type { Option } from '../QueryBuilder/types';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { encode, decode } from 'html-entities';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { html } from 'lit-html';\n\nconst NS = 'filter-attribute-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for creating and editing saved filters in Admin. Saved filters\n * are powered by the Bookmark attribute format that allows adding custom sidebar items\n * to Admin. Bookmark attributes are named `foxy-admin-bookmark` and contain a\n * relative URL of the bookmarked Admin page in the value.\n *\n * @element foxy-filter-attribute-form\n * @since 1.24.0\n */\nexport class FilterAttributeForm extends Base<Data> {\n  static readonly attributeVisibility: Data['visibility'] = 'restricted';\n\n  static readonly filterQueryKey: string = 'filter_query';\n\n  static readonly attributeName: string = 'foxy-admin-bookmark';\n\n  static readonly filterNameKey: string = 'filter_name';\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      defaults: {},\n      pathname: {},\n      options: { type: Array },\n    };\n  }\n\n  /** Default filter query. */\n  defaults: string | null = null;\n\n  /** Admin page pathname. */\n  pathname: string | null = null;\n\n  /** Filter options passed down to `QueryBuilder.options.` */\n  options: Option[] = [];\n\n  private readonly __filterNameGetValue = () => {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    return this.__getValueParam(constructor.filterNameKey);\n  };\n\n  private readonly __filterNameSetValue = (v: string) => {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    this.__setValueParam(constructor.filterNameKey, v);\n  };\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysHidden: string[] = [];\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    const filterQuery = this.__getValueParam(constructor.filterQueryKey);\n    const hasData = !!this.data;\n    const hasValue = !!this.form.value;\n\n    if (!hasData) alwaysHidden.push('filter-name');\n    if (!hasValue || (!filterQuery && !hasData)) alwaysHidden.push('action');\n\n    return new BooleanSelector(`${alwaysHidden.join(' ')} ${super.hiddenSelector}`.trim());\n  }\n\n  renderBody(): TemplateResult {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n\n    return html`\n      <foxy-query-builder\n        infer=\"filter-query\"\n        .options=${this.options}\n        .value=${this.__getValueParam(constructor.filterQueryKey)}\n        @change=${this.__handleFilterQueryChange}\n      >\n      </foxy-query-builder>\n\n      <foxy-internal-text-control\n        infer=\"filter-name\"\n        .getValue=${this.__filterNameGetValue}\n        .setValue=${this.__filterNameSetValue}\n      >\n      </foxy-internal-text-control>\n\n      <foxy-internal-filter-attribute-form-action-control infer=\"action\">\n      </foxy-internal-filter-attribute-form-action-control>\n    `;\n  }\n\n  updated(changes: Map<keyof this, unknown>): void {\n    super.updated(changes);\n    if (typeof this.form.value === 'string') {\n      const url = new URL(decode(this.form.value), 'https://example.com');\n      url.pathname = this.pathname ?? '';\n      const value = encode(url.toString().substring(url.origin.length));\n      if (value !== this.form.value) this.edit({ value });\n    }\n  }\n\n  submit(): void {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n\n    this.edit({\n      visibility: constructor.attributeVisibility,\n      name: constructor.attributeName,\n    });\n\n    super.submit();\n  }\n\n  private __getValueParam(key: string) {\n    try {\n      const constructor = this.constructor as typeof FilterAttributeForm;\n      const url = new URL(decode(this.form.value ?? ''), 'https://example.com');\n\n      let result = url.searchParams.get(key) ?? '';\n\n      if (\n        key === constructor.filterQueryKey &&\n        (this.in({ idle: { snapshot: 'clean' } }) || this.in({ idle: { template: 'clean' } }))\n      ) {\n        try {\n          const fullQuery = new URLSearchParams(result);\n          const defaults = new URLSearchParams(this.defaults ?? '');\n          fullQuery.forEach((v, k) => defaults.set(k, v));\n          result = defaults.toString();\n        } catch {\n          // no-op\n        }\n      }\n\n      return result;\n    } catch {\n      return '';\n    }\n  }\n\n  private __setValueParam(key: string, value: string) {\n    try {\n      const url = new URL(decode(this.form.value ?? ''), 'https://example.com');\n      url.searchParams.set(key, value);\n      this.edit({ value: encode(url.toString().substring(url.origin.length)) });\n    } catch {\n      // ignore\n    }\n  }\n\n  private __handleFilterQueryChange(evt: CustomEvent) {\n    const constructor = this.constructor as typeof FilterAttributeForm;\n    const element = evt.currentTarget as QueryBuilder;\n    this.__setValueParam(constructor.filterQueryKey, element.value ?? '');\n  }\n}\n"]}

package/dist/mixins/themeable.js

@@ -1395,6 +1395,10 @@ option{
   white-space: pre;
 }
 
+.whitespace-pre-line {
+  white-space: pre-line;
+}
+
 .whitespace-pre-wrap {
   white-space: pre-wrap;
 }
@@ -1822,6 +1826,10 @@ option{
   padding-bottom: var(--lumo-space-m, 1rem);
 }
 
+.pt-xs {
+  padding-top: var(--lumo-space-xs, 0.25rem);
+}
+
 .pt-s {
   padding-top: var(--lumo-space-s, 0.5rem);
 }
@@ -2330,6 +2338,10 @@ option{
   --tw-ring-inset: inset;
 }
 
+.focus-within-ring-inset:focus-within {
+  --tw-ring-inset: inset;
+}
+
 .focus-ring-inset:focus {
   --tw-ring-inset: inset;
 }

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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAuKF;aACF,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,IAAI;IACF,cAAc,CACZ,yBAAyB,EACzB,GAAG;;;;;;;;KASF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;KAOF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;KAOF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,cAAc,CACZ,eAAe,EACf,GAAG;;;;;;;KAQF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,uEAAuE;IACvE,cAAc,CACZ,aAAa,EACb,GAAG;;;KAIF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED;;;;;;;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          [hidden] {\n            display: none !important;\n          }\n\n          option {\n            color: var(--lumo-body-text-color);\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              .hljs-tag {\n                color: var(--lumo-tertiary-text-color);\n                font-weight: 500;\n              }\n\n              .hljs-name {\n                color: var(--lumo-primary-text-color);\n                font-weight: 500;\n              }\n\n              .hljs-attr {\n                color: var(--lumo-secondary-text-color);\n                font-weight: 500;\n              }\n\n              .hljs-string {\n                color: var(--lumo-success-text-color);\n                font-weight: 500;\n              }\n            }\n          }\n        `,\n      ];\n    }\n  };\n};\n\ntry {\n  registerStyles(\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} catch {\n  // ignore\n}\n\ntry {\n  registerStyles(\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} catch {\n  // ignore\n}\n\ntry {\n  registerStyles(\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} catch {\n  // ignore\n}\n\ntry {\n  registerStyles(\n    'vaadin-button',\n    css`\n      #button {\n        cursor: pointer;\n      }\n\n      :host([theme~='primary']) {\n        font-weight: 500;\n      }\n    `\n  );\n} catch {\n  // ignore\n}\n\ntry {\n  /** https://github.com/vaadin-component-factory/vcf-tooltip/issues/6 */\n  registerStyles(\n    'vcf-tooltip',\n    css`\n      :host([hidden]) [part='container'] {\n        display: none !important;\n      }\n    `\n  );\n} catch {\n  // ignore\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAuKF;aACF,CAAC;QACJ,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,IAAI;IACF,cAAc,CACZ,yBAAyB,EACzB,GAAG;;;;;;;;KASF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;KAOF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,cAAc,CACZ,qCAAqC,EACrC,GAAG;;;;;;;KAOF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,cAAc,CACZ,eAAe,EACf,GAAG;;;;;;;KAQF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED,IAAI;IACF,uEAAuE;IACvE,cAAc,CACZ,aAAa,EACb,GAAG;;;KAIF,CACF,CAAC;CACH;AAAC,WAAM;IACN,SAAS;CACV;AAED;;;;;;;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          [hidden] {\n            display: none !important;\n          }\n\n          option {\n            color: var(--lumo-body-text-color);\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              .hljs-tag {\n                color: var(--lumo-tertiary-text-color);\n                font-weight: 500;\n              }\n\n              .hljs-name {\n                color: var(--lumo-primary-text-color);\n                font-weight: 500;\n              }\n\n              .hljs-attr {\n                color: var(--lumo-secondary-text-color);\n                font-weight: 500;\n              }\n\n              .hljs-string {\n                color: var(--lumo-success-text-color);\n                font-weight: 500;\n              }\n            }\n          }\n        `,\n      ];\n    }\n  };\n};\n\ntry {\n  registerStyles(\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} catch {\n  // ignore\n}\n\ntry {\n  registerStyles(\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} catch {\n  // ignore\n}\n\ntry {\n  registerStyles(\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} catch {\n  // ignore\n}\n\ntry {\n  registerStyles(\n    'vaadin-button',\n    css`\n      #button {\n        cursor: pointer;\n      }\n\n      :host([theme~='primary']) {\n        font-weight: 500;\n      }\n    `\n  );\n} catch {\n  // ignore\n}\n\ntry {\n  /** https://github.com/vaadin-component-factory/vcf-tooltip/issues/6 */\n  registerStyles(\n    'vcf-tooltip',\n    css`\n      :host([hidden]) [part='container'] {\n        display: none !important;\n      }\n    `\n  );\n} catch {\n  // ignore\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.41.0-beta.2",
+  "version": "1.41.0-beta.3",
   "description": "E-commerce web components by Foxy.",
   "repository": {
     "type": "git",

package/dist/cdn/shared-3661a086.js

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