@foxy.io/elements 1.15.0 → 1.16.0-beta.11

package/dist/elements/public/ReportsTable/ReportsTable.js

@@ -0,0 +1,101 @@
+import { Table } from "../Table/Table.js";
+import { TranslatableMixin } from "../../../mixins/translatable.js";
+/**
+ * Configurable table element for 'fx:reports' collection.
+ *
+ * @element foxy-reports-table
+ * @since 1.16.0
+ */
+export class ReportsTable extends TranslatableMixin(Table, 'reports-table') {
+    constructor() {
+        super(...arguments);
+        this.columns = [
+            ReportsTable.nameColumn,
+            ReportsTable.startColumn,
+            ReportsTable.endColumn,
+            ReportsTable.createdOnColumn,
+            ReportsTable.linkColumn,
+        ];
+    }
+}
+ReportsTable.nameColumn = {
+    header: ({ html, lang, ns }) => {
+        return html `<foxy-i18n lang=${lang} key="report_name" ns=${ns}></foxy-i18n>`;
+    },
+    cell: ({ html, data, lang, ns }) => {
+        const key = `report_name_${data.name}`;
+        return html `<foxy-i18n class="font-semibold" lang=${lang} key=${key} ns=${ns}></foxy-i18n>`;
+    },
+};
+ReportsTable.startColumn = {
+    hideBelow: 'md',
+    header: ({ html, lang, ns }) => {
+        return html `<foxy-i18n lang=${lang} key="range_start" ns=${ns}></foxy-i18n>`;
+    },
+    cell: ({ html, data, lang, ns }) => html `
+      <foxy-i18n
+        options=${JSON.stringify({ value: data.datetime_start })}
+        lang=${lang}
+        key="date"
+        ns=${ns}
+      >
+      </foxy-i18n>
+    `,
+};
+ReportsTable.endColumn = {
+    hideBelow: 'md',
+    header: ({ html, lang, ns }) => {
+        return html `<foxy-i18n lang=${lang} key="range_end" ns=${ns}></foxy-i18n>`;
+    },
+    cell: ({ html, data, lang, ns }) => html `
+      <foxy-i18n
+        options=${JSON.stringify({ value: data.datetime_end })}
+        lang=${lang}
+        key="date"
+        ns=${ns}
+      >
+      </foxy-i18n>
+    `,
+};
+ReportsTable.createdOnColumn = {
+    header: ({ html, lang, ns }) => {
+        return html `<foxy-i18n lang=${lang} key="created_on" ns=${ns}></foxy-i18n>`;
+    },
+    cell: ({ html, data, lang, ns }) => html `
+      <foxy-i18n
+        options=${JSON.stringify({ value: data.date_created })}
+        lang=${lang}
+        key="date"
+        ns=${ns}
+      >
+      </foxy-i18n>
+    `,
+};
+ReportsTable.linkColumn = {
+    header: ({ html, lang, ns }) => {
+        return html `<foxy-i18n lang=${lang} key="link" ns=${ns}></foxy-i18n>`;
+    },
+    cell: ({ html, lang, data, ns }) => {
+        if (data.status === 'ready') {
+            return html `
+          <a
+            class="rounded font-medium text-primary transition-opacity hover-opacity-75 focus-outline-none focus-ring-2 focus-ring-primary-50"
+            href=${data._links['fx:download_url'].href}
+            download
+          >
+            <foxy-i18n lang=${lang} key="download" ns=${ns}></foxy-i18n>
+          </a>
+        `;
+        }
+        return html `
+        <foxy-spinner
+          state=${data.status === 'error' ? 'error' : 'busy'}
+          class="inline-block align-middle"
+          lang=${lang}
+          ns="${ns} link-spinner"
+        >
+        </foxy-spinner>
+      `;
+    },
+};
+//# sourceMappingURL=ReportsTable.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ReportsTable.js","sourceRoot":"","sources":["../../../../src/elements/public/ReportsTable/ReportsTable.ts"],"names":[],"mappings":"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","sourcesContent":["import { Column } from '../Table/types';\nimport { Data } from './types';\nimport { Table } from '../Table/Table';\nimport { TranslatableMixin } from '../../../mixins/translatable';\n\n/**\n * Configurable table element for 'fx:reports' collection.\n *\n * @element foxy-reports-table\n * @since 1.16.0\n */\nexport class ReportsTable extends TranslatableMixin(Table, 'reports-table')<Data> {\n  static readonly nameColumn: Column<Data> = {\n    header: ({ html, lang, ns }) => {\n      return html`<foxy-i18n lang=${lang} key=\"report_name\" ns=${ns}></foxy-i18n>`;\n    },\n\n    cell: ({ html, data, lang, ns }) => {\n      const key = `report_name_${data.name}`;\n      return html`<foxy-i18n class=\"font-semibold\" lang=${lang} key=${key} ns=${ns}></foxy-i18n>`;\n    },\n  };\n\n  static readonly startColumn: Column<Data> = {\n    hideBelow: 'md',\n\n    header: ({ html, lang, ns }) => {\n      return html`<foxy-i18n lang=${lang} key=\"range_start\" ns=${ns}></foxy-i18n>`;\n    },\n\n    cell: ({ html, data, lang, ns }) => html`\n      <foxy-i18n\n        options=${JSON.stringify({ value: data.datetime_start })}\n        lang=${lang}\n        key=\"date\"\n        ns=${ns}\n      >\n      </foxy-i18n>\n    `,\n  };\n\n  static readonly endColumn: Column<Data> = {\n    hideBelow: 'md',\n\n    header: ({ html, lang, ns }) => {\n      return html`<foxy-i18n lang=${lang} key=\"range_end\" ns=${ns}></foxy-i18n>`;\n    },\n\n    cell: ({ html, data, lang, ns }) => html`\n      <foxy-i18n\n        options=${JSON.stringify({ value: data.datetime_end })}\n        lang=${lang}\n        key=\"date\"\n        ns=${ns}\n      >\n      </foxy-i18n>\n    `,\n  };\n\n  static readonly createdOnColumn: Column<Data> = {\n    header: ({ html, lang, ns }) => {\n      return html`<foxy-i18n lang=${lang} key=\"created_on\" ns=${ns}></foxy-i18n>`;\n    },\n\n    cell: ({ html, data, lang, ns }) => html`\n      <foxy-i18n\n        options=${JSON.stringify({ value: data.date_created })}\n        lang=${lang}\n        key=\"date\"\n        ns=${ns}\n      >\n      </foxy-i18n>\n    `,\n  };\n\n  static readonly linkColumn: Column<Data> = {\n    header: ({ html, lang, ns }) => {\n      return html`<foxy-i18n lang=${lang} key=\"link\" ns=${ns}></foxy-i18n>`;\n    },\n\n    cell: ({ html, lang, data, ns }) => {\n      if (data.status === 'ready') {\n        return html`\n          <a\n            class=\"rounded font-medium text-primary transition-opacity hover-opacity-75 focus-outline-none focus-ring-2 focus-ring-primary-50\"\n            href=${data._links['fx:download_url'].href}\n            download\n          >\n            <foxy-i18n lang=${lang} key=\"download\" ns=${ns}></foxy-i18n>\n          </a>\n        `;\n      }\n\n      return html`\n        <foxy-spinner\n          state=${data.status === 'error' ? 'error' : 'busy'}\n          class=\"inline-block align-middle\"\n          lang=${lang}\n          ns=\"${ns} link-spinner\"\n        >\n        </foxy-spinner>\n      `;\n    },\n  };\n\n  columns = [\n    ReportsTable.nameColumn,\n    ReportsTable.startColumn,\n    ReportsTable.endColumn,\n    ReportsTable.createdOnColumn,\n    ReportsTable.linkColumn,\n  ];\n}\n"]}

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

