@kapiuara/ui 0.0.0-stage → 0.1.0

package/dist/components/navigation/activeItemLogic.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Id activo dentro de una lista de navegación (para su indicador deslizante): el `activeId` del
+ * componente si pertenece a esta lista; `null` si es de otra sección o no hay activo.
+ */
+export declare const activeIdIn: <Id extends string>(items: ReadonlyArray<{
+    id: Id;
+}>, activeId: Id | undefined) => Id | null;

package/dist/components/navigation/activeItemLogic.js

@@ -0,0 +1,4 @@
+//#region src/components/navigation/activeItemLogic.ts
+var e = (e, t) => t !== void 0 && e.some((e) => e.id === t) ? t : null;
+//#endregion
+export { e as activeIdIn };

package/dist/components/navigation/breadcrumbLogic.d.ts

@@ -0,0 +1,8 @@
+export type KapiBreadcrumbItemKind = "link" | "text" | "current";
+/**
+ * Rol de cada ítem: el último es la ubicación actual; los anteriores con
+ * `onClick` son botones; el resto es texto plano.
+ */
+export declare const breadcrumbKinds: (items: ReadonlyArray<{
+    onClick?: () => void;
+}>) => KapiBreadcrumbItemKind[];

package/dist/components/navigation/breadcrumbLogic.js

@@ -0,0 +1,4 @@
+//#region src/components/navigation/breadcrumbLogic.ts
+var e = (e) => e.map((t, n) => n === e.length - 1 ? "current" : t.onClick ? "link" : "text");
+//#endregion
+export { e as breadcrumbKinds };

package/dist/components/navigation/contextPanelLogic.d.ts

@@ -0,0 +1,27 @@
+export type KapiContextPanelSide = "left" | "right";
+/** Estado efectivo: el controlado gana; si no hay, el interno. */
+export declare const resolveCollapsed: (controlled: boolean | undefined, internal: boolean) => boolean;
+/** Clases del `<aside>`: conserva siempre `kapi-ctxpanel--{side}` (el `order` no depende del estado). */
+export declare const ctxPanelClasses: ({ side, collapsed, resizing, className }: {
+    side?: KapiContextPanelSide;
+    collapsed?: boolean;
+    resizing?: boolean;
+    className?: string;
+}) => string;
+/** El panel ofrece plegar sólo si el consumidor pasó alguna de las props de plegado. */
+export declare const canCollapse: ({ collapsed, defaultCollapsed, onCollapsedChange }: {
+    collapsed?: boolean | undefined;
+    defaultCollapsed?: boolean | undefined;
+    onCollapsedChange?: unknown;
+}) => boolean;
+export declare const DEFAULT_CTXPANEL_WIDTH = 258;
+export declare const DEFAULT_CTXPANEL_MIN_WIDTH = 200;
+export declare const DEFAULT_CTXPANEL_MAX_WIDTH = 420;
+/** Keyboard step in px. */
+export declare const CTXPANEL_RESIZE_STEP = 16;
+/** Clamp to [min, max]. */
+export declare const clampCtxPanelWidth: (width: number, min: number, max: number) => number;
+/** Width after dragging the inner edge: `left` grows to the right, `right` grows to the left. */
+export declare const ctxPanelWidthFromDrag: (side: KapiContextPanelSide, startWidth: number, startClientX: number, currentClientX: number, min: number, max: number) => number;
+/** Arrow keys on the separator (left/right per side). Other keys: null (no change). */
+export declare const stepCtxPanelWidth: (side: KapiContextPanelSide, width: number, key: string, min: number, max: number, step?: number) => number | null;

package/dist/components/navigation/contextPanelLogic.js

@@ -0,0 +1,11 @@
+import { clampOffcanvasWidth as e, widthFromDrag as t } from "../overlays/offcanvasResize.js";
+//#region src/components/navigation/contextPanelLogic.ts
+var n = (e, t) => e ?? t, r = ({ side: e = "left", collapsed: t = !1, resizing: n = !1, className: r }) => [
+	"kapi-ctxpanel",
+	e === "right" ? "kapi-ctxpanel--right" : "",
+	t ? "is-collapsed" : "",
+	n ? "is-resizing" : "",
+	r ?? ""
+].filter(Boolean).join(" "), i = ({ collapsed: e, defaultCollapsed: t, onCollapsedChange: n }) => e !== void 0 || t !== void 0 || n !== void 0, a = (t, n, r) => e(t, n, r), o = (e, n, r, i, a, o) => t(e, n, r, i, a, o), s = (e, t, n, r, i, o = 16) => n === (e === "right" ? "ArrowLeft" : "ArrowRight") ? a(t + o, r, i) : n === (e === "right" ? "ArrowRight" : "ArrowLeft") ? a(t - o, r, i) : null;
+//#endregion
+export { i as canCollapse, a as clampCtxPanelWidth, r as ctxPanelClasses, o as ctxPanelWidthFromDrag, n as resolveCollapsed, s as stepCtxPanelWidth };

