@progress/kendo-react-layout
Version:
React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package
88 lines (87 loc) • 2.29 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 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 h, 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 i = e.forwardRef((s, d) => {
const {
className: p,
style: u,
text: f,
icon: n,
svgIcon: l,
separator: b,
disabled: a,
selected: I,
onSelect: o,
index: c,
tabIndex: x,
children: k,
...g
} = s, { expanded: F, mini: H, item: N } = e.useContext(j), r = e.useRef(null), m = e.useCallback(() => {
r.current && r.current.focus();
}, []);
e.useImperativeHandle(
d,
() => ({
element: r.current,
focus: m,
props: s
})
);
const w = h(
"k-drawer-item",
{
"k-selected": I,
"k-disabled": a
},
p
), C = e.useCallback(
(E) => {
if (o && !a) {
const v = {
element: r.current,
focus: m,
props: s
};
o(v, c, E);
}
},
[o, c, a]
), y = /* @__PURE__ */ e.createElement(e.Fragment, null, (n || l) && /* @__PURE__ */ e.createElement(R, { name: n && T(n), icon: l }), /* @__PURE__ */ e.createElement("span", { className: "k-item-text" }, f));
return b ? /* @__PURE__ */ e.createElement("li", { className: "k-drawer-item k-drawer-separator", role: "separator" }) : /* @__PURE__ */ e.createElement(
"li",
{
ref: r,
className: w,
style: u,
role: "menuitem",
"aria-disabled": a || void 0,
onClick: C,
tabIndex: D(x, a),
...g
},
N ? k : y
);
});
i.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
};
i.displayName = "KendoDrawerItem";
export {
i as DrawerItem
};