@yuuvis/client-framework 2.20.1 → 3.0.0-beta.20.0

package/lib/services/halo-utility/halo-utility.service.d.ts

@@ -1,245 +0,0 @@
-import { HaloFocusConfig } from '../../models';
-import * as i0 from "@angular/core";
-/**
- * Utility service providing helper methods for the Halo Focus feature.
- *
- * This service contains pure utility functions for:
- * - Element validation (focusability, visibility, focus-visible state)
- * - Material form field detection and exclusion logic
- * - Style calculations (colors, offsets, positioning)
- * - DOM traversal (finding halo containers, checking parent visibility)
- * - Halo element manipulation (size, color, position)
- *
- * **Scope & Performance:**
- * This service is intentionally NOT provided in root (`providedIn: 'root'` is omitted).
- * Instead, it's provided locally via `provideHaloFocus()`, ensuring it's only instantiated
- * when the Halo Focus feature is actually used. This optimization prevents unnecessary
- * service creation in applications that don't use halo focus.
- *
- * **Note:** This service is used exclusively by `HaloFocusService` and should not be
- * injected or used elsewhere in the application.
- *
- * @internal
- */
-export declare class HaloUtilityService {
-    /**
-     * Checks if an element is focusable (can receive keyboard focus).
-     *
-     * An element is considered focusable if:
-     * - It has a non-negative tabIndex (>= 0), OR
-     * - It's a natively focusable element (A, BUTTON, INPUT, SELECT, TEXTAREA), OR
-     * - It has contentEditable enabled
-     *
-     * @param element - Element to check
-     * @returns true if element can receive focus, false otherwise
-     */
-    isFocusable(element: Element | null): element is HTMLElement;
-    /**
-     * Checks if an element is inside a Material form field (mat-form-field).
-     *
-     * Traverses up the DOM tree from the element to check if any parent
-     * has the `mat-form-field` tag name. This is used to determine if
-     * certain elements should skip halo focus because they're already
-     * styled by Angular Material.
-     *
-     * **Search Scope:**
-     * - Starts from element itself
-     * - Stops at document.body
-     * - Returns true on first mat-form-field match
-     *
-     * @param element - The element to check
-     * @returns true if element is inside a mat-form-field, false otherwise
-     */
-    isElementInsideMatFormField(element: HTMLElement): boolean;
-    /**
-     * Determines if an element should be excluded from halo focus when inside mat-form-field.
-     *
-     * Checks two conditions:
-     * 1. Element tag name matches one of the excluded selectors (input, mat-select, etc.)
-     * 2. Element is inside a mat-form-field component
-     *
-     * If both conditions are true, the element should skip halo focus because
-     * Angular Material already provides adequate focus styling.
-     *
-     * **Excluded Elements (configurable via haloExcludedElementsInMatFormField):**
-     * - `input` elements inside mat-form-field
-     * - `textarea` elements inside mat-form-field
-     * - `mat-select` elements inside mat-form-field
-     *
-     * **Note:** Elements outside mat-form-field will NOT be skipped, even if
-     * their tag matches the exclusion list.
-     *
-     * @param element - The focused element to check
-     * @returns true if element should be skipped (no halo), false if halo should be shown
-     */
-    shouldSkipElementInMatFormField(element: HTMLElement): boolean;
-    /**
-     * Determines if an element should display the halo based on :focus-visible state.
-     *
-     * This method respects the CSS :focus-visible pseudo-class, which indicates that
-     * focus was triggered by keyboard navigation (not mouse clicks). The halo only appears
-     * when both conditions are met:
-     * 1. Element matches :focus-visible (browser determines this)
-     * 2. Last user interaction was via keyboard (tracked by service)
-     *
-     * **Fallback:** If browser doesn't support :focus-visible, falls back to checking
-     * lastInteractionWasKeyboard only.
-     *
-     * @param element - The currently focused element
-     * @param lastInteractionWasKeyboard - Whether the last interaction was a keyboard event
-     * @returns true if halo should be visible, false otherwise
-     */
-    matchesFocusVisible(element: HTMLElement, lastInteractionWasKeyboard: boolean): boolean;
-    /**
-     * Checks if an element is actually visible on the page.
-     *
-     * Performs comprehensive visibility checks including:
-     * - Element has non-zero dimensions (width and height > 0)
-     * - Element is not hidden via CSS (display: none, visibility: hidden, opacity: 0)
-     * - Element is not clipped by parent containers with overflow: hidden/clip
-     * - All parent elements in the hierarchy are visible
-     *
-     * This prevents the halo from appearing around technically focused but visually
-     * hidden elements (e.g., elements in collapsed sections, off-screen elements).
-     *
-     * @param element - Element to check for visibility
-     * @returns true if element is visible to the user, false otherwise
-     */
-    isElementVisible(element: HTMLElement): boolean;
-    /**
-     * Calculates the visible portion of an element considering overflow clipping from parent containers.
-     *
-     * Traverses up the DOM tree checking for parents with overflow clipping (hidden/clip/auto/scroll).
-     * For each clipping parent, calculates the intersection between the element's current visible area
-     * and the parent's boundaries, progressively clipping the visible rectangle.
-     *
-     * This is essential for showing halo focus only around the visible portion of elements that are
-     * partially scrolled out of view.
-     *
-     * @param element - The element to calculate visible rectangle for
-     * @returns The visible rectangle, or null if element is completely hidden
-     */
-    getVisibleRect(element: HTMLElement): DOMRect | null;
-    /**
-     * Recursively checks if all parent elements are visible and not clipping the target element.
-     *
-     * Traverses up the DOM tree from the element to document.body, checking each parent for:
-     * - Hidden state (display: none, visibility: hidden, opacity: 0)
-     * - Overflow clipping (overflow: hidden/clip) that completely hides the element
-     *
-     * If any parent has overflow clipping, calculates the visible intersection area.
-     * Returns false if element is completely clipped (no visible area).
-     *
-     * @param element - The element whose parents should be checked
-     * @param rect - The bounding rectangle of the element
-     * @returns true if element has visible area within all parent containers, false otherwise
-     */
-    isParentVisible(element: HTMLElement, rect: DOMRect): boolean;
-    /**
-     * Generates the complete CSS styles for the halo element, merging defaults with custom config.
-     *
-     * Takes the base styles from `haloFocusStyles` constant and overrides specific properties
-     * if custom configuration is provided. This allows global style customization while
-     * maintaining all required base styles.
-     *
-     * **Configurable Properties:**
-     * - Inner color (via config.innerColor)
-     * - Outer color (via config.outerColor)
-     *
-     * **Non-configurable Properties:**
-     * - position, pointerEvents, zIndex, opacity, transform (always use defaults)
-     *
-     * @param config - Optional global configuration object
-     * @returns Complete CSS style declaration object for the halo element
-     */
-    getHaloFocusStyles(config?: HaloFocusConfig): Partial<CSSStyleDeclaration>;
-    /**
-     * Finds the nearest parent element marked as a halo container.
-     *
-     * Traverses up the DOM tree looking for an element with the `halo-container` attribute.
-     * Container elements can define default halo styles (color, offset) that apply to all
-     * their focused children, unless overridden by child-specific halo-* attributes.
-     *
-     * **Search Scope:**
-     * - Starts from element's immediate parent
-     * - Stops at document.body (does not check body itself)
-     * - Returns first matching ancestor
-     *
-     * @param element - The focused element to search from
-     * @returns The nearest halo container element, or null if none found
-     */
-    getHaloContainer(element: HTMLElement): HTMLElement | null;
-    /**
-     * Converts any CSS color format to rgba with specified alpha transparency.
-     *
-     * Handles multiple color formats:
-     * - **rgba**: Replaces existing alpha value
-     * - **rgb**: Converts to rgba by appending alpha
-     * - **Hex** (#RRGGBB): Converts to rgba format
-     * - **Named colors**: Uses modern CSS `color-mix` function with alpha
-     *
-     * Used internally to create outer colors with reduced opacity from inner colors.
-     *
-     * @param color - CSS color in any valid format (rgba, rgb, hex, named)
-     * @param alpha - Alpha transparency value (0-1)
-     * @returns Color in rgba format with specified alpha
-     */
-    getColorWithAlpha(color: string, alpha: number): string;
-    /**
-     * Calculates the offset (distance) between the halo border and element edges.
-     *
-     * Determines offset using the following priority order:
-     * 1. **Element's own attributes** (highest priority):
-     *    - `halo-offset="value"` - Custom numeric value
-     * 2. **Parent container attributes** (if element has no offset):
-     *    - `halo-container-offset="value"`
-     * 3. **Default offset** (if nothing specified): 3px
-     *
-     * @param element - The focused element to calculate offset for
-     * @returns Offset value in pixels
-     */
-    getTargetOffset(element: HTMLElement | null): number;
-    /**
-     * Applies custom color styling to the halo element based on element or container attributes.
-     *
-     * Color resolution priority:
-     * 1. **Element's own color**: `halo-color="color"` attribute (highest priority)
-     * 2. **Container's color**: `halo-container-color="color"` from nearest halo container
-     * 3. **Default color**: From global config or base styles (if no custom color found)
-     *
-     * When custom color is found:
-     * - Sets inner color (2px solid border) with the custom color
-     * - Sets outer color (shadow) to match, with 20% alpha transparency for subtle depth
-     *
-     * When no custom color:
-     * - Resets to default styles from config or haloFocusStyles constant
-     *
-     * @param element - The focused element (checked for halo-color attribute)
-     * @param haloElement - The halo DIV element to apply styles to
-     * @param config - Optional global config for default colors
-     */
-    setCustomColor(element: HTMLElement, haloElement: HTMLDivElement, config?: HaloFocusConfig): void;
-    /**
-     * Positions and sizes the halo element to surround the focused element.
-     *
-     * Calculates halo dimensions and position based on:
-     * - Element's visible bounding rectangle (considering overflow clipping)
-     * - Calculated offset from getTargetOffset() (custom or default)
-     * - Element's border-radius for matching rounded corners
-     *
-     * **Calculation Details:**
-     * - Uses getVisibleRect to get only the visible portion of the element
-     * - Position: Visible rect's top/left minus offset (for outside positioning)
-     * - Size: Visible rect's width/height plus 2× offset (to extend on all sides)
-     * - Border radius: Inherited from focused element's computed style
-     *
-     * Uses Math.floor for position and Math.ceil for dimensions to prevent
-     * subpixel rendering issues and ensure full element coverage.
-     *
-     * @param currentElement - The currently focused element to surround
-     * @param haloElement - The halo DIV element to position and size
-     */
-    setHaloElementSize(currentElement: HTMLElement, haloElement: HTMLDivElement): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<HaloUtilityService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<HaloUtilityService>;
-}

