@progress/kendo-react-layout
Version:
React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package
15 lines • 113 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
*-------------------------------------------------------------------------------------------
*/
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-popup"),require("@progress/kendo-svg-icons"),require("@progress/kendo-react-buttons"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-animation"),require("@progress/kendo-react-progressbars")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-popup","@progress/kendo-svg-icons","@progress/kendo-react-buttons","@progress/kendo-react-intl","@progress/kendo-react-animation","@progress/kendo-react-progressbars"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactLayout={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactPopup,e.KendoSvgIcons,e.KendoReactButtons,e.KendoReactIntl,e.KendoReactAnimation,e.KendoReactProgressbars)}(this,(function(e,t,s,n,i,r,a,o,l,c){"use strict";function d(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(s){if("default"!==s){var n=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,n.get?n:{enumerable:!0,get:function(){return e[s]}})}})),t.default=e,Object.freeze(t)}var p=d(t);const m="",u="0",h="_";function g(e,t){if(I(e))return t[Number(e)];const s=t[Number(f(e))];return s.items?g(function(e){if(k(e))return e;const t=e.indexOf(h);return e.substring(t+1)}(e),s.items):void 0}function f(e){return k(e)?e:e.split(h)[0]}function b(e){return v("0",e)}function v(e,t){return t?t+h+e:e}function y(e){const t=e.lastIndexOf(h);return t<0?m:e.substring(0,t)}function k(e){return e===m||e.indexOf(h)<0}function I(e){return e!==m&&e.indexOf(h)<0}function N(e){return 1===function(e){return e.split(h).length-1}(e)}function E(e){return x(e)===u}function x(e){const t=e.lastIndexOf(h);return t<0?e:e.substring(t+1)}function w(e,t,s){return I(t)?e?Number(t)<s-1?(Number(t)+1).toString():"0":Number(t)>0?(Number(t)-1).toString():(s-1).toString():t}const C=class extends p.Component{render(){return null}};C.propTypes={text:s.string,url:s.string,icon:s.string,disabled:s.bool,cssClass:s.string,cssStyle:s.object,render:s.any,linkRender:s.any,contentRender:s.any,data:s.any,separator:s.bool};let S=C;function R(e,t){if(e&&e.length>0)return{items:M(e),inputItems:e};if(T(t).length>0){const e=O(T(t));return{items:M(e),inputItems:e}}return{items:[],inputItems:[]}}function D(e,t){const s={},{text:n,url:i,icon:r,svgIcon:a,disabled:o,cssClass:l,cssStyle:c,render:d,linkRender:p,contentRender:m,data:u,separator:h}=e||t.props;return void 0!==n&&(s.text=n),void 0!==i&&(s.url=i),void 0!==r&&(s.icon=r),void 0!==a&&(s.svgIcon=a),void 0!==o&&(s.disabled=o),void 0!==l&&(s.cssClass=l),void 0!==c&&(s.cssStyle=c),void 0!==d&&(s.render=d),void 0!==p&&(s.linkRender=p),void 0!==m&&(s.contentRender=m),void 0!==u&&(s.data=u),void 0!==h&&(s.separator=h),s}function T(e){return p.Children.toArray(e).filter((e=>e&&e.type===S))}function O(e){const t=[];for(let s=0;s<e.length;s++){const n=e[s],i=D(void 0,n),r=O(T(n.props.children));r.length>0&&(i.items=r),t.push(i)}return t}function M(e,t){const s=[];for(let n=0;n<e.length;n++){const i=e[n],r=D(i);r.id=v(n.toString(),t),r.isLastFromSiblings=n===e.length-1,r.separator=!0===i.separator,r.items=P(i,r),s.push(r)}return s}function P(e,t){return e.contentRender?[{contentParentItemId:t.id,id:v(u,t.id),isLastFromSiblings:!0,separator:!1,contentRender:e.contentRender,items:[]}]:e.items?M(e.items,t.id):[]}const A=/\S/;function z(e,t,s,i,r,a){const o=h();switch(s){case n.Keys.left:return r?a?p():c():a?d():l();case n.Keys.right:return r?a?c():p():a?l():d();case n.Keys.up:return r?E():I(t)?u():E();case n.Keys.down:return r?C():I(t)?m():C();case n.Keys.enter:case n.Keys.space:return o.disabled?t:k()?b(t):f(t);case n.Keys.home:return S()[0].id;case n.Keys.end:return function(){const e=S();return e[e.length-1].id}();case n.Keys.esc:return I(t)?t:y(t);default:return 1===i.length&&A.test(i)?function(){const e=i.toLowerCase(),s=S(),n=Number(x(t)),r=s.slice(n+1).concat(s.slice(0,n+1)).find((t=>(t.text||"").toLowerCase().startsWith(e)));return r?r.id:t}():t}function l(){return I(t)?E():N(t)?m(E(f(t))):y(t)}function c(){return I(t)?u():y(t)}function d(){return I(t)?C():m(k()?t:C(f(t)))}function p(){return m(I(t)||k()?t:C(f(t)))}function m(e){return R(!0,e)}function u(e){return R(!1,e)}function h(s,n){return void 0===s&&(s=t),void 0===n&&(n=e),g(s,n)}function k(e){return h(e).items.length>0}function E(e){return D(!1,e)}function C(e){return D(!0,e)}function S(){return I(t)?e:h(y(t),e).items}function R(e,s){void 0===s&&(s=t);const n=h(s);return k(s)&&!n.disabled?e?b(s):function(e){const t=h(e).items;return t[t.length-1].id}(s):s}function D(s,n){if(void 0===n&&(n=t),I(n))return w(s,n,e.length);const i=y(n);return v(w(s,x(n),h(i).items.length),i)}}const L={vertical:"flip",horizontal:"fit"},F={vertical:"fit",horizontal:"flip"},K={downward:{anchorAlign:{vertical:"bottom",horizontal:"right"},popupAlign:{vertical:"top",horizontal:"right"},collision:L,animationDirection:"down"},leftward:{anchorAlign:{vertical:"top",horizontal:"left"},popupAlign:{vertical:"top",horizontal:"right"},collision:F,animationDirection:"left"}},B={downward:{anchorAlign:{vertical:"bottom",horizontal:"left"},popupAlign:{vertical:"top",horizontal:"left"},collision:L,animationDirection:"down"},rightward:{anchorAlign:{vertical:"top",horizontal:"right"},popupAlign:{vertical:"top",horizontal:"left"},collision:F,animationDirection:"right"}};function H(e,t,s){return I(e)?t?s?"leftward":"rightward":"downward":s?"leftward":"rightward"}function $(e){return e?"rtl":"ltr"}function W(e,t){return`${e}_${t}`}const j=class extends p.Component{render(){return this.props.url?p.createElement("a",{className:this.getMenuItemClassName(),role:"presentation",href:this.props.url,tabIndex:-1},this.props.children):p.createElement("span",{id:this.props.id,className:n.classNames(this.getMenuItemClassName(),this.props.className),style:this.props.style,role:"presentation"},this.props.children)}getMenuItemClassName(){return n.classNames("k-link","k-menu-link",{"k-active":this.props.opened})}};j.propTypes={opened:s.bool,url:s.string};let q=j;const U="caret-alt-down",V="caret-alt-right",G="caret-alt-left",X=class extends p.Component{render(){return p.createElement(n.IconWrap,{"aria-hidden":!0,...this.getIcon()})}getIcon(){switch(H(this.props.itemId,!0===this.props.verticalMenu,"rtl"===this.props.dir)){case"downward":return{name:U,icon:r.caretAltDownIcon};case"rightward":return{name:V,icon:r.caretAltRightIcon};case"leftward":return{name:G,icon:r.caretAltLeftIcon};default:return{}}}};X.propTypes={itemId:s.string,dir:s.string,verticalMenu:s.bool};let _=X,Y=class extends p.Component{constructor(){super(...arguments),this.onMouseOver=e=>{this.props.onMouseOver(this.props.parentItemId),e.stopPropagation()},this.onMouseLeave=e=>{this.props.onMouseLeave(this.props.parentItemId),e.stopPropagation()}}render(){const e=this.props.parentItemId;return p.createElement("ul",{className:this.props.className,role:this.props.role?this.props.role:void 0!==e?"menu":"menubar",id:void 0!==e?W(this.props.menuGuid,e):void 0,onMouseOver:void 0!==e?this.onMouseOver:void 0,onMouseLeave:void 0!==e?this.onMouseLeave:void 0,"aria-orientation":this.props["aria-orientation"]},this.renderChildItems())}renderChildItems(){return this.props.items.length>0?this.props.items.map(((e,t)=>p.createElement(Z,{item:e,animate:this.props.animate,isMenuVertical:this.props.isMenuVertical,isDirectionRightToLeft:this.props.isDirectionRightToLeft,focusedItemId:this.props.focusedItemId,lastItemIdToBeOpened:this.props.lastItemIdToBeOpened,tabbableItemId:this.props.tabbableItemId,itemRender:this.props.itemRender,linkRender:this.props.linkRender,menuGuid:this.props.menuGuid,onMouseOver:this.props.onMouseOver,onMouseLeave:this.props.onMouseLeave,onMouseDown:this.props.onMouseDown,onBlur:this.props.onBlur,onFocus:this.props.onFocus,onClick:this.props.onClick,onOriginalItemNeeded:this.props.onOriginalItemNeeded,key:t}))):null}};class Z extends p.Component{constructor(e){super(e),this.isFirstRender=!0,this.onMouseOver=e=>{this.props.onMouseOver(this.props.item.id),e.stopPropagation()},this.onMouseLeave=e=>{this.props.onMouseLeave(this.props.item.id),e.stopPropagation()},this.state={opened:!1}}componentDidMount(){const e=this.props.focusedItemId,t=this.props.item.id;e&&e===t&&this.itemElement.focus({preventScroll:!0}),this.isFirstRender=!1}componentDidUpdate(e){const t=this.props.focusedItemId,s=this.props.item.id;if(t){const i=n.getActiveElement(document);e.focusedItemId!==t&&t===s&&!this.itemElement.contains(i)&&this.itemElement.focus({preventScroll:!0})}}render(){const e=this.props.item,t=e.id,s=W(this.props.menuGuid,t),n=e.separator;return p.createElement(p.Fragment,null,n?p.createElement("li",{className:"k-separator k-item","aria-hidden":!0,key:s,id:s,ref:e=>this.itemElement=e}):p.createElement("li",{id:s,className:this.getMenuItemClassName(e),style:e.cssStyle,tabIndex:t===this.props.tabbableItemId?0:-1,onMouseOver:this.onMouseOver,onMouseLeave:this.onMouseLeave,onMouseDown:e=>this.props.onMouseDown(e),onBlur:e=>this.props.onBlur(t,e),onFocus:()=>this.props.onFocus(t),onClick:e=>this.props.onClick(e,t),role:"menuitem","aria-disabled":!!e.disabled||void 0,"aria-haspopup":e.items.length>0||void 0,"aria-expanded":e.items.length>0?this.Opened:void 0,"aria-label":e.text,"aria-owns":this.Opened?s:void 0,ref:e=>this.itemElement=e,key:s},this.contentRender?this.renderContent():this.renderMenuItemLink()),this.renderPopupIfOpened())}renderContent(){const e=this.props.item.contentParentItemId;return p.createElement("div",{className:"k-content",role:"presentation"},p.createElement(this.contentRender,{item:this.props.onOriginalItemNeeded(e),itemId:e}))}renderMenuItemLink(){const e=this.props.item;if(this.linkRender)return p.createElement(this.linkRender,{item:this.props.onOriginalItemNeeded(e.id),itemId:e.id,opened:this.Opened,dir:$(this.props.isDirectionRightToLeft)});const t=this.itemRender?p.createElement(this.itemRender,{item:this.props.onOriginalItemNeeded(e.id),itemId:e.id,key:"1"}):p.createElement("span",{className:"k-menu-link-text"},e.text);return p.createElement(q,{url:e.url,opened:this.Opened},this.renderMenuIconIfApplicable(),t,this.renderArrowIfApplicable())}renderPopupIfOpened(){const e=this.props.item.id,t=this.props.animate,{anchorAlign:s,popupAlign:n,collision:r,animationDirection:a}=function(e,t,s){const n=H(e,t,s);return s?"downward"===n?K.downward:K.leftward:"downward"===n?B.downward:B.rightward}(e,this.props.isMenuVertical,this.props.isDirectionRightToLeft),o=!0===t?{openDuration:300,closeDuration:300,direction:a}:!1!==t&&{openDuration:(null==t?void 0:t.openDuration)||300,closeDuration:(null==t?void 0:t.closeDuration)||300,direction:(null==t?void 0:t.direction)||a};return p.createElement(i.Popup,{anchor:this.itemElement,show:this.Opened,popupClass:this.getPopupClassName(),anchorAlign:s,popupAlign:n,collision:r,animate:o,key:"1"},p.createElement(Y,{parentItemId:e,animate:this.props.animate,items:this.props.item.items,menuGuid:this.props.menuGuid,focusedItemId:this.props.focusedItemId,lastItemIdToBeOpened:this.props.lastItemIdToBeOpened,tabbableItemId:this.props.tabbableItemId,itemRender:this.props.itemRender,linkRender:this.props.linkRender,isMenuVertical:this.props.isMenuVertical,isDirectionRightToLeft:this.props.isDirectionRightToLeft,className:"k-group k-menu-group k-reset k-menu-group-md",onMouseOver:this.props.onMouseOver,onMouseLeave:this.props.onMouseLeave,onMouseDown:this.props.onMouseDown,onBlur:this.props.onBlur,onFocus:this.props.onFocus,onClick:this.props.onClick,onOriginalItemNeeded:this.props.onOriginalItemNeeded}))}renderMenuIconIfApplicable(){const{icon:e,svgIcon:t}=this.props.item;return e||t?p.createElement(n.IconWrap,{name:e,icon:t,key:"0"}):null}renderArrowIfApplicable(){return this.props.item.items.length>0?p.createElement("span",{className:"k-menu-expand-arrow","aria-hidden":!0},p.createElement(_,{itemId:this.props.item.id,verticalMenu:this.props.isMenuVertical,dir:$(this.props.isDirectionRightToLeft),key:"2"})):null}get itemRender(){return this.props.item.render||this.props.itemRender}get linkRender(){return this.props.item.linkRender||this.props.linkRender}get contentRender(){return this.props.item.contentParentItemId?this.props.item.contentRender:null}get Opened(){const e=this.props;return e.item.items.length>0&&function(e,t){return 0===t.indexOf(e)&&(t.length===e.length||t.charAt(e.length)===h)}(e.item.id,e.lastItemIdToBeOpened)&&!this.isFirstRender}getPopupClassName(){return n.classNames("k-menu-popup",{"k-rtl":this.props.isDirectionRightToLeft})}getMenuItemClassName(e){return n.classNames("k-item","k-menu-item",{"k-first":E(e.id),"k-last":e.isLastFromSiblings,"k-disabled":e.disabled},e.cssClass)}}let J=class{constructor(){this.phase="Initialized"}getIsDirectionRightToLeft(){return this.isDirectionRightToLeft}setIsDirectionRightToLeft(e){this.phase="NotInitialized"===this.phase?"Initialized":"NewValueReceived",this.previousIsDirectionRightToLeft=this.isDirectionRightToLeft,this.isDirectionRightToLeft=e}hasDirectionChanged(){return"NewValueReceived"===this.phase&&this.previousIsDirectionRightToLeft!==this.isDirectionRightToLeft}},Q=class{constructor(e,t,s){this.openOnClick=e,this.resetMenu=t,this.openItem=s,this.mouseDown=!1,this.openOnClick=e,this.isMouseOverEnabled=!e}set OpenOnClick(e){!!e!=!!this.openOnClick&&(this.mouseDown=!1,this.isMouseOverEnabled=!e),this.openOnClick=e}handleItemSelectedViaKeyboard(){this.openOnClick&&(this.isMouseOverEnabled=!1,this.resetMenu())}get IsMouseOverEnabled(){return this.isMouseOverEnabled}handleItemMouseDown(){this.mouseDown=!0}handleItemFocus(){this.openOnClick&&!this.mouseDown&&(this.isMouseOverEnabled=!0),this.mouseDown=!1}handleItemClick(e,t){this.openOnClick&&(this.isMouseOverEnabled?t&&(this.isMouseOverEnabled=!1,this.resetMenu()):(this.isMouseOverEnabled=!0,this.openItem(e)))}};const ee={focusedItemId:m,hoveredItemId:m,tabbableItemId:u},te=class e extends p.Component{constructor(e){super(e),this.menuWrapperEl=null,this.directionHolder=new J,this.inputItems=[],this.items=[],this.reset=()=>{this.clearItemHoverAndLeaveRequestsIfApplicable(),this.setState(ee)},this.onKeyDown=e=>{if(this.state.focusedItemId!==m){const t=g(this.state.focusedItemId,this.items);let s=z(this.items,t.id,e.keyCode,e.key,this.props.vertical,this.directionHolder.getIsDirectionRightToLeft());const i=g(s,this.items);i&&i.separator&&(s=z(this.items,s,e.keyCode,e.key,this.props.vertical,this.directionHolder.getIsDirectionRightToLeft())),t.id!==s&&(e.preventDefault(),this.setFocusedItemId(s)),(e.keyCode===n.Keys.enter||e.keyCode===n.Keys.space)&&!t.disabled&&(this.mouseOverHandler.handleItemSelectedViaKeyboard(),this.dispatchSelectEventIfWired(e,t.id),!e.isDefaultPrevented()&&0===t.items.length&&t.url&&window.location.assign(t.url))}e.keyCode===n.Keys.esc&&this.props.onClose&&this.props.onClose.call(void 0,e)},this.onItemMouseOver=e=>{this.mouseOverHandler.IsMouseOverEnabled&&(this.clearItemHoverAndLeaveRequestsIfApplicable(),this.itemHoverRequest=window.setTimeout((()=>{this.setHoveredItemId(e),this.itemHoverRequest=null}),function(e){return void 0!==e.hoverOpenDelay?e.hoverOpenDelay:e.openOnClick?0:100}(this.props)))},this.onItemMouseLeave=e=>{this.mouseOverHandler.IsMouseOverEnabled&&this.isItemWithDefaultClose(e)&&(this.clearItemHoverAndLeaveRequestsIfApplicable(),this.itemLeaveRequest=window.setTimeout((()=>{this.setHoveredItemId(m),this.itemLeaveRequest=null}),function(e){return void 0!==e.hoverCloseDelay?e.hoverCloseDelay:100}(this.props)))},this.onItemMouseDown=()=>{this.mouseOverHandler.handleItemMouseDown()},this.onItemFocus=e=>{this.setFocusedItemId(e),this.mouseOverHandler.handleItemFocus()},this.onItemClick=(e,t)=>{const s=g(t,this.items);s.disabled||(this.setFocusedItemId(t),this.mouseOverHandler.handleItemClick(t,this.isItemWithDefaultClose(t)),this.dispatchSelectEventIfWired(e,t),!e.isDefaultPrevented()&&s.url&&window.location.assign(s.url))},this.onItemBlur=(e,t)=>{if(this.isItemWithDefaultClose(e)&&this.setFocusedItemId(m),t.relatedTarget&&"LI"===t.relatedTarget.nodeName){const e=t.relatedTarget.getAttribute("id");if(e&&e.includes(this.menuItemId))return}this.props.onClose&&this.props.onClose.call(void 0,t)},this.getInputItem=e=>g(e,this.inputItems),this.mouseOverHandler=new Q(this.props.openOnClick,this.reset,this.onItemMouseOver),this.state=Object.assign({},ee,{isFirstRender:!0})}get menuItemId(){return this.props.id}get element(){return this.menuWrapperEl}get animate(){return void 0!==this.props.animate?this.props.animate:e.defaultProps.animate}render(){this.prepareItems(),this.state.isFirstRender||this.directionHolder.setIsDirectionRightToLeft(this.checkIsDirectionRightToLeft());const e=this.state.hoveredItemId?this.state.hoveredItemId:this.state.focusedItemId?y(this.state.focusedItemId):m;return p.createElement("div",{id:this.props.id,onKeyDown:this.onKeyDown,style:this.props.style,className:this.directionHolder.getIsDirectionRightToLeft()?"k-rtl":void 0,ref:e=>this.menuWrapperEl=e},p.createElement(Y,{className:this.getMenuClassName(),"aria-orientation":this.props.vertical?"vertical":void 0,items:this.items,animate:this.animate,isMenuVertical:this.props.vertical,isDirectionRightToLeft:this.directionHolder.getIsDirectionRightToLeft(),focusedItemId:this.state.focusedItemId,lastItemIdToBeOpened:e,tabbableItemId:this.state.tabbableItemId,itemRender:this.props.itemRender,linkRender:this.props.linkRender,menuGuid:this.menuItemId,onMouseLeave:this.onItemMouseLeave,onMouseOver:this.onItemMouseOver,onMouseDown:this.onItemMouseDown,onFocus:this.onItemFocus,onClick:this.onItemClick,onBlur:this.onItemBlur,onOriginalItemNeeded:this.getInputItem,role:this.props.role}))}componentDidMount(){this.setState({isFirstRender:!1})}componentDidUpdate(e){(!!e.vertical!=!!this.props.vertical||this.directionHolder.hasDirectionChanged())&&this.reset(),this.mouseOverHandler.OpenOnClick=this.props.openOnClick}componentWillUnmount(){this.clearItemHoverAndLeaveRequestsIfApplicable()}setFocusedItemId(e){this.setState((t=>{const s=e===m?t.tabbableItemId:f(e);return{hoveredItemId:e===m||k(t.hoveredItemId)&&k(e)?t.hoveredItemId:m,focusedItemId:e,tabbableItemId:s}}))}setHoveredItemId(e){this.setState((t=>k(e)&&k(t.focusedItemId)?{hoveredItemId:e,focusedItemId:t.focusedItemId,tabbableItemId:t.tabbableItemId}:{hoveredItemId:e,focusedItemId:m,tabbableItemId:u}))}getMenuClassName(){return n.classNames("k-reset","k-header","k-menu",{"k-menu-horizontal":!this.props.vertical},{"k-menu-vertical":this.props.vertical},this.props.className)}clearItemHoverAndLeaveRequestsIfApplicable(){this.itemHoverRequest&&(clearTimeout(this.itemHoverRequest),this.itemHoverRequest=null),this.itemLeaveRequest&&(clearTimeout(this.itemLeaveRequest),this.itemLeaveRequest=null)}isItemWithDefaultClose(e){return!this.props.customCloseItemIds||-1===this.props.customCloseItemIds.indexOf(e)}checkIsDirectionRightToLeft(){return!!(void 0!==this.props.dir?"rtl"===this.props.dir:this.menuWrapperEl&&"rtl"===getComputedStyle(this.menuWrapperEl).direction)}prepareItems(){const{items:e,inputItems:t}=R(this.props.items,this.props.children);this.items=e,this.inputItems=t}dispatchSelectEventIfWired(e,t){n.dispatchEvent(this.props.onSelect,e,this,{item:this.getInputItem(t),itemId:t})}};te.propTypes={vertical:s.bool,items:s.arrayOf(s.object),style:s.object,animate:s.oneOfType([s.bool,s.shape({openDuration:s.number,closeDuration:s.number})]),dir:s.string,hoverOpenDelay:s.number,hoverCloseDelay:s.number,openOnClick:s.bool,itemRender:s.any,linkRender:s.any,customCloseItemIds:s.arrayOf(s.string),onSelect:s.func,role:s.string},te.defaultProps={vertical:!1,animate:!0};let se=te;const ne=class extends p.Component{constructor(){super(...arguments),this.itemRef=null,this.focus=()=>{this.itemRef&&this.itemRef.focus()},this.blur=()=>{this.itemRef&&this.itemRef.blur()},this.onClick=()=>{this.props.onSelect&&this.props.onSelect(this.props.index),this.itemRef&&(this.itemRef.tabIndex=0,this.itemRef.focus())}}render(){const{id:e,active:t,disabled:s,title:i="Untitled",index:r,renderAllContent:a,first:o,last:l}=this.props,c=a?`${this.props.contentPanelId}-${r.toString()}`:this.props.contentPanelId,d={id:`${e}-${r.toString()}`,"aria-selected":t,"aria-controls":t?c:void 0,"aria-disabled":s,role:"tab",onClick:s?void 0:this.onClick},m=n.classNames("k-item","k-tabstrip-item",{"k-disabled":s,"k-active":t,"k-first":o,"k-last":l});return p.createElement("li",{...d,className:m,ref:e=>this.itemRef=e,onBlur:this.blur,"aria-controls":c},p.createElement("span",{className:"k-link"},i))}};ne.propTypes={active:s.bool,disabled:s.bool,index:s.number,onSelect:s.func,title:s.oneOfType([s.string,s.element]),first:s.bool,last:s.bool};let ie=ne;const re="prevArrow.title",ae="nextArrow.title",oe={[re]:"Previous tab arrow",[ae]:"Next tab arrow"},le="smooth",ce="prev",de="next",pe=class extends p.Component{constructor(){super(...arguments),this.itemsNavRef=this.props.itemsNavRef||p.createRef(),this.onScroll=()=>{var e,t;null==(t=(e=this.props).onScroll)||t.call(e)},this.isRtl=()=>"rtl"===this.props.dir,this.arrowClickPrev=e=>{this.handleArrowClick(ce,e)},this.arrowClickNext=e=>{this.handleArrowClick(de,e)},this.handleArrowClick=(e,t)=>{this.setNewScrollPosition(e,t)},this.setNewScrollPosition=(e,t)=>{const s=this.itemsNavRef.current;if(!s)return;const n=this.horizontalScroll(),i=n?s.scrollWidth-s.offsetWidth:s.scrollHeight-s.offsetHeight,r=("click"===t.type?this.props.buttonScrollSpeed:this.props.mouseScrollSpeed)||0;let a=n?s.scrollLeft:s.scrollTop;this.isRtl()&&this.horizontalScroll()?(e===ce&&a<0&&(a+=r),e===de&&a<i&&(a-=r),a=Math.min(0,Math.min(i,a))):(e===ce&&a>0&&(a-=r),e===de&&a<i&&(a+=r),a=Math.max(0,Math.min(i,a)));const o="click"===t.type?le:void 0;n?s.scrollTo({left:a,behavior:o}):s.scrollTo({top:a,behavior:o})},this.renderArrow=e=>{const t=this.horizontalScroll(),s=o.provideLocalizationService(this),i={prev:{arrowTab:"k-tabstrip-prev",fontIcon:t?this.isRtl()?"caret-alt-right":"caret-alt-left":"caret-alt-up",svgIcon:t?this.isRtl()?r.caretAltRightIcon:r.caretAltLeftIcon:r.caretAltUpIcon,title:s.toLanguageString(re,oe[re])},next:{arrowTab:"k-tabstrip-next",fontIcon:t?this.isRtl()?"caret-alt-left":"caret-alt-right":"caret-alt-down",svgIcon:t?this.isRtl()?r.caretAltLeftIcon:r.caretAltRightIcon:r.caretAltDownIcon,title:s.toLanguageString(ae,oe[ae])}},l=(e===ce?this.props.prevButton:this.props.nextButton)||a.Button,c=e===ce?this.arrowClickPrev:this.arrowClickNext,d=null===this.props.containerScrollPosition||e===ce&&("start"===this.props.containerScrollPosition||"top"===this.props.containerScrollPosition)||e===de&&("end"===this.props.containerScrollPosition||"bottom"===this.props.containerScrollPosition);return p.createElement(l,{disabled:d,className:n.classNames(`${i[e].arrowTab}`),onClick:c,icon:i[e].fontIcon,svgIcon:i[e].svgIcon,size:this.props.size,tabIndex:-1,fillMode:"flat",title:i[e].title})}}componentDidMount(){this.props.scrollable&&this.scrollToSelected()}componentDidUpdate(e){const{scrollable:t,selected:s}=this.props;t&&e.selected!==s&&this.scrollToSelected()}render(){const{selected:e,tabPosition:t,tabAlignment:s,children:i,onSelect:r,onKeyDown:a,navItemId:o,contentPanelId:l,renderAllContent:c,scrollable:d,scrollButtons:m,scrollButtonsPosition:u}=this.props,h=p.Children.count(i),g=p.Children.toArray(i);let f;var b;i&&(f=(b=h,Array.apply(null,Array(b))).map(((t,s,n)=>{const i={active:e===s,disabled:g[s].props.disabled,index:s,title:g[s].props.title,first:0===s,last:s===n.length-1,contentPanelId:l,renderAllContent:c,id:o,onSelect:r,onScroll:this.onScroll};return p.createElement(ie,{key:s,...i})})));const v=n.classNames("k-tabstrip-items-wrapper k-tabstrip-items-wrapper-scroll",{"k-hstack":"top"===t||"bottom"===t,"k-vstack":"left"===t||"right"===t}),y=n.classNames("k-tabstrip-items k-tabstrip-items-scroll k-reset",`k-tabstrip-items-${s}`);return p.createElement("div",{className:v},d?p.createElement(p.Fragment,null,"hidden"!==m&&u&&["split","start","around","before"].includes(u)&&this.renderArrow(ce),"hidden"!==m&&("start"===u||"before"===u)&&this.renderArrow(de),p.createElement("ul",{ref:this.itemsNavRef,className:y,role:"tablist",tabIndex:this.props.tabIndex,onKeyDown:a,onScroll:this.onScroll,"aria-orientation":"left"===t||"right"===t?"vertical":void 0},f),"hidden"!==m&&("end"===u||"after"===u)&&this.renderArrow(ce),"hidden"!==m&&u&&["split","end","around","after"].includes(u)&&this.renderArrow(de)):p.createElement("ul",{className:y,role:"tablist",tabIndex:this.props.tabIndex,onKeyDown:a},f))}scrollToSelected(){const e=this.itemsNavRef.current,t=e&&e.children[this.props.selected||0];if(t instanceof HTMLElement&&e instanceof HTMLElement){const s=this.horizontalScroll(),n=s?e.offsetWidth:e.offsetHeight,i=s?t.offsetWidth:t.offsetHeight,r=s?"left":"top";let a=s?e.scrollLeft:e.scrollTop,o=0;if(this.isRtl()){const s=t.offsetLeft;a*=-1,s<0?(o=s-i+e.offsetLeft,e.scrollTo({[r]:o,behavior:le})):s+i>n-a&&(o=a+s-i,e.scrollTo({[r]:o,behavior:le}))}else{const l=s?t.offsetLeft-e.offsetLeft:t.offsetTop-e.offsetTop;a+n<l+i?(o=l+i-n,e.scrollTo({[r]:o,behavior:le})):a>l&&(o=l,e.scrollTo({[r]:o,behavior:le}))}}}horizontalScroll(){return/top|bottom/.test(this.props.tabPosition||"top")}};pe.propTypes={children:s.oneOfType([s.element,s.arrayOf(s.element)]),onSelect:s.func,onKeyDown:s.func,onScroll:s.func,selected:s.number,tabIndex:s.number,scrollable:s.bool,size:s.oneOf(["small","medium","large"]),scrollButtons:s.oneOf(["auto","visible","hidden"]),scrollButtonsPosition:s.oneOf(["split","start","end","around","before","after"]),containerScrollPosition:s.oneOf(["start","end","top","bottom","middle",null])};let me=pe;const ue=class extends p.Component{constructor(){super(...arguments),this.contentId=this.props.contentPanelId,this.childFactory=e=>p.cloneElement(e,{...e.props,in:e.props.children.props.id===String(this.contentId+this.props.selected)})}render(){const{children:e,selected:t,contentPanelId:s,keepTabsMounted:i,navItemId:r,renderAllContent:a}=this.props,o=e&&"number"==typeof t&&p.Children.toArray(e)[t],l=n.classNames("k-tabstrip-content","k-active",o&&o.props.contentClassName);return a?this.renderAllContent(e):p.createElement("div",{className:l,style:this.props.style,id:s,role:"tabpanel","aria-hidden":i,"aria-labelledby":`${r}-${(null==t?void 0:t.toString())||""}`,tabIndex:0},this.renderContent(e))}renderContent(e){return this.props.keepTabsMounted?p.Children.map(this.props.children,((e,t)=>this.renderChild(e,t))):this.renderChild(p.Children.toArray(e)[this.props.selected],this.props.selected)}renderAllContent(e){return p.Children.map(e,((e,t)=>{const s=e,i=t===this.props.selected,r=n.classNames("k-tabstrip-content",{"k-active":i},s.props.contentClassName);return p.createElement("div",{className:r,style:this.props.style,id:`${this.props.contentPanelId}-${t}`,role:"tabpanel","aria-hidden":!i,hidden:!i,"aria-labelledby":`${this.props.navItemId}-${t}`},this.props.animation?p.createElement(l.Fade,{key:`${t}-${i}`,appear:!0,enter:!0,exit:!1},s.props.children):s.props.children)}))}renderChild(e,t){const s=t===this.props.selected,n={style:{display:s?void 0:"none"}},i={position:"initial",display:s?void 0:"none"};return e.props.disabled?null:this.props.animation?p.createElement(l.Fade,{appear:!0,exit:this.props.keepTabsMounted,style:i,childFactory:this.props.keepTabsMounted?this.childFactory:void 0},p.createElement("div",{...n,id:String(this.contentId+t),key:t},e.props.children)):p.createElement("div",{...n,key:t},e.props.children)}};ue.propTypes={animation:s.bool,children:s.oneOfType([s.element,s.arrayOf(s.element)]),selected:s.number,style:s.object};let he=ue;const ge=class extends p.Component{constructor(e){super(e),this.tabStripRef=p.createRef(),this.itemsNavRef=p.createRef(),this.onScroll=()=>{const e=this.horizontalScroll(),t=this.itemsNavRef.current;if(!t)return;const s=t.scrollLeft,n=t.clientWidth,i=t.scrollWidth,r=t.scrollTop,a=t.scrollHeight,o=t.clientHeight;let l=null;const c=e?i>n:a>o,d="rtl"===this.props.dir;l=c?e?s+n===i||(d&&n-s)===i?"end":0===s||d&&0==-s?"start":s>0&&s+n<i||-s>0&&n-s<i?"middle":null:a-(r+o)==0?"bottom":0===r?"top":r>0&&a-(r+o)>0?"middle":null:null,this.setState({containerScrollPosition:l})},this.onSelect=e=>{this.props.selected!==e&&this.props.onSelect&&this.props.onSelect({selected:e})},this.onKeyDown=e=>{this.navigation&&this.navigation.triggerKeyboardEvent(e)},this.onKeyboardSelect=e=>{const t=this.children();t&&t[e].props.disabled||this.onSelect(e)},this.renderContent=e=>{const{selected:t,children:s,tabContentStyle:n}=e;return t<p.Children.count(s)&&t>-1?p.createElement(he,{index:t,...e,style:n}):null},this.state={containerScrollPosition:null},this.itemsNavRef=p.createRef()}get contentPanelId(){return this.props.id+"-content-panel-id"}get navItemId(){return this.props.id+"-nav-item-id"}componentDidMount(){var e;const t=this.tabStripRef.current,s=t&&"rtl"===getComputedStyle(t).direction||!1;t&&(this.navigation=new n.Navigation({tabIndex:0,root:this.tabStripRef,rovingTabIndex:!0,focusClass:"k-focus",selectors:[".k-tabstrip .k-tabstrip-item"],keyboardEvents:{keydown:{ArrowLeft:(e,t,n)=>{n.preventDefault();const i=t.elements.indexOf(e),r=0!==i?i-1:t.elements.length-1,a=i!==t.elements.length-1?i+1:0;s?(t.focusNext(e),this.onKeyboardSelect(a)):(t.focusPrevious(e),this.onKeyboardSelect(r))},ArrowRight:(e,t,n)=>{n.preventDefault();const i=t.elements.indexOf(e),r=0!==i?i-1:t.elements.length-1,a=i!==t.elements.length-1?i+1:0;s?(t.focusPrevious(e),this.onKeyboardSelect(r)):(t.focusNext(e),this.onKeyboardSelect(a))},ArrowDown:(e,t,s)=>{s.preventDefault();const n=t.elements.indexOf(e),i=n!==t.elements.length-1?n+1:0;t.focusNext(e),this.onKeyboardSelect(i)},ArrowUp:(e,t,s)=>{s.preventDefault();const n=t.elements.indexOf(e),i=0!==n?n-1:t.elements.length-1;t.focusPrevious(e),this.onKeyboardSelect(i)},Home:(e,t,s)=>{s.preventDefault(),t.focusElement(t.first,e),this.onKeyboardSelect(0)},End:(e,t,s)=>{s.preventDefault(),t.focusElement(t.last,e),this.onKeyboardSelect(t.elements.length-1)}}}}),null==(e=this.navigation)||e.initializeRovingTab(this.props.selected),this.onScroll(),this.resizeObserver=window.ResizeObserver&&new ResizeObserver((()=>this.onScroll())),this.tabStripRef.current&&this.resizeObserver&&this.resizeObserver.observe(this.tabStripRef.current))}componentWillUnmount(){var e;null==(e=this.navigation)||e.removeFocusListener(),this.resizeObserver&&this.resizeObserver.disconnect()}horizontalScroll(){return/top|bottom/.test(this.props.tabPosition||"top")}render(){const e={itemsNavRef:this.itemsNavRef,...this.props,children:this.children(),contentPanelId:this.contentPanelId,renderAllContent:this.props.renderAllContent,navItemId:this.navItemId,onKeyDown:this.onKeyDown,onSelect:this.onSelect,onScroll:this.onScroll,containerScrollPosition:this.state.containerScrollPosition,scrollButtons:"hidden"===this.props.scrollButtons||null===this.state.containerScrollPosition&&"auto"===this.props.scrollButtons?"hidden":"visible"},{scrollable:t,scrollButtons:s,size:i,tabPosition:r,tabIndex:a}=e,o="bottom"===r,l=n.classNames("k-tabstrip k-pos-relative",{[`k-tabstrip-${n.kendoThemeMaps.sizeMap[i]||i}`]:i,"k-tabstrip-left":"left"===r,"k-tabstrip-right":"right"===r,"k-tabstrip-bottom":"bottom"===r,"k-tabstrip-top":"top"===r,"k-tabstrip-scrollable":t,"k-tabstrip-scrollable-start k-tabstrip-scrollable-end":t&&"visible"===s,"k-tabstrip-scrollable-start":t&&("auto"===s||!s)&&("end"===this.state.containerScrollPosition||"middle"===this.state.containerScrollPosition),"k-tabstrip-scrollable-end":t&&"auto"===s&&("start"===this.state.containerScrollPosition||"middle"===this.state.containerScrollPosition)},this.props.className);return p.createElement("div",{id:this.props.id,ref:this.tabStripRef,dir:this.props.dir,className:l,style:this.props.style,onScroll:this.onScroll},!o&&p.createElement(me,{...e,tabIndex:a}),this.renderContent(e),o&&p.createElement(me,{...e,tabIndex:a}))}children(){return p.Children.toArray(this.props.children).filter((e=>e))}};ge.propTypes={id:s.string,animation:s.bool,children:s.node,onSelect:s.func,selected:s.number,style:s.object,tabContentStyle:s.object,tabPosition:s.string,tabAlignment:s.string,tabIndex:s.number,className:s.string,dir:s.string,renderAllContent:s.bool,size:s.oneOf(["small","medium","large",null]),scrollButtons:s.oneOf(["auto","visible","hidden"]),scrollButtonsPosition:s.oneOf(["split","start","end","around","before","after"])},ge.defaultProps={animation:!0,tabPosition:"top",tabAlignment:"start",keepTabsMounted:!1,buttonScrollSpeed:100,mouseScrollSpeed:10,scrollButtons:"auto",scrollButtonsPosition:"split",size:"medium",renderAllContent:!1};let fe=ge,be=class extends p.Component{constructor(e){super(e),this.draggable=null,this.spliterBarRef=p.createRef(),this.onDrag=(e,t,s)=>{const{event:n}=e,{onDrag:i,index:r}=this.props,a=this.draggable&&this.draggable.element;a&&!this.isStatic&&this.isDraggable&&i(n,a,r,t,s)},this.onFocus=()=>{this.setState({focused:!0})},this.onBlur=()=>{this.setState({focused:!1})},this.onToggle=e=>{const{onToggle:t,index:s,prev:n,next:i}=this.props;(n.collapsible||i.collapsible)&&t(n.collapsible?s:s+1,e)},this.onPrevToggle=e=>{const{onToggle:t,index:s,prev:n}=this.props;n.collapsible&&t(s,e)},this.onNextToggle=e=>{const{onToggle:t,index:s,next:n}=this.props;n.collapsible&&t(s+1,e)},this.onKeyDown=e=>{this.navigation.triggerKeyboardEvent(e)},this.state={focused:!1}}get isStatic(){const{prev:e,next:t}=this.props,s=e.resizable&&t.resizable,n=e.collapsible||t.collapsible;return!s&&!n}get isDraggable(){const{prev:e,next:t}=this.props,s=e.resizable&&t.resizable,n=e.collapsed||t.collapsed;return!!s&&!n}get isHorizontal(){return"horizontal"===this.props.orientation}componentDidMount(){const e=this.draggable&&this.draggable.element,{index:t,onKeyboardResize:s}=this.props,i=this.isHorizontal;e&&(this.navigation=new n.Navigation({tabIndex:0,root:this.spliterBarRef,selectors:[".k-splitter .k-splitbar"],keyboardEvents:{keydown:{ArrowLeft:(n,r,a)=>{i&&(a.preventDefault(),this.isDraggable&&s(e,t,-10,a),(a.metaKey||a.ctrlKey)&&(s(e,t,0,a),this.isDraggable?this.onPrevToggle(a):this.onNextToggle(a)))},ArrowRight:(n,r,a)=>{i&&(a.preventDefault(),this.isDraggable&&s(e,t,10,a),(a.metaKey||a.ctrlKey)&&(s(e,t,0,a),this.isDraggable?this.onNextToggle(a):this.onPrevToggle(a)))},ArrowDown:(n,r,a)=>{i||(a.preventDefault(),this.isDraggable&&s(e,t,10,a),(a.metaKey||a.ctrlKey)&&(s(e,t,0,a),this.isDraggable?this.onNextToggle(a):this.onPrevToggle(a)))},ArrowUp:(n,r,a)=>{i||(a.preventDefault(),this.isDraggable&&s(e,t,-10,a),(a.metaKey||a.ctrlKey)&&(s(e,t,0,a),this.isDraggable?this.onPrevToggle(a):this.onNextToggle(a)))},Enter:(e,t,s)=>{s.preventDefault(),this.onToggle(s)}}}}))}render(){const e=this.isDraggable,t=this.isStatic,s=this.isHorizontal,i=n.classNames("k-splitbar",{"k-focus":this.state.focused,"k-splitbar-horizontal":s,"k-splitbar-vertical":!s,"k-splitbar-draggable-horizontal":s&&e,"k-splitbar-draggable-vertical":!s&&e,"k-splitbar-static-horizontal":s&&t,"k-splitbar-static-vertical":!s&&t});return p.createElement(n.Draggable,{onPress:e=>this.onDrag(e,!0,!1),onDrag:e=>this.onDrag(e,!1,!1),onRelease:e=>this.onDrag(e,!1,!0),ref:e=>{this.draggable=e}},p.createElement("div",{ref:this.spliterBarRef,tabIndex:t?-1:0,role:"separator","aria-valuenow":0,"aria-label":this.props.ariaLabel,"aria-orientation":s?"vertical":void 0,"aria-keyshortcuts":"ArrowLeft ArrowRight ArrowUp ArrowDown",className:i,style:{touchAction:"none"},onFocus:this.onFocus,onBlur:this.onBlur,onDoubleClick:this.onToggle,onKeyDown:this.onKeyDown},this.props.prev.collapsible&&p.createElement("div",{className:"k-collapse-prev",onClick:this.onPrevToggle},p.createElement(n.IconWrap,{name:this.props.prev.collapsible?s?this.props.prev.collapsed?this.props.isRtl?"caret-alt-left":"caret-alt-right":this.props.isRtl?"caret-alt-right":"caret-alt-left":this.props.prev.collapsed?"caret-alt-down":"caret-alt-up":void 0,icon:this.props.prev.collapsible?s?this.props.prev.collapsed?this.props.isRtl?r.caretAltLeftIcon:r.caretAltRightIcon:this.props.isRtl?r.caretAltRightIcon:r.caretAltLeftIcon:this.props.prev.collapsed?r.caretAltDownIcon:r.caretAltUpIcon:void 0,size:"xsmall"})),p.createElement("div",{className:"k-resize-handle"}),this.props.next.collapsible&&p.createElement("div",{className:"k-collapse-next",onClick:this.onNextToggle},p.createElement(n.IconWrap,{name:this.props.next.collapsible?s?this.props.next.collapsed?this.props.isRtl?"caret-alt-right":"caret-alt-left":this.props.isRtl?"caret-alt-left":"caret-alt-right":this.props.next.collapsed?"caret-alt-up":"caret-alt-down":void 0,icon:this.props.next.collapsible?s?this.props.next.collapsed?this.props.isRtl?r.caretAltRightIcon:r.caretAltLeftIcon:this.props.isRtl?r.caretAltLeftIcon:r.caretAltRightIcon:this.props.next.collapsed?r.caretAltUpIcon:r.caretAltDownIcon:void 0,size:"xsmall"}))))}};const ve=class extends p.Component{render(){return null}};ve.propTypes={disabled:s.bool,contentClassName:s.string,children:s.oneOfType([s.element,s.node]),title:s.oneOfType([s.string,s.element,s.node])};let ye=ve;const ke=class e extends p.PureComponent{constructor(e){super(e),this.handleItemClick=()=>{const{onSelect:e,disabled:t,id:s}=this.props;e&&!t&&e.call(void 0,{uniquePrivateKey:this.props.uniquePrivateKey,id:s,target:this})},this.childFactory=e=>this.props.keepItemsMounted?p.cloneElement(e,{...e.props,in:this.props.expanded}):e,this.state={show:e.expanded||!1}}render(){const{id:t,children:s,title:i,uniquePrivateKey:a,disabled:o,selected:c,focused:d,expanded:m,className:u,level:h,headerClassName:g,animation:f,keepItemsMounted:b}=this.props,v={role:"treeitem","aria-disabled":o,"aria-hidden":!o&&!m,"aria-selected":!o&&c,"aria-expanded":!o&&m&&!!s},y=n.classNames("k-panelbar-item",{"k-panelbar-header":0===h,"k-expanded":m&&!!s,"k-disabled":o},`k-level-${h}`,u),k=n.classNames("k-link",{"k-selected":!o&&c,"k-focus":d},g),I=function({imageUrl:e,icon:t,svgIcon:s,iconClass:i}){return e?p.createElement("img",{role:"presentation",className:"k-panelbar-item-icon k-image",src:e}):t||s?p.createElement(n.IconWrap,{className:"k-panelbar-item-icon",name:t,icon:s}):i?p.createElement("span",{role:"presentation",className:"k-panelbar-item-icon "+i}):null}(this.props),N=!o&&s?p.createElement(n.IconWrap,{name:m?"chevron-up":"chevron-down",icon:m?r.chevronUpIcon:r.chevronDownIcon,className:n.classNames("k-panelbar-toggle",m?"k-panelbar-collapse":"k-panelbar-expand")}):null;let E=!1;s&&s[0]&&Array.isArray(s)&&(E=s[0].type===e);const x=E?p.createElement("ul",{role:"group","aria-expanded":m,"aria-hidden":!m,className:"k-panelbar-group",style:{display:b?this.state.show?"block":"none":"block"}},s):s,w=!o&&m||b?x:null,C=void 0!==f&&!f||o||!s?w:p.createElement(l.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,key:a+"_animation",style:{display:"block"},children:w,childFactory:b&&this.childFactory,unmountOnExit:!b,onBeforeEnter:()=>b&&this.setState({show:!0}),onAfterExited:()=>b&&this.setState({show:!1})});return p.createElement("li",{id:t,className:y,...v},p.createElement("span",{className:k,onClick:this.handleItemClick},I,p.createElement("span",{className:"k-panelbar-item-text"},i),N),C)}};ke.propTypes={animation:s.bool,children:s.any,className:s.string,icon:s.string,iconClass:s.string,imageUrl:s.string,svgIcon:n.svgIconPropType,expanded:s.bool,disabled:s.bool,onSelect:s.func,selected:s.bool,level:s.number,title:s.oneOfType([s.string,s.element]),id:s.oneOfType([s.string,s.number]),focused:s.bool,keepItemsMounted:s.bool},ke.defaultProps={title:"Untitled"};let Ie=ke;var Ne=(e=>(e[e.Toggle=0]="Toggle",e[e.Next=1]="Next",e[e.Previous=2]="Previous",e[e.First=3]="First",e[e.Last=4]="Last",e[e.Left=5]="Left",e[e.Right=6]="Right",e))(Ne||{});const Ee=e=>"object"!=typeof e||!("type"in e)||e.type!==Ie,xe=({animation:e=!0,keepItemsMounted:t=!1,state:s,expanded:n,handleSelect:i,children:r,parentExpanded:a=!0,level:o=0,parentPrivateKey:l=[]})=>{const c=p.Children.toArray(r).filter(Ee),d=c.length?c:r;return p.Children.map(d,((r,c)=>{if(r&&r.type===Ie){let d;const m=Se(r,l,c);if(r.props.children){const a={animation:e,keepItemsMounted:t,state:s,expanded:n,handleSelect:i,children:r.props.children,parentExpanded:(n||[]).indexOf(m)>-1,level:o+1,parentPrivateKey:[...l,m]};d=xe(a)}return p.cloneElement(r,{...r.props,animation:void 0!==r.props.animation?r.props.animation:e,keepItemsMounted:t,id:r.props.id||`k-panelbar-item-default-${m}`,uniquePrivateKey:m,parentUniquePrivateKey:l,parentExpanded:a,level:o,expanded:(n||[]).indexOf(m)>-1,focused:s.focused===m&&s.wrapperFocused,selected:s.selected===m,children:d,onSelect:i})}return p.createElement("div",{className:"k-panelbar-content"},r)}))},we=e=>{const t=p.Children.toArray(e.children)[0];return t?Se(t,[],0):""},Ce=(e,t,s={expanded:e.expanded||[],selected:e.selected||"",focused:e.focused||"",wrapperFocused:!1},n=!0,i=[])=>(p.Children.map(e.children,((e,r)=>{if(e&&e.type===Ie){const a=Se(e,i,r);!e.props.disabled&&n&&(e.props.selected&&(s.selected=a),e.props.focused&&(s.focused=a),e.props.expanded&&("multiple"===t?s.expanded.push(a):"single"===t&&(s.expanded=[a])),e.props.children&&(s=Ce(e.props,t,s,!!e.props.expanded,[...i,a])))}})),s),Se=(e,t,s)=>e&&e.props&&e.props.id?e.props.id:t.length?t[t.length-1]+`.${s}`:`.${s}`;function Re(e,t=[]){return p.Children.forEach(e,(e=>{e&&e.props&&!e.props.disabled&&(t.push(e),e.props.children&&Re(e.props.children,t))})),t}function De(e,t=[]){return p.Children.forEach(e,(e=>{e&&e.props&&(e.props.expanded||e.props.parentExpanded)&&(t.push(e),e.props.children&&De(e.props.children,t))})),t}e.PanelBarUtils=void 0,(e=>{e.mapItemsToComponents=function e(t){return t.map(((t,s)=>{let n;return t.content&&(n=t.content),t.children&&(n=e(t.children)),p.createElement(Ie,{...t,children:n,key:t.id||s})}))}})(e.PanelBarUtils||(e.PanelBarUtils={}));const Te=(e,t)=>e.length===t.length&&e.every(((e,s)=>e===t[s])),Oe=(e,t,s,n,i)=>{let r;if(i===Ne.First||i===Ne.Last)switch(i){case Ne.First:r=e[0];break;case Ne.Last:r=e[e.length-1]}else e.forEach(((i,a)=>{if(i.props.uniquePrivateKey===(s.uniquePrivateKey||n)){const s=a+t<0?e.length-1:a+t>e.length-1?0:a+t;r=e[s]}}));return r},Me=class extends p.Component{constructor(e){super(e),this._element=null,this.handleSelect=e=>{this.onSelect(e),this.onFocus(e)},this.onSelect=e=>{let t,s;switch(Re(p.Children.toArray(this.children)).forEach((s=>{s.props.uniquePrivateKey===(e.uniquePrivateKey||this.state.focused)&&(t=s)})),this.expandMode){case"single":s=[...t.props.parentUniquePrivateKey,t.props.uniquePrivateKey],Te(this.expandedItems,s)&&(s=t.props.parentUniquePrivateKey?[...t.props.parentUniquePrivateKey]:[]);break;case"multiple":{s=this.expandedItems.slice();const e=s.indexOf(t.props.uniquePrivateKey);-1===e?s.push(t.props.uniquePrivateKey):s.splice(e,1);break}default:s=this.expandedItems.slice()}this.setState({selected:t.props.uniquePrivateKey,expanded:s}),this.props.onSelect&&this.props.onSelect.call(void 0,{target:t,expandedItems:s})},this.onFocus=(e,t=0,s)=>{const n=De(p.Children.toArray(this.children)),i=Oe(n,t,e,this.state.focused,s);if(i){const e=this.expandedItems.slice();if(s===Ne.Right&&i&&i.props&&i.props.children&&i.props.children.length>0){if(e.push(i.props.uniquePrivateKey),this.setState({expanded:[...new Set(e)]}),i.props.expanded){const e=i.props.children[0].props.uniquePrivateKey;this.setState({focused:e})}}else if(s===Ne.Left&&(i&&i.props&&i.props.parentUniquePrivateKey&&i.props.parentUniquePrivateKey.length>0||i&&i.props&&!i.props.disabled&&i.props.children&&i.props.children.length>0)){const t=i.props.parentUniquePrivateKey;if(i.props.expanded){const t=i.props.uniquePrivateKey,s=e.indexOf(t);e.splice(s,1),this.setState({expanded:e})}else if(i.props.level>0){const e=i.props.parentUniquePrivateKey[t.length-1];this.setState({focused:e})}}else this.activeDescendant=i.props.id,this.setState({focused:i.props.uniquePrivateKey})}},this.onNavigate=(e,t)=>{let s;switch(t){case Ne.First:this.onFocus(e,s,Ne.First);break;case Ne.Last:this.onFocus(e,s,Ne.Last);break;case Ne.Left:this.onFocus(e,s,Ne.Left);break;case Ne.Right:this.onFocus(e,s,Ne.Right);break;case Ne.Previous:s=-1,this.onFocus(e,s);break;case Ne.Next:s=1,this.onFocus(e,s);break;case Ne.Toggle:this.onSelect(e)}},this.handleWrapperFocus=()=>{clearTimeout(this.nextTickId),this.state.wrapperFocused||this.setState({wrapperFocused:!0})},this.handleWrapperBlur=()=>{this.nextTick((()=>{this.setState({wrapperFocused:!1})}))},this.handleKeyDown=e=>{const t=this._element&&"rtl"===getComputedStyle(this._element).direction||!1;if(e.target===e.currentTarget){let s;switch(e.keyCode){case n.Keys.left:s=t?Ne.Right:Ne.Left;break;case n.Keys.up:s=Ne.Previous;break;case n.Keys.right:s=t?Ne.Left:Ne.Right;break;case n.Keys.down:s=Ne.Next;break;case n.Keys.home:s=Ne.First;break;case n.Keys.end:s=Ne.Last;break;case n.Keys.space:case n.Keys.enter:s=Ne.Toggle;break;default:s=null}null!==s&&(e.preventDefault(),this.onNavigate(e,s))}};const t=Ce(e,this.expandMode);t.focused||(t.focused=we(e)),this.state=t}get expandMode(){return this.props.expandMode||"multiple"}get selectedItem(){const{selected:e=this.state.selected}=this.props;return e}get expandedItems(){return this.props.isControlled?this.props.expanded||[]:this.state.expanded}get children(){const e={...this.state,selected:this.selectedItem},t={animation:this.props.animation,keepItemsMounted:this.props.keepItemsMounted,state:e,expanded:this.expandedItems,handleSelect:this.handleSelect,children:this.props.children};return xe(t)}render(){const e={"aria-activedescendant":this.activeDescendant},t=n.classNames("k-panelbar",this.props.className);return p.createElement("ul",{ref:e=>{this._element=e},dir:this.props.dir,role:"tree",tabIndex:0,onKeyDown:this.handleKeyDown,onFocus:this.handleWrapperFocus,onBlur:this.handleWrapperBlur,className:t,style:this.props.style,...e},this.children)}nextTick(e){this.nextTickId=window.setTimeout((()=>e()))}};Me.propTypes={animation:s.bool,children:function(e,t){const s=e[t];if(s){if(Array.isArray(s)){for(const e of s)if(!e.type||e.type!==Ie)return new Error("PanelBar children should be either PanelBarItem or Array of PanelBarItem.")}else if(s.type!==Ie)return new Error("PanelBar child should be either PanelBarItem or Array of PanelBarItem.");return null}return null},dir:s.string,selected:s.string,expanded:s.arrayOf(s.string),focused:s.string,expandMode:s.oneOf(["single","multiple"]),className:s.string,keepItemsMounted:s.bool,onSelect:s.func,style:s.object},Me.defaultProps={expandMode:"multiple",animation:!0,keepItemsMounted:!1};let Pe=Me,Ae=class extends p.Component{render(){const{id:e,size:t,collapsed:s,overlay:i,containsSplitter:r,collapsible:a,resizable:o,scrollable:l,keepMounted:c,style:d,className:m}=this.props,u=t&&t.length>0,h={flexBasis:t,...d},g=n.classNames("k-pane",{"k-hidden":s,hidden:s,"k-pane-flex":r,"k-pane-static":!o&&!a||u,"k-scrollable":l},m);return p.createElement("div",{id:e,role:"group",style:h,className:g},!s||c?this.props.children:void 0,i?p.createElement("div",{className:"k-splitter-overlay k-overlay"}):void 0)}};const ze={name:"@progress/kendo-react-layout",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"10.1.0",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},Le="splitBarLabel",Fe={[Le]:"split bar"},Ke={collapsible:!1,collapsed:!1,resizable:!0,scrollable:!0},Be=class extends p.Component{constructor(e){super(e),this.showLicenseWatermark=!1,this._container=null,this.validatePanes=e=>{if(!e.filter((e=>void 0===e.size)).length)throw new Error("The Splitter should have at least one pane without a set size.")},this.mapPaneOptions=(e,t)=>{const s=this.orientation,{dragIndex:n,isDragging:i}=this.state,r=[];for(let a=0;a<t.length;a++){let o=!1;const l=t[a];p.isValidElement(l)&&(o="Splitter"===l.type.displayName);let c=!1;i&&void 0!==n&&(c=n===a||n+1===a),r.push({...Ke,orientation:s,containsSplitter:o,overlay:c,...(e||[])[a]})}return r},this.mapSplitterPanes=(e,t)=>{const s=o.provideLocalizationService(this).toLanguageString(Le,Fe[Le]);return e.map(((n,i)=>{let r;const a=2*i,o=a+1;if(i+1<e.length){const t=e[i+1];r=p.createElement(be,{key:o,index:i,orientation:n.orientation,prev:n,next:t,ariaLabel:s,onDrag:this.onBarDragResize,onToggle:this.onBarToggle,onKeyboardResize:this.onBarKeyboardResize,isRtl:this.isRtl})}return[p.createElement(Ae,{key:a,...n},t[i]),r]}))},this.onBarToggle=(e,t)=>{const s=this.panesOptions(this.panesContent).map(((t,s)=>{const n=this.getPaneProps(t);return s===e?{...n,collapsed:!t.collapsed}:{...n}}));this.props.onChange&&this.props.onChange({newState:s,isLast:!0,nativeEvent:t})},this.onBarDragResize=(e,t,s,n,i)=>{const r=(new Date).getTime(),{pageX:a,pageY:o}=e,{prevElement:l,nextElement:c}=this.surroudingPanes(t);if(!l||!c)return;if(n)return void this.setState({isDragging:!0,dragIndex:s,startTime:r,originalX:a,originalY:o,originalPrevSize:this.elementSize(l),originalNextSize:this.elementSize(c)});const{originalPrevSize:d,originalNe