shadcn-zod-formkit 3.9.3 → 3.9.5

package/dist/index.cjs

@@ -7005,7 +7005,7 @@ var require_leaflet_src = __commonJS({
           }
         }
       });
-      var Tooltip2 = DivOverlay.extend({
+      var Tooltip3 = DivOverlay.extend({
         // @section
         // @aka Tooltip options
         options: {
@@ -7118,7 +7118,7 @@ var require_leaflet_src = __commonJS({
         }
       });
       var tooltip = function(options, source) {
-        return new Tooltip2(options, source);
+        return new Tooltip3(options, source);
       };
       Map2.include({
         // @method openTooltip(tooltip: Tooltip): this
@@ -7127,7 +7127,7 @@ var require_leaflet_src = __commonJS({
         // @method openTooltip(content: String|HTMLElement, latlng: LatLng, options?: Tooltip options): this
         // Creates a tooltip with the specified content and options and open it.
         openTooltip: function(tooltip2, latlng, options) {
-          this._initOverlay(Tooltip2, tooltip2, latlng, options).openOn(this);
+          this._initOverlay(Tooltip3, tooltip2, latlng, options).openOn(this);
           return this;
         },
         // @method closeTooltip(tooltip: Tooltip): this
@@ -7146,7 +7146,7 @@ var require_leaflet_src = __commonJS({
           if (this._tooltip && this.isTooltipOpen()) {
             this.unbindTooltip();
           }
-          this._tooltip = this._initOverlay(Tooltip2, this._tooltip, content, options);
+          this._tooltip = this._initOverlay(Tooltip3, this._tooltip, content, options);
           this._initTooltipInteractions();
           if (this._tooltip.options.permanent && this._map && this._map.hasLayer(this)) {
             this.openTooltip();
@@ -9610,7 +9610,7 @@ var require_leaflet_src = __commonJS({
       exports2.SVG = SVG;
       exports2.SVGOverlay = SVGOverlay;
       exports2.TileLayer = TileLayer;
-      exports2.Tooltip = Tooltip2;
+      exports2.Tooltip = Tooltip3;
       exports2.Transformation = Transformation;
       exports2.Util = Util;
       exports2.VideoOverlay = VideoOverlay;
@@ -12672,6 +12672,77 @@ var KeyboardBuilder = ({
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full h-full m-0.5 p-1", className), children: content });
 };
 
+// src/components/custom/form/inputs/base/style-field-base.ts
+var sizeClasses = {
+  sm: "px-3 py-2 text-xl",
+  md: "px-4 py-3 text-3xl",
+  lg: "px-5 py-4 text-4xl"
+};
+var activeColorClasses = {
+  amber: "border-amber-400 bg-amber-400/10",
+  blue: "border-blue-400 bg-blue-400/10",
+  green: "border-green-400 bg-green-400/10",
+  red: "border-red-400 bg-red-400/10",
+  purple: "border-purple-400 bg-purple-400/10"
+};
+
+// src/components/custom/form/inputs/base/base-input.ts
+var BaseInput = class {
+  constructor(input, form, isSubmitting) {
+    this.input = input;
+    this.form = form;
+    this.isSubmitting = isSubmitting;
+  }
+};
+var entityToInputOption = (entitiy, name = "name", description = "description", groupedLabel, optionLabel = "label") => ({
+  id: entitiy["id"],
+  name: entitiy[name],
+  label: entitiy[optionLabel],
+  description: entitiy[description],
+  groupedLabel
+});
+var entitiesToInputOption = (data, optionValue = "name", groupedLabel, optionLabel = "description") => {
+  const entities = [];
+  for (const key of data) {
+    const entidad = entityToInputOption(key, optionValue, optionLabel, groupedLabel);
+    if (entidad) entities.push(entidad);
+  }
+  return entities;
+};
+var entityToGroupedOption = (entitiy, name = "name") => ({
+  id: entitiy["id"],
+  label: entitiy[name] || entitiy["label"],
+  options: entitiy["options"] || [],
+  selectedOptions: []
+});
+var entitiesToGroupedOption = (data, optionValue = "name") => {
+  const entities = [];
+  for (const key of data) {
+    const entidad = entityToGroupedOption(key, optionValue);
+    if (entidad) entities.push(entidad);
+  }
+  return entities;
+};
+var handleOnChage = (event, input, field) => {
+  let value = event;
+  if (event && typeof event === "object" && "target" in event) {
+    value = event.target.value;
+  }
+  field?.onChange(value);
+  const data = input.form?.getValues();
+  input.onChange?.(value, data);
+  input.onAnyFieldChange?.(data);
+};
+var isValidField = (input, form, defaultValue) => {
+  const value = defaultValue ?? form.getValues(input.name);
+  const fieldState = form.getFieldState(input.name);
+  if (input.zodType) {
+    const result = input.zodType.safeParse(value);
+    return result.success;
+  }
+  return !fieldState.error && value !== void 0 && value !== "";
+};
+
 // src/components/custom/form/inputs/base/definitions.ts
 var flattenFields = (fields, onAnyFieldChange) => {
   const result = [];
@@ -12695,6 +12766,234 @@ var TextInputType = /* @__PURE__ */ ((TextInputType3) => {
   TextInputType3["PASSWORD"] = "password";
   return TextInputType3;
 })(TextInputType || {});
+var flattenFields2 = (fields) => {
+  const result = [];
+  for (const field of fields) {
+    if (Array.isArray(field)) {
+      result.push(...flattenFields2(field));
+    } else if (field.fields) {
+      result.push(...flattenFields2(field.fields));
+    } else {
+      result.push(field);
+    }
+  }
+  return result;
+};
+var FormErrorsAlert = ({
+  formState,
+  fields
+}) => {
+  const flatFields = flattenFields2(fields);
+  const hasErrors = Object.keys(formState.errors).length > 0;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 4 }, children: hasErrors && /* @__PURE__ */ jsxRuntime.jsx(
+    CustomAlert,
+    {
+      title: "Revisar los siguientes criterios",
+      description: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: Object.entries(formState.errors).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+          getFieldLabel(key, flatFields),
+          ":"
+        ] }),
+        " ",
+        value?.message?.toString() ?? ""
+      ] }, key)) }),
+      className: "mb-4",
+      variant: "error"
+    }
+  ) });
+};
+var getFieldLabel = (fieldErrorKey, fields) => {
+  const foundField = fields.find((field) => field.name === fieldErrorKey);
+  return foundField?.label ?? fieldErrorKey;
+};
+
+// src/components/custom/form/inputs/base/input-types.ts
+var InputTypes = /* @__PURE__ */ ((InputTypes3) => {
+  InputTypes3["HIDDEN"] = "hidden";
+  InputTypes3["TEXT"] = "text";
+  InputTypes3["TEXT_GROUP"] = "text_group";
+  InputTypes3["NUMBER"] = "number";
+  InputTypes3["SWITCH"] = "switch";
+  InputTypes3["CHECKBOX"] = "checkbox";
+  InputTypes3["SELECT"] = "select";
+  InputTypes3["SIMPLE_CHECK_LIST"] = "siple_checklist";
+  InputTypes3["CHECK_LIST"] = "checklist";
+  InputTypes3["GROUPED_SWITCH_LIST"] = "grouped_switchlist";
+  InputTypes3["ACCORDION_GROUPED_SWITCH_LIST"] = "accordion_grouped_switchlist";
+  InputTypes3["DATE"] = "date";
+  InputTypes3["TEXTAREA"] = "textarea";
+  InputTypes3["FILE"] = "file";
+  InputTypes3["OTP"] = "otp";
+  InputTypes3["FORM"] = "form";
+  InputTypes3["COLOR"] = "color";
+  InputTypes3["RADIO_GROUP"] = "radio_group";
+  InputTypes3["TAGS"] = "tags";
+  InputTypes3["DATE_TIME"] = "date_time";
+  InputTypes3["TIME"] = "time";
+  InputTypes3["FILE_MULTI_UPLOAD"] = "file_multi_upload";
+  InputTypes3["SLIDER"] = "slider";
+  InputTypes3["BUTTON_GROUP"] = "button_group";
+  InputTypes3["CURRENCY"] = "currency";
+  InputTypes3["KEY_VALUE"] = "key_value";
+  InputTypes3["REPEATER"] = "repeater";
+  InputTypes3["MULTI_SELECT"] = "multi_select";
+  InputTypes3["COMBOBOX"] = "COMBO_BOX";
+  InputTypes3["SORTABLE_LIST"] = "sortable_list";
+  InputTypes3["REPEATER_TABS"] = "repeater_tabs";
+  InputTypes3["STRING_LIST"] = "string_list";
+  InputTypes3["RATING"] = "rating";
+  InputTypes3["PHONE"] = "phone";
+  InputTypes3["URL"] = "url";
+  InputTypes3["PASSWORD"] = "password";
+  InputTypes3["AUTOCOMPLETE"] = "autocomplete";
+  InputTypes3["EMAIL"] = "email";
+  InputTypes3["SEARCH"] = "search";
+  InputTypes3["LOCATION_PICKER"] = "location_picker";
+  InputTypes3["DATE_RANGE"] = "date_range";
+  InputTypes3["COUNTRY_SELECT"] = "country_select";
+  InputTypes3["RANGE"] = "range";
+  InputTypes3["FILE_UPLOAD"] = "file_upload";
+  return InputTypes3;
+})(InputTypes || {});
+var inputFieldComp = [
+  "string_list" /* STRING_LIST */,
+  "repeater_tabs" /* REPEATER_TABS */,
+  "sortable_list" /* SORTABLE_LIST */,
+  "COMBO_BOX" /* COMBOBOX */,
+  "multi_select" /* MULTI_SELECT */,
+  "repeater" /* REPEATER */,
+  "key_value" /* KEY_VALUE */,
+  "currency" /* CURRENCY */,
+  "button_group" /* BUTTON_GROUP */,
+  "slider" /* SLIDER */,
+  "file_multi_upload" /* FILE_MULTI_UPLOAD */,
+  "time" /* TIME */,
+  "date_time" /* DATE_TIME */,
+  "tags" /* TAGS */,
+  "radio_group" /* RADIO_GROUP */,
+  "text_group" /* TEXT_GROUP */,
+  "accordion_grouped_switchlist" /* ACCORDION_GROUPED_SWITCH_LIST */,
+  "grouped_switchlist" /* GROUPED_SWITCH_LIST */,
+  "text" /* TEXT */,
+  "switch" /* SWITCH */,
+  "siple_checklist" /* SIMPLE_CHECK_LIST */,
+  "checkbox" /* CHECKBOX */,
+  "color" /* COLOR */,
+  "otp" /* OTP */,
+  "select" /* SELECT */,
+  "date" /* DATE */,
+  "file" /* FILE */,
+  "form" /* FORM */,
+  "number" /* NUMBER */,
+  "textarea" /* TEXTAREA */,
+  // InputTypes.SWITCH_LIST,
+  "hidden" /* HIDDEN */,
+  // ✨ New input types (v1.35.0)
+  "rating" /* RATING */,
+  "phone" /* PHONE */,
+  "url" /* URL */,
+  "password" /* PASSWORD */,
+  "autocomplete" /* AUTOCOMPLETE */,
+  // ✨ New input types (v1.36.0)
+  "email" /* EMAIL */,
+  "search" /* SEARCH */,
+  "location_picker" /* LOCATION_PICKER */,
+  "date_range" /* DATE_RANGE */,
+  "country_select" /* COUNTRY_SELECT */,
+  "range" /* RANGE */,
+  // ✨ New input types (v1.37.0)
+  "file_upload" /* FILE_UPLOAD */
+];
+var TextField = ({
+  name,
+  value,
+  isActive = false,
+  onFocus,
+  onKeyPress,
+  onDelete,
+  onSpace,
+  infoTooltip,
+  textLeft,
+  textRight,
+  iconsLeft = [],
+  iconsRight = [],
+  size = "md",
+  disabled = false,
+  hidden = false,
+  prefix,
+  suffix,
+  placeholder = "",
+  className,
+  activeColor = "amber" /* amber */,
+  inputType = "default" /* DEFAULT */
+}) => {
+  React3.useEffect(() => {
+    if (!isActive || disabled) return;
+    const handleKeyDown = (e) => {
+      if (e.key === "Backspace" || e.key === "Delete") {
+        e.preventDefault();
+        onDelete?.();
+        return;
+      }
+      if (/^[0-9]$/.test(e.key)) {
+        e.preventDefault();
+        onKeyPress?.(e.key);
+        return;
+      }
+      if (e.key === " ") {
+        e.preventDefault();
+        onSpace?.();
+        return;
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isActive, disabled, onKeyPress, onDelete, onSpace]);
+  if (hidden) return null;
+  const handleClick = () => {
+    if (!disabled) {
+      onFocus?.(name);
+    }
+  };
+  const displayValue = value ?? "";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      tabIndex: 0,
+      onClick: handleClick,
+      className: cn(
+        "flex flex-row items-center gap-3 rounded-xl border-2 transition-all min-h-16 outline-none",
+        sizeClasses[size],
+        isActive ? activeColorClasses[activeColor] : "border-zinc-700/40 hover:border-zinc-600",
+        disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
+        className
+      ),
+      children: [
+        prefix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400 text-xs font-mono font-bold", children: prefix }),
+        (iconsLeft.length > 0 || textLeft) && /* @__PURE__ */ jsxRuntime.jsxs(InputGroupAddon, { children: [
+          textLeft && /* @__PURE__ */ jsxRuntime.jsx(InputGroupText, { children: typeof textLeft === "string" ? textLeft : "" }),
+          iconsLeft.map((IconComponent, index) => /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { size: 20, className: "text-zinc-400" }, index))
+        ] }),
+        placeholder && displayValue.toString().length == 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono font-bold text-zinc-500/20", style: { color: "#8080807d" }, children: placeholder }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
+          "font-mono font-bold tracking-widest",
+          !displayValue && "text-zinc-500"
+        ), children: inputType !== "password" /* PASSWORD */ ? displayValue : "\u2022".repeat(displayValue.toString().length) }),
+        suffix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400 text-sm", children: suffix }),
+        (iconsRight.length > 0 || textRight) && /* @__PURE__ */ jsxRuntime.jsxs(InputGroupAddon, { className: "ml-auto", children: [
+          textRight && /* @__PURE__ */ jsxRuntime.jsx(InputGroupText, { children: textRight }),
+          iconsRight.map((IconComponent, index) => /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { size: 20, className: "text-zinc-400" }, index))
+        ] }),
+        infoTooltip && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-auto text-[10px] uppercase tracking-widest", children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(TooltipPrimitive.Tooltip, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { size: 20, className: "text-zinc-400 hover:text-zinc-200" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: infoTooltip }) })
+        ] }) }) })
+      ]
+    }
+  );
+};
 var QwertyKeyboard = class extends BaseKeyboard {
   render() {
     const { input, children, className, keyFontSize } = this;
@@ -12705,11 +13004,15 @@ var KeyboardQwerty = ({ onKeyPress, onEnter, keyFontSize = "text-2xl", onDelete,
   const [shiftMode, setShiftMode] = React3.useState("off");
   const [mode, setMode] = React3.useState("letters");
   const lastShiftPress = React3.useRef(0);
-  const { currentInputField, write, setIsOpen, backspace, isInputRequired } = useKeyboardStore();
+  const { currentInputField, write, setIsOpen, backspace, isInputRequired, value } = useKeyboardStore();
   const storeonEnter = useKeyboardStore((state) => state.onEnter);
   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") {
@@ -12776,7 +13079,27 @@ var KeyboardQwerty = ({ onKeyPress, onEnter, keyFontSize = "text-2xl", onDelete,
   const shiftActive = shiftMode !== "off";
   const textField = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     children && children,
-    !children && currentInputField && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-3 h-full min-h-16 flex-1 flex flex-row text-2xl font-bold justify-center text-center items-center gap-2 rounded-xl border-2 transition-all  outline-none border-amber-400 bg-amber-50 ", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: currentInputField.input && currentInputField.input.keyboardType == "password" /* PASSWORD */ ? "\u2022".repeat(currentInputField.field?.value.toString().length) : currentInputField.field?.value || "" }) })
+    !children && currentInputField && /* @__PURE__ */ jsxRuntime.jsx(
+      TextField,
+      {
+        name: currentInputField.input.label,
+        placeholder: currentInputField.input.placeHolder ?? currentInputField.input.label,
+        value: currentInputField.field?.value,
+        inputType: currentInputField.input.keyboardType,
+        isActive: true,
+        iconsLeft: currentInputField.input.inputGroupConfig?.iconsLeft,
+        className: "justify-center"
+      }
+    ),
+    !currentInputField && /* @__PURE__ */ jsxRuntime.jsx(
+      TextField,
+      {
+        name: "",
+        value,
+        isActive: true,
+        className: "justify-center"
+      }
+    )
   ] });
   const btnDelete = { label: "delete", icons: [lucideReact.DeleteIcon], onClick: () => {
     backspace();
@@ -12890,161 +13213,6 @@ var KeyboardFactory = class {
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: instance.render() });
   }
 };
-
-// src/components/custom/form/inputs/base/base-input.ts
-var BaseInput = class {
-  constructor(input, form, isSubmitting) {
-    this.input = input;
-    this.form = form;
-    this.isSubmitting = isSubmitting;
-  }
-};
-var entityToInputOption = (entitiy, name = "name", description = "description", groupedLabel, optionLabel = "label") => ({
-  id: entitiy["id"],
-  name: entitiy[name],
-  label: entitiy[optionLabel],
-  description: entitiy[description],
-  groupedLabel
-});
-var entitiesToInputOption = (data, optionValue = "name", groupedLabel, optionLabel = "description") => {
-  const entities = [];
-  for (const key of data) {
-    const entidad = entityToInputOption(key, optionValue, optionLabel, groupedLabel);
-    if (entidad) entities.push(entidad);
-  }
-  return entities;
-};
-var entityToGroupedOption = (entitiy, name = "name") => ({
-  id: entitiy["id"],
-  label: entitiy[name] || entitiy["label"],
-  options: entitiy["options"] || [],
-  selectedOptions: []
-});
-var entitiesToGroupedOption = (data, optionValue = "name") => {
-  const entities = [];
-  for (const key of data) {
-    const entidad = entityToGroupedOption(key, optionValue);
-    if (entidad) entities.push(entidad);
-  }
-  return entities;
-};
-var handleOnChage = (event, input, field) => {
-  let value = event;
-  if (event && typeof event === "object" && "target" in event) {
-    value = event.target.value;
-  }
-  field?.onChange(value);
-  const data = input.form?.getValues();
-  input.onChange?.(value, data);
-  input.onAnyFieldChange?.(data);
-};
-var isValidField = (input, form, defaultValue) => {
-  const value = defaultValue ?? form.getValues(input.name);
-  const fieldState = form.getFieldState(input.name);
-  if (input.zodType) {
-    const result = input.zodType.safeParse(value);
-    return result.success;
-  }
-  return !fieldState.error && value !== void 0 && value !== "";
-};
-
-// src/components/custom/form/inputs/base/input-types.ts
-var InputTypes = /* @__PURE__ */ ((InputTypes3) => {
-  InputTypes3["HIDDEN"] = "hidden";
-  InputTypes3["TEXT"] = "text";
-  InputTypes3["TEXT_GROUP"] = "text_group";
-  InputTypes3["NUMBER"] = "number";
-  InputTypes3["SWITCH"] = "switch";
-  InputTypes3["CHECKBOX"] = "checkbox";
-  InputTypes3["SELECT"] = "select";
-  InputTypes3["SIMPLE_CHECK_LIST"] = "siple_checklist";
-  InputTypes3["CHECK_LIST"] = "checklist";
-  InputTypes3["GROUPED_SWITCH_LIST"] = "grouped_switchlist";
-  InputTypes3["ACCORDION_GROUPED_SWITCH_LIST"] = "accordion_grouped_switchlist";
-  InputTypes3["DATE"] = "date";
-  InputTypes3["TEXTAREA"] = "textarea";
-  InputTypes3["FILE"] = "file";
-  InputTypes3["OTP"] = "otp";
-  InputTypes3["FORM"] = "form";
-  InputTypes3["COLOR"] = "color";
-  InputTypes3["RADIO_GROUP"] = "radio_group";
-  InputTypes3["TAGS"] = "tags";
-  InputTypes3["DATE_TIME"] = "date_time";
-  InputTypes3["TIME"] = "time";
-  InputTypes3["FILE_MULTI_UPLOAD"] = "file_multi_upload";
-  InputTypes3["SLIDER"] = "slider";
-  InputTypes3["BUTTON_GROUP"] = "button_group";
-  InputTypes3["CURRENCY"] = "currency";
-  InputTypes3["KEY_VALUE"] = "key_value";
-  InputTypes3["REPEATER"] = "repeater";
-  InputTypes3["MULTI_SELECT"] = "multi_select";
-  InputTypes3["COMBOBOX"] = "COMBO_BOX";
-  InputTypes3["SORTABLE_LIST"] = "sortable_list";
-  InputTypes3["REPEATER_TABS"] = "repeater_tabs";
-  InputTypes3["STRING_LIST"] = "string_list";
-  InputTypes3["RATING"] = "rating";
-  InputTypes3["PHONE"] = "phone";
-  InputTypes3["URL"] = "url";
-  InputTypes3["PASSWORD"] = "password";
-  InputTypes3["AUTOCOMPLETE"] = "autocomplete";
-  InputTypes3["EMAIL"] = "email";
-  InputTypes3["SEARCH"] = "search";
-  InputTypes3["LOCATION_PICKER"] = "location_picker";
-  InputTypes3["DATE_RANGE"] = "date_range";
-  InputTypes3["COUNTRY_SELECT"] = "country_select";
-  InputTypes3["RANGE"] = "range";
-  InputTypes3["FILE_UPLOAD"] = "file_upload";
-  return InputTypes3;
-})(InputTypes || {});
-var inputFieldComp = [
-  "string_list" /* STRING_LIST */,
-  "repeater_tabs" /* REPEATER_TABS */,
-  "sortable_list" /* SORTABLE_LIST */,
-  "COMBO_BOX" /* COMBOBOX */,
-  "multi_select" /* MULTI_SELECT */,
-  "repeater" /* REPEATER */,
-  "key_value" /* KEY_VALUE */,
-  "currency" /* CURRENCY */,
-  "button_group" /* BUTTON_GROUP */,
-  "slider" /* SLIDER */,
-  "file_multi_upload" /* FILE_MULTI_UPLOAD */,
-  "time" /* TIME */,
-  "date_time" /* DATE_TIME */,
-  "tags" /* TAGS */,
-  "radio_group" /* RADIO_GROUP */,
-  "text_group" /* TEXT_GROUP */,
-  "accordion_grouped_switchlist" /* ACCORDION_GROUPED_SWITCH_LIST */,
-  "grouped_switchlist" /* GROUPED_SWITCH_LIST */,
-  "text" /* TEXT */,
-  "switch" /* SWITCH */,
-  "siple_checklist" /* SIMPLE_CHECK_LIST */,
-  "checkbox" /* CHECKBOX */,
-  "color" /* COLOR */,
-  "otp" /* OTP */,
-  "select" /* SELECT */,
-  "date" /* DATE */,
-  "file" /* FILE */,
-  "form" /* FORM */,
-  "number" /* NUMBER */,
-  "textarea" /* TEXTAREA */,
-  // InputTypes.SWITCH_LIST,
-  "hidden" /* HIDDEN */,
-  // ✨ New input types (v1.35.0)
-  "rating" /* RATING */,
-  "phone" /* PHONE */,
-  "url" /* URL */,
-  "password" /* PASSWORD */,
-  "autocomplete" /* AUTOCOMPLETE */,
-  // ✨ New input types (v1.36.0)
-  "email" /* EMAIL */,
-  "search" /* SEARCH */,
-  "location_picker" /* LOCATION_PICKER */,
-  "date_range" /* DATE_RANGE */,
-  "country_select" /* COUNTRY_SELECT */,
-  "range" /* RANGE */,
-  // ✨ New input types (v1.37.0)
-  "file_upload" /* FILE_UPLOAD */
-];
 var GroupedSwitchInput = class extends BaseInput {
   render() {
     const { input, isSubmitting } = this;
@@ -14058,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({
@@ -14155,9 +14325,11 @@ 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: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
     input.isFakeInput && /* @__PURE__ */ jsxRuntime.jsx(FakeInput, { input, field, form, setShowPassword, isPasswordField, showPassword }),
     /* @__PURE__ */ jsxRuntime.jsxs(InputGroup, { className: cn(input.classNameGroupInput ?? "h-10", inputGroupClass), children: [
       (iconsLeft.length > 0 || textLeft) && /* @__PURE__ */ jsxRuntime.jsxs(InputGroupAddon, { children: [
@@ -14171,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,
@@ -14192,6 +14366,7 @@ var CustomInputGroup = ({
               value2 = applyTransform(processedValue, input.transform);
             }
             field?.onChange(value2);
+            onChange?.({ target: { value: value2 } });
             isValidField(input, form);
             handleOnChage(value2, input, field);
           }
@@ -15096,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,
     {
@@ -15139,7 +15310,6 @@ var FieldStringValueList = ({ form, input, isSubmitting }) => {
                   /* @__PURE__ */ jsxRuntime.jsx(
                     CustomInputGroup,
                     {
-                      autoValidate: true,
                       value,
                       input,
                       isValid,
@@ -15160,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,
@@ -15519,7 +15689,7 @@ var FieldRating = ({ input, form, isSubmitting }) => {
   const max = input.max ?? 5;
   const size = input.size ?? "md";
   const showValue = input.showValue ?? false;
-  const sizeClasses = {
+  const sizeClasses2 = {
     sm: "h-4 w-4",
     md: "h-6 w-6",
     lg: "h-8 w-8"
@@ -15553,7 +15723,7 @@ var FieldRating = ({ input, form, isSubmitting }) => {
                   lucideReact.Star,
                   {
                     className: cn(
-                      sizeClasses[size],
+                      sizeClasses2[size],
                       isFilled ? "fill-yellow-400 text-yellow-400" : "fill-none text-gray-300"
                     )
                   }
@@ -17031,7 +17201,7 @@ function getDefaultValues(entity, fields) {
     });
   }
   if (fields) {
-    const flatFields = flattenFields2(fields);
+    const flatFields = flattenFields3(fields);
     for (const field of flatFields) {
       const key = field.name;
       if (defaults[key] === void 0) {
@@ -17041,13 +17211,13 @@ function getDefaultValues(entity, fields) {
   }
   return defaults;
 }
-var flattenFields2 = (fields) => {
+var flattenFields3 = (fields) => {
   const result = [];
   for (const field of fields) {
     if (Array.isArray(field)) {
-      result.push(...flattenFields2(field));
+      result.push(...flattenFields3(field));
     } else if (field.fields) {
-      result.push(...flattenFields2(field.fields));
+      result.push(...flattenFields3(field.fields));
     } else {
       result.push(field);
     }
@@ -17055,7 +17225,7 @@ var flattenFields2 = (fields) => {
   return result;
 };
 var getDynamicSchema = (fields, extraValidations) => {
-  const flatFields = flattenFields2(fields);
+  const flatFields = flattenFields3(fields);
   const shape = flatFields.reduce((acc, f) => {
     acc[f.name] = f.zodType ?? z2__default.default.any();
     return acc;
@@ -17068,46 +17238,6 @@ var getDynamicSchema = (fields, extraValidations) => {
   }
   return schema;
 };
-var flattenFields3 = (fields) => {
-  const result = [];
-  for (const field of fields) {
-    if (Array.isArray(field)) {
-      result.push(...flattenFields3(field));
-    } else if (field.fields) {
-      result.push(...flattenFields3(field.fields));
-    } else {
-      result.push(field);
-    }
-  }
-  return result;
-};
-var FormErrorsAlert = ({
-  formState,
-  fields
-}) => {
-  const flatFields = flattenFields3(fields);
-  const hasErrors = Object.keys(formState.errors).length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 4 }, children: hasErrors && /* @__PURE__ */ jsxRuntime.jsx(
-    CustomAlert,
-    {
-      title: "Revisar los siguientes criterios",
-      description: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: Object.entries(formState.errors).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
-          getFieldLabel(key, flatFields),
-          ":"
-        ] }),
-        " ",
-        value?.message?.toString() ?? ""
-      ] }, key)) }),
-      className: "mb-4",
-      variant: "error"
-    }
-  ) });
-};
-var getFieldLabel = (fieldErrorKey, fields) => {
-  const foundField = fields.find((field) => field.name === fieldErrorKey);
-  return foundField?.label ?? fieldErrorKey;
-};
 var isRenderableChild = (c) => c !== void 0 && c !== null && typeof c !== "function";
 var shouldShowField = (field, values) => {
   if (typeof field.showWhen === "function") {
@@ -17183,7 +17313,7 @@ var DynamicSheetKeyboard = ({ currentInputField, children, input, className, chi
     KeyboardFactory.create(currentInputField?.input.keyboard ?? "qwerty" /* QWERTY */, input, children),
     " "
   ] });
-  const { setCurrentInputField, isOpenDynamic } = useKeyboardStore();
+  const { setCurrentInputField } = useKeyboardStore();
   const [container, setContainer] = React3.useState(content);
   React3.useEffect(() => {
     if (!currentInputField) setCurrentInputField(null);
@@ -17226,7 +17356,8 @@ var DynamicForm = ({
   submitBtnIcon = lucideReact.Save,
   dialogTitle = "\xBFEst\xE1s seguro?",
   dialogDescription = "Esta acci\xF3n no se puede deshacer. \xBFDeseas continuar?",
-  withConfirmDialog = false
+  withConfirmDialog = false,
+  withSheetKeyboard = false
 }) => {
   const [isPending, startTransition] = React3.useTransition();
   const currentInputField = useKeyboardStore((state) => state.currentInputField);
@@ -17284,7 +17415,7 @@ var DynamicForm = ({
     }
   );
   const formBody = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(DynamicSheetKeyboard, { currentInputField }),
+    withSheetKeyboard && /* @__PURE__ */ jsxRuntime.jsx(DynamicSheetKeyboard, { currentInputField }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full grid grid-cols-1", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         FormFieldsGrid,
@@ -17308,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,