@waggylabs/yumekit 0.4.3-beta.49 → 0.4.4

package/CHANGELOG.md

@@ -31,6 +31,38 @@ Delete any empty sections before publishing.
 <!-- ### Security -->
 <!-- Vulnerability patches or hardening changes -->
 
+## [0.4.4] - 2026-04-25
+
+### Fixed
+
+- `y-badge`: slotted children would disappear when the badge was upgraded before its children were parsed (e.g. when `y-badge.js` loaded before the tag appeared in the HTML stream). The shadow DOM now always includes a `<slot>` and toggles overlay vs. inline layout via a `slotchange`-driven class on an internal root element, so children projected in after upgrade are always picked up. Knock-on: text-only and comment-only children no longer trigger overlay mode (only element children do). This matches how the component is actually used in practice.
+
+### Added
+
+- `y-appbar`: the default (unnamed) slot now lets consumers supply their own link elements (e.g. Vue Router's `<router-link>`, React Router's `<NavLink>`, plain `<a>`) in place of — or in addition to — the auto-generated `y-button` items. Unslotted children render in the appbar body after any items from the `items` attribute, get full-width treatment in vertical mode, and are hidden-overflow when collapsed. In mobile (hamburger) mode the same slot is rendered inside the dropdown panel below the items, preserving the desktop priority order.
+
+- `y-menu`: items now accept `href` for navigation, matching `y-appbar`, `y-dock`, and `y-breadcrumbs`. This fixes a bug where `y-appbar` submenu items (which use `href`) would not navigate when passed through to a nested `y-menu`.
+
+- `y-menu`: new lifecycle and selection events. `open` and `close` fire on visibility transitions. `select` fires when a leaf item is activated, carrying `detail: { value, item?, element? }` so consumers can react without subscribing to `navigate`.
+
+- `y-menu`: items support a new `value` field, used as `event.detail.value` on the `select` event. Defaults to `item.text` when omitted.
+
+- `y-menu`: items support a new `icon` field (icon name passed to `<y-icon>`), bringing y-menu in line with `y-appbar`, `y-dock`, and other components that render named icons.
+
+- `y-menu`: items support a new `slot` field that names a slot in the menu's light DOM whose content replaces that item's default content (matching the `y-appbar` per-item slot pattern).
+
+- `y-menu`: light-DOM children placed directly inside `<y-menu>` (without a `slot` attribute) are now treated as additional menu items. Each child receives `role="menuitem"` and `tabindex="0"` automatically, and clicking fires the `select` event with `detail.value` derived from `data-value` or `textContent`.
+
+### Changed
+
+- `y-appbar`: mobile hamburger menu replaced its internal `y-menu` with a self-contained dropdown panel so it can host both auto-generated nav buttons and arbitrary slotted nav children. Behaviour is otherwise unchanged — items still drive the menu, the hamburger toggles open/closed, and clicks outside the appbar dismiss the panel.
+
+### Deprecated
+
+- `y-menu`: `item.url` is deprecated in favour of `item.href`. Existing code keeps working and emits a one-time console warning per page load; `url` will be removed in a future release.
+
+- `y-menu`: `item.template` and `item['icon-template']` are deprecated in favour of `item.slot` (named slot for custom item content) and `item.icon` (icon name). Existing code keeps working and emits a one-time console warning per page load; the template fields will be removed in a future release.
+
 ## [0.4.3] - 2026-04-17
 
 ### Added

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

