@zambon-dev/shared 1.0.1 → 1.1.0

package/lib/layouts/top-bar/index.d.ts

@@ -0,0 +1,5 @@
+export { BrandComponent } from './brand/brand.component';
+export { EnvironmentBadgeComponent } from './environment-badge/environment-badge.component';
+export { NotificationsComponent } from './notifications/notifications.component';
+export { TopBarComponent } from './top-bar.component';
+export { UserProfileComponent } from './user-profile/user-profile.component';

package/lib/layouts/top-bar/notifications/notifications.component.d.ts

@@ -0,0 +1,21 @@
+import { ElementRef, OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+import { INotification } from '../../../models';
+import * as i0 from "@angular/core";
+export declare class NotificationsComponent implements OnInit {
+    dropdown: ElementRef<HTMLDivElement>;
+    private notificationsService;
+    private router;
+    protected notifications$: Observable<INotification[]>;
+    protected showDropdown: boolean;
+    protected unreadCount$: Observable<number>;
+    /** Whether the notifications feature is enabled; when false the bell is not rendered. */
+    get isEnabled(): boolean;
+    ngOnInit(): void;
+    onDropdownClick(): void;
+    onMarkAllAsRead(): void;
+    onNotificationClick(notification: INotification): void;
+    private documentClick;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NotificationsComponent, "shared-notifications", never, {}, {}, never, never, true, never>;
+}

package/lib/layouts/top-bar/top-bar.component.d.ts

@@ -0,0 +1,9 @@
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class TopBarComponent {
+    /** Emitted when the logout button is clicked. */
+    logout: EventEmitter<void>;
+    onLogoutClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TopBarComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TopBarComponent, "shared-top-bar", never, {}, { "logout": "logout"; }, never, never, true, never>;
+}

package/lib/layouts/top-bar/user-profile/user-profile.component.d.ts

@@ -0,0 +1,15 @@
+import { OnInit } from '@angular/core';
+import { ICurrentUserInfo } from '../../../models';
+import * as i0 from "@angular/core";
+export declare class UserProfileComponent implements OnInit {
+    private authenticationService;
+    protected user: ICurrentUserInfo | null;
+    /** Up to two uppercase initials derived from the user's name, used when no picture is set. */
+    protected get initials(): string;
+    protected get name(): string;
+    protected get pictureUrl(): string | undefined;
+    protected get position(): string;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserProfileComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UserProfileComponent, "shared-user-profile", never, {}, {}, never, never, true, never>;
+}

package/lib/models/current-user-info.d.ts

@@ -1,4 +1,8 @@
 export interface ICurrentUserInfo {
     costCenterName: string;
     name: string;
+    /** Optional avatar image URL. Falls back to initials when absent. */
+    pictureUrl?: string;
+    /** Optional job position/title shown under the user name. Line is hidden when absent. */
+    position?: string;
 }

package/lib/models/index.d.ts

@@ -1,4 +1,5 @@
 export * from './auth-response';
 export * from './current-user-info';
+export * from './notification';
 export * from './operations-history';
 export * from './services-history';

package/lib/models/notification.d.ts

@@ -0,0 +1,12 @@
+export interface INotification {
+    /** Short heading for the notification. */
+    title: string;
+    /** Longer descriptive text. */
+    description: string;
+    /** Icon class shown next to the notification (e.g. a Font Awesome class like `fa-solid fa-envelope`). */
+    icon: string;
+    /** Optional call-to-action URL. When present, clicking the notification navigates to it. */
+    callToActionUrl?: string;
+    /** Whether the notification has been read. */
+    isRead: boolean;
+}

package/lib/services/index.d.ts

@@ -1,3 +1,4 @@
 export { AuthenticationService } from './authentication.service';
+export { NotificationsService } from './notifications.service';
 export { OperationsHistoryService } from './operations-history.service';
 export { ServicesHistoryService } from './services-history.service';

package/lib/services/notifications.service.d.ts

@@ -0,0 +1,33 @@
+import { Observable } from 'rxjs';
+import { INotification } from '../models';
+import * as i0 from "@angular/core";
+/**
+ * Streams top-bar notifications from a SignalR hub.
+ *
+ * The hub is configured via `AppConfig.notificationsEnabled` and `AppConfig.notificationsUrl`.
+ * When enabled, {@link start} opens a connection (authenticated with the current JWT) and
+ * listens for the server to push the notification list via the `ReceiveNotifications` client
+ * method. Consuming apps do not interact with this service directly — the top bar drives it.
+ */
+export declare class NotificationsService {
+    private authService;
+    private config;
+    private connection?;
+    private notifications$;
+    /** Whether the notifications feature is enabled (toggled on and given a hub URL). */
+    get isEnabled(): boolean;
+    /** Emits the current list of notifications. */
+    getNotifications(): Observable<INotification[]>;
+    /** Emits the number of unread notifications. */
+    getUnreadCount(): Observable<number>;
+    /** Marks every notification as read and notifies the hub. */
+    markAllAsRead(): void;
+    /** Marks a single notification as read (optimistically; the server reconciles on the next push). */
+    markAsRead(notification: INotification): void;
+    /** Opens the SignalR connection and starts receiving notifications. Idempotent and a no-op when disabled. */
+    start(): void;
+    /** Closes the SignalR connection. */
+    stop(): Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationsService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NotificationsService>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zambon-dev/shared",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "Shared Angular services, utilities, and styles for Zambon applications.",
   "keywords": [
     "angular",
@@ -27,9 +27,11 @@
     "@angular/forms": "^19.1.0",
     "@angular/router": "^19.1.0",
     "@auth0/angular-jwt": "^5.2.0",
+    "@microsoft/signalr": "^10.0.0",
     "@zambon-dev/framework": "^1.0.0",
     "@zambon-dev/library": "^1.0.0",
-    "@ngx-translate/core": "^16.0.4"
+    "@ngx-translate/core": "^16.0.4",
+    "ngx-translate-multi-http-loader": "^19.0.2"
   },
   "publishConfig": {
     "access": "public"
@@ -38,9 +40,35 @@
     "**/*.scss"
   ],
   "style": "styles/common.scss",
-  "module": "fesm2022/zambon-dev-shared.mjs",
-  "typings": "index.d.ts",
   "exports": {
+    "./styles": {
+      "sass": "./styles/common.scss",
+      "style": "./styles/common.scss",
+      "default": "./styles/common.scss"
+    },
+    "./styles/common": {
+      "sass": "./styles/common.scss",
+      "style": "./styles/common.scss",
+      "default": "./styles/common.scss"
+    },
+    "./styles/common.scss": {
+      "sass": "./styles/common.scss",
+      "style": "./styles/common.scss",
+      "default": "./styles/common.scss"
+    },
+    "./styles/variables": {
+      "sass": "./styles/variables.scss",
+      "style": "./styles/variables.scss",
+      "default": "./styles/variables.scss"
+    },
+    "./styles/variables.scss": {
+      "sass": "./styles/variables.scss",
+      "style": "./styles/variables.scss",
+      "default": "./styles/variables.scss"
+    },
+    "./i18n/*": {
+      "default": "./i18n/*"
+    },
     "./package.json": {
       "default": "./package.json"
     },
@@ -49,6 +77,8 @@
       "default": "./fesm2022/zambon-dev-shared.mjs"
     }
   },
+  "module": "fesm2022/zambon-dev-shared.mjs",
+  "typings": "index.d.ts",
   "dependencies": {
     "tslib": "^2.3.0"
   }

package/styles/common.scss

@@ -2,6 +2,7 @@
 @tailwind components;
 @tailwind utilities;
 
+@import 'variables';
 @import 'components/button';
 @import 'components/card';
 @import 'components/dropdown-static';

package/styles/variables.scss

@@ -0,0 +1,9 @@
+:root {
+    --sidebar-animation-duration: 600ms;
+    --sidebar-collapsed-width: 70px;
+    --sidebar-expanded-width: 220px;
+    --sidebar-icon-collapsed-margin: 10px;
+    --sidebar-item-height: 2.75rem;
+    --sidebar-logo-height: 50px;
+    --sidebar-picture-size: 50px;
+}