sccoreui 6.5.24 → 6.5.26

package/dist/App.js

@@ -4,6 +4,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("./App.scss");
 // import Home from "./pages/home";
 const App = () => {
-    return ((0, jsx_runtime_1.jsx)("div", { className: "m-6" }));
+    return (0, jsx_runtime_1.jsx)("div", { className: "m-6" });
 };
 exports.default = App;

package/dist/App.scss

@@ -752,6 +752,57 @@ code {
   }
 }
 
+.p-datepicker .p-datepicker-header .p-datepicker-title {
+  display: inline-flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  white-space: nowrap;
+}
+
+.p-datepicker .p-datepicker-header .p-datepicker-title .date_nav_dropdown {
+  min-width: 0 !important;
+  background: transparent;
+  border: none;
+  box-shadow: none;
+  border-radius: 4px;
+
+  &:hover,
+  &:not(.p-disabled):hover {
+    background: #f3f4f6;
+    border: none;
+  }
+
+  &:not(.p-disabled).p-focus {
+    box-shadow: none;
+    border: none;
+  }
+
+  .p-dropdown-label {
+    padding: 2px 6px;
+    font-size: 1rem;
+    font-weight: 600;
+    color: #495057;
+    line-height: 1.5rem;
+  }
+
+  .p-dropdown-trigger {
+    display: none;
+  }
+}
+
+.p-datepicker .p-dropdown-panel,
+.date_nav_dropdown ~ .p-dropdown-panel {
+  min-width: 6rem;
+
+  .p-dropdown-items .p-dropdown-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.75rem;
+    padding-right: 0.75rem;
+  }
+}
+
 .date_filter {
   margin: 0;
   position: absolute;
@@ -1945,6 +1996,57 @@ code {
   }
 }
 