@@ -0,0 +1,4 @@
+import '../Spinner/index';
+import '../I18n/index';
+import { ReportsTable } from './ReportsTable';
+export { ReportsTable };

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

@@ -0,0 +1,6 @@
+import "../Spinner/index.js";
+import "../I18n/index.js";
+import { ReportsTable } from "./ReportsTable.js";
+customElements.define('foxy-reports-table', ReportsTable);
+export { ReportsTable };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/ReportsTable/index.ts"],"names":[],"mappings":"AAAA,6BAA0B;AAC1B,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 '../Spinner/index';\nimport '../I18n/index';\n\nimport { ReportsTable } from './ReportsTable';\n\ncustomElements.define('foxy-reports-table', ReportsTable);\n\nexport { ReportsTable };\n"]}

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

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/ReportsTable/types.ts"],"names":[],"mappings":"","sourcesContent":["import { Rels } from '@foxy.io/sdk/backend';\nimport { Resource } from '@foxy.io/sdk/core';\n\nexport type Data = Resource<Rels.Reports>;\n"]}

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

@@ -0,0 +1,22 @@
+import type { TemplateResult } from 'lit-html';
+import type { Data } from './types';
+import { BooleanSelector } from '@foxy.io/sdk/core';
+import { PropertyDeclarations } from 'lit-element';
+import { InternalCard } from '../../internal/InternalCard/InternalCard';
+declare const Base: typeof InternalCard & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
+export declare class ShipmentCard extends Base<Data> {
+    static get properties(): PropertyDeclarations;
+    __customerAddresses: string;
+    __currencyDisplay: string;
+    __itemCategories: string;
+    __editable: boolean;
+    __currency: string;
+    __coupons: string;
+    get hiddenSelector(): BooleanSelector;
+    get readonlySelector(): BooleanSelector;
+    renderBody(): TemplateResult;
+    protected _sendGet(): Promise<Data>;
+}
+export {};

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