package/dist/components/navigation/filterChipsLogic.d.ts

@@ -0,0 +1,23 @@
+export type KapiFilterChipTone = "neutral" | "primary" | "success" | "warning" | "danger";
+/** Chip de `KapiFilterChips`. `Id` acota los ids (p. ej. una unión de literales). */
+export type KapiFilterChipItem<Id extends string = string> = {
+    id: Id;
+    label: string;
+    /** Contador opcional en píldora. */
+    count?: number;
+    /** Color del contador (y del chip activo si no es neutral/primary). */
+    tone?: KapiFilterChipTone;
+};
+/** Clases de un chip. Pura: es lo que se testea. */
+export declare const filterChipClasses: (item: Pick<KapiFilterChipItem, "tone">, active: boolean, size?: "sm" | "md") => string;
+/** Índice del chip activo para el roving tabindex (0 si `value` no existe). */
+export declare const activeChipIndex: (items: readonly {
+    id: string;
+}[], value: string) => number;
+/**
+ * Próximo índice al navegar con el teclado. Flechas circulares; Home/End a los extremos.
+ * Devuelve `null` si la tecla no navega.
+ */
+export declare const nextChipIndex: (current: number, length: number, key: string) => number | null;
+/** Texto accesible del chip: "Aprobados, 7". */
+export declare const chipAriaLabel: (item: KapiFilterChipItem) => string;

package/dist/components/navigation/filterChipsLogic.js

@@ -0,0 +1,20 @@
+//#region src/components/navigation/filterChipsLogic.ts
+var e = (e, t, n = "md") => [
+	"kapi-filterchip",
+	`kapi-filterchip--${e.tone ?? "neutral"}`,
+	n !== "md" && `kapi-filterchip--${n}`,
+	t && "is-on"
+].filter(Boolean).join(" "), t = (e, t) => Math.max(0, e.findIndex((e) => e.id === t)), n = (e, t, n) => {
+	if (t <= 0) return null;
+	switch (n) {
+		case "ArrowRight":
+		case "ArrowDown": return (e + 1) % t;
+		case "ArrowLeft":
+		case "ArrowUp": return (e - 1 + t) % t;
+		case "Home": return 0;
+		case "End": return t - 1;
+		default: return null;
+	}
+}, r = (e) => e.count == null ? e.label : `${e.label}, ${e.count}`;
+//#endregion
+export { t as activeChipIndex, r as chipAriaLabel, e as filterChipClasses, n as nextChipIndex };

package/dist/components/navigation/index.d.ts

