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

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

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalNumberControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,+CAA+C,CAAC;AACvD,6CAA0C;AAC1C,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-text-field/vaadin-number-field';\nimport '../InternalEditableControl/index';\nimport { InternalNumberControl as Control } from './InternalNumberControl';\n\ncustomElements.define('foxy-internal-number-control', Control);\n\nexport { Control as InternalNumberControl };\n"]}

package/dist/elements/internal/InternalRadioGroupControl/InternalRadioGroupControl.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-radio-group` element.
+ *
+ * @since 1.17.0
+ * @element foxy-internal-radio-group-control
+ */
+export declare class InternalRadioGroupControl extends InternalEditableControl {
+    static get properties(): PropertyDeclarations;
+    /** List of radio buttons to render. */
+    options: Option[];
+    /** Same as the "theme" attribute/property of `vaadin-radio-group`. */
+    theme: string | null;
+    renderControl(): TemplateResult;
+}

package/dist/elements/internal/InternalRadioGroupControl/InternalRadioGroupControl.js

@@ -0,0 +1,51 @@
+import { InternalEditableControl } from "../InternalEditableControl/InternalEditableControl.js";
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { html } from 'lit-html';
+/**
+ * Internal control wrapper for `vaadin-radio-group` element.
+ *
+ * @since 1.17.0
+ * @element foxy-internal-radio-group-control
+ */
+export class InternalRadioGroupControl extends InternalEditableControl {
+    constructor() {
+        super(...arguments);
+        /** List of radio buttons to render. */
+        this.options = [];
+        /** Same as the "theme" attribute/property of `vaadin-radio-group`. */
+        this.theme = null;
+    }
+    static get properties() {
+        return {
+            ...super.properties,
+            options: { type: Array },
+            theme: { type: String },
+        };
+    }
+    renderControl() {
+        var _a;
+        return html `
+      <vaadin-radio-group
+        error-message=${ifDefined(this._errorMessage)}
+        helper-text=${this.helperText}
+        label=${this.label}
+        class="w-full"
+        theme=${ifDefined((_a = this.theme) !== null && _a !== void 0 ? _a : undefined)}
+        ?disabled=${this.disabled || this.readonly}
+        .checkValidity=${this._checkValidity}
+        .value=${this._value}
+        @change=${(evt) => {
+            const field = evt.currentTarget;
+            this._value = field.value;
+        }}
+      >
+        ${this.options.map(option => html `
+            <vaadin-radio-button value=${option.value}>
+              <foxy-i18n infer="" key=${option.label}></foxy-i18n>
+            </vaadin-radio-button>
+          `)}
+      </vaadin-radio-group>
+    `;
+    }
+}
+//# sourceMappingURL=InternalRadioGroupControl.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InternalRadioGroupControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalRadioGroupControl/InternalRadioGroupControl.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC;;;;;GAKG;AACH,MAAM,OAAO,yBAA0B,SAAQ,uBAAuB;IAAtE;;QASE,uCAAuC;QACvC,YAAO,GAAa,EAAE,CAAC;QAEvB,sEAAsE;QACtE,UAAK,GAAkB,IAAI,CAAC;IA4B9B,CAAC;IAxCC,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,OAAO,IAAI,CAAA;;wBAES,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;sBAC/B,IAAI,CAAC,UAAU;gBACrB,IAAI,CAAC,KAAK;;gBAEV,SAAS,OAAC,IAAI,CAAC,KAAK,mCAAI,SAAS,CAAC;oBAC9B,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;yBACzB,IAAI,CAAC,cAAc;iBAC3B,IAAI,CAAC,MAAuB;kBAC3B,CAAC,GAAgB,EAAE,EAAE;YAC7B,MAAM,KAAK,GAAG,GAAG,CAAC,aAAkC,CAAC;YACrD,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC;QAC5B,CAAC;;UAEC,IAAI,CAAC,OAAO,CAAC,GAAG,CAChB,MAAM,CAAC,EAAE,CAAC,IAAI,CAAA;yCACiB,MAAM,CAAC,KAAK;wCACb,MAAM,CAAC,KAAK;;WAEzC,CACF;;KAEJ,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { RadioGroupElement } from '@vaadin/vaadin-radio-button/vaadin-radio-group';\nimport type { Option } from './types';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\n/**\n * Internal control wrapper for `vaadin-radio-group` element.\n *\n * @since 1.17.0\n * @element foxy-internal-radio-group-control\n */\nexport class InternalRadioGroupControl 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-radio-group`. */\n  theme: string | null = null;\n\n  renderControl(): TemplateResult {\n    return html`\n      <vaadin-radio-group\n        error-message=${ifDefined(this._errorMessage)}\n        helper-text=${this.helperText}\n        label=${this.label}\n        class=\"w-full\"\n        theme=${ifDefined(this.theme ?? undefined)}\n        ?disabled=${this.disabled || this.readonly}\n        .checkValidity=${this._checkValidity}\n        .value=${this._value as string | null}\n        @change=${(evt: CustomEvent) => {\n          const field = evt.currentTarget as RadioGroupElement;\n          this._value = field.value;\n        }}\n      >\n        ${this.options.map(\n          option => html`\n            <vaadin-radio-button value=${option.value}>\n              <foxy-i18n infer=\"\" key=${option.label}></foxy-i18n>\n            </vaadin-radio-button>\n          `\n        )}\n      </vaadin-radio-group>\n    `;\n  }\n}\n"]}

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

@@ -0,0 +1,6 @@
+import '@vaadin/vaadin-radio-button/vaadin-radio-button';
+import '@vaadin/vaadin-radio-button/vaadin-radio-group';
+import '../InternalEditableControl/index';
+import '../../public/I18n/index';
+import { InternalRadioGroupControl as Control } from './InternalRadioGroupControl';
+export { Control as InternalRadioGroupControl };

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalRadioGroupControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,iDAAiD,CAAC;AACzD,OAAO,gDAAgD,CAAC;AAExD,6CAA0C;AAC1C,oCAAiC;AAEjC,OAAO,EAAE,yBAAyB,IAAI,OAAO,EAAE,uCAAoC;AAEnF,cAAc,CAAC,MAAM,CAAC,mCAAmC,EAAE,OAAO,CAAC,CAAC;AAEpE,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-radio-button/vaadin-radio-button';\nimport '@vaadin/vaadin-radio-button/vaadin-radio-group';\n\nimport '../InternalEditableControl/index';\nimport '../../public/I18n/index';\n\nimport { InternalRadioGroupControl as Control } from './InternalRadioGroupControl';\n\ncustomElements.define('foxy-internal-radio-group-control', Control);\n\nexport { Control as InternalRadioGroupControl };\n"]}

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

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

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

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

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

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

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

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

package/dist/elements/internal/InternalTextControl/InternalTextControl.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 box.
+ *
+ * @since 1.17.0
+ * @element foxy-internal-text-control
+ */
+export class InternalTextControl extends InternalEditableControl {
+    renderControl() {
+        return html `
+      <vaadin-text-field
+        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 field = evt.currentTarget;
+            this._value = field.value;
+        }}
+      >
+      </vaadin-text-field>
+    `;
+    }
+    get _value() {
+        var _a;
+        return (_a = super._value) !== null && _a !== void 0 ? _a : '';
+    }
+    set _value(newValue) {
+        super._value = newValue;
+    }
+}
+//# sourceMappingURL=InternalTextControl.js.map

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

@@ -0,0 +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"]}

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

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTextControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,6CAA6C,CAAC;AACrD,6CAA0C;AAC1C,OAAO,EAAE,mBAAmB,IAAI,OAAO,EAAE,iCAA8B;AAEvE,cAAc,CAAC,MAAM,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-text-field/vaadin-text-field';\nimport '../InternalEditableControl/index';\nimport { InternalTextControl as Control } from './InternalTextControl';\n\ncustomElements.define('foxy-internal-text-control', Control);\n\nexport { Control as InternalTextControl };\n"]}

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

