ccstatusline 2.1.5 → 2.1.6

package/README.md

@@ -46,7 +46,7 @@
 
 ## 🆕 Recent Updates
 
-### v2.1.0 - v2.1.4 - Usage widgets, links, new git insertions / deletions widgets, and reliability fixes
+### v2.1.0 - v2.1.6 - Usage widgets, links, new git insertions / deletions widgets, and reliability fixes
 
 - **🧩 New Usage widgets (v2.1.0)** - Added **Session Usage**, **Weekly Usage**, **Reset Timer**, and **Context Bar** widgets.
 - **📊 More accurate counts (v2.1.0)** - Usage/context widgets now use new statusline JSON metrics when available for more accurate token and context counts.
@@ -54,6 +54,7 @@
 - **🔗 New Link widget (v2.1.3)** - Added a new **Link** widget with clickable OSC8 rendering, preview parity, and raw mode support.
 - **➕ New Git Insertions widget (v2.1.4)** - Added a dedicated Git widget that shows only uncommitted insertions (e.g., `+42`).
 - **➖ New Git Deletions widget (v2.1.4)** - Added a dedicated Git widget that shows only uncommitted deletions (e.g., `-10`).
+- **🧠 Context format fallback fix (v2.1.6)** - When `context_window_size` is missing, context widgets now infer 1M models from long-context labels such as `[1m]` and `1M context` in model identifiers.
 
 ### v2.0.26 - v2.0.29 - Performance, git internals, and workflow improvements
 
@@ -434,8 +435,8 @@ bun run example
 - **Tokens Cached** - Shows cached tokens used
 - **Tokens Total** - Shows total tokens used
 - **Context Length** - Shows current context length in tokens
-- **Context Percentage** - Shows percentage of context limit used (dynamic: 1M for model IDs with `[1m]` suffix, 200k otherwise)
-- **Context Percentage (usable)** - Shows percentage of usable context (dynamic: 800k for model IDs with `[1m]` suffix, 160k otherwise, accounting for auto-compact at 80%)
+- **Context Percentage** - Shows percentage of context limit used (dynamic: 1M for model IDs with long-context labels like `[1m]` or `1M context`, 200k otherwise)
+- **Context Percentage (usable)** - Shows percentage of usable context (dynamic: 800k for model IDs with long-context labels like `[1m]` or `1M context`, 160k otherwise, accounting for auto-compact at 80%)
 - **Context Bar** - Shows context usage as a progress bar with short/full display modes
 - **Terminal Width** - Shows detected terminal width (for debugging)
 - **Memory Usage** - Shows system memory usage (used/total, e.g., "Mem: 12.4G/16.0G")

package/dist/ccstatusline.js

@@ -51478,7 +51478,7 @@ import { execSync as execSync3 } from "child_process";
 import * as fs5 from "fs";
 import * as path4 from "path";
 var __dirname = "/Users/sirmalloc/Projects/Personal/ccstatusline/src/utils";