@@ -0,0 +1,39 @@
+export { KapiWizard, DEFAULT_WIZARD_LABELS } from "./KapiWizard";
+export type { KapiWizardLabels, KapiWizardOrientation, KapiWizardProps, KapiWizardStep } from "./KapiWizard";
+export { KapiSteps, DEFAULT_STEPS_LABELS } from "./KapiSteps";
+export type { KapiStep, KapiStepStatus, KapiStepsLabels, KapiStepsOrientation, KapiStepsProps, KapiStepsSize } from "./KapiSteps";
+export { resolveSteps, stepsClasses } from "./stepsLogic";
+export type { ResolvedSteps } from "./stepsLogic";
+export { KapiContextPanel, KapiContextSections, DEFAULT_CONTEXT_PANEL_LABELS } from "./KapiContextPanel";
+export type { KapiContextPanelItem, KapiContextPanelProps, KapiContextPanelLabels, KapiContextPanelSearch, KapiContextPanelSection, KapiContextSectionsProps } from "./KapiContextPanel";
+export { KapiCollapsiblePanel, KapiCollapsiblePanelStripItem, DEFAULT_COLLAPSIBLE_PANEL_LABELS } from "./KapiCollapsiblePanel";
+export type { KapiCollapsiblePanelLabels, KapiCollapsiblePanelProps, KapiCollapsiblePanelSide, KapiCollapsiblePanelStripItemProps } from "./KapiCollapsiblePanel";
+export { KapiTabPanel, KapiTabs } from "./KapiTabs";
+export type { KapiTabItem, KapiTabPanelProps, KapiTabsProps } from "./KapiTabs";
+export { nextTabId, tabClasses, tabId, tabPanelId } from "./tabsLogic";
+export { KapiBreadcrumb, DEFAULT_BREADCRUMB_LABELS } from "./KapiBreadcrumb";
+export type { KapiBreadcrumbItem, KapiBreadcrumbLabels, KapiBreadcrumbProps } from "./KapiBreadcrumb";
+export { breadcrumbKinds } from "./breadcrumbLogic";
+export type { KapiBreadcrumbItemKind } from "./breadcrumbLogic";
+export { KapiAccordion } from "./KapiAccordion";
+export type { KapiAccordionItem, KapiAccordionProps } from "./KapiAccordion";
+export { normalizeOpenIds, toggleOpenId } from "./accordionLogic";
+export { KapiTree, DEFAULT_TREE_LABELS } from "./KapiTree";
+export type { KapiTreeLabels, KapiTreeProps } from "./KapiTree";
+export type { KapiTreeNode } from "./treeLogic";
+export { KapiFilterChips, DEFAULT_FILTER_CHIPS_LABELS } from "./KapiFilterChips";
+export type { KapiFilterChipsLabels, KapiFilterChipsProps } from "./KapiFilterChips";
+export { filterChipClasses, activeChipIndex, nextChipIndex, chipAriaLabel } from "./filterChipsLogic";
+export type { KapiFilterChipItem, KapiFilterChipTone } from "./filterChipsLogic";
+export { useKapiPanelMini } from "./panelMini";
+export type { KapiPanelMiniState } from "./panelMini";
+export type { KapiPanelCollapsedMode } from "./panelMiniLogic";
+export { KapiNavBadge } from "./KapiNavBadge";
+export type { KapiNavBadgeProps } from "./KapiNavBadge";
+export { NAV_BADGE_MAX, NAV_BADGE_PANEL_MAX, navBadgeA11yText, navBadgeView } from "./navBadgeLogic";
+export type { KapiNavBadgeValue, KapiNavBadgeView } from "./navBadgeLogic";
+export { KapiPanelGroup } from "./KapiPanelGroup";
+export type { KapiPanelGroupItem, KapiPanelGroupProps } from "./KapiPanelGroup";
+export { panelGroupClasses, resolveOpen, formatCount, PANEL_GROUP_COUNT_MAX } from "./panelGroupLogic";
+export { canCollapse, ctxPanelClasses, resolveCollapsed } from "./contextPanelLogic";
+export type { KapiContextPanelSide } from "./contextPanelLogic";

package/dist/components/navigation/navBadgeLogic.d.ts

@@ -0,0 +1,26 @@
+/** Valor de un badge de navegación: un contador o `"dot"` (aviso sin número). */
+export type KapiNavBadgeValue = number | "dot";
+/** Tope por defecto del contador: por encima se muestra "99+". */
+export declare const NAV_BADGE_MAX = 99;
+/** Tope de los paneles (ítems de panel y grupos plegables), que tienen más ancho: "999+". */
+export declare const NAV_BADGE_PANEL_MAX = 999;
+export type KapiNavBadgeView = {
+    kind: "dot";
+} | {
+    kind: "count";
+    text: string;
+};
+type ViewOptions = {
+    /** Tope visual del contador. */
+    max?: number | undefined;
+    /** Muestra el 0 (por defecto un 0 no dibuja nada: no hay nada que atender). */
+    showZero?: boolean | undefined;
+};
+/** Qué dibujar: `null` si no hay badge (sin valor, 0 sin `showZero`, negativo o `NaN`). */
+export declare const navBadgeView: (value: KapiNavBadgeValue | null | undefined, { max, showZero }?: ViewOptions) => KapiNavBadgeView | null;
+/**
+ * Texto accesible que se suma al nombre del ítem: `label` si está, si no el número completo (sin tope).
+ * `null` si el badge no se dibuja o es un `dot` sin `label` (un punto solo no dice nada a un lector).
+ */
+export declare const navBadgeA11yText: (value: KapiNavBadgeValue | null | undefined, label?: string, { showZero }?: Pick<ViewOptions, "showZero">) => string | null;
+export {};

package/dist/components/navigation/navBadgeLogic.js

@@ -0,0 +1,16 @@
+//#region src/components/navigation/navBadgeLogic.ts
+var e = 99, t = 999, n = (e, t) => {
+	if (Number.isNaN(e)) return null;
+	let n = Math.max(0, Math.trunc(e));
+	return n === 0 && !t ? null : n;
+}, r = (e, { max: t = 99, showZero: r = !1 } = {}) => {
+	if (e == null) return null;
+	if (e === "dot") return { kind: "dot" };
+	let i = n(e, r);
+	return i === null ? null : {
+		kind: "count",
+		text: i > t ? `${t}+` : String(i)
+	};
+}, i = (e, t, { showZero: i = !1 } = {}) => r(e, { showZero: i }) === null ? null : t !== void 0 && t.trim() !== "" ? t : e === "dot" || e == null ? null : String(n(e, i));
+//#endregion
+export { e as NAV_BADGE_MAX, t as NAV_BADGE_PANEL_MAX, i as navBadgeA11yText, r as navBadgeView };