@@ -0,0 +1,14 @@
+import { CSSResultArray } from 'lit-element';
+import { TemplateResult } from 'lit-html';
+import { InternalControl } from '../InternalControl/InternalControl';
+/**
+ * Internal control displaying creation and last modification date
+ * for a hAPI resource in a table.
+ *
+ * @element foxy-internal-timestamps-control
+ * @since 1.17.0
+ */
+export declare class InternalTimestampsControl extends InternalControl {
+    static get styles(): CSSResultArray;
+    renderControl(): TemplateResult;
+}

package/dist/elements/internal/InternalTimestampsControl/InternalTimestampsControl.js

@@ -0,0 +1,57 @@
+import { css } from 'lit-element';
+import { html } from 'lit-html';
+import { get } from 'lodash-es';
+import { InternalControl } from "../InternalControl/InternalControl.js";
+/**
+ * Internal control displaying creation and last modification date
+ * for a hAPI resource in a table.
+ *
+ * @element foxy-internal-timestamps-control
+ * @since 1.17.0
+ */
+export class InternalTimestampsControl extends InternalControl {
+    static get styles() {
+        return [
+            super.styles,
+            css `.max-w-0{
+  max-width:0;
+}
+      `,
+        ];
+    }
+    renderControl() {
+        return html `
+      <table class="font-lumo text-m leading-m w-full">
+        <tbody class="divide-y divide-contrast-10">
+          <tr>
+            <td class="max-w-0 truncate py-s text-secondary w-1-3 pr-m">
+              <foxy-i18n infer="" key="date_created"></foxy-i18n>
+            </td>
+            <td class="max-w-0 truncate py-s text-body w-2-3">
+              <foxy-i18n
+                options=${JSON.stringify({ value: get(this, 'nucleon.form.date_created') })}
+                infer=""
+                key="date"
+              >
+              </foxy-i18n>
+            </td>
+          </tr>
+          <tr>
+            <td class="max-w-0 truncate py-s text-secondary w-1-3 pr-m">
+              <foxy-i18n infer="" key="date_modified"></foxy-i18n>
+            </td>
+            <td class="max-w-0 truncate py-s text-body w-2-3">
+              <foxy-i18n
+                options=${JSON.stringify({ value: get(this, 'nucleon.form.date_modified') })}
+                infer=""
+                key="date"
+              >
+              </foxy-i18n>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    `;
+    }
+}
+//# sourceMappingURL=InternalTimestampsControl.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InternalTimestampsControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTimestampsControl/InternalTimestampsControl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAkB,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,IAAI,EAAkB,MAAM,UAAU,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAChC,OAAO,EAAE,eAAe,EAAE,8CAA2C;AAErE;;;;;;GAMG;AACH,MAAM,OAAO,yBAA0B,SAAQ,eAAe;IAC5D,MAAM,KAAK,MAAM;QACf,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;OAIF;SACF,CAAC;IACJ,CAAC;IAED,aAAa;QACX,OAAO,IAAI,CAAA;;;;;;;;;0BASW,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,GAAG,CAAC,IAAI,EAAE,2BAA2B,CAAC,EAAE,CAAC;;;;;;;;;;;;;0BAajE,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,GAAG,CAAC,IAAI,EAAE,4BAA4B,CAAC,EAAE,CAAC;;;;;;;;;KASvF,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { css, CSSResultArray } from 'lit-element';\nimport { html, TemplateResult } from 'lit-html';\nimport { get } from 'lodash-es';\nimport { InternalControl } from '../InternalControl/InternalControl';\n\n/**\n * Internal control displaying creation and last modification date\n * for a hAPI resource in a table.\n *\n * @element foxy-internal-timestamps-control\n * @since 1.17.0\n */\nexport class InternalTimestampsControl extends InternalControl {\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        .max-w-0 {\n          max-width: 0;\n        }\n      `,\n    ];\n  }\n\n  renderControl(): TemplateResult {\n    return html`\n      <table class=\"font-lumo text-m leading-m w-full\">\n        <tbody class=\"divide-y divide-contrast-10\">\n          <tr>\n            <td class=\"max-w-0 truncate py-s text-secondary w-1-3 pr-m\">\n              <foxy-i18n infer=\"\" key=\"date_created\"></foxy-i18n>\n            </td>\n            <td class=\"max-w-0 truncate py-s text-body w-2-3\">\n              <foxy-i18n\n                options=${JSON.stringify({ value: get(this, 'nucleon.form.date_created') })}\n                infer=\"\"\n                key=\"date\"\n              >\n              </foxy-i18n>\n            </td>\n          </tr>\n          <tr>\n            <td class=\"max-w-0 truncate py-s text-secondary w-1-3 pr-m\">\n              <foxy-i18n infer=\"\" key=\"date_modified\"></foxy-i18n>\n            </td>\n            <td class=\"max-w-0 truncate py-s text-body w-2-3\">\n              <foxy-i18n\n                options=${JSON.stringify({ value: get(this, 'nucleon.form.date_modified') })}\n                infer=\"\"\n                key=\"date\"\n              >\n              </foxy-i18n>\n            </td>\n          </tr>\n        </tbody>\n      </table>\n    `;\n  }\n}\n"]}

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

@@ -0,0 +1,4 @@
+import '../../public/I18n/index';
+import '../InternalControl/index';
+import { InternalTimestampsControl } from './InternalTimestampsControl';
+export { InternalTimestampsControl };

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

@@ -0,0 +1,6 @@
+import "../../public/I18n/index.js";
+import "../InternalControl/index.js";
+import { InternalTimestampsControl } from "./InternalTimestampsControl.js";
+customElements.define('foxy-internal-timestamps-control', InternalTimestampsControl);
+export { InternalTimestampsControl };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalTimestampsControl/index.ts"],"names":[],"mappings":"AAAA,oCAAiC;AACjC,qCAAkC;AAElC,OAAO,EAAE,yBAAyB,EAAE,uCAAoC;AAExE,cAAc,CAAC,MAAM,CAAC,kCAAkC,EAAE,yBAAyB,CAAC,CAAC;AAErF,OAAO,EAAE,yBAAyB,EAAE,CAAC","sourcesContent":["import '../../public/I18n/index';\nimport '../InternalControl/index';\n\nimport { InternalTimestampsControl } from './InternalTimestampsControl';\n\ncustomElements.define('foxy-internal-timestamps-control', InternalTimestampsControl);\n\nexport { InternalTimestampsControl };\n"]}

package/dist/elements/private/Dialog/Dialog.d.ts

@@ -3,12 +3,14 @@ import { TemplateResult } from 'lit-html';
 import { DialogHideEvent } from './DialogHideEvent';
 import { DialogShowEvent } from './DialogShowEvent';
 import { DialogWindow } from './DialogWindow';
-declare const Dialog_base: typeof LitElement & {
+declare const Base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & {
     styles: CSSResultArray;
 } & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost> & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
 };
