feat(form): Add editor to auto form

apps/docs/content/docs/ui/auto-form.mdx

@@ -12,6 +12,7 @@ description: Component creates form based on Zod schemas & react-hook-form with
 ```tsx
 import { AutoForm } from "@vitnode/core/components/form/auto-form";
 import { AutoFormCheckbox } from "@vitnode/core/components/form/fields/checkbox";
+import { AutoFormEditor } from "@vitnode/core/components/form/fields/editor";
 import { AutoFormInput } from "@vitnode/core/components/form/fields/input";
 import { AutoFormSelect } from "@vitnode/core/components/form/fields/select";
 import { AutoFormTextarea } from "@vitnode/core/components/form/fields/textarea";
@@ -40,6 +41,10 @@ const formSchema = z.object({
     message: "You must accept the terms and conditions",
   }),
   description: z.string().min(10, "Description must be at least 10 characters"),
+  content: z
+    .string()
+    .min(1, "Content is required")
+    .default("<p>Write your content here...</p>"),
   search: z.string().optional(),
 });
 ```
@@ -119,6 +124,16 @@ const formSchema = z.object({
         />
       ),
     },
+    {
+      id: "content",
+      component: props => (
+        <AutoFormEditor
+          {...props}
+          description="Rich text content powered by the Editor."
+          label="Content"
+        />
+      ),
+    },
     {
       id: "search",
       component: props => (

apps/docs/content/docs/ui/editor.mdx

@@ -0,0 +1,112 @@
+---
+title: Editor
+description: Rich text editor built on TipTap for editing and rendering HTML content.
+---
+
+## Preview
+
+<Preview name="editor" />
+
+## Usage
+
+import { Tab, Tabs } from "fumadocs-ui/components/tabs";
+
+<Tabs items={['Auto Form', 'Manual']}>
+  <Tab value="Auto Form">
+
+```ts
+import { z } from "zod";
+import { AutoForm } from "@vitnode/core/components/form/auto-form";
+import { AutoFormEditor } from "@vitnode/core/components/form/fields/editor";
+```
+
+```ts
+const formSchema = z.object({
+  content: z
+    .string()
+    .min(1, "Content is required")
+    .default("<p>Write your content here...</p>"),
+});
+```
+
+```tsx
+<AutoForm
+  formSchema={formSchema}
+  fields={[
+    {
+      id: "content",
+      component: props => (
+        <AutoFormEditor
+          {...props}
+          description="Rich text content powered by the Editor."
+          label="Content"
+        />
+      ),
+    },
+  ]}
+/>
+```
+
+  </Tab>
+
+  <Tab value="Manual">
+
+```ts
+import { Editor } from "@vitnode/core/components/ui/editor";
+```
+
+The `Editor` is uncontrolled by default — pass `value` as the initial HTML and
+listen for changes with `onChange`, which receives the current HTML string:
+
+```tsx
+const [content, setContent] = useState("<p>Hello World! 🌎️</p>");
+
+<Editor value={content} onChange={setContent} />;
+```
+
+  </Tab>
+</Tabs>
+
+## Rendering Content
+
+Use `EditorContent` to render the stored HTML as read-only content outside of
+the editor (e.g. on a public page):
+
+```ts
+import { EditorContent } from "@vitnode/core/components/ui/editor-content";
+```
+
+```tsx
+<EditorContent content="<h2>Title</h2><p>Hello World! 🌎️</p>" />
+```
+
+## Props
+
+import { TypeTable } from "fumadocs-ui/components/type-table";
+
+<TypeTable
+  type={{
+    value: {
+      description: "Initial HTML content rendered inside the editor.",
+      type: "string",
+      default: '""',
+    },
+    onChange: {
+      description:
+        "Called on every change with the current content as an HTML string.",
+      type: "(value: string) => void",
+      default: "",
+    },
+    disableScroll: {
+      description:
+        "Disables the internal max-height scroll area so the editor grows with its content.",
+      type: "boolean",
+      default: "false",
+    },
+    className: {
+      description: "Additional classes applied to the editor wrapper.",
+      type: "string",
+      default: "",
+    },
+  }}
+/>

apps/docs/content/docs/ui/meta.json

@@ -16,6 +16,7 @@
     "auto-form",
     "checkbox",
     "combobox",
+    "editor",
     "input",
     "input-group",
     "radio-group",

apps/docs/src/examples/auto-form.tsx

@@ -2,6 +2,7 @@
 
 import { AutoForm } from "@vitnode/core/components/form/auto-form";
 import { AutoFormCheckbox } from "@vitnode/core/components/form/fields/checkbox";
+import { AutoFormEditor } from "@vitnode/core/components/form/fields/editor";
 import { AutoFormInput } from "@vitnode/core/components/form/fields/input";
 import { AutoFormSelect } from "@vitnode/core/components/form/fields/select";
 import { AutoFormTextarea } from "@vitnode/core/components/form/fields/textarea";
@@ -22,6 +23,10 @@ export default function AutoFormExample() {
     description: z
       .string()
       .min(10, "Description must be at least 10 characters"),
+    content: z
+      .string()
+      .min(1, "Content is required")
+      .default("<p>Write your content here...</p>"),
     search: z.string().optional(),
   });
 
@@ -79,6 +84,16 @@ export default function AutoFormExample() {
             />
           ),
         },
