@foxy.io/elements 1.53.3 → 1.54.0

package/dist/elements/public/PaymentsApiPaymentMethodForm/PaymentsApiPaymentMethodForm.js

@@ -8,6 +8,8 @@ import Fuse from 'fuse.js';
 import has from 'lodash-es/has';
 import get from 'lodash-es/get';
 import set from 'lodash-es/set';
+/** OAuth gateways that connect through fx:connect_gateway. Other OAuth gateways show a notice. */
+const connectableGateways = ['paypal_platform'];
 const NS = 'payments-api-payment-method-form';
 const Base = TranslatableMixin(InternalForm, NS);
 /**
@@ -28,6 +30,12 @@ export class PaymentsApiPaymentMethodForm extends Base {
         this.paymentPreset = null;
         /** A function that returns a URL of a payment method icon based on the given type. */
         this.getImageSrc = null;
+        /**
+         * Returns the URL the gateway sends the merchant back to after a connection.
+         * Receives the `payment-preset` URL. The API appends a `status` query parameter.
+         * Defaults to the current page URL.
+         */
+        this.getConnectRedirectUrl = null;
         /** URL of the linked `fx:store` resource. */
         this.store = null;
         this.__availablePaymentMethodsLoaderId = 'availablePaymentMethodsLoader';
@@ -75,6 +83,9 @@ export class PaymentsApiPaymentMethodForm extends Base {
             { label: 'option_enabled_override', value: 'enabled_override' },
         ];
         this.__search = '';
+        this.__connectState = 'idle';
+        /** Key of the connect choice whose connection URL is being fetched. */
+        this.__connectKey = '';
     }
     static get defaultImageSrc() {
         return "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 44 44'%3E%3Cpath fill='%23fff' d='m29.3 14 14-14H32.1l-14 14h11.2Zm2.7 9.9 12-12V.7L30.62 14.1A2 2 0 0 1 32 16v7.9ZM13.31 44h11.18L44 24.5V13.3l-12 12V28a2 2 0 0 1-2 2h-2.69l-14 14Zm-1.41 0H.7l14-14h11.2l-14 14Zm14 0h11.2l6.9-6.9V25.9L25.9 44Zm12.6 0H44v-5.5L38.5 44Z'/%3E%3Cpath fill='%23fff' d='M30 28H14v-6h16v6Zm0-10v-2H14v2h16ZM0 43.3l13.4-13.4A2 2 0 0 1 12 28v-7.9L0 32.12V43.3Z'/%3E%3Cpath fill='%23fff' d='M16.7 14H14c-1.11 0-1.99.89-1.99 2v2.7L0 30.7V19.52L19.52 0H30.7l-14 14Zm1.4-14H6.92L0 6.92V18.1L18.1 0ZM5.5 0H0v5.5L5.5 0Z'/%3E%3C/svg%3E";
@@ -84,8 +95,11 @@ export class PaymentsApiPaymentMethodForm extends Base {
             ...super.properties,
             paymentPreset: { attribute: 'payment-preset' },
             getImageSrc: { attribute: false },
+            getConnectRedirectUrl: { attribute: false },
             store: {},
             __search: { attribute: false },
+            __connectState: { attribute: false },
+            __connectKey: { attribute: false },
         };
     }
     static get v8n() {
@@ -219,11 +233,14 @@ export class PaymentsApiPaymentMethodForm extends Base {
             const isSpecialCharacter = !/\w/.test(firstChar);
             const name = isSpecialCharacter ? '#' : firstChar;
             const group = groups.find(group => group.name === name);
+            const items = connectableGateways.includes(type)
+                ? this.__getConnectChoices(type).map(choice => ({ type, helper, choice }))
+                : [{ type, helper }];
             if (group) {
-                group.items.push({ type, helper });
+                group.items.push(...items);
             }
             else {
-                groups.push({ name, items: [{ type, helper }] });
+                groups.push({ name, items });
             }
             return groups;
         }, []);
@@ -283,8 +300,145 @@ export class PaymentsApiPaymentMethodForm extends Base {
       </div>
     `;
     }
+    __redirect(url) {
+        window.location.assign(url);
+    }
+    __getConnectChoices(type) {
+        if (type === 'paypal_platform') {
+            return [
+                { key: 'paypal_platform.ppcp', options: { paypal_product_type: 'ppcp' } },
+                {
+                    key: 'paypal_platform.express_checkout',
+                    options: { paypal_product_type: 'express_checkout' },
+                },
+            ];
+        }
+        return [{ key: 'default' }];
+    }
+    __getReconnectChoice(thirdPartyKey) {
+        if (this.form.type === 'paypal_platform') {
+            // An empty third-party key means the account is connected for PayPal only, without cards.
+            const key = thirdPartyKey ? 'reconnect' : 'reconnect_with_cards';
+            return { key: `paypal_platform.${key}`, options: { paypal_product_type: 'ppcp' } };
+        }
+        return { key: 'reconnect' };
+    }
+    async __connect(choice, type) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        const presetLink = (_b = (_a = this.__paymentPresetLoader) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b._links['fx:connect_gateway'];
+        const href = (_e = (_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c._links['fx:connect_gateway']) === null || _d === void 0 ? void 0 : _d.href) !== null && _e !== void 0 ? _e : presetLink === null || presetLink === void 0 ? void 0 : presetLink.href;
+        if (!href || !this.paymentPreset || this.__connectState === 'busy')
+            return;
+        this.__connectState = 'busy';
+        this.__connectKey = choice.key;
+        this.status = null;
+        try {
+            const body = {
+                type,
+                final_redirect: (_g = (_f = this.getConnectRedirectUrl) === null || _f === void 0 ? void 0 : _f.call(this, this.paymentPreset)) !== null && _g !== void 0 ? _g : window.location.href,
+            };
+            if (choice.options)
+                body.options = choice.options;
+            const response = await this._fetch(href, {
+                method: 'POST',
+                body: JSON.stringify(body),
+            });
+            // The API answers 201 with a null URL when the gateway itself fails to create one.
+            if (!response.connection_url)
+                throw new Error('No connection_url in the response.');
+            // State stays busy on purpose: the spinner keeps going until the browser leaves the page.
+            this.__redirect(response.connection_url);
+        }
+        catch (err) {
+            let message = '';
+            if (err instanceof Response) {
+                try {
+                    const json = await err.json();
+                    message = (_l = (_k = (_j = (_h = json === null || json === void 0 ? void 0 : json._embedded) === null || _h === void 0 ? void 0 : _h['fx:errors']) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.message) !== null && _l !== void 0 ? _l : '';
+                }
+                catch (_o) {
+                    // not a vnd.error response
+                }
+            }
+            // The API's country error names raw option values ('ppcp', 'express_checkout'), so we
+            // replace it with our own text. It's the only 403 our requests can get that mentions 'ppcp'.
+            const isPpcpUnsupported = err instanceof Response &&
+                err.status === 403 &&
+                ((_m = choice.options) === null || _m === void 0 ? void 0 : _m.paypal_product_type) === 'ppcp' &&
+                message.includes("'ppcp'");
+            if (isPpcpUnsupported) {
+                this.status = { key: 'connect_error_ppcp_unsupported', type: 'error' };
+            }
+            else if (message) {
+                this.status = { key: 'connect_error', options: { message }, type: 'error' };
+            }
+            else {
+                this.status = { key: 'connect_error_unknown', type: 'error' };
+            }
+            this.__connectState = 'idle';
+        }
+    }
+    __renderConnection() {
+        var _a, _b, _c, _d;
+        const preset = (_a = this.__paymentPresetLoader) === null || _a === void 0 ? void 0 : _a.data;
+        if (!preset)
+            return html ``;
+        const prefix = preset.is_live ? '' : 'test_';
+        const email = (_b = this.data) === null || _b === void 0 ? void 0 : _b[`${prefix}account_id`];
+        const thirdPartyKey = (_d = (_c = this.data) === null || _c === void 0 ? void 0 : _c[`${prefix}third_party_key`]) !== null && _d !== void 0 ? _d : '';
+        const type = this.form.type;
+        const choices = email
+            ? [this.__getReconnectChoice(thirdPartyKey)]
+            : this.__getConnectChoices(type);
+        const isBusy = this.__connectState === 'busy';
+        const isReadonly = this.readonlySelector.matches('connection', true);
+        const isDisabled = isBusy || this.disabledSelector.matches('connection', true);
+        return html `
+      <foxy-internal-summary-control infer="connection">
+        ${email
+            ? html `
+              <p class="font-medium">
+                <foxy-i18n infer="" key="status_connected" .options=${{ email }}></foxy-i18n>
+              </p>
+            `
+            : ''}
+        ${(isReadonly ? [] : choices).map(choice => html `
+            <div class="leading-xs">
+              <p class="font-medium">
+                <foxy-i18n infer="" key="${choice.key}.label"></foxy-i18n>
+              </p>
+              <p class="text-s text-secondary">
+                <foxy-i18n infer="" key="${choice.key}.description"></foxy-i18n>
+              </p>
+            </div>
+            <div>
+              <vaadin-button
+                data-testid="connect-${choice.key}"
+                theme="tertiary-inline"
+                ?disabled=${isDisabled}
+                @click=${() => this.__connect(choice, type)}
+              >
+                ${isBusy && this.__connectKey === choice.key
+            ? html `<foxy-spinner layout="no-label" infer="connect-spinner"></foxy-spinner>`
+            : html `<foxy-i18n infer="" key="${choice.key}.button"></foxy-i18n>`}
+              </vaadin-button>
+            </div>
+          `)}
+      </foxy-internal-summary-control>
+    `;
+    }
     __renderPaymentMethodConfig() {
         var _a, _b;
+        if (this.form.type && connectableGateways.includes(this.form.type)) {
+            return html `
+        <foxy-internal-summary-control infer="general">
+          <foxy-internal-text-control layout="summary-item" infer="description">
+          </foxy-internal-text-control>
+        </foxy-internal-summary-control>
+
+        ${this.__renderConnection()} ${super.renderBody()}
+      `;
+        }
         const oauthGateways = [
             'stripe_connect',
             'stripe_v2',
@@ -461,11 +615,14 @@ export class PaymentsApiPaymentMethodForm extends Base {
       ${super.renderBody()}
     `;
     }
