mdd-remove-current-api-mistake

doc/en/components/grids/_shared/advanced-filtering.md

@@ -215,7 +215,7 @@ componentDidMount() {
         ignoreCase: true
     });
     tree.filteringOperands.push(subTree);
-    gridRef.current.advancedFilteringExpressionsTree = tree;
+    gridRef.advancedFilteringExpressionsTree = tree;
 }
 ```-->
 <!-- end: React -->

doc/en/components/grids/_shared/cell-editing.md

@@ -70,7 +70,7 @@ this.grid.UpdateCell(newValue, rowID, 'ReorderLevel')
 <!-- React -->
 ```typescript
 function updateCell() {
-    grid1Ref.current.updateCell(newValue, rowID, 'ReorderLevel');
+    grid1Ref.updateCell(newValue, rowID, 'ReorderLevel');
 }
 ```
 <!-- end: React -->
@@ -131,9 +131,9 @@ public updateCell() {
 <!-- React -->
 ```typescript
 function updateCell() {
-    const cell = grid1Ref.current.getCellByColumn(rowIndex, 'ReorderLevel');
+    const cell = grid1Ref.getCellByColumn(rowIndex, 'ReorderLevel');
     // You can also get cell by rowID if primary key is defined
-    // cell = grid1Ref.current.getCellByKey(rowID, 'ReorderLevel');
+    // cell = grid1Ref.getCellByKey(rowID, 'ReorderLevel');
     cell.update(70);
 }
 ```
@@ -559,7 +559,7 @@ public keydownHandler(event) {
 ```typescript
 function keydownHandler(event) {
   const key = event.keyCode;
-  const grid = grid1Ref.current;
+  const grid = grid1Ref;
   const activeElem = grid.navigation.activeNode;
 
   if ((key >= 48 && key <= 57) ||
@@ -610,9 +610,9 @@ if (key == 13) {
     let nextRow = getNextEditableRowIndex(thisRow, rowInfo, event.shiftKey);
 
     // and then we will navigate to it using the grid's built in method navigateTo
-    grid1Ref.current.navigateTo(nextRow, column, (obj) => {
+    grid1Ref.navigateTo(nextRow, column, (obj) => {
         obj.target.activate();
-        grid1Ref.current.clearCellSelection();
+        grid1Ref.clearCellSelection();
     });
 }
 ```
@@ -687,7 +687,7 @@ this.grid.addRow(record);
 // Adding a new record
 // Assuming we have a `getNewRecord` method returning the new row data.
 const record = getNewRecord();
-grid1Ref.current.addRow(record);
+grid1Ref.addRow(record);
 ```
 <!-- end: React -->
 
@@ -755,16 +755,16 @@ row.update(newData);
 <!-- React -->
 ```typescript
 // Updating the whole row
-grid1Ref.current.updateRow(newData, this.selectedCell.cellID.rowID);
+grid1Ref.updateRow(newData, this.selectedCell.cellID.rowID);
 
 // Just a particular cell through the Grid API
-grid1Ref.current.updateCell(newData, this.selectedCell.cellID.rowID, this.selectedCell.column.field);
+grid1Ref.updateCell(newData, this.selectedCell.cellID.rowID, this.selectedCell.column.field);
 
 // Directly using the cell `update` method
 selectedCell.update(newData);
 
 // Directly using the row `update` method
-const row = grid1Ref.current.getRowByKey(rowID);
+const row = grid1Ref.getRowByKey(rowID);
 row.update(newData);
 ```
 <!-- end: React -->
@@ -876,9 +876,9 @@ row.delete();
 <!-- React -->
 ```typescript
 // Delete row through Grid API
-grid1Ref.current.deleteRow(selectedCell.cellID.rowID);
+grid1Ref.deleteRow(selectedCell.cellID.rowID);
 // Delete row through row object
-const row = grid1Ref.current.getRowByIndex(rowIndex);
+const row = grid1Ref.getRowByIndex(rowIndex);
 row.del();
 ```
 <!-- end: React -->

doc/en/components/grids/_shared/cell-selection.md

@@ -109,7 +109,7 @@ this.grid.selectRange(range);
 
 ```tsx
 const range = { rowStart: 2, rowEnd: 2, columnStart: 1, columnEnd: 1 };
-gridRef.current.selectRange(range);
+gridRef.selectRange(range);
 ```
 
 <!-- Blazor -->
@@ -147,7 +147,7 @@ this.grid.clearCellSelection();
 <!-- end: WebComponents -->
 
 ```tsx
-gridRef.current.clearCellSelection();
+gridRef.clearCellSelection();
 ```
 
 

doc/en/components/grids/_shared/column-pinning.md

@@ -119,8 +119,8 @@ this.grid.unpinColumn('Name');
 
 <!-- React -->
 ```typescript
-gridRef.current.pinColumn('AthleteNumber');
-gridRef.current.unpinColumn('Name');
+gridRef.pinColumn('AthleteNumber');
+gridRef.unpinColumn('Name');
 ```
 <!-- end: React -->
 

doc/en/components/grids/_shared/live-data.md

@@ -141,7 +141,7 @@ private updateData(data: any[]) {
         rowData.price = { usd: getUSD(), eur: getEUR() };
         newData.push({...rowData});
     }
-    gridRef.current.data = newData;
+    gridRef.data = newData;
 }
 ```
 <!-- end: React -->

doc/en/components/grids/_shared/remote-data-operations.md

@@ -967,7 +967,7 @@ and finally set up the method for loading the data:
         setData(response.items);
         // Stop loading when data is retrieved
         setIsLoading(false);
-        paginator.current.totalRecords = response.totalRecordsCount;
+        paginator.totalRecords = response.totalRecordsCount;
       })
       .catch((error) => {
         console.error(error.message);
@@ -1264,7 +1264,7 @@ next set up the method for loading the data:
         setData(response.items);
         // Stop loading when data is retrieved
         setIsLoading(false);
-        paginator.current.totalRecords = response.totalRecordsCount;
+        paginator.totalRecords = response.totalRecordsCount;
       })
       .catch((error) => {
         console.error(error.message);

doc/en/components/grids/_shared/row-adding.md

@@ -495,8 +495,8 @@ this.grid.beginAddRowById(null);     // Spawns the add row UI as the first recor
 
 <!-- React -->
 ```typescript
-gridRef.current.beginAddRowById('ALFKI');  // Spawns the add row UI under the row with PK 'ALFKI'
-gridRef.current.beginAddRowById(null);     // Spawns the add row UI as the first record
+gridRef.beginAddRowById('ALFKI');  // Spawns the add row UI under the row with PK 'ALFKI'
+gridRef.beginAddRowById(null);     // Spawns the add row UI as the first record
 ```
 <!-- end: React -->
 
@@ -518,8 +518,8 @@ this.grid.beginAddRowByIndex(0);    // Spawns the add row UI as the first record
 
 <!-- React -->
 ```typescript
-gridRef.current.beginAddRowByIndex(10);   // Spawns the add row UI at index 10
-gridRef.current.beginAddRowByIndex(0);    // Spawns the add row UI as the first record
+gridRef.beginAddRowByIndex(10);   // Spawns the add row UI at index 10
+gridRef.beginAddRowByIndex(0);    // Spawns the add row UI as the first record
 ```
 <!-- end: React -->
 
@@ -634,7 +634,7 @@ this.grid.rowAddTextTemplate = (ctx: IgcGridEmptyTemplateContext) => {
 <!-- React -->
 <!-- ComponentStart: Grid, TreeGrid, HierarchicalGrid -->
 ```tsx
-gridRef.current.rowAddTextTemplate = (ctx: IgrGridEmptyTemplateContext) => {
+gridRef.rowAddTextTemplate = (ctx: IgrGridEmptyTemplateContext) => {
     return ('Adding Row');
 }
 ```            

doc/en/components/grids/_shared/row-pinning.md

@@ -95,7 +95,7 @@ this.grid.getRowByIndex(0).pinned = true;
 <!-- end: Angular, WebComponents -->
 
 ```tsx
-gridRef.current.getRowByIndex(0).pinned = true;
+gridRef.getRowByIndex(0).pinned = true;
 ```
 
 ```razor
@@ -112,8 +112,8 @@ this.grid.unpinRow('ALFKI');
 <!-- end: Angular, WebComponents -->
 
 ```tsx
-gridRef.current.pinRow('ALFKI');
-gridRef.current.unpinRow('ALFKI');
+gridRef.pinRow('ALFKI');
+gridRef.unpinRow('ALFKI');
 ```
 
 

doc/en/components/grids/_shared/row-selection.md

@@ -276,7 +276,7 @@ public onClickSelect() {
 
 ```tsx
 function onClickSelect() {
-    gridRef.current.selectRows([1,2,5], true);
+    gridRef.selectRows([1,2,5], true);
 }
 
 <{ComponentSelector} primaryKey="ProductID" rowSelection="multiple" autoGenerate="true" ref={gridRef}>
@@ -346,7 +346,7 @@ public onClickDeselect() {
 
 ```tsx
 function onClickDeselect() {
-    gridRef.current.deselectRows([1,2,5]);
+    gridRef.deselectRows([1,2,5]);
 }
 
 <{ComponentSelector} primaryKey="ProductID" rowSelection="multiple" autoGenerate="true" ref={gridRef}>
@@ -467,7 +467,7 @@ public getSelectedRows() {
 
 ```tsx
 function getSelectedRows() {
-    return gridRef.current.selectedRows;
+    return gridRef.selectedRows;
 }
 ```
 

doc/en/components/grids/_shared/search.md

@@ -286,11 +286,11 @@ public nextSearch(){
 ```tsx
 function handleOnSearchChange(input: IgrInput, event: IgrComponentValueChangedEventArgs) {
     setSearchText(event.detail);
-    gridRef.current.findNext(event.detail, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(event.detail, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 function nextSearch() {
-    gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 
@@ -330,11 +330,11 @@ public void NextSearch()
 ```tsx
 function handleOnSearchChange(input: IgrInput, event: IgrComponentValueChangedEventArgs) {
     setSearchText(event.detail);
-    gridRef.current.findNext(event.detail, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(event.detail, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 function nextSearch() {
-    gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 
@@ -475,11 +475,11 @@ public nextSearch() {
 
 ```tsx
 function prevSearch() {
-    gridRef.current.findPrev(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findPrev(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 function nextSearch() {
-    gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 <IgrIconButton key="prevIconButton" ref={iconButtonPrevRef} variant="flat" name="prev" collection="material" clicked={prevSearch}>
@@ -544,10 +544,10 @@ public onSearchKeydown(evt: KeyboardEvent) {
 function searchKeyDown(e: KeyboardEvent<HTMLElement>) {
     if (e.key === 'Enter') {
         e.preventDefault();
-        gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+        gridRef.findNext(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
     } else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {
         e.preventDefault();
-        gridRef.current.findPrev(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+        gridRef.findPrev(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
     }
 }
 
@@ -610,16 +610,16 @@ public onSearchKeydown(evt: KeyboardEvent) {
 function searchKeyDown(e: KeyboardEvent<HTMLElement>) {
     if (e.key === 'Enter' || e.key === 'ArrowDown') {
         e.preventDefault();
-        gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+        gridRef.findNext(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
     } else if (e.key === 'ArrowUp') {
         e.preventDefault();
-        gridRef.current.findPrev(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+        gridRef.findPrev(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
     }
 }
 
 function handleOnSearchChange(input: IgrInput, event: IgrComponentValueChangedEventArgs) {
     setSearchText(event.detail);
-    gridRef.current.findNext(event.detail, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(event.detail, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 <div onKeyDown={searchKeyDown}>
@@ -769,7 +769,7 @@ const caseSensitiveChipRef = useRef<IgrChip>(null);
 const exactMatchChipRef = useRef<IgrChip>(null);
 
 function updateSearch() {
-    gridRef.current.findNext("searchValue", caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext("searchValue", caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 <IgrChip ref={caseSensitiveChipRef} key="caseSensitiveChip" selectable="true">
@@ -964,14 +964,14 @@ const clearIconText =
 
 useEffect(() => {
      if (searchIconRef?.current) {
-      searchIconRef.current.registerIconFromText("search", searchIconText, "material");
-      searchIconRef.current.registerIconFromText("clear", clearIconText, "material");
+      searchIconRef.registerIconFromText("search", searchIconText, "material");
+      searchIconRef.registerIconFromText("clear", clearIconText, "material");
     }
     if (iconButtonPrevRef?.current) {
-        iconButtonPrevRef.current.registerIconFromText("prev", prevIconText, "material");
+        iconButtonPrevRef.registerIconFromText("prev", prevIconText, "material");
     }
     if (iconButtonNextRef?.current) {
-        iconButtonNextRef.current.registerIconFromText("next", nextIconText, "material");
+        iconButtonNextRef.registerIconFromText("next", nextIconText, "material");
     }
 }, []);
 
@@ -1080,20 +1080,20 @@ const clearIconText =
 
 useEffect(() => {
     if (searchIconRef?.current) {
-        searchIconRef.current.registerIconFromText("search", searchIconText, "material");
-        searchIconRef.current.registerIconFromText("clear", clearIconText, "material");
+        searchIconRef.registerIconFromText("search", searchIconText, "material");
+        searchIconRef.registerIconFromText("clear", clearIconText, "material");
     }
     if (iconButtonPrevRef?.current) {
-        iconButtonPrevRef.current.registerIconFromText("prev", prevIconText,"material");
+        iconButtonPrevRef.registerIconFromText("prev", prevIconText,"material");
     }
     if (iconButtonNextRef?.current) {
-        iconButtonNextRef.current.registerIconFromText("next", nextIconText, "material");
+        iconButtonNextRef.registerIconFromText("next", nextIconText, "material");
     }
 }, []);
 
 function clearSearch() {
   setSearchText('');
-  gridRef.current.clearSearch();
+  gridRef.clearSearch();
 }
 
 <IgrInput name="searchBox" value={searchText} inputOcurred={handleOnSearchChange}>
@@ -1276,10 +1276,10 @@ constructor() {
 </div>
 
 function handleCaseSensitiveChange(chip: IgrChip, event: IgrComponentBoolValueChangedEventArgs) {
-  gridRef.current.findNext(searchText, event.detail, exactMatchChipRef.current.selected);
+  gridRef.findNext(searchText, event.detail, exactMatchChipRef.selected);
 }
 function handleExactMatchChange(chip: IgrChip, event: IgrComponentBoolValueChangedEventArgs) {
-  gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, event.detail);
+  gridRef.findNext(searchText, caseSensitiveChipRef.selected, event.detail);
 }
 ```
 
@@ -1371,11 +1371,11 @@ public nextSearch() {
 
 ```tsx
 function prevSearch() {
-    gridRef.current.findPrev(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findPrev(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 function nextSearch() {
-    gridRef.current.findNext(searchText, caseSensitiveChipRef.current.selected, exactMatchChipRef.current.selected);
+    gridRef.findNext(searchText, caseSensitiveChipRef.selected, exactMatchChipRef.selected);
 }
 
 <div slot="suffix" key="buttonsSuffix">

doc/en/components/grids/_shared/selection.md

@@ -272,7 +272,7 @@ public copySelectedCells(event) {
 
 ```tsx
 function copySelectedRowData() {
-    const selectedData = gridRef.current.getRowData(clickedCell.id.rowID);
+    const selectedData = gridRef.getRowData(clickedCell.id.rowID);
     copyData(selectedData);
     closeContextMenu();
 }
@@ -284,7 +284,7 @@ function copySelectedCellData() {
 }
 
 function copySelectedData() {
-    const selectedData = gridRef.current.getSelectedData(null,null);
+    const selectedData = gridRef.getSelectedData(null,null);
     copyData(selectedData);
     closeContextMenu();
 }