@rb-games/core 0.1.3 → 0.1.4

package/dist/ui/index.js

@@ -2,7 +2,7 @@ import { Align, Flow } from '../chunk-FOZO6TLY.js';
 import { getNestedValue } from '../chunk-5BLUF2HG.js';
 import { require_lodash } from '../chunk-NAQG7TMS.js';
 import { __commonJS, __toESM } from '../chunk-G3PMV62Z.js';
-import { Rectangle, Color, Texture, Sprite, Graphics, Container, Text, ColorMatrixFilter, Assets } from 'pixi.js';
+import { Rectangle, Color, Texture, Sprite, Graphics, Container, Text, Assets, ColorMatrixFilter } from 'pixi.js';
 
 // ../../node_modules/eventemitter3/index.js
 var require_eventemitter3 = __commonJS({
@@ -170,34 +170,25 @@ var import_index = __toESM(require_eventemitter3(), 1);
 
 // ui/behaviors/ButtonBehavior.ts
 var ButtonBehavior = class _ButtonBehavior extends import_index.default {
-  _view = null;
-  _enabled = true;
-  _isPressed = false;
-  _isHolding = false;
-  _pointerDownOnThis = false;
-  _isOver = false;
-  // 👈 isOver added
-  _holdTimer = null;
-  _holdInterval = null;
-  _holdDelay;
-  _holdIntervalTime;
-  _cursor = "pointer";
-  // Toggle properties
-  _isToggle = false;
-  _selected = false;
-  _allowHoldWhenToggle = false;
-  _holdMode;
-  // Track if events are bound to current view
-  _eventsBound = false;
-  // Static factory methods
-  static withView(view, options = {}) {
-    const button = new _ButtonBehavior(options);
-    button.attachView(view);
-    return button;
-  }
   // Method overloads - now only takes options
   constructor(options = {}) {
     super();
+    this._view = null;
+    this._enabled = true;
+    this._isPressed = false;
+    this._isHolding = false;
+    this._pointerDownOnThis = false;
+    this._isOver = false;
+    // 👈 isOver added
+    this._holdTimer = null;
+    this._holdInterval = null;
+    this._cursor = "pointer";
+    // Toggle properties
+    this._isToggle = false;
+    this._selected = false;
+    this._allowHoldWhenToggle = false;
+    // Track if events are bound to current view
+    this._eventsBound = false;
     this._holdDelay = options.holdDelay || 500;
     this._holdIntervalTime = options.holdInterval || 100;
     this._holdMode = options.holdMode ?? "none";
@@ -209,6 +200,12 @@ var ButtonBehavior = class _ButtonBehavior extends import_index.default {
       this.attachView(options.view);
     }
   }
+  // Static factory methods
+  static withView(view, options = {}) {
+    const button = new _ButtonBehavior(options);
+    button.attachView(view);
+    return button;
+  }
   // View Management Methods
   attachView(view) {
     if (this._view === view) return;
@@ -553,45 +550,26 @@ var ButtonBehavior = class _ButtonBehavior extends import_index.default {
   }
 };
 var ScrollbarBehavior = class _ScrollbarBehavior extends import_index.default {
-  _trackView = null;
-  _knobView = null;
-  _enabled = true;
-  _isDragging = false;
-  _dragStartPosition = 0;
-  _dragStartValue = 0;
-  _dragOffset = 0;
-  // Configuration
-  _orientation;
-  _min;
-  _max;
-  _value;
-  _step;
-  _margin;
-  // Wheel options
-  _wheelStep;
-  _enableWheel;
-  // Cursor options
-  _trackCursor;
-  _knobCursor;
-  // Track if events are bound
-  _eventsBound = false;
-  // Arrow function event handlers for proper cleanup
-  _onTrackPointerDown = (event) => this._handleTrackPointerDown(event);
-  _onKnobPointerDown = (event) => this._handleKnobPointerDown(event);
-  _onKnobPointerUp = (event) => this._handleKnobPointerUp(event);
-  _onKnobPointerUpOutside = (event) => this._handleKnobPointerUp(event);
-  _onGlobalPointerMove = (event) => this._handleGlobalPointerMove(event);
-  _onTrackWheel = (event) => this._handleWheel(event);
-  _onKnobWheel = (event) => this._handleWheel(event);
-  // Static factory methods
-  static withViews(trackView, knobView, options = {}) {
-    const scrollbar = new _ScrollbarBehavior(options);
-    scrollbar.attachViews(trackView, knobView);
-    return scrollbar;
-  }
   constructor(options = {}) {
     var _a, _b;
     super();
+    this._trackView = null;
+    this._knobView = null;
+    this._enabled = true;
+    this._isDragging = false;
+    this._dragStartPosition = 0;
+    this._dragStartValue = 0;
+    this._dragOffset = 0;
+    // Track if events are bound
+    this._eventsBound = false;
+    // Arrow function event handlers for proper cleanup
+    this._onTrackPointerDown = (event) => this._handleTrackPointerDown(event);
+    this._onKnobPointerDown = (event) => this._handleKnobPointerDown(event);
+    this._onKnobPointerUp = (event) => this._handleKnobPointerUp(event);
+    this._onKnobPointerUpOutside = (event) => this._handleKnobPointerUp(event);
+    this._onGlobalPointerMove = (event) => this._handleGlobalPointerMove(event);
+    this._onTrackWheel = (event) => this._handleWheel(event);
+    this._onKnobWheel = (event) => this._handleWheel(event);
     this._orientation = options.orientation || "horizontal";
     this._margin = {
       start: ((_a = options.margin) == null ? void 0 : _a.start) || 0,
@@ -606,6 +584,12 @@ var ScrollbarBehavior = class _ScrollbarBehavior extends import_index.default {
     this._trackCursor = options.trackCursor || "pointer";
     this._knobCursor = options.knobCursor || "grab";
   }
+  // Static factory methods
+  static withViews(trackView, knobView, options = {}) {
+    const scrollbar = new _ScrollbarBehavior(options);
+    scrollbar.attachViews(trackView, knobView);
+    return scrollbar;
+  }
   // View Management Methods
   attachTrackView(trackView) {
     if (this._trackView === trackView) return;
@@ -1041,12 +1025,12 @@ var ScrollbarBehavior = class _ScrollbarBehavior extends import_index.default {
 
 // ui/behaviors/InputBehavior.ts
 var InputBehavior = class extends import_index.default {
-  _domInput;
-  _state;
-  _options;
-  _view = null;
   constructor(options = {}) {
     super();
+    this._view = null;
+    this._onViewPointerDown = () => {
+      this.activateView();
+    };
     this._options = options;
     const guid = "input-" + Math.random().toString(36).slice(2, 11);
     if (options.multiline) {
@@ -1111,9 +1095,6 @@ var InputBehavior = class extends import_index.default {
     this._view.on("pointerdown", this._onViewPointerDown);
     this.updateDomPosition();
   }
-  _onViewPointerDown = () => {
-    this.activateView();
-  };
   detachView() {
     if (this._view) {
       this._view.off("pointerdown", this._onViewPointerDown);
@@ -1182,16 +1163,24 @@ var import_lodash2 = __toESM(require_lodash(), 1);
 var import_lodash = __toESM(require_lodash(), 1);
 var SKIN = Symbol("skinData");
 function Skinable(Base) {
-  class SkinableClass extends Base {
-    [SKIN] = null;
-    // Optional hook implementable by subclasses
-    skinApply;
+  var _a, _b;
+  class SkinableClass extends (_b = Base, _a = SKIN, _b) {
+    constructor() {
+      super(...arguments);
+      this[_a] = null;
+    }
+    /**
+     * Prototype hook for subclasses. Must be a method, not a class field:
+     * `skinApply?: (...) => void` is compiled to `this.skinApply = undefined`,
+     * which shadows the subclass override and silently skips skin application.
+     */
+    skinApply(_skin) {
+    }
     setSkinData(data, opts = {}) {
-      var _a, _b;
       const { mergeWithExisting = false } = opts;
       if (data === null) {
         this[SKIN] = null;
-        (_a = this.skinApply) == null ? void 0 : _a.call(this, null);
+        this.skinApply(null);
         return;
       }
       const current = this[SKIN];
@@ -1200,13 +1189,12 @@ function Skinable(Base) {
       } else {
         this[SKIN] = (0, import_lodash.merge)({}, data);
       }
-      (_b = this.skinApply) == null ? void 0 : _b.call(this, this[SKIN] ?? null);
+      this.skinApply(this[SKIN] ?? null);
     }
     getSkinData() {
       return this[SKIN];
     }
-    // Subclasses should implement:
-    // protected skinApply?(skin: TSkinData | null): void
+    // Subclasses override skinApply(skin) to apply visual properties.
   }
   return SkinableClass;
 }
@@ -2025,38 +2013,36 @@ function resolveSpriteTextAlignment(container, ctx) {
 }
 
 // ui/components/spriteText/SpriteText.ts
-var SpriteText = class _SpriteText extends Skinable(Container) {
-  static globalSkin = defineGlobalSkin();
-  _glyphs = [];
-  _text = "";
-  _fonts = [];
-  _font = "";
-  _bbcodeEnabled = false;
-  _richTextExplicit;
-  _bbcodeAliases = {};
-  _fontStyles = [];
-  _runsOverride = null;
-  _tint = 16777215;
-  _pivotHorizontal = "center";
-  _pivotVertical = "middle";
-  _lineAlign = "left";
-  _letterSpacing = 0;
-  _spaceWidth = 0.5;
-  _wordWrap = false;
-  _wordWrapWidth = 100;
-  _breakWord = false;
-  _allowLineBreak = false;
-  _kerningEnabled = false;
-  _kerningMap = /* @__PURE__ */ new Map();
-  _glyphAnchor = { x: 0, y: 0 };
-  _glyphMap = {};
-  _fixedWidth = false;
-  _glyphScale = 1;
-  _curveEnabled = false;
-  _curveControlXPercent = 0.5;
-  _curveControlYPercent = -0.5;
+var _SpriteText = class _SpriteText extends Skinable(Container) {
   constructor(options = {}) {
     super();
+    this._glyphs = [];
+    this._text = "";
+    this._fonts = [];
+    this._font = "";
+    this._bbcodeEnabled = false;
+    this._bbcodeAliases = {};
+    this._fontStyles = [];
+    this._runsOverride = null;
+    this._tint = 16777215;
+    this._pivotHorizontal = "center";
+    this._pivotVertical = "middle";
+    this._lineAlign = "left";
+    this._letterSpacing = 0;
+    this._spaceWidth = 0.5;
+    this._wordWrap = false;
+    this._wordWrapWidth = 100;
+    this._breakWord = false;
+    this._allowLineBreak = false;
+    this._kerningEnabled = false;
+    this._kerningMap = /* @__PURE__ */ new Map();
+    this._glyphAnchor = { x: 0, y: 0 };
+    this._glyphMap = {};
+    this._fixedWidth = false;
+    this._glyphScale = 1;
+    this._curveEnabled = false;
+    this._curveControlXPercent = 0.5;
+    this._curveControlYPercent = -0.5;
     if (options.text !== void 0) {
       this._text = options.text;
     }
@@ -2552,23 +2538,22 @@ var SpriteText = class _SpriteText extends Skinable(Container) {
     }
   }
 };
+_SpriteText.globalSkin = defineGlobalSkin();
+var SpriteText = _SpriteText;
 
 // ui/components/ButtonComp.ts
-var ButtonComp = class _ButtonComp extends Skinable(Container) {
-  _buttonBehaviors;
-  _background;
-  _placeHolder;
-  _icon;
-  _labelText = null;
-  _buttonLabel = "";
-  _iconTextures = null;
-  _currentState = "up";
-  _enabled = true;
-  _effects = /* @__PURE__ */ new Map();
-  _previousState;
-  _stateDataCache = /* @__PURE__ */ new Map();
+var _ButtonComp = class _ButtonComp extends Skinable(Container) {
   constructor(options = {}) {
     super({ label: options.label });
+    this._labelText = null;
+    this._buttonLabel = "";
+    this._iconTextures = null;
+    this._currentState = "up";
+    this._enabled = true;
+    this._effects = /* @__PURE__ */ new Map();
+    this._stateDataCache = /* @__PURE__ */ new Map();
+    this._lastLayout = null;
+    this._lastPlaceHolderLayout = null;
     this.eventMode = "static";
     this._background = new Graphics();
     this._placeHolder = new Container({ label: "placeHolder" });
@@ -2599,12 +2584,6 @@ var ButtonComp = class _ButtonComp extends Skinable(Container) {
     this.updateVisualState();
     this.notifyEffectsStateChange();
   }
-  _lastLayout = null;
-  _lastPlaceHolderLayout = null;
-  _lastBackgroundConfig;
-  _lastIconConfig;
-  _lastTextConfig;
-  _lastZIndex;
   updateVisualState() {
     const currentStateData = this.getCurrentStateData();
     if (!currentStateData) return;
@@ -2686,19 +2665,6 @@ var ButtonComp = class _ButtonComp extends Skinable(Container) {
       this._stateDataCache.set(state, { base, background, textConfig, icon, layout, placeHolderLayout, zIndex });
     }
   }
-  static stateFallbackChain = {
-    // Normal flow: up -> over -> down
-    up: ["up"],
-    over: ["up", "over"],
-    down: ["up", "over", "down"],
-    // Selected flow: selected_up -> selected_over -> selected_down
-    selected_up: ["up", "selected_up"],
-    selected_over: ["up", "selected_up", "selected_over"],
-    selected_down: ["up", "selected_up", "selected_over", "selected_down"],
-    // Disabled states
-    disabled: ["up", "disabled"],
-    selected_disabled: ["up", "selected_up", "selected_disabled"]
-  };
   getCurrentStateData() {
     return this._stateDataCache.get(this._currentState) ?? null;
   }
@@ -2945,18 +2911,28 @@ var ButtonComp = class _ButtonComp extends Skinable(Container) {
     return this._buttonBehaviors;
   }
 };
+_ButtonComp.stateFallbackChain = {
+  // Normal flow: up -> over -> down
+  up: ["up"],
+  over: ["up", "over"],
+  down: ["up", "over", "down"],
+  // Selected flow: selected_up -> selected_over -> selected_down
+  selected_up: ["up", "selected_up"],
+  selected_over: ["up", "selected_up", "selected_over"],
+  selected_down: ["up", "selected_up", "selected_over", "selected_down"],
+  // Disabled states
+  disabled: ["up", "disabled"],
+  selected_disabled: ["up", "selected_up", "selected_disabled"]
+};
+var ButtonComp = _ButtonComp;
 
 // ui/components/InputComp.ts
 var import_lodash3 = __toESM(require_lodash(), 1);
 var InputComp = class extends Skinable(Container) {
-  _background;
-  _textMask;
-  _textLabel;
-  _behavior;
-  _currentState = "up";
-  _isFocused = false;
   constructor(options = {}) {
     super();
+    this._currentState = "up";
+    this._isFocused = false;
     this.eventMode = "static";
     this._background = new Graphics();
     this._textLabel = new Text({
@@ -3089,15 +3065,11 @@ var InputComp = class extends Skinable(Container) {
 // ui/components/SliderComp.ts
 var import_lodash4 = __toESM(require_lodash(), 1);
 var SliderComp = class extends Skinable(Container) {
-  _slider;
-  _trackContainer;
-  _progressContainer;
-  _knobContainer;
-  _currentState = "up";
-  _progressGraphics = null;
-  _progressConfig = null;
   constructor(options = {}) {
     super();
+    this._currentState = "up";
+    this._progressGraphics = null;
+    this._progressConfig = null;
     this.layout = true;
     this.eventMode = "passive";
     this._trackContainer = new Container();
@@ -3556,23 +3528,18 @@ function createFlatButtonEffect(options) {
 // ui/components/StepperComp.ts
 var import_lodash5 = __toESM(require_lodash(), 1);
 var StepperComp = class extends Skinable(Container) {
-  _minusButton;
-  _plusButton;
-  _displayContainer;
-  _displayBackground;
-  _displayText;
-  _value = 0;
-  _min = 0;
-  _max = 100;
-  _step = 1;
-  _formatFunction = (val) => val.toString();
-  _enabled = true;
-  _currentState = "up";
-  _holdEnabled = true;
-  _holdDelay = 500;
-  _holdInterval = 100;
   constructor(options = {}) {
     super();
+    this._value = 0;
+    this._min = 0;
+    this._max = 100;
+    this._step = 1;
+    this._formatFunction = (val) => val.toString();
+    this._enabled = true;
+    this._currentState = "up";
+    this._holdEnabled = true;
+    this._holdDelay = 500;
+    this._holdInterval = 100;
     this.layout = true;
     this.eventMode = "passive";
     this._min = options.min ?? 0;
@@ -3850,12 +3817,10 @@ var StepperComp = class extends Skinable(Container) {
 // ui/components/LabelBox.ts
 var import_lodash6 = __toESM(require_lodash(), 1);
 var LabelBox = class extends Skinable(Container) {
-  _background;
-  _text;
-  _currentState = "default";
-  _stateDataCache = /* @__PURE__ */ new Map();
   constructor(options = {}) {
     super({ label: options.label });
+    this._currentState = "default";
+    this._stateDataCache = /* @__PURE__ */ new Map();
     this.eventMode = "passive";
     this._background = new Graphics();
     this._text = new Text({
@@ -3950,27 +3915,13 @@ var LabelBox = class extends Skinable(Container) {
   }
 };
 var ListTableComp = class extends Skinable(Container) {
-  _columns;
-  _tableWidth;
-  _tableHeight;
-  _rowHeight;
-  _headerHeight;
-  _rowGap;
-  _cellGap;
-  _showHeader;
-  _showScrollbar;
-  _headerContainer;
-  _headerCells = [];
-  _listContainer;
-  _listContent;
-  _listMask;
-  _scrollbar;
-  _data = [];
-  _rowViews = [];
-  _hoveredRowIndex = -1;
-  _scrollValue = 0;
   constructor(options) {
     super();
+    this._headerCells = [];
+    this._data = [];
+    this._rowViews = [];
+    this._hoveredRowIndex = -1;
+    this._scrollValue = 0;
     this.eventMode = "static";
     this._columns = options.columns;
     this._tableWidth = options.tableWidth;