Entry Points pre-work [LG-5028]

.changeset/build-rollup-config.md

@@ -0,0 +1,6 @@
+---
+'@lg-tools/build': minor
+---
+
+- Only adds output `globals` for UMD builds
+- Splits `/testing` entry point if `src/testing/index.ts` file exists

.changeset/code-postinstall-hljs.md

@@ -0,0 +1,5 @@
+---
+'@leafygreen-ui/code': minor
+---
+
+Adds postinstall script to ensure dependency types are resolved correctly

.changeset/palette-bundle-less.md

@@ -0,0 +1,5 @@
+---
+'@leafygreen-ui/palette': patch
+---
+
+Creates local Rollup config to bundle `.less` files

charts/core/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "@lg-tools/build/config/package.tsconfig.json",
   "compilerOptions": {
+    "moduleResolution": "node",
     "paths": {
       "@leafygreen-ui/icon/dist/*": [
         "../../packages/icon/src/generated/*"

chat/lg-markdown/tsconfig.json

@@ -1,6 +1,8 @@
 {
   "extends": "@lg-tools/build/config/package.tsconfig.json",
   "compilerOptions": {
+    "moduleResolution": "node",
+
     "paths": {
       "@leafygreen-ui/icon/dist/*": [
         "../../packages/icon/src/generated/*"

package.json

@@ -22,6 +22,7 @@
     "chromatic": "npx chromatic",
     "clean": "npm-run-all --parallel clean:*",
     "clean:builds": "pnpm recursive exec -- rm -rf ./{dist,tsconfig.tsbuildinfo,stories.js}",
+    "clean:ts": "pnpm recursive exec -- rm -rf ./{dist/**/*.d.ts.,tsconfig.tsbuildinfo}",
     "clean:cache": "pnpm recursive exec -- rm -rf ./.turbo; rm -rf .turbo/cache",
     "clean:modules": "pnpm recursive exec -- rm -rf node_modules; rm -rf node_modules",
     "fix": "lg lint --fix",

packages/code/package.json

@@ -9,7 +9,8 @@
   "scripts": {
     "build": "lg build-package",
     "tsc": "lg build-ts",
-    "docs": "lg build-tsdoc"
+    "docs": "lg build-tsdoc",
+    "postinstall": "npx ts-node scripts/postinstall.ts"
   },
   "keywords": [],
   "license": "Apache-2.0",
@@ -40,7 +41,6 @@
     "lodash": "^4.17.21",
     "polished": "^4.2.2"
   },
-  "devDependencies": {},
   "peerDependencies": {
     "@leafygreen-ui/leafygreen-provider": "workspace:^"
   },

packages/code/scripts/postinstall.ts

@@ -0,0 +1,61 @@
+/* eslint-disable no-console */
+import packageConfig from '@lg-tools/build/config/package.tsconfig.json';
+import fs from 'fs';
+import path from 'path';
+
+const highlightJsPath = path.resolve(
+  __dirname,
+  '..',
+  'node_modules',
+  'highlight.js',
+);
+
+const tsConfigPath = path.join(highlightJsPath, 'tsconfig.json');
+
+/**
+ * This script adds a tsconfig.json file to the highlight.js module in node_modules,
+ * to ensure TypeScript can properly resolve types when importing highlight.js
+ *
+ * Hopefully this will be removed in the future.
+ */
+async function main() {
+  try {
+    if (fs.existsSync(highlightJsPath)) {
+      if (fs.existsSync(tsConfigPath)) {
+        // If the tsconfig.json file already exists, skip creating it
+        return;
+      }
+
+      console.log('📦 Adding tsconfig.json to highlight.js module...');
+
+      // Define the tsconfig.json content
+      const tsconfig = {
+        ...packageConfig,
+        compilerOptions: {
+          ...packageConfig.compilerOptions,
+          baseUrl: './types',
+        },
+      };
+
+      // Write the tsconfig.json file to the highlight.js directory
+      fs.writeFileSync(tsConfigPath, JSON.stringify(tsconfig, null, 2));
+
+      console.log(`✅ Successfully wrote file ${tsConfigPath}`);
+    } else {
+      console.log(
+        '⚠️ highlight.js module not found in node_modules. Skipping tsconfig.json creation.',
+      );
+    }
+  } catch (error) {
+    console.error(
+      '❌ Error adding tsconfig.json to highlight.js module:',
+      error,
+    );
+    process.exit(1);
+  }
+}
+
+main().catch(error => {
+  console.error('❌ Unhandled error:', error);
+  process.exit(1);
+});

packages/code/scripts/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "@lg-tools/build/config/script.tsconfig.json",
+  "compilerOptions": {
+    "noUnusedLocals": false,
+    "strict": true,
+    "baseUrl": ".",
+  }
+}

packages/code/src/CopyButton/CopyButton.tsx

@@ -62,8 +62,7 @@ function CopyButton({ onCopy, contents, className, ...rest }: CopyProps) {
 
     const clipboard = new ClipboardJS(buttonRef.current, {
       text: () => contents,
-      // @ts-expect-error TODO: types
-      container: portalContainer,
+      container: portalContainer ?? undefined,
     });
 
     if (copied) {

packages/code/src/utils/getTestUtils/getTestUtils.ts

@@ -1,7 +1,7 @@
 import { getByLgId, queryBySelector } from '@lg-tools/test-harnesses';
 
 import { getTestUtils as getButtonTestUtils } from '@leafygreen-ui/button';
-import { getTestUtils as getSelectTestUtils } from '@leafygreen-ui/select';
+import { getTestUtils as getSelectTestUtils } from '@leafygreen-ui/select/testing';
 
 import { DEFAULT_LGID_ROOT, getLgIds } from '../getLgIds';
 

packages/code/src/utils/getTestUtils/getTestUtils.types.ts

@@ -1,5 +1,5 @@
 import { GetTestUtilsReturnType as GetButtonTestUtilsReturnType } from '@leafygreen-ui/button';
-import { GetTestUtilsReturnType as GetSelectTestUtilsReturnType } from '@leafygreen-ui/select';
+import type { GetTestUtilsReturnType as GetSelectTestUtilsReturnType } from '@leafygreen-ui/select/testing';
 
 export interface TestUtilsReturnType {
   /**

packages/code/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "@lg-tools/build/config/package.tsconfig.json",
   "compilerOptions": {
+    "moduleResolution": "node",
     "paths": {
       "@leafygreen-ui/icon/dist/*": [
         "../icon/src/generated/*"

packages/palette/package.json

@@ -15,9 +15,11 @@
   "publishConfig": {
     "access": "public"
   },
+  "dependencies": {},
   "devDependencies": {
     "@leafygreen-ui/emotion": "workspace:^",
     "@leafygreen-ui/lib": "workspace:^",
+    "@rollup/plugin-url": "8.0.2",
     "polished": "^4.2.2"
   },
   "gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0",
@@ -28,6 +30,5 @@
   },
   "bugs": {
     "url": "https://jira.mongodb.org/projects/PD/summary"
-  },
-  "dependencies": {}
+  }
 }

packages/palette/rollup.config.mjs

@@ -0,0 +1,32 @@
+import urlPlugin from '@rollup/plugin-url';
+import {
+  esmConfig,
+  umdConfig,
+  storiesConfig,
+} from '@lg-tools/build/config/rollup.config.mjs';
+
+export default [
+  {
+    ...esmConfig,
+    plugins: [
+      ...esmConfig.plugins,
+      urlPlugin({
+        limit: 0,
+        include: ['**/*.less'],
+        fileName: '[name][extname]',
+      }),
+    ],
+  },
+  {
+    ...umdConfig,
+    plugins: [
+      ...esmConfig.plugins,
+      urlPlugin({
+        limit: 0,
+        include: ['**/*.less'],
+        fileName: '[name][extname]',
+      }),
+    ],
+  },
+  storiesConfig,
+];

packages/select/package.json

@@ -6,6 +6,18 @@
   "module": "./dist/esm/index.js",
   "types": "./dist/types/index.d.ts",
   "typesVersions": {},
+  "exports": {
+    ".": {
+      "import": "./dist/esm/index.js",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./testing": {
+      "import": "./dist/esm/testing/index.js",
+      "require": "./dist/testing/index.js",
+      "types": "./dist/testing/index.d.ts"
+    }
+  },
   "scripts": {
     "build": "lg build-package",
     "tsc": "lg build-ts",

packages/select/rollup.config.mjs

@@ -0,0 +1,30 @@
+import {
+  esmConfig,
+  umdConfig,
+  storiesConfig,
+} from '@lg-tools/build/config/rollup.config.mjs';
+
+const esmTestUtilsConfig = {
+  ...esmConfig,
+  input: 'src/testing/index.ts',
+  output: {
+    ...esmConfig.output,
+    dir: 'dist/esm/testing',
+  },
+};
+const umdTestUtilsConfig = {
+  ...umdConfig,
+  input: 'src/testing/index.ts',
+  output: {
+    ...umdConfig.output,
+    dir: 'dist/testing',
+  },
+};
+
+export default [
+  esmConfig,
+  umdConfig,
+  esmTestUtilsConfig,
+  umdTestUtilsConfig,
+  storiesConfig,
+];

packages/select/src/Select/Select.spec.tsx

@@ -16,8 +16,7 @@ import { keyMap } from '@leafygreen-ui/lib';
 import { RenderMode } from '@leafygreen-ui/popover';
 import { Context, jest as Jest } from '@leafygreen-ui/testing-lib';
 
-import { getTestUtils } from '../utils/getTestUtils/getTestUtils';
-import { TestUtilsReturnType } from '../utils/getTestUtils/getTestUtils.types';
+import { getTestUtils, type TestUtilsReturnType } from '../testing';
 import { Option, OptionGroup, Select } from '..';
 
 import { SelectProps, State } from './Select.types';

packages/select/src/index.ts

@@ -12,4 +12,3 @@ export {
   Size,
   State,
 } from './Select';
-export { getTestUtils, type GetTestUtilsReturnType } from './utils';

packages/select/src/testing/index.ts

@@ -0,0 +1,2 @@
+export { getTestUtils } from './utils/getTestUtils';
+export type { GetTestUtilsReturnType } from './utils/getTestUtils.types';

tools/build/config/package.tsconfig.json

@@ -18,6 +18,7 @@
     "strictNullChecks": true,
     "pretty": true,
     "skipLibCheck": true,
+    "lib": ["DOM", "DOM.Iterable", "ES2020"],
     "baseUrl": "${configDir}",
     "rootDir": "${configDir}/src",
     "outDir": "${configDir}/dist",