sccoreui 6.1.58 → 6.1.60

package/dist/App.scss

@@ -47,8 +47,6 @@
   --box-shadow-none: none;
 }
 
-
-
 // height and width utility classes
 
 .h-40 {
@@ -59,7 +57,6 @@
   height: 44px !important;
 }
 
-
 // @font-face {
 //   font-family: "Lato";
 // }
@@ -471,7 +468,12 @@ div:has(ul.date_filter) .p-datepicker-group-container {
   border-left: 1px solid #dee2e6;
 }
 
-div:has(ul.date_filter) .p-datepicker-group-container .p-datepicker table td>span {
+div:has(ul.date_filter)
+  .p-datepicker-group-container
+  .p-datepicker
+  table
+  td
+  > span {
   width: 40px;
   height: 40px;
 }
@@ -661,7 +663,13 @@ button#formatOLOptions-1.fr-active::before {
   padding: 12px !important;
 }
 
-.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a.fr-active {
+.fr-command.fr-btn
+  + .fr-dropdown-menu
+  .fr-dropdown-wrapper
+  .fr-dropdown-content
+  ul.fr-dropdown-list
+  li
+  a.fr-active {
   background: #f9fafb !important;
 }
 
@@ -786,7 +794,6 @@ button[aria-expanded="true"] {
     border-top: 1px solid var(--gray-200);
   }
 
-
   ul.p-listbox-list {
     padding: 6px;
 
@@ -882,7 +889,6 @@ button[aria-expanded="true"] {
   }
 }
 
-
 .hide-focus {
   &:not(.p-disabled) {
     &.p-focus {
@@ -895,13 +901,10 @@ button[aria-expanded="true"] {
     &:focus {
       box-shadow: var(--box-shadow-none);
       border: 1px solid var(--gray-300);
-
     }
   }
 }
 
-
-
 .sc_multiSelect_panel {
   .p-multiselect-items {
     padding: 4px !important;
@@ -965,10 +968,8 @@ button[aria-expanded="true"] {
     display: flex;
     align-items: center;
     justify-content: center;
-
   }
 
-
   .formulaSpanElm {
     font-size: 16px;
     margin: 2px 0;
@@ -1469,7 +1470,12 @@ div:has(ul.date_filter) .p-datepicker-group-container {
   border-left: 1px solid #dee2e6;
 }
 
-div:has(ul.date_filter) .p-datepicker-group-container .p-datepicker table td>span {
+div:has(ul.date_filter)
+  .p-datepicker-group-container
+  .p-datepicker
+  table
+  td
+  > span {
   width: 40px;
   height: 40px;
 }
@@ -1657,7 +1663,13 @@ button#formatOLOptions-1.fr-active::before {
   padding: 12px !important;
 }
 
-.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a.fr-active {
+.fr-command.fr-btn
+  + .fr-dropdown-menu
+  .fr-dropdown-wrapper
+  .fr-dropdown-content
+  ul.fr-dropdown-list
+  li
+  a.fr-active {
   background: #f9fafb !important;
 }
 
@@ -1824,7 +1836,6 @@ button[aria-expanded="true"] {
   }
 }
 
-
 .list_box_chips {
   display: inline-block;
   align-items: center;
@@ -1971,8 +1982,6 @@ button[aria-expanded="true"] {
   border-color: initial;
 }
 
-
-
 .ag-ltr .ag-cell {
   display: flex;
   align-items: center;
@@ -2080,12 +2089,12 @@ button[aria-expanded="true"] {
     }
   }
 
-.operator-type{
-  height: 44px !important;
-  display: flex;
-  justify-content: center;
-  align-items: center; 
-}
+  .operator-type {
+    height: 44px !important;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
 
   .condition-type {
     // width: 120px;
@@ -2115,7 +2124,7 @@ button[aria-expanded="true"] {
         border-top-left-radius: 0 !important;
         border-bottom-left-radius: 0 !important;
       }
-      .p-inputwrapper-filled{
+      .p-inputwrapper-filled {
         background: #ffffff !important;
       }
     }
@@ -2149,15 +2158,12 @@ button[aria-expanded="true"] {
   }
 }
 
-
-
-
 .filter-btn-grid {
   padding: 10px;
 }
 
 .table-filter-overlay {
-width: 51rem !important;
+  width: 51rem !important;
   &:after,
   &:before {
     margin-left: -12px !important;
@@ -2167,11 +2173,9 @@ width: 51rem !important;
 
   .p-overlaypanel-content {
     padding: 0;
-
   }
 }
 
-
 .icon-24x24 {
   width: 24px;
   height: 24px;
@@ -2182,7 +2186,6 @@ width: 51rem !important;
   height: 32px;
 }
 
-
 // loader styles
 .loader-wrapper {
   width: 60px;
@@ -2199,17 +2202,19 @@ width: 51rem !important;
   justify-content: center;
   align-items: center;
 
-
   /* HTML: <div class="loader"></div> */
   .loader-jobs {
     width: 35px;
     aspect-ratio: 1;
     border-radius: 50%;
-    background: radial-gradient(farthest-side, var(--primary-500) 94%, #0000) top/5px 5px no-repeat,
+    background: radial-gradient(farthest-side, var(--primary-500) 94%, #0000)
+        top/5px 5px no-repeat,
       conic-gradient(#0000 5%, var(--primary-500));
-    -webkit-mask: radial-gradient(farthest-side,
-        #0000 calc(100% - 5px),
-        #000 0);
+    -webkit-mask: radial-gradient(
+      farthest-side,
+      #0000 calc(100% - 5px),
+      #000 0
+    );
     animation: l13 1s infinite linear;
   }
 
@@ -2232,7 +2237,6 @@ width: 51rem !important;
       background-position: 70% 100%;
     }
   }
-
 }
 
 .loader-main {
@@ -2253,37 +2257,118 @@ width: 51rem !important;
   animation: prixClipFix 2s linear infinite;
 }
 
+.custom_grid_checkbox {
+  &.custom_grid_indeterminate {
+    .p-checkbox-box {
+      width: 20px;
+      height: 20px;
+      border-radius: 50%;
+      cursor: pointer;
+      position: absolute;
+      top: 0;
+      left: 0;
+      background: url("./assets/png/checkbox_minus_icon.png");
+      transition: background 0.3s;
+      border: 0;
+
+      &.p-highlight {
+        background: url("./assets/png/checkbox_minus_icon.png");
+
+        &:hover {
+          background: url("./assets/png/checkbox_minus_icon.png") transparent !important;
+        }
+
+        svg {
+          width: 0 !important;
+          height: 0 !important;
+        }
+      }
+    }
+  }
+  position: relative;
+  margin-right: 5px;
+
+  .p-checkbox-box {
+    width: 20px;
+    height: 20px;
+    border-radius: 50%;
+    cursor: pointer;
+    position: absolute;
+    top: 0;
+    left: 0;
+    background: url("./assets/png/checkbox_outline_icon.png");
+    transition: background 0.3s;
+    border: 0;
+
+    &:hover {
+      background: url("./assets/png/checkbox_outline_icon.png") transparent !important;
+      border: 0 !important;
+    }
+
+    &.p-highlight {
+      background: url("./assets/png/checkbox_fill_icon.png");
+
+      &:hover {
+        background: url("./assets/png/checkbox_fill_icon.png") transparent !important;
+      }
+
+      svg {
+        width: 0 !important;
+        height: 0 !important;
+      }
+    }
+  }
+}
+
+// .ag-grid-container {
+//   .ag-cell-wrapper {
+//     width: 100% !important;
+//     .ag-group-value {
+//       width: 100% !important;
+//     }
+//   }
+// }
+
+.ag-grid-container:has(.custom_class_name) {
+  .ag-cell-wrapper {
+    width: 100% !important;
+    .ag-group-value {
+      width: 100% !important;
+    }
+  }
+}
+
 @keyframes rotate {
   100% {
-    transform: rotate(360deg)
+    transform: rotate(360deg);
   }
 }
 
 @keyframes prixClipFix {
   0% {
-    clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)
+    clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);
   }
 
   25% {
-    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);
   }
 
   50% {
-    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
   }
 
   75% {
-    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);
   }
 
   100% {
-    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);
   }
 }
 
 .edited-record {
-  background-color:var(--primary-50);
+  background-color: var(--primary-50);
 }
 .non-editable {
   background-color: var(--gray-100);
-}
+}

package/dist/components/ag-grid/advancedFeature/hide-column.js

@@ -14,7 +14,7 @@ function HideColumn() {
     const { columnToRender, gridData, gridApi, updateColumnsForGrid, enableManageColumnsCallback, sidePanelText } = (0, react_1.useContext)(context_provider_1.FeatureContext);
     const [visibleRight, setVisibleRight] = (0, react_1.useState)(false);
     const [enableManageColumnsCallbackAPI, setEnableManageColumnsCallbackAPI] = (0, react_1.useState)(false);
-    const [inpValue, setInpValue] = (0, react_1.useState)("");
+    const [inpValue, setInputValue] = (0, react_1.useState)("");
     const [storeNodes, setStoreNodes] = (0, react_1.useState)();
     const [nodes, setNodes] = (0, react_1.useState)();
     const [hidePanelNodes, setHidePanelNodes] = (0, react_1.useState)([]);
@@ -53,7 +53,7 @@ function HideColumn() {
     };
     // Display search columns
     const searchHandler = (text) => {
-        setInpValue(text);
+        setInputValue(text);
         const searchedColumns = [];
         storeNodes.filter((column) => {
             var _a;
@@ -67,7 +67,7 @@ function HideColumn() {
     };
     const clearSearch = () => {
         setNodes(storeNodes);
-        setInpValue("");
+        setInputValue("");
     };
     // When radio button is switched
     const handleSwitchChange = (selectedColumn, value) => {
@@ -160,7 +160,11 @@ function HideColumn() {
             setStoreNodes(fixNodes);
         }
     }, [visibleRight]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setVisibleRight(true), text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", size: 20 }) }), (0, jsx_runtime_1.jsxs)(sidebar_1.Sidebar, Object.assign({ className: "md:w-6 lg:w-4 overflow-hidden p-4 h-full", visible: visibleRight, position: "right", onHide: () => setVisibleRight(false) }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "sticky top-0 z-5 bg-white" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between align-items-center py-2" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-gray-900 text-lg font-semibold line-height-3" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.header) || "Configure Columns" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { text: true, label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.disacrd_button) || "Discard", onClick: () => setVisibleRight(false) }), (0, jsx_runtime_1.jsx)(button_1.Button, { label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.update_button) || "Update", onClick: () => updateColumns() })] }))] })), enableManageColumnsCallback &&
+    const hidePanel = () => {
+        setVisibleRight(false);
+        setInputValue("");
+    };
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setVisibleRight(true), text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", size: 20 }) }), (0, jsx_runtime_1.jsxs)(sidebar_1.Sidebar, Object.assign({ className: "md:w-6 lg:w-4 overflow-hidden p-4 h-full", visible: visibleRight, position: "right", onHide: () => hidePanel() }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "sticky top-0 z-5 bg-white" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between align-items-center py-2" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-gray-900 text-lg font-semibold line-height-3" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.header) || "Configure Columns" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { text: true, label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.disacrd_button) || "Discard", onClick: () => hidePanel() }), (0, jsx_runtime_1.jsx)(button_1.Button, { label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.update_button) || "Update", onClick: () => updateColumns() })] }))] })), enableManageColumnsCallback &&
                                 (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: " p-2 my-2 border-round border-1  border-gray-300" }, { children: [(0, jsx_runtime_1.jsxs)("h3", Object.assign({ className: "flex align-items-center justify-content-between my-0" }, { children: [(sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.apply_to_all_views) || "Apply to all views", (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: enableManageColumnsCallbackAPI, onChange: (e) => setEnableManageColumnsCallbackAPI(e.value) })] })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0 text-sm" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.apply_subHeading) || "Apply the chosen column selection to all available views" }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md" }) })), (inpValue === null || inpValue === void 0 ? void 0 : inpValue.length) > 0 && (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer sc_icon_hover", onClick: clearSearch }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18 }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { id: "email", value: inpValue, onChange: (e) => {
                                                 searchHandler(e.target.value);
                                             }, disabled: false, placeholder: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.search_placeHolder) || "Search by column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full my-2" })] })) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "py-2 my-0 text-gray-900 text-lg font-semibold border-bottom-1 border-gray-200" }, { children: [(sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.selected_attributes) || "Selected Attributes", " ", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "text-gray-500 text-sm" }, { children: [nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.selected).length, "/", nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.unSelected || node.selected).length] }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "w-full" }, { children: (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 ?

package/dist/components/ag-grid/grid-checkbox.js

@@ -4,7 +4,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const checkbox_1 = require("primereact/checkbox");
 const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
-const GridCheckBOx = ({ checked, onChange, isIndeterminate }) => {
-    return ((0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { icon: isIndeterminate && (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus", color: "#111c5b" }), onChange: onChange, checked: checked, className: "" }));
+const GridCheckBOx = ({ checked, onChange, isIndeterminate, shouldRenderOnRight }) => {
+    return ((0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { icon: isIndeterminate && (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus", color: "#111c5b" }), onChange: onChange, checked: checked, className: `${shouldRenderOnRight ? "custom_grid_checkbox" : ""} ${isIndeterminate ? "custom_grid_indeterminate" : ""}` }));
 };
 exports.default = GridCheckBOx;

package/dist/components/ag-grid/helper.js

@@ -79,14 +79,14 @@ const updateCells = (updatedRowData, setUpdateRowData, api) => {
 };
 exports.updateCells = updateCells;
 // Fill data in grid through drag 
-const fillOperation = (params, api, parentNode, editedRecords, setEditedRecords) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
-    var _a, _b, _c, _d;
+const fillOperation = (params, api, editedRecords, setEditedRecords) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+    var _a, _b, _c, _d, _e, _f, _g;
     const { finalRange } = params;
     const { startRow, endRow, columns,
     // startColumn 
      } = finalRange;
     const columnDetails = columns[0].colDef;
-    const parentRowData = parentNode === null || parentNode === void 0 ? void 0 : parentNode.data;
+    const parentRowData = (_c = api.getDisplayedRowAtIndex((_b = (_a = params === null || params === void 0 ? void 0 : params.initialRange) === null || _a === void 0 ? void 0 : _a.startRow) === null || _b === void 0 ? void 0 : _b.rowIndex)) === null || _c === void 0 ? void 0 : _c.data;
     // Get current updated rows
     const currentUpdatedRows = [];
     // Collect all selected rows
@@ -97,12 +97,12 @@ const fillOperation = (params, api, parentNode, editedRecords, setEditedRecords)
             continue; // Skip if rowNode is undefined
         const rowData = rowNode === null || rowNode === void 0 ? void 0 : rowNode.data;
         // Check if rowData exists and update the field
-        if (rowData && (rowNode.id != parentRowData.id)) {
+        if (rowData && (rowNode.id != (parentRowData === null || parentRowData === void 0 ? void 0 : parentRowData.id))) {
             // Skip edit for same values
             if ((rowData === null || rowData === void 0 ? void 0 : rowData[columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.field]) === (parentRowData === null || parentRowData === void 0 ? void 0 : parentRowData[columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.field]))
                 continue;
             // If Dragged cell is grouped only group headers should edit vice versa to child cells 
-            if (((_a = rowData === null || rowData === void 0 ? void 0 : rowData.orgHierarchy) === null || _a === void 0 ? void 0 : _a.length) !== ((_b = parentRowData === null || parentRowData === void 0 ? void 0 : parentRowData.orgHierarchy) === null || _b === void 0 ? void 0 : _b.length))
+            if (((_d = rowData === null || rowData === void 0 ? void 0 : rowData.orgHierarchy) === null || _d === void 0 ? void 0 : _d.length) !== ((_e = parentRowData === null || parentRowData === void 0 ? void 0 : parentRowData.orgHierarchy) === null || _e === void 0 ? void 0 : _e.length))
                 continue;
             // if( rowData?.[columnDetails?.field] == EMPTY_RECORD || rowData?.type !== parentRowData?.type || !rowData?.[columnDetails?.field] ){
             //   continue
@@ -120,8 +120,8 @@ const fillOperation = (params, api, parentNode, editedRecords, setEditedRecords)
                 field: [],
                 isCustomAttribute: columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.isCustomAttribute
             };
-            if (!((_c = schemaForEdit === null || schemaForEdit === void 0 ? void 0 : schemaForEdit.field) === null || _c === void 0 ? void 0 : _c.includes(columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.field))) {
-                (_d = schemaForEdit === null || schemaForEdit === void 0 ? void 0 : schemaForEdit.field) === null || _d === void 0 ? void 0 : _d.push(columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.field);
+            if (!((_f = schemaForEdit === null || schemaForEdit === void 0 ? void 0 : schemaForEdit.field) === null || _f === void 0 ? void 0 : _f.includes(columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.field))) {
+                (_g = schemaForEdit === null || schemaForEdit === void 0 ? void 0 : schemaForEdit.field) === null || _g === void 0 ? void 0 : _g.push(columnDetails === null || columnDetails === void 0 ? void 0 : columnDetails.field);
             }
             currentUpdatedRows.push(schemaForEdit);
             // Update the row

package/dist/components/ag-grid/parent-for-grid.js

@@ -22,7 +22,6 @@ function ParentForGrid(props) {
     const [api, setApi] = (0, react_1.useState)(null);
     const [totalRecords, setTotalRecords] = (0, react_1.useState)(0);
     const [gridReadyEvent, setGridReadyEvent] = (0, react_1.useState)();
-    const [initalDragRowData, setInitialDragRowData] = (0, react_1.useState)();
     const [defaultFilters, setDefaultFilters] = (0, react_1.useState)((props === null || props === void 0 ? void 0 : props.defaultFilters) || []);
     const [emptyResponse] = (0, react_1.useState)({
         totalRecords: 0,
@@ -106,20 +105,22 @@ function ParentForGrid(props) {
     };
     // JSX for rendering checkbox in header
     const headerCheckBoxRenderer = (headerDisplayName, HeaderComponent) => {
-        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center " }, { children: [(0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: featureDetails.checkBoxSelection.allBoxChecked, onChange: handleHeaderCheckbox, isIndeterminate: featureDetails.checkBoxSelection.isIndeterminate }), HeaderComponent ? (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "px-3" }, { children: [" ", (0, jsx_runtime_1.jsx)(HeaderComponent, {}), "  "] })) : (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "px-3" }, { children: headerDisplayName }))] })));
+        var _a, _b, _c, _d;
+        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `flex align-items-center justify-content-between ${((_a = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _a === void 0 ? void 0 : _a.displayCheckboxOnRight) ? "w-full" : ""}` }, { children: ((_b = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _b === void 0 ? void 0 : _b.displayCheckboxOnRight) ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `flex align-items-center justify-content-between w-full ` }, { children: [HeaderComponent ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: " mr-auto" }, { children: [" ", (0, jsx_runtime_1.jsx)(HeaderComponent, {}), " "] }))) : ((0, jsx_runtime_1.jsx)("span", { children: headerDisplayName })), (0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: featureDetails.checkBoxSelection.allBoxChecked, onChange: handleHeaderCheckbox, isIndeterminate: featureDetails.checkBoxSelection.isIndeterminate, shouldRenderOnRight: (_c = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _c === void 0 ? void 0 : _c.displayCheckboxOnRight })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: featureDetails.checkBoxSelection.allBoxChecked, onChange: handleHeaderCheckbox, isIndeterminate: featureDetails.checkBoxSelection.isIndeterminate, shouldRenderOnRight: (_d = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _d === void 0 ? void 0 : _d.displayCheckboxOnRight }), HeaderComponent ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "px-3" }, { children: [" ", (0, jsx_runtime_1.jsx)(HeaderComponent, {}), " "] }))) : ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "px-3" }, { children: headerDisplayName })))] })) })));
     };
     // JSX for rendering checkbox in cells
     const cellCheckBoxRenderer = (params) => {
+        var _a;
         const { data } = params;
         // const { allBoxChecked, excludedRecords, includedRecords } = featureDetails.checkBoxSelection;
         const isChecked = (0, helper_1.getCheckedStatus)(data, featureDetails, constants_1.GRID_CHECKBOX_STATUS, setFeatureDetails);
-        return ((0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: isChecked, onChange: () => handleCheckboxClick(data), isIndeterminate: false }));
+        return ((0, jsx_runtime_1.jsx)(grid_checkbox_1.default, { checked: isChecked, onChange: () => handleCheckboxClick(data), isIndeterminate: false, shouldRenderOnRight: (_a = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _a === void 0 ? void 0 : _a.displayCheckboxOnRight }));
     };
     // Render checkbox as well as initial component/data from props
     const dataCellRenderer = (cellRendererParams, column) => {
-        var _a;
+        var _a, _b, _c;
         const { initialRenderer, cellCheckBoxRenderer } = cellRendererParams;
-        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "pr-3 flex align-items-center" }, { children: cellCheckBoxRenderer(cellRendererParams) })), typeof initialRenderer === "function" ? (initialRenderer(cellRendererParams)) : ((0, jsx_runtime_1.jsx)("div", { children: (_a = cellRendererParams === null || cellRendererParams === void 0 ? void 0 : cellRendererParams.data) === null || _a === void 0 ? void 0 : _a[column === null || column === void 0 ? void 0 : column.field] }))] })));
+        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex  w-full" }, { children: ((_a = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _a === void 0 ? void 0 : _a.displayCheckboxOnRight) ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "custom_class_name flex w-full justify-content-between" }, { children: [typeof initialRenderer === "function" ? (initialRenderer(cellRendererParams)) : ((0, jsx_runtime_1.jsx)("div", { children: (_b = cellRendererParams === null || cellRendererParams === void 0 ? void 0 : cellRendererParams.data) === null || _b === void 0 ? void 0 : _b[column === null || column === void 0 ? void 0 : column.field] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center" }, { children: cellCheckBoxRenderer(cellRendererParams) }))] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center " }, { children: cellCheckBoxRenderer(cellRendererParams) })), typeof initialRenderer === "function" ? (initialRenderer(cellRendererParams)) : ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "px-3" }, { children: (_c = cellRendererParams === null || cellRendererParams === void 0 ? void 0 : cellRendererParams.data) === null || _c === void 0 ? void 0 : _c[column === null || column === void 0 ? void 0 : column.field] })))] })) })));
     };
     // Callback to products for getting data
     const getData = (startRow, endRow, currentFeatures, params) => tslib_1.__awaiter(this, void 0, void 0, function* () {
@@ -206,15 +207,9 @@ function ParentForGrid(props) {
     });
     // Specify unique id for every row for grid
     const getRowId = (prams) => prams.data.id;
-    // Get the direction of selected range
-    const onCellMouseDown = (event) => {
-        if (event.colDef.suppressFillHandle)
-            return;
-        setInitialDragRowData(event.node);
-    };
     // Update cell from front end and give a call back to products
     const wrapperToFillOpertation = (params) => {
-        (0, helper_1.fillOperation)(params, api, initalDragRowData, props === null || props === void 0 ? void 0 : props.editedRecords, props === null || props === void 0 ? void 0 : props.setEditedRecords);
+        (0, helper_1.fillOperation)(params, api, props === null || props === void 0 ? void 0 : props.editedRecords, props === null || props === void 0 ? void 0 : props.setEditedRecords);
     };
     // Operation on fill handle
     const myOpertaion = (fillOperationParams) => {
@@ -224,7 +219,6 @@ function ParentForGrid(props) {
     const getDataPath = (0, react_1.useCallback)((data) => {
         return data.orgHierarchy;
     }, []);
-    console.log(onCellMouseDown, wrapperToFillOpertation, myOpertaion);
     // Options that grid should have
     const gridOptions = {
         columnDefs: gridData.columnData.map((column) => {
@@ -246,6 +240,7 @@ function ParentForGrid(props) {
         suppressMenuHide: false,
         rowSelection: "multiple",
         suppressRowClickSelection: true,
+        headerHeight: props === null || props === void 0 ? void 0 : props.columnHeaderHeight,
         rowHeight: constants_1.ROW_HEIGHT,
         rowModelType: props.rowModelType,
         pinnedTopRowData: props === null || props === void 0 ? void 0 : props.pinnedTopRowData,
@@ -261,7 +256,6 @@ function ParentForGrid(props) {
         enableFillHandle: (_b = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _b === void 0 ? void 0 : _b.enableFillHandle,
         onFillEnd: wrapperToFillOpertation,
         fillOperation: myOpertaion,
-        onCellMouseDown: onCellMouseDown,
         getRowId: getRowId,
         fillHandleDirection: 'y'
     };

package/dist/types/components/ag-grid/Types.d.ts

@@ -94,6 +94,7 @@ export interface ConditionsToDisplay {
     displaySaveEditButton?: boolean;
     displayEditHeading?: boolean;
     displayFeaturesHeader?: boolean;
+    displayCheckboxOnRight?: boolean;
 }
 export interface PropsFromProduct {
     columnData: ColumnDef[];
@@ -130,6 +131,7 @@ export interface PropsFromProduct {
     GroupHeaderComponent?: React.FC;
     enableCheckboxForGroupHeader?: boolean;
     ChildComponentForGroup?: React.FC;
+    columnHeaderHeight?: number;
 }
 export interface ResoponseFromCallback {
     totalRecords: number;

package/dist/types/components/ag-grid/grid-checkbox.d.ts

@@ -3,6 +3,7 @@ interface CheckboxProps {
     checked: boolean;
     onChange: () => void;
     isIndeterminate: boolean;
+    shouldRenderOnRight: boolean;
 }
 declare const GridCheckBOx: React.FC<CheckboxProps>;
 export default GridCheckBOx;

package/dist/types/components/ag-grid/helper.d.ts

@@ -3,7 +3,7 @@ export declare const parseIfNeeded: (value: any) => any;
 export declare const sortColumns: (columns: any) => any;
 export declare const getCheckedStatus: (row: any, featureDetails: any, GRID_CHECKBOX_STATUS: any, setFeatureDetails: any) => any;
 export declare const updateCells: (updatedRowData: any, setUpdateRowData: any, api: any) => void;
-export declare const fillOperation: (params: any, api: any, parentNode: any, editedRecords: any, setEditedRecords: any) => Promise<void>;
+export declare const fillOperation: (params: any, api: any, editedRecords: any, setEditedRecords: any) => Promise<void>;
 export declare const autoGroupColumnDef: (isTreeEnable: any, headerName: any, groupField: any, GroupHeaderComponent: any, headerCheckboxRenderer: any, enableCheckboxForGroupHeader: any, ChildRendererForGroup: any) => {
     headerName: any;
     minWidth: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sccoreui",
-  "version": "6.1.58", 
+  "version": "6.1.60", 
   "description": "ui-sccore",
   "main": "./dist/index.js",
   "module": "./dist/index.js",