-    __renderPaymentMethodButton({ type, helper }, index, total) {
+    __renderPaymentMethodButton({ type, helper, choice }, index, total) {
         var _a, _b;
         const defaultSrc = PaymentsApiPaymentMethodForm.defaultImageSrc;
         const src = (_b = (_a = this.getImageSrc) === null || _a === void 0 ? void 0 : _a.call(this, type)) !== null && _b !== void 0 ? _b : defaultSrc;
         const onError = (evt) => (evt.currentTarget.src = defaultSrc);
+        const isBusy = this.__connectState === 'busy';
+        const isConnecting = isBusy && !!choice && this.__connectKey === choice.key;
+        const hasChoiceLabel = !!choice && choice.key !== 'default';
         return html `
       <button
         class=${classMap({
@@ -476,33 +633,57 @@ export class PaymentsApiPaymentMethodForm extends Base {
             'rounded-t': index === 0,
             'rounded-b': index === total - 1,
         })}
-        ?disabled=${!!helper.conflict}
+        data-testid=${ifDefined(choice ? `connect-${choice.key}` : undefined)}
+        ?disabled=${!!helper.conflict || isBusy}
         style="padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
-        @click=${() => this.edit({ type, helper })}
+        @click=${() => (choice ? this.__connect(choice, type) : this.edit({ type, helper }))}
       >
         <figure
           class="relative flex items-center"
           style="gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)"
         >
-          <img
-            class=${classMap({
-            'h-m w-m object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs': true,
-            'filter grayscale': !!helper.conflict,
-        })}
-            src=${src}
-            alt=""
-            @error=${onError}
-          />
+          ${isConnecting
+            ? html `
+                <foxy-spinner
+                  data-testid="connect-spinner"
+                  class="h-m w-m flex items-center justify-center flex-shrink-0"
+                  layout="no-label"
+                  infer="connect-spinner"
+                >
+                </foxy-spinner>
+              `
+            : html `
+                <img
+                  class=${classMap({
+                'h-m w-m object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs': true,
+                'filter grayscale': !!helper.conflict,
+            })}
+                  src=${src}
+                  alt=""
+                  @error=${onError}
+                />
+              `}
           <figcaption
             class=${classMap({
             'min-w-0 flex-1 grid leading-xs': true,
             'text-disabled': !!helper.conflict,
         })}
           >
-            <span class="font-medium">${helper.name}&ZeroWidthSpace;</span>
+            <span class="font-medium">
+              ${hasChoiceLabel
+            ? this.t(`connection.${choice.key}.label`)
+            : helper.name}&ZeroWidthSpace;
+            </span>
             ${helper.conflict
             ? html `<span class="text-xs"> ${this.t('conflict_message', helper.conflict)}</span>`
-            : ''}
+            : choice
+                ? html `
+                  <span class="text-xs text-secondary">
+                    ${hasChoiceLabel ? this.t(`connection.${choice.key}.description`) : ''}
+                    ${this.t('connection.redirect_notice')}
+                  </span>
+                `
+                : ''}
           </figcaption>
         </figure>
       </button>

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

@@ -1 +1 @@
-{"version":3,"file":"PaymentsApiPaymentMethodForm.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentMethodForm/PaymentsApiPaymentMethodForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { AvailablePaymentMethods, PaymentPreset } from '../PaymentsApi/api/types';\nimport type { Block, Data } from './types';\nimport type { PropertyDeclarations } from 'lit-element';\nimport type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nimport { BooleanSelector, getResourceId } from '@foxy.io/sdk/core';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html, svg } from 'lit-html';\nimport { classMap } from '../../../utils/class-map';\n\nimport Fuse from 'fuse.js';\nimport has from 'lodash-es/has';\nimport get from 'lodash-es/get';\nimport set from 'lodash-es/set';\n\ntype PaymentMethod = {\n  helper: AvailablePaymentMethods['values'][string];\n  type: string;\n};\n\nconst NS = 'payments-api-payment-method-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for the `fx:payment_method` resource of Payments API.\n *\n * _Payments API is a client-side virtual API layer built on top of hAPI\n * in an attempt to streamline access to stores' payment method settings\n * that is currently a bit quirky due to the legacy functionality. To use\n * this element with hAPI, wrap it into a foxy-payments-api node._\n *\n * @element foxy-payments-api-payment-method-form\n * @since 1.21.0\n */\nexport class PaymentsApiPaymentMethodForm extends Base<Data> {\n  static get defaultImageSrc(): string {\n    return \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 44 44'%3E%3Cpath fill='%23fff' d='m29.3 14 14-14H32.1l-14 14h11.2Zm2.7 9.9 12-12V.7L30.62 14.1A2 2 0 0 1 32 16v7.9ZM13.31 44h11.18L44 24.5V13.3l-12 12V28a2 2 0 0 1-2 2h-2.69l-14 14Zm-1.41 0H.7l14-14h11.2l-14 14Zm14 0h11.2l6.9-6.9V25.9L25.9 44Zm12.6 0H44v-5.5L38.5 44Z'/%3E%3Cpath fill='%23fff' d='M30 28H14v-6h16v6Zm0-10v-2H14v2h16ZM0 43.3l13.4-13.4A2 2 0 0 1 12 28v-7.9L0 32.12V43.3Z'/%3E%3Cpath fill='%23fff' d='M16.7 14H14c-1.11 0-1.99.89-1.99 2v2.7L0 30.7V19.52L19.52 0H30.7l-14 14Zm1.4-14H6.92L0 6.92V18.1L18.1 0ZM5.5 0H0v5.5L5.5 0Z'/%3E%3C/svg%3E\";\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      paymentPreset: { attribute: 'payment-preset' },\n      getImageSrc: { attribute: false },\n      store: {},\n      __search: { attribute: false },\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ description: v }) => !v || v.length <= 100 || 'description:v8n_too_long',\n      ({ type: v }) => !!v || 'type:v8n_required',\n\n      form => {\n        const blocks = form.helper?.additional_fields?.blocks ?? [];\n        let additionalFields: Record<string, unknown>;\n\n        try {\n          additionalFields = JSON.parse(form.additional_fields ?? '{}');\n        } catch {\n          additionalFields = {};\n        }\n\n        for (const block of blocks) {\n          for (const field of block.fields) {\n            if ('optional' in (field as Record<string, unknown>)) {\n              if (!(field as Record<string, unknown>).optional) {\n                if (!has(additionalFields, field.id)) {\n                  if (field.type !== 'checkbox') {\n                    return 'additional-fields:v8n_invalid';\n                  }\n                }\n              }\n            }\n          }\n        }\n\n        return true;\n      },\n    ];\n  }\n\n  /** URL of the linked `fx:payment_preset` resource from the virtual Payments API. */\n  paymentPreset: string | null = null;\n\n  /** A function that returns a URL of a payment method icon based on the given type. */\n  getImageSrc: ((type: string) => string) | null = null;\n\n  /** URL of the linked `fx:store` resource. */\n  store: string | null = null;\n\n  private readonly __availablePaymentMethodsLoaderId = 'availablePaymentMethodsLoader';\n\n  private readonly __paymentPresetLoaderId = 'paymentPresetLoader';\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  private readonly __threeDSecureResponseGetValue = () => {\n    return this.form.config_3d_secure?.endsWith('require_valid_response');\n  };\n\n  private readonly __threeDSecureResponseSetValue = (newValue: boolean) => {\n    const postfix = newValue ? '_require_valid_response' : '';\n    const config = this.form.config_3d_secure;\n    const type = config?.startsWith('all_cards') ? 'all_cards' : 'maestro_only';\n\n    this.edit({ config_3d_secure: `${type}${postfix}` as Data['config_3d_secure'] });\n  };\n\n  private readonly __threeDSecureToggleGetValue = () => {\n    const config = this.form.config_3d_secure;\n\n    if (config?.startsWith('all_cards')) return 'all_cards';\n    if (config?.startsWith('maestro_only')) return 'maestro_only';\n\n    return 'off';\n  };\n\n  private readonly __threeDSecureToggleSetValue = (\n    newValue: 'off' | 'all_cards' | 'maestro_only'\n  ) => {\n    let newFormValue = '';\n\n    if (newValue === 'all_cards' || newValue === 'maestro_only') {\n      if (this.form.config_3d_secure?.endsWith('require_valid_response')) {\n        newFormValue = `${newValue}_require_valid_response`;\n      } else {\n        newFormValue = newValue;\n      }\n    }\n\n    this.edit({ config_3d_secure: newFormValue as Data['config_3d_secure'] });\n  };\n\n  private readonly __threeDSecureToggleOptions = [\n    { value: 'off', label: 'option_off' },\n    { value: 'all_cards', label: 'option_all_cards' },\n    { value: 'maestro_only', label: 'option_maestro_only' },\n  ];\n\n  private readonly __cardVerificationOptions = [\n    { label: 'option_disabled', value: 'disabled' },\n    { label: 'option_enabled_automatically', value: 'enabled_automatically' },\n    { label: 'option_enabled_override', value: 'enabled_override' },\n  ];\n\n  private __search = '';\n\n  get hiddenSelector(): BooleanSelector {\n    return new BooleanSelector(`header:copy-json ${super.hiddenSelector}`.trimEnd());\n  }\n\n  renderHeader(...params: Parameters<InternalForm<Data>['renderHeader']>): TemplateResult {\n    return html`\n      <div>\n        ${super.renderHeader(...params)}\n        ${this.data?.type || !this.form.type\n          ? html``\n          : html`\n              <vaadin-button\n                data-testid=\"select-another-button\"\n                theme=\"tertiary-inline\"\n                @click=${() => this.undo()}\n              >\n                <foxy-i18n infer=\"\" key=\"select_another_button_label\"></foxy-i18n>\n              </vaadin-button>\n            `}\n      </div>\n    `;\n  }\n\n  get headerTitleOptions(): Record<string, unknown> {\n    return {\n      context: this.form.type ? 'selected' : 'new',\n      name: this.form.helper?.name,\n    };\n  }\n\n  get headerSubtitleOptions(): Record<string, unknown> {\n    if (this.href) {\n      const vId = getResourceId(this.href) as string;\n      const id = this.headerCopyIdValue;\n      if (vId.startsWith('R')) return { context: 'regular', id };\n      return { context: 'hosted', id };\n    }\n\n    return {};\n  }\n\n  get headerCopyIdValue(): string | number {\n    if (this.href) {\n      const id = getResourceId(this.href) as string;\n      return id.startsWith('R') ? id.slice(1) : id.slice(1).split('C')[0];\n    } else {\n      return '';\n    }\n  }\n\n  renderBody(): TemplateResult {\n    const paymentPreset = this.__paymentPresetLoader?.data;\n\n    const loaders = html`\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(paymentPreset?._links['fx:available_payment_methods'].href)}\n        id=${this.__availablePaymentMethodsLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.store)}\n        id=${this.__storeLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.paymentPreset)}\n        id=${this.__paymentPresetLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n    `;\n\n    return html`${this.renderHeader()}${this.form.type\n      ? this.__renderPaymentMethodConfig()\n      : this.__renderPaymentMethodSelector()}${loaders}`;\n  }\n\n  private get __groupedAvailablePaymentMethods() {\n    const allMethods = Object.entries(this.__availablePaymentMethods ?? {});\n    const filteredMethods = this.__search\n      ? new Fuse(allMethods, { keys: ['1.name'], threshold: 0.25 })\n          .search(this.__search)\n          .map(v => v.item)\n      : allMethods;\n\n    return filteredMethods\n      .sort((a, b) => a[1].name.localeCompare(b[1].name, 'en'))\n      .reduce((groups, [type, helper]) => {\n        if (helper.is_deprecated) return groups;\n\n        const firstChar = helper.name.charAt(0).toUpperCase();\n        const isSpecialCharacter = !/\\w/.test(firstChar);\n        const name = isSpecialCharacter ? '#' : firstChar;\n        const group = groups.find(group => group.name === name);\n\n        if (group) {\n          group.items.push({ type, helper });\n        } else {\n          groups.push({ name, items: [{ type, helper }] });\n        }\n\n        return groups;\n      }, [] as { name: string; items: PaymentMethod[] }[]);\n  }\n\n  private get __availablePaymentMethodsLoader() {\n    type Loader = NucleonElement<AvailablePaymentMethods>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__availablePaymentMethodsLoaderId}`);\n  }\n\n  private get __availablePaymentMethods() {\n    return this.__availablePaymentMethodsLoader?.data?.values;\n  }\n\n  private get __paymentPresetLoader() {\n    type Loader = NucleonElement<PaymentPreset>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__paymentPresetLoaderId}`);\n  }\n\n  private get __storeLoader() {\n    type Loader = NucleonElement<Resource<Rels.Store>>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__storeLoaderId}`);\n  }\n\n  private get __liveBlocks() {\n    return this.form.helper?.additional_fields?.blocks.filter(block => block.is_live) ?? [];\n  }\n\n  private get __testBlocks() {\n    return this.form.helper?.additional_fields?.blocks.filter(block => !block.is_live) ?? [];\n  }\n\n  private __renderPaymentMethodSelector() {\n    const loader = this.__availablePaymentMethodsLoader;\n\n    if (!loader?.data) {\n      return html`\n        <foxy-spinner infer=\"list-spinner\" state=${loader?.in('fail') ? 'error' : 'busy'}>\n        </foxy-spinner>\n      `;\n    }\n\n    return html`\n      <div>\n        <input\n          placeholder=${this.t('search_placeholder')}\n          class=\"w-full leading-m font-medium bg-contrast-5 rounded text-body transition-colors hover-bg-contrast-10 focus-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n          style=\"padding: var(--lumo-space-xs) calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n          type=\"search\"\n          .value=${this.__search}\n          @input=${(evt: Event) => {\n            this.__search = (evt.currentTarget as HTMLInputElement).value;\n          }}\n        />\n\n        <section data-testid=\"select-method-list\">\n          ${this.__groupedAvailablePaymentMethods.map(({ name, items }) => {\n            return html`\n              <p class=\"font-medium text-tertiary py-m\">${name}</p>\n              <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n                ${items.map((item, index) =>\n                  this.__renderPaymentMethodButton(item, index, items.length)\n                )}\n              </foxy-internal-summary-control>\n            `;\n          })}\n        </section>\n      </div>\n    `;\n  }\n\n  private __renderPaymentMethodConfig() {\n    const oauthGateways = [\n      'stripe_connect',\n      'stripe_v2',\n      'square_up',\n      'quickbook_payments',\n      'amazon_mws',\n      'paypal_platform',\n    ];\n\n    if (this.form.type && oauthGateways.includes(this.form.type)) {\n      return html`\n        <div\n          class=\"flex items-start rounded border border-primary\"\n          style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px); padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        >\n          ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0 text-primary\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z\" clip-rule=\"evenodd\"></path></svg>`}\n          <p>\n            <foxy-i18n infer=\"\" key=\"no_oauth_support_message\"></foxy-i18n>\n            <br />\n            <a\n              target=\"_blank\"\n              class=\"mt-xs inline-block rounded font-medium text-primary transition-colors cursor-pointer hover-opacity-80 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n              href=\"https://admin.foxycart.com\"\n            >\n              admin.foxycart.com\n            </a>\n          </p>\n        </div>\n      `;\n    }\n\n    return html`\n      <foxy-internal-summary-control infer=\"general\">\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"description\">\n        </foxy-internal-text-control>\n\n        ${this.form.helper?.supports_auth_only\n          ? html`\n              <foxy-internal-switch-control infer=\"use-auth-only\" helper-text-as-tooltip>\n              </foxy-internal-switch-control>\n            `\n          : ''}\n        ${this.form.helper?.supports_3d_secure\n          ? html`\n              <foxy-internal-select-control\n                layout=\"summary-item\"\n                infer=\"three-d-secure-toggle\"\n                .getValue=${this.__threeDSecureToggleGetValue}\n                .setValue=${this.__threeDSecureToggleSetValue}\n                .options=${this.__threeDSecureToggleOptions}\n              >\n              </foxy-internal-select-control>\n\n              ${this.form.config_3d_secure\n                ? html`\n                    <foxy-internal-switch-control\n                      layout=\"summary-item\"\n                      infer=\"three-d-secure-response\"\n                      .getValue=${this.__threeDSecureResponseGetValue}\n                      .setValue=${this.__threeDSecureResponseSetValue}\n                    >\n                    </foxy-internal-switch-control>\n                  `\n                : ''}\n            `\n          : ''}\n      </foxy-internal-summary-control>\n\n      ${['live', 'test'].map((type, index) => {\n        const propertyPrefix = index === 0 ? '' : (`${type}_` as '' | 'test_');\n        const inferPrefix = index === 0 ? '' : `${type}-`;\n        const blocks = index === 0 ? this.__liveBlocks : this.__testBlocks;\n        const scope = `${type}-group`;\n\n        if (type === 'live' && !this.__storeLoader?.data) return html``;\n        if (type === 'live' && !this.__storeLoader?.data?.is_active) {\n          return html`\n            <foxy-internal-summary-control infer=\"${type}-group\">\n              <div\n                class=\"flex items-start\"\n                style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n              >\n                ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0 text-primary\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z\" clip-rule=\"evenodd\"></path></svg>`}\n                <p><foxy-i18n infer=\"\" key=\"inactive_message\"></foxy-i18n></p>\n              </div>\n            </foxy-internal-summary-control>\n          `;\n        }\n\n        const showInactiveSetText =\n          this.__storeLoader?.data?.is_active === true &&\n          ((type === 'test' && this.__paymentPresetLoader?.data?.is_live === true) ||\n            (type === 'live' && this.__paymentPresetLoader?.data?.is_live === false));\n\n        return html`\n          <foxy-internal-summary-control\n            helper-text=${ifDefined(\n              showInactiveSetText ? this.t(`${scope}.helper_text_inactive`) : void 0\n            )}\n            layout=\"section\"\n            label=${ifDefined(showInactiveSetText ? this.t(`${scope}.label_inactive`) : void 0)}\n            infer=${scope}\n          >\n            <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n              ${this.form.helper?.id_description\n                ? html`\n                    <foxy-internal-text-control\n                      placeholder=${this.t('default_additional_field_placeholder')}\n                      helper-text=\"\"\n                      layout=\"summary-item\"\n                      label=${this.form.helper.id_description}\n                      infer=\"${inferPrefix}account-id\"\n                    >\n                    </foxy-internal-text-control>\n                  `\n                : ''}\n              ${this.form.helper?.third_party_key_description\n                ? html`\n                    <foxy-internal-password-control\n                      placeholder=${this.t('default_additional_field_placeholder')}\n                      helper-text=\"\"\n                      layout=\"summary-item\"\n                      label=${this.form.helper.third_party_key_description}\n                      infer=\"${inferPrefix}third-party-key\"\n                    >\n                    </foxy-internal-password-control>\n                  `\n                : ''}\n              ${this.form.helper?.key_description\n                ? html`\n                    <foxy-internal-password-control\n                      placeholder=${this.t('default_additional_field_placeholder')}\n                      layout=\"summary-item\"\n                      helper-text=\"\"\n                      label=${this.form.helper.key_description}\n                      infer=\"${inferPrefix}account-key\"\n                    >\n                    </foxy-internal-password-control>\n                  `\n                : ''}\n              ${blocks.map(block => this.__renderBlock(block))}\n              ${this.form.helper?.supports_card_verification\n                ? html`\n                    <foxy-internal-select-control\n                      helper-text=${this.t(\n                        `${scope}.${inferPrefix}card-verification.helper_text_${\n                          this.form[`${propertyPrefix}card_verification` as const] || 'disabled'\n                        }`\n                      )}\n                      layout=\"summary-item\"\n                      infer=\"${inferPrefix}card-verification\"\n                      .options=${this.__cardVerificationOptions}\n                      .getValue=${() => {\n                        return (\n                          this.form[`${propertyPrefix}card_verification` as const] || 'disabled'\n                        );\n                      }}\n                    >\n                    </foxy-internal-select-control>\n                  `\n                : ''}\n            </foxy-internal-summary-control>\n\n            ${this.form.helper?.supports_card_verification &&\n            this.form[`${propertyPrefix}card_verification` as const]?.startsWith('enabled_')\n              ? html`\n                  <foxy-internal-summary-control\n                    layout=\"details\"\n                    class=\"mt-s\"\n                    infer=\"${inferPrefix}card-verification-config\"\n                  >\n                    ${['visa', 'mastercard', 'american-express', 'discover', 'default'].map(\n                      type => {\n                        return html`\n                          <foxy-internal-number-control\n                            json-template=${ifDefined(this.form.helper?.card_verification_config)}\n                            json-path=\"verification_amounts.${type.replace(/-/g, '_')}\"\n                            property=\"${propertyPrefix}card_verification_config\"\n                            layout=\"summary-item\"\n                            infer=\"${inferPrefix}card-verification-config-verification-amounts-${type}\"\n                            step=\"0.01\"\n                            min=\"0\"\n                          >\n                          </foxy-internal-number-control>\n                        `;\n                      }\n                    )}\n                  </foxy-internal-summary-control>\n                `\n              : ''}\n          </foxy-internal-summary-control>\n        `;\n      })}\n      ${super.renderBody()}\n    `;\n  }\n\n  private __renderPaymentMethodButton(\n    { type, helper }: PaymentMethod,\n    index: number,\n    total: number\n  ) {\n    const defaultSrc = PaymentsApiPaymentMethodForm.defaultImageSrc;\n    const src = this.getImageSrc?.(type) ?? defaultSrc;\n    const onError = (evt: Event) => ((evt.currentTarget as HTMLImageElement).src = defaultSrc);\n\n    return html`\n      <button\n        class=${classMap({\n          'relative w-full block text-left bg-contrast-5 overflow-hidden': true,\n          'focus-outline-none focus-ring-inset focus-ring-2 focus-ring-primary-50': true,\n          'transition-colors hover-bg-contrast-10': !helper.conflict,\n          'cursor-default': !!helper.conflict,\n          'rounded-t': index === 0,\n          'rounded-b': index === total - 1,\n        })}\n        ?disabled=${!!helper.conflict}\n        style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        @click=${() => this.edit({ type, helper })}\n      >\n        <figure\n          class=\"relative flex items-center\"\n          style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        >\n          <img\n            class=${classMap({\n              'h-m w-m object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs': true,\n              'filter grayscale': !!helper.conflict,\n            })}\n            src=${src}\n            alt=\"\"\n            @error=${onError}\n          />\n          <figcaption\n            class=${classMap({\n              'min-w-0 flex-1 grid leading-xs': true,\n              'text-disabled': !!helper.conflict,\n            })}\n          >\n            <span class=\"font-medium\">${helper.name}&ZeroWidthSpace;</span>\n            ${helper.conflict\n              ? html`<span class=\"text-xs\"> ${this.t('conflict_message', helper.conflict)}</span>`\n              : ''}\n          </figcaption>\n        </figure>\n      </button>\n    `;\n  }\n\n  private __renderBlock(block: Block) {\n    return html`${block.fields.map(field => {\n      if (field.type === 'hidden') return;\n      const scope = ['additional-fields', field.id].join('-').replace(/_/g, '-');\n\n      const getValue = () => {\n        try {\n          const config = JSON.parse(this.form.additional_fields ?? '{}');\n          return get(config, field.id) ?? config.default_value;\n        } catch {\n          return field.default_value;\n        }\n      };\n\n      const setValue = (newValue: unknown) => {\n        let config: Record<string, unknown> = {};\n\n        try {\n          config = JSON.parse(this.form.additional_fields ?? '');\n        } catch {\n          // ignore\n        }\n\n        this.edit({ additional_fields: JSON.stringify(set(config, field.id, newValue)) });\n      };\n\n      type Option = { name: string; value: string };\n      const options = (field as { options?: Option[] }).options;\n\n      return html`\n        ${field.type === 'checkbox'\n          ? html`\n              <foxy-internal-switch-control\n                helper-text=${field.description ?? ''}\n                label=${field.name}\n                infer=${scope}\n                helper-text-as-tooltip\n                .getValue=${getValue}\n                .setValue=${setValue}\n              >\n              </foxy-internal-switch-control>\n            `\n          : field.type === 'select'\n          ? html`\n              <foxy-internal-select-control\n                placeholder=${this.t('default_additional_field_select_placeholder')}\n                helper-text=${field.description ?? ''}\n                layout=\"summary-item\"\n                label=${field.name}\n                infer=${scope}\n                .options=${options!.map(({ name, value }) => ({ label: name, value }))}\n                .getValue=${getValue}\n                .setValue=${setValue}\n              >\n              </foxy-internal-select-control>\n            `\n          : html`\n              <foxy-internal-text-control\n                helper-text=${field.description ?? ''}\n                placeholder=${field.default_value || this.t('default_additional_field_placeholder')}\n                layout=\"summary-item\"\n                label=${field.name}\n                infer=${scope}\n                .getValue=${getValue}\n                .setValue=${setValue}\n              >\n              </foxy-internal-text-control>\n            `}\n      `;\n    })}`;\n  }\n}\n"]}
+{"version":3,"file":"PaymentsApiPaymentMethodForm.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentMethodForm/PaymentsApiPaymentMethodForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { AvailablePaymentMethods, PaymentPreset } from '../PaymentsApi/api/types';\nimport type { Block, Data } from './types';\nimport type { PropertyDeclarations } from 'lit-element';\nimport type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nimport { BooleanSelector, getResourceId } from '@foxy.io/sdk/core';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html, svg } from 'lit-html';\nimport { classMap } from '../../../utils/class-map';\n\nimport Fuse from 'fuse.js';\nimport has from 'lodash-es/has';\nimport get from 'lodash-es/get';\nimport set from 'lodash-es/set';\n\ntype ConnectChoice = {\n  key: string;\n  options?: Rels.ConnectGateway['props']['options'];\n};\n\ntype PaymentMethod = {\n  helper: AvailablePaymentMethods['values'][string];\n  choice?: ConnectChoice;\n  type: string;\n};\n\n/** OAuth gateways that connect through fx:connect_gateway. Other OAuth gateways show a notice. */\nconst connectableGateways = ['paypal_platform'];\n\nconst NS = 'payments-api-payment-method-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for the `fx:payment_method` resource of Payments API.\n *\n * _Payments API is a client-side virtual API layer built on top of hAPI\n * in an attempt to streamline access to stores' payment method settings\n * that is currently a bit quirky due to the legacy functionality. To use\n * this element with hAPI, wrap it into a foxy-payments-api node._\n *\n * @element foxy-payments-api-payment-method-form\n * @since 1.21.0\n */\nexport class PaymentsApiPaymentMethodForm extends Base<Data> {\n  static get defaultImageSrc(): string {\n    return \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 44 44'%3E%3Cpath fill='%23fff' d='m29.3 14 14-14H32.1l-14 14h11.2Zm2.7 9.9 12-12V.7L30.62 14.1A2 2 0 0 1 32 16v7.9ZM13.31 44h11.18L44 24.5V13.3l-12 12V28a2 2 0 0 1-2 2h-2.69l-14 14Zm-1.41 0H.7l14-14h11.2l-14 14Zm14 0h11.2l6.9-6.9V25.9L25.9 44Zm12.6 0H44v-5.5L38.5 44Z'/%3E%3Cpath fill='%23fff' d='M30 28H14v-6h16v6Zm0-10v-2H14v2h16ZM0 43.3l13.4-13.4A2 2 0 0 1 12 28v-7.9L0 32.12V43.3Z'/%3E%3Cpath fill='%23fff' d='M16.7 14H14c-1.11 0-1.99.89-1.99 2v2.7L0 30.7V19.52L19.52 0H30.7l-14 14Zm1.4-14H6.92L0 6.92V18.1L18.1 0ZM5.5 0H0v5.5L5.5 0Z'/%3E%3C/svg%3E\";\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      paymentPreset: { attribute: 'payment-preset' },\n      getImageSrc: { attribute: false },\n      getConnectRedirectUrl: { attribute: false },\n      store: {},\n      __search: { attribute: false },\n      __connectState: { attribute: false },\n      __connectKey: { attribute: false },\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ description: v }) => !v || v.length <= 100 || 'description:v8n_too_long',\n      ({ type: v }) => !!v || 'type:v8n_required',\n\n      form => {\n        const blocks = form.helper?.additional_fields?.blocks ?? [];\n        let additionalFields: Record<string, unknown>;\n\n        try {\n          additionalFields = JSON.parse(form.additional_fields ?? '{}');\n        } catch {\n          additionalFields = {};\n        }\n\n        for (const block of blocks) {\n          for (const field of block.fields) {\n            if ('optional' in (field as Record<string, unknown>)) {\n              if (!(field as Record<string, unknown>).optional) {\n                if (!has(additionalFields, field.id)) {\n                  if (field.type !== 'checkbox') {\n                    return 'additional-fields:v8n_invalid';\n                  }\n                }\n              }\n            }\n          }\n        }\n\n        return true;\n      },\n    ];\n  }\n\n  /** URL of the linked `fx:payment_preset` resource from the virtual Payments API. */\n  paymentPreset: string | null = null;\n\n  /** A function that returns a URL of a payment method icon based on the given type. */\n  getImageSrc: ((type: string) => string) | null = null;\n\n  /**\n   * Returns the URL the gateway sends the merchant back to after a connection.\n   * Receives the `payment-preset` URL. The API appends a `status` query parameter.\n   * Defaults to the current page URL.\n   */\n  getConnectRedirectUrl: ((paymentPreset: string) => string) | null = null;\n\n  /** URL of the linked `fx:store` resource. */\n  store: string | null = null;\n\n  private readonly __availablePaymentMethodsLoaderId = 'availablePaymentMethodsLoader';\n\n  private readonly __paymentPresetLoaderId = 'paymentPresetLoader';\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  private readonly __threeDSecureResponseGetValue = () => {\n    return this.form.config_3d_secure?.endsWith('require_valid_response');\n  };\n\n  private readonly __threeDSecureResponseSetValue = (newValue: boolean) => {\n    const postfix = newValue ? '_require_valid_response' : '';\n    const config = this.form.config_3d_secure;\n    const type = config?.startsWith('all_cards') ? 'all_cards' : 'maestro_only';\n\n    this.edit({ config_3d_secure: `${type}${postfix}` as Data['config_3d_secure'] });\n  };\n\n  private readonly __threeDSecureToggleGetValue = () => {\n    const config = this.form.config_3d_secure;\n\n    if (config?.startsWith('all_cards')) return 'all_cards';\n    if (config?.startsWith('maestro_only')) return 'maestro_only';\n\n    return 'off';\n  };\n\n  private readonly __threeDSecureToggleSetValue = (\n    newValue: 'off' | 'all_cards' | 'maestro_only'\n  ) => {\n    let newFormValue = '';\n\n    if (newValue === 'all_cards' || newValue === 'maestro_only') {\n      if (this.form.config_3d_secure?.endsWith('require_valid_response')) {\n        newFormValue = `${newValue}_require_valid_response`;\n      } else {\n        newFormValue = newValue;\n      }\n    }\n\n    this.edit({ config_3d_secure: newFormValue as Data['config_3d_secure'] });\n  };\n\n  private readonly __threeDSecureToggleOptions = [\n    { value: 'off', label: 'option_off' },\n    { value: 'all_cards', label: 'option_all_cards' },\n    { value: 'maestro_only', label: 'option_maestro_only' },\n  ];\n\n  private readonly __cardVerificationOptions = [\n    { label: 'option_disabled', value: 'disabled' },\n    { label: 'option_enabled_automatically', value: 'enabled_automatically' },\n    { label: 'option_enabled_override', value: 'enabled_override' },\n  ];\n\n  private __search = '';\n\n  private __connectState: 'idle' | 'busy' = 'idle';\n\n  /** Key of the connect choice whose connection URL is being fetched. */\n  private __connectKey = '';\n\n  get hiddenSelector(): BooleanSelector {\n    return new BooleanSelector(`header:copy-json ${super.hiddenSelector}`.trimEnd());\n  }\n\n  renderHeader(...params: Parameters<InternalForm<Data>['renderHeader']>): TemplateResult {\n    return html`\n      <div>\n        ${super.renderHeader(...params)}\n        ${this.data?.type || !this.form.type\n          ? html``\n          : html`\n              <vaadin-button\n                data-testid=\"select-another-button\"\n                theme=\"tertiary-inline\"\n                @click=${() => this.undo()}\n              >\n                <foxy-i18n infer=\"\" key=\"select_another_button_label\"></foxy-i18n>\n              </vaadin-button>\n            `}\n      </div>\n    `;\n  }\n\n  get headerTitleOptions(): Record<string, unknown> {\n    return {\n      context: this.form.type ? 'selected' : 'new',\n      name: this.form.helper?.name,\n    };\n  }\n\n  get headerSubtitleOptions(): Record<string, unknown> {\n    if (this.href) {\n      const vId = getResourceId(this.href) as string;\n      const id = this.headerCopyIdValue;\n      if (vId.startsWith('R')) return { context: 'regular', id };\n      return { context: 'hosted', id };\n    }\n\n    return {};\n  }\n\n  get headerCopyIdValue(): string | number {\n    if (this.href) {\n      const id = getResourceId(this.href) as string;\n      return id.startsWith('R') ? id.slice(1) : id.slice(1).split('C')[0];\n    } else {\n      return '';\n    }\n  }\n\n  renderBody(): TemplateResult {\n    const paymentPreset = this.__paymentPresetLoader?.data;\n\n    const loaders = html`\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(paymentPreset?._links['fx:available_payment_methods'].href)}\n        id=${this.__availablePaymentMethodsLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.store)}\n        id=${this.__storeLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.paymentPreset)}\n        id=${this.__paymentPresetLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n    `;\n\n    return html`${this.renderHeader()}${this.form.type\n      ? this.__renderPaymentMethodConfig()\n      : this.__renderPaymentMethodSelector()}${loaders}`;\n  }\n\n  private get __groupedAvailablePaymentMethods() {\n    const allMethods = Object.entries(this.__availablePaymentMethods ?? {});\n    const filteredMethods = this.__search\n      ? new Fuse(allMethods, { keys: ['1.name'], threshold: 0.25 })\n          .search(this.__search)\n          .map(v => v.item)\n      : allMethods;\n\n    return filteredMethods\n      .sort((a, b) => a[1].name.localeCompare(b[1].name, 'en'))\n      .reduce((groups, [type, helper]) => {\n        if (helper.is_deprecated) return groups;\n\n        const firstChar = helper.name.charAt(0).toUpperCase();\n        const isSpecialCharacter = !/\\w/.test(firstChar);\n        const name = isSpecialCharacter ? '#' : firstChar;\n        const group = groups.find(group => group.name === name);\n\n        const items: PaymentMethod[] = connectableGateways.includes(type)\n          ? this.__getConnectChoices(type).map(choice => ({ type, helper, choice }))\n          : [{ type, helper }];\n\n        if (group) {\n          group.items.push(...items);\n        } else {\n          groups.push({ name, items });\n        }\n\n        return groups;\n      }, [] as { name: string; items: PaymentMethod[] }[]);\n  }\n\n  private get __availablePaymentMethodsLoader() {\n    type Loader = NucleonElement<AvailablePaymentMethods>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__availablePaymentMethodsLoaderId}`);\n  }\n\n  private get __availablePaymentMethods() {\n    return this.__availablePaymentMethodsLoader?.data?.values;\n  }\n\n  private get __paymentPresetLoader() {\n    type Loader = NucleonElement<PaymentPreset>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__paymentPresetLoaderId}`);\n  }\n\n  private get __storeLoader() {\n    type Loader = NucleonElement<Resource<Rels.Store>>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__storeLoaderId}`);\n  }\n\n  private get __liveBlocks() {\n    return this.form.helper?.additional_fields?.blocks.filter(block => block.is_live) ?? [];\n  }\n\n  private get __testBlocks() {\n    return this.form.helper?.additional_fields?.blocks.filter(block => !block.is_live) ?? [];\n  }\n\n  private __renderPaymentMethodSelector() {\n    const loader = this.__availablePaymentMethodsLoader;\n\n    if (!loader?.data) {\n      return html`\n        <foxy-spinner infer=\"list-spinner\" state=${loader?.in('fail') ? 'error' : 'busy'}>\n        </foxy-spinner>\n      `;\n    }\n\n    return html`\n      <div>\n        <input\n          placeholder=${this.t('search_placeholder')}\n          class=\"w-full leading-m font-medium bg-contrast-5 rounded text-body transition-colors hover-bg-contrast-10 focus-bg-contrast-10 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n          style=\"padding: var(--lumo-space-xs) calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n          type=\"search\"\n          .value=${this.__search}\n          @input=${(evt: Event) => {\n            this.__search = (evt.currentTarget as HTMLInputElement).value;\n          }}\n        />\n\n        <section data-testid=\"select-method-list\">\n          ${this.__groupedAvailablePaymentMethods.map(({ name, items }) => {\n            return html`\n              <p class=\"font-medium text-tertiary py-m\">${name}</p>\n              <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n                ${items.map((item, index) =>\n                  this.__renderPaymentMethodButton(item, index, items.length)\n                )}\n              </foxy-internal-summary-control>\n            `;\n          })}\n        </section>\n      </div>\n    `;\n  }\n\n  private __redirect(url: string) {\n    window.location.assign(url);\n  }\n\n  private __getConnectChoices(type: string): ConnectChoice[] {\n    if (type === 'paypal_platform') {\n      return [\n        { key: 'paypal_platform.ppcp', options: { paypal_product_type: 'ppcp' } },\n        {\n          key: 'paypal_platform.express_checkout',\n          options: { paypal_product_type: 'express_checkout' },\n        },\n      ];\n    }\n\n    return [{ key: 'default' }];\n  }\n\n  private __getReconnectChoice(thirdPartyKey: string): ConnectChoice {\n    if (this.form.type === 'paypal_platform') {\n      // An empty third-party key means the account is connected for PayPal only, without cards.\n      const key = thirdPartyKey ? 'reconnect' : 'reconnect_with_cards';\n      return { key: `paypal_platform.${key}`, options: { paypal_product_type: 'ppcp' } };\n    }\n\n    return { key: 'reconnect' };\n  }\n\n  private async __connect(choice: ConnectChoice, type: string) {\n    const presetLink = this.__paymentPresetLoader?.data?._links['fx:connect_gateway'];\n    const href = this.data?._links['fx:connect_gateway']?.href ?? presetLink?.href;\n    if (!href || !this.paymentPreset || this.__connectState === 'busy') return;\n\n    this.__connectState = 'busy';\n    this.__connectKey = choice.key;\n    this.status = null;\n\n    try {\n      const body: Rels.ConnectGateway['props'] = {\n        type,\n        final_redirect: this.getConnectRedirectUrl?.(this.paymentPreset) ?? window.location.href,\n      };\n\n      if (choice.options) body.options = choice.options;\n\n      const response = await this._fetch<{ connection_url: string | null }>(href, {\n        method: 'POST',\n        body: JSON.stringify(body),\n      });\n\n      // The API answers 201 with a null URL when the gateway itself fails to create one.\n      if (!response.connection_url) throw new Error('No connection_url in the response.');\n\n      // State stays busy on purpose: the spinner keeps going until the browser leaves the page.\n      this.__redirect(response.connection_url);\n    } catch (err) {\n      let message = '';\n\n      if (err instanceof Response) {\n        try {\n          const json = await err.json();\n          message = json?._embedded?.['fx:errors']?.[0]?.message ?? '';\n        } catch {\n          // not a vnd.error response\n        }\n      }\n\n      // The API's country error names raw option values ('ppcp', 'express_checkout'), so we\n      // replace it with our own text. It's the only 403 our requests can get that mentions 'ppcp'.\n      const isPpcpUnsupported =\n        err instanceof Response &&\n        err.status === 403 &&\n        choice.options?.paypal_product_type === 'ppcp' &&\n        message.includes(\"'ppcp'\");\n\n      if (isPpcpUnsupported) {\n        this.status = { key: 'connect_error_ppcp_unsupported', type: 'error' };\n      } else if (message) {\n        this.status = { key: 'connect_error', options: { message }, type: 'error' };\n      } else {\n        this.status = { key: 'connect_error_unknown', type: 'error' };\n      }\n\n      this.__connectState = 'idle';\n    }\n  }\n\n  private __renderConnection() {\n    const preset = this.__paymentPresetLoader?.data;\n    if (!preset) return html``;\n\n    const prefix = preset.is_live ? '' : 'test_';\n    const email = this.data?.[`${prefix}account_id` as const];\n    const thirdPartyKey = this.data?.[`${prefix}third_party_key` as const] ?? '';\n    const type = this.form.type as string;\n    const choices = email\n      ? [this.__getReconnectChoice(thirdPartyKey)]\n      : this.__getConnectChoices(type);\n    const isBusy = this.__connectState === 'busy';\n    const isReadonly = this.readonlySelector.matches('connection', true);\n    const isDisabled = isBusy || this.disabledSelector.matches('connection', true);\n\n    return html`\n      <foxy-internal-summary-control infer=\"connection\">\n        ${email\n          ? html`\n              <p class=\"font-medium\">\n                <foxy-i18n infer=\"\" key=\"status_connected\" .options=${{ email }}></foxy-i18n>\n              </p>\n            `\n          : ''}\n        ${(isReadonly ? [] : choices).map(\n          choice => html`\n            <div class=\"leading-xs\">\n              <p class=\"font-medium\">\n                <foxy-i18n infer=\"\" key=\"${choice.key}.label\"></foxy-i18n>\n              </p>\n              <p class=\"text-s text-secondary\">\n                <foxy-i18n infer=\"\" key=\"${choice.key}.description\"></foxy-i18n>\n              </p>\n            </div>\n            <div>\n              <vaadin-button\n                data-testid=\"connect-${choice.key}\"\n                theme=\"tertiary-inline\"\n                ?disabled=${isDisabled}\n                @click=${() => this.__connect(choice, type)}\n              >\n                ${isBusy && this.__connectKey === choice.key\n                  ? html`<foxy-spinner layout=\"no-label\" infer=\"connect-spinner\"></foxy-spinner>`\n                  : html`<foxy-i18n infer=\"\" key=\"${choice.key}.button\"></foxy-i18n>`}\n              </vaadin-button>\n            </div>\n          `\n        )}\n      </foxy-internal-summary-control>\n    `;\n  }\n\n  private __renderPaymentMethodConfig() {\n    if (this.form.type && connectableGateways.includes(this.form.type)) {\n      return html`\n        <foxy-internal-summary-control infer=\"general\">\n          <foxy-internal-text-control layout=\"summary-item\" infer=\"description\">\n          </foxy-internal-text-control>\n        </foxy-internal-summary-control>\n\n        ${this.__renderConnection()} ${super.renderBody()}\n      `;\n    }\n\n    const oauthGateways = [\n      'stripe_connect',\n      'stripe_v2',\n      'square_up',\n      'quickbook_payments',\n      'amazon_mws',\n      'paypal_platform',\n    ];\n\n    if (this.form.type && oauthGateways.includes(this.form.type)) {\n      return html`\n        <div\n          class=\"flex items-start rounded border border-primary\"\n          style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px); padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        >\n          ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0 text-primary\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z\" clip-rule=\"evenodd\"></path></svg>`}\n          <p>\n            <foxy-i18n infer=\"\" key=\"no_oauth_support_message\"></foxy-i18n>\n            <br />\n            <a\n              target=\"_blank\"\n              class=\"mt-xs inline-block rounded font-medium text-primary transition-colors cursor-pointer hover-opacity-80 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n              href=\"https://admin.foxycart.com\"\n            >\n              admin.foxycart.com\n            </a>\n          </p>\n        </div>\n      `;\n    }\n\n    return html`\n      <foxy-internal-summary-control infer=\"general\">\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"description\">\n        </foxy-internal-text-control>\n\n        ${this.form.helper?.supports_auth_only\n          ? html`\n              <foxy-internal-switch-control infer=\"use-auth-only\" helper-text-as-tooltip>\n              </foxy-internal-switch-control>\n            `\n          : ''}\n        ${this.form.helper?.supports_3d_secure\n          ? html`\n              <foxy-internal-select-control\n                layout=\"summary-item\"\n                infer=\"three-d-secure-toggle\"\n                .getValue=${this.__threeDSecureToggleGetValue}\n                .setValue=${this.__threeDSecureToggleSetValue}\n                .options=${this.__threeDSecureToggleOptions}\n              >\n              </foxy-internal-select-control>\n\n              ${this.form.config_3d_secure\n                ? html`\n                    <foxy-internal-switch-control\n                      layout=\"summary-item\"\n                      infer=\"three-d-secure-response\"\n                      .getValue=${this.__threeDSecureResponseGetValue}\n                      .setValue=${this.__threeDSecureResponseSetValue}\n                    >\n                    </foxy-internal-switch-control>\n                  `\n                : ''}\n            `\n          : ''}\n      </foxy-internal-summary-control>\n\n      ${['live', 'test'].map((type, index) => {\n        const propertyPrefix = index === 0 ? '' : (`${type}_` as '' | 'test_');\n        const inferPrefix = index === 0 ? '' : `${type}-`;\n        const blocks = index === 0 ? this.__liveBlocks : this.__testBlocks;\n        const scope = `${type}-group`;\n\n        if (type === 'live' && !this.__storeLoader?.data) return html``;\n        if (type === 'live' && !this.__storeLoader?.data?.is_active) {\n          return html`\n            <foxy-internal-summary-control infer=\"${type}-group\">\n              <div\n                class=\"flex items-start\"\n                style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n              >\n                ${svg`<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" class=\"flex-shrink-0 text-primary\" style=\"width: 1.25em\"><path fill-rule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z\" clip-rule=\"evenodd\"></path></svg>`}\n                <p><foxy-i18n infer=\"\" key=\"inactive_message\"></foxy-i18n></p>\n              </div>\n            </foxy-internal-summary-control>\n          `;\n        }\n\n        const showInactiveSetText =\n          this.__storeLoader?.data?.is_active === true &&\n          ((type === 'test' && this.__paymentPresetLoader?.data?.is_live === true) ||\n            (type === 'live' && this.__paymentPresetLoader?.data?.is_live === false));\n\n        return html`\n          <foxy-internal-summary-control\n            helper-text=${ifDefined(\n              showInactiveSetText ? this.t(`${scope}.helper_text_inactive`) : void 0\n            )}\n            layout=\"section\"\n            label=${ifDefined(showInactiveSetText ? this.t(`${scope}.label_inactive`) : void 0)}\n            infer=${scope}\n          >\n            <foxy-internal-summary-control infer=\"\" label=\"\" helper-text=\"\">\n              ${this.form.helper?.id_description\n                ? html`\n                    <foxy-internal-text-control\n                      placeholder=${this.t('default_additional_field_placeholder')}\n                      helper-text=\"\"\n                      layout=\"summary-item\"\n                      label=${this.form.helper.id_description}\n                      infer=\"${inferPrefix}account-id\"\n                    >\n                    </foxy-internal-text-control>\n                  `\n                : ''}\n              ${this.form.helper?.third_party_key_description\n                ? html`\n                    <foxy-internal-password-control\n                      placeholder=${this.t('default_additional_field_placeholder')}\n                      helper-text=\"\"\n                      layout=\"summary-item\"\n                      label=${this.form.helper.third_party_key_description}\n                      infer=\"${inferPrefix}third-party-key\"\n                    >\n                    </foxy-internal-password-control>\n                  `\n                : ''}\n              ${this.form.helper?.key_description\n                ? html`\n                    <foxy-internal-password-control\n                      placeholder=${this.t('default_additional_field_placeholder')}\n                      layout=\"summary-item\"\n                      helper-text=\"\"\n                      label=${this.form.helper.key_description}\n                      infer=\"${inferPrefix}account-key\"\n                    >\n                    </foxy-internal-password-control>\n                  `\n                : ''}\n              ${blocks.map(block => this.__renderBlock(block))}\n              ${this.form.helper?.supports_card_verification\n                ? html`\n                    <foxy-internal-select-control\n                      helper-text=${this.t(\n                        `${scope}.${inferPrefix}card-verification.helper_text_${\n                          this.form[`${propertyPrefix}card_verification` as const] || 'disabled'\n                        }`\n                      )}\n                      layout=\"summary-item\"\n                      infer=\"${inferPrefix}card-verification\"\n                      .options=${this.__cardVerificationOptions}\n                      .getValue=${() => {\n                        return (\n                          this.form[`${propertyPrefix}card_verification` as const] || 'disabled'\n                        );\n                      }}\n                    >\n                    </foxy-internal-select-control>\n                  `\n                : ''}\n            </foxy-internal-summary-control>\n\n            ${this.form.helper?.supports_card_verification &&\n            this.form[`${propertyPrefix}card_verification` as const]?.startsWith('enabled_')\n              ? html`\n                  <foxy-internal-summary-control\n                    layout=\"details\"\n                    class=\"mt-s\"\n                    infer=\"${inferPrefix}card-verification-config\"\n                  >\n                    ${['visa', 'mastercard', 'american-express', 'discover', 'default'].map(\n                      type => {\n                        return html`\n                          <foxy-internal-number-control\n                            json-template=${ifDefined(this.form.helper?.card_verification_config)}\n                            json-path=\"verification_amounts.${type.replace(/-/g, '_')}\"\n                            property=\"${propertyPrefix}card_verification_config\"\n                            layout=\"summary-item\"\n                            infer=\"${inferPrefix}card-verification-config-verification-amounts-${type}\"\n                            step=\"0.01\"\n                            min=\"0\"\n                          >\n                          </foxy-internal-number-control>\n                        `;\n                      }\n                    )}\n                  </foxy-internal-summary-control>\n                `\n              : ''}\n          </foxy-internal-summary-control>\n        `;\n      })}\n      ${super.renderBody()}\n    `;\n  }\n\n  private __renderPaymentMethodButton(\n    { type, helper, choice }: PaymentMethod,\n    index: number,\n    total: number\n  ) {\n    const defaultSrc = PaymentsApiPaymentMethodForm.defaultImageSrc;\n    const src = this.getImageSrc?.(type) ?? defaultSrc;\n    const onError = (evt: Event) => ((evt.currentTarget as HTMLImageElement).src = defaultSrc);\n    const isBusy = this.__connectState === 'busy';\n    const isConnecting = isBusy && !!choice && this.__connectKey === choice.key;\n    const hasChoiceLabel = !!choice && choice.key !== 'default';\n\n    return html`\n      <button\n        class=${classMap({\n          'relative w-full block text-left bg-contrast-5 overflow-hidden': true,\n          'focus-outline-none focus-ring-inset focus-ring-2 focus-ring-primary-50': true,\n          'transition-colors hover-bg-contrast-10': !helper.conflict,\n          'cursor-default': !!helper.conflict,\n          'rounded-t': index === 0,\n          'rounded-b': index === total - 1,\n        })}\n        data-testid=${ifDefined(choice ? `connect-${choice.key}` : undefined)}\n        ?disabled=${!!helper.conflict || isBusy}\n        style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        @click=${() => (choice ? this.__connect(choice, type) : this.edit({ type, helper }))}\n      >\n        <figure\n          class=\"relative flex items-center\"\n          style=\"gap: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n        >\n          ${isConnecting\n            ? html`\n                <foxy-spinner\n                  data-testid=\"connect-spinner\"\n                  class=\"h-m w-m flex items-center justify-center flex-shrink-0\"\n                  layout=\"no-label\"\n                  infer=\"connect-spinner\"\n                >\n                </foxy-spinner>\n              `\n            : html`\n                <img\n                  class=${classMap({\n                    'h-m w-m object-cover rounded-full bg-contrast-20 flex-shrink-0 shadow-xs':\n                      true,\n                    'filter grayscale': !!helper.conflict,\n                  })}\n                  src=${src}\n                  alt=\"\"\n                  @error=${onError}\n                />\n              `}\n          <figcaption\n            class=${classMap({\n              'min-w-0 flex-1 grid leading-xs': true,\n              'text-disabled': !!helper.conflict,\n            })}\n          >\n            <span class=\"font-medium\">\n              ${hasChoiceLabel\n                ? this.t(`connection.${choice!.key}.label`)\n                : helper.name}&ZeroWidthSpace;\n            </span>\n            ${helper.conflict\n              ? html`<span class=\"text-xs\"> ${this.t('conflict_message', helper.conflict)}</span>`\n              : choice\n              ? html`\n                  <span class=\"text-xs text-secondary\">\n                    ${hasChoiceLabel ? this.t(`connection.${choice.key}.description`) : ''}\n                    ${this.t('connection.redirect_notice')}\n                  </span>\n                `\n              : ''}\n          </figcaption>\n        </figure>\n      </button>\n    `;\n  }\n\n  private __renderBlock(block: Block) {\n    return html`${block.fields.map(field => {\n      if (field.type === 'hidden') return;\n      const scope = ['additional-fields', field.id].join('-').replace(/_/g, '-');\n\n      const getValue = () => {\n        try {\n          const config = JSON.parse(this.form.additional_fields ?? '{}');\n          return get(config, field.id) ?? config.default_value;\n        } catch {\n          return field.default_value;\n        }\n      };\n\n      const setValue = (newValue: unknown) => {\n        let config: Record<string, unknown> = {};\n\n        try {\n          config = JSON.parse(this.form.additional_fields ?? '');\n        } catch {\n          // ignore\n        }\n\n        this.edit({ additional_fields: JSON.stringify(set(config, field.id, newValue)) });\n      };\n\n      type Option = { name: string; value: string };\n      const options = (field as { options?: Option[] }).options;\n\n      return html`\n        ${field.type === 'checkbox'\n          ? html`\n              <foxy-internal-switch-control\n                helper-text=${field.description ?? ''}\n                label=${field.name}\n                infer=${scope}\n                helper-text-as-tooltip\n                .getValue=${getValue}\n                .setValue=${setValue}\n              >\n              </foxy-internal-switch-control>\n            `\n          : field.type === 'select'\n          ? html`\n              <foxy-internal-select-control\n                placeholder=${this.t('default_additional_field_select_placeholder')}\n                helper-text=${field.description ?? ''}\n                layout=\"summary-item\"\n                label=${field.name}\n                infer=${scope}\n                .options=${options!.map(({ name, value }) => ({ label: name, value }))}\n                .getValue=${getValue}\n                .setValue=${setValue}\n              >\n              </foxy-internal-select-control>\n            `\n          : html`\n              <foxy-internal-text-control\n                helper-text=${field.description ?? ''}\n                placeholder=${field.default_value || this.t('default_additional_field_placeholder')}\n                layout=\"summary-item\"\n                label=${field.name}\n                infer=${scope}\n                .getValue=${getValue}\n                .setValue=${setValue}\n              >\n              </foxy-internal-text-control>\n            `}\n      `;\n    })}`;\n  }\n}\n"]}

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

