@btst/stack 1.5.2 → 1.7.0

package/dist/packages/better-stack/src/plugins/form-builder/client/components/forms/form-renderer.cjs

@@ -0,0 +1,131 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const context = require('@btst/stack/context');
+const steppedAutoForm = require('../../../../../../../ui/src/components/auto-form/stepped-auto-form.cjs');
+const utils = require('../../../../../../../ui/src/components/auto-form/utils.cjs');
+const schemaConverter = require('../../../../../../../ui/src/lib/schema-converter.cjs');
+const skeleton = require('../../../../../../../ui/src/components/skeleton.cjs');
+const lucideReact = require('lucide-react');
+const formBuilderHooks = require('../../hooks/form-builder-hooks.cjs');
+const index = require('../../localization/index.cjs');
+
+function DefaultLoadingComponent() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-32" })
+  ] });
+}
+function DefaultErrorComponent({ error }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-full bg-destructive/10 p-3 mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "h-6 w-6 text-destructive" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-medium text-foreground mb-2", children: "Failed to load form" }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: error.message || "An unexpected error occurred" })
+  ] });
+}
+function DefaultSuccessComponent({ message }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-full bg-green-100 dark:bg-green-900 p-3 mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle, { className: "h-6 w-6 text-green-600 dark:text-green-400" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-medium text-foreground mb-2", children: "Form Submitted" }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: message })
+  ] });
+}
+function FormRenderer({
+  slug,
+  onSuccess,
+  onError,
+  fieldComponents: propFieldComponents,
+  successMessage: propSuccessMessage,
+  submitButtonText,
+  LoadingComponent = DefaultLoadingComponent,
+  ErrorComponent = DefaultErrorComponent,
+  className
+}) {
+  const { fieldComponents: overrideFieldComponents, localization } = context.usePluginOverrides("form-builder", {
+    localization: index.FORM_BUILDER_LOCALIZATION
+  });
+  const loc = localization || index.FORM_BUILDER_LOCALIZATION;
+  const { form, isLoading, error } = formBuilderHooks.useFormBySlug(slug);
+  const submitMutation = formBuilderHooks.useSubmitForm(slug);
+  const [submitted, setSubmitted] = React.useState(false);
+  const [finalSuccessMessage, setFinalSuccessMessage] = React.useState(
+    null
+  );
+  const mergedFieldComponents = React.useMemo(
+    () => ({
+      ...overrideFieldComponents,
+      ...propFieldComponents
+    }),
+    [overrideFieldComponents, propFieldComponents]
+  );
+  const { zodSchema, fieldConfig } = React.useMemo(() => {
+    if (!form?.schema) {
+      return { zodSchema: null, fieldConfig: {} };
+    }
+    try {
+      const parsedSchema = JSON.parse(form.schema);
+      const zod = schemaConverter.formSchemaToZod(parsedSchema);
+      const config = utils.buildFieldConfigFromJsonSchema(
+        parsedSchema,
+        mergedFieldComponents
+      );
+      return { zodSchema: zod, fieldConfig: config };
+    } catch {
+      return { zodSchema: null, fieldConfig: {} };
+    }
+  }, [form?.schema, mergedFieldComponents]);
+  const handleSubmit = async (data) => {
+    try {
+      const result = await submitMutation.mutateAsync({ data });
+      const message = propSuccessMessage || result.form.successMessage || "Thank you for your submission!";
+      setFinalSuccessMessage(message);
+      setSubmitted(true);
+      onSuccess?.(result);
+      if (result.form.redirectUrl) {
+        window.location.href = result.form.redirectUrl;
+        return;
+      }
+    } catch (err) {
+      onError?.(err);
+    }
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(LoadingComponent, {}) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(ErrorComponent, { error }) });
+  }
+  if (!form) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(ErrorComponent, { error: new Error("Form not found") }) });
+  }
+  if (form.status !== "active") {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(
+      ErrorComponent,
+      {
+        error: new Error("This form is not currently accepting submissions")
+      }
+    ) });
+  }
+  if (!zodSchema) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(ErrorComponent, { error: new Error("Failed to parse form schema") }) });
+  }
+  if (submitted && finalSuccessMessage) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(DefaultSuccessComponent, { message: finalSuccessMessage }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className, "data-testid": "form-renderer", children: /* @__PURE__ */ jsxRuntime.jsx(
+    steppedAutoForm.default,
+    {
+      formSchema: zodSchema,
+      fieldConfig,
+      onSubmit: (values) => handleSubmit(values),
+      isSubmitting: submitMutation.isPending,
+      submitButtonText: submitButtonText || loc.FORM_BUILDER_BUTTON_SUBMIT
+    }
+  ) });
+}
+
+exports.FormRenderer = FormRenderer;

