@asteby/metacore-runtime-react 23.6.0 → 23.7.0

package/dist/custom-stages.js

@@ -0,0 +1,535 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// Custom stages — a Bitrix-style "add your own column" affordance for
+// DynamicKanban, generic over any model. Two flavors:
+//
+//   - type: "stage"  → a REAL lane. The backend persists it and also surfaces
+//     it in the model's `metadata.stages`, so cards drag in/out of it exactly
+//     like a declared stage. We only add the create/edit/delete UI + merge any
+//     custom stage the metadata hasn't caught up to yet (tolerant).
+//
+//   - type: "smart"  → a VIRTUAL lane. Nothing is stored on the card; the lane
+//     is defined by a set of `filters` and is populated by querying the list
+//     with those filters (the same `f_<field>=value` params the board already
+//     speaks). Cards in a smart lane are read-only (no drag), and the header
+//     shows a funnel icon.
+//
+// Non-intrusive by design: the CRUD lives server-side behind `/custom-stages`
+// (same api client as the rest of the dynamic runtime). If the endpoint 404s
+// or errors the hook reports `available: false`, the "+ Agregar etapa" column
+// and the lane context menus simply don't render, and the board keeps working.
+// All UI text goes through t() with a Spanish defaultValue.
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Plus, Trash2, Pencil, MoreVertical, Filter, X } from 'lucide-react';
+import { toast } from 'sonner';
+import { Badge, Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Skeleton, } from '@asteby/metacore-ui/primitives';
+import { generateBadgeStyles, optionColor } from '@asteby/metacore-ui/lib';
+import { useApi } from './api-context';
+// ~8 preset palette names understood by `generateBadgeStyles`.
+export const CUSTOM_STAGE_COLORS = [
+    'slate',
+    'blue',
+    'green',
+    'amber',
+    'red',
+    'purple',
+    'pink',
+    'cyan',
+];
+export const CUSTOM_STAGE_FILTER_OPS = [
+    'eq',
+    'neq',
+    'contains',
+    'in',
+];
+// ---------------------------------------------------------------------------
+// Pure helpers (exported for unit tests — no React, no transport)
+// ---------------------------------------------------------------------------
+/** A blank filter row for the smart-lane condition builder. */
+export function emptyCustomStageFilter(field = '') {
+    return { field, op: 'eq', value: '' };
+}
+/** Enabled custom stages split by flavor (disabled ones are dropped). */
+export function splitCustomStages(stages) {
+    const laneStages = [];
+    const smartStages = [];
+    for (const s of stages ?? []) {
+        if (s.enabled === false)
+            continue;
+        if (s.type === 'smart')
+            smartStages.push(s);
+        else
+            laneStages.push(s);
+    }
+    return { laneStages, smartStages };
+}
+/**
+ * Merges `type: "stage"` custom stages into the model's declared lanes. A
+ * custom stage whose key the metadata ALREADY carries (the backend surfaced it
+ * in `metadata.stages`) is not duplicated — it's just tagged as custom so the
+ * lane grows an edit/delete menu. Unknown-key custom stages are appended.
+ * Returns the merged lanes (sorted by order) plus a `key → CustomStage` map so
+ * the board can decorate the custom lanes.
+ */
+export function mergeLaneStages(declared, customLaneStages) {
+    const customByKey = new Map();
+    for (const cs of customLaneStages)
+        customByKey.set(cs.key, cs);
+    const present = new Set(declared.map((s) => s.key));
+    const lanes = [...declared];
+    for (const cs of customLaneStages) {
+        if (present.has(cs.key))
+            continue;
+        lanes.push({
+            key: cs.key,
+            label: cs.label,
+            color: cs.color,
+            order: cs.position,
+        });
+    }
+    lanes.sort((a, b) => {
+        const ao = a.order ?? Number.MAX_SAFE_INTEGER;
+        const bo = b.order ?? Number.MAX_SAFE_INTEGER;
+        return ao - bo;
+    });
+    return { lanes, customByKey };
+}
+/**
+ * Serializes a smart lane's filters into the board's list query params. The ops
+ * list endpoint (ops #704) takes a SINGLE `f_<field>` param whose value carries
+ * the operator as a `OP:value` prefix:
+ *   - eq       → `f_<field>=EQ:value`
+ *   - neq      → `f_<field>=NEQ:value`
+ *   - contains → `f_<field>=HAS:value` (membership in a jsonb array — NOT the
+ *                text-substring ILIKE; that's why it's HAS, not CONTAINS)
+ *   - in       → `f_<field>=IN:v1,v2,...` (comma-separated after `IN:`)
+ * Empty fields/values are skipped.
+ */
+export function smartLaneParams(filters) {
+    const params = {};
+    for (const f of filters ?? []) {
+        if (!f.field || f.value == null || String(f.value).trim() === '')
+            continue;
+        const v = String(f.value).trim();
+        switch (f.op) {
+            case 'neq':
+                params[`f_${f.field}`] = `NEQ:${v}`;
+                break;
+            case 'contains':
+                params[`f_${f.field}`] = `HAS:${v}`;
+                break;
+            case 'in':
+                params[`f_${f.field}`] = `IN:${v}`;
+                break;
+            case 'eq':
+            default:
+                params[`f_${f.field}`] = `EQ:${v}`;
+        }
+    }
+    return params;
+}
+/**
+ * Resolves the smart lanes to paint. The kernel's `metadata.smart_lanes` is the
+ * source of truth for rendering (ops #704); the CRUD list only backs the
+ * management dialog. So when metadata carries smart lanes we map those, folding
+ * in the CRUD entry's `id` (matched by key) so the Editar menu can PUT/DELETE.
+ * When metadata omits them (older host / metadata lag) we tolerate the gap and
+ * fall back to the CRUD smart stages. Returns `CustomStage[]` either way.
+ */
+export function resolveSmartLanes(metaSmartLanes, crudSmartStages, model) {
+    if (!metaSmartLanes?.length)
+        return crudSmartStages;
+    const crudByKey = new Map(crudSmartStages.map((s) => [s.key, s]));
+    return metaSmartLanes.map((lane, i) => {
+        const match = crudByKey.get(lane.key);
+        return {
+            id: match?.id ?? lane.key,
+            model,
+            key: lane.key,
+            label: lane.label,
+            color: lane.color ?? match?.color ?? 'slate',
+            position: lane.order ?? match?.position ?? i,
+            type: 'smart',
+            filters: (lane.filters ?? []).map((f) => ({
+                field: f.field,
+                op: f.op,
+                value: f.value,
+            })),
+            enabled: true,
+        };
+    });
+}
+/** Columns offered in the condition builder: visible, non-id model columns. */
+export function customStageFilterFields(columns) {
+    return columns.filter((c) => !c.hidden && c.key !== 'id');
+}
+/** Whether a draft is complete enough to save. */
+export function isCustomStageDraftValid(draft) {
+    if (!draft.label.trim())
+        return false;
+    if (draft.type === 'smart') {
+        return draft.filters.some((f) => f.field && String(f.value).trim() !== '');
+    }
+    return true;
+}
+/** Slugify a label into a stable-ish lane key (used only when creating). */
+export function slugifyStageKey(label) {
+    return (label
+        .toLowerCase()
+        .normalize('NFD')
+        .replace(/[̀-ͯ]/g, '')
+        .replace(/[^a-z0-9]+/g, '_')
+        .replace(/^_+|_+$/g, '')
+        .slice(0, 48) || `stage_${Date.now().toString(36)}`);
+}
+// ---------------------------------------------------------------------------
+// Data hook
+// ---------------------------------------------------------------------------
+function unwrap(res) {
+    const body = res?.data;
+    if (body && typeof body === 'object' && 'data' in body)
+        return body.data;
+    return body;
+}
+/**
+ * Loads a model's custom stages and exposes CRUD. A missing endpoint (404 /
+ * network error) degrades to `available: false` so the kanban never breaks;
+ * real mutation failures surface a toast and re-throw so the dialog keeps its
+ * draft. A 409 on delete (existing cards) is re-thrown WITHOUT a generic toast
+ * so the delete flow can show a targeted message.
+ */
+export function useCustomStages(model) {
+    const api = useApi();
+    const { t } = useTranslation();
+    const [available, setAvailable] = useState(true);
+    const [loading, setLoading] = useState(true);
+    const [stages, setStages] = useState([]);
+    const load = useCallback(async () => {
+        setLoading(true);
+        try {
+            const res = await api.get(`/custom-stages?model=${encodeURIComponent(model)}`);
+            const data = unwrap(res);
+            setStages(Array.isArray(data) ? data : []);
+            setAvailable(true);
+        }
+        catch {
+            setStages([]);
+            setAvailable(false);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [api, model]);
+    useEffect(() => {
+        void load();
+    }, [load]);
+    const create = useCallback(async (draft) => {
+        try {
+            await api.post('/custom-stages', draft);
+            await load();
+        }
+        catch (e) {
+            toast.error(t('dynamic.custom_stages.save_error', {
+                defaultValue: 'No se pudo guardar la etapa',
+            }));
+            throw e;
+        }
+    }, [api, load, t]);
+    const update = useCallback(async (id, patch) => {
+        try {
+            await api.put(`/custom-stages/${id}`, patch);
+            await load();
+        }
+        catch (e) {
+            toast.error(t('dynamic.custom_stages.save_error', {
+                defaultValue: 'No se pudo guardar la etapa',
+            }));
+            throw e;
+        }
+    }, [api, load, t]);
+    const remove = useCallback(async (id, reassignTo) => {
+        try {
+            await api.delete(`/custom-stages/${id}`, reassignTo
+                ? { params: { reassign_to: reassignTo } }
+                : undefined);
+            await load();
+        }
+        catch (e) {
+            // 409 = the stage still holds cards; let the caller decide how to
+            // surface it (reassign prompt) instead of a generic error toast.
+            if (e?.response?.status === 409)
+                throw e;
+            toast.error(t('dynamic.custom_stages.delete_error', {
+                defaultValue: 'No se pudo eliminar la etapa',
+            }));
+            throw e;
+        }
+    }, [api, load, t]);
+    return { available, loading, stages, create, update, remove };
+}
+/** The dotted phantom lane at the end of the board (Bitrix/Trello pattern). */
+export function AddStageColumn({ onClick }) {
+    const { t } = useTranslation();
+    return (_jsxs("button", { type: "button", onClick: onClick, className: "group/add flex min-h-[55vh] min-w-[220px] max-w-[280px] shrink-0 flex-col items-center justify-center gap-2 rounded-xl border border-dashed bg-transparent p-4 text-sm text-muted-foreground transition-colors hover:border-primary/50 hover:bg-muted/40 hover:text-foreground", "data-testid": "kanban-add-stage", children: [_jsx("span", { className: "flex size-9 items-center justify-center rounded-full border border-dashed transition-colors group-hover/add:border-primary/50", children: _jsx(Plus, { className: "h-4 w-4" }) }), t('dynamic.custom_stages.add', { defaultValue: 'Agregar etapa' })] }));
+}
+/** The ⋮ menu shown in a custom lane's header. */
+export function CustomStageLaneMenu({ stage, onEdit, onDelete, }) {
+    const { t } = useTranslation();
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("button", { type: "button", className: "flex size-6 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground", "aria-label": t('dynamic.custom_stages.menu', {
+                        defaultValue: 'Opciones de la etapa',
+                    }), "data-testid": `custom-stage-menu-${stage.key}`, children: _jsx(MoreVertical, { className: "h-3.5 w-3.5" }) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsxs(DropdownMenuItem, { onClick: () => onEdit(stage), children: [_jsx(Pencil, { className: "mr-2 h-4 w-4" }), t('dynamic.custom_stages.edit', { defaultValue: 'Editar' })] }), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => onDelete(stage), children: [_jsx(Trash2, { className: "mr-2 h-4 w-4" }), t('dynamic.custom_stages.delete', { defaultValue: 'Eliminar' })] })] })] }));
+}
+export function CustomStageDialog({ open, onOpenChange, model, columns, initial, nextPosition, onCreate, onUpdate, }) {
+    const { t } = useTranslation();
+    const isDark = typeof document !== 'undefined' &&
+        document.documentElement.classList.contains('dark');
+    const fieldChoices = useMemo(() => customStageFilterFields(columns), [columns]);
+    const [label, setLabel] = useState('');
+    const [color, setColor] = useState(CUSTOM_STAGE_COLORS[0]);
+    const [type, setType] = useState('stage');
+    const [filters, setFilters] = useState([]);
+    const [saving, setSaving] = useState(false);
+    // Re-seed the form each time the dialog opens (create vs edit).
+    useEffect(() => {
+        if (!open)
+            return;
+        if (initial) {
+            setLabel(initial.label);
+            setColor(initial.color || CUSTOM_STAGE_COLORS[0]);
+            setType(initial.type);
+            setFilters(initial.filters?.length
+                ? initial.filters.map((f) => ({ ...f }))
+                : [emptyCustomStageFilter(fieldChoices[0]?.key ?? '')]);
+        }
+        else {
+            setLabel('');
+            setColor(CUSTOM_STAGE_COLORS[0]);
+            setType('stage');
+            setFilters([emptyCustomStageFilter(fieldChoices[0]?.key ?? '')]);
+        }
+    }, [open, initial, fieldChoices]);
+    const patchFilter = (i, patch) => setFilters((prev) => prev.map((f, idx) => (idx === i ? { ...f, ...patch } : f)));
+    const addFilter = () => setFilters((prev) => [
+        ...prev,
+        emptyCustomStageFilter(fieldChoices[0]?.key ?? ''),
+    ]);
+    const removeFilter = (i) => setFilters((prev) => prev.filter((_, idx) => idx !== i));
+    const valid = isCustomStageDraftValid({ label, type, filters });
+    const submit = async () => {
+        if (!valid || saving)
+            return;
+        setSaving(true);
+        // Only smart lanes carry filters; a normal stage sends an empty set.
+        const cleanFilters = type === 'smart'
+            ? filters.filter((f) => f.field && String(f.value).trim() !== '')
+            : [];
+        try {
+            if (initial) {
+                // PUT only accepts label/color/position/filters/enabled — model,
+                // type and key are immutable (ops #704), so we never send them.
+                await onUpdate(initial.id, {
+                    label: label.trim(),
+                    color,
+                    filters: cleanFilters,
+                });
+                toast.success(t('dynamic.custom_stages.updated', {
+                    defaultValue: 'Etapa actualizada',
+                }));
+            }
+            else {
+                await onCreate({
+                    model,
+                    key: slugifyStageKey(label),
+                    label: label.trim(),
+                    color,
+                    position: nextPosition,
+                    type,
+                    filters: cleanFilters,
+                    enabled: true,
+                });
+                toast.success(t('dynamic.custom_stages.created', {
+                    defaultValue: 'Etapa creada',
+                }));
+            }
+            onOpenChange(false);
+        }
+        catch {
+            // toast already surfaced by the hook; keep the draft open.
+        }
+        finally {
+            setSaving(false);
+        }
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-lg", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: initial
+                                ? t('dynamic.custom_stages.edit_title', {
+                                    defaultValue: 'Editar etapa',
+                                })
+                                : t('dynamic.custom_stages.new_title', {
+                                    defaultValue: 'Nueva etapa',
+                                }) }), _jsx(DialogDescription, { children: t('dynamic.custom_stages.dialog_description', {
+                                defaultValue: 'Agrega una columna al tablero. Una etapa normal recibe tarjetas al arrastrarlas; una etapa inteligente muestra las tarjetas que cumplen condiciones.',
+                            }) })] }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-xs", children: t('dynamic.custom_stages.name_label', {
+                                        defaultValue: 'Nombre',
+                                    }) }), _jsx(Input, { value: label, onChange: (e) => setLabel(e.target.value), placeholder: t('dynamic.custom_stages.name_placeholder', {
+                                        defaultValue: 'Nombre de la etapa',
+                                    }), "data-testid": "custom-stage-name", autoFocus: true })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-xs", children: t('dynamic.custom_stages.color_label', {
+                                        defaultValue: 'Color',
+                                    }) }), _jsx("div", { className: "flex flex-wrap gap-1.5", "data-testid": "custom-stage-colors", children: CUSTOM_STAGE_COLORS.map((c) => {
+                                        const style = generateBadgeStyles(c, { isDark });
+                                        const selected = c === color;
+                                        return (_jsx("button", { type: "button", onClick: () => setColor(c), className: `size-6 rounded-full border-2 transition-transform hover:scale-110 ${selected
+                                                ? 'border-foreground'
+                                                : 'border-transparent'}`, style: {
+                                                backgroundColor: style.backgroundColor ||
+                                                    style.background,
+                                            }, "aria-label": c, "aria-pressed": selected, "data-testid": `custom-stage-color-${c}` }, c));
+                                    }) })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-xs", children: t('dynamic.custom_stages.type_label', {
+                                        defaultValue: 'Tipo',
+                                    }) }), _jsxs(Select, { value: type, onValueChange: (v) => setType(v), disabled: !!initial, children: [_jsx(SelectTrigger, { "data-testid": "custom-stage-type", disabled: !!initial, children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "stage", children: t('dynamic.custom_stages.type_stage', {
+                                                        defaultValue: 'Etapa normal',
+                                                    }) }), _jsx(SelectItem, { value: "smart", children: t('dynamic.custom_stages.type_smart', {
+                                                        defaultValue: 'Etapa inteligente',
+                                                    }) })] })] })] }), type === 'smart' && (_jsxs("div", { className: "flex flex-col gap-2 rounded-md border bg-muted/30 p-3", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-xs font-medium text-muted-foreground", children: [_jsx(Filter, { className: "h-3.5 w-3.5" }), t('dynamic.custom_stages.conditions_label', {
+                                            defaultValue: 'Condiciones',
+                                        })] }), filters.map((f, i) => (_jsxs("div", { className: "grid grid-cols-[1fr_auto_1fr_auto] items-center gap-1.5", "data-testid": `custom-stage-condition-${i}`, children: [_jsxs(Select, { value: f.field, onValueChange: (v) => patchFilter(i, { field: v }), children: [_jsx(SelectTrigger, { className: "h-8 text-xs", "data-testid": `custom-stage-condition-field-${i}`, children: _jsx(SelectValue, { placeholder: t('dynamic.custom_stages.field_placeholder', { defaultValue: 'Campo' }) }) }), _jsx(SelectContent, { children: fieldChoices.map((c) => (_jsx(SelectItem, { value: c.key, className: "text-xs", children: t(c.label, { defaultValue: c.label }) }, c.key))) })] }), _jsxs(Select, { value: f.op, onValueChange: (v) => patchFilter(i, { op: v }), children: [_jsx(SelectTrigger, { className: "h-8 w-[104px] text-xs", "data-testid": `custom-stage-condition-op-${i}`, children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: CUSTOM_STAGE_FILTER_OPS.map((op) => (_jsx(SelectItem, { value: op, className: "text-xs", children: t(`dynamic.custom_stages.op.${op}`, {
+                                                            defaultValue: op === 'eq'
+                                                                ? 'es igual'
+                                                                : op === 'neq'
+                                                                    ? 'distinto'
+                                                                    : op === 'contains'
+                                                                        ? 'contiene'
+                                                                        : 'en lista',
+                                                        }) }, op))) })] }), _jsx(Input, { value: f.value, onChange: (e) => patchFilter(i, { value: e.target.value }), placeholder: t('dynamic.custom_stages.value_placeholder', {
+                                                defaultValue: 'Valor',
+                                            }), className: "h-8 text-xs", "data-testid": `custom-stage-condition-value-${i}` }), _jsx("button", { type: "button", onClick: () => removeFilter(i), disabled: filters.length === 1, className: "flex size-7 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-destructive disabled:opacity-40", "aria-label": t('dynamic.custom_stages.remove_condition', {
+                                                defaultValue: 'Quitar condición',
+                                            }), "data-testid": `custom-stage-condition-remove-${i}`, children: _jsx(X, { className: "h-3.5 w-3.5" }) })] }, i))), _jsxs(Button, { variant: "ghost", size: "sm", className: "h-7 justify-start gap-1 text-xs", onClick: addFilter, "data-testid": "custom-stage-add-condition", children: [_jsx(Plus, { className: "h-3.5 w-3.5" }), t('dynamic.custom_stages.add_condition', {
+                                            defaultValue: 'Agregar condición',
+                                        })] })] }))] }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: saving, children: t('dynamic.custom_stages.cancel', { defaultValue: 'Cancelar' }) }), _jsx(Button, { onClick: () => void submit(), disabled: !valid || saving, "data-testid": "custom-stage-save", children: initial
+                                ? t('dynamic.custom_stages.save', { defaultValue: 'Guardar' })
+                                : t('dynamic.custom_stages.create', { defaultValue: 'Crear etapa' }) })] })] }) }));
+}
+/**
+ * Confirms deleting a custom lane. A 409 (the backend rejected because cards
+ * still sit on a real stage) doesn't close the dialog — it reads `meta.cards`
+ * from the response, shows the count, and offers a target lane to reassign the
+ * cards to; confirming again retries the delete with `reassign_to`.
+ */
+export function CustomStageDeleteDialog({ open, onOpenChange, stage, reassignTargets = [], onConfirm, }) {
+    const { t } = useTranslation();
+    const [busy, setBusy] = useState(false);
+    const [conflict, setConflict] = useState(false);
+    const [cardCount, setCardCount] = useState(null);
+    const [reassignTo, setReassignTo] = useState('');
+    useEffect(() => {
+        if (open) {
+            setConflict(false);
+            setCardCount(null);
+            setReassignTo('');
+        }
+    }, [open]);
+    if (!stage)
+        return null;
+    const targets = reassignTargets.filter((tg) => tg.key !== stage.key);
+    const confirm = async () => {
+        // In conflict mode the delete only proceeds once a target is chosen.
+        if (conflict && !reassignTo)
+            return;
+        setBusy(true);
+        try {
+            await onConfirm(stage, conflict ? reassignTo : undefined);
+            toast.success(t('dynamic.custom_stages.deleted', {
+                defaultValue: 'Etapa eliminada',
+            }));
+            onOpenChange(false);
+        }
+        catch (e) {
+            if (e?.response?.status === 409) {
+                // Cards still on the stage — surface the count and let the user
+                // pick a lane to move them to, then retry with reassign_to.
+                setCardCount(e?.response?.data?.meta?.cards ?? null);
+                setConflict(true);
+            }
+            else {
+                onOpenChange(false);
+            }
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-md", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: t('dynamic.custom_stages.delete_title', {
+                                defaultValue: 'Eliminar etapa',
+                            }) }), _jsx(DialogDescription, { children: conflict
+                                ? t('dynamic.custom_stages.delete_conflict', {
+                                    defaultValue: 'La etapa tiene {{count}} tarjeta(s). Elige a qué columna moverlas antes de eliminarla.',
+                                    count: cardCount ?? 0,
+                                })
+                                : t('dynamic.custom_stages.delete_confirm', {
+                                    defaultValue: '¿Eliminar la etapa "{{label}}"? Esta acción no se puede deshacer.',
+                                    label: t(stage.label, { defaultValue: stage.label }),
+                                }) })] }), conflict && (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { className: "text-xs", children: t('dynamic.custom_stages.reassign_label', {
+                                defaultValue: 'Mover tarjetas a',
+                            }) }), _jsxs(Select, { value: reassignTo, onValueChange: setReassignTo, children: [_jsx(SelectTrigger, { "data-testid": "custom-stage-reassign", children: _jsx(SelectValue, { placeholder: t('dynamic.custom_stages.reassign_placeholder', { defaultValue: 'Elige una columna' }) }) }), _jsx(SelectContent, { children: targets.map((tg) => (_jsx(SelectItem, { value: tg.key, children: t(tg.label, { defaultValue: tg.label }) }, tg.key))) })] })] })), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: busy, children: t('dynamic.custom_stages.cancel', { defaultValue: 'Cancelar' }) }), _jsx(Button, { variant: "destructive", onClick: () => void confirm(), disabled: busy || (conflict && !reassignTo), "data-testid": "custom-stage-delete-confirm", children: conflict
+                                ? t('dynamic.custom_stages.reassign_and_delete', {
+                                    defaultValue: 'Mover y eliminar',
+                                })
+                                : t('dynamic.custom_stages.delete', {
+                                    defaultValue: 'Eliminar',
+                                }) })] })] }) }));
+}
+/**
+ * A virtual lane defined by `filters`. It runs its OWN list query (the board's
+ * shared records don't include it), so it stays correct regardless of what the
+ * main board page loaded. Cards render read-only — a smart lane is a saved view,
+ * not a drop target — and the header carries a funnel glyph + the custom menu.
+ */
+export function SmartLane({ stage, model, endpoint, defaultFilters, pageSize = 50, isDark, renderCard, refreshTrigger, onEdit, onDelete, }) {
+    const { t } = useTranslation();
+    const api = useApi();
+    const [records, setRecords] = useState([]);
+    const [total, setTotal] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const params = useMemo(() => smartLaneParams(stage.filters), [stage.filters]);
+    useEffect(() => {
+        let cancelled = false;
+        setLoading(true);
+        api
+            .get(endpoint || `/data/${model}`, {
+            params: {
+                page: 1,
+                per_page: pageSize,
+                ...defaultFilters,
+                ...params,
+            },
+        })
+            .then((res) => {
+            if (cancelled)
+                return;
+            if (res.data.success)
+                setRecords(res.data.data || []);
+            setTotal(res.data.meta?.total ?? res.data.meta?.count ?? null);
+        })
+            .catch(() => {
+            if (!cancelled)
+                setRecords([]);
+        })
+            .finally(() => {
+            if (!cancelled)
+                setLoading(false);
+        });
+        return () => {
+            cancelled = true;
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [api, endpoint, model, pageSize, JSON.stringify(params), JSON.stringify(defaultFilters ?? {}), refreshTrigger]);
+    const headerStyle = generateBadgeStyles(stage.color || optionColor(stage.key), {
+        isDark,
+    });
+    const count = total ?? records.length;
+    return (_jsxs("div", { className: "flex min-w-[280px] max-w-[420px] flex-1 shrink-0 flex-col rounded-xl border border-dashed bg-muted/20", "data-smart-stage": stage.key, "data-testid": `smart-lane-${stage.key}`, children: [_jsxs("div", { className: "flex items-center justify-between gap-2 px-3 py-2.5", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx(Badge, { variant: "outline", className: "border-0 text-xs font-semibold", style: headerStyle, children: t(stage.label, { defaultValue: stage.label }) }), _jsx("span", { className: "text-muted-foreground", title: t('dynamic.custom_stages.smart_hint', {
+                                    defaultValue: 'Etapa inteligente (por condiciones)',
+                                }), children: _jsx(Filter, { className: "h-3 w-3" }) }), _jsx("span", { className: "text-xs font-medium tabular-nums text-muted-foreground", children: count })] }), _jsx(CustomStageLaneMenu, { stage: stage, onEdit: onEdit, onDelete: onDelete })] }), _jsx("div", { className: "flex min-h-[55vh] max-h-[70vh] min-w-0 flex-col gap-2 overflow-y-auto px-2 pb-3", children: loading && records.length === 0 ? (_jsxs(_Fragment, { children: [_jsx(Skeleton, { className: "h-20 w-full" }), _jsx(Skeleton, { className: "h-20 w-full" })] })) : records.length === 0 ? (_jsx("p", { className: "px-1 py-6 text-center text-xs text-muted-foreground", children: t('dynamic.custom_stages.smart_empty', {
+                        defaultValue: 'Sin tarjetas que cumplan las condiciones',
+                    }) })) : (records.map((card) => (_jsx(React.Fragment, { children: renderCard(card) }, String(card.id))))) })] }));
+}

