@ciphore/radiocli 0.1.0

package/dist/ui/playback-footer.js

@@ -0,0 +1,48 @@
+import { truncate } from './format.js';
+// Square braille spinner: a filled 2x4 dot cell that appears to rotate. Reads as
+// a small spinning block in the terminal, which suits RadioCLI better than a
+// thin circular spinner.
+export const loadingSpinnerFrames = ['⣾', '⣽', '⣻', '⢿', '⡿', '⣟', '⣯', '⣷'];
+export function loadingSpinnerFrame(frame) {
+    const count = loadingSpinnerFrames.length;
+    // Guard against negative or fractional tick counters.
+    const index = ((Math.trunc(frame) % count) + count) % count;
+    return loadingSpinnerFrames[index] ?? loadingSpinnerFrames[0];
+}
+const visiblePlaybackStates = new Set(['loading', 'playing', 'paused']);
+export function shouldShowPlaybackFooter(station, playback) {
+    // During loading the React-side station may not be set yet, but the player
+    // already knows the station name, so fall back to that.
+    return Boolean((station || playback.stationName) && visiblePlaybackStates.has(playback.state));
+}
+export function playbackFooterText({ station, playback, metadata, sleepLabel, width, spinnerFrame }) {
+    const stationName = station?.name ?? playback.stationName;
+    if (!stationName || !visiblePlaybackStates.has(playback.state)) {
+        return null;
+    }
+    const loading = playback.state === 'loading';
+    const nameLabel = loading
+        ? `${loadingSpinnerFrame(spinnerFrame ?? 0)} ${stationName}`
+        : stationName;
+    const details = [
+        statePrefix(playback.state),
+        nameLabel,
+        loading ? 'buffering…' : trackLabel(metadata, stationName),
+        playback.muted ? 'muted' : `vol ${playback.volume}`,
+        sleepLabel !== 'Sleep off' ? sleepLabel : undefined
+    ].filter(Boolean);
+    return truncate(details.join(' · '), Math.max(1, width));
+}
+function statePrefix(state) {
+    if (state === 'paused') {
+        return 'Paused';
+    }
+    return undefined;
+}
+function trackLabel(metadata, stationName) {
+    const title = metadata?.title?.trim();
+    if (!title || title.toLowerCase() === stationName.toLowerCase()) {
+        return undefined;
+    }
+    return title;
+}

package/dist/ui/screen-items.js

@@ -0,0 +1,26 @@
+export const homeItems = [
+    { screen: 'now-playing', label: 'Playing', detail: 'Receiver display and controls' },
+    { screen: 'library', label: 'Library', detail: 'Favorites, recent stations, imported streams' },
+    { screen: 'explore', label: 'Explore', detail: 'Move a map cursor through geotagged stations' },
+    { screen: 'search', label: 'Search', detail: 'Find stations by name, genre, language, place' },
+    { screen: 'countries', label: 'Countries', detail: 'Browse by country list with a world-map toggle' },
+    { screen: 'nearby', label: 'Nearby', detail: 'Opt-in approximate location for local stations' },
+    { screen: 'stats', label: 'Stats', detail: 'Listening graph, stations, streaks, hours' },
+    { screen: 'settings', label: 'Settings', detail: 'Playback backend, colors, providers' }
+];
+export const settingsItems = [
+    'Cycle display color',
+    'Cycle receiver style',
+    'Toggle Radio Garden experimental adapter',
+    'Toggle nearby location lookup',
+    'Cycle playback backend',
+    'Volume up',
+    'Volume down',
+    'Mute or unmute',
+    'Toggle skip broken streams',
+    'Refresh provider health',
+    'Learn previous media key',
+    'Learn play/pause media key',
+    'Learn next media key',
+    'Reset learned media keys'
+];

package/dist/ui/screens/CountriesScreen.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { Menu, Pointer } from '../components/Menu.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { themeAccent } from '../theme.js';
+import { visibleWindow } from '../list-window.js';
+export function CountriesScreen({ countries, selected, loading, filter, editingFilter, theme, pageSize, width }) {
+    const window = visibleWindow(countries, selected, pageSize);
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Countries", subtitle: editingFilter ? 'Filtering countries — type to narrow the list' : 'Browse the worldwide country directory', width: width, theme: theme, right: `filter: ${filter || 'all'}` }), loading ? _jsx(Text, { color: "gray", children: "Loading countries from Radio Browser\u2026" }) : null, !loading ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Text, { color: "gray", children: ["Showing ", countries.length ? window.start + 1 : 0, "-", window.end, " of ", countries.length] }), _jsx(Menu, { items: window.items, selected: selected - window.start, keyFor: country => country.code, render: (country, _index, active) => (_jsxs(Box, { children: [_jsx(Pointer, { active: active }), _jsx(Text, { color: active ? themeAccent(theme) : undefined, bold: active, children: country.name }), _jsxs(Text, { color: "gray", children: [" \u00B7 ", country.code, " \u00B7 ", country.stationCount.toLocaleString(), " stations"] })] })) })] })) : null] }));
+}

