@foxy.io/elements 1.17.0 → 1.18.0-beta.10

package/dist/elements/internal/InternalSelectControl/InternalSelectControl.d.ts

@@ -0,0 +1,17 @@
+import type { PropertyDeclarations, TemplateResult } from 'lit-element';
+import type { Option } from './types';
+import { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';
+/**
+ * Internal control wrapper for `vaadin-select` element.
+ *
+ * @since 1.19.0
+ * @element foxy-internal-select-control
+ */
+export declare class InternalSelectControl extends InternalEditableControl {
+    static get properties(): PropertyDeclarations;
+    /** List of radio buttons to render. */
+    options: Option[];
+    /** Same as the "theme" attribute/property of `vaadin-select`. */
+    theme: string | null;
+    renderControl(): TemplateResult;
+}

package/dist/elements/internal/InternalSelectControl/InternalSelectControl.js

@@ -0,0 +1,57 @@
+import { InternalEditableControl } from "../InternalEditableControl/InternalEditableControl.js";
+import { html, render } from 'lit-html';
+import { ifDefined } from 'lit-html/directives/if-defined';
+/**
+ * Internal control wrapper for `vaadin-select` element.
+ *
+ * @since 1.19.0
+ * @element foxy-internal-select-control
+ */
+export class InternalSelectControl extends InternalEditableControl {
+    constructor() {
+        super(...arguments);
+        /** List of radio buttons to render. */
+        this.options = [];
+        /** Same as the "theme" attribute/property of `vaadin-select`. */
+        this.theme = null;
+    }
+    static get properties() {
+        return {
+            ...super.properties,
+            options: { type: Array },
+            theme: { type: String },
+        };
+    }
+    renderControl() {
+        var _a;
+        const renderer = (root) => {
+            const items = this.options.map(({ label, value }) => {
+                return html `<vaadin-item value=${value}>${this.t(label)}</vaadin-item>`;
+            });
+            if (!root.firstElementChild)
+                root.appendChild(document.createElement('vaadin-list-box'));
+            render(items, root.firstElementChild);
+        };
+        return html `
+      <vaadin-select
+        error-message=${ifDefined(this._errorMessage)}
+        placeholder=${this.placeholder}
+        helper-text=${this.helperText}
+        class="w-full -mt-m -mb-xs"
+        label=${this.label}
+        theme=${ifDefined((_a = this.theme) !== null && _a !== void 0 ? _a : undefined)}
+        ?disabled=${this.disabled}
+        ?readonly=${this.readonly}
+        .checkValidity=${this._checkValidity}
+        .renderer=${renderer}
+        .value=${this._value}
+        @change=${(evt) => {
+            const field = evt.currentTarget;
+            this._value = field.value;
+        }}
+      >
+      </vaadin-select>
+    `;
+    }
+}
+//# sourceMappingURL=InternalSelectControl.js.map

package/dist/elements/internal/InternalSelectControl/InternalSelectControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InternalSelectControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalSelectControl/InternalSelectControl.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D;;;;;GAKG;AACH,MAAM,OAAO,qBAAsB,SAAQ,uBAAuB;IAAlE;;QASE,uCAAuC;QACvC,YAAO,GAAa,EAAE,CAAC;QAEvB,iEAAiE;QACjE,UAAK,GAAkB,IAAI,CAAC;IAiC9B,CAAC;IA7CC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACxB,CAAC;IACJ,CAAC;IAQD,aAAa;;QACX,MAAM,QAAQ,GAAG,CAAC,IAAa,EAAE,EAAE;YACjC,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;gBAClD,OAAO,IAAI,CAAA,sBAAsB,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC;YAC1E,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,IAAI,CAAC,iBAAiB;gBAAE,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC,CAAC;YACzF,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,iBAA4B,CAAC,CAAC;QACnD,CAAC,CAAC;QAEF,OAAO,IAAI,CAAA;;wBAES,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;sBAC/B,IAAI,CAAC,WAAW;sBAChB,IAAI,CAAC,UAAU;;gBAErB,IAAI,CAAC,KAAK;gBACV,SAAS,OAAC,IAAI,CAAC,KAAK,mCAAI,SAAS,CAAC;oBAC9B,IAAI,CAAC,QAAQ;oBACb,IAAI,CAAC,QAAQ;yBACR,IAAI,CAAC,cAAc;oBACxB,QAAQ;iBACX,IAAI,CAAC,MAAgB;kBACpB,CAAC,GAAgB,EAAE,EAAE;YAC7B,MAAM,KAAK,GAAG,GAAG,CAAC,aAA8B,CAAC;YACjD,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC;QAC5B,CAAC;;;KAGJ,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { SelectElement } from '@vaadin/vaadin-select';\nimport type { Option } from './types';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { html, render } from 'lit-html';\nimport { ifDefined } from 'lit-html/directives/if-defined';\n\n/**\n * Internal control wrapper for `vaadin-select` element.\n *\n * @since 1.19.0\n * @element foxy-internal-select-control\n */\nexport class InternalSelectControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      options: { type: Array },\n      theme: { type: String },\n    };\n  }\n\n  /** List of radio buttons to render. */\n  options: Option[] = [];\n\n  /** Same as the \"theme\" attribute/property of `vaadin-select`. */\n  theme: string | null = null;\n\n  renderControl(): TemplateResult {\n    const renderer = (root: Element) => {\n      const items = this.options.map(({ label, value }) => {\n        return html`<vaadin-item value=${value}>${this.t(label)}</vaadin-item>`;\n      });\n\n      if (!root.firstElementChild) root.appendChild(document.createElement('vaadin-list-box'));\n      render(items, root.firstElementChild as Element);\n    };\n\n    return html`\n      <vaadin-select\n        error-message=${ifDefined(this._errorMessage)}\n        placeholder=${this.placeholder}\n        helper-text=${this.helperText}\n        class=\"w-full -mt-m -mb-xs\"\n        label=${this.label}\n        theme=${ifDefined(this.theme ?? undefined)}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        .checkValidity=${this._checkValidity}\n        .renderer=${renderer}\n        .value=${this._value as string}\n        @change=${(evt: CustomEvent) => {\n          const field = evt.currentTarget as SelectElement;\n          this._value = field.value;\n        }}\n      >\n      </vaadin-select>\n    `;\n  }\n}\n"]}

package/dist/elements/internal/InternalSelectControl/index.d.ts

@@ -0,0 +1,5 @@
+import '@vaadin/vaadin-select';
+import '../InternalEditableControl/index';
+import '../../public/I18n/index';
+import { InternalSelectControl as Control } from './InternalSelectControl';
+export { Control as InternalSelectControl };

package/dist/elements/internal/InternalSelectControl/index.js

@@ -0,0 +1,7 @@
+import '@vaadin/vaadin-select';
+import "../InternalEditableControl/index.js";
+import "../../public/I18n/index.js";
+import { InternalSelectControl as Control } from "./InternalSelectControl.js";
+customElements.define('foxy-internal-select-control', Control);
+export { Control as InternalSelectControl };
+//# sourceMappingURL=index.js.map

package/dist/elements/internal/InternalSelectControl/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalSelectControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAC;AAE/B,6CAA0C;AAC1C,oCAAiC;AAEjC,OAAO,EAAE,qBAAqB,IAAI,OAAO,EAAE,mCAAgC;AAE3E,cAAc,CAAC,MAAM,CAAC,8BAA8B,EAAE,OAAO,CAAC,CAAC;AAE/D,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-select';\n\nimport '../InternalEditableControl/index';\nimport '../../public/I18n/index';\n\nimport { InternalSelectControl as Control } from './InternalSelectControl';\n\ncustomElements.define('foxy-internal-select-control', Control);\n\nexport { Control as InternalSelectControl };\n"]}

package/dist/elements/internal/InternalSelectControl/types.d.ts

@@ -0,0 +1,6 @@
+export declare type Option = {
+    /** I18n label key for the dropdown item. */
+    label: string;
+    /** Dropdown item value. */
+    value: string;
+};

package/dist/elements/internal/InternalSelectControl/types.js

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

package/dist/elements/internal/InternalSelectControl/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalSelectControl/types.ts"],"names":[],"mappings":"","sourcesContent":["export type Option = {\n  /** I18n label key for the dropdown item. */\n  label: string;\n  /** Dropdown item value. */\n  value: string;\n};\n"]}

package/dist/elements/internal/InternalTextAreaControl/InternalTextAreaControl.d.ts

