abdul-react 0.0.28 → 0.0.30

package/lib/index.cjs

@@ -1118,6 +1118,12 @@ const SvgPromptSlider = (props) => /* @__PURE__ */ React__namespace.createElemen
 
 const SvgSendPrompt = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M6.2121 17.0818L1.79324 14.7317C0.415403 13.9989 0.398933 12.0304 1.76432 11.2747L20.3297 0.99879C21.7646 0.204609 23.4845 1.41198 23.2242 3.03154L20.2405 21.5944C20.0264 22.9262 18.5657 23.652 17.3749 23.0186L13.2778 20.8396L12.026 22.0913C10.9194 23.1977 9.02629 22.6316 8.70919 21.0991L8.10664 18.1872L14.625 10.125L6.2121 17.0818Z", fill: "url(#paint0_linear_536_25608)" }), /* @__PURE__ */ React__namespace.createElement("defs", null, /* @__PURE__ */ React__namespace.createElement("linearGradient", { id: "paint0_linear_536_25608", x1: 29.4923, y1: 27.7972, x2: 9.5325, y2: 4.44898, gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React__namespace.createElement("stop", { offset: 265844e-8, stopColor: "#FF37DF" }), /* @__PURE__ */ React__namespace.createElement("stop", { offset: 1, stopColor: "#6E00FF" }))));
 
+const SvgAccessKey = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("g", { clipPath: "url(#clip0_3902_42568)" }, /* @__PURE__ */ React__namespace.createElement("g", { clipPath: "url(#clip1_3902_42568)" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M18.459 5.54089C17.5953 4.67748 16.4581 4.14136 15.2425 4.02443C14.0268 3.9075 12.8084 4.21704 11.7959 4.89999C10.7835 5.58295 10.0401 6.59679 9.6932 7.76775C9.34631 8.93871 9.4175 10.1939 9.89458 11.3181C7.90552 13.0585 6.03051 14.925 4.28114 16.9062C4.07802 17.1353 3.98021 17.4531 4.00333 17.7771C4.03854 18.2732 4.06489 18.7599 4.08239 19.2371C4.0869 19.4162 4.16006 19.5867 4.28674 19.7134C4.41342 19.8401 4.58393 19.9133 4.76302 19.9178C5.23927 19.934 5.72677 19.9615 6.22271 19.9965C6.54677 20.0196 6.86458 19.9215 7.09489 19.7181C7.20448 19.6212 7.31375 19.524 7.42271 19.4265C7.50553 19.3526 7.559 19.2513 7.57333 19.1412C7.60979 18.8725 7.64385 18.601 7.67552 18.3268C7.72396 17.9081 8.10364 17.6346 8.54521 17.7153C9.35552 17.8646 9.99302 17.2434 9.84677 16.434V16.4278C9.76802 15.9865 10.0446 15.609 10.469 15.5671C10.7427 15.5399 11.0149 15.5111 11.2855 15.4809C11.3974 15.4692 11.5013 15.4172 11.5777 15.3346C11.9515 14.9303 12.3198 14.5207 12.6827 14.1059C13.807 14.5828 15.0621 14.6539 16.2331 14.3069C17.404 13.9599 18.4177 13.2164 19.1006 12.2039C19.7834 11.1913 20.0928 9.97284 19.9758 8.75721C19.8587 7.54157 19.3225 6.4045 18.459 5.54089ZM17.0936 8.96433C16.8901 9.16775 16.6309 9.30627 16.3486 9.36236C16.0664 9.41845 15.7739 9.3896 15.5081 9.27945C15.2422 9.16931 15.015 8.98282 14.8552 8.74356C14.6953 8.5043 14.61 8.22301 14.61 7.93527C14.61 7.64752 14.6953 7.36624 14.8552 7.12698C15.015 6.88772 15.2422 6.70123 15.5081 6.59108C15.7739 6.48094 16.0664 6.45209 16.3486 6.50818C16.6309 6.56427 16.8901 6.70278 17.0936 6.90621C17.2288 7.04132 17.336 7.20175 17.4092 7.37832C17.4824 7.55489 17.52 7.74414 17.52 7.93527C17.52 8.1264 17.4824 8.31565 17.4092 8.49222C17.336 8.66879 17.2288 8.82921 17.0936 8.96433Z", fill: "#71347B" }))), /* @__PURE__ */ React__namespace.createElement("defs", null, /* @__PURE__ */ React__namespace.createElement("clipPath", { id: "clip0_3902_42568" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M0 4C0 1.79086 1.79086 0 4 0H20C22.2091 0 24 1.79086 24 4V20C24 22.2091 22.2091 24 20 24H4C1.79086 24 0 22.2091 0 20V4Z", fill: "white" })), /* @__PURE__ */ React__namespace.createElement("clipPath", { id: "clip1_3902_42568" }, /* @__PURE__ */ React__namespace.createElement("rect", { width: 16, height: 16, fill: "white", transform: "translate(4 4)" }))));
+
+const SvgListIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M12.8605 13.3488H1.13953C0.837424 13.3485 0.547792 13.2283 0.334167 13.0147C0.120543 12.801 0.000367042 12.5114 0 12.2093V1.79069C0.000367042 1.48858 0.120543 1.19895 0.334167 0.985321C0.547792 0.771696 0.837424 0.651521 1.13953 0.651154H12.8605C13.1626 0.651521 13.4522 0.771696 13.6658 0.985321C13.8795 1.19895 13.9996 1.48858 14 1.79069V12.2093C13.9996 12.5114 13.8795 12.801 13.6658 13.0147C13.4522 13.2283 13.1626 13.3485 12.8605 13.3488ZM1.13953 1.6279C1.09639 1.62798 1.05503 1.64516 1.02452 1.67567C0.994005 1.70618 0.976827 1.74754 0.976744 1.79069V12.2093C0.976827 12.2524 0.994005 12.2938 1.02452 12.3243C1.05503 12.3548 1.09639 12.372 1.13953 12.3721H12.8605C12.9036 12.372 12.945 12.3548 12.9755 12.3243C13.006 12.2938 13.0232 12.2524 13.0233 12.2093V1.79069C13.0232 1.74754 13.006 1.70618 12.9755 1.67567C12.945 1.64516 12.9036 1.62798 12.8605 1.6279H1.13953Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.9065 10.0931H5.04599C4.91646 10.0931 4.79225 10.0416 4.70066 9.95005C4.60907 9.85846 4.55762 9.73424 4.55762 9.60472C4.55762 9.4752 4.60907 9.35098 4.70066 9.25939C4.79225 9.1678 4.91646 9.11635 5.04599 9.11635H10.9065C11.036 9.11635 11.1602 9.1678 11.2518 9.25939C11.3434 9.35098 11.3948 9.4752 11.3948 9.60472C11.3948 9.73424 11.3434 9.85846 11.2518 9.95005C11.1602 10.0416 11.036 10.0931 10.9065 10.0931Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M3.09257 10.2558C3.4522 10.2558 3.74373 9.96427 3.74373 9.60464C3.74373 9.24501 3.4522 8.95348 3.09257 8.95348C2.73294 8.95348 2.44141 9.24501 2.44141 9.60464C2.44141 9.96427 2.73294 10.2558 3.09257 10.2558Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.9065 7.48836H5.04599C4.91646 7.48836 4.79225 7.4369 4.70066 7.34532C4.60907 7.25373 4.55762 7.12951 4.55762 6.99998C4.55762 6.87046 4.60907 6.74624 4.70066 6.65465C4.79225 6.56307 4.91646 6.51161 5.04599 6.51161H10.9065C11.036 6.51161 11.1602 6.56307 11.2518 6.65465C11.3434 6.74624 11.3948 6.87046 11.3948 6.99998C11.3948 7.12951 11.3434 7.25373 11.2518 7.34532C11.1602 7.4369 11.036 7.48836 10.9065 7.48836Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M3.09257 7.65108C3.4522 7.65108 3.74373 7.35954 3.74373 6.99992C3.74373 6.64029 3.4522 6.34875 3.09257 6.34875C2.73294 6.34875 2.44141 6.64029 2.44141 6.99992C2.44141 7.35954 2.73294 7.65108 3.09257 7.65108Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.9065 4.88364H5.04599C4.91646 4.88364 4.79225 4.83218 4.70066 4.74059C4.60907 4.64901 4.55762 4.52479 4.55762 4.39526C4.55762 4.26574 4.60907 4.14152 4.70066 4.04993C4.79225 3.95834 4.91646 3.90689 5.04599 3.90689H10.9065C11.036 3.90689 11.1602 3.95834 11.2518 4.04993C11.3434 4.14152 11.3948 4.26574 11.3948 4.39526C11.3948 4.52479 11.3434 4.64901 11.2518 4.74059C11.1602 4.83218 11.036 4.88364 10.9065 4.88364Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M3.09257 5.04659C3.4522 5.04659 3.74373 4.75505 3.74373 4.39543C3.74373 4.0358 3.4522 3.74426 3.09257 3.74426C2.73294 3.74426 2.44141 4.0358 2.44141 4.39543C2.44141 4.75505 2.73294 5.04659 3.09257 5.04659Z", fill: "currentColor" }));
+
+const SvgJSonCodeIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.4186 4.88372V9.40692C10.4522 9.4299 10.48 9.45998 10.5124 9.48442C10.6811 9.25574 10.9217 9.08075 11.2103 9.00086C11.2718 8.98377 11.3335 8.98473 11.3953 8.97686V4.28374C11.3953 3.80523 11.209 3.35565 10.8707 3.01735L8.378 0.524616C8.03971 0.186317 7.59012 0 7.11192 0H1.7907C0.803144 0 0 0.803145 0 1.7907V11.0168C0.207584 10.9284 0.435791 10.8862 0.670242 10.9194C0.554511 10.7251 0.488372 10.4981 0.488372 10.2558C0.488372 9.84634 0.681247 9.48555 0.976744 9.24676V1.79069C0.976744 1.34175 1.34175 0.976738 1.7907 0.976738H6.51163V3.09302C6.51163 4.08057 7.31477 4.88372 8.30233 4.88372H10.4186ZM7.48837 3.09302V1.08249C7.55911 1.12005 7.63038 1.15805 7.68741 1.2152L10.1801 3.70793C10.2381 3.76592 10.276 3.83662 10.3135 3.90697H8.30232C7.85338 3.90697 7.48837 3.54196 7.48837 3.09302ZM4.88372 11.0698C4.88372 11.2462 4.99564 11.3953 5.12791 11.3953H5.61628C6.2897 11.3953 6.83721 11.9794 6.83721 12.6977C6.83721 13.4159 6.2897 14 5.61628 14H4.39535C4.12573 14 3.90698 13.7812 3.90698 13.5116C3.90698 13.242 4.12573 13.0233 4.39535 13.0233H5.61628C5.74854 13.0233 5.86047 12.8741 5.86047 12.6977C5.86047 12.5212 5.74854 12.3721 5.61628 12.3721H5.12791C4.45449 12.3721 3.90698 11.788 3.90698 11.0698C3.90698 10.3515 4.45449 9.76744 5.12791 9.76744H6.34884C6.61846 9.76744 6.83721 9.98619 6.83721 10.2558C6.83721 10.5254 6.61846 10.7442 6.34884 10.7442H5.12791C4.99564 10.7442 4.88372 10.8933 4.88372 11.0698ZM8.95349 9.76744C7.96594 9.76744 7.16279 10.5706 7.16279 11.5581V12.2093C7.16279 13.1969 7.96594 14 8.95349 14C9.94104 14 10.7442 13.1969 10.7442 12.2093V11.5581C10.7442 10.5706 9.94104 9.76744 8.95349 9.76744ZM9.76744 12.2093C9.76744 12.6582 9.40243 13.0233 8.95349 13.0233C8.50454 13.0233 8.13953 12.6582 8.13953 12.2093V11.5581C8.13953 11.1092 8.50454 10.7442 8.95349 10.7442C9.40243 10.7442 9.76744 11.1092 9.76744 11.5581V12.2093ZM14 10.2558V13.5116C14 13.731 13.8537 13.9237 13.642 13.9822C13.5987 13.9943 13.5549 14 13.5116 14C13.3431 14 13.1829 13.9126 13.0926 13.7628L12.0465 12.0188V13.5116C12.0465 13.7812 11.8278 14 11.5581 14C11.2885 14 11.0698 13.7812 11.0698 13.5116V10.2558C11.0698 10.0364 11.216 9.84375 11.4278 9.78524C11.6402 9.72642 11.864 9.8164 11.9772 10.0046L13.0233 11.7486V10.2558C13.0233 9.98619 13.242 9.76743 13.5116 9.76743C13.7812 9.76743 14 9.98619 14 10.2558ZM3.5814 10.2558V12.2093C3.5814 13.1969 2.77825 14 1.7907 14C0.803144 14 0 13.1969 0 12.2093C0 11.9397 0.218752 11.7209 0.488372 11.7209C0.757993 11.7209 0.976744 11.9397 0.976744 12.2093C0.976744 12.6582 1.34175 13.0233 1.7907 13.0233C2.23964 13.0233 2.60465 12.6582 2.60465 12.2093V10.7442H1.7907C1.52108 10.7442 1.30233 10.5254 1.30233 10.2558C1.30233 9.98619 1.52108 9.76744 1.7907 9.76744H3.09302C3.36264 9.76744 3.5814 9.98619 3.5814 10.2558Z", fill: "currentColor" }));
+
 let Components = {};
 Components['success'] = SvgSuccess;
 Components['setting_icon'] = SvgSettingIcon;
@@ -1598,6 +1604,9 @@ Components['prompt_slider'] = SvgPromptSlider; // Newly Added icon
 Components['send_prompt'] = SvgSendPrompt; // Newly Added icon
 Components['copy_icon_filled'] = SvgCopyIconFilled; // Newly Added icon
 Components['generate_command_logo'] = SvgGenerateCommandLogo; // Newly Added icon
+Components[`access_key`] = SvgAccessKey; // Newly Added icon
+Components['list_icon'] = SvgListIcon;
+Components['json_icon'] = SvgJSonCodeIcon;
 
 const Icon = /*#__PURE__*/React.forwardRef(({
   name,
@@ -29125,7 +29134,8 @@ const CustomDatePicker = /*#__PURE__*/React.forwardRef(({
   zIndex = 10,
   isFilterDatePicker = false,
   isSelectableDate = false,
-  onBlur
+  onBlur,
+  withOutDateFormat = false
 }, ref) => {
   const [timeValue, setTimeValue] = React.useState('');
   const [selectedDate, setSelectedDate] = React.useState();
@@ -29213,7 +29223,14 @@ const CustomDatePicker = /*#__PURE__*/React.forwardRef(({
     if (dateOnly) {
       if (!isSelectableDate || date) {
         setSelectedDate(date);
-        onChange(date);
+        if (withOutDateFormat && date) {
+          const formatted = format$2(date, dateFormat, {
+            timeZone: timezone
+          });
+          onChange(date, formatted);
+        } else {
+          onChange(date);
+        }
       }
       resetAndCloseDatePicker();
     } else {
@@ -29231,7 +29248,16 @@ const CustomDatePicker = /*#__PURE__*/React.forwardRef(({
     }
   };
   const handleSave = () => {
-    onChange(selectedDateRef.current);
+    if (selectedDateRef.current) {
+      if (withOutDateFormat) {
+        const formatted = format$2(selectedDateRef.current, dateFormat, {
+          timeZone: timezone
+        });
+        onChange(selectedDateRef.current, formatted);
+      } else {
+        onChange(selectedDateRef.current);
+      }
+    }
     resetAndCloseDatePicker();
   };
   const handleDateInputClick = () => {
@@ -30716,12 +30742,15 @@ const AppHeader = ({
         borderStartStartRadius: borderRadius,
         borderStartEndRadius: borderRadius
       },
-      children: [jsxRuntime.jsx("div", {
-        className: "ff-app-header-logo-icon",
-        children: logo
-      }), leftContent && jsxRuntime.jsx("div", {
-        className: "ff-app-header-left-content",
-        children: leftContent
+      children: [jsxRuntime.jsxs("div", {
+        className: "ff-app-header-left-container",
+        children: [jsxRuntime.jsx("div", {
+          className: "ff-app-header-logo-icon",
+          children: logo
+        }), leftContent && jsxRuntime.jsx("div", {
+          className: "ff-app-header-left-content",
+          children: leftContent
+        })]
       }), jsxRuntime.jsxs("div", {
         className: "ff-app-header-nav-bar",
         style: {
@@ -34926,7 +34955,7 @@ const Branches = ({
       if (device?.name) {
         acc.push({
           label: device?.name,
-          type: device?.platform,
+          type: scriptType.toLowerCase() === 'manual' ? 'android' : device?.platform,
           version: scriptType?.toLowerCase() === 'manual' ? device?.version : ''
         });
       }
@@ -37107,49 +37136,6 @@ function getCellDimensions(point, rowDimensions, columnDimensions) {
     width
   };
 }
-/** Get the dimensions of customized cell at point from state */
-function getScrollCellDimensions(point, rowDimensions, columnDimensions) {
-  const DEFAULT_ROW_HEIGHT = 32;
-  const DEFAULT_COLUMN_WIDTH = 100; // Use your minimumColumnWidth or a default value
-  const HEADER_HEIGHT = 32; // Adjust as needed
-  const ROW_INDICATOR_WIDTH = 60;
-  let top = HEADER_HEIGHT + 4000; // Preserve your fixed top for scrolling, but add header offset
-  for (let r = 0; r < point.row; r++) {
-    top += (rowDimensions?.[r] ? rowDimensions?.[r]?.height : DEFAULT_ROW_HEIGHT) || DEFAULT_ROW_HEIGHT;
-  }
-  const height = (rowDimensions?.[point.row] ? rowDimensions?.[point.row]?.height : DEFAULT_ROW_HEIGHT) || DEFAULT_ROW_HEIGHT;
-  let left = ROW_INDICATOR_WIDTH;
-  for (let c = 0; c < point.column; c++) {
-    left += (columnDimensions?.[c] ? columnDimensions?.[c]?.width : DEFAULT_COLUMN_WIDTH) || DEFAULT_COLUMN_WIDTH;
-  }
-  const width = (columnDimensions?.[point.column] ? columnDimensions?.[point.column]?.width : DEFAULT_COLUMN_WIDTH) || DEFAULT_COLUMN_WIDTH;
-  return {
-    top,
-    height,
-    left,
-    width
-  };
-}
-/** Get the dimensions of a range of cells */
-function getRangeDimensions(rowDimensions, columnDimensions, range) {
-  const startDimensions = getCellDimensions(range.start, rowDimensions, columnDimensions);
-  let endDimensions = getCellDimensions(range.end, rowDimensions, columnDimensions);
-  if (endDimensions === undefined) {
-    endDimensions = getScrollCellDimensions(range.end, rowDimensions, columnDimensions);
-  }
-  return startDimensions && endDimensions && {
-    width: endDimensions.left + endDimensions.width - startDimensions.left,
-    height: endDimensions.top + endDimensions.height - startDimensions.top,
-    top: startDimensions.top + 1,
-    // Note: +1 Because of Active cell width is 2px
-    left: startDimensions.left + 1 // Note: +1 Because of Active cell width is 2px
-  };
-}
-/** Get the dimensions of selected */
-function getSelectedDimensions(rowDimensions, columnDimensions, data, selected) {
-  const range = selected.toRange(data);
-  return range ? getRangeDimensions(rowDimensions, columnDimensions, range) : undefined;
-}
 /** Get given data as CSV */
 function getCSV(data) {
   const valueMatrix = map(cell => cell?.value || '', data);
@@ -37295,6 +37281,38 @@ function getMatrixDimensions(matrixData) {
     columnCount
   };
 }
+function getVisibleRangeDimensions(fullRange, visibleRange, rowDimensions, columnDimensions) {
+  const DEFAULT_ROW_HEIGHT = 32;
+  const DEFAULT_COLUMN_WIDTH = 100;
+  if (!fullRange) return undefined;
+  const clippedStartRow = Math.max(fullRange?.start?.row, visibleRange?.start);
+  const clippedEndRow = Math.min(fullRange?.end?.row, visibleRange?.end - 1);
+  if (clippedStartRow > clippedEndRow) {
+    return undefined;
+  }
+  let top = 0;
+  for (let r = visibleRange?.start; r < clippedStartRow; r++) {
+    top += rowDimensions?.[r]?.height || DEFAULT_ROW_HEIGHT;
+  }
+  let height = 0;
+  for (let r = clippedStartRow; r <= clippedEndRow; r++) {
+    height += rowDimensions?.[r]?.height || DEFAULT_ROW_HEIGHT;
+  }
+  let left = 0;
+  for (let c = 0; c < fullRange?.start?.column; c++) {
+    left += columnDimensions?.[c]?.width || DEFAULT_COLUMN_WIDTH;
+  }
+  let width = 0;
+  for (let c = fullRange?.start?.column; c <= fullRange?.end?.column; c++) {
+    width += columnDimensions?.[c]?.width || DEFAULT_COLUMN_WIDTH;
+  }
+  return {
+    top,
+    left,
+    width,
+    height
+  };
+}
 
 const FORMULA_VALUE_PREFIX = '=';
 /** Returns whether given value is a formula */
@@ -38184,7 +38202,7 @@ function dragEndAutoFill(currentData, selectedRange, cellValue, activeCell, cont
   }
   let updatedData = currentData;
   const baseValue = String(cellValue.value ?? '');
-  const matches = [...baseValue.matchAll(/(\d+)/g)];
+  const matches = [...baseValue.matchAll(/(-?\d+)/g)];
   for (let row = startPoint.row; row <= endPoint.row; row++) {
     for (let col = startPoint.column; col <= endPoint.column; col++) {
       const currentCell = get$1({
@@ -38203,10 +38221,10 @@ function dragEndAutoFill(currentData, selectedRange, cellValue, activeCell, cont
           step = col - (activeCell?.column ?? startPoint.column);
         }
         let index = 0;
-        newValue = newValue.replace(/(\d+)/g, () => {
+        newValue = newValue.replace(/(-?\d+)/g, () => {
           const match = matches[index++];
           if (!match) return '';
-          const originalNum = parseInt(match[0], 10);
+          const originalNum = parseInt(match?.[1] ?? '', 10);
           return (originalNum + step).toString();
         });
       }
@@ -38926,13 +38944,15 @@ function reducer(state, action) {
         const {
           active
         } = state;
+        const newSelected = extend && active ? new EntireRowsSelection(active.row, row) : new EntireRowsSelection(row, row);
+        const newActive = extend && active ? active : {
+          ...ORIGIN,
+          row
+        };
         return {
           ...state,
-          selected: extend && active ? new EntireRowsSelection(active.row, row) : new EntireRowsSelection(row, row),
-          active: extend && active ? active : {
-            ...ORIGIN,
-            row
-          },
+          selected: newSelected,
+          active: newActive,
           mode: 'view',
           selectedColumn: null,
           selectedRow: row
@@ -38947,13 +38967,15 @@ function reducer(state, action) {
         const {
           active
         } = state;
+        const newSelected = extend && active ? new EntireColumnsSelection(active.column, column) : new EntireColumnsSelection(column, column);
+        const newActive = extend && active ? active : {
+          ...ORIGIN,
+          column
+        };
         return {
           ...state,
-          selected: extend && active ? new EntireColumnsSelection(active.column, column) : new EntireColumnsSelection(column, column),
-          active: extend && active ? active : {
-            ...ORIGIN,
-            column
-          },
+          selected: newSelected,
+          active: newActive,
           mode: 'view',
           selectedColumn: column,
           selectedRow: null
@@ -39317,23 +39339,23 @@ function reducer(state, action) {
             row: 0,
             column: 0
           };
-          if (rowCount > columnCount) {
+          if (Math.abs(rowCount) > Math.abs(columnCount)) {
             startPoint = {
-              row: activeCell?.row ?? 0,
-              column: start.column
+              row: Math.min(start.row, end.row),
+              column: activeCell?.column ?? 0
             };
             endPoint = {
-              row: activeCell?.row ?? 0,
-              column: end.column
+              row: Math.max(start.row, end.row),
+              column: activeCell?.column ?? 0
             };
           } else {
             startPoint = {
-              row: start.row,
-              column: activeCell?.column ?? 0
+              row: activeCell?.row ?? 0,
+              column: Math.min(start.column, end.column)
             };
             endPoint = {
-              row: end.row,
-              column: activeCell?.column ?? 0
+              row: activeCell?.row ?? 0,
+              column: Math.max(start.column, end.column)
             };
           }
           return {
@@ -40728,7 +40750,10 @@ const ColumnIndicator = ({
   minimumColumnWidth,
   maxColLimit,
   disableDeleteOption,
-  contextMenu
+  contextMenu,
+  onAddColumn,
+  onDeleteColumn,
+  scrollToColumn
 }) => {
   const dispatch = useDispatch();
   const minColumnWidth = minimumColumnWidth;
@@ -40742,7 +40767,13 @@ const ColumnIndicator = ({
       label: 'Add Column Left',
       value: 'Add Column Left',
       iconName: 'plus_icon',
-      action: () => addColumnLeft(minColumnWidth),
+      action: () => {
+        addColumnLeft(minColumnWidth);
+        onAddColumn?.(selectedColumn ?? column, true);
+        if (column === columnCount - 1) {
+          scrollToColumn(column); // Scroll to the new column
+        }
+      },
       disableTooltip: 'Column limit reached',
       visible: cell?.contextDisable?.['Add Column Left'] ?? false,
       disable: columnCount >= maxColLimit
@@ -40750,7 +40781,13 @@ const ColumnIndicator = ({
       label: 'Add Column Right',
       value: 'Add Column Right',
       iconName: 'plus_icon',
-      action: () => addColumnRight(minColumnWidth),
+      action: () => {
+        addColumnRight(minColumnWidth);
+        onAddColumn?.(selectedColumn ?? column, false);
+        if (column === columnCount - 1) {
+          scrollToColumn(column + 1); // Scroll to the new column
+        }
+      },
       disableTooltip: 'Column limit reached',
       visible: cell?.contextDisable?.['Add Column Right'] ?? false,
       disable: columnCount >= maxColLimit
@@ -40758,12 +40795,15 @@ const ColumnIndicator = ({
       label: 'Delete Column',
       value: 'Delete Column',
       iconName: 'delete',
-      action: () => deleteColumn(),
+      action: () => {
+        deleteColumn();
+        onDeleteColumn?.(selectedColumn ?? column);
+      },
       disableTooltip: '',
       visible: cell?.contextDisable?.['Delete Column'] ?? false,
       disable: false
     }] : [])];
-  }, [selectedColumn, cell, addColumnLeft, addColumnRight, deleteColumn]);
+  }, [selectedColumn, cell, addColumnLeft, addColumnRight, deleteColumn, minColumnWidth, columnCount, maxColLimit, disableDeleteOption, onAddColumn, onDeleteColumn, column]);
   const onMouseDrag = React__namespace.useCallback((event, isRight) => {
     const getTargetColumn = isRight ? column - 1 : column;
     const targetColumn = Math.max(getTargetColumn, 0);
@@ -40849,7 +40889,8 @@ const enhance$2 = ColumnIndicatorComponent => {
       cell: cell,
       selected: selected,
       selectedColumn: selectedColumn,
-      onSelect: selectEntireColumn$1
+      onSelect: selectEntireColumn$1,
+      scrollToColumn: props.scrollToColumn
     });
   };
 };
@@ -40879,7 +40920,8 @@ const RowIndicator = ({
   maxRowLimit,
   disableDeleteOption,
   contextMenu,
-  setVisibleRange
+  setVisibleRange,
+  scrollToRow
 }) => {
   const dispatch = useDispatch();
   const rowHeight = useSelector(state => state.rowDimensions[row]?.height || 32);
@@ -40888,10 +40930,16 @@ const RowIndicator = ({
     rowCount
   } = getMatrixDimensions(matrixData);
   const updateVisibleRangeEnd = action => {
-    setVisibleRange(prev => ({
-      ...prev,
-      end: action === 'increment' ? prev.end + 1 : prev.end - 1
-    }));
+    setVisibleRange(prev => {
+      const value = {
+        ...prev,
+        end: action === 'increment' ? prev.end + 1 : prev.end - 1
+      };
+      if (row === rowCount - 1) {
+        scrollToRow(row, value);
+      }
+      return value;
+    });
   };
   const options = React__namespace.useMemo(() => {
     return [{
@@ -41015,7 +41063,8 @@ const enhance$1 = RowIndicatorComponent => {
       selected: selected,
       cell: cell,
       selectedRow: selectedRow,
-      onSelect: selectEntireRow$1
+      onSelect: selectEntireRow$1,
+      scrollToRow: props.scrollToRow
     });
   };
 };
@@ -41263,7 +41312,7 @@ const ActiveCell = props => {
       top: dimensions.top - offset
     };
   }, [dimensions, offset]);
-  const hidden = React__namespace.useMemo(() => !active || !dimensions, [active, dimensions]);
+  const hidden = React__namespace.useMemo(() => !active || !dimensions || active.row < props.visibleRange.start || active.row >= props.visibleRange.end, [active, dimensions, props.visibleRange]);
   const initialCellRef = React__namespace.useRef(undefined);
   const prevActiveRef = React__namespace.useRef(null);
   const prevCellRef = React__namespace.useRef(undefined);
@@ -41552,7 +41601,9 @@ const ActiveCell = props => {
     }
     const root = rootRef.current;
     if (!hidden && root) {
-      root.focus();
+      root.focus({
+        preventScroll: true
+      });
       if (cell?.inputType?.type === 'file' && cell?.value) {
         try {
           const parsedFiles = JSON.parse(cell.value).map(file => new File([new Blob()], file.name.split('*')[0] ?? 'default'));
@@ -41628,7 +41679,9 @@ const ActiveCell = props => {
   }, [props]);
   return jsxRuntime.jsxs("div", {
     ref: rootRef,
-    className: classNames('ff-spreadsheet-active-cell', `ff-spreadsheet-active-cell--${mode}`),
+    className: classNames('ff-spreadsheet-active-cell', `ff-spreadsheet-active-cell--${mode}`, {
+      'ff-spreadsheet-active-cell--hidden': hidden
+    }),
     style: adjustedDimensions,
     onContextMenu: contextClick,
     onClick: mode === 'view' && !readOnly ? edit : undefined,
@@ -41682,7 +41735,7 @@ const ActiveCell = props => {
       className: "ff-spreadsheet-cell-textarea",
       style: {
         ...cell?.style,
-        textDecoration: 'normal',
+        textDecoration: cell?.style?.textDecoration === 'underline' ? 'underline' : 'none',
         pointerEvents: 'none',
         borderTop: '',
         borderBottom: '',
@@ -41742,49 +41795,62 @@ const FloatingRect = ({
 };
 
 const Selected = ({
-  visibleRange
+  visibleRange,
+  scrollPos = {
+    top: 0,
+    left: 0
+  }
 }) => {
-  const selected = useSelector(state => state.selected);
   const rowDimensions = useSelector(state => state.rowDimensions);
+  const columnDimensions = useSelector(state => state.columnDimensions);
   const dragging = useSelector(state => state.dragging);
   const hidden = useSelector(state => state.selected.size(state.model.data) < 2);
-  const dimensions = useSelector(state => {
-    return selected && getSelectedDimensions(state.rowDimensions, state.columnDimensions, state.model.data, state.selected);
-  });
-  const offset = React__namespace.useMemo(() => {
-    let sum = 0;
-    const DEFAULT_ROW_HEIGHT = 32;
-    for (let r = 0; r < visibleRange.start; r++) {
-      sum += rowDimensions[r]?.height || DEFAULT_ROW_HEIGHT;
-    }
-    return sum;
-  }, [rowDimensions, visibleRange.start]);
+  const fullRange = useSelector(state => state.selected.toRange(state.model.data));
+  const dimensions = React__namespace.useMemo(() => getVisibleRangeDimensions(fullRange, visibleRange, rowDimensions, columnDimensions), [fullRange, rowDimensions, columnDimensions, visibleRange]);
   const adjustedDimensions = React__namespace.useMemo(() => {
     if (!dimensions) return undefined;
     return {
       ...dimensions,
-      top: dimensions.top - offset - 1,
-      left: dimensions.left - 1,
-      height: dimensions.height + 2,
-      width: dimensions.width + 2
+      top: dimensions.top + 32,
+      left: dimensions.left + 60,
+      height: dimensions.height - 1,
+      width: dimensions.width - 1
     };
-  }, [dimensions, offset]);
+  }, [dimensions, scrollPos]);
   return jsxRuntime.jsx(FloatingRect, {
     variant: "selected",
     dimensions: adjustedDimensions,
     dragging: dragging,
-    hidden: hidden
+    hidden: hidden || !dimensions
   });
 };
 
-const Copied = () => {
-  const range = useSelector(state => state.copied);
-  const dimensions = useSelector(state => range && getRangeDimensions(state.rowDimensions, state.columnDimensions, range));
-  const hidden = range === null;
+const Copied = ({
+  visibleRange,
+  scrollPos = {
+    top: 0,
+    left: 0
+  }
+}) => {
+  const rowDimensions = useSelector(state => state.rowDimensions);
+  const columnDimensions = useSelector(state => state.columnDimensions);
+  const fullRange = useSelector(state => state.copied);
+  const hidden = fullRange === null;
+  const dimensions = React__namespace.useMemo(() => getVisibleRangeDimensions(fullRange, visibleRange, rowDimensions, columnDimensions), [fullRange, rowDimensions, columnDimensions, visibleRange]);
+  const adjustedDimensions = React__namespace.useMemo(() => {
+    if (!dimensions) return undefined;
+    return {
+      ...dimensions,
+      top: dimensions.top + 32,
+      left: dimensions.left + 60,
+      height: dimensions.height - 1,
+      width: dimensions.width - 1
+    };
+  }, [dimensions, scrollPos]);
   return jsxRuntime.jsx(FloatingRect, {
     variant: "copied",
-    dimensions: dimensions,
-    hidden: hidden,
+    dimensions: adjustedDimensions,
+    hidden: hidden || !dimensions,
     dragging: false
   });
 };
@@ -42300,7 +42366,7 @@ const throttle = (func, limit) => {
 /**
  * The Spreadsheet component
  */
-const Spreadsheet = props => {
+const Spreadsheet = /*#__PURE__*/React__namespace.forwardRef(function Spreadsheet(props, ref) {
   const {
     className,
     columnLabels,
@@ -42327,12 +42393,17 @@ const Spreadsheet = props => {
     maxColLimit,
     disableDeleteOption,
     contextMenu,
-    getActiveCell
+    getActiveCell,
+    onAddColumn,
+    onDeleteColumn
   } = props;
   const [sheetChange, setSheetChange] = React__namespace.useState(false);
   const [maxWidth, setMaxWidth] = React__namespace.useState(0);
   const [maxHeight, setMaxHeight] = React__namespace.useState(0);
-  const [renderReady, setRenderReady] = React__namespace.useState(true);
+  const [scrollPos, setScrollPos] = React__namespace.useState({
+    top: 0,
+    left: 0
+  });
   const resizeObserver = new ResizeObserver(entries => {
     const entry = entries[0];
     if (entry && rootRef.current) {
@@ -42347,7 +42418,6 @@ const Spreadsheet = props => {
           setMaxWidth(Math.min(rootRef.current.clientWidth, clientWidth));
         }
       }
-      removeSelect();
     }
   });
   const scrollOption = props.scroller;
@@ -42406,6 +42476,10 @@ const Spreadsheet = props => {
   const addColumnRight$1 = useAction(addColumnRight);
   const deleteRow$1 = useAction(deleteRow);
   const deleteColumn$1 = useAction(deleteColumn);
+  // Expose removeSelect
+  React__namespace.useImperativeHandle(ref, () => ({
+    removeSelect
+  }));
   // Track active
   const prevActiveRef = React__namespace.useRef(state.active);
   React__namespace.useEffect(() => {
@@ -42512,17 +42586,6 @@ const Spreadsheet = props => {
       onKeyDownAction(event);
     }
   }, [state, onKeyDown, onKeyDownAction]);
-  React__namespace.useEffect(() => {
-    const handleDocumentClick = event => {
-      if (workRef.current && !workRef.current.contains(event.target)) {
-        removeSelect();
-      }
-    };
-    document.addEventListener('click', handleDocumentClick);
-    return () => {
-      document.removeEventListener('click', handleDocumentClick);
-    };
-  }, [workRef]);
   const handleClick = React__namespace.useCallback(() => {
     if (state.formattedStyle.open && state.active) {
       formateClick(state.active);
@@ -42560,11 +42623,6 @@ const Spreadsheet = props => {
     if (!table) return;
     resizeObserver.observe(table);
   };
-  const removeSelection = () => {
-    if ((state.selectedColumn === null || state.selectedRow === null) && !state.autoFill.open) {
-      removeSelect();
-    }
-  };
   const updateVisibleRange = (newStart, newEnd, newScrollCount) => {
     setScrollCount(newScrollCount);
     setVisibleRange({
@@ -42580,10 +42638,8 @@ const Spreadsheet = props => {
         });
       });
     }
-    removeSelection();
   };
   const throttledHandleScroll = React__namespace.useMemo(() => throttle(e => {
-    setRenderReady(false);
     requestAnimationFrame(() => {
       const {
         scrollTop,
@@ -42609,7 +42665,6 @@ const Spreadsheet = props => {
         updateVisibleRange((scrollCount + 1) * rowHeight, size.rows, scrollCount + 1);
         setScrollCount(scrollCount + 1);
       }
-      setRenderReady(true);
     });
     setContextMenu({
       open: false,
@@ -42632,6 +42687,42 @@ const Spreadsheet = props => {
       return range(size.rows);
     }
   };
+  const scrollToRow = (row, visibleRangeValue) => {
+    if (!scrollOption || !rootRef.current) return;
+    requestAnimationFrame(() => {
+      const DEFAULT_ROW_HEIGHT = 32;
+      let scrollTop = 0;
+      for (let r = 0; r <= row; r++) {
+        scrollTop += state.rowDimensions?.[r]?.height || DEFAULT_ROW_HEIGHT;
+      }
+      if (row >= visibleRange.end - 1) {
+        setVisibleRange(prev => ({
+          ...prev,
+          start: visibleRangeValue?.start,
+          end: visibleRangeValue?.end
+        }));
+        rootRef.current?.scrollTo({
+          top: scrollTop + DEFAULT_ROW_HEIGHT,
+          behavior: 'smooth'
+        });
+      }
+    });
+  };
+  const scrollToColumn = column => {
+    requestAnimationFrame(() => {
+      const columnWidth = minimumColumnWidth;
+      const scrollLeft = column * columnWidth;
+      requestAnimationFrame(() => {
+        if (!rootRef.current) return;
+        if (column >= size.columns - 1) {
+          rootRef.current.scrollTo({
+            left: scrollLeft,
+            behavior: 'smooth'
+          });
+        }
+      });
+    });
+  };
   const tableNode = React__namespace.useMemo(() => jsxRuntime.jsxs(Table$1, {
     columns: size.columns,
     hideColumnIndicators: false,
@@ -42648,7 +42739,10 @@ const Spreadsheet = props => {
         columnContextEnable: props.columnContextEnable,
         maxColLimit: maxColLimit,
         disableDeleteOption: disableDeleteOption,
-        contextMenu: contextMenu
+        contextMenu: contextMenu,
+        onAddColumn: onAddColumn,
+        onDeleteColumn: onDeleteColumn,
+        scrollToColumn: scrollToColumn
       }, columnNumber) : jsxRuntime.jsx(ColumnIndicator, {
         column: columnNumber,
         minimumColumnWidth: minimumColumnWidth,
@@ -42659,9 +42753,12 @@ const Spreadsheet = props => {
         columnContextEnable: props.columnContextEnable,
         maxColLimit: maxColLimit,
         disableDeleteOption: disableDeleteOption,
-        contextMenu: contextMenu
+        contextMenu: contextMenu,
+        onAddColumn: onAddColumn,
+        onDeleteColumn: onDeleteColumn,
+        scrollToColumn: scrollToColumn
       }, columnNumber))]
-    }), renderReady && scrollerFunction().map(rowNumber => jsxRuntime.jsxs(Row$1, {
+    }), scrollerFunction().map(rowNumber => jsxRuntime.jsxs(Row$1, {
       row: rowNumber,
       children: [rowLabels ? jsxRuntime.jsx(RowIndicator$1, {
         label: rowNumber in rowLabels ? rowLabels[rowNumber] : null,
@@ -42674,7 +42771,8 @@ const Spreadsheet = props => {
         maxRowLimit: maxRowLimit,
         disableDeleteOption: disableDeleteOption,
         contextMenu: contextMenu,
-        setVisibleRange: setVisibleRange
+        setVisibleRange: setVisibleRange,
+        scrollToRow: scrollToRow
       }, rowNumber) : jsxRuntime.jsx(RowIndicator$1, {
         row: rowNumber,
         addRowTop: addRowTop$1,
@@ -42685,7 +42783,8 @@ const Spreadsheet = props => {
         maxRowLimit: maxRowLimit,
         disableDeleteOption: disableDeleteOption,
         contextMenu: contextMenu,
-        setVisibleRange: setVisibleRange
+        setVisibleRange: setVisibleRange,
+        scrollToRow: scrollToRow
       }, rowNumber), range(size.columns).map(columnNumber => jsxRuntime.jsx(Cell$1, {
         row: rowNumber,
         column: columnNumber,
@@ -42749,6 +42848,11 @@ const Spreadsheet = props => {
       onClick: handleClick,
       onMouseMove: handleMouseMove,
       onScroll: e => {
+        const target = e.target;
+        setScrollPos({
+          top: target.scrollTop,
+          left: target.scrollLeft
+        });
         scrollOption && throttledHandleScroll(e);
         setContextMenu({
           open: false,
@@ -42765,15 +42869,19 @@ const Spreadsheet = props => {
         });
       },
       children: [tableNode, activeCellNode, jsxRuntime.jsx(Selected, {
-        visibleRange: visibleRange
-      }), jsxRuntime.jsx(Copied, {})]
+        visibleRange: visibleRange,
+        scrollPos: scrollPos
+      }), jsxRuntime.jsx(Copied, {
+        visibleRange: visibleRange,
+        scrollPos: scrollPos
+      })]
     })]
   }), [className, onKeyPress, handleKeyDown, handleMouseMove, tableNode, activeCellNode, maxWidth]);
   return jsxRuntime.jsx(context.Provider, {
     value: reducerElements,
     children: rootNode
   });
-};
+});
 
 const ExcelContextMenu = ({
   contextMenu,
@@ -42898,6 +43006,7 @@ const ExcelFile = ({
     defaultSheet: [[EmptyCell]]
   });
   const [selectedSheetData, setSelectedSheetData] = React.useState([[EmptyCell]]);
+  const [headerOldNew, setHeaderOldNew] = React.useState(onSave.length > 1 ? {} : {});
   const [position, setPosition] = React.useState({
     x: 0,
     y: 0
@@ -42905,6 +43014,7 @@ const ExcelFile = ({
   const pageRef = React.useRef('');
   const workRef = React.useRef(null);
   const sheetRef = React.useRef(null);
+  const spreadsheetRef = React.useRef(null);
   const checkVal = val => {
     if (val === undefined || val === null) {
       return null;
@@ -42925,6 +43035,7 @@ const ExcelFile = ({
         });
       }
       const newWorksheetsData = {};
+      const newHeaderOldNew = {};
       payload.forEach(sheet => {
         const sheetName = sheet.sheetName;
         const json = sheet.data;
@@ -42981,8 +43092,21 @@ const ExcelFile = ({
           });
         });
         newWorksheetsData[sheetName] = spreadsheetData;
+        // Only set headerOldNew if onSave expects two arguments
+        if (onSave.length > 1) {
+          const firstRow = json[0] || [];
+          newHeaderOldNew[sheetName] = Array.from({
+            length: maxCols
+          }, (_, col) => ({
+            newData: '',
+            oldData: firstRow[col]?.value || ''
+          }));
+        }
       });
       setWorksheetsData(newWorksheetsData);
+      if (onSave.length > 1) {
+        setHeaderOldNew(newHeaderOldNew);
+      }
       const firstSheetName = Object.keys(newWorksheetsData)[0];
       if (firstSheetName && newWorksheetsData[firstSheetName] !== undefined) {
         setSelectedSheetData(newWorksheetsData[firstSheetName]);
@@ -43004,9 +43128,29 @@ const ExcelFile = ({
     debounceDispatch(handleSaveData());
   }, [worksheetsData, pageRef.current]);
   const debounceDispatch = React.useCallback(debounce(val => {
-    onSave(val);
+    if (onSave.length > 1) {
+      const updatedHeader = {
+        ...headerOldNew
+      };
+      sheetNames.forEach((sheetName, index) => {
+        const firstRow = val[index].data[0] || [];
+        const currentHeaders = firstRow.map(cell => cell?.value || '');
+        updatedHeader[sheetName] = (updatedHeader[sheetName] || []).map((h, i) => ({
+          ...h,
+          newData: currentHeaders[i] || ''
+        }));
+      });
+      setHeaderOldNew(updatedHeader);
+      const headerOldNewData = sheetNames.map(sheetName => ({
+        sheetName,
+        headers: updatedHeader[sheetName] || []
+      }));
+      onSave(val, headerOldNewData);
+    } else {
+      onSave(val);
+    }
     setSaveInfo('File saved');
-  }, onSaveDelay), [onSave]);
+  }, onSaveDelay), [onSave, headerOldNew, sheetNames]);
   const handleSave = React.useCallback(event => {
     if (event.ctrlKey && event.key === 's') {
       event.preventDefault();
@@ -43089,6 +43233,17 @@ const ExcelFile = ({
       [newSheetName]: newSheetData
     });
     setSelectedSheetData(newSheetData);
+    if (onSave.length > 1) {
+      setHeaderOldNew(prev => ({
+        ...prev,
+        [newSheetName]: Array.from({
+          length: colCount
+        }, () => ({
+          newData: '',
+          oldData: ''
+        }))
+      }));
+    }
     pageRef.current = newSheetName;
   };
   React.useEffect(() => {
@@ -43110,6 +43265,15 @@ const ExcelFile = ({
       const newIndex = Math.min(index, updatedSheetNames.length - 1);
       setSheetNames(updatedSheetNames);
       setWorksheetsData(updatedWorksheetsData);
+      if (onSave.length > 1) {
+        setHeaderOldNew(prev => {
+          const newPrev = {
+            ...prev
+          };
+          delete newPrev[name];
+          return newPrev;
+        });
+      }
       setSelectedSheet({
         index: newIndex,
         name: updatedSheetNames[newIndex] ? updatedSheetNames[newIndex] : ''
@@ -43153,6 +43317,17 @@ const ExcelFile = ({
       name: updatedSheetValue
     }));
     setWorksheetsData(updatedData);
+    if (onSave.length > 1) {
+      setHeaderOldNew(prev => {
+        const newPrev = {
+          ...prev
+        };
+        const headers = newPrev[name];
+        delete newPrev[name];
+        newPrev[updatedSheetValue] = headers ?? [];
+        return newPrev;
+      });
+    }
     setEditingSheet(null);
   };
   function replaceKeyValueByKeyName(obj, oldKey, newKey, newValue) {
@@ -43314,6 +43489,39 @@ const ExcelFile = ({
       });
     }
   };
+  const handleAddColumn = (column, isLeft) => {
+    if (onSave.length > 1) {
+      setHeaderOldNew(prev => {
+        const sheetName = selectedSheet.name;
+        const arr = [...(prev[sheetName] || [])];
+        const pos = isLeft ? column : column + 1;
+        arr.splice(pos, 0, {
+          newData: '',
+          oldData: ''
+        });
+        return {
+          ...prev,
+          [sheetName]: arr
+        };
+      });
+    }
+  };
+  const handleDeleteColumn = column => {
+    if (onSave.length > 1) {
+      setHeaderOldNew(prev => {
+        const sheetName = selectedSheet.name;
+        const arr = [...(prev[sheetName] || [])];
+        arr.splice(column, 1);
+        return {
+          ...prev,
+          [sheetName]: arr
+        };
+      });
+    }
+  };
+  React.useEffect(() => {
+    spreadsheetRef.current?.removeSelect();
+  }, [selectedSheet.name]);
   return jsxRuntime.jsx(jsxRuntime.Fragment, {
     children: sheetNames.length > 0 && jsxRuntime.jsxs("div", {
       ref: workRef,
@@ -43324,6 +43532,7 @@ const ExcelFile = ({
         ref: sheetRef,
         className: "ff-excel-sheet",
         children: jsxRuntime.jsx(Spreadsheet, {
+          ref: spreadsheetRef,
           editable: editable,
           attachmentAction: attachmentAction,
           toolbar: toolbar,
@@ -43342,8 +43551,10 @@ const ExcelFile = ({
           maxColLimit: maxColLimit,
           disableDeleteOption: disableDeleteOption,
           contextMenu: contextMenu,
-          getActiveCell: getActiveCell
-        })
+          getActiveCell: getActiveCell,
+          onAddColumn: handleAddColumn,
+          onDeleteColumn: handleDeleteColumn
+        }, selectedSheet.name)
       }), sheetBar !== 'hide' && jsxRuntime.jsxs("div", {
         className: "ff-excel-sheet-bar",
         children: [sheetBar === 'show' && jsxRuntime.jsx("div", {
@@ -48606,8 +48817,9 @@ const MobileSkin = ({
   const containerWidth = isPortrait ? mobileWidth : mobileHeight;
   const hasTopNav = UtilityBar && navBarPosition === 'top';
   const hasBottomNav = UtilityBar && navBarPosition === 'bottom';
+  const hasSideNav = UtilityBar && navBarPosition === 'left';
   return jsxRuntime.jsxs("div", {
-    className: `ff-mobileskin-wrapper ${isPortrait ? 'portrait' : 'landscape'} ${hasTopNav && 'navbar-top'}`,
+    className: ['ff-mobileskin-wrapper', isPortrait ? 'portrait' : 'landscape', hasSideNav ? 'ff-side-nav-left' : '', hasTopNav ? 'navbar-top' : '', hasBottomNav ? 'navbar-bottom' : ''].filter(Boolean).join(' '),
     children: [hasTopNav && jsxRuntime.jsx("div", {
       className: "ff-nav-bar top-nav-bar",
       children: navBarIcons.map(({
@@ -48616,6 +48828,7 @@ const MobileSkin = ({
         className,
         ...iconProps
       }, index) => {
+        const key = tooltip?.[name] ?? index;
         const tooltipTitle = tooltip?.[name] || '';
         return jsxRuntime.jsx(Tooltip, {
           title: tooltipTitle,
@@ -48627,7 +48840,7 @@ const MobileSkin = ({
               ...iconProps
             })
           })
-        }, tooltipTitle);
+        }, key);
       })
     }), jsxRuntime.jsx("div", {
       className: "ff-mobileskin-container",
@@ -48671,6 +48884,24 @@ const MobileSkin = ({
           })
         }, index);
       })
+    }), UtilityBar && hasSideNav && jsxRuntime.jsx("div", {
+      className: "ff-side-nav-bar",
+      children: navBarIcons?.map((icon, index) => {
+        const {
+          title,
+          ...iconProps
+        } = icon;
+        return jsxRuntime.jsx("div", {
+          className: `ff-sidebar ${icon?.className || ''} ${index === navBarIcons.length - 1 ? 'last-icon' : ''}`,
+          children: jsxRuntime.jsx(Tooltip, {
+            title: title,
+            placement: "bottom",
+            children: jsxRuntime.jsx(Icon, {
+              ...iconProps
+            })
+          })
+        }, index);
+      })
     })]
   });
 };
@@ -48691,7 +48922,8 @@ const Prompt = /*#__PURE__*/React.forwardRef(({
   submitPrompt,
   onPromptChange,
   onBlur,
-  onFocus
+  onFocus,
+  disableInput
 }) => {
   const containerRef = React.useRef(null);
   useKeyboardActions([{
@@ -48736,7 +48968,8 @@ const Prompt = /*#__PURE__*/React.forwardRef(({
       onChange: onPromptChange,
       onFocus: onFocus,
       onBlur: onBlur,
-      value: value
+      value: value,
+      readOnly: disableInput
     })]
   });
 });
@@ -48940,7 +49173,8 @@ const ChatModalAi = /*#__PURE__*/React.forwardRef(({
   footerContent = 'Footer Content',
   iconWidth,
   iconHeight,
-  children
+  children,
+  onVisibilityChange
 }, ref) => {
   const [isOpen, setIsOpen] = React.useState(false);
   const [isVisible, setIsVisible] = React.useState(false);
@@ -48948,12 +49182,16 @@ const ChatModalAi = /*#__PURE__*/React.forwardRef(({
   const openModal = () => {
     if (timerRef.current) clearTimeout(timerRef.current);
     setIsVisible(prev => !prev);
+    onVisibilityChange?.(!isVisible);
     timerRef.current = setTimeout(() => setIsOpen(prev => !prev), 10);
   };
   const closeModal = () => {
     if (timerRef.current) clearTimeout(timerRef.current);
     setIsOpen(false);
-    timerRef.current = setTimeout(() => setIsVisible(false), 300);
+    timerRef.current = setTimeout(() => {
+      setIsVisible(false);
+      onVisibilityChange?.(false);
+    }, 300);
   };
   React.useImperativeHandle(ref, () => ({
     closeModal
@@ -49185,11 +49423,13 @@ const PromptContainer = ({
   disabled,
   isEditAccess,
   versionsLength,
-  count
+  count,
+  hiddenActions = []
 }) => {
   const [isExpanded, setIsExpanded] = React.useState(false);
   const [showReadMore, setShowReadMore] = React.useState(false);
   const contentRef = React.useRef(null);
+  const hiddenListIcons = Array.isArray(hiddenActions) ? hiddenActions : hiddenActions ? [hiddenActions] : [];
   const actions = [{
     action: 'delete',
     title: 'Delete',
@@ -49276,7 +49516,7 @@ const PromptContainer = ({
       className: "ff-prompt-icons",
       children: [jsxRuntime.jsx("div", {
         className: "ff-prompt-icons-leftside",
-        children: actions.map((act, index) => {
+        children: actions.filter(act => !hiddenListIcons.includes(act.action)).map((act, index) => {
           const isDelete = act?.action === 'delete';
           const isRegenerate = act?.action === 'regenerate';
           const shouldDisableIcon = isEditAccess && isDelete || isRegenerate && (versionsLength ?? 0) >= 3 || disabled;
@@ -50176,11 +50416,22 @@ const TableHead = /*#__PURE__*/React.memo(({
   // );
   const rootNodeRowRef = React.useRef(null);
   const [isMounted, setIsMounted] = React.useState(false);
+  const [didMouseEntered, setDidMouseEntered] = React.useState(false);
+  const handleMouseEnter = e => {
+    e.stopPropagation();
+    setDidMouseEntered(true);
+  };
+  const handleMouseLeave = e => {
+    e.stopPropagation();
+    setDidMouseEntered(false);
+  };
   React.useEffect(() => {
     setIsMounted(true);
   }, []);
   return jsxRuntime.jsxs("thead", {
     className: "ff-table-tree-head",
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
     children: [jsxRuntime.jsx("tr", {
       className: "ff-table-tree-row no-hover",
       children: columnsData.map(({
@@ -50225,7 +50476,7 @@ const TableHead = /*#__PURE__*/React.memo(({
                 return rootNode.cell(rootNode.node);
               })()
             })]
-          }), rootNode.actions && index === 0 && isMounted && rootNodeRowRef.current && jsxRuntime.jsx("div", {
+          }), didMouseEntered && rootNode.actions && index === 0 && isMounted && rootNodeRowRef.current && jsxRuntime.jsx("div", {
             className: "table-tree-row-action",
             children: (() => {
               return rootNode.actions(rootNode.node, rootNodeRowRef);