@energy8platform/game-engine 0.10.10 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/README.md +185 -74
  2. package/dist/index.cjs.js +1280 -296
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.d.ts +362 -46
  5. package/dist/index.esm.js +1281 -298
  6. package/dist/index.esm.js.map +1 -1
  7. package/dist/lua.cjs.js +16 -21
  8. package/dist/lua.cjs.js.map +1 -1
  9. package/dist/lua.d.ts +0 -2
  10. package/dist/lua.esm.js +16 -21
  11. package/dist/lua.esm.js.map +1 -1
  12. package/dist/react.cjs.js +2372 -11
  13. package/dist/react.cjs.js.map +1 -1
  14. package/dist/react.d.ts +17 -6
  15. package/dist/react.esm.js +2372 -12
  16. package/dist/react.esm.js.map +1 -1
  17. package/dist/ui.cjs.js +1553 -632
  18. package/dist/ui.cjs.js.map +1 -1
  19. package/dist/ui.d.ts +374 -46
  20. package/dist/ui.esm.js +1553 -634
  21. package/dist/ui.esm.js.map +1 -1
  22. package/dist/vite.cjs.js +1 -11
  23. package/dist/vite.cjs.js.map +1 -1
  24. package/dist/vite.d.ts +1 -1
  25. package/dist/vite.esm.js +1 -11
  26. package/dist/vite.esm.js.map +1 -1
  27. package/package.json +3 -18
  28. package/src/index.ts +3 -3
  29. package/src/lua/LuaEngine.ts +8 -18
  30. package/src/lua/SimulationRunner.ts +7 -3
  31. package/src/react/applyProps.ts +86 -0
  32. package/src/react/extendAll.ts +27 -6
  33. package/src/react/index.ts +1 -1
  34. package/src/react/jsx.d.ts +222 -0
  35. package/src/react/reconciler.ts +22 -5
  36. package/src/ui/BalanceDisplay.ts +31 -38
  37. package/src/ui/Button.ts +217 -53
  38. package/src/ui/FlexContainer.ts +479 -0
  39. package/src/ui/Label.ts +13 -0
  40. package/src/ui/Layout.ts +86 -87
  41. package/src/ui/Modal.ts +11 -1
  42. package/src/ui/Panel.ts +108 -36
  43. package/src/ui/ProgressBar.ts +85 -31
  44. package/src/ui/ScrollContainer.ts +397 -45
  45. package/src/ui/Toast.ts +47 -17
  46. package/src/ui/WinDisplay.ts +51 -39
  47. package/src/ui/index.ts +5 -11
  48. package/src/ui/view.ts +28 -0
  49. package/src/vite/index.ts +1 -11
package/dist/index.d.ts CHANGED
@@ -1,8 +1,6 @@
1
1
  import { Container, ApplicationOptions, Application, Texture, AnimatedSprite, Spritesheet, TextStyle, ColorSource } from 'pixi.js';
2
2
  import { CasinoGameSDK, InitData, GameConfigData, SessionData, PlayParams, PlayResultData } from '@energy8platform/game-sdk';
3
3
  export { AnywhereWinData, BalanceData, BridgeDestroyedError, BridgeNotReadyError, GameConfigData, InitData, PaylineData, PlayParams, PlayResultData, SDKError, SessionData, SymbolData, TimeoutError, WinLineData } from '@energy8platform/game-sdk';
4
- import { FancyButton, ScrollBox } from '@pixi/ui';
5
- import { LayoutContainer } from '@pixi/layout/components';
6
4
 
