Docz: Remove <Playground> from output in the Playground

[mrmartineau]

When using <Playground> docz renders the <Playground> component as well as the component markup. Can it be removed?

Make this:

<Playground>
  <MyComponent />
</Playground>

Like this:

<MyComponent />

[pedronauck]

Yeah, this is better I think too. I tried to do this, but unfortunately did not work very well, so how I needed to release soon I ended up leaving for later! But I have plans to fix this, thanks @mrmartineau :pray:

[albinekb]

Maybe remove <Playground> and </Playground> in here https://github.com/pedronauck/docz/blob/master/packages/docz-core/src/utils/plugin-hast.ts#L24 🤔 Maybe there's a cleaner way?

[good-idea]

This would also be nice when you need to prepare your props data in the documentation. For instance:

UserProfile.mdx:

import Username from './Username'
import { makeAvatarFromImage } from './utils'
import { userStub, imageStub } from './stubs'

## Usage

<Playground render={() => {
  const username = `@${userStub.username}`
  const avatar = makeAvatarFromImage(imageStub)

  // ... more lines of code that don't need to be displayed in the docs...

  return <UserProfile username={username} avatar={avatar} /> 
}} />

Output:

<UserProfile username={username} avatar={avatar} /> 

A related but different question: Is it possible to use javascript in MDX and make it available to the playground component?

For example:

import Username from './Username'
import { makeAvatarFromImage } from './utils'
import { userStub, imageStub } from './stubs'

const username = `@${userStub.username}`
const avatar = makeAvatarFromImage(imageStub)

// ... more lines of code that don't need to be displayed in the docs...

## Usage

<Playground>
   <UserProfile username={username} avatar={avatar} /> 
</Playground>

When I try something like this, i get username is not defined

[pedronauck]

To facilitate user feedbacks and make a really good roadmap, now we're using Canny as a tool to create our roadmap 😍

We think that is better keep Github issues only for bugs and other issues! 🐞
This issue is already on our roadmap, so I'll close this issue in favor of it!

👉🏻 Check this issue on roadmap

[pedronauck]

🎉  Fixed and released in the new v0.4.0