package/lib/services/index.d.ts

@@ -1,4 +0,0 @@
-export * from './halo-focus/halo-focus.service';
-export * from './halo-utility/halo-utility.service';
-export * from './session/session.service';
-export * from './snack-bar/snack-bar.service';

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

@@ -1,113 +0,0 @@
-import * as i0 from "@angular/core";
-/**
- * Manages client-side session expiry: persists expiration, tracks user and HTTP activity,
- * shows a pre-expiry popup with an extend CTA, and syncs state across tabs via BroadcastChannel.
- *
- * Key behaviors
- * - Persists `expiresAt` in AppCacheService so multiple tabs share the same deadline
- * - Automatically listens to BackendService HTTP activity (debounced) to extend sessions
- * - Extends backend session by calling `/api-web/api/idm/whoami` endpoint` (skipped when triggered by HTTP activity)
- * - User activity (mouse, keyboard, scroll) inside a defined window will auto-extend the session
- * - Displays a snack popup shortly before expiry; user can extend from the popup
- * - Broadcasts `SessionExtended` / `SessionLogout` to keep tabs in sync
- *
- * Setup options
- *
- * Option 1: Known session duration at startup
- * Use when the session duration is known in advance and remains constant.
- * ```ts
- * // app.config.ts
- * export const appConfig: ApplicationConfig = {
- *   providers: [
- *     provideSession(30 * 60 * 1000), // 30 minutes - set at app startup
- *   ]
- * };
- * ```
- *
- * Option 2: Dynamic session duration from backend
- * Use when the session duration is determined after login (e.g., from backend response).
- * ```ts
- * // app.config.ts
- * export const appConfig: ApplicationConfig = {
- *   providers: [
- *     provideSession(), // Initialize without duration (defaults to 30 minutes)
- *   ]
- * };
- *
- * // After login in AuthService:
- * login().subscribe(response => {
- *   const sessionDuration = response.sessionExpiresIn; // from backend
- *   sessionService.startSession(sessionDuration);
- * });
- * ```
- * Note: If no duration is provided to provideSession(), a default of 30 minutes is used until startSession() is called.
- *
- * Lifecycle notes
- * - HTTP activity is automatically tracked via BackendService.httpCommunicationOccurred$
- * - Backend session is extended via whoami endpoint, except when triggered by HTTP activity or cross-tab sync
- * - Internal flag prevents recursive whoami calls when the endpoint itself triggers httpCommunicationOccurred$
- * - Warning and logout timers are reset on every extend
- * - All timers and the popup are cleared on logout
- * - Broadcast messages are listened for and mirrored across tabs
- * - For UI activity, this service listens to DOM events (mousemove, keydown, click, scroll)
- */
-export declare class SessionService {
-    #private;
-    private translate;
-    /**
-     * Initializes cross-tab listeners and activity hooks.
-     *
-     * IMPORTANT: This is automatically called by `provideSession()` via APP_INITIALIZER.
-     * You should NOT call this manually - just add `provideSession()` to your app providers.
-     *
-     * What it does:
-     * - Initializes session with provided or default duration value
-     * - Wires BroadcastChannel subscriptions for cross-tab sync
-     * - Subscribes to BackendService.httpCommunicationOccurred$ for automatic HTTP activity tracking
-     * - Attaches DOM event listeners (mousemove, keydown, click, scroll) for the activity window
-     */
-    init(sessionDuration?: number): void;
-    /**
-     * Sets the session duration and starts the session lifecycle.
-     *
-     * Use this method when you need to set or update the session duration dynamically,
-     * typically after receiving authentication/session information from the backend.
-     *
-     * This is the correct approach when:
-     * - Session duration is not known at application startup
-     * - Duration comes from a backend API response after login
-     * - You need to manually override the duration set via provideSession()
-     *
-     * Example:
-     * ```ts
-     * // After login in AuthService
-     * login().subscribe(response => {
-     *   this.sessionService.startSession(response.sessionExpiresIn);
-     * });
-     * ```
-     *
-     * @param duration Total session length in milliseconds
-     */
-    startSession(duration: number): void;
-    /**
-     * Extends the session expiry, resets all timers, and optionally broadcasts to other tabs.
-     *
-     * @param broadcast When true (default), posts a BroadcastChannel message so other tabs sync
-     * @param expiresAt Optional custom expiry timestamp; if not provided, calculates based on session duration
-     * @param skipBackendCall When true, skips the whoami backend call (used when already triggered by HTTP activity)
-     */
-    extendSession(broadcast?: boolean, expiresAt?: number, skipBackendCall?: boolean): void;
-    private listenToChannel;
-    private scheduleActivityWindow;
-    private showPopup;
-    private scheduleLogout;
-    private performLogout;
-    private setupHttpDebounce;
-    private setupUserActivityTracking;
-    private resetAllTimers;
-    private getExpiresAt;
-    private setExpiresAt;
-    private clearTimers;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SessionService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<SessionService>;
-}

