diff --git a/workspaces/ballerina/ballerina-extension/CHANGELOG.md b/workspaces/ballerina/ballerina-extension/CHANGELOG.md
index b44fc57fe74..4f36f470ed0 100644
--- a/workspaces/ballerina/ballerina-extension/CHANGELOG.md
+++ b/workspaces/ballerina/ballerina-extension/CHANGELOG.md
@@ -3,13 +3,14 @@
 All notable changes to the "Ballerina" extension will be documented in this file.
 
 
-## Version 5.3.1 (2025-08-07)
+## **5.3.1** (2025-08-13)
 
 ### Fixed
 
 -   Resolved issues affecting Inline Data Mapper functionality and flow diagram rendering
 
-## Version 5.3.0 (2025-07-29)
+
+## **5.3.0** (2025-07-29)
 
 ### Major Updates
 
diff --git a/workspaces/ballerina/ballerina-extension/package.json b/workspaces/ballerina/ballerina-extension/package.json
index 00edb5b611b..81ffc3eb098 100644
--- a/workspaces/ballerina/ballerina-extension/package.json
+++ b/workspaces/ballerina/ballerina-extension/package.json
@@ -2,7 +2,7 @@
     "name": "ballerina",
     "displayName": "Ballerina",
     "description": "Ballerina Language support, debugging, graphical visualization, AI-based data-mapping and many more.",
-    "version": "5.3.0",
+    "version": "5.3.1",
     "publisher": "wso2",
     "icon": "resources/images/ballerina.png",
     "homepage": "https://wso2.com/ballerina/vscode/docs",
diff --git a/workspaces/ballerina/ballerina-visualizer/src/utils/bi.tsx b/workspaces/ballerina/ballerina-visualizer/src/utils/bi.tsx
index 545f3bdc6b3..5f2ba54a7c7 100644
--- a/workspaces/ballerina/ballerina-visualizer/src/utils/bi.tsx
+++ b/workspaces/ballerina/ballerina-visualizer/src/utils/bi.tsx
@@ -419,25 +419,26 @@ export function removeDraftNodeFromDiagram(flowModel: Flow) {
     return newFlow;
 }
 
