funda-ui 4.7.212 → 4.7.222

package/Date/index.js

@@ -5424,9 +5424,14 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
 
     e.target.select();
     resetDefauleValueExist();
-    var _date = "".concat(splitVals[0], "-").concat(splitVals[1], "-").concat(splitVals[2]);
-    var _full = "".concat(_date, " ").concat(splitVals[3], ":").concat(splitVals[4], ":").concat(splitVals[5]);
-    _onChange === null || _onChange === void 0 ? void 0 : _onChange(inputRef.current, valueResConverter(_full), (0,cjs_date.isValidDate)(_full), getAllSplittingInputs());
+
+    // If there is no valid default value in the input field, 
+    // onChange should be triggered only after the resetDefauleValueExist() function is processed
+    if (!dateDefaultValueExist) {
+      var _date = "".concat(splitVals[0], "-").concat(splitVals[1], "-").concat(splitVals[2]);
+      var _full = "".concat(_date, " ").concat(splitVals[3], ":").concat(splitVals[4], ":").concat(splitVals[5]);
+      _onChange === null || _onChange === void 0 ? void 0 : _onChange(inputRef.current, valueResConverter(_full), (0,cjs_date.isValidDate)(_full), getAllSplittingInputs());
+    }
   }
   function handleKeyPressed(_x2) {
     return _handleKeyPressed.apply(this, arguments);
@@ -5461,17 +5466,19 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
   }
   function _handleKeyPressedForSplitInputs() {
     _handleKeyPressedForSplitInputs = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(event) {
-      var key, btnMark, move;
+      var key, btnMark, isLeftArrow, isRightArrow, move;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
             key = event.code;
-            btnMark = event.target.dataset.mark;
-            move = function move(key) {
+            btnMark = event.target.dataset.mark; // Check for both regular arrow keys and numpad arrow keys
+            isLeftArrow = key === 'ArrowLeft' || key === 'Numpad4';
+            isRightArrow = key === 'ArrowRight' || key === 'Numpad6';
+            move = function move(direction) {
               var currentIndex = splitInputsIds.findIndex(function (s) {
                 return s === btnMark;
               });
-              var nextIndex = key === 'ArrowLeft' ? currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex - 1 : currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex + 1;
+              var nextIndex = direction === 'left' ? currentIndex === 0 ? splitInputsIds.length - 1 : currentIndex - 1 : currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex + 1;
               var nextOption = splitInputsIds.at(nextIndex);
               if (nextOption) {
                 setTimeout(function () {
@@ -5481,13 +5488,13 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
                 setFocusableSplitInputId(nextOption);
               }
             };
-            if (key === 'ArrowLeft') {
-              move('ArrowLeft');
+            if (isLeftArrow) {
+              move('left');
             }
-            if (key === 'ArrowRight') {
-              move('ArrowRight');
+            if (isRightArrow) {
+              move('right');
             }
-          case 5:
+          case 7:
           case "end":
             return _context2.stop();
         }
@@ -5500,6 +5507,7 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
     _onChange === null || _onChange === void 0 ? void 0 : _onChange(inputRef.current, '', false, getAllSplittingInputs());
   }
   function resetDefauleValueExist() {
+    // Does the current input box have a "valid default value"?
     if (!dateDefaultValueExist) setDateDefaultValueExist(true);
   }
   function resetPopupBlurStatus() {

package/Table/index.js

@@ -654,8 +654,8 @@ function tableElemScrolledInit(root, w) {
     });
   }
 }
-function cellMark(col, row) {
-  return "cell-".concat(col, "-").concat(row);
+function cellMark(row, col) {
+  return "cell-".concat(row, "-").concat(col);
 }
 function removeCellFocusClassName(root) {
   if (root) {
@@ -1027,7 +1027,7 @@ function useTableDraggable(_ref, deps) {
 }
 /* harmony default export */ const hooks_useTableDraggable = (useTableDraggable);
 ;// CONCATENATED MODULE: ./src/Table.tsx
-var _excluded = ["children", "wrapperClassName", "tableClassName", "bordered", "colGroup", "cellAutoWidth", "colSortable", "onColSort", "rowDraggable", "onRowDrag", "responsive", "enhancedResponsive", "enhancedResponsiveWithScrollBar", "data", "filterFields", "filterControlClassName", "filterControlPlaceholder", "filterLabel", "onChangeFilter", "dataSelected", "rowSelectable", "onChangeRowSelect", "keyboardFocusable", "onCellKeyPressed"];
+var _excluded = ["contentRef", "children", "wrapperClassName", "tableClassName", "bordered", "colGroup", "cellAutoWidth", "colSortable", "onColSort", "rowDraggable", "onRowDrag", "responsive", "enhancedResponsive", "enhancedResponsiveWithScrollBar", "data", "filterFields", "filterControlClassName", "filterControlPlaceholder", "filterLabel", "onChangeFilter", "dataSelected", "rowSelectable", "onChangeRowSelect", "keyboardFocusable", "onCellKeyPressed", "onCellPressEnter"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function Table_slicedToArray(arr, i) { return Table_arrayWithHoles(arr) || Table_iterableToArrayLimit(arr, i) || Table_unsupportedIterableToArray(arr, i) || Table_nonIterableRest(); }
 function Table_nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -1043,8 +1043,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.forwardRef)(function (_ref, externalRef) {
-  var children = _ref.children,
+  var contentRef = _ref.contentRef,
+    children = _ref.children,
     wrapperClassName = _ref.wrapperClassName,
     tableClassName = _ref.tableClassName,
     bordered = _ref.bordered,
@@ -1068,6 +1070,7 @@ var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_a
     onChangeRowSelect = _ref.onChangeRowSelect,
     keyboardFocusable = _ref.keyboardFocusable,
     onCellKeyPressed = _ref.onCellKeyPressed,
+    onCellPressEnter = _ref.onCellPressEnter,
     attributes = _objectWithoutProperties(_ref, _excluded);
   var uniqueID = useComId_default()();
   var rootRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
@@ -1139,6 +1142,32 @@ var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_a
       setSelectedItems(newSelectedItems);
     }
   }, [data, dataSelected]);
+
+  // Synchronous execution, which blocks rendering
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useLayoutEffect)(function () {
+    if (rootRef.current) {
+      // Initialize custom props of table elements
+      initRowColProps(rootRef.current);
+    }
+  }, [data]); // Re-run when data changes
+
+  // exposes the following methods
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useImperativeHandle)(contentRef, function () {
+    return {
+      setFocusableCell: function setFocusableCell(row, col) {
+        var _rootRef$current;
+        setFocusableCellId(cellMark(row, col));
+
+        // Find and focus the cell element
+        var cellElement = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.querySelector(".".concat(cellMark(row, col)));
+        if (cellElement) {
+          removeCellFocusClassName(rootRef.current);
+          cellElement.focus(); // !!!Required
+          cellElement.classList.add('cell-focus');
+        }
+      }
+    };
+  }, [rootRef]);
   return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((external_root_React_commonjs2_react_commonjs_react_amd_react_default()).Fragment, null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(TableProvider, {
     value: {
       originData: data,
@@ -1170,7 +1199,8 @@ var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_a
       refNode: refNode,
       focusableCellId: focusableCellId,
       setFocusableCellId: setFocusableCellId,
-      onCellKeyPressed: onCellKeyPressed
+      onCellKeyPressed: onCellKeyPressed,
+      onCellPressEnter: onCellPressEnter
     }
   }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", _extends({}, attributes, {
     id: uniqueID,
@@ -1252,7 +1282,8 @@ const App = () => {
         refNode,
         focusableCellId,
         setFocusableCellId,
-        onCellKeyPressed
+        onCellKeyPressed,
+        onCellPressEnter,
     }, [rootRef]);
     
 
@@ -1278,20 +1309,32 @@ var useTableKeyPress = function useTableKeyPress(_ref, deps) {
     focusableCellId = _ref.focusableCellId,
     setFocusableCellId = _ref.setFocusableCellId,
     onCellKeyPressed = _ref.onCellKeyPressed,
+    onCellPressEnter = _ref.onCellPressEnter,
     onKeyDown = _ref.onKeyDown;
   var handleKeyPressed = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useCallback)( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(event) {
-      var key, oldCellSignal, _row, _col, move;
+      var key, currentCell, row, col, nextCellSignal, oldCellSignal, _row, _col, move, _nextCellSignal;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
+            key = event.code;
+            if (!((key === 'Enter' || key === 'NumpadEnter') && !enabled)) {
+              _context.next = 8;
+              break;
+            }
+            currentCell = event.target;
+            row = Number(currentCell.getAttribute('data-table-row'));
+            col = Number(currentCell.getAttribute('data-table-col'));
+            nextCellSignal = cellMark(row, col);
+            onCellPressEnter === null || onCellPressEnter === void 0 ? void 0 : onCellPressEnter(nextCellSignal, refNode.current.get(nextCellSignal), event);
+            return _context.abrupt("return");
+          case 8:
             if (!(!Array.isArray(data) || rootDataInfo === null || spyElement === null || typeof enabled === 'undefined' || enabled === false)) {
-              _context.next = 2;
+              _context.next = 10;
               break;
             }
             return _context.abrupt("return");
-          case 2:
-            key = event.code;
+          case 10:
             oldCellSignal = focusableCellId === null || focusableCellId === void 0 ? void 0 : focusableCellId.replace('cell-', '').split('-');
             _row = Number(oldCellSignal[0]);
             _col = Number(oldCellSignal[1]);
@@ -1299,15 +1342,19 @@ var useTableKeyPress = function useTableKeyPress(_ref, deps) {
               var _spyElement$querySele;
               switch (key) {
                 case 'ArrowLeft':
+                case 'Numpad4':
                   _col = _col - 1 < 0 ? 0 : _col - 1;
                   break;
                 case 'ArrowRight':
+                case 'Numpad6':
                   _col = _col + 1 > data.length - 1 ? data.length - 1 : _col + 1;
                   break;
                 case 'ArrowUp':
+                case 'Numpad8':
                   _row = _row - 1 < 0 ? 0 : _row - 1;
                   break;
                 case 'ArrowDown':
+                case 'Numpad2':
                   _row = _row + 1 > rootDataInfo.totalRow - 1 ? rootDataInfo.totalRow - 1 : _row + 1;
                   break;
               }
@@ -1324,19 +1371,23 @@ var useTableKeyPress = function useTableKeyPress(_ref, deps) {
               onCellKeyPressed === null || onCellKeyPressed === void 0 ? void 0 : onCellKeyPressed(nextCellSignal, refNode.current.get(nextCellSignal), event);
               onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
             };
-            if (key === 'ArrowLeft') {
+            if (key === 'ArrowLeft' || key === 'Numpad4') {
               move('ArrowLeft');
             }
-            if (key === 'ArrowRight') {
+            if (key === 'ArrowRight' || key === 'Numpad6') {
               move('ArrowRight');
             }
-            if (key === 'ArrowUp') {
+            if (key === 'ArrowUp' || key === 'Numpad8') {
               move('ArrowUp');
             }
-            if (key === 'ArrowDown') {
+            if (key === 'ArrowDown' || key === 'Numpad2') {
               move('ArrowDown');
             }
-          case 11:
+            if (key === 'Enter' || key === 'NumpadEnter') {
+              _nextCellSignal = cellMark(_row, _col);
+              onCellPressEnter === null || onCellPressEnter === void 0 ? void 0 : onCellPressEnter(_nextCellSignal, refNode.current.get(_nextCellSignal), event);
+            }
+          case 19:
           case "end":
             return _context.stop();
         }
@@ -1402,7 +1453,8 @@ var TableCell = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_rea
     focusableCellId = _useContext.focusableCellId,
     setFocusableCellId = _useContext.setFocusableCellId,
     keyboardFocusable = _useContext.keyboardFocusable,
-    onCellKeyPressed = _useContext.onCellKeyPressed;
+    onCellKeyPressed = _useContext.onCellKeyPressed,
+    onCellPressEnter = _useContext.onCellPressEnter;
   var CellComponent = scope ? 'th' : 'td';
 
   // key press initialization
@@ -1416,6 +1468,7 @@ var TableCell = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_rea
       focusableCellId: focusableCellId,
       setFocusableCellId: setFocusableCellId,
       onCellKeyPressed: onCellKeyPressed,
+      onCellPressEnter: onCellPressEnter,
       onKeyDown: onKeyDown
     }, [rootRef]),
     handleKeyPressed = _useTableKeyPress.handleKeyPressed;

package/Utils/time.d.ts

@@ -9,6 +9,8 @@
 
 console.log(getTimeslots("10:00", "14:00", 60, true)); //['10:00 - 11:00', '11:00 - 12:00', '12:00 - 13:00', '13:00 - 14:00']
 console.log(getTimeslots("10:00", "14:00", 60));   // ['10:00', '11:00', '12:00', '13:00']
+console.log(getTimeslots("08:00:00", "08:02:00", 0.4));   // ['08:00:00', '08:00:24', '08:00:48', '08:01:12', '08:01:36', '08:02:00']
+
 */
 declare function getTimeslots(startTime: string, endTime: string, timeInterval: number, formatRange?: boolean): string[];
 /**

package/Utils/time.js

@@ -62,49 +62,54 @@ __webpack_require__.r(__webpack_exports__);
 
 console.log(getTimeslots("10:00", "14:00", 60, true)); //['10:00 - 11:00', '11:00 - 12:00', '12:00 - 13:00', '13:00 - 14:00']
 console.log(getTimeslots("10:00", "14:00", 60));   // ['10:00', '11:00', '12:00', '13:00']
+console.log(getTimeslots("08:00:00", "08:02:00", 0.4));   // ['08:00:00', '08:00:24', '08:00:48', '08:01:12', '08:01:36', '08:02:00']
+
 */
 
 function getTimeslots(startTime, endTime, timeInterval) {
   var formatRange = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  // Parse time string to seconds
   var parseTime = function parseTime(s) {
-    var c = s.split(':');
-    return parseInt(c[0]) * 60 + parseInt(c[1]);
-  };
-  var convertHours = function convertHours(mins) {
-    var hour = Math.floor(mins / 60);
-    mins = Math.trunc(mins % 60);
-    var converted = pad(hour, 2) + ':' + pad(mins, 2);
-    return converted;
+    var c = s.split(":").map(Number);
+    // Support HH:mm or HH:mm:ss
+    return c[0] * 3600 + c[1] * 60 + (c[2] || 0);
   };
+
+  // Pad with zeros
   var pad = function pad(str, max) {
     str = str.toString();
     return str.length < max ? pad("0" + str, max) : str;
   };
 
-  // calculate time slot
+  // Convert seconds to HH:mm:ss
+  var convertTime = function convertTime(secs) {
+    var hour = Math.floor(secs / 3600);
+    var min = Math.floor(secs % 3600 / 60);
+    var sec = secs % 60;
+    return pad(hour, 2) + ":" + pad(min, 2) + ":" + pad(sec, 2);
+  };
+
+  // Calculate time slots
   var calculateTimeSlot = function calculateTimeSlot(_startTime, _endTime, _timeInterval) {
     var timeSlots = [];
-    // Round start and end times to next 30 min interval
-    _startTime = Math.ceil(_startTime / 30) * 30;
-    _endTime = Math.ceil(_endTime / 30) * 30;
-
-    // Start and end of interval in the loop
     var currentTime = _startTime;
-    while (currentTime < _endTime) {
+    while (currentTime <= _endTime) {
       if (formatRange) {
-        var t = convertHours(currentTime) + ' - ' + convertHours(currentTime + _timeInterval);
+        var t = convertTime(currentTime) + ' - ' + convertTime(Math.min(currentTime + _timeInterval, _endTime));
         timeSlots.push(t);
       } else {
-        timeSlots.push(convertHours(currentTime));
+        timeSlots.push(convertTime(currentTime));
       }
       currentTime += _timeInterval;
     }
     return timeSlots;
   };
-  var inputEndTime = parseTime(endTime);
   var inputStartTime = parseTime(startTime);
-  var timeSegment = calculateTimeSlot(inputStartTime, inputEndTime, timeInterval);
-  return timeSegment;
+  var inputEndTime = parseTime(endTime);
+  // If timeInterval is not an integer, treat as minutes with decimals, convert to seconds
+  var isDecimal = !Number.isInteger(timeInterval);
+  var intervalInSeconds = isDecimal ? Math.round(timeInterval * 60) : timeInterval * 60;
+  return calculateTimeSlot(inputStartTime, inputEndTime, intervalInSeconds);
 }
 
 /**

package/lib/cjs/Date/index.js

@@ -5424,9 +5424,14 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
 
     e.target.select();
     resetDefauleValueExist();
-    var _date = "".concat(splitVals[0], "-").concat(splitVals[1], "-").concat(splitVals[2]);
-    var _full = "".concat(_date, " ").concat(splitVals[3], ":").concat(splitVals[4], ":").concat(splitVals[5]);
-    _onChange === null || _onChange === void 0 ? void 0 : _onChange(inputRef.current, valueResConverter(_full), (0,cjs_date.isValidDate)(_full), getAllSplittingInputs());
+
+    // If there is no valid default value in the input field, 
+    // onChange should be triggered only after the resetDefauleValueExist() function is processed
+    if (!dateDefaultValueExist) {
+      var _date = "".concat(splitVals[0], "-").concat(splitVals[1], "-").concat(splitVals[2]);
+      var _full = "".concat(_date, " ").concat(splitVals[3], ":").concat(splitVals[4], ":").concat(splitVals[5]);
+      _onChange === null || _onChange === void 0 ? void 0 : _onChange(inputRef.current, valueResConverter(_full), (0,cjs_date.isValidDate)(_full), getAllSplittingInputs());
+    }
   }
   function handleKeyPressed(_x2) {
     return _handleKeyPressed.apply(this, arguments);
@@ -5461,17 +5466,19 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
   }
   function _handleKeyPressedForSplitInputs() {
     _handleKeyPressedForSplitInputs = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(event) {
-      var key, btnMark, move;
+      var key, btnMark, isLeftArrow, isRightArrow, move;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
             key = event.code;
-            btnMark = event.target.dataset.mark;
-            move = function move(key) {
+            btnMark = event.target.dataset.mark; // Check for both regular arrow keys and numpad arrow keys
+            isLeftArrow = key === 'ArrowLeft' || key === 'Numpad4';
+            isRightArrow = key === 'ArrowRight' || key === 'Numpad6';
+            move = function move(direction) {
               var currentIndex = splitInputsIds.findIndex(function (s) {
                 return s === btnMark;
               });
-              var nextIndex = key === 'ArrowLeft' ? currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex - 1 : currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex + 1;
+              var nextIndex = direction === 'left' ? currentIndex === 0 ? splitInputsIds.length - 1 : currentIndex - 1 : currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex + 1;
               var nextOption = splitInputsIds.at(nextIndex);
               if (nextOption) {
                 setTimeout(function () {
@@ -5481,13 +5488,13 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
                 setFocusableSplitInputId(nextOption);
               }
             };
-            if (key === 'ArrowLeft') {
-              move('ArrowLeft');
+            if (isLeftArrow) {
+              move('left');
             }
-            if (key === 'ArrowRight') {
-              move('ArrowRight');
+            if (isRightArrow) {
+              move('right');
             }
-          case 5:
+          case 7:
           case "end":
             return _context2.stop();
         }
@@ -5500,6 +5507,7 @@ var src_Date = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_reac
     _onChange === null || _onChange === void 0 ? void 0 : _onChange(inputRef.current, '', false, getAllSplittingInputs());
   }
   function resetDefauleValueExist() {
+    // Does the current input box have a "valid default value"?
     if (!dateDefaultValueExist) setDateDefaultValueExist(true);
   }
   function resetPopupBlurStatus() {

package/lib/cjs/Table/index.js

@@ -654,8 +654,8 @@ function tableElemScrolledInit(root, w) {
     });
   }
 }
-function cellMark(col, row) {
-  return "cell-".concat(col, "-").concat(row);
+function cellMark(row, col) {
+  return "cell-".concat(row, "-").concat(col);
 }
 function removeCellFocusClassName(root) {
   if (root) {
@@ -1027,7 +1027,7 @@ function useTableDraggable(_ref, deps) {
 }
 /* harmony default export */ const hooks_useTableDraggable = (useTableDraggable);
 ;// CONCATENATED MODULE: ./src/Table.tsx
-var _excluded = ["children", "wrapperClassName", "tableClassName", "bordered", "colGroup", "cellAutoWidth", "colSortable", "onColSort", "rowDraggable", "onRowDrag", "responsive", "enhancedResponsive", "enhancedResponsiveWithScrollBar", "data", "filterFields", "filterControlClassName", "filterControlPlaceholder", "filterLabel", "onChangeFilter", "dataSelected", "rowSelectable", "onChangeRowSelect", "keyboardFocusable", "onCellKeyPressed"];
+var _excluded = ["contentRef", "children", "wrapperClassName", "tableClassName", "bordered", "colGroup", "cellAutoWidth", "colSortable", "onColSort", "rowDraggable", "onRowDrag", "responsive", "enhancedResponsive", "enhancedResponsiveWithScrollBar", "data", "filterFields", "filterControlClassName", "filterControlPlaceholder", "filterLabel", "onChangeFilter", "dataSelected", "rowSelectable", "onChangeRowSelect", "keyboardFocusable", "onCellKeyPressed", "onCellPressEnter"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function Table_slicedToArray(arr, i) { return Table_arrayWithHoles(arr) || Table_iterableToArrayLimit(arr, i) || Table_unsupportedIterableToArray(arr, i) || Table_nonIterableRest(); }
 function Table_nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -1043,8 +1043,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 
 
+
 var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.forwardRef)(function (_ref, externalRef) {
-  var children = _ref.children,
+  var contentRef = _ref.contentRef,
+    children = _ref.children,
     wrapperClassName = _ref.wrapperClassName,
     tableClassName = _ref.tableClassName,
     bordered = _ref.bordered,
@@ -1068,6 +1070,7 @@ var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_a
     onChangeRowSelect = _ref.onChangeRowSelect,
     keyboardFocusable = _ref.keyboardFocusable,
     onCellKeyPressed = _ref.onCellKeyPressed,
+    onCellPressEnter = _ref.onCellPressEnter,
     attributes = _objectWithoutProperties(_ref, _excluded);
   var uniqueID = useComId_default()();
   var rootRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
@@ -1139,6 +1142,32 @@ var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_a
       setSelectedItems(newSelectedItems);
     }
   }, [data, dataSelected]);
+
+  // Synchronous execution, which blocks rendering
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useLayoutEffect)(function () {
+    if (rootRef.current) {
+      // Initialize custom props of table elements
+      initRowColProps(rootRef.current);
+    }
+  }, [data]); // Re-run when data changes
+
+  // exposes the following methods
+  (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useImperativeHandle)(contentRef, function () {
+    return {
+      setFocusableCell: function setFocusableCell(row, col) {
+        var _rootRef$current;
+        setFocusableCellId(cellMark(row, col));
+
+        // Find and focus the cell element
+        var cellElement = (_rootRef$current = rootRef.current) === null || _rootRef$current === void 0 ? void 0 : _rootRef$current.querySelector(".".concat(cellMark(row, col)));
+        if (cellElement) {
+          removeCellFocusClassName(rootRef.current);
+          cellElement.focus(); // !!!Required
+          cellElement.classList.add('cell-focus');
+        }
+      }
+    };
+  }, [rootRef]);
   return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement((external_root_React_commonjs2_react_commonjs_react_amd_react_default()).Fragment, null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement(TableProvider, {
     value: {
       originData: data,
@@ -1170,7 +1199,8 @@ var Table = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_a
       refNode: refNode,
       focusableCellId: focusableCellId,
       setFocusableCellId: setFocusableCellId,
-      onCellKeyPressed: onCellKeyPressed
+      onCellKeyPressed: onCellKeyPressed,
+      onCellPressEnter: onCellPressEnter
     }
   }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().createElement("div", _extends({}, attributes, {
     id: uniqueID,
@@ -1252,7 +1282,8 @@ const App = () => {
         refNode,
         focusableCellId,
         setFocusableCellId,
-        onCellKeyPressed
+        onCellKeyPressed,
+        onCellPressEnter,
     }, [rootRef]);
     
 
@@ -1278,20 +1309,32 @@ var useTableKeyPress = function useTableKeyPress(_ref, deps) {
     focusableCellId = _ref.focusableCellId,
     setFocusableCellId = _ref.setFocusableCellId,
     onCellKeyPressed = _ref.onCellKeyPressed,
+    onCellPressEnter = _ref.onCellPressEnter,
     onKeyDown = _ref.onKeyDown;
   var handleKeyPressed = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useCallback)( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(event) {
-      var key, oldCellSignal, _row, _col, move;
+      var key, currentCell, row, col, nextCellSignal, oldCellSignal, _row, _col, move, _nextCellSignal;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
+            key = event.code;
+            if (!((key === 'Enter' || key === 'NumpadEnter') && !enabled)) {
+              _context.next = 8;
+              break;
+            }
+            currentCell = event.target;
+            row = Number(currentCell.getAttribute('data-table-row'));
+            col = Number(currentCell.getAttribute('data-table-col'));
+            nextCellSignal = cellMark(row, col);
+            onCellPressEnter === null || onCellPressEnter === void 0 ? void 0 : onCellPressEnter(nextCellSignal, refNode.current.get(nextCellSignal), event);
+            return _context.abrupt("return");
+          case 8:
             if (!(!Array.isArray(data) || rootDataInfo === null || spyElement === null || typeof enabled === 'undefined' || enabled === false)) {
-              _context.next = 2;
+              _context.next = 10;
               break;
             }
             return _context.abrupt("return");
-          case 2:
-            key = event.code;
+          case 10:
             oldCellSignal = focusableCellId === null || focusableCellId === void 0 ? void 0 : focusableCellId.replace('cell-', '').split('-');
             _row = Number(oldCellSignal[0]);
             _col = Number(oldCellSignal[1]);
@@ -1299,15 +1342,19 @@ var useTableKeyPress = function useTableKeyPress(_ref, deps) {
               var _spyElement$querySele;
               switch (key) {
                 case 'ArrowLeft':
+                case 'Numpad4':
                   _col = _col - 1 < 0 ? 0 : _col - 1;
                   break;
                 case 'ArrowRight':
+                case 'Numpad6':
                   _col = _col + 1 > data.length - 1 ? data.length - 1 : _col + 1;
                   break;
                 case 'ArrowUp':
+                case 'Numpad8':
                   _row = _row - 1 < 0 ? 0 : _row - 1;
                   break;
                 case 'ArrowDown':
+                case 'Numpad2':
                   _row = _row + 1 > rootDataInfo.totalRow - 1 ? rootDataInfo.totalRow - 1 : _row + 1;
                   break;
               }
@@ -1324,19 +1371,23 @@ var useTableKeyPress = function useTableKeyPress(_ref, deps) {
               onCellKeyPressed === null || onCellKeyPressed === void 0 ? void 0 : onCellKeyPressed(nextCellSignal, refNode.current.get(nextCellSignal), event);
               onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
             };
-            if (key === 'ArrowLeft') {
+            if (key === 'ArrowLeft' || key === 'Numpad4') {
               move('ArrowLeft');
             }
-            if (key === 'ArrowRight') {
+            if (key === 'ArrowRight' || key === 'Numpad6') {
               move('ArrowRight');
             }
-            if (key === 'ArrowUp') {
+            if (key === 'ArrowUp' || key === 'Numpad8') {
               move('ArrowUp');
             }
-            if (key === 'ArrowDown') {
+            if (key === 'ArrowDown' || key === 'Numpad2') {
               move('ArrowDown');
             }
-          case 11:
+            if (key === 'Enter' || key === 'NumpadEnter') {
+              _nextCellSignal = cellMark(_row, _col);
+              onCellPressEnter === null || onCellPressEnter === void 0 ? void 0 : onCellPressEnter(_nextCellSignal, refNode.current.get(_nextCellSignal), event);
+            }
+          case 19:
           case "end":
             return _context.stop();
         }
@@ -1402,7 +1453,8 @@ var TableCell = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_rea
     focusableCellId = _useContext.focusableCellId,
     setFocusableCellId = _useContext.setFocusableCellId,
     keyboardFocusable = _useContext.keyboardFocusable,
-    onCellKeyPressed = _useContext.onCellKeyPressed;
+    onCellKeyPressed = _useContext.onCellKeyPressed,
+    onCellPressEnter = _useContext.onCellPressEnter;
   var CellComponent = scope ? 'th' : 'td';
 
   // key press initialization
@@ -1416,6 +1468,7 @@ var TableCell = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_rea
       focusableCellId: focusableCellId,
       setFocusableCellId: setFocusableCellId,
       onCellKeyPressed: onCellKeyPressed,
+      onCellPressEnter: onCellPressEnter,
       onKeyDown: onKeyDown
     }, [rootRef]),
     handleKeyPressed = _useTableKeyPress.handleKeyPressed;

package/lib/cjs/Utils/time.d.ts

@@ -9,6 +9,8 @@
 
 console.log(getTimeslots("10:00", "14:00", 60, true)); //['10:00 - 11:00', '11:00 - 12:00', '12:00 - 13:00', '13:00 - 14:00']
 console.log(getTimeslots("10:00", "14:00", 60));   // ['10:00', '11:00', '12:00', '13:00']
+console.log(getTimeslots("08:00:00", "08:02:00", 0.4));   // ['08:00:00', '08:00:24', '08:00:48', '08:01:12', '08:01:36', '08:02:00']
+
 */
 declare function getTimeslots(startTime: string, endTime: string, timeInterval: number, formatRange?: boolean): string[];
 /**

package/lib/cjs/Utils/time.js

@@ -62,49 +62,54 @@ __webpack_require__.r(__webpack_exports__);
 
 console.log(getTimeslots("10:00", "14:00", 60, true)); //['10:00 - 11:00', '11:00 - 12:00', '12:00 - 13:00', '13:00 - 14:00']
 console.log(getTimeslots("10:00", "14:00", 60));   // ['10:00', '11:00', '12:00', '13:00']
+console.log(getTimeslots("08:00:00", "08:02:00", 0.4));   // ['08:00:00', '08:00:24', '08:00:48', '08:01:12', '08:01:36', '08:02:00']
+
 */
 
 function getTimeslots(startTime, endTime, timeInterval) {
   var formatRange = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  // Parse time string to seconds
   var parseTime = function parseTime(s) {
-    var c = s.split(':');
-    return parseInt(c[0]) * 60 + parseInt(c[1]);
-  };
-  var convertHours = function convertHours(mins) {
-    var hour = Math.floor(mins / 60);
-    mins = Math.trunc(mins % 60);
-    var converted = pad(hour, 2) + ':' + pad(mins, 2);
-    return converted;
+    var c = s.split(":").map(Number);
+    // Support HH:mm or HH:mm:ss
+    return c[0] * 3600 + c[1] * 60 + (c[2] || 0);
   };
+
+  // Pad with zeros
   var pad = function pad(str, max) {
     str = str.toString();
     return str.length < max ? pad("0" + str, max) : str;
   };
 
-  // calculate time slot
+  // Convert seconds to HH:mm:ss
+  var convertTime = function convertTime(secs) {
+    var hour = Math.floor(secs / 3600);
+    var min = Math.floor(secs % 3600 / 60);
+    var sec = secs % 60;
+    return pad(hour, 2) + ":" + pad(min, 2) + ":" + pad(sec, 2);
+  };
+
+  // Calculate time slots
   var calculateTimeSlot = function calculateTimeSlot(_startTime, _endTime, _timeInterval) {
     var timeSlots = [];
-    // Round start and end times to next 30 min interval
-    _startTime = Math.ceil(_startTime / 30) * 30;
-    _endTime = Math.ceil(_endTime / 30) * 30;
-
-    // Start and end of interval in the loop
     var currentTime = _startTime;
-    while (currentTime < _endTime) {
+    while (currentTime <= _endTime) {
       if (formatRange) {
-        var t = convertHours(currentTime) + ' - ' + convertHours(currentTime + _timeInterval);
+        var t = convertTime(currentTime) + ' - ' + convertTime(Math.min(currentTime + _timeInterval, _endTime));
         timeSlots.push(t);
       } else {
-        timeSlots.push(convertHours(currentTime));
+        timeSlots.push(convertTime(currentTime));
       }
       currentTime += _timeInterval;
     }
     return timeSlots;
   };
-  var inputEndTime = parseTime(endTime);
   var inputStartTime = parseTime(startTime);
-  var timeSegment = calculateTimeSlot(inputStartTime, inputEndTime, timeInterval);
-  return timeSegment;
+  var inputEndTime = parseTime(endTime);
+  // If timeInterval is not an integer, treat as minutes with decimals, convert to seconds
+  var isDecimal = !Number.isInteger(timeInterval);
+  var intervalInSeconds = isDecimal ? Math.round(timeInterval * 60) : timeInterval * 60;
+  return calculateTimeSlot(inputStartTime, inputEndTime, intervalInSeconds);
 }
 
 /**

package/lib/esm/Date/index.tsx

@@ -641,12 +641,17 @@ const Date = forwardRef((props: DateProps, externalRef: any) => {
 
         e.target.select();
 
+        
         resetDefauleValueExist();
 
+        // If there is no valid default value in the input field, 
+        // onChange should be triggered only after the resetDefauleValueExist() function is processed
+        if (!dateDefaultValueExist) {
+            const _date = `${splitVals[0]}-${splitVals[1]}-${splitVals[2]}`;
+            const _full = `${_date} ${splitVals[3]}:${splitVals[4]}:${splitVals[5]}`;
+            onChange?.(inputRef.current, valueResConverter(_full), isValidDate(_full), getAllSplittingInputs());
+        }
 
-        const _date = `${splitVals[0]}-${splitVals[1]}-${splitVals[2]}`;
-        const _full = `${_date} ${splitVals[3]}:${splitVals[4]}:${splitVals[5]}`;
-        onChange?.(inputRef.current, valueResConverter(_full), isValidDate(_full), getAllSplittingInputs());
 
     }
 
@@ -670,9 +675,17 @@ const Date = forwardRef((props: DateProps, externalRef: any) => {
     async function handleKeyPressedForSplitInputs(event: KeyboardEvent<HTMLDivElement>) {
         const key = event.code;
         const btnMark = (event.target as any).dataset.mark;
-        const move = (key: string) => {
+        
+        // Check for both regular arrow keys and numpad arrow keys
+        const isLeftArrow = key === 'ArrowLeft' || key === 'Numpad4';
+        const isRightArrow = key === 'ArrowRight' || key === 'Numpad6';
+        
+        const move = (direction: 'left' | 'right') => {
             const currentIndex = splitInputsIds.findIndex((s: string) => s === btnMark);
-            const nextIndex = key === 'ArrowLeft' ? currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex - 1 : currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex + 1;
+            const nextIndex = direction === 'left' 
+                ? currentIndex === 0 ? splitInputsIds.length - 1 : currentIndex - 1 
+                : currentIndex === splitInputsIds.length - 1 ? 0 : currentIndex + 1;
+                
             const nextOption = splitInputsIds.at(nextIndex);
             if (nextOption) {
                 setTimeout(() => {
@@ -681,13 +694,13 @@ const Date = forwardRef((props: DateProps, externalRef: any) => {
                 setFocusableSplitInputId(nextOption);
             }
         };
-      
-        if (key === 'ArrowLeft') {
-            move('ArrowLeft');
+
+        if (isLeftArrow) {
+            move('left');
         }
 
-        if (key === 'ArrowRight') {
-            move('ArrowRight');
+        if (isRightArrow) {
+            move('right');
         }
     }
 
@@ -700,6 +713,7 @@ const Date = forwardRef((props: DateProps, externalRef: any) => {
 
 
     function resetDefauleValueExist() {
+        // Does the current input box have a "valid default value"?
         if (!dateDefaultValueExist) setDateDefaultValueExist(true);
     }
 

package/lib/esm/Table/Table.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState, forwardRef, useRef } from 'react';
+import React, { useEffect, useState, forwardRef, useRef, useLayoutEffect, useImperativeHandle } from 'react';
 
 
 import useComId from 'funda-utils/dist/cjs/useComId';
@@ -8,9 +8,11 @@ import { clsWrite, combinedCls } from 'funda-utils/dist/cjs/cls';
 import { TableProvider } from './TableContext';
 import useTableResponsive from './utils/hooks/useTableResponsive';
 import useTableDraggable from './utils/hooks/useTableDraggable';
-
+import { cellMark, removeCellFocusClassName, initRowColProps } from './utils/func';
 
 export interface TableProps extends React.HTMLAttributes<HTMLDivElement> {
+    // content ref
+    contentRef?: React.ForwardedRef<any>; // could use "Array" on contentRef.current, such as contentRef.current[0], contentRef.current[1]
 
     // basic
     wrapperClassName?: string;
@@ -48,11 +50,15 @@ export interface TableProps extends React.HTMLAttributes<HTMLDivElement> {
     // key press
     keyboardFocusable?: boolean;
     onCellKeyPressed?: (classname: string, elem: HTMLTableCellElement, event: KeyboardEvent) => void;
+    onCellPressEnter?: (classname: string, elem: HTMLTableCellElement, event: KeyboardEvent) => void;
+    
 }
 
 
 const Table = forwardRef<HTMLDivElement, TableProps>((
     {
+        contentRef,
+        
         // basic
         children,
         wrapperClassName,
@@ -90,6 +96,7 @@ const Table = forwardRef<HTMLDivElement, TableProps>((
         // key press
         keyboardFocusable,
         onCellKeyPressed,
+        onCellPressEnter,
 
         ...attributes
     },
@@ -162,6 +169,33 @@ const Table = forwardRef<HTMLDivElement, TableProps>((
         }
     }, [data, dataSelected]);
 
+    // Synchronous execution, which blocks rendering
+    useLayoutEffect(() => {
+        if (rootRef.current) {
+            // Initialize custom props of table elements
+            initRowColProps(rootRef.current);
+        }
+    }, [data]); // Re-run when data changes
+
+
+    // exposes the following methods
+    useImperativeHandle(contentRef, () => ({
+        setFocusableCell: (row: number, col: number) => {
+            
+            setFocusableCellId(cellMark(row, col));
+
+            // Find and focus the cell element
+            const cellElement = rootRef.current?.querySelector(`.${cellMark(row, col)}`);
+            if (cellElement) {
+                removeCellFocusClassName(rootRef.current);
+                cellElement.focus(); // !!!Required
+                cellElement.classList.add('cell-focus');
+            }
+
+
+        },
+    }), [rootRef]);
+
     return (
         <>
 
@@ -202,6 +236,7 @@ const Table = forwardRef<HTMLDivElement, TableProps>((
                 focusableCellId,
                 setFocusableCellId,
                 onCellKeyPressed,
+                onCellPressEnter,
 
 
             }}>

package/lib/esm/Table/TableCell.tsx

@@ -2,8 +2,6 @@ import React, { forwardRef, useContext } from 'react';
 
 import { clsWrite, combinedCls } from 'funda-utils/dist/cjs/cls';
 
-
-
 import { TableContext } from './TableContext';
 
 import { cellMark, removeCellFocusClassName } from './utils/func';
@@ -48,6 +46,7 @@ const TableCell = forwardRef<HTMLTableCellElement, TableCellProps>((
         setFocusableCellId,
         keyboardFocusable,
         onCellKeyPressed,
+        onCellPressEnter,
      } = useContext(TableContext);
 
 
@@ -64,6 +63,7 @@ const TableCell = forwardRef<HTMLTableCellElement, TableCellProps>((
         focusableCellId,
         setFocusableCellId,
         onCellKeyPressed,
+        onCellPressEnter,
         onKeyDown
     }, [rootRef]);
     

package/lib/esm/Table/utils/func.ts

@@ -158,8 +158,8 @@ export function tableElemScrolledInit(root: HTMLDivElement, w: number) {
 }
 
 
-export function cellMark(col: number | string | undefined, row: number | string | undefined) {
-    return `cell-${col}-${row}`;
+export function cellMark(row: number | string | undefined, col: number | string | undefined) {
+    return `cell-${row}-${col}`;
 }
 
 export function removeCellFocusClassName(root: any) {

package/lib/esm/Table/utils/hooks/useTableKeyPress.tsx

@@ -22,7 +22,8 @@ const App = () => {
         refNode,
         focusableCellId,
         setFocusableCellId,
-        onCellKeyPressed
+        onCellKeyPressed,
+        onCellPressEnter,
     }, [rootRef]);
     
 
@@ -50,6 +51,7 @@ export interface UseTableKeyPressProps {
     focusableCellId: string;
     setFocusableCellId: (s: string) => void;
     onCellKeyPressed: (classname: string, elem: HTMLTableCellElement, event: KeyboardEvent) => void;
+    onCellPressEnter: (classname: string, elem: HTMLTableCellElement, event: KeyboardEvent) => void;
     onKeyDown?: (e: any) => void;
 }
 
@@ -64,13 +66,24 @@ const useTableKeyPress = ({
     focusableCellId,
     setFocusableCellId,
     onCellKeyPressed,
+    onCellPressEnter,
     onKeyDown
 }: UseTableKeyPressProps, deps: any[]) => {
    
     const handleKeyPressed = useCallback( async (event: KeyboardEvent<HTMLTableCellElement>) => {
+        const key = event.code;
+
+        if ((key === 'Enter' || key === 'NumpadEnter') && !enabled) {
+            const currentCell = event.target as HTMLTableCellElement;
+            const row = Number(currentCell.getAttribute('data-table-row'));
+            const col = Number(currentCell.getAttribute('data-table-col'));
+            const nextCellSignal: string = cellMark(row, col);
+            onCellPressEnter?.(nextCellSignal, refNode.current.get(nextCellSignal), event);
+            return;
+        }
+
         if (!Array.isArray(data) || rootDataInfo === null || spyElement === null || typeof enabled === 'undefined' || enabled === false) return;
 
-        const key = event.code;
         const oldCellSignal = focusableCellId?.replace('cell-', '').split('-');
         let _row = Number(oldCellSignal[0]);
         let _col = Number(oldCellSignal[1]);
@@ -80,15 +93,19 @@ const useTableKeyPress = ({
   
             switch (key) {
                 case 'ArrowLeft':
+                case 'Numpad4':
                     _col = _col - 1 < 0 ? 0 : _col - 1;
                 break;
                 case 'ArrowRight':
+                case 'Numpad6':
                     _col = _col + 1 > data.length - 1 ? data.length -1 : _col + 1;
                 break;
                 case 'ArrowUp':
+                case 'Numpad8':
                     _row =  _row - 1 < 0 ? 0 : _row - 1;
                 break;
                 case 'ArrowDown':
+                case 'Numpad2':
                     _row = _row + 1 > rootDataInfo.totalRow - 1 ? rootDataInfo.totalRow - 1 : _row + 1;
                 break;
             }
@@ -109,23 +126,28 @@ const useTableKeyPress = ({
 
         };
       
-        if (key === 'ArrowLeft') {
+        if (key === 'ArrowLeft' || key === 'Numpad4') {
             move('ArrowLeft');
         }
 
-        if (key === 'ArrowRight') {
+        if (key === 'ArrowRight' || key === 'Numpad6') {
             move('ArrowRight');
         }
 
       
-        if (key === 'ArrowUp') {
+        if (key === 'ArrowUp' || key === 'Numpad8') {
             move('ArrowUp');
         }
 
-        if (key === 'ArrowDown') {
+        if (key === 'ArrowDown' || key === 'Numpad2') {
             move('ArrowDown');
         }
 
+        if (key === 'Enter' || key === 'NumpadEnter') {
+            const nextCellSignal: string = cellMark(_row, _col);
+            onCellPressEnter?.(nextCellSignal, refNode.current.get(nextCellSignal), event);
+        }        
+
     }, [focusableCellId]);
 
     useEffect(() => {

package/lib/esm/Utils/libs/time.ts

@@ -9,6 +9,8 @@
 
 console.log(getTimeslots("10:00", "14:00", 60, true)); //['10:00 - 11:00', '11:00 - 12:00', '12:00 - 13:00', '13:00 - 14:00']
 console.log(getTimeslots("10:00", "14:00", 60));   // ['10:00', '11:00', '12:00', '13:00']
+console.log(getTimeslots("08:00:00", "08:02:00", 0.4));   // ['08:00:00', '08:00:24', '08:00:48', '08:01:12', '08:01:36', '08:02:00']
+
 */
 
 function getTimeslots(
@@ -17,49 +19,49 @@ function getTimeslots(
     timeInterval: number,
     formatRange: boolean = false
 ): string[] {
+    // Parse time string to seconds
     const parseTime = (s: string): number => {
-        const c = s.split(':');
-        return parseInt(c[0]) * 60 + parseInt(c[1]);
-    }
-
-    const convertHours = (mins: number): string => {
-        const hour = Math.floor(mins / 60);
-        mins = Math.trunc(mins % 60);
-        const converted = pad(hour, 2) + ':' + pad(mins, 2);
-        return converted;
+        const c = s.split(":").map(Number);
+        // Support HH:mm or HH:mm:ss
+        return c[0] * 3600 + c[1] * 60 + (c[2] || 0);
     }
 
+    // Pad with zeros
     const pad = (str: string | number, max: number): string => {
         str = str.toString();
         return str.length < max ? pad("0" + str, max) : str;
     }
 
-    // calculate time slot
+    // Convert seconds to HH:mm:ss
+    const convertTime = (secs: number): string => {
+        const hour = Math.floor(secs / 3600);
+        const min = Math.floor((secs % 3600) / 60);
+        const sec = secs % 60;
+        return pad(hour, 2) + ":" + pad(min, 2) + ":" + pad(sec, 2);
+    }
+
+    // Calculate time slots
     const calculateTimeSlot = (_startTime: number, _endTime: number, _timeInterval: number): string[] => {
         const timeSlots: string[] = [];
-        // Round start and end times to next 30 min interval
-        _startTime = Math.ceil(_startTime / 30) * 30;
-        _endTime = Math.ceil(_endTime / 30) * 30;
-
-        // Start and end of interval in the loop
         let currentTime = _startTime;
-        while (currentTime < _endTime) {
+        while (currentTime <= _endTime) {
             if (formatRange) {
-                const t = convertHours(currentTime) + ' - ' + convertHours(currentTime + _timeInterval);
+                const t = convertTime(currentTime) + ' - ' + convertTime(Math.min(currentTime + _timeInterval, _endTime));
                 timeSlots.push(t);
             } else {
-                timeSlots.push(convertHours(currentTime));
+                timeSlots.push(convertTime(currentTime));
             }
             currentTime += _timeInterval;
         }
         return timeSlots;
     }
 
-    const inputEndTime = parseTime(endTime);
     const inputStartTime = parseTime(startTime);
-    const timeSegment = calculateTimeSlot(inputStartTime, inputEndTime, timeInterval);
-
-    return timeSegment;
+    const inputEndTime = parseTime(endTime);
+    // If timeInterval is not an integer, treat as minutes with decimals, convert to seconds
+    const isDecimal = !Number.isInteger(timeInterval);
+    const intervalInSeconds = isDecimal ? Math.round(timeInterval * 60) : timeInterval * 60;
+    return calculateTimeSlot(inputStartTime, inputEndTime, intervalInSeconds);
 }
 
 

package/package.json

@@ -2,7 +2,7 @@
   "author": "UIUX Lab",
   "email": "uiuxlab@gmail.com",
   "name": "funda-ui",
-  "version": "4.7.212",
+  "version": "4.7.222",
   "description": "React components using pure Bootstrap 5+ which does not contain any external style and script libraries.",
   "repository": {
     "type": "git",