@pipelex/mthds-ui 0.32.0 → 0.33.0

package/README.md

@@ -94,6 +94,7 @@ Without `pipeIoContracts` and `outputForm` the panel shows each concept's struct
 | `graphStyle`         | `GraphStyleId`                                    | `"detailed"`           | The style the graph is drawn in: `detailed` or `simple`        |
 | `styleMenu`          | `boolean \| GraphStyleId[]`                       | —                      | Offer a style menu in the toolbar (opt-in)                     |
 | `onGraphStyleChange` | `(style: GraphStyleId) => void`                   | —                      | Called when the style changes, so the host can keep the choice |
+| `interactive`        | `boolean`                                         | `true`                 | `false` draws a still picture sized to its content             |
 
 The `simple` style draws the method as a flowchart in plain words: steps titled by their descriptions, only the method's inputs and final output as data, decisions with their outcomes, and loops as "for each". See [docs/graph-styles.md](docs/graph-styles.md).
 
@@ -101,6 +102,8 @@ The `simple` style draws the method as a flowchart in plain words: steps titled
 
 The graph container uses `position: absolute; inset: 0` to fill its parent. Make sure the parent element has `position: relative` and a defined height (e.g. `h-full`, `flex-1`, or an explicit height).
 
+The still presentation (`interactive={false}`) is the exception: its container flows in its parent and takes the height the drawing needs, so the parent gives it a width and no height. See [docs/still-presentation.md](docs/still-presentation.md).
+
 ## GraphSpec
 
 GraphSpec is the data format that describes a pipeline execution graph. It's generated by Pipelex when running or validating MTHDS method bundles.

package/dist/{chunk-T5Y7KNCZ.js → chunk-ABUDTHWF.js}

@@ -2855,7 +2855,7 @@ function simpleEdge(id, source, target, label) {
       fontWeight: 600,
       fill: "var(--ctrl-condition-text)"
     };
-    edge.labelBgStyle = { fill: "var(--color-bg)", fillOpacity: 0.92 };
+    edge.labelBgStyle = { fill: "var(--simple-edge-label-bg, var(--color-bg))", fillOpacity: 0.92 };
     edge.labelBgPadding = [...EDGE_LABEL_PADDING];
     edge.labelBgBorderRadius = 4;
     edge.labelSize = simpleEdgeLabelSize(label);
@@ -3010,4 +3010,4 @@ export {
   applySimpleFrames,
   GRAPH_STYLE_PIPELINES
 };
-//# sourceMappingURL=chunk-T5Y7KNCZ.js.map
+//# sourceMappingURL=chunk-ABUDTHWF.js.map