@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
65 lines (64 loc) • 2.79 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 s from "react";
import { classNames as i } from "@progress/kendo-react-common";
import { chevronLeftIcon as n, chevronRightIcon as c } from "@progress/kendo-svg-icons";
import l from "./Attachment.mjs";
import { SelectableItemsContainer as h } from "./base/SelectableItemsContainer.mjs";
import { Button as r } from "@progress/kendo-react-buttons";
class k extends h {
render() {
const t = this.isCardDeckLayout(this.props), o = /* @__PURE__ */ s.createElement("div", { className: this.getClassNames(), onKeyDown: t ? void 0 : this.onKeyDown }, this.props.group.attachments.map((a, e) => /* @__PURE__ */ s.createElement(
l,
{
item: a,
template: this.props.itemTemplate,
selected: e === this.state.selectedItemIndex,
tabbable: this.props.isLastGroup && e === this.state.selectedItemIndex,
isFirstItemInGroup: e === 0,
isLastItemInGroup: e === this.getLastItemIndex(),
onClick: () => this.onAttachmentClick(e),
key: e
}
)));
return t ? /* @__PURE__ */ s.createElement("div", { className: "k-card-deck-scrollwrap", onKeyDown: this.onKeyDown }, this.getLeftScrollBtn(), o, this.getRightScrollBtn()) : o;
}
// Overriding the default navigation.
get isKeyboardNavigationLeftRight() {
return this.isCardDeckLayout(this.props);
}
getLastItemIndex() {
return this.props.group.attachments.length - 1;
}
getLeftScrollBtn() {
let t = null;
return this.isCardDeckLayout(this.props) && this.state.selectedItemIndex && (t = /* @__PURE__ */ s.createElement(r, { icon: "chevron-left", onClick: () => this.onNavigateBtnClick(!1), svgIcon: n })), t;
}
getRightScrollBtn() {
let t = null;
return this.isCardDeckLayout(this.props) && this.state.selectedItemIndex !== this.getLastItemIndex() && (t = /* @__PURE__ */ s.createElement(r, { icon: "chevron-right", onClick: () => this.onNavigateBtnClick(!0), svgIcon: c })), t;
}
onAttachmentClick(t) {
this.onRequestContainerSelection(), this.setState({ selectedItemIndex: t });
}
onNavigateBtnClick(t) {
this.onRequestContainerSelection(), this.navigate(t, 1);
}
isCardDeckLayout(t) {
return t.group.attachmentLayout !== "list";
}
getClassNames() {
return i({
"k-card-list": this.props.group.attachmentLayout,
"k-card-deck": this.isCardDeckLayout(this.props)
});
}
}
export {
k as default
};