I have a basic component library currently containing a single component. The project is built with Vite, TypeScript, and React. It supports two design systems, which load the appropriate .scss file based on a designSystem prop. In the long term, this approach is cumbersome. Instead, I want to create a monorepo with three packages:

1. Abstract Components: Contains the logic, state management, and calls the appropriate render method.
2. Design System 1 Components: Contains components styled with the first design system.
3. Design System 2 Components: Contains components styled with the second design system.

Each design system package should export a component or render method that the abstract package can call. Products can then select the design system they want to use and pass the proper render function to the abstract component.

I am building a monorepo for the first time and have not found examples specific to component libraries, only examples involving an app and a package.
I wanna build the monorepo using: npm workspaces, Vite, React (TS)

My main questions regarding the configuration/setup and build process are:

1. How should my structure look? If all three packages share the same Vite config, should each package have its own Vite config extending the root one (if yes, how?), or should they directly use the root Vite config?

2. If the latter is true, how should the packages use the root Vite config, for example, to build into their respective dist folders? Or should the root parent package.json handle the builds for all three?

3. How can I avoid duplicating scripts and dependencies across the package.json files of each package? I noticed that the scripts for building, testing, etc., are almost identical across the packages. Is there a way to centralize these scripts to make maintenance easier?

4. How should I handle versioning and publishing of the packages? Should each package have its own version, or should they all share the same version? If they have their own versions, how can I ensure that they stay in sync?

I’m new to monorepos and any guidance or resources that could help me understand how to structure and manage my project without duplicating too much or creating conflicts between packages would be very helpful. Any tips regarding the setup and architecture of this project would be greatly appreciated. Thank you in advance for your help.