@nocios/crudify-components 1.0.0

package/dist/CrudiaMarkdownField-C8HQh7s5.d.ts

@@ -0,0 +1,328 @@
+import React from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { A as AutoGenerateConfig } from './GlobalNotificationProvider-Zq18OkpI.js';
+
+/**
+ * Password validation types and constants
+ * Used for password requirements validation in forms
+ */
+type PasswordRuleType = "minLength" | "alphanumeric" | "uppercase" | "lowercase" | "number" | "special";
+interface PasswordRule {
+    type: PasswordRuleType;
+    value?: number | string;
+    message: string;
+    enforce?: boolean;
+}
+interface EvaluatedPasswordRule {
+    message: string;
+    valid: boolean;
+    enforce: boolean;
+}
+/**
+ * Default password rules used as fallback when no custom rules are provided.
+ * Messages are translation keys that should be translated at runtime.
+ */
+declare const DEFAULT_PASSWORD_RULES: PasswordRule[];
+
+type BoxScreenType = "login" | "signUp" | "forgotPassword" | "resetPassword" | "checkCode";
+interface CrudifyLoginConfig {
+    publicApiKey?: string | null;
+    env?: "dev" | "stg" | "api" | "prod";
+    appName?: string;
+    logo?: string;
+    loginActions?: string[];
+}
+interface CrudifyLoginTranslations {
+    [key: string]: string | CrudifyLoginTranslations;
+}
+interface UserLoginData {
+    token: string;
+    username?: string;
+    email?: string;
+    userId?: string;
+    profile?: Record<string, unknown>;
+    [key: string]: unknown;
+}
+interface CrudifyLoginProps {
+    onScreenChange?: (screen: BoxScreenType, params?: Record<string, string>) => void;
+    onExternalNavigate?: (path: string) => void;
+    onLoginSuccess?: (userData: UserLoginData, redirectUrl?: string) => void;
+    onError?: (error: string) => void;
+    initialScreen?: BoxScreenType;
+    redirectUrl?: string;
+    autoReadFromCookies?: boolean;
+    translations?: CrudifyLoginTranslations;
+    translationsUrl?: string;
+    language?: string;
+    /** Custom password rules for reset password form. Falls back to default rules if not provided. */
+    passwordRules?: PasswordRule[];
+}
+
+declare const CrudifyLogin: React.FC<CrudifyLoginProps>;
+
+interface UserProfileDisplayProps {
+    showExtendedData?: boolean;
+    showProfileCard?: boolean;
+    autoRefresh?: boolean;
+}
+declare const UserProfileDisplay: React.FC<UserProfileDisplayProps>;
+
+declare const POLICY_ACTIONS: readonly ["create", "read", "update", "delete"];
+type PolicyAction = typeof POLICY_ACTIONS[number];
+declare const PREFERRED_POLICY_ORDER: PolicyAction[];
+
+type Policy = {
+    id: string;
+    action: PolicyAction;
+    fields?: {
+        allow: string[];
+        owner_allow: string[];
+        deny: string[];
+    };
+    permission?: string;
+};
+type FieldErrorMap = string | ({
+    _error?: string;
+} & Record<string, string | undefined>);
+interface PoliciesProps {
+    policies: Policy[];
+    onChange: (next: Policy[]) => void;
+    availableFields: string[];
+    errors?: FieldErrorMap;
+    isSubmitting?: boolean;
+}
+declare const Policies: React.FC<PoliciesProps>;
+
+declare function LoginComponent(): react_jsx_runtime.JSX.Element;
+/**
+ * Componente simple de estado de sesión para mostrar en cualquier lugar
+ */
+declare function SessionStatus(): react_jsx_runtime.JSX.Element;
+
+interface CrudiaAutoGenerateProps {
+    config: AutoGenerateConfig;
+    value?: string;
+    onChange?: (value: string) => void;
+    label?: string;
+    error?: boolean;
+    helperText?: string;
+    readOnly?: boolean;
+    disabled?: boolean;
+}
+/**
+ * Componente para campos autogenerados (códigos secuenciales)
+ *
+ * Características:
+ * - Auto-fetch del código al montar
+ * - Detección automática de errores de duplicado
+ * - Botón "Regenerar" en endAdornment cuando hay error de duplicado
+ * - Estados de loading y error
+ * - Readonly por defecto
+ * - Integración con useAutoGenerate hook
+ *
+ * Flujo de Manejo de Errores de Duplicado:
+ * 1. Usuario abre formulario → Código se genera automáticamente (ej: PROD-0013671)
+ * 2. Usuario llena formulario y hace submit
+ * 3. Backend retorna error "duplicate key" o "unique constraint"
+ * 4. Formulario padre pasa error={true} y helperText="El código ya existe"
+ * 5. Componente detecta palabras clave de duplicado y muestra botón de regenerar
+ * 6. Usuario hace click en botón de regenerar → Nuevo código se genera
+ * 7. onChange se llama con nuevo código → Formulario padre limpia el error
+ * 8. Botón de regenerar desaparece (porque ya no hay error)
+ *
+ * @example
+ * ```tsx
+ * // Uso básico
+ * <CrudiaAutoGenerate
+ *   config={{ prefix: "PROD-", padding: 7 }}
+ *   onChange={(code) => setFormData({ ...formData, barCode: code })}
+ *   label="Código de Barras"
+ * />
+ *
+ * // Con manejo de error de duplicado desde el formulario
+ * <CrudiaAutoGenerate
+ *   config={{ prefix: "PROD-", padding: 7 }}
+ *   onChange={(code) => {
+ *     setFormData({ ...formData, barCode: code });
+ *     // Limpiar error cuando cambia el código
+ *     setFormErrors({ ...formErrors, barCode: null });
+ *   }}
+ *   label="Código de Barras"
+ *   error={!!formErrors.barCode}
+ *   helperText={formErrors.barCode}
+ * />
+ * ```
+ */
+declare const CrudiaAutoGenerate: React.FC<CrudiaAutoGenerateProps>;
+
+/**
+ * File field component with:
+ * - Drag & drop
+ * - File preview
+ * - Progress bar during upload
+ * - Delete files (soft delete)
+ * - Type and size validation
+ * - Single/multiple support
+ */
+
+/**
+ * Deletion handlers exposed by the component
+ */
+interface CrudiaFileFieldDeletionHandlers {
+    /** Execute all pending deletions (call this on form success callback) */
+    commitDeletions: () => Promise<{
+        success: boolean;
+        errors: string[];
+    }>;
+    /** Cancel all pending deletions and restore files */
+    restorePendingDeletions: () => void;
+    /** Whether there are files pending deletion */
+    hasPendingDeletions: boolean;
+    /** Mark the field as submitted (triggers validation errors display) */
+    markAsSubmitted: () => void;
+    /** Whether the field is valid */
+    isValid: boolean;
+    /** Whether files are currently being uploaded */
+    isUploading: boolean;
+    /** Wait for all uploads to complete - returns completed file paths */
+    waitForUploads: () => Promise<string[]>;
+    /** Get completed file paths synchronously (may be stale if uploads just finished) */
+    getCompletedFilePaths: () => string[];
+}
+/**
+ * Props del componente CrudiaFileField
+ */
+interface CrudiaFileFieldProps {
+    /** Label del campo */
+    label?: string;
+    /** Tipos MIME permitidos (ej: ["image/png", "image/jpeg"]) */
+    accept?: string[];
+    /** Tamaño máximo por archivo en bytes */
+    maxFileSize?: number;
+    /** Permitir múltiples archivos */
+    multiple?: boolean;
+    /** Número máximo de archivos (solo si multiple=true) */
+    maxFiles?: number;
+    /** Número mínimo de archivos requeridos */
+    minFiles?: number;
+    /** Campo requerido */
+    required?: boolean;
+    /** Campo deshabilitado */
+    disabled?: boolean;
+    /** Error externo */
+    error?: boolean;
+    /** Texto de ayuda o error */
+    helperText?: string;
+    /**
+     * Callback cuando cambian los filePaths de archivos completados
+     * Los filePaths son rutas relativas con visibility (public/... o private/...)
+     */
+    onChange?: (filePaths: string[]) => void;
+    /** Callback cuando se valida el campo */
+    onValidation?: (isValid: boolean, error: string | null) => void;
+    /** Archivos existentes (para edición) - usar filePath (ruta relativa con visibility) */
+    initialFiles?: Array<{
+        filePath: string;
+        name: string;
+        size?: number;
+        contentType?: string;
+    }>;
+    /** Texto placeholder para drag zone */
+    placeholder?: string;
+    /** Mostrar lista de archivos */
+    showFileList?: boolean;
+    /**
+     * Visibilidad de los archivos subidos
+     * @default "private"
+     */
+    visibility?: "public" | "private";
+    /**
+     * Mostrar preview de imágenes
+     * @default true para imágenes
+     */
+    showPreview?: boolean;
+    /**
+     * URL base para prefijar al path del archivo
+     * El valor guardado será baseUrl + path
+     * También se usa para previsualizar/descargar archivos públicos en modo readonly
+     */
+    baseUrl: string;
+    /**
+     * Callback called when deletion handlers are ready
+     * Use this to get access to commitDeletions and restorePendingDeletions functions
+     */
+    onDeletionHandlersReady?: (handlers: CrudiaFileFieldDeletionHandlers) => void;
+    /**
+     * Form mode: 'create' or 'edit' - affects delete behavior
+     * - create: delete shows confirmation and deletes immediately from server
+     * - edit: existing files use pendingDeletion, new files delete immediately
+     * @default "create"
+     */
+    mode?: "create" | "edit";
+}
+/**
+ * Main file field component
+ *
+ * @example
+ * ```tsx
+ * // Basic usage - single file
+ * <CrudiaFileField
+ *   label="Document"
+ *   accept={["application/pdf"]}
+ *   onChange={(filePaths) => setFormData({ ...formData, document: filePaths[0] })}
+ * />
+ *
+ * // Multiple files with limits
+ * <CrudiaFileField
+ *   label="Images"
+ *   accept={["image/png", "image/jpeg"]}
+ *   multiple
+ *   maxFiles={5}
+ *   minFiles={1}
+ *   maxFileSize={5 * 1024 * 1024}
+ *   onChange={(filePaths) => setFormData({ ...formData, images: filePaths })}
+ * />
+ *
+ * // With initial files (edit mode)
+ * <CrudiaFileField
+ *   label="Attachments"
+ *   multiple
+ *   initialFiles={existingFiles}
+ *   onChange={handleFilesChange}
+ * />
+ * ```
+ */
+declare const CrudiaFileField: React.FC<CrudiaFileFieldProps>;
+
+/**
+ * Markdown field component with rich text editing using MDXEditor
+ * - WYSIWYG markdown editing
+ * - Toolbar with formatting options
+ * - Saves content as markdown string
+ */
+
+interface CrudiaMarkdownFieldProps {
+    /** Field label */
+    label?: string;
+    /** Current value (markdown string) */
+    value?: string;
+    /** Callback when content changes */
+    onChange?: (value: string) => void;
+    /** Required field */
+    required?: boolean;
+    /** Disabled/readonly field */
+    disabled?: boolean;
+    /** External error state */
+    error?: boolean;
+    /** Helper or error text */
+    helperText?: string;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Minimum editor height in pixels */
+    minHeight?: number;
+    /** Maximum editor height in pixels (scrolls after) */
+    maxHeight?: number;
+}
+declare const CrudiaMarkdownField: React.FC<CrudiaMarkdownFieldProps>;
+
+export { type BoxScreenType as B, CrudifyLogin as C, DEFAULT_PASSWORD_RULES as D, type EvaluatedPasswordRule as E, LoginComponent as L, Policies as P, SessionStatus as S, UserProfileDisplay as U, CrudiaAutoGenerate as a, CrudiaFileField as b, CrudiaMarkdownField as c, type CrudifyLoginConfig as d, type CrudifyLoginProps as e, type CrudifyLoginTranslations as f, type UserLoginData as g, type PolicyAction as h, type CrudiaAutoGenerateProps as i, type CrudiaFileFieldProps as j, type CrudiaMarkdownFieldProps as k, type PasswordRule as l, POLICY_ACTIONS as m, PREFERRED_POLICY_ORDER as n, type CrudiaFileFieldDeletionHandlers as o, type PasswordRuleType as p };

