@neural-ui/core 1.2.1 → 1.3.0

package/types/neural-ui-core-table.d.ts

@@ -0,0 +1,282 @@
+import * as _angular_core from '@angular/core';
+import { TemplateRef } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { NeuSelectOption } from '@neural-ui/core/select';
+
+/**
+ * Directiva para definir el template de expansión de fila en NeuTable.
+ *
+ * Uso:
+ * ```html
+ * <neu-table [expandable]="true" [columns]="cols" [data]="rows">
+ *   <ng-template neuTableExpand let-row>
+ *     <div>{{ row.details }}</div>
+ *   </ng-template>
+ * </neu-table>
+ * ```
+ */
+declare class NeuTableExpandDirective {
+    readonly templateRef: TemplateRef<{
+        $implicit: Record<string, unknown>;
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuTableExpandDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NeuTableExpandDirective, "ng-template[neuTableExpand]", never, {}, {}, never, never, true, never>;
+}
+
+type NeuTableBadgeVariant = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'default';
+interface NeuTableBadgeConfig {
+    /** Etiqueta visible. Si se omite, se muestra el valor bruto. */
+    label?: string;
+    variant: NeuTableBadgeVariant;
+}
+interface NeuTableAction<T = Record<string, unknown>> {
+    key: string;
+    label: string;
+    icon: string;
+    variant?: 'ghost' | 'primary' | 'danger';
+    show?: (row: T) => boolean;
+    disabled?: (row: T) => boolean;
+    /** Texto de confirmación inline. Requiere segunda pulsación. */
+    confirm?: string;
+}
+interface NeuTableActionEvent<T = Record<string, unknown>> {
+    action: NeuTableAction<T>;
+    row: T;
+}
+interface NeuTableSortEntry {
+    key: string;
+    dir: 'asc' | 'desc';
+}
+interface NeuTableServerState {
+    page: number;
+    pageSize: number;
+    search: string;
+    sortKey: string;
+    sortDir: 'asc' | 'desc';
+    sortEntries: NeuTableSortEntry[];
+    columnFilters: Record<string, unknown>;
+}
+type NeuTableCellType = 'text' | 'badge' | 'date' | 'number' | 'currency' | 'link' | 'actions';
+interface NeuTableColumn<T = Record<string, unknown>> {
+    key: string;
+    header: string;
+    width?: string;
+    align?: 'left' | 'center' | 'right';
+    cell?: (row: T) => string;
+    cellTemplate?: TemplateRef<{
+        $implicit: T;
+        row: T;
+        column: NeuTableColumn<T>;
+    }>;
+    cellClass?: string;
+    sortable?: boolean;
+    type?: NeuTableCellType;
+    badgeMap?: Record<string, NeuTableBadgeConfig>;
+    dateFormat?: Intl.DateTimeFormatOptions;
+    locale?: string;
+    numberFormat?: Intl.NumberFormatOptions;
+    currencyCode?: string;
+    linkHref?: (row: T) => string;
+    linkTarget?: '_blank' | '_self';
+    actions?: NeuTableAction<T>[];
+    filterable?: boolean;
+    filterType?: 'text' | 'select' | 'number-range' | 'date';
+    filterOptions?: string[];
+    frozen?: 'left' | 'right';
+    headerTemplate?: TemplateRef<{
+        $implicit: NeuTableColumn<T>;
+    }>;
+}
+
+type Row = Record<string, unknown>;
+/**
+ * NeuralUI Table — Componente Estrella
+ *
+ * Tabla de datos con:
+ *   - Búsqueda/filtrado → ?q=...
+ *   - Paginación → ?page=...
+ *   - Ordenación → ?sort=col&sortDir=asc|desc
+ *   - Selección de filas (múltiple) opcional
+ *   - Skeleton de carga animado
+ *   - Scroll horizontal elegante en mobile (<400px)
+ *
+ * Uso básico:
+ *   <neu-table [columns]="cols" [data]="rows" />
+ *
+ * Múltiples tablas por página:
+ *   <neu-table pageParam="userPage" searchParam="userQ" sortParam="userSort" ... />
+ */
+declare class NeuTableComponent {
+    private readonly _destroyRef;
+    private readonly _urlState;
+    private readonly _platformId;
+    readonly expandTemplate: _angular_core.Signal<NeuTableExpandDirective | undefined>;
+    readonly columns: _angular_core.InputSignal<NeuTableColumn<Record<string, unknown>>[]>;
+    readonly data: _angular_core.InputSignal<object[]>;
+    readonly pageSize: _angular_core.InputSignal<number>;
+    readonly loading: _angular_core.InputSignal<boolean>;
+    readonly title: _angular_core.InputSignal<string>;
+    readonly emptyMessage: _angular_core.InputSignal<string>;
+    readonly skeletonRows: _angular_core.InputSignal<number[]>;
+    readonly searchable: _angular_core.InputSignal<boolean>;
+    readonly searchPlaceholder: _angular_core.InputSignal<string>;
+    readonly exactMatchable: _angular_core.InputSignal<boolean>;
+    readonly exactMatchLabel: _angular_core.InputSignal<string>;
+    readonly searchAriaLabel: _angular_core.InputSignal<string>;
+    readonly clearSearchAriaLabel: _angular_core.InputSignal<string>;
+    readonly clearFilterLabel: _angular_core.InputSignal<string>;
+    readonly previousPageAriaLabel: _angular_core.InputSignal<string>;
+    readonly nextPageAriaLabel: _angular_core.InputSignal<string>;
+    readonly pageSizeLabel: _angular_core.InputSignal<string>;
+    readonly pageSizeAriaLabel: _angular_core.InputSignal<string>;
+    readonly paginationAriaLabel: _angular_core.InputSignal<string>;
+    readonly exportCsvTitle: _angular_core.InputSignal<string>;
+    readonly exportJsonTitle: _angular_core.InputSignal<string>;
+    readonly clearSelectionLabel: _angular_core.InputSignal<string>;
+    readonly selectionSummaryLabel: _angular_core.InputSignal<string>;
+    readonly tableAriaLabel: _angular_core.InputSignal<string>;
+    readonly selectAllAriaLabel: _angular_core.InputSignal<string>;
+    readonly selectRowAriaLabel: _angular_core.InputSignal<string>;
+    readonly expandRowAriaLabel: _angular_core.InputSignal<string>;
+    readonly filterPlaceholder: _angular_core.InputSignal<string>;
+    readonly filterAriaPrefix: _angular_core.InputSignal<string>;
+    readonly allFilterOptionLabel: _angular_core.InputSignal<string>;
+    readonly ofLabel: _angular_core.InputSignal<string>;
+    readonly resultLabelSingular: _angular_core.InputSignal<string>;
+    readonly resultLabelPlural: _angular_core.InputSignal<string>;
+    readonly sortable: _angular_core.InputSignal<boolean>;
+    readonly selectable: _angular_core.InputSignal<boolean>;
+    readonly expandable: _angular_core.InputSignal<boolean>;
+    readonly exportable: _angular_core.InputSignal<boolean>;
+    readonly exportFileName: _angular_core.InputSignal<string>;
+    readonly pageSizeOptions: _angular_core.InputSignal<number[]>;
+    readonly stickyHeader: _angular_core.InputSignal<boolean>;
+    readonly rowKey: _angular_core.InputSignal<string>;
+    readonly density: _angular_core.InputSignal<"compact" | "normal" | "relaxed">;
+    readonly showRowNumbers: _angular_core.InputSignal<boolean>;
+    readonly rowClass: _angular_core.InputSignal<((row: Row) => string) | undefined>;
+    readonly footerRow: _angular_core.InputSignal<Record<string, string | number> | undefined>;
+    readonly emptyStateTemplate: _angular_core.InputSignal<TemplateRef<void> | undefined>;
+    readonly serverSide: _angular_core.InputSignal<boolean>;
+    readonly totalItems: _angular_core.InputSignal<number | undefined>;
+    readonly multiSort: _angular_core.InputSignal<boolean>;
+    readonly exportFormats: _angular_core.InputSignal<("csv" | "json")[]>;
+    readonly exportColumns: _angular_core.InputSignal<string[]>;
+    readonly pageParam: _angular_core.InputSignal<string>;
+    readonly searchParam: _angular_core.InputSignal<string>;
+    readonly sortParam: _angular_core.InputSignal<string>;
+    readonly sortDirParam: _angular_core.InputSignal<string>;
+    /** Param used to persist multi-sort state in the URL / Param para persistir multisort en la URL */
+    readonly multiSortParam: _angular_core.InputSignal<string>;
+    /**
+     * Activa o desactiva la sincronización de estado con los queryParams de la URL.
+     * Cuando es false, la paginación, búsqueda y ordenación se gestionan con
+     * señales internas sin tocar la URL del navegador.
+     *
+     * Enables or disables URL query-param synchronization.
+     * When false, pagination, search and sort are managed with internal signals
+     * and the browser URL is never modified.
+     */
+    readonly useUrlState: _angular_core.InputSignal<boolean>;
+    readonly selectionChange: _angular_core.OutputEmitterRef<Row[]>;
+    readonly rowClick: _angular_core.OutputEmitterRef<Row>;
+    readonly rowDblClick: _angular_core.OutputEmitterRef<Row>;
+    readonly actionClick: _angular_core.OutputEmitterRef<NeuTableActionEvent<Row>>;
+    readonly serverStateChange: _angular_core.OutputEmitterRef<NeuTableServerState>;
+    readonly searchChange: _angular_core.OutputEmitterRef<string>;
+    private readonly _internalPage;
+    private readonly _internalSearch;
+    private readonly _internalSortKey;
+    private readonly _internalSortDir;
+    private readonly _internalMultiSort;
+    readonly currentPage: _angular_core.Signal<number>;
+    readonly searchQuery: _angular_core.Signal<string>;
+    readonly sortKey: _angular_core.Signal<string>;
+    readonly sortDir: _angular_core.Signal<"asc" | "desc">;
+    private readonly rows;
+    private readonly _exactMatch;
+    readonly exactMatch: _angular_core.Signal<boolean>;
+    /**
+     * Multi-sort entries derived from URL param or internal state.
+     * Entradas de multisort derivadas del param de URL o del estado interno.
+     */
+    readonly _sortEntries: _angular_core.Signal<NeuTableSortEntry[]>;
+    readonly _columnFilters: _angular_core.WritableSignal<Record<string, unknown>>;
+    readonly _pageSizeControl: FormControl<string>;
+    private readonly _columnFilterControls;
+    /** True when at least one column has filterable:true / True si alguna columna tiene filterable:true */
+    readonly _hasFilterableCol: _angular_core.Signal<boolean>;
+    /** Convierte filterOptions de string[] a NeuSelectOption[] con opción "Todos" al inicio.
+     *  Converts filterOptions from string[] to NeuSelectOption[] with a leading "All" option. */
+    _filterOpts(col: NeuTableColumn): NeuSelectOption[];
+    readonly _pageSizeOptions: _angular_core.Signal<NeuSelectOption[]>;
+    constructor();
+    private readonly _confirmPending;
+    private readonly _rows;
+    readonly filteredData: _angular_core.Signal<Row[]>;
+    readonly sortedData: _angular_core.Signal<Row[]>;
+    private readonly _dynamicPageSize;
+    readonly effectivePageSize: _angular_core.Signal<number>;
+    readonly totalPages: _angular_core.Signal<number>;
+    readonly paginatedData: _angular_core.Signal<Row[]>;
+    readonly pageNumbers: _angular_core.Signal<number[]>;
+    readonly paginationInfo: _angular_core.Signal<string>;
+    readonly totalColspan: _angular_core.Signal<number>;
+    /** Calcula el offset izquierdo acumulado para columnas frozen-left múltiples.
+     *  Calculates cumulative left offset for multiple frozen-left columns. */
+    readonly _frozenLeftOffsets: _angular_core.Signal<Map<string, number>>;
+    readonly _lastFrozenLeftKey: _angular_core.Signal<string | null>;
+    readonly _firstFrozenRightKey: _angular_core.Signal<string>;
+    isLastFrozenLeftColumn(key: string): boolean;
+    isFirstFrozenRightColumn(key: string): boolean;
+    private readonly _expandedKeys;
+    isRowExpanded(row: Row): boolean;
+    toggleExpand(row: Row): void;
+    private readonly _selectedKeys;
+    readonly selectedCount: _angular_core.Signal<number>;
+    readonly selectedRowsInfo: _angular_core.Signal<string>;
+    /**
+     * TRUE cuando TODOS los registros que pasan el filtro activo están seleccionados.
+     * A diferencia de una selección global, actúa solo sobre el subconjunto filtrado.
+     */
+    readonly isAllFilteredSelected: _angular_core.Signal<boolean>;
+    readonly isSomeFilteredSelected: _angular_core.Signal<boolean>;
+    isRowSelected(row: Row): boolean;
+    toggleRow(row: Row): void;
+    /** Selecciona/deselecciona SOLO los datos filtrados activos. */
+    toggleAll(): void;
+    clearSelection(): void;
+    private _emitSelection;
+    goToPage(page: number): void;
+    sortBy(key: string, event?: MouseEvent): void;
+    onRowClick(row: Row, _event: MouseEvent): void;
+    onSearch(event: Event): void;
+    clearSearch(): void;
+    onPageSizeChange(value: string | number | {
+        target?: {
+            value?: unknown;
+        };
+    } | null): void;
+    setExactMatch(value: boolean): void;
+    setColumnFilter(colKey: string, value: unknown): void;
+    clearColumnFilters(): void;
+    isConfirmPending(row: Row, action: NeuTableAction<Row>): boolean;
+    handleAction(row: Row, action: NeuTableAction<Row>): void;
+    cancelConfirm(): void;
+    exportCsv(): void;
+    exportJson(): void;
+    private _getExportColumns;
+    private _downloadBlob;
+    getRowKey(row: Row): unknown;
+    getRowClass(row: Row): string;
+    getCellValue(row: Row, col: NeuTableColumn): string;
+    getSortPriority(key: string): number;
+    columnFilterControl(key: string): FormControl<string>;
+    getColumnFilterValue(key: string): unknown;
+    private _emitServerState;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuTableComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuTableComponent, "neu-table", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "skeletonRows": { "alias": "skeletonRows"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "exactMatchable": { "alias": "exactMatchable"; "required": false; "isSignal": true; }; "exactMatchLabel": { "alias": "exactMatchLabel"; "required": false; "isSignal": true; }; "searchAriaLabel": { "alias": "searchAriaLabel"; "required": false; "isSignal": true; }; "clearSearchAriaLabel": { "alias": "clearSearchAriaLabel"; "required": false; "isSignal": true; }; "clearFilterLabel": { "alias": "clearFilterLabel"; "required": false; "isSignal": true; }; "previousPageAriaLabel": { "alias": "previousPageAriaLabel"; "required": false; "isSignal": true; }; "nextPageAriaLabel": { "alias": "nextPageAriaLabel"; "required": false; "isSignal": true; }; "pageSizeLabel": { "alias": "pageSizeLabel"; "required": false; "isSignal": true; }; "pageSizeAriaLabel": { "alias": "pageSizeAriaLabel"; "required": false; "isSignal": true; }; "paginationAriaLabel": { "alias": "paginationAriaLabel"; "required": false; "isSignal": true; }; "exportCsvTitle": { "alias": "exportCsvTitle"; "required": false; "isSignal": true; }; "exportJsonTitle": { "alias": "exportJsonTitle"; "required": false; "isSignal": true; }; "clearSelectionLabel": { "alias": "clearSelectionLabel"; "required": false; "isSignal": true; }; "selectionSummaryLabel": { "alias": "selectionSummaryLabel"; "required": false; "isSignal": true; }; "tableAriaLabel": { "alias": "tableAriaLabel"; "required": false; "isSignal": true; }; "selectAllAriaLabel": { "alias": "selectAllAriaLabel"; "required": false; "isSignal": true; }; "selectRowAriaLabel": { "alias": "selectRowAriaLabel"; "required": false; "isSignal": true; }; "expandRowAriaLabel": { "alias": "expandRowAriaLabel"; "required": false; "isSignal": true; }; "filterPlaceholder": { "alias": "filterPlaceholder"; "required": false; "isSignal": true; }; "filterAriaPrefix": { "alias": "filterAriaPrefix"; "required": false; "isSignal": true; }; "allFilterOptionLabel": { "alias": "allFilterOptionLabel"; "required": false; "isSignal": true; }; "ofLabel": { "alias": "ofLabel"; "required": false; "isSignal": true; }; "resultLabelSingular": { "alias": "resultLabelSingular"; "required": false; "isSignal": true; }; "resultLabelPlural": { "alias": "resultLabelPlural"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "expandable": { "alias": "expandable"; "required": false; "isSignal": true; }; "exportable": { "alias": "exportable"; "required": false; "isSignal": true; }; "exportFileName": { "alias": "exportFileName"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "rowKey": { "alias": "rowKey"; "required": false; "isSignal": true; }; "density": { "alias": "density"; "required": false; "isSignal": true; }; "showRowNumbers": { "alias": "showRowNumbers"; "required": false; "isSignal": true; }; "rowClass": { "alias": "rowClass"; "required": false; "isSignal": true; }; "footerRow": { "alias": "footerRow"; "required": false; "isSignal": true; }; "emptyStateTemplate": { "alias": "emptyStateTemplate"; "required": false; "isSignal": true; }; "serverSide": { "alias": "serverSide"; "required": false; "isSignal": true; }; "totalItems": { "alias": "totalItems"; "required": false; "isSignal": true; }; "multiSort": { "alias": "multiSort"; "required": false; "isSignal": true; }; "exportFormats": { "alias": "exportFormats"; "required": false; "isSignal": true; }; "exportColumns": { "alias": "exportColumns"; "required": false; "isSignal": true; }; "pageParam": { "alias": "pageParam"; "required": false; "isSignal": true; }; "searchParam": { "alias": "searchParam"; "required": false; "isSignal": true; }; "sortParam": { "alias": "sortParam"; "required": false; "isSignal": true; }; "sortDirParam": { "alias": "sortDirParam"; "required": false; "isSignal": true; }; "multiSortParam": { "alias": "multiSortParam"; "required": false; "isSignal": true; }; "useUrlState": { "alias": "useUrlState"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; "rowClick": "rowClick"; "rowDblClick": "rowDblClick"; "actionClick": "actionClick"; "serverStateChange": "serverStateChange"; "searchChange": "searchChange"; }, ["expandTemplate"], never, true, never>;
+}
+
+export { NeuTableComponent, NeuTableExpandDirective };
+export type { NeuTableAction, NeuTableActionEvent, NeuTableBadgeConfig, NeuTableBadgeVariant, NeuTableCellType, NeuTableColumn, NeuTableServerState, NeuTableSortEntry };

package/types/neural-ui-core-tabs.d.ts

@@ -0,0 +1,76 @@
+import * as _angular_core from '@angular/core';
+import { InjectionToken, AfterViewInit, OnDestroy } from '@angular/core';
+
+declare const NEU_TABS_CONTEXT: InjectionToken<NeuTabsComponent>;
+interface NeuTab {
+    /** ID único de la pestaña — se usa como valor en la URL / Unique tab ID — used as the URL value */
+    id: string;
+    /** Etiqueta visible / Visible label */
+    label: string;
+    /** Badge opcional junto al label / Optional badge next to the label */
+    badge?: string;
+    /** Deshabilita la pestaña sin ocultarla / Disables the tab without hiding it */
+    disabled?: boolean;
+}
+/**
+ * NeuralUI Tabs Component
+ *
+ * Sistema de pestañas con estado sincronizado a la URL via NeuUrlStateService. / Tab system with state synchronized to the URL via NeuUrlStateService.
+ * El panel activo se determina por ?{tabParam}={tabId}. / The active panel is determined by ?{tabParam}={tabId}.
+ *
+ * Uso:
+ *   <neu-tabs [tabs]="tabs" tabParam="tab">
+ *     <neu-tab-panel tabId="preview">...</neu-tab-panel>
+ *     <neu-tab-panel tabId="api">...</neu-tab-panel>
+ *   </neu-tabs>
+ */
+declare class NeuTabsComponent implements AfterViewInit, OnDestroy {
+    private readonly urlState;
+    private readonly elRef;
+    private resizeObserver?;
+    constructor();
+    /** Definición de pestañas / Tab definitions */
+    tabs: _angular_core.InputSignal<NeuTab[]>;
+    /** QueryParam que almacena la pestaña activa / QueryParam that stores the active tab */
+    tabParam: _angular_core.InputSignal<string>;
+    /** Si true, elimina el padding interno de los paneles / If true, removes the internal padding from panels */
+    flush: _angular_core.InputSignal<boolean>;
+    /** Etiqueta accesible del rol tablist / Accessible label for the tablist role */
+    ariaLabel: _angular_core.InputSignal<string>;
+    /** Emite al cambiar de pestaña / Emits when the tab changes */
+    tabChange: _angular_core.OutputEmitterRef<string>;
+    /** ID de la pestaña activa (de la URL o la primera disponible) / Active tab ID (from the URL or the first available) */
+    readonly activeTabId: _angular_core.Signal<string>;
+    /** Posición del indicador calculada mediante medición DOM / Indicator position calculated via DOM measurement */
+    private readonly _indicatorLeft;
+    private readonly _indicatorWidth;
+    readonly indicatorStyle: _angular_core.Signal<string>;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private _updateIndicator;
+    selectTab(tab: NeuTab): void;
+    /** Mueve el foco entre tabs con flechas (roving tabindex — WAI-ARIA Tabs Pattern) / Moves focus between tabs with arrows (roving tabindex — WAI-ARIA Tabs Pattern) */
+    focusTab(event: Event, dir: 1 | -1 | 'first' | 'last'): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuTabsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuTabsComponent, "neu-tabs", never, { "tabs": { "alias": "tabs"; "required": false; "isSignal": true; }; "tabParam": { "alias": "tabParam"; "required": false; "isSignal": true; }; "flush": { "alias": "flush"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "tabChange": "tabChange"; }, never, ["*"], true, never>;
+}
+/**
+ * NeuralUI Tab Panel
+ *
+ * Panel de contenido asociado a una pestaña de NeuTabsComponent. / Content panel associated with a NeuTabsComponent tab.
+ * Solo se renderiza (no oculta con CSS) cuando la pestaña está activa. / Only rendered (not hidden with CSS) when the tab is active.
+ *
+ * Uso: hijo directo de <neu-tabs>
+ *   <neu-tab-panel tabId="api">...</neu-tab-panel>
+ */
+declare class NeuTabPanelComponent {
+    private readonly tabs;
+    /** ID que debe coincidir con NeuTab.id del padre / ID that must match the parent NeuTab.id */
+    tabId: _angular_core.InputSignal<string>;
+    readonly isActive: _angular_core.Signal<boolean>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuTabPanelComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuTabPanelComponent, "neu-tab-panel", never, { "tabId": { "alias": "tabId"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+export { NEU_TABS_CONTEXT, NeuTabPanelComponent, NeuTabsComponent };
+export type { NeuTab };

package/types/neural-ui-core-textarea.d.ts

@@ -0,0 +1,52 @@
+import * as _angular_core from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+
+/**
+ * NeuralUI Textarea Component
+ *
+ * Textarea con floating label y soporte completo para Angular Forms.
+ * Soporta auto-resize opcional.
+ *
+ * Uso:
+ *   <neu-textarea label="Descripción" [formControl]="ctrl" />
+ *   <neu-textarea label="Bio" [rows]="5" [autoResize]="true" />
+ */
+declare class NeuTextareaComponent implements ControlValueAccessor {
+    readonly label: _angular_core.InputSignal<string>;
+    readonly rows: _angular_core.InputSignal<number>;
+    /** Tamaño del campo: 'sm' = compacto | 'md' = estándar | 'lg' = grande / Field size */
+    readonly size: _angular_core.InputSignal<"sm" | "md" | "lg">;
+    readonly autoResize: _angular_core.InputSignal<boolean>;
+    /** Permite al usuario redimensionar el campo manualmente (por defecto: true) / Allows the user to manually resize the field (default: true) */
+    readonly resizable: _angular_core.InputSignal<boolean>;
+    readonly errorMessage: _angular_core.InputSignal<string>;
+    readonly hint: _angular_core.InputSignal<string>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly readonly: _angular_core.InputSignal<boolean>;
+    readonly required: _angular_core.InputSignal<boolean>;
+    readonly name: _angular_core.InputSignal<string>;
+    readonly maxlength: _angular_core.InputSignal<number | null>;
+    readonly _id: string;
+    protected readonly _value: _angular_core.WritableSignal<string>;
+    protected readonly _focused: _angular_core.WritableSignal<boolean>;
+    protected readonly _isDisabled: _angular_core.WritableSignal<boolean>;
+    readonly _isDisabledState: _angular_core.Signal<boolean>;
+    readonly hasValue: _angular_core.Signal<boolean>;
+    readonly hasError: _angular_core.Signal<boolean>;
+    readonly _resizeStyle: _angular_core.Signal<"none" | "vertical">;
+    private readonly _textareaRef;
+    private _onChange;
+    private _onTouched;
+    constructor();
+    onInput(event: Event): void;
+    onFocus(): void;
+    onBlur(): void;
+    writeValue(val: unknown): void;
+    registerOnChange(fn: (v: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuTextareaComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuTextareaComponent, "neu-textarea", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "autoResize": { "alias": "autoResize"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "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; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { NeuTextareaComponent };

package/types/neural-ui-core-timeline.d.ts

@@ -0,0 +1,33 @@
+import * as i0 from '@angular/core';
+
+type NeuTimelineItemVariant = 'default' | 'success' | 'warning' | 'danger' | 'info';
+interface NeuTimelineItem {
+    /** Etiqueta de tiempo (ej. "Hace 2h", "12 Mar") / Time label (e.g. "2h ago", "Mar 12") */
+    time?: string;
+    /** Título del evento / Event title */
+    title: string;
+    /** Descripción opcional / Optional description */
+    description?: string;
+    /** Variante de color del punto / Dot color variant */
+    variant?: NeuTimelineItemVariant;
+    /** Icono SVG path opcional / Optional SVG path icon */
+    icon?: string;
+}
+/**
+ * NeuralUI Timeline Component
+ *
+ * Lista vertical de eventos cronológicos con línea conectora. / Vertical list of chronological events with a connector line.
+ *
+ * Uso:
+ *   <neu-timeline [items]="events" />
+ *   <neu-timeline [items]="events" align="right" />
+ */
+declare class NeuTimelineComponent {
+    /** Eventos a mostrar / Events to display */
+    items: i0.InputSignal<NeuTimelineItem[]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NeuTimelineComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NeuTimelineComponent, "neu-timeline", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { NeuTimelineComponent };
+export type { NeuTimelineItem, NeuTimelineItemVariant };

package/types/neural-ui-core-toast.d.ts

@@ -0,0 +1,70 @@
+import * as i0 from '@angular/core';
+
+type NeuToastType = 'success' | 'error' | 'info' | 'warning';
+type NeuToastPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
+interface NeuToastOptions {
+    /** Mensaje del toast / Toast message */
+    message: string;
+    /** Tipo semántico — controla color e icono / Semantic type — controls color and icon */
+    type?: NeuToastType;
+    /** Duración en ms antes de ocultarse automáticamente. 0 = sin auto-hide / Duration in ms before auto-hiding. 0 = no auto-hide */
+    duration?: number;
+    /** Título opcional / Optional title */
+    title?: string;
+}
+interface NeuToastItem extends Required<Omit<NeuToastOptions, 'title'>> {
+    id: string;
+    title: string;
+}
+
+/**
+ * NeuralUI Toast Service
+ *
+ * Lanza notificaciones flotantes desde cualquier punto de la app.
+ * Requiere que `<neu-toast-container>` esté presente en la raíz del app.
+ *
+ * Uso:
+ *   const toast = inject(NeuToastService);
+ *   toast.success('Guardado correctamente');
+ *   toast.error('Ha ocurrido un error', { title: 'Error', duration: 8000 });
+ */
+declare class NeuToastService {
+    /** Lista reactiva de toasts activos / Reactive list of active toasts */
+    readonly toasts: i0.WritableSignal<NeuToastItem[]>;
+    /** Posición del contenedor de toasts / Toast container position */
+    readonly position: i0.WritableSignal<NeuToastPosition>;
+    setPosition(position: NeuToastPosition): void;
+    show(options: NeuToastOptions): string;
+    success(message: string, opts?: Partial<NeuToastOptions>): string;
+    error(message: string, opts?: Partial<NeuToastOptions>): string;
+    info(message: string, opts?: Partial<NeuToastOptions>): string;
+    warning(message: string, opts?: Partial<NeuToastOptions>): string;
+    dismiss(id: string): void;
+    clear(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NeuToastService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NeuToastService>;
+}
+
+/**
+ * NeuralUI Toast Container Component
+ *
+ * Renderiza los toasts activos del NeuToastService.
+ * Añade este componente una sola vez en la raíz del app (app.html).
+ *
+ * Diseño mobile-first:
+ *   - < 400px: banner inferior centrado
+ *   - ≥ 400px: stack en la esquina superior derecha
+ *
+ * Uso:
+ *   <!-- en app.html -->
+ *   <neu-toast-container />
+ */
+declare class NeuToastContainerComponent {
+    readonly toastService: NeuToastService;
+    getIcon(type: NeuToastType): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NeuToastContainerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NeuToastContainerComponent, "neu-toast-container", never, {}, {}, never, never, true, never>;
+}
+
+export { NeuToastContainerComponent, NeuToastService };
+export type { NeuToastItem, NeuToastOptions, NeuToastPosition, NeuToastType };

package/types/neural-ui-core-toggle-button-group.d.ts

@@ -0,0 +1,63 @@
+import * as _angular_core from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import { NeuButtonSize } from '@neural-ui/core/button';
+
+interface NeuToggleOption<T = unknown> {
+    /** Texto visible del botón / Visible button text */
+    label: string;
+    /** Valor asociado a esta opción / Value associated with this option */
+    value: T;
+    /** Nombre de icono Lucide (opcional) / Lucide icon name (optional) */
+    icon?: string;
+    /** Deshabilita solo esta opción / Disables this option only */
+    disabled?: boolean;
+}
+/**
+ * NeuralUI ToggleButtonGroup Component
+ *
+ * Grupo de botones de selección (single o múltiple). / Selection button group (single or multiple).
+ * Selector segmentado para selección única o múltiple. / Segmented selector for single or multiple selection.
+ *
+ * Uso (single):
+ *   <neu-toggle-button-group [options]="opts" [formControl]="valueCtrl" />
+ *
+ * Uso (múltiple):
+ *   <neu-toggle-button-group [options]="opts" [multiple]="true" [formControl]="valuesCtrl" />
+ */
+declare class NeuToggleButtonGroupComponent<T = unknown> implements ControlValueAccessor {
+    /** Lista de opciones del grupo / Group option list */
+    options: _angular_core.InputSignal<NeuToggleOption<T>[]>;
+    /**
+     * Permite seleccionar múltiples opciones.
+     * - false (por defecto): valor es `T | null`
+     * - true: valor es `T[]`
+     */
+    multiple: _angular_core.InputSignal<boolean>;
+    /** Tamaño visual / Visual size */
+    size: _angular_core.InputSignal<NeuButtonSize>;
+    /** Deshabilita todo el grupo / Disables the entire group */
+    disabled: _angular_core.InputSignal<boolean>;
+    /** Emite el nuevo valor al cambiar (útil sin formControl) / Emits the new value on change (useful without formControl) */
+    neuChange: _angular_core.OutputEmitterRef<T | T[] | null>;
+    readonly _value: _angular_core.WritableSignal<T | T[] | null>;
+    readonly _isDisabled: _angular_core.WritableSignal<boolean>;
+    readonly groupClasses: _angular_core.Signal<{
+        [x: string]: boolean;
+        'neu-toggle-group': boolean;
+        'neu-toggle-group--disabled': boolean;
+    }>;
+    isSelected(value: T): boolean;
+    toggle(opt: NeuToggleOption<T>): void;
+    onBlur(): void;
+    private _onChange;
+    private _onTouched;
+    writeValue(val: T | T[] | null): void;
+    registerOnChange(fn: (v: unknown) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuToggleButtonGroupComponent<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuToggleButtonGroupComponent<any>, "neu-toggle-button-group", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "neuChange": "neuChange"; }, never, never, true, never>;
+}
+
+export { NeuToggleButtonGroupComponent };
+export type { NeuToggleOption };

package/types/neural-ui-core-toolbar.d.ts

@@ -0,0 +1,36 @@
+import * as _angular_core from '@angular/core';
+
+type NeuToolbarSize = 'sm' | 'md' | 'lg';
+/**
+ * NeuralUI Toolbar Component
+ *
+ * Barra horizontal con tres zonas de contenido: start (izquierda), center (centro) y end (derecha).
+ *
+ * Uso:
+ *   <neu-toolbar>
+ *     <span neu-toolbar-start>Logo</span>
+ *     <span neu-toolbar-center>Título</span>
+ *     <span neu-toolbar-end><neu-button>Acción</neu-button></span>
+ *   </neu-toolbar>
+ */
+declare class NeuToolbarComponent {
+    /** Tamaño de la toolbar / Toolbar size */
+    readonly size: _angular_core.InputSignal<NeuToolbarSize>;
+    /** Añade sombra en la parte inferior / Adds shadow at the bottom */
+    readonly shadow: _angular_core.InputSignal<boolean>;
+    /** Añade separador inferior / Adds bottom separator */
+    readonly bordered: _angular_core.InputSignal<boolean>;
+    /** Color de fondo personalizado vía CSS (pasa a la variable local) / Custom background color via CSS */
+    readonly surface: _angular_core.InputSignal<"primary" | "surface" | "none">;
+    readonly hostClasses: _angular_core.Signal<{
+        [x: string]: boolean;
+        'neu-toolbar': boolean;
+        'neu-toolbar--shadow': boolean;
+        'neu-toolbar--bordered': boolean;
+    }>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuToolbarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuToolbarComponent, "neu-toolbar", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "shadow": { "alias": "shadow"; "required": false; "isSignal": true; }; "bordered": { "alias": "bordered"; "required": false; "isSignal": true; }; "surface": { "alias": "surface"; "required": false; "isSignal": true; }; }, {}, never, ["[neu-toolbar-start]", "[neu-toolbar-center]", "[neu-toolbar-end]", "*"], true, never>;
+}
+
+export { NeuToolbarComponent };
+export type { NeuToolbarSize };