pdm-ui-kit 0.1.50 → 0.3.0

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

@@ -1,10 +1,32 @@
 import * as i0 from "@angular/core";
 export declare type PdmBreadcrumbMode = 'custom-separator' | 'dropdown' | 'collapsed' | 'link-component' | 'responsive';
+/**
+ * Breadcrumb component con soporte responsive
+ *
+ * MEJORADO en v0.2.0:
+ * - Modo responsive real con overflow-x-auto
+ * - Collapse inteligente en mobile
+ *
+ * @example
+ * <pdm-breadcrumb
+ *   mode="responsive"
+ *   [items]="['Home', 'Products', 'Electronics', 'Laptops']">
+ * </pdm-breadcrumb>
+ */
 export declare class PdmBreadcrumbComponent {
     mode: PdmBreadcrumbMode;
     items: string[];
     className: string;
+    /**
+     * Cantidad mínima de items para mostrar en mobile cuando mode="responsive"
+     * Default: 2 (primer y último item)
+     */
+    minItemsMobile: number;
     get renderedItems(): string[];
+    /**
+     * Determina si un item debe estar visible en mobile (modo responsive)
+     */
+    shouldShowInMobile(index: number): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmBreadcrumbComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmBreadcrumbComponent, "pdm-breadcrumb", never, { "mode": "mode"; "items": "items"; "className": "className"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmBreadcrumbComponent, "pdm-breadcrumb", never, { "mode": "mode"; "items": "items"; "className": "className"; "minItemsMobile": "minItemsMobile"; }, {}, never, never, false>;
 }

package/lib/components/button-group/button-group.component.d.ts

@@ -1,13 +1,19 @@
 import * as i0 from "@angular/core";
-export declare type PdmButtonGroupVariant = 'default' | 'group' | 'orientation' | 'separator';
-export declare type PdmButtonGroupOrientation = 'horizontal' | 'vertical';
+export declare type PdmButtonGroupVariant = "default" | "group" | "orientation" | "separator";
+export declare type PdmButtonGroupOrientation = "horizontal" | "vertical";
+declare type Axis = "horizontal" | "vertical";
 export declare class PdmButtonGroupComponent {
     variant: PdmButtonGroupVariant;
     orientation?: PdmButtonGroupOrientation;
     direction?: PdmButtonGroupOrientation;
     separated: boolean;
     className: string;
+    get axis(): Axis;
+    get isVertical(): boolean;
+    get shouldAttach(): boolean;
+    get ariaOrientation(): PdmButtonGroupOrientation;
     get rootClasses(): string[];
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmButtonGroupComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PdmButtonGroupComponent, "pdm-button-group", never, { "variant": "variant"; "orientation": "orientation"; "direction": "direction"; "separated": "separated"; "className": "className"; }, {}, never, ["*"], false>;
 }
+export {};

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

@@ -1,24 +1,37 @@
-import { EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
-export declare type PdmCardVariant = 'default' | 'login';
+/**
+ * Card component - Visual container primitivo
+ *
+ * BREAKING CHANGE en v0.2.0: variant="login" eliminado.
+ * Card es ahora un componente UI puro sin lógica de negocio.
+ *
+ * Para crear un login form, componer con primitivos:
+ *
+ * @example
+ * <pdm-card>
+ *   <div pdmCardHeader>
+ *     <h3 class="text-lg font-semibold">Login</h3>
+ *     <p class="text-sm text-muted-foreground">Enter your credentials</p>
+ *   </div>
+ *   <div pdmCardContent>
+ *     <form [formGroup]="form">
+ *       <pdm-field>
+ *         <pdm-label>Email</pdm-label>
+ *         <pdm-input type="email" formControlName="email" />
+ *       </pdm-field>
+ *       <pdm-field>
+ *         <pdm-label>Password</pdm-label>
+ *         <pdm-input-password formControlName="password" />
+ *       </pdm-field>
+ *     </form>
+ *   </div>
+ *   <div pdmCardFooter>
+ *     <pdm-button (click)="onLogin()">Login</pdm-button>
+ *   </div>
+ * </pdm-card>
+ */
 export declare class PdmCardComponent {
-    variant: PdmCardVariant;
     className: string;
-    title: string;
-    description: string;
-    actionText: string;
-    emailLabel: string;
-    emailPlaceholder: string;
-    passwordLabel: string;
-    passwordHint: string;
-    primaryActionText: string;
-    secondaryActionText: string;
-    primaryAction: EventEmitter<void>;
-    secondaryAction: EventEmitter<void>;
-    actionPressed: EventEmitter<void>;
-    onPrimaryAction(): void;
-    onSecondaryAction(): void;
-    onActionPressed(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmCardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmCardComponent, "pdm-card", never, { "variant": "variant"; "className": "className"; "title": "title"; "description": "description"; "actionText": "actionText"; "emailLabel": "emailLabel"; "emailPlaceholder": "emailPlaceholder"; "passwordLabel": "passwordLabel"; "passwordHint": "passwordHint"; "primaryActionText": "primaryActionText"; "secondaryActionText": "secondaryActionText"; }, { "primaryAction": "primaryAction"; "secondaryAction": "secondaryAction"; "actionPressed": "actionPressed"; }, never, ["[pdmCardHeader]", "[pdmCardContent]", "[pdmCardFooter]"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmCardComponent, "pdm-card", never, { "className": "className"; }, {}, never, ["[pdmCardHeader]", "[pdmCardContent]", "[pdmCardFooter]"], false>;
 }

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

@@ -1,6 +1,11 @@
-import { EventEmitter } from '@angular/core';
+import { ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, ViewContainerRef } from "@angular/core";
+import { Overlay } from "@angular/cdk/overlay";
 import * as i0 from "@angular/core";
-export declare class PdmComboboxComponent {
+export declare class PdmComboboxComponent implements OnDestroy {
+    private readonly overlay;
+    private readonly viewContainerRef;
+    private readonly elementRef;
+    private readonly cdr;
     open: boolean;
     placeholder: string;
     searchPlaceholder: string;
@@ -8,11 +13,23 @@ export declare class PdmComboboxComponent {
     options: string[];
     value: string;
     width: number;
+    panelClassName: string;
     openChange: EventEmitter<boolean>;
     valueChange: EventEmitter<string>;
+    triggerRef?: ElementRef<HTMLElement>;
+    panelTemplateRef: any;
+    private overlayRef;
+    private outsideClickSub;
+    constructor(overlay: Overlay, viewContainerRef: ViewContainerRef, elementRef: ElementRef<HTMLElement>, cdr: ChangeDetectorRef);
+    ngOnDestroy(): void;
     get selectedLabel(): string;
     toggle(): void;
     select(option: string): void;
+    onEscape(): void;
+    private openPanel;
+    private close;
+    private destroyOverlay;
+    private getPositionConfigs;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmComboboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmComboboxComponent, "pdm-combobox", never, { "open": "open"; "placeholder": "placeholder"; "searchPlaceholder": "searchPlaceholder"; "className": "className"; "options": "options"; "value": "value"; "width": "width"; }, { "openChange": "openChange"; "valueChange": "valueChange"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmComboboxComponent, "pdm-combobox", never, { "open": "open"; "placeholder": "placeholder"; "searchPlaceholder": "searchPlaceholder"; "className": "className"; "options": "options"; "value": "value"; "width": "width"; "panelClassName": "panelClassName"; }, { "openChange": "openChange"; "valueChange": "valueChange"; }, never, never, false>;
 }

package/lib/components/context-menu/context-menu.component.d.ts

@@ -1,29 +1,38 @@
-import { ElementRef, EventEmitter, OnDestroy, OnInit } from '@angular/core';
-import { PdmMenuItem } from '../dropdown-menu/dropdown-menu.component';
+import { ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, OnInit, ViewContainerRef } from "@angular/core";
+import { Overlay } from "@angular/cdk/overlay";
+import { PdmMenuItem } from "../dropdown-menu/dropdown-menu.component";
 import * as i0 from "@angular/core";
 export interface PdmContextMenuItem extends PdmMenuItem {
     checked?: boolean;
     selectedDot?: boolean;
 }
 export declare class PdmContextMenuComponent implements OnInit, OnDestroy {
-    private readonly elementRef;
+    private readonly overlay;
+    private readonly viewContainerRef;
+    private readonly _elementRef;
+    private readonly cdr;
     items: PdmContextMenuItem[];
     className: string;
     triggerLabel: string;
     width: number;
     height: number;
+    panelClassName: string;
     itemSelect: EventEmitter<string>;
     open: boolean;
     x: number;
     y: number;
-    private boundPointerDown;
-    constructor(elementRef: ElementRef<HTMLElement>);
+    menuTemplateRef: any;
+    private overlayRef;
+    private outsideClickSub;
+    constructor(overlay: Overlay, viewContainerRef: ViewContainerRef, _elementRef: ElementRef<HTMLElement>, cdr: ChangeDetectorRef);
     ngOnInit(): void;
     ngOnDestroy(): void;
     onContextMenu(event: MouseEvent): void;
     select(item: PdmContextMenuItem): void;
-    onEsc(): void;
-    private onDocumentPointerDown;
+    onDocumentClick(event: MouseEvent): void;
+    private createOverlay;
+    private close;
+    private destroyOverlay;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmContextMenuComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmContextMenuComponent, "pdm-context-menu", never, { "items": "items"; "className": "className"; "triggerLabel": "triggerLabel"; "width": "width"; "height": "height"; }, { "itemSelect": "itemSelect"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmContextMenuComponent, "pdm-context-menu", never, { "items": "items"; "className": "className"; "triggerLabel": "triggerLabel"; "width": "width"; "height": "height"; "panelClassName": "panelClassName"; }, { "itemSelect": "itemSelect"; }, never, never, false>;
 }

package/lib/components/data-table/data-table.component.d.ts

@@ -1,5 +1,10 @@
-import { EventEmitter } from '@angular/core';
+import { EventEmitter, TemplateRef } from '@angular/core';
+import { TableResponsiveStrategy } from '../../utils/responsive';
 import * as i0 from "@angular/core";
+/**
+ * DEPRECATED: Esta interfaz es para backward compatibility
+ * Usar PdmDataTableColumn<T> con tipo genérico en su lugar
+ */
 export interface PdmDataTableRow {
     id: string;
     status: string;
@@ -7,36 +12,189 @@ export interface PdmDataTableRow {
     amount: string;
     selected?: boolean;
 }
-export declare class PdmDataTableComponent {
+/**
+ * Definición de columna para data-table genérico
+ */
+export interface PdmDataTableColumn<T = any> {
+    /**
+     * Key del campo en el objeto de datos
+     * Usado para acceder al valor: row[key]
+     */
+    key: keyof T;
+    /**
+     * Label a mostrar en el header
+     */
+    label: string;
+    /**
+     * Ancho de la columna (CSS width)
+     * Ej: '100px', '20%', 'auto'
+     */
+    width?: string;
+    /**
+     * Si la columna es sortable
+     */
+    sortable?: boolean;
+    /**
+     * Alineación del contenido
+     */
+    align?: 'left' | 'center' | 'right';
+    /**
+     * Función custom para renderizar el valor
+     * Si no se provee, se usa toString() del valor
+     */
+    render?: (value: any, row: T) => string;
+    /**
+     * Template personalizado para la celda
+     * Tiene prioridad sobre render()
+     */
+    cellTemplate?: TemplateRef<{
+        $implicit: T;
+        value: any;
+    }>;
+    /**
+     * Si es true, la columna se oculta en mobile
+     * Solo se muestra en breakpoint md+ (768px)
+     */
+    hideOnMobile?: boolean;
+    /**
+     * CSS classes adicionales para las celdas de esta columna
+     */
+    cellClass?: string;
+    /**
+     * CSS classes adicionales para el header de esta columna
+     */
+    headerClass?: string;
+}
+/**
+ * Data-table genérico con paginación, filtrado y selección
+ *
+ * NUEVO: Ahora es genérico y configurable via columnas
+ *
+ * @example
+ * // Definir columnas
+ * columns: PdmDataTableColumn<User>[] = [
+ *   { key: 'name', label: 'Name', sortable: true },
+ *   { key: 'email', label: 'Email', sortable: true },
+ *   { key: 'role', label: 'Role', hideOnMobile: true },
+ *   { key: 'createdAt', label: 'Created', render: (val) => formatDate(val) }
+ * ];
+ *
+ * // En el template
+ * <pdm-data-table
+ *   [columns]="columns"
+ *   [rows]="users"
+ *   [selectable]="true"
+ *   (selectionChange)="onSelect($event)">
+ * </pdm-data-table>
+ */
+export declare class PdmDataTableComponent<T = any> {
     className: string;
+    /**
+     * Columnas a mostrar
+     * Si no se provee, intenta inferir del primer row (legacy mode)
+     */
+    columns: PdmDataTableColumn<T>[];
+    /**
+     * Estrategia responsive de la tabla
+     */
+    responsiveStrategy: TableResponsiveStrategy;
+    /**
+     * Si es true, muestra checkbox de selección en cada fila
+     */
+    selectable: boolean;
+    /**
+     * Si es true, muestra botón de acciones (tres puntos) en cada fila
+     */
+    showActions: boolean;
+    /**
+     * Si es true, muestra filtro de búsqueda
+     */
+    showFilter: boolean;
+    /**
+     * Si es true, muestra controles de paginación
+     */
+    showPagination: boolean;
+    /**
+     * Si es true, muestra selector de columnas
+     */
+    showColumnSelector: boolean;
     filterPlaceholder: string;
     columnsLabel: string;
-    statusLabel: string;
-    emailLabel: string;
-    amountLabel: string;
     previousLabel: string;
     nextLabel: string;
     emptyLabel: string;
-    rows: PdmDataTableRow[];
+    rowsSelectedLabel: string;
+    /**
+     * @deprecated Use columns configuration instead
+     */
+    statusLabel: string;
+    /**
+     * @deprecated Use columns configuration instead
+     */
+    emailLabel: string;
+    /**
+     * @deprecated Use columns configuration instead
+     */
+    amountLabel: string;
+    /**
+     * Datos a mostrar
+     */
+    rows: T[];
+    /**
+     * Página actual (1-indexed)
+     */
     page: number;
+    /**
+     * Cantidad de filas por página
+     */
     pageSize: number;
+    /**
+     * Query de filtrado
+     */
     query: string;
+    /**
+     * Función custom de filtrado
+     * Si no se provee, busca en todos los campos string
+     */
+    filterFn?: (row: T, query: string) => boolean;
     queryChange: EventEmitter<string>;
-    rowAction: EventEmitter<string>;
+    rowAction: EventEmitter<T>;
     pageChange: EventEmitter<number>;
     selectionChange: EventEmitter<{
-        id: string;
+        row: T;
         selected: boolean;
     }>;
-    get filteredRows(): PdmDataTableRow[];
-    get pagedRows(): PdmDataTableRow[];
+    columnSort: EventEmitter<{
+        column: PdmDataTableColumn<T>;
+        direction: 'asc' | 'desc';
+    }>;
+    selectedRows: Set<T>;
+    sortColumn?: PdmDataTableColumn<T>;
+    sortDirection: 'asc' | 'desc';
+    /**
+     * Backward compatibility: si no hay columnas definidas, inferir del primer row
+     */
+    get effectiveColumns(): PdmDataTableColumn<T>[];
+    /**
+     * LEGACY: mapeo de keys a labels hardcodeados
+     */
+    private getLegacyLabel;
+    get filteredRows(): T[];
+    get pagedRows(): T[];
     get totalPages(): number;
     get selectedCount(): number;
     onQueryInput(event: Event): void;
-    onToggleRow(row: PdmDataTableRow, event: Event): void;
+    onToggleRow(row: T, event: Event): void;
+    onToggleAll(event: Event): void;
+    isSelected(row: T): boolean;
     previous(): void;
     next(): void;
-    onAction(row: PdmDataTableRow): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PdmDataTableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PdmDataTableComponent, "pdm-data-table", never, { "className": "className"; "filterPlaceholder": "filterPlaceholder"; "columnsLabel": "columnsLabel"; "statusLabel": "statusLabel"; "emailLabel": "emailLabel"; "amountLabel": "amountLabel"; "previousLabel": "previousLabel"; "nextLabel": "nextLabel"; "emptyLabel": "emptyLabel"; "rows": "rows"; "page": "page"; "pageSize": "pageSize"; "query": "query"; }, { "queryChange": "queryChange"; "rowAction": "rowAction"; "pageChange": "pageChange"; "selectionChange": "selectionChange"; }, never, never, false>;
+    onAction(row: T): void;
+    onSort(column: PdmDataTableColumn<T>): void;
+    getCellValue(row: T, column: PdmDataTableColumn<T>): any;
+    getCellClass(column: PdmDataTableColumn<T>): string;
+    getHeaderClass(column: PdmDataTableColumn<T>): string;
+    getColumnStyle(column: PdmDataTableColumn<T>): any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PdmDataTableComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmDataTableComponent<any>, "pdm-data-table", never, { "className": "className"; "columns": "columns"; "responsiveStrategy": "responsiveStrategy"; "selectable": "selectable"; "showActions": "showActions"; "showFilter": "showFilter"; "showPagination": "showPagination"; "showColumnSelector": "showColumnSelector"; "filterPlaceholder": "filterPlaceholder"; "columnsLabel": "columnsLabel"; "previousLabel": "previousLabel"; "nextLabel": "nextLabel"; "emptyLabel": "emptyLabel"; "rowsSelectedLabel": "rowsSelectedLabel"; "statusLabel": "statusLabel"; "emailLabel": "emailLabel"; "amountLabel": "amountLabel"; "rows": "rows"; "page": "page"; "pageSize": "pageSize"; "query": "query"; "filterFn": "filterFn"; }, { "queryChange": "queryChange"; "rowAction": "rowAction"; "pageChange": "pageChange"; "selectionChange": "selectionChange"; "columnSort": "columnSort"; }, never, never, false>;
 }

package/lib/components/date-picker/date-picker.component.d.ts

@@ -1,10 +1,9 @@
-import { ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, ViewContainerRef } from '@angular/core';
-import { Overlay } from '@angular/cdk/overlay';
-import { PdmCalendarRange, PdmCalendarVariant } from '../calendar/calendar.component';
-import { PdmOverlayOptions } from '../../overlay/pdm-overlay-options';
+import { ChangeDetectorRef, EventEmitter, OnDestroy, ViewContainerRef } from "@angular/core";
+import { Overlay } from "@angular/cdk/overlay";
+import { PdmCalendarRange, PdmCalendarVariant } from "../calendar/calendar.component";
+import { PdmOverlayOptions } from "../../overlay/pdm-overlay-options";
 import * as i0 from "@angular/core";
 export declare class PdmDatePickerComponent implements OnDestroy {
-    private readonly elementRef;
     private readonly cdr;
     private readonly overlay;
     private readonly viewContainerRef;
@@ -17,7 +16,7 @@ export declare class PdmDatePickerComponent implements OnDestroy {
     private backdropSub;
     private triggerRef?;
     private panelTemplateRef;
-    constructor(elementRef: ElementRef<HTMLElement>, cdr: ChangeDetectorRef, overlay: Overlay, viewContainerRef: ViewContainerRef);
+    constructor(cdr: ChangeDetectorRef, overlay: Overlay, viewContainerRef: ViewContainerRef);
     id: string;
     variant: PdmCalendarVariant | string;
     label: string;

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

@@ -1,11 +1,43 @@
-import { EventEmitter } from '@angular/core';
+import { EventEmitter } from "@angular/core";
 import * as i0 from "@angular/core";
-export declare type PdmDialogVariant = 'default' | 'custom-close';
-export declare type PdmDialogSize = 'desktop' | 'mobile' | 'mobile-fullscreen';
-export declare type PdmDialogFooterAlign = 'right' | 'full-width' | 'left';
+export declare type PdmDialogVariant = "default" | "custom-close";
+/**
+ * @deprecated Use 'responsive' mode instead. Will be removed in v0.3.0
+ */
+export declare type PdmDialogSize = "desktop" | "mobile" | "mobile-fullscreen" | "sm" | "md" | "lg" | "xl" | "responsive";
+export declare type PdmDialogFooterAlign = "right" | "full-width" | "left";
+/**
+ * Modal/Dialog component con soporte responsive
+ *
+ * MEJORADO en v0.2.0:
+ * - Modo 'responsive' (default): fullscreen en mobile, modal en desktop
+ * - Tamaños predefinidos: sm, md, lg, xl
+ * - Mejor manejo de scroll en mobile
+ *
+ * @example
+ * // Responsive (recomendado)
+ * <pdm-dialog [open]="isOpen" size="responsive">
+ *   <p>Content</p>
+ * </pdm-dialog>
+ *
+ * @example
+ * // Tamaño fijo
+ * <pdm-dialog [open]="isOpen" size="lg">
+ *   <p>Content</p>
+ * </pdm-dialog>
+ */
 export declare class PdmDialogComponent {
     open: boolean;
     variant: PdmDialogVariant;
+    /**
+     * Tamaño del dialog
+     * - responsive: fullscreen mobile, modal desktop (recomendado)
+     * - sm: 400px max
+     * - md: 500px max
+     * - lg: 640px max (default)
+     * - xl: 800px max
+     * - desktop/mobile/mobile-fullscreen: legacy, deprecado
+     */
     size: PdmDialogSize;
     title: string;
     description: string;
@@ -30,9 +62,11 @@ export declare class PdmDialogComponent {
     onSecondaryAction(): void;
     onBackdropClick(): void;
     get panelClassName(): string;
+    private buildPanelClasses;
     get bodyWrapperClassName(): string;
     get headerWrapperClassName(): string;
     get footerWrapperClassName(): string;
+    get containerClassName(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<PdmDialogComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PdmDialogComponent, "pdm-dialog", never, { "open": "open"; "variant": "variant"; "size": "size"; "title": "title"; "description": "description"; "closeOnBackdrop": "closeOnBackdrop"; "closeOnEsc": "closeOnEsc"; "showCloseButton": "showCloseButton"; "showHeader": "showHeader"; "showFooter": "showFooter"; "primaryActionText": "primaryActionText"; "secondaryActionText": "secondaryActionText"; "alignFooter": "alignFooter"; "headerClassName": "headerClassName"; "bodyClassName": "bodyClassName"; "footerClassName": "footerClassName"; "className": "className"; }, { "openChange": "openChange"; "primaryAction": "primaryAction"; "secondaryAction": "secondaryAction"; }, never, ["*"], false>;
 }

package/lib/components/draggable-table/draggable-table.component.d.ts

@@ -0,0 +1,74 @@
+import { AfterViewInit, ElementRef, EventEmitter, OnChanges, OnDestroy, Renderer2, SimpleChanges } from '@angular/core';
+import { PdmTableVariant } from '../table/table.component';
+import { TableResponsiveStrategy } from '../../utils/responsive';
+import * as i0 from "@angular/core";
+/**
+ * Tabla con funcionalidad de reordenamiento de filas mediante drag & drop
+ *
+ * Extiende pdm-table agregando la capacidad de reordenar filas.
+ * Si no necesitás drag & drop, usá pdm-table directamente (más simple y liviano).
+ *
+ * @example
+ * <pdm-draggable-table
+ *   variant="interactive"
+ *   [reorderRows]="true"
+ *   (rowOrderChange)="onOrderChange($event)">
+ *   <tbody>
+ *     <tr data-row-id="1"><td>Row 1</td></tr>
+ *     <tr data-row-id="2"><td>Row 2</td></tr>
+ *   </tbody>
+ * </pdm-draggable-table>
+ *
+ * IMPORTANTE: Cada <tr> debe tener un atributo data-row-id único
+ */
+export declare class PdmDraggableTableComponent implements AfterViewInit, OnChanges, OnDestroy {
+    private readonly renderer;
+    variant: PdmTableVariant;
+    responsiveStrategy: TableResponsiveStrategy;
+    className: string;
+    fullBleed: boolean;
+    /**
+     * Habilita el reordenamiento de filas mediante drag & drop
+     */
+    reorderRows: boolean;
+    /**
+     * Selector CSS para identificar los handles de drag
+     * Por defecto busca: [data-drag-handle], [data-slot=row-drag-handle], .row-drag-handle
+     * Si no encuentra ninguno, inserta un handle automático
+     */
+    dragHandleSelector: string;
+    /**
+     * Emite el nuevo orden de las filas cuando el usuario termina de arrastrar
+     * Array de data-row-id en el nuevo orden
+     */
+    rowOrderChange: EventEmitter<string[]>;
+    tableElement?: ElementRef<HTMLTableElement>;
+    private cleanupListeners;
+    private observer?;
+    private draggedRow;
+    constructor(renderer: Renderer2);
+    ngAfterViewInit(): void;
+    get wrapperClasses(): string[];
+    get tableClasses(): string[];
+    private getResponsiveStrategyClasses;
+    private getVariantWrapperClasses;
+    private getVariantTableClasses;
+    private getCellClasses;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    private syncReorderBehavior;
+    private cleanupReorderBehavior;
+    private getTbody;
+    private setRowsDraggable;
+    /**
+     * Inserta un handle de drag automático si no existe uno custom
+     */
+    private syncAutoDragHandle;
+    private onDragStart;
+    private onDragOver;
+    private onDrop;
+    private onDragEnd;
+    private armDragFromHandle;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PdmDraggableTableComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PdmDraggableTableComponent, "pdm-draggable-table", never, { "variant": "variant"; "responsiveStrategy": "responsiveStrategy"; "className": "className"; "fullBleed": "fullBleed"; "reorderRows": "reorderRows"; "dragHandleSelector": "dragHandleSelector"; }, { "rowOrderChange": "rowOrderChange"; }, never, ["*"], false>;
+}