7
5
  declare enum ScaleMode {
8
6
  /** Fit inside container, maintain aspect ratio (letterbox/pillarbox) */
@@ -1264,11 +1262,137 @@ declare class SpriteAnimation {
1264
1262
  static getTexturesByPrefix(sheet: Spritesheet, prefix: string): Texture[];
1265
1263
  }
1266
1264
 
1265
+ type FlexDirection = 'row' | 'column';
1266
+ type JustifyContent = 'start' | 'center' | 'end' | 'space-between' | 'space-around';
1267
+ type AlignItems = 'start' | 'center' | 'end' | 'stretch';
1268
+ interface FlexItemConfig {
1269
+ /** Flex grow factor (0 = fixed size) */
1270
+ flexGrow?: number;
1271
+ /** Explicit width override for layout calculations */
1272
+ layoutWidth?: number;
1273
+ /** Explicit height override for layout calculations */
1274
+ layoutHeight?: number;
1275
+ }
1276
+ interface FlexContainerConfig {
1277
+ /** Layout direction (default: 'row') */
1278
+ direction?: FlexDirection;
1279
+ /** Main-axis distribution (default: 'start') */
1280
+ justifyContent?: JustifyContent;
1281
+ /** Cross-axis alignment (default: 'start') */
1282
+ alignItems?: AlignItems;
1283
+ /** Gap between children in pixels (default: 0) */
1284
+ gap?: number;
1285
+ /** Padding [top, right, bottom, left] or single number (default: 0) */
1286
+ padding?: number | [number, number, number, number];
1287
+ /** Enable wrapping to next line (default: false) */
1288
+ flexWrap?: boolean;
1289
+ /** Maximum width before wrapping (only with flexWrap) */
1290
+ maxWidth?: number;
1291
+ /** Maximum height before wrapping (only with flexWrap + column) */
1292
+ maxHeight?: number;
1293
+ /** Explicit container width (used for cross-axis alignment/stretch) */
1294
+ width?: number;
1295
+ /** Explicit container height (used for cross-axis alignment/stretch) */
1296
+ height?: number;
1297
+ }
1298
+ /**
1299
+ * Lightweight flexbox-like layout container for PixiJS.
1300
+ *
1301
+ * Supports row/column direction, justify/align, gap, padding, wrapping,
1302
+ * and flex-grow distribution. Zero external dependencies.
1303
+ *
1304
+ * @example
1305
+ * ```ts
1306
+ * const toolbar = new FlexContainer({
1307
+ * direction: 'row',
1308
+ * justifyContent: 'space-between',
1309
+ * alignItems: 'center',
1310
+ * gap: 16,
1311
+ * padding: 12,
1312
+ * });
1313
+ *
1314
+ * toolbar.addFlexChild(button1);
1315
+ * toolbar.addFlexChild(button2);
1316
+ * toolbar.resize(800, 60);
1317
+ * ```
1318
+ */
1319
+ declare class FlexContainer extends Container {
1320
+ readonly __uiComponent: true;
1321
+ private _config;
1322
+ private _padding;
1323
+ private _maxWidth;
1324
+ private _maxHeight;
1325
+ /** @internal */ _explicitWidth: number;
1326
+ /** @internal */ _explicitHeight: number;
1327
+ private _layoutChildren;
1328
+ private _layoutDirty;
1329
+ constructor(config?: FlexContainerConfig);
1330
+ /** Add a child with optional flex config. Also registers in flex layout. */
1331
+ addFlexChild(child: Container, flexConfig?: FlexItemConfig): this;
1332
+ /** Remove a child from flex layout and display list */
1333
+ removeFlexChild(child: Container): this;
1334
+ /** Remove all flex children */
1335
+ clearFlexChildren(): this;
1336
+ /**
1337
+ * Override addChild so children automatically participate in flex layout.
1338
+ * This enables declarative usage from React JSX.
1339
+ */
1340
+ addChild<T extends Container>(...children: T[]): T;
1341
+ removeChild<T extends Container>(...children: T[]): T;
1342
+ /** Get all flex layout children (read-only) */
1343
+ get flexChildren(): readonly Container[];
1344
+ /** Update the container size and recalculate layout */
1345
+ resize(width: number, height: number): void;
1346
+ /** Update layout direction */
1347
+ setDirection(direction: FlexDirection): void;
1348
+ /** Update justifyContent */
1349
+ setJustifyContent(justify: JustifyContent): void;
1350
+ /** Update alignItems */
1351
+ setAlignItems(align: AlignItems): void;
1352
+ /** Update gap */
1353
+ setGap(gap: number): void;
1354
+ /** Update padding */
1355
+ setPadding(padding: number | [number, number, number, number]): void;
1356
+ /**
1357
+ * Recalculate and apply layout positions for all children.
1358
+ * Called automatically by `resize()`. Call manually after
1359
+ * adding/removing children without resize.
1360
+ */
1361
+ updateLayout(): void;
1362
+ /** Computed content size (after layout) */
1363
+ getContentSize(): {
1364
+ width: number;
1365
+ height: number;
1366
+ };
1367
+ /** React reconciler update hook — applies changed config props */
1368
+ updateConfig(changed: Record<string, any>): void;
1369
+ destroy(options?: boolean | {
1370
+ children?: boolean;
1371
+ texture?: boolean;
1372
+ textureSource?: boolean;
1373
+ }): void;
1374
+ }
1375
+
1376
+ /**
1377
+ * Universal view input type for UI component visual slots.
1378
+ *
1379
+ * - `string` — texture name, resolved via `Sprite.from()`
1380
+ * - `Texture` — wrapped in a `Sprite`
1381
+ * - `Container` — used as-is (Sprite, Graphics, NineSliceSprite, AnimatedSprite, custom...)
1382
+ */
1383
+ type ViewInput = string | Texture | Container;
1384
+
1267
1385
  type ButtonState = 'default' | 'hover' | 'pressed' | 'disabled';
1268
1386
  interface ButtonConfig {
1269
- /** Default texture/sprite for each state (optional uses Graphics if not provided) */
1270
- textures?: Partial<Record<ButtonState, string | Texture>>;
1271
- /** Width (for Graphics-based button) */
1387
+ /** Custom view for default state (string texture name, Texture, or Container) */
1388
+ defaultView?: ViewInput;
1389
+ /** Custom view for hover state */
1390
+ hoverView?: ViewInput;
1391
+ /** Custom view for pressed state */
1392
+ pressedView?: ViewInput;
1393
+ /** Custom view for disabled state */
1394
+ disabledView?: ViewInput;
1395
+ /** Width (for Graphics-based button, ignored when custom views provided) */
1272
1396
  width?: number;
1273
1397
  /** Height (for Graphics-based button) */
1274
1398
  height?: number;
@@ -1282,67 +1406,138 @@ interface ButtonConfig {
1282
1406
  animationDuration?: number;
1283
1407
  /** Start disabled */
1284
1408
  disabled?: boolean;
1285
- /** Button text */
1409
+ /** Button text (rendered on top of the view) */
1286
1410
  text?: string;
1287
1411
  /** Button text style */
1288
1412
  textStyle?: Record<string, unknown>;
1413
+ /** Press callback */
1414
+ onPress?: () => void;
1289
1415
  }
1290
1416
  /**
1291
- * Interactive button component powered by `@pixi/ui` FancyButton.
1417
+ * Interactive button with per-state custom views and animations.
1292
1418
  *
1293
- * Supports both texture-based and Graphics-based rendering with
1294
- * per-state views, press animation, and text.
1419
+ * Each visual state accepts a `ViewInput`: texture name, Texture, or any Container
1420
+ * (Sprite, NineSliceSprite, AnimatedSprite, custom artwork, etc).
1421
+ * Falls back to colored Graphics when no custom view is provided.
1295
1422
  *
1296
1423
  * @example
1297
1424
  * ```ts
1425
+ * // Graphics-based (quick prototyping)
1298
1426
  * const btn = new Button({
1299
1427
  * width: 200, height: 60, borderRadius: 12,
1300
1428
  * colors: { default: 0x22aa22, hover: 0x33cc33 },
1301
1429
  * text: 'SPIN',
1430
+ * onPress: () => spin(),
1302
1431
  * });
1303
1432
  *
1304
- * btn.onPress.connect(() => console.log('Clicked!'));
1305
- * scene.container.addChild(btn);
1433
+ * // Asset-based (production art)
1434
+ * const btn = new Button({
1435
+ * defaultView: 'btn-idle',
1436
+ * hoverView: 'btn-hover',
1437
+ * pressedView: 'btn-pressed',
1438
+ * disabledView: 'btn-disabled',
1439
+ * text: 'SPIN',
1440
+ * onPress: () => spin(),
1441
+ * });
1442
+ *
1443
+ * // Custom Container view
1444
+ * const btn = new Button({
1445
+ * defaultView: myAnimatedSprite,
1446
+ * text: 'SPIN',
1447
+ * });
1306
1448
  * ```
1307
1449
  */
1308
- declare class Button extends FancyButton {
1309
- private _buttonConfig;
1450
+ declare class Button extends Container {
1451
+ readonly __uiComponent: true;
1452
+ private _views;
1453
+ private _state;
1454
+ private _enabled;
1455
+ private _config;
1456
+ private _textObj;
1457
+ /** Press callback */
1458
+ onPress?: () => void;
1310
1459
  constructor(config?: ButtonConfig);
1460
+ /** Current button state */
1461
+ get state(): ButtonState;
1311
1462
  /** Enable the button */
1312
1463
  enable(): void;
1313
1464
  /** Disable the button */
1314
1465
  disable(): void;
1466
+ /** Whether the button is enabled */
1467
+ get enabled(): boolean;
1468
+ set enabled(value: boolean);
1315
1469
  /** Whether the button is disabled */
1316
1470
  get disabled(): boolean;
1471
+ /** Update button text */
1472
+ set text(value: string);
1473
+ private _buildViews;
1474
+ private _rebuildViews;
1475
+ private _setState;
1476
+ private _onPointerOver;
1477
+ private _onPointerOut;
1478
+ private _onPointerDown;
1479
+ private _onPointerUp;
1480
+ private _onPointerUpOutside;
1481
+ /** React reconciler update hook */
1482
+ updateConfig(changed: Record<string, any>): void;
1483
+ destroy(options?: boolean | {
1484
+ children?: boolean;
1485
+ texture?: boolean;
1486
+ textureSource?: boolean;
1487
+ }): void;
1317
1488
  }
1318
1489
 
1319
1490
  interface ProgressBarConfig {
1491
+ /** Width of the bar */
1320
1492
  width?: number;
1493
+ /** Height of the bar */
1321
1494
  height?: number;
1495
+ /** Corner radius (for Graphics-based bar) */
1322
1496
  borderRadius?: number;
1497
+ /** Fill color (for Graphics-based bar, ignored when fillView provided) */
1323
1498
  fillColor?: number;
1499
+ /** Track background color (for Graphics-based bar, ignored when trackView provided) */
1324
1500
  trackColor?: number;
1501
+ /** Border color */
1325
1502
  borderColor?: number;
1503
+ /** Border width */
1326
1504
  borderWidth?: number;
1327
1505
  /** Animated fill (smoothly interpolate) */
1328
1506
  animated?: boolean;
1329
1507
  /** Animation speed (0..1 per frame, default: 0.1) */
1330
1508
  animationSpeed?: number;
1509
+ /** Custom track background (string texture name, Texture, or Container) */
1510
+ trackView?: ViewInput;
1511
+ /** Custom fill bar (string texture name, Texture, or Container) */
1512
+ fillView?: ViewInput;
1331
1513
  }
1332
1514
  /**
1333
- * Horizontal progress bar powered by `@pixi/ui` ProgressBar.
1515
+ * Horizontal progress bar with optional custom track/fill views.
1334
1516
  *
1335
- * Provides optional smooth animated fill via per-frame `update()`.
1517
+ * Supports asset-based skinning: provide `trackView` and/or `fillView`
1518
+ * as texture names, Textures, or any Container (NineSliceSprite, custom artwork, etc).
1519
+ * Falls back to colored Graphics when no custom views are provided.
1336
1520
  *
1337
1521
  * @example
1338
1522
  * ```ts
1523
+ * // Graphics-based (quick prototyping)
1339
1524
  * const bar = new ProgressBar({ width: 300, height: 20, fillColor: 0x22cc22 });
1340
- * scene.container.addChild(bar);
1341
- * bar.progress = 0.5; // 50%
1525
+ * bar.progress = 0.5;
1526
+ *
1527
+ * // Asset-based (production art)
1528
+ * const bar = new ProgressBar({
1529
+ * width: 300, height: 20,
1530
+ * trackView: 'bar-track',
1531
+ * fillView: new NineSliceSprite({ texture: 'bar-fill', ... }),
1532
+ * });
1533
+ * bar.progress = 0.75;
1342
1534
  * ```
1343
1535
  */
1344
1536
  declare class ProgressBar extends Container {
1345
- private _bar;
1537
+ readonly __uiComponent: true;
1538
+ private _track;
1539
+ private _fill;
1540
+ private _fillMask;
1346
1541
  private _borderGfx;
1347
1542
  private _config;
1348
1543
  private _progress;
@@ -1355,6 +1550,9 @@ declare class ProgressBar extends Container {
1355
1550
  * Call each frame if animated is true.
1356
1551
  */
1357
1552
  update(_dt: number): void;
1553
+ /** React reconciler update hook */
1554
+ updateConfig(changed: Record<string, any>): void;
1555
+ private updateMask;
1358
1556
  }
1359
1557
 
1360
1558
  interface LabelConfig {
@@ -1379,6 +1577,7 @@ interface LabelConfig {
1379
1577
  * ```
1380
1578
  */
1381
1579
  declare class Label extends Container {
1580
+ readonly __uiComponent: true;
1382
1581
  private _text;
1383
1582
  private _maxWidth;
1384
1583
  private _autoFit;
@@ -1402,6 +1601,8 @@ declare class Label extends Container {
1402
1601
  * Format a number with thousands separators.
1403
1602
  */
1404
1603
  setNumber(value: number, decimals?: number, locale?: string): void;
1604
+ /** React reconciler update hook */
1605
+ updateConfig(changed: Record<string, any>): void;
1405
1606
  private fitText;
1406
1607
  }
1407
1608
 
@@ -1426,12 +1627,14 @@ interface PanelConfig {
1426
1627
  nineSliceBorders?: [number, number, number, number];
1427
1628
  /** Padding inside the panel */
1428
1629
  padding?: number;
1630
+ /** Flex layout config for content */
1631
+ layout?: Partial<FlexContainerConfig>;
1429
1632
  }
1430
1633
  /**
1431
- * Background panel powered by `@pixi/layout` LayoutContainer.
1634
+ * Background panel with optional flexbox content layout.
1432
1635
  *
1433
1636
  * Supports both Graphics-based (color + border) and 9-slice sprite backgrounds.
1434
- * Children added to `content` participate in flexbox layout automatically.
1637
+ * Children added via `addContent()` participate in flex layout automatically.
1435
1638
  *
1436
1639
  * @example
1437
1640
  * ```ts
@@ -1446,13 +1649,32 @@ interface PanelConfig {
1446
1649
  * });
1447
1650
  * ```
1448
1651
  */
1449
- declare class Panel extends LayoutContainer {
1652
+ declare class Panel extends Container {
1653
+ readonly __uiComponent: true;
1654
+ private _bg;
1655
+ private _content;
1656
+ private _internalSetup;
1450
1657
  private _panelConfig;
1451
1658
  constructor(config?: PanelConfig);
1452
- /** Access the content container (children added here participate in layout) */
1453
- get content(): Container;
1659
+ /** Access the content flex container — add children here for layout */
1660
+ get content(): FlexContainer;
1661
+ /** Convenience: add a child to the content layout */
1662
+ addContent(child: Container): this;
1454
1663
  /** Resize the panel */
1455
1664
  setSize(width: number, height: number): void;
1665
+ /**
1666
+ * Override addChild so external children are routed to content FlexContainer.
1667
+ * Enables `<panel><label /><button /></panel>` in React JSX.
1668
+ */
1669
+ addChild<T extends Container>(...children: T[]): T;
1670
+ removeChild<T extends Container>(...children: T[]): T;
1671
+ /** React reconciler update hook */
1672
+ updateConfig(changed: Record<string, any>): void;
1673
+ destroy(options?: boolean | {
1674
+ children?: boolean;
1675
+ texture?: boolean;
1676
+ textureSource?: boolean;
1677
+ }): void;
1456
1678
  }
1457
1679
 
1458
1680
  interface BalanceDisplayConfig {
@@ -1475,7 +1697,7 @@ interface BalanceDisplayConfig {
1475
1697
  * Reactive balance display component.
1476
1698
  *
1477
1699
  * Automatically formats currency and can animate value changes
1478
- * with a smooth countup/countdown effect.
1700
+ * with a smooth countup/countdown effect using engine Tween.
1479
1701
  *
1480
1702
  * @example
1481
1703
  * ```ts
@@ -1487,13 +1709,14 @@ interface BalanceDisplayConfig {
1487
1709
  * ```
1488
1710
  */
1489
1711
  declare class BalanceDisplay extends Container {
1712
+ readonly __uiComponent: true;
1490
1713
  private _prefixLabel;
1491
1714
  private _valueLabel;
1492
1715
  private _config;
1493
1716
  private _currentValue;
1494
1717
  private _displayedValue;
1495
- private _animating;
1496
- private _animationCancelled;
1718
+ /** Internal target for Tween animation */
1719
+ private _tweenTarget;
1497
1720
  constructor(config?: BalanceDisplayConfig);
1498
1721
  /** Current displayed value */
1499
1722
  get value(): number;
@@ -1508,6 +1731,13 @@ declare class BalanceDisplay extends Container {
1508
1731
  private animateValue;
1509
1732
  private updateDisplay;
1510
1733
  private layoutLabels;
1734
+ /** React reconciler update hook */
1735
+ updateConfig(changed: Record<string, any>): void;
1736
+ destroy(options?: boolean | {
1737
+ children?: boolean;
1738
+ texture?: boolean;
1739
+ textureSource?: boolean;
1740
+ }): void;
1511
1741
  }
1512
1742
 
1513
1743
  interface WinDisplayConfig {
@@ -1526,7 +1756,7 @@ interface WinDisplayConfig {
1526
1756
  * Win amount display with countup animation.
1527
1757
  *
1528
1758
  * Shows a dramatic countup from 0 to the win amount, with optional
1529
- * scale pop effect — typical of slot games.
1759
+ * scale pop effect — typical of slot games. Uses engine Tween system.
1530
1760
  *
1531
1761
  * @example
1532
1762
  * ```ts
@@ -1537,9 +1767,11 @@ interface WinDisplayConfig {
1537
1767
  * ```
1538
1768
  */
1539
1769
  declare class WinDisplay extends Container {
1770
+ readonly __uiComponent: true;
1540
1771
  private _label;
1541
1772
  private _config;
1542
- private _cancelCountup;
1773
+ /** Internal target for Tween countup */
1774
+ private _tweenTarget;
1543
1775
  constructor(config?: WinDisplayConfig);
1544
1776
  /**
1545
1777
  * Show a win with countup animation.
@@ -1557,6 +1789,13 @@ declare class WinDisplay extends Container {
1557
1789
  */
1558
1790
  hide(): void;
1559
1791
  private displayAmount;
1792
+ /** React reconciler update hook */
1793
+ updateConfig(changed: Record<string, any>): void;
1794
+ destroy(options?: boolean | {
1795
+ children?: boolean;
1796
+ texture?: boolean;
1797
+ textureSource?: boolean;
1798
+ }): void;
1560
1799
  }
1561
1800
 
1562
1801
  interface ModalConfig {
@@ -1573,7 +1812,7 @@ interface ModalConfig {
1573
1812
  * Modal overlay component.
1574
1813
  * Shows content on top of a dark overlay with enter/exit animations.
1575
1814
  *
1576
- * The content container uses `@pixi/layout` for automatic centering.
1815
+ * Content is automatically centered via position calculations.
1577
1816
  *
1578
1817
  * @example
1579
1818
  * ```ts
@@ -1584,6 +1823,7 @@ interface ModalConfig {
1584
1823
  * ```
1585
1824
  */
1586
1825
  declare class Modal extends Container {
1826
+ readonly __uiComponent: true;
1587
1827
  private _overlay;
1588
1828
  private _contentContainer;
1589
1829
  private _config;
@@ -1603,6 +1843,8 @@ declare class Modal extends Container {
1603
1843
  * Hide the modal with animation.
1604
1844
  */
1605
1845
  hide(): Promise<void>;
1846
+ /** React reconciler update hook */
1847
+ updateConfig(changed: Record<string, any>): void;
1606
1848
  }
1607
1849
 
1608
1850
  type ToastType = 'info' | 'success' | 'warning' | 'error';
@@ -1611,6 +1853,8 @@ interface ToastConfig {
1611
1853
  duration?: number;
1612
1854
  /** Toast position from bottom */
1613
1855
  bottomOffset?: number;
1856
+ /** Custom background view (string texture name, Texture, or Container). Sized to fit text. */
1857
+ backgroundView?: ViewInput;
1614
1858
  }
1615
1859
  /**
1616
1860
  * Toast notification component for displaying transient messages.
@@ -1623,10 +1867,12 @@ interface ToastConfig {
1623
1867
  * ```
1624
1868
  */
1625
1869
  declare class Toast extends Container {
1870
+ readonly __uiComponent: true;
1626
1871
  private _bg;
1872
+ private _customBg;
1627
1873
  private _text;
1628
1874
  private _config;
1629
- private _dismissTimeout;
1875
+ private _dismissPending;
1630
1876
  constructor(config?: ToastConfig);
1631
1877
  /**
1632
1878
  * Show a toast message.
@@ -1636,6 +1882,13 @@ declare class Toast extends Container {
1636
1882
  * Dismiss the toast.
1637
1883
  */
1638
1884
  dismiss(): Promise<void>;
1885
+ /** React reconciler update hook */
1886
+ updateConfig(changed: Record<string, any>): void;
1887
+ destroy(options?: boolean | {
1888
+ children?: boolean;
1889
+ texture?: boolean;
1890
+ textureSource?: boolean;
1891
+ }): void;
1639
1892
  }
1640
1893
 
1641
1894
  type LayoutDirection = 'horizontal' | 'vertical' | 'grid' | 'wrap';
@@ -1662,7 +1915,7 @@ interface LayoutConfig {
1662
1915
  breakpoints?: Record<number, Partial<LayoutConfig>>;
1663
1916
  }
1664
1917
  /**
1665
- * Responsive layout container powered by `@pixi/layout` (Yoga flexbox engine).
1918
+ * Responsive layout container powered by a lightweight built-in flex layout solver.
1666
1919
  *
1667
1920
  * Supports horizontal, vertical, grid, and wrap layout modes with
1668
1921
  * alignment, padding, gap, and viewport-anchor positioning.
@@ -1689,6 +1942,7 @@ interface LayoutConfig {
1689
1942
  * ```
1690
1943
  */
1691
1944
  declare class Layout extends Container {
1945
+ readonly __uiComponent: true;
1692
1946
  private _layoutConfig;
1693
1947
  private _padding;
1694
1948
  private _anchor;
@@ -1697,6 +1951,7 @@ declare class Layout extends Container {
1697
1951
  private _items;
1698
1952
  private _viewportWidth;
1699
1953
  private _viewportHeight;
1954
+ private _flex;
1700
1955
  constructor(config?: LayoutConfig);
1701
1956
  /** Add an item to the layout */
1702
1957
  addItem(child: Container): this;
@@ -1712,9 +1967,16 @@ declare class Layout extends Container {
1712
1967
  */
1713
1968
  updateViewport(width: number, height: number): void;
1714
1969
  private applyLayoutStyles;
1715
- private applyGridChildWidth;
1970
+ private buildFlexItemConfig;
1716
1971
  private applyAnchor;
1717
1972
  private resolveConfig;
1973
+ /** React reconciler update hook */
1974
+ updateConfig(changed: Record<string, any>): void;
1975
+ destroy(options?: boolean | {
1976
+ children?: boolean;
1977
+ texture?: boolean;
1978
+ textureSource?: boolean;
1979
+ }): void;
1718
1980
  }
1719
1981
 
1720
1982
  type ScrollDirection = 'vertical' | 'horizontal' | 'both';
@@ -1733,18 +1995,23 @@ interface ScrollContainerConfig {
1733
1995
  elementsMargin?: number;
1734
1996
  /** Padding */
1735
1997
  padding?: number;
1736
- /** Disable dynamic rendering (render all items even when offscreen) */
1737
- disableDynamicRendering?: boolean;
1738
1998
  /** Disable easing/inertia */
1739
1999
  disableEasing?: boolean;
1740
- /** Global scroll scroll even when mouse is not over the component */
1741
- globalScroll?: boolean;
2000
+ /** Show scrollbar indicator (default: false) */
2001
+ scrollbar?: boolean;
2002
+ /** Custom scrollbar thumb view (string texture name, Texture, or Container) */
2003
+ thumbView?: ViewInput;
2004
+ /** Scrollbar width in px (default: 6) */
2005
+ scrollbarWidth?: number;
2006
+ /** Scrollbar padding from edge (default: 4) */
2007
+ scrollbarPadding?: number;
2008
+ /** Scrollbar color (when no thumbView, default: 0xaaaaaa) */
2009
+ scrollbarColor?: number;
2010
+ /** Scrollbar alpha (default: 0.5) */
2011
+ scrollbarAlpha?: number;
1742
2012
  }
1743
2013
  /**
1744
- * Scrollable container powered by `@pixi/ui` ScrollBox.
1745
- *
1746
- * Provides touch/drag scrolling, mouse wheel support, inertia, and
1747
- * dynamic rendering optimization for off-screen items.
2014
+ * Scrollable container with touch/drag, mouse wheel, and inertia.
1748
2015
  *
1749
2016
  * @example
1750
2017
  * ```ts
@@ -1762,20 +2029,69 @@ interface ScrollContainerConfig {
1762
2029
  * scene.container.addChild(scroll);
1763
2030
  * ```
1764
2031
  */
1765
- declare class ScrollContainer extends ScrollBox {
2032
+ declare class ScrollContainer extends Container {
2033
+ readonly __uiComponent: true;
2034
+ private _viewport;
2035
+ private _internalSetup;
2036
+ private _content;
2037
+ private _maskGfx;
2038
+ private _bg;
1766
2039
  private _scrollConfig;
2040
+ private _items;
2041
+ private _scrollbar;
2042
+ private _scrollbarConfig;
2043
+ private _dragging;
2044
+ private _dragStart;
2045
+ private _contentStart;
2046
+ private _velocity;
2047
+ private _lastDragPos;
2048
+ private _lastDragTime;
2049
+ private _inertiaActive;
2050
+ private _onTickBound;
2051
+ private _onWheelBound;
1767
2052
  constructor(config: ScrollContainerConfig);
1768
- /** Set scrollable content. Replaces any existing content. */
2053
+ /**
2054
+ * Override addChild so external children are routed to scroll content.
2055
+ * Enables `<scrollContainer><label /><panel /></scrollContainer>` in React JSX.
2056
+ */
2057
+ addChild<T extends Container>(...children: T[]): T;
2058
+ removeChild<T extends Container>(...children: T[]): T;
2059
+ /** React reconciler update hook */
2060
+ updateConfig(changed: Record<string, any>): void;
2061
+ /** Enable mouse wheel scrolling (call after adding to stage) */
2062
+ enableWheel(canvas: HTMLCanvasElement): void;
2063
+ /** Set scrollable content. Replaces any existing items. */
1769
2064
  setContent(content: Container): void;
1770
2065
  /** Add a single item */
1771
- addItem(...items: Container[]): Container;
1772
- /** Scroll to make a specific item/child visible */
2066
+ addItem(child: Container): this;
2067
+ /** Remove all items */
2068
+ clearItems(): void;
2069
+ /** Get items */
2070
+ get items(): readonly Container[];
2071
+ /** Scroll to make a specific item index visible */
1773
2072
  scrollToItem(index: number): void;
1774
2073
  /** Current scroll position */
1775
2074
  get scrollPosition(): {
1776
2075
  x: number;
1777
2076
  y: number;
1778
2077
  };
2078
+ /** Resize the scroll viewport */
2079
+ setViewportSize(width: number, height: number): void;
2080
+ private layoutItems;
2081
+ private _onPointerDown;
2082
+ private _onPointerMove;
2083
+ private _onPointerUp;
2084
+ private startInertia;
2085
+ private stopInertia;
2086
+ private _inertiaTick;
2087
+ private _onWheel;
2088
+ private clampScroll;
2089
+ private updateScrollbar;
2090
+ destroy(options?: boolean | {
2091
+ children?: boolean;
2092
+ texture?: boolean;
2093
+ textureSource?: boolean;
2094
+ }): void;
1779
2095
  }
1780
2096
 
1781
2097
  /**
@@ -1967,5 +2283,5 @@ declare class DevBridge {
1967
2283
  private delayedSend;
1968
2284
  }
1969
2285
 
1970
- export { AssetManager, AudioManager, BalanceDisplay, Button, DevBridge, Easing, EventEmitter, FPSOverlay, GameApplication, InputManager, Label, Layout, LoadingScene, Modal, Orientation, Panel, ProgressBar, ScaleMode, Scene, SceneManager, ScrollContainer, SpineHelper, SpriteAnimation, StateMachine, Timeline, Toast, TransitionType, Tween, ViewportManager, WinDisplay };
1971
- export type { ActionDefinition, AssetBundle, AssetEntry, AssetManifest, AudioConfig, BalanceDisplayConfig, ButtonConfig, ButtonState, DevBridgeConfig, EasingFunction, GameApplicationConfig, GameDefinition, GameEngineEvents, IScene, LabelConfig, LayoutAlignment, LayoutAnchor, LayoutConfig, LayoutDirection, LoadingScreenConfig, LuaEngineConfig, LuaPlayResult, ModalConfig, PanelConfig, ProgressBarConfig, SceneConstructor, ScrollContainerConfig, ScrollDirection, SpriteAnimationConfig, ToastConfig, ToastType, TransitionConfig, TransitionRule, TweenOptions, WinDisplayConfig };
2286
+ export { AssetManager, AudioManager, BalanceDisplay, Button, DevBridge, Easing, EventEmitter, FPSOverlay, FlexContainer, GameApplication, InputManager, Label, Layout, LoadingScene, Modal, Orientation, Panel, ProgressBar, ScaleMode, Scene, SceneManager, ScrollContainer, SpineHelper, SpriteAnimation, StateMachine, Timeline, Toast, TransitionType, Tween, ViewportManager, WinDisplay };
2287
+ export type { ActionDefinition, AlignItems, AssetBundle, AssetEntry, AssetManifest, AudioConfig, BalanceDisplayConfig, ButtonConfig, ButtonState, DevBridgeConfig, EasingFunction, FlexContainerConfig, FlexDirection, FlexItemConfig, GameApplicationConfig, GameDefinition, GameEngineEvents, IScene, JustifyContent, LabelConfig, LayoutAlignment, LayoutAnchor, LayoutConfig, LayoutDirection, LoadingScreenConfig, LuaEngineConfig, LuaPlayResult, ModalConfig, PanelConfig, ProgressBarConfig, SceneConstructor, ScrollContainerConfig, ScrollDirection, SpriteAnimationConfig, ToastConfig, ToastType, TransitionConfig, TransitionRule, TweenOptions, WinDisplayConfig };