package/dist/dialogs/dynamic-record.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-record.d.ts","sourceRoot":"","sources":["../../src/dialogs/dynamic-record.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"dynamic-record.d.ts","sourceRoot":"","sources":["../../src/dialogs/dynamic-record.tsx"],"names":[],"mappings":"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"}

package/dist/dialogs/dynamic-record.js

@@ -23,6 +23,7 @@ import { DynamicSelectField, OptionLead, OptionThumb } from '../dynamic-select-f
 import { DynamicRelations } from '../dynamic-relations';
 import { useOptionsResolver } from '../use-options-resolver';
 import { getFieldRef } from '../dynamic-form-schema';
+import { FieldCell } from '../field-grid';
 import { isNilUuid, normalizeNilUuid } from '../nil-uuid';
 import { DynamicIcon, isLucideIconName } from '../dynamic-icon';
 import { humanizeToken } from '../dynamic-columns-helpers';
@@ -501,10 +502,12 @@ export function DynamicRecordDialog({ open, onOpenChange, mode, model, recordId,
     };
     const title = modalMeta ? config.getTitle(modalMeta, t) : '';
     const visibleFields = filterVisibleFields(modalMeta?.fields, mode);
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-2xl max-h-[90vh] flex flex-col p-0 gap-0 overflow-hidden", children: [_jsxs(DialogHeader, { className: "p-6 pb-4 border-b shrink-0", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: config.description })] }), _jsx("div", { className: "flex-1 overflow-y-auto p-6", children: loading ? (_jsx(LoadingSkeleton, {})) : modalMeta ? (_jsx(ModelContext.Provider, { value: model, children: _jsx(ImageUrlContext.Provider, { value: getImageUrl, children: _jsx(TimeZoneContext.Provider, { value: timeZone, children: _jsxs(CurrencyContext.Provider, { value: currency, children: [_jsxs("form", { id: "dynamic-record-form", onSubmit: handleSubmit, className: "grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4", children: [visibleFields.map(field => {
-                                                    const isFullWidth = field.type === 'textarea';
-                                                    return (_jsx("div", { className: isFullWidth ? 'sm:col-span-2' : '', children: _jsx(FieldRow, { field: field, record: record, value: formValues[field.key] ?? '', mode: mode, onChange: val => setFormValues((prev) => ({ ...prev, [field.key]: val })) }) }, field.key));
-                                                }), record?.external_url && (_jsx("div", { className: "sm:col-span-2", children: _jsxs("a", { href: record.external_url, target: "_blank", rel: "noreferrer", className: "inline-flex items-center gap-1.5 text-sm text-primary hover:underline mt-1", children: [_jsx(ExternalLink, { className: "h-3.5 w-3.5" }), "Ver en ", record.external_provider ?? 'proveedor externo'] }) }))] }), !isCreate && record && relations.length > 0 && (_jsx("div", { className: "mt-6", children: _jsx(DynamicRelations, { record: record, relations: relations, canCreate: mode === 'edit', canEdit: mode === 'edit', canDelete: mode === 'edit', onChange: handleChildChange }) }))] }) }) }) })) : null }), _jsxs(DialogFooter, { className: "p-4 border-t shrink-0 sm:justify-between", children: [isView && onOpenFullPage ? (_jsxs(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground", onClick: () => { onOpenChange(false); onOpenFullPage(); }, children: [_jsx(ExternalLink, { className: "mr-1.5 h-3.5 w-3.5" }), "Ver p\u00E1gina completa"] })) : _jsx("span", {}), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: saving || deleting, children: config.cancelLabel }), isView && onDelete && (_jsxs(Button, { variant: "destructive", onClick: handleDelete, disabled: deleting || loading, children: [deleting && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), deleting ? 'Eliminando...' : 'Eliminar'] })), isView && onEdit && (_jsx(Button, { onClick: onEdit, disabled: deleting || loading, children: "Editar" })), isEditable && (_jsxs(Button, { type: "submit", form: "dynamic-record-form", disabled: saving || loading, children: [saving && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), saving ? config.submittingLabel : config.submitLabel] }))] })] })] }) }));
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-2xl max-h-[90vh] flex flex-col p-0 gap-0 overflow-hidden", children: [_jsxs(DialogHeader, { className: "p-6 pb-4 border-b shrink-0", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: config.description })] }), _jsx("div", { className: "flex-1 overflow-y-auto p-6", children: loading ? (_jsx(LoadingSkeleton, {})) : modalMeta ? (_jsx(ModelContext.Provider, { value: model, children: _jsx(ImageUrlContext.Provider, { value: getImageUrl, children: _jsx(TimeZoneContext.Provider, { value: timeZone, children: _jsxs(CurrencyContext.Provider, { value: currency, children: [_jsxs("form", { id: "dynamic-record-form", onSubmit: handleSubmit, className: "grid grid-cols-1 gap-x-6 gap-y-4 sm:grid-cols-2", children: [visibleFields.map(field => {
+                                                    const isFullWidth = field.type === 'textarea' ||
+                                                        field.widget === 'textarea' ||
+                                                        field.widget === 'richtext';
+                                                    return (_jsx(FieldCell, { fullWidth: isFullWidth, children: _jsx(FieldRow, { field: field, record: record, value: formValues[field.key] ?? '', mode: mode, onChange: val => setFormValues((prev) => ({ ...prev, [field.key]: val })) }) }, field.key));
+                                                }), record?.external_url && (_jsx("div", { className: "sm:col-span-2 min-w-0", children: _jsxs("a", { href: record.external_url, target: "_blank", rel: "noreferrer", className: "inline-flex items-center gap-1.5 text-sm text-primary hover:underline mt-1", children: [_jsx(ExternalLink, { className: "h-3.5 w-3.5" }), "Ver en ", record.external_provider ?? 'proveedor externo'] }) }))] }), !isCreate && record && relations.length > 0 && (_jsx("div", { className: "mt-6", children: _jsx(DynamicRelations, { record: record, relations: relations, canCreate: mode === 'edit', canEdit: mode === 'edit', canDelete: mode === 'edit', onChange: handleChildChange }) }))] }) }) }) })) : null }), _jsxs(DialogFooter, { className: "p-4 border-t shrink-0 sm:justify-between", children: [isView && onOpenFullPage ? (_jsxs(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground", onClick: () => { onOpenChange(false); onOpenFullPage(); }, children: [_jsx(ExternalLink, { className: "mr-1.5 h-3.5 w-3.5" }), "Ver p\u00E1gina completa"] })) : _jsx("span", {}), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: saving || deleting, children: config.cancelLabel }), isView && onDelete && (_jsxs(Button, { variant: "destructive", onClick: handleDelete, disabled: deleting || loading, children: [deleting && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), deleting ? 'Eliminando...' : 'Eliminar'] })), isView && onEdit && (_jsx(Button, { onClick: onEdit, disabled: deleting || loading, children: "Editar" })), isEditable && (_jsxs(Button, { type: "submit", form: "dynamic-record-form", disabled: saving || loading, children: [saving && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), saving ? config.submittingLabel : config.submitLabel] }))] })] })] }) }));
 }
 function LoadingSkeleton() {
     return (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-4", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Skeleton, { className: "h-3.5 w-24" }), _jsx(Skeleton, { className: "h-9 w-full" })] }, i))) }));

package/dist/dynamic-kanban.d.ts.map

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