@@ -5,12 +5,19 @@ export class YumeAppbar extends HTMLElement {
     _idCounter: number;
     _mql: MediaQueryList;
     _isMobile: boolean;
+    _mobileOutsideClick: (e: any) => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     attributeChangedCallback(name: any, oldVal: any, newVal: any): void;
     set collapsed(val: boolean);
     /** Whether the sidebar is currently collapsed. */
     get collapsed(): boolean;
+    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 items(val: any);
     /** Nav items array parsed from the "items" attribute. */
     get items(): any;
@@ -34,33 +41,33 @@ export class YumeAppbar extends HTMLElement {
     set size(val: string);
     /** Size variant: "small" | "medium" | "large" (default "medium"). */
     get size(): 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 sticky(val: string | false);
     /** Sticky position: "start" | "end" | false. */
     get sticky(): string | false;
+    render(): void;
     /** Toggles the collapsed state of the sidebar. */
     toggle(): void;
-    render(): void;
+    _buildBody(cfg: any, isCollapsed: any, menuDir: any): HTMLElement;
     _buildCollapseButton(cfg: any, isCollapsed: any): HTMLElement;
-    _buildHeader(): HTMLDivElement;
-    _buildNavItem(item: any, cfg: any, isVertical: any, isCollapsed: any, menuDir: any): HTMLDivElement;
+    _buildDesktopBar(cfg: any, isVertical: any, isCollapsed: any, menuDir: any): HTMLElement;
+    _buildDesktopStyles(): string;
+    _buildFooter(cfg: any, isVertical: any, isCollapsed: any): HTMLElement;
+    _buildHeader(): HTMLElement;
+    _buildItemIcon(iconValue: any, cfg: any): HTMLElement;
+    _buildMobileBar(cfg: any): HTMLElement;
+    _buildMobileCenter(): HTMLElement;
+    _buildMobileEnd(): HTMLElement;
+    _buildMobileStart(cfg: any): HTMLElement;
+    _buildMobileStyles(): string;
+    _buildNavItem(item: any, cfg: any, isCollapsed: any, menuDir: any): HTMLElement;
     _getBreakpointPx(): number;
     _initRender(): void;
     _isItemActive(item: any): boolean;
-    _makeSlot(name: any): HTMLSlotElement;
+    _navigateTo(href: any): void;
     _renderDesktop(): void;
     _renderMobile(): void;
     _setupMediaQuery(): void;
     _teardownMediaQuery(): void;
-    /**
-     * Convert appbar nav items to y-menu item format.
-     * Maps `href` → `url` and recursively converts children.
-     */
-    _toMenuItems(items: any): any;
+    _teardownMobileOutsideClick(): void;
     _uid(prefix: any): string;
 }

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

@@ -5,12 +5,19 @@ export class YumeAppbar extends HTMLElement {
     _idCounter: number;
     _mql: MediaQueryList;
     _isMobile: boolean;
+    _mobileOutsideClick: (e: any) => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     attributeChangedCallback(name: any, oldVal: any, newVal: any): void;
     set collapsed(val: boolean);
     /** Whether the sidebar is currently collapsed. */
     get collapsed(): boolean;
+    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 items(val: any);
     /** Nav items array parsed from the "items" attribute. */
     get items(): any;
@@ -34,33 +41,33 @@ export class YumeAppbar extends HTMLElement {
     set size(val: string);
     /** Size variant: "small" | "medium" | "large" (default "medium"). */
     get size(): 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 sticky(val: string | false);
     /** Sticky position: "start" | "end" | false. */
     get sticky(): string | false;
+    render(): void;
     /** Toggles the collapsed state of the sidebar. */
     toggle(): void;
-    render(): void;
+    _buildBody(cfg: any, isCollapsed: any, menuDir: any): HTMLElement;
     _buildCollapseButton(cfg: any, isCollapsed: any): HTMLElement;
-    _buildHeader(): HTMLDivElement;
-    _buildNavItem(item: any, cfg: any, isVertical: any, isCollapsed: any, menuDir: any): HTMLDivElement;
+    _buildDesktopBar(cfg: any, isVertical: any, isCollapsed: any, menuDir: any): HTMLElement;
+    _buildDesktopStyles(): string;
+    _buildFooter(cfg: any, isVertical: any, isCollapsed: any): HTMLElement;
+    _buildHeader(): HTMLElement;
+    _buildItemIcon(iconValue: any, cfg: any): HTMLElement;
+    _buildMobileBar(cfg: any): HTMLElement;
+    _buildMobileCenter(): HTMLElement;
+    _buildMobileEnd(): HTMLElement;
+    _buildMobileStart(cfg: any): HTMLElement;
+    _buildMobileStyles(): string;
+    _buildNavItem(item: any, cfg: any, isCollapsed: any, menuDir: any): HTMLElement;
     _getBreakpointPx(): number;
     _initRender(): void;
     _isItemActive(item: any): boolean;
-    _makeSlot(name: any): HTMLSlotElement;
+    _navigateTo(href: any): void;
     _renderDesktop(): void;
     _renderMobile(): void;
     _setupMediaQuery(): void;
     _teardownMediaQuery(): void;
-    /**
-     * Convert appbar nav items to y-menu item format.
-     * Maps `href` → `url` and recursively converts children.
-     */
-    _toMenuItems(items: any): any;
+    _teardownMobileOutsideClick(): void;
     _uid(prefix: any): string;
 }