@waggylabs/yumekit 0.4.3 → 0.4.4

package/dist/components/y-badge/y-badge.d.ts

@@ -1,5 +1,6 @@
 export class YumeBadge extends HTMLElement {
     static get observedAttributes(): string[];
+    _onSlotChange(): void;
     connectedCallback(): void;
     attributeChangedCallback(name: any, oldValue: any, newValue: any): void;
     set alignment(val: string);
@@ -21,5 +22,4 @@ export class YumeBadge extends HTMLElement {
     _getBadgeColors(color: any): any;
     _getBadgePosition(position: any, alignment: any): string;
     _getSizeAttributes(size: any): any;
-    _hasTargetContent(): boolean;
 }

package/dist/components/y-badge.d.ts

@@ -1,5 +1,6 @@
 export class YumeBadge extends HTMLElement {
     static get observedAttributes(): string[];
+    _onSlotChange(): void;
     connectedCallback(): void;
     attributeChangedCallback(name: any, oldValue: any, newValue: any): void;
     set alignment(val: string);
@@ -21,5 +22,4 @@ export class YumeBadge extends HTMLElement {
     _getBadgeColors(color: any): any;
     _getBadgePosition(position: any, alignment: any): string;
     _getSizeAttributes(size: any): any;
-    _hasTargetContent(): boolean;
 }

package/dist/components/y-badge.js

@@ -12,6 +12,7 @@ class YumeBadge extends HTMLElement {
     constructor() {
         super();
         this.attachShadow({ mode: "open" });
+        this._onSlotChange = this._onSlotChange.bind(this);
         this.render();
     }
 
@@ -54,21 +55,24 @@ class YumeBadge extends HTMLElement {
     render() {
         const [badgeColor, badgeTextColor] = this._getBadgeColors(this.color);
         const { fontSize, padding, minSize } = this._getSizeAttributes(this.size);
-        const hasTarget = this._hasTargetContent();
-        const positionCSS = hasTarget
-            ? this._getBadgePosition(this.position, this.alignment)
-            : "";
+        const positionCSS = this._getBadgePosition(this.position, this.alignment);
 
         this.shadowRoot.innerHTML = `
             <style>
                 :host {
-                    position: ${hasTarget ? "relative" : "static"};
                     display: inline-flex;
                     align-items: center;
                 }
+                .root {
+                    position: static;
+                    display: inline-flex;
+                    align-items: center;
+                }
+                .root.has-target {
+                    position: relative;
+                }
                 .badge {
-                    position: ${hasTarget ? "absolute" : "static"};
-                    ${positionCSS}
+                    position: static;
                     background: ${badgeColor};
                     color: ${badgeTextColor};
                     font-size: ${fontSize};
@@ -83,14 +87,24 @@ class YumeBadge extends HTMLElement {
                     height: ${minSize};
                     z-index: 20;
                 }
+                .root.has-target .badge {
+                    position: absolute;
+                    ${positionCSS}
+                }
                 ::slotted(*) {
                     position: relative;
                     display: inline-block;
                 }
             </style>
-            ${hasTarget ? "<slot></slot>" : ""}
-            <div class="badge" part="badge">${this.value}</div>
+            <div class="root" part="root">
+                <slot></slot>
+                <div class="badge" part="badge">${this.value}</div>
+            </div>
         `;
+
+        const slot = this.shadowRoot.querySelector("slot");
+        slot.addEventListener("slotchange", this._onSlotChange);
+        this._onSlotChange();
     }
 
     // -------------------------------------------------------------------------
@@ -142,12 +156,14 @@ class YumeBadge extends HTMLElement {
         return sizeMap[size] || sizeMap.small;
     }
 
-    _hasTargetContent() {
-        return Array.from(this.childNodes).some((node) => {
-            if (node.nodeType === Node.ELEMENT_NODE) return true;
-            if (node.nodeType === Node.TEXT_NODE) return node.textContent.trim() !== "";
-            return false;
-        });
+    _onSlotChange() {
+        const slot = this.shadowRoot.querySelector("slot");
+        const root = this.shadowRoot.querySelector(".root");
+        if (!slot || !root) return;
+        const hasElement = slot
+            .assignedNodes({ flatten: true })
+            .some((n) => n.nodeType === Node.ELEMENT_NODE);
+        root.classList.toggle("has-target", hasElement);
     }
 }
 

package/dist/components/y-menu/y-menu.d.ts

@@ -1 +1,57 @@
-export {};
+export class YumeMenu extends HTMLElement {
+    static get observedAttributes(): string[];
+    static _closeAll(except: any): void;
+    static _warnTemplateFieldDeprecated(): void;
+    static _warnUrlDeprecated(): void;
+    _onAnchorClick(e: any): void;
+    _onDocumentClick(e: any): void;
+    _onScrollOrResize(): void;
+    _isReady: boolean;
+    _slottedHandlers: Map<any, any>;
+    connectedCallback(): void;
+    set items(val: any);
+    /** Menu items array (JSON attribute). */
+    get items(): any;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: any, oldVal: any, newVal: any): void;
+    set anchor(val: string);
+    /** Which anchor element ID triggers this menu. */
+    get anchor(): string;
+    set direction(val: string);
+    /** Direction for menu placement: "down" | "up" | "left" | "right" (default "down"). */
+    get direction(): string;
+    set history(val: string);
+    /**
+     * Navigation mode: omit for pushState (SPA-friendly), set to "false" for full-page navigation.
+     * Regardless of this setting, a cancelable "navigate" event is always dispatched first.
+     */
+    get history(): string;
+    set size(val: string);
+    /** Size: "small" | "medium" | "large" (default "medium"). */
+    get size(): string;
+    set visible(val: boolean);
+    /** Whether the menu is currently visible. */
+    get visible(): boolean;
+    render(): void;
+    _activateItem(item: any): void;
+    _activateSlottedItem(el: any): void;
+    _buildStyles(): string;
+    _computeMenuOffset(direction: any, anchorRect: any, menuRect: any, vw: any, vh: any): {
+        top: any;
+        left: any;
+    };
+    _createItemContent(item: any): HTMLElement;
+    _createMenuItem(item: any): HTMLElement;
+    _createMenuList(items: any): HTMLElement;
+    _createSubmenuIndicator(): HTMLElement;
+    _dispatchSelect(detail: any): void;
+    _findTemplate(name: any): Element;
+    _navigateTo(href: any): void;
+    _processSlottedItems(): void;
+    _setupAnchor(): void;
+    _anchorResolveDispose: () => void;
+    _anchorEl: HTMLElement;
+    _teardownAnchor(): void;
+    _teardownSlottedItems(): void;
+    _updatePosition(): void;
+}

package/dist/components/y-menu.d.ts

@@ -1 +1,57 @@
-export {};
+export class YumeMenu extends HTMLElement {
+    static get observedAttributes(): string[];
+    static _closeAll(except: any): void;
+    static _warnTemplateFieldDeprecated(): void;
+    static _warnUrlDeprecated(): void;
+    _onAnchorClick(e: any): void;
+    _onDocumentClick(e: any): void;
+    _onScrollOrResize(): void;
+    _isReady: boolean;
+    _slottedHandlers: Map<any, any>;
+    connectedCallback(): void;
+    set items(val: any);
+    /** Menu items array (JSON attribute). */
+    get items(): any;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: any, oldVal: any, newVal: any): void;
+    set anchor(val: string);
+    /** Which anchor element ID triggers this menu. */
+    get anchor(): string;
+    set direction(val: string);
+    /** Direction for menu placement: "down" | "up" | "left" | "right" (default "down"). */
+    get direction(): string;
+    set history(val: string);
+    /**
+     * Navigation mode: omit for pushState (SPA-friendly), set to "false" for full-page navigation.
+     * Regardless of this setting, a cancelable "navigate" event is always dispatched first.
+     */
+    get history(): string;
+    set size(val: string);
+    /** Size: "small" | "medium" | "large" (default "medium"). */
+    get size(): string;
+    set visible(val: boolean);
+    /** Whether the menu is currently visible. */
+    get visible(): boolean;
+    render(): void;
+    _activateItem(item: any): void;
+    _activateSlottedItem(el: any): void;
+    _buildStyles(): string;
+    _computeMenuOffset(direction: any, anchorRect: any, menuRect: any, vw: any, vh: any): {
+        top: any;
+        left: any;
+    };
+    _createItemContent(item: any): HTMLElement;
+    _createMenuItem(item: any): HTMLElement;
+    _createMenuList(items: any): HTMLElement;
+    _createSubmenuIndicator(): HTMLElement;
+    _dispatchSelect(detail: any): void;
+    _findTemplate(name: any): Element;
+    _navigateTo(href: any): void;
+    _processSlottedItems(): void;
+    _setupAnchor(): void;
+    _anchorResolveDispose: () => void;
+    _anchorEl: HTMLElement;
+    _teardownAnchor(): void;
+    _teardownSlottedItems(): void;
+    _updatePosition(): void;
+}