@syncfusion/ej2-layouts - npm Package Compare versions

Comparing version 16.4.42 to 16.4.44

CHANGELOG.md

@@ -5,2 +5,10 @@ # Changelog
 
+### Splitter
+
+#### New Features
+
+- Provided option to configure the splitter and its pane properties such as size, min, max, resizable through data attributes (`data-`).
+
+- Included the public methods for add and remove splitter panes.
+
 ## 16.4.40-beta (2018-12-10)
@@ -7,0 +15,0 @@

dist/ej2-layouts.umd.min.js

 /*!
 *  filename: ej2-layouts.umd.min.js
-*  version : 16.4.42
+*  version : 16.4.44
 *  Copyright Syncfusion Inc. 2001 - 2018. All rights reserved.
@@ -5,0 +5,0 @@ *  Use of this code is subject to the terms of our license.

dist/es6/ej2-layouts.es2015.js

@@ -30,2 +30,5 @@ import { Browser, ChildProperty, Collection, Component, Event, EventHandler, NotifyPropertyChanges, Property, addClass, append, compile, detach, formatUnit, isNullOrUndefined, removeClass, select, selectAll, setStyleAttribute } from '@syncfusion/ej2-base';
 const E_ICONS = 'e-icons';
+/**
+ * Interface to configure pane properties such as its content, size, min, max, and resizable.
+ */
 class PaneProperties extends ChildProperty {
@@ -32,0 +35,0 @@ }

dist/es6/ej2-layouts.es5.js

@@ -43,2 +43,5 @@ import { Browser, ChildProperty, Collection, Component, Event, EventHandler, NotifyPropertyChanges, Property, addClass, append, compile, detach, formatUnit, isNullOrUndefined, removeClass, select, selectAll, setStyleAttribute } from '@syncfusion/ej2-base';
 var E_ICONS = 'e-icons';
