"use client"; import { toast } from "sonner"; import { createSchema, InferType } from "@buildnbuzz/buzzform"; import { Form, FormContent, FormFields, FormSubmit, FormReset, FormActions, } from "@/registry/base/form"; import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; // Blog post form with tags for categories const blogPostSchema = createSchema([ { type: "text", name: "title", label: "Post Title", placeholder: "Enter your post title...", required: true, minLength: 5, maxLength: 100, }, { type: "tags", name: "tags", label: "Tags", placeholder: "Add tags and press enter...", description: "Add up to 5 tags to categorize your post.", required: true, minTags: 1, maxTags: 5, maxTagLength: 20, ui: { delimiters: ["enter", "comma"], variant: "chips", }, }, { type: "tags", name: "keywords", label: "SEO Keywords", placeholder: "Add keywords separated by comma or space...", description: "Keywords help with search engine optimization.", maxTags: 10, ui: { delimiters: ["enter", "comma", "space"], variant: "pills", copyable: true, }, }, { type: "textarea", name: "excerpt", label: "Excerpt", placeholder: "Write a brief summary of your post...", rows: 3, maxLength: 200, }, ]); type BlogPostSchema = InferType; export default function BlogPostFormCard() { const handleSubmit = async (data: BlogPostSchema) => { await new Promise((resolve) => setTimeout(resolve, 500)); toast("Post draft saved!", { description: (

          {JSON.stringify(data, null, 2)}

), }); }; return ( New Blog Post Create a new post with tags and keywords. ); }