@btst/stack 1.5.1 → 1.6.0

package/dist/packages/better-stack/src/plugins/cms/client/components/forms/content-form.mjs

@@ -3,7 +3,9 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useEffect, useMemo } from 'react';
 import { z } from 'zod';
 import { toast } from 'sonner';
-import AutoForm, { AutoFormSubmit } from '../../../../../../../ui/src/components/ui/auto-form/index.mjs';
+import SteppedAutoForm from '../../../../../../../ui/src/components/auto-form/stepped-auto-form.mjs';
+import { buildFieldConfigFromJsonSchema as buildFieldConfigFromJsonSchema$1 } from '../../../../../../../ui/src/components/auto-form/utils.mjs';
+import { formSchemaToZod } from '../../../../../../../ui/src/lib/schema-converter.mjs';
 import { Input } from '../../../../../../../ui/src/components/input.mjs';
 import { Label } from '../../../../../../../ui/src/components/label.mjs';
 import { Badge } from '../../../../../../../ui/src/components/badge.mjs';
@@ -12,133 +14,30 @@ import { slugify } from '../../../utils.mjs';
 import { CMS_LOCALIZATION } from '../../localization/index.mjs';
 import { CMSFileUpload } from './file-upload.mjs';
 
-function jsonSchemaToZodWithCoercion(jsonSchema) {
-  const shape = {};
-  const properties = jsonSchema.properties || {};
-  const required = jsonSchema.required || [];
+function buildFieldConfigFromJsonSchema(jsonSchema, uploadImage, fieldComponents) {
+  const baseConfig = buildFieldConfigFromJsonSchema$1(jsonSchema, fieldComponents);
+  const properties = jsonSchema.properties;
+  if (!properties) return baseConfig;
   for (const [key, prop] of Object.entries(properties)) {
-    let fieldSchema;
-    const typeValue = Array.isArray(prop.type) ? prop.type[0] : prop.type;
-    if (prop.enum && Array.isArray(prop.enum) && prop.enum.length > 0) {
-      const stringValues = prop.enum.filter(
-        (v) => typeof v === "string"
-      );
-      if (stringValues.length > 0) {
-        fieldSchema = z.enum(stringValues);
+    if (prop.fieldType === "file" && !fieldComponents?.["file"]) {
+      if (!uploadImage) {
+        baseConfig[key] = {
+          ...baseConfig[key],
+          fieldType: () => /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-destructive bg-destructive/10 p-3 text-sm text-destructive", children: [
+            "File upload requires an ",
+            /* @__PURE__ */ jsx("code", { children: "uploadImage" }),
+            " function in CMS overrides."
+          ] })
+        };
       } else {
-        fieldSchema = z.string();
-      }
-    } else {
-      switch (typeValue) {
-        case "number":
-        case "integer": {
-          let numSchema = z.coerce.number();
-          if (prop.minimum !== void 0) {
-            numSchema = numSchema.min(prop.minimum);
-          }
-          if (prop.maximum !== void 0) {
-            numSchema = numSchema.max(prop.maximum);
-          }
-          fieldSchema = numSchema;
-          break;
-        }
-        case "boolean": {
-          fieldSchema = z.boolean();
-          if (prop.default !== void 0) {
-            fieldSchema = fieldSchema.default(
-              prop.default
-            );
-          }
-          break;
-        }
-        case "string": {
-          if (prop.format === "date" || prop.format === "date-time") {
-            fieldSchema = z.coerce.date();
-          } else {
-            let strSchema = z.string();
-            if (prop.minLength !== void 0) {
-              strSchema = strSchema.min(prop.minLength);
-            }
-            if (prop.maxLength !== void 0) {
-              strSchema = strSchema.max(prop.maxLength);
-            }
-            fieldSchema = strSchema;
-          }
-          break;
-        }
-        default: {
-          fieldSchema = z.string();
-        }
+        baseConfig[key] = {
+          ...baseConfig[key],
+          fieldType: (props) => /* @__PURE__ */ jsx(CMSFileUpload, { ...props, uploadImage })
+        };
       }
     }
-    if (prop.default !== void 0 && typeValue !== "boolean") {
-      fieldSchema = fieldSchema.default(prop.default);
-    }
-    if (!required.includes(key)) {
-      fieldSchema = fieldSchema.optional();
-    }
-    shape[key] = fieldSchema;
   }
-  return z.object(shape);
-}
-const BUILTIN_FIELD_TYPES = [
-  "checkbox",
-  "date",
-  "select",
-  "radio",
-  "switch",
-  "textarea",
-  "number",
-  "file",
-  "fallback"
-];
-function buildFieldConfigFromJsonSchema(jsonSchema, storedFieldConfig, uploadImage, fieldComponents) {
-  const fieldConfig = {};
-  const properties = jsonSchema.properties;
-  if (!properties) return fieldConfig;
-  for (const [key, value] of Object.entries(properties)) {
-    const config = {};
-    if (value.description) {
-      config.description = value.description;
-    }
-    if (value.placeholder) {
-      config.inputProps = {
-        placeholder: value.placeholder
-      };
-    }
-    if (storedFieldConfig?.[key]) {
-      const storedConfig = storedFieldConfig[key];
-      const fieldType = storedConfig.fieldType;
-      if (fieldType) {
-        if (fieldComponents?.[fieldType]) {
-          const CustomComponent = fieldComponents[fieldType];
-          config.fieldType = (props) => /* @__PURE__ */ jsx(CustomComponent, { ...props });
-        } else if (fieldType === "file") {
-          if (!uploadImage) {
-            config.fieldType = () => /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-destructive bg-destructive/10 p-3 text-sm text-destructive", children: [
-              "File upload requires an ",
-              /* @__PURE__ */ jsx("code", { children: "uploadImage" }),
-              " function in CMS overrides."
-            ] });
-          } else {
-            config.fieldType = (props) => /* @__PURE__ */ jsx(CMSFileUpload, { ...props, uploadImage });
-          }
-        } else if (BUILTIN_FIELD_TYPES.includes(
-          fieldType
-        )) {
-          config.fieldType = fieldType;
-        } else {
-          console.warn(
-            `CMS: Unknown fieldType "${fieldType}" for field "${key}". Provide a component via fieldComponents override or use a built-in type.`
-          );
-        }
-      }
-    }
-    if (Object.keys(config).length > 0) {
-      fieldConfig[key] = config;
-    }
-  }
-  return fieldConfig;
+  return baseConfig;
 }
 function findSlugSourceField(jsonSchema) {
   const properties = jsonSchema.properties;
@@ -191,29 +90,16 @@ function ContentForm({
       return {};
     }
   }, [contentType.jsonSchema]);
