sccoreui 5.7.6 → 5.7.7

package/dist/App.scss

@@ -4,6 +4,9 @@
 @import url("./assets/flex.css");
 @import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');
 
+
+// variables
+
 @font-face {
   font-family: 'RobotoBold';
   src: url('./assets/fonts/Roboto-Bold.ttf') format('truetype');

package/dist/assets/sccoreui.css

@@ -1051,7 +1051,7 @@ a {
   width: 3rem;
   display: flex;
   align-items: center;
-  justify-content: center;
+  /* justify-content: center; */
 }
 
 .p-dropdown .p-dropdown-label.p-placeholder {

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

@@ -12,6 +12,6 @@ const infinite_row_model_1 = require("@ag-grid-community/infinite-row-model");
 core_1.ModuleRegistry.registerModules([client_side_row_model_1.ClientSideRowModelModule, range_selection_1.RangeSelectionModule, infinite_row_model_1.InfiniteRowModelModule]);
 core_2.LicenseManager.setLicenseKey("Using_this_{AG_Grid}_Enterprise_key_{AG-056800}_in_excess_of_the_licence_granted_is_not_permitted___Please_report_misuse_to_legal@ag-grid.com___For_help_with_changing_this_key_please_contact_info@ag-grid.com___{Sellers_Commerce_LLC}_is_granted_a_{Single_Application}_Developer_License_for_the_application_{SellersCommerce}_only_for_{2}_Front-End_JavaScript_developers___All_Front-End_JavaScript_developers_working_on_{SellersCommerce}_need_to_be_licensed___{SellersCommerce}_has_been_granted_a_Deployment_License_Add-on_for_{1}_Production_Environment___This_key_works_with_{AG_Grid}_Enterprise_versions_released_before_{14_April_2025}____[v3]_[01]_MTc0NDU4NTIwMDAwMA==895f2234e1659afcfba586110daf0549");
 const AgGrid = ({ style, gridOptions, onGridReady }) => {
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "ag-theme-quartz ", style: { height: style.height, width: style.width } }, { children: (0, jsx_runtime_1.jsx)(react_1.AgGridReact, Object.assign({ onGridReady: onGridReady }, gridOptions)) })) }) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "ag-theme-quartz ", style: { height: style.height, width: style.width } }, { children: (0, jsx_runtime_1.jsx)(react_1.AgGridReact, Object.assign({ onGridReady: onGridReady, reactiveCustomComponents: true }, gridOptions)) })) }) }));
 };
 exports.default = AgGrid;

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

@@ -17,15 +17,11 @@ function ParentForGrid(props) {
     const [featureDetails, setFeatureDetails] = (0, react_1.useState)({
         searchedText: "",
         filterQueries: [],
-        sort: {
-            isSortable: false,
-            columnToSort: "",
-            orderToSort: "",
-        },
-        bulkAction: {
-            columnData: {},
-            updatedValue: "",
-        },
+        sort: {}
+        // bulkAction: {
+        //   columnData: {},
+        //   updatedValue: "",
+        // },
     });
     const defaultColDef = (0, react_1.useMemo)(() => {
         return {
@@ -38,8 +34,7 @@ function ParentForGrid(props) {
     }, []);
     // Callback to products for getting data
     const getData = (startRow, endRow) => tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const response = (yield props.getRowData(startRow, endRow)) || [];
-        console.log(response.length, 'length of data');
+        const response = (yield props.getRowData(startRow, endRow, featureDetails)) || [];
         return response.rowData;
     });
     // Gets call onLoad,scroll and whenever any featureDetails changed
@@ -84,11 +79,15 @@ function ParentForGrid(props) {
         rowHeight: 60,
         rowModelType: "infinite", // Infinite scroll
     };
+    // Fucntion to call the grid
+    const callGrid = () => {
+        onGridReady(gridReadyEvent);
+    };
     (0, react_1.useEffect)(() => {
         if (api && gridReadyEvent) {
-            onGridReady(gridReadyEvent);
+            callGrid();
         }
-    }, [featureDetails]);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: { height: style.height, width: style.width } }, { children: [(0, jsx_runtime_1.jsx)(advanced_feature_1.default, { featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, columnData: gridData.columnData, checkedRow: checkedRow, props: props }), (0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: style, gridOptions: gridOptions, onGridReady: onGridReady })] })));
+    }, [featureDetails.searchedText]);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ style: { height: style.height, width: style.width } }, { children: [(0, jsx_runtime_1.jsx)(advanced_feature_1.default, { featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, columnData: gridData.columnData, checkedRow: checkedRow, props: props, callGrid: callGrid }), (0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: style, gridOptions: gridOptions, onGridReady: onGridReady })] })));
 }
 exports.default = ParentForGrid;

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

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const RowDetailsRenderer = ({ node }) => {
+    const data = node === null || node === void 0 ? void 0 : node.data;
+    console.log(data, node, 'details from node');
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("div", { children: [data.gold, " "] }) }));
+};
+exports.default = RowDetailsRenderer;

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

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const primereact_1 = require("primereact");
+const react_1 = require("react");
+function StatusDropdown({ value, statusChanged }) {
+    let options;
+    if (value === 1) {
+        options = [
+            { id: 1, name: "Draft", value: 1 },
+            { id: 2, name: "Active", value: 2 },
+            { id: 3, name: "Inactive", value: 3 },
+        ];
+    }
+    else {
+        options = [
+            { id: 2, name: "Active", value: 2 },
+            { id: 3, name: "Inactive", value: 3 },
+        ];
+    }
+    const selectedOption = (0, react_1.useMemo)(() => options.find((option) => option.value === value), [value]);
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [" ", (0, jsx_runtime_1.jsx)(primereact_1.Dropdown, { value: selectedOption.value, options: options, onChange: (e) => { statusChanged(e.target.value), console.log(e, 'value selected'); }, optionLabel: "name", placeholder: "Select a Status" })] }));
+}
+exports.default = StatusDropdown;

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

