@progress/kendo-vue-layout 3.1.1 → 3.1.3-dev.202203311441

package/dist/es/panelbar/interfaces/PanelBarItemProps.d.ts

@@ -0,0 +1,85 @@
+/**
+ * Represents the props of the PanelBarItem component.
+ */
+export interface PanelBarItemProps {
+    /**
+     * Allows individual animation control over the child ([see example]({% slug animations_panelbar %})). By default, it is controlled by the PanelBar component.
+     */
+    animation?: boolean;
+    /**
+     * The class name that is set to the PanelBarItem component.
+     */
+    className?: string;
+    /**
+     * The class name that is set to the PanelBarItem header.
+     */
+    headerClassName?: string;
+    /**
+     * Sets the initial expanded state of the PanelBarItem ([see example]({% slug statesitems_panelbar %}#toc-expanded-items)). Controlled by the PanelBar component.
+     */
+    expanded?: boolean;
+    /**
+     * Sets the disabled state of the PanelBarItem ([see example]({% slug statesitems_panelbar %}#toc-disabled-items)).
+     */
+    disabled?: boolean;
+    /**
+     * @hidden
+     */
+    onSelect?: Function;
+    /**
+     * @hidden
+     */
+    level?: number;
+    /**
+     * Defines an icon that will be rendered next to the title ([see example]({% slug titlesitems_panelbar %}#toc-adding-icons)).
+     */
+    icon?: string;
+    /**
+     * Defines an icon with a custom CSS class that will be rendered next to the title ([see example]({% slug titlesitems_panelbar %}#toc-adding-icons)).
+     */
+    iconClass?: string;
+    /**
+     * Defines the location of the image that will be displayed next to the title ([see example]({% slug titlesitems_panelbar %}#toc-adding-images)).
+     */
+    imageUrl?: string;
+    /**
+     * Sets the initial selected state of the PanelBarItem. Controlled by the PanelBarItem component ([see example]({% slug statesitems_panelbar %}#toc-selected-items)).
+     */
+    selected?: boolean;
+    /**
+     * Sets the title of the PanelBar item ([see example]({% slug titlesitems_panelbar %}#toc-getting-started)).
+     */
+    title?: any;
+    /**
+     * Allows the component to set the `id` property to each item. If not set, a default `id` is applied.
+     */
+    id?: string;
+    /**
+     * Sets the initial focused state of the PanelBarItem. Controlled by the PanelBar component.
+     */
+    focused?: boolean;
+    /**
+     * @hidden
+     */
+    parentExpanded?: boolean;
+    /**
+     * @hidden
+     */
+    content?: any;
+    /**
+     * Used to identify the PanelBarItems inside the PanelBar ([see example]({% slug controlling_state_panelbar %})). Does not depend on the state of the PanelBarItem.
+     */
+    uniquePrivateKey?: string;
+    /**
+     * @hidden
+     */
+    parentUniquePrivateKey?: string[];
+    /**
+     * @hidden
+     */
+    keepItemsMounted?: boolean;
+    /**
+     * Sets a custom property. Contained in the PanelBarItem props that are returned from the `onSelect` PanelBar event.
+     */
+    [customProp: string]: any;
+}

package/dist/es/panelbar/interfaces/PanelBarProps.d.ts

@@ -0,0 +1,54 @@
+import { PanelBarSelectEventArguments } from './PanelBarSelectEventArguments';
+/**
+ * Represents the expand modes of the KendoReact PanelBar. Defaults to `multiple`.
+ */
+export declare type PanelBarExpandMode = 'single' | 'multiple';
+/**
+ * Represents the props of the [KendoReact PanelBar component]({% slug overview_panelbar %}).
+ */
+export interface PanelBarProps {
+    /**
+     * The class name that is set to the PanelBar.
+     */
+    className?: string;
+    /**
+     * Sets the animation state of the PanelBar.
+     */
+    animation?: boolean;
+    /**
+     * Sets the expand mode of the PanelBar ([see example]({% slug expandmodes_panelbar %})).
+     *
+     * The available modes are:
+     * - `"single"`—Allows you to expand only one item at a time. The expanding of an item collapses the item that was previously expanded.
+     * - `"multiple"` (default)—Allows you to expand two or more items at a time. Items can also be toggled.
+     */
+    expandMode?: PanelBarExpandMode | string;
+    /**
+     * Sets the direction of the PanelBar component.
+     */
+    dir?: string;
+    /**
+     * If set, overrides the currently selected property in the PanelBar state.
+     */
+    selected?: string;
+    /**
+     * Sets the initial expanded state of the PanelBar.
+     */
+    expanded?: string[];
+    /**
+     * Sets the initial focused state of the PanelBar.
+     */
+    focused?: string;
+    /**
+     * Determines if the PanelBar items will be mounted after expand collapse. Defaults to `false`.
+     */
+    keepItemsMounted?: boolean;
+    /**
+     * Determines if the PanelBar is going to be used in controlled state.
+     */
+    isControlled?: boolean;
+    /**
+     * Fires each time the user makes a selection ([see example]({% slug controlling_state_panelbar %})).
+     */
+    onSelect?: (event: PanelBarSelectEventArguments) => void;
+}

