From bfda7848044e5232d47dabf45cbf1084768a48c6 Mon Sep 17 00:00:00 2001
From: shanroislamdev <shantoislamdev@gmail.com>
Date: Thu, 29 Jan 2026 12:24:58 +0600
Subject: [PATCH] fix(lit): correct html attribute binding and state reflection
 in MultipleChoice

---
 renderers/lit/src/0.8/ui/multiple-choice.ts | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/renderers/lit/src/0.8/ui/multiple-choice.ts b/renderers/lit/src/0.8/ui/multiple-choice.ts
index d2d62ab1b..53a408b09 100644
--- a/renderers/lit/src/0.8/ui/multiple-choice.ts
+++ b/renderers/lit/src/0.8/ui/multiple-choice.ts
@@ -104,6 +104,15 @@ export class MultipleChoice extends Root {
   }
 
   render() {
+    const selectedValue = Array.isArray(this.selections)
+      ? this.selections[0] || ""
+      : extractStringValue(
+          this.selections,
+          this.component,
+          this.processor,
+          this.surfaceId
+        ) || "";
+
     return html`<section class=${classMap(
       this.theme.components.MultipleChoice.container
     )}>
@@ -114,6 +123,7 @@ export class MultipleChoice extends Root {
         name="data"
         id="data"
         class=${classMap(this.theme.components.MultipleChoice.element)}
+        .value=${selectedValue}
         style=${
           this.theme.additionalStyles?.MultipleChoice
             ? styleMap(this.theme.additionalStyles?.MultipleChoice)
@@ -134,7 +144,7 @@ export class MultipleChoice extends Root {
             this.processor,
             this.surfaceId
           );
-          return html`<option ${option.value}>${label}</option>`;
+          return html`<option value=${option.value}>${label}</option>`;
         })}
       </select>
     </section>`;