From b1fe98b4446577eebae2839e7a758d7ca2b7bd08 Mon Sep 17 00:00:00 2001 From: Saranya13 Date: Thu, 22 Jan 2026 12:52:51 +0530 Subject: [PATCH 1/6] Updated readme content --- README.md | 577 +++++++++++++++++++++++++++++++++++++----------------- 1 file changed, 396 insertions(+), 181 deletions(-) diff --git a/README.md b/README.md index a205e247d..62ea225c4 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ # Syncfusion React UI Components Library (Essential JS 2) - Syncfusion React UI Components library has been built from the ground up to be lightweight, responsive, modular and touch friendly. It offers 70+ UI components that every applications will ever need. + Syncfusion React UI Components library has been built from the ground up to be lightweight, responsive, modular and touch friendly. It offers 100+ UI components that every applications will ever need. > 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 or start a free 30-day trial here (https://www.syncfusion.com/account/manage-trials/start-trials). > > A free community license (https://www.syncfusion.com/products/communitylicense) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers. @@ -36,10 +36,10 @@ npm package @syncfusion/ej2-react-grids      code coverage of @syncfusion/ej2-react-grids - Source + Source - Live demo + Live demo Documentation @@ -53,32 +53,15 @@ npm package @syncfusion/ej2-react-pivotview      code coverage of @syncfusion/ej2-react-pivotview - Source + Source - Live demo + Live demo Documentation - - - Spreadsheet - - - npm package @syncfusion/ej2-react-spreadsheet      code coverage of @syncfusion/ej2-react-spreadsheet - - - Source - - - Live demo - - - Documentation - - Tree Grid @@ -87,10 +70,10 @@ npm package @syncfusion/ej2-react-treegrid      code coverage of @syncfusion/ej2-react-treegrid - Source + Source - Live demo + Live demo Documentation @@ -109,10 +92,10 @@ npm package @syncfusion/ej2-react-inplace-editor      code coverage of @syncfusion/ej2-react-inplace-editor - Source + Source - Live demo + Live demo Documentation @@ -120,16 +103,16 @@ - Rich Text Editor + Rich Text Editor npm package @syncfusion/ej2-react-richtexteditor      code coverage of @syncfusion/ej2-react-richtexteditor - Source + Source - Live demo + Live demo Documentation @@ -137,21 +120,23 @@ - Word Processor + Block Editor - npm package @syncfusion/ej2-react-documenteditor      code coverage of @syncfusion/ej2-react-documenteditor + npm package @syncfusion/ej2-react-blockeditor      code coverage of @syncfusion/ej2-react-blockeditor - Source + Source - Live demo + Live demo - Documentation + Documentation + + ### Dropdowns @@ -165,10 +150,10 @@ npm package @syncfusion/ej2-react-dropdowns      code coverage of @syncfusion/ej2-react-dropdowns - Source + Source - Live demo + Live demo Documentation @@ -179,10 +164,10 @@ ComboBox - Source + Source - Live demo + Live demo Documentation @@ -193,10 +178,10 @@ Dropdown List - Source + Source - Live demo + Live demo Documentation @@ -207,10 +192,10 @@ Dropdown Tree - Source + Source - Live demo + Live demo Documentation @@ -221,10 +206,10 @@ List Box - Source + Source - Live demo + Live demo Documentation @@ -235,15 +220,43 @@ MultiSelect Dropdown - Source + Source - Live demo + Live demo Documentation + + + Mention + + + Source + + + Live demo + + + Documentation + + + + + MultiColumn ComboBox + + + Source + + + Live demo + + + Documentation + + ### Inputs @@ -257,10 +270,10 @@ npm package @syncfusion/ej2-react-buttons      code coverage of @syncfusion/ej2-react-buttons - Source + Source - Live demo + Live demo Documentation @@ -271,10 +284,10 @@ Radio Button - Source + Source - Live demo + Live demo Documentation @@ -285,10 +298,10 @@ Toggle Switch Button - Source + Source - Live demo + Live demo Documentation @@ -302,10 +315,10 @@ npm package @syncfusion/ej2-react-inputs      code coverage of @syncfusion/ej2-react-inputs - Source + Source - Live demo + Live demo Documentation @@ -316,10 +329,10 @@ File Upload - Source + Source - Live demo + Live demo Documentation @@ -330,10 +343,10 @@ Input Mask - Source + Source - Live demo + Live demo Documentation @@ -344,10 +357,10 @@ Numeric Textbox - Source + Source - Live demo + Live demo Documentation @@ -358,10 +371,10 @@ Range Slider - Source + Source - Live demo + Live demo Documentation @@ -372,10 +385,10 @@ TextBox - Source + Source - Live demo + Live demo Documentation @@ -383,18 +396,95 @@ - Signature + Signature - Source + Source - Live demo + Live demo Documentation + + + TextArea + + + Source + + + Live demo + + + Documentation + + + + + Rating + + + Source + + + Live demo + + + Documentation + + + + + OTP Input + + + Source + + + Live demo + + + Documentation + + + + +### Interactive Chat + + + + + + + + + + + + + +
+ AI Assist View + + npm package @syncfusion/ej2-react-interactive-chat      code coverage of @syncfusion/ej2-react-interactive-chat + + Source + + Live demo + + Documentation +
+ Chat UI + + Source + + Live demo + + Documentation +
### Data Visualization @@ -408,10 +498,10 @@ npm package @syncfusion/ej2-react-barcode-generator      code coverage of @syncfusion/ej2-react-barcode-generator - Source + Source - Live demo + Live demo Documentation @@ -425,10 +515,10 @@ npm package @syncfusion/ej2-react-circulargauge      code coverage of @syncfusion/ej2-react-circulargauge - Source + Source - Live demo + Live demo Documentation @@ -442,10 +532,10 @@ npm package @syncfusion/ej2-react-diagrams      code coverage of @syncfusion/ej2-react-diagrams - Source + Source - Live demo + Live demo Documentation @@ -459,10 +549,10 @@ npm package @syncfusion/ej2-react-heatmap      code coverage of @syncfusion/ej2-react-heatmap - Source + Source - Live demo + Live demo Documentation @@ -476,10 +566,10 @@ npm package @syncfusion/ej2-react-kanban      code coverage of @syncfusion/ej2-react-kanban - Source + Source - Live demo + Live demo Documentation @@ -493,10 +583,10 @@ npm package @syncfusion/ej2-react-lineargauge      code coverage of @syncfusion/ej2-react-lineargauge - Source + Source - Live demo + Live demo Documentation @@ -510,10 +600,10 @@ npm package @syncfusion/ej2-react-maps      code coverage of @syncfusion/ej2-react-maps - Source + Source - Live demo + Live demo Documentation @@ -527,10 +617,10 @@ npm package @syncfusion/ej2-react-treemap      code coverage of @syncfusion/ej2-react-treemap - Source + Source - Live demo + Live demo Documentation @@ -544,10 +634,10 @@ npm package @syncfusion/ej2-react-charts      code coverage of @syncfusion/ej2-react-charts - Source + Source - Live demo + Live demo Documentation @@ -558,24 +648,52 @@ Charts - Source + Source - Live demo + Live demo Documentation + + + 3D Chart + + + Source + + + Live demo + + + Documentation + + + + + 3D Cirular Chart + + + Source + + + Live demo + + + Documentation + + Range Selector - Source + Source - Live demo + Live demo Documentation @@ -586,10 +704,10 @@ Smith Chart - Source + Source - Live demo + Live demo Documentation @@ -600,10 +718,10 @@ Sparkline Charts - Source + Source - Live demo + Live demo Documentation @@ -614,10 +732,10 @@ Stock Chart - Source + Source - Live demo + Live demo Documentation @@ -636,10 +754,10 @@ npm package @syncfusion/ej2-react-calendars      code coverage of @syncfusion/ej2-react-calendars - Source + Source - Live demo + Live demo Documentation @@ -650,10 +768,10 @@ DatePicker - Source + Source - Live demo + Live demo Documentation @@ -664,10 +782,10 @@ DateRangePicker - Source + Source - Live demo + Live demo Documentation @@ -678,10 +796,10 @@ DateTime Picker - Source + Source - Live demo + Live demo Documentation @@ -692,10 +810,10 @@ TimePicker - Source + Source - Live demo + Live demo Documentation @@ -709,10 +827,10 @@ npm package @syncfusion/ej2-react-gantt      code coverage of @syncfusion/ej2-react-gantt - Source + Source - Live demo + Live demo Documentation @@ -726,10 +844,10 @@ npm package @syncfusion/ej2-react-schedule      code coverage of @syncfusion/ej2-react-schedule - Source + Source - Live demo + Live demo Documentation @@ -748,24 +866,38 @@ npm package @syncfusion/ej2-react-navigations      code coverage of @syncfusion/ej2-react-navigations - Source + Source - Live demo + Live demo Documentation + + + + Appbar + + + Source + + + Live demo + + + Documentation + Breadcrumb - Source + Source - Live demo + Live demo Documentation @@ -776,10 +908,10 @@ Carousel - Source + Source - Live demo + Live demo Documentation @@ -790,10 +922,10 @@ Context Menu - Source + Source - Live demo + Live demo Documentation @@ -804,38 +936,53 @@ Menu Bar - Source + Source - Live demo + Live demo Documentation + Sidebar - Source + Source - Live demo + Live demo Documentation + + + Stepper + + + Source + + + Live demo + + + Documentation + + Tabs - Source + Source - Live demo + Live demo Documentation @@ -846,10 +993,10 @@ Toolbar - Source + Source - Live demo + Live demo Documentation @@ -860,10 +1007,10 @@ TreeView - Source + Source - Live demo + Live demo Documentation @@ -877,15 +1024,32 @@ npm package @syncfusion/ej2-react-filemanager      code coverage of @syncfusion/ej2-react-filemanager - Source + Source - Live demo + Live demo Documentation + + + Ribbon + + + npm package @syncfusion/ej2-react-filemanager      code coverage of @syncfusion/ej2-react-ribbon + + + Source + + + Live demo + + + Documentation + + ### Buttons @@ -899,10 +1063,10 @@ npm package @syncfusion/ej2-react-buttons      code coverage of @syncfusion/ej2-react-buttons - Source + Source - Live demo + Live demo Documentation @@ -913,10 +1077,10 @@ Chips - Source + Source - Live demo + Live demo Documentation @@ -930,10 +1094,10 @@ npm package @syncfusion/ej2-react-splitbuttons      code coverage of @syncfusion/ej2-react-splitbuttons - Source + Source - Live demo + Live demo Documentation @@ -944,10 +1108,10 @@ Dropdown Menu - Source + Source - Live demo + Live demo Documentation @@ -958,10 +1122,10 @@ Progress Button - Source + Source - Live demo + Live demo Documentation @@ -972,15 +1136,43 @@ Split Button - Source + Source - Live demo + Live demo Documentation + + + FAB + + + Source + + + Live demo + + + Documentation + + + + + Speed Dial + + + Source + + + Live demo + + + Documentation + + ### Layout @@ -994,10 +1186,10 @@ npm package @syncfusion/ej2-react-layouts      code coverage of @syncfusion/ej2-react-layouts - Styles + Styles - Live demo + Live demo Documentation @@ -1008,10 +1200,10 @@ Card - Styles + Styles - Live demo + Live demo Documentation @@ -1022,10 +1214,10 @@ Dashboard Layout - Source + Source - Live demo + Live demo Documentation @@ -1036,10 +1228,10 @@ Splitter - Source + Source - Live demo + Live demo Documentation @@ -1053,10 +1245,10 @@ npm package @syncfusion/ej2-react-popups      code coverage of @syncfusion/ej2-react-popups - Source + Source - Live demo + Live demo Documentation @@ -1067,15 +1259,29 @@ Tooltip - Source + Source - Live demo + Live demo Documentation + + + Timeline + + + Source + + + Live demo + + + Documentation + + ListView @@ -1084,10 +1290,10 @@ npm package @syncfusion/ej2-react-lists      code coverage of @syncfusion/ej2-react-lists - Source + Source - Live demo + Live demo Documentation @@ -1106,10 +1312,10 @@ npm package @syncfusion/ej2-react-notifications      code coverage of @syncfusion/ej2-react-notifications - Styles + Styles - Live demo + Live demo Documentation @@ -1120,10 +1326,10 @@ Toast - Source + Source - Live demo + Live demo Documentation @@ -1131,63 +1337,69 @@ - Progress Bar + Message - npm package @syncfusion/ej2-react-progressbar      code coverage of @syncfusion/ej2-react-progressbar + Source + + + Live demo - Source + Documentation + + - Live demo + Skeleton - Documentation + Source + + + Live demo + + + Documentation - - -### Forms - -
- Query Builder UI + Progress Bar - npm package @syncfusion/ej2-react-querybuilder      code coverage of @syncfusion/ej2-react-querybuilder + npm package @syncfusion/ej2-react-progressbar      code coverage of @syncfusion/ej2-react-progressbar - Source + Source - Live demo + Live demo - Documentation + Documentation
-### Viewer +### Forms
- PDF Viewer + Query Builder UI - npm package @syncfusion/ej2-react-pdfviewer      code coverage of @syncfusion/ej2-react-pdfviewer + npm package @syncfusion/ej2-react-querybuilder      code coverage of @syncfusion/ej2-react-querybuilder - Source + Source - Live demo + Live demo - Documentation + Documentation
@@ -1199,14 +1411,17 @@ * [Vue.js](https://www.syncfusion.com/vue-ui-components?utm_source=npm&utm_campaign=ej2-react-ui-components) * [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) * [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) + ## Support Product support is available for through following mediums. * Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_campaign=ej2-react-ui-components) support system or [Community forum](https://www.syncfusion.com/forums/react-js2?utm_source=npm&utm_campaign=ej2-react-ui-components). * New [GitHub issue](https://github.com/syncfusion/ej2-react-ui-components/issues/new). * Ask your query in [Stack Overflow](https://stackoverflow.com/) with tag `syncfusion` and `ej2`. + ## License Check the license detail [here](https://github.com/syncfusion/ej2-react-ui-components/blob/master/license). + ## Changelog Check the changelog [here](https://ej2.syncfusion.com/react/documentation/release-notes/index/?utm_source=npm&utm_campaign=ej2-react-ui-components) - © Copyright 2022 Syncfusion, Inc. All Rights Reserved. + © Copyright 2026 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution. From 3a96e100ea3a9c5db9a34fae99c9705263ed1279 Mon Sep 17 00:00:00 2001 From: Saranya13 Date: Thu, 22 Jan 2026 14:51:29 +0530 Subject: [PATCH 2/6] updated readme content --- README.md | 199 ++++++++++++++++++++++++++++++++---------------------- 1 file changed, 120 insertions(+), 79 deletions(-) diff --git a/README.md b/README.md index 62ea225c4..2d36e539a 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ # Syncfusion React UI Components Library (Essential JS 2) - Syncfusion React UI Components library has been built from the ground up to be lightweight, responsive, modular and touch friendly. It offers 100+ UI components that every applications will ever need. + Syncfusion React UI Components library has been built from the ground up to be lightweight, responsive, modular and touch friendly. It offers 145+ UI components that every applications will ever need. > 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 or start a free 30-day trial here (https://www.syncfusion.com/account/manage-trials/start-trials). > > A free community license (https://www.syncfusion.com/products/communitylicense) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers. @@ -30,7 +30,7 @@
- Data Grid + Data Grid npm package @syncfusion/ej2-react-grids      code coverage of @syncfusion/ej2-react-grids @@ -47,7 +47,7 @@
- Pivot Table + Pivot Table npm package @syncfusion/ej2-react-pivotview      code coverage of @syncfusion/ej2-react-pivotview @@ -64,7 +64,7 @@
- Tree Grid + Tree Grid npm package @syncfusion/ej2-react-treegrid      code coverage of @syncfusion/ej2-react-treegrid @@ -81,12 +81,38 @@
+### Smart Components + + + + + + + + + + + +
+ Smart Paste Button + + Live demo + + Documentation +
+ Smart Text Area + + Live demo + + Documentation +
+ ### Editors + + + + + + -
- In-place Editor + In-place Editor npm package @syncfusion/ej2-react-inplace-editor      code coverage of @syncfusion/ej2-react-inplace-editor @@ -135,8 +161,23 @@ Documentation
+ Image Editor + + npm package @syncfusion/ej2-react-image-editor      code coverage of @syncfusion/ej2-react-image-editor + + Source + + Live demo + + Documentation +
### Dropdowns @@ -144,7 +185,7 @@
- AutoComplete + AutoComplete npm package @syncfusion/ej2-react-dropdowns      code coverage of @syncfusion/ej2-react-dropdowns @@ -161,7 +202,7 @@
- ComboBox + ComboBox Source @@ -175,7 +216,7 @@
- Dropdown List + Dropdown List Source @@ -189,7 +230,7 @@
- Dropdown Tree + Dropdown Tree Source @@ -203,7 +244,7 @@
- List Box + List Box Source @@ -217,7 +258,7 @@
- MultiSelect Dropdown + MultiSelect Dropdown Source @@ -231,7 +272,7 @@
- Mention + Mention Source @@ -264,7 +305,7 @@
- Checkbox + Checkbox npm package @syncfusion/ej2-react-buttons      code coverage of @syncfusion/ej2-react-buttons @@ -281,7 +322,7 @@
- Radio Button + Radio Button Source @@ -295,7 +336,7 @@
- Toggle Switch Button + Toggle Switch Button Source @@ -309,7 +350,7 @@
- Color Picker + Color Picker npm package @syncfusion/ej2-react-inputs      code coverage of @syncfusion/ej2-react-inputs @@ -326,7 +367,7 @@
- File Upload + File Upload Source @@ -340,7 +381,7 @@
- Input Mask + Input Mask Source @@ -354,7 +395,7 @@
- Numeric Textbox + Numeric Textbox Source @@ -368,7 +409,7 @@
- Range Slider + Range Slider Source @@ -382,7 +423,7 @@
- TextBox + TextBox Source @@ -396,7 +437,7 @@
- Signature + Signature Source @@ -410,7 +451,7 @@
- TextArea + TextArea Source @@ -424,7 +465,7 @@
- Rating + Rating Source @@ -492,7 +533,7 @@
- Barcode Generator + Barcode Generator npm package @syncfusion/ej2-react-barcode-generator      code coverage of @syncfusion/ej2-react-barcode-generator @@ -509,7 +550,7 @@
- Circular Gauge + Circular Gauge npm package @syncfusion/ej2-react-circulargauge      code coverage of @syncfusion/ej2-react-circulargauge @@ -526,7 +567,7 @@
- Diagram + Diagram npm package @syncfusion/ej2-react-diagrams      code coverage of @syncfusion/ej2-react-diagrams @@ -543,7 +584,7 @@
- HeatMap Chart + HeatMap Chart npm package @syncfusion/ej2-react-heatmap      code coverage of @syncfusion/ej2-react-heatmap @@ -560,7 +601,7 @@
- Kanban + Kanban npm package @syncfusion/ej2-react-kanban      code coverage of @syncfusion/ej2-react-kanban @@ -577,7 +618,7 @@
- Linear Gauge + Linear Gauge npm package @syncfusion/ej2-react-lineargauge      code coverage of @syncfusion/ej2-react-lineargauge @@ -594,7 +635,7 @@
- Maps + Maps npm package @syncfusion/ej2-react-maps      code coverage of @syncfusion/ej2-react-maps @@ -611,7 +652,7 @@
- TreeMap + TreeMap npm package @syncfusion/ej2-react-treemap      code coverage of @syncfusion/ej2-react-treemap @@ -628,7 +669,7 @@
- Bullet Chart + Bullet Chart npm package @syncfusion/ej2-react-charts      code coverage of @syncfusion/ej2-react-charts @@ -645,7 +686,7 @@
- Charts + Charts Source @@ -687,7 +728,7 @@
- Range Selector + Range Selector Source @@ -701,7 +742,7 @@
- Smith Chart + Smith Chart Source @@ -715,7 +756,7 @@
- Sparkline Charts + Sparkline Charts Source @@ -729,7 +770,7 @@
- Stock Chart + Stock Chart Source @@ -748,7 +789,7 @@
- Calendar + Calendar npm package @syncfusion/ej2-react-calendars      code coverage of @syncfusion/ej2-react-calendars @@ -765,7 +806,7 @@
- DatePicker + DatePicker Source @@ -779,7 +820,7 @@
- DateRangePicker + DateRangePicker Source @@ -793,7 +834,7 @@
- DateTime Picker + DateTime Picker Source @@ -807,7 +848,7 @@
- TimePicker + TimePicker Source @@ -821,7 +862,7 @@
- Gantt Chart + Gantt Chart npm package @syncfusion/ej2-react-gantt      code coverage of @syncfusion/ej2-react-gantt @@ -838,7 +879,7 @@
- Scheduler + Scheduler npm package @syncfusion/ej2-react-schedule      code coverage of @syncfusion/ej2-react-schedule @@ -860,7 +901,7 @@
- Accordion + Accordion npm package @syncfusion/ej2-react-navigations      code coverage of @syncfusion/ej2-react-navigations @@ -891,7 +932,7 @@
- Breadcrumb + Breadcrumb Source @@ -905,7 +946,7 @@
- Carousel + Carousel Source @@ -919,7 +960,7 @@
- Context Menu + Context Menu Source @@ -933,7 +974,7 @@
- Menu Bar + Menu Bar Source @@ -948,7 +989,7 @@
- Sidebar + Sidebar Source @@ -962,7 +1003,7 @@
- Stepper + Stepper Source @@ -976,7 +1017,7 @@
- Tabs + Tabs Source @@ -990,7 +1031,7 @@
- Toolbar + Toolbar Source @@ -1004,7 +1045,7 @@
- TreeView + TreeView Source @@ -1018,7 +1059,7 @@
- File Manager + File Manager npm package @syncfusion/ej2-react-filemanager      code coverage of @syncfusion/ej2-react-filemanager @@ -1035,13 +1076,13 @@
- Ribbon + Ribbon - npm package @syncfusion/ej2-react-filemanager      code coverage of @syncfusion/ej2-react-ribbon + npm package @syncfusion/ej2-react-ribbon      code coverage of @syncfusion/ej2-react-ribbon - Source + Source Live demo @@ -1057,7 +1098,7 @@
- Button + Button npm package @syncfusion/ej2-react-buttons      code coverage of @syncfusion/ej2-react-buttons @@ -1074,7 +1115,7 @@
- Chips + Chips Source @@ -1088,7 +1129,7 @@
- Button Group + Button Group npm package @syncfusion/ej2-react-splitbuttons      code coverage of @syncfusion/ej2-react-splitbuttons @@ -1105,7 +1146,7 @@
- Dropdown Menu + Dropdown Menu Source @@ -1119,7 +1160,7 @@
- Progress Button + Progress Button Source @@ -1133,7 +1174,7 @@
- Split Button + Split Button Source @@ -1147,7 +1188,7 @@
- FAB + FAB Source @@ -1180,7 +1221,7 @@
- Avatar + Avatar npm package @syncfusion/ej2-react-layouts      code coverage of @syncfusion/ej2-react-layouts @@ -1197,7 +1238,7 @@
- Card + Card Styles @@ -1211,7 +1252,7 @@
- Dashboard Layout + Dashboard Layout Source @@ -1225,7 +1266,7 @@
- Splitter + Splitter Source @@ -1239,7 +1280,7 @@
- Dialog + Dialog npm package @syncfusion/ej2-react-popups      code coverage of @syncfusion/ej2-react-popups @@ -1256,7 +1297,7 @@
- Tooltip + Tooltip Source @@ -1270,7 +1311,7 @@
- Timeline + Timeline Source @@ -1284,7 +1325,7 @@
- ListView + ListView npm package @syncfusion/ej2-react-lists      code coverage of @syncfusion/ej2-react-lists @@ -1306,7 +1347,7 @@
- Badge + Badge npm package @syncfusion/ej2-react-notifications      code coverage of @syncfusion/ej2-react-notifications @@ -1323,7 +1364,7 @@
- Toast + Toast Source @@ -1365,7 +1406,7 @@
- Progress Bar + Progress Bar npm package @syncfusion/ej2-react-progressbar      code coverage of @syncfusion/ej2-react-progressbar @@ -1387,7 +1428,7 @@
- Query Builder UI + Query Builder UI npm package @syncfusion/ej2-react-querybuilder      code coverage of @syncfusion/ej2-react-querybuilder From 3f14fe7fa671645b76cb6ad84b049f4cf2bf444e Mon Sep 17 00:00:00 2001 From: Saranya13 Date: Thu, 22 Jan 2026 17:48:52 +0530 Subject: [PATCH 3/6] Updated readme content --- README.md | 1547 +++-------------------------------------------------- 1 file changed, 86 insertions(+), 1461 deletions(-) diff --git a/README.md b/README.md index 2d36e539a..5f71a9563 100644 --- a/README.md +++ b/README.md @@ -1,1451 +1,85 @@ -# Syncfusion React UI Components Library (Essential JS 2) - Syncfusion React UI Components library has been built from the ground up to be lightweight, responsive, modular and touch friendly. It offers 145+ UI components that every applications will ever need. - > 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 or start a free 30-day trial here (https://www.syncfusion.com/account/manage-trials/start-trials). -> -> A free community license (https://www.syncfusion.com/products/communitylicense) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers. - ## Resources - * [Getting Started](https://ej2.syncfusion.com/react/documentation/getting-started/quick-start?utm_source=npm&utm_campaign=ej2-react-ui-components) -* [View Online Demos](https://ej2.syncfusion.com/react/demos?utm_source=npm&utm_campaign=ej2-react-ui-components) -* [Product Page](https://www.syncfusion.com/react-ui-components?utm_source=npm&utm_campaign=ej2-react-ui-components) - ## Framework highlights - ### Lightweight and user friendly - The entire Library framework is built from scratch to be lightweight and modular. Its footprint can be reduced further by including only the specific components and features your application requires. - ### Modular architecture - All components have been built as modules to enable selective referencing, so only the components and features you need are included in your application. - ### Built for performance - Performance is critical for delivering a good user experience. We ensure that all our components are designed and built to achieve the best performance possible. - ### Responsive and touch friendly - All the components are touch friendly and render adaptively based on the device they are on to provide optimal usage experience on phones, tablets and desktops. - ### Stunning built-in themes - Pixel-perfect built-in themes are available in material, bootstrap and fabric design. In addition, it comes with Accessible high-contrast theme and an online tool "[Theme Studio](https://ej2.syncfusion.com/themestudio/)" to customize the provided built-in themes. - ### Globalization simplified - Easily build applications to be used by a global audience in various language and culture settings. - ### Stay current - With our commitment to at least four major updates per year, you receive the most up-to-date functionality and new components in addition to monthly service packs and bug fixes. Custom patches are available as needed. - - ## Control List - -### Grids - - - - - - - - - - - - - - - - - - - - - - - -
- Data Grid - - npm package @syncfusion/ej2-react-grids      code coverage of @syncfusion/ej2-react-grids - - Source - - Live demo - - Documentation -
- Pivot Table - - npm package @syncfusion/ej2-react-pivotview      code coverage of @syncfusion/ej2-react-pivotview - - Source - - Live demo - - Documentation -
- Tree Grid - - npm package @syncfusion/ej2-react-treegrid      code coverage of @syncfusion/ej2-react-treegrid - - Source - - Live demo - - Documentation -
- -### Smart Components - - - - - - - - - - - -
- Smart Paste Button - - Live demo - - Documentation -
- Smart Text Area - - Live demo - - Documentation -
- -### Editors - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- In-place Editor - - npm package @syncfusion/ej2-react-inplace-editor      code coverage of @syncfusion/ej2-react-inplace-editor - - Source - - Live demo - - Documentation -
- Rich Text Editor - - npm package @syncfusion/ej2-react-richtexteditor      code coverage of @syncfusion/ej2-react-richtexteditor - - Source - - Live demo - - Documentation -
- Block Editor - - npm package @syncfusion/ej2-react-blockeditor      code coverage of @syncfusion/ej2-react-blockeditor - - Source - - Live demo - - Documentation -
- Image Editor - - npm package @syncfusion/ej2-react-image-editor      code coverage of @syncfusion/ej2-react-image-editor - - Source - - Live demo - - Documentation -
- -### Dropdowns - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- AutoComplete - - npm package @syncfusion/ej2-react-dropdowns      code coverage of @syncfusion/ej2-react-dropdowns - - Source - - Live demo - - Documentation -
- ComboBox - - Source - - Live demo - - Documentation -
- Dropdown List - - Source - - Live demo - - Documentation -
- Dropdown Tree - - Source - - Live demo - - Documentation -
- List Box - - Source - - Live demo - - Documentation -
- MultiSelect Dropdown - - Source - - Live demo - - Documentation -
- Mention - - Source - - Live demo - - Documentation -
- MultiColumn ComboBox - - Source - - Live demo - - Documentation -
- -### Inputs - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Checkbox - - npm package @syncfusion/ej2-react-buttons      code coverage of @syncfusion/ej2-react-buttons - - Source - - Live demo - - Documentation -
- Radio Button - - Source - - Live demo - - Documentation -
- Toggle Switch Button - - Source - - Live demo - - Documentation -
- Color Picker - - npm package @syncfusion/ej2-react-inputs      code coverage of @syncfusion/ej2-react-inputs - - Source - - Live demo - - Documentation -
- File Upload - - Source - - Live demo - - Documentation -
- Input Mask - - Source - - Live demo - - Documentation -
- Numeric Textbox - - Source - - Live demo - - Documentation -
- Range Slider - - Source - - Live demo - - Documentation -
- TextBox - - Source - - Live demo - - Documentation -
- Signature - - Source - - Live demo - - Documentation -
- TextArea - - Source - - Live demo - - Documentation -
- Rating - - Source - - Live demo - - Documentation -
- OTP Input - - Source - - Live demo - - Documentation -
- -### Interactive Chat - - - - - - - - - - - - - - -
- AI Assist View - - npm package @syncfusion/ej2-react-interactive-chat      code coverage of @syncfusion/ej2-react-interactive-chat - - Source - - Live demo - - Documentation -
- Chat UI - - Source - - Live demo - - Documentation -
- -### Data Visualization - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Barcode Generator - - npm package @syncfusion/ej2-react-barcode-generator      code coverage of @syncfusion/ej2-react-barcode-generator - - Source - - Live demo - - Documentation -
- Circular Gauge - - npm package @syncfusion/ej2-react-circulargauge      code coverage of @syncfusion/ej2-react-circulargauge - - Source - - Live demo - - Documentation -
- Diagram - - npm package @syncfusion/ej2-react-diagrams      code coverage of @syncfusion/ej2-react-diagrams - - Source - - Live demo - - Documentation -
- HeatMap Chart - - npm package @syncfusion/ej2-react-heatmap      code coverage of @syncfusion/ej2-react-heatmap - - Source - - Live demo - - Documentation -
- Kanban - - npm package @syncfusion/ej2-react-kanban      code coverage of @syncfusion/ej2-react-kanban - - Source - - Live demo - - Documentation -
- Linear Gauge - - npm package @syncfusion/ej2-react-lineargauge      code coverage of @syncfusion/ej2-react-lineargauge - - Source - - Live demo - - Documentation -
- Maps - - npm package @syncfusion/ej2-react-maps      code coverage of @syncfusion/ej2-react-maps - - Source - - Live demo - - Documentation -
- TreeMap - - npm package @syncfusion/ej2-react-treemap      code coverage of @syncfusion/ej2-react-treemap - - Source - - Live demo - - Documentation -
- Bullet Chart - - npm package @syncfusion/ej2-react-charts      code coverage of @syncfusion/ej2-react-charts - - Source - - Live demo - - Documentation -
- Charts - - Source - - Live demo - - Documentation -
- 3D Chart - - Source - - Live demo - - Documentation -
- 3D Cirular Chart - - Source - - Live demo - - Documentation -
- Range Selector - - Source - - Live demo - - Documentation -
- Smith Chart - - Source - - Live demo - - Documentation -
- Sparkline Charts - - Source - - Live demo - - Documentation -
- Stock Chart - - Source - - Live demo - - Documentation -
- -### Calendars - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Calendar - - npm package @syncfusion/ej2-react-calendars      code coverage of @syncfusion/ej2-react-calendars - - Source - - Live demo - - Documentation -
- DatePicker - - Source - - Live demo - - Documentation -
- DateRangePicker - - Source - - Live demo - - Documentation -
- DateTime Picker - - Source - - Live demo - - Documentation -
- TimePicker - - Source - - Live demo - - Documentation -
- Gantt Chart - - npm package @syncfusion/ej2-react-gantt      code coverage of @syncfusion/ej2-react-gantt - - Source - - Live demo - - Documentation -
- Scheduler - - npm package @syncfusion/ej2-react-schedule      code coverage of @syncfusion/ej2-react-schedule - - Source - - Live demo - - Documentation -
- -### Navigation - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Accordion - - npm package @syncfusion/ej2-react-navigations      code coverage of @syncfusion/ej2-react-navigations - - Source - - Live demo - - Documentation -
- Appbar - - Source - - Live demo - - Documentation -
- Breadcrumb - - Source - - Live demo - - Documentation -
- Carousel - - Source - - Live demo - - Documentation -
- Context Menu - - Source - - Live demo - - Documentation -
- Menu Bar - - Source - - Live demo - - Documentation -
- Sidebar - - Source - - Live demo - - Documentation -
- Stepper - - Source - - Live demo - - Documentation -
- Tabs - - Source - - Live demo - - Documentation -
- Toolbar - - Source - - Live demo - - Documentation -
- TreeView - - Source - - Live demo - - Documentation -
- File Manager - - npm package @syncfusion/ej2-react-filemanager      code coverage of @syncfusion/ej2-react-filemanager - - Source - - Live demo - - Documentation -
- Ribbon - - npm package @syncfusion/ej2-react-ribbon      code coverage of @syncfusion/ej2-react-ribbon - - Source - - Live demo - - Documentation -
- -### Buttons - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Button - - npm package @syncfusion/ej2-react-buttons      code coverage of @syncfusion/ej2-react-buttons - - Source - - Live demo - - Documentation -
- Chips - - Source - - Live demo - - Documentation -
- Button Group - - npm package @syncfusion/ej2-react-splitbuttons      code coverage of @syncfusion/ej2-react-splitbuttons - - Source - - Live demo - - Documentation -
- Dropdown Menu - - Source - - Live demo - - Documentation -
- Progress Button - - Source - - Live demo - - Documentation -
- Split Button - - Source - - Live demo - - Documentation -
- FAB - - Source - - Live demo - - Documentation -
- Speed Dial - - Source - - Live demo - - Documentation -
- -### Layout - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Avatar - - npm package @syncfusion/ej2-react-layouts      code coverage of @syncfusion/ej2-react-layouts - - Styles - - Live demo - - Documentation -
- Card - - Styles - - Live demo - - Documentation -
- Dashboard Layout - - Source - - Live demo - - Documentation -
- Splitter - - Source - - Live demo - - Documentation -
- Dialog - - npm package @syncfusion/ej2-react-popups      code coverage of @syncfusion/ej2-react-popups - - Source - - Live demo - - Documentation -
- Tooltip - - Source - - Live demo - - Documentation -
- Timeline - - Source - - Live demo - - Documentation -
- ListView - - npm package @syncfusion/ej2-react-lists      code coverage of @syncfusion/ej2-react-lists - - Source - - Live demo - - Documentation -
- -### Notification - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- Badge - - npm package @syncfusion/ej2-react-notifications      code coverage of @syncfusion/ej2-react-notifications - - Styles - - Live demo - - Documentation -
- Toast - - Source - - Live demo - - Documentation -
- Message - - Source - - Live demo - - Documentation -
- Skeleton - - Source - - Live demo - - Documentation -
- Progress Bar - - npm package @syncfusion/ej2-react-progressbar      code coverage of @syncfusion/ej2-react-progressbar - - Source - - Live demo - - Documentation -
- -### Forms - - - - - - - - - -
- Query Builder UI - - npm package @syncfusion/ej2-react-querybuilder      code coverage of @syncfusion/ej2-react-querybuilder - - Source - - Live demo - - Documentation -
- - ## Supported Frameworks +# Syncfusion React UI Components Library – Essential JS 2 + +Syncfusion Essential JS 2 (EJ2) for React is a complete enterprise-grade UI component library with **145+** high-performance, responsive, lightweight, modular, and touch-friendly React components. Build modern, cross-platform web applications faster with rich features like accessibility (WCAG 2.2 compliant), built-in themes (Material 3, Bootstrap 5.3, Tailwind3, Fluent2, etc.), globalization, right-to-left (RTL) support, and seamless integration. + +> **Note:** This is a commercial library. A **free community license** is available for companies/teams with < $1M USD annual gross revenue, ≤5 developers, and ≤10 total employees. +> See: [Community License](https://www.syncfusion.com/products/communitylicense) + +[![npm version](https://badge.fury.io/js/%40syncfusion%2Fej2-react-grids.svg)](https://www.npmjs.com/package/@syncfusion/ej2-react-grids) + +For latest updates: Check[Releases](https://github.com/syncfusion/ej2-react-components/releases) or [What's New](https://www.syncfusion.com/products/whatsnew/essential-js2) + +* [Product Overview](https://www.syncfusion.com/react-ui-components) +* [Documentation](https://ej2.syncfusion.com/react/documentation) +* [Live Demos](https://ej2.syncfusion.com/react/demos) +* [API Reference](https://ej2.syncfusion.com/react/documentation/api/) + +## Features + +- **145+ Components** — Including established EJ2 wrappers +- **Lightweight & Modular** – Tree-shakable; include only what you need. +- **Top-tier Performance** – Virtualization, lazy loading, and optimized rendering. +- **Modern Theming** – Material3, Bootstrap5.3, Tailwind3 CSS, Fabric, Fluent2, and High-Contrast themes. +- **Full Accessibility** – WCAG 2.2, Section 508, ARIA compliant. +- **AI-Ready Components** – AI AssistView, Chat UI, Smart Paste, Speech-to-Text, OTP Input, Block Editor. +- **React 19 Ready** – Complete support including latest React Server Components patterns. +- **Frequent Releases** – 4 major upgrades per year + weekly service packs. + +## Components List + +Components are grouped by category. Install individually via NPM (e.g., `npm install @syncfusion/ej2-react-grids`) for a modular bundle. + +| Category | Key Components | Highlights / Features | Sample / Demo Link | Documentation | +|---------------------------|--------------------------------------------------------------------------------|---------------------------------------------------------------------------------------|------------------------------------------------------------------------------------|-------------------------------------------------------------------------------| +| **Smart / AI Components** | AI AssistView, Smart TextArea, Smart Paste Button | AI-assisted text, intelligent pasting, chat-like interfaces | [AI AssistView Demo](https://ej2.syncfusion.com/react/demos/#/tailwind3/ai-assistview/default) | [AI AssistView](https://ej2.syncfusion.com/react/documentation/ai-assistview/getting-started)
[Smart Paste Button](https://ej2.syncfusion.com/react/documentation/smart-paste-button/getting-started/)
[Smart TextArea](https://ej2.syncfusion.com/react/documentation/smart-textarea/getting-started/) | +| **Grids** | Data Grid, Pivot Table, Tree Grid, Spreadsheet | Virtual scrolling, Excel-like editing/filtering/sorting, Excel/PDF/CSV export, pinned rows | [Data Grid](https://ej2.syncfusion.com/react/demos/#/tailwind3/grid/overview) | [Data Grid](https://ej2.syncfusion.com/react/documentation/grid/getting-started/)
[Pivot Table](https://ej2.syncfusion.com/react/documentation/pivotview/getting-started/) | +| **Data Visualization** | Charts, 3D Charts, Stock Chart, Circular Gauge, Linear Gauge, Maps, Diagram, HeatMap, TreeMap, Bullet Chart, Kanban, Sparkline, Barcode, Smith Chart, Range Selector | 80+ chart types, real-time updates, interactive diagrams, geospatial rendering | [Charts](https://ej2.syncfusion.com/react/demos/#/tailwind3/chart/line) | [Charts](https://ej2.syncfusion.com/react/documentation/chart/getting-started/)
[Diagram](https://ej2.syncfusion.com/react/documentation/diagram/getting-started/) | +| **Calendars & Scheduling**| Scheduler, Gantt Chart, Calendar, DatePicker, DateRangePicker, DateTimePicker, TimePicker | Drag-and-drop events, resources, recurring appointments, timeline views | [Scheduler](https://ej2.syncfusion.com/react/demos/#/tailwind3/schedule/overview) | [Scheduler](https://ej2.syncfusion.com/react/documentation/schedule/getting-started/)
[Gantt Chart](https://ej2.syncfusion.com/react/documentation/gantt/getting-started/) | +| **Dropdowns** | AutoComplete, ComboBox, MultiSelect Dropdown, Dropdown List, ListBox, DropDown Tree, MultiColumn ComboBox, Mention | Filtering, grouping, virtualization, remote data, templates | [ComboBox](https://ej2.syncfusion.com/react/demos/#/tailwind3/combo-box/default) | [ComboBox](https://ej2.syncfusion.com/react/documentation/combo-box/getting-started/)
[MultiSelect Dropdown](https://ej2.syncfusion.com/react/documentation/multi-select/getting-started/) | +| **Inputs & Editors** | TextBox, TextArea, Numeric TextBox, Masked TextBox, CheckBox, RadioButton, Color Picker, File Upload, Range Slider, Switch, Signature, Rating, OTP Input | Validation, floating labels, file drag-drop, accessibility | [TextBox](https://ej2.syncfusion.com/react/demos/#/tailwind3/textbox/default) | [TextBox](https://ej2.syncfusion.com/react/documentation/textbox/getting-started/)
[Numeric TextBox](https://ej2.syncfusion.com/react/documentation/numerictextbox/getting-started/) | +| **Buttons & Chips** | Button, ButtonGroup, SplitButton, Dropdown Menu, Progress Button, Chips, FAB, Speed Dial | Icons, animations, loading states, predefined styles | [Button](https://ej2.syncfusion.com/react/demos/#/tailwind3/button/default) | [Button](https://ej2.syncfusion.com/react/documentation/button/getting-started/)
[Chips](https://ej2.syncfusion.com/react/documentation/chips/getting-started/) | +| **Navigation & Layout** | Accordion, Tabs, TreeView, Toolbar, Sidebar, Menu Bar, Context Menu, Carousel, AppBar, Breadcrumb, Ribbon, Stepper, Pager, File Manager, Dialog, Card, Splitter, ListView, Tooltip, Dashboard Layout | Collapsible, draggable, multi-level, responsive layouts | [TreeView](https://ej2.syncfusion.com/react/demos/#/tailwind3/treeview/default) | [TreeView](https://ej2.syncfusion.com/react/documentation/treeview/getting-started/)
[Dialog](https://ej2.syncfusion.com/react/documentation/dialog/getting-started/)
[File Manager](https://ej2.syncfusion.com/react/documentation/file-manager/getting-started/) | +| **Forms & Query** | Query Builder, Form Validator | Visual rule/filter building, complex queries, validation | [Query Builder](https://ej2.syncfusion.com/react/demos/#/tailwind3/query-builder/default) | [Query Builder](https://ej2.syncfusion.com/react/documentation/query-builder/getting-started/) | +| **Editors & Viewers** | Rich Text Editor, Document Editor, PDF Viewer, In-place Editor, Image Editor, Block Editor | Markdown/HTML editing, annotations, full document support | [Rich Text Editor](https://ej2.syncfusion.com/react/demos/#/tailwind3/rich-text-editor/default) | [Rich Text Editor](https://ej2.syncfusion.com/react/documentation/rich-text-editor/getting-started/)
[PDF Viewer](https://ej2.syncfusion.com/react/documentation/pdfviewer/getting-started/)
[Document Editor](https://ej2.syncfusion.com/react/documentation/document-editor/getting-started/) | +| **Notifications** | Toast, Progress Bar, Spinner, Badge, Skeleton, Message | Custom positions, animations, non-blocking alerts | [Toast](https://ej2.syncfusion.com/react/demos/#/tailwind3/toast/default) | [Toast](https://ej2.syncfusion.com/react/documentation/toast/getting-started/)
[Progress Bar](https://ej2.syncfusion.com/react/documentation/progress-bar/getting-started/) | + +For the exhaustive list and latest additions, see: [Documentation Introduction](https://ej2.syncfusion.com/react/documentation/introduction). + +## Quick Links + +- **Installation** — `npm install @syncfusion/ej2-react-grids --save` (per-component) +- **Getting Started** — https://helpej2.syncfusion.com/react/documentation/getting-started/quick-start +- **Live Demos** — https://ej2.syncfusion.com/react/demos/ +- **Themes & Customization** — [Theme Studio](https://ej2.syncfusion.com/themestudio/) +- **NPM Packages** — https://www.npmjs.com/search?q=%40syncfusion%2Fej2-react +- **Community License** — https://www.syncfusion.com/products/communitylicense +- **Support** — [Forums](https://www.syncfusion.com/forums/react-js2) • [Tickets](https://support.syncfusion.com/create) + +## Showcase Applications + +Real-world demos built with Syncfusion React components: + +- **Fitness Tracker** — Charts, grids, calendars for health monitoring + [Demo](https://www.syncfusion.com/showcase-apps/react/fitness-tracker) | [GitHub](https://github.com/syncfusion/ej2-showcase-react-fitness-application) +- **Loan Calculator** — Interactive sliders and visualizations + [Demo](https://ej2.syncfusion.com/showcase/react/loancalculator/) +- **Diagram Builder** — Drag-and-drop diagramming + [Demo](https://ej2.syncfusion.com/showcase/react/diagrambuilder/) +- **Logic Circuit Designer** — Interactive simulation + [Demo](https://ej2.syncfusion.com/showcase/react/logic-circuit/) | [GitHub](https://github.com/syncfusion/ej2-showcase-react-logic-circuit-designer) +- **Hotel Booking** — Reservation system + [Demo](https://ej2.syncfusion.com/showcase/react/hotelbooking/) +- **BPMN Editor** — Process modeling + [Demo](https://ej2.syncfusion.com/showcase/react/bpmn-editor/) +- **Mind Map Maker** — Brainstorming tool + [Demo](https://ej2.syncfusion.com/showcase/react/mind-map/) +- **Document Explorer** — File management & viewing + [Demo](https://ej2.syncfusion.com/showcase/react/documentexplorer/) + +Explore more at: https://www.syncfusion.com/showcase-apps/react + +--- +## Supported Frameworks The Essential JS 2 is also offered in following list of frameworks. * [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) * [Angular](https://www.syncfusion.com/angular-ui-components?utm_source=npm&utm_campaign=ej2-react-ui-components) @@ -1453,16 +87,7 @@ * [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) * [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) - ## Support - Product support is available for through following mediums. - * Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_campaign=ej2-react-ui-components) support system or [Community forum](https://www.syncfusion.com/forums/react-js2?utm_source=npm&utm_campaign=ej2-react-ui-components). -* New [GitHub issue](https://github.com/syncfusion/ej2-react-ui-components/issues/new). -* Ask your query in [Stack Overflow](https://stackoverflow.com/) with tag `syncfusion` and `ej2`. - - ## License - Check the license detail [here](https://github.com/syncfusion/ej2-react-ui-components/blob/master/license). - - ## Changelog - Check the changelog [here](https://ej2.syncfusion.com/react/documentation/release-notes/index/?utm_source=npm&utm_campaign=ej2-react-ui-components) - © Copyright 2026 Syncfusion, Inc. All Rights Reserved. - The Syncfusion Essential Studio license and copyright applies to this distribution. +## Changelog +Check the changelog [here](https://ej2.syncfusion.com/react/documentation/release-notes/index/?utm_source=npm&utm_campaign=ej2-react-ui-components) +© Copyright 2026 Syncfusion, Inc. All Rights Reserved. +The Syncfusion Essential Studio license and copyright applies to this distribution. From 7adcad99144a358fbb256316e373cc02a1543d26 Mon Sep 17 00:00:00 2001 From: Saranya13 Date: Thu, 22 Jan 2026 18:41:27 +0530 Subject: [PATCH 4/6] updated readme content --- README.md | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 5f71a9563..ccc907871 100644 --- a/README.md +++ b/README.md @@ -48,7 +48,7 @@ For the exhaustive list and latest additions, see: [Documentation Introduction]( ## Quick Links - **Installation** — `npm install @syncfusion/ej2-react-grids --save` (per-component) -- **Getting Started** — https://helpej2.syncfusion.com/react/documentation/getting-started/quick-start +- **Getting Started** — https://ej2.syncfusion.com/react/documentation/getting-started/quick-start - **Live Demos** — https://ej2.syncfusion.com/react/demos/ - **Themes & Customization** — [Theme Studio](https://ej2.syncfusion.com/themestudio/) - **NPM Packages** — https://www.npmjs.com/search?q=%40syncfusion%2Fej2-react @@ -59,14 +59,12 @@ For the exhaustive list and latest additions, see: [Documentation Introduction]( Real-world demos built with Syncfusion React components: -- **Fitness Tracker** — Charts, grids, calendars for health monitoring - [Demo](https://www.syncfusion.com/showcase-apps/react/fitness-tracker) | [GitHub](https://github.com/syncfusion/ej2-showcase-react-fitness-application) - **Loan Calculator** — Interactive sliders and visualizations [Demo](https://ej2.syncfusion.com/showcase/react/loancalculator/) - **Diagram Builder** — Drag-and-drop diagramming [Demo](https://ej2.syncfusion.com/showcase/react/diagrambuilder/) - **Logic Circuit Designer** — Interactive simulation - [Demo](https://ej2.syncfusion.com/showcase/react/logic-circuit/) | [GitHub](https://github.com/syncfusion/ej2-showcase-react-logic-circuit-designer) + [Demo](https://ej2.syncfusion.com/showcase/react/logic-circuit/) - **Hotel Booking** — Reservation system [Demo](https://ej2.syncfusion.com/showcase/react/hotelbooking/) - **BPMN Editor** — Process modeling @@ -76,8 +74,6 @@ Real-world demos built with Syncfusion React components: - **Document Explorer** — File management & viewing [Demo](https://ej2.syncfusion.com/showcase/react/documentexplorer/) -Explore more at: https://www.syncfusion.com/showcase-apps/react - --- ## Supported Frameworks The Essential JS 2 is also offered in following list of frameworks. From ff10443706e1aede1928e9abc88dfaa7ce1b1d71 Mon Sep 17 00:00:00 2001 From: Saranya13 Date: Thu, 22 Jan 2026 19:40:42 +0530 Subject: [PATCH 5/6] updated readme content --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index ccc907871..a3f4204c6 100644 --- a/README.md +++ b/README.md @@ -74,6 +74,7 @@ Real-world demos built with Syncfusion React components: - **Document Explorer** — File management & viewing [Demo](https://ej2.syncfusion.com/showcase/react/documentexplorer/) +More showcases and code examples: https://www.syncfusion.com/showcase-apps/react --- ## Supported Frameworks The Essential JS 2 is also offered in following list of frameworks. From 106172cf6bacfa8b554542bcb565a753fa5dd64a Mon Sep 17 00:00:00 2001 From: Saranya13 Date: Fri, 23 Jan 2026 10:46:49 +0530 Subject: [PATCH 6/6] updated readme content --- README.md | 57 +++++++++++++++++++++++++++---------------------------- 1 file changed, 28 insertions(+), 29 deletions(-) diff --git a/README.md b/README.md index a3f4204c6..a735f9a1c 100644 --- a/README.md +++ b/README.md @@ -1,13 +1,12 @@ # Syncfusion React UI Components Library – Essential JS 2 -Syncfusion Essential JS 2 (EJ2) for React is a complete enterprise-grade UI component library with **145+** high-performance, responsive, lightweight, modular, and touch-friendly React components. Build modern, cross-platform web applications faster with rich features like accessibility (WCAG 2.2 compliant), built-in themes (Material 3, Bootstrap 5.3, Tailwind3, Fluent2, etc.), globalization, right-to-left (RTL) support, and seamless integration. +Syncfusion Essential JS 2 (EJ2) for React is a complete enterprise-grade UI component library with **145+** high-performance, responsive, lightweight, modular, and touch-friendly React components. Build modern, cross-platform web applications faster with rich features like accessibility (WCAG 2.2 compliant), built-in themes (Material 3, Bootstrap 5.3, Tailwind 3, Fluent 2, etc.), globalization, right-to-left (RTL) support, and seamless integration. > **Note:** This is a commercial library. A **free community license** is available for companies/teams with < $1M USD annual gross revenue, ≤5 developers, and ≤10 total employees. > See: [Community License](https://www.syncfusion.com/products/communitylicense) -[![npm version](https://badge.fury.io/js/%40syncfusion%2Fej2-react-grids.svg)](https://www.npmjs.com/package/@syncfusion/ej2-react-grids) - -For latest updates: Check[Releases](https://github.com/syncfusion/ej2-react-components/releases) or [What's New](https://www.syncfusion.com/products/whatsnew/essential-js2) +[![npm version](https://badge.fury.io/js/%40syncfusion%2Fej2-react-grids.svg)](https://www.npmjs.com/package/@syncfusion/ej2-react-grids) +For latest updates: Check [Releases](https://github.com/syncfusion/ej2-react-ui-components/releases) or [What's New](https://www.syncfusion.com/products/whatsnew/essential-js2) * [Product Overview](https://www.syncfusion.com/react-ui-components) * [Documentation](https://ej2.syncfusion.com/react/documentation) @@ -16,34 +15,34 @@ For latest updates: Check[Releases](https://github.com/syncfusion/ej2-react-comp ## Features -- **145+ Components** — Including established EJ2 wrappers +- **145+ Components** — Including established React components - **Lightweight & Modular** – Tree-shakable; include only what you need. - **Top-tier Performance** – Virtualization, lazy loading, and optimized rendering. -- **Modern Theming** – Material3, Bootstrap5.3, Tailwind3 CSS, Fabric, Fluent2, and High-Contrast themes. +- **Modern Theming** – Material 3, Bootstrap 5.3, Tailwind 3 CSS, Fabric, Fluent 2, and High-Contrast themes. - **Full Accessibility** – WCAG 2.2, Section 508, ARIA compliant. - **AI-Ready Components** – AI AssistView, Chat UI, Smart Paste, Speech-to-Text, OTP Input, Block Editor. - **React 19 Ready** – Complete support including latest React Server Components patterns. -- **Frequent Releases** – 4 major upgrades per year + weekly service packs. +- **Frequent Releases** – 4 major upgrades per year + weekly patches. ## Components List Components are grouped by category. Install individually via NPM (e.g., `npm install @syncfusion/ej2-react-grids`) for a modular bundle. -| Category | Key Components | Highlights / Features | Sample / Demo Link | Documentation | -|---------------------------|--------------------------------------------------------------------------------|---------------------------------------------------------------------------------------|------------------------------------------------------------------------------------|-------------------------------------------------------------------------------| -| **Smart / AI Components** | AI AssistView, Smart TextArea, Smart Paste Button | AI-assisted text, intelligent pasting, chat-like interfaces | [AI AssistView Demo](https://ej2.syncfusion.com/react/demos/#/tailwind3/ai-assistview/default) | [AI AssistView](https://ej2.syncfusion.com/react/documentation/ai-assistview/getting-started)
[Smart Paste Button](https://ej2.syncfusion.com/react/documentation/smart-paste-button/getting-started/)
[Smart TextArea](https://ej2.syncfusion.com/react/documentation/smart-textarea/getting-started/) | -| **Grids** | Data Grid, Pivot Table, Tree Grid, Spreadsheet | Virtual scrolling, Excel-like editing/filtering/sorting, Excel/PDF/CSV export, pinned rows | [Data Grid](https://ej2.syncfusion.com/react/demos/#/tailwind3/grid/overview) | [Data Grid](https://ej2.syncfusion.com/react/documentation/grid/getting-started/)
[Pivot Table](https://ej2.syncfusion.com/react/documentation/pivotview/getting-started/) | -| **Data Visualization** | Charts, 3D Charts, Stock Chart, Circular Gauge, Linear Gauge, Maps, Diagram, HeatMap, TreeMap, Bullet Chart, Kanban, Sparkline, Barcode, Smith Chart, Range Selector | 80+ chart types, real-time updates, interactive diagrams, geospatial rendering | [Charts](https://ej2.syncfusion.com/react/demos/#/tailwind3/chart/line) | [Charts](https://ej2.syncfusion.com/react/documentation/chart/getting-started/)
[Diagram](https://ej2.syncfusion.com/react/documentation/diagram/getting-started/) | -| **Calendars & Scheduling**| Scheduler, Gantt Chart, Calendar, DatePicker, DateRangePicker, DateTimePicker, TimePicker | Drag-and-drop events, resources, recurring appointments, timeline views | [Scheduler](https://ej2.syncfusion.com/react/demos/#/tailwind3/schedule/overview) | [Scheduler](https://ej2.syncfusion.com/react/documentation/schedule/getting-started/)
[Gantt Chart](https://ej2.syncfusion.com/react/documentation/gantt/getting-started/) | -| **Dropdowns** | AutoComplete, ComboBox, MultiSelect Dropdown, Dropdown List, ListBox, DropDown Tree, MultiColumn ComboBox, Mention | Filtering, grouping, virtualization, remote data, templates | [ComboBox](https://ej2.syncfusion.com/react/demos/#/tailwind3/combo-box/default) | [ComboBox](https://ej2.syncfusion.com/react/documentation/combo-box/getting-started/)
[MultiSelect Dropdown](https://ej2.syncfusion.com/react/documentation/multi-select/getting-started/) | -| **Inputs & Editors** | TextBox, TextArea, Numeric TextBox, Masked TextBox, CheckBox, RadioButton, Color Picker, File Upload, Range Slider, Switch, Signature, Rating, OTP Input | Validation, floating labels, file drag-drop, accessibility | [TextBox](https://ej2.syncfusion.com/react/demos/#/tailwind3/textbox/default) | [TextBox](https://ej2.syncfusion.com/react/documentation/textbox/getting-started/)
[Numeric TextBox](https://ej2.syncfusion.com/react/documentation/numerictextbox/getting-started/) | -| **Buttons & Chips** | Button, ButtonGroup, SplitButton, Dropdown Menu, Progress Button, Chips, FAB, Speed Dial | Icons, animations, loading states, predefined styles | [Button](https://ej2.syncfusion.com/react/demos/#/tailwind3/button/default) | [Button](https://ej2.syncfusion.com/react/documentation/button/getting-started/)
[Chips](https://ej2.syncfusion.com/react/documentation/chips/getting-started/) | -| **Navigation & Layout** | Accordion, Tabs, TreeView, Toolbar, Sidebar, Menu Bar, Context Menu, Carousel, AppBar, Breadcrumb, Ribbon, Stepper, Pager, File Manager, Dialog, Card, Splitter, ListView, Tooltip, Dashboard Layout | Collapsible, draggable, multi-level, responsive layouts | [TreeView](https://ej2.syncfusion.com/react/demos/#/tailwind3/treeview/default) | [TreeView](https://ej2.syncfusion.com/react/documentation/treeview/getting-started/)
[Dialog](https://ej2.syncfusion.com/react/documentation/dialog/getting-started/)
[File Manager](https://ej2.syncfusion.com/react/documentation/file-manager/getting-started/) | -| **Forms & Query** | Query Builder, Form Validator | Visual rule/filter building, complex queries, validation | [Query Builder](https://ej2.syncfusion.com/react/demos/#/tailwind3/query-builder/default) | [Query Builder](https://ej2.syncfusion.com/react/documentation/query-builder/getting-started/) | -| **Editors & Viewers** | Rich Text Editor, Document Editor, PDF Viewer, In-place Editor, Image Editor, Block Editor | Markdown/HTML editing, annotations, full document support | [Rich Text Editor](https://ej2.syncfusion.com/react/demos/#/tailwind3/rich-text-editor/default) | [Rich Text Editor](https://ej2.syncfusion.com/react/documentation/rich-text-editor/getting-started/)
[PDF Viewer](https://ej2.syncfusion.com/react/documentation/pdfviewer/getting-started/)
[Document Editor](https://ej2.syncfusion.com/react/documentation/document-editor/getting-started/) | -| **Notifications** | Toast, Progress Bar, Spinner, Badge, Skeleton, Message | Custom positions, animations, non-blocking alerts | [Toast](https://ej2.syncfusion.com/react/demos/#/tailwind3/toast/default) | [Toast](https://ej2.syncfusion.com/react/documentation/toast/getting-started/)
[Progress Bar](https://ej2.syncfusion.com/react/documentation/progress-bar/getting-started/) | - -For the exhaustive list and latest additions, see: [Documentation Introduction](https://ej2.syncfusion.com/react/documentation/introduction). +| Category | Key Components | Highlights / Features | +|---|---|---| +| **Smart / AI Components** | AI AssistView, Smart TextArea, Smart Paste Button | AI-assisted text, intelligent pasting, chat-like interfaces | +| **Grids** | Data Grid, Pivot Table, Tree Grid | Virtual scrolling, Editing/filtering/sorting, Excel/PDF/CSV export | +| **Data Visualization** | Charts, 3D Charts, Stock Chart, Circular Gauge, Linear Gauge, Maps, Diagram, HeatMap, TreeMap, Bullet Chart, Kanban, Sparkline, Barcode, Smith Chart, Range Selector | 80+ chart types, real-time updates, interactive diagrams, geospatial rendering | +| **Calendars & Scheduling** | Scheduler, Gantt Chart, Calendar, DatePicker, DateRangePicker, DateTimePicker, TimePicker | Drag-and-drop events, resources, recurring appointments, timeline views | +| **Dropdowns** | AutoComplete, ComboBox, MultiSelect Dropdown, Dropdown List, ListBox, DropDown Tree, MultiColumn ComboBox, Mention | Filtering, grouping, virtualization, remote data, templates | +| **Inputs & Editors** | TextBox, TextArea, Numeric TextBox, Masked TextBox, CheckBox, RadioButton, Color Picker, File Upload, Range Slider, Switch, Signature, Rating, OTP Input | Validation, floating labels, file drag-drop, accessibility | +| **Buttons & Chips** | Button, ButtonGroup, SplitButton, Dropdown Menu, Progress Button, Chips, FAB, Speed Dial | Icons, animations, loading states, predefined styles | +| **Navigation & Layout** | Accordion, Tabs, TreeView, Toolbar, Sidebar, Menu Bar, Context Menu, Carousel, AppBar, Breadcrumb, Ribbon, Stepper, Pager, File Manager, Dialog, Card, Splitter, ListView, Tooltip, Dashboard Layout | Collapsible, draggable, multi-level, responsive layouts | +| **Forms & Query** | Query Builder, Form Validator | Visual rule/filter building, complex queries, validation | +| **Editors** | Rich Text Editor, In-place Editor, Image Editor, Block Editor | Markdown/HTML editing, annotations, AI Assistant integration | +| **Notifications** | Toast, Progress Bar, Spinner, Badge, Skeleton, Message | Custom positions, animations, non-blocking alerts | + +For detailed documentation for all the components, see: [Documentation Introduction](https://ej2.syncfusion.com/react/documentation/introduction). ## Quick Links @@ -53,7 +52,7 @@ For the exhaustive list and latest additions, see: [Documentation Introduction]( - **Themes & Customization** — [Theme Studio](https://ej2.syncfusion.com/themestudio/) - **NPM Packages** — https://www.npmjs.com/search?q=%40syncfusion%2Fej2-react - **Community License** — https://www.syncfusion.com/products/communitylicense -- **Support** — [Forums](https://www.syncfusion.com/forums/react-js2) • [Tickets](https://support.syncfusion.com/create) +- **Support** — [Tickets](https://support.syncfusion.com/create) • [Forums](https://www.syncfusion.com/forums/react-js2) ## Showcase Applications @@ -71,20 +70,20 @@ Real-world demos built with Syncfusion React components: [Demo](https://ej2.syncfusion.com/showcase/react/bpmn-editor/) - **Mind Map Maker** — Brainstorming tool [Demo](https://ej2.syncfusion.com/showcase/react/mind-map/) -- **Document Explorer** — File management & viewing - [Demo](https://ej2.syncfusion.com/showcase/react/documentexplorer/) -More showcases and code examples: https://www.syncfusion.com/showcase-apps/react +Explore more at: https://www.syncfusion.com/showcase-apps/react + --- ## Supported Frameworks The Essential JS 2 is also offered in following list of frameworks. * [JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) -* [Angular](https://www.syncfusion.com/angular-ui-components?utm_source=npm&utm_campaign=ej2-react-ui-components) -* [Vue.js](https://www.syncfusion.com/vue-ui-components?utm_source=npm&utm_campaign=ej2-react-ui-components) +* [Angular](https://www.syncfusion.com/angular-components?utm_source=npm&utm_campaign=ej2-react-ui-components) +* [Vue](https://www.syncfusion.com/vue-components?utm_source=npm&utm_campaign=ej2-react-ui-components) * [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) * [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=npm&utm_campaign=ej2-react-ui-components) ## Changelog -Check the changelog [here](https://ej2.syncfusion.com/react/documentation/release-notes/index/?utm_source=npm&utm_campaign=ej2-react-ui-components) +Check the changelog [here](https://ej2.syncfusion.com/react/documentation/release-notes/index/?utm_source=npm&utm_campaign=ej2-react-ui-components). + © Copyright 2026 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.