package/dist/es/panelbar/interfaces/PanelBarSelectEventArguments.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The arguments that are passed to the `onSelect` callback function.
+ */
+export interface PanelBarSelectEventArguments {
+    /**
+     * The selected PanelBar item.
+     */
+    target: any;
+    /**
+     * The new expanded PanelBar items state.
+     */
+    expandedItems: string[];
+}

package/dist/es/panelbar/interfaces/RenderPanelBarItem.d.ts

@@ -0,0 +1,14 @@
+import { PanelBarState } from '../PanelBar';
+/**
+ * @hidden
+ */
+export interface RenderPanelBarItem {
+    animation?: boolean;
+    keepItemsMounted?: boolean;
+    state: PanelBarState;
+    expanded: string[];
+    handleSelect: any;
+    parentExpanded?: boolean;
+    level?: number;
+    parentPrivateKey?: string[];
+}

package/dist/es/panelbar/util.d.ts

@@ -0,0 +1,49 @@
+import { PanelBarState } from './PanelBar';
+import { PanelBarItemProps } from './interfaces/PanelBarItemProps';
+import { PanelBarExpandMode } from './interfaces/PanelBarProps';
+/**
+ * @hidden
+ */
+export declare const renderChildren: () => any;
+/**
+ * @hidden
+ */
+export declare const getFirstId: (_props: any) => any;
+/**
+ * @hidden
+ */
+export declare const getInitialState: (props: any, _expandMode: PanelBarExpandMode, result?: PanelBarState, _parentExpanded?: boolean, _parentPrivateKey?: string[]) => PanelBarState;
+/**
+ * @hidden
+ */
+export declare function flatVisibleItems(data: any, flattedItems?: any[]): any[];
+/**
+ * @hidden
+ */
+export declare function flatChildren(_children: any, flattenChildren?: any[]): any[];
+/**
+ * @hidden
+ */
+export declare function flatVisibleChildren(_children: any, flattenVisibleChildren?: any[]): any[];
+/**
+ * @hidden
+ */
+export declare const isPresent: Function;
+/**
+ * Represents the PanelBarUtils functions.
+ */
+export declare namespace PanelBarUtils {
+    /**
+     * Maps a collection of PanelBarItemProps to PanelBarItem components
+     * ([see example]({% slug customization_panelbar %})).
+     * Contained in the `PanelBarUtils` object.
+     *
+     * @param items - A collection of PanelBarItemProps.
+     * @return {PanelBarItem[]} Returns an array of PanelBarItem components.
+     */
+    function mapItemsToComponents(items: Array<PanelBarItemProps>): any[];
+}
+/**
+ * @hidden
+ */
+export declare const isArrayEqual: (firstArray: any[], secondArray: any[]) => boolean;

package/dist/es/panelbar/util.js