@@ -0,0 +1,13 @@
+import type { TemplateResult } from 'lit-element';
+import { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';
+/**
+ * Internal control displaying a basic text area box.
+ *
+ * @since 1.17.0
+ * @element foxy-internal-text-area-control
+ */
+export declare class InternalTextAreaControl extends InternalEditableControl {
+    renderControl(): TemplateResult;
+    protected get _value(): string;
+    protected set _value(newValue: string);
+}

package/dist/elements/internal/InternalTextAreaControl/InternalTextAreaControl.js

@@ -0,0 +1,40 @@
+import { InternalEditableControl } from "../InternalEditableControl/InternalEditableControl.js";
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { html } from 'lit-element';
+/**
+ * Internal control displaying a basic text area box.
+ *
+ * @since 1.17.0
+ * @element foxy-internal-text-area-control
+ */
+export class InternalTextAreaControl extends InternalEditableControl {
+    renderControl() {
+        return html `
+      <vaadin-text-area
+        error-message=${ifDefined(this._errorMessage)}
+        helper-text=${this.helperText}
+        placeholder=${this.placeholder}
+        label=${this.label}
+        class="w-full"
+        ?disabled=${this.disabled}
+        ?readonly=${this.readonly}
+        .checkValidity=${this._checkValidity}
+        .value=${this._value}
+        @keydown=${(evt) => { var _a; return evt.key === 'Enter' && ((_a = this.nucleon) === null || _a === void 0 ? void 0 : _a.submit()); }}
+        @input=${(evt) => {
+            const area = evt.currentTarget;
+            this._value = area.value;
+        }}
+      >
+      </vaadin-text-area>
+    `;
+    }
+    get _value() {
+        var _a;
+        return (_a = super._value) !== null && _a !== void 0 ? _a : '';
+    }
+    set _value(newValue) {
+        super._value = newValue;
+    }
+}
+//# sourceMappingURL=InternalTextAreaControl.js.map

package/dist/elements/internal/InternalTextAreaControl/InternalTextAreaControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InternalTextAreaControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTextAreaControl/InternalTextAreaControl.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC;;;;;GAKG;AACH,MAAM,OAAO,uBAAwB,SAAQ,uBAAuB;IAClE,aAAa;QACX,OAAO,IAAI,CAAA;;wBAES,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;sBAC/B,IAAI,CAAC,UAAU;sBACf,IAAI,CAAC,WAAW;gBACtB,IAAI,CAAC,KAAK;;oBAEN,IAAI,CAAC,QAAQ;oBACb,IAAI,CAAC,QAAQ;yBACR,IAAI,CAAC,cAAc;iBAC3B,IAAI,CAAC,MAAM;mBACT,CAAC,GAAkB,EAAE,EAAE,WAAC,OAAA,GAAG,CAAC,GAAG,KAAK,OAAO,WAAI,IAAI,CAAC,OAAO,0CAAE,MAAM,GAAE,CAAA,EAAA;iBACvE,CAAC,GAAgB,EAAE,EAAE;YAC5B,MAAM,IAAI,GAAG,GAAG,CAAC,aAAgC,CAAC;YAClD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC;QAC3B,CAAC;;;KAGJ,CAAC;IACJ,CAAC;IAED,IAAc,MAAM;;QAClB,aAAQ,KAAK,CAAC,MAA6B,mCAAI,EAAE,CAAC;IACpD,CAAC;IAED,IAAc,MAAM,CAAC,QAAgB;QACnC,KAAK,CAAC,MAAM,GAAG,QAA+B,CAAC;IACjD,CAAC;CACF","sourcesContent":["import type { TextAreaElement } from '@vaadin/vaadin-text-field/vaadin-text-area';\nimport type { TemplateResult } from 'lit-element';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-element';\n\n/**\n * Internal control displaying a basic text area box.\n *\n * @since 1.17.0\n * @element foxy-internal-text-area-control\n */\nexport class InternalTextAreaControl extends InternalEditableControl {\n  renderControl(): TemplateResult {\n    return html`\n      <vaadin-text-area\n        error-message=${ifDefined(this._errorMessage)}\n        helper-text=${this.helperText}\n        placeholder=${this.placeholder}\n        label=${this.label}\n        class=\"w-full\"\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        .checkValidity=${this._checkValidity}\n        .value=${this._value}\n        @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.nucleon?.submit()}\n        @input=${(evt: CustomEvent) => {\n          const area = evt.currentTarget as TextAreaElement;\n          this._value = area.value;\n        }}\n      >\n      </vaadin-text-area>\n    `;\n  }\n\n  protected get _value(): string {\n    return (super._value as string | undefined) ?? '';\n  }\n\n  protected set _value(newValue: string) {\n    super._value = newValue as unknown | undefined;\n  }\n}\n"]}

package/dist/elements/internal/InternalTextAreaControl/index.d.ts

@@ -0,0 +1,4 @@
+import '@vaadin/vaadin-text-field/vaadin-text-area';
+import '../InternalEditableControl/index';
+import { InternalTextAreaControl as Control } from './InternalTextAreaControl';
+export { Control as InternalTextAreaControl };

package/dist/elements/internal/InternalTextAreaControl/index.js

@@ -0,0 +1,6 @@
+import '@vaadin/vaadin-text-field/vaadin-text-area';
+import "../InternalEditableControl/index.js";
+import { InternalTextAreaControl as Control } from "./InternalTextAreaControl.js";
+customElements.define('foxy-internal-text-area-control', Control);
+export { Control as InternalTextAreaControl };
+//# sourceMappingURL=index.js.map

package/dist/elements/internal/InternalTextAreaControl/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTextAreaControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,4CAA4C,CAAC;AACpD,6CAA0C;AAC1C,OAAO,EAAE,uBAAuB,IAAI,OAAO,EAAE,qCAAkC;AAE/E,cAAc,CAAC,MAAM,CAAC,iCAAiC,EAAE,OAAO,CAAC,CAAC;AAElE,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-text-field/vaadin-text-area';\nimport '../InternalEditableControl/index';\nimport { InternalTextAreaControl as Control } from './InternalTextAreaControl';\n\ncustomElements.define('foxy-internal-text-area-control', Control);\n\nexport { Control as InternalTextAreaControl };\n"]}

package/dist/elements/internal/InternalTextControl/InternalTextControl.js

@@ -18,6 +18,7 @@ export class InternalTextControl extends InternalEditableControl {
         class="w-full"
         ?disabled=${this.disabled}
         ?readonly=${this.readonly}
+        clear-button-visible
         .checkValidity=${this._checkValidity}
         .value=${this._value}
         @keydown=${(evt) => { var _a; return evt.key === 'Enter' && ((_a = this.nucleon) === null || _a === void 0 ? void 0 : _a.submit()); }}

package/dist/elements/internal/InternalTextControl/InternalTextControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalTextControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTextControl/InternalTextControl.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC;;;;;GAKG;AACH,MAAM,OAAO,mBAAoB,SAAQ,uBAAuB;IAC9D,aAAa;QACX,OAAO,IAAI,CAAA;;wBAES,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;sBAC/B,IAAI,CAAC,UAAU;sBACf,IAAI,CAAC,WAAW;gBACtB,IAAI,CAAC,KAAK;;oBAEN,IAAI,CAAC,QAAQ;oBACb,IAAI,CAAC,QAAQ;yBACR,IAAI,CAAC,cAAc;iBAC3B,IAAI,CAAC,MAAM;mBACT,CAAC,GAAkB,EAAE,EAAE,WAAC,OAAA,GAAG,CAAC,GAAG,KAAK,OAAO,WAAI,IAAI,CAAC,OAAO,0CAAE,MAAM,GAAE,CAAA,EAAA;iBACvE,CAAC,GAAgB,EAAE,EAAE;YAC5B,MAAM,KAAK,GAAG,GAAG,CAAC,aAAiC,CAAC;YACpD,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC;QAC5B,CAAC;;;KAGJ,CAAC;IACJ,CAAC;IAED,IAAc,MAAM;;QAClB,aAAQ,KAAK,CAAC,MAA6B,mCAAI,EAAE,CAAC;IACpD,CAAC;IAED,IAAc,MAAM,CAAC,QAAgB;QACnC,KAAK,CAAC,MAAM,GAAG,QAA+B,CAAC;IACjD,CAAC;CACF","sourcesContent":["import type { TextFieldElement } from '@vaadin/vaadin-text-field';\nimport type { TemplateResult } from 'lit-element';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-element';\n\n/**\n * Internal control displaying a basic text box.\n *\n * @since 1.17.0\n * @element foxy-internal-text-control\n */\nexport class InternalTextControl extends InternalEditableControl {\n  renderControl(): TemplateResult {\n    return html`\n      <vaadin-text-field\n        error-message=${ifDefined(this._errorMessage)}\n        helper-text=${this.helperText}\n        placeholder=${this.placeholder}\n        label=${this.label}\n        class=\"w-full\"\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        .checkValidity=${this._checkValidity}\n        .value=${this._value}\n        @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.nucleon?.submit()}\n        @input=${(evt: CustomEvent) => {\n          const field = evt.currentTarget as TextFieldElement;\n          this._value = field.value;\n        }}\n      >\n      </vaadin-text-field>\n    `;\n  }\n\n  protected get _value(): string {\n    return (super._value as string | undefined) ?? '';\n  }\n\n  protected set _value(newValue: string) {\n    super._value = newValue as unknown | undefined;\n  }\n}\n"]}
+{"version":3,"file":"InternalTextControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTextControl/InternalTextControl.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC;;;;;GAKG;AACH,MAAM,OAAO,mBAAoB,SAAQ,uBAAuB;IAC9D,aAAa;QACX,OAAO,IAAI,CAAA;;wBAES,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;sBAC/B,IAAI,CAAC,UAAU;sBACf,IAAI,CAAC,WAAW;gBACtB,IAAI,CAAC,KAAK;;oBAEN,IAAI,CAAC,QAAQ;oBACb,IAAI,CAAC,QAAQ;;yBAER,IAAI,CAAC,cAAc;iBAC3B,IAAI,CAAC,MAAM;mBACT,CAAC,GAAkB,EAAE,EAAE,WAAC,OAAA,GAAG,CAAC,GAAG,KAAK,OAAO,WAAI,IAAI,CAAC,OAAO,0CAAE,MAAM,GAAE,CAAA,EAAA;iBACvE,CAAC,GAAgB,EAAE,EAAE;YAC5B,MAAM,KAAK,GAAG,GAAG,CAAC,aAAiC,CAAC;YACpD,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC;QAC5B,CAAC;;;KAGJ,CAAC;IACJ,CAAC;IAED,IAAc,MAAM;;QAClB,aAAQ,KAAK,CAAC,MAA6B,mCAAI,EAAE,CAAC;IACpD,CAAC;IAED,IAAc,MAAM,CAAC,QAAgB;QACnC,KAAK,CAAC,MAAM,GAAG,QAA+B,CAAC;IACjD,CAAC;CACF","sourcesContent":["import type { TextFieldElement } from '@vaadin/vaadin-text-field';\nimport type { TemplateResult } from 'lit-element';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-element';\n\n/**\n * Internal control displaying a basic text box.\n *\n * @since 1.17.0\n * @element foxy-internal-text-control\n */\nexport class InternalTextControl extends InternalEditableControl {\n  renderControl(): TemplateResult {\n    return html`\n      <vaadin-text-field\n        error-message=${ifDefined(this._errorMessage)}\n        helper-text=${this.helperText}\n        placeholder=${this.placeholder}\n        label=${this.label}\n        class=\"w-full\"\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        clear-button-visible\n        .checkValidity=${this._checkValidity}\n        .value=${this._value}\n        @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && this.nucleon?.submit()}\n        @input=${(evt: CustomEvent) => {\n          const field = evt.currentTarget as TextFieldElement;\n          this._value = field.value;\n        }}\n      >\n      </vaadin-text-field>\n    `;\n  }\n\n  protected get _value(): string {\n    return (super._value as string | undefined) ?? '';\n  }\n\n  protected set _value(newValue: string) {\n    super._value = newValue as unknown | undefined;\n  }\n}\n"]}

package/dist/elements/private/I18N/I18N.js

@@ -23,6 +23,9 @@ export class I18N extends Translatable {
             super.styles,
             css `:host{
   display:inline-block;
+  color:inherit;
+  line-height:inherit;
+  font:inherit;
 }
       `,
         ];

package/dist/elements/private/I18N/I18N.js.map

@@ -1 +1 @@
-{"version":3,"file":"I18N.js","sourceRoot":"","sources":["../../../../src/elements/private/I18N/I18N.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAwC,MAAM,aAAa,CAAC;AAC9F,OAAO,EAAE,YAAY,EAAE,wCAAqC;AAC5D,OAAO,EAAE,QAAQ,EAAE,gCAA6B;AAKhD,MAAM,OAAO,IAAK,SAAQ,YAAY;IAAtC;;QA0BS,QAAG,GAAG,EAAE,CAAC;IAelB,CAAC;IAxCQ,MAAM,KAAK,cAAc;QAC9B,OAAO;YACL,YAAY,EAAE,QAAQ;SACvB,CAAC;IACJ,CAAC;IAEM,MAAM,KAAK,UAAU;QAC1B,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;YACpC,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACvB,CAAC;IACJ,CAAC;IAEM,MAAM,KAAK,MAAM;QACtB,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;OAIF;SACF,CAAC;IACJ,CAAC;IAMD,IAAW,SAAS;QAClB,OAAO,IAAI,CAAC,cAAe,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC9D,CAAC;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;SAC3D;aAAM;YACL,OAAO,IAAI,CAAA,6BAA6B,IAAI,CAAC,GAAG,4BAA4B,CAAC;SAC9E;IACH,CAAC;CACF","sourcesContent":["import { ScopedElementsMap } from '@open-wc/scoped-elements';\nimport { TOptions } from 'i18next';\nimport { css, CSSResultArray, html, TemplateResult, PropertyDeclarations } from 'lit-element';\nimport { Translatable } from '../../../mixins/translatable';\nimport { Skeleton } from '../Skeleton/Skeleton';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type I18NOptions = TOptions<any>;\n\nexport class I18N extends Translatable {\n  public static get scopedElements(): ScopedElementsMap {\n    return {\n      'x-skeleton': Skeleton,\n    };\n  }\n\n  public static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      key: { type: String, reflect: true },\n      opts: { type: Object },\n    };\n  }\n\n  public static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        :host {\n          display: inline-block;\n        }\n      `,\n    ];\n  }\n\n  public key = '';\n\n  public opts?: I18NOptions;\n\n  public get whenReady(): Promise<unknown> {\n    return this._whenI18nReady!.then(() => this.updateComplete);\n  }\n\n  public render(): TemplateResult {\n    if (this._isI18nReady) {\n      return html`${this._t(this.key, this.opts)}<slot></slot>`;\n    } else {\n      return html`<x-skeleton class=\"block\">${this.key}<slot></slot></x-skeleton>`;\n    }\n  }\n}\n"]}
+{"version":3,"file":"I18N.js","sourceRoot":"","sources":["../../../../src/elements/private/I18N/I18N.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAwC,MAAM,aAAa,CAAC;AAC9F,OAAO,EAAE,YAAY,EAAE,wCAAqC;AAC5D,OAAO,EAAE,QAAQ,EAAE,gCAA6B;AAKhD,MAAM,OAAO,IAAK,SAAQ,YAAY;IAAtC;;QA6BS,QAAG,GAAG,EAAE,CAAC;IAelB,CAAC;IA3CQ,MAAM,KAAK,cAAc;QAC9B,OAAO;YACL,YAAY,EAAE,QAAQ;SACvB,CAAC;IACJ,CAAC;IAEM,MAAM,KAAK,UAAU;QAC1B,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;YACpC,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACvB,CAAC;IACJ,CAAC;IAEM,MAAM,KAAK,MAAM;QACtB,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;;;;OAOF;SACF,CAAC;IACJ,CAAC;IAMD,IAAW,SAAS;QAClB,OAAO,IAAI,CAAC,cAAe,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC9D,CAAC;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;SAC3D;aAAM;YACL,OAAO,IAAI,CAAA,6BAA6B,IAAI,CAAC,GAAG,4BAA4B,CAAC;SAC9E;IACH,CAAC;CACF","sourcesContent":["import { ScopedElementsMap } from '@open-wc/scoped-elements';\nimport { TOptions } from 'i18next';\nimport { css, CSSResultArray, html, TemplateResult, PropertyDeclarations } from 'lit-element';\nimport { Translatable } from '../../../mixins/translatable';\nimport { Skeleton } from '../Skeleton/Skeleton';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type I18NOptions = TOptions<any>;\n\nexport class I18N extends Translatable {\n  public static get scopedElements(): ScopedElementsMap {\n    return {\n      'x-skeleton': Skeleton,\n    };\n  }\n\n  public static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      key: { type: String, reflect: true },\n      opts: { type: Object },\n    };\n  }\n\n  public static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        :host {\n          display: inline-block;\n          color: inherit;\n          line-height: inherit;\n          font: inherit;\n        }\n      `,\n    ];\n  }\n\n  public key = '';\n\n  public opts?: I18NOptions;\n\n  public get whenReady(): Promise<unknown> {\n    return this._whenI18nReady!.then(() => this.updateComplete);\n  }\n\n  public render(): TemplateResult {\n    if (this._isI18nReady) {\n      return html`${this._t(this.key, this.opts)}<slot></slot>`;\n    } else {\n      return html`<x-skeleton class=\"block\">${this.key}<slot></slot></x-skeleton>`;\n    }\n  }\n}\n"]}

package/dist/elements/private/Switch/Switch.js

@@ -31,7 +31,7 @@ export class Switch extends LitElement {
             'cursor-pointer': !this.disabled,
         })}
       >
-        <span class="text-body text-m mr-m">
+        <span class="text-body font-semibold text-m mr-m">
           <slot></slot>
         </span>
 

package/dist/elements/private/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/elements/private/Switch/Switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,UAAU,EAAwB,MAAM,aAAa,CAAC;AAC1F,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,qCAAkC;AACtD,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD,MAAM,OAAO,iBAAkB,SAAQ,WAAoB;IACzD,YAAY,MAAe;QACzB,KAAK,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;IAC9B,CAAC;CACF;AAED,MAAM,OAAO,MAAO,SAAQ,UAAU;IAAtC;;QAaS,aAAQ,GAAG,KAAK,CAAC;QAEjB,YAAO,GAAG,KAAK,CAAC;IA+CzB,CAAC;IA7DQ,MAAM,KAAK,UAAU;QAC1B,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,QAAQ,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YAC9B,OAAO,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAC9B,CAAC;IACJ,CAAC;IAEM,MAAM,KAAK,MAAM;QACtB,OAAO,SAAS,CAAC,MAAM,CAAC;IAC1B,CAAC;IAMM,MAAM;QACX,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC;YACf,iEAAiE,EAAE,IAAI;YACvE,gBAAgB,EAAE,CAAC,IAAI,CAAC,QAAQ;SACjC,CAAC;;;;;;;;kBAQQ,QAAQ,CAAC;YACf,kEAAkE,EAAE,IAAI;YACxE,gDAAgD,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO;YAChF,4CAA4C,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;YAC5E,gBAAgB,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;SAClD,CAAC;;;;oBAIQ,QAAQ,CAAC;YACf,mEAAmE,EAAE,IAAI;YACzE,eAAe,EAAE,IAAI,CAAC,OAAO;YAC7B,eAAe,EAAE,CAAC,IAAI,CAAC,OAAO;YAC9B,sDAAsD,EAAE,CAAC,IAAI,CAAC,QAAQ;SACvE,CAAC;;;;;;uBAMS,IAAI,CAAC,OAAO;wBACX,IAAI,CAAC,QAAQ;sBACf,GAAG,EAAE;YACb,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;YAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1D,CAAC;;;;KAIR,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { CSSResult, CSSResultArray, LitElement, PropertyDeclarations } from 'lit-element';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { Themeable } from '../../../mixins/themeable';\nimport { classMap } from '../../../utils/class-map';\n\nexport class SwitchChangeEvent extends CustomEvent<boolean> {\n  constructor(detail: boolean) {\n    super('change', { detail });\n  }\n}\n\nexport class Switch extends LitElement {\n  public static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      disabled: { attribute: false },\n      checked: { attribute: false },\n    };\n  }\n\n  public static get styles(): CSSResult | CSSResultArray {\n    return Themeable.styles;\n  }\n\n  public disabled = false;\n\n  public checked = false;\n\n  public render(): TemplateResult {\n    return html`\n      <label\n        class=${classMap({\n          'transition duration-200 flex justify-between items-center group': true,\n          'cursor-pointer': !this.disabled,\n        })}\n      >\n        <span class=\"text-body text-m mr-m\">\n          <slot></slot>\n        </span>\n\n        <span\n          style=\"border-radius: var(--lumo-size-xl); width: calc((var(--lumo-space-l) * 2) + (var(--lumo-space-xs) * 2))\"\n          class=${classMap({\n            'transition duration-150 relative flex flex-shrink-0 items-center': true,\n            'bg-success focus-within-shadow-outline-success': !this.disabled && this.checked,\n            'bg-contrast-10 focus-within-shadow-outline': this.disabled || !this.checked,\n            'bg-contrast-20': !this.disabled && !this.checked,\n          })}\n        >\n          <span\n            style=\"width: var(--lumo-space-l); height: var(--lumo-space-l)\"\n            class=${classMap({\n              'bg-tint transition duration-200 transform block rounded-full m-xs': true,\n              'translate-x-l': this.checked,\n              'translate-x-0': !this.checked,\n              'shadow-xs group-hover-shadow-s group-hover-scale-110': !this.disabled,\n            })}\n          ></span>\n\n          <input\n            type=\"checkbox\"\n            class=\"opacity-0 absolute inset-0\"\n            .checked=${this.checked}\n            .disabled=${this.disabled}\n            @change=${() => {\n              this.checked = !this.checked;\n              this.dispatchEvent(new SwitchChangeEvent(this.checked));\n            }}\n          />\n        </span>\n      </label>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/elements/private/Switch/Switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,UAAU,EAAwB,MAAM,aAAa,CAAC;AAC1F,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,qCAAkC;AACtD,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD,MAAM,OAAO,iBAAkB,SAAQ,WAAoB;IACzD,YAAY,MAAe;QACzB,KAAK,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;IAC9B,CAAC;CACF;AAED,MAAM,OAAO,MAAO,SAAQ,UAAU;IAAtC;;QAaS,aAAQ,GAAG,KAAK,CAAC;QAEjB,YAAO,GAAG,KAAK,CAAC;IA+CzB,CAAC;IA7DQ,MAAM,KAAK,UAAU;QAC1B,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,QAAQ,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YAC9B,OAAO,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAC9B,CAAC;IACJ,CAAC;IAEM,MAAM,KAAK,MAAM;QACtB,OAAO,SAAS,CAAC,MAAM,CAAC;IAC1B,CAAC;IAMM,MAAM;QACX,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC;YACf,iEAAiE,EAAE,IAAI;YACvE,gBAAgB,EAAE,CAAC,IAAI,CAAC,QAAQ;SACjC,CAAC;;;;;;;;kBAQQ,QAAQ,CAAC;YACf,kEAAkE,EAAE,IAAI;YACxE,gDAAgD,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO;YAChF,4CAA4C,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;YAC5E,gBAAgB,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO;SAClD,CAAC;;;;oBAIQ,QAAQ,CAAC;YACf,mEAAmE,EAAE,IAAI;YACzE,eAAe,EAAE,IAAI,CAAC,OAAO;YAC7B,eAAe,EAAE,CAAC,IAAI,CAAC,OAAO;YAC9B,sDAAsD,EAAE,CAAC,IAAI,CAAC,QAAQ;SACvE,CAAC;;;;;;uBAMS,IAAI,CAAC,OAAO;wBACX,IAAI,CAAC,QAAQ;sBACf,GAAG,EAAE;YACb,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;YAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1D,CAAC;;;;KAIR,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { CSSResult, CSSResultArray, LitElement, PropertyDeclarations } from 'lit-element';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { Themeable } from '../../../mixins/themeable';\nimport { classMap } from '../../../utils/class-map';\n\nexport class SwitchChangeEvent extends CustomEvent<boolean> {\n  constructor(detail: boolean) {\n    super('change', { detail });\n  }\n}\n\nexport class Switch extends LitElement {\n  public static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      disabled: { attribute: false },\n      checked: { attribute: false },\n    };\n  }\n\n  public static get styles(): CSSResult | CSSResultArray {\n    return Themeable.styles;\n  }\n\n  public disabled = false;\n\n  public checked = false;\n\n  public render(): TemplateResult {\n    return html`\n      <label\n        class=${classMap({\n          'transition duration-200 flex justify-between items-center group': true,\n          'cursor-pointer': !this.disabled,\n        })}\n      >\n        <span class=\"text-body font-semibold text-m mr-m\">\n          <slot></slot>\n        </span>\n\n        <span\n          style=\"border-radius: var(--lumo-size-xl); width: calc((var(--lumo-space-l) * 2) + (var(--lumo-space-xs) * 2))\"\n          class=${classMap({\n            'transition duration-150 relative flex flex-shrink-0 items-center': true,\n            'bg-success focus-within-shadow-outline-success': !this.disabled && this.checked,\n            'bg-contrast-10 focus-within-shadow-outline': this.disabled || !this.checked,\n            'bg-contrast-20': !this.disabled && !this.checked,\n          })}\n        >\n          <span\n            style=\"width: var(--lumo-space-l); height: var(--lumo-space-l)\"\n            class=${classMap({\n              'bg-tint transition duration-200 transform block rounded-full m-xs': true,\n              'translate-x-l': this.checked,\n              'translate-x-0': !this.checked,\n              'shadow-xs group-hover-shadow-s group-hover-scale-110': !this.disabled,\n            })}\n          ></span>\n\n          <input\n            type=\"checkbox\"\n            class=\"opacity-0 absolute inset-0\"\n            .checked=${this.checked}\n            .disabled=${this.disabled}\n            @change=${() => {\n              this.checked = !this.checked;\n              this.dispatchEvent(new SwitchChangeEvent(this.checked));\n            }}\n          />\n        </span>\n      </label>\n    `;\n  }\n}\n"]}

