@btst/plugin-form-builder 0.0.0-stage → 1.0.0

package/dist/api/plugin.cjs

@@ -0,0 +1,201 @@
+'use strict';
+
+const api = require('@btst/stack/plugins/api');
+const db = require('../db.cjs');
+const schemas = require('../schemas.cjs');
+const getters = require('./getters.cjs');
+const operations = require('./operations.cjs');
+const queryKeyDefs = require('./query-key-defs.cjs');
+
+function createFormBuilderPrefetchForRoute(adapter) {
+  return async function prefetchForRoute(key, queryClient, params) {
+    switch (key) {
+      case "formList": {
+        const result = await getters.getAllForms(adapter, { limit: 20, offset: 0 });
+        queryClient.setQueryData(
+          queryKeyDefs.FORM_QUERY_KEYS.formsList({ limit: 20, offset: 0 }),
+          {
+            pages: [
+              {
+                items: result.items,
+                total: result.total,
+                limit: result.limit ?? 20,
+                offset: result.offset ?? 0
+              }
+            ],
+            pageParams: [0]
+          }
+        );
+        break;
+      }
+      case "editForm": {
+        const id = params?.id ?? "";
+        if (id) {
+          queryClient.setQueryData(
+            queryKeyDefs.FORM_QUERY_KEYS.formForUpdate(id),
+            await getters.getFormById(adapter, id)
+          );
+        }
+        break;
+      }
+      case "submissions": {
+        const id = params?.id ?? "";
+        if (id) {
+          const [form, result] = await Promise.all([
+            getters.getFormById(adapter, id),
+            getters.getFormSubmissions(adapter, id, { limit: 20, offset: 0 })
+          ]);
+          const formContext = form ? {
+            id: form.id,
+            name: form.name,
+            ...form.createdBy ? { createdBy: form.createdBy } : {}
+          } : null;
+          queryClient.setQueryData(
+            queryKeyDefs.FORM_QUERY_KEYS.submissionsList({
+              formId: id,
+              limit: 20,
+              offset: 0
+            }),
+            {
+              pages: [
+                {
+                  form: formContext,
+                  items: result.items.map(getters.serializeFormSubmissionSummary),
+                  total: result.total,
+                  limit: result.limit ?? 20,
+                  offset: result.offset ?? 0
+                }
+              ],
+              pageParams: [0]
+            }
+          );
+        }
+        break;
+      }
+    }
+  };
+}
+const formBuilderBackendPlugin = (config = {}) => api.defineBackendPlugin({
+  id: "formBuilder",
+  dbPlugin: db.formBuilderSchema,
+  operations: (adapter) => operations.createFormBuilderOperations(adapter, config.hooks),
+  /** Lower-level SSG helper that intentionally bypasses auth and hooks. */
+  raw: (adapter) => ({
+    prefetchForRoute: createFormBuilderPrefetchForRoute(adapter)
+  }),
+  routes: (_adapter, _context, operations$1) => {
+    const listForms = api.createEndpoint(
+      "/forms",
+      { method: "GET", query: schemas.listFormsQuerySchema, requireRequest: true },
+      operations$1.listForms.route((ctx) => ctx.query)
+    );
+    const getFormBySlugEndpoint = api.createEndpoint(
+      "/forms/:slug",
+      {
+        method: "GET",
+        params: operations.GetFormBySlugOperationInputSchema,
+        requireRequest: true
+      },
+      operations$1.getFormBySlug.route((ctx) => ctx.params)
+    );
+    const getFormByIdEndpoint = api.createEndpoint(
+      "/forms/id/:id",
+      {
+        method: "GET",
+        params: operations.GetFormByIdOperationInputSchema,
+        requireRequest: true
+      },
+      operations$1.getFormById.route((ctx) => ctx.params)
+    );
+    const getFormForUpdateEndpoint = api.createEndpoint(
+      "/forms/id/:id/edit",
+      {
+        method: "GET",
+        params: operations.GetFormForUpdateOperationInputSchema,
+        requireRequest: true
+      },
+      operations$1.getFormForUpdate.route((ctx) => ctx.params)
+    );
+    const createForm = api.createEndpoint(
+      "/forms",
+      { method: "POST", body: schemas.createFormSchema, requireRequest: true },
+      operations$1.createForm.route((ctx) => ctx.body)
+    );
+    const updateForm = api.createEndpoint(
+      "/forms/:id",
+      { method: "PUT", body: schemas.updateFormSchema, requireRequest: true },
+      operations$1.updateForm.route((ctx) => ({
+        id: ctx.params.id,
+        data: ctx.body
+      }))
+    );
+    const deleteForm = api.createEndpoint(
+      "/forms/:id",
+      { method: "DELETE", requireRequest: true },
+      operations$1.deleteForm.route((ctx) => ({ id: ctx.params.id }))
+    );
+    const submitForm = api.createEndpoint(
+      "/forms/:slug/submit",
+      {
+        method: "POST",
+        body: operations.SubmitFormOperationInputSchema.pick({ data: true }),
+        requireRequest: true
+      },
+      operations$1.submitForm.route((ctx) => ({
+        slug: ctx.params.slug,
+        data: ctx.body.data
+      }))
+    );
+    const listSubmissions = api.createEndpoint(
+      "/forms/:formId/submissions",
+      {
+        method: "GET",
+        query: schemas.listSubmissionsQuerySchema,
+        requireRequest: true
+      },
+      operations$1.listSubmissions.route((ctx) => ({
+        formId: ctx.params.formId,
+        query: ctx.query
+      }))
+    );
+    const getSubmission = api.createEndpoint(
+      "/forms/:formId/submissions/:subId",
+      { method: "GET", requireRequest: true },
+      operations$1.getSubmission.route((ctx) => ({
+        formId: ctx.params.formId,
+        submissionId: ctx.params.subId
+      }))
+    );
+    const deleteSubmission = api.createEndpoint(
+      "/forms/:formId/submissions/:subId",
+      { method: "DELETE", requireRequest: true },
+      operations$1.deleteSubmission.route((ctx) => ({
+        formId: ctx.params.formId,
+        submissionId: ctx.params.subId
+      }))
+    );
+    return {
+      listForms,
+      getFormBySlug: getFormBySlugEndpoint,
+      getFormById: getFormByIdEndpoint,
+      getFormForUpdate: getFormForUpdateEndpoint,
+      createForm,
+      updateForm,
+      deleteForm,
+      submitForm,
+      listSubmissions,
+      getSubmission,
+      deleteSubmission
+    };
+  }
+});
+
+exports.DeleteFormOperationInputSchema = operations.DeleteFormOperationInputSchema;
+exports.GetFormByIdOperationInputSchema = operations.GetFormByIdOperationInputSchema;
+exports.GetFormBySlugOperationInputSchema = operations.GetFormBySlugOperationInputSchema;
+exports.GetFormForUpdateOperationInputSchema = operations.GetFormForUpdateOperationInputSchema;
+exports.GetSubmissionOperationInputSchema = operations.GetSubmissionOperationInputSchema;
+exports.ListSubmissionsOperationInputSchema = operations.ListSubmissionsOperationInputSchema;
+exports.SubmitFormOperationInputSchema = operations.SubmitFormOperationInputSchema;
+exports.UpdateFormOperationInputSchema = operations.UpdateFormOperationInputSchema;
+exports.formBuilderBackendPlugin = formBuilderBackendPlugin;

