@pixi-ui-editor/runtime-pixi 0.8.0 → 0.9.0

package/dist/views/ItemTableNodeView.js

@@ -0,0 +1,100 @@
+import { resolveItemTableVisibleCount } from "@pixi-ui-editor/schema";
+import { NodeView } from "./NodeView.js";
+/**
+ * Узел фиксированной вместимости: держит авторский список узлов (`items`, ссылки по адресу — их
+ * разрешает `scene.ts`, тем же приёмом, что цели spine-коннекторов) и показывает только первые
+ * `visibleCount` из них — остальные скрыты всегда, а не «на этой странице». Автор раскладывает
+ * элементы под максимум, а сколько их реально помещается, задаётся на профиль: в разной ориентации
+ * экрана на экран влезает разное число строк.
+ *
+ * Список именно авторский, а не дети: элемент обычно уже лежит там, где его выравнивает layout-группа.
+ *
+ * Узел намеренно ничего больше не делает. Он не страницы (`PageGroupNodeView` показывает ровно
+ * одного ребёнка и растягивает его на себя), не раскладка (позицию элементы сохраняют свою) и ничего не
+ * знает ни про какие данные: чем наполнить видимые элементы и когда, решает игровой код через
+ * generic API из `controls.ts` (`getItemTableViewVisibleItems`, `getItemTableViewItem`,
+ * `setItemTableViewVisibleCount`, `setItemTableViewItemsVisible`). Связка «переключили страницу →
+ * перезаполнили элементы» тоже принадлежит игре: `PaginationNodeView.onPageChange` и эта таблица
+ * ничего друг о друге не знают.
+ *
+ * Видимость складывается с авторской: элемент, скрытый в документе, не станет видимым из-за
+ * вместимости, а скрытый вместимостью держится флагом `NodeView.hiddenByOwner` (см. `applyVisibility`).
+ */
+export class ItemTableNodeView extends NodeView {
+    itemViews = [];
+    authoredVisibleCount = 0;
+    /** Транзиентное переопределение от игрового кода; `undefined` — авторское значение профиля. */
+    runtimeVisibleCount;
+    /** Транзиентный «скрыть/показать всё» поверх вместимости; `undefined` — вместимость решает сама. */
+    forcedItemsVisible;
+    /**
+     * Разрешённые views авторского списка `items`, позиционно выровненные с ним (`scene.ts`). Ссылка,
+     * которая ни во что не разрешилась, сохраняет свою дырку `undefined`, чтобы остальные элементы не
+     * сдвинулись; сама висячая ссылка — ошибка валидации документа, а не забота этого вида.
+     */
+    setItems(views) {
+        // Выбывшие из списка возвращаются под управление документа: иначе узел, убранный из таблицы,
+        // остался бы скрытым её прежней вместимостью навсегда.
+        const next = new Set(views);
+        for (const previous of this.itemViews) {
+            if (previous instanceof NodeView && !next.has(previous)) {
+                previous.hiddenByOwner = false;
+                previous.visible = previous.documentVisible;
+            }
+        }
+        this.itemViews = [...views];
+        this.applyVisibility();
+    }
+    /** Элементы в авторском порядке; нерезолвенные ссылки пропущены. */
+    get items() {
+        return this.itemViews.filter((item) => item !== undefined);
+    }
+    get visibleCount() {
+        return this.runtimeVisibleCount ?? this.authoredVisibleCount;
+    }
+    /** Транзиентно меняет вместимость; `undefined` возвращает авторское значение профиля. */
+    set visibleCount(value) {
+        this.runtimeVisibleCount = value === undefined ? undefined : Math.max(0, Math.round(value));
+        this.applyVisibility();
+    }
+    /** Элементы, показанные прямо сейчас, в авторском порядке. */
+    get visibleItems() {
+        return this.items.filter((item) => item.visible);
+    }
+    /** Индекс — позиция в авторском списке, а не среди показанных: адресация не «плавает». */
+    itemAt(index) {
+        return this.itemViews[index];
+    }
+    /** Показывает или прячет все элементы разом; `undefined` возвращает управление вместимости. */
+    setItemsVisible(visible) {
+        this.forcedItemsVisible = visible;
+        this.applyVisibility();
+    }
+    /**
+     * Проход по элементам: влезающие включены, остальные выключены. Помимо самого `visible` ставится
+     * `hiddenByOwner`, потому что `visible` узла пересчитывается из документа на каждом обновлении —
+     * в том числе из колбэка layout-движка, который для элемента внутри layout-группы срабатывает
+     * позже прохода таблицы и без флага вернул бы скрытый элемент обратно.
+     */
+    applyVisibility() {
+        const count = this.visibleCount;
+        this.itemViews.forEach((item, index) => {
+            if (item === undefined)
+                return;
+            const enabled = this.forcedItemsVisible ?? index < count;
+            if (item instanceof NodeView) {
+                item.hiddenByOwner = !enabled;
+                item.visible = enabled && item.documentVisible;
+                return;
+            }
+            item.visible = enabled;
+        });
+    }
+    syncContent(node, _transform, profile) {
+        if (node.type !== "item-table")
+            return;
+        this.authoredVisibleCount = resolveItemTableVisibleCount(node, profile);
+        this.applyVisibility();
+    }
+}
+//# sourceMappingURL=ItemTableNodeView.js.map

