refactor: remove advanced component API

This commit is contained in:
bholmesdev 2023-03-01 14:20:48 -05:00
parent 5966a9f5e1
commit 95dab5393b
3 changed files with 12 additions and 36 deletions

View file

@ -1,11 +1,12 @@
---
import type { RenderableTreeNode } from '@markdoc/markdoc';
import { ComponentRenderer, createAstroNode } from './astroNode';
import type { AstroInstance } from 'astro';
import { createAstroNode } from './astroNode';
import RenderNode from './RenderNode.astro';
type Props = {
content: RenderableTreeNode;
components: Record<string, ComponentRenderer>;
components: Record<string, AstroInstance['default']>;
};
const { content, components } = Astro.props as Props;

View file

@ -1,18 +1,11 @@
import type { ComponentInstance } from 'astro';
import type { RenderableTreeNode, Tag } from '@markdoc/markdoc';
import type { AstroInstance } from 'astro';
import type { RenderableTreeNode } from '@markdoc/markdoc';
import Markdoc from '@markdoc/markdoc';
export type ComponentRenderer =
| ComponentInstance['default']
| {
component: ComponentInstance['default'];
props?(params: { attributes: Record<string, any>; getTreeNode(): Tag }): Record<string, any>;
};
export type AstroNode =
| string
| {
component: ComponentInstance['default'];
component: AstroInstance['default'];
props: Record<string, any>;
children: AstroNode[];
}
@ -24,7 +17,7 @@ export type AstroNode =
export function createAstroNode(
node: RenderableTreeNode,
components: Record<string, ComponentRenderer> = {}
components: Record<string, AstroInstance['default']> = {}
): AstroNode {
if (typeof node === 'string' || typeof node === 'number') {
return String(node);
@ -33,18 +26,10 @@ export function createAstroNode(
}
if (node.name in components) {
const componentRenderer = components[node.name];
const component =
'component' in componentRenderer ? componentRenderer.component : componentRenderer;
const props =
'props' in componentRenderer && typeof componentRenderer.props === 'function'
? componentRenderer.props({
attributes: node.attributes,
getTreeNode() {
return node;
},
})
: node.attributes;
const component = components[node.name];
const props = node.attributes;
console.log({ node, component, props, components });
const children = node.children.map((child) => createAstroNode(child, components));

View file

@ -1,18 +1,8 @@
declare module 'astro:content' {
type ComponentRenderer =
| import('astro').ComponentInstance['default']
| {
component: import('astro').ComponentInstance['default'];
props?(params: {
attributes: Record<string, any>;
getTreeNode(): typeof import('@astrojs/markdoc').Markdoc.Tag;
}): Record<string, any>;
};
interface Render {
'.mdoc': Promise<{
Content(props: {
components?: Record<string, ComponentRenderer>;
components?: Record<string, import('astro').AstroInstance['default']>;
}): import('astro').MarkdownInstance<{}>['Content'];
}>;
}