@progress/kendo-react-layout/bottomnavigation/BottomNavigationItem.js

React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react"),n=require("prop-types"),f=require("@progress/kendo-react-common");function D(t){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const o in t)if(o!=="default"){const l=Object.getOwnPropertyDescriptor(t,o);Object.defineProperty(c,o,l.get?l:{enumerable:!0,get:()=>t[o]})}}return c.default=t,Object.freeze(c)}const e=D(w),g=e.forwardRef((t,c)=>{const o=e.useRef(null);e.useImperativeHandle(c,()=>({element:o.current}));const{className:l,style:k,selected:i,disabled:a,item:N,render:x,dataItem:C,icon:m,svgIcon:r,text:d,id:R,onSelect:u,onKeyDown:b,index:s,tabIndex:j=E.tabIndex}=t,O=e.useMemo(()=>f.classNames("k-bottom-nav-item",{"k-selected":i,"k-disabled":a},l),[i,a,l]),P=e.useCallback(p=>{u&&s!==void 0&&!a&&u(p,s)},[u,s,a]),S=e.useCallback(p=>{b&&s!==void 0&&!a&&b(p,s)},[b,s,a]),v=x,y=N,I=e.createElement("span",{ref:o,className:O,style:k,role:"link",id:R,tabIndex:j,onClick:P,onKeyDown:S,"aria-current":i,"aria-disabled":a,"aria-label":d?void 0:(r==null?void 0:r.name)||m||void 0},y?e.createElement(y,{itemIndex:s,item:C}):e.createElement(e.Fragment,null,(m||r)&&e.createElement(f.IconWrap,{className:"k-bottom-nav-item-icon",name:m,icon:r,size:"xlarge"}),d&&e.createElement("span",{className:"k-bottom-nav-item-text",style:{userSelect:"none"}},d)));return v!==void 0?v.call(void 0,I,t):I}),E={tabIndex:0};g.propTypes={className:n.string,style:n.object,id:n.string,disabled:n.bool,selected:n.bool,icon:n.string,svgIcon:f.svgIconPropType,text:n.string,tabIndex:n.number};g.displayName="KendoReactBottomNavigationItem";exports.BottomNavigationItem=g;