@makroz/mobile 1.1.2 → 1.2.0

package/dist/hooks/useMkCrud.d.ts

@@ -0,0 +1,39 @@
+import type { MkCrudConfig, MkCrudAction, MkCrudReturn } from '@makroz/core';
+/**
+ * @module useMkCrud
+ * @description Full CRUD operations hook with form management, validation, and API integration.
+ * Same API surface for both mk-web and mk-mobile.
+ *
+ * @example
+ * ```tsx
+ * const crud = useMkCrud({
+ *   module: 'users',
+ *   singular: 'Usuario',
+ *   plural: 'Usuarios',
+ *   fields: {
+ *     name:  { rules: ['required', 'min:3'], api: 'ae', label: 'Nombre' },
+ *     email: { rules: ['required', 'email'], api: 'ae', label: 'Email' },
+ *   },
+ * });
+ *
+ * // In your component:
+ * <MkButton label="Nuevo" onPress={crud.onAdd} />
+ *
+ * // In the modal:
+ * <MkInput label="Nombre" value={crud.form.formState.name}
+ *   error={crud.form.errors.name}
+ *   onChangeText={v => crud.form.setField('name', v)} />
+ * <MkButton label="Guardar" loading={crud.saving} onPress={crud.onSave} />
+ * ```
+ */
+interface UseMkCrudOptions extends MkCrudConfig {
+    /** Callback after successful save. */
+    onSuccess?: (action: MkCrudAction, data: any) => void;
+    /** Callback after failed save. */
+    onError?: (action: MkCrudAction, error: any) => void;
+    /** External reload function (from useMkList). */
+    onReload?: () => void;
+}
+export declare function useMkCrud<T extends Record<string, any> = Record<string, any>>(config: UseMkCrudOptions): MkCrudReturn<T>;
+export {};
+//# sourceMappingURL=useMkCrud.d.ts.map

package/dist/hooks/useMkDebounce.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @module useMkDebounce
+ * @description Returns a debounced value — the value only updates after the specified
+ * delay of inactivity. Useful for search inputs, filters, and API-driven queries.
+ *
+ * API is identical between mk-web and mk-mobile.
+ *
+ * @template T - Type of the input value.
+ * @param value - The value to debounce.
+ * @param delay - Milliseconds to wait before updating. Default 300.
+ * @returns The debounced value.
+ *
+ * @example
+ * ```tsx
+ * const [search, setSearch] = useState('');
+ * const debouncedSearch = useMkDebounce(search, 400);
+ *
+ * useEffect(() => {
+ *   if (debouncedSearch) api.get('/search', { q: debouncedSearch });
+ * }, [debouncedSearch]);
+ * ```
+ */
+export declare const useMkDebounce: <T = any>(value: T, delay?: number) => T;
+//# sourceMappingURL=useMkDebounce.d.ts.map

package/dist/hooks/useMkEffectDebug.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useMkEffectDebug (Mobile)
+ * 🚀 Parity with Web.
+ */
+export declare const useMkEffectDebug: (effectFunction: () => void | (() => void), dependencies: any[]) => void;
+//# sourceMappingURL=useMkEffectDebug.d.ts.map

package/dist/hooks/useMkEvent.d.ts