package/dist/elements/public/CustomerPortal/InternalCustomerPortalLoggedInView.js

@@ -2,6 +2,7 @@ import { ConfigurableMixin } from "../../../mixins/configurable.js";
 import { html } from 'lit-html';
 import { API } from "../NucleonElement/API.js";
 import { NucleonElement } from "../NucleonElement/NucleonElement.js";
+import { BooleanSelector } from '@foxy.io/sdk/core';
 import { ThemeableMixin } from "../../../mixins/themeable.js";
 import { TranslatableMixin } from "../../../mixins/translatable.js";
 const Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement)));
@@ -127,28 +128,14 @@ export class InternalCustomerPortalLoggedInView extends Base {
     render() {
         var _a, _b;
         const hiddenSelector = this.hiddenSelector.zoom('customer');
-        const optionallyHiddenInCustomer = ['payment-methods'];
-        const alwaysHiddenInCustomer = [
-            'attributes',
-            'transactions',
-            'subscriptions',
-            'addresses:actions:create',
-            'header:actions:edit:form:delete',
-        ];
-        const customerHiddenControls = [
-            ...optionallyHiddenInCustomer
-                .filter(id => hiddenSelector.matches(id))
-                .map(id => `${id}:${hiddenSelector.zoom(id)}`),
-            ...alwaysHiddenInCustomer.map(id => {
-                const splitId = id.split(':');
-                for (let i = 0; i < splitId.length; ++i) {
-                    const hostId = splitId.slice(0, i + 1).join(':');
-                    if (hiddenSelector.matches(hostId, true))
-                        return hostId;
-                }
-                return id;
-            }),
-        ];
+        const customerHiddenControls = new BooleanSelector(`
+      attributes
+      transactions
+      subscriptions
+      addresses:actions:create
+      header:actions:edit:form:delete
+      ${hiddenSelector.toString()}
+    `).toString();
         const templates = this.getNestedTemplates('customer');
         const originalHeaderActionsAfterTemplate = templates['header:actions:after'];
         const originalTimestampsAfterTemplate = templates['header:actions:edit:form:timestamps:after'];
@@ -211,7 +198,7 @@ export class InternalCustomerPortalLoggedInView extends Base {
       <foxy-customer
         readonlycontrols=${this.readonlySelector.zoom('customer').toString()}
         disabledcontrols=${this.disabledSelector.zoom('customer').toString()}
-        hiddencontrols=${customerHiddenControls.join(' ')}
+        hiddencontrols=${customerHiddenControls}
         data-testid="customer"
         group=${this.group}
         href=${this.customer}

package/dist/elements/public/CustomerPortal/InternalCustomerPortalLoggedInView.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalCustomerPortalLoggedInView.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomerPortal/InternalCustomerPortalLoggedInView.ts"],"names":[],"mappings":"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","sourcesContent":["import { ConfigurableMixin, Renderer } from '../../../mixins/configurable';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { API } from '../NucleonElement/API';\nimport { Customer } from '../Customer/Customer';\nimport { Templates as CustomerTemplates } from '../Customer/types';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { PropertyDeclarations } from 'lit-element';\nimport { Rels } from '@foxy.io/sdk/customer';\nimport { Resource } from '@foxy.io/sdk/core';\nimport { Templates } from './types';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\n\nconst Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement)));\ntype Data = Resource<Rels.CustomerPortalSettings>;\n\nexport class InternalCustomerPortalLoggedInView extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      customer: { type: String },\n      loggingOutState: { attribute: false },\n      loggingOutStateResetTimeout: { attribute: false },\n    };\n  }\n\n  templates: Templates = {};\n\n  customer = '';\n\n  loggingOutState: 'idle' | 'busy' | 'fail' = 'idle';\n\n  loggingOutStateResetTimeout: NodeJS.Timeout | null = null;\n\n  private readonly __renderHeaderActionsSignOut = () => {\n    const scope = 'customer:header:actions:sign-out';\n    const state = this.loggingOutState;\n\n    const isDisabled =\n      this.disabledSelector.matches(scope) ||\n      !this.__customerElement?.in({ idle: 'snapshot' }) ||\n      state !== 'idle';\n\n    const handleClick = async () => {\n      try {\n        this.loggingOutState = 'busy';\n        await new API(this).fetch('foxy://customer-api/session', { method: 'DELETE' });\n        this.loggingOutState = 'idle';\n      } catch {\n        this.loggingOutState = 'fail';\n        this.loggingOutStateResetTimeout = setTimeout(() => {\n          this.loggingOutState = 'idle';\n          this.loggingOutStateResetTimeout = null;\n        }, 1000);\n      }\n    };\n\n    const style = {\n      'border-radius': '100%',\n      'padding': 'var(--lumo-space-xs)',\n      'display': 'flex',\n      'margin': '0',\n      'cursor': isDisabled ? 'default' : 'pointer',\n    };\n\n    return html`\n      <div style=\"display: flex; margin-left: var(--lumo-space-m)\">\n        ${this.renderTemplateOrSlot(`${scope}:before`)}\n\n        <vaadin-button\n          data-testid=\"sign-out\"\n          aria-label=${this.t('sign_out').toString()}\n          style=${Object.entries(style).reduce((p, [k, v]) => `${p}${k}:${v};`, '')}\n          theme=\"icon\"\n          ?disabled=${isDisabled}\n          @click=${handleClick}\n        >\n          ${state === 'idle'\n            ? html`<iron-icon icon=\"icons:exit-to-app\"></iron-icon>`\n            : html`\n                <foxy-spinner\n                  layout=\"no-label\"\n                  state=${state === 'fail' ? 'error' : 'busy'}\n                  style=\"margin: auto\"\n                  lang=${this.lang}\n                  ns=${[\n                    this.ns,\n                    customElements.get('foxy-customer')?.defaultNS ?? '',\n                    customElements.get('foxy-spinner')?.defaultNS ?? '',\n                  ].join(' ')}\n                >\n                </foxy-spinner>\n              `}\n        </vaadin-button>\n\n        ${this.renderTemplateOrSlot(`${scope}:after`)}\n      </div>\n    `;\n  };\n\n  private readonly __renderSubscriptions: Renderer<Customer> = (html, host) => {\n    const scope = 'customer:subscriptions';\n\n    return html`\n      ${this.renderTemplateOrSlot(`${scope}:before`)}\n\n      <foxy-internal-customer-portal-subscriptions\n        readonlycontrols=${this.readonlySelector.zoom(scope).toString()}\n        disabledcontrols=${this.disabledSelector.zoom(scope).toString()}\n        hiddencontrols=${this.hiddenSelector.zoom(scope).toString()}\n        group=${host.group}\n        lang=${host.lang}\n        ns=${host.ns}\n        .templates=${this.getNestedTemplates(scope)}\n        .settings=${this.data}\n        .customer=${host.data}\n      >\n      </foxy-internal-customer-portal-subscriptions>\n\n      ${this.renderTemplateOrSlot(`${scope}:after`)}\n    `;\n  };\n\n  private readonly __renderTransactions: Renderer<Customer> = (html, host) => {\n    const scope = 'customer:transactions';\n\n    return html`\n      ${this.renderTemplateOrSlot(`${scope}:before`)}\n\n      <foxy-internal-customer-portal-transactions\n        readonlycontrols=${this.readonlySelector.zoom(scope).toString()}\n        disabledcontrols=${this.disabledSelector.zoom(scope).toString()}\n        hiddencontrols=${this.hiddenSelector.zoom(scope).toString()}\n        group=${host.group}\n        lang=${host.lang}\n        ns=${host.ns}\n        .templates=${this.getNestedTemplates(scope)}\n        .customer=${host.data}\n      >\n      </foxy-internal-customer-portal-transactions>\n\n      ${this.renderTemplateOrSlot(`${scope}:after`)}\n    `;\n  };\n\n  render(): TemplateResult {\n    const hiddenSelector = this.hiddenSelector.zoom('customer');\n    const optionallyHiddenInCustomer = ['payment-methods'];\n    const alwaysHiddenInCustomer = [\n      'attributes',\n      'transactions',\n      'subscriptions',\n      'addresses:actions:create',\n      'header:actions:edit:form:delete',\n    ];\n\n    const customerHiddenControls = [\n      ...optionallyHiddenInCustomer\n        .filter(id => hiddenSelector.matches(id))\n        .map(id => `${id}:${hiddenSelector.zoom(id)}`),\n\n      ...alwaysHiddenInCustomer.map(id => {\n        const splitId = id.split(':');\n\n        for (let i = 0; i < splitId.length; ++i) {\n          const hostId = splitId.slice(0, i + 1).join(':');\n          if (hiddenSelector.matches(hostId, true)) return hostId;\n        }\n\n        return id;\n      }),\n    ];\n\n    const templates: CustomerTemplates = this.getNestedTemplates('customer');\n    const originalHeaderActionsAfterTemplate = templates['header:actions:after'];\n    const originalTimestampsAfterTemplate = templates['header:actions:edit:form:timestamps:after'];\n    const originalDefaultTemplate = templates['default'];\n\n    templates['header:actions:after'] = (html, host) => {\n      const isSignOutHidden = hiddenSelector.matches('header:actions:sign-out', true);\n      return html`\n        <div style=\"display:flex\">\n          ${isSignOutHidden ? '' : this.__renderHeaderActionsSignOut()}\n          ${originalHeaderActionsAfterTemplate?.(html, host)}\n        </div>\n      `;\n    };\n\n    templates['default'] = (html, host) => {\n      const renderSubscriptions = this.__renderSubscriptions;\n      const renderTransactions = this.__renderTransactions;\n\n      return html`\n        <style>\n          .space-y-m > :not([hidden]) ~ :not([hidden]) {\n            --tw-space-y-reverse: 0;\n            margin-top: calc(var(--lumo-space-m, 1rem) * calc(1 - var(--tw-space-y-reverse)));\n            margin-bottom: calc(var(--lumo-space-m, 1rem) * var(--tw-space-y-reverse));\n          }\n        </style>\n\n        ${hiddenSelector.matches('default', true) ? '' : originalDefaultTemplate?.(html, host)}\n\n        <div class=\"space-y-m\">\n          ${hiddenSelector.matches('subscriptions', true) ? '' : renderSubscriptions(html, host)}\n          ${hiddenSelector.matches('transactions', true) ? '' : renderTransactions(html, host)}\n        </div>\n      `;\n    };\n\n    templates['header:actions:edit:form:timestamps:after'] = (html, host) => {\n      const scope = 'change-password';\n\n      return html`\n        ${originalTimestampsAfterTemplate?.(html, host)}\n        ${host.hiddenSelector.matches(scope, true)\n          ? ''\n          : html`\n              ${host.renderTemplateOrSlot(`${scope}:before`)}\n\n              <foxy-internal-customer-portal-change-password\n                customer=${host.href}\n                session=\"foxy://customer-api/session\"\n                style=\"margin-top: var(--lumo-space-l)\"\n                email=${host.data?.email ?? ''}\n                lang=${host.lang}\n                ns=${host.ns}\n                ?disabled=${host.in('busy') || host.disabledSelector.matches(scope, true)}\n              >\n              </foxy-internal-customer-portal-change-password>\n\n              ${host.renderTemplateOrSlot(`${scope}:after`)}\n            `}\n      `;\n    };\n\n    return html`\n      <foxy-customer\n        readonlycontrols=${this.readonlySelector.zoom('customer').toString()}\n        disabledcontrols=${this.disabledSelector.zoom('customer').toString()}\n        hiddencontrols=${customerHiddenControls.join(' ')}\n        data-testid=\"customer\"\n        group=${this.group}\n        href=${this.customer}\n        lang=${this.lang}\n        ns=\"${this.ns} ${customElements.get('foxy-customer')?.defaultNS ?? ''}\"\n        id=\"customer\"\n        .templates=${templates}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-customer>\n    `;\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    if (this.loggingOutStateResetTimeout) clearTimeout(this.loggingOutStateResetTimeout);\n  }\n\n  private get __customerElement() {\n    return this.renderRoot.querySelector<Customer>('#customer');\n  }\n}\n"]}
+{"version":3,"file":"InternalCustomerPortalLoggedInView.js","sourceRoot":"","sources":["../../../../src/elements/public/CustomerPortal/InternalCustomerPortalLoggedInView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAY,wCAAqC;AAC3E,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,GAAG,EAAE,iCAA8B;AAG5C,OAAO,EAAE,cAAc,EAAE,4CAAyC;AAGlE,OAAO,EAAE,eAAe,EAAY,MAAM,mBAAmB,CAAC;AAE9D,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AAEjE,MAAM,IAAI,GAAG,cAAc,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;AAGlF,MAAM,OAAO,kCAAmC,SAAQ,IAAU;IAAlE;;QAUE,cAAS,GAAc,EAAE,CAAC;QAE1B,aAAQ,GAAG,EAAE,CAAC;QAEd,oBAAe,GAA6B,MAAM,CAAC;QAEnD,gCAA2B,GAA0B,IAAI,CAAC;QAEzC,iCAA4B,GAAG,GAAG,EAAE;;YACnD,MAAM,KAAK,GAAG,kCAAkC,CAAC;YACjD,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC;YAEnC,MAAM,UAAU,GACd,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,KAAK,CAAC;gBACpC,QAAC,IAAI,CAAC,iBAAiB,0CAAE,EAAE,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAC;gBACjD,KAAK,KAAK,MAAM,CAAC;YAEnB,MAAM,WAAW,GAAG,KAAK,IAAI,EAAE;gBAC7B,IAAI;oBACF,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC;oBAC9B,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,6BAA6B,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC;oBAC/E,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC;iBAC/B;gBAAC,WAAM;oBACN,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC;oBAC9B,IAAI,CAAC,2BAA2B,GAAG,UAAU,CAAC,GAAG,EAAE;wBACjD,IAAI,CAAC,eAAe,GAAG,MAAM,CAAC;wBAC9B,IAAI,CAAC,2BAA2B,GAAG,IAAI,CAAC;oBAC1C,CAAC,EAAE,IAAI,CAAC,CAAC;iBACV;YACH,CAAC,CAAC;YAEF,MAAM,KAAK,GAAG;gBACZ,eAAe,EAAE,MAAM;gBACvB,SAAS,EAAE,sBAAsB;gBACjC,SAAS,EAAE,MAAM;gBACjB,QAAQ,EAAE,GAAG;gBACb,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;aAC7C,CAAC;YAEF,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,SAAS,CAAC;;;;uBAI/B,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,QAAQ,EAAE;kBAClC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC;;sBAE7D,UAAU;mBACb,WAAW;;YAElB,KAAK,KAAK,MAAM;gBAChB,CAAC,CAAC,IAAI,CAAA,kDAAkD;gBACxD,CAAC,CAAC,IAAI,CAAA;;;0BAGQ,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;;yBAEpC,IAAI,CAAC,IAAI;uBACX;oBACH,IAAI,CAAC,EAAE;gCACP,cAAc,CAAC,GAAG,CAAC,eAAe,CAAC,0CAAE,SAAS,mCAAI,EAAE;gCACpD,cAAc,CAAC,GAAG,CAAC,cAAc,CAAC,0CAAE,SAAS,mCAAI,EAAE;iBACpD,CAAC,IAAI,CAAC,GAAG,CAAC;;;eAGd;;;UAGL,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,QAAQ,CAAC;;KAEhD,CAAC;QACJ,CAAC,CAAC;QAEe,0BAAqB,GAAuB,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;YAC1E,MAAM,KAAK,GAAG,wBAAwB,CAAC;YAEvC,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,SAAS,CAAC;;;2BAGzB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;2BAC5C,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;yBAC9C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;gBACnD,IAAI,CAAC,KAAK;eACX,IAAI,CAAC,IAAI;aACX,IAAI,CAAC,EAAE;qBACC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;oBAC/B,IAAI,CAAC,IAAI;oBACT,IAAI,CAAC,IAAI;;;;QAIrB,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,QAAQ,CAAC;KAC9C,CAAC;QACJ,CAAC,CAAC;QAEe,yBAAoB,GAAuB,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;YACzE,MAAM,KAAK,GAAG,uBAAuB,CAAC;YAEtC,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,SAAS,CAAC;;;2BAGzB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;2BAC5C,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;yBAC9C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;gBACnD,IAAI,CAAC,KAAK;eACX,IAAI,CAAC,IAAI;aACX,IAAI,CAAC,EAAE;qBACC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;oBAC/B,IAAI,CAAC,IAAI;;;;QAIrB,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,QAAQ,CAAC;KAC9C,CAAC;QACJ,CAAC,CAAC;IAsGJ,CAAC;IApOC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,QAAQ,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YAC1B,eAAe,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YACrC,2BAA2B,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAClD,CAAC;IACJ,CAAC;IAyHD,MAAM;;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC5D,MAAM,sBAAsB,GAAG,IAAI,eAAe,CAAC;;;;;;QAM/C,cAAc,CAAC,QAAQ,EAAE;KAC5B,CAAC,CAAC,QAAQ,EAAE,CAAC;QAEd,MAAM,SAAS,GAAsB,IAAI,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAC;QACzE,MAAM,kCAAkC,GAAG,SAAS,CAAC,sBAAsB,CAAC,CAAC;QAC7E,MAAM,+BAA+B,GAAG,SAAS,CAAC,2CAA2C,CAAC,CAAC;QAC/F,MAAM,uBAAuB,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;QAErD,SAAS,CAAC,sBAAsB,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;YACjD,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,CAAC,yBAAyB,EAAE,IAAI,CAAC,CAAC;YAChF,OAAO,IAAI,CAAA;;YAEL,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,4BAA4B,EAAE;YAC1D,kCAAkC,aAAlC,kCAAkC,uBAAlC,kCAAkC,CAAG,IAAI,EAAE,IAAI,CAAC;;OAErD,CAAC;QACJ,CAAC,CAAC;QAEF,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;YACpC,MAAM,mBAAmB,GAAG,IAAI,CAAC,qBAAqB,CAAC;YACvD,MAAM,kBAAkB,GAAG,IAAI,CAAC,oBAAoB,CAAC;YAErD,OAAO,IAAI,CAAA;;;;;;;;;UASP,cAAc,CAAC,OAAO,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAG,IAAI,EAAE,IAAI,CAAC;;;YAGlF,cAAc,CAAC,OAAO,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,CAAC,IAAI,EAAE,IAAI,CAAC;YACpF,cAAc,CAAC,OAAO,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC;;OAEvF,CAAC;QACJ,CAAC,CAAC;QAEF,SAAS,CAAC,2CAA2C,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;;YACtE,MAAM,KAAK,GAAG,iBAAiB,CAAC;YAEhC,OAAO,IAAI,CAAA;UACP,+BAA+B,aAA/B,+BAA+B,uBAA/B,+BAA+B,CAAG,IAAI,EAAE,IAAI,CAAC;UAC7C,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC;gBACxC,CAAC,CAAC,EAAE;gBACJ,CAAC,CAAC,IAAI,CAAA;gBACA,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,SAAS,CAAC;;;2BAGjC,IAAI,CAAC,IAAI;;;wBAGZ,YAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,mCAAI,EAAE;uBACvB,IAAI,CAAC,IAAI;qBACX,IAAI,CAAC,EAAE;4BACA,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC;;;;gBAIzE,IAAI,CAAC,oBAAoB,CAAC,GAAG,KAAK,QAAQ,CAAC;aAC9C;OACN,CAAC;QACJ,CAAC,CAAC;QAEF,OAAO,IAAI,CAAA;;2BAEY,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,QAAQ,EAAE;2BACjD,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,QAAQ,EAAE;yBACnD,sBAAsB;;gBAE/B,IAAI,CAAC,KAAK;eACX,IAAI,CAAC,QAAQ;eACb,IAAI,CAAC,IAAI;cACV,IAAI,CAAC,EAAE,IAAI,YAAA,cAAc,CAAC,GAAG,CAAC,eAAe,CAAC,0CAAE,SAAS,mCAAI,EAAE;;qBAExD,SAAS;kBACZ,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE;;;KAGvC,CAAC;IACJ,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,IAAI,IAAI,CAAC,2BAA2B;YAAE,YAAY,CAAC,IAAI,CAAC,2BAA2B,CAAC,CAAC;IACvF,CAAC;IAED,IAAY,iBAAiB;QAC3B,OAAO,IAAI,CAAC,UAAU,CAAC,aAAa,CAAW,WAAW,CAAC,CAAC;IAC9D,CAAC;CACF","sourcesContent":["import { ConfigurableMixin, Renderer } from '../../../mixins/configurable';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { API } from '../NucleonElement/API';\nimport { Customer } from '../Customer/Customer';\nimport { Templates as CustomerTemplates } from '../Customer/types';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { PropertyDeclarations } from 'lit-element';\nimport { Rels } from '@foxy.io/sdk/customer';\nimport { BooleanSelector, Resource } from '@foxy.io/sdk/core';\nimport { Templates } from './types';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\n\nconst Base = ThemeableMixin(ConfigurableMixin(TranslatableMixin(NucleonElement)));\ntype Data = Resource<Rels.CustomerPortalSettings>;\n\nexport class InternalCustomerPortalLoggedInView extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      customer: { type: String },\n      loggingOutState: { attribute: false },\n      loggingOutStateResetTimeout: { attribute: false },\n    };\n  }\n\n  templates: Templates = {};\n\n  customer = '';\n\n  loggingOutState: 'idle' | 'busy' | 'fail' = 'idle';\n\n  loggingOutStateResetTimeout: NodeJS.Timeout | null = null;\n\n  private readonly __renderHeaderActionsSignOut = () => {\n    const scope = 'customer:header:actions:sign-out';\n    const state = this.loggingOutState;\n\n    const isDisabled =\n      this.disabledSelector.matches(scope) ||\n      !this.__customerElement?.in({ idle: 'snapshot' }) ||\n      state !== 'idle';\n\n    const handleClick = async () => {\n      try {\n        this.loggingOutState = 'busy';\n        await new API(this).fetch('foxy://customer-api/session', { method: 'DELETE' });\n        this.loggingOutState = 'idle';\n      } catch {\n        this.loggingOutState = 'fail';\n        this.loggingOutStateResetTimeout = setTimeout(() => {\n          this.loggingOutState = 'idle';\n          this.loggingOutStateResetTimeout = null;\n        }, 1000);\n      }\n    };\n\n    const style = {\n      'border-radius': '100%',\n      'padding': 'var(--lumo-space-xs)',\n      'display': 'flex',\n      'margin': '0',\n      'cursor': isDisabled ? 'default' : 'pointer',\n    };\n\n    return html`\n      <div style=\"display: flex; margin-left: var(--lumo-space-m)\">\n        ${this.renderTemplateOrSlot(`${scope}:before`)}\n\n        <vaadin-button\n          data-testid=\"sign-out\"\n          aria-label=${this.t('sign_out').toString()}\n          style=${Object.entries(style).reduce((p, [k, v]) => `${p}${k}:${v};`, '')}\n          theme=\"icon\"\n          ?disabled=${isDisabled}\n          @click=${handleClick}\n        >\n          ${state === 'idle'\n            ? html`<iron-icon icon=\"icons:exit-to-app\"></iron-icon>`\n            : html`\n                <foxy-spinner\n                  layout=\"no-label\"\n                  state=${state === 'fail' ? 'error' : 'busy'}\n                  style=\"margin: auto\"\n                  lang=${this.lang}\n                  ns=${[\n                    this.ns,\n                    customElements.get('foxy-customer')?.defaultNS ?? '',\n                    customElements.get('foxy-spinner')?.defaultNS ?? '',\n                  ].join(' ')}\n                >\n                </foxy-spinner>\n              `}\n        </vaadin-button>\n\n        ${this.renderTemplateOrSlot(`${scope}:after`)}\n      </div>\n    `;\n  };\n\n  private readonly __renderSubscriptions: Renderer<Customer> = (html, host) => {\n    const scope = 'customer:subscriptions';\n\n    return html`\n      ${this.renderTemplateOrSlot(`${scope}:before`)}\n\n      <foxy-internal-customer-portal-subscriptions\n        readonlycontrols=${this.readonlySelector.zoom(scope).toString()}\n        disabledcontrols=${this.disabledSelector.zoom(scope).toString()}\n        hiddencontrols=${this.hiddenSelector.zoom(scope).toString()}\n        group=${host.group}\n        lang=${host.lang}\n        ns=${host.ns}\n        .templates=${this.getNestedTemplates(scope)}\n        .settings=${this.data}\n        .customer=${host.data}\n      >\n      </foxy-internal-customer-portal-subscriptions>\n\n      ${this.renderTemplateOrSlot(`${scope}:after`)}\n    `;\n  };\n\n  private readonly __renderTransactions: Renderer<Customer> = (html, host) => {\n    const scope = 'customer:transactions';\n\n    return html`\n      ${this.renderTemplateOrSlot(`${scope}:before`)}\n\n      <foxy-internal-customer-portal-transactions\n        readonlycontrols=${this.readonlySelector.zoom(scope).toString()}\n        disabledcontrols=${this.disabledSelector.zoom(scope).toString()}\n        hiddencontrols=${this.hiddenSelector.zoom(scope).toString()}\n        group=${host.group}\n        lang=${host.lang}\n        ns=${host.ns}\n        .templates=${this.getNestedTemplates(scope)}\n        .customer=${host.data}\n      >\n      </foxy-internal-customer-portal-transactions>\n\n      ${this.renderTemplateOrSlot(`${scope}:after`)}\n    `;\n  };\n\n  render(): TemplateResult {\n    const hiddenSelector = this.hiddenSelector.zoom('customer');\n    const customerHiddenControls = new BooleanSelector(`\n      attributes\n      transactions\n      subscriptions\n      addresses:actions:create\n      header:actions:edit:form:delete\n      ${hiddenSelector.toString()}\n    `).toString();\n\n    const templates: CustomerTemplates = this.getNestedTemplates('customer');\n    const originalHeaderActionsAfterTemplate = templates['header:actions:after'];\n    const originalTimestampsAfterTemplate = templates['header:actions:edit:form:timestamps:after'];\n    const originalDefaultTemplate = templates['default'];\n\n    templates['header:actions:after'] = (html, host) => {\n      const isSignOutHidden = hiddenSelector.matches('header:actions:sign-out', true);\n      return html`\n        <div style=\"display:flex\">\n          ${isSignOutHidden ? '' : this.__renderHeaderActionsSignOut()}\n          ${originalHeaderActionsAfterTemplate?.(html, host)}\n        </div>\n      `;\n    };\n\n    templates['default'] = (html, host) => {\n      const renderSubscriptions = this.__renderSubscriptions;\n      const renderTransactions = this.__renderTransactions;\n\n      return html`\n        <style>\n          .space-y-m > :not([hidden]) ~ :not([hidden]) {\n            --tw-space-y-reverse: 0;\n            margin-top: calc(var(--lumo-space-m, 1rem) * calc(1 - var(--tw-space-y-reverse)));\n            margin-bottom: calc(var(--lumo-space-m, 1rem) * var(--tw-space-y-reverse));\n          }\n        </style>\n\n        ${hiddenSelector.matches('default', true) ? '' : originalDefaultTemplate?.(html, host)}\n\n        <div class=\"space-y-m\">\n          ${hiddenSelector.matches('subscriptions', true) ? '' : renderSubscriptions(html, host)}\n          ${hiddenSelector.matches('transactions', true) ? '' : renderTransactions(html, host)}\n        </div>\n      `;\n    };\n\n    templates['header:actions:edit:form:timestamps:after'] = (html, host) => {\n      const scope = 'change-password';\n\n      return html`\n        ${originalTimestampsAfterTemplate?.(html, host)}\n        ${host.hiddenSelector.matches(scope, true)\n          ? ''\n          : html`\n              ${host.renderTemplateOrSlot(`${scope}:before`)}\n\n              <foxy-internal-customer-portal-change-password\n                customer=${host.href}\n                session=\"foxy://customer-api/session\"\n                style=\"margin-top: var(--lumo-space-l)\"\n                email=${host.data?.email ?? ''}\n                lang=${host.lang}\n                ns=${host.ns}\n                ?disabled=${host.in('busy') || host.disabledSelector.matches(scope, true)}\n              >\n              </foxy-internal-customer-portal-change-password>\n\n              ${host.renderTemplateOrSlot(`${scope}:after`)}\n            `}\n      `;\n    };\n\n    return html`\n      <foxy-customer\n        readonlycontrols=${this.readonlySelector.zoom('customer').toString()}\n        disabledcontrols=${this.disabledSelector.zoom('customer').toString()}\n        hiddencontrols=${customerHiddenControls}\n        data-testid=\"customer\"\n        group=${this.group}\n        href=${this.customer}\n        lang=${this.lang}\n        ns=\"${this.ns} ${customElements.get('foxy-customer')?.defaultNS ?? ''}\"\n        id=\"customer\"\n        .templates=${templates}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-customer>\n    `;\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    if (this.loggingOutStateResetTimeout) clearTimeout(this.loggingOutStateResetTimeout);\n  }\n\n  private get __customerElement() {\n    return this.renderRoot.querySelector<Customer>('#customer');\n  }\n}\n"]}

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

@@ -0,0 +1,10 @@
+import type { TemplateResult } from 'lit-html';
+import type { Data } from './types';
+import { InternalCard } from '../../internal/InternalCard/InternalCard';
+declare const Base: typeof InternalCard & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+};
+export declare class EmailTemplateCard extends Base<Data> {
+    renderBody(): TemplateResult;
+}
+export {};

