@pecb-ui/components 1.1.2 → 2.0.0

package/lib/components/right-modal/right-modal.component.d.ts

@@ -1,137 +0,0 @@
-import { EventEmitter, OnInit, OnDestroy, ElementRef, AfterViewInit } from '@angular/core';
-import * as i0 from "@angular/core";
-export type RightModalSize = 'sm' | 'md' | 'lg';
-/**
- * A right-side sliding modal/drawer component.
- * Slides in from the right edge of the screen with backdrop overlay.
- * Fully accessible with WCAG 2.1 AA compliance.
- *
- * @example
- * ```html
- * <pecb-right-modal
- *   [isOpen]="isModalOpen"
- *   (closed)="onModalClose()"
- *   ariaLabel="Exam Details"
- * >
- *   <div pecbRightModalHeader>
- *     <h2>Exam Details</h2>
- *   </div>
- *   <div pecbRightModalContent>
- *     <p>Modal content goes here</p>
- *   </div>
- *   <div pecbRightModalFooter>
- *     <button>Action</button>
- *   </div>
- * </pecb-right-modal>
- * ```
- *
- * @publicApi
- */
-export declare class RightModalComponent implements OnInit, OnDestroy, AfterViewInit {
-    /**
-     * Unique ID for the modal element
-     */
-    id: string;
-    /**
-     * Whether the modal is open
-     */
-    isOpen: boolean;
-    /**
-     * Size of the modal panel
-     */
-    size: RightModalSize;
-    /**
-     * Whether clicking the backdrop closes the modal
-     */
-    closeOnBackdropClick: boolean;
-    /**
-     * Whether pressing Escape closes the modal
-     */
-    closeOnEscape: boolean;
-    /**
-     * Whether to show the close button
-     */
-    showCloseButton: boolean;
-    /**
-     * Accessible label for the modal
-     */
-    ariaLabel?: string;
-    /**
-     * ID of element that labels this modal
-     */
-    ariaLabelledBy?: string;
-    /**
-     * ID of element that describes this modal
-     */
-    ariaDescribedBy?: string;
-    /**
-     * Emitted when the modal is closed
-     */
-    closed: EventEmitter<void>;
-    /**
-     * Emitted when the modal is opened
-     */
-    opened: EventEmitter<void>;
-    modalPanel: ElementRef<HTMLElement>;
-    private cleanupFocusTrap;
-    private cleanupBodyScroll;
-    private previousActiveElement;
-    ngOnInit(): void;
-    ngAfterViewInit(): void;
-    ngOnDestroy(): void;
-    /**
-     * Get CSS classes for the modal container
-     */
-    get modalClasses(): string[];
-    /**
-     * Get CSS classes for the modal panel
-     */
-    get panelClasses(): string[];
-    /**
-     * Handle backdrop click
-     */
-    onBackdropClick(event: MouseEvent): void;
-    /**
-     * Handle keyboard events
-     */
-    onKeydown(event: KeyboardEvent): void;
-    /**
-     * Close the modal
-     */
-    close(): void;
-    /**
-     * Called when modal opens
-     */
-    private onOpen;
-    /**
-     * Setup focus trap after view is ready
-     */
-    private setupFocusTrap;
-    /**
-     * Cleanup resources
-     */
-    private cleanup;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RightModalComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RightModalComponent, "pecb-right-modal", never, { "id": { "alias": "id"; "required": false; }; "isOpen": { "alias": "isOpen"; "required": false; }; "size": { "alias": "size"; "required": false; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; }; }, { "closed": "closed"; "opened": "opened"; }, never, ["[pecbRightModalHeader]", "[pecbRightModalContent]", "*", "[pecbRightModalFooter]"], true, never>;
-}
-/**
- * Header directive for right modal
- */
-export declare class RightModalHeaderDirective {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RightModalHeaderDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RightModalHeaderDirective, "[pecbRightModalHeader]", never, {}, {}, never, never, true, never>;
-}
-/**
- * Content directive for right modal
- */
-export declare class RightModalContentDirective {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RightModalContentDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RightModalContentDirective, "[pecbRightModalContent]", never, {}, {}, never, never, true, never>;
-}
-/**
- * Footer directive for right modal
- */
-export declare class RightModalFooterDirective {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RightModalFooterDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RightModalFooterDirective, "[pecbRightModalFooter]", never, {}, {}, never, never, true, never>;
-}

