nextuiq/dist/index21.mjs

NextUIQ is a modern, lightweight, and developer-friendly UI component library for React and Next.js. Built with TypeScript and Tailwind CSS, it offers customizable, accessible, and performance-optimized components with built-in dark mode, theme customizat

import { j as jsxRuntimeExports } from './index46.mjs';
import React__default from 'react';

const Form = ({
  onSubmit,
  children,
  className = "",
  disabled = false,
  loading = false,
  autoComplete = "off",
  id,
  name,
  noValidate = false
}) => {
  const handleSubmit = (event) => {
    event.preventDefault();
    if (!disabled && !loading) {
      onSubmit(event);
    }
  };
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
    "form",
    {
      id,
      name,
      onSubmit: handleSubmit,
      className: `space-y-4 ${disabled || loading ? "opacity-70 pointer-events-none" : ""} ${className}`,
      autoComplete,
      noValidate,
      "aria-disabled": disabled || loading,
      children: [
        loading && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 bg-[oklch(var(--theme-background)/0.5)] flex items-center justify-center z-50", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-[oklch(var(--theme-primary))]" }) }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: loading ? "opacity-50" : "", children })
      ]
    }
  );
};
const MemoizedForm = React__default.memo(Form);

export { MemoizedForm as Form };