@foxy.io/elements 1.27.0-beta.2 → 1.27.0-beta.4

package/dist/elements/public/CouponCodesForm/CouponCodesForm.js

@@ -1,22 +1,17 @@
-import { ScopedElementsMixin } from '@open-wc/scoped-elements';
-import { html } from 'lit-html';
-import { ConfigurableMixin } from "../../../mixins/configurable.js";
-import { EditableList } from "../../private/EditableList/EditableList.js";
-import { Group } from "../../private/Group/Group.js";
-import { NucleonElement } from "../NucleonElement/NucleonElement.js";
-import { ThemeableMixin } from "../../../mixins/themeable.js";
 import { TranslatableMixin } from "../../../mixins/translatable.js";
-import { classMap } from "../../../utils/class-map.js";
+import { BooleanSelector } from '@foxy.io/sdk/core';
+import { InternalForm } from "../../internal/InternalForm/InternalForm.js";
+import { html } from 'lit-html';
 const NS = 'coupon-codes-form';
-const Base = ConfigurableMixin(ThemeableMixin(ScopedElementsMixin(TranslatableMixin(NucleonElement, NS))));
+const Base = TranslatableMixin(InternalForm, NS);
 /**
  * Form element for importing coupon codes (`fx:coupon_codes`).
  *
- * @slot codes:before
- * @slot codes:after
+ * @slot coupon-codes:before - **new in v1.27.0**
+ * @slot coupon-codes:after - **new in v1.27.0**
  *
- * @slot import:before
- * @slot import:after
+ * @slot create:before - **new in v1.27.0**
+ * @slot create:after - **new in v1.27.0**
  *
  * @element foxy-coupon-codes-form
  * @since 1.15.0
@@ -25,198 +20,49 @@ export class CouponCodesForm extends Base {
     constructor() {
         super(...arguments);
         this.templates = {};
-    }
-    static get scopedElements() {
-        return {
-            'vaadin-button': customElements.get('vaadin-button'),
-            'iron-icon': customElements.get('iron-icon'),
-            'foxy-internal-sandbox': customElements.get('foxy-internal-sandbox'),
-            'foxy-spinner': customElements.get('foxy-spinner'),
-            'foxy-i18n': customElements.get('foxy-i18n'),
-            'x-editable-list': EditableList,
-            'x-group': Group,
+        this.__couponCodesGetValue = () => {
+            var _a, _b;
+            return (_b = (_a = this.form.coupon_codes) === null || _a === void 0 ? void 0 : _a.map(value => ({ value }))) !== null && _b !== void 0 ? _b : [];
+        };
+        this.__couponCodesSetValue = (newValue) => {
+            this.edit({
+                coupon_codes: newValue
+                    .map(({ value }) => value.split(' ').map(v => v.trim()))
+                    .flat()
+                    .filter((v, i, a) => a.indexOf(v) === i),
+            });
         };
     }
     static get v8n() {
-        return [({ coupon_codes: v }) => (v && v.length > 0) || 'coupon_codes_required'];
+        return [({ coupon_codes: v }) => (v && v.length > 0) || 'coupon-codes:v8n_required'];
     }
-    render() {
-        var _a, _b;
-        const { hiddenSelector, lang, ns } = this;
-        const isBusy = this.in('busy');
-        const isFail = this.in('fail');
-        const isSnapshot = this.in({ idle: 'snapshot' });
-        const isTemplate = this.in({ idle: 'template' });
-        const transition = 'transition-opacity duration-500';
-        const hidden = 'opacity-0 pointer-events-none';
-        return html `
-      <div class="relative">
-        <div
-          class=${classMap({
-            'relative space-y-m': true,
-            [transition]: true,
-            [hidden]: isSnapshot,
-        })}
-        >
-          ${hiddenSelector.matches('codes', true) ? '' : this.__renderCodes()}
-          ${hiddenSelector.matches('import', true) ? '' : this.__renderImport()}
-        </div>
-
-        <div
-          class=${classMap({
-            'absolute inset-0 flex flex-col items-center justify-center': true,
-            'text-center text-m text-secondary leading-m': true,
-            [transition]: true,
-            [hidden]: !isSnapshot,
-        })}
-        >
-          <div class="mx-auto flex mb-m w-l h-l rounded-t-l rounded-b-l bg-success">
-            <iron-icon icon="icons:done-all" class="m-auto text-success-contrast"></iron-icon>
-          </div>
-
-          <foxy-i18n class="block" lang=${lang} key="import_codes_done" ns=${ns}></foxy-i18n>
-        </div>
-
-        <div
-          data-testid="spinner"
-          class=${classMap({
-            'absolute inset-0 flex': true,
-            [transition]: true,
-            [hidden]: !isBusy && !isFail,
-        })}
-        >
-          <foxy-spinner
-            layout="vertical"
-            class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l"
-            state=${isFail ? 'error' : isTemplate ? 'empty' : 'busy'}
-            lang=${lang}
-            ns="${ns} ${(_b = (_a = customElements.get('foxy-spinner')) === null || _a === void 0 ? void 0 : _a.defaultNS) !== null && _b !== void 0 ? _b : ''}"
-          >
-          </foxy-spinner>
-        </div>
-      </div>
-    `;
+    get readonlySelector() {
+        const alwaysMatch = [super.readonlySelector.toString()];
+        if (this.href)
+            alwaysMatch.push('coupon-codes');
+        return new BooleanSelector(alwaysMatch.join(' ').trim());
     }
-    __renderCodes() {
-        var _a;
-        const maxVisible = 16;
-        const codes = (_a = this.form.coupon_codes) !== null && _a !== void 0 ? _a : [];
-        const visibleCodes = codes.length > maxVisible ? codes.slice(-maxVisible) : codes;
-        const hiddenCodes = codes.length > maxVisible ? codes.slice(0, -maxVisible) : [];
-        const parse = (value) => {
-            return value
-                .split(/\s/)
-                .map(code => code.trim())
-                .filter(code => code.length > 0);
-        };
-        const items = visibleCodes.map(code => {
-            let href;
-            try {
-                const url = new URL(this.parent);
-                url.searchParams.set('code', code);
-                href = url.toString();
-            }
-            catch (_a) {
-                href = this.parent;
-            }
-            return {
-                value: code,
-                label: html `
-          <foxy-internal-coupon-codes-form-list-item
-            group=${this.group}
-            href=${href}
-            lang=${this.lang}
-            ns=${this.ns}
-          >
-          </foxy-internal-coupon-codes-form-list-item>
-        `,
-            };
-        });
-        return html `
-      <div data-testid="codes">
-        ${this.renderTemplateOrSlot('codes:before')}
-
-        <x-group class="mb-xs" frame>
-          <foxy-i18n slot="header" lang=${this.lang} key="code_plural" ns=${this.ns}></foxy-i18n>
-
-          <x-editable-list
-            data-testid="codes:list"
-            lang=${this.lang}
-            ns=${this.ns}
-            ?disabled=${!this.in('idle') || this.disabledSelector.matches('codes', true)}
-            ?readonly=${this.readonlySelector.matches('codes', true)}
-            .items=${items}
-            @change=${(evt) => {
-            const list = evt.currentTarget;
-            const codes = list.items.reduce((p, c) => [...p, ...parse(c.value)], []);
-            const newCodes = new Set([...hiddenCodes, ...codes]);
-            this.edit({ coupon_codes: [...newCodes] });
-        }}
-            @paste=${(evt) => {
-            var _a, _b;
-            evt.preventDefault();
-            const text = (_b = (_a = evt.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text')) !== null && _b !== void 0 ? _b : '';
-            const pastedCodes = parse(text);
-            this.edit({ coupon_codes: Array.from(new Set([...codes, ...pastedCodes])) });
-        }}
-          >
-            <div
-              class="ml-m py-s border-b border-contrast-10 font-lumo"
-              ?hidden=${hiddenCodes.length === 0}
-            >
-              <foxy-i18n
-                options=${JSON.stringify({ count: hiddenCodes.length })}
-                class="block text-body text-m mb-xs"
-                lang=${this.lang}
-                key="hidden_codes_header"
-                ns=${this.ns}
-              >
-              </foxy-i18n>
-
-              <foxy-i18n
-                class="block text-xs text-tertiary"
-                lang=${this.lang}
-                key="hidden_codes_explainer"
-                ns=${this.ns}
-              >
-              </foxy-i18n>
-            </div>
-          </x-editable-list>
-        </x-group>
-
-        <foxy-i18n
-          class="block text-xs text-tertiary leading-s"
-          lang=${this.lang}
-          key="code_import_hint"
-          ns=${this.ns}
-        >
-        </foxy-i18n>
-
-        ${this.renderTemplateOrSlot('codes:after')}
-      </div>
-    `;
+    get hiddenSelector() {
+        const alwaysMatch = ['delete timestamps', super.hiddenSelector.toString()];
+        return new BooleanSelector(alwaysMatch.join(' ').trim());
     }
-    __renderImport() {
-        const isTemplateValid = this.in({ idle: { template: { dirty: 'valid' } } });
-        const isSnapshotValid = this.in({ idle: { snapshot: { dirty: 'valid' } } });
-        const isValid = isTemplateValid || isSnapshotValid;
+    renderBody() {
         return html `
-      <div>
-        ${this.renderTemplateOrSlot('import:before')}
+      <foxy-internal-editable-list-control
+        infer="coupon-codes"
+        .getValue=${this.__couponCodesGetValue}
+        .setValue=${this.__couponCodesSetValue}
+      >
+      </foxy-internal-editable-list-control>
 
-        <vaadin-button
-          data-testid="import"
-          class="w-full mb-xs"
-          theme="primary success"
-          ?disabled=${!isValid || !this.in('idle') || this.disabledSelector.matches('import', true)}
-          @click=${() => this.submit()}
-        >
-          <foxy-i18n ns=${this.ns} key="import" lang=${this.lang}></foxy-i18n>
-        </vaadin-button>
-
-        ${this.renderTemplateOrSlot('import:after')}
-      </div>
+      ${super.renderBody()}
     `;
     }
+    async _sendPost(edits) {
+        const body = JSON.stringify(edits);
+        const data = await this._fetch(this.parent, { body, method: 'POST' });
+        this.status = { key: 'success' };
+        return data;
+    }
 }
 //# sourceMappingURL=CouponCodesForm.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CouponCodesForm.js","sourceRoot":"","sources":["../../../../src/elements/public/CouponCodesForm/CouponCodesForm.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { ScopedElementsMap, ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { EditableList } from '../../private/EditableList/EditableList';\nimport { Group } from '../../private/Group/Group';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { NucleonV8N } from '../NucleonElement/types';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'coupon-codes-form';\nconst Base = ConfigurableMixin(\n  ThemeableMixin(ScopedElementsMixin(TranslatableMixin(NucleonElement, NS)))\n);\n\n/**\n * Form element for importing coupon codes (`fx:coupon_codes`).\n *\n * @slot codes:before\n * @slot codes:after\n *\n * @slot import:before\n * @slot import:after\n *\n * @element foxy-coupon-codes-form\n * @since 1.15.0\n */\nexport class CouponCodesForm extends Base<Data> {\n  static get scopedElements(): ScopedElementsMap {\n    return {\n      'vaadin-button': customElements.get('vaadin-button'),\n      'iron-icon': customElements.get('iron-icon'),\n\n      'foxy-internal-sandbox': customElements.get('foxy-internal-sandbox'),\n      'foxy-spinner': customElements.get('foxy-spinner'),\n      'foxy-i18n': customElements.get('foxy-i18n'),\n\n      'x-editable-list': EditableList,\n      'x-group': Group,\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [({ coupon_codes: v }) => (v && v.length > 0) || 'coupon_codes_required'];\n  }\n\n  templates: Templates = {};\n\n  render(): TemplateResult {\n    const { hiddenSelector, lang, ns } = this;\n\n    const isBusy = this.in('busy');\n    const isFail = this.in('fail');\n    const isSnapshot = this.in({ idle: 'snapshot' });\n    const isTemplate = this.in({ idle: 'template' });\n\n    const transition = 'transition-opacity duration-500';\n    const hidden = 'opacity-0 pointer-events-none';\n\n    return html`\n      <div class=\"relative\">\n        <div\n          class=${classMap({\n            'relative space-y-m': true,\n            [transition]: true,\n            [hidden]: isSnapshot,\n          })}\n        >\n          ${hiddenSelector.matches('codes', true) ? '' : this.__renderCodes()}\n          ${hiddenSelector.matches('import', true) ? '' : this.__renderImport()}\n        </div>\n\n        <div\n          class=${classMap({\n            'absolute inset-0 flex flex-col items-center justify-center': true,\n            'text-center text-m text-secondary leading-m': true,\n            [transition]: true,\n            [hidden]: !isSnapshot,\n          })}\n        >\n          <div class=\"mx-auto flex mb-m w-l h-l rounded-t-l rounded-b-l bg-success\">\n            <iron-icon icon=\"icons:done-all\" class=\"m-auto text-success-contrast\"></iron-icon>\n          </div>\n\n          <foxy-i18n class=\"block\" lang=${lang} key=\"import_codes_done\" ns=${ns}></foxy-i18n>\n        </div>\n\n        <div\n          data-testid=\"spinner\"\n          class=${classMap({\n            'absolute inset-0 flex': true,\n            [transition]: true,\n            [hidden]: !isBusy && !isFail,\n          })}\n        >\n          <foxy-spinner\n            layout=\"vertical\"\n            class=\"m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l\"\n            state=${isFail ? 'error' : isTemplate ? 'empty' : 'busy'}\n            lang=${lang}\n            ns=\"${ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n          >\n          </foxy-spinner>\n        </div>\n      </div>\n    `;\n  }\n\n  private __renderCodes() {\n    const maxVisible = 16;\n    const codes = this.form.coupon_codes ?? [];\n\n    const visibleCodes = codes.length > maxVisible ? codes.slice(-maxVisible) : codes;\n    const hiddenCodes = codes.length > maxVisible ? codes.slice(0, -maxVisible) : [];\n    const parse = (value: string) => {\n      return value\n        .split(/\\s/)\n        .map(code => code.trim())\n        .filter(code => code.length > 0);\n    };\n\n    const items = visibleCodes.map(code => {\n      let href: string;\n\n      try {\n        const url = new URL(this.parent);\n        url.searchParams.set('code', code);\n        href = url.toString();\n      } catch {\n        href = this.parent;\n      }\n\n      return {\n        value: code,\n        label: html`\n          <foxy-internal-coupon-codes-form-list-item\n            group=${this.group}\n            href=${href}\n            lang=${this.lang}\n            ns=${this.ns}\n          >\n          </foxy-internal-coupon-codes-form-list-item>\n        `,\n      };\n    });\n\n    return html`\n      <div data-testid=\"codes\">\n        ${this.renderTemplateOrSlot('codes:before')}\n\n        <x-group class=\"mb-xs\" frame>\n          <foxy-i18n slot=\"header\" lang=${this.lang} key=\"code_plural\" ns=${this.ns}></foxy-i18n>\n\n          <x-editable-list\n            data-testid=\"codes:list\"\n            lang=${this.lang}\n            ns=${this.ns}\n            ?disabled=${!this.in('idle') || this.disabledSelector.matches('codes', true)}\n            ?readonly=${this.readonlySelector.matches('codes', true)}\n            .items=${items}\n            @change=${(evt: CustomEvent) => {\n              const list = evt.currentTarget as EditableList;\n              const codes = list.items.reduce<string[]>((p, c) => [...p, ...parse(c.value)], []);\n              const newCodes = new Set([...hiddenCodes, ...codes]);\n              this.edit({ coupon_codes: [...newCodes] });\n            }}\n            @paste=${(evt: ClipboardEvent) => {\n              evt.preventDefault();\n              const text = evt.clipboardData?.getData('text') ?? '';\n              const pastedCodes = parse(text);\n              this.edit({ coupon_codes: Array.from(new Set([...codes, ...pastedCodes])) });\n            }}\n          >\n            <div\n              class=\"ml-m py-s border-b border-contrast-10 font-lumo\"\n              ?hidden=${hiddenCodes.length === 0}\n            >\n              <foxy-i18n\n                options=${JSON.stringify({ count: hiddenCodes.length })}\n                class=\"block text-body text-m mb-xs\"\n                lang=${this.lang}\n                key=\"hidden_codes_header\"\n                ns=${this.ns}\n              >\n              </foxy-i18n>\n\n              <foxy-i18n\n                class=\"block text-xs text-tertiary\"\n                lang=${this.lang}\n                key=\"hidden_codes_explainer\"\n                ns=${this.ns}\n              >\n              </foxy-i18n>\n            </div>\n          </x-editable-list>\n        </x-group>\n\n        <foxy-i18n\n          class=\"block text-xs text-tertiary leading-s\"\n          lang=${this.lang}\n          key=\"code_import_hint\"\n          ns=${this.ns}\n        >\n        </foxy-i18n>\n\n        ${this.renderTemplateOrSlot('codes:after')}\n      </div>\n    `;\n  }\n\n  private __renderImport() {\n    const isTemplateValid = this.in({ idle: { template: { dirty: 'valid' } } });\n    const isSnapshotValid = this.in({ idle: { snapshot: { dirty: 'valid' } } });\n    const isValid = isTemplateValid || isSnapshotValid;\n\n    return html`\n      <div>\n        ${this.renderTemplateOrSlot('import:before')}\n\n        <vaadin-button\n          data-testid=\"import\"\n          class=\"w-full mb-xs\"\n          theme=\"primary success\"\n          ?disabled=${!isValid || !this.in('idle') || this.disabledSelector.matches('import', true)}\n          @click=${() => this.submit()}\n        >\n          <foxy-i18n ns=${this.ns} key=\"import\" lang=${this.lang}></foxy-i18n>\n        </vaadin-button>\n\n        ${this.renderTemplateOrSlot('import:after')}\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"CouponCodesForm.js","sourceRoot":"","sources":["../../../../src/elements/public/CouponCodesForm/CouponCodesForm.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,mBAAmB,CAAC;AAC/B,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD;;;;;;;;;;;GAWG;AACH,MAAM,OAAO,eAAgB,SAAQ,IAAU;IAA/C;;QAKE,cAAS,GAAc,EAAE,CAAC;QAET,0BAAqB,GAAG,GAAG,EAAE;;YAC5C,mBAAO,IAAI,CAAC,IAAI,CAAC,YAAY,0CAAE,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,oCAAK,EAAE,CAAC;QACjE,CAAC,CAAC;QAEe,0BAAqB,GAAG,CAAC,QAAgB,EAAE,EAAE;YAC5D,IAAI,CAAC,IAAI,CAAC;gBACR,YAAY,EAAE,QAAQ;qBACnB,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;qBACvD,IAAI,EAAE;qBACN,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;aAC3C,CAAC,CAAC;QACL,CAAC,CAAC;IAgCJ,CAAC;IAjDC,MAAM,KAAK,GAAG;QACZ,OAAO,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,2BAA2B,CAAC,CAAC;IACvF,CAAC;IAiBD,IAAI,gBAAgB;QAClB,MAAM,WAAW,GAAG,CAAC,KAAK,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC;QACxD,IAAI,IAAI,CAAC,IAAI;YAAE,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAChD,OAAO,IAAI,eAAe,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,cAAc;QAChB,MAAM,WAAW,GAAG,CAAC,mBAAmB,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;QAC3E,OAAO,IAAI,eAAe,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAC3D,CAAC;IAED,UAAU;QACR,OAAO,IAAI,CAAA;;;oBAGK,IAAI,CAAC,qBAAqB;oBAC1B,IAAI,CAAC,qBAAqB;;;;QAItC,KAAK,CAAC,UAAU,EAAE;KACrB,CAAC;IACJ,CAAC;IAES,KAAK,CAAC,SAAS,CAAC,KAAoB;QAC5C,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACnC,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;QACtE,IAAI,CAAC,MAAM,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC;QACjC,OAAO,IAAI,CAAC;IACd,CAAC;CACF","sourcesContent":["import type { Data, Templates } from './types';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Item } from '../../internal/InternalEditableListControl/types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { html } from 'lit-html';\n\nconst NS = 'coupon-codes-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for importing coupon codes (`fx:coupon_codes`).\n *\n * @slot coupon-codes:before - **new in v1.27.0**\n * @slot coupon-codes:after - **new in v1.27.0**\n *\n * @slot create:before - **new in v1.27.0**\n * @slot create:after - **new in v1.27.0**\n *\n * @element foxy-coupon-codes-form\n * @since 1.15.0\n */\nexport class CouponCodesForm extends Base<Data> {\n  static get v8n(): NucleonV8N<Data> {\n    return [({ coupon_codes: v }) => (v && v.length > 0) || 'coupon-codes:v8n_required'];\n  }\n\n  templates: Templates = {};\n\n  private readonly __couponCodesGetValue = () => {\n    return this.form.coupon_codes?.map(value => ({ value })) ?? [];\n  };\n\n  private readonly __couponCodesSetValue = (newValue: Item[]) => {\n    this.edit({\n      coupon_codes: newValue\n        .map(({ value }) => value.split(' ').map(v => v.trim()))\n        .flat()\n        .filter((v, i, a) => a.indexOf(v) === i),\n    });\n  };\n\n  get readonlySelector(): BooleanSelector {\n    const alwaysMatch = [super.readonlySelector.toString()];\n    if (this.href) alwaysMatch.push('coupon-codes');\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['delete timestamps', super.hiddenSelector.toString()];\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderBody(): TemplateResult {\n    return html`\n      <foxy-internal-editable-list-control\n        infer=\"coupon-codes\"\n        .getValue=${this.__couponCodesGetValue}\n        .setValue=${this.__couponCodesSetValue}\n      >\n      </foxy-internal-editable-list-control>\n\n      ${super.renderBody()}\n    `;\n  }\n\n  protected async _sendPost(edits: Partial<Data>): Promise<Data> {\n    const body = JSON.stringify(edits);\n    const data = await this._fetch(this.parent, { body, method: 'POST' });\n    this.status = { key: 'success' };\n    return data;\n  }\n}\n"]}

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

@@ -1,8 +1,4 @@
-import '@vaadin/vaadin-button';
-import '@polymer/iron-icons';
-import '@polymer/iron-icon';
-import '../../internal/InternalSandbox/index';
-import '../Spinner/index';
-import '../I18n/index';
+import '../../internal/InternalEditableListControl/index';
+import '../../internal/InternalForm/index';
 import { CouponCodesForm } from './CouponCodesForm';
 export { CouponCodesForm };

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

@@ -1,12 +1,6 @@
-import '@vaadin/vaadin-button';
-import '@polymer/iron-icons';
-import '@polymer/iron-icon';
-import "../../internal/InternalSandbox/index.js";
-import "../Spinner/index.js";
-import "../I18n/index.js";
+import "../../internal/InternalEditableListControl/index.js";
+import "../../internal/InternalForm/index.js";
 import { CouponCodesForm } from "./CouponCodesForm.js";
-import { InternalCouponCodesFormListItem } from "./internal/InternalCouponCodesFormListItem.js";
 customElements.define('foxy-coupon-codes-form', CouponCodesForm);
-customElements.define('foxy-internal-coupon-codes-form-list-item', InternalCouponCodesFormListItem);
 export { CouponCodesForm };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/CouponCodesForm/index.ts"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAC;AAC/B,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oBAAoB,CAAC;AAC5B,iDAA8C;AAC9C,6BAA0B;AAC1B,0BAAuB;AAEvB,OAAO,EAAE,eAAe,EAAE,6BAA0B;AACpD,OAAO,EAAE,+BAA+B,EAAE,sDAAmD;AAE7F,cAAc,CAAC,MAAM,CAAC,wBAAwB,EAAE,eAAe,CAAC,CAAC;AACjE,cAAc,CAAC,MAAM,CAAC,2CAA2C,EAAE,+BAA+B,CAAC,CAAC;AAEpG,OAAO,EAAE,eAAe,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-button';\nimport '@polymer/iron-icons';\nimport '@polymer/iron-icon';\nimport '../../internal/InternalSandbox/index';\nimport '../Spinner/index';\nimport '../I18n/index';\n\nimport { CouponCodesForm } from './CouponCodesForm';\nimport { InternalCouponCodesFormListItem } from './internal/InternalCouponCodesFormListItem';\n\ncustomElements.define('foxy-coupon-codes-form', CouponCodesForm);\ncustomElements.define('foxy-internal-coupon-codes-form-list-item', InternalCouponCodesFormListItem);\n\nexport { CouponCodesForm };\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/CouponCodesForm/index.ts"],"names":[],"mappings":"AAAA,6DAA0D;AAC1D,8CAA2C;AAE3C,OAAO,EAAE,eAAe,EAAE,6BAA0B;AAEpD,cAAc,CAAC,MAAM,CAAC,wBAAwB,EAAE,eAAe,CAAC,CAAC;AAEjE,OAAO,EAAE,eAAe,EAAE,CAAC","sourcesContent":["import '../../internal/InternalEditableListControl/index';\nimport '../../internal/InternalForm/index';\n\nimport { CouponCodesForm } from './CouponCodesForm';\n\ncustomElements.define('foxy-coupon-codes-form', CouponCodesForm);\n\nexport { CouponCodesForm };\n"]}

