updates

Author: samvel97

package.json

@@ -1,6 +1,6 @@
 {
   "name": "beautiful-react-table",
-  "version": "7.8.1",
+  "version": "7.8.2",
   "description": "My first react typescript package",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",

src/Models/table.models.ts

@@ -63,6 +63,7 @@ export interface IProps<T extends Object> {
   handleSorting?(option: string): void
   handleArgChange?(columnName: string, type: string): void
   handleDeleteAll?: () => void
+  staticAction?(): JSX.Element
 }
 
 export interface ItemFields {

src/table/MainHeader/ColumnsCustomizer/style.scss

@@ -7,7 +7,6 @@
 }
 .G-costumize-wrapper{
     margin-left: 5px;
-    flex: 1 1 auto;
 }
 .G-costumize-modal{
     border-radius: 4px;

src/table/MainHeader/index.tsx

@@ -53,6 +53,7 @@ interface IActionsHeader<T extends Object> {
   getDownloadType?: (option: string, checkedRows: T[] | string) => void
   customHeaderAction?(option: T[] | string): JSX.Element
   handleDeleteAll?: () => void
+  staticAction?(): JSX.Element
 }
 const MainHeader = <T extends Object>({
   columnsConfigStructure,
@@ -85,6 +86,7 @@ const MainHeader = <T extends Object>({
   getDownloadType,
   customHeaderAction,
   handleDeleteAll,
+  staticAction,
 }: IActionsHeader<T>) => {
   return (
     <div className='G-justify-start G-table-actions-header'>
@@ -118,7 +120,9 @@ const MainHeader = <T extends Object>({
             {/* {selectedType === CheckedItems.SELECTED_ALL || checkedRows.length
               ? customHeaderAction?.(checkedRows)
               : null} */}
-            {customHeaderAction?.(checkedRows)}
+            {selectedType === CheckedItems.SELECTED_ALL || checkedRows.length
+              ? customHeaderAction?.(checkedRows)
+              : null}
             {/* {handleDeleteAll && data.length > 1 && (
               <div className="G-flex G-delete" onClick={handleDeleteAll}>
                 <div className="G-center G-delete-icon">
@@ -130,16 +134,26 @@ const MainHeader = <T extends Object>({
           </div>
         </>
       ) : null}
-      {draggableColumns ? (
-        <ColumnsCustomizer
-          columnsConfigStructure={columnsConfigStructure}
-          setColumnsConfigStructure={setColumnsConfigStructure}
-          columnsHeaderStructure={columnsHeaderStructure}
-          setColumnHeaderStructure={setColumnHeaderStructure}
-          translations={translations}
-          storeStructure={storeStructure}
-        />
-      ) : null}
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          gap: '32px',
+          flex: '1 1 auto',
+        }}
+      >
+        {draggableColumns ? (
+          <ColumnsCustomizer
+            columnsConfigStructure={columnsConfigStructure}
+            setColumnsConfigStructure={setColumnsConfigStructure}
+            columnsHeaderStructure={columnsHeaderStructure}
+            setColumnHeaderStructure={setColumnHeaderStructure}
+            translations={translations}
+            storeStructure={storeStructure}
+          />
+        ) : null}
+        {staticAction?.()}
+      </div>
 
       {hasFilters ? (
         <Filter

src/table/index.tsx

@@ -69,6 +69,7 @@ function Table<T extends Object>({
   handleSorting,
   handleArgChange,
   handleDeleteAll,
+  staticAction,
 }: IProps<T>) {
   const {
     freezedRows,
@@ -125,6 +126,7 @@ function Table<T extends Object>({
           getDownloadType={getDownloadType}
           customHeaderAction={customHeaderAction}
           handleDeleteAll={handleDeleteAll}
+          staticAction={staticAction}
         />
       ) : null}