@@ -0,0 +1,42 @@
+/**
+ * @module useMkEvent
+ * @description Lightweight event bus for cross-component communication in React Native.
+ * Uses a shared in-memory Map — no DOM APIs, no external dependencies.
+ * API matches mk-web's useMkEvent exactly: { emit }.
+ *
+ * @example
+ * ```tsx
+ * // Component A — listen
+ * useMkEvent('cart:updated', (data) => {
+ *   console.log('Cart updated:', data);
+ * });
+ *
+ * // Component B — emit
+ * const { emit } = useMkEvent('cart:updated');
+ * emit({ items: 5 });
+ * ```
+ */
+type Listener = (data?: any) => void;
+declare function _on(event: string, fn: Listener): void;
+declare function _off(event: string, fn: Listener): void;
+declare function _emit(event: string, data?: any): void;
+export declare function useMkEvent<T = any>(eventName: string, handler?: (data: T) => void): {
+    emit: (data?: T) => void;
+};
+/**
+ * Imperative event API — for use outside React components (services, callbacks).
+ * @example
+ * import { MkEventBus } from '@makroz/mobile';
+ * MkEventBus.emit('notification:received', payload);
+ */
+export declare const MkEventBus: {
+    readonly on: typeof _on;
+    readonly off: typeof _off;
+    readonly emit: typeof _emit;
+    /** Clear all listeners for an event. */
+    readonly clear: (event: string) => void;
+    /** Clear ALL listeners. */
+    readonly clearAll: () => void;
+};
+export {};
+//# sourceMappingURL=useMkEvent.d.ts.map

package/dist/hooks/useMkFilePickerCli.d.ts

@@ -0,0 +1,59 @@
+import type { UseMkFilePickerReturn } from './filePicker.types';
+/**
+ * @module useMkFilePickerCli
+ * @description Picker adapter for **React Native CLI** projects.
+ *
+ * **Required peer packages** (choose what you need):
+ * ```bash
+ * # Images / Videos:
+ * npm install react-native-image-picker
+ * cd ios && pod install && cd ..
+ *
+ * # Documents (PDF, Word, etc.):
+ * npm install react-native-document-picker
+ * cd ios && pod install && cd ..
+ * ```
+ *
+ * **Android** — add to AndroidManifest.xml:
+ * ```xml
+ * <uses-permission android:name="android.permission.READ_MEDIA_IMAGES" />
+ * <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
+ * ```
+ *
+ * **iOS** — add to Info.plist:
+ * ```xml
+ * <key>NSPhotoLibraryUsageDescription</key>
+ * <string>Necesitamos acceso para subir imágenes</string>
+ * ```
+ *
+ * @example Images
+ * ```tsx
+ * const picker = useMkFilePickerCli({ mediaType: 'images', multiple: true });
+ * <MkFileUpload onTap={picker.pick} onFiles={setFiles} />
+ * ```
+ *
+ * @example Documents
+ * ```tsx
+ * const picker = useMkFilePickerCli({
+ *   mediaType: 'documents',
+ *   documentMimeTypes: ['application/pdf'],
+ * });
+ * <MkFileUpload onTap={picker.pick} onFiles={setFiles} />
+ * ```
+ */
+export type CliMediaType = 'images' | 'videos' | 'documents' | 'all';
+export interface UseMkFilePickerCliOptions {
+    /** What type of files to pick. Default 'images'. */
+    mediaType?: CliMediaType;
+    /** Allow multiple selection. Default false. */
+    multiple?: boolean;
+    /** Image quality 0–1. Default 0.8. */
+    quality?: number;
+    /**
+     * MIME types for document picker.
+     * Default: ['image/*', 'application/pdf']
+     */
+    documentMimeTypes?: string[];
+}
+export declare function useMkFilePickerCli(options?: UseMkFilePickerCliOptions): UseMkFilePickerReturn;
+//# sourceMappingURL=useMkFilePickerCli.d.ts.map

package/dist/hooks/useMkFilePickerExpo.d.ts

