Skip to content

Commit 872dbeb

Browse files
MaithiliyKMaithiliyK
authored
Merge pull request #1 from SyncfusionExamples/969759-liveTreegrid
969759: Committed the react live treegrid sample.
2 parents b371605 + 013559c commit 872dbeb

File tree

80 files changed

+25703
-1
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

80 files changed

+25703
-1
lines changed

‎README.md‎

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,26 @@
11
# React-Feature-Rich-TreeGrid
2-
This repository contains a complete example that shows how to use all the main features of the React TreeGrid component in one place, making it easier to explore and understand its capabilities.
2+
3+
This sample demonstrates the full capabilities of the Syncfusion [React TreeGrid](https://www.syncfusion.com/react-components/react-tree-grid) by integrating all available APIs into a single, interactive experience. Users can dynamically enable or disable features such as hierarchical data binding, expand/collapse, sorting, filtering, paging, editing, and exporting— directly through the UI, without writing a single line of code. This makes it an ideal tool for presales evaluations, customer demos, and internal testing, allowing users to explore and understand the TreeGrid’s flexibility and power in real time.
4+
5+
<p align="center">
6+
<img src="src/assets/images/react-treegrid-preview.jpg" alt="React TreeGrid Preview"/>
7+
</p>
8+
9+
## Project prerequisites
10+
Make sure that you have the compatible versions of [Visual Studio Code](https://code.visualstudio.com/download ) and [NodeJS](https://nodejs.org/en/download) or later version in your machine before starting to work on this project.
11+
12+
## How to run this application?
13+
14+
1. Clone the react-feature-rich-treegrid repository.
15+
2. Run the `npm install` command to install the required packages
16+
3. Replace YOUR_LICENSE_KEY in registerLicense method of the index.tsx file with your license key.
17+
18+
<p align="center">
19+
<img src="src/assets/images/register_license.png" alt="React TreeGrid Preview"/>
20+
</p>
21+
22+
4. Run your project using the `npm start` command.
23+
24+
## Further information
25+
For more information, check the [Syncfusion React TreeGrid example](https://ej2.syncfusion.com/react/demos/#/tailwind3/treegrid/treegrid-overview),
26+
[Syncfusion React TreeGrid documentation](https://ej2.syncfusion.com/react/documentation/treegrid/getting-started).

‎favicon.ico‎

6.42 KB
Binary file not shown.

‎index.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="description" content="Essential JS 2 for React - Feature Rich TreeGrid">
8+
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
9+
<title>Essential JS 2 for React - TreeGrid</title>
10+
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
11+
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type="text/javascript"></script>
12+
<link href="https://cdn.syncfusion.com/ej2/29.1.33/material3.css" class="theme-primary" rel="stylesheet">
13+
</head>
14+
15+
<body>
16+
<div id="content-area" style="margin-left:10px;margin-right:10px;"></div>
17+
</body>
18+
19+
</html>

‎license‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
Essential JS 2 library is available under the Syncfusion Essential Studio program, and can be licensed either under the Syncfusion Community License Program or the Syncfusion commercial license.
2+
3+
To be qualified for the Syncfusion Community License Program you must have a gross revenue of less than one (1) million U.S. dollars ($1,000,000.00 USD) per year and have less than five (5) developers in your organization, and agree to be bound by Syncfusion’s terms and conditions.
4+
5+
Customers who do not qualify for the community license can contact sales@syncfusion.com for commercial licensing options.
6+
7+
Under no circumstances can you use this product without (1) either a Community License or a commercial license and (2) without agreeing and abiding by Syncfusion’s license containing all terms and conditions.
8+
9+
The Syncfusion license that contains the terms and conditions can be found at
10+
https://www.syncfusion.com/content/downloads/syncfusion_license.pdf

‎package.json‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"name": "@syncfusion/ej2-react-feature-rich-treegrid",
3+
"version": "1.0.0",
4+
"description": "Essential JS 2 - Sample name",
5+
"author": "Syncfusion Inc.",
6+
"license": "SEE LICENSE IN license",
7+
"scripts": {
8+
"start": "webpack-dev-server --open --mode development",
9+
"build": "webpack --mode production"
10+
},
11+
"devDependencies": {
12+
"@types/node": "^20.4.1",
13+
"@types/react": "^18.2.14",
14+
"@types/react-dom": "^18.2.6",
15+
"@types/react-router-dom": "^5.3.3",
16+
"css-loader": "^6.8.1",
17+
"html-webpack-plugin": "^5.5.3",
18+
"mini-css-extract-plugin": "^2.7.6",
19+
"terser-webpack-plugin": "^5.3.9",
20+
"ts-loader": "^9.4.4",
21+
"typescript": "^5.1.6",
22+
"webpack": "^5.88.1",
23+
"webpack-cli": "^5.1.4",
24+
"webpack-dev-server": "^4.15.1"
25+
},
26+
"dependencies": {
27+
"@syncfusion/ej2-react-buttons": "*",
28+
"@syncfusion/ej2-react-calendars": "*",
29+
"@syncfusion/ej2-react-dropdowns": "*",
30+
"@syncfusion/ej2-react-grids": "*",
31+
"@syncfusion/ej2-react-treegrid": "*",
32+
"@syncfusion/ej2-react-inputs": "*",
33+
"@syncfusion/ej2-react-lists": "*",
34+
"@syncfusion/ej2-react-navigations": "*",
35+
"@syncfusion/ej2-react-popups": "*",
36+
"@syncfusion/ej2-react-progressbar": "*",
37+
"react": "^18.2.0",
38+
"react-dom": "^18.2.0",
39+
"react-router-dom": "^6.14.1"
40+
}
41+
}

‎src/assets/images/China-16.jpg‎

1.19 KB
Loading

‎src/assets/images/China.jpg‎

1.34 KB
Loading

‎src/assets/images/France-16.jpg‎

837 Bytes
Loading

‎src/assets/images/France.jpg‎

673 Bytes
Loading

‎src/assets/images/UAE-16.jpg‎

899 Bytes
Loading

0 commit comments

Comments
 (0)