From 32e953a6753eb1b8f07cbe432800ce11d5c2e2b0 Mon Sep 17 00:00:00 2001
From: xiamidaxia <xiamidaxia@icloud.com>
Date: Fri, 23 May 2025 11:21:31 +0800
Subject: [PATCH] feat(demo): remove formInputs readonly (#259)

---
 .../src/form-components/form-inputs/index.tsx                 | 4 ++--
 apps/demo-fixed-layout/src/nodes/loop/loop-form-render.tsx    | 4 ++--
 .../src/form-components/form-inputs/index.tsx                 | 4 ++--
 .../src/nodes/condition/condition-inputs/index.tsx            | 4 ++--
 apps/demo-free-layout/src/nodes/loop/loop-form-render.tsx     | 4 ++--
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/apps/demo-fixed-layout/src/form-components/form-inputs/index.tsx b/apps/demo-fixed-layout/src/form-components/form-inputs/index.tsx
index 70953c0e..f5727496 100644
--- a/apps/demo-fixed-layout/src/form-components/form-inputs/index.tsx
+++ b/apps/demo-fixed-layout/src/form-components/form-inputs/index.tsx
@@ -4,10 +4,10 @@ import { Field } from '@flowgram.ai/fixed-layout-editor';
 import { FormItem } from '../form-item';
 import { Feedback } from '../feedback';
 import { JsonSchema } from '../../typings';
-import { useIsSidebar } from '../../hooks';
+import { useNodeRenderContext } from '../../hooks';
 
 export function FormInputs() {
-  const readonly = !useIsSidebar();
+  const { readonly } = useNodeRenderContext();
   return (
     <Field<JsonSchema> name="inputs">
       {({ field: inputsField }) => {
diff --git a/apps/demo-fixed-layout/src/nodes/loop/loop-form-render.tsx b/apps/demo-fixed-layout/src/nodes/loop/loop-form-render.tsx
index bc6f000b..b3be3e31 100644
--- a/apps/demo-fixed-layout/src/nodes/loop/loop-form-render.tsx
+++ b/apps/demo-fixed-layout/src/nodes/loop/loop-form-render.tsx
@@ -1,7 +1,7 @@
 import { BatchVariableSelector, IFlowRefValue } from '@flowgram.ai/form-materials';
 import { FormRenderProps, FlowNodeJSON, Field } from '@flowgram.ai/fixed-layout-editor';
 
-import { useIsSidebar } from '../../hooks';
+import { useIsSidebar, useNodeRenderContext } from '../../hooks';
 import { FormHeader, FormContent, FormOutputs, FormItem, Feedback } from '../../form-components';
 
 interface LoopNodeJSON extends FlowNodeJSON {
@@ -12,7 +12,7 @@ interface LoopNodeJSON extends FlowNodeJSON {
 
 export const LoopFormRender = ({ form }: FormRenderProps<LoopNodeJSON>) => {
   const isSidebar = useIsSidebar();
-  const readonly = !isSidebar;
+  const { readonly } = useNodeRenderContext();
 
   const batchFor = (
     <Field<IFlowRefValue> name={`batchFor`}>
diff --git a/apps/demo-free-layout/src/form-components/form-inputs/index.tsx b/apps/demo-free-layout/src/form-components/form-inputs/index.tsx
index 6efbe4f5..52d2f8f0 100644
--- a/apps/demo-free-layout/src/form-components/form-inputs/index.tsx
+++ b/apps/demo-free-layout/src/form-components/form-inputs/index.tsx
@@ -4,10 +4,10 @@ import { DynamicValueInput } from '@flowgram.ai/form-materials';
 import { FormItem } from '../form-item';
 import { Feedback } from '../feedback';
 import { JsonSchema } from '../../typings';
-import { useIsSidebar } from '../../hooks';
+import { useNodeRenderContext } from '../../hooks';
 
 export function FormInputs() {
-  const readonly = !useIsSidebar();
+  const { readonly } = useNodeRenderContext();
   return (
     <Field<JsonSchema> name="inputs">
       {({ field: inputsField }) => {
diff --git a/apps/demo-free-layout/src/nodes/condition/condition-inputs/index.tsx b/apps/demo-free-layout/src/nodes/condition/condition-inputs/index.tsx
index c0dc535a..caa21776 100644
--- a/apps/demo-free-layout/src/nodes/condition/condition-inputs/index.tsx
+++ b/apps/demo-free-layout/src/nodes/condition/condition-inputs/index.tsx
@@ -4,7 +4,7 @@ import { IFlowValue, VariableSelector } from '@flowgram.ai/form-materials';
 import { Button } from '@douyinfe/semi-ui';
 import { IconPlus, IconCrossCircleStroked } from '@douyinfe/semi-icons';
 
-import { useIsSidebar } from '../../../hooks';
+import { useNodeRenderContext } from '../../../hooks';
 import { FormItem } from '../../../form-components';
 import { Feedback } from '../../../form-components';
 import { ConditionPort } from './styles';
@@ -15,7 +15,7 @@ interface ConditionValue {
 }
 
 export function ConditionInputs() {
-  const readonly = !useIsSidebar();
+  const { readonly } = useNodeRenderContext();
   return (
     <FieldArray name="conditions">
       {({ field }) => (
diff --git a/apps/demo-free-layout/src/nodes/loop/loop-form-render.tsx b/apps/demo-free-layout/src/nodes/loop/loop-form-render.tsx
index 8ccb93ac..cdc07208 100644
--- a/apps/demo-free-layout/src/nodes/loop/loop-form-render.tsx
+++ b/apps/demo-free-layout/src/nodes/loop/loop-form-render.tsx
@@ -2,7 +2,7 @@ import { FormRenderProps, FlowNodeJSON, Field } from '@flowgram.ai/free-layout-e
 import { SubCanvasRender } from '@flowgram.ai/free-container-plugin';
 import { BatchVariableSelector, IFlowRefValue } from '@flowgram.ai/form-materials';
 
-import { useIsSidebar } from '../../hooks';
+import { useIsSidebar, useNodeRenderContext } from '../../hooks';
 import { FormHeader, FormContent, FormOutputs, FormItem, Feedback } from '../../form-components';
 
 interface LoopNodeJSON extends FlowNodeJSON {
@@ -13,7 +13,7 @@ interface LoopNodeJSON extends FlowNodeJSON {
 
 export const LoopFormRender = ({ form }: FormRenderProps<LoopNodeJSON>) => {
   const isSidebar = useIsSidebar();
-  const readonly = !isSidebar;
+  const { readonly } = useNodeRenderContext();
 
   const batchFor = (
     <Field<IFlowRefValue> name={`batchFor`}>