uicore-ts 1.1.388 → 1.1.390

package/compiledScripts/UIRectangle.d.ts

@@ -2,6 +2,24 @@ import { UIObject } from "./UIObject";
 import { UIPoint } from "./UIPoint";
 import { UIView } from "./UIView";
 export type SizeNumberOrFunctionOrView = number | ((constrainingOrthogonalSize: number) => number) | UIView;
+/** A position along an axis (0 = start, 0.5 = centered, 1 = end), or "stretch" to fill the available space instead. */
+export type UIRectanglePositionOrStretch = number | "stretch";
+export interface UIRectangleFlowLayoutOptions {
+    /** Horizontal spacing between views on the same row. Defaults to 0. */
+    itemGap?: number;
+    /** Vertical spacing between wrapped rows. Defaults to 0. */
+    lineGap?: number;
+    /** Caps how many views a row may hold before wrapping, even if more would fit by width. Defaults to unlimited. */
+    maxViewsPerRow?: number;
+    /** Position of a row within this rectangle's width when that row holds more than one view. Defaults to 0 (left). */
+    centeredOnPosition?: number;
+    /**
+     * Position (or "stretch" to fill the row) of a view that wrapping isolated onto a row of its
+     * own - never consulted for a view still sharing a row with another. A single value broadcasts
+     * to every isolated view; an array is matched by index against `views`. Defaults to 0 (left).
+     */
+    positionOrStretchWhenIsolatedOnOwnWrappedRow?: UIRectanglePositionOrStretch | UIRectanglePositionOrStretch[];
+}
 export type UIGroupingWrapperFrameConfiguration = {
     /** Stable identity used to reuse the same wrapper when surrounding conditional layout changes. */
     identifier?: string;
@@ -154,6 +172,25 @@ export declare class UIRectangle extends UIObject {
      * @returns Array of rectangles representing the frame for each view
      */
     framesByDistributingViewsAsRow(views: UIView[], paddings?: SizeNumberOrFunctionOrView | SizeNumberOrFunctionOrView[], absoluteWidths?: SizeNumberOrFunctionOrView | SizeNumberOrFunctionOrView[], centeredOnPosition?: number): UIRectangle[];
+    /**
+     * Flows views left-to-right at their preferred widths, wrapping to a new row below this
+     * rectangle whenever the next view no longer fits on the current row - the same idea as HTML
+     * inline/flow layout or a UICollectionView flow layout. Rows are packed greedily: each row
+     * holds as many views as actually fit before wrapping (up to `options.maxViewsPerRow`, if
+     * given), so this degenerates to a single row when everything fits, and to one view per row
+     * when nothing does.
+     * @param views - Array of views to distribute, in flow order
+     * @param preferredWidths - Preferred width for each view, matched by index
+     * @param itemHeight - Height applied to every row
+     * @param options - Wrapping and alignment settings, all optional
+     * @param options.itemGap - Horizontal spacing between views on the same row
+     * @param options.lineGap - Vertical spacing between wrapped rows
+     * @param options.maxViewsPerRow - Caps views per row even if more would fit by width
+     * @param options.centeredOnPosition - Position of a row holding more than one view
+     * @param options.positionOrStretchWhenIsolatedOnOwnWrappedRow - Position or stretch for a view wrapping isolated alone
+     * @returns Array of rectangles representing the frame for each view, matching `views`' order
+     */
+    framesByFlowingViewsAlongWidth(views: UIView[], preferredWidths: number[], itemHeight: SizeNumberOrFunctionOrView, options?: UIRectangleFlowLayoutOptions): UIRectangle[];
     /**
      * Distributes views as a grid (2D array), assigning frames and returning them.
      * The first index represents rows (vertical), the second index represents columns (horizontal).

package/compiledScripts/UIRectangle.js

@@ -671,6 +671,67 @@ const _UIRectangle = class extends import_UIObject.UIObject {
     frames.forEach((frame, index) => _UIRectangle._assignFrameToView(frame, views[index]));
     return frames;
   }
+  framesByFlowingViewsAlongWidth(views, preferredWidths, itemHeight, options = {}) {
+    const {
+      itemGap = 0,
+      lineGap = 0,
+      maxViewsPerRow = Infinity,
+      centeredOnPosition = 0,
+      positionOrStretchWhenIsolatedOnOwnWrappedRow = 0
+    } = options;
+    const heightNumber = this._heightNumberFromSizeNumberOrFunctionOrView(itemHeight);
+    const rowsOfIndices = [];
+    let currentRow = [];
+    let currentRowWidth = 0;
+    views.forEach((_view, index) => {
+      const width = preferredWidths[index];
+      const widthIfAdded = currentRow.length === 0 ? width : currentRowWidth + itemGap + width;
+      const overflowsWidth = currentRow.length > 0 && widthIfAdded > this.width;
+      const overflowsCount = currentRow.length >= maxViewsPerRow;
+      if (currentRow.length > 0 && (overflowsWidth || overflowsCount)) {
+        rowsOfIndices.push(currentRow);
+        currentRow = [];
+        currentRowWidth = 0;
+      }
+      currentRow.push(index);
+      currentRowWidth = currentRow.length === 1 ? width : currentRowWidth + itemGap + width;
+    });
+    if (currentRow.length > 0) {
+      rowsOfIndices.push(currentRow);
+    }
+    const frames = new Array(views.length);
+    let rowRectangle = this.rectangleWithHeight(heightNumber);
+    rowsOfIndices.forEach((rowIndices, rowNumber) => {
+      if (rowNumber > 0) {
+        rowRectangle = rowRectangle.rectangleForNextRow(lineGap);
+      }
+      if (rowIndices.length === 1) {
+        const index = rowIndices[0];
+        const isolatedValue = Array.isArray(positionOrStretchWhenIsolatedOnOwnWrappedRow) ? positionOrStretchWhenIsolatedOnOwnWrappedRow[index] : positionOrStretchWhenIsolatedOnOwnWrappedRow;
+        if (isolatedValue === "stretch") {
+          const frame = rowRectangle.lazyCopy();
+          _UIRectangle._assignFrameToView(frame, views[index]);
+          frames[index] = frame;
+          return;
+        }
+        const rowFrames2 = rowRectangle.framesByDistributingViewsAsRow(
+          [views[index]],
+          itemGap,
+          [preferredWidths[index]],
+          isolatedValue
+        );
+        frames[index] = rowFrames2[0];
+        return;
+      }
+      const rowViews = rowIndices.map((index) => views[index]);
+      const rowWidths = rowIndices.map((index) => preferredWidths[index]);
+      const rowFrames = rowRectangle.framesByDistributingViewsAsRow(rowViews, itemGap, rowWidths, centeredOnPosition);
+      rowIndices.forEach((index, position) => {
+        frames[index] = rowFrames[position];
+      });
+    });
+    return frames;
+  }
   framesByDistributingViewsAsGrid(views, paddings = 0, absoluteHeights = import_UIObject.nil) {
     const frames = [];
     let currentRowRectangle = this.lazyCopy();
@@ -806,6 +867,9 @@ const _UIRectangle = class extends import_UIObject.UIObject {
     var _a;
     const owner = layoutPass.owner;
     const previousRecords = (_a = _UIRectangle._groupingWrapperFrameRecordsByOwner.get(owner)) != null ? _a : [];
+    if (!layoutPass.requests.length && !previousRecords.length) {
+      return;
+    }
     const availablePreviousRecords = previousRecords.copy();
     const nextRecords = [];
     const groupedViews = /* @__PURE__ */ new Set();