fix: display instance type spec

src/components/dynamic-form/components/form-widget.tsx

@@ -18,6 +18,7 @@ const FormWidget: React.FC<
   min,
   max,
   checked,
+  readOnly: disabled,
   onChange
 }) => {
   const Component = ComponentsMap[widget];
@@ -29,7 +30,15 @@ const FormWidget: React.FC<
 
   return Component ? (
     <Component
-      {...{ label, required, placeholder, description, min, max }}
+      {...{
+        label,
+        required,
+        placeholder,
+        description,
+        min,
+        max
+      }}
+      disabled={disabled}
       options={options || optionList}
       value={value}
       checked={checked}

src/components/dynamic-form/components/list-map.tsx

@@ -24,16 +24,23 @@ interface ListMapProps {
   label?: React.ReactNode;
   btnText?: string;
   properties: Record<string, any>;
+  disabled?: boolean;
   onChange?: (data: any) => void;
 }
 
 interface ListItemProps {
   schemaList: any[];
   data: Record<string, any>;
+  disabled?: boolean;
   onChange?: (data: any) => void;
 }
 
-const ListItem: React.FC<ListItemProps> = ({ schemaList, data, onChange }) => {
+const ListItem: React.FC<ListItemProps> = ({
+  schemaList,
+  data,
+  onChange,
+  disabled
+}) => {
   const handleValueChange = (name: string, target: any) => {
     if (target?.target?.type === 'checkbox') {
       const checked = target.target?.checked;
@@ -50,6 +57,7 @@ const ListItem: React.FC<ListItemProps> = ({ schemaList, data, onChange }) => {
         <FormWidget
           widget={schema.type}
           {...schema}
+          disabled={disabled}
           key={schema.name}
           value={data?.[schema.name]}
           checked={data?.[schema.name]}
@@ -66,6 +74,7 @@ const ListMap: React.FC<ListMapProps> = ({
   btnText,
   properties = {},
   minItems = 0,
+  disabled,
   onChange
 }) => {
   const [items, setItems] = React.useState(dataList || []);
@@ -110,28 +119,36 @@ const ListMap: React.FC<ListMapProps> = ({
   }, [dataList]);
 
   return (
-    <Wrapper label={label} btnText={btnText} onAdd={handleOnAdd}>
+    <Wrapper
+      label={label}
+      btnText={btnText}
+      onAdd={handleOnAdd}
+      disabled={disabled}
+    >
       {items.map((item, index) => (
         <RowWrapper key={index}>
           <WidgetBox>
             <ListItem
               schemaList={schemaList}
               data={item}
+              disabled={disabled}
               onChange={(value) => handleItemChange(index, value)}
             />
           </WidgetBox>
-          <Button
-            size="small"
-            type="default"
-            shape="circle"
-            style={{
-              width: 24,
-              marginLeft: 10,
-              flex: 'none'
-            }}
-            icon={<MinusOutlined />}
-            onClick={() => handleDelete(index)}
-          />
+          {!disabled && (
+            <Button
+              size="small"
+              type="default"
+              shape="circle"
+              style={{
+                width: 24,
+                marginLeft: 10,
+                flex: 'none'
+              }}
+              icon={<MinusOutlined />}
+              onClick={() => handleDelete(index)}
+            />
+          )}
         </RowWrapper>
       ))}
     </Wrapper>

src/components/dynamic-form/config/types.ts

@@ -23,6 +23,7 @@ export interface FormWidgetProps {
   title?: string;
   required?: boolean;
   placeholder?: string;
+  readOnly?: boolean;
   options?: { label: string; value: string | number }[];
   description?: string;
   enum?: (string | number)[];