@beweco/aurora-ui 0.1.34 → 0.1.41

package/dist/index.cjs.js

@@ -1699,6 +1699,189 @@ var HeaderComponent = function (_a) {
 };
 HeaderComponent.displayName = "Header";
 
+/**
+ * KanbanCard - Contenedor de tarjeta genérico del Kanban con soporte drag and drop
+ *
+ * El contenido es 100% definido por el padre mediante renderContent.
+ * Este componente solo provee el contenedor con estilos, eventos y drag.
+ */
+var KanbanCardComponent = function (_a) {
+    var item = _a.item, columnId = _a.columnId, index = _a.index, renderContent = _a.renderContent, onCardClick = _a.onCardClick, className = _a.className, _b = _a.isClickable, isClickable = _b === void 0 ? true : _b, _c = _a.isDraggable, isDraggable = _c === void 0 ? false : _c, onDragStart = _a.onDragStart, onDragEnd = _a.onDragEnd;
+    var _d = React.useState(false), isDragging = _d[0], setIsDragging = _d[1];
+    var handleClick = React.useCallback(function () {
+        if (!isDragging) {
+            onCardClick === null || onCardClick === void 0 ? void 0 : onCardClick(item);
+        }
+    }, [item, onCardClick, isDragging]);
+    var handleKeyDown = React.useCallback(function (e) {
+        if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            onCardClick === null || onCardClick === void 0 ? void 0 : onCardClick(item);
+        }
+    }, [item, onCardClick]);
+    var handleDragStart = React.useCallback(function (e) {
+        if (!isDraggable)
+            return;
+        setIsDragging(true);
+        // Datos para el drop
+        e.dataTransfer.setData("application/json", JSON.stringify({ itemId: item.id, fromColumnId: columnId, fromIndex: index }));
+        e.dataTransfer.effectAllowed = "move";
+        // Notificar al padre
+        onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(item, columnId, index);
+    }, [item, columnId, index, isDraggable, onDragStart]);
+    var handleDragEnd = React.useCallback(function () {
+        setIsDragging(false);
+        onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd();
+    }, [onDragEnd]);
+    var isInteractive = isClickable && onCardClick;
+    return (jsxRuntime.jsx("div", { className: react.cn("bg-content1 border border-default-200 rounded-lg p-4 transition-all", isInteractive && "cursor-pointer hover:border-default-400", isDraggable && "cursor-grab active:cursor-grabbing", isDragging && "opacity-50 scale-95 shadow-lg", className), onClick: isInteractive ? handleClick : undefined, onKeyDown: isInteractive ? handleKeyDown : undefined, role: isInteractive ? "button" : undefined, tabIndex: isInteractive ? 0 : undefined, draggable: isDraggable, onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: renderContent(item) }));
+};
+var KanbanCard = React.memo(KanbanCardComponent);
+KanbanCard.displayName = "KanbanCard";
+
+/**
+ * KanbanColumn - Columna individual del Kanban con soporte de drop
+ *
+ * Muestra un header con título y badge de conteo,
+ * una lista scrolleable de tarjetas, y estado vacío.
+ * Acepta drops de tarjetas de otras columnas.
+ */
+var KanbanColumnComponent = function (_a) {
+    var _b, _c;
+    var column = _a.column, renderItem = _a.renderItem, onCardClick = _a.onCardClick, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _d = _a.maxHeight, maxHeight = _d === void 0 ? "calc(100vh - 280px)" : _d, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.isDraggable, isDraggable = _e === void 0 ? false : _e, onDragStart = _a.onDragStart, onDragEnd = _a.onDragEnd, onDrop = _a.onDrop, _f = _a.isDragging, isDragging = _f === void 0 ? false : _f, _g = _a.translations, translations = _g === void 0 ? {} : _g;
+    // Traducciones con fallbacks
+    var t = {
+        dropHere: (_b = translations.dropHere) !== null && _b !== void 0 ? _b : "Soltar aquí",
+        emptyMessage: (_c = translations.emptyMessage) !== null && _c !== void 0 ? _c : "No hay elementos",
+    };
+    var _h = React.useState(false), isDragOver = _h[0], setIsDragOver = _h[1];
+    var _j = React.useState(null), dropIndex = _j[0], setDropIndex = _j[1];
+    var itemCount = column.items.length;
+    var isEmpty = itemCount === 0;
+    var handleDragOver = React.useCallback(function (e) {
+        if (!isDraggable)
+            return;
+        e.preventDefault();
+        e.dataTransfer.dropEffect = "move";
+        setIsDragOver(true);
+    }, [isDraggable]);
+    var handleDragLeave = React.useCallback(function (e) {
+        // Solo salir si realmente salimos de la columna (no de un hijo)
+        if (!e.currentTarget.contains(e.relatedTarget)) {
+            setIsDragOver(false);
+            setDropIndex(null);
+        }
+    }, []);
+    var handleDrop = React.useCallback(function (e) {
+        e.preventDefault();
+        setIsDragOver(false);
+        setDropIndex(null);
+        if (!isDraggable)
+            return;
+        // Calcular índice de drop basado en posición Y
+        var finalDropIndex = dropIndex !== null && dropIndex !== void 0 ? dropIndex : column.items.length;
+        onDrop === null || onDrop === void 0 ? void 0 : onDrop(column.id, finalDropIndex);
+    }, [isDraggable, column.id, column.items.length, dropIndex, onDrop]);
+    // Calcular índice de drop basado en la posición del mouse
+    var handleDragOverItem = React.useCallback(function (e, itemIndex) {
+        e.preventDefault();
+        var rect = e.currentTarget.getBoundingClientRect();
+        var midpoint = rect.top + rect.height / 2;
+        var newDropIndex = e.clientY < midpoint ? itemIndex : itemIndex + 1;
+        setDropIndex(newDropIndex);
+    }, []);
+    return (jsxRuntime.jsxs("div", { className: react.cn("flex flex-col bg-default-50 rounded-lg border border-default-200 transition-colors", isDragOver && isDragging && "border-primary-400 bg-primary-50/30", className), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [renderColumnHeader ? (renderColumnHeader(column)) : (jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-b border-default-200", children: [jsxRuntime.jsx("h3", { className: "font-semibold text-foreground", children: column.title }), jsxRuntime.jsx(react.Badge, { content: itemCount, color: column.countBadgeColor || "default", variant: "flat", size: "md", classNames: {
+                            badge: "text-xs font-medium min-w-6 h-6",
+                        }, children: jsxRuntime.jsxs("span", { className: "sr-only", children: [itemCount, " items"] }) })] })), jsxRuntime.jsx("div", { className: react.cn("flex-1 overflow-y-auto p-3 space-y-3", isDragOver && isEmpty && "min-h-24"), style: { maxHeight: maxHeight }, children: isEmpty ? (isDragOver && isDragging ? (jsxRuntime.jsx("div", { className: "h-24 border-2 border-dashed border-primary-300 rounded-lg bg-primary-50/50 flex items-center justify-center", children: jsxRuntime.jsx("span", { className: "text-primary-500 text-sm", children: t.dropHere }) })) : renderEmptyState ? (renderEmptyState(column)) : (jsxRuntime.jsx("div", { className: "flex items-center justify-center h-24 text-default-400 text-sm", children: column.emptyMessage || t.emptyMessage }))) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [column.items.map(function (item, index) { return (jsxRuntime.jsxs("div", { onDragOver: function (e) { return handleDragOverItem(e, index); }, children: [isDragOver && dropIndex === index && (jsxRuntime.jsx("div", { className: "h-1 bg-primary-400 rounded-full mb-3 animate-pulse" })), jsxRuntime.jsx(KanbanCard, { item: item, columnId: column.id, index: index, renderContent: renderItem, onCardClick: onCardClick, className: cardClassName, isClickable: isCardClickable, isDraggable: isDraggable, onDragStart: onDragStart, onDragEnd: onDragEnd })] }, item.id)); }), isDragOver && dropIndex === column.items.length && (jsxRuntime.jsx("div", { className: "h-1 bg-primary-400 rounded-full mt-3 animate-pulse" }))] })) })] }));
+};
+var KanbanColumn = React.memo(KanbanColumnComponent);
+KanbanColumn.displayName = "KanbanColumn";
+
+/**
+ * Traducciones por defecto en español.
+ * Se mezclan con las traducciones proporcionadas por el usuario.
+ */
+var DEFAULT_TRANSLATIONS = {
+    dropHere: "Soltar aquí",
+    emptyMessage: "No hay elementos",
+};
+var columnGapClasses = {
+    sm: "gap-3",
+    md: "gap-4",
+    lg: "gap-6",
+};
+/**
+ * Kanban - Tablero Kanban genérico con columnas, tarjetas y drag and drop
+ *
+ * El contenido de cada tarjeta es 100% definido por el consumidor
+ * mediante la prop `renderItem`. Esto permite usar el Kanban para
+ * cualquier caso de uso: contactos, tareas, proyectos, etc.
+ *
+ * Soporta drag and drop entre columnas con el callback `onItemMove`.
+ *
+ * @example
+ * ```tsx
+ * // Kanban de tareas con drag and drop
+ * <Kanban<Task>
+ *   columns={columns}
+ *   renderItem={(item) => <TaskCard task={item.data} />}
+ *   onItemMove={(event) => {
+ *     console.log(`Moved ${event.item.id} from ${event.fromColumnId} to ${event.toColumnId}`);
+ *     // Actualizar estado...
+ *   }}
+ * />
+ * ```
+ */
+var KanbanComponent = function (_a) {
+    var columns = _a.columns, renderItem = _a.renderItem, onCardClick = _a.onCardClick, onItemMove = _a.onItemMove, isDraggable = _a.isDraggable, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _b = _a.columnWidth, columnWidth = _b === void 0 ? "280px" : _b, _c = _a.columnGap, columnGap = _c === void 0 ? "md" : _c, _d = _a.horizontalScroll, horizontalScroll = _d === void 0 ? true : _d, columnMaxHeight = _a.columnMaxHeight, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.translations, translations = _e === void 0 ? {} : _e;
+    // Mezclar traducciones del usuario con las por defecto
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS), translations);
+    // Determinar si drag está habilitado
+    var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
+    // Estado del drag actual
+    var _f = React.useState(false), isDragging = _f[0], setIsDragging = _f[1];
+    var dragDataRef = React.useRef(null);
+    // Cuando empieza el drag
+    var handleDragStart = React.useCallback(function (item, columnId, index) {
+        setIsDragging(true);
+        dragDataRef.current = { item: item, fromColumnId: columnId, fromIndex: index };
+    }, []);
+    // Cuando termina el drag (sin drop válido)
+    var handleDragEnd = React.useCallback(function () {
+        setIsDragging(false);
+        dragDataRef.current = null;
+    }, []);
+    // Cuando se suelta en una columna
+    var handleDrop = React.useCallback(function (toColumnId, toIndex) {
+        var dragData = dragDataRef.current;
+        if (!dragData || !onItemMove)
+            return;
+        var item = dragData.item, fromColumnId = dragData.fromColumnId, fromIndex = dragData.fromIndex;
+        // No hacer nada si se suelta en la misma posición
+        if (fromColumnId === toColumnId && fromIndex === toIndex) {
+            handleDragEnd();
+            return;
+        }
+        // Ajustar índice si se mueve dentro de la misma columna hacia abajo
+        var adjustedToIndex = toIndex;
+        if (fromColumnId === toColumnId && fromIndex < toIndex) {
+            adjustedToIndex = toIndex - 1;
+        }
+        // Notificar al padre
+        onItemMove({
+            item: item,
+            fromColumnId: fromColumnId,
+            toColumnId: toColumnId,
+            fromIndex: fromIndex,
+            toIndex: adjustedToIndex,
+        });
+        handleDragEnd();
+    }, [onItemMove, handleDragEnd]);
+    return (jsxRuntime.jsx("div", { className: react.cn("flex", columnGapClasses[columnGap], horizontalScroll && "overflow-x-auto pb-4", className), children: columns.map(function (column) { return (jsxRuntime.jsx("div", { className: "flex-shrink-0", style: { width: columnWidth }, children: jsxRuntime.jsx(KanbanColumn, { column: column, renderItem: renderItem, onCardClick: onCardClick, cardClassName: cardClassName, isCardClickable: isCardClickable, maxHeight: columnMaxHeight, renderColumnHeader: renderColumnHeader, renderEmptyState: renderEmptyState, isDraggable: dragEnabled, onDragStart: handleDragStart, onDragEnd: handleDragEnd, onDrop: handleDrop, isDragging: isDragging, translations: t }) }, column.id)); }) }));
+};
+var Kanban = React.memo(KanbanComponent);
+Kanban.displayName = "Kanban";
+
 var defaultTranslations$8 = {
     previewAlt: "Vista previa de imagen",
     removeButtonAriaLabel: "Eliminar imagen",
@@ -4986,6 +5169,9 @@ exports.HeaderComponent = HeaderComponent;
 exports.IconComponent = IconComponent;
 exports.ImagePreview = ImagePreview;
 exports.Input = Input;
+exports.Kanban = Kanban;
+exports.KanbanCard = KanbanCard;
+exports.KanbanColumn = KanbanColumn;
 exports.MenuComponent = MenuComponent;
 exports.Modal = Modal;
 exports.ModalBody = ModalBody;

package/dist/index.esm.js

@@ -1,10 +1,10 @@
-import { Skeleton, Button as Button$1, Chip as Chip$1, Accordion, AccordionItem, Pagination as Pagination$1, DatePicker as DatePicker$1, DateRangePicker as DateRangePicker$1, Input as Input$1, RadioGroup, Radio, cn, Card as Card$1, Spacer, Tabs, Tab, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Autocomplete, Breadcrumbs, BreadcrumbItem, DropdownSection, ListboxItem, Popover, PopoverTrigger, Tooltip as Tooltip$1, PopoverContent, Listbox, ListboxSection, Avatar, CardBody, CardFooter, Link, Switch as Switch$1, TimeInput as TimeInput$1, Select as Select$1, Image as Image$1, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, Textarea as Textarea$1, Alert, Modal as Modal$1, ModalContent as ModalContent$1, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, Slider, ModalFooter as ModalFooter$1, Spinner, SelectItem, Drawer, DrawerContent, DrawerBody } from '@heroui/react';
+import { Skeleton, Button as Button$1, Chip as Chip$1, Accordion, AccordionItem, Pagination as Pagination$1, DatePicker as DatePicker$1, DateRangePicker as DateRangePicker$1, Input as Input$1, RadioGroup, Radio, cn, Card as Card$1, Spacer, Tabs, Tab, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Autocomplete, Breadcrumbs, BreadcrumbItem, DropdownSection, Badge, ListboxItem, Popover, PopoverTrigger, Tooltip as Tooltip$1, PopoverContent, Listbox, ListboxSection, Avatar, CardBody, CardFooter, Link, Switch as Switch$1, TimeInput as TimeInput$1, Select as Select$1, Image as Image$1, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, Textarea as Textarea$1, Alert, Modal as Modal$1, ModalContent as ModalContent$1, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, Slider, ModalFooter as ModalFooter$1, Spinner, SelectItem, Drawer, DrawerContent, DrawerBody } from '@heroui/react';
 export * from '@heroui/react';
 export { Slider } from '@heroui/react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Icon } from '@iconify/react';
 export { loadIcons } from '@iconify/react';
-import React, { useId, useState, useCallback, useMemo, useEffect, createContext, useContext, createElement, useRef, useLayoutEffect } from 'react';
+import React, { useId, useState, useCallback, useMemo, useEffect, createContext, useContext, memo, useRef, createElement, useLayoutEffect } from 'react';
 import { ResponsiveContainer, AreaChart, CartesianGrid, XAxis, Tooltip, Area } from 'recharts';
 import { LazyMotion, domAnimation, m } from 'framer-motion';
 import { createPortal } from 'react-dom';
@@ -1700,6 +1700,189 @@ var HeaderComponent = function (_a) {
 };
 HeaderComponent.displayName = "Header";
 
+/**
+ * KanbanCard - Contenedor de tarjeta genérico del Kanban con soporte drag and drop
+ *
+ * El contenido es 100% definido por el padre mediante renderContent.
+ * Este componente solo provee el contenedor con estilos, eventos y drag.
+ */
+var KanbanCardComponent = function (_a) {
+    var item = _a.item, columnId = _a.columnId, index = _a.index, renderContent = _a.renderContent, onCardClick = _a.onCardClick, className = _a.className, _b = _a.isClickable, isClickable = _b === void 0 ? true : _b, _c = _a.isDraggable, isDraggable = _c === void 0 ? false : _c, onDragStart = _a.onDragStart, onDragEnd = _a.onDragEnd;
+    var _d = useState(false), isDragging = _d[0], setIsDragging = _d[1];
+    var handleClick = useCallback(function () {
+        if (!isDragging) {
+            onCardClick === null || onCardClick === void 0 ? void 0 : onCardClick(item);
+        }
+    }, [item, onCardClick, isDragging]);
+    var handleKeyDown = useCallback(function (e) {
+        if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            onCardClick === null || onCardClick === void 0 ? void 0 : onCardClick(item);
+        }
+    }, [item, onCardClick]);
+    var handleDragStart = useCallback(function (e) {
+        if (!isDraggable)
+            return;
+        setIsDragging(true);
+        // Datos para el drop
+        e.dataTransfer.setData("application/json", JSON.stringify({ itemId: item.id, fromColumnId: columnId, fromIndex: index }));
+        e.dataTransfer.effectAllowed = "move";
+        // Notificar al padre
+        onDragStart === null || onDragStart === void 0 ? void 0 : onDragStart(item, columnId, index);
+    }, [item, columnId, index, isDraggable, onDragStart]);
+    var handleDragEnd = useCallback(function () {
+        setIsDragging(false);
+        onDragEnd === null || onDragEnd === void 0 ? void 0 : onDragEnd();
+    }, [onDragEnd]);
+    var isInteractive = isClickable && onCardClick;
+    return (jsx("div", { className: cn("bg-content1 border border-default-200 rounded-lg p-4 transition-all", isInteractive && "cursor-pointer hover:border-default-400", isDraggable && "cursor-grab active:cursor-grabbing", isDragging && "opacity-50 scale-95 shadow-lg", className), onClick: isInteractive ? handleClick : undefined, onKeyDown: isInteractive ? handleKeyDown : undefined, role: isInteractive ? "button" : undefined, tabIndex: isInteractive ? 0 : undefined, draggable: isDraggable, onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: renderContent(item) }));
+};
+var KanbanCard = memo(KanbanCardComponent);
+KanbanCard.displayName = "KanbanCard";
+
+/**
+ * KanbanColumn - Columna individual del Kanban con soporte de drop
+ *
+ * Muestra un header con título y badge de conteo,
+ * una lista scrolleable de tarjetas, y estado vacío.
+ * Acepta drops de tarjetas de otras columnas.
+ */
+var KanbanColumnComponent = function (_a) {
+    var _b, _c;
+    var column = _a.column, renderItem = _a.renderItem, onCardClick = _a.onCardClick, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _d = _a.maxHeight, maxHeight = _d === void 0 ? "calc(100vh - 280px)" : _d, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.isDraggable, isDraggable = _e === void 0 ? false : _e, onDragStart = _a.onDragStart, onDragEnd = _a.onDragEnd, onDrop = _a.onDrop, _f = _a.isDragging, isDragging = _f === void 0 ? false : _f, _g = _a.translations, translations = _g === void 0 ? {} : _g;
+    // Traducciones con fallbacks
+    var t = {
+        dropHere: (_b = translations.dropHere) !== null && _b !== void 0 ? _b : "Soltar aquí",
+        emptyMessage: (_c = translations.emptyMessage) !== null && _c !== void 0 ? _c : "No hay elementos",
+    };
+    var _h = useState(false), isDragOver = _h[0], setIsDragOver = _h[1];
+    var _j = useState(null), dropIndex = _j[0], setDropIndex = _j[1];
+    var itemCount = column.items.length;
+    var isEmpty = itemCount === 0;
+    var handleDragOver = useCallback(function (e) {
+        if (!isDraggable)
+            return;
+        e.preventDefault();
+        e.dataTransfer.dropEffect = "move";
+        setIsDragOver(true);
+    }, [isDraggable]);
+    var handleDragLeave = useCallback(function (e) {
+        // Solo salir si realmente salimos de la columna (no de un hijo)
+        if (!e.currentTarget.contains(e.relatedTarget)) {
+            setIsDragOver(false);
+            setDropIndex(null);
+        }
+    }, []);
+    var handleDrop = useCallback(function (e) {
+        e.preventDefault();
+        setIsDragOver(false);
+        setDropIndex(null);
+        if (!isDraggable)
+            return;
+        // Calcular índice de drop basado en posición Y
+        var finalDropIndex = dropIndex !== null && dropIndex !== void 0 ? dropIndex : column.items.length;
+        onDrop === null || onDrop === void 0 ? void 0 : onDrop(column.id, finalDropIndex);
+    }, [isDraggable, column.id, column.items.length, dropIndex, onDrop]);
+    // Calcular índice de drop basado en la posición del mouse
+    var handleDragOverItem = useCallback(function (e, itemIndex) {
+        e.preventDefault();
+        var rect = e.currentTarget.getBoundingClientRect();
+        var midpoint = rect.top + rect.height / 2;
+        var newDropIndex = e.clientY < midpoint ? itemIndex : itemIndex + 1;
+        setDropIndex(newDropIndex);
+    }, []);
+    return (jsxs("div", { className: cn("flex flex-col bg-default-50 rounded-lg border border-default-200 transition-colors", isDragOver && isDragging && "border-primary-400 bg-primary-50/30", className), onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [renderColumnHeader ? (renderColumnHeader(column)) : (jsxs("div", { className: "flex items-center justify-between px-4 py-3 border-b border-default-200", children: [jsx("h3", { className: "font-semibold text-foreground", children: column.title }), jsx(Badge, { content: itemCount, color: column.countBadgeColor || "default", variant: "flat", size: "md", classNames: {
+                            badge: "text-xs font-medium min-w-6 h-6",
+                        }, children: jsxs("span", { className: "sr-only", children: [itemCount, " items"] }) })] })), jsx("div", { className: cn("flex-1 overflow-y-auto p-3 space-y-3", isDragOver && isEmpty && "min-h-24"), style: { maxHeight: maxHeight }, children: isEmpty ? (isDragOver && isDragging ? (jsx("div", { className: "h-24 border-2 border-dashed border-primary-300 rounded-lg bg-primary-50/50 flex items-center justify-center", children: jsx("span", { className: "text-primary-500 text-sm", children: t.dropHere }) })) : renderEmptyState ? (renderEmptyState(column)) : (jsx("div", { className: "flex items-center justify-center h-24 text-default-400 text-sm", children: column.emptyMessage || t.emptyMessage }))) : (jsxs(Fragment, { children: [column.items.map(function (item, index) { return (jsxs("div", { onDragOver: function (e) { return handleDragOverItem(e, index); }, children: [isDragOver && dropIndex === index && (jsx("div", { className: "h-1 bg-primary-400 rounded-full mb-3 animate-pulse" })), jsx(KanbanCard, { item: item, columnId: column.id, index: index, renderContent: renderItem, onCardClick: onCardClick, className: cardClassName, isClickable: isCardClickable, isDraggable: isDraggable, onDragStart: onDragStart, onDragEnd: onDragEnd })] }, item.id)); }), isDragOver && dropIndex === column.items.length && (jsx("div", { className: "h-1 bg-primary-400 rounded-full mt-3 animate-pulse" }))] })) })] }));
+};
+var KanbanColumn = memo(KanbanColumnComponent);
+KanbanColumn.displayName = "KanbanColumn";
+
+/**
+ * Traducciones por defecto en español.
+ * Se mezclan con las traducciones proporcionadas por el usuario.
+ */
+var DEFAULT_TRANSLATIONS = {
+    dropHere: "Soltar aquí",
+    emptyMessage: "No hay elementos",
+};
+var columnGapClasses = {
+    sm: "gap-3",
+    md: "gap-4",
+    lg: "gap-6",
+};
+/**
+ * Kanban - Tablero Kanban genérico con columnas, tarjetas y drag and drop
+ *
+ * El contenido de cada tarjeta es 100% definido por el consumidor
+ * mediante la prop `renderItem`. Esto permite usar el Kanban para
+ * cualquier caso de uso: contactos, tareas, proyectos, etc.
+ *
+ * Soporta drag and drop entre columnas con el callback `onItemMove`.
+ *
+ * @example
+ * ```tsx
+ * // Kanban de tareas con drag and drop
+ * <Kanban<Task>
+ *   columns={columns}
+ *   renderItem={(item) => <TaskCard task={item.data} />}
+ *   onItemMove={(event) => {
+ *     console.log(`Moved ${event.item.id} from ${event.fromColumnId} to ${event.toColumnId}`);
+ *     // Actualizar estado...
+ *   }}
+ * />
+ * ```
+ */
+var KanbanComponent = function (_a) {
+    var columns = _a.columns, renderItem = _a.renderItem, onCardClick = _a.onCardClick, onItemMove = _a.onItemMove, isDraggable = _a.isDraggable, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _b = _a.columnWidth, columnWidth = _b === void 0 ? "280px" : _b, _c = _a.columnGap, columnGap = _c === void 0 ? "md" : _c, _d = _a.horizontalScroll, horizontalScroll = _d === void 0 ? true : _d, columnMaxHeight = _a.columnMaxHeight, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.translations, translations = _e === void 0 ? {} : _e;
+    // Mezclar traducciones del usuario con las por defecto
+    var t = __assign(__assign({}, DEFAULT_TRANSLATIONS), translations);
+    // Determinar si drag está habilitado
+    var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
+    // Estado del drag actual
+    var _f = useState(false), isDragging = _f[0], setIsDragging = _f[1];
+    var dragDataRef = useRef(null);
+    // Cuando empieza el drag
+    var handleDragStart = useCallback(function (item, columnId, index) {
+        setIsDragging(true);
+        dragDataRef.current = { item: item, fromColumnId: columnId, fromIndex: index };
+    }, []);
+    // Cuando termina el drag (sin drop válido)
+    var handleDragEnd = useCallback(function () {
+        setIsDragging(false);
+        dragDataRef.current = null;
+    }, []);
+    // Cuando se suelta en una columna
+    var handleDrop = useCallback(function (toColumnId, toIndex) {
+        var dragData = dragDataRef.current;
+        if (!dragData || !onItemMove)
+            return;
+        var item = dragData.item, fromColumnId = dragData.fromColumnId, fromIndex = dragData.fromIndex;
+        // No hacer nada si se suelta en la misma posición
+        if (fromColumnId === toColumnId && fromIndex === toIndex) {
+            handleDragEnd();
+            return;
+        }
+        // Ajustar índice si se mueve dentro de la misma columna hacia abajo
+        var adjustedToIndex = toIndex;
+        if (fromColumnId === toColumnId && fromIndex < toIndex) {
+            adjustedToIndex = toIndex - 1;
+        }
+        // Notificar al padre
+        onItemMove({
+            item: item,
+            fromColumnId: fromColumnId,
+            toColumnId: toColumnId,
+            fromIndex: fromIndex,
+            toIndex: adjustedToIndex,
+        });
+        handleDragEnd();
+    }, [onItemMove, handleDragEnd]);
+    return (jsx("div", { className: cn("flex", columnGapClasses[columnGap], horizontalScroll && "overflow-x-auto pb-4", className), children: columns.map(function (column) { return (jsx("div", { className: "flex-shrink-0", style: { width: columnWidth }, children: jsx(KanbanColumn, { column: column, renderItem: renderItem, onCardClick: onCardClick, cardClassName: cardClassName, isCardClickable: isCardClickable, maxHeight: columnMaxHeight, renderColumnHeader: renderColumnHeader, renderEmptyState: renderEmptyState, isDraggable: dragEnabled, onDragStart: handleDragStart, onDragEnd: handleDragEnd, onDrop: handleDrop, isDragging: isDragging, translations: t }) }, column.id)); }) }));
+};
+var Kanban = memo(KanbanComponent);
+Kanban.displayName = "Kanban";
+
 var defaultTranslations$8 = {
     previewAlt: "Vista previa de imagen",
     removeButtonAriaLabel: "Eliminar imagen",
@@ -4952,4 +5135,4 @@ var NavigationLoadingProvider = function (_a) {
     return (jsxs(NavigationLoadingContext.Provider, { value: value, children: [children, jsx(NavigationLoadingOverlay, { isVisible: isVisible })] }));
 };
 
-export { AccordionList, AddHolidayForm, AnalyticsCard, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorPicker, ColorSelector, ContentCarousel, DEFAULT_PREDEFINED_COLORS, DatePicker, DateRangePicker, DateSelector, DrawerFilters, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, UploadFile, VerticalSteps, Wizard, WizardNavigation, WizardSidebar, defaultTranslations$4 as defaultTranslations, sizeMap, themeColors, useAuraToast, useNavigationLoading, useThemeContext };
+export { AccordionList, AddHolidayForm, AnalyticsCard, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorPicker, ColorSelector, ContentCarousel, DEFAULT_PREDEFINED_COLORS, DatePicker, DateRangePicker, DateSelector, DrawerFilters, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, Kanban, KanbanCard, KanbanColumn, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, UploadFile, VerticalSteps, Wizard, WizardNavigation, WizardSidebar, defaultTranslations$4 as defaultTranslations, sizeMap, themeColors, useAuraToast, useNavigationLoading, useThemeContext };

package/dist/types/components/kanban/Kanban.d.ts

@@ -0,0 +1,27 @@
+import type { KanbanProps } from "./Kanban.types";
+/**
+ * Kanban - Tablero Kanban genérico con columnas, tarjetas y drag and drop
+ *
+ * El contenido de cada tarjeta es 100% definido por el consumidor
+ * mediante la prop `renderItem`. Esto permite usar el Kanban para
+ * cualquier caso de uso: contactos, tareas, proyectos, etc.
+ *
+ * Soporta drag and drop entre columnas con el callback `onItemMove`.
+ *
+ * @example
+ * ```tsx
+ * // Kanban de tareas con drag and drop
+ * <Kanban<Task>
+ *   columns={columns}
+ *   renderItem={(item) => <TaskCard task={item.data} />}
+ *   onItemMove={(event) => {
+ *     console.log(`Moved ${event.item.id} from ${event.fromColumnId} to ${event.toColumnId}`);
+ *     // Actualizar estado...
+ *   }}
+ * />
+ * ```
+ */
+declare const KanbanComponent: <T>({ columns, renderItem, onCardClick, onItemMove, isDraggable, cardClassName, isCardClickable, className, columnWidth, columnGap, horizontalScroll, columnMaxHeight, renderColumnHeader, renderEmptyState, translations, }: KanbanProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Kanban: typeof KanbanComponent;
+export {};
+//# sourceMappingURL=Kanban.d.ts.map

package/dist/types/components/kanban/Kanban.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Kanban.d.ts","sourceRoot":"","sources":["../../../../src/components/kanban/Kanban.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAc,WAAW,EAAsB,MAAM,gBAAgB,CAAC;AAkBlF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,eAAe,GAAI,CAAC,EAAG,0NAgB1B,WAAW,CAAC,CAAC,CAAC,4CAmGhB,CAAC;AAEF,eAAO,MAAM,MAAM,EAA4B,OAAO,eAAe,CAAC"}

package/dist/types/components/kanban/Kanban.types.d.ts

@@ -0,0 +1,163 @@
+import type { ReactNode } from "react";
+/**
+ * Traducciones disponibles para el componente Kanban.
+ * Todas las propiedades son opcionales para permitir traducciones parciales.
+ */
+export type KanbanTranslations = {
+    /** Texto al arrastrar sobre zona de drop vacía */
+    dropHere?: string;
+    /** Mensaje por defecto cuando una columna está vacía */
+    emptyMessage?: string;
+};
+/**
+ * Representa un item genérico en el Kanban.
+ * El contenido visual lo define el consumidor con renderItem.
+ */
+export interface KanbanItem<T = unknown> {
+    /** Identificador único del item (requerido para keys) */
+    id: string;
+    /** Datos del item - el tipo lo define el consumidor */
+    data: T;
+}
+/**
+ * Representa una columna del Kanban
+ */
+export interface KanbanColumn<T = unknown> {
+    /** Identificador único de la columna */
+    id: string;
+    /** Título de la columna */
+    title: string;
+    /** Items en esta columna */
+    items: KanbanItem<T>[];
+    /** Mensaje cuando no hay items */
+    emptyMessage?: string;
+    /** Color del badge de conteo */
+    countBadgeColor?: "default" | "primary" | "secondary" | "success" | "warning" | "danger";
+}
+/**
+ * Información del movimiento de un item entre columnas
+ */
+export interface KanbanMoveEvent<T = unknown> {
+    /** El item que fue movido */
+    item: KanbanItem<T>;
+    /** ID de la columna origen */
+    fromColumnId: string;
+    /** ID de la columna destino */
+    toColumnId: string;
+    /** Índice del item en la columna origen */
+    fromIndex: number;
+    /** Índice donde se soltó en la columna destino */
+    toIndex: number;
+}
+/**
+ * Props para el componente KanbanCard interno
+ */
+export interface KanbanCardProps<T = unknown> {
+    /** Item a renderizar */
+    item: KanbanItem<T>;
+    /** ID de la columna donde está el item */
+    columnId: string;
+    /** Índice del item en la columna */
+    index: number;
+    /** Función para renderizar el contenido (REQUERIDO) */
+    renderContent: (item: KanbanItem<T>) => ReactNode;
+    /** Callback al hacer clic en la tarjeta */
+    onCardClick?: (item: KanbanItem<T>) => void;
+    /** Clases CSS adicionales para la tarjeta */
+    className?: string;
+    /** Si la tarjeta es clickeable (muestra hover effects) */
+    isClickable?: boolean;
+    /** Si el drag and drop está habilitado */
+    isDraggable?: boolean;
+    /** Callback cuando empieza el drag */
+    onDragStart?: (item: KanbanItem<T>, columnId: string, index: number) => void;
+    /** Callback cuando termina el drag */
+    onDragEnd?: () => void;
+}
+/**
+ * Props para el componente KanbanColumnInternal
+ */
+export interface KanbanColumnInternalProps<T = unknown> {
+    /** Columna a renderizar */
+    column: KanbanColumn<T>;
+    /** Función para renderizar el contenido de cada item (REQUERIDO) */
+    renderItem: (item: KanbanItem<T>) => ReactNode;
+    /** Callback al hacer clic en una tarjeta */
+    onCardClick?: (item: KanbanItem<T>) => void;
+    /** Clases CSS adicionales para las tarjetas */
+    cardClassName?: string;
+    /** Si las tarjetas son clickeables */
+    isCardClickable?: boolean;
+    /** Clases CSS adicionales para la columna */
+    className?: string;
+    /** Altura máxima de la columna (con scroll) */
+    maxHeight?: string;
+    /** Render personalizado del header de la columna */
+    renderColumnHeader?: (column: KanbanColumn<T>) => ReactNode;
+    /** Render personalizado del estado vacío */
+    renderEmptyState?: (column: KanbanColumn<T>) => ReactNode;
+    /** Si el drag and drop está habilitado */
+    isDraggable?: boolean;
+    /** Callback cuando empieza el drag de un item */
+    onDragStart?: (item: KanbanItem<T>, columnId: string, index: number) => void;
+    /** Callback cuando termina el drag */
+    onDragEnd?: () => void;
+    /** Callback cuando se suelta un item en esta columna */
+    onDrop?: (columnId: string, dropIndex: number) => void;
+    /** Si hay un item siendo arrastrado actualmente */
+    isDragging?: boolean;
+    /**
+     * Traducciones i18n del componente.
+     * Si no se proporciona, usa traducciones por defecto en español.
+     */
+    translations?: KanbanTranslations;
+}
+/**
+ * Props para el componente Kanban principal
+ */
+export interface KanbanProps<T = unknown> {
+    /** Columnas del Kanban */
+    columns: KanbanColumn<T>[];
+    /**
+     * Función para renderizar el contenido de cada item (REQUERIDO).
+     * El padre decide qué mostrar en cada tarjeta.
+     */
+    renderItem: (item: KanbanItem<T>) => ReactNode;
+    /** Callback al hacer clic en una tarjeta */
+    onCardClick?: (item: KanbanItem<T>) => void;
+    /**
+     * Callback cuando un item se mueve entre columnas (drag and drop).
+     * Recibe información completa del movimiento.
+     */
+    onItemMove?: (event: KanbanMoveEvent<T>) => void;
+    /** Si el drag and drop está habilitado (default: true si hay onItemMove) */
+    isDraggable?: boolean;
+    /** Clases CSS adicionales para las tarjetas */
+    cardClassName?: string;
+    /** Si las tarjetas son clickeables (default: true si hay onCardClick) */
+    isCardClickable?: boolean;
+    /** Clases CSS adicionales para el contenedor */
+    className?: string;
+    /** Ancho de cada columna */
+    columnWidth?: string;
+    /** Gap entre columnas */
+    columnGap?: "sm" | "md" | "lg";
+    /** Si el board tiene scroll horizontal */
+    horizontalScroll?: boolean;
+    /** Altura máxima de las columnas */
+    columnMaxHeight?: string;
+    /** Render personalizado del header de columna */
+    renderColumnHeader?: (column: KanbanColumn<T>) => ReactNode;
+    /** Render personalizado del estado vacío de columna */
+    renderEmptyState?: (column: KanbanColumn<T>) => ReactNode;
+    /**
+     * Traducciones i18n del componente.
+     * Si no se proporciona, usa traducciones por defecto en español.
+     * @example
+     * ```tsx
+     * <Kanban translations={{ dropHere: "Drop here", emptyMessage: "No items" }} />
+     * ```
+     */
+    translations?: KanbanTranslations;
+}
+//# sourceMappingURL=Kanban.types.d.ts.map

package/dist/types/components/kanban/Kanban.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Kanban.types.d.ts","sourceRoot":"","sources":["../../../../src/components/kanban/Kanban.types.ts"],"names":[],"mappings":"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"}

package/dist/types/components/kanban/_internal/KanbanCard.d.ts

@@ -0,0 +1,11 @@
+import type { KanbanCardProps } from "../Kanban.types";
+/**
+ * KanbanCard - Contenedor de tarjeta genérico del Kanban con soporte drag and drop
+ *
+ * El contenido es 100% definido por el padre mediante renderContent.
+ * Este componente solo provee el contenedor con estilos, eventos y drag.
+ */
+declare const KanbanCardComponent: <T>({ item, columnId, index, renderContent, onCardClick, className, isClickable, isDraggable, onDragStart, onDragEnd, }: KanbanCardProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const KanbanCard: typeof KanbanCardComponent;
+export {};
+//# sourceMappingURL=KanbanCard.d.ts.map

package/dist/types/components/kanban/_internal/KanbanCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KanbanCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/kanban/_internal/KanbanCard.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEvD;;;;;GAKG;AACH,QAAA,MAAM,mBAAmB,GAAI,CAAC,EAAG,qHAW9B,eAAe,CAAC,CAAC,CAAC,4CAiEpB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAgC,OAAO,mBAAmB,CAAC"}

package/dist/types/components/kanban/_internal/KanbanColumn.d.ts

@@ -0,0 +1,12 @@
+import type { KanbanColumnInternalProps } from "../Kanban.types";
+/**
+ * KanbanColumn - Columna individual del Kanban con soporte de drop
+ *
+ * Muestra un header con título y badge de conteo,
+ * una lista scrolleable de tarjetas, y estado vacío.
+ * Acepta drops de tarjetas de otras columnas.
+ */
+declare const KanbanColumnComponent: <T>({ column, renderItem, onCardClick, cardClassName, isCardClickable, className, maxHeight, renderColumnHeader, renderEmptyState, isDraggable, onDragStart, onDragEnd, onDrop, isDragging, translations, }: KanbanColumnInternalProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const KanbanColumn: typeof KanbanColumnComponent;
+export {};
+//# sourceMappingURL=KanbanColumn.d.ts.map