package/dist/ui/screens/ExploreScreen.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Text } from 'ink';
+import { StationList } from '../components/StationList.js';
+import { buildCosmoWorldMap } from '../cosmo-world-map.js';
+import { computeExploreMapLayout } from '../explore-map-layout.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { exploreMapLand, mapMarker, panelBackground, panelBorder, themeAccent } from '../theme.js';
+export function ExploreScreen({ title, subtitle, stations, selected, loading, theme, favorites, filterLabel, cursor, pageSize, width, height }) {
+    const { contentWidth, headerRows, bodyRows, split, listPanelWidth, mapPanelWidth, mapRows, mapColumns, listRows, listPageSize } = computeExploreMapLayout(width, height, pageSize);
+    const cursorMarker = React.useMemo(() => [{ lat: cursor.latitude, lon: cursor.longitude, selected: true }], [cursor.latitude, cursor.longitude]);
+    const map = React.useMemo(() => buildCosmoWorldMap(mapColumns, mapRows, cursorMarker), [mapColumns, mapRows, cursorMarker]);
+    return (_jsxs(Box, { flexDirection: "column", height: height, width: contentWidth, overflow: "hidden", flexShrink: 0, children: [_jsx(Box, { height: headerRows, flexDirection: "column", flexShrink: 0, children: _jsx(ScreenHeader, { title: title, subtitle: subtitle, width: contentWidth, theme: theme, right: filterLabel === 'none' ? undefined : `filters: ${filterLabel}` }) }), _jsxs(Box, { marginTop: 1, height: bodyRows, width: contentWidth, flexDirection: split ? 'row' : 'column', flexShrink: 0, children: [_jsx(Box, { borderStyle: "single", borderColor: panelBorder, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, width: mapPanelWidth, height: split ? bodyRows : mapRows + 2, flexDirection: "column", children: map.map((row, index) => (_jsx(CosmoMapLine, { row: row, theme: theme }, `map-${index}`))) }), _jsxs(Box, { marginLeft: split ? 1 : 0, marginTop: split ? 0 : 1, borderStyle: "single", borderColor: panelBorder, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, width: listPanelWidth, height: split ? bodyRows : Math.max(5, listRows + 2), flexDirection: "column", children: [_jsxs(Box, { justifyContent: "space-between", width: Math.max(20, listPanelWidth - 2), children: [_jsx(Text, { color: themeAccent(theme), bold: true, children: "Stations" }), _jsx(Text, { color: "gray", children: stations.length.toLocaleString() })] }), _jsx(Box, { height: 1, flexShrink: 0, children: _jsx(Text, { color: "gray", children: loading ? 'Loading stations…' : ' ' }) }), !loading ? (_jsx(StationList, { stations: stations, selected: selected, theme: theme, favorites: favorites, pageSize: listPageSize, width: Math.max(42, listPanelWidth - 2) })) : null] })] })] }));
+}
+function CosmoMapLine({ row, theme }) {
+    const chunks = [];
+    for (const cell of row.cells) {
+        const previous = chunks.at(-1);
+        if (previous?.kind === cell.kind) {
+            previous.text += cell.char;
+        }
+        else {
+            chunks.push({ kind: cell.kind, text: cell.char });
+        }
+    }
+    let offset = 0;
+    return (_jsx(Box, { children: chunks.map(chunk => {
+            const key = `${offset}-${chunk.kind}`;
+            offset += chunk.text.length;
+            return (_jsx(Text, { color: cosmoMapColor(chunk.kind, theme), children: chunk.text }, key));
+        }) }));
+}
+function cosmoMapColor(kind, theme) {
+    if (kind === 'selected') {
+        return themeAccent(theme);
+    }
+    if (kind === 'marker') {
+        return mapMarker;
+    }
+    if (kind === 'land') {
+        return exploreMapLand;
+    }
+    return undefined;
+}

package/dist/ui/screens/HomeScreen.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { Logo } from '../components/Logo.js';
+import { Menu, Pointer } from '../components/Menu.js';
+import { themeAccent } from '../theme.js';
+import { homeItems } from '../screen-items.js';
+export function HomeScreen({ selected, theme, library, playback }) {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Logo, {}), _jsxs(Text, { children: ["Receiver:", ' ', _jsx(Text, { color: themeAccent(theme), children: playback.state === 'playing' ? playback.message ?? 'playing' : playback.state }), _jsxs(Text, { color: "gray", children: [" \u00B7 ", playback.backend] })] }), _jsx(Box, { marginTop: 1, flexDirection: "column", children: _jsx(Menu, { items: homeItems, selected: selected, keyFor: item => item.screen, render: (item, index, active) => (_jsxs(Box, { children: [_jsx(Pointer, { active: active }), _jsxs(Text, { color: "gray", children: [index + 1, " "] }), _jsx(Text, { color: active ? themeAccent(theme) : undefined, bold: active, children: item.label }), _jsxs(Text, { color: "gray", children: [" \u00B7 ", item.detail] })] })) }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "gray", children: [library.recent.length, " recent \u00B7 ", library.favorites.length, " favorites \u00B7 ", library.imported.length, " imported"] }) })] }));
+}

