@foxy.io/elements 1.43.0 → 1.44.0-beta.2

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

@@ -0,0 +1,65 @@
+import { InternalControl } from "../../../../internal/InternalControl/InternalControl.js";
+import { BooleanSelector } from '@foxy.io/sdk/core';
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { html } from 'lit-html';
+export class InternalAdminSubscriptionFormStatusAction extends InternalControl {
+    get hiddenSelector() {
+        const alwaysMatch = [super.hiddenSelector.toString()];
+        alwaysMatch.unshift('form:save-button');
+        return new BooleanSelector(alwaysMatch.join(' ').trim());
+    }
+    renderControl() {
+        var _a, _b;
+        const nucleon = this.nucleon;
+        const endDate = (_a = nucleon === null || nucleon === void 0 ? void 0 : nucleon.data) === null || _a === void 0 ? void 0 : _a.end_date;
+        const isActive = (_b = nucleon === null || nucleon === void 0 ? void 0 : nucleon.data) === null || _b === void 0 ? void 0 : _b.is_active;
+        const isCancelled = endDate && endDate !== '0000-00-00';
+        const status = isActive ? (isCancelled ? 'uncancel' : 'cancel') : 'reactivate';
+        const showActionForm = !isActive || !endDate || endDate === '0000-00-00';
+        return html `
+      <vaadin-button
+        theme="tertiary-inline${showActionForm ? (isActive ? ' error' : ' success') : ''}"
+        @click=${(evt) => {
+            var _a;
+            const button = evt.currentTarget;
+            (_a = this.renderRoot.querySelector('#dialog')) === null || _a === void 0 ? void 0 : _a.show(button);
+        }}
+      >
+        <foxy-i18n infer="" key="caption_${status}"></foxy-i18n>
+      </vaadin-button>
+
+      ${showActionForm
+            ? html `
+            <foxy-form-dialog
+              infer="form"
+              form="foxy-internal-admin-subscription-form-status-action-form"
+              href=${ifDefined(nucleon === null || nucleon === void 0 ? void 0 : nucleon.href)}
+              no-confirm-when-dirty
+              close-on-patch
+              alert
+              id="dialog"
+            >
+            </foxy-form-dialog>
+          `
+            : html `
+            <foxy-internal-confirm-dialog
+              message="uncancel_message"
+              confirm="uncancel_confirm"
+              cancel="uncancel_cancel"
+              header="uncancel_header"
+              infer=""
+              id="dialog"
+              @hide=${(evt) => {
+                var _a, _b;
+                if (!evt.detail.cancelled) {
+                    (_a = this.nucleon) === null || _a === void 0 ? void 0 : _a.edit({ end_date: '0000-00-00' });
+                    (_b = this.nucleon) === null || _b === void 0 ? void 0 : _b.submit();
+                }
+            }}
+            >
+            </foxy-internal-confirm-dialog>
+          `}
+    `;
+    }
+}
+//# sourceMappingURL=InternalAdminSubscriptionFormStatusAction.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InternalAdminSubscriptionFormStatusAction.js","sourceRoot":"","sources":["../../../../../../src/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusAction/InternalAdminSubscriptionFormStatusAction.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,gEAA6D;AACvF,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,OAAO,yCAA0C,SAAQ,eAAe;IAC5E,IAAI,cAAc;QAChB,MAAM,WAAW,GAAG,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;QACtD,WAAW,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QACxC,OAAO,IAAI,eAAe,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAC3D,CAAC;IAED,aAAa;;QACX,MAAM,OAAO,GAAG,IAAI,CAAC,OAAuC,CAAC;QAC7D,MAAM,OAAO,SAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,0CAAE,QAAQ,CAAC;QACxC,MAAM,QAAQ,SAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,0CAAE,SAAS,CAAC;QAC1C,MAAM,WAAW,GAAG,OAAO,IAAI,OAAO,KAAK,YAAY,CAAC;QACxD,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC;QAC/E,MAAM,cAAc,GAAG,CAAC,QAAQ,IAAI,CAAC,OAAO,IAAI,OAAO,KAAK,YAAY,CAAC;QAEzE,OAAO,IAAI,CAAA;;gCAEiB,cAAc,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE;iBACvE,CAAC,GAAU,EAAE,EAAE;;YACtB,MAAM,MAAM,GAAG,GAAG,CAAC,aAA4B,CAAC;YAChD,MAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAa,SAAS,CAAC,0CAAE,IAAI,CAAC,MAAM,EAAE;QACrE,CAAC;;2CAEkC,MAAM;;;QAGzC,cAAc;YACd,CAAC,CAAC,IAAI,CAAA;;;;qBAIO,SAAS,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAC;;;;;;;WAOlC;YACH,CAAC,CAAC,IAAI,CAAA;;;;;;;;sBAQQ,CAAC,GAAoB,EAAE,EAAE;;gBAC/B,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,SAAS,EAAE;oBACzB,MAAA,IAAI,CAAC,OAAO,0CAAE,IAAI,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE;oBAC/C,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,GAAG;iBACxB;YACH,CAAC;;;WAGJ;KACN,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { AdminSubscriptionForm } from '../../AdminSubscriptionForm';\nimport type { DialogHideEvent } from '../../../../private/Dialog/DialogHideEvent';\nimport type { TemplateResult } from 'lit-html';\nimport type { FormDialog } from '../../../FormDialog/FormDialog';\n\nimport { InternalControl } from '../../../../internal/InternalControl/InternalControl';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\nexport class InternalAdminSubscriptionFormStatusAction extends InternalControl {\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = [super.hiddenSelector.toString()];\n    alwaysMatch.unshift('form:save-button');\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderControl(): TemplateResult {\n    const nucleon = this.nucleon as AdminSubscriptionForm | null;\n    const endDate = nucleon?.data?.end_date;\n    const isActive = nucleon?.data?.is_active;\n    const isCancelled = endDate && endDate !== '0000-00-00';\n    const status = isActive ? (isCancelled ? 'uncancel' : 'cancel') : 'reactivate';\n    const showActionForm = !isActive || !endDate || endDate === '0000-00-00';\n\n    return html`\n      <vaadin-button\n        theme=\"tertiary-inline${showActionForm ? (isActive ? ' error' : ' success') : ''}\"\n        @click=${(evt: Event) => {\n          const button = evt.currentTarget as HTMLElement;\n          this.renderRoot.querySelector<FormDialog>('#dialog')?.show(button);\n        }}\n      >\n        <foxy-i18n infer=\"\" key=\"caption_${status}\"></foxy-i18n>\n      </vaadin-button>\n\n      ${showActionForm\n        ? html`\n            <foxy-form-dialog\n              infer=\"form\"\n              form=\"foxy-internal-admin-subscription-form-status-action-form\"\n              href=${ifDefined(nucleon?.href)}\n              no-confirm-when-dirty\n              close-on-patch\n              alert\n              id=\"dialog\"\n            >\n            </foxy-form-dialog>\n          `\n        : html`\n            <foxy-internal-confirm-dialog\n              message=\"uncancel_message\"\n              confirm=\"uncancel_confirm\"\n              cancel=\"uncancel_cancel\"\n              header=\"uncancel_header\"\n              infer=\"\"\n              id=\"dialog\"\n              @hide=${(evt: DialogHideEvent) => {\n                if (!evt.detail.cancelled) {\n                  this.nucleon?.edit({ end_date: '0000-00-00' });\n                  this.nucleon?.submit();\n                }\n              }}\n            >\n            </foxy-internal-confirm-dialog>\n          `}\n    `;\n  }\n}\n"]}

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusAction/index.d.ts

@@ -0,0 +1,8 @@
+import '@vaadin/vaadin-button';
+import '../../../../internal/InternalConfirmDialog/index';
+import '../../../../internal/InternalControl/index';
+import '../../../FormDialog/index';
+import '../../../I18n/index';
+import '../InternalAdminSubscriptionFormStatusActionForm/index';
+import { InternalAdminSubscriptionFormStatusAction } from './InternalAdminSubscriptionFormStatusAction';
+export { InternalAdminSubscriptionFormStatusAction };

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusAction/index.js

