@progress/kendo-react-layout
Version:
React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package
92 lines (91 loc) • 2.41 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 D, svgIconPropType as P, IconWrap as T } from "@progress/kendo-react-common";
const f = e.forwardRef(
(m, g) => {
const i = e.useRef(null);
e.useImperativeHandle(
g,
() => ({
element: i.current
})
);
const {
className: r,
style: x,
selected: a,
disabled: n,
item: k,
render: y,
dataItem: N,
icon: d,
svgIcon: b,
text: p,
id: C,
onSelect: s,
onKeyDown: l,
index: o,
tabIndex: E = h.tabIndex
} = m, R = e.useMemo(
() => D(
"k-bottom-nav-item",
{
"k-selected": a,
"k-disabled": n
},
r
),
[a, n, r]
), w = e.useCallback(
(c) => {
s && o !== void 0 && !n && s(c, o);
},
[s, o, n]
), K = e.useCallback(
(c) => {
l && o !== void 0 && !n && l(c, o);
},
[l, o, n]
), I = y, v = k, u = /* @__PURE__ */ e.createElement(
"span",
{
ref: i,
className: R,
style: x,
role: "link",
id: C,
tabIndex: E,
onClick: w,
onKeyDown: K,
"aria-current": a,
"aria-disabled": n
},
v ? /* @__PURE__ */ e.createElement(v, { itemIndex: o, item: N }) : /* @__PURE__ */ e.createElement(e.Fragment, null, (d || b) && /* @__PURE__ */ e.createElement(T, { className: "k-bottom-nav-item-icon", name: d, icon: b, size: "xlarge" }), p && /* @__PURE__ */ e.createElement("span", { className: "k-bottom-nav-item-text", style: { userSelect: "none" } }, p))
);
return I !== void 0 ? I.call(void 0, u, m) : u;
}
), h = {
tabIndex: 0
};
f.propTypes = {
className: t.string,
style: t.object,
id: t.string,
disabled: t.bool,
selected: t.bool,
icon: t.string,
svgIcon: P,
text: t.string,
tabIndex: t.number
};
f.displayName = "KendoReactBottomNavigationItem";
export {
f as BottomNavigationItem
};