@@ -1,12 +1,26 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var columnDatatype;
-(function (columnDatatype) {
-    columnDatatype[columnDatatype["STRING"] = 0] = "STRING";
-    columnDatatype[columnDatatype["NUMBER"] = 1] = "NUMBER";
-    columnDatatype[columnDatatype["BOOLEAN"] = 2] = "BOOLEAN";
-    columnDatatype[columnDatatype["SELECT"] = 4] = "SELECT";
-    columnDatatype[columnDatatype["CHECKBOX"] = 5] = "CHECKBOX";
-    columnDatatype[columnDatatype["MULTISELECT"] = 6] = "MULTISELECT";
-})(columnDatatype || (columnDatatype = {}));
+exports.ATTRIBUTEDATATYPES = void 0;
+// enum columnDatatype  {
+//   STRING=0,
+//   NUMBER=1,
+//   BOOLEAN=2,
+//   SELECT=4,
+//   CHECKBOX=5,
+//   MULTISELECT=6
+// }
+var ATTRIBUTEDATATYPES;
+(function (ATTRIBUTEDATATYPES) {
+    ATTRIBUTEDATATYPES["STRING"] = "string";
+    ATTRIBUTEDATATYPES["DATE"] = "date";
+    ATTRIBUTEDATATYPES["INTEGER"] = "integer";
+    ATTRIBUTEDATATYPES["IMAGE"] = "image";
+    ATTRIBUTEDATATYPES["PRICE"] = "price";
+    ATTRIBUTEDATATYPES["BOOLEAN"] = "boolean";
+    ATTRIBUTEDATATYPES["DATE_AND_TIME"] = "dateandtime";
+    ATTRIBUTEDATATYPES["DECIMAL"] = "decimal";
+    ATTRIBUTEDATATYPES["PERCENT"] = "percent";
+    ATTRIBUTEDATATYPES["SELECT"] = "select";
+    ATTRIBUTEDATATYPES["MULTI_SELECT"] = "multiselect";
+})(ATTRIBUTEDATATYPES = exports.ATTRIBUTEDATATYPES || (exports.ATTRIBUTEDATATYPES = {}));
 // export type {  ColDef as gridColType} from "@ag-grid-community/core"

package/dist/components/ag-grid/advancedFeature/advanced-feature.js

@@ -7,8 +7,7 @@ const custom_sort_1 = tslib_1.__importDefault(require("./custom-sort"));
 const record_detail_1 = tslib_1.__importDefault(require("./record-detail"));
 const bulk_actions_1 = tslib_1.__importDefault(require("./bulkActions/bulk-actions"));
 const filter_1 = tslib_1.__importDefault(require("./filter/filter"));
-function AdvancedFeatures({ featureDetails, setFeatureDetails, columnData, checkedRow, props }) {
-    console.log(columnData, setFeatureDetails, 'column data in advanced feature');
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex" }, { children: [(0, jsx_runtime_1.jsx)(global_search_1.default, { featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder }), (0, jsx_runtime_1.jsx)(filter_1.default, {})] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex " }, { children: [checkedRow.length > 1 && (0, jsx_runtime_1.jsx)(bulk_actions_1.default, { columnData: columnData }), (0, jsx_runtime_1.jsx)(custom_sort_1.default, { columnData: columnData, featureDetails: featureDetails, setFeatureDetails: setFeatureDetails }), (0, jsx_runtime_1.jsx)(record_detail_1.default, { totalLength: (props === null || props === void 0 ? void 0 : props.totalRowLength) || 100 })] }))] })));
+function AdvancedFeatures({ featureDetails, setFeatureDetails, columnData, checkedRow, props, callGrid }) {
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex" }, { children: [(0, jsx_runtime_1.jsx)(global_search_1.default, { featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder }), (0, jsx_runtime_1.jsx)(filter_1.default, { columnData: columnData, featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, callBackForSelect: props === null || props === void 0 ? void 0 : props.myInputData, callGrid: callGrid })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex " }, { children: [checkedRow.length > 1 && (0, jsx_runtime_1.jsx)(bulk_actions_1.default, { columnData: columnData }), (0, jsx_runtime_1.jsx)(custom_sort_1.default, { columnData: columnData, featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, callGrid: callGrid }), (0, jsx_runtime_1.jsx)(record_detail_1.default, { totalLength: (props === null || props === void 0 ? void 0 : props.totalRowLength) || 100 })] }))] })));
 }
 exports.default = AdvancedFeatures;

