shadcn-zod-formkit 1.18.1 → 1.20.0

package/dist/index.cjs

@@ -1806,31 +1806,29 @@ function ButtonGroup({
 var ButtonGroupInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
-    return /* @__PURE__ */ jsxRuntime.jsx(FieldButtonGroup, { input, form, isSubmitting });
+    const className = input.className;
+    return /* @__PURE__ */ jsxRuntime.jsx(FieldButtonGroup, { input, form, isSubmitting, className });
   }
 };
-var FieldButtonGroup = ({ input, form, isSubmitting }) => {
+var FieldButtonGroup = ({ input, form, isSubmitting, className = "w-full flex-1" }) => {
   const options = (input.listConfig?.list ?? []).filter((option) => "name" in option);
   const handleSelect = (value) => {
     form.setValue(input.name, value, { shouldValidate: true });
+    if (input.listConfig?.onOptionChange) input.listConfig.onOptionChange(value);
   };
   const selectedValue = form.watch(input.name);
-  return (
-    // <div className="flex flex-col gap-1 w-full">
-    //   <label className="font-semibold">{input.label}</label>
-    //   <div className="flex flex-wrap gap-2">
-    /* @__PURE__ */ jsxRuntime.jsx(ButtonGroup, { children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
-      Button,
-      {
-        type: "button",
-        variant: selectedValue === option.value ? "default" : "outline",
-        onClick: () => handleSelect(option.value),
-        disabled: isSubmitting,
-        children: option.label ?? option.name
-      },
-      option.value
-    )) })
-  );
+  return /* @__PURE__ */ jsxRuntime.jsx(ButtonGroup, { className: "flex flex-row  w-full", children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
+    Button,
+    {
+      type: "button",
+      className,
+      variant: selectedValue === option.value ? "default" : "outline",
+      onClick: () => handleSelect(option.value),
+      disabled: isSubmitting,
+      children: option.label ?? option.name
+    },
+    option.value
+  )) });
 };
 var CheckListInput = class extends BaseInput {
   render() {
@@ -4020,7 +4018,6 @@ var FieldFile = ({ form, input, isSubmitting }) => {
     if (file) {
       const objectUrl = URL.createObjectURL(file);
       setPreview(objectUrl);
-      console.log("\u{1F680} ~ handleFileChange ~ objectUrl:", objectUrl);
     } else {
       setPreview(null);
     }
@@ -4378,7 +4375,8 @@ var FieldTextGroup = ({ form, input, isSubmitting }) => {
     return !fieldState.error && value !== void 0 && value !== "";
   });
   const [showPassword, setShowPassword] = React3.useState(false);
-  const isPasswordField = input.keyboardType === "password";
+  const isPasswordField = input.keyboardType === "password" /* PASSWORD */;
+  const isNumberField = input.keyboardType === "number" /* NUMBER */;
   const showInputGroupAddons = iconsRight.length > 0 || textRight || autoValidate || infoTooltip || isPasswordField;
   const formField = /* @__PURE__ */ jsxRuntime.jsx(
     FormField,
@@ -4400,8 +4398,18 @@ var FieldTextGroup = ({ form, input, isSubmitting }) => {
               {
                 placeholder: input.placeHolder,
                 disabled: input.disabled || isSubmitting,
-                ...field,
-                type: isPasswordField && !showPassword ? "password" : "text"
+                onBlur: field.onBlur,
+                name: field.name,
+                ref: field.ref,
+                type: isPasswordField && !showPassword ? "password" : isNumberField ? "number" : "text",
+                value: field.value ?? "",
+                onChange: (e) => {
+                  let value = e.target.value;
+                  if (isNumberField) {
+                    value = e.target.value === "" ? "" : Number(e.target.value);
+                  }
+                  field.onChange(value);
+                }
               }
             ),
             showInputGroupAddons && /* @__PURE__ */ jsxRuntime.jsxs(InputGroupAddon, { align: "inline-end", children: [
@@ -5630,6 +5638,7 @@ var DynamicForm = ({
   errorAlertPosition = "up",
   withCard = false,
   submitBtnClass = "",
+  listBtnConfig = [],
   submitBtnLabel = "Guardar"
 }) => {
   const [isPending, startTransition] = React3.useTransition();
@@ -5680,23 +5689,38 @@ var DynamicForm = ({
             /* @__PURE__ */ jsxRuntime.jsx(FormFieldsGrid, { fields, form, readOnly }),
             children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-row items-center gap-2 w-full h-full", children })
           ] }),
-          !readOnly && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-row gap-2 justify-end items-end", children: /* @__PURE__ */ jsxRuntime.jsx(
-            Button,
-            {
-              type: onClick ? "button" : "submit",
-              size: "lg",
-              className: submitBtnClass,
-              disabled: isPending,
-              onClick: onClick ? handleClick : void 0,
-              children: isPending ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
-                "Guardando..."
-              ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Save, { className: "h-4 w-4 mr-2" }),
-                submitBtnLabel
-              ] })
-            }
-          ) })
+          /* @__PURE__ */ jsxRuntime.jsxs(ButtonGroup, { className: "flex flex-row  w-full", children: [
+            listBtnConfig.map((btn, key) => /* @__PURE__ */ jsxRuntime.jsx(
+              Button,
+              {
+                type: btn.btnType,
+                size: "lg",
+                className: submitBtnClass,
+                variant: btn.variant,
+                onClick: btn.onClick,
+                disabled: btn.disabled,
+                children: btn.label
+              },
+              key
+            )),
+            !readOnly && /* @__PURE__ */ jsxRuntime.jsx(
+              Button,
+              {
+                type: onClick ? "button" : "submit",
+                size: "lg",
+                className: submitBtnClass,
+                disabled: isPending,
+                onClick: onClick ? handleClick : void 0,
+                children: isPending ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
+                  "Guardando..."
+                ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Save, { className: "h-4 w-4 mr-2" }),
+                  submitBtnLabel
+                ] })
+              }
+            )
+          ] })
         ]
       }
     ) }),