npm - @foxy.io/elements - Versions diffs - 1.15.0-beta.4 → 1.15.0-beta.7 - Mend

@foxy.io/elements 1.15.0-beta.4 → 1.15.0-beta.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (147) hide show

package/dist/elements/public/GenerateCodesForm/GenerateCodesForm.js CHANGED Viewed

@@ -4,7 +4,7 @@ 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";
-const NS = 'generate-codes';
+const NS = 'generate-codes-form';
 const Base = ConfigurableMixin(ThemeableMixin(TranslatableMixin(NucleonElement, NS)));
 /**
  * Form element for generating codes for coupons or gift cards (`fx:generate_codes`).
@@ -18,6 +18,9 @@ const Base = ConfigurableMixin(ThemeableMixin(TranslatableMixin(NucleonElement,
  * @slot prefix:before
  * @slot prefix:after
  *
+ * @slot current-balance:before
+ * @slot current-balance:after
+ *
  * @slot generate:before
  * @slot generate:after
  *
@@ -32,6 +35,7 @@ export class GenerateCodesForm extends Base {
     static get v8n() {
         return [
             ({ number_of_codes: v }) => (v && v > 0) || 'number_of_codes_required',
+            ({ current_balance: v }) => !v || v >= 0 || 'current_balance_negative',
             ({ length: v }) => (v && v > 0) || 'length_required',
         ];
     }
@@ -55,6 +59,7 @@ export class GenerateCodesForm extends Base {
         >
           ${hiddenSelector.matches('length', true) ? '' : this.__renderLength()}
           ${hiddenSelector.matches('number-of-codes', true) ? '' : this.__renderNumberOfCodes()}
+          ${hiddenSelector.matches('current-balance', true) ? '' : this.__renderCurrentBalance()}
           ${hiddenSelector.matches('prefix', true) ? '' : this.__renderPrefix()}
           ${hiddenSelector.matches('generate', true) ? '' : this.__renderGenerate()}
         </div>
@@ -75,6 +80,7 @@ export class GenerateCodesForm extends Base {
         </div>
         <div
+          data-testid="spinner"
           class=${classMap({
             'absolute inset-0 flex': true,
             [transition]: true,
@@ -103,94 +109,140 @@ export class GenerateCodesForm extends Base {
     __renderLength() {
         const isTemplate = this.in({ idle: 'template' });
         return html `
-      ${this.renderTemplateOrSlot('length:before')}
+      <div>
+        ${this.renderTemplateOrSlot('length:before')}
-      <vaadin-integer-field
-        error-message=${this.__getErrorMessage('length')}
-        label=${this.t('length')}
-        class="w-full"
-        min="1"
-        ?disabled=${!isTemplate || this.disabledSelector.matches('length', true)}
-        ?readonly=${this.readonlySelector.matches('length', true)}
-        prevent-invalid-input
-        has-controls
-        .checkValidity=${this.__getValidator('length')}
-        .value=${isTemplate ? this.form.length : ''}
-        @change=${(evt) => {
+        <vaadin-integer-field
+          error-message=${this.__getErrorMessage('length')}
+          data-testid="length"
+          label=${this.t('length')}
+          class="w-full"
+          min="1"
+          ?disabled=${!isTemplate || this.disabledSelector.matches('length', true)}
+          ?readonly=${this.readonlySelector.matches('length', true)}
+          prevent-invalid-input
+          has-controls
+          .checkValidity=${this.__getValidator('length')}
+          .value=${isTemplate ? this.form.length : ''}
+          @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
+          @change=${(evt) => {
             const field = evt.currentTarget;
             this.edit({ length: parseInt(field.value) });
         }}
-      >
-      </vaadin-integer-field>
+        >
+        </vaadin-integer-field>
-      ${this.renderTemplateOrSlot('length:after')}
+        ${this.renderTemplateOrSlot('length:after')}
+      </div>
     `;
     }
     __renderNumberOfCodes() {
         const isTemplate = this.in({ idle: 'template' });
         return html `
-      ${this.renderTemplateOrSlot('number-of-codes:before')}
+      <div>
+        ${this.renderTemplateOrSlot('number-of-codes:before')}
-      <vaadin-integer-field
-        error-message=${this.__getErrorMessage('number_of_codes')}
-        label=${this.t('number_of_codes')}
-        class="w-full"
-        min="1"
-        ?disabled=${!isTemplate || this.disabledSelector.matches('number-of-codes', true)}
-        ?readonly=${this.readonlySelector.matches('number-of-codes', true)}
-        prevent-invalid-input
-        has-controls
-        .checkValidity=${this.__getValidator('number_of_codes')}
-        .value=${isTemplate ? this.form.number_of_codes : ''}
-        @change=${(evt) => {
+        <vaadin-integer-field
+          error-message=${this.__getErrorMessage('number_of_codes')}
+          data-testid="number-of-codes"
+          label=${this.t('number_of_codes')}
+          class="w-full"
+          min="1"
+          ?disabled=${!isTemplate || this.disabledSelector.matches('number-of-codes', true)}
+          ?readonly=${this.readonlySelector.matches('number-of-codes', true)}
+          prevent-invalid-input
+          has-controls
+          .checkValidity=${this.__getValidator('number_of_codes')}
+          .value=${isTemplate ? this.form.number_of_codes : ''}
+          @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
+          @change=${(evt) => {
             const field = evt.currentTarget;
             this.edit({ number_of_codes: parseInt(field.value) });
         }}
-      >
-      </vaadin-integer-field>
+        >
+        </vaadin-integer-field>
-      ${this.renderTemplateOrSlot('number-of-codes:after')}
+        ${this.renderTemplateOrSlot('number-of-codes:after')}
+      </div>
+    `;
+    }
+    __renderCurrentBalance() {
+        var _a;
+        const isTemplate = this.in({ idle: 'template' });
+        return html `
+      <div>
+        ${this.renderTemplateOrSlot('current-balance:before')}
+        <vaadin-integer-field
+          error-message=${this.__getErrorMessage('current_balance')}
+          data-testid="current-balance"
+          label=${this.t('balance')}
+          class="w-full col-span-2"
+          min="0"
+          ?disabled=${!isTemplate || this.disabledSelector.matches('current-balance', true)}
+          ?readonly=${this.readonlySelector.matches('current-balance', true)}
+          prevent-invalid-input
+          has-controls
+          .checkValidity=${this.__getValidator('current_balance')}
+          .value=${isTemplate ? (_a = this.form.current_balance) !== null && _a !== void 0 ? _a : 0 : ''}
+          @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
+          @change=${(evt) => {
+            const field = evt.currentTarget;
+            this.edit({ current_balance: parseInt(field.value) });
+        }}
+        >
+        </vaadin-integer-field>
+        ${this.renderTemplateOrSlot('current-balance:after')}
+      </div>
     `;
     }
     __renderPrefix() {
         const isTemplate = this.in({ idle: 'template' });
         return html `
-      ${this.renderTemplateOrSlot('prefix:before')}
+      <div>
+        ${this.renderTemplateOrSlot('prefix:before')}
-      <vaadin-text-field
-        helper-text=${this.t('leave_empty_for_random_codes')}
-        label=${this.t('prefix')}
-        class="col-span-2"
-        min="1"
-        ?disabled=${!isTemplate || this.disabledSelector.matches('prefix', true)}
-        ?readonly=${this.readonlySelector.matches('prefix', true)}
-        clear-button-visible
-        .value=${isTemplate ? this.form.prefix : ''}
-        @change=${(evt) => {
+        <vaadin-text-field
+          helper-text=${this.t('leave_empty_for_random_codes')}
+          data-testid="prefix"
+          label=${this.t('prefix')}
+          class="col-span-2"
+          min="1"
+          ?disabled=${!isTemplate || this.disabledSelector.matches('prefix', true)}
+          ?readonly=${this.readonlySelector.matches('prefix', true)}
+          clear-button-visible
+          .value=${isTemplate ? this.form.prefix : ''}
+          @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
+          @change=${(evt) => {
             const field = evt.currentTarget;
             this.edit({ prefix: field.value });
         }}
-      >
-      </vaadin-text-field>
+        >
+        </vaadin-text-field>
-      ${this.renderTemplateOrSlot('prefix:after')}
+        ${this.renderTemplateOrSlot('prefix:after')}
+      </div>
     `;
     }
     __renderGenerate() {
         const isValidTemplate = this.in({ idle: { template: { dirty: 'valid' } } });
         return html `
-      ${this.renderTemplateOrSlot('generate:before')}
+      <div>
+        ${this.renderTemplateOrSlot('generate:before')}
-      <vaadin-button
-        class="col-span-2"
-        theme="success primary"
-        ?disabled=${!isValidTemplate || this.disabledSelector.matches('generate', true)}
-        @click=${this.submit}
-      >
-        <foxy-i18n lang=${this.lang} key="generate" ns=${this.ns}></foxy-i18n>
-      </vaadin-button>
+        <vaadin-button
+          data-testid="generate"
+          class="col-span-2"
+          theme="success primary"
+          ?disabled=${!isValidTemplate || this.disabledSelector.matches('generate', true)}
+          @click=${() => this.submit()}
+        >
+          <foxy-i18n lang=${this.lang} key="generate" ns=${this.ns}></foxy-i18n>
+        </vaadin-button>
-      ${this.renderTemplateOrSlot('create:after')}
+        ${this.renderTemplateOrSlot('generate:after')}
+      </div>
     `;
     }
 }

package/dist/elements/public/GenerateCodesForm/GenerateCodesForm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GenerateCodesForm.js","sourceRoot":"","sources":["../../../../src/elements/public/GenerateCodesForm/GenerateCodesForm.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { IntegerFieldElement } from '@vaadin/vaadin-text-field/vaadin-integer-field';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { NucleonV8N } from '../NucleonElement/types';\nimport { TextFieldElement } from '@vaadin/vaadin-text-field/vaadin-text-field';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'generate-codes';\nconst Base = ConfigurableMixin(ThemeableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/*\n Form element for generating codes for coupons or gift cards (`fx:generate_codes`).\n \n @slot length:before\n * @slot length:after\n \n @slot number-of-codes:before\n * @slot number-of-codes:after\n \n @slot prefix:before\n * @slot prefix:after\n \n @slot generate:before\n * @slot generate:after\n \n @element foxy-generate-codes-form\n * @since 1.15.0\n */\nexport class GenerateCodesForm extends Base<Data> {\n static get v8n(): NucleonV8N<Data> {\n return [\n ({ number_of_codes: v }) => (v && v > 0) \|\| 'number_of_codes_required',\n ({ length: v }) => (v && v > 0) \|\| 'length_required',\n ];\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 aria-busy=${isBusy} aria-live=\"polite\" class=\"relative\">\n <div\n class=${classMap({\n 'grid grid-cols-2 gap-m': true,\n [transition]: true,\n [hidden]: isSnapshot,\n })}\n >\n ${hiddenSelector.matches('length', true) ? '' : this.__renderLength()}\n ${hiddenSelector.matches('number-of-codes', true) ? '' : this.__renderNumberOfCodes()}\n ${hiddenSelector.matches('prefix', true) ? '' : this.__renderPrefix()}\n ${hiddenSelector.matches('generate', true) ? '' : this.__renderGenerate()}\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=\"generate_codes_done\" ns=${ns}></foxy-i18n>\n </div>\n\n <div\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 __getErrorMessage(prefix: string) {\n const error = this.errors.find(err => err.startsWith(prefix));\n return error ? this.t(error.replace(prefix, 'v8n')) : '';\n }\n\n private __getValidator(prefix: string) {\n return () => !this.errors.some(err => err.startsWith(prefix));\n }\n\n private __renderLength() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n ${this.renderTemplateOrSlot('length:before')}\n\n <vaadin-integer-field\n error-message=${this.__getErrorMessage('length')}\n label=${this.t('length')}\n class=\"w-full\"\n min=\"1\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('length', true)}\n ?readonly=${this.readonlySelector.matches('length', true)}\n prevent-invalid-input\n has-controls\n .checkValidity=${this.__getValidator('length')}\n .value=${isTemplate ? this.form.length : ''}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as IntegerFieldElement;\n this.edit({ length: parseInt(field.value) });\n }}\n >\n </vaadin-integer-field>\n\n ${this.renderTemplateOrSlot('length:after')}\n `;\n }\n\n private __renderNumberOfCodes() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n ${this.renderTemplateOrSlot('number-of-codes:before')}\n\n <vaadin-integer-field\n error-message=${this.__getErrorMessage('number_of_codes')}\n label=${this.t('number_of_codes')}\n class=\"w-full\"\n min=\"1\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('number-of-codes', true)}\n ?readonly=${this.readonlySelector.matches('number-of-codes', true)}\n prevent-invalid-input\n has-controls\n .checkValidity=${this.__getValidator('number_of_codes')}\n .value=${isTemplate ? this.form.number_of_codes : ''}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as IntegerFieldElement;\n this.edit({ number_of_codes: parseInt(field.value) });\n }}\n >\n </vaadin-integer-field>\n\n ${this.renderTemplateOrSlot('number-of-codes:after')}\n `;\n }\n\n private __renderPrefix() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n ${this.renderTemplateOrSlot('prefix:before')}\n\n <vaadin-text-field\n helper-text=${this.t('leave_empty_for_random_codes')}\n label=${this.t('prefix')}\n class=\"col-span-2\"\n min=\"1\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('prefix', true)}\n ?readonly=${this.readonlySelector.matches('prefix', true)}\n clear-button-visible\n .value=${isTemplate ? this.form.prefix : ''}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as TextFieldElement;\n this.edit({ prefix: field.value });\n }}\n >\n </vaadin-text-field>\n\n ${this.renderTemplateOrSlot('prefix:after')}\n `;\n }\n\n private __renderGenerate() {\n const isValidTemplate = this.in({ idle: { template: { dirty: 'valid' } } });\n\n return html`\n ${this.renderTemplateOrSlot('generate:before')}\n\n <vaadin-button\n class=\"col-span-2\"\n theme=\"success primary\"\n ?disabled=${!isValidTemplate \|\| this.disabledSelector.matches('generate', true)}\n @click=${this.submit}\n >\n <foxy-i18n lang=${this.lang} key=\"generate\" ns=${this.ns}></foxy-i18n>\n </vaadin-button>\n\n ${this.renderTemplateOrSlot('create:after')}\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"GenerateCodesForm.js","sourceRoot":"","sources":["../../../../src/elements/public/GenerateCodesForm/GenerateCodesForm.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { IntegerFieldElement } from '@vaadin/vaadin-text-field/vaadin-integer-field';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { NucleonV8N } from '../NucleonElement/types';\nimport { TextFieldElement } from '@vaadin/vaadin-text-field/vaadin-text-field';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'generate-codes-form';\nconst Base = ConfigurableMixin(ThemeableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/*\n Form element for generating codes for coupons or gift cards (`fx:generate_codes`).\n \n @slot length:before\n * @slot length:after\n \n @slot number-of-codes:before\n * @slot number-of-codes:after\n \n @slot prefix:before\n * @slot prefix:after\n \n @slot current-balance:before\n * @slot current-balance:after\n \n @slot generate:before\n * @slot generate:after\n \n @element foxy-generate-codes-form\n * @since 1.15.0\n */\nexport class GenerateCodesForm extends Base<Data> {\n static get v8n(): NucleonV8N<Data> {\n return [\n ({ number_of_codes: v }) => (v && v > 0) \|\| 'number_of_codes_required',\n ({ current_balance: v }) => !v \|\| v >= 0 \|\| 'current_balance_negative',\n ({ length: v }) => (v && v > 0) \|\| 'length_required',\n ];\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 aria-busy=${isBusy} aria-live=\"polite\" class=\"relative\">\n <div\n class=${classMap({\n 'grid grid-cols-2 gap-m': true,\n [transition]: true,\n [hidden]: isSnapshot,\n })}\n >\n ${hiddenSelector.matches('length', true) ? '' : this.__renderLength()}\n ${hiddenSelector.matches('number-of-codes', true) ? '' : this.__renderNumberOfCodes()}\n ${hiddenSelector.matches('current-balance', true) ? '' : this.__renderCurrentBalance()}\n ${hiddenSelector.matches('prefix', true) ? '' : this.__renderPrefix()}\n ${hiddenSelector.matches('generate', true) ? '' : this.__renderGenerate()}\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=\"generate_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 __getErrorMessage(prefix: string) {\n const error = this.errors.find(err => err.startsWith(prefix));\n return error ? this.t(error.replace(prefix, 'v8n')) : '';\n }\n\n private __getValidator(prefix: string) {\n return () => !this.errors.some(err => err.startsWith(prefix));\n }\n\n private __renderLength() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('length:before')}\n\n <vaadin-integer-field\n error-message=${this.__getErrorMessage('length')}\n data-testid=\"length\"\n label=${this.t('length')}\n class=\"w-full\"\n min=\"1\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('length', true)}\n ?readonly=${this.readonlySelector.matches('length', true)}\n prevent-invalid-input\n has-controls\n .checkValidity=${this.__getValidator('length')}\n .value=${isTemplate ? this.form.length : ''}\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as IntegerFieldElement;\n this.edit({ length: parseInt(field.value) });\n }}\n >\n </vaadin-integer-field>\n\n ${this.renderTemplateOrSlot('length:after')}\n </div>\n `;\n }\n\n private __renderNumberOfCodes() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('number-of-codes:before')}\n\n <vaadin-integer-field\n error-message=${this.__getErrorMessage('number_of_codes')}\n data-testid=\"number-of-codes\"\n label=${this.t('number_of_codes')}\n class=\"w-full\"\n min=\"1\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('number-of-codes', true)}\n ?readonly=${this.readonlySelector.matches('number-of-codes', true)}\n prevent-invalid-input\n has-controls\n .checkValidity=${this.__getValidator('number_of_codes')}\n .value=${isTemplate ? this.form.number_of_codes : ''}\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as IntegerFieldElement;\n this.edit({ number_of_codes: parseInt(field.value) });\n }}\n >\n </vaadin-integer-field>\n\n ${this.renderTemplateOrSlot('number-of-codes:after')}\n </div>\n `;\n }\n\n private __renderCurrentBalance() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('current-balance:before')}\n\n <vaadin-integer-field\n error-message=${this.__getErrorMessage('current_balance')}\n data-testid=\"current-balance\"\n label=${this.t('balance')}\n class=\"w-full col-span-2\"\n min=\"0\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('current-balance', true)}\n ?readonly=${this.readonlySelector.matches('current-balance', true)}\n prevent-invalid-input\n has-controls\n .checkValidity=${this.__getValidator('current_balance')}\n .value=${isTemplate ? this.form.current_balance ?? 0 : ''}\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as IntegerFieldElement;\n this.edit({ current_balance: parseInt(field.value) });\n }}\n >\n </vaadin-integer-field>\n\n ${this.renderTemplateOrSlot('current-balance:after')}\n </div>\n `;\n }\n\n private __renderPrefix() {\n const isTemplate = this.in({ idle: 'template' });\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('prefix:before')}\n\n <vaadin-text-field\n helper-text=${this.t('leave_empty_for_random_codes')}\n data-testid=\"prefix\"\n label=${this.t('prefix')}\n class=\"col-span-2\"\n min=\"1\"\n ?disabled=${!isTemplate \|\| this.disabledSelector.matches('prefix', true)}\n ?readonly=${this.readonlySelector.matches('prefix', true)}\n clear-button-visible\n .value=${isTemplate ? this.form.prefix : ''}\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const field = evt.currentTarget as TextFieldElement;\n this.edit({ prefix: field.value });\n }}\n >\n </vaadin-text-field>\n\n ${this.renderTemplateOrSlot('prefix:after')}\n </div>\n `;\n }\n\n private __renderGenerate() {\n const isValidTemplate = this.in({ idle: { template: { dirty: 'valid' } } });\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('generate:before')}\n\n <vaadin-button\n data-testid=\"generate\"\n class=\"col-span-2\"\n theme=\"success primary\"\n ?disabled=${!isValidTemplate \|\| this.disabledSelector.matches('generate', true)}\n @click=${() => this.submit()}\n >\n <foxy-i18n lang=${this.lang} key=\"generate\" ns=${this.ns}></foxy-i18n>\n </vaadin-button>\n\n ${this.renderTemplateOrSlot('generate:after')}\n </div>\n `;\n }\n}\n"]}

package/dist/elements/public/GiftCardCard/GiftCardCard.js CHANGED Viewed

@@ -4,7 +4,6 @@ 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 { parseDuration } from "../../../utils/parse-duration.js";
 const NS = 'gift-card-card';
 const Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement, NS)));
 /**
@@ -60,12 +59,12 @@ export class GiftCardCard extends Base {
         const name = (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : html `&ZeroWidthSpace;`;
         const code = (_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c.currency_code) !== null && _d !== void 0 ? _d : html `&ZeroWidthSpace;`;
         return html `
-      <div>
+      <div data-testid="title">
         ${this.renderTemplateOrSlot('title:before')}
         <div class="flex items-center justify-between">
           <div class="font-semibold truncate">${name}</div>
-          <div class="text-tertiary text-s flex-shrink-0">${code}</div>
+          <div class="text-tertiary uppercase text-s flex-shrink-0">${code}</div>
         </div>
         ${this.renderTemplateOrSlot('title:after')}
@@ -74,38 +73,16 @@ export class GiftCardCard extends Base {
     }
     __renderStatus() {
         var _a;
-        let options;
-        let key;
-        if ((_a = this.data) === null || _a === void 0 ? void 0 : _a.expires_after) {
-            let value;
-            try {
-                const rtf = new Intl.RelativeTimeFormat(this.lang);
-                let { count, units } = parseDuration(this.data.expires_after, true);
-                if (count === 0.5 && units === 'month') {
-                    count = 2;
-                    units = 'week';
-                }
-                value = rtf.format(count, units);
-            }
-            catch (_b) {
-                value = this.data.expires_after;
-            }
-            options = JSON.stringify({ value });
-            key = 'expires_after_value';
-        }
-        else {
-            options = '';
-            key = 'never_expires';
-        }
+        const expiresAfter = (_a = this.data) === null || _a === void 0 ? void 0 : _a.expires_after;
         return html `
-      <div>
+      <div data-testid="status">
         ${this.renderTemplateOrSlot('status:before')}
         <foxy-i18n
-          options=${options}
+          options=${JSON.stringify({ value: expiresAfter })}
           class="block truncate text-s text-tertiary"
           lang=${this.lang}
-          key=${key}
+          key=${expiresAfter ? 'expires_after_value' : 'never_expires'}
           ns=${this.ns}
         >
         </foxy-i18n>

package/dist/elements/public/GiftCardCard/GiftCardCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GiftCardCard.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCard/GiftCardCard.ts"],"names":[],"mappings":"AACA,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,cAAc,EAAE,4CAAyC;AAClE,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,QAAQ,EAAE,oCAAiC;~~AACpD~~,~~OAAO,EAAE,aAAa,EAAE,yCAAsC;AAE9D,~~MAAM,EAAE,GAAG,gBAAgB,CAAC;AAC5B,MAAM,IAAI,GAAG,cAAc,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAEtF;;;;;;;;;;GAUG;AACH,MAAM,OAAO,YAAa,SAAQ,IAAU;IAA5C;;QACE,cAAS,GAAc,EAAE,CAAC;~~IAkG5B~~,CAAC;~~IAhGC~~,MAAM;;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;QAE3C,OAAO,IAAI,CAAA;;oBAEK,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC;;;;qBAId,QAAQ,CAAC,EAAE,oBAAoB,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1E,cAAc,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE;YACjE,cAAc,CAAC,OAAO,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE;;;;kBAI7D,QAAQ,CAAC;YACf,8DAA8D,EAAE,IAAI;YACpE,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;SACzB,CAAC;;;;oBAIQ,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;;mBAE7E,IAAI,CAAC,IAAI;kBACV,IAAI,CAAC,EAAE,IAAI,YAAA,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,0CAAE,SAAS,mCAAI,EAAE;;;;;KAK3E,CAAC;IACJ,CAAC;IAEO,aAAa;;QACnB,MAAM,IAAI,eAAG,IAAI,CAAC,IAAI,0CAAE,IAAI,mCAAI,IAAI,CAAA,kBAAkB,CAAC;QACvD,MAAM,IAAI,eAAG,IAAI,CAAC,IAAI,0CAAE,aAAa,mCAAI,IAAI,CAAA,kBAAkB,CAAC;QAEhE,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;;;gDAGH,IAAI;~~4DACQ~~,IAAI;;;~~UAGtD~~,IAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC;;KAE7C,CAAC;IACJ,CAAC;IAEO,cAAc;;QACpB,~~IAAI~~,~~OAAe~~,~~CAAC;QACpB~~,IAAI,~~GAAW,~~CAAC~~;QAEhB~~,~~UAAI,~~IAAI,~~CAAC,IAAI,~~0CAAE,aAAa,~~EAAE;YAC5B,IAAI,KAAa,~~CAAC;~~YAElB~~,~~IAAI;gBACF~~,~~MAAM,GAAG,GAAG,~~IAAI,~~IAAI~~,~~CAAC,kBAAkB,CAAC,~~IAAI,CAAC,~~IAAI~~,CAAC,~~CAAC;gBACnD~~,~~IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,aAAa,~~CAAC,IAAI,CAAC,~~IAAI~~,CAAC,~~aAAa,~~EAAE,~~IAAI,CAAC,CAAC;gBAEpE,IAAI,~~KAAK,~~KAAK,GAAG,IAAI,KAAK,KAAK,OAAO,~~EAAE~~;oBACtC~~,~~KAAK~~,~~GAAG,CAAC,CAAC;oBACV,KAAK,GAAG,MAAM,CAAC;iBAChB;gBAED,KAAK,GAAG,GAAG,CAAC,MAAM,CAAC,KAAK,~~EAAE,~~KAAoC,~~CAAC,~~CAAC;aACjE;YAAC,WAAM;gBACN,KAAK,GAAG,~~IAAI,CAAC,IAAI~~,CAAC,aAAa,CAAC~~;~~aACjC;YAED~~,~~OAAO~~,~~GAAG,IAAI,~~CAAC,~~SAAS,~~CAAC,~~EAAE,KAAK,EAAE,~~CAAC,~~CAAC;YACpC,GAAG,GAAG,~~qBAAqB,CAAC~~;SAC7B;aAAM;YACL~~,~~OAAO,GAAG,EAAE,~~CAAC~~;YACb~~,~~GAAG,GAAG,eAAe,~~CAAC~~;SACvB;QAED~~,~~OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,~~eAAe~~,CAAC;;;oBAGhC,OAAO;;iBAEV,IAAI,CAAC,IAAI~~;~~gBACV~~,~~GAAG;eACJ,~~IAAI,CAAC,EAAE;;;;UAIZ,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;;KAE9C,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\~~nimport { parseDuration } from '../../../utils/parse-duration';\~~n\nconst NS = 'gift-card-card';\nconst Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/*\n Basic card displaying a gift card.\n \n @slot title:before\n * @slot title:after\n * @slot status:before\n * @slot status:after\n \n @element foxy-gift-card-card\n * @since 1.15.0\n */\nexport class GiftCardCard extends Base<Data> {\n templates: Templates = {};\n\n render(): TemplateResult {\n const hiddenSelector = this.hiddenSelector;\n\n return html`\n <div\n aria-busy=${this.in('busy')}\n aria-live=\"polite\"\n class=\"relative leading-m font-lumo text-m\"\n >\n <div class=${classMap({ 'transition-opacity': true, 'opacity-0': !this.data })}>\n ${hiddenSelector.matches('title', true) ? '' : this.__renderTitle()}\n ${hiddenSelector.matches('status', true) ? '' : this.__renderStatus()}\n </div>\n\n <div\n class=${classMap({\n 'pointer-events-none absolute inset-0 flex transition-opacity': true,\n 'opacity-0': !!this.data,\n })}\n >\n <foxy-spinner\n data-testid=\"spinner\"\n state=${this.in('fail') ? 'error' : this.in({ idle: 'template' }) ? 'empty' : 'busy'}\n class=\"m-auto\"\n lang=${this.lang}\n ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n >\n </foxy-spinner>\n </div>\n </div>\n `;\n }\n\n private __renderTitle() {\n const name = this.data?.name ?? html`&ZeroWidthSpace;`;\n const code = this.data?.currency_code ?? html`&ZeroWidthSpace;`;\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('title:before')}\n\n <div class=\"flex items-center justify-between\">\n <div class=\"font-semibold truncate\">${name}</div>\n <div class=\"text-tertiary text-s flex-shrink-0\">${code}</div>\n </div>\n\n ${this.renderTemplateOrSlot('title:after')}\n </div>\n `;\n }\n\n private __renderStatus() {\n ~~let options: string;\n let key: string;\n\n if (this.data?.expires_after) {\n let value: string;\n\n try {\n~~ const ~~rtf~~ = ~~new Intl.RelativeTimeFormat(~~this.~~lang);\n let { count, units } = parseDuration(this.~~data.expires_after~~, true)~~;\n\n if (count === 0.5 && units === 'month') {\n count = 2;\n units = 'week';\n }\n\n value = rtf.format(count, units as Intl.RelativeTimeFormatUnit);\n } catch {\n value = this.data.expires_after;\n }\n\n options = JSON.stringify({ value });\n key = 'expires_after_value';\n ~~} else {\n options = '';\n key = 'never_expires';\n }\n\n~~ return html`\n <div>\n ${this.renderTemplateOrSlot('status:before')}\n\n <foxy-i18n\n options=${~~options~~}\n class=\"block truncate text-s text-tertiary\"\n lang=${this.lang}\n key=${~~key~~}\n ns=${this.ns}\n >\n </foxy-i18n>\n\n ${this.renderTemplateOrSlot('status:after')}\n </div>\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"GiftCardCard.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCard/GiftCardCard.ts"],"names":[],"mappings":"AACA,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,cAAc,EAAE,4CAAyC;AAClE,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD,MAAM,EAAE,GAAG,gBAAgB,CAAC;AAC5B,MAAM,IAAI,GAAG,cAAc,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAEtF;;;;;;;;;;GAUG;AACH,MAAM,OAAO,YAAa,SAAQ,IAAU;IAA5C;;QACE,cAAS,GAAc,EAAE,CAAC;IAyE5B,CAAC;IAvEC,MAAM;;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;QAE3C,OAAO,IAAI,CAAA;;oBAEK,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC;;;;qBAId,QAAQ,CAAC,EAAE,oBAAoB,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1E,cAAc,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE;YACjE,cAAc,CAAC,OAAO,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE;;;;kBAI7D,QAAQ,CAAC;YACf,8DAA8D,EAAE,IAAI;YACpE,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;SACzB,CAAC;;;;oBAIQ,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;;mBAE7E,IAAI,CAAC,IAAI;kBACV,IAAI,CAAC,EAAE,IAAI,YAAA,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,0CAAE,SAAS,mCAAI,EAAE;;;;;KAK3E,CAAC;IACJ,CAAC;IAEO,aAAa;;QACnB,MAAM,IAAI,eAAG,IAAI,CAAC,IAAI,0CAAE,IAAI,mCAAI,IAAI,CAAA,kBAAkB,CAAC;QACvD,MAAM,IAAI,eAAG,IAAI,CAAC,IAAI,0CAAE,aAAa,mCAAI,IAAI,CAAA,kBAAkB,CAAC;QAEhE,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;;;gDAGH,IAAI;sEACkB,IAAI;;;UAGhE,IAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC;;KAE7C,CAAC;IACJ,CAAC;IAEO,cAAc;;QACpB,MAAM,YAAY,SAAG,IAAI,CAAC,IAAI,0CAAE,aAAa,CAAC;QAE9C,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,eAAe,CAAC;;;oBAGhC,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC;;iBAE1C,IAAI,CAAC,IAAI;gBACV,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,eAAe;eACvD,IAAI,CAAC,EAAE;;;;UAIZ,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;;KAE9C,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'gift-card-card';\nconst Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/*\n Basic card displaying a gift card.\n \n @slot title:before\n * @slot title:after\n * @slot status:before\n * @slot status:after\n \n @element foxy-gift-card-card\n * @since 1.15.0\n */\nexport class GiftCardCard extends Base<Data> {\n templates: Templates = {};\n\n render(): TemplateResult {\n const hiddenSelector = this.hiddenSelector;\n\n return html`\n <div\n aria-busy=${this.in('busy')}\n aria-live=\"polite\"\n class=\"relative leading-m font-lumo text-m\"\n >\n <div class=${classMap({ 'transition-opacity': true, 'opacity-0': !this.data })}>\n ${hiddenSelector.matches('title', true) ? '' : this.__renderTitle()}\n ${hiddenSelector.matches('status', true) ? '' : this.__renderStatus()}\n </div>\n\n <div\n class=${classMap({\n 'pointer-events-none absolute inset-0 flex transition-opacity': true,\n 'opacity-0': !!this.data,\n })}\n >\n <foxy-spinner\n data-testid=\"spinner\"\n state=${this.in('fail') ? 'error' : this.in({ idle: 'template' }) ? 'empty' : 'busy'}\n class=\"m-auto\"\n lang=${this.lang}\n ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n >\n </foxy-spinner>\n </div>\n </div>\n `;\n }\n\n private __renderTitle() {\n const name = this.data?.name ?? html`&ZeroWidthSpace;`;\n const code = this.data?.currency_code ?? html`&ZeroWidthSpace;`;\n\n return html`\n <div data-testid=\"title\">\n ${this.renderTemplateOrSlot('title:before')}\n\n <div class=\"flex items-center justify-between\">\n <div class=\"font-semibold truncate\">${name}</div>\n <div class=\"text-tertiary uppercase text-s flex-shrink-0\">${code}</div>\n </div>\n\n ${this.renderTemplateOrSlot('title:after')}\n </div>\n `;\n }\n\n private __renderStatus() {\n const expiresAfter = this.data?.expires_after;\n\n return html`\n <div data-testid=\"status\">\n ${this.renderTemplateOrSlot('status:before')}\n\n <foxy-i18n\n options=${JSON.stringify({ value: expiresAfter })}\n class=\"block truncate text-s text-tertiary\"\n lang=${this.lang}\n key=${expiresAfter ? 'expires_after_value' : 'never_expires'}\n ns=${this.ns}\n >\n </foxy-i18n>\n\n ${this.renderTemplateOrSlot('status:after')}\n </div>\n `;\n }\n}\n"]}

package/dist/elements/public/GiftCardCard/types.d.ts CHANGED Viewed

@@ -1,33 +1,8 @@
-import { Renderer } from '../../../mixins/configurable';
 import { GiftCardCard } from './GiftCardCard';
-export declare type Data = {
-    _links: {
-        'curies': [{
-            href: string;
-        }];
-        'self': {
-            href: string;
-        };
-        'fx:store': {
-            href: string;
-        };
-        'fx:generate_codes': {
-            href: string;
-        };
-        'fx:gift_card_codes': {
-            href: string;
-        };
-        'fx:gift_card_item_categories': {
-            href: string;
-        };
-    };
-    name: string;
-    currency_code: string;
-    expires_after: string;
-    product_code_restrictions: string | null;
-    date_created: string | null;
-    date_modified: string | null;
-};
+import { Rels } from '@foxy.io/sdk/backend';
+import { Renderer } from '../../../mixins/configurable';
+import { Resource } from '@foxy.io/sdk/core';
+export declare type Data = Resource<Rels.GiftCard>;
 export declare type Templates = Partial<{
     'title:before': Renderer<GiftCardCard>;
     'title:after': Renderer<GiftCardCard>;

package/dist/elements/public/GiftCardCard/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCard/types.ts"],"names":[],"mappings":"","sourcesContent":["import { ~~Renderer~~ } from '~~../../../mixins/configurable~~';\nimport { ~~GiftCardCard~~ } from '~~./GiftCardCard~~';\~~n\nexport~~ ~~type Data =~~ {~~\n _links:~~ ~~{\n 'curies':~~ ~~[{ href: string~~ }~~];\n 'self':~~ { ~~href: string };\n~~ '~~fx:store~~'~~: { href: string }~~;\~~n 'fx:generate_codes':~~ { ~~href:~~ ~~string~~ }~~;\n 'fx:gift_card_codes':~~ { ~~href: string };\n~~ '~~fx:gift_card_item_categories~~'~~: { href: string }~~;\n ~~};\n name:~~ ~~string;\n currency_code:~~ ~~string;\n expires_after:~~ ~~string;\n product_code_restrictions:~~ ~~string \| null;\~~n ~~date_created: string \| null;\n date_modified: string \| null;\n};\n~~\nexport type Templates = Partial<{\n 'title:before': Renderer<GiftCardCard>;\n 'title:after': Renderer<GiftCardCard>;\n 'status:before': Renderer<GiftCardCard>;\n 'status:after': Renderer<GiftCardCard>;\n}>;\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCard/types.ts"],"names":[],"mappings":"","sourcesContent":["import { GiftCardCard } from './GiftCardCard';\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.GiftCard>;\n\nexport type Templates = Partial<{\n 'title:before': Renderer<GiftCardCard>;\n 'title:after': Renderer<GiftCardCard>;\n 'status:before': Renderer<GiftCardCard>;\n 'status:after': Renderer<GiftCardCard>;\n}>;\n"]}

package/dist/elements/public/GiftCardCodeForm/GiftCardCodeForm.js CHANGED Viewed

@@ -243,7 +243,7 @@ export class GiftCardCodeForm extends Base {
           class="w-full"
           theme="primary success"
           ?disabled=${isBusy || isInvalid || this.disabledSelector.matches('create', true)}
-          @click=${this.submit}
+          @click=${() => this.submit()}
         >
           <foxy-i18n ns=${this.ns} key="create" lang=${this.lang}></foxy-i18n>
         </vaadin-button>

package/dist/elements/public/GiftCardCodeForm/GiftCardCodeForm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GiftCardCodeForm.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCodeForm/GiftCardCodeForm.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 { ButtonElement } from '@vaadin/vaadin-button';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport { InternalConfirmDialog } from '../../internal/InternalConfirmDialog/InternalConfirmDialog';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { NucleonV8N } from '../NucleonElement/types';\nimport { PropertyTable } from '../../private/index';\nimport { TextFieldElement } from '@vaadin/vaadin-text-field';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'gift-card-code-form';\nconst Base = ConfigurableMixin(\n ThemeableMixin(ScopedElementsMixin(TranslatableMixin(NucleonElement, NS)))\n);\n\n/*\n Form element for creating or editing gift card codes (`fx:gift_card_code`).\n \n @slot code:before\n * @slot code:after\n \n @slot current-balance:before\n * @slot current-balance:after\n \n @slot end-date:before\n * @slot end-date:after\n \n @slot timestamps:before\n * @slot timestamps:after\n \n @slot delete:before\n * @slot delete:after\n \n @slot create:before\n * @slot create:after\n \n @element foxy-gift-card-code-form\n * @since 1.15.0\n */\nexport class GiftCardCodeForm extends Base<Data> {\n static get scopedElements(): ScopedElementsMap {\n return {\n 'vaadin-number-field': customElements.get('vaadin-number-field'),\n 'vaadin-date-picker': customElements.get('vaadin-date-picker'),\n 'vaadin-text-field': customElements.get('vaadin-text-field'),\n 'vaadin-button': customElements.get('vaadin-button'),\n\n 'foxy-internal-confirm-dialog': customElements.get('foxy-internal-confirm-dialog'),\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-property-table': PropertyTable,\n };\n }\n\n static get v8n(): NucleonV8N<Data> {\n return [\n ({ code: v }) => !!v \|\| 'code_required',\n ({ code: v }) => !v \|\| v.length <= 50 \|\| 'code_too_long',\n ({ current_balance: v }) => !!v \|\| 'current_balance_required',\n ({ current_balance: v }) => !v \|\| !isNaN(v) \|\| 'current_balance_required',\n ];\n }\n\n templates: Templates = {};\n\n render(): TemplateResult {\n return html`\n <div class=\"relative space-y-m\">\n ${this.__isCodeHidden ? null : this.__renderCode()}\n ${this.__isCurrentBalanceHidden ? null : this.__renderCurrentBalance()}\n ${this.__isEndDateHidden ? null : this.__renderEndDate()}\n ${this.__isTimestampsHidden ? null : this.__renderTimestamps()}\n ${this.__isCreateHidden ? null : this.__renderCreate()}\n ${this.__isDeleteHidden ? null : this.__renderDelete()}\n\n <div\n data-testid=\"spinner\"\n class=${classMap({\n 'transition duration-500 ease-in-out absolute inset-0 flex': true,\n 'opacity-0 pointer-events-none': !this.in('busy') && !this.in('fail'),\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=${this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty'}\n lang=${this.lang}\n ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n >\n </foxy-spinner>\n </div>\n </div>\n `;\n }\n\n private get __isCodeHidden(): boolean {\n return this.hiddenSelector.matches('code', true);\n }\n\n private get __isCurrentBalanceHidden(): boolean {\n return this.hiddenSelector.matches('current-balance', true);\n }\n\n private get __isEndDateHidden(): boolean {\n return this.hiddenSelector.matches('end-date', true);\n }\n\n private get __isTimestampsHidden(): boolean {\n if (this.hiddenSelector.matches('timestamps', true)) return true;\n return !this.data;\n }\n\n private get __isCreateHidden(): boolean {\n if (this.hiddenSelector.matches('create', true)) return true;\n return !!this.data;\n }\n\n private get __isDeleteHidden(): boolean {\n if (this.hiddenSelector.matches('delete', true)) return true;\n return !this.data;\n }\n\n private __getErrorMessage(prefix: string) {\n const error = this.errors.find(err => err.startsWith(prefix));\n return error ? this.t(error.replace(prefix, 'v8n')).toString() : '';\n }\n\n private __getValidator(prefix: string) {\n return () => !this.errors.some(err => err.startsWith(prefix));\n }\n\n private __renderCode(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('code:before')}\n\n <vaadin-text-field\n data-testid=\"code\"\n class=\"w-full\"\n label=${this.t('code')}\n .checkValidity=${this.__getValidator('code')}\n .errorMessage=${this.__getErrorMessage('code')}\n .value=${this.form.code}\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('code', true)}\n ?readonly=${this.readonlySelector.matches('code', true)}\n required\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @input=${(evt: CustomEvent) => {\n const newCode = (evt.currentTarget as TextFieldElement).value;\n this.edit({ code: newCode });\n }}\n >\n </vaadin-text-field>\n\n ${this.renderTemplateOrSlot('code:after')}\n </div>\n `;\n }\n\n private __renderCurrentBalance(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('current-balance:before')}\n\n <vaadin-number-field\n data-testid=\"current-balance\"\n class=\"w-full\"\n label=${this.t('current_balance')}\n min=\"0\"\n .checkValidity=${this.__getValidator('current_balance')}\n .errorMessage=${this.__getErrorMessage('current_balance')}\n .value=${this.form.current_balance}\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('current-balance', true)}\n ?readonly=${this.readonlySelector.matches('current-balance', true)}\n prevent-invalid-input\n has-controls\n required\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const newCurrentBalance = (evt.currentTarget as TextFieldElement).value;\n this.edit({ current_balance: parseFloat(newCurrentBalance) });\n }}\n >\n </vaadin-number-field>\n\n ${this.renderTemplateOrSlot('current-balance:after')}\n </div>\n `;\n }\n\n private __renderEndDate(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('end-date:before')}\n\n <vaadin-date-picker\n data-testid=\"end-date\"\n class=\"w-full\"\n label=${this.t('end_date')}\n min=\"0\"\n .checkValidity=${this.__getValidator('end_date')}\n .errorMessage=${this.__getErrorMessage('end_date')}\n .value=${this.form.end_date}\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('end-date', true)}\n ?readonly=${this.readonlySelector.matches('end-date', true)}\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const newEndDate = (evt.currentTarget as TextFieldElement).value;\n this.edit({ end_date: newEndDate });\n }}\n >\n </vaadin-date-picker>\n\n ${this.renderTemplateOrSlot('end-date:after')}\n </div>\n `;\n }\n\n private __renderTimestamps(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('timestamps:before')}\n\n <x-property-table\n data-testid=\"timestamps\"\n .items=${(['date_modified', 'date_created'] as const).map(field => ({\n name: this.t(field),\n value: this.data?.[field]\n ? this.t('date', { value: new Date(this.data[field] as string) })\n : '',\n }))}\n >\n </x-property-table>\n\n ${this.renderTemplateOrSlot('timestamps:after')}\n </div>\n `;\n }\n\n private __renderCreate(): TemplateResult {\n const isCleanTemplateInvalid = this.in({ idle: { template: { clean: 'invalid' } } });\n const isDirtyTemplateInvalid = this.in({ idle: { template: { dirty: 'invalid' } } });\n const isCleanSnapshotInvalid = this.in({ idle: { snapshot: { clean: 'invalid' } } });\n const isDirtySnapshotInvalid = this.in({ idle: { snapshot: { dirty: 'invalid' } } });\n const isTemplateInvalid = isCleanTemplateInvalid \|\| isDirtyTemplateInvalid;\n const isSnaphotInvalid = isCleanSnapshotInvalid \|\| isDirtySnapshotInvalid;\n const isInvalid = isTemplateInvalid \|\| isSnaphotInvalid;\n const isBusy = this.in('busy');\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('create:before')}\n\n <vaadin-button\n data-testid=\"create\"\n class=\"w-full\"\n theme=\"primary success\"\n ?disabled=${isBusy \|\| isInvalid \|\| this.disabledSelector.matches('create', true)}\n @click=${this.submit}\n >\n <foxy-i18n ns=${this.ns} key=\"create\" lang=${this.lang}></foxy-i18n>\n </vaadin-button>\n\n ${this.renderTemplateOrSlot('create:after')}\n </div>\n `;\n }\n\n private __renderDelete(): TemplateResult {\n return html`\n <div>\n <foxy-internal-confirm-dialog\n data-testid=\"confirm\"\n message=\"delete_prompt\"\n confirm=\"delete\"\n cancel=\"cancel\"\n header=\"delete\"\n theme=\"primary error\"\n lang=${this.lang}\n ns=${this.ns}\n id=\"confirm\"\n @hide=${(evt: DialogHideEvent) => !evt.detail.cancelled && this.delete()}\n >\n </foxy-internal-confirm-dialog>\n\n ${this.renderTemplateOrSlot('delete:before')}\n\n <vaadin-button\n data-testid=\"delete\"\n theme=\"primary error\"\n class=\"w-full\"\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('delete', true)}\n @click=${(evt: CustomEvent) => {\n const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n confirm.show(evt.currentTarget as ButtonElement);\n }}\n >\n <foxy-i18n ns=${this.ns} key=\"delete\" lang=${this.lang}></foxy-i18n>\n </vaadin-button>\n\n ${this.renderTemplateOrSlot('delete:after')}\n </div>\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"GiftCardCodeForm.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCodeForm/GiftCardCodeForm.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 { ButtonElement } from '@vaadin/vaadin-button';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport { InternalConfirmDialog } from '../../internal/InternalConfirmDialog/InternalConfirmDialog';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { NucleonV8N } from '../NucleonElement/types';\nimport { PropertyTable } from '../../private/index';\nimport { TextFieldElement } from '@vaadin/vaadin-text-field';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'gift-card-code-form';\nconst Base = ConfigurableMixin(\n ThemeableMixin(ScopedElementsMixin(TranslatableMixin(NucleonElement, NS)))\n);\n\n/*\n Form element for creating or editing gift card codes (`fx:gift_card_code`).\n \n @slot code:before\n * @slot code:after\n \n @slot current-balance:before\n * @slot current-balance:after\n \n @slot end-date:before\n * @slot end-date:after\n \n @slot timestamps:before\n * @slot timestamps:after\n \n @slot delete:before\n * @slot delete:after\n \n @slot create:before\n * @slot create:after\n \n @element foxy-gift-card-code-form\n * @since 1.15.0\n */\nexport class GiftCardCodeForm extends Base<Data> {\n static get scopedElements(): ScopedElementsMap {\n return {\n 'vaadin-number-field': customElements.get('vaadin-number-field'),\n 'vaadin-date-picker': customElements.get('vaadin-date-picker'),\n 'vaadin-text-field': customElements.get('vaadin-text-field'),\n 'vaadin-button': customElements.get('vaadin-button'),\n\n 'foxy-internal-confirm-dialog': customElements.get('foxy-internal-confirm-dialog'),\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-property-table': PropertyTable,\n };\n }\n\n static get v8n(): NucleonV8N<Data> {\n return [\n ({ code: v }) => !!v \|\| 'code_required',\n ({ code: v }) => !v \|\| v.length <= 50 \|\| 'code_too_long',\n ({ current_balance: v }) => !!v \|\| 'current_balance_required',\n ({ current_balance: v }) => !v \|\| !isNaN(v) \|\| 'current_balance_required',\n ];\n }\n\n templates: Templates = {};\n\n render(): TemplateResult {\n return html`\n <div class=\"relative space-y-m\">\n ${this.__isCodeHidden ? null : this.__renderCode()}\n ${this.__isCurrentBalanceHidden ? null : this.__renderCurrentBalance()}\n ${this.__isEndDateHidden ? null : this.__renderEndDate()}\n ${this.__isTimestampsHidden ? null : this.__renderTimestamps()}\n ${this.__isCreateHidden ? null : this.__renderCreate()}\n ${this.__isDeleteHidden ? null : this.__renderDelete()}\n\n <div\n data-testid=\"spinner\"\n class=${classMap({\n 'transition duration-500 ease-in-out absolute inset-0 flex': true,\n 'opacity-0 pointer-events-none': !this.in('busy') && !this.in('fail'),\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=${this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty'}\n lang=${this.lang}\n ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n >\n </foxy-spinner>\n </div>\n </div>\n `;\n }\n\n private get __isCodeHidden(): boolean {\n return this.hiddenSelector.matches('code', true);\n }\n\n private get __isCurrentBalanceHidden(): boolean {\n return this.hiddenSelector.matches('current-balance', true);\n }\n\n private get __isEndDateHidden(): boolean {\n return this.hiddenSelector.matches('end-date', true);\n }\n\n private get __isTimestampsHidden(): boolean {\n if (this.hiddenSelector.matches('timestamps', true)) return true;\n return !this.data;\n }\n\n private get __isCreateHidden(): boolean {\n if (this.hiddenSelector.matches('create', true)) return true;\n return !!this.data;\n }\n\n private get __isDeleteHidden(): boolean {\n if (this.hiddenSelector.matches('delete', true)) return true;\n return !this.data;\n }\n\n private __getErrorMessage(prefix: string) {\n const error = this.errors.find(err => err.startsWith(prefix));\n return error ? this.t(error.replace(prefix, 'v8n')).toString() : '';\n }\n\n private __getValidator(prefix: string) {\n return () => !this.errors.some(err => err.startsWith(prefix));\n }\n\n private __renderCode(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('code:before')}\n\n <vaadin-text-field\n data-testid=\"code\"\n class=\"w-full\"\n label=${this.t('code')}\n .checkValidity=${this.__getValidator('code')}\n .errorMessage=${this.__getErrorMessage('code')}\n .value=${this.form.code}\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('code', true)}\n ?readonly=${this.readonlySelector.matches('code', true)}\n required\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @input=${(evt: CustomEvent) => {\n const newCode = (evt.currentTarget as TextFieldElement).value;\n this.edit({ code: newCode });\n }}\n >\n </vaadin-text-field>\n\n ${this.renderTemplateOrSlot('code:after')}\n </div>\n `;\n }\n\n private __renderCurrentBalance(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('current-balance:before')}\n\n <vaadin-number-field\n data-testid=\"current-balance\"\n class=\"w-full\"\n label=${this.t('current_balance')}\n min=\"0\"\n .checkValidity=${this.__getValidator('current_balance')}\n .errorMessage=${this.__getErrorMessage('current_balance')}\n .value=${this.form.current_balance}\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('current-balance', true)}\n ?readonly=${this.readonlySelector.matches('current-balance', true)}\n prevent-invalid-input\n has-controls\n required\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const newCurrentBalance = (evt.currentTarget as TextFieldElement).value;\n this.edit({ current_balance: parseFloat(newCurrentBalance) });\n }}\n >\n </vaadin-number-field>\n\n ${this.renderTemplateOrSlot('current-balance:after')}\n </div>\n `;\n }\n\n private __renderEndDate(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('end-date:before')}\n\n <vaadin-date-picker\n data-testid=\"end-date\"\n class=\"w-full\"\n label=${this.t('end_date')}\n min=\"0\"\n .checkValidity=${this.__getValidator('end_date')}\n .errorMessage=${this.__getErrorMessage('end_date')}\n .value=${this.form.end_date}\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('end-date', true)}\n ?readonly=${this.readonlySelector.matches('end-date', true)}\n @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.submit()}\n @change=${(evt: CustomEvent) => {\n const newEndDate = (evt.currentTarget as TextFieldElement).value;\n this.edit({ end_date: newEndDate });\n }}\n >\n </vaadin-date-picker>\n\n ${this.renderTemplateOrSlot('end-date:after')}\n </div>\n `;\n }\n\n private __renderTimestamps(): TemplateResult {\n return html`\n <div>\n ${this.renderTemplateOrSlot('timestamps:before')}\n\n <x-property-table\n data-testid=\"timestamps\"\n .items=${(['date_modified', 'date_created'] as const).map(field => ({\n name: this.t(field),\n value: this.data?.[field]\n ? this.t('date', { value: new Date(this.data[field] as string) })\n : '',\n }))}\n >\n </x-property-table>\n\n ${this.renderTemplateOrSlot('timestamps:after')}\n </div>\n `;\n }\n\n private __renderCreate(): TemplateResult {\n const isCleanTemplateInvalid = this.in({ idle: { template: { clean: 'invalid' } } });\n const isDirtyTemplateInvalid = this.in({ idle: { template: { dirty: 'invalid' } } });\n const isCleanSnapshotInvalid = this.in({ idle: { snapshot: { clean: 'invalid' } } });\n const isDirtySnapshotInvalid = this.in({ idle: { snapshot: { dirty: 'invalid' } } });\n const isTemplateInvalid = isCleanTemplateInvalid \|\| isDirtyTemplateInvalid;\n const isSnaphotInvalid = isCleanSnapshotInvalid \|\| isDirtySnapshotInvalid;\n const isInvalid = isTemplateInvalid \|\| isSnaphotInvalid;\n const isBusy = this.in('busy');\n\n return html`\n <div>\n ${this.renderTemplateOrSlot('create:before')}\n\n <vaadin-button\n data-testid=\"create\"\n class=\"w-full\"\n theme=\"primary success\"\n ?disabled=${isBusy \|\| isInvalid \|\| this.disabledSelector.matches('create', true)}\n @click=${() => this.submit()}\n >\n <foxy-i18n ns=${this.ns} key=\"create\" lang=${this.lang}></foxy-i18n>\n </vaadin-button>\n\n ${this.renderTemplateOrSlot('create:after')}\n </div>\n `;\n }\n\n private __renderDelete(): TemplateResult {\n return html`\n <div>\n <foxy-internal-confirm-dialog\n data-testid=\"confirm\"\n message=\"delete_prompt\"\n confirm=\"delete\"\n cancel=\"cancel\"\n header=\"delete\"\n theme=\"primary error\"\n lang=${this.lang}\n ns=${this.ns}\n id=\"confirm\"\n @hide=${(evt: DialogHideEvent) => !evt.detail.cancelled && this.delete()}\n >\n </foxy-internal-confirm-dialog>\n\n ${this.renderTemplateOrSlot('delete:before')}\n\n <vaadin-button\n data-testid=\"delete\"\n theme=\"primary error\"\n class=\"w-full\"\n ?disabled=${this.in('busy') \|\| this.disabledSelector.matches('delete', true)}\n @click=${(evt: CustomEvent) => {\n const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n confirm.show(evt.currentTarget as ButtonElement);\n }}\n >\n <foxy-i18n ns=${this.ns} key=\"delete\" lang=${this.lang}></foxy-i18n>\n </vaadin-button>\n\n ${this.renderTemplateOrSlot('delete:after')}\n </div>\n `;\n }\n}\n"]}

package/dist/elements/public/GiftCardCodeForm/types.d.ts CHANGED Viewed

@@ -1,29 +1,8 @@
-import { Renderer } from '../../../mixins/configurable';
 import { GiftCardCodeForm } from './GiftCardCodeForm';
-export declare type Data = {
-    _links: {
-        'curies': [{
-            href: string;
-        }];
-        'self': {
-            href: string;
-        };
-        'fx:store': {
-            href: string;
-        };
-        'fx:gift_card': {
-            href: string;
-        };
-        'fx:gift_card_code_logs': {
-            href: string;
-        };
-    };
-    code: string;
-    current_balance: number;
-    end_date: string | null;
-    date_created: string | null;
-    date_modified: string | null;
-};
+import { Rels } from '@foxy.io/sdk/backend';
+import { Renderer } from '../../../mixins/configurable';
+import { Resource } from '@foxy.io/sdk/core';
+export declare type Data = Resource<Rels.GiftCardCode>;
 export declare type Templates = {
     'code:before'?: Renderer<GiftCardCodeForm>;
     'code:after'?: Renderer<GiftCardCodeForm>;

package/dist/elements/public/GiftCardCodeForm/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCodeForm/types.ts"],"names":[],"mappings":"","sourcesContent":["import { ~~Renderer~~ } from '~~../../../mixins/configurable~~';\nimport { ~~GiftCardCodeForm~~ } from '~~./GiftCardCodeForm~~';\~~n\nexport~~ ~~type Data =~~ {~~\n _links:~~ ~~{\n 'curies':~~ [{ ~~href:~~ ~~string }];\n~~ '~~self~~'~~: { href: string }~~;\~~n 'fx:store':~~ { ~~href:~~ ~~string~~ }~~;\n 'fx:gift_card':~~ { ~~href: string };\n~~ '~~fx:gift_card_code_logs~~'~~: { href: string }~~;\n ~~};\n code:~~ ~~string;\n current_balance:~~ ~~number;\n end_date:~~ ~~string~~ ~~\| null;\~~n ~~date_created: string \| null;\n date_modified: string \| null;\n};\n~~\nexport type Templates = {\n 'code:before'?: Renderer<GiftCardCodeForm>;\n 'code:after'?: Renderer<GiftCardCodeForm>;\n 'current-balance:before'?: Renderer<GiftCardCodeForm>;\n 'current-balance:after'?: Renderer<GiftCardCodeForm>;\n 'end-date:before'?: Renderer<GiftCardCodeForm>;\n 'end-date:after'?: Renderer<GiftCardCodeForm>;\n 'timestamps:before'?: Renderer<GiftCardCodeForm>;\n 'timestamps:after'?: Renderer<GiftCardCodeForm>;\n 'delete:before'?: Renderer<GiftCardCodeForm>;\n 'delete:after'?: Renderer<GiftCardCodeForm>;\n 'create:before'?: Renderer<GiftCardCodeForm>;\n 'create:after'?: Renderer<GiftCardCodeForm>;\n};\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/GiftCardCodeForm/types.ts"],"names":[],"mappings":"","sourcesContent":["import { GiftCardCodeForm } from './GiftCardCodeForm';\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.GiftCardCode>;\n\nexport type Templates = {\n 'code:before'?: Renderer<GiftCardCodeForm>;\n 'code:after'?: Renderer<GiftCardCodeForm>;\n 'current-balance:before'?: Renderer<GiftCardCodeForm>;\n 'current-balance:after'?: Renderer<GiftCardCodeForm>;\n 'end-date:before'?: Renderer<GiftCardCodeForm>;\n 'end-date:after'?: Renderer<GiftCardCodeForm>;\n 'timestamps:before'?: Renderer<GiftCardCodeForm>;\n 'timestamps:after'?: Renderer<GiftCardCodeForm>;\n 'delete:before'?: Renderer<GiftCardCodeForm>;\n 'delete:after'?: Renderer<GiftCardCodeForm>;\n 'create:before'?: Renderer<GiftCardCodeForm>;\n 'create:after'?: Renderer<GiftCardCodeForm>;\n};\n"]}