✨ Chore: Extend Markdoc configuration #127
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| import { z } from 'astro/zod'; | ||
| import type { Config } from '@markdoc/markdoc'; | ||
|
|
||
| // | ||
| // MARKDOC RENDER TYPE SCHEMA | ||
| // | ||
|
|
||
| export const markdocRenderTypeSchema = z | ||
| .union([z.literal('html'), z.literal('react'), z.literal('react-static')]) | ||
| .optional() | ||
| .default('html'); | ||
|
|
||
| // | ||
| // MARKDOC ARG PARSE SCHEMA | ||
| // | ||
|
|
||
| export const markdocArgParseSchema = z | ||
| .union([ | ||
| z.object({ | ||
| file: z.string(), | ||
| slots: z.boolean(), | ||
| location: z.boolean(), | ||
| }), | ||
| z.string(), | ||
| ]) | ||
| .optional(); | ||
|
|
||
| // | ||
| // MARKDOC CONFIG SCHEMA | ||
| // | ||
| export const markdocConfigSchema = z | ||
| .object({ | ||
| renderType: markdocRenderTypeSchema, | ||
| argParse: markdocArgParseSchema, | ||
| transformConfig: z.custom<Config>().optional(), | ||
| }) | ||
| .optional() | ||
| .default({}); |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,11 +1,23 @@ | ||
| import Markdoc from '@markdoc/markdoc'; | ||
| import Config from 'virtual:studiocms/config'; | ||
| import React, { type ReactNode } from 'react'; | ||
|
|
||
| const { | ||
| markdocConfig: { argParse, renderType, transformConfig }, | ||
| } = Config; | ||
|
|
||
| export async function renderMarkDoc(input: string): Promise<string | ReactNode> { | ||
| const ast = Markdoc.parse(input, argParse); | ||
| const content = Markdoc.transform(ast, transformConfig); | ||
|
|
||
| switch (renderType) { | ||
| case 'react': | ||
| return Markdoc.renderers.react(content, React); | ||
| case 'react-static': | ||
| return Markdoc.renderers.reactStatic(content); | ||
|
There was a problem hiding this comment. What is the output of these? In order for them to work with the There was a problem hiding this comment. react => return ReactNode There was a problem hiding this comment. for the ReactNode, it might be worth working out a implementation with the There was a problem hiding this comment.
yes, but it’s in an experimental phase, so now we can remove the react option and add it later There was a problem hiding this comment. This whole project(studioCMS) is in experimental state as well (and we are already using the container api 😛 ) There was a problem hiding this comment.
yeah, so we can use container api... There was a problem hiding this comment. indeed! Hakuna matata! I like living on the edge.... we are using ALOT of experimental/beta stuff since astroDB is experimental as well |
||
| case 'html': | ||
| return Markdoc.renderers.html(content); | ||
| default: | ||
| throw new Error('Unsupported Markdoc type'); | ||
| } | ||
| } | ||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't mind the
@types/reactbeing a standardpeerDependenybut could we add apeerDependenciesMetaforreactto be optional?example
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yeah, make sense, both react and @types/react?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think just react needs to be moved to an Optional state... but @jdtjenkins could probably give a better answer since i know he had to deal with this when he made the devtoolbar app for AIK
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yes, so we wait for his answer
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah for AIK we had
react,@types/reactandreact-domas optional peer deps if I remember correctly!{ "peerDependencies": { "react": "^", "@types/react": "^", "react-dom": "^", }, "peerDependenciesMeta": { "react": { "optional": true }, "@types/react": { "optional": true }, "react-dom": { "optional": true } } }https://docs.npmjs.com/cli/v10/configuring-npm/package-json#peerdependenciesmeta
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@jdtjenkins yeah, thank you!