package/dist/components/ag-grid/advancedFeature/bulk-actions.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
+const overlaypanel_1 = require("primereact/overlaypanel");
+const react_1 = require("react");
+function BulkActions({ columnData }) {
+    var _a;
+    const [activeOption, setActiveOption] = (0, react_1.useState)({});
+    const [bulkOptions, setBulkOptions] = (0, react_1.useState)([]);
+    const actionRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        getColumnsToEdit();
+    }, []);
+    const getColumnsToEdit = () => {
+        const columns = [];
+        columnData.filter((col) => {
+            if (col.editable) {
+                columns.push(col);
+            }
+        });
+        setBulkOptions(columns);
+    };
+    console.log(columnData, 'column data in bulk action');
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'cursor-pointer p-1 sc_icon_hover', onClick: (e) => actionRef.current.toggle(e) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "settings-01", size: 20 }) })), (0, jsx_runtime_1.jsx)(overlaypanel_1.OverlayPanel, Object.assign({ ref: actionRef, className: "w-30rem pb-5" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "relative pb-5 mb-5" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center justify-content-between p-4 border-bottom-1 border-gray-200" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-4  text-gray-900" }, { children: "Bulk Actions " })) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex border-bottom-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: " border-right-1 px-1 py-4 border-gray-200" }, { children: bulkOptions.map((option, index) => {
+                                        {
+                                            console.log(option, 'option data in map');
+                                        }
+                                        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `text-lg px-3 border-round-lg cursor-pointer font-medium line-height-4 text-gray-600 ${(activeOption === null || activeOption === void 0 ? void 0 : activeOption.field) === (option === null || option === void 0 ? void 0 : option.field) ? "bg-primary-50" : ""}`, onClick: () => setActiveOption(option) }, { children: option.headerName }), index));
+                                    }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 w-full" }, { children: (_a = bulkOptions.find((optons) => optons.id === activeOption.id)) === null || _a === void 0 ? void 0 : _a.content }))] }))] })) }))] }));
+}
+exports.default = BulkActions;

package/dist/components/ag-grid/advancedFeature/bulkActions/bulk-actions.js