@@ -0,0 +1,246 @@
+import { PanelBarItem } from './PanelBarItem';
+/**
+ * @hidden
+ */
+
+export var renderChildren = function // {
+  // animation = true,
+  // keepItemsMounted = false,
+  // state,
+  // expanded,
+  // handleSelect,
+  // parentExpanded = true,
+  // level = 0,
+  // parentPrivateKey = []}: RenderPanelBarItem
+renderChildren() {
+  return []; //  React.Children.map(children, (child: any, idx) => {
+  //     if (child && child.type === PanelBarItem) {
+  //         let nestedChildren;
+  //         let privateKey = getId(child, parentPrivateKey, idx);
+  //         if (child.props.children) {
+  //             const renderState: RenderPanelBarItem = {
+  //                 animation,
+  //                 keepItemsMounted,
+  //                 state,
+  //                 expanded,
+  //                 handleSelect,
+  //                 parentExpanded: (expanded || []).indexOf(privateKey) > -1,
+  //                 level: level + 1,
+  //                 parentPrivateKey: [...parentPrivateKey, privateKey]
+  //             };
+  //             nestedChildren = renderChildren(renderState);
+  //         }
+  //         return React.cloneElement(
+  //             child, {
+  //                 ...child.props,
+  //                 animation: child.props.animation !== undefined ? child.props.animation : animation,
+  //                 keepItemsMounted,
+  //                 id: child.props.id || `k-panelbar-item-default-${privateKey}`,
+  //                 uniquePrivateKey: privateKey,
+  //                 parentUniquePrivateKey: parentPrivateKey,
+  //                 parentExpanded: parentExpanded,
+  //                 level: level,
+  //                 expanded: (expanded || []).indexOf(privateKey) > -1,
+  //                 focused: state.focused === privateKey && state.wrapperFocused,
+  //                 selected: state.selected === privateKey,
+  //                 children: nestedChildren,
+  //                 onSelect: handleSelect
+  //             }
+  //         );
+  //     } else {
+  //         return <div className="k-panelbar-content k-content">{child}</div>;
+  //     }
+  // });
+};
+/**
+ * @hidden
+ */
+
+export var getFirstId = function getFirstId(_props) {
+  var firstItem = []; // React.Children.toArray(props.children)[0];
+
+  if (firstItem) {
+    return getId(firstItem, [], 0);
+  }
+
+  return '';
+};
+/**
+ * @hidden
+ */
+
+export var getInitialState = function getInitialState(props, _expandMode, result, _parentExpanded, _parentPrivateKey) {
+  // React.Children.map(props.children, (child: React.ReactElement<any>, idx) => {
+  //     if (child && child.type === PanelBarItem) {
+  //         let privateKey = getId(child, parentPrivateKey, idx);
+  if (result === void 0) {
+    result = {
+      expanded: props.expanded || [],
+      selected: props.selected || '',
+      focused: props.focused || '',
+      wrapperFocused: false
+    };
+  }
+
+  if (_parentExpanded === void 0) {
+    _parentExpanded = true;
+  }
+
+  if (_parentPrivateKey === void 0) {
+    _parentPrivateKey = [];
+  } //         if (!child.props.disabled && parentExpanded) {
+  //             if (child.props.selected) {
+  //                 result.selected = privateKey;
+  //             }
+  //             if (child.props.focused) {
+  //                 result.focused = privateKey;
+  //             }
+  //             if (child.props.expanded) {
+  //                 if (expandMode === 'multiple') {
+  //                     result.expanded.push(privateKey);
+  //                 } else if (expandMode === 'single') {
+  //                     result.expanded = [privateKey];
+  //                 }
+  //             }
+  //             if (child.props.children) {
+  //                 result = getInitialState(
+  //                     child.props,
+  //                     expandMode,
+  //                     result,
+  //                     !!child.props.expanded,
+  //                     [...parentPrivateKey, privateKey]);
+  //             }
+  //         }
+  //     }
+  // });
+
+
+  return result;
+};
+/**
+ * @hidden
+ */
+
+var getId = function getId(child, parentPrivateKey, idx) {
+  return child && child.props && child.props.id ? child.props.id : parentPrivateKey.length ? parentPrivateKey[parentPrivateKey.length - 1] + ("." + idx) : "." + idx;
+};
+/**
+ * @hidden
+ */
+
+
+export function flatVisibleItems(data, flattedItems) {
+  if (flattedItems === void 0) {
+    flattedItems = [];
+  }
+
+  (data || []).forEach(function (item) {
+    if (!item.disabled) {
+      flattedItems.push(item);
+
+      if (item.expanded && item.children) {
+        flatVisibleItems(item.children, flattedItems);
+      }
+    }
+  });
+  return flattedItems;
+}
+/**
+ * @hidden
+ */
+
+export function flatChildren(_children, flattenChildren) {
+  if (flattenChildren === void 0) {
+    flattenChildren = [];
+  } // React.Children.forEach(children, (child: any) => {
+  //     if (child && child.props && !child.props.disabled) {
+  //         flattenChildren.push(child);
+  //         if (child.props.children) {
+  //             flatChildren(child.props.children, flattenChildren);
+  //         }
+  //     }
+  // });
+
+
+  return flattenChildren;
+}
+/**
+ * @hidden
+ */
+
+export function flatVisibleChildren(_children, flattenVisibleChildren) {
+  if (flattenVisibleChildren === void 0) {
+    flattenVisibleChildren = [];
+  } // React.Children.forEach(children, (child: any) => {
+  //     if (child && child.props && !child.props.disabled && (child.props.expanded || child.props.parentExpanded)) {
+  //         flattenVisibleChildren.push(child);
+  //         if (child.props.children) {
+  //             flatVisibleChildren(child.props.children, flattenVisibleChildren);
+  //         }
+  //     }
+  // });
+
+
+  return flattenVisibleChildren;
+}
+/**
+ * @hidden
+ */
+
+export var isPresent = function isPresent(value) {
+  return value !== null && value !== undefined;
+};
+/**
+ * Represents the PanelBarUtils functions.
+ */
+
+export var PanelBarUtils;
+
+(function (PanelBarUtils) {
+  /**
+   * Maps a collection of PanelBarItemProps to PanelBarItem components
+   * ([see example]({% slug customization_panelbar %})).
+   * Contained in the `PanelBarUtils` object.
+   *
+   * @param items - A collection of PanelBarItemProps.
+   * @return {PanelBarItem[]} Returns an array of PanelBarItem components.
+   */
+  function mapItemsToComponents(items) {
+    return items.map(function (item, idx) {
+      var children;
+
+      if (item.content) {
+        children = item.content;
+      }
+
+      if (item.children) {
+        children = mapItemsToComponents(item.children);
+      }
+
+      return h(PanelBarItem //       {...item}
+      , {
+        children: children,
+        attrs: this.v3 ? undefined : {
+          children: children
+        },
+        key: item.id || idx
+      });
+    });
+  }
+
+  PanelBarUtils.mapItemsToComponents = mapItemsToComponents;
+})(PanelBarUtils || (PanelBarUtils = {}));
+/**
+ * @hidden
+ */
+
+
+export var isArrayEqual = function isArrayEqual(firstArray, secondArray) {
+  if (firstArray.length !== secondArray.length) {
+    return false;
+  }
+
+  return firstArray.every(function (ex, i) {
+    return ex === secondArray[i];
+  });
+};

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

