feat: integrate @public-ui/theme-ecl into the project (#7650)

Author: deleonio

.github/workflows/publish.yml

@@ -183,6 +183,12 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{secrets.NPMJS_GRANULAR_TOKEN}}
           NPM_CONFIG_PROVENANCE: true
+      - name: Build and publish theme ecl
+        run: pnpm publish --access ${{env.access}} --no-git-checks --tag ${{github.event.inputs.tag}}
+        working-directory: packages/themes/ecl
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.NPMJS_GRANULAR_TOKEN}}
+          NPM_CONFIG_PROVENANCE: true
       - name: Build and publish sample react
         run: pnpm publish --access ${{env.access}} --no-git-checks --tag ${{github.event.inputs.tag}}
         working-directory: packages/samples/react

packages/samples/react/.knip.json

@@ -14,10 +14,10 @@
 	],
 	"ignoreDependencies": [
 		"@leanup/stack-webpack",
-		"@public-ui-/theme-ecl",
 		"@public-ui/components",
 		"@public-ui/react",
 		"@public-ui/theme-default",
+		"@public-ui/theme-ecl",
 		"@unocss/preset-uno",
 		"ajv",
 		"nightwatch-axe-verbose",

packages/samples/react/package.json

@@ -8,7 +8,7 @@
 		"url": "https://github.com/public-ui/kolibri"
 	},
 	"scripts": {
-		"prebuild": "pnpm -r --filter=@public-ui/theme-* --filter @public-ui-/theme-* build",
+		"prebuild": "pnpm -r --filter=@public-ui/theme-* build",
 		"build": "rimraf dist && cross-env NODE_ENV=production webpack",
 		"build:deps": "pnpm --filter @public-ui/sample-react^... build",
 		"format": "prettier --check src",
@@ -34,6 +34,7 @@
 		"@public-ui/components": "workspace:*",
 		"@public-ui/react": "workspace:*",
 		"@public-ui/theme-default": "workspace:*",
+		"@public-ui/theme-ecl": "workspace:*",
 		"@stencil/core": "4.22.3",
 		"@types/node": "22.14.1",
 		"@types/react": "18.3.4",
@@ -83,9 +84,6 @@
 		"world_countries_lists": "2.9.0",
 		"yup": "1.6.1"
 	},
-	"optionalDependencies": {
-		"@public-ui-/theme-ecl": "workspace:*"
-	},
 	"files": [
 		".eslintignore",
 		".eslintrc.js",

packages/samples/react/src/react.main.tsx

@@ -6,6 +6,7 @@ import { setTagNameTransformer } from '@public-ui/react';
 import { bootstrap, KoliBriDevHelper } from '@public-ui/components';
 import { defineCustomElements } from '@public-ui/components/dist/loader';
 import { DEFAULT } from '@public-ui/theme-default';
+import { ECL_EC, ECL_EU } from '@public-ui/theme-ecl';
 
 import { App } from './App';
 
@@ -34,17 +35,8 @@ const getThemes = async () => {
 		return [theme];
 	}
 
-	const optionalThemes: Theme[] = [];
-	const { ECL_EC, ECL_EU } = await import('@public-ui-/theme-ecl');
-
-	if (ECL_EC && ECL_EU) {
-		optionalThemes.push(ECL_EC, ECL_EU);
-	} else {
-		console.warn('Theme package @public-ui-/theme-ecl not available. Continuing without it.');
-	}
-
 	/* List of regular sample app themes */
-	return [DEFAULT, ...optionalThemes] as Theme[];
+	return [DEFAULT, ECL_EC, ECL_EU] as Theme[];
 };
 
 void (async () => {

packages/samples/react/webpack.config.js

@@ -1,7 +1,5 @@
 const webpack = require('webpack');
 
-const OPTIONAL_THEME_PACKAGE = '@public-ui-/theme-ecl';
-
 /**
  * @returns {null|string}
  */
@@ -30,25 +28,5 @@ module.exports = (...args) => {
 		}),
 	);
 	delete config.devServer.proxy;
-
-	config.externals = [
-		...(config.externals || []),
-
-		/* Handle optional theme dependencies */
-		({ request }, callback) => {
-			if (request === OPTIONAL_THEME_PACKAGE) {
-				try {
-					require.resolve(OPTIONAL_THEME_PACKAGE);
-					// Package exists, include it
-					return callback();
-				} catch (e) {
-					// Package doesn't exist, replace with empty module
-					return callback(null, 'null');
-				}
-			}
-			callback();
-		},
-	];
-
 	return config;
 };

packages/themes/ecl/README.md

@@ -1,4 +1,4 @@
-# KoliBri - ECL-Themes
+# KoliBri - ECL-Themes (Draft)
 
 [![npm](https://img.shields.io/npm/v/@public-ui/theme-ecl)](https://www.npmjs.com/package/@public-ui/components)
 [![license](https://img.shields.io/npm/l/@public-ui/theme-ecl)](https://github.com/public-ui/kolibri/blob/main/LICENSE)

packages/themes/ecl/package.json

@@ -1,5 +1,5 @@
 {
-	"name": "@public-ui-/theme-ecl",
+	"name": "@public-ui/theme-ecl",
 	"version": "2.1.3",
 	"private": true,
 	"type": "module",

pnpm-lock.yaml

@@ -12,4 +12,5 @@ npm deprecate @public-ui/vue@$1 "Wir empfehlen die Verwendung einer neueren Vers
 npm deprecate @public-ui/components@$1 "Wir empfehlen die Verwendung einer neueren Version (>=$2)."
 npm deprecate @public-ui/sample-react@$1 "Wir empfehlen die Verwendung einer neueren Version (>=$2)."
 npm deprecate @public-ui/theme-default@$1 "Wir empfehlen die Verwendung einer neueren Version (>=$2)."
+npm deprecate @public-ui/theme-ecl@$1 "Wir empfehlen die Verwendung einer neueren Version (>=$2)."
 npm deprecate @public-ui/visual-tests@$1 "Wir empfehlen die Verwendung einer neueren Version (>=$2)."

scripts/deprecate-add.sh

@@ -12,4 +12,5 @@ npm deprecate @public-ui/vue@$1 ""
 npm deprecate @public-ui/components@$1 ""
 npm deprecate @public-ui/sample-react@$1 ""
 npm deprecate @public-ui/theme-default@$1 ""
+npm deprecate @public-ui/theme-ecl@$1 ""
 npm deprecate @public-ui/visual-tests@$1 ""