@nonoun/native-dashboard 0.4.8 → 0.4.11

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+import { NSidebarNav } from './sidebar/sidebar-nav-element.ts';
+import { NSidebarNavItem } from './sidebar/sidebar-nav-item-element.ts';
+import { NSidebarGroup } from './sidebar/sidebar-group-element.ts';
+import { NSidebarGroupHeader } from './sidebar/sidebar-group-header-element.ts';
+import { NSidebar } from './sidebar/sidebar-element.ts';
+import { NSidebarItem } from './sidebar/sidebar-item-element.ts';
+export { NSidebarNav, NSidebarNavItem, NSidebarGroup, NSidebarGroupHeader, NSidebar, NSidebarItem };
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAcjE,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EAAE,mBAAmB,EAChE,QAAQ,EAAE,YAAY,EAAE,CAAC"}

package/dist/native-dashboard.css

@@ -8,7 +8,7 @@
   :where(n-sidebar-nav-item):not(:defined) { visibility: hidden; }
 
   /* ╭──────────────────────────────────────────────────────────╮
-     │  native-app                                         │
+     │  native-app                                              │
      │  Full-page layout: collapsible/resizable sidebar aside   │
      │  + content column (breadcrumb, canvas, body, chat).      │
      ╰──────────────────────────────────────────────────────────╯ */
@@ -201,52 +201,27 @@
   :where(native-app) :where(section.content) > :where(main) > :where(header),
   :where(native-app) :where(section.content) > :where(main) > :where(section),
   :where(native-app) :where(section.content) > :where(main) > :where(footer) {
-    padding: var(--n-dashboard-panel-content-padding, 0);
     box-sizing: border-box;
   }
 
-  :where(native-app) :where(section.content) > :where(main):has(> header, > footer) {
-    overflow: hidden;
-  }
-
-  :where(native-app) :where(section.content) > :where(main):has(> header, > footer) > :where(section) {
-    flex: 1 1 0%;
-    min-height: 0;
-    overflow-y: auto;
-    scrollbar-width: none;
-    display: flex;
-    flex-direction: column;
-    gap: var(--n-dashboard-panel-content-gap, 0);
-  }
-
-  :where(native-app) :where(section.content) > :where(main)[show-scrollbar] > :where(section) {
-    scrollbar-width: thin;
-  }
-
   :where(native-app) :where(section.content) > :where(main) > :where(header) {
-    flex: none;
+    position: sticky;
+    top: 0;
     border-bottom: 1px solid var(--n-border-muted);
     background: var(--n-ground);
     z-index: 1;
   }
 
   :where(native-app) :where(section.content) > :where(main) > :where(footer) {
-    flex: none;
+    position: sticky;
+    bottom: 0;
     border-top: 1px solid var(--n-border-muted);
     background: var(--n-ground);
   }
 
-  /* Content max-width centering (same as dashboard-panel.css semantic selectors) */
-  :where(native-app) :where(section.content) > :where(main) > :where(header) > *,
-  :where(native-app) :where(section.content) > :where(main) > :where(section) > *,
-  :where(native-app) :where(section.content) > :where(main) > :where(footer) > * {
-    max-width: var(--n-dashboard-panel-content-max-width, none);
-    width: 100%;
-    margin-inline: auto;
-  }
 
   /* Aside panel — semantic equivalent of n-dashboard-panel[aside] */