+.p-datepicker .p-datepicker-header .p-datepicker-title {
+  display: inline-flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  white-space: nowrap;
+}
+
+.p-datepicker .p-datepicker-header .p-datepicker-title .date_nav_dropdown {
+  min-width: 0 !important;
+  background: transparent;
+  border: none;
+  box-shadow: none;
+  border-radius: 4px;
+
+  &:hover,
+  &:not(.p-disabled):hover {
+    background: #f3f4f6;
+    border: none;
+  }
+
+  &:not(.p-disabled).p-focus {
+    box-shadow: none;
+    border: none;
+  }
+
+  .p-dropdown-label {
+    padding: 2px 6px;
+    font-size: 1rem;
+    font-weight: 600;
+    color: #495057;
+    line-height: 1.5rem;
+  }
+
+  .p-dropdown-trigger {
+    display: none;
+  }
+}
+
+.p-datepicker .p-dropdown-panel,
+.date_nav_dropdown ~ .p-dropdown-panel {
+  min-width: 6rem;
+
+  .p-dropdown-items .p-dropdown-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.75rem;
+    padding-right: 0.75rem;
+  }
+}
+
 .date_filter {
   margin: 0;
   position: absolute;

package/dist/assets/sccoreui.css

@@ -538,9 +538,11 @@ a {
 .p-datepicker.p-datepicker-timeonly .p-timepicker {
   border-top: 0 none;
 }
-.p-datepicker .p-monthpicker {
+.p-datepicker .p-monthpicker, .p-datepicker .p-yearpicker {
   margin: 0.5rem 0;
+  min-height: 256px;
 }
+
 .p-datepicker .p-monthpicker .p-monthpicker-month {
   padding: 0.5rem;
   transition: box-shadow 0.2s;
@@ -550,9 +552,7 @@ a {
   color: #4338ca;
   background: #eef2ff;
 }
-.p-datepicker .p-yearpicker {
-  margin: 0.5rem 0;
-}
+
 .p-datepicker .p-yearpicker .p-yearpicker-year {
   padding: 0.5rem;
   transition: box-shadow 0.2s;

package/dist/components/ag-grid/advancedFeature/new-filter/conditions/Conditions.js

@@ -18,7 +18,7 @@ const Conditions = (props) => {
     // Filter available conditions based on column data type using fieldOperators
     const filteredConditions = constants_2.default.conditionsList.filter((cond) => cond.fieldOperators.includes(columnName === null || columnName === void 0 ? void 0 : columnName.dataType));
     // Extract numeric value from condition (handles both object and number formats)
-    const conditionValue = typeof condition === 'object' ? condition === null || condition === void 0 ? void 0 : condition.value : condition;
+    const conditionValue = typeof condition === "object" ? condition === null || condition === void 0 ? void 0 : condition.value : condition;
     const onAddCondition = (index) => {
         addEmptyCondition(index);
     };
@@ -102,7 +102,9 @@ const Conditions = (props) => {
         }
         // Preview resulting value and block if > 100
         if (key !== ".") {
-            const previewValue = currentValue.substring(0, cursorPos) + key + currentValue.substring(selEnd);
+            const previewValue = currentValue.substring(0, cursorPos) +
+                key +
+                currentValue.substring(selEnd);
             if (parseFloat(previewValue) > 100) {
                 e.preventDefault();
                 return;
@@ -120,24 +122,168 @@ const Conditions = (props) => {
     };
     const renderRangeNumber = (selectedColumn, showError) => {
         const isPercent = (selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.dataType) === Types_1.FilterDataType.PERCENT;
-        const handleChange1 = (data) => {
-            if (isPercent && data != null && data > 100)
+        const isInteger = (selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.dataType) === Types_1.FilterDataType.INTEGER;
+        const maxFractionDigits = isInteger ? 0 : 2;
+        // ✅ Validate input (allows typing states)
+        const validateInput = (val) => {
+            if (val === "")
+                return val;
+            const regex = isInteger
+                ? /^\d*$/
+                : new RegExp(`^\\d*(\\.\\d{0,${maxFractionDigits}})?$`);
+            if (!regex.test(val))
+                return null;
+            // only validate numeric constraints if complete
+            if (!val.endsWith(".") && val !== ".") {
+                const num = Number(val);
+                if (!Number.isNaN(num)) {
+                    if (num < 0)
+                        return null;
+                    if (isPercent && num > 100)
+                        return null;
+                }
+            }
+            return val;
+        };
+        // ✅ Safe conversion
+        const toSafeNumber = (val) => {
+            if (val === "" || val === "." || val.endsWith(".")) {
+                return val;
+            }
+            const num = Number(val);
+            if (!Number.isNaN(num) && Math.abs(num) <= Number.MAX_SAFE_INTEGER) {
+                return num;
+            }
+            return val;
+        };
+        // ✅ Normalize for comparison
+        const normalize = (val) => {
+            if (val === null || val === "")
+                return null;
+            return typeof val === "number" ? val.toString() : val;
+        };
+        // ✅ Large number safe compare (integers)
+        const compareValues = (a, b) => {
+            const x = a.replace(/^0+/, "") || "0";
+            const y = b.replace(/^0+/, "") || "0";
+            if (x.length > y.length)
+                return 1;
+            if (x.length < y.length)
+                return -1;
+            if (x > y)
+                return 1;
+            if (x < y)
+                return -1;
+            return 0;
+        };
+        // ✅ Between validation
+        const isValidRange = (() => {
+            if (!Array.isArray(value))
+                return true;
+            const [minVal, maxVal] = value;
+            if (!minVal || !maxVal)
+                return true;
+            if (!isInteger) {
+                return Number(minVal) <= Number(maxVal);
+            }
+            return compareValues(normalize(minVal), normalize(maxVal)) <= 0;
+        })();
+        const rangeInvalid = isValidRange ? "" : "p-invalid";
+        // ✅ Change handler
+        const handleChange = (index, val) => {
+            if (val.length > 20)
+                return;
+            const validated = validateInput(val);
+            if (validated === null)
+                return;
+            const converted = toSafeNumber(validated);
+            const newValue = Array.isArray(value) ? [...value] : [null, null];
+            newValue[index] = converted;
+            handleDynamicFieldState(newValue);
+        };
+        // ✅ Blur handler (normalize like ControlledInput)
+        const handleBlur = (index) => {
+            if (!Array.isArray(value))
+                return;
+            let val = value[index];
+            if (!val || typeof val !== "string")
+                return;
+            if (val === "." || val === "") {
+                const newValue = [...value];
+                newValue[index] = null;
+                handleDynamicFieldState(newValue);
+                return;
+            }
+            // ✅ if too large → DO NOT convert
+            if (val.length > 15) {
+                // keep as string (prevents precision loss)
+                return;
+            }
+            const num = Number(val);
+            if (!Number.isNaN(num)) {
+                let formatted = num;
+                if (!isInteger) {
+                    formatted = Number(num.toFixed(maxFractionDigits));
+                }
+                else {
+                    formatted = Math.floor(num);
+                }
+                const newValue = [...value];
+                newValue[index] = formatted;
+                handleDynamicFieldState(newValue);
+            }
+        };
+        // ✅ Display value
+        const getDisplayValue = (val) => {
+            if (val === null || val === undefined)
+                return "";
+            return val.toString();
+        };
+        // ✅ Keydown validation
+        const handleKeyDown = (e) => {
+            const allowed = ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Tab"];
+            const isDot = e.key === ".";
+            if (e.ctrlKey || e.metaKey) {
                 return;
-            Array.isArray(value) && value.splice(0, 1, data);
-            handleDynamicFieldState(Array.isArray(value) ? value : [data]);
+            }
+            if (isDot && e.currentTarget.value.includes(".")) {
+                e.preventDefault();
+                return;
+            }
+            if (!/[0-9.]/.test(e.key) && !allowed.includes(e.key)) {
+                e.preventDefault();
+            }
         };
-        const handleChange2 = (data) => {
-            if (isPercent && data != null && data > 100)
+        // ✅ Paste handling (safe)
+        const handlePaste = (e) => {
+            let pasted = e.clipboardData.getData("text");
+            if (!pasted)
+                return;
+            // ✅ Trim spaces & normalize
+            pasted = pasted.trim();
+            // ✅ Remove commas (common copy case like 1,000)
+            pasted = pasted.replace(/,/g, "");
+            // ✅ Allow valid patterns
+            const regex = isInteger ? /^\d+$/ : /^\d*(\.\d*)?$/;
+            if (!regex.test(pasted)) {
+                e.preventDefault();
                 return;
-            Array.isArray(value) && value.splice(1, 1, data);
-            handleDynamicFieldState(value);
+            }
+            // ✅ Validate numeric constraints (only if complete)
+            if (!pasted.endsWith(".")) {
+                const num = Number(pasted);
+                if (!Number.isNaN(num)) {
+                    if (num < 0 || (isPercent && num > 100)) {
+                        e.preventDefault();
+                        return;
+                    }
+                }
+            }
+            // ✅ Allow paste
         };
-        const rangeInvalid = Array.isArray(value) && (value === null || value === void 0 ? void 0 : value.every((y) => Boolean(y)))
-            ? value[0] > value[1]
-                ? "p-invalid"
-                : ""
-            : "";
-        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `border-noround-left p-0 col-4 mx-0 focus:shadow-none lh-44 h-44 flex ${showError ? "p-invalid" : ""}` }, { children: [(0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { disabled: !condition, min: 0, useGrouping: false, max: isPercent ? 100 : Infinity, maxFractionDigits: (selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.dataType) === Types_1.FilterDataType.INTEGER ? 0 : 2, inputClassName: "mx-0 w-full lh-44 h-44", className: `w-7ren border-noround-left lh-44 h-44 border-noround-right dropdown-focus-none ${rangeInvalid} ${showError ? "p-invalid" : ""}`, value: Array.isArray(value) ? value[0] : null, placeholder: "Min", onChange: (event) => handleChange1(event.value), onKeyDown: isPercent ? handlePercentKeyDown : undefined }), (0, jsx_runtime_1.jsx)(inputnumber_1.InputNumber, { disabled: !condition || !(Array.isArray(value) && value[0]), min: 0, useGrouping: false, max: isPercent ? 100 : Infinity, maxFractionDigits: (selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.dataType) === Types_1.FilterDataType.INTEGER ? 0 : 2, inputClassName: "mx-0 w-full lh-44 h-44", className: `w-7ren border-noround-left lh-44 h-44 dropdown-focus-none ${rangeInvalid} ${showError ? "p-invalid" : ""}`, value: Array.isArray(value) ? value[1] : null, placeholder: "Max", onChange: (event) => handleChange2(event.value), onKeyDown: isPercent ? handlePercentKeyDown : undefined })] })));
+        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `border-noround-left w-13rem p-0 col-4 mx-0 flex ${showError ? "p-invalid" : ""}` }, { children: [(0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition, value: getDisplayValue(Array.isArray(value) ? value[0] : ""), placeholder: "Min", onChange: (e) => handleChange(0, e.target.value), onKeyDown: handleKeyDown, onBlur: () => handleBlur(0), 
+                    // onPaste={handlePaste}
+                    className: `w-6 border-noround-left lh-44 h-44 border-noround-right ${rangeInvalid} ${showError ? "p-invalid" : ""}` }), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { disabled: !condition || !(Array.isArray(value) && value[0]), value: getDisplayValue(Array.isArray(value) ? value[1] : ""), placeholder: "Max", onChange: (e) => handleChange(1, e.target.value), onKeyDown: handleKeyDown, onBlur: () => handleBlur(1), onPaste: handlePaste, className: `w-6 border-left-none border-noround-left lh-44 h-44 ${rangeInvalid} ${showError ? "p-invalid" : ""}` })] })));
     };
     const renderListStringChips = (showError) => ((0, jsx_runtime_1.jsx)(chips_1.Chips, { value: value, type: "", disabled: !condition, className: `table_filters_1 border-noround-left col-4 focus:shadow-none lh-44 h-44 chip_comp flex align-items-center ${showError ? "p-invalid" : ""}`, onChange: (e) => handleDynamicFieldState(e.target.value), placeholder: "Enter tags", separator: "," }));
     const renderListNumberChips = (selectedColumn, showError) => {
@@ -281,7 +427,11 @@ const Conditions = (props) => {
                 : convertDateToISO(val);
             handleDynamicFieldState(valueString);
         };
-        const selectionMode = spec.kind === "Range" ? "range" : spec.kind === "List" ? "multiple" : "single";
+        const selectionMode = spec.kind === "Range"
+            ? "range"
+            : spec.kind === "List"
+                ? "multiple"
+                : "single";
         const isArrayMode = spec.kind === "Range" || spec.kind === "List";
         return ((0, jsx_runtime_1.jsx)(calendar_1.Calendar, { readOnlyInput: true, showTime: false, disabled: !condition, selectionMode: selectionMode, placeholder: (filterModelText === null || filterModelText === void 0 ? void 0 : filterModelText.elementThreePlaceHolder_Calender)
                 ? filterModelText.elementThreePlaceHolder_Calender

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

@@ -68,10 +68,29 @@ const TableFilter = () => {
      */
     const validateNumberValue = (value, condition) => {
         if (isBetweenCondition(condition)) {
-            return (Array.isArray(value) &&
-                value.length > 1 &&
-                value.every((item) => item !== undefined && item !== null && item !== "") &&
-                Number(value[1]) > Number(value[0]));
+            const normalize = (val) => {
+                if (val === null || val === "")
+                    return null;
+                return typeof val === "number" ? val.toString() : val;
+            };
+            const compareValues = (a, b) => {
+                if (a === null || a === undefined)
+                    return -1;
+                if (b === null || b === undefined)
+                    return 1;
+                const x = a.toString().replace(/^0+/, "") || "0";
+                const y = b.toString().replace(/^0+/, "") || "0";
+                if (x.length > y.length)
+                    return 1;
+                if (x.length < y.length)
+                    return -1;
+                if (x > y)
+                    return 1;
+                if (x < y)
+                    return -1;
+                return 0;
+            };
+            return (compareValues(normalize((value === null || value === void 0 ? void 0 : value[0]) || null), normalize((value === null || value === void 0 ? void 0 : value[1]) || null)) <= 0);
         }
         if (isAnyOrNoneOf(condition)) {
             return (Array.isArray(value) &&
@@ -206,7 +225,7 @@ const TableFilter = () => {
     /**
      * Apply filter conditions to the grid
      */
-    const applyAdvancedFilter = (array) => {
+    const applyAdvancedFilter = (array, rest) => {
         const allQueries = array.map((query) => {
             const column = { code: query.columnName };
             const operation = query.condition;
@@ -221,7 +240,7 @@ const TableFilter = () => {
         const currentFeature = Object.assign({}, featureDetails);
         currentFeature.filterQueries = allQueries;
         setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { filterQueries: allQueries }));
-        callGrid(currentFeature);
+        !rest && callGrid(currentFeature);
         return [];
     };
     /**
@@ -286,7 +305,7 @@ const TableFilter = () => {
      * Reset all filters to default state
      */
     const onResetFilter = (formSetter) => {
-        applyAdvancedFilter([]);
+        applyAdvancedFilter([], true);
         const newDefault = Object.assign(Object.assign({}, defaultCondition), { id: Math.random().toString() });
         setConditionsArray([newDefault]);
         setViewName("");

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

@@ -28,13 +28,16 @@ const INITIAL_CHECKBOX_DATA = {
 };
 function ParentForGrid(props) {
     var _a, _b, _c, _d, _e, _f, _g, _h;
-    const { gridProps = {}, gridViewTemplate, selectColumns = () => { }, enableCheckboxForGroupHeader = false, serverSideSelectRow, blockSize, renderSelectField, renderMultiSelectField } = props;
+    const { gridProps = {}, gridViewTemplate, selectColumns = () => { }, enableCheckboxForGroupHeader = false, serverSideSelectRow, blockSize, renderSelectField, renderMultiSelectField, } = props;
     const effectiveBlockSize = blockSize || constants_1.BLOCK_SIZE;
     const [gridData, setGridData] = (0, react_1.useState)({
         rowData: (props === null || props === void 0 ? void 0 : props.rowData) || [],
         columnData: (0, helper_1.sortColumns)(props === null || props === void 0 ? void 0 : props.columnData),
     });
-    const [gridViewData, setGridViewData] = (0, react_1.useState)({ rowData: [], searchText: "" });
+    const [gridViewData, setGridViewData] = (0, react_1.useState)({
+        rowData: [],
+        searchText: "",
+    });
     const [gridView, setGridView] = (0, react_1.useState)(false);
     const [isDataLoading, setIsDataLoading] = (0, react_1.useState)(false);
     // const [style] = useState<Style>(props.style);
@@ -135,7 +138,8 @@ function ParentForGrid(props) {
         else {
             setSelectedGroup([]);
         }
-        selectColumns && selectColumns(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: checkboxData }));
+        selectColumns &&
+            selectColumns(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: checkboxData }));
         serverSideRowLeveSelection(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: checkboxData }));
         setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { checkBoxSelection: checkboxData }));
     };
@@ -168,7 +172,7 @@ function ParentForGrid(props) {
         setIsDataLoading(true);
         try {
             const response = yield (props === null || props === void 0 ? void 0 : props.getRowData(startRow, endRow, currentFeatures, params));
-            setGridData(prev => (Object.assign(Object.assign({}, prev), { rowData: [] })));
+            setGridData((prev) => (Object.assign(Object.assign({}, prev), { rowData: [] })));
             // To identify when to stop the callBack
             const actualEndRow = (response === null || response === void 0 ? void 0 : response.totalRecords) < constants_1.MAX_RECORDS_TO_LOAD
                 ? response === null || response === void 0 ? void 0 : response.totalRecords
@@ -205,10 +209,16 @@ function ParentForGrid(props) {
             }
             (_k = (_j = gridRef === null || gridRef === void 0 ? void 0 : gridRef.current) === null || _j === void 0 ? void 0 : _j.api) === null || _k === void 0 ? void 0 : _k.showLoadingOverlay();
             params && ((_l = params === null || params === void 0 ? void 0 : params.api) === null || _l === void 0 ? void 0 : _l.setGridOption("rowData", []));
-            const result = gridViewData.rowData.length > 0 ? { rowData: gridViewData.rowData, totalRecords: gridViewData.rowData.length } : yield getData(0, 0, currentFeatures);
+            const result = gridViewData.rowData.length > 0
+                ? {
+                    rowData: gridViewData.rowData,
+                    totalRecords: gridViewData.rowData.length,
+                }
+                : yield getData(0, 0, currentFeatures);
             if (((_m = result.rowData) === null || _m === void 0 ? void 0 : _m.length) > 0) {
-                gridViewData.rowData.length > 0 && setGridViewData({ rowData: [], searchText: "" });
-                setGridData(prev => (Object.assign(Object.assign({}, prev), { rowData: result.rowData })));
+                gridViewData.rowData.length > 0 &&
+                    setGridViewData({ rowData: [], searchText: "" });
+                setGridData((prev) => (Object.assign(Object.assign({}, prev), { rowData: result.rowData })));
                 gridRef.current && gridRef.current.api.hideOverlay();
                 params && ((_o = params === null || params === void 0 ? void 0 : params.api) === null || _o === void 0 ? void 0 : _o.applyTransaction({ add: result.rowData }));
             }
@@ -228,10 +238,14 @@ function ParentForGrid(props) {
                     const response = yield getData(startRow, endRow, currentFeatures, params);
                     // simulating real server call with a 500ms delay
                     if (((_q = response.rowData) === null || _q === void 0 ? void 0 : _q.length) > 0) {
-                        setGridData(prev => (Object.assign(Object.assign({}, prev), { rowData: response.rowData })));
+                        setGridData((prev) => (Object.assign(Object.assign({}, prev), { rowData: response.rowData })));
                         gridRef.current.api.hideOverlay();
                         // supply rows for requested block to grid
-                        params && params.success({ rowData: response.rowData, rowCount: response.actualEndRow });
+                        params &&
+                            params.success({
+                                rowData: response.rowData,
+                                rowCount: response.actualEndRow,
+                            });
                         return;
                     }
                     else {
@@ -320,8 +334,7 @@ function ParentForGrid(props) {
             GridHeaderComponent, // Header component
             headerCheckBoxRenderer, //
             enableCheckboxForGroupHeader, ((_b = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _b === void 0 ? void 0 : _b.displayGroupCount) || false, parseInt(props === null || props === void 0 ? void 0 : props.rowGroupColumnWidth), // for grouped column width
-            cellRendererConditionally, GroupHeaderRenderer // Custom component for group header
-            );
+            cellRendererConditionally, GroupHeaderRenderer);
         }
         else {
             return (0, helper_1.autoGroupColumnDef)((props === null || props === void 0 ? void 0 : props.enableTree) ? true : false, // If tree enable
@@ -330,8 +343,7 @@ function ParentForGrid(props) {
             GridHeaderComponent, // Header component
             headerCheckBoxRenderer, //
             enableCheckboxForGroupHeader, ((_c = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _c === void 0 ? void 0 : _c.displayGroupCount) || false, parseInt(props === null || props === void 0 ? void 0 : props.rowGroupColumnWidth), // for grouped column width
-            GroupHeaderRenderer // Custom component for group header
-            );
+            GroupHeaderRenderer);
         }
     };
     (0, react_1.useEffect)(() => {
@@ -344,7 +356,7 @@ function ParentForGrid(props) {
         }
         if (props === null || props === void 0 ? void 0 : props.rowData) {
             setTotalRecords(props === null || props === void 0 ? void 0 : props.rowData.length);
-            setGridData(prev => (Object.assign(Object.assign({}, prev), { rowData: props.rowData })));
+            setGridData((prev) => (Object.assign(Object.assign({}, prev), { rowData: props.rowData })));
         }
         if (props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) {
             (_b = (_a = props === null || props === void 0 ? void 0 : props.getGridRef) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.api.setGridOption("advancedFilterParent", document.getElementById("advancedFilterParent"));
@@ -357,10 +369,16 @@ function ParentForGrid(props) {
     }, [props === null || props === void 0 ? void 0 : props.getGridRef]);
     const gridStyle = (0, react_1.useMemo)(() => {
         var _a, _b, _c;
-        return (Object.assign({ width: (_a = props === null || props === void 0 ? void 0 : props.style) === null || _a === void 0 ? void 0 : _a.width }, (totalRecords > constants_1.AUTO_HEIGHT_ROWS || !((_b = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _b === void 0 ? void 0 : _b.isGridAutoHeight)
+        return (Object.assign({ width: (_a = props === null || props === void 0 ? void 0 : props.style) === null || _a === void 0 ? void 0 : _a.width }, (totalRecords > constants_1.AUTO_HEIGHT_ROWS ||
+            !((_b = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _b === void 0 ? void 0 : _b.isGridAutoHeight)
             ? { height: (_c = props === null || props === void 0 ? void 0 : props.style) === null || _c === void 0 ? void 0 : _c.height }
             : null)));
-    }, [(_a = props === null || props === void 0 ? void 0 : props.style) === null || _a === void 0 ? void 0 : _a.width, (_b = props === null || props === void 0 ? void 0 : props.style) === null || _b === void 0 ? void 0 : _b.height, totalRecords, (_c = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _c === void 0 ? void 0 : _c.isGridAutoHeight]);
+    }, [
+        (_a = props === null || props === void 0 ? void 0 : props.style) === null || _a === void 0 ? void 0 : _a.width,
+        (_b = props === null || props === void 0 ? void 0 : props.style) === null || _b === void 0 ? void 0 : _b.height,
+        totalRecords,
+        (_c = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _c === void 0 ? void 0 : _c.isGridAutoHeight,
+    ]);
     // Dont show hide overlay component when any row pinned
     // useEffect(() => {
     //   if (!props?.pinnedTopRowData) return;
@@ -399,7 +417,10 @@ function ParentForGrid(props) {
             }
         }), autoGroupColumnDef: (props === null || props === void 0 ? void 0 : props.autoGroupColumnDef)
             ? props === null || props === void 0 ? void 0 : props.autoGroupColumnDef
-            : manageColumnGrouping(), treeData: (props === null || props === void 0 ? void 0 : props.enableTree) ? props === null || props === void 0 ? void 0 : props.enableTree : false, getDataPath: (props === null || props === void 0 ? void 0 : props.enableTree) ? getDataPath : null, defaultColDef: defaultColDef, suppressMenuHide: false, suppressRowClickSelection: false, 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 }, (props.rowModelType === (constants_1.ROWMODELTYPE === null || constants_1.ROWMODELTYPE === void 0 ? void 0 : constants_1.ROWMODELTYPE.SERVER_SIDE) && { cacheBlockSize: effectiveBlockSize })), { maxBlocksInCache: effectiveBlockSize, blockLoadDebounceMillis: constants_1.DEBOUNCE_INTERVAL, noRowsOverlayComponent: props === null || props === void 0 ? void 0 : props.noRowsOverlayComponent, loadingOverlayComponent: loading_component_1.default, suppressCellFocus: true, suppressPropertyNamesCheck: true, suppressServerSideFullWidthLoadingRow: true, enableRangeSelection: (_e = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _e === void 0 ? void 0 : _e.enableFillHandle, enableFillHandle: (_f = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _f === void 0 ? void 0 : _f.enableFillHandle, onFillEnd: wrapperToFillOpertation, fillOperation: myOpertaion, serverSideInitialRowCount: (props === null || props === void 0 ? void 0 : props.serverSideInitialRowCount) || 10, getRowId: getRowId, enableAdvancedFilter: (props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) || false, fillHandleDirection: "y" }), ((props === null || props === void 0 ? void 0 : props.rowData) && { rowData: props === null || props === void 0 ? void 0 : props.rowData })), (totalRecords <= constants_1.AUTO_HEIGHT_ROWS && ((_g = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _g === void 0 ? void 0 : _g.isGridAutoHeight)
+            : manageColumnGrouping(), treeData: (props === null || props === void 0 ? void 0 : props.enableTree) ? props === null || props === void 0 ? void 0 : props.enableTree : false, getDataPath: (props === null || props === void 0 ? void 0 : props.enableTree) ? getDataPath : null, defaultColDef: defaultColDef, suppressMenuHide: false, suppressRowClickSelection: false, 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 }, (props.rowModelType === (constants_1.ROWMODELTYPE === null || constants_1.ROWMODELTYPE === void 0 ? void 0 : constants_1.ROWMODELTYPE.SERVER_SIDE) && {
+        cacheBlockSize: effectiveBlockSize,
+    })), { maxBlocksInCache: effectiveBlockSize, blockLoadDebounceMillis: constants_1.DEBOUNCE_INTERVAL, noRowsOverlayComponent: props === null || props === void 0 ? void 0 : props.noRowsOverlayComponent, loadingOverlayComponent: loading_component_1.default, suppressCellFocus: true, suppressPropertyNamesCheck: true, suppressServerSideFullWidthLoadingRow: true, enableRangeSelection: (_e = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _e === void 0 ? void 0 : _e.enableFillHandle, enableFillHandle: (_f = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _f === void 0 ? void 0 : _f.enableFillHandle, onFillEnd: wrapperToFillOpertation, fillOperation: myOpertaion, serverSideInitialRowCount: (props === null || props === void 0 ? void 0 : props.serverSideInitialRowCount) || 10, getRowId: getRowId, enableAdvancedFilter: (props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) || false, fillHandleDirection: "y" }), ((props === null || props === void 0 ? void 0 : props.rowData) && { rowData: props === null || props === void 0 ? void 0 : props.rowData })), (totalRecords <= constants_1.AUTO_HEIGHT_ROWS &&
+        ((_g = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _g === void 0 ? void 0 : _g.isGridAutoHeight)
         ? { domLayout: "autoHeight" }
         : { domLayout: "normal" })), ((props === null || props === void 0 ? void 0 : props.dataTypeDefinitions) && {
         dataTypeDefinitions: props === null || props === void 0 ? void 0 : props.dataTypeDefinitions,
@@ -538,8 +559,14 @@ function ParentForGrid(props) {
     }, [
         props.rowModelType,
         props === null || props === void 0 ? void 0 : props.quickSearch,
-        featureDetails, gridData, callGrid,
-        totalRecords, initialFeature, defaultFilters, defaultSearchText, defaultSort,
+        featureDetails,
+        gridData,
+        callGrid,
+        totalRecords,
+        initialFeature,
+        defaultFilters,
+        defaultSearchText,
+        defaultSort,
         props === null || props === void 0 ? void 0 : props.createView,
         props === null || props === void 0 ? void 0 : props.conditionsToDisplay,
         props === null || props === void 0 ? void 0 : props.dynamicText,
@@ -548,15 +575,21 @@ function ParentForGrid(props) {
         props === null || props === void 0 ? void 0 : props.clearFilters,
         props === null || props === void 0 ? void 0 : props.onFiltersCleared,
         props === null || props === void 0 ? void 0 : props.updateColumnsForGrid,
-        props.enableManageColumnsCallback, selectedGroup, initialCheckBoxData,
-        intialColumns, gridViewFun, gridViewData, gridView,
+        props.enableManageColumnsCallback,
+        selectedGroup,
+        initialCheckBoxData,
+        intialColumns,
+        gridViewFun,
+        gridViewData,
+        gridView,
         props === null || props === void 0 ? void 0 : props.enableAdvancedFilter,
         props === null || props === void 0 ? void 0 : props.rowData,
         props.serverSideSelectRow,
         props === null || props === void 0 ? void 0 : props.defaultViewName,
         isDataLoading,
-        renderSelectField, renderMultiSelectField,
+        renderSelectField,
+        renderMultiSelectField,
     ]);
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(error_ui_1.default, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "wrapper", style: { height: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.height, width: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.width }, className: `ag-grid-container ag-grid-parent-div  ${(props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) ? "hide-advance-filter" : ""}` }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(context_provider_1.default, Object.assign({ value: contextValue }, { children: ((_h = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _h === void 0 ? void 0 : _h.displayFeaturesHeader) && ((0, jsx_runtime_1.jsx)(advanced_feature_1.default, { props: props })) })), gridView ? (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: gridViewTemplate(gridViewData) }) : (0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: gridStyle, gridOptions: gridOptions, onGridReady: (props === null || props === void 0 ? void 0 : props.rowData) ? undefined : onGridReady, gridRef: gridRef })] }) })) }) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(error_ui_1.default, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ id: "wrapper", style: { height: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.height, width: gridStyle === null || gridStyle === void 0 ? void 0 : gridStyle.width }, className: `ag-grid-container ag-grid-parent-div  ${(props === null || props === void 0 ? void 0 : props.enableAdvancedFilter) ? "hide-advance-filter" : ""}` }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(context_provider_1.default, Object.assign({ value: contextValue }, { children: ((_h = props === null || props === void 0 ? void 0 : props.conditionsToDisplay) === null || _h === void 0 ? void 0 : _h.displayFeaturesHeader) && ((0, jsx_runtime_1.jsx)(advanced_feature_1.default, { props: props })) })), gridView ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: gridViewTemplate(gridViewData) })) : ((0, jsx_runtime_1.jsx)(AgGrid_1.default, { style: gridStyle, gridOptions: gridOptions, onGridReady: (props === null || props === void 0 ? void 0 : props.rowData) ? undefined : onGridReady, gridRef: gridRef }))] }) })) }) }));
 }
 exports.default = ParentForGrid;

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

