shadcn-zod-formkit 1.9.0 → 1.9.2

package/dist/index.cjs

@@ -4519,44 +4519,56 @@ var SelectInput = class extends BaseInput {
 };
 var FieldSelect = ({ form, input, isSubmitting }) => {
   const mockInputOptions = [
-    { id: 1, name: "MOCK OPTION - PERMISO 1", checked: false },
-    { id: 2, name: "MOCK OPTION - PERMISO 2", checked: true },
-    { id: 3, name: "MOCK OPTION - PERMISO 3", checked: false },
-    { id: 4, name: "MOCK OPTION - PERMISO 4", checked: false }
+    { value: 1, id: 1, name: "MOCK OPTION - PERMISO 1" },
+    { value: 2, id: 2, name: "MOCK OPTION - PERMISO 2" },
+    { value: 3, id: 3, name: "MOCK OPTION - PERMISO 3" },
+    { value: 4, id: 4, name: "MOCK OPTION - PERMISO 4" }
   ];
-  let lista = input?.listConfig?.list ?? mockInputOptions;
-  if (lista == void 0) lista = [];
-  const value = input.value ?? "";
+  const lista = input?.listConfig?.list?.every((item) => "name" in item) ? input.listConfig.list : mockInputOptions;
   const optionValue = input?.listConfig?.optionValue ?? input.optionValue ?? "id";
+  const [value, setValue] = React3.useState(
+    input.value?.toString() ?? ""
+  );
+  React3.useEffect(() => {
+    const currentValue = form.getValues(input.name);
+    if (!currentValue && input.value) {
+      form.setValue(input.name, input.value);
+      setValue(input.value.toString());
+    }
+  }, [form, input.name, input.value]);
   const getValue = (item) => {
-    if (optionValue == "name") return item[optionValue];
-    return item.value ?? item.id;
+    return (optionValue === "name" ? item.name.toString() : item.value.toString() ?? item.id).toString();
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
     FormField,
     {
       control: form.control,
       name: input.name,
-      render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(FormItem, { className: "flex flex-row items-center justify-between rounded-lg border p-3 shadow-lg bg-blue-100/20", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-0.5 pr-5", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(FormLabel, { children: /* @__PURE__ */ jsxRuntime.jsx("b", { children: input.label }) }),
-          input.description && /* @__PURE__ */ jsxRuntime.jsx(FormDescription, { children: input.description }),
-          /* @__PURE__ */ jsxRuntime.jsx(FormMessage, {})
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(FormControl, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-          Select,
-          {
-            disabled: input.disabled || isSubmitting,
-            onValueChange: field.onChange,
-            defaultValue: value.toString(),
-            value: field.value?.toString() ?? value.toString(),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(FormControl, { children: /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[60%] bg-black/10 dark:bg-white/25", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: input.placeHolder }) }) }),
-              /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: lista.filter((item) => item.name !== void 0).map((item) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: getValue(item).toString(), children: item.name }, item.id)) })
-            ]
-          }
-        ) })
-      ] })
+      render: ({ field }) => {
+        const currentValue = field.value?.toString() ?? value;
+        return /* @__PURE__ */ jsxRuntime.jsxs(FormItem, { className: "flex flex-row items-center justify-between rounded-lg border p-3 shadow-lg bg-blue-100/20", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-0.5 pr-5", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(FormLabel, { children: /* @__PURE__ */ jsxRuntime.jsx("b", { children: input.label }) }),
+            input.description && /* @__PURE__ */ jsxRuntime.jsx(FormDescription, { children: input.description }),
+            /* @__PURE__ */ jsxRuntime.jsx(FormMessage, {})
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(FormControl, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+            Select,
+            {
+              disabled: input.disabled || isSubmitting,
+              onValueChange: (val) => {
+                field.onChange(val);
+                setValue(val);
+              },
+              value: currentValue || void 0,
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(FormControl, { children: /* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[60%] bg-black/10 dark:bg-white/25", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: input.placeHolder }) }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: lista.map((item) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: getValue(item), children: item.name }, item.id)) })
+              ]
+            }
+          ) })
+        ] });
+      }
     },
     input.name
   );
@@ -5063,34 +5075,40 @@ var InputFactory = class {
     return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 space-y-3", children: instance.render() });
   }
 };
-function getDefaultValues(entity) {
+function getDefaultValues(entity, fields) {
   const defaults = {};
-  if (!entity) return defaults;
-  for (const key in entity) {
-    const value = entity[key];
-    if (value === null || value === void 0) {
-      defaults[key] = "";
-      continue;
-    }
-    switch (typeof value) {
-      case "string":
-        defaults[key] = value ?? "";
-        break;
-      case "number":
-        defaults[key] = value ?? 0;
-        break;
-      case "boolean":
-        defaults[key] = value ?? false;
-        break;
-      case "object":
-        if (Array.isArray(value)) {
-          defaults[key] = [...value];
-        } else {
-          defaults[key] = { ...value };
-        }
-        break;
-      default:
-        defaults[key] = value;
+  if (entity) {
+    for (const key in entity) {
+      const value = entity[key];
+      if (value === null || value === void 0) {
+        defaults[key] = "";
+        continue;
+      }
+      switch (typeof value) {
+        case "string":
+          defaults[key] = value;
+          break;
+        case "number":
+          defaults[key] = value;
+          break;
+        case "boolean":
+          defaults[key] = value;
+          break;
+        case "object":
+          defaults[key] = Array.isArray(value) ? [...value] : { ...value };
+          break;
+        default:
+          defaults[key] = value;
+      }
+    }
+  }
+  if (fields) {
+    const flatFields = fields.flat();
+    for (const field of flatFields) {
+      const key = field.name;
+      if (defaults[key] === void 0) {
+        defaults[key] = field.value ?? field.defaultValue ?? "";
+      }
     }
   }
   return defaults;
@@ -5184,6 +5202,7 @@ var DynamicForm = ({
   const schema = React3.useMemo(() => getDynamicSchema(fields, extraValidations), [fields, extraValidations]);
   const resolver = zod.zodResolver(schema);
   const initialValues = React3.useMemo(() => getDefaultValues(record), [record]);
+  console.log("initialValues", initialValues);
   const form = reactHookForm.useForm({
     resolver,
     defaultValues: initialValues
@@ -5227,7 +5246,8 @@ var DynamicForm = ({
           ] }) }) })
         ]
       }
-    ) })
+    ) }),
+    withErrorsAlert && errorAlertPosition === "down" && /* @__PURE__ */ jsxRuntime.jsx(FormErrorsAlert, { formState: form.formState, fields })
   ] });
   if (!withCard) return formContent;
   return /* @__PURE__ */ jsxRuntime.jsx(Card, { children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: formContent }) });