-export function enrichFormPropertiesWithValueConstraint(
+export function enrichFormTemplatePropertiesWithValues(
     formProperties: NodeProperties,
     formTemplateProperties: NodeProperties
 ) {
-    const enrichedFormProperties = cloneDeep(formProperties);
+    const enrichedFormTemplateProperties = cloneDeep(formTemplateProperties);
 
-    for (const key in formTemplateProperties) {
-        if (formTemplateProperties.hasOwnProperty(key)) {
-            const expression = formTemplateProperties[key as NodePropertyKey];
-            if (expression) {
-                const valConstraint = formTemplateProperties[key as NodePropertyKey]?.valueTypeConstraint;
-                if (valConstraint && enrichedFormProperties[key as NodePropertyKey]) {
-                    enrichedFormProperties[key as NodePropertyKey].valueTypeConstraint = valConstraint;
-                }
+    for (const key in formProperties) {
+        if (formProperties.hasOwnProperty(key)) {
+            const formProperty = formProperties[key as NodePropertyKey];
+            if (
+                formProperty &&
+                enrichedFormTemplateProperties[key as NodePropertyKey] != null
+            ) {
+                // Copy the value from formProperties to formTemplateProperties
+                enrichedFormTemplateProperties[key as NodePropertyKey].value = formProperty.value;
             }
         }
     }
 
-    return enrichedFormProperties;
+    return enrichedFormTemplateProperties;
 }
 
 function getEnrichedValue(kind: CompletionItemKind, value: string): CompletionInsertText {
diff --git a/workspaces/ballerina/ballerina-visualizer/src/views/BI/Forms/FormGenerator/index.tsx b/workspaces/ballerina/ballerina-visualizer/src/views/BI/Forms/FormGenerator/index.tsx
index 0f3838952de..6af595ddbaa 100644
--- a/workspaces/ballerina/ballerina-visualizer/src/views/BI/Forms/FormGenerator/index.tsx
+++ b/workspaces/ballerina/ballerina-visualizer/src/views/BI/Forms/FormGenerator/index.tsx
@@ -62,7 +62,7 @@ import {
     convertNodePropertiesToFormFields,
     convertToFnSignature,
     convertToVisibleTypes,
-    enrichFormPropertiesWithValueConstraint,
+    enrichFormTemplatePropertiesWithValues,
     filterUnsupportedDiagnostics,
     getFormProperties,
     getImportsForFormFields,
@@ -243,7 +243,7 @@ export const FormGenerator = forwardRef<FormExpressionEditorRef, FormProps>(func
         let enrichedNodeProperties;
         if (nodeFormTemplate) {
             const formTemplateProperties = getFormProperties(nodeFormTemplate);
-            enrichedNodeProperties = enrichFormPropertiesWithValueConstraint(formProperties, formTemplateProperties);
+            enrichedNodeProperties = enrichFormTemplatePropertiesWithValues(formProperties, formTemplateProperties);
             console.log(">>> Form properties", { formProperties, formTemplateProperties, enrichedNodeProperties });
         }
         if (Object.keys(formProperties).length === 0) {
diff --git a/workspaces/ballerina/data-mapper-view/src/components/DataMapper/ConfigPanel/utils.ts b/workspaces/ballerina/data-mapper-view/src/components/DataMapper/ConfigPanel/utils.ts
index 9aa941ee23a..f235b820193 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/DataMapper/ConfigPanel/utils.ts
+++ b/workspaces/ballerina/data-mapper-view/src/components/DataMapper/ConfigPanel/utils.ts
@@ -105,7 +105,7 @@ function isSupportedType(node: STNode,
         return [false, TypeNature.TYPE_UNAVAILABLE];
     } else if ((isUnionType || isOptionalType) && kind === 'output' && getUnsupportedTypesFromTypeDesc(node).length === 0) {
         return [true];
-    } else if (isUnionType || isMapType || isOptionalType) {
+    } else if (isMapType) {
         return [false, TypeNature.YET_TO_SUPPORT];
     } else if (isArrayType || isParenthesisedType) {
         return [getUnsupportedTypesFromTypeDesc(node).length === 0, TypeNature.BLACKLISTED]
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/FromClause/FromClauseNode.ts b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/FromClause/FromClauseNode.ts
index 5fdbfaa73aa..560d6e2f8f9 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/FromClause/FromClauseNode.ts
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/FromClause/FromClauseNode.ts
@@ -35,7 +35,8 @@ import {
     getFromClauseNodeLabel,
     getOptionalArrayField,
     getSearchFilteredInput,
-    getTypeFromStore
+    getTypeFromStore,
+    isOptionalAndNillableField
 } from "../../utils/dm-utils";
 import { DataMapperNodeModel } from "../commons/DataMapperNode";
 import { QueryExprMappingType } from "../QueryExpression";
@@ -128,6 +129,12 @@ export class FromClauseNode extends DataMapperNodeModel {
                             parentPort.collapsed
                         );
                     });
+                } else {
+                    const isOptional = isOptionalAndNillableField(this.typeDef);
+                    this.numberOfFields += this.addPortsForInputRecordField(
+                        this.typeDef, "OUT", this.nodeLabel, this.nodeLabel,
+                        EXPANDED_QUERY_SOURCE_PORT_PREFIX, parentPort, this.context.collapsedFields, parentPort.collapsed, isOptional
+                    );
                 }
             }
         }
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/LinkConnector/LinkConnectorNode.ts b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/LinkConnector/LinkConnectorNode.ts
index 0a5ed2dde43..c1624bfe39f 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/LinkConnector/LinkConnectorNode.ts
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/LinkConnector/LinkConnectorNode.ts
@@ -114,11 +114,13 @@ export class LinkConnectorNode extends DataMapperNodeModel {
             const inputNode = getInputNodeExpr(field, this);
             if (inputNode) {
                 const inputPort = getInputPortsForExpr(inputNode, field);
-                if (!this.sourcePorts.some(port => port.getID() === inputPort.getID())) {
-                    this.sourcePorts.push(inputPort);
-                    this.sourceValues[inputPort.getID()] = [field];
-                } else {
-                    this.sourceValues[inputPort.getID()].push(field);
+                if (inputPort) {
+                    if (!this.sourcePorts.some(port => port.getID() === inputPort.getID())) {
+                        this.sourcePorts.push(inputPort);
+                        this.sourceValues[inputPort.getID()] = [field];
+                    } else {
+                        this.sourceValues[inputPort.getID()].push(field);
+                    }
                 }
             }
         })
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNode.ts b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNode.ts
index dce85fc9112..5aa583f01c2 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNode.ts
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNode.ts
@@ -69,7 +69,7 @@ export class RequiredParamNode extends DataMapperNodeModel {
                 });
             } else {
                 const isOptional = isOptionalAndNillableField(this.typeDef);
-                this.addPortsForInputRecordField(
+                this.numberOfFields += this.addPortsForInputRecordField(
                     this.typeDef, "OUT", this.value.paramName.value, this.value.paramName.value,
                     '', parentPort, this.context.collapsedFields, parentPort.collapsed, isOptional
                 );
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNodeFactory.tsx b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNodeFactory.tsx
index 471fd31af0e..dbf2c70539d 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNodeFactory.tsx
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/RequiredParam/RequiredParamNodeFactory.tsx
@@ -27,7 +27,10 @@ export class RequiredParamNodeFactory extends AbstractReactFactory<RequiredParam
             return (
                 <InputSearchNoResultFound kind={SearchNoResultFoundKind.InputField} />
             );
-        } else if (event.model.typeDef && event.model.typeDef.typeName === PrimitiveBalType.Record) {
+        } else if (event.model.typeDef &&
+            (event.model.typeDef.typeName === PrimitiveBalType.Record ||
+                event.model.typeDef.typeName === PrimitiveBalType.Union)
+        ) {
             return (
                 <RecordTypeTreeWidget
                     engine={this.engine}
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/DataMapperNode.ts b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/DataMapperNode.ts
index bf9e410aa57..8e9d809ac9d 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/DataMapperNode.ts
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/DataMapperNode.ts
@@ -130,11 +130,9 @@ export abstract class DataMapperNodeModel extends NodeModel<NodeModelGenerics &
 		const fieldFQN = parentId
 			? `${parentId}${fieldName && isOptional
 				? `?.${fieldName}`
-				: `.${fieldName}`}`
+				: fieldName ? `.${fieldName}` : ''}`
 			: fieldName && fieldName;
-		const unsafeFieldFQN = unsafeParentId
-			? `${unsafeParentId}.${fieldName}`
-			: fieldName || '';
+		const unsafeFieldFQN = fieldFQN.replaceAll('?.', '.');
 
 		if (fieldName.startsWith("$missingNode$")) {
 			return;
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/RecordTypeTreeWidget/RecordTypeTreeWidget.tsx b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/RecordTypeTreeWidget/RecordTypeTreeWidget.tsx
index 923fe806380..4c448bbb92a 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/RecordTypeTreeWidget/RecordTypeTreeWidget.tsx
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/Node/commons/RecordTypeTreeWidget/RecordTypeTreeWidget.tsx
@@ -20,11 +20,11 @@ import React, { useState } from "react";
 
 import { Button, Codicon, TruncatedLabel } from "@wso2/ui-toolkit";
 import { DiagramEngine, PortWidget } from '@projectstorm/react-diagrams';
-import { TypeField } from "@wso2/ballerina-core";
+import { PrimitiveBalType, TypeField } from "@wso2/ballerina-core";
 
 import { DataMapperPortWidget, PortState, RecordFieldPortModel } from '../../../Port';
 import { EXPANDED_QUERY_INPUT_NODE_PREFIX } from '../../../utils/constants';
-import { getTypeName } from "../../../utils/dm-utils";
+import { getOptionalRecordField, getTypeName } from "../../../utils/dm-utils";
 import { InputSearchHighlight } from '../Search';
 import { TreeBody, TreeContainer, TreeHeader } from '../Tree/Tree';
 
@@ -56,10 +56,21 @@ export function RecordTypeTreeWidget(props: RecordTypeTreeWidgetProps) {
     const isPortDisabled = hasLinkViaCollectClause && Object.keys(portOut.getLinks()).length === 0;
     portOut.isDisabledDueToCollectClause = isPortDisabled;
 
-    const hasFields = !!typeDesc?.fields?.length;
+    let fields: TypeField[] = [];
+    let optional = false;
+
+    const optionalRecordField = getOptionalRecordField(typeDesc);
+    if (optionalRecordField) {
+        optional = true
+        fields = optionalRecordField.fields;
+    } else if (typeDesc.typeName === PrimitiveBalType.Record) {
+        fields = typeDesc.fields;
+    }
+
+    const hasFields = fields?.length > 0;
 
     let expanded = true;
-    if (portOut && portOut.collapsed) {
+    if (portOut && (portOut.collapsed || portOut.hidden)) {
         expanded = false;
     }
 
@@ -143,7 +154,7 @@ export function RecordTypeTreeWidget(props: RecordTypeTreeWidgetProps) {
             {expanded && hasFields && (
                 <TreeBody>
                     {
-                        typeDesc.fields.map((field, index) => {
+                        fields.map((field, index) => {
                             return (
                                 <RecordFieldTreeItemWidget
                                     key={index}
diff --git a/workspaces/ballerina/data-mapper-view/src/components/Diagram/utils/dm-utils.ts b/workspaces/ballerina/data-mapper-view/src/components/Diagram/utils/dm-utils.ts
index 0bb4d4a3859..1c6d2f6ed5f 100644
--- a/workspaces/ballerina/data-mapper-view/src/components/Diagram/utils/dm-utils.ts
+++ b/workspaces/ballerina/data-mapper-view/src/components/Diagram/utils/dm-utils.ts
@@ -891,7 +891,9 @@ export function getInputPortsForExpr(node: InputNode, expr: STNode ): RecordFiel
 		portIdBuffer = EXPANDED_QUERY_SOURCE_PORT_PREFIX + "." + (node as FromClauseNode).nodeLabel;
 	}
 
-	if (typeDesc && typeDesc.typeName === PrimitiveBalType.Record) {
+	if (typeDesc && (typeDesc.typeName === PrimitiveBalType.Record ||
+		typeDesc.typeName === PrimitiveBalType.Union)
+	) {
 		if (STKindChecker.isFieldAccess(expr) || STKindChecker.isOptionalFieldAccess(expr)) {
 			const fieldNames = getFieldNames(expr);
 			let nextTypeNode: TypeField = typeDesc;
diff --git a/workspaces/bi/bi-extension/CHANGELOG.md b/workspaces/bi/bi-extension/CHANGELOG.md
index e791d1b3f77..a65e0f449e4 100644
--- a/workspaces/bi/bi-extension/CHANGELOG.md
+++ b/workspaces/bi/bi-extension/CHANGELOG.md
@@ -1,12 +1,13 @@
 # Change log
 
-## Version 1.2.1 (2025-08-07)
+## **1.2.1** (2025-08-13)
 
 ### Fixed
 
 -   Resolved issues affecting Inline Data Mapper functionality and flow diagram rendering
 
-## Version 1.2.0 (2025-07-29)
+
+## **1.2.0** (2025-07-29)
 
 ### Major Updates
 
@@ -36,6 +37,7 @@
 -   **Configuration:** Fixed issues with Config.toml management and fast-run command failures.
 -   **IDE Stability:** Addressed UI freezing, improved state management, and enhanced project handling in multi-root workspaces.
 
+
 ## **1.1.0** (2025-07-14)
 
 ### Major Features
diff --git a/workspaces/bi/bi-extension/package.json b/workspaces/bi/bi-extension/package.json
index 2bc7c6a6888..097604bf7ab 100644
--- a/workspaces/bi/bi-extension/package.json
+++ b/workspaces/bi/bi-extension/package.json
@@ -2,7 +2,7 @@
     "name": "ballerina-integrator",
     "displayName": "WSO2 Integrator: BI",
     "description": "An extension which gives a development environment for designing, developing, debugging, and testing integration solutions.",
-    "version": "1.2.0",
+    "version": "1.2.1",
     "publisher": "wso2",
     "icon": "resources/images/wso2-ballerina-integrator-logo.png",
     "repository": {