@@ -0,0 +1,38 @@
+import type { UseMkFilePickerReturn } from './filePicker.types';
+/**
+ * @module useMkFilePickerExpo
+ * @description Picker adapter for **Expo** projects.
+ *
+ * **Required peer packages** (install separately in your app):
+ * ```bash
+ * npx expo install expo-image-picker expo-document-picker
+ * ```
+ *
+ * This hook uses `require()` at runtime so the library compiles even if these
+ * packages are not installed. A clear error message is shown if they're missing.
+ *
+ * @example Images
+ * ```tsx
+ * const picker = useMkFilePickerExpo({ mediaType: 'images', multiple: true });
+ * <MkFileUpload onTap={picker.pick} onFiles={setFiles} />
+ * ```
+ *
+ * @example Documents
+ * ```tsx
+ * const picker = useMkFilePickerExpo({ mediaType: 'documents' });
+ * <MkFileUpload onTap={picker.pick} onFiles={setFiles} accept=".pdf" />
+ * ```
+ */
+export type ExpoMediaType = 'images' | 'videos' | 'documents' | 'all';
+export interface UseMkFilePickerExpoOptions {
+    /** What type of files to pick. Default 'images'. */
+    mediaType?: ExpoMediaType;
+    /** Allow multiple selection. Default false. */
+    multiple?: boolean;
+    /** Allow editing after picking (images only, ignored when multiple=true). */
+    allowsEditing?: boolean;
+    /** Image quality 0–1. Default 0.8. */
+    quality?: number;
+}
+export declare function useMkFilePickerExpo(options?: UseMkFilePickerExpoOptions): UseMkFilePickerReturn;
+//# sourceMappingURL=useMkFilePickerExpo.d.ts.map

package/dist/hooks/useMkForm.d.ts

@@ -0,0 +1,43 @@
+import type { MkFormFields, MkFormReturn, MkCrudAction } from '@makroz/core';
+/**
+ * @module useMkForm
+ * @description Unified form state manager with built-in validation.
+ * Works on both Web and Mobile — zero platform dependencies.
+ *
+ * Uses mkValidation from mk-core for field-level and form-level validation,
+ * and mkValidation.getApiFields for extracting API-ready data.
+ *
+ * @example
+ * ```tsx
+ * const form = useMkForm({
+ *   fields: {
+ *     name:  { rules: ['required', 'min:3'], api: 'ae' },
+ *     email: { rules: ['required', 'email'], api: 'ae' },
+ *     phone: { rules: ['phone'], api: 'ae*' },
+ *   },
+ *   initialData: { name: '', email: '', phone: '' },
+ * });
+ *
+ * // In handler
+ * <MkInput label="Nombre" value={form.formState.name} error={form.errors.name}
+ *   onChange={v => form.setField('name', v)} />
+ *
+ * const handleSave = () => {
+ *   if (!form.validate()) return;
+ *   const data = form.getApiData();
+ *   api.post('/users', data);
+ * };
+ * ```
+ */
+export interface UseMkFormOptions<T = Record<string, any>> {
+    /** Field definitions with rules and API flags. */
+    fields: MkFormFields;
+    /** Initial data for the form. */
+    initialData?: Partial<T>;
+    /** Current CRUD action (affects which rules apply). Default 'add'. */
+    action?: MkCrudAction;
+    /** Validate on every setField call. Default false. */
+    validateOnChange?: boolean;
+}
+export declare function useMkForm<T extends Record<string, any> = Record<string, any>>({ fields, initialData, action, validateOnChange, }: UseMkFormOptions<T>): MkFormReturn<T>;
+//# sourceMappingURL=useMkForm.d.ts.map

package/dist/hooks/useMkInfiniteList.d.ts

@@ -0,0 +1,16 @@
+export interface InfiniteListOptions {
+    per_page?: number;
+    q?: string;
+    filter?: Record<string, any>;
+    sort?: string;
+}
+export declare function useMkInfiniteList(endpoint: string, options?: InfiniteListOptions): {
+    items: any[];
+    loading: boolean;
+    error: any;
+    isRefreshing: boolean;
+    hasMore: boolean;
+    loadMore: (isInitial?: boolean) => Promise<void>;
+    onRefresh: () => Promise<void>;
+};
+//# sourceMappingURL=useMkInfiniteList.d.ts.map

package/dist/hooks/useMkList.d.ts