@@ -0,0 +1,117 @@
+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";
+const NS = 'shipment-card';
+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 hiddenSelector() {
+        return new BooleanSelector(`${super.hiddenSelector.toString()} address:not=full-address`);
+    }
+    get readonlySelector() {
+        return this.__editable ? super.readonlySelector : BooleanSelector.True;
+    }
+    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
+        disabledcontrols=${dialog.disabledSelector.toString()}
+        readonlycontrols=${dialog.readonlySelector.toString()}
+        hiddencontrols=${dialog.hiddenSelector.toString()}
+        customer-addresses=${this.__customerAddresses}
+        item-categories=${this.__itemCategories}
+        coupons=${this.__coupons}
+        parent=${dialog.parent}
+        href=${dialog.href}
+        lang=${dialog.lang}
+        ns=${dialog.ns}
+        @fetch=${handleFetch}
+        @update=${handleUpdate}
+      >
+      </foxy-item-form>
+    `;
+        return html `
+      <div class="space-y-m">
+        <foxy-address-card
+          infer="address"
+          href=${ifDefined((_a = this.data) === null || _a === void 0 ? void 0 : _a._links['fx:customer_address'].href)}
+        >
+          <div slot="full-address:after" 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">
+              ${(_b = this.data) === null || _b === void 0 ? void 0 : _b.shipping_service_description} &bull;
+              <foxy-i18n
+                options=${JSON.stringify({
+            amount: `${(_c = this.data) === null || _c === void 0 ? void 0 : _c.total_shipping} ${this.__currency}`,
+            currencyDisplay: this.__currencyDisplay,
+        })}
+                key="price"
+                infer=""
+              >
+              </foxy-i18n>
+            </span>
+          </div>
+        </foxy-address-card>
+
+        <foxy-internal-async-details-control
+          infer="items"
+          first=${ifDefined(itemsLink)}
+          limit="5"
+          item="foxy-item-card"
+          open
+          .form=${itemFormRenderer}
+        >
+        </foxy-internal-async-details-control>
+      </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;
+    }
+}
+//# sourceMappingURL=ShipmentCard.js.map

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

@@ -0,0 +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\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 hiddenSelector(): BooleanSelector {\n    return new BooleanSelector(`${super.hiddenSelector.toString()} address:not=full-address`);\n  }\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        disabledcontrols=${dialog.disabledSelector.toString()}\n        readonlycontrols=${dialog.readonlySelector.toString()}\n        hiddencontrols=${dialog.hiddenSelector.toString()}\n        customer-addresses=${this.__customerAddresses}\n        item-categories=${this.__itemCategories}\n        coupons=${this.__coupons}\n        parent=${dialog.parent}\n        href=${dialog.href}\n        lang=${dialog.lang}\n        ns=${dialog.ns}\n        @fetch=${handleFetch}\n        @update=${handleUpdate}\n      >\n      </foxy-item-form>\n    `;\n\n    return html`\n      <div class=\"space-y-m\">\n        <foxy-address-card\n          infer=\"address\"\n          href=${ifDefined(this.data?._links['fx:customer_address'].href)}\n        >\n          <div slot=\"full-address:after\" 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\n                options=${JSON.stringify({\n                  amount: `${this.data?.total_shipping} ${this.__currency}`,\n                  currencyDisplay: this.__currencyDisplay,\n                })}\n                key=\"price\"\n                infer=\"\"\n              >\n              </foxy-i18n>\n            </span>\n          </div>\n        </foxy-address-card>\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"]}

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

@@ -0,0 +1,7 @@
+import '../AddressCard/index';
+import '../ItemForm/index';
+import '../ItemCard/index';
+import '../I18n/index';
+import '../../internal/InternalAsyncDetailsControl/index';
+import { ShipmentCard } from './ShipmentCard';
+export { ShipmentCard };

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

@@ -0,0 +1,9 @@
+import "../AddressCard/index.js";
+import "../ItemForm/index.js";
+import "../ItemCard/index.js";
+import "../I18n/index.js";
+import "../../internal/InternalAsyncDetailsControl/index.js";
+import { ShipmentCard } from "./ShipmentCard.js";
+customElements.define('foxy-shipment-card', ShipmentCard);
+export { ShipmentCard };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/ShipmentCard/index.ts"],"names":[],"mappings":"AAAA,iCAA8B;AAC9B,8BAA2B;AAC3B,8BAA2B;AAC3B,0BAAuB;AAEvB,6DAA0D;AAE1D,OAAO,EAAE,YAAY,EAAE,0BAAuB;AAE9C,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,YAAY,CAAC,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,CAAC","sourcesContent":["import '../AddressCard/index';\nimport '../ItemForm/index';\nimport '../ItemCard/index';\nimport '../I18n/index';\n\nimport '../../internal/InternalAsyncDetailsControl/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

@@ -0,0 +1,18 @@
+import type { Rels } from '@foxy.io/sdk/backend';
+import type { Resource } from '@foxy.io/sdk/core';
+export declare type Rel = Rels.Shipment & {
+    links: {
+        'fx:custom_fields': Rels.CustomFields;
+        'fx:attributes': Rels.Attributes;
+    };
+    zooms: {
+        custom_fields?: Rels.CustomFields;
+        attributes?: Rels.Attributes;
+        items?: Rels.Items;
+    };
+};
+export declare type Data = Resource<Rel, {
+    zoom: {
+        items: 'item_options';
+    };
+}>;

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

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

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

