@aifeatures/admin-react 0.1.0

package/dist/index.js

@@ -0,0 +1,1304 @@
+"use client";
+
+// src/provider/AifeaturesProvider.tsx
+import * as React from "react";
+
+// src/lib/api.ts
+var AifeaturesApiError = class extends Error {
+  constructor(message, status, details) {
+    super(message);
+    this.status = status;
+    this.details = details;
+    this.name = "AifeaturesApiError";
+  }
+};
+function createApiClient(siteToken, apiUrl = "https://aifeatures.dev") {
+  async function request(path, options = {}) {
+    const url = `${apiUrl}${path}`;
+    const response = await fetch(url, {
+      ...options,
+      headers: {
+        "Authorization": `Bearer ${siteToken}`,
+        "Content-Type": "application/json",
+        ...options.headers
+      }
+    });
+    if (!response.ok) {
+      let details;
+      try {
+        details = await response.json();
+      } catch {
+      }
+      throw new AifeaturesApiError(
+        details?.error || `Request failed with status ${response.status}`,
+        response.status,
+        details
+      );
+    }
+    if (response.status === 204) {
+      return void 0;
+    }
+    return response.json();
+  }
+  return {
+    // Forms
+    async getForms() {
+      const data = await request("/api/v1/forms");
+      return data.forms;
+    },
+    async getForm(formId) {
+      return request(`/api/v1/forms/${formId}`);
+    },
+    async createForm(input) {
+      return request("/api/v1/forms", {
+        method: "POST",
+        body: JSON.stringify(input)
+      });
+    },
+    async updateForm(formId, input) {
+      return request(`/api/v1/forms/${formId}`, {
+        method: "PATCH",
+        body: JSON.stringify(input)
+      });
+    },
+    async deleteForm(formId) {
+      await request(`/api/v1/forms/${formId}`, {
+        method: "DELETE"
+      });
+    },
+    // Submissions
+    async getSubmissions(formId, options = {}) {
+      const params = new URLSearchParams();
+      if (options.limit !== void 0) {
+        params.set("limit", String(options.limit));
+      }
+      if (options.offset !== void 0) {
+        params.set("offset", String(options.offset));
+      }
+      const query = params.toString();
+      const path = `/api/v1/forms/${formId}/submissions${query ? `?${query}` : ""}`;
+      return request(path);
+    },
+    async getSubmission(submissionId) {
+      return request(`/api/v1/submissions/${submissionId}`);
+    },
+    async deleteSubmission(submissionId) {
+      await request(`/api/v1/submissions/${submissionId}`, {
+        method: "DELETE"
+      });
+    },
+    // Attachments
+    async downloadAttachment(submissionId, filename) {
+      const url = `${apiUrl}/api/v1/submissions/${submissionId}/attachments/${encodeURIComponent(filename)}`;
+      const response = await fetch(url, {
+        headers: {
+          "Authorization": `Bearer ${siteToken}`
+        }
+      });
+      if (!response.ok) {
+        let details;
+        try {
+          details = await response.json();
+        } catch {
+        }
+        throw new AifeaturesApiError(
+          details?.error || `Download failed with status ${response.status}`,
+          response.status,
+          details
+        );
+      }
+      const blob = await response.blob();
+      const blobUrl = URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = blobUrl;
+      link.download = filename;
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      URL.revokeObjectURL(blobUrl);
+    }
+  };
+}
+
+// src/provider/AifeaturesProvider.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var AifeaturesContext = React.createContext(
+  null
+);
+function validateToken(token) {
+  if (!token) {
+    return "No siteToken provided to AifeaturesProvider";
+  }
+  if (token.startsWith("sk_")) {
+    return "Invalid token type: You passed an organization API key (sk_xxx) but AifeaturesProvider requires a site token (st_xxx). Site tokens are returned when you create a site via the API.";
+  }
+  if (!token.startsWith("st_")) {
+    return `Invalid token format: Expected a site token starting with "st_" but got "${token.slice(0, 10)}...". Site tokens are returned when you create a site via the API.`;
+  }
+  return null;
+}
+function AifeaturesProvider({
+  siteToken,
+  apiUrl = "https://aifeatures.dev",
+  dark = false,
+  className,
+  children
+}) {
+  const tokenError = React.useMemo(() => validateToken(siteToken), [siteToken]);
+  const api = React.useMemo(
+    () => createApiClient(siteToken, apiUrl),
+    [siteToken, apiUrl]
+  );
+  const value = React.useMemo(
+    () => ({
+      siteToken,
+      apiUrl,
+      api
+    }),
+    [siteToken, apiUrl, api]
+  );
+  if (tokenError) {
+    return /* @__PURE__ */ jsx("div", { className: `aifeatures-admin ${dark ? "dark" : ""} ${className || ""}`, children: /* @__PURE__ */ jsxs("div", { className: "af-rounded-md af-border af-border-destructive af-bg-destructive/10 af-p-4", children: [
+      /* @__PURE__ */ jsx("h3", { className: "af-text-sm af-font-semibold af-text-destructive af-mb-2", children: "AifeaturesProvider Configuration Error" }),
+      /* @__PURE__ */ jsx("p", { className: "af-text-sm af-text-destructive", children: tokenError })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx(AifeaturesContext.Provider, { value, children: /* @__PURE__ */ jsx("div", { className: `aifeatures-admin ${dark ? "dark" : ""} ${className || ""}`, children }) });
+}
+function useAifeaturesContext() {
+  const context = React.useContext(AifeaturesContext);
+  if (!context) {
+    throw new Error(
+      "useAifeaturesContext must be used within an AifeaturesProvider"
+    );
+  }
+  return context;
+}
+
+// src/components/FormsDashboard.tsx
+import * as React13 from "react";
+import { ArrowLeft as ArrowLeft2, Settings as Settings2, Inbox as Inbox3 } from "lucide-react";
+
+// src/ui/tabs.tsx
+import * as React2 from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+
+// src/lib/cn.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/ui/tabs.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var Tabs = TabsPrimitive.Root;
+var TabsList = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  TabsPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "af-inline-flex af-h-9 af-items-center af-justify-center af-rounded-lg af-bg-muted af-p-1 af-text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+var TabsTrigger = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  TabsPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "af-inline-flex af-items-center af-justify-center af-whitespace-nowrap af-rounded-md af-px-3 af-py-1 af-text-sm af-font-medium af-ring-offset-background af-transition-all focus-visible:af-outline-none focus-visible:af-ring-2 focus-visible:af-ring-ring focus-visible:af-ring-offset-2 disabled:af-pointer-events-none disabled:af-opacity-50 data-[state=active]:af-bg-background data-[state=active]:af-text-foreground data-[state=active]:af-shadow",
+      className
+    ),
+    ...props
+  }
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx2(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "af-mt-2 af-ring-offset-background focus-visible:af-outline-none focus-visible:af-ring-2 focus-visible:af-ring-ring focus-visible:af-ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+// src/ui/button.tsx
+import * as React3 from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var buttonVariants = cva(
+  "af-inline-flex af-items-center af-justify-center af-gap-2 af-whitespace-nowrap af-rounded-md af-text-sm af-font-medium af-transition-colors focus-visible:af-outline-none focus-visible:af-ring-1 focus-visible:af-ring-ring disabled:af-pointer-events-none disabled:af-opacity-50 [&_svg]:af-pointer-events-none [&_svg]:af-size-4 [&_svg]:af-shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "af-bg-primary af-text-primary-foreground af-shadow hover:af-bg-primary/90",
+        destructive: "af-bg-destructive af-text-destructive-foreground af-shadow-sm hover:af-bg-destructive/90",
+        outline: "af-border af-border-input af-bg-background af-shadow-sm hover:af-bg-accent hover:af-text-accent-foreground",
+        secondary: "af-bg-secondary af-text-secondary-foreground af-shadow-sm hover:af-bg-secondary/80",
+        ghost: "hover:af-bg-accent hover:af-text-accent-foreground",
+        link: "af-text-primary af-underline-offset-4 hover:af-underline"
+      },
+      size: {
+        default: "af-h-9 af-px-4 af-py-2",
+        sm: "af-h-8 af-rounded-md af-px-3 af-text-xs",
+        lg: "af-h-10 af-rounded-md af-px-8",
+        icon: "af-h-9 af-w-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React3.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx3(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/components/FormsList.tsx
+import { Inbox, Settings } from "lucide-react";
+
+// src/ui/table.tsx
+import * as React4 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Table = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4("div", { className: "af-relative af-w-full af-overflow-auto", children: /* @__PURE__ */ jsx4(
+  "table",
+  {
+    ref,
+    className: cn("af-w-full af-caption-bottom af-text-sm", className),
+    ...props
+  }
+) }));
+Table.displayName = "Table";
+var TableHeader = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4("thead", { ref, className: cn("[&_tr]:af-border-b", className), ...props }));
+TableHeader.displayName = "TableHeader";
+var TableBody = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "tbody",
+  {
+    ref,
+    className: cn("[&_tr:last-child]:af-border-0", className),
+    ...props
+  }
+));
+TableBody.displayName = "TableBody";
+var TableFooter = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "tfoot",
+  {
+    ref,
+    className: cn(
+      "af-border-t af-bg-muted/50 af-font-medium [&>tr]:last:af-border-b-0",
+      className
+    ),
+    ...props
+  }
+));
+TableFooter.displayName = "TableFooter";
+var TableRow = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "tr",
+  {
+    ref,
+    className: cn(
+      "af-border-b af-transition-colors hover:af-bg-muted/50 data-[state=selected]:af-bg-muted",
+      className
+    ),
+    ...props
+  }
+));
+TableRow.displayName = "TableRow";
+var TableHead = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "th",
+  {
+    ref,
+    className: cn(
+      "af-h-10 af-px-2 af-text-left af-align-middle af-font-medium af-text-muted-foreground [&:has([role=checkbox])]:af-pr-0 [&>[role=checkbox]]:af-translate-y-[2px]",
+      className
+    ),
+    ...props
+  }
+));
+TableHead.displayName = "TableHead";
+var TableCell = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "td",
+  {
+    ref,
+    className: cn(
+      "af-p-2 af-align-middle [&:has([role=checkbox])]:af-pr-0 [&>[role=checkbox]]:af-translate-y-[2px]",
+      className
+    ),
+    ...props
+  }
+));
+TableCell.displayName = "TableCell";
+var TableCaption = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "caption",
+  {
+    ref,
+    className: cn("af-mt-4 af-text-sm af-text-muted-foreground", className),
+    ...props
+  }
+));
+TableCaption.displayName = "TableCaption";
+
+// src/hooks/useForms.ts
+import * as React5 from "react";
+function useForms() {
+  const { api } = useAifeaturesContext();
+  const [forms, setForms] = React5.useState([]);
+  const [isLoading, setIsLoading] = React5.useState(true);
+  const [error, setError] = React5.useState(null);
+  const fetchForms = React5.useCallback(async () => {
+    try {
+      setIsLoading(true);
+      setError(null);
+      const data = await api.getForms();
+      setForms(data);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error("Failed to fetch forms"));
+    } finally {
+      setIsLoading(false);
+    }
+  }, [api]);
+  React5.useEffect(() => {
+    fetchForms();
+  }, [fetchForms]);
+  const createForm = React5.useCallback(
+    async (input) => {
+      const form = await api.createForm(input);
+      setForms((prev) => [...prev, form]);
+      return form;
+    },
+    [api]
+  );
+  const updateForm = React5.useCallback(
+    async (formId, input) => {
+      const form = await api.updateForm(formId, input);
+      setForms((prev) => prev.map((f) => f.id === formId ? form : f));
+      return form;
+    },
+    [api]
+  );
+  const deleteForm = React5.useCallback(
+    async (formId) => {
+      await api.deleteForm(formId);
+      setForms((prev) => prev.filter((f) => f.id !== formId));
+    },
+    [api]
+  );
+  return {
+    forms,
+    isLoading,
+    error,
+    refetch: fetchForms,
+    createForm,
+    updateForm,
+    deleteForm
+  };
+}
+
+// src/components/FormsList.tsx
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+function FormsList({ onSelectForm, className }) {
+  const { forms, isLoading, error } = useForms();
+  if (isLoading) {
+    return /* @__PURE__ */ jsx5("div", { className: `af-flex af-items-center af-justify-center af-py-8 ${className || ""}`, children: /* @__PURE__ */ jsx5("div", { className: "af-text-muted-foreground", children: "Loading forms..." }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx5("div", { className: `af-flex af-items-center af-justify-center af-py-8 ${className || ""}`, children: /* @__PURE__ */ jsxs2("div", { className: "af-text-destructive", children: [
+      "Error: ",
+      error.message
+    ] }) });
+  }
+  if (forms.length === 0) {
+    return /* @__PURE__ */ jsxs2("div", { className: `af-flex af-flex-col af-items-center af-justify-center af-py-12 ${className || ""}`, children: [
+      /* @__PURE__ */ jsx5(Inbox, { className: "af-h-12 af-w-12 af-text-muted-foreground af-mb-4" }),
+      /* @__PURE__ */ jsxs2("p", { className: "af-text-muted-foreground af-text-center", children: [
+        "No forms yet.",
+        /* @__PURE__ */ jsx5("br", {}),
+        "Forms will appear here when the AI creates contact forms on your website."
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsx5("div", { className, children: /* @__PURE__ */ jsxs2(Table, { children: [
+    /* @__PURE__ */ jsx5(TableHeader, { children: /* @__PURE__ */ jsxs2(TableRow, { children: [
+      /* @__PURE__ */ jsx5(TableHead, { children: "Name" }),
+      /* @__PURE__ */ jsx5(TableHead, { children: "Endpoint" }),
+      /* @__PURE__ */ jsx5(TableHead, { className: "af-text-right", children: "Actions" })
+    ] }) }),
+    /* @__PURE__ */ jsx5(TableBody, { children: forms.map((form) => /* @__PURE__ */ jsxs2(TableRow, { children: [
+      /* @__PURE__ */ jsx5(TableCell, { className: "af-font-medium", children: form.name }),
+      /* @__PURE__ */ jsx5(TableCell, { children: /* @__PURE__ */ jsx5("code", { className: "af-text-xs af-bg-muted af-px-1.5 af-py-0.5 af-rounded", children: form.endpoint_url.replace("https://aifeatures.dev", "") }) }),
+      /* @__PURE__ */ jsx5(TableCell, { className: "af-text-right", children: /* @__PURE__ */ jsxs2("div", { className: "af-flex af-items-center af-justify-end af-gap-2", children: [
+        /* @__PURE__ */ jsxs2(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            onClick: () => onSelectForm?.(form, "submissions"),
+            children: [
+              /* @__PURE__ */ jsx5(Inbox, { className: "af-h-4 af-w-4 af-mr-1" }),
+              "Submissions"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs2(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            onClick: () => onSelectForm?.(form, "settings"),
+            children: [
+              /* @__PURE__ */ jsx5(Settings, { className: "af-h-4 af-w-4 af-mr-1" }),
+              "Settings"
+            ]
+          }
+        )
+      ] }) })
+    ] }, form.id)) })
+  ] }) });
+}
+
+// src/components/FormSubmissions.tsx
+import * as React9 from "react";
+import {
+  ChevronLeft,
+  ChevronRight,
+  Eye,
+  Inbox as Inbox2,
+  Paperclip
+} from "lucide-react";
+
+// src/ui/select.tsx
+import * as React6 from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { Check, ChevronDown, ChevronUp } from "lucide-react";
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var Select = SelectPrimitive.Root;
+var SelectValue = SelectPrimitive.Value;
+var SelectTrigger = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  SelectPrimitive.Trigger,
+  {
+    ref,
+    className: cn(
+      "af-flex af-h-9 af-w-full af-items-center af-justify-between af-whitespace-nowrap af-rounded-md af-border af-border-input af-bg-transparent af-px-3 af-py-2 af-text-sm af-shadow-sm af-ring-offset-background placeholder:af-text-muted-foreground focus:af-outline-none focus:af-ring-1 focus:af-ring-ring disabled:af-cursor-not-allowed disabled:af-opacity-50 [&>span]:af-line-clamp-1",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx6(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx6(ChevronDown, { className: "af-h-4 af-w-4 af-opacity-50" }) })
+    ]
+  }
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+var SelectScrollUpButton = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  SelectPrimitive.ScrollUpButton,
+  {
+    ref,
+    className: cn(
+      "af-flex af-cursor-default af-items-center af-justify-center af-py-1",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx6(ChevronUp, { className: "af-h-4 af-w-4" })
+  }
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+var SelectScrollDownButton = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  SelectPrimitive.ScrollDownButton,
+  {
+    ref,
+    className: cn(
+      "af-flex af-cursor-default af-items-center af-justify-center af-py-1",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx6(ChevronDown, { className: "af-h-4 af-w-4" })
+  }
+));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
+var SelectContent = React6.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx6(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs3(
+  SelectPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "af-relative af-z-50 af-max-h-96 af-min-w-[8rem] af-overflow-hidden af-rounded-md af-border af-bg-popover af-text-popover-foreground af-shadow-md data-[state=open]:af-animate-in data-[state=closed]:af-animate-out data-[state=closed]:af-fade-out-0 data-[state=open]:af-fade-in-0 data-[state=closed]:af-zoom-out-95 data-[state=open]:af-zoom-in-95 data-[side=bottom]:af-slide-in-from-top-2 data-[side=left]:af-slide-in-from-right-2 data-[side=right]:af-slide-in-from-left-2 data-[side=top]:af-slide-in-from-bottom-2",
+      position === "popper" && "data-[side=bottom]:af-translate-y-1 data-[side=left]:af--translate-x-1 data-[side=right]:af-translate-x-1 data-[side=top]:af--translate-y-1",
+      className
+    ),
+    position,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx6(SelectScrollUpButton, {}),
+      /* @__PURE__ */ jsx6(
+        SelectPrimitive.Viewport,
+        {
+          className: cn(
+            "af-p-1",
+            position === "popper" && "af-h-[var(--radix-select-trigger-height)] af-w-full af-min-w-[var(--radix-select-trigger-width)]"
+          ),
+          children
+        }
+      ),
+      /* @__PURE__ */ jsx6(SelectScrollDownButton, {})
+    ]
+  }
+) }));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+var SelectLabel = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  SelectPrimitive.Label,
+  {
+    ref,
+    className: cn("af-px-2 af-py-1.5 af-text-sm af-font-semibold", className),
+    ...props
+  }
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+var SelectItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs3(
+  SelectPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "af-relative af-flex af-w-full af-cursor-default af-select-none af-items-center af-rounded-sm af-py-1.5 af-pl-2 af-pr-8 af-text-sm af-outline-none focus:af-bg-accent focus:af-text-accent-foreground data-[disabled]:af-pointer-events-none data-[disabled]:af-opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx6("span", { className: "af-absolute af-right-2 af-flex af-h-3.5 af-w-3.5 af-items-center af-justify-center", children: /* @__PURE__ */ jsx6(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx6(Check, { className: "af-h-4 af-w-4" }) }) }),
+      /* @__PURE__ */ jsx6(SelectPrimitive.ItemText, { children })
+    ]
+  }
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+var SelectSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+  SelectPrimitive.Separator,
+  {
+    ref,
+    className: cn("af--mx-1 af-my-1 af-h-px af-bg-muted", className),
+    ...props
+  }
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+
+// src/hooks/useSubmissions.ts
+import * as React7 from "react";
+function useSubmissions({
+  formId,
+  initialPageSize = 25
+}) {
+  const { api } = useAifeaturesContext();
+  const [submissions, setSubmissions] = React7.useState([]);
+  const [total, setTotal] = React7.useState(0);
+  const [isLoading, setIsLoading] = React7.useState(true);
+  const [error, setError] = React7.useState(null);
+  const [page, setPage] = React7.useState(0);
+  const [pageSize, setPageSize] = React7.useState(initialPageSize);
+  const fetchSubmissions = React7.useCallback(async () => {
+    if (!formId) return;
+    try {
+      setIsLoading(true);
+      setError(null);
+      const options = {
+        limit: pageSize,
+        offset: page * pageSize
+      };
+      const data = await api.getSubmissions(
+        formId,
+        options
+      );
+      setSubmissions(data.submissions);
+      setTotal(data.total);
+    } catch (err) {
+      setError(
+        err instanceof Error ? err : new Error("Failed to fetch submissions")
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, [api, formId, page, pageSize]);
+  React7.useEffect(() => {
+    fetchSubmissions();
+  }, [fetchSubmissions]);
+  const deleteSubmission = React7.useCallback(
+    async (submissionId) => {
+      await api.deleteSubmission(submissionId);
+      setSubmissions((prev) => prev.filter((s) => s.id !== submissionId));
+      setTotal((prev) => prev - 1);
+    },
+    [api]
+  );
+  const totalPages = Math.ceil(total / pageSize);
+  return {
+    submissions,
+    total,
+    isLoading,
+    error,
+    page,
+    pageSize,
+    hasNextPage: page < totalPages - 1,
+    hasPreviousPage: page > 0,
+    setPage,
+    setPageSize: (size) => {
+      setPageSize(size);
+      setPage(0);
+    },
+    refetch: fetchSubmissions,
+    deleteSubmission
+  };
+}
+
+// src/components/SubmissionDetail.tsx
+import * as React8 from "react";
+import { ArrowLeft, Download, Globe, Clock, FileText, Loader2, Monitor, Mail } from "lucide-react";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+function formatDate(dateString) {
+  return new Date(dateString).toLocaleString(void 0, {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function formatBytes(bytes) {
+  if (bytes === 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB"];
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
+}
+function SubmissionDetail({
+  submission,
+  onBack
+}) {
+  const { api } = useAifeaturesContext();
+  const [downloadingFile, setDownloadingFile] = React8.useState(null);
+  const handleDownload = async (filename) => {
+    setDownloadingFile(filename);
+    try {
+      await api.downloadAttachment(submission.id, filename);
+    } catch (error) {
+      console.error("Download failed:", error);
+    } finally {
+      setDownloadingFile(null);
+    }
+  };
+  const dataEntries = Object.entries(submission.data).filter(
+    ([key]) => !key.startsWith("_")
+  );
+  return /* @__PURE__ */ jsxs4("div", { children: [
+    /* @__PURE__ */ jsxs4("div", { className: "af-mb-6", children: [
+      /* @__PURE__ */ jsxs4(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          onClick: onBack,
+          className: "af-mb-2 af--ml-2",
+          children: [
+            /* @__PURE__ */ jsx7(ArrowLeft, { className: "af-h-4 af-w-4 af-mr-1" }),
+            "Back to Submissions"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx7("h3", { className: "af-text-lg af-font-semibold", children: "Submission Details" }),
+      /* @__PURE__ */ jsxs4("p", { className: "af-text-sm af-text-muted-foreground", children: [
+        "Submitted ",
+        formatDate(submission.metadata.submitted_at)
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs4("div", { className: "af-space-y-6", children: [
+      /* @__PURE__ */ jsxs4("div", { children: [
+        /* @__PURE__ */ jsx7("h4", { className: "af-text-sm af-font-medium af-mb-3", children: "Form Data" }),
+        /* @__PURE__ */ jsxs4("div", { className: "af-space-y-3", children: [
+          dataEntries.map(([key, value]) => /* @__PURE__ */ jsxs4("div", { className: "af-grid af-grid-cols-3 af-gap-2", children: [
+            /* @__PURE__ */ jsx7("div", { className: "af-text-sm af-text-muted-foreground af-capitalize", children: key.replace(/_/g, " ") }),
+            /* @__PURE__ */ jsx7("div", { className: "af-col-span-2 af-text-sm af-break-words", children: typeof value === "string" && value.includes("\n") ? /* @__PURE__ */ jsx7("pre", { className: "af-whitespace-pre-wrap af-font-sans af-bg-muted af-p-2 af-rounded af-text-xs", children: value }) : String(value) })
+          ] }, key)),
+          dataEntries.length === 0 && /* @__PURE__ */ jsx7("p", { className: "af-text-sm af-text-muted-foreground", children: "No data submitted" })
+        ] })
+      ] }),
+      submission.attachments.length > 0 && /* @__PURE__ */ jsxs4("div", { children: [
+        /* @__PURE__ */ jsx7("h4", { className: "af-text-sm af-font-medium af-mb-3", children: "Attachments" }),
+        /* @__PURE__ */ jsx7("div", { className: "af-space-y-2", children: submission.attachments.map((attachment, index) => /* @__PURE__ */ jsxs4(
+          "div",
+          {
+            className: "af-flex af-items-center af-justify-between af-p-2 af-bg-muted af-rounded",
+            children: [
+              /* @__PURE__ */ jsxs4("div", { className: "af-flex af-items-center af-gap-2", children: [
+                /* @__PURE__ */ jsx7(FileText, { className: "af-h-4 af-w-4 af-text-muted-foreground" }),
+                /* @__PURE__ */ jsx7("span", { className: "af-text-sm", children: attachment.name }),
+                /* @__PURE__ */ jsxs4("span", { className: "af-text-xs af-text-muted-foreground", children: [
+                  "(",
+                  formatBytes(attachment.size),
+                  ")"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs4(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: () => handleDownload(attachment.name),
+                  disabled: downloadingFile === attachment.name,
+                  children: [
+                    downloadingFile === attachment.name ? /* @__PURE__ */ jsx7(Loader2, { className: "af-h-4 af-w-4 af-mr-1 af-animate-spin" }) : /* @__PURE__ */ jsx7(Download, { className: "af-h-4 af-w-4 af-mr-1" }),
+                    downloadingFile === attachment.name ? "Downloading..." : "Download"
+                  ]
+                }
+              )
+            ]
+          },
+          index
+        )) })
+      ] }),
+      /* @__PURE__ */ jsxs4("div", { children: [
+        /* @__PURE__ */ jsx7("h4", { className: "af-text-sm af-font-medium af-mb-3", children: "Metadata" }),
+        /* @__PURE__ */ jsxs4("div", { className: "af-space-y-2 af-text-sm", children: [
+          /* @__PURE__ */ jsxs4("div", { className: "af-flex af-items-center af-gap-2 af-text-muted-foreground", children: [
+            /* @__PURE__ */ jsx7(Clock, { className: "af-h-4 af-w-4" }),
+            /* @__PURE__ */ jsx7("span", { children: formatDate(submission.metadata.submitted_at) })
+          ] }),
+          submission.metadata.ip_address && /* @__PURE__ */ jsxs4("div", { className: "af-flex af-items-center af-gap-2 af-text-muted-foreground", children: [
+            /* @__PURE__ */ jsx7(Globe, { className: "af-h-4 af-w-4" }),
+            /* @__PURE__ */ jsxs4("span", { children: [
+              "IP: ",
+              submission.metadata.ip_address
+            ] })
+          ] }),
+          submission.metadata.user_agent && /* @__PURE__ */ jsxs4("div", { className: "af-flex af-items-start af-gap-2 af-text-muted-foreground", children: [
+            /* @__PURE__ */ jsx7(Monitor, { className: "af-h-4 af-w-4 af-mt-0.5" }),
+            /* @__PURE__ */ jsx7("span", { className: "af-text-xs af-break-all", children: submission.metadata.user_agent })
+          ] }),
+          submission.resend_id && /* @__PURE__ */ jsxs4("div", { className: "af-flex af-items-center af-gap-2 af-text-muted-foreground", children: [
+            /* @__PURE__ */ jsx7(Mail, { className: "af-h-4 af-w-4" }),
+            /* @__PURE__ */ jsxs4("span", { children: [
+              "Email ID: ",
+              submission.resend_id
+            ] })
+          ] })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/FormSubmissions.tsx
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+function formatDate2(dateString) {
+  return new Date(dateString).toLocaleString(void 0, {
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function getEmailFromData(data) {
+  const emailFields = ["email", "Email", "EMAIL", "e-mail", "mail"];
+  for (const field of emailFields) {
+    if (typeof data[field] === "string") {
+      return data[field];
+    }
+  }
+  return null;
+}
+function getPreviewText(data) {
+  const entries = Object.entries(data).filter(
+    ([key]) => !key.startsWith("_") && !key.toLowerCase().includes("email")
+  );
+  if (entries.length === 0) return "";
+  const [, value] = entries[0];
+  const text = String(value);
+  return text.length > 50 ? text.slice(0, 50) + "..." : text;
+}
+function FormSubmissions({ formId, className }) {
+  const {
+    submissions,
+    total,
+    isLoading,
+    error,
+    page,
+    pageSize,
+    hasNextPage,
+    hasPreviousPage,
+    setPage,
+    setPageSize
+  } = useSubmissions({ formId });
+  const [view, setView] = React9.useState("list");
+  const [selectedSubmission, setSelectedSubmission] = React9.useState(null);
+  const handleViewSubmission = (submission) => {
+    setSelectedSubmission(submission);
+    setView("detail");
+  };
+  const handleBack = () => {
+    setView("list");
+    setSelectedSubmission(null);
+  };
+  if (view === "detail" && selectedSubmission) {
+    return /* @__PURE__ */ jsx8("div", { className, children: /* @__PURE__ */ jsx8(
+      SubmissionDetail,
+      {
+        submission: selectedSubmission,
+        onBack: handleBack
+      }
+    ) });
+  }
+  if (isLoading) {
+    return /* @__PURE__ */ jsx8("div", { className: `af-flex af-items-center af-justify-center af-py-8 ${className || ""}`, children: /* @__PURE__ */ jsx8("div", { className: "af-text-muted-foreground", children: "Loading submissions..." }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx8("div", { className: `af-flex af-items-center af-justify-center af-py-8 ${className || ""}`, children: /* @__PURE__ */ jsxs5("div", { className: "af-text-destructive", children: [
+      "Error: ",
+      error.message
+    ] }) });
+  }
+  if (submissions.length === 0 && page === 0) {
+    return /* @__PURE__ */ jsxs5("div", { className: `af-flex af-flex-col af-items-center af-justify-center af-py-12 ${className || ""}`, children: [
+      /* @__PURE__ */ jsx8(Inbox2, { className: "af-h-12 af-w-12 af-text-muted-foreground af-mb-4" }),
+      /* @__PURE__ */ jsxs5("p", { className: "af-text-muted-foreground af-text-center", children: [
+        "No submissions yet.",
+        /* @__PURE__ */ jsx8("br", {}),
+        "Submissions will appear here when visitors use your form."
+      ] })
+    ] });
+  }
+  const startIndex = page * pageSize + 1;
+  const endIndex = Math.min((page + 1) * pageSize, total);
+  return /* @__PURE__ */ jsxs5("div", { className, children: [
+    /* @__PURE__ */ jsxs5(Table, { children: [
+      /* @__PURE__ */ jsx8(TableHeader, { children: /* @__PURE__ */ jsxs5(TableRow, { children: [
+        /* @__PURE__ */ jsx8(TableHead, { children: "Email" }),
+        /* @__PURE__ */ jsx8(TableHead, { children: "Preview" }),
+        /* @__PURE__ */ jsx8(TableHead, { children: "Date" }),
+        /* @__PURE__ */ jsx8(TableHead, { className: "af-text-right", children: "Actions" })
+      ] }) }),
+      /* @__PURE__ */ jsx8(TableBody, { children: submissions.map((submission) => {
+        const email = getEmailFromData(submission.data);
+        const preview = getPreviewText(submission.data);
+        return /* @__PURE__ */ jsxs5(TableRow, { children: [
+          /* @__PURE__ */ jsx8(TableCell, { className: "af-font-medium", children: /* @__PURE__ */ jsxs5("div", { className: "af-flex af-items-center af-gap-2", children: [
+            email || /* @__PURE__ */ jsx8("span", { className: "af-text-muted-foreground af-italic", children: "No email" }),
+            submission.attachments.length > 0 && /* @__PURE__ */ jsxs5("span", { className: "af-flex af-items-center af-gap-1 af-text-muted-foreground", title: `${submission.attachments.length} attachment(s)`, children: [
+              /* @__PURE__ */ jsx8(Paperclip, { className: "af-h-3 af-w-3" }),
+              /* @__PURE__ */ jsx8("span", { className: "af-text-xs", children: submission.attachments.length })
+            ] })
+          ] }) }),
+          /* @__PURE__ */ jsx8(TableCell, { className: "af-text-muted-foreground af-max-w-[200px] af-truncate", children: preview || /* @__PURE__ */ jsx8("span", { className: "af-italic", children: "No preview available" }) }),
+          /* @__PURE__ */ jsx8(TableCell, { className: "af-text-muted-foreground", children: formatDate2(submission.metadata.submitted_at) }),
+          /* @__PURE__ */ jsx8(TableCell, { className: "af-text-right", children: /* @__PURE__ */ jsx8(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              onClick: () => handleViewSubmission(submission),
+              title: "View details",
+              children: /* @__PURE__ */ jsx8(Eye, { className: "af-h-4 af-w-4" })
+            }
+          ) })
+        ] }, submission.id);
+      }) })
+    ] }),
+    /* @__PURE__ */ jsxs5("div", { className: "af-flex af-items-center af-justify-between af-px-2 af-py-4", children: [
+      /* @__PURE__ */ jsxs5("div", { className: "af-flex af-items-center af-gap-2 af-text-sm af-text-muted-foreground", children: [
+        /* @__PURE__ */ jsxs5("span", { children: [
+          "Showing ",
+          startIndex,
+          "-",
+          endIndex,
+          " of ",
+          total
+        ] }),
+        /* @__PURE__ */ jsxs5(
+          Select,
+          {
+            value: String(pageSize),
+            onValueChange: (value) => setPageSize(Number(value)),
+            children: [
+              /* @__PURE__ */ jsx8(SelectTrigger, { className: "af-w-[70px] af-h-8", children: /* @__PURE__ */ jsx8(SelectValue, {}) }),
+              /* @__PURE__ */ jsxs5(SelectContent, { children: [
+                /* @__PURE__ */ jsx8(SelectItem, { value: "10", children: "10" }),
+                /* @__PURE__ */ jsx8(SelectItem, { value: "25", children: "25" }),
+                /* @__PURE__ */ jsx8(SelectItem, { value: "50", children: "50" }),
+                /* @__PURE__ */ jsx8(SelectItem, { value: "100", children: "100" })
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx8("span", { children: "per page" })
+      ] }),
+      /* @__PURE__ */ jsxs5("div", { className: "af-flex af-items-center af-gap-2", children: [
+        /* @__PURE__ */ jsxs5(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            onClick: () => setPage(page - 1),
+            disabled: !hasPreviousPage,
+            children: [
+              /* @__PURE__ */ jsx8(ChevronLeft, { className: "af-h-4 af-w-4 af-mr-1" }),
+              "Previous"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs5(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            onClick: () => setPage(page + 1),
+            disabled: !hasNextPage,
+            children: [
+              "Next",
+              /* @__PURE__ */ jsx8(ChevronRight, { className: "af-h-4 af-w-4 af-ml-1" })
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/FormSettings.tsx
+import * as React12 from "react";
+import { Plus, X, Loader2 as Loader22, Check as Check2 } from "lucide-react";
+
+// src/ui/input.tsx
+import * as React10 from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Input = React10.forwardRef(
+  ({ className, type, ...props }, ref) => {
+    return /* @__PURE__ */ jsx9(
+      "input",
+      {
+        type,
+        className: cn(
+          "af-flex af-h-9 af-w-full af-rounded-md af-border af-border-input af-bg-transparent af-px-3 af-py-1 af-text-sm af-shadow-sm af-transition-colors file:af-border-0 file:af-bg-transparent file:af-text-sm file:af-font-medium file:af-text-foreground placeholder:af-text-muted-foreground focus-visible:af-outline-none focus-visible:af-ring-1 focus-visible:af-ring-ring disabled:af-cursor-not-allowed disabled:af-opacity-50",
+          className
+        ),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+// src/ui/label.tsx
+import * as React11 from "react";
+import { cva as cva2 } from "class-variance-authority";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var labelVariants = cva2(
+  "af-text-sm af-font-medium af-leading-none peer-disabled:af-cursor-not-allowed peer-disabled:af-opacity-70"
+);
+var Label2 = React11.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx10("label", { ref, className: cn(labelVariants(), className), ...props })
+);
+Label2.displayName = "Label";
+
+// src/ui/badge.tsx
+import { cva as cva3 } from "class-variance-authority";
+import { jsx as jsx11 } from "react/jsx-runtime";
+var badgeVariants = cva3(
+  "af-inline-flex af-items-center af-rounded-md af-border af-px-2.5 af-py-0.5 af-text-xs af-font-semibold af-transition-colors focus:af-outline-none focus:af-ring-2 focus:af-ring-ring focus:af-ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "af-border-transparent af-bg-primary af-text-primary-foreground af-shadow hover:af-bg-primary/80",
+        secondary: "af-border-transparent af-bg-secondary af-text-secondary-foreground hover:af-bg-secondary/80",
+        destructive: "af-border-transparent af-bg-destructive af-text-destructive-foreground af-shadow hover:af-bg-destructive/80",
+        outline: "af-text-foreground",
+        success: "af-border-transparent af-bg-green-100 af-text-green-800",
+        warning: "af-border-transparent af-bg-yellow-100 af-text-yellow-800"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({ className, variant, ...props }) {
+  return /* @__PURE__ */ jsx11("div", { className: cn(badgeVariants({ variant }), className), ...props });
+}
+
+// src/components/FormSettings.tsx
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+function FormSettings({ form, onSaved, className }) {
+  const { updateForm } = useForms();
+  const [isSaving, setIsSaving] = React12.useState(false);
+  const [lastSaved, setLastSaved] = React12.useState(null);
+  const [error, setError] = React12.useState(null);
+  const [name, setName] = React12.useState(form.name);
+  const [redirectUrl, setRedirectUrl] = React12.useState(form.redirect_url || "");
+  const [emailRecipients, setEmailRecipients] = React12.useState(
+    form.email_recipients
+  );
+  const [newEmail, setNewEmail] = React12.useState("");
+  React12.useEffect(() => {
+    setName(form.name);
+    setRedirectUrl(form.redirect_url || "");
+    setEmailRecipients(form.email_recipients);
+    setError(null);
+  }, [form]);
+  const save = React12.useCallback(
+    async (updates) => {
+      try {
+        setIsSaving(true);
+        setError(null);
+        const updatedForm = await updateForm(form.id, updates);
+        setLastSaved(/* @__PURE__ */ new Date());
+        onSaved?.(updatedForm);
+      } catch (err) {
+        setError(err instanceof Error ? err.message : "Failed to save");
+      } finally {
+        setIsSaving(false);
+      }
+    },
+    [form.id, updateForm, onSaved]
+  );
+  React12.useEffect(() => {
+    if (lastSaved) {
+      const timer = setTimeout(() => setLastSaved(null), 2e3);
+      return () => clearTimeout(timer);
+    }
+  }, [lastSaved]);
+  const handleAddEmail = async () => {
+    const email = newEmail.trim().toLowerCase();
+    if (!email) return;
+    if (!email.includes("@")) {
+      setError("Please enter a valid email address");
+      return;
+    }
+    if (emailRecipients.includes(email)) {
+      setError("This email is already added");
+      return;
+    }
+    const newRecipients = [...emailRecipients, email];
+    setEmailRecipients(newRecipients);
+    setNewEmail("");
+    setError(null);
+    await save({ email_recipients: newRecipients });
+  };
+  const handleRemoveEmail = async (email) => {
+    const newRecipients = emailRecipients.filter((e) => e !== email);
+    setEmailRecipients(newRecipients);
+    await save({ email_recipients: newRecipients });
+  };
+  const handleNameBlur = async () => {
+    if (name !== form.name) {
+      await save({ name });
+    }
+  };
+  const handleRedirectBlur = async () => {
+    const newValue = redirectUrl || null;
+    if (newValue !== form.redirect_url) {
+      await save({ redirect_url: newValue });
+    }
+  };
+  return /* @__PURE__ */ jsxs6("div", { className: `af-space-y-6 af-relative ${className || ""}`, children: [
+    (isSaving || lastSaved) && /* @__PURE__ */ jsx12("div", { className: "aifeatures-admin af-fixed af-bottom-4 af-right-4 af-z-50", children: isSaving ? /* @__PURE__ */ jsxs6("div", { className: "af-flex af-items-center af-gap-2 af-bg-background af-border af-shadow-lg af-rounded-lg af-px-4 af-py-3", children: [
+      /* @__PURE__ */ jsx12(Loader22, { className: "af-h-4 af-w-4 af-animate-spin af-text-muted-foreground" }),
+      /* @__PURE__ */ jsx12("span", { className: "af-text-sm", children: "Saving..." })
+    ] }) : /* @__PURE__ */ jsxs6("div", { className: "af-flex af-items-center af-gap-2 af-bg-green-50 af-border af-border-green-200 af-shadow-lg af-rounded-lg af-px-4 af-py-3", children: [
+      /* @__PURE__ */ jsx12(Check2, { className: "af-h-4 af-w-4 af-text-green-600" }),
+      /* @__PURE__ */ jsx12("span", { className: "af-text-sm af-text-green-800", children: "Changes saved" })
+    ] }) }),
+    /* @__PURE__ */ jsxs6("div", { className: "af-space-y-2", children: [
+      /* @__PURE__ */ jsx12(Label2, { htmlFor: "form-name", children: "Form Name" }),
+      /* @__PURE__ */ jsx12(
+        Input,
+        {
+          id: "form-name",
+          value: name,
+          onChange: (e) => setName(e.target.value),
+          onBlur: handleNameBlur,
+          placeholder: "Contact Form"
+        }
+      ),
+      /* @__PURE__ */ jsx12("p", { className: "af-text-xs af-text-muted-foreground", children: "A name to identify this form in your dashboard." })
+    ] }),
+    /* @__PURE__ */ jsxs6("div", { className: "af-space-y-2", children: [
+      /* @__PURE__ */ jsx12(Label2, { children: "Email Recipients" }),
+      /* @__PURE__ */ jsx12("p", { className: "af-text-xs af-text-muted-foreground af-mb-2", children: "Form submissions will be sent to these email addresses." }),
+      /* @__PURE__ */ jsxs6("div", { className: "af-flex af-flex-wrap af-gap-2 af-mb-2", children: [
+        emailRecipients.map((email) => /* @__PURE__ */ jsxs6(Badge, { variant: "secondary", className: "af-gap-1", children: [
+          email,
+          /* @__PURE__ */ jsx12(
+            "button",
+            {
+              type: "button",
+              onClick: () => handleRemoveEmail(email),
+              className: "af-ml-1 hover:af-text-destructive",
+              disabled: isSaving,
+              children: /* @__PURE__ */ jsx12(X, { className: "af-h-3 af-w-3" })
+            }
+          )
+        ] }, email)),
+        emailRecipients.length === 0 && /* @__PURE__ */ jsx12("span", { className: "af-text-sm af-text-muted-foreground af-italic", children: "No recipients configured" })
+      ] }),
+      /* @__PURE__ */ jsxs6("div", { className: "af-flex af-gap-2", children: [
+        /* @__PURE__ */ jsx12(
+          Input,
+          {
+            type: "email",
+            value: newEmail,
+            onChange: (e) => setNewEmail(e.target.value),
+            placeholder: "Add email address",
+            onKeyDown: (e) => {
+              if (e.key === "Enter") {
+                e.preventDefault();
+                handleAddEmail();
+              }
+            },
+            disabled: isSaving
+          }
+        ),
+        /* @__PURE__ */ jsx12(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: handleAddEmail,
+            disabled: !newEmail.trim() || isSaving,
+            children: /* @__PURE__ */ jsx12(Plus, { className: "af-h-4 af-w-4" })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs6("div", { className: "af-space-y-2", children: [
+      /* @__PURE__ */ jsx12(Label2, { htmlFor: "redirect-url", children: "Redirect URL" }),
+      /* @__PURE__ */ jsx12(
+        Input,
+        {
+          id: "redirect-url",
+          value: redirectUrl,
+          onChange: (e) => setRedirectUrl(e.target.value),
+          onBlur: handleRedirectBlur,
+          placeholder: "/thank-you"
+        }
+      ),
+      /* @__PURE__ */ jsx12("p", { className: "af-text-xs af-text-muted-foreground", children: "URL to redirect visitors to after successful submission. Leave empty for a default success page." })
+    ] }),
+    /* @__PURE__ */ jsxs6("div", { className: "af-space-y-2", children: [
+      /* @__PURE__ */ jsx12(Label2, { children: "Form Endpoint" }),
+      /* @__PURE__ */ jsx12("div", { className: "af-flex af-items-center af-gap-2", children: /* @__PURE__ */ jsx12("code", { className: "af-flex-1 af-text-xs af-bg-muted af-px-3 af-py-2 af-rounded af-border", children: form.endpoint_url }) }),
+      /* @__PURE__ */ jsx12("p", { className: "af-text-xs af-text-muted-foreground", children: "Use this URL as the form action attribute." })
+    ] }),
+    /* @__PURE__ */ jsxs6("div", { className: "af-space-y-2", children: [
+      /* @__PURE__ */ jsx12(Label2, { children: "Captcha Protection" }),
+      /* @__PURE__ */ jsxs6("div", { className: "af-flex af-items-center af-gap-2", children: [
+        /* @__PURE__ */ jsx12(Badge, { variant: form.captcha.enabled ? "success" : "secondary", children: form.captcha.enabled ? "Enabled" : "Disabled" }),
+        form.captcha.enabled && form.captcha.provider && /* @__PURE__ */ jsxs6("span", { className: "af-text-xs af-text-muted-foreground", children: [
+          "(",
+          form.captcha.provider,
+          ")"
+        ] })
+      ] })
+    ] }),
+    error && /* @__PURE__ */ jsx12("div", { className: "af-text-sm af-text-destructive af-bg-destructive/10 af-px-3 af-py-2 af-rounded", children: error })
+  ] });
+}
+
+// src/components/FormsDashboard.tsx
+import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+function FormsDashboard({ className }) {
+  const [view, setView] = React13.useState("list");
+  const [selectedForm, setSelectedForm] = React13.useState(null);
+  const [activeTab, setActiveTab] = React13.useState(
+    "submissions"
+  );
+  const handleSelectForm = (form, tab) => {
+    setSelectedForm(form);
+    setView("detail");
+    setActiveTab(tab);
+  };
+  const handleBack = () => {
+    setView("list");
+    setSelectedForm(null);
+  };
+  const handleFormSaved = (updatedForm) => {
+    setSelectedForm(updatedForm);
+  };
+  return /* @__PURE__ */ jsxs7("div", { className, children: [
+    view === "list" && /* @__PURE__ */ jsxs7("div", { children: [
+      /* @__PURE__ */ jsxs7("div", { className: "af-mb-6", children: [
+        /* @__PURE__ */ jsx13("h2", { className: "af-text-lg af-font-semibold", children: "Forms" }),
+        /* @__PURE__ */ jsx13("p", { className: "af-text-sm af-text-muted-foreground", children: "Manage your contact forms and view submissions." })
+      ] }),
+      /* @__PURE__ */ jsx13(FormsList, { onSelectForm: handleSelectForm })
+    ] }),
+    view === "detail" && selectedForm && /* @__PURE__ */ jsxs7("div", { children: [
+      /* @__PURE__ */ jsxs7("div", { className: "af-mb-6", children: [
+        /* @__PURE__ */ jsxs7(
+          Button,
+          {
+            variant: "ghost",
+            size: "sm",
+            onClick: handleBack,
+            className: "af-mb-2 af--ml-2",
+            children: [
+              /* @__PURE__ */ jsx13(ArrowLeft2, { className: "af-h-4 af-w-4 af-mr-1" }),
+              "Back to Forms"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx13("h2", { className: "af-text-lg af-font-semibold", children: selectedForm.name }),
+        /* @__PURE__ */ jsx13("p", { className: "af-text-sm af-text-muted-foreground", children: /* @__PURE__ */ jsx13("code", { className: "af-text-xs af-bg-muted af-px-1.5 af-py-0.5 af-rounded", children: selectedForm.endpoint_url }) })
+      ] }),
+      /* @__PURE__ */ jsxs7(
+        Tabs,
+        {
+          value: activeTab,
+          onValueChange: (v) => setActiveTab(v),
+          children: [
+            /* @__PURE__ */ jsxs7(TabsList, { className: "af-mb-4", children: [
+              /* @__PURE__ */ jsxs7(TabsTrigger, { value: "submissions", className: "af-gap-2", children: [
+                /* @__PURE__ */ jsx13(Inbox3, { className: "af-h-4 af-w-4" }),
+                "Submissions"
+              ] }),
+              /* @__PURE__ */ jsxs7(TabsTrigger, { value: "settings", className: "af-gap-2", children: [
+                /* @__PURE__ */ jsx13(Settings2, { className: "af-h-4 af-w-4" }),
+                "Settings"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx13(TabsContent, { value: "submissions", children: /* @__PURE__ */ jsx13(FormSubmissions, { formId: selectedForm.id }) }),
+            /* @__PURE__ */ jsx13(TabsContent, { value: "settings", children: /* @__PURE__ */ jsx13(FormSettings, { form: selectedForm, onSaved: handleFormSaved }) })
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  AifeaturesApiError,
+  AifeaturesProvider,
+  FormSettings,
+  FormSubmissions,
+  FormsDashboard,
+  FormsList,
+  SubmissionDetail,
+  createApiClient,
+  useAifeaturesContext as useAifeatures,
+  useAifeaturesContext,
+  useForms,
+  useSubmissions
+};
+//# sourceMappingURL=index.js.map