@asteby/metacore-runtime-react 45.0.0 → 45.2.0

package/dist/document/action-bar.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// ActionBar — barra de acciones de un documento (benchmark §5.4 / §6.2):
+// una primaria (verbo + sustantivo), 2–3 secundarias visibles, el resto en
+// «Más…» y las destructivas separadas (divisor) y en rojo. Una acción bloqueada se ve
+// deshabilitada con su motivo (no desaparece: el operador entiende por qué).
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Loader2, MoreHorizontal } from 'lucide-react';
+import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from '@asteby/metacore-ui/primitives';
+import { cn } from '@asteby/metacore-ui/lib';
+import { DynamicIcon } from '../dynamic-icon';
+export function ActionBar({ layout, onAction, className }) {
+    const { t } = useTranslation();
+    const [busy, setBusy] = useState(null);
+    const run = async (a) => {
+        if (a.blockedReason || busy)
+            return;
+        setBusy(a.def.key);
+        try {
+            await onAction(a);
+        }
+        finally {
+            setBusy(null);
+        }
+    };
+    const label = (a) => t(a.def.label, { defaultValue: a.def.label });
+    const { primary, secondary, more, destructive } = layout;
+    const hasMenu = more.length > 0;
+    const button = (a, variant) => {
+        const loading = busy === a.def.key;
+        const btn = (_jsxs(Button, { type: 'button', size: 'sm', variant: variant === 'destructive' ? 'outline' : variant, disabled: !!a.blockedReason || (!!busy && !loading), "aria-disabled": !!a.blockedReason, "data-action": a.def.key, onClick: () => run(a), className: cn(variant === 'destructive' &&
+                'border-destructive/40 text-destructive hover:bg-destructive/10 hover:text-destructive'), children: [loading ? (_jsx(Loader2, { className: 'mr-1.5 h-4 w-4 animate-spin' })) : a.def.icon ? (_jsx("span", { className: 'mr-1.5 inline-flex h-4 w-4 items-center', children: _jsx(DynamicIcon, { name: a.def.icon, className: 'h-4 w-4' }) })) : null, label(a)] }, a.def.key));
+        if (!a.blockedReason)
+            return btn;
+        return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("span", { tabIndex: 0, children: btn }) }), _jsx(TooltipContent, { className: 'max-w-xs', children: t(a.blockedReason, { defaultValue: a.blockedReason }) })] }, a.def.key));
+    };
+    const item = (a) => (_jsxs(DropdownMenuItem, { disabled: !!a.blockedReason, "data-action": a.def.key, onSelect: () => run(a), children: [a.def.icon ? (_jsx("span", { className: 'mr-2 inline-flex h-4 w-4 items-center', children: _jsx(DynamicIcon, { name: a.def.icon, className: 'h-4 w-4' }) })) : null, _jsxs("span", { className: 'flex flex-col', children: [label(a), a.blockedReason ? (_jsx("span", { className: 'text-xs font-normal text-muted-foreground', children: t(a.blockedReason, { defaultValue: a.blockedReason }) })) : null] })] }, a.def.key));
+    return (_jsx(TooltipProvider, { delayDuration: 150, children: _jsxs("div", { className: cn('flex flex-wrap items-center gap-2', className), "data-document-actions": '', children: [primary ? button(primary, primary.def.destructive ? 'destructive' : 'default') : null, secondary.map((a) => button(a, 'outline')), hasMenu ? (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { type: 'button', size: 'sm', variant: 'outline', "aria-label": t('document.more', { defaultValue: 'Más…' }), children: [_jsx(MoreHorizontal, { className: 'mr-1.5 h-4 w-4' }), t('document.more', { defaultValue: 'Más…' })] }) }), _jsx(DropdownMenuContent, { align: 'end', className: 'min-w-56', children: more.map((a) => item(a)) })] })) : null, destructive.length > 0 ? (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, className: 'mx-1 h-6 w-px bg-border' }), destructive.map((a) => button(a, 'destructive'))] })) : null] }) }));
+}

package/dist/document/cancel-with-reason.d.ts

@@ -0,0 +1,47 @@
+import { type ReactNode } from 'react';
+export interface CancelReason {
+    value: string;
+    label: string;
+    /** Ayuda corta bajo el motivo. */
+    hint?: string;
+    /** Exige apuntar a un documento sustituto (motivo 01 del SAT). */
+    requiresSubstitute?: boolean;
+    /** El motivo no aplica a este documento (se ve deshabilitado con `disabledReason`). */
+    disabled?: boolean;
+    disabledReason?: string;
+}
+export interface CancelPayload {
+    reason: string;
+    substitute?: string;
+}
+export interface CancelWithReasonProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    /** Identificación del documento («Factura A-1042»). */
+    documentLabel: string;
+    title?: string;
+    reasons: CancelReason[];
+    /** Consecuencias que se muestran en el paso de confirmación (§6.2). */
+    consequences: string[];
+    /**
+     * Aviso según el motivo elegido, p. ej. «requiere aceptación del receptor».
+     * Devuelve `undefined` si no hay.
+     */
+    notice?: (reason: CancelReason) => string | undefined;
+    /** Formato del identificador del sustituto; si se define, valida en línea. */
+    substitutePattern?: RegExp;
+    substituteLabel?: string;
+    substituteHelp?: string;
+    /** Zona para crear el sustituto desde el mismo asistente (el host la implementa). */
+    substituteSlot?: (props: {
+        value: string;
+        onChange: (v: string) => void;
+    }) => ReactNode;
+    /** Ejecuta la cancelación; debe lanzar con `message` si falla. */
+    onConfirm: (payload: CancelPayload) => Promise<unknown>;
+    /** Se llama tras un éxito, antes de cerrar. */
+    onDone?: () => void;
+    confirmLabel?: string;
+}
+export declare function CancelWithReason(props: CancelWithReasonProps): import("react").JSX.Element;
+//# sourceMappingURL=cancel-with-reason.d.ts.map

