@mythicalos/preact-ui 0.2.2 → 0.4.0

package/dist/Terminal.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "preact/jsx-runtime";
+/** @jsxImportSource preact */
+// @mythicalos/preact-ui — the terminal pane (ds/components-terminal, spec v2). ALWAYS heritage-dark
+// in both themes (token rule 3): the surface is pinned by ui-core's `.my-term` block, never by a
+// theme-conditional class this binding picks.
+//
+// Thin binding: render + wiring only. Every class string (`TERM_CLASSES`), every user-visible
+// string, the six-branch source resolution, the segmentation, the row keying and the Ctrl-C
+// predicate come from `@mythicalos/ui-core` — this file types no class literal and no copy of its
+// own, so it and its React sibling cannot drift.
+//
+// Honesty (binding, inherited from ui-core): the wake-unavailable banner says exactly
+// `wake unavailable` — never "reconnecting", never a retry spinner; the turn caption renders ONLY
+// from a supplied boolean (`undefined` renders nothing, never a guessed "idle"); the six source
+// branches keep loading honesty (`loading` never renders `(no events)`; missing/unaddressable/
+// failed are distinct); foreign transcript segments appear ONLY behind the disclosure, each
+// captioned and separated — never blended into the selected session's log.
+import { useEffect, useRef, useState } from "preact/hooks";
+import { TERM_CLASS, TERM_CLASSES, TERM_NO_EVENTS_COPY, TERM_STALE_COPY, TERM_STOP_KEY_HINT, TERM_STOP_LABEL, TERM_WAKE_UNAVAILABLE_COPY, currentWakeRows, expandLabel, historySegmentCaption, historyToggleLabel, isExpandable, noiseShow, ROW_SCOPE, scopedRowKeys, segmentKeys, shouldStopOnKey, sourceRows, stopButtonClass, termRowClass, termTitleText, transcriptView, turnCaption, visibleRows, } from "@mythicalos/ui-core/logic";
+export { TERM_CLASS, TERM_CLASSES, TERM_STALE_COPY, TERM_WAKE_UNAVAILABLE_COPY, transcriptView, } from "@mythicalos/ui-core/logic";
+function RowView(props) {
+    const { row } = props;
+    const label = row.label ? _jsx("span", { class: TERM_CLASSES.label, children: row.label }) : null;
+    if (!isExpandable(row)) {
+        return (_jsxs("div", { class: termRowClass(row.kind), children: [label, label ? " " : null, row.text] }));
+    }
+    return (_jsxs("div", { class: termRowClass(row.kind), children: [_jsxs("button", { type: "button", class: TERM_CLASSES.head, "aria-expanded": props.expanded, onClick: props.onToggle, children: [label, label ? " " : null, row.text, " ", _jsx("span", { class: TERM_CLASSES.expand, children: expandLabel(props.expanded) })] }), props.expanded ? _jsx("pre", { class: TERM_CLASSES.detail, children: row.detail }) : null] }));
+}
+/**
+ * A keyed run of rows. `scopedRowKeys` namespaces every key under its scope, so expand state can
+ * never leak between the transcript, the local rows and a history segment — not even when a caller
+ * supplies an id that looks like another scope's prefix.
+ */
+function RowList(props) {
+    const keys = scopedRowKeys(props.scope, props.rows);
+    return (_jsx(_Fragment, { children: props.rows.map((row, i) => {
+            const key = keys[i];
+            return _jsx(RowView, { row: row, expanded: props.expanded.has(key), onToggle: () => props.onToggle(key) }, key);
+        }) }));
+}
+export function Terminal(props) {
+    const { source, noiseFilterEnabled = false } = props;
+    const history = props.history ?? [];
+    const [expanded, setExpanded] = useState(new Set());
+    const [showHistory, setShowHistory] = useState(false);
+    const paneRef = useRef(null);
+    const toggle = (key) => setExpanded((prev) => {
+        const next = new Set(prev);
+        if (next.has(key))
+            next.delete(key);
+        else
+            next.add(key);
+        return next;
+    });
+    const stopAvailable = props.onStopTurn !== undefined;
+    // Focused Ctrl-C → stop-turn. The predicate (key-repeat drop, selection guard, focus guard) is
+    // ui-core's; the availability + in-flight guards live here. Effects do not run under SSR.
+    useEffect(() => {
+        if (!stopAvailable)
+            return;
+        const onKey = (e) => {
+            if (props.stopBusy)
+                return;
+            const sel = window.getSelection?.()?.toString() ?? "";
+            const pane = paneRef.current;
+            const focused = !!pane && pane.contains(document.activeElement);
+            if (shouldStopOnKey(e, sel, focused)) {
+                e.preventDefault();
+                props.onStopTurn?.();
+            }
+        };
+        window.addEventListener("keydown", onKey);
+        return () => window.removeEventListener("keydown", onKey);
+    }, [stopAvailable, props.onStopTurn, props.stopBusy]);
+    const view = transcriptView(source);
+    const showNoise = noiseShow(noiseFilterEnabled);
+    const allRows = props.currentWakeOnly ? currentWakeRows(sourceRows(source)) : sourceRows(source);
+    const rows = view.kind === "log" ? visibleRows(allRows, showNoise) : [];
+    const localRows = view.kind === "log" ? visibleRows(props.localRows ?? [], showNoise) : [];
+    const emptyLog = view.kind === "log" && rows.length === 0 && localRows.length === 0;
+    const segKeys = segmentKeys(history);
+    const titleText = termTitleText(props.name, noiseFilterEnabled);
+    const caption = turnCaption(props.turnInFlight);
+    return (_jsxs("div", { class: TERM_CLASS, children: [_jsxs("div", { class: TERM_CLASSES.titlebar, children: [_jsxs("span", { class: TERM_CLASSES.lights, "aria-hidden": "true", children: [_jsx("span", { class: TERM_CLASSES.lightRed }), _jsx("span", { class: TERM_CLASSES.lightAmber }), _jsx("span", { class: TERM_CLASSES.lightGreen })] }), props.onToggleNoise ? (_jsx("button", { type: "button", class: TERM_CLASSES.noiseToggle, "aria-pressed": noiseFilterEnabled, onClick: props.onToggleNoise, children: titleText })) : (_jsx("span", { class: TERM_CLASSES.staticTitle, children: titleText })), _jsxs("span", { class: TERM_CLASSES.titleRight, children: [caption !== null ? (props.turnInFlight ? (_jsxs("span", { class: TERM_CLASSES.turn, children: [_jsx("span", { class: TERM_CLASSES.turnDot, "aria-hidden": "true" }), caption] })) : (_jsx("span", { class: TERM_CLASSES.idle, children: caption }))) : null, stopAvailable ? (_jsxs("button", { type: "button", class: stopButtonClass(!!props.stopProminent), disabled: props.stopBusy, onClick: props.onStopTurn, children: [TERM_STOP_LABEL, " ", _jsx("span", { class: TERM_CLASSES.stopKey, children: TERM_STOP_KEY_HINT })] })) : null] })] }), _jsxs("div", { ref: paneRef, class: TERM_CLASSES.body, tabIndex: 0, children: [props.wakeUnavailable ? (_jsxs("div", { class: TERM_CLASSES.banner, children: [_jsx("span", { class: TERM_CLASSES.bannerDot, "aria-hidden": "true" }), TERM_WAKE_UNAVAILABLE_COPY] })) : null, view.kind === "log" && view.stale ? (_jsxs("div", { class: TERM_CLASSES.banner, children: [_jsx("span", { class: TERM_CLASSES.bannerDot, "aria-hidden": "true" }), TERM_STALE_COPY] })) : null, history.length > 0 ? (_jsx("button", { type: "button", class: TERM_CLASSES.more, onClick: () => setShowHistory((s) => !s), children: historyToggleLabel(showHistory, history.length) })) : null, showHistory
+                        ? history.map((seg, si) => (
+                        // keyed by the segment's own identity, not its position, so reordering the list moves
+                        // neither the rendered element nor its rows' expand state
+                        _jsxs("div", { class: TERM_CLASSES.segment, children: [_jsx("div", { class: TERM_CLASSES.segmentCaption, children: seg.caption ?? historySegmentCaption(seg.id) }), _jsx(RowList, { rows: visibleRows(seg.rows, showNoise), scope: [ROW_SCOPE.history, segKeys[si]], expanded: expanded, onToggle: toggle })] }, segKeys[si])))
+                        : null, view.kind === "state" ? _jsx("div", { class: TERM_CLASSES.state, children: view.copy }) : null, emptyLog ? _jsx("div", { class: TERM_CLASSES.state, children: TERM_NO_EVENTS_COPY }) : null, _jsx(RowList, { rows: rows, scope: [ROW_SCOPE.transcript], expanded: expanded, onToggle: toggle }), _jsx(RowList, { rows: localRows, scope: [ROW_SCOPE.local], expanded: expanded, onToggle: toggle }), props.caret ? _jsx("span", { class: TERM_CLASSES.caret, "aria-hidden": "true" }) : null] })] }));
+}

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export { Button, buttonClass, type ButtonProps, type BtnVariant, type BtnState } from "./Button.js";
-export { Input, Toggle, Checkbox, type InputProps, type ToggleProps, type CheckboxProps } from "./Input.js";
+export { Input, Toggle, Checkbox, REVEAL_SHOW_LABEL, REVEAL_HIDE_LABEL, REVEAL_LABELS, type InputProps, type RevealLabels, type ToggleProps, type CheckboxProps, } from "./Input.js";
 export { MaskedSecretInput, type MaskedSecretInputProps } from "./MaskedSecretInput.js";
 export { EmptyState, type EmptyStateProps } from "./EmptyState.js";
 export { Scrim, ConfirmDialog, typedNameMatches, BULLET_ICON, type DialogBullet, type ConfirmDialogProps, } from "./ConfirmDialog.js";