@@ -21,6 +21,8 @@ declare const Base: typeof InternalForm & import("lit-element").Constructor<impo
 export declare class PaymentsApiPaymentPresetForm extends Base<Data> {
     static get properties(): PropertyDeclarations;
     static get v8n(): NucleonV8N<Data>;
+    /** Passed to the payment method form. See `PaymentsApiPaymentMethodForm.getConnectRedirectUrl`. */
+    getConnectRedirectUrl: ((paymentPreset: string) => string) | null;
     /** A function that returns image URL for given fraud protection `type`. */
     getFraudProtectionImageSrc: ((type: string) => string) | null;
     /** A function that returns image URL for given payment method `type`. */

package/dist/elements/public/PaymentsApiPaymentPresetForm/PaymentsApiPaymentPresetForm.js

@@ -19,6 +19,8 @@ const Base = TranslatableMixin(InternalForm, NS);
 export class PaymentsApiPaymentPresetForm extends Base {
     constructor() {
         super(...arguments);
+        /** Passed to the payment method form. See `PaymentsApiPaymentMethodForm.getConnectRedirectUrl`. */
+        this.getConnectRedirectUrl = null;
         /** A function that returns image URL for given fraud protection `type`. */
         this.getFraudProtectionImageSrc = null;
         /** A function that returns image URL for given payment method `type`. */
@@ -36,6 +38,7 @@ export class PaymentsApiPaymentPresetForm extends Base {
     static get properties() {
         return {
             ...super.properties,
+            getConnectRedirectUrl: { attribute: false },
             getFraudProtectionImageSrc: { attribute: false },
             getPaymentMethodImageSrc: { attribute: false },
         };
@@ -102,6 +105,7 @@ export class PaymentsApiPaymentPresetForm extends Base {
         wide
         .itemProps=${{ '.getImageSrc': this.getPaymentMethodImageSrc }}
         .formProps=${{
+            '.getConnectRedirectUrl': this.getConnectRedirectUrl,
             '.getImageSrc': this.getPaymentMethodImageSrc,
             'payment-preset': this.href,
             'store': (_d = this.data) === null || _d === void 0 ? void 0 : _d._links['fx:store'].href,

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

@@ -1 +1 @@
-{"version":3,"file":"PaymentsApiPaymentPresetForm.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentPresetForm/PaymentsApiPaymentPresetForm.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,kCAAkC,CAAC;AAC9C,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD;;;;;;;;;;GAUG;AACH,MAAM,OAAO,4BAA6B,SAAQ,IAAU;IAA5D;;QAgBE,2EAA2E;QAC3E,+BAA0B,GAAsC,IAAI,CAAC;QAErE,yEAAyE;QACzE,6BAAwB,GAAsC,IAAI,CAAC;QAElD,qCAAgC,GAAG,GAAG,EAAE;;YACvD,OAAO,aAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,SAAS,EAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC,KAAK,CAAC;QAC3F,CAAC,CAAC;QAEe,qBAAgB,GAAG,GAAG,EAAE;;YACvC,OAAO,aAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,SAAS,EAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;QACzE,CAAC,CAAC;QAEe,oBAAe,GAAG,aAAa,CAAC;IAgGnD,CAAC;IA7HC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,0BAA0B,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YAChD,wBAAwB,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAC/C,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,GAAG;QACZ,OAAO;YACL,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,0BAA0B;YACzD,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,GAAG,CAAC,IAAI,0BAA0B;SAC7E,CAAC;IACJ,CAAC;IAkBD,IAAI,gBAAgB;;QAClB,MAAM,WAAW,GAAG,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEtD,IAAI,cAAC,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,SAAS,CAAA,EAAE;YACxC,WAAW,CAAC,OAAO,CAAC,iBAAiB,EAAE,mCAAmC,CAAC,CAAC;SAC7E;QAED,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,kBAAkB,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;QAC1E,MAAM,aAAa,GAAG,CAAC,cAAC,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,SAAS,CAAA,CAAC;QAE5D,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,WAAW,CAAC,OAAO,CAAC,iBAAiB,EAAE,mBAAmB,CAAC,CAAC;QAC5E,IAAI,CAAC,aAAa;YAAE,WAAW,CAAC,OAAO,CAAC,iBAAiB,EAAE,mCAAmC,CAAC,CAAC;QAEhG,OAAO,IAAI,eAAe,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAC3D,CAAC;IAED,UAAU;;QACR,MAAM,aAAa,GAAG,CAAC,cAAC,IAAI,CAAC,aAAa,0CAAE,IAAI,0CAAE,SAAS,CAAA,CAAC;QAC5D,MAAM,gBAAgB,GAAG,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,iBAAiB,CAAC;QAEhE,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,EAAE;;;;;;;wBAOH,IAAI,CAAC,CAAC,CAAC,8BAA8B,gBAAgB,EAAE,CAAC;;;sBAG1D,IAAI,CAAC,gBAAgB;;;;;wBAKnB,IAAI,CAAC,CAAC,CAAC,gDAAgD,gBAAgB,EAAE,CAAC;;;sBAG5E,IAAI,CAAC,gCAAgC;;;;;;;gBAO3C,SAAS,OAAC,IAAI,CAAC,IAAI,0CAAE,MAAM,CAAC,oBAAoB,EAAE,IAAI,CAAC;;;;;;qBAMlD,EAAE,cAAc,EAAE,IAAI,CAAC,wBAAwB,EAAE;qBACjD;YACX,cAAc,EAAE,IAAI,CAAC,wBAAwB;YAC7C,gBAAgB,EAAE,IAAI,CAAC,IAAI;YAC3B,OAAO,QAAE,IAAI,CAAC,IAAI,0CAAE,MAAM,CAAC,UAAU,EAAE,IAAI;SAC5C;;;;;;gBAMO,SAAS,OAAC,IAAI,CAAC,IAAI,0CAAE,MAAM,CAAC,sBAAsB,EAAE,IAAI,CAAC;;;;;qBAKpD,EAAE,cAAc,EAAE,IAAI,CAAC,0BAA0B,EAAE;qBACnD,EAAE,cAAc,EAAE,IAAI,CAAC,0BAA0B,EAAE;;;;QAIhE,KAAK,CAAC,UAAU,EAAE;;;;;eAKX,SAAS,OAAC,IAAI,CAAC,IAAI,0CAAE,MAAM,CAAC,UAAU,EAAE,IAAI,CAAC;aAC/C,IAAI,CAAC,eAAe;kBACf,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE;;;KAGvC,CAAC;IACJ,CAAC;IAED,IAAY,aAAa;QAEvB,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAS,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC,CAAC;IAC3E,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Data } from './types';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\nconst NS = 'payments-api-payment-preset-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for the `fx:payment_preset` resource of Payments API.\n *\n * _Payments API is a client-side virtual API layer built on top of hAPI\n * in an attempt to streamline access to stores' payment method settings\n * that is currently a bit quirky due to the legacy functionality. To use\n * this element with hAPI, wrap it into a foxy-payments-api node._\n *\n * @element foxy-payments-api-payment-preset-form\n * @since 1.21.0\n */\nexport class PaymentsApiPaymentPresetForm extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      getFraudProtectionImageSrc: { attribute: false },\n      getPaymentMethodImageSrc: { attribute: false },\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ description: v }) => !!v || 'description:v8n_required',\n      ({ description: v }) => (v && v.length <= 100) || 'description:v8n_too_long',\n    ];\n  }\n\n  /** A function that returns image URL for given fraud protection `type`. */\n  getFraudProtectionImageSrc: ((type: string) => string) | null = null;\n\n  /** A function that returns image URL for given payment method `type`. */\n  getPaymentMethodImageSrc: ((type: string) => string) | null = null;\n\n  private readonly __isPurchaseOrderEnabledGetValue = () => {\n    return this.__storeLoader?.data?.is_active ? this.form.is_purchase_order_enabled : false;\n  };\n\n  private readonly __isLiveGetValue = () => {\n    return this.__storeLoader?.data?.is_active ? this.form.is_live : false;\n  };\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  get readonlySelector(): BooleanSelector {\n    const alwaysMatch = [super.hiddenSelector.toString()];\n\n    if (!this.__storeLoader?.data?.is_active) {\n      alwaysMatch.unshift('general:is-live', 'general:is-purchase-order-enabled');\n    }\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['header:copy-json', super.hiddenSelector.toString()];\n    const isStoreActive = !!this.__storeLoader?.data?.is_active;\n\n    if (!this.data) alwaysMatch.unshift('payment-methods', 'fraud-protections');\n    if (!isStoreActive) alwaysMatch.unshift('general:is-live', 'general:is-purchase-order-enabled');\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderBody(): TemplateResult {\n    const isStoreActive = !!this.__storeLoader?.data?.is_active;\n    const helperTextSuffix = isStoreActive ? '' : '_inactive_store';\n\n    return html`\n      ${this.renderHeader()}\n\n      <foxy-internal-summary-control infer=\"general\">\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"description\">\n        </foxy-internal-text-control>\n\n        <foxy-internal-switch-control\n          helper-text=${this.t(`general.is-live.helper_text${helperTextSuffix}`)}\n          infer=\"is-live\"\n          helper-text-as-tooltip\n          .getValue=${this.__isLiveGetValue}\n        >\n        </foxy-internal-switch-control>\n\n        <foxy-internal-switch-control\n          helper-text=${this.t(`general.is-purchase-order-enabled.helper_text${helperTextSuffix}`)}\n          infer=\"is-purchase-order-enabled\"\n          helper-text-as-tooltip\n          .getValue=${this.__isPurchaseOrderEnabledGetValue}\n        >\n        </foxy-internal-switch-control>\n      </foxy-internal-summary-control>\n\n      <foxy-internal-async-list-control\n        infer=\"payment-methods\"\n        first=${ifDefined(this.data?._links['fx:payment_methods'].href)}\n        limit=\"5\"\n        item=\"foxy-payments-api-payment-method-card\"\n        form=\"foxy-payments-api-payment-method-form\"\n        alert\n        wide\n        .itemProps=${{ '.getImageSrc': this.getPaymentMethodImageSrc }}\n        .formProps=${{\n          '.getImageSrc': this.getPaymentMethodImageSrc,\n          'payment-preset': this.href,\n          'store': this.data?._links['fx:store'].href,\n        }}\n      >\n      </foxy-internal-async-list-control>\n\n      <foxy-internal-async-list-control\n        infer=\"fraud-protections\"\n        first=${ifDefined(this.data?._links['fx:fraud_protections'].href)}\n        limit=\"5\"\n        item=\"foxy-payments-api-fraud-protection-card\"\n        form=\"foxy-payments-api-fraud-protection-form\"\n        alert\n        .itemProps=${{ '.getImageSrc': this.getFraudProtectionImageSrc }}\n        .formProps=${{ '.getImageSrc': this.getFraudProtectionImageSrc }}\n      >\n      </foxy-internal-async-list-control>\n\n      ${super.renderBody()}\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.data?._links['fx:store'].href)}\n        id=${this.__storeLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n    `;\n  }\n\n  private get __storeLoader() {\n    type Loader = NucleonElement<Resource<Rels.Store>>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__storeLoaderId}`);\n  }\n}\n"]}
+{"version":3,"file":"PaymentsApiPaymentPresetForm.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentsApiPaymentPresetForm/PaymentsApiPaymentPresetForm.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { NucleonV8N } from '../NucleonElement/types';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Data } from './types';\nimport type { Rels } from '@foxy.io/sdk/backend';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { InternalForm } from '../../internal/InternalForm/InternalForm';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\nconst NS = 'payments-api-payment-preset-form';\nconst Base = TranslatableMixin(InternalForm, NS);\n\n/**\n * Form element for the `fx:payment_preset` resource of Payments API.\n *\n * _Payments API is a client-side virtual API layer built on top of hAPI\n * in an attempt to streamline access to stores' payment method settings\n * that is currently a bit quirky due to the legacy functionality. To use\n * this element with hAPI, wrap it into a foxy-payments-api node._\n *\n * @element foxy-payments-api-payment-preset-form\n * @since 1.21.0\n */\nexport class PaymentsApiPaymentPresetForm extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      getConnectRedirectUrl: { attribute: false },\n      getFraudProtectionImageSrc: { attribute: false },\n      getPaymentMethodImageSrc: { attribute: false },\n    };\n  }\n\n  static get v8n(): NucleonV8N<Data> {\n    return [\n      ({ description: v }) => !!v || 'description:v8n_required',\n      ({ description: v }) => (v && v.length <= 100) || 'description:v8n_too_long',\n    ];\n  }\n\n  /** Passed to the payment method form. See `PaymentsApiPaymentMethodForm.getConnectRedirectUrl`. */\n  getConnectRedirectUrl: ((paymentPreset: string) => string) | null = null;\n\n  /** A function that returns image URL for given fraud protection `type`. */\n  getFraudProtectionImageSrc: ((type: string) => string) | null = null;\n\n  /** A function that returns image URL for given payment method `type`. */\n  getPaymentMethodImageSrc: ((type: string) => string) | null = null;\n\n  private readonly __isPurchaseOrderEnabledGetValue = () => {\n    return this.__storeLoader?.data?.is_active ? this.form.is_purchase_order_enabled : false;\n  };\n\n  private readonly __isLiveGetValue = () => {\n    return this.__storeLoader?.data?.is_active ? this.form.is_live : false;\n  };\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  get readonlySelector(): BooleanSelector {\n    const alwaysMatch = [super.hiddenSelector.toString()];\n\n    if (!this.__storeLoader?.data?.is_active) {\n      alwaysMatch.unshift('general:is-live', 'general:is-purchase-order-enabled');\n    }\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  get hiddenSelector(): BooleanSelector {\n    const alwaysMatch = ['header:copy-json', super.hiddenSelector.toString()];\n    const isStoreActive = !!this.__storeLoader?.data?.is_active;\n\n    if (!this.data) alwaysMatch.unshift('payment-methods', 'fraud-protections');\n    if (!isStoreActive) alwaysMatch.unshift('general:is-live', 'general:is-purchase-order-enabled');\n\n    return new BooleanSelector(alwaysMatch.join(' ').trim());\n  }\n\n  renderBody(): TemplateResult {\n    const isStoreActive = !!this.__storeLoader?.data?.is_active;\n    const helperTextSuffix = isStoreActive ? '' : '_inactive_store';\n\n    return html`\n      ${this.renderHeader()}\n\n      <foxy-internal-summary-control infer=\"general\">\n        <foxy-internal-text-control layout=\"summary-item\" infer=\"description\">\n        </foxy-internal-text-control>\n\n        <foxy-internal-switch-control\n          helper-text=${this.t(`general.is-live.helper_text${helperTextSuffix}`)}\n          infer=\"is-live\"\n          helper-text-as-tooltip\n          .getValue=${this.__isLiveGetValue}\n        >\n        </foxy-internal-switch-control>\n\n        <foxy-internal-switch-control\n          helper-text=${this.t(`general.is-purchase-order-enabled.helper_text${helperTextSuffix}`)}\n          infer=\"is-purchase-order-enabled\"\n          helper-text-as-tooltip\n          .getValue=${this.__isPurchaseOrderEnabledGetValue}\n        >\n        </foxy-internal-switch-control>\n      </foxy-internal-summary-control>\n\n      <foxy-internal-async-list-control\n        infer=\"payment-methods\"\n        first=${ifDefined(this.data?._links['fx:payment_methods'].href)}\n        limit=\"5\"\n        item=\"foxy-payments-api-payment-method-card\"\n        form=\"foxy-payments-api-payment-method-form\"\n        alert\n        wide\n        .itemProps=${{ '.getImageSrc': this.getPaymentMethodImageSrc }}\n        .formProps=${{\n          '.getConnectRedirectUrl': this.getConnectRedirectUrl,\n          '.getImageSrc': this.getPaymentMethodImageSrc,\n          'payment-preset': this.href,\n          'store': this.data?._links['fx:store'].href,\n        }}\n      >\n      </foxy-internal-async-list-control>\n\n      <foxy-internal-async-list-control\n        infer=\"fraud-protections\"\n        first=${ifDefined(this.data?._links['fx:fraud_protections'].href)}\n        limit=\"5\"\n        item=\"foxy-payments-api-fraud-protection-card\"\n        form=\"foxy-payments-api-fraud-protection-form\"\n        alert\n        .itemProps=${{ '.getImageSrc': this.getFraudProtectionImageSrc }}\n        .formProps=${{ '.getImageSrc': this.getFraudProtectionImageSrc }}\n      >\n      </foxy-internal-async-list-control>\n\n      ${super.renderBody()}\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.data?._links['fx:store'].href)}\n        id=${this.__storeLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n    `;\n  }\n\n  private get __storeLoader() {\n    type Loader = NucleonElement<Resource<Rels.Store>>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__storeLoaderId}`);\n  }\n}\n"]}