package/dist/packages/better-stack/src/plugins/form-builder/client/components/forms/form-renderer.mjs

@@ -0,0 +1,129 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useMemo } from 'react';
+import { usePluginOverrides } from '@btst/stack/context';
+import SteppedAutoForm from '../../../../../../../ui/src/components/auto-form/stepped-auto-form.mjs';
+import { buildFieldConfigFromJsonSchema } from '../../../../../../../ui/src/components/auto-form/utils.mjs';
+import { formSchemaToZod } from '../../../../../../../ui/src/lib/schema-converter.mjs';
+import { Skeleton } from '../../../../../../../ui/src/components/skeleton.mjs';
+import { AlertCircle, CheckCircle } from 'lucide-react';
+import { useFormBySlug, useSubmitForm } from '../../hooks/form-builder-hooks.mjs';
+import { FORM_BUILDER_LOCALIZATION } from '../../localization/index.mjs';
+
+function DefaultLoadingComponent() {
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }),
+    /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-32" })
+  ] });
+}
+function DefaultErrorComponent({ error }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [
+    /* @__PURE__ */ jsx("div", { className: "rounded-full bg-destructive/10 p-3 mb-4", children: /* @__PURE__ */ jsx(AlertCircle, { className: "h-6 w-6 text-destructive" }) }),
+    /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium text-foreground mb-2", children: "Failed to load form" }),
+    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: error.message || "An unexpected error occurred" })
+  ] });
+}
+function DefaultSuccessComponent({ message }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [
+    /* @__PURE__ */ jsx("div", { className: "rounded-full bg-green-100 dark:bg-green-900 p-3 mb-4", children: /* @__PURE__ */ jsx(CheckCircle, { className: "h-6 w-6 text-green-600 dark:text-green-400" }) }),
+    /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium text-foreground mb-2", children: "Form Submitted" }),
+    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: message })
+  ] });
+}
+function FormRenderer({
+  slug,
+  onSuccess,
+  onError,
+  fieldComponents: propFieldComponents,
+  successMessage: propSuccessMessage,
+  submitButtonText,
+  LoadingComponent = DefaultLoadingComponent,
+  ErrorComponent = DefaultErrorComponent,
+  className
+}) {
+  const { fieldComponents: overrideFieldComponents, localization } = usePluginOverrides("form-builder", {
+    localization: FORM_BUILDER_LOCALIZATION
+  });
+  const loc = localization || FORM_BUILDER_LOCALIZATION;
+  const { form, isLoading, error } = useFormBySlug(slug);
+  const submitMutation = useSubmitForm(slug);
+  const [submitted, setSubmitted] = useState(false);
+  const [finalSuccessMessage, setFinalSuccessMessage] = useState(
+    null
+  );
+  const mergedFieldComponents = useMemo(
+    () => ({
+      ...overrideFieldComponents,
+      ...propFieldComponents
+    }),
+    [overrideFieldComponents, propFieldComponents]
+  );
+  const { zodSchema, fieldConfig } = useMemo(() => {
+    if (!form?.schema) {
+      return { zodSchema: null, fieldConfig: {} };
+    }
+    try {
+      const parsedSchema = JSON.parse(form.schema);
+      const zod = formSchemaToZod(parsedSchema);
+      const config = buildFieldConfigFromJsonSchema(
+        parsedSchema,
+        mergedFieldComponents
+      );
+      return { zodSchema: zod, fieldConfig: config };
+    } catch {
+      return { zodSchema: null, fieldConfig: {} };
+    }
+  }, [form?.schema, mergedFieldComponents]);
+  const handleSubmit = async (data) => {
+    try {
+      const result = await submitMutation.mutateAsync({ data });
+      const message = propSuccessMessage || result.form.successMessage || "Thank you for your submission!";
+      setFinalSuccessMessage(message);
+      setSubmitted(true);
+      onSuccess?.(result);
+      if (result.form.redirectUrl) {
+        window.location.href = result.form.redirectUrl;
+        return;
+      }
+    } catch (err) {
+      onError?.(err);
+    }
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(LoadingComponent, {}) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(ErrorComponent, { error }) });
+  }
+  if (!form) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(ErrorComponent, { error: new Error("Form not found") }) });
+  }
+  if (form.status !== "active") {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(
+      ErrorComponent,
+      {
+        error: new Error("This form is not currently accepting submissions")
+      }
+    ) });
+  }
+  if (!zodSchema) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(ErrorComponent, { error: new Error("Failed to parse form schema") }) });
+  }
+  if (submitted && finalSuccessMessage) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(DefaultSuccessComponent, { message: finalSuccessMessage }) });
+  }
+  return /* @__PURE__ */ jsx("div", { className, "data-testid": "form-renderer", children: /* @__PURE__ */ jsx(
+    SteppedAutoForm,
+    {
+      formSchema: zodSchema,
+      fieldConfig,
+      onSubmit: (values) => handleSubmit(values),
+      isSubmitting: submitMutation.isPending,
+      submitButtonText: submitButtonText || loc.FORM_BUILDER_BUTTON_SUBMIT
+    }
+  ) });
+}
+
+export { FormRenderer };