package/dist/GlobalNotificationProvider-Zq18OkpI.d.mts

@@ -0,0 +1,96 @@
+import React from 'react';
+
+interface AutoGenerateConfig {
+    prefix: string;
+    padding?: number;
+    separator?: string;
+}
+interface UseAutoGenerateReturn {
+    value: string;
+    loading: boolean;
+    error: string | null;
+    regenerate: () => Promise<void>;
+    clearError: () => void;
+}
+interface UseAutoGenerateOptions {
+    autoFetch?: boolean;
+    onSuccess?: (value: string) => void;
+    onError?: (error: string) => void;
+}
+/**
+ * Hook para generar códigos autogenerados desde el servidor
+ *
+ * ⚠️ IMPORTANTE: Genera y RESERVA el código inmediatamente al montar
+ * El servidor incrementa counter en cada llamada, código queda reservado
+ *
+ * Flujo Normal:
+ * 1. Componente monta → fetchNextSequence() ejecuta
+ * 2. Servidor incrementa counter y retorna valor
+ * 3. Usuario ve código → completa form → guarda exitosamente
+ *
+ * Flujo de Error (raro):
+ * 1. Dos usuarios abren form al mismo tiempo
+ * 2. Ambos reciben diferentes códigos (Counter atómico)
+ * 3. Usuario A guarda primero → OK
+ * 4. Usuario B intenta guardar → Error "Duplicate key" (validación única)
+ * 5. Usuario B ve botón "Regenerar código" → Click
+ * 6. regenerate() obtiene nuevo código → Usuario B guarda → OK
+ *
+ * @example
+ * ```tsx
+ * function ProductForm() {
+ *   const { value, loading, error, regenerate, clearError } = useAutoGenerate({
+ *     prefix: "PROD-",
+ *     padding: 7
+ *   });
+ *
+ *   return (
+ *     <div>
+ *       <input value={value} readOnly />
+ *       {loading && <CircularProgress />}
+ *       {error && (
+ *         <div>
+ *           <span>Error: {error}</span>
+ *           <button onClick={regenerate}>Regenerar código</button>
+ *         </div>
+ *       )}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare const useAutoGenerate: (config: AutoGenerateConfig, options?: UseAutoGenerateOptions) => UseAutoGenerateReturn;
+
+type NotificationSeverity = "error" | "info" | "success" | "warning";
+interface Notification {
+    id: string;
+    message: string;
+    severity: NotificationSeverity;
+    autoHideDuration?: number;
+    persistent?: boolean;
+    allowHtml?: boolean;
+}
+interface GlobalNotificationContextValue {
+    showNotification: (message: string, severity?: NotificationSeverity, options?: {
+        autoHideDuration?: number;
+        persistent?: boolean;
+        allowHtml?: boolean;
+    }) => string;
+    hideNotification: (id: string) => void;
+    clearAllNotifications: () => void;
+}
+interface GlobalNotificationProviderProps {
+    children: React.ReactNode;
+    maxNotifications?: number;
+    defaultAutoHideDuration?: number;
+    position?: {
+        vertical: "top" | "bottom";
+        horizontal: "left" | "center" | "right";
+    };
+    enabled?: boolean;
+    allowHtml?: boolean;
+}
+declare const GlobalNotificationProvider: React.FC<GlobalNotificationProviderProps>;
+declare const useGlobalNotification: () => GlobalNotificationContextValue;
+
+export { type AutoGenerateConfig as A, GlobalNotificationProvider as G, type Notification as N, type UseAutoGenerateReturn as U, type GlobalNotificationProviderProps as a, type NotificationSeverity as b, useAutoGenerate as c, type UseAutoGenerateOptions as d, useGlobalNotification as u };

package/dist/GlobalNotificationProvider-Zq18OkpI.d.ts

@@ -0,0 +1,96 @@
+import React from 'react';
+
+interface AutoGenerateConfig {
+    prefix: string;
+    padding?: number;
+    separator?: string;
+}
+interface UseAutoGenerateReturn {
+    value: string;
+    loading: boolean;
+    error: string | null;
+    regenerate: () => Promise<void>;
+    clearError: () => void;
+}
+interface UseAutoGenerateOptions {
+    autoFetch?: boolean;
+    onSuccess?: (value: string) => void;
+    onError?: (error: string) => void;
+}
+/**
+ * Hook para generar códigos autogenerados desde el servidor
+ *
+ * ⚠️ IMPORTANTE: Genera y RESERVA el código inmediatamente al montar
+ * El servidor incrementa counter en cada llamada, código queda reservado
+ *
+ * Flujo Normal:
+ * 1. Componente monta → fetchNextSequence() ejecuta
+ * 2. Servidor incrementa counter y retorna valor
+ * 3. Usuario ve código → completa form → guarda exitosamente
+ *
+ * Flujo de Error (raro):
+ * 1. Dos usuarios abren form al mismo tiempo
+ * 2. Ambos reciben diferentes códigos (Counter atómico)
+ * 3. Usuario A guarda primero → OK
+ * 4. Usuario B intenta guardar → Error "Duplicate key" (validación única)
+ * 5. Usuario B ve botón "Regenerar código" → Click
+ * 6. regenerate() obtiene nuevo código → Usuario B guarda → OK
+ *
+ * @example
+ * ```tsx
+ * function ProductForm() {
+ *   const { value, loading, error, regenerate, clearError } = useAutoGenerate({
+ *     prefix: "PROD-",
+ *     padding: 7
+ *   });
+ *
+ *   return (
+ *     <div>
+ *       <input value={value} readOnly />
+ *       {loading && <CircularProgress />}
+ *       {error && (
+ *         <div>
+ *           <span>Error: {error}</span>
+ *           <button onClick={regenerate}>Regenerar código</button>
+ *         </div>
+ *       )}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare const useAutoGenerate: (config: AutoGenerateConfig, options?: UseAutoGenerateOptions) => UseAutoGenerateReturn;
+
+type NotificationSeverity = "error" | "info" | "success" | "warning";
+interface Notification {
+    id: string;
+    message: string;
+    severity: NotificationSeverity;
+    autoHideDuration?: number;
+    persistent?: boolean;
+    allowHtml?: boolean;
+}
+interface GlobalNotificationContextValue {
+    showNotification: (message: string, severity?: NotificationSeverity, options?: {
+        autoHideDuration?: number;
+        persistent?: boolean;
+        allowHtml?: boolean;
+    }) => string;
+    hideNotification: (id: string) => void;
+    clearAllNotifications: () => void;
+}
+interface GlobalNotificationProviderProps {
+    children: React.ReactNode;
+    maxNotifications?: number;
+    defaultAutoHideDuration?: number;
+    position?: {
+        vertical: "top" | "bottom";
+        horizontal: "left" | "center" | "right";
+    };
+    enabled?: boolean;
+    allowHtml?: boolean;
+}
+declare const GlobalNotificationProvider: React.FC<GlobalNotificationProviderProps>;
+declare const useGlobalNotification: () => GlobalNotificationContextValue;
+
+export { type AutoGenerateConfig as A, GlobalNotificationProvider as G, type Notification as N, type UseAutoGenerateReturn as U, type GlobalNotificationProviderProps as a, type NotificationSeverity as b, useAutoGenerate as c, type UseAutoGenerateOptions as d, useGlobalNotification as u };

package/dist/api-B4uXiHF0.d.mts

@@ -0,0 +1,118 @@
+interface CrudifyApiResponse<T = unknown> {
+    success: boolean;
+    data?: T;
+    errors?: string | Record<string, string[]> | string[];
+    errorCode?: string;
+    fieldsWarning?: Record<string, string[]> | null;
+}
+interface CrudifyTransactionResponse {
+    success: boolean;
+    data?: TransactionResponseData[];
+    errors?: string | Record<string, string[]>;
+    errorCode?: string;
+}
+interface TransactionResponseData {
+    response?: {
+        status: string;
+        data?: unknown;
+        message?: string;
+    };
+    errors?: string | Record<string, string[]>;
+}
+interface UserProfile {
+    id: string | number;
+    email: string;
+    username?: string;
+    firstName?: string;
+    lastName?: string;
+    fullName?: string;
+    avatar?: string;
+    role?: string;
+    permissions?: string[];
+    lastLogin?: string;
+    isActive?: boolean;
+    createdAt?: string;
+    updatedAt?: string;
+    [key: string]: unknown;
+}
+interface LoginResponse {
+    token: string;
+    user?: UserProfile;
+    expiresIn?: number;
+    refreshToken?: string;
+}
+interface LoginRequest {
+    identifier: string;
+    password: string;
+}
+interface ForgotPasswordRequest {
+    email: string;
+}
+interface ResetPasswordRequest {
+    email: string;
+    code: string;
+    newPassword: string;
+}
+interface ValidateCodeRequest {
+    email: string;
+    codePassword: string;
+}
+interface JwtPayload {
+    sub?: string;
+    email?: string;
+    username?: string;
+    iat?: number;
+    exp?: number;
+    iss?: string;
+    aud?: string;
+    [key: string]: unknown;
+}
+interface ApiError {
+    code: string;
+    message: string;
+    field?: string;
+    details?: Record<string, unknown>;
+}
+interface ValidationError {
+    field: string;
+    message: string;
+    code: string;
+}
+/**
+ * Options for Crudify CRUD operations
+ */
+interface CrudifyOperationOptions {
+    signal?: AbortSignal;
+    /** Action metadata for success notifications */
+    actionConfig?: {
+        key?: string;
+        moduleKey?: string;
+        [key: string]: unknown;
+    };
+    /** Skip showing notifications for this operation */
+    skipNotifications?: boolean;
+    /** Allow additional properties */
+    [key: string]: unknown;
+}
+/**
+ * Options for Crudify request operations
+ */
+interface CrudifyRequestOptions {
+    signal?: AbortSignal;
+}
+/**
+ * Represents a single operation within a transaction.
+ */
+interface TransactionOperation {
+    operation: "create" | "update" | "delete" | string;
+    moduleKey?: string;
+    data?: Record<string, unknown>;
+    _id?: string;
+    [key: string]: unknown;
+}
+/**
+ * Input for transaction operations. Can be a single operation or an array of operations.
+ */
+type TransactionInput = TransactionOperation | TransactionOperation[] | Record<string, unknown>;
+
+export type { ApiError as A, CrudifyApiResponse as C, ForgotPasswordRequest as F, JwtPayload as J, LoginResponse as L, ResetPasswordRequest as R, TransactionResponseData as T, UserProfile as U, ValidateCodeRequest as V, CrudifyTransactionResponse as a, LoginRequest as b, ValidationError as c, CrudifyOperationOptions as d, CrudifyRequestOptions as e, TransactionOperation as f, TransactionInput as g };