Creating a Dual-Package Design System Library for JSF and Angular/PrimeNG: Is it Feasible?

I am embarking on a project to develop a design system library which caters to both JSF and Angular/PrimeNG frameworks. The idea is to have two separate packages within the library - one dedicated to JSF components and the other to Angular/PrimeNG components. The goal is to make this library flexible enough to be integrated into either a JSF project or an Angular/PrimeNG project seamlessly.

Here’s a rough outline of how I envision the library structure:

Design System Library

• Package 1: JSF Components
  • Contains reusable JSF components adhering to the design system guidelines.
• Package 2:
  • Angular/PrimeNG Components Contains reusable Angular components with PrimeNG, also adhering to the same design system guidelines.

Each package would be independently usable but adheres to the same design principles and guidelines to ensure consistency across projects, regardless of the framework being used.

I aim for a setup where developers can choose the relevant package based on the framework they are working with, and have a consistent design experience.

Here are some specific areas where I could use some guidance:

• Is this dual-package structure a feasible approach for creating a design system library that serves both JSF and Angular/PrimeNG projects?

• Are there any existing tools or practices that could facilitate the management and distribution of these packages?

• Are there any examples of similar dual-package design system libraries, especially those serving different frameworks, that I could look at for reference?