diff --git a/README.md b/README.md index 4571b77..b5149ed 100644 --- a/README.md +++ b/README.md @@ -9,11 +9,14 @@ ### Installation **npm (recommended)** + ```shell npm install -g @microsoft/inshellisense is init ``` + **homebrew (macOS/linux)** + ```shell brew tap microsoft/inshellisense https://github.com/microsoft/inshellisense brew install inshellisense @@ -140,11 +143,17 @@ useNerdFont = true You can change the maximum number of suggestions displayed in the autocomplete list at one time in your config file: - ```toml maxSuggestions = 10 ``` +### Active Suggestion Background Color + +You can customize the active suggestion's background with a `#RRGGBB` hex color. + +```toml +activeSuggestionBackgroundColor = "#2E7D32" +``` ## Unsupported Specs diff --git a/src/ui/suggestionManager.ts b/src/ui/suggestionManager.ts index 2a37f57..2589b01 100644 --- a/src/ui/suggestionManager.ts +++ b/src/ui/suggestionManager.ts @@ -20,7 +20,6 @@ const suggestionWidth = 40; const descriptionWidth = 30; const descriptionHeight = 5; const borderWidth = 2; -const activeSuggestionBackgroundColor = "#7D56F4"; export const getMaxLines = () => borderWidth + Math.max(getMaxSuggestions(), descriptionHeight) + 1; // accounts when there is a unhandled newline at the end of the command export const MIN_WIDTH = borderWidth + descriptionWidth; @@ -149,7 +148,7 @@ export class SuggestionManager { suggestions.map((suggestion, idx) => { const suggestionText = `${suggestion.icon} ${suggestion.name}`; const truncatedSuggestion = truncateText(suggestionText, suggestionWidth - 2); - return idx == activeSuggestionIdx ? chalk.bgHex(activeSuggestionBackgroundColor)(truncatedSuggestion) : truncatedSuggestion; + return idx == activeSuggestionIdx ? chalk.bgHex(getConfig().activeSuggestionBackgroundColor)(truncatedSuggestion) : truncatedSuggestion; }), suggestionWidth, ); diff --git a/src/utils/config.ts b/src/utils/config.ts index 7993b5f..755403d 100644 --- a/src/utils/config.ts +++ b/src/utils/config.ts @@ -32,6 +32,7 @@ type Config = { useAliases: boolean; useNerdFont: boolean; maxSuggestions?: number; + activeSuggestionBackgroundColor: string; }; const bindingSchema: JSONSchemaType = { @@ -87,6 +88,12 @@ const configSchema = { nullable: true, default: 5, }, + activeSuggestionBackgroundColor: { + type: "string", + nullable: true, + pattern: "^#[0-9A-Fa-f]{6}$", + default: "#7D56F4", + }, }, additionalProperties: false, }; @@ -110,6 +117,7 @@ let globalConfig: Config = { }, useAliases: false, useNerdFont: false, + activeSuggestionBackgroundColor: "#7D56F4", }; export const getConfig = (): Config => globalConfig; @@ -140,6 +148,7 @@ export const loadConfig = async (program: Command) => { useAliases: config.useAliases ?? false, useNerdFont: config?.useNerdFont ?? false, maxSuggestions: config?.maxSuggestions ?? 5, + activeSuggestionBackgroundColor: config?.activeSuggestionBackgroundColor ?? "#7D56F4", }; } }