package/dist/api/plugin.mjs

@@ -0,0 +1,192 @@
+import { defineBackendPlugin, createEndpoint } from '@btst/stack/plugins/api';
+import { formBuilderSchema } from '../db.mjs';
+import { listFormsQuerySchema, createFormSchema, updateFormSchema, listSubmissionsQuerySchema } from '../schemas.mjs';
+import { getFormById, getFormSubmissions, serializeFormSubmissionSummary, getAllForms } from './getters.mjs';
+import { GetFormBySlugOperationInputSchema, GetFormByIdOperationInputSchema, GetFormForUpdateOperationInputSchema, SubmitFormOperationInputSchema, createFormBuilderOperations } from './operations.mjs';
+export { DeleteFormOperationInputSchema, GetSubmissionOperationInputSchema, ListSubmissionsOperationInputSchema, UpdateFormOperationInputSchema } from './operations.mjs';
+import { FORM_QUERY_KEYS } from './query-key-defs.mjs';
+
+function createFormBuilderPrefetchForRoute(adapter) {
+  return async function prefetchForRoute(key, queryClient, params) {
+    switch (key) {
+      case "formList": {
+        const result = await getAllForms(adapter, { limit: 20, offset: 0 });
+        queryClient.setQueryData(
+          FORM_QUERY_KEYS.formsList({ limit: 20, offset: 0 }),
+          {
+            pages: [
+              {
+                items: result.items,
+                total: result.total,
+                limit: result.limit ?? 20,
+                offset: result.offset ?? 0
+              }
+            ],
+            pageParams: [0]
+          }
+        );
+        break;
+      }
+      case "editForm": {
+        const id = params?.id ?? "";
+        if (id) {
+          queryClient.setQueryData(
+            FORM_QUERY_KEYS.formForUpdate(id),
+            await getFormById(adapter, id)
+          );
+        }
+        break;
+      }
+      case "submissions": {
+        const id = params?.id ?? "";
+        if (id) {
+          const [form, result] = await Promise.all([
+            getFormById(adapter, id),
+            getFormSubmissions(adapter, id, { limit: 20, offset: 0 })
+          ]);
+          const formContext = form ? {
+            id: form.id,
+            name: form.name,
+            ...form.createdBy ? { createdBy: form.createdBy } : {}
+          } : null;
+          queryClient.setQueryData(
+            FORM_QUERY_KEYS.submissionsList({
+              formId: id,
+              limit: 20,
+              offset: 0
+            }),
+            {
+              pages: [
+                {
+                  form: formContext,
+                  items: result.items.map(serializeFormSubmissionSummary),
+                  total: result.total,
+                  limit: result.limit ?? 20,
+                  offset: result.offset ?? 0
+                }
+              ],
+              pageParams: [0]
+            }
+          );
+        }
+        break;
+      }
+    }
+  };
+}
+const formBuilderBackendPlugin = (config = {}) => defineBackendPlugin({
+  id: "formBuilder",
+  dbPlugin: formBuilderSchema,
+  operations: (adapter) => createFormBuilderOperations(adapter, config.hooks),
+  /** Lower-level SSG helper that intentionally bypasses auth and hooks. */
+  raw: (adapter) => ({
+    prefetchForRoute: createFormBuilderPrefetchForRoute(adapter)
+  }),
+  routes: (_adapter, _context, operations) => {
+    const listForms = createEndpoint(
+      "/forms",
+      { method: "GET", query: listFormsQuerySchema, requireRequest: true },
+      operations.listForms.route((ctx) => ctx.query)
+    );
+    const getFormBySlugEndpoint = createEndpoint(
+      "/forms/:slug",
+      {
+        method: "GET",
+        params: GetFormBySlugOperationInputSchema,
+        requireRequest: true
+      },
+      operations.getFormBySlug.route((ctx) => ctx.params)
+    );
+    const getFormByIdEndpoint = createEndpoint(
+      "/forms/id/:id",
+      {
+        method: "GET",
+        params: GetFormByIdOperationInputSchema,
+        requireRequest: true
+      },
+      operations.getFormById.route((ctx) => ctx.params)
+    );
+    const getFormForUpdateEndpoint = createEndpoint(
+      "/forms/id/:id/edit",
+      {
+        method: "GET",
+        params: GetFormForUpdateOperationInputSchema,
+        requireRequest: true
+      },
+      operations.getFormForUpdate.route((ctx) => ctx.params)
+    );
+    const createForm = createEndpoint(
+      "/forms",
+      { method: "POST", body: createFormSchema, requireRequest: true },
+      operations.createForm.route((ctx) => ctx.body)
+    );
+    const updateForm = createEndpoint(
+      "/forms/:id",
+      { method: "PUT", body: updateFormSchema, requireRequest: true },
+      operations.updateForm.route((ctx) => ({
+        id: ctx.params.id,
+        data: ctx.body
+      }))
+    );
+    const deleteForm = createEndpoint(
+      "/forms/:id",
+      { method: "DELETE", requireRequest: true },
+      operations.deleteForm.route((ctx) => ({ id: ctx.params.id }))
+    );
+    const submitForm = createEndpoint(
+      "/forms/:slug/submit",
+      {
+        method: "POST",
+        body: SubmitFormOperationInputSchema.pick({ data: true }),
+        requireRequest: true
+      },
+      operations.submitForm.route((ctx) => ({
+        slug: ctx.params.slug,
+        data: ctx.body.data
+      }))
+    );
+    const listSubmissions = createEndpoint(
+      "/forms/:formId/submissions",
+      {
+        method: "GET",
+        query: listSubmissionsQuerySchema,
+        requireRequest: true
+      },
+      operations.listSubmissions.route((ctx) => ({
+        formId: ctx.params.formId,
+        query: ctx.query
+      }))
+    );
+    const getSubmission = createEndpoint(
+      "/forms/:formId/submissions/:subId",
+      { method: "GET", requireRequest: true },
+      operations.getSubmission.route((ctx) => ({
+        formId: ctx.params.formId,
+        submissionId: ctx.params.subId
+      }))
+    );
+    const deleteSubmission = createEndpoint(
+      "/forms/:formId/submissions/:subId",
+      { method: "DELETE", requireRequest: true },
+      operations.deleteSubmission.route((ctx) => ({
+        formId: ctx.params.formId,
+        submissionId: ctx.params.subId
+      }))
+    );
+    return {
+      listForms,
+      getFormBySlug: getFormBySlugEndpoint,
+      getFormById: getFormByIdEndpoint,
+      getFormForUpdate: getFormForUpdateEndpoint,
+      createForm,
+      updateForm,
+      deleteForm,
+      submitForm,
+      listSubmissions,
+      getSubmission,
+      deleteSubmission
+    };
+  }
+});
+
+export { GetFormByIdOperationInputSchema, GetFormBySlugOperationInputSchema, GetFormForUpdateOperationInputSchema, SubmitFormOperationInputSchema, formBuilderBackendPlugin };

