ej2-react-layouts
The layout package contains cards, avatars, and splitter components. 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 component which used to construct different layouts using multiple and nested panes.
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. To acquire a license, you can purchase one at https://www.syncfusion.com/sales/products or start a free 30-day trial here.
A free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.
Setup
To install Layout components
and its dependent packages, use the following command.
npm install @syncfusion/ej2-react-layouts
Components included
Following list of components are available in the package
-
Card - Container used to display content in specific structure.
-
Avatar - Used to add images or initials or icons in different shapes and sizes to your application.
-
Splitter - Used to construct a different layout using its multiple and nested panes with resizable.
Supported Frameworks
These components are available in following list of:
- Angular
- React
- Vue
- ASP.NET Core
- ASP.NET MVC
- JavaScript (ES5)
Use Case samples
Key Features
-
Card
-
Header - Header supports to include title, subtitle along with image.
-
Images and Title - Support to include images with customizable caption positions in it.
-
Action Buttons - Supports to add buttons within the card either in vertical or horizontal alignment.
-
Horizontal Card - Allows to align card elements horizontally and also allows to stack the content vertically within horizontal alignment.
-
Avatar
-
Types - Provided 2
types of avatars such as default
and circle
.
-
Sizes - Supports 7
different sizes to adapt the various application scenario.
* xsmall
* small
* medium (default)
* large
* xlarge
-
Splitter
-
Multiple Panes - Provided an option to configure more than two panes.
-
Resizable Panes - Supports resizable to adjust its pane size dynamically.
-
Orientation - The panes can orient either horizontally
or vertically
.
-
Integration - Other React UI components can be integrated within panes.
-
Nested Panes - Another splitter can be integrated within panes to create a complex layout.
Support
Product support is available for through following mediums.
License
Check the license detail here.
Changelog
Check the changelog here
© Copyright 2019 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.