solid-design-system / solid

Monorepo for Union Investment's Solid Design System.
https://solid-design-system.fe.union-investment.de/x.x.x/storybook/
Other
20 stars 3 forks source link

feat: ✨ make types available for react.js users #659

Open karlbaumhauer opened 10 months ago

karlbaumhauer commented 10 months ago

User Story

As a user of the Solid Design System, I would like to have the types available when working in a react environment, so that benefit from the well defined component API without extra defining everything which is already defined but cannot be read.

Note: include form handling with react and react-wrappers

Suggested Solution

Whole concept is: We create and publish React wrapper components, as React doesn't like Web Components and that's the only way to bring that stuff to life there. :(

Check out what we've done at Synergy:

Package: https://www.npmjs.com/package/@synergy-design-system/react Issue: https://github.com/synergy-design-system/synergy-design-system/issues/43 Code: https://github.com/synergy-design-system/synergy-design-system/tree/main/packages/components/scripts/jobs/react The scripts are based on Shoelace https://github.com/shoelace-style/shoelace/blob/next/scripts/make-react.js

Shoelace publishes their wrappers with their main library, in Synergy we provided custom wrappers.

Side-Note: At the bottom of this article is an interesting take to NOT ship both component types in one package: https://hawkticehurst.com/writing/12-days-of-web-components/day-5/

DoR

  • [ ] Item has business value
  • [ ] Item has been estimated by the team
  • [ ] Item is clear and well-defined
  • [ ] Item dependencies have been identified

DoD

mariohamann commented 10 months ago

Whole concept is: We create and publish React wrapper components, as React doesn't like Web Components and that's the only way to bring that stuff to life there. :(

Check out what we've done at Synergy:

The scripts are based on Shoelace https://github.com/shoelace-style/shoelace/blob/next/scripts/make-react.js

Shoelace publishes their wrappers with their main library, in Synergy we provided custom wrappers.

mariohamann commented 10 months ago

At the bottom of this article is an interesting take to NOT ship both component types in one package: https://hawkticehurst.com/writing/12-days-of-web-components/day-5/

karlbaumhauer commented 5 months ago

as React v19 will be release soon and include web component support, we need to investigate if the (gib) effort we would have is worth implementing it.