take4-console 0.15.0

package/src/index.mts

@@ -0,0 +1,105 @@
+// ── take4-console ─────────────────────────────────────────────────────────────
+//
+// Public library barrel. This file is the package's entry point and re-exports
+// every class, type, and constant that library consumers are expected to use.
+//
+// Consumer usage:
+//
+//     import { Screen, Window, Pos, Size, Button } from 'take4-console';
+//     import type { ButtonOptions, StyleId } from 'take4-console';
+//
+
+// ── Core ──────────────────────────────────────────────────────────────────────
+export { Screen }         from './Screen/Screen.mjs';
+export { Window }         from './Screen/Window.mjs';
+export { Region }         from './Screen/Region.mjs';
+export { StyleRegistry }  from './Screen/StyleRegistry.mjs';
+export { WindowManager }  from './Screen/WindowManager.mjs';
+
+// ── Geometry ──────────────────────────────────────────────────────────────────
+export { Pos }            from './Screen/Pos.mjs';
+export { Pct, pct }       from './Screen/Pos.mjs';
+export { Size }           from './Screen/Size.mjs';
+
+// ── Interactive controls ──────────────────────────────────────────────────────
+export { Button }         from './Screen/controls/Button.mjs';
+export { TextBox }        from './Screen/controls/TextBox.mjs';
+export { TextArea }       from './Screen/controls/TextArea.mjs';
+export { Checkbox }       from './Screen/controls/Checkbox.mjs';
+export { Radio }          from './Screen/controls/Radio.mjs';
+export { ListBox }        from './Screen/controls/ListBox.mjs';
+export { Tabs }           from './Screen/controls/Tabs.mjs';
+
+// ── Read-only display controls ────────────────────────────────────────────────
+export { StatusLED }      from './Screen/controls/StatusLED.mjs';
+export { ProgressBar }    from './Screen/controls/ProgressBar.mjs';
+export { ProgressBarV }   from './Screen/controls/ProgressBarV.mjs';
+export { LineChart }      from './Screen/controls/LineChart.mjs';
+export { BarChart }       from './Screen/controls/BarChart.mjs';
+export { Sparkline }      from './Screen/controls/Sparkline.mjs';
+export { Spinner }        from './Screen/controls/Spinner.mjs';
+
+// ── YAML layout builder ───────────────────────────────────────────────────────
+export { InterfaceBuilder } from './Screen/InterfaceBuilder.mjs';
+
+// ── Built-in style name constants ─────────────────────────────────────────────
+export {
+	BUILTIN_WINDOW_BG,
+	BUILTIN_BORDER,
+	BUILTIN_BORDER_FOCUSED,
+	BUILTIN_BORDER_DISABLED,
+	BUILTIN_TEXT,
+	BUILTIN_TEXT_FOCUSED,
+	BUILTIN_TEXT_DISABLED,
+	BUILTIN_TEXT_PLACEHOLDER,
+	BUILTIN_TEXT_CHECKED,
+	BUILTIN_CURSOR,
+} from './Screen/types.mjs';
+
+// ── Public type exports ───────────────────────────────────────────────────────
+export type {
+	// Primitive types
+	Color,
+	StyleId,
+	Cell,
+	CellAttributes,
+	TerminalSize,
+	AxisSpec,
+	DimSpec,
+
+	// Window / border
+	BorderStyle,
+	WindowBorder,
+	WindowProperties,
+	WriteTextOptions,
+
+	// Control properties
+	ButtonProperties,
+	TextBoxProperties,
+	TextAreaProperties,
+	CheckboxProperties,
+	RadioProperties,
+	StatusLEDProperties,
+	ProgressBarProperties,
+	ProgressBarVProperties,
+	LineChartProperties,
+	BarChartProperties,
+	ListBoxProperties,
+	TabsProperties,
+	SparklineProperties,
+	SpinnerProperties,
+
+	// Focus & input
+	Focusable,
+	TerminalMouseEvent,
+	WindowManagerOptions,
+
+	// InterfaceBuilder YAML schema
+	YamlAxisValue,
+	YamlPosSpec,
+	YamlSizeSpec,
+	YamlWindowType,
+	YamlStyleDef,
+	YamlWindowDef,
+	YamlLayout,
+} from './Screen/types.mjs';

