@syncfusion/ej2-navigations 30.2.7 → 31.1.17

package/dist/ts/common/menu-scroll.d.ts

@@ -0,0 +1,29 @@
+import { VScroll } from './v-scroll';
+import { HScroll } from './h-scroll';
+/**
+ * Used to add scroll in menu.
+ *
+ * @param {createElementType} createElement - Specifies the create element model
+ * @param {HTMLElement} container - Specifies the element container
+ * @param {HTMLElement} content - Specifies the content element
+ * @param {string} scrollType - Specifies the scroll type
+ * @param {boolean} enableRtl - Specifies the enable RTL property
+ * @param {boolean} offset - Specifies the offset value
+ * @returns {HTMLElement} - Element
+ * @hidden
+ */
+export declare function addScrolling(createElement: createElementType, container: HTMLElement, content: HTMLElement, scrollType: string, enableRtl: boolean, offset?: number): HTMLElement;
+/**
+ * Used to destroy the scroll option.
+ *
+ * @param {VScroll | HScroll} scrollObj - Specifies the scroller object
+ * @param {Element} element - Specifies the element
+ * @param {HTMLElement} skipEle - Specifies the skip  element
+ * @returns {void}
+ * @hidden
+ */
+export declare function destroyScroll(scrollObj: VScroll | HScroll, element: Element, skipEle?: HTMLElement): void;
+declare type createElementType = (tag: string, prop?: {
+    className?: string;
+}) => HTMLElement;
+export {};

package/dist/ts/common/menu-scroll.ts

@@ -0,0 +1,105 @@
+import { select, detach } from '@syncfusion/ej2-base';
+import { VScroll } from './v-scroll';
+import { HScroll } from './h-scroll';
+
+/**
+ * Used to add scroll in menu.
+ *
+ * @param {createElementType} createElement - Specifies the create element model
+ * @param {HTMLElement} container - Specifies the element container
+ * @param {HTMLElement} content - Specifies the content element
+ * @param {string} scrollType - Specifies the scroll type
+ * @param {boolean} enableRtl - Specifies the enable RTL property
+ * @param {boolean} offset - Specifies the offset value
+ * @returns {HTMLElement} - Element
+ * @hidden
+ */
+export function addScrolling(
+    createElement: createElementType, container: HTMLElement, content: HTMLElement, scrollType: string, enableRtl: boolean,
+    offset?: number): HTMLElement {
+    let containerOffset: number; let contentOffset: number;
+    const parentElem: Element = container.parentElement;
+    if (scrollType === 'vscroll') {
+        containerOffset = offset || container.getBoundingClientRect().height; contentOffset = content.getBoundingClientRect().height;
+    } else {
+        containerOffset = container.getBoundingClientRect().width; contentOffset = content.getBoundingClientRect().width;
+    }
+    if (containerOffset < contentOffset) {
+        return createScrollbar(createElement, container, content, scrollType, enableRtl, offset);
+    } else if (parentElem) {
+        const width: number = parentElem.getBoundingClientRect().width;
+        if (width < containerOffset && scrollType === 'hscroll') {
+            contentOffset = width;
+            container.style.maxWidth = width + 'px';
+            return createScrollbar(createElement, container, content, scrollType, enableRtl, offset);
+        }
+        return content;
+    } else {
+        return content;
+    }
+}
+
+/**
+ * Used to create scroll bar in menu.
+ *
+ * @param {createElementType} createElement - Specifies the create element model
+ * @param {HTMLElement} container - Specifies the element container
+ * @param {HTMLElement} content - Specifies the content element
+ * @param {string} scrollType - Specifies the scroll type
+ * @param {boolean} enableRtl - Specifies the enable RTL property
+ * @param {boolean} offset - Specifies the offset value
+ * @returns {HTMLElement} - Element
+ * @hidden
+ */
+function createScrollbar (createElement: createElementType, container: HTMLElement, content: HTMLElement, scrollType: string,
+                          enableRtl: boolean, offset?: number): HTMLElement {
+    const scrollEle: HTMLElement = createElement('div', { className: 'e-menu-' + scrollType });
+    container.appendChild(scrollEle);
+    scrollEle.appendChild(content);
+    if (offset) {
+        scrollEle.style.overflow = 'hidden';
+        scrollEle.style.height = offset + 'px';
+    } else {
+        scrollEle.style.maxHeight = container.style.maxHeight;
+        container.style.overflow = 'hidden';
+    }
+    let scrollObj: VScroll | HScroll;
+    if (scrollType === 'vscroll') {
+        scrollObj = new VScroll({ enableRtl: enableRtl }, scrollEle);
+        scrollObj.scrollStep = (select('.e-' + scrollType + '-bar', container) as HTMLElement).offsetHeight / 2;
+    } else {
+        scrollObj = new HScroll({ enableRtl: enableRtl }, scrollEle);
+        scrollObj.scrollStep = (select('.e-' + scrollType + '-bar', container) as HTMLElement).offsetWidth;
+    }
+    return scrollEle;
+}
+
+/**
+ * Used to destroy the scroll option.
+ *
+ * @param {VScroll | HScroll} scrollObj - Specifies the scroller object
+ * @param {Element} element - Specifies the element
+ * @param {HTMLElement} skipEle - Specifies the skip  element
+ * @returns {void}
+ * @hidden
+ */
+export function destroyScroll(scrollObj: VScroll | HScroll, element: Element, skipEle?: HTMLElement): void {
+    if (scrollObj) {
+        const menu: Element = select('.e-menu-parent', element);
+        if (menu) {
+            if (!skipEle || skipEle === menu) {
+                scrollObj.destroy();
+                element.parentElement.appendChild(menu);
+                detach(element);
+            }
+        } else {
+            scrollObj.destroy();
+            detach(element);
+        }
+    }
+}
+
+type createElementType = (
+    tag: string,
+    prop?: { className?: string }
+) => HTMLElement;

