@@ -1,14 +1,28 @@
 ## Unreleased
 
-- `RowColumnNode.wrap`, `spacing` and `runSpacing`: a row or column flows its
-  children onto new runs when they don't fit, like Flutter's `Wrap`.
-- `strokeWeight` is a bindable style property of every node with strokes.
-- A navigate-back (`pop`) action reads from JSON without `destinationId`,
-  which it has no use for. It is still written, as `''`, for readers that
-  require it.
+### Layout
+
+- Row/column `spacing`: a gap between children along the main axis, taken
+  out before expanded children share the free space.
+- Row/column `wrap` and `runSpacing`: children wrap onto further runs, like
+  Flutter's `Wrap`.
+
+### Variables
+
+- A variable whose value is a `${= ...}` formula keeps it for every type
+  (computed variables).
+
+### Nodes
+
 - `SignatureNode` (`signature`): a box to sign in. Its `value` is a list of
   strokes, each a list of `[x, y]` points normalized to the box; `inkColor`,
   `strokeWidth` and `readOnly` are in `SignatureProperties`.
+- `SpacerNode` parses JSON without `positioningMode`, `aspectRatioLock` or
+  `reactions`, like other nodes. Its constructor didn't take them, so the
+  generated `fromJson` required them.
+
+### Triggers and actions
+
 - `TriggerType.hold` fires once the target has been held for the trigger's
   `duration` (milliseconds, 1200 by default). Frames, rectangles, rows and
   columns offer it.
@@ -17,14 +31,18 @@
 - `ShowDialogAction.presentation` (`DialogPresentation`): a dialog (the
   default), a bottom sheet, `adaptive` (a sheet below 600 wide, a dialog
   above), or full screen.
+- A navigate-back (`pop`) action reads from JSON without `destinationId`,
+  which it has no use for. It is still written, as `''`, for readers that
+  require it.
+
+### Bindings
+
+- `strokeWeight` is a bindable style property of every node with strokes.
 - `flex` is one of the properties every node can bind, set by a condition
   or change with an action.
 - `IconNode` declares `iconColor` and `iconName` as properties that can be
   bound, set by conditions or changed by actions; `iconName` names the
   Material Symbol to show.
-- `SpacerNode` parses JSON without `positioningMode`, `aspectRatioLock` or
-  `reactions`, like other nodes. Its constructor didn't take them, so the
-  generated `fromJson` required them.
 
 ## 6.1.0
 
 
@@ -1114,6 +1114,46 @@ mixin RowColumnMixin on BaseNode {
   /// for details on available alignments.
   late CrossAxisAlignmentC crossAxisAlignment;
 
+  /// The gap between consecutive children along the main axis, in logical
+  /// pixels. Corresponds to the `spacing` property of [Row] and [Column] in
+  /// Flutter and to item spacing in Figma auto-layout.
+  ///
+  /// Unlike margins, the spacing is subtracted from the main axis extent
+  /// before free space is distributed to flexible children, so expanded
+  /// children with equal flex receive equal sizes.
+  @JsonKey(defaultValue: 0.0)
+  double spacing = 0;
+
+  /// Whether the children wrap onto further runs (lines) when they do not
+  /// fit along the main axis, like Flutter's [Wrap] and Figma auto-layout
+  /// wrap. A wrapping row lays its children out like
+  /// `Wrap(direction: Axis.horizontal)` and a wrapping column like
+  /// `Wrap(direction: Axis.vertical)`.
+  ///
+  /// While wrapping:
+  /// - [spacing] is the gap between consecutive children within a run and
+  ///   [runSpacing] the gap between runs. Children hidden by a visibility
+  ///   formula take no space and no gaps.
+  /// - [mainAxisAlignment] aligns the children within each run (Flutter's
+  ///   `Wrap.alignment`).
+  /// - [crossAxisAlignment] aligns the children within their run
+  ///   (`Wrap.crossAxisAlignment`; stretch and baseline act as start) and
+  ///   also aligns the runs in the cross-axis free space
+  ///   (`Wrap.runAlignment`: start, center or end), as in Figma.
+  /// - Children cannot be flexible: an expanded (or flex) child is laid out
+  ///   at its own size, as a fixed child, like inside a Flutter [Wrap].
+  ///   A child that fills the main axis takes a whole run.
+  /// - A shrink-wrapping cross axis hugs the runs; a shrink-wrapping main
+  ///   axis hugs the widest run.
+  @JsonKey(defaultValue: false)
+  bool wrap = false;
+
+  /// The gap between consecutive runs along the cross axis, in logical
+  /// pixels, when [wrap] is on. Corresponds to `Wrap.runSpacing` in
+  /// Flutter. Has no effect when [wrap] is off.
+  @JsonKey(defaultValue: 0.0)
+  double runSpacing = 0;
+
   /// Returns the main axis based on whether this is a row or column.
   AxisC get mainAxis =>
       (rowColumnType == RowColumnType.row) ? AxisC.horizontal : AxisC.vertical;
@@ -1127,10 +1167,16 @@ mixin RowColumnMixin on BaseNode {
     required RowColumnType rowColumnType,
     required MainAxisAlignmentC mainAxisAlignment,
     required CrossAxisAlignmentC crossAxisAlignment,
+    double spacing = 0,
+    bool wrap = false,
+    double runSpacing = 0,
   }) {
     this.rowColumnType = rowColumnType;
     this.mainAxisAlignment = mainAxisAlignment;
     this.crossAxisAlignment = crossAxisAlignment;
+    this.spacing = spacing;
+    this.wrap = wrap;
+    this.runSpacing = runSpacing;
   }
 
   @override
 