@@ -0,0 +1,86 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { SplitterPaneProps } from './SplitterPane';
+/**
+ * Represents the onChange event of the Splitter.
+ */
+export interface SplitterOnChangeEvent {
+    /**
+     * The new panes state.
+     */
+    newState: SplitterPaneProps[];
+    /**
+     * Indicates if is the last event during drag. Can be used to optimize performance.
+     */
+    isLast: boolean;
+    /**
+     * The native DOM event.
+     */
+    nativeEvent: any;
+}
+/**
+ * Represents the options of the Splitter.
+ */
+export interface SplitterProps {
+    /**
+     * Sets the options of the Splitter panes ([more information and examples]({% slug panes_splitter %})). Can be used for controlled state.
+     */
+    panes?: SplitterPaneProps[];
+    /**
+     * Sets the initial options of the Splitter panes ([more information and examples]({% slug panes_splitter %})). Can be used for uncontrolled state.
+     */
+    defaultPanes?: SplitterPaneProps[];
+    /**
+     * Specifies the orientation of the panes within the Splitter ([more information and examples]({% slug orientation_splitter %})). Panes in a horizontal Splitter are placed horizontally. Panes in a vertical Splitter are placed vertically.
+     */
+    orientation?: 'vertical' | 'horizontal' | string;
+    /**
+     * Fires after a Splitter pane is resized or collapsed. Useful for updating the pane options and triggering layout calculations on components which are positioned inside the panes.
+     */
+    onChange?: (event: SplitterOnChangeEvent) => void;
+    /**
+     * The class name that is set to the Splitter.
+     */
+    className?: string;
+}
+/**
+ * @hidden
+ */
+export interface SplitterState {
+}
+/**
+ * @hidden
+ */
+export interface SplitterComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SplitterMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SplitterData {
+    isDragging: boolean;
+    dragIndex?: number;
+    startTime: number;
+    originalX: number;
+    originalY: number;
+    originalPrevSize: number;
+    originalNextSize: number;
+    panes: SplitterPaneProps[];
+}
+/**
+ * @hidden
+ */
+export interface SplitterAll extends Vue2type, SplitterMethods, SplitterData, SplitterComputed, SplitterState {
+}
+declare let SplitterVue2: ComponentOptions<SplitterAll, DefaultData<SplitterData>, DefaultMethods<SplitterAll>, SplitterComputed, RecordPropsDefinition<SplitterProps>>;
+declare const Splitter: DefineComponent<SplitterProps, any, SplitterData, SplitterComputed, SplitterMethods, {}, {}, {}, string, SplitterProps, SplitterProps, {}>;
+export { Splitter, SplitterVue2 };