@neuravision/ng-construct 0.2.0 → 0.3.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neuravision/ng-construct",
-  "version": "0.2.0",
+  "version": "0.3.1",
   "description": "Angular components for the Construct Design System",
   "keywords": [
     "angular",
@@ -11,6 +11,7 @@
   "peerDependencies": {
     "@angular/common": "^21.1.0",
     "@angular/core": "^21.1.0",
+    "@angular/router": "^21.1.0",
     "@neuravision/construct": "^1.0.0"
   },
   "dependencies": {

package/types/neuravision-ng-construct.d.ts

@@ -1689,17 +1689,25 @@ declare class AfSelectMenuComponent implements ControlValueAccessor {
 type AfNavbarSize = 'sm' | 'md' | 'lg';
 type AfNavbarVariant = 'default' | 'sticky' | 'fixed' | 'elevated' | 'transparent' | 'dark' | 'bordered';
 /**
- * Individual navigation item used within af-navbar.
+ * Individual navigation item used within af-navbar or af-toolbar.
+ *
+ * Supports Angular Router via `routerLink`, standard links via `href`,
+ * and button mode when neither is provided. Content projection allows
+ * icons and custom markup inside the link.
  *
  * @example
- * <af-nav-item label="Dashboard" href="/dashboard" [active]="true" />
+ * <af-nav-item label="Dashboard" routerLink="/dashboard">
+ *   <af-icon name="dashboard" /> Dashboard
+ * </af-nav-item>
  */
 declare class AfNavItemComponent {
-    /** Text label for the navigation item. */
+    /** Text label shown as fallback when no content is projected. Also used by the mobile menu. */
     label: _angular_core.InputSignal<string>;
     /** URL for the navigation link. Renders as `<a>` when provided, `<button>` otherwise. */
     href: _angular_core.InputSignal<string>;
-    /** Marks this item as the currently active page. */
+    /** Angular Router link. Renders as `<a>` with routerLink and auto-active detection. */
+    routerLink: _angular_core.InputSignal<string | string[] | null>;
+    /** Marks this item as the currently active page (used for href/button mode, routerLink auto-detects). */
     active: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Disables interaction with this item. */
     disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -1712,7 +1720,7 @@ declare class AfNavItemComponent {
     focusLink(): void;
     onClick(event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfNavItemComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfNavItemComponent, "af-nav-item", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfNavItemComponent, "af-nav-item", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "routerLink": { "alias": "routerLink"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, ["*", "*", "*"], true, never>;
 }
 /**
  * Responsive navbar with mobile menu, keyboard navigation, and ARIA landmarks.
@@ -1720,8 +1728,10 @@ declare class AfNavItemComponent {
  * @example
  * <af-navbar ariaLabel="Main navigation">
  *   <a brand class="ct-navbar__brand" href="/">My App</a>
- *   <af-nav-item label="Dashboard" href="/dashboard" [active]="true" />
- *   <af-nav-item label="Settings" href="/settings" />
+ *   <af-nav-item label="Dashboard" routerLink="/dashboard">
+ *     <af-icon name="dashboard" /> Dashboard
+ *   </af-nav-item>
+ *   <af-nav-item label="Settings" routerLink="/settings" />
  *   <button actions class="ct-button">Profile</button>
  * </af-navbar>
  */