package/dist/api/query-key-defs.cjs

@@ -0,0 +1,43 @@
+'use strict';
+
+function formsListDiscriminator(params) {
+  return {
+    status: params?.status,
+    limit: params?.limit ?? 20,
+    offset: params?.offset ?? 0,
+    search: params?.search !== void 0 && params.search.trim() === "" ? void 0 : params?.search
+  };
+}
+function submissionsListDiscriminator(params) {
+  return {
+    formId: params.formId,
+    limit: params.limit ?? 20,
+    offset: params.offset ?? 0
+  };
+}
+const FORM_QUERY_KEYS = {
+  /**
+   * Key for forms.list(params) query.
+   * Full key: ["forms", "list", "list", { status, limit, offset }]
+   */
+  formsList: (params) => ["forms", "list", "list", formsListDiscriminator(params)],
+  /**
+   * Key for forms.byId(id) query.
+   * Full key: ["forms", "byId", "byId", id]
+   */
+  formById: (id) => ["forms", "byId", "byId", id],
+  /**
+   * Key for forms.forUpdate(id) query.
+   * Full key: ["forms", "forUpdate", "forUpdate", id]
+   */
+  formForUpdate: (id) => ["forms", "forUpdate", "forUpdate", id],
+  /**
+   * Key for formSubmissions.list(params) query.
+   * Full key: ["formSubmissions", "list", { formId, limit, offset }]
+   */
+  submissionsList: (params) => ["formSubmissions", "list", submissionsListDiscriminator(params)]
+};
+
+exports.FORM_QUERY_KEYS = FORM_QUERY_KEYS;
+exports.formsListDiscriminator = formsListDiscriminator;
+exports.submissionsListDiscriminator = submissionsListDiscriminator;