@@ -0,0 +1,10 @@
+import '@vaadin/vaadin-button';
+import "../../../../internal/InternalConfirmDialog/index.js";
+import "../../../../internal/InternalControl/index.js";
+import "../../../FormDialog/index.js";
+import "../../../I18n/index.js";
+import "../InternalAdminSubscriptionFormStatusActionForm/index.js";
+import { InternalAdminSubscriptionFormStatusAction } from "./InternalAdminSubscriptionFormStatusAction.js";
+customElements.define('foxy-internal-admin-subscription-form-status-action', InternalAdminSubscriptionFormStatusAction);
+export { InternalAdminSubscriptionFormStatusAction };
+//# sourceMappingURL=index.js.map

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusAction/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusAction/index.ts"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAC;AAE/B,6DAA0D;AAC1D,uDAAoD;AAEpD,sCAAmC;AACnC,gCAA6B;AAE7B,mEAAgE;AAEhE,OAAO,EAAE,yCAAyC,EAAE,uDAAoD;AAExG,cAAc,CAAC,MAAM,CACnB,qDAAqD,EACrD,yCAAyC,CAC1C,CAAC;AAEF,OAAO,EAAE,yCAAyC,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-button';\n\nimport '../../../../internal/InternalConfirmDialog/index';\nimport '../../../../internal/InternalControl/index';\n\nimport '../../../FormDialog/index';\nimport '../../../I18n/index';\n\nimport '../InternalAdminSubscriptionFormStatusActionForm/index';\n\nimport { InternalAdminSubscriptionFormStatusAction } from './InternalAdminSubscriptionFormStatusAction';\n\ncustomElements.define(\n  'foxy-internal-admin-subscription-form-status-action',\n  InternalAdminSubscriptionFormStatusAction\n);\n\nexport { InternalAdminSubscriptionFormStatusAction };\n"]}

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/InternalAdminSubscriptionFormStatusActionForm.d.ts

@@ -0,0 +1,18 @@
+import type { TemplateResult } from 'lit-html';
+import type { NucleonV8N } from '../../../NucleonElement/types';
+import type { Data } from './types';
+import { BooleanSelector } from '@foxy.io/sdk/core';
+import { InternalForm } from '../../../../internal/InternalForm/InternalForm';
+export declare class InternalAdminSubscriptionFormStatusActionForm extends InternalForm<Data> {
+    static get v8n(): NucleonV8N<Data, InternalAdminSubscriptionFormStatusActionForm>;
+    private readonly __endDatePresetOptions;
+    private readonly __endDatePresetGetValue;
+    private readonly __endDatePresetSetValue;
+    private readonly __endDateGetValue;
+    private readonly __nextTransactionDateGetValue;
+    get readonlySelector(): BooleanSelector;
+    renderBody(): TemplateResult;
+    submit(): void;
+    protected _sendPatch(edits: Partial<Data>): Promise<Data>;
+    private __renderFaq;
+}

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

