@progress/kendo-react-spreadsheet 7.0.0-develop.9 → 7.0.0

package/index.mjs

@@ -2,16 +2,17 @@
 * Copyright © 2023 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------*/
+"use client";
 import * as e from "react";
 import * as F from "prop-types";
 import { Button as K, DropDownButton as q, ToolbarSeparator as B, Toolbar as Jt, ButtonGroup as $t } from "@progress/kendo-react-buttons";
 import { TabStrip as jt, TabStripTab as Gt } from "@progress/kendo-react-layout";
 import { Dialog as qt, DialogActionsBar as Xt } from "@progress/kendo-react-dialogs";
 import { Popup as Zt } from "@progress/kendo-react-popup";
-import { IconWrap as P, classNames as J, guid as Yt, validatePackage as Qt, shouldShowValidationUI as en, WatermarkOverlay as tn } from "@progress/kendo-react-common";
+import { IconWrap as P, classNames as J, useId as Yt, validatePackage as Qt, shouldShowValidationUI as en, WatermarkOverlay as tn } from "@progress/kendo-react-common";
 import { formulaFxIcon as me, xIcon as pe, plusIcon as nn, downloadIcon as on, folderOpenIcon as an, boldIcon as ln, italicIcon as sn, underlineIcon as rn, fontGrowIcon as cn, fontShrinkIcon as dn, foregroundColorIcon as un, dropletIcon as mn, alignLeftIcon as X, caretAltDownIcon as fe, alignCenterIcon as pn, alignRightIcon as fn, alignJustifyIcon as gn, alignTopIcon as hn, alignMiddleIcon as Cn, alignBottomIcon as ge, textWrapIcon as vn, bordersNoneIcon as yn, customFormatIcon as bn, tableColumnInsertLeftIcon as kn, tableColumnInsertRightIcon as xn, tableRowInsertBelowIcon as En, tableRowInsertAboveIcon as Sn, tableColumnDeleteIcon as In, tableRowDeleteIcon as wn, arrowRotateCcwIcon as Nn, arrowRotateCwIcon as Rn, decimalIncreaseIcon as le, decimalDecreaseIcon as se, clearCssIcon as An } from "@progress/kendo-svg-icons";
 import { ComboBox as he, DropDownList as Dn } from "@progress/kendo-react-dropdowns";
-import { useLocalization as N, useInternationalization as Tn } from "@progress/kendo-react-intl";
+import { useLocalization as R, useInternationalization as Tn } from "@progress/kendo-react-intl";
 import { Sortable as Ln } from "@progress/kendo-react-sortable";
 import { SpreadsheetWidget as Fn } from "@progress/kendo-spreadsheet-common";
 import { CalcError as Fo, CellRef as Ko, Context as Mo, Matrix as zo, NULLREF as Bo, NameRef as Po, Range as Ho, RangeRef as Oo, Ref as Uo, Sheet as Vo, SpreadsheetWidget as Wo, UnionRef as _o, View as Jo, Workbook as $o, dateToSerial as jo, defineAlias as Go, defineFunction as qo, packDate as Xo, packTime as Zo, serialToDate as Yo, unpackDate as Qo, unpackTime as ea } from "@progress/kendo-spreadsheet-common";
