@stackcraftmx/calcita 0.23.0 → 0.25.0

package/dist/types/inbox/MessageList.d.ts

@@ -1,12 +1,20 @@
 /**
  * @param {object} props
- * @param {Array<{id: string, from: {name: string, email: string}, subject: string, preview: string, receivedAt: string, isUnread?: boolean, isStarred?: boolean, hasAttachments?: boolean}>} props.messages
- * @param {string|null} [props.selectedId]
- * @param {(messageId: string) => void} props.onSelect
+ * @param {Array<{id: string, from: {name: string, email: string}, subject: string, preview: string, receivedAt: string, isUnread?: boolean, isStarred?: boolean, hasAttachments?: boolean, threadCount?: number, labels?: Array<string|{label: string, color?: string}>} & Record<string, any>>} props.messages
+ *     cada mensaje puede traer sus campos propios (llegan a renderMessage y a messageActions tal cual). threadCount: cuántos
+ *     mensajes trae la conversación (con 2 o más se pinta «(3)»); labels: texto o {label, color} del tema
+ * @param {string|null} [props.selectedId] el mensaje abierto
+ * @param {(messageId: string) => void} props.onSelect abrir un mensaje
  * @param {(messageId: string) => void} [props.onToggleStar]
+ * @param {string[]} [props.selectedIds] los elegidos para una acción en grupo
+ * @param {(messageIds: string[]) => void} [props.onSelectionChange] con él, cada mensaje se puede elegir picando su monograma
+ * @param {(message: any) => Array<{key: string, label: string, icon?: import('react').ReactNode, color?: string, disabled?: boolean, onClick: () => void}>} [props.messageActions]
+ *     las acciones del «⋯» de cada mensaje (archivar, posponer, mover…); sin ellas no hay «⋯»
+ * @param {(message: any) => import('react').ReactNode} [props.renderMessage] lo de adentro de cada renglón, a su manera
  * @param {string} [props.emptyText] ya traducido; por omisión el del paquete
+ * @param {object} [props.texts] los textos que cambian, con la forma de `inbox` en los textos del paquete
  */
