@life-cockpit/angular-ui-kit 1.0.3 → 1.1.0

package/types/life-cockpit-angular-ui-kit.d.ts

@@ -1,7 +1,7 @@
 import * as _angular_core from '@angular/core';
-import { EventEmitter, ElementRef, OnInit, OnDestroy, AfterViewInit, QueryList, Signal, TemplateRef, AfterContentInit } from '@angular/core';
+import { EventEmitter, ElementRef, OnInit, OnDestroy, AfterViewInit, QueryList, Signal, TemplateRef, AfterContentInit, AfterViewChecked } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
-import { SafeHtml } from '@angular/platform-browser';
+import { SafeHtml, DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
 
 /**
  * Do not edit directly, this file was auto-generated.
@@ -212,6 +212,13 @@ interface NavigationItem {
 /**
  * Accordion component for collapsible content sections.
  *
+ * Features:
+ * - Expandable/collapsible content panels
+ * - Two-way binding for expanded state
+ * - Animated expand/collapse transitions
+ * - Content projection for custom body content
+ * - Accessible with keyboard support
+ *
  * @example
  * ```html
  * <lc-accordion title="Section Title" [(expanded)]="isOpen">
@@ -268,7 +275,14 @@ declare class ButtonComponent {
 }
 
 /**
- * Card component for content grouping and hierarchy.
+ * Card component for content grouping and visual hierarchy.
+ *
+ * Features:
+ * - Variant styles (elevated, outlined, filled)
+ * - Configurable padding (none, sm, md, lg)
+ * - Border radius options (none, sm, md, lg, xl)
+ * - Optional title display
+ * - Content projection for flexible body content
  *
  * @example
  * ```html
@@ -384,7 +398,7 @@ type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
  * - Signal-based reactive API
  * - Support for outline and solid variants
  * - Multiple size options (xs, sm, md, lg, xl)
- * - Custom color support (CSS colors, variables, Tailwind classes)
+ * - Custom color support (CSS colors, variables)
  * - Accessibility attributes (ARIA labels, decorative icons)
  * - Dynamic SVG loading from Heroicons
  *
@@ -399,8 +413,8 @@ type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
  * <!-- With custom color -->
  * <lc-icon name="arrow-right" color="#FF5733" />
  *
- * <!-- With Tailwind color -->
- * <lc-icon name="star" color="text-primary-500" />
+ * <!-- With CSS variable color -->
+ * <lc-icon name="star" color="var(--color-primary-500)" />
  *
  * <!-- With accessibility label -->
  * <lc-icon name="user" ariaLabel="User profile" />
@@ -437,7 +451,6 @@ declare class IconComponent {
      * Can be:
      * - CSS color: "#FF5733", "rgb(255, 87, 51)"
      * - CSS variable: "var(--color-primary-500)"
-     * - Tailwind class: "text-primary-500"
      * - "currentColor" (default - inherits from parent)
      * @default "currentColor"
      */
@@ -499,11 +512,15 @@ declare class IconComponent {
 }
 
 /**
- * Logo Component
+ * Logo component for displaying the Life-Cockpit brand identity.
  *
- * Displays the Life-Cockpit logo or emblem.
+ * Features:
+ * - Full logo and emblem-only variants
+ * - Multiple size options (sm, md, lg)
+ * - SVG-based for crisp rendering at any resolution
+ * - Dark mode compatible
  *
- * Usage:
+ * @example
  * ```html
  * <lc-logo variant="full" size="md"></lc-logo>
  * <lc-logo variant="emblem" size="sm"></lc-logo>
@@ -629,20 +646,21 @@ declare class MenuComponent {
 }
 
 /**
- * Text input component for form data entry.
+ * Input component for single-line text form data entry.
  *
- * Implements ControlValueAccessor for seamless integration with Angular forms.
- * Supports validation, icons, character count, and accessibility features.
+ * Features:
+ * - Type variants (text, email, password, number, tel, url)
+ * - Size presets (xs, sm, md, lg)
+ * - Leading and trailing icon support
+ * - Character count display with maxLength
+ * - Validation error message display
+ * - Helper text support
+ * - Disabled and readonly states
+ * - ControlValueAccessor integration for reactive forms
  *
  * @example
  * ```html
- * <lc-input
- *   label="Email"
- *   type="email"
- *   placeholder="Enter your email"
- *   [(ngModel)]="email"
- *   [error]="emailError"
- * ></lc-input>
+ * <lc-input label="Email" type="email" placeholder="Enter email" [(ngModel)]="email" />
  * ```
  */
 declare class InputComponent implements ControlValueAccessor {
@@ -822,25 +840,22 @@ declare class RadioComponent implements ControlValueAccessor, OnInit, OnDestroy
 }
 
 /**
- * Typography Component
+ * Typography component for consistent text styling.
  *
- * A flexible text component that provides consistent typography styling across the application.
- * Supports semantic HTML elements (h1-h6, p, span), text alignment, color variants,
- * font weights, text transforms, and line clamping.
+ * Features:
+ * - Semantic variants (h1–h6, body1, body2, caption, overline)
+ * - Automatic HTML element mapping per variant
+ * - Text alignment options (left, center, right, justify)
+ * - Color variants (primary, secondary, success, warning, error, info)
+ * - Font weight overrides (regular, medium, semibold, bold)
+ * - Text transform (uppercase, lowercase, capitalize)
+ * - Line clamping for text truncation
+ * - Gutter bottom margin option
  *
  * @example
  * ```html
- * <lc-typography variant="h1" align="center" color="primary">
- *   Main Heading
- * </lc-typography>
- *
- * <lc-typography variant="body1" gutterBottom>
- *   Body text with bottom margin
- * </lc-typography>
- *
- * <lc-typography variant="caption" color="secondary" lineClamp="2">
- *   This is a caption that will be truncated after 2 lines...
- * </lc-typography>
+ * <lc-typography variant="h1" color="primary">Heading</lc-typography>
+ * <lc-typography variant="body1" [lineClamp]="2">Truncated text...</lc-typography>
  * ```
  */
 declare class TypographyComponent {
@@ -906,16 +921,21 @@ declare class TypographyComponent {
 
 type DateValue = Date | string | null;
 /**
- * DatePicker component for date selection with calendar.
+ * Datepicker component for date selection with calendar overlay.
+ *
+ * Features:
+ * - Calendar popup with month and year navigation
+ * - Min/max date constraints
+ * - Disabled specific dates and weekends
+ * - Configurable date format string
+ * - Variant styles (outline, filled)
+ * - Size presets (xs, sm, md, lg)
+ * - Disabled and readonly states
+ * - ControlValueAccessor integration for reactive forms
  *
  * @example
  * ```html
- * <lc-datepicker
- *   variant="outline"
- *   size="md"
- *   placeholder="Select a date"
- *   [(ngModel)]="selectedDate"
- * ></lc-datepicker>
+ * <lc-datepicker placeholder="Select date" [(ngModel)]="selectedDate" />
  * ```
  */
 declare class DatepickerComponent implements ControlValueAccessor {
@@ -1101,17 +1121,22 @@ interface SelectOptionGroup {
 }
 type SelectValue = string | number | string[] | number[] | null;
 /**
- * Select component for dropdown selection with single or multiple options.
+ * Select component for dropdown option selection.
+ *
+ * Features:
+ * - Single and multiple selection modes
+ * - Searchable/filterable option list
+ * - Option groups with headers
+ * - Loading state indicator
+ * - Variant styles (outline, filled)
+ * - Size presets (xs, sm, md, lg)
+ * - Keyboard navigation support
+ * - CDK overlay positioning
+ * - ControlValueAccessor integration for reactive forms
  *
  * @example
  * ```html
- * <lc-select
- *   [options]="options"
- *   variant="outline"
- *   size="md"
- *   placeholder="Select an option"
- *   [(ngModel)]="selectedValue"
- * ></lc-select>
+ * <lc-select [options]="options" placeholder="Choose" [(ngModel)]="selected" />
  * ```
  */
 declare class SelectComponent implements ControlValueAccessor {
@@ -1243,16 +1268,20 @@ declare class SelectComponent implements ControlValueAccessor {
 }
 
 /**
- * Switch component for toggle functionality.
+ * Switch component for boolean toggle functionality.
+ *
+ * Features:
+ * - Color variants (primary, secondary, success, warning, danger)
+ * - Size options (sm, md, lg)
+ * - Loading state with spinner
+ * - Configurable label positioning (left/right)
+ * - Keyboard toggle support
+ * - Disabled and required states
+ * - ControlValueAccessor integration for reactive forms
  *
  * @example
  * ```html
- * <lc-switch
- *   variant="primary"
- *   size="md"
- *   label="Enable notifications"
- *   [(ngModel)]="isEnabled"
- * ></lc-switch>
+ * <lc-switch label="Enable notifications" [(ngModel)]="isEnabled" />
  * ```
  */
 declare class SwitchComponent implements ControlValueAccessor {
@@ -1326,14 +1355,18 @@ declare class SwitchComponent implements ControlValueAccessor {
 /**
  * Textarea component for multi-line text input.
  *
+ * Features:
+ * - Variant styles (outline, filled)
+ * - Size presets (xs, sm, md, lg)
+ * - Auto-resize with configurable min/max rows
+ * - Character count display with maxLength
+ * - Validation error message and helper text
+ * - Disabled and readonly states
+ * - ControlValueAccessor integration for reactive forms
+ *
  * @example
  * ```html
- * <lc-textarea
- *   variant="outline"
- *   size="md"
- *   placeholder="Enter your message"
- *   [(ngModel)]="message"
- * ></lc-textarea>
+ * <lc-textarea placeholder="Enter message" [autoResize]="true" [(ngModel)]="message" />
  * ```
  */
 declare class TextareaComponent implements ControlValueAccessor, AfterViewInit {
@@ -1641,20 +1674,20 @@ declare class VerificationCodeInputComponent implements ControlValueAccessor, Af
 }
 
 /**
- * Email input component with RFC 5322 validation.
+ * Email input component with built-in RFC 5322 validation.
  *
- * Extends the base input component with email-specific validation
- * and provides visual feedback for valid/invalid email addresses.
+ * Features:
+ * - RFC 5322 regex email format validation
+ * - Real-time validation feedback on input
+ * - Valid/invalid visual indicators
+ * - Size presets (xs, sm, md, lg)
+ * - Helper text and error message display
+ * - Disabled and readonly states
+ * - ControlValueAccessor integration for reactive forms
  *
  * @example
  * ```html
- * <lc-email-input
- *   label="Email Address"
- *   placeholder="you@example.com"
- *   [(ngModel)]="email"
- *   [required]="true"
- *   (validationChange)="handleValidation($event)"
- * ></lc-email-input>
+ * <lc-email-input label="Email" placeholder="you@example.com" [(ngModel)]="email" />
  * ```
  */
 declare class EmailInputComponent implements ControlValueAccessor {
@@ -1785,6 +1818,355 @@ declare class EmailInputComponent implements ControlValueAccessor {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<EmailInputComponent, "lc-email-input", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "helperText": { "alias": "helperText"; "required": false; "isSignal": true; }; "validateOnInput": { "alias": "validateOnInput"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "validationChange": "validationChange"; "focused": "focused"; "blurred": "blurred"; "enterPressed": "enterPressed"; }, never, never, true, never>;
 }
 
+type HeroColor = 'primary' | 'secondary' | 'neutral' | 'success' | 'info' | 'warning' | 'accent-orange' | 'accent-purple' | 'accent-violet';
+type HeroSize = 'sm' | 'md' | 'lg';
+/**
+ * Hero component for prominent page headers with gradient backgrounds.
+ *
+ * Features:
+ * - Color gradient variants (primary, secondary, success, warning, error, neutral)
+ * - Size options (sm, md, lg)
+ * - Optional label text above the title
+ * - Configurable border radius
+ * - Content projection for body and footer sections
+ * - Footer slot for metadata, stats, or CTAs
+ *
+ * @example
+ * ```html
+ * <lc-hero label="MY APP" title="Welcome" color="primary">
+ *   <p>Description text</p>
+ *   <div hero-footer>Status: Active</div>
+ * </lc-hero>
+ * ```
+ */
+declare class HeroComponent {
+    /**
+     * Small uppercase label displayed above the title.
+     */
+    label: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Main headline text.
+     */
+    title: _angular_core.InputSignal<string>;
+    /**
+     * Color theme for the gradient background.
+     * @default 'primary'
+     */
+    color: _angular_core.InputSignal<HeroColor>;
+    /**
+     * Size variant controlling padding and font sizes.
+     * @default 'md'
+     */
+    size: _angular_core.InputSignal<HeroSize>;
+    /**
+     * Border radius of the hero container.
+     * @default 'lg'
+     */
+    borderRadius: _angular_core.InputSignal<"sm" | "md" | "lg" | "none">;
+    protected heroClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HeroComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<HeroComponent, "lc-hero", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "borderRadius": { "alias": "borderRadius"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[hero-footer]"], true, never>;
+}
+
+type ProgressBarColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+type ProgressBarSize = 'xs' | 'sm' | 'md' | 'lg';
+type ProgressBarVariant = 'linear' | 'circular';
+/**
+ * Progress bar component for displaying completion status.
+ *
+ * Features:
+ * - Linear and circular progress variants
+ * - Color theme options (primary, secondary, success, warning, error)
+ * - Multiple size presets (xs, sm, md, lg)
+ * - Animated value transitions
+ * - Accessible with ARIA progressbar role
+ *
+ * @example
+ * ```html
+ * <lc-progress-bar [value]="75" color="primary" size="md"></lc-progress-bar>
+ * <lc-progress-bar [value]="50" variant="circular" color="success"></lc-progress-bar>
+ * ```
+ */
+declare class ProgressBarComponent {
+    /**
+     * Progress value between 0 and 100.
+     * @default 0
+     */
+    value: _angular_core.InputSignal<number>;
+    /**
+     * Color theme.
+     * @default 'primary'
+     */
+    color: _angular_core.InputSignal<ProgressBarColor>;
+    /**
+     * Height/thickness of the bar.
+     * @default 'md'
+     */
+    size: _angular_core.InputSignal<ProgressBarSize>;
+    /**
+     * Visual variant.
+     * @default 'linear'
+     */
+    variant: _angular_core.InputSignal<ProgressBarVariant>;
+    /**
+     * Whether to show the percentage label.
+     * @default false
+     */
+    showLabel: _angular_core.InputSignal<boolean>;
+    /**
+     * Whether the progress is indeterminate (animated, no fixed value).
+     * @default false
+     */
+    indeterminate: _angular_core.InputSignal<boolean>;
+    /**
+     * Accessible label for screen readers.
+     */
+    ariaLabel: _angular_core.InputSignal<string>;
+    protected clampedValue: _angular_core.Signal<number>;
+    protected barClasses: _angular_core.Signal<string>;
+    protected readonly circleRadius = 40;
+    protected readonly circleCircumference: number;
+    protected strokeDashoffset: _angular_core.Signal<number>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProgressBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProgressBarComponent, "lc-progress-bar", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type DividerOrientation = 'horizontal' | 'vertical';
+type DividerVariant = 'solid' | 'dashed' | 'dotted';
+type DividerSpacing = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * Divider component for visual separation of content.
+ *
+ * Features:
+ * - Horizontal and vertical orientations
+ * - Line style variants (solid, dashed, dotted)
+ * - Configurable spacing (none, sm, md, lg)
+ * - Optional centered text label
+ * - Dark mode support
+ *
+ * @example
+ * ```html
+ * <lc-divider></lc-divider>
+ * <lc-divider orientation="vertical" variant="dashed"></lc-divider>
+ * <lc-divider spacing="lg">OR</lc-divider>
+ * ```
+ */
+declare class DividerComponent {
+    /**
+     * Orientation of the divider line.
+     * @default 'horizontal'
+     */
+    orientation: _angular_core.InputSignal<DividerOrientation>;
+    /**
+     * Line style.
+     * @default 'solid'
+     */
+    variant: _angular_core.InputSignal<DividerVariant>;
+    /**
+     * Spacing (margin) around the divider.
+     * @default 'md'
+     */
+    spacing: _angular_core.InputSignal<DividerSpacing>;
+    /**
+     * Optional inline text label (e.g. "OR", "Section").
+     */
+    label: _angular_core.InputSignal<string | undefined>;
+    protected dividerClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DividerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DividerComponent, "lc-divider", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type SearchInputSize = 'sm' | 'md' | 'lg';
+/**
+ * Search input component with integrated search functionality.
+ *
+ * Features:
+ * - Built-in search icon
+ * - Clear button for resetting input
+ * - RxJS-based configurable debounce
+ * - Multiple size variants (sm, md, lg)
+ * - Disabled state support
+ * - Submit event on Enter key
+ *
+ * @example
+ * ```html
+ * <lc-search-input
+ *   placeholder="Search..."
+ *   [debounceMs]="300"
+ *   (searchChange)="onSearch($event)"
+ * ></lc-search-input>
+ * ```
+ */
+declare class SearchInputComponent implements OnInit, OnDestroy {
+    /**
+     * Placeholder text.
+     * @default 'Search…'
+     */
+    placeholder: _angular_core.InputSignal<string>;
+    /**
+     * Size variant.
+     * @default 'md'
+     */
+    size: _angular_core.InputSignal<SearchInputSize>;
+    /**
+     * Debounce delay in milliseconds. 0 means no debounce.
+     * @default 300
+     */
+    debounceMs: _angular_core.InputSignal<number>;
+    /**
+     * Whether the search input is disabled.
+     * @default false
+     */
+    disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Emitted when the search value changes (debounced).
+     */
+    readonly searchChange: _angular_core.OutputEmitterRef<string>;
+    /**
+     * Emitted when the user presses Enter.
+     */
+    readonly searchSubmit: _angular_core.OutputEmitterRef<string>;
+    protected value: _angular_core.WritableSignal<string>;
+    protected readonly inputRef: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
+    protected wrapperClasses: _angular_core.Signal<string>;
+    private readonly input$;
+    private readonly destroy$;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    protected onInput(event: Event): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    protected clear(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SearchInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SearchInputComponent, "lc-search-input", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "debounceMs": { "alias": "debounceMs"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "searchChange": "searchChange"; "searchSubmit": "searchSubmit"; }, never, never, true, never>;
+}
+
+interface FileUploadFile {
+    file: File;
+    name: string;
+    size: number;
+    type: string;
+}
+/**
+ * File upload / dropzone component with drag & drop support.
+ *
+ * @example
+ * ```html
+ * <lc-file-upload
+ *   accept=".pdf,.png,.jpg"
+ *   [multiple]="true"
+ *   [maxSizeBytes]="5242880"
+ *   (filesSelected)="onFiles($event)"
+ * ></lc-file-upload>
+ * ```
+ */
+declare class FileUploadComponent {
+    /**
+     * Accepted file types (e.g. ".pdf,.jpg,image/*").
+     */
+    accept: _angular_core.InputSignal<string>;
+    /**
+     * Allow multiple files.
+     * @default false
+     */
+    multiple: _angular_core.InputSignal<boolean>;
+    /**
+     * Maximum file size in bytes. 0 for unlimited.
+     * @default 0
+     */
+    maxSizeBytes: _angular_core.InputSignal<number>;
+    /**
+     * Whether the dropzone is disabled.
+     * @default false
+     */
+    disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Hint text shown in the dropzone.
+     * @default 'Drag & drop files here, or click to browse'
+     */
+    hint: _angular_core.InputSignal<string>;
+    /**
+     * Emitted with selected files after validation.
+     */
+    readonly filesSelected: _angular_core.OutputEmitterRef<FileUploadFile[]>;
+    /**
+     * Emitted when a file is rejected (too large or wrong type).
+     */
+    readonly fileRejected: _angular_core.OutputEmitterRef<{
+        file: File;
+        reason: string;
+    }>;
+    protected isDragOver: _angular_core.WritableSignal<boolean>;
+    protected selectedFiles: _angular_core.WritableSignal<FileUploadFile[]>;
+    protected readonly fileInputRef: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
+    protected dropzoneClasses: _angular_core.Signal<string>;
+    protected onDragOver(event: DragEvent): void;
+    protected onDragLeave(event: DragEvent): void;
+    protected onDrop(event: DragEvent): void;
+    protected onFileChange(event: Event): void;
+    protected openFilePicker(): void;
+    protected removeFile(index: number): void;
+    protected formatSize(bytes: number): string;
+    private processFiles;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FileUploadComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FileUploadComponent, "lc-file-upload", never, { "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxSizeBytes": { "alias": "maxSizeBytes"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; }, { "filesSelected": "filesSelected"; "fileRejected": "fileRejected"; }, never, never, true, never>;
+}
+
+type PopoverPosition = 'top' | 'bottom' | 'left' | 'right';
+type PopoverTrigger = 'click' | 'hover';
+/**
+ * Popover component for displaying rich floating content.
+ *
+ * Features:
+ * - Position options (top, bottom, left, right)
+ * - Click or hover trigger modes
+ * - Optional arrow indicator
+ * - Click-outside to close
+ * - Open state change event
+ * - Content projection for trigger and body
+ *
+ * @example
+ * ```html
+ * <lc-popover position="bottom" trigger="click">
+ *   <button popover-trigger>Open</button>
+ *   <div popover-content>Rich content here</div>
+ * </lc-popover>
+ * ```
+ */
+declare class PopoverComponent implements OnDestroy {
+    /**
+     * Position relative to the trigger element.
+     * @default 'bottom'
+     */
+    position: _angular_core.InputSignal<PopoverPosition>;
+    /**
+     * How the popover is triggered.
+     * @default 'click'
+     */
+    trigger: _angular_core.InputSignal<PopoverTrigger>;
+    /**
+     * Whether to show an arrow pointing at the trigger.
+     * @default true
+     */
+    showArrow: _angular_core.InputSignal<boolean>;
+    /**
+     * Emitted when the popover opens or closes.
+     */
+    readonly openChange: _angular_core.OutputEmitterRef<boolean>;
+    protected isOpen: _angular_core.WritableSignal<boolean>;
+    protected panelClasses: _angular_core.Signal<string>;
+    private readonly elementRef;
+    onDocumentClick(event: MouseEvent): void;
+    onEscape(): void;
+    ngOnDestroy(): void;
+    protected toggle(): void;
+    protected open(): void;
+    protected close(): void;
+    protected onMouseEnter(): void;
+    protected onMouseLeave(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PopoverComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PopoverComponent, "lc-popover", never, { "position": { "alias": "position"; "required": false; "isSignal": true; }; "trigger": { "alias": "trigger"; "required": false; "isSignal": true; }; "showArrow": { "alias": "showArrow"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, never, ["[popover-trigger]", "[popover-content]"], true, never>;
+}
+
 type ContainerSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
 declare class ContainerComponent {
     size: _angular_core.InputSignal<ContainerSize>;
@@ -1841,6 +2223,14 @@ type AlertVariant = 'success' | 'error' | 'warning' | 'info';
 /**
  * Alert component for inline notifications.
  *
+ * Features:
+ * - Semantic variants (success, warning, error, info)
+ * - Optional title and icon display
+ * - Auto-mapped variant icons
+ * - Dismissible with close button
+ * - Content projection for custom body
+ * - Accessible with ARIA alert role
+ *
  * @example
  * ```html
  * <lc-alert variant="success" title="Success!" [dismissible]="true">
@@ -1921,24 +2311,19 @@ declare class AlertComponent {
  */
 type ErrorSeverity = 'error' | 'warning' | 'info';
 /**
- * Error display component for authentication error messages.
+ * Error display component for authentication and application error messages.
  *
- * Automatically maps Cognito error codes to user-friendly messages
- * and displays them with appropriate severity styling.
+ * Features:
+ * - Automatic Cognito error code mapping to user-friendly messages
+ * - Severity levels (error, warning, info)
+ * - Custom error message override
+ * - Dismissible with close button
+ * - Accepts Error objects or custom error shapes
  *
  * @example
  * ```html
- * <!-- Display Cognito error -->
- * <lc-error-display
- *   [error]="cognitoError"
- *   [dismissible]="true"
- * ></lc-error-display>
- *
- * <!-- Display custom error -->
- * <lc-error-display
- *   message="Invalid credentials"
- *   severity="error"
- * ></lc-error-display>
+ * <lc-error-display [error]="cognitoError" [dismissible]="true" />
+ * <lc-error-display message="Invalid credentials" severity="error" />
  * ```
  */
 declare class ErrorDisplayComponent {
@@ -2091,20 +2476,19 @@ declare class ToastService {
 }
 
 /**
- * Toast component for displaying ephemeral notifications.
- * Typically used via ToastService, not directly.
+ * Toast component for displaying ephemeral notification messages.
+ *
+ * Features:
+ * - Semantic variants (success, warning, error, info)
+ * - Auto-dismiss with configurable duration
+ * - Manual dismiss with close button
+ * - Icon display per variant
+ * - Stacked toast positioning via ToastService
+ * - Animated enter/exit transitions
  *
  * @example
  * ```typescript
- * // Use via service
- * constructor(private toastService: ToastService) {}
- *
- * showToast() {
- *   this.toastService.show({
- *     message: 'Success!',
- *     variant: 'success'
- *   });
- * }
+ * this.toastService.show({ message: 'Saved!', variant: 'success' });
  * ```
  */
 declare class ToastComponent {
@@ -2151,20 +2535,22 @@ declare class ToastComponent {
 type ModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
 /**
  * Modal dialog component for focused user interactions.
- * Uses FocusTrap for accessibility.
+ *
+ * Features:
+ * - Size presets (sm, md, lg, xl, full)
+ * - Focus trap for keyboard accessibility
+ * - Backdrop click and Escape key to close
+ * - Two-way open binding
+ * - Header, body, and footer content slots
+ * - Optional close button
+ * - Accessible with ARIA dialog role
  *
  * @example
  * ```html
  * <lc-modal [(open)]="isOpen" size="md" [closeOnBackdropClick]="true">
- *   <div slot="header">
- *     <h2>Modal Title</h2>
- *   </div>
- *   <div slot="body">
- *     <p>Modal content goes here</p>
- *   </div>
- *   <div slot="footer">
- *     <lc-button (click)="closeModal()">Close</lc-button>
- *   </div>
+ *   <div slot="header"><h2>Title</h2></div>
+ *   <div slot="body">Content</div>
+ *   <div slot="footer"><lc-button (click)="close()">Close</lc-button></div>
  * </lc-modal>
  * ```
  */
@@ -2562,29 +2948,22 @@ declare class PaginationComponent {
 type SidenavPosition = 'left' | 'right';
 type SidenavMode = 'drawer' | 'docked';
 /**
- * Sidenav Component
- *
- * A navigation component that can work as either a drawer (overlay) or
- * a docked (persistent) sidebar. Supports section headlines, collapsible
- * groups, keyboard navigation, and accessibility features.
+ * Sidenav component for application navigation sidebar.
  *
- * @example Drawer mode (default — overlay that slides in)
- * ```html
- * <lc-sidenav
- *   [isOpen]="isOpen"
- *   mode="drawer"
- *   (closed)="handleClose()">
- * </lc-sidenav>
- * ```
+ * Features:
+ * - Drawer (overlay) and docked (persistent) modes
+ * - Hierarchical navigation with collapsible groups
+ * - Section headlines for item grouping
+ * - Active route highlighting
+ * - Keyboard navigation support
+ * - Configurable width and position (left/right)
+ * - Optional backdrop overlay
+ * - Accessible with ARIA navigation role
  *
- * @example Docked mode (persistent sidebar that stays open)
+ * @example
  * ```html
- * <lc-sidenav
- *   [isOpen]="sidebarOpen"
- *   mode="docked"
- *   [items]="navItems"
- *   (closed)="sidebarOpen = false">
- * </lc-sidenav>
+ * <lc-sidenav [isOpen]="isOpen" mode="docked" [items]="navItems"
+ *   (closed)="isOpen = false" (itemClicked)="navigate($event)" />
  * ```
  */
 declare class SidenavComponent {
@@ -2728,6 +3107,13 @@ declare class TabComponent {
 /**
  * Tabs component for organizing content into switchable views.
  *
+ * Features:
+ * - Dynamic tab registration via content projection
+ * - Active tab tracking with two-way binding
+ * - Accessible with ARIA tablist/tab/tabpanel roles
+ * - Keyboard navigation between tabs
+ * - Lazy content rendering per tab
+ *
  * @example
  * ```html
  * <lc-tabs>
@@ -2830,21 +3216,19 @@ declare class TabsComponent implements AfterContentInit {
 type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 type AvatarStatus = 'online' | 'offline' | 'away' | 'busy';
 /**
- * Avatar Component
+ * Avatar component for circular user representation.
  *
- * A circular user representation component displaying images or initials.
- * Supports status indicators and multiple sizes.
+ * Features:
+ * - Image display with fallback to initials
+ * - Auto-generated initials from user name
+ * - Status indicator (online, offline, busy, away)
+ * - Multiple size variants (xs, sm, md, lg, xl)
+ * - Accessible with alt text support
  *
  * @example
  * ```html
- * <!-- With image -->
  * <lc-avatar src="https://example.com/avatar.jpg" alt="John Doe" />
- *
- * <!-- With initials -->
- * <lc-avatar name="John Doe" />
- *
- * <!-- With status indicator -->
- * <lc-avatar name="Jane Smith" status="online" size="lg" />
+ * <lc-avatar name="John Doe" status="online" size="lg" />
  * ```
  */
 declare class AvatarComponent {
@@ -2887,9 +3271,13 @@ declare class AvatarComponent {
 type BadgeVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info';
 type BadgeSize = 'xs' | 'sm' | 'md' | 'lg';
 /**
- * Badge Component
+ * Badge component for displaying status, notifications, or counts.
  *
- * A small count and labeling component used to display status, notifications, or counts.
+ * Features:
+ * - Semantic color variants (primary, secondary, success, warning, error, info, neutral)
+ * - Multiple size options (xs, sm, md, lg)
+ * - Pill-shaped rounded mode
+ * - Content projection for labels or count values
  *
  * @example
  * ```html
@@ -2912,60 +3300,28 @@ declare class BadgeComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<BadgeComponent, "lc-badge", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-type TrendDirection = 'up' | 'down' | 'flat';
-/**
- * MetricCard Component
- *
- * Displays a single KPI value with label, trend arrow, and optional icon.
- * Built on top of `lc-card` (outlined variant) for consistent card styling.
- *
- * @example
- * ```html
- * <lc-metric-card
- *   label="Portfolio Equity"
- *   value="$125,430"
- *   trend="up"
- *   trendValue="+2.4%"
- *   icon="arrow-trending-up"
- * ></lc-metric-card>
- * ```
- */
-declare class MetricCardComponent {
-    /** Label displayed above the value */
-    label: _angular_core.InputSignal<string>;
-    /** Formatted value to display */
-    value: _angular_core.InputSignal<string>;
-    /** Trend direction for arrow indicator */
-    trend: _angular_core.InputSignal<TrendDirection>;
-    /** Formatted trend value (e.g., "+2.4%") */
-    trendValue: _angular_core.InputSignal<string>;
-    /** Optional Heroicon name */
-    icon: _angular_core.InputSignal<string>;
-    /** Trend arrow character */
-    trendArrow: _angular_core.Signal<"↑" | "↓" | "→">;
-    /** Tailwind classes for trend color */
-    trendClasses: _angular_core.Signal<"text-green-600 dark:text-green-400" | "text-red-600 dark:text-red-400" | "text-gray-500 dark:text-gray-400">;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MetricCardComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MetricCardComponent, "lc-metric-card", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "trend": { "alias": "trend"; "required": false; "isSignal": true; }; "trendValue": { "alias": "trendValue"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}
-
 interface ToggleOption {
     readonly value: string;
     readonly label: string;
     readonly disabled?: boolean;
 }
 /**
- * ToggleGroup Component
+ * Toggle group component for single-option selection from a set.
  *
- * Binary or multi-option toggle with active state styling.
- * Uses Tailwind classes with dark mode support.
+ * Features:
+ * - Multiple segmented toggle buttons
+ * - Active state highlighting
+ * - Size variants (sm, md, lg)
+ * - Two-way selected value binding
+ * - Per-option disabled state
+ * - Dark mode support via CSS custom properties
  *
  * @example
  * ```html
  * <lc-toggle-group
- *   [options]="[{value:'1D',label:'1D'},{value:'1h',label:'1H'}]"
+ *   [options]="[{value:'1D',label:'1D'},{value:'1W',label:'1W'}]"
  *   [(selected)]="interval"
- * ></lc-toggle-group>
+ * />
  * ```
  */
 declare class ToggleGroupComponent {
@@ -3037,10 +3393,15 @@ interface ListItem {
     [key: string]: any;
 }
 /**
- * List Component
+ * List component for displaying structured item collections.
  *
- * A flexible list component that supports vertical/horizontal layouts,
- * icons, actions, and dividers.
+ * Features:
+ * - Vertical and horizontal layout orientations
+ * - Variant styles (default, bordered, card)
+ * - Optional dividers between items
+ * - Icon and avatar support per item
+ * - Action buttons with click events
+ * - Accessible with ARIA list role
  *
  * @example
  * ```html
@@ -3049,7 +3410,6 @@ interface ListItem {
  *   orientation="vertical"
  *   [showDividers]="true"
  *   (itemClick)="handleItemClick($event)"
- *   (actionClick)="handleActionClick($event)"
  * />
  * ```
  */
@@ -3091,15 +3451,18 @@ declare class ListComponent {
 type ChipVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info';
 type ChipSize = 'sm' | 'md' | 'lg';
 /**
- * Chip Component
+ * Chip component for displaying tags, filters, or selections.
  *
- * A pill-shaped removable tag component for displaying selections, filters, or tags.
- * Supports icons, color variants, and optional delete functionality.
+ * Features:
+ * - Color variants (primary, secondary, success, warning, error, info, neutral)
+ * - Multiple size options (sm, md, lg)
+ * - Optional leading icon
+ * - Removable with close button and remove event
+ * - Disabled state support
  *
  * @example
  * ```html
- * <lc-chip variant="primary" size="md" [removable]="true" (remove)="handleRemove()">
- *   <span lcChipIcon>🏷️</span>
+ * <lc-chip variant="primary" [removable]="true" (remove)="onRemove()">
  *   Tag Name
  * </lc-chip>
  * ```
@@ -3157,39 +3520,52 @@ interface TableColumn {
     key: string;
     label: string;
     sortable?: boolean;
+    filterable?: boolean;
+    editable?: boolean;
     width?: string;
     /** Optional CSS class(es) applied to both th and td cells */
     cssClass?: string;
     /** Optional tooltip shown on hover over the column header */
     tooltip?: string;
+    /** Input type for inline editing (default: text) */
+    editType?: 'text' | 'number' | 'select';
+    /** Options for select edit type */
+    editOptions?: string[];
 }
 interface SortEvent {
     column: string;
     direction: 'asc' | 'desc';
 }
+interface CellEditEvent {
+    row: Record<string, unknown>;
+    column: string;
+    oldValue: unknown;
+    newValue: unknown;
+    rowIndex: number;
+}
+interface SelectionChangeEvent {
+    selected: Record<string, unknown>[];
+    allSelected: boolean;
+}
 type TableVariant = 'default' | 'striped' | 'bordered';
 type TableSize = 'sm' | 'md' | 'lg';
 /**
- * Table Component
+ * Table component for displaying structured data in rows and columns.
  *
- * A flexible, accessible data table component with sorting, variants, and responsive behavior.
+ * Features:
+ * - Column-based sorting with sort direction indicators
+ * - Variant styles (default, striped, bordered)
+ * - Size presets (sm, md, lg)
+ * - Hoverable row highlighting
+ * - Custom cell templates via content projection
+ * - Responsive horizontal scrolling
+ * - Empty state text for no data
+ * - Accessible with proper table semantics
  *
  * @example
  * ```html
- * <lc-table
- *   [columns]="columns"
- *   [data]="data"
- *   variant="striped"
- *   [hoverable]="true"
- *   (sort)="onSort($event)">
- * </lc-table>
- *
- * <!-- With custom cell templates -->
- * <lc-table [columns]="columns" [data]="data">
- *   <ng-template lcTableCell="status" let-row>
- *     <lc-badge [variant]="row.status">{{ row.status }}</lc-badge>
- *   </ng-template>
- * </lc-table>
+ * <lc-table [columns]="columns" [data]="data" variant="striped" [hoverable]="true"
+ *   (sort)="onSort($event)" (rowClick)="onRowClick($event)" />
  * ```
  */
 declare class TableComponent {
@@ -3209,82 +3585,107 @@ declare class TableComponent {
     responsive: _angular_core.InputSignal<boolean>;
     /** Text shown when data is empty */
     emptyText: _angular_core.InputSignal<string>;
+    /** Enable pagination */
+    paginate: _angular_core.InputSignal<boolean>;
+    /** Rows per page */
+    pageSize: _angular_core.InputSignal<number>;
+    /** Available page size options */
+    pageSizeOptions: _angular_core.InputSignal<number[]>;
+    /** Enable row selection checkboxes */
+    selectable: _angular_core.InputSignal<boolean>;
+    /** Enable per-column text filters */
+    filterable: _angular_core.InputSignal<boolean>;
+    /** Enable inline cell editing on double-click */
+    editable: _angular_core.InputSignal<boolean>;
     /** Emitted when a sortable column header is clicked */
     readonly sort: _angular_core.OutputEmitterRef<SortEvent>;
     /** Emitted when a row is clicked */
     readonly rowClick: _angular_core.OutputEmitterRef<Record<string, unknown>>;
-    /**
-     * Computed CSS classes for the table element
-     */
-    tableClasses: _angular_core.Signal<string>;
-    /**
-     * Computed CSS classes for the wrapper element
-     */
-    wrapperClasses: _angular_core.Signal<string>;
-    /** Current sort state */
+    /** Emitted when a cell is edited */
+    readonly cellEdit: _angular_core.OutputEmitterRef<CellEditEvent>;
+    /** Emitted when row selection changes */
+    readonly selectionChange: _angular_core.OutputEmitterRef<SelectionChangeEvent>;
     protected currentSort: _angular_core.WritableSignal<{
         column: string;
         direction: "asc" | "desc";
     } | null>;
+    protected currentPage: _angular_core.WritableSignal<number>;
+    protected internalPageSize: _angular_core.WritableSignal<number>;
+    protected selectedRows: _angular_core.WritableSignal<Set<number>>;
+    protected columnFilters: _angular_core.WritableSignal<Record<string, string>>;
+    protected editingCell: _angular_core.WritableSignal<{
+        rowIndex: number;
+        column: string;
+    } | null>;
+    protected editValue: _angular_core.WritableSignal<string>;
     /**
-     * Handle click on a sortable column header
+     * Filtered data (applies column filters)
      */
-    handleSort(columnKey: string): void;
+    protected readonly filteredData: _angular_core.Signal<Record<string, unknown>[]>;
     /**
-     * Get sort state for a column
+     * Sorted data
      */
-    getSortState(columnKey: string): 'asc' | 'desc' | null;
+    protected readonly sortedData: _angular_core.Signal<Record<string, unknown>[]>;
     /**
-     * Get aria-sort attribute value for a column
+     * Paginated data (or all if pagination disabled)
      */
-    getAriaSort(columnKey: string): string | null;
+    protected readonly displayData: _angular_core.Signal<Record<string, unknown>[]>;
+    /** Total pages */
+    protected readonly totalPages: _angular_core.Signal<number>;
+    /** Total filtered row count */
+    protected readonly totalRows: _angular_core.Signal<number>;
+    /** Whether all visible rows are selected */
+    protected readonly allSelected: _angular_core.Signal<boolean>;
     /**
-     * Get CSS classes for a header cell
+     * Computed CSS classes for the table element
      */
-    getHeaderClasses(column: TableColumn): string;
+    tableClasses: _angular_core.Signal<string>;
     /**
-     * Get value from data object by column key
+     * Computed CSS classes for the wrapper element
      */
+    wrapperClasses: _angular_core.Signal<string>;
+    handleSort(columnKey: string): void;
+    getSortState(columnKey: string): 'asc' | 'desc' | null;
+    getAriaSort(columnKey: string): string | null;
+    getHeaderClasses(column: TableColumn): string;
     getCellValue(row: Record<string, unknown>, columnKey: string): unknown;
-    /**
-     * Get custom template for a column if it exists
-     */
     getCellTemplate(columnKey: string): TableCellDirective | undefined;
-    /**
-     * Check if a column has a custom template
-     */
     hasCustomTemplate(columnKey: string): boolean;
-    /**
-     * Handle row click
-     */
     onRowClick(row: Record<string, unknown>): void;
+    protected goToPage(page: number): void;
+    protected onPageSizeChange(event: Event): void;
+    protected get paginationStart(): number;
+    protected get paginationEnd(): number;
+    protected toggleSelectAll(): void;
+    protected toggleRowSelect(relativeIndex: number): void;
+    protected isRowSelected(relativeIndex: number): boolean;
+    private getAbsoluteIndex;
+    private emitSelectionChange;
+    protected onFilterChange(columnKey: string, event: Event): void;
+    protected getFilterValue(columnKey: string): string;
+    protected startEdit(rowIndex: number, column: string, currentValue: unknown): void;
+    protected isEditing(rowIndex: number, column: string): boolean;
+    protected commitEdit(rowIndex: number, column: string): void;
+    protected cancelEdit(): void;
+    protected onEditKeydown(event: KeyboardEvent, rowIndex: number, column: string): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent, "lc-table", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hoverable": { "alias": "hoverable"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; }, { "sort": "sort"; "rowClick": "rowClick"; }, ["cellTemplates"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent, "lc-table", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hoverable": { "alias": "hoverable"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "paginate": { "alias": "paginate"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "filterable": { "alias": "filterable"; "required": false; "isSignal": true; }; "editable": { "alias": "editable"; "required": false; "isSignal": true; }; }, { "sort": "sort"; "rowClick": "rowClick"; "cellEdit": "cellEdit"; "selectionChange": "selectionChange"; }, ["cellTemplates"], never, true, never>;
 }
 
 /**
- * Field Group component for displaying label-value pairs in a consistent format.
- * Useful for read-only data displays like profile pages, detail views, etc.
+ * Field group component for displaying label-value pairs.
  *
- * @example Basic usage
- * ```html
- * <lc-field-group label="Email" value="user@example.com"></lc-field-group>
- * ```
- *
- * @example With icon
- * ```html
- * <lc-field-group
- *   label="Language"
- *   value="English (US)"
- *   icon="globe-alt">
- * </lc-field-group>
- * ```
+ * Features:
+ * - Consistent label-value layout for read-only data
+ * - Optional leading icon from Heroicons
+ * - Compact mode for dense layouts
+ * - Content projection for custom value rendering
+ * - Configurable icon size (xs, sm, md)
  *
- * @example With custom content via projection
+ * @example
  * ```html
- * <lc-field-group label="Status" icon="check-circle">
- *   <span class="status-badge">Active</span>
- * </lc-field-group>
+ * <lc-field-group label="Email" value="user@example.com" />
+ * <lc-field-group label="Language" value="English" icon="globe-alt" />
  * ```
  */
 declare class FieldGroupComponent {
@@ -3321,24 +3722,21 @@ interface StepperStep {
 }
 type StepState = 'pending' | 'active' | 'completed';
 /**
- * Stepper Component
+ * Stepper component for multi-step wizard workflows.
  *
- * Step-by-step wizard with numbered steps, active/completed/pending states.
- * Emits events when user navigates between steps.
+ * Features:
+ * - Horizontal and vertical orientations
+ * - Active, completed, and pending step states
+ * - Numbered step indicators with checkmark on completion
+ * - Optional step descriptions and "optional" labels
+ * - Linear mode restricting navigation to sequential steps
+ * - Two-way active step binding
+ * - Content projection for step body
  *
  * @example
  * ```html
- * <lc-stepper
- *   [steps]="steps"
- *   [(activeStep)]="currentStep"
- *   (stepChange)="onStep($event)"
- * >
- *   @if (currentStep === 0) {
- *     <div class="step-content">Step 1 content</div>
- *   }
- *   @if (currentStep === 1) {
- *     <div class="step-content">Step 2 content</div>
- *   }
+ * <lc-stepper [steps]="steps" [(activeStep)]="currentStep">
+ *   <div>Step content here</div>
  * </lc-stepper>
  * ```
  */
@@ -3350,7 +3748,7 @@ declare class StepperComponent {
     /** Whether completed steps can be clicked to navigate back */
     linear: _angular_core.InputSignal<boolean>;
     /** Orientation */
-    orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
+    orientation: _angular_core.InputSignal<"horizontal" | "vertical">;
     /** Emitted when active step changes */
     stepChange: _angular_core.OutputEmitterRef<number>;
     /** Computed total step count */
@@ -3399,10 +3797,15 @@ interface FilterValues {
     [key: string]: string;
 }
 /**
- * FilterBar Component
+ * Filter bar component for composable data filtering.
  *
- * Composable filter bar that combines selects, toggle groups, and search
- * in a responsive horizontal layout. Ideal for list pages.
+ * Features:
+ * - Select dropdowns, toggle groups, and search inputs
+ * - Declarative filter configuration via FilterConfig array
+ * - Two-way filter values binding
+ * - Responsive horizontal flex layout
+ * - Size variants (sm, md)
+ * - Dark mode support
  *
  * @example
  * ```html
@@ -3410,7 +3813,7 @@ interface FilterValues {
  *   [filters]="filterConfig"
  *   [values]="currentFilters"
  *   (valuesChange)="onFilterChange($event)"
- * ></lc-filter-bar>
+ * />
  * ```
  */
 declare class FilterBarComponent {
@@ -3440,21 +3843,19 @@ declare class FilterBarComponent {
 
 type SpinnerSize = 'sm' | 'md' | 'lg';
 /**
- * Spinner component for loading states.
+ * Spinner component for loading state indication.
  *
- * Displays a spinning indicator with an optional message.
- * Supports three sizes and respects the design-system color tokens.
+ * Features:
+ * - Animated spinning indicator
+ * - Size variants (sm, md, lg)
+ * - Optional message text below spinner
+ * - Design system color token integration
+ * - Accessible with ARIA status role
  *
  * @example
  * ```html
- * <!-- Simple spinner -->
  * <lc-spinner />
- *
- * <!-- With message -->
- * <lc-spinner message="Loading data..." />
- *
- * <!-- Large spinner -->
- * <lc-spinner size="lg" message="Loading dashboard..." />
+ * <lc-spinner size="lg" message="Loading data..." />
  * ```
  */
 declare class SpinnerComponent {
@@ -3476,22 +3877,18 @@ type SkeletonVariant = 'line' | 'circle' | 'rect';
 /**
  * Skeleton loader component for placeholder loading states.
  *
- * Renders a shimmer-animated placeholder block. Use multiple instances
- * to compose loading skeletons that match your page layout.
+ * Features:
+ * - Variant shapes (text, rect, circle)
+ * - Shimmer animation effect
+ * - Custom width, height, and border radius
+ * - Composable for building complex loading layouts
+ * - Dark mode compatible
  *
  * @example
  * ```html
- * <!-- Text line (default) -->
  * <lc-skeleton />
- *
- * <!-- Custom width/height -->
- * <lc-skeleton width="200px" height="1.75rem" />
- *
- * <!-- Circle avatar placeholder -->
  * <lc-skeleton variant="circle" width="40px" height="40px" />
- *
- * <!-- Full-width rectangle (e.g. chart area) -->
- * <lc-skeleton variant="rect" width="100%" height="400px" borderRadius="0.5rem" />
+ * <lc-skeleton variant="rect" width="100%" height="400px" />
  * ```
  */
 declare class SkeletonComponent {
@@ -3517,24 +3914,21 @@ declare class SkeletonComponent {
 
 type EmptyStateSize = 'sm' | 'md' | 'lg';
 /**
- * Empty-state component for "no data" placeholders.
+ * Empty state component for "no data" placeholder displays.
  *
- * Supports a compact inline mode (inside cards) and a larger page-level mode.
- * An optional icon, heading, description, and projected action slot are supported.
+ * Features:
+ * - Compact (sm) and page-level (md, lg) size modes
+ * - Optional icon from Heroicons library
+ * - Heading and description text
+ * - Action slot for projected CTA buttons
+ * - Centered layout with visual hierarchy
  *
  * @example
  * ```html
- * <!-- Inline / card-level (sm) -->
- * <lc-empty-state
- *   size="sm"
- *   message="No signals generated for this asset yet." />
- *
- * <!-- Page-level with icon + action -->
  * <lc-empty-state
  *   icon="chart-bar"
- *   heading="No Paper Trading Portfolios"
- *   message="Portfolios are created automatically when strategies are promoted."
- * >
+ *   heading="No Data"
+ *   message="No items found.">
  *   <lc-button variant="primary">Get Started</lc-button>
  * </lc-empty-state>
  * ```
@@ -3568,11 +3962,16 @@ declare class EmptyStateComponent {
 type DrawerPosition = 'left' | 'right';
 type DrawerSize = 'sm' | 'md' | 'lg' | 'xl';
 /**
- * Drawer Component — a slide-out overlay panel for supplementary content.
+ * Drawer component for slide-out overlay panels.
  *
- * Unlike the Sidenav (which renders navigation items), the Drawer
- * accepts arbitrary projected content via `<ng-content>`, making it
- * ideal for settings panels, filters, detail views, etc.
+ * Features:
+ * - Slide-in from left, right, top, or bottom
+ * - Size presets (sm, md, lg, xl, full)
+ * - Optional backdrop overlay with click-to-close
+ * - Close on Escape key support
+ * - Heading text display
+ * - Content projection for arbitrary body content
+ * - Accessible with ARIA dialog role
  *
  * @example
  * ```html
@@ -3617,5 +4016,1914 @@ declare class DrawerComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DrawerComponent, "lc-drawer", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "hasOverlay": { "alias": "hasOverlay"; "required": false; "isSignal": true; }; "closeOnOverlayClick": { "alias": "closeOnOverlayClick"; "required": false; "isSignal": true; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["*"], true, never>;
 }
 
-export { AccordionComponent, AlertComponent, AnimationDurationFast, AnimationEasingEaseIn, AnimationEasingEaseInOut, AnimationEasingEaseOut, AvatarComponent, BadgeComponent, BorderRadius2xl, BorderRadiusFull, BorderRadiusLg, BorderRadiusMd, BorderRadiusNone, BorderRadiusSm, BorderRadiusXl, BreadcrumbsComponent, ButtonComponent, CardComponent, CheckboxComponent, ChipComponent, ColorAccentOrange, ColorAccentPurple, ColorAccentRed, ColorAccentRust, ColorAccentViolet, ColorErrorDark, ColorErrorDefault, ColorErrorLight, ColorInfoDark, ColorInfoDefault, ColorInfoLight, ColorNeutral100, ColorNeutral200, ColorNeutral300, ColorNeutral400, ColorNeutral50, ColorNeutral500, ColorNeutral600, ColorNeutral700, ColorNeutral800, ColorNeutral900, ColorPrimary100, ColorPrimary200, ColorPrimary300, ColorPrimary400, ColorPrimary50, ColorPrimary500, ColorPrimary600, ColorPrimary700, ColorPrimary800, ColorPrimary900, ColorSecondary100, ColorSecondary200, ColorSecondary300, ColorSecondary400, ColorSecondary50, ColorSecondary500, ColorSecondary600, ColorSecondary700, ColorSecondary800, ColorSecondary900, ColorSuccessDark, ColorSuccessDefault, ColorSuccessLight, ColorWarningDark, ColorWarningDefault, ColorWarningLight, ContainerComponent, DatepickerComponent, DrawerComponent, Elevation1, Elevation2, Elevation3, Elevation4, EmailInputComponent, EmptyStateComponent, ErrorDisplayComponent, FieldGroupComponent, FilterBarComponent, HeaderComponent, IconComponent, InputComponent, ListComponent, ListItemTemplateDirective, LogoComponent, MenuComponent, MetricCardComponent, ModalComponent, PaginationComponent, PasswordInputComponent, RadioComponent, SectionComponent, SelectComponent, SidenavComponent, SizeInteractiveLgFontSize, SizeInteractiveLgHeight, SizeInteractiveLgPadding, SizeInteractiveMdFontSize, SizeInteractiveMdHeight, SizeInteractiveMdPadding, SizeInteractiveSmFontSize, SizeInteractiveSmHeight, SizeInteractiveSmPadding, SizeInteractiveXsFontSize, SizeInteractiveXsHeight, SizeInteractiveXsPadding, SizeMinTouchHeight, SizeMinTouchWidth, SkeletonComponent, SpacerComponent, Spacing0, Spacing05, Spacing1, Spacing10, Spacing11, Spacing12, Spacing14, Spacing15, Spacing16, Spacing2, Spacing25, Spacing3, Spacing35, Spacing4, Spacing5, Spacing6, Spacing7, Spacing8, Spacing9, SpinnerComponent, StackComponent, StepperComponent, SwitchComponent, TabComponent, TableCellDirective, TableComponent, TabsComponent, TextareaComponent, ThemeService, ToastComponent, ToastService, ToggleGroupComponent, TooltipContentComponent, TooltipDirective, TypographyComponent, TypographyFontFamilyBase, TypographyFontFamilyMono, TypographyFontSize2xl, TypographyFontSize3xl, TypographyFontSize4xl, TypographyFontSize5xl, TypographyFontSize6xl, TypographyFontSizeBase, TypographyFontSizeLg, TypographyFontSizeSm, TypographyFontSizeXl, TypographyFontSizeXs, TypographyFontWeightBold, TypographyFontWeightMedium, TypographyFontWeightNormal, TypographyFontWeightSemibold, TypographyLineHeightNormal, TypographyLineHeightRelaxed, TypographyLineHeightTight, VerificationCodeInputComponent };
-export type { AlertVariant, AvatarSize, AvatarStatus, BadgeSize, BadgeVariant, BreadcrumbItem, BreadcrumbSize, ButtonSize, ButtonType, ButtonVariant, CheckboxSize, ChipSize, ChipVariant, ContainerSize, DateValue, DrawerPosition, DrawerSize, EmptyStateSize, ErrorSeverity, FilterConfig, FilterOption, FilterValues, IconSize, IconVariant, ListItem, ListOrientation, ListVariant, MenuItem, ModalSize, NavigationItem, PaginationSize, PasswordRequirement, PasswordStrength, RadioSize, SectionBackground, SectionSpacing, SelectOption, SelectOptionGroup, SelectValue, SidenavMode, SidenavPosition, SkeletonVariant, SortEvent, SpacerSize, SpinnerSize, StackAlign, StackDirection, StackGap, StackJustify, StepState, StepperStep, TabOrientation, TableColumn, TableSize, TableVariant, ThemeConfig, ThemeMode, ThemeState, Toast, ToastAction, ToastConfig, ToastPosition, ToastVariant, ToggleOption, TooltipPosition, TrendDirection };
+interface TimelineItem {
+    /** Title of the event */
+    title: string;
+    /** Optional description */
+    description?: string;
+    /** Optional timestamp string */
+    timestamp?: string;
+    /** Optional icon name (heroicon) */
+    icon?: string;
+    /** Optional color for the dot/icon */
+    color?: 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info' | 'neutral';
+}
+type TimelineOrientation = 'vertical' | 'horizontal';
+/**
+ * Timeline component for chronological event display.
+ *
+ * Features:
+ * - Vertical timeline with connecting line
+ * - Semantic status colors per event (info, success, warning, error)
+ * - Date and description display per item
+ * - Icon support for timeline markers
+ * - Dark mode support
+ *
+ * @example
+ * ```html
+ * <lc-timeline [items]="events"></lc-timeline>
+ * ```
+ */
+declare class TimelineComponent {
+    /**
+     * List of timeline events.
+     */
+    items: _angular_core.InputSignal<TimelineItem[]>;
+    /**
+     * Layout orientation.
+     * @default 'vertical'
+     */
+    orientation: _angular_core.InputSignal<TimelineOrientation>;
+    /**
+     * Compact mode reduces spacing.
+     * @default false
+     */
+    compact: _angular_core.InputSignal<boolean>;
+    protected timelineClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TimelineComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TimelineComponent, "lc-timeline", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface AvatarGroupItem {
+    /** Image source URL */
+    src?: string;
+    /** Alt text */
+    alt?: string;
+    /** Full name for initials fallback */
+    name?: string;
+}
+declare class AvatarGroupComponent {
+    /** List of avatars to show */
+    avatars: _angular_core.InputSignal<AvatarGroupItem[]>;
+    /** Avatar size */
+    size: _angular_core.InputSignal<AvatarSize>;
+    /** Maximum visible avatars before showing overflow count */
+    max: _angular_core.InputSignal<number>;
+    protected visibleAvatars: _angular_core.Signal<AvatarGroupItem[]>;
+    protected overflowCount: _angular_core.Signal<number>;
+    protected groupClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AvatarGroupComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AvatarGroupComponent, "lc-avatar-group", never, { "avatars": { "alias": "avatars"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class SliderComponent implements ControlValueAccessor {
+    /** Minimum value */
+    min: _angular_core.InputSignal<number>;
+    /** Maximum value */
+    max: _angular_core.InputSignal<number>;
+    /** Step increment */
+    step: _angular_core.InputSignal<number>;
+    /** Label text */
+    label: _angular_core.InputSignal<string | undefined>;
+    /** Whether to show the current value */
+    showValue: _angular_core.InputSignal<boolean>;
+    /** Disabled state */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Emits the current value on change */
+    valueChange: _angular_core.OutputEmitterRef<number>;
+    /** Internal value */
+    protected value: _angular_core.WritableSignal<number>;
+    /** Internal disabled state — merged from input + CVA */
+    protected isDisabled: _angular_core.WritableSignal<boolean>;
+    /** Percentage for fill track */
+    protected fillPercentage: _angular_core.Signal<number>;
+    protected sliderClasses: _angular_core.Signal<string>;
+    private onChange;
+    private onTouched;
+    onInput(event: Event): void;
+    onBlur(): void;
+    writeValue(val: number): void;
+    registerOnChange(fn: (val: number) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SliderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SliderComponent, "lc-slider", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+}
+
+declare class NumberInputComponent implements ControlValueAccessor {
+    /** Minimum value */
+    min: _angular_core.InputSignal<number | undefined>;
+    /** Maximum value */
+    max: _angular_core.InputSignal<number | undefined>;
+    /** Step increment */
+    step: _angular_core.InputSignal<number>;
+    /** Label text */
+    label: _angular_core.InputSignal<string | undefined>;
+    /** Placeholder */
+    placeholder: _angular_core.InputSignal<string>;
+    /** Disabled state */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Emits value on change */
+    valueChange: _angular_core.OutputEmitterRef<number>;
+    protected value: _angular_core.WritableSignal<number | null>;
+    protected isDisabled: _angular_core.WritableSignal<boolean>;
+    protected containerClasses: _angular_core.Signal<string>;
+    protected canDecrement: _angular_core.Signal<boolean>;
+    protected canIncrement: _angular_core.Signal<boolean>;
+    private onChange;
+    private onTouched;
+    decrement(): void;
+    increment(): void;
+    onInput(event: Event): void;
+    onBlur(): void;
+    private setValue;
+    writeValue(val: number | null): void;
+    registerOnChange(fn: (val: number | null) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NumberInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NumberInputComponent, "lc-number-input", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+}
+
+type CalloutVariant = 'info' | 'success' | 'warning' | 'error' | 'neutral';
+declare class CalloutComponent {
+    /** Visual variant */
+    variant: _angular_core.InputSignal<CalloutVariant>;
+    /** Title text (optional) */
+    title: _angular_core.InputSignal<string | undefined>;
+    /** Whether the callout can be dismissed */
+    dismissible: _angular_core.InputSignal<boolean>;
+    /** Emits when dismiss button is clicked */
+    dismissed: _angular_core.OutputEmitterRef<void>;
+    protected visible: _angular_core.WritableSignal<boolean>;
+    protected calloutClasses: _angular_core.Signal<string>;
+    protected iconName: _angular_core.Signal<string>;
+    dismiss(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CalloutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CalloutComponent, "lc-callout", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "dismissed": "dismissed"; }, never, ["*"], true, never>;
+}
+
+type RatingSize = 'sm' | 'md' | 'lg';
+declare class RatingComponent implements ControlValueAccessor {
+    /** Maximum number of stars */
+    max: _angular_core.InputSignal<number>;
+    /** Size variant */
+    size: _angular_core.InputSignal<RatingSize>;
+    /** Whether the rating is read-only */
+    readonly: _angular_core.InputSignal<boolean>;
+    /** Whether the rating is disabled */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Whether to allow half-star ratings */
+    allowHalf: _angular_core.InputSignal<boolean>;
+    /** Label text */
+    label: _angular_core.InputSignal<string | undefined>;
+    /** Whether to show the numeric value */
+    showValue: _angular_core.InputSignal<boolean>;
+    /** Emits the selected rating */
+    ratingChange: _angular_core.OutputEmitterRef<number>;
+    protected value: _angular_core.WritableSignal<number>;
+    protected hoveredValue: _angular_core.WritableSignal<number>;
+    protected isDisabled: _angular_core.WritableSignal<boolean>;
+    protected stars: _angular_core.Signal<number[]>;
+    protected ratingClasses: _angular_core.Signal<string>;
+    protected getStarState(star: number): 'full' | 'half' | 'empty';
+    protected getStarIcon(star: number): string;
+    protected isStarFilled(star: number): boolean;
+    protected isStarHalf(star: number): boolean;
+    protected onStarClick(star: number): void;
+    protected onStarHover(star: number): void;
+    protected onMouseLeave(): void;
+    private onChange;
+    private onTouched;
+    writeValue(val: number): void;
+    registerOnChange(fn: (val: number) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RatingComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RatingComponent, "lc-rating", never, { "max": { "alias": "max"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "allowHalf": { "alias": "allowHalf"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; }, { "ratingChange": "ratingChange"; }, never, never, true, never>;
+}
+
+declare class ColorPickerComponent implements ControlValueAccessor {
+    /** Label text */
+    label: _angular_core.InputSignal<string | undefined>;
+    /** Predefined color swatches */
+    swatches: _angular_core.InputSignal<string[]>;
+    /** Whether to show the hex input field */
+    showInput: _angular_core.InputSignal<boolean>;
+    /** Whether the picker is disabled */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Emits the selected color hex value */
+    colorChange: _angular_core.OutputEmitterRef<string>;
+    protected value: _angular_core.WritableSignal<string>;
+    protected isDisabled: _angular_core.WritableSignal<boolean>;
+    protected pickerClasses: _angular_core.Signal<string>;
+    private onChange;
+    private onTouched;
+    protected selectSwatch(color: string): void;
+    protected onNativeInput(event: Event): void;
+    protected onHexInput(event: Event): void;
+    protected onBlur(): void;
+    private setValue;
+    writeValue(val: string): void;
+    registerOnChange(fn: (val: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ColorPickerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ColorPickerComponent, "lc-color-picker", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "swatches": { "alias": "swatches"; "required": false; "isSignal": true; }; "showInput": { "alias": "showInput"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "colorChange": "colorChange"; }, never, never, true, never>;
+}
+
+type CodeBlockLanguage = 'typescript' | 'javascript' | 'html' | 'css' | 'scss' | 'json' | 'bash' | 'python' | 'java' | 'text';
+declare class CodeBlockComponent {
+    private sanitizer;
+    /** Code content to display */
+    code: _angular_core.InputSignal<string>;
+    /** Language label */
+    language: _angular_core.InputSignal<CodeBlockLanguage>;
+    /** Optional filename to display */
+    filename: _angular_core.InputSignal<string | undefined>;
+    /** Whether to show line numbers */
+    showLineNumbers: _angular_core.InputSignal<boolean>;
+    /** Whether to show copy button */
+    showCopy: _angular_core.InputSignal<boolean>;
+    /** Whether the code block has a header bar */
+    showHeader: _angular_core.InputSignal<boolean>;
+    protected copied: _angular_core.WritableSignal<boolean>;
+    constructor(sanitizer: DomSanitizer);
+    protected highlightedLines: _angular_core.Signal<SafeHtml[]>;
+    protected lineNumbers: _angular_core.Signal<number[]>;
+    protected headerLabel: _angular_core.Signal<string>;
+    protected codeClasses: _angular_core.Signal<string>;
+    protected copyToClipboard(): Promise<void>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CodeBlockComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CodeBlockComponent, "lc-code-block", never, { "code": { "alias": "code"; "required": true; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "filename": { "alias": "filename"; "required": false; "isSignal": true; }; "showLineNumbers": { "alias": "showLineNumbers"; "required": false; "isSignal": true; }; "showCopy": { "alias": "showCopy"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface FooterLink {
+    /** Display label */
+    label: string;
+    /** URL or route */
+    href: string;
+    /** Whether it opens in a new tab */
+    external?: boolean;
+}
+interface FooterSection {
+    /** Section heading */
+    title: string;
+    /** Links in this section */
+    links: FooterLink[];
+}
+type FooterVariant = 'default' | 'primary' | 'dark' | 'neutral';
+declare class FooterComponent {
+    /** Footer navigation sections */
+    sections: _angular_core.InputSignal<FooterSection[]>;
+    /** Copyright text */
+    copyright: _angular_core.InputSignal<string | undefined>;
+    /** Whether to show a top border */
+    showBorder: _angular_core.InputSignal<boolean>;
+    /** Compact layout (single row) */
+    compact: _angular_core.InputSignal<boolean>;
+    /** Color variant */
+    variant: _angular_core.InputSignal<FooterVariant>;
+    protected footerClasses: _angular_core.Signal<string>;
+    protected currentYear: number;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FooterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FooterComponent, "lc-footer", never, { "sections": { "alias": "sections"; "required": false; "isSignal": true; }; "copyright": { "alias": "copyright"; "required": false; "isSignal": true; }; "showBorder": { "alias": "showBorder"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+type SparklineColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+type SparklineCurve = 'linear' | 'smooth';
+declare class SparklineComponent {
+    /** Data points to plot. */
+    data: _angular_core.InputSignal<number[]>;
+    /** Stroke color theme. */
+    color: _angular_core.InputSignal<SparklineColor>;
+    /** Width of the SVG in pixels. */
+    width: _angular_core.InputSignal<number>;
+    /** Height of the SVG in pixels. */
+    height: _angular_core.InputSignal<number>;
+    /** Stroke width in pixels. */
+    strokeWidth: _angular_core.InputSignal<number>;
+    /** Show a filled area under the line. */
+    filled: _angular_core.InputSignal<boolean>;
+    /** Curve interpolation mode. */
+    curve: _angular_core.InputSignal<SparklineCurve>;
+    /** Show a dot on the last data point. */
+    showEndDot: _angular_core.InputSignal<boolean>;
+    protected readonly colorVar: _angular_core.Signal<string>;
+    protected readonly fillColorVar: _angular_core.Signal<string>;
+    protected readonly pathD: _angular_core.Signal<string>;
+    protected readonly areaD: _angular_core.Signal<string>;
+    protected readonly endDot: _angular_core.Signal<{
+        cx: number;
+        cy: number;
+        r: number;
+    } | null>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SparklineComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SparklineComponent, "lc-sparkline", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "filled": { "alias": "filled"; "required": false; "isSignal": true; }; "curve": { "alias": "curve"; "required": false; "isSignal": true; }; "showEndDot": { "alias": "showEndDot"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type StatTrendDirection = 'up' | 'down' | 'neutral';
+declare class StatTrendComponent {
+    /** Main KPI label. */
+    label: _angular_core.InputSignal<string>;
+    /** Main KPI value to display. */
+    value: _angular_core.InputSignal<string>;
+    /** Change value text, e.g. "+12%" or "-3.5%". */
+    change: _angular_core.InputSignal<string>;
+    /** Trend direction for color coding. Auto-detected from change if not set. */
+    direction: _angular_core.InputSignal<StatTrendDirection | undefined>;
+    /** Sparkline data points. If empty, no sparkline is shown. */
+    sparklineData: _angular_core.InputSignal<number[]>;
+    /** Color of the sparkline. Auto-matched to trend direction if not set. */
+    sparklineColor: _angular_core.InputSignal<SparklineColor | undefined>;
+    /** Optional icon name (Heroicon). */
+    icon: _angular_core.InputSignal<string>;
+    protected readonly resolvedDirection: _angular_core.Signal<StatTrendDirection>;
+    protected readonly trendColorClass: _angular_core.Signal<string>;
+    protected readonly resolvedSparklineColor: _angular_core.Signal<SparklineColor>;
+    protected readonly trendIcon: _angular_core.Signal<string>;
+    protected readonly hasSparkline: _angular_core.Signal<boolean>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StatTrendComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StatTrendComponent, "lc-stat-trend", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "change": { "alias": "change"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "sparklineData": { "alias": "sparklineData"; "required": false; "isSignal": true; }; "sparklineColor": { "alias": "sparklineColor"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface DonutSegment {
+    value: number;
+    label?: string;
+    color?: string;
+}
+type DonutChartSize = 'sm' | 'md' | 'lg';
+declare class DonutChartComponent {
+    /** Segments to render. */
+    segments: _angular_core.InputSignal<DonutSegment[]>;
+    /** Size preset. */
+    size: _angular_core.InputSignal<DonutChartSize>;
+    /** Thickness of the donut ring (0-1 ratio of radius). */
+    thickness: _angular_core.InputSignal<number>;
+    /** Show the center label area. */
+    showCenter: _angular_core.InputSignal<boolean>;
+    /** Center label text. */
+    centerLabel: _angular_core.InputSignal<string>;
+    /** Center value text (large number). */
+    centerValue: _angular_core.InputSignal<string>;
+    /** Show legend below the chart. */
+    showLegend: _angular_core.InputSignal<boolean>;
+    protected readonly sizeMap: Record<DonutChartSize, number>;
+    protected readonly svgSize: _angular_core.Signal<number>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly center: _angular_core.Signal<number>;
+    protected readonly outerRadius: _angular_core.Signal<number>;
+    protected readonly innerRadius: _angular_core.Signal<number>;
+    protected readonly arcs: _angular_core.Signal<{
+        d: string;
+        color: string;
+        label: string;
+        value: number;
+        percentage: number;
+    }[]>;
+    protected readonly legendItems: _angular_core.Signal<{
+        color: string;
+        label: string;
+        value: number;
+        percentage: number;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DonutChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DonutChartComponent, "lc-donut-chart", never, { "segments": { "alias": "segments"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "thickness": { "alias": "thickness"; "required": false; "isSignal": true; }; "showCenter": { "alias": "showCenter"; "required": false; "isSignal": true; }; "centerLabel": { "alias": "centerLabel"; "required": false; "isSignal": true; }; "centerValue": { "alias": "centerValue"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface BarChartItem {
+    value: number;
+    label?: string;
+    color?: string;
+}
+type BarChartOrientation = 'vertical' | 'horizontal';
+declare class BarChartComponent {
+    /** Data items. */
+    data: _angular_core.InputSignal<BarChartItem[]>;
+    /** Chart width in pixels. */
+    width: _angular_core.InputSignal<number>;
+    /** Chart height in pixels. */
+    height: _angular_core.InputSignal<number>;
+    /** Bar orientation. */
+    orientation: _angular_core.InputSignal<BarChartOrientation>;
+    /** Show value labels on bars. */
+    showValues: _angular_core.InputSignal<boolean>;
+    /** Show axis labels. */
+    showLabels: _angular_core.InputSignal<boolean>;
+    /** Show grid lines. */
+    showGrid: _angular_core.InputSignal<boolean>;
+    /** Gap between bars as ratio (0-1). */
+    barGap: _angular_core.InputSignal<number>;
+    /** Use a single color for all bars. */
+    color: _angular_core.InputSignal<string>;
+    private readonly PADDING_LEFT;
+    private readonly PADDING_RIGHT;
+    private readonly PADDING_TOP;
+    private readonly PADDING_BOTTOM;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly maxValue: _angular_core.Signal<number>;
+    protected readonly gridLines: _angular_core.Signal<{
+        y: number;
+        label: string;
+    }[]>;
+    protected readonly bars: _angular_core.Signal<{
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+        color: string;
+        label: string;
+        value: number;
+        labelX: number;
+        labelY: number;
+        valueX: number;
+        valueY: number;
+    }[]>;
+    protected readonly isVertical: _angular_core.Signal<boolean>;
+    protected readonly axisLine: _angular_core.Signal<{
+        x1: number;
+        y1: number;
+        x2: number;
+        y2: number;
+        bx1: number;
+        by1: number;
+        bx2: number;
+        by2: number;
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BarChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BarChartComponent, "lc-bar-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "showValues": { "alias": "showValues"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "showGrid": { "alias": "showGrid"; "required": false; "isSignal": true; }; "barGap": { "alias": "barGap"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface LineChartSeries {
+    label: string;
+    data: number[];
+    color?: string;
+}
+declare class LineChartComponent {
+    /** One or more data series. */
+    series: _angular_core.InputSignal<LineChartSeries[]>;
+    /** X-axis labels. */
+    labels: _angular_core.InputSignal<string[]>;
+    /** Chart width in pixels. */
+    width: _angular_core.InputSignal<number>;
+    /** Chart height in pixels. */
+    height: _angular_core.InputSignal<number>;
+    /** Stroke width for lines. */
+    strokeWidth: _angular_core.InputSignal<number>;
+    /** Show dots at data points. */
+    showDots: _angular_core.InputSignal<boolean>;
+    /** Show grid lines. */
+    showGrid: _angular_core.InputSignal<boolean>;
+    /** Show X-axis labels. */
+    showXLabels: _angular_core.InputSignal<boolean>;
+    /** Show Y-axis labels. */
+    showYLabels: _angular_core.InputSignal<boolean>;
+    /** Show area fill under lines. */
+    filled: _angular_core.InputSignal<boolean>;
+    /** Show legend. */
+    showLegend: _angular_core.InputSignal<boolean>;
+    /** Use smooth curves. */
+    smooth: _angular_core.InputSignal<boolean>;
+    private readonly PL;
+    private readonly PR;
+    private readonly PT;
+    private readonly PB;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly allValues: _angular_core.Signal<number[]>;
+    protected readonly minValue: _angular_core.Signal<number>;
+    protected readonly maxValue: _angular_core.Signal<number>;
+    protected readonly maxDataLength: _angular_core.Signal<number>;
+    protected readonly plotArea: _angular_core.Signal<{
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    }>;
+    protected readonly gridLines: _angular_core.Signal<{
+        y: number;
+        label: string;
+    }[]>;
+    protected readonly xLabels: _angular_core.Signal<{
+        x: number;
+        y: number;
+        label: string;
+    }[]>;
+    protected readonly renderedSeries: _angular_core.Signal<{
+        label: string;
+        color: string;
+        pathD: string;
+        areaD: string;
+        points: {
+            x: number;
+            y: number;
+        }[];
+    }[]>;
+    protected readonly axisLine: _angular_core.Signal<{
+        vx1: number;
+        vy1: number;
+        vx2: number;
+        vy2: number;
+        hx1: number;
+        hy1: number;
+        hx2: number;
+        hy2: number;
+    }>;
+    protected readonly legendItems: _angular_core.Signal<{
+        label: string;
+        color: string;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LineChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LineChartComponent, "lc-line-chart", never, { "series": { "alias": "series"; "required": true; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "showDots": { "alias": "showDots"; "required": false; "isSignal": true; }; "showGrid": { "alias": "showGrid"; "required": false; "isSignal": true; }; "showXLabels": { "alias": "showXLabels"; "required": false; "isSignal": true; }; "showYLabels": { "alias": "showYLabels"; "required": false; "isSignal": true; }; "filled": { "alias": "filled"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; "smooth": { "alias": "smooth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type GaugeColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+type GaugeSize = 'sm' | 'md' | 'lg';
+declare class GaugeComponent {
+    /** Value between 0 and max. */
+    value: _angular_core.InputSignal<number>;
+    /** Maximum value. */
+    max: _angular_core.InputSignal<number>;
+    /** Color theme. */
+    color: _angular_core.InputSignal<GaugeColor>;
+    /** Size preset. */
+    size: _angular_core.InputSignal<GaugeSize>;
+    /** Label text below the value. */
+    label: _angular_core.InputSignal<string>;
+    /** Value suffix (e.g. '%', '°C'). */
+    suffix: _angular_core.InputSignal<string>;
+    /** Show the value in the center. */
+    showValue: _angular_core.InputSignal<boolean>;
+    private readonly SIZE_MAP;
+    protected readonly svgSize: _angular_core.Signal<number>;
+    protected readonly svgHeight: _angular_core.Signal<number>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly cx: _angular_core.Signal<number>;
+    protected readonly cy: _angular_core.Signal<number>;
+    protected readonly radius: _angular_core.Signal<number>;
+    protected readonly strokeW: _angular_core.Signal<number>;
+    protected readonly fraction: _angular_core.Signal<number>;
+    protected readonly trackD: _angular_core.Signal<string>;
+    protected readonly valueD: _angular_core.Signal<string>;
+    protected readonly displayValue: _angular_core.Signal<string>;
+    protected readonly valueFontSize: _angular_core.Signal<string>;
+    protected readonly labelFontSize: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<GaugeComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<GaugeComponent, "lc-gauge", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface StackedBarCategory {
+    label: string;
+    values: number[];
+}
+interface StackedBarLegend {
+    label: string;
+    color?: string;
+}
+type StackedBarOrientation = 'vertical' | 'horizontal';
+declare class StackedBarChartComponent {
+    /** Categories with stacked values. */
+    categories: _angular_core.InputSignal<StackedBarCategory[]>;
+    /** Legend items mapping to each value index. */
+    legends: _angular_core.InputSignal<StackedBarLegend[]>;
+    width: _angular_core.InputSignal<number>;
+    height: _angular_core.InputSignal<number>;
+    orientation: _angular_core.InputSignal<StackedBarOrientation>;
+    showLabels: _angular_core.InputSignal<boolean>;
+    showValues: _angular_core.InputSignal<boolean>;
+    showLegend: _angular_core.InputSignal<boolean>;
+    showGrid: _angular_core.InputSignal<boolean>;
+    barGap: _angular_core.InputSignal<number>;
+    private readonly PL;
+    private readonly PR;
+    private readonly PT;
+    private readonly PB;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly maxTotal: _angular_core.Signal<number>;
+    protected readonly gridLines: _angular_core.Signal<{
+        y: number;
+        label: string;
+    }[]>;
+    protected readonly stacks: _angular_core.Signal<{
+        label: string;
+        segments: {
+            color: string;
+            value: number;
+            x: number;
+            y: number;
+            w: number;
+            h: number;
+        }[];
+        labelPos: {
+            x: number;
+            y: number;
+        };
+        total: number;
+    }[]>;
+    protected readonly legendItems: _angular_core.Signal<{
+        label: string;
+        color: string;
+    }[]>;
+    protected readonly isVertical: _angular_core.Signal<boolean>;
+    protected readonly axisLine: _angular_core.Signal<{
+        vx1: number;
+        vy1: number;
+        vx2: number;
+        vy2: number;
+        hx1: number;
+        hy1: number;
+        hx2: number;
+        hy2: number;
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StackedBarChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StackedBarChartComponent, "lc-stacked-bar-chart", never, { "categories": { "alias": "categories"; "required": true; "isSignal": true; }; "legends": { "alias": "legends"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "showValues": { "alias": "showValues"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; "showGrid": { "alias": "showGrid"; "required": false; "isSignal": true; }; "barGap": { "alias": "barGap"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface AreaChartSeries {
+    label: string;
+    data: number[];
+    color?: string;
+}
+declare class AreaChartComponent {
+    series: _angular_core.InputSignal<AreaChartSeries[]>;
+    labels: _angular_core.InputSignal<string[]>;
+    width: _angular_core.InputSignal<number>;
+    height: _angular_core.InputSignal<number>;
+    strokeWidth: _angular_core.InputSignal<number>;
+    showDots: _angular_core.InputSignal<boolean>;
+    showGrid: _angular_core.InputSignal<boolean>;
+    showXLabels: _angular_core.InputSignal<boolean>;
+    showYLabels: _angular_core.InputSignal<boolean>;
+    showLegend: _angular_core.InputSignal<boolean>;
+    smooth: _angular_core.InputSignal<boolean>;
+    /** Opacity for the filled area (0–1). */
+    fillOpacity: _angular_core.InputSignal<number>;
+    /** Stack areas on top of each other. */
+    stacked: _angular_core.InputSignal<boolean>;
+    private readonly PL;
+    private readonly PR;
+    private readonly PT;
+    private readonly PB;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly plotArea: _angular_core.Signal<{
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    }>;
+    protected readonly computedSeries: _angular_core.Signal<{
+        computedData: number[];
+        prevData: number[] | null;
+        label: string;
+        data: number[];
+        color?: string;
+    }[]>;
+    protected readonly minValue: _angular_core.Signal<number>;
+    protected readonly maxValue: _angular_core.Signal<number>;
+    protected readonly gridLines: _angular_core.Signal<{
+        y: number;
+        label: string;
+    }[]>;
+    protected readonly xLabelItems: _angular_core.Signal<{
+        x: number;
+        y: number;
+        label: string;
+    }[]>;
+    private toPoints;
+    private buildPath;
+    protected readonly renderedSeries: _angular_core.Signal<{
+        label: string;
+        color: string;
+        lineD: string;
+        areaD: string;
+        points: {
+            x: number;
+            y: number;
+        }[];
+    }[]>;
+    protected readonly axisLine: _angular_core.Signal<{
+        vx1: number;
+        vy1: number;
+        vx2: number;
+        vy2: number;
+        hx1: number;
+        hy1: number;
+        hx2: number;
+        hy2: number;
+    }>;
+    protected readonly legendItems: _angular_core.Signal<{
+        label: string;
+        color: string;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AreaChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AreaChartComponent, "lc-area-chart", never, { "series": { "alias": "series"; "required": true; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "showDots": { "alias": "showDots"; "required": false; "isSignal": true; }; "showGrid": { "alias": "showGrid"; "required": false; "isSignal": true; }; "showXLabels": { "alias": "showXLabels"; "required": false; "isSignal": true; }; "showYLabels": { "alias": "showYLabels"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; "smooth": { "alias": "smooth"; "required": false; "isSignal": true; }; "fillOpacity": { "alias": "fillOpacity"; "required": false; "isSignal": true; }; "stacked": { "alias": "stacked"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface HeatmapCell {
+    row: number;
+    col: number;
+    value: number;
+}
+declare class HeatmapComponent {
+    /** 2D data: array of rows, each row an array of values. */
+    data: _angular_core.InputSignal<number[][]>;
+    /** Row labels (Y axis). */
+    rowLabels: _angular_core.InputSignal<string[]>;
+    /** Column labels (X axis). */
+    colLabels: _angular_core.InputSignal<string[]>;
+    /** Cell size in pixels. */
+    cellSize: _angular_core.InputSignal<number>;
+    /** Gap between cells in pixels. */
+    cellGap: _angular_core.InputSignal<number>;
+    /** Low-value color. */
+    colorMin: _angular_core.InputSignal<string>;
+    /** High-value color. */
+    colorMax: _angular_core.InputSignal<string>;
+    /** Show values inside cells. */
+    showValues: _angular_core.InputSignal<boolean>;
+    /** Corner radius of cells. */
+    cellRadius: _angular_core.InputSignal<number>;
+    private readonly LABEL_W;
+    private readonly LABEL_H;
+    protected readonly minVal: _angular_core.Signal<number>;
+    protected readonly maxVal: _angular_core.Signal<number>;
+    protected readonly rows: _angular_core.Signal<number>;
+    protected readonly cols: _angular_core.Signal<number>;
+    protected readonly svgWidth: _angular_core.Signal<number>;
+    protected readonly svgHeight: _angular_core.Signal<number>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly offsetX: _angular_core.Signal<0 | 60>;
+    protected readonly offsetY: _angular_core.Signal<0 | 20>;
+    protected readonly cells: _angular_core.Signal<{
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+        value: number;
+        opacity: number;
+    }[]>;
+    protected readonly rowLabelItems: _angular_core.Signal<{
+        x: number;
+        y: number;
+        label: string;
+    }[]>;
+    protected readonly colLabelItems: _angular_core.Signal<{
+        x: number;
+        y: number;
+        label: string;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HeatmapComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<HeatmapComponent, "lc-heatmap", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "rowLabels": { "alias": "rowLabels"; "required": false; "isSignal": true; }; "colLabels": { "alias": "colLabels"; "required": false; "isSignal": true; }; "cellSize": { "alias": "cellSize"; "required": false; "isSignal": true; }; "cellGap": { "alias": "cellGap"; "required": false; "isSignal": true; }; "colorMin": { "alias": "colorMin"; "required": false; "isSignal": true; }; "colorMax": { "alias": "colorMax"; "required": false; "isSignal": true; }; "showValues": { "alias": "showValues"; "required": false; "isSignal": true; }; "cellRadius": { "alias": "cellRadius"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface PieSegment {
+    value: number;
+    label?: string;
+    color?: string;
+}
+type PieChartSize = 'sm' | 'md' | 'lg';
+declare class PieChartComponent {
+    segments: _angular_core.InputSignal<PieSegment[]>;
+    size: _angular_core.InputSignal<PieChartSize>;
+    showLegend: _angular_core.InputSignal<boolean>;
+    private readonly SIZE_MAP;
+    protected readonly svgSize: _angular_core.Signal<number>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly center: _angular_core.Signal<number>;
+    protected readonly radius: _angular_core.Signal<number>;
+    protected readonly arcs: _angular_core.Signal<{
+        d: string;
+        color: string;
+        label: string;
+        percentage: number;
+    }[]>;
+    protected readonly legendItems: _angular_core.Signal<{
+        color: string;
+        label: string;
+        percentage: number;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PieChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PieChartComponent, "lc-pie-chart", never, { "segments": { "alias": "segments"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface RadarChartSeries {
+    label: string;
+    data: number[];
+    color?: string;
+}
+declare class RadarChartComponent {
+    series: _angular_core.InputSignal<RadarChartSeries[]>;
+    /** Axis labels. */
+    axes: _angular_core.InputSignal<string[]>;
+    /** Max value for each axis. */
+    max: _angular_core.InputSignal<number>;
+    /** SVG size in pixels. */
+    size: _angular_core.InputSignal<number>;
+    /** Number of concentric grid rings. */
+    rings: _angular_core.InputSignal<number>;
+    /** Show axis labels. */
+    showLabels: _angular_core.InputSignal<boolean>;
+    /** Fill opacity for series polygons. */
+    fillOpacity: _angular_core.InputSignal<number>;
+    /** Show legend. */
+    showLegend: _angular_core.InputSignal<boolean>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly center: _angular_core.Signal<number>;
+    protected readonly radius: _angular_core.Signal<number>;
+    protected readonly axisCount: _angular_core.Signal<number>;
+    protected readonly gridRings: _angular_core.Signal<string[]>;
+    protected readonly axisLines: _angular_core.Signal<{
+        x2: number;
+        y2: number;
+    }[]>;
+    protected readonly labelItems: _angular_core.Signal<{
+        x: number;
+        y: number;
+        label: string;
+        anchor: string;
+    }[]>;
+    protected readonly seriesPolygons: _angular_core.Signal<{
+        points: string;
+        colorIndex: number;
+        customColor: string | null;
+        label: string;
+    }[]>;
+    protected readonly legendItems: _angular_core.Signal<{
+        label: string;
+        colorIndex: number;
+        customColor: string | null;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadarChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadarChartComponent, "lc-radar-chart", never, { "series": { "alias": "series"; "required": true; "isSignal": true; }; "axes": { "alias": "axes"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "rings": { "alias": "rings"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "fillOpacity": { "alias": "fillOpacity"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type ProgressRingColor = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+type ProgressRingSize = 'xs' | 'sm' | 'md' | 'lg';
+declare class ProgressRingComponent {
+    /** Value between 0 and 100. */
+    value: _angular_core.InputSignal<number>;
+    /** Color theme. */
+    color: _angular_core.InputSignal<ProgressRingColor>;
+    /** Size preset. */
+    size: _angular_core.InputSignal<ProgressRingSize>;
+    /** Show percentage text in center. */
+    showValue: _angular_core.InputSignal<boolean>;
+    private readonly SIZE_MAP;
+    private readonly STROKE_MAP;
+    protected readonly svgSize: _angular_core.Signal<number>;
+    protected readonly strokeW: _angular_core.Signal<number>;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly center: _angular_core.Signal<number>;
+    protected readonly radius: _angular_core.Signal<number>;
+    protected readonly circumference: _angular_core.Signal<number>;
+    protected readonly dashOffset: _angular_core.Signal<number>;
+    protected readonly fontSize: _angular_core.Signal<string>;
+    protected readonly displayValue: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProgressRingComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProgressRingComponent, "lc-progress-ring", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showValue": { "alias": "showValue"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface WaterfallItem {
+    label: string;
+    value: number;
+    /** 'total' renders from 0 to value instead of incremental. */
+    type?: 'increase' | 'decrease' | 'total';
+}
+declare class WaterfallChartComponent {
+    data: _angular_core.InputSignal<WaterfallItem[]>;
+    width: _angular_core.InputSignal<number>;
+    height: _angular_core.InputSignal<number>;
+    showValues: _angular_core.InputSignal<boolean>;
+    showGrid: _angular_core.InputSignal<boolean>;
+    showConnectors: _angular_core.InputSignal<boolean>;
+    increaseColor: _angular_core.InputSignal<string>;
+    decreaseColor: _angular_core.InputSignal<string>;
+    totalColor: _angular_core.InputSignal<string>;
+    barGap: _angular_core.InputSignal<number>;
+    private readonly PL;
+    private readonly PR;
+    private readonly PT;
+    private readonly PB;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly computedBars: _angular_core.Signal<{
+        bars: {
+            x: number;
+            y: number;
+            width: number;
+            height: number;
+            color: string;
+            label: string;
+            value: number;
+            labelX: number;
+            labelY: number;
+            valueY: number;
+            endVal: number;
+        }[];
+        connectors: {
+            x1: number;
+            x2: number;
+            y: number;
+        }[];
+        gridLines: {
+            y: number;
+            label: string;
+        }[];
+    }>;
+    protected readonly axisLine: _angular_core.Signal<{
+        vx1: number;
+        vy1: number;
+        vx2: number;
+        vy2: number;
+        hx1: number;
+        hy1: number;
+        hx2: number;
+        hy2: number;
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WaterfallChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WaterfallChartComponent, "lc-waterfall-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "showValues": { "alias": "showValues"; "required": false; "isSignal": true; }; "showGrid": { "alias": "showGrid"; "required": false; "isSignal": true; }; "showConnectors": { "alias": "showConnectors"; "required": false; "isSignal": true; }; "increaseColor": { "alias": "increaseColor"; "required": false; "isSignal": true; }; "decreaseColor": { "alias": "decreaseColor"; "required": false; "isSignal": true; }; "totalColor": { "alias": "totalColor"; "required": false; "isSignal": true; }; "barGap": { "alias": "barGap"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type CalendarView = 'day' | 'week' | 'month';
+interface CalendarEvent {
+    id: string;
+    title: string;
+    start: Date | string;
+    end: Date | string;
+    color?: 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+    allDay?: boolean;
+}
+interface DayCell {
+    date: Date;
+    isToday: boolean;
+    isCurrentMonth: boolean;
+    events: CalendarEvent[];
+}
+interface HourSlot {
+    hour: number;
+    label: string;
+}
+declare class CalendarComponent {
+    /** Current view mode. */
+    view: _angular_core.InputSignal<CalendarView>;
+    /** Events to display. */
+    events: _angular_core.InputSignal<CalendarEvent[]>;
+    /** First day of week (0=Sunday, 1=Monday). */
+    firstDayOfWeek: _angular_core.InputSignal<number>;
+    /** Locale for date formatting. */
+    locale: _angular_core.InputSignal<string>;
+    /** Start hour for day/week view. */
+    startHour: _angular_core.InputSignal<number>;
+    /** End hour for day/week view. */
+    endHour: _angular_core.InputSignal<number>;
+    /** Emits when an event is clicked. */
+    eventClick: _angular_core.OutputEmitterRef<CalendarEvent>;
+    /** Emits when a date cell is clicked. */
+    dateClick: _angular_core.OutputEmitterRef<Date>;
+    /** Emits when the view changes. */
+    viewChange: _angular_core.OutputEmitterRef<CalendarView>;
+    protected readonly currentDate: _angular_core.WritableSignal<Date>;
+    protected readonly headerTitle: _angular_core.Signal<string>;
+    protected readonly weekDayNames: _angular_core.Signal<string[]>;
+    protected readonly monthGrid: _angular_core.Signal<DayCell[][]>;
+    protected readonly hourSlots: _angular_core.Signal<HourSlot[]>;
+    protected readonly weekDays: _angular_core.Signal<{
+        date: Date;
+        label: string;
+        isToday: boolean;
+        events: {
+            start: Date;
+            end: Date;
+            id: string;
+            title: string;
+            color?: "primary" | "secondary" | "success" | "warning" | "error" | "info";
+            allDay?: boolean;
+        }[];
+    }[]>;
+    protected readonly dayEvents: _angular_core.Signal<{
+        start: Date;
+        end: Date;
+        id: string;
+        title: string;
+        color?: "primary" | "secondary" | "success" | "warning" | "error" | "info";
+        allDay?: boolean;
+    }[]>;
+    private readonly normalizedEvents;
+    protected navigatePrev(): void;
+    protected navigateNext(): void;
+    protected navigateToday(): void;
+    protected setView(v: CalendarView): void;
+    protected onEventClick(event: CalendarEvent, e: MouseEvent): void;
+    protected onDateClick(date: Date): void;
+    protected eventTop(event: CalendarEvent): number;
+    protected eventHeight(event: CalendarEvent): number;
+    private navigate;
+    private weekStart;
+    private isSameDay;
+    private isEventOnDate;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CalendarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CalendarComponent, "lc-calendar", never, { "view": { "alias": "view"; "required": false; "isSignal": true; }; "events": { "alias": "events"; "required": false; "isSignal": true; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "startHour": { "alias": "startHour"; "required": false; "isSignal": true; }; "endHour": { "alias": "endHour"; "required": false; "isSignal": true; }; }, { "eventClick": "eventClick"; "dateClick": "dateClick"; "viewChange": "viewChange"; }, never, never, true, never>;
+}
+
+interface GanttDependency {
+    from: string;
+    to: string;
+}
+interface GanttTask {
+    id: string;
+    title: string;
+    start: Date | string;
+    end: Date | string;
+    progress?: number;
+    color?: 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+    group?: string;
+}
+interface NormalizedTask {
+    id: string;
+    title: string;
+    start: Date;
+    end: Date;
+    progress: number;
+    color: string;
+    group: string;
+}
+interface BarLayout {
+    task: NormalizedTask;
+    left: number;
+    width: number;
+    top: number;
+    progress: number;
+    colorClass: string;
+}
+interface DepLine {
+    x1: number;
+    y1: number;
+    x2: number;
+    y2: number;
+}
+declare class GanttChartComponent {
+    /** Tasks to display. */
+    tasks: _angular_core.InputSignal<GanttTask[]>;
+    /** Dependency links between tasks. */
+    dependencies: _angular_core.InputSignal<GanttDependency[]>;
+    /** Row height in px. */
+    rowHeight: _angular_core.InputSignal<number>;
+    /** Width of the label column in px. */
+    labelWidth: _angular_core.InputSignal<number>;
+    /** Column width per day in px. */
+    dayWidth: _angular_core.InputSignal<number>;
+    /** Show today marker. */
+    showToday: _angular_core.InputSignal<boolean>;
+    /** Emits when a task bar is clicked. */
+    taskClick: _angular_core.OutputEmitterRef<GanttTask>;
+    private readonly normalizedTasks;
+    protected readonly timelineStart: _angular_core.Signal<Date>;
+    protected readonly timelineEnd: _angular_core.Signal<Date>;
+    protected readonly totalDays: _angular_core.Signal<number>;
+    protected readonly timelineWidth: _angular_core.Signal<number>;
+    protected readonly dayColumns: _angular_core.Signal<{
+        date: Date;
+        left: number;
+        label: number;
+        isWeekend: boolean;
+        monthLabel: string | null;
+    }[]>;
+    protected readonly monthHeaders: _angular_core.Signal<{
+        label: string;
+        left: number;
+        width: number;
+    }[]>;
+    protected readonly bars: _angular_core.Signal<BarLayout[]>;
+    protected readonly depLines: _angular_core.Signal<DepLine[]>;
+    protected readonly todayLeft: _angular_core.Signal<number>;
+    protected readonly gridHeight: _angular_core.Signal<number>;
+    protected onTaskClick(task: NormalizedTask): void;
+    private startOfDay;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<GanttChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<GanttChartComponent, "lc-gantt-chart", never, { "tasks": { "alias": "tasks"; "required": true; "isSignal": true; }; "dependencies": { "alias": "dependencies"; "required": false; "isSignal": true; }; "rowHeight": { "alias": "rowHeight"; "required": false; "isSignal": true; }; "labelWidth": { "alias": "labelWidth"; "required": false; "isSignal": true; }; "dayWidth": { "alias": "dayWidth"; "required": false; "isSignal": true; }; "showToday": { "alias": "showToday"; "required": false; "isSignal": true; }; }, { "taskClick": "taskClick"; }, never, never, true, never>;
+}
+
+type ChatMessageRole = 'user' | 'agent' | 'system';
+interface ChatMessage {
+    id: string;
+    role: ChatMessageRole;
+    content: string;
+    timestamp?: Date | string;
+    avatar?: string;
+    name?: string;
+    streaming?: boolean;
+}
+interface ChatSendEvent {
+    content: string;
+}
+declare class ChatComponent implements AfterViewChecked {
+    /** Messages to display. */
+    messages: _angular_core.InputSignal<ChatMessage[]>;
+    /** Placeholder text for the input. */
+    placeholder: _angular_core.InputSignal<string>;
+    /** Title displayed in the header. */
+    title: _angular_core.InputSignal<string>;
+    /** Whether the agent is currently streaming / typing. */
+    isStreaming: _angular_core.InputSignal<boolean>;
+    /** Show the header bar. */
+    showHeader: _angular_core.InputSignal<boolean>;
+    /** Disable the input. */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Show avatars next to messages. */
+    showAvatars: _angular_core.InputSignal<boolean>;
+    /** Show timestamps. */
+    showTimestamps: _angular_core.InputSignal<boolean>;
+    /** Emits when user sends a message. */
+    messageSend: _angular_core.OutputEmitterRef<ChatSendEvent>;
+    protected readonly inputValue: _angular_core.WritableSignal<string>;
+    private shouldScroll;
+    private scrollContainer;
+    protected readonly formattedMessages: _angular_core.Signal<{
+        timestamp: Date | undefined;
+        id: string;
+        role: ChatMessageRole;
+        content: string;
+        avatar?: string;
+        name?: string;
+        streaming?: boolean;
+    }[]>;
+    ngAfterViewChecked(): void;
+    protected onInput(event: Event): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    protected send(): void;
+    protected formatTime(date: Date | undefined): string;
+    protected trackById(_: number, msg: ChatMessage): string;
+    private scrollToBottom;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChatComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChatComponent, "lc-chat", never, { "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "isStreaming": { "alias": "isStreaming"; "required": false; "isSignal": true; }; "showHeader": { "alias": "showHeader"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "showAvatars": { "alias": "showAvatars"; "required": false; "isSignal": true; }; "showTimestamps": { "alias": "showTimestamps"; "required": false; "isSignal": true; }; }, { "messageSend": "messageSend"; }, never, never, true, never>;
+}
+
+type DocumentType = 'pdf' | 'markdown' | 'image' | 'text' | 'code' | 'auto';
+/**
+ * Document viewer component for previewing various file types.
+ *
+ * Features:
+ * - Auto-detects file type from URL extension or explicit type input
+ * - PDF rendering via browser-native iframe viewer
+ * - Markdown parsing and rendering with full formatting support
+ * - Image display with zoom controls (25% – 500%)
+ * - Code display using the built-in code block component
+ * - Plain text display
+ * - Toolbar with filename, type badge, zoom, download, and fullscreen
+ * - Loading and error states
+ * - Dark/light theme support
+ *
+ * @example
+ * ```html
+ * <lc-document-viewer src="https://example.com/report.pdf" />
+ * <lc-document-viewer [content]="markdownString" type="markdown" filename="README.md" />
+ * <lc-document-viewer src="/assets/diagram.png" />
+ * ```
+ */
+declare class DocumentViewerComponent implements OnInit, OnDestroy {
+    /** URL of the document to display (for PDF, images, or remote files) */
+    readonly src: _angular_core.InputSignal<string>;
+    /** Direct content string (for markdown, text, or code — takes precedence over src for content-based types) */
+    readonly content: _angular_core.InputSignal<string>;
+    /** File type — set to 'auto' to detect from URL extension */
+    readonly type: _angular_core.InputSignal<DocumentType>;
+    /** Display name shown in the toolbar */
+    readonly filename: _angular_core.InputSignal<string>;
+    /** Code language for syntax highlighting (when type is 'code') */
+    readonly language: _angular_core.InputSignal<CodeBlockLanguage>;
+    /** Whether to display the toolbar */
+    readonly showToolbar: _angular_core.InputSignal<boolean>;
+    /** Whether to show the download button in the toolbar */
+    readonly showDownload: _angular_core.InputSignal<boolean>;
+    /** Height of the viewer container */
+    readonly height: _angular_core.InputSignal<string>;
+    protected loading: _angular_core.WritableSignal<boolean>;
+    protected error: _angular_core.WritableSignal<string | null>;
+    protected fetchedContent: _angular_core.WritableSignal<string>;
+    protected zoom: _angular_core.WritableSignal<number>;
+    protected isFullscreen: _angular_core.WritableSignal<boolean>;
+    private readonly sanitizer;
+    private readonly elementRef;
+    private fullscreenHandler;
+    /** Resolved document type from input or URL extension */
+    protected resolvedType: _angular_core.Signal<DocumentType | "unknown">;
+    /** Display name for the toolbar */
+    protected displayName: _angular_core.Signal<string>;
+    /** Icon name for the document type */
+    protected typeIcon: _angular_core.Signal<string>;
+    /** Type label for the toolbar badge */
+    protected typeLabel: _angular_core.Signal<string>;
+    /** Resolved code language */
+    protected resolvedLanguage: _angular_core.Signal<CodeBlockLanguage>;
+    /** Sanitized src URL for iframe/img embedding */
+    protected safeSrc: _angular_core.Signal<SafeResourceUrl>;
+    /** Effective content: direct content input or fetched content */
+    protected effectiveContent: _angular_core.Signal<string>;
+    /** Rendered markdown HTML */
+    protected renderedMarkdown: _angular_core.Signal<SafeHtml>;
+    /** Image transform style for zoom */
+    protected imageTransform: _angular_core.Signal<string>;
+    /** Whether zoom controls should be shown */
+    protected showZoom: _angular_core.Signal<boolean>;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    protected zoomIn(): void;
+    protected zoomOut(): void;
+    protected resetZoom(): void;
+    protected download(): void;
+    protected toggleFullscreen(): void;
+    protected onIframeLoad(): void;
+    protected onImageLoad(): void;
+    protected onImageError(): void;
+    private extractExtension;
+    private fetchContent;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DocumentViewerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DocumentViewerComponent, "lc-document-viewer", never, { "src": { "alias": "src"; "required": false; "isSignal": true; }; "content": { "alias": "content"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "filename": { "alias": "filename"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; "showToolbar": { "alias": "showToolbar"; "required": false; "isSignal": true; }; "showDownload": { "alias": "showDownload"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+type GalleryLayout = 'grid' | 'masonry';
+type GallerySize = 'sm' | 'md' | 'lg';
+interface GalleryItem {
+    /** Image source URL */
+    src: string;
+    /** Thumbnail URL (falls back to src if not provided) */
+    thumbnail?: string;
+    /** Alt text for accessibility */
+    alt?: string;
+    /** Optional caption displayed below the image */
+    caption?: string;
+    /** Optional category for filtering */
+    category?: string;
+}
+/**
+ * Gallery component for displaying image collections with lightbox.
+ *
+ * Features:
+ * - Grid and masonry layout modes
+ * - Responsive column count via size presets (sm, md, lg thumbnails)
+ * - Configurable custom column count
+ * - Lightbox overlay with navigation (prev/next)
+ * - Keyboard navigation (Arrow keys, Escape)
+ * - Optional captions and category filtering
+ * - Lazy loading with placeholder shimmer
+ * - Zoom control in lightbox
+ * - Download button in lightbox
+ * - Dark/light theme support
+ *
+ * @example
+ * ```html
+ * <lc-gallery
+ *   [items]="images"
+ *   layout="grid"
+ *   size="md"
+ *   [showCaptions]="true" />
+ * ```
+ */
+declare class GalleryComponent implements OnDestroy {
+    /** Array of gallery items to display */
+    readonly items: _angular_core.InputSignal<GalleryItem[]>;
+    /** Layout mode */
+    readonly layout: _angular_core.InputSignal<GalleryLayout>;
+    /** Thumbnail size preset — controls column count (sm=4col, md=3col, lg=2col) */
+    readonly size: _angular_core.InputSignal<GallerySize>;
+    /** Custom column count (overrides size preset) */
+    readonly columns: _angular_core.InputSignal<number | null>;
+    /** Whether to show captions below thumbnails */
+    readonly showCaptions: _angular_core.InputSignal<boolean>;
+    /** Whether clicking a thumbnail opens the lightbox */
+    readonly enableLightbox: _angular_core.InputSignal<boolean>;
+    /** Gap between items in pixels */
+    readonly gap: _angular_core.InputSignal<number>;
+    /** Aspect ratio for grid items (ignored in masonry mode) */
+    readonly aspectRatio: _angular_core.InputSignal<string>;
+    /** Emitted when lightbox opens with item index */
+    readonly lightboxOpen: _angular_core.OutputEmitterRef<number>;
+    /** Emitted when lightbox closes */
+    readonly lightboxClose: _angular_core.OutputEmitterRef<void>;
+    protected lightboxIndex: _angular_core.WritableSignal<number | null>;
+    protected lightboxZoom: _angular_core.WritableSignal<number>;
+    protected loadedImages: _angular_core.WritableSignal<Set<number>>;
+    protected activeFilter: _angular_core.WritableSignal<string | null>;
+    protected gridColumns: _angular_core.Signal<number>;
+    protected gridStyle: _angular_core.Signal<{
+        'column-count': string;
+        'column-gap': string;
+        display?: undefined;
+        'grid-template-columns'?: undefined;
+        gap?: undefined;
+    } | {
+        display: string;
+        'grid-template-columns': string;
+        gap: string;
+        'column-count'?: undefined;
+        'column-gap'?: undefined;
+    }>;
+    protected itemStyle: _angular_core.Signal<{
+        'aspect-ratio'?: undefined;
+    } | {
+        'aspect-ratio': string;
+    }>;
+    protected categories: _angular_core.Signal<string[]>;
+    protected filteredItems: _angular_core.Signal<GalleryItem[]>;
+    protected showFilters: _angular_core.Signal<boolean>;
+    protected lightboxItem: _angular_core.Signal<GalleryItem | null>;
+    protected lightboxCounter: _angular_core.Signal<string>;
+    protected lightboxTransform: _angular_core.Signal<string>;
+    protected canGoPrev: _angular_core.Signal<boolean>;
+    protected canGoNext: _angular_core.Signal<boolean>;
+    ngOnDestroy(): void;
+    protected openLightbox(index: number): void;
+    protected closeLightbox(): void;
+    protected goToPrev(): void;
+    protected goToNext(): void;
+    protected zoomIn(): void;
+    protected zoomOut(): void;
+    protected resetZoom(): void;
+    protected downloadCurrent(): void;
+    protected setFilter(category: string | null): void;
+    protected onImageLoad(index: number): void;
+    protected isLoaded(index: number): boolean;
+    protected getThumbnail(item: GalleryItem): string;
+    protected trackByIndex(index: number): number;
+    protected onKeydown(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<GalleryComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<GalleryComponent, "lc-gallery", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "showCaptions": { "alias": "showCaptions"; "required": false; "isSignal": true; }; "enableLightbox": { "alias": "enableLightbox"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; "isSignal": true; }; }, { "lightboxOpen": "lightboxOpen"; "lightboxClose": "lightboxClose"; }, never, never, true, never>;
+}
+
+type DependencyNodeStatus = 'default' | 'active' | 'success' | 'warning' | 'error' | 'muted';
+type DependencyDirection = 'horizontal' | 'vertical';
+type DependencyRelation = 'depends' | 'blocks' | 'references' | 'requires' | 'extends' | 'implements' | 'uses';
+interface DependencyEdgeDef {
+    /** Target node id */
+    id: string;
+    /** Relationship type */
+    relation?: DependencyRelation;
+}
+interface DependencyNode {
+    /** Unique identifier */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Optional description */
+    description?: string;
+    /** Optional icon name */
+    icon?: string;
+    /** Visual status / color */
+    status?: DependencyNodeStatus;
+    /** Child nodes: items this node is required for (right / bottom side) */
+    children?: DependencyNode[];
+    /** Dependencies: items this node depends on (shown as cross-reference edges) */
+    dependsOn?: DependencyEdgeDef[];
+}
+interface LayoutNode {
+    id: string;
+    label: string;
+    description?: string;
+    icon?: string;
+    status: DependencyNodeStatus;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    depth: number;
+    parentId: string | null;
+    incomingCount: number;
+    outgoingCount: number;
+}
+interface LayoutEdge {
+    id: string;
+    path: string;
+    sourceId: string;
+    targetId: string;
+    relation?: DependencyRelation;
+    labelX: number;
+    labelY: number;
+    color: string;
+    dashed: boolean;
+    isCrossRef: boolean;
+}
+/**
+ * Dependency viewer component for visualizing hierarchical and cross-cutting relationships.
+ *
+ * Features:
+ * - Horizontal (left-to-right) and vertical (top-to-bottom) layout directions
+ * - Bidirectional dependencies: children (right/down) and dependsOn (cross-references)
+ * - Relationship types: depends, blocks, references, requires, extends, implements, uses
+ * - Edge labels showing relationship type
+ * - Dashed vs solid edges per relationship category
+ * - Color-coded edges per relationship type
+ * - Node status colors (default, active, success, warning, error, muted)
+ * - Pan and zoom controls with mouse wheel support
+ * - Collapsible sub-trees
+ * - Interactive node selection with detail panel
+ * - Legend showing active relationship types
+ * - SVG arrowhead markers on cross-reference edges
+ * - Dark/light theme support
+ *
+ * @example
+ * ```html
+ * <lc-dependency-viewer [root]="specTree" direction="horizontal" />
+ * ```
+ */
+declare class DependencyViewerComponent {
+    readonly root: _angular_core.InputSignal<DependencyNode>;
+    readonly direction: _angular_core.InputSignal<DependencyDirection>;
+    readonly height: _angular_core.InputSignal<string>;
+    readonly showToolbar: _angular_core.InputSignal<boolean>;
+    readonly showEdgeLabels: _angular_core.InputSignal<boolean>;
+    readonly edgeWidth: _angular_core.InputSignal<number>;
+    protected zoom: _angular_core.WritableSignal<number>;
+    protected panX: _angular_core.WritableSignal<number>;
+    protected panY: _angular_core.WritableSignal<number>;
+    protected selectedNodeId: _angular_core.WritableSignal<string | null>;
+    protected collapsedIds: _angular_core.WritableSignal<Set<string>>;
+    private isPanning;
+    private lastMouseX;
+    private lastMouseY;
+    protected effectiveRoot: _angular_core.Signal<DependencyNode>;
+    private allOriginalNodes;
+    protected layout: _angular_core.Signal<{
+        nodes: LayoutNode[];
+        edges: LayoutEdge[];
+        width: number;
+        height: number;
+    }>;
+    protected svgWidth: _angular_core.Signal<number>;
+    protected svgHeight: _angular_core.Signal<number>;
+    protected viewBox: _angular_core.Signal<string>;
+    protected transform: _angular_core.Signal<string>;
+    protected selectedNode: _angular_core.Signal<LayoutNode | null>;
+    protected selectedDependsOn: _angular_core.Signal<DependencyEdgeDef[]>;
+    protected legendItems: _angular_core.Signal<{
+        relation: DependencyRelation;
+        label: string;
+        color: string;
+        dashed: boolean;
+    }[]>;
+    protected hasChildren(nodeId: string): boolean;
+    protected isCollapsed(nodeId: string): boolean;
+    protected getRelationLabel(relation: DependencyRelation): string;
+    private pruneCollapsed;
+    private findOriginalNode;
+    protected selectNode(id: string, event: Event): void;
+    protected toggleCollapse(id: string, event: Event): void;
+    protected deselectNode(): void;
+    protected zoomIn(): void;
+    protected zoomOut(): void;
+    protected resetZoom(): void;
+    protected onMouseDown(event: MouseEvent): void;
+    protected onMouseMove(event: MouseEvent): void;
+    protected onMouseUp(): void;
+    protected onWheel(event: WheelEvent): void;
+    protected getNodeBg(status: DependencyNodeStatus): string;
+    protected getNodeBorder(status: DependencyNodeStatus): string;
+    protected getNodeText(status: DependencyNodeStatus): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DependencyViewerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DependencyViewerComponent, "lc-dependency-viewer", never, { "root": { "alias": "root"; "required": true; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "showToolbar": { "alias": "showToolbar"; "required": false; "isSignal": true; }; "showEdgeLabels": { "alias": "showEdgeLabels"; "required": false; "isSignal": true; }; "edgeWidth": { "alias": "edgeWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface ScatterPoint {
+    x: number;
+    y: number;
+    label?: string;
+    size?: number;
+}
+interface ScatterSeries {
+    label: string;
+    data: ScatterPoint[];
+    color?: string;
+}
+declare class ScatterPlotComponent {
+    readonly series: _angular_core.InputSignal<ScatterSeries[]>;
+    readonly width: _angular_core.InputSignal<number>;
+    readonly height: _angular_core.InputSignal<number>;
+    readonly showGrid: _angular_core.InputSignal<boolean>;
+    readonly showXLabels: _angular_core.InputSignal<boolean>;
+    readonly showYLabels: _angular_core.InputSignal<boolean>;
+    readonly showLegend: _angular_core.InputSignal<boolean>;
+    readonly showTooltip: _angular_core.InputSignal<boolean>;
+    readonly dotRadius: _angular_core.InputSignal<number>;
+    readonly xAxisLabel: _angular_core.InputSignal<string>;
+    readonly yAxisLabel: _angular_core.InputSignal<string>;
+    readonly pointClick: _angular_core.OutputEmitterRef<{
+        series: string;
+        point: ScatterPoint;
+    }>;
+    protected hoveredPoint: _angular_core.WritableSignal<{
+        x: number;
+        y: number;
+        label: string;
+        sx: number;
+        sy: number;
+    } | null>;
+    private readonly PL;
+    private readonly PR;
+    private readonly PT;
+    private readonly PB;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    private readonly allPoints;
+    private readonly xExtent;
+    private readonly yExtent;
+    protected readonly plotArea: _angular_core.Signal<{
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    }>;
+    protected readonly gridLinesX: _angular_core.Signal<{
+        x: number;
+        label: number;
+    }[]>;
+    protected readonly gridLinesY: _angular_core.Signal<{
+        y: number;
+        label: number;
+    }[]>;
+    protected readonly renderedSeries: _angular_core.Signal<{
+        label: string;
+        color: string;
+        points: {
+            cx: number;
+            cy: number;
+            r: number;
+            label: string;
+            orig: ScatterPoint;
+        }[];
+    }[]>;
+    protected readonly legendItems: _angular_core.Signal<{
+        label: string;
+        color: string;
+    }[]>;
+    protected readonly axisLine: _angular_core.Signal<{
+        vx1: number;
+        vy1: number;
+        vx2: number;
+        vy2: number;
+        hx1: number;
+        hy1: number;
+        hx2: number;
+        hy2: number;
+    }>;
+    protected onDotEnter(cx: number, cy: number, label: string): void;
+    protected onDotLeave(): void;
+    protected onDotClick(seriesLabel: string, point: ScatterPoint): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScatterPlotComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ScatterPlotComponent, "lc-scatter-plot", never, { "series": { "alias": "series"; "required": true; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "showGrid": { "alias": "showGrid"; "required": false; "isSignal": true; }; "showXLabels": { "alias": "showXLabels"; "required": false; "isSignal": true; }; "showYLabels": { "alias": "showYLabels"; "required": false; "isSignal": true; }; "showLegend": { "alias": "showLegend"; "required": false; "isSignal": true; }; "showTooltip": { "alias": "showTooltip"; "required": false; "isSignal": true; }; "dotRadius": { "alias": "dotRadius"; "required": false; "isSignal": true; }; "xAxisLabel": { "alias": "xAxisLabel"; "required": false; "isSignal": true; }; "yAxisLabel": { "alias": "yAxisLabel"; "required": false; "isSignal": true; }; }, { "pointClick": "pointClick"; }, never, never, true, never>;
+}
+
+interface FunnelStep {
+    label: string;
+    value: number;
+    color?: string;
+}
+declare class FunnelChartComponent {
+    readonly steps: _angular_core.InputSignal<FunnelStep[]>;
+    readonly width: _angular_core.InputSignal<number>;
+    readonly height: _angular_core.InputSignal<number>;
+    readonly showLabels: _angular_core.InputSignal<boolean>;
+    readonly showValues: _angular_core.InputSignal<boolean>;
+    readonly showPercentage: _angular_core.InputSignal<boolean>;
+    readonly orientation: _angular_core.InputSignal<"horizontal" | "vertical">;
+    protected readonly viewBox: _angular_core.Signal<string>;
+    protected readonly renderedSteps: _angular_core.Signal<{
+        path: string;
+        color: string;
+        label: string;
+        value: number;
+        pct: number;
+        labelX: number;
+        labelY: number;
+    }[]>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FunnelChartComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FunnelChartComponent, "lc-funnel-chart", never, { "steps": { "alias": "steps"; "required": true; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "showValues": { "alias": "showValues"; "required": false; "isSignal": true; }; "showPercentage": { "alias": "showPercentage"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class TagInputComponent implements ControlValueAccessor {
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly maxTags: _angular_core.InputSignal<number>;
+    readonly allowDuplicates: _angular_core.InputSignal<boolean>;
+    readonly removable: _angular_core.InputSignal<boolean>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly separator: _angular_core.InputSignal<"enter" | "comma" | "both">;
+    readonly suggestions: _angular_core.InputSignal<string[]>;
+    readonly label: _angular_core.InputSignal<string>;
+    readonly tagAdded: _angular_core.OutputEmitterRef<string>;
+    readonly tagRemoved: _angular_core.OutputEmitterRef<string>;
+    protected tags: _angular_core.WritableSignal<string[]>;
+    protected inputValue: _angular_core.WritableSignal<string>;
+    protected focused: _angular_core.WritableSignal<boolean>;
+    protected readonly inputEl: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
+    protected readonly filteredSuggestions: _angular_core.Signal<string[]>;
+    protected readonly canAdd: _angular_core.Signal<boolean>;
+    private onChange;
+    private onTouched;
+    writeValue(value: string[] | null): void;
+    registerOnChange(fn: (val: string[]) => void): void;
+    registerOnTouched(fn: () => void): void;
+    protected addTag(value: string): void;
+    protected removeTag(index: number): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    protected onInput(event: Event): void;
+    protected onFocus(): void;
+    protected onBlur(): void;
+    protected selectSuggestion(value: string): void;
+    protected focusInput(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TagInputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagInputComponent, "lc-tag-input", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "maxTags": { "alias": "maxTags"; "required": false; "isSignal": true; }; "allowDuplicates": { "alias": "allowDuplicates"; "required": false; "isSignal": true; }; "removable": { "alias": "removable"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; "suggestions": { "alias": "suggestions"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "tagAdded": "tagAdded"; "tagRemoved": "tagRemoved"; }, never, never, true, never>;
+}
+
+interface DateRange {
+    start: Date | null;
+    end: Date | null;
+}
+declare class DateRangePickerComponent implements ControlValueAccessor {
+    readonly label: _angular_core.InputSignal<string>;
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly minDate: _angular_core.InputSignal<Date | null>;
+    readonly maxDate: _angular_core.InputSignal<Date | null>;
+    readonly rangeChange: _angular_core.OutputEmitterRef<DateRange>;
+    protected isOpen: _angular_core.WritableSignal<boolean>;
+    protected range: _angular_core.WritableSignal<DateRange>;
+    protected selecting: _angular_core.WritableSignal<"start" | "end">;
+    protected hoveredDate: _angular_core.WritableSignal<Date | null>;
+    protected viewingMonth: _angular_core.WritableSignal<Date>;
+    private onChange;
+    private onTouched;
+    protected readonly displayValue: _angular_core.Signal<string>;
+    protected readonly monthLabel: _angular_core.Signal<string>;
+    protected readonly weekdays: string[];
+    protected readonly calendarDays: _angular_core.Signal<{
+        date: Date;
+        inMonth: boolean;
+        disabled: boolean;
+    }[]>;
+    writeValue(value: DateRange | null): void;
+    registerOnChange(fn: (val: DateRange) => void): void;
+    registerOnTouched(fn: () => void): void;
+    protected toggle(): void;
+    protected close(): void;
+    protected prevMonth(): void;
+    protected nextMonth(): void;
+    protected selectDate(date: Date): void;
+    protected onDayHover(date: Date): void;
+    protected isStart(date: Date): boolean;
+    protected isEnd(date: Date): boolean;
+    protected isInRange(date: Date): boolean;
+    protected isToday(date: Date): boolean;
+    protected clearRange(event: Event): void;
+    private isDateDisabled;
+    private sameDay;
+    private emitRange;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DateRangePickerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DateRangePickerComponent, "lc-date-range-picker", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; }, { "rangeChange": "rangeChange"; }, never, never, true, never>;
+}
+
+type DiffViewMode = 'side-by-side' | 'inline';
+interface DiffLine {
+    type: 'unchanged' | 'added' | 'removed';
+    leftNum: number | null;
+    rightNum: number | null;
+    content: string;
+}
+declare class DiffViewerComponent {
+    readonly oldText: _angular_core.InputSignal<string>;
+    readonly newText: _angular_core.InputSignal<string>;
+    readonly oldLabel: _angular_core.InputSignal<string>;
+    readonly newLabel: _angular_core.InputSignal<string>;
+    readonly mode: _angular_core.InputSignal<DiffViewMode>;
+    readonly showLineNumbers: _angular_core.InputSignal<boolean>;
+    readonly contextLines: _angular_core.InputSignal<number>;
+    protected readonly diffLines: _angular_core.Signal<DiffLine[]>;
+    protected readonly filteredLines: _angular_core.Signal<DiffLine[]>;
+    protected readonly sideBySide: _angular_core.Signal<{
+        left: {
+            num: number | null;
+            content: string;
+            type: string;
+        }[];
+        right: {
+            num: number | null;
+            content: string;
+            type: string;
+        }[];
+    }>;
+    protected readonly stats: _angular_core.Signal<{
+        additions: number;
+        deletions: number;
+    }>;
+    private computeDiff;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DiffViewerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DiffViewerComponent, "lc-diff-viewer", never, { "oldText": { "alias": "oldText"; "required": true; "isSignal": true; }; "newText": { "alias": "newText"; "required": true; "isSignal": true; }; "oldLabel": { "alias": "oldLabel"; "required": false; "isSignal": true; }; "newLabel": { "alias": "newLabel"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "showLineNumbers": { "alias": "showLineNumbers"; "required": false; "isSignal": true; }; "contextLines": { "alias": "contextLines"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface KanbanCard {
+    id: string;
+    title: string;
+    description?: string;
+    labels?: KanbanLabel[];
+    assignee?: string;
+    priority?: 'low' | 'medium' | 'high' | 'critical';
+}
+interface KanbanLabel {
+    text: string;
+    color?: string;
+}
+interface KanbanColumn {
+    id: string;
+    title: string;
+    cards: KanbanCard[];
+    color?: string;
+    limit?: number;
+}
+interface KanbanMoveEvent {
+    cardId: string;
+    fromColumnId: string;
+    toColumnId: string;
+    toIndex: number;
+}
+declare class KanbanBoardComponent {
+    readonly columns: _angular_core.InputSignal<KanbanColumn[]>;
+    readonly showCardCount: _angular_core.InputSignal<boolean>;
+    readonly showWipLimit: _angular_core.InputSignal<boolean>;
+    readonly readonly: _angular_core.InputSignal<boolean>;
+    readonly cardMoved: _angular_core.OutputEmitterRef<KanbanMoveEvent>;
+    readonly cardClick: _angular_core.OutputEmitterRef<{
+        card: KanbanCard;
+        columnId: string;
+    }>;
+    protected internalColumns: _angular_core.WritableSignal<KanbanColumn[]>;
+    protected draggedCard: _angular_core.WritableSignal<{
+        card: KanbanCard;
+        columnId: string;
+    } | null>;
+    protected dropTargetColumn: _angular_core.WritableSignal<string | null>;
+    protected dropTargetIndex: _angular_core.WritableSignal<number>;
+    protected readonly displayColumns: _angular_core.Signal<KanbanColumn[]>;
+    protected isOverLimit(col: KanbanColumn): boolean;
+    protected getPriorityIcon(priority?: string): string;
+    protected getPriorityColor(priority?: string): string;
+    protected onDragStart(event: DragEvent, card: KanbanCard, columnId: string): void;
+    protected onDragOver(event: DragEvent, columnId: string, index: number): void;
+    protected onDragOverColumn(event: DragEvent, columnId: string): void;
+    protected onDragLeave(): void;
+    protected onDrop(event: DragEvent, toColumnId: string, toIndex?: number): void;
+    protected onDragEnd(): void;
+    protected onCardClick(card: KanbanCard, columnId: string): void;
+    protected trackColumn(_: number, col: KanbanColumn): string;
+    protected trackCard(_: number, card: KanbanCard): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KanbanBoardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<KanbanBoardComponent, "lc-kanban-board", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "showCardCount": { "alias": "showCardCount"; "required": false; "isSignal": true; }; "showWipLimit": { "alias": "showWipLimit"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; }, { "cardMoved": "cardMoved"; "cardClick": "cardClick"; }, never, never, true, never>;
+}
+
+type NotificationType = 'info' | 'success' | 'warning' | 'error';
+type NotificationPriority = 'low' | 'normal' | 'high' | 'urgent';
+interface Notification {
+    id: string;
+    title: string;
+    message?: string;
+    type?: NotificationType;
+    priority?: NotificationPriority;
+    timestamp: Date;
+    read?: boolean;
+    icon?: string;
+    category?: string;
+    actionLabel?: string;
+    actionUrl?: string;
+}
+declare class NotificationCenterComponent {
+    readonly notifications: _angular_core.InputSignal<Notification[]>;
+    readonly title: _angular_core.InputSignal<string>;
+    readonly showFilter: _angular_core.InputSignal<boolean>;
+    readonly showTimestamp: _angular_core.InputSignal<boolean>;
+    readonly showPriority: _angular_core.InputSignal<boolean>;
+    readonly emptyMessage: _angular_core.InputSignal<string>;
+    readonly maxHeight: _angular_core.InputSignal<string>;
+    readonly groupByCategory: _angular_core.InputSignal<boolean>;
+    readonly notificationClick: _angular_core.OutputEmitterRef<Notification>;
+    readonly notificationDismiss: _angular_core.OutputEmitterRef<string>;
+    readonly notificationAction: _angular_core.OutputEmitterRef<Notification>;
+    readonly markAllRead: _angular_core.OutputEmitterRef<void>;
+    readonly clearAll: _angular_core.OutputEmitterRef<void>;
+    protected activeFilter: _angular_core.WritableSignal<"all" | NotificationType>;
+    protected searchQuery: _angular_core.WritableSignal<string>;
+    protected readonly unreadCount: _angular_core.Signal<number>;
+    protected readonly filteredNotifications: _angular_core.Signal<Notification[]>;
+    protected readonly groupedNotifications: _angular_core.Signal<{
+        category: string;
+        items: Notification[];
+    }[] | null>;
+    protected readonly filterCounts: _angular_core.Signal<{
+        all: number;
+        info: number;
+        success: number;
+        warning: number;
+        error: number;
+    }>;
+    protected readonly hasNotifications: _angular_core.Signal<boolean>;
+    protected getTypeIcon(type?: NotificationType): string;
+    protected getPriorityLabel(priority?: NotificationPriority): string;
+    protected formatTime(date: Date): string;
+    protected setFilter(filter: NotificationType | 'all'): void;
+    protected onSearch(event: Event): void;
+    protected onClick(notification: Notification): void;
+    protected onDismiss(id: string, event: Event): void;
+    protected onAction(notification: Notification, event: Event): void;
+    protected onMarkAllRead(): void;
+    protected onClearAll(): void;
+    private priorityWeight;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NotificationCenterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NotificationCenterComponent, "lc-notification-center", never, { "notifications": { "alias": "notifications"; "required": true; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "showFilter": { "alias": "showFilter"; "required": false; "isSignal": true; }; "showTimestamp": { "alias": "showTimestamp"; "required": false; "isSignal": true; }; "showPriority": { "alias": "showPriority"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "groupByCategory": { "alias": "groupByCategory"; "required": false; "isSignal": true; }; }, { "notificationClick": "notificationClick"; "notificationDismiss": "notificationDismiss"; "notificationAction": "notificationAction"; "markAllRead": "markAllRead"; "clearAll": "clearAll"; }, never, never, true, never>;
+}
+
+type RichTextEditorMode = 'rich' | 'markdown' | 'split';
+type ToolbarAction = 'bold' | 'italic' | 'underline' | 'strikethrough' | 'h1' | 'h2' | 'h3' | 'ul' | 'ol' | 'blockquote' | 'code' | 'codeblock' | 'link' | 'image' | 'hr';
+interface ToolbarConfig {
+    actions: ToolbarAction[];
+}
+/**
+ * Rich Text Editor with Markdown support.
+ *
+ * Supports three modes:
+ * - `rich`: WYSIWYG editing with toolbar
+ * - `markdown`: Raw markdown editing with syntax highlighting
+ * - `split`: Side-by-side markdown and preview
+ *
+ * Implements ControlValueAccessor for reactive form integration.
+ * The value is always stored as Markdown.
+ *
+ * @example
+ * ```html
+ * <lc-rich-text-editor
+ *   [(ngModel)]="content"
+ *   mode="split"
+ *   placeholder="Write something..." />
+ * ```
+ */
+declare class RichTextEditorComponent implements ControlValueAccessor, AfterViewInit, OnDestroy {
+    /** Editor mode */
+    mode: _angular_core.InputSignal<RichTextEditorMode>;
+    /** Placeholder text */
+    placeholder: _angular_core.InputSignal<string>;
+    /** Minimum height in px */
+    minHeight: _angular_core.InputSignal<number>;
+    /** Maximum height in px (0 = unlimited) */
+    maxHeight: _angular_core.InputSignal<number>;
+    /** Whether the editor is disabled */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Whether the editor is readonly */
+    readonly: _angular_core.InputSignal<boolean>;
+    /** Toolbar configuration */
+    toolbar: _angular_core.InputSignal<ToolbarConfig>;
+    /** Whether to show word count */
+    showWordCount: _angular_core.InputSignal<boolean>;
+    /** Emitted on every content change */
+    readonly contentChange: _angular_core.OutputEmitterRef<string>;
+    editorArea: ElementRef<HTMLTextAreaElement>;
+    richArea: ElementRef<HTMLDivElement>;
+    /** Internal markdown value */
+    protected markdown: _angular_core.WritableSignal<string>;
+    /** Current active mode (can be toggled by user) */
+    protected activeMode: _angular_core.WritableSignal<RichTextEditorMode>;
+    /** Word count */
+    protected wordCount: _angular_core.Signal<number>;
+    /** Character count */
+    protected charCount: _angular_core.Signal<number>;
+    /** Rendered HTML from markdown */
+    protected renderedHtml: _angular_core.Signal<string>;
+    private onChange;
+    private onTouched;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    writeValue(value: string): void;
+    registerOnChange(fn: (value: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    protected switchMode(mode: RichTextEditorMode): void;
+    protected onToolbarAction(action: ToolbarAction): void;
+    private execRichCommand;
+    private insertMarkdownSyntax;
+    protected onMarkdownInput(event: Event): void;
+    protected onRichInput(): void;
+    protected onBlur(): void;
+    private syncFromRich;
+    private emitChange;
+    private getSelection;
+    protected getActionLabel(action: ToolbarAction): string;
+    protected getActionTitle(action: ToolbarAction): string;
+    protected markdownToHtml(md: string): string;
+    private htmlToMarkdown;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RichTextEditorComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RichTextEditorComponent, "lc-rich-text-editor", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "toolbar": { "alias": "toolbar"; "required": false; "isSignal": true; }; "showWordCount": { "alias": "showWordCount"; "required": false; "isSignal": true; }; }, { "contentChange": "contentChange"; }, never, never, true, never>;
+}
+
+export { AccordionComponent, AlertComponent, AnimationDurationFast, AnimationEasingEaseIn, AnimationEasingEaseInOut, AnimationEasingEaseOut, AreaChartComponent, AvatarComponent, AvatarGroupComponent, BadgeComponent, BarChartComponent, BorderRadius2xl, BorderRadiusFull, BorderRadiusLg, BorderRadiusMd, BorderRadiusNone, BorderRadiusSm, BorderRadiusXl, BreadcrumbsComponent, ButtonComponent, CalendarComponent, CalloutComponent, CardComponent, ChatComponent, CheckboxComponent, ChipComponent, CodeBlockComponent, ColorAccentOrange, ColorAccentPurple, ColorAccentRed, ColorAccentRust, ColorAccentViolet, ColorErrorDark, ColorErrorDefault, ColorErrorLight, ColorInfoDark, ColorInfoDefault, ColorInfoLight, ColorNeutral100, ColorNeutral200, ColorNeutral300, ColorNeutral400, ColorNeutral50, ColorNeutral500, ColorNeutral600, ColorNeutral700, ColorNeutral800, ColorNeutral900, ColorPickerComponent, ColorPrimary100, ColorPrimary200, ColorPrimary300, ColorPrimary400, ColorPrimary50, ColorPrimary500, ColorPrimary600, ColorPrimary700, ColorPrimary800, ColorPrimary900, ColorSecondary100, ColorSecondary200, ColorSecondary300, ColorSecondary400, ColorSecondary50, ColorSecondary500, ColorSecondary600, ColorSecondary700, ColorSecondary800, ColorSecondary900, ColorSuccessDark, ColorSuccessDefault, ColorSuccessLight, ColorWarningDark, ColorWarningDefault, ColorWarningLight, ContainerComponent, DateRangePickerComponent, DatepickerComponent, DependencyViewerComponent, DiffViewerComponent, DividerComponent, DocumentViewerComponent, DonutChartComponent, DrawerComponent, Elevation1, Elevation2, Elevation3, Elevation4, EmailInputComponent, EmptyStateComponent, ErrorDisplayComponent, FieldGroupComponent, FileUploadComponent, FilterBarComponent, FooterComponent, FunnelChartComponent, GalleryComponent, GanttChartComponent, GaugeComponent, HeaderComponent, HeatmapComponent, HeroComponent, IconComponent, InputComponent, KanbanBoardComponent, LineChartComponent, ListComponent, ListItemTemplateDirective, LogoComponent, MenuComponent, ModalComponent, NotificationCenterComponent, NumberInputComponent, PaginationComponent, PasswordInputComponent, PieChartComponent, PopoverComponent, ProgressBarComponent, ProgressRingComponent, RadarChartComponent, RadioComponent, RatingComponent, RichTextEditorComponent, ScatterPlotComponent, SearchInputComponent, SectionComponent, SelectComponent, SidenavComponent, SizeInteractiveLgFontSize, SizeInteractiveLgHeight, SizeInteractiveLgPadding, SizeInteractiveMdFontSize, SizeInteractiveMdHeight, SizeInteractiveMdPadding, SizeInteractiveSmFontSize, SizeInteractiveSmHeight, SizeInteractiveSmPadding, SizeInteractiveXsFontSize, SizeInteractiveXsHeight, SizeInteractiveXsPadding, SizeMinTouchHeight, SizeMinTouchWidth, SkeletonComponent, SliderComponent, SpacerComponent, Spacing0, Spacing05, Spacing1, Spacing10, Spacing11, Spacing12, Spacing14, Spacing15, Spacing16, Spacing2, Spacing25, Spacing3, Spacing35, Spacing4, Spacing5, Spacing6, Spacing7, Spacing8, Spacing9, SparklineComponent, SpinnerComponent, StackComponent, StackedBarChartComponent, StatTrendComponent, StepperComponent, SwitchComponent, TabComponent, TableCellDirective, TableComponent, TabsComponent, TagInputComponent, TextareaComponent, ThemeService, TimelineComponent, ToastComponent, ToastService, ToggleGroupComponent, TooltipContentComponent, TooltipDirective, TypographyComponent, TypographyFontFamilyBase, TypographyFontFamilyMono, TypographyFontSize2xl, TypographyFontSize3xl, TypographyFontSize4xl, TypographyFontSize5xl, TypographyFontSize6xl, TypographyFontSizeBase, TypographyFontSizeLg, TypographyFontSizeSm, TypographyFontSizeXl, TypographyFontSizeXs, TypographyFontWeightBold, TypographyFontWeightMedium, TypographyFontWeightNormal, TypographyFontWeightSemibold, TypographyLineHeightNormal, TypographyLineHeightRelaxed, TypographyLineHeightTight, VerificationCodeInputComponent, WaterfallChartComponent };
+export type { AlertVariant, AreaChartSeries, AvatarGroupItem, AvatarSize, AvatarStatus, BadgeSize, BadgeVariant, BarChartItem, BarChartOrientation, BreadcrumbItem, BreadcrumbSize, ButtonSize, ButtonType, ButtonVariant, CalendarEvent, CalendarView, CalloutVariant, CellEditEvent, ChatMessage, ChatMessageRole, ChatSendEvent, CheckboxSize, ChipSize, ChipVariant, CodeBlockLanguage, ContainerSize, DateRange, DateValue, DependencyDirection, DependencyEdgeDef, DependencyNode, DependencyNodeStatus, DependencyRelation, DiffViewMode, DividerOrientation, DividerSpacing, DividerVariant, DocumentType, DonutChartSize, DonutSegment, DrawerPosition, DrawerSize, EmptyStateSize, ErrorSeverity, FileUploadFile, FilterConfig, FilterOption, FilterValues, FooterLink, FooterSection, FooterVariant, FunnelStep, GalleryItem, GalleryLayout, GallerySize, GanttDependency, GanttTask, GaugeColor, GaugeSize, HeatmapCell, HeroColor, HeroSize, IconSize, IconVariant, KanbanCard, KanbanColumn, KanbanLabel, KanbanMoveEvent, LineChartSeries, ListItem, ListOrientation, ListVariant, MenuItem, ModalSize, NavigationItem, Notification, NotificationPriority, NotificationType, PaginationSize, PasswordRequirement, PasswordStrength, PieChartSize, PieSegment, PopoverPosition, PopoverTrigger, ProgressBarColor, ProgressBarSize, ProgressBarVariant, ProgressRingColor, ProgressRingSize, RadarChartSeries, RadioSize, RatingSize, RichTextEditorMode, ScatterPoint, ScatterSeries, SearchInputSize, SectionBackground, SectionSpacing, SelectOption, SelectOptionGroup, SelectValue, SelectionChangeEvent, SidenavMode, SidenavPosition, SkeletonVariant, SortEvent, SpacerSize, SparklineColor, SparklineCurve, SpinnerSize, StackAlign, StackDirection, StackGap, StackJustify, StackedBarCategory, StackedBarLegend, StackedBarOrientation, StatTrendDirection, StepState, StepperStep, TabOrientation, TableColumn, TableSize, TableVariant, ThemeConfig, ThemeMode, ThemeState, TimelineItem, TimelineOrientation, Toast, ToastAction, ToastConfig, ToastPosition, ToastVariant, ToggleOption, ToolbarAction, ToolbarConfig, TooltipPosition, WaterfallItem };