@progress/kendo-react-conversational-ui
Version:
React Chat component allows the user to participate in chat sessions with users or chat bots. KendoReact Conversational UI components
78 lines (77 loc) • 2.63 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 { Keys as g, classNames as L } from "@progress/kendo-react-common";
import K from "./Action.mjs";
import { ScrollButtonsWrapper as q } from "./ScrollButtonsWrapper.mjs";
import { useScrollWithButtons as v } from "../hooks/useScrollWithButtons.mjs";
const W = (b) => {
var p;
const { group: n, onActionExecute: C, selected: r, onRequestSelection: u, quickActionsLayout: c = "scroll", dir: f } = b, [e, a] = t.useState(null), d = t.useRef(null), { canScrollLeft: k, canScrollRight: S, scrollLeft: I, scrollRight: x } = v(d, {
enabled: c === "scrollbuttons",
dir: f,
itemsDependency: n.actions
});
t.useEffect(() => {
!r && e !== null ? a(null) : r && e === null && a(0);
}, [r, e]);
const m = t.useCallback(() => n.actions ? n.actions.length - 1 : -1, [n.actions]), i = t.useCallback(
(l, s = 0) => {
let o = null;
return l ? e === null ? o = s : e < m() && (o = e + 1) : e === null ? o = 0 : e > 0 && (o = e - 1), o !== null && a(o), o;
},
[e, m]
), y = t.useCallback(() => {
u(n.selectionIndex);
}, [u, n.selectionIndex]), R = t.useCallback(
(l) => {
let s = null;
const o = g.left, E = g.right;
l.keyCode === o ? s = i(!1) : l.keyCode === E && (s = i(!0)), s !== null && (l.preventDefault(), l.stopPropagation());
},
[i]
), h = t.useCallback(() => L("k-suggestion-group", {
// Apply scrollable class only when layout is 'scroll' (no scroll buttons)
"k-suggestion-group-scrollable": c === "scroll"
}), [c]), A = /* @__PURE__ */ t.createElement(
"div",
{
className: h(),
onClick: y,
onKeyDown: R,
role: "toolbar",
tabIndex: 0,
"aria-label": "Action group",
ref: c === "scrollbuttons" ? d : void 0
},
(p = n.actions) == null ? void 0 : p.map((l, s) => /* @__PURE__ */ t.createElement(
K,
{
item: l,
onActionExecute: C,
selected: s === e,
key: l.value
}
))
);
return /* @__PURE__ */ t.createElement(
q,
{
visible: c === "scrollbuttons",
dir: f,
canScrollLeft: k,
canScrollRight: S,
onScrollLeft: I,
onScrollRight: x
},
A
);
};
export {
W as default
};