+/**
+ * Interface to configure pane properties such as its content, size, min, max, and resizable.
+ */
 var PaneProperties = /** @__PURE__ @class */ (function (_super) {
@@ -45,0 +48,0 @@ __extends(PaneProperties, _super);

dist/global/ej2-layouts.min.js

 /*!
 *  filename: ej2-layouts.min.js
-*  version : 16.4.42
+*  version : 16.4.44
 *  Copyright Syncfusion Inc. 2001 - 2018. All rights reserved.
@@ -5,0 +5,0 @@ *  Use of this code is subject to the terms of our license.

dist/global/index.d.ts

 /*!
 *  filename: index.d.ts
-*  version : 16.4.42
+*  version : 16.4.44
 *  Copyright Syncfusion Inc. 2001 - 2018. All rights reserved.
@@ -5,0 +5,0 @@ *  Use of this code is subject to the terms of our license.

package.json

 {
   "name": "@syncfusion/ej2-layouts",
-  "version": "16.4.42",
+  "version": "16.4.44",
   "description": "A package of Essential JS 2 layout pure CSS components such as card and avatar. The card is used as small container to show content in specific structure, whereas the avatars are icons, initials or figures representing particular person.",
@@ -31,3 +31,11 @@ "author": "Syncfusion Inc.",
     "image",
-    "picture"
+    "picture",
+    "javascript-splitter",
+    "splitter",
+    "split-panes",
+    "split-layout",
+    "split-view",
+    "split-area",
+    "resizable-splitter",
+    "split-container"
   ],
@@ -34,0 +42,0 @@ "repository": {

README.md

 # ej2-layouts
 
-The layout package contains pure CSS components cards and avatars. The card is a small container in which user can
+The layout package contains cards, avatars, and splitter controls. The card is a small container in which user can
 show defined content in specific structure. The avatars are icons, initials or figures representing a particular
 person, used in popular media formats like images, SVG, font icons, and letters.
+The splitter is container control which used to construct different layouts using multiple and nested panes.
 
+![Layout](https://ej2.syncfusion.com/products/images/layout/readme.png)
+
 > This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's [EULA](https://www.syncfusion.com/eula/es/). To acquire a license, you can purchase one at [https://www.syncfusion.com/sales/products](https://www.syncfusion.com/sales/products/?utm_source=npm&utm_campaign=layout) or start a free 30-day trial [here](https://www.syncfusion.com/account/manage-trials/start-trials/?utm_source=npm&utm_campaign=layout).
@@ -13,3 +16,3 @@
 
-To install `Layout components` and its dependent packages, use the following command.
+To install `Layout controls` and its dependent packages, use the following command.
 
@@ -20,5 +23,5 @@ ```sh
 
-## Components included
+## Controls included
 
-Following list of components are available in the package
+Following list of controls are available in the package
 
@@ -35,2 +38,7 @@ * Card - Container used to display content in specific structure.
 
+* Splitter - Used to construct a different layout using its multiple and nested panes with resizable.
+  * [Getting Started](https://ej2.syncfusion.com/documentation/splitter/getting-started/?utm_source=npm&utm_campaign=layout)
+  * [View Online Demos](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=splitter#/material/splitter/default.html)
+  * [Product Page](https://www.syncfusion.com/javascript-ui-controls/splitter/?utm_source=npm&utm_campaign=layout)
+
 ## Use Case samples
@@ -68,2 +76,13 @@
 
+* Splitter
+  * [Multiple Panes](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=splitter#/material/splitter/default.html) - Provided an option to configure more than two panes.
+
+  * [Resizable Panes](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=splitter#/material/splitter/code-editor-layout.html) - Supports resizable to adjust its pane size dynamically.
+
+  * [Orientation](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=splitter#/material/splitter/default.html) - The panes can orient either `horizontally` or `vertically`.
+
+  * [Integration](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=splitter#/material/splitter/accordion-navigation-menu.html) - Other JavaScript UI controls can be integrated within panes.
+
+  * [Nested Panes](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=splitter#/material/splitter/code-editor-layout.html) - Another splitter can be integrated within panes to create a complex layout.
+
 ## Support
@@ -70,0 +89,0 @@

src/splitter/splitter-model.d.ts

@@ -11,3 +11,3 @@ import { Component, Property, setStyleAttribute, ChildProperty, compile } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, addClass, Collection, isNullOrUndefined, append } from '@syncfusion/ej2-base';import { Event, EmitType, EventHandler, selectAll, removeClass, select, Browser, detach, formatUnit } from '@syncfusion/ej2-base';
     /**
-     * Specifies Configure the properties for each pane.
+     * Configures the properties for each pane.
      * @default ''
@@ -18,3 +18,4 @@ */
     /**
-     * Specifies whether a pane is resizable or not resizable.
+     * Specifies the value whether a pane is resizable. By default, the Splitter is resizable in all panes.
+     * You can disable this for any specific panes using this property.
      * @default true
@@ -25,3 +26,3 @@ */
     /**
-     * Specifies the minimum size of a pane. The pane cannon be resized less than the specified minimum size.
+     * Specifies the minimum size of a pane. The pane cannot be resized if it is less than the specified minimum size.
      * @default null
@@ -32,3 +33,3 @@ */
     /**
-     * Specifies the maximum size of a pane. The pane cannon be resized greater than the specified maximum size.
+     * Specifies the maximum size of a pane. The pane cannot be resized if it is more than the specified maximum limit.
      * @default null
@@ -39,3 +40,3 @@ */
     /**
-     * Specifies the content of split pane.
+     * Specifies the content of split pane as plain text, HTML markup, or any other JavaScript controls.
      * @default ''
@@ -42,0 +43,0 @@ */

src/splitter/splitter.d.ts

 import { Component, ChildProperty } from '@syncfusion/ej2-base';
 import { EmitType } from '@syncfusion/ej2-base';
 import { SplitterModel, PanePropertiesModel } from './splitter-model';
+/**
+ * Interface to configure pane properties such as its content, size, min, max, and resizable.
+ */
 export declare class PaneProperties extends ChildProperty<PaneProperties> {
     /**
-     * Specifies Configure the properties for each pane.
+     * Configures the properties for each pane.
      * @default ''
@@ -11,3 +14,4 @@ */
     /**
-     * Specifies whether a pane is resizable or not resizable.
+     * Specifies the value whether a pane is resizable. By default, the Splitter is resizable in all panes.
+     * You can disable this for any specific panes using this property.
      * @default true
@@ -17,3 +21,3 @@ */
     /**
-     * Specifies the minimum size of a pane. The pane cannon be resized less than the specified minimum size.
+     * Specifies the minimum size of a pane. The pane cannot be resized if it is less than the specified minimum size.
      * @default null
@@ -23,3 +27,3 @@ */
     /**
-     * Specifies the maximum size of a pane. The pane cannon be resized greater than the specified maximum size.
+     * Specifies the maximum size of a pane. The pane cannot be resized if it is more than the specified maximum limit.
      * @default null
@@ -29,3 +33,3 @@ */
     /**
-     * Specifies the content of split pane.
+     * Specifies the content of split pane as plain text, HTML markup, or any other JavaScript controls.
      * @default ''
@@ -260,3 +264,3 @@ */
     /**
-     * To access root element after control created.
+     * Contains the root element of splitter.
      */
@@ -266,28 +270,31 @@ element?: HTMLElement;
 export interface ResizeEventArgs {
-    /** To access root element after resizing pane. */
+    /** Contains the root element of resizing pane. */
     element?: HTMLElement;
-    /** Default event arguments */
+    /** Contains default event arguments. */
     event?: Event;
-    /** To get pane elements */
+    /** Contains the corresponding resizing pane. */
     pane?: HTMLElement[];
-    /** Index of pane */
+    /** Contains the index of resizing pane. */
     index?: number[];
-    /** Respective split-bar element */
+    /** Contains the resizing pane’s separator element. */
     separator?: HTMLElement;
-    /** prevent resize start by setting cancel as true */
+    /**
+     * Control the resize action whether the resize action happens continuously.
+     * When you set this argument to true, resize process will be stopped.
+     */
     cancel?: boolean;
 }
 export interface ResizingEventArgs {
-    /** To access root element after control created */
+    /** Contains the root element of resizing pane. */
     element?: HTMLElement;
-    /** Default event arguments */
+    /** Contains default event arguments. */
     event?: Event;
-    /** To get paneSize */
+    /** Contains a pane size when it resizes. */
     paneSize?: number[];
-    /** To get pane elements */
+    /** Contains the corresponding resizing pane. */
     pane?: HTMLElement[];
-    /** Index of pane */
+    /** Contains the index of resizing pane. */
     index?: number[];
-    /** Respective split-bar element */
+    /** Contains the resizing pane’s separator element. */
     separator?: HTMLElement;
 }

src/splitter/splitter.js

@@ -44,2 +44,5 @@ var __extends = (this && this.__extends) || (function () {
 var E_ICONS = 'e-icons';
+/**
+ * Interface to configure pane properties such as its content, size, min, max, and resizable.
+ */
 var PaneProperties = /** @class */ (function (_super) {
@@ -46,0 +49,0 @@ __extends(PaneProperties, _super);

New alerts

License Policy Violation

License

This 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

License

This 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

969013

increased by0.36%

Lines of code

14786

increased by0.12%

Number of lines in readme file

101

increased by23.17%

No dependency changes