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

package/dist/elements/public/ShipmentCard/ShipmentCard.js

@@ -1,13 +1,11 @@
-import { html } from 'lit-html';
-import { ifDefined } from 'lit-html/directives/if-defined';
 import { TranslatableMixin } from "../../../mixins/translatable.js";
-import { BooleanSelector } from '@foxy.io/sdk/core';
 import { InternalCard } from "../../internal/InternalCard/InternalCard.js";
-import { ConfigurableMixin } from "../../../mixins/configurable.js";
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { html } from 'lit-html';
 const NS = 'shipment-card';
-const Base = ConfigurableMixin(TranslatableMixin(InternalCard, NS));
+const Base = TranslatableMixin(InternalCard, NS);
 /**
- * Basic card displaying a shipment.
+ * Basic card displaying a shipment (`fx:shipment`).
  *
  * @element foxy-shipment-card
  * @since 1.17.0
@@ -15,104 +13,105 @@ const Base = ConfigurableMixin(TranslatableMixin(InternalCard, NS));
 export class ShipmentCard extends Base {
     constructor() {
         super(...arguments);
-        this.__customerAddresses = '';
-        this.__currencyDisplay = '';
-        this.__itemCategories = '';
-        this.__editable = false;
-        this.__currency = '';
-        this.__coupons = '';
-    }
-    static get properties() {
-        return {
-            ...super.properties,
-            __customerAddresses: { attribute: false },
-            __currencyDisplay: { attribute: false },
-            __itemCategories: { attribute: false },
-            __editable: { attribute: false },
-            __currency: { attribute: false },
-            __coupons: { attribute: false },
-        };
-    }
-    get readonlySelector() {
-        return this.__editable ? super.readonlySelector : BooleanSelector.True;
+        this.__transactionLoaderId = 'transactionLoader';
+        this.__storeLoaderId = 'storeLoader';
     }
     renderBody() {
-        var _a, _b, _c;
-        let itemsLink = undefined;
-        if (this.data) {
-            try {
-                const url = new URL(this.data._links['fx:items'].href);
-                url.searchParams.set('zoom', 'item_options');
-                itemsLink = url.toString();
-            }
-            catch (_d) {
-                //
-            }
-        }
-        const itemFormRenderer = ({ html, dialog, handleFetch, handleUpdate }) => html `
-      <foxy-item-form
-        customer-addresses=${this.__customerAddresses}
-        item-categories=${this.__itemCategories}
-        coupons=${this.__coupons}
-        parent=${dialog.parent}
-        href=${dialog.href}
-        infer=""
-        id="form"
-        @fetch=${handleFetch}
-        @update=${handleUpdate}
-      >
-      </foxy-item-form>
-    `;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const { address_name, address1, address2, city, region, postal_code } = (_a = this.data) !== null && _a !== void 0 ? _a : {};
         const addressOptions = { address_name, address1, address2, city, region, postal_code };
-        const amount = `${(_b = this.data) === null || _b === void 0 ? void 0 : _b.total_shipping} ${this.__currency}`;
+        const amount = `${(_b = this.data) === null || _b === void 0 ? void 0 : _b.total_shipping} ${this.__currencyCode}`;
         const currencyDisplay = this.__currencyDisplay;
         const priceOptions = { amount, currencyDisplay };
+        const description = (_c = this.data) === null || _c === void 0 ? void 0 : _c.shipping_service_description;
+        const items = (_f = (_e = (_d = this.data) === null || _d === void 0 ? void 0 : _d._embedded) === null || _e === void 0 ? void 0 : _e['fx:items']) !== null && _f !== void 0 ? _f : [];
         return html `
-      <div class="space-y-m">
-        <div>
-          <div class="flex items-center text-m space-x-s text-secondary">
-            <iron-icon icon="maps:place" class="icon-inline flex-shrink-0"></iron-icon>
-            <span class="truncate">
-              <foxy-i18n infer="address" key="full_address" .options=${addressOptions}></foxy-i18n>
-            </span>
-          </div>
+      <foxy-nucleon
+        infer=""
+        href=${ifDefined((_g = this.data) === null || _g === void 0 ? void 0 : _g._links['fx:transaction'].href)}
+        id=${this.__transactionLoaderId}
+        @update=${() => this.requestUpdate()}
+      >
+      </foxy-nucleon>
+
+      <foxy-nucleon
+        infer=""
+        href=${ifDefined((_h = this.data) === null || _h === void 0 ? void 0 : _h._links['fx:store'].href)}
+        id=${this.__storeLoaderId}
+        @update=${() => this.requestUpdate()}
+      >
+      </foxy-nucleon>
+
+      <div class="space-y-s">
+        <div class="grid leading-s text-body">
+          <foxy-i18n
+            class="truncate text-m font-medium"
+            infer=""
+            key="full_address"
+            .options=${addressOptions}
+          >
+          </foxy-i18n>
 
-          <div class="flex items-center text-m space-x-s text-secondary">
-            <iron-icon icon="maps:local-shipping" class="icon-inline flex-shrink-0"></iron-icon>
-            <span class="truncate">
-              ${(_c = this.data) === null || _c === void 0 ? void 0 : _c.shipping_service_description} &bull;
-              <foxy-i18n key="price" infer="address" .options=${priceOptions}></foxy-i18n>
-            </span>
-          </div>
+          <span class="truncate text-s text-secondary">
+            ${description ? html `${description} &bull; ` : ''}
+            <foxy-i18n key="price" infer="" .options=${priceOptions}></foxy-i18n>
+            &bull;
+            <foxy-i18n infer="" key="item" .options=${{ count: items.length }}></foxy-i18n>
+          </span>
         </div>
 
-        <foxy-internal-async-details-control
-          infer="items"
-          first=${ifDefined(itemsLink)}
-          limit="5"
-          item="foxy-item-card"
-          open
-          .form=${itemFormRenderer}
-        >
-        </foxy-internal-async-details-control>
+        ${items.length > 0
+            ? html `
+              <div class="border-t border-dashed border-contrast-20"></div>
+              <div class="overflow-auto">
+                <table class="text-s leading-s whitespace-nowrap">
+                  <thead></thead>
+                  <tbody>
+                    ${items.map(item => {
+                var _a;
+                const category = (_a = item._embedded) === null || _a === void 0 ? void 0 : _a['fx:item_category'];
+                const lengthUnit = category === null || category === void 0 ? void 0 : category.default_length_unit;
+                const weightUnit = category === null || category === void 0 ? void 0 : category.default_weight_unit;
+                return html `
+                        <tr>
+                          <td class="pr-s font-medium">${item.code}</td>
+                          <td class="px-s text-secondary">${item.name}</td>
+                          <td class="px-s text-tertiary">
+                            ${item.width}&times;${item.height}&times;${item.length} ${lengthUnit}
+                          </td>
+                          <td class="px-s text-tertiary">${item.weight} ${weightUnit}</td>
+                          <td class="pl-s font-medium">
+                            <foxy-i18n infer="" key="quantity" .options=${{ count: item.quantity }}>
+                            </foxy-i18n>
+                          </td>
+                        </tr>
+                      `;
+            })}
+                  </tbody>
+                </table>
+              </div>
+            `
+            : ''}
       </div>
     `;
     }
-    async _sendGet() {
-        const shipment = await super._sendGet();
-        const [transaction, customer, store] = await Promise.all([
-            super._fetch(shipment._links['fx:transaction'].href),
-            super._fetch(shipment._links['fx:customer'].href),
-            super._fetch(shipment._links['fx:store'].href),
-        ]);
-        this.__customerAddresses = customer._links['fx:customer_addresses'].href;
-        this.__currencyDisplay = store.use_international_currency_symbol ? 'code' : 'symbol';
-        this.__itemCategories = store._links['fx:item_categories'].href;
-        this.__currency = transaction.currency_code;
-        this.__editable = !!transaction._links['fx:void'] || !!transaction._links['fx:refund'];
-        this.__coupons = store._links['fx:coupons'].href;
-        return shipment;
+    get isBodyReady() {
+        return super.isBodyReady && !!this.__currencyDisplay && !!this.__currencyCode;
+    }
+    get __transactionLoader() {
+        return this.renderRoot.querySelector(`#${this.__transactionLoaderId}`);
+    }
+    get __storeLoader() {
+        return this.renderRoot.querySelector(`#${this.__storeLoaderId}`);
+    }
+    get __currencyDisplay() {
+        var _a;
+        const store = (_a = this.__storeLoader) === null || _a === void 0 ? void 0 : _a.data;
+        return store ? (store.use_international_currency_symbol ? 'code' : 'symbol') : void 0;
+    }
+    get __currencyCode() {
+        var _a, _b;
+        return (_b = (_a = this.__transactionLoader) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.currency_code;
     }
 }
 //# sourceMappingURL=ShipmentCard.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ShipmentCard.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/ShipmentCard.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TemplateResult } from 'lit-html';\nimport type { Data } from './types';\n\nimport { html } from 'lit-html';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { BooleanSelector, Resource } from '@foxy.io/sdk/core';\nimport { Rels } from '@foxy.io/sdk/backend';\nimport { PropertyDeclarations } from 'lit-element';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { FormRenderer } from '../FormDialog/types';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\n\nconst NS = 'shipment-card';\nconst Base = ConfigurableMixin(TranslatableMixin(InternalCard, NS));\n\n/**\n * Basic card displaying a shipment.\n *\n * @element foxy-shipment-card\n * @since 1.17.0\n */\nexport class ShipmentCard extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      __customerAddresses: { attribute: false },\n      __currencyDisplay: { attribute: false },\n      __itemCategories: { attribute: false },\n      __editable: { attribute: false },\n      __currency: { attribute: false },\n      __coupons: { attribute: false },\n    };\n  }\n\n  __customerAddresses = '';\n\n  __currencyDisplay = '';\n\n  __itemCategories = '';\n\n  __editable = false;\n\n  __currency = '';\n\n  __coupons = '';\n\n  get readonlySelector(): BooleanSelector {\n    return this.__editable ? super.readonlySelector : BooleanSelector.True;\n  }\n\n  renderBody(): TemplateResult {\n    let itemsLink: string | undefined = undefined;\n\n    if (this.data) {\n      try {\n        const url = new URL(this.data._links['fx:items'].href);\n        url.searchParams.set('zoom', 'item_options');\n        itemsLink = url.toString();\n      } catch {\n        //\n      }\n    }\n\n    const itemFormRenderer: FormRenderer = ({ html, dialog, handleFetch, handleUpdate }) => html`\n      <foxy-item-form\n        customer-addresses=${this.__customerAddresses}\n        item-categories=${this.__itemCategories}\n        coupons=${this.__coupons}\n        parent=${dialog.parent}\n        href=${dialog.href}\n        infer=\"\"\n        id=\"form\"\n        @fetch=${handleFetch}\n        @update=${handleUpdate}\n      >\n      </foxy-item-form>\n    `;\n\n    const { address_name, address1, address2, city, region, postal_code } = this.data ?? {};\n    const addressOptions = { address_name, address1, address2, city, region, postal_code };\n\n    const amount = `${this.data?.total_shipping} ${this.__currency}`;\n    const currencyDisplay = this.__currencyDisplay;\n    const priceOptions = { amount, currencyDisplay };\n\n    return html`\n      <div class=\"space-y-m\">\n        <div>\n          <div class=\"flex items-center text-m space-x-s text-secondary\">\n            <iron-icon icon=\"maps:place\" class=\"icon-inline flex-shrink-0\"></iron-icon>\n            <span class=\"truncate\">\n              <foxy-i18n infer=\"address\" key=\"full_address\" .options=${addressOptions}></foxy-i18n>\n            </span>\n          </div>\n\n          <div class=\"flex items-center text-m space-x-s text-secondary\">\n            <iron-icon icon=\"maps:local-shipping\" class=\"icon-inline flex-shrink-0\"></iron-icon>\n            <span class=\"truncate\">\n              ${this.data?.shipping_service_description} &bull;\n              <foxy-i18n key=\"price\" infer=\"address\" .options=${priceOptions}></foxy-i18n>\n            </span>\n          </div>\n        </div>\n\n        <foxy-internal-async-details-control\n          infer=\"items\"\n          first=${ifDefined(itemsLink)}\n          limit=\"5\"\n          item=\"foxy-item-card\"\n          open\n          .form=${itemFormRenderer as any}\n        >\n        </foxy-internal-async-details-control>\n      </div>\n    `;\n  }\n\n  protected async _sendGet(): Promise<Data> {\n    type Transaction = Resource<Rels.Transaction>;\n    type Customer = Resource<Rels.Customer>;\n    type Store = Resource<Rels.Store>;\n\n    const shipment = await super._sendGet();\n    const [transaction, customer, store] = await Promise.all([\n      super._fetch<Transaction>(shipment._links['fx:transaction'].href),\n      super._fetch<Customer>(shipment._links['fx:customer'].href),\n      super._fetch<Store>(shipment._links['fx:store'].href),\n    ]);\n\n    this.__customerAddresses = customer._links['fx:customer_addresses'].href;\n    this.__currencyDisplay = store.use_international_currency_symbol ? 'code' : 'symbol';\n    this.__itemCategories = store._links['fx:item_categories'].href;\n    this.__currency = transaction.currency_code;\n    this.__editable = !!transaction._links['fx:void'] || !!transaction._links['fx:refund'];\n    this.__coupons = store._links['fx:coupons'].href;\n\n    return shipment;\n  }\n}\n"]}
+{"version":3,"file":"ShipmentCard.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/ShipmentCard.ts"],"names":[],"mappings":"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","sourcesContent":["import type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { TemplateResult } from 'lit-html';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\nconst NS = 'shipment-card';\nconst Base = TranslatableMixin(InternalCard, NS);\n\n/**\n * Basic card displaying a shipment (`fx:shipment`).\n *\n * @element foxy-shipment-card\n * @since 1.17.0\n */\nexport class ShipmentCard extends Base<Data> {\n  private readonly __transactionLoaderId = 'transactionLoader';\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  renderBody(): TemplateResult {\n    const { address_name, address1, address2, city, region, postal_code } = this.data ?? {};\n    const addressOptions = { address_name, address1, address2, city, region, postal_code };\n\n    const amount = `${this.data?.total_shipping} ${this.__currencyCode}`;\n    const currencyDisplay = this.__currencyDisplay;\n    const priceOptions = { amount, currencyDisplay };\n    const description = this.data?.shipping_service_description;\n    const items = this.data?._embedded?.['fx:items'] ?? [];\n\n    return html`\n      <foxy-nucleon\n        infer=\"\"\n        href=${ifDefined(this.data?._links['fx:transaction'].href)}\n        id=${this.__transactionLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\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      <div class=\"space-y-s\">\n        <div class=\"grid leading-s text-body\">\n          <foxy-i18n\n            class=\"truncate text-m font-medium\"\n            infer=\"\"\n            key=\"full_address\"\n            .options=${addressOptions}\n          >\n          </foxy-i18n>\n\n          <span class=\"truncate text-s text-secondary\">\n            ${description ? html`${description} &bull; ` : ''}\n            <foxy-i18n key=\"price\" infer=\"\" .options=${priceOptions}></foxy-i18n>\n            &bull;\n            <foxy-i18n infer=\"\" key=\"item\" .options=${{ count: items.length }}></foxy-i18n>\n          </span>\n        </div>\n\n        ${items.length > 0\n          ? html`\n              <div class=\"border-t border-dashed border-contrast-20\"></div>\n              <div class=\"overflow-auto\">\n                <table class=\"text-s leading-s whitespace-nowrap\">\n                  <thead></thead>\n                  <tbody>\n                    ${items.map(item => {\n                      const category = item._embedded?.['fx:item_category'];\n                      const lengthUnit = category?.default_length_unit;\n                      const weightUnit = category?.default_weight_unit;\n\n                      return html`\n                        <tr>\n                          <td class=\"pr-s font-medium\">${item.code}</td>\n                          <td class=\"px-s text-secondary\">${item.name}</td>\n                          <td class=\"px-s text-tertiary\">\n                            ${item.width}&times;${item.height}&times;${item.length} ${lengthUnit}\n                          </td>\n                          <td class=\"px-s text-tertiary\">${item.weight} ${weightUnit}</td>\n                          <td class=\"pl-s font-medium\">\n                            <foxy-i18n infer=\"\" key=\"quantity\" .options=${{ count: item.quantity }}>\n                            </foxy-i18n>\n                          </td>\n                        </tr>\n                      `;\n                    })}\n                  </tbody>\n                </table>\n              </div>\n            `\n          : ''}\n      </div>\n    `;\n  }\n\n  get isBodyReady() {\n    return super.isBodyReady && !!this.__currencyDisplay && !!this.__currencyCode;\n  }\n\n  private get __transactionLoader() {\n    type Loader = NucleonElement<Resource<Rels.Transaction>>;\n    return this.renderRoot.querySelector<Loader>(`#${this.__transactionLoaderId}`);\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 __currencyDisplay() {\n    const store = this.__storeLoader?.data;\n    return store ? (store.use_international_currency_symbol ? 'code' : 'symbol') : void 0;\n  }\n\n  private get __currencyCode() {\n    return this.__transactionLoader?.data?.currency_code;\n  }\n}\n"]}

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

@@ -1,9 +1,5 @@
-import '@polymer/iron-icons/maps-icons';
-import '@polymer/iron-icon';
-import '../ItemForm/index';
-import '../ItemCard/index';
-import '../I18n/index';
-import '../../internal/InternalAsyncDetailsControl/index';
 import '../../internal/InternalCard/index';
+import '../NucleonElement/index';
+import '../I18n/index';
 import { ShipmentCard } from './ShipmentCard';
 export { ShipmentCard };

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

@@ -1,10 +1,6 @@
-import '@polymer/iron-icons/maps-icons';
-import '@polymer/iron-icon';
-import "../ItemForm/index.js";
-import "../ItemCard/index.js";
-import "../I18n/index.js";
-import "../../internal/InternalAsyncDetailsControl/index.js";
 import "../../internal/InternalCard/index.js";
+import "../NucleonElement/index.js";
+import "../I18n/index.js";
 import { ShipmentCard } from "./ShipmentCard.js";
 customElements.define('foxy-shipment-card', ShipmentCard);
 export { ShipmentCard };

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,gCAAgC,CAAC;AACxC,OAAO,oBAAoB,CAAC;AAE5B,8BAA2B;AAC3B,8BAA2B;AAC3B,0BAAuB;AAEvB,6DAA0D;AAC1D,8CAA2C;AAE3C,OAAO,EAAE,YAAY,EAAE,0BAAuB;AAE9C,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,YAAY,CAAC,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,CAAC","sourcesContent":["import '@polymer/iron-icons/maps-icons';\nimport '@polymer/iron-icon';\n\nimport '../ItemForm/index';\nimport '../ItemCard/index';\nimport '../I18n/index';\n\nimport '../../internal/InternalAsyncDetailsControl/index';\nimport '../../internal/InternalCard/index';\n\nimport { ShipmentCard } from './ShipmentCard';\n\ncustomElements.define('foxy-shipment-card', ShipmentCard);\n\nexport { ShipmentCard };\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/index.ts"],"names":[],"mappings":"AAAA,8CAA2C;AAC3C,oCAAiC;AACjC,0BAAuB;AAEvB,OAAO,EAAE,YAAY,EAAE,0BAAuB;AAE9C,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,YAAY,CAAC,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,CAAC","sourcesContent":["import '../../internal/InternalCard/index';\nimport '../NucleonElement/index';\nimport '../I18n/index';\n\nimport { ShipmentCard } from './ShipmentCard';\n\ncustomElements.define('foxy-shipment-card', ShipmentCard);\n\nexport { ShipmentCard };\n"]}

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

@@ -1,4 +1,9 @@
 import type { Rels } from '@foxy.io/sdk/backend';
 import type { Resource } from '@foxy.io/sdk/core';
-export declare type Rel = Rels.Shipment;
-export declare type Data = Resource<Rel>;
+export declare type Data = Resource<Rels.Shipment> & {
+    _embedded: {
+        'fx:items': Resource<Rels.Item, {
+            zoom: 'item_category';
+        }>[];
+    };
+};

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

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Rels } from '@foxy.io/sdk/backend';\nimport type { Resource } from '@foxy.io/sdk/core';\n\nexport type Rel = Rels.Shipment;\nexport type Data = Resource<Rel>;\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Rels } from '@foxy.io/sdk/backend';\nimport type { Resource } from '@foxy.io/sdk/core';\n\nexport type Data = Resource<Rels.Shipment> & {\n  _embedded: { 'fx:items': Resource<Rels.Item, { zoom: 'item_category' }>[] };\n};\n"]}

package/dist/elements/public/StoreForm/StoreForm.js

@@ -316,7 +316,7 @@ export class StoreForm extends Base {
             ({ region: v }) => !!v || 'region:v8n_required',
             ({ region: v }) => (v && v.length <= 100) || 'region:v8n_too_long',
             ({ country: v }) => !!v || 'country:v8n_required',
-            ({ logo_url: v }) => !v || v.length <= 100 || 'logo-url:v8n_too_long',
+            ({ logo_url: v }) => !v || v.length <= 200 || 'logo-url:v8n_too_long',
             ({ webhook_url: v, use_webhook }) => !use_webhook || !!v || 'webhook-url:v8n_required',
             ({ webhook_url: v, use_webhook }) => {
                 return !use_webhook || !v || v.length <= 300 || 'webhook-url:v8n_too_long';