import { c as _c } from "react/compiler-runtime"; import { feature } from 'bun:bundle'; import * as React from 'react'; import { useExitOnCtrlCDWithKeybindings } from '../hooks/useExitOnCtrlCDWithKeybindings.js'; import { useTerminalSize } from '../hooks/useTerminalSize.js'; import { Box, Text, usePreviewTheme, useTheme, useThemeSetting } from '../ink.js'; import { useRegisterKeybindingContext } from '../keybindings/KeybindingContext.js'; import { useKeybinding } from '../keybindings/useKeybinding.js'; import { useShortcutDisplay } from '../keybindings/useShortcutDisplay.js'; import { useAppState, useSetAppState } from '../state/AppState.js'; import { gracefulShutdown } from '../utils/gracefulShutdown.js'; import { updateSettingsForSource } from '../utils/settings/settings.js'; import type { ThemeSetting } from '../utils/theme.js'; import { Select } from './CustomSelect/index.js'; import { Byline } from './design-system/Byline.js'; import { KeyboardShortcutHint } from './design-system/KeyboardShortcutHint.js'; import { getColorModuleUnavailableReason, getSyntaxTheme } from './StructuredDiff/colorDiff.js'; import { StructuredDiff } from './StructuredDiff.js'; export type ThemePickerProps = { onThemeSelect: (setting: ThemeSetting) => void; showIntroText?: boolean; helpText?: string; showHelpTextBelow?: boolean; hideEscToCancel?: boolean; /** Skip exit handling when running in a context that already has it (e.g., onboarding) */ skipExitHandling?: boolean; /** Called when the user cancels (presses Escape). If skipExitHandling is true and this is provided, it will be called instead of just saving the preview. */ onCancel?: () => void; }; export function ThemePicker(t0) { const $ = _c(59); const { onThemeSelect, showIntroText: t1, helpText: t2, showHelpTextBelow: t3, hideEscToCancel: t4, skipExitHandling: t5, onCancel: onCancelProp } = t0; const showIntroText = t1 === undefined ? false : t1; const helpText = t2 === undefined ? "" : t2; const showHelpTextBelow = t3 === undefined ? false : t3; const hideEscToCancel = t4 === undefined ? false : t4; const skipExitHandling = t5 === undefined ? false : t5; const [theme] = useTheme(); const themeSetting = useThemeSetting(); const { columns } = useTerminalSize(); let t6; if ($[0] === Symbol.for("react.memo_cache_sentinel")) { t6 = getColorModuleUnavailableReason(); $[0] = t6; } else { t6 = $[0]; } const colorModuleUnavailableReason = t6; let t7; if ($[1] !== theme) { t7 = colorModuleUnavailableReason === null ? getSyntaxTheme(theme) : null; $[1] = theme; $[2] = t7; } else { t7 = $[2]; } const syntaxTheme = t7; const { setPreviewTheme, savePreview, cancelPreview } = usePreviewTheme(); const syntaxHighlightingDisabled = useAppState(_temp) ?? false; const setAppState = useSetAppState(); useRegisterKeybindingContext("ThemePicker"); const syntaxToggleShortcut = useShortcutDisplay("theme:toggleSyntaxHighlighting", "ThemePicker", "ctrl+t"); let t8; if ($[3] !== setAppState || $[4] !== syntaxHighlightingDisabled) { t8 = () => { if (colorModuleUnavailableReason === null) { const newValue = !syntaxHighlightingDisabled; updateSettingsForSource("userSettings", { syntaxHighlightingDisabled: newValue }); setAppState(prev => ({ ...prev, settings: { ...prev.settings, syntaxHighlightingDisabled: newValue } })); } }; $[3] = setAppState; $[4] = syntaxHighlightingDisabled; $[5] = t8; } else { t8 = $[5]; } let t9; if ($[6] === Symbol.for("react.memo_cache_sentinel")) { t9 = { context: "ThemePicker" }; $[6] = t9; } else { t9 = $[6]; } useKeybinding("theme:toggleSyntaxHighlighting", t8, t9); const exitState = useExitOnCtrlCDWithKeybindings(skipExitHandling ? _temp2 : undefined); let t10; if ($[7] === Symbol.for("react.memo_cache_sentinel")) { t10 = [...(feature("AUTO_THEME") ? [{ label: "Auto (match terminal)", value: "auto" as const }] : []), { label: "Dark mode", value: "dark" }, { label: "Light mode", value: "light" }, { label: "Dark mode (colorblind-friendly)", value: "dark-daltonized" }, { label: "Light mode (colorblind-friendly)", value: "light-daltonized" }, { label: "Dark mode (ANSI colors only)", value: "dark-ansi" }, { label: "Light mode (ANSI colors only)", value: "light-ansi" }]; $[7] = t10; } else { t10 = $[7]; } const themeOptions = t10; let t11; if ($[8] !== showIntroText) { t11 = showIntroText ? Let's get started. : Theme; $[8] = showIntroText; $[9] = t11; } else { t11 = $[9]; } let t12; if ($[10] === Symbol.for("react.memo_cache_sentinel")) { t12 = Choose the text style that looks best with your terminal; $[10] = t12; } else { t12 = $[10]; } let t13; if ($[11] !== helpText || $[12] !== showHelpTextBelow) { t13 = helpText && !showHelpTextBelow && {helpText}; $[11] = helpText; $[12] = showHelpTextBelow; $[13] = t13; } else { t13 = $[13]; } let t14; if ($[14] !== t13) { t14 = {t12}{t13}; $[14] = t13; $[15] = t14; } else { t14 = $[15]; } let t15; if ($[16] !== setPreviewTheme) { t15 = setting => { setPreviewTheme(setting as ThemeSetting); }; $[16] = setPreviewTheme; $[17] = t15; } else { t15 = $[17]; } let t16; if ($[18] !== onThemeSelect || $[19] !== savePreview) { t16 = setting_0 => { savePreview(); onThemeSelect(setting_0 as ThemeSetting); }; $[18] = onThemeSelect; $[19] = savePreview; $[20] = t16; } else { t16 = $[20]; } let t17; if ($[21] !== cancelPreview || $[22] !== onCancelProp || $[23] !== skipExitHandling) { t17 = skipExitHandling ? () => { cancelPreview(); onCancelProp?.(); } : async () => { cancelPreview(); await gracefulShutdown(0); }; $[21] = cancelPreview; $[22] = onCancelProp; $[23] = skipExitHandling; $[24] = t17; } else { t17 = $[24]; } let t18; if ($[25] !== t15 || $[26] !== t16 || $[27] !== t17 || $[28] !== themeSetting) { t18 =