shadcn-zod-formkit 1.25.0 → 1.26.0

package/dist/index.cjs

@@ -969,7 +969,54 @@ function Separator({
     }
   );
 }
-classVarianceAuthority.cva(
+function FieldSet({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "fieldset",
+    {
+      "data-slot": "field-set",
+      className: cn(
+        "flex flex-col gap-6",
+        "has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldLegend({
+  className,
+  variant = "legend",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "legend",
+    {
+      "data-slot": "field-legend",
+      "data-variant": variant,
+      className: cn(
+        "mb-3 font-medium",
+        "data-[variant=legend]:text-base",
+        "data-[variant=label]:text-sm",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "field-group",
+      className: cn(
+        "group/field-group @container/field-group flex w-full flex-col gap-7 data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var fieldVariants = classVarianceAuthority.cva(
   "group/field flex w-full gap-3 data-[invalid=true]:text-destructive",
   {
     variants: {
@@ -992,6 +1039,147 @@ classVarianceAuthority.cva(
     }
   }
 );
+function Field({
+  className,
+  orientation = "vertical",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: "group",
+      "data-slot": "field",
+      "data-orientation": orientation,
+      className: cn(fieldVariants({ orientation }), className),
+      ...props
+    }
+  );
+}
+function FieldContent({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "field-content",
+      className: cn(
+        "group/field-content flex flex-1 flex-col gap-1.5 leading-snug",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldLabel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Label,
+    {
+      "data-slot": "field-label",
+      className: cn(
+        "group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50",
+        "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4",
+        "has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "field-label",
+      className: cn(
+        "flex w-fit items-center gap-2 text-sm leading-snug font-medium group-data-[disabled=true]/field:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      "data-slot": "field-description",
+      className: cn(
+        "text-muted-foreground text-sm leading-normal font-normal group-has-[[data-orientation=horizontal]]/field:text-balance",
+        "last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5",
+        "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function FieldSeparator({
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "field-separator",
+      "data-content": !!children,
+      className: cn(
+        "relative -my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: "bg-background text-muted-foreground relative mx-auto block w-fit px-2",
+            "data-slot": "field-separator-content",
+            children
+          }
+        )
+      ]
+    }
+  );
+}
+function FieldError({
+  className,
+  children,
+  errors,
+  ...props
+}) {
+  const content = React3.useMemo(() => {
+    if (children) {
+      return children;
+    }
+    if (!errors?.length) {
+      return null;
+    }
+    const uniqueErrors = [
+      ...new Map(errors.map((error) => [error?.message, error])).values()
+    ];
+    if (uniqueErrors?.length == 1) {
+      return uniqueErrors[0]?.message;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
+      (error, index) => error?.message && /* @__PURE__ */ jsxRuntime.jsx("li", { children: error.message }, index)
+    ) });
+  }, [children, errors]);
+  if (!content) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: "alert",
+      "data-slot": "field-error",
+      className: cn("text-destructive text-sm font-normal", className),
+      ...props,
+      children: content
+    }
+  );
+}
 var Form = reactHookForm.FormProvider;
 var FormFieldContext = React3__namespace.createContext(
   {}
@@ -1183,7 +1371,7 @@ function InputGroupAddon({
     }
   );
 }
-classVarianceAuthority.cva(
+var inputGroupButtonVariants = classVarianceAuthority.cva(
   "text-sm shadow-none flex gap-2 items-center",
   {
     variants: {
@@ -1199,6 +1387,24 @@ classVarianceAuthority.cva(
     }
   }
 );
+function InputGroupButton({
+  className,
+  type = "button",
+  variant = "ghost",
+  size = "xs",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Button,
+    {
+      type,
+      "data-size": size,
+      variant,
+      className: cn(inputGroupButtonVariants({ size }), className),
+      ...props
+    }
+  );
+}
 function InputGroupText({ className, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
@@ -1227,6 +1433,22 @@ function InputGroupInput({
     }
   );
 }
+function InputGroupTextarea({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Textarea,
+    {
+      "data-slot": "input-group-control",
+      className: cn(
+        "flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent",
+        className
+      ),
+      ...props
+    }
+  );
+}
 function InputOTP({
   className,
   containerClassName,
@@ -1825,6 +2047,41 @@ function ButtonGroup({
     }
   );
 }
+function ButtonGroupText({
+  className,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? reactSlot.Slot : "div";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      className: cn(
+        "bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ButtonGroupSeparator({
+  className,
+  orientation = "vertical",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Separator,
+    {
+      "data-slot": "button-group-separator",
+      orientation,
+      className: cn(
+        "bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto",
+        className
+      ),
+      ...props
+    }
+  );
+}
 var ButtonGroupInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
@@ -1852,7 +2109,7 @@ var FieldButtonGroup = ({ input, form, isSubmitting, className = "w-full flex-1"
       disabled: isSubmitting,
       children: option.label ?? option.name
     },
-    key
+    `${input.name}-${key}-btn-g`
   )) });
 };
 var CheckListInput = class extends BaseInput {
@@ -2028,6 +2285,29 @@ function Command({
     }
   );
 }
+function CommandDialog({
+  title = "Command Palette",
+  description = "Search for a command to run...",
+  children,
+  className,
+  showCloseButton = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Dialog, { ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { className: "sr-only", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      DialogContent,
+      {
+        className: cn("overflow-hidden p-0", className),
+        showCloseButton,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Command, { className: "[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
+      }
+    )
+  ] });
+}
 function CommandInput({
   className,
   ...props
@@ -2098,6 +2378,19 @@ function CommandGroup({
     }
   );
 }
+function CommandSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    cmdk.Command.Separator,
+    {
+      "data-slot": "command-separator",
+      className: cn("bg-border -mx-1 h-px", className),
+      ...props
+    }
+  );
+}
 function CommandItem({
   className,
   ...props
@@ -2114,6 +2407,22 @@ function CommandItem({
     }
   );
 }
+function CommandShortcut({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "data-slot": "command-shortcut",
+      className: cn(
+        "text-muted-foreground ml-auto text-xs tracking-widest",
+        className
+      ),
+      ...props
+    }
+  );
+}
 var ComboboxInput = class extends BaseInput {
   render() {
     const { input, form, isSubmitting } = this;
@@ -4332,7 +4641,7 @@ var FieldMultiSelect = ({ form, input, isSubmitting }) => {
                     const option = lista.find(
                       (item) => getValue(item).toString() === val
                     );
-                    return /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: option?.name ?? val }, val);
+                    return /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: option?.name ?? val }, `${input.name}-${val}-ms`);
                   }) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: input.placeHolder ?? "Selecciona..." }),
                   /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronsUpDown, { className: "ml-2 h-4 w-4 opacity-50" })
                 ]