package/dist/components/navigation/panelGroupLogic.d.ts

@@ -0,0 +1,15 @@
+/** Tope visual del contador: por encima se muestra "999+". */
+export declare const PANEL_GROUP_COUNT_MAX = 999;
+/** Estado abierto efectivo: el controlado (si existe) gana sobre el interno. */
+export declare const resolveOpen: (controlled: boolean | undefined, internal: boolean) => boolean;
+/** Clases del contenedor raíz. */
+export declare const panelGroupClasses: ({ open, disabled, className }: {
+    open: boolean;
+    disabled?: boolean | undefined;
+    className?: string | undefined;
+}) => string;
+/**
+ * Texto del contador. Devuelve `null` si no hay contador (`undefined`/`null`/`NaN`),
+ * así el `0` sí se muestra. Los negativos y decimales se normalizan a un entero >= 0.
+ */
+export declare const formatCount: (count: number | null | undefined, max?: number) => string | null;

package/dist/components/navigation/panelGroupLogic.js

@@ -0,0 +1,13 @@
+//#region src/components/navigation/panelGroupLogic.ts
+var e = 999, t = (e, t) => e ?? t, n = ({ open: e, disabled: t, className: n }) => [
+	"kapi-panelgroup",
+	e && "kapi-panelgroup--open",
+	t && "kapi-panelgroup--disabled",
+	n
+].filter(Boolean).join(" "), r = (e, t = 999) => {
+	if (e == null || Number.isNaN(e)) return null;
+	let n = Math.max(0, Math.trunc(e));
+	return n > t ? `${t}+` : String(n);
+};
+//#endregion
+export { e as PANEL_GROUP_COUNT_MAX, r as formatCount, n as panelGroupClasses, t as resolveOpen };

package/dist/components/navigation/panelMini.d.ts

@@ -0,0 +1,13 @@
+import type { KapiTooltipSide } from "../overlays/KapiTooltip";
+/** Estado del modo mini que el panel plegado comparte con sus ítems. */
+export type KapiPanelMiniState = {
+    /** El panel está plegado en modo mini: los ítems se dibujan como ícono + tooltip. */
+    mini: boolean;
+    /** Despliega el panel (p. ej. al tocar la cabecera de un grupo en mini). */
+    expand: () => void;
+    /** Lado donde abre el tooltip (hacia el contenido). */
+    tooltipSide: KapiTooltipSide;
+};
+export declare const KapiPanelMiniContext: import("react").Context<KapiPanelMiniState>;
+/** Si el panel que contiene al componente está en modo mini (para contenido propio dentro del panel). */
+export declare const useKapiPanelMini: () => KapiPanelMiniState;

package/dist/components/navigation/panelMini.js

@@ -0,0 +1,9 @@
+"use client";
+import { createContext as e, useContext as t } from "react";
+var n = e({
+	mini: !1,
+	expand: () => {},
+	tooltipSide: "right"
+}), r = () => t(n);
+//#endregion
+export { n as KapiPanelMiniContext, r as useKapiPanelMini };

package/dist/components/navigation/panelMiniLogic.d.ts

@@ -0,0 +1,19 @@
+import { type ReactNode } from "react";
+/** Cómo queda el panel plegado: `hidden` lo oculta (con botón de reabrir); `mini` deja una tira de íconos. */
+export type KapiPanelCollapsedMode = "hidden" | "mini";
+/** El panel se dibuja en mini sólo plegado, con `collapsedMode="mini"` y fuera de móvil (ahí es un drawer). */
+export declare const resolveMini: ({ collapsedMode, open, mobile }: {
+    collapsedMode?: KapiPanelCollapsedMode | undefined;
+    open: boolean;
+    mobile: boolean;
+}) => boolean;
+/**
+ * Texto plano de un `ReactNode` (para el tooltip y la inicial de un ítem cuya etiqueta es JSX). Sólo sigue
+ * `children`: una etiqueta que es un componente que arma su texto desde otras props (p. ej. `<T id="…" />`)
+ * da "" (en mini conviene pasar la etiqueta como texto o un ícono).
+ */
+export declare const nodeText: (node: ReactNode) => string;
+/** Inicial que reemplaza al ícono en mini: primera letra o dígito, en mayúscula. */
+export declare const miniInitial: (text: string) => string;
+/** Texto del tooltip en mini: el título y, si hay, el aviso ("Mi trabajo · 22 esperando tu acción"). */
+export declare const miniTooltipLabel: (title: string, notice: string | null) => string;