@@ -40,22 +41,22 @@ const Z = e.forwardRef((t, n) => {
 Z.displayName = "List";
 Z.propTypes = {};
 const _ = e.forwardRef((t, n) => {
-  const [a, s] = e.useState(!1), [o, l] = e.useState(0), [u, d] = e.useState([]), r = e.useMemo(() => ({}), []);
-  r.showPopup = a, r.popupContentKey = o, r.data = u;
-  const v = e.useRef(null), y = e.useRef(null), C = e.useRef(null), g = e.useCallback(() => {
+  const [a, s] = e.useState(!1), [o, l] = e.useState(0), [d, u] = e.useState([]), r = e.useMemo(() => ({}), []);
+  r.showPopup = a, r.popupContentKey = o, r.data = d;
+  const v = e.useRef(null), y = e.useRef(null), C = e.useRef(null), w = e.useCallback(() => {
     if (C.current && C.current.element)
       return C.current.element.querySelector(".k-focus");
-  }, []), S = e.useCallback(() => {
-    const f = g();
+  }, []), b = e.useCallback(() => {
+    const f = w();
     f && f.classList.remove("k-focus");
   }, []), p = e.useCallback((f) => {
-    const R = Array.from(C.current && C.current.element.children || []), D = g();
+    const I = Array.from(C.current && C.current.element.children || []), D = w();
     let m;
     if (D) {
-      const x = R.indexOf(D);
-      D.classList.remove("k-focus"), m = R[x + f] ? R[x + f] : f === 1 ? R[0] : R[R.length - 1];
+      const x = I.indexOf(D);
+      D.classList.remove("k-focus"), m = I[x + f] ? I[x + f] : f === 1 ? I[0] : I[I.length - 1];
     } else
-      m = f === 1 ? R[0] : R[R.length - 1];
+      m = f === 1 ? I[0] : I[I.length - 1];
     m && m.classList.add("k-focus");
   }, []);
   e.useImperativeHandle(v, () => ({
@@ -79,12 +80,12 @@ const _ = e.forwardRef((t, n) => {
       },
       data: (f) => {
         if (f)
-          d(f);
+          u(f);
         else
           return r.data;
       },
       value: () => ({}),
-      focus: () => Array.from(C.current && C.current.element && C.current.element.children || []).indexOf(g()),
+      focus: () => Array.from(C.current && C.current.element && C.current.element.children || []).indexOf(w()),
       // select: (x) => {
       //     console.log('select', x);
       // },
@@ -96,18 +97,18 @@ const _ = e.forwardRef((t, n) => {
       },
       focusFirst: () => {
         const f = C.current && C.current.element;
-        f && f.children.item(0) && (S(), f.children.item(0).classList.add("k-focus"));
+        f && f.children.item(0) && (b(), f.children.item(0).classList.add("k-focus"));
       },
       focusLast: () => {
         const f = C.current && C.current.element;
-        f && f.children.length && (S(), f.children.item(f.children.length - 1).classList.add("k-focus"));
+        f && f.children.length && (b(), f.children.item(f.children.length - 1).classList.add("k-focus"));
       },
       itemClick: (f) => {
         r.itemClick = f;
       }
     }
   }), []), e.useImperativeHandle(n, () => v.current, []);
-  const b = e.useCallback((f) => {
+  const h = e.useCallback((f) => {
     r.itemClick && r.itemClick(f);
   }, []);
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
@@ -128,7 +129,7 @@ const _ = e.forwardRef((t, n) => {
       contentKey: o,
       popupClass: "k-list-container"
     },
-    /* @__PURE__ */ e.createElement(Z, { data: u, ref: C, onItemClick: b })
+    /* @__PURE__ */ e.createElement(Z, { data: d, ref: C, onItemClick: h })
   ));
 });
 _.displayName = "FormulaInput";
@@ -236,7 +237,7 @@ const ye = "spreadsheet.bold", be = "spreadsheet.italic", ke = "spreadsheet.unde
   duplicateSheetName: ft,
   formatTab: rt
 }, Y = e.forwardRef((t, n) => {
-  const a = e.useRef(null), s = e.useRef(null), [o, l] = e.useState([]), [u, d] = e.useState(!1), [r, v] = e.useState(""), y = e.useMemo(() => ({}), []);
+  const a = e.useRef(null), s = e.useRef(null), [o, l] = e.useState([]), [d, u] = e.useState(!1), [r, v] = e.useState(""), y = e.useMemo(() => ({}), []);
   y.data = o, e.useImperativeHandle(a, () => ({
     value: (m) => {
       if (m === void 0) {
@@ -249,7 +250,7 @@ const ye = "spreadsheet.bold", be = "spreadsheet.italic", ke = "spreadsheet.unde
   const C = e.useCallback((m) => {
     const x = t.nameEditor();
     x && x.trigger("delete", { name: m });
-  }, []), g = e.useCallback((m, x) => {
+  }, []), w = e.useCallback((m, x) => {
     const T = /* @__PURE__ */ e.createElement(e.Fragment, null, m.props.children, /* @__PURE__ */ e.createElement(
       "span",
       {
@@ -269,13 +270,13 @@ const ye = "spreadsheet.bold", be = "spreadsheet.italic", ke = "spreadsheet.unde
       )
     ));
     return e.cloneElement(m, m.props, T);
-  }, []), S = e.useCallback((m) => e.cloneElement(m, { ...m.props }, /* @__PURE__ */ e.createElement("div", null)), []), p = e.useCallback((m) => {
+  }, []), b = e.useCallback((m) => e.cloneElement(m, { ...m.props }, /* @__PURE__ */ e.createElement("div", null)), []), p = e.useCallback((m) => {
     if (m.syntheticEvent && m.syntheticEvent.type === "change")
       return;
     const x = t.nameEditor();
-    x && (l(x.readData()), d(!0));
-  }, []), b = e.useCallback(() => {
-    d(!1);
+    x && (l(x.readData()), u(!0));
+  }, []), h = e.useCallback(() => {
+    u(!1);
   }, []), f = e.useCallback((m) => {
     if (m.syntheticEvent.target.closest("[data-role]"))
       return;
@@ -284,7 +285,7 @@ const ye = "spreadsheet.bold", be = "spreadsheet.italic", ke = "spreadsheet.unde
       const T = m.value.name;
       T !== r && (x.trigger("select", { name: T }), v(T));
     }
-  }, [r]), R = e.useCallback((m) => {
+  }, [r]), I = e.useCallback((m) => {
     const x = t.nameEditor();
     if (x)
       if (m.key === "Enter") {
@@ -299,27 +300,27 @@ const ye = "spreadsheet.bold", be = "spreadsheet.italic", ke = "spreadsheet.unde
     "div",
     {
       className: "k-spreadsheet-name-editor",
-      onKeyDown: R
+      onKeyDown: I
     },
     /* @__PURE__ */ e.createElement(
       he,
       {
         ref: s,
-        title: N().toLanguageString(c.nameBox, E[c.nameBox]),
+        title: R().toLanguageString(c.nameBox, E[c.nameBox]),
         popupSettings: { className: "k-spreadsheet-names-popup" },
         fillMode: "flat",
         clearButton: !1,
         dataItemKey: "name",
         textField: "name",
-        itemRender: g,
+        itemRender: w,
         data: o,
         value: r ? o.find((m) => m.name === r) || { name: r } : null,
         onChange: f,
-        opened: u,
+        opened: d,
         onOpen: p,
-        onClose: b,
+        onClose: h,
         onFocus: D,
-        listNoDataRender: S,
+        listNoDataRender: b,
         allowCustom: !0
       }
     )
@@ -341,7 +342,7 @@ const zn = {
   onEdit: () => {
   }
 }, gt = e.createContext(zn), Bn = (t) => {
-  const n = t.dataItem, { onSelect: a, onDelete: s, onEnterEdit: o, onExitEdit: l, onCancelEdit: u, onEdit: d } = e.useContext(gt), r = e.useCallback((p) => {
+  const n = t.dataItem, { onSelect: a, onDelete: s, onEnterEdit: o, onExitEdit: l, onCancelEdit: d, onEdit: u } = e.useContext(gt), r = e.useCallback((p) => {
     p.target instanceof HTMLElement && p.target.nodeName === "INPUT" || a.call(void 0, n, p);
   }, [n, a]), v = e.useCallback((p) => {
     s.call(void 0, n, p);
@@ -349,11 +350,11 @@ const zn = {
     p.target instanceof HTMLElement && p.target.nodeName === "INPUT" || o.call(void 0, n, p);
   }, [n, o]), C = e.useCallback((p) => {
     l.call(void 0, n, p);
-  }, [n, l]), g = e.useCallback((p) => {
-    p.key === "Enter" ? l.call(void 0, n, p) : p.key === "Escape" && u.call(void 0, n, p);
-  }, [n, l, u]), S = e.useCallback((p) => {
-    d.call(void 0, { ...n, text: p.target.value }, p);
-  }, [n, d]);
+  }, [n, l]), w = e.useCallback((p) => {
+    p.key === "Enter" ? l.call(void 0, n, p) : p.key === "Escape" && d.call(void 0, n, p);
+  }, [n, l, d]), b = e.useCallback((p) => {
+    u.call(void 0, { ...n, text: p.target.value }, p);
+  }, [n, u]);
   return /* @__PURE__ */ e.createElement(
     "li",
     {
@@ -377,11 +378,11 @@ const zn = {
         type: "text",
         className: "k-textbox k-spreadsheet-sheets-editor",
         value: n.text,
-        onChange: S,
+        onChange: b,
         maxLength: 50,
         autoFocus: !0,
         onBlur: C,
-        onKeyDown: g
+        onKeyDown: w
       }
     ) : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { className: "k-link" }, n.text), n.first && n.last ? null : /* @__PURE__ */ e.createElement("span", { className: "k-link k-spreadsheet-sheets-remove", onClick: v }, /* @__PURE__ */ e.createElement(P, { name: "x", icon: pe })))
   );
@@ -400,102 +401,102 @@ const zn = {
 });
 ht.displayName = "TabsList";
 const Pn = (t) => {
-  const { sheets: n, setSheets: a, onSheetSelect: s, onSheetDelete: o, onSheetEdit: l, onSheetReorderEnd: u } = t, [d, r] = e.useState(null), v = e.useRef(!1), y = e.useRef(-1), C = e.useCallback((k) => {
-    a(k.map((w, L, A) => ({ ...w, first: L === 0, last: L === A.length - 1 })));
-  }, []), g = e.useCallback((k) => {
+  const { sheets: n, setSheets: a, onSheetSelect: s, onSheetDelete: o, onSheetEdit: l, onSheetReorderEnd: d } = t, [u, r] = e.useState(null), v = e.useRef(!1), y = e.useRef(-1), C = e.useCallback((k) => {
+    a(k.map((N, L, A) => ({ ...N, first: L === 0, last: L === A.length - 1 })));
+  }, []), w = e.useCallback((k) => {
     C(k.newState);
-  }, [C, u]), S = e.useCallback((k) => {
-    u.call(void 0, k);
-  }, [u]), p = e.useCallback((k) => {
+  }, [C, d]), b = e.useCallback((k) => {
+    d.call(void 0, k);
+  }, [d]), p = e.useCallback((k) => {
     v.current = !0, y.current = k.prevIndex;
-  }, []), b = e.useCallback((k) => {
+  }, []), h = e.useCallback((k) => {
     setTimeout(() => {
       v.current = !1;
-    }, 50), u.call(void 0, { ...k, prevIndex: y.current });
-  }, []), f = e.useCallback((k, w) => {
-    v.current || s.call(void 0, k, w);
-  }, [s]), R = e.useCallback((k, w) => {
-    w.stopPropagation(), o.call(void 0, k);
-  }, [n, o]), D = e.useCallback((k, w) => {
-    w.stopPropagation(), w.preventDefault();
+    }, 50), d.call(void 0, { ...k, prevIndex: y.current });
+  }, []), f = e.useCallback((k, N) => {
+    v.current || s.call(void 0, k, N);
+  }, [s]), I = e.useCallback((k, N) => {
+    N.stopPropagation(), o.call(void 0, k);
+  }, [n, o]), D = e.useCallback((k, N) => {
+    N.stopPropagation(), N.preventDefault();
     const L = n.map((A) => ({ ...A, active: A.id === k.id, inEdit: A.id === k.id }));
     a(L), r({ ...k });
-  }, [n]), m = e.useCallback((k, w) => {
-    w.stopPropagation(), w.preventDefault();
-    const L = n.map((A) => ({ ...A, inEdit: !1, text: A.inEdit && d ? d.text : A.text }));
+  }, [n]), m = e.useCallback((k, N) => {
+    N.stopPropagation(), N.preventDefault();
+    const L = n.map((A) => ({ ...A, inEdit: !1, text: A.inEdit && u ? u.text : A.text }));
     a(L), r(null);
-  }, [n, d]), x = e.useCallback((k, w) => {
-    w.stopPropagation(), w.preventDefault();
+  }, [n, u]), x = e.useCallback((k, N) => {
+    N.stopPropagation(), N.preventDefault();
     const L = n.map((H) => ({ ...H, inEdit: !1 })), A = n.findIndex((H) => H.id === k.id);
     a(L), r(null), l.call(void 0, k, A);
-  }, [n, l]), T = e.useCallback((k, w) => {
-    w.stopPropagation(), w.preventDefault();
+  }, [n, l]), T = e.useCallback((k, N) => {
+    N.stopPropagation(), N.preventDefault();
     const L = n.map((A) => ({ ...A, text: k.id === A.id ? k.text : A.text }));
     a(L);
   }, [n]);
-  return /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-sheets-items k-tabstrip k-floatwrap k-tabstrip-bottom" }, /* @__PURE__ */ e.createElement("div", { className: "k-tabstrip-items-wrapper k-hstack" }, /* @__PURE__ */ e.createElement(gt.Provider, { value: { onSelect: f, onDelete: R, onEnterEdit: D, onCancelEdit: m, onExitEdit: x, onEdit: T } }, /* @__PURE__ */ e.createElement(
+  return /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-sheets-items k-tabstrip k-floatwrap k-tabstrip-bottom" }, /* @__PURE__ */ e.createElement("div", { className: "k-tabstrip-items-wrapper k-hstack" }, /* @__PURE__ */ e.createElement(gt.Provider, { value: { onSelect: f, onDelete: I, onEnterEdit: D, onCancelEdit: m, onExitEdit: x, onEdit: T } }, /* @__PURE__ */ e.createElement(
     Ln,
     {
       idField: "id",
       data: n,
       itemUI: Bn,
       itemsWrapUI: ht,
-      onDragOver: g,
-      onNavigate: S,
+      onDragOver: w,
+      onNavigate: b,
       onDragStart: p,
-      onDragEnd: b
+      onDragEnd: h
     }
   ))));
-}, Hn = (t, n) => t.map((a, s, o) => ({
-  text: a.name(),
-  id: Yt(),
-  first: s === 0,
-  last: s === o.length - 1,
-  active: a.name() === n
+}, Hn = (t, n, a) => t.map((s, o, l) => ({
+  text: s.name(),
+  id: a + "-sheet-" + o,
+  first: o === 0,
+  last: o === l.length - 1,
+  active: s.name() === n
 })), On = (t) => {
-  const { spreadsheetRef: n } = t, [a, s] = e.useState([]), o = e.useRef((a.find((g) => g.active) || {}).text), l = e.useCallback(() => {
-    n.current && (n.current.view.sheetsbar.onSheetSelect(o.current), s(Hn(n.current.sheets(), o.current)));
+  const { spreadsheetRef: n } = t, [a, s] = e.useState([]), o = e.useRef((a.find((b) => b.active) || {}).text), l = Yt(), d = e.useCallback(() => {
+    n.current && (n.current.view.sheetsbar.onSheetSelect(o.current), s(Hn(n.current.sheets(), o.current, l)));
   }, []), u = e.useCallback(() => {
     if (n.current) {
-      const g = n.current.sheets();
-      g.find((S) => S.name() === o.current) || (o.current = g[g.length - 1].name()), l();
+      const b = n.current.sheets();
+      b.find((p) => p.name() === o.current) || (o.current = b[b.length - 1].name()), d();
     }
   }, []);
-  e.useEffect(() => (n.current && (n.current.sheets().length && (o.current = n.current.sheets()[0].name(), l()), n.current.view.bind("update", u)), () => {
+  e.useEffect(() => (n.current && (n.current.sheets().length && (o.current = n.current.sheets()[0].name(), d()), n.current.view.bind("update", u)), () => {
     n.current && n.current.view.unbind("update", u);
   }), [n.current]);
-  const d = e.useCallback((g) => {
-    o.current !== g.text && (o.current = g.text, l());
-  }, []), r = e.useCallback(() => {
+  const r = e.useCallback((b) => {
+    o.current !== b.text && (o.current = b.text, d());
+  }, []), v = e.useCallback(() => {
     if (n.current) {
       n.current.view.sheetsbar.onAddSelect();
-      const g = n.current.sheets();
-      o.current = g[g.length - 1].name(), l();
+      const b = n.current.sheets();
+      o.current = b[b.length - 1].name(), d();
     }
-  }, []), v = e.useCallback((g) => {
+  }, []), y = e.useCallback((b) => {
     if (n.current) {
-      if (o.current === g.text) {
-        const S = n.current.sheets(), p = S.findIndex((f) => f.name() === g.text), b = S[p + 1] || S[p - 1];
-        o.current = b ? b.name() : "";
+      if (o.current === b.text) {
+        const p = n.current.sheets(), h = p.findIndex((I) => I.name() === b.text), f = p[h + 1] || p[h - 1];
+        o.current = f ? f.name() : "";
       }
-      n.current.view.sheetsbar.onSheetRemove(g.text), l();
+      n.current.view.sheetsbar.onSheetRemove(b.text), d();
     }
-  }, []), y = e.useCallback((g, S) => {
+  }, []), C = e.useCallback((b, p) => {
     if (n.current) {
-      let p = g.text;
-      const b = n.current.sheets(), f = b[S];
-      if (!p) {
-        o.current = f.name(), l();
+      let h = b.text;
+      const f = n.current.sheets(), I = f[p];
+      if (!h) {
+        o.current = I.name(), d();
         return;
       }
-      if (f && f.name() === p)
+      if (I && I.name() === h)
         return;
-      b.find((R) => R.name() === p) && (p = f.name()), n.current.view.sheetsbar.onSheetRename(p, S), o.current = p, l();
+      f.find((D) => D.name() === h) && (h = I.name()), n.current.view.sheetsbar.onSheetRename(h, p), o.current = h, d();
     }
-  }, []), C = e.useCallback((g) => {
+  }, []), w = e.useCallback((b) => {
     if (n.current) {
-      const { prevIndex: S, nextIndex: p } = g;
-      o.current = n.current.sheets()[S].name(), n.current.view.sheetsbar.onSheetReorderEnd({ oldIndex: S, newIndex: p }), l();
+      const { prevIndex: p, nextIndex: h } = b;
+      o.current = n.current.sheets()[p].name(), n.current.view.sheetsbar.onSheetReorderEnd({ oldIndex: p, newIndex: h }), d();
     }
   }, []);
   return /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-sheets-bar k-header" }, /* @__PURE__ */ e.createElement(
@@ -504,19 +505,19 @@ const Pn = (t) => {
       fillMode: "flat",
       icon: "plus",
       className: "k-spreadsheet-sheets-bar-add",
-      title: N().toLanguageString(c.addNewSheet, E[c.addNewSheet]),
+      title: R().toLanguageString(c.addNewSheet, E[c.addNewSheet]),
       svgIcon: nn,
-      onClick: r
+      onClick: v
     }
   ), /* @__PURE__ */ e.createElement(
     Pn,
     {
       sheets: a,
       setSheets: s,
-      onSheetSelect: d,
-      onSheetDelete: v,
-      onSheetEdit: y,
-      onSheetReorderEnd: C
+      onSheetSelect: r,
+      onSheetDelete: y,
+      onSheetEdit: C,
+      onSheetReorderEnd: w
     }
   ));
 }, Ct = (t) => {
@@ -544,21 +545,21 @@ const vt = (t) => {
   const { spreadsheetRef: n } = t, a = e.useCallback((o) => {
     const l = o.target;
     if (l instanceof Element && l.parentNode) {
-      const u = l.closest(".k-toolbar"), d = u && u.querySelector(".k-upload input");
-      d && d.click();
+      const d = l.closest(".k-toolbar"), u = d && d.querySelector(".k-upload input");
+      u && u.click();
     }
   }, []), s = e.useCallback((o) => {
     const l = o.newState;
     if (l[0] && l[0].getRawFile) {
-      const u = l[0].getRawFile();
-      n.current && n.current.executeCommand({ command: "OpenCommand", options: { file: u } });
+      const d = l[0].getRawFile();
+      n.current && n.current.executeCommand({ command: "OpenCommand", options: { file: d } });
     }
   }, []);
   return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
     K,
     {
       className: "k-toolbar-button",
-      title: N().toLanguageString(c.open, E[c.open]),
+      title: R().toLanguageString(c.open, E[c.open]),
       icon: "folder-open",
       svgIcon: an,
       fillMode: "flat",
@@ -590,13 +591,13 @@ const Un = ["Arial", "Courier New", "Georgia", "Times New Roman", "Trebuchet MS"
   { text: "Date time", value: "m/d/yyyy h:mm" },
   { text: "Duration", value: "[h]:mm:ss" }
 ], Q = (t) => (a) => {
-  const { property: s, icon: o, svgIcon: l, titleKey: u } = t, { spreadsheetRef: d, value: r } = a, v = e.useCallback(() => {
-    if (d.current) {
+  const { property: s, icon: o, svgIcon: l, titleKey: d } = t, { spreadsheetRef: u, value: r } = a, v = e.useCallback(() => {
+    if (u.current) {
       const C = {
         command: "PropertyChangeCommand",
         options: { property: s, value: !r }
       };
-      d.current.executeCommand(C);
+      u.current.executeCommand(C);
     }
   }, [r]);
   return /* @__PURE__ */ e.createElement(
@@ -609,18 +610,18 @@ const Un = ["Arial", "Courier New", "Georgia", "Times New Roman", "Trebuchet MS"
       togglable: !0,
       onClick: v,
       selected: r,
-      title: N().toLanguageString(u, E[u])
+      title: R().toLanguageString(d, E[d])
     }
   );
 }, yt = (t) => (a) => {
-  const { property: s, titleKey: o, ...l } = t, { spreadsheetRef: u, value: d } = a, r = e.useCallback(
+  const { property: s, titleKey: o, ...l } = t, { spreadsheetRef: d, value: u } = a, r = e.useCallback(
     (v) => {
-      if (u.current) {
+      if (d.current) {
         const y = {
           command: "PropertyChangeCommand",
           options: { property: s, value: v.value || null }
         };
-        u.current.executeCommand(y);
+        d.current.executeCommand(y);
       }
     },
     [s]
@@ -632,8 +633,8 @@ const Un = ["Arial", "Courier New", "Georgia", "Times New Roman", "Trebuchet MS"
       onActiveColorClick: r,
       fillMode: "flat",
       ...l,
-      title: N().toLanguageString(o, E[o]),
-      value: d
+      title: R().toLanguageString(o, E[o]),
+      value: u
     }
   );
 }, bt = (t) => (a) => {
@@ -647,7 +648,7 @@ const Un = ["Arial", "Courier New", "Georgia", "Times New Roman", "Trebuchet MS"
       icon: t.icon,
       svgIcon: t.svgIcon,
       fillMode: "flat",
-      title: N().toLanguageString(t.titleKey, E[t.titleKey]),
+      title: R().toLanguageString(t.titleKey, E[t.titleKey]),
       onClick: o
     }
   );
@@ -675,7 +676,7 @@ const St = (t) => {
       data: Un,
       defaultValue: Vn,
       fillMode: "flat",
-      title: N().toLanguageString(c.fontName, E[c.fontName]),
+      title: R().toLanguageString(c.fontName, E[c.fontName]),
       leftRightKeysNavigation: !1
     }
   );
@@ -683,16 +684,16 @@ const St = (t) => {
 St.displayName = "FontFamily";
 const $ = 1, j = 409, G = (t) => typeof t == "string" ? parseFloat(t) : t, It = (t) => {
   const { spreadsheetRef: n } = t, a = G(t.value), s = e.useCallback((o) => {
-    var d;
+    var u;
     let l = o.value ? G(o.value) : a;
     l = isNaN(l) ? a : l, l = Math.min(j, Math.max($, l));
-    const u = {
+    const d = {
       command: "PropertyChangeCommand",
       options: { property: "fontSize", value: l }
     };
-    o.nativeEvent.type === "keydown" || o.nativeEvent.type === "focusout" ? (d = n.current) == null || d.executeCommand(u) : setTimeout(() => {
+    o.nativeEvent.type === "keydown" || o.nativeEvent.type === "focusout" ? (u = n.current) == null || u.executeCommand(d) : setTimeout(() => {
       var r;
-      (r = n.current) == null || r.executeCommand(u);
+      (r = n.current) == null || r.executeCommand(d);
     }, 0);
   }, [a]);
   return /* @__PURE__ */ e.createElement(
@@ -704,7 +705,7 @@ const $ = 1, j = 409, G = (t) => typeof t == "string" ? parseFloat(t) : t, It =
       defaultValue: _n,
       allowCustom: !0,
       fillMode: "flat",
-      title: N().toLanguageString(c.fontSize, E[c.fontSize]),
+      title: R().toLanguageString(c.fontSize, E[c.fontSize]),
       tabIndex: -1,
       clearButton: !1
     }
@@ -713,13 +714,13 @@ const $ = 1, j = 409, G = (t) => typeof t == "string" ? parseFloat(t) : t, It =
 It.displayName = "FontSize";
 const wt = (t) => {
   const n = (a) => {
-    const { property: s, icon: o, svgIcon: l, titleKey: u, step: d } = t, { spreadsheetRef: r } = a, v = G(a.value), y = e.useCallback(() => {
-      var g;
+    const { property: s, icon: o, svgIcon: l, titleKey: d, step: u } = t, { spreadsheetRef: r } = a, v = G(a.value), y = e.useCallback(() => {
+      var w;
       const C = {
         command: "PropertyChangeCommand",
-        options: { property: s, value: Math.min(j, Math.max($, v + d)) }
+        options: { property: s, value: Math.min(j, Math.max($, v + u)) }
       };
-      (g = r.current) == null || g.executeCommand(C);
+      (w = r.current) == null || w.executeCommand(C);
     }, [v]);
     return /* @__PURE__ */ e.createElement(
       K,
@@ -729,8 +730,8 @@ const wt = (t) => {
         svgIcon: l,
         fillMode: "flat",
         onClick: y,
-        disabled: v + d < $ || v + d > j,
-        title: N().toLanguageString(u, E[u])
+        disabled: v + u < $ || v + u > j,
+        title: R().toLanguageString(d, E[d])
       }
     );
   };
@@ -781,7 +782,7 @@ const O = [
   O[2],
   { ...O[3], textKey: c.justify }
 ], Yn = O.filter((t) => t.commandName === "verticalAlign"), Qn = (t) => {
-  const { value: n, spreadsheetRef: a } = t, { textAlign: s, verticalAlign: o } = n || {}, l = N(), u = e.useCallback((r) => {
+  const { value: n, spreadsheetRef: a } = t, { textAlign: s, verticalAlign: o } = n || {}, l = R(), d = e.useCallback((r) => {
     if (a.current) {
       const v = r.item, y = {
         command: "PropertyChangeCommand",
@@ -790,15 +791,15 @@ const O = [
       a.current.executeCommand(y);
     }
   }, []);
-  let d = O.slice();
-  return d = d.map((r) => ({ ...r, text: l.toLanguageString(r.textKey, E[r.textKey]) })), s && (d = d.map((r) => r.commandName === "textAlign" ? { ...r, selected: r.value === s } : r)), o && (d = d.map((r) => r.commandName === "verticalAlign" ? { ...r, selected: r.value === o } : r)), /* @__PURE__ */ e.createElement(
+  let u = O.slice();
+  return u = u.map((r) => ({ ...r, text: l.toLanguageString(r.textKey, E[r.textKey]) })), s && (u = u.map((r) => r.commandName === "textAlign" ? { ...r, selected: r.value === s } : r)), o && (u = u.map((r) => r.commandName === "verticalAlign" ? { ...r, selected: r.value === o } : r)), /* @__PURE__ */ e.createElement(
     q,
     {
       icon: "align-left",
       svgIcon: X,
-      items: d,
+      items: u,
       fillMode: "flat",
-      onItemClick: u,
+      onItemClick: d,
       title: l.toLanguageString(c.align, E[c.align]),
       text: /* @__PURE__ */ e.createElement(P, { name: "caret-alt-down", icon: fe })
     }
@@ -817,25 +818,25 @@ const eo = {
   titleKey: c.alignVertically
 }, At = (t) => {
   const n = (a) => {
-    const { value: s, spreadsheetRef: o } = a, l = N(), u = e.useCallback((y) => {
+    const { value: s, spreadsheetRef: o } = a, l = R(), d = e.useCallback((y) => {
       if (o.current) {
-        const C = y.item, g = {
+        const C = y.item, w = {
           command: "PropertyChangeCommand",
           options: { property: C.commandName, value: C.value || null }
         };
-        o.current.executeCommand(g);
+        o.current.executeCommand(w);
       }
     }, []);
-    let d = t.items.slice();
-    d = d.map((y) => ({ ...y, text: l.toLanguageString(y.textKey, E[y.textKey]) })), d = d.map((y) => ({ ...y, selected: y.value === s }));
-    const r = { ...t.icon }, v = d.find((y) => y.selected);
+    let u = t.items.slice();
+    u = u.map((y) => ({ ...y, text: l.toLanguageString(y.textKey, E[y.textKey]) })), u = u.map((y) => ({ ...y, selected: y.value === s }));
+    const r = { ...t.icon }, v = u.find((y) => y.selected);
     return v && (r.icon = v.icon, r.svgIcon = v.svgIcon), /* @__PURE__ */ e.createElement(
       q,
       {
         ...r,
-        items: d,
+        items: u,
         fillMode: "flat",
-        onItemClick: u,
+        onItemClick: d,
         title: l.toLanguageString(t.titleKey, E[t.titleKey]),
         text: /* @__PURE__ */ e.createElement(P, { name: "caret-alt-down", icon: fe })
       }
@@ -847,11 +848,11 @@ const eo = {
     if (a.current) {
       const o = a.current.activeSheet();
       if (o) {
-        const d = {
+        const u = {
           command: "TextWrapCommand",
           options: { property: "wrap", value: !o.range(o.activeCell()).wrap() }
         };
-        a.current.executeCommand(d);
+        a.current.executeCommand(u);
       }
     }
   }, []);
@@ -863,7 +864,7 @@ const eo = {
       icon: "text-wrap",
       svgIcon: vn,
       fillMode: "flat",
-      title: N().toLanguageString(c.textWrap, E[c.textWrap]),
+      title: R().toLanguageString(c.textWrap, E[c.textWrap]),
       onClick: s,
       selected: n
     }
@@ -875,11 +876,11 @@ const Tt = (t) => {
     if (a.current) {
       const o = a.current.activeSheet();
       if (o) {
-        const u = {
+        const d = {
           command: "GridLinesChangeCommand",
           options: { property: "gridLines", value: !o.showGridLines() }
         };
-        a.current.executeCommand(u);
+        a.current.executeCommand(d);
       }
     }
   }, []);
@@ -891,7 +892,7 @@ const Tt = (t) => {
       icon: "borders-none",
       svgIcon: yn,
       fillMode: "flat",
-      title: N().toLanguageString(c.gridLines, E[c.gridLines]),
+      title: R().toLanguageString(c.gridLines, E[c.gridLines]),
       onClick: s,
       selected: n
     }
@@ -919,7 +920,7 @@ const Lt = (t) => {
       fillMode: "flat",
       onItemClick: a,
       items: Jn,
-      title: N().toLanguageString(c.format, E[c.format]),
+      title: R().toLanguageString(c.format, E[c.format]),
       text: /* @__PURE__ */ e.createElement(P, { name: "caret-alt-down" })
     }
   );
@@ -928,11 +929,11 @@ Lt.displayName = "Format";
 const U = (t) => (a) => {
   const { spreadsheetRef: s, value: o } = a, l = e.useCallback(() => {
     if (s.current) {
-      const u = {
+      const d = {
         command: t.command,
         options: { value: t.value }
       };
-      s.current.executeCommand(u);
+      s.current.executeCommand(d);
     }
   }, []);
   return /* @__PURE__ */ e.createElement(
@@ -942,7 +943,7 @@ const U = (t) => (a) => {
       icon: t.icon,
       svgIcon: t.svgIcon,
       fillMode: "flat",
-      title: N().toLanguageString(t.titleKey, E[t.titleKey]),
+      title: R().toLanguageString(t.titleKey, E[t.titleKey]),
       onClick: l,
       disabled: o && t.disabled(o)
     }
@@ -1005,13 +1006,13 @@ Ht.displayName = "Undo";
 const mo = { action: "redo", icon: "reload", svgIcon: Rn, titleKey: c.redo }, Ot = bt(mo);
 Ot.displayName = "Redo";
 const Ut = (t) => (a) => {
-  const { icon: s, svgIcon: o, titleKey: l, value: u } = t, { spreadsheetRef: d } = a, r = e.useCallback(() => {
-    if (d.current) {
+  const { icon: s, svgIcon: o, titleKey: l, value: d } = t, { spreadsheetRef: u } = a, r = e.useCallback(() => {
+    if (u.current) {
       const v = {
         command: "AdjustDecimalsCommand",
-        options: { value: u }
+        options: { value: d }
       };
-      d.current.executeCommand(v);
+      u.current.executeCommand(v);
     }
   }, []);
   return /* @__PURE__ */ e.createElement(
@@ -1022,7 +1023,7 @@ const Ut = (t) => (a) => {
       svgIcon: o,
       fillMode: "flat",
       onClick: r,
-      title: N().toLanguageString(l, E[l])
+      title: R().toLanguageString(l, E[l])
     }
   );
 }, po = Ut({
@@ -1085,7 +1086,7 @@ const Ut = (t) => (a) => {
   name: "@progress/kendo-react-spreadsheet",
   productName: "KendoReact",
   productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1701355177,
+  publishDate: 1702305174,
   version: "",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"
 }, ie = ["bold", "italic", "underline", "fontFamily", "fontSize", "color", "background", "textAlign", "verticalAlign", "wrap", "gridLines"], de = {
@@ -1119,15 +1120,15 @@ const Ut = (t) => (a) => {
   Qt(ce);
   const a = en(ce), { toolbar: s = re } = t, o = [];
   typeof s == "boolean" ? o.push(...s ? re : []) : o.push(...s);
-  const [l, u] = e.useState(null), [d, r] = e.useState(o.findIndex((i) => i.selected) || 0), [v, y] = e.useState(!1), C = e.useRef(null), g = e.useRef(null), S = e.useRef(null), p = e.useRef(null), b = e.useRef(null), [f, R] = e.useState({}), D = e.useRef({});
+  const [l, d] = e.useState(null), [u, r] = e.useState(o.findIndex((i) => i.selected) || 0), [v, y] = e.useState(!1), C = e.useRef(null), w = e.useRef(null), b = e.useRef(null), p = e.useRef(null), h = e.useRef(null), [f, I] = e.useState({}), D = e.useRef({});
   D.current = f;
   const m = e.useRef({});
   m.current = t;
-  const x = N(), T = e.useCallback((i) => {
+  const x = R(), T = e.useCallback((i) => {
     m.current.onSelect && m.current.onSelect.call(void 0, i);
   }, []), k = e.useCallback((i) => {
     m.current.onChange && m.current.onChange.call(void 0, i);
-  }, []), w = e.useCallback((i) => {
+  }, []), N = e.useCallback((i) => {
     m.current.onChangeFormat && m.current.onChangeFormat.call(void 0, i);
   }, []), L = e.useCallback((i) => {
     m.current.onExcelImport && m.current.onExcelImport.call(void 0, i);
@@ -1137,68 +1138,68 @@ const Ut = (t) => (a) => {
   e.useImperativeHandle(H, () => ({
     element: C.current,
     get instance() {
-      return b.current;
+      return h.current;
     },
     props: t,
     get view() {
-      return b.current.view;
+      return h.current.view;
     },
     get workbook() {
-      return b.current.workbook;
+      return h.current.workbook;
     },
     executeCommand(i) {
-      var h;
-      (h = b.current) == null || h.executeCommand(i);
+      var g;
+      (g = h.current) == null || g.executeCommand(i);
     },
     fromJSON(i) {
-      var h;
-      return (h = b.current) == null ? void 0 : h.fromJSON(i);
+      var g;
+      return (g = h.current) == null ? void 0 : g.fromJSON(i);
     },
     toJSON() {
-      return b.current.toJSON();
+      return h.current.toJSON();
     },
     saveJSON() {
-      return b.current.saveJSON();
+      return h.current.saveJSON();
     },
     fromFile(i) {
-      return b.current.fromFile(i);
+      return h.current.fromFile(i);
     },
     saveAsExcel(i) {
-      var h;
-      (h = b.current) == null || h.saveAsExcel({
-        ...b.current.options.excel,
+      var g;
+      (g = h.current) == null || g.saveAsExcel({
+        ...h.current.options.excel,
         saveAs: Ce,
         Workbook: ve,
         ...i
       });
     },
     activeSheet(i) {
-      var h;
-      return (h = b.current) == null ? void 0 : h.activeSheet(i);
+      var g;
+      return (g = h.current) == null ? void 0 : g.activeSheet(i);
     },
     sheets() {
-      return b.current.sheets();
+      return h.current.sheets();
     },
     refresh() {
       var i;
-      return (i = b.current) == null ? void 0 : i.refresh();
+      return (i = h.current) == null ? void 0 : i.refresh();
     }
   }), [t]), e.useImperativeHandle(n, () => H.current);
-  const Wt = e.useCallback(() => b.current && b.current.view.nameEditor, []), ee = e.useCallback((i) => {
-    const h = {};
-    ie.forEach((I) => {
-      typeof i.range[I] == "function" ? h[I] = i.range[I]() : I === "gridLines" && (h[I] = i.range.sheet().showGridLines());
-    }), h.selectedHeaders = i.range.sheet().selectedHeaders(), (ie.some((I) => h[I] !== D.current[I]) || h.selectedHeaders.allCols !== D.current.selectedHeaders.allCols || h.selectedHeaders.allRows !== D.current.selectedHeaders.allRows) && R(h);
+  const Wt = e.useCallback(() => h.current && h.current.view.nameEditor, []), ee = e.useCallback((i) => {
+    const g = {};
+    ie.forEach((S) => {
+      typeof i.range[S] == "function" ? g[S] = i.range[S]() : S === "gridLines" && (g[S] = i.range.sheet().showGridLines());
+    }), g.selectedHeaders = i.range.sheet().selectedHeaders(), (ie.some((S) => g[S] !== D.current[S]) || g.selectedHeaders.allCols !== D.current.selectedHeaders.allCols || g.selectedHeaders.allRows !== D.current.selectedHeaders.allRows) && I(g);
   }, []), _t = e.useCallback((i) => {
-    const h = i.name, I = c[h];
-    u({
+    const g = i.name, S = c[g];
+    d({
       title: i.title === "Error" ? x.toLanguageString(c.error, E[c.error] || i.title) : i.title,
-      message: I ? x.toLanguageString(I, E[I] || i.text) : i.text,
+      message: S ? x.toLanguageString(S, E[S] || i.text) : i.text,
       close: i.close
     });
   }, []), te = e.useCallback(() => {
-    u(null), l == null || l.close();
-  }, [l]), V = Tn(), ne = N();
+    d(null), l == null || l.close();
+  }, [l]), V = Tn(), ne = R();
   e.useEffect(() => {
     var W;
     const i = {
@@ -1216,40 +1217,40 @@ const Ut = (t) => (a) => {
         toString: (M, z) => V.toString(M, z),
         format: (M, ...z) => V.format(M, ...z)
       },
-      formulaBarInputRef: g,
-      formulaCellInputRef: S,
+      formulaBarInputRef: w,
+      formulaCellInputRef: b,
       nameBoxRef: p
-    }, h = new Fn(C.current, i);
-    b.current = h, h.bind("select", T), h.bind("change", k), h.bind("changeFormat", w), h.bind("excelImport", L), h.bind("excelExport", A), h.view.bind("update", ee), h.view.bind("message", _t);
-    const I = h.activeSheet();
-    return I && ee({ range: I.range(I.activeCell()) }), y(!0), () => {
-      h.destroy();
+    }, g = new Fn(C.current, i);
+    h.current = g, g.bind("select", T), g.bind("change", k), g.bind("changeFormat", N), g.bind("excelImport", L), g.bind("excelExport", A), g.view.bind("update", ee), g.view.bind("message", _t);
+    const S = g.activeSheet();
+    return S && ee({ range: S.range(S.activeCell()) }), y(!0), () => {
+      g.destroy();
     };
   }, []);
-  const oe = e.useCallback((i, h) => {
-    const I = /* @__PURE__ */ e.createElement(
+  const oe = e.useCallback((i, g) => {
+    const S = /* @__PURE__ */ e.createElement(
       i,
       {
-        spreadsheetRef: b,
+        spreadsheetRef: h,
         value: de[i.displayName] ? de[i.displayName](f) : void 0,
-        key: h
+        key: g
       }
     );
-    return I.type === B ? /* @__PURE__ */ e.createElement(i, { key: h }) : I;
+    return S.type === B ? /* @__PURE__ */ e.createElement(i, { key: g }) : S;
   }, [f]);
   let ae = null;
   return o.length && (ae = /* @__PURE__ */ e.createElement(
     jt,
     {
-      selected: d,
+      selected: u,
       animation: !1,
       className: "k-floatwrap k-spreadsheet-tabstrip",
       style: { minHeight: "auto" },
       onSelect: (i) => r(i.selected)
     },
     o.map((i) => {
-      const h = i.textKey ? ne.toLanguageString(i.textKey, E[i.textKey]) : i.text;
-      return /* @__PURE__ */ e.createElement(Gt, { key: i.textKey || i.text, title: h }, /* @__PURE__ */ e.createElement(Jt, { buttons: go, className: "k-spreadsheet-toolbar" }, i.tools.map((I, W) => Array.isArray(I) ? /* @__PURE__ */ e.createElement($t, { key: W }, I.map((M, z) => oe(M, z))) : oe(I, W))));
+      const g = i.textKey ? ne.toLanguageString(i.textKey, E[i.textKey]) : i.text;
+      return /* @__PURE__ */ e.createElement(Gt, { key: i.textKey || i.text, title: g }, /* @__PURE__ */ e.createElement(Jt, { buttons: go, className: "k-spreadsheet-toolbar" }, i.tools.map((S, W) => Array.isArray(S) ? /* @__PURE__ */ e.createElement($t, { key: W }, S.map((M, z) => oe(M, z))) : oe(S, W))));
     })
   )), /* @__PURE__ */ e.createElement(
     "div",
@@ -1260,9 +1261,9 @@ const Ut = (t) => (a) => {
       role: "application"
     },
     ae,
-    /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-action-bar" }, /* @__PURE__ */ e.createElement(Y, { ref: p, nameEditor: Wt }), /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-formula-bar" }, /* @__PURE__ */ e.createElement(P, { name: "formula-fx", icon: me }), /* @__PURE__ */ e.createElement(_, { ref: g }))),
-    /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-view" }, /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-fixed-container" }), /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-scroller" }, /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-view-size" })), /* @__PURE__ */ e.createElement("div", { tabIndex: 0, className: "k-spreadsheet-clipboard", contentEditable: "true" }), /* @__PURE__ */ e.createElement(_, { ref: S, className: "k-spreadsheet-cell-editor" })),
-    /* @__PURE__ */ e.createElement(On, { spreadsheetRef: b }),
+    /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-action-bar" }, /* @__PURE__ */ e.createElement(Y, { ref: p, nameEditor: Wt }), /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-formula-bar" }, /* @__PURE__ */ e.createElement(P, { name: "formula-fx", icon: me }), /* @__PURE__ */ e.createElement(_, { ref: w }))),
+    /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-view" }, /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-fixed-container" }), /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-scroller" }, /* @__PURE__ */ e.createElement("div", { className: "k-spreadsheet-view-size" })), /* @__PURE__ */ e.createElement("div", { tabIndex: 0, className: "k-spreadsheet-clipboard", contentEditable: "true" }), /* @__PURE__ */ e.createElement(_, { ref: b, className: "k-spreadsheet-cell-editor" })),
+    /* @__PURE__ */ e.createElement(On, { spreadsheetRef: h }),
     l && /* @__PURE__ */ e.createElement(qt, { title: l.title, onClose: te }, /* @__PURE__ */ e.createElement("div", null, l.message), /* @__PURE__ */ e.createElement(Xt, { layout: "start" }, /* @__PURE__ */ e.createElement(
       K,
       {
@@ -1299,7 +1300,7 @@ const Do = (t) => {
       svgIcon: An,
       fillMode: "flat",
       onClick: a,
-      title: N().toLanguageString(c.cleanFormatting, E[c.cleanFormatting])
+      title: R().toLanguageString(c.cleanFormatting, E[c.cleanFormatting])
     }
   );
 };