@progress/kendo-react-spreadsheet
Version:
KendoReact Spreadsheet package
116 lines (115 loc) • 3.6 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import * as t from "react";
import { Popup as w } from "@progress/kendo-react-popup";
import { List as I } from "./List.mjs";
import { classNames as L } from "@progress/kendo-react-common";
const y = t.forwardRef((i, x) => {
const [c, m] = t.useState(!1), [p, b] = t.useState(0), [f, v] = t.useState([]), s = t.useMemo(() => ({}), []);
s.showPopup = c, s.popupContentKey = p, s.data = f;
const d = t.useRef(null), l = t.useRef(null), n = t.useRef(null), u = t.useCallback(() => {
if (n.current && n.current.element)
return n.current.element.querySelector(".k-focus");
}, []), h = t.useCallback(() => {
const e = u();
e && e.classList.remove("k-focus");
}, []), k = t.useCallback((e) => {
const r = Array.from(n.current && n.current.element.children || []), a = u();
let o;
if (a) {
const C = r.indexOf(a);
a.classList.remove("k-focus"), o = r[C + e] ? r[C + e] : e === 1 ? r[0] : r[r.length - 1];
} else
o = e === 1 ? r[0] : r[r.length - 1];
o && o.classList.add("k-focus");
}, []);
t.useImperativeHandle(
d,
() => ({
element: l.current,
props: i,
popup: {
open: () => {
m(!0);
},
close: () => {
m(!1);
},
position: () => {
b(s.popupContentKey + 1);
},
visible: () => s.showPopup
},
list: {
get element() {
return n.current && n.current.element;
},
data: (e) => {
if (e)
v(e);
else
return s.data;
},
value: () => ({}),
focus: () => Array.from(
n.current && n.current.element && n.current.element.children || []
).indexOf(u()),
focusNext: () => {
k(1);
},
focusPrev: () => {
k(-1);
},
focusFirst: () => {
const e = n.current && n.current.element;
e && e.children.item(0) && (h(), e.children.item(0).classList.add("k-focus"));
},
focusLast: () => {
const e = n.current && n.current.element;
e && e.children.length && (h(), e.children.item(e.children.length - 1).classList.add("k-focus"));
},
itemClick: (e) => {
s.itemClick = e;
}
}
}),
[]
), t.useImperativeHandle(x, () => d.current, []);
const g = t.useCallback((e) => {
s.itemClick && s.itemClick(e);
}, []);
return /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
"div",
{
className: L("k-spreadsheet-formula-input", i.className),
contentEditable: "true",
spellCheck: "false",
style: { whiteSpace: "pre" },
ref: l,
"aria-haspopup": "menu",
title: "Formula Input",
"aria-expanded": c,
role: "combobox"
}
), /* @__PURE__ */ t.createElement(
w,
{
show: c,
anchor: l.current,
animate: { openDuration: 100, closeDuration: 100 },
contentKey: p,
popupClass: "k-list-container"
},
/* @__PURE__ */ t.createElement(I, { data: f, ref: n, onItemClick: g })
));
});
y.displayName = "FormulaInput";
y.propTypes = {};
export {
y as FormulaInput
};