@stackcraftmx/calcita 0.0.0-stage → 0.25.0

package/dist/types/forms/serverProblemFields.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @param {Record<string, string[]>} errorsByField lo que regresa fieldErrorsOf(problem)
+ * @param {string[]} formFieldNames campos del formulario (Object.keys de sus valores iniciales)
+ * @returns {{fieldErrors: Record<string, string>, unassignedMessages: string[]}}
+ */
+export declare function splitServerFieldErrors(errorsByField: Record<string, string[]>, formFieldNames: string[]): {
+    fieldErrors: Record<string, string>;
+    unassignedMessages: string[];
+};
+/**
+ * Mensaje del aviso de arriba: lo que quedó sin campo, o el mensaje general si el error no trae errores por campo.
+ * Si todo cayó en sus campos, no se repite arriba (null).
+ *
+ * @param {Record<string, string[]>} errorsByField
+ * @param {string[]} formFieldNames
+ * @param {string|null|undefined} generalMessage el message del ApiError (ya traducido)
+ * @returns {string|null}
+ */
+export declare function formLevelMessageOf(errorsByField: Record<string, string[]>, formFieldNames: string[], generalMessage: string | null | undefined): string | null;

package/dist/types/forms/useFormikField.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @param {string} name el campo del formulario
+ * @returns {{name: string, value: unknown, onChange: (value: unknown) => void, onBlur: () => void, error: unknown}}
+ */
+export declare function useFormikField(name: string): {
+    name: string;
+    value: unknown;
+    onChange: (value: unknown) => void;
+    onBlur: () => void;
+    error: unknown;
+};

package/dist/types/forms/validation.d.ts