package/dist/elements/public/CouponCodesForm/types.d.ts

@@ -1,7 +1,7 @@
-import { CouponCodesForm } from './CouponCodesForm';
-import { Rels } from '@foxy.io/sdk/backend';
-import { Renderer } from '../../../mixins/configurable';
-import { Resource } from '@foxy.io/sdk/core';
+import type { CouponCodesForm } from './CouponCodesForm';
+import type { Renderer } from '../../../mixins/configurable';
+import type { Resource } from '@foxy.io/sdk/core';
+import type { Rels } from '@foxy.io/sdk/backend';
 export declare type Data = Resource<Rels.CouponCodesImport> & {
     _links: {
         self: {
@@ -10,8 +10,8 @@ export declare type Data = Resource<Rels.CouponCodesImport> & {
     };
 };
 export declare type Templates = {
-    'codes:before'?: Renderer<CouponCodesForm>;
-    'codes:after'?: Renderer<CouponCodesForm>;
-    'import:before'?: Renderer<CouponCodesForm>;
-    'import:after'?: Renderer<CouponCodesForm>;
+    'coupon-codes:before'?: Renderer<CouponCodesForm>;
+    'coupon-codes:after'?: Renderer<CouponCodesForm>;
+    'create:before'?: Renderer<CouponCodesForm>;
+    'create:after'?: Renderer<CouponCodesForm>;
 };

package/dist/elements/public/CouponCodesForm/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/CouponCodesForm/types.ts"],"names":[],"mappings":"","sourcesContent":["import { CouponCodesForm } from './CouponCodesForm';\nimport { Rels } from '@foxy.io/sdk/backend';\nimport { Renderer } from '../../../mixins/configurable';\nimport { Resource } from '@foxy.io/sdk/core';\n\nexport type Data = Resource<Rels.CouponCodesImport> & { _links: { self: { href: string } } };\n\nexport type Templates = {\n  'codes:before'?: Renderer<CouponCodesForm>;\n  'codes:after'?: Renderer<CouponCodesForm>;\n  'import:before'?: Renderer<CouponCodesForm>;\n  'import:after'?: Renderer<CouponCodesForm>;\n};\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/CouponCodesForm/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { CouponCodesForm } from './CouponCodesForm';\nimport type { Renderer } from '../../../mixins/configurable';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nexport type Data = Resource<Rels.CouponCodesImport> & { _links: { self: { href: string } } };\n\nexport type Templates = {\n  'coupon-codes:before'?: Renderer<CouponCodesForm>;\n  'coupon-codes:after'?: Renderer<CouponCodesForm>;\n  'create:before'?: Renderer<CouponCodesForm>;\n  'create:after'?: Renderer<CouponCodesForm>;\n};\n"]}

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

@@ -1,7 +1,7 @@
 import type { Data, Templates } from './types';
 import type { TemplateResult } from 'lit-html';
 import type { NucleonV8N } from '../NucleonElement/types';
-import { InternalForm } from '../../internal/InternalForm';
+import { InternalForm } from '../../internal/InternalForm/InternalForm';
 declare const Base: typeof InternalForm & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
 };

package/dist/elements/public/CustomFieldForm/CustomFieldForm.js

@@ -1,5 +1,5 @@
 import { TranslatableMixin } from "../../../mixins/translatable.js";
-import { InternalForm } from "../../internal/InternalForm.js";
+import { InternalForm } from "../../internal/InternalForm/InternalForm.js";
 import { html } from 'lit-html';
 const NS = 'custom-field-form';
 const Base = TranslatableMixin(InternalForm, NS);

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

@@ -1 +1 @@
-{"version":3,"file":"CustomFieldForm.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomFieldForm/CustomFieldForm.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,YAAY,EAAE,uCAAoC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,mBAAmB,CAAC;AAC/B,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,OAAO,eAAgB,SAAQ,IAAU;IAA/C;;QAUE,cAAS,GAAc,EAAE,CAAC;QAET,yBAAoB,GAAG,GAAG,EAAE;YAC3C,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAC/C,CAAC,CAAC;QAEe,yBAAoB,GAAG,CAAC,QAAkB,EAAE,EAAE;YAC7D,IAAI,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACxD,CAAC,CAAC;QAEe,wBAAmB,GAAG,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;IAiBvF,CAAC;IApCC,MAAM,KAAK,GAAG;QACZ,OAAO;YACL,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,oBAAoB;YAC7D,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,GAAG,IAAI,oBAAoB;YAC/D,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,mBAAmB;YAC3D,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,GAAG,IAAI,mBAAmB;SAC9D,CAAC;IACJ,CAAC;IAcD,UAAU;QACR,OAAO,IAAI,CAAA;;;;;oBAKK,IAAI,CAAC,oBAAoB;oBACzB,IAAI,CAAC,oBAAoB;mBAC1B,IAAI,CAAC,mBAAmB;;;;QAInC,KAAK,CAAC,UAAU,EAAE;KACrB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { Data, Templates } from './types';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalForm } from '../../internal/InternalForm';\nimport { html } from 'lit-html';\n\nconst NS = 'custom-field-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for creating or editing custom fields.\n *\n * @slot name:before - **new in v1.4.0**\n * @slot name:after - **new in v1.4.0**\n *\n * @slot value:before - **new in v1.4.0**\n * @slot value:after - **new in v1.4.0**\n *\n * @slot visibility:before - **new in v1.4.0**\n * @slot visibility:after - **new in v1.4.0**\n *\n * @slot timestamps:before - **new in v1.4.0**\n * @slot timestamps:after - **new in v1.4.0**\n *\n * @slot create:before - **new in v1.4.0**\n * @slot create:after - **new in v1.4.0**\n *\n * @slot delete:before - **new in v1.4.0**\n * @slot delete:after - **new in v1.4.0**\n *\n * @element foxy-custom-field-form\n * @since 1.2.0\n */\nexport class CustomFieldForm extends Base<Data> {\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ value: v }) => (v && v.length > 0) || 'value:v8n_required',\n      ({ value: v }) => !v || v.length <= 700 || 'value:v8n_too_long',\n      ({ name: v }) => (v && v.length > 0) || 'name:v8n_required',\n      ({ name: v }) => !v || v.length <= 100 || 'name:v8n_too_long',\n    ];\n  }\n\n  templates: Templates = {};\n\n  private readonly __visibilityGetValue = () => {\n    return this.form.is_hidden ? ['hidden'] : [];\n  };\n\n  private readonly __visibilitySetValue = (newValue: string[]) => {\n    this.edit({ is_hidden: newValue.includes('hidden') });\n  };\n\n  private readonly __visibilityOptions = [{ label: 'option_hidden', value: 'hidden' }];\n\n  renderBody(): TemplateResult {\n    return html`\n      <foxy-internal-source-control infer=\"name\"></foxy-internal-source-control>\n      <foxy-internal-source-control infer=\"value\"></foxy-internal-source-control>\n      <foxy-internal-checkbox-group-control\n        infer=\"visibility\"\n        .getValue=${this.__visibilityGetValue}\n        .setValue=${this.__visibilitySetValue}\n        .options=${this.__visibilityOptions}\n      >\n      </foxy-internal-checkbox-group-control>\n\n      ${super.renderBody()}\n    `;\n  }\n}\n"]}
+{"version":3,"file":"CustomFieldForm.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomFieldForm/CustomFieldForm.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,mBAAmB,CAAC;AAC/B,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,OAAO,eAAgB,SAAQ,IAAU;IAA/C;;QAUE,cAAS,GAAc,EAAE,CAAC;QAET,yBAAoB,GAAG,GAAG,EAAE;YAC3C,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAC/C,CAAC,CAAC;QAEe,yBAAoB,GAAG,CAAC,QAAkB,EAAE,EAAE;YAC7D,IAAI,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACxD,CAAC,CAAC;QAEe,wBAAmB,GAAG,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;IAiBvF,CAAC;IApCC,MAAM,KAAK,GAAG;QACZ,OAAO;YACL,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,oBAAoB;YAC7D,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,GAAG,IAAI,oBAAoB;YAC/D,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,mBAAmB;YAC3D,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,GAAG,IAAI,mBAAmB;SAC9D,CAAC;IACJ,CAAC;IAcD,UAAU;QACR,OAAO,IAAI,CAAA;;;;;oBAKK,IAAI,CAAC,oBAAoB;oBACzB,IAAI,CAAC,oBAAoB;mBAC1B,IAAI,CAAC,mBAAmB;;;;QAInC,KAAK,CAAC,UAAU,EAAE;KACrB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { Data, Templates } from './types';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { html } from 'lit-html';\n\nconst NS = 'custom-field-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for creating or editing custom fields.\n *\n * @slot name:before - **new in v1.4.0**\n * @slot name:after - **new in v1.4.0**\n *\n * @slot value:before - **new in v1.4.0**\n * @slot value:after - **new in v1.4.0**\n *\n * @slot visibility:before - **new in v1.4.0**\n * @slot visibility:after - **new in v1.4.0**\n *\n * @slot timestamps:before - **new in v1.4.0**\n * @slot timestamps:after - **new in v1.4.0**\n *\n * @slot create:before - **new in v1.4.0**\n * @slot create:after - **new in v1.4.0**\n *\n * @slot delete:before - **new in v1.4.0**\n * @slot delete:after - **new in v1.4.0**\n *\n * @element foxy-custom-field-form\n * @since 1.2.0\n */\nexport class CustomFieldForm extends Base<Data> {\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ value: v }) => (v && v.length > 0) || 'value:v8n_required',\n      ({ value: v }) => !v || v.length <= 700 || 'value:v8n_too_long',\n      ({ name: v }) => (v && v.length > 0) || 'name:v8n_required',\n      ({ name: v }) => !v || v.length <= 100 || 'name:v8n_too_long',\n    ];\n  }\n\n  templates: Templates = {};\n\n  private readonly __visibilityGetValue = () => {\n    return this.form.is_hidden ? ['hidden'] : [];\n  };\n\n  private readonly __visibilitySetValue = (newValue: string[]) => {\n    this.edit({ is_hidden: newValue.includes('hidden') });\n  };\n\n  private readonly __visibilityOptions = [{ label: 'option_hidden', value: 'hidden' }];\n\n  renderBody(): TemplateResult {\n    return html`\n      <foxy-internal-source-control infer=\"name\"></foxy-internal-source-control>\n      <foxy-internal-source-control infer=\"value\"></foxy-internal-source-control>\n      <foxy-internal-checkbox-group-control\n        infer=\"visibility\"\n        .getValue=${this.__visibilityGetValue}\n        .setValue=${this.__visibilitySetValue}\n        .options=${this.__visibilityOptions}\n      >\n      </foxy-internal-checkbox-group-control>\n\n      ${super.renderBody()}\n    `;\n  }\n}\n"]}

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

