chore: avoid shameful hoisting (#1471)

Co-authored-by: AndreasBerliner <[email protected]>

.npmrc

@@ -1,8 +1,20 @@
 registry=https://registry.npmjs.org
 @siemens:registry=https://registry.npmjs.org
-shamefully-hoist=true
 puppeteer_skip_chromium_download=true
 puppeteer_skip_chrome_headless_shell_download=true
 puppeteer_skip_download=true
-link-workspace-packages = deep
-prefer-workspace-packages = true
+link-workspace-packages=deep
+prefer-workspace-packages=true
+
+# angular-test-app echarts dependency needs public hoisting
+public-hoist-pattern[]=zrender
+public-hoist-pattern[]=claygl
+
+# documentation
+public-hoist-pattern[]=@docusaurus/*
+public-hoist-pattern[]=hogan.js
+public-hoist-pattern[]=autocomplete.js
+public-hoist-pattern[]=mark.js
+public-hoist-pattern[]=lunr
+
+public-hoist-pattern[]=playwright

packages/angular-test-app/package.json

@@ -6,7 +6,7 @@
     "ng": "ng",
     "copy-preview-styles": "node ./scripts/copy-preview.mjs",
     "start": "pnpm copy-preview-styles && ng serve",
-    "build": "pnpm copy-preview-styles && ng build --preserve-symlinks -c production",
+    "build": "pnpm copy-preview-styles && ng build -c production",
     "watch": "ng build --watch --configuration development",
     "test": "ng test --no-watch --no-progress --browsers=ChromeHeadlessCI"
   },
@@ -27,7 +27,7 @@
     "@siemens/ix-icons": "^2.0.0",
     "ag-grid-angular": "^30.0.0",
     "ag-grid-community": "^30.2.0",
-    "echarts": "^5.4.1",
+    "echarts": "^5.5.1",
     "echarts-gl": "^2.0.9",
     "example-styles": "workspace:*",
     "ngx-echarts": "~14.0.0",

packages/core/.eslintignore

@@ -2,3 +2,4 @@ playwright-ct.config.ts
 playwright.config.ts
 stencil.config.ts
 src/components.d.ts
+scripts/build

packages/core/component-doc.json

@@ -17914,6 +17914,11 @@
       "docstring": "",
       "path": "src/components/toast/toast-utils.ts"
     },
+    "../../node_modules/.pnpm/@[email protected]/node_modules/@stencil/core/internal/stencil-core/index.d.ts::Element": {
+      "declaration": "any",
+      "docstring": "",
+      "path": "../../node_modules/.pnpm/@[email protected]/node_modules/@stencil/core/internal/stencil-core/index.d.ts"
+    },
     "src/components/tree/tree-model.ts::TreeModel": {
       "declaration": "{\n    [P in K]: T;\n}",
       "docstring": "",

packages/core/package.json

@@ -65,7 +65,7 @@
     "@types/animejs": "^3.1.4",
     "@types/jest": "^29.5.6",
     "@types/mustache": "^4.1.1",
-    "@types/node": "^16.18.11",
+    "@types/node": "^20.16.0",
     "@typescript-eslint/eslint-plugin": "^6.14.0",
     "@typescript-eslint/parser": "^6.14.0",
     "animate.css": "~4.1.1",

packages/core/scripts/build/dev.ts

@@ -0,0 +1,76 @@
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { JsonDocs } from '@stencil/core/internal';
+import fs from 'fs';
+import path from 'path';
+
+function normalizeProperties(obj: JsonDocs, deleteProps: string[]) {
+  for (const key in obj) {
+    if (obj[key] && typeof obj[key] === 'object') {
+      normalizeProperties(obj[key], deleteProps);
+    } else if (deleteProps.includes(key)) {
+      const posixPath = path
+        .join(
+          ...path
+            .relative(path.join(__dirname, '..', '..'), obj[key])
+            .split(path.sep)
+        )
+        .toString();
+      obj[key] = posixPath.replace(/\\/g, '/');
+    }
+  }
+
+  return obj;
+}
+
+export const customComponentDocGenerator = (docs: JsonDocs): void => {
+  // Delete timestamp from docs, because turbo caching not working with autogenerated time
+  docs.timestamp = '';
+  const docsJson = JSON.stringify(docs, null, 2);
+
+  // Remove all paths from component doc
+  const patchedJson = normalizeProperties(JSON.parse(docsJson), [
+    'dirPath',
+    'filePath',
+    'readmePath',
+    'usagesDir',
+    'path',
+  ]);
+
+  fs.writeFileSync('component-doc.json', JSON.stringify(patchedJson, null, 2));
+};
+
+export const getDevAssets = () => {
+  const copyAssets = [
+    {
+      src: './../node_modules/@siemens/ix-icons/dist',
+      dest: 'build/ix-icons',
+    },
+    {
+      src: './../node_modules/bootstrap',
+      dest: 'build/bootstrap',
+    },
+  ];
+
+  try {
+    const brandTheme = require.resolve('@siemens/ix-brand-theme');
+
+    if (brandTheme) {
+      const themeFolder = path.join(brandTheme, '..', '..');
+      copyAssets.push({
+        src: themeFolder,
+        dest: 'build/ix-brand-theme',
+      });
+    }
+  } catch (e) {
+    console.warn('No additional theme fround');
+  }
+
+  return copyAssets;
+};

packages/core/stencil.config.ts

@@ -10,38 +10,11 @@
 import { postcss } from '@stencil-community/postcss';
 import { angularOutputTarget } from '@stencil/angular-output-target';
 import { Config } from '@stencil/core';
-import { JsonDocs } from '@stencil/core/internal';
 import { reactOutputTarget } from '@stencil/react-output-target';
 import { sass } from '@stencil/sass';
 import { vueOutputTarget } from '@stencil/vue-output-target';
 import autoprefixer from 'autoprefixer';
-import fs from 'fs';
-import path from 'path';
-
-const copyAssets = [
-  {
-    src: './../../../node_modules/@siemens/ix-icons/dist',
-    dest: 'build/ix-icons',
-  },
-  {
-    src: './../../../node_modules/bootstrap',
-    dest: 'build/bootstrap',
-  },
-];
-
-try {
-  const brandTheme = require.resolve('@siemens/ix-brand-theme');
-
-  if (brandTheme) {
-    const themeFolder = path.join(brandTheme, '..', '..');
-    copyAssets.push({
-      src: themeFolder,
-      dest: 'build/ix-brand-theme',
-    });
-  }
-} catch (e) {
-  console.warn('No additional theme fround');
-}
+import { customComponentDocGenerator, getDevAssets } from './scripts/build/dev';
 
 export const config: Config = {
   globalScript: './src/setup.ts',
@@ -130,48 +103,15 @@ export const config: Config = {
     },
     {
       type: 'docs-custom',
-      generator: (docs: JsonDocs) => {
-        // Delete timestamp from docs, because turbo caching not working with autogenerated time
-        docs.timestamp = '';
-        const docsJson = JSON.stringify(docs, null, 2);
-
-        // Remove all paths from component doc
-        const patchedJson = normalizeProperties(JSON.parse(docsJson), [
-          'dirPath',
-          'filePath',
-          'readmePath',
-          'usagesDir',
-          'path',
-        ]);
-
-        fs.writeFileSync(
-          'component-doc.json',
-          JSON.stringify(patchedJson, null, 2)
-        );
-      },
+      generator: customComponentDocGenerator,
     },
     {
       type: 'www',
       serviceWorker: null,
-      copy: copyAssets,
+      copy: getDevAssets(),
     },
     {
       type: 'dist-hydrate-script',
     },
   ],
 };
-
-function normalizeProperties(obj: JsonDocs, deleteProps: string[]) {
-  for (const key in obj) {
-    if (obj[key] && typeof obj[key] === 'object') {
-      normalizeProperties(obj[key], deleteProps);
-    } else if (deleteProps.includes(key)) {
-      const posixPath = path
-        .join(...path.relative(__dirname, obj[key]).split(path.sep))
-        .toString();
-      obj[key] = posixPath.replace(/\\/g, '/');
-    }
-  }
-
-  return obj;
-}

packages/core/tsconfig.json

@@ -12,7 +12,7 @@
     "noUnusedParameters": true,
     "jsx": "react",
     "jsxFactory": "h",
-    "preserveSymlinks": true,
+    "preserveSymlinks": false,
     "skipLibCheck": true,
     "baseUrl": ".",
     "paths": {

packages/example-styles/package.json

@@ -9,6 +9,7 @@
     "build": "tsc && node build.mjs"
   },
   "devDependencies": {
+    "@types/fs-extra": "^9.0.13",
     "fs-extra": "^11.2.0",
     "rimraf": "^6.0.1",
     "typescript": "^5.2.2"

packages/html-test-app/package.json

@@ -13,11 +13,14 @@
     "dist"
   ],
   "devDependencies": {
-    "vite": "^3.1.0",
     "@siemens/ix": "workspace:*",
     "@siemens/ix-aggrid": "workspace:*",
     "@siemens/ix-echarts": "workspace:*",
+    "@siemens/ix-icons": "^2.0.0",
     "example-styles": "workspace:*",
-    "@siemens/ix-icons": "^2.0.0"
+    "vite": "^3.1.0"
+  },
+  "dependencies": {
+    "ag-grid-community": "^32.1.0"
   }
 }

packages/ionic-test-app/package.json

@@ -43,6 +43,7 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
+    "@types/jest": "^29.5.13",
     "@types/react": "^18.0.27",
     "@types/react-dom": "^18.0.10",
     "@vitejs/plugin-legacy": "^5.0.0",

packages/react-test-app/package.json

@@ -11,15 +11,16 @@
   },
   "dependencies": {
     "@siemens/ix": "workspace:*",
-    "@siemens/ix-react": "workspace:*",
     "@siemens/ix-aggrid": "workspace:*",
     "@siemens/ix-echarts": "workspace:*",
-    "example-styles": "workspace:*",
     "@siemens/ix-icons": "^2.0.0",
+    "@siemens/ix-react": "workspace:*",
     "ag-grid-community": "^30.2.0",
     "ag-grid-react": "^29.1.0",
-    "echarts-for-react": "~3.0.2",
     "echarts": "^5.4.1",
+    "echarts-for-react": "~3.0.2",
+    "echarts-gl": "^2.0.9",
+    "example-styles": "workspace:*",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-hook-form": "^7.34.2",

packages/vue-test-app/package.json

@@ -11,18 +11,19 @@
   },
   "dependencies": {
     "@siemens/ix": "workspace:*",
-    "@siemens/ix-vue": "workspace:*",
     "@siemens/ix-aggrid": "workspace:*",
     "@siemens/ix-echarts": "workspace:*",
-    "example-styles": "workspace:*",
     "@siemens/ix-icons": "^2.0.0",
+    "@siemens/ix-vue": "workspace:*",
     "ag-grid-community": "^30.2.0",
     "ag-grid-vue3": "^30.1.0",
-    "vue-echarts": "~6.6.9",
     "echarts": "^5.4.1",
+    "echarts-gl": "^2.0.9",
+    "example-styles": "workspace:*",
     "vue": "^3.2.45",
-    "web-vitals": "^2.1.4",
-    "vue-hooks-form": "^0.3.0"
+    "vue-echarts": "~6.6.9",
+    "vue-hooks-form": "^0.3.0",
+    "web-vitals": "^2.1.4"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^4.0.0",