Integrated latest changes at 01-23-2024 1:30:10 AM

Author: SyncfusionBuild

ej2-angular-toc.html

@@ -2814,7 +2814,7 @@
     </ul>
  </li> <li>Release Notes
                 <ul>
-				<li>2023 Volume 4 - 24.*<ul><li>Weekly Nuget Release <ul><li><a href="/ej2-angular/release-notes/24.1.46">24.1.46</a></li><li><a href="/ej2-angular/release-notes/24.1.45">24.1.45</a></li><li><a href="/ej2-angular/release-notes/24.1.44">24.1.44</a></li><li><a href="/ej2-angular/release-notes/24.1.43">24.1.43</a></li></ul></li><li><a href="/ej2-angular/release-notes/24.1.41">24.1.41 Main Release</a></li></ul></li>
+				<li>2023 Volume 4 - 24.*<ul><li>Weekly Nuget Release <ul><li><a href="/ej2-angular/release-notes/24.1.47">24.1.47</a></li><li><a href="/ej2-angular/release-notes/24.1.46">24.1.46</a></li><li><a href="/ej2-angular/release-notes/24.1.45">24.1.45</a></li><li><a href="/ej2-angular/release-notes/24.1.44">24.1.44</a></li><li><a href="/ej2-angular/release-notes/24.1.43">24.1.43</a></li></ul></li><li><a href="/ej2-angular/release-notes/24.1.41">24.1.41 Main Release</a></li></ul></li>
 				<li>2023 Volume 3 - 23.*<ul><li> Weekly Nuget Release <ul><li><a href="/ej2-angular/release-notes/23.2.7">23.2.7</a></li><li><a href="/ej2-angular/release-notes/23.2.6">23.2.6</a></li><li><a href="/ej2-angular/release-notes/23.2.5">23.2.5</a></li><li><a href="/ej2-angular/release-notes/23.1.44">23.1.44</a></li><li><a href="/ej2-angular/release-notes/23.1.43">23.1.43</a></li><li><a href="/ej2-angular/release-notes/23.1.42">23.1.42</a></li><li><a href="/ej2-angular/release-notes/23.1.41">23.1.41</a></li><li><a href="/ej2-angular/release-notes/23.1.40">23.1.40</a></li><li><a href="/ej2-angular/release-notes/23.1.39">23.1.39</a></li><li><a href="/ej2-angular/release-notes/23.1.38">23.1.38</a></li></ul></li>
 				<li><a href="/ej2-angular/release-notes/23.2.4">23.2.4 Service Pack Release</a></li>
 				<li><a href="/ej2-angular/release-notes/23.1.36">23.1.36 Main Release</a></li></ul></li>

ej2-angular/Release-notes/24.1.47.md

@@ -0,0 +1,16 @@
+---
+title: Essential Studio for Angular 2023 Weekly Nuget Release Release Notes  
+description: Essential Studio for Angular 2023 Weekly Nuget Release Release Notes  
+platform: ej2-angular
+documentation: ug
+---
+
+# Essential Studio for  ##Platform_Name##   Release Notes  
+
+{% include release-info.html date="January 23, 2024"  version="v24.1.47" %} 
+
+{% directory path: _includes/release-notes/v24.1.47 %}
+
+{% include {{file.url}} %}
+
+{% enddirectory %}

ej2-angular/calendar/customization.md

@@ -10,15 +10,15 @@ domainurl: ##DomainURL##
 
 # Customization in Angular Calendar component
 
