Support Node.js v20 with @gitbook/icons

Author: gregberge

.changeset/thin-beds-battle.md

@@ -0,0 +1,5 @@
+---
+'@gitbook/icons': minor
+---
+
+Fix the build to support Node.js v20

packages/icons/package.json

@@ -41,5 +41,8 @@
     "bin": {
         "gitbook-icons": "./bin/gitbook-icons.js"
     },
-    "files": ["dist", "src", "bin", "data", "README.md", "CHANGELOG.md"]
+    "files": ["dist", "src", "bin", "data", "README.md", "CHANGELOG.md"],
+    "engines": {
+        "node": ">=20.0.0"
+    }
 }

packages/icons/src/Icon.tsx

@@ -2,9 +2,9 @@
 
 import * as React from 'react';
 
-import { getIconAssetURL, useIcons } from './IconsProvider';
-import { getIconStyle } from './getIconStyle';
-import type { IconName, IconStyle } from './types';
+import { getIconAssetURL, useIcons } from './IconsProvider.js';
+import { getIconStyle } from './getIconStyle.js';
+import type { IconName, IconStyle } from './types.js';
 
 /**
  * Props for the icon component.

packages/icons/src/IconsProvider.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { IconStyle } from './types';
+import { IconStyle } from './types.js';
 
 const version = 2;
 

packages/icons/src/getIconStyle.ts

@@ -1,5 +1,5 @@
-import stylesMap from './data/styles-map.json';
-import type { IconName, IconStyle } from './types';
+import stylesMap from './data/styles-map.json' with { type: 'json' };
+import type { IconName, IconStyle } from './types.js';
 
 const cache = new Map<IconName, Map<IconStyle, [string, IconName]>>();
 

packages/icons/src/icons.ts

@@ -1,5 +1,5 @@
-import rawIcons from './data/icons.json';
-import type { IconName, IconStyle } from './types';
+import rawIcons from './data/icons.json' with { type: 'json' };
+import type { IconName, IconStyle } from './types.js';
 
 export interface IconStyleDefinition {
     title: string;

packages/icons/src/index.ts

@@ -1,3 +1,3 @@
-export * from './Icon';
-export * from './types';
-export * from './IconsProvider';
+export * from './Icon.js';
+export * from './types.js';
+export * from './IconsProvider.js';

packages/icons/src/pro.test.ts

@@ -1,5 +1,5 @@
 import { it } from 'bun:test';
-import { validateIconName } from './icons';
+import { validateIconName } from './icons.js';
 
 it('should have the GitBook custom icon', () => {
     if (!validateIconName('gitbook')) {

packages/icons/tsconfig.json

@@ -1,16 +1,16 @@
 {
     "compilerOptions": {
-        "target": "esnext",
-        "lib": ["dom", "dom.iterable", "esnext"],
-        "allowJs": true,
-        "skipLibCheck": true,
+        "lib": ["es2023"],
+        "module": "Node16",
+        "target": "es2022",
         "strict": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "moduleResolution": "node16",
+        "allowJs": true,
         "noEmit": false,
         "declaration": true,
         "outDir": "dist",
-        "esModuleInterop": true,
-        "module": "esnext",
-        "moduleResolution": "bundler",
         "resolveJsonModule": true,
         "isolatedModules": true,
         "jsx": "react-jsx",