diff --git a/packages/docz/src/components/DocPreview.tsx b/packages/docz/src/components/DocPreview.tsx index f3cc726c8..674caae67 100644 --- a/packages/docz/src/components/DocPreview.tsx +++ b/packages/docz/src/components/DocPreview.tsx @@ -14,10 +14,12 @@ const Identity: SFC = ({ children }) => {children} const DefaultLoading: SFC = () => Loading export type RenderComponent = ComponentType<{ - component: JSX.Element - code: any className?: string style?: any + components: ComponentsMap + component: JSX.Element + code: (components: ComponentsMap) => any + rawCode: string }> export const DefaultRender: RenderComponent = ({ component, code }) => ( diff --git a/packages/docz/src/components/Playground.tsx b/packages/docz/src/components/Playground.tsx index 502fd0acb..5c7084b5e 100644 --- a/packages/docz/src/components/Playground.tsx +++ b/packages/docz/src/components/Playground.tsx @@ -6,11 +6,12 @@ import { isFn } from './Docs' import { ComponentsMap } from './DocPreview' export interface PlaygroundProps { - components: ComponentsMap className?: string style?: any - children: any + components: ComponentsMap __code: (components: ComponentsMap) => any + __rawCode: string + children: any } const BasePlayground: SFC = ({ @@ -19,13 +20,16 @@ const BasePlayground: SFC = ({ style, children, __code, + __rawCode, }) => { return components && components.render ? ( ) : null } diff --git a/packages/rehype-docz/src/index.ts b/packages/rehype-docz/src/index.ts index 831bf2bfd..c011a4207 100644 --- a/packages/rehype-docz/src/index.ts +++ b/packages/rehype-docz/src/index.ts @@ -42,7 +42,7 @@ const addCodeProp = async (node: any) => { node.value = node.value.replace( tagOpen, - `<${name} __code={${codeComponent}}` + `<${name} __code={${codeComponent}} __rawCode={\`${child}\`}` ) } }