{"version":3,"sources":["../src/components/ReactGridX/index.tsx","../src/components/SVGIcons/index.tsx","../src/components/Paginations/RGXArrowPagination/index.tsx","../src/components/Paginations/RGXTablePagination/index.tsx","../src/components/Tooltip/index.tsx","../src/components/Loader/index.tsx","../src/components/Popover/index.tsx","../src/utils/merge-classes.ts"],"sourcesContent":["import React, { JSX, useEffect, useMemo, useState } from \"react\";\r\nimport RGXArrowPagination from \"../Paginations/RGXArrowPagination\";\r\nimport RGXTablePagination from \"../Paginations/RGXTablePagination\";\r\nimport RGXTooltip from \"../Tooltip\";\r\nimport RGXLoader from \"../Loader\";\r\nimport { ReactGridXProps } from \"../../types/react-grid-x-props\";\r\nimport RGXPopover from \"../Popover\";\r\nimport SvgIcon from \"../SVGIcons\";\r\nimport { mergeClasses } from \"../../utils/merge-classes\";\r\n\r\nconst ReactGridX: React.FC<ReactGridXProps> = ({\r\n  columns,\r\n  data,\r\n  theme = \"rgx-theme\",\r\n  rowsPerPageOptions = [5, 10, 15],\r\n  paginationType = \"rgx-table-pagination\",\r\n  paginationStyle = {},\r\n  tableStyle = {},\r\n  loaderStyle = {},\r\n  popupStyle = {},\r\n  tooltipStyle = {},\r\n  serverSidePagination = false,\r\n  onPaginationAndRowSizeChange,\r\n  totalRows,\r\n  serverSideSorting = false,\r\n  onSorting,\r\n  onRowClick,\r\n  expandedComponent,\r\n  loading = false,\r\n  loaderComponent = ({ style }) => <RGXLoader style={style} />,\r\n  multiColumnSort = false,\r\n  selectionCheckbox = false,\r\n  onSelectionCheck,\r\n  rowPerPage = 10,\r\n  page = 1,\r\n  mode = \"light\",\r\n}) => {\r\n  const darkMode = mode === \"dark\";\r\n\r\n  // State to manage the current page of the table. Tracks the active page number for pagination purposes.\r\n  const [currentPage, setCurrentPage] = useState<number>(page);\r\n\r\n  // State to store the current dataset to display in the table. This can be updated when data is filtered, sorted, or paginated.\r\n  const [currentData, setCurrentData] = useState<any[]>(data);\r\n\r\n  // State to manage the sorting configuration for multiple columns. Allows multi-column sorting with a key and direction.\r\n  const [sortConfig, setSortConfig] = useState<\r\n    { key: string; direction: \"asc\" | \"desc\" }[]\r\n  >([]);\r\n\r\n  // State to manage the number of rows per page for pagination. Default value is taken from rowsPerPageOptions.\r\n  const [rowsPerPage, setRowsPerPage] = useState<number>(rowsPerPageOptions[0]);\r\n\r\n  // State to track which row is currently expanded. Holds the index of the expanded row, or null if no row is expanded.\r\n  const [expandedRow, setExpandedRow] = useState<number | null>(null);\r\n\r\n  // State to manage the popover state for each column. Tracks which column's dot menu is active.\r\n  const [isDotPopover, setIsDotPopover] = useState<string | null>(null);\r\n\r\n  // State to manage selection info: `selectedRows` for selected row IDs and `selectAllChecked` for the \"select all\" checkbox state\r\n  const [_selectionInfo, _setSelectionInfo] = useState<{\r\n    selectedRows: any[];\r\n    selectAllChecked: boolean;\r\n  }>({\r\n    selectedRows: [],\r\n    selectAllChecked: false,\r\n  });\r\n\r\n  /**\r\n   * Handle page change event for pagination.\r\n   * This function updates the current page and triggers the callback to inform the parent component\r\n   * of the new page number and the number of rows per page.\r\n   *\r\n   * @param page - The new page number to navigate to.\r\n   */\r\n  const onPageChange = (page: number) => {\r\n    setCurrentPage(page); // Update the current page state with the new page number\r\n    setExpandedRow(null);\r\n    onPaginationAndRowSizeChange &&\r\n      onPaginationAndRowSizeChange(page, rowsPerPage); // Trigger the callback with the updated page and rows per page, if provided\r\n  };\r\n\r\n  /**\r\n   * Handle rows per page change event for pagination.\r\n   * This function updates the number of rows per page, resets the current page to 1,\r\n   * and triggers the callback to inform the parent component about the new rows per page and the reset page number.\r\n   *\r\n   * @param rows - The new number of rows per page to display.\r\n   */\r\n  const onRowsPerPageChange = (rows: number) => {\r\n    setRowsPerPage(rows); // Update the rows per page state with the new number of rows\r\n    setCurrentPage(1); // Reset to the first page as the rows per page changed\r\n    onPaginationAndRowSizeChange && onPaginationAndRowSizeChange(1, rows); // Trigger the callback with page 1 and the updated rows per page\r\n  };\r\n\r\n  /**\r\n   * Handles the \"select all\" checkbox functionality in the table header.\r\n   *\r\n   * This function toggles the state of the \"select all\" checkbox and updates\r\n   * the `selectedRows` state to select or deselect all rows. It calls the\r\n   * `onSelectionCheck` callback with the updated selection data.\r\n   *\r\n   * @note Triggered when the user interacts with the \"select all\" checkbox in the header.\r\n   */\r\n  const onHeaderCheckboxChange = () => {\r\n    const _newSelectAllChecked = !_selectionInfo.selectAllChecked;\r\n    const _newSelectedRows = _newSelectAllChecked\r\n      ? data.map((row) => row.id)\r\n      : [];\r\n\r\n    _setSelectionInfo({\r\n      selectedRows: _newSelectedRows,\r\n      selectAllChecked: _newSelectAllChecked,\r\n    });\r\n\r\n    onSelectionCheck &&\r\n      onSelectionCheck(_newSelectedRows, _newSelectAllChecked);\r\n  };\r\n\r\n  /**\r\n   * Handles the row-level checkbox functionality.\r\n   *\r\n   * This function updates the selection state of an individual row when its\r\n   * checkbox is toggled. It updates the `selectedRows` state accordingly and\r\n   * also checks if the \"select all\" checkbox needs to be updated based on the\r\n   * current selection. The `onSelectionCheck` callback is called with the updated selection data.\r\n   *\r\n   * @param rowId - The unique ID of the row that was selected or deselected.\r\n   * @note Triggered when the user interacts with an individual row checkbox.\r\n   */\r\n  const onRowCheckboxChange = (rowId: string | number) => {\r\n    const _newSelectedRows = _selectionInfo.selectedRows.includes(rowId)\r\n      ? _selectionInfo.selectedRows.filter((id) => id !== rowId)\r\n      : [..._selectionInfo.selectedRows, rowId];\r\n\r\n    const _newSelectAllChecked = _newSelectedRows.length === data.length;\r\n\r\n    _setSelectionInfo({\r\n      selectedRows: _newSelectedRows,\r\n      selectAllChecked: _newSelectAllChecked,\r\n    });\r\n\r\n    onSelectionCheck &&\r\n      onSelectionCheck(_newSelectedRows, _newSelectAllChecked);\r\n  };\r\n\r\n  /**\r\n   * Handles the event when the user changes the sorting configuration\r\n   * for multiple columns (ascending or descending).\r\n   *\r\n   * This function manages the sorting state, toggles the sorting direction\r\n   * when the same column is clicked, or adds a new column to the sort order\r\n   * if it's not already included. It also handles multi-column sorting based\r\n   * on the `multiColumnSort` flag.\r\n   *\r\n   * @param column - The column for which the sorting needs to be changed.\r\n   */\r\n  const onSortingMultipleSupportHandler = (\r\n    column: { key: string },\r\n    customDirection?: \"asc\" | \"desc\" // Optional custom direction\r\n  ) => {\r\n    setSortConfig((prev) => {\r\n      if (!multiColumnSort) {\r\n        // If multiSort is false, reset sorting to only one column (single-column sorting)\r\n        return [\r\n          {\r\n            key: column.key,\r\n            direction:\r\n              customDirection ||\r\n              (prev[0]?.key === column.key && prev[0].direction === \"asc\"\r\n                ? \"desc\"\r\n                : (\"asc\" as \"asc\" | \"desc\")), // Toggle direction or use custom direction\r\n          },\r\n        ];\r\n      }\r\n\r\n      // Check if the column is already in the sorting configuration\r\n      const existingSort = prev.find((s) => s.key === column.key);\r\n      let newSortConfig;\r\n\r\n      if (existingSort) {\r\n        // If the column is already in the sort config, toggle the sorting direction or use custom direction\r\n        newSortConfig = prev.map((s) =>\r\n          s.key === column.key\r\n            ? {\r\n                key: s.key,\r\n                direction:\r\n                  customDirection ||\r\n                  (s.direction === \"asc\" ? \"desc\" : (\"asc\" as \"asc\" | \"desc\")),\r\n              }\r\n            : s\r\n        );\r\n      } else {\r\n        // If the column is not in the sort config, add it with the custom direction or default to 'asc'\r\n        newSortConfig = [\r\n          ...prev,\r\n          { key: column.key, direction: customDirection || \"asc\" },\r\n        ];\r\n      }\r\n\r\n      // Remove any sorting entries where direction is undefined (safety check)\r\n      newSortConfig = newSortConfig.filter((s) => s.direction !== undefined);\r\n\r\n      if (serverSideSorting && onSorting) {\r\n        // For server-side sorting, call the provided `onSorting` function to handle the sorting request externally\r\n        onSorting(newSortConfig);\r\n      } else {\r\n        // For client-side sorting, update the state with the new sorting configuration\r\n        setSortConfig(newSortConfig);\r\n      }\r\n\r\n      return newSortConfig;\r\n    });\r\n  };\r\n\r\n  /**\r\n   * Clears the sorting configuration and resets the table's sorting state.\r\n   *\r\n   * This function resets the `sortConfig` state to an empty array, effectively clearing any applied sorting.\r\n   * If server-side sorting is enabled, it also triggers a server-side reset by calling the `onSorting` callback\r\n   * with an empty array to reset sorting on the server.\r\n   *\r\n   * @returns {void} - No return value, the sorting is cleared.\r\n   */\r\n  const onClearSort = () => {\r\n    // Clear the sorting configuration by resetting the sortConfig state to an empty array\r\n    setSortConfig([]);\r\n\r\n    // If server-side sorting is used, trigger the server-side clear sort (optional)\r\n    if (serverSideSorting && onSorting) {\r\n      onSorting([]); // Send an empty array to reset sorting on the server\r\n    }\r\n  };\r\n\r\n  /**\r\n   * Sorts the data based on the current sorting configuration.\r\n   *\r\n   * This function applies multi-column sorting by iterating over the sorting configuration (`sortConfig`),\r\n   * sorting the data in ascending or descending order depending on the direction defined for each column.\r\n   * It supports both client-side sorting and server-side sorting by checking the `serverSideSorting` flag.\r\n   *\r\n   * @returns {Array} - The sorted data based on the current sorting configuration.\r\n   */\r\n  const sortedItems = useMemo(() => {\r\n    if (serverSideSorting) return data; // Skip sorting if using server-side sorting\r\n\r\n    const sorted = [...data].sort((a, b) => {\r\n      // Iterate through each sorting column and apply the sorting logic\r\n      for (let { key, direction } of sortConfig) {\r\n        const column = columns.find((col) => col.key === key);\r\n        const aValue = a[key];\r\n        const bValue = b[key];\r\n\r\n        if (column?.onSort) {\r\n          // If a custom sorting function is provided, use it to compare the values\r\n          const result = column.onSort(aValue, bValue, direction);\r\n          if (result !== 0) return result; // If sorting result is not 0, return it immediately\r\n        } else {\r\n          // Default sorting logic: alphabetical comparison for strings and numerical comparison for numbers\r\n          if (typeof aValue === \"string\" && typeof bValue === \"string\") {\r\n            const comparison = aValue.localeCompare(bValue);\r\n            if (comparison !== 0)\r\n              return direction === \"asc\" ? comparison : -comparison; // Apply ascending/descending order\r\n          } else if (typeof aValue === \"number\" && typeof bValue === \"number\") {\r\n            if (aValue !== bValue)\r\n              return direction === \"asc\" ? aValue - bValue : bValue - aValue; // Compare numerically\r\n          }\r\n        }\r\n      }\r\n      return 0; // Return 0 if no sorting criteria are met (equal values)\r\n    });\r\n\r\n    return sorted; // Return the sorted array\r\n  }, [data, sortConfig, columns, serverSideSorting]); // Recompute whenever data or sorting configuration changes\r\n\r\n  // Calculate the total number of pages based on the pagination method (client-side or server-side)\r\n  const totalPages = serverSidePagination\r\n    ? Math.ceil((totalRows || 0) / rowsPerPage) // For server-side pagination, calculate total pages based on totalRows (from server)\r\n    : Math.ceil(currentData.length / rowsPerPage); // For client-side pagination, calculate total pages based on currentData\r\n\r\n  // Slices the data for the current page based on the pagination method (client-side or server-side)\r\n  const currentPageData = serverSidePagination\r\n    ? currentData // Use full data for server-side pagination; parent component handles slicing\r\n    : currentData.slice(\r\n        (currentPage - 1) * rowsPerPage, // Calculate the starting index for the slice\r\n        currentPage * rowsPerPage // Calculate the ending index for the slice\r\n      );\r\n\r\n  // Sums up column widths, using the specified value or defaulting to 100px if missing.\r\n  const totalWidth = columns.reduce(\r\n    (sum, column) => sum + (column.width ? column.width : 100),\r\n    0\r\n  );\r\n\r\n  // Define pagination components based on the selected pagination type\r\n  const pagination: Record<string, JSX.Element> = {\r\n    // \"rgx-table-pagination\": The default pagination with table-like controls\r\n    \"rgx-table-pagination\": (\r\n      <RGXTablePagination\r\n        currentPage={currentPage} // Current page number\r\n        totalPages={totalPages} // Total number of pages\r\n        rowsPerPage={rowsPerPage} // Number of rows per page\r\n        totalRows={serverSidePagination ? totalRows ?? 0 : currentData.length} // Total rows count based on server-side or client-side pagination\r\n        onPageChange={onPageChange} // Callback to handle page changes\r\n        onRowsPerPageChange={onRowsPerPageChange} // Callback to handle changes in the number of rows per page\r\n        rowsPerPageOptions={rowsPerPageOptions} // Options for how many rows per page the user can select\r\n        style={paginationStyle} // Custom styling for pagination\r\n        loading={loading} // Show a loading indicator while data is being fetched\r\n        mode={mode}\r\n      />\r\n    ),\r\n    // \"rgx-arrow-pagination\": Custom pagination with arrow-based navigation\r\n    \"rgx-arrow-pagination\": (\r\n      <RGXArrowPagination\r\n        currentPage={currentPage} // Current page number\r\n        totalPages={totalPages} // Total number of pages\r\n        rowsPerPage={rowsPerPage} // Number of rows per page\r\n        totalRows={serverSidePagination ? totalRows ?? 0 : currentData.length} // Total rows count based on server-side or client-side pagination\r\n        onPageChange={onPageChange} // Callback to handle page changes\r\n        onRowsPerPageChange={onRowsPerPageChange} // Callback to handle changes in the number of rows per page\r\n        rowsPerPageOptions={rowsPerPageOptions} // Options for how many rows per page the user can select\r\n        style={paginationStyle} // Custom styling for pagination\r\n        loading={loading} // Show a loading indicator while data is being fetched\r\n        mode={mode}\r\n      />\r\n    ),\r\n  };\r\n\r\n  /**\r\n   * Updates the `currentData` state whenever the `sortedItems` array changes.\r\n   *\r\n   * This effect listens for changes in the `sortedItems` array and updates the\r\n   * `currentData` state accordingly. This ensures that the component always\r\n   * renders the most up-to-date sorted data.\r\n   *\r\n   * @note This effect is triggered every time the `sortedItems` array changes\r\n   * due to sorting changes or any other dependency in `sortedItems`.\r\n   */\r\n  useEffect(() => {\r\n    setCurrentData(sortedItems); // Set the state with the new sorted data\r\n  }, [sortedItems]); // Dependency array ensures the effect runs when `sortedItems` changes\r\n\r\n  useEffect(() => {\r\n    setRowsPerPage(\r\n      rowsPerPageOptions?.includes(rowPerPage)\r\n        ? rowPerPage\r\n        : rowsPerPageOptions[0]\r\n    );\r\n  }, [rowPerPage]);\r\n\r\n  useEffect(() => {\r\n    if (serverSidePagination && page && rowPerPage) {\r\n      setCurrentPage(page);\r\n    }\r\n  }, [page, serverSidePagination, rowPerPage]);\r\n\r\n  return (\r\n    <div className={theme}>\r\n      <div\r\n        className={mergeClasses(\r\n          \"rgx-table-container\",\r\n          loading && \"rgx-table-container-loading\",\r\n          darkMode && \"rgx-table-container-dark\"\r\n        )}\r\n        style={{\r\n          ...tableStyle[\"rgx-table-container\"],\r\n          ...(loading && {\r\n            ...tableStyle[\"rgx-table-container-loading\"],\r\n          }),\r\n          ...(darkMode && {\r\n            ...tableStyle[\"rgx-table-container-dark\"],\r\n          }),\r\n        }}\r\n      >\r\n        {/* Conditionally render the loader if loading is true */}\r\n        {loading &&\r\n          loaderComponent &&\r\n          loaderComponent({\r\n            style: loaderStyle,\r\n          })}\r\n\r\n        {/* Render the table structure */}\r\n        <table\r\n          className=\"rgx-table\"\r\n          style={{\r\n            ...(totalWidth < 1150\r\n              ? { width: \"100%\" }\r\n              : { minWidth: `${totalWidth}px` }),\r\n            ...tableStyle[\"rgx-table\"],\r\n          }}\r\n        >\r\n          <thead\r\n            className={mergeClasses(\r\n              \"rgx-table-head\",\r\n              darkMode && \"rgx-table-head-dark\"\r\n            )}\r\n            style={{\r\n              ...tableStyle[\"rgx-table-head\"],\r\n              ...(darkMode && {\r\n                ...tableStyle[\"rgx-table-head-dark\"],\r\n              }),\r\n            }}\r\n          >\r\n            {/* Render header checkbox if enabled */}\r\n            <tr\r\n              className=\"rgx-table-head-tr\"\r\n              style={{\r\n                ...tableStyle[\"rgx-table-head-tr\"],\r\n              }}\r\n            >\r\n              {selectionCheckbox && (\r\n                <th\r\n                  className={mergeClasses(\r\n                    \"rgx-table-head-th-checkbox\",\r\n                    darkMode && \"rgx-table-head-th-checkbox-dark\"\r\n                  )}\r\n                  style={{\r\n                    width: \"20px\",\r\n                    ...tableStyle[\"rgx-table-head-th-checkbox\"],\r\n                    ...(darkMode && {\r\n                      ...tableStyle[\"rgx-table-head-th-checkbox-dark\"],\r\n                    }),\r\n                  }}\r\n                >\r\n                  <input\r\n                    type=\"checkbox\"\r\n                    className=\"rgx-table-header-checkbox\"\r\n                    style={{\r\n                      ...tableStyle[\"rgx-table-header-checkbox\"],\r\n                    }}\r\n                    checked={_selectionInfo.selectAllChecked}\r\n                    onChange={onHeaderCheckboxChange}\r\n                  />\r\n                </th>\r\n              )}\r\n              {/* Render table headers based on column definitions */}\r\n              {columns?.map((column, index) => (\r\n                <th\r\n                  key={index}\r\n                  className={mergeClasses(\r\n                    \"rgx-table-head-th\",\r\n                    darkMode && \"rgx-table-head-th-dark\"\r\n                  )}\r\n                  style={{\r\n                    textAlign: \"left\",\r\n                    width: column.width ? `${column.width}px` : \"100px\",\r\n                    ...tableStyle[\"rgx-table-head-th\"],\r\n                    ...(darkMode && {\r\n                      ...tableStyle[\"rgx-table-head-th-dark\"],\r\n                    }),\r\n                  }}\r\n                >\r\n                  <div\r\n                    style={{\r\n                      display: \"flex\",\r\n                      justifyContent: \"space-between\",\r\n                      alignItems: \"center\",\r\n                    }}\r\n                  >\r\n                    <div\r\n                      onClick={\r\n                        () =>\r\n                          column.sortable &&\r\n                          onSortingMultipleSupportHandler(column) // Trigger sorting on click\r\n                      }\r\n                      style={{\r\n                        display: \"flex\",\r\n                        cursor: column.sortable ? \"pointer\" : \"default\",\r\n                      }}\r\n                    >\r\n                      {column.name} {/* Render column name */}\r\n                      {column.sortable && (\r\n                        <SvgIcon\r\n                          svgPath={\r\n                            sortConfig.some((sort) => sort.key === column.key)\r\n                              ? sortConfig.find(\r\n                                  (sort) => sort.key === column.key\r\n                                )?.direction === \"asc\"\r\n                                ? `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-up-wide-narrow\"><path d=\"m3 8 4-4 4 4\"/><path d=\"M7 4v16\"/><path d=\"M11 12h10\"/><path d=\"M11 16h7\"/><path d=\"M11 20h4\"/></svg>`\r\n                                : `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-down-wide-narrow\"><path d=\"m3 16 4 4 4-4\"/><path d=\"M7 20V4\"/><path d=\"M11 4h10\"/><path d=\"M11 8h7\"/><path d=\"M11 12h4\"/></svg>`\r\n                              : `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-down-up\"><path d=\"m3 16 4 4 4-4\"/><path d=\"M7 20V4\"/><path d=\"m21 8-4-4-4 4\"/><path d=\"M17 4v16\"/></svg>`\r\n                          }\r\n                          className=\"rgx-table-sort-icon\"\r\n                          style={{\r\n                            marginLeft: \"8px\",\r\n                            ...tableStyle[\"rgx-table-sort-icon\"],\r\n                          }}\r\n                        />\r\n                      )}\r\n                    </div>\r\n                    {column.sortable && (\r\n                      <div>\r\n                        <div\r\n                          style={{ cursor: \"pointer\", display: \"inline-block\" }}\r\n                          onClick={() => {\r\n                            setIsDotPopover(\r\n                              isDotPopover === column.key ? null : column.key\r\n                            );\r\n                          }}\r\n                        >\r\n                          <SvgIcon\r\n                            svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-ellipsis-vertical\"><circle cx=\"12\" cy=\"12\" r=\"1\"/><circle cx=\"12\" cy=\"5\" r=\"1\"/><circle cx=\"12\" cy=\"19\" r=\"1\"/></svg>`}\r\n                            className=\"rgx-table-ellipsis-vertical-icon\"\r\n                            style={{\r\n                              marginRight: \"8px\",\r\n                              marginTop: \"4px\",\r\n                              marginBottom: \"-4px\",\r\n                              ...tableStyle[\"rgx-table-ellipsis-vertical-icon\"],\r\n                            }}\r\n                          />\r\n                        </div>\r\n                        {isDotPopover === column.key && (\r\n                          <RGXPopover\r\n                            isOpen={isDotPopover === column.key}\r\n                            onClose={() => {\r\n                              setIsDotPopover(null);\r\n                            }}\r\n                            style={popupStyle}\r\n                            mode={mode}\r\n                          >\r\n                            {sortConfig.find((sort) => sort.key === column.key)\r\n                              ?.direction === \"desc\" && (\r\n                              <div\r\n                                className={mergeClasses(\r\n                                  \"rgx-table-popup-items\",\r\n                                  darkMode && \"rgx-table-popup-items-dark\"\r\n                                )}\r\n                                style={{\r\n                                  ...tableStyle[\"rgx-table-popup-items\"],\r\n                                  ...(darkMode && {\r\n                                    ...tableStyle[\"rgx-table-popup-items-dark\"],\r\n                                  }),\r\n                                }}\r\n                                onClick={() => {\r\n                                  column.sortable &&\r\n                                    onSortingMultipleSupportHandler(\r\n                                      column,\r\n                                      \"asc\"\r\n                                    );\r\n                                }}\r\n                              >\r\n                                <SvgIcon\r\n                                  svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-up-wide-narrow\"><path d=\"m3 8 4-4 4 4\"/><path d=\"M7 4v16\"/><path d=\"M11 12h10\"/><path d=\"M11 16h7\"/><path d=\"M11 20h4\"/></svg>`}\r\n                                  style={{\r\n                                    marginRight: \"8px\",\r\n                                    fontSize: \"14px\",\r\n                                    ...tableStyle[\"rgx-table-asc-sort-icon\"],\r\n                                  }}\r\n                                  className=\"rgx-table-asc-sort-icon\"\r\n                                />\r\n                                <span>Sort Ascending</span>\r\n                              </div>\r\n                            )}\r\n\r\n                            {sortConfig.find((sort) => sort.key === column.key)\r\n                              ?.direction === \"asc\" && (\r\n                              <div\r\n                                className={mergeClasses(\r\n                                  \"rgx-table-popup-items\",\r\n                                  darkMode && \"rgx-table-popup-items-dark\"\r\n                                )}\r\n                                style={{\r\n                                  ...tableStyle[\"rgx-table-popup-items\"],\r\n                                  ...(darkMode && {\r\n                                    ...tableStyle[\"rgx-table-popup-items-dark\"],\r\n                                  }),\r\n                                }}\r\n                                onClick={() => {\r\n                                  column.sortable &&\r\n                                    onSortingMultipleSupportHandler(\r\n                                      column,\r\n                                      \"desc\"\r\n                                    );\r\n                                }}\r\n                              >\r\n                                <SvgIcon\r\n                                  svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-down-wide-narrow\"><path d=\"m3 16 4 4 4-4\"/><path d=\"M7 20V4\"/><path d=\"M11 4h10\"/><path d=\"M11 8h7\"/><path d=\"M11 12h4\"/></svg>`}\r\n                                  style={{\r\n                                    marginRight: \"8px\",\r\n                                    fontSize: \"14px\",\r\n                                    ...tableStyle[\"rgx-table-desc-sort-icon\"],\r\n                                  }}\r\n                                  className=\"rgx-table-desc-sort-icon\"\r\n                                />\r\n                                <span>Sort Descending</span>\r\n                              </div>\r\n                            )}\r\n\r\n                            {!Boolean(\r\n                              sortConfig.some((sort) => sort.key === column.key)\r\n                            ) && (\r\n                              <>\r\n                                <div\r\n                                  className={mergeClasses(\r\n                                    \"rgx-table-popup-items\",\r\n                                    darkMode && \"rgx-table-popup-items-dark\"\r\n                                  )}\r\n                                  style={{\r\n                                    ...tableStyle[\"rgx-table-popup-items\"],\r\n                                    ...(darkMode && {\r\n                                      ...tableStyle[\r\n                                        \"rgx-table-popup-items-dark\"\r\n                                      ],\r\n                                    }),\r\n                                  }}\r\n                                  onClick={() => {\r\n                                    column.sortable &&\r\n                                      onSortingMultipleSupportHandler(\r\n                                        column,\r\n                                        \"asc\"\r\n                                      );\r\n                                  }}\r\n                                >\r\n                                  <SvgIcon\r\n                                    svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-up-wide-narrow\"><path d=\"m3 8 4-4 4 4\"/><path d=\"M7 4v16\"/><path d=\"M11 12h10\"/><path d=\"M11 16h7\"/><path d=\"M11 20h4\"/></svg>`}\r\n                                    style={{\r\n                                      marginRight: \"8px\",\r\n                                      fontSize: \"14px\",\r\n                                      ...tableStyle[\"rgx-table-asc-sort-icon\"],\r\n                                    }}\r\n                                    className=\"rgx-table-asc-sort-icon\"\r\n                                  />\r\n                                  <span>Sort Ascending</span>\r\n                                </div>\r\n                                <div\r\n                                  className={mergeClasses(\r\n                                    \"rgx-table-popup-items\",\r\n                                    darkMode && \"rgx-table-popup-items-dark\"\r\n                                  )}\r\n                                  style={{\r\n                                    ...tableStyle[\"rgx-table-popup-items\"],\r\n                                    ...(darkMode && {\r\n                                      ...tableStyle[\r\n                                        \"rgx-table-popup-items-dark\"\r\n                                      ],\r\n                                    }),\r\n                                  }}\r\n                                  onClick={() => {\r\n                                    column.sortable &&\r\n                                      onSortingMultipleSupportHandler(\r\n                                        column,\r\n                                        \"desc\"\r\n                                      );\r\n                                  }}\r\n                                >\r\n                                  <SvgIcon\r\n                                    svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-down-wide-narrow\"><path d=\"m3 16 4 4 4-4\"/><path d=\"M7 20V4\"/><path d=\"M11 4h10\"/><path d=\"M11 8h7\"/><path d=\"M11 12h4\"/></svg>`}\r\n                                    style={{\r\n                                      marginRight: \"8px\",\r\n                                      fontSize: \"14px\",\r\n                                      ...tableStyle[\"rgx-table-desc-sort-icon\"],\r\n                                    }}\r\n                                    className=\"rgx-table-desc-sort-icon\"\r\n                                  />\r\n                                  <span>Sort Descending</span>\r\n                                </div>\r\n                              </>\r\n                            )}\r\n\r\n                            {Boolean(\r\n                              sortConfig.some((sort) => sort.key === column.key)\r\n                            ) && (\r\n                              <div\r\n                                className={mergeClasses(\r\n                                  \"rgx-table-popup-items\",\r\n                                  darkMode && \"rgx-table-popup-items-dark\"\r\n                                )}\r\n                                style={{\r\n                                  ...tableStyle[\"rgx-table-popup-items\"],\r\n                                  ...(darkMode && {\r\n                                    ...tableStyle[\"rgx-table-popup-items-dark\"],\r\n                                  }),\r\n                                }}\r\n                                onClick={() => {\r\n                                  onClearSort();\r\n                                }}\r\n                              >\r\n                                <SvgIcon\r\n                                  svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-arrow-down-up\"><path d=\"m3 16 4 4 4-4\"/><path d=\"M7 20V4\"/><path d=\"m21 8-4-4-4 4\"/><path d=\"M17 4v16\"/></svg>`}\r\n                                  style={{\r\n                                    marginRight: \"8px\",\r\n                                    fontSize: \"14px\",\r\n                                    ...tableStyle[\r\n                                      \"rgx-table-asc-desc-sort-icon\"\r\n                                    ],\r\n                                  }}\r\n                                  className=\"rgx-table-asc-desc-sort-icon\"\r\n                                />\r\n                                <span>Clear Sort</span>\r\n                              </div>\r\n                            )}\r\n                          </RGXPopover>\r\n                        )}\r\n                      </div>\r\n                    )}\r\n                  </div>\r\n                </th>\r\n              ))}\r\n            </tr>\r\n          </thead>\r\n          <tbody\r\n            className={mergeClasses(\r\n              \"rgx-table-body\",\r\n              loading && \"rgx-table-tobody-loading\"\r\n            )} // Add loading class if data is loading\r\n            style={{\r\n              ...tableStyle[\"rgx-table-body\"],\r\n              ...(loading && {\r\n                ...tableStyle[\"rgx-table-tobody-loading\"],\r\n              }),\r\n            }}\r\n          >\r\n            {/* Render table rows for the current page */}\r\n            {currentPageData.map((row, rowIndex) => (\r\n              <React.Fragment\r\n                key={row.id || rowIndex} // Use a unique key for each row\r\n              >\r\n                <tr\r\n                  key={row.id || rowIndex} // Use a unique key for each row\r\n                  className={mergeClasses(\r\n                    \"rgx-table-body-tr\",\r\n                    expandedRow === rowIndex && \"rgx-table-body-tr-expanded\",\r\n                    darkMode && \"rgx-table-body-tr-dark\"\r\n                  )} // Add class for expanded row\r\n                  style={{\r\n                    ...tableStyle[\"rgx-table-body-tr\"],\r\n                    ...(expandedRow === rowIndex && {\r\n                      ...tableStyle[\"rgx-table-body-tr-expanded\"],\r\n                    }),\r\n                    ...(darkMode && {\r\n                      ...tableStyle[\"rgx-table-body-tr-dark\"],\r\n                    }),\r\n                  }}\r\n                  onClick={() => {\r\n                    // Handle row click for expanding or triggering onRowClick callback\r\n                    expandedComponent &&\r\n                      setExpandedRow(\r\n                        expandedRow === rowIndex ? null : rowIndex\r\n                      );\r\n                    onRowClick && onRowClick(row); // Call user-provided onRowClick handler\r\n                  }}\r\n                >\r\n                  {/* Render row checkbox if enabled */}\r\n                  {selectionCheckbox && (\r\n                    <td\r\n                      className={mergeClasses(\r\n                        \"rgx-table-body-td-checkbox\",\r\n                        darkMode && \"rgx-table-body-td-checkbox-dark\"\r\n                      )}\r\n                      style={{\r\n                        width: \"20px\",\r\n                        ...tableStyle[\"rgx-table-body-td-checkbox\"],\r\n                        ...(darkMode && {\r\n                          ...tableStyle[\"rgx-table-body-td-checkbox-dark\"],\r\n                        }),\r\n                      }}\r\n                    >\r\n                      <input\r\n                        type=\"checkbox\"\r\n                        className=\"rgx-table-row-checkbox\"\r\n                        style={{\r\n                          ...tableStyle[\"rgx-table-row-checkbox\"],\r\n                        }}\r\n                        checked={_selectionInfo.selectedRows.includes(row.id)}\r\n                        onChange={() => onRowCheckboxChange(row.id)}\r\n                      />\r\n                    </td>\r\n                  )}\r\n                  {/* Render cells based on column definitions */}\r\n                  {columns.map((column, colIndex) => (\r\n                    <td\r\n                      key={colIndex}\r\n                      className={mergeClasses(\r\n                        \"rgx-table-body-td\",\r\n                        darkMode && \"rgx-table-body-td-dark\"\r\n                      )}\r\n                      style={{\r\n                        width: column.width || \"auto\",\r\n                        ...tableStyle[\"rgx-table-body-td\"],\r\n                        ...(darkMode && {\r\n                          ...tableStyle[\"rgx-table-body-td-dark\"],\r\n                        }),\r\n                      }}\r\n                    >\r\n                      {/* Conditionally render the arrow icon if expandedComponent is passed */}\r\n                      {/* {expandedComponent && colIndex === 0 && (\r\n                        <span\r\n                          className=\"rgx-table-expanded-arrow\"\r\n                          style={{\r\n                            ...tableStyle[\"rgx-table-expanded-arrow\"],\r\n                          }}\r\n                          onClick={(e) => {\r\n                            e.stopPropagation(); // Prevent row click event from firing\r\n                            setExpandedRow(\r\n                              expandedRow === rowIndex ? null : rowIndex\r\n                            ); // Toggle expanded row\r\n                          }}\r\n                        >\r\n                          <SvgIcon\r\n                            svgPath={\r\n                              expandedRow === rowIndex\r\n                                ? `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-down\"><path d=\"m6 9 6 6 6-6\"/></svg>`\r\n                                : `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-up\"><path d=\"m18 15-6-6-6 6\"/></svg>`\r\n                            }\r\n                            className=\"rgx-table-expanded-arrow-icon\"\r\n                            style={{\r\n                              ...tableStyle[\"rgx-table-expanded-arrow-icon\"],\r\n                            }}\r\n                          />\r\n                        </span>\r\n                      )} */}\r\n\r\n                      {/* Render cell data with optional tooltip and custom render function */}\r\n                      {column.tooltip ? (\r\n                        <RGXTooltip\r\n                          content={\r\n                            column.tooltipCustomContent\r\n                              ? column.tooltipCustomContent(row)\r\n                              : row[column.key] // Display custom tooltip content if provided\r\n                          }\r\n                          style={tooltipStyle}\r\n                        >\r\n                          {\r\n                            column.render\r\n                              ? column.render(row) // Custom render function if available\r\n                              : row[column.key] ?? \"\" // Default value for cell data\r\n                          }\r\n                        </RGXTooltip>\r\n                      ) : column.render ? (\r\n                        column.render(row) // Custom render function if available\r\n                      ) : (\r\n                        row[column.key] ?? \"\" // Default value for cell data\r\n                      )}\r\n                    </td>\r\n                  ))}\r\n                </tr>\r\n\r\n                {/* Render expanded row content if expandedRow matches the row index */}\r\n                {expandedRow === rowIndex && expandedComponent && (\r\n                  <tr\r\n                    className=\"rgx-table-expanded-row-tr\"\r\n                    style={{\r\n                      ...tableStyle[\"rgx-table-expanded-row-tr\"],\r\n                    }}\r\n                  >\r\n                    <td\r\n                      colSpan={columns.length} // Span across all columns for expanded row\r\n                      className=\"rgx-table-expanded-row-td\"\r\n                      style={{\r\n                        ...tableStyle[\"rgx-table-expanded-row-td\"],\r\n                      }}\r\n                    >\r\n                      {/* Call the expanded component and pass the row data */}\r\n                      {expandedComponent(row)}\r\n                    </td>\r\n                  </tr>\r\n                )}\r\n              </React.Fragment>\r\n            ))}\r\n          </tbody>\r\n        </table>\r\n      </div>\r\n\r\n      {/* Render the pagination component */}\r\n      {pagination[paginationType as keyof typeof pagination]}\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default ReactGridX;\r\n","import React from \"react\";\nimport { SvgIconProps } from \"../../types/svg-icons-props\";\n\nconst SvgIcon: React.FC<SvgIconProps> = ({\n  color = \"currentColor\",\n  svgPath,\n  style = {},\n  className = \"\",\n  ...props\n}) => {\n  const widthMatch = svgPath.match(/width=[\"']?(\\d+)[\"']?/);\n  const heightMatch = svgPath.match(/height=[\"']?(\\d+)[\"']?/);\n\n  const width = widthMatch ? `${widthMatch[1]}px` : \"24px\";\n  const height = heightMatch ? `${heightMatch[1]}px` : \"24px\";\n\n  return (\n    <span\n      className={className}\n      style={{\n        display: \"inline-block\",\n        width,\n        height,\n        ...style,\n      }}\n      dangerouslySetInnerHTML={{\n        __html: svgPath.replace(/currentColor/g, color),\n      }}\n      {...props}\n    />\n  );\n};\n\nexport default SvgIcon;\n","import React from \"react\";\nimport { RGXArrowPaginationProps } from \"../../../types/arrow-pagination-props\";\nimport SvgIcon from \"../../SVGIcons\";\n\nconst RGXArrowPagination: React.FC<RGXArrowPaginationProps> = ({\n  currentPage,\n  totalPages,\n  rowsPerPage,\n  totalRows,\n  onPageChange,\n  onRowsPerPageChange,\n  rowsPerPageOptions = [5, 10, 15],\n  style = {},\n  loading = false,\n  mode = \"light\",\n}) => {\n  const darkMode = mode === \"dark\";\n\n  return (\n    <div\n      className=\"rgx-arrow-pagination\"\n      style={{\n        ...style[\"rgx-arrow-pagination\"],\n      }}\n    >\n      {/* Display pagination information: current page and total rows */}\n      <div\n        className={`rgx-arrow-pagination-info ${\n          darkMode && \"rgx-arrow-pagination-info-dark\"\n        }`}\n        style={{\n          ...style[\"rgx-arrow-pagination-info\"],\n          ...(darkMode && {\n            ...style[\"rgx-arrow-pagination-info-dark\"],\n          }),\n        }}\n      >\n        Showing {(currentPage - 1) * rowsPerPage + 1} to{\" \"}\n        {Math.min(currentPage * rowsPerPage, totalRows)} of {totalRows}\n      </div>\n\n      {/* Rows per page selector and pagination controls */}\n      <div\n        className=\"rgx-arrow-pagination-row-per-page\"\n        style={{\n          ...style[\"rgx-arrow-pagination-row-per-page\"],\n        }}\n      >\n        {/* Rows per page dropdown */}\n        <div\n          className=\"rgx-arrow-pagination-rows-per-page\"\n          style={{\n            ...style[\"rgx-arrow-pagination-rows-per-page\"],\n          }}\n        >\n          <label\n            htmlFor=\"rowsPerPage\"\n            className={`rgx-arrow-pagination-rows-per-page-label ${\n              darkMode && \"rgx-arrow-pagination-rows-per-page-label-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-rows-per-page-label\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-rows-per-page-label-dark\"],\n              }),\n            }}\n          >\n            Rows per page:\n          </label>\n          <select\n            id=\"rowsPerPage\"\n            className={`rgx-arrow-pagination-rows-per-page-select ${\n              darkMode && \"rgx-arrow-pagination-rows-per-page-select-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-rows-per-page-select\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-rows-per-page-select-dark\"],\n              }),\n            }}\n            value={rowsPerPage}\n            onChange={(e) => onRowsPerPageChange(Number(e.target.value))}\n            disabled={loading}\n          >\n            {rowsPerPageOptions?.map((option) => (\n              <option key={option} value={option}>\n                {option}\n              </option>\n            ))}\n          </select>\n        </div>\n\n        {/* Pagination controls (previous, next, first, last buttons) */}\n        <div\n          className=\"rgx-arrow-pagination-controls\"\n          style={{\n            ...style[\"rgx-arrow-pagination-controls\"],\n          }}\n        >\n          {/* Previous First page button */}\n          <button\n            disabled={currentPage === 1 || loading}\n            onClick={() => onPageChange(1)} // Navigate to the first page\n            className={`rgx-arrow-pagination-button ${\n              darkMode && \"rgx-arrow-pagination-button-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-button\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-button-dark\"],\n              }),\n            }}\n          >\n            <SvgIcon\n              svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevrons-left\"><path d=\"m11 17-5-5 5-5\"/><path d=\"m18 17-5-5 5-5\"/></svg>`}\n            />\n          </button>\n          {/* Previous page button */}\n          <button\n            disabled={currentPage === 1 || loading}\n            onClick={() => onPageChange(currentPage - 1)} // Navigate to the previous page\n            className={`rgx-arrow-pagination-button ${\n              darkMode && \"rgx-arrow-pagination-button-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-button\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-button-dark\"],\n              }),\n            }}\n          >\n            <SvgIcon\n              svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-left\"><path d=\"m15 18-6-6 6-6\"/></svg>`}\n            />\n          </button>\n          {/* Page info (current page and total pages) */}\n          <div\n            className={`rgx-arrow-pagination-page-of ${\n              darkMode && \"rgx-arrow-pagination-page-of-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-page-of\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-page-of-dark\"],\n              }),\n            }}\n          >\n            Page {currentPage} of {totalPages}\n          </div>\n          {/* Next page button */}\n          <button\n            disabled={currentPage === totalPages || loading}\n            onClick={() => onPageChange(currentPage + 1)} // Navigate to the next page\n            className={`rgx-arrow-pagination-button ${\n              darkMode && \"rgx-arrow-pagination-button-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-button\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-button-dark\"],\n              }),\n            }}\n          >\n            <SvgIcon\n              svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-right\"><path d=\"m9 18 6-6-6-6\"/></svg>`}\n            />\n          </button>\n\n          {/* Next Last page button */}\n          <button\n            disabled={currentPage === totalPages || loading}\n            onClick={() => onPageChange(totalPages)} // Navigate to the last page\n            className={`rgx-arrow-pagination-button ${\n              darkMode && \"rgx-arrow-pagination-button-dark\"\n            }`}\n            style={{\n              ...style[\"rgx-arrow-pagination-button\"],\n              ...(darkMode && {\n                ...style[\"rgx-arrow-pagination-button-dark\"],\n              }),\n            }}\n          >\n            <SvgIcon\n              svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevrons-right\"><path d=\"m6 17 5-5-5-5\"/><path d=\"m13 17 5-5-5-5\"/></svg>`}\n            />\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default RGXArrowPagination; // Export the RGXArrowPagination component for use in other parts of the app\n","import React from \"react\";\r\nimport { RGXTablePaginationProps } from \"../../../types/table-pagination-props\";\r\nimport SvgIcon from \"../../SVGIcons\";\r\n\r\nconst RGXTablePagination: React.FC<RGXTablePaginationProps> = ({\r\n  currentPage,\r\n  totalPages,\r\n  rowsPerPage,\r\n  totalRows,\r\n  onPageChange,\r\n  onRowsPerPageChange,\r\n  rowsPerPageOptions = [5, 10, 15],\r\n  style = {},\r\n  loading = false,\r\n  mode = \"light\",\r\n}) => {\r\n  const darkMode = mode === \"dark\";\r\n\r\n  /**\r\n   * Generates an array of page numbers for pagination with ellipses if necessary.\r\n   * This ensures that the number of visible pages is limited, and ellipses are displayed when\r\n   * there are too many pages to show.\r\n   *\r\n   * @returns {Array<number | string>} - An array of page numbers and ellipsis for navigation.\r\n   */\r\n  const getPageNumbers = () => {\r\n    const pageNumbers: (number | string)[] = [];\r\n    const maxVisiblePages = 4; // Maximum number of pages to show at once\r\n\r\n    if (totalPages <= maxVisiblePages) {\r\n      // If total pages are within the max visible, display all pages\r\n      for (let i = 1; i <= totalPages; i++) {\r\n        pageNumbers.push(i);\r\n      }\r\n    } else {\r\n      // Add first page and ellipsis if necessary\r\n      if (currentPage > 2) {\r\n        pageNumbers.push(1, \"...\");\r\n      } else {\r\n        pageNumbers.push(1);\r\n      }\r\n\r\n      // Calculate the range of pages to display around the current page\r\n      const startPage = Math.max(2, currentPage - 1);\r\n      const endPage = Math.min(totalPages - 1, currentPage + 1);\r\n\r\n      // Add the range of pages\r\n      for (let i = startPage; i <= endPage; i++) {\r\n        pageNumbers.push(i);\r\n      }\r\n\r\n      // Add ellipsis and last page if necessary\r\n      if (currentPage < totalPages - 1) {\r\n        pageNumbers.push(\"...\", totalPages);\r\n      } else {\r\n        pageNumbers.push(totalPages);\r\n      }\r\n    }\r\n\r\n    return pageNumbers;\r\n  };\r\n\r\n  const pageNumbers = getPageNumbers(); // Generate the page numbers\r\n\r\n  return (\r\n    <div\r\n      className=\"rgx-table-pagination\"\r\n      style={{\r\n        ...style[\"rgx-table-pagination\"],\r\n      }}\r\n    >\r\n      {/* Display pagination information (current page range and total rows) */}\r\n      <div\r\n        className={`rgx-table-pagination-info ${\r\n          darkMode && \"rgx-table-pagination-info-dark\"\r\n        }`}\r\n        style={{\r\n          ...style[\"rgx-table-pagination-info\"],\r\n          ...(darkMode && {\r\n            ...style[\"rgx-table-pagination-info-dark\"],\r\n          }),\r\n        }}\r\n      >\r\n        Showing {(currentPage - 1) * rowsPerPage + 1} to{\" \"}\r\n        {Math.min(currentPage * rowsPerPage, totalRows)} of {totalRows}\r\n      </div>\r\n\r\n      {/* Rows per page selector and pagination controls */}\r\n      <div\r\n        className=\"rgx-table-pagination-row-per-page\"\r\n        style={{\r\n          ...style[\"rgx-table-pagination-row-per-page\"],\r\n        }}\r\n      >\r\n        {/* Rows per page dropdown */}\r\n        <div\r\n          className=\"rgx-table-pagination-rows-per-page\"\r\n          style={{\r\n            ...style[\"rgx-table-pagination-rows-per-page\"],\r\n          }}\r\n        >\r\n          <label\r\n            htmlFor=\"rowsPerPage\"\r\n            className={`rgx-table-pagination-rows-per-page-label ${\r\n              darkMode && \"rgx-table-pagination-rows-per-page-label-dark\"\r\n            }`}\r\n            style={{\r\n              ...style[\"rgx-table-pagination-rows-per-page-label\"],\r\n              ...(darkMode && {\r\n                ...style[\"rgx-table-pagination-rows-per-page-label-dark\"],\r\n              }),\r\n            }}\r\n          >\r\n            Rows per page:\r\n          </label>\r\n          <select\r\n            id=\"rowsPerPage\"\r\n            className={`rgx-table-pagination-rows-per-page-select ${\r\n              darkMode && \"rgx-table-pagination-rows-per-page-select-dark\"\r\n            }`}\r\n            style={{\r\n              ...style[\"rgx-table-pagination-rows-per-page-select\"],\r\n              ...(darkMode && {\r\n                ...style[\"rgx-table-pagination-rows-per-page-select-dark\"],\r\n              }),\r\n            }}\r\n            value={rowsPerPage}\r\n            onChange={(e) => onRowsPerPageChange(Number(e.target.value))}\r\n            disabled={loading}\r\n          >\r\n            {rowsPerPageOptions?.map((option) => (\r\n              <option key={option} value={option}>\r\n                {option}\r\n              </option>\r\n            ))}\r\n          </select>\r\n        </div>\r\n\r\n        {/* Pagination controls (previous, page numbers, next) */}\r\n        <div\r\n          className=\"rgx-table-pagination-controls\"\r\n          style={{\r\n            ...style[\"rgx-table-pagination-controls\"],\r\n          }}\r\n        >\r\n          {/* Previous page button */}\r\n          <button\r\n            disabled={currentPage === 1 || loading}\r\n            onClick={() => onPageChange(currentPage - 1)}\r\n            className={`rgx-table-pagination-button-icon ${\r\n              darkMode && \"rgx-table-pagination-button-icon-dark\"\r\n            }`}\r\n            style={{\r\n              ...style[\"rgx-table-pagination-button-icon\"],\r\n              ...(darkMode && {\r\n                ...style[\"rgx-table-pagination-button-icon-dark\"],\r\n              }),\r\n            }}\r\n          >\r\n            <SvgIcon\r\n              svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-left\"><path d=\"m15 18-6-6 6-6\"/></svg>`}\r\n            />\r\n          </button>\r\n\r\n          {/* Page number buttons */}\r\n          {pageNumbers.map((page, index) =>\r\n            typeof page === \"number\" ? (\r\n              <button\r\n                key={index}\r\n                className={`rgx-table-pagination-button ${\r\n                  currentPage === page && \"rgx-table-pagination-active\"\r\n                } ${darkMode && \"rgx-table-pagination-button-dark\"}`}\r\n                style={{\r\n                  ...style[\"rgx-table-pagination-button\"],\r\n                  ...(currentPage === page && {\r\n                    ...style[\"rgx-table-pagination-button-active\"],\r\n                  }),\r\n                  ...(darkMode && {\r\n                    ...style[\"rgx-table-pagination-button-dark\"],\r\n                  }),\r\n                }}\r\n                onClick={() => onPageChange(page)}\r\n                disabled={loading}\r\n              >\r\n                {page}\r\n              </button>\r\n            ) : (\r\n              <button\r\n                key={index}\r\n                disabled\r\n                className={`rgx-table-pagination-button rgx-table-pagination-ellipsis ${\r\n                  darkMode &&\r\n                  \"rgx-table-pagination-button-dark rgx-table-pagination-ellipsis-dark\"\r\n                }`}\r\n                style={{\r\n                  ...style[\"rgx-table-pagination-button\"],\r\n                  ...style[\"rgx-table-pagination-ellipsis\"],\r\n                  ...(darkMode && {\r\n                    ...style[\"rgx-table-pagination-button-dark\"],\r\n                    ...style[\"rgx-table-pagination-ellipsis-dark\"],\r\n                  }),\r\n                  cursor: \"default\",\r\n                  opacity: 0.6,\r\n                }}\r\n              >\r\n                {page}\r\n              </button>\r\n            )\r\n          )}\r\n\r\n          {/* Next page button */}\r\n          <button\r\n            disabled={currentPage === totalPages || loading}\r\n            onClick={() => onPageChange(currentPage + 1)}\r\n            className={`rgx-table-pagination-button-icon ${\r\n              darkMode && \"rgx-table-pagination-button-icon-dark\"\r\n            }`}\r\n            style={{\r\n              ...style[\"rgx-table-pagination-button-icon\"],\r\n              ...(darkMode && {\r\n                ...style[\"rgx-table-pagination-button-icon-dark\"],\r\n              }),\r\n            }}\r\n          >\r\n            <SvgIcon\r\n              svgPath={`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-chevron-right\"><path d=\"m9 18 6-6-6-6\"/></svg>`}\r\n            />\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\nexport default RGXTablePagination; // Export RGXTablePagination for use in other components\r\n","import React from \"react\";\nimport { RGXTooltipProps } from \"../../types/tooltip-props\";\n\nconst RGXTooltip: React.FC<RGXTooltipProps> = ({\n  content,\n  children,\n  style = {},\n}) => {\n  return (\n    <div\n      className=\"rgx-tooltip-container\"\n      style={{\n        ...style[\"rgx-tooltip-container\"],\n      }}\n    >\n      {/* The element the tooltip is attached to */}\n      {children}\n\n      {/* The tooltip text, shown on hover */}\n      <span\n        className=\"rgx-tooltip-text\"\n        style={{\n          minWidth: String(content)?.length * 5,\n          ...style[\"rgx-tooltip-text\"],\n        }}\n      >\n        {content}\n      </span>\n    </div>\n  );\n};\n\nexport default RGXTooltip; // Export the Tooltip component to be used in other parts of the app\n","import React from \"react\";\nimport { RGXLoaderProps } from \"../../types/loader-props\";\n\nconst RGXLoader: React.FC<RGXLoaderProps> = ({\n  message = \"Loading, please wait...\", // Default message if no custom message is passed\n  style = {},\n}) => (\n  <div\n    className=\"rgx-loader-container\"\n    style={{\n      ...style[\"rgx-loader-container\"],\n    }}\n  >\n    {/* Spinner element that represents the loading animation */}\n    <div\n      className=\"rgx-loader-spinner\"\n      style={{\n        ...style[\"rgx-loader-spinner\"],\n      }}\n    ></div>\n\n    {/* Display the loading message (if any) */}\n    <div\n      className=\"rgx-loader-message\"\n      style={{\n        ...style[\"rgx-loader-message\"],\n      }}\n    >\n      {message}\n    </div>\n  </div>\n);\n\nexport default RGXLoader; // Export the Loader component to be used in other parts of the app\n","import React, { useRef, useEffect } from \"react\";\nimport { RGXPopoverProps } from \"../../types/pop-over-props\";\n\nconst RGXPopover: React.FC<RGXPopoverProps> = ({\n  children,\n  isOpen,\n  onClose,\n  style = {},\n  mode = \"light\",\n}) => {\n  const darkMode = mode === \"dark\";\n  const popoverRef = useRef<HTMLDivElement | null>(null);\n  /**\n   * Detects clicks outside the popover and triggers the `onClose` function.\n   * This ensures the popover closes when the user clicks anywhere outside of it.\n   */\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        popoverRef.current &&\n        !popoverRef.current.contains(event.target as Node)\n      ) {\n        onClose();\n      }\n    };\n\n    if (isOpen) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n    }\n\n    return () => document.removeEventListener(\"mousedown\", handleClickOutside);\n  }, [isOpen, onClose]);\n\n  if (!isOpen) return null; // Prevent rendering when popover is closed\n\n  return (\n    <div\n      className={`rgx-popover-content rgx-popover-show ${\n        darkMode && \"rgx-popover-content-dark\"\n      }`}\n      ref={popoverRef}\n      style={{\n        ...style[\"rgx-popover-content\"],\n        ...style[\"rgx-popover-show\"],\n        ...(darkMode && {\n          ...style[\"rgx-popover-content-dark\"],\n        }),\n      }}\n    >\n      <div\n        className={`rgx-popover-arrow ${darkMode && \"rgx-popover-arrow-dark\"}`}\n        style={{\n          ...style[\"rgx-popover-arrow\"],\n          ...(darkMode && {\n            ...style[\"rgx-popover-arrow-dark\"],\n          }),\n        }}\n      ></div>\n      {children} {/* Dynamic content inside the popover */}\n    </div>\n  );\n};\n\nexport default RGXPopover;\n","type MergeClassesArg =\n  | string\n  | boolean\n  | null\n  | undefined\n  | number\n  | { [key: string]: any }\n  | MergeClassesArg[];\n\nexport function mergeClasses(...args: MergeClassesArg[]): string {\n  const classes: string[] = [];\n\n  // Helper function to process each argument\n  function processArg(arg: MergeClassesArg): void {\n    if (!arg) return; // Ignore falsy values (null, undefined, false, 0, \"\")\n\n    if (typeof arg === \"string\") {\n      // Directly add strings if they are non-empty\n      if (arg.trim()) classes.push(arg.trim());\n    } else if (Array.isArray(arg)) {\n      // Recursively process arrays\n      arg.forEach(processArg);\n    } else if (typeof arg === \"object\" && arg !== null) {\n      // Process objects, adding keys with truthy values\n      Object.entries(arg).forEach(([key, value]) => {\n        if (value) classes.push(key);\n      });\n    }\n    // Ignore other types (numbers, booleans, etc.)\n  }\n\n  // Process all arguments\n  args.forEach(processArg);\n\n  // Join classes with a space and return\n  return classes.join(\" \");\n}\n"],"mappings":"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","names":["React","useEffect","useMemo","useState","jsx","SvgIcon","color","svgPath","style","className","props","widthMatch","heightMatch","width","height","SVGIcons_default","jsx","jsxs","RGXArrowPagination","currentPage","totalPages","rowsPerPage","totalRows","onPageChange","onRowsPerPageChange","rowsPerPageOptions","style","loading","mode","darkMode","e","option","SVGIcons_default","RGXArrowPagination_default","jsx","jsxs","RGXTablePagination","currentPage","totalPages","rowsPerPage","totalRows","onPageChange","onRowsPerPageChange","rowsPerPageOptions","style","loading","mode","darkMode","pageNumbers","i","startPage","endPage","e","option","SVGIcons_default","page","index","RGXTablePagination_default","jsx","jsxs","RGXTooltip","content","children","style","Tooltip_default","jsx","jsxs","RGXLoader","message","style","Loader_default","useRef","useEffect","jsx","jsxs","RGXPopover","children","isOpen","onClose","style","mode","darkMode","popoverRef","handleClickOutside","event","Popover_default","mergeClasses","args","classes","processArg","arg","key","value","Fragment","jsx","jsxs","ReactGridX","columns","data","theme","rowsPerPageOptions","paginationType","paginationStyle","tableStyle","loaderStyle","popupStyle","tooltipStyle","serverSidePagination","onPaginationAndRowSizeChange","totalRows","serverSideSorting","onSorting","onRowClick","expandedComponent","loading","loaderComponent","style","Loader_default","multiColumnSort","selectionCheckbox","onSelectionCheck","rowPerPage","page","mode","darkMode","currentPage","setCurrentPage","useState","currentData","setCurrentData","sortConfig","setSortConfig","rowsPerPage","setRowsPerPage","expandedRow","setExpandedRow","isDotPopover","setIsDotPopover","_selectionInfo","_setSelectionInfo","onPageChange","onRowsPerPageChange","rows","onHeaderCheckboxChange","_newSelectAllChecked","_newSelectedRows","row","onRowCheckboxChange","rowId","id","onSortingMultipleSupportHandler","column","customDirection","prev","existingSort","s","newSortConfig","onClearSort","sortedItems","useMemo","a","b","key","direction","col","aValue","bValue","result","comparison","totalPages","currentPageData","totalWidth","sum","pagination","RGXTablePagination_default","RGXArrowPagination_default","useEffect","mergeClasses","index","SVGIcons_default","sort","Popover_default","rowIndex","React","colIndex","Tooltip_default","ReactGridX_default"]}