zustic 1.0.2 → 1.0.4

package/README.md

@@ -1,6 +1,6 @@
 <div align="center">
 
-# 🎯 Zustic
+# Zustic
 
 ### Lightweight State Management for Modern React Applications
 
@@ -17,28 +17,31 @@ A **fast, minimal state management solution** for React ecosystems. Works seamle
 
 ---
 
-## ✨ Key Features
+## Key Features
 
 ### Core Features
-- **🪶 Ultra-Lightweight** — Only ~500B (gzipped) with zero dependencies
-- **⚡ Simple API** — One function (`create`) to manage all your state
-- **🎣 React Hooks** — Native React hooks integration with automatic subscriptions
-- **📱 Multi-Platform** — React, React Native, Next.js, and modern frameworks
-- **🔄 Reactive Updates** — Automatic re-renders with optimized batching
-- **💾 TypeScript First** — Full type safety with perfect type inference
-- **🚀 Production Ready** — Battle-tested in real applications
+- **Ultra-Lightweight** — Only ~500B (gzipped) with zero dependencies
+- **Simple API** — One function (`create`) to manage all your state
+- **React Hooks** — Native React hooks integration with automatic subscriptions
+- **Multi-Platform** — React, React Native, Next.js, and modern frameworks
+- **Reactive Updates** — Automatic re-renders with optimized batching
+- **TypeScript First** — Full type safety with perfect type inference
+- **Production Ready** — Battle-tested in real applications
 
 ### Advanced Capabilities
-- **🧩 Middleware System** — Extend functionality with logging, persistence, validation, and more
-- **📡 Direct State Access** — `get()` function for reading state outside components
-- **🎯 Selective Subscriptions** — Components only re-render when their data changes
-- **⚙️ Fully Extensible** — Build custom middleware for any use case
-- **🧪 Easy Testing** — Simple to test stores with middleware and async operations
-- **🔗 Framework Agnostic** — Create middleware once, use everywhere
+- **Store Middleware System** — Extend state management with logging, persistence, validation, and more
+- **Query System** — Built-in API data fetching with automatic caching, mutations, and plugins
+- **Automatic Caching** — Smart cache management with configurable timeout
+- **Direct State Access** — `get()` function for reading state outside components
+- **Selective Subscriptions** — Components only re-render when their data changes
+- **Fully Extensible** — Build custom middleware and plugins for any use case
+- **Easy Testing** — Simple to test stores and API queries with middleware and async operations
+- **Plugin System** — Global hooks for authentication, logging, error handling
+- **Framework Agnostic** — Create middleware and plugins once, use everywhere
 
 ---
 
-## 📦 Installation
+## Installation
 
 Choose your favorite package manager:
 
@@ -55,13 +58,13 @@ pnpm add zustic
 
 ---
 
-## 🤔 Why Zustic?
+## Why Zustic?
 
 ### Size & Performance
 | Metric | Zustic | Redux | Zustand | Context API |
 |--------|--------|-------|---------|-------------|
 | **Bundle Size** | ~500B | ~6KB | ~2KB | Built-in |
-| **Performance** | ⚡ Optimized | Good | ⚡ Optimized | ⚠️ Re-renders |
+| **Performance** | Optimized | Good | Optimized | Re-renders |
 | **Dependencies** | 0 | 0 | 0 | 0 |
 
 ### Developer Experience
@@ -74,16 +77,18 @@ pnpm add zustic
 
 | Feature | Zustic | Redux | Zustand | Context API |
 |---------|--------|-------|---------|-------------|
-| Bundle Size | ~500B ✅ | ~6KB | ~2KB | 0B |
+| Bundle Size | ~500B | ~6KB | ~2KB | 0B |
 | Learning Curve | ⭐ Easy | ⭐⭐⭐⭐⭐ Hard | ⭐⭐ Easy | ⭐⭐⭐ Medium |
-| Boilerplate | Minimal ✅ | Massive | Minimal | Some |
-| TypeScript | Excellent ✅ | Good | Good | Good |
-| Middleware | Built-in ✅ | Required | Optional | ❌ No |
-| API Simplicity | Very Simple ✅ | Complex | Simple | Medium |
+| Boilerplate | Minimal | Massive | Minimal | Some |
+| TypeScript | Excellent | Good | Good | Good |
+| Store Middleware | Built-in | Required | Optional |  No |
+| Query System | Built-in |  Separate |  Separate |  No |
+| Caching | Automatic | Optional | Optional |  No |
+| API Simplicity | Very Simple | Complex | Simple | Medium |
 
 ---
 
-## 🚀 Quick Start
+##  Quick Start
 
 ### 1. Create Your Store
 
@@ -130,7 +135,7 @@ That's it! No providers, no boilerplate, just pure state management.
 
 ---
 
-## 📚 Core Concepts
+## Core Concepts
 
 ### Create a Store
 
