npm - @mkt-loitd/react-table-grid-custom - Versions diffs - 1.2.2 → 1.2.3 - Mend

@mkt-loitd/react-table-grid-custom 1.2.2 → 1.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.d.mts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { Dispatch, SetStateAction, Key, ReactNode, JSX } from 'react';
+import { Dispatch, SetStateAction, Key, ReactNode, JSX, MutableRefObject } from 'react';
 import { ColumnOrColumnGroup, DataGridProps } from 'react-data-grid';
 export { Column, ColumnOrColumnGroup, DataGridProps } from 'react-data-grid';
 import { PaginationRootProps } from '@mantine/core';
@@ -59,10 +59,22 @@ interface IReactTableGridCustom<T = unknown, SR = unknown, K extends Key = Key>
     fetching?: boolean;
     TableLogo?: string;
 }
+interface refTablePaginationClient extends Required<IPaginationParams> {
+    setConfigSearch: Dispatch<SetStateAction<ISetConfigPagination$1>>;
+    resetPagition: (conditional?: boolean) => void;
+}
 type ReactTableGridCustomComponent = <T, SR = unknown, K extends Key = Key>(props: IReactTableGridCustom<T, SR, K>) => JSX.Element;
 declare const ReactTableGridCustom: ReactTableGridCustomComponent;
+type ReactTableGridCustomPaginationClientComponent = <T, SR = unknown, K extends Key = Key>(props: ReactTableGridCustomPaginationClientProps<T, SR, K>) => JSX.Element;
+interface ReactTableGridCustomPaginationClientProps<T = unknown, SR = unknown, K extends Key = Key> extends IReactTableGridCustom<T, SR, K> {
+    initPage?: number;
+    initPageSize?: number;
+    refTable?: MutableRefObject<refTablePaginationClient | undefined>;
+}
+declare const ReactTableGridCustomPaginationClient: ReactTableGridCustomPaginationClientComponent;
 interface ContextMenuProps {
     selector: string;
     children?: ReactNode;
@@ -216,4 +228,4 @@ interface UseShowHideColumnReturn<T, SR> {
     handleChangeLocation?: (arr: string[]) => void;
 }
-export { type ICalculatorTotalPage, type IPaginationParams, type IReactTableGridCustom, type ISTTParams, type Maybe, ReactTableGridCustom, type TColumnsTable, TableStyleContextWapper, type TableStyleWapperProps, type UseShowHideColumnParameter, type UseShowHideColumnReturn, useShowHideColumn };
+export { type ICalculatorTotalPage, type IPaginationParams, type IReactTableGridCustom, type ISTTParams, type Maybe, ReactTableGridCustom, ReactTableGridCustomPaginationClient, type ReactTableGridCustomPaginationClientComponent, type ReactTableGridCustomPaginationClientProps, type TColumnsTable, TableStyleContextWapper, type TableStyleWapperProps, type UseShowHideColumnParameter, type UseShowHideColumnReturn, useShowHideColumn };

package/dist/index.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { Dispatch, SetStateAction, Key, ReactNode, JSX } from 'react';
+import { Dispatch, SetStateAction, Key, ReactNode, JSX, MutableRefObject } from 'react';
 import { ColumnOrColumnGroup, DataGridProps } from 'react-data-grid';
 export { Column, ColumnOrColumnGroup, DataGridProps } from 'react-data-grid';
 import { PaginationRootProps } from '@mantine/core';
@@ -59,10 +59,22 @@ interface IReactTableGridCustom<T = unknown, SR = unknown, K extends Key = Key>
     fetching?: boolean;
     TableLogo?: string;
 }
+interface refTablePaginationClient extends Required<IPaginationParams> {
+    setConfigSearch: Dispatch<SetStateAction<ISetConfigPagination$1>>;
+    resetPagition: (conditional?: boolean) => void;
+}
 type ReactTableGridCustomComponent = <T, SR = unknown, K extends Key = Key>(props: IReactTableGridCustom<T, SR, K>) => JSX.Element;
 declare const ReactTableGridCustom: ReactTableGridCustomComponent;
