Files
zeekay 3e6252864b feat: v0.2.0 - Page Builder, Shiki Syntax Highlighting, and New Blocks
Major Features:
- Visual Page Builder with drag-and-drop interface
- Shiki syntax highlighting integration via Fumadocs
- 10 new blocks (5 newsletter variants + blog/photo/showcase blocks)
- AI Voice Settings component
- Comprehensive AI documentation

Page Builder Features:
- Filterable block library with 1/4 scale previews
- Drag-to-reorder blocks in canvas
- Viewport controls (Desktop/Tablet/Mobile)
- Export to React TSX, copy code, download file
- Deploy with Hanzo integration
- Real-time block rendering with dynamic imports

Syntax Highlighting:
- GitHub Light/Dark themes for automatic mode support
- Multi-color syntax highlighting
- Copy-to-clipboard, line numbers, line highlighting
- Zero client-side JavaScript (static HTML)

New Blocks:
- newsletter-01 through newsletter-05 (5 variants)
- blog-cards-01 (Modern blog post card layout)
- photo-grid-01 (Responsive photo gallery)
- showcase-marketing-01, showcase-ecommerce-01, showcase-app-ui-01

New Components:
- ai-voice-settings (Voice configuration interface)

New Documentation:
- AI Actions, Agents, Assistant, Code, Models, Vision, Voice guides
- Newsletter blocks documentation

Bug Fixes:
- Fixed block display registry access pattern
- Stubbed billing-dependent blocks with instructions
- Replaced iframe previews with direct component rendering
- Eliminated 404 errors in block previews

Technical Improvements:
- Enhanced MDX configuration with Shiki rehype plugin
- Integrated Fumadocs CodeBlock wrapper
- Improved registry build error handling
- Updated component props for better type safety

CI/CD:
- Added automatic npm publishing on tag creation
- Tests must pass before publishing
- Automatic GitHub release creation
- Documentation deployment to GitHub Pages

CHANGELOG:
- Created comprehensive CHANGELOG.md with v0.2.0 release notes
2025-11-04 08:40:36 -08:00

32 lines
675 B
TypeScript

import { Bell, Home, Search, Settings } from "lucide-react"
import { MenuDock } from "@/registry/default/ui/menu-dock"
export default function MenuDockDemo() {
const menuItems = [
{
icon: <Home className="h-5 w-5" />,
label: "Home",
active: true,
},
{
icon: <Search className="h-5 w-5" />,
label: "Search",
},
{
icon: <Bell className="h-5 w-5" />,
label: "Notifications",
},
{
icon: <Settings className="h-5 w-5" />,
label: "Settings",
},
]
return (
<div className="w-full min-h-[400px] flex items-center justify-center">
<MenuDock items={menuItems} />
</div>
)
}