@@ -0,0 +1,61 @@
+/**
+ * @module useMkList
+ * @description Paginated list manager for React Native — mirrors mk-web's useMkList API.
+ * Manages page, search, sort, and filters with auto-refresh on param changes.
+ *
+ * @example
+ * ```tsx
+ * const { data, loading, params, setSearch, setPage, setSort, setFilter, refresh } = useMkList('/users');
+ *
+ * // Search
+ * setSearch('mario');
+ *
+ * // Change page
+ * setPage(2);
+ *
+ * // Sort
+ * setSort('-created_at');
+ *
+ * // Filter
+ * setFilter('status', 'active');
+ * ```
+ */
+export interface MkListParams {
+    page?: number;
+    per_page?: number;
+    q?: string;
+    sort?: string;
+    filter?: Record<string, any>;
+}
+export interface MkListOptions {
+    /** Initial params. */
+    initialParams?: MkListParams;
+    /** Whether to auto-fetch on mount and param changes. Default true. */
+    autoFetch?: boolean;
+    /** Debounce delay in ms for search updates. Default 0 (no debounce). */
+    debounceMs?: number;
+}
+export declare function useMkList(endpoint: string, options?: MkListOptions): {
+    params: MkListParams;
+    setParams: import("react").Dispatch<import("react").SetStateAction<MkListParams>>;
+    setFilter: (field: string, value: any) => void;
+    setPage: (page: number) => void;
+    setSearch: (q: string) => void;
+    setSort: (sort: string) => void;
+    setPerPage: (per_page: number) => void;
+    resetFilters: () => void;
+    refresh: (extraParams?: MkListParams) => Promise<import("@makroz/core").MkResponse<unknown>>;
+    /** Pagination meta from __extraData */
+    pagination: any;
+    status: import("@makroz/core").ApiStatus;
+    data: any;
+    error: any;
+    waiting: number;
+    loading: boolean;
+    get: (endpoint: string, params?: any) => Promise<import("@makroz/core").MkResponse<unknown>>;
+    post: (endpoint: string, body: any) => Promise<import("@makroz/core").MkResponse<unknown>>;
+    put: (endpoint: string, body: any) => Promise<import("@makroz/core").MkResponse<unknown>>;
+    delete: (endpoint: string) => Promise<import("@makroz/core").MkResponse<unknown>>;
+    remove: (endpoint: string) => Promise<import("@makroz/core").MkResponse<unknown>>;
+};
+//# sourceMappingURL=useMkList.d.ts.map

package/dist/hooks/useMkLocalStorage.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useMkLocalStorage (Mobile)
+ * 🚀 Parity with Web but using AsyncStorage.
+ */
+export declare function useMkLocalStorage<T>(key: string, initialValue: T): readonly [T, (value: T | ((val: T) => T)) => void];
+//# sourceMappingURL=useMkLocalStorage.d.ts.map

package/dist/hooks/useMkPrevious.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useMkPrevious (Mobile)
+ * 🚀 Parity with Web.
+ */
+export declare const useMkPrevious: <T>(value: T, initialValue?: T) => T | undefined;
+//# sourceMappingURL=useMkPrevious.d.ts.map

package/dist/hooks/useMkToggle.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useMkToggle (Mobile)
+ * 🚀 Parity with Web.
+ */
+export declare const useMkToggle: (initialValue?: boolean) => [boolean, () => void, (v: boolean) => void];
+//# sourceMappingURL=useMkToggle.d.ts.map

package/dist/index.d.ts

