@bobfrankston/extractids 1.0.7 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +8 -0
  2. package/generate-importmap.js +85 -0
  3. package/index.js +2 -2
  4. package/index.js.map +1 -1
  5. package/index.ts +2 -3
  6. package/package.json +3 -2
package/README.md CHANGED
@@ -2,6 +2,14 @@
2
2
 
3
3
  `extractids` is a TypeScript utility that scans your `index.html` and all CSS files in your project to automatically generate type definitions for HTML IDs and CSS classes. These types allow you to perform type-checked DOM and class operations in your code, improving safety and developer experience.
4
4
 
5
+ ## Commands
6
+
7
+ ### extractids
8
+ Scans HTML and CSS files to generate TypeScript type definitions.
9
+
10
+ ### generate-importmap
11
+ Generates ES Module import maps from package.json dependencies for native browser module loading.
12
+
5
13
  ## How It Works
6
14
  - Scans `index.html` for all `id` attributes.
7
15
  - Scans all `.css` files for class names.
package/generate-importmap.js ADDED
@@ -0,0 +1,85 @@
1
+ #!/usr/bin/env node
2
+ /**
3
+ * Generate ES Module import map from package.json dependencies
4
+ * Injects into HTML files for native browser module loading
5
+ */
6
+
7
+ import fs from 'fs';
8
+ import path from 'path';
9
+ import chokidar from 'chokidar';
10
+
11
+ function generateImportMap(packageJsonPath, htmlFilePath) {
12
+ try {
13
+ // Read package.json
14
+ const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf-8'));
15
+ const dependencies = packageJson.dependencies || {};
16
+
17
+ // Generate import map
18
+ const imports = {};
19
+ for (const [name, version] of Object.entries(dependencies)) {
20
+ imports[name] = `./node_modules/${name}/index.js`;
21
+ }
22
+
23
+ const importMapScript = `<script type="importmap">
24
+ ${JSON.stringify({ imports }, null, 12)}
25
+ </script>`;
26
+
27
+ // Read HTML file
28
+ let html = fs.readFileSync(htmlFilePath, 'utf-8');
29
+
30
+ // Replace import map section
31
+ const importMapRegex = /<!-- Import map.*?-->|<script type="importmap">[\s\S]*?<\/script>/;
32
+
33
+ if (importMapRegex.test(html)) {
34
+ html = html.replace(importMapRegex, importMapScript);
35
+ } else {
36
+ // Insert before </head> if not found
37
+ html = html.replace('</head>', ` ${importMapScript}\n</head>`);
38
+ }
39
+
40
+ // Write back to HTML file
41
+ fs.writeFileSync(htmlFilePath, html, 'utf-8');
42
+
43
+ console.log('[generate-importmap] Updated import map');
44
+ console.log(' Dependencies:', Object.keys(dependencies).join(', ') || '(none)');
45
+ } catch (e) {
46
+ console.error('[generate-importmap] Error:', e.message);
47
+ process.exit(1);
48
+ }
49
+ }
50
+
51
+ // Parse CLI arguments
52
+ const args = process.argv.slice(2);
53
+ const watchMode = args.includes('-w') || args.includes('--watch');
54
+ const packageJsonPath = path.join(process.cwd(), 'package.json');
55
+ const htmlFilePath = path.join(process.cwd(), 'index.html');
56
+
57
+ // Check if files exist
58
+ if (!fs.existsSync(packageJsonPath)) {
59
+ console.error('[generate-importmap] Error: package.json not found in current directory');
60
+ process.exit(1);
61
+ }
62
+ if (!fs.existsSync(htmlFilePath)) {
63
+ console.error('[generate-importmap] Error: index.html not found in current directory');
64
+ process.exit(1);
65
+ }
66
+
67
+ if (watchMode) {
68
+ generateImportMap(packageJsonPath, htmlFilePath);
69
+ console.log('[generate-importmap] Watching for changes...');
70
+
71
+ const watcher = chokidar.watch([packageJsonPath], {
72
+ persistent: true,
73
+ ignoreInitial: true
74
+ });
75
+
76
+ watcher.on('change', () => generateImportMap(packageJsonPath, htmlFilePath));
77
+ watcher.on('ready', () => {
78
+ console.log('[generate-importmap] Watcher is ready and running.');
79
+ });
80
+ watcher.on('error', (error) => {
81
+ console.error('[generate-importmap] Watcher error:', error.message);
82
+ });
83
+ } else {
84
+ generateImportMap(packageJsonPath, htmlFilePath);
85
+ }
package/index.js CHANGED
@@ -49,10 +49,10 @@ function globReadCssFiles() {
49
49
  }
50
50
  function generateTypes(ids, classes) {
51
51
  const idType = ids.length > 0
52
- ? `export type htmlIDs = ${ids.map(id => `"${id}"`).join(' | ')};\n`
52
+ ? `export type htmlIDs = ${ids.map(id => `"${id}"`).join(' |\n')};\n`
53
53
  : `export type htmlIDs = never;\n`;
54
54
  const classType = classes.length > 0
55
- ? `export type cssClasses = ${classes.map(cls => `"${cls}"`).join(' | ')};\n`
55
+ ? `export type cssClasses = ${classes.map(cls => `"${cls}"`).join(' |\n')};\n`
56
56
  : `export type cssClasses = never;\n`;
57
57
  return idType + classType;
58
58
  }
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"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"}
package/index.ts CHANGED
@@ -52,11 +52,11 @@ function globReadCssFiles(): string[] {
52
52
  function generateTypes(ids: string[], classes: string[]) {
53
53
  const idType =
54
54
  ids.length > 0
55
- ? `export type htmlIDs = ${ids.map(id => `"${id}"`).join(' | ')};\n`
55
+ ? `export type htmlIDs = ${ids.map(id => `"${id}"`).join(' |\n')};\n`
56
56
  : `export type htmlIDs = never;\n`;
57
57
  const classType =
58
58
  classes.length > 0
59
- ? `export type cssClasses = ${classes.map(cls => `"${cls}"`).join(' | ')};\n`
59
+ ? `export type cssClasses = ${classes.map(cls => `"${cls}"`).join(' |\n')};\n`
60
60
  : `export type cssClasses = never;\n`;
61
61
  return idType + classType;
62
62
  }
@@ -77,7 +77,6 @@ function updateTypesFile() {
77
77
  console.log('[Type generation] Updated generated-types.ts');
78
78
  }
79
79
 
80
-
81
80
  // Parse CLI arguments for -w or --watch
82
81
  const args = process.argv.slice(2);
83
82
  const watchMode = args.includes('-w') || args.includes('--watch');
package/package.json CHANGED
@@ -1,10 +1,11 @@
1
1
  {
2
2
  "name": "@bobfrankston/extractids",
3
- "version": "1.0.7",
3
+ "version": "1.0.8",
4
4
  "description": "Extracd html and css as types",
5
5
  "main": "index.js",
6
6
  "bin": {
7
- "extractids": "index.js"
7
+ "extractids": "index.js",
8
+ "generate-importmap": "generate-importmap.js"
8
9
  },
9
10
  "module": "main.js",
10
11
  "scripts": {