diff --git a/components/calendars/README.md b/components/calendars/README.md index fd5e2330a..03fa92cce 100644 --- a/components/calendars/README.md +++ b/components/calendars/README.md @@ -1,12 +1,12 @@ # ej2-angular-calendars -The calendar package contains date and time components such as calendar, date picker, date range picker, date time picker, and time picker. These components come with options to disable dates, restrict selection, and show custom events. It also has documentation and support available under commercial and community licenses. Please visit [www.syncfusion.com](https://www.syncfusion.com/) to get started. +The Angular Calendar package contains date and time components such as [calendar](https://www.syncfusion.com/angular-components/angular-calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm),[ date picker](https://www.syncfusion.com/angular-components/angular-datepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm), [daterangepicker](https://www.syncfusion.com/angular-components/angular-daterangepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm), [datetime picker](https://www.syncfusion.com/angular-components/angular-datetime-picker?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm), and [time picker](https://www.syncfusion.com/angular-components/angular-timepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm). These components come with options to disable dates, restrict selection, and show custom events. It also has documentation and support available under commercial and community licenses. Please visit [our website](https://www.syncfusion.com/) to get started.

Calendar components

-> 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). +> 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](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. @@ -34,22 +34,23 @@ The `calendar` is a graphical user interface component that displays a Gregorian #### Key features -* [Date range](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=calendar#/material/calendar/date-range) - Restricts the range of dates that can be selected by using the `min` and `max` properties. -* [Customization](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=calendar#/material/calendar/special-dates) - Allows complete control over the appearance of the calendar component. -* [Month or year selection](https://ej2.syncfusion.com/angular/documentation/calendar/calendar-views#calendar-views) - Provides a flexible option to select only a month or year as the date value. -* [First day of week](https://ej2.syncfusion.com/angular/documentation/calendar/how-to/change-the-first-day-of-week#change-the-first-day-of-week) - Changes the first day of all weeks in every month. -* [Week number](https://ej2.syncfusion.com/angular/documentation/calendar/how-to/render-the-calendar-with-week-numbers#render-calendar-with-week-number) - Displays the week number of the selected date in the calendar by enabling the week number option. -* [Disabled dates](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=calendar#/material/calendar/disabled) - Disables any date to prevent the user from selecting that date. -* [Start and depth view](https://ej2.syncfusion.com/angular/documentation/calendar/calendar-views#view-restriction) - The Calendar has `month`, `year`, and `decade` views that provide flexibility to select dates. -* [Highlight weekends](https://ej2.syncfusion.com/angular/documentation/calendar/customization#highlight-weekends) - The calendar supports to highlighting every weekend in a month. -* [Globalization](https://ej2.syncfusion.com/angular/documentation/calendar/globalization#globalization) - Supports globalization (internationalization and localization) to translate the names of months, days, and the today button text to any supported language. +* [Date range](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/calendar/date-range?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Restricts the range of dates that can be selected by using the `min` and `max` properties. +* [Customization](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/calendar/special-dates?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Allows complete control over the appearance of the calendar component. +* [Month or year selection](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/calendar/month-picker?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Provides a flexible option to select only a month or year as the date value. +* [First day of week](https://ej2.syncfusion.com/angular/documentation/calendar/how-to/change-the-first-day-of-week#change-the-first-day-of-week?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Changes the first day of all weeks in every month. +* [Week number](https://ej2.syncfusion.com/angular/documentation/calendar/how-to/render-the-calendar-with-week-numbers#render-calendar-with-week-number?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Displays the week number of the selected date in the calendar by enabling the week number option. +* [Islamic calendar](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/calendar/islamic-calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Islamic calendar or Hijri calendar is a lunar calendar consisting of 12 months in a year of 354 or 355 days. +* [Disabled dates](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/calendar/disabled?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Disables any date to prevent the user from selecting that date. +* [Start and depth view](https://ej2.syncfusion.com/angular/documentation/calendar/calendar-views#view-restriction?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - The Calendar has `month`, `year`, and `decade` views that provide flexibility to select dates. +* [Highlight weekends](https://ej2.syncfusion.com/angular/documentation/calendar/customization#highlight-weekends?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - The calendar supports to highlighting every weekend in a month. +* [Globalization](https://ej2.syncfusion.com/angular/documentation/calendar/globalization#globalization?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) - Supports globalization (internationalization and localization) to translate the names of months, days, and the today button text to any supported language. #### Resources -* [Getting started](https://ej2.syncfusion.com/angular/documentation/calendar/getting-started?utm_source=npm&utm_campaign=calendar#getting-started) -* [API reference](https://ej2.syncfusion.com/angular/documentation/api/calendar?utm_source=npm&utm_campaign=calendar) -* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=calendar#/material/calendar/default) -* [Product page](https://www.syncfusion.com/products/angular-ui-components/calendar) +* [Getting started](https://ej2.syncfusion.com/angular/documentation/calendar/getting-started?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [API reference](https://ej2.syncfusion.com/angular/documentation/api/calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [View online demos](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/calendar/default?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [Product page](https://www.syncfusion.com/angular-components/angular-calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) ### DatePicker @@ -59,15 +60,15 @@ The `date picker` is a graphical user interface component that allows selection The date picker is inherited from the calendar component. So, all the key features of calendar can be accessed in the date picker component. Additionally, it has some specific features such as `date format` and `strict mode`. -* [Date format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datepicker#/material/datepicker/date-format) - The date picker control’s input value can be custom formatted apart from the default culture’s specific date format. +* [Date format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datepicker#/bootstrap5/datepicker/date-format) - The date picker control’s input value can be custom formatted apart from the default culture’s specific date format. * [Strict mode](https://ej2.syncfusion.com/angular/documentation/datepicker/strict-mode?utm_source=npm&utm_campaign=datepicker#strict-mode) - The strictMode is an act that allows entry only of valid dates within the specified min or max range in a text box. #### Resources * [Getting started](https://ej2.syncfusion.com/angular/documentation/datepicker/getting-started?utm_source=npm&utm_campaign=datepicker#getting-started) * [API reference](https://ej2.syncfusion.com/angular/documentation/api/datepicker?utm_source=npm&utm_campaign=datepicker) -* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datepicker#/material/datepicker/default) -* [Product page](https://www.syncfusion.com/products/angular-ui-components/datepicker) +* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datepicker#/bootstrap5/datepicker/default) +* [Product page](https://www.syncfusion.com/angular-components/angular-datepicker) ### TimePicker @@ -75,21 +76,21 @@ The date picker is inherited from the calendar component. So, all the key featur #### Key features -* [Time range](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/material/timepicker/time-range) - Restricts the entry or selection of time values within a specific range of time by using `min` and `max` properties. -* [Time format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/material/timepicker/time-format) - Apart from the default culture specific time format, the time picker control’s input value can also be custom formatted. +* [Time range](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/bootstrap5/timepicker/time-range) - Restricts the entry or selection of time values within a specific range of time by using `min` and `max` properties. +* [Time format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/bootstrap5/timepicker/time-format) - Apart from the default culture specific time format, the time picker control’s input value can also be custom formatted. * [Strict mode](https://ej2.syncfusion.com/angular/documentation/timepicker/strict-mode#timepicker) - The strictMode is an act that allows entry of only valid time values within the specified min and max range in a text box. -* [Disabled time](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/material/timepicker/list-formatting) - Any number of time values can be disabled in the popup list items to prevent selection of those times. -* [Time intervals](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/material/timepicker/list-formatting) - Allows populating the time list with intervals between the times in the popup list to enable selection of proper time value. +* [Disabled time](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/bootstrap5/timepicker/list-formatting) - Any number of time values can be disabled in the popup list items to prevent selection of those times. +* [Time intervals](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/bootstrap5/timepicker/list-formatting) - Allows populating the time list with intervals between the times in the popup list to enable selection of proper time value. * [Customization](https://ej2.syncfusion.com/angular/documentation/timepicker/how-to/css-customization#css-customization) - The appearance of the time picker can be customized completely. -* [Time list with duration](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/material/timepicker/list-formatting) - Supports customization of the control’s popup list items with time duration. +* [Time list with duration](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/bootstrap5/timepicker/list-formatting) - Supports customization of the control’s popup list items with time duration. * [Globalization](https://ej2.syncfusion.com/angular/documentation/timepicker/globalization#globalization) - Supports globalization (internationalization and localization) to update time popup list values to match any specified culture. #### Resources * [Getting started](https://ej2.syncfusion.com/angular/documentation/timepicker/getting-started?utm_source=npm&utm_campaign=timepicker#getting-started) * [API reference](https://ej2.syncfusion.com/angular/documentation/api/timepicker?utm_source=npm&utm_campaign=timepicker) -* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/material/timepicker/default) -* [Product page](https://www.syncfusion.com/products/angular-ui-components/timepicker) +* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=timepicker#/bootstrap5/timepicker/default) +* [Product page](https://www.syncfusion.com/angular-components/angular-timepicker) ### DateTimePicker @@ -99,15 +100,15 @@ The `date time picker` is a graphical user interface component that allows an en The date time picker is inherited from the date picker and time picker component. So, all the key features of the date picker and time picker component can be accessed in the date time picker component. Additionally, it has some specific features such as `Date time range` and `Date time format`, which are described below. -* [Date time range](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datetimepicker#/material/datetimepicker/range) - Restricts the entry or selection of values within a specific range of dates and times by using `min` and `max` properties. -* [Date time format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datetimepicker#/material/datetimepicker/date-time-format) - The control’s input value can be custom formatted apart from the default culture’s specific date time format. +* [Date time range](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datetimepicker#/bootstrap5/datetimepicker/range) - Restricts the entry or selection of values within a specific range of dates and times by using `min` and `max` properties. +* [Date time format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datetimepicker#/bootstrap5/datetimepicker/date-time-format) - The control’s input value can be custom formatted apart from the default culture’s specific date time format. #### Resources * [Getting started](https://ej2.syncfusion.com/angular/documentation/datetimepicker/getting-started?utm_source=npm&utm_campaign=datetimepicker#getting-started) * [API reference](https://ej2.syncfusion.com/angular/documentation/api/datetimepicker?utm_source=npm&utm_campaign=datetimepicker) -* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datetimepicker#/material/datetimepicker/default) -* [Product page](https://www.syncfusion.com/products/angular-ui-components/datetimepicker) +* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=datetimepicker#/bootstrap5/datetimepicker/default) +* [Product page](https://www.syncfusion.com/angular-components/angular-datetime-picker) ### Angular DateRangePicker @@ -115,36 +116,31 @@ The [Angular DateRangePicker](https://www.syncfusion.com/angular-components/angu #### Key features -* [Preset ranges](https://ej2.syncfusion.com/angular/demos/#/material/daterangepicker/presets?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - Defines the preset ranges to select the frequently used date range by the end users. -* [Range restriction](https://ej2.syncfusion.com/angular/demos/#/material/daterangepicker/date-range?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - This control restricts the entry or selection of values within a specific range of date by defining the min and max properties. -* [Limit the selection range](https://ej2.syncfusion.com/angular/demos/#/material/daterangepicker/day-span?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - Directs the end user to select only the date range with specific minimum and maximum number of days’ count by setting the minDays and maxDays options. -* [First day of week](https://ej2.syncfusion.com/angular/documentation/daterangepicker/customization/#first-day-of-week?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - Changes the first day of weeks in every month. -* [Strict mode](https://ej2.syncfusion.com/angular/documentation/daterangepicker/range-selection/#strict-mode?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - The strictMode is an act that allows entry only of a valid date within the specified min and max range in a textbox. -* [Customization](https://ej2.syncfusion.com/angular/documentation/daterangepicker/customization/#daterangepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - The appearance of the component can be customized completely. -* [Format](https://ej2.syncfusion.com/angular/demos/#/material/daterangepicker/date-format?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - The control’s input value can be custom formatted apart from the default culture’s specific date range format. -* [Globalization](https://ej2.syncfusion.com/angular/documentation/daterangepicker/globalization/#globalization?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) - Supports globalization (internationalization and localization) to translate the names of months, days, and button text to any supported language. +* [Preset ranges](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=daterangepicker#/bootstrap5/daterangepicker/presets) - Defines the preset ranges to select the frequently used date range by the end users. +* [Range restriction](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=daterangepicker#/bootstrap5/daterangepicker/date-range) - This control restricts the entry or selection of values within a specific range of date by defining the min and max properties. +* [Limit the selection range](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=daterangepicker#/bootstrap5/daterangepicker/day-span) - Directs the end user to select only the date range with specific minimum and maximum number of days’ count by setting the minDays and maxDays options. +* [First day of week](https://ej2.syncfusion.com/angular/documentation/daterangepicker/customization#first-day-of-week) - Changes the first day of weeks in every month. +* [Strict mode](https://ej2.syncfusion.com/angular/documentation/daterangepicker/range-selection#strict-mode) - The strictMode is an act that allows entry only of a valid date within the specified min and max range in a textbox. +* [Customization](https://ej2.syncfusion.com/angular/documentation/daterangepicker/customization#daterangepicker) - The appearance of the component can be customized completely. +* [Format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=daterangepicker#/bootstrap5/daterangepicker/date-format) - The control’s input value can be custom formatted apart from the default culture’s specific date range format. +* [Globalization](https://ej2.syncfusion.com/angular/documentation/daterangepicker/globalization#globalization) - Supports globalization (internationalization and localization) to translate the names of months, days, and button text to any supported language. #### Resources -[Learn More about Angular DateRangePicker](https://www.syncfusion.com/angular-components/angular-daterangepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[Download Free Trial](https://www.syncfusion.com/downloads/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[Pricing](https://www.syncfusion.com/sales/products/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[Documentation](https://ej2.syncfusion.com/angular/documentation/daterangepicker/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[View Demos](https://ej2.syncfusion.com/angular/demos/#/material/daterangepicker/default?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[Community Forums](https://www.syncfusion.com/forums/angular-components?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[Knowledge Base](https://www.syncfusion.com/kb/angular-js2/daterangepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm)

-[Suggest a feature](https://www.syncfusion.com/feedback/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) +* [Getting started](https://ej2.syncfusion.com/angular/documentation/daterangepicker/getting-started?utm_source=npm&utm_campaign=daterangepicker#getting-started) +* [API reference](https://ej2.syncfusion.com/angular/documentation/api/daterangepicker?utm_source=npm&utm_campaign=daterangepicker) +* [View online demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=daterangepicker#/bootstrap5/daterangepicker/default) +* [Product page](https://www.syncfusion.com/angular-components/angular-daterangepicker) ## Supported frameworks Date time components are also offered in the following list of frameworks. -* [Blazor DateRangePicker](https://www.syncfusion.com/blazor-components/blazor-daterangepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) -* [React DateRangePicker](https://www.syncfusion.com/react-components/react-daterangepicker?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) -* [Vue DateRangePicker](https://www.syncfusion.com/vue-components/vue-date-range-picker?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) -* [ASP.NET Core DateRangePicker](https://www.syncfusion.com/products/aspnet-core-ui-controls/calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) -* [ASP.NET MVC DateRangePicker](https://www.syncfusion.com/products/aspnet-mvc-ui-controls/calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) -* [JavaScript DateRangePicker](https://www.syncfusion.com/products/javascript-ui-controls/calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) +* [React](https://github.com/syncfusion/ej2-react-components/tree/master/components/calendars?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [VueJS](https://github.com/syncfusion/ej2-vue-components/tree/master/components/calendars?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls/calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls/calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [JavaScript](https://www.syncfusion.com/javascript-ui-controls/js-calendar?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) ## Showcase samples @@ -161,10 +157,19 @@ Syncfusion's [Angular Components](https://www.syncfusion.com/angular-components? Product support is available through the following mediums. -* Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm) support system or [Community forum](https://www.syncfusion.com/forums/angular-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm). -* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues/new?utm_source=npm&utm_medium=listing&utm_campaign=angular-daterangepicker-npm). +* Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) support system or [Community forum](https://www.syncfusion.com/forums/angular-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm). +* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm). * Ask your queries in Stack Overflow with tag `syncfusion`, `ej2`, and so on. +## Related Links + +* [Download Free Trial](https://www.syncfusion.com/downloads?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [Community Forums](https://www.syncfusion.com/forums/?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [Knowledge Base](https://www.syncfusion.com/kb/essential-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [Suggest a feature](https://www.syncfusion.com/feedback/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) +* [Pricing](https://www.syncfusion.com/sales/products/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-calendar-npm) + ## License Check the license details [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/license). diff --git a/components/layouts/README.md b/components/layouts/README.md index 0440b5639..0c2f34af6 100644 --- a/components/layouts/README.md +++ b/components/layouts/README.md @@ -1,6 +1,6 @@ # ej2-angular-layouts -The layout package contains cards, avatars, splitter and Dashboard Layout components. +The layout package contains [cards](https://www.syncfusion.com/angular-components/angular-card?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm), [avatars](https://www.syncfusion.com/angular-components/angular-avatar?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm), [splitter](https://www.syncfusion.com/angular-components/angular-splitter?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) and [Dashboard Layout](https://www.syncfusion.com/angular-components/angular-dashboard-layout?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) Angular components. * The `card` is a small container in which user can show defined content in specific structure. @@ -12,7 +12,7 @@ The layout package contains cards, avatars, splitter and Dashboard Layout compon ![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_medium=listing&utm_campaign=angular-layout-npm) or start a free 30-day trial [here](https://www.syncfusion.com/account/manage-trials/start-trials/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm). +> 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](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/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers. @@ -28,28 +28,28 @@ npm install @syncfusion/ej2-angular-layouts Following list of components are available in the package -* [Angular Card](https://www.syncfusion.com/angular-ui-components/angular-card?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Container used to display content in specific structure. - * [Getting Started](https://ej2.syncfusion.com/angular/documentation/card/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/basic) +* [Angular Card](https://www.syncfusion.com/angular-components/angular-card?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Container used to display content in specific structure. +* [Getting Started](https://ej2.syncfusion.com/angular/documentation/card/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/basic) -* [Angular Avatar](https://www.syncfusion.com/angular-ui-components/angular-avatar?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Used to add images or initials or icons in different shapes and sizes to your application. - * [Getting Started](https://ej2.syncfusion.com/angular/documentation/avatar/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/avatar/default) +* [Angular Avatar](https://www.syncfusion.com/angular-components/angular-avatar?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Used to add images or initials or icons in different shapes and sizes to your application. +* [Getting Started](https://ej2.syncfusion.com/angular/documentation/avatar/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/avatar/default) -* [Angular Splitter](https://www.syncfusion.com/angular-ui-components/angular-splitter?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Used to construct a different layout using its multiple and nested panes with resizable. - * [Getting Started](https://ej2.syncfusion.com/angular/documentation/splitter/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/splitter/default) +* [Angular Splitter](https://www.syncfusion.com/angular-components/angular-splitter?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Used to construct a different layout using its multiple and nested panes with resizable. +* [Getting Started](https://ej2.syncfusion.com/angular/documentation/splitter/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/splitter/default) -* [Angular Dashboard Layout](https://www.syncfusion.com/angular-ui-components/angular-dashboard-layout?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Used to build dashboards with panels that holds the UI components and allow resize, reorder, drag-n-drop, remove and add options. - * [Getting Started](https://ej2.syncfusion.com/angular/documentation/dashboard-layout/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/dashboard-layout/default) +* [Angular Dashboard Layout](https://www.syncfusion.com/angular-components/angular-dashboard-layout?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Used to build dashboards with panels that holds the UI components and allow resize, reorder, drag-n-drop, remove and add options. +* [Getting Started](https://ej2.syncfusion.com/angular/documentation/dashboard-layout/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/dashboard-layout/default) ## Supported Frameworks These components are available in following list of: -1. [React](https://www.syncfusion.com/react-ui-components?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) -2. [Vue](https://www.syncfusion.com/vue-ui-components?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +1. [React](https://www.syncfusion.com/react-components?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +2. [Vue](https://www.syncfusion.com/vue-components?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) 3. [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) 4. [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) 5. [JavaScript (ES5)](https://www.syncfusion.com/javascript-ui-controls?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) @@ -57,29 +57,29 @@ These components are available in following list of: ## Use Case samples * IT Asset Management ([Live Demo](https://ej2.syncfusion.com/showcase/vue/assetmanagement/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm)) -* Swipeable Card ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/swipeable.html)) -* Flip Card ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/flip.html)) -* Tile View ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/tile.html)) -* Contact Application ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/avatar/listview.html)) -* Avatar Badge ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/avatar/badge.html)) -* Avatar Card ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/avatar/card.html)) -* SEO Analysis Dashboard ([Live Demo](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/dashboard-layout/analytics-dashboard.html)) +* Swipeable Card ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/swipeable.html)) +* Flip Card ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/flip.html)) +* Tile View ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/tile.html)) +* Contact Application ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/avatar/listview.html)) +* Avatar Badge ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/avatar/badge.html)) +* Avatar Card ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/avatar/card.html)) +* SEO Analysis Dashboard ([Live Demo](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/dashboard-layout/analytics-dashboard.html)) ## Key Features * Card - * [Header](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/basic) - Header supports to include title, subtitle along with image. + * [Header](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/basic) - Header supports to include title, subtitle along with image. - * [Images and Title](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/reveal) - Support to include images with customizable caption positions in it. + * [Images and Title](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/reveal) - Support to include images with customizable caption positions in it. - * [Action Buttons](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/vertical) - Supports to add buttons within the card either in vertical or horizontal alignment. + * [Action Buttons](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/vertical) - Supports to add buttons within the card either in vertical or horizontal alignment. - * [Horizontal Card](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/card/horizontal) - Allows to align card elements horizontally and also allows to stack the content vertically within horizontal alignment. + * [Horizontal Card](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/card/horizontal) - Allows to align card elements horizontally and also allows to stack the content vertically within horizontal alignment. * Avatar - * [Types](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/avatar/default) - Provided `2` types of avatars such as `default` and `circle`. + * [Types](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/avatar/default) - Provided `2` types of avatars such as `default` and `circle`. - * [Sizes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/avatar/types) - Supports `7` different sizes to adapt the various application scenario. + * [Sizes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/avatar/types) - Supports `7` different sizes to adapt the various application scenario. * xsmall * small @@ -88,34 +88,43 @@ These components are available in following list of: * xlarge * Splitter - * [Multiple Panes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/splitter/default) - Provided an option to configure more than two panes. + * [Multiple Panes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/splitter/default) - Provided an option to configure more than two panes. - * [Resizable Panes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/splitter/code-editor-layout) - Supports resizable to adjust its pane size dynamically. + * [Resizable Panes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/splitter/code-editor-layout) - Supports resizable to adjust its pane size dynamically. - * [Orientation](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/splitter/default) - The panes can orient either `horizontally` or `vertically`. + * [Orientation](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/splitter/default) - The panes can orient either `horizontally` or `vertically`. - * [Integration](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/splitter/accordion-navigation-menu) - Other Angular UI components can be integrated within panes. + * [Integration](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/splitter/accordion-navigation-menu) - Other Angular UI components can be integrated within panes. - * [Nested Panes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/splitter/code-editor-layout) - Another splitter can be integrated within panes to create a complex layout. + * [Nested Panes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/bootstrap5/splitter/code-editor-layout) - Another splitter can be integrated within panes to create a complex layout. - * Dashboard Layout +* Dashboard Layout - * [Drag and Drop](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/dashboard-layout/properties.html) - Allows drag and drop of panels at the desired location within the dashboard. +* [Drag and Drop](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/dashboard-layout/analytics-dashboard?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Allows drag and drop of panels at the desired location within the dashboard. - * [Floating](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/dashboard-layout/properties.html) - Floats the panels upward when the dragging option is enabled. +* [Floating](https://ej2.syncfusion.com/angular/documentation/dashboard-layout/floating-of-panels/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Floats the panels upward when the dragging option is enabled. - * [Resizing](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/dashboard-layout/properties.html) - Support to resize the panels in any direction as per the requirement. +* [Resizing](https://ej2.syncfusion.com/angular/documentation/dashboard-layout/interaction-with-panels/resizing-of-panels/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Support to resize the panels in any direction as per the requirement. - * [MediaQuery](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm#/material/dashboard-layout/default.html) - Allows the panels to be stacked when the specified resolution is met. +* [MediaQuery](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/dashboard-layout/default?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) - Allows the panels to be stacked when the specified resolution is met. ## 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_medium=listing&utm_campaign=angular-layout-npm) support system or [Community forum](https://www.syncfusion.com/forums/essential-js2/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm). -* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues/new/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm). +* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm). * Ask your query in [Stack Overflow](https://stackoverflow.com/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) with tag `syncfusion` and `ej2`. +## Related Links + +* [Download Free Trial](https://www.syncfusion.com/downloads?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [Community Forums](https://www.syncfusion.com/forums/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [Knowledge Base](https://www.syncfusion.com/kb/essential-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [Suggest a feature](https://www.syncfusion.com/feedback/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) +* [Pricing](https://www.syncfusion.com/sales/products/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm) + ## License Check the license detail [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/layouts/license/?utm_source=npm&utm_medium=listing&utm_campaign=angular-layout-npm). diff --git a/components/querybuilder/README.md b/components/querybuilder/README.md index 2636c615e..4a0426276 100644 --- a/components/querybuilder/README.md +++ b/components/querybuilder/README.md @@ -1,10 +1,10 @@ # ej2-angular-querybuilder -The [Angular Query Builder](https://www.syncfusion.com/angular-ui-components/angular-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) is a rich and responsive UI for filtering large amounts of data by creating or editing conditions that can be combined with data visualization controls like DataGrid and Charts to view the filtered data. It outputs structured JSON filters that can be easily parsed to create SQL queries. It allows you to create conditions and group them using AND/OR logic. +The [Angular Query Builder](https://www.syncfusion.com/angular-components/angular-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) is a rich and responsive UI for filtering large amounts of data by creating or editing conditions that can be combined with data visualization controls like DataGrid and Charts to view the filtered data. It outputs structured JSON filters that can be easily parsed to create SQL queries. It allows you to create conditions and group them using AND/OR logic. ![QueryBuilder](https://ej2.syncfusion.com/products/images/querybuilder/readme.gif) -> 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). +> 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](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. @@ -23,15 +23,15 @@ Following list of components are available in the package. * QueryBuilder - `QueryBuilder` Query Builder component is a graphical user interface that allows users to create and edit filters. It outputs a structured JSON of filters that can be easily parsed to create SQL. It is integrated with Data Manager to communicate with data sources and returns the desired result based on the provided filter. It supports data binding, templates, validation, and horizontal and vertical orientation. * [Getting Started](https://ej2.syncfusion.com/angular/documentation/querybuilder/getting-started?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) - * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm#/material/querybuilder/default) - * [Product Page](https://www.syncfusion.com/angular-ui-components/angular-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) + * [View Online Demos](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/query-builder/default?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) + * [Product Page](https://www.syncfusion.com/angular-components/angular-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) ## Supported Frameworks These components are available in following list of frameworks. -1. [React Query Builder](https://www.syncfusion.com/react-ui-components/react-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) -2. [Vue Query Builder](https://www.syncfusion.com/vue-ui-components/vue-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +1. [React Query Builder](https://www.syncfusion.com/react-components/react-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +2. [Vue Query Builder](https://www.syncfusion.com/vue-components/vue-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) 3. [JavaScript Query Builder](https://www.syncfusion.com/javascript-ui-controls/js-query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) 4. [ASP.NET Core Query Builder](https://www.syncfusion.com/aspnet-core-ui-controls/query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) 5. [ASP.NET MVC Query Builder](https://www.syncfusion.com/aspnet-mvc-ui-controls/query-builder?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) @@ -56,9 +56,18 @@ These components are available in following list of frameworks. 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_medium=listing&utm_campaign=angular-query-builder-npm) support system or [Community forum](https://www.syncfusion.com/forums/angular-js2?utm_source=npm&utm_campaign=querybuilder)?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm. -* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues/new?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm ). +* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm ). * Ask your query in [Stack Overflow](https://stackoverflow.com/?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) with tag `syncfusion`, `ej2`. +## Related Links + +* [Download Free Trial](https://www.syncfusion.com/downloads?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +* [Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +* [Community Forums](https://www.syncfusion.com/forums/?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +* [Knowledge Base](https://www.syncfusion.com/kb/essential-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +* [Suggest a feature](https://www.syncfusion.com/feedback/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) +* [Pricing](https://www.syncfusion.com/sales/products/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm) + ## License Check the license detail [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/license?utm_source=npm&utm_medium=listing&utm_campaign=angular-query-builder-npm).