@@ -158,38 +163,10 @@ function Component() {
   return <div>{count}</div>;
 }
 ```
-<!-- 
-### Reading State Outside Components
 
-```typescript
-// In event handlers, callbacks, or services
-const currentState = useStore.get();
-console.log(currentState.count);
-```
-
-### Updating State
-
-```typescript
-// Partial update
-useStore.set({ count: 5 });
-
-// Functional update with access to current state
-useStore.set((state) => ({ 
-  count: state.count + 1 
-}));
+## Store Middleware System
 
-// Async updates
-useStore.set(async (state) => ({
-  data: await fetchData(),
-  loading: false
-}));
-``` -->
-
----
-
-## 🧩 Middleware System
-
-Extend Zustic with powerful middleware for logging, persistence, validation, and more.
+Extend Zustic stores with powerful middleware for logging, persistence, validation, and more.
 
 ### Logger Middleware
 
@@ -261,6 +238,302 @@ export const useStore = create<StoreType>(
 
 ---
 
+## Query System (API Data Fetching)
+
+Zustic now includes a powerful query system for managing API requests with automatic caching, mutations, middleware, and plugins.
+
+### Create an API
+
+```typescript
+import { createApi } from 'zustic/query';
+
+type User = {
+  id: number;
+  name: string;
+  email: string;
+};
+
+const baseQuery = async (args: any) => {
+  try {
+
+    const response = await fetch(`https://api.example.com${args.url}`, {
+      method: args.method || 'GET',
+      headers: args.headers,
+      body: args.body ? JSON.stringify(args.body) : undefined,
+    });
+    const data = await response.json();
+    return { data };
+  } catch (error) {
+    return { error };
+  }
+};
+
+export const api = createApi({
+  baseQuery,
+  endpoints: (builder) => ({
+    getUsers: builder.query<User[], void>({
+      query: () => ({
+        url: '/users',
+        method: 'GET',
+      }),
+      transformResponse: (data) => data.map((u: User) => ({ ...u, name: u.name.toUpperCase() })),
+    }),
+    
+    getUser: builder.query<User, { id: number }>({
+      query: ({ id }) => ({
+        url: `/users/${id}`,
+        method: 'GET',
+      }),
+    }),
+    
+    createUser: builder.mutation<User, Omit<User, 'id'>>({
+      query: (body) => ({
+        url: '/users',
+        method: 'POST',
+        body,
+      }),
+      onSuccess: (data) => console.log('User created:', data),
+      onError: (error) => console.error('Failed to create:', error),
+    }),
+    
+    updateUser: builder.mutation<User, Partial<User>>({
+      query: (body) => ({
+        url: `/users/${body.id}`,
+        method: 'PUT',
+        body,
+      }),
+    }),
+  }),
+  cacheTimeout: 5 * 60 * 1000, // 5 minutes
+});
+```
+
+### Use Queries in Components
+
+```typescript
+import { api } from './api';
+
+function UsersList() {
+  // Query hook automatically fetches on mount
+  const { data: users, isLoading, isError, error, reFetch } = api.useUsersQuery();
+
+  if (isLoading) return <div>Loading...</div>;
+  if (isError) return <div>Error: {error?.message}</div>;
+
+  return (
+    <div>
+      <h2>Users</h2>
+      <button onClick={() => reFetch()}>Refresh</button>
+      <ul>
+        {users?.map((user) => (
+          <li key={user.id}>{user.name}</li>
+        ))}
+      </ul>
+    </div>
+  );
+}
+```
+
+### Skip Queries (Conditional Fetching)
+
+```typescript
+function UserDetail({ userId }: { userId?: number }) {
+  // Only fetch when userId is provided
+  const { data: user, isLoading } = api.useGetUserQuery(
+    { id: userId! },
+    { skip: !userId }
+  );
+
+  if (!userId) return <div>Select a user</div>;
+  if (isLoading) return <div>Loading...</div>;
+
+  return <div>{user?.name} ({user?.email})</div>;
+}
+```
+
+### Use Mutations in Components
+
+```typescript
+function CreateUserForm() {
+  // Mutation hook returns [mutate, state]
+  const [createUser, { isLoading, isError, error, data, isSuccess }] = api.useCreateUserMutation();
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const formData = new FormData(e.currentTarget);
+    
+    await createUser({
+      name: formData.get('name') as string,
+      email: formData.get('email') as string,
+    });
+  };
+
+  return (
+    <form onSubmit={handleSubmit}>
+      <input name="name" placeholder="Name" required />
+      <input name="email" type="email" placeholder="Email" required />
+      <button type="submit" disabled={isLoading}>
+        {isLoading ? 'Creating...' : 'Create User'}
+      </button>
+      {isSuccess && <p User created!</p>}
+      {isError && <p> Error: {error?.message}</p>}
+    </form>
+  );
+}
+```
+
+### Query API Features
+
+#### Transformations
+
+```typescript
+getUser: builder.query<User, { id: number }>({
+  query: ({ id }) => ({
+    url: `/users/${id}`,
+    method: 'GET',
+  }),
+  // Transform the response data
+  transformResponse: (data) => ({
+    ...data,
+    formattedDate: new Date(data.createdAt).toLocaleDateString(),
+  }),
+  // Transform errors
+  transformError: (error) => ({
+    message: error.message || 'Unknown error occurred',
+    code: error.code,
+  }),
+  // Transform request body
+  transformBody: (body) => ({
+    ...body,
+    timestamp: Date.now(),
+  }),
+  // Transform request headers
+  transformHeader: (headers) => ({
+    ...headers,
+    'Authorization': `Bearer ${getToken()}`,
+  }),
+}),
+```
+
+#### Hooks and Callbacks
+
+```typescript
+createUser: builder.mutation<User, CreateUserInput>({
+  query: (body) => ({
+    url: '/users',
+    method: 'POST',
+    body,
+  }),
+  onSuccess: async (data) => {
+    console.log( 'User created:', data)
+  },
+  onError: async (error) => {
+    console.error(' Failed:', error)
+  },
+}),
+```
+
+#### Automatic Caching
+
+```typescript
+const api = createApi({
+  baseQuery,
+  endpoints: (builder) => ({
+    getUser: builder.query<User, { id: number }>({
+      query: ({ id }) => ({
+        url: `/users/${id}`,
+        method: 'GET',
+      }),
+    }),
+  }),
+  cacheTimeout: 10 * 60 * 1000, // Cache for 10 minutes
+});
+
+// First call: fetches from API
+const result1 = useGetUserQuery({ id: 1 });
+
+// Second call (within cache timeout): uses cached data
+const result2 = useGetUserQuery({ id: 1 });
+
+// Force refetch
+const result3 = await reFetch();
+```
+
+#### Custom Query Function
+
+```typescript
+getUserCustom: builder.query<User, { id: number }>({
+  queryFnc: async (arg, baseQuery) => {
+    // Implement custom logic
+    const token = localStorage.getItem('token');
+    return baseQuery({
+      url: `/users/${arg.id}`,
+      method: 'GET',
+      headers: { Authorization: `Bearer ${token}` },
+    });
+  },
+}),
+```
+
+---
+
+## Query Middleware & Plugins
+
+### Query-Level Middleware
+
+```typescript
+const requestLogger: ApiMiddleware = (ctx, next) => {
+  console.log('Request:', ctx.arg);
+  const result = await next();
+  console.log('Response:', result);
+  return result;
+};
+
+getUser: builder.query<User, { id: number }>({
+  query: ({ id }) => ({
+    url: `/users/${id}`,
+    method: 'GET',
+  }),
+  middlewares: [requestLogger],
+}),
+```
+
+### Global Plugins
+
+```typescript
+const authPlugin: ApiPlugin = {
+  name: 'auth-plugin',
+  
+  beforeQuery: (ctx) => {
+    const token = localStorage.getItem('token');
+    if (!token) {
+      throw new Error('Not authenticated');
+    }
+  },
+  
+  afterQuery: (result, ctx) => {
+    if (result.error?.status === 401) {
+      // Handle unauthorized
+      window.location.href = '/login';
+    }
+  },
+  
+  onError: (error, ctx) => {
+    console.error('API Error:', error);
+  },
+};
+
+const api = createApi({
+  baseQuery,
+  endpoints: (builder) => ({
+    // endpoints...
+  }),
+  plugins: [authPlugin],
+});
+```
+
+---
+
 ## 📱 Multi-Platform Examples
 
 ### React Web
@@ -331,7 +604,7 @@ export default function Page() {
 
 ---
 
-## 🧪 Testing
+## Testing
 
 Zustic stores are easy to test:
 
@@ -363,7 +636,7 @@ describe('Counter Store', () => {
 
 ---
 
-## 💡 Advanced Examples
+## Advanced Examples
 
 ### Async State
 
@@ -419,7 +692,7 @@ const useAppStore = create((set) => ({
 
 ---
 
-## 🔗 Resources
+## Resources
 
 - 📖 **[Full Documentation](https://zustic.github.io/)** - Complete API reference and guides
 - 🐛 **[GitHub Issues](https://github.com/DeveloperRejaul/zustic/issues)** - Report bugs and request features
@@ -428,7 +701,7 @@ const useAppStore = create((set) => ({
 
 ---
 
-## 📝 API Reference
+## API Reference
 
 ### `create<T>(initializer, middlewares?)`
 
@@ -452,19 +725,19 @@ const useStore = create((set, get) => ({
 
 ---
 
-## 🤝 Contributing
+## Contributing
 
 Contributions are welcome! Please feel free to submit a Pull Request to the [GitHub repository](https://github.com/DeveloperRejaul/zustic).
 
 ---
 
-## 📄 License
+## License
 
 MIT License © 2024 [Rejaul Karim](https://github.com/DeveloperRejaul)
 
 ---
 
-## 👨‍💻 Author
+## Author
 
 Created by **Rejaul Karim** - [GitHub](https://github.com/DeveloperRejaul)
 

package/dist/chunk-SISWF3T4.mjs

@@ -0,0 +1 @@
+import{useSyncExternalStore as p}from"react";function d(a,n=[]){let e,t=[],s=r=>{let o=typeof r=="function"?r(e):r;e={...e,...o},t.forEach(T=>T())},i=()=>e,c=l(s,i,n);e=a(c,i);let S=r=>(t.push(r),()=>{t=t.filter(o=>o!==r)});return()=>p(S,i)}var l=(a,n,e)=>!e||e.length===0?a:e.reduceRight((t,s)=>s(a,n)(t),a);export{d as a};

package/dist/index.js

@@ -1,73 +1 @@
-"use strict";
-"use client";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  create: () => create
-});
-module.exports = __toCommonJS(index_exports);
-var import_react = require("react");
-function create(initializer, middlewares = []) {
-  let state;
-  let listeners = [];
-  const setState = (partial) => {
-    const partialState = typeof partial === "function" ? partial(state) : partial;
-    state = __spreadValues(__spreadValues({}, state), partialState);
-    listeners.forEach((l) => l());
-  };
-  const getState = () => state;
-  const setStateWithMiddleware = applyMiddleware(setState, getState, middlewares);
-  state = initializer(setStateWithMiddleware, getState);
-  const subscribe = (listener) => {
-    listeners.push(listener);
-    return () => {
-      listeners = listeners.filter((l) => l !== listener);
-    };
-  };
-  return () => (0, import_react.useSyncExternalStore)(subscribe, getState);
-}
-var applyMiddleware = (set, get, middlewares) => {
-  if (!middlewares || middlewares.length === 0) {
-    return set;
-  }
-  return middlewares.reduceRight(
-    (next, mw) => mw(set, get)(next),
-    set
-  );
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  create
-});
+"use strict";var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var m=Object.prototype.hasOwnProperty;var y=(t,r)=>{for(var e in r)c(t,e,{get:r[e],enumerable:!0})},M=(t,r,e,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of f(r))!m.call(t,o)&&o!==e&&c(t,o,{get:()=>r[o],enumerable:!(a=u(r,o))||a.enumerable});return t};var P=t=>M(c({},"__esModule",{value:!0}),t);var x={};y(x,{create:()=>S});module.exports=P(x);var p=require("react");function S(t,r=[]){let e,a=[],o=s=>{let i=typeof s=="function"?s(e):s;e={...e,...i},a.forEach(l=>l())},n=()=>e,T=h(o,n,r);e=t(T,n);let d=s=>(a.push(s),()=>{a=a.filter(i=>i!==s)});return()=>(0,p.useSyncExternalStore)(d,n)}var h=(t,r,e)=>!e||e.length===0?t:e.reduceRight((a,o)=>o(t,r)(a),t);0&&(module.exports={create});

package/dist/index.mjs

@@ -1,51 +1 @@
-"use client";
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-
-// src/index.ts
-import { useSyncExternalStore } from "react";
-function create(initializer, middlewares = []) {
-  let state;
-  let listeners = [];
-  const setState = (partial) => {
-    const partialState = typeof partial === "function" ? partial(state) : partial;
-    state = __spreadValues(__spreadValues({}, state), partialState);
-    listeners.forEach((l) => l());
-  };
-  const getState = () => state;
-  const setStateWithMiddleware = applyMiddleware(setState, getState, middlewares);
-  state = initializer(setStateWithMiddleware, getState);
-  const subscribe = (listener) => {
-    listeners.push(listener);
-    return () => {
-      listeners = listeners.filter((l) => l !== listener);
-    };
-  };
-  return () => useSyncExternalStore(subscribe, getState);
-}
-var applyMiddleware = (set, get, middlewares) => {
-  if (!middlewares || middlewares.length === 0) {
-    return set;
-  }
-  return middlewares.reduceRight(
-    (next, mw) => mw(set, get)(next),
-    set
-  );
-};
-export {
-  create
-};
+import{a as e}from"./chunk-SISWF3T4.mjs";export{e as create};

package/dist/query/index.d.mts

@@ -0,0 +1,116 @@
+type QueryFnObj = {
+    url: string;
+    method: "GET" | "POST" | "PUT" | "DELETE" | "PATCH";
+    body?: any;
+    headers?: Record<string, any>;
+};
+type QueryFnReturn = string | QueryFnObj;
+type QueryFn<Arg = any> = (arg: Arg) => QueryFnReturn;
+type MainQueryReturnTypes = Promise<{
+    data: any;
+    error?: undefined;
+} | {
+    error: any;
+    data?: undefined;
+}>;
+type ApiOption<Arg, R> = {
+    transformResponse?: (currData: any, preData: any) => Promise<R> | R;
+    transformError?: (currError: any, preError: any) => Promise<any> | any;
+    transformBody?: (body: Arg) => Promise<any> | any;
+    transformHeader?: (header: Record<string, any>) => Promise<Record<string, any>> | Record<string, any>;
+    onError?: (err: any) => Promise<void> | void;
+    onSuccess?: (data: R) => Promise<void> | void;
+    queryFnc?: (arg: Arg, baseQuery: CreateApiParams<any>['baseQuery']) => MainQueryReturnTypes;
+    middlewares?: ApiMiddleware[];
+    plugins?: ApiPlugin[];
+};
+type QueryDef<Arg, Result> = {
+    type: 'query';
+    queryFn?: QueryFn<Arg>;
+} & ApiOption<Arg, Result>;
+type MutationDef<Arg, Result> = {
+    type: 'mutation';
+    queryFn?: QueryFn<Arg>;
+} & ApiOption<Arg, Result>;
+type EndpointDef = QueryDef<any, any> | MutationDef<any, any>;
+type MainQueryHookResult<Result> = {
+    data?: Result;
+    isLoading: boolean;
+    isError: boolean;
+    isFetching: boolean;
+    isSuccess: boolean;
+    error: any;
+    reFetch: () => MainQueryReturnTypes;
+};
+type MainMutationState<Result> = {
+    data?: Result;
+    isLoading: boolean;
+    isError: boolean;
+    isSuccess: boolean;
+    error: any;
+};
+type EndpointsMap = Record<string, EndpointDef>;
+type HooksFromEndpoints<T extends EndpointsMap> = {
+    [K in keyof T as T[K] extends {
+        type: 'query';
+    } ? `use${Capitalize<string & K>}Query` : `use${Capitalize<string & K>}Mutation`]: T[K] extends QueryDef<infer Arg, infer Result> ? (arg: Arg, option?: QueryHookOption) => MainQueryHookResult<Result> : T[K] extends MutationDef<infer Arg, infer Result> ? () => readonly [(arg: Arg) => Promise<Result>, MainMutationState<Result>] : never;
+};
+type BuilderType = {
+    query<Result, Arg = void>(config: {
+        query?: (arg: Arg) => QueryFnReturn;
+    } & ApiOption<Arg, Result>): QueryDef<Arg, Result>;
+    mutation<Result, Arg = void>(config: {
+        query?: (arg: Arg) => QueryFnObj;
+    } & ApiOption<Arg, Result>): MutationDef<Arg, Result>;
+};
+type BaseQueryReturn<Data = any, Error = any> = {
+    data: Data;
+    error?: undefined;
+} | {
+    data?: undefined;
+    error: Error;
+};
+interface CreateApiParams<T extends EndpointsMap> {
+    baseQuery: (option: QueryFnReturn) => Promise<BaseQueryReturn>;
+    endpoints: (builder: BuilderType) => T;
+    cacheTimeout?: number;
+    middlewares?: ApiMiddleware[];
+    plugins?: ApiPlugin[];
+}
+interface QueryHookOption {
+    skip: boolean;
+}
+type MiddlewareContext = {
+    arg: any;
+    def: any;
+    get: any;
+    set: any;
+};
+type ApiMiddleware = (ctx: MiddlewareContext, next: () => Promise<{
+    data?: any;
+    error?: any;
+}>) => Promise<{
+    data?: any;
+    error?: any;
+}>;
+type ApiPlugin = {
+    name: string;
+    onInit?: (api: {
+        baseQuery: any;
+        endpoints: any;
+    }) => void;
+    beforeQuery?: (ctx: PluginContext) => void | Promise<void>;
+    middleware?: ApiMiddleware;
+    afterQuery?: (result: any, ctx: PluginContext) => void | Promise<void>;
+    onError?: (error: any, ctx: PluginContext) => void | Promise<void>;
+};
+type PluginContext = {
+    arg: any;
+    def: any;
+    get: any;
+    set: any;
+};
+
+declare function createApi<T extends EndpointsMap>(params: CreateApiParams<T>): HooksFromEndpoints<T>;
+
+export { type ApiMiddleware, type ApiPlugin, createApi };

package/dist/query/index.d.ts

@@ -0,0 +1,116 @@
+type QueryFnObj = {
+    url: string;
+    method: "GET" | "POST" | "PUT" | "DELETE" | "PATCH";
+    body?: any;
+    headers?: Record<string, any>;
+};
+type QueryFnReturn = string | QueryFnObj;
+type QueryFn<Arg = any> = (arg: Arg) => QueryFnReturn;
+type MainQueryReturnTypes = Promise<{
+    data: any;
+    error?: undefined;
+} | {
+    error: any;
+    data?: undefined;
+}>;
+type ApiOption<Arg, R> = {
+    transformResponse?: (currData: any, preData: any) => Promise<R> | R;
+    transformError?: (currError: any, preError: any) => Promise<any> | any;
+    transformBody?: (body: Arg) => Promise<any> | any;
+    transformHeader?: (header: Record<string, any>) => Promise<Record<string, any>> | Record<string, any>;
+    onError?: (err: any) => Promise<void> | void;
+    onSuccess?: (data: R) => Promise<void> | void;
+    queryFnc?: (arg: Arg, baseQuery: CreateApiParams<any>['baseQuery']) => MainQueryReturnTypes;
+    middlewares?: ApiMiddleware[];
+    plugins?: ApiPlugin[];
+};
+type QueryDef<Arg, Result> = {
+    type: 'query';
+    queryFn?: QueryFn<Arg>;
+} & ApiOption<Arg, Result>;
+type MutationDef<Arg, Result> = {
+    type: 'mutation';
+    queryFn?: QueryFn<Arg>;
+} & ApiOption<Arg, Result>;
+type EndpointDef = QueryDef<any, any> | MutationDef<any, any>;
+type MainQueryHookResult<Result> = {
+    data?: Result;
+    isLoading: boolean;
+    isError: boolean;
+    isFetching: boolean;
+    isSuccess: boolean;
+    error: any;
+    reFetch: () => MainQueryReturnTypes;
+};
+type MainMutationState<Result> = {
+    data?: Result;
+    isLoading: boolean;
+    isError: boolean;
+    isSuccess: boolean;
+    error: any;
+};
+type EndpointsMap = Record<string, EndpointDef>;
+type HooksFromEndpoints<T extends EndpointsMap> = {
+    [K in keyof T as T[K] extends {
+        type: 'query';
+    } ? `use${Capitalize<string & K>}Query` : `use${Capitalize<string & K>}Mutation`]: T[K] extends QueryDef<infer Arg, infer Result> ? (arg: Arg, option?: QueryHookOption) => MainQueryHookResult<Result> : T[K] extends MutationDef<infer Arg, infer Result> ? () => readonly [(arg: Arg) => Promise<Result>, MainMutationState<Result>] : never;
+};
+type BuilderType = {
+    query<Result, Arg = void>(config: {
+        query?: (arg: Arg) => QueryFnReturn;
+    } & ApiOption<Arg, Result>): QueryDef<Arg, Result>;
+    mutation<Result, Arg = void>(config: {
+        query?: (arg: Arg) => QueryFnObj;
+    } & ApiOption<Arg, Result>): MutationDef<Arg, Result>;
+};
+type BaseQueryReturn<Data = any, Error = any> = {
+    data: Data;
+    error?: undefined;
+} | {
+    data?: undefined;
+    error: Error;
+};
+interface CreateApiParams<T extends EndpointsMap> {
+    baseQuery: (option: QueryFnReturn) => Promise<BaseQueryReturn>;
+    endpoints: (builder: BuilderType) => T;
+    cacheTimeout?: number;
+    middlewares?: ApiMiddleware[];
+    plugins?: ApiPlugin[];
+}
+interface QueryHookOption {
+    skip: boolean;
+}
+type MiddlewareContext = {
+    arg: any;
+    def: any;
+    get: any;
+    set: any;
+};
+type ApiMiddleware = (ctx: MiddlewareContext, next: () => Promise<{
+    data?: any;
+    error?: any;
+}>) => Promise<{
+    data?: any;
+    error?: any;
+}>;
+type ApiPlugin = {
+    name: string;
+    onInit?: (api: {
+        baseQuery: any;
+        endpoints: any;
+    }) => void;
+    beforeQuery?: (ctx: PluginContext) => void | Promise<void>;
+    middleware?: ApiMiddleware;
+    afterQuery?: (result: any, ctx: PluginContext) => void | Promise<void>;
+    onError?: (error: any, ctx: PluginContext) => void | Promise<void>;
+};
+type PluginContext = {
+    arg: any;
+    def: any;
+    get: any;
+    set: any;
+};
+
+declare function createApi<T extends EndpointsMap>(params: CreateApiParams<T>): HooksFromEndpoints<T>;
+
+export { type ApiMiddleware, type ApiPlugin, createApi };

package/dist/query/index.js

@@ -0,0 +1 @@
+"use strict";var q=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var C=Object.prototype.hasOwnProperty;var R=(e,n)=>{for(var i in n)q(e,i,{get:n[i],enumerable:!0})},O=(e,n,i,r)=>{if(n&&typeof n=="object"||typeof n=="function")for(let c of H(n))!C.call(e,c)&&c!==i&&q(e,c,{get:()=>n[c],enumerable:!(r=k(n,c))||r.enumerable});return e};var B=e=>O(q({},"__esModule",{value:!0}),e);var j={};R(j,{createApi:()=>D});module.exports=B(j);var x=require("react");var g=require("react");function A(e,n=[]){let i,r=[],c=l=>{let s=typeof l=="function"?l(i):l;i={...i,...s},r.forEach(u=>u())},m=()=>i,F=v(c,m,n);i=e(F,m);let w=l=>(r.push(l),()=>{r=r.filter(s=>s!==l)});return()=>(0,g.useSyncExternalStore)(w,m)}var v=(e,n,i)=>!i||i.length===0?e:i.reduceRight((r,c)=>c(e,n)(r),e);function J(e){return e.charAt(0).toUpperCase()+e.slice(1)}var N=async(e,n,i,r,c,m,F)=>{var w,l,s,u,h,p,T;n({isLoading:!0});try{let t=null,o=null,a=i().cashExp,M=Date.now(),S=!1;if(F||JSON.stringify(i().arg||{})!==JSON.stringify(e||{})?S=!1:S=a>=M,S&&(t=i().data),!S&&(r!=null&&r.queryFnc)){n({isFetching:!0});let{data:y,error:E}=await((w=r==null?void 0:r.queryFnc)==null?void 0:w.call(r,e,c));y&&(t=y),E&&(o=E)}else{let y=r.queryFn(e);if(r!=null&&r.transformHeader&&(y.headers=await((l=r==null?void 0:r.transformHeader)==null?void 0:l.call(r,y==null?void 0:y.headers))),r!=null&&r.transformBody&&(y.body=await((s=r==null?void 0:r.transformBody)==null?void 0:s.call(r,y==null?void 0:y.body))),!S){n({isFetching:!0});let{data:E,error:b}=await c(y);E&&(t=E),b&&(o=b)}}return t&&(r!=null&&r.transformResponse&&(t=await((u=r.transformResponse)==null?void 0:u.call(r,t,i().data))),r!=null&&r.onSuccess&&await((h=r.onSuccess)==null?void 0:h.call(r,t))),o&&(r!=null&&r.transformError&&(o=await((p=r.transformError)==null?void 0:p.call(r,o,i().error))),r!=null&&r.onError&&await((T=r.onError)==null?void 0:T.call(r,o))),t?(n({data:t,isSuccess:!0,isLoading:!1,isFetching:!1,cashExp:S?a:Date.now()+m,arg:e}),{data:t}):(n({isLoading:!1,isSuccess:!1,isFetching:!1,isError:!0,error:o,arg:e}),{error:o})}catch(t){return n({isLoading:!1,isSuccess:!1,isFetching:!1,isError:!0,error:t,arg:e}),{error:t}}};async function P(e,n,i,r,c,m,F,w,l){var T,t,o;let s={arg:e,def:r,get:i,set:n};for(let a of l)await((T=a.beforeQuery)==null?void 0:T.call(a,s));let u=-1,h=async a=>{if(a<=u)throw new Error("next() called multiple times");u=a;let M=w[a];return M?M(s,()=>h(a+1)):N(e,n,i,r,c,m,F)},p=await h(0);for(let a of l)await((t=a.afterQuery)==null?void 0:t.call(a,p,s));if(p!=null&&p.error)for(let a of l)await((o=a.onError)==null?void 0:o.call(a,p.error,s));return p}function D(e){let{baseQuery:n,endpoints:i,cacheTimeout:r=30*1e3,middlewares:c=[],plugins:m=[]}=e,w=i({query:s=>({type:"query",queryFn:s.query,...s}),mutation:s=>({type:"mutation",queryFn:s.query,...s})}),l={};for(let s in w){let u=w[s],h=`use${J(s)}`+(u.type==="query"?"Query":"Mutation"),p=(u.plugins||[]).filter(t=>(t==null?void 0:t.middleware)&&typeof t.middleware=="function").map(t=>t.middleware),T=A((t,o)=>({data:null,isLoading:!1,isError:!1,isFetching:!1,isSuccess:!1,error:null,arg:null,cashExp:0,query:a=>P(a,t,o,u,n,r,!1,[...c,...u.middlewares||[],...p],[...m,...u.plugins||[]]),reFetch:()=>{var a;return P((a=o())==null?void 0:a.arg,t,o,u,n,r,!0,[...c,...u.middlewares||[],...p],[...m,...u.plugins||[]])}}));u.type==="query"&&(l[h]=(t,o)=>{let{skip:a}=o||{},{query:M,error:S,isError:y,isLoading:E,isSuccess:b,reFetch:Q,data:L}=T();return(0,x.useEffect)(()=>{a||M(t)},[JSON.stringify(t||{})]),{error:S,isError:y,isLoading:E,isSuccess:b,data:L,reFetch:Q}}),u.type==="mutation"&&(l[h]=()=>{let{query:t,...o}=T();return[t,o]})}return l}0&&(module.exports={createApi});

package/dist/query/index.mjs

@@ -0,0 +1 @@
+import{a as Q}from"../chunk-SISWF3T4.mjs";import{useEffect as k}from"react";function x(s){return s.charAt(0).toUpperCase()+s.slice(1)}var H=async(s,u,y,r,h,q,A)=>{var E,l,t,o,m,c,w;u({isLoading:!0});try{let n=null,a=null,i=y().cashExp,S=Date.now(),p=!1;if(A||JSON.stringify(y().arg||{})!==JSON.stringify(s||{})?p=!1:p=i>=S,p&&(n=y().data),!p&&(r!=null&&r.queryFnc)){u({isFetching:!0});let{data:e,error:F}=await((E=r==null?void 0:r.queryFnc)==null?void 0:E.call(r,s,h));e&&(n=e),F&&(a=F)}else{let e=r.queryFn(s);if(r!=null&&r.transformHeader&&(e.headers=await((l=r==null?void 0:r.transformHeader)==null?void 0:l.call(r,e==null?void 0:e.headers))),r!=null&&r.transformBody&&(e.body=await((t=r==null?void 0:r.transformBody)==null?void 0:t.call(r,e==null?void 0:e.body))),!p){u({isFetching:!0});let{data:F,error:b}=await h(e);F&&(n=F),b&&(a=b)}}return n&&(r!=null&&r.transformResponse&&(n=await((o=r.transformResponse)==null?void 0:o.call(r,n,y().data))),r!=null&&r.onSuccess&&await((m=r.onSuccess)==null?void 0:m.call(r,n))),a&&(r!=null&&r.transformError&&(a=await((c=r.transformError)==null?void 0:c.call(r,a,y().error))),r!=null&&r.onError&&await((w=r.onError)==null?void 0:w.call(r,a))),n?(u({data:n,isSuccess:!0,isLoading:!1,isFetching:!1,cashExp:p?i:Date.now()+q,arg:s}),{data:n}):(u({isLoading:!1,isSuccess:!1,isFetching:!1,isError:!0,error:a,arg:s}),{error:a})}catch(n){return u({isLoading:!1,isSuccess:!1,isFetching:!1,isError:!0,error:n,arg:s}),{error:n}}};async function M(s,u,y,r,h,q,A,E,l){var w,n,a;let t={arg:s,def:r,get:y,set:u};for(let i of l)await((w=i.beforeQuery)==null?void 0:w.call(i,t));let o=-1,m=async i=>{if(i<=o)throw new Error("next() called multiple times");o=i;let S=E[i];return S?S(t,()=>m(i+1)):H(s,u,y,r,h,q,A)},c=await m(0);for(let i of l)await((n=i.afterQuery)==null?void 0:n.call(i,c,t));if(c!=null&&c.error)for(let i of l)await((a=i.onError)==null?void 0:a.call(i,c.error,t));return c}function O(s){let{baseQuery:u,endpoints:y,cacheTimeout:r=30*1e3,middlewares:h=[],plugins:q=[]}=s,E=y({query:t=>({type:"query",queryFn:t.query,...t}),mutation:t=>({type:"mutation",queryFn:t.query,...t})}),l={};for(let t in E){let o=E[t],m=`use${x(t)}`+(o.type==="query"?"Query":"Mutation"),c=(o.plugins||[]).filter(n=>(n==null?void 0:n.middleware)&&typeof n.middleware=="function").map(n=>n.middleware),w=Q((n,a)=>({data:null,isLoading:!1,isError:!1,isFetching:!1,isSuccess:!1,error:null,arg:null,cashExp:0,query:i=>M(i,n,a,o,u,r,!1,[...h,...o.middlewares||[],...c],[...q,...o.plugins||[]]),reFetch:()=>{var i;return M((i=a())==null?void 0:i.arg,n,a,o,u,r,!0,[...h,...o.middlewares||[],...c],[...q,...o.plugins||[]])}}));o.type==="query"&&(l[m]=(n,a)=>{let{skip:i}=a||{},{query:S,error:p,isError:e,isLoading:F,isSuccess:b,reFetch:T,data:g}=w();return k(()=>{i||S(n)},[JSON.stringify(n||{})]),{error:p,isError:e,isLoading:F,isSuccess:b,data:g,reFetch:T}}),o.type==="mutation"&&(l[m]=()=>{let{query:n,...a}=w();return[n,a]})}return l}export{O as createApi};

package/package.json

@@ -1,21 +1,21 @@
 {
   "name": "zustic",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "A fast, minimal state management solution for React ecosystems. Works seamlessly with React, Next.js, and React Native, offering predictable state updates with a tiny footprint.",
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
-  "types": "dist/index.d.ts",
   "scripts": {
-    "build": "tsup src/index.ts --format esm,cjs --dts --clean --external react",
-    "start:cjs": "node dist/cjs/index.js",
-    "start:esm": "node dist/esm/index.js",
-    "start": "ts-node src/index.ts",
+    "build": "tsup",
     "test": "npm run build && npm link"
   },
   "exports": {
     ".": {
-      "require": "./dist/index.js",
-      "import": "./dist/index.mjs"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./query": {
+      "types": "./dist/query/index.d.ts",
+      "import": "./dist/query/index.mjs",
+      "require": "./dist/query/index.js"
     }
   },
   "directories": {
@@ -38,7 +38,7 @@
     "nextjs",
     "state"
   ],
-  "homepage": "https://zustic.github.io/",
+  "homepage": "https://zustic.github.io",
   "files": [
     "dist/**/*",
     "README.md"