@foxy.io/elements 1.18.0-beta.1 → 1.18.0-beta.11

package/dist/elements/public/ItemCategoryForm/internal/InternalItemCategoryFormTaxesControlItem/index.js

@@ -0,0 +1,7 @@
+import '@vaadin/vaadin-checkbox';
+import "../../../NucleonElement/index.js";
+import "../../../TaxCard/index.js";
+import { InternalItemCategoryFormTaxesControlItem } from "./InternalItemCategoryFormTaxesControlItem.js";
+customElements.define('foxy-internal-item-category-form-taxes-control-item', InternalItemCategoryFormTaxesControlItem);
+export { InternalItemCategoryFormTaxesControlItem };
+//# sourceMappingURL=index.js.map

package/dist/elements/public/ItemCategoryForm/internal/InternalItemCategoryFormTaxesControlItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/elements/public/ItemCategoryForm/internal/InternalItemCategoryFormTaxesControlItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC;AAEjC,0CAAuC;AACvC,mCAAgC;AAEhC,OAAO,EAAE,wCAAwC,EAAE,sDAAmD;AAEtG,cAAc,CAAC,MAAM,CACnB,qDAAqD,EACrD,wCAAwC,CACzC,CAAC;AAEF,OAAO,EAAE,wCAAwC,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-checkbox';\n\nimport '../../../NucleonElement/index';\nimport '../../../TaxCard/index';\n\nimport { InternalItemCategoryFormTaxesControlItem } from './InternalItemCategoryFormTaxesControlItem';\n\ncustomElements.define(\n  'foxy-internal-item-category-form-taxes-control-item',\n  InternalItemCategoryFormTaxesControlItem\n);\n\nexport { InternalItemCategoryFormTaxesControlItem };\n"]}

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

@@ -0,0 +1,3 @@
+import type { Rels } from '@foxy.io/sdk/backend';
+import type { Resource } from '@foxy.io/sdk/core';
+export declare type Data = Resource<Rels.ItemCategory>;

package/dist/elements/public/ItemCategoryForm/types.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/ItemCategoryForm/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.ItemCategory>;\n"]}

package/dist/elements/public/NucleonElement/API.js

@@ -25,7 +25,7 @@ export class API extends CoreAPI {
                 });
                 target.dispatchEvent(event);
                 if (!event.defaultPrevented)
-                    fetch(request).then(resolve).catch(reject);
+                    resolve(new Response(null, { status: 500 }));
             }),
         });
     }

package/dist/elements/public/NucleonElement/API.js.map