@@ -7,9 +7,9 @@ const react_1 = require("react");
 const context_provider_1 = require("./context-provider");
 // Render checkbox as well as initial component/data from props
 const dataCellRenderer = (cellRendererParams, column, props) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e;
     const { initialRenderer, cellCheckBoxRenderer } = cellRendererParams;
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "inline-flex w-full h-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] })), cellCheckBoxRenderer(cellRendererParams) && ((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: [cellCheckBoxRenderer(cellRendererParams) && ((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] })))] })) })));
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "inline-flex w-full h-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 ${((_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]) ? "justify-content-between" : "justify-content-center"}` }, { children: [typeof initialRenderer === "function" ? (initialRenderer(cellRendererParams)) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { 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]) && ((0, jsx_runtime_1.jsx)("div", { children: (_d = cellRendererParams === null || cellRendererParams === void 0 ? void 0 : cellRendererParams.data) === null || _d === void 0 ? void 0 : _d[column === null || column === void 0 ? void 0 : column.field] })) })), cellCheckBoxRenderer(cellRendererParams) && ((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: [cellCheckBoxRenderer(cellRendererParams) && ((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: (_e = cellRendererParams === null || cellRendererParams === void 0 ? void 0 : cellRendererParams.data) === null || _e === void 0 ? void 0 : _e[column === null || column === void 0 ? void 0 : column.field] })))] })) })));
 };
 exports.dataCellRenderer = dataCellRenderer;
 //Get this compnent from products