@@ -13,3 +13,13 @@ export { StatusLine, statusLineClass, type StatusLineProps, type StatusTone } fr
 export { SearchInput, type SearchInputProps } from "./SearchInput.js";
 export { Banner, bannerClass, BANNER_ICON, type BannerProps, type BannerTone } from "./Banner.js";
 export { Gauge, gaugeTone, gaugeGeom, type GaugeProps, type GaugeGeom, type Tone } from "./Gauge.js";
+export { SaveBar, saveBarNote, saveBarDirty, saveBarClass, SAVE_BAR_PARTS, SAVE_BAR_SEP, SAVE_BAR_DISCARD_LABEL, SAVE_BAR_SAVE_LABEL, type SaveBarProps, type SaveBarNote, } from "./SaveBar.js";
+export { StatTiles, statTilesClass, statTileClass, STAT_TILE_PARTS, formatStatCompact, formatStatCount, formatStatUsd, formatStatPercent, STAT_TILE_EMPTY, STAT_TILE_MINUS, type StatTilesProps, type StatTile, type StatTileTone, } from "./StatTiles.js";
+export { GitChip, gitFlags, hasGitStatus, gitBranchLabel, gitChipClass, gitFlagClass, gitChipNote, GIT_CHIP_PARTS, GIT_BRANCH_GLYPH, GIT_BRANCH_UNKNOWN, GIT_DETACHED_LABEL, GIT_CLEAN_LABEL, GIT_LOADING_NOTE, GIT_UNAVAILABLE_NOTE, GIT_STALE_LABEL, GIT_STALE_TITLE, type GitChipProps, type GitStatus, type GitFlag, type GitFlagTone, } from "./GitChip.js";
+export { Popover, POPOVER_CARET, POPOVER_CHECK, POPOVER_EMPTY_VALUE, popoverTriggerClass, popoverPanelClass, popoverItemClass, popoverTriggerText, resolvePopoverPosition, type PopoverProps, type PopoverItem, type PopoverPosition, } from "./Popover.js";
+export { FileTree, FilePreview, FileScopePicker, deriveFileTreeRows, countFileRows, countLoadedFiles, previewMeta, previewBodyMode, buildBreadcrumb, breadcrumbSegments, formatFileSize, formatRelativeTime, type FileTreeProps, type FilePreviewProps, type FileScopePickerProps, type FileTreeMode, type FileTreeRootSpec, type FileTreeRow, type FileScopeOption, type DirState, type FilePreviewState, type PreviewBadgeState, type GitMark, } from "./FileExplorer.js";
+export { SessionCard, ctxBand, ctxReading, ctxBarGeom, normalizeCtxThresholds, ctxMeterClass, ctxNoteText, ctxValueText, sessionAvatarInitial, sessionCardClass, sessionCardIsStale, sessionCardStale, sessionStatusText, sessionSpineSummary, sessionStatus, sessionStatusClass, sessionSubline, spineNodeClass, type SessionCardProps, } from "./SessionCard.js";
+export type { CtxThresholds, CtxBand, CtxBarTick, CtxBarGeom, SessionLifecycle, SessionActivity, SessionStatusTone, SessionStatusKey, SessionStatus, SessionStatusInput, SessionSpine, SpineNode, SpineSummary, } from "@mythicalos/ui-core/logic";
+export { Terminal, TERM_CLASS, TERM_STALE_COPY, TERM_WAKE_UNAVAILABLE_COPY, transcriptView, type TerminalProps, type TranscriptSegment, type TermRow, type TermRowKind, type TermSource, type TermView, } from "./Terminal.js";
+export { QueuePanel, QueueRow, QUEUE_EMPTY_COPY, QUEUE_LOADING_COPY, QUEUE_STALE_COPY, QUEUE_UNAVAILABLE_COPY, canCancelRow, cancelReducer, queueBadgeClass, queueBadgeLabel, queueRowClass, queueView, shouldDisarmCancel, type QueuePanelProps, type QueueRowProps, type CancelEvent, type CancelState, type QueueItem, type QueueItemStatus, type QueueSource, type QueueUnavailableReason, type QueueView, } from "./QueuePanel.js";
+export { SendBar, DELIVERY_CLASSES, DELIVERY_HINT, SEND_DISABLED_FALLBACK, SEND_PLACEHOLDER, canSend, clearDraftOnSend, deliveryClassLabel, keyAction, sendPlaceholder, showDeliveryHint, type SendBarProps, type DeliveryClass, type KeyAction, } from "./SendBar.js";