+type ReactTableGridCustomPaginationClientComponent = <T, SR = unknown, K extends Key = Key>(props: ReactTableGridCustomPaginationClientProps<T, SR, K>) => JSX.Element;
+interface ReactTableGridCustomPaginationClientProps<T = unknown, SR = unknown, K extends Key = Key> extends IReactTableGridCustom<T, SR, K> {
+    initPage?: number;
+    initPageSize?: number;
+    refTable?: MutableRefObject<refTablePaginationClient | undefined>;
+}
+declare const ReactTableGridCustomPaginationClient: ReactTableGridCustomPaginationClientComponent;
 interface ContextMenuProps {
     selector: string;
     children?: ReactNode;
@@ -216,4 +228,4 @@ interface UseShowHideColumnReturn<T, SR> {
     handleChangeLocation?: (arr: string[]) => void;
 }
-export { type ICalculatorTotalPage, type IPaginationParams, type IReactTableGridCustom, type ISTTParams, type Maybe, ReactTableGridCustom, type TColumnsTable, TableStyleContextWapper, type TableStyleWapperProps, type UseShowHideColumnParameter, type UseShowHideColumnReturn, useShowHideColumn };
+export { type ICalculatorTotalPage, type IPaginationParams, type IReactTableGridCustom, type ISTTParams, type Maybe, ReactTableGridCustom, ReactTableGridCustomPaginationClient, type ReactTableGridCustomPaginationClientComponent, type ReactTableGridCustomPaginationClientProps, type TColumnsTable, TableStyleContextWapper, type TableStyleWapperProps, type UseShowHideColumnParameter, type UseShowHideColumnReturn, useShowHideColumn };

package/dist/index.js CHANGED Viewed

@@ -31,6 +31,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var index_exports = {};
 __export(index_exports, {
   ReactTableGridCustom: () => ReactTableGridCustom,
+  ReactTableGridCustomPaginationClient: () => ReactTableGridCustomPaginationClient,
   TableStyleContextWapper: () => TableStyleContextWapper,
   useShowHideColumn: () => useShowHideColumn
 });
@@ -445,16 +446,99 @@ var ReactTableGridCustom = (0, import_react3.memo)(
   ReactTableGridCustomInner
 );
+// src/component/ui/Table/ReactTableGridCustomPaginationClient.tsx
+var import_react5 = require("react");
+// src/hooks/useDataPagingClient.ts
+var import_react4 = require("react");
+var useDataPagingClient = ({ data = [], page, pageSize }) => {
+  const newData = (0, import_react4.useMemo)(() => {
+    if (page && pageSize) {
+      const startIndex = (page - 1) * pageSize;
+      return data.slice(startIndex, startIndex + pageSize);
+    }
+    return data;
+  }, [data, page, pageSize]);
+  return newData;
+};
+var useDataPagingClient_default = useDataPagingClient;
+// src/component/ui/Table/ReactTableGridCustomPaginationClient.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var ReactTableGridCustomPaginationClientInner = ({
+  data,
+  initPage = 1,
+  initPageSize = 200,
+  refTable,
+  ...spread
+}) => {
+  const [configSearch, setConfigSearch] = (0, import_react5.useState)({
+    page: initPage,
+    pageSize: initPageSize
+  });
+  const newDataAccount = useDataPagingClient_default({
+    data,
+    page: configSearch == null ? void 0 : configSearch.page,
+    pageSize: configSearch == null ? void 0 : configSearch.pageSize
+  });
+  const resetPage = (0, import_react5.useCallback)(() => {
+    setConfigSearch((prev) => ({
+      ...prev,
+      page: 1
+    }));
+  }, []);
+  (0, import_react5.useImperativeHandle)(
+    refTable,
+    () => {
+      var _a, _b;
+      return {
+        setConfigSearch,
+        page: (_a = configSearch == null ? void 0 : configSearch.page) != null ? _a : initPage,
+        pageSize: (_b = configSearch == null ? void 0 : configSearch.pageSize) != null ? _b : initPageSize,
+        resetPagition: (conditional = true) => {
+          if (conditional && (configSearch == null ? void 0 : configSearch.page) !== 1) {
+            resetPage();
+          } else {
+            resetPage();
+          }
+        }
+      };
+    },
+    [
+      setConfigSearch,
+      configSearch == null ? void 0 : configSearch.page,
+      configSearch == null ? void 0 : configSearch.pageSize,
+      initPage,
+      initPageSize,
+      resetPage
+    ]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    ReactTableGridCustom,
+    {
+      data: newDataAccount,
+      total: data == null ? void 0 : data.length,
+      page: configSearch == null ? void 0 : configSearch.page,
+      pageSize: configSearch == null ? void 0 : configSearch.pageSize,
+      setConfigPagination: setConfigSearch,
+      ...spread
+    }
+  );
+};
+var ReactTableGridCustomPaginationClient = (0, import_react5.memo)(
+  ReactTableGridCustomPaginationClientInner
+);
 // src/component/ui/Table/TableStyleContextWapper.tsx
