@ciphore/radiocli 0.2.5 → 0.2.6

package/CHANGELOG.md

@@ -2,6 +2,38 @@
 
 All notable changes to RadioCLI are documented in this file.
 
+## [0.2.6] - 2026-10-28
+
+### Added
+
+- Added the Boat Lake receiver, bringing the collection to 64 animated styles.
+- Expanded the display palette from 14 to 48 colors, with matching listening
+  activity shades and color choices in the website receiver gallery.
+
+### Changed
+
+- Refined Sumi Ocean with a clearer moon, moving water, and wider reflections
+  that remain readable in compact and micro layouts.
+- Updated the website receiver previews and project demos to match the terminal
+  renderers, including Boat Lake, Sumi Ocean, and the expanded color palette.
+
+### Fixed
+
+- Prevented long-running animated receiver sessions from exhausting Node.js
+  memory, including Manhattan and the other scenery styles, across full,
+  compact, and micro layouts.
+- Kept normal TUI launches on the production React runtime while preserving
+  explicitly enabled development diagnostics.
+- Preserved new colors and receiver selections while older RadioCLI and MCP
+  processes continue reading and writing the same library.
+- Avoided transient library-lock failures on Windows while another writer
+  releases its lock.
+
+### Security
+
+- Updated Zod and Undici to patched versions within their existing dependency
+  ranges.
+
 ## [0.2.5] - 2026-10-18
 
 ### Added
@@ -546,3 +578,4 @@ Initial public release.
 [0.1.2]: https://github.com/Ciphore/RadioCLI/releases/tag/v0.1.2
 [0.1.1]: https://github.com/Ciphore/RadioCLI/releases/tag/v0.1.1
 [0.2.5]: https://github.com/Ciphore/RadioCLI/releases/tag/v0.2.5
+[0.2.6]: https://github.com/Ciphore/RadioCLI/releases/tag/v0.2.6

package/CONTRIBUTING.md

@@ -95,6 +95,24 @@ major screens, and receiver styles. Preserve Unicode captures. When rendering
 changes intentionally, describe the visible effect in the pull request and do
 not update snapshots merely to hide failures.
 
+Receiver changes also run an isolated real-Ink memory regression in the normal
+test suite. For a longer accelerated soak (frames run without the 80 ms delay):
+
+```bash
+node --expose-gc --import tsx scripts/receiver-memory-smoke.mjs --frames=10000
+```
+
+The harness updates one persistent Ink root, discards terminal output, waits
+for each frame to flush, and compares
+post-GC JavaScript heap after warmup; RSS includes allocator high-water memory
+and is recorded separately. It cycles scenery, sizes, themes, ASCII, and
+background settings. Like the CLI, it defaults to the production React runtime
+before loading the renderer. An explicit `NODE_ENV=development` keeps React's
+developer diagnostics, including profiling entries retained by Node; use the
+production runtime for memory acceptance. Node 26 has an additional receiver-only CI check on Linux,
+macOS, and Windows for issue #55; this does not replace the full Node 22/24
+platform matrix or establish full Node 26 platform verification.
+
 ## Issue Triage
 
 Playback issues should include station name, country, backend, and

package/README.md

@@ -4,7 +4,7 @@ RadioCLI is an open-source internet radio player with a full-screen terminal
 interface and a scriptable CLI. Discover and stream stations from around the
 world without leaving your terminal. No account. No cloud library.
 