package/dist/components/navigation/panelMiniLogic.js

@@ -0,0 +1,6 @@
+"use client";
+import { isValidElement as e } from "react";
+//#region src/components/navigation/panelMiniLogic.ts
+var t = ({ collapsedMode: e = "hidden", open: t, mobile: n }) => e === "mini" && !t && !n, n = (t) => t == null || typeof t == "boolean" ? "" : typeof t == "string" || typeof t == "number" ? String(t) : Array.isArray(t) ? t.map(n).join("") : e(t) ? n(t.props.children) : "", r = (e) => e.match(/[\p{L}\p{N}]/u)?.[0]?.toUpperCase() ?? "", i = (e, t) => t === null ? e : `${e} · ${t}`;
+//#endregion
+export { r as miniInitial, i as miniTooltipLabel, n as nodeText, t as resolveMini };

package/dist/components/navigation/stepsLogic.d.ts

@@ -0,0 +1,25 @@
+/** Estado de un paso de `KapiSteps`. */
+export type KapiStepStatus = "complete" | "current" | "upcoming" | "error";
+/** Disposición de `KapiSteps`. */
+export type KapiStepsOrientation = "vertical" | "horizontal";
+/** Tamaño de `KapiSteps`. */
+export type KapiStepsSize = "sm" | "md";
+export type ResolvedSteps = {
+    /** Estado final de cada paso, en el orden de entrada. */
+    statuses: KapiStepStatus[];
+    /** Índice que lleva `aria-current="step"` (-1 si ninguno). */
+    currentIndex: number;
+};
+/**
+ * Estados de los pasos. Con `current` (id existente): antes = completo, ese = en curso, después =
+ * pendiente. El `status` explícito de un paso gana, salvo `"current"` en otro paso que no es `current`:
+ * hay un solo paso en curso (el que lleva `aria-current`), así que ese se resuelve por posición. Sin
+ * `current` (o con uno que no existe) sólo cuentan los explícitos y el resto queda pendiente; el paso
+ * actual es el primero en curso.
+ */
+export declare const resolveSteps: <Id extends string>(steps: readonly {
+    id: Id;
+    status?: KapiStepStatus | undefined;
+}[], current: Id | undefined) => ResolvedSteps;
+/** Clases de la lista. Pura y exportada para testear. */
+export declare const stepsClasses: (orientation: KapiStepsOrientation, size: KapiStepsSize) => string;

package/dist/components/navigation/stepsLogic.js

@@ -0,0 +1,10 @@
+//#region src/components/navigation/stepsLogic.ts
+var e = (e, t) => {
+	let n = t === void 0 ? -1 : e.findIndex((e) => e.id === t), r = e.map((e, t) => e.status && !(e.status === "current" && n >= 0 && t !== n) ? e.status : n < 0 ? "upcoming" : t < n ? "complete" : t === n ? "current" : "upcoming");
+	return {
+		statuses: r,
+		currentIndex: n >= 0 ? n : r.indexOf("current")
+	};
+}, t = (e, t) => `kapi-steps kapi-steps--${e}${t === "sm" ? " kapi-steps--sm" : ""}`;
+//#endregion
+export { e as resolveSteps, t as stepsClasses };

package/dist/components/navigation/tabsLogic.d.ts

@@ -0,0 +1,12 @@
+export type TabsKey = "ArrowRight" | "ArrowLeft" | "Home" | "End";
+/**
+ * Id de la pestaña a enfocar/activar tras una tecla de navegación (patrón WAI-ARIA tabs).
+ * Con wrap en los extremos. Devuelve `undefined` si la tecla no navega o no hay pestañas.
+ */
+export declare const nextTabId: <Id extends string>(ids: readonly Id[], current: Id, key: string) => Id | undefined;
+/** Clases de una pestaña. Pura y exportada para testear. */
+export declare const tabClasses: (on: boolean) => string;
+/** Id del botón de una pestaña, derivado de la base del grupo. Lo usa `aria-labelledby` del panel. */
+export declare const tabId: (base: string, id: string) => string;
+/** Id del `tabpanel` de una pestaña, derivado de la base del grupo. Lo usa `aria-controls` del tab. */
+export declare const tabPanelId: (base: string, id: string) => string;

package/dist/components/navigation/tabsLogic.js

