@aifeatures/react 0.1.4 → 0.1.6

package/dist/index.cjs

@@ -21,316 +21,64 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  AiFeaturesForm: () => AiFeaturesForm,
-  Controller: () => import_react_hook_form4.Controller,
-  FormActions: () => FormActions,
-  FormField: () => FormField,
-  FormStatus: () => FormStatus,
-  SubmitButton: () => SubmitButton,
-  useAiFeaturesForm: () => useAiFeaturesForm,
-  useFormContext: () => import_react_hook_form4.useFormContext
+  AifeaturesCaptcha: () => AifeaturesCaptcha
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/AiFeaturesForm.tsx
+// src/AifeaturesCaptcha.tsx
 var import_react = require("react");
-var import_react_hook_form = require("react-hook-form");
+var import_react_turnstile = require("@marsidev/react-turnstile");
 var import_jsx_runtime = require("react/jsx-runtime");
-var AIFEATURES_API_URL = "https://aifeatures.dev";
-var FormContext = (0, import_react.createContext)(null);
-function useAiFeaturesForm() {
-  const context = (0, import_react.useContext)(FormContext);
-  if (!context) {
-    throw new Error("useAiFeaturesForm must be used within an AiFeaturesForm");
-  }
-  return context;
-}
-function AiFeaturesForm({
+function AifeaturesCaptcha({
   formId,
-  onSuccess,
+  apiUrl = "https://aifeatures.dev",
+  onVerify,
   onError,
-  className,
-  children
+  className
 }) {
-  const [config, setConfig] = (0, import_react.useState)(null);
-  const [configError, setConfigError] = (0, import_react.useState)(null);
-  const [formState, setFormState] = (0, import_react.useState)({
-    isSubmitting: false,
-    isSuccess: false,
-    isError: false,
-    error: null
-  });
-  const form = (0, import_react_hook_form.useForm)();
+  const [sitekey, setSitekey] = (0, import_react.useState)(null);
+  const [token, setToken] = (0, import_react.useState)("");
+  const [isLoading, setIsLoading] = (0, import_react.useState)(true);
   (0, import_react.useEffect)(() => {
-    async function fetchConfig() {
-      try {
-        const response = await fetch(`${AIFEATURES_API_URL}/f/${formId}/config`);
-        if (!response.ok) {
-          throw new Error(`Failed to load form: ${response.status}`);
-        }
-        const data = await response.json();
-        setConfig(data);
-      } catch (err) {
-        const error = err instanceof Error ? err : new Error("Failed to load form config");
-        setConfigError(error);
-        onError?.(error);
-      }
-    }
-    fetchConfig();
-  }, [formId, onError]);
-  const onSubmit = async (data) => {
-    if (!config) return;
-    setFormState({
-      isSubmitting: true,
-      isSuccess: false,
-      isError: false,
-      error: null
+    setIsLoading(true);
+    fetch(`${apiUrl}/f/${formId}/config`).then((r) => r.json()).then((config) => {
+      setSitekey(config.turnstile_sitekey);
+      setIsLoading(false);
+    }).catch(() => {
+      setIsLoading(false);
     });
-    try {
-      const formData = new FormData();
-      for (const [key, value] of Object.entries(data)) {
-        if (value instanceof FileList) {
-          for (const file of Array.from(value)) {
-            formData.append(key, file);
-          }
-        } else if (value !== void 0 && value !== null) {
-          formData.append(key, String(value));
-        }
-      }
-      const response = await fetch(config.endpoint_url, {
-        method: "POST",
-        body: formData
-      });
-      if (!response.ok) {
-        const errorText = await response.text();
-        throw new Error(errorText || `Submission failed: ${response.status}`);
-      }
-      setFormState({
-        isSubmitting: false,
-        isSuccess: true,
-        isError: false,
-        error: null
-      });
-      form.reset();
-      if (typeof window !== "undefined" && window.turnstile) {
-        window.turnstile.reset();
-      }
-      onSuccess?.(data);
-    } catch (err) {
-      const error = err instanceof Error ? err : new Error("Form submission failed");
-      setFormState({
-        isSubmitting: false,
-        isSuccess: false,
-        isError: true,
-        error
-      });
-      onError?.(error);
-    }
+  }, [formId, apiUrl]);
+  const handleSuccess = (newToken) => {
+    setToken(newToken);
+    onVerify?.(newToken);
   };
-  if (!config && !configError) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className, children: "Loading form..." });
-  }
-  if (configError) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: "Failed to load form. Please try again later." }) });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormContext.Provider, { value: { formState, config }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_hook_form.FormProvider, { ...form, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { onSubmit: form.handleSubmit(onSubmit), className, children: [
-    children,
-    config?.turnstile_sitekey && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "input",
-      {
-        type: "hidden",
-        ...form.register("cf-turnstile-response", {
-          required: "Please complete the CAPTCHA verification"
-        })
-      }
-    )
-  ] }) }) });
-}
-
-// src/FormField.tsx
-var import_react_hook_form2 = require("react-hook-form");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-function FormField({
-  name,
-  label,
-  type = "text",
-  placeholder,
-  required = false,
-  className,
-  options,
-  accept,
-  multiple
-}) {
-  const { register, formState: { errors } } = (0, import_react_hook_form2.useFormContext)();
-  const error = errors[name];
-  const errorMessage = error?.message;
-  const inputClassName = className || "";
-  const registerOptions = {
-    required: required ? `${label || name} is required` : false
+  const handleError = () => {
+    setToken("");
+    onError?.();
   };
-  if (type === "textarea") {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { htmlFor: name, children: [
-        label,
-        required && " *"
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "textarea",
-        {
-          id: name,
-          placeholder,
-          className: inputClassName,
-          ...register(name, registerOptions)
-        }
-      ),
-      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: errorMessage })
-    ] });
-  }
-  if (type === "select" && options) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { htmlFor: name, children: [
-        label,
-        required && " *"
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-        "select",
-        {
-          id: name,
-          className: inputClassName,
-          ...register(name, registerOptions),
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: "", children: placeholder || "Select an option" }),
-            options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: option.value, children: option.label }, option.value))
-          ]
-        }
-      ),
-      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: errorMessage })
-    ] });
-  }
-  if (type === "file") {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { htmlFor: name, children: [
-        label,
-        required && " *"
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "input",
-        {
-          id: name,
-          type: "file",
-          accept,
-          multiple,
-          className: inputClassName,
-          ...register(name, registerOptions)
-        }
-      ),
-      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: errorMessage })
-    ] });
+  const handleExpire = () => {
+    setToken("");
+    onError?.();
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "hidden", name: "aifeatures-captcha-token", value: "" });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("label", { htmlFor: name, children: [
-      label,
-      required && " *"
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "input",
-      {
-        id: name,
-        type,
-        placeholder,
-        className: inputClassName,
-        ...register(name, registerOptions)
-      }
-    ),
-    errorMessage && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: errorMessage })
-  ] });
-}
-
-// src/FormActions.tsx
-var import_react2 = require("react");
-var import_react_hook_form3 = require("react-hook-form");
-var import_react_turnstile = require("@marsidev/react-turnstile");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-function FormActions({
-  children,
-  className,
-  turnstileClassName
-}) {
-  const { config } = useAiFeaturesForm();
-  const form = (0, import_react_hook_form3.useFormContext)();
-  const handleTurnstileSuccess = (0, import_react2.useCallback)((token) => {
-    form.setValue("cf-turnstile-response", token, { shouldValidate: true });
-  }, [form]);
-  const handleTurnstileError = (0, import_react2.useCallback)(() => {
-    form.setValue("cf-turnstile-response", "", { shouldValidate: true });
-  }, [form]);
-  const handleTurnstileExpire = (0, import_react2.useCallback)(() => {
-    form.setValue("cf-turnstile-response", "", { shouldValidate: true });
-  }, [form]);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className, children: [
-    config?.turnstile_sitekey && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: turnstileClassName, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "hidden", name: "aifeatures-captcha-token", value: token }),
+    sitekey && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_react_turnstile.Turnstile,
       {
-        siteKey: config.turnstile_sitekey,
-        onSuccess: handleTurnstileSuccess,
-        onError: handleTurnstileError,
-        onExpire: handleTurnstileExpire,
-        options: {
-          theme: "auto"
-        }
+        siteKey: sitekey,
+        onSuccess: handleSuccess,
+        onError: handleError,
+        onExpire: handleExpire,
+        options: { theme: "light" }
       }