@@ -0,0 +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\n// TODO update when SDK types are corrected\nexport type Rel = Rels.Shipment & {\n  links: {\n    'fx:custom_fields': Rels.CustomFields;\n    'fx:attributes': Rels.Attributes;\n  };\n\n  zooms: {\n    custom_fields?: Rels.CustomFields;\n    attributes?: Rels.Attributes;\n    items?: Rels.Items;\n  };\n};\n\nexport type Data = Resource<Rel, { zoom: { items: 'item_options' } }>;\n"]}

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

@@ -1,12 +1,14 @@
 import { LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
 export declare type SpinnerLayout = 'vertical' | 'horizontal' | 'no-label';
 export declare type SpinnerState = 'end' | 'busy' | 'error' | 'empty' | 'paused';
-declare const Spinner_base: typeof LitElement & {
+declare const Base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & {
     styles: import("lit-element").CSSResultArray;
 } & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
 };
-export declare class Spinner extends Spinner_base {
+export declare class Spinner extends Base {
     /** @readonly */
     static get properties(): PropertyDeclarations;
     /**

package/dist/elements/public/Spinner/Spinner.js

@@ -1,7 +1,9 @@
 import { html, LitElement, svg } from 'lit-element';
+import { InferrableMixin } from "../../../mixins/inferrable.js";
 import { ThemeableMixin } from "../../../mixins/themeable.js";
 import { TranslatableMixin } from "../../../mixins/translatable.js";
-export class Spinner extends TranslatableMixin(ThemeableMixin(LitElement), 'spinner') {
+const Base = TranslatableMixin(ThemeableMixin(InferrableMixin(LitElement)), 'spinner');
+export class Spinner extends Base {
     constructor() {
         super(...arguments);
         /**

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

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../src/elements/public/Spinner/Spinner.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAwB,GAAG,EAAkB,MAAM,aAAa,CAAC;AAC1F,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AAKjE,MAAM,OAAO,OAAQ,SAAQ,iBAAiB,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,SAAS,CAAC;IAArF;;QAUE;;;WAGG;QACH,WAAM,GAAkB,YAAY,CAAC;QAErC;;;;;;;;WAQG;QACH,UAAK,GAAiB,MAAM,CAAC;IAwD/B,CAAC;IAhFC,gBAAgB;IAChB,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACxB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACxB,CAAC;IACJ,CAAC;IAmBD,gBAAgB;IAChB,MAAM;QACJ,IAAI,MAAc,CAAC;QACnB,IAAI,IAAoB,CAAC;QACzB,IAAI,IAAY,CAAC;QACjB,IAAI,IAAY,CAAC;QAEjB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE;YACxB,IAAI,GAAG,IAAI,CAAA,kEAAkE,CAAC;YAC9E,IAAI,GAAG,aAAa,CAAC;YACrB,IAAI,GAAG,eAAe,CAAC;SACxB;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE;YACjC,IAAI,GAAG,IAAI,CAAA,uEAAuE,CAAC;YACnF,IAAI,GAAG,eAAe,CAAC;YACvB,IAAI,GAAG,YAAY,CAAC;SACrB;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YAClC,IAAI,GAAG,IAAI,CAAA,oEAAoE,CAAC;YAChF,IAAI,GAAG,gBAAgB,CAAC;YACxB,IAAI,GAAG,eAAe,CAAC;SACxB;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE;YACjC,IAAI,GAAG,IAAI,CAAA,sEAAsE,CAAC;YAClF,IAAI,GAAG,eAAe,CAAC;YACvB,IAAI,GAAG,eAAe,CAAC;SACxB;aAAM;YACL,IAAI,GAAG,GAAG,CAAA;;;;OAIT,CAAC;YAEF,IAAI,GAAG,cAAc,CAAC;YACtB,IAAI,GAAG,eAAe,CAAC;SACxB;QAED,IAAI,IAAI,CAAC,MAAM,KAAK,YAAY,EAAE;YAChC,MAAM,GAAG,mCAAmC,CAAC;SAC9C;aAAM;YACL,MAAM,GAAG,sCAAsC,CAAC;SACjD;QAED,OAAO,IAAI,CAAA;kDACmC,MAAM,IAAI,IAAI;oEACI,IAAI;;;kBAGtD,IAAI,CAAC,MAAM,KAAK,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;iBAC5C,IAAI,CAAC,IAAI;gBACV,IAAI;eACL,IAAI,CAAC,EAAE;;;;KAIjB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { html, LitElement, PropertyDeclarations, svg, TemplateResult } from 'lit-element';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\n\nexport type SpinnerLayout = 'vertical' | 'horizontal' | 'no-label';\nexport type SpinnerState = 'end' | 'busy' | 'error' | 'empty' | 'paused';\n\nexport class Spinner extends TranslatableMixin(ThemeableMixin(LitElement), 'spinner') {\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      layout: { type: String },\n      state: { type: String },\n    };\n  }\n\n  /**\n   * Optional spinner layout: horizonal (default) or vertical. First puts icon next\n   * to the label, second puts it above the text.\n   */\n  layout: SpinnerLayout = 'horizontal';\n\n  /**\n   * Optional spinner state:\n   *\n   * - `busy` (default) for loading data;\n   * - `error` for failures;\n   * - `empty` for when there's no data;\n   * - `paused` for a pause or a timeout before fetching the next chunk of data;\n   * - `end` for when there's no more data;\n   */\n  state: SpinnerState = 'busy';\n\n  /** @readonly */\n  render(): TemplateResult {\n    let layout: string;\n    let icon: TemplateResult;\n    let text: string;\n    let tint: string;\n\n    if (this.state === 'end') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:done-all\"></iron-icon>`;\n      text = 'loading_end';\n      tint = 'text-tertiary';\n    } else if (this.state === 'error') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:error-outline\"></iron-icon>`;\n      text = 'loading_error';\n      tint = 'text-error';\n    } else if (this.state === 'paused') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:more-horiz\"></iron-icon>`;\n      text = 'loading_paused';\n      tint = 'text-tertiary';\n    } else if (this.state === 'empty') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:info-outline\"></iron-icon>`;\n      text = 'loading_empty';\n      tint = 'text-tertiary';\n    } else {\n      icon = svg`\n        <svg data-testid=\"icon\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 22 22\" preserveAspectRatio=\"xMidYMid\" class=\"animate-spin h-full w-full\">\n          <circle cx=\"11\" cy=\"11\" fill=\"none\" stroke=\"#e15b64\" stroke-width=\"2\" r=\"8\" stroke-dasharray=\"24 12\" class=\"stroke-current\"></circle>\n        </svg>\n      `;\n\n      text = 'loading_busy';\n      tint = 'text-tertiary';\n    }\n\n    if (this.layout === 'horizontal') {\n      layout = 'flex items-center space-x-s h-xxs';\n    } else {\n      layout = 'flex flex-col items-center space-y-s';\n    }\n\n    return html`\n      <div class=\"font-lumo leading-none text-s ${layout} ${tint}\">\n        <div class=\"w-xxs h-xss flex items-center justify-center\">${icon}</div>\n        <foxy-i18n\n          data-testid=\"text\"\n          class=${this.layout === 'no-label' ? 'sr-only' : ''}\n          lang=${this.lang}\n          key=${text}\n          ns=${this.ns}\n        >\n        </foxy-i18n>\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../src/elements/public/Spinner/Spinner.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAwB,GAAG,EAAkB,MAAM,aAAa,CAAC;AAC1F,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AAKjE,MAAM,IAAI,GAAG,iBAAiB,CAAC,cAAc,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;AAEvF,MAAM,OAAO,OAAQ,SAAQ,IAAI;IAAjC;;QAUE;;;WAGG;QACH,WAAM,GAAkB,YAAY,CAAC;QAErC;;;;;;;;WAQG;QACH,UAAK,GAAiB,MAAM,CAAC;IAwD/B,CAAC;IAhFC,gBAAgB;IAChB,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACxB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACxB,CAAC;IACJ,CAAC;IAmBD,gBAAgB;IAChB,MAAM;QACJ,IAAI,MAAc,CAAC;QACnB,IAAI,IAAoB,CAAC;QACzB,IAAI,IAAY,CAAC;QACjB,IAAI,IAAY,CAAC;QAEjB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE;YACxB,IAAI,GAAG,IAAI,CAAA,kEAAkE,CAAC;YAC9E,IAAI,GAAG,aAAa,CAAC;YACrB,IAAI,GAAG,eAAe,CAAC;SACxB;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE;YACjC,IAAI,GAAG,IAAI,CAAA,uEAAuE,CAAC;YACnF,IAAI,GAAG,eAAe,CAAC;YACvB,IAAI,GAAG,YAAY,CAAC;SACrB;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YAClC,IAAI,GAAG,IAAI,CAAA,oEAAoE,CAAC;YAChF,IAAI,GAAG,gBAAgB,CAAC;YACxB,IAAI,GAAG,eAAe,CAAC;SACxB;aAAM,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,EAAE;YACjC,IAAI,GAAG,IAAI,CAAA,sEAAsE,CAAC;YAClF,IAAI,GAAG,eAAe,CAAC;YACvB,IAAI,GAAG,eAAe,CAAC;SACxB;aAAM;YACL,IAAI,GAAG,GAAG,CAAA;;;;OAIT,CAAC;YAEF,IAAI,GAAG,cAAc,CAAC;YACtB,IAAI,GAAG,eAAe,CAAC;SACxB;QAED,IAAI,IAAI,CAAC,MAAM,KAAK,YAAY,EAAE;YAChC,MAAM,GAAG,mCAAmC,CAAC;SAC9C;aAAM;YACL,MAAM,GAAG,sCAAsC,CAAC;SACjD;QAED,OAAO,IAAI,CAAA;kDACmC,MAAM,IAAI,IAAI;oEACI,IAAI;;;kBAGtD,IAAI,CAAC,MAAM,KAAK,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;iBAC5C,IAAI,CAAC,IAAI;gBACV,IAAI;eACL,IAAI,CAAC,EAAE;;;;KAIjB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { html, LitElement, PropertyDeclarations, svg, TemplateResult } from 'lit-element';\nimport { InferrableMixin } from '../../../mixins/inferrable';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\n\nexport type SpinnerLayout = 'vertical' | 'horizontal' | 'no-label';\nexport type SpinnerState = 'end' | 'busy' | 'error' | 'empty' | 'paused';\n\nconst Base = TranslatableMixin(ThemeableMixin(InferrableMixin(LitElement)), 'spinner');\n\nexport class Spinner extends Base {\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      layout: { type: String },\n      state: { type: String },\n    };\n  }\n\n  /**\n   * Optional spinner layout: horizonal (default) or vertical. First puts icon next\n   * to the label, second puts it above the text.\n   */\n  layout: SpinnerLayout = 'horizontal';\n\n  /**\n   * Optional spinner state:\n   *\n   * - `busy` (default) for loading data;\n   * - `error` for failures;\n   * - `empty` for when there's no data;\n   * - `paused` for a pause or a timeout before fetching the next chunk of data;\n   * - `end` for when there's no more data;\n   */\n  state: SpinnerState = 'busy';\n\n  /** @readonly */\n  render(): TemplateResult {\n    let layout: string;\n    let icon: TemplateResult;\n    let text: string;\n    let tint: string;\n\n    if (this.state === 'end') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:done-all\"></iron-icon>`;\n      text = 'loading_end';\n      tint = 'text-tertiary';\n    } else if (this.state === 'error') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:error-outline\"></iron-icon>`;\n      text = 'loading_error';\n      tint = 'text-error';\n    } else if (this.state === 'paused') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:more-horiz\"></iron-icon>`;\n      text = 'loading_paused';\n      tint = 'text-tertiary';\n    } else if (this.state === 'empty') {\n      icon = html`<iron-icon data-testid=\"icon\" icon=\"icons:info-outline\"></iron-icon>`;\n      text = 'loading_empty';\n      tint = 'text-tertiary';\n    } else {\n      icon = svg`\n        <svg data-testid=\"icon\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 22 22\" preserveAspectRatio=\"xMidYMid\" class=\"animate-spin h-full w-full\">\n          <circle cx=\"11\" cy=\"11\" fill=\"none\" stroke=\"#e15b64\" stroke-width=\"2\" r=\"8\" stroke-dasharray=\"24 12\" class=\"stroke-current\"></circle>\n        </svg>\n      `;\n\n      text = 'loading_busy';\n      tint = 'text-tertiary';\n    }\n\n    if (this.layout === 'horizontal') {\n      layout = 'flex items-center space-x-s h-xxs';\n    } else {\n      layout = 'flex flex-col items-center space-y-s';\n    }\n\n    return html`\n      <div class=\"font-lumo leading-none text-s ${layout} ${tint}\">\n        <div class=\"w-xxs h-xss flex items-center justify-center\">${icon}</div>\n        <foxy-i18n\n          data-testid=\"text\"\n          class=${this.layout === 'no-label' ? 'sr-only' : ''}\n          lang=${this.lang}\n          key=${text}\n          ns=${this.ns}\n        >\n        </foxy-i18n>\n      </div>\n    `;\n  }\n}\n"]}

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

@@ -0,0 +1,13 @@
+import { CSSResult, LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
+export declare class SwipeActions extends LitElement {
+    static get properties(): PropertyDeclarations;
+    static get styles(): CSSResult;
+    private __state;
+    private __scrollTimeout;
+    render(): TemplateResult;
+    private get __scroll();
+    private get __content();
+    private __closeActions;
+    private __handleScroll;
+    private __handleMouseMove;
+}

package/dist/elements/public/SwipeActions/SwipeActions.js

@@ -0,0 +1,116 @@
+import { LitElement, css, html, } from 'lit-element';
+export class SwipeActions extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.__state = 'idle';
+        this.__scrollTimeout = null;
+    }
+    static get properties() {
+        return {
+            __state: { attribute: false },
+        };
+    }
+    static get styles() {
+        return css `#root{
+  display:block;
+  overflow:hidden;
+}
+
+#scroll{
+  --internal-scrollbar-height:var(--scrollbar-height, 24px);
+  padding-bottom:var(--internal-scrollbar-height);
+  margin-top:calc(0px - var(--internal-scrollbar-height));
+  transform:translateY(var(--internal-scrollbar-height));
+  overflow:auto hidden;
+  white-space:nowrap;
+  scroll-snap-type:x mandatory;
+  display:flex;
+}
+
+#content{
+  scroll-snap-align:start;
+  width:100%;
+  flex-shrink:0;
+}
+
+#content-transform-target{
+  transition:transform 0.15s ease;
+}
+
+.idle-preview #content-transform-target{
+  transform:translateX(calc(0px - var(--lumo-space-s)));
+}
+
+#action{
+  scroll-snap-align:end;
+  flex-shrink:0;
+}
+    `;
+    }
+    render() {
+        return html `
+      <div
+        class=${this.__state}
+        id="root"
+        @mouseleave=${() => this.__closeActions('smooth')}
+        @mousemove=${this.__handleMouseMove}
+        @focusout=${() => this.__closeActions('auto')}
+      >
+        <div id="scroll" @scroll=${this.__handleScroll}>
+          <div id="content">
+            <div id="content-transform-target">
+              <slot></slot>
+            </div>
+          </div>
+          <div id="action">
+            <slot name="action"></slot>
+          </div>
+        </div>
+      </div>
+    `;
+    }
+    get __scroll() {
+        return this.renderRoot.querySelector('#scroll');
+    }
+    get __content() {
+        return this.renderRoot.querySelector('#content');
+    }
+    __closeActions(behavior) {
+        if (this.__scrollTimeout !== null)
+            clearTimeout(this.__scrollTimeout);
+        this.__scroll.scroll({
+            top: 0,
+            left: 0,
+            behavior,
+        });
+        this.__state = 'idle';
+    }
+    __handleScroll() {
+        const { scrollLeft, scrollWidth, clientWidth } = this.__scroll;
+        if (scrollLeft <= 0) {
+            this.__state = 'idle';
+        }
+        else if (scrollWidth - scrollLeft - clientWidth <= 0) {
+            this.__state = 'scrolled';
+        }
+    }
+    __handleMouseMove(evt) {
+        if (!this.__state.startsWith('idle'))
+            return;
+        if (this.__scrollTimeout !== null)
+            clearTimeout(this.__scrollTimeout);
+        const ratio = evt.offsetX / this.__scroll.clientWidth;
+        if (ratio >= 0.9) {
+            this.__state = 'idle-preview';
+            this.__scrollTimeout = setTimeout(() => {
+                this.__state = 'scroll-started';
+                this.__scroll.scroll({
+                    top: 0,
+                    left: this.__content.clientWidth,
+                    behavior: 'smooth',
+                });
+            }, 75);
+        }
+    }
+}
+//# sourceMappingURL=SwipeActions.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SwipeActions.js","sourceRoot":"","sources":["../../../../src/elements/public/SwipeActions/SwipeActions.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EAGV,GAAG,EACH,IAAI,GACL,MAAM,aAAa,CAAC;AAErB,MAAM,OAAO,YAAa,SAAQ,UAAU;IAA5C;;QA+CU,YAAO,GAA4D,MAAM,CAAC;QAE1E,oBAAe,GAA0B,IAAI,CAAC;IAyExD,CAAC;IAzHC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,OAAO,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAC9B,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoCT,CAAC;IACJ,CAAC;IAMD,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,IAAI,CAAC,OAAO;;sBAEN,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC;qBACpC,IAAI,CAAC,iBAAiB;oBACvB,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC;;mCAElB,IAAI,CAAC,cAAc;;;;;;;;;;;KAWjD,CAAC;IACJ,CAAC;IAED,IAAY,QAAQ;QAClB,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAgB,CAAC;IACjE,CAAC;IAED,IAAY,SAAS;QACnB,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAAgB,CAAC;IAClE,CAAC;IAEO,cAAc,CAAC,QAA4B;QACjD,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI;YAAE,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QAEtE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;YACnB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,QAAQ;SACT,CAAC,CAAC;QAEH,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;IACxB,CAAC;IAEO,cAAc;QACpB,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC;QAE/D,IAAI,UAAU,IAAI,CAAC,EAAE;YACnB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;SACvB;aAAM,IAAI,WAAW,GAAG,UAAU,GAAG,WAAW,IAAI,CAAC,EAAE;YACtD,IAAI,CAAC,OAAO,GAAG,UAAU,CAAC;SAC3B;IACH,CAAC;IAEO,iBAAiB,CAAC,GAAe;QACvC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,MAAM,CAAC;YAAE,OAAO;QAE7C,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI;YAAE,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QACtE,MAAM,KAAK,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC;QAEtD,IAAI,KAAK,IAAI,GAAG,EAAE;YAChB,IAAI,CAAC,OAAO,GAAG,cAAc,CAAC;YAC9B,IAAI,CAAC,eAAe,GAAG,UAAU,CAAC,GAAG,EAAE;gBACrC,IAAI,CAAC,OAAO,GAAG,gBAAgB,CAAC;gBAChC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;oBACnB,GAAG,EAAE,CAAC;oBACN,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,WAAW;oBAChC,QAAQ,EAAE,QAAQ;iBACnB,CAAC,CAAC;YACL,CAAC,EAAE,EAAE,CAAC,CAAC;SACR;IACH,CAAC;CACF","sourcesContent":["import {\n  CSSResult,\n  LitElement,\n  PropertyDeclarations,\n  TemplateResult,\n  css,\n  html,\n} from 'lit-element';\n\nexport class SwipeActions extends LitElement {\n  static get properties(): PropertyDeclarations {\n    return {\n      __state: { attribute: false },\n    };\n  }\n\n  static get styles(): CSSResult {\n    return css`\n      #root {\n        display: block;\n        overflow: hidden;\n      }\n\n      #scroll {\n        --internal-scrollbar-height: var(--scrollbar-height, 24px);\n\n        padding-bottom: var(--internal-scrollbar-height);\n        margin-top: calc(0px - var(--internal-scrollbar-height));\n        transform: translateY(var(--internal-scrollbar-height));\n        overflow: auto hidden;\n        white-space: nowrap;\n        scroll-snap-type: x mandatory;\n        display: flex;\n      }\n\n      #content {\n        scroll-snap-align: start;\n        width: 100%;\n        flex-shrink: 0;\n      }\n\n      #content-transform-target {\n        transition: transform 0.15s ease;\n      }\n\n      .idle-preview #content-transform-target {\n        transform: translateX(calc(0px - var(--lumo-space-s)));\n      }\n\n      #action {\n        scroll-snap-align: end;\n        flex-shrink: 0;\n      }\n    `;\n  }\n\n  private __state: 'idle' | 'idle-preview' | 'scroll-started' | 'scrolled' = 'idle';\n\n  private __scrollTimeout: NodeJS.Timeout | null = null;\n\n  render(): TemplateResult {\n    return html`\n      <div\n        class=${this.__state}\n        id=\"root\"\n        @mouseleave=${() => this.__closeActions('smooth')}\n        @mousemove=${this.__handleMouseMove}\n        @focusout=${() => this.__closeActions('auto')}\n      >\n        <div id=\"scroll\" @scroll=${this.__handleScroll}>\n          <div id=\"content\">\n            <div id=\"content-transform-target\">\n              <slot></slot>\n            </div>\n          </div>\n          <div id=\"action\">\n            <slot name=\"action\"></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private get __scroll() {\n    return this.renderRoot.querySelector('#scroll') as HTMLElement;\n  }\n\n  private get __content() {\n    return this.renderRoot.querySelector('#content') as HTMLElement;\n  }\n\n  private __closeActions(behavior?: 'auto' | 'smooth'): void {\n    if (this.__scrollTimeout !== null) clearTimeout(this.__scrollTimeout);\n\n    this.__scroll.scroll({\n      top: 0,\n      left: 0,\n      behavior,\n    });\n\n    this.__state = 'idle';\n  }\n\n  private __handleScroll() {\n    const { scrollLeft, scrollWidth, clientWidth } = this.__scroll;\n\n    if (scrollLeft <= 0) {\n      this.__state = 'idle';\n    } else if (scrollWidth - scrollLeft - clientWidth <= 0) {\n      this.__state = 'scrolled';\n    }\n  }\n\n  private __handleMouseMove(evt: MouseEvent) {\n    if (!this.__state.startsWith('idle')) return;\n\n    if (this.__scrollTimeout !== null) clearTimeout(this.__scrollTimeout);\n    const ratio = evt.offsetX / this.__scroll.clientWidth;\n\n    if (ratio >= 0.9) {\n      this.__state = 'idle-preview';\n      this.__scrollTimeout = setTimeout(() => {\n        this.__state = 'scroll-started';\n        this.__scroll.scroll({\n          top: 0,\n          left: this.__content.clientWidth,\n          behavior: 'smooth',\n        });\n      }, 75);\n    }\n  }\n}\n"]}

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

@@ -0,0 +1,2 @@
+import { SwipeActions } from './SwipeActions';
+export { SwipeActions };

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

@@ -0,0 +1,4 @@
+import { SwipeActions } from "./SwipeActions.js";
+customElements.define('foxy-swipe-actions', SwipeActions);
+export { SwipeActions };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/SwipeActions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,0BAAuB;AAE9C,cAAc,CAAC,MAAM,CAAC,oBAAoB,EAAE,YAAY,CAAC,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,CAAC","sourcesContent":["import { SwipeActions } from './SwipeActions';\n\ncustomElements.define('foxy-swipe-actions', SwipeActions);\n\nexport { SwipeActions };\n"]}

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

@@ -0,0 +1,13 @@
+import type { CSSResultArray, TemplateResult } from 'lit-element';
+import type { Data } from './types';
+import { InternalForm } from '../../internal/InternalForm/InternalForm';
+import { BooleanSelector } from '@foxy.io/sdk/core';
+declare const Transaction_base: typeof InternalForm & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+};
+export declare class Transaction extends Transaction_base<Data> {
+    static get styles(): CSSResultArray;
+    get readonlySelector(): BooleanSelector;
+    renderBody(): TemplateResult;
+}
+export {};