@@ -4365,7 +4674,7 @@ var FieldMultiSelect = ({ form, input, isSubmitting }) => {
                         item.name
                       ]
                     },
-                    value
+                    `${value}-ms`
                   );
                 }) })
               ] })
@@ -4903,7 +5212,7 @@ var FieldSelect = ({ form, input, isSubmitting }) => {
                   }
                 ) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { children: [
-                  lista.map((item) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: getValue(item), children: item.name }, item.id)),
+                  lista.map((item) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: getValue(item), children: item.name }, `${input.name}-${item.id}-s`)),
                   lista.length === 0 && !loading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2 text-sm text-muted-foreground", children: "No hay opciones disponibles" })
                 ] })
               ]
@@ -6085,9 +6394,126 @@ var InputList = ({ handleAddInput, inputsTypes }) => {
     );
   }) });
 };
+var GenericFilter = ({
+  filters = [],
+  pagination,
+  autoSubmit = false,
+  defaultValues = {},
+  initPage = 1,
+  initLimit = 10,
+  rangeLimit = [10, 25, 50, 100],
+  onChange,
+  withSearch = true,
+  withInitDate = true,
+  withEndDate = true,
+  withActive = true,
+  withLimit = true,
+  wrapInCard = true
+}) => {
+  const record = {
+    page: initPage,
+    limit: initLimit,
+    ...defaultValues
+  };
+  const [values, setValues] = React3.useState(record);
+  const isFirstRender = React3.useRef(true);
+  React3.useEffect(() => {
+    if (isFirstRender.current) {
+      isFirstRender.current = false;
+      return;
+    }
+  }, [values]);
+  const handleChange = (name, value) => {
+    setValues((prev) => ({ ...prev, [name]: value }));
+    if (autoSubmit && onChange) onChange({ ...values, [name]: value });
+  };
+  const baseFields = [
+    ...withSearch ? [
+      {
+        name: "search",
+        label: "Buscar",
+        inputType: "text_group" /* TEXT_GROUP */,
+        inputGroupConfig: { iconsLeft: [lucideReact.Search] },
+        onChange: (value) => handleChange("search", value)
+      }
+    ] : [],
+    ...withInitDate ? [
+      {
+        name: "initDate",
+        label: "Fecha de Inicio",
+        inputType: "date" /* DATE */,
+        onChange: (value) => handleChange("initDate", value)
+      }
+    ] : [],
+    ...withEndDate ? [
+      {
+        name: "endDate",
+        label: "Fecha Final",
+        inputType: "date" /* DATE */,
+        onChange: (value) => handleChange("endDate", value)
+      }
+    ] : [],
+    ...withActive ? [
+      {
+        wrapInCard: true,
+        name: "active",
+        label: "",
+        inputType: "button_group" /* BUTTON_GROUP */,
+        description: "Estado",
+        listConfig: {
+          list: [
+            { id: 1, name: "Activo", value: true },
+            { id: 2, name: "Inactivo", value: false },
+            { id: 3, name: "Todos", value: void 0 }
+          ],
+          onOptionChange: (item) => {
+            if (Array.isArray(item) && item[0]) handleChange("active", item[0].value);
+            else if (item && "value" in item) handleChange("active", item.value);
+          }
+        }
+      }
+    ] : [],
+    ...withLimit ? [
+      {
+        name: "limit",
+        label: "L\xEDmite por p\xE1gina",
+        inputType: "select" /* SELECT */,
+        listConfig: {
+          list: rangeLimit.map((num) => ({
+            value: String(num),
+            id: num,
+            name: String(num)
+          })),
+          onOptionChange: (item) => handleChange("limit", Number(item?.value ?? 10))
+        }
+      }
+    ] : []
+  ];
+  const fieldsConfig = [
+    ...filters,
+    baseFields
+  ];
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col md:flex-row md:items-end gap-4 py-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(
+    DynamicForm,
+    {
+      withCard: wrapInCard,
+      withSubmitBtn: !autoSubmit,
+      formTitle: "",
+      submitBtnLabel: "Buscar",
+      fields: fieldsConfig,
+      record: values,
+      showFormHeader: false,
+      onSubmit: ({ data }) => {
+        if (onChange && !autoSubmit) onChange(data);
+      }
+    }
+  ) }) });
+};
 
 exports.Accordion = Accordion;
 exports.AccordionContent = AccordionContent;