@@ -0,0 +1,185 @@
+import { BooleanSelector } from '@foxy.io/sdk/core';
+import { serializeDate } from "../../../../../utils/serialize-date.js";
+import { InternalForm } from "../../../../internal/InternalForm/InternalForm.js";
+import { parseDate } from "../../../../../utils/parse-date.js";
+import { html, svg } from 'lit-html';
+export class InternalAdminSubscriptionFormStatusActionForm extends InternalForm {
+    constructor() {
+        super(...arguments);
+        this.__endDatePresetOptions = JSON.stringify([
+            { value: 'tomorrow', label: 'option_tomorrow' },
+            { value: 'next_transaction_date', label: 'option_next_transaction_date' },
+            { value: 'custom_date', label: 'option_custom_date' },
+        ]);
+        this.__endDatePresetGetValue = () => { var _a; return (_a = this.form.end_date_preset) !== null && _a !== void 0 ? _a : 'next_transaction_date'; };
+        this.__endDatePresetSetValue = (newValue) => {
+            this.edit({ end_date_preset: newValue });
+            if (newValue === 'tomorrow') {
+                const tomorrowDate = new Date();
+                tomorrowDate.setDate(tomorrowDate.getDate() + 1);
+                tomorrowDate.setHours(0, 0, 0, 0);
+                this.edit({ end_date: serializeDate(tomorrowDate) });
+            }
+            else if (newValue === 'next_transaction_date') {
+                this.edit({ end_date: this.form.next_transaction_date });
+            }
+            else {
+                this.edit({ end_date: '' });
+            }
+        };
+        this.__endDateGetValue = () => {
+            return this.form.end_date_preset ? this.form.end_date : this.form.next_transaction_date;
+        };
+        this.__nextTransactionDateGetValue = () => {
+            const tomorrowDate = new Date();
+            tomorrowDate.setDate(tomorrowDate.getDate() + 1);
+            tomorrowDate.setHours(0, 0, 0, 0);
+            const tomorrow = serializeDate(tomorrowDate);
+            if (!this.form.next_transaction_date)
+                return tomorrow;
+            const currentNextDate = parseDate(this.form.next_transaction_date.substring(0, 10));
+            if (!currentNextDate || currentNextDate < tomorrowDate)
+                return tomorrow;
+            return this.form.next_transaction_date;
+        };
+    }
+    static get v8n() {
+        return [
+            ({ next_transaction_date, end_date }, host) => {
+                var _a;
+                if ((_a = host.data) === null || _a === void 0 ? void 0 : _a.is_active) {
+                    if (!end_date || end_date === '0000-00-00')
+                        return 'end-date:v8n_required';
+                }
+                else {
+                    if (!next_transaction_date)
+                        return 'next-transaction-date:v8n_required';
+                }
+                return true;
+            },
+        ];
+    }
+    get readonlySelector() {
+        const alwaysMatch = [super.readonlySelector.toString()];
+        if (this.form.end_date_preset !== 'custom_date')
+            alwaysMatch.push('end-date');
+        return new BooleanSelector(alwaysMatch.join(' ').trim());
+    }
+    renderBody() {
+        var _a;
+        const tomorrowDate = new Date();
+        tomorrowDate.setDate(tomorrowDate.getDate() + 1);
+        tomorrowDate.setHours(0, 0, 0, 0);
+        const isActive = !!((_a = this.data) === null || _a === void 0 ? void 0 : _a.is_active);
+        const action = isActive ? 'cancel' : 'reactivate';
+        const color = isActive ? 'bg-error-10' : 'bg-success-10';
+        const icon = isActive
+            ? svg `<svg class="text-error" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" style="width: 2rem; height: 2rem;"><path stroke-linecap="round" stroke-linejoin="round" d="M5.25 7.5A2.25 2.25 0 0 1 7.5 5.25h9a2.25 2.25 0 0 1 2.25 2.25v9a2.25 2.25 0 0 1-2.25 2.25h-9a2.25 2.25 0 0 1-2.25-2.25v-9Z" /></svg>`
+            : svg `<svg class="text-success" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" style="width: 2rem; height: 2rem;"><path stroke-linecap="round" stroke-linejoin="round" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" /></svg>`;
+        return html `
+      <foxy-internal-summary-control infer="" label="" helper-text="">
+        <div class="text-center flex flex-col items-center bg-transparent">
+          <div class="rounded-full ${color} p-m mb-s mx-auto">${icon}</div>
+          <p class="font-medium text-xl leading-m">
+            <foxy-i18n infer="" key="${action}_title"></foxy-i18n>
+          </p>
+          <p class="text-secondary leading-s">
+            <foxy-i18n infer="" key="${action}_subtitle"></foxy-i18n>
+          </p>
+        </div>
+      </foxy-internal-summary-control>
+
+      <foxy-internal-summary-control infer="" label="" helper-text="">
+        ${isActive
+            ? html `
+              <foxy-internal-select-control
+                options=${this.__endDatePresetOptions}
+                layout="summary-item"
+                infer="end-date-preset"
+                .getValue=${this.__endDatePresetGetValue}
+                .setValue=${this.__endDatePresetSetValue}
+              >
+              </foxy-internal-select-control>
+
+              <foxy-internal-date-control
+                layout="summary-item"
+                infer="end-date"
+                min=${serializeDate(tomorrowDate)}
+                hide-clear-button
+                .getValue=${this.__endDateGetValue}
+              >
+              </foxy-internal-date-control>
+            `
+            : html `
+              <foxy-internal-date-control
+                layout="summary-item"
+                infer="next-transaction-date"
+                min=${serializeDate(tomorrowDate)}
+                hide-clear-button
+                .getValue=${this.__nextTransactionDateGetValue}
+              >
+              </foxy-internal-date-control>
+            `}
+      </foxy-internal-summary-control>
+
+      <foxy-internal-summary-control infer="" label="" helper-text="">
+        ${isActive
+            ? [
+                this.__renderFaq('cancel_why_not_today', svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="text-error flex-shrink-0" style="width: 1.25em; height: 1.25em;"><path d="M5.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H6a.75.75 0 0 1-.75-.75V12ZM6 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H6ZM7.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H8a.75.75 0 0 1-.75-.75V12ZM8 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H8ZM9.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V10ZM10 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H10ZM9.25 14a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V14ZM12 9.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V10a.75.75 0 0 0-.75-.75H12ZM11.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H12a.75.75 0 0 1-.75-.75V12ZM12 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H12ZM13.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H14a.75.75 0 0 1-.75-.75V10ZM14 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H14Z" /><path fill-rule="evenodd" d="M5.75 2a.75.75 0 0 1 .75.75V4h7V2.75a.75.75 0 0 1 1.5 0V4h.25A2.75 2.75 0 0 1 18 6.75v8.5A2.75 2.75 0 0 1 15.25 18H4.75A2.75 2.75 0 0 1 2 15.25v-8.5A2.75 2.75 0 0 1 4.75 4H5V2.75A.75.75 0 0 1 5.75 2Zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75Z" clip-rule="evenodd" /></svg>`),
+                this.__renderFaq('cancel_whats_next', svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="text-error flex-shrink-0" style="width: 1.25em; height: 1.25em;"><path d="M3.288 4.818A1.5 1.5 0 0 0 1 6.095v7.81a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905c.155-.096.285-.213.389-.344v2.973a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905a1.5 1.5 0 0 0 0-2.552l-6.323-3.906A1.5 1.5 0 0 0 10 6.095v2.972a1.506 1.506 0 0 0-.389-.343L3.288 4.818Z" /></svg>`),
+                this.__renderFaq('cancel_how_to_reactivate', svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="text-error flex-shrink-0" style="width: 1.25em; height: 1.25em;"><path d="M6.111 11.89A5.5 5.5 0 1 1 15.501 8 .75.75 0 0 0 17 8a7 7 0 1 0-11.95 4.95.75.75 0 0 0 1.06-1.06Z" /><path d="M8.232 6.232a2.5 2.5 0 0 0 0 3.536.75.75 0 1 1-1.06 1.06A4 4 0 1 1 14 8a.75.75 0 0 1-1.5 0 2.5 2.5 0 0 0-4.268-1.768Z" /><path d="M10.766 7.51a.75.75 0 0 0-1.37.365l-.492 6.861a.75.75 0 0 0 1.204.65l1.043-.799.985 3.678a.75.75 0 0 0 1.45-.388l-.978-3.646 1.292.204a.75.75 0 0 0 .74-1.16l-3.874-5.764Z" /></svg>`),
+            ]
+            : [
+                this.__renderFaq('reactivate_why_not_today', svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="text-success flex-shrink-0" style="width: 1.25em; height: 1.25em;"><path d="M5.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H6a.75.75 0 0 1-.75-.75V12ZM6 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H6ZM7.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H8a.75.75 0 0 1-.75-.75V12ZM8 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H8ZM9.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V10ZM10 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H10ZM9.25 14a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V14ZM12 9.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V10a.75.75 0 0 0-.75-.75H12ZM11.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H12a.75.75 0 0 1-.75-.75V12ZM12 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H12ZM13.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H14a.75.75 0 0 1-.75-.75V10ZM14 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H14Z" /><path fill-rule="evenodd" d="M5.75 2a.75.75 0 0 1 .75.75V4h7V2.75a.75.75 0 0 1 1.5 0V4h.25A2.75 2.75 0 0 1 18 6.75v8.5A2.75 2.75 0 0 1 15.25 18H4.75A2.75 2.75 0 0 1 2 15.25v-8.5A2.75 2.75 0 0 1 4.75 4H5V2.75A.75.75 0 0 1 5.75 2Zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75Z" clip-rule="evenodd" /></svg>`),
+                this.__renderFaq('reactivate_whats_next', svg `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="text-success flex-shrink-0" style="width: 1.25em; height: 1.25em;"><path d="M3.288 4.818A1.5 1.5 0 0 0 1 6.095v7.81a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905c.155-.096.285-.213.389-.344v2.973a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905a1.5 1.5 0 0 0 0-2.552l-6.323-3.906A1.5 1.5 0 0 0 10 6.095v2.972a1.506 1.506 0 0 0-.389-.343L3.288 4.818Z" /></svg>`),
+            ]}
+      </foxy-internal-summary-control>
+
+      <vaadin-button
+        theme="primary ${isActive ? 'error' : 'success'} large"
+        class="w-full"
+        ?disabled=${this.disabled}
+        @click=${() => this.submit()}
+      >
+        <foxy-i18n infer="" key="${action}_submit"></foxy-i18n>
+      </vaadin-button>
+    `;
+    }
+    submit() {
+        var _a;
+        if ((_a = this.data) === null || _a === void 0 ? void 0 : _a.is_active) {
+            if (this.__endDatePresetGetValue() === 'next_transaction_date') {
+                this.edit({ end_date: this.form.next_transaction_date });
+            }
+        }
+        else {
+            this.edit({
+                next_transaction_date: this.__nextTransactionDateGetValue(),
+                is_active: true,
+                end_date: '0000-00-00',
+            });
+        }
+        super.submit();
+    }
+    async _sendPatch(edits) {
+        delete edits.end_date_preset;
+        return super._sendPatch(edits);
+    }
+    __renderFaq(prefix, icon) {
+        return html `
+      <div
+        class="bg-transparent flex leading-xs"
+        style="gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
+      >
+        ${icon}
+        <p class="grid">
+          <foxy-i18n class="leading-m text-s font-medium" infer="" key="${prefix}_title">
+          </foxy-i18n>
+          <foxy-i18n class="leading-xs text-secondary text-xs" infer="" key="${prefix}_text">
+          </foxy-i18n>
+        </p>
+      </div>
+    `;
+    }
+}
+//# sourceMappingURL=InternalAdminSubscriptionFormStatusActionForm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InternalAdminSubscriptionFormStatusActionForm.js","sourceRoot":"","sources":["../../../../../../src/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/InternalAdminSubscriptionFormStatusActionForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { SVGTemplateResult, TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../../../NucleonElement/types';\nimport type { Data } from './types';\n\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { serializeDate } from '../../../../../utils/serialize-date';\nimport { InternalForm } from '../../../../internal/InternalForm/InternalForm';\nimport { parseDate } from '../../../../../utils/parse-date';\nimport { html, svg } from 'lit-html';\n\nexport class InternalAdminSubscriptionFormStatusActionForm extends InternalForm<Data> {\n  static get v8n(): NucleonV8N<Data, InternalAdminSubscriptionFormStatusActionForm> {\n    return [\n      ({ next_transaction_date, end_date }, host) => {\n        if (host.data?.is_active) {\n          if (!end_date || end_date === '0000-00-00') return 'end-date:v8n_required';\n        } else {\n          if (!next_transaction_date) return 'next-transaction-date:v8n_required';\n        }\n\n        return true;\n      },\n    ];\n  }\n\n  private readonly __endDatePresetOptions = JSON.stringify([\n    { value: 'tomorrow', label: 'option_tomorrow' },\n    { value: 'next_transaction_date', label: 'option_next_transaction_date' },\n    { value: 'custom_date', label: 'option_custom_date' },\n  ]);\n\n  private readonly __endDatePresetGetValue = () =>\n    this.form.end_date_preset ?? 'next_transaction_date';\n\n  private readonly __endDatePresetSetValue = (newValue: string) => {\n    this.edit({ end_date_preset: newValue });\n\n    if (newValue === 'tomorrow') {\n      const tomorrowDate = new Date();\n      tomorrowDate.setDate(tomorrowDate.getDate() + 1);\n      tomorrowDate.setHours(0, 0, 0, 0);\n      this.edit({ end_date: serializeDate(tomorrowDate) });\n    } else if (newValue === 'next_transaction_date') {\n      this.edit({ end_date: this.form.next_transaction_date });\n    } else {\n      this.edit({ end_date: '' });\n    }\n  };\n\n  private readonly __endDateGetValue = () => {\n    return this.form.end_date_preset ? this.form.end_date : this.form.next_transaction_date;\n  };\n\n  private readonly __nextTransactionDateGetValue = () => {\n    const tomorrowDate = new Date();\n    tomorrowDate.setDate(tomorrowDate.getDate() + 1);\n    tomorrowDate.setHours(0, 0, 0, 0);\n\n    const tomorrow = serializeDate(tomorrowDate);\n    if (!this.form.next_transaction_date) return tomorrow;\n\n    const currentNextDate = parseDate(this.form.next_transaction_date.substring(0, 10));\n    if (!currentNextDate || currentNextDate < tomorrowDate) return tomorrow;\n\n    return this.form.next_transaction_date;\n  };\n\n  get readonlySelector(): BooleanSelector {\n    const alwaysMatch = [super.readonlySelector.toString()];\n    if (this.form.end_date_preset !== 'custom_date') alwaysMatch.push('end-date');\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderBody(): TemplateResult {\n    const tomorrowDate = new Date();\n    tomorrowDate.setDate(tomorrowDate.getDate() + 1);\n    tomorrowDate.setHours(0, 0, 0, 0);\n\n    const isActive = !!this.data?.is_active;\n    const action = isActive ? 'cancel' : 'reactivate';\n    const color = isActive ? 'bg-error-10' : 'bg-success-10';\n    const icon = isActive\n      ? svg`<svg class=\"text-error\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" style=\"width: 2rem; height: 2rem;\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5.25 7.5A2.25 2.25 0 0 1 7.5 5.25h9a2.25 2.25 0 0 1 2.25 2.25v9a2.25 2.25 0 0 1-2.25 2.25h-9a2.25 2.25 0 0 1-2.25-2.25v-9Z\" /></svg>`\n      : svg`<svg class=\"text-success\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" style=\"width: 2rem; height: 2rem;\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99\" /></svg>`;\n\n    return html`\n      <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n        <div class=\"text-center flex flex-col items-center bg-transparent\">\n          <div class=\"rounded-full ${color} p-m mb-s mx-auto\">${icon}</div>\n          <p class=\"font-medium text-xl leading-m\">\n            <foxy-i18n infer=\"\" key=\"${action}_title\"></foxy-i18n>\n          </p>\n          <p class=\"text-secondary leading-s\">\n            <foxy-i18n infer=\"\" key=\"${action}_subtitle\"></foxy-i18n>\n          </p>\n        </div>\n      </foxy-internal-summary-control>\n\n      <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n        ${isActive\n          ? html`\n              <foxy-internal-select-control\n                options=${this.__endDatePresetOptions}\n                layout=\"summary-item\"\n                infer=\"end-date-preset\"\n                .getValue=${this.__endDatePresetGetValue}\n                .setValue=${this.__endDatePresetSetValue}\n              >\n              </foxy-internal-select-control>\n\n              <foxy-internal-date-control\n                layout=\"summary-item\"\n                infer=\"end-date\"\n                min=${serializeDate(tomorrowDate)}\n                hide-clear-button\n                .getValue=${this.__endDateGetValue}\n              >\n              </foxy-internal-date-control>\n            `\n          : html`\n              <foxy-internal-date-control\n                layout=\"summary-item\"\n                infer=\"next-transaction-date\"\n                min=${serializeDate(tomorrowDate)}\n                hide-clear-button\n                .getValue=${this.__nextTransactionDateGetValue}\n              >\n              </foxy-internal-date-control>\n            `}\n      </foxy-internal-summary-control>\n\n      <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n        ${isActive\n          ? [\n              this.__renderFaq(\n                'cancel_why_not_today',\n                svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"text-error flex-shrink-0\" style=\"width: 1.25em; height: 1.25em;\"><path d=\"M5.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H6a.75.75 0 0 1-.75-.75V12ZM6 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H6ZM7.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H8a.75.75 0 0 1-.75-.75V12ZM8 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H8ZM9.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V10ZM10 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H10ZM9.25 14a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V14ZM12 9.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V10a.75.75 0 0 0-.75-.75H12ZM11.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H12a.75.75 0 0 1-.75-.75V12ZM12 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H12ZM13.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H14a.75.75 0 0 1-.75-.75V10ZM14 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H14Z\" /><path fill-rule=\"evenodd\" d=\"M5.75 2a.75.75 0 0 1 .75.75V4h7V2.75a.75.75 0 0 1 1.5 0V4h.25A2.75 2.75 0 0 1 18 6.75v8.5A2.75 2.75 0 0 1 15.25 18H4.75A2.75 2.75 0 0 1 2 15.25v-8.5A2.75 2.75 0 0 1 4.75 4H5V2.75A.75.75 0 0 1 5.75 2Zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75Z\" clip-rule=\"evenodd\" /></svg>`\n              ),\n              this.__renderFaq(\n                'cancel_whats_next',\n                svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"text-error flex-shrink-0\" style=\"width: 1.25em; height: 1.25em;\"><path d=\"M3.288 4.818A1.5 1.5 0 0 0 1 6.095v7.81a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905c.155-.096.285-.213.389-.344v2.973a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905a1.5 1.5 0 0 0 0-2.552l-6.323-3.906A1.5 1.5 0 0 0 10 6.095v2.972a1.506 1.506 0 0 0-.389-.343L3.288 4.818Z\" /></svg>`\n              ),\n              this.__renderFaq(\n                'cancel_how_to_reactivate',\n                svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"text-error flex-shrink-0\" style=\"width: 1.25em; height: 1.25em;\"><path d=\"M6.111 11.89A5.5 5.5 0 1 1 15.501 8 .75.75 0 0 0 17 8a7 7 0 1 0-11.95 4.95.75.75 0 0 0 1.06-1.06Z\" /><path d=\"M8.232 6.232a2.5 2.5 0 0 0 0 3.536.75.75 0 1 1-1.06 1.06A4 4 0 1 1 14 8a.75.75 0 0 1-1.5 0 2.5 2.5 0 0 0-4.268-1.768Z\" /><path d=\"M10.766 7.51a.75.75 0 0 0-1.37.365l-.492 6.861a.75.75 0 0 0 1.204.65l1.043-.799.985 3.678a.75.75 0 0 0 1.45-.388l-.978-3.646 1.292.204a.75.75 0 0 0 .74-1.16l-3.874-5.764Z\" /></svg>`\n              ),\n            ]\n          : [\n              this.__renderFaq(\n                'reactivate_why_not_today',\n                svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"text-success flex-shrink-0\" style=\"width: 1.25em; height: 1.25em;\"><path d=\"M5.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H6a.75.75 0 0 1-.75-.75V12ZM6 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H6ZM7.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H8a.75.75 0 0 1-.75-.75V12ZM8 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H8ZM9.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V10ZM10 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H10ZM9.25 14a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H10a.75.75 0 0 1-.75-.75V14ZM12 9.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V10a.75.75 0 0 0-.75-.75H12ZM11.25 12a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H12a.75.75 0 0 1-.75-.75V12ZM12 13.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V14a.75.75 0 0 0-.75-.75H12ZM13.25 10a.75.75 0 0 1 .75-.75h.01a.75.75 0 0 1 .75.75v.01a.75.75 0 0 1-.75.75H14a.75.75 0 0 1-.75-.75V10ZM14 11.25a.75.75 0 0 0-.75.75v.01c0 .414.336.75.75.75h.01a.75.75 0 0 0 .75-.75V12a.75.75 0 0 0-.75-.75H14Z\" /><path fill-rule=\"evenodd\" d=\"M5.75 2a.75.75 0 0 1 .75.75V4h7V2.75a.75.75 0 0 1 1.5 0V4h.25A2.75 2.75 0 0 1 18 6.75v8.5A2.75 2.75 0 0 1 15.25 18H4.75A2.75 2.75 0 0 1 2 15.25v-8.5A2.75 2.75 0 0 1 4.75 4H5V2.75A.75.75 0 0 1 5.75 2Zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75Z\" clip-rule=\"evenodd\" /></svg>`\n              ),\n              this.__renderFaq(\n                'reactivate_whats_next',\n                svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"text-success flex-shrink-0\" style=\"width: 1.25em; height: 1.25em;\"><path d=\"M3.288 4.818A1.5 1.5 0 0 0 1 6.095v7.81a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905c.155-.096.285-.213.389-.344v2.973a1.5 1.5 0 0 0 2.288 1.276l6.323-3.905a1.5 1.5 0 0 0 0-2.552l-6.323-3.906A1.5 1.5 0 0 0 10 6.095v2.972a1.506 1.506 0 0 0-.389-.343L3.288 4.818Z\" /></svg>`\n              ),\n            ]}\n      </foxy-internal-summary-control>\n\n      <vaadin-button\n        theme=\"primary ${isActive ? 'error' : 'success'} large\"\n        class=\"w-full\"\n        ?disabled=${this.disabled}\n        @click=${() => this.submit()}\n      >\n        <foxy-i18n infer=\"\" key=\"${action}_submit\"></foxy-i18n>\n      </vaadin-button>\n    `;\n  }\n\n  submit(): void {\n    if (this.data?.is_active) {\n      if (this.__endDatePresetGetValue() === 'next_transaction_date') {\n        this.edit({ end_date: this.form.next_transaction_date });\n      }\n    } else {\n      this.edit({\n        next_transaction_date: this.__nextTransactionDateGetValue(),\n        is_active: true,\n        end_date: '0000-00-00',\n      });\n    }\n\n    super.submit();\n  }\n\n  protected async _sendPatch(edits: Partial<Data>): Promise<Data> {\n    delete edits.end_date_preset;\n    return super._sendPatch(edits);\n  }\n\n  private __renderFaq(prefix: string, icon: SVGTemplateResult) {\n    return html`\n      <div\n        class=\"bg-transparent flex leading-xs\"\n        style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n      >\n        ${icon}\n        <p class=\"grid\">\n          <foxy-i18n class=\"leading-m text-s font-medium\" infer=\"\" key=\"${prefix}_title\">\n          </foxy-i18n>\n          <foxy-i18n class=\"leading-xs text-secondary text-xs\" infer=\"\" key=\"${prefix}_text\">\n          </foxy-i18n>\n        </p>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/index.d.ts

