@nomos-ui/uanela-redux-next 0.0.3 → 0.0.5

package/dist/components/data-manipulation/create-data-wrapper.d.ts

@@ -2,68 +2,96 @@ import React from "react";
 import { UseFormReturn } from "react-hook-form";
 import { z } from "zod";
 /**
- * Props for the CreateDataWrapper
+ * Props for the CreateDataWrapper component
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
  */
-type CreateDataWrapperProps = {
-    /** Optional ID for the component */
-    id?: string;
-    /** Name identifier used to generate the API mutation name if not provided */
-    name: string;
-    /** Form component to render for data creation */
-    Form: (props: any) => React.JSX.Element;
+type CreateDataWrapperProps<Input, Response, FormProps extends Record<string, any> = Record<string, any>> = {
+    /**
+     * The form component to render.
+     * Receives all mutation state from the library (e.g. isLoading, isPending, error),
+     * formProps, and the onSubmit handler.
+     */
+    Form: (props: FormProps & {
+        onSubmit: any;
+    } & Record<string, any>) => React.JSX.Element;
     /**
-     * Redux API mutation name (e.g., 'useCreateProductMutation')
-     * If not provided, will be generated as `useCreate${pascalCase(name)}Mutation`
+     * The mutation hook to call for data creation.
+     * Pass the hook itself (e.g. useCreateProductMutation), not its result.
+     * The component will call it internally following React's rules of hooks.
+     *
+     * @example
+     * useMutation={useCreateProductMutation}
+     */
+    useMutation: () => any;
+    /**
+     * Callback executed after a successful creation.
+     * Receives the API response, the cleaned submitted data, and the form instance.
+     *
+     * @param x.response - The raw API response
+     * @param x.data - The cleaned data that was submitted
+     * @param x.form - The react-hook-form instance typed to Input
      */
-    createMutation?: string;
-    /** Flag to show alert after successful creation */
-    showAlertAfterSuccessCreate?: boolean;
-    /** Callback function executed after successful data creation */
     doAfterSuccessCreate?: (x: {
-        response: any;
-        data: any;
-        form: UseFormReturn;
+        response: Response;
+        data: Input;
+        form: UseFormReturn<Input extends Record<string, any> ? Input : any>;
     }) => Promise<any> | void;
-    /** Function to transform form data before submission */
-    cleanDataBeforeCreate?: (data: any) => void;
-    /** CSS class name for the component */
-    className?: string;
-    /** Buttons to be displayed in the top-right corner */
-    topButtons?: React.ReactNode;
-    /** Props specific to the form component */
-    formProps: {
+    /**
+     * Optional function to transform or clean the form data before submission.
+     * Defaults to an identity function (returns data as-is).
+     *
+     * @param data - Raw form data
+     * @returns Cleaned data to be submitted
+     */
+    cleanDataBeforeCreate?: (data: Input) => Promise<Input>;
+    /**
+     * Props passed directly to the Form component.
+     */
+    formProps: FormProps & {
         /** Label for the form's submit button */
         buttonLabel: string;
         /** Optional CSS class name for the form */
         className?: string;
-        /** Flag to maintain loading state after submission */
+        /** If true, keeps the loading state active after submission */
         keepIsLoading?: boolean;
-        /** Additional data to be passed to the form */
+        /** Additional data required by the form (e.g. select options, related records) */
         requiredData?: Record<string, any>;
-        /** Zod schema for form validation */
+        /** Zod schema used for form validation */
         schema: z.ZodObject<any>;
     };
 };
 /**
- * A generic component that handles data creation logic using Redux API mutations
- * Manages form submission, data transformation, and post-creation callbacks
- * Also supports template-based default values from Redux state
+ * A generic wrapper that handles data creation logic independently of the query library.
+ * Supports both RTK Query and TanStack Query via the provider config.
+ *
+ * Responsibilities:
+ * - Calls the provided mutation hook
+ * - Extracts and normalizes the trigger function based on the query library
+ * - Passes all raw mutation state directly to the Form (no normalization)
+ * - Handles submit orchestration: cleaning data, triggering mutation, running callbacks, resetting form
+ *
+ * The Form component receives everything the mutation hook provides plus `onSubmit`.
  *
- * @param props Component props
- * @returns A form component with data creation capabilities
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
  *
  * @example
  * ```tsx
- * <CreateDataWrapper
- *   name="product"
+ * <CreateDataWrapper<CreateProductInput, Product, ProductFormProps>
  *   Form={ProductForm}
+ *   useMutation={useCreateProductMutation}
+ *   doAfterSuccessCreate={({ response }) => router.push(`/products/${response.id}`)}
  *   formProps={{
  *     buttonLabel: "Create Product",
- *     schema: productSchema
+ *     schema: productSchema,
  *   }}
  * />
  * ```
  */
-export default function CreateDataWrapper({ name, Form, createMutation, doAfterSuccessCreate, cleanDataBeforeCreate, formProps, }: CreateDataWrapperProps): import("react/jsx-runtime").JSX.Element;
+export default function CreateDataWrapper<Input, Response, FormProps extends Record<string, any> = Record<string, any>>({ Form, useMutation, doAfterSuccessCreate, cleanDataBeforeCreate, formProps, }: CreateDataWrapperProps<Input, Response, FormProps>): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=create-data-wrapper.d.ts.map

package/dist/components/data-manipulation/create-data-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-data-wrapper.d.ts","sourceRoot":"","sources":["../../../src/components/data-manipulation/create-data-wrapper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiC,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAKxB;;GAEG;AACH,KAAK,sBAAsB,GAAG;IAC5B,oCAAoC;IACpC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,6EAA6E;IAC7E,IAAI,EAAE,MAAM,CAAC;IACb,iDAAiD;IACjD,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mDAAmD;IACnD,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,gEAAgE;IAChE,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE;QACzB,QAAQ,EAAE,GAAG,CAAC;QACd,IAAI,EAAE,GAAG,CAAC;QACV,IAAI,EAAE,aAAa,CAAC;KACrB,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC1B,wDAAwD;IACxD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,2CAA2C;IAC3C,SAAS,EAAE;QACT,yCAAyC;QACzC,WAAW,EAAE,MAAM,CAAC;QACpB,2CAA2C;QAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,sDAAsD;QACtD,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,+CAA+C;QAC/C,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QACnC,qCAAqC;QACrC,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;KAC1B,CAAC;CACH,CAAC;AAEF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,IAAI,EACJ,IAAI,EACJ,cAAc,EACd,oBAAoB,EACpB,qBAAsC,EACtC,SAAS,GACV,EAAE,sBAAsB,2CAwDxB"}
+{"version":3,"file":"create-data-wrapper.d.ts","sourceRoot":"","sources":["../../../src/components/data-manipulation/create-data-wrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB;;;;;;GAMG;AACH,KAAK,sBAAsB,CACzB,KAAK,EACL,QAAQ,EACR,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IACzD;IACF;;;;OAIG;IACH,IAAI,EAAE,CACJ,KAAK,EAAE,SAAS,GAAG;QAAE,QAAQ,EAAE,GAAG,CAAA;KAAE,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KACvD,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACvB;;;;;;;OAOG;IACH,WAAW,EAAE,MAAM,GAAG,CAAC;IACvB;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE;QACzB,QAAQ,EAAE,QAAQ,CAAC;QACnB,IAAI,EAAE,KAAK,CAAC;QACZ,IAAI,EAAE,aAAa,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC,CAAC;KACtE,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC1B;;;;;;OAMG;IACH,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,CAAC;IACxD;;OAEG;IACH,SAAS,EAAE,SAAS,GAAG;QACrB,yCAAyC;QACzC,WAAW,EAAE,MAAM,CAAC;QACpB,2CAA2C;QAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,+DAA+D;QAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,kFAAkF;QAClF,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QACnC,0CAA0C;QAC1C,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;KAC1B,CAAC;CACH,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,KAAK,EACL,QAAQ,EACR,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3D,EACA,IAAI,EACJ,WAAW,EACX,oBAAoB,EACpB,qBAA4C,EAC5C,SAAS,GACV,EAAE,sBAAsB,CAAC,KAAK,EAAE,QAAQ,EAAE,SAAS,CAAC,2CAuCpD"}

package/dist/components/data-manipulation/create-data-wrapper.js

@@ -2,47 +2,56 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = CreateDataWrapper;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const change_case_all_1 = require("change-case-all");
+const core_1 = require("@nomos-ui/core");
+const utils_1 = require("@nomos-ui/core/utils");
 const react_1 = require("react");
-const navigation_1 = require("next/navigation");
-const react_redux_1 = require("react-redux");
-const api_provider_1 = require("../api-provider");
 /**
- * A generic component that handles data creation logic using Redux API mutations
- * Manages form submission, data transformation, and post-creation callbacks
- * Also supports template-based default values from Redux state
+ * A generic wrapper that handles data creation logic independently of the query library.
+ * Supports both RTK Query and TanStack Query via the provider config.
  *
- * @param props Component props
- * @returns A form component with data creation capabilities
+ * Responsibilities:
+ * - Calls the provided mutation hook
+ * - Extracts and normalizes the trigger function based on the query library
+ * - Passes all raw mutation state directly to the Form (no normalization)
+ * - Handles submit orchestration: cleaning data, triggering mutation, running callbacks, resetting form
+ *
+ * The Form component receives everything the mutation hook provides plus `onSubmit`.
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
  *
  * @example
  * ```tsx
- * <CreateDataWrapper
- *   name="product"
+ * <CreateDataWrapper<CreateProductInput, Product, ProductFormProps>
  *   Form={ProductForm}
+ *   useMutation={useCreateProductMutation}
+ *   doAfterSuccessCreate={({ response }) => router.push(`/products/${response.id}`)}
  *   formProps={{
  *     buttonLabel: "Create Product",
- *     schema: productSchema
+ *     schema: productSchema,
  *   }}
  * />
  * ```
  */
-function CreateDataWrapper({ name, Form, createMutation, doAfterSuccessCreate, cleanDataBeforeCreate = (data) => data, formProps, }) {
-    const api = (0, api_provider_1.useApi)();
-    const [createData, state] = api[createMutation || `useCreate${(0, change_case_all_1.pascalCase)(name)}Mutation`]();
-    const pathname = (0, navigation_1.usePathname)();
+function CreateDataWrapper({ Form, useMutation, doAfterSuccessCreate, cleanDataBeforeCreate = async (data) => data, formProps, }) {
+    const { config } = (0, core_1.useProvider)();
+    const mutationResult = useMutation();
+    const { trigger, state } = (0, utils_1.extractMutation)(mutationResult, config.queryLibrary);
     /**
-     * Handles form submission and data creation
-     * @param data The form data to be submitted
-     * @param form The react-hook-form form instance
-     * @returns The API response or error
+     * Handles form submission.
+     * Cleans the data, triggers the mutation, runs the success callback, and resets the form.
+     * Calls onError if provided and the mutation fails.
+     *
+     * @param data - The validated form data
+     * @param form - The react-hook-form instance typed to Input
+     * @param onError - Optional callback invoked with the original data and error on failure
      */
-    const handleCreateData = (0, react_1.useCallback)(async function handleCreateData(data, form, onError) {
-        const cleanedData = cleanDataBeforeCreate(data);
+    const handleCreateData = (0, react_1.useCallback)(async function (data, form, onError) {
+        const cleanedData = await cleanDataBeforeCreate(data);
         try {
-            const response = await createData(data).unwrap();
-            doAfterSuccessCreate &&
-                (await doAfterSuccessCreate({ response, data: cleanedData, form }));
+            const response = await trigger(cleanedData);
+            await doAfterSuccessCreate?.({ response, data: cleanedData, form });
             form.reset();
             return response;
         }
@@ -50,16 +59,7 @@ function CreateDataWrapper({ name, Form, createMutation, doAfterSuccessCreate, c
             onError?.(data, err);
             return err;
         }
-    }, [name, Form]);
-    (0, react_1.useEffect)(() => {
-        const listHref = pathname.split("/");
-        listHref.pop();
-    }, [pathname]);
-    // Get template data from Redux store if available
-    const template = (0, react_redux_1.useSelector)((state) => state.app.template);
-    return ((0, jsx_runtime_1.jsx)(Form, { ...state, ...formProps, ...(template &&
-            template.name === name && {
-            defaultValues: template.data,
-        }), onSubmit: handleCreateData }));
+    }, [trigger]);
+    return (0, jsx_runtime_1.jsx)(Form, { ...state, ...formProps, onSubmit: handleCreateData });
 }
 //# sourceMappingURL=create-data-wrapper.js.map

package/dist/components/data-manipulation/create-data-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-data-wrapper.js","sourceRoot":"","sources":["../../../src/components/data-manipulation/create-data-wrapper.tsx"],"names":[],"mappings":";;AAwEA,oCA+DC;;AAvID,qDAA6C;AAC7C,iCAAsD;AAGtD,gDAA8C;AAC9C,6CAA0C;AAC1C,kDAAyC;AA8CzC;;;;;;;;;;;;;;;;;;;GAmBG;AACH,SAAwB,iBAAiB,CAAC,EACxC,IAAI,EACJ,IAAI,EACJ,cAAc,EACd,oBAAoB,EACpB,qBAAqB,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EACtC,SAAS,GACc;IACvB,MAAM,GAAG,GAAG,IAAA,qBAAM,GAAE,CAAC;IACrB,MAAM,CAAC,UAAU,EAAE,KAAK,CAAC,GAAI,GAAW,CACtC,cAAc,IAAI,YAAY,IAAA,4BAAU,EAAC,IAAI,CAAC,UAAU,CACzD,EAAE,CAAC;IACJ,MAAM,QAAQ,GAAG,IAAA,wBAAW,GAAE,CAAC;IAE/B;;;;;OAKG;IACH,MAAM,gBAAgB,GAAG,IAAA,mBAAW,EAClC,KAAK,UAAU,gBAAgB,CAC7B,IAAsC,EACtC,IAAmB,EACnB,OAAsE;QAEtE,MAAM,WAAW,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;QAEhD,IAAI,CAAC;YACH,MAAM,QAAQ,GAAG,MAAM,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,CAAC;YAEjD,oBAAoB;gBAClB,CAAC,MAAM,oBAAoB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;YAEtE,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,OAAO,QAAQ,CAAC;QAClB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;YACrB,OAAO,GAAG,CAAC;QACb,CAAC;IACH,CAAC,EACD,CAAC,IAAI,EAAE,IAAI,CAAC,CACb,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACrC,QAAQ,CAAC,GAAG,EAAE,CAAC;IACjB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,kDAAkD;IAClD,MAAM,QAAQ,GAAG,IAAA,yBAAW,EAAC,CAAC,KAAU,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAEjE,OAAO,CACL,uBAAC,IAAI,OACC,KAAK,KACL,SAAS,KACT,CAAC,QAAQ;YACX,QAAQ,CAAC,IAAI,KAAK,IAAI,IAAI;YACxB,aAAa,EAAE,QAAQ,CAAC,IAAI;SAC7B,CAAC,EACJ,QAAQ,EAAE,gBAAgB,GAC1B,CACH,CAAC;AACJ,CAAC"}
+{"version":3,"file":"create-data-wrapper.js","sourceRoot":"","sources":["../../../src/components/data-manipulation/create-data-wrapper.tsx"],"names":[],"mappings":";;AAsGA,oCAiDC;;AAvJD,yCAA6C;AAC7C,gDAAuD;AACvD,iCAA2C;AAuE3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,SAAwB,iBAAiB,CAIvC,EACA,IAAI,EACJ,WAAW,EACX,oBAAoB,EACpB,qBAAqB,GAAG,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,IAAI,EAC5C,SAAS,GAC0C;IACnD,MAAM,EAAE,MAAM,EAAE,GAAG,IAAA,kBAAW,GAAE,CAAC;IACjC,MAAM,cAAc,GAAG,WAAW,EAAE,CAAC;IAErC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,EACxC,cAAc,EACd,MAAM,CAAC,YAAY,CACpB,CAAC;IAEF;;;;;;;;OAQG;IACH,MAAM,gBAAgB,GAAG,IAAA,mBAAW,EAClC,KAAK,WACH,IAAW,EACX,IAAoE,EACpE,OAA2C;QAE3C,MAAM,WAAW,GAAG,MAAM,qBAAqB,CAAC,IAAI,CAAC,CAAC;QACtD,IAAI,CAAC;YACH,MAAM,QAAQ,GAAG,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC;YAC5C,MAAM,oBAAoB,EAAE,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC;YACpE,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,OAAO,QAAQ,CAAC;QAClB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;YACrB,OAAO,GAAG,CAAC;QACb,CAAC;IACH,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,uBAAC,IAAI,OAAK,KAAK,KAAM,SAAS,EAAE,QAAQ,EAAE,gBAAgB,GAAI,CAAC;AACxE,CAAC"}

package/dist/components/modals/create.modal.d.ts

@@ -1,71 +1,79 @@
 import React from "react";
 import { z } from "zod";
 import { ModalProps } from "@nomos-ui/common/modals";
+import { UseFormReturn } from "react-hook-form";
 /**
  * Props for the CreateDataModal component
- * @template DataType The type of data being created
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
  */
-export type CreateDataModalProps<T, FormProps = any> = {
-    /** Optional ID for the modal */
-    id?: string;
-    /** Name identifier for the form/modal - used to generate API mutation name if not provided */
-    name: string;
+export type CreateDataModalProps<Input, Response, FormProps extends Record<string, any> = Record<string, any>> = {
     /** Form component to be rendered inside the modal for data creation */
     Form: (props: any) => React.JSX.Element;
     /**
-     * Redux API mutation name (e.g., 'useCreateProductMutation')
-     * If not provided, will be generated as `useCreate${pascalCase(name)}Mutation`
+     * The mutation hook to call for data creation.
+     * Pass the hook itself (e.g. useCreateProductMutation), not its result.
+     * The component will call it internally following React's rules of hooks.
+     *
+     * @example
+     * useMutation={useCreateProductMutation}
      */
-    createMutation?: string;
+    useMutation: () => any;
     /** Title displayed in the modal header */
     title: string;
     /** Optional description text for the modal */
     description?: string;
     /**
-     * When true, maintains the form button's loading state after submission
-     * Useful when additional processing is needed after data creation
+     * When true, maintains the form button's loading state after submission.
+     * Useful when additional processing is needed after data creation.
      */
     keepIsLoading?: boolean;
     /** Additional data to be passed to the form component */
     requiredData?: Record<string, any>;
-    /** Flag to show alert after successful creation */
-    showAlertAfterSuccessCreate?: boolean;
     /**
-     * Callback function executed after successful data creation
-     * Receives the created data and can perform additional operations
+     * Callback executed after successful data creation and modal close.
+     * Receives the API response, the cleaned submitted data, and the form instance.
+     *
+     * @param x.response - The raw API response
+     * @param x.data - The cleaned data that was submitted
+     * @param x.form - The react-hook-form instance typed to Input
      */
-    doAfterSuccessCreate?: (x: any) => Promise<any> | void;
+    doAfterSuccessCreate?: (x: {
+        response: Response;
+        data: Input;
+        form: UseFormReturn<Input extends Record<string, any> ? Input : any>;
+    }) => Promise<any> | void;
     /** Function to transform form data before submission */
-    cleanDataBeforeCreate?: (data: any) => void;
-    /** CSS class name for the modal */
-    className?: string;
+    cleanDataBeforeCreate?: (data: Input) => Promise<Input>;
     /** Props for the modal dialog content */
-    contentProps?: ModalProps;
+    contentProps?: Omit<ModalProps, "children">;
     /** Zod schema for form validation */
     schema: z.ZodObject<any>;
-    /** Buttons to be displayed in the top-right corner of the modal, next to the title */
-    topButtons?: React.ReactNode;
     /** Props specific to the form component */
     formProps?: FormProps;
 };
 /**
- * A generic modal component for creating data with form validation
- * @template DataType The type of data being created
- * @param props Component props combining CreateDataModalProps and partial ModalProps
- * @returns A Modal component containing a form for data creation
+ * A generic modal component for creating data with form validation.
+ * Wraps CreateDataWrapper inside a Modal, handling modal close after successful creation.
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
  *
  * @example
  * ```tsx
- * <CreateDataModal<UserData>
- *   name="user"
- *   title="Create New User"
- *   schema={userSchema}
- *   formProps={{ buttonLabel: "Create User" }}
- *   Form={UserForm}
+ * <CreateDataModal<CreateProductInput, Product, ProductFormProps>
+ *   title="Create New Product"
+ *   schema={productSchema}
+ *   Form={ProductForm}
+ *   useMutation={useCreateProductMutation}
+ *   formProps={{ buttonLabel: "Create Product" }}
  *   isOpen={isOpen}
  *   setIsOpen={setIsOpen}
  * />
  * ```
  */
-export default function CreateDataModal<DataType, FormProps = any>({ name, title, description, keepIsLoading, requiredData, schema, formProps, topButtons, isOpen, setIsOpen, showConfirmButton, doAfterSuccessCreate, contentProps, ...props }: CreateDataModalProps<DataType, FormProps> & Partial<ModalProps>): import("react/jsx-runtime").JSX.Element;
+export default function CreateDataModal<Input, Response, FormProps extends Record<string, any> = Record<string, any>>({ title, description, keepIsLoading, requiredData, schema, formProps, isOpen, setIsOpen, showConfirmButton, doAfterSuccessCreate, cleanDataBeforeCreate, contentProps, Form, useMutation, }: CreateDataModalProps<Input, Response, FormProps> & Partial<ModalProps>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=create.modal.d.ts.map

package/dist/components/modals/create.modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create.modal.d.ts","sourceRoot":"","sources":["../../../src/components/modals/create.modal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAS,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAG5D;;;GAGG;AACH,MAAM,MAAM,oBAAoB,CAAC,CAAC,EAAE,SAAS,GAAG,GAAG,IAAI;IACrD,gCAAgC;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8FAA8F;IAC9F,IAAI,EAAE,MAAM,CAAC;IACb,uEAAuE;IACvE,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yDAAyD;IACzD,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,mDAAmD;IACnD,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACvD,wDAAwD;IACxD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B,qCAAqC;IACrC,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAA;IACxB,sFAAsF;IACtF,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,2CAA2C;IAE3C,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,QAAQ,EAAE,SAAS,GAAG,GAAG,EAAE,EACjE,IAAI,EACJ,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAA+B,EAC/B,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,OAAO,CAAC,UAAU,CAAC,2CAyCjE"}
+{"version":3,"file":"create.modal.d.ts","sourceRoot":"","sources":["../../../src/components/modals/create.modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAS,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE5D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD;;;;;;GAMG;AACH,MAAM,MAAM,oBAAoB,CAC9B,KAAK,EACL,QAAQ,EACR,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IACzD;IACF,uEAAuE;IACvE,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC;;;;;;;OAOG;IACH,WAAW,EAAE,MAAM,GAAG,CAAC;IACvB,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yDAAyD;IACzD,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE;QACzB,QAAQ,EAAE,QAAQ,CAAC;QACnB,IAAI,EAAE,KAAK,CAAC;QACZ,IAAI,EAAE,aAAa,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC,CAAC;KACtE,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC1B,wDAAwD;IACxD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,CAAC;IACxD,yCAAyC;IACzC,YAAY,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;IAC5C,qCAAqC;IACrC,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACzB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CACrC,KAAK,EACL,QAAQ,EACR,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3D,EACA,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAAoB,EACpB,qBAAqB,EACrB,YAAY,EACZ,IAAI,EACJ,WAAW,GACZ,EAAE,oBAAoB,CAAC,KAAK,EAAE,QAAQ,EAAE,SAAS,CAAC,GAAG,OAAO,CAAC,UAAU,CAAC,2CA+CxE"}

package/dist/components/modals/create.modal.js

@@ -1,4 +1,3 @@
-"use client";
 "use strict";
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
@@ -11,41 +10,44 @@ const tailwind_merge_1 = require("tailwind-merge");
 const modals_1 = require("@nomos-ui/common/modals");
 const create_data_wrapper_1 = __importDefault(require("../data-manipulation/create-data-wrapper"));
 /**
- * A generic modal component for creating data with form validation
- * @template DataType The type of data being created
- * @param props Component props combining CreateDataModalProps and partial ModalProps
- * @returns A Modal component containing a form for data creation
+ * A generic modal component for creating data with form validation.
+ * Wraps CreateDataWrapper inside a Modal, handling modal close after successful creation.
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
  *
  * @example
  * ```tsx
- * <CreateDataModal<UserData>
- *   name="user"
- *   title="Create New User"
- *   schema={userSchema}
- *   formProps={{ buttonLabel: "Create User" }}
- *   Form={UserForm}
+ * <CreateDataModal<CreateProductInput, Product, ProductFormProps>
+ *   title="Create New Product"
+ *   schema={productSchema}
+ *   Form={ProductForm}
+ *   useMutation={useCreateProductMutation}
+ *   formProps={{ buttonLabel: "Create Product" }}
  *   isOpen={isOpen}
  *   setIsOpen={setIsOpen}
  * />
  * ```
  */
-function CreateDataModal({ name, title, description, keepIsLoading, requiredData, schema, formProps, topButtons, isOpen, setIsOpen, showConfirmButton, doAfterSuccessCreate = () => { }, contentProps, ...props }) {
+function CreateDataModal({ title, description, keepIsLoading, requiredData, schema, formProps, isOpen, setIsOpen, showConfirmButton, doAfterSuccessCreate, cleanDataBeforeCreate, contentProps, Form, useMutation, }) {
     /**
-     * Handles modal closure and executes post-creation callback
-     * @param data The created data
+     * Closes the modal then fires the post-creation callback if provided.
+     *
+     * @param x - The object received from CreateDataWrapper's doAfterSuccessCreate
      */
-    const handleCloseModal = (0, react_1.useCallback)(function handleCloseModal(data) {
+    const handleCloseModal = (0, react_1.useCallback)(async function handleCloseModal(x) {
         setIsOpen(false);
-        doAfterSuccessCreate(data);
-    }, [name]);
+        await doAfterSuccessCreate?.(x);
+    }, [doAfterSuccessCreate, setIsOpen]);
     return ((0, jsx_runtime_1.jsx)(modals_1.Modal, { title: title, description: description, setIsOpen: setIsOpen, isOpen: isOpen, showConfirmButton: showConfirmButton, contentProps: {
             ...contentProps,
             className: (0, tailwind_merge_1.twMerge)(contentProps?.className, "max-h-[80vh] md:max-h-[90vh] overflow-auto"),
-        }, children: (0, jsx_runtime_1.jsx)(create_data_wrapper_1.default, { ...props, name: name, doAfterSuccessCreate: handleCloseModal, formProps: {
+        }, children: (0, jsx_runtime_1.jsx)(create_data_wrapper_1.default, { Form: Form, useMutation: useMutation, cleanDataBeforeCreate: cleanDataBeforeCreate, doAfterSuccessCreate: handleCloseModal, formProps: {
                 ...formProps,
-                keepIsLoading: keepIsLoading,
-                requiredData: requiredData,
-                schema: schema,
+                keepIsLoading,
+                requiredData,
+                schema,
             } }) }));
 }
 //# sourceMappingURL=create.modal.js.map

package/dist/components/modals/create.modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.modal.js","sourceRoot":"","sources":["../../../src/components/modals/create.modal.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;AA4Eb,kCAwDC;;AAlID,iCAA2C;AAE3C,mDAAyC;AACzC,oDAA4D;AAC5D,mGAAyE;AAmDzE;;;;;;;;;;;;;;;;;;GAkBG;AACH,SAAwB,eAAe,CAA4B,EACjE,IAAI,EACJ,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAAoB,GAAG,GAAG,EAAE,GAAE,CAAC,EAC/B,YAAY,EACZ,GAAG,KAAK,EACwD;IAChE;;;OAGG;IACH,MAAM,gBAAgB,GAAG,IAAA,mBAAW,EAClC,SAAS,gBAAgB,CAAC,IAAS;QACjC,SAAU,CAAC,KAAK,CAAC,CAAC;QAClB,oBAAqB,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,EACD,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,OAAO,CACL,uBAAC,cAAK,IACJ,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,iBAAiB,EAAE,iBAAiB,EACpC,YAAY,EAAE;YACZ,GAAG,YAAY;YACf,SAAS,EAAE,IAAA,wBAAO,EAChB,YAAY,EAAE,SAAS,EACvB,4CAA4C,CAC7C;SACF,YAED,uBAAC,6BAAiB,OACZ,KAAK,EACT,IAAI,EAAE,IAAI,EACV,oBAAoB,EAAE,gBAAgB,EACtC,SAAS,EAAE;gBACT,GAAI,SAAiB;gBACrB,aAAa,EAAE,aAAa;gBAC5B,YAAY,EAAE,YAAY;gBAC1B,MAAM,EAAE,MAAM;aACf,GACD,GACI,CACT,CAAC;AACJ,CAAC"}
+{"version":3,"file":"create.modal.js","sourceRoot":"","sources":["../../../src/components/modals/create.modal.tsx"],"names":[],"mappings":";;;;;AAqFA,kCAkEC;;AAvJD,iCAA2C;AAE3C,mDAAyC;AACzC,oDAA4D;AAC5D,mGAAyE;AA4DzE;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAwB,eAAe,CAIrC,EACA,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAAoB,EACpB,qBAAqB,EACrB,YAAY,EACZ,IAAI,EACJ,WAAW,GAC4D;IACvE;;;;OAIG;IACH,MAAM,gBAAgB,GAAG,IAAA,mBAAW,EAClC,KAAK,UAAU,gBAAgB,CAAC,CAI/B;QACC,SAAU,CAAC,KAAK,CAAC,CAAC;QAClB,MAAM,oBAAoB,EAAE,CAAC,CAAC,CAAC,CAAC;IAClC,CAAC,EACD,CAAC,oBAAoB,EAAE,SAAS,CAAC,CAClC,CAAC;IAEF,OAAO,CACL,uBAAC,cAAK,IACJ,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,iBAAiB,EAAE,iBAAiB,EACpC,YAAY,EAAE;YACZ,GAAG,YAAY;YACf,SAAS,EAAE,IAAA,wBAAO,EAChB,YAAY,EAAE,SAAS,EACvB,4CAA4C,CAC7C;SACF,YAED,uBAAC,6BAAiB,IAChB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,qBAAqB,EAAE,qBAAqB,EAC5C,oBAAoB,EAAE,gBAAgB,EACtC,SAAS,EAAE;gBACT,GAAI,SAAiB;gBACrB,aAAa;gBACb,YAAY;gBACZ,MAAM;aACP,GACD,GACI,CACT,CAAC;AACJ,CAAC"}

package/dist/components/modals/update.modal.d.ts

@@ -46,7 +46,7 @@ export type UpdateDataModalProps<DataType, FormProps = any> = {
     /** Additional props forwarded to the form */
     formProps?: FormProps;
     /** Props that apply to Radix Dialog content wrapper */
-    contentProps?: ModalProps;
+    contentProps?: Omit<ModalProps, "children">;
 };
 /**
  * A generic modal component for updating data with form validation.

package/dist/components/modals/update.modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"update.modal.d.ts","sourceRoot":"","sources":["../../../src/components/modals/update.modal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAS,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAG5D;;;GAGG;AACH,MAAM,MAAM,oBAAoB,CAAC,QAAQ,EAAE,SAAS,GAAG,GAAG,IAAI;IAC5D,gCAAgC;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8FAA8F;IAC9F,IAAI,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,0CAA0C;IAC1C,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACvD,qDAAqD;IACrD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qCAAqC;IACrC,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAA;IACxB,gDAAgD;IAChD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uDAAuD;IACvD,YAAY,CAAC,EAAE,UAAU,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,QAAQ,EAAE,SAAS,GAAG,GAAG,EAAE,EACjE,IAAI,EACJ,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAA+B,EAC/B,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,OAAO,CAAC,UAAU,CAAC,2CAyCjE"}
+{"version":3,"file":"update.modal.d.ts","sourceRoot":"","sources":["../../../src/components/modals/update.modal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAS,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAG5D;;;GAGG;AACH,MAAM,MAAM,oBAAoB,CAAC,QAAQ,EAAE,SAAS,GAAG,GAAG,IAAI;IAC5D,gCAAgC;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,8FAA8F;IAC9F,IAAI,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,0CAA0C;IAC1C,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACvD,qDAAqD;IACrD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qCAAqC;IACrC,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACzB,gDAAgD;IAChD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uDAAuD;IACvD,YAAY,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;CAC7C,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,QAAQ,EAAE,SAAS,GAAG,GAAG,EAAE,EACjE,IAAI,EACJ,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,MAAM,EACN,SAAS,EACT,iBAAiB,EACjB,oBAA+B,EAC/B,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,OAAO,CAAC,UAAU,CAAC,2CAyCjE"}

package/dist/components/pages/create-data-page/index.d.ts

@@ -1,25 +1,86 @@
 import React from "react";
 import { z } from "zod";
-type CreateDataPageProps<DataType> = {
-    id?: string;
-    name: string;
+import { UseFormReturn } from "react-hook-form";
+/**
+ * Props for the CreateDataPage component
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
+ */
+type CreateDataPageProps<Input, Response, FormProps extends Record<string, any> = Record<string, any>> = {
+    /** Form component to render for data creation */
     Form: (props: any) => React.JSX.Element;
-    createMutation?: string;
+    /**
+     * The mutation hook to call for data creation.
+     * Pass the hook itself (e.g. useCreateProductMutation), not its result.
+     * The component will call it internally following React's rules of hooks.
+     *
+     * @example
+     * useMutation={useCreateProductMutation}
+     */
+    useMutation: () => any;
+    /** Title displayed in the page header */
     title: string;
+    /** Description displayed below the page title */
     description: string;
+    /**
+     * When true, maintains the form button's loading state after submission.
+     * Useful when additional processing is needed after data creation.
+     */
     keepIsLoading?: boolean;
+    /** Additional data to be passed to the form component */
     requiredData?: Record<string, any>;
-    showAlertAfterSuccessCreate?: boolean;
-    doAfterSuccessCreate?: (x: any) => Promise<any> | void;
-    cleanDataBeforeCreate?: (data: any) => void;
-    className?: string;
+    /**
+     * Callback executed after successful data creation.
+     * Receives the API response, the cleaned submitted data, and the form instance.
+     *
+     * @param x.response - The raw API response
+     * @param x.data - The cleaned data that was submitted
+     * @param x.form - The react-hook-form instance typed to Input
+     */
+    doAfterSuccessCreate?: (x: {
+        response: Response;
+        data: Input;
+        form: UseFormReturn<Input extends Record<string, any> ? Input : any>;
+    }) => Promise<any> | void;
+    /**
+     * Optional function to transform or clean the form data before submission.
+     * Defaults to an identity function (returns data as-is).
+     */
+    cleanDataBeforeCreate?: (data: Input) => Promise<Input>;
+    /** Zod schema used for form validation */
     schema: z.ZodObject<any>;
-    topButtons?: any;
-    formProps: {
+    /** Buttons to be displayed in the top-right corner of the page, next to the title */
+    topButtons?: React.ReactNode[];
+    /** Props passed directly to the Form component */
+    formProps: FormProps & {
+        /** Label for the form's submit button */
         buttonLabel: string;
+        /** Optional CSS class name for the form */
         className?: string;
     };
 };
-export default function CreateDataPage<DataType>({ name, title, description, keepIsLoading, requiredData, schema, formProps, topButtons, ...props }: CreateDataPageProps<DataType>): import("react/jsx-runtime").JSX.Element;
+/**
+ * A generic page component for creating data with form validation.
+ * Wraps CreateDataWrapper inside a page layout with a title, description, and optional top buttons.
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
+ *
+ * @example
+ * ```tsx
+ * <CreateDataPage<CreateProductInput, Product, ProductFormProps>
+ *   title="Create Product"
+ *   description="Fill in the details to create a new product"
+ *   schema={productSchema}
+ *   Form={ProductForm}
+ *   useMutation={useCreateProductMutation}
+ *   formProps={{ buttonLabel: "Create Product" }}
+ * />
+ * ```
+ */
+export default function CreateDataPage<Input, Response, FormProps extends Record<string, any> = Record<string, any>>({ title, description, keepIsLoading, requiredData, schema, formProps, topButtons, Form, useMutation, doAfterSuccessCreate, cleanDataBeforeCreate, }: CreateDataPageProps<Input, Response, FormProps>): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/pages/create-data-page/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/pages/create-data-page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAKxB,KAAK,mBAAmB,CAAC,QAAQ,IAAI;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACvD,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAA;IACxB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,SAAS,EAAE;QACT,WAAW,EAAE,MAAM,CAAC;QACpB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;CACH,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,QAAQ,EAAE,EAC/C,IAAI,EACJ,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,GAAG,KAAK,EACT,EAAE,mBAAmB,CAAC,QAAQ,CAAC,2CAwC/B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/pages/create-data-page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAKhD;;;;;;GAMG;AACH,KAAK,mBAAmB,CACtB,KAAK,EACL,QAAQ,EACR,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IACzD;IACF,iDAAiD;IACjD,IAAI,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IACxC;;;;;;;OAOG;IACH,WAAW,EAAE,MAAM,GAAG,CAAC;IACvB,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,WAAW,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,yDAAyD;IACzD,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC;;;;;;;OAOG;IACH,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE;QACzB,QAAQ,EAAE,QAAQ,CAAC;QACnB,IAAI,EAAE,KAAK,CAAC;QACZ,IAAI,EAAE,aAAa,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC,CAAC;KACtE,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IAC1B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,CAAC;IACxD,0CAA0C;IAC1C,MAAM,EAAE,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACzB,qFAAqF;IACrF,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAC/B,kDAAkD;IAClD,SAAS,EAAE,SAAS,GAAG;QACrB,yCAAyC;QACzC,WAAW,EAAE,MAAM,CAAC;QACpB,2CAA2C;QAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;CACH,CAAC;AAEF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CACpC,KAAK,EACL,QAAQ,EACR,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3D,EACA,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,IAAI,EACJ,WAAW,EACX,oBAAoB,EACpB,qBAAqB,GACtB,EAAE,mBAAmB,CAAC,KAAK,EAAE,QAAQ,EAAE,SAAS,CAAC,2CAwCjD"}

package/dist/components/pages/create-data-page/index.js

@@ -8,15 +8,35 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const navigation_1 = require("next/navigation");
 const create_data_wrapper_1 = __importDefault(require("../../data-manipulation/create-data-wrapper"));
 const page_title_and_description_1 = __importDefault(require("../components/page-title-and-description"));
-function CreateDataPage({ name, title, description, keepIsLoading, requiredData, schema, formProps, topButtons, ...props }) {
+/**
+ * A generic page component for creating data with form validation.
+ * Wraps CreateDataWrapper inside a page layout with a title, description, and optional top buttons.
+ *
+ * @template Input - The shape of the form values / data being submitted
+ * @template Response - The shape of the API response returned after successful creation
+ * @template FormProps - Additional props accepted by the Form component
+ *
+ * @example
+ * ```tsx
+ * <CreateDataPage<CreateProductInput, Product, ProductFormProps>
+ *   title="Create Product"
+ *   description="Fill in the details to create a new product"
+ *   schema={productSchema}
+ *   Form={ProductForm}
+ *   useMutation={useCreateProductMutation}
+ *   formProps={{ buttonLabel: "Create Product" }}
+ * />
+ * ```
+ */
+function CreateDataPage({ title, description, keepIsLoading, requiredData, schema, formProps, topButtons, Form, useMutation, doAfterSuccessCreate, cleanDataBeforeCreate, }) {
     const pathname = (0, navigation_1.usePathname)();
     const listHref = pathname.split("/");
     listHref.pop();
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "grid md:gap-4 gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex justify-between items-center", children: (0, jsx_runtime_1.jsx)(page_title_and_description_1.default, { title: title, description: description }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-background rounded-lg lg:h-[calc(100vh-154px)] h-[calc(100vh-140px)] md:p-4 p-2 border-input border ", children: (0, jsx_runtime_1.jsx)("div", { className: "main-container-content", children: (0, jsx_runtime_1.jsx)(create_data_wrapper_1.default, { ...props, name: name, formProps: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "grid md:gap-4 gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex justify-between items-center", children: (0, jsx_runtime_1.jsx)(page_title_and_description_1.default, { title: title, description: description }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-background rounded-lg lg:h-[calc(100vh-154px)] h-[calc(100vh-140px)] md:p-4 p-2 border-input border", children: (0, jsx_runtime_1.jsx)("div", { className: "main-container-content", children: (0, jsx_runtime_1.jsx)(create_data_wrapper_1.default, { Form: Form, useMutation: useMutation, cleanDataBeforeCreate: cleanDataBeforeCreate, doAfterSuccessCreate: doAfterSuccessCreate, formProps: {
                             ...formProps,
-                            keepIsLoading: keepIsLoading,
-                            requiredData: requiredData,
-                            schema: schema,
+                            keepIsLoading,
+                            requiredData,
+                            schema,
                         } }) }) })] }));
 }
 //# sourceMappingURL=index.js.map

package/dist/components/pages/create-data-page/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/pages/create-data-page/index.tsx"],"names":[],"mappings":";;;;;AA2BA,iCAkDC;;AA3ED,gDAA8C;AAC9C,sGAA4E;AAC5E,0GAA+E;AAuB/E,SAAwB,cAAc,CAAW,EAC/C,IAAI,EACJ,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,GAAG,KAAK,EACsB;IAC9B,MAAM,QAAQ,GAAG,IAAA,wBAAW,GAAE,CAAC;IAE/B,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACrC,QAAQ,CAAC,GAAG,EAAE,CAAC;IAEf,OAAO,CACL,iCAAK,SAAS,EAAC,qBAAqB,aAClC,gCAAK,SAAS,EAAC,mCAAmC,YAChD,uBAAC,oCAAuB,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,GAc/D,EACN,gCAAK,SAAS,EAAC,yGAAyG,YACtH,gCAAK,SAAS,EAAC,wBAAwB,YACrC,uBAAC,6BAAiB,OACZ,KAAK,EACT,IAAI,EAAE,IAAI,EACV,SAAS,EAAE;4BACT,GAAG,SAAS;4BACZ,aAAa,EAAE,aAAa;4BAC5B,YAAY,EAAE,YAAY;4BAC1B,MAAM,EAAE,MAAM;yBACf,GACD,GACE,GACF,IACF,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/pages/create-data-page/index.tsx"],"names":[],"mappings":";;;;;AA4FA,iCAwDC;;AAjJD,gDAA8C;AAC9C,sGAA4E;AAC5E,0GAA+E;AAmE/E;;;;;;;;;;;;;;;;;;;GAmBG;AACH,SAAwB,cAAc,CAIpC,EACA,KAAK,EACL,WAAW,EACX,aAAa,EACb,YAAY,EACZ,MAAM,EACN,SAAS,EACT,UAAU,EACV,IAAI,EACJ,WAAW,EACX,oBAAoB,EACpB,qBAAqB,GAC2B;IAChD,MAAM,QAAQ,GAAG,IAAA,wBAAW,GAAE,CAAC;IAC/B,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IACrC,QAAQ,CAAC,GAAG,EAAE,CAAC;IAEf,OAAO,CACL,iCAAK,SAAS,EAAC,qBAAqB,aAClC,gCAAK,SAAS,EAAC,mCAAmC,YAChD,uBAAC,oCAAuB,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,GAa/D,EACN,gCAAK,SAAS,EAAC,wGAAwG,YACrH,gCAAK,SAAS,EAAC,wBAAwB,YACrC,uBAAC,6BAAiB,IAChB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,qBAAqB,EAAE,qBAAqB,EAC5C,oBAAoB,EAAE,oBAAoB,EAC1C,SAAS,EAAE;4BACT,GAAG,SAAS;4BACZ,aAAa;4BACb,YAAY;4BACZ,MAAM;yBACP,GACD,GACE,GACF,IACF,CACP,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nomos-ui/uanela-redux-next",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "Uanela Como Redux & Next ToolKit",
   "module": "dist/exports/index.js",
   "types": "dist/exports/index.d.ts",
@@ -69,6 +69,7 @@
     "zod": "^4.3.5"
   },
   "dependencies": {
+    "@nomos-ui/core": "^0.0.8",
     "uuid4": "^2.0.3"
   }
 }