package/dist/ts/common/v-scroll-model.d.ts

@@ -0,0 +1,16 @@
+import { Touch, ScrollEventArgs, TouchEventArgs, Component, EventHandler, selectAll, getUniqueID, removeClass } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, Property, Browser, detach, createElement as buildTag } from '@syncfusion/ej2-base';import { classList, SwipeEventArgs, isNullOrUndefined } from '@syncfusion/ej2-base';
+import {ComponentModel} from '@syncfusion/ej2-base';
+
+/**
+ * Interface for a class VScroll
+ */
+export interface VScrollModel extends ComponentModel{
+
+    /**
+     * Specifies the up or down scrolling distance of the vertical scrollbar moving.
+     *
+     * @default null
+     */
+    scrollStep?: number;
+
+}

package/dist/ts/common/v-scroll.d.ts

@@ -0,0 +1,106 @@
+import { Component } from '@syncfusion/ej2-base';
+import { INotifyPropertyChanged } from '@syncfusion/ej2-base';
+import { VScrollModel } from './v-scroll-model';
+/**
+ * VScroll module is introduces vertical scroller when content exceeds the current viewing area.
+ * It can be useful for the components like Toolbar, Tab which needs vertical scrolling alone.
+ * Hidden content can be view by touch moving or icon click.
+ * ```html
+ * <div id="scroll"/>
+ * <script>
+ *   var scrollObj = new VScroll();
+ *   scrollObj.appendTo("#scroll");
+ * </script>
+ * ```
+ */
+export declare class VScroll extends Component<HTMLElement> implements INotifyPropertyChanged {
+    private touchModule;
+    private scrollEle;
+    private scrollItems;
+    private uniqueId;
+    private timeout;
+    private keyTimeout;
+    private keyTimer;
+    private browser;
+    private browserCheck;
+    private ieCheck;
+    private isDevice;
+    private customStep;
+    /**
+     * Specifies the up or down scrolling distance of the vertical scrollbar moving.
+     *
+     * @default null
+     */
+    scrollStep: number;
+    /**
+     * Initialize the event handler
+     *
+     * @private
+     * @returns {void}
+     */
+    protected preRender(): void;
+    /**
+     * To Initialize the vertical scroll rendering
+     *
+     * @private
+     * @returns {void}
+     */
+    protected render(): void;
+    private setScrollState;
+    /**
+     * Initializes a new instance of the VScroll class.
+     *
+     * @param {VScrollModel} options  - Specifies VScroll model properties as options.
+     * @param {string | HTMLElement} element  - Specifies the element for which vertical scrolling applies.
+     */
+    constructor(options?: VScrollModel, element?: string | HTMLElement);
+    private initialize;
+    protected getPersistData(): string;
+    /**
+     * Returns the current module name.
+     *
+     * @returns {string} - It returns the current module name.
+     * @private
+     */
+    protected getModuleName(): string;
+    /**
+     * Removes the control from the DOM and also removes all its related events.
+     *
+     * @returns {void}
+     */
+    destroy(): void;
+    /**
+     * Specifies the value to disable/enable the VScroll component.
+     * When set to `true` , the component will be disabled.
+     *
+     * @param  {boolean} value - Based on this Boolean value, VScroll will be enabled (false) or disabled (true).
+     * @returns {void}.
+     */
+    disable(value: boolean): void;
+    private createOverlayElement;
+    private createNavIcon;
+    private onKeyPress;
+    private onKeyUp;
+    private eventBinding;
+    private repeatScroll;
+    private tabHoldHandler;
+    private contains;
+    private eleScrolling;
+    private clickEventHandler;
+    private wheelEventHandler;
+    private swipeHandler;
+    private scrollUpdating;
+    private frameScrollRequest;
+    private touchHandler;
+    private arrowDisabling;
+    private scrollEventHandler;
+    /**
+     * Gets called when the model property changes.The data that describes the old and new values of property that changed.
+     *
+     * @param  {VScrollModel} newProp - It contains the new value of data.
+     * @param  {VScrollModel} oldProp - It contains the old value of data.
+     * @returns {void}
+     * @private
+     */
+    onPropertyChanged(newProp: VScrollModel, oldProp: VScrollModel): void;
+}