@@ -0,0 +1,8 @@
+import '@vaadin/vaadin-button';
+import '../../../../internal/InternalSummaryControl/index';
+import '../../../../internal/InternalSelectControl/index';
+import '../../../../internal/InternalDateControl/index';
+import '../../../../internal/InternalForm/index';
+import '../../../I18n/index';
+import { InternalAdminSubscriptionFormStatusActionForm } from './InternalAdminSubscriptionFormStatusActionForm';
+export { InternalAdminSubscriptionFormStatusActionForm };

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/index.js

@@ -0,0 +1,10 @@
+import '@vaadin/vaadin-button';
+import "../../../../internal/InternalSummaryControl/index.js";
+import "../../../../internal/InternalSelectControl/index.js";
+import "../../../../internal/InternalDateControl/index.js";
+import "../../../../internal/InternalForm/index.js";
+import "../../../I18n/index.js";
+import { InternalAdminSubscriptionFormStatusActionForm } from "./InternalAdminSubscriptionFormStatusActionForm.js";
+customElements.define('foxy-internal-admin-subscription-form-status-action-form', InternalAdminSubscriptionFormStatusActionForm);
+export { InternalAdminSubscriptionFormStatusActionForm };
+//# sourceMappingURL=index.js.map

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/index.ts"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAC;AAE/B,8DAA2D;AAC3D,6DAA0D;AAC1D,2DAAwD;AACxD,oDAAiD;AAEjD,gCAA6B;AAE7B,OAAO,EAAE,6CAA6C,EAAE,2DAAwD;AAEhH,cAAc,CAAC,MAAM,CACnB,0DAA0D,EAC1D,6CAA6C,CAC9C,CAAC;AAEF,OAAO,EAAE,6CAA6C,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-button';\n\nimport '../../../../internal/InternalSummaryControl/index';\nimport '../../../../internal/InternalSelectControl/index';\nimport '../../../../internal/InternalDateControl/index';\nimport '../../../../internal/InternalForm/index';\n\nimport '../../../I18n/index';\n\nimport { InternalAdminSubscriptionFormStatusActionForm } from './InternalAdminSubscriptionFormStatusActionForm';\n\ncustomElements.define(\n  'foxy-internal-admin-subscription-form-status-action-form',\n  InternalAdminSubscriptionFormStatusActionForm\n);\n\nexport { InternalAdminSubscriptionFormStatusActionForm };\n"]}

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/types.d.ts

