Fix select issues.

milesj · Feb 11, 2024 · c9d9ee7 · c9d9ee7
1 parent 4d10205
commit c9d9ee7
Show file tree

Hide file tree

Showing 9 changed files with 35 additions and 14 deletions.
diff --git a/packages/args/src/Checker.ts b/packages/args/src/Checker.ts
@@ -1,4 +1,5 @@
 import levenary from 'levenary';
+import { interopDefault } from '@boost/internal';
 import { ArgsError, ArgsErrorCode } from './ArgsError';
 import { COMMAND_FORMAT } from './constants';
 import { ParseError } from './ParseError';
@@ -44,7 +45,10 @@ export class Checker {
 
 	// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
 	checkUnknownOption(option: LongOptionName | ShortOptionName) {
-		const guess = levenary(option, Object.keys(this.options));
+		const guess = interopDefault<typeof import('levenary').default>(levenary)(
+			option,
+			Object.keys(this.options),
+		);
 
 		if (guess) {
 			this.logFailureError('OPTION_UNKNOWN_MORE', [option, guess]);

diff --git a/packages/cli/examples/commands/SelectCommand.mjs b/packages/cli/examples/commands/SelectCommand.mjs
@@ -24,7 +24,7 @@ export default class SelectCommand extends Command {
 		},
 		limit: {
 			type: 'number',
-			default: 0,
+			default: 10,
 			description: 'Limit the number of options displayed',
 		},
 		scroll: {

diff --git a/packages/cli/src/Program.ts b/packages/cli/src/Program.ts
@@ -12,7 +12,7 @@ import {
 import { ExitError } from '@boost/common';
 import { Blueprint, Schemas } from '@boost/common/optimal';
 import { Event } from '@boost/event';
-import { env } from '@boost/internal';
+import { env, interopDefault } from '@boost/internal';
 import { createLogger, formats, LoggerFunction, StreamTransport } from '@boost/log';
 import { CLIError } from './CLIError';
 import { Command } from './Command';
@@ -253,7 +253,10 @@ export class Program extends CommandManager<ProgramOptions> {
 			this.onCommandNotFound.emit([argv, possibleCmd]);
 
 			if (possibleCmd) {
-				const closestCmd = levenary(possibleCmd, this.getCommandPaths());
+				const closestCmd = interopDefault<typeof import('levenary').default>(levenary)(
+					possibleCmd,
+					this.getCommandPaths(),
+				);
 
 				throw new CLIError('COMMAND_UNKNOWN', [possibleCmd, closestCmd]);
 			}

diff --git a/packages/cli/src/components/Select.tsx b/packages/cli/src/components/Select.tsx
@@ -95,14 +95,16 @@ export function Select<T = string>(props: SelectProps<T>) {
 	}, [selectedValue, onSubmit, options, highlightedIndex]);
 
 	const renderItem = useCallback(
-		(option: SelectOption<T>) => {
+		(option: SelectOption<T>, index: number) => {
+			const key = `${option.index}-${index}`;
+
 			if (option.divider) {
-				return <DividerRow key={option.index} label={option.label} />;
+				return <DividerRow key={key} label={option.label} />;
 			}
 
 			return (
 				<OptionRow
-					key={option.index}
+					key={key}
 					highlighted={highlightedIndex === option.index}
 					icon={figures.pointerSmall}
 					iconActive={figures.pointer}

diff --git a/packages/cli/src/components/internal/ScrollableList.tsx b/packages/cli/src/components/internal/ScrollableList.tsx
@@ -29,7 +29,7 @@ export interface ScrollableListProps {
 export interface InternalScrollableListProps<T extends ScrollableItem> extends ScrollableListProps {
 	currentIndex: number;
 	items: T[];
-	renderItem: (item: T) => ReactElement;
+	renderItem: (item: T, index: number) => ReactElement;
 	rowHeight?: number;
 }
 
@@ -186,7 +186,7 @@ export function ScrollableList<T extends ScrollableItem>({
 				</Box>
 			)}
 
-			{list.map((item) => renderItem(item))}
+			{list.map((item, index) => renderItem(item, index))}
 
 			{trailingCount > 0 && isOverflow && (
 				<Box marginLeft={2}>

diff --git a/packages/internal/src/env.ts b/packages/internal/src/env.ts
@@ -2,11 +2,11 @@ let envVars: Record<string, unknown> = {};
 
 if (global.process !== undefined) {
 	envVars = process.env;
+} else if ('window' in global && global.window !== undefined) {
+	// @ts-expect-error Allow type mismatch
+	// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+	envVars = window;
 }
-// } else if (global.document !== undefined) {
-// 	// @ts-expect-error Allow type mismatch
-// 	envVars = window;
-// }
 
 export function env<T extends string = string>(key: string, value?: T | null): T | undefined {
 	const name = `BOOSTJS_${key}`;

diff --git a/packages/internal/src/index.ts b/packages/internal/src/index.ts
@@ -7,3 +7,4 @@ export * from './color';
 export * from './createInternalDebugger';
 export * from './createScopedError';
 export * from './env';
+export * from './interopDefault';
diff --git a/packages/internal/src/interopDefault.ts b/packages/internal/src/interopDefault.ts
@@ -0,0 +1,11 @@
+/**
+ * For compatibility with ES modules, this function is used to extract the
+ * default export from an incompatible module.
+ */
+export function interopDefault<R>(result: unknown): R {
+	if (result && typeof result === 'object' && 'default' in result) {
+		return result.default as R;
+	}
+
+	return result as R;
+}
diff --git a/tests/setup.ts b/tests/setup.ts
@@ -26,7 +26,7 @@ expect.extend({
 	},
 });
 
-global.delay = function delay(time: number = 100) {
+global.delay = function delay(time: number = 250) {
 	return new Promise((resolve) => {
 		setTimeout(resolve, time);
 	});