-  const storedFieldConfig = useMemo(() => {
-    if (!contentType.fieldConfig) return void 0;
-    try {
-      return JSON.parse(contentType.fieldConfig);
-    } catch {
-      return void 0;
-    }
-  }, [contentType.fieldConfig]);
   const zodSchema = useMemo(() => {
     try {
-      return jsonSchemaToZodWithCoercion(jsonSchema);
+      return formSchemaToZod(jsonSchema);
     } catch {
       return z.object({});
     }
   }, [jsonSchema]);
   const fieldConfig = useMemo(
-    () => buildFieldConfigFromJsonSchema(
-      jsonSchema,
-      storedFieldConfig,
-      uploadImage,
-      fieldComponents
-    ),
-    [jsonSchema, storedFieldConfig, uploadImage, fieldComponents]
+    () => buildFieldConfigFromJsonSchema(jsonSchema, uploadImage, fieldComponents),
+    [jsonSchema, uploadImage, fieldComponents]
   );
   const slugSourceField = useMemo(
     () => findSlugSourceField(jsonSchema),
@@ -270,25 +156,24 @@ function ContentForm({
       /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: localization.CMS_LABEL_SLUG_DESCRIPTION })
     ] }),
     /* @__PURE__ */ jsx(
-      AutoForm,
+      SteppedAutoForm,
       {
         formSchema: zodSchema,
         values: formData,
         onValuesChange: handleValuesChange,
         onSubmit: handleSubmit,
         fieldConfig,
-        children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pt-4", children: [
-          /* @__PURE__ */ jsx(AutoFormSubmit, { disabled: isSubmitting, children: isSubmitting ? localization.CMS_STATUS_SAVING : localization.CMS_BUTTON_SAVE }),
-          onCancel && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: onCancel,
-              className: "px-4 py-2 text-sm text-muted-foreground hover:text-foreground",
-              children: localization.CMS_BUTTON_CANCEL
-            }
-          )
-        ] })
+        isSubmitting,
+        submitButtonText: isSubmitting ? localization.CMS_STATUS_SAVING : localization.CMS_BUTTON_SAVE,
+        children: onCancel && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onCancel,
+            className: "px-4 py-2 text-sm text-muted-foreground hover:text-foreground",
+            children: localization.CMS_BUTTON_CANCEL
+          }
+        )
       }
     )
   ] });

