[UIK-5200] cleanup in esbuild files

commonVite.config.ts

@@ -1,27 +1,16 @@
+import { dirname, resolve as resolvePath } from 'path';
+import { fileURLToPath } from 'url';
+
+import { unpluginSemcoreResolve } from '@semcore/builder/plugins';
 import copy from 'rollup-plugin-copy';
-import { createUnplugin } from 'unplugin';
 import type { UserConfig } from 'vite';
 import { defineConfig } from 'vite';
 
-import { loadSemcoreSources } from './website/docs/.vitepress/load-semcore-sources';
-import { resolveSemcoreSources } from './website/docs/.vitepress/resolve-semcore-sources';
+const rootDir = resolvePath(dirname(fileURLToPath(import.meta.url)));
 
 export default defineConfig({
   plugins: [
-    createUnplugin<{}>(() => ({
-      name: 'semcore-styles-resolver',
-      async resolveId(id) {
-        if (!id.endsWith('.shadow.css')) return null;
-        return await resolveSemcoreSources(id);
-      },
-      loadInclude: (id) => {
-        return id.includes('/semcore/');
-      },
-      async load(id) {
-        return await loadSemcoreSources(id, true);
-      },
-      enforce: 'pre',
-    })).vite({}),
+    unpluginSemcoreResolve.vite({ rootPath: rootDir }),
   ],
   esbuild: {
     legalComments: 'inline',

package.json

@@ -5,7 +5,6 @@
     "start": "pnpm storybook",
     "build": "pnpm run clean && pnpm --filter @semcore/theme run build && pnpm --filter @semcore/core run build && pnpm build:icons && pnpm build:illustration && pnpm --filter @semcore/base-components run build && pnpm --filter @semcore/dropdown run build && pnpm --filter @semcore/* --filter !@semcore/icon --filter !@semcore/core --filter !@semcore/base-components --filter !@semcore/illustration --filter !@semcore/dropdown --filter !@semcore/ui run build",
     "process-theme": "pnpm --filter @semcore/theme build",
-    "typecheck": "pnpm --filter @semcore/* --filter !@semcore/babel-plugin-root --filter !@semcore/babel-plugin-styles --filter !@semcore/babel-plugin-react-semcore --filter !@semcore/babel-preset-ui --filter !@semcore/testing-utils --filter !@semcore/email --filter !@semcore/icon-transform-svg --filter !@semcore/shadow-loader exec tsc --noEmit",
     "install-n-test": "pnpm install && pnpm test",
     "install-n-browser-test": "pnpm install && pnpm browser-test",
     "install-n-axe-test": "pnpm install && pnpm axe-test",

stories/components/button/tests/button.stories.tsx

@@ -5,7 +5,7 @@ import ButtonBaseExample, { defaultButtonProps } from './examples/button-base';
 import ButtonIconOnlyExample, { defaultIconButtonProps } from './examples/button-icon-only';
 import ButtonNeighborLocationExample, { defaultButtonNeighborProps } from './examples/button-neighbor-location';
 import ButtonWithEllipsisExample, { defaultButtonEllipsisProps } from './examples/button-with-ellipsis';
-import { themeArg, THEMES } from './themeUtils.ts';
+import { themeArg, THEMES } from './themeUtils';
 
 const meta: Meta = { title: 'Components/Button/Tests' };
 export default meta;

stories/components/button/tests/examples/button-base.tsx

@@ -5,7 +5,7 @@ import Button from '@semcore/ui/button';
 import type { ButtonProps } from '@semcore/ui/button';
 import React from 'react';
 
-import { themeFor } from '../themeUtils.ts';
+import { themeFor } from '../themeUtils';
 
 type ExampleProps = Exclude<ButtonProps, 'theme' | 'use'> & { style?: any; theme: string };
 const Demo = (props: ExampleProps) => {

stories/components/button/tests/examples/button-icon-only.tsx

@@ -5,7 +5,7 @@ import type { ButtonProps } from '@semcore/ui/button';
 import Tooltip, { Hint } from '@semcore/ui/tooltip';
 import React from 'react';
 
-import { themeFor } from '../themeUtils.ts';
+import { themeFor } from '../themeUtils';
 
 type ExampleProps = Exclude<ButtonProps, 'theme' | 'use'> & { style?: any; theme: string };
 const Demo = (props: ExampleProps) => {

stories/components/button/tests/examples/button-neighbor-location.tsx

@@ -4,7 +4,7 @@ import Button from '@semcore/ui/button';
 import type { ButtonProps } from '@semcore/ui/button';
 import React from 'react';
 
-import { themeFor } from '../themeUtils.ts';
+import { themeFor } from '../themeUtils';
 
 type ExampleProps = Exclude<ButtonProps, 'theme' | 'use'> & { style?: any; theme: string };
 const Demo = (props: ExampleProps) => {

stories/components/button/tests/examples/button-with-ellipsis.tsx

@@ -3,7 +3,7 @@ import Button from '@semcore/ui/button';
 import type { ButtonProps } from '@semcore/ui/button';
 import React from 'react';
 
-import { themeFor } from '../themeUtils.ts';
+import { themeFor } from '../themeUtils';
 
 type ButtonEllipsisProps = ButtonProps & {
   ellipsis?: NSText.EllipsisProps;

stories/patterns/core/tests/all-components/components/Dashboard/Dashboard.tsx

@@ -24,7 +24,7 @@ import DonutMockData from '../../../../../../components/d3-chart/__mocks__/donut
 import ScatterplotMockData from '../../../../../../components/d3-chart/__mocks__/scatterplot';
 import VennMockData from '../../../../../../components/d3-chart/__mocks__/venn';
 import FeedbackRatingFormExample
-  from '../../../../../ux-patterns/feedback-rating/docs/examples/feedback_rating_form.tsx';
+  from '../../../../../ux-patterns/feedback-rating/docs/examples/feedback_rating_form';
 import PrimaryTable from '../Tables/PrimaryTable';
 
 export type DashboardProps = {

tools/builder/package.json

@@ -6,15 +6,20 @@
   },
   "license": "MIT",
   "private": true,
+  "exports": {
+    "./plugins": "./src/plugins.ts"
+  },
   "dependencies": {
     "@semcore/babel-preset-ui": "workspace:*",
+    "@semcore/esbuild-plugin-semcore": "workspace:*",
     "execa": "5.0.0",
     "fs-extra": "8.1.0",
     "mri": "1.2.0",
     "postcss": "8.4.33",
     "postcss-cli": "7.1.0",
     "postcss-import": "12.0.1",
     "postcss-inline-comment": "3.0.0",
-    "postcss-preset-env": "6.7.0"
+    "postcss-preset-env": "6.7.0",
+    "unplugin": "3.0.0"
   }
 }

tools/builder/src/plugins.ts

@@ -0,0 +1,9 @@
+import { unpluginIcons } from './unplugin-icons.ts';
+import { unpluginIllustrations } from './unplugin-illustrations.ts';
+import { unpluginSemcoreResolve } from './unplugin-semcore.ts';
+
+export {
+  unpluginIcons,
+  unpluginIllustrations,
+  unpluginSemcoreResolve,
+};

website/docs/.vitepress/unplugins/unplugin-icons.ts → tools/builder/src/unplugin-icons.ts

@@ -1,5 +1,4 @@
-import { resolve as resolvePath, dirname as resolveDirname } from 'path';
-import { fileURLToPath } from 'url';
+import { resolve as resolvePath } from 'path';
 
 import glob from 'fast-glob';
 import { createUnplugin } from 'unplugin';
@@ -12,18 +11,14 @@ type IconPaths = Record<string, {
   };
 }>;
 
-const __dirname = resolveDirname(fileURLToPath(import.meta.url));
-
-const iconsDir = resolvePath(__dirname, '../../../../semcore/icon');
-
-export const unpluginIcons = createUnplugin(() => ({
+export const unpluginIcons = createUnplugin<{ rootPath: string }>((opts) => ({
   name: 'unplugin-icons',
   async resolveId(id) {
     if (id === '@icons') return id;
   },
   async load(id) {
     if (id !== '@icons') return null;
-
+    const iconsDir = resolvePath(opts.rootPath, 'semcore', 'icon');
     const fullPath = id.endsWith('/lib') ? resolvePath(iconsDir, 'lib') : resolvePath(iconsDir);
     const allIcons = await glob('**/index.mjs', {
       cwd: fullPath,

website/docs/.vitepress/unplugins/unplugin-illustrations.ts → tools/builder/src/unplugin-illustrations.ts

@@ -1,21 +1,16 @@
-import { resolve as resolvePath, dirname as resolveDirname } from 'path';
-import { fileURLToPath } from 'url';
+import { resolve as resolvePath } from 'path';
 
-import { Plugin } from 'esbuild';
 import glob from 'fast-glob';
 import { createUnplugin } from 'unplugin';
 
-const __dirname = resolveDirname(fileURLToPath(import.meta.url));
-
-const illustrationsDir = resolvePath(__dirname, '../../../../semcore/illustration');
-
-export const unpluginIllustrations = createUnplugin(() => ({
+export const unpluginIllustrations = createUnplugin<{ rootPath: string }>((opts) => ({
   name: 'unplugin-illustrations',
   async resolveId(id) {
     if (id === '@illustrations') return id;
   },
   async load(id) {
     if (id !== '@illustrations') return null;
+    const illustrationsDir = resolvePath(opts.rootPath, 'semcore', 'illustration');
     const fullPath = resolvePath(illustrationsDir);
     const illustrationPaths = await glob('lib/*/index.mjs', {
       cwd: fullPath,

tools/builder/src/unplugin-semcore.ts

@@ -0,0 +1,43 @@
+import { loadSemcoreSources, resolveSemcoreSources } from '@semcore/esbuild-plugin-semcore';
+import { createUnplugin } from 'unplugin';
+
+import { makeCacheManager } from './cache-manager.ts';
+
+const cacheManager = makeCacheManager('esbuild_plugin_semcore-resolver');
+
+export const unpluginSemcoreResolve = createUnplugin<{ rootPath: string }>((opts) => ({
+  name: 'semcore-resolve',
+  async buildStart() {
+    await cacheManager.init();
+
+    if (process.argv.includes('--reset-cache')) {
+      await cacheManager.reset();
+    }
+  },
+  async resolveId(id) {
+    if (!id.includes('@semcore') || id.includes('@semcore/theme')) return null;
+    if (id.endsWith('.md')) return null;
+    return await resolveSemcoreSources(id, opts.rootPath);
+  },
+  loadInclude: (id) => {
+    return id.includes('/semcore/');
+  },
+  async load(id) {
+    const cache = await cacheManager.hasInCache(id);
+
+    if (cache) {
+      return {
+        code: cache,
+      };
+    }
+
+    const { code } = await loadSemcoreSources(id);
+
+    await cacheManager.addToCache(id, code);
+
+    return {
+      code,
+    };
+  },
+  enforce: 'pre',
+}));

tools/builder/tsconfig.json

@@ -1,7 +1,8 @@
 {
   "compilerOptions": {
     "module": "esnext",
-    "target": "esnext"
+    "target": "esnext",
+    "allowImportingTsExtensions": true
   },
   "extends": "../../tsconfig.json",
   "include": ["src", "lib", "bin"]

tools/continuous-delivery/src/utils/gitUtils.ts

@@ -1,9 +1,9 @@
 import { execSync } from 'child_process';
 import process from 'process';
 
-import type { ReleaseVersion } from '@tools/continuous-delivery/src/utils/changelog';
 import Git from 'simple-git';
 
+import type { ReleaseVersion } from './changelog';
 import { log, prerelaseSuffix } from '../utils';
 import { NpmUtils } from './npmUtils';
 import type { PackageJson } from './packages';

tools/esbuild-plugin-semcore/package.json

@@ -2,15 +2,10 @@
   "name": "@semcore/esbuild-plugin-semcore",
   "version": "1.0.0",
   "exports": {
-    ".": "./src/esbuild-plugin-semcore.ts",
-    "./esbuild-plugin-semcore-sources-resolve": "./src/esbuild-plugin-semcore-sources-resolve.ts",
-    "./cache-manager": "./src/cache-manager.ts"
+    ".": "./src/index.ts"
   },
   "license": "MIT",
   "private": true,
-  "scripts": {
-    "test": "jest"
-  },
   "devDependencies": {
     "@types/babel__core": "^7.20.5",
     "esbuild": "0.28.0"