package/dist/views/ItemTableNodeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ItemTableNodeView.js","sourceRoot":"","sources":["../../src/views/ItemTableNodeView.ts"],"names":[],"mappings":"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","sourcesContent":["import { resolveItemTableVisibleCount, type LayoutProfileId, type UINode } from \"@pixi-ui-editor/schema\";\r\nimport { Container } from \"pixi.js\";\r\nimport { NodeView } from \"./NodeView.js\";\r\n\r\n/**\r\n * Узел фиксированной вместимости: держит авторский список узлов (`items`, ссылки по адресу — их\r\n * разрешает `scene.ts`, тем же приёмом, что цели spine-коннекторов) и показывает только первые\r\n * `visibleCount` из них — остальные скрыты всегда, а не «на этой странице». Автор раскладывает\r\n * элементы под максимум, а сколько их реально помещается, задаётся на профиль: в разной ориентации\r\n * экрана на экран влезает разное число строк.\r\n *\r\n * Список именно авторский, а не дети: элемент обычно уже лежит там, где его выравнивает layout-группа.\r\n *\r\n * Узел намеренно ничего больше не делает. Он не страницы (`PageGroupNodeView` показывает ровно\r\n * одного ребёнка и растягивает его на себя), не раскладка (позицию элементы сохраняют свою) и ничего не\r\n * знает ни про какие данные: чем наполнить видимые элементы и когда, решает игровой код через\r\n * generic API из `controls.ts` (`getItemTableViewVisibleItems`, `getItemTableViewItem`,\r\n * `setItemTableViewVisibleCount`, `setItemTableViewItemsVisible`). Связка «переключили страницу →\r\n * перезаполнили элементы» тоже принадлежит игре: `PaginationNodeView.onPageChange` и эта таблица\r\n * ничего друг о друге не знают.\r\n *\r\n * Видимость складывается с авторской: элемент, скрытый в документе, не станет видимым из-за\r\n * вместимости, а скрытый вместимостью держится флагом `NodeView.hiddenByOwner` (см. `applyVisibility`).\r\n */\r\nexport class ItemTableNodeView extends NodeView {\r\n  private itemViews: (Container | undefined)[] = [];\r\n  private authoredVisibleCount = 0;\r\n  /** Транзиентное переопределение от игрового кода; `undefined` — авторское значение профиля. */\r\n  private runtimeVisibleCount?: number;\r\n  /** Транзиентный «скрыть/показать всё» поверх вместимости; `undefined` — вместимость решает сама. */\r\n  private forcedItemsVisible?: boolean;\r\n\r\n  /**\r\n   * Разрешённые views авторского списка `items`, позиционно выровненные с ним (`scene.ts`). Ссылка,\r\n   * которая ни во что не разрешилась, сохраняет свою дырку `undefined`, чтобы остальные элементы не\r\n   * сдвинулись; сама висячая ссылка — ошибка валидации документа, а не забота этого вида.\r\n   */\r\n  setItems(views: readonly (Container | undefined)[]): void {\r\n    // Выбывшие из списка возвращаются под управление документа: иначе узел, убранный из таблицы,\r\n    // остался бы скрытым её прежней вместимостью навсегда.\r\n    const next = new Set(views);\r\n    for (const previous of this.itemViews) {\r\n      if (previous instanceof NodeView && !next.has(previous)) { previous.hiddenByOwner = false; previous.visible = previous.documentVisible; }\r\n    }\r\n    this.itemViews = [...views];\r\n    this.applyVisibility();\r\n  }\r\n\r\n  /** Элементы в авторском порядке; нерезолвенные ссылки пропущены. */\r\n  get items(): Container[] {\r\n    return this.itemViews.filter((item): item is Container => item !== undefined);\r\n  }\r\n\r\n  get visibleCount(): number {\r\n    return this.runtimeVisibleCount ?? this.authoredVisibleCount;\r\n  }\r\n\r\n  /** Транзиентно меняет вместимость; `undefined` возвращает авторское значение профиля. */\r\n  set visibleCount(value: number | undefined) {\r\n    this.runtimeVisibleCount = value === undefined ? undefined : Math.max(0, Math.round(value));\r\n    this.applyVisibility();\r\n  }\r\n\r\n  /** Элементы, показанные прямо сейчас, в авторском порядке. */\r\n  get visibleItems(): Container[] {\r\n    return this.items.filter((item) => item.visible);\r\n  }\r\n\r\n  /** Индекс — позиция в авторском списке, а не среди показанных: адресация не «плавает». */\r\n  itemAt(index: number): Container | undefined {\r\n    return this.itemViews[index];\r\n  }\r\n\r\n  /** Показывает или прячет все элементы разом; `undefined` возвращает управление вместимости. */\r\n  setItemsVisible(visible: boolean | undefined): void {\r\n    this.forcedItemsVisible = visible;\r\n    this.applyVisibility();\r\n  }\r\n\r\n  /**\r\n   * Проход по элементам: влезающие включены, остальные выключены. Помимо самого `visible` ставится\r\n   * `hiddenByOwner`, потому что `visible` узла пересчитывается из документа на каждом обновлении —\r\n   * в том числе из колбэка layout-движка, который для элемента внутри layout-группы срабатывает\r\n   * позже прохода таблицы и без флага вернул бы скрытый элемент обратно.\r\n   */\r\n  private applyVisibility(): void {\r\n    const count = this.visibleCount;\r\n    this.itemViews.forEach((item, index) => {\r\n      if (item === undefined) return;\r\n      const enabled = this.forcedItemsVisible ?? index < count;\r\n      if (item instanceof NodeView) {\r\n        item.hiddenByOwner = !enabled;\r\n        item.visible = enabled && item.documentVisible;\r\n        return;\r\n      }\r\n      item.visible = enabled;\r\n    });\r\n  }\r\n\r\n  protected syncContent(node: UINode, _transform: UINode[\"transform\"], profile: LayoutProfileId): void {\r\n    if (node.type !== \"item-table\") return;\r\n    this.authoredVisibleCount = resolveItemTableVisibleCount(node, profile);\r\n    this.applyVisibility();\r\n  }\r\n}\r\n"]}

package/dist/views/NodeView.d.ts