package/dist/ui/screens/MapScreen.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { mapLand, mapWater, themeAccent, themeContributionColors } from '../theme.js';
+import { visibleWindow } from '../list-window.js';
+import { Menu, Pointer } from '../components/Menu.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { truncate } from '../format.js';
+import { buildWorldMap } from '../world-map.js';
+export function MapScreen({ countries, selected, loading, filter, editingFilter, theme, pageSize, mode, width }) {
+    const contentWidth = Math.max(52, width - 2);
+    const topCountries = Array.from(countries).sort((a, b) => b.stationCount - a.stationCount).slice(0, mode === 'full' ? 10 : 6);
+    const selectedCountry = countries[selected];
+    const window = visibleWindow(countries, selected, pageSize);
+    const graph = buildWorldMap(countries, selectedCountry, mode, contentWidth);
+    const topWidth = mode === 'full' ? 50 : contentWidth;
+    const listWidth = Math.max(28, Math.min(contentWidth - topWidth - 4, 56));
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "World map", subtitle: editingFilter ? 'Filtering country list — type to narrow' : 'Station density by country', width: contentWidth, theme: theme, right: `filter: ${filter || 'all'}` }), loading ? _jsx(Text, { color: "gray", children: "Loading country density\u2026" }) : null, _jsx(Box, { marginTop: 1, flexDirection: "column", children: graph.rows.map(row => (_jsx(MapLine, { row: row, theme: theme }, row.cells.map(cell => cell.char).join('')))) }), _jsxs(Text, { color: "gray", children: [graph.plotted, " plotted \u00B7 ", graph.unplotted, " unplaced \u00B7 labels show highest station counts"] }), _jsxs(Box, { marginTop: 1, flexDirection: mode === 'full' ? 'row' : 'column', children: [_jsxs(Box, { width: topWidth, flexDirection: "column", children: [_jsx(Text, { color: "gray", children: "Highest station counts" }), topCountries.map(country => (_jsxs(Text, { children: [_jsx(Text, { color: themeAccent(theme), children: country.code.padEnd(3) }), _jsx(Text, { children: truncate(country.name, 30).padEnd(31) }), _jsx(Text, { color: "gray", children: country.stationCount.toLocaleString().padStart(7) })] }, country.code)))] }), _jsxs(Box, { marginLeft: mode === 'full' ? 3 : 0, marginTop: mode === 'full' ? 0 : 1, width: listWidth, flexDirection: "column", children: [_jsxs(Text, { children: ["Selected:", ' ', _jsx(Text, { color: themeAccent(theme), children: selectedCountry ? `${selectedCountry.name} · ${selectedCountry.stationCount.toLocaleString()}` : 'none' })] }), _jsx(Menu, { items: window.items, selected: selected - window.start, keyFor: country => country.code, render: (country, _index, active) => (_jsxs(Box, { children: [_jsx(Pointer, { active: active }), _jsx(Text, { color: active ? themeAccent(theme) : undefined, bold: active, children: country.code }), _jsxs(Text, { color: "gray", children: [" \u00B7 ", truncate(country.name, Math.max(8, listWidth - 8))] })] })) })] })] })] }));
+}
+function MapLine({ row, theme }) {
+    const chunks = [];
+    for (const cell of row.cells) {
+        const previous = chunks[chunks.length - 1];
+        if (previous && previous.kind === cell.kind) {
+            previous.text += cell.char;
+        }
+        else {
+            chunks.push({ kind: cell.kind, text: cell.char });
+        }
+    }
+    const keyedChunks = [];
+    let offset = 0;
+    for (const chunk of chunks) {
+        keyedChunks.push({ key: `${offset}-${chunk.kind}`, ...chunk });
+        offset += chunk.text.length;
+    }
+    return (_jsx(Box, { children: keyedChunks.map(chunk => (_jsx(Text, { color: mapColor(chunk.kind, theme), children: chunk.text }, chunk.key))) }));
+}
+function mapColor(kind, theme) {
+    const colors = themeContributionColors(theme);
+    if (kind === 'selected') {
+        return themeAccent(theme);
+    }
+    if (kind === 'level4') {
+        return colors[4] ?? themeAccent(theme);
+    }
+    if (kind === 'level3') {
+        return colors[3] ?? themeAccent(theme);
+    }
+    if (kind === 'level2') {
+        return colors[2] ?? themeAccent(theme);
+    }
+    if (kind === 'level1') {
+        return colors[1] ?? 'gray';
+    }
+    if (kind === 'land') {
+        return mapLand;
+    }
+    return mapWater;
+}