package/dist/packages/better-stack/src/plugins/form-builder/client/components/loading/form-builder-skeleton.cjs

@@ -0,0 +1,32 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const skeleton = require('../../../../../../../ui/src/components/skeleton.cjs');
+
+function FormBuilderSkeleton() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col", "data-testid": "form-builder-skeleton", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 border-b p-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-48" }),
+      /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-32" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-auto", children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-24" }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-64 border-r p-4 space-y-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-6 w-24" }),
+        Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-12 rounded-lg" }, i))
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 p-4 space-y-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-6 w-32" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-48 rounded-lg" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-24 rounded-lg" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-80 border-l p-4 space-y-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-6 w-20" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-full rounded-lg" })
+      ] })
+    ] })
+  ] });
+}
+
+exports.FormBuilderSkeleton = FormBuilderSkeleton;

package/dist/packages/better-stack/src/plugins/form-builder/client/components/loading/form-builder-skeleton.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Skeleton } from '../../../../../../../ui/src/components/skeleton.mjs';
+
+function FormBuilderSkeleton() {
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col", "data-testid": "form-builder-skeleton", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 border-b p-4", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-48" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-32" }),
+      /* @__PURE__ */ jsx("div", { className: "ml-auto", children: /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-24" }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-1", children: [
+      /* @__PURE__ */ jsxs("div", { className: "w-64 border-r p-4 space-y-4", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-24" }),
+        Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-12 rounded-lg" }, i))
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 p-4 space-y-4", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-32" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-48 rounded-lg" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-24 rounded-lg" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "w-80 border-l p-4 space-y-4", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-6 w-20" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-full rounded-lg" })
+      ] })
+    ] })
+  ] });
+}
+
+export { FormBuilderSkeleton };

package/dist/packages/better-stack/src/plugins/form-builder/client/components/loading/form-list-skeleton.cjs

@@ -0,0 +1,21 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const skeleton = require('../../../../../../../ui/src/components/skeleton.cjs');
+const pageWrapper = require('../shared/page-wrapper.cjs');
+
+function FormListSkeleton() {
+  return /* @__PURE__ */ jsxRuntime.jsx(pageWrapper.PageWrapper, { testId: "form-list-skeleton", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-5xl space-y-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-8 w-32" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-48" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-28" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-16 rounded-lg" }, i)) })
+  ] }) });
+}
+
+exports.FormListSkeleton = FormListSkeleton;

package/dist/packages/better-stack/src/plugins/form-builder/client/components/loading/form-list-skeleton.mjs

@@ -0,0 +1,19 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Skeleton } from '../../../../../../../ui/src/components/skeleton.mjs';
+import { PageWrapper } from '../shared/page-wrapper.mjs';
+
+function FormListSkeleton() {
+  return /* @__PURE__ */ jsx(PageWrapper, { testId: "form-list-skeleton", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-5xl space-y-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-32" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-48" })
+      ] }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-28" })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "space-y-4", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-16 rounded-lg" }, i)) })
+  ] }) });
+}
+
+export { FormListSkeleton };

package/dist/packages/better-stack/src/plugins/form-builder/client/components/loading/submissions-skeleton.cjs