package/lib/components/sidebar/sidebar.component.d.ts

@@ -1,97 +0,0 @@
-import { EventEmitter } from '@angular/core';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
-import * as i0 from "@angular/core";
-export interface SidebarMenuItem {
-    id: string;
-    label: string;
-    icon?: string;
-    route?: string;
-    active?: boolean;
-    children?: SidebarMenuItem[];
-    expanded?: boolean;
-}
-export interface SidebarSection {
-    id: string;
-    title?: string;
-    items: SidebarMenuItem[];
-}
-/**
- * A professional sidebar navigation component with collapsible sections and nested items.
- * Perfect for application navigation with hierarchical menu structures.
- *
- * @example
- * ```html
- * <!-- Basic sidebar -->
- * <pecb-sidebar
- *   [sections]="menuSections"
- *   (itemClick)="onMenuItemClick($event)"
- * ></pecb-sidebar>
- *
- * <!-- With logo header -->
- * <pecb-sidebar
- *   [sections]="menuSections"
- *   [showHeader]="true"
- *   [sidebarLogo]="logoSvg"
- * ></pecb-sidebar>
- * ```
- *
- * @publicApi
- */
-export declare class SidebarComponent {
-    private sanitizer;
-    constructor(sanitizer: DomSanitizer);
-    /**
-     * Array of sidebar sections with menu items
-     */
-    sections: SidebarSection[];
-    /**
-     * Whether to show the header section
-     */
-    showHeader: boolean;
-    /**
-     * Sidebar logo as an SVG string. Rendered in the header area.
-     */
-    sidebarLogo?: string;
-    /**
-     * Whether to show the footer section
-     */
-    showFooter: boolean;
-    /**
-     * Whether the sidebar is collapsed
-     */
-    collapsed: boolean;
-    /**
-     * Event emitted when a menu item is clicked
-     */
-    itemClick: EventEmitter<SidebarMenuItem>;
-    /**
-     * Event emitted when the sidebar collapse state changes
-     */
-    collapseChange: EventEmitter<boolean>;
-    /**
-     * Handle menu item click
-     */
-    onItemClick(item: SidebarMenuItem, event: Event): void;
-    /**
-     * Toggle sidebar collapse state
-     */
-    toggleCollapse(): void;
-    /**
-     * Sanitize icon SVG HTML to prevent Angular from stripping SVG elements
-     */
-    getSafeIcon(icon: string): SafeHtml;
-    /**
-     * TrackBy for sections
-     */
-    trackBySection(_index: number, section: SidebarSection): string;
-    /**
-     * TrackBy for menu items
-     */
-    trackByItem(_index: number, item: SidebarMenuItem): string;
-    /**
-     * Get CSS classes for a menu item
-     */
-    getItemClasses(item: SidebarMenuItem, isChild?: boolean, isNested?: boolean): string[];
-    static ɵfac: i0.ɵɵFactoryDeclaration<SidebarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SidebarComponent, "pecb-sidebar", never, { "sections": { "alias": "sections"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "sidebarLogo": { "alias": "sidebarLogo"; "required": false; }; "showFooter": { "alias": "showFooter"; "required": false; }; "collapsed": { "alias": "collapsed"; "required": false; }; }, { "itemClick": "itemClick"; "collapseChange": "collapseChange"; }, never, ["[sidebar-header]", "[sidebar-footer]"], true, never>;
-}

package/lib/components/status/status.component.d.ts

@@ -1,19 +0,0 @@
-import * as i0 from "@angular/core";
-export type StatusType = 'warning' | 'action' | 'success' | 'error' | 'different' | 'disabled' | 'neutral';
-export type StatusVariant = 'accent' | 'filled' | 'outline' | 'custom';
-export type StatusSize = 'sm' | 'md' | 'lg';
-export declare class StatusComponent {
-    private _id;
-    type: StatusType;
-    variant: StatusVariant;
-    size: StatusSize;
-    ariaLabel?: string;
-    /** Text content to display (alternative to ng-content, useful for dynamic components) */
-    text?: string;
-    /** Custom CSS class(es) to add to the status element */
-    customClass?: string;
-    get id(): string;
-    get statusClasses(): string[];
-    static ɵfac: i0.ɵɵFactoryDeclaration<StatusComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<StatusComponent, "pecb-status", never, { "type": { "alias": "type"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "text": { "alias": "text"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; }, {}, never, ["*"], true, never>;
-}

package/lib/components/tab/tab.component.d.ts

@@ -1,102 +0,0 @@
-import { EventEmitter } from '@angular/core';
-import * as i0 from "@angular/core";
-export type TabStyle = 'rounded' | 'line';
-export type TabSize = 'sm' | 'md';
-/**
- * A professional tab component with multiple styles and sizes.
- * Fully accessible with WCAG 2.1 AA compliance.
- *
- * @example
- * ```html
- * <pecb-tab
- *   label="Tab Name"
- *   [active]="true"
- *   style="rounded"
- *   size="md"
- *   (clicked)="handleClick()"
- * ></pecb-tab>
- *
- * <!-- With badge number and close button -->
- * <pecb-tab
- *   label="Tab Name"
- *   [icon]="10"
- *   [closable]="true"
- *   [active]="true"
- *   (closed)="handleClose()"
- * ></pecb-tab>
- * ```
- *
- * @publicApi
- */
-export declare class TabComponent {
-    /**
-     * Unique ID for the tab element
-     */
-    id: string;
-    /**
-     * The visual style of the tab
-     */
-    style: TabStyle;
-    /**
-     * The size of the tab
-     */
-    size: TabSize;
-    /**
-     * Label text to display
-     */
-    label: string;
-    /**
-     * Optional badge number to display after the label
-     */
-    icon?: number;
-    /**
-     * Whether the tab is in active state
-     */
-    active: boolean;
-    /**
-     * Whether the tab is disabled
-     */
-    disabled: boolean;
-    /**
-     * Whether to show close button
-     */
-    closable: boolean;
-    /**
-     * Accessible label for the tab
-     */
-    ariaLabel?: string;
-    /**
-     * ID of the tab panel this tab controls
-     */
-    ariaControls?: string;
-    /**
-     * Indicates if the tab panel is selected
-     */
-    ariaSelected?: boolean;
-    /**
-     * Event emitted when the tab is clicked
-     */
-    clicked: EventEmitter<string>;
-    /**
-     * Event emitted when the close button is clicked
-     */
-    closed: EventEmitter<string>;
-    /**
-     * Get CSS classes for the tab
-     */
-    get tabClasses(): string[];
-    /**
-     * Handle tab click
-     */
-    onClick(event: MouseEvent): void;
-    /**
-     * Handle close button click
-     */
-    onClose(event: MouseEvent): void;
-    /**
-     * Handle keyboard events for accessibility
-     */
-    onKeyDown(event: KeyboardEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabComponent, "pecb-tab", never, { "id": { "alias": "id"; "required": false; }; "style": { "alias": "style"; "required": false; }; "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "active": { "alias": "active"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "closable": { "alias": "closable"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaControls": { "alias": "ariaControls"; "required": false; }; "ariaSelected": { "alias": "ariaSelected"; "required": false; }; }, { "clicked": "clicked"; "closed": "closed"; }, never, never, true, never>;
-}