-[![CI](https://github.com/Ciphore/RadioCLI/actions/workflows/ci.yml/badge.svg?branch=master)](https://github.com/Ciphore/RadioCLI/actions/workflows/ci.yml)
+[![CI](https://github.com/Ciphore/RadioCLI/actions/workflows/ci.yml/badge.svg?branch=master&event=push)](https://github.com/Ciphore/RadioCLI/actions/workflows/ci.yml?query=branch%3Amaster+event%3Apush)
 [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
 [![Node.js](https://img.shields.io/badge/node-%3E%3D22-brightgreen.svg)](package.json)
 
@@ -16,9 +16,9 @@ world without leaving your terminal. No account. No cloud library.
   codec, and bitrate, or browse country lists. The interactive world map uses a
   cached station atlas to find broadcasts around the map cursor and sort them by
   distance. Cached directory results remain available during provider outages.
-- **63 receiver styles:** Switch between braille animation, ASCII geometry,
+- **64 receiver styles:** Switch between braille animation, ASCII geometry,
   waves, fire, cityscapes, and the Gallop display without interrupting
-  playback. Color themes are selected independently. Receivers animate during
+  playback. Choose from 48 color themes independently. Receivers animate during
   active playback and return to a zero-signal display when audio is inactive.
 - **Listening stats:** A 52-week activity graph, listening time, session counts,
   active days, streaks, and your most-listened station. Stats are recorded locally

package/dist/cli.js

@@ -36,6 +36,10 @@ if (isDirectRun(process.argv[1], import.meta.url)) {
     }
 }
 async function renderTui(encodedCommand) {
+    // React's development profiler retains per-frame timing entries in Node.
+    // Choose the production runtime before loading Ink or JSX; explicit developer
+    // environments still take precedence.
+    process.env.NODE_ENV ??= 'production';
     const { renderTui: render } = await import('./cli/render-tui.js');
     await render(printHelp, encodedCommand);
 }

package/dist/storage/file-lock.js

@@ -5,9 +5,21 @@ import { performance } from 'node:perf_hooks';
 /** An owner is never evicted for being slow. Only a positively dead PID or an
  * explicitly released generation can be reclaimed. Unknown/legacy locks fail
  * closed; their age cannot distinguish a crashed writer from a suspended one. */
-export function acquireFileLock(directory, timeoutMs = 1000) {
+export function acquireFileLock(directory, timeoutMs = 1000, platform = process.platform) {
     const marker = `owner-${process.pid}-${randomUUID()}`;
     const deadline = performance.now() + timeoutMs;
+    const pause = new Int32Array(new SharedArrayBuffer(4));
+    const retry = (error) => {
+        if (performance.now() >= deadline) {
+            if (error)
+                throw error;
+            throw Object.assign(new Error('The library lock has a live or unknown owner.'), { code: 'EBUSY' });
+        }
+        Atomics.wait(pause, 0, 0, 10);
+    };
+    // Windows can briefly deny access while a previous lock directory is pending
+    // deletion. Retry only before ownership, without treating denial as absence.
+    const transient = (error) => platform === 'win32' && ['EACCES', 'EPERM', 'EBUSY'].includes(codeOf(error) ?? '');
     while (true) {
         let acquired = false;
         try {
@@ -15,8 +27,12 @@ export function acquireFileLock(directory, timeoutMs = 1000) {
             acquired = true;
         }
         catch (error) {
-            if (codeOf(error) !== 'EEXIST')
-                throw error;
+            if (codeOf(error) !== 'EEXIST') {
+                if (!transient(error))
+                    throw error;
+                retry(error);
+                continue;
+            }
         }
         if (acquired) {
             try {
@@ -54,13 +70,14 @@ export function acquireFileLock(directory, timeoutMs = 1000) {
             }
         }
         catch (error) {
-            if (codeOf(error) !== 'ENOENT')
-                throw error;
-        }
-        if (performance.now() >= deadline) {
-            throw Object.assign(new Error('The library lock has a live or unknown owner.'), { code: 'EBUSY' });
+            if (codeOf(error) !== 'ENOENT') {
+                if (!transient(error))
+                    throw error;
+                retry(error);
+                continue;
+            }
         }
-        Atomics.wait(new Int32Array(new SharedArrayBuffer(4)), 0, 0, 10);
+        retry();
     }
 }
 function isDead(pid) {

package/dist/storage/store.js

@@ -18,16 +18,36 @@ const defaultMediaKeys = {
     next: []
 };
 const MAX_ALARMS = 500;
-// Keep the shared library readable by pre-scene releases whose background MCP
-// workers quarantine an entire library when they see an unfamiliar enum value.
-// Crossfade is the last style understood by those releases. New styles live in
-// a separate preference file that old writers never read or overwrite.
-const sharedLibraryReceiverStyles = new Set(receiverStyleNames.slice(0, receiverStyleNames.indexOf('crossfade') + 1));
+// Freeze the 0.2.5 enum independently of UI ordering. New styles must stay out
+// of both its shared library and its strictly validated .receiver.json sidecar.
+// The new namespace is ignored by old playback/MCP readers and writers.
+const sharedLibraryReceiverStyles = new Set([
+    'ultracode', 'pulse-grid', 'hex-pulse', 'moire', 'galaxy', 'cyclone', 'nebula', 'lava-lamp',
+    'gallop-fine', 'motion-contour', 'ribbon', 'braille-wave', 'silk', 'lissajous', 'harmonograph',
+    'spirograph', 'goniometer', 'radial-eq', 'spectrogram', 'caustics', 'ripple-tank', 'leds',
+    'matrix', 'cascade', 'ordered-dither', 'xor-texture', 'pixel-crush', 'copper-bars',
+    'rotozoomer', 'mesh', 'hologram', 'equalizer', 'tunnel', 'kaleidoscope', 'phosphene',
+    'phyllotaxis', 'chladni', 'newton', 'cube', 'spinning-donut', 'tesseract', 'torus-knot',
+    'twister', 'lorenz', 'fern', 'fractal-tree', 'julia', 'neural-net', 'constellation',
+    'starfield', 'fireworks', 'fire', 'aurora', 'stormfront', 'planetarium', 'sumi-ocean',
+    'liftoff', 'flyover', 'skyline', 'golden-gate', 'manhattan', 'alpine', 'crossfade'
+]);
 const receiverPreferenceSchema = z.object({
     version: z.literal(1),
     receiverStyle: z.preprocess(migrateReceiverStyle, z.enum(receiverStyleNames)),
     libraryReceiverStyle: z.literal('ultracode')
 });
+// Older playback/MCP processes validate this original enum on every refresh.
+// New colors must stay out of their shared JSON, even after unrelated saves.
+const sharedLibraryThemes = new Set([
+    'green', 'amber', 'blue', 'ruby', 'ice', 'teal', 'violet', 'copper',
+    'cyan', 'lime', 'coral', 'rose', 'slate', 'mono'
+]);
+const themePreferenceSchema = z.object({
+    version: z.literal(1),
+    theme: z.enum(themeNames),
+    libraryTheme: z.literal('green')
+});
 const settingsSchema = z.object({
     theme: z.enum(themeNames).default('green'),
     receiverStyle: z.preprocess(migrateReceiverStyle, z.enum(receiverStyleNames).default(defaultReceiverStyle)),
@@ -239,7 +259,8 @@ export class JsonLibraryStore {
         this.state = this.read();
         // Normalize libraries saved by an earlier preview before any legacy
         // background reader encounters its new enum value again.
-        if (!sharedLibraryReceiverStyles.has(this.state.settings.receiverStyle) && !existsSync(this.receiverPreferencePath()))
+        if ((!sharedLibraryReceiverStyles.has(this.state.settings.receiverStyle) && !existsSync(this.receiverPreferenceV2Path())) ||
+            (!sharedLibraryThemes.has(this.state.settings.theme) && !existsSync(this.themePreferencePath())))
             this.commit(this.state);
     }
     snapshot() {
@@ -264,7 +285,7 @@ export class JsonLibraryStore {
         return structuredClone(this.state.settings);
     }
     diskRevision() {
-        return [this.filePath, this.receiverPreferencePath()].map(file => {
+        return [this.filePath, this.receiverPreferencePath(), this.receiverPreferenceV2Path(), this.themePreferencePath()].map(file => {
             try {
                 const info = statSync(file, { bigint: true });
                 return `${info.ino}:${info.size}:${info.mtimeNs}:${info.ctimeNs}`;
@@ -623,10 +644,10 @@ export class JsonLibraryStore {
         }
         catch (error) {
             if (error instanceof z.ZodError && error.issues.some(issue => issue.code === 'invalid_value' && issue.path.length === 2 &&
-                issue.path[0] === 'settings' && issue.path[1] === 'receiverStyle')) {
-                // Another running build may have saved a newer receiver. Its library
+                issue.path[0] === 'settings' && (issue.path[1] === 'receiverStyle' || issue.path[1] === 'theme'))) {
+                // Another running build may have saved a newer appearance. Its library
                 // is intact: never quarantine it or replace it with empty defaults.
-                throw new Error('The RadioCLI library uses a receiver style this process does not support. Restart RadioCLI and its MCP clients to load the updated styles.');
+                throw new Error('The RadioCLI library uses a display color or receiver style this process does not support. Restart RadioCLI and its MCP clients to load the updated colors and styles.');
             }
             try {
                 assertStorageWritable(this.filePath);
@@ -640,23 +661,47 @@ export class JsonLibraryStore {
         }
         // A legacy writer can still change ordinary preferences and favorites. Its
         // fallback style must not erase the selection saved by an updated process.
+        // The newer namespace wins over a leftover preview preference. Continue
+        // reading the old namespace when no newer selection has been saved.
+        for (const path of [this.receiverPreferenceV2Path(), this.receiverPreferencePath()]) {
+            let preference;
+            try {
+                preference = readFileSync(path, 'utf8');
+            }
+            catch (error) {
+                if (error.code === 'ENOENT')
+                    continue;
+                throw storageError('read the receiver preference', error);
+            }
+            const parsed = receiverPreferenceSchema.safeParse(JSON.parse(preference));
+            if (!parsed.success)
+                throw new Error('The RadioCLI receiver preference is unsupported or invalid. Restart RadioCLI and its MCP clients with the latest version. Your library has been preserved.');
+            if (state.settings.receiverStyle === parsed.data.libraryReceiverStyle)
+                state.settings.receiverStyle = parsed.data.receiverStyle;
+            break;
+        }
+        return this.readThemePreference(state);
+    }
+    receiverPreferencePath() { return `${this.filePath}.receiver.json`; }
+    receiverPreferenceV2Path() { return `${this.filePath}.receiver-v2.json`; }
+    themePreferencePath() { return `${this.filePath}.theme.json`; }
+    readThemePreference(state) {
         let preference;
         try {
-            preference = readFileSync(this.receiverPreferencePath(), 'utf8');
+            preference = readFileSync(this.themePreferencePath(), 'utf8');
         }
         catch (error) {
             if (error.code === 'ENOENT')
                 return state;
-            throw storageError('read the receiver preference', error);
+            throw storageError('read the display color preference', error);
         }
-        const parsed = receiverPreferenceSchema.safeParse(JSON.parse(preference));
+        const parsed = themePreferenceSchema.safeParse(JSON.parse(preference));
         if (!parsed.success)
-            throw new Error('The RadioCLI receiver preference is unsupported or invalid. Restart RadioCLI and its MCP clients with the latest version. Your library has been preserved.');
-        if (state.settings.receiverStyle === parsed.data.libraryReceiverStyle)
-            state.settings.receiverStyle = parsed.data.receiverStyle;
+            throw new Error('The RadioCLI display color preference is unsupported or invalid. Restart RadioCLI and its MCP clients with the latest version. Your library has been preserved.');
+        if (state.settings.theme === parsed.data.libraryTheme)
+            state.settings.theme = parsed.data.theme;
         return state;
     }
-    receiverPreferencePath() { return `${this.filePath}.receiver.json`; }
     readForCurrentSession() {
         const next = this.read();
         // Disk intentionally stores auto instead of reopening a receiver on launch.
@@ -685,36 +730,56 @@ export class JsonLibraryStore {
             mkdirSync(dirname(this.filePath), { recursive: true, mode: 0o700 });
             const diskState = libraryStateForDisk(state);
             const separateReceiver = !sharedLibraryReceiverStyles.has(state.settings.receiverStyle);
-            const preferencePath = this.receiverPreferencePath();
-            let previousPreference;
-            try {
-                previousPreference = readFileSync(preferencePath, 'utf8');
-            }
-            catch (error) {
-                if (error.code !== 'ENOENT')
-                    throw error;
-            }
-            const nextPreference = separateReceiver
-                ? `${JSON.stringify({ version: 1, receiverStyle: state.settings.receiverStyle, libraryReceiverStyle: 'ultracode' }, null, 2)}\n`
-                : undefined;
-            const preferenceChanged = previousPreference !== nextPreference;
-            if (preferenceChanged) {
-                if (nextPreference === undefined)
-                    rmSync(preferencePath);
-                else
-                    writeTextAtomically(preferencePath, nextPreference);
-            }
+            const separateTheme = !sharedLibraryThemes.has(state.settings.theme);
+            const preferences = [
+                {
+                    path: this.receiverPreferenceV2Path(),
+                    next: separateReceiver
+                        ? `${JSON.stringify({ version: 1, receiverStyle: state.settings.receiverStyle, libraryReceiverStyle: 'ultracode' }, null, 2)}\n`
+                        : undefined
+                },
+                { path: this.receiverPreferencePath(), next: undefined },
+                {
+                    path: this.themePreferencePath(),
+                    next: separateTheme
+                        ? `${JSON.stringify({ version: 1, theme: state.settings.theme, libraryTheme: 'green' }, null, 2)}\n`
+                        : undefined
+                }
+            ].map(preference => {
+                let previous;
+                try {
+                    previous = readFileSync(preference.path, 'utf8');
+                }
+                catch (error) {
+                    if (error.code !== 'ENOENT')
+                        throw error;
+                }
+                return { ...preference, previous };
+            }).filter(preference => preference.previous !== preference.next);
+            const applied = [];
             try {
-                writeJsonAtomically(this.filePath, separateReceiver
-                    ? { ...diskState, settings: { ...diskState.settings, receiverStyle: 'ultracode' } }
-                    : diskState);
+                for (const preference of preferences) {
+                    if (preference.next === undefined)
+                        rmSync(preference.path);
+                    else
+                        writeTextAtomically(preference.path, preference.next);
+                    applied.push(preference);
+                }
+                writeJsonAtomically(this.filePath, {
+                    ...diskState,
+                    settings: {
+                        ...diskState.settings,
+                        ...(separateReceiver ? { receiverStyle: 'ultracode' } : {}),
+                        ...(separateTheme ? { theme: 'green' } : {})
+                    }
+                });
             }
             catch (error) {
-                if (preferenceChanged) {
-                    if (previousPreference === undefined)
-                        rmSync(preferencePath, { force: true });
+                for (const preference of applied.reverse()) {
+                    if (preference.previous === undefined)
+                        rmSync(preference.path, { force: true });
                     else
-                        writeTextAtomically(preferencePath, previousPreference);
+                        writeTextAtomically(preference.path, preference.previous);
                 }
                 throw error;
             }

package/dist/types.js

@@ -1,7 +1,28 @@
 import { defaultReceiverStyle, receiverStyleNames } from './ui/visualizers/receiver-style-registry.js';
 export { defaultReceiverStyle, receiverStyleNames };
 const providerIds = ['radio-browser', 'radio-garden', 'playlist'];
-export const themeNames = ['green', 'amber', 'blue', 'ruby', 'ice', 'teal', 'violet', 'copper', 'cyan', 'lime', 'coral', 'rose', 'slate', 'mono'];
+export const themeNames = [
+    // Reds
+    'vermilion', 'scarlet',
+    // Oranges and earth tones
+    'cocoa', 'copper', 'tangerine', 'blaze-orange', 'coral', 'apricot',
+    // Golds and creams
+    'bronze', 'amber', 'sunflower', 'butter', 'parchment', 'ivory',
+    // Yellow greens
+    'olive', 'lime', 'chartreuse', 'acid-yellow', 'pistachio',
+    // Greens
+    'pine', 'laser-green', 'green',
+    // Teals and cyans
+    'midnight-teal', 'jade', 'teal', 'cyan', 'ice',
+    // Blues
+    'cobalt', 'blue', 'slate', 'periwinkle', 'ultramarine', 'indigo',
+    // Purples and mauves
+    'neon-violet', 'violet', 'aubergine', 'plum', 'heather', 'dusty-mauve',
+    // Magentas and pinks
+    'hot-magenta', 'wineberry', 'raspberry', 'ruby', 'dracula-pink', 'rose', 'blush',
+    // Neutrals
+    'soft-silver', 'mono'
+];
 export const defaultAgentControlSettings = {
     enabled: false,
     openUiOnPlay: true,

package/dist/ui/AdaptiveContent.js

@@ -19,6 +19,7 @@ import { formatExploreCursor } from './app-state.js';
 import { buildCosmoWorldMap } from './cosmo-world-map.js';
 import { adaptiveExploreFrameMetrics, computeAdaptiveExploreLayout } from './adaptive-explore-layout.js';
 import { AdaptiveMarquee } from './components/AdaptiveMarquee.js';
+import { ReceiverVisualRow } from './components/ReceiverVisualRow.js';
 export function AdaptiveContent(props) {
     return _jsx(AdaptiveContentBody, { ...props });
 }
@@ -225,7 +226,7 @@ function StaticRows({ rows, width, theme }) {
 }
 function AdaptiveNowPlaying({ mode, station, playback, metadata, width, height, ascii, theme, receiverStyle, reduceMotion }) {
     const pulse = useReceiverPulse();
-    const { screenReader } = useDisplay();
+    const { screenReader, app: appBackground } = useDisplay();
     const accent = themeAccent(theme);
     const stationName = station?.name ?? 'No station tuned';
     const showMetadata = Boolean(metadata?.title) && (screenReader || mode === 'compact' && height >= 9);
@@ -241,19 +242,7 @@ function AdaptiveNowPlaying({ mode, station, playback, metadata, width, height,
     const status = `${stationName}  ${playback.state}${playback.muted ? ' · muted' : ` · vol ${playback.volume}`}`;
     return (_jsxs(Box, { flexDirection: "column", height: height, width: width, overflow: "hidden", children: [_jsx(Text, { color: accent, bold: true, "aria-label": mode === 'micro' ? `Now playing. Station: ${stationName}. Playback: ${playback.state}, ${playback.muted ? 'muted' : `volume ${playback.volume}`}` : undefined, children: mode === 'micro'
                     ? _jsx(AdaptiveMarquee, { text: header, width: width, active: true, reduceMotion: reduceMotion })
-                    : truncate(header, width) }), mode === 'compact' ? _jsx(Text, { color: textMuted, "aria-label": `Station: ${stationName}. Playback: ${playback.state}, ${playback.muted ? 'muted' : `volume ${playback.volume}`}`, children: ascii ? toAsciiSafe(truncate(status, width)) : truncate(status, width) }) : null, gapRows ? _jsx(Box, { height: gapRows, flexShrink: 0 }) : null, !screenReader ? _jsx(Box, { flexDirection: "column", height: availableVisualRows, overflow: "hidden", "aria-hidden": true, children: visualRows.map((row, index) => (_jsx(Text, { color: row.segments ? undefined : row.color, children: row.segments
-                        ? renderAdaptiveSegments(row.segments, ascii)
-                        : ascii
-                            ? toAsciiSafe(row.text)
-                            : row.text }, index))) }) : null, showMetadata ? (_jsx(Text, { color: accent, "aria-label": `Track: ${metadata?.title ?? ''}`, children: _jsx(AdaptiveMarquee, { text: metadata?.title ?? '', width: width, active: true, reduceMotion: reduceMotion }) })) : null, gapRows ? _jsx(Box, { height: gapRows, flexShrink: 0 }) : null] }));
-}
-function renderAdaptiveSegments(segments, ascii) {
-    let offset = 0;
-    return segments.map(segment => {
-        const key = offset;
-        offset += segment.text.length;
-        return (_jsx(Text, { color: segment.color, backgroundColor: segment.backgroundColor, bold: segment.bold, children: ascii ? toAsciiSafe(segment.text) : segment.text }, key));
-    });
+                    : truncate(header, width) }), mode === 'compact' ? _jsx(Text, { color: textMuted, "aria-label": `Station: ${stationName}. Playback: ${playback.state}, ${playback.muted ? 'muted' : `volume ${playback.volume}`}`, children: ascii ? toAsciiSafe(truncate(status, width)) : truncate(status, width) }) : null, gapRows ? _jsx(Box, { height: gapRows, flexShrink: 0 }) : null, !screenReader ? _jsx(Box, { flexDirection: "column", height: availableVisualRows, overflow: "hidden", "aria-hidden": true, children: visualRows.map((row, index) => (_jsx(ReceiverVisualRow, { row: row, width: width, ascii: ascii, backgroundColor: appBackground }, index))) }) : null, showMetadata ? (_jsx(Text, { color: accent, "aria-label": `Track: ${metadata?.title ?? ''}`, children: _jsx(AdaptiveMarquee, { text: metadata?.title ?? '', width: width, active: true, reduceMotion: reduceMotion }) })) : null, gapRows ? _jsx(Box, { height: gapRows, flexShrink: 0 }) : null] }));
 }
 function AdaptiveSearch({ mode, query, editing, loading, rows, empty, selected, height, width, theme, ascii, reduceMotion }) {
     const accent = themeAccent(theme);

package/dist/ui/components/ReceiverVisualRow.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Transform } from 'ink';
+import { Chalk } from 'chalk';
+import { toAsciiSafe } from '../ascii.js';
+import { useDisplay } from '../display-context.js';
+import { displayWidth, sliceDisplay } from '../format.js';
+const colors = [0, 1, 2, 3].map(level => new Chalk({ level: level }));
+/** Keep animated text out of Ink 7's process-lifetime measurement/wrap caches.
+ * Transform must be a direct child of a Box, never nested inside Text: nested
+ * transforms are flattened before measurement. Only the fixed-width blank is
+ * measured; the current frame is styled at output time and then discarded.
+ */
+export function ReceiverVisualRow({ row, width, ascii, backgroundColor }) {
+    const { colorLevel } = useDisplay();
+    const chalk = colors[colorLevel];
+    const segments = row.segments ?? [{ text: row.text, color: row.color }];
+    const placeholder = ' '.repeat(Math.max(0, width));
+    return _jsx(Transform, { transform: visiblePlaceholder => {
+            // Ink clips before invoking Transform. Respect the remaining width so a
+            // narrow terminal cannot receive a full row after clipping the placeholder.
+            let remaining = displayWidth(visiblePlaceholder);
+            let output = '';
+            for (const segment of segments) {
+                const source = ascii ? toAsciiSafe(segment.text) : segment.text;
+                const text = sliceDisplay(source, 0, remaining);
+                remaining -= displayWidth(text);
+                let styled = chalk.hex(segment.color)(text);
+                const background = segment.backgroundColor ?? backgroundColor;
+                if (background)
+                    styled = chalk.bgHex(background)(styled);
+                if (segment.bold)
+                    styled = chalk.bold(styled);
+                output += styled;
+                if (remaining <= 0 || text !== source)
+                    break;
+            }
+            return output;
+        }, children: placeholder });
+}

package/dist/ui/screens/NowPlayingScreen.js

@@ -7,6 +7,7 @@ import { toAsciiSafe } from '../ascii.js';
 import { ScreenHeader } from '../components/ScreenHeader.js';
 import { buildVisualizer, visualizerHeight } from '../visualizers/receiver-visualizers.js';
 import { useReceiverPulse } from '../receiver-animation.js';
+import { ReceiverVisualRow } from '../components/ReceiverVisualRow.js';
 // Terminal rows are roughly twice as tall as columns are wide. One vertical
 // row and three horizontal columns produce a closer optical inset around the
 // highest and lowest visible text than a mechanically equal cell count.
@@ -40,18 +41,8 @@ export function NowPlayingScreen({ station, playback, metadata, theme, favorite,
         : station
             ? 'Waiting for ICY track metadata'
             : infoFallback;
-    const renderRows = ascii ? visualRows.map(asciifyVisualRow) : visualRows;
     const favoriteText = favorite ? '★ Favorite' : '☆ Favorite';
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Now playing", width: panelWidth, theme: theme }), _jsxs(Box, { borderStyle: panelBorderStyle(ascii), borderColor: accent, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, flexDirection: "column", paddingX: receiverPaddingX, paddingY: receiverPaddingY, width: panelWidth, height: panelHeight, children: [_jsxs(Box, { justifyContent: "space-between", width: innerWidth, flexShrink: 0, children: [_jsxs(Box, { width: identityWidth, overflow: "hidden", "aria-label": `Station: ${station?.name ?? 'No station tuned'}${station ? `, ${stationLocation(station)}` : ''}`, children: [_jsx(Text, { color: accent, bold: true, children: a(stationIdentity.name) }), stationIdentity.location ? _jsx(Text, { color: textMuted, children: a(` · ${stationIdentity.location}`) }) : null] }), _jsx(Text, { color: accent, "aria-label": `Playback: ${playback.state}, ${playback.muted ? 'muted' : `volume ${playback.volume}`}`, children: receiverState })] }), !screenReader ? _jsx(Box, { marginTop: visualizerGutterRows, flexDirection: "column", flexShrink: 1, overflow: "hidden", "aria-hidden": true, children: renderRows.map((row, index) => (_jsx(Text, { color: row.segments ? undefined : row.color, children: row.segments
-                                ? renderSegments(row.segments)
-                                : row.text }, index))) }) : null, _jsxs(Box, { marginTop: visualizerGutterRows, justifyContent: "space-between", width: innerWidth, flexShrink: 0, children: [_jsx(Text, { color: metadata?.title ? accent : textMuted, "aria-label": metadata?.title ? `Track: ${metadata.title}` : undefined, children: a(metadataLine) }), _jsx(Text, { color: favorite ? 'yellow' : textMuted, "aria-label": favorite ? 'Favorite' : 'Not a favorite', children: a(favoriteText) })] }), showDiagnostics ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: textMuted, children: "Diagnostics" }), _jsx(Text, { color: textMuted, children: a(`Stream: ${diagnostics.streamUrl ? truncate(diagnostics.streamUrl, innerWidth - 8) : 'none'}`) }), _jsx(Text, { color: textMuted, children: a(`Station time: ${stationTime}`) }), _jsx(Text, { color: textMuted, children: a(`Started: ${diagnostics.startedAt ? new Date(diagnostics.startedAt).toLocaleTimeString() : 'not playing'} · available ${diagnostics.availableBackends.join(', ') || 'none'}`) }), stationTracks.length > 0 ? (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: textMuted, children: "Recent tracks" }), stationTracks.map(track => (_jsx(Text, { color: textMuted, children: a(`· ${truncate(track.title, innerWidth - 2)}`) }, `${track.at}-${track.title}`)))] })) : null] })) : null] })] }));
-}
-function asciifyVisualRow(row) {
-    return {
-        ...row,
-        text: toAsciiSafe(row.text),
-        segments: row.segments?.map(segment => ({ ...segment, text: toAsciiSafe(segment.text) }))
-    };
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScreenHeader, { title: "Now playing", width: panelWidth, theme: theme }), _jsxs(Box, { borderStyle: panelBorderStyle(ascii), borderColor: accent, borderBackgroundColor: panelBackground, backgroundColor: panelBackground, flexDirection: "column", paddingX: receiverPaddingX, paddingY: receiverPaddingY, width: panelWidth, height: panelHeight, children: [_jsxs(Box, { justifyContent: "space-between", width: innerWidth, flexShrink: 0, children: [_jsxs(Box, { width: identityWidth, overflow: "hidden", "aria-label": `Station: ${station?.name ?? 'No station tuned'}${station ? `, ${stationLocation(station)}` : ''}`, children: [_jsx(Text, { color: accent, bold: true, children: a(stationIdentity.name) }), stationIdentity.location ? _jsx(Text, { color: textMuted, children: a(` · ${stationIdentity.location}`) }) : null] }), _jsx(Text, { color: accent, "aria-label": `Playback: ${playback.state}, ${playback.muted ? 'muted' : `volume ${playback.volume}`}`, children: receiverState })] }), !screenReader ? _jsx(Box, { marginTop: visualizerGutterRows, flexDirection: "column", flexShrink: 1, overflow: "hidden", "aria-hidden": true, children: visualRows.map((row, index) => (_jsx(ReceiverVisualRow, { row: row, width: innerWidth, ascii: ascii, backgroundColor: panelBackground }, index))) }) : null, _jsxs(Box, { marginTop: visualizerGutterRows, justifyContent: "space-between", width: innerWidth, flexShrink: 0, children: [_jsx(Text, { color: metadata?.title ? accent : textMuted, "aria-label": metadata?.title ? `Track: ${metadata.title}` : undefined, children: a(metadataLine) }), _jsx(Text, { color: favorite ? 'yellow' : textMuted, "aria-label": favorite ? 'Favorite' : 'Not a favorite', children: a(favoriteText) })] }), showDiagnostics ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: textMuted, children: "Diagnostics" }), _jsx(Text, { color: textMuted, children: a(`Stream: ${diagnostics.streamUrl ? truncate(diagnostics.streamUrl, innerWidth - 8) : 'none'}`) }), _jsx(Text, { color: textMuted, children: a(`Station time: ${stationTime}`) }), _jsx(Text, { color: textMuted, children: a(`Started: ${diagnostics.startedAt ? new Date(diagnostics.startedAt).toLocaleTimeString() : 'not playing'} · available ${diagnostics.availableBackends.join(', ') || 'none'}`) }), stationTracks.length > 0 ? (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { color: textMuted, children: "Recent tracks" }), stationTracks.map(track => (_jsx(Text, { color: textMuted, children: a(`· ${truncate(track.title, innerWidth - 2)}`) }, `${track.at}-${track.title}`)))] })) : null] })) : null] })] }));
 }
 export function recentTracksForStation(history, station, limit) {
     if (!station) {
@@ -74,13 +65,3 @@ export function receiverStationIdentity(station, width) {
         location: truncate(stationLocation(station).toUpperCase(), locationWidth)
     };
 }
-function renderSegments(segments) {
-    let offset = 0;
-    return segments.map(segment => {
-        // Keep identity tied to geometry, not animated color. Color-bearing keys
-        // forced React to unmount and recreate hundreds of Text nodes per frame.
-        const key = offset;
-        offset += segment.text.length;
-        return (_jsx(Text, { color: segment.color, backgroundColor: segment.backgroundColor, bold: segment.bold, children: segment.text }, key));
-    });
-}

package/dist/ui/theme.js

@@ -13,7 +13,46 @@ export const mapLand = '#33414f';
 export const mapWater = '#1a2430';
 export const mapMarker = '#7dd3fc';
 export const exploreMapLand = '#a0a0c0';
+const additionalThemeAccents = {
+    'acid-yellow': '#f4ff45',
+    'blaze-orange': '#ff8a1f',
+    'hot-magenta': '#ff2bd6',
+    ultramarine: '#6670ff',
+    vermilion: '#dc322f',
+    'dracula-pink': '#ff79c6',
+    'dusty-mauve': '#c49ab3',
+    parchment: '#ddd0aa',
+    'laser-green': '#39ff14',
+    heather: '#b48ead',
+    'soft-silver': '#bfc8cd',
+    tangerine: '#ff5900',
+    scarlet: '#ff1010',
+    raspberry: '#d02068',
+    indigo: '#5540d8',
+    periwinkle: '#9aa8ff',
+    jade: '#299e8c',
+    cobalt: '#0050ff',
+    plum: '#b02e94',
+    cocoa: '#946645',
+    ivory: '#fff4dc',
+    sunflower: '#ffd600',
+    butter: '#fff0a0',
+    olive: '#858e35',
+    apricot: '#ffb875',
+    blush: '#f0c3cb',
+    aubergine: '#793b71',
+    pistachio: '#c5d879',
+    wineberry: '#7e174b',
+    'midnight-teal': '#005d65',
+    'neon-violet': '#7200ff',
+    pine: '#006b3c',
+    chartreuse: '#c8ff00',
+    bronze: '#967400'
+};
 export function themeAccent(theme) {
+    const additionalAccent = additionalThemeAccents[theme];
+    if (additionalAccent)
+        return additionalAccent;
     if (theme === 'amber') {
         return '#ffb000';
     }
@@ -57,6 +96,13 @@ export function themeAccent(theme) {
 }
 export function themeContributionColors(theme) {
     const emptyContribution = '#1c1c1c';
+    const additionalAccent = additionalThemeAccents[theme];
+    if (additionalAccent) {
+        const channels = [1, 3, 5].map(offset => Number.parseInt(additionalAccent.slice(offset, offset + 2), 16));
+        // Blend from the empty cell so dark accents still have visible low levels.
+        const shades = [0.25, 0.5, 0.75].map(intensity => `#${channels.map(channel => Math.round(28 + (channel - 28) * intensity).toString(16).padStart(2, '0')).join('')}`);
+        return [emptyContribution, ...shades, additionalAccent];
+    }
     if (theme === 'amber') {
         return [emptyContribution, '#5f3700', '#9a6200', '#d68a00', '#ffb000'];
     }