@@ -6,6 +6,8 @@ const svg_component_1 = tslib_1.__importDefault(require("../../../../directives/
 const overlaypanel_1 = require("primereact/overlaypanel");
 const react_1 = require("react");
 const input_box_1 = tslib_1.__importDefault(require("./input-box"));
+require("./bulk-actions.scss");
+const button_1 = tslib_1.__importDefault(require("../../../button/button"));
 function BulkActions({ columnData }) {
     const [activeOption, setActiveOption] = (0, react_1.useState)({});
     const [bulkOptions, setBulkOptions] = (0, react_1.useState)([]);
@@ -22,12 +24,22 @@ function BulkActions({ columnData }) {
         });
         setBulkOptions(columns);
     };
-    console.log(columnData, activeOption, 'column data in bulk action');
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'cursor-pointer p-1 sc_icon_hover', onClick: (e) => actionRef.current.toggle(e) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "settings-01", size: 20 }) })), (0, jsx_runtime_1.jsx)(overlaypanel_1.OverlayPanel, Object.assign({ ref: actionRef, className: "w-30rem pb-5" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "relative pb-5 mb-5" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center justify-content-between p-4 border-bottom-1 border-gray-200" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-4  text-gray-900" }, { children: "Bulk Actions " })) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex border-bottom-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: " border-right-1 px-1 py-4 border-gray-200" }, { children: bulkOptions.map((option, index) => {
-                                        {
-                                            console.log(option, 'option data in map');
-                                        }
-                                        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: `text-lg px-3 border-round-lg cursor-pointer font-medium line-height-4 text-gray-600 ${(activeOption === null || activeOption === void 0 ? void 0 : activeOption.field) === (option === null || option === void 0 ? void 0 : option.field) ? "bg-primary-50" : ""}`, onClick: () => setActiveOption(option) }, { children: option.headerName }), index));
-                                    }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 w-full" }, { children: (0, jsx_runtime_1.jsx)(input_box_1.default, { activeOption: activeOption }) }))] }))] })) }))] }));
+    console.log(columnData, activeOption, "column data in bulk action");
+    const BulkActionHeader = (props) => {
+        const { header: { label } } = props;
+        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center justify-content-between p-4 border-bottom-1 border-gray-200" }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-lg font-semibold line-height-4  text-gray-900" }, { children: label })) })));
+    };
+    const BulkActionFooter = (props) => {
+        const { footer: { totalRecords, discardLabel, assignLabel } } = props;
+        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between border-top-1 border-gray-200 p-4" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-900" }, { children: totalRecords })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.default, { text: true, className: "h-auto p-0", label: discardLabel }), (0, jsx_runtime_1.jsx)(button_1.default, { label: assignLabel })] }))] })));
+    };
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "cursor-pointer p-1 sc_icon_hover", onClick: (e) => actionRef.current.toggle(e) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "settings-01", size: 20 }) })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: actionRef, className: "w-30rem bulk-action-feature" }, { children: [(0, jsx_runtime_1.jsx)(BulkActionHeader, { header: { label: "Bulk Actions" } }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex border-bottom-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: " border-right-1 p-1 border-gray-200 min-w-max flex flex-column pb-0" }, { children: bulkOptions.map((option, index) => {
+                                    {
+                                        console.log(option, "option data in map");
+                                    }
+                                    return ((0, jsx_runtime_1.jsx)(button_1.default, Object.assign({ text: activeOption ? true : false, className: `text-lg px-3 focus:shadow-none border-round-lg mb-1 cursor-pointer font-medium p-button-secondary line-height-4 text-gray-600 ${(activeOption === null || activeOption === void 0 ? void 0 : activeOption.field) === (option === null || option === void 0 ? void 0 : option.field)
+                                            ? "bg-primary-50"
+                                            : ""}`, onClick: () => setActiveOption(option) }, { children: option.headerName }), index));
+                                }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-6 w-full" }, { children: (0, jsx_runtime_1.jsx)(input_box_1.default, { activeOption: activeOption }) }))] })), (0, jsx_runtime_1.jsx)(BulkActionFooter, { footer: { totalRecords: "204 Total Records", discardLabel: "Discard", assignLabel: "Assign" } })] }))] }));
 }
 exports.default = BulkActions;

package/dist/components/ag-grid/advancedFeature/bulkActions/input-box.js

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 // import { Button } from "primereact/button"
-const button_1 = require("primereact/button");
+// import { Button } from "primereact/button"
 const inputtext_1 = require("primereact/inputtext");
 function BoxOfInput({ activeOption }) {
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: " text-gray-900 flex lext-lg font-semibold line-height-4 mb-1 align-items-center" }, { children: ["Change ", activeOption.headerName] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { type: "text", className: "p-inputtext-lg `w-full`", placeholder: activeOption.headerName }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `flex bg-white gap-2 pl-2 pr-2 justify-content-between align-items-center mt-3  absolute ` }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "text-black font-normal text-base line-height-3" }, { children: " Records selected" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex gap-2" }, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { outlined: true, text: true, label: "Discard" }) }))] }))] }) })
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "w-full" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: " text-gray-900 flex lext-lg font-semibold line-height-4 mb-1 align-items-center" }, { children: ["Change ", activeOption.headerName] })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { type: "text", className: "w-full", placeholder: activeOption.headerName }), (0, jsx_runtime_1.jsx)("div", { className: `flex bg-white gap-2 pl-2 pr-2 justify-content-between align-items-center mt-3  absolute ` })] })) })
     // <div>
     //         <div className=" text-gray-900 flex lext-lg font-semibold line-height-4 mb-1 align-items-center">Change Status</div>
     //         {/* <Dropdown

package/dist/components/ag-grid/advancedFeature/custom-sort.js

@@ -9,38 +9,63 @@ const radiobutton_1 = require("primereact/radiobutton");
 const button_1 = require("primereact/button");
 const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
 const constants_1 = require("../constants");
