chore: Export components from docz-theme-default

[huchenme]

Description

Export components from docz-theme-default so it will be possible to make a custom component with dynamic markdown content

I believe currently it is not possible to do something like this

# Hello {firstName} {lastName}

But with this PR you could achieve

import {components} from 'docz-theme-default'

<components.H1>Hello {firstName} {lastName}</components.H1>

and it will also possible to include markdown headers in a custom component and serve as some kind of layout component

[swyxio]

looks fine. related issue #612 (comment)

paging @pedronauck as this needs to be documented if accepted

[huchenme]

@pedronauck Do you expect me to add documentation for this change?

[camden]

I'd love to see this merged so I can start using this feature.
Can we ship this first so that developers see value here, then document it after the fact?

[rupification]

same here. I wanted to make the same change. ship please...this makes it easier to pull in default theme components like render pre for <Playground>

[rupification]

Bump

[mikkelking]

Yes, ship please!

[msokk]

This would be great, I want to override the component for different layout and sidebar styling, but keep everything in the content the same.

[rupification]

is there anyone besides @pedronauck who can manage pull requests? This is a great project 👍 👍 and hopefully things get moving...

[lttb]

I think it would be also nice to export enhance here, because many docz components use the context with settings, created there. maybe export config and modes would be useful too

[huchenme]

Thanks, could you explain what you mean in code, please?

Is it to wrap the components in ThemeConfig, something like this?

const H1 = 
<ThemeConfig>
    {config => (
      <ThemeProvider
        theme={prev => ({
          ...prev,
          docz: config.themeConfig,
        })}
      >
  <components.H1 {...props} />
</ThemeConfig>

export enhance(H1)

[lttb]

yeah, for example. at first, it's important for the main Theme component, like

import {ThemeConfig, DocPreview} from 'docz';
import {components, enhance} from 'docz-theme-default';

const Theme = () => (
    <ThemeConfig>
        {config => (
            <ThemeProvider
                theme={prev => ({
                    ...prev,
                    docz: config.themeConfig,
                })}
            >
                <DocPreview
                    components={{
                        page: Page,
                        render: components.render,
                        inlineCode: components.inlineCode,
                        loading: components.loading,
                        table: components.table,
                        pre: components.pre,
                        tooltip: components.tooltip,
                        ...customComponents,
                    }}
                />
            </ThemeProvider>
        )}
    </ThemeConfig>
);

export default enhance(Theme);

[rupification]

its in! https://github.com/pedronauck/docz/blob/master/core/docz-theme-default/src/index.tsx#L30

[huchenme]

I guess @pedronauck have already pushed something into the code, closing this PR.

I will suggest maintainers to actively look at new PRs and let people know that it is something they are working on at the moment. This PR has been opened since Feb 1 and until today there is still no message from maintainer that this PR should be closed.