@open-slot-ui/pixi 0.7.0 → 0.7.2

package/dist/index.cjs

@@ -1333,6 +1333,7 @@ var ValueDisplayView = class extends ControlView {
     super.dispose();
   }
 };
+var TAP_SLOP = 24;
 var GLYPH_SVG = {
   speaker: '<svg viewBox="0 0 22.5 22.5" xmlns="http://www.w3.org/2000/svg"><path d="M13.6745 5.01252C13.9316 4.84399 14.2647 4.8292 14.5397 4.97456C14.8146 5.1199 14.9868 5.40142 14.9872 5.706L15.0007 16.8107C15.0011 17.1153 14.8296 17.3934 14.555 17.5333C14.2804 17.6731 13.9472 17.6517 13.6897 17.4781L10.4454 15.2905L8.61605 15.2722C6.76074 15.2537 5.25495 13.7655 5.25266 11.9484L5.25073 10.3739C5.2486 8.55679 6.75081 7.09863 8.6061 7.11714L10.4355 7.13539L13.6745 5.01252Z" fill="none" stroke="black" stroke-width="1.5" stroke-linejoin="round"/><path d="M16.1933 9.375C16.6252 10.4652 16.6015 11.654 16.1257 12.75" fill="none" stroke="black" stroke-width="3" stroke-linecap="round"/></svg>',
   "speaker-mute": '<svg viewBox="0 0 22.5 22.5" xmlns="http://www.w3.org/2000/svg"><path d="M13.6745 5.01252C13.9316 4.84399 14.2647 4.8292 14.5397 4.97456C14.8146 5.1199 14.9868 5.40142 14.9872 5.706L15.0007 16.8107C15.0011 17.1153 14.8296 17.3934 14.555 17.5333C14.2804 17.6731 13.9472 17.6517 13.6897 17.4781L10.4454 15.2905L8.61605 15.2722C6.76074 15.2537 5.25495 13.7655 5.25266 11.9484L5.25073 10.3739C5.2486 8.55679 6.75081 7.09863 8.6061 7.11714L10.4355 7.13539L13.6745 5.01252Z" fill="none" stroke="black" stroke-width="1.5" stroke-linejoin="round"/><path d="M15.5 8.5L19.5 13.5M19.5 8.5L15.5 13.5" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round"/></svg>',
@@ -1430,17 +1431,26 @@ var ButtonView = class extends ControlView {
     this.sprite.scale.set(1);
     this.sprite.scale.set(this.iconTarget / this.sprite.height);
   }
-  onDown = () => {
-    if (this.btn.interactable) this.btn.setState("pressed");
+  /** Screen position of the current press, for the tap-slop check on release. */
+  downPt = null;
+  onDown = (e) => {
+    if (!this.btn.interactable) return;
+    this.btn.setState("pressed");
+    this.downPt = { x: e.global.x, y: e.global.y };
   };
   onUp = () => {
     if (this.btn.current === "pressed") {
       this.btn.setState("idle");
       this.btn.activate();
     }
+    this.downPt = null;
   };
-  onUpOutside = () => {
-    if (this.btn.current === "pressed") this.btn.setState("idle");
+  onUpOutside = (e) => {
+    const p = this.downPt;
+    this.downPt = null;
+    if (this.btn.current !== "pressed") return;
+    this.btn.setState("idle");
+    if (p && Math.hypot(e.global.x - p.x, e.global.y - p.y) <= TAP_SLOP) this.btn.activate();
   };
   updateHit() {
     if (this.sprite) {
@@ -3985,6 +3995,30 @@ var PanelBodyView = class extends ControlView {
     super.dispose();
   }
 };
+function showReplayModal(ui, info, buttonKey, onSelect) {
+  const cur = info.currency ?? ui.balance.currency.get();
+  const money = (n) => core.formatAmount(n, cur);
+  ui.showNotice(
+    [
+      { kind: "heading", id: "openui-replay-h", text: "openui.replay.title" },
+      {
+        kind: "stat-grid",
+        id: "openui-replay-g",
+        items: [
+          { label: "openui.replay.baseBet", value: money(info.baseBet) },
+          { label: "openui.replay.costMultiplier", value: `${info.costMultiplier}\xD7` },
+          { label: "openui.replay.payoutMultiplier", value: `${info.payoutMultiplier}\xD7` },
+          { label: "openui.replay.amount", value: money(info.amount) }
+        ]
+      }
+    ],
+    [{ label: buttonKey, variant: "primary", onSelect: () => {
+      ui.hideNotice();
+      onSelect();
+    } }],
+    { blocking: true }
+  );
+}
 function mountHud(app, spec = {}, opts = {}) {
   const { hooks, ...pixiOpts } = opts;
   const ui = core.createUI(spec, hooks);
@@ -4050,30 +4084,10 @@ function mountHud(app, spec = {}, opts = {}) {
     setReplay: (on2) => ui.setReplay(on2),
     replayStart: (info, onPlay) => {
       ui.setReplay(true);
-      const cur = info.currency ?? ui.balance.currency.get();
-      const money = (n) => core.formatAmount(n, cur);
-      ui.showNotice(
-        [
-          { kind: "heading", id: "openui-replay-h", text: "openui.replay.title" },
-          {
-            kind: "stat-grid",
-            id: "openui-replay-g",
-            items: [
-              { label: "openui.replay.baseBet", value: money(info.baseBet) },
-              { label: "openui.replay.costMultiplier", value: `${info.costMultiplier}\xD7` },
-              { label: "openui.replay.payoutMultiplier", value: `${info.payoutMultiplier}\xD7` },
-              { label: "openui.replay.amount", value: money(info.amount) }
-            ]
-          }
-        ],
-        [{ label: "openui.replay.play", variant: "primary", onSelect: onPlay }]
-      );
+      showReplayModal(ui, info, "openui.replay.play", () => onPlay?.());
     },
-    replayEnd: (onReplay) => {
-      ui.showNotice(
-        [{ kind: "heading", id: "openui-replay-end", text: "openui.replay.title" }],
-        [{ label: "openui.replay.again", variant: "primary", onSelect: onReplay }]
-      );
+    replayEnd: (info, onReplay) => {
+      showReplayModal(ui, info, "openui.replay.again", onReplay);
     },
     confirmBuy: (o) => {
       if (ui.isDisabled("buyFeature")) return;