@within-7/minto 0.1.6 → 0.2.0

package/dist/components/ModelListManager.js

@@ -6,7 +6,7 @@ import { getTheme } from "../utils/theme.js";
 import { getGlobalConfig } from "../utils/config.js";
 import { getModelManager } from "../utils/model.js";
 import { useExitOnCtrlCD } from "../hooks/useExitOnCtrlCD.js";
-import { ModelSelector } from "./ModelSelector.js";
+import { ModelSelector } from "./ModelSelector/index.js";
 function ModelListManager({ onClose }) {
   const config = getGlobalConfig();
   const theme = getTheme();
@@ -14,7 +14,7 @@ function ModelListManager({ onClose }) {
   const [showModelSelector, setShowModelSelector] = useState(false);
   const [isDeleteMode, setIsDeleteMode] = useState(false);
   const [refreshKey, setRefreshKey] = useState(0);
-  const exitState = useExitOnCtrlCD(onClose);
+  const exitState = useExitOnCtrlCD(onClose, { isActive: !showModelSelector });
   const modelManager = getModelManager();
   const availableModels = modelManager.getAvailableModels();
   const menuItems = React.useMemo(() => {
@@ -87,7 +87,7 @@ function ModelListManager({ onClose }) {
     },
     [selectedIndex, menuItems, onClose, isDeleteMode, availableModels.length]
   );
-  useInput(handleInput);
+  useInput(handleInput, { isActive: !showModelSelector });
   if (showModelSelector) {
     return /* @__PURE__ */ React.createElement(
       ModelSelector,

package/dist/components/ModelListManager.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/ModelListManager.tsx"],
-  "sourcesContent": ["import { Box, Text, useInput } from 'ink'\nimport * as React from 'react'\nimport { useState, useCallback } from 'react'\nimport figures from 'figures'\nimport { getTheme } from '@utils/theme'\nimport { getGlobalConfig, ModelPointerType } from '@utils/config'\nimport { getModelManager } from '@utils/model'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { ModelSelector } from './ModelSelector'\n\ntype Props = {\n  onClose: () => void\n}\n\nexport function ModelListManager({ onClose }: Props): React.ReactNode {\n  const config = getGlobalConfig()\n  const theme = getTheme()\n  const [selectedIndex, setSelectedIndex] = useState(0)\n  const [showModelSelector, setShowModelSelector] = useState(false)\n  const [isDeleteMode, setIsDeleteMode] = useState(false)\n  const [refreshKey, setRefreshKey] = useState(0)\n  const exitState = useExitOnCtrlCD(onClose)\n\n  const modelManager = getModelManager()\n  const availableModels = modelManager.getAvailableModels()\n\n  // Create menu items: existing models + \"Add New Model\"\n  const menuItems = React.useMemo(() => {\n    const modelItems = availableModels.map(model => ({\n      id: model.modelName,\n      name: model.name,\n      provider: model.provider,\n      usedBy: getModelUsage(model.modelName),\n      type: 'model' as const,\n    }))\n\n    return [\n      ...modelItems,\n      {\n        id: 'add-new',\n        name: '+ Add New Model',\n        provider: '',\n        usedBy: [],\n        type: 'action' as const,\n      },\n    ]\n  }, [availableModels, config.modelPointers, refreshKey])\n\n  // Check which pointers are using this model\n  function getModelUsage(modelName: string): ModelPointerType[] {\n    const usage: ModelPointerType[] = []\n    const pointers: ModelPointerType[] = ['main', 'task', 'reasoning', 'quick']\n\n    pointers.forEach(pointer => {\n      if (config.modelPointers?.[pointer] === modelName) {\n        usage.push(pointer)\n      }\n    })\n\n    return usage\n  }\n\n  const handleDeleteModel = (modelName: string) => {\n    // Remove the model\n    modelManager.removeModel(modelName)\n\n    // The removeModel function should already clear the pointers,\n    // but let's ensure UI refreshes\n    setRefreshKey(prev => prev + 1)\n    setIsDeleteMode(false)\n  }\n\n  const handleAddNewModel = () => {\n    setShowModelSelector(true)\n  }\n\n  const handleModelConfigurationComplete = () => {\n    setShowModelSelector(false)\n    setRefreshKey(prev => prev + 1)\n  }\n\n  // Handle keyboard input\n  const handleInput = useCallback(\n    (input: string, key: any) => {\n      if (key.escape) {\n        if (isDeleteMode) {\n          setIsDeleteMode(false)\n        } else {\n          onClose()\n        }\n      } else if (input === 'd' && !isDeleteMode && availableModels.length > 1) {\n        setIsDeleteMode(true)\n      } else if (key.upArrow) {\n        setSelectedIndex(prev => Math.max(0, prev - 1))\n      } else if (key.downArrow) {\n        setSelectedIndex(prev => Math.min(menuItems.length - 1, prev + 1))\n      } else if (key.return || input === ' ') {\n        const item = menuItems[selectedIndex]\n\n        if (isDeleteMode && item.type === 'model') {\n          // Prevent deleting the last model\n          if (availableModels.length <= 1) {\n            setIsDeleteMode(false) // Exit delete mode\n            return\n          }\n          handleDeleteModel(item.id)\n        } else if (item.type === 'action') {\n          handleAddNewModel()\n        }\n        // Note: Remove any pointer switching functionality here\n      }\n    },\n    [selectedIndex, menuItems, onClose, isDeleteMode, availableModels.length],\n  )\n\n  useInput(handleInput)\n\n  // If showing ModelSelector, render it directly\n  if (showModelSelector) {\n    return (\n      <ModelSelector\n        onDone={handleModelConfigurationComplete}\n        onCancel={handleModelConfigurationComplete}\n        skipModelType={true}\n        isOnboarding={false}\n        abortController={new AbortController()}\n      />\n    )\n  }\n\n  // Main model list screen\n  return (\n    <Box\n      flexDirection=\"column\"\n      borderStyle=\"round\"\n      borderColor={isDeleteMode ? 'red' : theme.secondaryBorder}\n      paddingX={1}\n      marginTop={1}\n    >\n      <Box flexDirection=\"column\" minHeight={2} marginBottom={1}>\n        <Text bold color={isDeleteMode ? 'red' : undefined}>\n          Manage Model List{isDeleteMode ? ' - DELETE MODE' : ''}\n          {exitState.pending\n            ? ` (press ${exitState.keyName} again to exit)`\n            : ''}\n        </Text>\n        <Text dimColor>\n          {isDeleteMode\n            ? availableModels.length <= 1\n              ? 'Cannot delete the last model, Esc to cancel'\n              : 'Press Enter/Space to DELETE selected model, Esc to cancel'\n            : 'Navigate: \u2191\u2193 | Select: Enter | Delete: d | Exit: Esc'}\n        </Text>\n      </Box>\n\n      {menuItems.map((item, i) => {\n        const isSelected = i === selectedIndex\n\n        return (\n          <Box key={item.id} flexDirection=\"column\" marginBottom={1}>\n            <Box>\n              <Box width={50}>\n                <Text\n                  color={\n                    isSelected ? (isDeleteMode ? 'red' : 'blue') : undefined\n                  }\n                >\n                  {isSelected ? figures.pointer : ' '} {item.name}\n                </Text>\n              </Box>\n              <Box>\n                {item.type === 'model' && (\n                  <>\n                    <Text color={theme.secondaryText}>({item.provider})</Text>\n                    {item.usedBy.length > 0 && (\n                      <Box marginLeft={1}>\n                        <Text color={theme.success}>\n                          [Active: {item.usedBy.join(', ')}]\n                        </Text>\n                      </Box>\n                    )}\n                    {item.usedBy.length === 0 && (\n                      <Box marginLeft={1}>\n                        <Text color={theme.secondaryText}>[Available]</Text>\n                      </Box>\n                    )}\n                  </>\n                )}\n                {item.type === 'action' && (\n                  <Text color={theme.suggestion}>\n                    {isSelected ? '[Press Enter to add new model]' : ''}\n                  </Text>\n                )}\n              </Box>\n            </Box>\n            {isSelected && item.type === 'action' && (\n              <Box paddingLeft={2} marginTop={1}>\n                <Text dimColor>\n                  Configure a new model and add it to your library\n                </Text>\n              </Box>\n            )}\n          </Box>\n        )\n      })}\n\n      <Box\n        marginTop={1}\n        paddingTop={1}\n        borderTopColor={theme.secondaryBorder}\n        borderTopStyle=\"single\"\n      >\n        <Text dimColor>\n          {isDeleteMode\n            ? availableModels.length <= 1\n              ? 'Cannot delete the last model - press Esc to cancel'\n              : 'DELETE MODE: Press Enter/Space to delete model, Esc to cancel'\n            : availableModels.length <= 1\n              ? 'Use \u2191/\u2193 to navigate, Enter to add new, Esc to exit (cannot delete last model)'\n              : 'Use \u2191/\u2193 to navigate, d to delete model, Enter to add new, Esc to exit'}\n        </Text>\n      </Box>\n    </Box>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { Box, Text, useInput } from 'ink'\nimport * as React from 'react'\nimport { useState, useCallback } from 'react'\nimport figures from 'figures'\nimport { getTheme } from '@utils/theme'\nimport { getGlobalConfig, ModelPointerType } from '@utils/config'\nimport { getModelManager } from '@utils/model'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { ModelSelector } from './ModelSelector'\n\ntype Props = {\n  onClose: () => void\n}\n\nexport function ModelListManager({ onClose }: Props): React.ReactNode {\n  const config = getGlobalConfig()\n  const theme = getTheme()\n  const [selectedIndex, setSelectedIndex] = useState(0)\n  const [showModelSelector, setShowModelSelector] = useState(false)\n  const [isDeleteMode, setIsDeleteMode] = useState(false)\n  const [refreshKey, setRefreshKey] = useState(0)\n  // Disable exit handler when showing child components to prevent listener accumulation\n  const exitState = useExitOnCtrlCD(onClose, { isActive: !showModelSelector })\n\n  const modelManager = getModelManager()\n  const availableModels = modelManager.getAvailableModels()\n\n  // Create menu items: existing models + \"Add New Model\"\n  const menuItems = React.useMemo(() => {\n    const modelItems = availableModels.map(model => ({\n      id: model.modelName,\n      name: model.name,\n      provider: model.provider,\n      usedBy: getModelUsage(model.modelName),\n      type: 'model' as const,\n    }))\n\n    return [\n      ...modelItems,\n      {\n        id: 'add-new',\n        name: '+ Add New Model',\n        provider: '',\n        usedBy: [],\n        type: 'action' as const,\n      },\n    ]\n  }, [availableModels, config.modelPointers, refreshKey])\n\n  // Check which pointers are using this model\n  function getModelUsage(modelName: string): ModelPointerType[] {\n    const usage: ModelPointerType[] = []\n    const pointers: ModelPointerType[] = ['main', 'task', 'reasoning', 'quick']\n\n    pointers.forEach(pointer => {\n      if (config.modelPointers?.[pointer] === modelName) {\n        usage.push(pointer)\n      }\n    })\n\n    return usage\n  }\n\n  const handleDeleteModel = (modelName: string) => {\n    // Remove the model\n    modelManager.removeModel(modelName)\n\n    // The removeModel function should already clear the pointers,\n    // but let's ensure UI refreshes\n    setRefreshKey(prev => prev + 1)\n    setIsDeleteMode(false)\n  }\n\n  const handleAddNewModel = () => {\n    setShowModelSelector(true)\n  }\n\n  const handleModelConfigurationComplete = () => {\n    setShowModelSelector(false)\n    setRefreshKey(prev => prev + 1)\n  }\n\n  // Handle keyboard input\n  const handleInput = useCallback(\n    (input: string, key: any) => {\n      if (key.escape) {\n        if (isDeleteMode) {\n          setIsDeleteMode(false)\n        } else {\n          onClose()\n        }\n      } else if (input === 'd' && !isDeleteMode && availableModels.length > 1) {\n        setIsDeleteMode(true)\n      } else if (key.upArrow) {\n        setSelectedIndex(prev => Math.max(0, prev - 1))\n      } else if (key.downArrow) {\n        setSelectedIndex(prev => Math.min(menuItems.length - 1, prev + 1))\n      } else if (key.return || input === ' ') {\n        const item = menuItems[selectedIndex]\n\n        if (isDeleteMode && item.type === 'model') {\n          // Prevent deleting the last model\n          if (availableModels.length <= 1) {\n            setIsDeleteMode(false) // Exit delete mode\n            return\n          }\n          handleDeleteModel(item.id)\n        } else if (item.type === 'action') {\n          handleAddNewModel()\n        }\n        // Note: Remove any pointer switching functionality here\n      }\n    },\n    [selectedIndex, menuItems, onClose, isDeleteMode, availableModels.length],\n  )\n\n  // Only listen for input when not showing child components\n  // This prevents multiple useInput hooks from accumulating listeners\n  useInput(handleInput, { isActive: !showModelSelector })\n\n  // If showing ModelSelector, render it directly\n  if (showModelSelector) {\n    return (\n      <ModelSelector\n        onDone={handleModelConfigurationComplete}\n        onCancel={handleModelConfigurationComplete}\n        skipModelType={true}\n        isOnboarding={false}\n        abortController={new AbortController()}\n      />\n    )\n  }\n\n  // Main model list screen\n  return (\n    <Box\n      flexDirection=\"column\"\n      borderStyle=\"round\"\n      borderColor={isDeleteMode ? 'red' : theme.secondaryBorder}\n      paddingX={1}\n      marginTop={1}\n    >\n      <Box flexDirection=\"column\" minHeight={2} marginBottom={1}>\n        <Text bold color={isDeleteMode ? 'red' : undefined}>\n          Manage Model List{isDeleteMode ? ' - DELETE MODE' : ''}\n          {exitState.pending\n            ? ` (press ${exitState.keyName} again to exit)`\n            : ''}\n        </Text>\n        <Text dimColor>\n          {isDeleteMode\n            ? availableModels.length <= 1\n              ? 'Cannot delete the last model, Esc to cancel'\n              : 'Press Enter/Space to DELETE selected model, Esc to cancel'\n            : 'Navigate: \u2191\u2193 | Select: Enter | Delete: d | Exit: Esc'}\n        </Text>\n      </Box>\n\n      {menuItems.map((item, i) => {\n        const isSelected = i === selectedIndex\n\n        return (\n          <Box key={item.id} flexDirection=\"column\" marginBottom={1}>\n            <Box>\n              <Box width={50}>\n                <Text\n                  color={\n                    isSelected ? (isDeleteMode ? 'red' : 'blue') : undefined\n                  }\n                >\n                  {isSelected ? figures.pointer : ' '} {item.name}\n                </Text>\n              </Box>\n              <Box>\n                {item.type === 'model' && (\n                  <>\n                    <Text color={theme.secondaryText}>({item.provider})</Text>\n                    {item.usedBy.length > 0 && (\n                      <Box marginLeft={1}>\n                        <Text color={theme.success}>\n                          [Active: {item.usedBy.join(', ')}]\n                        </Text>\n                      </Box>\n                    )}\n                    {item.usedBy.length === 0 && (\n                      <Box marginLeft={1}>\n                        <Text color={theme.secondaryText}>[Available]</Text>\n                      </Box>\n                    )}\n                  </>\n                )}\n                {item.type === 'action' && (\n                  <Text color={theme.suggestion}>\n                    {isSelected ? '[Press Enter to add new model]' : ''}\n                  </Text>\n                )}\n              </Box>\n            </Box>\n            {isSelected && item.type === 'action' && (\n              <Box paddingLeft={2} marginTop={1}>\n                <Text dimColor>\n                  Configure a new model and add it to your library\n                </Text>\n              </Box>\n            )}\n          </Box>\n        )\n      })}\n\n      <Box\n        marginTop={1}\n        paddingTop={1}\n        borderTopColor={theme.secondaryBorder}\n        borderTopStyle=\"single\"\n      >\n        <Text dimColor>\n          {isDeleteMode\n            ? availableModels.length <= 1\n              ? 'Cannot delete the last model - press Esc to cancel'\n              : 'DELETE MODE: Press Enter/Space to delete model, Esc to cancel'\n            : availableModels.length <= 1\n              ? 'Use \u2191/\u2193 to navigate, Enter to add new, Esc to exit (cannot delete last model)'\n              : 'Use \u2191/\u2193 to navigate, d to delete model, Enter to add new, Esc to exit'}\n        </Text>\n      </Box>\n    </Box>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/components/ModelSelector/ModelSelector.js

@@ -26,7 +26,7 @@ import {
   MAX_TOKENS_OPTIONS,
   DEFAULT_MAX_TOKENS
 } from "./constants.js";
-import { useEscapeNavigation } from "./hooks.js";
+import { useEscapeNavigation } from "./hooks/index.js";
 function printModelConfig() {
   const config = getGlobalConfig();
   const modelProfiles = config.modelProfiles || [];

package/dist/components/Onboarding.js

@@ -14,7 +14,7 @@ import { StructuredDiff } from "./StructuredDiff.js";
 import { getTheme } from "../utils/theme.js";
 import { clearTerminal } from "../utils/terminal.js";
 import { PressEnterToContinue } from "./PressEnterToContinue.js";
-import { ModelSelector } from "./ModelSelector.js";
+import { ModelSelector } from "./ModelSelector/index.js";
 function Onboarding({ onDone }) {
   const [currentStepIndex, setCurrentStepIndex] = useState(0);
   const [showModelSelector, setShowModelSelector] = useState(false);
@@ -45,20 +45,25 @@ function Onboarding({ onDone }) {
   function handleModelSelectionDone() {
     onDone();
   }
-  const exitState = useExitOnCtrlCD(() => process.exit(0));
-  useInput(async (_, key) => {
-    const currentStep = steps[currentStepIndex];
-    if (key.return && currentStep && ["usage", "providers", "model"].includes(currentStep.id)) {
-      if (currentStep.id === "model") {
-        setShowModelSelector(true);
-      } else if (currentStepIndex === steps.length - 1) {
-        onDone();
-      } else {
-        await clearTerminal();
-        goToNextStep();
-      }
-    }
+  const exitState = useExitOnCtrlCD(() => process.exit(0), {
+    isActive: !showModelSelector
   });
+  useInput(
+    async (_, key) => {
+      const currentStep = steps[currentStepIndex];
+      if (key.return && currentStep && ["usage", "providers", "model"].includes(currentStep.id)) {
+        if (currentStep.id === "model") {
+          setShowModelSelector(true);
+        } else if (currentStepIndex === steps.length - 1) {
+          onDone();
+        } else {
+          await clearTerminal();
+          goToNextStep();
+        }
+      }
+    },
+    { isActive: !showModelSelector }
+  );
   const themeStep = /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", gap: 1, paddingLeft: 1 }, /* @__PURE__ */ React.createElement(Text, null, "Let's get started."), /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(Text, { bold: true }, "Choose the option that looks best when you select it:"), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "To change this later, run /config")), /* @__PURE__ */ React.createElement(
     Select,
     {

package/dist/components/Onboarding.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/Onboarding.tsx"],
-  "sourcesContent": ["import React, { useState } from 'react'\nimport { PRODUCT_NAME } from '@constants/product'\nimport { Box, Newline, Text, useInput } from 'ink'\nimport {\n  getGlobalConfig,\n  saveGlobalConfig,\n  DEFAULT_GLOBAL_CONFIG,\n  ProviderType,\n} from '@utils/config'\nimport { OrderedList } from '@inkjs/ui'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { MIN_LOGO_WIDTH } from './Logo'\nimport { Select } from './CustomSelect/select'\nimport { StructuredDiff } from './StructuredDiff'\nimport { getTheme, type ThemeNames } from '@utils/theme'\nimport { clearTerminal } from '@utils/terminal'\nimport { PressEnterToContinue } from './PressEnterToContinue'\nimport { ModelSelector } from './ModelSelector'\ntype StepId = 'theme' | 'usage' | 'providers' | 'model'\n\ninterface OnboardingStep {\n  id: StepId\n  component: React.ReactNode\n}\n\ntype Props = {\n  onDone(): void\n}\n\nexport function Onboarding({ onDone }: Props): React.ReactNode {\n  const [currentStepIndex, setCurrentStepIndex] = useState(0)\n  const [showModelSelector, setShowModelSelector] = useState(false)\n  const config = getGlobalConfig()\n\n  const [selectedTheme, setSelectedTheme] = useState(\n    DEFAULT_GLOBAL_CONFIG.theme,\n  )\n  const theme = getTheme()\n  function goToNextStep() {\n    if (currentStepIndex < steps.length - 1) {\n      const nextIndex = currentStepIndex + 1\n      setCurrentStepIndex(nextIndex)\n    }\n  }\n\n  function handleThemeSelection(newTheme: string) {\n    saveGlobalConfig({\n      ...config,\n      theme: newTheme as ThemeNames,\n    })\n    goToNextStep()\n  }\n\n  function handleThemePreview(newTheme: string) {\n    setSelectedTheme(newTheme as ThemeNames)\n  }\n\n  function handleProviderSelectionDone() {\n    // After model selection is done, go to the next step\n    goToNextStep()\n  }\n\n  function handleModelSelectionDone() {\n    // After final model selection is done, complete onboarding\n    onDone()\n  }\n\n  const exitState = useExitOnCtrlCD(() => process.exit(0))\n\n  useInput(async (_, key) => {\n    const currentStep = steps[currentStepIndex]\n    if (\n      key.return &&\n      currentStep &&\n      ['usage', 'providers', 'model'].includes(currentStep.id)\n    ) {\n      if (currentStep.id === 'model') {\n        // Navigate to ModelSelector component\n        setShowModelSelector(true)\n      } else if (currentStepIndex === steps.length - 1) {\n        onDone()\n      } else {\n        // HACK: for some reason there's now a jump here otherwise :(\n        await clearTerminal()\n        goToNextStep()\n      }\n    }\n  })\n\n  // Define all onboarding steps\n  const themeStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text>Let&apos;s get started.</Text>\n      <Box flexDirection=\"column\">\n        <Text bold>Choose the option that looks best when you select it:</Text>\n        <Text dimColor>To change this later, run /config</Text>\n      </Box>\n      <Select\n        options={[\n          { label: 'Light text', value: 'dark' },\n          { label: 'Dark text', value: 'light' },\n          {\n            label: 'Light text (colorblind-friendly)',\n            value: 'dark-daltonized',\n          },\n          {\n            label: 'Dark text (colorblind-friendly)',\n            value: 'light-daltonized',\n          },\n        ]}\n        onFocus={handleThemePreview}\n        onChange={handleThemeSelection}\n      />\n      <Box flexDirection=\"column\">\n        <Box\n          paddingLeft={1}\n          marginRight={1}\n          borderStyle=\"round\"\n          borderColor=\"gray\"\n          flexDirection=\"column\"\n        >\n          <StructuredDiff\n            patch={{\n              oldStart: 1,\n              newStart: 1,\n              oldLines: 3,\n              newLines: 3,\n              lines: [\n                'function greet() {',\n                '-  console.log(\"Hello, World!\");',\n                '+  console.log(\"Hello, anon!\");',\n                '}',\n              ],\n            }}\n            dim={false}\n            width={40}\n            overrideTheme={selectedTheme}\n          />\n        </Box>\n      </Box>\n    </Box>\n  )\n\n  const providersStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Box flexDirection=\"column\" width={70}>\n        <Text color={theme.secondaryText}>\n          Next, let's select your preferred AI provider and model.\n        </Text>\n      </Box>\n      <ModelSelector\n        onDone={handleProviderSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    </Box>\n  )\n\n  const usageStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Using {PRODUCT_NAME} effectively:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <OrderedList children={[]}>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Start in your project directory\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Files are automatically added to context when needed.\n              </Text>\n              <Newline />\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Use {PRODUCT_NAME} as a development partner\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Get help with file analysis, editing, bash commands,\n                <Newline />\n                and git history.\n                <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Provide clear context\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Be as specific as you would with another engineer. <Newline />\n                The better the context, the better the results. <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n        </OrderedList>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const modelStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Configure your models:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <Text>\n          You can customize which models {PRODUCT_NAME} uses for different\n          tasks.\n          <Newline />\n          <Text color={theme.secondaryText}>\n            Let's set up your preferred models for large and small tasks.\n          </Text>\n        </Text>\n        <Box marginTop={1}>\n          <Text>\n            Press <Text color={theme.suggestion}>Enter</Text> to continue to the\n            model selection screen.\n          </Text>\n        </Box>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const steps: OnboardingStep[] = []\n  steps.push({ id: 'theme', component: themeStep })\n  steps.push({ id: 'usage', component: usageStep })\n\n  steps.push({ id: 'model', component: modelStep })\n\n  // If we're showing the model selector screen, render it directly\n  if (showModelSelector) {\n    return (\n      <ModelSelector\n        onDone={handleModelSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    )\n  }\n\n  return (\n    <Box flexDirection=\"column\" gap={1}>\n      <>\n        <Box flexDirection=\"column\" gap={1}>\n          <Text bold>\n            {PRODUCT_NAME}{' '}\n            {exitState.pending\n              ? `(press ${exitState.keyName} again to exit)`\n              : ''}\n          </Text>\n          {steps[currentStepIndex]?.component}\n        </Box>\n      </>\n    </Box>\n  )\n}\n\nexport function WelcomeBox(): React.ReactNode {\n  const theme = getTheme()\n  return (\n    <Box\n      borderColor={theme.minto}\n      borderStyle=\"round\"\n      paddingX={1}\n      width={MIN_LOGO_WIDTH}\n    >\n      <Text>\n        <Text color={theme.minto}>\u273B</Text> Welcome to{' '}\n        <Text bold>{PRODUCT_NAME}</Text> research preview!\n      </Text>\n    </Box>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { useState } from 'react'\nimport { PRODUCT_NAME } from '@constants/product'\nimport { Box, Newline, Text, useInput } from 'ink'\nimport {\n  getGlobalConfig,\n  saveGlobalConfig,\n  DEFAULT_GLOBAL_CONFIG,\n  ProviderType,\n} from '@utils/config'\nimport { OrderedList } from '@inkjs/ui'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { MIN_LOGO_WIDTH } from './Logo'\nimport { Select } from './CustomSelect/select'\nimport { StructuredDiff } from './StructuredDiff'\nimport { getTheme, type ThemeNames } from '@utils/theme'\nimport { clearTerminal } from '@utils/terminal'\nimport { PressEnterToContinue } from './PressEnterToContinue'\nimport { ModelSelector } from './ModelSelector'\ntype StepId = 'theme' | 'usage' | 'providers' | 'model'\n\ninterface OnboardingStep {\n  id: StepId\n  component: React.ReactNode\n}\n\ntype Props = {\n  onDone(): void\n}\n\nexport function Onboarding({ onDone }: Props): React.ReactNode {\n  const [currentStepIndex, setCurrentStepIndex] = useState(0)\n  const [showModelSelector, setShowModelSelector] = useState(false)\n  const config = getGlobalConfig()\n\n  const [selectedTheme, setSelectedTheme] = useState(\n    DEFAULT_GLOBAL_CONFIG.theme,\n  )\n  const theme = getTheme()\n  function goToNextStep() {\n    if (currentStepIndex < steps.length - 1) {\n      const nextIndex = currentStepIndex + 1\n      setCurrentStepIndex(nextIndex)\n    }\n  }\n\n  function handleThemeSelection(newTheme: string) {\n    saveGlobalConfig({\n      ...config,\n      theme: newTheme as ThemeNames,\n    })\n    goToNextStep()\n  }\n\n  function handleThemePreview(newTheme: string) {\n    setSelectedTheme(newTheme as ThemeNames)\n  }\n\n  function handleProviderSelectionDone() {\n    // After model selection is done, go to the next step\n    goToNextStep()\n  }\n\n  function handleModelSelectionDone() {\n    // After final model selection is done, complete onboarding\n    onDone()\n  }\n\n  // Disable exit handler when showing ModelSelector to prevent listener accumulation\n  const exitState = useExitOnCtrlCD(() => process.exit(0), {\n    isActive: !showModelSelector,\n  })\n\n  // Only listen when not showing ModelSelector\n  useInput(\n    async (_, key) => {\n      const currentStep = steps[currentStepIndex]\n      if (\n        key.return &&\n        currentStep &&\n        ['usage', 'providers', 'model'].includes(currentStep.id)\n      ) {\n        if (currentStep.id === 'model') {\n          // Navigate to ModelSelector component\n          setShowModelSelector(true)\n        } else if (currentStepIndex === steps.length - 1) {\n          onDone()\n        } else {\n          // HACK: for some reason there's now a jump here otherwise :(\n          await clearTerminal()\n          goToNextStep()\n        }\n      }\n    },\n    { isActive: !showModelSelector },\n  )\n\n  // Define all onboarding steps\n  const themeStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text>Let&apos;s get started.</Text>\n      <Box flexDirection=\"column\">\n        <Text bold>Choose the option that looks best when you select it:</Text>\n        <Text dimColor>To change this later, run /config</Text>\n      </Box>\n      <Select\n        options={[\n          { label: 'Light text', value: 'dark' },\n          { label: 'Dark text', value: 'light' },\n          {\n            label: 'Light text (colorblind-friendly)',\n            value: 'dark-daltonized',\n          },\n          {\n            label: 'Dark text (colorblind-friendly)',\n            value: 'light-daltonized',\n          },\n        ]}\n        onFocus={handleThemePreview}\n        onChange={handleThemeSelection}\n      />\n      <Box flexDirection=\"column\">\n        <Box\n          paddingLeft={1}\n          marginRight={1}\n          borderStyle=\"round\"\n          borderColor=\"gray\"\n          flexDirection=\"column\"\n        >\n          <StructuredDiff\n            patch={{\n              oldStart: 1,\n              newStart: 1,\n              oldLines: 3,\n              newLines: 3,\n              lines: [\n                'function greet() {',\n                '-  console.log(\"Hello, World!\");',\n                '+  console.log(\"Hello, anon!\");',\n                '}',\n              ],\n            }}\n            dim={false}\n            width={40}\n            overrideTheme={selectedTheme}\n          />\n        </Box>\n      </Box>\n    </Box>\n  )\n\n  const providersStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Box flexDirection=\"column\" width={70}>\n        <Text color={theme.secondaryText}>\n          Next, let's select your preferred AI provider and model.\n        </Text>\n      </Box>\n      <ModelSelector\n        onDone={handleProviderSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    </Box>\n  )\n\n  const usageStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Using {PRODUCT_NAME} effectively:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <OrderedList children={[]}>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Start in your project directory\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Files are automatically added to context when needed.\n              </Text>\n              <Newline />\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Use {PRODUCT_NAME} as a development partner\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Get help with file analysis, editing, bash commands,\n                <Newline />\n                and git history.\n                <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Provide clear context\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Be as specific as you would with another engineer. <Newline />\n                The better the context, the better the results. <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n        </OrderedList>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const modelStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Configure your models:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <Text>\n          You can customize which models {PRODUCT_NAME} uses for different\n          tasks.\n          <Newline />\n          <Text color={theme.secondaryText}>\n            Let's set up your preferred models for large and small tasks.\n          </Text>\n        </Text>\n        <Box marginTop={1}>\n          <Text>\n            Press <Text color={theme.suggestion}>Enter</Text> to continue to the\n            model selection screen.\n          </Text>\n        </Box>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const steps: OnboardingStep[] = []\n  steps.push({ id: 'theme', component: themeStep })\n  steps.push({ id: 'usage', component: usageStep })\n\n  steps.push({ id: 'model', component: modelStep })\n\n  // If we're showing the model selector screen, render it directly\n  if (showModelSelector) {\n    return (\n      <ModelSelector\n        onDone={handleModelSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    )\n  }\n\n  return (\n    <Box flexDirection=\"column\" gap={1}>\n      <>\n        <Box flexDirection=\"column\" gap={1}>\n          <Text bold>\n            {PRODUCT_NAME}{' '}\n            {exitState.pending\n              ? `(press ${exitState.keyName} again to exit)`\n              : ''}\n          </Text>\n          {steps[currentStepIndex]?.component}\n        </Box>\n      </>\n    </Box>\n  )\n}\n\nexport function WelcomeBox(): React.ReactNode {\n  const theme = getTheme()\n  return (\n    <Box\n      borderColor={theme.minto}\n      borderStyle=\"round\"\n      paddingX={1}\n      width={MIN_LOGO_WIDTH}\n    >\n      <Text>\n        <Text color={theme.minto}>\u273B</Text> Welcome to{' '}\n        <Text bold>{PRODUCT_NAME}</Text> research preview!\n      </Text>\n    </Box>\n  )\n}\n"],
+  "mappings": "AAAA,OAAO,SAAS,gBAAgB;AAChC,SAAS,oBAAoB;AAC7B,SAAS,KAAK,SAAS,MAAM,gBAAgB;AAC7C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AACP,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAC/B,SAAS,gBAAiC;AAC1C,SAAS,qBAAqB;AAC9B,SAAS,4BAA4B;AACrC,SAAS,qBAAqB;AAYvB,SAAS,WAAW,EAAE,OAAO,GAA2B;AAC7D,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,CAAC;AAC1D,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAChE,QAAM,SAAS,gBAAgB;AAE/B,QAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,IACxC,sBAAsB;AAAA,EACxB;AACA,QAAM,QAAQ,SAAS;AACvB,WAAS,eAAe;AACtB,QAAI,mBAAmB,MAAM,SAAS,GAAG;AACvC,YAAM,YAAY,mBAAmB;AACrC,0BAAoB,SAAS;AAAA,IAC/B;AAAA,EACF;AAEA,WAAS,qBAAqB,UAAkB;AAC9C,qBAAiB;AAAA,MACf,GAAG;AAAA,MACH,OAAO;AAAA,IACT,CAAC;AACD,iBAAa;AAAA,EACf;AAEA,WAAS,mBAAmB,UAAkB;AAC5C,qBAAiB,QAAsB;AAAA,EACzC;AAEA,WAAS,8BAA8B;AAErC,iBAAa;AAAA,EACf;AAEA,WAAS,2BAA2B;AAElC,WAAO;AAAA,EACT;AAGA,QAAM,YAAY,gBAAgB,MAAM,QAAQ,KAAK,CAAC,GAAG;AAAA,IACvD,UAAU,CAAC;AAAA,EACb,CAAC;AAGD;AAAA,IACE,OAAO,GAAG,QAAQ;AAChB,YAAM,cAAc,MAAM,gBAAgB;AAC1C,UACE,IAAI,UACJ,eACA,CAAC,SAAS,aAAa,OAAO,EAAE,SAAS,YAAY,EAAE,GACvD;AACA,YAAI,YAAY,OAAO,SAAS;AAE9B,+BAAqB,IAAI;AAAA,QAC3B,WAAW,qBAAqB,MAAM,SAAS,GAAG;AAChD,iBAAO;AAAA,QACT,OAAO;AAEL,gBAAM,cAAc;AACpB,uBAAa;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAAA,IACA,EAAE,UAAU,CAAC,kBAAkB;AAAA,EACjC;AAGA,QAAM,YACJ,oCAAC,OAAI,eAAc,UAAS,KAAK,GAAG,aAAa,KAC/C,oCAAC,YAAK,oBAAuB,GAC7B,oCAAC,OAAI,eAAc,YACjB,oCAAC,QAAK,MAAI,QAAC,uDAAqD,GAChE,oCAAC,QAAK,UAAQ,QAAC,mCAAiC,CAClD,GACA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,QACP,EAAE,OAAO,cAAc,OAAO,OAAO;AAAA,QACrC,EAAE,OAAO,aAAa,OAAO,QAAQ;AAAA,QACrC;AAAA,UACE,OAAO;AAAA,UACP,OAAO;AAAA,QACT;AAAA,QACA;AAAA,UACE,OAAO;AAAA,UACP,OAAO;AAAA,QACT;AAAA,MACF;AAAA,MACA,SAAS;AAAA,MACT,UAAU;AAAA;AAAA,EACZ,GACA,oCAAC,OAAI,eAAc,YACjB;AAAA,IAAC;AAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,aAAY;AAAA,MACZ,aAAY;AAAA,MACZ,eAAc;AAAA;AAAA,IAEd;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,UAAU;AAAA,UACV,UAAU;AAAA,UACV,UAAU;AAAA,UACV,OAAO;AAAA,YACL;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF;AAAA,QACA,KAAK;AAAA,QACL,OAAO;AAAA,QACP,eAAe;AAAA;AAAA,IACjB;AAAA,EACF,CACF,CACF;AAGF,QAAM,gBACJ,oCAAC,OAAI,eAAc,UAAS,KAAK,GAAG,aAAa,KAC/C,oCAAC,OAAI,eAAc,UAAS,OAAO,MACjC,oCAAC,QAAK,OAAO,MAAM,iBAAe,0DAElC,CACF,GACA;AAAA,IAAC;AAAA;AAAA,MACC,QAAQ;AAAA,MACR,eAAe;AAAA,MACf,cAAc;AAAA;AAAA,EAChB,CACF;AAGF,QAAM,YACJ,oCAAC,OAAI,eAAc,UAAS,KAAK,GAAG,aAAa,KAC/C,oCAAC,QAAK,MAAI,QAAC,UAAO,cAAa,eAAa,GAC5C,oCAAC,OAAI,eAAc,UAAS,OAAO,MACjC,oCAAC,eAAY,UAAU,CAAC,KACtB,oCAAC,YAAY,MAAZ,EAAiB,UAAU,CAAC,KAC3B,oCAAC,YAAK,mCAEJ,oCAAC,aAAQ,GACT,oCAAC,QAAK,OAAO,MAAM,iBAAe,uDAElC,GACA,oCAAC,aAAQ,CACX,CACF,GACA,oCAAC,YAAY,MAAZ,EAAiB,UAAU,CAAC,KAC3B,oCAAC,YAAK,QACC,cAAa,6BAClB,oCAAC,aAAQ,GACT,oCAAC,QAAK,OAAO,MAAM,iBAAe,wDAEhC,oCAAC,aAAQ,GAAE,oBAEX,oCAAC,aAAQ,CACX,CACF,CACF,GACA,oCAAC,YAAY,MAAZ,EAAiB,UAAU,CAAC,KAC3B,oCAAC,YAAK,yBAEJ,oCAAC,aAAQ,GACT,oCAAC,QAAK,OAAO,MAAM,iBAAe,uDACmB,oCAAC,aAAQ,GAAE,oDACd,oCAAC,aAAQ,CAC3D,CACF,CACF,CACF,CACF,GACA,oCAAC,0BAAqB,CACxB;AAGF,QAAM,YACJ,oCAAC,OAAI,eAAc,UAAS,KAAK,GAAG,aAAa,KAC/C,oCAAC,QAAK,MAAI,QAAC,wBAAsB,GACjC,oCAAC,OAAI,eAAc,UAAS,OAAO,MACjC,oCAAC,YAAK,mCAC4B,cAAa,8BAE7C,oCAAC,aAAQ,GACT,oCAAC,QAAK,OAAO,MAAM,iBAAe,+DAElC,CACF,GACA,oCAAC,OAAI,WAAW,KACd,oCAAC,YAAK,UACE,oCAAC,QAAK,OAAO,MAAM,cAAY,OAAK,GAAO,6CAEnD,CACF,CACF,GACA,oCAAC,0BAAqB,CACxB;AAGF,QAAM,QAA0B,CAAC;AACjC,QAAM,KAAK,EAAE,IAAI,SAAS,WAAW,UAAU,CAAC;AAChD,QAAM,KAAK,EAAE,IAAI,SAAS,WAAW,UAAU,CAAC;AAEhD,QAAM,KAAK,EAAE,IAAI,SAAS,WAAW,UAAU,CAAC;AAGhD,MAAI,mBAAmB;AACrB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ;AAAA,QACR,eAAe;AAAA,QACf,cAAc;AAAA;AAAA,IAChB;AAAA,EAEJ;AAEA,SACE,oCAAC,OAAI,eAAc,UAAS,KAAK,KAC/B,0DACE,oCAAC,OAAI,eAAc,UAAS,KAAK,KAC/B,oCAAC,QAAK,MAAI,QACP,cAAc,KACd,UAAU,UACP,UAAU,UAAU,OAAO,oBAC3B,EACN,GACC,MAAM,gBAAgB,GAAG,SAC5B,CACF,CACF;AAEJ;AAEO,SAAS,aAA8B;AAC5C,QAAM,QAAQ,SAAS;AACvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa,MAAM;AAAA,MACnB,aAAY;AAAA,MACZ,UAAU;AAAA,MACV,OAAO;AAAA;AAAA,IAEP,oCAAC,YACC,oCAAC,QAAK,OAAO,MAAM,SAAO,QAAC,GAAO,eAAY,KAC9C,oCAAC,QAAK,MAAI,QAAE,YAAa,GAAO,oBAClC;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/components/ProgressBar.js

@@ -0,0 +1,74 @@
+import { Box, Text } from "ink";
+import * as React from "react";
+import { useRef } from "react";
+import { getTheme } from "../utils/theme.js";
+import { useUnifiedAnimation } from "../utils/animationManager.js";
+function ProgressBar({
+  progress,
+  width = 20,
+  showPercent = true,
+  label,
+  indeterminate = false,
+  filledChar = "\u2588",
+  emptyChar = "\u2591",
+  filledColor,
+  emptyColor
+}) {
+  const theme = getTheme();
+  const startTimeRef = useRef(Date.now());
+  const { spinnerFrame } = useUnifiedAnimation({
+    enabled: indeterminate,
+    startTime: startTimeRef.current,
+    spinnerFrameCount: width * 2,
+    componentId: "progress-bar"
+  });
+  const clampedProgress = Math.max(0, Math.min(100, progress));
+  if (indeterminate) {
+    const segmentWidth = Math.ceil(width / 4);
+    const effectivePos = spinnerFrame < width ? spinnerFrame : width * 2 - spinnerFrame - segmentWidth;
+    const beforeSegment = Math.max(0, effectivePos);
+    const afterSegment = Math.max(0, width - effectivePos - segmentWidth);
+    return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, label && /* @__PURE__ */ React.createElement(Text, { color: theme.secondaryText }, label, " "), /* @__PURE__ */ React.createElement(Text, { color: emptyColor || theme.dimmedText }, emptyChar.repeat(beforeSegment)), /* @__PURE__ */ React.createElement(Text, { color: filledColor || theme.minto }, filledChar.repeat(Math.min(segmentWidth, width - beforeSegment))), /* @__PURE__ */ React.createElement(Text, { color: emptyColor || theme.dimmedText }, emptyChar.repeat(afterSegment)));
+  }
+  const filled = Math.round(clampedProgress / 100 * width);
+  const empty = width - filled;
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, label && /* @__PURE__ */ React.createElement(Text, { color: theme.secondaryText }, label, " "), /* @__PURE__ */ React.createElement(Text, { color: filledColor || theme.success }, filledChar.repeat(filled)), /* @__PURE__ */ React.createElement(Text, { color: emptyColor || theme.dimmedText }, emptyChar.repeat(empty)), showPercent && /* @__PURE__ */ React.createElement(Text, { color: theme.secondaryText }, " ", Math.round(clampedProgress), "%"));
+}
+function ProgressIndicator({
+  progress,
+  showText = true
+}) {
+  const theme = getTheme();
+  const clampedProgress = Math.max(0, Math.min(100, progress));
+  const getIndicator = () => {
+    if (clampedProgress < 25) return "\u25CB";
+    if (clampedProgress < 50) return "\u25D4";
+    if (clampedProgress < 75) return "\u25D1";
+    if (clampedProgress < 100) return "\u25D5";
+    return "\u25CF";
+  };
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color: theme.minto }, getIndicator()), showText && /* @__PURE__ */ React.createElement(Text, { color: theme.secondaryText }, " ", Math.round(clampedProgress), "%"));
+}
+function StepProgress({
+  current,
+  total,
+  labels,
+  showLabels = true
+}) {
+  const theme = getTheme();
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row", gap: 1 }, Array.from({ length: total }, (_, i) => {
+    const stepNum = i + 1;
+    const isComplete = stepNum < current;
+    const isCurrent = stepNum === current;
+    const label = labels?.[i];
+    const color = isComplete ? theme.success : isCurrent ? theme.minto : theme.dimmedText;
+    const symbol = isComplete ? "\u25CF" : isCurrent ? "\u25D0" : "\u25CB";
+    return /* @__PURE__ */ React.createElement(Box, { key: i, flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color }, symbol), showLabels && label && /* @__PURE__ */ React.createElement(Text, { color }, " ", label), i < total - 1 && /* @__PURE__ */ React.createElement(Text, { color: theme.dimmedText }, " \u2192 "));
+  }));
+}
+export {
+  ProgressBar,
+  ProgressIndicator,
+  StepProgress
+};
+//# sourceMappingURL=ProgressBar.js.map

package/dist/components/ProgressBar.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/ProgressBar.tsx"],
+  "sourcesContent": ["/**\n * ProgressBar - Visual progress indicator for long-running operations\n *\n * Displays progress as a horizontal bar with optional percentage:\n *\n * \u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2591\u2591\u2591\u2591\u2591\u2591\u2591\u2591\u2591\u2591\u2591\u2591 45%\n *\n * Features:\n * - Configurable width and style\n * - Optional percentage display\n * - Theme-aware colors\n * - Indeterminate mode with animation\n * - Uses unified animation manager to reduce screen flickering\n */\n\nimport { Box, Text } from 'ink'\nimport * as React from 'react'\nimport { useRef } from 'react'\nimport { getTheme } from '@utils/theme'\nimport { useUnifiedAnimation } from '@utils/animationManager'\n\nexport interface ProgressBarProps {\n  /** Progress value (0-100) */\n  progress: number\n  /** Bar width in characters (default: 20) */\n  width?: number\n  /** Show percentage text (default: true) */\n  showPercent?: boolean\n  /** Label text to show before the bar */\n  label?: string\n  /** Indeterminate mode - shows animated bouncing bar */\n  indeterminate?: boolean\n  /** Custom filled character (default: \u2588) */\n  filledChar?: string\n  /** Custom empty character (default: \u2591) */\n  emptyChar?: string\n  /** Color override for filled portion */\n  filledColor?: string\n  /** Color override for empty portion */\n  emptyColor?: string\n}\n\n/**\n * ProgressBar component for displaying operation progress\n *\n * Usage:\n * ```tsx\n * // Basic usage\n * <ProgressBar progress={45} />\n *\n * // With label\n * <ProgressBar progress={75} label=\"Downloading\" />\n *\n * // Indeterminate (unknown progress)\n * <ProgressBar indeterminate />\n *\n * // Custom styling\n * <ProgressBar progress={60} width={30} filledChar=\"\u2593\" emptyChar=\"\u2591\" />\n * ```\n */\nexport function ProgressBar({\n  progress,\n  width = 20,\n  showPercent = true,\n  label,\n  indeterminate = false,\n  filledChar = '\u2588',\n  emptyChar = '\u2591',\n  filledColor,\n  emptyColor,\n}: ProgressBarProps): React.ReactElement {\n  const theme = getTheme()\n  const startTimeRef = useRef(Date.now())\n\n  // Use unified animation manager for indeterminate mode\n  // spinnerFrameCount = width * 2 for bouncing animation\n  const { spinnerFrame } = useUnifiedAnimation({\n    enabled: indeterminate,\n    startTime: startTimeRef.current,\n    spinnerFrameCount: width * 2,\n    componentId: 'progress-bar',\n  })\n\n  // Calculate bar segments\n  const clampedProgress = Math.max(0, Math.min(100, progress))\n\n  if (indeterminate) {\n    // Indeterminate mode: bouncing segment\n    const segmentWidth = Math.ceil(width / 4)\n    const effectivePos =\n      spinnerFrame < width\n        ? spinnerFrame\n        : width * 2 - spinnerFrame - segmentWidth\n\n    const beforeSegment = Math.max(0, effectivePos)\n    const afterSegment = Math.max(0, width - effectivePos - segmentWidth)\n\n    return (\n      <Box flexDirection=\"row\">\n        {label && <Text color={theme.secondaryText}>{label} </Text>}\n        <Text color={emptyColor || theme.dimmedText}>\n          {emptyChar.repeat(beforeSegment)}\n        </Text>\n        <Text color={filledColor || theme.minto}>\n          {filledChar.repeat(Math.min(segmentWidth, width - beforeSegment))}\n        </Text>\n        <Text color={emptyColor || theme.dimmedText}>\n          {emptyChar.repeat(afterSegment)}\n        </Text>\n      </Box>\n    )\n  }\n\n  // Determinate mode: fixed progress bar\n  const filled = Math.round((clampedProgress / 100) * width)\n  const empty = width - filled\n\n  return (\n    <Box flexDirection=\"row\">\n      {label && <Text color={theme.secondaryText}>{label} </Text>}\n      <Text color={filledColor || theme.success}>\n        {filledChar.repeat(filled)}\n      </Text>\n      <Text color={emptyColor || theme.dimmedText}>\n        {emptyChar.repeat(empty)}\n      </Text>\n      {showPercent && (\n        <Text color={theme.secondaryText}> {Math.round(clampedProgress)}%</Text>\n      )}\n    </Box>\n  )\n}\n\n/**\n * Compact progress indicator for inline use\n * Shows just percentage or a small visual indicator\n */\nexport function ProgressIndicator({\n  progress,\n  showText = true,\n}: {\n  progress: number\n  showText?: boolean\n}): React.ReactElement {\n  const theme = getTheme()\n  const clampedProgress = Math.max(0, Math.min(100, progress))\n\n  // Visual indicator based on progress ranges\n  const getIndicator = () => {\n    if (clampedProgress < 25) return '\u25CB'\n    if (clampedProgress < 50) return '\u25D4'\n    if (clampedProgress < 75) return '\u25D1'\n    if (clampedProgress < 100) return '\u25D5'\n    return '\u25CF'\n  }\n\n  return (\n    <Box flexDirection=\"row\">\n      <Text color={theme.minto}>{getIndicator()}</Text>\n      {showText && (\n        <Text color={theme.secondaryText}> {Math.round(clampedProgress)}%</Text>\n      )}\n    </Box>\n  )\n}\n\n/**\n * Step progress indicator for multi-step operations\n *\n * Usage:\n * ```tsx\n * <StepProgress current={2} total={5} labels={['Parse', 'Analyze', 'Transform', 'Generate', 'Complete']} />\n * ```\n */\nexport function StepProgress({\n  current,\n  total,\n  labels,\n  showLabels = true,\n}: {\n  current: number\n  total: number\n  labels?: string[]\n  showLabels?: boolean\n}): React.ReactElement {\n  const theme = getTheme()\n\n  return (\n    <Box flexDirection=\"row\" gap={1}>\n      {Array.from({ length: total }, (_, i) => {\n        const stepNum = i + 1\n        const isComplete = stepNum < current\n        const isCurrent = stepNum === current\n        const label = labels?.[i]\n\n        const color = isComplete\n          ? theme.success\n          : isCurrent\n            ? theme.minto\n            : theme.dimmedText\n\n        const symbol = isComplete ? '\u25CF' : isCurrent ? '\u25D0' : '\u25CB'\n\n        return (\n          <Box key={i} flexDirection=\"row\">\n            <Text color={color}>{symbol}</Text>\n            {showLabels && label && <Text color={color}> {label}</Text>}\n            {i < total - 1 && <Text color={theme.dimmedText}> \u2192 </Text>}\n          </Box>\n        )\n      })}\n    </Box>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}