npm - @foxy.io/elements - Versions diffs - 1.16.0-beta.3 → 1.16.0-beta.6 - Mend

@foxy.io/elements 1.16.0-beta.3 → 1.16.0-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (490) hide show

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

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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"]}
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';\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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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~~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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';\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"]}
1	+ {"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 CHANGED Viewed

@@ -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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FrequencyInput.js","sourceRoot":"","sources":["../../../../src/elements/private/FrequencyInput/FrequencyInput.ts"],"names":[],"mappings":"AAAA,OAAO,gDAAgD,CAAC;AACxD,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAClC,oCAAiC;AAEjC,OAAO,EAGL,UAAU,EAGV,GAAG,EACH,IAAI,GACL,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,yBAAyB,EAAE,uCAAoC;AACxE,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,OAAO,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,yCAAsC;~~AAE9D~~,MAAM,OAAO,cAAe,SAAQ,iBAAiB,CAAC,UAAU,CAAC;~~IAAjE~~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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"]}
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';\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/CollectionPage/CollectionPage.d.ts CHANGED Viewed

@@ -1,19 +1,20 @@
 import { ExtractItem, ItemRenderer, Page } from './types';
 import { PropertyDeclarations, TemplateResult } from 'lit-element';
 import { NucleonElement } from '../NucleonElement/NucleonElement';
-declare const CollectionPage_base: typeof NucleonElement & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
+declare const Base: typeof NucleonElement & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
 /**
  * Renders an element for each resource in a collection page.
  *
  * @element foxy-collection-page
  * @since 1.1.0
  */
-export declare class CollectionPage<TPage extends Page> extends CollectionPage_base<TPage> {
+export declare class CollectionPage<TPage extends Page> extends Base<TPage> {
     /** @readonly */
     static get properties(): PropertyDeclarations;
     /** Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the item element). */
     props: Record<string, unknown>;
-    ns: string;
     private __pageFetchEventHandler;
     private __renderItem;
     private __item;

package/dist/elements/public/CollectionPage/CollectionPage.js CHANGED Viewed

@@ -1,21 +1,22 @@
 import { html } from 'lit-element';
+import { TranslatableMixin } from "../../../mixins/translatable.js";
 import { ConfigurableMixin } from "../../../mixins/configurable.js";
 import { FetchEvent } from "../NucleonElement/FetchEvent.js";
 import { NucleonElement } from "../NucleonElement/NucleonElement.js";
 import { repeat } from 'lit-html/directives/repeat';
 import { spread } from '@open-wc/lit-helpers';
+const Base = ConfigurableMixin(TranslatableMixin(NucleonElement));
 /**
  * Renders an element for each resource in a collection page.
  *
  * @element foxy-collection-page
  * @since 1.1.0
  */
-export class CollectionPage extends ConfigurableMixin(NucleonElement) {
+export class CollectionPage extends Base {
     constructor() {
         super();
         /** Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the item element). */
         this.props = {};
-        this.ns = '';
         this.__pageFetchEventHandler = (evt) => this.__handlePageFetchEvent(evt);
         this.item = 'foxy-null';
     }
@@ -25,7 +26,6 @@ export class CollectionPage extends ConfigurableMixin(NucleonElement) {
             ...super.properties,
             props: { type: Object },
             item: { type: String },
-            ns: { type: String },
         };
     }
     /**
@@ -50,6 +50,7 @@ export class CollectionPage extends ConfigurableMixin(NucleonElement) {
             readonlycontrols=\${ctx.readonlyControls.toString()}
             hiddencontrols=\${ctx.hiddenControls.toString()}
             data-testclass="items"
+            related=\${JSON.stringify(ctx.related)}
             parent=\${ctx.parent}
             group=\${ctx.group}
             href=\${ctx.href}
@@ -102,6 +103,7 @@ export class CollectionPage extends ConfigurableMixin(NucleonElement) {
             disabled: this.disabled,
             readonly: this.readonly,
             previous: (_c = (_b = items[index - 1]) === null || _b === void 0 ? void 0 : _b.data) !== null && _c !== void 0 ? _c : null,
+            related: this.related,
             hidden: this.hidden,
             parent: this.href,
             spread: spread,

package/dist/elements/public/CollectionPage/CollectionPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CollectionPage.js","sourceRoot":"","sources":["../../../../src/elements/public/CollectionPage/CollectionPage.ts"],"names":[],"mappings":"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","sourcesContent":["import { ExtractItem, ItemRenderer, Page } from './types';\nimport { PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { spread } from '@open-wc/lit-helpers';\n\n/*\n Renders an element for each resource in a collection page.\n \n @element foxy-collection-page\n * @since 1.1.0\n /\nexport class CollectionPage<TPage extends Page> extends ConfigurableMixin(NucleonElement)<TPage> {\n /* @readonly /\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n props: { type: Object },\n item: { type: String },\n ns: { type: String },\n };\n }\n\n /* Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the item element). /\n props: Record<string, unknown> = {};\n\n ns = '';\n\n private __pageFetchEventHandler = (evt: unknown) => this.__handlePageFetchEvent(evt);\n\n private __renderItem!: ItemRenderer<ExtractItem<TPage>>;\n\n private __item!: string \| ItemRenderer<ExtractItem<TPage>>;\n\n constructor() {\n super();\n this.item = 'foxy-null';\n }\n\n /\n Custom element tag or a render function to use for displaying collection items.\n * Generated custom elements will have the following attributes:\n \n - `parent` – same as `foxy-collection-page[href]`;\n * - `group` - same as `foxy-collection-page[group]`;\n * - `href` – collection page item's `_links.self.href` value;\n * - `lang` – same as `foxy-collection-page[lang]`;\n \n Render function will receive `ItemRendererContext` in the first argument.\n /\n get item(): string \| ItemRenderer<ExtractItem<TPage>> {\n return this.__item;\n }\n\n set item(value: string \| ItemRenderer<ExtractItem<TPage>>) {\n if (typeof value === 'string') {\n this.__renderItem = new Function(\n 'ctx',\n `return ctx.html\\`\n <${value}\n disabledcontrols=\\${ctx.disabledControls.toString()}\n readonlycontrols=\\${ctx.readonlyControls.toString()}\n hiddencontrols=\\${ctx.hiddenControls.toString()}\n data-testclass=\"items\"\n parent=\\${ctx.parent}\n group=\\${ctx.group}\n href=\\${ctx.href}\n lang=\\${ctx.lang}\n ns=\"\\${ctx.ns} $\\{customElements.get('${value}')?.defaultNS ?? ''}\"\n ?disabled=\\${ctx.disabled}\n ?readonly=\\${ctx.readonly}\n ?hidden=\\${ctx.hidden}\n .templates=\\${ctx.templates}\n ...=\\${ctx.spread(ctx.props)}\n >\n </${value}>\\``\n ) as ItemRenderer;\n } else {\n this.__renderItem = value;\n }\n\n this.__item = value;\n this.requestUpdate();\n }\n\n /* @readonly /\n createRenderRoot(): HTMLElement {\n return this;\n }\n\n /* @readonly /\n connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('fetch', this.__pageFetchEventHandler);\n }\n\n /* @readonly /\n render(): TemplateResult {\n type RepeatItem = { key: string; href: string; data: ExtractItem<TPage> \| null };\n const items: RepeatItem[] = this.__items.map(item => ({\n key: item._links.self.href,\n href: item._links.self.href,\n data: item,\n }));\n\n if (this.in('busy')) {\n items.push({ key: 'stalled', href: 'foxy://collection-page/stall', data: null });\n } else if (this.in('fail')) {\n items.push({ key: 'failed', href: 'foxy://collection-page/fail', data: null });\n } else if (this.in({ idle: 'template' }) \|\| this.__items.length === 0) {\n items.push({ key: 'empty', href: '', data: null });\n }\n\n return html`${repeat(\n items,\n item => item.key,\n (item, index) =>\n this.__renderItem?.({\n disabledControls: this.disabledControls,\n readonlyControls: this.readonlyControls,\n hiddenControls: this.hiddenControls,\n templates: this.templates,\n disabled: this.disabled,\n readonly: this.readonly,\n previous: items[index - 1]?.data ?? null,\n hidden: this.hidden,\n parent: this.href,\n spread: spread,\n props: this.props,\n group: this.group,\n lang: this.lang,\n data: item.data,\n href: item.href,\n next: items[index + 1]?.data ?? null,\n ns: this.ns,\n html,\n })\n )}`;\n }\n\n /* @readonly /\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('fetch', this.__pageFetchEventHandler);\n }\n\n private get __items(): ExtractItem<TPage>[] {\n return Array.from(Object.values(this.form?._embedded ?? {}) as any[]).reduce(\n (p, c) => [...p, ...c],\n [] as ExtractItem<TPage>[]\n );\n }\n\n private __handlePageFetchEvent(event: unknown) {\n if (!(event instanceof FetchEvent) \|\| event.target === this) return;\n const { method, url } = event.request;\n\n if (method !== 'GET') return;\n if (url === 'foxy://collection-page/stall') return this.__stallRequest(event);\n if (url === 'foxy://collection-page/fail') return this.__failRequest(event);\n }\n\n private __stallRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(new Promise(() => void 0));\n }\n\n private __failRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(Promise.resolve(new Response(null, { status: 500 })));\n }\n}\n\nexport from './types';\n"]}
1	+ {"version":3,"file":"CollectionPage.js","sourceRoot":"","sources":["../../../../src/elements/public/CollectionPage/CollectionPage.ts"],"names":[],"mappings":"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","sourcesContent":["import { ExtractItem, ItemRenderer, Page } from './types';\nimport { PropertyDeclarations, TemplateResult, html } from 'lit-element';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { spread } from '@open-wc/lit-helpers';\n\nconst Base = ConfigurableMixin(TranslatableMixin(NucleonElement));\n\n/*\n Renders an element for each resource in a collection page.\n \n @element foxy-collection-page\n * @since 1.1.0\n /\nexport class CollectionPage<TPage extends Page> extends Base<TPage> {\n /* @readonly /\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n props: { type: Object },\n item: { type: String },\n };\n }\n\n /* Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the item element). /\n props: Record<string, unknown> = {};\n\n private __pageFetchEventHandler = (evt: unknown) => this.__handlePageFetchEvent(evt);\n\n private __renderItem!: ItemRenderer<ExtractItem<TPage>>;\n\n private __item!: string \| ItemRenderer<ExtractItem<TPage>>;\n\n constructor() {\n super();\n this.item = 'foxy-null';\n }\n\n /\n Custom element tag or a render function to use for displaying collection items.\n * Generated custom elements will have the following attributes:\n \n - `parent` – same as `foxy-collection-page[href]`;\n * - `group` - same as `foxy-collection-page[group]`;\n * - `href` – collection page item's `_links.self.href` value;\n * - `lang` – same as `foxy-collection-page[lang]`;\n \n Render function will receive `ItemRendererContext` in the first argument.\n /\n get item(): string \| ItemRenderer<ExtractItem<TPage>> {\n return this.__item;\n }\n\n set item(value: string \| ItemRenderer<ExtractItem<TPage>>) {\n if (typeof value === 'string') {\n this.__renderItem = new Function(\n 'ctx',\n `return ctx.html\\`\n <${value}\n disabledcontrols=\\${ctx.disabledControls.toString()}\n readonlycontrols=\\${ctx.readonlyControls.toString()}\n hiddencontrols=\\${ctx.hiddenControls.toString()}\n data-testclass=\"items\"\n related=\\${JSON.stringify(ctx.related)}\n parent=\\${ctx.parent}\n group=\\${ctx.group}\n href=\\${ctx.href}\n lang=\\${ctx.lang}\n ns=\"\\${ctx.ns} $\\{customElements.get('${value}')?.defaultNS ?? ''}\"\n ?disabled=\\${ctx.disabled}\n ?readonly=\\${ctx.readonly}\n ?hidden=\\${ctx.hidden}\n .templates=\\${ctx.templates}\n ...=\\${ctx.spread(ctx.props)}\n >\n </${value}>\\``\n ) as ItemRenderer;\n } else {\n this.__renderItem = value;\n }\n\n this.__item = value;\n this.requestUpdate();\n }\n\n /* @readonly /\n createRenderRoot(): HTMLElement {\n return this;\n }\n\n /* @readonly /\n connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('fetch', this.__pageFetchEventHandler);\n }\n\n /* @readonly /\n render(): TemplateResult {\n type RepeatItem = { key: string; href: string; data: ExtractItem<TPage> \| null };\n const items: RepeatItem[] = this.__items.map(item => ({\n key: item._links.self.href,\n href: item._links.self.href,\n data: item,\n }));\n\n if (this.in('busy')) {\n items.push({ key: 'stalled', href: 'foxy://collection-page/stall', data: null });\n } else if (this.in('fail')) {\n items.push({ key: 'failed', href: 'foxy://collection-page/fail', data: null });\n } else if (this.in({ idle: 'template' }) \|\| this.__items.length === 0) {\n items.push({ key: 'empty', href: '', data: null });\n }\n\n return html`${repeat(\n items,\n item => item.key,\n (item, index) =>\n this.__renderItem?.({\n disabledControls: this.disabledControls,\n readonlyControls: this.readonlyControls,\n hiddenControls: this.hiddenControls,\n templates: this.templates,\n disabled: this.disabled,\n readonly: this.readonly,\n previous: items[index - 1]?.data ?? null,\n related: this.related,\n hidden: this.hidden,\n parent: this.href,\n spread: spread,\n props: this.props,\n group: this.group,\n lang: this.lang,\n data: item.data,\n href: item.href,\n next: items[index + 1]?.data ?? null,\n ns: this.ns,\n html,\n })\n )}`;\n }\n\n /* @readonly /\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('fetch', this.__pageFetchEventHandler);\n }\n\n private get __items(): ExtractItem<TPage>[] {\n return Array.from(Object.values(this.form?._embedded ?? {}) as any[]).reduce(\n (p, c) => [...p, ...c],\n [] as ExtractItem<TPage>[]\n );\n }\n\n private __handlePageFetchEvent(event: unknown) {\n if (!(event instanceof FetchEvent) \|\| event.target === this) return;\n const { method, url } = event.request;\n\n if (method !== 'GET') return;\n if (url === 'foxy://collection-page/stall') return this.__stallRequest(event);\n if (url === 'foxy://collection-page/fail') return this.__failRequest(event);\n }\n\n private __stallRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(new Promise(() => void 0));\n }\n\n private __failRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(Promise.resolve(new Response(null, { status: 500 })));\n }\n}\n\nexport from './types';\n"]}

package/dist/elements/public/CollectionPage/types.d.ts CHANGED Viewed

@@ -17,6 +17,7 @@ export declare type ItemRendererContext<TItem extends HALJSONResource = HALJSONR
     readonly: boolean;
     disabled: boolean;
     previous: TItem | null;
+    related: string[];
     hidden: boolean;
     parent: string;
     spread: typeof spread;

package/dist/elements/public/CollectionPage/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/CollectionPage/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TemplateResult, html } from 'lit-html';\n\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { HALJSONResource } from '../NucleonElement/types';\nimport { Renderer } from '../../../mixins/configurable';\nimport { spread } from '@open-wc/lit-helpers';\n\nexport type Page = HALJSONResource & { _embedded: Record<string, HALJSONResource[]> };\nexport type ExtractItem<T> = T extends { _embedded: Record<string, (infer U)[]> } ? U : never;\n\nexport type ItemRendererContext<TItem extends HALJSONResource = HALJSONResource> = {\n readonlyControls: BooleanSelector;\n disabledControls: BooleanSelector;\n hiddenControls: BooleanSelector;\n templates: Partial<Record<string, Renderer<any>>>;\n readonly: boolean;\n disabled: boolean;\n previous: TItem \| null;\n hidden: boolean;\n parent: string;\n spread: typeof spread;\n props: Record<string, unknown>;\n group: string;\n html: typeof html;\n lang: string;\n href: string;\n data: TItem \| null;\n next: TItem \| null;\n ns: string;\n};\n\nexport type ItemRenderer<TItem extends HALJSONResource = HALJSONResource> = (\n ctx: ItemRendererContext<TItem>\n) => TemplateResult;\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/public/CollectionPage/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TemplateResult, html } from 'lit-html';\n\nimport { BooleanSelector } from '@foxy.io/sdk/core';\nimport { HALJSONResource } from '../NucleonElement/types';\nimport { Renderer } from '../../../mixins/configurable';\nimport { spread } from '@open-wc/lit-helpers';\n\nexport type Page = HALJSONResource & { _embedded: Record<string, HALJSONResource[]> };\nexport type ExtractItem<T> = T extends { _embedded: Record<string, (infer U)[]> } ? U : never;\n\nexport type ItemRendererContext<TItem extends HALJSONResource = HALJSONResource> = {\n readonlyControls: BooleanSelector;\n disabledControls: BooleanSelector;\n hiddenControls: BooleanSelector;\n templates: Partial<Record<string, Renderer<any>>>;\n readonly: boolean;\n disabled: boolean;\n previous: TItem \| null;\n related: string[];\n hidden: boolean;\n parent: string;\n spread: typeof spread;\n props: Record<string, unknown>;\n group: string;\n html: typeof html;\n lang: string;\n href: string;\n data: TItem \| null;\n next: TItem \| null;\n ns: string;\n};\n\nexport type ItemRenderer<TItem extends HALJSONResource = HALJSONResource> = (\n ctx: ItemRendererContext<TItem>\n) => TemplateResult;\n"]}

package/dist/elements/public/CollectionPages/CollectionPages.d.ts CHANGED Viewed

@@ -1,7 +1,9 @@
 import { Context, Event, Page, PageRenderer } from './types';
 import { LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
 import { State } from 'xstate';
-declare const CollectionPages_base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
+declare const Base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
 /**
  * Renders an element for each page in a collection.
  *
@@ -11,7 +13,7 @@ declare const CollectionPages_base: typeof LitElement & import("lit-element").Co
  * @element foxy-collection-pages
  * @since 1.1.0
  */
-export declare class CollectionPages<TPage extends Page> extends CollectionPages_base {
+export declare class CollectionPages<TPage extends Page> extends Base {
     /** @readonly */
     static get properties(): PropertyDeclarations;
     /** Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the page element). */

package/dist/elements/public/CollectionPages/CollectionPages.js CHANGED Viewed

@@ -8,6 +8,8 @@ import { machine } from "./machine.js";
 import { repeat } from 'lit-html/directives/repeat';
 import { serveFromCache } from "../NucleonElement/serveFromCache.js";
 import { spread } from '@open-wc/lit-helpers';
+import { InferrableMixin } from "../../../mixins/inferrable.js";
+const Base = ConfigurableMixin(InferrableMixin(LitElement));
 /**
  * Renders an element for each page in a collection.
  *
@@ -17,7 +19,7 @@ import { spread } from '@open-wc/lit-helpers';
  * @element foxy-collection-pages
  * @since 1.1.0
  */
-export class CollectionPages extends ConfigurableMixin(LitElement) {
+export class CollectionPages extends Base {
     constructor() {
         super();
         /** Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the page element). */

package/dist/elements/public/CollectionPages/CollectionPages.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CollectionPages.js","sourceRoot":"","sources":["../../../../src/elements/public/CollectionPages/CollectionPages.ts"],"names":[],"mappings":"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","sourcesContent":["import { Context, Event, Page, PageRenderer } from './types';\nimport { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\nimport { State, StateMachine, interpret } from 'xstate';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { Rumour } from '@foxy.io/sdk/core';\nimport { machine } from './machine';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { serveFromCache } from '../NucleonElement/serveFromCache';\nimport { spread } from '@open-wc/lit-helpers';\n\n/*\n Renders an element for each page in a collection.\n \n @fires NucleonElement#update - Instance of `NucleonElement.UpdateEvent`. Dispatched on an element whenever it changes its state.\n * @fires NucleonElement#fetch - Instance of `NucleonElement.API.FetchEvent`. Emitted before each API request.\n \n @element foxy-collection-pages\n * @since 1.1.0\n /\nexport class CollectionPages<TPage extends Page> extends ConfigurableMixin(LitElement) {\n /* @readonly /\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n manual: { type: Boolean, reflect: true },\n first: { type: String, noAccessor: true },\n pages: { type: Array, noAccessor: true },\n group: { type: String },\n props: { type: Object },\n lang: { type: String },\n page: { type: String },\n ns: { type: String },\n };\n }\n\n /* Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the page element). /\n props: Record<string, unknown> = {};\n\n /* Optional ISO 639-1 code describing the language element content is written in. /\n lang = '';\n\n ns = '';\n\n private __renderPage!: PageRenderer<TPage>;\n\n private __page!: string \| PageRenderer<TPage>;\n\n private __group = '';\n\n private __stopTrackingRumour!: () => void;\n\n private __fetchEventHandler = (evt: unknown) => this.__handleFetchEvent(evt);\n\n private __service = interpret(\n (machine as unknown as StateMachine<Context<TPage>, any, Event<TPage>>).withConfig({\n services: {\n observeChildren: () => callback => {\n const observer = new IntersectionObserver(entries => {\n if (entries.some(entry => entry.isIntersecting)) callback('RESUME');\n });\n\n observer.observe(this.renderRoot.children[this.renderRoot.children.length - 1]);\n return () => observer.disconnect();\n },\n\n sendGet: async ctx => {\n const lastPage = ctx.pages[ctx.pages.length - 1];\n const lastPageHref = lastPage?._links.next.href ?? ctx.first;\n const response = await new NucleonElement.API(this).fetch(lastPageHref);\n\n if (!response.ok) throw response;\n const json = await response.json();\n\n this.__stopTrackingRumour();\n\n NucleonElement.Rumour(this.group).share({\n source: json._links.self.href,\n data: json,\n });\n\n this.__trackRumour();\n\n return json;\n },\n },\n })\n );\n\n constructor() {\n super();\n this.page = 'foxy-collection-page foxy-null';\n }\n\n /\n Custom element tag or a render function to use for displaying collection pages.\n * Generated custom elements will have the following attributes:\n \n - `group` – same as `foxy-collection-pages[group]`;\n * - `href` – collection page's `_links.self.href` value;\n * - `lang` – same as `foxy-collection-pages[lang]`;\n * - `item` – will contain `item-tag` when provided with a string value formatted as `page-tag item-tag`.\n \n Render function will receive `PageRenderer<TPage>` in the first argument.\n * Uses `foxy-collection-page` by default.\n /\n get page(): string \| PageRenderer<TPage> {\n return this.__page;\n }\n\n set page(value: string \| PageRenderer<TPage>) {\n if (typeof value === 'string') {\n const item = value.split(' ').pop();\n const itemAttribute = item ? `item=\"${item}\"` : '';\n\n this.__renderPage = new Function(\n 'ctx',\n `return ctx.html\\`\n <${value}\n disabledcontrols=\\${ctx.disabledControls.toString()}\n readonlycontrols=\\${ctx.readonlyControls.toString()}\n hiddencontrols=\\${ctx.hiddenControls.toString()}\n group=\\${ctx.group}\n href=\\${ctx.href}\n lang=\\${ctx.lang}\n ns=\"$\\{ctx.ns} $\\{customElements.get('${value}')?.defaultNS ?? ''}\"\n ${itemAttribute}\n ?disabled=\\${ctx.disabled}\n ?readonly=\\${ctx.readonly}\n ?hidden=\\${ctx.hidden}\n .templates=\\${ctx.templates}\n ...=\\${ctx.spread(ctx.props)}\n >\n </${value}>\\``\n ) as PageRenderer<TPage>;\n } else {\n this.__renderPage = value;\n }\n\n this.__page = value;\n this.requestUpdate();\n }\n\n /* URL of the first page in a collection. /\n get first(): string {\n return this.__service.state.context.first;\n }\n\n set first(data: string) {\n this.__service.send({ type: 'SET_FIRST', data });\n }\n\n /* Array of all currently loaded pages in a collection. /\n get pages(): TPage[] {\n return this.__service.state.context.pages;\n }\n\n set pages(data: TPage[]) {\n this.__service.send({ type: 'SET_PAGES', data });\n }\n\n /* Rumour group. Elements in different groups will not share updates. Empty by default. /\n get group(): string {\n return this.__group;\n }\n\n set group(value: string) {\n this.__group = value;\n this.__stopTrackingRumour?.();\n this.__trackRumour();\n }\n\n /* If false, will load pages on scroll. If true, will display a button triggering the process. /\n get manual(): boolean {\n return this.__service.state.context.manual;\n }\n\n set manual(data: boolean) {\n this.__service.send({ type: 'SET_MANUAL', data });\n }\n\n /\n Checks if this element is in the given state. Available states:\n \n - `busy` when loading a page;\n * - `fail` when page load fails;\n * - `idle` when not loading anything for one of the reasons below:\n * - `paused` if waiting for user to scroll further;\n * - `manual` when next page load will be triggered by clicking a button;\n * - `auto` when next page load will be triggered by scrolling to the observer target;\n * - `empty` if collection is empty;\n * - `end` if there are no more items in a collection.\n \n @example element.in({ idle: 'empty' })\n /\n in(stateValue: State<Context, Event>['value']): boolean {\n return this.__service.state.matches(stateValue);\n }\n\n /* @readonly /\n createRenderRoot(): CollectionPages<TPage> {\n return this;\n }\n\n /* @readonly /\n connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('fetch', this.__fetchEventHandler);\n this.__createService();\n this.__trackRumour();\n }\n\n /* @readonly /\n render(): TemplateResult {\n const items = this.pages.map(page => ({\n key: page._links.self.href,\n href: page._links.self.href,\n }));\n\n if (this.__service.state.matches('busy')) {\n items.push({ key: 'stalled', href: 'foxy://collection-pages/stall' });\n } else if (this.__service.state.matches('fail')) {\n items.push({ key: 'failed', href: 'foxy://collection-pages/fail' });\n } else if (this.__service.state.matches({ idle: 'empty' })) {\n items.push({ key: 'empty', href: '' });\n }\n\n return html`\n <!-- collection items -->\n ${repeat(\n items,\n page => page.key,\n (page, pageIndex) => {\n return this.__renderPage({\n disabledControls: this.disabledControls,\n readonlyControls: this.readonlyControls,\n hiddenControls: this.hiddenControls,\n templates: this.templates,\n disabled: this.disabled,\n readonly: this.readonly,\n hidden: this.hidden,\n spread: spread,\n props: this.props,\n group: this.group,\n data: this.pages[pageIndex] ?? null,\n href: page.href,\n lang: this.lang,\n ns: this.ns,\n html,\n });\n }\n )}\n ${this.manual\n ? this.in({ idle: 'paused' })\n ? html`\n <!-- manual trigger -->\n <vaadin-button theme=\"small contrast\" @click=${() => this.__service.send('RESUME')}>\n <foxy-i18n lang=${this.lang} key=\"load_more\" ns=${this.ns}></foxy-i18n>\n </vaadin-button>\n `\n : ''\n : html`\n <!-- intersection observer target -->\n <span></span>\n `}\n `;\n }\n\n /* @readonly /\n updated(changes: Map<keyof this, unknown>): void {\n super.updated(changes);\n this.dispatchEvent(new NucleonElement.UpdateEvent());\n }\n\n /* @readonly */\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('fetch', this.__fetchEventHandler);\n this.__service.stop();\n this.__stopTrackingRumour?.();\n }\n\n private __trackRumour() {\n this.__stopTrackingRumour = NucleonElement.Rumour(this.group).track(update => {\n try {\n if (this.pages.length === 0) {\n update({ _links: { self: { href: this.first } } });\n } else {\n this.pages.map(page => update(page));\n }\n } catch (err) {\n if (err instanceof Rumour.UpdateError) {\n this.__service.send({ type: 'SET_FIRST', data: this.first });\n } else {\n throw err;\n }\n }\n });\n }\n\n private __createService() {\n this.__service\n .onTransition(({ changed }) => changed && this.requestUpdate())\n .onChange(() => this.requestUpdate())\n .start();\n }\n\n private __handleFetchEvent(event: unknown) {\n if (!(event instanceof FetchEvent) \|\| event.target === this) return;\n const { method, url } = event.request;\n\n if (method !== 'GET') return;\n if (url === 'foxy://collection-pages/stall') return this.__stallRequest(event);\n if (url === 'foxy://collection-pages/fail') return this.__failRequest(event);\n\n this.__respondIfPossible(event);\n }\n\n private __respondIfPossible(event: FetchEvent) {\n const cacheResponse = serveFromCache(event.request.url, this.pages);\n if (!cacheResponse.ok) return;\n\n event.respondWith(Promise.resolve(cacheResponse));\n console.debug(\n `%c@foxy.io/elements::${this.localName}\\n%c200%c GET ${event.request.url}`,\n 'color: gray',\n `background: gray; padding: 0 .2em; border-radius: .2em; color: white;`,\n ''\n );\n }\n\n private __stallRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(new Promise(() => void 0));\n }\n\n private __failRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(Promise.resolve(this.__service.state.context.error as Response));\n }\n}\n"]}
1	+ {"version":3,"file":"CollectionPages.js","sourceRoot":"","sources":["../../../../src/elements/public/CollectionPages/CollectionPages.ts"],"names":[],"mappings":"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","sourcesContent":["import { Context, Event, Page, PageRenderer } from './types';\nimport { LitElement, PropertyDeclarations, TemplateResult, html } from 'lit-element';\nimport { State, StateMachine, interpret } from 'xstate';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { FetchEvent } from '../NucleonElement/FetchEvent';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { Rumour } from '@foxy.io/sdk/core';\nimport { machine } from './machine';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { serveFromCache } from '../NucleonElement/serveFromCache';\nimport { spread } from '@open-wc/lit-helpers';\nimport { InferrableMixin } from '../../../mixins/inferrable';\n\nconst Base = ConfigurableMixin(InferrableMixin(LitElement));\n\n/*\n Renders an element for each page in a collection.\n \n @fires NucleonElement#update - Instance of `NucleonElement.UpdateEvent`. Dispatched on an element whenever it changes its state.\n * @fires NucleonElement#fetch - Instance of `NucleonElement.API.FetchEvent`. Emitted before each API request.\n \n @element foxy-collection-pages\n * @since 1.1.0\n /\nexport class CollectionPages<TPage extends Page> extends Base {\n /* @readonly /\n static get properties(): PropertyDeclarations {\n return {\n ...super.properties,\n manual: { type: Boolean, reflect: true },\n first: { type: String, noAccessor: true },\n pages: { type: Array, noAccessor: true },\n group: { type: String },\n props: { type: Object },\n lang: { type: String },\n page: { type: String },\n ns: { type: String },\n };\n }\n\n /* Spread directive argument from `@open-wc/lit-helpers` (properties, event listeners and attributes you'd like to pass to the page element). /\n props: Record<string, unknown> = {};\n\n /* Optional ISO 639-1 code describing the language element content is written in. /\n lang = '';\n\n ns = '';\n\n private __renderPage!: PageRenderer<TPage>;\n\n private __page!: string \| PageRenderer<TPage>;\n\n private __group = '';\n\n private __stopTrackingRumour!: () => void;\n\n private __fetchEventHandler = (evt: unknown) => this.__handleFetchEvent(evt);\n\n private __service = interpret(\n (machine as unknown as StateMachine<Context<TPage>, any, Event<TPage>>).withConfig({\n services: {\n observeChildren: () => callback => {\n const observer = new IntersectionObserver(entries => {\n if (entries.some(entry => entry.isIntersecting)) callback('RESUME');\n });\n\n observer.observe(this.renderRoot.children[this.renderRoot.children.length - 1]);\n return () => observer.disconnect();\n },\n\n sendGet: async ctx => {\n const lastPage = ctx.pages[ctx.pages.length - 1];\n const lastPageHref = lastPage?._links.next.href ?? ctx.first;\n const response = await new NucleonElement.API(this).fetch(lastPageHref);\n\n if (!response.ok) throw response;\n const json = await response.json();\n\n this.__stopTrackingRumour();\n\n NucleonElement.Rumour(this.group).share({\n source: json._links.self.href,\n data: json,\n });\n\n this.__trackRumour();\n\n return json;\n },\n },\n })\n );\n\n constructor() {\n super();\n this.page = 'foxy-collection-page foxy-null';\n }\n\n /\n Custom element tag or a render function to use for displaying collection pages.\n * Generated custom elements will have the following attributes:\n \n - `group` – same as `foxy-collection-pages[group]`;\n * - `href` – collection page's `_links.self.href` value;\n * - `lang` – same as `foxy-collection-pages[lang]`;\n * - `item` – will contain `item-tag` when provided with a string value formatted as `page-tag item-tag`.\n \n Render function will receive `PageRenderer<TPage>` in the first argument.\n * Uses `foxy-collection-page` by default.\n /\n get page(): string \| PageRenderer<TPage> {\n return this.__page;\n }\n\n set page(value: string \| PageRenderer<TPage>) {\n if (typeof value === 'string') {\n const item = value.split(' ').pop();\n const itemAttribute = item ? `item=\"${item}\"` : '';\n\n this.__renderPage = new Function(\n 'ctx',\n `return ctx.html\\`\n <${value}\n disabledcontrols=\\${ctx.disabledControls.toString()}\n readonlycontrols=\\${ctx.readonlyControls.toString()}\n hiddencontrols=\\${ctx.hiddenControls.toString()}\n group=\\${ctx.group}\n href=\\${ctx.href}\n lang=\\${ctx.lang}\n ns=\"$\\{ctx.ns} $\\{customElements.get('${value}')?.defaultNS ?? ''}\"\n ${itemAttribute}\n ?disabled=\\${ctx.disabled}\n ?readonly=\\${ctx.readonly}\n ?hidden=\\${ctx.hidden}\n .templates=\\${ctx.templates}\n ...=\\${ctx.spread(ctx.props)}\n >\n </${value}>\\``\n ) as PageRenderer<TPage>;\n } else {\n this.__renderPage = value;\n }\n\n this.__page = value;\n this.requestUpdate();\n }\n\n /* URL of the first page in a collection. /\n get first(): string {\n return this.__service.state.context.first;\n }\n\n set first(data: string) {\n this.__service.send({ type: 'SET_FIRST', data });\n }\n\n /* Array of all currently loaded pages in a collection. /\n get pages(): TPage[] {\n return this.__service.state.context.pages;\n }\n\n set pages(data: TPage[]) {\n this.__service.send({ type: 'SET_PAGES', data });\n }\n\n /* Rumour group. Elements in different groups will not share updates. Empty by default. /\n get group(): string {\n return this.__group;\n }\n\n set group(value: string) {\n this.__group = value;\n this.__stopTrackingRumour?.();\n this.__trackRumour();\n }\n\n /* If false, will load pages on scroll. If true, will display a button triggering the process. /\n get manual(): boolean {\n return this.__service.state.context.manual;\n }\n\n set manual(data: boolean) {\n this.__service.send({ type: 'SET_MANUAL', data });\n }\n\n /\n Checks if this element is in the given state. Available states:\n \n - `busy` when loading a page;\n * - `fail` when page load fails;\n * - `idle` when not loading anything for one of the reasons below:\n * - `paused` if waiting for user to scroll further;\n * - `manual` when next page load will be triggered by clicking a button;\n * - `auto` when next page load will be triggered by scrolling to the observer target;\n * - `empty` if collection is empty;\n * - `end` if there are no more items in a collection.\n \n @example element.in({ idle: 'empty' })\n /\n in(stateValue: State<Context, Event>['value']): boolean {\n return this.__service.state.matches(stateValue);\n }\n\n /* @readonly /\n createRenderRoot(): CollectionPages<TPage> {\n return this;\n }\n\n /* @readonly /\n connectedCallback(): void {\n super.connectedCallback();\n this.addEventListener('fetch', this.__fetchEventHandler);\n this.__createService();\n this.__trackRumour();\n }\n\n /* @readonly /\n render(): TemplateResult {\n const items = this.pages.map(page => ({\n key: page._links.self.href,\n href: page._links.self.href,\n }));\n\n if (this.__service.state.matches('busy')) {\n items.push({ key: 'stalled', href: 'foxy://collection-pages/stall' });\n } else if (this.__service.state.matches('fail')) {\n items.push({ key: 'failed', href: 'foxy://collection-pages/fail' });\n } else if (this.__service.state.matches({ idle: 'empty' })) {\n items.push({ key: 'empty', href: '' });\n }\n\n return html`\n <!-- collection items -->\n ${repeat(\n items,\n page => page.key,\n (page, pageIndex) => {\n return this.__renderPage({\n disabledControls: this.disabledControls,\n readonlyControls: this.readonlyControls,\n hiddenControls: this.hiddenControls,\n templates: this.templates,\n disabled: this.disabled,\n readonly: this.readonly,\n hidden: this.hidden,\n spread: spread,\n props: this.props,\n group: this.group,\n data: this.pages[pageIndex] ?? null,\n href: page.href,\n lang: this.lang,\n ns: this.ns,\n html,\n });\n }\n )}\n ${this.manual\n ? this.in({ idle: 'paused' })\n ? html`\n <!-- manual trigger -->\n <vaadin-button theme=\"small contrast\" @click=${() => this.__service.send('RESUME')}>\n <foxy-i18n lang=${this.lang} key=\"load_more\" ns=${this.ns}></foxy-i18n>\n </vaadin-button>\n `\n : ''\n : html`\n <!-- intersection observer target -->\n <span></span>\n `}\n `;\n }\n\n /* @readonly /\n updated(changes: Map<keyof this, unknown>): void {\n super.updated(changes);\n this.dispatchEvent(new NucleonElement.UpdateEvent());\n }\n\n /* @readonly */\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.removeEventListener('fetch', this.__fetchEventHandler);\n this.__service.stop();\n this.__stopTrackingRumour?.();\n }\n\n private __trackRumour() {\n this.__stopTrackingRumour = NucleonElement.Rumour(this.group).track(update => {\n try {\n if (this.pages.length === 0) {\n update({ _links: { self: { href: this.first } } });\n } else {\n this.pages.map(page => update(page));\n }\n } catch (err) {\n if (err instanceof Rumour.UpdateError) {\n this.__service.send({ type: 'SET_FIRST', data: this.first });\n } else {\n throw err;\n }\n }\n });\n }\n\n private __createService() {\n this.__service\n .onTransition(({ changed }) => changed && this.requestUpdate())\n .onChange(() => this.requestUpdate())\n .start();\n }\n\n private __handleFetchEvent(event: unknown) {\n if (!(event instanceof FetchEvent) \|\| event.target === this) return;\n const { method, url } = event.request;\n\n if (method !== 'GET') return;\n if (url === 'foxy://collection-pages/stall') return this.__stallRequest(event);\n if (url === 'foxy://collection-pages/fail') return this.__failRequest(event);\n\n this.__respondIfPossible(event);\n }\n\n private __respondIfPossible(event: FetchEvent) {\n const cacheResponse = serveFromCache(event.request.url, this.pages);\n if (!cacheResponse.ok) return;\n\n event.respondWith(Promise.resolve(cacheResponse));\n console.debug(\n `%c@foxy.io/elements::${this.localName}\\n%c200%c GET ${event.request.url}`,\n 'color: gray',\n `background: gray; padding: 0 .2em; border-radius: .2em; color: white;`,\n ''\n );\n }\n\n private __stallRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(new Promise(() => void 0));\n }\n\n private __failRequest(event: FetchEvent) {\n event.stopImmediatePropagation();\n event.respondWith(Promise.resolve(this.__service.state.context.error as Response));\n }\n}\n"]}

package/dist/elements/public/CopyToClipboard/CopyToClipboard.d.ts ADDED Viewed

@@ -0,0 +1,14 @@
+import { CSSResult, LitElement, PropertyDeclarations, TemplateResult } from 'lit-element';
+declare const Base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
+export declare class CopyToClipboard extends Base {
+    static get properties(): PropertyDeclarations;
+    static get styles(): CSSResult;
+    text: string;
+    private __state;
+    render(): TemplateResult;
+}
+export {};