-var PACKAGE_VERSION = "2.1.5";
+var PACKAGE_VERSION = "2.1.6";
 function getPackageVersion() {
   if (/^\d+\.\d+\.\d+/.test(PACKAGE_VERSION)) {
     return PACKAGE_VERSION;
@@ -53032,30 +53032,77 @@ function truncateStyledText(text, maxWidth, options = {}) {
 }
 
 // src/utils/model-context.ts
+var DEFAULT_CONTEXT_WINDOW_SIZE = 200000;
+var USABLE_CONTEXT_RATIO = 0.8;
 function toValidWindowSize(value) {
   if (typeof value !== "number" || !Number.isFinite(value) || value <= 0) {
     return null;
   }
   return value;
 }
-function getContextConfig(modelId, contextWindowSize) {
+function parseContextWindowSize(modelIdentifier) {
+  const delimitedMatch = /(?:\(|\[)\s*(\d+(?:[,_]\d+)*(?:\.\d+)?)\s*([km])\s*(?:\)|\])/i.exec(modelIdentifier);
+  if (delimitedMatch) {
+    const delimitedValue = delimitedMatch[1];
+    const delimitedUnit = delimitedMatch[2];
+    if (!delimitedValue || !delimitedUnit) {
+      return null;
+    }
+    const parsed2 = Number.parseFloat(delimitedValue.replace(/[,_]/g, ""));
+    if (Number.isFinite(parsed2) && parsed2 > 0) {
+      return Math.round(parsed2 * (delimitedUnit.toLowerCase() === "m" ? 1e6 : 1000));
+    }
+  }
+  const contextMatch = /\b(\d+(?:[,_]\d+)*(?:\.\d+)?)\s*([km])(?:\s*(?:token\s*)?context)?\b/i.exec(modelIdentifier);
+  if (!contextMatch) {
+    return null;
+  }
+  const contextValue = contextMatch[1];
+  const contextUnit = contextMatch[2];
+  if (!contextValue || !contextUnit) {
+    return null;
+  }
+  const parsed = Number.parseFloat(contextValue.replace(/[,_]/g, ""));
+  if (!Number.isFinite(parsed) || parsed <= 0) {
+    return null;
+  }
+  return Math.round(parsed * (contextUnit.toLowerCase() === "m" ? 1e6 : 1000));
+}
+function getModelContextIdentifier(model) {
+  if (typeof model === "string") {
+    const trimmed = model.trim();
+    return trimmed.length > 0 ? trimmed : undefined;
+  }
+  if (!model) {
+    return;
+  }
+  const id = model.id?.trim();
+  const displayName = model.display_name?.trim();
+  if (id && displayName) {
+    return `${id} ${displayName}`;
+  }
+  return id ?? displayName;
+}
+function getContextConfig(modelIdentifier, contextWindowSize) {
   const statusWindowSize = toValidWindowSize(contextWindowSize);
   if (statusWindowSize !== null) {
     return {
       maxTokens: statusWindowSize,
-      usableTokens: Math.floor(statusWindowSize * 0.8)
+      usableTokens: Math.floor(statusWindowSize * USABLE_CONTEXT_RATIO)
     };
   }
   const defaultConfig = {
-    maxTokens: 200000,
-    usableTokens: 160000
+    maxTokens: DEFAULT_CONTEXT_WINDOW_SIZE,
+    usableTokens: Math.floor(DEFAULT_CONTEXT_WINDOW_SIZE * USABLE_CONTEXT_RATIO)
   };
-  if (!modelId)
+  if (!modelIdentifier) {
     return defaultConfig;
-  if (modelId.toLowerCase().includes("[1m]")) {
+  }
+  const inferredWindowSize = parseContextWindowSize(modelIdentifier);
+  if (inferredWindowSize !== null) {
     return {
-      maxTokens: 1e6,
-      usableTokens: 800000
+      maxTokens: inferredWindowSize,
+      usableTokens: Math.floor(inferredWindowSize * USABLE_CONTEXT_RATIO)
     };
   }
   return defaultConfig;
@@ -53070,9 +53117,8 @@ function calculateContextPercentage(context) {
   if (!context.tokenMetrics) {
     return 0;
   }
-  const model = context.data?.model;
-  const modelId = typeof model === "string" ? model : model?.id;
-  const contextConfig = getContextConfig(modelId, contextWindowMetrics.windowSize);
+  const modelIdentifier = getModelContextIdentifier(context.data?.model);
+  const contextConfig = getContextConfig(modelIdentifier, contextWindowMetrics.windowSize);
   return Math.min(100, context.tokenMetrics.contextLength / contextConfig.maxTokens * 100);
 }
 
@@ -53880,9 +53926,8 @@ class ContextPercentageWidget {
       return formatRawOrLabeledValue(item, "Ctx: ", `${displayPercentage.toFixed(1)}%`);
     }
     if (context.tokenMetrics) {
-      const model = context.data?.model;
-      const modelId = typeof model === "string" ? model : model?.id;
-      const contextConfig = getContextConfig(modelId, contextWindowMetrics.windowSize);
+      const modelIdentifier = getModelContextIdentifier(context.data?.model);
+      const contextConfig = getContextConfig(modelIdentifier, contextWindowMetrics.windowSize);
       const usedPercentage = Math.min(100, context.tokenMetrics.contextLength / contextConfig.maxTokens * 100);
       const displayPercentage = isInverse ? 100 - usedPercentage : usedPercentage;
       return formatRawOrLabeledValue(item, "Ctx: ", `${displayPercentage.toFixed(1)}%`);
@@ -53926,10 +53971,9 @@ class ContextPercentageUsableWidget {
   }
   render(item, context, settings) {
     const isInverse = isContextInverse(item);
-    const model = context.data?.model;
-    const modelId = typeof model === "string" ? model : model?.id;
+    const modelIdentifier = getModelContextIdentifier(context.data?.model);
     const contextWindowMetrics = getContextWindowMetrics(context.data);
-    const contextConfig = getContextConfig(modelId, contextWindowMetrics.windowSize);
+    const contextConfig = getContextConfig(modelIdentifier, contextWindowMetrics.windowSize);
     if (context.isPreview) {
       const previewValue = isInverse ? "88.4%" : "11.6%";
       return formatRawOrLabeledValue(item, "Ctx(u): ", previewValue);
@@ -56784,9 +56828,8 @@ class ContextBarWidget {
       used = context.tokenMetrics.contextLength;
     }
     if (total === null && context.tokenMetrics) {
-      const model = context.data?.model;
-      const modelId = typeof model === "string" ? model : model?.id;
-      total = getContextConfig(modelId).maxTokens;
+      const modelIdentifier = getModelContextIdentifier(context.data?.model);
+      total = getContextConfig(modelIdentifier).maxTokens;
     }
     if (used === null || total === null || total <= 0) {
       return null;
@@ -57204,6 +57247,111 @@ var ConfirmDialog = ({ message, onConfirm, onCancel, inline = false }) => {
   }, undefined, true, undefined, this);
 };
 
+// src/tui/components/color-menu/mutations.ts
+function updateWidgetById(widgets, widgetId, updater) {
+  return widgets.map((widget) => widget.id === widgetId ? updater(widget) : widget);
+}
+function setWidgetColor(widgets, widgetId, color, editingBackground) {
+  return updateWidgetById(widgets, widgetId, (widget) => {
+    if (editingBackground) {
+      return {
+        ...widget,
+        backgroundColor: color
+      };
+    }
+    return {
+      ...widget,
+      color
+    };
+  });
+}
+function toggleWidgetBold(widgets, widgetId) {
+  return updateWidgetById(widgets, widgetId, (widget) => ({
+    ...widget,
+    bold: !widget.bold
+  }));
+}
+function resetWidgetStyling(widgets, widgetId) {
+  return updateWidgetById(widgets, widgetId, (widget) => {
+    const {
+      color,
+      backgroundColor,
+      bold,
+      ...restWidget
+    } = widget;
+    return restWidget;
+  });
+}
+function clearAllWidgetStyling(widgets) {
+  return widgets.map((widget) => {
+    const {
+      color,
+      backgroundColor,
+      bold,
+      ...restWidget
+    } = widget;
+    return restWidget;
+  });
+}
+function getDefaultForegroundColor(widget) {
+  if (widget.type === "separator" || widget.type === "flex-separator") {
+    return "white";
+  }
+  const widgetImpl = getWidget(widget.type);
+  return widgetImpl ? widgetImpl.getDefaultColor() : "white";
+}
+function getNextIndex(currentIndex, length, direction) {
+  if (direction === "right") {
+    return (currentIndex + 1) % length;
+  }
+  return currentIndex === 0 ? length - 1 : currentIndex - 1;
+}
+function cycleWidgetColor({
+  widgets,
+  widgetId,
+  direction,
+  editingBackground,
+  colors,
+  backgroundColors
+}) {
+  return updateWidgetById(widgets, widgetId, (widget) => {
+    if (editingBackground) {
+      if (backgroundColors.length === 0) {
+        return widget;
+      }
+      const currentBgColor = widget.backgroundColor ?? "";
+      let currentBgColorIndex = backgroundColors.indexOf(currentBgColor);
+      if (currentBgColorIndex === -1) {
+        currentBgColorIndex = 0;
+      }
+      const nextBgColorIndex = getNextIndex(currentBgColorIndex, backgroundColors.length, direction);
+      const nextBgColor = backgroundColors[nextBgColorIndex];
+      return {
+        ...widget,
+        backgroundColor: nextBgColor === "" ? undefined : nextBgColor
+      };
+    }
+    if (colors.length === 0) {
+      return widget;
+    }
+    const defaultColor = getDefaultForegroundColor(widget);
+    let currentColor = widget.color ?? defaultColor;
+    if (currentColor === "dim") {
+      currentColor = defaultColor;
+    }
+    let currentColorIndex = colors.indexOf(currentColor);
+    if (currentColorIndex === -1) {
+      currentColorIndex = 0;
+    }
+    const nextColorIndex = getNextIndex(currentColorIndex, colors.length, direction);
+    const nextColor = colors[nextColorIndex];
+    return {
+      ...widget,
+      color: nextColor
+    };
+  });
+}
+
 // src/tui/components/ColorMenu.tsx
 var jsx_dev_runtime6 = __toESM(require_jsx_dev_runtime(), 1);
 var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
@@ -57244,16 +57392,7 @@ var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
           const hexColor = `hex:${hexInput}`;
           const selectedWidget2 = colorableWidgets.find((widget) => widget.id === highlightedItemId);
           if (selectedWidget2) {
-            const newItems = widgets.map((widget) => {
-              if (widget.id === highlightedItemId) {
-                if (editingBackground) {
-                  return { ...widget, backgroundColor: hexColor };
-                } else {
-                  return { ...widget, color: hexColor };
-                }
-              }
-              return widget;
-            });
+            const newItems = setWidgetColor(widgets, selectedWidget2.id, hexColor, editingBackground);
             onUpdate(newItems);
           }
           setHexInputMode(false);
@@ -57282,16 +57421,7 @@ var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
           const ansiColor = `ansi256:${code}`;
           const selectedWidget2 = colorableWidgets.find((widget) => widget.id === highlightedItemId);
           if (selectedWidget2) {
-            const newItems = widgets.map((widget) => {
-              if (widget.id === highlightedItemId) {
-                if (editingBackground) {
-                  return { ...widget, backgroundColor: ansiColor };
-                } else {
-                  return { ...widget, color: ansiColor };
-                }
-              }
-              return widget;
-            });
+            const newItems = setWidgetColor(widgets, selectedWidget2.id, ansiColor, editingBackground);
             onUpdate(newItems);
             setAnsi256InputMode(false);
             setAnsi256Input("");
@@ -57341,12 +57471,7 @@ var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
       if (highlightedItemId && highlightedItemId !== "back") {
         const selectedWidget2 = colorableWidgets.find((widget) => widget.id === highlightedItemId);
         if (selectedWidget2) {
-          const newItems = widgets.map((widget) => {
-            if (widget.id === selectedWidget2.id) {
-              return { ...widget, bold: !widget.bold };
-            }
-            return widget;
-          });
+          const newItems = toggleWidgetBold(widgets, selectedWidget2.id);
           onUpdate(newItems);
         }
       }
@@ -57354,13 +57479,7 @@ var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
       if (highlightedItemId && highlightedItemId !== "back") {
         const selectedWidget2 = colorableWidgets.find((widget) => widget.id === highlightedItemId);
         if (selectedWidget2) {
-          const newItems = widgets.map((widget) => {
-            if (widget.id === selectedWidget2.id) {
-              const { color, backgroundColor, bold, ...restWidget } = widget;
-              return restWidget;
-            }
-            return widget;
-          });
+          const newItems = resetWidgetStyling(widgets, selectedWidget2.id);
           onUpdate(newItems);
         }
       }
@@ -57370,47 +57489,13 @@ var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
       if (highlightedItemId && highlightedItemId !== "back") {
         const selectedWidget2 = colorableWidgets.find((widget) => widget.id === highlightedItemId);
         if (selectedWidget2) {
-          const newItems = widgets.map((widget) => {
-            if (widget.id === selectedWidget2.id) {
-              if (editingBackground) {
-                const currentBgColor = widget.backgroundColor ?? "";
-                let currentBgColorIndex = bgColors.indexOf(currentBgColor);
-                if (currentBgColorIndex === -1)
-                  currentBgColorIndex = 0;
-                let nextBgColorIndex;
-                if (key.rightArrow) {
-                  nextBgColorIndex = (currentBgColorIndex + 1) % bgColors.length;
-                } else {
-                  nextBgColorIndex = currentBgColorIndex === 0 ? bgColors.length - 1 : currentBgColorIndex - 1;
-                }
-                const nextBgColor = bgColors[nextBgColorIndex];
-                return { ...widget, backgroundColor: nextBgColor === "" ? undefined : nextBgColor };
-              } else {
-                let defaultColor = "white";
-                if (widget.type !== "separator" && widget.type !== "flex-separator") {
-                  const widgetImpl = getWidget(widget.type);
-                  if (widgetImpl) {
-                    defaultColor = widgetImpl.getDefaultColor();
-                  }
-                }
-                let currentColor2 = widget.color ?? defaultColor;
-                if (currentColor2 === "dim") {
-                  currentColor2 = defaultColor;
-                }
-                let currentColorIndex = colors.indexOf(currentColor2);
-                if (currentColorIndex === -1)
-                  currentColorIndex = 0;
-                let nextColorIndex;
-                if (key.rightArrow) {
-                  nextColorIndex = (currentColorIndex + 1) % colors.length;
-                } else {
-                  nextColorIndex = currentColorIndex === 0 ? colors.length - 1 : currentColorIndex - 1;
-                }
-                const nextColor = colors[nextColorIndex];
-                return { ...widget, color: nextColor };
-              }
-            }
-            return widget;
+          const newItems = cycleWidgetColor({
+            widgets,
+            widgetId: selectedWidget2.id,
+            direction: key.rightArrow ? "right" : "left",
+            editingBackground,
+            colors,
+            backgroundColors: bgColors
           });
           onUpdate(newItems);
         }
@@ -57566,10 +57651,7 @@ var ColorMenu = ({ widgets, lineIndex, settings, onUpdate, onBack }) => {
           children: /* @__PURE__ */ jsx_dev_runtime6.jsxDEV(ConfirmDialog, {
             inline: true,
             onConfirm: () => {
-              const newItems = widgets.map((widget) => {
-                const { color, backgroundColor, bold, ...restWidget } = widget;
-                return restWidget;
-              });
+              const newItems = clearAllWidgetStyling(widgets);
               onUpdate(newItems);
               setShowClearConfirm(false);
             },
@@ -58257,6 +58339,317 @@ var InstallMenu = ({
 };
 // src/tui/components/ItemsEditor.tsx
 var import_react37 = __toESM(require_react(), 1);
+
+// src/tui/components/items-editor/input-handlers.ts
+function setPickerState(setWidgetPicker, normalizeState, updater) {
+  setWidgetPicker((prev) => {
+    if (!prev) {
+      return prev;
+    }
+    return normalizeState(updater(prev));
+  });
+}
+function getPickerCategories(widgetCategories) {
+  return [...widgetCategories];
+}
+function normalizePickerState(state, widgetCatalog, widgetCategories) {
+  const filteredCategories = getPickerCategories(widgetCategories);
+  const selectedCategory = state.selectedCategory && filteredCategories.includes(state.selectedCategory) ? state.selectedCategory : filteredCategories[0] ?? null;
+  const hasTopLevelSearch = state.level === "category" && state.categoryQuery.trim().length > 0;
+  const effectiveCategory = hasTopLevelSearch ? "All" : selectedCategory ?? "All";
+  const effectiveQuery = hasTopLevelSearch ? state.categoryQuery : state.widgetQuery;
+  const filteredWidgets = filterWidgetCatalog(widgetCatalog, effectiveCategory, effectiveQuery);
+  const hasSelectedType = state.selectedType ? filteredWidgets.some((entry) => entry.type === state.selectedType) : false;
+  return {
+    ...state,
+    selectedCategory,
+    selectedType: hasSelectedType ? state.selectedType : filteredWidgets[0]?.type ?? null
+  };
+}
+function getPickerViewState(widgetPicker, widgetCatalog, widgetCategories) {
+  const filteredCategories = getPickerCategories(widgetCategories);
+  const selectedCategory = widgetPicker.selectedCategory && filteredCategories.includes(widgetPicker.selectedCategory) ? widgetPicker.selectedCategory : filteredCategories[0] ?? null;
+  const hasTopLevelSearch = widgetPicker.level === "category" && widgetPicker.categoryQuery.trim().length > 0;
+  const topLevelSearchEntries = hasTopLevelSearch ? filterWidgetCatalog(widgetCatalog, "All", widgetPicker.categoryQuery) : [];
+  const topLevelSelectedEntry = topLevelSearchEntries.find((entry) => entry.type === widgetPicker.selectedType) ?? topLevelSearchEntries[0];
+  const filteredWidgets = filterWidgetCatalog(widgetCatalog, selectedCategory ?? "All", widgetPicker.widgetQuery);
+  const selectedEntry = filteredWidgets.find((entry) => entry.type === widgetPicker.selectedType) ?? filteredWidgets[0];
+  return {
+    filteredCategories,
+    selectedCategory,
+    hasTopLevelSearch,
+    topLevelSearchEntries,
+    topLevelSelectedEntry,
+    filteredWidgets,
+    selectedEntry
+  };
+}
+function handlePickerInputMode({
+  input,
+  key,
+  widgetPicker,
+  widgetCatalog,
+  widgetCategories,
+  setWidgetPicker,
+  applyWidgetPickerSelection
+}) {
+  const normalizeState = (state) => normalizePickerState(state, widgetCatalog, widgetCategories);
+  const {
+    filteredCategories,
+    selectedCategory,
+    hasTopLevelSearch,
+    topLevelSearchEntries,
+    topLevelSelectedEntry,
+    filteredWidgets,
+    selectedEntry
+  } = getPickerViewState(widgetPicker, widgetCatalog, widgetCategories);
+  if (widgetPicker.level === "category") {
+    if (key.escape) {
+      if (widgetPicker.categoryQuery.length > 0) {
+        setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+          ...prev,
+          categoryQuery: ""
+        }));
+      } else {
+        setWidgetPicker(null);
+      }
+    } else if (key.return) {
+      if (hasTopLevelSearch) {
+        if (topLevelSelectedEntry) {
+          applyWidgetPickerSelection(topLevelSelectedEntry.type);
+        }
+      } else if (selectedCategory) {
+        setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+          ...prev,
+          level: "widget",
+          selectedCategory
+        }));
+      }
+    } else if (key.upArrow || key.downArrow) {
+      if (hasTopLevelSearch) {
+        if (topLevelSearchEntries.length === 0) {
+          return;
+        }
+        let currentIndex = topLevelSearchEntries.findIndex((entry) => entry.type === widgetPicker.selectedType);
+        if (currentIndex === -1) {
+          currentIndex = 0;
+        }
+        const nextIndex = key.downArrow ? Math.min(topLevelSearchEntries.length - 1, currentIndex + 1) : Math.max(0, currentIndex - 1);
+        const nextType = topLevelSearchEntries[nextIndex]?.type ?? null;
+        setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+          ...prev,
+          selectedType: nextType
+        }));
+      } else {
+        if (filteredCategories.length === 0) {
+          return;
+        }
+        let currentIndex = filteredCategories.findIndex((category) => category === selectedCategory);
+        if (currentIndex === -1) {
+          currentIndex = 0;
+        }
+        const nextIndex = key.downArrow ? Math.min(filteredCategories.length - 1, currentIndex + 1) : Math.max(0, currentIndex - 1);
+        const nextCategory = filteredCategories[nextIndex] ?? null;
+        setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+          ...prev,
+          selectedCategory: nextCategory
+        }));
+      }
+    } else if (key.backspace || key.delete) {
+      setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+        ...prev,
+        categoryQuery: prev.categoryQuery.slice(0, -1)
+      }));
+    } else if (input && !key.ctrl && !key.meta && !key.tab) {
+      setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+        ...prev,
+        categoryQuery: prev.categoryQuery + input
+      }));
+    }
+  } else {
+    if (key.escape) {
+      if (widgetPicker.widgetQuery.length > 0) {
+        setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+          ...prev,
+          widgetQuery: ""
+        }));
+      } else {
+        setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+          ...prev,
+          level: "category"
+        }));
+      }
+    } else if (key.return) {
+      if (selectedEntry) {
+        applyWidgetPickerSelection(selectedEntry.type);
+      }
+    } else if (key.upArrow || key.downArrow) {
+      if (filteredWidgets.length === 0) {
+        return;
+      }
+      let currentIndex = filteredWidgets.findIndex((entry) => entry.type === widgetPicker.selectedType);
+      if (currentIndex === -1) {
+        currentIndex = 0;
+      }
+      const nextIndex = key.downArrow ? Math.min(filteredWidgets.length - 1, currentIndex + 1) : Math.max(0, currentIndex - 1);
+      const nextType = filteredWidgets[nextIndex]?.type ?? null;
+      setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+        ...prev,
+        selectedType: nextType
+      }));
+    } else if (key.backspace || key.delete) {
+      setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+        ...prev,
+        widgetQuery: prev.widgetQuery.slice(0, -1)
+      }));
+    } else if (input && !key.ctrl && !key.meta && !key.tab) {
+      setPickerState(setWidgetPicker, normalizeState, (prev) => ({
+        ...prev,
+        widgetQuery: prev.widgetQuery + input
+      }));
+    }
+  }
+}
+function handleMoveInputMode({
+  key,
+  widgets,
+  selectedIndex,
+  onUpdate,
+  setSelectedIndex,
+  setMoveMode
+}) {
+  if (key.upArrow && selectedIndex > 0) {
+    const newWidgets = [...widgets];
+    const temp = newWidgets[selectedIndex];
+    const prev = newWidgets[selectedIndex - 1];
+    if (temp && prev) {
+      [newWidgets[selectedIndex], newWidgets[selectedIndex - 1]] = [prev, temp];
+    }
+    onUpdate(newWidgets);
+    setSelectedIndex(selectedIndex - 1);
+  } else if (key.downArrow && selectedIndex < widgets.length - 1) {
+    const newWidgets = [...widgets];
+    const temp = newWidgets[selectedIndex];
+    const next = newWidgets[selectedIndex + 1];
+    if (temp && next) {
+      [newWidgets[selectedIndex], newWidgets[selectedIndex + 1]] = [next, temp];
+    }
+    onUpdate(newWidgets);
+    setSelectedIndex(selectedIndex + 1);
+  } else if (key.escape || key.return) {
+    setMoveMode(false);
+  }
+}
+function handleNormalInputMode({
+  input,
+  key,
+  widgets,
+  selectedIndex,
+  separatorChars,
+  onBack,
+  onUpdate,
+  setSelectedIndex,
+  setMoveMode,
+  setShowClearConfirm,
+  openWidgetPicker,
+  getVisibleCustomKeybinds,
+  setCustomEditorWidget
+}) {
+  if (key.upArrow && widgets.length > 0) {
+    setSelectedIndex(Math.max(0, selectedIndex - 1));
+  } else if (key.downArrow && widgets.length > 0) {
+    setSelectedIndex(Math.min(widgets.length - 1, selectedIndex + 1));
+  } else if (key.leftArrow && widgets.length > 0) {
+    openWidgetPicker("change");
+  } else if (key.rightArrow && widgets.length > 0) {
+    openWidgetPicker("change");
+  } else if (key.return && widgets.length > 0) {
+    setMoveMode(true);
+  } else if (input === "a") {
+    openWidgetPicker("add");
+  } else if (input === "i") {
+    openWidgetPicker("insert");
+  } else if (input === "d" && widgets.length > 0) {
+    const newWidgets = widgets.filter((_, i) => i !== selectedIndex);
+    onUpdate(newWidgets);
+    if (selectedIndex >= newWidgets.length && selectedIndex > 0) {
+      setSelectedIndex(selectedIndex - 1);
+    }
+  } else if (input === "c") {
+    if (widgets.length > 0) {
+      setShowClearConfirm(true);
+    }
+  } else if (input === " " && widgets.length > 0) {
+    const currentWidget = widgets[selectedIndex];
+    if (currentWidget && currentWidget.type === "separator") {
+      const currentChar = currentWidget.character ?? "|";
+      const currentCharIndex = separatorChars.indexOf(currentChar);
+      const nextChar = separatorChars[(currentCharIndex + 1) % separatorChars.length];
+      const newWidgets = [...widgets];
+      newWidgets[selectedIndex] = { ...currentWidget, character: nextChar };
+      onUpdate(newWidgets);
+    }
+  } else if (input === "r" && widgets.length > 0) {
+    const currentWidget = widgets[selectedIndex];
+    if (currentWidget && currentWidget.type !== "separator" && currentWidget.type !== "flex-separator") {
+      const widgetImpl = getWidget(currentWidget.type);
+      if (!widgetImpl?.supportsRawValue()) {
+        return;
+      }
+      const newWidgets = [...widgets];
+      newWidgets[selectedIndex] = { ...currentWidget, rawValue: !currentWidget.rawValue };
+      onUpdate(newWidgets);
+    }
+  } else if (input === "m" && widgets.length > 0) {
+    const currentWidget = widgets[selectedIndex];
+    if (currentWidget && selectedIndex < widgets.length - 1 && currentWidget.type !== "separator" && currentWidget.type !== "flex-separator") {
+      const newWidgets = [...widgets];
+      let nextMergeState;
+      if (currentWidget.merge === undefined) {
+        nextMergeState = true;
+      } else if (currentWidget.merge === true) {
+        nextMergeState = "no-padding";
+      } else {
+        nextMergeState = undefined;
+      }
+      if (nextMergeState === undefined) {
+        const { merge: merge2, ...rest } = currentWidget;
+        newWidgets[selectedIndex] = rest;
+      } else {
+        newWidgets[selectedIndex] = { ...currentWidget, merge: nextMergeState };
+      }
+      onUpdate(newWidgets);
+    }
+  } else if (key.escape) {
+    onBack();
+  } else if (widgets.length > 0) {
+    const currentWidget = widgets[selectedIndex];
+    if (currentWidget && currentWidget.type !== "separator" && currentWidget.type !== "flex-separator") {
+      const widgetImpl = getWidget(currentWidget.type);
+      if (!widgetImpl?.getCustomKeybinds) {
+        return;
+      }
+      const customKeybinds = getVisibleCustomKeybinds(widgetImpl, currentWidget);
+      const matchedKeybind = customKeybinds.find((kb) => kb.key === input);
+      if (matchedKeybind && !key.ctrl) {
+        if (widgetImpl.handleEditorAction) {
+          const updatedWidget = widgetImpl.handleEditorAction(matchedKeybind.action, currentWidget);
+          if (updatedWidget) {
+            const newWidgets = [...widgets];
+            newWidgets[selectedIndex] = updatedWidget;
+            onUpdate(newWidgets);
+          } else if (widgetImpl.renderEditor) {
+            setCustomEditorWidget({ widget: currentWidget, impl: widgetImpl, action: matchedKeybind.action });
+          }
+        } else if (widgetImpl.renderEditor) {
+          setCustomEditorWidget({ widget: currentWidget, impl: widgetImpl, action: matchedKeybind.action });
+        }
+      }
+    }
+  }
+}
+
+// src/tui/components/ItemsEditor.tsx
 var jsx_dev_runtime9 = __toESM(require_jsx_dev_runtime(), 1);
 var ItemsEditor = ({ widgets, onUpdate, onBack, lineNumber, settings }) => {
   const [selectedIndex, setSelectedIndex] = import_react37.useState(0);
@@ -58292,23 +58685,6 @@ var ItemsEditor = ({ widgets, onUpdate, onBack, lineNumber, settings }) => {
   const handleEditorCancel = () => {
     setCustomEditorWidget(null);
   };
-  const getFilteredCategories = (query) => {
-    return [...widgetCategories];
-  };
-  const normalizePickerState = (state) => {
-    const filteredCategories = getFilteredCategories(state.categoryQuery);
-    const selectedCategory = state.selectedCategory && filteredCategories.includes(state.selectedCategory) ? state.selectedCategory : filteredCategories[0] ?? null;
-    const hasTopLevelSearch = state.level === "category" && state.categoryQuery.trim().length > 0;
-    const effectiveCategory = hasTopLevelSearch ? "All" : selectedCategory ?? "All";
-    const effectiveQuery = hasTopLevelSearch ? state.categoryQuery : state.widgetQuery;
-    const filteredWidgets = filterWidgetCatalog(widgetCatalog, effectiveCategory, effectiveQuery);
-    const hasSelectedType = state.selectedType ? filteredWidgets.some((entry) => entry.type === state.selectedType) : false;
-    return {
-      ...state,
-      selectedCategory,
-      selectedType: hasSelectedType ? state.selectedType : filteredWidgets[0]?.type ?? null
-    };
-  };
   const shouldShowCustomKeybind = (widget, keybind) => {
     if (keybind.action !== "toggle-invert") {
       return true;
@@ -58335,7 +58711,7 @@ var ItemsEditor = ({ widgets, onUpdate, onBack, lineNumber, settings }) => {
       categoryQuery: "",
       widgetQuery: "",
       selectedType
-    }));
+    }, widgetCatalog, widgetCategories));
   };
   const applyWidgetPickerSelection = (selectedType) => {
     if (!widgetPicker) {
@@ -58371,238 +58747,43 @@ var ItemsEditor = ({ widgets, onUpdate, onBack, lineNumber, settings }) => {
       return;
     }
     if (widgetPicker) {
-      const filteredCategories = getFilteredCategories(widgetPicker.categoryQuery);
-      const selectedCategory = widgetPicker.selectedCategory && filteredCategories.includes(widgetPicker.selectedCategory) ? widgetPicker.selectedCategory : filteredCategories[0] ?? null;
-      const hasTopLevelSearch = widgetPicker.level === "category" && widgetPicker.categoryQuery.trim().length > 0;
-      const topLevelSearchEntries2 = hasTopLevelSearch ? filterWidgetCatalog(widgetCatalog, "All", widgetPicker.categoryQuery) : [];
-      const topLevelSelectedEntry = topLevelSearchEntries2.find((entry) => entry.type === widgetPicker.selectedType) ?? topLevelSearchEntries2[0];
-      const filteredWidgets = filterWidgetCatalog(widgetCatalog, selectedCategory ?? "All", widgetPicker.widgetQuery);
-      const selectedEntry = filteredWidgets.find((entry) => entry.type === widgetPicker.selectedType) ?? filteredWidgets[0];
-      if (widgetPicker.level === "category") {
-        if (key.escape) {
-          if (widgetPicker.categoryQuery.length > 0) {
-            setWidgetPicker((prev) => prev ? normalizePickerState({
-              ...prev,
-              categoryQuery: ""
-            }) : prev);
-          } else {
-            setWidgetPicker(null);
-          }
-        } else if (key.return) {
-          if (hasTopLevelSearch) {
-            if (topLevelSelectedEntry) {
-              applyWidgetPickerSelection(topLevelSelectedEntry.type);
-            }
-          } else if (selectedCategory) {
-            setWidgetPicker((prev) => prev ? normalizePickerState({
-              ...prev,
-              level: "widget",
-              selectedCategory
-            }) : prev);
-          }
-        } else if (key.upArrow || key.downArrow) {
-          if (hasTopLevelSearch) {
-            if (topLevelSearchEntries2.length === 0) {
-              return;
-            }
-            let currentIndex = topLevelSearchEntries2.findIndex((entry) => entry.type === widgetPicker.selectedType);
-            if (currentIndex === -1) {
-              currentIndex = 0;
-            }
-            const nextIndex = key.downArrow ? Math.min(topLevelSearchEntries2.length - 1, currentIndex + 1) : Math.max(0, currentIndex - 1);
-            const nextType = topLevelSearchEntries2[nextIndex]?.type ?? null;
-            setWidgetPicker((prev) => prev ? normalizePickerState({
-              ...prev,
-              selectedType: nextType
-            }) : prev);
-          } else {
-            if (filteredCategories.length === 0) {
-              return;
-            }
-            let currentIndex = filteredCategories.findIndex((category) => category === selectedCategory);
-            if (currentIndex === -1) {
-              currentIndex = 0;
-            }
-            const nextIndex = key.downArrow ? Math.min(filteredCategories.length - 1, currentIndex + 1) : Math.max(0, currentIndex - 1);
-            const nextCategory = filteredCategories[nextIndex] ?? null;
-            setWidgetPicker((prev) => prev ? normalizePickerState({
-              ...prev,
-              selectedCategory: nextCategory
-            }) : prev);
-          }
-        } else if (key.backspace || key.delete) {
-          setWidgetPicker((prev) => prev ? normalizePickerState({
-            ...prev,
-            categoryQuery: prev.categoryQuery.slice(0, -1)
-          }) : prev);
-        } else if (input && !key.ctrl && !key.meta && !key.tab) {
-          setWidgetPicker((prev) => prev ? normalizePickerState({
-            ...prev,
-            categoryQuery: prev.categoryQuery + input
-          }) : prev);
-        }
-      } else {
-        if (key.escape) {
-          if (widgetPicker.widgetQuery.length > 0) {
-            setWidgetPicker((prev) => prev ? normalizePickerState({
-              ...prev,
-              widgetQuery: ""
-            }) : prev);
-          } else {
-            setWidgetPicker((prev) => prev ? normalizePickerState({
-              ...prev,
-              level: "category"
-            }) : prev);
-          }
-        } else if (key.return) {
-          if (selectedEntry) {
-            applyWidgetPickerSelection(selectedEntry.type);
-          }
-        } else if (key.upArrow || key.downArrow) {
-          if (filteredWidgets.length === 0) {
-            return;
-          }
-          let currentIndex = filteredWidgets.findIndex((entry) => entry.type === widgetPicker.selectedType);
-          if (currentIndex === -1) {
-            currentIndex = 0;
-          }
-          const nextIndex = key.downArrow ? Math.min(filteredWidgets.length - 1, currentIndex + 1) : Math.max(0, currentIndex - 1);
-          const nextType = filteredWidgets[nextIndex]?.type ?? null;
-          setWidgetPicker((prev) => prev ? normalizePickerState({
-            ...prev,
-            selectedType: nextType
-          }) : prev);
-        } else if (key.backspace || key.delete) {
-          setWidgetPicker((prev) => prev ? normalizePickerState({
-            ...prev,
-            widgetQuery: prev.widgetQuery.slice(0, -1)
-          }) : prev);
-        } else if (input && !key.ctrl && !key.meta && !key.tab) {
-          setWidgetPicker((prev) => prev ? normalizePickerState({
-            ...prev,
-            widgetQuery: prev.widgetQuery + input
-          }) : prev);
-        }
-      }
+      handlePickerInputMode({
+        input,
+        key,
+        widgetPicker,
+        widgetCatalog,
+        widgetCategories,
+        setWidgetPicker,
+        applyWidgetPickerSelection
+      });
       return;
     }
     if (moveMode) {
-      if (key.upArrow && selectedIndex > 0) {
-        const newWidgets = [...widgets];
-        const temp = newWidgets[selectedIndex];
-        const prev = newWidgets[selectedIndex - 1];
-        if (temp && prev) {
-          [newWidgets[selectedIndex], newWidgets[selectedIndex - 1]] = [prev, temp];
-        }
-        onUpdate(newWidgets);
-        setSelectedIndex(selectedIndex - 1);
-      } else if (key.downArrow && selectedIndex < widgets.length - 1) {
-        const newWidgets = [...widgets];
-        const temp = newWidgets[selectedIndex];
-        const next = newWidgets[selectedIndex + 1];
-        if (temp && next) {
-          [newWidgets[selectedIndex], newWidgets[selectedIndex + 1]] = [next, temp];
-        }
-        onUpdate(newWidgets);
-        setSelectedIndex(selectedIndex + 1);
-      } else if (key.escape || key.return) {
-        setMoveMode(false);
-      }
-    } else {
-      if (key.upArrow && widgets.length > 0) {
-        setSelectedIndex(Math.max(0, selectedIndex - 1));
-      } else if (key.downArrow && widgets.length > 0) {
-        setSelectedIndex(Math.min(widgets.length - 1, selectedIndex + 1));
-      } else if (key.leftArrow && widgets.length > 0) {
-        openWidgetPicker("change");
-      } else if (key.rightArrow && widgets.length > 0) {
-        openWidgetPicker("change");
-      } else if (key.return && widgets.length > 0) {
-        setMoveMode(true);
-      } else if (input === "a") {
-        openWidgetPicker("add");
-      } else if (input === "i") {
-        openWidgetPicker("insert");
-      } else if (input === "d" && widgets.length > 0) {
-        const newWidgets = widgets.filter((_, i) => i !== selectedIndex);
-        onUpdate(newWidgets);
-        if (selectedIndex >= newWidgets.length && selectedIndex > 0) {
-          setSelectedIndex(selectedIndex - 1);
-        }
-      } else if (input === "c") {
-        if (widgets.length > 0) {
-          setShowClearConfirm(true);
-        }
-      } else if (input === " " && widgets.length > 0) {
-        const currentWidget2 = widgets[selectedIndex];
-        if (currentWidget2 && currentWidget2.type === "separator") {
-          const currentChar = currentWidget2.character ?? "|";
-          const currentCharIndex = separatorChars.indexOf(currentChar);
-          const nextChar = separatorChars[(currentCharIndex + 1) % separatorChars.length];
-          const newWidgets = [...widgets];
-          newWidgets[selectedIndex] = { ...currentWidget2, character: nextChar };
-          onUpdate(newWidgets);
-        }
-      } else if (input === "r" && widgets.length > 0) {
-        const currentWidget2 = widgets[selectedIndex];
-        if (currentWidget2 && currentWidget2.type !== "separator" && currentWidget2.type !== "flex-separator") {
-          const widgetImpl = getWidget(currentWidget2.type);
-          if (!widgetImpl?.supportsRawValue()) {
-            return;
-          }
-          const newWidgets = [...widgets];
-          newWidgets[selectedIndex] = { ...currentWidget2, rawValue: !currentWidget2.rawValue };
-          onUpdate(newWidgets);
-        }
-      } else if (input === "m" && widgets.length > 0) {
-        const currentWidget2 = widgets[selectedIndex];
-        if (currentWidget2 && selectedIndex < widgets.length - 1 && currentWidget2.type !== "separator" && currentWidget2.type !== "flex-separator") {
-          const newWidgets = [...widgets];
-          let nextMergeState;
-          if (currentWidget2.merge === undefined) {
-            nextMergeState = true;
-          } else if (currentWidget2.merge === true) {
-            nextMergeState = "no-padding";
-          } else {
-            nextMergeState = undefined;
-          }
-          if (nextMergeState === undefined) {
-            const { merge: merge2, ...rest } = currentWidget2;
-            newWidgets[selectedIndex] = rest;
-          } else {
-            newWidgets[selectedIndex] = { ...currentWidget2, merge: nextMergeState };
-          }
-          onUpdate(newWidgets);
-        }
-      } else if (key.escape) {
-        onBack();
-      } else if (widgets.length > 0) {
-        const currentWidget2 = widgets[selectedIndex];
-        if (currentWidget2 && currentWidget2.type !== "separator" && currentWidget2.type !== "flex-separator") {
-          const widgetImpl = getWidget(currentWidget2.type);
-          if (widgetImpl) {
-            if (widgetImpl.getCustomKeybinds) {
-              const customKeybinds2 = getVisibleCustomKeybinds(widgetImpl, currentWidget2);
-              const matchedKeybind = customKeybinds2.find((kb) => kb.key === input);
-              if (matchedKeybind && !key.ctrl) {
-                if (widgetImpl.handleEditorAction) {
-                  const updatedWidget = widgetImpl.handleEditorAction(matchedKeybind.action, currentWidget2);
-                  if (updatedWidget) {
-                    const newWidgets = [...widgets];
-                    newWidgets[selectedIndex] = updatedWidget;
-                    onUpdate(newWidgets);
-                  } else if (widgetImpl.renderEditor) {
-                    setCustomEditorWidget({ widget: currentWidget2, impl: widgetImpl, action: matchedKeybind.action });
-                  }
-                } else if (widgetImpl.renderEditor) {
-                  setCustomEditorWidget({ widget: currentWidget2, impl: widgetImpl, action: matchedKeybind.action });
-                }
-              }
-            }
-          }
-        }
-      }
+      handleMoveInputMode({
+        key,
+        widgets,
+        selectedIndex,
+        onUpdate,
+        setSelectedIndex,
+        setMoveMode
+      });
+      return;
     }
+    handleNormalInputMode({
+      input,
+      key,
+      widgets,
+      selectedIndex,
+      separatorChars,
+      onBack,
+      onUpdate,
+      setSelectedIndex,
+      setMoveMode,
+      setShowClearConfirm,
+      openWidgetPicker,
+      getVisibleCustomKeybinds,
+      setCustomEditorWidget
+    });
   });
   const getWidgetDisplay = (widget) => {
     if (widget.type === "separator") {
@@ -58622,7 +58803,7 @@ var ItemsEditor = ({ widgets, onUpdate, onBack, lineNumber, settings }) => {
   };
   const hasFlexSeparator = widgets.some((widget) => widget.type === "flex-separator");
   const widthDetectionAvailable = canDetectTerminalWidth();
-  const pickerCategories = widgetPicker ? getFilteredCategories(widgetPicker.categoryQuery) : [];
+  const pickerCategories = widgetPicker ? [...widgetCategories] : [];
   const selectedPickerCategory = widgetPicker ? widgetPicker.selectedCategory && pickerCategories.includes(widgetPicker.selectedCategory) ? widgetPicker.selectedCategory : pickerCategories[0] ?? null : null;
   const topLevelSearchEntries = widgetPicker && widgetPicker.level === "category" && widgetPicker.categoryQuery.trim().length > 0 ? filterWidgetCatalog(widgetCatalog, "All", widgetPicker.categoryQuery) : [];
   const selectedTopLevelSearchEntry = widgetPicker ? topLevelSearchEntries.find((entry) => entry.type === widgetPicker.selectedType) ?? topLevelSearchEntries[0] : null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ccstatusline",
-  "version": "2.1.5",
+  "version": "2.1.6",
   "description": "A customizable status line formatter for Claude Code CLI",
   "module": "src/ccstatusline.ts",
   "type": "module",