package/dist/document/cancel-with-reason.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cancel-with-reason.d.ts","sourceRoot":"","sources":["../../src/document/cancel-with-reason.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAiB3D,MAAM,WAAW,YAAY;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,kCAAkC;IAClC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,uFAAuF;IACvF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;CAC1B;AAED,MAAM,WAAW,aAAa;IAC1B,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,qBAAqB;IAClC,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,uDAAuD;IACvD,aAAa,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,uEAAuE;IACvE,YAAY,EAAE,MAAM,EAAE,CAAA;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,MAAM,GAAG,SAAS,CAAA;IACrD,8EAA8E;IAC9E,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,qFAAqF;IACrF,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;KAAE,KAAK,SAAS,CAAA;IACvF,kEAAkE;IAClE,SAAS,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;IACvD,+CAA+C;IAC/C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;CACxB;AAID,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,+BAgJ5D"}

package/dist/document/cancel-with-reason.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// CancelWithReason — cancelación guiada de 2 pasos (benchmark §5.5 / §7): motivo
+// del catálogo del tipo de documento → (documento sustituto si el motivo lo
+// exige) → confirmación con consecuencias. Genérico: el catálogo de motivos, las
+// consecuencias y la política de aceptación las declara el llamador; el
+// componente no sabe de CFDI. Solo una acción primaria por paso (verbo +
+// sustantivo) y, si la acción falla, el modal sigue abierto con el error.
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { AlertTriangle, Loader2 } from 'lucide-react';
+import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Input, Label, RadioGroup, RadioGroupItem, } from '@asteby/metacore-ui/primitives';
+export function CancelWithReason(props) {
+    const { open, onOpenChange, reasons, consequences, onConfirm, onDone } = props;
+    const { t } = useTranslation();
+    const [step, setStep] = useState('reason');
+    const [reasonValue, setReasonValue] = useState('');
+    const [substitute, setSubstitute] = useState('');
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        if (open) {
+            setStep('reason');
+            setReasonValue('');
+            setSubstitute('');
+            setError(null);
+            setBusy(false);
+        }
+    }, [open]);
+    const reason = reasons.find((r) => r.value === reasonValue);
+    const substituteValid = !reason?.requiresSubstitute ||
+        (substitute.trim().length > 0 && (!props.substitutePattern || props.substitutePattern.test(substitute.trim())));
+    const notice = reason ? props.notice?.(reason) : undefined;
+    const tr = (s) => t(s, { defaultValue: s });
+    const confirm = async () => {
+        if (!reason)
+            return;
+        setBusy(true);
+        setError(null);
+        try {
+            await onConfirm({ reason: reason.value, substitute: reason.requiresSubstitute ? substitute.trim() : undefined });
+            onDone?.();
+            onOpenChange(false);
+        }
+        catch (e) {
+            setError(e?.message || t('document.cancel.failed', { defaultValue: 'No se pudo cancelar. Revisa el detalle e intenta de nuevo.' }));
+            setBusy(false);
+        }
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: (o) => (!busy ? onOpenChange(o) : undefined), children: _jsxs(DialogContent, { className: 'sm:max-w-lg', children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: props.title ?? t('document.cancel.title', { defaultValue: 'Solicitar cancelación' }) }), _jsxs(DialogDescription, { children: [props.documentLabel, " \u00B7", ' ', step === 'reason'
+                                    ? t('document.cancel.step_reason', { defaultValue: 'Paso 1 de 2: elige el motivo' })
+                                    : t('document.cancel.step_confirm', { defaultValue: 'Paso 2 de 2: confirma' })] })] }), step === 'reason' ? (_jsxs("div", { className: 'flex flex-col gap-4', children: [_jsx(RadioGroup, { value: reasonValue, onValueChange: setReasonValue, className: 'gap-2', children: reasons.map((r) => (_jsxs("label", { className: 'flex cursor-pointer items-start gap-3 rounded-md border p-3 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50 has-[[data-state=checked]]:border-primary', children: [_jsx(RadioGroupItem, { value: r.value, disabled: r.disabled, className: 'mt-0.5' }), _jsxs("span", { className: 'flex flex-col', children: [_jsx("span", { className: 'text-sm font-medium', children: tr(r.label) }), r.disabled && r.disabledReason ? (_jsx("span", { className: 'text-xs text-muted-foreground', children: tr(r.disabledReason) })) : r.hint ? (_jsx("span", { className: 'text-xs text-muted-foreground', children: tr(r.hint) })) : null] })] }, r.value))) }), reason?.requiresSubstitute ? (props.substituteSlot ? (props.substituteSlot({ value: substitute, onChange: setSubstitute })) : (_jsxs("div", { className: 'grid gap-2', children: [_jsx(Label, { children: props.substituteLabel ?? t('document.cancel.substitute', { defaultValue: 'Documento sustituto' }) }), _jsx(Input, { value: substitute, onChange: (e) => setSubstitute(e.target.value), className: 'font-mono text-sm' }), props.substituteHelp ? _jsx("p", { className: 'text-xs text-muted-foreground', children: tr(props.substituteHelp) }) : null, substitute && !substituteValid ? (_jsx("p", { className: 'text-xs text-destructive', children: t('document.cancel.substitute_invalid', { defaultValue: 'El formato del identificador no es válido.' }) })) : null] }))) : null, notice ? _jsx("p", { className: 'rounded-md bg-muted p-3 text-sm', children: tr(notice) }) : null] })) : (_jsxs("div", { className: 'flex flex-col gap-3', children: [_jsxs("div", { className: 'flex items-start gap-2 rounded-md border border-destructive/30 bg-destructive/5 p-3 text-sm text-destructive', children: [_jsx(AlertTriangle, { className: 'mt-0.5 h-4 w-4 shrink-0' }), _jsx("ul", { className: 'list-disc pl-4', children: consequences.map((c) => (_jsx("li", { children: tr(c) }, c))) })] }), _jsxs("dl", { className: 'grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 text-sm', children: [_jsx("dt", { className: 'text-muted-foreground', children: t('document.cancel.reason', { defaultValue: 'Motivo' }) }), _jsx("dd", { className: 'font-medium', children: reason ? tr(reason.label) : '' }), reason?.requiresSubstitute ? (_jsxs(_Fragment, { children: [_jsx("dt", { className: 'text-muted-foreground', children: t('document.cancel.substitute_short', { defaultValue: 'Sustituto' }) }), _jsx("dd", { className: 'break-all font-mono text-xs', children: substitute })] })) : null] }), notice ? _jsx("p", { className: 'text-sm text-muted-foreground', children: tr(notice) }) : null, error ? (_jsx("p", { role: 'alert', className: 'rounded-md border border-destructive/40 bg-destructive/10 p-3 text-sm text-destructive', children: error })) : null] })), _jsx(DialogFooter, { children: step === 'reason' ? (_jsxs(_Fragment, { children: [_jsx(Button, { type: 'button', variant: 'outline', onClick: () => onOpenChange(false), children: t('document.cancel.keep', { defaultValue: 'Conservar documento' }) }), _jsx(Button, { type: 'button', disabled: !reason || !substituteValid, onClick: () => setStep('confirm'), children: t('document.cancel.continue', { defaultValue: 'Continuar' }) })] })) : (_jsxs(_Fragment, { children: [_jsx(Button, { type: 'button', variant: 'outline', disabled: busy, onClick: () => setStep('reason'), children: t('document.cancel.back', { defaultValue: 'Volver al motivo' }) }), _jsxs(Button, { type: 'button', variant: 'destructive', disabled: busy, onClick: confirm, children: [busy ? _jsx(Loader2, { className: 'mr-1.5 h-4 w-4 animate-spin' }) : null, props.confirmLabel ?? t('document.cancel.confirm', { defaultValue: 'Solicitar cancelación' })] })] })) })] }) }));
+}