package/dist/api/query-key-defs.mjs

@@ -0,0 +1,39 @@
+function formsListDiscriminator(params) {
+  return {
+    status: params?.status,
+    limit: params?.limit ?? 20,
+    offset: params?.offset ?? 0,
+    search: params?.search !== void 0 && params.search.trim() === "" ? void 0 : params?.search
+  };
+}
+function submissionsListDiscriminator(params) {
+  return {
+    formId: params.formId,
+    limit: params.limit ?? 20,
+    offset: params.offset ?? 0
+  };
+}
+const FORM_QUERY_KEYS = {
+  /**
+   * Key for forms.list(params) query.
+   * Full key: ["forms", "list", "list", { status, limit, offset }]
+   */
+  formsList: (params) => ["forms", "list", "list", formsListDiscriminator(params)],
+  /**
+   * Key for forms.byId(id) query.
+   * Full key: ["forms", "byId", "byId", id]
+   */
+  formById: (id) => ["forms", "byId", "byId", id],
+  /**
+   * Key for forms.forUpdate(id) query.
+   * Full key: ["forms", "forUpdate", "forUpdate", id]
+   */
+  formForUpdate: (id) => ["forms", "forUpdate", "forUpdate", id],
+  /**
+   * Key for formSubmissions.list(params) query.
+   * Full key: ["formSubmissions", "list", { formId, limit, offset }]
+   */
+  submissionsList: (params) => ["formSubmissions", "list", submissionsListDiscriminator(params)]
+};
+
+export { FORM_QUERY_KEYS, formsListDiscriminator, submissionsListDiscriminator };