@@ -228,8 +228,12 @@ class VariableData
 String? sanitizeValueForVariableType(Object? value, VariableType type) {
   if (value == null) return null;
   // if (value.isEmpty) return '';
-  // Do not sanitize if the value contains a variable path.
-  if (value.toString().contains(variablePathPattern)) return value.toString();
+  // Do not sanitize if the value contains a variable path or a formula: a
+  // computed variable's value is a `${= ...}` formula whatever its type.
+  if (value.toString().contains(variablePathPattern) ||
+      value.toString().contains(r'${=')) {
+    return value.toString();
+  }
   switch (type) {
     case VariableType.text:
     case VariableType.image:
 
@@ -17,27 +17,18 @@ class RowColumnNode extends ParentNode
   @override
   final bool supportsPadding = true;
 
+  /// A row/column scrolls along its main axis. One that [wrap]s scrolls
+  /// along its cross axis instead, through its runs: its main axis is where
+  /// it wraps, so it needs a bounded extent there.
   @JsonKey(includeFromJson: false)
   @override
-  AxisC get scrollDirection =>
-      rowColumnType == RowColumnType.row ? AxisC.horizontal : AxisC.vertical;
+  AxisC get scrollDirection => (rowColumnType == RowColumnType.row) != wrap
+      ? AxisC.horizontal
+      : AxisC.vertical;
 
   @override
   set scrollDirection(AxisC value) {}
 
-  /// Whether the children wrap onto new runs when they don't fit the main
-  /// axis, like Flutter's [Wrap] widget, instead of being laid out in a single
-  /// line.
-  bool wrap;
-
-  /// The gap between adjacent children along the main axis within a run.
-  /// Only used when [wrap] is true.
-  double spacing;
-
-  /// The gap between adjacent runs along the cross axis.
-  /// Only used when [wrap] is true.
-  double runSpacing;
-
   /// Creates a [RowColumnNode] with the given data.
   RowColumnNode({
     required super.id,
@@ -48,6 +39,9 @@ class RowColumnNode extends ParentNode
     required RowColumnType rowColumnType,
     MainAxisAlignmentC mainAxisAlignment = MainAxisAlignmentC.center,
     CrossAxisAlignmentC crossAxisAlignment = CrossAxisAlignmentC.center,
+    double spacing = 0,
+    bool wrap = false,
+    double runSpacing = 0,
     super.retainedOuterBoxLocal,
     super.visible,
     super.enabled,
@@ -90,9 +84,6 @@ class RowColumnNode extends ParentNode
         ScrollViewKeyboardDismissBehaviorC.manual,
     bool useFlutterListView = false,
     bool shouldAlwaysScroll = true,
-    this.wrap = false,
-    this.spacing = 0,
-    this.runSpacing = 0,
   }) {
     setCornerMixin(
       cornerRadius: cornerRadius,
@@ -103,6 +94,9 @@ class RowColumnNode extends ParentNode
       rowColumnType: rowColumnType,
       mainAxisAlignment: mainAxisAlignment,
       crossAxisAlignment: crossAxisAlignment,
+      spacing: spacing,
+      wrap: wrap,
+      runSpacing: runSpacing,
     );
 
     setScrollableMixin(
@@ -118,7 +112,6 @@ class RowColumnNode extends ParentNode
     );
   }
 
-  /// Creates a [RowColumnNode] from a JSON data.
   /// Rows and columns are the usual buttons and cards of a layout, so they
   /// take taps, long presses and holds.
   @override
@@ -131,35 +124,35 @@ class RowColumnNode extends ParentNode
   @override
   FieldsMap generateFields() => {
     ...super.generateFields(),
-    'wrap': BoolFieldAccess(
-      'Wrap',
-      'Whether the children wrap onto new runs when they overflow.',
-      () => wrap,
-      (value) => wrap = value,
-      defaultValue: () => false,
-      requiresLayout: true,
-    ),
     'spacing': NumFieldAccess<double>(
       'Spacing',
-      'Gap between children within a run when wrapping.',
+      'Gap between consecutive children along the main axis.',
       () => spacing,
       (value) => spacing = value,
-      min: 0,
       defaultValue: () => 0,
+      min: 0,
+      requiresLayout: true,
+    ),
+    'wrap': BoolFieldAccess(
+      'Wrap',
+      'Whether children wrap onto further runs when they do not fit.',
+      () => wrap,
+      (value) => wrap = value,
+      defaultValue: () => false,
       requiresLayout: true,
     ),
     'runSpacing': NumFieldAccess<double>(
       'Run Spacing',
-      'Gap between runs when wrapping.',
+      'Gap between runs along the cross axis when wrapping.',
       () => runSpacing,
       (value) => runSpacing = value,
-      min: 0,
       defaultValue: () => 0,
+      min: 0,
       requiresLayout: true,
     ),
   };
 
-  /// Creates a [RowColumnNode] from [json].
+  /// Creates a [RowColumnNode] from a JSON data.
   factory RowColumnNode.fromJson(Map json) => _$RowColumnNodeFromJson(json);
 
   @override