package/dist/document/document-header.d.ts

@@ -0,0 +1,41 @@
+import { type ReactNode } from 'react';
+import { formatFieldValue, type FieldFormatOptions } from './format';
+import type { StatusDef } from './types';
+export interface HeaderBadge {
+    id: string;
+    label?: string;
+    status: StatusDef;
+}
+export interface HeaderMetric {
+    label: string;
+    value: string;
+    tone?: 'default' | 'critical';
+    mono?: boolean;
+}
+export interface DocumentHeaderProps {
+    title: string;
+    /** Texto bajo el título; si `subtitleHref` viene, es un enlace (ficha del cliente). */
+    subtitle?: string;
+    subtitleHref?: string;
+    badges: HeaderBadge[];
+    metrics?: HeaderMetric[];
+    copyable?: {
+        label: string;
+        value: string;
+    };
+    /** Zona de acciones (normalmente `<ActionBar/>`). */
+    actions?: ReactNode;
+    /** Slot antes del título (botón «Volver»). */
+    leading?: ReactNode;
+    /** Renderiza el subtítulo como enlace del router del host. */
+    renderLink?: (props: {
+        href: string;
+        children: ReactNode;
+        className?: string;
+    }) => ReactNode;
+    className?: string;
+}
+export declare function DocumentHeader({ title, subtitle, subtitleHref, badges, metrics, copyable, actions, leading, renderLink, className, }: DocumentHeaderProps): import("react").JSX.Element;
+export { formatFieldValue };
+export type { FieldFormatOptions };
+//# sourceMappingURL=document-header.d.ts.map