@@ -0,0 +1,14 @@
+//#region src/components/navigation/tabsLogic.ts
+var e = (e, t, n) => {
+	if (e.length === 0) return;
+	let r = e.indexOf(t);
+	switch (n) {
+		case "ArrowRight": return e[(r + 1) % e.length];
+		case "ArrowLeft": return e[(r <= 0 ? e.length : r) - 1];
+		case "Home": return e[0];
+		case "End": return e[e.length - 1];
+		default: return;
+	}
+}, t = (e) => e ? "kapi-tab kapi-tab--on" : "kapi-tab", n = (e, t) => `${e}-tab-${t}`, r = (e, t) => `${e}-panel-${t}`;
+//#endregion
+export { e as nextTabId, t as tabClasses, n as tabId, r as tabPanelId };

package/dist/components/navigation/treeLogic.d.ts

@@ -0,0 +1,80 @@
+/**
+ * Nodo de `KapiTree`. `T` tipa `data` (el dato de negocio que vuelve en los callbacks y en `renderLabel`);
+ * `Id` acota los ids (p. ej. una unión de literales).
+ */
+export type KapiTreeNode<T = unknown, Id extends string = string> = {
+    id: Id;
+    /** Texto del nodo: lo muestra, lo nombra y lo usa el type-ahead (el contenido rico va por `renderLabel`). */
+    label: string;
+    /** Hijos ya cargados. */
+    children?: KapiTreeNode<T, Id>[];
+    /** Hijos que todavía no se cargaron: el nodo se puede expandir y `onExpand` los trae. */
+    hasChildren?: boolean;
+    /** Hijos cargándose (con `hasChildren`): muestra el spinner y marca `aria-busy`. */
+    loading?: boolean;
+    /** Enfocable pero no se selecciona ni se expande. */
+    disabled?: boolean;
+    /** Dato propio del nodo; el árbol no lo lee, sólo lo devuelve en los callbacks y en `renderLabel`. */
+    data?: T;
+};
+/** Un nodo visible (sus ancestros están expandidos), con los datos ARIA de su posición. */
+export type KapiTreeVisibleNode = {
+    node: KapiTreeNode;
+    level: number;
+    setSize: number;
+    posInSet: number;
+    parentId: string | null;
+};
+export type KapiTreeKeyAction = {
+    type: "focus";
+    id: string;
+} | {
+    type: "expand";
+    id: string;
+} | {
+    type: "collapse";
+    id: string;
+} | {
+    type: "select";
+    id: string;
+} | {
+    type: "expandMany";
+    ids: string[];
+};
+/** ¿Se puede expandir? Con hijos cargados o con `hasChildren` (carga diferida). */
+export declare const isExpandable: (node: KapiTreeNode) => boolean;
+/**
+ * ¿Hay que pedir los hijos al expandirlo? Sólo un nodo diferido (`hasChildren`) sin `children` cargados y que
+ * no esté cargando: es cuando `KapiTree` llama a `onExpand`.
+ */
+export declare const needsChildren: (node: KapiTreeNode) => boolean;
+/** Aplana el árbol en el orden visual: sólo entran los hijos de nodos expandidos (con todos sus ancestros abiertos). */
+export declare const flattenVisible: (nodes: ReadonlyArray<KapiTreeNode>, expanded: ReadonlyArray<string>) => KapiTreeVisibleNode[];
+/** Ids de los ancestros de `id`, de la raíz al padre; `null` si el nodo no existe. */
+export declare const findAncestors: (nodes: ReadonlyArray<KapiTreeNode>, id: string) => string[] | null;
+/**
+ * Nodo que lleva el `tabIndex=0` (roving): el enfocado si se ve; si quedó oculto, su ancestro visible más
+ * cercano; sin foco previo, el primer seleccionado visible y si no, el primero.
+ */
+export declare const resolveTabStop: (nodes: ReadonlyArray<KapiTreeNode>, visible: ReadonlyArray<KapiTreeVisibleNode>, focusId: string | null, selected: ReadonlyArray<string>) => string | null;
+/** Alterna un nodo expandido sin mutar. */
+export declare const toggleExpandedId: (expanded: ReadonlyArray<string>, id: string) => string[];
+/** Selección: en simple reemplaza (re-seleccionar no deselecciona); en múltiple alterna. */
+export declare const toggleSelectedId: <Id extends string>(selected: ReadonlyArray<Id>, id: Id, multiple: boolean) => Id[];
+/**
+ * Type-ahead: el siguiente nodo visible (después del actual, con vuelta) cuyo texto empieza con `query`, sin
+ * mayúsculas ni acentos. Una consulta de varias letras puede quedarse en el actual; repetir la misma letra
+ * ("aa") recorre los que empiezan con ella. Contrato: `fromIndex` es el índice del nodo enfocado en `visible`
+ * (`0 <= fromIndex < visible.length`); quien llama descarta el caso sin nodo enfocado.
+ */
+export declare const matchTypeahead: (visible: ReadonlyArray<KapiTreeVisibleNode>, fromIndex: number, query: string) => string | null;
+/** Teclas que maneja `treeKeyAction` (fuente única: el componente las previene aunque no hagan nada). */
+export declare const TREE_KEYS: ReadonlySet<string>;
+/** Qué hace una tecla sobre el nodo enfocado (WAI-ARIA APG, Tree View); `null` si no le corresponde. */
+export declare const treeKeyAction: ({ key, nodes, visible, focusId, expanded }: {
+    key: string;
+    nodes: ReadonlyArray<KapiTreeNode>;
+    visible: ReadonlyArray<KapiTreeVisibleNode>;
+    focusId: string;
+    expanded: ReadonlyArray<string>;
+}) => KapiTreeKeyAction | null;

