Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Publish toolkit components as wrapped React components

See original GitHub issue

Feature/component description

As members of the community have been testing out the fast-react-wrapper in order to use the toolkit components inside React-based webview extensions the process of getting correctly set up has proven to be a bit difficult.

In order to ease some of the pain points and boilerplate currently required to get set up, we would like to explore taking on the responsibility of wrapping the toolkit components and publishing them so devs simply need to import the React toolkit component they desire.

Extra Context / Details / Thoughts

Ideally, the components can be imported using the following syntax (with the notable part being the /react sub-directory inside the toolkit package):

import { VSCodeButton } from "@vscode/webview-ui-toolkit/react";

Since this package will be consumed inside React and I believe (???) there is a reasonable expectation of being able to use ES Module syntax I’m going to say we probably don’t need to provide a bundled Rollup version of the React components and can instead focus all our attention on using the TypeScript compiler to build a set of ESM-based components within a react sub-directory.

With that said, I’m open to listening to arguments/use cases advocating for having a bundled Rollup version of the React components.

More thoughts will be included in the comments as I think of them.