-function Sort({ columnData, featureDetails, setFeatureDetails }) {
+function Sort({ columnData, featureDetails, setFeatureDetails, callGrid }) {
     var _a;
-    const [sortValue, setSortValue] = (0, react_1.useState)(null);
-    const [sortBy, setSortBy] = (0, react_1.useState)(null);
+    const [sortValue, setSortValue] = (0, react_1.useState)();
+    const [sortBy, setSortBy] = (0, react_1.useState)({});
     const [isOverlayOpened, setIsOverlayOpened] = (0, react_1.useState)(false);
     const showShort = (0, react_1.useRef)(null);
     const shortType = sortValue === null || sortValue === void 0 ? void 0 : sortValue.dataType;
     const disableApply = (sortBy && sortValue) === null;
-    const onClickShort = (event) => {
+    const onClickSort = (event) => {
         showShort.current.toggle(event);
     };
     // Add selected row to state
-    const onSelectShortValue = (eachColumn) => {
+    const onSelectSortValue = (eachColumn) => {
         if (eachColumn.headerName !== (sortValue === null || sortValue === void 0 ? void 0 : sortValue.headerName)) {
+            const sortDetails = {
+                isSortable: false,
+                columnToSort: eachColumn,
+                orderToSort: sortBy,
+            };
+            if ((Object === null || Object === void 0 ? void 0 : Object.keys(sortBy).length) > 0) {
+                sortDetails.isSortable = true;
+            }
+            addSortDetails(sortDetails);
             setSortValue(eachColumn);
-            setSortBy(null);
+            // setSortBy();
         }
     };
-    // Trigger action to apply
-    const applyTableSort = (e) => {
+    const onSelectSortType = (column) => {
         const sortDetails = {
-            isSortable: true,
-            columnToSort: sortValue.field,
-            orderToSort: sortBy,
+            isSortable: false,
+            columnToSort: sortValue,
+            orderToSort: column,
         };
-        console.log(sortBy, 'sort by on apply filter');
+        if ((Object === null || Object === void 0 ? void 0 : Object.keys(sortValue).length) > 0) {
+            sortDetails.isSortable = true;
+        }
+        addSortDetails(sortDetails);
+        setSortBy(column);
+    };
+    // Add sort details to parent component state
+    const addSortDetails = (sortDetails) => {
+        if (!((sortDetails === null || sortDetails === void 0 ? void 0 : sortDetails.isSortable) &&
+            (sortDetails === null || sortDetails === void 0 ? void 0 : sortDetails.columnToSort) &&
+            (sortDetails === null || sortDetails === void 0 ? void 0 : sortDetails.orderToSort))) {
+            return;
+        }
         setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { sort: sortDetails }));
-        onClickShort(e);
+    };
+    // Trigger action to apply
+    const applyTableSort = (e) => {
+        callGrid();
+        onClickSort(e);
+        // clearSort(e)
     };
     // Trigger action to clear
     const clearSort = (e) => {
-        onClickShort(e);
+        onClickSort(e);
         setSortBy(null);
         setSortValue(null);
         const sortDetails = {
@@ -52,21 +77,21 @@ function Sort({ columnData, featureDetails, setFeatureDetails }) {
     };
     return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `cursor-pointer p-1 sc_icon_hover flex align-items-center border-round-lg ${isOverlayOpened || featureDetails.sort.isSortable
                     ? "bg-primary-50"
-                    : ""}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 px-1" }, { children: ` Selected` }))), (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: (event) => onClickShort(event) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "switch-vertical-02", size: 20, color: isOverlayOpened || featureDetails.sort.isSortable
+                    : ""}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 px-1" }, { children: ` Selected` }))), (0, jsx_runtime_1.jsx)("span", Object.assign({ onClick: (event) => onClickSort(event) }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "switch-vertical-02", size: 20, color: isOverlayOpened || featureDetails.sort.isSortable
                                 ? "#243DC6"
                                 : "#667085" }) }))] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showShort, onShow: () => setIsOverlayOpened(true), onHide: () => setIsOverlayOpened(false), className: "w-18rem mt-2" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 text-lg font-semibold  line-height-3 text-gray-900" }, { children: "Column Sorting" })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "m-0" }), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "pl-0 m-1 h-10rem overflow-auto" }, { children: columnData === null || columnData === void 0 ? void 0 : columnData.map((eachColumn, index) => {
                             if (eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.isSortable) {
                                 const isSelected = eachColumn.field === (sortValue === null || sortValue === void 0 ? void 0 : sortValue.field);
-                                return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: `${isSelected && "bg-primary-25"} cursor-pointer border-round-md flex align-items-center gap-2 px-3 py-2 text-base line-height-2 text-gray-700`, style: { listStyleType: "none" }, onClick: () => onSelectShortValue(eachColumn) }, { children: [(0, jsx_runtime_1.jsx)(radiobutton_1.RadioButton, { id: "tableSort", checked: isSelected, type: "circle", value: sortValue }), (0, jsx_runtime_1.jsx)("label", Object.assign({ className: `${isSelected && "text-primary-400 font-semibold"}` }, { children: eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.headerName }))] }), index));
+                                return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: `${isSelected && "bg-primary-25"} cursor-pointer border-round-md flex align-items-center gap-2 px-3 py-2 text-base line-height-2 text-gray-700`, style: { listStyleType: "none" }, onClick: () => onSelectSortValue(eachColumn) }, { children: [(0, jsx_runtime_1.jsx)(radiobutton_1.RadioButton, { id: "tableSort", checked: isSelected, type: "circle", value: sortValue }), (0, jsx_runtime_1.jsx)("label", Object.assign({ className: `${isSelected && "text-primary-400 font-semibold"}` }, { children: eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.headerName }))] }), index));
                             }
                             else {
                                 return null;
                             }
-                        }) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "m-0" }), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "pl-0 m-1" }, { children: (_a = constants_1.COLUMN_SORT_OPTIONS
-                            .filter((each) => each.dataType === shortType)) === null || _a === void 0 ? void 0 : _a.map((eachOption, index) => {
+                        }) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: "m-0" }), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "pl-0 m-1" }, { children: (_a = constants_1.COLUMN_SORT_OPTIONS.filter((each) => each.dataType === shortType)) === null || _a === void 0 ? void 0 : _a.map((eachOption, index) => {
                             const seletedSort = eachOption.label === (sortBy === null || sortBy === void 0 ? void 0 : sortBy.label);
                             return ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: `${seletedSort && "bg-primary-25"} cursor-pointer border-round-md pl-0 px-3 py-2 flex align-items-center gap-2`, onClick: () => {
-                                    setSortBy(eachOption);
+                                    onSelectSortType(eachOption);
+                                    // setSortBy(eachOption);
                                 } }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: index === 0 ? "arrow-down" : "arrow-up", size: 20 }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: `${seletedSort && "text-primary-400 font-semibold"} text-gray-700 font-medium text-base` }, { children: eachOption.label }))] }), index));
                         }) })), (0, jsx_runtime_1.jsx)(divider_1.Divider, { id: "column_sort" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex justify-content-between px-5 py-2" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ disabled: false, id: "column_sort_dropdown", outlined: true, onClick: (e) => clearSort(e) }, { children: "Clear" })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ disabled: disableApply, id: "column_sort_dropdown", onClick: (e) => applyTableSort(e) }, { children: "Apply" }))] }))] }))] })));
 }

package/dist/components/ag-grid/advancedFeature/filter/filter.js

@@ -1,7 +1,77 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-function Filter() {
-    return ((0, jsx_runtime_1.jsx)("div", { children: "Filter" }));
+const button_1 = require("primereact/button");
+const svg_component_1 = tslib_1.__importDefault(require("../../../../directives/svg-component"));
+const react_1 = require("react");
+const overlaypanel_1 = require("primereact/overlaypanel");
+const querty_1 = tslib_1.__importDefault(require("./querty"));
+function FilterParent({ columnData, featureDetails, setFeatureDetails, callBackForSelect, callGrid }) {
+    const filterRef = (0, react_1.useRef)(null);
+    const [queryCount, setQueryCount] = (0, react_1.useState)(1);
+    const [queries, setQueries] = (0, react_1.useState)([0]);
+    // Filter header
+    const BulkActionHeader = (props) => {
+        const { header: { label, description }, } = props;
+        return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex align-items-center justify-content-between p-4 border-bottom-1 border-gray-200" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "text-lg line-height-4  text-gray-900" }, { children: [(0, jsx_runtime_1.jsx)("h4", Object.assign({ className: "my-0" }, { children: label })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0 text-gray-600 text-sm" }, { children: description }))] })) })));
+    };
+    // Filter footer
+    const BulkActionFooter = (props) => {
+        const { footer: { resetFilters, createLabel, applyLabel }, } = props;
+        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between border-top-1 border-gray-200 p-4" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-gray-900 cursor-pointer", onClick: resettingFilters }, { children: resetFilters })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3" }, { children: [(0, jsx_runtime_1.jsxs)(button_1.Button, Object.assign({ text: true, className: "h-auto p-0 text-primary-400" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus", color: "text-primary-400" }), " ", createLabel] })), (0, jsx_runtime_1.jsx)(button_1.Button, { label: applyLabel, onClick: applyFilters })] }))] })));
+    };
+    // Reset saved filters
+    const resettingFilters = () => {
+        emptyFilterQuries();
+        filterRef.current.toggle(false);
+        setQueryCount(1), setQueries([0]);
+    };
+    // Toggle the pop display
+    const togglePopup = (e) => {
+        var _a;
+        (_a = filterRef.current) === null || _a === void 0 ? void 0 : _a.toggle(e);
+        setQueryCount(1), setQueries([0]);
+    };
+    // Empty filterQuries
+    const emptyFilterQuries = () => {
+        setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { filterQueries: [] }));
+    };
+    // OnClick to +
+    const actionOnPlus = () => {
+        setQueryCount((prevCount) => prevCount + 1);
+        setQueries((prevQueries) => [...prevQueries, queryCount]);
+    };
+    // OnClick to - 
+    const actionOnMinus = (index) => {
+        var _a;
+        const filterQuries = (_a = featureDetails.filterQueries) === null || _a === void 0 ? void 0 : _a.filter((query) => query.idx !== index);
+        setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { filterQueries: filterQuries }));
+        setQueryCount((prevCount) => prevCount - 1);
+        setQueries((prevQueries) => prevQueries.filter((query) => query !== index));
+    };
+    // Display query by count
+    const RenderQuery = () => {
+        return queries.map((queryIndex) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-6 flex" }, { children: (0, jsx_runtime_1.jsx)(querty_1.default, { queryId: queryIndex, columnData: columnData, featureDetails: featureDetails, setFeatureDetails: setFeatureDetails, callBackForSelect: callBackForSelect, actionOnMinus: actionOnMinus, actionOnPlus: actionOnPlus }) }), queryIndex)));
+    };
+    const applyFilters = () => {
+        if (!featureDetails.filterQueries.length) {
+            return;
+        }
+        callGrid();
+        resettingFilters();
+    };
+    (0, react_1.useEffect)(() => {
+        var _a;
+        console.log(filterRef.current, (_a = filterRef.current) === null || _a === void 0 ? void 0 : _a.toggle, 'filter ref data');
+    }, [filterRef.current]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ text: true, className: "hover:bg-primary-25 ml-2", onClick: (e) => { togglePopup(e); } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines" }) })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: filterRef, onHide: emptyFilterQuries, className: "w-45rem bulk-action-feature" }, { children: [(0, jsx_runtime_1.jsx)(BulkActionHeader, { header: {
+                            label: "Filters",
+                            description: "Streamline your search with filter",
+                        } }), RenderQuery(), (0, jsx_runtime_1.jsx)(BulkActionFooter, { footer: {
+                            resetFilters: "Reset Filters",
+                            createLabel: "Create View",
+                            applyLabel: "Apply",
+                        } })] }))] }));
 }
-exports.default = Filter;
+exports.default = FilterParent;

package/dist/components/ag-grid/advancedFeature/filter/querty.js

@@ -1,7 +1,125 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-function Querty() {
-    return ((0, jsx_runtime_1.jsx)("div", { children: "querty" }));
+const dropdown_1 = require("primereact/dropdown");
+const svg_component_1 = tslib_1.__importDefault(require("../../../../directives/svg-component"));
+const button_1 = require("primereact/button");
+const react_1 = require("react");
+const constants_1 = require("../../constants");
+const Types_1 = require("../../Types");
+const inputnumber_1 = require("primereact/inputnumber");
+const calendar_1 = require("primereact/calendar");
+const multiselect_1 = require("primereact/multiselect");
+function Querty({ queryId, columnData, featureDetails, setFeatureDetails, callBackForSelect, actionOnMinus, actionOnPlus, }) {
+    var _a, _b, _c;
+    const [filterOperations, setFilterOperations] = (0, react_1.useState)([]);
+    const [thirdElementValue, setThirdElementValue] = (0, react_1.useState)();
+    const [currentFilter, setCurrentFilter] = (0, react_1.useState)({
+        currentColumn: {},
+        currentOperation: {},
+        currentValue: "",
+    });
+    const [thirdElementOptions, setThirdElementOptions] = (0, react_1.useState)([]);
+    // Assign selected columns
+    const assignSelectedColumn = (column) => {
+        console.log(column, "column on selected dropdown");
+        setCurrentFilter(Object.assign(Object.assign({}, currentFilter), { currentColumn: column }));
+        getFilterOperations(column);
+        // if(column?.dataType == ATTRIBUTEDATATYPES.SELECT ,column?.dataType == ATTRIBUTEDATATYPES.MULTI_SELECT){
+        // }
+    };
+    // Get operation list based on selected column datatype
+    const getFilterOperations = (column) => {
+        const filterList = constants_1.conditionsList
+            .filter(({ datatypes }) => datatypes.includes(column === null || column === void 0 ? void 0 : column.dataType))
+            .map((_a) => {
+            var { name } = _a, rest = tslib_1.__rest(_a, ["name"]);
+            return (Object.assign(Object.assign({}, rest), { name: name.toLowerCase().replace(/\b\w/g, (char) => char.toUpperCase()) }));
+        });
+        setFilterOperations(filterList);
+    };
+    // Assign selected operation
+    const assignOperation = (operation) => tslib_1.__awaiter(this, void 0, void 0, function* () {
+        var _d;
+        const currentColumnDataType = (_d = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _d === void 0 ? void 0 : _d.dataType;
+        setCurrentFilter(Object.assign(Object.assign({}, currentFilter), { currentOperation: operation }));
+        if (currentColumnDataType == Types_1.ATTRIBUTEDATATYPES.SELECT || currentColumnDataType == Types_1.ATTRIBUTEDATATYPES.MULTI_SELECT) {
+            let options = yield callBackForSelect(currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn, operation);
+            setThirdElementOptions(options);
+        }
+    });
+    // Render element based on the current column datatype
+    const renderUIElement = (type, value, onChange, options) => {
+        switch (type) {
+            case Types_1.ATTRIBUTEDATATYPES.STRING:
+                return ((0, jsx_runtime_1.jsx)("input", { type: "text", value: value, onChange: (e) => onChange(e.target.value) }));
+            case Types_1.ATTRIBUTEDATATYPES.DATE:
+                return ((0, jsx_runtime_1.jsx)(calendar_1.Calendar, { value: value, onChange: (e) => onChange(e.value), showIcon: true }));
+            case Types_1.ATTRIBUTEDATATYPES.INTEGER:
+                return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { value: value, onChange: (e) => onChange(e.value), useGrouping: false }));
+            case Types_1.ATTRIBUTEDATATYPES.PRICE:
+                return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { value: value, onValueChange: (e) => onChange(e.value), minFractionDigits: 2 }));
+            case Types_1.ATTRIBUTEDATATYPES.BOOLEAN:
+                return ((0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: value, onChange: (e) => onChange(e.target.checked) }));
+            case Types_1.ATTRIBUTEDATATYPES.DATE_AND_TIME:
+                return ((0, jsx_runtime_1.jsx)(calendar_1.Calendar, { value: value, onChange: (e) => onChange(e.value), showTime: true, hourFormat: "12" }));
+            case Types_1.ATTRIBUTEDATATYPES.DECIMAL:
+                return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { value: value, onValueChange: (e) => onChange(e.value), useGrouping: false, minFractionDigits: 2 }));
+            case Types_1.ATTRIBUTEDATATYPES.PERCENT:
+                return ((0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { inputId: "withoutgrouping", value: value, onValueChange: (e) => onChange(e.value), useGrouping: false, minFractionDigits: 2, max: 100, maxLength: 6, suffix: "%" }));
+            case Types_1.ATTRIBUTEDATATYPES.SELECT:
+                return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: value, onChange: (e) => onChange(e.value), options: options, optionLabel: "label", placeholder: "Select an option" }));
+            case Types_1.ATTRIBUTEDATATYPES.MULTI_SELECT:
+                return ((0, jsx_runtime_1.jsx)(multiselect_1.MultiSelect, { value: value, onChange: (e) => onChange(e.value), options: options, optionLabel: "label", placeholder: "Select options", maxSelectedLabels: 3 }));
+            default:
+                return null;
+        }
+    };
+    // Disable condition for plus button
+    const disableStatusPlusButton = (index) => {
+        var _a, _b;
+        console.log(index, queryId, "index and query id");
+        let status = true;
+        if (((_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName) &&
+            ((_b = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation) === null || _b === void 0 ? void 0 : _b.name)) {
+            status = false;
+        }
+        console.log(status, "status of action");
+        return status;
+    };
+    // Disable condition for minus button
+    const disableStatusMinusButton = (index) => {
+        let status = true;
+        if (index > 0) {
+            status = false;
+        }
+        return status;
+    };
+    (0, react_1.useEffect)(() => {
+        setCurrentFilter(Object.assign(Object.assign({}, currentFilter), { currentValue: thirdElementValue }));
+    }, [thirdElementValue]);
+    (0, react_1.useEffect)(() => {
+        var _a, _b;
+        const columnName = (_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName;
+        const operationName = (_b = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation) === null || _b === void 0 ? void 0 : _b.name;
+        const updatedValue = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentValue;
+        console.log(columnName, operationName, updatedValue, "all conditions");
+        if (columnName && operationName && updatedValue) {
+            const newQuery = {
+                idx: queryId,
+                selectedColumn: currentFilter.currentColumn,
+                selectedOperation: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation,
+                value: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentValue,
+            };
+            const presentQueries = featureDetails.filterQueries;
+            presentQueries[queryId] = newQuery;
+            // presentQueries.push(newQuery)
+            setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { filterQueries: presentQueries }));
+        }
+    }, [currentFilter]);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3 w-30rem" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-inputgroup w-full" }, { children: [(0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: currentFilter.currentColumn, placeholder: "Select", options: columnData, optionLabel: "headerName", onChange: (e) => assignSelectedColumn(e.value) }), (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentOperation, className: "border-left-none", placeholder: "Select", options: filterOperations, optionLabel: "name", onChange: (e) => assignOperation(e.value), disabled: !((_a = currentFilter.currentColumn) === null || _a === void 0 ? void 0 : _a.headerName) }), renderUIElement(((_b = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _b === void 0 ? void 0 : _b.dataType)
+                        ? (_c = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.currentColumn) === null || _c === void 0 ? void 0 : _c.dataType
+                        : Types_1.ATTRIBUTEDATATYPES.STRING, thirdElementValue, setThirdElementValue, thirdElementOptions)] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-1" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { text: true, disabled: disableStatusPlusButton(queryId), icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-circle", size: 18 }), onClick: () => actionOnPlus(queryId) }), (0, jsx_runtime_1.jsx)(button_1.Button, { disabled: disableStatusMinusButton(queryId), text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus-circle", size: 18 }), onClick: () => actionOnMinus(queryId) })] }))] })));
 }
 exports.default = Querty;

package/dist/components/ag-grid/advancedFeature/filter.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+function filter() {
+    return ((0, jsx_runtime_1.jsx)("div", { children: "filter" }));
+}
+exports.default = filter;