+exports.AccordionGroupedSwitchInput = AccordionGroupedSwitchInput;
+exports.AccordionGroupedSwitches = AccordionGroupedSwitches;
 exports.AccordionItem = AccordionItem;
 exports.AccordionTrigger = AccordionTrigger;
 exports.Alert = Alert;
@@ -6096,6 +6522,10 @@ exports.AlertTitle = AlertTitle;
 exports.Badge = Badge;
 exports.BaseInput = BaseInput;
 exports.Button = Button;
+exports.ButtonGroup = ButtonGroup;
+exports.ButtonGroupInput = ButtonGroupInput;
+exports.ButtonGroupSeparator = ButtonGroupSeparator;
+exports.ButtonGroupText = ButtonGroupText;
 exports.Calendar = Calendar;
 exports.CalendarDayButton = CalendarDayButton;
 exports.Card = Card;
@@ -6107,10 +6537,23 @@ exports.CardHeader = CardHeader;
 exports.CardTitle = CardTitle;
 exports.CheckListInput = CheckListInput;
 exports.Checkbox = Checkbox;
+exports.CheckboxInput = CheckboxInput;
 exports.ColorCnInput = ColorCnInput;
 exports.ColorInput = ColorInput;
+exports.ComboboxInput = ComboboxInput;
+exports.Command = Command;
+exports.CommandDialog = CommandDialog;
+exports.CommandEmpty = CommandEmpty;
+exports.CommandGroup = CommandGroup;
+exports.CommandInput = CommandInput;
+exports.CommandItem = CommandItem;
+exports.CommandList = CommandList;
+exports.CommandSeparator = CommandSeparator;
+exports.CommandShortcut = CommandShortcut;
+exports.CurrencyInput = CurrencyInput;
 exports.CustomAlert = CustomAlert;
 exports.DateInput = DateInput;
+exports.DateTimeInput = DateTimeInput;
 exports.Dialog = Dialog;
 exports.DialogClose = DialogClose;
 exports.DialogContent = DialogContent;
@@ -6123,32 +6566,69 @@ exports.DialogTitle = DialogTitle;
 exports.DialogTrigger = DialogTrigger;
 exports.DynamicForm = DynamicForm;
 exports.DynamicFormExample = DynamicFormExample;
