fix

comps/form/field/raw/Dropdown.tsx

@@ -101,6 +101,7 @@ export const RawDropdown: FC<{
           local.render();
           setTimeout(() => {
             local.input.el?.focus();
+            local.input.el?.select();
           });
         }}
         ref={(el) => {

comps/form/field/type/TypeRelation.tsx

@@ -7,6 +7,7 @@ import { FieldLoading } from "../raw/FieldLoading";
 export type PropTypeRelation = {
   type: "has-one" | "has-many";
   on_load: (opt: { value?: any }) => Promise<{ items: any[]; pk: string }>;
+  label: (item: any, pk: string) => string;
 };
 export const FieldTypeRelation: FC<{
   field: FieldLocal;
@@ -44,15 +45,22 @@ export const FieldTypeRelation: FC<{
   if (input.list && input.pk && input.list.length) {
     for (const item of input.list) {
       if (typeof item !== "object") continue;
-      const label: string[] = [];
+      let label = "";
 
-      for (const [k, v] of Object.entries(item)) {
-        if (k !== input.pk) label.push(v as any);
+      if (typeof prop.label === "function") {
+        label = prop.label(item, input.pk);
+      } else {
+        const label_arr: string[] = [];
+
+        for (const [k, v] of Object.entries(item)) {
+          if (k !== input.pk) label_arr.push(v as any);
+        }
+        label = label_arr.join(" ");
       }
 
       list.push({
         value: item[input.pk],
-        label: label.join(" "),
+        label,
         el: <PassProp item={item}>{child}</PassProp>,
       });
     }

comps/md/MDAction.tsx

@@ -3,7 +3,11 @@ import { FC, Fragment, isValidElement } from "react";
 import { getProp } from "./utils/get-prop";
 import { MDActions, MDLocal } from "./utils/typings";
 
-export const MDAction: FC<{ md: MDLocal }> = ({ md }) => {
+export const MDAction: FC<{ md: MDLocal; PassProp: any; child: any }> = ({
+  md,
+  PassProp,
+  child,
+}) => {
   const local = useLocal({
     last_render: Date.now(),
   });
@@ -30,19 +34,7 @@ export const MDAction: FC<{ md: MDLocal }> = ({ md }) => {
           return <Fragment key={idx}>{e}</Fragment>;
         }
         if (typeof e === "object" && e.label) {
-          return (
-            <div
-              key={idx}
-              className={cx(
-                "btn action c-text-sm c-px-3 c-h-[25px] c-flex c-items-center c-cursor-pointer c-rounded-md c-bg-blue-700 c-text-white hover:c-bg-blue-500"
-              )}
-              onClick={(ev) => {
-                if (e.onClick && !isEditor) e.onClick(ev);
-              }}
-            >
-              {e.label}
-            </div>
-          );
+          return <PassProp item={e}>{child}</PassProp>;
         }
       })}
     </div>

gen/gen_form/new_field.ts

@@ -59,6 +59,7 @@ export const newField = async (arg: GFCol) => {
             return { items: [], pk: "" };
           }`,
           ],
+          label: [`() => {}`],
           gen_table: arg.relation.to.table,
           gen_fields: [value, value],
           child: {},

gen/gen_relation/gen_relation.ts

@@ -43,6 +43,24 @@ export const gen_relation = async (modify: (data: any) => void, data: any) => {
       code.on_load = result["on_load"].value;
     }
 
+    if (data["label"]) {
+      result["label"] = data["label"];
+      result["label"].value = `\
+(item:any, pk:string) => {
+  return \`${Object.entries(select)
+    .filter(([k, v]) => {
+      if (typeof v !== "object" && k !== pk?.name) {
+        return true;
+      }
+    })
+    .map(([name]) => {
+      return `\${item.${name}}`;
+    })
+    .join(" ")}\`
+}`;
+      code.on_load = result["on_load"].value;
+    }
+
     const res = await codeBuild(code);
     for (const [k, v] of Object.entries(res)) {
       result[k].valueBuilt = v[1];

gen/gen_relation/new_field.ts

@@ -46,7 +46,7 @@ export const newField = (arg: GFCol) => {
       l: 0,
       b: 0,
       t: 0,
-      r: 10,
+      r: 5,
     },
     layout: {
       dir: "row",