package/dist/ui/screens/NowPlayingScreen.js

@@ -0,0 +1,79 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { stationLocation, stationTags, stationTech, truncate } from '../format.js';
+import { panelBackground, themeAccent } from '../theme.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { buildVisualizer, visualizerHeight } from '../visualizers/receiver-visualizers.js';
+export function NowPlayingScreen({ station, playback, metadata, theme, favorite, pulse, diagnostics, sleepLabel, showDiagnostics, stationTime, receiverStyle, width, height }) {
+    const accent = themeAccent(theme);
+    const panelWidth = Math.max(62, width);
+    const panelHeight = Math.max(10, height);
+    const innerWidth = Math.max(28, panelWidth - 6);
+    const visualHeight = visualizerHeight(receiverStyle, panelHeight - (showDiagnostics ? 14 : 9), innerWidth);
+    const visualRows = buildVisualizer(receiverStyle, pulse, innerWidth, visualHeight, station, playback, theme);
+    const stationName = station ? truncate(station.name, innerWidth) : 'No station tuned';
+    const stationPlace = station
+        ? truncate(stationLocation(station).toUpperCase(), innerWidth)
+        : 'Choose a station from Library, Explore, Search, Countries, or Nearby.';
+    const infoFallback = diagnostics.availableBackends.length > 0
+        ? 'Playback backend ready. Choose a station to start tuning.'
+        : 'No playback backend found. Run radiocli doctor for setup help.';
+    // One compact meta line: stream tech, tags, and the sleep timer only when set.
+    const sleepSuffix = sleepLabel !== 'Sleep off' ? ` · ${sleepLabel}` : '';
+    const infoLine = station
+        ? truncate(`${stationTech(station)} · ${stationTags(station)}${sleepSuffix}`, innerWidth)
+        : infoFallback;
+    const metadataLine = metadata?.title
+        ? truncate(metadata.title, Math.max(8, innerWidth - 12))
+        : 'Waiting for ICY track metadata';
+    const dialLabel = receiverDialLabel(station);
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Now playing", width: panelWidth, theme: theme }), _jsxs(Box, { borderStyle: "round", borderColor: accent, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, flexDirection: "column", paddingX: 2, paddingY: 1, width: panelWidth, height: panelHeight, children: [_jsxs(Box, { justifyContent: "space-between", width: innerWidth, children: [_jsx(Text, { color: accent, bold: true, children: dialLabel }), _jsx(Text, { color: accent, children: "RADIOCLI" }), _jsx(Text, { color: accent, children: playback.state.toUpperCase() })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: accent, bold: true, children: stationName }) }), _jsx(Text, { color: "gray", children: truncate(stationPlace, innerWidth) }), _jsx(Box, { flexDirection: "column", children: visualRows.map((row, index) => (_jsx(Text, { color: row.segments ? undefined : row.color, children: row.segments
+                                ? renderSegments(row.segments)
+                                : row.text }, `${index}-${row.color}-${row.text}`))) }), _jsxs(Box, { marginTop: 1, justifyContent: "space-between", width: innerWidth, children: [_jsx(Text, { color: metadata?.title ? accent : 'gray', children: metadataLine }), _jsx(Text, { color: favorite ? 'yellow' : 'gray', children: favorite ? '★ Favorite' : '☆ Favorite' })] }), _jsx(Text, { color: "gray", children: infoLine }), showDiagnostics ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: "gray", children: "Diagnostics" }), _jsxs(Text, { color: "gray", children: ["Stream: ", diagnostics.streamUrl ? truncate(diagnostics.streamUrl, innerWidth - 8) : 'none'] }), _jsxs(Text, { color: "gray", children: ["Station time: ", stationTime] }), _jsxs(Text, { color: "gray", children: ["Started: ", diagnostics.startedAt ? new Date(diagnostics.startedAt).toLocaleTimeString() : 'not playing', " \u00B7 available ", diagnostics.availableBackends.join(', ') || 'none'] })] })) : null] })] }));
+}
+export function receiverDialLabel(station) {
+    if (!station) {
+        return 'FM ---';
+    }
+    const frequency = stationFrequency(station.name);
+    if (frequency) {
+        return frequency;
+    }
+    const codec = station.codec?.trim().toUpperCase();
+    if (station.bitrate && codec) {
+        return `FM ${String(station.bitrate).padStart(3, '0')}.${codec.slice(0, 1)}`;
+    }
+    if (station.bitrate) {
+        return `FM ${String(station.bitrate).padStart(3, '0')}`;
+    }
+    if (codec) {
+        return `FM ${codec}`;
+    }
+    return 'FM LIVE';
+}
+function stationFrequency(name) {
+    const frequencyMatch = name.match(/\b(?:(AM|FM)\s*)?(\d{2,4}(?:\.\d{1,2})?)(?:\s*(AM|FM))?\b/i);
+    if (!frequencyMatch) {
+        return null;
+    }
+    const value = Number(frequencyMatch[2]);
+    if (!Number.isFinite(value)) {
+        return null;
+    }
+    const explicitBand = (frequencyMatch[1] ?? frequencyMatch[3])?.toUpperCase();
+    if (explicitBand === 'AM' || (!explicitBand && value >= 520 && value <= 1710)) {
+        return `AM ${frequencyMatch[2]}`;
+    }
+    if (explicitBand === 'FM' || (!explicitBand && value >= 65 && value <= 120)) {
+        return `FM ${frequencyMatch[2]}`;
+    }
+    return null;
+}
+function renderSegments(segments) {
+    let offset = 0;
+    return segments.map(segment => {
+        const key = `${offset}-${segment.color}`;
+        offset += segment.text.length;
+        return (_jsx(Text, { color: segment.color, children: segment.text }, key));
+    });
+}