-export declare abstract class Dialog extends Dialog_base {
+export declare abstract class Dialog extends Base {
     /**
      * Selector of an element that will serve as a mounting point to all dialog windows.
      * It's `<body>` by default, but you can add your own element with `id="foxy-dialog-windows-host"`

package/dist/elements/private/Dialog/Dialog.js

@@ -9,7 +9,9 @@ import { FetchEvent } from "../../public/NucleonElement/FetchEvent.js";
 import { ThemeableMixin } from "../../../mixins/themeable.js";
 import { TranslatableMixin } from "../../../mixins/translatable.js";
 import { classMap } from "../../../utils/class-map.js";
-export class Dialog extends TranslatableMixin(ConfigurableMixin(ThemeableMixin(LitElement))) {
+import { InferrableMixin } from "../../../mixins/inferrable.js";
+const Base = TranslatableMixin(ConfigurableMixin(ThemeableMixin(InferrableMixin(LitElement))));
+export class Dialog extends Base {
     constructor() {
         super(...arguments);
         /** When true, renders Close button in the header. */

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../src/elements/private/Dialog/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultArray, LitElement, PropertyDeclarations, css } from 'lit-element';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { API } from '../../public/NucleonElement/API';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { DialogHideEvent } from './DialogHideEvent';\nimport { DialogShowEvent } from './DialogShowEvent';\nimport { DialogWindow } from './DialogWindow';\nimport { FetchEvent } from '../../public/NucleonElement/FetchEvent';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nexport abstract class Dialog extends TranslatableMixin(\n  ConfigurableMixin(ThemeableMixin(LitElement))\n) {\n  /**\n   * Selector of an element that will serve as a mounting point to all dialog windows.\n   * It's `<body>` by default, but you can add your own element with `id=\"foxy-dialog-windows-host\"`\n   * anywhere in the light DOM to render dialogs there.\n   */\n  static readonly dialogWindowsHost = '#foxy-dialog-windows-host, body';\n\n  /** Map of all dialog windows linked to their dialog elements. */\n  static readonly dialogWindows = new WeakMap<Dialog, DialogWindow>();\n\n  /** List of all currently open dialogs. */\n  static readonly openDialogs: Dialog[] = [];\n\n  /**\n   * Instance of this event will be dispatched on a dialog when it finishes entering the screen.\n   * This event does not bubble and can't cross shadow DOM boundary.\n   */\n  static readonly ShowEvent = DialogShowEvent;\n\n  /**\n   * Instance of this event will be dispatched on a dialog when it finishes leaving the screen.\n   * This event does not bubble and can't cross shadow DOM boundary.\n   */\n  static readonly HideEvent = DialogHideEvent;\n\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      __connected: { attribute: false },\n      __visible: { attribute: false },\n      centered: { type: Boolean },\n      closable: { type: Boolean },\n      editable: { type: Boolean },\n      header: { type: String },\n      alert: { type: Boolean },\n      open: { type: Boolean, noAccessor: true },\n    };\n  }\n\n  /** @readonly */\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        .grid-cols-header {\n          grid-template-columns: 1fr auto 1fr;\n        }\n\n        .scale-85 {\n          --tw-scale-x: 0.85;\n          --tw-scale-y: 0.85;\n        }\n      `,\n    ];\n  }\n\n  /** When true, renders Close button in the header. */\n  closable = false;\n\n  /** When true, renders Save button in the header. */\n  editable = false;\n\n  /** Header text or a i18next key for it. */\n  header = '';\n\n  /** When true, centers a dialog on the screen and does not animate the stack under. */\n  alert = false;\n\n  private __returnFocusTo?: HTMLElement;\n\n  private __handleKeyDown = (evt: KeyboardEvent) => {\n    if (evt.key === 'Escape' && Dialog.openDialogs[0] === this && this.closable)\n      this.hide(this.editable);\n  };\n\n  private __connected = false;\n\n  private __visible = false;\n\n  /** True if dialog is mounted and has finished entering the screen. */\n  get open(): boolean {\n    return this.__visible && this.__connected;\n  }\n\n  set open(newValue: boolean) {\n    newValue === this.open ? void 0 : newValue ? this.show() : this.hide(this.editable);\n  }\n\n  /** @readonly */\n  connectedCallback(): void {\n    super.connectedCallback();\n    addEventListener('keydown', this.__handleKeyDown);\n  }\n\n  /** @readonly */\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    removeEventListener('keydown', this.__handleKeyDown);\n\n    Dialog.dialogWindows.get(this)?.remove();\n    Dialog.dialogWindows.delete(this);\n  }\n\n  /** @readonly */\n  createRenderRoot(): Element | ShadowRoot {\n    const dialogWindow = new DialogWindow();\n    const dialogWindowsHosts = document.querySelectorAll(Dialog.dialogWindowsHost);\n    const dialogWindowsHost = Array.from(dialogWindowsHosts).pop();\n\n    dialogWindow.addEventListener('fetch', (evt: Event) => {\n      if (evt instanceof FetchEvent) {\n        evt.stopImmediatePropagation();\n        evt.preventDefault();\n        evt.respondWith(new API(this).fetch(evt.request));\n      }\n    });\n\n    dialogWindowsHost?.appendChild(dialogWindow);\n    Dialog.dialogWindows.set(this, dialogWindow);\n\n    return dialogWindow.shadowRoot!;\n  }\n\n  /** @readonly */\n  render(content?: () => TemplateResult): TemplateResult {\n    if (!this.__connected) return html``;\n\n    const isFirst = Dialog.openDialogs[0] === this;\n    const isSecond = Dialog.openDialogs[1] === this;\n    const isThird = Dialog.openDialogs[2] === this;\n    const isForthAndGreater = !isFirst && !isSecond && !isThird;\n\n    return html`\n      <div\n        class=${classMap({ 'z-50 fixed inset-0': true, 'pointer-events-none': !this.__visible })}\n      >\n        <div\n          id=\"backdrop\"\n          class=${classMap({\n            'select-none ease-in-out transition duration-500 absolute inset-0 bg-shade-50 focus-outline-none':\n              true,\n            'opacity-100': this.__visible,\n            'opacity-0': !this.__visible,\n          })}\n          tabindex=\"-1\"\n          @click=${() => this.closable && this.hide(this.editable)}\n        ></div>\n\n        <div\n          role=\"dialog\"\n          aria-labelledby=\"dialog-title\"\n          class=${classMap({\n            'transform origin-bottom ease-in-out transition duration-500 relative h-full ml-auto sm-origin-center sm-max-w-modal':\n              true,\n            'flex justify-center items-end sm-items-center mr-auto': this.alert,\n            'translate-y-full sm-translate-y-0': !this.__visible,\n            'sm-translate-x-full': !this.alert && !this.__visible,\n            'sm-opacity-0 sm-scale-110': this.alert && !this.__visible,\n            'translate-y-0 translate-x-0': isFirst && this.__visible,\n            'scale-95 -translate-y-s sm-translate-y-0': isSecond && this.__visible,\n            'scale-90 -translate-y-m sm-translate-y-0': isThird && this.__visible,\n            'opacity-0 scale-85 -translate-y-l sm-translate-y-0':\n              isForthAndGreater && this.__visible,\n          })}\n        >\n          <div\n            class=${classMap({\n              'overflow-hidden flex flex-col bg-base rounded-t-l sm-rounded-b-l': true,\n              'absolute inset-0 mt-xl sm-m-xl': !this.alert,\n              'shadow-xxl': this.__visible,\n            })}\n          >\n            <div\n              class=\"h-l grid grid-cols-header text-m font-lumo font-medium border-b border-contrast-10\"\n            >\n              ${this.closable && !this.hiddenSelector.matches('close-button', true)\n                ? html`\n                    <vaadin-button\n                      id=\"close-button\"\n                      theme=\"tertiary-inline\"\n                      class=\"mr-auto m-s px-s\"\n                      ?disabled=${this.disabledSelector.matches('close-button', true)}\n                      @click=${() => this.hide(this.editable)}\n                    >\n                      <foxy-i18n\n                        lang=${this.lang}\n                        key=${this.editable ? 'cancel' : 'close'}\n                        ns=${this.ns}\n                      >\n                      </foxy-i18n>\n                    </vaadin-button>\n                  `\n                : html`<div></div>`}\n\n              <h1 id=\"dialog-title\" class=\"truncate self-center text-center\">\n                <foxy-i18n ns=${this.ns} lang=${this.lang} key=${this.header}></foxy-i18n>\n              </h1>\n\n              ${this.editable && !this.hiddenSelector.matches('save-button', true)\n                ? html`\n                    <vaadin-button\n                      data-testid=\"save-button\"\n                      ?disabled=${this.disabledSelector.matches('save-button', true)}\n                      theme=\"primary\"\n                      class=\"ml-auto h-auto min-h-0 min-w-0 m-xs px-m\"\n                      @click=${this.save}\n                    >\n                      <foxy-i18n ns=${this.ns} lang=${this.lang} key=\"save\"></foxy-i18n>\n                    </vaadin-button>\n                  `\n                : html`<div></div>`}\n            </div>\n\n            <div class=\"flex-1 overflow-y-auto overflow-x-hidden overscroll-contain\">\n              <div class=\"p-m relative\">${content?.()}</div>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * Hides the dialog. Returns a promise that resolves when the dialog\n   * finishes leaving the screen.\n   *\n   * @param cancelled Set this to `true` if closing an editable dialog without saving changes.\n   */\n  async hide(cancelled = false): Promise<void> {\n    this.__returnFocusTo?.focus();\n\n    await this.__setOpenDialogs(Dialog.openDialogs.filter(d => d !== this));\n    await this.__setConnected(false);\n\n    this.dispatchEvent(new Dialog.HideEvent(!!cancelled));\n  }\n\n  /**\n   * Shows the dialog. Returns a promise that resolves when the dialog\n   * finishes entering the screen.\n   *\n   * @param returnFocusTo If provided, the dialog will call `.focus()` on that element once it's closed.\n   */\n  async show(returnFocusTo?: HTMLElement): Promise<void> {\n    this.__returnFocusTo = returnFocusTo;\n\n    await this.__setConnected(true);\n    await this.__setOpenDialogs([this, ...Dialog.openDialogs]);\n\n    const closeButton = this.renderRoot.querySelector('#close-button') as HTMLButtonElement;\n    closeButton?.focus();\n\n    this.dispatchEvent(new Dialog.ShowEvent());\n  }\n\n  /** Alias for `dialog.hide(false)`. */\n  async save(): Promise<void> {\n    await this.hide(false);\n  }\n\n  private async __setOpenDialogs(newValue: Dialog[]) {\n    Dialog.openDialogs.length = 0;\n    Dialog.openDialogs.push(...newValue);\n\n    await Promise.all([\n      // animate dialog stack\n      Promise.all(Dialog.openDialogs.map(dialog => dialog.requestUpdate())),\n\n      // trigger exit transition\n      new Promise(resolve => {\n        const backdrop = this.renderRoot.querySelector('#backdrop') as HTMLDivElement;\n        backdrop.addEventListener('transitionend', resolve, { once: true });\n        this.__visible = Dialog.openDialogs.includes(this);\n      }),\n    ]);\n  }\n\n  private async __setConnected(newValue: boolean) {\n    this.__connected = newValue;\n    await this.updateComplete.then(() => this.getBoundingClientRect());\n  }\n}\n\ncustomElements.define('foxy-dialog-window', DialogWindow);\n"]}
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../src/elements/private/Dialog/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultArray, LitElement, PropertyDeclarations, css } from 'lit-element';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { API } from '../../public/NucleonElement/API';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { DialogHideEvent } from './DialogHideEvent';\nimport { DialogShowEvent } from './DialogShowEvent';\nimport { DialogWindow } from './DialogWindow';\nimport { FetchEvent } from '../../public/NucleonElement/FetchEvent';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\nconst Base = TranslatableMixin(ConfigurableMixin(ThemeableMixin(InferrableMixin(LitElement))));\n\nexport abstract class Dialog extends Base {\n  /**\n   * Selector of an element that will serve as a mounting point to all dialog windows.\n   * It's `<body>` by default, but you can add your own element with `id=\"foxy-dialog-windows-host\"`\n   * anywhere in the light DOM to render dialogs there.\n   */\n  static readonly dialogWindowsHost = '#foxy-dialog-windows-host, body';\n\n  /** Map of all dialog windows linked to their dialog elements. */\n  static readonly dialogWindows = new WeakMap<Dialog, DialogWindow>();\n\n  /** List of all currently open dialogs. */\n  static readonly openDialogs: Dialog[] = [];\n\n  /**\n   * Instance of this event will be dispatched on a dialog when it finishes entering the screen.\n   * This event does not bubble and can't cross shadow DOM boundary.\n   */\n  static readonly ShowEvent = DialogShowEvent;\n\n  /**\n   * Instance of this event will be dispatched on a dialog when it finishes leaving the screen.\n   * This event does not bubble and can't cross shadow DOM boundary.\n   */\n  static readonly HideEvent = DialogHideEvent;\n\n  /** @readonly */\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      __connected: { attribute: false },\n      __visible: { attribute: false },\n      centered: { type: Boolean },\n      closable: { type: Boolean },\n      editable: { type: Boolean },\n      header: { type: String },\n      alert: { type: Boolean },\n      open: { type: Boolean, noAccessor: true },\n    };\n  }\n\n  /** @readonly */\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        .grid-cols-header {\n          grid-template-columns: 1fr auto 1fr;\n        }\n\n        .scale-85 {\n          --tw-scale-x: 0.85;\n          --tw-scale-y: 0.85;\n        }\n      `,\n    ];\n  }\n\n  /** When true, renders Close button in the header. */\n  closable = false;\n\n  /** When true, renders Save button in the header. */\n  editable = false;\n\n  /** Header text or a i18next key for it. */\n  header = '';\n\n  /** When true, centers a dialog on the screen and does not animate the stack under. */\n  alert = false;\n\n  private __returnFocusTo?: HTMLElement;\n\n  private __handleKeyDown = (evt: KeyboardEvent) => {\n    if (evt.key === 'Escape' && Dialog.openDialogs[0] === this && this.closable)\n      this.hide(this.editable);\n  };\n\n  private __connected = false;\n\n  private __visible = false;\n\n  /** True if dialog is mounted and has finished entering the screen. */\n  get open(): boolean {\n    return this.__visible && this.__connected;\n  }\n\n  set open(newValue: boolean) {\n    newValue === this.open ? void 0 : newValue ? this.show() : this.hide(this.editable);\n  }\n\n  /** @readonly */\n  connectedCallback(): void {\n    super.connectedCallback();\n    addEventListener('keydown', this.__handleKeyDown);\n  }\n\n  /** @readonly */\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    removeEventListener('keydown', this.__handleKeyDown);\n\n    Dialog.dialogWindows.get(this)?.remove();\n    Dialog.dialogWindows.delete(this);\n  }\n\n  /** @readonly */\n  createRenderRoot(): Element | ShadowRoot {\n    const dialogWindow = new DialogWindow();\n    const dialogWindowsHosts = document.querySelectorAll(Dialog.dialogWindowsHost);\n    const dialogWindowsHost = Array.from(dialogWindowsHosts).pop();\n\n    dialogWindow.addEventListener('fetch', (evt: Event) => {\n      if (evt instanceof FetchEvent) {\n        evt.stopImmediatePropagation();\n        evt.preventDefault();\n        evt.respondWith(new API(this).fetch(evt.request));\n      }\n    });\n\n    dialogWindowsHost?.appendChild(dialogWindow);\n    Dialog.dialogWindows.set(this, dialogWindow);\n\n    return dialogWindow.shadowRoot!;\n  }\n\n  /** @readonly */\n  render(content?: () => TemplateResult): TemplateResult {\n    if (!this.__connected) return html``;\n\n    const isFirst = Dialog.openDialogs[0] === this;\n    const isSecond = Dialog.openDialogs[1] === this;\n    const isThird = Dialog.openDialogs[2] === this;\n    const isForthAndGreater = !isFirst && !isSecond && !isThird;\n\n    return html`\n      <div\n        class=${classMap({ 'z-50 fixed inset-0': true, 'pointer-events-none': !this.__visible })}\n      >\n        <div\n          id=\"backdrop\"\n          class=${classMap({\n            'select-none ease-in-out transition duration-500 absolute inset-0 bg-shade-50 focus-outline-none':\n              true,\n            'opacity-100': this.__visible,\n            'opacity-0': !this.__visible,\n          })}\n          tabindex=\"-1\"\n          @click=${() => this.closable && this.hide(this.editable)}\n        ></div>\n\n        <div\n          role=\"dialog\"\n          aria-labelledby=\"dialog-title\"\n          class=${classMap({\n            'transform origin-bottom ease-in-out transition duration-500 relative h-full ml-auto sm-origin-center sm-max-w-modal':\n              true,\n            'flex justify-center items-end sm-items-center mr-auto': this.alert,\n            'translate-y-full sm-translate-y-0': !this.__visible,\n            'sm-translate-x-full': !this.alert && !this.__visible,\n            'sm-opacity-0 sm-scale-110': this.alert && !this.__visible,\n            'translate-y-0 translate-x-0': isFirst && this.__visible,\n            'scale-95 -translate-y-s sm-translate-y-0': isSecond && this.__visible,\n            'scale-90 -translate-y-m sm-translate-y-0': isThird && this.__visible,\n            'opacity-0 scale-85 -translate-y-l sm-translate-y-0':\n              isForthAndGreater && this.__visible,\n          })}\n        >\n          <div\n            class=${classMap({\n              'overflow-hidden flex flex-col bg-base rounded-t-l sm-rounded-b-l': true,\n              'absolute inset-0 mt-xl sm-m-xl': !this.alert,\n              'shadow-xxl': this.__visible,\n            })}\n          >\n            <div\n              class=\"h-l grid grid-cols-header text-m font-lumo font-medium border-b border-contrast-10\"\n            >\n              ${this.closable && !this.hiddenSelector.matches('close-button', true)\n                ? html`\n                    <vaadin-button\n                      id=\"close-button\"\n                      theme=\"tertiary-inline\"\n                      class=\"mr-auto m-s px-s\"\n                      ?disabled=${this.disabledSelector.matches('close-button', true)}\n                      @click=${() => this.hide(this.editable)}\n                    >\n                      <foxy-i18n\n                        lang=${this.lang}\n                        key=${this.editable ? 'cancel' : 'close'}\n                        ns=${this.ns}\n                      >\n                      </foxy-i18n>\n                    </vaadin-button>\n                  `\n                : html`<div></div>`}\n\n              <h1 id=\"dialog-title\" class=\"truncate self-center text-center\">\n                <foxy-i18n ns=${this.ns} lang=${this.lang} key=${this.header}></foxy-i18n>\n              </h1>\n\n              ${this.editable && !this.hiddenSelector.matches('save-button', true)\n                ? html`\n                    <vaadin-button\n                      data-testid=\"save-button\"\n                      ?disabled=${this.disabledSelector.matches('save-button', true)}\n                      theme=\"primary\"\n                      class=\"ml-auto h-auto min-h-0 min-w-0 m-xs px-m\"\n                      @click=${this.save}\n                    >\n                      <foxy-i18n ns=${this.ns} lang=${this.lang} key=\"save\"></foxy-i18n>\n                    </vaadin-button>\n                  `\n                : html`<div></div>`}\n            </div>\n\n            <div class=\"flex-1 overflow-y-auto overflow-x-hidden overscroll-contain\">\n              <div class=\"p-m relative\">${content?.()}</div>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * Hides the dialog. Returns a promise that resolves when the dialog\n   * finishes leaving the screen.\n   *\n   * @param cancelled Set this to `true` if closing an editable dialog without saving changes.\n   */\n  async hide(cancelled = false): Promise<void> {\n    this.__returnFocusTo?.focus();\n\n    await this.__setOpenDialogs(Dialog.openDialogs.filter(d => d !== this));\n    await this.__setConnected(false);\n\n    this.dispatchEvent(new Dialog.HideEvent(!!cancelled));\n  }\n\n  /**\n   * Shows the dialog. Returns a promise that resolves when the dialog\n   * finishes entering the screen.\n   *\n   * @param returnFocusTo If provided, the dialog will call `.focus()` on that element once it's closed.\n   */\n  async show(returnFocusTo?: HTMLElement): Promise<void> {\n    this.__returnFocusTo = returnFocusTo;\n\n    await this.__setConnected(true);\n    await this.__setOpenDialogs([this, ...Dialog.openDialogs]);\n\n    const closeButton = this.renderRoot.querySelector('#close-button') as HTMLButtonElement;\n    closeButton?.focus();\n\n    this.dispatchEvent(new Dialog.ShowEvent());\n  }\n\n  /** Alias for `dialog.hide(false)`. */\n  async save(): Promise<void> {\n    await this.hide(false);\n  }\n\n  private async __setOpenDialogs(newValue: Dialog[]) {\n    Dialog.openDialogs.length = 0;\n    Dialog.openDialogs.push(...newValue);\n\n    await Promise.all([\n      // animate dialog stack\n      Promise.all(Dialog.openDialogs.map(dialog => dialog.requestUpdate())),\n\n      // trigger exit transition\n      new Promise(resolve => {\n        const backdrop = this.renderRoot.querySelector('#backdrop') as HTMLDivElement;\n        backdrop.addEventListener('transitionend', resolve, { once: true });\n        this.__visible = Dialog.openDialogs.includes(this);\n      }),\n    ]);\n  }\n\n  private async __setConnected(newValue: boolean) {\n    this.__connected = newValue;\n    await this.updateComplete.then(() => this.getBoundingClientRect());\n  }\n}\n\ncustomElements.define('foxy-dialog-window', DialogWindow);\n"]}

