{"_id":"@aimform/document","name":"@aimform/document","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@aimform/document","version":"0.1.0","description":"Document block renderer — structured document blocks (headings, paragraphs, code, tables, charts, callouts, etc.) used for both the document editor and AI chat responses.","type":"module","main":"./src/index.ts","exports":{".":{"types":"./src/index.ts","import":"./src/index.ts"}},"peerDependencies":{"react":">=18","react-markdown":">=9","remark-gfm":">=4"},"dependencies":{"@aimform/block-format":"0.1.0"},"devDependencies":{"@types/react":"^19.0.0","react":"^19.0.0","react-markdown":"^9.0.0","remark-gfm":"^4.0.0","typescript":"^5.7.0"},"scripts":{"typecheck":"tsc --noEmit"},"_id":"@aimform/document@0.1.0","_integrity":"sha512-YqdSgRHYMYLXvErGEklfF5xiRl0cVY8Zyo48M7C094xKIBYQT5bsw/ijDXoaTmPAj6ZX+k+/BdZCKceF9chd6A==","_resolved":"/private/var/folders/yd/ljsqjd3x3ldgn83qswywypf00000gn/T/510f89f8ad43e3f4bf2fff503155d29e/aimform-document-0.1.0.tgz","_from":"file:aimform-document-0.1.0.tgz","_nodeVersion":"25.6.0","_npmVersion":"11.8.0","dist":{"integrity":"sha512-YqdSgRHYMYLXvErGEklfF5xiRl0cVY8Zyo48M7C094xKIBYQT5bsw/ijDXoaTmPAj6ZX+k+/BdZCKceF9chd6A==","shasum":"38e1c2ea029566f42cba42b0ccf863bceb2f4814","tarball":"https://registry.npmjs.org/@aimform/document/-/document-0.1.0.tgz","fileCount":6,"unpackedSize":14564,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIGRI8X0EjS9wNMCr9t6uxbTt/vcEcWAb8L6/DRpFv6fKAiEAyr+Fu9N1BjAyWt43Q3+H43iY+BePwZnNqjwIhFA9okQ="}]},"_npmUser":{"name":"adamhalasz","email":"mail@adamhalasz.com"},"directories":{},"maintainers":[{"name":"adamhalasz","email":"mail@adamhalasz.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/document_0.1.0_1786183675613_0.65388890914967"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-08T10:07:55.415Z","0.1.0":"2026-08-08T10:07:55.814Z","modified":"2026-08-08T10:07:56.086Z"},"maintainers":[{"name":"adamhalasz","email":"mail@adamhalasz.com"}],"description":"Document block renderer — structured document blocks (headings, paragraphs, code, tables, charts, callouts, etc.) used for both the document editor and AI chat responses.","readme":"# @aimform/document\n\nStructured document block renderer for the Aimform platform. Renders document blocks (headings, paragraphs, code, tables, charts, callouts, images, etc.) as a unified document, used by both the document editor and AI chat responses.\n\n## Installation\n\n```bash\npnpm add @aimform/document\n```\n\n## Quick Start\n\n```tsx\nimport { DocumentRenderer } from \"@aimform/document\";\nimport type { DocumentBlock } from \"@aimform/document\";\n\nconst blocks: DocumentBlock[] = [\n  { id: \"1\", blockType: \"heading\", content: \"My Document\", position: 0, metadata: { level: 2 } },\n  { id: \"2\", blockType: \"paragraph\", content: \"Hello **world**!\", position: 1 },\n  { id: \"3\", blockType: \"code\", content: \"console.log('hi')\", position: 2, metadata: { language: \"typescript\" } },\n  { id: \"4\", blockType: \"divider\", content: \"\", position: 3 },\n  { id: \"5\", blockType: \"callout\", content: \"**Note:** this is important.\", position: 4 },\n];\n\n<DocumentRenderer blocks={blocks} />\n```\n\n## Block Types\n\n| Block Type | Description | Metadata |\n|---|---|---|\n| `paragraph` | Text content with markdown formatting | — |\n| `heading` | Section title | `level: 1 \\| 2 \\| 3` |\n| `code` | Code block with syntax highlighting | `language: string` |\n| `table` | Markdown-formatted table (`\\| col \\| val \\|`) | — |\n| `chart` | Chart data (ChartConfig JSON) | `chartType: \"bar\"\\|\"line\"\\|\"area\"\\|\"pie\"\\|\"scatter\"\\|\"radar\"`, `title: string` |\n| `list` | Ordered or unordered list | `ordered: boolean` |\n| `quote` | Blockquote text | — |\n| `callout` | Highlighted info/warning box | — |\n| `divider` | Horizontal rule | — |\n| `image` | Image embed | `alt: string`, `width: number`, `height: number` |\n| `embedded_view` | Embedded view reference | `title: string` |\n\n## Custom Renderers\n\nPass `renderers` to override the default rendering for any block type:\n\n```tsx\nimport { DocumentRenderer } from \"@aimform/document\";\nimport { MyChart } from \"./MyChart\";\n\n<DocumentRenderer\n  blocks={blocks}\n  renderers={{\n    chart: (block) => <MyChart config={JSON.parse(block.content)} />,\n    code: (block) => <MyCodeBlock language={block.metadata?.language} code={block.content} />,\n    table: (block) => <MyTable markdown={block.content} />,\n    image: (block) => <img src={block.content} alt={block.metadata?.alt as string} />,\n  }}\n/>\n```\n\n## Default Renderers\n\nWhen no custom renderer is provided:\n\n| Block Type | Default Rendering |\n|---|---|\n| `heading` | Rendered as markdown heading (`#`, `##`, `###`) |\n| `paragraph` | Rendered as markdown (GFM) via `react-markdown` |\n| `code` | Falls back to paragraph (no syntax highlighting) |\n| `table` | Rendered as markdown table via `react-markdown` |\n| `chart` | Falls back to paragraph |\n| `divider` | `<hr>` element |\n| `quote` | `<blockquote>` with markdown content |\n| `callout` | Bordered box with \"!\" icon and markdown content |\n| `list` | Falls back to paragraph |\n| `image` | Falls back to paragraph |\n| `embedded_view` | Falls back to paragraph |\n\n## Types\n\n### DocumentBlock\n\n```typescript\ninterface DocumentBlock {\n  id: string;\n  blockType: DocumentBlockType | string;\n  content: string;\n  position?: number;\n  metadata?: Record<string, unknown>;\n}\n```\n\n### DocumentBlockType\n\n```typescript\ntype DocumentBlockType =\n  | \"paragraph\" | \"heading\" | \"code\" | \"table\" | \"chart\"\n  | \"list\" | \"quote\" | \"callout\" | \"divider\" | \"image\" | \"embedded_view\";\n```\n\n### DocumentBlockRenderers\n\n```typescript\ninterface DocumentBlockRenderers {\n  heading?: (block: DocumentBlock & { metadata?: { level?: number } }) => ReactNode;\n  code?: (block: DocumentBlock & { metadata?: { language?: string } }) => ReactNode;\n  table?: (block: DocumentBlock) => ReactNode;\n  chart?: (block: DocumentBlock & { metadata?: { chartType?: string; title?: string } }) => ReactNode;\n  image?: (block: DocumentBlock & { metadata?: { alt?: string } }) => ReactNode;\n  divider?: (block: DocumentBlock) => ReactNode;\n  quote?: (block: DocumentBlock) => ReactNode;\n  callout?: (block: DocumentBlock) => ReactNode;\n  list?: (block: DocumentBlock & { metadata?: { ordered?: boolean } }) => ReactNode;\n  embeddedView?: (block: DocumentBlock & { metadata?: { title?: string } }) => ReactNode;\n}\n```\n\n## Markdown Support\n\nThe `DocumentMarkdown` component renders content as GitHub-Flavored Markdown (tables, strikethrough, task lists, URLs) via `react-markdown` + `remark-gfm`.\n\n```tsx\nimport { DocumentMarkdown } from \"@aimform/document\";\n\n<DocumentMarkdown content=\"**bold** and _italic_ with | tables |\" />\n```\n","readmeFilename":"README.md","_rev":"1-a964afd3eea838fc76d0d9d539e43b1e"}