package/src/layout.yaml

@@ -0,0 +1,236 @@
+windows:
+  - id: header
+    pos: topLeft
+    size: { fillWidth: 1 }
+    background: 24
+    children:
+      - id: headerSpinner
+        type: spinner
+        pos: { x: -1, y: 0 }
+        spinnerStyle: braille
+        label: "LIVE"
+        chartColor: 231
+
+  - id: statusBar
+    pos: { preset: bottom }
+    size: { fillWidth: 1 }
+    background: 24
+
+  - id: dialog
+    pos: center
+    size: { width: "90%", height: "92%" }
+    background: 236
+    border:
+      top: true
+      right: true
+      bottom: true
+      left: true
+      style: rounded
+      color: 240
+    content: "  Controls demo"
+    children:
+
+      # ── Top-left: text inputs + checkboxes ───────────────────────────────────
+      - id: leftPanel
+        pos: { x: 1, y: 2 }
+        size: { width: "46%", height: "43%" }
+        background: 235
+        border: { top: true, right: true, bottom: true, left: true, style: single, color: 238 }
+        content: "Personal info"
+        children:
+          - id: tbUsername
+            type: textbox
+            pos: { x: 0, y: 2 }
+            size: { fillWidth: 3 }
+            value: "jan_kowalski"
+            placeholder: "username"
+            focused: true
+          - id: tbEmail
+            type: textbox
+            pos: { x: 0, y: 5 }
+            size: { fillWidth: 3 }
+            value: "jan@example.com"
+            placeholder: "e-mail"
+          - id: cb1
+            type: checkbox
+            pos: { x: 1, y: 9 }
+            label: "Enable notifications"
+            checked: true
+          - id: cb2
+            type: checkbox
+            pos: { x: 1, y: 10 }
+            label: "Dark mode"
+            checked: true
+          - id: cb3
+            type: checkbox
+            pos: { x: 1, y: 11 }
+            label: "Beta features"
+          - id: cb4
+            type: checkbox
+            pos: { x: 1, y: 12 }
+            label: "Telemetry (disabled)"
+            disabled: true
+
+      # ── Top-right: language radios + service status LEDs ─────────────────────
+      - id: rightPanel
+        pos: { x: "50%", y: 2 }
+        size: { width: "48%", height: "43%" }
+        background: 235
+        border: { top: true, right: true, bottom: true, left: true, style: single, color: 238 }
+        content: "Preferences"
+        children:
+          - id: r1
+            type: radio
+            pos: { x: 1, y: 2 }
+            label: "English"
+            checked: true
+          - id: r2
+            type: radio
+            pos: { x: 1, y: 3 }
+            label: "Polski"
+            focused: true
+          - id: r3
+            type: radio
+            pos: { x: 1, y: 4 }
+            label: "Deutsch"
+          - id: r4
+            type: radio
+            pos: { x: 1, y: 5 }
+            label: "Français (disabled)"
+            disabled: true
+          - id: ledApi
+            type: statusled
+            pos: { x: 1, y: 8 }
+            state: ok
+            label: "API Server"
+          - id: ledDb
+            type: statusled
+            pos: { x: 1, y: 9 }
+            state: ok
+            label: "Database"
+          - id: ledCache
+            type: statusled
+            pos: { x: 1, y: 10 }
+            state: warn
+            label: "Cache"
+          - id: ledWorker
+            type: statusled
+            pos: { x: 1, y: 11 }
+            state: error
+            label: "Worker"
+
+      # ── Bottom-left: resource progress bars ──────────────────────────────────
+      - id: monitorPanel
+        pos: { x: 1, y: "46%" }
+        size: { width: "46%", height: "43%" }
+        background: 235
+        border: { top: true, right: true, bottom: true, left: true, style: single, color: 238 }
+        content: "Resources"
+        children:
+          - id: pbCpu
+            type: progressbar
+            pos: { x: 0, y: 2 }
+            size: { width: "78%", height: 1 }
+            barValue: 73
+            max: 100
+            fillColor: 75
+          - id: pbMem
+            type: progressbar
+            pos: { x: 0, y: 4 }
+            size: { width: "78%", height: 1 }
+            barValue: 45
+            max: 100
+            fillColor: 82
+          - id: pbDisk
+            type: progressbar
+            pos: { x: 0, y: 6 }
+            size: { width: "78%", height: 1 }
+            barValue: 88
+            max: 100
+            fillColor: 214
+          - id: pbvLoad
+            type: progressbarv
+            pos: { x: -4, y: 1 }
+            size: { width: 3, height: "82%" }
+            barValue: 68
+            max: 100
+            fillColor: 75
+
+      # ── Bottom-right-left: tabbed charts / trends ────────────────────────────
+      - id: chartsPanel
+        type: tabs
+        pos: { x: "50%", y: "46%" }
+        size: { width: "30%", height: "43%" }
+        background: 235
+        border: { top: true, right: true, bottom: true, left: true, style: single, color: 238 }
+        titles: ["Charts", "Trends"]
+        activeIndex: 0
+        children:
+          # ── Tab 0: line + bar charts side by side ────────────────────────────
+          - id: lineChart
+            type: linechart
+            tab: 0
+            pos: { x: 0, y: 1 }
+            size: { width: "58%", height: "85%" }
+          - id: barChart
+            type: barchart
+            tab: 0
+            pos: { x: "60%", y: 1 }
+            size: { width: "38%", height: "85%" }
+            barWidth: 2
+
+          # ── Tab 1: three stacked sparklines ──────────────────────────────────
+          - id: sparkCpu
+            type: sparkline
+            tab: 1
+            pos: { x: 6, y: 2 }
+            size: { width: "85%", height: 1 }
+            chartColor: 75
+          - id: sparkMem
+            type: sparkline
+            tab: 1
+            pos: { x: 6, y: 3 }
+            size: { width: "85%", height: 1 }
+            chartColor: 82
+          - id: sparkDsk
+            type: sparkline
+            tab: 1
+            pos: { x: 6, y: 4 }
+            size: { width: "85%", height: 1 }
+            chartColor: 214
+
+      # ── Bottom-right-right: permanently visible event log (ListBox) ───────────
+      - id: eventsPanel
+        pos: { x: "81%", y: "46%" }
+        size: { width: "17%", height: "43%" }
+        background: 235
+        border: { top: true, right: true, bottom: true, left: true, style: single, color: 238 }
+        content: "Events"
+        children:
+          - id: eventsList
+            type: listbox
+            pos: { x: 0, y: 1 }
+            size: { width: "100%", height: "85%" }
+            items:
+              - "[12:04:21] user logged in"
+              - "[12:04:33] cache warmed"
+              - "[12:05:01] metric collected"
+              - "[12:05:18] job completed"
+
+      # ── Buttons ───────────────────────────────────────────────────────────────
+      - id: btnDisabled
+        type: button
+        pos: { x: 1, y: -4 }
+        size: { width: 11, height: 3 }
+        label: "Delete"
+        disabled: true
+      - id: btnCancel
+        type: button
+        pos: { x: -15, y: -4 }
+        size: { width: 11, height: 3 }
+        label: "Cancel"
+      - id: btnSave
+        type: button
+        pos: { x: -27, y: -4 }
+        size: { width: 11, height: 3 }
+        label: " Save"