Merge pull request #2102 from alipgoldberg/setup-color-choices
feat(setup): cyan highlight on active and submitted choices
This commit is contained in:
@@ -374,7 +374,7 @@ async function main(): Promise<void> {
|
|||||||
if (ping === 'ok') {
|
if (ping === 'ok') {
|
||||||
phEmit('first_chat_ready');
|
phEmit('first_chat_ready');
|
||||||
const next = ensureAnswer(
|
const next = ensureAnswer(
|
||||||
await p.select({
|
await brightSelect<'continue' | 'chat'>({
|
||||||
message: 'What next?',
|
message: 'What next?',
|
||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -18,6 +18,8 @@ import { SelectPrompt } from '@clack/core';
|
|||||||
import { isCancel } from '@clack/prompts';
|
import { isCancel } from '@clack/prompts';
|
||||||
import { styleText } from 'node:util';
|
import { styleText } from 'node:util';
|
||||||
|
|
||||||
|
import { brandBody } from './theme.js';
|
||||||
|
|
||||||
const BULLET_ACTIVE = '●';
|
const BULLET_ACTIVE = '●';
|
||||||
const BULLET_INACTIVE = '○';
|
const BULLET_INACTIVE = '○';
|
||||||
const BAR = '│';
|
const BAR = '│';
|
||||||
@@ -95,7 +97,7 @@ export function brightSelect<T>(
|
|||||||
const shown =
|
const shown =
|
||||||
st === 'cancel'
|
st === 'cancel'
|
||||||
? styleText(['strikethrough', 'dim'], selected)
|
? styleText(['strikethrough', 'dim'], selected)
|
||||||
: styleText('dim', selected);
|
: styleText('dim', brandBody(selected));
|
||||||
lines.push(`${grayBar} ${shown}`);
|
lines.push(`${grayBar} ${shown}`);
|
||||||
return lines.join('\n');
|
return lines.join('\n');
|
||||||
}
|
}
|
||||||
@@ -104,11 +106,12 @@ export function brightSelect<T>(
|
|||||||
options.forEach((opt, idx) => {
|
options.forEach((opt, idx) => {
|
||||||
const label = opt.label ?? String(opt.value);
|
const label = opt.label ?? String(opt.value);
|
||||||
const hint = opt.hint ? ` ${styleText('dim', `(${opt.hint})`)}` : '';
|
const hint = opt.hint ? ` ${styleText('dim', `(${opt.hint})`)}` : '';
|
||||||
const marker =
|
const isActive = idx === cursor;
|
||||||
idx === cursor
|
const marker = isActive
|
||||||
? styleText('green', BULLET_ACTIVE)
|
? styleText('green', BULLET_ACTIVE)
|
||||||
: styleText('dim', BULLET_INACTIVE);
|
: styleText('dim', BULLET_INACTIVE);
|
||||||
lines.push(`${bar} ${marker} ${label}${hint}`);
|
const shownLabel = isActive ? brandBody(label) : label;
|
||||||
|
lines.push(`${bar} ${marker} ${shownLabel}${hint}`);
|
||||||
});
|
});
|
||||||
lines.push(styleText(color, CAP_BOT));
|
lines.push(styleText(color, CAP_BOT));
|
||||||
return lines.join('\n');
|
return lines.join('\n');
|
||||||
|
|||||||
Reference in New Issue
Block a user