@@ -0,0 +1,29 @@
+export * from './components';
+export * from './theme/MkThemeProvider';
+export * from './context/MkApiContext';
+export * from './context/MkAuthContext';
+export * from './context/MkConfirmContext';
+export * from './context/MkToastContext';
+export { MkAuthProvider } from './auth/MkAuthProvider';
+export type { MkAuthProviderProps } from './auth/MkAuthProvider';
+export { useMkAuth } from './auth/useMkAuth';
+export { MkAuthForm } from './auth/MkAuthForm';
+export type { MkAuthFormProps } from './auth/MkAuthForm';
+export type { MkAuthContextValue } from './auth/MkAuthContext';
+export type { AdminDto, AuthTokens, LoginInput, LoginResponse, RefreshResponse } from './auth/types';
+export { getAccessToken, setAccessToken, getRefreshToken, setRefreshToken, getUser, setUser, clearAll, SECURE_KEYS, } from './auth/secureStorage';
+export type { SecureKey } from './auth/secureStorage';
+export * from './hooks/useApi';
+export * from './hooks/useMkList';
+export * from './hooks/useMkInfiniteList';
+export * from './hooks/useMkDebounce';
+export * from './hooks/useMkEffectDebug';
+export * from './hooks/useMkEvent';
+export * from './hooks/useMkLocalStorage';
+export * from './hooks/useMkPrevious';
+export * from './hooks/useMkToggle';
+export * from './hooks/useMkForm';
+export * from './hooks/useMkCrud';
+export * from './hooks/useMkFilePickerExpo';
+export * from './hooks/useMkFilePickerCli';
+//# sourceMappingURL=index.d.ts.map

package/dist/test-setup.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Test setup for @makroz/mobile — jsdom env + global stubs.
+ *
+ * Note: react-native and @shopify/flash-list mocks are NOT done
+ * here. `vi.mock` in setup files is loaded after the test file
+ * imports, so the mocks wouldn't apply. Instead, each .test.tsx
+ * file should `import { rnMocks } from '../test-utils'` and call
+ * `rnMocks()` at the top, BEFORE importing the component.
+ *
+ * This file just provides:
+ *   - ResizeObserver / IntersectionObserver stubs (jsdom missing)
+ *   - LayoutAnimation / UIManager global stubs (RN missing in jsdom)
+ */
+declare class ResizeObserverStub {
+    observe(): void;
+    unobserve(): void;
+    disconnect(): void;
+}
+declare class IntersectionObserverStub {
+    readonly root: null;
+    readonly rootMargin = "";
+    readonly thresholds: ReadonlyArray<number>;
+    observe(): void;
+    unobserve(): void;
+    disconnect(): void;
+    takeRecords(): IntersectionObserverEntry[];
+}
+//# sourceMappingURL=test-setup.d.ts.map

package/dist/test-utils.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+export declare function rnMocks(): void;
+declare function customRender(ui: React.ReactElement, options?: {
+    wrapper?: React.ComponentType<{
+        children: React.ReactNode;
+    }>;
+}): {
+    toJSON: () => any;
+    unmount: () => any;
+    rerender: () => void;
+};
+export declare function renderWithProviders(ui: React.ReactElement, options?: {
+    wrapper?: React.ComponentType<{
+        children: React.ReactNode;
+    }>;
+}): {
+    toJSON: () => any;
+    unmount: () => any;
+    rerender: () => void;
+};
+export { customRender as render };
+//# sourceMappingURL=test-utils.d.ts.map

package/dist/theme/MkThemeProvider.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { MkTheme } from '@makroz/core';
+interface ThemeContextType {
+    theme: MkTheme;
+    isDark: boolean;
+    toggleTheme: () => void;
+}
+export declare const MkThemeProvider: React.FC<{
+    children: React.ReactNode;
+    initialDark?: boolean;
+}>;
+export declare const useMkTheme: () => ThemeContextType;
+export {};
+//# sourceMappingURL=MkThemeProvider.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@makroz/mobile",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "description": "React Native UI components and hooks for MK-Director mobile applications",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -29,7 +29,7 @@
     "@react-native-async-storage/async-storage": "^3.0.2",
     "@shopify/flash-list": "^2.0.0",
     "react-native-svg": "^15.15.4",
-    "@makroz/core": "1.0.1"
+    "@makroz/core": "1.1.1"
   },
   "peerDependencies": {
     "@shopify/flash-list": ">=2.0.0",