New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(playground): examples #2808
Conversation
Size Change: 0 B Total Size: 472 kB ℹ️ View Unchanged
|
c8d1f3b
to
2802a46
Compare
d9a3be9
to
b16430d
Compare
f719b25
to
7029d15
Compare
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.
In the placeholders, this component was called ReactExample, and I think that'd be better naming. There's a chance we'll have mobile components or whatever so making this more specific might help. If not, at least adjust the globals in .eslintrc.js
and all of the examples that use it in content.
Also, why is it in a folder?
I'm not a fan of copying over the all-caps naming convention. I didn't like it so much before and I'm not sure I see the value of it now. Not sure even the underscores are really necessary, but I don't dislike them as much. Given that the ID comes from the name, I would really like more clear naming. It'd be nice to have it clear what the ID is from a quick glance. Even better would be being able to just copy the file name.
Please add usage examples to src/pages/mdx-examples.mdx
.
In the redesign, it's part of a card with raised elevation. Could you add that? Otherwise, it isn't clear. In some versions, the actions bar at the bottom in the redesign had a background. Right now the actions and everything blend into the page background.
The displayed examples don't include the import statements. We wanted the copy and paste to be as effortless as possible. The data is there
It should not include imports, because it will not have any affect on source code inside react-live. It's in the design, but from usage perspective it's useless :) |
What perspective of usage? I imagine copying and pasting it into an app. Then having the imports as part of what's copied is useful. Like what we have now at Orbit.kiwi. Is that not useful? 🤔 |
Ah, misunderstood it. Yep, makes sense. The best way will be not to show the imports, but add them to output, so when user will copy it to clipboard - it will be there. Otherwise it's possible, that they will try to import something inside playground |
de6b300
to
7e0022b
Compare
7e0022b
to
ff1010e
Compare
The scope for
react-live
is grabbed viaast
and passed as node scope with name, path, and if it’s default or named export.Orbit.kiwi: https://orbit-docs-docs-playground-examples.surge.sh
Storybook: https://orbit-docs-playground-examples.surge.sh