fix

comps/form/field/raw/Dropdown.tsx

@@ -12,7 +12,8 @@ export const RawDropdown: FC<{
   onFocus?: () => void;
   onBlur?: () => void;
   onChange?: (value: string) => void;
-}> = ({ value, options, className, onFocus, onBlur, onChange }) => {
+  disabled?: boolean;
+}> = ({ value, options, className, onFocus, onBlur, onChange, disabled }) => {
   const local = useLocal({
     open: false,
     input: {
@@ -36,7 +37,7 @@ export const RawDropdown: FC<{
 
   return (
     <Popover
-      open={local.open}
+      open={disabled ? false : local.open}
       onOpenChange={() => {
         local.open = false;
         local.render();
@@ -113,7 +114,9 @@ export const RawDropdown: FC<{
             value={local.open ? local.input.value : "Halo"}
             className={cx(
               "c-absolute c-inset-0 c-w-full c-h-full c-outline-none c-p-0",
-              local.open
+              disabled
+                ? "c-invisible"
+                : local.open
                   ? "c-cursor-pointer"
                   : "c-pointer-events-none c-invisible"
             )}
@@ -139,7 +142,8 @@ export const RawDropdown: FC<{
         <div
           className={cx(
             "c-absolute c-pointer-events-none c-z-10 c-inset-0 c-left-auto c-flex c-items-center ",
-            "c-bg-white c-justify-center c-w-6 c-mr-1 c-my-2"
+            "c-bg-white c-justify-center c-w-6 c-mr-1 c-my-2",
+            disabled && "c-hidden"
           )}
         >
           <ChevronDown size={14} />

comps/form/field/type/TypeRelation.tsx

@@ -1,27 +1,44 @@
 import { useLocal } from "@/utils/use-local";
-import { FC } from "react";
+import { FC, useEffect } from "react";
 import { FMLocal, FieldLocal } from "../../typings";
 import { RawDropdown } from "../raw/Dropdown";
+import { Loader2 } from "lucide-react";
 
 export type PropTypeRelation = {
   type: "has-one" | "has-many";
+  on_load: () => Promise<any[]>;
 };
 export const FieldTypeRelation: FC<{
   field: FieldLocal;
   fm: FMLocal;
   prop: PropTypeRelation;
 }> = ({ field, fm, prop }) => {
-  const input = useLocal({});
+  const input = useLocal({
+    list: null as null | any[],
+  });
   const value = fm.data[field.name];
   field.input = input;
   field.prop = prop;
 
+  useEffect(() => {
+    if (input.list === null) {
+      field.status = "loading";
+      field.render();
+    }
+  }, []);
+
   return (
     <>
+      {field.status === "loading" ? (
+        <div className="c-w-full c-h-full c-items-center c-flex c-px-2">
+          <Loader2 className="c-h-4 c-w-4 c-animate-spin" />
+        </div>
+      ) : (
         <RawDropdown
           options={[{ label: "Halo", value: "halo" }]}
           value={"halo"}
           className="c-flex-1 c-bg-transparent c-outline-none c-px-2 c-text-sm c-w-full c-h-full"
+          disabled={field.disabled}
           onFocus={() => {
             field.focused = true;
             field.render();
@@ -31,6 +48,7 @@ export const FieldTypeRelation: FC<{
             field.render();
           }}
         />
+      )}
     </>
   );
 };

comps/form/typings.ts

@@ -156,5 +156,10 @@ export const formType = (active: { item_id: string }, meta: any) => {
       };
     };
     props: any;
+  size: {
+      width: number;
+      height: number;
+      field: "full" | "half";
+    };
   }`;
 };

gen/gen_table_list/gen_table_list.tsx

@@ -51,15 +51,15 @@ export const gen_table_list = async (
     if (data["child"]) {
       result["child"] = data["child"];
 
-      result["child"].content.childs = result["child"].content.childs.filter(
-        (e: any) => {
-          return e.name !== arg.mode;
-        }
-      );
-
       let sub_name = "fields";
       if (arg.mode === "table") sub_name = "columns";
 
+      result["child"].content.childs = result["child"].content.childs.filter(
+        (e: any) => {
+          return e.name !== sub_name;
+        }
+      );
+
       const child = createItem({
         name: sub_name,
         childs: fields
@@ -71,7 +71,9 @@ export const gen_table_list = async (
                 props: {
                   name: e.name,
                   title: formatName(e.name),
-                  child: {
+                  child: createItem({
+                    childs: [
+                      createItem({
                         name: "cell",
                         padding: {
                           l: 8,
@@ -88,7 +90,9 @@ export const gen_table_list = async (
 render(React.createElement("div", Object.assign({}, props, { className: cx(props.className, "") }),React.createElement(FormatValue, { value: col.value, name: col.name, gen_fields: gen_fields })));
                   `,
                         },
-                  },
+                      }),
+                    ],
+                  }),
                 },
               },
             };

gen/utils.ts

@@ -128,9 +128,7 @@ export const createItem = (arg: SimplifiedItem): any => {
     name: arg.name || "item",
     type: "item",
     component,
-    script: {
-      ...arg.adv,
-    },
+    adv: arg.adv,
     childs: arg.childs?.map(createItem),
   };
 };