package/dist/elements/private/EditableList/EditableList.d.ts

@@ -1,10 +1,12 @@
 import { LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
-declare const EditableList_base: typeof LitElement & {
+declare const Base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & {
     styles: import("lit-element").CSSResultArray;
 } & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost> & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
 };
-export declare class EditableList extends EditableList_base {
+export declare class EditableList extends Base {
     static get properties(): PropertyDeclarations;
     options: {
         label?: string;

package/dist/elements/private/EditableList/EditableList.js

@@ -5,7 +5,9 @@ import { TranslatableMixin } from "../../../mixins/translatable.js";
 import { classMap } from "../../../utils/class-map.js";
 import { live } from 'lit-html/directives/live';
 import { repeat } from 'lit-html/directives/repeat';
-export class EditableList extends TranslatableMixin(ConfigurableMixin(ThemeableMixin(LitElement))) {
+import { InferrableMixin } from "../../../mixins/inferrable.js";
+const Base = TranslatableMixin(ConfigurableMixin(ThemeableMixin(InferrableMixin(LitElement))));
+export class EditableList extends Base {
     constructor() {
         super(...arguments);
         this.options = [];

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

@@ -1 +1 @@
-{"version":3,"file":"EditableList.js","sourceRoot":"","sources":["../../../../src/elements/private/EditableList/EditableList.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAwC,IAAI,EAAE,MAAM,aAAa,CAAC;AAErF,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAEpD,MAAM,OAAO,YAAa,SAAQ,iBAAiB,CAAC,iBAAiB,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC;IAAlG;;QAUE,YAAO,GAAwC,EAAE,CAAC;QAElD,UAAK,GAAyD,EAAE,CAAC;QAEzD,cAAS,GAAG,EAAE,CAAC;IA2GzB,CAAC;IAxHC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACtB,SAAS,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAChC,CAAC;IACJ,CAAC;IAQD,MAAM;QACJ,MAAM,iBAAiB,GAAG,QAAQ,CAAC;YACjC,8DAA8D,EAAE,IAAI;YACpE,0DAA0D,EAAE,IAAI;YAChE,kDAAkD,EAAE,CAAC,IAAI,CAAC,QAAQ;YAClE,8BAA8B,EAAE,IAAI,CAAC,QAAQ;YAC7C,kCAAkC,EAAE,CAAC,IAAI,CAAC,QAAQ;YAClD,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB,CAAC,CAAC;QAEH,MAAM,SAAS,GAAG,QAAQ,CAAC;YACzB,8CAA8C,EAAE,IAAI;YACpD,gBAAgB,EAAE,IAAI,CAAC,QAAQ;YAC/B,eAAe,EAAE,IAAI,CAAC,QAAQ;SAC/B,CAAC,CAAC;QAEH,MAAM,mBAAmB,GAAG,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;QAE7D,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,OAAO;YAC5B,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC;YAC3C,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;YAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC;YAC9C,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QACtB,CAAC,CAAC;QAEF,OAAO,IAAI,CAAA;;;;UAIL,MAAM,CACN,IAAI,CAAC,KAAK,EACV,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAClB,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;;YACd,OAAO,IAAI,CAAA;0BACG,SAAS;2CACQ,MAAA,IAAI,CAAC,KAAK,mCAAI,IAAI,CAAC,KAAK;;;+BAGpC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;0BACrB,iBAAiB;8BACb,IAAI,CAAC,QAAQ;2BAChB,GAAG,EAAE;gBACZ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;gBAC5B,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;gBAC5B,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC;YAChD,CAAC;;;;;aAKN,CAAC;QACJ,CAAC,CACF;;;;gBAIO,QAAQ,CAAC;YACf,4BAA4B,EAAE,IAAI;YAClC,6BAA6B,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;YACpD,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ;YACtB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB,CAAC;;;wBAGc,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC;;;mBAGxB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;sBACjB,IAAI,CAAC,QAAQ;sBACb,IAAI,CAAC,QAAQ;qBACd,CAAC,GAAkB,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,OAAO,IAAI,OAAO,EAAE;oBACzD,CAAC,GAAU,EAAE,EAAE,CAAC,GAAG,CAAC,eAAe,EAAE;mBACtC,CAAC,GAAe,EAAE,EAAE;YAC3B,IAAI,CAAC,SAAS,GAAI,GAAG,CAAC,aAAkC,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QACxE,CAAC;;;;YAIC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;YACtC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC;gBAAE,OAAO;YAC1D,OAAO,IAAI,CAAA,iBAAiB,KAAK,IAAI,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,KAAK,WAAW,CAAC;QACjE,CAAC,CAAC;;;yCAG6B,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,WAAW;;yBAE5D,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;oBACrB,QAAQ,CAAC;YACf,6EAA6E,EAAE,IAAI;YACnF,iEAAiE,EAAE,IAAI;YACvE,4CAA4C,EAAE,mBAAmB;YACjE,2CAA2C,EAAE,CAAC,mBAAmB;YACjE,8CAA8C,EAAE,CAAC,mBAAmB;YACpE,cAAc,EAAE,CAAC,mBAAmB;SACrC,CAAC;wBACU,mBAAmB;qBACtB,OAAO;;;;;;KAMvB,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport { live } from 'lit-html/directives/live';\nimport { repeat } from 'lit-html/directives/repeat';\n\nexport class EditableList extends TranslatableMixin(ConfigurableMixin(ThemeableMixin(LitElement))) {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      options: { type: Array },\n      items: { type: Array },\n      __newItem: { attribute: false },\n    };\n  }\n\n  options: { label?: string; value: string }[] = [];\n\n  items: { label?: string | TemplateResult; value: string }[] = [];\n\n  private __newItem = '';\n\n  render(): TemplateResult {\n    const deleteButtonClass = classMap({\n      'w-xs h-xs mr-xs rounded-full transition-colors flex-shrink-0': true,\n      'focus-outline-none focus-ring-2 ring-inset ring-error-50': true,\n      'text-tertiary hover-bg-error-10 hover-text-error': !this.disabled,\n      'cursor-default text-disabled': this.disabled,\n      'flex items-center justify-center': !this.readonly,\n      'hidden': this.readonly,\n    });\n\n    const itemClass = classMap({\n      'transition-colors h-l ml-m flex items-center': true,\n      'text-secondary': this.readonly,\n      'text-disabled': this.disabled,\n    });\n\n    const isAddButtonDisabled = this.disabled || !this.__newItem;\n\n    const addItem = () => {\n      if (!this.__newItem) return;\n      this.items.push({ value: this.__newItem });\n      this.requestUpdate('items');\n      this.dispatchEvent(new CustomEvent('change'));\n      this.__newItem = '';\n    };\n\n    return html`\n      <slot></slot>\n\n      <ol class=\"divide-y divide-contrast-10\">\n        ${repeat(\n          this.items,\n          item => item.value,\n          (item, index) => {\n            return html`\n              <li class=${itemClass}>\n                <div class=\"flex-1 mr-s\">${item.label ?? item.value}</div>\n\n                <button\n                  aria-label=${this.t('delete')}\n                  class=${deleteButtonClass}\n                  ?disabled=${this.disabled}\n                  @click=${() => {\n                    this.items.splice(index, 1);\n                    this.requestUpdate('items');\n                    this.dispatchEvent(new CustomEvent('change'));\n                  }}\n                >\n                  <iron-icon icon=\"lumo:cross\" class=\"icon-inline text-xl\"></iron-icon>\n                </button>\n              </li>\n            `;\n          }\n        )}\n      </ol>\n\n      <div\n        class=${classMap({\n          'ml-m h-l flex items-center': true,\n          'border-t border-contrast-10': this.items.length > 0,\n          'flex': !this.readonly,\n          'hidden': this.readonly,\n        })}\n      >\n        <input\n          placeholder=${this.t('type_here')}\n          class=\"w-full bg-transparent appearance-none h-m focus-outline-none\"\n          list=\"list\"\n          .value=${live(this.__newItem)}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n          @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n          @change=${(evt: Event) => evt.stopPropagation()}\n          @input=${(evt: InputEvent) => {\n            this.__newItem = (evt.currentTarget as HTMLInputElement).value.trim();\n          }}\n        />\n\n        <datalist id=\"list\">\n          ${this.options.map(({ label, value }) => {\n            if (this.items.some(item => item.value === value)) return;\n            return html`<option value=${value}>${label ?? value}</option>`;\n          })}\n        </datalist>\n\n        <div class=\"transition-opacity ${this.__newItem ? 'opacity-100' : 'opacity-0'}\">\n          <button\n            aria-label=${this.t('submit')}\n            class=${classMap({\n              'w-xs h-xs mr-xs flex-shrink-0 ring-inset ring-success-50 focus-outline-none': true,\n              'flex items-center justify-center rounded-full transition-colors': true,\n              'bg-contrast-5 text-disabled cursor-default': isAddButtonDisabled,\n              'bg-success-10 text-success cursor-pointer': !isAddButtonDisabled,\n              'hover-bg-success hover-text-success-contrast': !isAddButtonDisabled,\n              'focus-ring-2': !isAddButtonDisabled,\n            })}\n            ?disabled=${isAddButtonDisabled}\n            @click=${addItem}\n          >\n            <iron-icon icon=\"lumo:plus\" class=\"icon-inline text-l\"></iron-icon>\n          </button>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"EditableList.js","sourceRoot":"","sources":["../../../../src/elements/private/EditableList/EditableList.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\nimport { live } from 'lit-html/directives/live';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\nconst Base = TranslatableMixin(ConfigurableMixin(ThemeableMixin(InferrableMixin(LitElement))));\n\nexport class EditableList extends Base {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      options: { type: Array },\n      items: { type: Array },\n      __newItem: { attribute: false },\n    };\n  }\n\n  options: { label?: string; value: string }[] = [];\n\n  items: { label?: string | TemplateResult; value: string }[] = [];\n\n  private __newItem = '';\n\n  render(): TemplateResult {\n    const deleteButtonClass = classMap({\n      'w-xs h-xs mr-xs rounded-full transition-colors flex-shrink-0': true,\n      'focus-outline-none focus-ring-2 ring-inset ring-error-50': true,\n      'text-tertiary hover-bg-error-10 hover-text-error': !this.disabled,\n      'cursor-default text-disabled': this.disabled,\n      'flex items-center justify-center': !this.readonly,\n      'hidden': this.readonly,\n    });\n\n    const itemClass = classMap({\n      'transition-colors h-l ml-m flex items-center': true,\n      'text-secondary': this.readonly,\n      'text-disabled': this.disabled,\n    });\n\n    const isAddButtonDisabled = this.disabled || !this.__newItem;\n\n    const addItem = () => {\n      if (!this.__newItem) return;\n      this.items.push({ value: this.__newItem });\n      this.requestUpdate('items');\n      this.dispatchEvent(new CustomEvent('change'));\n      this.__newItem = '';\n    };\n\n    return html`\n      <slot></slot>\n\n      <ol class=\"divide-y divide-contrast-10\">\n        ${repeat(\n          this.items,\n          item => item.value,\n          (item, index) => {\n            return html`\n              <li class=${itemClass}>\n                <div class=\"flex-1 mr-s\">${item.label ?? item.value}</div>\n\n                <button\n                  aria-label=${this.t('delete')}\n                  class=${deleteButtonClass}\n                  ?disabled=${this.disabled}\n                  @click=${() => {\n                    this.items.splice(index, 1);\n                    this.requestUpdate('items');\n                    this.dispatchEvent(new CustomEvent('change'));\n                  }}\n                >\n                  <iron-icon icon=\"lumo:cross\" class=\"icon-inline text-xl\"></iron-icon>\n                </button>\n              </li>\n            `;\n          }\n        )}\n      </ol>\n\n      <div\n        class=${classMap({\n          'ml-m h-l flex items-center': true,\n          'border-t border-contrast-10': this.items.length > 0,\n          'flex': !this.readonly,\n          'hidden': this.readonly,\n        })}\n      >\n        <input\n          placeholder=${this.t('type_here')}\n          class=\"w-full bg-transparent appearance-none h-m focus-outline-none\"\n          list=\"list\"\n          .value=${live(this.__newItem)}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n          @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n          @change=${(evt: Event) => evt.stopPropagation()}\n          @input=${(evt: InputEvent) => {\n            this.__newItem = (evt.currentTarget as HTMLInputElement).value.trim();\n          }}\n        />\n\n        <datalist id=\"list\">\n          ${this.options.map(({ label, value }) => {\n            if (this.items.some(item => item.value === value)) return;\n            return html`<option value=${value}>${label ?? value}</option>`;\n          })}\n        </datalist>\n\n        <div class=\"transition-opacity ${this.__newItem ? 'opacity-100' : 'opacity-0'}\">\n          <button\n            aria-label=${this.t('submit')}\n            class=${classMap({\n              'w-xs h-xs mr-xs flex-shrink-0 ring-inset ring-success-50 focus-outline-none': true,\n              'flex items-center justify-center rounded-full transition-colors': true,\n              'bg-contrast-5 text-disabled cursor-default': isAddButtonDisabled,\n              'bg-success-10 text-success cursor-pointer': !isAddButtonDisabled,\n              'hover-bg-success hover-text-success-contrast': !isAddButtonDisabled,\n              'focus-ring-2': !isAddButtonDisabled,\n            })}\n            ?disabled=${isAddButtonDisabled}\n            @click=${addItem}\n          >\n            <iron-icon icon=\"lumo:plus\" class=\"icon-inline text-l\"></iron-icon>\n          </button>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/elements/private/FrequencyInput/FrequencyInput.d.ts

@@ -3,7 +3,9 @@ import '@vaadin/vaadin-custom-field';
 import '@vaadin/vaadin-combo-box';
 import '../../public/I18n/index';
 import { CSSResult, CSSResultArray, LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
-declare const FrequencyInput_base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+declare const FrequencyInput_base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
     defaultNS: string;
 };
 export declare class FrequencyInput extends FrequencyInput_base {

package/dist/elements/private/FrequencyInput/FrequencyInput.js

@@ -8,7 +8,8 @@ import { TranslatableMixin } from "../../../mixins/translatable.js";
 import { live } from '@open-wc/lit-helpers';
 import memoize from 'lodash-es/memoize';
 import { parseDuration } from "../../../utils/parse-duration.js";
-export class FrequencyInput extends TranslatableMixin(LitElement) {
+import { InferrableMixin } from "../../../mixins/inferrable.js";
+export class FrequencyInput extends TranslatableMixin(InferrableMixin(LitElement)) {
     constructor() {
         super(...arguments);
         this.label = '';

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

@@ -1 +1 @@
-{"version":3,"file":"FrequencyInput.js","sourceRoot":"","sources":["../../../../src/elements/private/FrequencyInput/FrequencyInput.ts"],"names":[],"mappings":"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","sourcesContent":["import '@vaadin/vaadin-text-field/vaadin-integer-field';\nimport '@vaadin/vaadin-custom-field';\nimport '@vaadin/vaadin-combo-box';\nimport '../../public/I18n/index';\n\nimport {\n  CSSResult,\n  CSSResultArray,\n  LitElement,\n  PropertyDeclarations,\n  TemplateResult,\n  css,\n  html,\n} from 'lit-element';\nimport type { CustomFieldElement, CustomFieldI18n } from '@vaadin/vaadin-custom-field';\n\nimport { FrequencyInputChangeEvent } from './FrequencyInputChangeEvent';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { live } from '@open-wc/lit-helpers';\nimport memoize from 'lodash-es/memoize';\nimport { parseDuration } from '../../../utils/parse-duration';\n\nexport class FrequencyInput extends TranslatableMixin(LitElement) {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      checkValidity: { attribute: false },\n      errorMessage: { type: String, attribute: 'error-message' },\n      disabled: { type: Boolean, reflect: true },\n      readonly: { type: Boolean, reflect: true },\n      label: { type: String },\n      value: { type: String },\n    };\n  }\n\n  static get styles(): CSSResult | CSSResultArray {\n    return css`\n      :host {\n        display: block;\n      }\n\n      vaadin-custom-field {\n        width: 100%;\n        font-size: 0;\n        line-height: 0;\n        padding-top: 0 !important;\n      }\n\n      vaadin-custom-field::part(label) {\n        padding-bottom: var(--lumo-space-s);\n      }\n\n      vaadin-custom-field::part(error-message)[aria-hidden='false'] {\n        padding-top: var(--lumo-space-xs);\n      }\n\n      vaadin-integer-field,\n      vaadin-combo-box {\n        width: calc(50% - (var(--lumo-space-s) / 2));\n      }\n\n      vaadin-integer-field {\n        margin-right: var(--lumo-space-s);\n        padding: 0;\n      }\n\n      vaadin-combo-box::part(text-field) {\n        padding: 0;\n      }\n    `;\n  }\n\n  label = '';\n\n  value = '';\n\n  disabled = false;\n\n  readonly = false;\n\n  errorMessage = '';\n\n  private __i18n: CustomFieldI18n = {\n    formatValue: inputValues => inputValues.join(''),\n    parseValue: value => {\n      const { count, units } = parseDuration(value);\n      return [count.toString(), units];\n    },\n  };\n\n  private __getItems = memoize((value: string) => {\n    const count = parseDuration(value).count;\n\n    return [\n      { value: 'd', label: this.t('day', { count }) },\n      { value: 'w', label: this.t('week', { count }) },\n      { value: 'm', label: this.t('month', { count }) },\n      { value: 'y', label: this.t('year', { count }) },\n    ];\n  });\n\n  render(): TemplateResult {\n    return html`\n      <vaadin-custom-field\n        data-testid=\"field\"\n        .i18n=${this.__i18n}\n        .label=${this.label}\n        .value=${live(this.value)}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        .errorMessage=${this.errorMessage}\n        .checkValidity=${this.checkValidity}\n        @change=${this.__handleChange}\n      >\n        <vaadin-integer-field\n          data-testid=\"value\"\n          min=\"1\"\n          max=\"999\"\n          has-controls\n          prevent-invalid-input\n          ?invalid=${!this.checkValidity()}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n        >\n        </vaadin-integer-field>\n\n        <vaadin-combo-box\n          data-testid=\"units\"\n          item-value-path=\"value\"\n          item-label-path=\"label\"\n          .items=${this.__getItems(this.value)}\n          ?invalid=${!this.checkValidity()}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n        >\n        </vaadin-combo-box>\n      </vaadin-custom-field>\n    `;\n  }\n\n  updated(changes: Map<keyof this, unknown>): void {\n    super.updated(changes);\n    const field = this.renderRoot.firstElementChild as CustomFieldElement;\n    if (field.value !== this.value) field.value = this.value;\n  }\n\n  checkValidity(): boolean {\n    return true;\n  }\n\n  private __handleChange(evt: CustomEvent<void>) {\n    const field = evt.target as CustomFieldElement;\n    this.value = field.value as string;\n    this.dispatchEvent(new FrequencyInputChangeEvent(this.value));\n  }\n}\n"]}
+{"version":3,"file":"FrequencyInput.js","sourceRoot":"","sources":["../../../../src/elements/private/FrequencyInput/FrequencyInput.ts"],"names":[],"mappings":"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","sourcesContent":["import '@vaadin/vaadin-text-field/vaadin-integer-field';\nimport '@vaadin/vaadin-custom-field';\nimport '@vaadin/vaadin-combo-box';\nimport '../../public/I18n/index';\n\nimport {\n  CSSResult,\n  CSSResultArray,\n  LitElement,\n  PropertyDeclarations,\n  TemplateResult,\n  css,\n  html,\n} from 'lit-element';\nimport type { CustomFieldElement, CustomFieldI18n } from '@vaadin/vaadin-custom-field';\n\nimport { FrequencyInputChangeEvent } from './FrequencyInputChangeEvent';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { live } from '@open-wc/lit-helpers';\nimport memoize from 'lodash-es/memoize';\nimport { parseDuration } from '../../../utils/parse-duration';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\nexport class FrequencyInput extends TranslatableMixin(InferrableMixin(LitElement)) {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      checkValidity: { attribute: false },\n      errorMessage: { type: String, attribute: 'error-message' },\n      disabled: { type: Boolean, reflect: true },\n      readonly: { type: Boolean, reflect: true },\n      label: { type: String },\n      value: { type: String },\n    };\n  }\n\n  static get styles(): CSSResult | CSSResultArray {\n    return css`\n      :host {\n        display: block;\n      }\n\n      vaadin-custom-field {\n        width: 100%;\n        font-size: 0;\n        line-height: 0;\n        padding-top: 0 !important;\n      }\n\n      vaadin-custom-field::part(label) {\n        padding-bottom: var(--lumo-space-s);\n      }\n\n      vaadin-custom-field::part(error-message)[aria-hidden='false'] {\n        padding-top: var(--lumo-space-xs);\n      }\n\n      vaadin-integer-field,\n      vaadin-combo-box {\n        width: calc(50% - (var(--lumo-space-s) / 2));\n      }\n\n      vaadin-integer-field {\n        margin-right: var(--lumo-space-s);\n        padding: 0;\n      }\n\n      vaadin-combo-box::part(text-field) {\n        padding: 0;\n      }\n    `;\n  }\n\n  label = '';\n\n  value = '';\n\n  disabled = false;\n\n  readonly = false;\n\n  errorMessage = '';\n\n  private __i18n: CustomFieldI18n = {\n    formatValue: inputValues => inputValues.join(''),\n    parseValue: value => {\n      const { count, units } = parseDuration(value);\n      return [count.toString(), units];\n    },\n  };\n\n  private __getItems = memoize((value: string) => {\n    const count = parseDuration(value).count;\n\n    return [\n      { value: 'd', label: this.t('day', { count }) },\n      { value: 'w', label: this.t('week', { count }) },\n      { value: 'm', label: this.t('month', { count }) },\n      { value: 'y', label: this.t('year', { count }) },\n    ];\n  });\n\n  render(): TemplateResult {\n    return html`\n      <vaadin-custom-field\n        data-testid=\"field\"\n        .i18n=${this.__i18n}\n        .label=${this.label}\n        .value=${live(this.value)}\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n        .errorMessage=${this.errorMessage}\n        .checkValidity=${this.checkValidity}\n        @change=${this.__handleChange}\n      >\n        <vaadin-integer-field\n          data-testid=\"value\"\n          min=\"1\"\n          max=\"999\"\n          has-controls\n          prevent-invalid-input\n          ?invalid=${!this.checkValidity()}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n        >\n        </vaadin-integer-field>\n\n        <vaadin-combo-box\n          data-testid=\"units\"\n          item-value-path=\"value\"\n          item-label-path=\"label\"\n          .items=${this.__getItems(this.value)}\n          ?invalid=${!this.checkValidity()}\n          ?disabled=${this.disabled}\n          ?readonly=${this.readonly}\n        >\n        </vaadin-combo-box>\n      </vaadin-custom-field>\n    `;\n  }\n\n  updated(changes: Map<keyof this, unknown>): void {\n    super.updated(changes);\n    const field = this.renderRoot.firstElementChild as CustomFieldElement;\n    if (field.value !== this.value) field.value = this.value;\n  }\n\n  checkValidity(): boolean {\n    return true;\n  }\n\n  private __handleChange(evt: CustomEvent<void>) {\n    const field = evt.target as CustomFieldElement;\n    this.value = field.value as string;\n    this.dispatchEvent(new FrequencyInputChangeEvent(this.value));\n  }\n}\n"]}

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

@@ -0,0 +1,31 @@
+import type { PropertyDeclarations, TemplateResult } from 'lit-element';
+import type { Data } from './types';
+import { NucleonElement } from '../NucleonElement/NucleonElement';
+declare const Base: typeof NucleonElement & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+} & {
+    styles: import("lit-element").CSSResultArray;
+};
+/**
+ * Interactive hAPI explorer.
+ *
+ * @element foxy-api-explorer
+ * @since 1.17.0
+ */
+export declare class ApiBrowser extends Base<Data> {
+    static get properties(): PropertyDeclarations;
+    /** Bookmark URL of your API. */
+    home: string | null;
+    private __history;
+    private __debounce;
+    private __renderItem;
+    private __handleExistingResourceFetch;
+    render(): TemplateResult;
+    private get __canGoBack();
+    private get __canGoHome();
+    private get __mode();
+    private set __mode(value);
+    private __goBack;
+    private __goHome;
+}
+export {};