Form

import { defineConfig, getSchema, type VariantProps } from 'cva';
import { twMerge } from 'tailwind-merge';

export const { cva, cx: cn } = defineConfig({
  hooks: {
    onComplete: (className: string) => twMerge(className),
  },
});

export type { VariantProps };
export { getSchema };

import { Form as FormPrimitive } from '@base-ui/react/form';
import type * as React from 'react';
import { cn } from '@/lib/utils';

/**
 * A native form element with consolidated error handling.
 * Renders a `<form>` element.
 *
 * Documentation: [Caprice UI Form](https://caprice-ui.com/docs/components/form)
 *
 * API Reference: [Base UI Form](https://base-ui.com/react/components/form)
 */
export namespace Form {
  export type State = FormPrimitive.State;
  export type Props = React.ComponentProps<typeof FormPrimitive>;
  export type SubmitEventDetails = FormPrimitive.SubmitEventDetails;
  export type SubmitEventReason = FormPrimitive.SubmitEventReason;
  export type ValidationMode = FormPrimitive.ValidationMode;
  export type Values = FormPrimitive.Values;
}

export function Form({ className, ...props }: Form.Props) {
  return (
    <FormPrimitive
      className={cn('flex w-full flex-col gap-4', className)}
      data-slot="form"
      {...props}
    />
  );
}