@foxy.io/elements 1.15.0-beta.8 → 1.16.0-beta.2

package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.js

@@ -4,9 +4,8 @@ import { ConfigurableMixin } from "../../../../mixins/configurable.js";
 import { NucleonElement } from "../../NucleonElement/NucleonElement.js";
 import { ScopedElementsMixin } from '@open-wc/scoped-elements';
 import { ThemeableMixin } from "../../../../mixins/themeable.js";
-import { TranslatableMixin } from "../../../../mixins/translatable.js";
 import { ifDefined } from 'lit-html/directives/if-defined';
-const Base = ConfigurableMixin(ScopedElementsMixin(ThemeableMixin(TranslatableMixin(NucleonElement))));
+const Base = ConfigurableMixin(ScopedElementsMixin(ThemeableMixin(NucleonElement)));
 export class CategoryRestrictionsPageItem extends Base {
     constructor() {
         super(...arguments);
@@ -34,13 +33,12 @@ export class CategoryRestrictionsPageItem extends Base {
         return html `
       <x-category-restrictions-page-item-content
         item-category=${this.itemCategory}
+        data-testid="content"
         gift-card=${this.giftCard}
         parent=${ifDefined(parent)}
         class="h-full"
         group=${this.group}
         href=${ifDefined(href)}
-        lang=${this.lang}
-        ns=${this.ns}
         ?disabled=${!this.in('idle') || this.disabled}
         ?readonly=${this.readonly}
       >

package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoryRestrictionsPageItem.js","sourceRoot":"","sources":["../../../../../src/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,mCAAmC,EAAE,iDAA8C;AAC5F,OAAO,EAAE,iBAAiB,EAAE,2CAAwC;AACpE,OAAO,EAAE,cAAc,EAAE,+CAA4C;AAKrE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,wCAAqC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,2CAAwC;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAG3D,MAAM,IAAI,GAAG,iBAAiB,CAC5B,mBAAmB,CAAC,cAAc,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC,CAAC,CACvE,CAAC;AAEF,MAAM,OAAO,4BAA6B,SAAQ,IAAU;IAA5D;;QAgBE,iBAAY,GAAG,EAAE,CAAC;QAElB,aAAQ,GAAG,EAAE,CAAC;IAwBhB,CAAC;IAzCC,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,cAAc,EAAE,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC;YAClD,2CAA2C,EAAE,mCAAmC;SACjF,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,YAAY,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE;YAC1D,QAAQ,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE;SACnD,CAAC;IACJ,CAAC;IAMD,MAAM;;QACJ,MAAM,QAAQ,SAAG,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,8BAA8B,EAAE,CAAC,CAAC,CAAC;QACzE,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAChD,MAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QAE9D,OAAO,IAAI,CAAA;;wBAES,IAAI,CAAC,YAAY;oBACrB,IAAI,CAAC,QAAQ;iBAChB,SAAS,CAAC,MAAM,CAAC;;gBAElB,IAAI,CAAC,KAAK;eACX,SAAS,CAAC,IAAI,CAAC;eACf,IAAI,CAAC,IAAI;aACX,IAAI,CAAC,EAAE;oBACA,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ;oBACjC,IAAI,CAAC,QAAQ;;;;KAI5B,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { TemplateResult, html } from 'lit-html';\n\nimport { CategoryRestrictionsPageItemContent } from './CategoryRestrictionsPageItemContent';\nimport { ConfigurableMixin } from '../../../../mixins/configurable';\nimport { NucleonElement } from '../../NucleonElement/NucleonElement';\nimport { PropertyDeclarations } from 'lit-element';\nimport { Rels } from '@foxy.io/sdk/backend';\nimport { Resource } from '@foxy.io/sdk/core';\nimport { ScopedElementsMap } from '@open-wc/scoped-elements/src/types';\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { ThemeableMixin } from '../../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../../mixins/translatable';\nimport { ifDefined } from 'lit-html/directives/if-defined';\n\ntype Data = Resource<Rels.GiftCardItemCategories>;\nconst Base = ConfigurableMixin(\n  ScopedElementsMixin(ThemeableMixin(TranslatableMixin(NucleonElement)))\n);\n\nexport class CategoryRestrictionsPageItem extends Base<Data> {\n  static get scopedElements(): ScopedElementsMap {\n    return {\n      'foxy-spinner': customElements.get('foxy-spinner'),\n      'x-category-restrictions-page-item-content': CategoryRestrictionsPageItemContent,\n    };\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      itemCategory: { type: String, attribute: 'item-category' },\n      giftCard: { type: String, attribute: 'gift-card' },\n    };\n  }\n\n  itemCategory = '';\n\n  giftCard = '';\n\n  render(): TemplateResult {\n    const category = this.data?._embedded['fx:gift_card_item_categories'][0];\n    const parent = category ? undefined : this.href;\n    const href = category ? category._links.self.href : undefined;\n\n    return html`\n      <x-category-restrictions-page-item-content\n        item-category=${this.itemCategory}\n        gift-card=${this.giftCard}\n        parent=${ifDefined(parent)}\n        class=\"h-full\"\n        group=${this.group}\n        href=${ifDefined(href)}\n        lang=${this.lang}\n        ns=${this.ns}\n        ?disabled=${!this.in('idle') || this.disabled}\n        ?readonly=${this.readonly}\n      >\n        <slot></slot>\n      </x-category-restrictions-page-item-content>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"CategoryRestrictionsPageItem.js","sourceRoot":"","sources":["../../../../../src/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,mCAAmC,EAAE,iDAA8C;AAC5F,OAAO,EAAE,iBAAiB,EAAE,2CAAwC;AACpE,OAAO,EAAE,cAAc,EAAE,+CAA4C;AAKrE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,wCAAqC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAG3D,MAAM,IAAI,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;AAEpF,MAAM,OAAO,4BAA6B,SAAQ,IAAU;IAA5D;;QAgBE,iBAAY,GAAG,EAAE,CAAC;QAElB,aAAQ,GAAG,EAAE,CAAC;IAuBhB,CAAC;IAxCC,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,cAAc,EAAE,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC;YAClD,2CAA2C,EAAE,mCAAmC;SACjF,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,YAAY,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE;YAC1D,QAAQ,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE;SACnD,CAAC;IACJ,CAAC;IAMD,MAAM;;QACJ,MAAM,QAAQ,SAAG,IAAI,CAAC,IAAI,0CAAE,SAAS,CAAC,8BAA8B,EAAE,CAAC,CAAC,CAAC;QACzE,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;QAChD,MAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QAE9D,OAAO,IAAI,CAAA;;wBAES,IAAI,CAAC,YAAY;;oBAErB,IAAI,CAAC,QAAQ;iBAChB,SAAS,CAAC,MAAM,CAAC;;gBAElB,IAAI,CAAC,KAAK;eACX,SAAS,CAAC,IAAI,CAAC;oBACV,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ;oBACjC,IAAI,CAAC,QAAQ;;;;KAI5B,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { TemplateResult, html } from 'lit-html';\n\nimport { CategoryRestrictionsPageItemContent } from './CategoryRestrictionsPageItemContent';\nimport { ConfigurableMixin } from '../../../../mixins/configurable';\nimport { NucleonElement } from '../../NucleonElement/NucleonElement';\nimport { PropertyDeclarations } from 'lit-element';\nimport { Rels } from '@foxy.io/sdk/backend';\nimport { Resource } from '@foxy.io/sdk/core';\nimport { ScopedElementsMap } from '@open-wc/scoped-elements/src/types';\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { ThemeableMixin } from '../../../../mixins/themeable';\nimport { ifDefined } from 'lit-html/directives/if-defined';\n\ntype Data = Resource<Rels.GiftCardItemCategories>;\nconst Base = ConfigurableMixin(ScopedElementsMixin(ThemeableMixin(NucleonElement)));\n\nexport class CategoryRestrictionsPageItem extends Base<Data> {\n  static get scopedElements(): ScopedElementsMap {\n    return {\n      'foxy-spinner': customElements.get('foxy-spinner'),\n      'x-category-restrictions-page-item-content': CategoryRestrictionsPageItemContent,\n    };\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      itemCategory: { type: String, attribute: 'item-category' },\n      giftCard: { type: String, attribute: 'gift-card' },\n    };\n  }\n\n  itemCategory = '';\n\n  giftCard = '';\n\n  render(): TemplateResult {\n    const category = this.data?._embedded['fx:gift_card_item_categories'][0];\n    const parent = category ? undefined : this.href;\n    const href = category ? category._links.self.href : undefined;\n\n    return html`\n      <x-category-restrictions-page-item-content\n        item-category=${this.itemCategory}\n        data-testid=\"content\"\n        gift-card=${this.giftCard}\n        parent=${ifDefined(parent)}\n        class=\"h-full\"\n        group=${this.group}\n        href=${ifDefined(href)}\n        ?disabled=${!this.in('idle') || this.disabled}\n        ?readonly=${this.readonly}\n      >\n        <slot></slot>\n      </x-category-restrictions-page-item-content>\n    `;\n  }\n}\n"]}

package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.d.ts

@@ -5,9 +5,7 @@ import { PropertyDeclarations } from 'lit-element';
 import { Rels } from '@foxy.io/sdk/backend';
 import { Resource } from '@foxy.io/sdk/core';
 declare type Data = Resource<Rels.GiftCardItemCategory>;
-declare const Base: typeof NucleonElement & import("lit-element").Constructor<import("../../../../mixins/translatable").TranslatableMixinHost> & {
-    defaultNS: string;
-} & {
+declare const Base: typeof NucleonElement & {
     styles: import("lit-element").CSSResultArray;
 } & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/src/types").ScopedElementsHost> & import("lit-element").Constructor<import("../../../../mixins/configurable").ConfigurableMixinHost>;
 export declare class CategoryRestrictionsPageItemContent extends Base<Data> {

package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.js

@@ -4,8 +4,7 @@ import { Checkbox } from "../../../private/Checkbox/Checkbox.js";
 import { ConfigurableMixin } from "../../../../mixins/configurable.js";
 import { NucleonElement } from "../../NucleonElement/NucleonElement.js";
 import { ThemeableMixin } from "../../../../mixins/themeable.js";
-import { TranslatableMixin } from "../../../../mixins/translatable.js";
-const Base = ConfigurableMixin(ScopedElementsMixin(ThemeableMixin(TranslatableMixin(NucleonElement))));
+const Base = ConfigurableMixin(ScopedElementsMixin(ThemeableMixin(NucleonElement)));
 export class CategoryRestrictionsPageItemContent extends Base {
     constructor() {
         super(...arguments);
@@ -28,6 +27,7 @@ export class CategoryRestrictionsPageItemContent extends Base {
         return html `
       <div class="h-full flex items-center">
         <x-checkbox
+          data-testid="checkbox"
           ?disabled=${!this.in('idle') || this.disabled}
           ?readonly=${this.readonly}
           ?checked=${!!this.data}

package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoryRestrictionsPageItemContent.js","sourceRoot":"","sources":["../../../../../src/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAClF,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAE,8CAA2C;AAE9D,OAAO,EAAE,iBAAiB,EAAE,2CAAwC;AACpE,OAAO,EAAE,cAAc,EAAE,+CAA4C;AAIrE,OAAO,EAAE,cAAc,EAAE,wCAAqC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,2CAAwC;AAGpE,MAAM,IAAI,GAAG,iBAAiB,CAC5B,mBAAmB,CAAC,cAAc,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC,CAAC,CACvE,CAAC;AAEF,MAAM,OAAO,mCAAoC,SAAQ,IAAU;IAAnE;;QAeE,iBAAY,GAAG,EAAE,CAAC;QAElB,aAAQ,GAAG,EAAE,CAAC;IA2BhB,CAAC;IA3CC,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,YAAY,EAAE,QAAQ;SACvB,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,YAAY,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE;YAC1D,QAAQ,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE;SACnD,CAAC;IACJ,CAAC;IAMD,MAAM;QACJ,OAAO,IAAI,CAAA;;;sBAGO,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ;sBACjC,IAAI,CAAC,QAAQ;qBACd,CAAC,CAAC,IAAI,CAAC,IAAI;oBACZ,CAAC,GAAwB,EAAE,EAAE;YACrC,IAAI,GAAG,CAAC,MAAM,EAAE;gBACd,IAAI,CAAC,IAAI,CAAC;oBACR,iBAAiB,EAAE,IAAI,CAAC,YAAY;oBACpC,aAAa,EAAE,IAAI,CAAC,QAAQ;iBAC7B,CAAC,CAAC;gBAEH,IAAI,CAAC,MAAM,EAAE,CAAC;aACf;iBAAM;gBACL,IAAI,CAAC,MAAM,EAAE,CAAC;aACf;QACH,CAAC;;;;;KAKN,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { ScopedElementsMap, ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { Checkbox } from '../../../private/Checkbox/Checkbox';\nimport { CheckboxChangeEvent } from '../../../private/events';\nimport { ConfigurableMixin } from '../../../../mixins/configurable';\nimport { NucleonElement } from '../../NucleonElement/NucleonElement';\nimport { PropertyDeclarations } from 'lit-element';\nimport { Rels } from '@foxy.io/sdk/backend';\nimport { Resource } from '@foxy.io/sdk/core';\nimport { ThemeableMixin } from '../../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../../mixins/translatable';\n\ntype Data = Resource<Rels.GiftCardItemCategory>;\nconst Base = ConfigurableMixin(\n  ScopedElementsMixin(ThemeableMixin(TranslatableMixin(NucleonElement)))\n);\n\nexport class CategoryRestrictionsPageItemContent extends Base<Data> {\n  static get scopedElements(): ScopedElementsMap {\n    return {\n      'x-checkbox': Checkbox,\n    };\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      itemCategory: { type: String, attribute: 'item-category' },\n      giftCard: { type: String, attribute: 'gift-card' },\n    };\n  }\n\n  itemCategory = '';\n\n  giftCard = '';\n\n  render(): TemplateResult {\n    return html`\n      <div class=\"h-full flex items-center\">\n        <x-checkbox\n          ?disabled=${!this.in('idle') || this.disabled}\n          ?readonly=${this.readonly}\n          ?checked=${!!this.data}\n          @change=${(evt: CheckboxChangeEvent) => {\n            if (evt.detail) {\n              this.edit({\n                item_category_uri: this.itemCategory,\n                gift_card_uri: this.giftCard,\n              });\n\n              this.submit();\n            } else {\n              this.delete();\n            }\n          }}\n        >\n          <slot></slot>\n        </x-checkbox>\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"CategoryRestrictionsPageItemContent.js","sourceRoot":"","sources":["../../../../../src/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAClF,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAE,8CAA2C;AAE9D,OAAO,EAAE,iBAAiB,EAAE,2CAAwC;AACpE,OAAO,EAAE,cAAc,EAAE,+CAA4C;AAIrE,OAAO,EAAE,cAAc,EAAE,wCAAqC;AAG9D,MAAM,IAAI,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;AAEpF,MAAM,OAAO,mCAAoC,SAAQ,IAAU;IAAnE;;QAeE,iBAAY,GAAG,EAAE,CAAC;QAElB,aAAQ,GAAG,EAAE,CAAC;IA4BhB,CAAC;IA5CC,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,YAAY,EAAE,QAAQ;SACvB,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,YAAY,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE;YAC1D,QAAQ,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE;SACnD,CAAC;IACJ,CAAC;IAMD,MAAM;QACJ,OAAO,IAAI,CAAA;;;;sBAIO,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,QAAQ;sBACjC,IAAI,CAAC,QAAQ;qBACd,CAAC,CAAC,IAAI,CAAC,IAAI;oBACZ,CAAC,GAAwB,EAAE,EAAE;YACrC,IAAI,GAAG,CAAC,MAAM,EAAE;gBACd,IAAI,CAAC,IAAI,CAAC;oBACR,iBAAiB,EAAE,IAAI,CAAC,YAAY;oBACpC,aAAa,EAAE,IAAI,CAAC,QAAQ;iBAC7B,CAAC,CAAC;gBAEH,IAAI,CAAC,MAAM,EAAE,CAAC;aACf;iBAAM;gBACL,IAAI,CAAC,MAAM,EAAE,CAAC;aACf;QACH,CAAC;;;;;KAKN,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { ScopedElementsMap, ScopedElementsMixin } from '@open-wc/scoped-elements';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { Checkbox } from '../../../private/Checkbox/Checkbox';\nimport { CheckboxChangeEvent } from '../../../private/events';\nimport { ConfigurableMixin } from '../../../../mixins/configurable';\nimport { NucleonElement } from '../../NucleonElement/NucleonElement';\nimport { PropertyDeclarations } from 'lit-element';\nimport { Rels } from '@foxy.io/sdk/backend';\nimport { Resource } from '@foxy.io/sdk/core';\nimport { ThemeableMixin } from '../../../../mixins/themeable';\n\ntype Data = Resource<Rels.GiftCardItemCategory>;\nconst Base = ConfigurableMixin(ScopedElementsMixin(ThemeableMixin(NucleonElement)));\n\nexport class CategoryRestrictionsPageItemContent extends Base<Data> {\n  static get scopedElements(): ScopedElementsMap {\n    return {\n      'x-checkbox': Checkbox,\n    };\n  }\n\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      itemCategory: { type: String, attribute: 'item-category' },\n      giftCard: { type: String, attribute: 'gift-card' },\n    };\n  }\n\n  itemCategory = '';\n\n  giftCard = '';\n\n  render(): TemplateResult {\n    return html`\n      <div class=\"h-full flex items-center\">\n        <x-checkbox\n          data-testid=\"checkbox\"\n          ?disabled=${!this.in('idle') || this.disabled}\n          ?readonly=${this.readonly}\n          ?checked=${!!this.data}\n          @change=${(evt: CheckboxChangeEvent) => {\n            if (evt.detail) {\n              this.edit({\n                item_category_uri: this.itemCategory,\n                gift_card_uri: this.giftCard,\n              });\n\n              this.submit();\n            } else {\n              this.delete();\n            }\n          }}\n        >\n          <slot></slot>\n        </x-checkbox>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/elements/public/I18n/format/discount.js

@@ -2,7 +2,7 @@
  * i18next formatter that returns a human-readable discount description for an API value.
  * @see https://www.i18next.com/translation-function/formatting
  */
-export const discount = ({ type, details }, format, lang) => {
+export const discount = ({ ns, type, details }, format, lang) => {
     const methods = ['allunits', 'incremental', 'repeat', 'single'];
     const factor = type.endsWith('_percentage') ? 0.01 : 1;
     const tiers = details.split('|');
@@ -13,7 +13,7 @@ export const discount = ({ type, details }, format, lang) => {
         const signIndex = (_b = (_a = /[-+]/.exec(tier)) === null || _a === void 0 ? void 0 : _a.index) !== null && _b !== void 0 ? _b : -1;
         const adjustment = parseFloat(tier.substring(signIndex)) * factor;
         const from = parseFloat(tier.substring(0, signIndex));
-        return `$t(${i18nKey}, ${JSON.stringify({ adjustment, from })})`;
+        return `$t(${i18nKey}, ${JSON.stringify({ adjustment, from, ns })})`;
     });
     return translatedTiers.join('; ');
 };

package/dist/elements/public/I18n/format/discount.js.map

@@ -1 +1 @@
-{"version":3,"file":"discount.js","sourceRoot":"","sources":["../../../../../src/elements/public/I18n/format/discount.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAmB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAS,EAAE,MAAM,EAAE,IAAI,EAAU,EAAE;IACzF,MAAM,OAAO,GAAG,CAAC,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAChE,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACvD,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACjC,MAAM,MAAM,GAAG,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC;IACrE,MAAM,OAAO,GAAG,GAAG,MAAM,IAAI,IAAI,mBAAmB,CAAC;IAErD,MAAM,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;;QACvC,MAAM,SAAS,eAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,0CAAE,KAAK,mCAAI,CAAC,CAAC,CAAC;QACjD,MAAM,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC;QAClE,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC;QAEtD,OAAO,MAAM,OAAO,KAAK,IAAI,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,GAAG,CAAC;IACnE,CAAC,CAAC,CAAC;IAEH,OAAO,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACpC,CAAC,CAAC","sourcesContent":["import { FormatFunction } from 'i18next';\n\ntype Value = { type: string; details: string };\n\n/**\n * i18next formatter that returns a human-readable discount description for an API value.\n * @see https://www.i18next.com/translation-function/formatting\n */\nexport const discount: FormatFunction = ({ type, details }: Value, format, lang): string => {\n  const methods = ['allunits', 'incremental', 'repeat', 'single'];\n  const factor = type.endsWith('_percentage') ? 0.01 : 1;\n  const tiers = details.split('|');\n  const method = methods.includes(tiers[0]) ? tiers.shift() : 'single';\n  const i18nKey = `${method}_${type}_discount_summary`;\n\n  const translatedTiers = tiers.map(tier => {\n    const signIndex = /[-+]/.exec(tier)?.index ?? -1;\n    const adjustment = parseFloat(tier.substring(signIndex)) * factor;\n    const from = parseFloat(tier.substring(0, signIndex));\n\n    return `$t(${i18nKey}, ${JSON.stringify({ adjustment, from })})`;\n  });\n\n  return translatedTiers.join('; ');\n};\n"]}
+{"version":3,"file":"discount.js","sourceRoot":"","sources":["../../../../../src/elements/public/I18n/format/discount.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAmB,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAS,EAAE,MAAM,EAAE,IAAI,EAAU,EAAE;IAC7F,MAAM,OAAO,GAAG,CAAC,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAChE,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACvD,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACjC,MAAM,MAAM,GAAG,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC;IACrE,MAAM,OAAO,GAAG,GAAG,MAAM,IAAI,IAAI,mBAAmB,CAAC;IAErD,MAAM,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;;QACvC,MAAM,SAAS,eAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,0CAAE,KAAK,mCAAI,CAAC,CAAC,CAAC;QACjD,MAAM,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC;QAClE,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC;QAEtD,OAAO,MAAM,OAAO,KAAK,IAAI,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,OAAO,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACpC,CAAC,CAAC","sourcesContent":["import { FormatFunction } from 'i18next';\n\ntype Value = { ns: string; type: string; details: string };\n\n/**\n * i18next formatter that returns a human-readable discount description for an API value.\n * @see https://www.i18next.com/translation-function/formatting\n */\nexport const discount: FormatFunction = ({ ns, type, details }: Value, format, lang): string => {\n  const methods = ['allunits', 'incremental', 'repeat', 'single'];\n  const factor = type.endsWith('_percentage') ? 0.01 : 1;\n  const tiers = details.split('|');\n  const method = methods.includes(tiers[0]) ? tiers.shift() : 'single';\n  const i18nKey = `${method}_${type}_discount_summary`;\n\n  const translatedTiers = tiers.map(tier => {\n    const signIndex = /[-+]/.exec(tier)?.index ?? -1;\n    const adjustment = parseFloat(tier.substring(signIndex)) * factor;\n    const from = parseFloat(tier.substring(0, signIndex));\n\n    return `$t(${i18nKey}, ${JSON.stringify({ adjustment, from, ns })})`;\n  });\n\n  return translatedTiers.join('; ');\n};\n"]}

package/dist/elements/public/Pagination/Pagination.js

@@ -69,6 +69,7 @@ export class Pagination extends Base {
       <div class="grid grid-cols-3 gap-s items-center">
         <div class="flex items-center space-x-s">
           <vaadin-button
+            data-testid="first"
             theme="contrast tertiary-inline"
             ?disabled=${!canGoBack}
             @click=${() => this.__goTo('first')}
@@ -78,6 +79,7 @@ export class Pagination extends Base {
           </vaadin-button>
 
           <vaadin-button
+            data-testid="prev"
             theme="contrast tertiary-inline"
             ?disabled=${!canGoBack}
             @click=${() => this.__goTo('prev')}
@@ -105,6 +107,7 @@ export class Pagination extends Base {
 
         <div class="flex items-center justify-end space-x-s">
           <vaadin-button
+            data-testid="next"
             theme="contrast tertiary-inline"
             ?disabled=${!canGoForth}
             @click=${() => this.__goTo('next')}
@@ -114,6 +117,7 @@ export class Pagination extends Base {
           </vaadin-button>
 
           <vaadin-button
+            data-testid="last"
             theme="contrast tertiary-inline"
             ?disabled=${!canGoForth}
             @click=${() => this.__goTo('last')}

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

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../../src/elements/public/Pagination/Pagination.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport get from 'lodash-es/get';\n\nconst NS = 'pagination';\nconst Base = ResponsiveMixin(ConfigurableMixin(ThemeableMixin(TranslatableMixin(LitElement, NS))));\n\n/**\n * Helper element that adds pagination controls to elements\n * representing Hypermedia API collection pages. Works with NucleonElement instances only.\n * Page element **MUST** be a direct descendant of `foxy-pagination`.\n *\n * @example\n * ```html\n * <foxy-pagination first=\"https://demo.api/hapi/customers?limit=3\">\n *   <foxy-customers-table></foxy-customers-table>\n * </foxy-pagination>\n * ```\n *\n * @element foxy-pagination\n * @since 1.15.0\n */\nexport class Pagination extends Base {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      first: { type: String },\n      __pageElement: { attribute: false },\n    };\n  }\n\n  private __pageElement: NucleonElement<any> | null = null;\n\n  private __rerender = () => this.requestUpdate();\n\n  private __first = '';\n\n  /** URL of the first page of the colletion. */\n  get first(): string {\n    return this.__first;\n  }\n\n  set first(newValue: string) {\n    this.__first = newValue;\n    if (this.__pageElement) this.__pageElement.href = newValue;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.__connectPageElement();\n  }\n\n  render(): TemplateResult {\n    const data = this.__pageElement?.data;\n    const { disabled, lang, ns } = this;\n\n    const returnedItemsValue = Number(get(data, 'returned_items'));\n    const returnedItems = Number.isNaN(returnedItemsValue) ? 0 : returnedItemsValue;\n\n    const totalItemsValue = Number(get(data, 'total_items'));\n    const totalItems = Number.isNaN(totalItemsValue) ? 0 : totalItemsValue;\n\n    const offsetValue = Number(get(data, 'offset'));\n    const offset = Number.isNaN(offsetValue) ? 0 : offsetValue;\n\n    const canGoBack = !disabled && offset > 0;\n    const canGoForth = !disabled && offset + returnedItems < totalItems;\n\n    const labelClass = 'sr-only sm-not-sr-only';\n\n    return html`\n      <slot @slotchange=${this.__connectPageElement}></slot>\n\n      <div class=\"grid grid-cols-3 gap-s items-center\">\n        <div class=\"flex items-center space-x-s\">\n          <vaadin-button\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoBack}\n            @click=${() => this.__goTo('first')}\n          >\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:first-page\"></iron-icon>\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"first\" ns=${ns}></foxy-i18n>\n          </vaadin-button>\n\n          <vaadin-button\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoBack}\n            @click=${() => this.__goTo('prev')}\n          >\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:chevron-left\"></iron-icon>\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"previous\" ns=${ns}></foxy-i18n>\n          </vaadin-button>\n        </div>\n\n        <foxy-i18n\n          options=${JSON.stringify({\n            total: totalItems,\n            from: offset ? offset + 1 : 0,\n            to: offset + returnedItems,\n          })}\n          class=${classMap({\n            'flex-1 text-xs text-tertiary text-center leading-xs': true,\n            'opacity-0': !data,\n          })}\n          lang=${lang}\n          key=\"pagination\"\n          ns=${ns}\n        >\n        </foxy-i18n>\n\n        <div class=\"flex items-center justify-end space-x-s\">\n          <vaadin-button\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoForth}\n            @click=${() => this.__goTo('next')}\n          >\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"next\" ns=${ns}></foxy-i18n>\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:chevron-right\"></iron-icon>\n          </vaadin-button>\n\n          <vaadin-button\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoForth}\n            @click=${() => this.__goTo('last')}\n          >\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"last\" ns=${ns}></foxy-i18n>\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:last-page\"></iron-icon>\n          </vaadin-button>\n        </div>\n      </div>\n    `;\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.__disconnectPageElement();\n  }\n\n  private __goTo(rel: string): void {\n    this.__pageElement!.href = String(get(this.__pageElement?.data, `_links.${rel}.href`));\n  }\n\n  private __disconnectPageElement() {\n    this.__pageElement?.removeEventListener('update', this.__rerender);\n    this.__pageElement = null;\n  }\n\n  private __connectPageElement() {\n    this.__disconnectPageElement();\n\n    const slot = this.renderRoot.querySelector<HTMLSlotElement>('slot');\n    const assignedElements = slot?.assignedElements() ?? [];\n    const firstNucleonElement = assignedElements.find(el => el instanceof NucleonElement) as\n      | NucleonElement<any>\n      | undefined;\n\n    if (firstNucleonElement) {\n      this.__pageElement = firstNucleonElement;\n      this.__pageElement.addEventListener('update', this.__rerender);\n      this.__pageElement.href = this.first;\n    }\n  }\n}\n"]}
+{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../../src/elements/public/Pagination/Pagination.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport get from 'lodash-es/get';\n\nconst NS = 'pagination';\nconst Base = ResponsiveMixin(ConfigurableMixin(ThemeableMixin(TranslatableMixin(LitElement, NS))));\n\n/**\n * Helper element that adds pagination controls to elements\n * representing Hypermedia API collection pages. Works with NucleonElement instances only.\n * Page element **MUST** be a direct descendant of `foxy-pagination`.\n *\n * @example\n * ```html\n * <foxy-pagination first=\"https://demo.api/hapi/customers?limit=3\">\n *   <foxy-customers-table></foxy-customers-table>\n * </foxy-pagination>\n * ```\n *\n * @element foxy-pagination\n * @since 1.15.0\n */\nexport class Pagination extends Base {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      first: { type: String },\n      __pageElement: { attribute: false },\n    };\n  }\n\n  private __pageElement: NucleonElement<any> | null = null;\n\n  private __rerender = () => this.requestUpdate();\n\n  private __first = '';\n\n  /** URL of the first page of the colletion. */\n  get first(): string {\n    return this.__first;\n  }\n\n  set first(newValue: string) {\n    this.__first = newValue;\n    if (this.__pageElement) this.__pageElement.href = newValue;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.__connectPageElement();\n  }\n\n  render(): TemplateResult {\n    const data = this.__pageElement?.data;\n    const { disabled, lang, ns } = this;\n\n    const returnedItemsValue = Number(get(data, 'returned_items'));\n    const returnedItems = Number.isNaN(returnedItemsValue) ? 0 : returnedItemsValue;\n\n    const totalItemsValue = Number(get(data, 'total_items'));\n    const totalItems = Number.isNaN(totalItemsValue) ? 0 : totalItemsValue;\n\n    const offsetValue = Number(get(data, 'offset'));\n    const offset = Number.isNaN(offsetValue) ? 0 : offsetValue;\n\n    const canGoBack = !disabled && offset > 0;\n    const canGoForth = !disabled && offset + returnedItems < totalItems;\n\n    const labelClass = 'sr-only sm-not-sr-only';\n\n    return html`\n      <slot @slotchange=${this.__connectPageElement}></slot>\n\n      <div class=\"grid grid-cols-3 gap-s items-center\">\n        <div class=\"flex items-center space-x-s\">\n          <vaadin-button\n            data-testid=\"first\"\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoBack}\n            @click=${() => this.__goTo('first')}\n          >\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:first-page\"></iron-icon>\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"first\" ns=${ns}></foxy-i18n>\n          </vaadin-button>\n\n          <vaadin-button\n            data-testid=\"prev\"\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoBack}\n            @click=${() => this.__goTo('prev')}\n          >\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:chevron-left\"></iron-icon>\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"previous\" ns=${ns}></foxy-i18n>\n          </vaadin-button>\n        </div>\n\n        <foxy-i18n\n          options=${JSON.stringify({\n            total: totalItems,\n            from: offset ? offset + 1 : 0,\n            to: offset + returnedItems,\n          })}\n          class=${classMap({\n            'flex-1 text-xs text-tertiary text-center leading-xs': true,\n            'opacity-0': !data,\n          })}\n          lang=${lang}\n          key=\"pagination\"\n          ns=${ns}\n        >\n        </foxy-i18n>\n\n        <div class=\"flex items-center justify-end space-x-s\">\n          <vaadin-button\n            data-testid=\"next\"\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoForth}\n            @click=${() => this.__goTo('next')}\n          >\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"next\" ns=${ns}></foxy-i18n>\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:chevron-right\"></iron-icon>\n          </vaadin-button>\n\n          <vaadin-button\n            data-testid=\"last\"\n            theme=\"contrast tertiary-inline\"\n            ?disabled=${!canGoForth}\n            @click=${() => this.__goTo('last')}\n          >\n            <foxy-i18n class=${labelClass} lang=${lang} key=\"last\" ns=${ns}></foxy-i18n>\n            <iron-icon class=\"icon-inline text-s\" icon=\"icons:last-page\"></iron-icon>\n          </vaadin-button>\n        </div>\n      </div>\n    `;\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.__disconnectPageElement();\n  }\n\n  private __goTo(rel: string): void {\n    this.__pageElement!.href = String(get(this.__pageElement?.data, `_links.${rel}.href`));\n  }\n\n  private __disconnectPageElement() {\n    this.__pageElement?.removeEventListener('update', this.__rerender);\n    this.__pageElement = null;\n  }\n\n  private __connectPageElement() {\n    this.__disconnectPageElement();\n\n    const slot = this.renderRoot.querySelector<HTMLSlotElement>('slot');\n    const assignedElements = slot?.assignedElements() ?? [];\n    const firstNucleonElement = assignedElements.find(el => el instanceof NucleonElement) as\n      | NucleonElement<any>\n      | undefined;\n\n    if (firstNucleonElement) {\n      this.__pageElement = firstNucleonElement;\n      this.__pageElement.addEventListener('update', this.__rerender);\n      this.__pageElement.href = this.first;\n    }\n  }\n}\n"]}

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

@@ -0,0 +1,48 @@
+import { Data, Templates } from './types';
+import { PropertyDeclarations, TemplateResult } from 'lit-element';
+import { ScopedElementsMap } from '@open-wc/scoped-elements';
+import { NucleonElement } from '../NucleonElement/NucleonElement';
+import { NucleonV8N } from '../NucleonElement/types';
+declare const Base: typeof NucleonElement & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost> & {
+    styles: import("lit-element").CSSResultArray;
+} & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/src/types").ScopedElementsHost>;
+/**
+ * Form element for creating or editing reports (`fx:report`).
+ *
+ * @slot name:before
+ * @slot name:after
+ *
+ * @slot range:before
+ * @slot range:after
+ *
+ * @slot timestamps:before
+ * @slot timestamps:after
+ *
+ * @slot delete:before
+ * @slot delete:after
+ *
+ * @slot create:before
+ * @slot create:after
+ *
+ * @element foxy-report-form
+ * @since 1.16.0
+ */
+export declare class ReportForm extends Base<Data> {
+    static get scopedElements(): ScopedElementsMap;
+    static get properties(): PropertyDeclarations;
+    static get v8n(): NucleonV8N<Data>;
+    templates: Templates;
+    private __showRangeTime;
+    render(): TemplateResult;
+    private __renderName;
+    private __renderRangePreset;
+    private __renderRangeDateTimePicker;
+    private __renderRangeDatePicker;
+    private __renderRange;
+    private __renderTimestamps;
+    private __renderCreate;
+    private __renderDelete;
+}
+export {};

package/dist/elements/public/ReportForm/ReportForm.js

@@ -0,0 +1,391 @@
+import { Choice, Group, PropertyTable } from "../../private/index.js";
+import { html } from 'lit-element';
+import { ScopedElementsMixin } from '@open-wc/scoped-elements';
+import { getCurrentMonth, getCurrentQuarter, getCurrentYear, getLast30Days, getLast365Days, getPreviousMonth, getPreviousQuarter, getPreviousYear, toAPIDateTime, toDatePickerValue, toDateTimePickerValue, } from "./utils.js";
+import { ChoiceChangeEvent } from "../../private/Choice/ChoiceChangeEvent.js";
+import { ConfigurableMixin } from "../../../mixins/configurable.js";
+import { NucleonElement } from "../NucleonElement/NucleonElement.js";
+import { ResponsiveMixin } from "../../../mixins/responsive.js";
+import { ThemeableMixin } from "../../../mixins/themeable.js";
+import { TranslatableMixin } from "../../../mixins/translatable.js";
+import { classMap } from "../../../utils/class-map.js";
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { live } from 'lit-html/directives/live';
+import { render } from 'lit-html';
+const Base = ScopedElementsMixin(ResponsiveMixin(ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement, 'report-form')))));
+/**
+ * Form element for creating or editing reports (`fx:report`).
+ *
+ * @slot name:before
+ * @slot name:after
+ *
+ * @slot range:before
+ * @slot range:after
+ *
+ * @slot timestamps:before
+ * @slot timestamps:after
+ *
+ * @slot delete:before
+ * @slot delete:after
+ *
+ * @slot create:before
+ * @slot create:after
+ *
+ * @element foxy-report-form
+ * @since 1.16.0
+ */
+export class ReportForm extends Base {
+    constructor() {
+        super(...arguments);
+        this.templates = {};
+        this.__showRangeTime = false;
+    }
+    static get scopedElements() {
+        return {
+            'vaadin-date-time-picker': customElements.get('vaadin-date-time-picker'),
+            'vaadin-date-picker': customElements.get('vaadin-date-picker'),
+            'vaadin-checkbox': customElements.get('vaadin-checkbox'),
+            'vaadin-select': customElements.get('vaadin-select'),
+            'vaadin-button': customElements.get('vaadin-button'),
+            'foxy-internal-confirm-dialog': customElements.get('foxy-internal-confirm-dialog'),
+            'foxy-internal-sandbox': customElements.get('foxy-internal-sandbox'),
+            'foxy-spinner': customElements.get('foxy-spinner'),
+            'foxy-i18n': customElements.get('foxy-i18n'),
+            'x-property-table': PropertyTable,
+            'x-choice': Choice,
+            'x-group': Group,
+        };
+    }
+    static get properties() {
+        return {
+            ...super.properties,
+            __showRangeTime: { attribute: false },
+        };
+    }
+    static get v8n() {
+        return [
+            ({ name: v }) => !!v || 'name_required',
+            ({ datetime_start: v }) => !!v || 'datetime_start_required',
+            ({ datetime_end: v }) => !!v || 'datetime_end_required',
+        ];
+    }
+    render() {
+        var _a, _b;
+        const hidden = this.hiddenSelector;
+        return html `
+      <div
+        data-testid="wrapper"
+        aria-busy=${this.in('busy')}
+        aria-live="polite"
+        class="space-y-l relative"
+      >
+        <div class="space-y-m">
+          ${hidden.matches('name', true) ? '' : this.__renderName()}
+          ${hidden.matches('range', true) ? '' : this.__renderRange()}
+          ${hidden.matches('timestamps', true) || !this.data ? '' : this.__renderTimestamps()}
+          ${hidden.matches('create', true) || this.data ? '' : this.__renderCreate()}
+          ${hidden.matches('delete', true) || !this.data ? '' : this.__renderDelete()}
+        </div>
+
+        <div
+          data-testid="spinner"
+          class=${classMap({
+            'transition duration-500 ease-in-out absolute inset-0 flex': true,
+            'opacity-0 pointer-events-none': this.in('idle'),
+        })}
+        >
+          <foxy-spinner
+            layout="vertical"
+            class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l"
+            state=${this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty'}
+            lang=${this.lang}
+            ns="${this.ns} ${(_b = (_a = customElements.get('foxy-spinner')) === null || _a === void 0 ? void 0 : _a.defaultNS) !== null && _b !== void 0 ? _b : ''}"
+          >
+          </foxy-spinner>
+        </div>
+      </div>
+    `;
+    }
+    __renderName() {
+        const scope = 'name';
+        const items = ['complete', 'customers', 'customers_ltv'];
+        const isDisabled = !this.in('idle') || this.disabledSelector.matches(scope);
+        const isReadonly = this.readonlySelector.matches(scope);
+        return html `
+      <div data-testid=${scope}>
+        ${this.renderTemplateOrSlot(`${scope}:before`)}
+
+        <x-group frame>
+          <foxy-i18n lang=${this.lang} slot="header" key="name" ns=${this.ns}></foxy-i18n>
+
+          <x-choice
+            data-testid="name-choice"
+            .value=${this.form.name}
+            .items=${items}
+            ?readonly=${isReadonly}
+            ?disabled=${isDisabled}
+            @change=${(evt) => {
+            if (evt instanceof ChoiceChangeEvent) {
+                this.edit({ name: evt.detail });
+            }
+        }}
+          >
+            ${items.map(value => {
+            return html `
+                <div slot="${value}-label" class="py-s leading-s">
+                  <foxy-i18n class="block" lang=${this.lang} key="name_${value}" ns=${this.ns}>
+                  </foxy-i18n>
+
+                  <foxy-i18n
+                    class="block text-s opacity-70"
+                    lang=${this.lang}
+                    key="name_${value}_explainer"
+                    ns=${this.ns}
+                  >
+                  </foxy-i18n>
+                </div>
+              `;
+        })}
+          </x-choice>
+        </x-group>
+
+        ${this.renderTemplateOrSlot(`${scope}:after`)}
+      </div>
+    `;
+    }
+    __renderRangePreset() {
+        var _a;
+        const options = [
+            [
+                { value: '0', label: 'preset_previous_quarter', ...getPreviousQuarter() },
+                { value: '1', label: 'preset_previous_month', ...getPreviousMonth() },
+                { value: '2', label: 'preset_previous_year', ...getPreviousYear() },
+            ],
+            [
+                { value: '3', label: 'preset_this_quarter', ...getCurrentQuarter() },
+                { value: '4', label: 'preset_this_month', ...getCurrentMonth() },
+                { value: '5', label: 'preset_this_year', ...getCurrentYear() },
+            ],
+            [
+                { value: '6', label: 'preset_last_365_days', ...getLast365Days() },
+                { value: '7', label: 'preset_last_30_days', ...getLast30Days() },
+            ],
+        ];
+        const currentOption = options.flat(1).find(option => {
+            const { datetime_end: end, datetime_start: start } = this.form;
+            return (start && end && toAPIDateTime(option.start) === start && toAPIDateTime(option.end) === end);
+        });
+        const renderer = (root) => {
+            const custom = html `<vaadin-item value="custom">${this.t('preset_custom')}</vaadin-item>`;
+            const separator = html `<hr />`;
+            const predefined = options.map(group => {
+                const items = group.map(({ value, label }) => {
+                    return html `<vaadin-item value=${value}>${this.t(label)}</vaadin-item>`;
+                });
+                return html `${items}${separator}`;
+            });
+            if (!root.firstElementChild)
+                root.appendChild(document.createElement('vaadin-list-box'));
+            render(html `${predefined}${custom}`, root.firstElementChild);
+        };
+        return html `
+      <div>
+        <vaadin-select
+          data-testid="range:preset"
+          label=${this.t('preset')}
+          class="w-full -mt-m -mb-xs"
+          ?disabled=${!this.in('idle') || this.disabledSelector.matches('range', true)}
+          ?readonly=${this.readonlySelector.matches('range', true)}
+          .value=${live((_a = currentOption === null || currentOption === void 0 ? void 0 : currentOption.value) !== null && _a !== void 0 ? _a : 'custom')}
+          .renderer=${renderer}
+          @change=${(evt) => {
+            const select = evt.currentTarget;
+            const option = options.flat(1).find(option => option.value === select.value);
+            if (option) {
+                this.edit({
+                    datetime_start: toAPIDateTime(option.start),
+                    datetime_end: toAPIDateTime(option.end),
+                });
+            }
+        }}
+        >
+        </vaadin-select>
+      </div>
+    `;
+    }
+    __renderRangeDateTimePicker(type) {
+        const field = type === 'end' ? 'datetime_end' : 'datetime_start';
+        const error = this.errors.find(error => error.startsWith(`${field}_`));
+        const value = this.form[field];
+        return html `
+      <vaadin-date-time-picker
+        date-placeholder=${this.t('select_date')}
+        time-placeholder=${this.t('select_time')}
+        error-message=${ifDefined(error ? this.t(error) : undefined)}
+        data-testid="range:${type}"
+        class="w-full"
+        label=${this.t(type)}
+        step="1"
+        ?disabled=${!this.in('idle') || this.disabledSelector.matches('range', true)}
+        ?readonly=${this.readonlySelector.matches('range', true)}
+        .checkValidity=${() => !error}
+        .value=${value ? toDateTimePickerValue(value) : ''}
+        @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
+        @change=${(evt) => {
+            const picker = evt.currentTarget;
+            this.edit({ [field]: picker.value });
+        }}
+      >
+      </vaadin-date-time-picker>
+    `;
+    }
+    __renderRangeDatePicker(type) {
+        const field = type === 'end' ? 'datetime_end' : 'datetime_start';
+        const error = this.errors.find(error => error.startsWith(`${field}_`));
+        const value = this.form[field];
+        return html `
+      <vaadin-date-picker
+        error-message=${ifDefined(error ? this.t(error) : undefined)}
+        placeholder=${this.t('select_date')}
+        data-testid="range:${type}"
+        class="w-full"
+        label=${this.t(type)}
+        step="1"
+        ?disabled=${!this.in('idle') || this.disabledSelector.matches('range', true)}
+        ?readonly=${this.readonlySelector.matches('range', true)}
+        .checkValidity=${() => !error}
+        .value=${value ? toDatePickerValue(value) : ''}
+        @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
+        @change=${(evt) => {
+            const picker = evt.currentTarget;
+            const time = type === 'end' ? '23:59:59' : '00:00:00';
+            this.edit({ [field]: `${picker.value}T${time}` });
+        }}
+      >
+      </vaadin-date-picker>
+    `;
+    }
+    __renderRange() {
+        const renderer = this.__showRangeTime
+            ? this.__renderRangeDateTimePicker
+            : this.__renderRangeDatePicker;
+        return html `
+      <div data-testid="range">
+        ${this.renderTemplateOrSlot('range:before')}
+
+        <x-group frame>
+          <foxy-i18n slot="header" lang=${this.lang} key="range" ns=${this.ns}></foxy-i18n>
+
+          <div class="p-m grid gap-m ${this.__showRangeTime ? 'grid-cols-1' : 'sm-grid-cols-2'}">
+            <div class=${this.__showRangeTime ? 'col-span-1' : 'sm-col-span-2'}>
+              ${this.__renderRangePreset()}
+            </div>
+
+            ${renderer.call(this, 'start')} ${renderer.call(this, 'end')}
+
+            <vaadin-checkbox
+              data-testid="range:toggle"
+              class="-my-xs w-full ${this.__showRangeTime ? 'col-span-1' : 'sm-col-span-2'}"
+              ?disabled=${!this.in('idle') || this.disabledSelector.matches('range', true)}
+              ?checked=${this.__showRangeTime}
+              @change=${(evt) => {
+            const checkbox = evt.currentTarget;
+            this.__showRangeTime = checkbox.checked;
+        }}
+            >
+              <foxy-i18n lang=${this.lang} key="use_precise_time" ns=${this.ns}></foxy-i18n>
+            </vaadin-checkbox>
+          </div>
+        </x-group>
+
+        ${this.renderTemplateOrSlot('range:after')}
+      </div>
+    `;
+    }
+    __renderTimestamps() {
+        return html `
+      <div>
+        ${this.renderTemplateOrSlot('timestamps:before')}
+
+        <x-property-table
+          data-testid="timestamps"
+          .items=${['date_modified', 'date_created'].map(field => {
+            var _a;
+            return ({
+                name: this.t(field),
+                value: ((_a = this.data) === null || _a === void 0 ? void 0 : _a[field]) ? this.t('date', { value: new Date(this.data[field]) })
+                    : '',
+            });
+        })}
+        >
+        </x-property-table>
+
+        ${this.renderTemplateOrSlot('timestamps:after')}
+      </div>
+    `;
+    }
+    __renderCreate() {
+        const isCleanTemplateInvalid = this.in({ idle: { template: { clean: 'invalid' } } });
+        const isDirtyTemplateInvalid = this.in({ idle: { template: { dirty: 'invalid' } } });
+        const isCleanSnapshotInvalid = this.in({ idle: { snapshot: { clean: 'invalid' } } });
+        const isDirtySnapshotInvalid = this.in({ idle: { snapshot: { dirty: 'invalid' } } });
+        const isTemplateInvalid = isCleanTemplateInvalid || isDirtyTemplateInvalid;
+        const isSnaphotInvalid = isCleanSnapshotInvalid || isDirtySnapshotInvalid;
+        const isInvalid = isTemplateInvalid || isSnaphotInvalid;
+        const isIdle = this.in('idle');
+        return html `
+      <div>
+        ${this.renderTemplateOrSlot('create:before')}
+
+        <vaadin-button
+          data-testid="create"
+          class="w-full"
+          theme="primary success"
+          ?disabled=${!isIdle || isInvalid || this.disabledSelector.matches('create', true)}
+          @click=${this.submit}
+        >
+          <foxy-i18n ns=${this.ns} key="create" lang=${this.lang}></foxy-i18n>
+        </vaadin-button>
+
+        ${this.renderTemplateOrSlot('create:after')}
+      </div>
+    `;
+    }
+    __renderDelete() {
+        return html `
+      <div>
+        <foxy-internal-confirm-dialog
+          data-testid="confirm"
+          message="delete_prompt"
+          confirm="delete"
+          cancel="cancel"
+          header="delete"
+          theme="primary error"
+          lang=${this.lang}
+          ns=${this.ns}
+          id="confirm"
+          @hide=${(evt) => !evt.detail.cancelled && this.delete()}
+        >
+        </foxy-internal-confirm-dialog>
+
+        ${this.renderTemplateOrSlot('delete:before')}
+
+        <vaadin-button
+          data-testid="delete"
+          theme="primary error"
+          class="w-full"
+          ?disabled=${!this.in('idle') || this.disabledSelector.matches('delete', true)}
+          @click=${(evt) => {
+            const confirm = this.renderRoot.querySelector('#confirm');
+            confirm.show(evt.currentTarget);
+        }}
+        >
+          <foxy-i18n ns=${this.ns} key="delete" lang=${this.lang}></foxy-i18n>
+        </vaadin-button>
+
+        ${this.renderTemplateOrSlot('delete:after')}
+      </div>
+    `;
+    }
+}
+//# sourceMappingURL=ReportForm.js.map