package/dist/elements/public/EmailTemplateCard/EmailTemplateCard.js

@@ -0,0 +1,24 @@
+import { TranslatableMixin } from "../../../mixins/translatable.js";
+import { InternalCard } from "../../internal/InternalCard/InternalCard.js";
+import { html } from 'lit-html';
+const NS = 'email-template-card';
+const Base = TranslatableMixin(InternalCard, NS);
+export class EmailTemplateCard extends Base {
+    renderBody() {
+        var _a, _b, _c, _d;
+        // TODO remove the directive below once SDK has the types
+        // @ts-expect-error definition for template_language is missing in SDK types
+        const language = (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.template_language) !== null && _b !== void 0 ? _b : 'nunjucks';
+        const languageToExtension = { nunjucks: '.njk', handlebars: '.hbs' };
+        const extension = (_c = languageToExtension[language]) !== null && _c !== void 0 ? _c : `.${language}`;
+        return html `
+      <div class="flex items-center justify-between">
+        <div class="font-semibold">${(_d = this.data) === null || _d === void 0 ? void 0 : _d.description}&ZeroWidthSpace;</div>
+        <div class="rounded-t-l rounded-b-l px-s py-xs bg-contrast-5">
+          <span class="uppercase text-xs font-bold tracking-wide">${extension}</span>
+        </div>
+      </div>
+    `;
+    }
+}
+//# sourceMappingURL=EmailTemplateCard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EmailTemplateCard.js","sourceRoot":"","sources":["../../../../src/elements/public/EmailTemplateCard/EmailTemplateCard.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,YAAY,EAAE,oDAAiD;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,MAAM,EAAE,GAAG,qBAAqB,CAAC;AACjC,MAAM,IAAI,GAAG,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AAEjD,MAAM,OAAO,iBAAkB,SAAQ,IAAU;IAC/C,UAAU;;QACR,yDAAyD;QACzD,4EAA4E;QAC5E,MAAM,QAAQ,eAAG,IAAI,CAAC,IAAI,0CAAE,iBAAiB,mCAAI,UAAU,CAAC;QAC5D,MAAM,mBAAmB,GAA2B,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,CAAC;QAC7F,MAAM,SAAS,SAAG,mBAAmB,CAAC,QAAQ,CAAC,mCAAI,IAAI,QAAQ,EAAE,CAAC;QAElE,OAAO,IAAI,CAAA;;qCAEsB,MAAA,IAAI,CAAC,IAAI,0CAAE,WAAW;;oEAES,SAAS;;;KAGxE,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { TemplateResult } from 'lit-html';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { html } from 'lit-html';\n\nconst NS = 'email-template-card';\nconst Base = TranslatableMixin(InternalCard, NS);\n\nexport class EmailTemplateCard extends Base<Data> {\n  renderBody(): TemplateResult {\n    // TODO remove the directive below once SDK has the types\n    // @ts-expect-error definition for template_language is missing in SDK types\n    const language = this.data?.template_language ?? 'nunjucks';\n    const languageToExtension: Record<string, string> = { nunjucks: '.njk', handlebars: '.hbs' };\n    const extension = languageToExtension[language] ?? `.${language}`;\n\n    return html`\n      <div class=\"flex items-center justify-between\">\n        <div class=\"font-semibold\">${this.data?.description}&ZeroWidthSpace;</div>\n        <div class=\"rounded-t-l rounded-b-l px-s py-xs bg-contrast-5\">\n          <span class=\"uppercase text-xs font-bold tracking-wide\">${extension}</span>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}

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

