Frappe core class how extends in js file

class CardDialog extends WidgetDialog {
constructor(opts) {
super(opts);
}

get_fields() {
	let me = this;
	return [
		{
			fieldtype: "Data",
			fieldname: "label",
			label: __("Label"),
		},
		{
			fieldtype: "Color",
			fieldname: "title_color",
			label: __("Title Color"),
		},
		{
			fieldtype: "Attach",
			fieldname: "card_icon",
			label: __("Card Icon"),
			
		},
		{
			fieldtype: "HTML Editor",
			fieldname: "description",
			label: __("Description"),
			max_height: "7rem",
		},
		{
			fieldname: "links",
			fieldtype: "Table",
			label: __("Card Links"),
			editable_grid: 1,
			data: me.values ? JSON.parse(me.values.links) : [],
			get_data: () => {
				return me.values ? JSON.parse(me.values.links) : [];
			},
			fields: [
				{
					fieldname: "link_type",
					fieldtype: "Select",
					in_list_view: 1,
					label: __("Link Type"),
					reqd: 1,
					options: ["DocType", "Page", "Report"],
				},
				{
					fieldname: "link_to",
					fieldtype: "Dynamic Link",
					in_list_view: 1,
					label: __("Link To"),
					reqd: 1,
					get_options: (df) => {
						return df.doc.link_type;
					},
					get_query: function (df) {
						if (df.link_type == "DocType") {
							return {
								filters: {
									istable: 0,
								},
							};
						}
					},
				},
				{
					fieldname: "label",
					fieldtype: "Data",
					in_list_view: 1,
					label: __("Label"),
				},
				{
					fieldname: "icon",
					fieldtype: "Icon",
					label: "Icon",
				},
				{
					fieldname: "column_break_7",
					fieldtype: "Column Break",
				},
				{
					fieldname: "dependencies",
					fieldtype: "Data",
					label: __("Dependencies"),
				},
				{
					fieldname: "only_for",
					fieldtype: "Link",
					label: __("Only for"),
					options: "Country",
				},
				{
					default: "0",
					fieldname: "onboard",
					fieldtype: "Check",
					label: __("Onboard"),
				},
				{
					default: "0",
					fieldname: "is_query_report",
					fieldtype: "Check",
					label: __("Is Query Report"),
				},
			],
		},
	];
}

process_data(data) {
	let message = "";

	if (!data.links) {
		message = __("You must add atleast one link.");
	} else {
		data.links.map((item, idx) => {
			let row = idx + 1;

			if (!item.link_type) {
				message = __("Following fields have missing values") + ": <br><br><ul>";
				message += `<li>${__("Link Type in Row")} ${row}</li>`;
			}

			if (!item.link_to) {
				message += `<li>${__("Link To in Row")} ${row}</li>`;
			}

			item.label = item.label ? item.label : item.link_to;
		});
	}

	if (message) {
		message += "</ul>";
		frappe.throw({
			message: __(message),
			title: __("Missing Values Required"),
			indicator: "orange",
		});
	}

	data.label = data.label ? data.label : data.chart_name;
	return data;
}

} above code is widget_dialog.js file code i want class CardDialog extends WidgetDialog this class i want to extends in carddialog need to add 2 new field so, i create new js file in asset/js/custom_card_dialog.js and in hooks add app_include_js = [“/assets/theme/js/custom_card_dialog.js”] custom_card_dialog i want extends or override CardDialog class need help Thank you

Please check the reference:

1: How to override standard js class - #6 by NCP
2: How to override standard js class - #7 by Rehan_Ansari