@@ -0,0 +1,251 @@
+import * as Yup from 'yup';
+/** El locale de yup: cada mensaje por defecto es una llave del namespace validation. */
+export declare const YUP_LOCALE: Readonly<{
+    mixed: {
+        default: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        required: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        defined: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        notNull: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        notType: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        oneOf: ({ values }: {
+            values: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        notOneOf: ({ values }: {
+            values: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+    };
+    string: {
+        length: ({ length }: {
+            length: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        min: ({ min }: {
+            min: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        max: ({ max }: {
+            max: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        matches: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        email: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        url: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        uuid: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        trim: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        lowercase: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        uppercase: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+    };
+    number: {
+        min: ({ min }: {
+            min: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        max: ({ max }: {
+            max: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        lessThan: ({ less }: {
+            less: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        moreThan: ({ more }: {
+            more: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        positive: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        negative: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        integer: {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+    };
+    date: {
+        min: ({ min }: {
+            min: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        max: ({ max }: {
+            max: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+    };
+    array: {
+        min: ({ min }: {
+            min: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        max: ({ max }: {
+            max: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+        length: ({ length }: {
+            length: any;
+        }) => {
+            key: string;
+            values?: undefined;
+        } | {
+            key: string;
+            values: any;
+        };
+    };
+}>;
+/**
+ * Instala el locale de llaves en yup. Se llama una vez en la entrada de la aplicación, antes del primer esquema.
+ */
+export declare function buildYupLocale(): void;
+export { Yup };
+export { translateValidationMessage } from './validationMessages.js';

package/dist/types/forms/validationMessages.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Texto de un error de validación en el idioma activo.
+ * Acepta las dos formas que llegan: {key, values} de yup (buildYupLocale), o un texto ya traducido (los del backend).
+ *
+ * @param {(key: string, values?: object) => string} translate el t de useToolkitTranslation
+ * @param {string|{key: string, values?: object}|undefined|null} error
+ * @returns {string|undefined}
+ */
+export declare function translateValidationMessage(translate: (key: string, values?: object) => string, error: string | {
+    key: string;
+    values?: object;
+} | undefined | null): string | undefined;

package/dist/types/forms.d.ts

@@ -0,0 +1,2 @@
+export { FieldArray, Form, Formik, useField, useFormikContext } from 'formik';
+export { ChangePasswordForm, ForgotPasswordForm, FormCatalogField, FormColorField, FormNumberField, FormProblemAlert, FormSelectField, FormServerProblem, FormTextField, FormWizard, RECOVERY_CODE_PATTERN, SECOND_STEP_METHOD, SecondStepForm, SignInForm, SubmitButton, TOTP_CODE_PATTERN, TwoStepVerificationCard, Yup, applyServerProblem, buildYupLocale, formLevelMessageOf, normalizeRecoveryCode, normalizeTotpCode, splitServerFieldErrors, translateValidationMessage, useFormikField, } from './forms/index.js';

package/dist/types/hookForm/FormCatalogField.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/CatalogInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
+ *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ */
+export default function FormCatalogField({ name, control, ...inputProps }: {
+    name: string;
+    control?: object;
+} & Omit<Parameters<typeof import('../inputs/CatalogInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;

package/dist/types/hookForm/FormColorField.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/ColorInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
+ *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ */
+export default function FormColorField({ name, control, ...inputProps }: {
+    name: string;
+    control?: object;
+} & Omit<Parameters<typeof import('../inputs/ColorInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;

package/dist/types/hookForm/FormNumberField.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/NumberInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
+ *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ */
+export default function FormNumberField({ name, control, ...inputProps }: {
+    name: string;
+    control?: object;
+} & Omit<Parameters<typeof import('../inputs/NumberInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;

package/dist/types/hookForm/FormProblemAlert.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @param {{control?: object, sx?: object}} props control: el de useForm, si la pantalla no usa FormProvider
+ */
+export default function FormProblemAlert({ control, sx }: {
+    control?: object;
+    sx?: object;
+}): import("react").JSX.Element | null;

package/dist/types/hookForm/FormSelectField.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/SelectInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
+ *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ */
+export default function FormSelectField({ name, control, ...inputProps }: {
+    name: string;
+    control?: object;
+} & Omit<Parameters<typeof import('../inputs/SelectInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;

package/dist/types/hookForm/FormTextField.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
+ *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ */
+export default function FormTextField({ name, control, ...inputProps }: {
+    name: string;
+    control?: object;
+} & Omit<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;

package/dist/types/hookForm/FormWizard.d.ts

@@ -0,0 +1,22 @@
+/**
+ * @param {object} props
+ * @param {Object[]} props.steps en orden
+ * @param {string} props.steps[].key
+ * @param {string} props.steps[].label ya traducido
+ * @param {string[]} [props.steps[].fields] los campos del paso (los que revisa «Siguiente»)
+ * @param {boolean} [props.steps[].optional] se puede omitir
+ * @param {import('react').ReactNode} props.steps[].content los campos del paso
+ * @param {string} props.submitLabel ya traducido: el botón 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 FormWizard({ steps, submitLabel, texts }: {
+    steps: {
+        key: string;
+        label: string;
+        fields?: string[];
+        optional?: boolean;
+        content: import('react').ReactNode;
+    }[];
+    submitLabel: string;
+    texts?: object;
+}): import("react").JSX.Element;

package/dist/types/hookForm/SubmitButton.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @param {object} props
+ * @param {import('react').ReactNode} props.children
+ * @param {boolean} [props.disabled]
+ * @param {boolean} [props.isPending] cuando el envío lo lleva una máquina de estados y no el handleSubmit
+ * @param {object} [props.control] el de useForm, si la pantalla no usa FormProvider
+ * @param {object} [props.sx] (y lo demás del Button de MUI: size, fullWidth, startIcon…)
+ * @param {'small'|'medium'|'large'} [props.size]
+ * @param {boolean} [props.fullWidth]
+ * @param {import('react').ReactNode} [props.startIcon]
+ */
+export default function SubmitButton({ children, disabled, isPending, control, ...buttonProps }: {
+    children: import('react').ReactNode;
+    disabled?: boolean;
+    isPending?: boolean;
+    control?: object;
+    sx?: object;
+    size?: 'small' | 'medium' | 'large';
+    fullWidth?: boolean;
+    startIcon?: import('react').ReactNode;
+}): import("react").JSX.Element;

package/dist/types/hookForm/applyServerProblem.d.ts

@@ -0,0 +1,10 @@
+/** Dónde queda el aviso de arriba en los errores de react-hook-form. */
+export declare const SERVER_PROBLEM_ROOT = "root.server";
+/**
+ * @param {unknown} error normalmente un ApiError (trae problem y message ya traducidos)
+ * @param {{setError: Function, getValues: Function}} form lo que regresa useForm
+ */
+export declare function applyServerProblem(error: unknown, { setError, getValues }: {
+    setError: Function;
+    getValues: Function;
+}): void;

package/dist/types/hookForm/useHookFormField.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @param {string} name el campo del formulario
+ * @param {object} [control] el de useForm, si la pantalla no usa FormProvider
+ * @returns {{name: string, value: unknown, onChange: (value: unknown) => void, onBlur: () => void, inputRef: Function, error: unknown}}
+ */
+export declare function useHookFormField(name: string, control?: object): {
+    name: string;
+    value: unknown;
+    onChange: (value: unknown) => void;
+    onBlur: () => void;
+    inputRef: Function;
+    error: unknown;
+};

package/dist/types/i18next.d.ts

@@ -0,0 +1 @@
+export { translateWithI18next } from './adapters/i18next.js';

package/dist/types/identifiers.d.ts

@@ -0,0 +1,2 @@
+/** Un UUID v7 nuevo, p. ej. para una llave de idempotencia o una fila temporal. */
+export declare function newIdentifier(): string;

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

@@ -0,0 +1,38 @@
+/**
+ * @param {object} props
+ * @param {Array<{id: string, label: string, Icon?: import('react').ElementType, unreadCount?: number}>} props.folders
+ * @param {Array<{id: string, label: string, color?: string, unreadCount?: number}>} [props.labels] las etiquetas, debajo de las
+ *     carpetas con su punto de color (un color del tema); su id no debe repetir el de una carpeta
+ * @param {string} props.selectedFolderId la carpeta o etiqueta elegida
+ * @param {(folderId: string) => void} props.onSelectFolder
+ * @param {import('react').ReactNode} [props.toolbar] arriba de la lista (buscar, redactar)
+ * @param {import('react').ReactNode} props.list normalmente MessageList
+ * @param {import('react').ReactNode} props.detail normalmente MessageView
+ * @param {boolean} [props.isDetailOpen] en el teléfono, se ve la lectura en lugar de la lista
+ * @param {() => void} [props.onCloseDetail] «Regresar» del teléfono
+ * @param {import('react').ReactNode} [props.foldersHeader] arriba de las carpetas en escritorio (un botón «Redactar»)
+ * @param {object} [props.texts] los textos que cambian, con la forma de `inbox` en los textos del paquete
+ */
+export default function InboxLayout({ folders, labels, selectedFolderId, onSelectFolder, toolbar, list, detail, isDetailOpen, onCloseDetail, foldersHeader, texts, }: {
+    folders: Array<{
+        id: string;
+        label: string;
+        Icon?: import('react').ElementType;
+        unreadCount?: number;
+    }>;
+    labels?: Array<{
+        id: string;
+        label: string;
+        color?: string;
+        unreadCount?: number;
+    }>;
+    selectedFolderId: string;
+    onSelectFolder: (folderId: string) => void;
+    toolbar?: import('react').ReactNode;
+    list: import('react').ReactNode;
+    detail: import('react').ReactNode;
+    isDetailOpen?: boolean;
+    onCloseDetail?: () => void;
+    foldersHeader?: import('react').ReactNode;
+    texts?: object;
+}): import("react").JSX.Element;

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

@@ -0,0 +1,52 @@
+/**
+ * @param {object} props
+ * @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, selectedIds, onSelectionChange, messageActions, renderMessage, emptyText, texts, }: {
+    messages: 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>>;
+    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

@@ -0,0 +1,55 @@
+/**
+ * @param {object} props
+ * @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, 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

@@ -0,0 +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, formatters?: {
+    formatDate: Function;
+    formatTime: Function;
+}): string;