All files / packages/design-system-2/scripts/buildCss watcher.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1x
5x
 
5x
5x
 
5x
3x
 
3x
1x
1x
 
 
 
 
1x
1x
 
 
3x
 
 
5x
5x
5x
 
5x
 
 
/**
 * Watch mode for the CSS build.
 *
 * startWatch() spins up a chokidar watcher over the configured source paths and
 * runs incremental rebuilds on add/change/unlink. A change under a themes/
 * folder also rebuilds the theme-layer base and that one component's themeData
 * JSON; every change re-runs addFiles.
 */
 
import path from 'node:path';
import chokidar from 'chokidar';
import config from './config.ts';
import { addFiles } from './buildStandard.ts';
import { buildThemeLayerBase } from './buildThemeLayer.ts';
import { buildOneThemeData } from './buildThemeData.ts';
import { pearlWatchPaths } from './buildPearl.ts';
 
/**
 * Start the chokidar watcher for incremental rebuilds.
 * @returns The watcher so callers can inspect or close it.
 */
export const startWatch = () => {
  const isThemeFile = (file: string) => /\/themes\//.test(file);
 
  const paths = [...config.watchFiles.paths, ...pearlWatchPaths];
  const watcher = chokidar.watch(paths, config.watchFiles.options);
 
  const handleChange = async (file: string, event: string) => {
    console.info(`${file} has been ${event}`);
 
    if (isThemeFile(file)) {
      console.info('Theme file detected — rebuilding theme-layer base...');
      await buildThemeLayerBase();
      // Refresh this component's themeData JSON. The Storybook Component Hooks
      // panel reads build/themeData/ and picks up the new assignments on its
      // next fetch. This rebuild covers one component. No emptyDir, no full-tree
      // rebuild.
      const componentDir = path.dirname(path.dirname(file));
      await buildOneThemeData(componentDir);
    }
 
    await addFiles();
  };
 
  watcher.on('add', (file) => handleChange(file, 'added'));
  watcher.on('change', (file) => handleChange(file, 'changed'));
  watcher.on('unlink', (file) => handleChange(file, 'removed'));
 
  return watcher;
};