shadcn-zod-formkit 3.9.4 → 3.9.6

package/dist/index.cjs

@@ -13009,6 +13009,10 @@ var KeyboardQwerty = ({ onKeyPress, onEnter, keyFontSize = "text-2xl", onDelete,
   const isUpper = shiftMode !== "off";
   React3.useEffect(() => {
     const handleKeyDown = (e) => {
+      const active = document.activeElement;
+      if (active instanceof HTMLInputElement || active instanceof HTMLTextAreaElement || active instanceof HTMLElement && active.getAttribute("contenteditable") === "true") {
+        return;
+      }
       if (isInputRequired && !currentInputField) return;
       const key = e.key;
       if (key === "Enter") {
@@ -14222,13 +14226,15 @@ var TextInputGroup = class extends BaseInput {
 };
 var FieldTextGroup = ({ form, input, isSubmitting }) => {
   const [isValid, setIsValid] = React3.useState(isValidField(input, form));
+  React3.useEffect(() => {
+    setIsValid(isValidField(input, form));
+  }, [form.formState]);
   const formField = /* @__PURE__ */ jsxRuntime.jsx(
     FormField,
     {
       control: form.control,
       name: input.name,
       render: ({ field }) => {
-        setIsValid(isValidField(input, form));
         return /* @__PURE__ */ jsxRuntime.jsxs(FormItem, { className: `${input.withLateralLabel ? "flex items-center gap-2 flex-row" : ""} ${input.className}`, children: [
           /* @__PURE__ */ jsxRuntime.jsx(FormLabel, { className: `${input.withLateralLabel ? "text-right" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx("b", { children: input.label }) }),
           /* @__PURE__ */ jsxRuntime.jsx(FormControl, { className: `shadow-lg ${input.withLateralLabel ? " text-right" : ""}`, children: CustomInputGroup({
@@ -14319,6 +14325,8 @@ var CustomInputGroup = ({
   const inputGroupClass = input.isFakeInput ? fieldType : "";
   React3.useEffect(() => {
     if (!input.isFakeInput) return;
+    field?.onChange(value);
+    isValidField(input, form);
     handleOnChage(field?.value, input, field);
   }, [field?.value]);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -14335,7 +14343,9 @@ var CustomInputGroup = ({
           placeholder: input.placeHolder,
           disabled: input.disabled || isSubmitting,
           onBlur: field?.onBlur,
-          onFocus: () => setCurrentInputField({ input, field }),
+          onFocus: () => {
+            if (withKeyboard) setCurrentInputField({ input, field });
+          },
           name: field?.name,
           ref: field?.ref,
           type: fieldType,
@@ -14356,6 +14366,7 @@ var CustomInputGroup = ({
               value2 = applyTransform(processedValue, input.transform);
             }
             field?.onChange(value2);
+            onChange?.({ target: { value: value2 } });
             isValidField(input, form);
             handleOnChage(value2, input, field);
           }
@@ -15260,29 +15271,25 @@ var FieldStringValueList = ({ form, input, isSubmitting }) => {
   const [isValid, setIsValid] = React3.useState(isValidField(input, form));
   React3.useEffect(() => {
     setIsValid(isValidField(input, form));
-  }, [input]);
+  }, [form.formState]);
   React3.useEffect(() => {
     const current = form.getValues(fieldName);
     if (!Array.isArray(current)) {
       form.setValue(fieldName, []);
     }
   }, [form, fieldName]);
-  const handleAddItem = () => {
+  const handleAddItem = React3.useCallback(() => {
     const current = form.getValues(fieldName) || [];
-    form.setValue(fieldName, [...current, ""]);
-  };
-  const handleRemoveItem = (index) => {
+    form.setValue(fieldName, [...current, ""], { shouldDirty: true });
+  }, [form, fieldName]);
+  const handleRemoveItem = React3.useCallback((index) => {
     const current = form.getValues(fieldName) || [];
-    const updated = current.filter((_, i) => i !== index);
-    form.setValue(fieldName, updated);
-  };
-  const handleChange = (index, newValue) => {
+    form.setValue(fieldName, current.filter((_, i) => i !== index), { shouldDirty: true });
+  }, [form, fieldName]);
+  const handleChange = React3.useCallback((index, newValue) => {
     const current = form.getValues(fieldName) || [];
-    const updated = current.map(
-      (item, i) => i === index ? newValue : item
-    );
-    form.setValue(fieldName, updated);
-  };
+    form.setValue(fieldName, current.map((item, i) => i === index ? newValue : item), { shouldDirty: true });
+  }, [form, fieldName]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     FormField,
     {
@@ -15303,7 +15310,6 @@ var FieldStringValueList = ({ form, input, isSubmitting }) => {
                   /* @__PURE__ */ jsxRuntime.jsx(
                     CustomInputGroup,
                     {
-                      autoValidate: true,
                       value,
                       input,
                       isValid,
@@ -15324,7 +15330,7 @@ var FieldStringValueList = ({ form, input, isSubmitting }) => {
                   )
                 ]
               },
-              index
+              `${fieldName}_${index}`
             )),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end mt-2", children: withAddBtn && /* @__PURE__ */ jsxRuntime.jsx(
               Button,
@@ -17433,7 +17439,7 @@ var DynamicForm = ({
         {
           type: btn.btnType,
           size: "lg",
-          className: submitBtnClass,
+          className: submitBtnClass ?? btn.className,
           variant: btn.variant,
           onClick: btn.onClick,
           disabled: btn.disabled,