-  :where(native-app) :where(section.content) > :where(aside) {
+  :where(native-app) :where(section.content) > :where(n-aside) {
     --n-ground: var(--n-panel);
 
     position: relative;
@@ -265,7 +240,7 @@
       margin var(--n-duration) var(--n-easing);
   }
 
-  :where(native-app) :where(section.content) > :where(aside)[open] {
+  :where(native-app) :where(section.content) > :where(n-aside)[open] {
     width: var(--n-aside-width, 360px);
     min-width: var(--n-aside-min-width, 280px);
     margin-inline-start: calc(var(--n-space-k) * var(--n-space));
@@ -275,18 +250,18 @@
 
   /* WHY: When n-chat manages its own sub-container padding and scroll,
      the layout container delegates — no own padding, no own scroll. */
-  :where(native-app) :where(section.content) > :where(aside)[open]:has(> n-chat) {
+  :where(native-app) :where(section.content) > :where(n-aside)[open]:has(> n-chat) {
     padding: 0;
     overflow: visible;
   }
 
   /* WHY: Disable width transition while dragging — it fights the pointer. */
-  :where(native-app) :where(section.content) > :where(aside)[resizing] {
+  :where(native-app) :where(section.content) > :where(n-aside)[resizing] {
     transition: none;
   }
 
   /* Aside resize handle */
-  :where(native-app) :where(section.content) > :where(aside) :where(.layout-resize-handle) {
+  :where(native-app) :where(section.content) > :where(n-aside) :where(.layout-resize-handle) {
     position: absolute;
     top: 0;
     left: 0;
@@ -296,15 +271,12 @@
     z-index: 1;
   }
 
-  :where(native-app) :where(section.content) > :where(aside) :where(.layout-resize-handle):hover,
-  :where(native-app) :where(section.content) > :where(aside)[resizing] :where(.layout-resize-handle) {
+  :where(native-app) :where(section.content) > :where(n-aside) :where(.layout-resize-handle):hover,
+  :where(native-app) :where(section.content) > :where(n-aside)[resizing] :where(.layout-resize-handle) {
     background: var(--n-border-muted);
   }
 
-  /* Collapsed padding — semantic selectors */
-  :where(native-app)[collapsed] :where(section.content) {
-    padding-inline-start: 0;
-  }
+  /* Collapsed — semantic selectors */
 
   :where(native-app)[collapsed] > :where(:not([slot])) > :where(nav) {
     padding-inline-start: 0;
@@ -1120,20 +1092,20 @@
   /* WHY: When n-body is present, delegate overflow to it so
      header/footer stay fixed while body scrolls. */
 
-  :where(n-dashboard-panel):has(> .body) {
+  :where(n-dashboard-panel):has(> n-body) {
     overflow: hidden;
     padding: 0;
   }
-  :where(n-dashboard-panel) > :where(.body) {
+  :where(n-dashboard-panel) > :where(n-body) {
     overflow-y: auto;
     scrollbar-width: none;
   }
 
-  :where(n-dashboard-panel) > :where(header) {
+  :where(n-dashboard-panel) > :where(n-header) {
     border-bottom: 1px solid var(--n-border-muted);
   }
 
-  :where(n-dashboard-panel) > :where(footer) {
+  :where(n-dashboard-panel) > :where(n-footer) {
     border-top: 1px solid var(--n-border-muted);
   }
 

package/dist/sidebar/sidebar-element.d.ts

@@ -0,0 +1,11 @@
+import { NativeElement } from '@nonoun/native-ui';
+/** Full-page layout with a resizable sidebar aside and content column.
+ *  Coordinates nav-group flyout popovers when the sidebar is collapsed. */
+export declare class NSidebar extends NativeElement {
+    #private;
+    static observedAttributes: string[];
+    attributeChangedCallback(name: string, old: string | null, val: string | null): void;
+    setup(): void;
+    teardown(): void;
+}
+//# sourceMappingURL=sidebar-element.d.ts.map

package/dist/sidebar/sidebar-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-element.d.ts","sourceRoot":"","sources":["../../src/sidebar/sidebar-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAoB,MAAM,mBAAmB,CAAC;AAGpE;2EAC2E;AAC3E,qBAAa,QAAS,SAAQ,aAAa;;IACzC,MAAM,CAAC,kBAAkB,WAAiB;IAS1C,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IASpF,KAAK,IAAI,IAAI;IAwCb,QAAQ,IAAI,IAAI;CAoGjB"}

package/dist/sidebar/sidebar-group-element.d.ts

@@ -0,0 +1,24 @@
+import { NativeElement } from '@nonoun/native-ui';
+/**
+ * Collapsible group of navigation items using native details/summary.
+ * Exposes `openFlyout()` / `closeFlyout()` for collapsed-sidebar mode —
+ * the sidebar layout coordinator decides *when* to call them.
+ * @attr {boolean} open - Whether the group is expanded
+ */
+export declare class NSidebarGroup extends NativeElement {
+    #private;
+    static observedAttributes: string[];
+    constructor();
+    /** Whether the flyout popover is currently open. */
+    get flyoutOpen(): boolean;
+    get open(): boolean;
+    set open(val: boolean);
+    attributeChangedCallback(name: string, old: string | null, val: string | null): void;
+    setup(): void;
+    teardown(): void;
+    /** Stamp n-option elements from child nav-items, open the flyout popover. */
+    openFlyout(): void;
+    /** Clear the flyout and close the popover. Returns focus to the summary. */
+    closeFlyout(): void;
+}
+//# sourceMappingURL=sidebar-group-element.d.ts.map

package/dist/sidebar/sidebar-group-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-group-element.d.ts","sourceRoot":"","sources":["../../src/sidebar/sidebar-group-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,aAAa,EAAqB,MAAM,mBAAmB,CAAC;AAE7E;;;;;GAKG;AACH,qBAAa,aAAc,SAAQ,aAAa;;IAC9C,MAAM,CAAC,kBAAkB,WAAY;;IAkBrC,oDAAoD;IACpD,IAAI,UAAU,IAAI,OAAO,CAExB;IAED,IAAI,IAAI,IAAI,OAAO,CAElB;IAED,IAAI,IAAI,CAAC,GAAG,EAAE,OAAO,EAGpB;IAED,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IAkEb,QAAQ,IAAI,IAAI;IA2ChB,6EAA6E;IAC7E,UAAU,IAAI,IAAI;IAuClB,4EAA4E;IAC5E,WAAW,IAAI,IAAI;CA+BpB"}

package/dist/sidebar/sidebar-group-header-element.d.ts

@@ -0,0 +1,7 @@
+import { NativeElement } from '@nonoun/native-ui';
+/** Non-interactive heading label for a navigation group. */
+export declare class NSidebarGroupHeader extends NativeElement {
+    constructor();
+    setup(): void;
+}
+//# sourceMappingURL=sidebar-group-header-element.d.ts.map

package/dist/sidebar/sidebar-group-header-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-group-header-element.d.ts","sourceRoot":"","sources":["../../src/sidebar/sidebar-group-header-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAO,MAAM,mBAAmB,CAAC;AAEvD,4DAA4D;AAC5D,qBAAa,mBAAoB,SAAQ,aAAa;;IAOpD,KAAK,IAAI,IAAI;CAgBd"}

package/dist/sidebar/sidebar-item-element.d.ts

@@ -0,0 +1,10 @@
+import { NativeElement } from '@nonoun/native-ui';
+/** Generic sidebar row wrapper. Passive by default — provides inline padding for
+ *  arbitrary content (buttons, links, custom elements). When a child
+ *  `n-listbox[popover]` is present, wires PopoverController for click-to-toggle. */
+export declare class NSidebarItem extends NativeElement {
+    #private;
+    setup(): void;
+    teardown(): void;
+}
+//# sourceMappingURL=sidebar-item-element.d.ts.map

package/dist/sidebar/sidebar-item-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-item-element.d.ts","sourceRoot":"","sources":["../../src/sidebar/sidebar-item-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAqB,MAAM,mBAAmB,CAAC;AAErE;;oFAEoF;AACpF,qBAAa,YAAa,SAAQ,aAAa;;IAI7C,KAAK,IAAI,IAAI;IAYb,QAAQ,IAAI,IAAI;CAmBjB"}

package/dist/sidebar/sidebar-nav-element.d.ts

@@ -0,0 +1,20 @@
+import { NativeElement } from '@nonoun/native-ui';
+/**
+ * Sidebar navigation with roving focus and selection indicator.
+ * @attr {string} value - Currently selected nav item value
+ * @attr {boolean} disabled - Disables all nav items
+ * @fires native:change - Fired when selection changes with `{ value, label }` detail
+ */
+export declare class NSidebarNav extends NativeElement {
+    #private;
+    static observedAttributes: string[];
+    constructor();
+    get value(): string | null;
+    set value(val: string | null);
+    get disabled(): boolean;
+    set disabled(val: boolean);
+    attributeChangedCallback(name: string, old: string | null, val: string | null): void;
+    setup(): void;
+    teardown(): void;
+}
+//# sourceMappingURL=sidebar-nav-element.d.ts.map

package/dist/sidebar/sidebar-nav-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav-element.d.ts","sourceRoot":"","sources":["../../src/sidebar/sidebar-nav-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAgE,MAAM,mBAAmB,CAAC;AAGhH;;;;;GAKG;AACH,qBAAa,WAAY,SAAQ,aAAa;;IAC5C,MAAM,CAAC,kBAAkB,WAAyB;;IAalD,IAAI,KAAK,IAAI,MAAM,GAAG,IAAI,CAA+C;IAEzE,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,EAO3B;IAED,IAAI,QAAQ,IAAI,OAAO,CAAiC;IACxD,IAAI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAA8B;IAEvD,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAYpF,KAAK,IAAI,IAAI;IAoCb,QAAQ,IAAI,IAAI;CAIjB"}

package/dist/sidebar/sidebar-nav-item-element.d.ts

@@ -0,0 +1,23 @@
+import { NativeElement } from '@nonoun/native-ui';
+/**
+ * Selectable navigation item within a nav component.
+ * @attr {string} value - Item value emitted on selection
+ * @attr {boolean} disabled - Disables this item
+ * @attr {string} label - Display label (falls back to text content)
+ * @fires native:select - Fired on click with `{ value, label }` detail
+ */
+export declare class NSidebarNavItem extends NativeElement {
+    #private;
+    static observedAttributes: string[];
+    constructor();
+    get value(): string;
+    set value(val: string);
+    get disabled(): boolean;
+    set disabled(val: boolean);
+    get label(): string;
+    set label(val: string);
+    attributeChangedCallback(name: string, old: string | null, val: string | null): void;
+    setup(): void;
+    teardown(): void;
+}
+//# sourceMappingURL=sidebar-nav-item-element.d.ts.map

package/dist/sidebar/sidebar-nav-item-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-nav-item-element.d.ts","sourceRoot":"","sources":["../../src/sidebar/sidebar-nav-item-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,aAAa,EAAwC,MAAM,mBAAmB,CAAC;AAGhG;;;;;;GAMG;AACH,qBAAa,eAAgB,SAAQ,aAAa;;IAChD,MAAM,CAAC,kBAAkB,WAAkC;;IAc3D,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,EAKpB;IAED,IAAI,QAAQ,IAAI,OAAO,CAAiC;IACxD,IAAI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAA8B;IAEvD,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,EASpB;IAED,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAiBpF,KAAK,IAAI,IAAI;IAQb,QAAQ,IAAI,IAAI;CAajB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nonoun/native-dashboard",
-  "version": "0.4.8",
+  "version": "0.4.11",
   "description": "Dashboard layout and navigation components for @nonoun/native-ui",
   "license": "MIT",
   "type": "module",