package/dist/document/document-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document-header.d.ts","sourceRoot":"","sources":["../../src/document/document-header.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAMhD,OAAO,EAAE,gBAAgB,EAAE,KAAK,kBAAkB,EAAE,MAAM,UAAU,CAAA;AACpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC,MAAM,WAAW,WAAW;IACxB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,SAAS,CAAA;CACpB;AAED,MAAM,WAAW,YAAY;IACzB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,CAAA;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,mBAAmB;IAChC,KAAK,EAAE,MAAM,CAAA;IACb,uFAAuF;IACvF,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,MAAM,EAAE,WAAW,EAAE,CAAA;IACrB,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IACxB,QAAQ,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;IAC3C,qDAAqD;IACrD,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,SAAS,CAAA;IAC5F,SAAS,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,wBAAgB,cAAc,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,OAAO,EACP,QAAQ,EACR,OAAO,EACP,OAAO,EACP,UAAU,EACV,SAAS,GACZ,EAAE,mBAAmB,+BAmFrB;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAA;AAC3B,YAAY,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/document/document-header.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// DocumentHeader — cabecera estándar (benchmark §5.2): serie/folio, badges de
+// cada máquina de estado, cliente enlazable, métricas (total, saldo, fechas) y
+// un identificador copiable (UUID).
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Check, Copy } from 'lucide-react';
+import { Button } from '@asteby/metacore-ui/primitives';
+import { cn } from '@asteby/metacore-ui/lib';
+import { StatusBadge } from './status-badge';
+import { formatFieldValue } from './format';
+export function DocumentHeader({ title, subtitle, subtitleHref, badges, metrics, copyable, actions, leading, renderLink, className, }) {
+    const { t } = useTranslation();
+    const [copied, setCopied] = useState(false);
+    const copy = async () => {
+        if (!copyable?.value)
+            return;
+        try {
+            await navigator.clipboard.writeText(copyable.value);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 1500);
+        }
+        catch {
+            /* sin portapapeles (contexto inseguro): el valor sigue seleccionable */
+        }
+    };
+    const subtitleNode = subtitle ? (subtitleHref ? (renderLink ? (renderLink({ href: subtitleHref, children: subtitle, className: 'text-sm text-primary hover:underline' })) : (_jsx("a", { href: subtitleHref, className: 'text-sm text-primary hover:underline', children: subtitle }))) : (_jsx("span", { className: 'text-sm text-muted-foreground', children: subtitle }))) : null;
+    return (_jsxs("header", { className: cn('flex flex-col gap-4 rounded-lg border bg-card p-5 text-card-foreground', className), "data-document-header": '', children: [leading, _jsxs("div", { className: 'flex flex-wrap items-start justify-between gap-4', children: [_jsxs("div", { className: 'flex min-w-0 flex-col gap-2', children: [_jsxs("div", { className: 'flex flex-wrap items-center gap-2', children: [_jsx("h1", { className: 'text-2xl font-bold tracking-tight', children: title }), badges.map((b) => (_jsx(StatusBadge, { status: b.status, srLabel: b.label ? t(b.label, { defaultValue: b.label }) : undefined }, b.id)))] }), subtitleNode] }), actions] }), metrics && metrics.length > 0 ? (_jsx("dl", { className: 'grid grid-cols-2 gap-x-6 gap-y-3 sm:grid-cols-3 lg:grid-cols-5', children: metrics.map((m) => (_jsxs("div", { children: [_jsx("dt", { className: 'text-xs uppercase tracking-wide text-muted-foreground', children: m.label }), _jsx("dd", { className: cn('font-medium tabular-nums', m.mono && 'font-mono text-xs', m.tone === 'critical' && 'text-destructive'), children: m.value })] }, m.label))) })) : null, copyable?.value ? (_jsxs("div", { className: 'flex flex-wrap items-center gap-2 text-xs text-muted-foreground', children: [_jsx("span", { className: 'uppercase tracking-wide', children: copyable.label }), _jsx("code", { className: 'break-all font-mono text-foreground', children: copyable.value }), _jsxs(Button, { type: 'button', size: 'sm', variant: 'ghost', className: 'h-6 px-1.5', onClick: copy, "aria-label": t('document.copy', { defaultValue: 'Copiar' }), children: [copied ? _jsx(Check, { className: 'h-3.5 w-3.5' }) : _jsx(Copy, { className: 'h-3.5 w-3.5' }), _jsx("span", { className: 'ml-1', children: copied ? t('document.copied', { defaultValue: 'Copiado' }) : t('document.copy', { defaultValue: 'Copiar' }) })] })] })) : null] }));
+}
+export { formatFieldValue };

package/dist/document/document-page.d.ts