@@ -0,0 +1,6 @@
+import '@polymer/iron-icons/editor-icons';
+import '@polymer/iron-icon';
+import '../../internal/InternalCard/index';
+import '../I18n/index';
+import { EmailTemplateCard } from './EmailTemplateCard';
+export { EmailTemplateCard };

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

@@ -0,0 +1,8 @@
+import '@polymer/iron-icons/editor-icons';
+import '@polymer/iron-icon';
+import "../../internal/InternalCard/index.js";
+import "../I18n/index.js";
+import { EmailTemplateCard } from "./EmailTemplateCard.js";
+customElements.define('foxy-email-template-card', EmailTemplateCard);
+export { EmailTemplateCard };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/public/EmailTemplateCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,oBAAoB,CAAC;AAE5B,8CAA2C;AAE3C,0BAAuB;AAEvB,OAAO,EAAE,iBAAiB,EAAE,+BAA4B;AAExD,cAAc,CAAC,MAAM,CAAC,0BAA0B,EAAE,iBAAiB,CAAC,CAAC;AAErE,OAAO,EAAE,iBAAiB,EAAE,CAAC","sourcesContent":["import '@polymer/iron-icons/editor-icons';\nimport '@polymer/iron-icon';\n\nimport '../../internal/InternalCard/index';\n\nimport '../I18n/index';\n\nimport { EmailTemplateCard } from './EmailTemplateCard';\n\ncustomElements.define('foxy-email-template-card', EmailTemplateCard);\n\nexport { EmailTemplateCard };\n"]}

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

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

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

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

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

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

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