-export default function MessageList({ messages, selectedId, onSelect, onToggleStar, emptyText }: {
+export default function MessageList({ messages, selectedId, onSelect, onToggleStar, selectedIds, onSelectionChange, messageActions, renderMessage, emptyText, texts, }: {
     messages: Array<{
         id: string;
         from: {
@@ -19,9 +27,26 @@ export default function MessageList({ messages, selectedId, onSelect, onToggleSt
         isUnread?: boolean;
         isStarred?: boolean;
         hasAttachments?: boolean;
-    }>;
+        threadCount?: number;
+        labels?: Array<string | {
+            label: string;
+            color?: string;
+        }>;
+    } & Record<string, any>>;
     selectedId?: string | null;
     onSelect: (messageId: string) => void;
     onToggleStar?: (messageId: string) => void;
+    selectedIds?: string[];
+    onSelectionChange?: (messageIds: string[]) => void;
+    messageActions?: (message: any) => Array<{
+        key: string;
+        label: string;
+        icon?: import('react').ReactNode;
+        color?: string;
+        disabled?: boolean;
+        onClick: () => void;
+    }>;
+    renderMessage?: (message: any) => import('react').ReactNode;
     emptyText?: string;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inbox/MessageView.d.ts

@@ -1,23 +1,55 @@
 /**
  * @param {object} props
- * @param {{subject: string, from: {name: string, email: string}, to?: string[], receivedAt: string, body: string, attachments?: Array<{name: string, size?: string}>}|null} props.message
- *     null: todavía no se elige ninguno
+ * @param {{id?: string, subject: string, from: {name: string, email: string}, to?: string[], cc?: string[], receivedAt: string, body: string, attachments?: Array<{name: string, size?: string} & Record<string, any>>, labels?: Array<string|{label: string, color?: string}>, thread?: Array<{id: string, from: {name: string, email: string}, to?: string[], cc?: string[], receivedAt: string, body: string, attachments?: Array<{name: string, size?: string}>}>}|null} props.message
+ *     el mensaje más nuevo de la conversación; thread: los anteriores, del más viejo al más nuevo (encogidos). null: todavía
+ *     no se elige ninguno
  * @param {import('react').ReactNode} [props.actions] los botones de arriba
+ * @param {import('react').ReactNode} [props.footer] lo de abajo (una respuesta rápida, firmas…)
+ * @param {(attachment: any, message: any) => void} [props.onAttachmentClick] al picar un archivo; sin él los archivos solo se ven
+ * @param {(threadMessageId: string) => void} [props.onExpand] al abrir un mensaje anterior de la conversación
+ * @param {(message: any) => import('react').ReactNode} [props.renderBody] el texto a su manera (HTML ya limpio por el proyecto)
+ * @param {object} [props.texts] los textos que cambian, con la forma de `inbox` en los textos del paquete
  */
-export default function MessageView({ message, actions }: {
+export default function MessageView({ message, actions, footer, onAttachmentClick, onExpand, renderBody, texts }: {
     message: {
+        id?: string;
         subject: string;
         from: {
             name: string;
             email: string;
         };
         to?: string[];
+        cc?: string[];
         receivedAt: string;
         body: string;
         attachments?: Array<{
             name: string;
             size?: string;
+        } & Record<string, any>>;
+        labels?: Array<string | {
+            label: string;
+            color?: string;
+        }>;
+        thread?: Array<{
+            id: string;
+            from: {
+                name: string;
+                email: string;
+            };
+            to?: string[];
+            cc?: string[];
+            receivedAt: string;
+            body: string;
+            attachments?: Array<{
+                name: string;
+                size?: string;
+            }>;
         }>;
     } | null;
     actions?: import('react').ReactNode;
+    footer?: import('react').ReactNode;
+    onAttachmentClick?: (attachment: any, message: any) => void;
+    onExpand?: (threadMessageId: string) => void;
+    renderBody?: (message: any) => import('react').ReactNode;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inbox/inboxDates.d.ts

@@ -1,6 +1,11 @@
 /**
  * @param {string} receivedAt el instante ISO
  * @param {Date} [now] para las pruebas; por omisión, ahora
+ * @param {{formatDate: Function, formatTime: Function}} [formatters] los de useFormatters (el proveedor más cercano); por
+ *     omisión los sueltos (el de la raíz)
  * @returns {string}
  */
-export declare function inboxDateOf(receivedAt: string, now?: Date): string;
+export declare function inboxDateOf(receivedAt: string, now?: Date, formatters?: {
+    formatDate: Function;
+    formatTime: Function;
+}): string;

package/dist/types/index.d.ts

@@ -1,12 +1,14 @@
 export { ToolkitProvider } from './toolkit/ToolkitProvider.js';
 export { useToolkitNavigation, useToolkitSettings } from './toolkit/toolkitContext.js';
 export { useToolkitTranslation } from './toolkit/useToolkitTranslation.js';
-export { DEFAULT_CURRENCY, DEFAULT_LANGUAGE, configureToolkit, toolkitSettings, translateToolkit } from './toolkit/toolkitSettings.js';
-export { browserNavigation } from './toolkit/browserNavigation.js';
+export { default as ComponentTexts } from './toolkit/ComponentTexts.js';
+export { DEFAULT_CURRENCY, DEFAULT_LANGUAGE, DEFAULT_LANGUAGES, configureToolkit, toolkitSettings, translateToolkit } from './toolkit/toolkitSettings.js';
+export { browserNavigation, createBrowserNavigation } from './toolkit/browserNavigation.js';
+export { createHashNavigation } from './toolkit/hashNavigation.js';
 export { default as toolkitTextsEs } from './locales/es.js';
 export { default as toolkitTextsEn } from './locales/en.js';
 export { ConfirmDialog, ModalWaiting, NEW_BUILD_NOTICE_VARIANT, NewBuildNotice, StaleBuildBoundary, TOAST_DEFAULT_OPTIONS, Toaster, confirmActionMachine, dismissToast, errorsObjectToMessage, toastDefault, toastError, toastInfo, toastLoading, toastProblem, toastPromise, toastSuccess, toastWarn, useConfirmAction, } from './feedback/index.js';
-export { DOWNLOAD_STATUS, DownloadManager, cancelDownload, clearFinishedDownloads, downloadsMachine, startDownload } from './downloads/index.js';
+export { DEFAULT_FILE_TYPES, DOWNLOAD_STATUS, DownloadManager, UNKNOWN_FILE_TYPE, cancelDownload, clearFinishedDownloads, downloadsMachine, startDownload, useFileTypes, } from './downloads/index.js';
 export { THEME_LOOK, TOP_BAR, createToolkitTheme } from './theme/createToolkitTheme.js';
 export { isAndroidDevice } from './theme/androidDevice.js';
 export { MINIMAL_BACKGROUND } from './theme/components/minimalComponents.js';
@@ -18,6 +20,9 @@ export { AppLayout, MENU_POSITION } from './appShell/AppLayout.js';
 export { AuthLayout } from './appShell/AuthLayout.js';
 export { default as BarActions } from './appShell/BarActions.js';
 export { default as BarActionButton } from './appShell/BarActionButton.js';
+export { default as BarSearch } from './appShell/BarSearch.js';
+export { default as ActionsMenu } from './ui/actions/ActionsMenu.js';
+export { SELECTION_PHONE_LAYOUT, default as SelectionActions, selectionFloatsOnPhone } from './ui/actions/SelectionActions.js';
 export { BAR_ACTIONS_PLACEMENT, useBarActionsPlacement, useCloseBarActionsMenu } from './appShell/barActionsSlot.js';
 export { BAR_CAPSULE_HEIGHT_PIXELS, default as BarCapsule } from './appShell/BarCapsule.js';
 export { usesMobileTabBar } from './appShell/tabBarRule.js';
@@ -42,19 +47,21 @@ export { default as FileDropzone } from './upload/FileDropzone.js';
 export { FILE_ACCEPT_PRESETS, FILE_REJECTION, matchesAccept, parseFileSize, resolveAccept } from './upload/fileRules.js';
 export { buildUploadActors, uploadMachine } from './upload/uploadMachine.js';
 export { uploadWithProgress } from './upload/uploadWithProgress.js';
-export { APP_BAR_HEIGHT_CSS_VARIABLE, BackButton, CalendarHeatmap, CollapsibleSection, ColorSchemeToggle, ContentDialog, CopyButton, DateRangeFilter, DefinitionList, DetailHeader, DictionaryText, DocumentTitle, DownloadMenu, FONT_SIZE_LEVELS, FontSizeToggle, FullPageLoader, GlassLensFilter, GlassPanel, LANGUAGES, LanguageToggle, MetricCard, PageBreadcrumbs, PageHeader, PageHeading, ProfileHeader, TREND_DIRECTION, PeriodRangeSelector, QuickFilters, SCROLL_MARGIN_BELOW_APP_BAR, SEGMENTED_CONTROL_SX, ScrollableRow, SecretField, SectionCard, SegmentedControl, StatusChip, TableToggle, Tag, scrollableRow, useAppBarHeightPublisher, } from './ui/index.js';
+export { APP_BAR_HEIGHT_CSS_VARIABLE, BackButton, CHART_VIEW, CalendarHeatmap, CollapsibleSection, ColorSchemeToggle, ContentDialog, CopyButton, DateRangeFilter, DefinitionList, DetailHeader, DictionaryText, DocumentTitle, DownloadMenu, FONT_SIZE_LEVELS, FontSizeToggle, FullPageLoader, GlassLensFilter, GlassPanel, LANGUAGES, LanguageToggle, MetricCard, PageBreadcrumbs, PageHeader, PageHeading, ProfileHeader, TREND_DIRECTION, PeriodRangeSelector, QuickFilters, SCROLL_MARGIN_BELOW_APP_BAR, SEGMENTED_CONTROL_SX, ScrollableRow, SecretField, SectionCard, SegmentedControl, StatusChip, TableToggle, Tag, scrollableRow, useAppBarHeightPublisher, } from './ui/index.js';
 export { default as CatalogInput } from './inputs/CatalogInput.js';
 export { default as ColorInput } from './inputs/ColorInput.js';
 export { default as FieldFrame } from './inputs/FieldFrame.js';
 export { FORM_ROW_CLASS, FormRow, default as FormSection } from './inputs/FormSection.js';
 export { default as NumberInput } from './inputs/NumberInput.js';
 export { default as SelectInput } from './inputs/SelectInput.js';
+export { default as WizardLayout } from './inputs/WizardLayout.js';
 export { default as TextInput } from './inputs/TextInput.js';
 export { HEX_COLOR, MIN_CONTRAST, contrastOnWhite, readableVariantOf } from './inputs/colorContrast.js';
 export { cleanNumberText, completeDecimals, groupThousands } from './inputs/numberText.js';
 export { translateValidationMessage } from './forms/validationMessages.js';
 export { dictionaryEntryOf, labelOf, lookup, shortLabelOf } from './dictionaries/dictionaries.js';
-export { dayOfPlainDate, formatCurrency, formatDate, formatDateTime, formatFileSize, formatList, formatMonthName, formatMonthShortName, formatNumber, formatPercent, formatTime, formatWeekdayShortName, } from './formatting.js';
+export { dayOfPlainDate, formatCurrency, formatDate, formatDateTime, formatFileSize, formatList, formatMonthName, formatMonthShortName, formatNumber, formatPercent, formatTime, formatWeekdayShortName, formattersOf, } from './formatting.js';
+export { useFormatters } from './toolkit/useFormatters.js';
 export { parseInstant, parsePlainDate } from './dates.js';
 export { fieldErrorsOf, problemMessage, problemTitle } from './problems.js';
 export { newIdentifier } from './identifiers.js';

package/dist/types/inputs/CatalogInput.d.ts

@@ -2,8 +2,8 @@
  * @param {object} props
  * @param {string} [props.name]
  * @param {string} props.label ya traducido
- * @param {string|null|undefined} props.value la clave elegida ('' = ninguna)
- * @param {(code: string) => void} props.onChange recibe la clave ('' al borrar)
+ * @param {string|string[]|null|undefined} props.value la clave elegida ('' = ninguna); con multiple, la lista ([] = ninguna)
+ * @param {(code: any) => void} props.onChange recibe la clave ('' al borrar); con multiple, la lista de claves
  * @param {() => void} [props.onBlur]
  * @param {Array<{code: string, label: string}>} props.options
  * @param {(option: {code: string, label: string}) => string} [props.formatLabel] por omisión «Nombre (clave)»
@@ -14,12 +14,14 @@
  *     formulario agrupado el campo vacío solo enseña su botón y no se entiende qué es
  * @param {boolean} [props.disabled]
  * @param {import('react').Ref<HTMLInputElement>} [props.inputRef]
+ * @param {boolean} [props.multiple] elegir varias claves
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
  */
-export default function CatalogInput({ name, label, value, onChange, onBlur, options, formatLabel, error, helperText, loading, disabled, inputRef, placeholder, }: {
+export default function CatalogInput({ name, label, value, onChange, onBlur, options, formatLabel, error, helperText, loading, disabled, inputRef, placeholder, multiple, texts, }: {
     name?: string;
     label: string;
-    value: string | null | undefined;
-    onChange: (code: string) => void;
+    value: string | string[] | null | undefined;
+    onChange: (code: any) => void;
     onBlur?: () => void;
     options: Array<{
         code: string;
@@ -38,4 +40,6 @@ export default function CatalogInput({ name, label, value, onChange, onBlur, opt
     placeholder?: string;
     disabled?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
+    multiple?: boolean;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inputs/ColorInput.d.ts

@@ -10,8 +10,9 @@
  * @param {boolean} [props.checkContrast] avisa si casi no se lee sobre blanco (por omisión sí)
  * @param {boolean} [props.disabled]
  * @param {import('react').Ref<HTMLInputElement>} [props.inputRef]
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
  */
-export default function ColorInput({ name, label, value, onChange, onBlur, error, helperText, checkContrast, disabled, inputRef, }: {
+export default function ColorInput({ name, label, value, onChange, onBlur, error, helperText, checkContrast, disabled, inputRef, texts, }: {
     name?: string;
     label: string;
     value: string | null | undefined;
@@ -25,4 +26,5 @@ export default function ColorInput({ name, label, value, onChange, onBlur, error
     checkContrast?: boolean;
     disabled?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inputs/FormSection.d.ts

@@ -1,4 +1,4 @@
-/** La clase de cada renglón: la sección dibuja la línea entre dos renglones seguidos. */
+/** La clase de cada renglón: la sección le dibuja su línea de arriba, esté donde esté adentro de la tarjeta. */
 export declare const FORM_ROW_CLASS = "calcita-form-row";
 /**
  * Un renglón del formulario agrupado: la etiqueta a la izquierda y lo que sea a la derecha (un campo, un interruptor, un
@@ -20,7 +20,7 @@ export declare function FormRow({ label, htmlFor, labelId, children }: {
  * @param {object} props
  * @param {string} [props.title] ya traducido; va arriba de la tarjeta
  * @param {import('react').ReactNode} [props.footer] la explicación, abajo de la tarjeta
- * @param {import('react').ReactNode} props.children los campos, directo (ver el OJO de arriba)
+ * @param {import('react').ReactNode} props.children los campos, directo o dentro de un Grid, un Stack o un componente propio
  */
 export default function FormSection({ title, footer, children }: {
     title?: string;

package/dist/types/inputs/NumberInput.d.ts

@@ -14,8 +14,9 @@
  * @param {number} [props.maxDigits] tope de dígitos (por omisión 17)
  * @param {boolean} [props.disabled]
  * @param {import('react').Ref<HTMLInputElement>} [props.inputRef]
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
  */
-export default function NumberInput({ name, label, value, onChange, onBlur, error, helperText, decimals, allowNegative, prefix, suffix, maxDigits, disabled, inputRef, }: {
+export default function NumberInput({ name, label, value, onChange, onBlur, error, helperText, decimals, allowNegative, prefix, suffix, maxDigits, disabled, inputRef, texts, }: {
     name?: string;
     label: string;
     value: string | number | null | undefined;
@@ -33,4 +34,5 @@ export default function NumberInput({ name, label, value, onChange, onBlur, erro
     maxDigits?: number;
     disabled?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inputs/SelectInput.d.ts

@@ -2,8 +2,8 @@
  * @param {object} props
  * @param {string} [props.name]
  * @param {string} props.label ya traducido
- * @param {string|number|null|undefined} props.value '' = sin elegir
- * @param {(value: string|number) => void} props.onChange recibe el valor elegido, no el evento
+ * @param {string|number|Array<string|number>|null|undefined} props.value '' = sin elegir; con multiple, la lista ([] = ninguna)
+ * @param {(value: any) => void} props.onChange recibe el valor elegido (con multiple, la lista), no el evento
  * @param {() => void} [props.onBlur]
  * @param {Array<{value: string|number, label: string, description?: string}>} props.options
  * @param {string|{key: string, values?: object}} [props.error]
@@ -11,12 +11,14 @@
  * @param {string} [props.placeholder] texto de la opción vacía
  * @param {boolean} [props.disabled]
  * @param {import('react').Ref<HTMLInputElement>} [props.inputRef]
+ * @param {boolean} [props.multiple] elegir varias opciones
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
  */
-export default function SelectInput({ name, label, value, onChange, onBlur, options, error, helperText, placeholder, disabled, inputRef, }: {
+export default function SelectInput({ name, label, value, onChange, onBlur, options, error, helperText, placeholder, disabled, inputRef, multiple, texts, }: {
     name?: string;
     label: string;
-    value: string | number | null | undefined;
-    onChange: (value: string | number) => void;
+    value: string | number | Array<string | number> | null | undefined;
+    onChange: (value: any) => void;
     onBlur?: () => void;
     options: Array<{
         value: string | number;
@@ -31,4 +33,6 @@ export default function SelectInput({ name, label, value, onChange, onBlur, opti
     placeholder?: string;
     disabled?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
+    multiple?: boolean;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inputs/TextInput.d.ts

@@ -26,8 +26,9 @@
  * @param {string} [props.id]
  * @param {object} [props.slotProps]
  * @param {object} [props.sx]
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common` en los textos del paquete
  */
-export default function TextInput({ name, label, value, onChange, onBlur, error, type, helperText, startAdornment, endAdornment: customEndAdornment, uppercase, normalizeOnBlur, inputRef, clearable, ...textFieldProps }: {
+export default function TextInput({ name, label, value, onChange, onBlur, error, type, helperText, startAdornment, endAdornment: customEndAdornment, uppercase, normalizeOnBlur, inputRef, clearable, texts, ...textFieldProps }: {
     name?: string;
     label: string;
     value: string | null | undefined;
@@ -57,4 +58,5 @@ export default function TextInput({ name, label, value, onChange, onBlur, error,
     id?: string;
     slotProps?: object;
     sx?: object;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/inputs/WizardLayout.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @param {object} props
+ * @param {Object[]} props.steps en orden
+ * @param {string} props.steps[].key
+ * @param {string} props.steps[].label ya traducido
+ * @param {boolean} [props.steps[].optional] se puede omitir
+ * @param {import('react').ReactNode} props.steps[].content los campos del paso
+ * @param {number} props.activeIndex el paso que se ve
+ * @param {Set<string>} props.skippedKeys los pasos omitidos
+ * @param {boolean} [props.isSubmitting] mientras se envía, «Anterior» se apaga
+ * @param {() => void} props.onBack
+ * @param {() => void} props.onNext
+ * @param {() => void} props.onSkip
+ * @param {import('react').ReactNode} props.submitButton el botón de enviar del último paso
+ * @param {import('react').ReactNode} [props.problemAlert] el aviso de errores del servidor, arriba de los botones del último paso
+ * @param {object} [props.texts] los textos que cambian, con la forma de `common`: {wizard: {next, back, skip, optional, skipped, stepOf}}
+ */
+export default function WizardLayout({ steps, activeIndex, skippedKeys, isSubmitting, onBack, onNext, onSkip, submitButton, problemAlert, texts, }: {
+    steps: {
+        key: string;
+        label: string;
+        optional?: boolean;
+        content: import('react').ReactNode;
+    }[];
+    activeIndex: number;
+    skippedKeys: Set<string>;
+    isSubmitting?: boolean;
+    onBack: () => void;
+    onNext: () => void;
+    onSkip: () => void;
+    submitButton: import('react').ReactNode;
+    problemAlert?: import('react').ReactNode;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/kanban/KanbanBoard.d.ts

@@ -1,26 +1,58 @@
 /**
  * @param {object} props
- * @param {Array<{id: string, title: string, limit?: number}>} props.columns en su orden
- * @param {Array<{id: string, columnId: string, title: string, description?: string, tags?: string[]}>} props.cards el orden
- *     de cada columna es el orden en este arreglo
+ * @param {Array<{id: string, title: string, limit?: number, count?: number, collapsible?: boolean, defaultCollapsed?: boolean}>} props.columns
+ *     en su orden. count: cuántas tarjetas tiene de verdad cuando la pantalla le pasa solo las filtradas (el tope se cuenta
+ *     contra todas). collapsible: lleva su botón para encogerse (el congelador); defaultCollapsed: empieza encogida
+ * @param {Array<{id: string, columnId: string, title: string, completed?: boolean, description?: string, tags?: Array<string|{label: string, color?: string}>, assignees?: Array<{id: string, name: string, avatarUrl?: string}>, dueDate?: string, checklist?: {done: number, total: number}, comments?: number, attachments?: number} & Record<string, any>>} props.cards
+ *     el orden de cada columna es el orden en este arreglo; cada tarjeta puede traer sus campos propios (llegan a renderCard,
+ *     a cardActions y a onCardClick tal cual). dueDate: AAAA-MM-DD
  * @param {(move: {cardId: string, fromColumnId: string, toColumnId: string, toIndex: number}) => void} props.onMove
  * @param {(card: any) => import('react').ReactNode} [props.renderCard] lo de adentro de cada tarjeta (recibe la tarjeta de cards)
  * @param {(cardId: string) => void} [props.onCardClick]
+ * @param {(newCard: {columnId: string, title: string}) => void} [props.onAddCard] con él cada columna lleva su «+» para agregar
+ *     escribiendo el título
+ * @param {(card: any) => Array<{key: string, label: string, icon?: import('react').ReactNode, color?: string, disabled?: boolean, onClick: () => void}>} [props.cardActions]
+ *     las acciones del «⋯» de cada tarjeta (editar, asignarme, borrar…); sin ellas no hay «⋯»
+ * @param {(column: any) => Array<{key: string, label: string, icon?: import('react').ReactNode, color?: string, disabled?: boolean, onClick: () => void}>} [props.columnActions]
+ *     las acciones del «⋯» de cada columna (renombrar, limpiar…)
+ * @param {(card: any, completed: boolean) => void} [props.onCardComplete] con él cada tarjeta lleva su círculo para terminarla
+ *     (completed true) o reabrirla (false); la pantalla decide qué más pasa (moverla a «Listo», guardar la fecha)
+ * @param {(columnId: string, collapsed: boolean) => void} [props.onColumnCollapse] cada que una columna se encoge o se abre
  * @param {string} props.ariaLabel ya traducido
+ * @param {object} [props.texts] los textos que cambian, con la forma de `kanban` en los textos del paquete
  */
-export default function KanbanBoard({ columns, cards, onMove, renderCard, onCardClick, ariaLabel }: {
+export default function KanbanBoard({ columns, cards, onMove, renderCard, onCardClick, onAddCard, cardActions, columnActions, onCardComplete, onColumnCollapse, ariaLabel, texts, }: {
     columns: Array<{
         id: string;
         title: string;
         limit?: number;
+        count?: number;
+        collapsible?: boolean;
+        defaultCollapsed?: boolean;
     }>;
     cards: Array<{
         id: string;
         columnId: string;
         title: string;
+        completed?: boolean;
         description?: string;
-        tags?: string[];
-    }>;
+        tags?: Array<string | {
+            label: string;
+            color?: string;
+        }>;
+        assignees?: Array<{
+            id: string;
+            name: string;
+            avatarUrl?: string;
+        }>;
+        dueDate?: string;
+        checklist?: {
+            done: number;
+            total: number;
+        };
+        comments?: number;
+        attachments?: number;
+    } & Record<string, any>>;
     onMove: (move: {
         cardId: string;
         fromColumnId: string;
@@ -29,5 +61,28 @@ export default function KanbanBoard({ columns, cards, onMove, renderCard, onCard
     }) => void;
     renderCard?: (card: any) => import('react').ReactNode;
     onCardClick?: (cardId: string) => void;
+    onAddCard?: (newCard: {
+        columnId: string;
+        title: string;
+    }) => void;
+    cardActions?: (card: any) => Array<{
+        key: string;
+        label: string;
+        icon?: import('react').ReactNode;
+        color?: string;
+        disabled?: boolean;
+        onClick: () => void;
+    }>;
+    columnActions?: (column: any) => Array<{
+        key: string;
+        label: string;
+        icon?: import('react').ReactNode;
+        color?: string;
+        disabled?: boolean;
+        onClick: () => void;
+    }>;
+    onCardComplete?: (card: any, completed: boolean) => void;
+    onColumnCollapse?: (columnId: string, collapsed: boolean) => void;
     ariaLabel: string;
+    texts?: object;
 }): import("react").JSX.Element;

package/dist/types/kanban/kanbanCards.d.ts

@@ -0,0 +1,22 @@
+/** Cómo va la fecha límite de una tarjeta. */
+export declare const DUE_STATUS: Readonly<{
+    overdue: "overdue";
+    today: "today";
+    upcoming: "upcoming";
+}>;
+/**
+ * El día de hoy como AAAA-MM-DD en la zona de este navegador (la fecha límite es un día, no un instante).
+ *
+ * @param {Date} [now]
+ * @returns {string}
+ */
+export declare function todayIsoDateOf(now?: Date): string;
+/**
+ * Cómo va una fecha límite contra hoy. AAAA-MM-DD se compara bien como texto.
+ *
+ * @param {string|null|undefined} dueDate AAAA-MM-DD
+ * @param {string} today AAAA-MM-DD
+ * @returns {'overdue'|'today'|'upcoming'|null} null sin fecha
+ */
+export declare function dueStatusOf(dueDate: string | null | undefined, today: string): 'overdue' | 'today' | 'upcoming' | null;
+export { tagOf } from '../ui/labels/tagOf.js';

package/dist/types/kanban.d.ts

@@ -1,2 +1,3 @@
 export { default as KanbanBoard } from './kanban/KanbanBoard.js';
 export { cardsOfColumn, isOverLimit, moveCard } from './kanban/kanbanMoves.js';
+export { DUE_STATUS, dueStatusOf, tagOf, todayIsoDateOf } from './kanban/kanbanCards.js';

package/dist/types/locales/en.d.ts

@@ -38,6 +38,20 @@ declare const _default: Readonly<{
             descending: string;
             clear: string;
         };
+        selection: {
+            count_one: string;
+            count_other: string;
+            allMatching: string;
+            allMatchingCapped: string;
+            pageSelected_one: string;
+            pageSelected_other: string;
+            selectAllMatching: string;
+            selectAllMatchingCapped: string;
+            onlyThisPage: string;
+            clear: string;
+            summaryLabel: string;
+            actionsLabel: string;
+        };
         goToPage: {
             page: string;
             of_one: string;
@@ -110,6 +124,11 @@ declare const _default: Readonly<{
             colorLowContrast: string;
             colorUseSuggestion: string;
         };
+        selection: {
+            clear: string;
+            actionsLabel: string;
+            summaryLabel: string;
+        };
         wizard: {
             next: string;
             back: string;
@@ -123,6 +142,8 @@ declare const _default: Readonly<{
                 es: string;
                 en: string;
             };
+            switchToNamed: string;
+            choose: string;
         };
         colorScheme: {
             label: string;
@@ -259,6 +280,7 @@ declare const _default: Readonly<{
         };
         charts: {
             viewAsTable: string;
+            legend: string;
             viewAsChart: string;
             less: string;
             more: string;
@@ -612,6 +634,33 @@ declare const _default: Readonly<{
         };
     };
     calendar: {
+        details: {
+            when: string;
+            timeRange: string;
+            allDay: string;
+            location: string;
+            meeting: string;
+            join: string;
+            attendees: string;
+            attendeesCount_one: string;
+            attendeesCount_other: string;
+            response: {
+                accepted: string;
+                declined: string;
+                pending: string;
+            };
+            reminder: string;
+            reminderUnit: {
+                atStart: string;
+                minutes_one: string;
+                minutes_other: string;
+                hours_one: string;
+                hours_other: string;
+                days_one: string;
+                days_other: string;
+            };
+            notes: string;
+        };
         previous: string;
         next: string;
         today: string;
@@ -624,15 +673,43 @@ declare const _default: Readonly<{
         };
     };
     kanban: {
+        dueCompleted: string;
+        complete: string;
+        reopen: string;
+        completed: string;
+        collapseColumn: string;
+        expandColumn: string;
+        addCard: string;
+        addCardPlaceholder: string;
+        cardActions: string;
+        columnActions: string;
+        dueOverdue: string;
+        dueToday: string;
+        dueOn: string;
+        checklist: string;
+        comments_one: string;
+        comments_other: string;
+        attachments_one: string;
+        attachments_other: string;
+        assignees: string;
         instructions: string;
         lifted: string;
         moving: string;
         dropped: string;
         cancelled: string;
         overLimit: string;
+        emptyFiltered: string;
         empty: string;
     };
     inbox: {
+        labels: string;
+        select: string;
+        messageActions: string;
+        threadCount_one: string;
+        threadCount_other: string;
+        cc: string;
+        openAttachment: string;
+        expandMessage: string;
         listLabel: string;
         folders: string;
         empty: string;