@progress/kendo-react-layout/drawer/Drawer.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 I=require("react"),e=require("prop-types"),M=require("./context/DrawerContext.js"),T=require("./DrawerNavigation.js"),u=require("@progress/kendo-react-common");function W(n){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(o,r,a.get?a:{enumerable:!0,get:()=>n[r]})}}return o.default=n,Object.freeze(o)}const t=W(I),m=t.forwardRef((n,o)=>{const{expanded:r=i.expanded,mode:a=i.mode,position:y=i.position,className:g,drawerClassName:h,children:k,style:D,animation:N=i.animation,mini:f=i.mini,width:C=i.width,miniWidth:x,items:c,item:R,tabIndex:O,onOverlayClick:S,onSelect:l}=n,s=t.useRef(null),w=t.useRef(null),p=t.useCallback(()=>{s.current&&s.current.focus()},[]),b=t.useCallback(()=>({element:s.current,focus:p}),[p]);t.useImperativeHandle(o,b),t.useImperativeHandle(w,b),u.useWebMcpRegister("drawer",w,n,n.webMcp);const E=t.useCallback((P,q,d)=>{if(c&&l){const H={itemTarget:P,itemIndex:q,syntheticEvent:d,nativeEvent:d&&d.nativeEvent,target:void 0};l.call(void 0,H)}},[c,l]),v=u.useDir(s,n.dir),j=u.classNames({"k-drawer-container":!0,"k-drawer-expanded":r,"k-drawer-overlay":a==="overlay","k-drawer-push":a==="push","k-drawer-mini":f&&!r},g);return t.createElement(M.DrawerContext.Provider,{value:{animation:N,expanded:r,mode:a,position:y,mini:f,dir:v,items:c,item:R,width:C,miniWidth:x,onOverlayClick:S,onSelect:E}},t.createElement("div",{className:j,ref:s,dir:v,style:D,tabIndex:O},c&&t.createElement(T.DrawerNavigation,{className:h}),k))});m.propTypes={animation:e.any,expanded:e.bool,children:e.any,className:e.string,dir:e.string,mode:e.string,position:e.string,mini:e.bool,style:e.object,tabIndex:e.number,width:e.number,miniWidth:e.number,selected:e.number,onSelect:e.func,onOverlayClick:e.func};const i={animation:!0,expanded:!1,mode:"overlay",position:"start",mini:!1,width:240};m.displayName="KendoDrawer";exports.Drawer=m;