@ajuarezso/sui-design-system 0.9.0 → 0.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ajuarezso/sui-design-system",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "SUI Design System — librería de componentes Angular (SUI 2.0).",
   "license": "UNLICENSED",
   "publishConfig": {

package/types/ajuarezso-sui-design-system.d.ts

@@ -9248,10 +9248,18 @@ declare class SuiSidebar {
      * Default false.
      */
     readonly profileDropdown: _angular_core.InputSignal<boolean>;
-    /** Estado open/closed (en mobile = drawer visible o no). 2-way binding. */
-    readonly open: _angular_core.ModelSignal<boolean>;
-    /** Cerrar el drawer al click en un nav item. Default true. */
-    readonly closeOnNavigate: _angular_core.InputSignal<boolean>;
+    /**
+     * Estado open/closed del drawer móvil (≤767px). 2-way binding:
+     * `[(mobileOpen)]="menuOpen"`. El componente lo setea a false al click en
+     * el backdrop, al presionar Escape y (si closeOnItemClick) al click en un
+     * nav item. En desktop no afecta el layout (el sidebar es fijo siempre).
+     */
+    readonly mobileOpen: _angular_core.ModelSignal<boolean>;
+    /**
+     * Cerrar el drawer móvil al click en un nav item (itemClicked). Solo aplica
+     * en móvil (≤767px) — en desktop el click nunca cierra. Default true.
+     */
+    readonly closeOnItemClick: _angular_core.InputSignal<boolean>;
     /** Mostrar el backdrop overlay (mobile drawer). Default true. */
     readonly showBackdrop: _angular_core.InputSignal<boolean>;
     /**
@@ -9274,6 +9282,14 @@ declare class SuiSidebar {
     readonly profileClicked: _angular_core.OutputEmitterRef<void>;
     /** Submit del search input (Enter). Emite el valor actual. */
     readonly searchSubmitted: _angular_core.OutputEmitterRef<string>;
+    private readonly destroyRef;
+    /**
+     * Viewport móvil (≤767px — canon bp.medium del proyecto). Gatea el backdrop,
+     * el aria-hidden/inert del drawer cerrado, el Escape y el auto-close por
+     * item click, para que mobileOpen sea inocuo en desktop. SSR-safe.
+     */
+    protected readonly isMobile: _angular_core.WritableSignal<boolean>;
+    constructor();
     /** Brand normalizado — nunca null para simplificar los binds del template. */
     protected readonly brandCfg: _angular_core.Signal<SuiSidebarBrandConfig>;
     /**
@@ -9291,6 +9307,8 @@ declare class SuiSidebar {
     protected readonly resolvedActiveValue: _angular_core.Signal<string | null>;
     protected onItemClick(item: SuiSidebarItem, ev: Event): void;
     protected onBackdropClick(): void;
+    /** Escape cierra el drawer móvil (a11y). No-op en desktop o ya cerrado. */
+    protected onEscapeKey(): void;
     /** Helper para template — class binding del item activo cuando NO hay route */
     protected isItemActive(item: SuiSidebarItem): boolean;
     protected onHeaderButtonClick(ev: Event): void;
@@ -9298,7 +9316,7 @@ declare class SuiSidebar {
     protected onSearchInput(value: string): void;
     protected onSearchSubmit(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SuiSidebar, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSidebar, "sui-sidebar", never, { "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "indicatorColor": { "alias": "indicatorColor"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "showHeaderButton": { "alias": "showHeaderButton"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "searchValue": { "alias": "searchValue"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "secondaryItems": { "alias": "secondaryItems"; "required": false; "isSignal": true; }; "supportingItems": { "alias": "supportingItems"; "required": false; "isSignal": true; }; "supportingAnchorBottom": { "alias": "supportingAnchorBottom"; "required": false; "isSignal": true; }; "itemsLabel": { "alias": "itemsLabel"; "required": false; "isSignal": true; }; "secondaryItemsLabel": { "alias": "secondaryItemsLabel"; "required": false; "isSignal": true; }; "supportingItemsLabel": { "alias": "supportingItemsLabel"; "required": false; "isSignal": true; }; "activeRoute": { "alias": "activeRoute"; "required": false; "isSignal": true; }; "profile": { "alias": "profile"; "required": false; "isSignal": true; }; "profileDropdown": { "alias": "profileDropdown"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; "closeOnNavigate": { "alias": "closeOnNavigate"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mobileMode": { "alias": "mobileMode"; "required": false; "isSignal": true; }; }, { "searchValue": "searchValueChange"; "open": "openChange"; "itemClicked": "itemClicked"; "logoutClicked": "logoutClicked"; "backdropClicked": "backdropClicked"; "headerButtonClicked": "headerButtonClicked"; "profileClicked": "profileClicked"; "searchSubmitted": "searchSubmitted"; }, never, ["[feature-card]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SuiSidebar, "sui-sidebar", never, { "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "indicatorColor": { "alias": "indicatorColor"; "required": false; "isSignal": true; }; "brand": { "alias": "brand"; "required": false; "isSignal": true; }; "showHeaderButton": { "alias": "showHeaderButton"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "searchValue": { "alias": "searchValue"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "secondaryItems": { "alias": "secondaryItems"; "required": false; "isSignal": true; }; "supportingItems": { "alias": "supportingItems"; "required": false; "isSignal": true; }; "supportingAnchorBottom": { "alias": "supportingAnchorBottom"; "required": false; "isSignal": true; }; "itemsLabel": { "alias": "itemsLabel"; "required": false; "isSignal": true; }; "secondaryItemsLabel": { "alias": "secondaryItemsLabel"; "required": false; "isSignal": true; }; "supportingItemsLabel": { "alias": "supportingItemsLabel"; "required": false; "isSignal": true; }; "activeRoute": { "alias": "activeRoute"; "required": false; "isSignal": true; }; "profile": { "alias": "profile"; "required": false; "isSignal": true; }; "profileDropdown": { "alias": "profileDropdown"; "required": false; "isSignal": true; }; "mobileOpen": { "alias": "mobileOpen"; "required": false; "isSignal": true; }; "closeOnItemClick": { "alias": "closeOnItemClick"; "required": false; "isSignal": true; }; "showBackdrop": { "alias": "showBackdrop"; "required": false; "isSignal": true; }; "mobileMode": { "alias": "mobileMode"; "required": false; "isSignal": true; }; }, { "searchValue": "searchValueChange"; "mobileOpen": "mobileOpenChange"; "itemClicked": "itemClicked"; "logoutClicked": "logoutClicked"; "backdropClicked": "backdropClicked"; "headerButtonClicked": "headerButtonClicked"; "profileClicked": "profileClicked"; "searchSubmitted": "searchSubmitted"; }, never, ["[feature-card]"], true, never>;
 }
 
 /**