@@ -0,0 +1,34 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const skeleton = require('../../../../../../../ui/src/components/skeleton.cjs');
+const pageWrapper = require('../shared/page-wrapper.cjs');
+
+function SubmissionsSkeleton() {
+  return /* @__PURE__ */ jsxRuntime.jsx(pageWrapper.PageWrapper, { testId: "submissions-skeleton", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-5xl space-y-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-8 w-48" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-64" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-10 w-32" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-lg border", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-24" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-48" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-32" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-20" })
+      ] }) }),
+      Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b p-4 last:border-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-24" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-48" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-32" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-4 w-20" })
+      ] }) }, i))
+    ] })
+  ] }) });
+}
+
+exports.SubmissionsSkeleton = SubmissionsSkeleton;

package/dist/packages/better-stack/src/plugins/form-builder/client/components/loading/submissions-skeleton.mjs

@@ -0,0 +1,32 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Skeleton } from '../../../../../../../ui/src/components/skeleton.mjs';
+import { PageWrapper } from '../shared/page-wrapper.mjs';
+
+function SubmissionsSkeleton() {
+  return /* @__PURE__ */ jsx(PageWrapper, { testId: "submissions-skeleton", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-5xl space-y-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-48" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-64" })
+      ] }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-32" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "rounded-lg border", children: [
+      /* @__PURE__ */ jsx("div", { className: "border-b p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-24" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-48" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-20" })
+      ] }) }),
+      Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx("div", { className: "border-b p-4 last:border-0", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-24" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-48" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-20" })
+      ] }) }, i))
+    ] })
+  ] }) });
+}
+
+export { SubmissionsSkeleton };

package/dist/packages/better-stack/src/plugins/form-builder/client/components/pages/404-page.cjs

@@ -0,0 +1,20 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const button = require('../../../../../../../ui/src/components/button.cjs');
+const context = require('@btst/stack/context');
+
+function NotFoundPage() {
+  const { navigate, Link } = context.usePluginOverrides("form-builder");
+  const basePath = context.useBasePath();
+  const LinkComponent = Link || "a";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-12 px-4 text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-6xl font-bold text-muted-foreground mb-4", children: "404" }),
+    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-medium text-foreground mb-2", children: "Page not found" }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-6 max-w-sm", children: "The page you're looking for doesn't exist or has been moved." }),
+    /* @__PURE__ */ jsxRuntime.jsx(button.Button, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(LinkComponent, { href: `${basePath}/forms`, children: "Back to Forms" }) })
+  ] });
+}
+
+exports.NotFoundPage = NotFoundPage;

package/dist/packages/better-stack/src/plugins/form-builder/client/components/pages/404-page.mjs

@@ -0,0 +1,18 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Button } from '../../../../../../../ui/src/components/button.mjs';
+import { usePluginOverrides, useBasePath } from '@btst/stack/context';
+
+function NotFoundPage() {
+  const { navigate, Link } = usePluginOverrides("form-builder");
+  const basePath = useBasePath();
+  const LinkComponent = Link || "a";
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-12 px-4 text-center", children: [
+    /* @__PURE__ */ jsx("h1", { className: "text-6xl font-bold text-muted-foreground mb-4", children: "404" }),
+    /* @__PURE__ */ jsx("h2", { className: "text-xl font-medium text-foreground mb-2", children: "Page not found" }),
+    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mb-6 max-w-sm", children: "The page you're looking for doesn't exist or has been moved." }),
+    /* @__PURE__ */ jsx(Button, { asChild: true, children: /* @__PURE__ */ jsx(LinkComponent, { href: `${basePath}/forms`, children: "Back to Forms" }) })
+  ] });
+}
+
+export { NotFoundPage };

package/dist/packages/better-stack/src/plugins/form-builder/client/components/pages/form-builder-page.cjs

@@ -0,0 +1,19 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const formBuilderSkeleton = require('../loading/form-builder-skeleton.cjs');
+const reactErrorBoundary = require('react-error-boundary');
+const defaultError = require('../shared/default-error.cjs');
+
+const FormBuilderPage = React.lazy(
+  () => import('./form-builder-page.internal.cjs').then((m) => ({
+    default: m.FormBuilderPage
+  }))
+);
+function FormBuilderPageComponent({ id }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { FallbackComponent: defaultError.DefaultError, children: /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(formBuilderSkeleton.FormBuilderSkeleton, {}), children: /* @__PURE__ */ jsxRuntime.jsx(FormBuilderPage, { id }) }) });
+}
+
+exports.FormBuilderPageComponent = FormBuilderPageComponent;