@foxy.io/elements 1.21.3 → 1.22.0-beta.2

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

@@ -1 +1 @@
-{"version":3,"file":"InternalDetails.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalDetails/InternalDetails.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD;;;;;GAKG;AACH,MAAM,OAAO,eAAgB,SAAQ,cAAc,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;IAAhF;;QASE,iCAAiC;QACjC,YAAO,GAAkB,IAAI,CAAC;QAE9B,4CAA4C;QAC5C,SAAI,GAAG,KAAK,CAAC;IA6Cf,CAAC;IAzDC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SACxB,CAAC;IACJ,CAAC;IAQD,MAAM;;QACJ,OAAO,IAAI,CAAA;;;gBAGC,IAAI,CAAC,IAAI;kBACP,CAAC,GAAU,EAAE,EAAE;YACvB,IAAI,CAAC,IAAI,GAAI,GAAG,CAAC,aAAoC,CAAC,IAAI,CAAC;QAC7D,CAAC;;;kBAGS,QAAQ,CAAC;YACf,wEAAwE,EAAE,IAAI;YAC9E,sDAAsD,EAAE,IAAI;YAC5D,WAAW,EAAE,IAAI;YACjB,WAAW,EAAE,CAAC,IAAI,CAAC,IAAI;SACxB,CAAC;;;;;;;sBAOU,MAAA,IAAI,CAAC,OAAO,mCAAI,EAAE;;;;;;;;;mCASL,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;;;;;;;;;;KAUzD,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\n\nimport { html, LitElement } from 'lit-element';\nimport { InferrableMixin } from '../../../mixins/inferrable';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { classMap } from '../../../utils/class-map';\n\n/**\n * Internal details/summary control.\n *\n * @since 1.17.0\n * @element foxy-internal-details\n */\nexport class InternalDetails extends ThemeableMixin(InferrableMixin(LitElement)) {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      summary: { type: String },\n      open: { type: Boolean },\n    };\n  }\n\n  /** i18n key for summary text. */\n  summary: string | null = null;\n\n  /** Same as `HTMLDetailsElement['open']`. */\n  open = false;\n\n  render(): TemplateResult {\n    return html`\n      <details\n        class=\"w-full border border-contrast-10 rounded\"\n        ?open=${this.open}\n        @toggle=${(evt: Event) => {\n          this.open = (evt.currentTarget as HTMLDetailsElement).open;\n        }}\n      >\n        <summary\n          class=${classMap({\n            'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n            'transition-colors cursor-pointer hover-bg-contrast-5': true,\n            'rounded-t': true,\n            'rounded-b': !this.open,\n          })}\n        >\n          <div class=\"flex items-center h-m pl-m pr-s\">\n            <div class=\"flex items-center flex-1\">\n              <foxy-i18n\n                class=\"flex items-center text-xs tracking-wide uppercase font-bold text-body\"\n                infer=\"\"\n                key=${this.summary ?? ''}\n              >\n              </foxy-i18n>\n\n              <slot name=\"actions\"></slot>\n            </div>\n\n            <iron-icon\n              class=\"icon-inline text-xl text-body\"\n              icon=\"icons:expand-${this.open ? 'less' : 'more'}\"\n            >\n            </iron-icon>\n          </div>\n        </summary>\n\n        <div class=\"border-t border-contrast-10\">\n          <slot></slot>\n        </div>\n      </details>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"InternalDetails.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalDetails/InternalDetails.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAC3D,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD;;;;;GAKG;AACH,MAAM,OAAO,eAAgB,SAAQ,cAAc,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;IAAhF;;QASE,iCAAiC;QACjC,YAAO,GAAkB,IAAI,CAAC;QAE9B,4CAA4C;QAC5C,SAAI,GAAG,KAAK,CAAC;IA6Cf,CAAC;IAzDC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACzB,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SACxB,CAAC;IACJ,CAAC;IAQD,MAAM;;QACJ,OAAO,IAAI,CAAA;;;gBAGC,IAAI,CAAC,IAAI;kBACP,CAAC,GAAU,EAAE,EAAE;YACvB,IAAI,CAAC,IAAI,GAAI,GAAG,CAAC,aAAoC,CAAC,IAAI,CAAC;QAC7D,CAAC;;;kBAGS,QAAQ,CAAC;YACf,wEAAwE,EAAE,IAAI;YAC9E,sDAAsD,EAAE,IAAI;YAC5D,WAAW,EAAE,IAAI;YACjB,WAAW,EAAE,CAAC,IAAI,CAAC,IAAI;SACxB,CAAC;;;;;;;sBAOU,MAAA,IAAI,CAAC,OAAO,mCAAI,EAAE;;;;;;;;;mCASL,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;;;;;;;;;;KAUzD,CAAC;IACJ,CAAC;CACF","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\n\nimport { html, LitElement } from 'lit-element';\nimport { InferrableMixin } from '../../../mixins/inferrable';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { classMap } from '../../../utils/class-map';\n\n/**\n * Internal details/summary control.\n *\n * @since 1.17.0\n * @element foxy-internal-details\n */\nexport class InternalDetails extends ThemeableMixin(InferrableMixin(LitElement)) {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      summary: { type: String },\n      open: { type: Boolean },\n    };\n  }\n\n  /** i18n key for summary text. */\n  summary: string | null = null;\n\n  /** Same as `HTMLDetailsElement['open']`. */\n  open = false;\n\n  render(): TemplateResult {\n    return html`\n      <details\n        class=\"w-full border border-contrast-10 rounded\"\n        ?open=${this.open}\n        @toggle=${(evt: Event) => {\n          this.open = (evt.currentTarget as HTMLDetailsElement).open;\n        }}\n      >\n        <summary\n          class=${classMap({\n            'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n            'transition-colors cursor-pointer hover-bg-contrast-5': true,\n            'rounded-t': true,\n            'rounded-b': !this.open,\n          })}\n        >\n          <div class=\"flex items-center h-m pl-m pr-s\">\n            <div class=\"flex items-center flex-1\">\n              <foxy-i18n\n                class=\"flex items-center text-xs tracking-wide uppercase font-medium text-body\"\n                infer=\"\"\n                key=${this.summary ?? ''}\n              >\n              </foxy-i18n>\n\n              <slot name=\"actions\"></slot>\n            </div>\n\n            <iron-icon\n              class=\"icon-inline text-xl text-body\"\n              icon=\"icons:expand-${this.open ? 'less' : 'more'}\"\n            >\n            </iron-icon>\n          </div>\n        </summary>\n\n        <div class=\"border-t border-contrast-10\">\n          <slot></slot>\n        </div>\n      </details>\n    `;\n  }\n}\n"]}

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

@@ -1,3 +1,5 @@
+import '@vaadin/vaadin-icons';
+import '@polymer/iron-icon';
 import '../InternalEditableControl/index';
 import { InternalEditableListControl } from './InternalEditableListControl';
 export { InternalEditableListControl };

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

@@ -1,3 +1,5 @@
+import '@vaadin/vaadin-icons';
+import '@polymer/iron-icon';
 import "../InternalEditableControl/index.js";
 import { InternalEditableListControl } from "./InternalEditableListControl.js";
 customElements.define('foxy-internal-editable-list-control', InternalEditableListControl);

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalEditableListControl/index.ts"],"names":[],"mappings":"AAAA,6CAA0C;AAE1C,OAAO,EAAE,2BAA2B,EAAE,yCAAsC;AAE5E,cAAc,CAAC,MAAM,CAAC,qCAAqC,EAAE,2BAA2B,CAAC,CAAC;AAE1F,OAAO,EAAE,2BAA2B,EAAE,CAAC","sourcesContent":["import '../InternalEditableControl/index';\n\nimport { InternalEditableListControl } from './InternalEditableListControl';\n\ncustomElements.define('foxy-internal-editable-list-control', InternalEditableListControl);\n\nexport { InternalEditableListControl };\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalEditableListControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,sBAAsB,CAAC;AAC9B,OAAO,oBAAoB,CAAC;AAE5B,6CAA0C;AAE1C,OAAO,EAAE,2BAA2B,EAAE,yCAAsC;AAE5E,cAAc,CAAC,MAAM,CAAC,qCAAqC,EAAE,2BAA2B,CAAC,CAAC;AAE1F,OAAO,EAAE,2BAA2B,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-icons';\nimport '@polymer/iron-icon';\n\nimport '../InternalEditableControl/index';\n\nimport { InternalEditableListControl } from './InternalEditableListControl';\n\ncustomElements.define('foxy-internal-editable-list-control', InternalEditableListControl);\n\nexport { InternalEditableListControl };\n"]}

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

