[REF-2053] Create 3rd Party Component Ecosystem

[picklelo]

Reflex users create many components of their own, including ready to use high level components and wrapping a nice React component not yet officially supported. and components not officially supported by Reflex. The Reflex community should be able to easily share these components without having to copy/paste their example code. To that end, we introduce a series of reflex component commands to help developers wrap react components, and test and publish them easily.

Goals

• A single command to create a custom component starter including:

  • Code template including detailed guides on how to wrap a react component
  • Necessary pre-filled files such as pyproject.toml, README, requirements for testing/publishing
  • A starter demo app importing this newly defined custom component. The new component is installed locally as editable for easy development and testing.

• A single command to publish a component as reflex-my-component on PyPI (and TestPyPI for testing purposes). An account is required by the creator on PyPI. After all, this is the work of the creator.

• A single command to run the demo as a test to verify the custom component package is functionally correct.

• End result:

  • Other users can install the component by pip install reflex-my-component
  • Optionally: the demo app can be hosted on the Reflex hosting service (sign up on the gallery page to get featured on reflex website)
  • The custom components will have a page on reflex website for community to discover.

_{From SyncLinear.com | REF-2053}

[wassafshahzad]

Is this open for OSS

[picklelo]

@wassafshahzad We are still designing this - what we'd love from the community is to help implement different components to build up the ecosystem.

I'm working on an official roadmap to be published early next week so everyone can see what our next plans are, and to make it easier for contributors to pick up issues on the roadmap.

[picklelo]

This is available now: https://reflex.dev/blog/2024-04-16-custom-components/