@swiftwc/ui 0.0.0-dev.45 → 0.0.0-dev.47

package/generated/client/index.js

@@ -108,12 +108,12 @@ document.addEventListener('touchstart', () => { }, { passive: true });
 //#endregion
 // SECTION
 const handleHelp = ({ target, relatedTarget }) => {
-    if (!(target instanceof HTMLElement && target))
+    if (!(target instanceof HTMLElement))
         return;
     const trigger = target.closest('[help]');
     if (!trigger)
         return;
-    if (relatedTarget instanceof HTMLElement && relatedTarget && trigger.contains(relatedTarget))
+    if (relatedTarget instanceof HTMLElement && trigger.contains(relatedTarget))
         return;
     const newAnchorName = `--help-${self.crypto.randomUUID()}`;
     const tooltip = $(`<fine-tooltip></fine-tooltip>`, '>1');
@@ -125,12 +125,12 @@ const handleHelp = ({ target, relatedTarget }) => {
     // }, 2000)
     // console.log(999, trigger)
 }, handleDone = ({ target, relatedTarget }) => {
-    if (!(target instanceof HTMLElement && target))
+    if (!(target instanceof HTMLElement))
         return;
     const trigger = target.closest('[help]');
     if (!trigger)
         return;
-    if (relatedTarget instanceof HTMLElement && relatedTarget && trigger.contains(relatedTarget))
+    if (relatedTarget instanceof HTMLElement && trigger.contains(relatedTarget))
         return;
     const anchorName = trigger.style.anchorName;
     if (!anchorName.startsWith('--help-'))

package/generated/components/alert-dialog.js

@@ -25,7 +25,7 @@ export class AlertDialog extends DialogBase {
             { types: 'cancel', listener: this.#handleDialogCancel },
         ], el).on());
         CleanupRegistry.register(el, onoff(touchGlass(el, (t) => t, ({ target }) => {
-            if (!(target instanceof HTMLElement && target))
+            if (!(target instanceof HTMLElement))
                 return true;
             if (target.matches('[is=alert-dialog]'))
                 return false;
@@ -52,9 +52,9 @@ export class AlertDialog extends DialogBase {
         if (devFlags.debug)
             console.debug(`${AlertDialog.name} ⚡️ ${evt?.type}`);
         const { target, currentTarget: dialog } = evt;
-        if (!(dialog instanceof HTMLDialogElement && dialog))
+        if (!(dialog instanceof HTMLDialogElement))
             return;
-        if (!(target instanceof HTMLElement && target))
+        if (!(target instanceof HTMLElement))
             return;
         const button = target.closest('button');
         if (!button)
@@ -75,7 +75,7 @@ export class AlertDialog extends DialogBase {
         if (!evt.cancelable)
             return;
         const { target } = evt;
-        if (!(target instanceof HTMLDialogElement && target))
+        if (!(target instanceof HTMLDialogElement))
             return;
         evt.preventDefault();
         target.inert = true;
@@ -92,7 +92,7 @@ export class AlertDialog extends DialogBase {
     static #handleDialogClose = ({ type, target }) => {
         if (devFlags.debug)
             console.debug(`${AlertDialog.name} ⚡️ ${type}`);
-        if (!(target instanceof HTMLDialogElement && target))
+        if (!(target instanceof HTMLDialogElement))
             return;
         target.remove();
     };

package/generated/components/bordered-button.js

@@ -38,7 +38,7 @@ export class BorderedButton extends ButtonBase {
     static polyfillAttributeChangedCallback([{ attributeName, target, oldValue }]) {
         if (devFlags.debug)
             console.debug(`${BorderedButton.name} ⚡️ attr-change [${attributeName}] ("${oldValue}" → "${target.getAttribute(attributeName ?? '')}")`);
-        const node = target instanceof HTMLButtonElement && target;
+        const node = target instanceof HTMLButtonElement;
         if (!node)
             return;
         switch (attributeName) {

package/generated/components/bordered-prominent-button.js

@@ -38,7 +38,7 @@ export class BorderedProminentButton extends ButtonBase {
     static polyfillAttributeChangedCallback([{ attributeName, target, oldValue }]) {
         if (devFlags.debug)
             console.debug(`${BorderedProminentButton.name} ⚡️ attr-change [${attributeName}] ("${oldValue}" → "${target.getAttribute(attributeName ?? '')}")`);
-        const node = target instanceof HTMLButtonElement && target;
+        const node = target instanceof HTMLButtonElement;
         if (!node)
             return;
         switch (attributeName) {

package/generated/components/borderless-button.js

@@ -38,7 +38,7 @@ export class BorderlessButton extends ButtonBase {
     static polyfillAttributeChangedCallback([{ attributeName, target, oldValue }]) {
         if (devFlags.debug)
             console.debug(`${BorderlessButton.name} ⚡️ attr-change [${attributeName}] ("${oldValue}" → "${target.getAttribute(attributeName ?? '')}")`);
-        const node = target instanceof HTMLButtonElement && target;
+        const node = target instanceof HTMLButtonElement;
         if (!node)
             return;
         switch (attributeName) {

package/generated/components/confirmation-dialog.js

@@ -31,7 +31,7 @@ export class ConfirmationDialog extends DialogBase {
             { types: 'cancel', listener: this.#handleDialogCancel },
         ], el).on());
         CleanupRegistry.register(el, onoff(touchGlass(el, (t) => t, ({ target }) => {
-            if (!(target instanceof HTMLElement && target))
+            if (!(target instanceof HTMLElement))
                 return true;
             if (target.matches('[is=confirmation-dialog]'))
                 return false;
@@ -64,9 +64,9 @@ export class ConfirmationDialog extends DialogBase {
         if (devFlags.debug)
             console.debug(`${ConfirmationDialog.name} ⚡️ ${evt?.type}`);
         const { target, currentTarget: dialog } = evt;
-        if (!(dialog instanceof HTMLDialogElement && dialog))
+        if (!(dialog instanceof HTMLDialogElement))
             return;
-        if (!(target instanceof HTMLElement && target))
+        if (!(target instanceof HTMLElement))
             return;
         if (target.matches('dialog') && !isInside(evt.clientX, evt.clientY, dialog.getBoundingClientRect()))
             return dialog.requestClose(); // click outside
@@ -89,7 +89,7 @@ export class ConfirmationDialog extends DialogBase {
         if (!evt.cancelable)
             return;
         const { target } = evt;
-        if (!(target instanceof HTMLDialogElement && target))
+        if (!(target instanceof HTMLDialogElement))
             return;
         evt.preventDefault();
         target.inert = true;
@@ -106,7 +106,7 @@ export class ConfirmationDialog extends DialogBase {
     static #handleDialogClose = ({ type, target }) => {
         if (devFlags.debug)
             console.debug(`${ConfirmationDialog.name} ⚡️ ${type}`);
-        if (!(target instanceof HTMLDialogElement && target))
+        if (!(target instanceof HTMLDialogElement))
             return;
         target.remove();
     };

package/generated/components/content-unavailable-view.d.ts

@@ -18,7 +18,7 @@ export declare class ContentUnavailableView extends HTMLElement {
     static get observedAttributes(): string[];
     static get template(): DocumentFragment;
     constructor();
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     disconnectedCallback(): void;
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }

package/generated/components/content-unavailable-view.js

@@ -45,14 +45,6 @@ export class ContentUnavailableView extends HTMLElement {
             actions: this.#shadowRoot.querySelector('slot[name="actions"]') ?? undefined,
         };
     }
-    disconnectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${ContentUnavailableView.name} ⚡️ disconnect`);
-    }
-    connectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${ContentUnavailableView.name} ⚡️ connect`);
-    }
     attributeChangedCallback(name, oldValue, newValue) {
         if (devFlags.debug)
             console.debug(`${ContentUnavailableView.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
@@ -68,6 +60,14 @@ export class ContentUnavailableView extends HTMLElement {
                 break;
         }
     }
+    disconnectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${ContentUnavailableView.name} ⚡️ disconnect`);
+    }
+    connectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${ContentUnavailableView.name} ⚡️ connect`);
+    }
     #renderSearch = (search) => {
         const titleLabel = this.querySelector(':scope>:not([slot])') ?? this.appendChild($(`<label-view><i class="ph ph-magnifying-glass" slot="image" foreground="secondary"></i></label-view>`, '>1')), descText = this.querySelector(':scope>[slot=description]') ?? this.appendChild($(`<label-view foreground="secondary" slot="description"></label-view>`, '>1'));
         if (search) {

package/generated/components/date-picker.d.ts

@@ -6,9 +6,9 @@ export declare class DatePicker extends FormAssociatedBase {
     static get observedAttributes(): string[];
     get template(): DocumentFragment;
     constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
     attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    disconnectedCallback(): void;
+    connectedCallback(): void;
     get datePickerStyle(): DatePickerStyle;
     get name(): string;
     get value(): {

package/generated/components/date-picker.js

@@ -65,24 +65,6 @@ export class DatePicker extends FormAssociatedBase {
         super();
         this.#shadowRoot = this.attachShadow({ mode: 'closed' });
     }
-    connectedCallback() {
-        super.connectedCallback();
-        CleanupRegistry.register(this, onoff('click', this.#handleClick, this).on());
-        this.#render();
-        CleanupRegistry.register(this, onoff('localechange', () => {
-            this.#render();
-        }, I18n.on).on());
-        // finally
-        if (!this.hasAttribute('selection'))
-            return;
-        const [y = '', m = '', d = ''] = (this.getAttribute('selection') ?? '').split(/\D+/);
-        this.#selectedDate = { year: y, month: m, day: d };
-        this.#sendValueToForm(false);
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.#validityObservers.unobserveAll();
-    }
     attributeChangedCallback(name, oldValue, newValue) {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
@@ -123,6 +105,24 @@ export class DatePicker extends FormAssociatedBase {
                 break;
         }
     }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.#validityObservers.unobserveAll();
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        CleanupRegistry.register(this, onoff('click', this.#handleClick, this).on());
+        this.#render();
+        CleanupRegistry.register(this, onoff('localechange', () => {
+            this.#render();
+        }, I18n.on).on());
+        // finally
+        if (!this.hasAttribute('selection'))
+            return;
+        const [y = '', m = '', d = ''] = (this.getAttribute('selection') ?? '').split(/\D+/);
+        this.#selectedDate = { year: y, month: m, day: d };
+        this.#sendValueToForm(false);
+    }
     get datePickerStyle() {
         return datePickerStyles.includes(this.getAttribute('date-picker-style') ?? '') ? this.getAttribute('date-picker-style') : 'automatic';
     }
@@ -174,7 +174,7 @@ export class DatePicker extends FormAssociatedBase {
     #handleValiditiesSlotchange = ({ type, target: slot }) => {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${type}`);
-        if (!(slot instanceof HTMLSlotElement && slot))
+        if (!(slot instanceof HTMLSlotElement))
             return;
         const assigned = slot.assignedElements();
         this.#validityObservers.syncObservations(assigned, ['value', 'label']);
@@ -204,7 +204,7 @@ export class DatePicker extends FormAssociatedBase {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${evt?.type}`);
         const { target } = evt;
-        if (!(target instanceof HTMLElement && target))
+        if (!(target instanceof HTMLElement))
             return;
         const input = target.closest('input');
         if (input)
@@ -248,7 +248,7 @@ export class DatePicker extends FormAssociatedBase {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${evt?.type}`);
         const { target: input } = evt;
-        if (!(input instanceof HTMLInputElement && input))
+        if (!(input instanceof HTMLInputElement))
             return;
         evt.preventDefault();
         const data = [...`${(evt.clipboardData?.getData('text') ?? '').trim()}`].reduce((acc, ch, i) => {
@@ -271,7 +271,7 @@ export class DatePicker extends FormAssociatedBase {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${evt?.type}`);
         const { target: input } = evt;
-        if (!(input instanceof HTMLInputElement && input))
+        if (!(input instanceof HTMLInputElement))
             return;
         if ('insertText' !== evt.inputType)
             return;
@@ -294,7 +294,7 @@ export class DatePicker extends FormAssociatedBase {
     #handleInputKeydown = ({ type, target, key }) => {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${type}`);
-        if (!(target instanceof HTMLInputElement && target))
+        if (!(target instanceof HTMLInputElement))
             return;
         const input = target;
         if (!input)
@@ -320,7 +320,7 @@ export class DatePicker extends FormAssociatedBase {
     #handleInputBlur = ({ target, type }) => {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${type}`);
-        if (!(target instanceof HTMLInputElement && target))
+        if (!(target instanceof HTMLInputElement))
             return;
         const input = target;
         if (0 === input.value.length)

package/generated/components/disclosure-group.js

@@ -41,11 +41,10 @@ export class DisclosureGroup extends DetailsBase {
             toggleTimers.delete(el);
         });
     }
-    static #handleToggle = async (evt) => {
+    static #handleToggle = async ({ type, currentTarget: details }) => {
         if (devFlags.debug)
-            console.debug(`${DisclosureGroup.name} ⚡️ ${evt?.type}`);
-        const details = evt.currentTarget instanceof HTMLDetailsElement && evt.currentTarget;
-        if (!details)
+            console.debug(`${DisclosureGroup.name} ⚡️ ${type}`);
+        if (!(details instanceof HTMLDetailsElement))
             return;
         const newValue = details.open ? 'opening' : 'closing';
         if (newValue !== details.dataset.state)

package/generated/components/fine-tooltip.js

@@ -12,7 +12,7 @@ export class FineTooltip extends HTMLElement {
     };
     #handleTriggerAttrMutation = (mutations) => {
         for (const { target, attributeName } of mutations)
-            if (target instanceof HTMLElement && target && attributeName)
+            if (target instanceof HTMLElement && attributeName)
                 this.#render(target.getAttribute(attributeName));
     };
     #handleMeasure = ([{ target, borderBoxSize }]) => {
@@ -20,7 +20,7 @@ export class FineTooltip extends HTMLElement {
             console.debug(`${_a.name} ⚡️ measure`);
         if (target.hasAttribute('closing'))
             return;
-        if (!(target instanceof HTMLElement && target))
+        if (!(target instanceof HTMLElement))
             return;
         const { top } = target.getBoundingClientRect();
         const vpHeight = self.visualViewport?.height ?? 0, blockSize = borderBoxSize.at(0)?.blockSize ?? 0;

package/generated/components/glass-button.js

@@ -38,7 +38,7 @@ export class GlassButton extends ButtonBase {
     static polyfillAttributeChangedCallback([{ attributeName, target, oldValue }]) {
         if (devFlags.debug)
             console.debug(`${GlassButton.name} ⚡️ attr-change [${attributeName}] ("${oldValue}" → "${target.getAttribute(attributeName ?? '')}")`);
-        const node = target instanceof HTMLButtonElement && target;
+        const node = target instanceof HTMLButtonElement;
         if (!node)
             return;
         switch (attributeName) {

package/generated/components/glass-prominent-button.js

@@ -38,7 +38,7 @@ export class GlassProminentButton extends ButtonBase {
     static polyfillAttributeChangedCallback([{ attributeName, target, oldValue }]) {
         if (devFlags.debug)
             console.debug(`${GlassProminentButton.name} ⚡️ attr-change [${attributeName}] ("${oldValue}" → "${target.getAttribute(attributeName ?? '')}")`);
-        const node = target instanceof HTMLButtonElement && target;
+        const node = target instanceof HTMLButtonElement;
         if (!node)
             return;
         switch (attributeName) {

package/generated/components/label-view.d.ts

@@ -3,7 +3,7 @@ export declare class LabelView extends HTMLElement {
     static get observedAttributes(): string[];
     static get template(): DocumentFragment;
     constructor();
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     disconnectedCallback(): void;
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }

package/generated/components/label-view.js

@@ -24,14 +24,6 @@ export class LabelView extends HTMLElement {
         this.#shadowRoot = this.attachShadow({ mode: 'closed' });
         this.#shadowRoot.appendChild(document.importNode(this.constructor.template, true));
     }
-    disconnectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${LabelView.name} ⚡️ disconnect`);
-    }
-    connectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${LabelView.name} ⚡️ connect`);
-    }
     attributeChangedCallback(name, oldValue, newValue) {
         if (devFlags.debug)
             console.debug(`${LabelView.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
@@ -56,4 +48,12 @@ export class LabelView extends HTMLElement {
                 break;
         }
     }
+    disconnectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${LabelView.name} ⚡️ disconnect`);
+    }
+    connectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${LabelView.name} ⚡️ connect`);
+    }
 }

package/generated/components/menu-view.d.ts

@@ -6,7 +6,7 @@ export declare class MenuView extends HTMLElement {
     static get observedAttributes(): string[];
     static get template(): DocumentFragment;
     constructor();
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     disconnectedCallback(): void;
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }

package/generated/components/menu-view.js

@@ -29,45 +29,6 @@ export class MenuView extends HTMLElement {
         this.#shadowRoot = this.attachShadow({ mode: 'closed' });
         this.#shadowRoot.appendChild(document.importNode(this.constructor.template, true));
     }
-    disconnectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${_a.name} ⚡️ disconnect`);
-        // const dialog = this.#shadowRoot.querySelector('dialog'),
-        //   trigger = this.#shadowRoot.querySelector('button')
-        // trigger?.removeEventListener('click', this.#handleTriggerClick)
-        // dialog?.removeEventListener('click', this.#handleDialogClick)
-        // dialog?.removeEventListener('close', this.#handleDialogClose)
-        // dialog?.removeEventListener('cancel', this.#handleDialogCancel)
-        const summaryPart = this.#shadowRoot.querySelector('[part*=menu-summary]'), dialogPart = this.#shadowRoot.querySelector('[part*=menu-dialog]');
-        summaryPart?.style.removeProperty('anchor-name'); //$.prop('anchor-name', null, summaryPart)
-        dialogPart?.style.removeProperty('position-anchor'); //$.prop('position-anchor', null, dialogPart)
-        CleanupRegistry.unregister(this);
-    }
-    connectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${_a.name} ⚡️ connect`);
-        this.#dialog = this.#shadowRoot.querySelector('dialog') ?? undefined;
-        const trigger = this.#shadowRoot.querySelector('button') ?? undefined;
-        CleanupRegistry.register(this, onoff('click', this.#handleTriggerClick, trigger).on());
-        CleanupRegistry.register(this, onoff([
-            { types: 'click', listener: this.#handleDialogClick },
-            { types: 'close', listener: this.#handleDialogClose },
-            { types: 'cancel', listener: this.#handleDialogCancel },
-        ], this.#dialog).on());
-        CleanupRegistry.register(this, onoff(touchGlass(this, (t) => t, ({ target }) => {
-            if (!(target instanceof HTMLElement && target))
-                return true;
-            if (target.matches('menu-view'))
-                return false;
-            if (!target.closest('menu-view[open]'))
-                return false;
-            return true;
-        }), this).on());
-        const newAnchorName = `--menu-view-${self.crypto.randomUUID()}`;
-        const summaryPart = this.#shadowRoot.querySelector('[part*=menu-summary]'), dialogPart = this.#shadowRoot.querySelector('[part*=menu-dialog]');
-        summaryPart?.style.setProperty('anchor-name', newAnchorName, 'important'); // override unset:all // $.prop('anchor-name', newAnchorName, summaryPart, 'important') //
-        dialogPart?.style.setProperty('position-anchor', newAnchorName); // $.prop('position-anchor', newAnchorName, dialogPart) //
-    }
     attributeChangedCallback(name, oldValue, newValue) {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
@@ -107,10 +68,49 @@ export class MenuView extends HTMLElement {
                 break;
         }
     }
+    disconnectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${_a.name} ⚡️ disconnect`);
+        // const dialog = this.#shadowRoot.querySelector('dialog'),
+        //   trigger = this.#shadowRoot.querySelector('button')
+        // trigger?.removeEventListener('click', this.#handleTriggerClick)
+        // dialog?.removeEventListener('click', this.#handleDialogClick)
+        // dialog?.removeEventListener('close', this.#handleDialogClose)
+        // dialog?.removeEventListener('cancel', this.#handleDialogCancel)
+        const summaryPart = this.#shadowRoot.querySelector('[part*=menu-summary]'), dialogPart = this.#shadowRoot.querySelector('[part*=menu-dialog]');
+        summaryPart?.style.removeProperty('anchor-name'); //$.prop('anchor-name', null, summaryPart)
+        dialogPart?.style.removeProperty('position-anchor'); //$.prop('position-anchor', null, dialogPart)
+        CleanupRegistry.unregister(this);
+    }
+    connectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${_a.name} ⚡️ connect`);
+        this.#dialog = this.#shadowRoot.querySelector('dialog') ?? undefined;
+        const trigger = this.#shadowRoot.querySelector('button') ?? undefined;
+        CleanupRegistry.register(this, onoff('click', this.#handleTriggerClick, trigger).on());
+        CleanupRegistry.register(this, onoff([
+            { types: 'click', listener: this.#handleDialogClick },
+            { types: 'close', listener: this.#handleDialogClose },
+            { types: 'cancel', listener: this.#handleDialogCancel },
+        ], this.#dialog).on());
+        CleanupRegistry.register(this, onoff(touchGlass(this, (t) => t, ({ target }) => {
+            if (!(target instanceof HTMLElement))
+                return true;
+            if (target.matches('menu-view'))
+                return false;
+            if (!target.closest('menu-view[open]'))
+                return false;
+            return true;
+        }), this).on());
+        const newAnchorName = `--menu-view-${self.crypto.randomUUID()}`;
+        const summaryPart = this.#shadowRoot.querySelector('[part*=menu-summary]'), dialogPart = this.#shadowRoot.querySelector('[part*=menu-dialog]');
+        summaryPart?.style.setProperty('anchor-name', newAnchorName, 'important'); // override unset:all // $.prop('anchor-name', newAnchorName, summaryPart, 'important') //
+        dialogPart?.style.setProperty('position-anchor', newAnchorName); // $.prop('position-anchor', newAnchorName, dialogPart) //
+    }
     #handleDialogClick = ({ type, target }) => {
         if (devFlags.debug)
             console.debug(`${_a.name} ⚡️ ${type}`);
-        if (!(target instanceof HTMLElement && target))
+        if (!(target instanceof HTMLElement))
             return;
         if (target.matches('dialog'))
             return this.toggleAttribute('open', false); // click outside

package/generated/components/navigation-split-view.d.ts

@@ -4,7 +4,7 @@ import { NavigationView } from '../internal/class/navigation-view';
  */
 export declare class NavigationSplitView extends NavigationView {
     constructor();
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     disconnectedCallback(): void;
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }

package/generated/components/navigation-split-view.js

@@ -7,6 +7,11 @@ export class NavigationSplitView extends NavigationView {
     constructor() {
         super();
     }
+    attributeChangedCallback(name, oldValue, newValue) {
+        if (devFlags.debug)
+            console.debug(`${NavigationSplitView.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
+        super.attributeChangedCallback(name, oldValue, newValue);
+    }
     disconnectedCallback() {
         if (devFlags.debug)
             console.debug(`${NavigationSplitView.name} ⚡️ disconnect`);
@@ -17,9 +22,4 @@ export class NavigationSplitView extends NavigationView {
             console.debug(`${NavigationSplitView.name} ⚡️ connect`);
         super.connectedCallback();
     }
-    attributeChangedCallback(name, oldValue, newValue) {
-        if (devFlags.debug)
-            console.debug(`${NavigationSplitView.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
-        super.attributeChangedCallback(name, oldValue, newValue);
-    }
 }

package/generated/components/navigation-stack.d.ts

@@ -4,7 +4,7 @@ import { NavigationView } from '../internal/class/navigation-view';
  */
 export declare class NavigationStack extends NavigationView {
     constructor();
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     disconnectedCallback(): void;
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }

package/generated/components/navigation-stack.js

@@ -7,16 +7,6 @@ export class NavigationStack extends NavigationView {
     constructor() {
         super();
     }
-    disconnectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${NavigationStack.name} ⚡️ disconnect`);
-        super.disconnectedCallback();
-    }
-    connectedCallback() {
-        if (devFlags.debug)
-            console.debug(`${NavigationStack.name} ⚡️ connect`);
-        super.connectedCallback();
-    }
     attributeChangedCallback(name, oldValue, newValue) {
         if (devFlags.debug)
             console.debug(`${NavigationStack.name} ⚡️ attr-change [${name}] ("${oldValue}" → "${newValue}")`);
@@ -28,4 +18,14 @@ export class NavigationStack extends NavigationView {
         }
         // })
     }
+    disconnectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${NavigationStack.name} ⚡️ disconnect`);
+        super.disconnectedCallback();
+    }
+    connectedCallback() {
+        if (devFlags.debug)
+            console.debug(`${NavigationStack.name} ⚡️ connect`);
+        super.connectedCallback();
+    }
 }

package/generated/components/navigation-title.d.ts

@@ -2,7 +2,7 @@ export declare class NavigationTitle extends HTMLElement {
     #private;
     static get observedAttributes(): string[];
     constructor();
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     disconnectedCallback(): void;
     connectedCallback(): void;
-    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
 }