package/dist/components/navigation/treeLogic.js

@@ -0,0 +1,91 @@
+import { normalizeText as e } from "../inputs/selectLogic.js";
+//#region src/components/navigation/treeLogic.ts
+var t = (e) => (e.children?.length ?? 0) > 0 || e.hasChildren === !0, n = (e) => e.hasChildren === !0 && e.children === void 0 && e.loading !== !0, r = (e, t) => {
+	let n = new Set(t), r = [], i = (e, t, a) => {
+		e.forEach((o, s) => {
+			r.push({
+				node: o,
+				level: t,
+				setSize: e.length,
+				posInSet: s + 1,
+				parentId: a
+			}), n.has(o.id) && o.children?.length && i(o.children, t + 1, o.id);
+		});
+	};
+	return i(e, 1, null), r;
+}, i = (e, t) => {
+	for (let n of e) {
+		if (n.id === t) return [];
+		if (n.children) {
+			let e = i(n.children, t);
+			if (e) return [n.id, ...e];
+		}
+	}
+	return null;
+}, a = (e, t, n, r) => {
+	let a = new Set(t.map((e) => e.node.id));
+	if (n !== null) {
+		if (a.has(n)) return n;
+		let t = (i(e, n) ?? []).reverse().find((e) => a.has(e));
+		if (t) return t;
+	}
+	return t.find((e) => r.includes(e.node.id))?.node.id ?? t[0]?.node.id ?? null;
+}, o = (e, t, n) => n ? e.includes(t) ? e.filter((e) => e !== t) : [...e, t] : [t], s = (t, n, r) => {
+	let i = e(r);
+	if (!i || t.length === 0) return null;
+	let a = i.length > 1 && [...i].every((e) => e === i[0]), o = a ? i.charAt(0) : i, s = i.length > 1 && !a ? n : n + 1;
+	for (let n = 0; n < t.length; n++) {
+		let r = t[(s + n) % t.length];
+		if (r && e(r.node.label).startsWith(o)) return r.node.id;
+	}
+	return null;
+}, c = /* @__PURE__ */ new Set([
+	"ArrowUp",
+	"ArrowDown",
+	"ArrowLeft",
+	"ArrowRight",
+	"Home",
+	"End",
+	"Enter",
+	" ",
+	"*"
+]), l = ({ key: e, nodes: n, visible: r, focusId: i, expanded: a }) => {
+	let o = r.findIndex((e) => e.node.id === i), s = r[o];
+	if (!s) return null;
+	let { node: c } = s, l = a.includes(c.id), u = (e) => e ? {
+		type: "focus",
+		id: e.node.id
+	} : null;
+	switch (e) {
+		case "ArrowDown": return u(r[o + 1]);
+		case "ArrowUp": return u(r[o - 1]);
+		case "Home": return u(r[0]);
+		case "End": return u(r[r.length - 1]);
+		case "ArrowRight": return c.disabled || !t(c) ? null : l ? r[o + 1]?.parentId === c.id ? u(r[o + 1]) : null : {
+			type: "expand",
+			id: c.id
+		};
+		case "ArrowLeft": return l && t(c) && !c.disabled ? {
+			type: "collapse",
+			id: c.id
+		} : s.parentId === null ? null : {
+			type: "focus",
+			id: s.parentId
+		};
+		case "Enter":
+		case " ": return c.disabled ? null : {
+			type: "select",
+			id: c.id
+		};
+		case "*": {
+			let e = (s.parentId === null ? n : r.find((e) => e.node.id === s.parentId)?.node.children ?? []).filter((e) => !e.disabled && t(e) && !a.includes(e.id)).map((e) => e.id);
+			return e.length ? {
+				type: "expandMany",
+				ids: e
+			} : null;
+		}
+		default: return null;
+	}
+};
+//#endregion
+export { c as TREE_KEYS, i as findAncestors, r as flattenVisible, t as isExpandable, s as matchTypeahead, n as needsChildren, a as resolveTabStop, o as toggleSelectedId, l as treeKeyAction };