@@ -0,0 +1,37 @@
+import { type ReactNode } from 'react';
+import { type FieldFormatOptions } from './format';
+import { type DocumentPageRegistration } from './registry';
+import type { DocumentContext, DocumentSlotRenderer, ResolvedAction } from './types';
+export interface DocumentPageProps extends FieldFormatOptions {
+    registration: DocumentPageRegistration;
+    record: Record<string, unknown>;
+    /**
+     * Ejecuta una acción. El host decide: abrir el modal de la acción del
+     * modelo (`def.modelAction ?? def.key`), navegar (`def.href`), etc. La
+     * promesa mantiene el botón en `loading`.
+     */
+    onAction: (action: ResolvedAction, ctx: DocumentContext) => void | Promise<unknown>;
+    /** UI del host para pestañas `kind: 'slot'` (historial, archivos, vista previa PDF…). */
+    slots?: Record<string, DocumentSlotRenderer>;
+    /** Navegación del host (botones inteligentes, cliente). */
+    onNavigate?: (href: string) => void;
+    renderLink?: (props: {
+        href: string;
+        children: ReactNode;
+        className?: string;
+    }) => ReactNode;
+    /** Botón «Volver» u otro contenido antes del título. */
+    leading?: ReactNode;
+    /** Pestaña inicial (`?tab=`). */
+    defaultTab?: string;
+    /** Pestaña controlada por el host (p. ej. «Ver detalle del error» abre Datos fiscales). */
+    tab?: string;
+    onTabChange?: (tab: string) => void;
+    /** Ruta base para el enlace del subtítulo (`/m/customers/{{customer_id}}`). */
+    subtitleHrefTemplate?: string;
+    /** Cambia para forzar recarga de las fuentes tras una acción. */
+    reloadKey?: number;
+    className?: string;
+}
+export declare function DocumentPage(props: DocumentPageProps): import("react").JSX.Element;
+//# sourceMappingURL=document-page.d.ts.map

package/dist/document/document-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document-page.d.ts","sourceRoot":"","sources":["../../src/document/document-page.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AASzD,OAAO,EAAoB,KAAK,kBAAkB,EAAE,MAAM,UAAU,CAAA;AACpE,OAAO,EAAqB,KAAK,wBAAwB,EAAE,MAAM,YAAY,CAAA;AAE7E,OAAO,KAAK,EAER,eAAe,EAEf,oBAAoB,EAGpB,cAAc,EACjB,MAAM,SAAS,CAAA;AAEhB,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IACzD,YAAY,EAAE,wBAAwB,CAAA;IACtC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAC/B;;;;OAIG;IACH,QAAQ,EAAE,CAAC,MAAM,EAAE,cAAc,EAAE,GAAG,EAAE,eAAe,KAAK,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,CAAA;IACnF,yFAAyF;IACzF,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,CAAA;IAC5C,2DAA2D;IAC3D,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,SAAS,CAAA;IAC5F,wDAAwD;IACxD,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,iCAAiC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,2FAA2F;IAC3F,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,+EAA+E;IAC/E,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BA4HpD"}

package/dist/document/document-page.js

