@syncfusion/ej2-navigations
Advanced tools
@syncfusion/ej2-navigations - npm Package Compare versions
Comparing version 15.4.27 to 15.4.30
@@ -5,2 +5,16 @@ # Changelog | ||
| ### TreeView | ||
| #### New Features | ||
| - Added “getNode” method in TreeView to get the node's data based on given node element or it's ID. | ||
| - Added “beginEdit” method in TreeView, to initiate the editing mode of the TreeView node through code. | ||
| #### Breaking Changes | ||
| - In TreeView, “replaceText” method name has been modified as “updateNode”. | ||
| ## 15.4.27-preview (2018-01-30) | ||
| ### Tab | ||
@@ -7,0 +21,0 @@ |
| /*! | ||
| * filename: index.d.ts | ||
| * version : 15.4.26 | ||
| * version : 15.4.27 | ||
| * Copyright Syncfusion Inc. 2001 - 2017. All rights reserved. | ||
@@ -5,0 +5,0 @@ * Use of this code is subject to the terms of our license. |
| { | ||
| "name": "@syncfusion/ej2-navigations", | ||
| "version": "15.4.27", | ||
| "version": "15.4.30", | ||
| "description": "Essential JS 2 Navigation Components", | ||
@@ -12,7 +12,7 @@ "author": "Syncfusion Inc.", | ||
| "@syncfusion/ej2-base": "^15.4.23", | ||
| "@syncfusion/ej2-data": "^15.4.23", | ||
| "@syncfusion/ej2-buttons": "^15.4.27", | ||
| "@syncfusion/ej2-data": "^15.4.30", | ||
| "@syncfusion/ej2-buttons": "^15.4.30", | ||
| "@syncfusion/ej2-popups": "^15.4.27", | ||
| "@syncfusion/ej2-lists": "^15.4.26", | ||
| "@syncfusion/ej2-inputs": "^15.4.24" | ||
| "@syncfusion/ej2-inputs": "^15.4.29" | ||
| }, | ||
@@ -38,2 +38,3 @@ "devDependencies": { | ||
| "panelbar", | ||
| "treeview", | ||
| "ejTab", | ||
@@ -40,0 +41,0 @@ "tab", |
@@ -11,3 +11,3 @@ # Overview | ||
| * [ContextMenu Demos](http://ej2.syncfusion.com/demos/#/material/context-menu/context-menu.html) | ||
| * [TreeView](http://ej2.syncfusion.com/demos/#/material/treeview/default.html) | ||
| * [TreeView Demos](http://ej2.syncfusion.com/demos/#/material/treeview/default.html) | ||
@@ -14,0 +14,0 @@ ## Changelog |
@@ -139,2 +139,3 @@ import { Component, EmitType } from '@syncfusion/ej2-base'; | ||
| private isDestroy; | ||
| private templateEle; | ||
| /** | ||
@@ -141,0 +142,0 @@ * Contains the keyboard configuration of the Accordion. |
@@ -117,2 +117,5 @@ var __extends = (this && this.__extends) || (function () { | ||
| this.isDestroy = true; | ||
| this.templateEle.forEach(function (eleStr) { | ||
| document.body.appendChild(_this.element.querySelector(eleStr)).style.display = 'none'; | ||
| }); | ||
| while (ele.firstChild) { | ||
@@ -134,2 +137,3 @@ ele.removeChild(ele.firstChild); | ||
| this.isNested = false; | ||
| this.templateEle = []; | ||
| if (!this.isDestroy) { | ||
@@ -386,6 +390,9 @@ this.isDestroy = false; | ||
| Accordion.prototype.keyActionHandler = function (e) { | ||
| var trgt = e.target; | ||
| if (trgt.tagName === 'INPUT') { | ||
| return; | ||
| } | ||
| e.preventDefault(); | ||
| var clst; | ||
| var root = this.element; | ||
| var trgt = e.target; | ||
| var content; | ||
@@ -478,4 +485,4 @@ switch (e.action) { | ||
| temString = eleVal.outerHTML.trim(); | ||
| templateFn = ej2_base_2.compile(temString); | ||
| ej2_base_3.detach(eleVal); | ||
| ele.appendChild(eleVal); | ||
| eleVal.style.display = ''; | ||
| } | ||
@@ -493,14 +500,9 @@ } | ||
| }); | ||
| if (!ej2_base_6.isNullOrUndefined(temString)) { | ||
| if (isHeader) { | ||
| this.items[index].header = temString; | ||
| } | ||
| else { | ||
| this.items[index].content = temString; | ||
| } | ||
| } | ||
| } | ||
| else { | ||
| else if (ele.childElementCount === 0) { | ||
| ele.innerHTML = value; | ||
| } | ||
| if (!ej2_base_6.isNullOrUndefined(temString)) { | ||
| this.templateEle.push(value); | ||
| } | ||
| return ele; | ||
@@ -507,0 +509,0 @@ }; |
@@ -267,3 +267,3 @@ var __extends = (this && this.__extends) || (function () { | ||
| else { | ||
| var disEle = this.element.querySelector('.' + CLS_DISABLE); | ||
| var disEle = this.element.querySelector('.' + CLS_HSCROLLNAV + '.' + CLS_DISABLE); | ||
| if (disEle) { | ||
@@ -270,0 +270,0 @@ disEle.classList.remove(CLS_DISABLE); |
@@ -12,3 +12,3 @@ import { Component, formatUnit, EventHandler, Event, isNullOrUndefined } from '@syncfusion/ej2-base';import { Property, EmitType, NotifyPropertyChanges, INotifyPropertyChanged, Browser } from '@syncfusion/ej2-base';import { setStyleAttribute as setStyle, addClass, removeClass, createElement, Touch, SwipeEventArgs } from '@syncfusion/ej2-base'; | ||
| * Specifies the size of the Sidebar in dock state. | ||
| * @default 'auto'. | ||
| * @default 'auto' | ||
| */ | ||
@@ -19,3 +19,3 @@ dockSize?: string | number; | ||
| * Specifies the media query whether the sidebar need to be opened when the resolution meets | ||
| * @default null. | ||
| * @default null | ||
| */ | ||
@@ -26,3 +26,3 @@ mediaQuery?: MediaQueryList; | ||
| * Specifies the docking state of the component. | ||
| * @default false. | ||
| * @default false | ||
| */ | ||
@@ -33,3 +33,3 @@ enableDock?: boolean; | ||
| * Enables the expand or collapse while swiping in touch devices. | ||
| * @default true. | ||
| * @default true | ||
| */ | ||
@@ -40,3 +40,3 @@ enableGestures?: boolean; | ||
| * Specifies the Sidebar in RTL state. | ||
| * @default false. | ||
| * @default false | ||
| */ | ||
@@ -47,3 +47,3 @@ enableRtl?: boolean; | ||
| * Specifies the Sidebar animation to be enabled or not. | ||
| * @default true. | ||
| * @default true | ||
| */ | ||
@@ -54,3 +54,3 @@ animate?: boolean; | ||
| * Specifies the height of the Sidebar. | ||
| * @default 'auto'. | ||
| * @default 'auto' | ||
| */ | ||
@@ -61,3 +61,3 @@ height?: string | number; | ||
| * Specifies whether the Sidebar need to be closed or not when document area is clicked. | ||
| * @default true. | ||
| * @default false | ||
| */ | ||
@@ -67,4 +67,4 @@ closeOnDocumentClick?: boolean; | ||
| /** | ||
| * Specifies the position of the Sidebar (left/right) corresponding to the primary content. | ||
| * @default 'left'. | ||
| * Specifies the position of the Sidebar (Left/Right) corresponding to the primary content. | ||
| * @default 'Left' | ||
| */ | ||
@@ -75,3 +75,3 @@ position?: SidebarPosition; | ||
| * Specifies the element position of the Sidebar inside any element. | ||
| * @default null. | ||
| * @default null | ||
| */ | ||
@@ -82,3 +82,3 @@ contextTo?: HTMLElement; | ||
| * Specifies the whether to apply overlay options to primary content when the Sidebar is in an open state. | ||
| * @default false. | ||
| * @default false | ||
| */ | ||
@@ -89,3 +89,3 @@ showBackdrop?: boolean; | ||
| * Specifies the expanding types of the Sidebar. | ||
| * @default 'auto'. | ||
| * @default 'Auto' | ||
| */ | ||
@@ -96,3 +96,3 @@ type?: SidebarType; | ||
| * Specifies the width of the Sidebar. | ||
| * @default 'auto'. | ||
| * @default 'auto' | ||
| */ | ||
@@ -103,3 +103,3 @@ width?: string | number; | ||
| * Specifies the z-index of the Sidebar. | ||
| * @default 1000. | ||
| * @default 1000 | ||
| */ | ||
@@ -106,0 +106,0 @@ zIndex?: string | number; |
@@ -7,16 +7,29 @@ import { Component } from '@syncfusion/ej2-base'; | ||
| */ | ||
| export declare type SidebarType = 'slide' | 'over' | 'push' | 'auto'; | ||
| export declare type SidebarType = 'Slide' | 'Over' | 'Push' | 'Auto'; | ||
| /** | ||
| * Specifies the Sidebar positions. | ||
| */ | ||
| export declare type SidebarPosition = 'left' | 'right'; | ||
| export declare type SidebarPosition = 'Left' | 'Right'; | ||
| /** | ||
| * Sidebar is an expandable and collapsible | ||
| * component that typically act as a side container to place the primary or secondary content alongside of the main content. | ||
| * ```html | ||
| * <aside id="sidebar"> | ||
| * </aside> | ||
| * ```` | ||
| * ````typescript | ||
| * <script> | ||
| * let sidebarObject = new Sidebar({ }); | ||
| * sidebarObject.appendTo("#sidebar"); | ||
| * </script> | ||
| * ``` | ||
| */ | ||
| export declare class Sidebar extends Component<HTMLElement> implements INotifyPropertyChanged { | ||
| private barWidth; | ||
| private eventArguments; | ||
| private modal; | ||
| private swipeContentObject; | ||
| private swipeElementObject; | ||
| private mainContentEle; | ||
| private sidebarEle; | ||
| /** | ||
| * Specifies the size of the Sidebar in dock state. | ||
| * @default 'auto'. | ||
| * @default 'auto' | ||
| */ | ||
@@ -26,3 +39,3 @@ dockSize: string | number; | ||
| * Specifies the media query whether the sidebar need to be opened when the resolution meets | ||
| * @default null. | ||
| * @default null | ||
| */ | ||
@@ -32,3 +45,3 @@ mediaQuery: MediaQueryList; | ||
| * Specifies the docking state of the component. | ||
| * @default false. | ||
| * @default false | ||
| */ | ||
@@ -38,3 +51,3 @@ enableDock: boolean; | ||
| * Enables the expand or collapse while swiping in touch devices. | ||
| * @default true. | ||
| * @default true | ||
| */ | ||
@@ -44,3 +57,3 @@ enableGestures: boolean; | ||
| * Specifies the Sidebar in RTL state. | ||
| * @default false. | ||
| * @default false | ||
| */ | ||
@@ -50,3 +63,3 @@ enableRtl: boolean; | ||
| * Specifies the Sidebar animation to be enabled or not. | ||
| * @default true. | ||
| * @default true | ||
| */ | ||
@@ -56,3 +69,3 @@ animate: boolean; | ||
| * Specifies the height of the Sidebar. | ||
| * @default 'auto'. | ||
| * @default 'auto' | ||
| */ | ||
@@ -62,8 +75,8 @@ height: string | number; | ||
| * Specifies whether the Sidebar need to be closed or not when document area is clicked. | ||
| * @default true. | ||
| * @default false | ||
| */ | ||
| closeOnDocumentClick: boolean; | ||
| /** | ||
| * Specifies the position of the Sidebar (left/right) corresponding to the primary content. | ||
| * @default 'left'. | ||
| * Specifies the position of the Sidebar (Left/Right) corresponding to the primary content. | ||
| * @default 'Left' | ||
| */ | ||
@@ -73,3 +86,3 @@ position: SidebarPosition; | ||
| * Specifies the element position of the Sidebar inside any element. | ||
| * @default null. | ||
| * @default null | ||
| */ | ||
@@ -79,3 +92,3 @@ contextTo: HTMLElement; | ||
| * Specifies the whether to apply overlay options to primary content when the Sidebar is in an open state. | ||
| * @default false. | ||
| * @default false | ||
| */ | ||
@@ -85,3 +98,3 @@ showBackdrop: boolean; | ||
| * Specifies the expanding types of the Sidebar. | ||
| * @default 'auto'. | ||
| * @default 'Auto' | ||
| */ | ||
@@ -91,3 +104,3 @@ type: SidebarType; | ||
| * Specifies the width of the Sidebar. | ||
| * @default 'auto'. | ||
| * @default 'auto' | ||
| */ | ||
@@ -97,3 +110,3 @@ width: string | number; | ||
| * Specifies the z-index of the Sidebar. | ||
| * @default 1000. | ||
| * @default 1000 | ||
| */ | ||
@@ -100,0 +113,0 @@ zIndex: string | number; |
@@ -25,2 +25,3 @@ var __extends = (this && this.__extends) || (function () { | ||
| var OPEN = 'e-open'; | ||
| var TRASITION = 'e-transition'; | ||
| var DEFAULTBACKDROP = 'e-sidebar-overlay'; | ||
@@ -46,3 +47,2 @@ var CONTEXTBACKDROP = 'e-backdrop'; | ||
| this.setWidth(); | ||
| this.barWidth = this.element.getBoundingClientRect().width; | ||
| }; | ||
@@ -71,6 +71,6 @@ Sidebar.prototype.render = function () { | ||
| Sidebar.prototype.setWidth = function () { | ||
| if (this.enableDock && this.position === 'left') { | ||
| if (this.enableDock && this.position === 'Left') { | ||
| ej2_base_3.setStyleAttribute(this.element, { 'width': ej2_base_1.formatUnit(this.dockSize) }); | ||
| } | ||
| else if (this.enableDock && this.position === 'right') { | ||
| else if (this.enableDock && this.position === 'Right') { | ||
| ej2_base_3.setStyleAttribute(this.element, { 'width': ej2_base_1.formatUnit(this.dockSize) }); | ||
@@ -91,3 +91,3 @@ } | ||
| } | ||
| if (!this.enableDock && this.type !== 'auto') { | ||
| if (!this.enableDock && this.type !== 'Auto') { | ||
| ej2_base_3.addClass([this.element], [VISIBILITY]); | ||
@@ -97,4 +97,4 @@ } | ||
| this.element.classList.add(ROOT); | ||
| ej2_base_3.addClass([this.element], (this.position === 'right') ? RIGHT : LEFT); | ||
| if (this.type === 'auto' && !ej2_base_2.Browser.isDevice && !this.enableDock) { | ||
| ej2_base_3.addClass([this.element], (this.position === 'Right') ? RIGHT : LEFT); | ||
| if (this.type === 'Auto' && !ej2_base_2.Browser.isDevice && !this.enableDock) { | ||
| ej2_base_3.addClass([this.element], OPEN); | ||
@@ -130,3 +130,3 @@ } | ||
| ej2_base_3.setStyleAttribute(this.element, { 'width': ej2_base_1.formatUnit(this.width) }); | ||
| this.barWidth = this.element.getBoundingClientRect().width; | ||
| this.setDock(); | ||
| this.setType(this.type); | ||
@@ -137,5 +137,4 @@ var sibling = document.querySelector('.e-main-content') || | ||
| sibling.style.transform = 'translateX(' + 0 + 'px)'; | ||
| this.position === 'left' ? sibling.style.marginLeft = '0px' : sibling.style.marginRight = '0px'; | ||
| this.position === 'Left' ? sibling.style.marginLeft = '0px' : sibling.style.marginRight = '0px'; | ||
| } | ||
| this.setDock(); | ||
| this.eventArguments = { name: 'change', element: this.element }; | ||
@@ -145,5 +144,8 @@ this.trigger('close', this.eventArguments); | ||
| if (this.closeOnDocumentClick) { | ||
| ej2_base_1.EventHandler.remove(document, 'mousedown', this.documentclickHandler); | ||
| ej2_base_1.EventHandler.remove(document, 'mousedown touchstart', this.documentclickHandler); | ||
| } | ||
| this.setAnimation(); | ||
| if (this.type === 'Slide') { | ||
| document.body.classList.remove('e-sidebar-overflow'); | ||
| } | ||
| }; | ||
@@ -159,7 +161,7 @@ Sidebar.prototype.show = function () { | ||
| } | ||
| ej2_base_3.addClass([this.element], OPEN); | ||
| ej2_base_3.addClass([this.element], [OPEN, TRASITION]); | ||
| ej2_base_3.setStyleAttribute(this.element, { 'transform': '' }); | ||
| ej2_base_3.removeClass([this.element], CLOSE); | ||
| ej2_base_3.setStyleAttribute(this.element, { 'width': ej2_base_1.formatUnit(this.width) }); | ||
| this.barWidth = this.element.getBoundingClientRect().width; | ||
| var elementWidth = this.element.getBoundingClientRect().width; | ||
| this.setType(this.type); | ||
@@ -171,5 +173,8 @@ this.createBackDrop(); | ||
| if (this.closeOnDocumentClick) { | ||
| ej2_base_1.EventHandler.add(document, 'mousedown', this.documentclickHandler, this); | ||
| ej2_base_1.EventHandler.add(document, 'mousedown touchstart', this.documentclickHandler, this); | ||
| } | ||
| this.setAnimation(); | ||
| if (this.type === 'Slide') { | ||
| document.body.classList.add('e-sidebar-overflow'); | ||
| } | ||
| }; | ||
@@ -185,6 +190,6 @@ Sidebar.prototype.setAnimation = function () { | ||
| Sidebar.prototype.setDock = function () { | ||
| if (this.enableDock && this.position === 'left') { | ||
| if (this.enableDock && this.position === 'Left' && !this.isOpen()) { | ||
| ej2_base_3.setStyleAttribute(this.element, { 'transform': 'translateX(' + -100 + '%) translateX(' + ej2_base_1.formatUnit(this.dockSize) + ')' }); | ||
| } | ||
| else if (this.enableDock && this.position === 'right') { | ||
| else if (this.enableDock && this.position === 'Right' && !this.isOpen()) { | ||
| ej2_base_3.setStyleAttribute(this.element, { 'transform': 'translateX(' + 100 + '%) translateX(' + '-' + ej2_base_1.formatUnit(this.dockSize) + ')' }); | ||
@@ -230,3 +235,3 @@ } | ||
| Sidebar.prototype.resize = function (e) { | ||
| if (this.type === 'auto') { | ||
| if (this.type === 'Auto') { | ||
| if (ej2_base_2.Browser.isDevice) { | ||
@@ -248,13 +253,13 @@ ej2_base_3.addClass([this.element], OVER); | ||
| Sidebar.prototype.enableGestureHandler = function (args) { | ||
| if (this.position === 'left' && args.swipeDirection === 'Right' && | ||
| if (this.position === 'Left' && args.swipeDirection === 'Right' && | ||
| (args.startX <= 20 && args.distanceX >= 50 && args.velocity >= 0.5)) { | ||
| this.show(); | ||
| } | ||
| else if (this.position === 'left' && args.swipeDirection === 'Left') { | ||
| else if (this.position === 'Left' && args.swipeDirection === 'Left') { | ||
| this.hide(); | ||
| } | ||
| else if (this.position === 'right' && args.swipeDirection === 'Right') { | ||
| else if (this.position === 'Right' && args.swipeDirection === 'Right') { | ||
| this.hide(); | ||
| } | ||
| else if (this.position === 'right' && args.swipeDirection === 'Left' | ||
| else if (this.position === 'Right' && args.swipeDirection === 'Left' | ||
| && (window.innerWidth - args.startX <= 20 && args.distanceX >= 50 && args.velocity >= 0.5)) { | ||
@@ -266,9 +271,9 @@ this.show(); | ||
| if (this.enableGestures) { | ||
| this.swipeContentObject = new ej2_base_3.Touch(document.body, { swipe: this.enableGestureHandler.bind(this) }); | ||
| this.swipeElementObject = new ej2_base_3.Touch(this.element, { swipe: this.enableGestureHandler.bind(this) }); | ||
| this.mainContentEle = new ej2_base_3.Touch(document.body, { swipe: this.enableGestureHandler.bind(this) }); | ||
| this.sidebarEle = new ej2_base_3.Touch(this.element, { swipe: this.enableGestureHandler.bind(this) }); | ||
| } | ||
| else { | ||
| if (this.swipeContentObject && this.swipeElementObject) { | ||
| this.swipeContentObject.destroy(); | ||
| this.swipeElementObject.destroy(); | ||
| if (this.mainContentEle && this.sidebarEle) { | ||
| this.mainContentEle.destroy(); | ||
| this.sidebarEle.destroy(); | ||
| } | ||
@@ -283,11 +288,13 @@ } | ||
| window.removeEventListener('resize', this.resize.bind(this)); | ||
| ej2_base_1.EventHandler.remove(document, 'mousedown', this.documentclickHandler); | ||
| if (this.swipeContentObject) { | ||
| this.swipeContentObject.destroy(); | ||
| ej2_base_1.EventHandler.remove(document, 'mousedown touchstart', this.documentclickHandler); | ||
| if (this.mainContentEle) { | ||
| this.mainContentEle.destroy(); | ||
| } | ||
| if (this.swipeElementObject) { | ||
| this.swipeElementObject.destroy(); | ||
| if (this.sidebarEle) { | ||
| this.sidebarEle.destroy(); | ||
| } | ||
| }; | ||
| Sidebar.prototype.onPropertyChanged = function (newProp, oldProp) { | ||
| var sibling = document.querySelector('.e-main-content') || | ||
| this.element.nextElementSibling; | ||
| for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) { | ||
@@ -312,9 +319,7 @@ var prop = _a[_i]; | ||
| this.element.style.transform = ''; | ||
| var sibling = void 0; | ||
| sibling = document.querySelector('.e-main-content') || | ||
| this.element.nextElementSibling; | ||
| this.setDock(); | ||
| if (sibling) { | ||
| this.position === 'left' ? sibling.style.marginRight = '0px' : sibling.style.marginLeft = '0px'; | ||
| this.position === 'Left' ? sibling.style.marginRight = '0px' : sibling.style.marginLeft = '0px'; | ||
| } | ||
| if (this.position === 'right') { | ||
| if (this.position === 'Right') { | ||
| ej2_base_3.removeClass([this.element], LEFT); | ||
@@ -341,8 +346,19 @@ ej2_base_3.addClass([this.element], RIGHT); | ||
| break; | ||
| case 'contextTo': | ||
| if (ej2_base_1.isNullOrUndefined(this.contextTo)) { | ||
| ej2_base_3.removeClass([this.element], SIDEBARABSOLUTE); | ||
| ej2_base_3.removeClass([oldProp.contextTo], CONTEXT); | ||
| ej2_base_3.setStyleAttribute(sibling, { 'margin-left': 0, 'margin-right': 0 }); | ||
| document.body.insertAdjacentElement('afterbegin', this.element); | ||
| } | ||
| else { | ||
| _super.prototype.refresh.call(this); | ||
| } | ||
| break; | ||
| case 'closeOnDocumentClick': | ||
| if (this.closeOnDocumentClick) { | ||
| ej2_base_1.EventHandler.add(document, 'mousedown', this.documentclickHandler, this); | ||
| ej2_base_1.EventHandler.add(document, 'mousedown touchstart', this.documentclickHandler, this); | ||
| } | ||
| else { | ||
| ej2_base_1.EventHandler.remove(document, 'mousedown', this.documentclickHandler); | ||
| ej2_base_1.EventHandler.remove(document, 'mousedown touchstart', this.documentclickHandler); | ||
| } | ||
@@ -368,2 +384,3 @@ break; | ||
| Sidebar.prototype.setType = function (type) { | ||
| var elementWidth = this.element.getBoundingClientRect().width; | ||
| this.setZindex(); | ||
@@ -377,32 +394,35 @@ if (this.enableDock) { | ||
| sibling.style.transform = 'translateX(' + 0 + 'px)'; | ||
| this.position === 'left' ? sibling.style.marginLeft = '0px' : sibling.style.marginRight = '0px'; | ||
| if (!ej2_base_2.Browser.isDevice && this.type !== 'Auto') { | ||
| this.position === 'Left' ? sibling.style.marginLeft = '0px' : sibling.style.marginRight = '0px'; | ||
| } | ||
| } | ||
| var margin = this.position === 'left' ? this.barWidth + 'px' : this.barWidth + 'px'; | ||
| var tempWidth = this.position === 'left' ? this.barWidth : -(this.barWidth); | ||
| var margin = this.position === 'Left' ? elementWidth + 'px' : elementWidth + 'px'; | ||
| var eleWidth = this.position === 'Left' ? elementWidth : -(elementWidth); | ||
| ej2_base_3.removeClass([this.element], [PUSH, OVER, SLIDE]); | ||
| switch (type) { | ||
| case 'push': | ||
| case 'Push': | ||
| ej2_base_3.addClass([this.element], [PUSH]); | ||
| if (sibling && (this.enableDock || this.element.classList.contains(OPEN))) { | ||
| this.position === 'left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| this.position === 'Left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| } | ||
| break; | ||
| case 'slide': | ||
| case 'Slide': | ||
| ej2_base_3.addClass([this.element], [SLIDE]); | ||
| if (sibling && (this.enableDock || this.element.classList.contains(OPEN))) { | ||
| sibling.style.transform = 'translateX(' + tempWidth + 'px)'; | ||
| sibling.style.transform = 'translateX(' + eleWidth + 'px)'; | ||
| } | ||
| break; | ||
| case 'over': | ||
| case 'Over': | ||
| ej2_base_3.addClass([this.element], [OVER]); | ||
| if (this.enableDock && this.element.classList.contains(CLOSE)) { | ||
| if (sibling) { | ||
| this.position === 'left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| this.position === 'Left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| } | ||
| } | ||
| break; | ||
| case 'auto': | ||
| case 'Auto': | ||
| ej2_base_3.addClass([this.element], [TRASITION]); | ||
| if (ej2_base_2.Browser.isDevice) { | ||
| if (sibling && (this.enableDock) && !this.isOpen()) { | ||
| this.position === 'left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| this.position === 'Left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| ej2_base_3.addClass([this.element], PUSH); | ||
@@ -417,5 +437,6 @@ } | ||
| if (sibling && (this.enableDock || this.element.classList.contains(OPEN))) { | ||
| this.position === 'left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| this.position === 'Left' ? sibling.style.marginLeft = margin : sibling.style.marginRight = margin; | ||
| } | ||
| } | ||
| this.createBackDrop(); | ||
| } | ||
@@ -425,6 +446,6 @@ }; | ||
| _super.prototype.destroy.call(this); | ||
| ej2_base_3.removeClass([this.element], [OPEN, CLOSE, PUSH, SLIDE, OVER, LEFT, RIGHT]); | ||
| ej2_base_3.removeClass([this.element], [OPEN, CLOSE, PUSH, SLIDE, OVER, LEFT, RIGHT, TRASITION]); | ||
| if (this.contextTo) { | ||
| ej2_base_3.removeClass([this.element], 'e-context-absolute'); | ||
| ej2_base_3.removeClass([this.contextTo], 'e-context-relative'); | ||
| ej2_base_3.removeClass([this.element], SIDEBARABSOLUTE); | ||
| ej2_base_3.removeClass([this.contextTo], CONTEXT); | ||
| } | ||
@@ -465,6 +486,6 @@ this.destroyBackDrop(); | ||
| __decorate([ | ||
| ej2_base_2.Property(true) | ||
| ej2_base_2.Property(false) | ||
| ], Sidebar.prototype, "closeOnDocumentClick", void 0); | ||
| __decorate([ | ||
| ej2_base_2.Property('left') | ||
| ej2_base_2.Property('Left') | ||
| ], Sidebar.prototype, "position", void 0); | ||
@@ -478,3 +499,3 @@ __decorate([ | ||
| __decorate([ | ||
| ej2_base_2.Property('auto') | ||
| ej2_base_2.Property('Auto') | ||
| ], Sidebar.prototype, "type", void 0); | ||
@@ -481,0 +502,0 @@ __decorate([ |
@@ -121,5 +121,5 @@ import { Component, EventHandler, Property, Event, EmitType, BaseEventArgs } from '@syncfusion/ej2-base';import { addClass, removeClass, isVisible, closest, attributes, detach, classList, KeyboardEvents } from '@syncfusion/ej2-base';import { createElement as buildTag, selectAll, setStyleAttribute as setStyle, KeyboardEventArgs } from '@syncfusion/ej2-base';import { isNullOrUndefined as isNOU, getUniqueID, formatUnit, Collection, compile as templateCompiler } from '@syncfusion/ej2-base';import { INotifyPropertyChanged, NotifyPropertyChanges, ChildProperty, Browser } from '@syncfusion/ej2-base';import { Popup } from '@syncfusion/ej2-popups';import { calculatePosition } from '@syncfusion/ej2-popups';import { Button, IconPosition } from '@syncfusion/ej2-buttons';import { HScroll } from '../common/h-scroll'; | ||
| * { text: "Home" }, | ||
| * { text: "My Home Page" , align: 'center' }, | ||
| * { text: "Search", align: 'right' } | ||
| * { text: "Settings", align: 'right' } | ||
| * { text: "My Home Page" , align: 'Center' }, | ||
| * { text: "Search", align: 'Right' } | ||
| * { text: "Settings", align: 'Right' } | ||
| * ] | ||
@@ -129,3 +129,3 @@ * }); | ||
| * ``` | ||
| * @default "left". | ||
| * @default "Left". | ||
| */ | ||
@@ -132,0 +132,0 @@ align?: ItemAlign; |
@@ -20,3 +20,3 @@ import { Component, EmitType, BaseEventArgs } from '@syncfusion/ej2-base'; | ||
| export declare type OverflowMode = 'Scrollable' | 'Popup'; | ||
| export declare type ItemAlign = 'left' | 'center' | 'right'; | ||
| export declare type ItemAlign = 'Left' | 'Center' | 'Right'; | ||
| export interface ClickEventArgs extends BaseEventArgs { | ||
@@ -134,5 +134,5 @@ /** Defines the current Toolbar Item Object. */ | ||
| * { text: "Home" }, | ||
| * { text: "My Home Page" , align: 'center' }, | ||
| * { text: "Search", align: 'right' } | ||
| * { text: "Settings", align: 'right' } | ||
| * { text: "My Home Page" , align: 'Center' }, | ||
| * { text: "Search", align: 'Right' } | ||
| * { text: "Settings", align: 'Right' } | ||
| * ] | ||
@@ -142,3 +142,3 @@ * }); | ||
| * ``` | ||
| * @default "left". | ||
| * @default "Left". | ||
| */ | ||
@@ -344,2 +344,9 @@ align: ItemAlign; | ||
| onPropertyChanged(newProp: ToolbarModel, oldProp: ToolbarModel): void; | ||
| /** | ||
| * Shows or hides the Toolbar item that is in the specified index. | ||
| * @param {number} index - Index value of target item. | ||
| * @param {boolean} value - Based on this Boolean value, item will be hide (true) or show (false). By default, value is false. | ||
| * @returns void. | ||
| */ | ||
| hideItem(index: number, value?: boolean): void; | ||
| } |
@@ -1,2 +0,2 @@ | ||
| import { Component, EmitType, isUndefined, Browser, compile } from '@syncfusion/ej2-base';import { Property, INotifyPropertyChanged, NotifyPropertyChanges, ChildProperty, Complex } from '@syncfusion/ej2-base';import { Event, EventHandler, KeyboardEvents, KeyboardEventArgs } from '@syncfusion/ej2-base';import { rippleEffect, Effect, Animation, AnimationOptions, RippleOptions } from '@syncfusion/ej2-base';import { Draggable, DragEventArgs, Droppable, DropEventArgs } from '@syncfusion/ej2-base';import { addClass, removeClass, closest, matches, detach, select, selectAll, isVisible, createElement, append } from '@syncfusion/ej2-base';import { DataManager, Query } from '@syncfusion/ej2-data';import { isNullOrUndefined as isNOU, Touch, TapEventArgs } from '@syncfusion/ej2-base';import { ListBase, ListBaseOptions, AriaAttributesMapping, FieldsMapping } from '@syncfusion/ej2-lists';import { createCheckBox } from '@syncfusion/ej2-buttons';import { Input, InputObject } from '@syncfusion/ej2-inputs';import { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups'; | ||
| import { Component, EmitType, isUndefined, Browser, compile } from '@syncfusion/ej2-base';import { Property, INotifyPropertyChanged, NotifyPropertyChanges, ChildProperty, Complex } from '@syncfusion/ej2-base';import { Event, EventHandler, KeyboardEvents, KeyboardEventArgs } from '@syncfusion/ej2-base';import { rippleEffect, Effect, Animation, AnimationOptions, RippleOptions } from '@syncfusion/ej2-base';import { Draggable, DragEventArgs, Droppable, DropEventArgs } from '@syncfusion/ej2-base';import { addClass, removeClass, closest, matches, detach, select, selectAll, isVisible, createElement, append } from '@syncfusion/ej2-base';import { DataManager, Query } from '@syncfusion/ej2-data';import { isNullOrUndefined as isNOU, Touch, TapEventArgs, getValue, setValue } from '@syncfusion/ej2-base';import { ListBase, ListBaseOptions, AriaAttributesMapping, FieldsMapping } from '@syncfusion/ej2-lists';import { createCheckBox, rippleMouseHandler } from '@syncfusion/ej2-buttons';import { Input, InputObject } from '@syncfusion/ej2-inputs';import { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups'; | ||
| import {ExpandOnSettings,SortOrder,DataBoundEventArgs,DrawNodeEventArgs,NodeKeyPressEventArgs,NodeCheckEventArgs,NodeClickEventArgs,NodeExpandEventArgs,DragAndDropEventArgs,NodeEditEventArgs,NodeSelectEventArgs} from "./treeview"; | ||
@@ -19,3 +19,3 @@ import {ComponentModel} from '@syncfusion/ej2-base'; | ||
| */ | ||
| dataSource?: { [key: string]: Object }[] | DataManager; | ||
| dataSource?: DataManager | { [key: string]: Object }[]; | ||
@@ -212,7 +212,7 @@ /** | ||
| * Specifies an action that determines whether the node can expand or collapse. The available actions are, | ||
| * * `auto` - The expand/collapse operation happens when you double-click the node in desktop, and when you single-click | ||
| * * `Auto` - The expand/collapse operation happens when you double-click the node in desktop, and when you single-click | ||
| * the node in mobile devices. | ||
| * * `click` - The expand/collapse operation happens when you single-click the node in both desktop and mobile devices. | ||
| * * `dblclick` - The expand/collapse operation happens when you double-click the node in both desktop and mobile devices. | ||
| * @default 'auto' | ||
| * * `Click` - The expand/collapse operation happens when you single-click the node in both desktop and mobile devices. | ||
| * * `DblClick` - The expand/collapse operation happens when you double-click the node in both desktop and mobile devices. | ||
| * @default 'Auto' | ||
| */ | ||
@@ -268,3 +268,3 @@ expandOn?: ExpandOnSettings; | ||
| * The CheckBox will be displayed next to the expand/collapse icon of the node. For more information on CheckBoxes, refer to | ||
| * CheckBox](http://ej2.syncfusion.com/documentation/treeview/checkbox.html). | ||
| * [CheckBox](http://ej2.syncfusion.com/documentation/treeview/checkbox.html). | ||
| * @default false | ||
@@ -271,0 +271,0 @@ */ |
@@ -102,2 +102,6 @@ import { Component, EmitType } from '@syncfusion/ej2-base'; | ||
| oldText: string; | ||
| /** | ||
| * Gets or sets the inner HTML of TreeView node while editing. | ||
| */ | ||
| innerHtml: string; | ||
| } | ||
@@ -207,5 +211,5 @@ export interface DragAndDropEventArgs { | ||
| */ | ||
| dataSource: { | ||
| dataSource: DataManager | { | ||
| [key: string]: Object; | ||
| }[] | DataManager; | ||
| }[]; | ||
| /** | ||
@@ -270,3 +274,3 @@ * Specifies the mapping field for expand state of the TreeView node. | ||
| } | ||
| export declare type ExpandOnSettings = 'auto' | 'click' | 'dblclick'; | ||
| export declare type ExpandOnSettings = 'Auto' | 'Click' | 'DblClick'; | ||
| export declare type SortOrder = 'None' | 'Ascending' | 'Descending'; | ||
@@ -354,2 +358,5 @@ /** | ||
| private spinnerElement; | ||
| private touchClass; | ||
| private editData; | ||
| private editFields; | ||
| private keyConfigs; | ||
@@ -415,7 +422,7 @@ /** | ||
| * Specifies an action that determines whether the node can expand or collapse. The available actions are, | ||
| * * `auto` - The expand/collapse operation happens when you double-click the node in desktop, and when you single-click | ||
| * * `Auto` - The expand/collapse operation happens when you double-click the node in desktop, and when you single-click | ||
| * the node in mobile devices. | ||
| * * `click` - The expand/collapse operation happens when you single-click the node in both desktop and mobile devices. | ||
| * * `dblclick` - The expand/collapse operation happens when you double-click the node in both desktop and mobile devices. | ||
| * @default 'auto' | ||
| * * `Click` - The expand/collapse operation happens when you single-click the node in both desktop and mobile devices. | ||
| * * `DblClick` - The expand/collapse operation happens when you double-click the node in both desktop and mobile devices. | ||
| * @default 'Auto' | ||
| */ | ||
@@ -465,3 +472,3 @@ expandOn: ExpandOnSettings; | ||
| * The CheckBox will be displayed next to the expand/collapse icon of the node. For more information on CheckBoxes, refer to | ||
| * CheckBox](http://ej2.syncfusion.com/documentation/treeview/checkbox.html). | ||
| * [CheckBox](http://ej2.syncfusion.com/documentation/treeview/checkbox.html). | ||
| * @default false | ||
@@ -596,8 +603,7 @@ */ | ||
| private setFullRow(isEnabled); | ||
| private setTouchPopup(isEnabled); | ||
| private setMultiSelect(isEnabled); | ||
| private popupClick(e); | ||
| private templateComplier(template); | ||
| private setDataBinding(); | ||
| private getQuery(mapper, value?); | ||
| private getType(); | ||
| private setRootData(); | ||
@@ -612,2 +618,3 @@ private renderItems(isSorted); | ||
| private finalizeNode(element); | ||
| private updateCheckedProp(); | ||
| private ensureParentCheckState(element); | ||
@@ -634,2 +641,3 @@ private ensureChildCheckState(element, e?); | ||
| private ensureCheckNode(element); | ||
| private getFields(mapper, nodeLevel, dataLevel); | ||
| private getChildFields(mapper, nodeLevel, dataLevel); | ||
@@ -677,3 +685,4 @@ private getChildMapper(mapper); | ||
| private removeHover(); | ||
| private getNodeData(currLi); | ||
| private getNodeData(currLi, fromDS?); | ||
| private getText(currLi, fromDS?); | ||
| private getExpandEvent(currLi, e); | ||
@@ -684,5 +693,9 @@ private reRenderNodes(); | ||
| private createTextbox(liEle, e); | ||
| private updateOldText(liEle); | ||
| private inputFocusOut(e); | ||
| private appendNewText(liEle, txtEle, newText, isInput); | ||
| private getElement(ele); | ||
| private getEditEvent(liEle, newText); | ||
| private getEditEvent(liEle, newText, inpEle); | ||
| private getNodeObject(id); | ||
| private getChildNodeObject(obj, mapper, id); | ||
| private setDragAndDrop(toBind); | ||
@@ -720,2 +733,3 @@ private initializeDrag(); | ||
| private doEnableAction(nodes); | ||
| private setTouchClass(); | ||
| private wireInputEvents(inpEle); | ||
@@ -758,2 +772,7 @@ private wireEditingEvents(toBind); | ||
| /** | ||
| * Initiates the editing of the TreeView node | ||
| * @param {string | Element} node - Specifies ID of TreeView node/TreeView node. | ||
| */ | ||
| beginEdit(node: string | Element): void; | ||
| /** | ||
| * Checks all the unchecked nodes. You can also check specific nodes by passing array of unchecked nodes | ||
@@ -777,3 +796,3 @@ * as argument to this method. | ||
| */ | ||
| disableNodes(nodes?: string[] | Element[]): void; | ||
| disableNodes(nodes: string[] | Element[]): void; | ||
| /** | ||
@@ -800,13 +819,6 @@ * Enables the collection of disabled nodes by passing the ID of nodes or node elements in the array. | ||
| /** | ||
| * Get the node as HTMLElement by passing its node ID. | ||
| * @param {string} node - Specify ID of TreeView node. | ||
| * @hidden | ||
| * Get the node's data such as id, text, parentID, selected, isChecked, and expanded by passing the node element or it's ID. | ||
| * @param {string | Element} node - Specifies ID of TreeView node/TreeView node. | ||
| */ | ||
| getNode(node: string): HTMLElement; | ||
| /** | ||
| * Get the node's data such as text, parentID, selected, isChecked, and expanded by passing the node element or it's ID. | ||
| * @param {string | Element} node - Specify ID of TreeView node/TreeView node. | ||
| * @hidden | ||
| */ | ||
| getNodeDetails(node: string | Element): { | ||
| getNode(node: string | Element): { | ||
| [key: string]: Object; | ||
@@ -825,3 +837,3 @@ }; | ||
| */ | ||
| removeNodes(nodes?: string[] | Element[]): void; | ||
| removeNodes(nodes: string[] | Element[]): void; | ||
| /** | ||
@@ -832,3 +844,3 @@ * Replaces the text of the TreeView node with the given text. | ||
| */ | ||
| replaceText(target: string | Element, newText: string): void; | ||
| updateNode(target: string | Element, newText: string): void; | ||
| /** | ||
@@ -835,0 +847,0 @@ * Unchecks all the checked nodes. You can also uncheck the specific nodes by passing array of checked nodes |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by22.87%
16442516
- Number of package files
- increased by13.61%
192
- Lines of code
- increased by27.76%
177213