diff --git a/src/sql/azdata.proposed.d.ts b/src/sql/azdata.proposed.d.ts
index a14ec5d54f..8c7e5926ee 100644
--- a/src/sql/azdata.proposed.d.ts
+++ b/src/sql/azdata.proposed.d.ts
@@ -380,6 +380,11 @@ declare module 'azdata' {
 		 * Gets a boolean value determines whether the row selection is enabled. Default value is false.
 		 */
 		enableRowSelection?: boolean;
+
+		/**
+		 * Gets or sets the selected row number of the table. -1 means to no selected row.
+		 */
+		selectedRow?: number;
 	}
 
 	export interface DeclarativeTableCellValue {
diff --git a/src/sql/workbench/api/common/extHostModelView.ts b/src/sql/workbench/api/common/extHostModelView.ts
index 9791c0921d..085217e094 100644
--- a/src/sql/workbench/api/common/extHostModelView.ts
+++ b/src/sql/workbench/api/common/extHostModelView.ts
@@ -1544,7 +1544,7 @@ class DeclarativeTableWrapper extends ComponentWrapper implements azdata.Declara
 		super(proxy, handle, ModelComponentTypes.DeclarativeTable, id, logService);
 		this.properties = {};
 		this._emitterMap.set(ComponentEventType.onDidChange, new Emitter<any>());
-		this._emitterMap.set(ComponentEventType.onDidClick, new Emitter<any>());
+		this._emitterMap.set(ComponentEventType.onSelectedRowChanged, new Emitter<azdata.DeclarativeTableRowSelectedEvent>());
 
 	}
 
@@ -1581,8 +1581,8 @@ class DeclarativeTableWrapper extends ComponentWrapper implements azdata.Declara
 		return emitter && emitter.event;
 	}
 
-	public get onRowSelected(): vscode.Event<any> {
-		let emitter = this._emitterMap.get(ComponentEventType.onDidClick);
+	public get onRowSelected(): vscode.Event<azdata.DeclarativeTableRowSelectedEvent> {
+		let emitter = this._emitterMap.get(ComponentEventType.onSelectedRowChanged);
 		return emitter && emitter.event;
 	}
 
@@ -1602,6 +1602,14 @@ class DeclarativeTableWrapper extends ComponentWrapper implements azdata.Declara
 		this._proxy.$doAction(this._handle, this._id, ModelViewAction.Filter, rowIndexes);
 	}
 
+	public get selectedRow(): number {
+		return this.properties['selectedRow'] ?? -1;
+	}
+
+	public set selectedRow(v: number) {
+		this.setProperty('selectedRow', v);
+	}
+
 	public toComponentShape(): IComponentShape {
 		// Overridden to ensure we send the correct properties mapping.
 		return <IComponentShape>{
diff --git a/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts b/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts
index 1e692df53d..6702f2d822 100644
--- a/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts
+++ b/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts
@@ -18,6 +18,7 @@ import { localize } from 'vs/nls';
 import { ILogService } from 'vs/platform/log/common/log';
 import * as colorRegistry from 'vs/platform/theme/common/colorRegistry';
 import { IColorTheme, IThemeService } from 'vs/platform/theme/common/themeService';
+import { equals } from 'vs/base/common/objects';
 
 export enum DeclarativeDataType {
 	string = 'string',
@@ -38,7 +39,6 @@ export default class DeclarativeTableComponent extends ContainerBase<any, azdata
 	private _data: azdata.DeclarativeTableCellValue[][] = [];
 	private _filteredRowIndexes: number[] | undefined = undefined;
 	private columns: azdata.DeclarativeTableColumn[] = [];
-	private _selectedRow: number;
 	private _colorTheme: IColorTheme;
 	private _hasFocus: boolean;
 
@@ -284,7 +284,9 @@ export default class DeclarativeTableComponent extends ContainerBase<any, azdata
 
 		// check whether the data property is changed before actually setting the properties.
 		const isDataPropertyChanged = !arrayEquals(this.data, finalData ?? [], (a, b) => {
-			return arrayEquals(a, b);
+			return arrayEquals(a, b, (cell1, cell2) => {
+				return equals(cell1, cell2);
+			});
 		});
 
 		// the angular is using reference compare to determine whether the data is changed or not
@@ -295,12 +297,23 @@ export default class DeclarativeTableComponent extends ContainerBase<any, azdata
 			this.clearContainer();
 			this._data = finalData;
 		}
+
+		const newSelectedRow = properties.selectedRow ?? -1;
+		if (newSelectedRow !== this.selectedRow && properties.enableRowSelection) {
+			this.fireEvent({
+				eventType: ComponentEventType.onSelectedRowChanged,
+				args: {
+					row: properties.selectedRow
+				}
+			});
+		}
+
 		super.setProperties(properties);
 	}
 
 	public clearContainer(): void {
 		super.clearContainer();
-		this._selectedRow = -1;
+		this.selectedRow = -1;
 	}
 
 	public get data(): azdata.DeclarativeTableCellValue[][] {
@@ -311,7 +324,7 @@ export default class DeclarativeTableComponent extends ContainerBase<any, azdata
 		if (!this.enableRowSelection) {
 			return false;
 		}
-		return this._selectedRow === row;
+		return this.selectedRow === row;
 	}
 
 	public onRowSelected(row: number) {
@@ -319,12 +332,12 @@ export default class DeclarativeTableComponent extends ContainerBase<any, azdata
 			return;
 		}
 		if (this._rowSelectionFocusFlag || !this.isRowSelected(row)) {
-			this._selectedRow = row;
+			this.selectedRow = row;
 			this._rowSelectionFocusFlag = false;
 			this._changeRef.detectChanges();
 
 			this.fireEvent({
-				eventType: ComponentEventType.onDidClick,
+				eventType: ComponentEventType.onSelectedRowChanged,
 				args: {
 					row
 				}
@@ -396,4 +409,14 @@ export default class DeclarativeTableComponent extends ContainerBase<any, azdata
 	public get enableRowSelection(): boolean {
 		return this.getPropertyOrDefault<boolean>((props) => props.enableRowSelection, false);
 	}
+
+	public get selectedRow(): number {
+		return this.getPropertyOrDefault<number>((props) => props.selectedRow, -1);
+	}
+
+	public set selectedRow(row: number) {
+		if (row !== this.selectedRow) {
+			this.setPropertyFromUI<number>((properties, value) => { properties.selectedRow = value; }, row);
+		}
+	}
 }