+        {
+          id: "content",
+          component: props => (
+            <AutoFormEditor
+              description="Rich text content powered by the Editor."
+              label="Content"
+              {...props}
+            />
+          ),
+        },
         {
           id: "search",
           component: props => (

apps/docs/src/examples/editor.tsx

@@ -0,0 +1,32 @@
+"use client";
+
+import { AutoForm } from "@vitnode/core/components/form/auto-form";
+import { AutoFormEditor } from "@vitnode/core/components/form/fields/editor";
+import { z } from "zod";
+
+export default function EditorExample() {
+  const formSchema = z.object({
+    content: z
+      .string()
+      .min(1, "Content is required")
+      .default("<p>Write your content here...</p>"),
+  });
+
+  return (
+    <AutoForm
+      fields={[
+        {
+          id: "content",
+          component: props => (
+            <AutoFormEditor
+              description="Rich text content powered by the Editor."
+              label="Content"
+              {...props}
+            />
+          ),
+        },
+      ]}
+      formSchema={formSchema}
+    />
+  );
+}

packages/create-vitnode-app/copy-of-vitnode-plugin/root/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",

packages/create-vitnode-app/copy-of-vitnode-plugin/root/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/create-vitnode-app/package.json

@@ -22,7 +22,7 @@
     "eslint-react"
   ],
   "scripts": {
-    "build:scripts": "tsc && node dist/src/prepare/prepare.js",
+    "build:scripts": "tsc -p tsconfig.build.json && node dist/src/prepare/prepare.js",
     "start:scripts": "node dist/src/index.js",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix"

packages/create-vitnode-app/src/plugin/create/create-package-json.ts

@@ -27,8 +27,8 @@ export const createPluginPackageJSON = async ({
     type: "module",
     scripts: {
       "build:plugins":
-        "tsc && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.json",
-      dev: 'concurrently "tsc -w --preserveWatchOutput" "swc src -d dist --config-file .swcrc -w" "tsc-alias -w" "vitnode plugin --w"',
+        "tsc -p tsconfig.build.json && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.build.json",
+      dev: 'concurrently "tsc -w -p tsconfig.build.json --preserveWatchOutput" "swc src -d dist --config-file .swcrc -w" "tsc-alias -w -p tsconfig.build.json" "vitnode plugin --w"',
       "dev:email": "email dev --dir src/emails",
       ...withIf(eslint, {
         lint: "turbo lint",

packages/create-vitnode-app/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "dist", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/node-cron/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",

packages/node-cron/package.json

@@ -25,8 +25,8 @@
     }
   },
   "scripts": {
-    "build:plugins": "tsc && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.json",
-    "dev:plugins": "concurrently \"tsc -w --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w\"",
+    "build:plugins": "tsc -p tsconfig.build.json && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.build.json",
+    "dev:plugins": "concurrently \"tsc -w -p tsconfig.build.json --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w -p tsconfig.build.json\"",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix"
   },

packages/node-cron/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/nodemailer/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",

packages/nodemailer/package.json

@@ -24,8 +24,8 @@
     }
   },
   "scripts": {
-    "build:plugins": "tsc && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.json",
-    "dev:plugins": "concurrently \"tsc -w --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w\"",
+    "build:plugins": "tsc -p tsconfig.build.json && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.build.json",
+    "dev:plugins": "concurrently \"tsc -w -p tsconfig.build.json --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w -p tsconfig.build.json\"",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix"
   },

packages/nodemailer/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/resend/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",

packages/resend/package.json

@@ -23,8 +23,8 @@
     }
   },
   "scripts": {
-    "build:plugins": "tsc && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.json",
-    "dev:plugins": "concurrently \"tsc -w --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w\"",
+    "build:plugins": "tsc -p tsconfig.build.json && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.build.json",
+    "dev:plugins": "concurrently \"tsc -w -p tsconfig.build.json --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w -p tsconfig.build.json\"",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix"
   },

packages/resend/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/s3/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",

packages/s3/package.json

@@ -25,8 +25,8 @@
     }
   },
   "scripts": {
-    "build:plugins": "tsc && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.json",
-    "dev:plugins": "concurrently \"tsc -w --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w\"",
+    "build:plugins": "tsc -p tsconfig.build.json && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.build.json",
+    "dev:plugins": "concurrently \"tsc -w -p tsconfig.build.json --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w -p tsconfig.build.json\"",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix"
   },

packages/s3/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/supabase-storage/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",

packages/supabase-storage/package.json

@@ -24,8 +24,8 @@
     }
   },
   "scripts": {
-    "build:plugins": "tsc && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.json",
-    "dev:plugins": "concurrently \"tsc -w --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w\"",
+    "build:plugins": "tsc -p tsconfig.build.json && swc src -d dist --config-file .swcrc && tsc-alias -p tsconfig.build.json",
+    "dev:plugins": "concurrently \"tsc -w -p tsconfig.build.json --preserveWatchOutput\" \"swc src -d dist --config-file .swcrc -w\" \"tsc-alias -w -p tsconfig.build.json\"",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix"
   },

packages/supabase-storage/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "./tsconfig.json",
+  "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"]
+}

packages/vitnode/.swcrc

@@ -1,5 +1,6 @@
 {
   "$schema": "https://swc.rs/schema.json",
+  "exclude": ["\\.test\\.tsx?$"],
   "minify": true,
   "jsc": {
     "baseUrl": "./",