+exports.Field = Field;
+exports.FieldButtonGroup = FieldButtonGroup;
+exports.FieldContent = FieldContent;
+exports.FieldCurrency = FieldCurrency;
+exports.FieldDateTimeInput = FieldDateTimeInput;
+exports.FieldDescription = FieldDescription;
+exports.FieldError = FieldError;
+exports.FieldFileMultiUpload = FieldFileMultiUpload;
+exports.FieldGroup = FieldGroup;
+exports.FieldKeyValueList = FieldKeyValueList;
+exports.FieldLabel = FieldLabel;
+exports.FieldLegend = FieldLegend;
+exports.FieldRepeater = FieldRepeater;
+exports.FieldSeparator = FieldSeparator;
+exports.FieldSet = FieldSet;
+exports.FieldSimpleCheckList = FieldSimpleCheckList;
+exports.FieldSlider = FieldSlider;
+exports.FieldStringValueList = FieldStringValueList;
+exports.FieldTextGroup = FieldTextGroup;
+exports.FieldTimeInput = FieldTimeInput;
+exports.FieldTitle = FieldTitle;
 exports.FileInput = FileInput;
+exports.FileMultiUploadInput = FileMultiUploadInput;
 exports.Form = Form;
 exports.FormControl = FormControl;
 exports.FormDescription = FormDescription;
 exports.FormErrorsAlert = FormErrorsAlert;
 exports.FormField = FormField;
+exports.FormFieldsGrid = FormFieldsGrid;
 exports.FormItem = FormItem;
 exports.FormLabel = FormLabel;
 exports.FormMessage = FormMessage;
+exports.GenericFilter = GenericFilter;
 exports.GroupedSwitchInput = GroupedSwitchInput;
 exports.GroupedSwitches = GroupedSwitches;
 exports.Input = Input;
 exports.InputFactory = InputFactory;
+exports.InputGroup = InputGroup;
+exports.InputGroupAddon = InputGroupAddon;
+exports.InputGroupButton = InputGroupButton;
+exports.InputGroupInput = InputGroupInput;
+exports.InputGroupText = InputGroupText;
+exports.InputGroupTextarea = InputGroupTextarea;
 exports.InputList = InputList;
 exports.InputOTP = InputOTP;
 exports.InputOTPGroup = InputOTPGroup;
 exports.InputOTPSeparator = InputOTPSeparator;
 exports.InputOTPSlot = InputOTPSlot;
 exports.InputTypes = InputTypes;
+exports.KeyValueListInput = KeyValueListInput;
 exports.Label = Label;
+exports.MultiSelectInput = MultiSelectInput;
 exports.NumberInput = NumberInput;
 exports.OTPInput = OTPInput2;
 exports.Popover = Popover;
 exports.PopoverAnchor = PopoverAnchor;
 exports.PopoverContent = PopoverContent;
 exports.PopoverTrigger = PopoverTrigger;
+exports.RadioGroup = RadioGroup;
+exports.RadioGroupInput = RadioGroupInput;
+exports.RadioGroupItem = RadioGroupItem;
+exports.RepeaterInput = RepeaterInput;
+exports.RepeaterTabsInput = RepeaterTabsInput;
 exports.ResizableHandle = ResizableHandle;
 exports.ResizablePanel = ResizablePanel;
 exports.ResizablePanelGroup = ResizablePanelGroup;
@@ -6166,18 +6646,31 @@ exports.SelectSeparator = SelectSeparator;
 exports.SelectTrigger = SelectTrigger;
 exports.SelectValue = SelectValue;
 exports.Separator = Separator;
+exports.SimpleCheckListInput = SimpleCheckListInput;
+exports.Slider = Slider;
+exports.SliderInput = SliderInput;
+exports.SortableListInput = SortableListInput;
+exports.StringValueListInput = StringValueListInput;
 exports.Switch = Switch;
 exports.SwitchInput = SwitchInput;
+exports.Tabs = Tabs;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;
+exports.TagInput = TagInput;
 exports.TextAreaInput = TextAreaInput;
 exports.TextInput = TextInput;
+exports.TextInputGroup = TextInputGroup;
 exports.TextInputType = TextInputType;
 exports.Textarea = Textarea;
+exports.TimeInput = TimeInput;
 exports.Toaster = Toaster;
 exports.Tooltip = Tooltip;
 exports.TooltipContent = TooltipContent;
 exports.TooltipProvider = TooltipProvider;
 exports.TooltipTrigger = TooltipTrigger;
 exports.badgeVariants = badgeVariants;
+exports.buttonGroupVariants = buttonGroupVariants;
 exports.buttonVariants = buttonVariants;
 exports.cn = cn;
 exports.entitiesToGroupedOption = entitiesToGroupedOption;