@@ -1 +1 @@
-{"version":3,"file":"API.js","sourceRoot":"","sources":["../../../../src/elements/public/NucleonElement/API.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,IAAI,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,wBAAqB;AAE1C;;;;;GAKG;AACH,MAAM,OAAO,GAAI,SAAQ,OAAY;IAInC,0FAA0F;IAC1F,YAAY,MAAmB;QAC7B,KAAK,CAAC;YACJ,IAAI,EAAE,IAAI,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC;YAC/B,KAAK,EAAE,CAAC,GAAG,IAAiC,EAAqB,EAAE,CACjE,IAAI,OAAO,CAAW,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACxC,MAAM,OAAO,GAAG,OAAO,IAAI,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBAEvF,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC;gBACxD,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC;gBAE7C,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE;oBACpC,UAAU,EAAE,IAAI;oBAChB,QAAQ,EAAE,IAAI;oBACd,OAAO,EAAE,IAAI;oBACb,OAAO;oBACP,OAAO;oBACP,MAAM;iBACP,CAAC,CAAC;gBAEH,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBAC5B,IAAI,CAAC,KAAK,CAAC,gBAAgB;oBAAE,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YAC1E,CAAC,CAAC;SACL,CAAC,CAAC;IACL,CAAC;;AA3BD,gFAAgF;AAChE,cAAU,GAAG,UAAU,CAAC","sourcesContent":["import { API as CoreAPI } from '@foxy.io/sdk/core';\nimport { FetchEvent } from './FetchEvent';\n\n/**\n * Universal [API](https://sdk.foxy.dev/classes/_core_index_.api.html) client\n * that dispatches the `fetch` event on an element before each request. It bubbles, crosses\n * shadow DOM boundaries, and if cancelled, the target element will not make the request\n * and instead will wait for a response from `event.respondWith()`.\n */\nexport class API extends CoreAPI<any> {\n  /** Instances of this event are dispatched on an element before each request. */\n  static readonly FetchEvent = FetchEvent;\n\n  /** @param target `EventTarget` to dispatch `fetch` events on (e.g. element or window). */\n  constructor(target: EventTarget) {\n    super({\n      base: new URL(document.baseURI),\n      fetch: (...args: Parameters<Window['fetch']>): Promise<Response> =>\n        new Promise<Response>((resolve, reject) => {\n          const request = typeof args[0] === 'string' ? new API.WHATWGRequest(...args) : args[0];\n\n          request.headers.set('Content-Type', 'application/json');\n          request.headers.set('FOXY-API-VERSION', '1');\n\n          const event = new FetchEvent('fetch', {\n            cancelable: true,\n            composed: true,\n            bubbles: true,\n            request,\n            resolve,\n            reject,\n          });\n\n          target.dispatchEvent(event);\n          if (!event.defaultPrevented) fetch(request).then(resolve).catch(reject);\n        }),\n    });\n  }\n}\n"]}
+{"version":3,"file":"API.js","sourceRoot":"","sources":["../../../../src/elements/public/NucleonElement/API.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,IAAI,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,wBAAqB;AAE1C;;;;;GAKG;AACH,MAAM,OAAO,GAAI,SAAQ,OAAY;IAInC,0FAA0F;IAC1F,YAAY,MAAmB;QAC7B,KAAK,CAAC;YACJ,IAAI,EAAE,IAAI,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC;YAC/B,KAAK,EAAE,CAAC,GAAG,IAAiC,EAAqB,EAAE,CACjE,IAAI,OAAO,CAAW,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACxC,MAAM,OAAO,GAAG,OAAO,IAAI,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,aAAa,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBAEvF,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC;gBACxD,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC;gBAE7C,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE;oBACpC,UAAU,EAAE,IAAI;oBAChB,QAAQ,EAAE,IAAI;oBACd,OAAO,EAAE,IAAI;oBACb,OAAO;oBACP,OAAO;oBACP,MAAM;iBACP,CAAC,CAAC;gBAEH,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;gBAC5B,IAAI,CAAC,KAAK,CAAC,gBAAgB;oBAAE,OAAO,CAAC,IAAI,QAAQ,CAAC,IAAI,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;YAC5E,CAAC,CAAC;SACL,CAAC,CAAC;IACL,CAAC;;AA3BD,gFAAgF;AAChE,cAAU,GAAG,UAAU,CAAC","sourcesContent":["import { API as CoreAPI } from '@foxy.io/sdk/core';\nimport { FetchEvent } from './FetchEvent';\n\n/**\n * Universal [API](https://sdk.foxy.dev/classes/_core_index_.api.html) client\n * that dispatches the `fetch` event on an element before each request. It bubbles, crosses\n * shadow DOM boundaries, and if cancelled, the target element will not make the request\n * and instead will wait for a response from `event.respondWith()`.\n */\nexport class API extends CoreAPI<any> {\n  /** Instances of this event are dispatched on an element before each request. */\n  static readonly FetchEvent = FetchEvent;\n\n  /** @param target `EventTarget` to dispatch `fetch` events on (e.g. element or window). */\n  constructor(target: EventTarget) {\n    super({\n      base: new URL(document.baseURI),\n      fetch: (...args: Parameters<Window['fetch']>): Promise<Response> =>\n        new Promise<Response>((resolve, reject) => {\n          const request = typeof args[0] === 'string' ? new API.WHATWGRequest(...args) : args[0];\n\n          request.headers.set('Content-Type', 'application/json');\n          request.headers.set('FOXY-API-VERSION', '1');\n\n          const event = new FetchEvent('fetch', {\n            cancelable: true,\n            composed: true,\n            bubbles: true,\n            request,\n            resolve,\n            reject,\n          });\n\n          target.dispatchEvent(event);\n          if (!event.defaultPrevented) resolve(new Response(null, { status: 500 }));\n        }),\n    });\n  }\n}\n"]}

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

@@ -1,6 +1,6 @@
 /// <reference types="lodash" />
 import { ComputedElementProperties, HALJSONResource, NucleonV8N } from './types';
-import { LitElement, PropertyDeclarations } from 'lit-element';
+import { LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
 import { Nucleon, Rumour } from '@foxy.io/sdk/core';
 import { API } from './API';
 import { UpdateEvent } from './UpdateEvent';
@@ -61,12 +61,13 @@ export declare class NucleonElement<TData extends HALJSONResource> extends Nucle
      * resource on creation or deletion, it will be reloaded from source.
      */
     related: string[];
-    private __href;
+    private __hrefToLoad;
     private __group;
     private __unsubscribeFromRumour;
     private __fetchEventHandler;
     private __fetchEventQueue;
     private readonly __service;
+    constructor();
     /**
      * If network request returns non-2XX code, the entire error response
      * will be available via this getter.
@@ -145,6 +146,7 @@ export declare class NucleonElement<TData extends HALJSONResource> extends Nucle
      * @example element.refresh()
      */
     refresh(): void;
+    render(): TemplateResult;
     /** @readonly */
     connectedCallback(): void;
     /** @readonly */
@@ -159,9 +161,9 @@ export declare class NucleonElement<TData extends HALJSONResource> extends Nucle
     /** PATCHes `element.href`, shares response with the Rumour group and returns parsed JSON. */
     protected _sendPatch(edits: Partial<TData>): Promise<TData>;
     /** DELETEs `element.href`, shares response with the Rumour group and returns parsed JSON. */
-    protected _sendDelete(): Promise<TData>;
+    protected _sendDelete(): Promise<null>;
+    private get __state();
     private __createService;
-    private __destroyService;
     private __createRumour;
     private __destroyRumour;
     private __createServer;

package/dist/elements/public/NucleonElement/NucleonElement.js

@@ -1,4 +1,4 @@
-import { LitElement } from 'lit-element';
+import { html, LitElement } from 'lit-element';
 import { Nucleon, Rumour } from '@foxy.io/sdk/core';
 import { assign, interpret } from 'xstate';
 import { API } from "./API.js";
@@ -18,7 +18,7 @@ import { InferrableMixin } from "../../../mixins/inferrable.js";
  */
 export class NucleonElement extends InferrableMixin(LitElement) {
     constructor() {
-        super(...arguments);
+        super();
         /**
          * Optional ISO 639-1 code describing the language element content is written in.
          * Changing the `lang` attribute will update the value of this property.
@@ -34,7 +34,7 @@ export class NucleonElement extends InferrableMixin(LitElement) {
          * resource on creation or deletion, it will be reloaded from source.
          */
         this.related = [];
-        this.__href = '';
+        this.__hrefToLoad = null;
         this.__group = '';
         this.__fetchEventQueue = [];
         this.__service = interpret(Nucleon.machine.withConfig({
@@ -57,6 +57,7 @@ export class NucleonElement extends InferrableMixin(LitElement) {
                 }),
             },
         }));
+        this.__createService();
     }
     static get inferredProperties() {
         return [...super.inferredProperties, 'group', 'lang'];
@@ -64,6 +65,7 @@ export class NucleonElement extends InferrableMixin(LitElement) {
     /** @readonly */
     static get properties() {
         return {
+            __state: { type: String, reflect: true, attribute: 'state' },
             related: { type: Array },
             parent: { type: String },
             group: { type: String, noAccessor: true },
@@ -122,9 +124,8 @@ export class NucleonElement extends InferrableMixin(LitElement) {
         return this.__service.state.context.data;
     }
     set data(data) {
-        var _a;
         this.__service.send({ type: 'SET_DATA', data });
-        this.__href = (_a = data === null || data === void 0 ? void 0 : data._links.self.href) !== null && _a !== void 0 ? _a : '';
+        this.__hrefToLoad = null;
     }
     /**
      * Rumour group. Elements in different groups will not share updates. Empty by default.
@@ -143,14 +144,16 @@ export class NucleonElement extends InferrableMixin(LitElement) {
      * @example element.href = 'https://demo.foxycart.com/s/customer/attributes/0'
      */
     get href() {
-        return this.__href;
+        var _a, _b, _c;
+        return (_c = (_b = (_a = this.form._links) === null || _a === void 0 ? void 0 : _a.self.href) !== null && _b !== void 0 ? _b : this.__hrefToLoad) !== null && _c !== void 0 ? _c : '';
     }
     set href(value) {
-        this.__href = value;
         if (value) {
+            this.__hrefToLoad = value;
             this.__service.send({ type: 'FETCH' });
         }
         else {
+            this.__hrefToLoad = null;
             this.__service.send({ type: 'SET_DATA', data: null });
         }
     }
@@ -173,6 +176,9 @@ export class NucleonElement extends InferrableMixin(LitElement) {
      * @example element.edit({ first_name: 'Alex' })
      */
     edit(data) {
+        var _a;
+        if (typeof ((_a = data._links) === null || _a === void 0 ? void 0 : _a.self.href) === 'string')
+            this.__hrefToLoad = null;
         this.__service.send({ type: 'EDIT', data });
     }
     /**
@@ -198,21 +204,26 @@ export class NucleonElement extends InferrableMixin(LitElement) {
     refresh() {
         this.__service.send({ type: 'REFRESH' });
     }
+    render() {
+        return html `<slot></slot>`;
+    }
     /** @readonly */
     connectedCallback() {
         super.connectedCallback();
-        this.__createService();
+        if (this.href)
+            this.refresh();
         this.__createRumour();
         this.__createServer();
         this.__processFetchEventQueue();
+        this.dispatchEvent(new UpdateEvent());
     }
     /** @readonly */
     disconnectedCallback() {
         super.disconnectedCallback();
-        this.__destroyService();
         this.__destroyRumour();
         this.__destroyServer();
         this.__flushFetchEventQueue('parent element was disconnected');
+        this.dispatchEvent(new UpdateEvent());
     }
     applyInferredProperties(context) {
         var _a, _b;
@@ -232,49 +243,69 @@ export class NucleonElement extends InferrableMixin(LitElement) {
     /** POSTs to `element.parent`, shares response with the Rumour group and returns parsed JSON. */
     async _sendPost(edits) {
         this.__destroyRumour();
-        const body = JSON.stringify(edits);
-        const data = await this._fetch(this.parent, { body, method: 'POST' });
-        const rumour = NucleonElement.Rumour(this.group);
-        const related = [...this.related, this.parent];
-        rumour.share({ data, related, source: data._links.self.href });
-        this.__createRumour();
-        return data;
+        try {
+            const body = JSON.stringify(edits);
+            const postData = await this._fetch(this.parent, { body, method: 'POST' });
+            const data = await this._fetch(postData._links.self.href);
+            const rumour = NucleonElement.Rumour(this.group);
+            const related = [...this.related, this.parent];
+            rumour.share({ data, related, source: data._links.self.href });
+            return data;
+        }
+        finally {
+            this.__createRumour();
+        }
     }
     /** GETs `element.href`, shares response with the Rumour group and returns parsed JSON. */
     async _sendGet() {
         this.__destroyRumour();
-        const data = await this._fetch(this.href);
-        const rumour = NucleonElement.Rumour(this.group);
-        rumour.share({ data, source: this.href });
-        this.__createRumour();
-        return data;
+        try {
+            const data = await this._fetch(this.href);
+            NucleonElement.Rumour(this.group).share({ data, source: this.href });
+            return data;
+        }
+        finally {
+            this.__createRumour();
+        }
     }
     /** PATCHes `element.href`, shares response with the Rumour group and returns parsed JSON. */
     async _sendPatch(edits) {
         this.__destroyRumour();
-        const body = JSON.stringify(edits);
-        const data = await this._fetch(this.href, { body, method: 'PATCH' });
-        const rumour = NucleonElement.Rumour(this.group);
-        rumour.share({ data, source: this.href, related: this.related });
-        this.__createRumour();
-        return data;
+        try {
+            const body = JSON.stringify(edits);
+            const data = await this._fetch(this.href, { body, method: 'PATCH' });
+            const rumour = NucleonElement.Rumour(this.group);
+            rumour.share({ data, source: this.href, related: this.related });
+            return data;
+        }
+        finally {
+            this.__createRumour();
+        }
     }
     /** DELETEs `element.href`, shares response with the Rumour group and returns parsed JSON. */
     async _sendDelete() {
         this.__destroyRumour();
-        const data = await this._fetch(this.href, { method: 'DELETE' });
-        const rumour = NucleonElement.Rumour(this.group);
-        const related = [...this.related, this.parent];
-        rumour.share({ data: null, source: this.href, related });
-        this.__createRumour();
-        return data;
+        try {
+            await this._fetch(this.href, { method: 'DELETE' });
+            const rumour = NucleonElement.Rumour(this.group);
+            const related = [...this.related, this.parent];
+            rumour.share({ data: null, source: this.href, related });
+            return null;
+        }
+        finally {
+            this.__createRumour();
+        }
+    }
+    // this getter is used by LitElement to set the "state" attribute
+    get __state() {
+        const state = this.__service.state;
+        const flags = state.toStrings().reduce((p, c) => [...p, ...c.split('.')], []);
+        return [...new Set(flags)].join(' ');
     }
     __createService() {
         this.__service.onTransition(state => {
             if (!state.changed)
                 return;
-            const flags = state.toStrings().reduce((p, c) => [...p, ...c.split('.')], []);
-            this.setAttribute('state', [...new Set(flags)].join(' '));
             this.requestUpdate();
             this.dispatchEvent(new UpdateEvent());
             if (!state.matches('busy'))
@@ -286,9 +317,6 @@ export class NucleonElement extends InferrableMixin(LitElement) {
         });
         this.__service.start();
     }
-    __destroyService() {
-        this.__service.stop();
-    }
     __createRumour() {
         const rumour = NucleonElement.Rumour(this.group);
         this.__unsubscribeFromRumour = rumour.track(update => this.__handleRumourUpdate(update));

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

@@ -1 +1 @@
-{"version":3,"file":"NucleonElement.js","sourceRoot":"","sources":["../../../../src/elements/public/NucleonElement/NucleonElement.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComputedElementProperties, HALJSONResource, NucleonMachine, NucleonV8N } from './types';\nimport { LitElement, PropertyDeclarations } from 'lit-element';\nimport { Nucleon, Rumour } from '@foxy.io/sdk/core';\nimport { assign, interpret } from 'xstate';\n\nimport { API } from './API';\nimport { FetchEvent } from './FetchEvent';\nimport { UpdateEvent } from './UpdateEvent';\nimport memoize from 'lodash-es/memoize';\nimport { serveFromCache } from './serveFromCache';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\n/**\n * Base class for custom elements working with remote HAL+JSON resources.\n *\n * @fires NucleonElement#update - Instance of `NucleonElement.UpdateEvent`. Dispatched on an element whenever it changes its state.\n * @fires NucleonElement#fetch - Instance of `NucleonElement.API.FetchEvent`. Emitted before each API request.\n *\n * @element foxy-nucleon\n * @since 1.1.0\n */\nexport class NucleonElement<TData extends HALJSONResource> extends InferrableMixin(LitElement) {\n  /**\n   * Instances of this event are dispatched on an element whenever it changes its\n   * state (e.g. when going from `busy` to `idle` or on `form` data change).\n   * This event isn't cancelable, and it does not bubble.\n   * @readonly\n   */\n  static readonly UpdateEvent = UpdateEvent;\n\n  /**\n   * Creates a tagged [Rumour](https://sdk.foxy.dev/classes/_core_index_.rumour.html)\n   * instance if it doesn't exist or returns cached one otherwise. NucleonElements\n   * use empty Rumour group by default.\n   * @readonly\n   */\n  static readonly Rumour = memoize<(group: string) => Rumour>(() => new Rumour());\n\n  /**\n   * Universal [API](https://sdk.foxy.dev/classes/_core_index_.api.html) client\n   * that dispatches cancellable `FetchEvent` on an element before each request.\n   * @readonly\n   */\n  static readonly API = API;\n\n  static get inferredProperties(): string[] {\n    return [...super.inferredProperties, 'group', 'lang'];\n  }\n\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      related: { type: Array },\n      parent: { type: String },\n      group: { type: String, noAccessor: true },\n      href: { type: String, noAccessor: true },\n      lang: { type: String },\n    };\n  }\n\n  /**\n   * Array of validation functions. Each function accepts `element.form` and must return\n   * either an error code string if form data fails the check or `true` otherwise.\n   * Error codes are collected in `element.errors`. Empty by default.\n   */\n  static get v8n(): NucleonV8N<any> {\n    return [];\n  }\n\n  /**\n   * Optional ISO 639-1 code describing the language element content is written in.\n   * Changing the `lang` attribute will update the value of this property.\n   */\n  lang = '';\n\n  /**\n   * Optional URL of the collection this element's resource belongs to.\n   * Changing the `parent` attribute will update the value of this property.\n   */\n  parent = '';\n\n  /**\n   * Optional URI list of the related resources. If Rumour encounters a related\n   * resource on creation or deletion, it will be reloaded from source.\n   */\n  related: string[] = [];\n\n  private __href = '';\n\n  private __group = '';\n\n  private __unsubscribeFromRumour!: () => void;\n\n  private __fetchEventHandler!: (evt: Event) => void;\n\n  private __fetchEventQueue: FetchEvent[] = [];\n\n  private readonly __service = interpret(\n    (Nucleon.machine as NucleonMachine<TData>).withConfig({\n      services: {\n        sendDelete: () => this._sendDelete(),\n        sendPatch: ({ edits }) => this._sendPatch(edits!),\n        sendPost: ({ edits }) => this._sendPost(edits!),\n        sendGet: () => this._sendGet(),\n      },\n\n      actions: {\n        validate: assign<Nucleon.Context<TData, string>, Nucleon.Event<TData>>({\n          errors: context => {\n            const rules = (this.constructor as typeof NucleonElement).v8n;\n            const form = { ...context.data, ...context.edits };\n\n            return rules\n              .map(validate => validate(form))\n              .filter(v8nResult => typeof v8nResult === 'string')\n              .filter((err, errIndex, errs) => errs.indexOf(err) === errIndex) as string[];\n          },\n        }),\n      },\n    })\n  );\n\n  /**\n   * If network request returns non-2XX code, the entire error response\n   * will be available via this getter.\n   *\n   * This property is readonly. Changing failure records via this property is\n   * not guaranteed to work. NucleonElement does not provide a way to override error status.\n   *\n   * @since 1.4.0\n   */\n  get failure(): Response | null {\n    return this.__service.state.context.failure;\n  }\n\n  /**\n   * Array of validation errors returned from `NucleonElement.v8n` checks.\n   *\n   * This property is readonly. Adding or removing error codes via this property is\n   * not guaranteed to work. NucleonElement does not provide a way to override validity status.\n   */\n  get errors(): string[] {\n    return this.__service.state.context.errors;\n  }\n\n  /**\n   * Resource snapshot with edits applied. Empty object if unavailable.\n   *\n   * This property and its value are readonly. Assignments like `element.data.foo = 'bar'`\n   * are not guaranteed to work. Please use `element.edit({ foo: 'bar' })` instead.\n   * If you need to replace the entire data object, consider using `element.data`.\n   */\n  get form(): Partial<TData> {\n    const { data, edits } = this.__service.state.context;\n    return { ...data, ...edits } as Partial<TData>;\n  }\n\n  /**\n   * Resource snapshot as-is, no edits applied. Null if unavailable.\n   *\n   * Returned value is not reactive. Assignments like `element.data.foo = 'bar'`\n   * are not guaranteed to work. Please set the property instead: `element.data = { ...element.data, foo: 'bar' }`.\n   * If you're processing user input, consider using `element.form` and `element.edit()` instead.\n   */\n  get data(): TData | null {\n    return this.__service.state.context.data;\n  }\n\n  set data(data: TData | null) {\n    this.__service.send({ type: 'SET_DATA', data });\n    this.__href = data?._links.self.href ?? '';\n  }\n\n  /**\n   * Rumour group. Elements in different groups will not share updates. Empty by default.\n   * @example element.group = 'my-group'\n   */\n  get group(): string {\n    return this.__group;\n  }\n\n  set group(value: string) {\n    this.__group = value;\n    this.__destroyRumour();\n    this.__createRumour();\n  }\n\n  /**\n   * Optional URL of the resource to load. Switches element to `idle.template` state if empty (default).\n   * @example element.href = 'https://demo.foxycart.com/s/customer/attributes/0'\n   */\n  get href(): string {\n    return this.__href;\n  }\n\n  set href(value: string) {\n    this.__href = value;\n\n    if (value) {\n      this.__service.send({ type: 'FETCH' });\n    } else {\n      this.__service.send({ type: 'SET_DATA', data: null });\n    }\n  }\n\n  /**\n   * Checks if this element is in the given state.\n   * @example element.in({ idle: 'snapshot' })\n   */\n  in<TStateValue extends Nucleon.State<TData, string>['value']>(\n    stateValue: TStateValue\n  ): this is this & ComputedElementProperties<TData, TStateValue> {\n    return this.__service.state.matches(stateValue);\n  }\n\n  /**\n   * Clears all edits and emits the `update` event.\n   * @example element.undo()\n   */\n  undo(): void {\n    this.__service.send({ type: 'UNDO' });\n  }\n\n  /**\n   * Applies an edit to the local resource snapshot or its template and emits the `update` event.\n   * @example element.edit({ first_name: 'Alex' })\n   */\n  edit(data: Partial<TData>): void {\n    this.__service.send({ type: 'EDIT', data });\n  }\n\n  /**\n   * Submits the form, updating the resource if href isn't empty or creating it otherwise.\n   * Emits multiple `update` events as element state changes. Has no effect on invalid forms.\n   * @example element.submit()\n   */\n  submit(): void {\n    this.__service.send({ type: 'SUBMIT' });\n  }\n\n  /**\n   * Sends a DELETE request to `element.href` and clears local data on success.\n   * Emits multiple update events as element state changes.\n   * @example element.delete()\n   */\n  delete(): void {\n    this.__service.send({ type: 'DELETE' });\n  }\n\n  /**\n   * Fetches data from `element.href` in background, keeping the edits and v8n errors.\n   * @example element.refresh()\n   */\n  refresh(): void {\n    this.__service.send({ type: 'REFRESH' });\n  }\n\n  /** @readonly */\n  connectedCallback(): void {\n    super.connectedCallback();\n\n    this.__createService();\n    this.__createRumour();\n    this.__createServer();\n    this.__processFetchEventQueue();\n  }\n\n  /** @readonly */\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n\n    this.__destroyService();\n    this.__destroyRumour();\n    this.__destroyServer();\n    this.__flushFetchEventQueue('parent element was disconnected');\n  }\n\n  applyInferredProperties(context: Map<string, unknown>): void {\n    super.applyInferredProperties(context);\n\n    if (this.infer === null) return;\n\n    this.group = (context.get('group') as string | undefined) ?? '';\n    this.lang = (context.get('lang') as string | undefined) ?? '';\n  }\n\n  /** Sends API request. Throws an error on non-2XX response. */\n  protected async _fetch<TResult = TData>(...args: Parameters<Window['fetch']>): Promise<TResult> {\n    const response = await new API(this).fetch(...args);\n    if (!response.ok) throw response;\n    return response.json();\n  }\n\n  /** POSTs to `element.parent`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendPost(edits: Partial<TData>): Promise<TData> {\n    this.__destroyRumour();\n\n    const body = JSON.stringify(edits);\n    const data = await this._fetch(this.parent, { body, method: 'POST' });\n    const rumour = NucleonElement.Rumour(this.group);\n    const related = [...this.related, this.parent];\n\n    rumour.share({ data, related, source: data._links.self.href });\n    this.__createRumour();\n\n    return data;\n  }\n\n  /** GETs `element.href`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendGet(): Promise<TData> {\n    this.__destroyRumour();\n\n    const data = await this._fetch(this.href);\n    const rumour = NucleonElement.Rumour(this.group);\n\n    rumour.share({ data, source: this.href });\n    this.__createRumour();\n\n    return data;\n  }\n\n  /** PATCHes `element.href`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendPatch(edits: Partial<TData>): Promise<TData> {\n    this.__destroyRumour();\n\n    const body = JSON.stringify(edits);\n    const data = await this._fetch(this.href, { body, method: 'PATCH' });\n    const rumour = NucleonElement.Rumour(this.group);\n\n    rumour.share({ data, source: this.href, related: this.related });\n    this.__createRumour();\n\n    return data;\n  }\n\n  /** DELETEs `element.href`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendDelete(): Promise<TData> {\n    this.__destroyRumour();\n\n    const data = await this._fetch(this.href, { method: 'DELETE' });\n    const rumour = NucleonElement.Rumour(this.group);\n    const related = [...this.related, this.parent];\n\n    rumour.share({ data: null, source: this.href, related });\n    this.__createRumour();\n\n    return data;\n  }\n\n  private __createService() {\n    this.__service.onTransition(state => {\n      if (!state.changed) return;\n\n      const flags = state.toStrings().reduce((p, c) => [...p, ...c.split('.')], [] as string[]);\n      this.setAttribute('state', [...new Set(flags)].join(' '));\n\n      this.requestUpdate();\n      this.dispatchEvent(new UpdateEvent());\n\n      if (!state.matches('busy')) this.__processFetchEventQueue();\n    });\n\n    this.__service.onChange(() => {\n      this.requestUpdate();\n      this.dispatchEvent(new UpdateEvent());\n    });\n\n    this.__service.start();\n  }\n\n  private __destroyService() {\n    this.__service.stop();\n  }\n\n  private __createRumour() {\n    const rumour = NucleonElement.Rumour(this.group);\n    this.__unsubscribeFromRumour = rumour.track(update => this.__handleRumourUpdate(update));\n  }\n\n  private __destroyRumour() {\n    this.__unsubscribeFromRumour?.();\n  }\n\n  private __createServer() {\n    this.__fetchEventHandler = this.__handleFetchEvent.bind(this);\n    this.addEventListener('fetch', this.__fetchEventHandler);\n  }\n\n  private __destroyServer() {\n    this.removeEventListener('fetch', this.__fetchEventHandler);\n  }\n\n  private __handleRumourUpdate(update: (oldData: TData) => TData | null) {\n    try {\n      const oldData = this.__service.state?.context.data;\n      if (!oldData) return;\n\n      const newData = update(oldData);\n      if (newData !== oldData) this.__service.send({ data: newData, type: 'SET_DATA' });\n    } catch (err) {\n      if (err instanceof Rumour.UpdateError) {\n        this.__service.send({ type: 'REFRESH' });\n      } else {\n        throw err;\n      }\n    }\n  }\n\n  private __processFetchEventQueue() {\n    const api = new NucleonElement.API(this);\n\n    this.__fetchEventQueue.forEach(event => {\n      const request = event.request;\n      const cacheResponse = serveFromCache(request.url, this.data);\n      const whenResponseReady = cacheResponse.ok ? cacheResponse : api.fetch(request);\n\n      event.respondWith(Promise.resolve(whenResponseReady));\n\n      if (cacheResponse.ok) {\n        console.debug(\n          `%c@foxy.io/elements::${this.localName}\\n%c200%c GET ${request.url}`,\n          'color: gray',\n          `background: gray; padding: 0 .2em; border-radius: .2em; color: white;`,\n          ''\n        );\n      }\n    });\n\n    this.__fetchEventQueue = [];\n  }\n\n  private __flushFetchEventQueue(errorMessage: string) {\n    this.__fetchEventQueue.forEach(event => {\n      event.respondWith(Promise.reject(new Error(errorMessage)));\n    });\n\n    this.__fetchEventQueue = [];\n  }\n\n  private __handleFetchEvent(event: Event) {\n    if (!(event instanceof FetchEvent)) return;\n    if (event.defaultPrevented) return;\n    if (event.request.method !== 'GET') return;\n    if (event.request.url.startsWith('foxy://')) return;\n    if (event.composedPath()[0] === this) return;\n\n    event.preventDefault();\n    this.__fetchEventQueue.push(event);\n\n    if (!this.in('busy')) this.__processFetchEventQueue();\n  }\n}\n"]}
+{"version":3,"file":"NucleonElement.js","sourceRoot":"","sources":["../../../../src/elements/public/NucleonElement/NucleonElement.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAwC,MAAM,aAAa,CAAC;AACrF,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE3C,OAAO,EAAE,GAAG,EAAE,iBAAc;AAC5B,OAAO,EAAE,UAAU,EAAE,wBAAqB;AAC1C,OAAO,EAAE,WAAW,EAAE,yBAAsB;AAC5C,OAAO,OAAO,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,4BAAyB;AAClD,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAE7D;;;;;;;;GAQG;AACH,MAAM,OAAO,cAA8C,SAAQ,eAAe,CAAC,UAAU,CAAC;IAsG5F;QACE,KAAK,EAAE,CAAC;QAtDV;;;WAGG;QACH,SAAI,GAAG,EAAE,CAAC;QAEV;;;WAGG;QACH,WAAM,GAAG,EAAE,CAAC;QAEZ;;;WAGG;QACH,YAAO,GAAa,EAAE,CAAC;QAEf,iBAAY,GAAkB,IAAI,CAAC;QAEnC,YAAO,GAAG,EAAE,CAAC;QAMb,sBAAiB,GAAiB,EAAE,CAAC;QAE5B,cAAS,GAAG,SAAS,CACnC,OAAO,CAAC,OAAiC,CAAC,UAAU,CAAC;YACpD,QAAQ,EAAE;gBACR,UAAU,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;gBACpC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,KAAM,CAAC;gBACjD,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,KAAM,CAAC;gBAC/C,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE;aAC/B;YAED,OAAO,EAAE;gBACP,QAAQ,EAAE,MAAM,CAAuD;oBACrE,MAAM,EAAE,OAAO,CAAC,EAAE;wBAChB,MAAM,KAAK,GAAI,IAAI,CAAC,WAAqC,CAAC,GAAG,CAAC;wBAC9D,MAAM,IAAI,GAAG,EAAE,GAAG,OAAO,CAAC,IAAI,EAAE,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC;wBAEnD,OAAO,KAAK;6BACT,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;6BAC/B,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,OAAO,SAAS,KAAK,QAAQ,CAAC;6BAClD,MAAM,CAAC,CAAC,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,QAAQ,CAAa,CAAC;oBACjF,CAAC;iBACF,CAAC;aACH;SACF,CAAC,CACH,CAAC;QAIA,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAjFD,MAAM,KAAK,kBAAkB;QAC3B,OAAO,CAAC,GAAG,KAAK,CAAC,kBAAkB,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;IACxD,CAAC;IAED,gBAAgB;IAChB,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE;YAC5D,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACxB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE;YACzC,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE;YACxC,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACvB,CAAC;IACJ,CAAC;IAED;;;;OAIG;IACH,MAAM,KAAK,GAAG;QACZ,OAAO,EAAE,CAAC;IACZ,CAAC;IA4DD;;;;;;;;OAQG;IACH,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC;IAC9C,CAAC;IAED;;;;;OAKG;IACH,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;IAC7C,CAAC;IAED;;;;;;OAMG;IACH,IAAI,IAAI;QACN,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC;QACrD,OAAO,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,EAAoB,CAAC;IACjD,CAAC;IAED;;;;;;OAMG;IACH,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;IAC3C,CAAC;IAED,IAAI,IAAI,CAAC,IAAkB;QACzB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;QAChD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IAC3B,CAAC;IAED;;;OAGG;IACH,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,IAAI,KAAK,CAAC,KAAa;QACrB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED;;;OAGG;IACH,IAAI,IAAI;;QACN,yBAAO,IAAI,CAAC,IAAI,CAAC,MAAM,0CAAE,IAAI,CAAC,IAAI,mCAAI,IAAI,CAAC,YAAY,mCAAI,EAAE,CAAC;IAChE,CAAC;IAED,IAAI,IAAI,CAAC,KAAa;QACpB,IAAI,KAAK,EAAE;YACT,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;YAC1B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;SACxC;aAAM;YACL,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;SACvD;IACH,CAAC;IAED;;;OAGG;IACH,EAAE,CACA,UAAuB;QAEvB,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;IAClD,CAAC;IAED;;;OAGG;IACH,IAAI;QACF,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;IACxC,CAAC;IAED;;;OAGG;IACH,IAAI,CAAC,IAAoB;;QACvB,IAAI,cAAO,IAAI,CAAC,MAAM,0CAAE,IAAI,CAAC,IAAI,CAAA,KAAK,QAAQ;YAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QACzE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;IAC9C,CAAC;IAED;;;;OAIG;IACH,MAAM;QACJ,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC1C,CAAC;IAED;;;;OAIG;IACH,MAAM;QACJ,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;IAC1C,CAAC;IAED;;;OAGG;IACH,OAAO;QACL,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC;IAC3C,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;IAED,gBAAgB;IAChB,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,IAAI,CAAC,IAAI;YAAE,IAAI,CAAC,OAAO,EAAE,CAAC;QAE9B,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAEhC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,EAAE,CAAC,CAAC;IACxC,CAAC;IAED,gBAAgB;IAChB,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAE7B,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,sBAAsB,CAAC,iCAAiC,CAAC,CAAC;QAE/D,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,EAAE,CAAC,CAAC;IACxC,CAAC;IAED,uBAAuB,CAAC,OAA6B;;QACnD,KAAK,CAAC,uBAAuB,CAAC,OAAO,CAAC,CAAC;QAEvC,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI;YAAE,OAAO;QAEhC,IAAI,CAAC,KAAK,SAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAwB,mCAAI,EAAE,CAAC;QAChE,IAAI,CAAC,IAAI,SAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAwB,mCAAI,EAAE,CAAC;IAChE,CAAC;IAED,8DAA8D;IACpD,KAAK,CAAC,MAAM,CAAkB,GAAG,IAAiC;QAC1E,MAAM,QAAQ,GAAG,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;QACpD,IAAI,CAAC,QAAQ,CAAC,EAAE;YAAE,MAAM,QAAQ,CAAC;QACjC,OAAO,QAAQ,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAED,gGAAgG;IACtF,KAAK,CAAC,SAAS,CAAC,KAAqB;QAC7C,IAAI,CAAC,eAAe,EAAE,CAAC;QAEvB,IAAI;YACF,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;YACnC,MAAM,QAAQ,GAAG,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;YAC1E,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAE1D,MAAM,MAAM,GAAG,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACjD,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/C,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;YAE/D,OAAO,IAAI,CAAC;SACb;gBAAS;YACR,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB;IACH,CAAC;IAED,0FAA0F;IAChF,KAAK,CAAC,QAAQ;QACtB,IAAI,CAAC,eAAe,EAAE,CAAC;QAEvB,IAAI;YACF,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC1C,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;YACrE,OAAO,IAAI,CAAC;SACb;gBAAS;YACR,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB;IACH,CAAC;IAED,6FAA6F;IACnF,KAAK,CAAC,UAAU,CAAC,KAAqB;QAC9C,IAAI,CAAC,eAAe,EAAE,CAAC;QAEvB,IAAI;YACF,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;YACnC,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CAAC;YAErE,MAAM,MAAM,GAAG,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACjD,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;YAEjE,OAAO,IAAI,CAAC;SACb;gBAAS;YACR,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB;IACH,CAAC;IAED,6FAA6F;IACnF,KAAK,CAAC,WAAW;QACzB,IAAI,CAAC,eAAe,EAAE,CAAC;QAEvB,IAAI;YACF,MAAM,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC;YAEnD,MAAM,MAAM,GAAG,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACjD,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/C,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;YAEzD,OAAO,IAAI,CAAC;SACb;gBAAS;YACR,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB;IACH,CAAC;IAED,iEAAiE;IACjE,IAAY,OAAO;QACjB,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;QACnC,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAc,CAAC,CAAC;QAC1F,OAAO,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACvC,CAAC;IAEO,eAAe;QACrB,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE;YAClC,IAAI,CAAC,KAAK,CAAC,OAAO;gBAAE,OAAO;YAE3B,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,EAAE,CAAC,CAAC;YAEtC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;gBAAE,IAAI,CAAC,wBAAwB,EAAE,CAAC;QAC9D,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE;YAC3B,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,EAAE,CAAC,CAAC;QACxC,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;IACzB,CAAC;IAEO,cAAc;QACpB,MAAM,MAAM,GAAG,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACjD,IAAI,CAAC,uBAAuB,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC;IAC3F,CAAC;IAEO,eAAe;;QACrB,MAAA,IAAI,CAAC,uBAAuB,+CAA5B,IAAI,EAA6B;IACnC,CAAC;IAEO,cAAc;QACpB,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC9D,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAC3D,CAAC;IAEO,eAAe;QACrB,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAC9D,CAAC;IAEO,oBAAoB,CAAC,MAAwC;;QACnE,IAAI;YACF,MAAM,OAAO,SAAG,IAAI,CAAC,SAAS,CAAC,KAAK,0CAAE,OAAO,CAAC,IAAI,CAAC;YACnD,IAAI,CAAC,OAAO;gBAAE,OAAO;YAErB,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;YAChC,IAAI,OAAO,KAAK,OAAO;gBAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;SACnF;QAAC,OAAO,GAAG,EAAE;YACZ,IAAI,GAAG,YAAY,MAAM,CAAC,WAAW,EAAE;gBACrC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC;aAC1C;iBAAM;gBACL,MAAM,GAAG,CAAC;aACX;SACF;IACH,CAAC;IAEO,wBAAwB;QAC9B,MAAM,GAAG,GAAG,IAAI,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QAEzC,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACrC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;YAC9B,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;YAC7D,MAAM,iBAAiB,GAAG,aAAa,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YAEhF,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC;YAEtD,IAAI,aAAa,CAAC,EAAE,EAAE;gBACpB,OAAO,CAAC,KAAK,CACX,wBAAwB,IAAI,CAAC,SAAS,iBAAiB,OAAO,CAAC,GAAG,EAAE,EACpE,aAAa,EACb,uEAAuE,EACvE,EAAE,CACH,CAAC;aACH;QACH,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,iBAAiB,GAAG,EAAE,CAAC;IAC9B,CAAC;IAEO,sBAAsB,CAAC,YAAoB;QACjD,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACrC,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,iBAAiB,GAAG,EAAE,CAAC;IAC9B,CAAC;IAEO,kBAAkB,CAAC,KAAY;QACrC,IAAI,CAAC,CAAC,KAAK,YAAY,UAAU,CAAC;YAAE,OAAO;QAC3C,IAAI,KAAK,CAAC,gBAAgB;YAAE,OAAO;QACnC,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,KAAK;YAAE,OAAO;QAC3C,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,SAAS,CAAC;YAAE,OAAO;QACpD,IAAI,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,KAAK,IAAI;YAAE,OAAO;QAE7C,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAEnC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC;YAAE,IAAI,CAAC,wBAAwB,EAAE,CAAC;IACxD,CAAC;;AApcD;;;;;GAKG;AACa,0BAAW,GAAG,WAAW,CAAC;AAE1C;;;;;GAKG;AACa,qBAAM,GAAG,OAAO,CAA4B,GAAG,EAAE,CAAC,IAAI,MAAM,EAAE,CAAC,CAAC;AAEhF;;;;GAIG;AACa,kBAAG,GAAG,GAAG,CAAC","sourcesContent":["import { ComputedElementProperties, HALJSONResource, NucleonMachine, NucleonV8N } from './types';\nimport { html, LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';\nimport { Nucleon, Rumour } from '@foxy.io/sdk/core';\nimport { assign, interpret } from 'xstate';\n\nimport { API } from './API';\nimport { FetchEvent } from './FetchEvent';\nimport { UpdateEvent } from './UpdateEvent';\nimport memoize from 'lodash-es/memoize';\nimport { serveFromCache } from './serveFromCache';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\n/**\n * Base class for custom elements working with remote HAL+JSON resources.\n *\n * @fires NucleonElement#update - Instance of `NucleonElement.UpdateEvent`. Dispatched on an element whenever it changes its state.\n * @fires NucleonElement#fetch - Instance of `NucleonElement.API.FetchEvent`. Emitted before each API request.\n *\n * @element foxy-nucleon\n * @since 1.1.0\n */\nexport class NucleonElement<TData extends HALJSONResource> extends InferrableMixin(LitElement) {\n  /**\n   * Instances of this event are dispatched on an element whenever it changes its\n   * state (e.g. when going from `busy` to `idle` or on `form` data change).\n   * This event isn't cancelable, and it does not bubble.\n   * @readonly\n   */\n  static readonly UpdateEvent = UpdateEvent;\n\n  /**\n   * Creates a tagged [Rumour](https://sdk.foxy.dev/classes/_core_index_.rumour.html)\n   * instance if it doesn't exist or returns cached one otherwise. NucleonElements\n   * use empty Rumour group by default.\n   * @readonly\n   */\n  static readonly Rumour = memoize<(group: string) => Rumour>(() => new Rumour());\n\n  /**\n   * Universal [API](https://sdk.foxy.dev/classes/_core_index_.api.html) client\n   * that dispatches cancellable `FetchEvent` on an element before each request.\n   * @readonly\n   */\n  static readonly API = API;\n\n  static get inferredProperties(): string[] {\n    return [...super.inferredProperties, 'group', 'lang'];\n  }\n\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      __state: { type: String, reflect: true, attribute: 'state' },\n      related: { type: Array },\n      parent: { type: String },\n      group: { type: String, noAccessor: true },\n      href: { type: String, noAccessor: true },\n      lang: { type: String },\n    };\n  }\n\n  /**\n   * Array of validation functions. Each function accepts `element.form` and must return\n   * either an error code string if form data fails the check or `true` otherwise.\n   * Error codes are collected in `element.errors`. Empty by default.\n   */\n  static get v8n(): NucleonV8N<any> {\n    return [];\n  }\n\n  /**\n   * Optional ISO 639-1 code describing the language element content is written in.\n   * Changing the `lang` attribute will update the value of this property.\n   */\n  lang = '';\n\n  /**\n   * Optional URL of the collection this element's resource belongs to.\n   * Changing the `parent` attribute will update the value of this property.\n   */\n  parent = '';\n\n  /**\n   * Optional URI list of the related resources. If Rumour encounters a related\n   * resource on creation or deletion, it will be reloaded from source.\n   */\n  related: string[] = [];\n\n  private __hrefToLoad: string | null = null;\n\n  private __group = '';\n\n  private __unsubscribeFromRumour!: () => void;\n\n  private __fetchEventHandler!: (evt: Event) => void;\n\n  private __fetchEventQueue: FetchEvent[] = [];\n\n  private readonly __service = interpret(\n    (Nucleon.machine as NucleonMachine<TData>).withConfig({\n      services: {\n        sendDelete: () => this._sendDelete(),\n        sendPatch: ({ edits }) => this._sendPatch(edits!),\n        sendPost: ({ edits }) => this._sendPost(edits!),\n        sendGet: () => this._sendGet(),\n      },\n\n      actions: {\n        validate: assign<Nucleon.Context<TData, string>, Nucleon.Event<TData>>({\n          errors: context => {\n            const rules = (this.constructor as typeof NucleonElement).v8n;\n            const form = { ...context.data, ...context.edits };\n\n            return rules\n              .map(validate => validate(form))\n              .filter(v8nResult => typeof v8nResult === 'string')\n              .filter((err, errIndex, errs) => errs.indexOf(err) === errIndex) as string[];\n          },\n        }),\n      },\n    })\n  );\n\n  constructor() {\n    super();\n    this.__createService();\n  }\n\n  /**\n   * If network request returns non-2XX code, the entire error response\n   * will be available via this getter.\n   *\n   * This property is readonly. Changing failure records via this property is\n   * not guaranteed to work. NucleonElement does not provide a way to override error status.\n   *\n   * @since 1.4.0\n   */\n  get failure(): Response | null {\n    return this.__service.state.context.failure;\n  }\n\n  /**\n   * Array of validation errors returned from `NucleonElement.v8n` checks.\n   *\n   * This property is readonly. Adding or removing error codes via this property is\n   * not guaranteed to work. NucleonElement does not provide a way to override validity status.\n   */\n  get errors(): string[] {\n    return this.__service.state.context.errors;\n  }\n\n  /**\n   * Resource snapshot with edits applied. Empty object if unavailable.\n   *\n   * This property and its value are readonly. Assignments like `element.data.foo = 'bar'`\n   * are not guaranteed to work. Please use `element.edit({ foo: 'bar' })` instead.\n   * If you need to replace the entire data object, consider using `element.data`.\n   */\n  get form(): Partial<TData> {\n    const { data, edits } = this.__service.state.context;\n    return { ...data, ...edits } as Partial<TData>;\n  }\n\n  /**\n   * Resource snapshot as-is, no edits applied. Null if unavailable.\n   *\n   * Returned value is not reactive. Assignments like `element.data.foo = 'bar'`\n   * are not guaranteed to work. Please set the property instead: `element.data = { ...element.data, foo: 'bar' }`.\n   * If you're processing user input, consider using `element.form` and `element.edit()` instead.\n   */\n  get data(): TData | null {\n    return this.__service.state.context.data;\n  }\n\n  set data(data: TData | null) {\n    this.__service.send({ type: 'SET_DATA', data });\n    this.__hrefToLoad = null;\n  }\n\n  /**\n   * Rumour group. Elements in different groups will not share updates. Empty by default.\n   * @example element.group = 'my-group'\n   */\n  get group(): string {\n    return this.__group;\n  }\n\n  set group(value: string) {\n    this.__group = value;\n    this.__destroyRumour();\n    this.__createRumour();\n  }\n\n  /**\n   * Optional URL of the resource to load. Switches element to `idle.template` state if empty (default).\n   * @example element.href = 'https://demo.foxycart.com/s/customer/attributes/0'\n   */\n  get href(): string {\n    return this.form._links?.self.href ?? this.__hrefToLoad ?? '';\n  }\n\n  set href(value: string) {\n    if (value) {\n      this.__hrefToLoad = value;\n      this.__service.send({ type: 'FETCH' });\n    } else {\n      this.__hrefToLoad = null;\n      this.__service.send({ type: 'SET_DATA', data: null });\n    }\n  }\n\n  /**\n   * Checks if this element is in the given state.\n   * @example element.in({ idle: 'snapshot' })\n   */\n  in<TStateValue extends Nucleon.State<TData, string>['value']>(\n    stateValue: TStateValue\n  ): this is this & ComputedElementProperties<TData, TStateValue> {\n    return this.__service.state.matches(stateValue);\n  }\n\n  /**\n   * Clears all edits and emits the `update` event.\n   * @example element.undo()\n   */\n  undo(): void {\n    this.__service.send({ type: 'UNDO' });\n  }\n\n  /**\n   * Applies an edit to the local resource snapshot or its template and emits the `update` event.\n   * @example element.edit({ first_name: 'Alex' })\n   */\n  edit(data: Partial<TData>): void {\n    if (typeof data._links?.self.href === 'string') this.__hrefToLoad = null;\n    this.__service.send({ type: 'EDIT', data });\n  }\n\n  /**\n   * Submits the form, updating the resource if href isn't empty or creating it otherwise.\n   * Emits multiple `update` events as element state changes. Has no effect on invalid forms.\n   * @example element.submit()\n   */\n  submit(): void {\n    this.__service.send({ type: 'SUBMIT' });\n  }\n\n  /**\n   * Sends a DELETE request to `element.href` and clears local data on success.\n   * Emits multiple update events as element state changes.\n   * @example element.delete()\n   */\n  delete(): void {\n    this.__service.send({ type: 'DELETE' });\n  }\n\n  /**\n   * Fetches data from `element.href` in background, keeping the edits and v8n errors.\n   * @example element.refresh()\n   */\n  refresh(): void {\n    this.__service.send({ type: 'REFRESH' });\n  }\n\n  render(): TemplateResult {\n    return html`<slot></slot>`;\n  }\n\n  /** @readonly */\n  connectedCallback(): void {\n    super.connectedCallback();\n    if (this.href) this.refresh();\n\n    this.__createRumour();\n    this.__createServer();\n    this.__processFetchEventQueue();\n\n    this.dispatchEvent(new UpdateEvent());\n  }\n\n  /** @readonly */\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n\n    this.__destroyRumour();\n    this.__destroyServer();\n    this.__flushFetchEventQueue('parent element was disconnected');\n\n    this.dispatchEvent(new UpdateEvent());\n  }\n\n  applyInferredProperties(context: Map<string, unknown>): void {\n    super.applyInferredProperties(context);\n\n    if (this.infer === null) return;\n\n    this.group = (context.get('group') as string | undefined) ?? '';\n    this.lang = (context.get('lang') as string | undefined) ?? '';\n  }\n\n  /** Sends API request. Throws an error on non-2XX response. */\n  protected async _fetch<TResult = TData>(...args: Parameters<Window['fetch']>): Promise<TResult> {\n    const response = await new API(this).fetch(...args);\n    if (!response.ok) throw response;\n    return response.json();\n  }\n\n  /** POSTs to `element.parent`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendPost(edits: Partial<TData>): Promise<TData> {\n    this.__destroyRumour();\n\n    try {\n      const body = JSON.stringify(edits);\n      const postData = await this._fetch(this.parent, { body, method: 'POST' });\n      const data = await this._fetch(postData._links.self.href);\n\n      const rumour = NucleonElement.Rumour(this.group);\n      const related = [...this.related, this.parent];\n      rumour.share({ data, related, source: data._links.self.href });\n\n      return data;\n    } finally {\n      this.__createRumour();\n    }\n  }\n\n  /** GETs `element.href`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendGet(): Promise<TData> {\n    this.__destroyRumour();\n\n    try {\n      const data = await this._fetch(this.href);\n      NucleonElement.Rumour(this.group).share({ data, source: this.href });\n      return data;\n    } finally {\n      this.__createRumour();\n    }\n  }\n\n  /** PATCHes `element.href`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendPatch(edits: Partial<TData>): Promise<TData> {\n    this.__destroyRumour();\n\n    try {\n      const body = JSON.stringify(edits);\n      const data = await this._fetch(this.href, { body, method: 'PATCH' });\n\n      const rumour = NucleonElement.Rumour(this.group);\n      rumour.share({ data, source: this.href, related: this.related });\n\n      return data;\n    } finally {\n      this.__createRumour();\n    }\n  }\n\n  /** DELETEs `element.href`, shares response with the Rumour group and returns parsed JSON. */\n  protected async _sendDelete(): Promise<null> {\n    this.__destroyRumour();\n\n    try {\n      await this._fetch(this.href, { method: 'DELETE' });\n\n      const rumour = NucleonElement.Rumour(this.group);\n      const related = [...this.related, this.parent];\n      rumour.share({ data: null, source: this.href, related });\n\n      return null;\n    } finally {\n      this.__createRumour();\n    }\n  }\n\n  // this getter is used by LitElement to set the \"state\" attribute\n  private get __state(): string {\n    const state = this.__service.state;\n    const flags = state.toStrings().reduce((p, c) => [...p, ...c.split('.')], [] as string[]);\n    return [...new Set(flags)].join(' ');\n  }\n\n  private __createService() {\n    this.__service.onTransition(state => {\n      if (!state.changed) return;\n\n      this.requestUpdate();\n      this.dispatchEvent(new UpdateEvent());\n\n      if (!state.matches('busy')) this.__processFetchEventQueue();\n    });\n\n    this.__service.onChange(() => {\n      this.requestUpdate();\n      this.dispatchEvent(new UpdateEvent());\n    });\n\n    this.__service.start();\n  }\n\n  private __createRumour() {\n    const rumour = NucleonElement.Rumour(this.group);\n    this.__unsubscribeFromRumour = rumour.track(update => this.__handleRumourUpdate(update));\n  }\n\n  private __destroyRumour() {\n    this.__unsubscribeFromRumour?.();\n  }\n\n  private __createServer() {\n    this.__fetchEventHandler = this.__handleFetchEvent.bind(this);\n    this.addEventListener('fetch', this.__fetchEventHandler);\n  }\n\n  private __destroyServer() {\n    this.removeEventListener('fetch', this.__fetchEventHandler);\n  }\n\n  private __handleRumourUpdate(update: (oldData: TData) => TData | null) {\n    try {\n      const oldData = this.__service.state?.context.data;\n      if (!oldData) return;\n\n      const newData = update(oldData);\n      if (newData !== oldData) this.__service.send({ data: newData, type: 'SET_DATA' });\n    } catch (err) {\n      if (err instanceof Rumour.UpdateError) {\n        this.__service.send({ type: 'REFRESH' });\n      } else {\n        throw err;\n      }\n    }\n  }\n\n  private __processFetchEventQueue() {\n    const api = new NucleonElement.API(this);\n\n    this.__fetchEventQueue.forEach(event => {\n      const request = event.request;\n      const cacheResponse = serveFromCache(request.url, this.data);\n      const whenResponseReady = cacheResponse.ok ? cacheResponse : api.fetch(request);\n\n      event.respondWith(Promise.resolve(whenResponseReady));\n\n      if (cacheResponse.ok) {\n        console.debug(\n          `%c@foxy.io/elements::${this.localName}\\n%c200%c GET ${request.url}`,\n          'color: gray',\n          `background: gray; padding: 0 .2em; border-radius: .2em; color: white;`,\n          ''\n        );\n      }\n    });\n\n    this.__fetchEventQueue = [];\n  }\n\n  private __flushFetchEventQueue(errorMessage: string) {\n    this.__fetchEventQueue.forEach(event => {\n      event.respondWith(Promise.reject(new Error(errorMessage)));\n    });\n\n    this.__fetchEventQueue = [];\n  }\n\n  private __handleFetchEvent(event: Event) {\n    if (!(event instanceof FetchEvent)) return;\n    if (event.defaultPrevented) return;\n    if (event.request.method !== 'GET') return;\n    if (event.request.url.startsWith('foxy://')) return;\n    if (event.composedPath()[0] === this) return;\n\n    event.preventDefault();\n    this.__fetchEventQueue.push(event);\n\n    if (!this.in('busy')) this.__processFetchEventQueue();\n  }\n}\n"]}

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

@@ -24,7 +24,7 @@ export declare class PaymentMethodCard extends Base<Data> {
     private readonly __renderActionsDelete;
     private readonly __renderActions;
     render(): TemplateResult;
-    protected _sendDelete(): Promise<Data>;
+    protected _sendDelete(): Promise<null>;
     private __handleDelete;
     private __handleConfirmHide;
 }

package/dist/elements/public/PaymentMethodCard/PaymentMethodCard.js

@@ -160,10 +160,10 @@ export class PaymentMethodCard extends Base {
     }
     async _sendDelete() {
         const body = JSON.stringify({ save_cc: false });
-        const data = await this._fetch(this.href, { method: 'PATCH', body });
+        await this._fetch(this.href, { method: 'PATCH', body });
         const rumour = NucleonElement.Rumour(this.group);
         rumour.share({ data: null, source: this.href, related: [this.parent] });
-        return data;
+        return null;
     }
     __handleDelete(evt) {
         const confirm = this.renderRoot.querySelector('#confirm');

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

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethodCard.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentMethodCard/PaymentMethodCard.ts"],"names":[],"mappings":"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","sourcesContent":["import * as logos from './logos';\n\nimport { CSSResultArray, css } from 'lit-element';\nimport { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport { InternalConfirmDialog } from '../../internal/InternalConfirmDialog/InternalConfirmDialog';\nimport { NucleonElement } from '../NucleonElement/index';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { backgrounds } from './backgrounds';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'payment-method-card';\nconst Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/**\n * Basic card displaying a payment method.\n *\n * @slot actions:before - **new in v1.4.0**\n * @slot actions:after - **new in v1.4.0**\n * @slot actions:delete:before - **new in v1.4.0**\n * @slot actions:delete:after - **new in v1.4.0**\n *\n * @element foxy-payment-method-form\n * @since 1.2.0\n */\nexport class PaymentMethodCard extends Base<Data> {\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      backgrounds,\n      css`\n        .ratio-card {\n          padding-top: 63%;\n          position: relative;\n          height: 0;\n        }\n\n        .ratio-card > * {\n          position: absolute;\n          top: 0;\n          right: 0;\n          bottom: 0;\n          left: 0;\n        }\n      `,\n    ];\n  }\n\n  templates: Templates = {};\n\n  private readonly __renderActionsDelete = () => {\n    return html`\n      <div class=\"flex\">\n        ${this.renderTemplateOrSlot('actions:delete:before')}\n\n        <vaadin-button\n          class=\"px-xs rounded\"\n          theme=\"icon\"\n          style=\"--lumo-primary-text-color: #fff; --lumo-primary-color-50pct: rgba(255, 255, 255, 0.5); --lumo-contrast-5pct: rgba(255, 255, 255, 0.05)\"\n          aria-label=${this.t('delete').toString()}\n          data-testid=\"actions:delete\"\n          ?disabled=${this.disabledSelector.matches('actions:delete', true)}\n          @click=${this.__handleDelete}\n        >\n          <iron-icon icon=\"icons:delete\"></iron-icon>\n        </vaadin-button>\n\n        ${this.renderTemplateOrSlot('actions:delete:after')}\n      </div>\n    `;\n  };\n\n  private readonly __renderActions = () => {\n    return html`\n      <div class=\"flex\" data-testid=\"actions\">\n        ${this.renderTemplateOrSlot('actions:before')}\n        ${this.hiddenSelector.matches('actions:delete', true) ? '' : this.__renderActionsDelete()}\n        ${this.renderTemplateOrSlot('actions:after')}\n      </div>\n    `;\n  };\n\n  render(): TemplateResult {\n    const { data, lang, ns } = this;\n\n    if (this.in({ idle: 'template' }) || !data?.save_cc || !this.in('idle')) {\n      const spinnerState = this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty';\n\n      return html`\n        <div\n          class=\"ratio-card\"\n          aria-live=\"polite\"\n          aria-busy=${this.in('busy')}\n          data-testid=\"wrapper\"\n        >\n          <div class=\"h-full bg-contrast-5\"></div>\n          <div class=\"absolute inset-0 flex items-center justify-center\">\n            <foxy-spinner\n              data-testid=\"spinner\"\n              state=${spinnerState}\n              lang=${this.lang}\n              ns=\"${ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n            >\n            </foxy-spinner>\n          </div>\n        </div>\n      `;\n    }\n\n    const type = data!.cc_type?.toLowerCase() ?? 'unknown';\n    const logo = logos[type as keyof typeof logos] ?? logos.unknown;\n    const last4Digits = data!.cc_number_masked?.substring(data!.cc_number_masked.length - 4);\n\n    return html`\n      <foxy-internal-confirm-dialog\n        data-testid=\"confirm\"\n        message=\"delete_prompt\"\n        confirm=\"delete\"\n        cancel=\"cancel\"\n        header=\"delete\"\n        theme=\"primary error\"\n        lang=${lang}\n        ns=${ns}\n        id=\"confirm\"\n        @hide=${this.__handleConfirmHide}\n      >\n      </foxy-internal-confirm-dialog>\n\n      <div class=\"ratio-card\" data-testid=\"wrapper\" aria-busy=${this.in('busy')} aria-live=\"polite\">\n        <div\n          class=\"flex flex-col justify-between text-base text-m leading-m font-lumo p-m bg-unknown bg-${type}\"\n        >\n          <div\n            class=${classMap({\n              'flex items-start': true,\n              'justify-between': this.readonlyControls === BooleanSelector.False,\n              'justify-end': this.readonlyControls === BooleanSelector.True,\n            })}\n          >\n            ${this.hiddenSelector.matches('actions', true) ? '' : this.__renderActions()}\n            <div class=\"ml-auto rounded h-m\">${logo}</div>\n          </div>\n\n          <div class=\"font-tnum leading-none flex justify-between\">\n            <div data-testid=\"expiry\">\n              ${data!.cc_exp_month && data.cc_exp_year\n                ? html`\n                    <span class=\"sr-only\">${this.t('expires').toString()}&nbsp;</span>\n                    <span>${data!.cc_exp_month} / ${data!.cc_exp_year}</span>\n                  `\n                : ''}\n            </div>\n\n            <div data-testid=\"number\">\n              ${last4Digits\n                ? html`\n                    <span class=\"sr-only\">${this.t('last_4_digits').toString()}&nbsp;</span>\n                    <span aria-hidden=\"true\">••••</span>\n                    <span>${last4Digits}</span>\n                  `\n                : ''}\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  protected async _sendDelete(): Promise<Data> {\n    const body = JSON.stringify({ save_cc: false });\n    const data = await this._fetch(this.href, { method: 'PATCH', body });\n    const rumour = NucleonElement.Rumour(this.group);\n\n    rumour.share({ data: null, source: this.href, related: [this.parent] });\n    return data;\n  }\n\n  private __handleDelete(evt: Event) {\n    const confirm = this.renderRoot.querySelector('#confirm');\n    (confirm as InternalConfirmDialog).show(evt.currentTarget as HTMLElement);\n  }\n\n  private __handleConfirmHide(evt: DialogHideEvent) {\n    if (!evt.detail.cancelled) this.delete();\n  }\n}\n"]}
+{"version":3,"file":"PaymentMethodCard.js","sourceRoot":"","sources":["../../../../src/elements/public/PaymentMethodCard/PaymentMethodCard.ts"],"names":[],"mappings":"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","sourcesContent":["import * as logos from './logos';\n\nimport { CSSResultArray, css } from 'lit-element';\nimport { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport { InternalConfirmDialog } from '../../internal/InternalConfirmDialog/InternalConfirmDialog';\nimport { NucleonElement } from '../NucleonElement/index';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { backgrounds } from './backgrounds';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'payment-method-card';\nconst Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/**\n * Basic card displaying a payment method.\n *\n * @slot actions:before - **new in v1.4.0**\n * @slot actions:after - **new in v1.4.0**\n * @slot actions:delete:before - **new in v1.4.0**\n * @slot actions:delete:after - **new in v1.4.0**\n *\n * @element foxy-payment-method-form\n * @since 1.2.0\n */\nexport class PaymentMethodCard extends Base<Data> {\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      backgrounds,\n      css`\n        .ratio-card {\n          padding-top: 63%;\n          position: relative;\n          height: 0;\n        }\n\n        .ratio-card > * {\n          position: absolute;\n          top: 0;\n          right: 0;\n          bottom: 0;\n          left: 0;\n        }\n      `,\n    ];\n  }\n\n  templates: Templates = {};\n\n  private readonly __renderActionsDelete = () => {\n    return html`\n      <div class=\"flex\">\n        ${this.renderTemplateOrSlot('actions:delete:before')}\n\n        <vaadin-button\n          class=\"px-xs rounded\"\n          theme=\"icon\"\n          style=\"--lumo-primary-text-color: #fff; --lumo-primary-color-50pct: rgba(255, 255, 255, 0.5); --lumo-contrast-5pct: rgba(255, 255, 255, 0.05)\"\n          aria-label=${this.t('delete').toString()}\n          data-testid=\"actions:delete\"\n          ?disabled=${this.disabledSelector.matches('actions:delete', true)}\n          @click=${this.__handleDelete}\n        >\n          <iron-icon icon=\"icons:delete\"></iron-icon>\n        </vaadin-button>\n\n        ${this.renderTemplateOrSlot('actions:delete:after')}\n      </div>\n    `;\n  };\n\n  private readonly __renderActions = () => {\n    return html`\n      <div class=\"flex\" data-testid=\"actions\">\n        ${this.renderTemplateOrSlot('actions:before')}\n        ${this.hiddenSelector.matches('actions:delete', true) ? '' : this.__renderActionsDelete()}\n        ${this.renderTemplateOrSlot('actions:after')}\n      </div>\n    `;\n  };\n\n  render(): TemplateResult {\n    const { data, lang, ns } = this;\n\n    if (this.in({ idle: 'template' }) || !data?.save_cc || !this.in('idle')) {\n      const spinnerState = this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty';\n\n      return html`\n        <div\n          class=\"ratio-card\"\n          aria-live=\"polite\"\n          aria-busy=${this.in('busy')}\n          data-testid=\"wrapper\"\n        >\n          <div class=\"h-full bg-contrast-5\"></div>\n          <div class=\"absolute inset-0 flex items-center justify-center\">\n            <foxy-spinner\n              data-testid=\"spinner\"\n              state=${spinnerState}\n              lang=${this.lang}\n              ns=\"${ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n            >\n            </foxy-spinner>\n          </div>\n        </div>\n      `;\n    }\n\n    const type = data!.cc_type?.toLowerCase() ?? 'unknown';\n    const logo = logos[type as keyof typeof logos] ?? logos.unknown;\n    const last4Digits = data!.cc_number_masked?.substring(data!.cc_number_masked.length - 4);\n\n    return html`\n      <foxy-internal-confirm-dialog\n        data-testid=\"confirm\"\n        message=\"delete_prompt\"\n        confirm=\"delete\"\n        cancel=\"cancel\"\n        header=\"delete\"\n        theme=\"primary error\"\n        lang=${lang}\n        ns=${ns}\n        id=\"confirm\"\n        @hide=${this.__handleConfirmHide}\n      >\n      </foxy-internal-confirm-dialog>\n\n      <div class=\"ratio-card\" data-testid=\"wrapper\" aria-busy=${this.in('busy')} aria-live=\"polite\">\n        <div\n          class=\"flex flex-col justify-between text-base text-m leading-m font-lumo p-m bg-unknown bg-${type}\"\n        >\n          <div\n            class=${classMap({\n              'flex items-start': true,\n              'justify-between': this.readonlyControls === BooleanSelector.False,\n              'justify-end': this.readonlyControls === BooleanSelector.True,\n            })}\n          >\n            ${this.hiddenSelector.matches('actions', true) ? '' : this.__renderActions()}\n            <div class=\"ml-auto rounded h-m\">${logo}</div>\n          </div>\n\n          <div class=\"font-tnum leading-none flex justify-between\">\n            <div data-testid=\"expiry\">\n              ${data!.cc_exp_month && data.cc_exp_year\n                ? html`\n                    <span class=\"sr-only\">${this.t('expires').toString()}&nbsp;</span>\n                    <span>${data!.cc_exp_month} / ${data!.cc_exp_year}</span>\n                  `\n                : ''}\n            </div>\n\n            <div data-testid=\"number\">\n              ${last4Digits\n                ? html`\n                    <span class=\"sr-only\">${this.t('last_4_digits').toString()}&nbsp;</span>\n                    <span aria-hidden=\"true\">••••</span>\n                    <span>${last4Digits}</span>\n                  `\n                : ''}\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  protected async _sendDelete(): Promise<null> {\n    const body = JSON.stringify({ save_cc: false });\n    await this._fetch(this.href, { method: 'PATCH', body });\n    const rumour = NucleonElement.Rumour(this.group);\n\n    rumour.share({ data: null, source: this.href, related: [this.parent] });\n    return null;\n  }\n\n  private __handleDelete(evt: Event) {\n    const confirm = this.renderRoot.querySelector('#confirm');\n    (confirm as InternalConfirmDialog).show(evt.currentTarget as HTMLElement);\n  }\n\n  private __handleConfirmHide(evt: DialogHideEvent) {\n    if (!evt.detail.cancelled) this.delete();\n  }\n}\n"]}

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

@@ -0,0 +1,18 @@
+import type { PropertyDeclarations, TemplateResult } from 'lit-element';
+import { LitElement } from 'lit-element';
+export declare class PaymentsApi extends LitElement {
+    static get properties(): PropertyDeclarations;
+    paymentMethodSetHostedPaymentGatewaysUrl: string | null;
+    hostedPaymentGatewaysHelperUrl: string | null;
+    hostedPaymentGatewaysUrl: string | null;
+    paymentGatewaysHelperUrl: string | null;
+    paymentMethodSetsUrl: string | null;
+    fraudProtectionsUrl: string | null;
+    paymentGatewaysUrl: string | null;
+    private readonly __api;
+    private readonly __fetch;
+    private readonly __handleFetch;
+    connectedCallback(): void;
+    render(): TemplateResult;
+    disconnectedCallback(): void;
+}

package/dist/elements/public/PaymentsApi/PaymentsApi.js

@@ -0,0 +1,92 @@
+import { html, LitElement } from 'lit-element';
+import { FetchEvent } from "../NucleonElement/FetchEvent.js";
+import { getHandler } from "./api/index.js";
+import { API } from "../NucleonElement/API.js";
+export class PaymentsApi extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.paymentMethodSetHostedPaymentGatewaysUrl = null;
+        this.hostedPaymentGatewaysHelperUrl = null;
+        this.hostedPaymentGatewaysUrl = null;
+        this.paymentGatewaysHelperUrl = null;
+        this.paymentMethodSetsUrl = null;
+        this.fraudProtectionsUrl = null;
+        this.paymentGatewaysUrl = null;
+        this.__api = new API(this);
+        this.__fetch = this.__api.fetch.bind(this.__api);
+        this.__handleFetch = (evt) => {
+            if (!(evt instanceof FetchEvent))
+                return;
+            if (!evt.request.url.startsWith('https://foxy-payments-api.element/'))
+                return;
+            if (evt.defaultPrevented)
+                return;
+            const { paymentMethodSetHostedPaymentGatewaysUrl, hostedPaymentGatewaysHelperUrl, paymentGatewaysHelperUrl, hostedPaymentGatewaysUrl, paymentMethodSetsUrl, fraudProtectionsUrl, paymentGatewaysUrl, } = this;
+            if (paymentMethodSetHostedPaymentGatewaysUrl === null)
+                return;
+            if (hostedPaymentGatewaysHelperUrl === null)
+                return;
+            if (paymentGatewaysHelperUrl === null)
+                return;
+            if (hostedPaymentGatewaysUrl === null)
+                return;
+            if (paymentMethodSetsUrl === null)
+                return;
+            if (fraudProtectionsUrl === null)
+                return;
+            if (paymentGatewaysUrl === null)
+                return;
+            const createGetter = (link) => (id) => {
+                const url = new URL(link);
+                if (!url.pathname.endsWith('/'))
+                    url.pathname += '/';
+                url.pathname += id;
+                return url.toString();
+            };
+            const handler = getHandler({
+                hostedPaymentGatewaysHelperUrl,
+                paymentGatewaysHelperUrl,
+                hostedPaymentGatewaysUrl,
+                paymentMethodSetsUrl,
+                fraudProtectionsUrl,
+                paymentGatewaysUrl,
+                getPaymentMethodSetHostedPaymentGatewayUrl: createGetter(paymentMethodSetHostedPaymentGatewaysUrl),
+                getHostedPaymentGatewayUrl: createGetter(hostedPaymentGatewaysUrl),
+                getPaymentMethodSetUrl: createGetter(paymentMethodSetsUrl),
+                getFraudProtectionUrl: createGetter(fraudProtectionsUrl),
+                getPaymentGatewayUrl: createGetter(paymentGatewaysUrl),
+                request: evt.request,
+                fetch: this.__fetch,
+            });
+            if (handler) {
+                evt.preventDefault();
+                evt.respondWith(handler);
+            }
+        };
+    }
+    static get properties() {
+        return {
+            paymentMethodSetHostedPaymentGatewaysUrl: {
+                attribute: 'payment-method-set-hosted-payment-gateways-url',
+            },
+            hostedPaymentGatewaysHelperUrl: { attribute: 'hosted-payment-gateways-helper-url' },
+            hostedPaymentGatewaysUrl: { attribute: 'hosted-payment-gateways-url' },
+            paymentGatewaysHelperUrl: { attribute: 'payment-gateways-helper-url' },
+            paymentMethodSetsUrl: { attribute: 'payment-method-sets-url' },
+            fraudProtectionsUrl: { attribute: 'fraud-protections-url' },
+            paymentGatewaysUrl: { attribute: 'payment-gateways-url' },
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener('fetch', this.__handleFetch);
+    }
+    render() {
+        return html `<slot></slot>`;
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener('fetch', this.__handleFetch);
+    }
+}
+//# sourceMappingURL=PaymentsApi.js.map