bolesa-apitables 0.1.0

package/dist/index.js

@@ -0,0 +1,2308 @@
+import React4, { createContext, useMemo, useEffect, useId, useState, useContext, useCallback } from 'react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { useDispatch, useSelector, Provider } from 'react-redux';
+import { useForm, Controller } from 'react-hook-form';
+import { createSlice, configureStore, nanoid } from '@reduxjs/toolkit';
+import { IoMdExpand } from 'react-icons/io';
+import { PhotoProvider, PhotoView } from 'react-photo-view';
+import 'react-photo-view/dist/react-photo-view.css';
+import { PiDotsThreeOutlineVerticalBold, PiGearFill } from 'react-icons/pi';
+import { IoCopy } from 'react-icons/io5';
+import { MdInsertLink, MdFilterListAlt } from 'react-icons/md';
+import { ImSpinner6 } from 'react-icons/im';
+import { toast } from 'sonner';
+import { X } from 'lucide-react';
+import { isValid, format } from 'date-fns';
+import DataTable from 'react-data-table-component';
+import { HiChevronUpDown } from 'react-icons/hi2';
+import { FaCircle } from 'react-icons/fa';
+import { FiChevronDown } from 'react-icons/fi';
+import { RiEyeCloseFill } from 'react-icons/ri';
+import parse from 'html-react-parser';
+import axios from 'axios';
+
+var ApiTablesConfigContext = createContext(null);
+var runtimeConfig = null;
+function getApiTablesRuntimeConfig() {
+  return runtimeConfig;
+}
+function ApiTablesHostProvider({ config, children }) {
+  const merged = {
+    cn: (...classes) => twMerge(clsx(classes)),
+    storage: {
+      get: (key) => {
+        try {
+          const raw = localStorage.getItem(key);
+          return raw ? JSON.parse(raw) : null;
+        } catch {
+          return null;
+        }
+      },
+      set: (key, value) => localStorage.setItem(key, JSON.stringify(value))
+    },
+    ...config,
+    components: config.components
+  };
+  runtimeConfig = merged;
+  return /* @__PURE__ */ jsx(ApiTablesConfigContext.Provider, { value: merged, children });
+}
+function useApiTablesConfig() {
+  const config = useContext(ApiTablesConfigContext);
+  if (!config) {
+    throw new Error("useApiTablesConfig must be used within <ApiTablesHostProvider>");
+  }
+  return config;
+}
+function useApiTablesComponent(name) {
+  const { components } = useApiTablesConfig();
+  const component = components[name];
+  if (!component) {
+    throw new Error(
+      `ApiTablesConfig.components.${String(name)} is required but was not provided`
+    );
+  }
+  return component;
+}
+var initialState = {
+  tableColumns: [],
+  visibleColumns: [],
+  selectedRows: [],
+  selectedIds: [],
+  toggledClearRows: false,
+  rowSelectedModal: null
+};
+var tableColumnsSlice = createSlice({
+  name: "tableColumns",
+  initialState,
+  reducers: {
+    _setSelectedRows: (state, action) => {
+      state.selectedRows = action?.payload;
+      state.selectedIds = action?.payload?.length > 0 ? action?.payload?.map((row) => row?.id) : [];
+    },
+    _setToggledClearRow: (state, action) => {
+      state.toggledClearRows = action?.payload;
+    },
+    _setVisibleColumns: (state, action) => {
+      state.visibleColumns = action?.payload;
+      state.tableColumns = state.tableColumns?.map((col) => ({
+        ...col,
+        omit: action?.payload?.indexOf(col?.data_src) === -1
+      }));
+    },
+    _setRowSelectedModal: (state, action) => {
+      state.rowSelectedModal = action?.payload;
+    },
+    _setTableColumns: (state, action) => {
+      state.tableColumns = action?.payload?.update ? action?.payload?.cols : formatTableColumns(action?.payload?.cols, action?.payload?.tbData);
+    },
+    _resetTableColumns: (state) => {
+      state.tableColumns = [];
+      state.visibleColumns = [];
+      state.selectedRows = [];
+      state.selectedIds = [];
+      state.toggledClearRows = false;
+      state.rowSelectedModal = null;
+    }
+  }
+});
+var { _setSelectedRows, _setToggledClearRow, _setVisibleColumns, _setRowSelectedModal, _setTableColumns, _resetTableColumns } = tableColumnsSlice.actions;
+var tableColumnsSlice_default = tableColumnsSlice.reducer;
+
+// src/shims/next-intl.ts
+function useTranslations(namespace) {
+  const translate = getApiTablesRuntimeConfig()?.useTranslations?.(namespace);
+  return translate ?? ((key) => key);
+}
+function Link(props) {
+  const { Link: HostLink } = useApiTablesConfig();
+  if (!HostLink) {
+    throw new Error("ApiTablesConfig.Link is required for redirect row actions");
+  }
+  const Comp = HostLink;
+  return /* @__PURE__ */ jsx(Comp, { ...props });
+}
+function createHostComponent(name) {
+  const HostComponent = (props) => {
+    const { components } = useApiTablesConfig();
+    const Comp = components[name];
+    if (!Comp) {
+      throw new Error(`ApiTablesConfig.components.${name} is required`);
+    }
+    return /* @__PURE__ */ jsx(Comp, { ...props });
+  };
+  HostComponent.displayName = `ApiTablesHost(${name})`;
+  return HostComponent;
+}
+
+// src/shims/components.ts
+var Button = createHostComponent("Button");
+var Badge = createHostComponent("Badge");
+createHostComponent("Card");
+var Skeleton = createHostComponent("Skeleton");
+var Switch = createHostComponent("Switch");
+var Label = createHostComponent("Label");
+var Input = createHostComponent("Input");
+createHostComponent("InputWrapper");
+var Checkbox = createHostComponent("Checkbox");
+var Popover = createHostComponent("Popover");
+var PopoverContent = createHostComponent("PopoverContent");
+var PopoverTrigger = createHostComponent("PopoverTrigger");
+var Select = createHostComponent("Select");
+var SelectContent = createHostComponent("SelectContent");
+var SelectGroup = createHostComponent("SelectGroup");
+var SelectItem = createHostComponent("SelectItem");
+var SelectTrigger = createHostComponent("SelectTrigger");
+var SelectValue = createHostComponent("SelectValue");
+var Tooltip = createHostComponent("Tooltip");
+var TooltipContent = createHostComponent("TooltipContent");
+var TooltipTrigger = createHostComponent("TooltipTrigger");
+var Sheet = createHostComponent("Sheet");
+var SheetContent = createHostComponent("SheetContent");
+createHostComponent("SheetDescription");
+var SheetHeader = createHostComponent("SheetHeader");
+var SheetTitle = createHostComponent("SheetTitle");
+var SheetTrigger = createHostComponent("SheetTrigger");
+var DropdownMenu = createHostComponent("DropdownMenu");
+var DropdownMenuContent = createHostComponent("DropdownMenuContent");
+var DropdownMenuItem = createHostComponent("DropdownMenuItem");
+var DropdownMenuTrigger = createHostComponent("DropdownMenuTrigger");
+var Table = createHostComponent("Table");
+var TableBody = createHostComponent("TableBody");
+var TableCell = createHostComponent("TableCell");
+createHostComponent("TableFooter");
+var TableHead = createHostComponent("TableHead");
+var TableHeader = createHostComponent("TableHeader");
+var TableRow = createHostComponent("TableRow");
+var MultiSelect = createHostComponent("MultiSelect");
+var MultiSelectContent = createHostComponent("MultiSelectContent");
+createHostComponent("MultiSelectGroup");
+var MultiSelectItem = createHostComponent("MultiSelectItem");
+var MultiSelectTrigger = createHostComponent("MultiSelectTrigger");
+var MultiSelectValue = createHostComponent("MultiSelectValue");
+var LoadingButton = createHostComponent("LoadingButton");
+var AppCurrency = createHostComponent("AppCurrency");
+var DatePicker = createHostComponent("DatePicker");
+var TagsInput = createHostComponent("TagsInput");
+var CustomPagination = createHostComponent("CustomPagination");
+var Popup = createHostComponent("Popup");
+createHostComponent("FullPageTableLoader");
+function TextCell({ col, row }) {
+  return col?.values_formating && Object.keys(col?.values_formating)?.filter((key) => row[col?.data_src] === col?.values_formating[key]["showValue"])?.length > 0 ? Object.keys(col?.values_formating)?.filter((key) => row[col?.data_src] === col?.values_formating[key]["showValue"])?.map((key, index) => /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: `status text-capitalize ${col?.values_formating[key]["style"] === "success" ? "active" : col?.values_formating[key]["style"] === "danger" ? "in-active" : col?.values_formating[key]["style"] === "info" && "info"}`,
+      children: row[col?.data_src]
+    },
+    index
+  )) : row[col?.data_src] === "CR" || row[col?.data_src] === "approved" ? /* @__PURE__ */ jsx("span", { className: "status active", children: row[col?.data_src] }) : row[col?.data_src] === "DR" || row[col?.data_src] === "pending" ? /* @__PURE__ */ jsx("span", { className: "status in-active", children: row[col?.data_src] }) : /* @__PURE__ */ jsx("p", { className: "mb-0 text-wrap", children: row[col?.data_src] });
+}
+function LinkCell({ col, row }) {
+  const tApiTables = useTranslations("ApiTables");
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    col?.linkStyle === "text" ? /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", size: "sm", className: "text-[12px]", children: /* @__PURE__ */ jsx(
+      Link,
+      {
+        href: row[col?.data_src]?.value || row[col?.data_src],
+        className: `text-${col?.linkColor} ${row[col?.data_src] === "!#" || row[col?.data_src]?.value === "!#" || !row[col?.data_src] ? "disabled pointer-events-none" : ""}`,
+        target: "_blank",
+        children: row[col?.data_src]?.label || col?.linkText
+      }
+    ) }) : col?.linkStyle === "button" && /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", size: "sm", className: "text-[12px]", children: /* @__PURE__ */ jsx(Link, { color: "primary", href: row[col?.data_src]?.value || row[col?.data_src], target: "_blank", children: col?.linkText }) }),
+    col?.showCopyBtn && /* @__PURE__ */ jsx(Button, { variant: "outline", type: "button", size: "sm", className: "text-[12px]", onClick: () => copyToClipboard(row[col?.data_src]), children: tApiTables("copy_link") })
+  ] });
+}
+function BooleanCell({ row, col }) {
+  if (row[col?.data_src] === true) {
+    return /* @__PURE__ */ jsxs(
+      Badge,
+      {
+        variant: "outline",
+        className: "inline-flex items-center border-green-500/5 px-3 py-[2px] text-green-800 dark:border-green-300/40 dark:text-green-100 bg-green-400/5 gap-1",
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "w-2 h-2 rounded-full bg-green-400" }),
+          col?.values_formating?.trueLabel
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    Badge,
+    {
+      variant: "outline",
+      className: "inline-flex items-center  border-red-500/5 dark:border-red-300/40 px-3 py-[2px] text-red-800 dark:text-red-50 bg-red-400/5 gap-1",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "w-2 h-2 rounded-full bg-red-400" }),
+        col?.values_formating?.falseLabel
+      ]
+    }
+  );
+}
+function HTMLCell({ col, row }) {
+  const dispatch = useDispatch();
+  const tApiTables = useTranslations("ApiTables");
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      size: "sm",
+      variant: "outline",
+      onClick: () => {
+        dispatch(
+          _setRowSelectedModal({
+            label: col?.label,
+            value: row[col?.data_src]
+          })
+        );
+      },
+      children: tApiTables("show")
+    }
+  );
+}
+function DataListCell({ col, row }) {
+  const dispatch = useDispatch();
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      variant: "outline",
+      size: "sm",
+      onClick: () => {
+        dispatch(
+          _setRowSelectedModal({
+            label: col?.label,
+            value: row[col?.data_src]
+          })
+        );
+      },
+      children: [
+        /* @__PURE__ */ jsx(IoMdExpand, {}),
+        col?.linkText
+      ]
+    }
+  );
+}
+function BarcodeCell({ col, row }) {
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(PhotoProvider, { children: /* @__PURE__ */ jsx(PhotoView, { src: `data:image/png;base64,${row[col?.data_src]}`, children: /* @__PURE__ */ jsx("img", { src: `data:image/png;base64,${row[col?.data_src]}`, alt: "Barcode", className: "w-auto max-w-[50px] cursor-pointer" }) }) }) });
+}
+
+// src/table-utils/errorHandling.ts
+function getToast() {
+  return getApiTablesRuntimeConfig()?.toast ?? null;
+}
+function handleResponseErrors(response, message, successCallback, errorCallback) {
+  const toast2 = getToast();
+  if (response?.data?.success) {
+    successCallback?.();
+    if (message && toast2) toast2.success(message);
+  }
+  if (!response?.data?.success && !response?.data?.errors && response?.data?.message) {
+    toast2?.error(response.data.message);
+  }
+  if (!response?.data?.success && response?.data?.errors) {
+    const errors = response.data.errors;
+    if (Array.isArray(errors) && errors.length > 0) {
+      errors.forEach((item) => toast2?.error(item));
+    } else if (typeof errors === "string" && errors.length > 0) {
+      toast2?.error(errors);
+    } else if (errors && typeof errors === "object") {
+      Object.keys(errors).forEach((key) => {
+        const value = errors[key];
+        if (Array.isArray(value)) toast2?.error(value.join(","));
+      });
+    }
+  } else if (!response?.data?.success && !response?.data?.errors) ;
+}
+async function handleNetworkErrors(err) {
+  console.log(err);
+  const config = getApiTablesRuntimeConfig();
+  const toast2 = config?.toast ?? null;
+  if (err?.response?.status === 401) {
+    try {
+      if (config?.onUnauthorized) {
+        await config.onUnauthorized();
+      } else if (config?.axiosAuth) {
+        const res = await config.axiosAuth.delete("/api/delete-auth");
+        if (res?.data?.success) {
+          window.location.href = "/login";
+          localStorage.removeItem("FCM_ERRIM");
+        }
+      }
+    } catch (error2) {
+      console.log(error2);
+    }
+  }
+  if (err?.code === "ERR_CANCELED") return;
+  const error = err?.response?.data?.error;
+  if (error && typeof error === "string" && error.length > 0) {
+    toast2?.error(error);
+  } else if (error && Array.isArray(error) && error.length > 0) {
+    toast2?.error(error.join(","));
+  } else {
+    toast2?.error(err?.message || "Something went wrong!");
+  }
+}
+var initialState2 = {
+  tableName: null,
+  structureColumns: null,
+  structureFilters: null,
+  customElement: null,
+  appliedFilters: [],
+  renderedFilters: [],
+  tableSorting: {},
+  tableData: [],
+  tableBindings: null,
+  currentPage: 1,
+  pageSize: 25,
+  tablePagination: null,
+  tableFetchingLoading: false,
+  tableRefresher: 0
+};
+var tableCoreSlice = createSlice({
+  name: "tableCore",
+  initialState: initialState2,
+  reducers: {
+    _getTableComponents: (state, action) => {
+      state.tableName = action?.payload?.tableName;
+      state.structureColumns = action?.payload?.columns;
+      state.structureFilters = action?.payload?.filters;
+      state.customElement = action?.payload?.customElement ?? null;
+    },
+    _setAppliedFilters: (state, action) => {
+      state.appliedFilters = action?.payload?.reduce((acc, curr) => {
+        acc[curr.key] = curr;
+        return acc;
+      }, {});
+    },
+    _setRenderedFilters: (state, action) => {
+      state.renderedFilters = action?.payload;
+    },
+    _getTableData: (state, action) => {
+      state.tableData = action?.payload;
+    },
+    _getTablePagination: (state, action) => {
+      state.tablePagination = action?.payload;
+    },
+    _getTableBindings: (state, action) => {
+      state.tableBindings = action?.payload;
+    },
+    _setTableLoading: (state, action) => {
+      state.tableFetchingLoading = action?.payload;
+    },
+    _setCurrentPage: (state, action) => {
+      state.currentPage = action?.payload;
+    },
+    _setTableSorting: (state, action) => {
+      state.tableSorting = action?.payload;
+    },
+    _changePageSize: (state, action) => {
+      state.pageSize = action?.payload;
+    },
+    _triggerTableReload: (state) => {
+      state.tableRefresher = state.tableRefresher + 1;
+    },
+    _resetTableCore: (state) => {
+      state.tableName = null;
+      state.structureColumns = null;
+      state.structureFilters = null;
+      state.customElement = null;
+      state.appliedFilters = [];
+      state.renderedFilters = [];
+      state.tableSorting = {};
+      state.tableData = [];
+      state.tableBindings = null;
+      state.currentPage = 1;
+      state.pageSize = 25;
+      state.tablePagination = null;
+      state.tableFetchingLoading = false;
+      state.tableRefresher = 0;
+    }
+  }
+});
+var {
+  _getTableComponents,
+  _setAppliedFilters,
+  _setRenderedFilters,
+  _getTableData,
+  _getTablePagination,
+  _getTableBindings,
+  _setTableLoading,
+  _setCurrentPage,
+  _setTableSorting,
+  _changePageSize,
+  _triggerTableReload,
+  _resetTableCore
+} = tableCoreSlice.actions;
+var tableCoreSlice_default = tableCoreSlice.reducer;
+var initialState3 = {
+  bulkActions: [],
+  selectedBulkAction: null,
+  bulkActionPostLoading: false,
+  bulkActionPostResponse: null
+};
+var bulkActionsSlice = createSlice({
+  name: "bulkActions",
+  initialState: initialState3,
+  reducers: {
+    _getStructureBulkActions: (state, action) => {
+      state.bulkActions = objectToArrayValue(action?.payload);
+    },
+    _getSelectedBulkAction: (state, action) => {
+      state.selectedBulkAction = action?.payload;
+    },
+    _bulkActionPostLoading: (state, action) => {
+      state.bulkActionPostLoading = action?.payload;
+    },
+    _bulkActionPostResponse: (state, action) => {
+      state.bulkActionPostResponse = action?.payload;
+    },
+    _resetTableBulkActions: (state) => {
+      state.bulkActions = [];
+      state.selectedBulkAction = null;
+      state.bulkActionPostLoading = false;
+      state.bulkActionPostResponse = null;
+    }
+  }
+});
+var { _getStructureBulkActions, _getSelectedBulkAction, _bulkActionPostLoading, _bulkActionPostResponse, _resetTableBulkActions } = bulkActionsSlice.actions;
+var bulkActionsSlice_default = bulkActionsSlice.reducer;
+var initialState4 = {
+  structureRowActions: [],
+  selectedRowActions: [],
+  clickedRowAction: null,
+  rowActionPostLoading: false,
+  clickedRowActionResponse: null,
+  customControlAction: null,
+  actionsInRegularCells: false,
+  clickedRowActionId: null
+};
+var rowActionsSlice = createSlice({
+  name: "rowActions",
+  initialState: initialState4,
+  reducers: {
+    _getStructureRowActions: (state, action) => {
+      state.structureRowActions = objectToArrayValue(action?.payload);
+    },
+    _checkActionsInRegularCells: (state, action) => {
+      state.actionsInRegularCells = action.payload;
+    },
+    _getSelectedRowActions: (state, action) => {
+      state.selectedRowActions = objectToArrayValue(action?.payload)?.filter((action2) => action2?.applicableAsBulkAction);
+    },
+    _setRowActionPostLoading: (state, action) => {
+      state.rowActionPostLoading = action?.payload;
+    },
+    _getClickedRowAction: (state, action) => {
+      state.clickedRowAction = action?.payload;
+    },
+    _getClickedRowActionId: (state, action) => {
+      state.clickedRowActionId = action?.payload;
+    },
+    _getClickedRowActionResponse: (state, action) => {
+      state.clickedRowActionResponse = action?.payload;
+    },
+    _getCustomControlRequest: (state, action) => {
+      state.customControlAction = action?.payload;
+    },
+    _resetTableRowActions: (state) => {
+      state.structureRowActions = [];
+      state.selectedRowActions = [];
+      state.clickedRowAction = null;
+      state.rowActionPostLoading = false;
+      state.clickedRowActionResponse = null;
+      state.customControlAction = null;
+      state.actionsInRegularCells = false;
+      state.clickedRowActionId = null;
+    }
+  }
+});
+var {
+  _getStructureRowActions,
+  _checkActionsInRegularCells,
+  _getSelectedRowActions,
+  _setRowActionPostLoading,
+  _getClickedRowAction,
+  _getClickedRowActionId,
+  _getClickedRowActionResponse,
+  _getCustomControlRequest,
+  _resetTableRowActions
+} = rowActionsSlice.actions;
+var rowActionsSlice_default = rowActionsSlice.reducer;
+
+// src/table-providers/useUtilsProvider.tsx
+function useUtilsProvider() {
+  const dispatch = useDispatch();
+  const config = useApiTablesConfig();
+  const { axiosTable, usePathname, getExternalStore, onBulkActionSuccess, setMainLoader } = config;
+  const { downloadBlob, downloadPDF, generatePDF } = config;
+  const { tableData } = useSelector((state) => state.tableCore);
+  const { toggledClearRows } = useSelector((state) => state.tableColumns);
+  const pathname = usePathname?.() ?? "";
+  const externalStore = getExternalStore?.();
+  function triggerTableReload() {
+    dispatch(_triggerTableReload());
+  }
+  function handleBulkActionReponse(action, response, payload) {
+    onBulkActionSuccess?.(action, response, payload);
+    if (action?.onSuccess === "deleteRow" || action.onSuccess === "reload") {
+      triggerTableReload();
+      dispatch(_getSelectedBulkAction(null));
+    }
+  }
+  async function bulkActionsPostHandler(method, url, payload, loaderInfo, action) {
+    dispatch(_bulkActionPostLoading(true));
+    if (loaderInfo && setMainLoader) {
+      setMainLoader({ status: true, msg: loaderInfo?.msg, icon: loaderInfo?.icon ?? null });
+    }
+    try {
+      const response = await axiosTable({
+        method,
+        url,
+        data: { ...payload },
+        ...action?.action_key === "export-excel-blob" && { responseType: "blob" }
+      });
+      if (action?.action_key === "export-excel-blob") {
+        downloadBlob?.(response?.data);
+        dispatch(_getSelectedBulkAction(null));
+      } else {
+        handleResponseErrors(
+          response,
+          response?.data?.message,
+          () => {
+            dispatch(_bulkActionPostResponse(response?.data));
+            handleBulkActionReponse(action, response?.data, payload);
+          },
+          void 0
+        );
+      }
+    } catch (err) {
+      console.log(err);
+    } finally {
+      dispatch(_bulkActionPostLoading(false));
+      dispatch(_getSelectedBulkAction(null));
+      if (setMainLoader) setMainLoader({ status: false, msg: "", icon: null });
+    }
+  }
+  function resetClickedRowAction() {
+    dispatch(_getClickedRowAction(null));
+    dispatch(_getClickedRowActionResponse(null));
+    dispatch(_getCustomControlRequest(null));
+    dispatch(_setToggledClearRow(!toggledClearRows));
+    dispatch(_setSelectedRows([]));
+  }
+  function handleCommonCases(type, response) {
+    if (pathname === "/packing/materials" && type === "reload" && externalStore) {
+      onBulkActionSuccess?.(
+        { onSuccess: "reload" },
+        response,
+        void 0
+      );
+    }
+    if (type === "deleteRow" || type === "reload") {
+      triggerTableReload();
+      resetClickedRowAction();
+    } else if (type === "refetchData") {
+      dispatch(
+        _getTableData(
+          tableData?.map((item) => {
+            const matchingItem = response?.items?.find(
+              (entry) => entry.id === item?.id
+            );
+            return matchingItem ?? item;
+          })
+        )
+      );
+      resetClickedRowAction();
+    } else if (type === "refetchRow") {
+      dispatch(
+        _getTableData(
+          tableData?.map((item) => {
+            if (item?.id !== response?.data?.row?.id) return item;
+            return response?.data?.row;
+          })
+        )
+      );
+      resetClickedRowAction();
+    } else if (type === "downloadData") {
+      downloadURL(response?.data?.url ?? "", response?.data?.filename ?? "");
+      resetClickedRowAction();
+    } else if (type === "download_pdf") {
+      void downloadPDF?.(response?.data?.url ?? "", response?.data?.filename ?? "");
+      resetClickedRowAction();
+    } else if (type === "generatePdf" || type === "downloadPdf") {
+      void generatePDF?.(
+        response?.data ?? {},
+        "Invoice",
+        response?.data?.invoice_number ?? "invoice.pdf"
+      );
+      resetClickedRowAction();
+    }
+  }
+  function handleRowActionRepsonse(action, response) {
+    if (action?.isBulk) {
+      handleCommonCases(action?.onBulkSuccess || "", response);
+    } else {
+      handleCommonCases(action?.onSuccess || "", response);
+    }
+  }
+  async function rowActionsPostHandler(method, url, payload, action, customHeader) {
+    dispatch(_setRowActionPostLoading(true));
+    dispatch(_getClickedRowAction(action));
+    try {
+      const response = await axiosTable({
+        method,
+        url,
+        data: payload instanceof FormData ? payload : { ...payload },
+        ...customHeader && { headers: { ...customHeader } },
+        ...(action?.action_key === "export-excel-blob" || action?.action_key === "export_failed_excel") && {
+          responseType: "blob"
+        }
+      });
+      if (action?.action_key === "export-excel-blob" || action?.action_key === "export_failed_excel") {
+        downloadBlob?.(response?.data);
+        resetClickedRowAction();
+      } else {
+        handleResponseErrors(
+          response,
+          response?.data?.message,
+          () => {
+            if (action?.onSuccess !== "OpenModalForm") {
+              dispatch(_getClickedRowActionResponse(response?.data));
+            } else {
+              dispatch(_getCustomControlRequest(response?.data));
+            }
+            handleRowActionRepsonse(action, response?.data);
+          },
+          void 0
+        );
+      }
+    } catch (err) {
+      console.log(err);
+      resetClickedRowAction();
+      await handleNetworkErrors(err);
+    } finally {
+      dispatch(_setRowActionPostLoading(false));
+      dispatch(_getClickedRowActionId(null));
+    }
+  }
+  return { triggerTableReload, bulkActionsPostHandler, rowActionsPostHandler, resetClickedRowAction };
+}
+
+// src/shims/loading-button.ts
+var loading_button_default = LoadingButton;
+var requireModal = (action) => {
+  return action?.need_confirmation || action?.action_type === "custom_control";
+};
+var ToggleRowActionElement = ({ action, isBulk }) => {
+  const { rowActionsPostHandler } = useUtilsProvider();
+  const dispatch = useDispatch();
+  const { selectedIds } = useSelector((state) => state?.tableColumns);
+  const id = useId();
+  function fireRowAction(action2) {
+    if (requireModal(action2)) {
+      dispatch(_getClickedRowAction({ ...action2, ...isBulk && { isBulk: false } }));
+    } else {
+      rowActionsPostHandler(
+        action2?.method,
+        isBulk ? action2?.action?.api?.replace("/api", "") : action2?.action.api?.replace("/api", ""),
+        { selected_ids: selectedIds },
+        { ...action2, ...isBulk && { isBulk: true } }
+      );
+    }
+  }
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center space-x-2 w-full", children: /* @__PURE__ */ jsxs(
+    Label,
+    {
+      htmlFor: `tableRowSwitch_${id}`,
+      className: `cursor-pointer w-full flex items-center gap-2 px-4 py-2 rounded-lg border transition-colors
+                    ${action?.toggle_current_value ? "border-orange-500 dark:border-orange-700 text-orange-800 dark:text-orange-200 bg-orange-300/10 dark:bg-orange-300/5" : "border-muted-foreground/40"}
+                `,
+      children: [
+        /* @__PURE__ */ jsx(
+          Switch,
+          {
+            defaultChecked: action?.toggle_current_value || false,
+            id: `tableRowSwitch_${id}`,
+            checked: action?.toggle_current_value,
+            onCheckedChange: () => fireRowAction(action),
+            className: "cursor-pointer"
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { children: action?.button?.label })
+      ]
+    }
+  ) });
+};
+var RedirectRowActionElement = ({ action }) => {
+  const [fired, setFired] = useState(false);
+  const handleLinkClick = (e) => {
+    if (e.defaultPrevented || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || e.button && e.button !== 0) {
+      return;
+    }
+    setFired(true);
+  };
+  return /* @__PURE__ */ jsx(Button, { disabled: fired, variant: "outline", className: "w-full p-0!", children: /* @__PURE__ */ jsxs(
+    Link,
+    {
+      className: "flex items-center w-full justify-center gap-1 py-2 px-3!",
+      href: action?.redirect_routes?.api?.replace(/^\/api/, ""),
+      onClick: handleLinkClick,
+      children: [
+        fired ? /* @__PURE__ */ jsx(ImSpinner6, { className: "animate-spin" }) : /* @__PURE__ */ jsx(MdInsertLink, {}),
+        fired ? "Redirecting..." : action?.button?.label
+      ]
+    }
+  ) });
+};
+var ExternalRedirectRowActionElement = ({ action }) => {
+  return /* @__PURE__ */ jsx(Button, { asChild: true, variant: "default", className: "w-full", children: /* @__PURE__ */ jsxs("a", { target: "_blank", className: "inline-flex items-center gap-1 w-full", href: action?.redirect_routes?.api?.replace(/^\/api/, ""), children: [
+    /* @__PURE__ */ jsx(MdInsertLink, {}),
+    action?.button?.label
+  ] }) });
+};
+var CopyTextRowActionElement = ({ action }) => {
+  return /* @__PURE__ */ jsxs(
+    loading_button_default,
+    {
+      variant: "outline",
+      onClick: () => {
+        copyToClipboard(action?.copy_value);
+      },
+      children: [
+        /* @__PURE__ */ jsx(IoCopy, {}),
+        action?.button?.label
+      ]
+    }
+  );
+};
+var GeneralRowActionElement = ({ action, isBulk }) => {
+  const id = useId();
+  const { rowActionsPostHandler } = useUtilsProvider();
+  const dispatch = useDispatch();
+  const { clickedRowAction, clickedRowActionId, rowActionPostLoading } = useSelector((state) => state?.rowActions);
+  const { selectedIds } = useSelector((state) => state?.tableColumns);
+  function fireRowAction(action2) {
+    dispatch(_getClickedRowActionId(id));
+    if (requireModal(action2)) {
+      dispatch(_getClickedRowAction({ ...action2, ...isBulk && { isBulk: false } }));
+      if (action2?.action_type === "custom_control") {
+        rowActionsPostHandler(
+          action2?.method,
+          isBulk ? action2?.action?.api?.replace(/^\/api/, "") : action2?.action.api?.replace(/^\/api/, ""),
+          { selected_ids: selectedIds },
+          action2
+        );
+      }
+    } else {
+      rowActionsPostHandler(
+        action2?.method,
+        isBulk ? action2?.action?.api?.replace(/^\/api/, "") : action2?.action.api?.replace(/^\/api/, ""),
+        { selected_ids: selectedIds },
+        { ...action2, ...isBulk && { isBulk: true } }
+      );
+    }
+  }
+  return /* @__PURE__ */ jsx(
+    loading_button_default,
+    {
+      variant: "secondary",
+      className: "w-full text-[13px] h-auto py-1.5 border",
+      onClick: () => {
+        fireRowAction(action);
+      },
+      isLoading: clickedRowAction?.action_key === action?.action_key && rowActionPostLoading && clickedRowActionId === id,
+      children: action?.button?.label
+    }
+  );
+};
+function TableRowActions({ row, col, isActionCol = false }) {
+  const { selectedRows } = useSelector((state) => state?.tableColumns);
+  const { actionsInRegularCells } = useSelector((state) => state?.rowActions);
+  const dispatch = useDispatch();
+  const rowActions = useMemo(() => {
+    if (actionsInRegularCells) {
+      const filteredColActions = row?.actions[col?.name];
+      return objectToArrayValue(filteredColActions);
+    } else {
+      return objectToArrayValue(row?.actions);
+    }
+  }, [row, actionsInRegularCells, col]);
+  console.log("\u{1F680} actionsInRegularCells \u{1F449}", actionsInRegularCells, "\u2728");
+  useEffect(() => {
+    if (selectedRows?.length > 0) {
+      dispatch(_getSelectedRowActions(objectToArrayValue(getIntersectedRowActions(selectedRows?.map((row2) => row2?.actions)))));
+    } else {
+      dispatch(_getSelectedRowActions([]));
+    }
+  }, [selectedRows]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    !col?.separated_action && /* @__PURE__ */ jsx(Fragment, { children: rowActions?.filter((action) => action)?.length > 0 ? /* @__PURE__ */ jsxs(Popover, { children: [
+      /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "icon", children: /* @__PURE__ */ jsx(PiDotsThreeOutlineVerticalBold, { className: "!w-3 !h-3" }) }) }),
+      /* @__PURE__ */ jsx(PopoverContent, { align: "end", className: "inline-flex min-w-[160px] p-2 z-100!", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 w-full", children: rowActions?.filter((action) => action)?.map((action) => /* @__PURE__ */ jsx("div", { className: "w-full", children: action?.action_type === "toggle" ? /* @__PURE__ */ jsx(ToggleRowActionElement, { action }) : action?.action_type === "redirect" ? /* @__PURE__ */ jsx(RedirectRowActionElement, { action }) : action?.action_type === "external_redirect" ? /* @__PURE__ */ jsx(ExternalRedirectRowActionElement, { action }) : action?.action_type === "copy" ? /* @__PURE__ */ jsx(CopyTextRowActionElement, { action }) : /* @__PURE__ */ jsx(GeneralRowActionElement, { action }) }, action?.action_key)) }) })
+    ] }) : /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: "\u063A\u064A\u0631 \u0645\u0641\u0639\u0644" }) }),
+    col?.separated_action && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 w-full", children: rowActions?.filter((action) => action)?.map((action) => /* @__PURE__ */ jsx("div", { className: "w-full", children: action?.action_type === "toggle" ? /* @__PURE__ */ jsx(ToggleRowActionElement, { action }) : action?.action_type === "redirect" ? /* @__PURE__ */ jsx(RedirectRowActionElement, { action }) : action?.action_type === "external_redirect" ? /* @__PURE__ */ jsx(ExternalRedirectRowActionElement, { action }) : action?.action_type === "copy" ? /* @__PURE__ */ jsx(CopyTextRowActionElement, { action }) : /* @__PURE__ */ jsx(GeneralRowActionElement, { action }) }, action?.action_key)) })
+  ] });
+}
+var TableRowActions_default = TableRowActions;
+
+// src/host/storage.ts
+function getHostStorage() {
+  const config = getApiTablesRuntimeConfig();
+  if (config?.useSecureLS) {
+    return config.useSecureLS();
+  }
+  return config?.storage ?? { get: () => null, set: () => void 0 };
+}
+var copyToClipboard = (value, noToast, msg) => {
+  navigator.clipboard.writeText(value).then(function() {
+    console.log("");
+  }).catch(function(err) {
+    console.error("Failed to copy text: ", err);
+  });
+  {
+    toast.success("\u062A\u0645 \u0627\u0644\u0646\u0633\u062E");
+  }
+};
+function truncateStart(fullStr, strLen, separator) {
+  if (fullStr?.length <= strLen) return fullStr;
+  separator = separator || "...";
+  let charsToShow = strLen, frontChars = Math.ceil(charsToShow);
+  return fullStr?.substr(0, frontChars) + separator;
+}
+function formatDateNoTime(timestamp) {
+  const date = new Date(timestamp);
+  const day = date.getDate().toString().padStart(2, "0");
+  const month = (date.getMonth() + 1).toString().padStart(2, "0");
+  const year = date.getFullYear();
+  return `${day}/${month}/${year}`;
+}
+function objectToArrayValue(obj) {
+  return obj ? Object.keys(obj).map((key) => obj[key]) : [];
+}
+function objectToArrayKey(obj) {
+  return obj ? Object.keys(obj).map((key) => key) : [];
+}
+function objectToArrayKeyVal(obj) {
+  return obj ? Object.keys(obj).map((key) => ({
+    key: obj[key],
+    value: key
+  })) : [];
+}
+function downloadURL(url, name) {
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = `${name}`;
+  document.body.appendChild(link);
+  link.setAttribute("target", "_blank");
+  link.click();
+  URL.revokeObjectURL(url);
+  document.body.removeChild(link);
+}
+function getIntersectedRowActions(arrayOfObjects) {
+  if (arrayOfObjects.length === 0) return {};
+  const result = {};
+  for (const key in arrayOfObjects[0]) {
+    const actionKey = arrayOfObjects[0][key].action_key;
+    const isCommon = arrayOfObjects.every((obj) => obj[key] && obj[key].action_key === actionKey);
+    if (isCommon) {
+      result[key] = arrayOfObjects[0][key];
+    }
+  }
+  return result;
+}
+function restructureSelectedFilters(data, dirtyFields, structureFilters) {
+  const submittedData = objectToArrayKey(dirtyFields);
+  const filteredObject = Object.fromEntries(
+    Object.entries(data)?.filter(([key, value]) => {
+      if (typeof value === "string") {
+        const typedValue2 = value;
+        return submittedData?.includes(key) && typedValue2?.trim() !== "" && typedValue2;
+      }
+      const typedValue = value;
+      return submittedData?.includes(key) && typedValue?.fieldValue !== "" && typedValue?.fieldValue;
+    })
+  );
+  const renderedFilters = Object.keys(filteredObject)?.map((key) => {
+    const targetFilter = structureFilters?.find((filter) => filter?.filter_name === key);
+    const value = typeof filteredObject[key] === "string" ? filteredObject[key] : filteredObject[key].fieldValue;
+    return {
+      key,
+      value,
+      label: targetFilter?.label,
+      type: targetFilter?.type,
+      valueLable: targetFilter?.props?.select_options ? targetFilter?.props?.select_options[value] : value,
+      operator: targetFilter?.type === "date" ? targetFilter?.props?.operators?.[0] : filteredObject[key]?.operator,
+      props: targetFilter?.props
+    };
+  });
+  return renderedFilters;
+}
+var calculateMinWidth = (content, title, type) => {
+  const charWidth = 8;
+  const padding = 34;
+  const headPadding = 60;
+  const cellContent = content?.length * charWidth + padding;
+  const headContent = title?.length * charWidth + headPadding;
+  return type === "link" ? "200px" : `${Math.max(cellContent, headContent)}px`;
+};
+var rowWithLongestField = (data, field) => {
+  return data?.reduce((longest, current) => {
+    return current[field]?.length > longest?.length ? current[field] : longest;
+  }, "");
+};
+var calculateColMinWidth = (content, title) => {
+  const charWidth = 8;
+  const padding = 34;
+  const headPadding = 60;
+  const cellContent = content?.length * charWidth + padding;
+  const headContent = title?.length * charWidth + headPadding;
+  return Math.max(cellContent, headContent) <= 500 ? `${Math.max(cellContent, headContent) + 20}px` : "500px";
+};
+var tableRowWithLongestField = (data, field) => {
+  return data?.reduce((longest, current) => {
+    return current[field]?.length > longest?.length ? current[field] : longest;
+  }, "");
+};
+function formatTableColumns(cols, tbData) {
+  return cols?.filter((col) => col?.showable)?.map((col) => {
+    return {
+      name: col?.label,
+      sortable: col?.sortable,
+      colIdentifier: col?.data_src,
+      data_src: col?.data_src,
+      type: col?.type,
+      minWidth: col?.type !== "link" && col?.type !== "barcode" ? calculateColMinWidth(tableRowWithLongestField(tbData, col?.data_src), col?.label) : "250px",
+      selector: (row) => row[col?.data_src],
+      cell: (row) => {
+        return /* @__PURE__ */ jsx("div", { "data-row": JSON.stringify(row), className: "text-sm tabel-col-cell w-full", children: row[col?.data_src] === null ? /* @__PURE__ */ jsx("p", { className: "mb-0", children: "-" }) : row[col?.data_src] !== null && /* @__PURE__ */ jsx(Fragment, { children: col?.type === "text" ? /* @__PURE__ */ jsx(TextCell, { col, row }) : col?.type === "text_truncate" ? /* @__PURE__ */ jsx("p", { className: "mb-0 text-wrap", children: truncateStart(row[col?.data_src], 20, "...") }) : col?.type === "link" ? /* @__PURE__ */ jsx(LinkCell, { col, row }) : col?.type === "boolean" ? /* @__PURE__ */ jsx(BooleanCell, { col, row }) : col?.type === "html" ? /* @__PURE__ */ jsx(HTMLCell, { col, row }) : col?.type === "datalist" || col?.type === "dataList" ? /* @__PURE__ */ jsx(DataListCell, { col, row }) : col?.type === "barcode" ? /* @__PURE__ */ jsx(BarcodeCell, { col, row }) : col?.type === "actions" && row?.actions && Object.keys(row?.actions)?.length > 0 && /* @__PURE__ */ jsx(TableRowActions_default, { isActionCol: true, row, col }) }) });
+      }
+    };
+  });
+}
+function AppliedFilters({ setValue, resetField }) {
+  const t = useTranslations("ApiTables");
+  const { renderedFilters } = useSelector((state) => state.tableCore);
+  const dispatch = useDispatch();
+  function handleClearRenderedFilters(key, props, type) {
+    const filteredRenderedFilters = renderedFilters?.filter((filter) => filter?.key !== key);
+    if (type !== "date") {
+      setValue(`${key}.fieldValue`, "", { shouldDirty: true, shouldValidate: true });
+      setValue(`${key}.operator`, props?.operators[0], { shouldDirty: true, shouldValidate: true });
+    } else {
+      resetField(`${key}.fieldValue`);
+    }
+    dispatch(_setRenderedFilters(filteredRenderedFilters));
+    dispatch(_setAppliedFilters(filteredRenderedFilters));
+    dispatch(_setCurrentPage(1));
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: renderedFilters?.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-3 p-0 mb-1 my-5", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-sm font-bold me-2", children: t("filterBy") }),
+    renderedFilters?.map((filter) => /* @__PURE__ */ jsx("div", { className: "mb-1", children: /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "ps-2 pe-0.5 rounded-full border !border-foreground/30 dark:border-foreground/10", children: [
+      /* @__PURE__ */ jsxs("strong", { className: "me-1", children: [
+        filter?.label,
+        ":"
+      ] }),
+      /* @__PURE__ */ jsx("span", { children: filter?.type !== "date" ? filter?.valueLable : formatDateNoTime(filter?.value) }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "default",
+          className: "p-0 ms-3 !px-0 h-5 w-5 max-w-5 rounded-full hover:bg-destructive/10 dark:hover:bg-destructive/10 hover:text-destructive  bg-foreground dark:bg-foreground/10",
+          onClick: () => handleClearRenderedFilters(filter?.key, filter?.props, filter?.type),
+          children: /* @__PURE__ */ jsx(X, { className: "size-3" })
+        }
+      )
+    ] }) }, nanoid()))
+  ] }) });
+}
+var AppliedFilters_default = AppliedFilters;
+
+// src/table-utils/useUtilTranslator.ts
+function useUtilTranslator() {
+  const t = useTranslations("General");
+  function getOperatorLabel(operator) {
+    if (operator === "=") {
+      return t("exact");
+    }
+    if (operator === "like") {
+      return t("like");
+    }
+    if (operator === ">=") {
+      return t("greaterOrEqual");
+    }
+    if (operator === "<=") {
+      return t("lessOrEqual");
+    }
+  }
+  return { getOperatorLabel };
+}
+
+// src/shims/tags-input.ts
+var tags_input_default = TagsInput;
+function TableFilters({ showFilters, setShowFilters }) {
+  const { tableName, structureFilters } = useSelector((state) => state.tableCore);
+  const [expandedFilters, setExpandedFilters] = useState(true);
+  const [isSubmitEnabled, setIsSubmitEnabled] = useState(false);
+  const dispatch = useDispatch();
+  const t = useTranslations("General");
+  const tApiTables = useTranslations("ApiTables");
+  const {
+    handleSubmit,
+    control,
+    setValue,
+    resetField,
+    watch,
+    formState: { dirtyFields }
+  } = useForm();
+  const watchFields = watch();
+  const { getOperatorLabel } = useUtilTranslator();
+  useEffect(() => {
+    const isAnyFieldFilled = Object.values(watchFields).some((field) => {
+      const v = field?.fieldValue;
+      if (typeof v === "string") return v?.trim() !== "";
+      if (v && typeof v === "object" && "from" in v) return !!v.from;
+      if (v instanceof Date) return true;
+      if (Array.isArray(v)) return v.length > 0;
+      return false;
+    });
+    setIsSubmitEnabled(isAnyFieldFilled);
+  }, [watchFields]);
+  const getOperators = (filter) => {
+    return filter?.props?.operators;
+  };
+  const renderOperator = (filter) => {
+    return filter?.props?.operators?.length > 1;
+  };
+  const DATE_FORMAT = "dd-MM-yyyy";
+  function formatSingleDate(date) {
+    if (!date || !isValid(date)) return null;
+    const formatted = format(date, DATE_FORMAT);
+    return { label: formatted, value: formatted };
+  }
+  function formatDateRangeFromCalendar(range) {
+    if (!range?.from || !isValid(range.from)) return null;
+    const fromStr = format(range.from, DATE_FORMAT);
+    const toDate = range.to && isValid(range.to) ? range.to : range.from;
+    const toStr = format(toDate, DATE_FORMAT);
+    const label = `${fromStr} - ${toStr}`;
+    return { label, value: [fromStr, toStr] };
+  }
+  function submitFiltersHandler(data) {
+    const updatedForTags = Object.fromEntries(
+      Object.entries(data).map(([key, value]) => {
+        if (typeof value.fieldValue === "string" && value.operator === "in") {
+          return [key, { ...value, fieldValue: value.fieldValue.split(",")?.filter((el) => el !== "") }];
+        }
+        if (value.fieldValue instanceof Date) {
+          const formatted = formatSingleDate(value.fieldValue);
+          if (formatted) return [key, { ...value, fieldValue: formatted.value }];
+        }
+        if (value.operator === "between" && value.fieldValue && typeof value.fieldValue === "object" && "from" in value.fieldValue) {
+          const formatted = formatDateRangeFromCalendar(value.fieldValue);
+          if (formatted) return [key, { ...value, fieldValue: formatted.value }];
+        }
+        return [key, value];
+      })
+    );
+    const updatedForDate = Object.fromEntries(
+      Object.entries(data).map(([key, value]) => {
+        if (value.fieldValue instanceof Date) {
+          const formatted = formatSingleDate(value.fieldValue);
+          if (formatted) return [key, { ...value, fieldValue: formatted.label }];
+        }
+        if (value.operator === "between" && value.fieldValue && typeof value.fieldValue === "object" && "from" in value.fieldValue) {
+          const formatted = formatDateRangeFromCalendar(value.fieldValue);
+          if (formatted) return [key, { ...value, fieldValue: formatted.label }];
+        }
+        return [key, value];
+      })
+    );
+    dispatch(_setAppliedFilters(restructureSelectedFilters(updatedForTags, dirtyFields, structureFilters)));
+    dispatch(_setRenderedFilters(restructureSelectedFilters(updatedForDate, dirtyFields, structureFilters)));
+    dispatch(_setCurrentPage(1));
+    setShowFilters(false);
+  }
+  return (
+    // <div className="z-[200]">
+    //     <div className="flex mb-5 justify-start">
+    //         <Button variant="outline" onClick={() => setExpandedFilters((prev) => !prev)}>
+    //             {expandedFilters ? <GoChevronUp className="ms-auto" /> : <GoChevronDown className="ms-auto" />}
+    //             {expandedFilters ? tApiTables("hide_filters") : tApiTables("show_filters")}
+    //         </Button>
+    //     </div>
+    //     <div className={`${expandedFilters ? "block" : "hidden"}`}>
+    // <form
+    //     noValidate
+    //     className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-3 items-end"
+    //     onSubmit={handleSubmit(submitFiltersHandler)}
+    // >
+    //     {/* ... Date Type Filters */}
+    //     {structureFilters
+    //         ?.filter((filter) => filter?.type === "date")
+    //         ?.map(
+    //             (filter) =>
+    //                 filter?.pair_with && (
+    //                     <div className="m-0 w-full" key={filter.filter_name}>
+    //                         <Controller
+    //                             name={`${filter?.filter_name}.fieldValue`}
+    //                             control={control}
+    //                             defaultValue={undefined}
+    //                             render={({ field }) => (
+    //                                 <Popover>
+    //                                     <PopoverTrigger asChild>
+    //                                         <Button
+    //                                             id="date"
+    //                                             variant="outline"
+    //                                             className={cn(
+    //                                                 "w-[300px] justify-start text-left font-normal bg-background",
+    //                                                 !field.value && "text-muted-foreground"
+    //                                             )}
+    //                                         >
+    //                                             <CalendarIcon className="mr-2 h-4 w-4" />
+    //                                             {field.value?.from ? (
+    //                                                 field.value.to ? (
+    //                                                     <>
+    //                                                         {format(field.value.from, "LLL dd, y")} -{" "}
+    //                                                         {format(field.value.to, "LLL dd, y")}
+    //                                                     </>
+    //                                                 ) : (
+    //                                                     format(field.value.from, "LLL dd, y")
+    //                                                 )
+    //                                             ) : (
+    //                                                 <span>Pick a date</span>
+    //                                             )}
+    //                                         </Button>
+    //                                     </PopoverTrigger>
+    //                                     <PopoverContent className="w-auto p-0" align="start">
+    //                                         <Calendar
+    //                                             autoFocus
+    //                                             mode="range"
+    //                                             defaultMonth={field.value?.from}
+    //                                             selected={field.value}
+    //                                             onSelect={(dates) => field.onChange(dates)}
+    //                                             numberOfMonths={1}
+    //                                         />
+    //                                     </PopoverContent>
+    //                                 </Popover>
+    //                             )}
+    //                         />
+    //                     </div>
+    //                 )
+    //         )}
+    //     {true &&
+    //         structureFilters
+    //             ?.filter((filter) => filter?.type !== "range" && filter?.type !== "date")
+    //             ?.map((filter) => (
+    //                 <div className="space-y-2" key={filter?.filter_name}>
+    //                     <Label>{filter?.label}</Label>
+    //                     <div className={`${renderOperator(filter) ? "relative" : ""}`}>
+    //                         <div className={`flex items-stretch`}>
+    //                             <div className="m-0 w-full">
+    //                                 {filter?.type === "text" && (
+    //                                     <Controller
+    //                                         name={`${filter?.filter_name}.fieldValue`}
+    //                                         control={control}
+    //                                         defaultValue=""
+    //                                         render={({ field }) => (
+    //                                             <Input
+    //                                                 className={`!focus-visible:ring-0 !focus-visible:shadow-none bg-background ${
+    //                                                     renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""
+    //                                                 }`}
+    //                                                 aria-label={`${filter?.filter_name}`}
+    //                                                 {...field}
+    //                                                 type={filter?.type}
+    //                                                 placeholder={filter?.label}
+    //                                             />
+    //                                         )}
+    //                                     />
+    //                                 )}
+    //                                 {(filter?.type === "select" || filter?.type === "boolean" || filter?.type === "null") && (
+    //                                     <Controller
+    //                                         name={`${filter?.filter_name}.fieldValue`}
+    //                                         control={control}
+    //                                         defaultValue={undefined}
+    //                                         render={({ field }) => (
+    //                                             <Select
+    //                                                 {...field}
+    //                                                 onValueChange={field.onChange}
+    //                                                 defaultValue={field.value}
+    //                                                 aria-label={`${filter?.filter_name}`}
+    //                                             >
+    //                                                 <SelectTrigger
+    //                                                     className={`w-full cursor-pointer bg-background
+    //                                                     ${renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""}  `}
+    //                                                 >
+    //                                                     <SelectValue placeholder={filter?.label} />
+    //                                                 </SelectTrigger>
+    //                                                 <SelectContent>
+    //                                                     {objectToArrayKeyVal(filter?.props?.select_options || {})
+    //                                                         ?.sort((a, b) => (a.value === "" ? -1 : b.value === "" ? 1 : 0))
+    //                                                         ?.map((opt) => (
+    //                                                             <SelectItem value={opt?.value} key={opt?.value}>
+    //                                                                 {opt?.key}
+    //                                                             </SelectItem>
+    //                                                         ))}
+    //                                                 </SelectContent>
+    //                                             </Select>
+    //                                         )}
+    //                                     />
+    //                                 )}
+    //                                 {filter?.type === "number" && (
+    //                                     <Controller
+    //                                         name={`${filter?.filter_name}.fieldValue`}
+    //                                         control={control}
+    //                                         defaultValue=""
+    //                                         render={({ field }) => (
+    //                                             <Input
+    //                                                 className={`bg-background ${
+    //                                                     renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""
+    //                                                 }`}
+    //                                                 {...field}
+    //                                                 aria-label={`${filter?.filter_name}`}
+    //                                                 type="text"
+    //                                                 onKeyDown={(e) => {
+    //                                                     // Allow: backspace, delete, tab, escape, enter, decimal point
+    //                                                     if (
+    //                                                         [46, 8, 9, 27, 13, 190, 110].indexOf(e.keyCode) !== -1 ||
+    //                                                         // Allow: Ctrl+A
+    //                                                         (e.keyCode === 65 && e.ctrlKey === true) ||
+    //                                                         // Allow: home, end, left, right
+    //                                                         (e.keyCode >= 35 && e.keyCode <= 39)
+    //                                                     ) {
+    //                                                         return;
+    //                                                     }
+    //                                                     // Ensure that it is a number and stop the keypress if not
+    //                                                     if (
+    //                                                         (e.shiftKey || e.keyCode < 48 || e.keyCode > 57) &&
+    //                                                         (e.keyCode < 96 || e.keyCode > 105)
+    //                                                     ) {
+    //                                                         e.preventDefault();
+    //                                                     }
+    //                                                 }}
+    //                                                 onChange={(e) => {
+    //                                                     // Only allow numbers and one decimal point
+    //                                                     const value = e.target.value.replace(/[^\d.]/g, "");
+    //                                                     // Prevent multiple decimal points
+    //                                                     const parts = value.split(".");
+    //                                                     if (parts.length > 2) {
+    //                                                         return;
+    //                                                     }
+    //                                                     field.onChange(value);
+    //                                                 }}
+    //                                                 placeholder={filter?.label}
+    //                                             />
+    //                                         )}
+    //                                     />
+    //                                 )}
+    //                                 {filter?.type === "multi_select" && !filter?.props?.options && <></>}
+    //                                 {filter?.type === "multi_select" && filter?.props?.options && <></>}
+    //                             </div>
+    //                             <Controller
+    //                                 name={`${filter.filter_name}.operator`}
+    //                                 control={control}
+    //                                 defaultValue={getOperators(filter)[0]}
+    //                                 render={({ field }) => (
+    //                                     <Select
+    //                                         {...field}
+    //                                         onValueChange={field.onChange}
+    //                                         value={field.value || getOperators(filter)[0]}
+    //                                         aria-label={`${filter?.filter_name}`}
+    //                                     >
+    //                                         <Tooltip>
+    //                                             <TooltipTrigger asChild>
+    //                                                 <SelectTrigger
+    //                                                     className={`bg-muted-foreground/10 absolute top-[3px] end-[3px] min-w-[80px] max-w-[80px] border-none !h-[32px] !cursor-pointer shadow-none ${
+    //                                                         renderOperator(filter) ? "" : "hidden"
+    //                                                     }`}
+    //                                                 >
+    //                                                     <SelectValue />
+    //                                                 </SelectTrigger>
+    //                                             </TooltipTrigger>
+    //                                             <TooltipContent className="dark:text-background">
+    //                                                 {getOperatorLabel(watch(`${filter.filter_name}.operator`)) ||
+    //                                                     getOperatorLabel(getOperators(filter)?.[0])}
+    //                                             </TooltipContent>
+    //                                         </Tooltip>
+    //                                         <SelectContent align={"end"}>
+    //                                             {getOperators(filter)?.map((operator: string) => (
+    //                                                 <SelectItem key={operator} value={operator}>
+    //                                                     {operator}
+    //                                                 </SelectItem>
+    //                                             ))}
+    //                                         </SelectContent>
+    //                                     </Select>
+    //                                 )}
+    //                             />
+    //                         </div>
+    //                     </div>
+    //                 </div>
+    //             ))}
+    //     {/* Filters Submission */}
+    //     <div className="col">
+    //         <Button type="submit" variant="primary-opac" className="px-5" disabled={!isSubmitEnabled}>
+    //             {t("apply")}
+    //         </Button>
+    //     </div>
+    // </form>
+    //     </div>
+    //     <AppliedFilters setValue={setValue} resetField={resetField} />
+    // </div>
+    /* @__PURE__ */ jsxs(Fragment, { children: [
+      structureFilters?.length > 0 && /* @__PURE__ */ jsxs(Sheet, { open: showFilters, onOpenChange: setShowFilters, children: [
+        /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "outline", className: "hidden" }) }),
+        /* @__PURE__ */ jsxs(SheetContent, { className: "z-[999] rounded-xl overflow-hidden! pb-5", children: [
+          /* @__PURE__ */ jsx(SheetHeader, { children: /* @__PURE__ */ jsx(SheetTitle, { children: tApiTables("filters") }) }),
+          /* @__PURE__ */ jsxs(
+            "form",
+            {
+              noValidate: true,
+              id: "tb_filters_form",
+              className: "flex flex-col h-full overflow-y-auto gap-4 px-4 pb-20 relative",
+              onSubmit: handleSubmit(submitFiltersHandler),
+              children: [
+                structureFilters?.filter((filter) => filter?.type === "date")?.map(
+                  (filter) => filter?.pair_with && /* @__PURE__ */ jsxs("div", { className: "m-0 w-full space-y-2", children: [
+                    /* @__PURE__ */ jsx(Label, { children: filter?.label }),
+                    /* @__PURE__ */ jsx(
+                      Controller,
+                      {
+                        name: `${filter?.filter_name}.fieldValue`,
+                        control,
+                        defaultValue: void 0,
+                        render: ({ field }) => /* @__PURE__ */ jsx(
+                          DatePicker,
+                          {
+                            date: field.value instanceof Date ? field.value : void 0,
+                            setDate: field.onChange,
+                            placeholder: filter?.label
+                          }
+                        )
+                      }
+                    )
+                  ] }, filter.filter_name)
+                ),
+                structureFilters?.filter((filter) => filter?.type !== "range" && filter?.type !== "date")?.map((filter) => /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ jsx(Label, { children: filter?.label }),
+                  /* @__PURE__ */ jsx("div", { className: `${renderOperator(filter) ? "relative" : ""}`, children: /* @__PURE__ */ jsxs("div", { className: `flex items-stretch`, children: [
+                    /* @__PURE__ */ jsxs("div", { className: "m-0 w-full", children: [
+                      filter?.type === "text" && /* @__PURE__ */ jsx(
+                        Controller,
+                        {
+                          name: `${filter?.filter_name}.fieldValue`,
+                          control,
+                          defaultValue: "",
+                          render: ({ field }) => /* @__PURE__ */ jsx(
+                            Input,
+                            {
+                              className: `!focus-visible:ring-0 !focus-visible:shadow-none bg-background ${renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""}`,
+                              "aria-label": `${filter?.filter_name}`,
+                              ...field,
+                              type: filter?.type,
+                              placeholder: filter?.label
+                            }
+                          )
+                        }
+                      ),
+                      (filter?.type === "select" || filter?.type === "boolean" || filter?.type === "null") && /* @__PURE__ */ jsx(
+                        Controller,
+                        {
+                          name: `${filter?.filter_name}.fieldValue`,
+                          control,
+                          defaultValue: void 0,
+                          render: ({ field }) => /* @__PURE__ */ jsxs(
+                            Select,
+                            {
+                              ...field,
+                              onValueChange: field.onChange,
+                              defaultValue: field.value,
+                              "aria-label": `${filter?.filter_name}`,
+                              children: [
+                                /* @__PURE__ */ jsx(
+                                  SelectTrigger,
+                                  {
+                                    className: `w-full cursor-pointer bg-background
+                                                                    ${renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""}  `,
+                                    children: /* @__PURE__ */ jsx(SelectValue, { placeholder: filter?.label })
+                                  }
+                                ),
+                                /* @__PURE__ */ jsx(SelectContent, { children: objectToArrayKeyVal(filter?.props?.select_options || {})?.sort((a, b) => a.value === "" ? -1 : b.value === "" ? 1 : 0)?.map((opt) => /* @__PURE__ */ jsx(SelectItem, { value: opt?.value, children: opt?.key }, opt?.value)) })
+                              ]
+                            }
+                          )
+                        }
+                      ),
+                      filter?.type === "number" && /* @__PURE__ */ jsx(
+                        Controller,
+                        {
+                          name: `${filter?.filter_name}.fieldValue`,
+                          control,
+                          defaultValue: "",
+                          render: ({ field }) => /* @__PURE__ */ jsx(
+                            Input,
+                            {
+                              className: `bg-background ${renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""}`,
+                              ...field,
+                              "aria-label": `${filter?.filter_name}`,
+                              type: "text",
+                              onKeyDown: (e) => {
+                                if ([46, 8, 9, 27, 13, 190, 110].indexOf(e.keyCode) !== -1 || // Allow: Ctrl+A
+                                e.keyCode === 65 && e.ctrlKey === true || // Allow: home, end, left, right
+                                e.keyCode >= 35 && e.keyCode <= 39) {
+                                  return;
+                                }
+                                if ((e.shiftKey || e.keyCode < 48 || e.keyCode > 57) && (e.keyCode < 96 || e.keyCode > 105)) {
+                                  e.preventDefault();
+                                }
+                              },
+                              onChange: (e) => {
+                                const value = e.target.value.replace(/[^\d.]/g, "");
+                                const parts = value.split(".");
+                                if (parts.length > 2) {
+                                  return;
+                                }
+                                field.onChange(value);
+                              },
+                              placeholder: filter?.label
+                            }
+                          )
+                        }
+                      ),
+                      filter?.type === "multi_select" && filter?.props?.selectOptions && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+                        Controller,
+                        {
+                          name: `${filter?.filter_name}.fieldValue`,
+                          control,
+                          defaultValue: void 0,
+                          render: ({ field }) => /* @__PURE__ */ jsxs(
+                            MultiSelect,
+                            {
+                              ...field,
+                              onValuesChange: (values) => field.onChange(values),
+                              defaultValues: field.value || [],
+                              "aria-label": `${filter?.filter_name}`,
+                              children: [
+                                /* @__PURE__ */ jsx(
+                                  MultiSelectTrigger,
+                                  {
+                                    className: `w-full cursor-pointer bg-background
+                                                                    ${renderOperator(filter) ? "border-ee-0 rounded-e-nonee" : ""}  `,
+                                    children: /* @__PURE__ */ jsx(MultiSelectValue, { placeholder: filter?.label })
+                                  }
+                                ),
+                                /* @__PURE__ */ jsx(MultiSelectContent, { children: objectToArrayKeyVal(filter?.props?.selectOptions || {})?.sort((a, b) => a.value === "" ? -1 : b.value === "" ? 1 : 0)?.map((opt) => /* @__PURE__ */ jsx(MultiSelectItem, { value: opt?.value, children: opt?.key }, opt?.value)) })
+                              ]
+                            }
+                          )
+                        }
+                      ) }),
+                      filter?.type === "multi_select" && !filter?.props?.selectOptions && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+                        Controller,
+                        {
+                          name: `${filter?.filter_name}.fieldValue`,
+                          control,
+                          defaultValue: "",
+                          render: ({ field }) => /* @__PURE__ */ jsx(
+                            tags_input_default,
+                            {
+                              value: field.value || [],
+                              onChange: (values) => field.onChange(values),
+                              placeholder: filter?.label
+                            }
+                          )
+                        }
+                      ) })
+                    ] }),
+                    /* @__PURE__ */ jsx(
+                      Controller,
+                      {
+                        name: `${filter.filter_name}.operator`,
+                        control,
+                        defaultValue: getOperators(filter)[0],
+                        render: ({ field }) => /* @__PURE__ */ jsxs(
+                          Select,
+                          {
+                            ...field,
+                            onValueChange: field.onChange,
+                            value: field.value || getOperators(filter)[0],
+                            "aria-label": `${filter?.filter_name}`,
+                            children: [
+                              /* @__PURE__ */ jsxs(Tooltip, { children: [
+                                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+                                  SelectTrigger,
+                                  {
+                                    className: `bg-muted-foreground/10 absolute top-[3px] end-[3px] bottom-[3px] min-w-[80px] max-w-[80px] border-none !h-[30px] !cursor-pointer shadow-none ${renderOperator(filter) ? "" : "hidden"}`,
+                                    children: /* @__PURE__ */ jsx(SelectValue, {})
+                                  }
+                                ) }),
+                                /* @__PURE__ */ jsx(TooltipContent, { className: "dark:text-background", children: getOperatorLabel(watch(`${filter.filter_name}.operator`)) || getOperatorLabel(getOperators(filter)?.[0]) })
+                              ] }),
+                              /* @__PURE__ */ jsx(SelectContent, { align: "end", children: getOperators(filter)?.map((operator) => /* @__PURE__ */ jsx(SelectItem, { value: operator, children: operator }, operator)) })
+                            ]
+                          }
+                        )
+                      }
+                    )
+                  ] }) })
+                ] }, filter?.filter_name))
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "col absolute bottom-0 p-3 bg-background dark:bg-neutral-800  left-0 right-0", children: /* @__PURE__ */ jsx(Button, { form: "tb_filters_form", type: "submit", variant: "primary-opac", className: "px-5 w-full", disabled: !isSubmitEnabled, children: t("apply") }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(AppliedFilters_default, { setValue, resetField })
+    ] })
+  );
+}
+var TableFilters_default = TableFilters;
+var Checkbox2 = React4.forwardRef(({ onClick, onChange, checked, ...rest }, ref) => {
+  return /* @__PURE__ */ jsx(Checkbox, { ref, onCheckedChange: onClick, checked, ...rest });
+});
+function TableLoader({ count }) {
+  return /* @__PURE__ */ jsx("div", { className: "w-full P-4 bg-neutral-100 dark:bg-neutral-700", children: /* @__PURE__ */ jsx("div", { className: "mb-0 flex  flex-col gap-1 p-2", children: Array.from({ length: count }, (_, index) => /* @__PURE__ */ jsx(Skeleton, { className: "h-[50px] dark:bg-neutral-800 bg-neutral-200 w-full rounded-md" }, index)) }) });
+}
+function ExpandedRow({ data }) {
+  const { tableColumns } = useSelector((state) => state.tableColumns);
+  return /* @__PURE__ */ jsx("div", { className: "bg-neutral-100 dark:bg-neutral-800 dark:text-white", children: /* @__PURE__ */ jsx("div", { style: { maxWidth: "500px" }, className: "w-full", children: /* @__PURE__ */ jsx("div", { className: "grid items-center grid-cols-1 lg:grid-cols-12 gap-3 text-end g-4 py-4", children: tableColumns?.map((col, index) => /* @__PURE__ */ jsx("div", { className: `${col?.type === "actions" ? "lg:col-span-9" : "lg:col-span-6"}`, children: /* @__PURE__ */ jsxs("div", { className: "h-full w-full flex px-3 gap-2 items-start", children: [
+    /* @__PURE__ */ jsx(FaCircle, { size: 4, className: "mt-[5px] text-primary flex-shrink-0" }),
+    /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+      /* @__PURE__ */ jsx("h6", { className: "text-[12px] text-start font-semibold mb-1", children: col?.name }),
+      /* @__PURE__ */ jsx("div", { className: "text-start", children: col?.cell(data) })
+    ] })
+  ] }) }, index)) }) }) });
+}
+var ExpandedRow_default = ExpandedRow;
+
+// src/shims/useSecureLS.ts
+function useSecureLS() {
+  return getHostStorage();
+}
+
+// src/shims/app-currency.ts
+var app_currency_default = AppCurrency;
+function CalculateWithdrawalAmount({ selectedRows }) {
+  const t = useTranslations("ApiTables");
+  useDispatch();
+  const { bulkActions } = useSelector((state) => state.bulkActions ?? { bulkActions: [] });
+  const totalAmountSelected = useMemo(() => {
+    return selectedRows?.reduce((total, row) => total + Number(row?.dues), 0) ?? 0;
+  }, [selectedRows]);
+  useMemo(
+    () => bulkActions?.find((a) => a?.action_key === "create_withdrawal_bulk"),
+    [bulkActions]
+  );
+  return totalAmountSelected > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-center gap-2 mb-3", children: /* @__PURE__ */ jsx("h6", { className: "text-3xl mb-0 lh-1", style: { lineHeight: "1 !important" }, children: /* @__PURE__ */ jsxs("span", { className: "text-sm font-[400] flex items-center gap-1", children: [
+    totalAmountSelected?.toFixed(2),
+    " ",
+    /* @__PURE__ */ jsx(app_currency_default, { t, className: "text-sm font-[400]" })
+  ] }) }) });
+}
+function TableBody2() {
+  const { bulkActions } = useSelector((state) => state.bulkActions);
+  const { structureRowActions, actionsInRegularCells } = useSelector((state) => state.rowActions);
+  const { tableColumns, toggledClearRows, selectedRows } = useSelector((state) => state.tableColumns);
+  const { tableData, tableFetchingLoading, pageSize, structureColumns, tableName, customElement } = useSelector((state) => state.tableCore);
+  const dispatch = useDispatch();
+  const tApiTables = useTranslations("ApiTables");
+  const { get } = useSecureLS();
+  function sortingTableHandler(column, sortDirection) {
+    dispatch(_setTableSorting({ label: column?.name, direction: sortDirection, [column?.colIdentifier]: sortDirection }));
+  }
+  useEffect(() => {
+    dispatch(_setTableColumns({ cols: structureColumns?.filter((col) => col?.showable), tbData: tableData }));
+    if (!get(`${tableName}_tb`)) {
+      dispatch(_setVisibleColumns(structureColumns?.map((col) => col?.data_src)));
+    } else {
+      dispatch(_setVisibleColumns(JSON.parse(get(`${tableName}_tb`))));
+    }
+  }, [structureColumns, tableData]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    customElement === "withdrawal_requests" && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(CalculateWithdrawalAmount, { selectedRows: selectedRows ?? [] }) }),
+    /* @__PURE__ */ jsx("div", { className: "rdt-table-holder static", children: /* @__PURE__ */ jsx("div", { className: `table-scrollable-holder text-nowrap static`, children: /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        className: "text-nowrap",
+        columns: tableColumns,
+        data: tableData,
+        expandableRows: true,
+        expandableRowsComponent: ExpandedRow_default,
+        responsive: true,
+        progressPending: tableFetchingLoading,
+        progressComponent: /* @__PURE__ */ jsx(TableLoader, { count: Number(pageSize) }),
+        sortIcon: /* @__PURE__ */ jsx(HiChevronUpDown, { className: "me-1" }),
+        selectableRowsComponent: Checkbox2,
+        sortServer: true,
+        onSort: sortingTableHandler,
+        noDataComponent: /* @__PURE__ */ jsx("div", { className: "py-4 text-foreground bg-neutral-100 dark:bg-neutral-800 px-4 w-full text-start lg:text-center", children: tApiTables("no_results") }),
+        persistTableHead: true,
+        selectableRows: !tableFetchingLoading && (bulkActions.length > 0 || structureRowActions?.filter((action) => action?.applicableAsBulkAction)?.length > 0) ? true : false,
+        onSelectedRowsChange: ({ selectedRows: selectedRows2 }) => dispatch(_setSelectedRows(selectedRows2)),
+        clearSelectedRows: !toggledClearRows
+      }
+    ) }) })
+  ] });
+}
+var TableBody_default = TableBody2;
+
+// src/shims/custom-pagination.ts
+var custom_pagination_default = CustomPagination;
+function TablePagination() {
+  const { tablePagination, currentPage } = useSelector((state) => state.tableCore);
+  const dispatch = useDispatch();
+  const tApiTables = useTranslations("ApiTables");
+  function setCurrentPageHandler(link) {
+    dispatch(_setCurrentPage(Number(link)));
+  }
+  const currentPageNumber = tablePagination?.current_page ?? currentPage;
+  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 lg:grid-cols-2 mt-5 text-center lg:text-end", children: [
+    /* @__PURE__ */ jsx("div", { className: "col", children: tablePagination && tablePagination.total > 0 && /* @__PURE__ */ jsx(
+      custom_pagination_default,
+      {
+        currentPage: currentPageNumber,
+        totalPages: tablePagination.last_page,
+        onPageChange: (page) => {
+          setCurrentPageHandler(page);
+        }
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("div", { className: "text-muted-foreground text-center lg:text-end text-sm", children: [
+      /* @__PURE__ */ jsxs("span", { children: [
+        " ",
+        tApiTables("show_results"),
+        " "
+      ] }),
+      /* @__PURE__ */ jsx("strong", { className: "mx-1", children: tablePagination?.from ?? 0 }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        tApiTables("to_results"),
+        " "
+      ] }),
+      /* @__PURE__ */ jsx("strong", { className: "mx-1", children: tablePagination?.to ?? 0 }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        " ",
+        tApiTables("from_results")
+      ] }),
+      /* @__PURE__ */ jsx("strong", { className: "mx-1", children: tablePagination?.total ?? 0 }),
+      /* @__PURE__ */ jsxs("span", { children: [
+        " ",
+        tApiTables("results")
+      ] })
+    ] })
+  ] });
+}
+var TablePagination_default = TablePagination;
+function TableSorting() {
+  const { tableSorting } = useSelector((state) => state?.tableCore);
+  const dispatch = useDispatch();
+  function resetTableSorting() {
+    dispatch(_setTableSorting({}));
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: Object.keys(tableSorting)?.length > 0 && /* @__PURE__ */ jsx("div", { className: "my-3", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1 p-0 mb-1 pt-3", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-sm font-bold me-2", children: "Sorted By " }),
+    /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "ps-4 pe-0.5 rounded-full border !border-foreground/30 dark:border-foreground/10", children: [
+      tableSorting?.label,
+      ": ",
+      tableSorting?.direction,
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "default",
+          className: "p-0 ms-3 h-6 w-6 rounded-full hover:bg-destructive/10 dark:hover:bg-destructive/10 hover:text-destructive  bg-foreground dark:bg-foreground/10",
+          onClick: resetTableSorting,
+          children: /* @__PURE__ */ jsx(X, { className: "size-3" })
+        }
+      )
+    ] })
+  ] }) }) });
+}
+var TableSorting_default = TableSorting;
+var API_TABLES_PAGE_SIZE_KEY = "api_tables_page_size";
+function TablePageSize() {
+  const { pageSize } = useSelector((state) => state.tableCore);
+  const dispatch = useDispatch();
+  const { set: setStored } = useSecureLS();
+  function changePageSize(value) {
+    setStored(API_TABLES_PAGE_SIZE_KEY, String(value));
+    dispatch(_changePageSize(value));
+    dispatch(_setCurrentPage(1));
+  }
+  return /* @__PURE__ */ jsx("div", { className: "w-full sm:w-[90px]", children: /* @__PURE__ */ jsxs(Select, { onValueChange: (value) => changePageSize(Number(value)), value: `${pageSize}`, children: [
+    /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Page Size" }) }),
+    /* @__PURE__ */ jsx(SelectContent, { children: /* @__PURE__ */ jsxs(SelectGroup, { children: [
+      /* @__PURE__ */ jsx(SelectItem, { value: "10", children: "10" }),
+      /* @__PURE__ */ jsx(SelectItem, { value: "25", children: "25" }),
+      /* @__PURE__ */ jsx(SelectItem, { value: "50", children: "50" }),
+      /* @__PURE__ */ jsx(SelectItem, { value: "100", children: "100" })
+    ] }) })
+  ] }) });
+}
+var TablePageSize_default = TablePageSize;
+function ColumnsVisibility() {
+  const { tableName } = useSelector((state) => state.tableCore);
+  const { tableColumns, visibleColumns } = useSelector((state) => state.tableColumns);
+  const dispatch = useDispatch();
+  const tApiTables = useTranslations("ApiTables");
+  const { set } = useSecureLS();
+  function toggleColumnVisibility(value, data_src, tableName2) {
+    let columns = [...visibleColumns];
+    if (value === true) {
+      columns = [...visibleColumns, data_src];
+    } else {
+      columns = columns.filter((col) => col !== data_src);
+    }
+    dispatch(_setVisibleColumns(columns));
+    set(`${tableName2}_tb`, JSON.stringify(columns));
+  }
+  return /* @__PURE__ */ jsxs(Popover, { children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { className: "w-full sm:w-auto", variant: "outline", children: [
+      /* @__PURE__ */ jsx(RiEyeCloseFill, {}),
+      tApiTables("columns"),
+      /* @__PURE__ */ jsx(FiChevronDown, { className: "ms-auto" })
+    ] }) }),
+    /* @__PURE__ */ jsx(PopoverContent, { align: "start", className: "p-4 flex flex-col gap-1 max-h-[min(90vh,400px)] overflow-y-auto w-auto min-w-[--radix-popover-trigger-width]", children: tableColumns?.map((col, index) => {
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            className: "cursor-pointer",
+            checked: visibleColumns?.indexOf(col.data_src) !== -1,
+            onCheckedChange: (checked) => toggleColumnVisibility(checked, col.data_src, tableName),
+            id: col.data_src
+          }
+        ),
+        /* @__PURE__ */ jsx("label", { htmlFor: col.data_src, className: "text-sm cursor-pointer", children: col.name })
+      ] }, index);
+    }) })
+  ] });
+}
+var ColumnsVisibility_default = ColumnsVisibility;
+function ActionsOfSelections() {
+  const { selectedRows, selectedIds } = useSelector((state) => state.tableColumns);
+  const { appliedFilters } = useSelector((state) => state.tableCore);
+  const { bulkActions } = useSelector((state) => state.bulkActions);
+  const { selectedRowActions } = useSelector((state) => state.rowActions);
+  const { bulkActionsPostHandler } = useUtilsProvider();
+  useDispatch();
+  return /* @__PURE__ */ jsx(Fragment, { children: selectedRows?.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-center gap-2 mb-4", children: selectedRowActions?.map((action) => /* @__PURE__ */ jsx("div", { className: "flex flex-grow-1 md:flex-grow-0 items-center", children: action.action_type === "toggle" ? /* @__PURE__ */ jsx(ToggleRowActionElement, { action, isBulk: true }) : action.action_type === "redirect" ? /* @__PURE__ */ jsx(RedirectRowActionElement, { action, isBulk: true }) : action.action_type === "external_redirect" ? /* @__PURE__ */ jsx(ExternalRedirectRowActionElement, { action, isBulk: true }) : /* @__PURE__ */ jsx(GeneralRowActionElement, { action, isBulk: true }) }, action.action_key)) }) });
+}
+var ActionsOfSelection_default = ActionsOfSelections;
+
+// src/shims/popup.ts
+var popup_default = Popup;
+function DatalistModal({ closeModal }) {
+  const { rowSelectedModal } = useSelector((state) => state.tableColumns);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "text-center mb-4", children: /* @__PURE__ */ jsx("h5", { className: "font-bold", children: rowSelectedModal?.label }) }),
+    /* @__PURE__ */ jsx("ol", { className: "mb-4 overflow-hidden", children: Array.isArray(rowSelectedModal?.value?.value) && rowSelectedModal?.value?.value?.map((item, index) => /* @__PURE__ */ jsx("li", { className: "p-3 text-wrap whitespace-normal bg-neutral-100 dark:bg-neutral-800 text-sm rounded-md mb-2", children: item }, index)) }),
+    /* @__PURE__ */ jsx(Button, { variant: "outline", className: "w-full", onClick: closeModal, children: "Dismiss" })
+  ] });
+}
+function DatalistObjModal({ closeModal }) {
+  const { rowSelectedModal } = useSelector((state) => state.tableColumns);
+  const obj = rowSelectedModal?.value?.value;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "text-center mb-6", children: /* @__PURE__ */ jsx("h5", { children: rowSelectedModal?.label }) }),
+    /* @__PURE__ */ jsx("ol", { className: "mb-4", children: obj && Object.keys(obj)?.map((key, index) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-2 mb-2", children: [
+      /* @__PURE__ */ jsx("strong", { className: "py-2 px-3 bg-neutral-100 dark:bg-neutral-800 w-full rounded-md", children: key }),
+      /* @__PURE__ */ jsx("span", { className: "py-2 px-3 bg-neutral-100 dark:bg-neutral-800 w-full rounded-md", children: obj[key]?.join(" - ") })
+    ] }, index)) }),
+    /* @__PURE__ */ jsx(Button, { variant: "outline", className: "w-full", onClick: closeModal, children: "Dismiss" })
+  ] });
+}
+function HTMLParsedModal() {
+  const { rowSelectedModal } = useSelector((state) => state.tableColumns);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "text-center mb-4", children: /* @__PURE__ */ jsx("h5", { children: rowSelectedModal?.label }) }),
+    rowSelectedModal?.value?.value && typeof rowSelectedModal?.value?.value === "string" && parse(rowSelectedModal?.value?.value)
+  ] });
+}
+function ViewRowData({ data }) {
+  const modalData = useMemo(() => {
+    return data?.data;
+  }, [data]);
+  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 xl:grid-cols-12 items-stretch gap-1 pt-7", children: [
+    modalData && modalData?.barcode && /* @__PURE__ */ jsxs("div", { className: "xl:col-span-12  flex flex-col items-center justify-center p-4", children: [
+      /* @__PURE__ */ jsx("h6", { className: "mb-2 font-[400] text-md", children: modalData.barcode?.label || "Barcode" }),
+      modalData.barcode && /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: `data:image/png;base64,${modalData.barcode}`,
+          alt: "Barcode",
+          className: "max-w-full h-auto mb-2 border rounded bg-white",
+          style: { maxHeight: "50vh" }
+        }
+      ),
+      modalData.barcode && /* @__PURE__ */ jsxs(Button, { variant: "outline", onClick: () => copyToClipboard(String(modalData.barcodeValue)), className: "mt-2", children: [
+        /* @__PURE__ */ jsx(IoCopy, { size: 17 }),
+        "Copy Barcode"
+      ] })
+    ] }),
+    modalData && Array.isArray(modalData) && /* @__PURE__ */ jsx("div", { className: "xl:col-span-12", children: /* @__PURE__ */ jsxs(Table, { className: "border", children: [
+      /* @__PURE__ */ jsx(TableHeader, { className: "bg-muted", children: /* @__PURE__ */ jsx(TableRow, { children: Object.keys(modalData?.at(0) ?? {}).map((key, idx) => /* @__PURE__ */ jsx(TableHead, { className: "px-3", children: modalData?.at(0)?.[key]?.label }, idx)) }) }),
+      /* @__PURE__ */ jsx(TableBody, { children: modalData?.map((item, index) => /* @__PURE__ */ jsx(TableRow, { className: Object.keys(item)?.length > 2 ? index % 2 === 0 ? "" : "bg-muted/50" : "", children: Object.keys(item)?.map((key, idx) => /* @__PURE__ */ jsx(TableCell, { className: "font-medium px-3", children: /* @__PURE__ */ jsx("p", { children: item[key]?.value }) })) }, index)) })
+    ] }) }),
+    modalData && !modalData?.barcode && !Array.isArray(modalData) && Object.keys(modalData)?.map((key, index) => /* @__PURE__ */ jsx("div", { className: "2xl:col-span-4 xl:col-span-6", children: /* @__PURE__ */ jsxs("div", { className: "bg-neutral-100 dark:bg-neutral-800  h-full p-3 rounded-md", children: [
+      /* @__PURE__ */ jsx("h6", { className: "mb-0 font-[400] text-[13px]", children: modalData[key]?.label }),
+      modalData[key]?.type === "copy_value" ? modalData[key]?.value && modalData[key]?.value !== "#!" && modalData[key]?.value !== "!#" ? /* @__PURE__ */ jsxs(Button, { variant: "outline", onClick: () => copyToClipboard(String(modalData[key]?.value)), children: [
+        /* @__PURE__ */ jsx(IoCopy, { size: 17 }),
+        "Copy Link"
+      ] }) : /* @__PURE__ */ jsx("p", { className: "mb-0 text-muted-foreground text-wrap", children: "No share Link" }) : Array.isArray(modalData[key]?.value) ? /* @__PURE__ */ jsx("ul", { className: "mb-0 mt-3 pe-4 text-[13px]", children: modalData[key]?.value?.map((item, index2) => /* @__PURE__ */ jsx("li", { children: item }, index2)) }) : (typeof modalData[key]?.value === "string" || typeof modalData[key]?.value === "number") && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-wrap mb-0 text-[14px] mt-2", children: modalData[key]?.value || "----" })
+    ] }) }, index))
+  ] });
+}
+function ConfirmationModal({ closeModal, confirmationFor }) {
+  const t = useTranslations("ApiTables");
+  const { clickedRowAction, rowActionPostLoading } = useSelector((state) => state.rowActions);
+  const { appliedFilters } = useSelector((state) => state.tableCore);
+  const { bulkActionsPostHandler, selectedBulkAction, bulkActionPostLoading } = useSelector((state) => state.bulkActions);
+  const { selectedIds } = useSelector((state) => state.tableColumns);
+  const { rowActionsPostHandler } = useUtilsProvider();
+  function fireRowAction() {
+    if (confirmationFor === "rowAction")
+      rowActionsPostHandler(
+        clickedRowAction?.method,
+        clickedRowAction?.isBulk ? clickedRowAction?.bulk_actions_url?.api ?? "" : clickedRowAction?.action?.api?.replace(/^\/api/, "") ?? "",
+        { selected_ids: selectedIds },
+        clickedRowAction
+      );
+    if (confirmationFor === "bulkAction") {
+      bulkActionsPostHandler(
+        selectedBulkAction?.method,
+        selectedBulkAction?.action.api,
+        { filters: appliedFilters, selected_ids: selectedIds },
+        null,
+        selectedBulkAction
+      );
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+    /* @__PURE__ */ jsx("h4", { className: "mb-1 font-bold text-2xl", children: t("confirmActionTitle") }),
+    /* @__PURE__ */ jsx("p", { className: "h6 mb-4 text-sm pb-6", children: t("confirmActionMessage") }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 ms-auto max-w-[200px] gap-2", children: [
+      /* @__PURE__ */ jsx("div", { className: "col", children: /* @__PURE__ */ jsx(
+        loading_button_default,
+        {
+          variant: "default",
+          className: "w-full h-9!",
+          onClick: fireRowAction,
+          disabled: rowActionPostLoading || bulkActionPostLoading,
+          isLoading: rowActionPostLoading || bulkActionPostLoading,
+          children: t("confirm")
+        }
+      ) }),
+      /* @__PURE__ */ jsx("div", { className: "col", children: /* @__PURE__ */ jsx(Button, { variant: "outline", className: "w-full", onClick: closeModal, children: t("dismiss") }) })
+    ] })
+  ] });
+}
+function matchUrl(customControlAction, match) {
+  const api = customControlAction?.url?.api ?? "";
+  const web = customControlAction?.url?.web ?? "";
+  const haystack = `${api} ${web}`;
+  return typeof match === "string" ? haystack.includes(match) : match.test(haystack);
+}
+function ApiTablesModals() {
+  const { selectedBulkAction } = useSelector((state) => state?.bulkActions ?? {});
+  const { rowSelectedModal } = useSelector((state) => state?.tableColumns ?? {});
+  const { clickedRowAction, clickedRowActionResponse, customControlAction } = useSelector(
+    (state) => state?.rowActions ?? {}
+  );
+  const { customControls = [], bulkActionModals = [], rowActionModals = [] } = useApiTablesConfig();
+  const dispatch = useDispatch();
+  function handleCloseModal() {
+    dispatch(_getClickedRowActionResponse(null));
+    dispatch(_getSelectedBulkAction(null));
+    dispatch(_getClickedRowAction(null));
+    dispatch(_getCustomControlRequest(null));
+  }
+  function handleCloseStaticModals() {
+    dispatch(_setRowSelectedModal(null));
+  }
+  const bulkActionKey = selectedBulkAction?.action_key;
+  const bulkModal = bulkActionModals.find((entry) => entry.actionKey === bulkActionKey);
+  const isCustomBulkModal = !!bulkModal;
+  const showConfirmation = !!clickedRowAction?.need_confirmation || !!selectedBulkAction?.need_confirmation && !isCustomBulkModal;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      popup_default,
+      {
+        status: clickedRowActionResponse,
+        closeModal: handleCloseModal,
+        isVisible: !!clickedRowActionResponse,
+        children: [
+          clickedRowAction?.onSuccess === "DisplayOnModal" && /* @__PURE__ */ jsx(ViewRowData, { data: clickedRowActionResponse }),
+          rowActionModals.map(({ match, component: RowModal }) => {
+            const response = clickedRowActionResponse;
+            const api = String(
+              clickedRowAction?.action?.api ?? response?.url?.api ?? ""
+            );
+            const matched = typeof match === "string" ? api.includes(match) : match.test(api);
+            return matched && response ? /* @__PURE__ */ jsx(RowModal, { data: response }, String(match)) : null;
+          })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      popup_default,
+      {
+        status: showConfirmation,
+        closeModal: handleCloseModal,
+        containerClass: "max-w-xl",
+        isVisible: showConfirmation,
+        children: /* @__PURE__ */ jsx(
+          ConfirmationModal,
+          {
+            closeModal: handleCloseModal,
+            confirmationFor: clickedRowAction ? "rowAction" : selectedBulkAction ? "bulkAction" : "rowAction"
+          }
+        )
+      }
+    ),
+    bulkModal && /* @__PURE__ */ jsx(
+      popup_default,
+      {
+        status: bulkActionKey,
+        closeModal: handleCloseModal,
+        isVisible: !!selectedBulkAction,
+        children: /* @__PURE__ */ jsx(bulkModal.component, { closeModal: handleCloseModal, action: selectedBulkAction })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      popup_default,
+      {
+        status: rowSelectedModal,
+        containerClass: "max-w-lg",
+        closeModal: handleCloseStaticModals,
+        isVisible: !!rowSelectedModal,
+        children: Array.isArray(rowSelectedModal?.value?.value) ? /* @__PURE__ */ jsx(DatalistModal, { closeModal: handleCloseStaticModals }) : rowSelectedModal?.value?.value && Array.isArray(Object.keys(rowSelectedModal.value.value)) ? /* @__PURE__ */ jsx(DatalistObjModal, { closeModal: handleCloseStaticModals }) : /* @__PURE__ */ jsx(HTMLParsedModal, {})
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      popup_default,
+      {
+        status: customControlAction,
+        closeModal: handleCloseModal,
+        containerClass: "lg:min-w-4xl",
+        isVisible: !!customControlAction,
+        children: customControls.map(
+          ({ match, component: Control }) => matchUrl(customControlAction, match) ? /* @__PURE__ */ jsx(
+            Control,
+            {
+              action: customControlAction,
+              closeModal: handleCloseModal
+            },
+            String(match)
+          ) : null
+        )
+      }
+    )
+  ] });
+}
+var ApiTablesModals_default = ApiTablesModals;
+function TableBulkActions() {
+  const { selectedIds } = useSelector((state) => state.tableColumns);
+  const { bulkActions, bulkActionPostResponse } = useSelector((state) => state.bulkActions);
+  const { tableData, tableFetchingLoading, appliedFilters, triggerTableReload } = useSelector((state) => state.tableCore);
+  const { bulkActionsPostHandler } = useUtilsProvider();
+  const dispatch = useDispatch();
+  const tApiTables = useTranslations("ApiTables");
+  const disableBulkActions = useMemo(() => {
+    return !tableData || tableData?.length === 0 || tableFetchingLoading;
+  }, [tableData, tableFetchingLoading]);
+  const requireModal2 = (action) => action?.action_key === "store_with_drawal_bulk" || action?.action_key === "create_withdrawal_bulk";
+  useEffect(() => {
+    if (bulkActionPostResponse?.success && bulkActionPostResponse?.type === "stream") {
+      downloadURL(bulkActionPostResponse?.data?.url, bulkActionPostResponse?.file_name);
+    }
+    if (bulkActionPostResponse?.success && bulkActionPostResponse?.onSuccess === "refetchData") {
+      triggerTableReload();
+    }
+    if (bulkActionPostResponse?.success && bulkActionPostResponse?.onSuccess === "reload") {
+      triggerTableReload();
+    }
+    dispatch(_bulkActionPostResponse(null));
+  }, [bulkActionPostResponse]);
+  function fireBulkAction(action) {
+    if (requireModal2(action)) {
+      dispatch(_getSelectedBulkAction(action));
+    } else {
+      bulkActionsPostHandler(
+        action?.method,
+        action?.action.api?.replace("/api", ""),
+        { filters: appliedFilters, selected_ids: selectedIds, ...action?.payload_keys && { ...action?.payload_keys } },
+        {
+          msg: action?.action_key === "export-excel-blob" ? tApiTables("exporting_excel") : tApiTables("processing_data"),
+          icon: "excel"
+        },
+        action
+      );
+    }
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { className: "w-full sm:w-auto", variant: "outline", children: [
+      /* @__PURE__ */ jsx(PiGearFill, {}),
+      tApiTables("bulk_actions"),
+      /* @__PURE__ */ jsx(FiChevronDown, { className: "ms-auto" })
+    ] }) }),
+    /* @__PURE__ */ jsx(DropdownMenuContent, { className: "min-w-[var(--radix-dropdown-menu-trigger-width)]", children: bulkActions?.map((action, index) => {
+      return /* @__PURE__ */ jsx(DropdownMenuItem, { disabled: disableBulkActions, asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "ghost", className: "w-full text-[14px] cursor-pointer", onClick: () => fireBulkAction(action), children: action?.label }) }, index);
+    }) })
+  ] }) });
+}
+var TableBulkActions_default = TableBulkActions;
+function FilterTrigger({ showFilters, setShowFilters }) {
+  const tApiTables = useTranslations("ApiTables");
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Button, { variant: "outline", onClick: () => setShowFilters(!showFilters), children: [
+    /* @__PURE__ */ jsx(MdFilterListAlt, {}),
+    tApiTables("show_filters")
+  ] }) });
+}
+function ApiTablesComponent({ customElement }) {
+  const { bulkActions } = useSelector((state) => state?.bulkActions);
+  const { structureFilters } = useSelector((state) => state?.tableCore);
+  const { selectedRows } = useSelector((state) => state?.tableColumns);
+  const [showFilters, setShowFilters] = useState(false);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    structureFilters && structureFilters?.length > 0 && /* @__PURE__ */ jsx(TableFilters_default, { showFilters, setShowFilters }),
+    /* @__PURE__ */ jsx(TableSorting_default, {}),
+    /* @__PURE__ */ jsx("div", { className: "flex mb-4 items-end justify-center lg:justify-between pt-5", children: /* @__PURE__ */ jsxs("ul", { className: "flex w-full flex-col sm:flex-row sm:justify-between items-center gap-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "w-full grid grid-cols-1 sm:grid-cols-3 gap-2 sm:w-auto", children: [
+        bulkActions?.length > 0 && /* @__PURE__ */ jsx(TableBulkActions_default, {}),
+        /* @__PURE__ */ jsx(ColumnsVisibility_default, {}),
+        structureFilters?.length > 0 && /* @__PURE__ */ jsx(FilterTrigger, { showFilters, setShowFilters })
+      ] }),
+      /* @__PURE__ */ jsx("li", { className: "w-full sm:w-fit", children: /* @__PURE__ */ jsx(TablePageSize_default, {}) })
+    ] }) }),
+    React4.isValidElement(customElement) && /* @__PURE__ */ jsxs("div", { className: "py-2", children: [
+      " ",
+      customElement,
+      " "
+    ] }),
+    selectedRows.length > 0 && /* @__PURE__ */ jsx("div", { className: "text-center text-sm text-muted mb-1", children: /* @__PURE__ */ jsx("strong", { className: "fw-bold mx-1", children: selectedRows?.length }) }),
+    /* @__PURE__ */ jsx(ActionsOfSelection_default, {}),
+    /* @__PURE__ */ jsx(TableBody_default, {}),
+    /* @__PURE__ */ jsx(TablePagination_default, {}),
+    /* @__PURE__ */ jsx(ApiTablesModals_default, {})
+  ] });
+}
+var ApiTablesComponent_default = ApiTablesComponent;
+var useTableFetcher = () => {
+  const dispatch = useDispatch();
+  const { axiosTable } = useApiTablesConfig();
+  const { tableColumns, toggledClearRows } = useSelector((state) => state.tableColumns);
+  async function tableFetchingHandler({
+    tableName,
+    signal,
+    pageSize,
+    currentPage,
+    appliedFilters,
+    tableSorting,
+    params,
+    tbData
+  }) {
+    dispatch(_setSelectedRows([]));
+    dispatch(_setTableLoading(true));
+    dispatch(_getTableData([]));
+    dispatch(_setToggledClearRow(!toggledClearRows));
+    try {
+      const response = await axiosTable({
+        method: "POST",
+        url: `/api-table/control-tables/query-table/${tableName}`,
+        data: {
+          perPage: pageSize,
+          page: currentPage,
+          filters: appliedFilters,
+          sorts: tableSorting,
+          ...params ? { params } : {}
+        },
+        signal
+      });
+      if (tableColumns) {
+        dispatch(
+          _setTableColumns({
+            update: true,
+            cols: tableColumns?.map((col) => ({
+              ...col,
+              style: {
+                width: calculateMinWidth(
+                  rowWithLongestField(response?.data?.items, col?.data_src),
+                  col?.name,
+                  col?.type
+                )
+              }
+            })),
+            tbData
+          })
+        );
+      }
+      dispatch(_getTableData(response?.data?.items));
+      dispatch(_getTablePagination(response?.data?.pagination));
+      dispatch(_getTableBindings(response?.data?.bindings));
+      dispatch(_setTableLoading(false));
+    } catch (err) {
+      handleNetworkErrors(err);
+      if (axios.isCancel(err)) {
+        dispatch(_setTableLoading(true));
+      } else {
+        dispatch(_setTableLoading(false));
+      }
+    }
+  }
+  return { tableFetchingHandler };
+};
+var useTableFetcher_default = useTableFetcher;
+var createTableStore = () => {
+  return configureStore({
+    reducer: {
+      tableCore: tableCoreSlice_default,
+      bulkActions: bulkActionsSlice_default,
+      rowActions: rowActionsSlice_default,
+      tableColumns: tableColumnsSlice_default
+    },
+    devTools: true,
+    middleware: (getDefaultMiddleware) => getDefaultMiddleware({
+      serializableCheck: false
+    })
+  });
+};
+var externalStoreGetter = null;
+function setExternalStoreGetter(getter) {
+  externalStoreGetter = getter;
+}
+var getExternalState = () => {
+  if (!externalStoreGetter) {
+    return {};
+  }
+  return externalStoreGetter().getState();
+};
+var API_TABLES_PAGE_SIZE_KEY2 = "api_tables_page_size";
+var DEFAULT_PAGE_SIZE = 25;
+var VALID_PAGE_SIZES = [10, 25, 50, 100];
+function flattenMultiCellsActions(rowActions) {
+  if (rowActions && Object.keys(rowActions)?.filter((key) => key === "general_actions")?.length > 0) {
+    return Object.values(rowActions)?.map((object) => Object.values(object))?.reduce((acc, val) => acc?.concat(val), []);
+  }
+  return rowActions;
+}
+function checkActionsInRegularCells(rowActions) {
+  return rowActions && Object.keys(rowActions)?.filter((key) => key === "general_actions")?.length > 0;
+}
+function ApiTablesController({
+  table,
+  params,
+  customElement
+}) {
+  const dispatch = useDispatch();
+  const { get: getStored } = getHostStorage();
+  getExternalState();
+  const { usePathname } = useApiTablesConfig();
+  const pathname = usePathname?.() ?? "";
+  const { appliedFilters, currentPage, tableSorting, pageSize, tableName, tableData, tableRefresher } = useSelector((state) => state?.tableCore);
+  const { tableFetchingHandler } = useTableFetcher_default();
+  useEffect(() => {
+    dispatch(
+      _getTableComponents({
+        ...table,
+        ...typeof customElement === "string" && { customElement }
+      })
+    );
+    dispatch(_getStructureBulkActions(table?.bulkActions));
+    dispatch(_getStructureRowActions(flattenMultiCellsActions(table?.rowActions)));
+    if (checkActionsInRegularCells(table?.rowActions)) {
+      dispatch(_checkActionsInRegularCells(true));
+    }
+    return () => {
+      dispatch(_resetTableBulkActions());
+      dispatch(_resetTableColumns());
+      dispatch(_resetTableCore());
+      dispatch(_resetTableRowActions());
+    };
+  }, [table, customElement, dispatch]);
+  useEffect(() => {
+    const stored = getStored(API_TABLES_PAGE_SIZE_KEY2);
+    const parsed = stored != null ? Number(stored) : NaN;
+    const size = VALID_PAGE_SIZES.includes(parsed) ? parsed : DEFAULT_PAGE_SIZE;
+    dispatch(_changePageSize(size));
+  }, [dispatch, getStored]);
+  useEffect(() => {
+    const controller = new AbortController();
+    if (tableName) {
+      tableFetchingHandler({
+        tableName,
+        currentPage,
+        pageSize,
+        appliedFilters,
+        tableSorting,
+        signal: controller.signal,
+        params,
+        tbData: tableData
+      });
+    }
+    return () => controller.abort();
+  }, [tableName, currentPage, pageSize, appliedFilters, tableSorting, tableRefresher, pathname, params, tableData, tableFetchingHandler]);
+  return /* @__PURE__ */ jsx(ApiTablesComponent_default, { customElement });
+}
+var ApiTablesController_default = ApiTablesController;
+function ApiTablesProvider({ children }) {
+  const { useOutScopeRefresher } = useApiTablesConfig();
+  const refresher = useOutScopeRefresher?.() ?? 0;
+  const tableStore = useMemo(() => createTableStore(), []);
+  return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Provider, { store: tableStore, children }) }, String(refresher));
+}
+function ReactApiTable({
+  table,
+  controller,
+  children,
+  params,
+  tableStructureLoading,
+  customElement
+}) {
+  const { components } = useApiTablesConfig();
+  const Card2 = components.Card;
+  const FullPageTableLoader2 = components.FullPageTableLoader;
+  if (!Card2 || !FullPageTableLoader2) {
+    throw new Error(
+      "ApiTablesConfig.components.Card and FullPageTableLoader are required"
+    );
+  }
+  return /* @__PURE__ */ jsxs(ApiTablesProvider, { children: [
+    children,
+    tableStructureLoading ? /* @__PURE__ */ jsx(Card2, { className: "p-5 dark:bg-none", children: /* @__PURE__ */ jsx(FullPageTableLoader2, { count: 20 }) }) : controller || /* @__PURE__ */ jsx(
+      ApiTablesController_default,
+      {
+        table,
+        params,
+        customElement: customElement ?? null
+      }
+    )
+  ] });
+}
+var ReactApiTable_default = ReactApiTable;
+function useTableStructure() {
+  const [tableStructure, setTableStructure] = useState(null);
+  const [tableStructureLoading, setTableStructureLoading] = useState(true);
+  const { axiosTable, useLocale: useLocale2 } = useApiTablesConfig();
+  const locale = useLocale2?.();
+  const dispatch = useDispatch();
+  const getTableStructure = useCallback(
+    async ({ table }) => {
+      setTableStructureLoading(true);
+      dispatch(_getTableData([]));
+      try {
+        const response = await axiosTable.get(table, {
+          headers: {
+            ...locale && { ln: locale }
+          }
+        });
+        setTableStructure(response?.data);
+      } catch (err) {
+        console.log(err);
+      } finally {
+        setTableStructureLoading(false);
+      }
+    },
+    [axiosTable, dispatch, locale]
+  );
+  return { getTableStructure, tableStructure, tableStructureLoading };
+}
+
+export { ApiTablesComponent_default as ApiTablesComponent, ApiTablesController_default as ApiTablesController, ApiTablesHostProvider, ApiTablesProvider, ReactApiTable_default as ReactApiTable, _bulkActionPostLoading, _bulkActionPostResponse, _changePageSize, _checkActionsInRegularCells, _getClickedRowAction, _getClickedRowActionId, _getClickedRowActionResponse, _getCustomControlRequest, _getSelectedBulkAction, _getSelectedRowActions, _getStructureBulkActions, _getStructureRowActions, _getTableBindings, _getTableComponents, _getTableData, _getTablePagination, _resetTableBulkActions, _resetTableColumns, _resetTableCore, _resetTableRowActions, _setAppliedFilters, _setCurrentPage, _setRenderedFilters, _setRowActionPostLoading, _setRowSelectedModal, _setSelectedRows, _setTableColumns, _setTableLoading, _setTableSorting, _setToggledClearRow, _setVisibleColumns, _triggerTableReload, createTableStore, getExternalState, setExternalStoreGetter, useApiTablesComponent, useApiTablesConfig, useTableFetcher_default as useTableFetcher, useTableStructure, useUtilsProvider };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map