package/dist/client/components/forms/form-renderer.cjs

@@ -0,0 +1,193 @@
+'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 helpers = require('../../../ui/src/components/auto-form/helpers.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 permissions = require('../../../permissions.cjs');
+const constants = require('../../constants.cjs');
+const utils = require('../../../utils.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 }) {
+  const t = context.useTranslate();
+  const { localization } = context.usePluginOverrides(
+    constants.FORM_BUILDER_PLUGIN_ID
+  );
+  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: localization?.FORM_BUILDER_RENDERER_LOAD_FAILED ?? t("formBuilder.renderer.loadFailed", "Failed to load form") }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground max-w-sm", children: error.message || (localization?.FORM_BUILDER_RENDERER_UNEXPECTED_ERROR ?? t(
+      "formBuilder.renderer.unexpectedError",
+      "An unexpected error occurred"
+    )) })
+  ] });
+}
+function DefaultSuccessComponent({ message }) {
+  const t = context.useTranslate();
+  const { localization } = context.usePluginOverrides(
+    constants.FORM_BUILDER_PLUGIN_ID
+  );
+  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: localization?.FORM_BUILDER_RENDERER_SUBMITTED_TITLE ?? t("formBuilder.renderer.submittedTitle", "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 t = context.useTranslate();
+  const {
+    fieldComponents: overrideFieldComponents,
+    localization,
+    classNames
+  } = context.usePluginOverrides(constants.FORM_BUILDER_PLUGIN_ID);
+  const formClassName = utils.cn(className, classNames?.form);
+  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 = helpers.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 || (localization?.FORM_BUILDER_RENDERER_THANK_YOU ?? t("formBuilder.renderer.thankYou", "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: formClassName, children: /* @__PURE__ */ jsxRuntime.jsx(LoadingComponent, {}) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: formClassName, children: /* @__PURE__ */ jsxRuntime.jsx(ErrorComponent, { error }) });
+  }
+  if (!form) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: formClassName, children: /* @__PURE__ */ jsxRuntime.jsx(
+      ErrorComponent,
+      {
+        error: new Error(
+          localization?.FORM_BUILDER_RENDERER_NOT_FOUND ?? t("formBuilder.renderer.notFound", "Form not found")
+        )
+      }
+    ) });
+  }
+  if (form.status !== "active") {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: formClassName, children: /* @__PURE__ */ jsxRuntime.jsx(
+      ErrorComponent,
+      {
+        error: new Error(
+          localization?.FORM_BUILDER_RENDERER_INACTIVE ?? t(
+            "formBuilder.renderer.inactive",
+            "This form is not currently accepting submissions"
+          )
+        )
+      }
+    ) });
+  }
+  if (!zodSchema) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: formClassName, children: /* @__PURE__ */ jsxRuntime.jsx(
+      ErrorComponent,
+      {
+        error: new Error(
+          localization?.FORM_BUILDER_RENDERER_SCHEMA_ERROR ?? t(
+            "formBuilder.renderer.schemaError",
+            "Failed to parse form schema"
+          )
+        )
+      }
+    ) });
+  }
+  if (submitted && finalSuccessMessage) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: formClassName, children: /* @__PURE__ */ jsxRuntime.jsx(DefaultSuccessComponent, { message: finalSuccessMessage }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    context.PermissionAccess,
+    {
+      permission: permissions.formBuilderPermissions.form.render({
+        slug: form.slug,
+        exists: true,
+        formId: form.id,
+        ...form.createdBy ? { ownerId: form.createdBy } : {},
+        status: form.status
+      }),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        context.PermissionAccess,
+        {
+          permission: permissions.formBuilderPermissions.submission.create({
+            slug: form.slug,
+            exists: true,
+            formId: form.id,
+            ...form.createdBy ? { ownerId: form.createdBy } : {},
+            status: form.status
+          }),
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: formClassName, "data-testid": "form-renderer", children: /* @__PURE__ */ jsxRuntime.jsx(
+            steppedAutoForm.SteppedAutoForm,
+            {
+              formSchema: zodSchema,
+              fieldConfig,
+              onSubmit: (values) => handleSubmit(values),
+              isSubmitting: submitMutation.isPending,
+              submitButtonText: submitButtonText || (localization?.FORM_BUILDER_BUTTON_SUBMIT ?? t("formBuilder.common.buttonSubmit", "Submit"))
+            }
+          ) })
+        }
+      )
+    }
+  );
+}
+
+exports.FormRenderer = FormRenderer;