@graphlearning/graphl-flow 0.6.0 → 0.8.0

package/dist/styles.css

@@ -137,6 +137,10 @@
 .gf-dots i + i + i { background: #27c93f; }
 .gf-code-body { padding-block: 8px; }
 .gf-line { display: flex; white-space: pre; padding-right: 16px; color: var(--gf-code-var); }
+/* A row is a FLEX container, and flex drops a text run that is only whitespace: a blank terminal row
+   collapsed to nothing, and a screen row's leading spaces vanished (0.7: Debian's login banner lost
+   its blank lines, man's 7-column indent was gone). A row is always one row tall; runs are spans. */
+.gf-line { min-height: 1lh; }
 .gf-code[data-terminal] .gf-line { padding-left: 14px; }
 .gf-ln { flex: none; box-sizing: content-box; min-width: 3ch; padding: 0 12px 0 10px; text-align: right; color: var(--gf-code-gutter); user-select: none; }
 .gf-line[data-lit] { background: color-mix(in srgb, var(--gf-accent) 16%, transparent); box-shadow: inset 3px 0 0 var(--gf-accent); }
@@ -149,6 +153,21 @@
 .gf-code[data-output] .gf-line { padding-left: 12px; }
 .gf-code[data-output] .gf-line[data-kind='out'] { color: var(--gf-ink); }
 .gf-line[data-kind='err'] { color: var(--gf-err); }
+/* A real console (0.7): the prompt as bash colours it, output in INK — in a Linux lesson the output is
+   the subject, not chrome. Root's prompt is the error colour: `#` should look like what it is. */
+.gf-code[data-console] .gf-line, .gf-tty .gf-line { padding-left: 14px; }
+.gf-code[data-console] .gf-line[data-kind='out'] { color: var(--gf-ink); }
+.gf-ps { color: var(--gf-code-punct); user-select: none; }
+.gf-ps-who { color: var(--gf-ok); font-weight: 600; }
+.gf-ps-cwd { color: var(--gf-code-method); font-weight: 600; }
+.gf-ps[data-root] .gf-ps-who { color: var(--gf-err); }
+/* psql's transaction state (0.8): `*` a transaction is open, `!` it failed and will roll back. */
+.gf-ps-tx { color: var(--gf-code-number); font-weight: 600; }
+.gf-ps-tx[data-tx='!'] { color: var(--gf-err); }
+/* A full-screen program's grid: every row the full width, inverse video as the terminal draws it. */
+.gf-tty .gf-line { color: var(--gf-ink); }
+.gf-tty [data-inverse] { background: var(--gf-code-var); color: var(--gf-code-bg); }
+.gf-tty [data-bold] { font-weight: 600; }
 .tok-var { color: var(--gf-code-var); }
 .tok-method { color: var(--gf-code-method); }
 .tok-keyword { color: var(--gf-code-keyword); }

package/dist/types.d.ts

@@ -109,7 +109,7 @@ export interface Code extends Base {
     type: 'code';
     /** The source. A template literal's common indent and outer blank lines are dropped. */
     code: string;
-    lang?: 'python' | 'sql' | 'scala' | 'java' | 'js' | 'ts' | 'shell' | 'hcl' | 'text';
+    lang?: 'python' | 'sql' | 'scala' | 'java' | 'js' | 'ts' | 'shell' | 'hcl' | 'ini' | 'nginx' | 'nft' | 'text';
     /** The tab label; for a terminal, its title. */
     filename?: string;
     /** Only these 1-based, inclusive line ranges; each skipped run folds to `··· N lines`. */
@@ -120,6 +120,34 @@ export interface Code extends Base {
     terminal?: boolean;
     /** A notebook cell's printed output: plain text, no frame or line numbers; `! text` is an error. */
     output?: boolean;
+    /**
+     * A REAL console transcript, row for row as an 80-column terminal drew it: a row starting with a
+     * prompt is a command (`ana@web-01:~$`, `[ana@web-02 ~]$`, zsh's `ana@mac ~ %`; `#` is root — or psql's
+     * `syndica=>`, whose continuation rows `syndica-*>` are more lines of the same statement),
+     * everything else output, drawn in ink. A command row exactly `cols` wide WRAPPED, so the next row
+     * continues the command. No `$ ` convention and no `!` marks: the transcript is not edited.
+     */
+    console?: boolean;
+    /** The console's width in columns, for wrapped command rows. Default 80. */
+    cols?: number;
+}
+/**
+ * A full-screen program (`top`, `less`, `nano`) as a terminal screen showed it: exactly `rows`, each
+ * drawn in a fixed `cols`-wide grid, with the program's inverse-video and bold runs. Captured from a
+ * real virtual terminal, never typed. Rows are addressable as `<tty>.R<n>` (1-based) for `focus`.
+ */
+export interface Tty extends Base {
+    type: 'tty';
+    /** The window title. */
+    title?: string;
+    /** The screen's rows, top to bottom; shorter rows are padded, so the grid is always cols × rows. */
+    screen: string[];
+    /** Default 80. */
+    cols?: number;
+    /** Inverse-video runs: [row, from, to] — 0-based row, columns [from, to). */
+    inverse?: [number, number, number][];
+    /** Bold runs, the same shape. */
+    bold?: [number, number, number][];
 }
 /** An axis in DATA units. `labels` makes it categorical: one slot per label (bar charts). */
 export interface PlotAxis {
@@ -184,7 +212,7 @@ export interface Note extends Base {
     type: 'note';
     text: string;
 }
-export type SceneNode = Item | Group | Table | Code | Plot | Tree | Note;
+export type SceneNode = Item | Group | Table | Code | Plot | Tree | Note | Tty;
 export interface Edge {
     /** A node id, or a table row as `<table>.<row>`. */
     from: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graphlearning/graphl-flow",
-  "version": "0.6.0",
+  "version": "0.8.0",
   "description": "Declarative diagram engine — authors describe groups, items and edges; the browser lays them out and the engine draws the edges.",
   "license": "UNLICENSED",
   "repository": {