@progress/kendo-react-layout 6.1.1-dev.202311151536 → 7.0.0-develop.1

package/dist/es/splitter/Splitter.js

@@ -1,383 +0,0 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import * as React from 'react';
-import { SplitterPane } from './SplitterPane';
-import { SplitterBar } from './SplitterBar';
-import { classNames } from '@progress/kendo-react-common';
-import { validatePackage } from '@progress/kendo-react-common';
-import { packageMetadata } from '../package-metadata';
-import { messages, splitBarLabel } from './messages';
-import { provideLocalizationService } from '@progress/kendo-react-intl';
-/**
- * @hidden
- */
-var PANE_DEFAULTS = {
-    collapsible: false,
-    collapsed: false,
-    resizable: true,
-    scrollable: true
-};
-/**
- * @hidden
- */
-var DOUBLE_CLICK_WAIT_TIME = 150;
-/**
- * Represents the [KendoReact Splitter component]({% slug overview_splitter %}).
- *
- * @example
- * ```jsx
- * class App extends React.Component {
- *    render() {
- *        return (
- *            <div>
- *                <Splitter
- *                    style={{height: 400}}
- *                    orientation={'vertical'}
- *                >
- *                    <div>Pane 1</div>
- *                    <div>Pane 2</div>
- *                    <div>Pane 3</div>
- *                </Splitter>
- *            </div>
- *        );
- *    }
- * }
- *
- * ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-var Splitter = /** @class */ (function (_super) {
-    __extends(Splitter, _super);
-    /**
-     * @hidden
-     */
-    function Splitter(props) {
-        var _this = _super.call(this, props) || this;
-        _this._container = null;
-        _this.validatePanes = function (panesOptions) {
-            var withoutSize = panesOptions.filter(function (pane) { return pane.size === undefined; });
-            if (!withoutSize.length) {
-                throw new Error('The Splitter should have at least one pane without a set size.');
-            }
-        };
-        _this.mapPaneOptions = function (panes, panesContent) {
-            var orientation = _this.orientation;
-            var _a = _this.state, dragIndex = _a.dragIndex, isDragging = _a.isDragging;
-            var paneOptions = [];
-            for (var index = 0; index < panesContent.length; index++) {
-                var containsSplitter = false;
-                var paneContent = panesContent[index];
-                if (React.isValidElement(paneContent)) {
-                    containsSplitter = paneContent.type.displayName === 'Splitter';
-                }
-                var overlay = false;
-                if (isDragging && dragIndex !== undefined) {
-                    overlay = dragIndex === index || dragIndex + 1 === index;
-                }
-                paneOptions.push(__assign(__assign(__assign({}, PANE_DEFAULTS), { orientation: orientation, containsSplitter: containsSplitter, overlay: overlay }), (panes || [])[index]));
-            }
-            return paneOptions;
-        };
-        _this.mapSplitterPanes = function (panes, panesContent) {
-            var ariaLabel = provideLocalizationService(_this).toLanguageString(splitBarLabel, messages[splitBarLabel]);
-            return panes.map(function (pane, index) {
-                var splitterBar;
-                var paneKey = index * 2;
-                var barKey = paneKey + 1;
-                if (index + 1 < panes.length) {
-                    var next = panes[index + 1];
-                    splitterBar = (React.createElement(SplitterBar, { key: barKey, index: index, orientation: pane.orientation, prev: pane, next: next, ariaLabel: ariaLabel, onDrag: _this.onBarDragResize, onToggle: _this.onBarToggle, onKeyboardResize: _this.onBarKeyboardResize, isRtl: _this.isRtl }));
-                }
-                var splitterPane = (React.createElement(SplitterPane, __assign({ key: paneKey }, pane), panesContent[index]));
-                return [splitterPane, splitterBar];
-            });
-        };
-        _this.onBarToggle = function (index, event) {
-            var panesOptions = _this.panesOptions(_this.panesContent);
-            var updatedState = panesOptions.map(function (pane, idx) {
-                var paneProps = _this.getPaneProps(pane);
-                if (idx === index) {
-                    return __assign(__assign({}, paneProps), { collapsed: !pane.collapsed });
-                }
-                else {
-                    return __assign({}, paneProps);
-                }
-            });
-            if (_this.props.onChange) {
-                _this.props.onChange({
-                    newState: updatedState,
-                    isLast: true,
-                    nativeEvent: event
-                });
-            }
-        };
-        _this.onBarDragResize = function (event, barElement, index, isFirst, isLast) {
-            var time = new Date().getTime();
-            var pageX = event.pageX, pageY = event.pageY;
-            var _a = _this.surroudingPanes(barElement), prevElement = _a.prevElement, nextElement = _a.nextElement;
-            if (!prevElement || !nextElement) {
-                return;
-            }
-            if (isFirst) {
-                _this.setState({
-                    isDragging: true,
-                    dragIndex: index,
-                    startTime: time,
-                    originalX: pageX,
-                    originalY: pageY,
-                    originalPrevSize: _this.elementSize(prevElement),
-                    originalNextSize: _this.elementSize(nextElement)
-                });
-                return;
-            }
-            var _b = _this.state, originalPrevSize = _b.originalPrevSize, originalNextSize = _b.originalNextSize, startTime = _b.startTime, originalX = _b.originalX, originalY = _b.originalY;
-            if (!isFirst && time - startTime < DOUBLE_CLICK_WAIT_TIME) {
-                if (isLast) {
-                    _this.resetDragState();
-                }
-                return;
-            }
-            var delta;
-            if (_this.orientation === 'vertical') {
-                delta = pageY - originalY;
-            }
-            else if (_this.isRtl) {
-                delta = originalX - pageX;
-            }
-            else {
-                delta = pageX - originalX;
-            }
-            _this.resize(index, index + 1, originalPrevSize, originalNextSize, delta, isLast, event);
-            if (isLast) {
-                _this.resetDragState();
-            }
-        };
-        _this.onBarKeyboardResize = function (barElement, index, delta, event) {
-            var _a = _this.surroudingPanes(barElement), prevElement = _a.prevElement, nextElement = _a.nextElement;
-            var originalPrevSize = _this.elementSize(prevElement);
-            var originalNextSize = _this.elementSize(nextElement);
-            _this.resize(index, index + 1, originalPrevSize, originalNextSize, delta, true, event);
-        };
-        _this.containerSize = function () {
-            if (!_this._container) {
-                return 0;
-            }
-            return _this.elementSize(_this._container, true);
-        };
-        _this.panesOptions = function (panesContent) {
-            return _this.mapPaneOptions(_this.panes, panesContent);
-        };
-        _this.elementSize = function (el, isContainer) {
-            var sizeType = isContainer ? 'client' : 'offset';
-            if (_this.orientation === 'vertical') {
-                return el["".concat(sizeType, "Height")];
-            }
-            else {
-                return el["".concat(sizeType, "Width")];
-            }
-        };
-        _this.clamp = function (min, max, v) { return Math.min(max, Math.max(min, v)); };
-        _this.fixedSize = function (size) { return size && size.length > 0; };
-        validatePackage(packageMetadata);
-        _this.state = {
-            isDragging: false,
-            dragIndex: undefined,
-            startTime: 0,
-            originalX: 0,
-            originalY: 0,
-            originalPrevSize: 0,
-            originalNextSize: 0,
-            panes: props.defaultPanes || []
-        };
-        return _this;
-    }
-    Object.defineProperty(Splitter.prototype, "isControlledState", {
-        get: function () {
-            return this.props.panes !== undefined;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Splitter.prototype, "panes", {
-        get: function () {
-            return this.panesDuringOnChange !== undefined ?
-                this.panesDuringOnChange :
-                (this.isControlledState ? this.props.panes : this.state.panes);
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Splitter.prototype, "orientation", {
-        get: function () {
-            return this.props.orientation || 'horizontal';
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Splitter.prototype, "isRtl", {
-        get: function () {
-            return this._container && (getComputedStyle(this._container).direction === 'rtl') || false;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Splitter.prototype, "panesContent", {
-        get: function () {
-            return React.Children.toArray(this.props.children).filter(function (c) { return c; });
-        },
-        enumerable: false,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    Splitter.prototype.render = function () {
-        var _this = this;
-        var panesContent = this.panesContent;
-        var panesOptions = this.panesOptions(panesContent);
-        var className = classNames('k-widget', 'k-splitter', 'k-splitter-flex', "k-splitter-".concat(this.orientation), this.props.className);
-        this.validatePanes(panesOptions);
-        return (React.createElement("div", { style: this.props.style, ref: function (ref) { return _this._container = ref; }, className: className }, this.mapSplitterPanes(panesOptions, panesContent)));
-    };
-    Splitter.prototype.surroudingPanes = function (barElement) {
-        return {
-            prevElement: barElement.previousElementSibling,
-            nextElement: barElement.nextElementSibling
-        };
-    };
-    Splitter.prototype.isPercent = function (size) {
-        return /%$/.test(size);
-    };
-    Splitter.prototype.toPixels = function (size, splitterSize) {
-        var result = parseInt(size, 10);
-        if (this.isPercent(size)) {
-            result = (splitterSize * result / 100);
-        }
-        return result;
-    };
-    Splitter.prototype.resetDragState = function () {
-        this.setState({
-            isDragging: false,
-            dragIndex: undefined,
-            startTime: 0,
-            originalX: 0,
-            originalY: 0,
-            originalPrevSize: 0,
-            originalNextSize: 0
-        });
-    };
-    Splitter.prototype.resize = function (prevIndex, nextIndex, originalPrevSize, originalNextSize, delta, isLast, event) {
-        var _this = this;
-        var panesOptions = this.panesOptions(this.panesContent);
-        var prevOptions = panesOptions[prevIndex];
-        var nextOptions = panesOptions[nextIndex];
-        var total = originalPrevSize + originalNextSize;
-        var splitterSize = this.containerSize();
-        var px = function (s) { return _this.toPixels(s, splitterSize); };
-        var prevDragState = {
-            index: prevIndex,
-            initialSize: originalPrevSize,
-            min: px(prevOptions.min) || total - px(nextOptions.max) || 0,
-            max: px(prevOptions.max) || total - px(nextOptions.min) || total
-        };
-        var nextDragState = {
-            index: nextIndex,
-            initialSize: originalNextSize,
-            min: px(nextOptions.min) || total - px(prevOptions.max) || 0,
-            max: px(nextOptions.max) || total - px(prevOptions.min) || total
-        };
-        var resize = function (paneState, change) {
-            var pane = panesOptions[paneState.index];
-            var newSize = _this.clamp(paneState.min, paneState.max, paneState.initialSize + change);
-            if (_this.isPercent(pane.size || '')) {
-                return 100 * newSize / splitterSize + '%';
-            }
-            else {
-                return newSize + 'px';
-            }
-        };
-        var prevSize;
-        var nextSize;
-        if (this.fixedSize(prevOptions.size) && this.fixedSize(nextOptions.size)) {
-            prevSize = resize(prevDragState, delta);
-            nextSize = resize(nextDragState, -delta);
-        }
-        else if (nextOptions.collapsible || this.fixedSize(nextOptions.size)) {
-            nextSize = resize(nextDragState, -delta);
-        }
-        else {
-            prevSize = resize(prevDragState, delta);
-        }
-        var updatedState = panesOptions.map(function (pane, idx) {
-            var paneProps = _this.getPaneProps(pane);
-            if (idx === prevIndex) {
-                return __assign(__assign({}, paneProps), { size: prevSize });
-            }
-            else if (idx === nextIndex) {
-                return __assign(__assign({}, paneProps), { size: nextSize });
-            }
-            else {
-                return __assign({}, paneProps);
-            }
-        });
-        this.panesDuringOnChange = updatedState;
-        if (!this.isControlledState) {
-            this.setState({
-                panes: updatedState
-            });
-        }
-        if (this.props.onChange) {
-            this.props.onChange({
-                newState: updatedState,
-                isLast: isLast,
-                nativeEvent: event
-            });
-        }
-        this.panesDuringOnChange = undefined;
-    };
-    Splitter.prototype.getPaneProps = function (pane) {
-        var orientation = pane.orientation, overlay = pane.overlay, containsSplitter = pane.containsSplitter, others = __rest(pane, ["orientation", "overlay", "containsSplitter"]);
-        return others;
-    };
-    /**
-     * @hidden
-     */
-    Splitter.displayName = 'Splitter';
-    return Splitter;
-}(React.Component));
-export { Splitter };

package/dist/es/splitter/SplitterBar.d.ts

@@ -1,40 +0,0 @@
-import * as React from 'react';
-import { SplitterPaneExtendedProps } from './SplitterPane';
-/**
- * @hidden
- */
-export interface SplitterBarProps {
-    orientation: 'vertical' | 'horizontal';
-    index: number;
-    prev: SplitterPaneExtendedProps;
-    next: SplitterPaneExtendedProps;
-    ariaLabel?: string;
-    isRtl?: boolean;
-    onDrag: (event: any, element: HTMLDivElement, index: number, isFirst: boolean, isLast: boolean) => void;
-    onToggle: (index: number, nativeEvent: React.MouseEvent<HTMLDivElement, MouseEvent> | React.KeyboardEvent<HTMLDivElement>) => void;
-    onKeyboardResize: (element: HTMLDivElement, index: number, delta: number, nativeEvent: React.KeyboardEvent<HTMLDivElement>) => void;
-}
-/**
- * @hidden
- */
-export interface SplitterBarState {
-    focused: boolean;
-}
-/**
- * @hidden
- */
-export declare class SplitterBar extends React.Component<SplitterBarProps, SplitterBarState> {
-    private draggable;
-    private get isStatic();
-    private get isDraggable();
-    private get isHorizontal();
-    constructor(props: SplitterBarProps);
-    render(): JSX.Element;
-    private onDrag;
-    private onFocus;
-    private onBlur;
-    private onToggle;
-    private onPrevToggle;
-    private onNextToggle;
-    private onKeyDown;
-}

package/dist/es/splitter/SplitterBar.js

@@ -1,183 +0,0 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-import * as React from 'react';
-import { classNames, Draggable, IconWrap, Keys } from '@progress/kendo-react-common';
-import { caretAltRightIcon, caretAltLeftIcon, caretAltDownIcon, caretAltUpIcon } from '@progress/kendo-svg-icons';
-/**
- * @hidden
- */
-var SplitterBar = /** @class */ (function (_super) {
-    __extends(SplitterBar, _super);
-    function SplitterBar(props) {
-        var _this = _super.call(this, props) || this;
-        _this.draggable = null;
-        _this.onDrag = function (data, isFirst, isLast) {
-            var event = data.event;
-            var _a = _this.props, onDrag = _a.onDrag, index = _a.index;
-            var element = _this.draggable && _this.draggable.element;
-            if (element && !_this.isStatic && _this.isDraggable) {
-                onDrag(event, element, index, isFirst, isLast);
-            }
-        };
-        _this.onFocus = function () {
-            _this.setState({
-                focused: true
-            });
-        };
-        _this.onBlur = function () {
-            _this.setState({
-                focused: false
-            });
-        };
-        _this.onToggle = function (event) {
-            var _a = _this.props, onToggle = _a.onToggle, index = _a.index, prev = _a.prev, next = _a.next;
-            if (prev.collapsible || next.collapsible) {
-                onToggle(prev.collapsible ? index : index + 1, event);
-            }
-        };
-        _this.onPrevToggle = function (event) {
-            var _a = _this.props, onToggle = _a.onToggle, index = _a.index, prev = _a.prev;
-            if (prev.collapsible) {
-                onToggle(index, event);
-            }
-        };
-        _this.onNextToggle = function (event) {
-            var _a = _this.props, onToggle = _a.onToggle, index = _a.index, next = _a.next;
-            if (next.collapsible) {
-                onToggle(index + 1, event);
-            }
-        };
-        _this.onKeyDown = function (event) {
-            var keyCode = event && event.keyCode;
-            var isHorizontal = _this.isHorizontal;
-            var index = _this.props.index;
-            var element = _this.draggable && _this.draggable.element;
-            var onKeyboardResize = function (el, idx, offset) {
-                event.preventDefault();
-                _this.props.onKeyboardResize(el, idx, offset, event);
-            };
-            if (!element) {
-                return;
-            }
-            if (keyCode === Keys.enter) {
-                event.preventDefault();
-                _this.onToggle(event);
-            }
-            else if (_this.isDraggable) {
-                if (isHorizontal && keyCode === Keys.left) {
-                    onKeyboardResize(element, index, -10);
-                }
-                else if (isHorizontal && keyCode === Keys.right) {
-                    onKeyboardResize(element, index, 10);
-                }
-                else if (!isHorizontal && keyCode === Keys.up) {
-                    onKeyboardResize(element, index, -10);
-                }
-                else if (!isHorizontal && keyCode === Keys.down) {
-                    onKeyboardResize(element, index, 10);
-                }
-            }
-        };
-        _this.state = {
-            focused: false
-        };
-        return _this;
-    }
-    Object.defineProperty(SplitterBar.prototype, "isStatic", {
-        get: function () {
-            var _a = this.props, prev = _a.prev, next = _a.next;
-            var betweenResizablePanes = prev.resizable && next.resizable;
-            var nearCollapsiblePane = prev.collapsible || next.collapsible;
-            return !betweenResizablePanes && !nearCollapsiblePane;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SplitterBar.prototype, "isDraggable", {
-        get: function () {
-            var _a = this.props, prev = _a.prev, next = _a.next;
-            var betweenResizablePanes = prev.resizable && next.resizable;
-            var nearCollapsedPane = prev.collapsed || next.collapsed;
-            return !!betweenResizablePanes && !nearCollapsedPane;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SplitterBar.prototype, "isHorizontal", {
-        get: function () {
-            return this.props.orientation === 'horizontal';
-        },
-        enumerable: false,
-        configurable: true
-    });
-    SplitterBar.prototype.render = function () {
-        var _a;
-        var _this = this;
-        var isDraggable = this.isDraggable;
-        var isStatic = this.isStatic;
-        var isHorizontal = this.isHorizontal;
-        var barClasses = classNames('k-splitbar', (_a = {},
-            _a['k-focus'] = this.state.focused,
-            _a['k-splitbar-horizontal'] = isHorizontal,
-            _a['k-splitbar-vertical'] = !isHorizontal,
-            _a['k-splitbar-draggable-horizontal'] = isHorizontal && isDraggable,
-            _a['k-splitbar-draggable-vertical'] = !isHorizontal && isDraggable,
-            _a['k-splitbar-static-horizontal'] = isHorizontal && isStatic,
-            _a['k-splitbar-static-vertical'] = !isHorizontal && isStatic,
-            _a));
-        return (React.createElement(Draggable, { onPress: function (event) { return _this.onDrag(event, true, false); }, onDrag: function (event) { return _this.onDrag(event, false, false); }, onRelease: function (event) { return _this.onDrag(event, false, true); }, ref: function (component) { _this.draggable = component; } },
-            React.createElement("div", { tabIndex: isStatic ? -1 : 0, role: 'separator', "aria-valuenow": 0, "aria-label": this.props.ariaLabel, "aria-orientation": isHorizontal ? 'vertical' : undefined, className: barClasses, style: { touchAction: 'none' }, onFocus: this.onFocus, onBlur: this.onBlur, onDoubleClick: this.onToggle, onKeyDown: this.onKeyDown },
-                this.props.prev.collapsible && React.createElement("div", { className: 'k-collapse-prev', onClick: this.onPrevToggle },
-                    React.createElement(IconWrap, { name: this.props.prev.collapsible
-                            ? isHorizontal
-                                ? 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'
-                            : undefined, icon: this.props.prev.collapsible
-                            ? isHorizontal
-                                ? this.props.prev.collapsed
-                                    ? (this.props.isRtl ? caretAltLeftIcon : caretAltRightIcon)
-                                    : (this.props.isRtl ? caretAltRightIcon : caretAltLeftIcon)
-                                : this.props.prev.collapsed
-                                    ? caretAltDownIcon
-                                    : caretAltUpIcon
-                            : undefined, size: 'xsmall' })),
-                React.createElement("div", { className: 'k-resize-handle' }),
-                this.props.next.collapsible && React.createElement("div", { className: 'k-collapse-next', onClick: this.onNextToggle },
-                    React.createElement(IconWrap, { name: this.props.next.collapsible
-                            ? isHorizontal
-                                ? 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'
-                            : undefined, icon: this.props.next.collapsible
-                            ? isHorizontal
-                                ? this.props.next.collapsed
-                                    ? (this.props.isRtl ? caretAltRightIcon : caretAltLeftIcon)
-                                    : (this.props.isRtl ? caretAltLeftIcon : caretAltRightIcon)
-                                : this.props.next.collapsed
-                                    ? caretAltUpIcon
-                                    : caretAltDownIcon
-                            : undefined, size: 'xsmall' })))));
-    };
-    return SplitterBar;
-}(React.Component));
-export { SplitterBar };

package/dist/es/splitter/SplitterPane.d.ts

@@ -1,53 +0,0 @@
-import * as React from 'react';
-import { KendoReactComponentBaseProps } from '@progress/kendo-react-common';
-/**
- * Represents the pane options of the Splitter.
- */
-export interface SplitterPaneProps extends KendoReactComponentBaseProps {
-    /**
-     * Sets the size of the pane ([see example]({% slug panes_splitter %}#toc-dimensions)). Has to be between the `min` and `max` properties.
-     */
-    size?: string;
-    /**
-     * Sets the minimum possible size of the pane ([see example]({% slug panes_splitter %}#toc-dimensions)).
-     */
-    min?: string;
-    /**
-     * Sets the maximum possible size of the pane ([see example]({% slug panes_splitter %}#toc-dimensions)).
-     */
-    max?: string;
-    /**
-     * Specifies if the user is allowed to resize the pane and provide space for other panes ([see example]({% slug panes_splitter %}#toc-resizing)). If `resizable` is not specified, the resizing of the pane will be enabled.
-     */
-    resizable?: boolean;
-    /**
-     * Specifies if the user is allowed to hide the pane and provide space for other panes ([see example]({% slug panes_splitter %}#toc-collapsing)).
-     */
-    collapsible?: boolean;
-    /**
-     * Specifies the pane collapsed state ([see example]({% slug panes_splitter %}#toc-collapsing)).
-     */
-    collapsed?: boolean;
-    /**
-     * Specifies if overflowing content is scrollable or hidden ([see example]({% slug panes_splitter %}#toc-scrolling)). If `scrollable` is not specified, the content will be scrollable.
-     */
-    scrollable?: boolean;
-    /**
-     * Specifies if the children of the pane should be mounted when it's in collapsed state.
-     */
-    keepMounted?: boolean;
-}
-/**
- * @hidden
- */
-export interface SplitterPaneExtendedProps extends SplitterPaneProps {
-    orientation: 'vertical' | 'horizontal';
-    overlay: boolean;
-    containsSplitter: boolean;
-}
-/**
- * @hidden
- */
-export declare class SplitterPane extends React.Component<SplitterPaneExtendedProps, {}> {
-    render(): JSX.Element;
-}