@@ -13,6 +13,9 @@ declare const Base: typeof NucleonElement & import("lit-element").Constructor<im
  * @slot description:before
  * @slot description:after
  *
+ * @slot template-language:before
+ * @slot template-language:after
+ *
  * @slot content:before
  * @slot content:after
  *

package/dist/elements/public/EmailTemplateForm/EmailTemplateForm.js

@@ -16,6 +16,9 @@ const Base = ScopedElementsMixin(ThemeableMixin(ConfigurableMixin(TranslatableMi
  * @slot description:before
  * @slot description:after
  *
+ * @slot template-language:before
+ * @slot template-language:after
+ *
  * @slot content:before
  * @slot content:after
  *
@@ -56,6 +59,7 @@ export class EmailTemplateForm extends Base {
     }
     static get scopedElements() {
         return {
+            'foxy-internal-select-control': customElements.get('foxy-internal-select-control'),
             'foxy-internal-confirm-dialog': customElements.get('foxy-internal-confirm-dialog'),
             'foxy-internal-sandbox': customElements.get('foxy-internal-sandbox'),
             'foxy-spinner': customElements.get('foxy-spinner'),
@@ -77,6 +81,19 @@ export class EmailTemplateForm extends Base {
         return html `
       <div class="space-y-m">
         ${hiddenSelector.matches('description', true) ? '' : this.__renderDescription()}
+
+        <foxy-internal-select-control
+          infer="template-language"
+          .options=${[
+            { label: 'Nunjucks', value: 'nunjucks' },
+            { label: 'Handlebars', value: 'handlebars' },
+            { label: 'Pug', value: 'pug' },
+            { label: 'Twig', value: 'twig' },
+            { label: 'EJS', value: 'ejs' },
+        ]}
+        >
+        </foxy-internal-select-control>
+
         ${hiddenSelector.matches('content', true) ? '' : this.__renderContent()}
         ${hiddenSelector.matches('timestamps', true) || !href ? '' : this.__renderTimestamps()}
         ${hiddenSelector.matches(action) ? '' : this.__renderAction(action)}