package/dist/ui/screens/SearchScreen.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { StationList } from '../components/StationList.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { panelBackground, panelBorder, themeAccent } from '../theme.js';
+import { truncate } from '../format.js';
+export function SearchScreen({ query, editing, loading, stations, selected, theme, favorites, experimentalOn, filterLabel, pageSize, width }) {
+    const contentWidth = Math.max(40, width);
+    const inputWidth = Math.max(34, Math.min(contentWidth, 96));
+    const inputTextWidth = Math.max(8, inputWidth - 8);
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Search", subtitle: `Radio Browser${experimentalOn ? ' + Radio Garden experimental' : ''}`, width: width, theme: theme, right: filterLabel === 'none' ? undefined : `filters: ${filterLabel}` }), _jsxs(Box, { marginTop: 1, borderStyle: "single", borderColor: editing ? themeAccent(theme) : panelBorder, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, width: inputWidth, height: 3, marginBottom: 1, flexShrink: 0, children: [_jsx(Text, { color: editing ? themeAccent(theme) : 'gray', children: editing ? '› ' : '  ' }), _jsx(Text, { color: query ? themeAccent(theme) : 'gray', children: truncate(query || 'Search stations, genres, languages, places…', inputTextWidth) })] }), loading ? _jsx(Text, { color: "gray", children: "Searching public station directories\u2026" }) : null, !loading ? _jsx(StationList, { stations: stations, selected: selected, theme: theme, favorites: favorites, pageSize: pageSize, width: width }) : null] }));
+}

package/dist/ui/screens/SettingsScreen.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { Menu, Pointer } from '../components/Menu.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { truncate } from '../format.js';
+import { settingsItems } from '../screen-items.js';
+import { themeAccent } from '../theme.js';
+export function SettingsScreen({ selected, settings, storePath, playback, backends, providerHealth, theme, diagnostics, width }) {
+    const accent = themeAccent(theme);
+    const lineWidth = Math.max(32, width - 4);
+    const health = Object.entries(providerHealth);
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Settings", subtitle: "Enter changes the highlighted setting \u00B7 shortcuts in the footer", width: width, theme: theme }), _jsx(Box, { marginTop: 1, flexDirection: "column", children: _jsx(Menu, { items: settingsItems, selected: selected, keyFor: item => item, render: (item, _index, active) => {
+                        const value = settingValue(item, settings, diagnostics, backends);
+                        return (_jsxs(Box, { children: [_jsx(Pointer, { active: active }), _jsx(Text, { color: active ? accent : undefined, bold: active, children: item }), value ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: "gray", children: " \u00B7 " }), _jsx(Text, { color: accent, children: value })] })) : null] }));
+                    } }) }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: "gray", bold: true, children: "Status" }), _jsxs(Text, { color: "gray", children: ["Player: ", _jsx(Text, { color: accent, children: playback.backend || 'none' }), " / ", playback.state, " \u00B7", ' ', diagnostics.muted ? 'muted' : `vol ${diagnostics.volume}`, " \u00B7 tune timeout ", settings.tuneTimeoutSeconds, "s"] }), _jsxs(Text, { color: "gray", children: ["Provider health: ", health.length ? health.map(([provider, status]) => `${provider} ${status}`).join(' · ') : 'not checked yet'] }), _jsxs(Text, { color: "gray", children: ["Active stream: ", truncate(diagnostics.streamUrl ?? 'none', lineWidth - 15)] }), _jsxs(Text, { color: "gray", children: ["Library: ", truncate(storePath, lineWidth - 9)] })] })] }));
+}
+function settingValue(item, settings, diagnostics, backends) {
+    switch (item) {
+        case 'Cycle display color':
+            return settings.theme;
+        case 'Cycle receiver style':
+            return settings.receiverStyle;
+        case 'Toggle Radio Garden experimental adapter':
+            return settings.enableRadioGarden ? 'on' : 'off';
+        case 'Toggle nearby location lookup':
+            return settings.enableNearbyLocation ? 'on' : 'off';
+        case 'Cycle playback backend':
+            return `${settings.preferredBackend} · available ${backends.length ? backends.join(', ') : 'none'}`;
+        case 'Mute or unmute':
+            return diagnostics.muted ? 'muted' : `vol ${diagnostics.volume}`;
+        case 'Toggle skip broken streams':
+            return settings.skipBrokenStreams ? 'on' : 'off';
+        case 'Reset learned media keys':
+            return `prev ${settings.mediaKeys.previous.length} · play ${settings.mediaKeys.playPause.length} · next ${settings.mediaKeys.next.length}`;
+        default:
+            return undefined;
+    }
+}

