claude-code/components/OutputStylePicker.tsx

112 lines
13 KiB
TypeScript
Raw Permalink Normal View History

import { c as _c } from "react/compiler-runtime";
import * as React from 'react';
import { useCallback, useEffect, useState } from 'react';
import { getAllOutputStyles, OUTPUT_STYLE_CONFIG, type OutputStyleConfig } from '../constants/outputStyles.js';
import { Box, Text } from '../ink.js';
import type { OutputStyle } from '../utils/config.js';
import { getCwd } from '../utils/cwd.js';
import type { OptionWithDescription } from './CustomSelect/select.js';
import { Select } from './CustomSelect/select.js';
import { Dialog } from './design-system/Dialog.js';
const DEFAULT_OUTPUT_STYLE_LABEL = 'Default';
const DEFAULT_OUTPUT_STYLE_DESCRIPTION = 'Claude completes coding tasks efficiently and provides concise responses';
function mapConfigsToOptions(styles: {
[styleName: string]: OutputStyleConfig | null;
}): OptionWithDescription[] {
return Object.entries(styles).map(([style, config]) => ({
label: config?.name ?? DEFAULT_OUTPUT_STYLE_LABEL,
value: style,
description: config?.description ?? DEFAULT_OUTPUT_STYLE_DESCRIPTION
}));
}
export type OutputStylePickerProps = {
initialStyle: OutputStyle;
onComplete: (style: OutputStyle) => void;
onCancel: () => void;
isStandaloneCommand?: boolean;
};
export function OutputStylePicker(t0) {
const $ = _c(16);
const {
initialStyle,
onComplete,
onCancel,
isStandaloneCommand
} = t0;
let t1;
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
t1 = [];
$[0] = t1;
} else {
t1 = $[0];
}
const [styleOptions, setStyleOptions] = useState(t1);
const [isLoading, setIsLoading] = useState(true);
let t2;
let t3;
if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
t2 = () => {
getAllOutputStyles(getCwd()).then(allStyles => {
const options = mapConfigsToOptions(allStyles);
setStyleOptions(options);
setIsLoading(false);
}).catch(() => {
const builtInOptions = mapConfigsToOptions(OUTPUT_STYLE_CONFIG);
setStyleOptions(builtInOptions);
setIsLoading(false);
});
};
t3 = [];
$[1] = t2;
$[2] = t3;
} else {
t2 = $[1];
t3 = $[2];
}
useEffect(t2, t3);
let t4;
if ($[3] !== onComplete) {
t4 = style => {
const outputStyle = style as OutputStyle;
onComplete(outputStyle);
};
$[3] = onComplete;
$[4] = t4;
} else {
t4 = $[4];
}
const handleStyleSelect = t4;
const t5 = !isStandaloneCommand;
const t6 = !isStandaloneCommand;
let t7;
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
t7 = <Box marginTop={1}><Text dimColor={true}>This changes how Claude Code communicates with you</Text></Box>;
$[5] = t7;
} else {
t7 = $[5];
}
let t8;
if ($[6] !== handleStyleSelect || $[7] !== initialStyle || $[8] !== isLoading || $[9] !== styleOptions) {
t8 = <Box flexDirection="column" gap={1}>{t7}{isLoading ? <Text dimColor={true}>Loading output styles</Text> : <Select options={styleOptions} onChange={handleStyleSelect} visibleOptionCount={10} defaultValue={initialStyle} />}</Box>;
$[6] = handleStyleSelect;
$[7] = initialStyle;
$[8] = isLoading;
$[9] = styleOptions;
$[10] = t8;
} else {
t8 = $[10];
}
let t9;
if ($[11] !== onCancel || $[12] !== t5 || $[13] !== t6 || $[14] !== t8) {
t9 = <Dialog title="Preferred output style" onCancel={onCancel} hideInputGuide={t5} hideBorder={t6}>{t8}</Dialog>;
$[11] = onCancel;
$[12] = t5;
$[13] = t6;
$[14] = t8;
$[15] = t9;
} else {
t9 = $[15];
}
return t9;
}
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJSZWFjdCIsInVzZUNhbGxiYWNrIiwidXNlRWZmZWN0IiwidXNlU3RhdGUiLCJnZXRBbGxPdXRwdXRTdHlsZXMiLCJPVVRQVVRfU1RZTEVfQ09ORklHIiwiT3V0cHV0U3R5bGVDb25maWciLCJCb3giLCJUZXh0IiwiT3V0cHV0U3R5bGUiLCJnZXRDd2QiLCJPcHRpb25XaXRoRGVzY3JpcHRpb24iLCJTZWxlY3QiLCJEaWFsb2ciLCJERUZBVUxUX09VVFBVVF9TVFlMRV9MQUJFTCIsIkRFRkFVTFRfT1VUUFVUX1NUWUxFX0RFU0NSSVBUSU9OIiwibWFwQ29uZmlnc1RvT3B0aW9ucyIsInN0eWxlcyIsInN0eWxlTmFtZSIsIk9iamVjdCIsImVudHJpZXMiLCJtYXAiLCJzdHlsZSIsImNvbmZpZyIsImxhYmVsIiwibmFtZSIsInZhbHVlIiwiZGVzY3JpcHRpb24iLCJPdXRwdXRTdHlsZVBpY2tlclByb3BzIiwiaW5pdGlhbFN0eWxlIiwib25Db21wbGV0ZSIsIm9uQ2FuY2VsIiwiaXNTdGFuZGFsb25lQ29tbWFuZCIsIk91dHB1dFN0eWxlUGlja2VyIiwidDAiLCIkIiwiX2MiLCJ0MSIsIlN5bWJvbCIsImZvciIsInN0eWxlT3B0aW9ucyIsInNldFN0eWxlT3B0aW9ucyIsImlzTG9hZGluZyIsInNldElzTG9hZGluZyIsInQyIiwidDMiLCJ0aGVuIiwiYWxsU3R5bGVzIiwib3B0aW9ucyIsImNhdGNoIiwiYnVpbHRJbk9wdGlvbnMiLCJ0NCIsIm91dHB1dFN0eWxlIiwiaGFuZGxlU3R5bGVTZWxlY3QiLCJ0NSIsInQ2IiwidDciLCJ0OCIsInQ5Il0sInNvdXJjZXMiOlsiT3V0cHV0U3R5bGVQaWNrZXIudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlQ2FsbGJhY2ssIHVzZUVmZmVjdCwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7XG4gIGdldEFsbE91dHB1dFN0eWxlcyxcbiAgT1VUUFVUX1NUWUxFX0NPTkZJRyxcbiAgdHlwZSBPdXRwdXRTdHlsZUNvbmZpZyxcbn0gZnJvbSAnLi4vY29uc3RhbnRzL291dHB1dFN0eWxlcy5qcydcbmltcG9ydCB7IEJveCwgVGV4dCB9IGZyb20gJy4uL2luay5qcydcbmltcG9ydCB0eXBlIHsgT3V0cHV0U3R5bGUgfSBmcm9tICcuLi91dGlscy9jb25maWcuanMnXG5pbXBvcnQgeyBnZXRDd2QgfSBmcm9tICcuLi91dGlscy9jd2QuanMnXG5pbXBvcnQgdHlwZSB7IE9wdGlvbldpdGhEZXNjcmlwdGlvbiB9IGZyb20gJy4vQ3VzdG9tU2VsZWN0L3NlbGVjdC5qcydcbmltcG9ydCB7IFNlbGVjdCB9IGZyb20gJy4vQ3VzdG9tU2VsZWN0L3NlbGVjdC5qcydcbmltcG9ydCB7IERpYWxvZyB9IGZyb20gJy4vZGVzaWduLXN5c3RlbS9EaWFsb2cuanMnXG5cbmNvbnN0IERFRkFVTFRfT1VUUFVUX1NUWUxFX0xBQkVMID0gJ0RlZmF1bHQnXG5jb25zdCBERUZBVUxUX09VVFBVVF9TVFlMRV9ERVNDUklQVElPTiA9XG4gICdDbGF1ZGUgY29tcGxldGVzIGNvZGluZyB0YXNrcyBlZmZpY2llbnRseSBhbmQgcHJvdmlkZXMgY29uY2lzZSByZXNwb25zZXMnXG5cbmZ1bmN0aW9uIG1hcENvbmZpZ3NUb09wdGlvbnMoc3R5bGVzOiB7XG4gIFtzdHlsZU5hbWU6IHN0cmluZ106IE91dHB1dFN0eWxlQ29uZmlnIHwgbnVsbFxufSk6IE9wdGlvbldpdGhEZXNjcmlwdGlvbltdIHtcbiAgcmV0dXJuIE9iamVjdC5lbnRyaWVzKHN0eWxlcykubWFwKChbc3R5bGUsIGNvbmZpZ10pID0+ICh7XG4gICAgbGFiZWw6IGNvbmZpZz8ubmFtZSA/PyBERUZBVUxUX09VVFBVVF9TVFlMRV9MQUJFTCxcbiAgICB2YWx1ZTogc3R5bGUsXG4gICAgZGVzY3JpcHRpb246IGNvbmZpZz8uZGVzY3JpcHRpb24gPz8gREVGQVVMVF9PVVRQVVRfU1RZTEVfREVTQ1JJUFRJT04sXG4gIH0pKVxufVxuXG5leHBvcnQgdHlwZSBPdXRwdXRTdHlsZVBpY2tlclByb3BzID0ge1xuICBpbml0aWFsU3R5bGU6IE91dHB1dFN0eWxlXG4gIG9uQ29tcGxldGU6IChzdHlsZTogT3V0cHV0U3R5bGUpID0+IHZvaWRcbiAgb25DYW5jZWw6ICgpID0+IHZvaWRcbiAgaXNTdGFuZGFsb25lQ29tbWFuZD86IGJvb2xlYW5cbn1cblxuZXhwb3J0IGZ1bmN0aW9uIE91dHB1dFN0eWxlUGlja2VyKHtcbiAgaW5pdGlhbFN0eWxlLFxuICBvbkNvbXBsZXRlLFxuICBvbkNhbmNlbCxcbiAgaXNTdGFuZGFsb25lQ29tbWFuZCxcbn06IE91dHB1dFN0eWxlUGlja2VyUHJvcHMpOiBSZWFjdC5SZWFjdE5vZGUge1xuICBjb25zdCBbc3R5bGVPcHRpb25zLCBzZXRTdHlsZU9wdGlvbnNdID0gdXNlU3RhdGU8T3B0aW9uV2l0aERlc2NyaXB0aW9uW10+KFtdKVxuICBjb25zdCBbaXNMb2FkaW5nLCBzZXRJc0xvYWRpbmddID0gdXNlU3RhdGUodHJ1ZSlcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIC8vIExvYWQgYWxsIG91dHB1dCBzdHlsZXMgaW5jbHVkaW5nIGN1c3RvbSBvbmVzXG4gICAgZ2V0QWxsT3V0cHV0U3R5bGVzKGdldEN3ZCgpKVxuICAgICAgLnRoZW4oYWxsU3R5bGVzID0+IHtcbiAgICAgICAgY29uc3Qgb3B0aW9ucyA9IG1hcENvbmZpZ3NUb09wdGlvbnMoYWxsU3R5bGVzKVxuICAgICAgICBzZXRTdHlsZU9wdGlvbnMob3B0aW9ucylcbiAgICAgICAgc2V0SXNMb2FkaW5nKGZhbHNlKVxuICAgICAgfSlcbiAgICAgIC5jYXRjaCgoKSA9PiB7XG4gICAgICAgIC8vIE9uIGVycm9yLCBmYWxsIGJhY2sgdG8gYnVpbHQtaW4gc3R5bGVzIG9ubHlcbiAgICAgICAgY29uc3QgYnVpbHRJbk9wdGlvbnMgPSBtYXBDb25maWdzVG9PcHRpb25zKE9VVFBVVF9TVFlMRV9DT05GSUcpXG4gICAgICAgIHNldFN0eWxlT3B0aW9ucyhidWlsdEluT3B0aW9ucylcbiAgICAgICAgc2V0SXNMb2FkaW5nKGZhbHNlKVxuICAgICAgfSlcbiAgfSwgW10pXG5cbiAgY29uc3QgaGFuZGxlU3R5bGVTZWxlY3QgPSB1c2VDYWxsYmFjayhcbiAgICAoc3R5bGU6IHN0cmluZykgPT4ge1xuICAgICAgY29uc3Qgb3V0cHV0U3R5bGUgPSBzdHlsZSBhcyBPdXRwdXRTdHlsZVxuICAgICAgb25Db21wbGV0ZShvdXRwdXRTdHlsZSlcbiAgICB9LFxuICAgIFtvbkNvbXBsZXRlXSxcbiAgKVxuXG4gIHJldHVybiAoXG4gICAgPERpYWxvZ1xuICAgICAgdGl0bGU9XCJQcmVmZXJyZWQgb3V0cHV0IHN