package/dist/packages/better-stack/src/plugins/cms/client/components/forms/file-upload.cjs

@@ -8,8 +8,8 @@ const input = require('../../../../../../../ui/src/components/input.cjs');
 const button = require('../../../../../../../ui/src/components/button.cjs');
 const form = require('../../../../../../../ui/src/components/form.cjs');
 const lucideReact = require('lucide-react');
-const label = require('../../../../../../../ui/src/components/ui/auto-form/common/label.cjs');
-const tooltip = require('../../../../../../../ui/src/components/ui/auto-form/common/tooltip.cjs');
+const label = require('../../../../../../../ui/src/components/auto-form/common/label.cjs');
+const tooltip = require('../../../../../../../ui/src/components/auto-form/common/tooltip.cjs');
 
 function CMSFileUpload({
   label: label$1,

package/dist/packages/better-stack/src/plugins/cms/client/components/forms/file-upload.mjs

@@ -6,8 +6,8 @@ import { Input } from '../../../../../../../ui/src/components/input.mjs';
 import { Button } from '../../../../../../../ui/src/components/button.mjs';
 import { FormItem, FormControl, FormMessage } from '../../../../../../../ui/src/components/form.mjs';
 import { Loader2, Trash2 } from 'lucide-react';
-import AutoFormLabel from '../../../../../../../ui/src/components/ui/auto-form/common/label.mjs';
-import AutoFormTooltip from '../../../../../../../ui/src/components/ui/auto-form/common/tooltip.mjs';
+import AutoFormLabel from '../../../../../../../ui/src/components/auto-form/common/label.mjs';
+import AutoFormTooltip from '../../../../../../../ui/src/components/auto-form/common/tooltip.mjs';
 
 function CMSFileUpload({
   label,

package/dist/packages/better-stack/src/plugins/cms/db.cjs

@@ -27,6 +27,10 @@ const cmsSchema = db.createDbPlugin("cms", {
         type: "string",
         required: false
       },
+      autoFormVersion: {
+        type: "number",
+        required: false
+      },
       createdAt: {
         type: "date",
         defaultValue: () => /* @__PURE__ */ new Date()

package/dist/packages/better-stack/src/plugins/cms/db.mjs

@@ -25,6 +25,10 @@ const cmsSchema = createDbPlugin("cms", {
         type: "string",
         required: false
       },
+      autoFormVersion: {
+        type: "number",
+        required: false
+      },
       createdAt: {
         type: "date",
         defaultValue: () => /* @__PURE__ */ new Date()

package/dist/packages/better-stack/src/plugins/cms/schemas.cjs

@@ -23,7 +23,6 @@ const contentTypeResponseSchema = z.z.object({
   slug: z.z.string(),
   description: z.z.string().nullable().optional(),
   jsonSchema: z.z.string(),
-  fieldConfig: z.z.string().nullable().optional(),
   createdAt: z.z.string(),
   updatedAt: z.z.string()
 });

package/dist/packages/better-stack/src/plugins/cms/schemas.mjs

@@ -21,7 +21,6 @@ const contentTypeResponseSchema = z.object({
   slug: z.string(),
   description: z.string().nullable().optional(),
   jsonSchema: z.string(),
-  fieldConfig: z.string().nullable().optional(),
   createdAt: z.string(),
   updatedAt: z.string()
 });