package/dist/ui/screens/StationScreen.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { StationList } from '../components/StationList.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+export function StationScreen({ title, subtitle, stations, selected, loading, theme, favorites, filterLabel, pageSize, width }) {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: title, subtitle: subtitle, width: width, theme: theme, right: filterLabel === 'none' ? undefined : `filters: ${filterLabel}` }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [loading ? _jsx(Text, { color: "gray", children: "Loading stations\u2026" }) : null, !loading ? _jsx(StationList, { stations: stations, selected: selected, theme: theme, favorites: favorites, pageSize: pageSize, width: width }) : null] })] }));
+}

package/dist/ui/screens/StatsScreen.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { computeListeningStats } from '../../activity/stats.js';
+import { panelBackground, panelBorder, textHighlight, themeAccent, themeContributionColors } from '../theme.js';
+import { ScreenHeader } from '../components/ScreenHeader.js';
+import { truncate } from '../format.js';
+const monthLabels = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+export function StatsScreen({ library, theme, width, height }) {
+    const stats = computeListeningStats(library.activity.sessions);
+    const contentWidth = Math.max(20, width - 4);
+    const graph = buildContributionGraph(stats.days, contentWidth);
+    const graphColors = themeContributionColors(theme);
+    const favorite = stats.favoriteStation?.name ?? 'none yet';
+    const totalHours = stats.totalSeconds / 3600;
+    const metricWidth = Math.max(28, Math.floor((contentWidth - 2) / 2));
+    const favoriteWidth = Math.max(8, metricWidth - 18);
+    const compact = height < 30;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Listening stats", subtitle: "Local listening history \u00B7 never leaves this machine", width: width, theme: theme, right: `${formatHours(totalHours)} · ${stats.sessions.toLocaleString()} sessions` }), _jsxs(Box, { marginTop: 1, borderStyle: "single", borderColor: panelBorder, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, width: width, flexDirection: "column", children: [_jsx(Box, { children: _jsx(Text, { color: themeAccent(theme), bold: true, children: "Activity \u2014 last 53 weeks" }) }), _jsxs(Box, { marginTop: compact ? 0 : 1, flexDirection: "column", children: [_jsxs(Text, { color: "gray", children: ["      ", graph.months] }), graph.rows.map(row => (_jsxs(Box, { children: [_jsx(Text, { color: "gray", children: row.label.padEnd(5) }), row.cells.map(cell => (_jsx(Text, { color: graphColors[cell.level], children: cell.text }, cell.key)))] }, row.key)))] })] }), _jsxs(Box, { marginTop: 1, borderStyle: "single", borderColor: panelBorder, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, width: width, flexDirection: "column", children: [_jsx(Text, { color: themeAccent(theme), bold: true, children: "Summary" }), _jsxs(Box, { marginTop: compact ? 0 : 1, flexDirection: "column", width: contentWidth, children: [metricPair('Favorite station', truncate(favorite, favoriteWidth), 'Total hours listened', formatHours(totalHours), metricWidth, theme), metricPair('Sessions', stats.sessions.toLocaleString(), 'Longest streak', formatDays(stats.longestStreak), metricWidth, theme), metricPair('Current streak', formatDays(stats.currentStreak), 'Stations listened', stats.listenedStationCount.toLocaleString(), metricWidth, theme), metricPair('Active days', `${stats.activeDays}/${stats.totalTrackedDays}`, 'Station threshold', '>= 120s total', metricWidth, theme)] }), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "gray", children: "Less \u00B7 " }), graphColors.map(color => (_jsxs(Text, { color: color, children: ["\u2588\u2588", _jsx(Text, { children: " " })] }, color))), _jsx(Text, { color: "gray", children: "More" })] }), !compact ? (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: textHighlight, children: stats.totalSeconds > 0
+                                ? `Your total listening time is ${formatHours(totalHours)} across public radio streams.`
+                                : 'Start a station to begin filling the listening graph.' }) })) : null] })] }));
+}
+function metricPair(leftLabel, leftValue, rightLabel, rightValue, metricWidth, theme) {
+    const accent = themeAccent(theme);
+    const leftPadding = Math.max(2, metricWidth - leftLabel.length - leftValue.length - 2);
+    return (_jsxs(Box, { height: 1, width: metricWidth * 2 + 2, children: [_jsx(Box, { width: metricWidth, children: _jsxs(Text, { children: [_jsxs(Text, { color: "gray", children: [leftLabel, ": "] }), _jsx(Text, { color: accent, children: leftValue })] }) }), _jsx(Text, { children: ' '.repeat(leftPadding > 2 ? 2 : leftPadding) }), _jsx(Box, { width: metricWidth, children: _jsxs(Text, { children: [_jsxs(Text, { color: "gray", children: [rightLabel, ": "] }), _jsx(Text, { color: accent, children: rightValue })] }) })] }));
+}
+function buildContributionGraph(days, width) {
+    const cellWidth = width >= 168 ? 3 : width >= 120 ? 2 : 1;
+    const weeks = Array.from({ length: 53 }, (_, weekIndex) => days.slice(weekIndex * 7, weekIndex * 7 + 7)).filter(week => week.length > 0);
+    const maxSeconds = Math.max(1, ...days.map(day => day.seconds));
+    const labels = ['', 'Mon', '', 'Wed', '', 'Fri', ''];
+    const rows = Array.from({ length: 7 }, (_, dayIndex) => ({
+        key: `day-${dayIndex}`,
+        label: labels[dayIndex] ?? '',
+        cells: weeks.map(week => {
+            const day = week[dayIndex];
+            const level = contributionLevel(day?.seconds ?? 0, maxSeconds);
+            return { key: day?.date ?? `${week[0]?.date ?? 'empty'}-${dayIndex}`, level, text: '█'.repeat(cellWidth) };
+        })
+    }));
+    return { months: monthLine(weeks, cellWidth), rows };
+}
+function contributionLevel(seconds, maxSeconds) {
+    if (seconds <= 0) {
+        return 0;
+    }
+    const ratio = seconds / maxSeconds;
+    if (ratio > 0.75) {
+        return 4;
+    }
+    if (ratio > 0.45) {
+        return 3;
+    }
+    if (ratio > 0.2) {
+        return 2;
+    }
+    return 1;
+}
+function monthLine(weeks, cellWidth) {
+    const cells = weeks.map((week, index) => {
+        const first = week[0];
+        if (!first) {
+            return ''.padEnd(cellWidth, ' ');
+        }
+        const date = parseLocalDay(first.date);
+        const previous = index > 0 && weeks[index - 1]?.[0]
+            ? parseLocalDay(weeks[index - 1][0].date)
+            : null;
+        const changedMonth = !previous || date.getMonth() !== previous.getMonth();
+        if (!changedMonth) {
+            return ''.padEnd(cellWidth, ' ');
+        }
+        const label = monthLabels[date.getMonth()];
+        return cellWidth >= 3 ? label : label.slice(0, cellWidth).padEnd(cellWidth, ' ');
+    });
+    return cells.join('');
+}
+function parseLocalDay(value) {
+    const [year = '0', month = '1', day = '1'] = value.split('-');
+    return new Date(Number(year), Number(month) - 1, Number(day));
+}
+function formatDays(days) {
+    return `${days} ${days === 1 ? 'day' : 'days'}`;
+}
+function formatHours(hours) {
+    if (hours < 10) {
+        return `${hours.toFixed(1)}h`;
+    }
+    return `${Math.round(hours).toLocaleString()}h`;
+}

