diff --git a/frameworks/bridge/declarative_frontend/engine/jsEnumStyle.js b/frameworks/bridge/declarative_frontend/engine/jsEnumStyle.js
index 668f563c1006635d3cba4e01a065d7b906272522..f575a0a0e1c5ede15de2a46abac67648e74656e1 100644
--- a/frameworks/bridge/declarative_frontend/engine/jsEnumStyle.js
+++ b/frameworks/bridge/declarative_frontend/engine/jsEnumStyle.js
@@ -3775,12 +3775,27 @@ let DividerMode;
 function wrapBuilder(builder) {
   return new WrappedBuilder(builder);
 }
+
 class WrappedBuilder {
   constructor(builder) {
     this.builder = builder;
   }
 }
 
+function mutableBuilder(builder) {
+  return new MutableBuilder(builder);
+}
+
+class MutableBuilder {
+  constructor(builder) {
+    this.builder = builder;
+  }
+  // Only for internal toolchain usage.
+  _dispatchBuilder(builder, ...args) {
+    this.mutableBuilderImpl.bind(this)(builder, ...args);
+  }
+}
+
 let TextSpanType;
 (function (TextSpanType) {
   TextSpanType[TextSpanType.TEXT = 0] = 'TEXT';
diff --git a/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/partial_update/pu_view.ts b/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/partial_update/pu_view.ts
index 1fad89bfc757676afb6208b956a5c9ce15b23b7c..d0a4749b484289360c19fcf089300856faee7fc8 100644
--- a/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/partial_update/pu_view.ts
+++ b/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/partial_update/pu_view.ts
@@ -1243,5 +1243,26 @@ abstract class ViewPU extends PUV2ViewBase
       stateMgmtConsole.applicationError(error);
       throw new Error(error);
   }
+
+  protected mutableBuilderImpl<Args extends Object[]>(
+    builder: () => MutableBuilder<Args>, ...args: Args): void {
+    this.observeComponentCreation2((elmtId, isInitialRender) => {
+        If.create();
+        const _wb = builder();
+        // WeakMap that stores Builder and has builderID number for it.
+        let builderId = this.builderIdMap_.get(_wb);
+
+        if (builderId === undefined) {
+            builderId = this.nextBuilderId_++;
+            this.builderIdMap_.set(_wb, builderId);
+        }
+        // Create branch for each Builder to ensure UI updating.
+        this.ifElseBranchUpdateFunction(
+            builderId,
+            () => _wb.builder.bind(this)(...args)
+        );
+        If.pop();
+    }, If);
+  }
 } // class ViewPU
 
diff --git a/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/puv2_common/puv2_view_base.ts b/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/puv2_common/puv2_view_base.ts
index b39ddf54fb6212211a22eb3c04bc09182c63c798..93a8eab58b2921979c913f7f6ddb1e117cbe08e2 100644
--- a/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/puv2_common/puv2_view_base.ts
+++ b/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/puv2_common/puv2_view_base.ts
@@ -38,6 +38,11 @@ enum PrebuildPhase {
 //API Version 18
 const API_VERSION_ISOLATION_FOR_5_1: number = 18;
 
+// Declare MutableBuilder class to make it available for type-checking. See jsEnumStyle.js and
+// build-tools\ets-loader\declarations\common.d.ts
+declare class MutableBuilder<Args extends Object[]> {
+  builder(): (...args: Args) => void;
+}
 // NativeView
 // implemented in C++  for release
 abstract class PUV2ViewBase extends ViewBuildNodeBase {
@@ -56,6 +61,11 @@ abstract class PUV2ViewBase extends ViewBuildNodeBase {
     return (a < b) ? -1 : (a > b) ? 1 : 0;
   };
 
+  // A map to associate builder objects with unique numeric IDs, used in ConditionalBuilder.
+  protected builderIdMap_: WeakMap<Object, number> = new WeakMap();
+  // The next available builder ID to be assigned, starting from 1000000 to avoid conflict.
+  protected nextBuilderId_: number = 1000000;
+
   // indicates the currently rendered or rendered UINode's elmtIds
   // or UINodeRegisterProxy.notRecordingDependencies if none is currently rendering
   // isRenderInProgress == true always when currentlyRenderedElmtIdStack_ length >= 0
diff --git a/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/v2/v2_view.ts b/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/v2/v2_view.ts
index 4437048c2bfed2c59de0f1ed18e2b5b6a682976e..98b91c5ab40cd71440f331e5ccedf05f3745e066 100644
--- a/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/v2/v2_view.ts
+++ b/frameworks/bridge/declarative_frontend/state_mgmt/src/lib/v2/v2_view.ts
@@ -898,4 +898,25 @@ abstract class ViewV2 extends PUV2ViewBase implements IView {
         // transpiler will try to give a warning to hint that it will downgrade to normal V1
         stateMgmtConsole.error(`${this.debugInfo__()}: Recycle not supported for ComponentV2 instance`);
     }
-}
+
+    protected mutableBuilderImpl<Args extends Object[]>(
+        builder: () => MutableBuilder<Args>, ...args: Args): void {
+        this.observeComponentCreation2((elmtId, isInitialRender) => {
+            If.create();
+            const _wb = builder();
+            // WeakMap that stores Builder and has builderID number for it.
+            let builderId = this.builderIdMap_.get(_wb);
+
+            if (builderId === undefined) {
+                builderId = this.nextBuilderId_++;
+                this.builderIdMap_.set(_wb, builderId);
+            }
+            // Create branch for each Builder to ensure UI updating.
+            this.ifElseBranchUpdateFunction(
+                builderId,
+                () => _wb.builder.bind(this)(...args)
+            );
+            If.pop();
+        }, If);
+    }
+}
\ No newline at end of file