@@ -0,0 +1,137 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// DocumentPage — «página de documento» declarativa (benchmark §5.2 / §6.1):
+// cabecera + badges + barra de acciones por estado + botones inteligentes +
+// pestañas. Se alimenta de un `DocumentSpec` (datos puros) y de un registro;
+// las pestañas de campos y de registros relacionados se resuelven solas, y lo
+// que necesita UI del host (historial, archivos, PDF) entra por `slots`.
+import { useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@asteby/metacore-ui/primitives';
+import { cn } from '@asteby/metacore-ui/lib';
+import { ActionBar } from './action-bar';
+import { DocumentHeader } from './document-header';
+import { SmartButtons } from './smart-buttons';
+import { StatusBadge } from './status-badge';
+import { interpolate, readPath, resolveActions, resolveStatus, resolveTitle } from './evaluate';
+import { formatFieldValue } from './format';
+import { findStatusMachine } from './registry';
+import { useDocumentSources } from './use-document-sources';
+export function DocumentPage(props) {
+    const { registration, record, onAction, slots, onNavigate, renderLink, leading, defaultTab, className } = props;
+    const { spec } = registration;
+    const { t } = useTranslation();
+    const fmt = { locale: props.locale, currency: props.currency, timeZone: props.timeZone };
+    const recordId = record.id;
+    const { sources, reload } = useDocumentSources(spec.sources, recordId);
+    const ctx = useMemo(() => {
+        const base = { record, sources };
+        return { ...base, derived: registration.derive?.(base) ?? {} };
+    }, [record, sources, registration]);
+    // Recarga las fuentes cuando el host avisa de un cambio (acción ejecutada).
+    const [lastReload, setLastReload] = useState(props.reloadKey ?? 0);
+    if ((props.reloadKey ?? 0) !== lastReload) {
+        setLastReload(props.reloadKey ?? 0);
+        reload();
+    }
+    const handleAction = (a) => {
+        const { tab: targetTab, openUrl, href } = a.def;
+        if (targetTab)
+            return setTab(targetTab);
+        if (openUrl) {
+            const url = interpolate(openUrl, ctx);
+            if (url)
+                window.open(url, '_blank', 'noopener,noreferrer');
+            return;
+        }
+        if (href)
+            return onNavigate?.(interpolate(href, ctx));
+        return onAction(a, ctx);
+    };
+    const layout = useMemo(() => resolveActions(spec, ctx), [spec, ctx]);
+    const badges = spec.statuses
+        .map((m) => {
+        const status = resolveStatus(m, ctx);
+        return status ? { id: m.id, label: m.label, status } : null;
+    })
+        .filter((b) => !!b);
+    const metrics = (spec.metrics ?? [])
+        .filter((m) => !m.hideEmpty || readPath(ctx, m.path) != null)
+        .map((m) => ({
+        label: t(m.label, { defaultValue: m.label }),
+        value: formatFieldValue(readPath(ctx, m.path), m.format, fmt),
+        tone: m.tone,
+        mono: m.format === 'mono',
+    }));
+    const subtitleRaw = spec.subtitle ? readPath(ctx, spec.subtitle.path) : undefined;
+    const subtitleText = subtitleRaw == null || subtitleRaw === '' ? '—' : formatFieldValue(subtitleRaw, 'text', fmt);
+    const subtitle = subtitleText === '—' ? undefined : subtitleText;
+    const subtitleHref = subtitle && props.subtitleHrefTemplate ? interpolate(props.subtitleHrefTemplate, ctx) : undefined;
+    const copyValue = spec.copyable ? readPath(ctx, spec.copyable.path) : undefined;
+    const [innerTab, setInnerTab] = useState(defaultTab ?? spec.tabs[0]?.key);
+    const tab = props.tab ?? innerTab;
+    const setTab = (key) => {
+        setInnerTab(key);
+        props.onTabChange?.(key);
+    };
+    const smart = (spec.smartButtons ?? [])
+        .map((b) => {
+        const count = b.source ? sources[b.source]?.length ?? 0 : undefined;
+        const active = b.source ? (count ?? 0) > 0 : b.field ? !!readPath(ctx, b.field) : true;
+        if (b.hideWhenEmpty && !active)
+            return null;
+        const href = b.href ? interpolate(b.href, ctx) : undefined;
+        return {
+            key: b.key,
+            label: b.label,
+            icon: b.icon,
+            count,
+            disabled: !active && !b.tab,
+            onClick: () => {
+                if (b.tab)
+                    setTab(b.tab);
+                else if (href)
+                    onNavigate?.(href);
+            },
+        };
+    })
+        .filter((b) => !!b);
+    return (_jsxs("div", { className: cn('flex flex-col gap-4', className), "data-document-page": spec.model, children: [_jsx(DocumentHeader, { title: resolveTitle(spec.title, ctx) || t('document.untitled', { defaultValue: 'Documento' }), subtitle: subtitle, subtitleHref: subtitleHref, badges: badges, metrics: metrics, copyable: spec.copyable && copyValue
+                    ? { label: t(spec.copyable.label, { defaultValue: spec.copyable.label }), value: String(copyValue) }
+                    : undefined, leading: leading, renderLink: renderLink, actions: _jsx(ActionBar, { layout: layout, onAction: (a) => handleAction(a) }) }), _jsx(SmartButtons, { items: smart }), _jsxs(Tabs, { value: tab, onValueChange: setTab, className: 'flex flex-col gap-4', children: [_jsx(TabsList, { className: 'w-fit', children: spec.tabs.map((tb) => (_jsxs(TabsTrigger, { value: tb.key, children: [t(tb.label, { defaultValue: tb.label }), tabCount(tb, ctx) !== undefined ? (_jsx("span", { className: 'ml-1.5 rounded-full bg-muted px-1.5 text-xs tabular-nums', children: tabCount(tb, ctx) })) : null] }, tb.key))) }), spec.tabs.map((tb) => (_jsx(TabsContent, { value: tb.key, className: 'mt-0', children: renderTab(tb, spec, ctx, fmt, slots) }, tb.key)))] })] }));
+}
+function tabCount(tb, ctx) {
+    if (tb.kind === 'records')
+        return ctx.sources[tb.source]?.length;
+    if (tb.kind === 'slot' && tb.count) {
+        const v = readPath(ctx, tb.count);
+        return typeof v === 'number' ? v : undefined;
+    }
+    return undefined;
+}
+function renderTab(tb, spec, ctx, fmt, slots) {
+    if (tb.kind === 'slot')
+        return slots?.[tb.slot]?.(ctx) ?? null;
+    if (tb.kind === 'fields') {
+        return (_jsx("div", { className: 'flex flex-col gap-4', children: tb.groups.map((g, i) => {
+                const fields = g.fields.filter((f) => !f.hideEmpty || readPath(ctx, f.path) != null);
+                if (fields.length === 0)
+                    return null;
+                return (_jsxs("section", { className: 'rounded-lg border bg-card p-5', children: [g.title ? _jsx("h2", { className: 'mb-3 text-sm font-semibold', children: g.title }) : null, _jsx("dl", { className: 'grid grid-cols-1 gap-x-6 gap-y-3 sm:grid-cols-2 lg:grid-cols-3', children: fields.map((f) => (_jsxs("div", { className: cn(f.wide && 'sm:col-span-2 lg:col-span-3'), children: [_jsx("dt", { className: 'text-xs uppercase tracking-wide text-muted-foreground', children: f.label }), _jsx("dd", { className: cn('break-words font-medium', f.format === 'mono' && 'font-mono text-xs'), children: formatFieldValue(readPath(ctx, f.path), f.format, fmt) })] }, f.path))) })] }, g.title ?? i));
+            }) }));
+    }
+    const rows = ctx.sources[tb.source] ?? [];
+    if (rows.length === 0) {
+        return (_jsx("p", { className: 'rounded-md border border-dashed p-6 text-center text-sm text-muted-foreground', children: tb.empty ?? 'Sin registros.' }));
+    }
+    return (_jsx("div", { className: 'overflow-x-auto rounded-lg border bg-card', children: _jsxs("table", { className: 'w-full text-sm', children: [_jsx("thead", { className: 'bg-muted/40 text-left text-xs uppercase tracking-wide text-muted-foreground', children: _jsx("tr", { children: tb.columns.map((c) => (_jsx("th", { className: 'px-3 py-2 font-medium', children: c.label }, c.path))) }) }), _jsx("tbody", { children: rows.map((row, i) => (_jsx("tr", { className: 'border-t', children: tb.columns.map((c) => (_jsx("td", { className: 'px-3 py-2', children: renderCell(c, row, spec, fmt) }, c.path))) }, String(row.id ?? i)))) })] }) }));
+}
+function renderCell(col, row, spec, fmt) {
+    const v = row[col.path];
+    if (col.status) {
+        const machine = findStatusMachine(spec, col.status);
+        const st = machine?.states.find((s) => s.value === String(v));
+        if (st)
+            return _jsx(StatusBadge, { status: st });
+    }
+    return (_jsx("span", { className: cn(col.format === 'mono' && 'font-mono text-xs', 'tabular-nums'), children: formatFieldValue(v, col.format, fmt) }));
+}

package/dist/document/document-timeline.d.ts

@@ -0,0 +1,20 @@
+import { type FieldFormatOptions } from './format';
+import type { StatusTone } from './types';
+export interface TimelineEntry {
+    id: string;
+    at: string;
+    /** Texto ya redactado («Timbró la factura»). */
+    label: string;
+    actor?: string;
+    detail?: string;
+    icon?: string;
+    tone?: StatusTone;
+}
+export interface DocumentTimelineProps extends FieldFormatOptions {
+    entries: TimelineEntry[];
+    /** Texto del estado vacío; lleva `emptyAction` si el host da una acción. */
+    emptyText?: string;
+    className?: string;
+}
+export declare function DocumentTimeline({ entries, emptyText, className, ...fmt }: DocumentTimelineProps): import("react").JSX.Element;
+//# sourceMappingURL=document-timeline.d.ts.map

package/dist/document/document-timeline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"document-timeline.d.ts","sourceRoot":"","sources":["../../src/document/document-timeline.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAoB,KAAK,kBAAkB,EAAE,MAAM,UAAU,CAAA;AACpE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAEzC,MAAM,WAAW,aAAa;IAC1B,EAAE,EAAE,MAAM,CAAA;IACV,EAAE,EAAE,MAAM,CAAA;IACV,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,UAAU,CAAA;CACpB;AAED,MAAM,WAAW,qBAAsB,SAAQ,kBAAkB;IAC7D,OAAO,EAAE,aAAa,EAAE,CAAA;IACxB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACrB;AAWD,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,GAAG,EAAE,EAAE,qBAAqB,+BA2BhG"}

package/dist/document/document-timeline.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// DocumentTimeline — línea de tiempo de eventos de negocio del documento
+// («creó», «timbró», «envió a…», «abrió», «pagó», «solicitó cancelación»,
+// «respuesta del SAT»). Complementa a <RecordHistory> (que muestra diffs de
+// campos): aquí cada entrada es un hecho legible, con actor y hora.
+import { useTranslation } from 'react-i18next';
+import { Circle } from 'lucide-react';
+import { cn } from '@asteby/metacore-ui/lib';
+import { DynamicIcon } from '../dynamic-icon';
+import { formatFieldValue } from './format';
+const TONE_DOT = {
+    neutral: 'text-muted-foreground',
+    info: 'text-[var(--info,oklch(0.55_0.13_235))]',
+    success: 'text-[var(--success,oklch(0.6_0.15_155))]',
+    caution: 'text-[var(--warning,oklch(0.6_0.15_65))]',
+    warning: 'text-[var(--warning,oklch(0.6_0.15_65))]',
+    critical: 'text-destructive',
+};
+export function DocumentTimeline({ entries, emptyText, className, ...fmt }) {
+    const { t } = useTranslation();
+    if (entries.length === 0) {
+        return (_jsx("p", { className: 'rounded-md border border-dashed p-6 text-center text-sm text-muted-foreground', children: emptyText ?? t('document.timeline_empty', { defaultValue: 'Aún no hay actividad en este documento.' }) }));
+    }
+    const sorted = [...entries].sort((a, b) => new Date(b.at).getTime() - new Date(a.at).getTime());
+    return (_jsx("ol", { className: cn('relative flex flex-col gap-4 border-l pl-5', className), "data-document-timeline": '', children: sorted.map((e) => (_jsxs("li", { className: 'relative', children: [_jsx("span", { className: cn('absolute -left-[1.85rem] flex h-5 w-5 items-center justify-center rounded-full bg-card', TONE_DOT[e.tone ?? 'neutral']), children: e.icon ? _jsx(DynamicIcon, { name: e.icon, className: 'h-4 w-4' }) : _jsx(Circle, { className: 'h-3 w-3 fill-current' }) }), _jsx("p", { className: 'text-sm font-medium', children: t(e.label, { defaultValue: e.label }) }), _jsxs("p", { className: 'text-xs text-muted-foreground', children: [formatFieldValue(e.at, 'datetime', fmt), e.actor ? ` · ${e.actor}` : ''] }), e.detail ? _jsx("p", { className: 'mt-1 whitespace-pre-wrap text-sm text-muted-foreground', children: e.detail }) : null] }, e.id))) }));
+}

package/dist/document/evaluate.d.ts

@@ -0,0 +1,31 @@
+import type { DocumentContext, DocumentSpec, Predicate, ResolvedActionLayout, StatusDef, StatusMachine, When } from './types';
+/** Máximo de secundarias visibles; el resto pasa a «Más…» (§5.2 / §6.2). */
+export declare const MAX_VISIBLE_SECONDARY = 3;
+/**
+ * Lee una ruta del contexto. `$.x` son los derivados; `sources.k.length` es el
+ * total de una fuente; el resto cuelga del registro (`record.x` o `x`).
+ */
+export declare function readPath(ctx: DocumentContext, path: string): unknown;
+export declare function evaluatePredicate(p: Predicate, ctx: DocumentContext): boolean;
+/** Un arreglo es un AND; sin condición siempre se cumple. */
+export declare function evaluateWhen(when: When | undefined, ctx: DocumentContext): boolean;
+/** Estado actual de una máquina para el registro (o su fallback / un estado desconocido explícito). */
+export declare function resolveStatus(machine: StatusMachine, ctx: DocumentContext): StatusDef | undefined;
+/**
+ * Distribución de acciones para el estado actual. Una acción `hiddenWhen` se
+ * omite; una `blockedWhen` queda deshabilitada con motivo. Más de
+ * `MAX_VISIBLE_SECONDARY` secundarias se derraman a «Más…»; una acción marcada
+ * `destructive` siempre va a la zona destructiva aunque el layout la ponga en otro lado.
+ */
+export declare function resolveActions(spec: DocumentSpec, ctx: DocumentContext): ResolvedActionLayout;
+/** Interpola `{{campo}}` con valores del registro (sin evaluar código). */
+export declare function interpolate(template: string, ctx: DocumentContext): string;
+/** Título: la interpolación puede dejar vacío el resultado; se prueban alternativas separadas por `||`. */
+export declare function resolveTitle(template: string, ctx: DocumentContext): string;
+/**
+ * Quita del spec las acciones que dependen de una acción del modelo que el
+ * backend (o el addon que la aporta) no declara: mejor un botón menos que uno
+ * que abre un modal vacío. Las que resuelve la propia página (`href`/`openUrl`/`tab`) siempre se conservan.
+ */
+export declare function pruneUnavailableActions(spec: DocumentSpec, availableModelActions: Iterable<string>): DocumentSpec;
+//# sourceMappingURL=evaluate.d.ts.map

package/dist/document/evaluate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"evaluate.d.ts","sourceRoot":"","sources":["../../src/document/evaluate.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAGR,eAAe,EACf,YAAY,EACZ,SAAS,EAET,oBAAoB,EACpB,SAAS,EACT,aAAa,EACb,IAAI,EACP,MAAM,SAAS,CAAA;AAEhB,4EAA4E;AAC5E,eAAO,MAAM,qBAAqB,IAAI,CAAA;AAEtC;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAuBpE;AAkBD,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,eAAe,GAAG,OAAO,CA0B7E;AAED,6DAA6D;AAC7D,wBAAgB,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,EAAE,GAAG,EAAE,eAAe,GAAG,OAAO,CAIlF;AAED,uGAAuG;AACvG,wBAAgB,aAAa,CAAC,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,eAAe,GAAG,SAAS,GAAG,SAAS,CAQjG;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,YAAY,EAAE,GAAG,EAAE,eAAe,GAAG,oBAAoB,CAoC7F;AAED,2EAA2E;AAC3E,wBAAgB,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,eAAe,GAAG,MAAM,CAK1E;AAED,2GAA2G;AAC3G,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,eAAe,GAAG,MAAM,CAM3E;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,YAAY,EAAE,qBAAqB,EAAE,QAAQ,CAAC,MAAM,CAAC,GAAG,YAAY,CAMjH"}