package/dist/ui/terminal-mouse.js

@@ -0,0 +1,38 @@
+import { cosmoCoordinateForCell } from './cosmo-world-map.js';
+import { computeExploreMapLayout } from './explore-map-layout.js';
+export const enableMouseReporting = '\u001B[?1000h\u001B[?1006h';
+export const disableMouseReporting = '\u001B[?1006l\u001B[?1000l';
+const sgrMousePattern = /\u001B\[<(\d+);(\d+);(\d+)([Mm])/g;
+export function parseSgrMouseEvents(input) {
+    return Array.from(input.matchAll(sgrMousePattern), match => ({
+        button: Number(match[1]),
+        x: Number(match[2]),
+        y: Number(match[3]),
+        pressed: match[4] === 'M'
+    })).filter(event => Number.isFinite(event.button) && Number.isFinite(event.x) && Number.isFinite(event.y));
+}
+export function primaryMousePress(events) {
+    return events.find(event => event.pressed && (event.button & 3) === 0 && (event.button & 96) === 0) ?? null;
+}
+export function exploreCursorForMouseCell(x, y, frameWidth, layout) {
+    if (layout.compact) {
+        return null;
+    }
+    const mapLayout = computeExploreMapLayout(frameWidth, layout.contentRows, layout.stationRows);
+    const contentLeft = 2;
+    const contentTop = layout.topRows + 1;
+    const mapOuterLeft = contentLeft;
+    const mapOuterTop = contentTop + mapLayout.headerRows + 1;
+    const mapInnerLeft = mapOuterLeft + 1;
+    const mapInnerTop = mapOuterTop + 1;
+    const col = Math.floor(x - mapInnerLeft);
+    const row = Math.floor(y - mapInnerTop);
+    if (col < 0 || col >= mapLayout.mapColumns || row < 0 || row >= mapLayout.mapRows) {
+        return null;
+    }
+    const coordinate = cosmoCoordinateForCell(col, row, mapLayout.mapColumns, mapLayout.mapRows);
+    return {
+        latitude: coordinate.lat,
+        longitude: coordinate.lon
+    };
+}

package/dist/ui/theme.js

@@ -0,0 +1,105 @@
+import { defaultReceiverStyle, receiverStyleNames, themeNames } from '../types.js';
+const receiverStyles = receiverStyleNames;
+export const appBackground = '#070a0f';
+export const panelBackground = '#090d14';
+export const panelBorder = '#28313c';
+// Shared neutral palette. Use these named tokens instead of ad-hoc hex literals
+// so secondary text, rules, and map shading stay consistent across every screen.
+export const textDim = '#5b6573';
+export const textHighlight = '#d8c66f';
+export const mapLand = '#33414f';
+export const mapWater = '#1a2430';
+export const mapMarker = '#7dd3fc';
+export const exploreMapLand = '#a0a0c0';
+export function themeAccent(theme) {
+    if (theme === 'amber') {
+        return '#ffb000';
+    }
+    if (theme === 'blue') {
+        return '#53a8ff';
+    }
+    if (theme === 'ruby') {
+        return '#ff5f87';
+    }
+    if (theme === 'ice') {
+        return '#b9f6ff';
+    }
+    if (theme === 'teal') {
+        return '#5eead4';
+    }
+    if (theme === 'violet') {
+        return '#a78bfa';
+    }
+    if (theme === 'copper') {
+        return '#d08770';
+    }
+    if (theme === 'cyan') {
+        return '#22d3ee';
+    }
+    if (theme === 'lime') {
+        return '#a3e635';
+    }
+    if (theme === 'coral') {
+        return '#ff7e6b';
+    }
+    if (theme === 'rose') {
+        return '#ff8fc7';
+    }
+    if (theme === 'slate') {
+        return '#9fb4cf';
+    }
+    if (theme === 'mono') {
+        return '#d0d0d0';
+    }
+    return '#74f28a';
+}
+export function themeContributionColors(theme) {
+    if (theme === 'amber') {
+        return ['#161b22', '#5f3700', '#9a6200', '#d68a00', '#ffb000'];
+    }
+    if (theme === 'blue') {
+        return ['#161b22', '#12385f', '#1f6feb', '#3388dd', '#53a8ff'];
+    }
+    if (theme === 'ruby') {
+        return ['#161b22', '#4c1230', '#8f274f', '#c93f68', '#ff5f87'];
+    }
+    if (theme === 'ice') {
+        return ['#161b22', '#24474d', '#4a95a0', '#86dce8', '#b9f6ff'];
+    }
+    if (theme === 'teal') {
+        return ['#161b22', '#123f3c', '#1f766c', '#2dd4bf', '#5eead4'];
+    }
+    if (theme === 'violet') {
+        return ['#161b22', '#302047', '#5b3f8f', '#7c5cff', '#a78bfa'];
+    }
+    if (theme === 'copper') {
+        return ['#161b22', '#44281f', '#7f4f37', '#b86f52', '#d08770'];
+    }
+    if (theme === 'cyan') {
+        return ['#161b22', '#0e3b42', '#168a9e', '#22b8cf', '#22d3ee'];
+    }
+    if (theme === 'lime') {
+        return ['#161b22', '#2f3d12', '#5f7d1f', '#84b32b', '#a3e635'];
+    }
+    if (theme === 'coral') {
+        return ['#161b22', '#4c2018', '#9a4032', '#d65c49', '#ff7e6b'];
+    }
+    if (theme === 'rose') {
+        return ['#161b22', '#4c2238', '#8f3f6a', '#d65c9a', '#ff8fc7'];
+    }
+    if (theme === 'slate') {
+        return ['#161b22', '#2a3340', '#4f6178', '#7c91ab', '#9fb4cf'];
+    }
+    if (theme === 'mono') {
+        return ['#161b22', '#3a3a3a', '#767676', '#b0b0b0', '#d0d0d0'];
+    }
+    return ['#161b22', '#0e4429', '#26a641', '#39d353', '#74f28a'];
+}
+export function nextTheme(theme) {
+    const index = themeNames.indexOf(theme);
+    return themeNames[(index + 1) % themeNames.length] ?? 'green';
+}
+export function nextReceiverStyle(style) {
+    const index = receiverStyles.indexOf(style);
+    return receiverStyles[(index + 1) % receiverStyles.length] ?? defaultReceiverStyle;
+}