aboutsummaryrefslogtreecommitdiff
path: root/packages/integrations/markdoc/components/TreeNode.ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/integrations/markdoc/components/TreeNode.ts')
-rw-r--r--packages/integrations/markdoc/components/TreeNode.ts110
1 files changed, 12 insertions, 98 deletions
diff --git a/packages/integrations/markdoc/components/TreeNode.ts b/packages/integrations/markdoc/components/TreeNode.ts
index e491d1dc9..a60597a0d 100644
--- a/packages/integrations/markdoc/components/TreeNode.ts
+++ b/packages/integrations/markdoc/components/TreeNode.ts
@@ -2,16 +2,7 @@ import type { AstroInstance } from 'astro';
import { Fragment } from 'astro/jsx-runtime';
import type { RenderableTreeNode } from '@markdoc/markdoc';
import Markdoc from '@markdoc/markdoc';
-import {
- createComponent,
- renderComponent,
- render,
- renderScriptElement,
- renderUniqueStylesheet,
- createHeadAndContent,
- unescapeHTML,
- renderTemplate,
-} from 'astro/runtime/server/index.js';
+import { createComponent, renderComponent, render } from 'astro/runtime/server/index.js';
export type TreeNode =
| {
@@ -21,9 +12,6 @@ export type TreeNode =
| {
type: 'component';
component: AstroInstance['default'];
- collectedLinks?: string[];
- collectedStyles?: string[];
- collectedScripts?: string[];
props: Record<string, any>;
children: TreeNode[];
}
@@ -44,67 +32,20 @@ export const ComponentNode = createComponent({
)}`,
};
if (treeNode.type === 'component') {
- let styles = '',
- links = '',
- scripts = '';
- if (Array.isArray(treeNode.collectedStyles)) {
- styles = treeNode.collectedStyles
- .map((style: any) =>
- renderUniqueStylesheet({
- type: 'inline',
- content: style,
- })
- )
- .join('');
- }
- if (Array.isArray(treeNode.collectedLinks)) {
- links = treeNode.collectedLinks
- .map((link: any) => {
- return renderUniqueStylesheet(result, {
- href: link[0] === '/' ? link : '/' + link,
- });
- })
- .join('');
- }
- if (Array.isArray(treeNode.collectedScripts)) {
- scripts = treeNode.collectedScripts
- .map((script: any) => renderScriptElement(script))
- .join('');
- }
-
- const head = unescapeHTML(styles + links + scripts);
-
- let headAndContent = createHeadAndContent(
- head,
- renderTemplate`${renderComponent(
- result,
- treeNode.component.name,
- treeNode.component,
- treeNode.props,
- slots
- )}`
+ return renderComponent(
+ result,
+ treeNode.component.name,
+ treeNode.component,
+ treeNode.props,
+ slots
);
-
- // Let the runtime know that this component is being used.
- result.propagators.set(
- {},
- {
- init() {
- return headAndContent;
- },
- }
- );
-
- return headAndContent;
}
return renderComponent(result, treeNode.tag, treeNode.tag, treeNode.attributes, slots);
},
- propagation: 'self',
+ propagation: 'none',
});
-export async function createTreeNode(
- node: RenderableTreeNode | RenderableTreeNode[]
-): Promise<TreeNode> {
+export function createTreeNode(node: RenderableTreeNode | RenderableTreeNode[]): TreeNode {
if (typeof node === 'string' || typeof node === 'number') {
return { type: 'text', content: String(node) };
} else if (Array.isArray(node)) {
@@ -112,17 +53,16 @@ export async function createTreeNode(
type: 'component',
component: Fragment,
props: {},
- children: await Promise.all(node.map((child) => createTreeNode(child))),
+ children: node.map((child) => createTreeNode(child)),
};
} else if (node === null || typeof node !== 'object' || !Markdoc.Tag.isTag(node)) {
return { type: 'text', content: '' };
}
- const children = await Promise.all(node.children.map((child) => createTreeNode(child)));
-
if (typeof node.name === 'function') {
const component = node.name;
const props = node.attributes;
+ const children = node.children.map((child) => createTreeNode(child));
return {
type: 'component',
@@ -130,38 +70,12 @@ export async function createTreeNode(
props,
children,
};
- } else if (isPropagatedAssetsModule(node.name)) {
- const { collectedStyles, collectedLinks, collectedScripts } = node.name;
- const component = (await node.name.getMod())?.default ?? Fragment;
- const props = node.attributes;
-
- return {
- type: 'component',
- component,
- collectedStyles,
- collectedLinks,
- collectedScripts,
- props,
- children,
- };
} else {
return {
type: 'element',
tag: node.name,
attributes: node.attributes,
- children,
+ children: node.children.map((child) => createTreeNode(child)),
};
}
}
-
-type PropagatedAssetsModule = {
- __astroPropagation: true;
- getMod: () => Promise<AstroInstance['default']>;
- collectedStyles: string[];
- collectedLinks: string[];
- collectedScripts: string[];
-};
-
-function isPropagatedAssetsModule(module: any): module is PropagatedAssetsModule {
- return typeof module === 'object' && module != null && '__astroPropagation' in module;
-}