package/dist/index.js

@@ -4,7 +4,7 @@
 // SearchInput, Banner, Gauge — Task 6). Serve `@mythicalos/ui-core/styles.css` (after
 // `@mythicalos/tokens`) so these components' classes resolve — this package ships no CSS of its own.
 export { Button, buttonClass } from "./Button.js";
-export { Input, Toggle, Checkbox } from "./Input.js";
+export { Input, Toggle, Checkbox, REVEAL_SHOW_LABEL, REVEAL_HIDE_LABEL, REVEAL_LABELS, } from "./Input.js";
 export { MaskedSecretInput } from "./MaskedSecretInput.js";
 export { EmptyState } from "./EmptyState.js";
 export { Scrim, ConfirmDialog, typedNameMatches, BULLET_ICON, } from "./ConfirmDialog.js";
@@ -19,3 +19,17 @@ export { StatusLine, statusLineClass } from "./StatusLine.js";
 export { SearchInput } from "./SearchInput.js";
 export { Banner, bannerClass, BANNER_ICON } from "./Banner.js";
 export { Gauge, gaugeTone, gaugeGeom } from "./Gauge.js";
+// ── small atoms graduated out of a single product (save-bar / stat-tiles / git-chip cards) ──
+export { SaveBar, saveBarNote, saveBarDirty, saveBarClass, SAVE_BAR_PARTS, SAVE_BAR_SEP, SAVE_BAR_DISCARD_LABEL, SAVE_BAR_SAVE_LABEL, } from "./SaveBar.js";
+export { StatTiles, statTilesClass, statTileClass, STAT_TILE_PARTS, formatStatCompact, formatStatCount, formatStatUsd, formatStatPercent, STAT_TILE_EMPTY, STAT_TILE_MINUS, } from "./StatTiles.js";
+export { GitChip, gitFlags, hasGitStatus, gitBranchLabel, gitChipClass, gitFlagClass, gitChipNote, GIT_CHIP_PARTS, GIT_BRANCH_GLYPH, GIT_BRANCH_UNKNOWN, GIT_DETACHED_LABEL, GIT_CLEAN_LABEL, GIT_LOADING_NOTE, GIT_UNAVAILABLE_NOTE, GIT_STALE_LABEL, GIT_STALE_TITLE, } from "./GitChip.js";
+// ── dropdown popover (ds/components-popover — registry row `popover` v1) ──
+export { Popover, POPOVER_CARET, POPOVER_CHECK, POPOVER_EMPTY_VALUE, popoverTriggerClass, popoverPanelClass, popoverItemClass, popoverTriggerText, resolvePopoverPosition, } from "./Popover.js";
+// ── file explorer & markdown preview (ds/components-file-explorer) ──
+export { FileTree, FilePreview, FileScopePicker, deriveFileTreeRows, countFileRows, countLoadedFiles, previewMeta, previewBodyMode, buildBreadcrumb, breadcrumbSegments, formatFileSize, formatRelativeTime, } from "./FileExplorer.js";
+// ── session-card (design registry `session-card` v1) ──
+export { SessionCard, ctxBand, ctxReading, ctxBarGeom, normalizeCtxThresholds, ctxMeterClass, ctxNoteText, ctxValueText, sessionAvatarInitial, sessionCardClass, sessionCardIsStale, sessionCardStale, sessionStatusText, sessionSpineSummary, sessionStatus, sessionStatusClass, sessionSubline, spineNodeClass, } from "./SessionCard.js";
+// ── terminal set (ds/components-terminal v2): terminal · queue-row · send-bar ──
+export { Terminal, TERM_CLASS, TERM_STALE_COPY, TERM_WAKE_UNAVAILABLE_COPY, transcriptView, } from "./Terminal.js";
+export { QueuePanel, QueueRow, QUEUE_EMPTY_COPY, QUEUE_LOADING_COPY, QUEUE_STALE_COPY, QUEUE_UNAVAILABLE_COPY, canCancelRow, cancelReducer, queueBadgeClass, queueBadgeLabel, queueRowClass, queueView, shouldDisarmCancel, } from "./QueuePanel.js";
+export { SendBar, DELIVERY_CLASSES, DELIVERY_HINT, SEND_DISABLED_FALLBACK, SEND_PLACEHOLDER, canSend, clearDraftOnSend, deliveryClassLabel, keyAction, sendPlaceholder, showDeliveryHint, } from "./SendBar.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mythicalos/preact-ui",
-  "version": "0.2.2",
+  "version": "0.4.0",
   "description": "mythicalOS thin Preact bindings over @mythicalos/ui-core — Button, Input/Toggle/Checkbox, MaskedSecretInput, EmptyState, ConfirmDialog/Scrim, Toast/ToastProvider, Chip, Card, Avatar, StatusLine, SearchInput, Banner, Gauge, and the usePoll/useInterval hooks. Render + framework wiring only — every class string, poll-scheduling math, glyph map, and text composition is derived by @mythicalos/ui-core so this binding and its React sibling can never drift. Apache-2.0.",
   "license": "Apache-2.0",
   "type": "module",
@@ -35,7 +35,7 @@
     }
   },
   "dependencies": {
-    "@mythicalos/ui-core": "^0.1.1"
+    "@mythicalos/ui-core": "^0.3.0"
   },
   "scripts": {
     "build": "tsc -p tsconfig.build.json",