@sheetxl/studio-vanilla
Version:
SheetXL Studio - Vanilla entry point for integrating SheetXL UI.
50 lines (49 loc) • 3.7 kB
JavaScript
import { a as t } from "./ESo6qTbjf45cfiLm.js";
import { r as s } from "./BjUnH-Jak3KkxyMS.js";
import { T as p, p as L, N as n, S as R, B as j, q as O, I as W, s as q, t as c, v as u, x as G, y as S, z as H } from "./Dm24M4tfHrPDHOCg.js";
/**
* @license @sheetxl/studio-vanilla - SheetXL Studio - Vanilla entry point for integrating SheetXL UI. - v0.6.4
*
* (C) 2025-present SheetXL Inc. & Michael T. Ford
* License: The license can be found at https://www.sheetxl.com/license.
*/
const K = ["Ok", "Cancel"], U = s.memo((F) => {
const { initialValue: w, context: f, onOption: h, onValidateOption: d, onInputOption: C, onDone: m, options: b = K, defaultOption: r = b?.[0], cancelOption: g = "Cancel", sx: P, ...D } = F, [a, v] = s.useState(w), [I, $] = s.useState(!1), x = s.useCallback(async (e, o) => !0, []), y = p(async (e) => {
C?.(a, e), h?.(e, e === g, e === r), m?.();
}, [a, C, m, h, g, r]), N = p(async (e) => {
e.keyCode === L.Enter && await x?.(a, null) !== !1 && y(r);
}, [a, y]), M = p((e) => {
v(e.target.value), x?.(e.target.value, null);
}, [d]), V = p(async (e) => {
let o = await Promise.resolve(d?.(e));
try {
o !== !1 && (o = await Promise.resolve(x?.(a, e)) ?? !0);
} catch {
}
return o ?? !0;
}, [d]), [T, k] = s.useState(n.Styles.lookupStyle(a).formatType ?? n.Type.Custom);
s.useEffect(() => {
k(n.Styles.lookupStyle(a).formatType ?? n.Type.Custom);
}, [a]);
const z = s.useMemo(() => {
const e = n.Styles.lookupPrimary(), o = (l) => t.jsx(H, { value: l, children: l }, l), i = Object.keys(e).map((l) => o(e[l].formatType));
return i.push(o(n.Type.Custom)), i;
}, []), B = s.useCallback((e) => {
const o = e.target.value;
k(o);
const i = n.Styles.lookupDefault(o);
i && v(i);
}, []), E = s.useMemo(() => {
const e = f();
return e.createTemporaryCell({ value: e.getValue() ?? 12345, style: { numberFormat: a } });
}, [T, a, f]);
return t.jsx(R, { title: "Number Format", options: b, onDone: m, onOption: (e) => y(e), onValidateOption: V, defaultOption: r, cancelOption: g, autoFocusSel: ".autoFocus", sx: { width: "580px", ...P }, ...D, children: t.jsxs(j, { sx: { paddingTop: (e) => e.spacing(1), paddingBottom: (e) => e.spacing(0), rowGap: (e) => e.spacing(1), display: "flex", flexDirection: "column" }, children: [t.jsxs(O, { sx: { minWidth: 135 }, size: "small", children: [t.jsx(W, { children: "Category" }), t.jsx(q, { value: T, label: "Category", onChange: B, sx: { backgroundImage: `linear-gradient(${c("#fff", u(5))}, ${c("#fff", u(5))})` }, children: z })] }), t.jsx(O, { sx: { paddingTop: (e) => e.spacing(1.5), minWidth: 135, width: "100%" }, size: "small", children: t.jsx(G, { label: "Code", onFocus: (e) => {
I || e.target?.select(), $(!0);
}, sx: { "& .MuiFormHelperText-root": { marginTop: (e) => e.spacing(0.5) } }, InputLabelProps: { shrink: !0 }, InputProps: { inputProps: { className: "autoFocus", spellCheck: !1, autoComplete: "off", sx: { paddingTop: (e) => e.spacing(1.25), paddingBottom: (e) => e.spacing(0.75), backgroundImage: `linear-gradient(${c("#fff", u(5))}, ${c("#fff", u(5))})` } } }, value: a, onChange: M, onKeyDown: N, onContextMenu: (e) => {
e.stopPropagation();
} }) }), t.jsxs(j, { children: [t.jsx(S, { variant: "caption", component: "div", sx: { paddingLeft: (e) => e.spacing(2) }, children: "Preview" }), t.jsx(S, { variant: "body2", component: "div", sx: { borderRadius: (e) => `${e.shape.borderRadius}px`, padding: (e) => e.spacing(1), border: (e) => `1px solid ${e.palette.grey[400]}` }, children: E.getNumberFormat().displayText || "(empty)" })] })] }) });
});
export {
U as NumberFormatDialog,
U as default
};