@@ -0,0 +1,5 @@
+import type { Resource } from '@foxy.io/sdk/core';
+import type { Rels } from '@foxy.io/sdk/backend';
+export declare type Data = Resource<Rels.Subscription> & {
+    end_date_preset?: string | null;
+};

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../../src/elements/public/AdminSubscriptionForm/internal/InternalAdminSubscriptionFormStatusActionForm/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nexport type Data = Resource<Rels.Subscription> & { end_date_preset?: string | null };\n"]}

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

@@ -14,6 +14,8 @@ import { BooleanSelector } from '@foxy.io/sdk/core';
 export declare class FormDialog extends Dialog {
     /** @readonly */
     static get properties(): PropertyDeclarations;
+    /** If true, FormDialog won't show the confirmation dialog when the form is dirty. */
+    noConfirmWhenDirty: boolean;
     /** If true, FormDialog will automatically close after the associated form updates the resource. */
     closeOnPatch: boolean;
     /** If true, FormDialog won't automatically close after the associated form deletes the resource. */

package/dist/elements/public/FormDialog/FormDialog.js

@@ -17,6 +17,8 @@ import { BooleanSelector } from '@foxy.io/sdk/core';
 export class FormDialog extends Dialog {
     constructor() {
         super(...arguments);
+        /** If true, FormDialog won't show the confirmation dialog when the form is dirty. */
+        this.noConfirmWhenDirty = false;
         /** If true, FormDialog will automatically close after the associated form updates the resource. */
         this.closeOnPatch = false;
         /** If true, FormDialog won't automatically close after the associated form deletes the resource. */
@@ -76,6 +78,7 @@ export class FormDialog extends Dialog {
             closeOnPatch: { type: Boolean, attribute: 'close-on-patch' },
             keepOpenOnPost: { type: Boolean, attribute: 'keep-open-on-post' },
             keepOpenOnDelete: { type: Boolean, attribute: 'keep-open-on-delete' },
+            noConfirmWhenDirty: { type: Boolean, attribute: 'no-confirm-when-dirty' },
         };
     }
     get hiddenSelector() {
@@ -150,7 +153,7 @@ export class FormDialog extends Dialog {
     `;
     }
     async hide(cancelled = false) {
-        if (cancelled && this.editable) {
+        if (cancelled && this.editable && !this.noConfirmWhenDirty) {
             const confirm = this.renderRoot.querySelector('#confirm');
             confirm.show();
         }

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

@@ -1 +1 @@
-{"version":3,"file":"FormDialog.js","sourceRoot":"","sources":["../../../../src/elements/public/FormDialog/FormDialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { API } from '../NucleonElement/API';\nimport { Dialog } from '../../private/Dialog/Dialog';\nimport { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { FormRenderer } from './types';\nimport { InternalConfirmDialog } from '../../internal/InternalConfirmDialog/InternalConfirmDialog';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { UpdateEvent } from '../NucleonElement/UpdateEvent';\nimport { spread } from '@open-wc/lit-helpers';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\n\n/**\n * Dialog wrapper for the forms made with NucleonElement.\n *\n * @fires FormDialog#show - Instance of `FormDialog.ShowEvent`. Dispatched after dialog finishes entry transition.\n * @fires FormDialog#hide - Instance of `FormDialog.HideEvent`. Dispatched after dialog finishes exit transition.\n *\n * @element foxy-form-dialog\n * @since 1.1.0\n */\nexport class FormDialog extends Dialog {\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      href: { type: String },\n      form: { type: String, noAccessor: true },\n      group: { type: String },\n      props: { type: Object },\n      parent: { type: String },\n      related: { type: Array },\n      closeOnPatch: { type: Boolean, attribute: 'close-on-patch' },\n      keepOpenOnPost: { type: Boolean, attribute: 'keep-open-on-post' },\n      keepOpenOnDelete: { type: Boolean, attribute: 'keep-open-on-delete' },\n    };\n  }\n\n  /** If true, FormDialog will automatically close after the associated form updates the resource. */\n  closeOnPatch = false;\n\n  /** If true, FormDialog won't automatically close after the associated form deletes the resource. */\n  keepOpenOnDelete = false;\n\n  /** If true, FormDialog won't automatically close after the associated form creates a resource. */\n  keepOpenOnPost = false;\n\n  /** Optional URI list of the related resources (passed to form). */\n  related: string[] = [];\n\n  /** Optional URL of the collection this resource belongs to (passed to form). */\n  parent = '';\n\n  /** Properties to set on the form element using the `spread()` helper. */\n  props: Record<string, unknown> = {};\n\n  group = '';\n\n  /** Optional URL of the resource to load (passed to form). */\n  href = '';\n\n  private __form: string | null | FormRenderer = null;\n\n  private __renderForm: FormRenderer | null = null;\n\n  private __handleFetch = (evt: Event) => {\n    if (!(evt instanceof FetchEvent)) return;\n\n    evt.stopImmediatePropagation();\n    evt.preventDefault();\n    evt.respondWith(new API(this).fetch(evt.request));\n  };\n\n  private __handleUpdate = (evt: Event) => {\n    if (!(evt instanceof UpdateEvent)) return;\n\n    const result = evt.detail?.result;\n    const Result = UpdateEvent.UpdateResult;\n    const target = evt.currentTarget as NucleonElement<never>;\n\n    if (\n      (!this.keepOpenOnDelete && result === Result.ResourceDeleted) ||\n      (!this.keepOpenOnPost && result === Result.ResourceCreated) ||\n      (this.closeOnPatch && result === Result.ResourceUpdated && target.errors.length === 0)\n    ) {\n      this.open = false;\n    }\n\n    if (this.parent !== target.parent) this.parent = target.parent;\n    if (this.href !== target.href) this.href = target.href;\n\n    this.closable = !target.in('busy');\n    this.editable =\n      target.in({ idle: { template: { dirty: 'valid' } } }) ||\n      target.in({ idle: { snapshot: { dirty: 'valid' } } });\n  };\n\n  get hiddenSelector(): BooleanSelector {\n    return new BooleanSelector(`submit undo ${super.hiddenSelector}`.trim());\n  }\n\n  /**\n   * Form's custom element tag. Generated custom element will have the following attributes:\n   *\n   * - `parent` – same as `foxy-form-dialog[parent]`;\n   * - `href` – same as `foxy-form-dialog[href]`;\n   * - `lang` – same as `foxy-form-dialog[lang]`;\n   */\n  get form(): string | null | FormRenderer {\n    return this.__form;\n  }\n\n  set form(value: string | null | FormRenderer) {\n    this.__form = value;\n\n    if (typeof value === 'string') {\n      this.__renderForm = new Function(\n        'options',\n        `return options.html\\`\n          <${value}\n            id=\"form\"\n            ns=\"$\\{options.dialog.ns} $\\{customElements.get('${value}')?.defaultNS ?? ''}\"\n            href=\\${options.dialog.href}\n            lang=\\${options.dialog.lang}\n            group=\\${options.dialog.group}\n            parent=\\${options.dialog.parent}\n            disabledcontrols=\\${options.dialog.disabledSelector.toString()}\n            readonlycontrols=\\${options.dialog.readonlySelector.toString()}\n            hiddencontrols=\\${options.dialog.hiddenSelector.toString()}\n            ?disabled=\\${options.dialog.disabled}\n            ?readonly=\\${options.dialog.readonly}\n            ?hidden=\\${options.dialog.hidden}\n            .templates=\\${options.dialog.templates}\n            .related=\\${options.dialog.related}\n            ...=$\\{options.spread(options.dialog.props)}\n            @fetch=\\${options.handleFetch}\n            @update=\\${options.handleUpdate}\n          >\n          </${value}>\\``\n      ) as FormRenderer;\n    } else {\n      this.__renderForm = value;\n    }\n\n    this.requestUpdate();\n  }\n\n  /** @readonly */\n  render(): TemplateResult {\n    return html`\n      <foxy-internal-confirm-dialog\n        message=\"undo_message\"\n        confirm=\"undo_confirm\"\n        cancel=\"undo_cancel\"\n        header=\"undo_header\"\n        theme=\"error\"\n        lang=${this.lang}\n        ns=${this.ns}\n        id=\"confirm\"\n        @hide=${(evt: DialogHideEvent) => !evt.detail.cancelled && super.hide(true)}\n      >\n      </foxy-internal-confirm-dialog>\n\n      ${super.render(() => {\n        return html`${this.__renderForm?.({\n          handleUpdate: this.__handleUpdate,\n          handleFetch: this.__handleFetch,\n          spread: spread,\n          dialog: this,\n          html,\n        })}`;\n      })}\n    `;\n  }\n\n  async hide(cancelled = false): Promise<void> {\n    if (cancelled && this.editable) {\n      const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n      confirm.show();\n    } else {\n      return super.hide(cancelled);\n    }\n  }\n\n  /** Submits the form. */\n  async save(): Promise<void> {\n    (this.renderRoot.querySelector('#form') as NucleonElement<never>).submit();\n  }\n}\n"]}
+{"version":3,"file":"FormDialog.js","sourceRoot":"","sources":["../../../../src/elements/public/FormDialog/FormDialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { API } from '../NucleonElement/API';\nimport { Dialog } from '../../private/Dialog/Dialog';\nimport { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { FormRenderer } from './types';\nimport { InternalConfirmDialog } from '../../internal/InternalConfirmDialog/InternalConfirmDialog';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { UpdateEvent } from '../NucleonElement/UpdateEvent';\nimport { spread } from '@open-wc/lit-helpers';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\n\n/**\n * Dialog wrapper for the forms made with NucleonElement.\n *\n * @fires FormDialog#show - Instance of `FormDialog.ShowEvent`. Dispatched after dialog finishes entry transition.\n * @fires FormDialog#hide - Instance of `FormDialog.HideEvent`. Dispatched after dialog finishes exit transition.\n *\n * @element foxy-form-dialog\n * @since 1.1.0\n */\nexport class FormDialog extends Dialog {\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      href: { type: String },\n      form: { type: String, noAccessor: true },\n      group: { type: String },\n      props: { type: Object },\n      parent: { type: String },\n      related: { type: Array },\n      closeOnPatch: { type: Boolean, attribute: 'close-on-patch' },\n      keepOpenOnPost: { type: Boolean, attribute: 'keep-open-on-post' },\n      keepOpenOnDelete: { type: Boolean, attribute: 'keep-open-on-delete' },\n      noConfirmWhenDirty: { type: Boolean, attribute: 'no-confirm-when-dirty' },\n    };\n  }\n\n  /** If true, FormDialog won't show the confirmation dialog when the form is dirty. */\n  noConfirmWhenDirty = false;\n\n  /** If true, FormDialog will automatically close after the associated form updates the resource. */\n  closeOnPatch = false;\n\n  /** If true, FormDialog won't automatically close after the associated form deletes the resource. */\n  keepOpenOnDelete = false;\n\n  /** If true, FormDialog won't automatically close after the associated form creates a resource. */\n  keepOpenOnPost = false;\n\n  /** Optional URI list of the related resources (passed to form). */\n  related: string[] = [];\n\n  /** Optional URL of the collection this resource belongs to (passed to form). */\n  parent = '';\n\n  /** Properties to set on the form element using the `spread()` helper. */\n  props: Record<string, unknown> = {};\n\n  group = '';\n\n  /** Optional URL of the resource to load (passed to form). */\n  href = '';\n\n  private __form: string | null | FormRenderer = null;\n\n  private __renderForm: FormRenderer | null = null;\n\n  private __handleFetch = (evt: Event) => {\n    if (!(evt instanceof FetchEvent)) return;\n\n    evt.stopImmediatePropagation();\n    evt.preventDefault();\n    evt.respondWith(new API(this).fetch(evt.request));\n  };\n\n  private __handleUpdate = (evt: Event) => {\n    if (!(evt instanceof UpdateEvent)) return;\n\n    const result = evt.detail?.result;\n    const Result = UpdateEvent.UpdateResult;\n    const target = evt.currentTarget as NucleonElement<never>;\n\n    if (\n      (!this.keepOpenOnDelete && result === Result.ResourceDeleted) ||\n      (!this.keepOpenOnPost && result === Result.ResourceCreated) ||\n      (this.closeOnPatch && result === Result.ResourceUpdated && target.errors.length === 0)\n    ) {\n      this.open = false;\n    }\n\n    if (this.parent !== target.parent) this.parent = target.parent;\n    if (this.href !== target.href) this.href = target.href;\n\n    this.closable = !target.in('busy');\n    this.editable =\n      target.in({ idle: { template: { dirty: 'valid' } } }) ||\n      target.in({ idle: { snapshot: { dirty: 'valid' } } });\n  };\n\n  get hiddenSelector(): BooleanSelector {\n    return new BooleanSelector(`submit undo ${super.hiddenSelector}`.trim());\n  }\n\n  /**\n   * Form's custom element tag. Generated custom element will have the following attributes:\n   *\n   * - `parent` – same as `foxy-form-dialog[parent]`;\n   * - `href` – same as `foxy-form-dialog[href]`;\n   * - `lang` – same as `foxy-form-dialog[lang]`;\n   */\n  get form(): string | null | FormRenderer {\n    return this.__form;\n  }\n\n  set form(value: string | null | FormRenderer) {\n    this.__form = value;\n\n    if (typeof value === 'string') {\n      this.__renderForm = new Function(\n        'options',\n        `return options.html\\`\n          <${value}\n            id=\"form\"\n            ns=\"$\\{options.dialog.ns} $\\{customElements.get('${value}')?.defaultNS ?? ''}\"\n            href=\\${options.dialog.href}\n            lang=\\${options.dialog.lang}\n            group=\\${options.dialog.group}\n            parent=\\${options.dialog.parent}\n            disabledcontrols=\\${options.dialog.disabledSelector.toString()}\n            readonlycontrols=\\${options.dialog.readonlySelector.toString()}\n            hiddencontrols=\\${options.dialog.hiddenSelector.toString()}\n            ?disabled=\\${options.dialog.disabled}\n            ?readonly=\\${options.dialog.readonly}\n            ?hidden=\\${options.dialog.hidden}\n            .templates=\\${options.dialog.templates}\n            .related=\\${options.dialog.related}\n            ...=$\\{options.spread(options.dialog.props)}\n            @fetch=\\${options.handleFetch}\n            @update=\\${options.handleUpdate}\n          >\n          </${value}>\\``\n      ) as FormRenderer;\n    } else {\n      this.__renderForm = value;\n    }\n\n    this.requestUpdate();\n  }\n\n  /** @readonly */\n  render(): TemplateResult {\n    return html`\n      <foxy-internal-confirm-dialog\n        message=\"undo_message\"\n        confirm=\"undo_confirm\"\n        cancel=\"undo_cancel\"\n        header=\"undo_header\"\n        theme=\"error\"\n        lang=${this.lang}\n        ns=${this.ns}\n        id=\"confirm\"\n        @hide=${(evt: DialogHideEvent) => !evt.detail.cancelled && super.hide(true)}\n      >\n      </foxy-internal-confirm-dialog>\n\n      ${super.render(() => {\n        return html`${this.__renderForm?.({\n          handleUpdate: this.__handleUpdate,\n          handleFetch: this.__handleFetch,\n          spread: spread,\n          dialog: this,\n          html,\n        })}`;\n      })}\n    `;\n  }\n\n  async hide(cancelled = false): Promise<void> {\n    if (cancelled && this.editable && !this.noConfirmWhenDirty) {\n      const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n      confirm.show();\n    } else {\n      return super.hide(cancelled);\n    }\n  }\n\n  /** Submits the form. */\n  async save(): Promise<void> {\n    (this.renderRoot.querySelector('#form') as NucleonElement<never>).submit();\n  }\n}\n"]}

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

@@ -1,8 +1,8 @@
 import type { PropertyDeclarations } from 'lit-element';
 import type { TemplateResult } from 'lit-html';
 import type { Data } from './types';
-import { TwoLineCard } from '../CustomFieldCard/TwoLineCard';
-declare const Base: typeof TwoLineCard & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+import { InternalCard } from '../../internal/InternalCard/InternalCard';
+declare const Base: typeof InternalCard & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
 };
 /**

package/dist/elements/public/PaymentsApiPaymentMethodCard/PaymentsApiPaymentMethodCard.js

@@ -1,8 +1,8 @@
 import { TranslatableMixin } from "../../../mixins/translatable.js";
-import { TwoLineCard } from "../CustomFieldCard/TwoLineCard.js";
+import { InternalCard } from "../../internal/InternalCard/InternalCard.js";
 import { html } from 'lit-html';
 const NS = 'payments-api-payment-method-card';
-const Base = TranslatableMixin(TwoLineCard, NS);
+const Base = TranslatableMixin(InternalCard, NS);
 /**
  * Card element representing a `fx:payment_method` resource of Payments API.
  *
@@ -34,12 +34,6 @@ export class PaymentsApiPaymentMethodCard extends Base {
     }
     renderBody() {
         var _a, _b;
-        const defaultLayout = super.renderBody({
-            title: data => html `${data.helper.name}`,
-            subtitle: data => html `${data.description}`,
-        });
-        if (!this.in({ idle: 'snapshot' }))
-            return defaultLayout;
         const defaultSrc = PaymentsApiPaymentMethodCard.defaultImageSrc;
         const data = this.data;
         return html `
@@ -53,8 +47,9 @@ export class PaymentsApiPaymentMethodCard extends Base {
           alt=${this.t('image_alt')}
           @error=${(evt) => (evt.currentTarget.src = defaultSrc)}
         />
-
-        <figcaption class="min-w-0 flex-1">${defaultLayout}</figcaption>
+        <figcaption class="min-w-0 flex-1" data-testid="title">
+          ${data === null || data === void 0 ? void 0 : data.helper.name}&ZeroWidthSpace;
+        </figcaption>
       </figure>
     `;
     }

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

@@ -1 +1 @@
-{"version":3,"file":"PaymentsApiPaymentMethodCard.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentMethodCard/PaymentsApiPaymentMethodCard.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,WAAW,EAAE,0CAAuC;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,kCAAkC,CAAC;AAC9C,MAAM,IAAI,GAAG,iBAAiB,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;AAEhD;;;;;;;;;;GAUG;AACH,MAAM,OAAO,4BAA6B,SAAQ,IAAU;IAA5D;;QAYE;;;WAGG;QACH,gBAAW,GAAsC,IAAI,CAAC;IA6BxD,CAAC;IA5CC,MAAM,KAAK,eAAe;QACxB,OAAO,goBAAgoB,CAAC;IAC1oB,CAAC;IAED,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,WAAW,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAClC,CAAC;IACJ,CAAC;IAQD,UAAU;;QACR,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC;YACrC,KAAK,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YACxC,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA,GAAG,IAAI,CAAC,WAAW,EAAE;SAC5C,CAAC,CAAC;QAEH,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;YAAE,OAAO,aAAa,CAAC;QAEzD,MAAM,UAAU,GAAG,4BAA4B,CAAC,eAAe,CAAC;QAChE,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QAEvB,OAAO,IAAI,CAAA;;;;;;;gBAOC,MAAA,CAAC,IAAI,CAAC,CAAC,OAAC,IAAI,CAAC,WAAW,+CAAhB,IAAI,EAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,mCAAI,UAAU;gBAC3D,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC;mBAChB,CAAC,GAAU,EAAE,EAAE,CAAC,CAAE,GAAG,CAAC,aAAkC,CAAC,GAAG,GAAG,UAAU,CAAC;;;6CAGhD,aAAa;;KAErD,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { TwoLineCard } from '../CustomFieldCard/TwoLineCard';\nimport { html } from 'lit-html';\n\nconst NS = 'payments-api-payment-method-card';\nconst Base = TranslatableMixin(TwoLineCard, NS);\n\n/**\n * Card element representing a `fx:payment_method` resource of Payments API.\n *\n * _Payments API is a client-side virtual API layer built on top of hAPI\n * in an attempt to streamline access to stores' payment method settings\n * that is currently a bit quirky due to the legacy functionality. To use\n * this element with hAPI, wrap it into a foxy-payments-api node._\n *\n * @element foxy-payments-api-payment-method-card\n * @since 1.21.0\n */\nexport class PaymentsApiPaymentMethodCard extends Base<Data> {\n  static get defaultImageSrc(): string {\n    return \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 44 44'%3E%3Cpath fill='%23fff' d='m29.3 14 14-14H32.1l-14 14h11.2Zm2.7 9.9 12-12V.7L30.62 14.1A2 2 0 0 1 32 16v7.9ZM13.31 44h11.18L44 24.5V13.3l-12 12V28a2 2 0 0 1-2 2h-2.69l-14 14Zm-1.41 0H.7l14-14h11.2l-14 14Zm14 0h11.2l6.9-6.9V25.9L25.9 44Zm12.6 0H44v-5.5L38.5 44Z'/%3E%3Cpath fill='%23fff' d='M30 28H14v-6h16v6Zm0-10v-2H14v2h16ZM0 43.3l13.4-13.4A2 2 0 0 1 12 28v-7.9L0 32.12V43.3Z'/%3E%3Cpath fill='%23fff' d='M16.7 14H14c-1.11 0-1.99.89-1.99 2v2.7L0 30.7V19.52L19.52 0H30.7l-14 14Zm1.4-14H6.92L0 6.92V18.1L18.1 0ZM5.5 0H0v5.5L5.5 0Z'/%3E%3C/svg%3E\";\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      getImageSrc: { attribute: false },\n    };\n  }\n\n  /**\n   * Payment method image/logo URL getter.\n   * If left `null`, the card will display the default image.\n   */\n  getImageSrc: ((type: string) => string) | null = null;\n\n  renderBody(): TemplateResult {\n    const defaultLayout = super.renderBody({\n      title: data => html`${data.helper.name}`,\n      subtitle: data => html`${data.description}`,\n    });\n\n    if (!this.in({ idle: 'snapshot' })) return defaultLayout;\n\n    const defaultSrc = PaymentsApiPaymentMethodCard.defaultImageSrc;\n    const data = this.data;\n\n    return html`\n      <figure\n        class=\"flex items-center\"\n        style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n      >\n        <img\n          class=\"relative h-s w-s object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs\"\n          src=${(data ? this.getImageSrc?.(data.type) : null) ?? defaultSrc}\n          alt=${this.t('image_alt')}\n          @error=${(evt: Event) => ((evt.currentTarget as HTMLImageElement).src = defaultSrc)}\n        />\n\n        <figcaption class=\"min-w-0 flex-1\">${defaultLayout}</figcaption>\n      </figure>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"PaymentsApiPaymentMethodCard.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentMethodCard/PaymentsApiPaymentMethodCard.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,kCAAkC,CAAC;AAC9C,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD;;;;;;;;;;GAUG;AACH,MAAM,OAAO,4BAA6B,SAAQ,IAAU;IAA5D;;QAYE;;;WAGG;QACH,gBAAW,GAAsC,IAAI,CAAC;IAuBxD,CAAC;IAtCC,MAAM,KAAK,eAAe;QACxB,OAAO,goBAAgoB,CAAC;IAC1oB,CAAC;IAED,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,WAAW,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAClC,CAAC;IACJ,CAAC;IAQD,UAAU;;QACR,MAAM,UAAU,GAAG,4BAA4B,CAAC,eAAe,CAAC;QAChE,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QAEvB,OAAO,IAAI,CAAA;;;;;;;gBAOC,MAAA,CAAC,IAAI,CAAC,CAAC,OAAC,IAAI,CAAC,WAAW,+CAAhB,IAAI,EAAe,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,mCAAI,UAAU;gBAC3D,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC;mBAChB,CAAC,GAAU,EAAE,EAAE,CAAC,CAAE,GAAG,CAAC,aAAkC,CAAC,GAAG,GAAG,UAAU,CAAC;;;YAGjF,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,CAAC,IAAI;;;KAGxB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { html } from 'lit-html';\n\nconst NS = 'payments-api-payment-method-card';\nconst Base = TranslatableMixin(InternalCard, NS);\n\n/**\n * Card element representing a `fx:payment_method` resource of Payments API.\n *\n * _Payments API is a client-side virtual API layer built on top of hAPI\n * in an attempt to streamline access to stores' payment method settings\n * that is currently a bit quirky due to the legacy functionality. To use\n * this element with hAPI, wrap it into a foxy-payments-api node._\n *\n * @element foxy-payments-api-payment-method-card\n * @since 1.21.0\n */\nexport class PaymentsApiPaymentMethodCard extends Base<Data> {\n  static get defaultImageSrc(): string {\n    return \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 44 44'%3E%3Cpath fill='%23fff' d='m29.3 14 14-14H32.1l-14 14h11.2Zm2.7 9.9 12-12V.7L30.62 14.1A2 2 0 0 1 32 16v7.9ZM13.31 44h11.18L44 24.5V13.3l-12 12V28a2 2 0 0 1-2 2h-2.69l-14 14Zm-1.41 0H.7l14-14h11.2l-14 14Zm14 0h11.2l6.9-6.9V25.9L25.9 44Zm12.6 0H44v-5.5L38.5 44Z'/%3E%3Cpath fill='%23fff' d='M30 28H14v-6h16v6Zm0-10v-2H14v2h16ZM0 43.3l13.4-13.4A2 2 0 0 1 12 28v-7.9L0 32.12V43.3Z'/%3E%3Cpath fill='%23fff' d='M16.7 14H14c-1.11 0-1.99.89-1.99 2v2.7L0 30.7V19.52L19.52 0H30.7l-14 14Zm1.4-14H6.92L0 6.92V18.1L18.1 0ZM5.5 0H0v5.5L5.5 0Z'/%3E%3C/svg%3E\";\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      getImageSrc: { attribute: false },\n    };\n  }\n\n  /**\n   * Payment method image/logo URL getter.\n   * If left `null`, the card will display the default image.\n   */\n  getImageSrc: ((type: string) => string) | null = null;\n\n  renderBody(): TemplateResult {\n    const defaultSrc = PaymentsApiPaymentMethodCard.defaultImageSrc;\n    const data = this.data;\n\n    return html`\n      <figure\n        class=\"flex items-center\"\n        style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n      >\n        <img\n          class=\"relative h-s w-s object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs\"\n          src=${(data ? this.getImageSrc?.(data.type) : null) ?? defaultSrc}\n          alt=${this.t('image_alt')}\n          @error=${(evt: Event) => ((evt.currentTarget as HTMLImageElement).src = defaultSrc)}\n        />\n        <figcaption class=\"min-w-0 flex-1\" data-testid=\"title\">\n          ${data?.helper.name}&ZeroWidthSpace;\n        </figcaption>\n      </figure>\n    `;\n  }\n}\n"]}

package/dist/elements/public/PaymentsApiPaymentMethodCard/index.d.ts

@@ -1,5 +1,3 @@
-import '../../internal/InternalSandbox/index';
-import '../Spinner/index';
-import '../I18n/index';
+import '../../internal/InternalCard/index';
 import { PaymentsApiPaymentMethodCard } from './PaymentsApiPaymentMethodCard';
 export { PaymentsApiPaymentMethodCard };

package/dist/elements/public/PaymentsApiPaymentMethodCard/index.js

@@ -1,6 +1,4 @@
-import "../../internal/InternalSandbox/index.js";
-import "../Spinner/index.js";
-import "../I18n/index.js";
+import "../../internal/InternalCard/index.js";
 import { PaymentsApiPaymentMethodCard } from "./PaymentsApiPaymentMethodCard.js";
 customElements.define('foxy-payments-api-payment-method-card', PaymentsApiPaymentMethodCard);
 export { PaymentsApiPaymentMethodCard };

package/dist/elements/public/PaymentsApiPaymentMethodCard/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentMethodCard/index.ts"],"names":[],"mappings":"AAAA,iDAA8C;AAE9C,6BAA0B;AAC1B,0BAAuB;AAEvB,OAAO,EAAE,4BAA4B,EAAE,0CAAuC;AAE9E,cAAc,CAAC,MAAM,CAAC,uCAAuC,EAAE,4BAA4B,CAAC,CAAC;AAE7F,OAAO,EAAE,4BAA4B,EAAE,CAAC","sourcesContent":["import '../../internal/InternalSandbox/index';\n\nimport '../Spinner/index';\nimport '../I18n/index';\n\nimport { PaymentsApiPaymentMethodCard } from './PaymentsApiPaymentMethodCard';\n\ncustomElements.define('foxy-payments-api-payment-method-card', PaymentsApiPaymentMethodCard);\n\nexport { PaymentsApiPaymentMethodCard };\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentMethodCard/index.ts"],"names":[],"mappings":"AAAA,8CAA2C;AAE3C,OAAO,EAAE,4BAA4B,EAAE,0CAAuC;AAE9E,cAAc,CAAC,MAAM,CAAC,uCAAuC,EAAE,4BAA4B,CAAC,CAAC;AAE7F,OAAO,EAAE,4BAA4B,EAAE,CAAC","sourcesContent":["import '../../internal/InternalCard/index';\n\nimport { PaymentsApiPaymentMethodCard } from './PaymentsApiPaymentMethodCard';\n\ncustomElements.define('foxy-payments-api-payment-method-card', PaymentsApiPaymentMethodCard);\n\nexport { PaymentsApiPaymentMethodCard };\n"]}

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

@@ -37,6 +37,7 @@ export declare class PaymentsApiPaymentMethodForm extends Base<Data> {
     private readonly __threeDSecureToggleSetValue;
     private readonly __threeDSecureToggleOptions;
     private readonly __cardVerificationOptions;
+    private __search;
     get hiddenSelector(): BooleanSelector;
     renderHeader(...params: Parameters<InternalForm<Data>['renderHeader']>): TemplateResult;
     get headerTitleOptions(): Record<string, unknown>;