@@ -22,6 +22,18 @@ export declare abstract class NodeView extends Container {
     /** Authored/computed RectTransform-like rectangle; unlike Pixi bounds it also exists without content. */
     protected layoutWidth: number;
     protected layoutHeight: number;
+    /**
+     * Скрыт ли узел владельцем-вместимостью (`ItemTableNodeView`) поверх авторской видимости.
+     *
+     * Флаг живёт здесь, а не только в самом владельце, потому что `visible` заново выводится из
+     * документа на каждом обновлении — в том числе в `updateManaged`, который для элемента внутри
+     * layout-группы дёргает сам layout-движок своим колбэком `onLayout` (см. `LayoutItemContainer`),
+     * то есть уже после того, как владелец закончил свой проход. Одно присваивание `visible` снаружи
+     * пережило бы ровно до следующего пересчёта раскладки; сложение с этим флагом переживает любой.
+     */
+    hiddenByOwner: boolean;
+    /** Visibility last resolved from the document, before `hiddenByOwner` is applied on top. */
+    private authoredVisible;
     constructor(textures?: ReadonlyMap<string, Texture>);
     protected textureFor(assetId: string | undefined): Texture | undefined;
     /**
@@ -49,6 +61,8 @@ export declare abstract class NodeView extends Container {
     /** Applies the rectangle owned by a direct parent's layout solver. */
     updateManaged(node: UINode, profile: LayoutProfileId, size: LayoutSize): void;
     get layoutRectangle(): LayoutSize;
+    /** Авторская видимость узла отдельно от `visible`, поверх которой применяется `hiddenByOwner`. */
+    get documentVisible(): boolean;
     getSpine(): Spine | undefined;
     /**
      * Rasterizes canvas-based content (`TextNodeView`) at a higher pixel density than the renderer's

package/dist/views/NodeView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NodeView.d.ts","sourceRoot":"","sources":["../../src/views/NodeView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,iCAAiC,CAAC;AACxD,OAAO,EAAE,KAAK,eAAe,EAAE,KAAK,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAa,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AACxE,OAAO,EAAqD,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAElG;;;;GAIG;AACH,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG,SAAS,CAAC;AAE3D;;;;GAIG;AACH,8BAAsB,QAAS,SAAQ,SAAS;IAC9C,SAAS,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC;IAC9B,4FAA4F;IAC5F,SAAS,CAAC,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,CAAC;IACtE,6FAA6F;IAC7F,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAmB;IAC5C,yGAAyG;IACzG,SAAS,CAAC,WAAW,SAAK;IAC1B,SAAS,CAAC,YAAY,SAAK;IAE3B,YAAY,QAAQ,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,EAGlD;IAED,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAErE;IAED;;;;;;;;;;;;OAYG;IACH,aAAa,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,CAEvC;IAED,mGAAmG;IACnG,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,SAAS,GAAG,IAAI,CAI7C;IAED,kGAAkG;IAClG,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,eAAe,GAAG,IAAI,CAAC;IAE7G,OAAO,CAAC,sBAAsB;IAuB9B,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,EAAE,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAG5E;IAED,mGAAmG;IACnG,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,OAAO,UAAO,EAAE,OAAO,GAAE,eAA2B,GAAG,IAAI,CAEhH;IAED,sEAAsE;IACtE,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,EAAE,IAAI,EAAE,UAAU,GAAG,IAAI,CAG5E;IAED,IAAI,eAAe,IAAI,UAAU,CAEhC;IAED,QAAQ,IAAI,KAAK,GAAG,SAAS,CAE5B;IAED;;;;;;OAMG;IACH,oBAAoB,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAG;CACnD"}
+{"version":3,"file":"NodeView.d.ts","sourceRoot":"","sources":["../../src/views/NodeView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,iCAAiC,CAAC;AACxD,OAAO,EAAE,KAAK,eAAe,EAAE,KAAK,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAa,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AACxE,OAAO,EAAqD,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAElG;;;;GAIG;AACH,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG,SAAS,CAAC;AAE3D;;;;GAIG;AACH,8BAAsB,QAAS,SAAQ,SAAS;IAC9C,SAAS,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC;IAC9B,4FAA4F;IAC5F,SAAS,CAAC,QAAQ,CAAC,QAAQ,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,CAAC;IACtE,6FAA6F;IAC7F,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAmB;IAC5C,yGAAyG;IACzG,SAAS,CAAC,WAAW,SAAK;IAC1B,SAAS,CAAC,YAAY,SAAK;IAC3B;;;;;;;;OAQG;IACH,aAAa,UAAS;IACtB,4FAA4F;IAC5F,OAAO,CAAC,eAAe,CAAQ;IAE/B,YAAY,QAAQ,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,EAGlD;IAED,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAErE;IAED;;;;;;;;;;;;OAYG;IACH,aAAa,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,CAEvC;IAED,mGAAmG;IACnG,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,SAAS,GAAG,IAAI,CAI7C;IAED,kGAAkG;IAClG,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,eAAe,GAAG,IAAI,CAAC;IAE7G,OAAO,CAAC,sBAAsB;IAwB9B,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,EAAE,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAG5E;IAED,mGAAmG;IACnG,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,OAAO,UAAO,EAAE,OAAO,GAAE,eAA2B,GAAG,IAAI,CAEhH;IAED,sEAAsE;IACtE,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,EAAE,IAAI,EAAE,UAAU,GAAG,IAAI,CAG5E;IAED,IAAI,eAAe,IAAI,UAAU,CAEhC;IAED,kGAAkG;IAClG,IAAI,eAAe,IAAI,OAAO,CAE7B;IAED,QAAQ,IAAI,KAAK,GAAG,SAAS,CAE5B;IAED;;;;;;OAMG;IACH,oBAAoB,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAG;CACnD"}

package/dist/views/NodeView.js

@@ -15,6 +15,18 @@ export class NodeView extends Container {
     /** Authored/computed RectTransform-like rectangle; unlike Pixi bounds it also exists without content. */
     layoutWidth = 0;
     layoutHeight = 0;
+    /**
+     * Скрыт ли узел владельцем-вместимостью (`ItemTableNodeView`) поверх авторской видимости.
+     *
+     * Флаг живёт здесь, а не только в самом владельце, потому что `visible` заново выводится из
+     * документа на каждом обновлении — в том числе в `updateManaged`, который для элемента внутри
+     * layout-группы дёргает сам layout-движок своим колбэком `onLayout` (см. `LayoutItemContainer`),
+     * то есть уже после того, как владелец закончил свой проход. Одно присваивание `visible` снаружи
+     * пережило бы ровно до следующего пересчёта раскладки; сложение с этим флагом переживает любой.
+     */
+    hiddenByOwner = false;
+    /** Visibility last resolved from the document, before `hiddenByOwner` is applied on top. */
+    authoredVisible = true;
     constructor(textures) {
         super();
         this.textures = textures;
@@ -59,7 +71,8 @@ export class NodeView extends Container {
         this.position.set(managedByLayout ? pivotX : transform.x, managedByLayout ? pivotY : transform.y);
         this.rotation = transform.rotation;
         this.scale.set(transform.scaleX, transform.scaleY);
-        this.visible = visible;
+        this.authoredVisible = visible;
+        this.visible = visible && !this.hiddenByOwner;
         this.layoutWidth = transform.width;
         this.layoutHeight = transform.height;
         // Тот же прямоугольник, что видит пользователь: grab-зона не зависит от содержимого ноды.
@@ -84,6 +97,10 @@ export class NodeView extends Container {
     get layoutRectangle() {
         return { width: this.layoutWidth, height: this.layoutHeight };
     }
+    /** Авторская видимость узла отдельно от `visible`, поверх которой применяется `hiddenByOwner`. */
+    get documentVisible() {
+        return this.authoredVisible;
+    }
     getSpine() {
         return this.content instanceof Spine ? this.content : undefined;
     }

package/dist/views/NodeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"NodeView.js","sourceRoot":"","sources":["../../src/views/NodeView.ts"],"names":[],"mappings":"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","sourcesContent":["import { Spine } from \"@esotericsoftware/spine-pixi-v8\";\r\nimport { type LayoutProfileId, type UINode } from \"@pixi-ui-editor/schema\";\r\nimport { Container, Rectangle, Texture, type PointData } from \"pixi.js\";\r\nimport { resolveAnchoredTransform, resolveProfileTransform, type LayoutSize } from \"../layout.js\";\r\n\r\n/**\r\n * Whether a built scene is an inert authoring surface or a live one.\r\n * The editor canvas builds `authoring` scenes so controls never swallow selection and drag\r\n * gestures; Preview and the consuming app build `runtime` scenes with real pointer handling.\r\n */\r\nexport type SceneInteractionMode = \"authoring\" | \"runtime\";\r\n\r\n/**\r\n * Base display object for every schema node type. The whole layout contract — profile overrides,\r\n * anchors, pivot, position, scale, visibility — lives here once; subclasses only synchronize their\r\n * type-specific content against the resolved layout rectangle.\r\n */\r\nexport abstract class NodeView extends Container {\r\n  protected content?: Container;\r\n  /** A mutable scene texture map: assets may be loaded after this stable view was created. */\r\n  protected readonly textures: ReadonlyMap<string, Texture> | undefined;\r\n  /** Node's own grab rectangle in local space, kept equal to its resolved layout rectangle. */\r\n  private readonly grabRect = new Rectangle();\r\n  /** Authored/computed RectTransform-like rectangle; unlike Pixi bounds it also exists without content. */\r\n  protected layoutWidth = 0;\r\n  protected layoutHeight = 0;\r\n\r\n  constructor(textures?: ReadonlyMap<string, Texture>) {\r\n    super();\r\n    this.textures = textures;\r\n  }\r\n\r\n  protected textureFor(assetId: string | undefined): Texture | undefined {\r\n    return assetId === undefined ? undefined : this.textures?.get(assetId);\r\n  }\r\n\r\n  /**\r\n   * Makes every node selectable and draggable by its layout rectangle, whatever it renders.\r\n   *\r\n   * Lives here rather than in a subclass because a bare `Container` has no `containsPoint` of its\r\n   * own: without this, Pixi could only find a node through whatever content the subclass happens to\r\n   * draw, so nodes that draw nothing (container) or keep their content out of hit testing (button,\r\n   * whose `@pixi/ui` view is inert while authoring) would silently stop being selectable.\r\n   *\r\n   * Deliberately `containsPoint` and NOT `hitArea`: Pixi's `hitPruneFn` drops a container together\r\n   * with its whole subtree once the point falls outside its `hitArea`, which would make any child\r\n   * reaching past its parent's rectangle visible but unclickable. `containsPoint` never clips\r\n   * children — they are hit-tested first and independently, so a child always stays grabbable.\r\n   */\r\n  containsPoint(point: PointData): boolean {\r\n    return this.grabRect.contains(point.x, point.y);\r\n  }\r\n\r\n  /** Заменяет содержимое ноды: прежнее снимается со сцены и уничтожается, чтобы не копить сироты. */\r\n  protected setContent(content: Container): void {\r\n    if (this.content !== undefined) { this.removeChild(this.content); this.content.destroy(); }\r\n    this.content = content;\r\n    this.addChild(content);\r\n  }\r\n\r\n  /** Syncs type-specific content to the resolved layout rectangle; layout math itself is shared. */\r\n  protected abstract syncContent(node: UINode, transform: UINode[\"transform\"], profile: LayoutProfileId): void;\r\n\r\n  private applyResolvedTransform(node: UINode, transform: UINode[\"transform\"], visible: boolean, managedByLayout: boolean, profile: LayoutProfileId): void {\r\n    this.syncContent(node, transform, profile);\r\n\r\n    const pivotX = (transform.pivotX ?? 0) * transform.width;\r\n    const pivotY = (transform.pivotY ?? 0) * transform.height;\r\n    this.pivot.set(pivotX, pivotY);\r\n    // x/y are the pivot offset from the resolved anchor.  Thus a centred anchor and pivot at\r\n    // zero offsets place the visual centre exactly at the parent's centre.\r\n    // A managed child is positioned by its technical Yoga item. Its own NodeView keeps only the\r\n    // pivot offset inside that computed rectangle; authored x/y and anchors do not participate.\r\n    this.position.set(managedByLayout ? pivotX : transform.x, managedByLayout ? pivotY : transform.y);\r\n    this.rotation = transform.rotation;\r\n    this.scale.set(transform.scaleX, transform.scaleY);\r\n    this.visible = visible;\r\n    this.layoutWidth = transform.width;\r\n    this.layoutHeight = transform.height;\r\n    // Тот же прямоугольник, что видит пользователь: grab-зона не зависит от содержимого ноды.\r\n    this.grabRect.x = 0;\r\n    this.grabRect.y = 0;\r\n    this.grabRect.width = transform.width;\r\n    this.grabRect.height = transform.height;\r\n  }\r\n\r\n  update(node: UINode, profile: LayoutProfileId, parentSize?: LayoutSize): void {\r\n    const resolved = resolveProfileTransform(node, profile);\r\n    this.applyResolvedTransform(node, resolveAnchoredTransform(resolved.transform, parentSize), resolved.visible, false, profile);\r\n  }\r\n\r\n  /** Applies a transient editor rectangle without deriving it from content-dependent Pixi bounds. */\r\n  preview(node: UINode, transform: UINode[\"transform\"], visible = true, profile: LayoutProfileId = \"desktop\"): void {\r\n    this.applyResolvedTransform(node, transform, visible, false, profile);\r\n  }\r\n\r\n  /** Applies the rectangle owned by a direct parent's layout solver. */\r\n  updateManaged(node: UINode, profile: LayoutProfileId, size: LayoutSize): void {\r\n    const resolved = resolveProfileTransform(node, profile);\r\n    this.applyResolvedTransform(node, { ...resolved.transform, x: 0, y: 0, width: size.width, height: size.height }, resolved.visible, true, profile);\r\n  }\r\n\r\n  get layoutRectangle(): LayoutSize {\r\n    return { width: this.layoutWidth, height: this.layoutHeight };\r\n  }\r\n\r\n  getSpine(): Spine | undefined {\r\n    return this.content instanceof Spine ? this.content : undefined;\r\n  }\r\n\r\n  /**\r\n   * Rasterizes canvas-based content (`TextNodeView`) at a higher pixel density than the renderer's\r\n   * own backing resolution, so an authoring camera zoomed in doesn't magnify an already-rasterized\r\n   * bitmap past its source resolution and read as blurred. A no-op base implementation: sprite/\r\n   * graphics/bitmap-text content is either GPU-native (always crisp under zoom) or, for bitmap-text,\r\n   * has its resolution fixed by the installed `BitmapFont` and can't be changed per instance.\r\n   */\r\n  setContentResolution(_resolution: number): void {}\r\n}\r\n"]}
+{"version":3,"file":"NodeView.js","sourceRoot":"","sources":["../../src/views/NodeView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,iCAAiC,CAAC;AAExD,OAAO,EAAE,SAAS,EAAE,SAAS,EAA2B,MAAM,SAAS,CAAC;AACxE,OAAO,EAAE,wBAAwB,EAAE,uBAAuB,EAAmB,MAAM,cAAc,CAAC;AASlG;;;;GAIG;AACH,MAAM,OAAgB,QAAS,SAAQ,SAAS;IACpC,OAAO,CAAa;IAC9B,4FAA4F;IACzE,QAAQ,CAA2C;IACtE,6FAA6F;IAC5E,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;IAC5C,yGAAyG;IAC/F,WAAW,GAAG,CAAC,CAAC;IAChB,YAAY,GAAG,CAAC,CAAC;IAC3B;;;;;;;;OAQG;IACH,aAAa,GAAG,KAAK,CAAC;IACtB,4FAA4F;IACpF,eAAe,GAAG,IAAI,CAAC;IAE/B,YAAY,QAAuC;QACjD,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC3B,CAAC;IAES,UAAU,CAAC,OAA2B;QAC9C,OAAO,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IACzE,CAAC;IAED;;;;;;;;;;;;OAYG;IACH,aAAa,CAAC,KAAgB;QAC5B,OAAO,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAClD,CAAC;IAED,mGAAmG;IACzF,UAAU,CAAC,OAAkB;QACrC,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE,CAAC;YAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YAAC,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;QAAC,CAAC;QAC3F,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC;IAKO,sBAAsB,CAAC,IAAY,EAAE,SAA8B,EAAE,OAAgB,EAAE,eAAwB,EAAE,OAAwB;QAC/I,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;QAE3C,MAAM,MAAM,GAAG,CAAC,SAAS,CAAC,MAAM,IAAI,CAAC,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC;QACzD,MAAM,MAAM,GAAG,CAAC,SAAS,CAAC,MAAM,IAAI,CAAC,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC;QAC1D,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAC/B,yFAAyF;QACzF,uEAAuE;QACvE,4FAA4F;QAC5F,4FAA4F;QAC5F,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;QAClG,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAC;QACnC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;QACnD,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC;QAC/B,IAAI,CAAC,OAAO,GAAG,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC;QAC9C,IAAI,CAAC,WAAW,GAAG,SAAS,CAAC,KAAK,CAAC;QACnC,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,MAAM,CAAC;QACrC,0FAA0F;QAC1F,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC;QACpB,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC;QACpB,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC;QACtC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC;IAC1C,CAAC;IAED,MAAM,CAAC,IAAY,EAAE,OAAwB,EAAE,UAAuB;QACpE,MAAM,QAAQ,GAAG,uBAAuB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACxD,IAAI,CAAC,sBAAsB,CAAC,IAAI,EAAE,wBAAwB,CAAC,QAAQ,CAAC,SAAS,EAAE,UAAU,CAAC,EAAE,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;IAChI,CAAC;IAED,mGAAmG;IACnG,OAAO,CAAC,IAAY,EAAE,SAA8B,EAAE,OAAO,GAAG,IAAI,EAAE,OAAO,GAAoB,SAAS;QACxG,IAAI,CAAC,sBAAsB,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;IACxE,CAAC;IAED,sEAAsE;IACtE,aAAa,CAAC,IAAY,EAAE,OAAwB,EAAE,IAAgB;QACpE,MAAM,QAAQ,GAAG,uBAAuB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACxD,IAAI,CAAC,sBAAsB,CAAC,IAAI,EAAE,EAAE,GAAG,QAAQ,CAAC,SAAS,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,CAAC,OAAO,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;IACpJ,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC;IAChE,CAAC;IAED,kGAAkG;IAClG,IAAI,eAAe;QACjB,OAAO,IAAI,CAAC,eAAe,CAAC;IAC9B,CAAC;IAED,QAAQ;QACN,OAAO,IAAI,CAAC,OAAO,YAAY,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;IAClE,CAAC;IAED;;;;;;OAMG;IACH,oBAAoB,CAAC,WAAmB,IAAS,CAAC;CACnD","sourcesContent":["import { Spine } from \"@esotericsoftware/spine-pixi-v8\";\r\nimport { type LayoutProfileId, type UINode } from \"@pixi-ui-editor/schema\";\r\nimport { Container, Rectangle, Texture, type PointData } from \"pixi.js\";\r\nimport { resolveAnchoredTransform, resolveProfileTransform, type LayoutSize } from \"../layout.js\";\r\n\r\n/**\r\n * Whether a built scene is an inert authoring surface or a live one.\r\n * The editor canvas builds `authoring` scenes so controls never swallow selection and drag\r\n * gestures; Preview and the consuming app build `runtime` scenes with real pointer handling.\r\n */\r\nexport type SceneInteractionMode = \"authoring\" | \"runtime\";\r\n\r\n/**\r\n * Base display object for every schema node type. The whole layout contract — profile overrides,\r\n * anchors, pivot, position, scale, visibility — lives here once; subclasses only synchronize their\r\n * type-specific content against the resolved layout rectangle.\r\n */\r\nexport abstract class NodeView extends Container {\r\n  protected content?: Container;\r\n  /** A mutable scene texture map: assets may be loaded after this stable view was created. */\r\n  protected readonly textures: ReadonlyMap<string, Texture> | undefined;\r\n  /** Node's own grab rectangle in local space, kept equal to its resolved layout rectangle. */\r\n  private readonly grabRect = new Rectangle();\r\n  /** Authored/computed RectTransform-like rectangle; unlike Pixi bounds it also exists without content. */\r\n  protected layoutWidth = 0;\r\n  protected layoutHeight = 0;\r\n  /**\r\n   * Скрыт ли узел владельцем-вместимостью (`ItemTableNodeView`) поверх авторской видимости.\r\n   *\r\n   * Флаг живёт здесь, а не только в самом владельце, потому что `visible` заново выводится из\r\n   * документа на каждом обновлении — в том числе в `updateManaged`, который для элемента внутри\r\n   * layout-группы дёргает сам layout-движок своим колбэком `onLayout` (см. `LayoutItemContainer`),\r\n   * то есть уже после того, как владелец закончил свой проход. Одно присваивание `visible` снаружи\r\n   * пережило бы ровно до следующего пересчёта раскладки; сложение с этим флагом переживает любой.\r\n   */\r\n  hiddenByOwner = false;\r\n  /** Visibility last resolved from the document, before `hiddenByOwner` is applied on top. */\r\n  private authoredVisible = true;\r\n\r\n  constructor(textures?: ReadonlyMap<string, Texture>) {\r\n    super();\r\n    this.textures = textures;\r\n  }\r\n\r\n  protected textureFor(assetId: string | undefined): Texture | undefined {\r\n    return assetId === undefined ? undefined : this.textures?.get(assetId);\r\n  }\r\n\r\n  /**\r\n   * Makes every node selectable and draggable by its layout rectangle, whatever it renders.\r\n   *\r\n   * Lives here rather than in a subclass because a bare `Container` has no `containsPoint` of its\r\n   * own: without this, Pixi could only find a node through whatever content the subclass happens to\r\n   * draw, so nodes that draw nothing (container) or keep their content out of hit testing (button,\r\n   * whose `@pixi/ui` view is inert while authoring) would silently stop being selectable.\r\n   *\r\n   * Deliberately `containsPoint` and NOT `hitArea`: Pixi's `hitPruneFn` drops a container together\r\n   * with its whole subtree once the point falls outside its `hitArea`, which would make any child\r\n   * reaching past its parent's rectangle visible but unclickable. `containsPoint` never clips\r\n   * children — they are hit-tested first and independently, so a child always stays grabbable.\r\n   */\r\n  containsPoint(point: PointData): boolean {\r\n    return this.grabRect.contains(point.x, point.y);\r\n  }\r\n\r\n  /** Заменяет содержимое ноды: прежнее снимается со сцены и уничтожается, чтобы не копить сироты. */\r\n  protected setContent(content: Container): void {\r\n    if (this.content !== undefined) { this.removeChild(this.content); this.content.destroy(); }\r\n    this.content = content;\r\n    this.addChild(content);\r\n  }\r\n\r\n  /** Syncs type-specific content to the resolved layout rectangle; layout math itself is shared. */\r\n  protected abstract syncContent(node: UINode, transform: UINode[\"transform\"], profile: LayoutProfileId): void;\r\n\r\n  private applyResolvedTransform(node: UINode, transform: UINode[\"transform\"], visible: boolean, managedByLayout: boolean, profile: LayoutProfileId): void {\r\n    this.syncContent(node, transform, profile);\r\n\r\n    const pivotX = (transform.pivotX ?? 0) * transform.width;\r\n    const pivotY = (transform.pivotY ?? 0) * transform.height;\r\n    this.pivot.set(pivotX, pivotY);\r\n    // x/y are the pivot offset from the resolved anchor.  Thus a centred anchor and pivot at\r\n    // zero offsets place the visual centre exactly at the parent's centre.\r\n    // A managed child is positioned by its technical Yoga item. Its own NodeView keeps only the\r\n    // pivot offset inside that computed rectangle; authored x/y and anchors do not participate.\r\n    this.position.set(managedByLayout ? pivotX : transform.x, managedByLayout ? pivotY : transform.y);\r\n    this.rotation = transform.rotation;\r\n    this.scale.set(transform.scaleX, transform.scaleY);\r\n    this.authoredVisible = visible;\r\n    this.visible = visible && !this.hiddenByOwner;\r\n    this.layoutWidth = transform.width;\r\n    this.layoutHeight = transform.height;\r\n    // Тот же прямоугольник, что видит пользователь: grab-зона не зависит от содержимого ноды.\r\n    this.grabRect.x = 0;\r\n    this.grabRect.y = 0;\r\n    this.grabRect.width = transform.width;\r\n    this.grabRect.height = transform.height;\r\n  }\r\n\r\n  update(node: UINode, profile: LayoutProfileId, parentSize?: LayoutSize): void {\r\n    const resolved = resolveProfileTransform(node, profile);\r\n    this.applyResolvedTransform(node, resolveAnchoredTransform(resolved.transform, parentSize), resolved.visible, false, profile);\r\n  }\r\n\r\n  /** Applies a transient editor rectangle without deriving it from content-dependent Pixi bounds. */\r\n  preview(node: UINode, transform: UINode[\"transform\"], visible = true, profile: LayoutProfileId = \"desktop\"): void {\r\n    this.applyResolvedTransform(node, transform, visible, false, profile);\r\n  }\r\n\r\n  /** Applies the rectangle owned by a direct parent's layout solver. */\r\n  updateManaged(node: UINode, profile: LayoutProfileId, size: LayoutSize): void {\r\n    const resolved = resolveProfileTransform(node, profile);\r\n    this.applyResolvedTransform(node, { ...resolved.transform, x: 0, y: 0, width: size.width, height: size.height }, resolved.visible, true, profile);\r\n  }\r\n\r\n  get layoutRectangle(): LayoutSize {\r\n    return { width: this.layoutWidth, height: this.layoutHeight };\r\n  }\r\n\r\n  /** Авторская видимость узла отдельно от `visible`, поверх которой применяется `hiddenByOwner`. */\r\n  get documentVisible(): boolean {\r\n    return this.authoredVisible;\r\n  }\r\n\r\n  getSpine(): Spine | undefined {\r\n    return this.content instanceof Spine ? this.content : undefined;\r\n  }\r\n\r\n  /**\r\n   * Rasterizes canvas-based content (`TextNodeView`) at a higher pixel density than the renderer's\r\n   * own backing resolution, so an authoring camera zoomed in doesn't magnify an already-rasterized\r\n   * bitmap past its source resolution and read as blurred. A no-op base implementation: sprite/\r\n   * graphics/bitmap-text content is either GPU-native (always crisp under zoom) or, for bitmap-text,\r\n   * has its resolution fixed by the installed `BitmapFont` and can't be changed per instance.\r\n   */\r\n  setContentResolution(_resolution: number): void {}\r\n}\r\n"]}

package/dist/views/PaginationNodeView.d.ts

@@ -3,6 +3,17 @@ import { Texture } from "pixi.js";
 import { Signal } from "typed-signals";
 import { NodeView, type SceneInteractionMode } from "./NodeView.js";
 export type { PaginationNode };
+/**
+ * Кнопка-стрелка пагинатора: ровно та часть `ButtonNodeView`/`StagedButtonNodeView`, которая нужна
+ * виджету, — нажатие и «доступна ли». Тип объявлен структурно, чтобы этот файл не зависел от обоих
+ * классов кнопок и не решал, какой из них «настоящий».
+ */
+export type PaginationArrow = {
+    onPress: {
+        connect(handler: () => void): unknown;
+    };
+    enabled: boolean;
+};
 /**
  * Standalone page indicator: N procedurally generated items arranged by `@pixi/ui`'s `List` (the same
  * approach `ScrollViewNodeView`/`scrollView.ts` use for arranging children) — this view never
@@ -18,12 +29,22 @@ export type { PaginationNode };
  * item count/footprint is a runtime fact about this control, not scene topology — it only rebuilds this
  * view's own item children, never the owning `NodeView` or the wider scene tree. The active pill itself
  * is not structural: switching pages only recreates the (one) background view that needs to move.
+ *
+ * With `visiblePageCount` set, the indicator becomes a fixed strip of that many slots with the active
+ * page always in the middle one (4 pages, page 3 active → 2-3-4). A slot pointing outside the real
+ * page range keeps its footprint and renders nothing, so the active page never shifts sideways.
+ *
+ * The prev/next arrows are ordinary authored button nodes placed wherever the layout needs them; the
+ * widget only takes their views (`scene.ts`'s `wireNodeReferences`, the same address → view resolution
+ * Spine connector targets use) and steps the page on press. It never draws an arrow itself.
  */
 export declare class PaginationNodeView extends NodeView {
     private readonly list;
     private readonly interaction;
     private readonly fonts;
     private items;
+    private visibleSlots;
+    private arrows?;
     private styleMode;
     private activeTexture;
     private inactiveTexture;
@@ -40,15 +61,30 @@ export declare class PaginationNodeView extends NodeView {
     readonly onPageChange: Signal<(page: number) => void>;
     constructor(node: PaginationNode, textures: ReadonlyMap<string, Texture> | undefined, interaction: SceneInteractionMode, fonts: ReadonlyMap<string, string> | undefined);
     private createBackgroundView;
+    /** How many indicator slots are drawn: the fixed authored window, or one slot per real page. */
+    private get slotCount();
+    /** The page a slot points at. Windowed slots slide with the current page, which keeps its middle seat. */
+    private pageForSlot;
     private createItem;
-    /** Recreates every item for the current `styleMode`/`pageCountState`/`dotWidth`/`dotHeight`. */
+    /** Recreates every item for the current `styleMode`/`slotCount`/`dotWidth`/`dotHeight`. */
     private buildItems;
     /** Authoring canvas stays inert like every other control; a clickable item is only live at runtime. */
     private wireItem;
     private applyCurrentPage;
+    /**
+     * Подключает авторские кнопки-стрелки: нажатие шагает на страницу назад/вперёд и эмитит
+     * `onPageChange`, как клик по самому пункту. Кнопки остаются обычными нодами сцены — виджет только
+     * подписывается на них и гасит ту, за которой страниц больше нет.
+     */
+    setArrows(arrows: {
+        previous?: PaginationArrow;
+        next?: PaginationArrow;
+    }): void;
+    /** На краях диапазона соответствующая стрелка недоступна — она никуда не ведёт. */
+    private applyArrowState;
     protected syncContent(node: UINode): void;
     get pageCount(): number;
-    /** Structural: rebuilds every item. Used both by document edits and `setPaginationViewPageCount`. */
+    /** Used by `setPaginationViewPageCount` once game code knows the real content length. */
     set pageCount(value: number);
     get page(): number;
     /** External sync from game code (or editor preview): highlights an item without emitting `onPageChange`. */

package/dist/views/PaginationNodeView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationNodeView.d.ts","sourceRoot":"","sources":["../../src/views/PaginationNodeView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAA4B,KAAK,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAExH,OAAO,EAA4C,OAAO,EAAyB,MAAM,SAAS,CAAC;AACnG,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEpE,YAAY,EAAE,cAAc,EAAE,CAAC;AAoE/B;;;;;;;;;;;;;;;GAeG;AACH,qBAAa,kBAAmB,SAAQ,QAAQ;IAC9C,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAO;IAC5B,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAuB;IACnD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA0C;IAChE,OAAO,CAAC,KAAK,CAA+B;IAC5C,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,aAAa,CAAU;IAC/B,OAAO,CAAC,eAAe,CAAU;IACjC,OAAO,CAAC,WAAW,CAAkC;IACrD,OAAO,CAAC,iBAAiB,CAAqB;IAC9C,OAAO,CAAC,6BAA6B,CAAsB;IAC3D,OAAO,CAAC,qBAAqB,CAA4B;IACzD,OAAO,CAAC,cAAc,CAAS;IAC/B,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,cAAc,CAAU;IAEhC,0GAA0G;IAC1G,QAAQ,CAAC,YAAY,gBAAqB,MAAM,KAAK,IAAI,EAAI;IAE7D,YAAY,IAAI,EAAE,cAAc,EAAE,QAAQ,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,EAAE,WAAW,EAAE,oBAAoB,EAAE,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,EAmBtK;IAED,OAAO,CAAC,oBAAoB;IAM5B,OAAO,CAAC,UAAU;IAelB,gGAAgG;IAChG,OAAO,CAAC,UAAU;IAWlB,uGAAuG;IACvG,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,gBAAgB;IAexB,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAyBxC;IAED,IAAI,SAAS,IAAI,MAAM,CAAgC;IAEvD,qGAAqG;IACrG,IAAI,SAAS,CAAC,KAAK,EAAE,MAAM,EAM1B;IAED,IAAI,IAAI,IAAI,MAAM,CAA6B;IAE/C,4GAA4G;IAC5G,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAKrB;IAED,iHAAiH;IACjH,OAAO,CAAC,OAAO;CAKhB"}
+{"version":3,"file":"PaginationNodeView.d.ts","sourceRoot":"","sources":["../../src/views/PaginationNodeView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAA4B,KAAK,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAExH,OAAO,EAA4C,OAAO,EAAyB,MAAM,SAAS,CAAC;AACnG,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEpE,YAAY,EAAE,cAAc,EAAE,CAAC;AAuB/B;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG;IAAE,OAAO,EAAE;QAAE,OAAO,CAAC,OAAO,EAAE,MAAM,IAAI,GAAG,OAAO,CAAA;KAAE,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC;AA+CvG;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBAAa,kBAAmB,SAAQ,QAAQ;IAC9C,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAO;IAC5B,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAuB;IACnD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAA0C;IAChE,OAAO,CAAC,KAAK,CAA+B;IAC5C,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,MAAM,CAAC,CAAyD;IACxE,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,aAAa,CAAU;IAC/B,OAAO,CAAC,eAAe,CAAU;IACjC,OAAO,CAAC,WAAW,CAAkC;IACrD,OAAO,CAAC,iBAAiB,CAAqB;IAC9C,OAAO,CAAC,6BAA6B,CAAsB;IAC3D,OAAO,CAAC,qBAAqB,CAA4B;IACzD,OAAO,CAAC,cAAc,CAAS;IAC/B,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,cAAc,CAAU;IAEhC,0GAA0G;IAC1G,QAAQ,CAAC,YAAY,gBAAqB,MAAM,KAAK,IAAI,EAAI;IAE7D,YAAY,IAAI,EAAE,cAAc,EAAE,QAAQ,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,EAAE,WAAW,EAAE,oBAAoB,EAAE,KAAK,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,EAoBtK;IAED,OAAO,CAAC,oBAAoB;IAM5B,gGAAgG;IAChG,OAAO,KAAK,SAAS,GAEpB;IAED,0GAA0G;IAC1G,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,UAAU;IAmBlB,2FAA2F;IAC3F,OAAO,CAAC,UAAU;IAYlB,uGAAuG;IACvG,OAAO,CAAC,QAAQ;IAWhB,OAAO,CAAC,gBAAgB;IAmBxB;;;;OAIG;IACH,SAAS,CAAC,MAAM,EAAE;QAAE,QAAQ,CAAC,EAAE,eAAe,CAAC;QAAC,IAAI,CAAC,EAAE,eAAe,CAAA;KAAE,GAAG,IAAI,CAK9E;IAED,mFAAmF;IACnF,OAAO,CAAC,eAAe;IAMvB,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CA2BxC;IAED,IAAI,SAAS,IAAI,MAAM,CAAgC;IAEvD,yFAAyF;IACzF,IAAI,SAAS,CAAC,KAAK,EAAE,MAAM,EAQ1B;IAED,IAAI,IAAI,IAAI,MAAM,CAA6B;IAE/C,4GAA4G;IAC5G,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAKrB;IAED,iHAAiH;IACjH,OAAO,CAAC,OAAO;CAKhB"}

package/dist/views/PaginationNodeView.js

@@ -81,12 +81,22 @@ class NumberItem extends Container {
  * item count/footprint is a runtime fact about this control, not scene topology — it only rebuilds this
  * view's own item children, never the owning `NodeView` or the wider scene tree. The active pill itself
  * is not structural: switching pages only recreates the (one) background view that needs to move.
+ *
+ * With `visiblePageCount` set, the indicator becomes a fixed strip of that many slots with the active
+ * page always in the middle one (4 pages, page 3 active → 2-3-4). A slot pointing outside the real
+ * page range keeps its footprint and renders nothing, so the active page never shifts sideways.
+ *
+ * The prev/next arrows are ordinary authored button nodes placed wherever the layout needs them; the
+ * widget only takes their views (`scene.ts`'s `wireNodeReferences`, the same address → view resolution
+ * Spine connector targets use) and steps the page on press. It never draws an arrow itself.
  */
 export class PaginationNodeView extends NodeView {
     list;
     interaction;
     fonts;
     items = [];
+    visibleSlots;
+    arrows;
     styleMode;
     activeTexture;
     inactiveTexture;
@@ -113,7 +123,8 @@ export class PaginationNodeView extends NodeView {
         this.numberActiveBackgroundTexture = node.numberActiveBackgroundAssetId === undefined ? undefined : this.textureFor(node.numberActiveBackgroundAssetId);
         this.numberActiveNineSlice = node.numberActiveNineSlice;
         this.pageCountState = Math.max(1, Math.round(node.pageCount));
-        this.currentPage = clampPage(node.defaultPage, this.pageCountState);
+        this.visibleSlots = node.visiblePageCount;
+        this.currentPage = clampPage(node.defaultPage, this.pageCount);
         this.dotWidth = node.dotSize.width;
         this.dotHeight = node.dotSize.height;
         this.clickableState = node.clickable;
@@ -126,57 +137,97 @@ export class PaginationNodeView extends NodeView {
             ? new Sprite(texture)
             : new NineSliceSprite({ texture, leftWidth: this.numberActiveNineSlice.left, topHeight: this.numberActiveNineSlice.top, rightWidth: this.numberActiveNineSlice.right, bottomHeight: this.numberActiveNineSlice.bottom });
     }
-    createItem(index) {
+    /** How many indicator slots are drawn: the fixed authored window, or one slot per real page. */
+    get slotCount() {
+        return this.visibleSlots === undefined ? this.pageCount : Math.max(1, Math.round(this.visibleSlots));
+    }
+    /** The page a slot points at. Windowed slots slide with the current page, which keeps its middle seat. */
+    pageForSlot(slot) {
+        return this.visibleSlots === undefined ? slot : this.currentPage - Math.floor(this.slotCount / 2) + slot;
+    }
+    createItem(slot) {
+        const page = this.pageForSlot(slot);
+        const exists = page >= 0 && page < this.pageCount;
+        const isActive = exists && page === this.currentPage;
         if (this.styleMode === "dots") {
-            const dot = new Sprite(index === this.currentPage ? this.activeTexture : this.inactiveTexture);
+            const dot = new Sprite(isActive ? this.activeTexture : this.inactiveTexture);
             dot.setSize(this.dotWidth, this.dotHeight);
+            // An out-of-range slot renders nothing but keeps its size, so `List` still reserves its place.
+            dot.visible = exists;
             return dot;
         }
-        const isActive = index === this.currentPage;
         const baseFill = this.numberStyle?.fill ?? DEFAULT_NUMBER_STYLE.fill;
         const fill = isActive ? this.numberActiveColor ?? baseFill : baseFill;
-        const item = new NumberItem(new Text({ text: String(index + 1), style: numberTextStyle(this.numberStyle, fill, this.fonts) }));
+        const item = new NumberItem(new Text({ text: exists ? String(page + 1) : "", style: numberTextStyle(this.numberStyle, fill, this.fonts) }));
         item.resize(this.dotWidth, this.dotHeight);
         if (isActive && this.numberActiveBackgroundTexture !== undefined)
             item.setBackground(this.createBackgroundView(this.numberActiveBackgroundTexture));
         return item;
     }
-    /** Recreates every item for the current `styleMode`/`pageCountState`/`dotWidth`/`dotHeight`. */
+    /** Recreates every item for the current `styleMode`/`slotCount`/`dotWidth`/`dotHeight`. */
     buildItems() {
         this.list.removeChildren();
         this.items = [];
-        for (let index = 0; index < this.pageCountState; index++) {
-            const item = this.createItem(index);
-            this.wireItem(item, index);
+        for (let slot = 0; slot < this.slotCount; slot++) {
+            const item = this.createItem(slot);
+            this.wireItem(item, slot);
             this.items.push(item);
             this.list.addChild(item);
         }
+        this.applyArrowState();
     }
     /** Authoring canvas stays inert like every other control; a clickable item is only live at runtime. */
-    wireItem(item, index) {
+    wireItem(item, slot) {
         if (this.interaction === "authoring" || !this.clickableState) {
             item.eventMode = "none";
             return;
         }
         item.eventMode = "static";
         item.cursor = "pointer";
-        item.on("pointertap", () => this.setPage(index));
+        // Resolved on click, not captured: a windowed slot points at a different page after every move.
+        item.on("pointertap", () => {
+            const page = this.pageForSlot(slot);
+            if (page >= 0 && page < this.pageCount)
+                this.setPage(page);
+        });
     }
     applyCurrentPage() {
-        if (this.styleMode === "dots") {
-            this.items.forEach((item, index) => { if (item instanceof Sprite)
-                item.texture = index === this.currentPage ? this.activeTexture : this.inactiveTexture; });
-            return;
-        }
         const baseFill = this.numberStyle?.fill ?? DEFAULT_NUMBER_STYLE.fill;
-        this.items.forEach((item, index) => {
-            if (!(item instanceof NumberItem))
+        this.items.forEach((item, slot) => {
+            const page = this.pageForSlot(slot);
+            const exists = page >= 0 && page < this.pageCount;
+            const isActive = exists && page === this.currentPage;
+            if (item instanceof NumberItem) {
+                item.numberText.text = exists ? String(page + 1) : "";
+                item.numberText.style = numberTextStyle(this.numberStyle, isActive ? this.numberActiveColor ?? baseFill : baseFill, this.fonts);
+                item.setBackground(isActive && this.numberActiveBackgroundTexture !== undefined ? this.createBackgroundView(this.numberActiveBackgroundTexture) : undefined);
                 return;
-            const isActive = index === this.currentPage;
-            const fill = isActive ? this.numberActiveColor ?? baseFill : baseFill;
-            item.numberText.style = numberTextStyle(this.numberStyle, fill, this.fonts);
-            item.setBackground(isActive && this.numberActiveBackgroundTexture !== undefined ? this.createBackgroundView(this.numberActiveBackgroundTexture) : undefined);
+            }
+            item.texture = isActive ? this.activeTexture : this.inactiveTexture;
+            item.setSize(this.dotWidth, this.dotHeight);
+            item.visible = exists;
         });
+        this.applyArrowState();
+    }
+    /**
+     * Подключает авторские кнопки-стрелки: нажатие шагает на страницу назад/вперёд и эмитит
+     * `onPageChange`, как клик по самому пункту. Кнопки остаются обычными нодами сцены — виджет только
+     * подписывается на них и гасит ту, за которой страниц больше нет.
+     */
+    setArrows(arrows) {
+        this.arrows = arrows;
+        arrows.previous?.onPress.connect(() => this.setPage(this.currentPage - 1));
+        arrows.next?.onPress.connect(() => this.setPage(this.currentPage + 1));
+        this.applyArrowState();
+    }
+    /** На краях диапазона соответствующая стрелка недоступна — она никуда не ведёт. */
+    applyArrowState() {
+        if (this.arrows === undefined)
+            return;
+        if (this.arrows.previous !== undefined)
+            this.arrows.previous.enabled = this.currentPage > 0;
+        if (this.arrows.next !== undefined)
+            this.arrows.next.enabled = this.currentPage < this.pageCount - 1;
     }
     syncContent(node) {
         if (node.type !== "pagination")
@@ -185,7 +236,10 @@ export class PaginationNodeView extends NodeView {
         const inactive = node.inactiveAssetId === undefined ? Texture.WHITE : this.textureFor(node.inactiveAssetId) ?? Texture.WHITE;
         const pageCount = Math.max(1, Math.round(node.pageCount));
         this.clickableState = node.clickable;
-        const structureChanged = node.style !== this.styleMode || pageCount !== this.pageCountState || node.dotSize.width !== this.dotWidth || node.dotSize.height !== this.dotHeight;
+        const previousSlotCount = this.slotCount;
+        this.visibleSlots = node.visiblePageCount;
+        this.pageCountState = pageCount;
+        const structureChanged = node.style !== this.styleMode || this.slotCount !== previousSlotCount || node.dotSize.width !== this.dotWidth || node.dotSize.height !== this.dotHeight;
         this.styleMode = node.style;
         this.activeTexture = active;
         this.inactiveTexture = inactive;
@@ -193,10 +247,9 @@ export class PaginationNodeView extends NodeView {
         this.numberActiveColor = node.numberActiveColor;
         this.numberActiveBackgroundTexture = node.numberActiveBackgroundAssetId === undefined ? undefined : this.textureFor(node.numberActiveBackgroundAssetId);
         this.numberActiveNineSlice = node.numberActiveNineSlice;
-        this.pageCountState = pageCount;
         this.dotWidth = node.dotSize.width;
         this.dotHeight = node.dotSize.height;
-        this.currentPage = clampPage(this.currentPage, pageCount);
+        this.currentPage = clampPage(this.currentPage, this.pageCount);
         if (this.list.type !== node.direction)
             this.list.type = node.direction;
         if (this.list.elementsMargin !== node.spacing)
@@ -207,14 +260,18 @@ export class PaginationNodeView extends NodeView {
             this.applyCurrentPage();
     }
     get pageCount() { return this.pageCountState; }
-    /** Structural: rebuilds every item. Used both by document edits and `setPaginationViewPageCount`. */
+    /** Used by `setPaginationViewPageCount` once game code knows the real content length. */
     set pageCount(value) {
         const next = Math.max(1, Math.round(value));
         if (next === this.pageCountState)
             return;
+        const previousSlotCount = this.slotCount;
         this.pageCountState = next;
-        this.currentPage = clampPage(this.currentPage, next);
-        this.buildItems();
+        this.currentPage = clampPage(this.currentPage, this.pageCount);
+        if (this.slotCount === previousSlotCount)
+            this.applyCurrentPage();
+        else
+            this.buildItems();
     }
     get page() { return this.currentPage; }
     /** External sync from game code (or editor preview): highlights an item without emitting `onPageChange`. */