-    ) }),
-    children
+    )
   ] });
 }
-
-// src/SubmitButton.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-function SubmitButton({
-  children,
-  loadingText = "Sending...",
-  className
-}) {
-  const { formState } = useAiFeaturesForm();
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "button",
-    {
-      type: "submit",
-      disabled: formState.isSubmitting,
-      className,
-      children: formState.isSubmitting ? loadingText : children
-    }
-  );
-}
-
-// src/FormStatus.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-function FormStatus({
-  successMessage = "Thank you! Your message has been sent.",
-  successClassName,
-  errorClassName
-}) {
-  const { formState } = useAiFeaturesForm();
-  if (formState.isSuccess) {
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: successClassName, children: successMessage });
-  }
-  if (formState.isError && formState.error) {
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: errorClassName, children: formState.error.message });
-  }
-  return null;
-}
-
-// src/index.ts
-var import_react_hook_form4 = require("react-hook-form");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  AiFeaturesForm,
-  Controller,
-  FormActions,
-  FormField,
-  FormStatus,
-  SubmitButton,
-  useAiFeaturesForm,
-  useFormContext
+  AifeaturesCaptcha
 });
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/AiFeaturesForm.tsx","../src/FormField.tsx","../src/FormActions.tsx","../src/SubmitButton.tsx","../src/FormStatus.tsx"],"sourcesContent":["// Components\nexport { AiFeaturesForm, useAiFeaturesForm } from './AiFeaturesForm'\nexport { FormField } from './FormField'\nexport { FormActions } from './FormActions'\nexport { SubmitButton } from './SubmitButton'\nexport { FormStatus } from './FormStatus'\n\n// Types\nexport type {\n  FormConfig,\n  AiFeaturesFormProps,\n  FormFieldProps,\n  SubmitButtonProps,\n  FormState,\n} from './types'\n\n// Re-export react-hook-form utilities for advanced usage\nexport { useFormContext, Controller } from 'react-hook-form'\n","import { useEffect, useState, createContext, useContext } from 'react'\nimport { useForm, FormProvider } from 'react-hook-form'\nimport type { FormConfig, AiFeaturesFormProps, FormState } from './types'\n\nconst AIFEATURES_API_URL = 'https://aifeatures.dev'\n\ninterface FormContextValue {\n  formState: FormState\n  config: FormConfig | null\n}\n\nconst FormContext = createContext<FormContextValue | null>(null)\n\nexport function useAiFeaturesForm() {\n  const context = useContext(FormContext)\n  if (!context) {\n    throw new Error('useAiFeaturesForm must be used within an AiFeaturesForm')\n  }\n  return context\n}\n\nexport function AiFeaturesForm({\n  formId,\n  onSuccess,\n  onError,\n  className,\n  children,\n}: AiFeaturesFormProps) {\n  const [config, setConfig] = useState<FormConfig | null>(null)\n  const [configError, setConfigError] = useState<Error | null>(null)\n  const [formState, setFormState] = useState<FormState>({\n    isSubmitting: false,\n    isSuccess: false,\n    isError: false,\n    error: null,\n  })\n\n  const form = useForm()\n\n  // Fetch form config on mount\n  useEffect(() => {\n    async function fetchConfig() {\n      try {\n        const response = await fetch(`${AIFEATURES_API_URL}/f/${formId}/config`)\n        if (!response.ok) {\n          throw new Error(`Failed to load form: ${response.status}`)\n        }\n        const data = await response.json()\n        setConfig(data)\n      } catch (err) {\n        const error = err instanceof Error ? err : new Error('Failed to load form config')\n        setConfigError(error)\n        onError?.(error)\n      }\n    }\n    fetchConfig()\n  }, [formId, onError])\n\n  const onSubmit = async (data: Record<string, unknown>) => {\n    if (!config) return\n\n    setFormState({\n      isSubmitting: true,\n      isSuccess: false,\n      isError: false,\n      error: null,\n    })\n\n    try {\n      const formData = new FormData()\n\n      for (const [key, value] of Object.entries(data)) {\n        if (value instanceof FileList) {\n          for (const file of Array.from(value)) {\n            formData.append(key, file)\n          }\n        } else if (value !== undefined && value !== null) {\n          formData.append(key, String(value))\n        }\n      }\n\n      const response = await fetch(config.endpoint_url, {\n        method: 'POST',\n        body: formData,\n      })\n\n      if (!response.ok) {\n        const errorText = await response.text()\n        throw new Error(errorText || `Submission failed: ${response.status}`)\n      }\n\n      setFormState({\n        isSubmitting: false,\n        isSuccess: true,\n        isError: false,\n        error: null,\n      })\n\n      form.reset()\n      // Reset Turnstile widget\n      if (typeof window !== 'undefined' && (window as unknown as { turnstile?: { reset: () => void } }).turnstile) {\n        (window as unknown as { turnstile: { reset: () => void } }).turnstile.reset()\n      }\n\n      onSuccess?.(data)\n    } catch (err) {\n      const error = err instanceof Error ? err : new Error('Form submission failed')\n      setFormState({\n        isSubmitting: false,\n        isSuccess: false,\n        isError: true,\n        error,\n      })\n      onError?.(error)\n    }\n  }\n\n  // Show loading state while fetching config\n  if (!config && !configError) {\n    return <div className={className}>Loading form...</div>\n  }\n\n  // Show error if config fetch failed\n  if (configError) {\n    return (\n      <div className={className}>\n        <p>Failed to load form. Please try again later.</p>\n      </div>\n    )\n  }\n\n  return (\n    <FormContext.Provider value={{ formState, config }}>\n      <FormProvider {...form}>\n        <form onSubmit={form.handleSubmit(onSubmit)} className={className}>\n          {children}\n\n          {/* Hidden field for Turnstile token - registered for validation */}\n          {/* The actual Turnstile widget is rendered by FormActions */}\n          {config?.turnstile_sitekey && (\n            <input\n              type=\"hidden\"\n              {...form.register('cf-turnstile-response', {\n                required: 'Please complete the CAPTCHA verification',\n              })}\n            />\n          )}\n        </form>\n      </FormProvider>\n    </FormContext.Provider>\n  )\n}\n","import { useFormContext } from 'react-hook-form'\nimport type { FormFieldProps } from './types'\n\nexport function FormField({\n  name,\n  label,\n  type = 'text',\n  placeholder,\n  required = false,\n  className,\n  options,\n  accept,\n  multiple,\n}: FormFieldProps) {\n  const { register, formState: { errors } } = useFormContext()\n\n  const error = errors[name]\n  const errorMessage = error?.message as string | undefined\n\n  const inputClassName = className || ''\n\n  const registerOptions = {\n    required: required ? `${label || name} is required` : false,\n  }\n\n  // Textarea\n  if (type === 'textarea') {\n    return (\n      <div>\n        {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n        <textarea\n          id={name}\n          placeholder={placeholder}\n          className={inputClassName}\n          {...register(name, registerOptions)}\n        />\n        {errorMessage && <span>{errorMessage}</span>}\n      </div>\n    )\n  }\n\n  // Select\n  if (type === 'select' && options) {\n    return (\n      <div>\n        {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n        <select\n          id={name}\n          className={inputClassName}\n          {...register(name, registerOptions)}\n        >\n          <option value=\"\">{placeholder || 'Select an option'}</option>\n          {options.map((option) => (\n            <option key={option.value} value={option.value}>\n              {option.label}\n            </option>\n          ))}\n        </select>\n        {errorMessage && <span>{errorMessage}</span>}\n      </div>\n    )\n  }\n\n  // File input\n  if (type === 'file') {\n    return (\n      <div>\n        {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n        <input\n          id={name}\n          type=\"file\"\n          accept={accept}\n          multiple={multiple}\n          className={inputClassName}\n          {...register(name, registerOptions)}\n        />\n        {errorMessage && <span>{errorMessage}</span>}\n      </div>\n    )\n  }\n\n  // Standard input (text, email, tel, url, number)\n  return (\n    <div>\n      {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n      <input\n        id={name}\n        type={type}\n        placeholder={placeholder}\n        className={inputClassName}\n        {...register(name, registerOptions)}\n      />\n      {errorMessage && <span>{errorMessage}</span>}\n    </div>\n  )\n}\n","import { useCallback } from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { Turnstile } from '@marsidev/react-turnstile'\nimport { useAiFeaturesForm } from './AiFeaturesForm'\n\ninterface FormActionsProps {\n  /** Children (typically SubmitButton) */\n  children: React.ReactNode\n  /** Custom class name for the container */\n  className?: string\n  /** Custom class name for the Turnstile container */\n  turnstileClassName?: string\n}\n\nexport function FormActions({\n  children,\n  className,\n  turnstileClassName,\n}: FormActionsProps) {\n  const { config } = useAiFeaturesForm()\n  const form = useFormContext()\n\n  const handleTurnstileSuccess = useCallback((token: string) => {\n    form.setValue('cf-turnstile-response', token, { shouldValidate: true })\n  }, [form])\n\n  const handleTurnstileError = useCallback(() => {\n    form.setValue('cf-turnstile-response', '', { shouldValidate: true })\n  }, [form])\n\n  const handleTurnstileExpire = useCallback(() => {\n    form.setValue('cf-turnstile-response', '', { shouldValidate: true })\n  }, [form])\n\n  return (\n    <div className={className}>\n      {/* Turnstile CAPTCHA - rendered above submit button */}\n      {config?.turnstile_sitekey && (\n        <div className={turnstileClassName}>\n          <Turnstile\n            siteKey={config.turnstile_sitekey}\n            onSuccess={handleTurnstileSuccess}\n            onError={handleTurnstileError}\n            onExpire={handleTurnstileExpire}\n            options={{\n              theme: 'auto',\n            }}\n          />\n        </div>\n      )}\n\n      {/* Submit button and any other actions */}\n      {children}\n    </div>\n  )\n}\n","import { useAiFeaturesForm } from './AiFeaturesForm'\nimport type { SubmitButtonProps } from './types'\n\nexport function SubmitButton({\n  children,\n  loadingText = 'Sending...',\n  className,\n}: SubmitButtonProps) {\n  const { formState } = useAiFeaturesForm()\n\n  return (\n    <button\n      type=\"submit\"\n      disabled={formState.isSubmitting}\n      className={className}\n    >\n      {formState.isSubmitting ? loadingText : children}\n    </button>\n  )\n}\n","import { useAiFeaturesForm } from './AiFeaturesForm'\n\ninterface FormStatusProps {\n  /** Message to show on success */\n  successMessage?: string\n  /** Custom class name for success state */\n  successClassName?: string\n  /** Custom class name for error state */\n  errorClassName?: string\n}\n\nexport function FormStatus({\n  successMessage = 'Thank you! Your message has been sent.',\n  successClassName,\n  errorClassName,\n}: FormStatusProps) {\n  const { formState } = useAiFeaturesForm()\n\n  if (formState.isSuccess) {\n    return (\n      <div className={successClassName}>\n        {successMessage}\n      </div>\n    )\n  }\n\n  if (formState.isError && formState.error) {\n    return (\n      <div className={errorClassName}>\n        {formState.error.message}\n      </div>\n    )\n  }\n\n  return null\n}\n"],"mappings":"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","names":["import_react_hook_form","import_jsx_runtime","import_react","import_react_hook_form","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_react_hook_form"]}
+{"version":3,"sources":["../src/index.ts","../src/AifeaturesCaptcha.tsx"],"sourcesContent":["export { AifeaturesCaptcha } from './AifeaturesCaptcha';\nexport type { AifeaturesCaptchaProps } from './AifeaturesCaptcha';\n","import { useState, useEffect } from 'react';\nimport { Turnstile } from '@marsidev/react-turnstile';\n\nexport interface AifeaturesCaptchaProps {\n  /** Form ID from aifeatures - used to fetch the Turnstile sitekey */\n  formId: string;\n  /** Base URL for the aifeatures API (defaults to https://aifeatures.dev) */\n  apiUrl?: string;\n  /** Called when CAPTCHA verification succeeds */\n  onVerify?: (token: string) => void;\n  /** Called when CAPTCHA verification fails or expires */\n  onError?: () => void;\n  /** Additional class name for the container */\n  className?: string;\n}\n\ninterface FormConfig {\n  id: string;\n  name: string;\n  endpoint_url: string;\n  turnstile_sitekey: string | null;\n}\n\n/**\n * A CAPTCHA component that handles Turnstile verification for aifeatures forms.\n *\n * Drop this into any form to add CAPTCHA protection. It renders:\n * - A hidden input field named \"cf-turnstile-response\" with the verification token\n * - The Turnstile widget (only if CAPTCHA is enabled for the form)\n *\n * @example\n * ```tsx\n * <form action={`https://aifeatures.dev/f/${formId}`} method=\"POST\">\n *   <input name=\"email\" type=\"email\" required />\n *   <textarea name=\"message\" />\n *   <AifeaturesCaptcha formId={formId} />\n *   <button type=\"submit\">Send</button>\n * </form>\n * ```\n */\nexport function AifeaturesCaptcha({\n  formId,\n  apiUrl = 'https://aifeatures.dev',\n  onVerify,\n  onError,\n  className,\n}: AifeaturesCaptchaProps) {\n  const [sitekey, setSitekey] = useState<string | null>(null);\n  const [token, setToken] = useState('');\n  const [isLoading, setIsLoading] = useState(true);\n\n  useEffect(() => {\n    setIsLoading(true);\n    fetch(`${apiUrl}/f/${formId}/config`)\n      .then((r) => r.json())\n      .then((config: FormConfig) => {\n        setSitekey(config.turnstile_sitekey);\n        setIsLoading(false);\n      })\n      .catch(() => {\n        setIsLoading(false);\n      });\n  }, [formId, apiUrl]);\n\n  const handleSuccess = (newToken: string) => {\n    setToken(newToken);\n    onVerify?.(newToken);\n  };\n\n  const handleError = () => {\n    setToken('');\n    onError?.();\n  };\n\n  const handleExpire = () => {\n    setToken('');\n    onError?.();\n  };\n\n  // Don't render anything while loading or if CAPTCHA is disabled\n  if (isLoading) {\n    return <input type=\"hidden\" name=\"aifeatures-captcha-token\" value=\"\" />;\n  }\n\n  return (\n    <div className={className}>\n      <input type=\"hidden\" name=\"aifeatures-captcha-token\" value={token} />\n      {sitekey && (\n        <Turnstile\n          siteKey={sitekey}\n          onSuccess={handleSuccess}\n          onError={handleError}\n          onExpire={handleExpire}\n          options={{ theme: 'light' }}\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAoC;AACpC,6BAA0B;AAgFf;AAzCJ,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AACF,GAA2B;AACzB,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAwB,IAAI;AAC1D,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAS,EAAE;AACrC,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,IAAI;AAE/C,8BAAU,MAAM;AACd,iBAAa,IAAI;AACjB,UAAM,GAAG,MAAM,MAAM,MAAM,SAAS,EACjC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,EACpB,KAAK,CAAC,WAAuB;AAC5B,iBAAW,OAAO,iBAAiB;AACnC,mBAAa,KAAK;AAAA,IACpB,CAAC,EACA,MAAM,MAAM;AACX,mBAAa,KAAK;AAAA,IACpB,CAAC;AAAA,EACL,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,gBAAgB,CAAC,aAAqB;AAC1C,aAAS,QAAQ;AACjB,eAAW,QAAQ;AAAA,EACrB;AAEA,QAAM,cAAc,MAAM;AACxB,aAAS,EAAE;AACX,cAAU;AAAA,EACZ;AAEA,QAAM,eAAe,MAAM;AACzB,aAAS,EAAE;AACX,cAAU;AAAA,EACZ;AAGA,MAAI,WAAW;AACb,WAAO,4CAAC,WAAM,MAAK,UAAS,MAAK,4BAA2B,OAAM,IAAG;AAAA,EACvE;AAEA,SACE,6CAAC,SAAI,WACH;AAAA,gDAAC,WAAM,MAAK,UAAS,MAAK,4BAA2B,OAAO,OAAO;AAAA,IAClE,WACC;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU;AAAA,QACV,SAAS,EAAE,OAAO,QAAQ;AAAA;AAAA,IAC5B;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/index.d.cts

@@ -1,91 +1,34 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-export { Controller, useFormContext } from 'react-hook-form';
 
-interface FormConfig {
-    id: string;
-    name: string;
-    endpoint_url: string;
-    turnstile_sitekey: string | null;
-}
-interface AiFeaturesFormProps {
-    /** Form ID from aifeatures.dev */
+interface AifeaturesCaptchaProps {
+    /** Form ID from aifeatures - used to fetch the Turnstile sitekey */
     formId: string;
-    /** Called on successful submission */
-    onSuccess?: (data: Record<string, unknown>) => void;
-    /** Called on submission error */
-    onError?: (error: Error) => void;
-    /** Custom class name for the form element */
-    className?: string;
-    /** Children (FormField, SubmitButton, etc.) */
-    children: React.ReactNode;
-}
-interface FormFieldProps {
-    /** Field name - used as the form data key */
-    name: string;
-    /** Field label */
-    label?: string;
-    /** Field type */
-    type?: 'text' | 'email' | 'tel' | 'url' | 'number' | 'textarea' | 'select' | 'file';
-    /** Placeholder text */
-    placeholder?: string;
-    /** Whether the field is required */
-    required?: boolean;
-    /** Custom class name */
-    className?: string;
-    /** Options for select fields */
-    options?: {
-        value: string;
-        label: string;
-    }[];
-    /** Accept attribute for file inputs */
-    accept?: string;
-    /** Multiple files allowed */
-    multiple?: boolean;
-}
-interface SubmitButtonProps {
-    /** Button text (or children) */
-    children: React.ReactNode;
-    /** Text to show while submitting */
-    loadingText?: string;
-    /** Custom class name */
+    /** Base URL for the aifeatures API (defaults to https://aifeatures.dev) */
+    apiUrl?: string;
+    /** Called when CAPTCHA verification succeeds */
+    onVerify?: (token: string) => void;
+    /** Called when CAPTCHA verification fails or expires */
+    onError?: () => void;
+    /** Additional class name for the container */
     className?: string;
 }
-interface FormState {
-    isSubmitting: boolean;
-    isSuccess: boolean;
-    isError: boolean;
-    error: Error | null;
-}
-
-interface FormContextValue {
-    formState: FormState;
-    config: FormConfig | null;
-}
-declare function useAiFeaturesForm(): FormContextValue;
-declare function AiFeaturesForm({ formId, onSuccess, onError, className, children, }: AiFeaturesFormProps): react_jsx_runtime.JSX.Element;
-
-declare function FormField({ name, label, type, placeholder, required, className, options, accept, multiple, }: FormFieldProps): react_jsx_runtime.JSX.Element;
-
-interface FormActionsProps {
-    /** Children (typically SubmitButton) */
-    children: React.ReactNode;
-    /** Custom class name for the container */
-    className?: string;
-    /** Custom class name for the Turnstile container */
-    turnstileClassName?: string;
-}
-declare function FormActions({ children, className, turnstileClassName, }: FormActionsProps): react_jsx_runtime.JSX.Element;
-
-declare function SubmitButton({ children, loadingText, className, }: SubmitButtonProps): react_jsx_runtime.JSX.Element;
-
-interface FormStatusProps {
-    /** Message to show on success */
-    successMessage?: string;
-    /** Custom class name for success state */
-    successClassName?: string;
-    /** Custom class name for error state */
-    errorClassName?: string;
-}
-declare function FormStatus({ successMessage, successClassName, errorClassName, }: FormStatusProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * A CAPTCHA component that handles Turnstile verification for aifeatures forms.
+ *
+ * Drop this into any form to add CAPTCHA protection. It renders:
+ * - A hidden input field named "cf-turnstile-response" with the verification token
+ * - The Turnstile widget (only if CAPTCHA is enabled for the form)
+ *
+ * @example
+ * ```tsx
+ * <form action={`https://aifeatures.dev/f/${formId}`} method="POST">
+ *   <input name="email" type="email" required />
+ *   <textarea name="message" />
+ *   <AifeaturesCaptcha formId={formId} />
+ *   <button type="submit">Send</button>
+ * </form>
+ * ```
+ */
+declare function AifeaturesCaptcha({ formId, apiUrl, onVerify, onError, className, }: AifeaturesCaptchaProps): react_jsx_runtime.JSX.Element;
 
-export { AiFeaturesForm, type AiFeaturesFormProps, FormActions, type FormConfig, FormField, type FormFieldProps, type FormState, FormStatus, SubmitButton, type SubmitButtonProps, useAiFeaturesForm };
+export { AifeaturesCaptcha, type AifeaturesCaptchaProps };

package/dist/index.d.ts

@@ -1,91 +1,34 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-export { Controller, useFormContext } from 'react-hook-form';
 
-interface FormConfig {
-    id: string;
-    name: string;
-    endpoint_url: string;
-    turnstile_sitekey: string | null;
-}
-interface AiFeaturesFormProps {
-    /** Form ID from aifeatures.dev */
+interface AifeaturesCaptchaProps {
+    /** Form ID from aifeatures - used to fetch the Turnstile sitekey */
     formId: string;
-    /** Called on successful submission */
-    onSuccess?: (data: Record<string, unknown>) => void;
-    /** Called on submission error */
-    onError?: (error: Error) => void;
-    /** Custom class name for the form element */
-    className?: string;
-    /** Children (FormField, SubmitButton, etc.) */
-    children: React.ReactNode;
-}
-interface FormFieldProps {
-    /** Field name - used as the form data key */
-    name: string;
-    /** Field label */
-    label?: string;
-    /** Field type */
-    type?: 'text' | 'email' | 'tel' | 'url' | 'number' | 'textarea' | 'select' | 'file';
-    /** Placeholder text */
-    placeholder?: string;
-    /** Whether the field is required */
-    required?: boolean;
-    /** Custom class name */
-    className?: string;
-    /** Options for select fields */
-    options?: {
-        value: string;
-        label: string;
-    }[];
-    /** Accept attribute for file inputs */
-    accept?: string;
-    /** Multiple files allowed */
-    multiple?: boolean;
-}
-interface SubmitButtonProps {
-    /** Button text (or children) */
-    children: React.ReactNode;
-    /** Text to show while submitting */
-    loadingText?: string;
-    /** Custom class name */
+    /** Base URL for the aifeatures API (defaults to https://aifeatures.dev) */
+    apiUrl?: string;
+    /** Called when CAPTCHA verification succeeds */
+    onVerify?: (token: string) => void;
+    /** Called when CAPTCHA verification fails or expires */
+    onError?: () => void;
+    /** Additional class name for the container */
     className?: string;
 }
-interface FormState {
-    isSubmitting: boolean;
-    isSuccess: boolean;
-    isError: boolean;
-    error: Error | null;
-}
-
-interface FormContextValue {
-    formState: FormState;
-    config: FormConfig | null;
-}
-declare function useAiFeaturesForm(): FormContextValue;
-declare function AiFeaturesForm({ formId, onSuccess, onError, className, children, }: AiFeaturesFormProps): react_jsx_runtime.JSX.Element;
-
-declare function FormField({ name, label, type, placeholder, required, className, options, accept, multiple, }: FormFieldProps): react_jsx_runtime.JSX.Element;
-
-interface FormActionsProps {
-    /** Children (typically SubmitButton) */
-    children: React.ReactNode;
-    /** Custom class name for the container */
-    className?: string;
-    /** Custom class name for the Turnstile container */
-    turnstileClassName?: string;
-}
-declare function FormActions({ children, className, turnstileClassName, }: FormActionsProps): react_jsx_runtime.JSX.Element;
-
-declare function SubmitButton({ children, loadingText, className, }: SubmitButtonProps): react_jsx_runtime.JSX.Element;
-
-interface FormStatusProps {
-    /** Message to show on success */
-    successMessage?: string;
-    /** Custom class name for success state */
-    successClassName?: string;
-    /** Custom class name for error state */
-    errorClassName?: string;
-}
-declare function FormStatus({ successMessage, successClassName, errorClassName, }: FormStatusProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * A CAPTCHA component that handles Turnstile verification for aifeatures forms.
+ *
+ * Drop this into any form to add CAPTCHA protection. It renders:
+ * - A hidden input field named "cf-turnstile-response" with the verification token
+ * - The Turnstile widget (only if CAPTCHA is enabled for the form)
+ *
+ * @example
+ * ```tsx
+ * <form action={`https://aifeatures.dev/f/${formId}`} method="POST">
+ *   <input name="email" type="email" required />
+ *   <textarea name="message" />
+ *   <AifeaturesCaptcha formId={formId} />
+ *   <button type="submit">Send</button>
+ * </form>
+ * ```
+ */
+declare function AifeaturesCaptcha({ formId, apiUrl, onVerify, onError, className, }: AifeaturesCaptchaProps): react_jsx_runtime.JSX.Element;
 
-export { AiFeaturesForm, type AiFeaturesFormProps, FormActions, type FormConfig, FormField, type FormFieldProps, type FormState, FormStatus, SubmitButton, type SubmitButtonProps, useAiFeaturesForm };
+export { AifeaturesCaptcha, type AifeaturesCaptchaProps };

package/dist/index.js

@@ -1,303 +1,58 @@
 "use client";
 
-// src/AiFeaturesForm.tsx
-import { useEffect, useState, createContext, useContext } from "react";
-import { useForm, FormProvider } from "react-hook-form";
+// src/AifeaturesCaptcha.tsx
+import { useState, useEffect } from "react";
+import { Turnstile } from "@marsidev/react-turnstile";
 import { jsx, jsxs } from "react/jsx-runtime";
-var AIFEATURES_API_URL = "https://aifeatures.dev";
-var FormContext = createContext(null);
-function useAiFeaturesForm() {
-  const context = useContext(FormContext);
-  if (!context) {
-    throw new Error("useAiFeaturesForm must be used within an AiFeaturesForm");
-  }
-  return context;
-}
-function AiFeaturesForm({
+function AifeaturesCaptcha({
   formId,
-  onSuccess,
+  apiUrl = "https://aifeatures.dev",
+  onVerify,
   onError,
-  className,
-  children
+  className
 }) {
-  const [config, setConfig] = useState(null);
-  const [configError, setConfigError] = useState(null);
-  const [formState, setFormState] = useState({
-    isSubmitting: false,
-    isSuccess: false,
-    isError: false,
-    error: null
-  });
-  const form = useForm();
+  const [sitekey, setSitekey] = useState(null);
+  const [token, setToken] = useState("");
+  const [isLoading, setIsLoading] = useState(true);
   useEffect(() => {
-    async function fetchConfig() {
-      try {
-        const response = await fetch(`${AIFEATURES_API_URL}/f/${formId}/config`);
-        if (!response.ok) {
-          throw new Error(`Failed to load form: ${response.status}`);
-        }
-        const data = await response.json();
-        setConfig(data);
-      } catch (err) {
-        const error = err instanceof Error ? err : new Error("Failed to load form config");
-        setConfigError(error);
-        onError?.(error);
-      }
-    }
-    fetchConfig();
-  }, [formId, onError]);
-  const onSubmit = async (data) => {
-    if (!config) return;
-    setFormState({
-      isSubmitting: true,
-      isSuccess: false,
-      isError: false,
-      error: null
+    setIsLoading(true);
+    fetch(`${apiUrl}/f/${formId}/config`).then((r) => r.json()).then((config) => {
+      setSitekey(config.turnstile_sitekey);
+      setIsLoading(false);
+    }).catch(() => {
+      setIsLoading(false);
     });
-    try {
-      const formData = new FormData();
-      for (const [key, value] of Object.entries(data)) {
-        if (value instanceof FileList) {
-          for (const file of Array.from(value)) {
-            formData.append(key, file);
-          }
-        } else if (value !== void 0 && value !== null) {
-          formData.append(key, String(value));
-        }
-      }
-      const response = await fetch(config.endpoint_url, {
-        method: "POST",
-        body: formData
-      });
-      if (!response.ok) {
-        const errorText = await response.text();
-        throw new Error(errorText || `Submission failed: ${response.status}`);
-      }
-      setFormState({
-        isSubmitting: false,
-        isSuccess: true,
-        isError: false,
-        error: null
-      });
-      form.reset();
-      if (typeof window !== "undefined" && window.turnstile) {
-        window.turnstile.reset();
-      }
-      onSuccess?.(data);
-    } catch (err) {
-      const error = err instanceof Error ? err : new Error("Form submission failed");
-      setFormState({
-        isSubmitting: false,
-        isSuccess: false,
-        isError: true,
-        error
-      });
-      onError?.(error);
-    }
+  }, [formId, apiUrl]);
+  const handleSuccess = (newToken) => {
+    setToken(newToken);
+    onVerify?.(newToken);
   };
-  if (!config && !configError) {
-    return /* @__PURE__ */ jsx("div", { className, children: "Loading form..." });
-  }
-  if (configError) {
-    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx("p", { children: "Failed to load form. Please try again later." }) });
-  }
-  return /* @__PURE__ */ jsx(FormContext.Provider, { value: { formState, config }, children: /* @__PURE__ */ jsx(FormProvider, { ...form, children: /* @__PURE__ */ jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className, children: [
-    children,
-    config?.turnstile_sitekey && /* @__PURE__ */ jsx(
-      "input",
-      {
-        type: "hidden",
-        ...form.register("cf-turnstile-response", {
-          required: "Please complete the CAPTCHA verification"
-        })
-      }
-    )
-  ] }) }) });
-}
-
-// src/FormField.tsx
-import { useFormContext } from "react-hook-form";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function FormField({
-  name,
-  label,
-  type = "text",
-  placeholder,
-  required = false,
-  className,
-  options,
-  accept,
-  multiple
-}) {
-  const { register, formState: { errors } } = useFormContext();
-  const error = errors[name];
-  const errorMessage = error?.message;
-  const inputClassName = className || "";
-  const registerOptions = {
-    required: required ? `${label || name} is required` : false
+  const handleError = () => {
+    setToken("");
+    onError?.();
   };
-  if (type === "textarea") {
-    return /* @__PURE__ */ jsxs2("div", { children: [
-      label && /* @__PURE__ */ jsxs2("label", { htmlFor: name, children: [
-        label,
-        required && " *"
-      ] }),
-      /* @__PURE__ */ jsx2(
-        "textarea",
-        {
-          id: name,
-          placeholder,
-          className: inputClassName,
-          ...register(name, registerOptions)
-        }
-      ),
-      errorMessage && /* @__PURE__ */ jsx2("span", { children: errorMessage })
-    ] });
-  }
-  if (type === "select" && options) {
-    return /* @__PURE__ */ jsxs2("div", { children: [
-      label && /* @__PURE__ */ jsxs2("label", { htmlFor: name, children: [
-        label,
-        required && " *"
-      ] }),
-      /* @__PURE__ */ jsxs2(
-        "select",
-        {
-          id: name,
-          className: inputClassName,
-          ...register(name, registerOptions),
-          children: [
-            /* @__PURE__ */ jsx2("option", { value: "", children: placeholder || "Select an option" }),
-            options.map((option) => /* @__PURE__ */ jsx2("option", { value: option.value, children: option.label }, option.value))
-          ]
-        }
-      ),
-      errorMessage && /* @__PURE__ */ jsx2("span", { children: errorMessage })
-    ] });
-  }
-  if (type === "file") {
-    return /* @__PURE__ */ jsxs2("div", { children: [
-      label && /* @__PURE__ */ jsxs2("label", { htmlFor: name, children: [
-        label,
-        required && " *"
-      ] }),
-      /* @__PURE__ */ jsx2(
-        "input",
-        {
-          id: name,
-          type: "file",
-          accept,
-          multiple,
-          className: inputClassName,
-          ...register(name, registerOptions)
-        }
-      ),
-      errorMessage && /* @__PURE__ */ jsx2("span", { children: errorMessage })
-    ] });
+  const handleExpire = () => {
+    setToken("");
+    onError?.();
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsx("input", { type: "hidden", name: "aifeatures-captcha-token", value: "" });
   }
-  return /* @__PURE__ */ jsxs2("div", { children: [
-    label && /* @__PURE__ */ jsxs2("label", { htmlFor: name, children: [
-      label,
-      required && " *"
-    ] }),
-    /* @__PURE__ */ jsx2(
-      "input",
-      {
-        id: name,
-        type,
-        placeholder,
-        className: inputClassName,
-        ...register(name, registerOptions)
-      }
-    ),
-    errorMessage && /* @__PURE__ */ jsx2("span", { children: errorMessage })
-  ] });
-}
-
-// src/FormActions.tsx
-import { useCallback } from "react";
-import { useFormContext as useFormContext2 } from "react-hook-form";
-import { Turnstile } from "@marsidev/react-turnstile";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function FormActions({
-  children,
-  className,
-  turnstileClassName
-}) {
-  const { config } = useAiFeaturesForm();
-  const form = useFormContext2();
-  const handleTurnstileSuccess = useCallback((token) => {
-    form.setValue("cf-turnstile-response", token, { shouldValidate: true });
-  }, [form]);
-  const handleTurnstileError = useCallback(() => {
-    form.setValue("cf-turnstile-response", "", { shouldValidate: true });
-  }, [form]);
-  const handleTurnstileExpire = useCallback(() => {
-    form.setValue("cf-turnstile-response", "", { shouldValidate: true });
-  }, [form]);
-  return /* @__PURE__ */ jsxs3("div", { className, children: [
-    config?.turnstile_sitekey && /* @__PURE__ */ jsx3("div", { className: turnstileClassName, children: /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsx("input", { type: "hidden", name: "aifeatures-captcha-token", value: token }),
+    sitekey && /* @__PURE__ */ jsx(
       Turnstile,
       {
-        siteKey: config.turnstile_sitekey,
-        onSuccess: handleTurnstileSuccess,
-        onError: handleTurnstileError,
-        onExpire: handleTurnstileExpire,
-        options: {
-          theme: "auto"
-        }
+        siteKey: sitekey,
+        onSuccess: handleSuccess,
+        onError: handleError,
+        onExpire: handleExpire,
+        options: { theme: "light" }
       }
-    ) }),
-    children
+    )
   ] });
 }
-
-// src/SubmitButton.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
-function SubmitButton({
-  children,
-  loadingText = "Sending...",
-  className
-}) {
-  const { formState } = useAiFeaturesForm();
-  return /* @__PURE__ */ jsx4(
-    "button",
-    {
-      type: "submit",
-      disabled: formState.isSubmitting,
-      className,
-      children: formState.isSubmitting ? loadingText : children
-    }
-  );
-}
-
-// src/FormStatus.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
-function FormStatus({
-  successMessage = "Thank you! Your message has been sent.",
-  successClassName,
-  errorClassName
-}) {
-  const { formState } = useAiFeaturesForm();
-  if (formState.isSuccess) {
-    return /* @__PURE__ */ jsx5("div", { className: successClassName, children: successMessage });
-  }
-  if (formState.isError && formState.error) {
-    return /* @__PURE__ */ jsx5("div", { className: errorClassName, children: formState.error.message });
-  }
-  return null;
-}
-
-// src/index.ts
-import { useFormContext as useFormContext3, Controller } from "react-hook-form";
 export {
-  AiFeaturesForm,
-  Controller,
-  FormActions,
-  FormField,
-  FormStatus,
-  SubmitButton,
-  useAiFeaturesForm,
-  useFormContext3 as useFormContext
+  AifeaturesCaptcha
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/AiFeaturesForm.tsx","../src/FormField.tsx","../src/FormActions.tsx","../src/SubmitButton.tsx","../src/FormStatus.tsx","../src/index.ts"],"sourcesContent":["import { useEffect, useState, createContext, useContext } from 'react'\nimport { useForm, FormProvider } from 'react-hook-form'\nimport type { FormConfig, AiFeaturesFormProps, FormState } from './types'\n\nconst AIFEATURES_API_URL = 'https://aifeatures.dev'\n\ninterface FormContextValue {\n  formState: FormState\n  config: FormConfig | null\n}\n\nconst FormContext = createContext<FormContextValue | null>(null)\n\nexport function useAiFeaturesForm() {\n  const context = useContext(FormContext)\n  if (!context) {\n    throw new Error('useAiFeaturesForm must be used within an AiFeaturesForm')\n  }\n  return context\n}\n\nexport function AiFeaturesForm({\n  formId,\n  onSuccess,\n  onError,\n  className,\n  children,\n}: AiFeaturesFormProps) {\n  const [config, setConfig] = useState<FormConfig | null>(null)\n  const [configError, setConfigError] = useState<Error | null>(null)\n  const [formState, setFormState] = useState<FormState>({\n    isSubmitting: false,\n    isSuccess: false,\n    isError: false,\n    error: null,\n  })\n\n  const form = useForm()\n\n  // Fetch form config on mount\n  useEffect(() => {\n    async function fetchConfig() {\n      try {\n        const response = await fetch(`${AIFEATURES_API_URL}/f/${formId}/config`)\n        if (!response.ok) {\n          throw new Error(`Failed to load form: ${response.status}`)\n        }\n        const data = await response.json()\n        setConfig(data)\n      } catch (err) {\n        const error = err instanceof Error ? err : new Error('Failed to load form config')\n        setConfigError(error)\n        onError?.(error)\n      }\n    }\n    fetchConfig()\n  }, [formId, onError])\n\n  const onSubmit = async (data: Record<string, unknown>) => {\n    if (!config) return\n\n    setFormState({\n      isSubmitting: true,\n      isSuccess: false,\n      isError: false,\n      error: null,\n    })\n\n    try {\n      const formData = new FormData()\n\n      for (const [key, value] of Object.entries(data)) {\n        if (value instanceof FileList) {\n          for (const file of Array.from(value)) {\n            formData.append(key, file)\n          }\n        } else if (value !== undefined && value !== null) {\n          formData.append(key, String(value))\n        }\n      }\n\n      const response = await fetch(config.endpoint_url, {\n        method: 'POST',\n        body: formData,\n      })\n\n      if (!response.ok) {\n        const errorText = await response.text()\n        throw new Error(errorText || `Submission failed: ${response.status}`)\n      }\n\n      setFormState({\n        isSubmitting: false,\n        isSuccess: true,\n        isError: false,\n        error: null,\n      })\n\n      form.reset()\n      // Reset Turnstile widget\n      if (typeof window !== 'undefined' && (window as unknown as { turnstile?: { reset: () => void } }).turnstile) {\n        (window as unknown as { turnstile: { reset: () => void } }).turnstile.reset()\n      }\n\n      onSuccess?.(data)\n    } catch (err) {\n      const error = err instanceof Error ? err : new Error('Form submission failed')\n      setFormState({\n        isSubmitting: false,\n        isSuccess: false,\n        isError: true,\n        error,\n      })\n      onError?.(error)\n    }\n  }\n\n  // Show loading state while fetching config\n  if (!config && !configError) {\n    return <div className={className}>Loading form...</div>\n  }\n\n  // Show error if config fetch failed\n  if (configError) {\n    return (\n      <div className={className}>\n        <p>Failed to load form. Please try again later.</p>\n      </div>\n    )\n  }\n\n  return (\n    <FormContext.Provider value={{ formState, config }}>\n      <FormProvider {...form}>\n        <form onSubmit={form.handleSubmit(onSubmit)} className={className}>\n          {children}\n\n          {/* Hidden field for Turnstile token - registered for validation */}\n          {/* The actual Turnstile widget is rendered by FormActions */}\n          {config?.turnstile_sitekey && (\n            <input\n              type=\"hidden\"\n              {...form.register('cf-turnstile-response', {\n                required: 'Please complete the CAPTCHA verification',\n              })}\n            />\n          )}\n        </form>\n      </FormProvider>\n    </FormContext.Provider>\n  )\n}\n","import { useFormContext } from 'react-hook-form'\nimport type { FormFieldProps } from './types'\n\nexport function FormField({\n  name,\n  label,\n  type = 'text',\n  placeholder,\n  required = false,\n  className,\n  options,\n  accept,\n  multiple,\n}: FormFieldProps) {\n  const { register, formState: { errors } } = useFormContext()\n\n  const error = errors[name]\n  const errorMessage = error?.message as string | undefined\n\n  const inputClassName = className || ''\n\n  const registerOptions = {\n    required: required ? `${label || name} is required` : false,\n  }\n\n  // Textarea\n  if (type === 'textarea') {\n    return (\n      <div>\n        {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n        <textarea\n          id={name}\n          placeholder={placeholder}\n          className={inputClassName}\n          {...register(name, registerOptions)}\n        />\n        {errorMessage && <span>{errorMessage}</span>}\n      </div>\n    )\n  }\n\n  // Select\n  if (type === 'select' && options) {\n    return (\n      <div>\n        {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n        <select\n          id={name}\n          className={inputClassName}\n          {...register(name, registerOptions)}\n        >\n          <option value=\"\">{placeholder || 'Select an option'}</option>\n          {options.map((option) => (\n            <option key={option.value} value={option.value}>\n              {option.label}\n            </option>\n          ))}\n        </select>\n        {errorMessage && <span>{errorMessage}</span>}\n      </div>\n    )\n  }\n\n  // File input\n  if (type === 'file') {\n    return (\n      <div>\n        {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n        <input\n          id={name}\n          type=\"file\"\n          accept={accept}\n          multiple={multiple}\n          className={inputClassName}\n          {...register(name, registerOptions)}\n        />\n        {errorMessage && <span>{errorMessage}</span>}\n      </div>\n    )\n  }\n\n  // Standard input (text, email, tel, url, number)\n  return (\n    <div>\n      {label && <label htmlFor={name}>{label}{required && ' *'}</label>}\n      <input\n        id={name}\n        type={type}\n        placeholder={placeholder}\n        className={inputClassName}\n        {...register(name, registerOptions)}\n      />\n      {errorMessage && <span>{errorMessage}</span>}\n    </div>\n  )\n}\n","import { useCallback } from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { Turnstile } from '@marsidev/react-turnstile'\nimport { useAiFeaturesForm } from './AiFeaturesForm'\n\ninterface FormActionsProps {\n  /** Children (typically SubmitButton) */\n  children: React.ReactNode\n  /** Custom class name for the container */\n  className?: string\n  /** Custom class name for the Turnstile container */\n  turnstileClassName?: string\n}\n\nexport function FormActions({\n  children,\n  className,\n  turnstileClassName,\n}: FormActionsProps) {\n  const { config } = useAiFeaturesForm()\n  const form = useFormContext()\n\n  const handleTurnstileSuccess = useCallback((token: string) => {\n    form.setValue('cf-turnstile-response', token, { shouldValidate: true })\n  }, [form])\n\n  const handleTurnstileError = useCallback(() => {\n    form.setValue('cf-turnstile-response', '', { shouldValidate: true })\n  }, [form])\n\n  const handleTurnstileExpire = useCallback(() => {\n    form.setValue('cf-turnstile-response', '', { shouldValidate: true })\n  }, [form])\n\n  return (\n    <div className={className}>\n      {/* Turnstile CAPTCHA - rendered above submit button */}\n      {config?.turnstile_sitekey && (\n        <div className={turnstileClassName}>\n          <Turnstile\n            siteKey={config.turnstile_sitekey}\n            onSuccess={handleTurnstileSuccess}\n            onError={handleTurnstileError}\n            onExpire={handleTurnstileExpire}\n            options={{\n              theme: 'auto',\n            }}\n          />\n        </div>\n      )}\n\n      {/* Submit button and any other actions */}\n      {children}\n    </div>\n  )\n}\n","import { useAiFeaturesForm } from './AiFeaturesForm'\nimport type { SubmitButtonProps } from './types'\n\nexport function SubmitButton({\n  children,\n  loadingText = 'Sending...',\n  className,\n}: SubmitButtonProps) {\n  const { formState } = useAiFeaturesForm()\n\n  return (\n    <button\n      type=\"submit\"\n      disabled={formState.isSubmitting}\n      className={className}\n    >\n      {formState.isSubmitting ? loadingText : children}\n    </button>\n  )\n}\n","import { useAiFeaturesForm } from './AiFeaturesForm'\n\ninterface FormStatusProps {\n  /** Message to show on success */\n  successMessage?: string\n  /** Custom class name for success state */\n  successClassName?: string\n  /** Custom class name for error state */\n  errorClassName?: string\n}\n\nexport function FormStatus({\n  successMessage = 'Thank you! Your message has been sent.',\n  successClassName,\n  errorClassName,\n}: FormStatusProps) {\n  const { formState } = useAiFeaturesForm()\n\n  if (formState.isSuccess) {\n    return (\n      <div className={successClassName}>\n        {successMessage}\n      </div>\n    )\n  }\n\n  if (formState.isError && formState.error) {\n    return (\n      <div className={errorClassName}>\n        {formState.error.message}\n      </div>\n    )\n  }\n\n  return null\n}\n","// Components\nexport { AiFeaturesForm, useAiFeaturesForm } from './AiFeaturesForm'\nexport { FormField } from './FormField'\nexport { FormActions } from './FormActions'\nexport { SubmitButton } from './SubmitButton'\nexport { FormStatus } from './FormStatus'\n\n// Types\nexport type {\n  FormConfig,\n  AiFeaturesFormProps,\n  FormFieldProps,\n  SubmitButtonProps,\n  FormState,\n} from './types'\n\n// Re-export react-hook-form utilities for advanced usage\nexport { useFormContext, Controller } from 'react-hook-form'\n"],"mappings":"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","names":["jsx","jsxs","useFormContext","jsx","jsxs","useFormContext","jsx","jsx","useFormContext"]}
+{"version":3,"sources":["../src/AifeaturesCaptcha.tsx"],"sourcesContent":["import { useState, useEffect } from 'react';\nimport { Turnstile } from '@marsidev/react-turnstile';\n\nexport interface AifeaturesCaptchaProps {\n  /** Form ID from aifeatures - used to fetch the Turnstile sitekey */\n  formId: string;\n  /** Base URL for the aifeatures API (defaults to https://aifeatures.dev) */\n  apiUrl?: string;\n  /** Called when CAPTCHA verification succeeds */\n  onVerify?: (token: string) => void;\n  /** Called when CAPTCHA verification fails or expires */\n  onError?: () => void;\n  /** Additional class name for the container */\n  className?: string;\n}\n\ninterface FormConfig {\n  id: string;\n  name: string;\n  endpoint_url: string;\n  turnstile_sitekey: string | null;\n}\n\n/**\n * A CAPTCHA component that handles Turnstile verification for aifeatures forms.\n *\n * Drop this into any form to add CAPTCHA protection. It renders:\n * - A hidden input field named \"cf-turnstile-response\" with the verification token\n * - The Turnstile widget (only if CAPTCHA is enabled for the form)\n *\n * @example\n * ```tsx\n * <form action={`https://aifeatures.dev/f/${formId}`} method=\"POST\">\n *   <input name=\"email\" type=\"email\" required />\n *   <textarea name=\"message\" />\n *   <AifeaturesCaptcha formId={formId} />\n *   <button type=\"submit\">Send</button>\n * </form>\n * ```\n */\nexport function AifeaturesCaptcha({\n  formId,\n  apiUrl = 'https://aifeatures.dev',\n  onVerify,\n  onError,\n  className,\n}: AifeaturesCaptchaProps) {\n  const [sitekey, setSitekey] = useState<string | null>(null);\n  const [token, setToken] = useState('');\n  const [isLoading, setIsLoading] = useState(true);\n\n  useEffect(() => {\n    setIsLoading(true);\n    fetch(`${apiUrl}/f/${formId}/config`)\n      .then((r) => r.json())\n      .then((config: FormConfig) => {\n        setSitekey(config.turnstile_sitekey);\n        setIsLoading(false);\n      })\n      .catch(() => {\n        setIsLoading(false);\n      });\n  }, [formId, apiUrl]);\n\n  const handleSuccess = (newToken: string) => {\n    setToken(newToken);\n    onVerify?.(newToken);\n  };\n\n  const handleError = () => {\n    setToken('');\n    onError?.();\n  };\n\n  const handleExpire = () => {\n    setToken('');\n    onError?.();\n  };\n\n  // Don't render anything while loading or if CAPTCHA is disabled\n  if (isLoading) {\n    return <input type=\"hidden\" name=\"aifeatures-captcha-token\" value=\"\" />;\n  }\n\n  return (\n    <div className={className}>\n      <input type=\"hidden\" name=\"aifeatures-captcha-token\" value={token} />\n      {sitekey && (\n        <Turnstile\n          siteKey={sitekey}\n          onSuccess={handleSuccess}\n          onError={handleError}\n          onExpire={handleExpire}\n          options={{ theme: 'light' }}\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;AAAA,SAAS,UAAU,iBAAiB;AACpC,SAAS,iBAAiB;AAgFf,cAIP,YAJO;AAzCJ,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AACF,GAA2B;AACzB,QAAM,CAAC,SAAS,UAAU,IAAI,SAAwB,IAAI;AAC1D,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,IAAI;AAE/C,YAAU,MAAM;AACd,iBAAa,IAAI;AACjB,UAAM,GAAG,MAAM,MAAM,MAAM,SAAS,EACjC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,EACpB,KAAK,CAAC,WAAuB;AAC5B,iBAAW,OAAO,iBAAiB;AACnC,mBAAa,KAAK;AAAA,IACpB,CAAC,EACA,MAAM,MAAM;AACX,mBAAa,KAAK;AAAA,IACpB,CAAC;AAAA,EACL,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,gBAAgB,CAAC,aAAqB;AAC1C,aAAS,QAAQ;AACjB,eAAW,QAAQ;AAAA,EACrB;AAEA,QAAM,cAAc,MAAM;AACxB,aAAS,EAAE;AACX,cAAU;AAAA,EACZ;AAEA,QAAM,eAAe,MAAM;AACzB,aAAS,EAAE;AACX,cAAU;AAAA,EACZ;AAGA,MAAI,WAAW;AACb,WAAO,oBAAC,WAAM,MAAK,UAAS,MAAK,4BAA2B,OAAM,IAAG;AAAA,EACvE;AAEA,SACE,qBAAC,SAAI,WACH;AAAA,wBAAC,WAAM,MAAK,UAAS,MAAK,4BAA2B,OAAO,OAAO;AAAA,IAClE,WACC;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU;AAAA,QACV,SAAS,EAAE,OAAO,QAAQ;AAAA;AAAA,IAC5B;AAAA,KAEJ;AAEJ;","names":[]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aifeatures/react",
-  "version": "0.1.4",
-  "description": "React components for aifeatures forms with built-in Turnstile CAPTCHA",
+  "version": "0.1.6",
+  "description": "React CAPTCHA component for aifeatures forms using Cloudflare Turnstile",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -26,8 +26,7 @@
     "react-dom": ">=18"
   },
   "dependencies": {
-    "@marsidev/react-turnstile": "^1.1.0",
-    "react-hook-form": "^7.54.2"
+    "@marsidev/react-turnstile": "^1.1.0"
   },
   "devDependencies": {
     "@storybook/addon-essentials": "^8.4.2",