@@ -41,6 +41,8 @@ export declare abstract class Dialog extends Base {
     editable: boolean;
     /** Header text or a i18next key for it. */
     header: string;
+    /** NucleonElement's Rumour sync group. */
+    group: string;
     /** When true, centers a dialog on the screen and does not animate the stack under. */
     alert: boolean;
     /** When true, dialog window will a larger maximum width. */
@@ -60,6 +62,7 @@ export declare abstract class Dialog extends Base {
     createRenderRoot(): Element | ShadowRoot;
     /** @readonly */
     render(content?: () => TemplateResult): TemplateResult;
+    updated(changes: Map<keyof this, unknown>): void;
     /**
      * Hides the dialog. Returns a promise that resolves when the dialog
      * finishes leaving the screen.

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

@@ -20,6 +20,8 @@ export class Dialog extends Base {
         this.editable = false;
         /** Header text or a i18next key for it. */
         this.header = '';
+        /** NucleonElement's Rumour sync group. */
+        this.group = '';
         /** When true, centers a dialog on the screen and does not animate the stack under. */
         this.alert = false;
         /** When true, dialog window will a larger maximum width. */
@@ -41,6 +43,7 @@ export class Dialog extends Base {
             closable: { type: Boolean },
             editable: { type: Boolean },
             header: { type: String },
+            group: {},
             alert: { type: Boolean },
             wide: { type: Boolean },
             open: { type: Boolean, noAccessor: true },
@@ -121,10 +124,13 @@ export class Dialog extends Base {
         ></div>
 
         <div
+          tabindex="0"
           role="dialog"
           aria-labelledby="dialog-title"
           class=${classMap({
-            'transform origin-bottom ease-in-out transition duration-500 relative h-full ml-auto sm-origin-center': true,
+            'transform ease-in-out transition duration-500 relative h-full ml-auto': true,
+            'origin-bottom sm-origin-center': true,
+            'focus-outline-none': true,
             'sm-max-w-modal': !this.wide,
             'sm-max-w-modal-wide': this.wide,
             'flex justify-center items-end sm-items-center mr-auto': this.alert,
@@ -194,6 +200,21 @@ export class Dialog extends Base {
       </div>
     `;
     }
+    updated(changes) {
+        super.updated(changes);
+        const dialogWindow = Dialog.dialogWindows.get(this);
+        if (dialogWindow) {
+            dialogWindow.disabledControls = this.disabledControls;
+            dialogWindow.disabled = this.disabled;
+            dialogWindow.readonlyControls = this.readonlyControls;
+            dialogWindow.readonly = this.readonly;
+            dialogWindow.hiddenControls = this.hiddenControls;
+            dialogWindow.hidden = this.hidden;
+            dialogWindow.group = this.group;
+            dialogWindow.lang = this.lang;
+            dialogWindow.ns = this.ns;
+        }
+    }
     /**
      * Hides the dialog. Returns a promise that resolves when the dialog
      * finishes leaving the screen.
@@ -214,11 +235,11 @@ export class Dialog extends Base {
      * @param returnFocusTo If provided, the dialog will call `.focus()` on that element once it's closed.
      */
     async show(returnFocusTo) {
+        var _a;
         this.__returnFocusTo = returnFocusTo;
         await this.__setConnected(true);
         await this.__setOpenDialogs([this, ...Dialog.openDialogs]);
-        const closeButton = this.renderRoot.querySelector('#close-button');
-        closeButton === null || closeButton === void 0 ? void 0 : closeButton.focus();
+        (_a = this.renderRoot.querySelector('[role="dialog"]')) === null || _a === void 0 ? void 0 : _a.focus();
         this.dispatchEvent(new Dialog.ShowEvent());
     }
     /** Alias for `dialog.hide(false)`. */

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';\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      wide: { 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  /** When true, dialog window will a larger maximum width. */\n  wide = 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':\n              true,\n            'sm-max-w-modal': !this.wide,\n            'sm-max-w-modal-wide': this.wide,\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              'flex-1': this.alert,\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      group: {},\n      alert: { type: Boolean },\n      wide: { 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  /** NucleonElement's Rumour sync group. */\n  group = '';\n\n  /** When true, centers a dialog on the screen and does not animate the stack under. */\n  alert = false;\n\n  /** When true, dialog window will a larger maximum width. */\n  wide = 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          tabindex=\"0\"\n          role=\"dialog\"\n          aria-labelledby=\"dialog-title\"\n          class=${classMap({\n            'transform ease-in-out transition duration-500 relative h-full ml-auto': true,\n            'origin-bottom sm-origin-center': true,\n            'focus-outline-none': true,\n            'sm-max-w-modal': !this.wide,\n            'sm-max-w-modal-wide': this.wide,\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              'flex-1': this.alert,\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  updated(changes: Map<keyof this, unknown>): void {\n    super.updated(changes);\n\n    const dialogWindow = Dialog.dialogWindows.get(this);\n\n    if (dialogWindow) {\n      dialogWindow.disabledControls = this.disabledControls;\n      dialogWindow.disabled = this.disabled;\n\n      dialogWindow.readonlyControls = this.readonlyControls;\n      dialogWindow.readonly = this.readonly;\n\n      dialogWindow.hiddenControls = this.hiddenControls;\n      dialogWindow.hidden = this.hidden;\n\n      dialogWindow.group = this.group;\n      dialogWindow.lang = this.lang;\n      dialogWindow.ns = this.ns;\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    this.renderRoot.querySelector<HTMLDivElement>('[role=\"dialog\"]')?.focus();\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/Dialog/DialogWindow.d.ts

@@ -1,8 +1,16 @@
-import { CSSResultArray, LitElement } from 'lit-element';
-declare const DialogWindow_base: typeof LitElement & {
+import type { CSSResultArray, PropertyDeclarations } from 'lit-element';
+import { LitElement } from 'lit-element';
+declare const DialogWindow_base: typeof LitElement & import("lit-element").Constructor<import("../../../mixins/inferrable").InferrableMixinHost> & {
+    inferredProperties: string[];
+} & import("lit-element").Constructor<import("../../../mixins/translatable").TranslatableMixinHost> & {
+    defaultNS: string;
+} & {
     styles: CSSResultArray;
-};
+} & import("lit-element").Constructor<import("../../../mixins/configurable").ConfigurableMixinHost>;
 export declare class DialogWindow extends DialogWindow_base {
+    static get properties(): PropertyDeclarations;
     static get styles(): CSSResultArray;
+    /** NucleonElement's Rumour sync group. */
+    group: string;
 }
 export {};

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

@@ -1,7 +1,21 @@
+import { TranslatableMixin } from "../../../mixins/translatable.js";
+import { ConfigurableMixin } from "../../../mixins/configurable.js";
 import { LitElement, css } from 'lit-element';
+import { InferrableMixin } from "../../../mixins/inferrable.js";
 import { ResponsiveMixin } from "../../../mixins/responsive.js";
 import { ThemeableMixin } from "../../../mixins/themeable.js";
-export class DialogWindow extends ThemeableMixin(ResponsiveMixin(LitElement)) {
+export class DialogWindow extends ConfigurableMixin(ThemeableMixin(ResponsiveMixin(TranslatableMixin(InferrableMixin(LitElement))))) {
+    constructor() {
+        super(...arguments);
+        /** NucleonElement's Rumour sync group. */
+        this.group = '';
+    }
+    static get properties() {
+        return {
+            ...super.properties,
+            group: {},
+        };
+    }
     static get styles() {
         return [
             super.styles,

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

@@ -1 +1 @@
-{"version":3,"file":"DialogWindow.js","sourceRoot":"","sources":["../../../../src/elements/private/Dialog/DialogWindow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,UAAU,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAE9D,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAE3D,MAAM,OAAO,YAAa,SAAQ,cAAc,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;IAC3E,MAAM,KAAK,MAAM;QACf,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;;OAKF;SACF,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { CSSResultArray, LitElement, css } from 'lit-element';\n\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { ThemeableMixin } from '../../../mixins/themeable';\n\nexport class DialogWindow extends ThemeableMixin(ResponsiveMixin(LitElement)) {\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        :host {\n          position: relative;\n          z-index: 200;\n        }\n      `,\n    ];\n  }\n}\n"]}
+{"version":3,"file":"DialogWindow.js","sourceRoot":"","sources":["../../../../src/elements/private/Dialog/DialogWindow.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,iBAAiB,EAAE,wCAAqC;AACjE,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,eAAe,EAAE,sCAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,qCAAkC;AAE3D,MAAM,OAAO,YAAa,SAAQ,iBAAiB,CACjD,cAAc,CAAC,eAAe,CAAC,iBAAiB,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAChF;IAFD;;QAsBE,0CAA0C;QAC1C,UAAK,GAAG,EAAE,CAAC;IACb,CAAC;IArBC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,KAAK,EAAE,EAAE;SACV,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;;OAKF;SACF,CAAC;IACJ,CAAC;CAIF","sourcesContent":["import type { CSSResultArray, PropertyDeclarations } from 'lit-element';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { LitElement, css } from 'lit-element';\nimport { InferrableMixin } from '../../../mixins/inferrable';\nimport { ResponsiveMixin } from '../../../mixins/responsive';\nimport { ThemeableMixin } from '../../../mixins/themeable';\n\nexport class DialogWindow extends ConfigurableMixin(\n  ThemeableMixin(ResponsiveMixin(TranslatableMixin(InferrableMixin(LitElement))))\n) {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      group: {},\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        :host {\n          position: relative;\n          z-index: 200;\n        }\n      `,\n    ];\n  }\n\n  /** NucleonElement's Rumour sync group. */\n  group = '';\n}\n"]}

package/dist/elements/private/Page/Page.js

@@ -15,7 +15,7 @@ export class Page extends LitElement {
         return html `
       <article class="relative antialiased font-lumo">
         <header class="space-y-xs leading-s">
-          <h1 class="font-bold text-header text-xl border-b border-contrast-10 pb-s mb-s">
+          <h1 class="font-medium text-header text-xl border-b border-contrast-10 pb-s mb-s">
             <slot name="title"></slot>
           </h1>
           <p class="text-l text-secondary">

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

@@ -1 +1 @@
-{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../../src/elements/private/Page/Page.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAC;AAEpC,OAAO,EAAkB,UAAU,EAAkB,GAAG,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEpF,OAAO,EAAE,SAAS,EAAE,qCAAkC;AAEtD,MAAM,OAAO,IAAK,SAAQ,UAAU;IAC3B,MAAM,KAAK,MAAM;QACtB,OAAO;YACL,SAAS,CAAC,MAAM;YAChB,GAAG;;;OAIF;SACF,CAAC;IACJ,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;;;;;KAaV,CAAC;IACJ,CAAC;CACF","sourcesContent":["import '@vaadin/vaadin-lumo-styles';\n\nimport { CSSResultArray, LitElement, TemplateResult, css, html } from 'lit-element';\n\nimport { Themeable } from '../../../mixins/themeable';\n\nexport class Page extends LitElement {\n  public static get styles(): CSSResultArray {\n    return [\n      Themeable.styles,\n      css`\n        ::slotted(:not([slot])) {\n          margin-top: var(--lumo-space-xl);\n        }\n      `,\n    ];\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <article class=\"relative antialiased font-lumo\">\n        <header class=\"space-y-xs leading-s\">\n          <h1 class=\"font-bold text-header text-xl border-b border-contrast-10 pb-s mb-s\">\n            <slot name=\"title\"></slot>\n          </h1>\n          <p class=\"text-l text-secondary\">\n            <slot name=\"subtitle\"></slot>\n          </p>\n        </header>\n\n        <slot></slot>\n      </article>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../../src/elements/private/Page/Page.ts"],"names":[],"mappings":"AAAA,OAAO,4BAA4B,CAAC;AAEpC,OAAO,EAAkB,UAAU,EAAkB,GAAG,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEpF,OAAO,EAAE,SAAS,EAAE,qCAAkC;AAEtD,MAAM,OAAO,IAAK,SAAQ,UAAU;IAC3B,MAAM,KAAK,MAAM;QACtB,OAAO;YACL,SAAS,CAAC,MAAM;YAChB,GAAG;;;OAIF;SACF,CAAC;IACJ,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;;;;;KAaV,CAAC;IACJ,CAAC;CACF","sourcesContent":["import '@vaadin/vaadin-lumo-styles';\n\nimport { CSSResultArray, LitElement, TemplateResult, css, html } from 'lit-element';\n\nimport { Themeable } from '../../../mixins/themeable';\n\nexport class Page extends LitElement {\n  public static get styles(): CSSResultArray {\n    return [\n      Themeable.styles,\n      css`\n        ::slotted(:not([slot])) {\n          margin-top: var(--lumo-space-xl);\n        }\n      `,\n    ];\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <article class=\"relative antialiased font-lumo\">\n        <header class=\"space-y-xs leading-s\">\n          <h1 class=\"font-medium text-header text-xl border-b border-contrast-10 pb-s mb-s\">\n            <slot name=\"title\"></slot>\n          </h1>\n          <p class=\"text-l text-secondary\">\n            <slot name=\"subtitle\"></slot>\n          </p>\n        </header>\n\n        <slot></slot>\n      </article>\n    `;\n  }\n}\n"]}

package/dist/elements/private/Section/Section.js

@@ -14,7 +14,7 @@ export class Section extends Page {
         return html `
       <section class="leading-s antialiased font-lumo">
         <header>
-          <h2 class="text-header font-semibold text-l">
+          <h2 class="text-header font-medium text-l">
             <slot name="title"></slot>
           </h2>
           <p class="text-secondary text-m">

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

@@ -1 +1 @@
-{"version":3,"file":"Section.js","sourceRoot":"","sources":["../../../../src/elements/private/Section/Section.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAkC,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,IAAI,EAAE,wBAAqB;AAEpC,MAAM,OAAO,OAAQ,SAAQ,IAAI;IACxB,MAAM,KAAK,MAAM;QACtB,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;OAIF;SACF,CAAC;IACJ,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;;;;;KAaV,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { html, css, CSSResultArray, TemplateResult } from 'lit-element';\nimport { Page } from '../Page/Page';\n\nexport class Section extends Page {\n  public static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        ::slotted(:not([slot])) {\n          margin-top: var(--lumo-space-m);\n        }\n      `,\n    ];\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <section class=\"leading-s antialiased font-lumo\">\n        <header>\n          <h2 class=\"text-header font-semibold text-l\">\n            <slot name=\"title\"></slot>\n          </h2>\n          <p class=\"text-secondary text-m\">\n            <slot name=\"subtitle\"></slot>\n          </p>\n        </header>\n\n        <slot></slot>\n      </section>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Section.js","sourceRoot":"","sources":["../../../../src/elements/private/Section/Section.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAkC,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,IAAI,EAAE,wBAAqB;AAEpC,MAAM,OAAO,OAAQ,SAAQ,IAAI;IACxB,MAAM,KAAK,MAAM;QACtB,OAAO;YACL,KAAK,CAAC,MAAM;YACZ,GAAG;;;OAIF;SACF,CAAC;IACJ,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;;;;;;;;;;KAaV,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { html, css, CSSResultArray, TemplateResult } from 'lit-element';\nimport { Page } from '../Page/Page';\n\nexport class Section extends Page {\n  public static get styles(): CSSResultArray {\n    return [\n      super.styles,\n      css`\n        ::slotted(:not([slot])) {\n          margin-top: var(--lumo-space-m);\n        }\n      `,\n    ];\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <section class=\"leading-s antialiased font-lumo\">\n        <header>\n          <h2 class=\"text-header font-medium text-l\">\n            <slot name=\"title\"></slot>\n          </h2>\n          <p class=\"text-secondary text-m\">\n            <slot name=\"subtitle\"></slot>\n          </p>\n        </header>\n\n        <slot></slot>\n      </section>\n    `;\n  }\n}\n"]}

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

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

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

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

package/dist/elements/private/Tabs/Tabs.js

@@ -26,7 +26,7 @@ export class Tabs extends LitElement {
           id="tab-${index}"
           role="tab"
           class=${classMap({
-                'text-l font-semibold px-s rounded focus-outline-none focus-shadow-outline': true,
+                'text-l font-medium px-s rounded focus-outline-none focus-shadow-outline': true,
                 'text-tertiary hover-text-body focus-text-body': this.value !== index,
             })}
           aria-controls="panel-${index}"

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../src/elements/private/Tabs/Tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,UAAU,EAAwB,MAAM,aAAa,CAAC;AAC1F,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,qCAAkC;AACtD,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD,MAAM,OAAO,IAAK,SAAQ,UAAU;IAApC;;QAYE,UAAK,GAAG,CAAC,CAAC;QAEV,SAAI,GAAG,CAAC,CAAC;IA4DX,CAAC;IAzEC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACvB,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACvB,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,SAAS,CAAC,MAAM,CAAC;IAC1B,CAAC;IAMD,MAAM;QACJ,MAAM,IAAI,GAAqB,EAAE,CAAC;QAClC,MAAM,MAAM,GAAqB,EAAE,CAAC;QAEpC,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE;YAC9C,IAAI,CAAC,IAAI,CAAC,IAAI,CAAA;;oBAEA,KAAK;;kBAEP,QAAQ,CAAC;gBACf,2EAA2E,EAAE,IAAI;gBACjF,+CAA+C,EAAE,IAAI,CAAC,KAAK,KAAK,KAAK;aACtE,CAAC;iCACqB,KAAK;0BACZ,IAAI,CAAC,KAAK,KAAK,KAAK;mBAC3B,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;qBACxB,IAAI,CAAC,eAAe;;4BAEb,KAAK;;OAE1B,CAAC,CAAC;YAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAA;;sBAEA,KAAK;;wBAEH,KAAK;kBACX,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;wBACpC,IAAI,CAAC,KAAK,KAAK,KAAK;iCACX,KAAK;;;OAG/B,CAAC,CAAC;SACJ;QAED,OAAO,IAAI,CAAA;6EAC8D,IAAI;QACzE,MAAM;KACT,CAAC;IACJ,CAAC;IAEO,eAAe,CAAC,GAAkB;QACxC,IAAI,GAAG,CAAC,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE;YAC/B,GAAG,CAAC,cAAc,EAAE,CAAC;YAErB,MAAM,MAAM,GAAG,GAAG,CAAC,MAA2B,CAAC;YAC/C,IAAI,IAAI,GAA6B,IAAI,CAAC;YAE1C,IAAI,GAAG,CAAC,GAAG,KAAK,YAAY,IAAI,GAAG,CAAC,GAAG,KAAK,WAAW,EAAE;gBACvD,IAAI,GAAG,MAAM,CAAC,kBAA8C,CAAC;aAC9D;iBAAM,IAAI,GAAG,CAAC,GAAG,KAAK,WAAW,IAAI,GAAG,CAAC,GAAG,KAAK,SAAS,EAAE;gBAC3D,IAAI,GAAG,MAAM,CAAC,sBAAkD,CAAC;aAClE;YAED,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,GAAG;YACd,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,GAAG;SACf;IACH,CAAC;CACF","sourcesContent":["import { CSSResult, CSSResultArray, LitElement, PropertyDeclarations } from 'lit-element';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { Themeable } from '../../../mixins/themeable';\nimport { classMap } from '../../../utils/class-map';\n\nexport class Tabs extends LitElement {\n  static get properties(): PropertyDeclarations {\n    return {\n      value: { type: Number },\n      size: { type: Number },\n    };\n  }\n\n  static get styles(): CSSResult | CSSResultArray {\n    return Themeable.styles;\n  }\n\n  value = 0;\n\n  size = 0;\n\n  render(): TemplateResult {\n    const tabs: TemplateResult[] = [];\n    const panels: TemplateResult[] = [];\n\n    for (let index = 0; index < this.size; ++index) {\n      tabs.push(html`\n        <button\n          id=\"tab-${index}\"\n          role=\"tab\"\n          class=${classMap({\n            'text-l font-semibold px-s rounded focus-outline-none focus-shadow-outline': true,\n            'text-tertiary hover-text-body focus-text-body': this.value !== index,\n          })}\n          aria-controls=\"panel-${index}\"\n          aria-selected=${this.value === index}\n          @click=${() => (this.value = index)}\n          @keydown=${this.__handleKeyDown}\n        >\n          <slot name=\"tab-${index}\"></slot>\n        </button>\n      `);\n\n      panels.push(html`\n        <slot\n          id=\"panel-${index}\"\n          role=\"tabpanel\"\n          name=\"panel-${index}\"\n          class=${classMap({ hidden: this.value !== index })}\n          aria-hidden=${this.value !== index}\n          aria-labelledby=\"tab-${index}\"\n        >\n        </slot>\n      `);\n    }\n\n    return html`\n      <div role=\"tablist\" aria-orientation=\"horizontal\" class=\"-mx-s mb-s\">${tabs}</div>\n      ${panels}\n    `;\n  }\n\n  private __handleKeyDown(evt: KeyboardEvent) {\n    if (evt.key.startsWith('Arrow')) {\n      evt.preventDefault();\n\n      const target = evt.target as HTMLButtonElement;\n      let next: HTMLButtonElement | null = null;\n\n      if (evt.key === 'ArrowRight' || evt.key === 'ArrowDown') {\n        next = target.nextElementSibling as HTMLButtonElement | null;\n      } else if (evt.key === 'ArrowLeft' || evt.key === 'ArrowUp') {\n        next = target.previousElementSibling as HTMLButtonElement | null;\n      }\n\n      next?.click();\n      next?.focus();\n    }\n  }\n}\n"]}
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../src/elements/private/Tabs/Tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,UAAU,EAAwB,MAAM,aAAa,CAAC;AAC1F,OAAO,EAAkB,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,qCAAkC;AACtD,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AAEpD,MAAM,OAAO,IAAK,SAAQ,UAAU;IAApC;;QAYE,UAAK,GAAG,CAAC,CAAC;QAEV,SAAI,GAAG,CAAC,CAAC;IA4DX,CAAC;IAzEC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;YACvB,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;SACvB,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,SAAS,CAAC,MAAM,CAAC;IAC1B,CAAC;IAMD,MAAM;QACJ,MAAM,IAAI,GAAqB,EAAE,CAAC;QAClC,MAAM,MAAM,GAAqB,EAAE,CAAC;QAEpC,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE;YAC9C,IAAI,CAAC,IAAI,CAAC,IAAI,CAAA;;oBAEA,KAAK;;kBAEP,QAAQ,CAAC;gBACf,yEAAyE,EAAE,IAAI;gBAC/E,+CAA+C,EAAE,IAAI,CAAC,KAAK,KAAK,KAAK;aACtE,CAAC;iCACqB,KAAK;0BACZ,IAAI,CAAC,KAAK,KAAK,KAAK;mBAC3B,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;qBACxB,IAAI,CAAC,eAAe;;4BAEb,KAAK;;OAE1B,CAAC,CAAC;YAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAA;;sBAEA,KAAK;;wBAEH,KAAK;kBACX,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;wBACpC,IAAI,CAAC,KAAK,KAAK,KAAK;iCACX,KAAK;;;OAG/B,CAAC,CAAC;SACJ;QAED,OAAO,IAAI,CAAA;6EAC8D,IAAI;QACzE,MAAM;KACT,CAAC;IACJ,CAAC;IAEO,eAAe,CAAC,GAAkB;QACxC,IAAI,GAAG,CAAC,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE;YAC/B,GAAG,CAAC,cAAc,EAAE,CAAC;YAErB,MAAM,MAAM,GAAG,GAAG,CAAC,MAA2B,CAAC;YAC/C,IAAI,IAAI,GAA6B,IAAI,CAAC;YAE1C,IAAI,GAAG,CAAC,GAAG,KAAK,YAAY,IAAI,GAAG,CAAC,GAAG,KAAK,WAAW,EAAE;gBACvD,IAAI,GAAG,MAAM,CAAC,kBAA8C,CAAC;aAC9D;iBAAM,IAAI,GAAG,CAAC,GAAG,KAAK,WAAW,IAAI,GAAG,CAAC,GAAG,KAAK,SAAS,EAAE;gBAC3D,IAAI,GAAG,MAAM,CAAC,sBAAkD,CAAC;aAClE;YAED,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,GAAG;YACd,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,GAAG;SACf;IACH,CAAC;CACF","sourcesContent":["import { CSSResult, CSSResultArray, LitElement, PropertyDeclarations } from 'lit-element';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { Themeable } from '../../../mixins/themeable';\nimport { classMap } from '../../../utils/class-map';\n\nexport class Tabs extends LitElement {\n  static get properties(): PropertyDeclarations {\n    return {\n      value: { type: Number },\n      size: { type: Number },\n    };\n  }\n\n  static get styles(): CSSResult | CSSResultArray {\n    return Themeable.styles;\n  }\n\n  value = 0;\n\n  size = 0;\n\n  render(): TemplateResult {\n    const tabs: TemplateResult[] = [];\n    const panels: TemplateResult[] = [];\n\n    for (let index = 0; index < this.size; ++index) {\n      tabs.push(html`\n        <button\n          id=\"tab-${index}\"\n          role=\"tab\"\n          class=${classMap({\n            'text-l font-medium px-s rounded focus-outline-none focus-shadow-outline': true,\n            'text-tertiary hover-text-body focus-text-body': this.value !== index,\n          })}\n          aria-controls=\"panel-${index}\"\n          aria-selected=${this.value === index}\n          @click=${() => (this.value = index)}\n          @keydown=${this.__handleKeyDown}\n        >\n          <slot name=\"tab-${index}\"></slot>\n        </button>\n      `);\n\n      panels.push(html`\n        <slot\n          id=\"panel-${index}\"\n          role=\"tabpanel\"\n          name=\"panel-${index}\"\n          class=${classMap({ hidden: this.value !== index })}\n          aria-hidden=${this.value !== index}\n          aria-labelledby=\"tab-${index}\"\n        >\n        </slot>\n      `);\n    }\n\n    return html`\n      <div role=\"tablist\" aria-orientation=\"horizontal\" class=\"-mx-s mb-s\">${tabs}</div>\n      ${panels}\n    `;\n  }\n\n  private __handleKeyDown(evt: KeyboardEvent) {\n    if (evt.key.startsWith('Arrow')) {\n      evt.preventDefault();\n\n      const target = evt.target as HTMLButtonElement;\n      let next: HTMLButtonElement | null = null;\n\n      if (evt.key === 'ArrowRight' || evt.key === 'ArrowDown') {\n        next = target.nextElementSibling as HTMLButtonElement | null;\n      } else if (evt.key === 'ArrowLeft' || evt.key === 'ArrowUp') {\n        next = target.previousElementSibling as HTMLButtonElement | null;\n      }\n\n      next?.click();\n      next?.focus();\n    }\n  }\n}\n"]}

package/dist/elements/public/AddressCard/AddressCard.js

@@ -39,7 +39,7 @@ export class AddressCard extends Base {
       <div class="mb-s leading-none">
         ${this.renderTemplateOrSlot('address-name:before')}
 
-        <span class="font-semibold">
+        <span class="font-medium">
           ${isDefaultBilling || isDefaultShipping
                 ? html `
                 <foxy-i18n

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

@@ -1 +1 @@
-{"version":3,"file":"AddressCard.js","sourceRoot":"","sources":["../../../../src/elements/public/AddressCard/AddressCard.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'address-card';\nconst Base = ConfigurableMixin(ThemeableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/**\n * Card element displaying a customer address.\n *\n * @slot address-name:before - **new in v1.4.0**\n * @slot address-name:after - **new in v1.4.0**\n *\n * @slot full-name:before - **new in v1.4.0**\n * @slot full-name:after - **new in v1.4.0**\n *\n * @slot full-address:before - **new in v1.4.0**\n * @slot full-address:after - **new in v1.4.0**\n *\n * @slot company:before - **new in v1.4.0**\n * @slot company:after - **new in v1.4.0**\n *\n * @slot phone:before - **new in v1.4.0**\n * @slot phone:after - **new in v1.4.0**\n *\n * @element foxy-address-card\n * @since 1.2.0\n */\nexport class AddressCard extends Base<Data> {\n  templates: Templates = {};\n\n  private readonly __renderAddressName = () => {\n    const isDefaultBilling = !!this.data?.is_default_billing;\n    const isDefaultShipping = !!this.data?.is_default_shipping;\n\n    return html`\n      <div class=\"mb-s leading-none\">\n        ${this.renderTemplateOrSlot('address-name:before')}\n\n        <span class=\"font-semibold\">\n          ${isDefaultBilling || isDefaultShipping\n            ? html`\n                <foxy-i18n\n                  data-testid=\"address-name\"\n                  lang=${this.lang}\n                  key=\"default_${isDefaultBilling ? 'billing' : 'shipping'}_address\"\n                  ns=${this.ns}\n                >\n                </foxy-i18n>\n              `\n            : html`<span data-testid=\"address-name\">${this.data?.address_name}</span>`}\n          &ZeroWidthSpace;\n        </span>\n\n        ${this.renderTemplateOrSlot('address-name:after')}\n      </div>\n    `;\n  };\n\n  private readonly __renderLine = (id: string, icon: string, text: TemplateResult) => {\n    return html`\n      <p>\n        ${this.renderTemplateOrSlot(`${id}:before`)}\n\n        <span class=\"flex items-center text-m space-x-s text-secondary\">\n          <iron-icon icon=${icon} class=\"icon-inline flex-shrink-0\"></iron-icon>\n          <span class=\"truncate\" data-testid=${id}>${text}</span>\n          &ZeroWidthSpace;\n        </span>\n\n        ${this.renderTemplateOrSlot(`${id}:after`)}\n      </p>\n    `;\n  };\n\n  private readonly __renderFullName = () => {\n    const text = this.data\n      ? html`\n          <foxy-i18n\n            options=${JSON.stringify(this.data)}\n            lang=${this.lang}\n            key=\"full_name\"\n            ns=${this.ns}\n          >\n          </foxy-i18n>\n        `\n      : html`–`;\n\n    return this.__renderLine('full-name', 'social:person', text);\n  };\n\n  private readonly __renderFullAddress = () => {\n    const text = this.data\n      ? html`\n          <foxy-i18n\n            data-testid=\"full-address\"\n            options=${JSON.stringify(this.data)}\n            lang=${this.lang}\n            key=\"full_address\"\n            ns=${this.ns}\n          >\n          </foxy-i18n>\n        `\n      : html`–`;\n\n    return this.__renderLine('full-address', 'maps:place', text);\n  };\n\n  private readonly __renderCompany = () => {\n    const text = html`${this.data?.company || '–'}`;\n    return this.__renderLine('company', 'icons:work', text);\n  };\n\n  private readonly __renderPhone = () => {\n    const text = html`${this.data?.phone || '–'}`;\n    return this.__renderLine('phone', 'maps:local-phone', text);\n  };\n\n  render(): TemplateResult {\n    const hiddenSelector = this.hiddenSelector;\n    const isLoaded = this.in({ idle: 'snapshot' });\n    const isEmpty = this.in({ idle: 'template' });\n    const isBusy = this.in('busy');\n\n    return html`\n      <div\n        class=\"relative h-full text-left text-m leading-m font-lumo text-body\"\n        aria-live=\"polite\"\n        aria-busy=${isBusy}\n        data-testid=\"wrapper\"\n      >\n        <div\n          class=${classMap({\n            'transition duration-250 ease-in-out': true,\n            'opacity-0 pointer-events-none': !isLoaded,\n          })}\n        >\n          ${hiddenSelector.matches('address-name', true) ? '' : this.__renderAddressName()}\n          ${hiddenSelector.matches('full-name', true) ? '' : this.__renderFullName()}\n          ${hiddenSelector.matches('full-address', true) ? '' : this.__renderFullAddress()}\n          ${hiddenSelector.matches('company', true) ? '' : this.__renderCompany()}\n          ${hiddenSelector.matches('phone', true) ? '' : this.__renderPhone()}\n        </div>\n\n        <div\n          class=${classMap({\n            'transition duration-250 ease-in-out absolute inset-0 flex': true,\n            'opacity-0 pointer-events-none': isLoaded,\n          })}\n        >\n          <foxy-spinner\n            data-testid=\"spinner\"\n            state=${this.in('fail') ? 'error' : isEmpty ? 'empty' : 'busy'}\n            class=\"m-auto\"\n            lang=${this.lang}\n            ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n          >\n          </foxy-spinner>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"AddressCard.js","sourceRoot":"","sources":["../../../../src/elements/public/AddressCard/AddressCard.ts"],"names":[],"mappings":"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","sourcesContent":["import { Data, Templates } from './types';\nimport { TemplateResult, html } from 'lit-html';\n\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { NucleonElement } from '../NucleonElement/NucleonElement';\nimport { ThemeableMixin } from '../../../mixins/themeable';\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { classMap } from '../../../utils/class-map';\n\nconst NS = 'address-card';\nconst Base = ConfigurableMixin(ThemeableMixin(TranslatableMixin(NucleonElement, NS)));\n\n/**\n * Card element displaying a customer address.\n *\n * @slot address-name:before - **new in v1.4.0**\n * @slot address-name:after - **new in v1.4.0**\n *\n * @slot full-name:before - **new in v1.4.0**\n * @slot full-name:after - **new in v1.4.0**\n *\n * @slot full-address:before - **new in v1.4.0**\n * @slot full-address:after - **new in v1.4.0**\n *\n * @slot company:before - **new in v1.4.0**\n * @slot company:after - **new in v1.4.0**\n *\n * @slot phone:before - **new in v1.4.0**\n * @slot phone:after - **new in v1.4.0**\n *\n * @element foxy-address-card\n * @since 1.2.0\n */\nexport class AddressCard extends Base<Data> {\n  templates: Templates = {};\n\n  private readonly __renderAddressName = () => {\n    const isDefaultBilling = !!this.data?.is_default_billing;\n    const isDefaultShipping = !!this.data?.is_default_shipping;\n\n    return html`\n      <div class=\"mb-s leading-none\">\n        ${this.renderTemplateOrSlot('address-name:before')}\n\n        <span class=\"font-medium\">\n          ${isDefaultBilling || isDefaultShipping\n            ? html`\n                <foxy-i18n\n                  data-testid=\"address-name\"\n                  lang=${this.lang}\n                  key=\"default_${isDefaultBilling ? 'billing' : 'shipping'}_address\"\n                  ns=${this.ns}\n                >\n                </foxy-i18n>\n              `\n            : html`<span data-testid=\"address-name\">${this.data?.address_name}</span>`}\n          &ZeroWidthSpace;\n        </span>\n\n        ${this.renderTemplateOrSlot('address-name:after')}\n      </div>\n    `;\n  };\n\n  private readonly __renderLine = (id: string, icon: string, text: TemplateResult) => {\n    return html`\n      <p>\n        ${this.renderTemplateOrSlot(`${id}:before`)}\n\n        <span class=\"flex items-center text-m space-x-s text-secondary\">\n          <iron-icon icon=${icon} class=\"icon-inline flex-shrink-0\"></iron-icon>\n          <span class=\"truncate\" data-testid=${id}>${text}</span>\n          &ZeroWidthSpace;\n        </span>\n\n        ${this.renderTemplateOrSlot(`${id}:after`)}\n      </p>\n    `;\n  };\n\n  private readonly __renderFullName = () => {\n    const text = this.data\n      ? html`\n          <foxy-i18n\n            options=${JSON.stringify(this.data)}\n            lang=${this.lang}\n            key=\"full_name\"\n            ns=${this.ns}\n          >\n          </foxy-i18n>\n        `\n      : html`–`;\n\n    return this.__renderLine('full-name', 'social:person', text);\n  };\n\n  private readonly __renderFullAddress = () => {\n    const text = this.data\n      ? html`\n          <foxy-i18n\n            data-testid=\"full-address\"\n            options=${JSON.stringify(this.data)}\n            lang=${this.lang}\n            key=\"full_address\"\n            ns=${this.ns}\n          >\n          </foxy-i18n>\n        `\n      : html`–`;\n\n    return this.__renderLine('full-address', 'maps:place', text);\n  };\n\n  private readonly __renderCompany = () => {\n    const text = html`${this.data?.company || '–'}`;\n    return this.__renderLine('company', 'icons:work', text);\n  };\n\n  private readonly __renderPhone = () => {\n    const text = html`${this.data?.phone || '–'}`;\n    return this.__renderLine('phone', 'maps:local-phone', text);\n  };\n\n  render(): TemplateResult {\n    const hiddenSelector = this.hiddenSelector;\n    const isLoaded = this.in({ idle: 'snapshot' });\n    const isEmpty = this.in({ idle: 'template' });\n    const isBusy = this.in('busy');\n\n    return html`\n      <div\n        class=\"relative h-full text-left text-m leading-m font-lumo text-body\"\n        aria-live=\"polite\"\n        aria-busy=${isBusy}\n        data-testid=\"wrapper\"\n      >\n        <div\n          class=${classMap({\n            'transition duration-250 ease-in-out': true,\n            'opacity-0 pointer-events-none': !isLoaded,\n          })}\n        >\n          ${hiddenSelector.matches('address-name', true) ? '' : this.__renderAddressName()}\n          ${hiddenSelector.matches('full-name', true) ? '' : this.__renderFullName()}\n          ${hiddenSelector.matches('full-address', true) ? '' : this.__renderFullAddress()}\n          ${hiddenSelector.matches('company', true) ? '' : this.__renderCompany()}\n          ${hiddenSelector.matches('phone', true) ? '' : this.__renderPhone()}\n        </div>\n\n        <div\n          class=${classMap({\n            'transition duration-250 ease-in-out absolute inset-0 flex': true,\n            'opacity-0 pointer-events-none': isLoaded,\n          })}\n        >\n          <foxy-spinner\n            data-testid=\"spinner\"\n            state=${this.in('fail') ? 'error' : isEmpty ? 'empty' : 'busy'}\n            class=\"m-auto\"\n            lang=${this.lang}\n            ns=\"${this.ns} ${customElements.get('foxy-spinner')?.defaultNS ?? ''}\"\n          >\n          </foxy-spinner>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/elements/public/AdminSubscriptionCard/AdminSubscriptionCard.js

@@ -102,7 +102,7 @@ export class AdminSubscriptionCard extends Base {
 
       <div class="text-left leading-s text-tertiary">
         <div class="flex items-center space-x-s">
-          <span class="block flex-1 font-semibold text-body truncate">
+          <span class="block flex-1 font-medium text-body truncate">
             ${summaryOptions && summaryKey
             ? html `<foxy-i18n infer="" key=${summaryKey} .options=${summaryOptions}></foxy-i18n>`
             : html `&ZeroWidthSpace;`}

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

@@ -1 +1 @@
-{"version":3,"file":"AdminSubscriptionCard.js","sourceRoot":"","sources":["../../../../src/elements/public/AdminSubscriptionCard/AdminSubscriptionCard.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { parseFrequency } from '../../../utils/parse-frequency';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\nconst NS = 'admin-subscription-card';\nconst Base = ConfigurableMixin(TranslatableMixin(InternalCard, NS));\n\n/**\n * Card element representing a subscription (`fx:subscription`).\n * Admin-only.\n *\n * @element foxy-admin-subscription-card\n * @since 1.21.0\n */\nexport class AdminSubscriptionCard extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      localeCodes: { attribute: 'locale-codes' },\n    };\n  }\n\n  /**\n   * URL of the `fx:locale_codes` property helper.\n   * This will be used to determine the currency code for subscriptions that link to a\n   * transaction template without the code.\n   */\n  localeCodes: string | null = null;\n\n  private readonly __transactionTemplateLoaderId = 'transactionTemplateLoader';\n\n  private readonly __defaultTemplateSetLoaderId = 'defaultTemplateSetLoader';\n\n  private readonly __localeCodesHelperLoaderId = 'localeCodesLoader';\n\n  private readonly __templateSetLoaderId = 'templateSetLoader';\n\n  private readonly __itemsLoaderId = 'itemsLoader';\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  renderBody(): TemplateResult {\n    const isFailed = !!this.data?.first_failed_transaction_date;\n    const cart = this.__transactionTemplate;\n\n    const priceKey = this.__priceKey;\n    const priceOptions = this.__priceOptions;\n    const summaryOptions = this.__summaryOptions;\n    const summaryKey = this.__summaryKey;\n    const statusKey = this.__statusKey;\n    const statusOptions = this.__statusOptions;\n\n    return html`\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__transactionTemplateHref)}\n        id=${this.__transactionTemplateLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__defaultTemplateSetHref)}\n        id=${this.__defaultTemplateSetLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__localeCodesHelperHref)}\n        id=${this.__localeCodesHelperLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__templateSetHref)}\n        id=${this.__templateSetLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__itemsHref)}\n        id=${this.__itemsLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__storeHref)}\n        id=${this.__storeLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <div class=\"text-left leading-s text-tertiary\">\n        <div class=\"flex items-center space-x-s\">\n          <span class=\"block flex-1 font-semibold text-body truncate\">\n            ${summaryOptions && summaryKey\n              ? html`<foxy-i18n infer=\"\" key=${summaryKey} .options=${summaryOptions}></foxy-i18n>`\n              : html`&ZeroWidthSpace;`}\n          </span>\n          <span class=\"text-s\">\n            ${priceOptions && priceKey\n              ? html`<foxy-i18n infer=\"\" key=${priceKey} .options=${priceOptions}></foxy-i18n>`\n              : html`&ZeroWidthSpace;`}\n          </span>\n        </div>\n\n        <div class=\"truncate text-s ${isFailed ? 'text-error' : 'text-secondary'}\">\n          ${statusOptions && statusKey\n            ? html`<foxy-i18n infer=\"\" key=${statusKey} .options=${statusOptions}></foxy-i18n>`\n            : html`&ZeroWidthSpace;`}\n        </div>\n\n        <div class=\"text-tertiary truncate text-s\">${cart?.customer_email}&ZeroWidthSpace;</div>\n      </div>\n    `;\n  }\n\n  get isBodyReady(): boolean {\n    const isLoaded = !!this.__items && !!this.__currencyCode && !!this.__currencyDisplay;\n    return super.isBodyReady && isLoaded;\n  }\n\n  private get __transactionTemplateHref() {\n    const data = this.data;\n\n    if (!data) return;\n    if ('_embedded' in data && 'fx:transaction_template' in data._embedded) return;\n\n    const url = new URL(this.data?._links['fx:transaction_template'].href ?? '');\n    url.searchParams.set('zoom', 'items');\n    return url.toString();\n  }\n\n  private get __defaultTemplateSetHref() {\n    const templateSetUri = this.__transactionTemplate?.template_set_uri;\n\n    if (templateSetUri === '') {\n      try {\n        const url = new URL(this.__store?._links['fx:template_sets'].href ?? '');\n        url.searchParams.set('code', 'DEFAULT');\n        return url.toString();\n      } catch {\n        //\n      }\n    }\n  }\n\n  private get __localeCodesHelperHref() {\n    if (this.__defaultTemplateSetHref || this.__templateSetHref) {\n      return this.localeCodes ?? void 0;\n    }\n  }\n\n  private get __templateSetHref() {\n    const cart = this.__transactionTemplate;\n    if (!cart?.currency_code) return cart?.template_set_uri || void 0;\n  }\n\n  private get __itemsHref() {\n    const cart = this.__transactionTemplate;\n\n    if (!cart) return;\n    if ('_embedded' in cart && 'fx:items' in cart._embedded) return;\n\n    const url = new URL(cart._links['fx:items'].href);\n    url.searchParams.set('limit', '1');\n    return url.toString();\n  }\n\n  private get __storeHref() {\n    return this.data?._links['fx:store']?.href;\n  }\n\n  private get __transactionTemplate() {\n    const data = this.data;\n\n    if (data && '_embedded' in data && 'fx:transaction_template' in data._embedded) {\n      type Cart = Resource<Rels.TransactionTemplate>;\n      type CartWithItems = Resource<Rels.TransactionTemplate, { zoom: 'items' }>;\n      return data._embedded['fx:transaction_template'] as Cart | CartWithItems;\n    } else {\n      type Loader = NucleonElement<Resource<Rels.TransactionTemplate, { zoom: 'items' }>>;\n      const selector = `#${this.__transactionTemplateLoaderId}`;\n      return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n    }\n  }\n\n  private get __defaultTemplateSet() {\n    type Loader = NucleonElement<Resource<Rels.TemplateSets>>;\n    const selector = `#${this.__defaultTemplateSetLoaderId}`;\n    const loader = this.renderRoot.querySelector<Loader>(selector);\n    return loader?.data?._embedded['fx:template_sets'][0] ?? null;\n  }\n\n  private get __localeCodesHelper() {\n    type Loader = NucleonElement<Resource<Rels.LocaleCodes>>;\n    const selector = `#${this.__localeCodesHelperLoaderId}`;\n    return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n  }\n\n  private get __templateSet() {\n    type Loader = NucleonElement<Resource<Rels.TemplateSet>>;\n    const selector = `#${this.__templateSetLoaderId}`;\n    return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n  }\n\n  private get __items() {\n    type Cart = Resource<Rels.TransactionTemplate>;\n    type CartWithItems = Resource<Rels.TransactionTemplate, { zoom: 'items' }>;\n\n    const cart = this.__transactionTemplate as Cart | CartWithItems | null;\n\n    if (cart && '_embedded' in cart && 'fx:items' in cart._embedded) {\n      const items = cart._embedded['fx:items'];\n\n      return {\n        array: items,\n        count: items.length,\n        isApproximateCount: items.length === 20,\n      };\n    }\n\n    type Loader = NucleonElement<Resource<Rels.Items>>;\n    const loader = this.renderRoot.querySelector<Loader>(`#${this.__itemsLoaderId}`);\n    if (!loader?.data) return null;\n\n    return {\n      array: loader.data._embedded['fx:items'],\n      count: loader.data.total_items,\n      isApproximateCount: false,\n    };\n  }\n\n  private get __store() {\n    type Loader = NucleonElement<Resource<Rels.Store>>;\n    const selector = `#${this.__storeLoaderId}`;\n    return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n  }\n\n  private get __currencyDisplay() {\n    const useCode = this.__store?.use_international_currency_symbol;\n\n    if (useCode === true) return 'code';\n    if (useCode === false) return 'symbol';\n  }\n\n  private get __summaryOptions() {\n    const { array, count } = this.__items ?? {};\n    if (array && count) return { firstItem: array[0], count, countMinus1: count - 1 };\n  }\n\n  private get __summaryKey() {\n    const items = this.__items;\n    if (items) return items.isApproximateCount ? 'summary_approximate' : 'summary';\n  }\n\n  private get __statusOptions() {\n    const d = this.data;\n    const date = d?.first_failed_transaction_date ?? d?.end_date ?? d?.next_transaction_date;\n    if (date) return { date };\n  }\n\n  private get __currencyCode() {\n    const cart = this.__transactionTemplate;\n\n    if (cart?.currency_code) {\n      return cart.currency_code as string;\n    } else {\n      const allLocaleCodes = this.__localeCodesHelper;\n      const localeCode = (this.__templateSet ?? this.__defaultTemplateSet)?.locale_code;\n      const localeInfo = localeCode ? allLocaleCodes?.values[localeCode] : void 0;\n\n      if (localeInfo) return /Currency: ([A-Z]{3})/g.exec(localeInfo)?.[1];\n    }\n  }\n\n  private get __priceOptions() {\n    const currencyDisplay = this.__currencyDisplay;\n    if (currencyDisplay === undefined) return;\n\n    const currencyCode = this.__currencyCode;\n    if (currencyCode === undefined) return;\n\n    const totalOrder = this.__transactionTemplate?.total_order;\n    if (totalOrder === undefined) return;\n\n    const frequency = this.data?.frequency;\n    if (frequency === undefined) return;\n\n    return {\n      ...parseFrequency(frequency),\n      amount: `${totalOrder} ${currencyCode}`,\n      currencyDisplay,\n    };\n  }\n\n  private get __statusKey() {\n    const data = this.data;\n\n    if (data === null) return;\n    if (data.first_failed_transaction_date) return 'subscription_failed';\n    if (data.end_date) {\n      const hasEnded = new Date(data.end_date).getTime() > Date.now();\n      return hasEnded ? 'subscription_will_be_cancelled' : 'subscription_cancelled';\n    }\n\n    return `subscription_${data.is_active ? 'active' : 'inactive'}`;\n  }\n\n  private get __priceKey() {\n    const frequency = this.data?.frequency;\n    if (frequency) return `price_${frequency === '.5m' ? 'twice_a_month' : 'recurring'}`;\n  }\n}\n"]}
+{"version":3,"file":"AdminSubscriptionCard.js","sourceRoot":"","sources":["../../../../src/elements/public/AdminSubscriptionCard/AdminSubscriptionCard.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations } from 'lit-element';\nimport type { TemplateResult } from 'lit-html';\nimport type { NucleonElement } from '../NucleonElement/NucleonElement';\nimport type { Resource } from '@foxy.io/sdk/core';\nimport type { Rels } from '@foxy.io/sdk/backend';\nimport type { Data } from './types';\n\nimport { TranslatableMixin } from '../../../mixins/translatable';\nimport { ConfigurableMixin } from '../../../mixins/configurable';\nimport { parseFrequency } from '../../../utils/parse-frequency';\nimport { InternalCard } from '../../internal/InternalCard/InternalCard';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { html } from 'lit-html';\n\nconst NS = 'admin-subscription-card';\nconst Base = ConfigurableMixin(TranslatableMixin(InternalCard, NS));\n\n/**\n * Card element representing a subscription (`fx:subscription`).\n * Admin-only.\n *\n * @element foxy-admin-subscription-card\n * @since 1.21.0\n */\nexport class AdminSubscriptionCard extends Base<Data> {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      localeCodes: { attribute: 'locale-codes' },\n    };\n  }\n\n  /**\n   * URL of the `fx:locale_codes` property helper.\n   * This will be used to determine the currency code for subscriptions that link to a\n   * transaction template without the code.\n   */\n  localeCodes: string | null = null;\n\n  private readonly __transactionTemplateLoaderId = 'transactionTemplateLoader';\n\n  private readonly __defaultTemplateSetLoaderId = 'defaultTemplateSetLoader';\n\n  private readonly __localeCodesHelperLoaderId = 'localeCodesLoader';\n\n  private readonly __templateSetLoaderId = 'templateSetLoader';\n\n  private readonly __itemsLoaderId = 'itemsLoader';\n\n  private readonly __storeLoaderId = 'storeLoader';\n\n  renderBody(): TemplateResult {\n    const isFailed = !!this.data?.first_failed_transaction_date;\n    const cart = this.__transactionTemplate;\n\n    const priceKey = this.__priceKey;\n    const priceOptions = this.__priceOptions;\n    const summaryOptions = this.__summaryOptions;\n    const summaryKey = this.__summaryKey;\n    const statusKey = this.__statusKey;\n    const statusOptions = this.__statusOptions;\n\n    return html`\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__transactionTemplateHref)}\n        id=${this.__transactionTemplateLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__defaultTemplateSetHref)}\n        id=${this.__defaultTemplateSetLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__localeCodesHelperHref)}\n        id=${this.__localeCodesHelperLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__templateSetHref)}\n        id=${this.__templateSetLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__itemsHref)}\n        id=${this.__itemsLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <foxy-nucleon\n        class=\"hidden\"\n        infer=\"\"\n        href=${ifDefined(this.__storeHref)}\n        id=${this.__storeLoaderId}\n        @update=${() => this.requestUpdate()}\n      >\n      </foxy-nucleon>\n\n      <div class=\"text-left leading-s text-tertiary\">\n        <div class=\"flex items-center space-x-s\">\n          <span class=\"block flex-1 font-medium text-body truncate\">\n            ${summaryOptions && summaryKey\n              ? html`<foxy-i18n infer=\"\" key=${summaryKey} .options=${summaryOptions}></foxy-i18n>`\n              : html`&ZeroWidthSpace;`}\n          </span>\n          <span class=\"text-s\">\n            ${priceOptions && priceKey\n              ? html`<foxy-i18n infer=\"\" key=${priceKey} .options=${priceOptions}></foxy-i18n>`\n              : html`&ZeroWidthSpace;`}\n          </span>\n        </div>\n\n        <div class=\"truncate text-s ${isFailed ? 'text-error' : 'text-secondary'}\">\n          ${statusOptions && statusKey\n            ? html`<foxy-i18n infer=\"\" key=${statusKey} .options=${statusOptions}></foxy-i18n>`\n            : html`&ZeroWidthSpace;`}\n        </div>\n\n        <div class=\"text-tertiary truncate text-s\">${cart?.customer_email}&ZeroWidthSpace;</div>\n      </div>\n    `;\n  }\n\n  get isBodyReady(): boolean {\n    const isLoaded = !!this.__items && !!this.__currencyCode && !!this.__currencyDisplay;\n    return super.isBodyReady && isLoaded;\n  }\n\n  private get __transactionTemplateHref() {\n    const data = this.data;\n\n    if (!data) return;\n    if ('_embedded' in data && 'fx:transaction_template' in data._embedded) return;\n\n    const url = new URL(this.data?._links['fx:transaction_template'].href ?? '');\n    url.searchParams.set('zoom', 'items');\n    return url.toString();\n  }\n\n  private get __defaultTemplateSetHref() {\n    const templateSetUri = this.__transactionTemplate?.template_set_uri;\n\n    if (templateSetUri === '') {\n      try {\n        const url = new URL(this.__store?._links['fx:template_sets'].href ?? '');\n        url.searchParams.set('code', 'DEFAULT');\n        return url.toString();\n      } catch {\n        //\n      }\n    }\n  }\n\n  private get __localeCodesHelperHref() {\n    if (this.__defaultTemplateSetHref || this.__templateSetHref) {\n      return this.localeCodes ?? void 0;\n    }\n  }\n\n  private get __templateSetHref() {\n    const cart = this.__transactionTemplate;\n    if (!cart?.currency_code) return cart?.template_set_uri || void 0;\n  }\n\n  private get __itemsHref() {\n    const cart = this.__transactionTemplate;\n\n    if (!cart) return;\n    if ('_embedded' in cart && 'fx:items' in cart._embedded) return;\n\n    const url = new URL(cart._links['fx:items'].href);\n    url.searchParams.set('limit', '1');\n    return url.toString();\n  }\n\n  private get __storeHref() {\n    return this.data?._links['fx:store']?.href;\n  }\n\n  private get __transactionTemplate() {\n    const data = this.data;\n\n    if (data && '_embedded' in data && 'fx:transaction_template' in data._embedded) {\n      type Cart = Resource<Rels.TransactionTemplate>;\n      type CartWithItems = Resource<Rels.TransactionTemplate, { zoom: 'items' }>;\n      return data._embedded['fx:transaction_template'] as Cart | CartWithItems;\n    } else {\n      type Loader = NucleonElement<Resource<Rels.TransactionTemplate, { zoom: 'items' }>>;\n      const selector = `#${this.__transactionTemplateLoaderId}`;\n      return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n    }\n  }\n\n  private get __defaultTemplateSet() {\n    type Loader = NucleonElement<Resource<Rels.TemplateSets>>;\n    const selector = `#${this.__defaultTemplateSetLoaderId}`;\n    const loader = this.renderRoot.querySelector<Loader>(selector);\n    return loader?.data?._embedded['fx:template_sets'][0] ?? null;\n  }\n\n  private get __localeCodesHelper() {\n    type Loader = NucleonElement<Resource<Rels.LocaleCodes>>;\n    const selector = `#${this.__localeCodesHelperLoaderId}`;\n    return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n  }\n\n  private get __templateSet() {\n    type Loader = NucleonElement<Resource<Rels.TemplateSet>>;\n    const selector = `#${this.__templateSetLoaderId}`;\n    return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n  }\n\n  private get __items() {\n    type Cart = Resource<Rels.TransactionTemplate>;\n    type CartWithItems = Resource<Rels.TransactionTemplate, { zoom: 'items' }>;\n\n    const cart = this.__transactionTemplate as Cart | CartWithItems | null;\n\n    if (cart && '_embedded' in cart && 'fx:items' in cart._embedded) {\n      const items = cart._embedded['fx:items'];\n\n      return {\n        array: items,\n        count: items.length,\n        isApproximateCount: items.length === 20,\n      };\n    }\n\n    type Loader = NucleonElement<Resource<Rels.Items>>;\n    const loader = this.renderRoot.querySelector<Loader>(`#${this.__itemsLoaderId}`);\n    if (!loader?.data) return null;\n\n    return {\n      array: loader.data._embedded['fx:items'],\n      count: loader.data.total_items,\n      isApproximateCount: false,\n    };\n  }\n\n  private get __store() {\n    type Loader = NucleonElement<Resource<Rels.Store>>;\n    const selector = `#${this.__storeLoaderId}`;\n    return this.renderRoot.querySelector<Loader>(selector)?.data ?? null;\n  }\n\n  private get __currencyDisplay() {\n    const useCode = this.__store?.use_international_currency_symbol;\n\n    if (useCode === true) return 'code';\n    if (useCode === false) return 'symbol';\n  }\n\n  private get __summaryOptions() {\n    const { array, count } = this.__items ?? {};\n    if (array && count) return { firstItem: array[0], count, countMinus1: count - 1 };\n  }\n\n  private get __summaryKey() {\n    const items = this.__items;\n    if (items) return items.isApproximateCount ? 'summary_approximate' : 'summary';\n  }\n\n  private get __statusOptions() {\n    const d = this.data;\n    const date = d?.first_failed_transaction_date ?? d?.end_date ?? d?.next_transaction_date;\n    if (date) return { date };\n  }\n\n  private get __currencyCode() {\n    const cart = this.__transactionTemplate;\n\n    if (cart?.currency_code) {\n      return cart.currency_code as string;\n    } else {\n      const allLocaleCodes = this.__localeCodesHelper;\n      const localeCode = (this.__templateSet ?? this.__defaultTemplateSet)?.locale_code;\n      const localeInfo = localeCode ? allLocaleCodes?.values[localeCode] : void 0;\n\n      if (localeInfo) return /Currency: ([A-Z]{3})/g.exec(localeInfo)?.[1];\n    }\n  }\n\n  private get __priceOptions() {\n    const currencyDisplay = this.__currencyDisplay;\n    if (currencyDisplay === undefined) return;\n\n    const currencyCode = this.__currencyCode;\n    if (currencyCode === undefined) return;\n\n    const totalOrder = this.__transactionTemplate?.total_order;\n    if (totalOrder === undefined) return;\n\n    const frequency = this.data?.frequency;\n    if (frequency === undefined) return;\n\n    return {\n      ...parseFrequency(frequency),\n      amount: `${totalOrder} ${currencyCode}`,\n      currencyDisplay,\n    };\n  }\n\n  private get __statusKey() {\n    const data = this.data;\n\n    if (data === null) return;\n    if (data.first_failed_transaction_date) return 'subscription_failed';\n    if (data.end_date) {\n      const hasEnded = new Date(data.end_date).getTime() > Date.now();\n      return hasEnded ? 'subscription_will_be_cancelled' : 'subscription_cancelled';\n    }\n\n    return `subscription_${data.is_active ? 'active' : 'inactive'}`;\n  }\n\n  private get __priceKey() {\n    const frequency = this.data?.frequency;\n    if (frequency) return `price_${frequency === '.5m' ? 'twice_a_month' : 'recurring'}`;\n  }\n}\n"]}

package/dist/elements/public/ApiBrowser/internal/InternalApiBrowserResourceForm/InternalApiBrowserResourceForm.js

@@ -80,7 +80,7 @@ textarea::selection{
             <foxy-copy-to-clipboard infer="copy-to-clipboard" text=${this.href || this.parent}>
             </foxy-copy-to-clipboard>
 
-            <span class="font-semibold truncate">${this.__renderTitle()}</span>
+            <span class="font-medium truncate">${this.__renderTitle()}</span>
             <span class="flex-1"></span>
 
             ${this.in({ idle: { snapshot: 'dirty' } }) || this.in({ idle: 'template' })
@@ -265,7 +265,7 @@ textarea::selection{
           >
             <div class="flex items-center">
               <div class="flex-1 space-y-xs px-s min-w-0 text-s">
-                <div class="truncate font-semibold">${title || href}</div>
+                <div class="truncate font-medium">${title || href}</div>
                 <div class="opacity-75 truncate">${curie}</div>
               </div>