-Calendar allows you to customize the entire appearance by using the custom CSS and [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs#renderdaycelleventargs) event to customize the each day cell.
+Calendar allows you to customize the entire appearance by using the custom CSS and [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs/#renderdaycelleventargs) event to customize the each day cell.
 
 This following section demonstrates how to disable, highlights the specific dates in the Calendar.
 
 ## Disable Weekends
 
-You can disable the weekends of every month in a Calendar by using the [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs#renderdaycelleventargs) event. The `isDisabled` argument from this event allows you to define whether the date to be disabled or not.
+You can disable the weekends of every month in a Calendar by using the [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs/#renderdaycelleventargs) event. The `isDisabled` argument from this event allows you to define whether the date to be disabled or not.
 
-> Set [`isDisabled`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs#renderdaycelleventargs) to true to disable the date value.
+> Set [`isDisabled`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs/#renderdaycelleventargs) to true to disable the date value.
 
 The following example demonstrates how to disable weekends of every month.
 
@@ -38,7 +38,7 @@ The following example demonstrates how to disable weekends of every month.
 
 ## Day Cell Format
 
-You can highlight the specific dates by adding the custom CSS or element to the day cell by using [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs#renderdaycelleventargs).
+You can highlight the specific dates by adding the custom CSS or element to the day cell by using [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs/#renderdaycelleventargs).
 
 Below is the list of classes that provides the flexible way to customize the Calendar component.
 
@@ -77,7 +77,7 @@ The following example highlights the world health date (7th April every year) an
 
 ## Highlight Weekends
 
-You can highlight the weekends of every month in a Calendar by using the [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs#renderdaycelleventargs) event. The following example demonstrates how to highlights the weekends of every month.
+You can highlight the weekends of every month in a Calendar by using the [`renderDayCell`](https://ej2.syncfusion.com/angular/documentation/api/calendar/renderDayCellEventArgs/#renderdaycelleventargs) event. The following example demonstrates how to highlights the weekends of every month.
 
 {% tabs %}
 {% highlight ts tabtitle="app.component.ts" %}

ej2-angular/calendar/getting-started.md

@@ -191,7 +191,7 @@ The following example demonstrates how to set the value,  min and max dates on i
 
 {% previewsample "page.domainurl/samples/calendar/getting-started-cs9" %}
 
-> You can refer to our [Angular Calendar](https://www.syncfusion.com/angular-ui-components/angular-calendar) feature tour page for its groundbreaking feature representations. You can also explore our [Angular Calendar example](https://ej2.syncfusion.com/angular/demos/#/material/calendar/default) that shows how to render the Calendar in Angular.
+> You can refer to our [Angular Calendar](https://www.syncfusion.com/angular-components/angular-calendar) feature tour page for its groundbreaking feature representations. You can also explore our [Angular Calendar example](https://ej2.syncfusion.com/angular/demos/#/material/calendar/default) that shows how to render the Calendar in Angular.
 
 ## See Also
 

ej2-angular/chart/getting-started.md

@@ -10,7 +10,7 @@ domainurl: ##DomainURL##
 
 # Getting started with Angular Chart component
 
-This section explains you the steps required to create a simple [Angular Chart](https://www.syncfusion.com/angular-ui-components/angular-charts) and demonstrate the basic usage of the Chart component in an Angular environment.
+This section explains you the steps required to create a simple [Angular Chart](https://www.syncfusion.com/angular-components/angular-charts) and demonstrate the basic usage of the Chart component in an Angular environment.
 
 To get start quickly with Angular Chart using CLI and Schematics, you can check on this video:
 
@@ -190,7 +190,7 @@ This section explains how to plot below JSON data to the chart.
 
  ```
 
- Add a series object to the chart by using [`series`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/) property. Now map the field names `month` and `sales` in the JSON data to the [`xName`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/#xname) and [`yName`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/#yname) properties of the series, then set the JSON data to [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective#datasource) property.
+ Add a series object to the chart by using [`series`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/) property. Now map the field names `month` and `sales` in the JSON data to the [`xName`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/#xname) and [`yName`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/#yname) properties of the series, then set the JSON data to [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart/seriesDirective/#datasource) property.
 
 Since the JSON contains category data, set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart/axisDirective/#valuetype)for horizontal axis to `Category`. By default, the axis valueType is `Numeric`.
 
@@ -210,7 +210,7 @@ Since the JSON contains category data, set the [`valueType`](https://ej2.syncfus
 
 The sales data are in thousands, so format the vertical axis label by adding
 <b>$</b> as a prefix and `K` as a suffix to each label. This can be achieved by setting the
-`${value}K` to the [`labelFormat`](https://ej2.syncfusion.com/angular/documentation/api/chart/axisDirective#labelformat) property of axis. Here, `{value}` act as a placeholder
+`${value}K` to the [`labelFormat`](https://ej2.syncfusion.com/angular/documentation/api/chart/axisDirective/#labelformat) property of axis. Here, `{value}` act as a placeholder
 for each axis label.
 
 

ej2-angular/check-box/getting-started.md

@@ -153,12 +153,12 @@ The Essential JS 2 CheckBox contains 3 different states visually, they are:
 * Unchecked
 * Indeterminate
 
-The CheckBox [`checked`](https://ej2.syncfusion.com/angular/documentation/api/check-box#checked) property is used to handle the checked and unchecked state.
+The CheckBox [`checked`](https://ej2.syncfusion.com/angular/documentation/api/check-box/#checked) property is used to handle the checked and unchecked state.
 In checked state a tick mark will be added to the visualization of CheckBox.
 
 ### Indeterminate
 
-CheckBox indeterminate state can be set through [`indeterminate`](https://ej2.syncfusion.com/angular/documentation/api/check-box#indeterminate) property. CheckBox indeterminate state masks the real value of CheckBox visually. Checkbox cannot be changed to indeterminate state through the user interface, this state can be achieved only through the property.
+CheckBox indeterminate state can be set through [`indeterminate`](https://ej2.syncfusion.com/angular/documentation/api/check-box/#indeterminate) property. CheckBox indeterminate state masks the real value of CheckBox visually. Checkbox cannot be changed to indeterminate state through the user interface, this state can be achieved only through the property.
 
 {% tabs %}
 {% highlight ts tabtitle="app.component.ts" %}

ej2-angular/code-snippet/rich-text-editor/mention-integration-cs1/src/app.component.ts

@@ -3,14 +3,14 @@
  */
 import { Component } from '@angular/core';
 import { ToolbarService, HtmlEditorService, ImageService, LinkService } from '@syncfusion/ej2-angular-richtexteditor';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+
 
 @Component( {
     selector: 'app-root',
     template: `<ejs-richtexteditor id="mention_integration"  placeholder="Type @ and tag the name" (actionBegin)="onActionBegin($event)">
     <ng-template #valueTemplate>
-        <p>Hello <span contenteditable="false" class="e-mention-chip"><a href="mailto:maria@gmail.com" title="maria@gmail.com">@Maria</a></span>&#8203;</p>
-        <p>Welcome to the mention integration with rich text editor demo. Type <code>@</code> character and tag user from the suggestion list. </p>
+        <p>Hello <span contenteditable="false" class="e-mention-chip"><a href="mailto:maria@gmail.com" title="maria@gmail.com">&#64;Maria</a></span>&#8203;</p>
+        <p>Welcome to the mention integration with rich text editor demo. Type <code>&#64;</code> character and tag user from the suggestion list. </p>
     </ng-template>
 </ejs-richtexteditor>
 <ejs-mention [dataSource]='data' target='#mention_integration_rte-edit-view' [fields]='fieldsData' [suggestionCount]="8" [showMentionChar]="false" [allowSpaces]="true"  
@@ -32,7 +32,7 @@ popupWidth='250px' popupHeight='200px'>
             </table>
     </ng-template>
     <ng-template #displayTemplate let-data>
-        <a href="mailto:{{data.EmailId}}" title="{{data.EmailId}}">@{{data.Name}}</a>
+        <a href="mailto:{{data.EmailId}}" title="{{data.EmailId}}">&#64;{{data.Name}}</a>
     </ng-template>
 </ejs-mention>
 `,
@@ -62,9 +62,10 @@ export class AppComponent {
       ];
       public  fieldsData: { [key: string]: string } = { text: 'Name' };
 
-      onActionBegin(args){
-        if (args.requestType === 'EnterAction' && !isNullOrUndefined(document.querySelector('.e-mention.e-popup-open'))) {
-            args.cancel = true;
+      onActionBegin(args: any) {
+        const mentionPopup = document.querySelector('.e-mention.e-popup-open');
+        if (args.requestType === 'EnterAction' && mentionPopup !== null) {
+          args.cancel = true;
         }
       }
 }

ej2-angular/code-snippet/rich-text-editor/mention-integration-cs1/src/app.module.ts

@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { RichTextEditorAllModule } from '@syncfusion/ej2-angular-richtexteditor';
+import { MentionModule  } from '@syncfusion/ej2-angular-dropdowns';
 import { AppComponent } from './app.component';
 
 /**
@@ -9,7 +10,8 @@ import { AppComponent } from './app.component';
 @NgModule({
     imports: [
         BrowserModule,
-        RichTextEditorAllModule
+        RichTextEditorAllModule,
+        MentionModule
     ],
     declarations: [AppComponent],
     bootstrap: [AppComponent]

ej2-angular/color-picker/how-to/customize-colorpicker.md

@@ -12,7 +12,7 @@ domainurl: ##DomainURL##
 
 ## Custom palette
 
-By default, the Palette will be rendered with default colors. To load custom colors in the palette, specify the colors in the [`presetColors`](https://ej2.syncfusion.com/angular/documentation/api/color-picker#presetcolors) property. To customize the color palette, add a custom class to palette tiles using [`BeforeTileRender`](https://ej2.syncfusion.com/angular/documentation/api/color-picker#beforetilerender) event.
+By default, the Palette will be rendered with default colors. To load custom colors in the palette, specify the colors in the [`presetColors`](https://ej2.syncfusion.com/angular/documentation/api/color-picker/#presetcolors) property. To customize the color palette, add a custom class to palette tiles using [`BeforeTileRender`](https://ej2.syncfusion.com/angular/documentation/api/color-picker/#beforetilerender) event.
 
 The following sample demonstrates the above functionalities.
 
@@ -32,7 +32,7 @@ The following sample demonstrates the above functionalities.
 
 ## Hide input area from picker
 
-By default, the input area will be rendered in ColorPicker. To hide the input area from it, add `e-hide-value` class to ColorPicker using the [`cssClass`](https://ej2.syncfusion.com/angular/documentation/api/color-picker#cssclass) property.
+By default, the input area will be rendered in ColorPicker. To hide the input area from it, add `e-hide-value` class to ColorPicker using the [`cssClass`](https://ej2.syncfusion.com/angular/documentation/api/color-picker/#cssclass) property.
 
 In the following sample, the ColorPicker is rendered without input area.
 
@@ -74,7 +74,7 @@ The following sample show the customized color picker handle.
 
 By default, the applied color will be updated in primary button of the color picker. You can customize that as `icon`.
 
-In the following sample, the `picker` icon is added to primary button and using [`change`](https://ej2.syncfusion.com/angular/documentation/api/color-picker#change) event the selected color will be updated in bottom portion of the icon.
+In the following sample, the `picker` icon is added to primary button and using [`change`](https://ej2.syncfusion.com/angular/documentation/api/color-picker/#change) event the selected color will be updated in bottom portion of the icon.
 
 {% tabs %}
 {% highlight ts tabtitle="app.component.ts" %}

ej2-angular/combo-box/getting-started.md

@@ -252,8 +252,8 @@ In ComboBox, the `value` property supports two-way binding functionality. The fo
 
 {% previewsample "page.domainurl/samples/combobox/getting-started-cs14" %}
 
-> You can refer to our [Angular ComboBox]( https://www.syncfusion.com/angular-ui-components/angular-combobox) feature tour page for its groundbreaking feature representations. You can also explore our [Angular ComboBox example](https://ej2.syncfusion.com/angular/demos/#/material/combo-box/default) that shows how to render the ComboBox in Angular.
+> You can refer to our [Angular ComboBox]( https://www.syncfusion.com/angular-components/angular-combobox) feature tour page for its groundbreaking feature representations. You can also explore our [Angular ComboBox example](https://ej2.syncfusion.com/angular/demos/#/material/combo-box/default) that shows how to render the ComboBox in Angular.
 
 ## See Also
 
-* [How to bind the data](./data-binding/)
+* [How to bind the data](./data-binding)

ej2-angular/context-menu/how-to/add-or-remove-context-menu-items.md

@@ -10,7 +10,7 @@ domainurl: ##DomainURL##
 
 # Add or remove context menu items in Angular Context menu component
 
-ContextMenu items can be added or removed using the [`insertAfter`](https://ej2.syncfusion.com/angular/documentation/api/menu#insertafter), [`insertBefore`](https://ej2.syncfusion.com/angular/documentation/api/menu#insertbefore) and [`removeItems`](https://ej2.syncfusion.com/angular/documentation/api/menu#removeitems) methods.
+ContextMenu items can be added or removed using the [`insertAfter`](https://ej2.syncfusion.com/angular/documentation/api/menu/#insertafter), [`insertBefore`](https://ej2.syncfusion.com/angular/documentation/api/menu/#insertbefore) and [`removeItems`](https://ej2.syncfusion.com/angular/documentation/api/menu/#removeitems) methods.
 
 In the following example, the **Display Settings** menu items are added before the **Personalize** item, the **Sort By** menu items are added after the **Refresh**, and the **Paste** item is removed from context menu.