2 posts tagged with "observe-drag"

@wonderlandlabs-pixi-ux/utils now provides a shared app-level render helper used by observe-drag and root-container.

What shipped​

• getSharedRenderHelper(app, config?) for app-scoped throttled render coordination.
• WeakMap singleton behavior keyed by app instance.
• First-config-wins policy per app (timing is locked by first retrieval).
• Automatic helper cleanup when app.destroy(...) is called.

Why it matters​

Multiple drag/zoom consumers on the same app now share one render-throttle stream instead of each creating independent throttled render pipelines. This ensures that multiple calls to the helper will all be throttled by the same initial settings and not multiply the number of renders requested.

If your app needs a specific timing profile, initialize the shared helper during app boot with your preferred config.

1.2.x standardizes drag behavior across the package set by moving to @wonderlandlabs-pixi-ux/observe-drag. 1.2.1 follows with a ticker compatibility fix and coordinated package version bumps.

Highlights​

• Added dragObserverFactory in @wonderlandlabs-pixi-ux/observe-drag with:
  • module-level singleton pointer lock by default
  • optional custom activePointer$ injection at factory creation
  • configurable inactivity failsafe (abortTime, 0 disables)
  • optional drag render throttle via renderThrottleMs (default 30ms)
• Migrated window dragging to observer-based drag subscriptions coordinated through WindowsManager.
• Kept compatibility aliases where needed (observeDrag, dragTargetDecorator) while moving new usage toward dragObserverFactory + dragDecorator.

Deprecations​

• @wonderlandlabs-pixi-ux/drag is now deprecated for 1.2.x.
  • Migration target: @wonderlandlabs-pixi-ux/observe-drag.
• trackDrag is no longer exported from @wonderlandlabs-pixi-ux/resizer.
  • Legacy implementation remains under _deprecated internally, but public API consumers should migrate to observer-based drag flows.

Migration Direction​

For direct container dragging, use dragDecorator() with dragObserverFactory.

Prefer:

import dragObserverFactory, {dragDecorator} from '@wonderlandlabs-pixi-ux/observe-drag';

const observeDown = dragObserverFactory({
  stage: app.stage,
  app,
  renderThrottleMs: 30,
});

const subscription = observeDown(target, dragDecorator(), {
  dragTarget: container,
  abortTime: 1000,
});

Over legacy DragStore or trackDrag entrypoint usage.

More advanced side effects can be managed with custom hooks: { onStart, onMove, onUp, onBlocked, onError }.

1.2.1 Patch​

1.2.1 includes a ticker-forest fix for environments that provide minimal ticker mocks (for example, tests with addOnce/remove but without add/remove):

• Scale observer binding now validates ticker capabilities before subscribing.
• This prevents unhandled binding.ticker.add is not a function errors.

To keep dependency metadata aligned, the primary ticker consumers were also bumped to 1.2.1:

• @wonderlandlabs-pixi-ux/button
• @wonderlandlabs-pixi-ux/caption
• @wonderlandlabs-pixi-ux/grid
• @wonderlandlabs-pixi-ux/resizer
• @wonderlandlabs-pixi-ux/toolbar
• @wonderlandlabs-pixi-ux/window