@stackcraftmx/calcita 0.0.0-stage → 0.23.0

package/dist/types/forms/security/TwoStepVerificationCard.d.ts

@@ -0,0 +1,81 @@
+/**
+ * @param {object} props
+ * @param {{isEnabled: boolean, enabledAt?: string|null, passkeys: Array<{id: string, name: string, createdAt: string, lastUsedAt?: string|null}>, totp: {isEnabled: boolean, enabledAt?: string|null}, recoveryCodesRemaining: number}} props.security
+ * @param {(security: {isEnabled: boolean, enabledAt?: string|null, passkeys: Array<{id: string, name: string, createdAt: string, lastUsedAt?: string|null}>, totp: {isEnabled: boolean, enabledAt?: string|null}, recoveryCodesRemaining: number}) => void} props.onSecurityChange
+ * @param {object} props.actions lo que hace el proyecto en cada caso; cada una regresa {security, recoveryCodes?}
+ * @param {(name: string) => Promise<{security: object, recoveryCodes?: string[]}>} props.actions.addPasskey crea la llave
+ *     (createPasskey) y la guarda en el servidor
+ * @param {(passkey: {id: string, name: string}, password: string) => Promise<{security: object}>} props.actions.removePasskey
+ * @param {() => Promise<{secret: string, qrImageUrl: string, extra?: import('react').ReactNode}>} props.actions.startTotp
+ *     la clave y su QR; extra va abajo del campo (p. ej. un atajo de los ejemplos)
+ * @param {(code: string) => Promise<{security: object, recoveryCodes?: string[]}>} props.actions.confirmTotp
+ * @param {(password: string) => Promise<{security: object}>} props.actions.disableTotp
+ * @param {(password: string) => Promise<{security: object, recoveryCodes: string[]}>} props.actions.regenerateRecoveryCodes
+ * @param {boolean} [props.canUsePasskeys] passkeysSupported() de /passkeys; sin él no se ofrece agregar llaves
+ * @param {string} [props.account] la cuenta (el correo), para el archivo de los códigos
+ * @param {import('react').ReactNode} [props.passkeyNotice] un aviso en el diálogo de crear la llave, antes de que el
+ *     navegador la guarde (p. ej. el de la demostración: la llave queda de verdad en el llavero de la persona)
+ */
+export default function TwoStepVerificationCard({ security, onSecurityChange, actions, canUsePasskeys, account, passkeyNotice }: {
+    security: {
+        isEnabled: boolean;
+        enabledAt?: string | null;
+        passkeys: Array<{
+            id: string;
+            name: string;
+            createdAt: string;
+            lastUsedAt?: string | null;
+        }>;
+        totp: {
+            isEnabled: boolean;
+            enabledAt?: string | null;
+        };
+        recoveryCodesRemaining: number;
+    };
+    onSecurityChange: (security: {
+        isEnabled: boolean;
+        enabledAt?: string | null;
+        passkeys: Array<{
+            id: string;
+            name: string;
+            createdAt: string;
+            lastUsedAt?: string | null;
+        }>;
+        totp: {
+            isEnabled: boolean;
+            enabledAt?: string | null;
+        };
+        recoveryCodesRemaining: number;
+    }) => void;
+    actions: {
+        addPasskey: (name: string) => Promise<{
+            security: object;
+            recoveryCodes?: string[];
+        }>;
+        removePasskey: (passkey: {
+            id: string;
+            name: string;
+        }, password: string) => Promise<{
+            security: object;
+        }>;
+        startTotp: () => Promise<{
+            secret: string;
+            qrImageUrl: string;
+            extra?: import('react').ReactNode;
+        }>;
+        confirmTotp: (code: string) => Promise<{
+            security: object;
+            recoveryCodes?: string[];
+        }>;
+        disableTotp: (password: string) => Promise<{
+            security: object;
+        }>;
+        regenerateRecoveryCodes: (password: string) => Promise<{
+            security: object;
+            recoveryCodes: string[];
+        }>;
+    };
+    canUsePasskeys?: boolean;
+    account?: string;
+    passkeyNotice?: import('react').ReactNode;
+}): import("react").JSX.Element;

