@progress/kendo-react-layout
Version:
React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package
89 lines (88 loc) • 2.3 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 e from "react";
import t from "prop-types";
import { classNames as v, IconWrap as R, toIconName as T, getTabIndex as D, svgIconPropType as P } from "@progress/kendo-react-common";
import { DrawerContext as j } from "./context/DrawerContext.mjs";
const d = e.forwardRef((s, p) => {
const {
className: u,
style: f,
text: l,
icon: n,
svgIcon: c,
separator: b,
disabled: a,
selected: I,
onSelect: o,
index: m,
tabIndex: x,
children: k,
...g
} = s, { expanded: F, mini: H, item: N } = e.useContext(j), r = e.useRef(null), i = e.useCallback(() => {
r.current && r.current.focus();
}, []);
e.useImperativeHandle(
p,
() => ({
element: r.current,
focus: i,
props: s
})
);
const w = v(
"k-drawer-item",
{
"k-selected": I,
"k-disabled": a
},
u
), C = e.useCallback(
(E) => {
if (o && !a) {
const h = {
element: r.current,
focus: i,
props: s
};
o(h, m, E);
}
},
[o, m, a]
), y = /* @__PURE__ */ e.createElement(e.Fragment, null, (n || c) && /* @__PURE__ */ e.createElement(R, { name: n && T(n), icon: c }), /* @__PURE__ */ e.createElement("span", { className: "k-item-text" }, l));
return b ? /* @__PURE__ */ e.createElement("li", { className: "k-drawer-item k-drawer-separator", role: "separator" }) : /* @__PURE__ */ e.createElement(
"li",
{
ref: r,
className: w,
style: f,
role: "menuitem",
"aria-label": l,
"aria-disabled": a,
onClick: C,
tabIndex: D(x, a),
...g
},
N ? k : y
);
});
d.propTypes = {
className: t.string,
style: t.object,
text: t.string,
icon: t.string,
svgIcon: P,
separator: t.bool,
selected: t.bool,
disabled: t.bool,
targetItem: t.any
};
d.displayName = "KendoDrawerItem";
export {
d as DrawerItem
};