@@ -1,12 +1,11 @@
-import { Data, Templates } from './types';
-import { TemplateResult } from 'lit-html';
-import { NucleonElement } from '../NucleonElement/NucleonElement';
-import { NucleonV8N } from '../NucleonElement/types';
-declare const Base: typeof NucleonElement & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+import type { Data, Templates } from './types';
+import type { TemplateResult } from 'lit-html';
+import type { NucleonV8N } from '../NucleonElement/types';
+import { BooleanSelector } from '@foxy.io/sdk/core';
+import { InternalForm } from '../../internal/InternalForm/InternalForm';
+declare const Base: typeof InternalForm & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
-} & {
-    styles: import("lit-element").CSSResultArray;
-} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
+};
 /**
  * Form element for generating codes for coupons or gift cards (`fx:generate_codes`).
  *
@@ -22,8 +21,8 @@ declare const Base: typeof NucleonElement & import("lit-element").Constructor<im
  * @slot current-balance:before
  * @slot current-balance:after
  *
- * @slot generate:before
- * @slot generate:after
+ * @slot create:before
+ * @slot create:after
  *
  * @element foxy-generate-codes-form
  * @since 1.15.0
@@ -31,13 +30,10 @@ declare const Base: typeof NucleonElement & import("lit-element").Constructor<im
 export declare class GenerateCodesForm extends Base<Data> {
     static get v8n(): NucleonV8N<Data>;
     templates: Templates;
-    render(): TemplateResult;
-    private __getErrorMessage;
-    private __getValidator;
-    private __renderLength;
-    private __renderNumberOfCodes;
-    private __renderCurrentBalance;
-    private __renderPrefix;
-    private __renderGenerate;
+    private readonly __exampleGetValue;
+    get readonlySelector(): BooleanSelector;
+    get hiddenSelector(): BooleanSelector;
+    renderBody(): TemplateResult;
+    protected _sendPost(edits: Partial<Data>): Promise<Data>;
 }
 export {};