package/lib/services/snack-bar/snack-bar.service.d.ts

@@ -1,22 +0,0 @@
-import { MatSnackBarRef } from '@angular/material/snack-bar';
-import { SnackBarLevel, SnackBarOptions } from '../../models';
-import * as i0 from "@angular/core";
-export declare class SnackBarService {
-    #private;
-    info(message: string, action?: string, duration?: number): MatSnackBarRef<SnackBarComponent>;
-    success(message: string, action?: string, duration?: number): MatSnackBarRef<SnackBarComponent>;
-    warning(message: string, action?: string, duration?: number): MatSnackBarRef<SnackBarComponent>;
-    danger(message: string, action?: string, duration?: number): MatSnackBarRef<SnackBarComponent>;
-    snack(message: string, options: SnackBarOptions): MatSnackBarRef<SnackBarComponent>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SnackBarService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<SnackBarService>;
-}
-export declare class SnackBarComponent {
-    #private;
-    level: import("@angular/core").WritableSignal<SnackBarLevel>;
-    message: import("@angular/core").WritableSignal<string>;
-    action: import("@angular/core").WritableSignal<string | undefined>;
-    dismiss(withAction?: boolean): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SnackBarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SnackBarComponent, "yuv-snack-bar-component", never, {}, {}, never, never, true, never>;
-}

