Add gatsby-plugin-prop-shop

[PaulieScanlon]

Hey all.

Apologies in advance if this is an inappropriate PR 😬

I've been developing a Gatsby plugin called gatsby-plugin-prop-shop which provides an holistic view of all PropTypes defined in a Gatsby project.

You can specify using the options where you wish to source .js or .tsx files from and once you've configured the plugin you can spin up your project using the usual gatsby develop or gatsby build methods and then navigate to eg: http://localhost:8000/prop-shop/ to see all the PropTypes and descriptions for the specified source directories.

There are a number of search / filter options available in the PropShop UI which can be used to investigate prop and files.

I've added prop-types to the components package along with some descriptions to the Embed component so you can get a better understanding of how the plugin works.

I appreciate a lot of the theme-ui components are styled html and by spreading props allow users to set attributes as they normally would in html world but there are one or two custom props which might benefit from PropTypes / descriptions.

Please don't feel like this PR should be merged and especially as i'm still in the early stages of development but i'd love your feedback all the same.

Thanks in advance

Paul

[jxnblk]

Thanks! This is a really cool idea! If this will work once we have the components package moved over to TS, I think it might be worth waiting for that rather than using prop-types in the interim, if you're okay letting this PR sit idle for a bit

[PaulieScanlon]

Hey @jxnblk yeah no worries at all! I’m pretty sure it’ll continue to work with TS.

I've just seen the issue about converting packages to TS... i've commented and would like to take a look at converting components

[PaulieScanlon]

Oh and I wrote a little blog post about it if you have a spare 3 mins.

https://paulie.dev/posts/2020/02/prop-shop/

[lachlanjc]

Thanks a bunch for the PR—however as Brent said we’re working on migrating these components over to TypeScript instead of using the prop-types package. There’s also the issue of just how many props most of these components accept—the whitespace & color props from Styled System, a handful of custom ones, variant/sx, then spread the remainders. There’s also the issue of what values are genuinely useful to demonstrate & how those are generated automatically. Therefore we’re not planning to implement this.