From 03aa784851821c1d913a98a77f6ba98d6c4f9f67 Mon Sep 17 00:00:00 2001
From: Konstantin Gogov <konstantin.gogov@sap.com>
Date: Wed, 6 Nov 2024 15:52:57 +0200
Subject: [PATCH] fix(ui5-select): add support for Vue.js v-model

Enhances the `ui5-select` component to support Vue.js v-model directive
by emitting an `input` event when the value changes.

Fixes: #9971
---
 packages/main/src/Select.ts | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/packages/main/src/Select.ts b/packages/main/src/Select.ts
index dde52d32285b..47f64d9942bc 100644
--- a/packages/main/src/Select.ts
+++ b/packages/main/src/Select.ts
@@ -199,6 +199,15 @@ type SelectLiveChangeEventDetail = {
 @event("selected-item-changed", {
 	bubbles: true,
 })
+
+/**
+ * Fired to make Vue.js two way data binding work properly.
+ * @private
+ */
+@event("input", {
+	bubbles: true,
+})
+
 class Select extends UI5Element implements IFormInputElement {
 	@i18n("@ui5/webcomponents")
 	static i18nBundle: I18nBundle;
@@ -749,6 +758,9 @@ class Select extends UI5Element implements IFormInputElement {
 		//  Angular two way data binding
 		this.fireDecoratorEvent("selected-item-changed");
 
+		// Fire input event for Vue.js two-way binding
+		this.fireDecoratorEvent("input");
+
 		if (changePrevented) {
 			this._select(this._selectedIndexBeforeOpen);
 		}