package/dist/types/forms/security/securityRules.d.ts

@@ -0,0 +1,24 @@
+export declare const TOTP_CODE_MIN_LENGTH = 6;
+export declare const TOTP_CODE_MAX_LENGTH = 7;
+export declare const RECOVERY_CODE_MIN_LENGTH = 10;
+export declare const RECOVERY_CODE_MAX_LENGTH = 11;
+export declare const PASSKEY_NAME_MAX_LENGTH = 60;
+export declare const CURRENT_PASSWORD_MAX_LENGTH = 128;
+/** «123456» o «123 456». */
+export declare const TOTP_CODE_PATTERN: RegExp;
+/** «ABCDE-FGHJK» o «ABCDEFGHJK». */
+export declare const RECOVERY_CODE_PATTERN: RegExp;
+/**
+ * El código de la app como lo espera el servidor: los 6 dígitos sin espacios.
+ *
+ * @param {string} code
+ * @returns {string}
+ */
+export declare function normalizeTotpCode(code: string): string;
+/**
+ * El código de recuperación como lo espera el servidor: en mayúsculas y con su guion (ABCDE-FGHJK).
+ *
+ * @param {string} code
+ * @returns {string}
+ */
+export declare function normalizeRecoveryCode(code: string): string;

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/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,26 @@
+/**
+ * @param {object} props
+ * @param {Array<{id: string, label: string, Icon?: import('react').ElementType, unreadCount?: number}>} props.folders
+ * @param {string} props.selectedFolderId
+ * @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
+ */
+export default function InboxLayout({ folders, selectedFolderId, onSelectFolder, toolbar, list, detail, isDetailOpen, onCloseDetail }: {
+    folders: Array<{
+        id: string;
+        label: string;
+        Icon?: import('react').ElementType;
+        unreadCount?: number;
+    }>;
+    selectedFolderId: string;
+    onSelectFolder: (folderId: string) => void;
+    toolbar?: import('react').ReactNode;
+    list: import('react').ReactNode;
+    detail: import('react').ReactNode;
+    isDetailOpen?: boolean;
+    onCloseDetail?: () => void;
+}): import("react").JSX.Element;

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

@@ -0,0 +1,27 @@
+/**
+ * @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 {(messageId: string) => void} [props.onToggleStar]
+ * @param {string} [props.emptyText] ya traducido; por omisión el del paquete
+ */
+export default function MessageList({ messages, selectedId, onSelect, onToggleStar, emptyText }: {
+    messages: Array<{
+        id: string;
+        from: {
+            name: string;
+            email: string;
+        };
+        subject: string;
+        preview: string;
+        receivedAt: string;
+        isUnread?: boolean;
+        isStarred?: boolean;
+        hasAttachments?: boolean;
+    }>;
+    selectedId?: string | null;
+    onSelect: (messageId: string) => void;
+    onToggleStar?: (messageId: string) => void;
+    emptyText?: string;
+}): import("react").JSX.Element;

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

@@ -0,0 +1,23 @@
+/**
+ * @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 {import('react').ReactNode} [props.actions] los botones de arriba
+ */
+export default function MessageView({ message, actions }: {
+    message: {
+        subject: string;
+        from: {
+            name: string;
+            email: string;
+        };
+        to?: string[];
+        receivedAt: string;
+        body: string;
+        attachments?: Array<{
+            name: string;
+            size?: string;
+        }>;
+    } | null;
+    actions?: import('react').ReactNode;
+}): import("react").JSX.Element;

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

@@ -0,0 +1,6 @@
+/**
+ * @param {string} receivedAt el instante ISO
+ * @param {Date} [now] para las pruebas; por omisión, ahora
+ * @returns {string}
+ */
+export declare function inboxDateOf(receivedAt: string, now?: Date): string;