@flyingrobots/bijou 4.2.0 → 4.4.1

package/README.md

@@ -2,15 +2,16 @@
 
 The pure, zero-dependency core of Bijou.
 
-`@flyingrobots/bijou` is the degradation-first terminal toolkit in the Bijou stack. It contains components, prompts, themes, environment detection, test adapters, and the foundational `Surface` and `LayoutNode` primitives that the interactive runtime builds on.
+`@flyingrobots/bijou` provides the foundational primitives for CLIs, prompts, and portable terminal output. It manages components, themes, environment detection, and the core `Surface` and `LayoutNode` types.
 
-## Package Role
+## Role
 
-- **Core/runtime split stays explicit** — the core package remains the right place for CLIs, prompts, logs, and portable terminal output, while `@flyingrobots/bijou-tui` owns the fullscreen runtime.
-- **Surface primitives without abandoning strings** — the package is intentionally mixed-mode. String-oriented helpers remain first-class where they fit the toolkit identity, and runtime-friendly surface helpers exist where they actually help.
-- **Surface-first companions for common runtime chrome** — `boxSurface`, `headerBoxSurface`, `separatorSurface`, `alertSurface`, and `tableSurface` let runtime apps stay on the `Surface` path for common layout and status primitives.
-- **Explicit seam crossing** — when you move `Surface` output back into string-first APIs, you do it deliberately with `surfaceToString(surface, ctx.style)`.
-- **Same hexagonal core** — ports, themes, output-mode detection, and test adapters remain pure and dependency-free.
+- **Degradation-First**: Automatic mode detection for `interactive`, `static`, `pipe`, and `accessible` output.
+- **Mixed-Mode**: High-performance `Surface` primitives for rich TUI apps, with
+  string-first helpers for standalone CLI scripts.
+- **Surface primitives without abandoning strings**: Runtime apps can stay on
+  the surface path while CLI-first flows still use the string-first helpers.
+- **Hexagonal Core**: Pure TypeScript logic isolated from platform IO via `Runtime`, `IO`, and `Style` ports.
 
 ## Install
 
@@ -24,7 +25,6 @@ npm install @flyingrobots/bijou @flyingrobots/bijou-node
 import { initDefaultContext } from '@flyingrobots/bijou-node';
 import { badge, boxSurface, tableSurface } from '@flyingrobots/bijou';
 
-// Initialize Node.js adapters (auto-detects TTY, CI, NO_COLOR)
 const ctx = initDefaultContext();
 
 const panel = boxSurface(
@@ -33,186 +33,46 @@ const panel = boxSurface(
     rows: [['api', badge('LIVE', { variant: 'success', ctx })]],
     ctx,
   }),
-  { title: 'Runtime', padding: { top: 1, bottom: 1, left: 2, right: 2 }, ctx },
+  {
+    title: 'Runtime',
+    padding: { top: 1, bottom: 1, left: 1, right: 1 },
+    ctx,
+  },
 );
