features
@particular/cms
Content management with visual page builder, blocks, and presets
Installation
bun add @particular/cms
Subpath Imports
| Import Path | Description |
|---|---|
| @particular/cms/page-builder | Types-only barrel for page builder |
| @particular/cms/page-builder/config | createPageConfig() builder |
| @particular/cms/page-builder/editor | <PageEditor> client component |
| @particular/cms/page-builder/render | <PageRenderer> RSC-compatible renderer |
| @particular/cms/page-builder/components | 14 built-in component configs |
| @particular/cms/page-builder/presets | Layout presets (blog, FAQ, KB, pages, blank) |
| @particular/cms/page-builder/plugin | CMS media picker plugin |
| @particular/cms/page-builder/overrides | Default editor UI overrides |
Key Exports
| Export | Type | Description |
|---|---|---|
| createPageConfig | function | Build a PageConfig from options |
| PageEditor | component | Visual page builder editor |
| PageRenderer | component | Render page builder content (RSC-safe) |
| PageBuilderData | type | Structured page builder data format |
| BUILT_IN_COMPONENTS | function | All 14 built-in page builder components |
| blogLayoutPreset | function | Blog post layout template |
Usage Examples
Create page config
import { createPageConfig } from "@particular/cms/page-builder/config";
const config = createPageConfig({
builtIn: true,
exclude: ["embed"],
});Render page content (Server Component)
import { PageRenderer } from "@particular/cms/page-builder/render";
export default async function Page({ params }) {
const entry = await getEntry(params.id);
return <PageRenderer data={entry.content} config={config} />;
}