package/dist/components/date-picker/date-picker.js

@@ -6,9 +6,13 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const calendar_1 = require("primereact/calendar");
 const react_1 = require("react");
 const button_1 = require("primereact/button");
+const dropdown_1 = require("primereact/dropdown");
 const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
 const DatePicker = (props) => {
     const dateRef = (0, react_1.useRef)(null);
+    const monthCallCount = (0, react_1.useRef)(0);
+    const yearCallCount = (0, react_1.useRef)(0);
+    const masterMonthRef = (0, react_1.useRef)(0);
     const today = new Date();
     const options = { year: 'numeric', month: 'short', day: 'numeric' };
     const oneWeekFromToday = new Date(today);
@@ -100,38 +104,89 @@ const DatePicker = (props) => {
             props.onChange(e);
     };
     (0, react_1.useEffect)(() => {
+        // Pass through every prop to the underlying PrimeReact Calendar, except
+        // the ones this wrapper handles itself (value/onChange/onClear/clear/
+        // footerTemplate/iconPos — those are wired explicitly below). This way
+        // any PrimeReact Calendar prop (monthNavigator, yearNavigator, yearRange,
+        // minDate, viewDate, inline, readOnlyInput, touchUI, showButtonBar, etc.)
+        // works without updating the wrapper for each new field.
+        const EXCLUDE = new Set([
+            'value', 'onChange', 'onClear', 'clear',
+            'footerTemplate', 'iconPos', 'icon', 'ref',
+        ]);
         const datePickerProps = {};
-        for (let key in props) {
-            switch (key) {
-                case 'iconPos':
-                    // datePickerProps['iconPos'] = props.iconPos
-                    datePickerProps['icon'] = (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: props.icon });
-                    break;
-                case 'numberOfMonths':
-                    datePickerProps['numberOfMonths'] = props.numberOfMonths;
-                    break;
-                case 'dateFormat':
-                    datePickerProps['dateFormat'] = props.dateFormat;
-                    break;
-                case 'selectionMode':
-                    datePickerProps['selectionMode'] = props.selectionMode;
-                    break;
-                case 'placeholder':
-                    datePickerProps['placeholder'] = props.placeholder;
-                    break;
-                case 'maxDate':
-                    datePickerProps['maxDate'] = props.maxDate;
-                    break;
-                case 'className':
-                    datePickerProps['className'] = props.className;
-                    break;
-                case 'showIcon':
-                    datePickerProps['showIcon'] = true;
-                    break;
-            }
+        for (const key in props) {
+            if (EXCLUDE.has(key))
+                continue;
+            datePickerProps[key] = props[key];
+        }
+        // Keep the custom SvgComponent icon behaviour for iconPos consumers.
+        if (props.iconPos) {
+            datePickerProps['icon'] = (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: props.icon });
+        }
+        if (props.showIcon) {
+            datePickerProps['showIcon'] = true;
+        }
+        // Use PrimeReact's monthNavigator/yearNavigator and render PrimeReact
+        // Dropdowns (styled as plain text) so the user can change month/year
+        // without switching to a separate picker view. Each navigator template
+        // is called once per pane in render order, so we use a render counter
+        // to give pane 2 its actual month/year (PrimeReact otherwise reads
+        // viewDate.getMonth() for both panes). Consumer values always win.
+        if (datePickerProps.monthNavigator === undefined) {
+            datePickerProps.monthNavigator = true;
+        }
+        if (datePickerProps.yearNavigator === undefined) {
+            datePickerProps.yearNavigator = true;
+        }
+        if (datePickerProps.yearRange === undefined) {
+            const cy = new Date().getFullYear();
+            datePickerProps.yearRange = `${cy - 50}:${cy + 50}`;
+        }
+        const numberOfMonths = datePickerProps.numberOfMonths || 1;
+        if (datePickerProps.monthNavigatorTemplate === undefined) {
+            datePickerProps.monthNavigatorTemplate = (e) => {
+                const paneIndex = monthCallCount.current % numberOfMonths;
+                if (paneIndex === 0)
+                    masterMonthRef.current = e.value;
+                monthCallCount.current++;
+                const displayMonth = (e.value + paneIndex) % 12;
+                const monthOptions = (e.options || []).map((o) => ({
+                    label: String(o.label),
+                    value: o.value,
+                }));
+                return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: displayMonth, options: monthOptions, onChange: (ev) => {
+                        const newViewMonth = (ev.value - paneIndex + 12) % 12;
+                        e.onChange(ev.originalEvent, newViewMonth);
+                    }, className: "date_nav_dropdown date_nav_dropdown--month", style: { width: 'auto', marginRight: '0.25rem' }, appendTo: "self" }));
+            };
+        }
+        if (datePickerProps.yearNavigatorTemplate === undefined) {
+            datePickerProps.yearNavigatorTemplate = (e) => {
+                const paneIndex = yearCallCount.current % numberOfMonths;
+                yearCallCount.current++;
+                // Pane 2 rolls into next year only when master month is December.
+                const displayYear = paneIndex > 0 && masterMonthRef.current + paneIndex > 11
+                    ? e.value + 1
+                    : e.value;
+                const yearOptions = (e.options || []).map((o) => {
+                    const raw = typeof o === 'object' ? o.value : o;
+                    return { label: String(raw), value: raw };
+                });
+                return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: displayYear, options: yearOptions, onChange: (ev) => {
+                        const newViewYear = paneIndex > 0 && masterMonthRef.current + paneIndex > 11
+                            ? ev.value - 1
+                            : ev.value;
+                        e.onChange(ev.originalEvent, newViewYear);
+                    }, className: "date_nav_dropdown date_nav_dropdown--year", style: { width: 'auto' }, appendTo: "self" }));
+            };
         }
+        // Reset render counters at start of each render cycle so the modulo
+        // pane index stays correct across re-renders.
+        monthCallCount.current = 0;
+        yearCallCount.current = 0;
         setPropsState(datePickerProps);
-    }, []);
+    }, [props]);
     (0, react_1.useEffect)(() => {
         if (props.value !== undefined) {
             if (props.value === null) {

package/dist/types/components/types/type.d.ts

@@ -279,6 +279,7 @@ export interface ListBoxDropdownTypes {
 export interface DatePickerTypes {
     value: any;
     maxDate?: any;
+    minDate?: any;
     showIcon?: any;
     clear?: string;
     iconPos?: string;
@@ -294,6 +295,14 @@ export interface DatePickerTypes {
     touchUI?: any;
     todayButtonClassName?: any;
     showButtonBar?: any;
+    monthNavigator?: boolean;
+    yearNavigator?: boolean;
+    yearRange?: string;
+    viewDate?: any;
+    readOnlyInput?: boolean;
+    inline?: boolean;
+    disabled?: boolean;
+    [key: string]: any;
 }
 export interface ScMultiSelectTypes {
     optionLabel: string;

package/package.json

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