-var import_react8 = require("react");
+var import_react10 = require("react");
 // src/component/ui/ContextMenu/ContextMenu.tsx
-var import_react4 = require("react");
+var import_react6 = require("react");
 var import_react_dom = require("react-dom");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var ContextMenu = ({ selector, children, zIndex = 40 }) => {
-  const menuRef = (0, import_react4.useRef)(null);
-  const closeMenu = (0, import_react4.useCallback)(() => {
+  const menuRef = (0, import_react6.useRef)(null);
+  const closeMenu = (0, import_react6.useCallback)(() => {
     const contextMenuElem = menuRef.current;
     const elementParent = document.querySelector(selector);
     if (contextMenuElem && contextMenuElem.classList.contains("shadow-menu")) {
@@ -466,7 +550,7 @@ var ContextMenu = ({ selector, children, zIndex = 40 }) => {
       elementParent.style.removeProperty("overflow");
     }
   }, [menuRef.current]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     const elementParent = document.querySelector(selector);
     if (elementParent) {
       const clickMenu = (e) => {
@@ -534,7 +618,7 @@ var ContextMenu = ({ selector, children, zIndex = 40 }) => {
     };
   }, []);
   return (0, import_react_dom.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       "div",
       {
         className: "fixed z-40 w-fit",
@@ -549,12 +633,12 @@ var ContextMenu = ({ selector, children, zIndex = 40 }) => {
 var ContextMenu_default = ContextMenu;
 // src/component/ui/ContextMenu/RenderContextMenu.tsx
-var import_react7 = require("react");
+var import_react9 = require("react");
 // src/component/ui/ContextMenu/ContextMenuItem.tsx
 var import_react_i18next3 = require("react-i18next");
 var import_md = require("react-icons/md");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var ContextMenuItem = ({
   currentValue,
   expandValue,
@@ -564,7 +648,7 @@ var ContextMenuItem = ({
 }) => {
   const { t } = (0, import_react_i18next3.useTranslation)();
   const Icon = currentValue.Icon;
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
     "div",
     {
       className: `cursor-pointer p-2 flex items-center space-x-2 relative ${show ? "bg-[#555] text-white" : "hover:bg-[#555] hover:text-white"}`,
@@ -573,9 +657,9 @@ var ContextMenuItem = ({
         expandValue && valueClickItem && (currentValue == null ? void 0 : currentValue.onClick) && ((_a = currentValue == null ? void 0 : currentValue.onClick) == null ? void 0 : _a.call(currentValue, valueClickItem, expandValue));
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { size: 20 }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-sm flex-1", children: t(`${currentValue.action}`) }),
-        isArrow && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_md.MdKeyboardArrowRight, { size: 20 })
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { size: 20 }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-sm flex-1", children: t(`${currentValue.action}`) }),
+        isArrow && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_md.MdKeyboardArrowRight, { size: 20 })
       ]
     }
   );
@@ -583,14 +667,14 @@ var ContextMenuItem = ({
 var ContextMenuItem_default = ContextMenuItem;
 // src/component/ui/ContextMenu/DropdownContextChild.tsx
-var import_react5 = __toESM(require("@tippyjs/react"));
-var import_react6 = require("react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_react7 = __toESM(require("@tippyjs/react"));
+var import_react8 = require("react");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var DropdownContextChild = ({ button, children, ...rest }) => {
-  const id = (0, import_react6.useId)();
-  const instanceRef = (0, import_react6.useRef)(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_react5.default,
+  const id = (0, import_react8.useId)();
+  const instanceRef = (0, import_react8.useRef)(null);
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    import_react7.default,
     {
       theme: "drop-down",
       className: "!bg-transparent !text-inherit !border-r-0 [&>*]:!p-0",
@@ -601,7 +685,7 @@ var DropdownContextChild = ({ button, children, ...rest }) => {
       allowHTML: true,
       content: children,
       ...rest,
-      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
         "div",
         {
           id: `div-${id}`,
@@ -618,16 +702,16 @@ var DropdownContextChild = ({ button, children, ...rest }) => {
 var DropdownContextChild_default = DropdownContextChild;
 // src/component/ui/ContextMenu/RenderContextMenu.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var RenderContextMenu = ({
   renderData,
   valueClickItem,
   expandValue = {}
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "bg-white shadow-submenu p-1 min-w-[250px] border", children: renderData == null ? void 0 : renderData.map((menuAction, index) => {
-    const [isShow, setIsShow] = (0, import_react7.useState)(false);
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_react7.Fragment, { children: [
-      !(menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "bg-white shadow-submenu p-1 min-w-[250px] border", children: renderData == null ? void 0 : renderData.map((menuAction, index) => {
+    const [isShow, setIsShow] = (0, import_react9.useState)(false);
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react9.Fragment, { children: [
+      !(menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         ContextMenuItem_default,
         {
           currentValue: menuAction,
@@ -635,7 +719,7 @@ var RenderContextMenu = ({
           valueClickItem
         }
       ),
-      (menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      (menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         DropdownContextChild_default,
         {
           appendTo: "parent",
@@ -643,7 +727,7 @@ var RenderContextMenu = ({
           offset: [0, 5],
           onShow: () => setIsShow(true),
           onHide: () => setIsShow(false),
-          button: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          button: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             ContextMenuItem_default,
             {
               currentValue: menuAction,
@@ -653,7 +737,7 @@ var RenderContextMenu = ({
               isArrow: true
             }
           ),
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "dropdown-context-child absolute -top-[20px] -left-1", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "dropdown-context-child absolute -top-[20px] -left-1", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             RenderContextMenu,
             {
               renderData: menuAction == null ? void 0 : menuAction.children,
@@ -669,26 +753,26 @@ var RenderContextMenu = ({
 var RenderContextMenu_default = RenderContextMenu;
 // src/component/ui/Table/TableStyleContextWapper.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var TableStyleContextMenuWapper = ({
   children,
   contextMenuProps,
   clsTablecustom,
   renderContext
 }) => {
-  const idWapper = (0, import_react8.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+  const idWapper = (0, import_react10.useId)();
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
     "div",
     {
       id: `wapper_menu_context-${idWapper}`,
       className: `border border-[#dedede] rounded-xl overflow-hidden bg-white flex-1 h-full flex flex-col min-h-[360px] ${clsTablecustom != null ? clsTablecustom : ""}`,
       children: [
-        (renderContext == null ? void 0 : renderContext.renderData) && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        (renderContext == null ? void 0 : renderContext.renderData) && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           ContextMenu_default,
           {
             selector: `[id="wapper_menu_context-${idWapper}"] .rdg`,
             ...contextMenuProps,
-            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(RenderContextMenu_default, { ...renderContext })
+            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RenderContextMenu_default, { ...renderContext })
           }
         ),
         children
@@ -696,12 +780,13 @@ var TableStyleContextMenuWapper = ({
     }
   );
 };
-var TableStyleContextWapper = (0, import_react8.memo)(
+var TableStyleContextWapper = (0, import_react10.memo)(
   TableStyleContextMenuWapper
 );
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ReactTableGridCustom,
+  ReactTableGridCustomPaginationClient,
   TableStyleContextWapper,
   useShowHideColumn
 });

package/dist/index.mjs CHANGED Viewed

@@ -417,16 +417,104 @@ var ReactTableGridCustom = memo(
   ReactTableGridCustomInner
 );
+// src/component/ui/Table/ReactTableGridCustomPaginationClient.tsx
+import {
+  memo as memo2,
+  useCallback as useCallback3,
+  useImperativeHandle,
+  useState as useState3
+} from "react";
+// src/hooks/useDataPagingClient.ts
+import { useMemo as useMemo4 } from "react";
+var useDataPagingClient = ({ data = [], page, pageSize }) => {
+  const newData = useMemo4(() => {
+    if (page && pageSize) {
+      const startIndex = (page - 1) * pageSize;
+      return data.slice(startIndex, startIndex + pageSize);
+    }
+    return data;
+  }, [data, page, pageSize]);
+  return newData;
+};
+var useDataPagingClient_default = useDataPagingClient;
+// src/component/ui/Table/ReactTableGridCustomPaginationClient.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var ReactTableGridCustomPaginationClientInner = ({
+  data,
+  initPage = 1,
+  initPageSize = 200,
+  refTable,
+  ...spread
+}) => {
+  const [configSearch, setConfigSearch] = useState3({
+    page: initPage,
+    pageSize: initPageSize
+  });
+  const newDataAccount = useDataPagingClient_default({
+    data,
+    page: configSearch == null ? void 0 : configSearch.page,
+    pageSize: configSearch == null ? void 0 : configSearch.pageSize
+  });
+  const resetPage = useCallback3(() => {
+    setConfigSearch((prev) => ({
+      ...prev,
+      page: 1
+    }));
+  }, []);
+  useImperativeHandle(
+    refTable,
+    () => {
+      var _a, _b;
+      return {
+        setConfigSearch,
+        page: (_a = configSearch == null ? void 0 : configSearch.page) != null ? _a : initPage,
+        pageSize: (_b = configSearch == null ? void 0 : configSearch.pageSize) != null ? _b : initPageSize,
+        resetPagition: (conditional = true) => {
+          if (conditional && (configSearch == null ? void 0 : configSearch.page) !== 1) {
+            resetPage();
+          } else {
+            resetPage();
+          }
+        }
+      };
+    },
+    [
+      setConfigSearch,
+      configSearch == null ? void 0 : configSearch.page,
+      configSearch == null ? void 0 : configSearch.pageSize,
+      initPage,
+      initPageSize,
+      resetPage
+    ]
+  );
+  return /* @__PURE__ */ jsx4(
+    ReactTableGridCustom,
+    {
+      data: newDataAccount,
+      total: data == null ? void 0 : data.length,
+      page: configSearch == null ? void 0 : configSearch.page,
+      pageSize: configSearch == null ? void 0 : configSearch.pageSize,
+      setConfigPagination: setConfigSearch,
+      ...spread
+    }
+  );
+};
+var ReactTableGridCustomPaginationClient = memo2(
+  ReactTableGridCustomPaginationClientInner
+);
 // src/component/ui/Table/TableStyleContextWapper.tsx
-import { memo as memo2, useId as useId2 } from "react";
+import { memo as memo3, useId as useId2 } from "react";
 // src/component/ui/ContextMenu/ContextMenu.tsx
-import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef2 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect2, useRef as useRef2 } from "react";
 import { createPortal } from "react-dom";
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 var ContextMenu = ({ selector, children, zIndex = 40 }) => {
   const menuRef = useRef2(null);
-  const closeMenu = useCallback3(() => {
+  const closeMenu = useCallback4(() => {
     const contextMenuElem = menuRef.current;
     const elementParent = document.querySelector(selector);
     if (contextMenuElem && contextMenuElem.classList.contains("shadow-menu")) {
@@ -506,7 +594,7 @@ var ContextMenu = ({ selector, children, zIndex = 40 }) => {
     };
   }, []);
   return createPortal(
-    /* @__PURE__ */ jsx4(
+    /* @__PURE__ */ jsx5(
       "div",
       {
         className: "fixed z-40 w-fit",
@@ -521,12 +609,12 @@ var ContextMenu = ({ selector, children, zIndex = 40 }) => {
 var ContextMenu_default = ContextMenu;
 // src/component/ui/ContextMenu/RenderContextMenu.tsx
-import { Fragment as Fragment2, useState as useState3 } from "react";
+import { Fragment as Fragment2, useState as useState4 } from "react";
 // src/component/ui/ContextMenu/ContextMenuItem.tsx
 import { useTranslation as useTranslation3 } from "react-i18next";
 import { MdKeyboardArrowRight } from "react-icons/md";
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 var ContextMenuItem = ({
   currentValue,
   expandValue,
@@ -545,9 +633,9 @@ var ContextMenuItem = ({
         expandValue && valueClickItem && (currentValue == null ? void 0 : currentValue.onClick) && ((_a = currentValue == null ? void 0 : currentValue.onClick) == null ? void 0 : _a.call(currentValue, valueClickItem, expandValue));
       },
       children: [
-        /* @__PURE__ */ jsx5(Icon, { size: 20 }),
-        /* @__PURE__ */ jsx5("span", { className: "text-sm flex-1", children: t(`${currentValue.action}`) }),
-        isArrow && /* @__PURE__ */ jsx5(MdKeyboardArrowRight, { size: 20 })
+        /* @__PURE__ */ jsx6(Icon, { size: 20 }),
+        /* @__PURE__ */ jsx6("span", { className: "text-sm flex-1", children: t(`${currentValue.action}`) }),
+        isArrow && /* @__PURE__ */ jsx6(MdKeyboardArrowRight, { size: 20 })
       ]
     }
   );
@@ -557,11 +645,11 @@ var ContextMenuItem_default = ContextMenuItem;
 // src/component/ui/ContextMenu/DropdownContextChild.tsx
 import Tippy from "@tippyjs/react";
 import { useId, useRef as useRef3 } from "react";
-import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
 var DropdownContextChild = ({ button, children, ...rest }) => {
   const id = useId();
   const instanceRef = useRef3(null);
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Tippy,
     {
       theme: "drop-down",
@@ -573,7 +661,7 @@ var DropdownContextChild = ({ button, children, ...rest }) => {
       allowHTML: true,
       content: children,
       ...rest,
-      children: /* @__PURE__ */ jsx6(
+      children: /* @__PURE__ */ jsx7(
         "div",
         {
           id: `div-${id}`,
@@ -590,16 +678,16 @@ var DropdownContextChild = ({ button, children, ...rest }) => {
 var DropdownContextChild_default = DropdownContextChild;
 // src/component/ui/ContextMenu/RenderContextMenu.tsx
-import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
 var RenderContextMenu = ({
   renderData,
   valueClickItem,
   expandValue = {}
 }) => {
-  return /* @__PURE__ */ jsx7("div", { className: "bg-white shadow-submenu p-1 min-w-[250px] border", children: renderData == null ? void 0 : renderData.map((menuAction, index) => {
-    const [isShow, setIsShow] = useState3(false);
+  return /* @__PURE__ */ jsx8("div", { className: "bg-white shadow-submenu p-1 min-w-[250px] border", children: renderData == null ? void 0 : renderData.map((menuAction, index) => {
+    const [isShow, setIsShow] = useState4(false);
     return /* @__PURE__ */ jsxs4(Fragment2, { children: [
-      !(menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ jsx7(
+      !(menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ jsx8(
         ContextMenuItem_default,
         {
           currentValue: menuAction,
@@ -607,7 +695,7 @@ var RenderContextMenu = ({
           valueClickItem
         }
       ),
-      (menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ jsx7(
+      (menuAction == null ? void 0 : menuAction.children) && /* @__PURE__ */ jsx8(
         DropdownContextChild_default,
         {
           appendTo: "parent",
@@ -615,7 +703,7 @@ var RenderContextMenu = ({
           offset: [0, 5],
           onShow: () => setIsShow(true),
           onHide: () => setIsShow(false),
-          button: /* @__PURE__ */ jsx7(
+          button: /* @__PURE__ */ jsx8(
             ContextMenuItem_default,
             {
               currentValue: menuAction,
@@ -625,7 +713,7 @@ var RenderContextMenu = ({
               isArrow: true
             }
           ),
-          children: /* @__PURE__ */ jsx7("div", { className: "dropdown-context-child absolute -top-[20px] -left-1", children: /* @__PURE__ */ jsx7(
+          children: /* @__PURE__ */ jsx8("div", { className: "dropdown-context-child absolute -top-[20px] -left-1", children: /* @__PURE__ */ jsx8(
             RenderContextMenu,
             {
               renderData: menuAction == null ? void 0 : menuAction.children,
@@ -641,7 +729,7 @@ var RenderContextMenu = ({
 var RenderContextMenu_default = RenderContextMenu;
 // src/component/ui/Table/TableStyleContextWapper.tsx
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
 var TableStyleContextMenuWapper = ({
   children,
   contextMenuProps,
@@ -655,12 +743,12 @@ var TableStyleContextMenuWapper = ({
       id: `wapper_menu_context-${idWapper}`,
       className: `border border-[#dedede] rounded-xl overflow-hidden bg-white flex-1 h-full flex flex-col min-h-[360px] ${clsTablecustom != null ? clsTablecustom : ""}`,
       children: [
-        (renderContext == null ? void 0 : renderContext.renderData) && /* @__PURE__ */ jsx8(
+        (renderContext == null ? void 0 : renderContext.renderData) && /* @__PURE__ */ jsx9(
           ContextMenu_default,
           {
             selector: `[id="wapper_menu_context-${idWapper}"] .rdg`,
             ...contextMenuProps,
-            children: /* @__PURE__ */ jsx8(RenderContextMenu_default, { ...renderContext })
+            children: /* @__PURE__ */ jsx9(RenderContextMenu_default, { ...renderContext })
           }
         ),
         children
@@ -668,11 +756,12 @@ var TableStyleContextMenuWapper = ({
     }
   );
 };
-var TableStyleContextWapper = memo2(
+var TableStyleContextWapper = memo3(
   TableStyleContextMenuWapper
 );
 export {
   ReactTableGridCustom,
+  ReactTableGridCustomPaginationClient,
   TableStyleContextWapper,
   useShowHideColumn
 };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@mkt-loitd/react-table-grid-custom",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "description": "React Table Grid Custom component",
   "license": "ISC",
   "private": false,