-
-// Return `panel` from a runtime `view()` function or framed pane renderer.
 ```
 
-## Features Breakdown
-
-- **Resilient rendering**: automatic mode switching for interactive, static, pipe, and accessible output.
-- **Core UI primitives**: `box`, `headerBox`, `table`, `tree`, `accordion`, `tabs`, `breadcrumb`, `stepper`, `timeline`, `paginator`.
-- **Graph tooling**: `dag`, `dagSlice`, and `dagStats` for visualizing and analyzing DAGs.
-- **Interactive forms**: `input`, `select`, `multiselect`, `confirm`, `group`, `wizard`, `textarea`, and `filter`.
-- **Theme system**: preset themes + DTCG-compatible custom token loading via `BIJOU_THEME`.
-- **Test adapters**: deterministic test context and assertion helpers for mock-free component testing.
-
-## Design guidance
-
-For the system-level guidance behind the component catalog, see:
-
-- [`../../docs/design-system/README.md`](../../docs/design-system/README.md)
-- [`../../docs/design-system/foundations.md`](../../docs/design-system/foundations.md)
-- [`../../docs/design-system/patterns.md`](../../docs/design-system/patterns.md)
-- [`../../docs/design-system/component-families.md`](../../docs/design-system/component-families.md)
-
-Those docs answer the questions the API reference cannot:
-
-- when to use a family
-- when not to use it
-- which variation is semantic versus render-path versus interaction-layer
-- what belongs in core Bijou versus `@flyingrobots/bijou-tui`
-
-## Choosing Component Families
-
-### Status and feedback
-
-- Use `badge()` when status is compact and belongs inline with another object.
-- Use `note()` when the user needs explanation without urgency.
-- Use `alert()` when the message should persist inside the page or document flow.
-- Move to `@flyingrobots/bijou-tui` notifications when stacking, placement, actions, or history matter.
-
-### Selection and prompts
-
-- Use `select()` when the user is choosing one stored value from a short, stable set.
-- Use `filter()` when the user is still choosing one stored value, but search and narrowing are the real job.
-- Use `multiselect()` when the user is building a lasting set, not firing one-off commands.
-- Use `confirm()` only when the decision is genuinely binary.
-- Move to `commandPaletteSurface()` in `@flyingrobots/bijou-tui` when the outcome is an action or navigation command instead of stored form state.
-
-### Tables and inspection
-
-- Use `table()` when row/column comparison is the main job and string output is still the right endpoint.
-- Use `tableSurface()` when the job is still passive comparison, but your runtime app is already composing `Surface` output.
-- Use `navigableTable()` from `@flyingrobots/bijou-tui` when the user needs keyboard-owned row or cell inspection instead of passive reading.
-
-### Hierarchy and chronology
-
-- Use `tree()` when parent/child nesting is the main thing the reader needs to understand.
-- Use `timeline()` when chronology is the actual reading path.
-- Move to `dag()` when dependency or causal flow matters more than simple order or nesting.
-- Use `dagSlice()` when a local neighborhood or ancestor/descendant chain is the honest scope.
-- Use `dagStats()` when graph health or structural summary matters more than visual shape.
-
-### Wayfinding and progress
-
-- Use `breadcrumb()` when path context helps explain the current location.
-- Use `paginator()` when compact position-in-sequence feedback is enough.
-- Use `stepper()` when the user is progressing through ordered stages rather than switching among peers.
-
-### Containment and formatted content
-
-- Use `box()` when a region needs visible containment or comparison against sibling panels.
-- Use `headerBox()` when that same region also needs a compact title and detail line.
-- Use `markdown()` for bounded help, reference, and release-note prose that should lower honestly across rich, pipe, and accessible output.
-- Avoid turning every subsection into a box or using markdown as a substitute layout engine for full application chrome.
-
-### Loading, links, and expressive moments
-
-- Use `skeleton()` for short-lived placeholders when the final content shape is known.
-- Use `hyperlink()` when the destination itself should remain explicit and trustworthy in terminal output.
-- Use `kbd()` for local inline shortcut cues; use shell help in `@flyingrobots/bijou-tui` when the user needs a broader keybinding reference.
-- Use `gradientText()` and `loadRandomLogo()` sparingly for splash, docs, and celebratory moments rather than routine workspace chrome.
-
-### Progress and custom primitives
+## Strategy: Choosing Component Families
 
-- Use `progressBar()` when completion can be estimated honestly.
-- Use `spinnerFrame()` or `createSpinner()` when the task is active but indeterminate.
-- Use `renderByMode()` when you are authoring an app-specific primitive that must stay truthful across rich, pipe, and accessible output.
+Select the family based on the interaction semantic, not just the visual shape.
 
-## Components
+### Status and Feedback
+- **`badge()`**: Compact, inline status.
+- **`note()`**: Non-urgent explanation.
+- **`alert()`**: Persistent, in-flow message.
+- *Use `@flyingrobots/bijou-tui` notifications for stacking, history, or active routing.*
 
-### Layout
-`box()`, `headerBox()`, `separator()` plus `boxSurface()`, `headerBoxSurface()`, `separatorSurface()` — string-first helpers and surface-native companions for layout chrome.
+### Selection and Prompts
+- **`select()`**: Single choice from a stable set.
+- **`filter()`**: Search-led choice from a large or dynamic set.
+- **`multiselect()`**: Choosing multiple values to build a set.
+- **`confirm()`**: Strictly binary decisions.
 
-### Elements
-`badge()`, `alert()`, `alertSurface()`, `kbd()`, `skeleton()`, `hyperlink()` — inline status, in-flow status blocks, loading placeholders, trusted links, and UI primitives.
+### Hierarchy and Chronology
+- **`tree()`**: Parent/child nesting.
+- **`timeline()`**: Sequential, time-ordered events.
+- **`dag()`**: Causal or dependency-based graphs.
 
-### Data
-`table()`, `tableSurface()`, `tree()`, `accordion()`, `timeline()`, `dag()`, `dagSlice()`, `dagLayout()`, `dagStats()` — passive comparison and structured data display, DAG rendering with `DagSource` adapter, and graph statistics.
+### Progress and Wayfinding
+- **`progressBar()`**: Determinate completion.
+- **`spinner()`**: Indeterminate activity.
+- **`breadcrumb()`**: Path context.
+- **`stepper()`**: Ordered stages in a linear process.
 
-### Documents
-`markdown()` — structured terminal prose for help, readmes, and reference content with mode-aware lowering.
+## Documentation
 
-### Navigation
-`tabs()`, `breadcrumb()`, `stepper()`, `paginator()` — wayfinding components.
-
-### Animation & Progress
-`spinnerFrame()`, `createSpinner()`, `progressBar()`, `createProgressBar()`, `createAnimatedProgressBar()`, `gradientText()`, `loadRandomLogo()` — determinate and indeterminate progress, live-updating output, expressive gradients, and branded ASCII moments.
-
-### Authoring helpers
-`renderByMode()` — mode-aware helper for app-authored primitives that need honest rich/pipe/accessible lowering.
-
-### Forms
-`input()`, `select()`, `multiselect()`, `confirm()`, `group()`, `wizard()`, `textarea()`, `filter()` — interactive prompts with validation that degrade to numbered-list selection in pipe/CI modes.
-
-### Theme Engine
-DTCG (Design Tokens Community Group) interop. Built-in presets: `nord`, `catppuccin`, `cyan-magenta`, `teal-orange-pink`. Load custom themes via `BIJOU_THEME` env var or `extendTheme()`.
-
-## Architecture
-
-bijou uses a Ports and Adapters (hexagonal) architecture. See [ARCHITECTURE.md](./ARCHITECTURE.md) for the package-level design and [`../../docs/ARCHITECTURE.md`](../../docs/ARCHITECTURE.md) for the monorepo-wide architecture.
-
-The core is pure TypeScript with zero runtime dependencies — all platform concerns flow through three ports:
-
-- **`RuntimePort`** — environment variables, TTY detection, terminal dimensions
-- **`IOPort`** — stdout writes, stdin reads, resize events, file I/O
-- **`StylePort`** — RGB/hex color application, bold/italic/etc.
-
-### Output Modes
-
-bijou auto-detects the environment and adapts rendering:
-
-| Mode | Trigger | Behavior |
-| :--- | :--- | :--- |
-| **Interactive** | TTY | Full RGB, unicode, animations |
-| **Static** | `CI=true` | Single-frame, no animations |
-| **Pipe** | Piped stdout | Plain text, ASCII fallbacks |
-| **Accessible** | `BIJOU_ACCESSIBLE=1` | Screen-reader friendly |
-
-## Testing
-
-Import test adapters for deterministic, mock-free component testing:
-
-```typescript
-import { createTestContext } from '@flyingrobots/bijou/adapters/test';
-import { box } from '@flyingrobots/bijou';
-
-const ctx = createTestContext({ mode: 'interactive' });
-const result = box('hello', { ctx });
-// Assert on the string directly — no process mocking needed
-```
-
-See [GUIDE.md](./GUIDE.md) for more on testing, theming, and component usage.
-For upgrading existing apps, see the monorepo migration guide at [`../../docs/MIGRATING_TO_V4.md`](../../docs/MIGRATING_TO_V4.md).
-
-## Related Packages
-
-- [`@flyingrobots/bijou-node`](https://www.npmjs.com/package/@flyingrobots/bijou-node) — Node.js runtime adapter (chalk, readline, process)
-- [`@flyingrobots/bijou-tui`](https://www.npmjs.com/package/@flyingrobots/bijou-tui) — TEA runtime for interactive terminal apps
-
-## License
-
-Apache-2.0
+- **[GUIDE.md](./GUIDE.md)**: Productive-fast path.
+- **[ADVANCED_GUIDE.md](./ADVANCED_GUIDE.md)**: Rendering doctrine, themes, and testing.
+- **[Design System](../../docs/design-system/README.md)**: Semantic guidance and component families.
 
 ---
-
-<p align="center">
-Built with 💎 by <a href="https://github.com/flyingrobots">FLYING ROBOTS</a>
-</p>
-
-```rust
-.-:::::':::   .-:.     ::-.::::::.    :::.  .,-:::::/
-;;;'''' ;;;    ';;.   ;;;;';;;`;;;;,  `;;;,;;-'````'
-[[[,,== [[[      '[[,[[['  [[[  [[[[[. '[[[[[   [[[[[[/
-`$$$"`` $$'        c$$"    $$$  $$$ "Y$c$$"$$c.    "$$
- 888   o88oo,.__ ,8P"`     888  888    Y88 `Y8bo,,,o88o
- "MM,  """"YUMMMmM"        MMM  MMM     YM   `'YMUP"YMM
-:::::::..       ...     :::::::.      ...   :::::::::::: .::::::.
-;;;;``;;;;   .;;;;;;;.   ;;;'';;'  .;;;;;;;.;;;;;;;;'''';;;`    `
- [[[,/[[['  ,[[     \[[, [[[__[[\.,[[     \[[,   [[     '[==/[[[[,
- $$$$$$c    $$$,     $$$ $$""""Y$$$$$,     $$$   $$       '''    $
- 888b "88bo,"888,_ _,88P_88o,,od8P"888,_ _,88P   88,     88b    dP
- MMMM   "W"   "YMMMMMP" ""YUMMMP"   "YMMMMMP"    MMM      "YMmMY"
-```
+Built with 💎 by [FLYING ROBOTS](https://github.com/flyingrobots)

package/dist/context-theme.d.ts

@@ -0,0 +1,15 @@
+import type { BijouContext } from './ports/context.js';
+import { type ResolvedTheme } from './core/theme/resolve.js';
+import type { Theme } from './core/theme/tokens.js';
+/**
+ * Clone a Bijou context with a different already-resolved theme.
+ *
+ * The original context is left untouched; callers get a fresh object with
+ * the same runtime/style/IO ports and updated theme accessors.
+ */
+export declare function cloneContextWithResolvedTheme(ctx: BijouContext, theme: ResolvedTheme): BijouContext;
+/**
+ * Clone a Bijou context with a different theme definition.
+ */
+export declare function cloneContextWithTheme(ctx: BijouContext, theme: Theme): BijouContext;
+//# sourceMappingURL=context-theme.d.ts.map

package/dist/context-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-theme.d.ts","sourceRoot":"","sources":["../src/context-theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,EAAkB,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC7E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAEpD;;;;;GAKG;AACH,wBAAgB,6BAA6B,CAC3C,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,aAAa,GACnB,YAAY,CAOd;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,GAAG,EAAE,YAAY,EACjB,KAAK,EAAE,KAAK,GACX,YAAY,CAKd"}

package/dist/context-theme.js

@@ -0,0 +1,23 @@
+import { createThemeAccessors } from './core/theme/accessors.js';
+import { createResolved } from './core/theme/resolve.js';
+/**
+ * Clone a Bijou context with a different already-resolved theme.
+ *
+ * The original context is left untouched; callers get a fresh object with
+ * the same runtime/style/IO ports and updated theme accessors.
+ */
+export function cloneContextWithResolvedTheme(ctx, theme) {
+    return {
+        ...ctx,
+        theme,
+        tokenGraph: theme.tokenGraph,
+        ...createThemeAccessors(theme),
+    };
+}
+/**
+ * Clone a Bijou context with a different theme definition.
+ */
+export function cloneContextWithTheme(ctx, theme) {
+    return cloneContextWithResolvedTheme(ctx, createResolved(theme, ctx.theme.noColor, ctx.theme.colorScheme));
+}
+//# sourceMappingURL=context-theme.js.map

package/dist/context-theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-theme.js","sourceRoot":"","sources":["../src/context-theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,cAAc,EAAsB,MAAM,yBAAyB,CAAC;AAG7E;;;;;GAKG;AACH,MAAM,UAAU,6BAA6B,CAC3C,GAAiB,EACjB,KAAoB;IAEpB,OAAO;QACL,GAAG,GAAG;QACN,KAAK;QACL,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,GAAG,oBAAoB,CAAC,KAAK,CAAC;KAC/B,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,qBAAqB,CACnC,GAAiB,EACjB,KAAY;IAEZ,OAAO,6BAA6B,CAClC,GAAG,EACH,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,CAChE,CAAC;AACJ,CAAC"}

package/dist/core/components/alert-v3.js

@@ -3,10 +3,10 @@ import { resolveSafeCtx as resolveCtx } from '../resolve-ctx.js';
 import { boxSurface } from './box-v3.js';
 import { createTextSurface, tokenToCellStyle } from './surface-text.js';
 const ICONS = {
-    success: '\u2713',
-    error: '\u2717',
-    warning: '\u26A0',
-    info: '\u2139',
+    success: '\u2713', // ✓
+    error: '\u2717', // ✗
+    warning: '\u26A0', // ⚠
+    info: '\u2139', // ℹ
 };
 const BORDER_TOKENS = {
     success: 'success',

package/dist/core/components/alert-v3.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-v3.js","sourceRoot":"","sources":["../../../src/core/components/alert-v3.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,cAAc,IAAI,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAExE,MAAM,KAAK,GAAiC;IAC1C,OAAO,EAAE,QAAQ;IACjB,KAAK,EAAE,QAAQ;IACf,OAAO,EAAE,QAAQ;IACjB,IAAI,EAAE,QAAQ;CACf,CAAC;AAEF,MAAM,aAAa,GAAsE;IACvF,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,SAAS;CAChB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,YAAY,CAAC,OAAyB,EAAE,UAAwB,EAAE;IAChF,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACpC,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,MAAM,CAAC;IAC1C,MAAM,WAAW,GAAG,iBAAiB,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,gBAAgB,CAAC,GAAG,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;IAChG,MAAM,cAAc,GAAG,OAAO,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAC1F,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,GAAG,CAAC,GAAG,cAAc,CAAC,KAAK,CAAC;IAC3D,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC,MAAM,EAAE,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACtE,MAAM,OAAO,GAAG,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAE1E,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAChC,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/D,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IAEvD,OAAO,UAAU,CAAC,OAAO,EAAE;QACzB,GAAG,OAAO;QACV,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,GAAG,EAAE,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACvE,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,GAAG,EAAE,OAAO,CAAC,UAAU,CAAC;KACrD,CAAC,CAAC;AACL,CAAC"}
+{"version":3,"file":"alert-v3.js","sourceRoot":"","sources":["../../../src/core/components/alert-v3.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,cAAc,IAAI,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAExE,MAAM,KAAK,GAAiC;IAC1C,OAAO,EAAE,QAAQ,EAAG,IAAI;IACxB,KAAK,EAAE,QAAQ,EAAK,IAAI;IACxB,OAAO,EAAE,QAAQ,EAAG,IAAI;IACxB,IAAI,EAAE,QAAQ,EAAM,IAAI;CACzB,CAAC;AAEF,MAAM,aAAa,GAAsE;IACvF,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,SAAS;CAChB,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,YAAY,CAAC,OAAyB,EAAE,UAAwB,EAAE;IAChF,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACpC,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,MAAM,CAAC;IAC1C,MAAM,WAAW,GAAG,iBAAiB,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,gBAAgB,CAAC,GAAG,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;IAChG,MAAM,cAAc,GAAG,OAAO,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAC1F,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,GAAG,CAAC,GAAG,cAAc,CAAC,KAAK,CAAC;IAC3D,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC,MAAM,EAAE,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACtE,MAAM,OAAO,GAAG,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAE1E,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAChC,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;IAC/D,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IAEvD,OAAO,UAAU,CAAC,OAAO,EAAE;QACzB,GAAG,OAAO;QACV,WAAW,EAAE,OAAO,CAAC,WAAW,IAAI,GAAG,EAAE,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACvE,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,GAAG,EAAE,OAAO,CAAC,UAAU,CAAC;KACrD,CAAC,CAAC;AACL,CAAC"}

package/dist/core/components/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/core/components/alert.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAS,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAI5D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAEnD,4BAA4B;AAC5B,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAEpE,gDAAgD;AAChD,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,+CAA+C;IAC/C,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,yFAAyF;IACzF,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB,wFAAwF;IACxF,OAAO,CAAC,EAAE,UAAU,CAAC;CACtB;AAkCD;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,MAAM,CAsBzE"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/core/components/alert.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAS,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAI5D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAEnD,4BAA4B;AAC5B,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAEpE,gDAAgD;AAChD,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,+CAA+C;IAC/C,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,yFAAyF;IACzF,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB,wFAAwF;IACxF,OAAO,CAAC,EAAE,UAAU,CAAC;CACtB;AAyCD;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,MAAM,CAsBzE"}

package/dist/core/components/alert.js

@@ -1,12 +1,19 @@
 import { resolveCtx } from '../resolve-ctx.js';
 import { box } from './box.js';
 import { renderByMode } from '../mode-render.js';
-/** Unicode icon characters for each alert variant. */
+/**
+ * Unicode icon characters for each alert variant.
+ *
+ * ✓ (U+2713) and ✗ (U+2717) are Narrow per Unicode East Asian Width.
+ * ⚠ (U+26A0) and ℹ (U+2139) are Ambiguous — 1-wide in terminals,
+ * potentially 2-wide in some chat UIs. We treat them as 1-wide here
+ * since graphemeWidth correctly classifies them as Narrow.
+ */
 const ICONS = {
-    success: '\u2713',
-    error: '\u2717',
-    warning: '\u26A0',
-    info: '\u2139',
+    success: '\u2713', // ✓ CHECK MARK
+    error: '\u2717', // ✗ BALLOT X
+    warning: '\u26A0', // ⚠ WARNING SIGN
+    info: '\u2139', // ℹ INFORMATION SOURCE
 };
 /** Uppercase labels used in pipe mode output. */
 const PIPE_LABELS = {

package/dist/core/components/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../src/core/components/alert.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAgBjD,sDAAsD;AACtD,MAAM,KAAK,GAAiC;IAC1C,OAAO,EAAE,QAAQ;IACjB,KAAK,EAAE,QAAQ;IACf,OAAO,EAAE,QAAQ;IACjB,IAAI,EAAE,QAAQ;CACf,CAAC;AAEF,iDAAiD;AACjD,MAAM,WAAW,GAAiC;IAChD,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;CACb,CAAC;AAEF,yDAAyD;AACzD,MAAM,iBAAiB,GAAiC;IACtD,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;CACb,CAAC;AAEF,8EAA8E;AAC9E,MAAM,aAAa,GAAgD;IACjE,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,SAAS;CAChB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,KAAK,CAAC,OAAe,EAAE,UAAwB,EAAE;IAC/D,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACpC,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,MAAM,CAAC;IAC1C,MAAM,WAAW,GAAG,OAAO,IAAI,EAAE,CAAC;IAElC,OAAO,YAAY,CAAC,GAAG,CAAC,IAAI,EAAE;QAC5B,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE;QACtD,UAAU,EAAE,GAAG,EAAE,CAAC,GAAG,iBAAiB,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE;QACjE,WAAW,EAAE,GAAG,EAAE;YAChB,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC;YAC5B,MAAM,aAAa,GAAG,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YAC5C,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,IAAI,GAAG,CAAC,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;YAC9E,MAAM,WAAW,GAAG,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;YAE1D,OAAO,GAAG,CAAC,WAAW,GAAG,GAAG,GAAG,WAAW,EAAE;gBAC1C,WAAW;gBACX,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC;gBACnD,OAAO,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE;gBAC9B,GAAG;aACJ,CAAC,CAAC;QACL,CAAC;KACF,EAAE,OAAO,CAAC,CAAC;AACd,CAAC"}
+{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../src/core/components/alert.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAgBjD;;;;;;;GAOG;AACH,MAAM,KAAK,GAAiC;IAC1C,OAAO,EAAE,QAAQ,EAAG,eAAe;IACnC,KAAK,EAAE,QAAQ,EAAK,aAAa;IACjC,OAAO,EAAE,QAAQ,EAAG,iBAAiB;IACrC,IAAI,EAAE,QAAQ,EAAM,uBAAuB;CAC5C,CAAC;AAEF,iDAAiD;AACjD,MAAM,WAAW,GAAiC;IAChD,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;CACb,CAAC;AAEF,yDAAyD;AACzD,MAAM,iBAAiB,GAAiC;IACtD,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,MAAM;CACb,CAAC;AAEF,8EAA8E;AAC9E,MAAM,aAAa,GAAgD;IACjE,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,OAAO;IACd,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,SAAS;CAChB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,KAAK,CAAC,OAAe,EAAE,UAAwB,EAAE;IAC/D,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACpC,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,MAAM,CAAC;IAC1C,MAAM,WAAW,GAAG,OAAO,IAAI,EAAE,CAAC;IAElC,OAAO,YAAY,CAAC,GAAG,CAAC,IAAI,EAAE;QAC5B,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE;QACtD,UAAU,EAAE,GAAG,EAAE,CAAC,GAAG,iBAAiB,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE;QACjE,WAAW,EAAE,GAAG,EAAE;YAChB,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC;YAC5B,MAAM,aAAa,GAAG,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YAC5C,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,IAAI,GAAG,CAAC,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;YAC9E,MAAM,WAAW,GAAG,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;YAE1D,OAAO,GAAG,CAAC,WAAW,GAAG,GAAG,GAAG,WAAW,EAAE;gBAC1C,WAAW;gBACX,OAAO,EAAE,OAAO,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,CAAC,UAAU,CAAC;gBACnD,OAAO,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE;gBAC9B,GAAG;aACJ,CAAC,CAAC;QACL,CAAC;KACF,EAAE,OAAO,CAAC,CAAC;AACd,CAAC"}

package/dist/core/components/badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/core/components/badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,OAAO,EAAa,MAAM,wBAAwB,CAAC;AAChF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAGnD,6EAA6E;AAC7E,MAAM,MAAM,YAAY,GAAG,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEhE,2CAA2C;AAC3C,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,4CAA4C;IAC5C,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED;;;;;;;;GAQG;AACH,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,OAAO,CA2CvE"}
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/core/components/badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,OAAO,EAAiC,MAAM,wBAAwB,CAAC;AACpG,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAInD,6EAA6E;AAC7E,MAAM,MAAM,YAAY,GAAG,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEhE,2CAA2C;AAC3C,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,4CAA4C;IAC5C,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED;;;;;;;;GAQG;AACH,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,OAAO,CA6DvE"}

package/dist/core/components/badge.js

@@ -2,6 +2,7 @@ import { createSurface } from '../../ports/surface.js';
 import { resolveSafeCtx as resolveCtx } from '../resolve-ctx.js';
 import { segmentGraphemes } from '../text/grapheme.js';
 import { applyBCSSCellTextStyles } from './bcss-style.js';
+import { parseHex, encodeModifiers } from '../render/packed-cell.js';
 /**
  * Render an inline badge (pill-shaped label) for the given text.
  *
@@ -28,13 +29,18 @@ export function badge(text, options = {}) {
     const baseToken = (variant === 'accent' || variant === 'primary')
         ? ctx.semantic(variant)
         : ctx.status(variant);
+    // Pass both hex and pre-parsed fgRGB — encodeCellIntoBuf picks
+    // fgRGB first, skipping inlineHexRGB on the hot path.
+    const baseStyle = {
+        fg: baseToken.hex,
+        bg: undefined,
+        modifiers: [...(baseToken.modifiers ?? []), 'inverse'],
+    };
+    if (baseToken.fgRGB)
+        baseStyle.fgRGB = baseToken.fgRGB;
     const cell = {
         char: ' ',
-        ...applyBCSSCellTextStyles({
-            fg: baseToken.hex,
-            bg: undefined,
-            modifiers: [...(baseToken.modifiers ?? []), 'inverse'],
-        }, bcss),
+        ...applyBCSSCellTextStyles(baseStyle, bcss),
         empty: false
     };
     // If CSS background is set, we might want to disable 'inverse' modifier 
@@ -42,8 +48,33 @@ export function badge(text, options = {}) {
     if (bcss['background']) {
         cell.modifiers = cell.modifiers?.filter(m => m !== 'inverse');
     }
-    for (let i = 0; i < width; i++) {
-        surface.set(i, 0, { ...cell, char: graphemes[i] });
+    const packed = 'buffer' in surface;
+    if (packed && cell.fg) {
+        const fg = parseHex(cell.fg);
+        if (fg) {
+            const [fR, fG, fB] = fg;
+            let bR = -1, bG = 0, bB = 0;
+            if (cell.bg) {
+                const bg = parseHex(cell.bg);
+                if (bg) {
+                    bR = bg[0];
+                    bG = bg[1];
+                    bB = bg[2];
+                }
+            }
+            const flags = encodeModifiers(cell.modifiers);
+            for (let i = 0; i < width; i++) {
+                surface.setRGB(i, 0, graphemes[i], fR, fG, fB, bR, bG, bB, flags);
+            }
+        }
+        else {
+            for (let i = 0; i < width; i++)
+                surface.set(i, 0, { ...cell, char: graphemes[i] });
+        }
+    }
+    else {
+        for (let i = 0; i < width; i++)
+            surface.set(i, 0, { ...cell, char: graphemes[i] });
     }
     return surface;
 }

package/dist/core/components/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/core/components/badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA2B,MAAM,wBAAwB,CAAC;AAEhF,OAAO,EAAE,cAAc,IAAI,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAW1D;;;;;;;;GAQG;AACH,MAAM,UAAU,KAAK,CAAC,IAAY,EAAE,UAAwB,EAAE;IAC5D,MAAM,GAAG,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;IACpC,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,IAAI,MAAM,CAAC;IAE1C,MAAM,UAAU,GAAG,IAAI,IAAI,GAAG,CAAC;IAC/B,MAAM,SAAS,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;IAC/C,MAAM,KAAK,GAAG,SAAS,CAAC,MAAM,CAAC;IAC/B,MAAM,OAAO,GAAG,aAAa,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAExC,IAAI,CAAC,GAAG,IAAI,GAAG,CAAC,IAAI,KAAK,MAAM,IAAI,GAAG,CAAC,IAAI,KAAK,YAAY,EAAE,CAAC;QAC7D,uCAAuC;QACvC,MAAM,IAAI,GAAG,GAAG,EAAE,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,IAAI,GAAG,CAAC,CAAC,CAAC,UAAU,CAAC;QAC7D,OAAO,eAAe,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IAC/C,CAAC;IAED,4BAA4B;IAC5B,MAAM,IAAI,GAAG,GAAG,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAEpG,MAAM,SAAS,GAAG,CAAC,OAAO,KAAK,QAAQ,IAAI,OAAO,KAAK,SAAS,CAAC;QAC/D,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC;QACvB,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;IAExB,MAAM,IAAI,GAAS;QACjB,IAAI,EAAE,GAAG;QACT,GAAG,uBAAuB,CAAC;YACzB,EAAE,EAAE,SAAS,CAAC,GAAG;YACjB,EAAE,EAAE,SAAS;YACb,SAAS,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,SAAS,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC;SACvD,EAAE,IAAI,CAAC;QACR,KAAK,EAAE,KAAK;KACb,CAAC;IAEF,yEAAyE;IACzE,uDAAuD;IACvD,IAAI,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;QACvB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC;IAChE,CAAC;IAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC;QAC/B,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,CAAE,EAAE,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,iCAAiC;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/core/components/badge.ts"],"names":[],"mappings":"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"}

package/dist/core/components/box-v3.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"box-v3.d.ts","sourceRoot":"","sources":["../../../src/core/components/box-v3.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,OAAO,EAAa,MAAM,wBAAwB,CAAC;AAIhF,OAAO,EAAmB,KAAK,UAAU,EAAE,KAAK,gBAAgB,EAAE,MAAM,UAAU,CAAC;AA4BnF;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,EAAE,OAAO,GAAE,UAAe,GAAG,OAAO,CAwGvF;AACD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB,GAAG,OAAO,CAmBvF"}
+{"version":3,"file":"box-v3.d.ts","sourceRoot":"","sources":["../../../src/core/components/box-v3.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,OAAO,EAAiC,MAAM,wBAAwB,CAAC;AAIpG,OAAO,EAAmB,KAAK,UAAU,EAAE,KAAK,gBAAgB,EAAE,MAAM,UAAU,CAAC;AA0EnF;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,EAAE,OAAO,GAAE,UAAe,GAAG,OAAO,CAmIvF;AACD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB,GAAG,OAAO,CAmBvF"}

package/dist/core/components/box-v3.js

@@ -6,6 +6,32 @@ import { resolveFillChar } from './box.js';
 import { applyBCSSCellTextStyles } from './bcss-style.js';
 import { createSegmentSurface, createTextSurface, segmentSurfaceText, tokenToCellStyle, wrapSurfaceToWidth } from './surface-text.js';
 import { resolveOverflowBehavior } from './overflow.js';
+import { parseHex, encodeModifiers, CELL_STRIDE, OFF_FLAGS, OFF_ALPHA, FLAG_EMPTY, FLAG_BG_SET } from '../render/packed-cell.js';
+function isPackedSurface(s) {
+    return 'buffer' in s && s.buffer instanceof Uint8Array;
+}
+/** Pre-parse a CellTextStyle into numeric RGB + flags for setRGB. Returns undefined if not parseable. */
+function parseStyleRGB(style) {
+    let fgR = -1, fgG = 0, fgB = 0;
+    let bgR = -1, bgG = 0, bgB = 0;
+    if (style.fg) {
+        const rgb = parseHex(style.fg);
+        if (!rgb)
+            return undefined;
+        fgR = rgb[0];
+        fgG = rgb[1];
+        fgB = rgb[2];
+    }
+    if (style.bg) {
+        const rgb = parseHex(style.bg);
+        if (!rgb)
+            return undefined;
+        bgR = rgb[0];
+        bgG = rgb[1];
+        bgB = rgb[2];
+    }
+    return { fgR, fgG, fgB, bgR, bgG, bgB, flags: encodeModifiers(style.modifiers) };
+}
 const BORDER = { tl: '┌', tr: '┐', bl: '└', br: '┘', h: '─', v: '│' };
 function normalizeFixedWidth(width) {
     if (width == null)
@@ -18,6 +44,28 @@ function withInheritedBackground(surface, background) {
     if (background == null)
         return surface;
     const next = surface.clone();
+    if (isPackedSurface(next)) {
+        // Fast path: write bg bytes directly into the buffer
+        const bgRGB = parseHex(background);
+        if (bgRGB) {
+            const buf = next.buffer;
+            const [bgR, bgG, bgB] = bgRGB;
+            const size = next.width * next.height;
+            for (let i = 0; i < size; i++) {
+                const off = i * CELL_STRIDE;
+                if (buf[off + OFF_FLAGS] & FLAG_EMPTY)
+                    continue;
+                if (buf[off + OFF_ALPHA] & FLAG_BG_SET)
+                    continue;
+                buf[off + 5] = bgR;
+                buf[off + 6] = bgG;
+                buf[off + 7] = bgB;
+                buf[off + OFF_ALPHA] = buf[off + OFF_ALPHA] | FLAG_BG_SET;
+            }
+            next.markAllDirty();
+            return next;
+        }
+    }
     for (let y = 0; y < next.height; y++) {
         for (let x = 0; x < next.width; x++) {
             const cell = next.get(x, y);
@@ -88,33 +136,60 @@ export function boxSurface(content, options = {}) {
         bg: borderToken?.bg,
         modifiers: borderToken?.modifiers,
     }, bcss);
-    const borderCell = {
-        char: ' ',
-        fg: borderStyle.fg,
-        bg: borderStyle.bg,
-        modifiers: borderStyle.modifiers,
-    };
-    // Draw borders
-    for (let x = 0; x < outerW; x++) {
-        surface.set(x, 0, { ...borderCell, char: BORDER.h });
-        surface.set(x, outerH - 1, { ...borderCell, char: BORDER.h });
-    }
-    for (let y = 0; y < outerH; y++) {
-        surface.set(0, y, { ...borderCell, char: BORDER.v });
-        surface.set(outerW - 1, y, { ...borderCell, char: BORDER.v });
+    // Fast path: use setRGB for borders when surface is packed
+    const bRGB = isPackedSurface(surface) ? parseStyleRGB(borderStyle) : undefined;
+    if (bRGB && isPackedSurface(surface)) {
+        const { fgR, fgG, fgB, bgR, bgG, bgB, flags } = bRGB;
+        const H = BORDER.h, V = BORDER.v;
+        for (let x = 0; x < outerW; x++) {
+            surface.setRGB(x, 0, H, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+            surface.setRGB(x, outerH - 1, H, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+        }
+        for (let y = 0; y < outerH; y++) {
+            surface.setRGB(0, y, V, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+            surface.setRGB(outerW - 1, y, V, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+        }
+        surface.setRGB(0, 0, BORDER.tl, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+        surface.setRGB(outerW - 1, 0, BORDER.tr, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+        surface.setRGB(0, outerH - 1, BORDER.bl, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+        surface.setRGB(outerW - 1, outerH - 1, BORDER.br, fgR, fgG, fgB, bgR, bgG, bgB, flags);
+        if (title && outerW >= 4) {
+            const available = Math.max(0, outerW - 4);
+            const titleText = clipToWidth(` ${title} `, available);
+            const titleGs = segmentSurfaceText(titleText, 'boxSurface title');
+            const titleLen = Math.min(titleGs.length, available);
+            for (let i = 0; i < titleLen; i++) {
+                surface.setRGB(i + 2, 0, titleGs[i], fgR, fgG, fgB, bgR, bgG, bgB, flags);
+            }
+        }
     }
-    surface.set(0, 0, { ...borderCell, char: BORDER.tl });
-    surface.set(outerW - 1, 0, { ...borderCell, char: BORDER.tr });
-    surface.set(0, outerH - 1, { ...borderCell, char: BORDER.bl });
-    surface.set(outerW - 1, outerH - 1, { ...borderCell, char: BORDER.br });
-    // Draw title
-    if (title && outerW >= 4) {
-        const available = Math.max(0, outerW - 4);
-        const titleText = clipToWidth(` ${title} `, available);
-        const titleGs = segmentSurfaceText(titleText, 'boxSurface title');
-        const titleLen = Math.min(titleGs.length, available);
-        for (let i = 0; i < titleLen; i++) {
-            surface.set(i + 2, 0, { ...borderCell, char: titleGs[i] });
+    else {
+        const borderCell = {
+            char: ' ',
+            fg: borderStyle.fg,
+            bg: borderStyle.bg,
+            modifiers: borderStyle.modifiers,
+        };
+        for (let x = 0; x < outerW; x++) {
+            surface.set(x, 0, { ...borderCell, char: BORDER.h });
+            surface.set(x, outerH - 1, { ...borderCell, char: BORDER.h });
+        }
+        for (let y = 0; y < outerH; y++) {
+            surface.set(0, y, { ...borderCell, char: BORDER.v });
+            surface.set(outerW - 1, y, { ...borderCell, char: BORDER.v });
+        }
+        surface.set(0, 0, { ...borderCell, char: BORDER.tl });
+        surface.set(outerW - 1, 0, { ...borderCell, char: BORDER.tr });
+        surface.set(0, outerH - 1, { ...borderCell, char: BORDER.bl });
+        surface.set(outerW - 1, outerH - 1, { ...borderCell, char: BORDER.br });
+        if (title && outerW >= 4) {
+            const available = Math.max(0, outerW - 4);
+            const titleText = clipToWidth(` ${title} `, available);
+            const titleGs = segmentSurfaceText(titleText, 'boxSurface title');
+            const titleLen = Math.min(titleGs.length, available);
+            for (let i = 0; i < titleLen; i++) {
+                surface.set(i + 2, 0, { ...borderCell, char: titleGs[i] });
+            }
         }
     }
     // Blit content