claude-code/components/design-system/Dialog.tsx

138 lines
14 KiB
TypeScript
Raw Normal View History

import { c as _c } from "react/compiler-runtime";
import React from 'react';
import { type ExitState, useExitOnCtrlCDWithKeybindings } from '../../hooks/useExitOnCtrlCDWithKeybindings.js';
import { Box, Text } from '../../ink.js';
import { useKeybinding } from '../../keybindings/useKeybinding.js';
import type { Theme } from '../../utils/theme.js';
import { ConfigurableShortcutHint } from '../ConfigurableShortcutHint.js';
import { Byline } from './Byline.js';
import { KeyboardShortcutHint } from './KeyboardShortcutHint.js';
import { Pane } from './Pane.js';
type DialogProps = {
title: React.ReactNode;
subtitle?: React.ReactNode;
children: React.ReactNode;
onCancel: () => void;
color?: keyof Theme;
hideInputGuide?: boolean;
hideBorder?: boolean;
/** Custom input guide content. Receives exitState for Ctrl+C/D pending display. */
inputGuide?: (exitState: ExitState) => React.ReactNode;
/**
* Controls whether Dialog's built-in confirm:no (Esc/n) and app:exit/interrupt
* (Ctrl-C/D) keybindings are active. Set to `false` while an embedded text
* field is being edited so those keys reach the field instead of being
* consumed by Dialog. TextInput has its own ctrl+c/d handlers (cancel on
* press, delete-forward on ctrl+d with text). Defaults to `true`.
*/
isCancelActive?: boolean;
};
export function Dialog(t0) {
const $ = _c(27);
const {
title,
subtitle,
children,
onCancel,
color: t1,
hideInputGuide,
hideBorder,
inputGuide,
isCancelActive: t2
} = t0;
const color = t1 === undefined ? "permission" : t1;
const isCancelActive = t2 === undefined ? true : t2;
const exitState = useExitOnCtrlCDWithKeybindings(undefined, undefined, isCancelActive);
let t3;
if ($[0] !== isCancelActive) {
t3 = {
context: "Confirmation",
isActive: isCancelActive
};
$[0] = isCancelActive;
$[1] = t3;
} else {
t3 = $[1];
}
useKeybinding("confirm:no", onCancel, t3);
let t4;
if ($[2] !== exitState.keyName || $[3] !== exitState.pending) {
t4 = exitState.pending ? <Text>Press {exitState.keyName} again to exit</Text> : <Byline><KeyboardShortcutHint shortcut="Enter" action="confirm" /><ConfigurableShortcutHint action="confirm:no" context="Confirmation" fallback="Esc" description="cancel" /></Byline>;
$[2] = exitState.keyName;
$[3] = exitState.pending;
$[4] = t4;
} else {
t4 = $[4];
}
const defaultInputGuide = t4;
let t5;
if ($[5] !== color || $[6] !== title) {
t5 = <Text bold={true} color={color}>{title}</Text>;
$[5] = color;
$[6] = title;
$[7] = t5;
} else {
t5 = $[7];
}
let t6;
if ($[8] !== subtitle) {
t6 = subtitle && <Text dimColor={true}>{subtitle}</Text>;
$[8] = subtitle;
$[9] = t6;
} else {
t6 = $[9];
}
let t7;
if ($[10] !== t5 || $[11] !== t6) {
t7 = <Box flexDirection="column">{t5}{t6}</Box>;
$[10] = t5;
$[11] = t6;
$[12] = t7;
} else {
t7 = $[12];
}
let t8;
if ($[13] !== children || $[14] !== t7) {
t8 = <Box flexDirection="column" gap={1}>{t7}{children}</Box>;
$[13] = children;
$[14] = t7;
$[15] = t8;
} else {
t8 = $[15];
}
let t9;
if ($[16] !== defaultInputGuide || $[17] !== exitState || $[18] !== hideInputGuide || $[19] !== inputGuide) {
t9 = !hideInputGuide && <Box marginTop={1}><Text dimColor={true} italic={true}>{inputGuide ? inputGuide(exitState) : defaultInputGuide}</Text></Box>;
$[16] = defaultInputGuide;
$[17] = exitState;
$[18] = hideInputGuide;
$[19] = inputGuide;
$[20] = t9;
} else {
t9 = $[20];
}
let t10;
if ($[21] !== t8 || $[22] !== t9) {
t10 = <>{t8}{t9}</>;
$[21] = t8;
$[22] = t9;
$[23] = t10;
} else {
t10 = $[23];
}
const content = t10;
if (hideBorder) {
return content;
}
let t11;
if ($[24] !== color || $[25] !== content) {
t11 = <Pane color={color}>{content}</Pane>;
$[24] = color;
$[25] = content;
$[26] = t11;
} else {
t11 = $[26];
}
return t11;
}
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJSZWFjdCIsIkV4aXRTdGF0ZSIsInVzZUV4aXRPbkN0cmxDRFdpdGhLZXliaW5kaW5ncyIsIkJveCIsIlRleHQiLCJ1c2VLZXliaW5kaW5nIiwiVGhlbWUiLCJDb25maWd1cmFibGVTaG9ydGN1dEhpbnQiLCJCeWxpbmUiLCJLZXlib2FyZFNob3J0Y3V0SGludCIsIlBhbmUiLCJEaWFsb2dQcm9wcyIsInRpdGxlIiwiUmVhY3ROb2RlIiwic3VidGl0bGUiLCJjaGlsZHJlbiIsIm9uQ2FuY2VsIiwiY29sb3IiLCJoaWRlSW5wdXRHdWlkZSIsImhpZGVCb3JkZXIiLCJpbnB1dEd1aWRlIiwiZXhpdFN0YXRlIiwiaXNDYW5jZWxBY3RpdmUiLCJEaWFsb2ciLCJ0MCIsIiQiLCJfYyIsInQxIiwidDIiLCJ1bmRlZmluZWQiLCJ0MyIsImNvbnRleHQiLCJpc0FjdGl2ZSIsInQ0Iiwia2V5TmFtZSIsInBlbmRpbmciLCJkZWZhdWx0SW5wdXRHdWlkZSIsInQ1IiwidDYiLCJ0NyIsInQ4IiwidDkiLCJ0MTAiLCJjb250ZW50IiwidDExIl0sInNvdXJjZXMiOlsiRGlhbG9nLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5pbXBvcnQge1xuICB0eXBlIEV4aXRTdGF0ZSxcbiAgdXNlRXhpdE9uQ3RybENEV2l0aEtleWJpbmRpbmdzLFxufSBmcm9tICcuLi8uLi9ob29rcy91c2VFeGl0T25DdHJsQ0RXaXRoS2V5YmluZGluZ3MuanMnXG5pbXBvcnQgeyBCb3gsIFRleHQgfSBmcm9tICcuLi8uLi9pbmsuanMnXG5pbXBvcnQgeyB1c2VLZXliaW5kaW5nIH0gZnJvbSAnLi4vLi4va2V5YmluZGluZ3MvdXNlS2V5YmluZGluZy5qcydcbmltcG9ydCB0eXBlIHsgVGhlbWUgfSBmcm9tICcuLi8uLi91dGlscy90aGVtZS5qcydcbmltcG9ydCB7IENvbmZpZ3VyYWJsZVNob3J0Y3V0SGludCB9IGZyb20gJy4uL0NvbmZpZ3VyYWJsZVNob3J0Y3V0SGludC5qcydcbmltcG9ydCB7IEJ5bGluZSB9IGZyb20gJy4vQnlsaW5lLmpzJ1xuaW1wb3J0IHsgS2V5Ym9hcmRTaG9ydGN1dEhpbnQgfSBmcm9tICcuL0tleWJvYXJkU2hvcnRjdXRIaW50LmpzJ1xuaW1wb3J0IHsgUGFuZSB9IGZyb20gJy4vUGFuZS5qcydcblxudHlwZSBEaWFsb2dQcm9wcyA9IHtcbiAgdGl0bGU6IFJlYWN0LlJlYWN0Tm9kZVxuICBzdWJ0aXRsZT86IFJlYWN0LlJlYWN0Tm9kZVxuICBjaGlsZHJlbjogUmVhY3QuUmVhY3ROb2RlXG4gIG9uQ2FuY2VsOiAoKSA9PiB2b2lkXG4gIGNvbG9yPzoga2V5b2YgVGhlbWVcbiAgaGlkZUlucHV0R3VpZGU/OiBib29sZWFuXG4gIGhpZGVCb3JkZXI/OiBib29sZWFuXG4gIC8qKiBDdXN0b20gaW5wdXQgZ3VpZGUgY29udGVudC4gUmVjZWl2ZXMgZXhpdFN0YXRlIGZvciBDdHJsK0MvRCBwZW5kaW5nIGRpc3BsYXkuICovXG4gIGlucHV0R3VpZGU/OiAoZXhpdFN0YXRlOiBFeGl0U3RhdGUpID0+IFJlYWN0LlJlYWN0Tm9kZVxuICAvKipcbiAgICogQ29udHJvbHMgd2hldGhlciBEaWFsb2cncyBidWlsdC1pbiBjb25maXJtOm5vIChFc2MvbikgYW5kIGFwcDpleGl0L2ludGVycnVwdFxuICAgKiAoQ3RybC1DL0QpIGtleWJpbmRpbmdzIGFyZSBhY3RpdmUuIFNldCB0byBgZmFsc2VgIHdoaWxlIGFuIGVtYmVkZGVkIHRleHRcbiAgICogZmllbGQgaXMgYmVpbmcgZWRpdGVkIHNvIHRob3NlIGtleXMgcmVhY2ggdGhlIGZpZWxkIGluc3RlYWQgb2YgYmVpbmdcbiAgICogY29uc3VtZWQgYnkgRGlhbG9nLiBUZXh0SW5wdXQgaGFzIGl0cyBvd24gY3RybCtjL2QgaGFuZGxlcnMgKGNhbmNlbCBvblxuICAgKiBwcmVzcywgZGVsZXRlLWZvcndhcmQgb24gY3RybCtkIHdpdGggdGV4dCkuIERlZmF1bHRzIHRvIGB0cnVlYC5cbiAgICovXG4gIGlzQ2FuY2VsQWN0aXZlPzogYm9vbGVhblxufVxuXG5leHBvcnQgZnVuY3Rpb24gRGlhbG9nKHtcbiAgdGl0bGUsXG4gIHN1YnRpdGxlLFxuICBjaGlsZHJlbixcbiAgb25DYW5jZWwsXG4gIGNvbG9yID0gJ3Blcm1pc3Npb24nLFxuICBoaWRlSW5wdXRHdWlkZSxcbiAgaGlkZUJvcmRlcixcbiAgaW5wdXRHdWlkZSxcbiAgaXNDYW5jZWxBY3RpdmUgPSB0cnVlLFxufTogRGlhbG9nUHJvcHMpOiBSZWFjdC5SZWFjdE5vZGUge1xuICBjb25zdCBleGl0U3RhdGUgPSB1c2VFeGl0T25DdHJsQ0RXaXRoS2V5YmluZGluZ3MoXG4gICAgdW5kZWZpbmVkLFxuICAgIHVuZGVmaW5lZCxcbiAgICBpc0NhbmNlbEFjdGl2ZSxcbiAgKVxuXG4gIC8vIFVzZSBjb25maWd1cmFibGUga2V5YmluZGluZyBmb3IgRVNDIHRvIGNhbmNlbC5cbiAgLy8gaXNDYW5jZWxBY3RpdmUgbGV0cyBjb25zdW1lcnMgKGUuZy4gRWxpY2l0YXRpb25EaWFsb2cpIGRpc2FibGUgdGhpcyB3aGlsZVxuICAvLyBhbiBlbWJlZGRlZCBUZXh0SW5wdXQgaXMgZm9jdXNlZCwgc28gdGhhdCBrZXlzIGxpa2UgJ24nIHJlYWNoIHRoZSBmaWVsZFxuICAvLyBpbnN0ZWFkIG9mIGJlaW5nIGNvbnN1bWVkIGhlcmUuXG4gIHVzZUtleWJpbmRpbmcoJ2NvbmZpcm06bm8nLCBvbkNhbmNlbCwge1xuICAgIGNvbnRleHQ6ICdDb25maXJtYXRpb24nLFxuICAgIGlzQWN0aXZlOiBpc0NhbmNlbEFjdGl2ZSxcbiAgfSlcblxuICBjb25zdCBkZWZhdWx0SW5wdXRHdWlkZSA9IGV4aXRTdGF0ZS5wZW5kaW5nID8gKFxuICAgIDxUZXh0PlByZXNzIHtleGl0U3RhdGUua2V5TmFtZX0gYWdhaW4gdG8gZXhpdDwvVGV4dD5cbiAgKSA6IChcbiAgICA8QnlsaW5lPlxuICAgICAgPEtleWJvYXJkU2hvcnRjdXRIaW50IHNob3J0Y3V0PVwiRW50ZXJcIiBhY3Rpb249XCJjb25maXJtXCIgLz5cbiAgICAgIDxDb25maWd1cmFibGVTaG9ydGN1dEhpbnRcbiAgICAgICAgYWN0aW9uPVwiY29uZmlybTpub1wiXG4gICAgICAgIGNvbnRleHQ9XCJDb25maXJtYXRpb25cIlxuICAgICAgICBmYWxsYmFjaz1cIkVzY1wiXG4gICAgICAgIGRlc2NyaXB0aW9uPVwiY2FuY2VsXCJcbiAgICAgIC8+XG4gICAgPC9CeWxpbmU+XG4gIClcblxuICBjb25zdCBjb250ZW50ID0gKFxuICAgIDw+XG4gICAgICA8Qm94IGZsZXhEaXJlY3Rpb249XCJjb2x1bW5cIiBnYXA9ezF9PlxuICAgICAgICA8Qm94IGZsZXhEaXJlY3Rpb249XCJjb2x1bW5