Major release with new components, input paradigms, theming, and animation.
- Table — data table with column alignment (left/center/right), bold/underline headers, separators, and vertical scroll support
- Spinner — animated loading indicator with 4 styles:
dots,line,arc,bouncingBar. Auto-advances frames on mount - Tabs — tab navigation with Left/Right keyboard control,
onTabChangecallback, wrap-around navigation - Modal — dialog with title, body, navigable buttons (Left/Right/Enter/Escape), designed for
app.showOverlay() - Checkbox — toggle input with
[✓]/[ ]rendering, Space/Enter to toggle,onChangecallback
- Built-in
Animatorwithapp.animate(component, propsTarget, options)for property animation app.tick(callback)for frame-based callbacks- 6 easing functions:
linear,easeIn,easeOut,easeInOut,bounce,elastic - Batch rendering with dirty-component accumulation per frame
- Enable with
new App({ mouse: true }) - SGR mouse protocol parsing (click, release, move, scroll)
- Hit-testing via component
absolutePosition - Events:
click,mousedown,mouseup,mousemove,scrollon target components - Hover detection:
mouseenter/mouseleaveevents,hoveredproperty on components hovered: booleaninRenderContextfor hover-aware rendering
- Design tokens:
primary,secondary,danger,success,warning,surface,text,border,muted,accent - Built-in
darkThemeandlightThemepresets app.setTheme(theme)/app.getTheme()for runtime theme switching- Token resolution in renderer — use
fg: "primary"instead of hardcoded colors
- Gap —
gapproperty for flex layout spacing between children - Min/Max dimensions —
minWidth,maxWidth,minHeight,maxHeightconstraints - Justify content —
justifyContent: "start" | "center" | "end" | "space-between" | "space-around" - Align items —
alignItems: "start" | "center" | "end" | "stretch"
- Italic, strikethrough, inverse text styles
- Unicode width-aware rendering — correct layout for emoji, CJK characters, zero-width joiners
- Focus visible —
focusStyleon components for automatic visual focus indicators - Color utilities —
gradient(),lighten(),darken(),mix()for programmatic color manipulation - Horizontal scrolling —
scrollToX(),scrollByX(), Left/Right keyboard control, visual indicator
- v2 showcase demo (
pnpm demo:showcase) combining all new features
- Styled segments — new
segmentsfield onRenderLineallows multiple styles within a single line viaStyledSegment[]. Each segment has its ownfg,bg,bold,dim,underline. The line-levelstyleacts as a base for all segments. - Text alignment — new
alignfield onRenderLinesupports"left"(default),"center", and"right"alignment within the component's content area. Works with both plain text and segments. - Segment-aware overflow —
hidden,ellipsis,wrap, andwrap-wordoverflow modes now correctly handle segments, truncating and wrapping across segment boundaries while preserving individual styles. - New demo —
pnpm demo:segmentsshowcases color palettes, log-level badges, text alignment, combined segments + alignment, and segment overflow with ellipsis.
- d010a3f: Extract cligrid to dedicated repository, update repository and homepage URLs, add CI/CD with GitHub Actions and OIDC trusted publisher for npm releases.
First stable release. The library has been transformed from a rendering engine into a full terminal UI framework.
- Functional components —
createComponent()factory to build components without class boilerplate - RenderContext —
render()now receives context with computed dimensions (width,height,terminalWidth,terminalHeight) - Text overflow modes —
hidden,ellipsis,wrap,wrap-wordviastyle.overflow - Scrolling —
scrollableproperty,scrollTo()/scrollBy()methods, keyboard control (Up/Down when focused), visual scroll indicator - Built-in components —
TextBox,SelectList,ProgressBar,InputFieldready to use - Event bubbling — keyboard events propagate from child to parent, stoppable via
event.handled = true - Declarative key handlers —
onKeyPressin ComponentConfig - Z-index system — components sorted by
zIndexfor layered rendering - Overlay helpers —
app.showOverlay()/app.hideOverlay()with automatic focus save/restore - Lifecycle hooks —
onMount,onDestroy,onResizeon components - Reactive state store —
app.setState(),app.connect(),app.disconnect()for automatic component updates - Demo folder — 4 runnable demos (dashboard, form, advanced, castle)
- Out-of-bounds warning now emits an event instead of
console.warn, preventing stdout corruption during alternate screen rendering
- Add missing information in package.json
- Remove unused package, make margin optional with default value to 1, update and fix example in README
- Initial release