package/lib/yuuvis-client-framework.module.d.ts

@@ -1,7 +0,0 @@
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-export declare class YuuvisClientFrameworkModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<YuuvisClientFrameworkModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<YuuvisClientFrameworkModule, never, [typeof i1.CommonModule], never>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<YuuvisClientFrameworkModule>;
-}

package/list/lib/list-item.directive.d.ts

@@ -1,40 +0,0 @@
-import { Highlightable } from '@angular/cdk/a11y';
-import { AfterViewInit } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * Directive for list items. It is used in the `yuvList` component
- * to keep track of active and selected items. Every element with this
- * directive will be treated as a list item and can be selected and focused.
- *
- *```html
- * <yuv-list (itemSelect)="itemSelected($event)">
- *   <div yuvListItem>Entry #1</div>
- *   <div yuvListItem>Entry #2</div>
- * </yuv-list>
- * ```
- */
-export declare class ListItemDirective implements Highlightable, AfterViewInit {
-    #private;
-    onClick?: (evt: MouseEvent) => void;
-    disabled?: boolean | undefined;
-    /**
-     * Whether the item is active or not.
-     */
-    active: import("@angular/core").InputSignal<boolean>;
-    /**
-     * Whether the item is selected or not.
-     */
-    selected: import("@angular/core").InputSignal<boolean>;
-    selectedInput: import("@angular/core").WritableSignal<any>;
-    activeInput: import("@angular/core").WritableSignal<any>;
-    focusableChildren: Element[];
-    focusedIndex: number;
-    onHostClick(evt: MouseEvent): void;
-    setActiveStyles(): void;
-    setInactiveStyles(): void;
-    focusNext(): void;
-    focusPrevious(): void;
-    ngAfterViewInit(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ListItemDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<ListItemDirective, "[yuvListItem]", never, { "disabled": { "alias": "disabled"; "required": false; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}

package/list/lib/list-tile/list-tile.component.d.ts

@@ -1,14 +0,0 @@
-import { TemplateRef } from '@angular/core';
-import * as i0 from "@angular/core";
-export declare class ListTileComponent {
-    iconSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    titleSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    descriptionSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    asideSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    actionsSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    badgesSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    metaSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    extensionSlot: import("@angular/core").Signal<TemplateRef<any> | undefined>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ListTileComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ListTileComponent, "yuv-list-tile", never, {}, {}, ["iconSlot", "titleSlot", "descriptionSlot", "asideSlot", "actionsSlot", "badgesSlot", "metaSlot", "extensionSlot"], ["*"], true, never>;
-}