REFACTOR: removed unneccessary web component packages (#1175)

#1160

.eslintignore

@@ -10,15 +10,6 @@ coverage/
 dist/
 tmp/
 
-# Ignore generated files from Stencil
-
-components/components.d.ts
-packages/web-components-angular/src/directives/angular-component-lib/utils.ts
-packages/web-components-angular/src/directives/proxies.ts
-packages/web-components-stencil/loader
-packages/web-components-react/src/react-component-lib/
-packages/web-components-react/src/components.ts
-
 # Ignore Next.js project with own ESLint config
 
 apps/rvs.rivm.nl/

.eslintrc.json

@@ -53,20 +53,6 @@
       "parser": "@typescript-eslint/parser",
       "plugins": ["@typescript-eslint", "import", "eslint-plugin-import"]
     },
-    {
-      "extends": [
-        "plugin:react/recommended",
-        "eslint-config-prettier",
-        "./.eslintrc.js.json",
-        "./.eslintrc.react.json"
-      ],
-      "files": ["**/stencil.tsx", "**/*.stencil.tsx"],
-      "parser": "@typescript-eslint/parser",
-      "parserOptions": {
-        "project": ["packages/web-components-stencil/tsconfig.json"]
-      },
-      "plugins": ["@typescript-eslint", "import"]
-    },
     {
       "excludedFiles": ["**/stencil.tsx", "**/*.stencil.tsx"],
       "extends": [

.gitignore

@@ -14,7 +14,6 @@ dist/
 tmp/
 **/src/generated/
 **/src/generated/
-packages/web-components-stencil/src/components.d.ts
 
 # Ignore archives
 *.7z

.prettierignore

@@ -17,12 +17,5 @@ package-lock.json
 yarn.lock
 pnpm-lock.yaml
 
-
-# Ignore generated files from Stencil
-components/components.d.ts
-packages/web-components-stencil/loader
-packages/web-components-react/src/react-component-lib/
-packages/web-components-react/src/components.ts
-
 # Ignore files that are edited from Figma
 figma.tokens.json

README.md

@@ -171,14 +171,12 @@ Vanuit`packages/components-react` krijg je een gedetailleerder overzicht van tes
 
 ### Packages
 
-| Package                  | Purpose                                                                                                                                            |
-| :----------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `components-css`         | Hier kunnen CSS-componenten toegevoegd worden die nog niet bestaan in de NL Design System-community.                                               |
-| `components-react`       | Optioneel voor het toevoegen van een React-wrapper aan een CSS-component als die nog niet bestaat.                                                 |
-| `design-tokens`          | Hier worden de rijkshuisstijl-thema’s beheerd, voor gebruik met NL Design System zonder thema. Opmerking deze zouden naar proprietary moeten gaan. |
-| `storybook`              | Extra componenten en pagina-sjablonen kunnen worden toegevoegd als story voor documentatie en visuele regressietesten.                             |
-| `web-components-stencil` | Hier kunnen webcomponenten worden toegevoegd voor componenten die nog niet als webcomponent bestaan.                                               |
-| `web-components-react`   | Hier kunnen React-webcomponenten toegevoegd worden voor gebruiksgemak.                                                                             |
+| Package            | Purpose                                                                                                                                            |
+| :----------------- | :------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `components-css`   | Hier kunnen CSS-componenten toegevoegd worden die nog niet bestaan in de NL Design System-community.                                               |
+| `components-react` | Optioneel voor het toevoegen van een React-wrapper aan een CSS-component als die nog niet bestaat.                                                 |
+| `design-tokens`    | Hier worden de rijkshuisstijl-thema’s beheerd, voor gebruik met NL Design System zonder thema. Opmerking deze zouden naar proprietary moeten gaan. |
+| `storybook`        | Extra componenten en pagina-sjablonen kunnen worden toegevoegd als story voor documentatie en visuele regressietesten.                             |
 
 ### Proprietary
 

apps/rhc-templates/package.json

@@ -39,8 +39,6 @@
     "@rijkshuisstijl-community/font": "workspace:*",
     "@rijkshuisstijl-community/rivm-design-tokens": "workspace:*",
     "@rijkshuisstijl-community/storybook": "workspace:*",
-    "@rijkshuisstijl-community/web-components-react": "workspace:*",
-    "@rijkshuisstijl-community/web-components-stencil": "workspace:*",
     "@tabler/icons-react": "3.28.1",
     "@types/node": "20.17.6",
     "@types/react": "19.0.7",
@@ -51,7 +49,6 @@
     "@utrecht/page-body-react": "1.0.4",
     "@utrecht/page-layout-react": "1.0.4",
     "@utrecht/root-react": "1.0.4",
-    "@utrecht/web-component-library-react": "3.0.2",
     "eslint": "9.18.0",
     "eslint-config-next": "15.1.4",
     "typescript": "5.7.3"

apps/rvs.rivm.nl/package.json

@@ -34,8 +34,6 @@
     "@rijkshuisstijl-community/components-react": "workspace:*",
     "@rijkshuisstijl-community/font": "workspace:*",
     "@rijkshuisstijl-community/rivm-design-tokens": "workspace:*",
-    "@rijkshuisstijl-community/web-components-react": "workspace:*",
-    "@rijkshuisstijl-community/web-components-stencil": "workspace:*",
     "@types/node": "20.17.6",
     "@types/react": "19.0.7",
     "@types/react-dom": "19.0.3",

packages/components-react/package.json

@@ -36,7 +36,6 @@
   "dependencies": {
     "@nl-design-system-candidate/heading-react": "1.0.0",
     "@rijkshuisstijl-community/components-css": "workspace:*",
-    "@rijkshuisstijl-community/web-components-react": "workspace:*",
     "@tabler/icons-react": "3.28.1",
     "@utrecht/component-library-react": "7.3.5",
     "clsx": "2.1.1",

packages/storybook/config/preview.tsx

@@ -10,19 +10,13 @@ import '@rijkshuisstijl-community/mijnoverheid-design-tokens/dist/theme.css';
 import '@rijkshuisstijl-community/rivm-design-tokens/dist/theme.css';
 import '@rijkshuisstijl-community/components-css/dist/index.css';
 import { Paragraph } from '@rijkshuisstijl-community/components-react';
-import { defineCustomElements } from '@rijkshuisstijl-community/web-components-stencil/loader/index';
 import { withThemeByClassName } from '@storybook/addon-themes';
 import { Controls, Description, Primary, Stories, useOf } from '@storybook/blocks';
 import { Preview } from '@storybook/react';
 import { PageLayout } from '@utrecht/page-layout-react';
 import { Root } from '@utrecht/root-react';
-import { defineCustomElements as defineUtrechtCustomElements } from '@utrecht/web-component-library-stencil/loader/index';
 import { Fragment } from 'react';
 
-// Initialize web components
-defineCustomElements();
-defineUtrechtCustomElements();
-
 const preview: Preview = {
   decorators: [
     withThemeByClassName({

packages/storybook/package.json

@@ -44,8 +44,6 @@
     "@rijkshuisstijl-community/mijnoverheid-design-tokens": "workspace:*",
     "@rijkshuisstijl-community/rivm-design-tokens": "workspace:*",
     "@rijkshuisstijl-community/web-components": "workspace:*",
-    "@rijkshuisstijl-community/web-components-react": "workspace:*",
-    "@rijkshuisstijl-community/web-components-stencil": "workspace:*",
     "@storybook/addon-a11y": "8.4.7",
     "@storybook/addon-actions": "8.4.7",
     "@storybook/addon-docs": "8.4.7",
@@ -71,7 +69,6 @@
     "@utrecht/page-layout-react": "1.0.4",
     "@utrecht/root-react": "1.0.4",
     "@utrecht/web-component-library-react": "3.0.2",
-    "@utrecht/web-component-library-stencil": "3.0.1",
     "@whitespace/storybook-addon-html": "6.1.1",
     "axe-playwright": "2.0.3",
     "chromatic": "11.24.0",