UNPKG

@progress/kendo-react-grid

Version:

React Data Grid (Table) provides 100+ ready-to-use data grid features. KendoReact Grid package

203 lines (202 loc) 6.7 kB
/** * @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 e from "react"; import { GridContext as rt } from "../utils/GridContext.mjs"; import { Button as at } from "@progress/kendo-react-buttons"; import { sparklesIcon as it } from "@progress/kendo-svg-icons"; import F from "axios"; import { useLocalization as lt } from "@progress/kendo-react-intl"; import { toolbarAI as S, messages as w, aIResponseData as W, generatedWithAI as j } from "../messages/index.mjs"; import { useCustomComponent as ut, classNames as ct } from "@progress/kendo-react-common"; import { Window as pt } from "@progress/kendo-react-dialogs"; import { GridAIPrompt as dt } from "./ai-tool/GridAIPrompt.mjs"; import { combineSmartFilters as ft, parseFilterDates as mt } from "../filterCommon.mjs"; const gt = (l, b) => l.map((u) => { let c = u; return b.forEach((i) => { i.field && c.includes(i.field) && (c = c.replace(new RegExp(i.field, "g"), i.title || i.field)); }), c; }), ht = e.forwardRef( (l, b) => { const o = e.useContext(rt), u = lt(), { requestUrl: c, requestOptions: i, onPromptRequest: E, onResponseSuccess: O, onResponseError: x, role: B = "user", gridAIPrompt: D = dt, icon: H, svgIcon: A, onCloseWindow: R, promptPlaceHolder: v, suggestionsList: z, streaming: M, loading: N, outputs: $ } = l, [T, L] = e.useState([]), K = e.useMemo(() => o && Array.isArray(o.columnsRef) ? o.columnsRef.map((t) => ({ field: t.field })) : [], [o]), [U, m] = e.useState(!1), [g, k] = e.useState(!1), [X, Y] = e.useState(), [J, Q] = e.useState(), p = e.useRef(null), y = e.useRef(null), V = (t) => { t.preventDefault(), k(!g); }, I = e.useMemo(() => { var t; return (t = l.show) != null ? t : g; }, [l.show, g]), h = e.useCallback(() => { var t; R && R(), L([]), k(!1), p.current && ((t = p.current.element) == null || t.focus()); }, [R]), Z = (t, n, d) => { var a, C; if (m(!1), t != null && t.data) { if (o.sortable && t.data.sort) if (t.data.sort.length === 0) o.sortChange([], t); else { const r = (a = o.sort) != null ? a : [], s = []; r.forEach((f) => { t.data.sort.some((P) => P.field === f.field) || s.push(f); }), s.push(...t.data.sort), o.sortChange(s, t); } if (t.data.filter) { const r = ft(t.data.filter, o.filter); o.filterChange(r, t); } if (t.data.highlight) { let r = t.data.highlight; Array.isArray(r) && (r = r.map((s) => (s != null && s.filters && Array.isArray(s.filters) && mt(s), s))), o.applyHighlightDescriptor(r); } if (o && t.data.group) if (t.data.group.length === 0) o.groupChange([], t); else { const r = (C = o.group) != null ? C : [], s = []; r.forEach((f) => { t.data.group.some((P) => P.field === f.field) || s.push(f); }), s.push(...t.data.group), o.groupChange(s, t); } if (t.data.messages) { const r = [ u.toLanguageString(W, w[W]) ], s = gt(t.data.messages, o.columnsRef).join( ` ` ); L([ { id: T.length + 1, title: u.toLanguageString(j, w[j]), subTitle: n, prompt: n, responseContent: r.concat(s).join(""), isRetry: d }, ...T ]); } } O && O(t, n, d); }, _ = (t) => { x && x(t), m(!1); }, q = (t, n) => { const d = F.CancelToken.source(), a = { role: "user", columns: K || [], headers: { Accept: "*/*", "Content-Type": "application/json" }, promptMessage: t, requestOptions: { url: c, method: "POST", withCredentials: !1, responseType: "json", cancelToken: d.token, ...i } }; E && E(a, n), a.requestOptions.url !== void 0 && (m(!0), F({ ...a.requestOptions, headers: a.headers, data: { role: B || a.role, contents: [ { $type: "text", text: a.promptMessage } ], columns: a.columns || [] }, ...l.requestOptions }).then((C) => Z(C, a.promptMessage, n)).catch(_), y.current = d); }, tt = e.useCallback(() => { y.current && y.current.cancel("Request cancelled by user."), m(!1); }, []), [et, G] = ut( D ), ot = Object.keys(G).length > 0 ? G : {}, st = /* @__PURE__ */ e.createElement( et, { onPromptRequest: q, onCancel: tt, onClose: h, streaming: M || U, loading: N, outputs: $ || T, promptPlaceHolder: v, suggestionsList: z, ...ot } ), nt = /* @__PURE__ */ e.createElement( at, { ref: p, togglable: !0, themeColor: "primary", rounded: "full", selected: I, svgIcon: A != null ? A : it, icon: H, size: o.mobileMode ? "large" : "medium", className: ct("k-toolbar-button", { "k-icon-button": o.mobileMode }), title: u.toLanguageString(S, w[S]), onClick: V } ); return e.useEffect(() => { var t; if (p.current && I) { const n = (t = p.current.element) == null ? void 0 : t.getBoundingClientRect(); n && (Y(n.top + window.scrollY + n.height), Q(n.left + window.scrollX + n.width)); } }, [I]), e.useImperativeHandle( b, () => ({ show: () => k(!0), hide: () => h() }), [h] ), /* @__PURE__ */ e.createElement(e.Fragment, null, nt, g && /* @__PURE__ */ e.createElement( pt, { autoFocus: !1, title: u.toLanguageString(S, w[S]), initialTop: X, initialLeft: J, initialWidth: 520, initialHeight: 500, onClose: h, resizable: !0, draggable: !0, className: "k-grid-assistant-window" }, st )); } ); ht.displayName = "KendoReactGridToolbarAIAssistant"; export { ht as GridToolbarAIAssistant };