package/dist/components/navigation/wizardLogic.d.ts

@@ -0,0 +1,11 @@
+/** Lo mínimo que la lógica necesita de un paso. */
+export type WizardStepLike = {
+    validate?: (() => boolean) | undefined;
+};
+export type WizardAdvance = "blocked" | "next" | "finish";
+/** Mantiene el índice dentro de [0, total-1]. Con 0 pasos devuelve 0. */
+export declare const clampStep: (index: number, total: number) => number;
+/** Sólo se puede saltar hacia atrás por click (nunca adelante). */
+export declare const canJumpTo: (target: number, current: number) => boolean;
+/** Qué pasa al apretar "Siguiente": respeta `validate()` del paso actual. */
+export declare const resolveAdvance: (steps: readonly WizardStepLike[], current: number) => WizardAdvance;

package/dist/components/navigation/wizardLogic.js

@@ -0,0 +1,7 @@
+//#region src/components/navigation/wizardLogic.ts
+var e = (e, t) => t <= 0 ? 0 : Math.min(Math.max(Math.trunc(e) || 0, 0), t - 1), t = (e, t) => e < t, n = (e, t) => {
+	let n = e[t];
+	return !n || n.validate && !n.validate() ? "blocked" : t >= e.length - 1 ? "finish" : "next";
+};
+//#endregion
+export { t as canJumpTo, e as clampStep, n as resolveAdvance };

package/dist/components/overlays/KapiCanvasForm.d.ts

@@ -0,0 +1,42 @@
+import { type FormEvent, type ReactNode } from "react";
+import { type KapiOffcanvasProps } from "./KapiOffcanvas";
+/**
+ * Textos de los botones (clave `canvasForm` del provider). No hay prop `labels` propia: `labels` es la
+ * del `KapiOffcanvas`; por componente se usan `submitLabel`/`cancelLabel`.
+ */
+export type KapiCanvasFormLabels = {
+    submit: string;
+    cancel: string;
+};
+export declare const DEFAULT_CANVAS_FORM_LABELS: KapiCanvasFormLabels;
+export type KapiCanvasFormProps = Omit<KapiOffcanvasProps, "footer" | "children" | "onClose"> & {
+    /** Pedido de cierre (X, fondo, Escape, Cancelar). Se ignora mientras se está guardando. */
+    onClose: () => void;
+    /** Los campos del formulario. */
+    children?: ReactNode;
+    /**
+     * Se llama al enviar el form (botón Guardar o Enter en un campo). Si devuelve una promesa, el
+     * formulario queda en estado "guardando" hasta que se resuelva. No cierra el panel: el padre decide.
+     */
+    onSubmit: (event: FormEvent<HTMLFormElement>) => void | Promise<void>;
+    /** Recibe el rechazo de `onSubmit`. Sin esto el error se vuelve a lanzar (queda visible en consola). */
+    onError?: (error: unknown) => void;
+    /** Texto del botón de envío. Gana sobre la clave `canvasForm.submit` ("Guardar"). */
+    submitLabel?: string;
+    /** Texto del botón de cancelar. Gana sobre la clave `canvasForm.cancel` ("Cancelar"). */
+    cancelLabel?: string;
+    /** Deshabilita el envío (p. ej. formulario inválido o sin cambios). */
+    submitDisabled?: boolean;
+    /** `id` del `<form>`. Se genera uno si no se pasa. */
+    formId?: string;
+};
+/**
+ * Formulario dentro de un `KapiOffcanvas`: cuerpo con scroll, footer fijo con Cancelar / Guardar
+ * y manejo del envío asíncrono.
+ *
+ * El `<form>` vive en el cuerpo y el footer queda fuera de él en el DOM, así que el botón de envío
+ * se asocia con el atributo `form={formId}`: así `type="submit"` envía el form del cuerpo.
+ * Mientras `onSubmit` está pendiente: el footer se deshabilita, Guardar muestra un spinner con
+ * `aria-busy`, y se ignoran los cierres y los reenvíos.
+ */
+export declare const KapiCanvasForm: ({ onClose, children, onSubmit, onError, submitLabel, cancelLabel, submitDisabled, formId, closeOnBackdrop, closeOnEscape, ...offcanvas }: KapiCanvasFormProps) => import("react").JSX.Element;