UNPKG

@progress/kendo-react-layout

Version:

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

www.telerik.com/kendo-react-ui

telerik/kendo-react

15 lines • 110 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2026 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the package root for more information *------------------------------------------------------------------------------------------- */ /** * @license *------------------------------------------------------------------------------------------- * Copyright © 2026 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"),require("react-dom")):"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","react-dom"],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,e.ReactDOM)}(this,function(e,t,n,r,a,s,i,o,l,c,d){"use strict";function u(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}}),t.default=e,Object.freeze(t)}var m=u(t),p=u(d);const h="";function f(e,t){if(I(e))return t[Number(e)];const n=t[Number(b(e))];return n.items?f(function(e){if(k(e))return e;const t=e.indexOf("_");return e.substring(t+1)}(e),n.items):void 0}function b(e){return k(e)?e:e.split("_")[0]}function g(e){return v("0",e)}function v(e,t){return t?t+"_"+e:e}function y(e){const t=e.lastIndexOf("_");return t<0?"":e.substring(0,t)}function k(e){return""===e||e.indexOf("_")<0}function I(e){return""!==e&&e.indexOf("_")<0}function N(e){return"0"===E(e)}function E(e){const t=e.lastIndexOf("_");return t<0?e:e.substring(t+1)}function x(e,t,n){return I(t)?e?Number(t)<n-1?(Number(t)+1).toString():"0":Number(t)>0?(Number(t)-1).toString():(n-1).toString():t}const C=e=>null;function w(e,t){if(e&&e.length>0)return{items:D(e),inputItems:e};if(S(t).length>0){const e=T(S(t));return{items:D(e),inputItems:e}}return{items:[],inputItems:[]}}function R(e,t){const n={},{text:r,url:a,icon:s,svgIcon:i,disabled:o,cssClass:l,cssStyle:c,render:d,linkRender:u,contentRender:m,data:p,separator:h}=e||t.props;return void 0!==r&&(n.text=r),void 0!==a&&(n.url=a),void 0!==s&&(n.icon=s),void 0!==i&&(n.svgIcon=i),void 0!==o&&(n.disabled=o),void 0!==l&&(n.cssClass=l),void 0!==c&&(n.cssStyle=c),void 0!==d&&(n.render=d),void 0!==u&&(n.linkRender=u),void 0!==m&&(n.contentRender=m),void 0!==p&&(n.data=p),void 0!==h&&(n.separator=h),n}function S(e){return m.Children.toArray(e).filter(e=>e&&e.type===C)}function T(e){const t=[];for(let n=0;n<e.length;n++){const r=e[n],a=R(void 0,r),s=T(S(r.props.children));s.length>0&&(a.items=s),t.push(a)}return t}function D(e,t){const n=[];for(let r=0;r<e.length;r++){const a=e[r],s=R(a);s.id=v(r.toString(),t),s.isLastFromSiblings=r===e.length-1,s.separator=!0===a.separator,s.items=O(a,s),n.push(s)}return n}function O(e,t){return e.contentRender?[{contentParentItemId:t.id,id:v("0",t.id),isLastFromSiblings:!0,separator:!1,contentRender:e.contentRender,items:[]}]:e.items?D(e.items,t.id):[]}C.propTypes={text:n.string,url:n.string,icon:n.string,disabled:n.bool,cssClass:n.string,cssStyle:n.object,render:n.any,linkRender:n.any,contentRender:n.any,data:n.any,separator:n.bool},C.displayName="MenuItem";const M=/\S/;function P(e,t,n,a,s,i){const o=h();switch(n){case r.Keys.left:return s?i?u():c():i?d():l();case r.Keys.right:return s?i?c():u():i?l():d();case r.Keys.up:return s?N():I(t)?p():N();case r.Keys.down:return s?C():I(t)?m():C();case r.Keys.enter:case r.Keys.space:return o.disabled?t:k()?g(t):b(t);case r.Keys.home:return w()[0].id;case r.Keys.end:return function(){const e=w();return e[e.length-1].id}();case r.Keys.esc:return I(t)?t:y(t);default:return 1===a.length&&M.test(a)?function(){const e=a.toLowerCase(),n=w(),r=Number(E(t)),s=n.slice(r+1).concat(n.slice(0,r+1)).find(t=>(t.text||"").toLowerCase().startsWith(e));return s?s.id:t}():t}function l(){return I(t)?N():function(e){return 1===function(e){return e.split("_").length-1}(e)}(t)?m(N(b(t))):y(t)}function c(){return I(t)?p():y(t)}function d(){return I(t)?C():m(k()?t:C(b(t)))}function u(){return m(I(t)||k()?t:C(b(t)))}function m(e){return R(!0,e)}function p(e){return R(!1,e)}function h(n,r){return void 0===n&&(n=t),void 0===r&&(r=e),f(n,r)}function k(e){return h(e).items.length>0}function N(e){return S(!1,e)}function C(e){return S(!0,e)}function w(){return I(t)?e:h(y(t),e).items}function R(e,n){void 0===n&&(n=t);const r=h(n);return k(n)&&!r.disabled?e?g(n):function(e){const t=h(e).items;return t[t.length-1].id}(n):n}function S(n,r){if(void 0===r&&(r=t),I(r))return x(n,r,e.length);const a=y(r);return v(x(n,E(r),h(a).items.length),a)}}const z={vertical:"flip",horizontal:"fit"},L={vertical:"fit",horizontal:"flip"},A={downward:{anchorAlign:{vertical:"bottom",horizontal:"right"},popupAlign:{vertical:"top",horizontal:"right"},collision:z,animationDirection:"down"},leftward:{anchorAlign:{vertical:"top",horizontal:"left"},popupAlign:{vertical:"top",horizontal:"right"},collision:L,animationDirection:"left"}},F={downward:{anchorAlign:{vertical:"bottom",horizontal:"left"},popupAlign:{vertical:"top",horizontal:"left"},collision:z,animationDirection:"down"},rightward:{anchorAlign:{vertical:"top",horizontal:"right"},popupAlign:{vertical:"top",horizontal:"left"},collision:L,animationDirection:"right"}};function K(e,t,n){return I(e)?t?n?"leftward":"rightward":"downward":n?"leftward":"rightward"}function B(e){return e?"rtl":"ltr"}function $(e,t){return`${e}_${t}`}const H=e=>r.classNames("k-link","k-menu-link",{"k-active":e}),j=e=>e.url?m.createElement("a",{className:H(e.opened),href:e.url,tabIndex:-1},e.children):m.createElement("span",{id:e.id,className:r.classNames(H(e.opened),e.className),style:e.style,role:"presentation"},e.children);j.propTypes={opened:n.bool,url:n.string};const W="chevron-down",q="chevron-right",V="chevron-left",U=e=>{switch(K(e.itemId,!0===e.verticalMenu,"rtl"===e.dir)){case"downward":return{name:W,icon:s.chevronDownIcon};case"rightward":return{name:q,icon:s.chevronRightIcon};case"leftward":return{name:V,icon:s.chevronLeftIcon};default:return{}}},G=e=>m.createElement(r.IconWrap,{"aria-hidden":!0,...U(e)}),X=e=>{const{parentItemId:t}=e,n=void 0!==t?n=>{e.onMouseOver(t),n.stopPropagation()}:void 0,r=void 0!==t?n=>{e.onMouseLeave(t),n.stopPropagation()}:void 0;let a;return a=e.role?e.role:void 0!==t?"menu":"menubar",m.createElement("ul",{className:e.className,role:a,id:void 0!==t?$(e.menuGuid,t):void 0,onMouseOver:n,onMouseLeave:r,"aria-orientation":e["aria-orientation"]},e.items.length>0?e.items.map((t,n)=>m.createElement(_,{item:t,animate:e.animate,isMenuVertical:e.isMenuVertical,isDirectionRightToLeft:e.isDirectionRightToLeft,focusedItemId:e.focusedItemId,lastItemIdToBeOpened:e.lastItemIdToBeOpened,tabbableItemId:e.tabbableItemId,itemRender:e.itemRender,linkRender:e.linkRender,menuGuid:e.menuGuid,onMouseOver:e.onMouseOver,onMouseLeave:e.onMouseLeave,onBlur:e.onBlur,onFocus:e.onFocus,onClick:e.onClick,onOriginalItemNeeded:e.onOriginalItemNeeded,onPopupClose:e.onPopupClose,key:n})):null)},_=e=>{const t=m.useRef(null),n=m.useRef(!0),s=m.useRef(void 0),i=e.item,o=i.id,l=$(e.menuGuid,o),c=i.separator,d=i.render||e.itemRender,u=i.linkRender||e.linkRender,p=i.contentParentItemId?i.contentRender:null,h=i.items.length>0&&function(e,t){return 0===t.indexOf(e)&&(t.length===e.length||"_"===t.charAt(e.length))}(o,e.lastItemIdToBeOpened)&&!n.current;m.useEffect(()=>{var a,i,o;const l=e.focusedItemId,c=e.item.id,d=s.current;if(n.current)l&&l===c&&(null==(a=t.current)||a.focus({preventScroll:!0})),n.current=!1;else if(l){const e=r.getActiveElement(document);d!==l&&l===c&&(null==(i=t.current)||!i.contains(e))&&(null==(o=t.current)||o.focus({preventScroll:!0}))}s.current=l});const f=t=>{e.onPopupClose(o,t)},b=r.classNames("k-item","k-menu-item",{"k-first":N(o),"k-last":i.isLastFromSiblings,"k-disabled":i.disabled},i.cssClass);return m.createElement(m.Fragment,null,c?m.createElement("li",{className:"k-separator k-item","aria-hidden":!0,key:l,id:l,ref:t}):m.createElement("li",{id:l,className:b,style:i.cssStyle,tabIndex:o===e.tabbableItemId?0:-1,onMouseOver:t=>{e.onMouseOver(o),t.stopPropagation()},onMouseLeave:t=>{e.onMouseLeave(o),t.stopPropagation()},onBlur:t=>e.onBlur(o,t),onFocus:()=>e.onFocus(o),onClick:t=>e.onClick(t,o),role:"menuitem","aria-disabled":!!i.disabled||void 0,"aria-haspopup":i.items.length>0||void 0,"aria-expanded":i.items.length>0?h:void 0,"aria-label":i.text,"aria-owns":h?l:void 0,ref:t,key:l},p?(()=>{const t=i.contentParentItemId,n=p;return m.createElement("div",{className:"k-content",role:"presentation"},m.createElement(n,{item:e.onOriginalItemNeeded(t),itemId:t}))})():(()=>{if(u){const t=u;return m.createElement(t,{item:e.onOriginalItemNeeded(i.id),itemId:i.id,opened:h,dir:B(e.isDirectionRightToLeft)})}const t=d,n=t?m.createElement(t,{item:e.onOriginalItemNeeded(i.id),itemId:i.id,key:"1"}):m.createElement("span",{className:"k-menu-link-text"},i.text);return m.createElement(j,{url:i.url,opened:h},i.icon||i.svgIcon?m.createElement(r.IconWrap,{name:i.icon,icon:i.svgIcon,key:"0"}):null,n,i.items.length>0?m.createElement("span",{className:"k-menu-expand-arrow","aria-hidden":!0},m.createElement(G,{itemId:i.id,verticalMenu:e.isMenuVertical,dir:B(e.isDirectionRightToLeft),key:"2"})):null)})()),(()=>{const n=e.animate,{anchorAlign:s,popupAlign:l,collision:c,animationDirection:d}=function(e,t,n){const r=K(e,t,n);return n?"downward"===r?A.downward:A.leftward:"downward"===r?F.downward:F.rightward}(o,e.isMenuVertical,e.isDirectionRightToLeft);let u;return u=!0===n?{openDuration:300,closeDuration:300,direction:d}:!1!==n&&{openDuration:(null==n?void 0:n.openDuration)||300,closeDuration:(null==n?void 0:n.closeDuration)||300,direction:(null==n?void 0:n.direction)||d},m.createElement(a.Popup,{anchor:t.current,show:h,popupClass:r.classNames("k-menu-popup",{"k-rtl":e.isDirectionRightToLeft}),anchorAlign:s,popupAlign:l,collision:c,animate:u,onClose:f,key:"1"},m.createElement(X,{parentItemId:o,animate:e.animate,items:i.items,menuGuid:e.menuGuid,focusedItemId:e.focusedItemId,lastItemIdToBeOpened:e.lastItemIdToBeOpened,tabbableItemId:e.tabbableItemId,itemRender:e.itemRender,linkRender:e.linkRender,isMenuVertical:e.isMenuVertical,isDirectionRightToLeft:e.isDirectionRightToLeft,className:"k-group k-menu-group k-reset k-menu-group-md",onMouseOver:e.onMouseOver,onMouseLeave:e.onMouseLeave,onBlur:e.onBlur,onFocus:e.onFocus,onClick:e.onClick,onOriginalItemNeeded:e.onOriginalItemNeeded,onPopupClose:e.onPopupClose}))})())};let Y=class{constructor(){this.phase="NotInitialized"}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}},Z=class{constructor(e,t){this.openOnClick=e,this.resetMenu=t,this.isMouseOverEnabled=!e}set OpenOnClick(e){!!e!=!!this.openOnClick&&(this.isMouseOverEnabled=!e),this.openOnClick=e}handleItemSelectedViaKeyboard(){this.openOnClick&&(this.isMouseOverEnabled=!1,this.resetMenu())}get IsMouseOverEnabled(){return this.isMouseOverEnabled}};const J={focusedItemId:h,hoveredItemId:h,tabbableItemId:"0"},Q=m.forwardRef((e,t)=>{const n=m.useRef(null),a=m.useRef(null),s=m.useRef(null),i=m.useRef(new Y),o=m.useRef([]),l=m.useRef([]),c=m.useRef(e);c.current=e;const[d,u]=m.useState({...J}),p=m.useRef(d);p.current=d;const g=m.useRef(()=>{}),v=m.useRef(new Z(e.openOnClick,()=>g.current())),{items:N,inputItems:E}=w(e.items,e.children);o.current=N,l.current=E,i.current.setIsDirectionRightToLeft(!!(void 0!==c.current.dir?"rtl"===c.current.dir:n.current&&"rtl"===getComputedStyle(n.current).direction));const x=m.useCallback(()=>{a.current&&(clearTimeout(a.current),a.current=null),s.current&&(clearTimeout(s.current),s.current=null)},[]),C=m.useCallback(()=>{x(),u({...J})},[x]);g.current=C;const R=m.useRef({get element(){return n.current},reset:()=>g.current()});m.useImperativeHandle(t,()=>R.current,[]);const S=m.useCallback(e=>{u(t=>{const n=e===h?t.tabbableItemId:b(e);return{hoveredItemId:e===h||k(t.hoveredItemId)&&k(e)?t.hoveredItemId:h,focusedItemId:e,tabbableItemId:n}})},[]),T=m.useCallback(e=>{u(t=>k(e)&&k(t.focusedItemId)?{hoveredItemId:e,focusedItemId:t.focusedItemId,tabbableItemId:t.tabbableItemId}:{hoveredItemId:e,focusedItemId:h,tabbableItemId:"0"})},[]),D=m.useCallback(e=>f(e,l.current),[]),O=m.useCallback((e,t)=>{r.dispatchEvent(c.current.onSelect,e,R.current,{item:D(t),itemId:t})},[D]),M=m.useCallback(e=>!c.current.customCloseItemIds||-1===c.current.customCloseItemIds.indexOf(e),[]),z=m.useCallback(e=>{var t,r;const a=c.current,s=p.current;if(a.openOnClick&&s.hoveredItemId!==h){const s=e.target;!1===(null==(t=n.current)?void 0:t.contains(s))&&(a.id&&null!=(r=s.closest)&&r.call(s,`[id^="${a.id}_"]`)||T(h))}},[T]),L=m.useCallback(e=>{const t=p.current,n=c.current,a=o.current;if(t.focusedItemId!==h){const s=f(t.focusedItemId,a);let o=P(a,s.id,e.keyCode,e.key,n.vertical,i.current.getIsDirectionRightToLeft());const l=f(o,a);if(null!=l&&l.separator&&(o=P(a,o,e.keyCode,e.key,n.vertical,i.current.getIsDirectionRightToLeft())),s.id!==o&&(e.preventDefault(),S(o)),(e.keyCode===r.Keys.enter||e.keyCode===r.Keys.space)&&!s.disabled&&(v.current.handleItemSelectedViaKeyboard(),O(e,s.id),!e.isDefaultPrevented()&&0===s.items.length&&s.url&&window.location.assign(s.url)),e.keyCode===r.Keys.esc&&I(s.id)&&n.onClose){const e=D(s.id);n.onClose({target:R.current,item:e,itemId:s.id})}}},[S,O,D]),A=m.useCallback(e=>{const t=p.current,n=c.current,r=n.openOnClick&&!I(e)&&t.hoveredItemId!==h;(v.current.IsMouseOverEnabled||r)&&(x(),a.current=window.setTimeout(()=>{T(e),a.current=null},function(e){return void 0!==e.hoverOpenDelay?e.hoverOpenDelay:e.openOnClick?0:100}(n)))},[x,T]),F=m.useCallback(e=>{const t=p.current,n=c.current,r=n.openOnClick&&!I(e)&&t.hoveredItemId!==h;(v.current.IsMouseOverEnabled||r)&&M(e)&&(x(),s.current=window.setTimeout(()=>{T(r?y(e):h),s.current=null},function(e){return void 0!==e.hoverCloseDelay?e.hoverCloseDelay:100}(n)))},[x,M,T]),K=m.useCallback(e=>{p.current.hoveredItemId===h?S(e):u(t=>({focusedItemId:e,hoveredItemId:t.hoveredItemId,tabbableItemId:b(e)}))},[S]),B=m.useCallback((e,t)=>{const n=f(t,o.current),r=p.current,a=c.current;if(!n.disabled){const s=I(t),i=!n.items||0===n.items.length;s?(S(t),i||a.openOnClick&&r.hoveredItemId!==h&&b(r.hoveredItemId)===t?T(h):T(t)):i&&(S(t),T(h)),O(e,t),!e.isDefaultPrevented()&&n.url&&window.location.assign(n.url)}},[S,T,O]),$=m.useCallback((e,t)=>{const n=c.current;n.onClose&&n.onClose({target:R.current,item:D(e),itemId:e,popupCloseEvent:t})},[D]),H=m.useCallback((e,t)=>{var n;const r=c.current;if(M(e)&&S(h),"LI"===(null==(n=t.relatedTarget)?void 0:n.nodeName)){const e=t.relatedTarget.getAttribute("id");if(null!=e&&e.includes(r.id))return}if(I(e)&&r.onClose){const t=D(e);r.onClose({target:R.current,item:t,itemId:e})}},[M,S,D]),j=m.useRef(e.vertical);m.useEffect(()=>()=>{x()},[x]),m.useEffect(()=>(e.openOnClick&&document.addEventListener("mousedown",z),()=>{document.removeEventListener("mousedown",z)}),[e.openOnClick,z]),m.useEffect(()=>{const t=!!j.current!=!!e.vertical,n=i.current.hasDirectionChanged();(t||n)&&C(),v.current.OpenOnClick=e.openOnClick,j.current=e.vertical});let W;W=d.hoveredItemId?d.hoveredItemId:d.focusedItemId?y(d.focusedItemId):h;const q=void 0===e.animate||e.animate;return m.createElement("div",{id:e.id,onKeyDown:L,style:e.style,className:i.current.getIsDirectionRightToLeft()?"k-rtl":void 0,ref:n},m.createElement(X,{className:r.classNames("k-reset","k-header","k-menu",{"k-menu-horizontal":!e.vertical},{"k-menu-vertical":e.vertical},e.className),"aria-orientation":e.vertical?"vertical":void 0,items:o.current,animate:q,isMenuVertical:e.vertical,isDirectionRightToLeft:i.current.getIsDirectionRightToLeft(),focusedItemId:d.focusedItemId,lastItemIdToBeOpened:W,tabbableItemId:d.tabbableItemId,itemRender:e.itemRender,linkRender:e.linkRender,menuGuid:e.id,onMouseLeave:F,onMouseOver:A,onFocus:K,onClick:B,onBlur:H,onOriginalItemNeeded:D,onPopupClose:$,role:e.role}))});Q.propTypes={vertical:n.bool,items:n.arrayOf(n.object),style:n.object,animate:n.oneOfType([n.bool,n.shape({openDuration:n.number,closeDuration:n.number})]),dir:n.string,hoverOpenDelay:n.number,hoverCloseDelay:n.number,openOnClick:n.bool,itemRender:n.any,linkRender:n.any,customCloseItemIds:n.arrayOf(n.string),onSelect:n.func,onClose:n.func,role:n.string},Q.displayName="Menu";const ee=m.forwardRef((e,t)=>{const{id:n,active:a,disabled:s,title:i="Untitled",index:o,renderAllContent:l,first:c,last:d,contentPanelId:u,onSelect:p}=e,h=m.useRef(null),f=m.useCallback(()=>{var e;null==(e=h.current)||e.focus()},[]),b=m.useCallback(()=>{var e;null==(e=h.current)||e.blur()},[]),g=m.useCallback(()=>({focus:f,blur:b}),[f,b]);m.useImperativeHandle(t,g);const v=m.useCallback(()=>{null==p||p(o),h.current&&(h.current.tabIndex=0,h.current.focus())},[p,o]),y=m.useMemo(()=>l?`${u}-${o.toString()}`:u,[l,u,o]),k=m.useMemo(()=>r.classNames("k-tabstrip-item",{"k-disabled":s,"k-active":a,"k-first":c,"k-last":d}),[s,a,c,d]),I=m.useMemo(()=>({id:`${n}-${o.toString()}`,"aria-selected":a,"aria-controls":a?y:void 0,"aria-disabled":s,role:"tab",onClick:s?void 0:v}),[n,o,a,y,s,v]);return m.createElement("li",{...I,className:k,ref:h,onBlur:b,"aria-controls":y},m.createElement("span",{className:"k-link"},i))});ee.propTypes={active:n.bool,disabled:n.bool,index:n.number,onSelect:n.func,title:n.oneOfType([n.string,n.element]),first:n.bool,last:n.bool},ee.displayName="TabStripNavigationItem";const te="prevArrow.title",ne="nextArrow.title",re={[te]:"Previous tab arrow",[ne]:"Next tab arrow"},ae="smooth",se="prev",ie="next",oe=e=>{const{selected:t,tabPosition:n,tabAlignment:a,children:l,onSelect:c,onKeyDown:d,onScroll:u,navItemId:p,contentPanelId:h,renderAllContent:f,scrollable:b,scrollButtons:g,scrollButtonsPosition:v,tabIndex:y,buttonScrollSpeed:k,mouseScrollSpeed:I,prevButton:N,nextButton:E,dir:x,size:C,containerScrollPosition:w,itemsNavRef:R}=e,S=m.useRef(null),T=R||S,D=o.useLocalization(),O=m.useCallback(()=>/top|bottom/.test(n||"top"),[n]),M=m.useCallback(()=>"rtl"===x,[x]),P=m.useCallback(()=>{const e=T.current,n=null==e?void 0:e.children[t||0];if(n instanceof HTMLElement&&e instanceof HTMLElement){const t=O(),r=t?e.offsetWidth:e.offsetHeight,a=t?n.offsetWidth:n.offsetHeight,s=t?"left":"top";let i=t?e.scrollLeft:e.scrollTop,o=0;if(M()){const t=n.offsetLeft;i*=-1,t<0?(o=t-a+e.offsetLeft,e.scrollTo({[s]:o,behavior:ae})):t+a>r-i&&(o=i+t-a,e.scrollTo({[s]:o,behavior:ae}))}else{const l=t?n.offsetLeft-e.offsetLeft:n.offsetTop-e.offsetTop;i+r<l+a?(o=l+a-r,e.scrollTo({[s]:o,behavior:ae})):i>l&&(o=l,e.scrollTo({[s]:o,behavior:ae}))}}},[T,t,O,M]);m.useEffect(()=>{b&&P()},[b,t,P]);const z=m.useCallback(()=>{null==u||u()},[u]),L=m.useCallback((e,t)=>{const n=T.current;if(!n)return;const r=O(),a=r?n.scrollWidth-n.offsetWidth:n.scrollHeight-n.offsetHeight,s=("click"===t.type?k:I)||0;let i=r?n.scrollLeft:n.scrollTop;M()&&O()?(e===se&&i<0&&(i+=s),e===ie&&i<a&&(i-=s),i=Math.min(0,Math.min(a,i))):(e===se&&i>0&&(i-=s),e===ie&&i<a&&(i+=s),i=Math.max(0,Math.min(a,i)));const o="click"===t.type?ae:void 0;r?n.scrollTo({left:i,behavior:o}):n.scrollTo({top:i,behavior:o})},[T,O,M,k,I]),A=m.useCallback((e,t)=>{L(e,t)},[L]),F=m.useCallback(e=>{A(se,e)},[A]),K=m.useCallback(e=>{A(ie,e)},[A]),B=m.useCallback(e=>{const t=O(),n=M(),a=t?n?"chevron-right":"chevron-left":"chevron-up",o=t?n?s.chevronRightIcon:s.chevronLeftIcon:s.chevronUpIcon,l=t?n?"chevron-left":"chevron-right":"chevron-down",c=t?n?s.chevronLeftIcon:s.chevronRightIcon:s.chevronDownIcon,d={prev:{arrowTab:"k-tabstrip-prev",fontIcon:a,svgIcon:o,title:D.toLanguageString(te,re[te])},next:{arrowTab:"k-tabstrip-next",fontIcon:l,svgIcon:c,title:D.toLanguageString(ne,re[ne])}},u=(e===se?N:E)||i.Button,p=e===se?F:K,h=null===w||e===se&&("start"===w||"top"===w)||e===ie&&("end"===w||"bottom"===w);return m.createElement(u,{disabled:h,className:r.classNames(`${d[e].arrowTab}`),onClick:p,icon:d[e].fontIcon,svgIcon:d[e].svgIcon,size:C,tabIndex:-1,fillMode:"flat",title:d[e].title})},[O,M,N,E,F,K,w,C,D]),$=m.Children.count(l),H=m.Children.toArray(l),j=m.useMemo(()=>l?(e=>Array.from({length:e}))($).map((e,n,r)=>{const a={active:t===n,disabled:H[n].props.disabled,index:n,title:H[n].props.title,first:0===n,last:n===r.length-1,contentPanelId:h,renderAllContent:f,id:p,onSelect:c,onScroll:z};return m.createElement(ee,{key:`${p}-${n}`,...a})}):null,[l,$,t,h,f,p,c,z]),W=m.useMemo(()=>r.classNames("k-tabstrip-items-wrapper k-tabstrip-items-wrapper-scroll",{"k-hstack":"top"===n||"bottom"===n,"k-vstack":"left"===n||"right"===n}),[n]),q=m.useMemo(()=>r.classNames("k-tabstrip-items k-tabstrip-items-scroll k-reset",`k-tabstrip-items-${a}`),[a]);return m.createElement("div",{className:W},b?m.createElement(m.Fragment,null,"hidden"!==g&&v&&["split","start","around","before"].includes(v)&&B(se),"hidden"!==g&&("start"===v||"before"===v)&&B(ie),m.createElement("ul",{ref:T,className:q,role:"tablist",tabIndex:y,onKeyDown:d,onScroll:z,"aria-orientation":"left"===n||"right"===n?"vertical":void 0},j),"hidden"!==g&&("end"===v||"after"===v)&&B(se),"hidden"!==g&&v&&["split","end","around","after"].includes(v)&&B(ie)):m.createElement("ul",{className:q,role:"tablist",tabIndex:y,onKeyDown:d},j))};oe.propTypes={children:n.oneOfType([n.element,n.arrayOf(n.element)]),onSelect:n.func,onKeyDown:n.func,onScroll:n.func,selected:n.number,tabIndex:n.number,scrollable:n.bool,size:n.oneOf(["small","medium","large"]),scrollButtons:n.oneOf(["auto","visible","hidden"]),scrollButtonsPosition:n.oneOf(["split","start","end","around","before","after"]),containerScrollPosition:n.oneOf(["start","end","top","bottom","middle",null])},oe.displayName="TabStripNavigation";const le=e=>{const{children:t,selected:n,contentPanelId:a,keepTabsMounted:s,navItemId:i,renderAllContent:o,animation:c,style:d}=e,u=a,p=m.useCallback(e=>m.cloneElement(e,{...e.props,in:e.props.children.props.id===String(u+n)}),[u,n]),h=m.useCallback((e,t)=>{const r=t===n,a={style:{display:r?void 0:"none"}},i={display:r?void 0:"none"};return e.props.disabled?null:c?m.createElement(l.Fade,{appear:!0,exit:s,style:i,childFactory:s?p:void 0},m.createElement("div",{...a,id:String(u+t),key:t},e.props.children)):m.createElement("div",{...a,key:t},e.props.children)},[n,c,s,p,u]),f=m.useCallback(e=>s?m.Children.map(e,(e,t)=>h(e,t)):h(m.Children.toArray(e)[n],n),[s,h,n]),b=m.useMemo(()=>m.Children.map(t,(e,t)=>{const s=e,o=t===n,u=r.classNames("k-tabstrip-content",{"k-active":o},s.props.contentClassName),p=c?m.createElement(l.Fade,{key:`${t}-${o}`,appear:!0,enter:!0,exit:!1},s.props.children):s.props.children;return m.createElement("div",{className:u,style:d,id:`${a}-${t}`,role:"tabpanel","aria-hidden":!o,hidden:!o,"aria-labelledby":`${i}-${t}`},p)}),[t,n,a,i,d,c]),g=m.useMemo(()=>t&&"number"==typeof n?m.Children.toArray(t)[n]:null,[t,n]),v=m.useMemo(()=>r.classNames("k-tabstrip-content","k-active",null==g?void 0:g.props.contentClassName),[g]);return o?b:m.createElement("div",{className:v,style:d,id:a,role:"tabpanel","aria-hidden":s,"aria-labelledby":`${i}-${(null==n?void 0:n.toString())||""}`,tabIndex:0},f(t))};le.propTypes={animation:n.bool,children:n.oneOfType([n.element,n.arrayOf(n.element)]),selected:n.number,style:n.object},le.displayName="TabStripContent";const ce={animation:!0,tabPosition:"top",tabAlignment:"start",keepTabsMounted:!1,buttonScrollSpeed:100,mouseScrollSpeed:10,scrollButtons:"auto",scrollButtonsPosition:"split",renderAllContent:!1},de=m.forwardRef((e,t)=>{const n=m.useMemo(()=>({...ce,...e}),[e]),{id:a,animation:s,children:i,selected:o,onSelect:l,style:c,tabContentStyle:d,tabPosition:u,tabAlignment:p,tabIndex:h,className:f,dir:b,renderAllContent:g,keepTabsMounted:v,size:y,scrollable:k,scrollButtons:I,scrollButtonsPosition:N,buttonScrollSpeed:E,mouseScrollSpeed:x,prevButton:C,nextButton:w}=n,[R,S]=m.useState(null),T=m.useRef({props:n}),D=m.useRef(null),O=m.useRef(null),M=m.useRef(void 0),P=m.useRef(void 0),z=m.useCallback(()=>({props:n}),[n]);m.useImperativeHandle(T,z),m.useImperativeHandle(t,z),r.useWebMcpRegister("tabstrip",T,n,n.webMcp);const L=m.useMemo(()=>a?a+"-content-panel-id":void 0,[a]),A=m.useMemo(()=>a?a+"-nav-item-id":void 0,[a]),F=m.useMemo(()=>m.Children.toArray(i).filter(Boolean),[i]),K=m.useCallback(()=>/top|bottom/.test(u||"top"),[u]),B=m.useCallback(()=>{const e=K(),t=O.current;if(!t)return;const n=t.scrollLeft,r=t.clientWidth,a=t.scrollWidth,s=t.scrollTop,i=t.scrollHeight,o=t.clientHeight;let l=null;const c="rtl"===b;l=(e?a>r:i>o)?e?n+r===a||(c&&r-n)===a?"end":0===n||c&&0===-n?"start":n>0&&n+r<a||-n>0&&r-n<a?"middle":null:i-(s+o)===0?"bottom":0===s?"top":s>0&&i-(s+o)>0?"middle":null:null,S(l)},[K,b]),$=m.useCallback(e=>{o!==e&&l&&l({selected:e})},[o,l]),H=m.useCallback(e=>{var t,n;(null==(n=null==(t=null==F?void 0:F[e])?void 0:t.props)?void 0:n.disabled)||$(e)},[F,$]),j=m.useCallback(e=>{P.current&&P.current.triggerKeyboardEvent(e)},[]);m.useEffect(()=>{var e;const t=D.current,n=t&&"rtl"===getComputedStyle(t).direction||!1;return t&&(P.current=new r.Navigation({tabIndex:0,root:D,rovingTabIndex:!0,focusClass:"k-focus",selectors:[".k-tabstrip .k-tabstrip-item"],keyboardEvents:{keydown:{ArrowLeft:(e,t,r)=>{r.preventDefault();const a=t.elements.indexOf(e),s=0!==a?a-1:t.elements.length-1,i=a!==t.elements.length-1?a+1:0;n?(t.focusNext(e),H(i)):(t.focusPrevious(e),H(s))},ArrowRight:(e,t,r)=>{r.preventDefault();const a=t.elements.indexOf(e),s=0!==a?a-1:t.elements.length-1,i=a!==t.elements.length-1?a+1:0;n?(t.focusPrevious(e),H(s)):(t.focusNext(e),H(i))},ArrowDown:(e,t,n)=>{n.preventDefault();const r=t.elements.indexOf(e),a=r!==t.elements.length-1?r+1:0;t.focusNext(e),H(a)},ArrowUp:(e,t,n)=>{n.preventDefault();const r=t.elements.indexOf(e),a=0!==r?r-1:t.elements.length-1;t.focusPrevious(e),H(a)},Home:(e,t,n)=>{n.preventDefault(),t.focusElement(t.first,e),H(0)},End:(e,t,n)=>{n.preventDefault(),t.focusElement(t.last,e),H(t.elements.length-1)}}}}),null==(e=P.current)||e.initializeRovingTab(o),B(),M.current=window.ResizeObserver&&new ResizeObserver(()=>B()),D.current&&M.current&&M.current.observe(D.current)),()=>{var e;null==(e=P.current)||e.removeFocusListener(),M.current&&M.current.disconnect()}},[o,H,B]);const W=m.useMemo(()=>{const e=m.Children.count(F);return o<e&&o>-1?m.createElement(le,{index:o,selected:o,contentPanelId:L,navItemId:A,animation:s,keepTabsMounted:v,renderAllContent:g,style:d},F):null},[o,F,L,A,s,v,g,d]),q="hidden"===I||null===R&&"auto"===I?"hidden":"visible",V=m.useMemo(()=>({itemsNavRef:O,children:F,selected:o,tabIndex:h,tabPosition:u,tabAlignment:p,size:y,scrollable:k,scrollButtons:q,scrollButtonsPosition:N,buttonScrollSpeed:E,mouseScrollSpeed:x,prevButton:C,nextButton:w,dir:b,contentPanelId:L,renderAllContent:g,navItemId:A,onKeyDown:j,onSelect:$,onScroll:B,containerScrollPosition:R}),[O,F,o,h,u,p,y,k,q,N,E,x,C,w,b,L,g,A,j,$,B,R]),U="bottom"===u,G=m.useMemo(()=>r.classNames("k-tabstrip k-pos-relative",{[`k-tabstrip-${r.kendoThemeMaps.sizeMap[y||"medium"]||y}`]:y,"k-tabstrip-left":"left"===u,"k-tabstrip-right":"right"===u,"k-tabstrip-bottom":"bottom"===u,"k-tabstrip-top":"top"===u,"k-tabstrip-scrollable":k,"k-tabstrip-scrollable-start k-tabstrip-scrollable-end":k&&"visible"===q,"k-tabstrip-scrollable-start":k&&"auto"===I&&("end"===R||"middle"===R),"k-tabstrip-scrollable-end":k&&"auto"===I&&("start"===R||"middle"===R)},f),[y,u,k,I,q,R,f]);return m.createElement("div",{id:a,ref:D,dir:b,className:G,style:c,onScroll:B},!U&&m.createElement(oe,{...V}),W,U&&m.createElement(oe,{...V}))});de.displayName="TabStrip",de.propTypes={id:n.string,animation:n.bool,children:n.node,onSelect:n.func,selected:n.number,style:n.object,tabContentStyle:n.object,tabPosition:n.string,tabAlignment:n.string,tabIndex:n.number,className:n.string,dir:n.string,renderAllContent:n.bool,size:n.oneOf(["small","medium","large"]),scrollButtons:n.oneOf(["auto","visible","hidden"]),scrollButtonsPosition:n.oneOf(["split","start","end","around","before","after"])};const ue=de;let me=class extends m.Component{constructor(e){super(e),this.draggable=null,this.spliterBarRef=m.createRef(),this.onDrag=(e,t,n)=>{const{event:r}=e,{onDrag:a,index:s}=this.props,i=this.draggable&&this.draggable.element;i&&!this.isStatic&&this.isDraggable&&a(r,i,s,t,n)},this.onFocus=()=>{this.setState({focused:!0})},this.onBlur=()=>{this.setState({focused:!1})},this.onToggle=e=>{const{onToggle:t,index:n,prev:r,next:a}=this.props;(r.collapsible||a.collapsible)&&t(r.collapsible?n:n+1,e)},this.onPrevToggle=e=>{const{onToggle:t,index:n,prev:r}=this.props;r.collapsible&&t(n,e)},this.onNextToggle=e=>{const{onToggle:t,index:n,next:r}=this.props;r.collapsible&&t(n+1,e)},this.onKeyDown=e=>{this.navigation.triggerKeyboardEvent(e)},this.state={focused:!1}}get isStatic(){const{prev:e,next:t}=this.props,n=e.resizable&&t.resizable,r=e.collapsible||t.collapsible;return!n&&!r}get isDraggable(){const{prev:e,next:t}=this.props,n=e.resizable&&t.resizable,r=e.collapsed||t.collapsed;return!!n&&!r}get isHorizontal(){return"horizontal"===this.props.orientation}componentDidMount(){const e=this.draggable&&this.draggable.element,{index:t,onKeyboardResize:n}=this.props,a=this.isHorizontal;e&&(this.navigation=new r.Navigation({tabIndex:0,root:this.spliterBarRef,selectors:[".k-splitter .k-splitbar"],keyboardEvents:{keydown:{ArrowLeft:(r,s,i)=>{a&&(i.preventDefault(),this.isDraggable&&n(e,t,-10,i),(i.metaKey||i.ctrlKey)&&(n(e,t,0,i),this.isDraggable?this.onPrevToggle(i):this.onNextToggle(i)))},ArrowRight:(r,s,i)=>{a&&(i.preventDefault(),this.isDraggable&&n(e,t,10,i),(i.metaKey||i.ctrlKey)&&(n(e,t,0,i),this.isDraggable?this.onNextToggle(i):this.onPrevToggle(i)))},ArrowDown:(r,s,i)=>{a||(i.preventDefault(),this.isDraggable&&n(e,t,10,i),(i.metaKey||i.ctrlKey)&&(n(e,t,0,i),this.isDraggable?this.onNextToggle(i):this.onPrevToggle(i)))},ArrowUp:(r,s,i)=>{a||(i.preventDefault(),this.isDraggable&&n(e,t,-10,i),(i.metaKey||i.ctrlKey)&&(n(e,t,0,i),this.isDraggable?this.onPrevToggle(i):this.onNextToggle(i)))},Enter:(e,t,n)=>{n.preventDefault(),this.onToggle(n)}}}}))}get ariaValueNow(){const{prev:e}=this.props;if(!this.isStatic&&e.size){const t=parseFloat(e.size);if(!isNaN(t))return t}}render(){const e=this.isDraggable,t=this.isStatic,n=this.isHorizontal;let a,i,o,l;if(this.props.prev.collapsible)if(n){const e=!!this.props.prev.collapsed!=!!this.props.isRtl;a=e?"chevron-right":"chevron-left",i=e?s.chevronRightIcon:s.chevronLeftIcon}else a=this.props.prev.collapsed?"chevron-down":"chevron-up",i=this.props.prev.collapsed?s.chevronDownIcon:s.chevronUpIcon;if(this.props.next.collapsible)if(n){const e=!!this.props.next.collapsed==!!this.props.isRtl;o=e?"chevron-right":"chevron-left",l=e?s.chevronRightIcon:s.chevronLeftIcon}else o=this.props.next.collapsed?"chevron-up":"chevron-down",l=this.props.next.collapsed?s.chevronUpIcon:s.chevronDownIcon;const c=r.classNames("k-splitbar",{"k-focus":this.state.focused,"k-splitbar-horizontal":n,"k-splitbar-vertical":!n,"k-splitbar-draggable-horizontal":n&&e,"k-splitbar-draggable-vertical":!n&&e,"k-splitbar-static-horizontal":n&&t,"k-splitbar-static-vertical":!n&&t});return m.createElement(r.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}},m.createElement("div",{ref:this.spliterBarRef,tabIndex:t?-1:0,role:"separator","aria-label":this.props.ariaLabel,"aria-valuenow":this.ariaValueNow,"aria-orientation":n?"vertical":void 0,"aria-keyshortcuts":"ArrowLeft ArrowRight ArrowUp ArrowDown",className:c,style:{touchAction:"none"},onFocus:this.onFocus,onBlur:this.onBlur,onDoubleClick:this.onToggle,onKeyDown:this.onKeyDown},this.props.prev.collapsible&&m.createElement("div",{className:"k-collapse-prev",onClick:this.onPrevToggle},m.createElement(r.IconWrap,{name:a,icon:i,size:"xsmall"})),m.createElement("div",{className:"k-resize-handle","aria-hidden":"true"}),this.props.next.collapsible&&m.createElement("div",{className:"k-collapse-next",onClick:this.onNextToggle},m.createElement(r.IconWrap,{name:o,icon:l,size:"xsmall"}))))}};const pe=r.withIdHOC(Q),he=m.forwardRef((e,t)=>{const[n,a]=r.useMergedRef(t);return r.useWebMcpRegister("menu",n,e,e.webMcp),m.createElement(pe,{...e,ref:a})});he.displayName="KendoReactMenu";const fe=()=>null;fe.propTypes={disabled:n.bool,contentClassName:n.string,children:n.oneOfType([n.element,n.node]),title:n.oneOfType([n.string,n.element,n.node])},fe.displayName="TabStripTab";const be=m.forwardRef((e,t)=>{const{id:n,children:a,title:i=ge.title,uniquePrivateKey:o,disabled:c,selected:d,focused:u,expanded:p,className:h,level:f,headerClassName:b,animation:g,keepItemsMounted:v,onSelect:y,imageUrl:k,icon:I,svgIcon:N,iconClass:E}=e,x=m.useRef({props:e}),C=m.useRef(null);m.useImperativeHandle(x,()=>({props:e})),m.useImperativeHandle(t,()=>x.current);const[w,R]=m.useState(p||!1),S=m.useCallback(()=>{y&&!c&&y({uniquePrivateKey:o,id:n,target:x.current})},[y,c,o,n]),T=m.useCallback(e=>v?m.cloneElement(e,{...e.props,in:p}):e,[v,p]),D=m.useCallback(()=>{v&&R(!0)},[v]),O=m.useCallback(()=>{v&&R(!1)},[v]),M={role:"treeitem","aria-disabled":c,"aria-selected":!c&&d,"aria-expanded":a?!c&&p:void 0},P=r.classNames("k-panelbar-item",{"k-panelbar-header":0===f,"k-expanded":p&&!!a,"k-disabled":c},`k-level-${f}`,h),z=r.classNames("k-link",{"k-selected":!c&&d,"k-focus":u},b),L=function({imageUrl:e,icon:t,svgIcon:n,iconClass:a}){return e?m.createElement("img",{role:"presentation",className:"k-panelbar-item-icon k-image",src:e}):t||n?m.createElement(r.IconWrap,{className:"k-panelbar-item-icon",name:t,icon:n}):a?m.createElement("span",{role:"presentation",className:"k-panelbar-item-icon "+a}):null}({imageUrl:k,icon:I,svgIcon:N,iconClass:E}),A=!c&&a?m.createElement(r.IconWrap,{name:p?"chevron-up":"chevron-down",icon:p?s.chevronUpIcon:s.chevronDownIcon,className:r.classNames("k-panelbar-toggle",p?"k-panelbar-collapse":"k-panelbar-expand")}):null;let F=!1;a&&a[0]&&Array.isArray(a)&&(F=a[0].type===be);const K=v&&!w?"none":"block",B=!c&&p||v?F?m.createElement("ul",{role:"group",className:"k-panelbar-group",style:{display:K}},a):a:null,$=void 0!==g&&!g||c||!a?B:m.createElement(l.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,key:o+"_animation",style:{display:"block"},children:B,childFactory:v?T:void 0,unmountOnExit:!v,onBeforeEnter:D,onAfterExited:O});return m.createElement("li",{ref:C,id:n,className:P,...M},m.createElement("span",{className:z,onClick:S},L,m.createElement("span",{className:"k-panelbar-item-text"},i),A),$)}),ge={title:"Untitled"};be.propTypes={animation:n.bool,children:n.any,className:n.string,icon:n.string,iconClass:n.string,imageUrl:n.string,svgIcon:r.svgIconPropType,expanded:n.bool,disabled:n.bool,onSelect:n.func,selected:n.bool,level:n.number,title:n.oneOfType([n.string,n.element]),id:n.oneOfType([n.string,n.number]),focused:n.bool,keepItemsMounted:n.bool},be.displayName="KendoReactPanelBarItem";var ve=(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))(ve||{});const ye=e=>"object"!=typeof e||!("type"in e)||e.type!==be,ke=({animation:e=!0,keepItemsMounted:t=!1,state:n,expanded:r,handleSelect:a,children:s,parentExpanded:i=!0,level:o=0,parentPrivateKey:l=[],activeDescendantRef:c})=>{const d=m.Children.toArray(s).filter(ye),u=d.length?d:s;return m.Children.map(u,(s,d)=>{if(s&&s.type===be){let u;const p=Ee(s,l,d);if(s.props.children){const i={animation:e,keepItemsMounted:t,state:n,expanded:r,handleSelect:a,children:s.props.children,parentExpanded:(r||[]).indexOf(p)>-1,level:o+1,parentPrivateKey:[...l,p],activeDescendantRef:c};u=ke(i)}const h=s.props.id||`k-panelbar-item-default-${p}`;return c&&n.wrapperFocused&&n.focused===p&&(c.current=h),m.cloneElement(s,{...s.props,animation:void 0!==s.props.animation?s.props.animation:e,keepItemsMounted:t,id:h,uniquePrivateKey:p,parentUniquePrivateKey:l,parentExpanded:i,level:o,expanded:(r||[]).indexOf(p)>-1,focused:n.focused===p&&n.wrapperFocused,selected:n.selected===p,children:u,onSelect:a})}return m.createElement("div",{className:"k-panelbar-content","aria-hidden":i?void 0:"true"},s)})},Ie=e=>{const t=m.Children.toArray(e.children)[0];return t?Ee(t,[],0):""},Ne=(e,t,n={expanded:e.expanded||[],selected:e.selected||"",focused:e.focused||"",wrapperFocused:!1},r=!0,a=[])=>(m.Children.map(e.children,(e,s)=>{if(e&&e.type===be){const i=Ee(e,a,s);!e.props.disabled&&r&&(e.props.selected&&(n.selected=i),e.props.focused&&(n.focused=i),e.props.expanded&&("multiple"===t?n.expanded.push(i):"single"===t&&(n.expanded=[i])),e.props.children&&(n=Ne(e.props,t,n,!!e.props.expanded,[...a,i])))}}),n),Ee=(e,t,n)=>e&&e.props&&e.props.id?e.props.id:t.length?t[t.length-1]+`.${n}`:`.${n}`;function xe(e,t=[]){return m.Children.forEach(e,e=>{e&&e.props&&!e.props.disabled&&(t.push(e),e.props.children&&xe(e.props.children,t))}),t}function Ce(e,t=[]){return m.Children.forEach(e,e=>{e&&e.props&&(e.props.expanded||e.props.parentExpanded)&&(t.push(e),e.props.children&&Ce(e.props.children,t))}),t}e.PanelBarUtils=void 0,(e=>{e.mapItemsToComponents=function e(t){return t.map((t,n)=>{let r;return t.content&&(r=t.content),t.children&&(r=e(t.children)),m.createElement(be,{...t,children:r,key:t.id||n})})}})(e.PanelBarUtils||(e.PanelBarUtils={}));const we=(e,t)=>e.length===t.length&&e.every((e,n)=>e===t[n]),Re=(e,t,n,r,a)=>{let s;if(a===ve.First||a===ve.Last)switch(a){case ve.First:s=e[0];break;case ve.Last:s=e[e.length-1]}else e.forEach((a,i)=>{if(a.props.uniquePrivateKey===(n.uniquePrivateKey||r)){const n=i+t<0?e.length-1:i+t>e.length-1?0:i+t;s=e[n]}});return s},Se=e=>{const{animation:t=!0,children:n,dir:a,selected:s,expanded:i,expandMode:o="multiple",className:l,keepItemsMounted:c=!1,onSelect:d,style:u,isControlled:p}=e,h=m.useRef(null),f=m.useRef(null),b=m.useRef(void 0),g=m.useRef(null);r.useWebMcpRegister("panelbar",f,e,e.webMcp);const[v,y]=m.useState(()=>{const t=Ne(e,o||"multiple");return t.focused||(t.focused=Ie(e)),t}),k=o||"multiple",I=void 0!==s?s:v.selected,N=p?i||[]:v.expanded,E=m.useCallback(e=>{g.current=window.setTimeout(()=>e())},[]),x=m.useCallback(e=>{const t=R;let n,r;switch(xe(m.Children.toArray(t)).forEach(t=>{t.props.uniquePrivateKey===(e.uniquePrivateKey||v.focused)&&(n=t)}),k){case"single":r=[...n.props.parentUniquePrivateKey,n.props.uniquePrivateKey],we(N,r)&&(r=n.props.parentUniquePrivateKey?[...n.props.parentUniquePrivateKey]:[]);break;case"multiple":{r=N.slice();const e=r.indexOf(n.props.uniquePrivateKey);-1===e?r.push(n.props.uniquePrivateKey):r.splice(e,1);break}default:r=N.slice()}y(e=>({...e,selected:n.props.uniquePrivateKey,expanded:r})),d&&d({target:n,expandedItems:r})},[n,v.focused,k,N,d]),C=m.useCallback((e,t=0,n)=>{const r=R,a=Ce(m.Children.toArray(r)),s=Re(a,t,e,v.focused,n);if(s){const e=N.slice();if(n===ve.Right&&s&&s.props&&s.props.children&&s.props.children.length>0){if(e.push(s.props.uniquePrivateKey),y(t=>({...t,expanded:[...new Set(e)]})),s.props.expanded){const e=s.props.children[0];y(t=>({...t,focused:e.props.uniquePrivateKey}))}}else if(n===ve.Left&&(s&&s.props&&s.props.parentUniquePrivateKey&&s.props.parentUniquePrivateKey.length>0||s&&s.props&&!s.props.disabled&&s.props.children&&s.props.children.length>0)){const t=s.props.parentUniquePrivateKey;if(s.props.expanded){const t=s.props.uniquePrivateKey,n=e.indexOf(t);e.splice(n,1),y(t=>({...t,expanded:e}))}else if(s.props.level>0){const e=s.props.parentUniquePrivateKey[t.length-1];y(t=>({...t,focused:e}))}}else y(e=>({...e,focused:s.props.uniquePrivateKey}))}},[n,v.focused,N]),w=m.useCallback(e=>{x(e),C(e)},[x,C]),R=m.useMemo(()=>ke({animation:t,keepItemsMounted:c,state:{...v,selected:I},expanded:N,handleSelect:w,children:n,activeDescendantRef:b}),[t,c,v,I,N,n,w]),S=m.useCallback((e,t)=>{let n;switch(t){case ve.First:C(e,n,ve.First);break;case ve.Last:C(e,n,ve.Last);break;case ve.Left:C(e,n,ve.Left);break;case ve.Right:C(e,n,ve.Right);break;case ve.Previous:n=-1,C(e,n);break;case ve.Next:n=1,C(e,n);break;case ve.Toggle:x(e)}},[C,x]),T=m.useCallback(()=>{clearTimeout(g.current),v.wrapperFocused||y(e=>({...e,wrapperFocused:!0}))},[v.wrapperFocused]),D=m.useCallback(()=>{E(()=>{y(e=>({...e,wrapperFocused:!1}))})},[E]),O=m.useCallback(e=>{const t=h.current&&"rtl"===getComputedStyle(h.current).direction||!1;if(e.target===e.currentTarget){let n;switch(e.keyCode){case r.Keys.left:n=t?ve.Right:ve.Left;break;case r.Keys.up:n=ve.Previous;break;case r.Keys.right:n=t?ve.Left:ve.Right;break;case r.Keys.down:n=ve.Next;break;case r.Keys.home:n=ve.First;break;case r.Keys.end:n=ve.Last;break;case r.Keys.space:case r.Keys.enter:n=ve.Toggle;break;default:n=null}null!==n&&(e.preventDefault(),S(e,n))}},[S]);m.useEffect(()=>()=>{g.current&&clearTimeout(g.current)},[]);const M={"aria-activedescendant":b.current},P=r.classNames("k-panelbar",l);return m.createElement("ul",{ref:h,dir:a,role:"tree",tabIndex:0,onKeyDown:O,onFocus:T,onBlur:D,className:P,style:u,...M},R)};Se.propTypes={children:n.oneOfType([n.arrayOf(function(e,t){return e[t].type!==be?new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem."):null}),function(e,t){const n=e[t];return n&&n.type!==be?new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem."):null}]),selected:n.string,expandMode(e,t){const n=e[t];return"single"!==n&&"multiple"!==n&&"default"!==n?new Error(`Invalid value '${n}' given to '${t}'. It must be either 'single', 'multiple' or 'default'.`):null},animation:n.bool,keepItemsMounted:n.bool,onSelect:n.func},Se.defaultProps={expandMode:"multiple",animation:!0,keepItemsMounted:!1};class Te extends m.Component{render(){const{id:e,size:t,collapsed:n,overlay:a,containsSplitter:s,collapsible:i,resizable:o,scrollable:l,keepMounted:c,style:d,className:u}=this.props,p=t&&t.length>0,h={flexBasis:t,...d},f=r.classNames("k-pane",{"k-hidden":n,hidden:n,"k-pane-flex":s,"k-pane-static":!o&&!i||p,"k-scrollable":l},u);return m.createElement("div",{id:e,role:"group",style:h,className:f},!n||c?this.props.children:void 0,a?m.createElement("div",{className:"k-splitter-overlay k-overlay"}):void 0)}}const De=Object.freeze({name:"@progress/kendo-react-layout",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"15.0.0",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),Oe="splitBarLabel",Me={[Oe]:"split bar"},Pe={collapsible:!1,collapsed:!1,resizable:!0,scrollable:!0},ze=class extends m.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 n=this.orientation,{dragIndex:r,isDragging:a}=this.state,s=[];for(let i=0;i<t.length;i++){let o=!1;const l=t[i];m.isValidElement(l)&&(o="Splitter"===l.type.displayName);let c=!1;a&&void 0!==r&&(c=r===i||r+1===i),s.push({...Pe,orientation:n,containsSplitter:o,overlay:c,...(e||[])[i]})}return s},this.mapSplitterPanes=(e,t)=>{const n=o.provideLocalizationService(this).toLanguageString(Oe,Me[Oe]);return e.map((r,a)=>{let s;const i=2*a,o=i+1;if(a+1<e.length){const t=e[a+1];s=m.createElement(me,{key:o,index:a,orientation:r.orientation,prev:r,next:t,ariaLabel:n,onDrag:this.onBarDragResize,onToggle:this.onBarToggle,onKeyboardResize:this.onBarKeyboardResize,isRtl:this.isRtl})}return[m.createElement(Te,{key:i,...r},t[a]),s]})},this.onBarToggle=(e,t)=>{const n=this.panesOptions(this.panesContent).map((t,n)=>{const r=this.getPaneProps(t);return n===e?{...r,collapsed:!t.collapsed}:{...r}});this.props.onChange&&this.props.onChange({newState:n,isLast:!0,nativeEvent:t})},this.onBarDragResize=(e,t,n,r,a)=>{const s=(new Date).getTime(),{pageX:i,pageY:o}=e,{prevElement:l,nextElement:c}=this.surroudingPanes(t);if(!l||!c)return;if(r)return void this.setState({isDragging:!0,dragIndex:n,startTime:s,originalX:i,originalY:o,originalPrevSize:this.elementSize(l),originalNextSize:this.elementSize(c)});const{originalPrevSize:d,originalNextSize:u,startTime:m,originalX:p,originalY:h}=this.state;if(!r&&s-m<150)return void(a&&this.resetDragState());let f;f="vertical"===this.orientation?o-h:this.isRtl?p-i:i-p,this.resize(n,n+1,d,u,f,a,e),a&&this.resetDragState()},this.onBarKeyboardResize=(e,t,n,r)=>{const{prevElement:a,nextElement:s}=this.surroudingPanes(e),i=this.elementSize(a),o=this.elementSize(s);this.resize(t,t+1,i,o,n,!0,r)},this.containerSize=()=>this._container?this.elementSize(this._container,!0):0,this.panesOptions=e=>this.mapPaneOptions(this.panes,e),this.elementSize=(e,t)=>{const n=t?"client":"offset";return"vertical"===this.orientation?e[`${n}Height`]:e[`${n}Width`]},this.clamp=(e,t,n)=>Math.min(t,Math.max(e,n)),this.fixedSize=e=>e&&e.length>0,this.showLicenseWatermark=!r.validatePackage(De,{component:"Splitter"}),this.licenseMessage=r.getLicenseMessage(De),this.state={isDragging:!1,dragIndex:void 0,startTime:0,originalX:0,originalY:0,originalPrevSize:0,originalNextSize:0,panes:e.defaultPanes||[]}}get isControlledState(){return void 0!==this.props.panes}get panes(){return void 0!==this.panesDuringOnChange?this.panesDuringOnChange:this.isControlledState?this.props.panes:this.state.panes}get orientation(){return this.props.orientation||"horizontal"}get isRtl(){return this._container&&"rtl"===getComputedStyle(this._container).direction||!1}get panesContent(){return m.Children.toArray(this.props.children).filter(e=>e)}render(){const e=this.panesContent,t=this.panesOptions(e),n=r.classNames("k-splitter","k-splitter-flex",`k-splitter-${this.orientation}`,this.props.className);return this.validatePanes(t),m.createElement("div",{id:this.props.id,style:this.props.style,ref:e=>{this._container=e},className:n},this.mapSplitterPanes(t,e),this.showLicenseWatermark&&m.createElement(r.WatermarkOverlay,{message:this.licenseMessage}))}surroudingPanes(e){return{prevElement:e.previousElementSibling,nextElement:e.nextElementSibling}}isPercent(e){return/%$/.test(e)}toPixels(e,t){let n=parseInt(e,10);return this.isPercent(e)&&(n=t*n/100),n}resetDragState(){this.setState({isDragging:!1,dragIndex:void 0,startTime:0,originalX:0,originalY:0,originalPrevSize:0,originalNextSize:0})}resize(e,t,n,r,a,s,i){const o=this.panesOptions(this.panesContent),l=o[e],c=o[t],d=n+r,u=this.containerSize(),m=e=>this.toPixels(e,u),p={index:e,initialSize:n,min:m(l.min)||d-m(c.max)||0,max:m(l.max)||d-m(c.min)||d},h={index:t,initialSize:r,min:m(c.min)||d-m(l.max)||0,max:m(c.max)||d-m(l.min)||d},f=(e,t)=>{const n=o[e.index],r=this.clamp(e.min,e.max,e.initialSize+t);return this.isPercent(n.size||"")?100*r/u+"%":r+"px"};let b,g;this.fixedSize(l.size)&&this.fixedSize(c.size)?(b=f(p,a),g=f(h,-a)):c.collapsible||this.fixedSize(c.size)?g=f(h,-a):b=f(p,a);const v=o.map((n,r)=>{const a=this.getPaneProps(n);return r===e?{...a,size:b}:r===t?{...a,size:g}:{...a}});this.panesDuringOnChange=v,this.isControlledState||this.setState({panes:v}),this.props.onChange&&this.props.onChange({newState:v,isLast:s,nativeEvent:i}),this.panesDuringOnChange=void 0}getPaneProps(e){const{orientation:t,overlay:n,containsSplitter:r,...a}=e;return a}};ze.displayName="Splitter";let Le=ze;var Ae=(e=>(e.TEXT="text",e.IMAGE="image",e.ICON="icon",e))(Ae||{}),Fe=(e=>(e.HORIZONTAL="horizontal",e.VERTICAL="vertical",e))(Fe||{}),Ke=(e=>(e.DEFAULT="default",e.primary="primary",e.INFO="info",e.SUCCESS="success",e.WARNING="warning",e.ERROR="error",e))(Ke||{}),Be=(e=>(e.START="start",e.CENTER="center",e.END="end",e.STRETCHED="stretched",e))(Be||{});const $e=m.forwardRef((e,t)=>{const{children:n,dir:a,style:s,className:i,type:o=He.type,orientation:l=He.orientation,...c}=e,d=m.useRef(null),u=m.useRef(null);return m.useImperativeHandle(d,()=>({element:u.current,props:e})),m.useImperativeHandle(t,()=>d.current),m.createElement("div",{dir:a,style:s,ref:u,className:r.classNames("k-card",i,{[`k-card-${o}`]:o!==Ke.DEFAULT},null===l?void 0:l!==Fe.HORIZONTAL?"k-card-vertical":"k-card-horizontal"),...c},n)});$e.displayName="KendoReactCard",$e.propTypes={children:n.node,className:n.string,dir:n.string,orientation:n.oneOf(["horizontal","vertical"]),style:n.object,type:n.oneOf(["default","primary","info","success","warning","error"])};const He={type:Ke.DEFAULT,orientation:Fe.VERTICAL},je=e=>m.createElement("div",{style:e.style,className:r.classNames("k-card-header",e.className)},e.children);je.propTypes={className:n.string};const We=e=>m.createElement("div",{style:e.style,className:r.classNames("k-card-title",e.className)},e.children);We.propTypes={className:n.string};const qe=e=>m.createElement("div",{style:e.style,className:r.classNames("k-card-body",e.className)},e.chi