UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

3 lines 17.6 kB
/* @license */ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`kendo.resizable.min.js`),require(`kendo.icons.min.js`)):typeof define==`function`&&define.amd?define([`exports`,`kendo.resizable.min`,`kendo.icons.min`],t):(e=typeof globalThis<`u`?globalThis:e||self,t((e.kendo=e.kendo||{},e.kendo._globals=e.kendo._globals||{},e.kendo._globals.Splitter={}),e.kendo._globals.Resizable,e.kendo._globals.Icons))})(this,function(e,t,n){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let r={id:`splitter`,name:`Splitter`,category:`web`,description:`The Splitter widget provides an easy way to create a dynamic layout of resizable and collapsible panes.`,depends:[`resizable`,`icons`]};(function(e,t){var n=window.kendo,r=n.ui,i=n.keys,a=e.extend,o=r.Widget,s=/^\d+(\.\d+)?px$/i,c=/^\d+(\.\d+)?%$/i,l=`.kendoSplitter`,u=`expand`,d=`collapse`,f=`contentLoad`,p=`error`,m=`resize`,h=`resizing`,g=`layoutChange`,_=`horizontal`,v=`vertical`,y=`mouseenter`,b=`click`,x=`pane`,S=`mouseleave`,C=`k-focus`,w=`k-`+x,T=`.`+w,E=`k-scrollable`,D=`tabindex`,O=`aria-valuemin`,k=`aria-valuemax`,A=`aria-valuenow`,j=`aria-controls`,M=`aria-label`,N=`aria-labelledby`,P=`aria-orientation`,F=`k-pane-static`,I=`k-splitter`,L=`k-splitbar`,ee=`k-splitter-flex`,R=`flex-basis`,_=`horizontal`,v=`vertical`,z=`k-hidden`,B=2**53-1,w=`k-pane`,V=`k-pane-flex`,b=`click`,m=`resize`,H=`px`;function U(e){return c.test(e)}function W(e){return s.test(e)||/^\d+$/.test(e)}function G(e){return!U(e)&&!W(e)}function K(e,t){var n=parseInt(e,10);return U(e)&&(n=Math.floor(n*t/100)),n}function q(e,t){return function(n,r){var i=this.element.find(n).data(x);if(arguments.length==1)return i[e];((this.options.panes||[]).find(e=>e.uid==i.uid)||{})[e]=r,i[e]=r,i.isFluid=G(i.size),t&&this.element.data(`kendo`+this.options.name).resize(!0)}}var J=o.extend({init:function(e,t){var r=this,a;o.fn.init.call(r,e,t),r.wrapper=r.element,r.options.orientation&&(a=r.options.orientation.toLowerCase()!=v),r.orientation=a?_:v,r._dimension=a?`width`:`height`,r._keys={decrease:a?i.LEFT:i.UP,increase:a?i.RIGHT:i.DOWN},r._resizeStep=10,r._marker=n.guid().substring(0,8),r.element.addClass(`${I} ${ee} ${I}-${r.orientation}`),r.element.closest(w).removeClass(F).addClass(V),r._initPanes(),r.resizing=new $(r),r.element.triggerHandler(`init`+l)},events:[u,d,f,p,m,h,g],_addOverlays:function(){this._panes().append(`<div class='k-splitter-overlay k-overlay' />`)},_removeOverlays:function(){this._panes().children(`.k-splitter-overlay`).remove()},_attachEvents:function(){var t=this,n=t.options.orientation;t.element.children(`.k-splitbar-draggable-`+n).on(`keydown`+l,t._keydown.bind(t)).on(`mousedown`+l,function(e){e.currentTarget.focus({preventScroll:!0})}).on(`focus`+l,function(t){e(t.currentTarget).addClass(C)}).on(`blur`+l,function(n){e(n.currentTarget).removeClass(C),t.resizing&&t.resizing.end()}).on(y+l,function(){e(this).addClass(`k-splitbar-`+t.orientation+`-hover`)}).on(S+l,function(){e(this).removeClass(`k-splitbar-`+t.orientation+`-hover`)}).on(`mousedown`+l,t._addOverlays.bind(t)).end().children(`.k-splitbar`).on(`dblclick`+l,t._togglePane.bind(t)).children(`.k-collapse-next, .k-collapse-prev`).on(b+l,t._arrowClick(d)).end().children(`.k-expand-next, .k-expand-prev`).on(b+l,t._arrowClick(u)).end().end(),e(window).on(`resize`+l+t._marker,t.resize.bind(t,!1)),e(document).on(`mouseup`+l+t._marker,t._removeOverlays.bind(t))},_detachEvents:function(){var t=this;t.element.children(`.k-splitbar-draggable-`+t.orientation).off(l).end().children(`.k-splitbar`).off(`dblclick`+l).children(`.k-collapse-next, .k-collapse-prev, .k-expand-next, .k-expand-prev`).off(l),e(window).off(l+t._marker),e(document).off(l+t._marker)},options:{name:`Splitter`,clickMoveClick:!0,orientation:_,panes:[]},destroy:function(){o.fn.destroy.call(this),this._detachEvents(),this.resizing&&this.resizing.destroy(),n.destroy(this.element),this.wrapper=this.element=null},_keydown:function(t){var n=this,r=t.keyCode,a=n.resizing,o=e(t.currentTarget),s=n._keys,c=r===s.increase,l=r===s.decrease,f;c||l?(t.ctrlKey?(f=o[l?`next`:`prev`](),a&&a.isResizing()&&a.end(),f[n._dimension]()?n._triggerAction(d,o[l?`prev`:`next`]()):n._triggerAction(u,f)):a&&a.move((l?-1:1)*n._resizeStep,o),t.preventDefault()):r===i.HOME?(f=o.prev(),n.collapse(f),t.preventDefault()):r===i.END?(f=o.prev(),n.expand(f),t.preventDefault()):r===i.ENTER&&a&&(a.end(),t.preventDefault(),n._togglePane(t))},_initPanes:function(){var t=this.options.panes||[],n=this;this.element.children().each(function(r,i){i.nodeName.toLowerCase()!=`script`&&(t[r]=e.extend(n._getDefaultPaneConfig(),t[r],{order:r*2}),t[r].isFluid=G(t[r].size),i.style.order=r*2,n._initPane(i,t[r]))}),this.resize()},_getDefaultPaneConfig:function(){return{scrollable:!0,resizable:!0,size:`auto`,uid:n.guid()}},_updatePaneOrderStyles:function(t){e(t||this.element).children().each(function(e,t){if(t.nodeName.toLowerCase()!=`script`){let n=t.data(x);n.order=e*2,t.style.order=e*2}})},_initPane:function(t,n){n=e.extend({},this._getDefaultPaneConfig(),n),n.fixedSize=n.size&&n.size!==`auto`,t=e(t).attr(`role`,`group`).attr(`data-uid`,n.uid).addClass(w);let r=!n.resizable&&!n.collapsible||n.fixedSize;t.css(R,n.size).data(x,n).toggleClass(F,!!r).toggleClass(E,!!n.scrollable),this.ajaxRequest(t)},ajaxRequest:function(e,t,r){var i=this,a;e=i.element.find(e),a=e.data(x),t||=a.contentUrl,t&&(e.append(`<span class='k-icon k-i-loading k-pane-loading' />`),n.isLocalUrl(t)?jQuery.ajax({url:t,data:r||{},type:`GET`,dataType:`html`,success:function(t){e.html(t),i.trigger(f,{pane:e[0]})},error:function(t,n){i.trigger(p,{pane:e[0],status:n,xhr:t})}}):e.removeClass(E).html(`<iframe src='`+t+`' frameborder='0' class='k-content-frame'>This page requires frames in order to show content</iframe>`))},_triggerAction:function(e,t){var n=t.data(x),r=n.collapsed&&e==u||!n.collapsed&&e==d;n.collapsible&&(r&&!this.trigger(e,{pane:t[0]})&&this[e](t[0]),this.resizing.stop(),this.resizing.end())},_togglePane:function(t){var n=this,r=e(t.target),i;r.closest(`.k-splitter`)[0]==n.element[0]&&(i=r.children(`span:not(.k-resize-handle)`),i.length===1&&(i.is(`.k-collapse-prev`)?n._triggerAction(d,r.prev()):i.is(`.k-collapse-next`)?n._triggerAction(d,r.next()):i.is(`.k-expand-prev`)?n._triggerAction(u,r.prev()):i.is(`.k-expand-next`)&&n._triggerAction(u,r.next()),n.resizing?.end()))},_arrowClick:function(t){var n=this;return function(r){var i=e(r.currentTarget),a;i.closest(`.k-splitter`)[0]==n.element[0]&&(a=i.is(`.k-`+t+`-prev`)?i.parent().prev():i.parent().next(),n._triggerAction(t,a))}},_updatePaneOrders:function(){this._getPaneElements().forEach((t,n)=>{var r=e(t).data(x);r&&(r.order=n*2,t.style.order=n*2)})},_updateSplitBar:function(e,t,i,a){var o=function(e,t,n){var i=t?r.icon({icon:t,size:`xsmall`}):``;return n?`<span class='k-`+e+`'>`+i+`</span>`:``},s=this.orientation,c=t.resizable!==!1&&i.resizable!==!1,l=t.collapsible,u=t.collapsed,d=i.collapsible,f=i.collapsed,p=a.attr(`id`);p||(p=n.guid(),a.attr(`id`,p));let m=n.support.isRtl(e),h=m?`caret-alt-right`:`caret-alt-left`,g=m?`caret-alt-left`:`caret-alt-right`;e.addClass(`k-splitbar k-splitbar-`+s).attr(`role`,`separator`).attr(O,`0`).attr(k,`100`).attr(j,p).removeClass(`k-splitbar-`+s+`-hover`).toggleClass(`k-splitbar-draggable-`+s,c&&!u&&!f).toggleClass(`k-splitbar-static-`+s,!c&&!l&&!d).html(o(`collapse-prev`,`caret-alt-up`,l&&!u&&!f&&s==v)+o(`collapse-prev`,h,l&&!u&&!f&&s==_)+o(`expand-prev`,`caret-alt-down`,l&&u&&!f&&s==v)+o(`expand-prev`,g,l&&u&&!f&&s==_)+o(`resize-handle`,null,c&&s==v)+o(`resize-handle`,null,c&&s==_)+o(`collapse-next`,`caret-alt-down`,d&&!f&&!u&&s==v)+o(`collapse-next`,g,d&&!f&&!u&&s==_)+o(`expand-next`,`caret-alt-up`,d&&f&&!u&&s==v)+o(`expand-next`,h,d&&f&&!u&&s==_)),t.labelId?e.attr(N,t.labelId):t.label&&e.attr(M,t.label),s==_&&e.attr(P,v),!c&&!l&&!d&&e.removeAttr(D)},_updateSplitBars:function(){var t=this;this.element.children(`.k-splitbar`).each(function(){var n=e(this),r=n.prevAll(T).first(),i=r.data(x),a=n.nextAll(T).first().data(x);n.css(`order`,i.order+1),a&&t._updateSplitBar(n,i,a,r)})},_removeSplitBars:function(){this.element.children(`.k-splitbar`).remove()},_panes:function(){return this.element?this.element.children(T):e()},_resetAriaValueNow:function(e,t){var n,r,i,a;for(n=0;n<e.length;n++)a=t[n]+t[n+1]||1,i=Math.round(t[n]/a*100),r=e[n],r.setAttribute(A,i)},_resize:function(){var t=this,r=t.element,i=r.children(T),a=t.orientation==_,o=r.children(`.k-splitbar`),s=o.length,c=a?`width`:`height`,l=r[c](),u=[];if(t.wrapper.addClass(`k-splitter-resizing`),!t._suppressResize){s===0?(s=i.length-1,i.slice(0,s).after(`<div tabindex='0' class='k-splitbar' data-marker='`+t._marker+`' />`),t._updateSplitBars(),o=r.children(`.k-splitbar`)):t._updateSplitBars(),o.each(function(){l-=this[a?`offsetWidth`:`offsetHeight`]});var d=0,f=0,p=e();i.each(function(){var t=e(this),n=t.data(x)||{},r;if(t.removeClass(`k-collapsed`),n.collapsed)r=n.collapsedSize?K(n.collapsedSize,l):0,t.css(`overflow`,`hidden`).addClass(`k-collapsed`);else if(n.isFluid||G(n.size)){p=p.add(this),u.push(!1);return}else r=K(n.size,l);return f++,d+=r,u.push(r),t.css(c,``),t.css(R,r+H),r}),l-=d;var m=p.length,h=Math.floor(l/m);p.slice(0,m-1).css(R,h+H).end().eq(m-1).css(R,l-(m-1)*h+H),u.forEach(function(e,t){e===!1&&(u[t]=h)}),t._resetAriaValueNow(o,u);var v=a?`offsetWidth`:`offsetHeight`;if(m===0){var y=i.filter(function(){return!(e(this).data(x)||{}).collapsed}).last();if(y.length){let e=l+y[0][v];y.css(R,e+H)}}t._detachEvents(),t._attachEvents(),t.wrapper.removeClass(`k-splitter-resizing`),n.resize(i),t.trigger(g)}},toggle:function(e,n){var r=this,i;e=r.element.find(e),i=e.data(x),!(!n&&i?.collapsible!==!0)&&(arguments.length==1&&(n=i.collapsed===t?!1:i.collapsed),i.collapsed=!n,e.toggleClass(z,i.collapsed&&!i.collapsedSize),e.css(`overflow`,i.collapsed&&!i.collapsedSize?`hidden`:`auto`),r.resize(!0))},collapse:function(e){this.toggle(e,!1)},expand:function(e){this.toggle(e,!0)},_addPane:function(e,t,n){let r=this;return n.length&&(r.options.panes.splice(t,0,e),r._initPane(n,e),r._removeSplitBars(),r._updatePaneOrders(),r.resize(!0)),n},append:function(t){t||={};var n=this,r=e(`<div />`).appendTo(n.element);return n._addPane(t,n.options.panes.length,r)},insertBefore:function(t,n){n=e(n),t||={};var r=this,i=r.wrapper.children(`.k-pane`).index(n),a=e(`<div />`).insertBefore(e(n));return r._addPane(t,i,a)},insertAfter:function(t,n){n=e(n),t||={};var r=this,i=r.wrapper.children(`.k-pane`).index(n),a=e(`<div />`).insertAfter(e(n));return r._addPane(t,i+1,a)},remove:function(t){var r=this;return t=r.wrapper.find(t),t.length&&(n.destroy(t),t.each(function(t,n){r.options.panes.splice(r.wrapper.children(`.k-pane`).index(n),1),e(n).remove()}),r._removeSplitBars(),r.options.panes.length&&r.resize(!0)),r},size:q(`size`,!0),min:q(`min`),max:q(`max`),_getPaneElement:function(e){return this._getPaneElements()[e]},_getPaneElements:function(){let t=this;return Array.from(t.element.children()||[]).filter(t=>e(t).hasClass(`k-pane`)||e(t).hasClass(`k-splitter`))},_dragSplitterBar:function(e,t){let n=this,{leftPane:r,rightPane:i}=n._getAdjacentPanes(e),a=r.computedSize+t,o=a>r.min&&a<r.max,s=n._getPaneElements().filter(e=>!e.style[R]),c=(r.size||i.size)&&s.length>1;return r.size&&i.size||c?o&&(n._resizePane(r,t),n._resizePane(i,-t)):i.size?n._resizePane(i,-t):n._resizePane(r,t),{leftPane:r,rightPane:i}},_getAdjacentPanes:function(e){let t=this,n=e,r=e+1,i=t._getPaneElement(n),a=t._getPaneElement(r),o=t._getPane(n),s=t._getPane(r),c=t._getPaneOffsetSize(n),l=t._getPaneOffsetSize(r),u=c+l,d=t._getElementClientSize(t.element,t.options.orientation),f=e=>t._calculatePixelSize(e,d),{leftPaneMaxSize:p,rightPaneMaxSize:m}=t._getAdjacentPanesMaxSize(n,r),h=f(s&&s.max),g=f(o&&o.max);return{leftPane:{index:n,computedSize:c,min:f(o&&o.min)||(h?u-h:0)||0,max:p,size:i.style[R],collapsible:o&&o.collapsible,uid:o.uid},rightPane:{index:r,computedSize:l,min:f(s&&s.min)||(g?u-g:0)||0,max:m,size:a.style[R],collapsible:s&&s.collapsible,uid:s.uid}}},_resizePane:function(e,t){let n=this,r=Z(e.computedSize+t,e.min,e.max),i=``;if(U(e.size)){let e=n._getElementClientSize(n.element,n.options.orientation);i=Y(100*r/e)}else i=X(r);e.size=i,e.isFluid=G(i),n._setPaneSize(e.index,i)},_allExpandedPanesHaveSize:function(){let e=this.options.panes.filter(e=>!e.collapsed);return e.length?e.filter(e=>e.size).length:!1},_setPaneSize:function(t,n){let r=this,i=r._getPaneElement(t);if(!i)return;r._allExpandedPanesHaveSize()||e(i).addClass(F),i.style[R]=n;let a=e(i).data(`pane`);a.size=n,a.isFluid=G(n),r.trigger(h,{pane:i})},_getPaneSizes:function(e){let t=this,n=t._getElementClientSize(t.element,t.options.orientation),r=t._getPane(e);return{size:t._getPaneOffsetSize(e),min:r&&r.min?t._calculatePixelSize(r.min,n):0,max:r&&r.max?t._calculatePixelSize(r.max,n):B}},_calculatePixelSize:function(e,t){let r=n.parseFloat(e);return U(e)&&(r=t*r),r},_getPaneOffsetSize:function(e){let t=this,n=t._getPaneElement(e);return t._getElementOffsetSize(n,t.options.orientation)},_getElementOffsetSize:function(e,t){if(!e)return 0;let n=e.getBoundingClientRect();return t===_?n.width:n.height},_getElementClientSize:function(e,t){return this._getElementSize(e,t,`client`)},_getElementSize:function(e,t,n){return e?(e=e[0],t===_?e[`${n}Width`]:e[`${n}Height`]):0},_getPane:function(e){return(this.options.panes||[])[e]},_getPaneIndex:function(e){return this.options.panes.indexOf(e)},_getAdjacentPanesMaxSize:function(e,t){let n=this,{size:r,min:i,max:a}=n._getPaneSizes(e),{size:o,min:s,max:c}=n._getPaneSizes(t),l=r+o;return{leftPaneMaxSize:Math.min(a,l-s),rightPaneMaxSize:Math.min(c,l-i)}},_getElementIndex:function(e,t){if(!e)return[].indexOf(e);let n=Array.from(e.parent().children());return t&&(n=n.filter(e=>e.matches(t))),Array.from(n).indexOf(e[0])}});r.plugin(J);function Y(e){return`${e}%`}function X(e){return n.parseFloat(e)+`px`}function Z(e,t,n){return Math.min(n,Math.max(t,e))}var Q={sizingProperty:`height`,sizingDomProperty:`offsetHeight`,alternateSizingProperty:`width`,positioningProperty:`top`,mousePositioningProperty:`pageY`},te={sizingProperty:`width`,sizingDomProperty:`offsetWidth`,alternateSizingProperty:`height`,positioningProperty:`left`,mousePositioningProperty:`pageX`};function $(e){var t=this,r=e.orientation,i=`.k-splitbar-draggable-`+r+`[data-marker=`+e._marker+`]`;e.options.clickMoveClick&&(i+=`,.k-ghost-splitbar`),t.owner=e,t._element=e.element,t.orientation=r,a(t,r===_?te:Q),t._resizable=new n.ui.Resizable(e.element,{orientation:r,handle:i,clickMoveClick:e.options.clickMoveClick,hint:t._createHint.bind(t),start:t._start.bind(t),max:t._max.bind(t),min:t._min.bind(t),invalidClass:`k-restricted-size-`+r,resize:t._resize.bind(t),resizeend:t._stop.bind(t)})}$.prototype={stop:function(){this._resizable._stop()},press:function(e){this._resizable.press(e),this.pressed=!0},move:function(e,t){if(!t.hasClass(`k-splitbar-draggable-horizontal`)&&!t.hasClass(`k-splitbar-draggable-vertical`))return;let n=this.owner._getElementIndex(t,`.${L}`),{leftPane:r,rightPane:i}=this.owner._dragSplitterBar(n,e);this.owner.trigger(m,{leftPane:r,rightPane:i})},end:function(){this._resizable.end(),this.pressed=!1},destroy:function(){this._resizable.destroy(),this._resizable=this._element=this.owner=null},isResizing:function(){return this._resizable.resizing},_createHint:function(t){var n=this;return e(`<div class='k-ghost-splitbar k-ghost-splitbar-`+n.orientation+`' />`).css(`z-index`,99).css(n.alternateSizingProperty,t[n.alternateSizingProperty]())},_start:function(t){var r=this,i=e(t.currentTarget);let a=n.support.isRtl(r._element),o=r.orientation===_?`offsetLeft`:`offsetTop`,s=r.owner._getElementIndex(i,`.${L}`),c=r.owner._getPaneElement(s),l=r.owner._getPaneElement(s+1),u=e(r.orientation===_&&a?l:c),d=e(r.orientation===_&&a?c:l);if(e(t.initialTarget).closest(`.k-expand-next, .k-expand-prev, .k-collapse-next, .k-collapse-prev`).length>0||!d.length||!u.length){t.preventDefault();return}var f=u.data(x),p=d.data(x),m=parseInt(u[0][o],10),h=parseInt(d[0][o],10)+d[0][r.sizingDomProperty]-i[0][r.sizingDomProperty],g=parseInt(r._element.css(r.sizingProperty),10),v=function(e){var t=parseInt(e,10);return(W(e)?t:g*t/100)||0};if(!f||!p){t.preventDefault(),t.sender.draggable.clickMoveClick.cancel(),r.owner.element.find(`.k-ghost-splitbar`).remove();return}var y=v(f.min),b=v(f.max)||h-m,S=v(p.min),C=v(p.max)||h-m;r.previousPane=u,r.nextPane=d,r._maxPosition=Math.min(h-S,m+b),r._minPosition=Math.max(m+y,h-C)},_max:function(){return this._maxPosition},_min:function(){return this._minPosition},_resize:function(e){let t=this,r=t.owner,i=r.orientation,a,o=this.owner,s=e.currentTarget||e.target;if(!s)return;let c=r._getElementIndex(s,`.${L}`),l=n.support.isRtl(t._element)?-1:1;a=i===_?e.x.delta*l:e.y.delta;let u=i===_?s.position().left:s.position().top,d=e.position;Math.abs(u-d)>2&&o._dragSplitterBar(c,a)},_stop:function(t){var r=this,i=e(t.currentTarget),a=r.owner;let o=n.support.isRtl(r._element);if(a._panes().children(`.k-splitter-overlay`).remove(),t.keyCode!==n.keys.ESC){let e=a.orientation===_?t.x.initialDelta:t.y.initialDelta,n=a.orientation===_?i.position().left:i.position().top,r=t.position,s=a.orientation===_&&o?-1:1,c=this.owner._getElementIndex(t.currentTarget,`.${L}`);Math.abs(n-r)>2&&a._dragSplitterBar(c,e*s);let{leftPane:l,rightPane:u}=a._getAdjacentPanes(c);a.trigger(m,{leftPane:l,rightPane:u})}return!1}}})(window.kendo.jQuery);var i=kendo;e.__meta__=r,e.default=i}); //# sourceMappingURL=kendo.splitter.min.js.map