@graphlearning/graphl-flow 0.1.0 → 0.2.0

package/README.md

@@ -101,6 +101,10 @@ ratio to the text; a small scene stops growing at 4×. Keep scenes legible: the
 fails any fixture whose smallest body text renders under 24px in the 4K frame (12px at 1080p). If a
 diagram hits that, split the slide or trim bullets — a denser scene can only get smaller.
 
+**Focus.** `<Scene scene={…} focus="driver" />` singles out one node — any id, a table row or a code
+line included — with a ring and a glow in its own tone. It is drawn with box-shadow, so it moves
+nothing: every section of a course can focus a different node on the same scene without a jump.
+
 **Fit.** `Scene` fills its parent and scales the scene to fit, centred, with a 4% margin. The scale
 depends only on the parent's size and the scene's natural size, so the same scene in the same frame
 always lands on the same pixels. The view is locked (no zoom/pan); page scroll passes through and text

package/dist/Scene.d.ts

@@ -1,10 +1,15 @@
 import type { Scene as SceneModel, ThemeKey } from './types';
 /**
+ * `focus` names one node (any id, a table row or a code line included) to single out: it gets a
+ * ring and a glow, drawn with box-shadow so the layout — and therefore the fit — never moves. That is
+ * what lets every section of a course focus a different node on the same scene without a jump.
+ *
  * Fills its parent (give the parent a size) and scales the scene's natural box to fit, centred.
  * The viewport is locked: no wheel or drag handlers, so page scroll passes through and text stays
  * selectable. `data-fit="ready"` marks the first fit after fonts load with edges routed — what a recorder waits on.
  */
-export declare function Scene({ scene, theme: key }: {
+export declare function Scene({ scene, theme: key, focus }: {
     scene: SceneModel;
     theme?: ThemeKey;
+    focus?: string;
 }): import("react").JSX.Element;