@prefecthq/prefect-ui-library 2.0.4 → 2.0.6

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 (36) hide show
  1. package/dist/{index-b0681a2f.mjs → index-79f5b8ab.mjs} +20903 -23413
  2. package/dist/index-79f5b8ab.mjs.map +1 -0
  3. package/dist/prefect-ui-library.mjs +711 -705
  4. package/dist/prefect-ui-library.umd.js +85 -600
  5. package/dist/prefect-ui-library.umd.js.map +1 -1
  6. package/dist/style.css +1 -1
  7. package/dist/types/demo/services/mockWorkspaceFlowRunsApi.d.ts +2 -2
  8. package/dist/types/src/components/ConcurrencyLimitsV2EmptyState.vue.d.ts +2 -0
  9. package/dist/types/src/components/WorkPoolStatusBadge.vue.d.ts +13 -0
  10. package/dist/types/src/components/WorkPoolStatusIcon.vue.d.ts +13 -0
  11. package/dist/types/src/components/WorkerStatusBadge.vue.d.ts +13 -0
  12. package/dist/types/src/components/WorkerStatusIcon.vue.d.ts +12 -0
  13. package/dist/types/src/components/index.d.ts +4 -0
  14. package/dist/types/src/maps/flowRunTimeline.d.ts +4 -0
  15. package/dist/types/src/maps/index.d.ts +13 -0
  16. package/dist/types/src/maps/workPoolStatus.d.ts +4 -0
  17. package/dist/types/src/maps/workPoolWorkerStatus.d.ts +4 -0
  18. package/dist/types/src/mocks/index.d.ts +2 -0
  19. package/dist/types/src/mocks/workPoolStatus.d.ts +3 -0
  20. package/dist/types/src/mocks/workerStatus.d.ts +3 -0
  21. package/dist/types/src/models/WorkPool.d.ts +3 -0
  22. package/dist/types/src/models/WorkPoolStatus.d.ts +3 -0
  23. package/dist/types/src/models/WorkPoolWorker.d.ts +3 -0
  24. package/dist/types/src/models/WorkPoolWorkerStatus.d.ts +3 -0
  25. package/dist/types/src/models/api/WorkPoolResponse.d.ts +2 -0
  26. package/dist/types/src/models/api/WorkPoolWorkerResponse.d.ts +2 -0
  27. package/dist/types/src/models/index.d.ts +2 -0
  28. package/dist/types/src/services/Mapper.d.ts +13 -0
  29. package/dist/types/src/services/Mocker.d.ts +2 -0
  30. package/dist/types/src/services/WorkspaceFlowRunsApi.d.ts +3 -3
  31. package/dist/types/src/utilities/timeline.d.ts +0 -3
  32. package/dist/{viewport.es-3ce16114-fbed2709.mjs → viewport.es-88169ec4-4c6f68e7.mjs} +20 -724
  33. package/dist/viewport.es-88169ec4-4c6f68e7.mjs.map +1 -0
  34. package/package.json +2 -2
  35. package/dist/index-b0681a2f.mjs.map +0 -1
  36. package/dist/viewport.es-3ce16114-fbed2709.mjs.map +0 -1
@@ -1,4 +1,4 @@
1
- import { X as O, l as k, K as b, u as c } from "./index-b0681a2f.mjs";
1
+ import { X as O, c as k, J as b, f as c } from "./index-79f5b8ab.mjs";
2
2
  import "vue";
3
3
  import "@prefecthq/vue-charts";
4
4
  import "@prefecthq/prefect-design";
@@ -6,53 +6,32 @@ import "@prefecthq/vue-compositions";
6
6
  import "vee-validate";
7
7
  import "vue-router";
8
8
  class d {
9
- /** The viewport to which this plugin is attached. */
10
- /**
11
- * Flags whether this plugin has been "paused".
12
- *
13
- * @see Plugin#pause
14
- * @see Plugin#resume
15
- */
16
- /** @param {Viewport} parent */
17
9
  constructor(t) {
18
10
  this.parent = t, this.paused = !1;
19
11
  }
20
- /** Called when plugin is removed */
21
12
  destroy() {
22
13
  }
23
- /** Handler for pointerdown PIXI event */
24
14
  down(t) {
25
15
  return !1;
26
16
  }
27
- /** Handler for pointermove PIXI event */
28
17
  move(t) {
29
18
  return !1;
30
19
  }
31
- /** Handler for pointerup PIXI event */
32
20
  up(t) {
33
21
  return !1;
34
22
  }
35
- /** Handler for wheel event on div */
36
23
  wheel(t) {
37
24
  return !1;
38
25
  }
39
- /**
40
- * Called on each tick
41
- * @param {number} elapsed time in millisecond since last update
42
- */
43
26
  update(t) {
44
27
  }
45
- /** Called when the viewport is resized */
46
28
  resize() {
47
29
  }
48
- /** Called when the viewport is manually moved */
49
30
  reset() {
50
31
  }
51
- /** Pause the plugin */
52
32
  pause() {
53
33
  this.paused = !0;
54
34
  }
55
- /** Un-pause the plugin */
56
35
  resume() {
57
36
  this.paused = !1;
58
37
  }
@@ -192,61 +171,33 @@ const X = {
192
171
  time: 1e3
193
172
  };
194
173
  class u extends d {
195
- /** The starting x-coordinate of the viewport. */
196
- /** The starting y-coordinate of the viewport. */
197
- /** The change in the x-coordinate of the viewport through the animation.*/
198
- /** The change in the y-coordinate of the viewport through the animation. */
199
- /** Marks whether the center of the viewport is preserved in the animation. */
200
- /** The starting viewport width. */
201
174
  __init() {
202
175
  this.startWidth = null;
203
176
  }
204
- /** The starting viewport height. */
205
177
  __init2() {
206
178
  this.startHeight = null;
207
179
  }
208
- /** The change in the viewport's width through the animation. */
209
180
  __init3() {
210
181
  this.deltaWidth = null;
211
182
  }
212
- /** The change in the viewport's height through the animation. */
213
183
  __init4() {
214
184
  this.deltaHeight = null;
215
185
  }
216
- /** The viewport's width post-animation. */
217
186
  __init5() {
218
187
  this.width = null;
219
188
  }
220
- /** The viewport's height post-animation. */
221
189
  __init6() {
222
190
  this.height = null;
223
191
  }
224
- /** The time since the animation started. */
225
192
  __init7() {
226
193
  this.time = 0;
227
194
  }
228
- /**
229
- * This is called by {@link Viewport.animate}.
230
- *
231
- * @param parent
232
- * @param options
233
- */
234
195
  constructor(t, e = {}) {
235
196
  super(t), u.prototype.__init.call(this), u.prototype.__init2.call(this), u.prototype.__init3.call(this), u.prototype.__init4.call(this), u.prototype.__init5.call(this), u.prototype.__init6.call(this), u.prototype.__init7.call(this), this.options = Object.assign({}, X, e), this.options.ease = H(this.options.ease), this.setupPosition(), this.setupZoom(), this.time = 0;
236
197
  }
237
- /**
238
- * Setup `startX`, `startY`, `deltaX`, `deltaY`, `keepCenter`.
239
- *
240
- * This is called during construction.
241
- */
242
198
  setupPosition() {
243
199
  typeof this.options.position < "u" ? (this.startX = this.parent.center.x, this.startY = this.parent.center.y, this.deltaX = this.options.position.x - this.parent.center.x, this.deltaY = this.options.position.y - this.parent.center.y, this.keepCenter = !1) : this.keepCenter = !0;
244
200
  }
245
- /**
246
- * Setup `startWidth, `startHeight`, `deltaWidth, `deltaHeight, `width`, `height`.
247
- *
248
- * This is called during construction.
249
- */
250
201
  setupZoom() {
251
202
  this.width = null, this.height = null, typeof this.options.scale < "u" ? this.width = this.parent.screenWidth / this.options.scale : typeof this.options.scaleX < "u" || typeof this.options.scaleY < "u" ? (typeof this.options.scaleX < "u" && (this.width = this.parent.screenWidth / this.options.scaleX), typeof this.options.scaleY < "u" && (this.height = this.parent.screenHeight / this.options.scaleY)) : (typeof this.options.width < "u" && (this.width = this.options.width), typeof this.options.height < "u" && (this.height = this.options.height)), this.width !== null && (this.startWidth = this.parent.screenWidthInWorldPixels, this.deltaWidth = this.width - this.startWidth), this.height !== null && (this.startHeight = this.parent.screenHeightInWorldPixels, this.deltaHeight = this.height - this.startHeight);
252
203
  }
@@ -309,19 +260,6 @@ const Y = {
309
260
  bounceBox: null
310
261
  };
311
262
  class _ extends d {
312
- /** The options passed to initialize this plugin, cannot be modified again. */
313
- /** Holds whether to bounce from left side. */
314
- /** Holds whether to bounce from top side. */
315
- /** Holds whether to bounce from right side. */
316
- /** Holds whether to bounce from bottom side. */
317
- /** Direction of underflow along x-axis. */
318
- /** Direction of underflow along y-axis. */
319
- /** Easing */
320
- /** Bounce state along x-axis */
321
- /** Bounce state along y-axis */
322
- /**
323
- * This is called by {@link Viewport.bounce}.
324
- */
325
263
  constructor(t, e = {}) {
326
264
  super(t), this.options = Object.assign({}, Y, e), this.ease = H(this.options.ease, "easeInOutSine"), this.options.sides ? this.options.sides === "all" ? this.top = this.bottom = this.left = this.right = !0 : this.options.sides === "horizontal" ? (this.right = this.left = !0, this.top = this.bottom = !1) : this.options.sides === "vertical" ? (this.left = this.right = !1, this.top = this.bottom = !0) : (this.top = this.options.sides.indexOf("top") !== -1, this.bottom = this.options.sides.indexOf("bottom") !== -1, this.left = this.options.sides.indexOf("left") !== -1, this.right = this.options.sides.indexOf("right") !== -1) : this.left = this.top = this.right = this.bottom = !1;
327
265
  const n = this.options.underflow.toLowerCase();
@@ -348,7 +286,6 @@ class _ extends d {
348
286
  }
349
287
  }
350
288
  }
351
- /** @internal */
352
289
  calcUnderflowX() {
353
290
  let t;
354
291
  switch (this.underflowX) {
@@ -363,7 +300,6 @@ class _ extends d {
363
300
  }
364
301
  return t;
365
302
  }
366
- /** @internal */
367
303
  calcUnderflowY() {
368
304
  let t;
369
305
  switch (this.underflowY) {
@@ -441,11 +377,6 @@ const A = {
441
377
  underflow: "center"
442
378
  };
443
379
  class D extends d {
444
- /** Options used to initialize this plugin, cannot be modified later. */
445
- /** Last state of viewport */
446
- /**
447
- * This is called by {@link Viewport.clamp}.
448
- */
449
380
  constructor(t, e = {}) {
450
381
  super(t), this.options = Object.assign({}, A, e), this.options.direction && (this.options.left = this.options.direction === "x" || this.options.direction === "all" ? !0 : null, this.options.right = this.options.direction === "x" || this.options.direction === "all" ? !0 : null, this.options.top = this.options.direction === "y" || this.options.direction === "all" ? !0 : null, this.options.bottom = this.options.direction === "y" || this.options.direction === "all" ? !0 : null), this.parseUnderflow(), this.last = { x: null, y: null, scaleX: null, scaleY: null }, this.update();
451
382
  }
@@ -509,16 +440,12 @@ const T = {
509
440
  maxScale: null
510
441
  };
511
442
  class L extends d {
512
- /**
513
- * This is called by {@link Viewport.clampZoom}.
514
- */
515
443
  constructor(t, e = {}) {
516
444
  super(t), this.options = Object.assign({}, T, e), this.clamp();
517
445
  }
518
446
  resize() {
519
447
  this.clamp();
520
448
  }
521
- /** Clamp the viewport scale zoom) */
522
449
  clamp() {
523
450
  if (!this.paused) {
524
451
  if (this.options.minWidth || this.options.minHeight || this.options.maxWidth || this.options.maxHeight) {
@@ -568,32 +495,6 @@ const E = {
568
495
  minSpeed: 0.01
569
496
  }, m = 16;
570
497
  class V extends d {
571
- /** Options used to initialize this plugin. */
572
- /**
573
- * x-component of the velocity of viewport provided by this plugin, at the current time.
574
- *
575
- * This is measured in px/frame, where a frame is normalized to 16 milliseconds.
576
- */
577
- /**
578
- * y-component of the velocity of the viewport provided by this plugin, at the current time.
579
- *
580
- * This is measured in px/frame, where a frame is normalized to 16 milliseconds.
581
- */
582
- /**
583
- * The decay factor for the x-component of the viewport.
584
- *
585
- * The viewport's velocity decreased by this amount each 16 milliseconds.
586
- */
587
- /**
588
- * The decay factor for the y-component of the viewport.
589
- *
590
- * The viewport's velocity decreased by this amount each 16 milliseconds.
591
- */
592
- /** Saved list of recent viewport position snapshots, to estimate velocity. */
593
- /** The time since the user released panning of the viewport. */
594
- /**
595
- * This is called by {@link Viewport.decelerate}.
596
- */
597
498
  constructor(t, e = {}) {
598
499
  super(t), this.options = Object.assign({}, E, e), this.saved = [], this.timeSinceRelease = 0, this.reset(), this.parent.on("moved", (n) => this.moved(n));
599
500
  }
@@ -609,7 +510,6 @@ class V extends d {
609
510
  const t = this.parent.input.count();
610
511
  return (t === 1 || t > 1 && !this.parent.plugins.get("pinch", !0)) && (this.saved.push({ x: this.parent.x, y: this.parent.y, time: performance.now() }), this.saved.length > 60 && this.saved.splice(0, 30)), !1;
611
512
  }
612
- /** Listener to viewport's "moved" event. */
613
513
  moved(t) {
614
514
  if (this.saved.length) {
615
515
  const e = this.saved[this.saved.length - 1];
@@ -628,13 +528,6 @@ class V extends d {
628
528
  }
629
529
  return !1;
630
530
  }
631
- /**
632
- * Manually activate deceleration, starting from the (x, y) velocity components passed in the options.
633
- *
634
- * @param {object} options
635
- * @param {number} [options.x] - Specify x-component of initial velocity.
636
- * @param {number} [options.y] - Specify y-component of initial velocity.
637
- */
638
531
  activate(t) {
639
532
  t = t || {}, typeof t.x < "u" && (this.x = t.x, this.percentChangeX = this.options.friction), typeof t.y < "u" && (this.y = t.y, this.percentChangeY = this.options.friction);
640
533
  }
@@ -672,32 +565,12 @@ const B = {
672
565
  wheelSwapAxes: !1
673
566
  };
674
567
  class M extends d {
675
- /** Options used to initialize this plugin, cannot be modified later. */
676
- /** Flags when viewport is moving. */
677
- /** Factor to apply from {@link IDecelerateOptions}'s reverse. */
678
- /** Holds whether dragging is enabled along the x-axis. */
679
- /** Holds whether dragging is enabled along the y-axis. */
680
- /** Flags whether the keys required to drag are pressed currently. */
681
- /** Holds whether the left, center, and right buttons are required to pan. */
682
- /** Underflow factor along x-axis */
683
- /** Underflow factor along y-axis */
684
- /** Last pointer position while panning. */
685
- /** The ID of the pointer currently panning the viewport. */
686
- /** Array of event-handlers for window */
687
568
  __init() {
688
569
  this.windowEventHandlers = new Array();
689
570
  }
690
- /**
691
- * This is called by {@link Viewport.drag}.
692
- */
693
571
  constructor(t, e = {}) {
694
572
  super(t), M.prototype.__init.call(this), this.options = Object.assign({}, B, e), this.moved = !1, this.reverse = this.options.reverse ? 1 : -1, this.xDirection = !this.options.direction || this.options.direction === "all" || this.options.direction === "x", this.yDirection = !this.options.direction || this.options.direction === "all" || this.options.direction === "y", this.keyIsPressed = !1, this.parseUnderflow(), this.mouseButtons(this.options.mouseButtons), this.options.keyToPress && this.handleKeyPresses(this.options.keyToPress);
695
573
  }
696
- /**
697
- * Handles keypress events and set the keyIsPressed boolean accordingly
698
- *
699
- * @param {array} codes - key codes that can be used to trigger drag event
700
- */
701
574
  handleKeyPresses(t) {
702
575
  const e = (i) => {
703
576
  t.includes(i.code) && (this.keyIsPressed = !0);
@@ -714,10 +587,6 @@ class M extends d {
714
587
  window.removeEventListener(t, e);
715
588
  });
716
589
  }
717
- /**
718
- * initialize mousebuttons array
719
- * @param {string} buttons
720
- */
721
590
  mouseButtons(t) {
722
591
  !t || t === "all" ? this.mouse = [!0, !0, !0] : this.mouse = [
723
592
  t.indexOf("left") !== -1,
@@ -729,18 +598,10 @@ class M extends d {
729
598
  const t = this.options.underflow.toLowerCase();
730
599
  t === "center" ? (this.underflowX = 0, this.underflowY = 0) : (t.includes("left") ? this.underflowX = -1 : t.includes("right") ? this.underflowX = 1 : this.underflowX = 0, t.includes("top") ? this.underflowY = -1 : t.includes("bottom") ? this.underflowY = 1 : this.underflowY = 0);
731
600
  }
732
- /**
733
- * @param {PIXI.InteractionEvent} event
734
- * @returns {boolean}
735
- */
736
601
  checkButtons(t) {
737
602
  const e = t.data.pointerType === "mouse", n = this.parent.input.count();
738
603
  return !!((n === 1 || n > 1 && !this.parent.plugins.get("pinch", !0)) && (!e || this.mouse[t.data.button]));
739
604
  }
740
- /**
741
- * @param {PIXI.InteractionEvent} event
742
- * @returns {boolean}
743
- */
744
605
  checkKeyPress(t) {
745
606
  return !this.options.keyToPress || this.keyIsPressed || this.options.ignoreKeyToPressOnTouch && t.data.pointerType === "touch";
746
607
  }
@@ -842,16 +703,6 @@ const U = {
842
703
  radius: null
843
704
  };
844
705
  class j extends d {
845
- /** The options used to initialize this plugin. */
846
- /** The target this plugin will make the viewport follow. */
847
- /** The velocity provided the viewport by following, at the current time. */
848
- /**
849
- * This is called by {@link Viewport.follow}.
850
- *
851
- * @param parent
852
- * @param target - target to follow
853
- * @param options
854
- */
855
706
  constructor(t, e, n = {}) {
856
707
  super(t), this.target = e, this.options = Object.assign({}, U, n), this.velocity = { x: 0, y: 0 };
857
708
  }
@@ -891,7 +742,7 @@ class j extends d {
891
742
  this.parent.moveCenter(n, i), this.parent.emit("moved", { viewport: this.parent, type: "follow" });
892
743
  }
893
744
  }
894
- const K = {
745
+ const Z = {
895
746
  radius: null,
896
747
  distance: null,
897
748
  top: null,
@@ -904,19 +755,9 @@ const K = {
904
755
  linear: !1,
905
756
  allowButtons: !1
906
757
  };
907
- class Z extends d {
908
- /** Options used to initialize this plugin, cannot be modified later. */
909
- /** Factor from reverse option. */
910
- /** Radius squared */
911
- /** Scroll region size on the left side. */
912
- /** Scroll region size on the top size. */
913
- /** Scroll region size on the right side. */
914
- /** Scroll region size on the bottom side. */
915
- /**
916
- * This is called by {@link Viewport.mouseEdges}.
917
- */
758
+ class q extends d {
918
759
  constructor(t, e = {}) {
919
- super(t), this.options = Object.assign({}, K, e), this.reverse = this.options.reverse ? 1 : -1, this.radiusSquared = typeof this.options.radius == "number" ? Math.pow(this.options.radius, 2) : null, this.resize();
760
+ super(t), this.options = Object.assign({}, Z, e), this.reverse = this.options.reverse ? 1 : -1, this.radiusSquared = typeof this.options.radius == "number" ? Math.pow(this.options.radius, 2) : null, this.resize();
920
761
  }
921
762
  resize() {
922
763
  const t = this.options.distance;
@@ -958,7 +799,7 @@ class Z extends d {
958
799
  }
959
800
  }
960
801
  }
961
- const q = {
802
+ const F = {
962
803
  noDrag: !1,
963
804
  percent: 1,
964
805
  center: null,
@@ -966,23 +807,17 @@ const q = {
966
807
  axis: "all"
967
808
  };
968
809
  class y extends d {
969
- /** Options used to initialize this plugin. */
970
- /** Flags whether this plugin is active, i.e. a pointer is down on the viewport. */
971
810
  __init() {
972
811
  this.active = !1;
973
812
  }
974
- /** Flags whether the viewport is being pinched. */
975
813
  __init2() {
976
814
  this.pinching = !1;
977
815
  }
978
816
  __init3() {
979
817
  this.moved = !1;
980
818
  }
981
- /**
982
- * This is called by {@link Viewport.pinch}.
983
- */
984
819
  constructor(t, e = {}) {
985
- super(t), y.prototype.__init.call(this), y.prototype.__init2.call(this), y.prototype.__init3.call(this), this.options = Object.assign({}, q, e);
820
+ super(t), y.prototype.__init.call(this), y.prototype.__init2.call(this), y.prototype.__init3.call(this), this.options = Object.assign({}, F, e);
986
821
  }
987
822
  down() {
988
823
  return this.parent.input.count() >= 2 ? (this.active = !0, !0) : !1;
@@ -1031,7 +866,7 @@ class y extends d {
1031
866
  return this.pinching && this.parent.input.touches.length <= 1 ? (this.active = !1, this.lastCenter = null, this.pinching = !1, this.moved = !1, this.parent.emit("pinch-end", this.parent), !0) : !1;
1032
867
  }
1033
868
  }
1034
- const F = {
869
+ const K = {
1035
870
  topLeft: !1,
1036
871
  friction: 0.8,
1037
872
  time: 1e3,
@@ -1042,11 +877,8 @@ const F = {
1042
877
  forceStart: !1
1043
878
  };
1044
879
  class Q extends d {
1045
- /**
1046
- * This is called by {@link Viewport.snap}.
1047
- */
1048
880
  constructor(t, e, n, i = {}) {
1049
- super(t), this.options = Object.assign({}, F, i), this.ease = H(i.ease, "easeInOutSine"), this.x = e, this.y = n, this.options.forceStart && this.snapStart();
881
+ super(t), this.options = Object.assign({}, K, i), this.ease = H(i.ease, "easeInOutSine"), this.x = e, this.y = n, this.options.forceStart && this.snapStart();
1050
882
  }
1051
883
  snapStart() {
1052
884
  this.percent = 0, this.snapping = { time: 0 };
@@ -1099,9 +931,6 @@ const R = {
1099
931
  noMove: !1
1100
932
  };
1101
933
  class G extends d {
1102
- /**
1103
- * This is called by {@link Viewport.snapZoom}.
1104
- */
1105
934
  constructor(t, e = {}) {
1106
935
  super(t), this.options = Object.assign({}, R, e), this.ease = H(this.options.ease), this.xIndependent = !1, this.yIndependent = !1, this.xScale = 0, this.yScale = 0, this.options.width > 0 && (this.xScale = t.screenWidth / this.options.width, this.xIndependent = !0), this.options.height > 0 && (this.yScale = t.screenHeight / this.options.height, this.yIndependent = !0), this.xScale = this.xIndependent ? this.xScale : this.yScale, this.yScale = this.yIndependent ? this.yScale : this.xScale, this.options.time === 0 ? (t.container.scale.x = this.xScale, t.container.scale.y = this.yScale, this.options.removeOnComplete && this.parent.plugins.remove("snap-zoom")) : e.forceStart && this.createSnapping();
1107
936
  }
@@ -1146,7 +975,7 @@ class G extends d {
1146
975
  this.snapping = null, super.resume();
1147
976
  }
1148
977
  }
1149
- const N = {
978
+ const J = {
1150
979
  percent: 0.1,
1151
980
  smooth: !1,
1152
981
  interrupt: !0,
@@ -1158,19 +987,10 @@ const N = {
1158
987
  trackpadPinch: !1,
1159
988
  wheelZoom: !0
1160
989
  };
1161
- class $ extends d {
1162
- /** Flags whether the keys required to zoom are pressed currently. */
1163
- /**
1164
- * This is called by {@link Viewport.wheel}.
1165
- */
990
+ class N extends d {
1166
991
  constructor(t, e = {}) {
1167
- super(t), this.options = Object.assign({}, N, e), this.keyIsPressed = !1, this.options.keyToPress && this.handleKeyPresses(this.options.keyToPress);
992
+ super(t), this.options = Object.assign({}, J, e), this.keyIsPressed = !1, this.options.keyToPress && this.handleKeyPresses(this.options.keyToPress);
1168
993
  }
1169
- /**
1170
- * Handles keypress events and set the keyIsPressed boolean accordingly
1171
- *
1172
- * @param {array} codes - key codes that can be used to trigger zoom event
1173
- */
1174
994
  handleKeyPresses(t) {
1175
995
  window.addEventListener("keydown", (e) => {
1176
996
  t.includes(e.code) && (this.keyIsPressed = !0);
@@ -1258,12 +1078,10 @@ class $ extends d {
1258
1078
  return !this.parent.options.passiveWheel;
1259
1079
  }
1260
1080
  }
1261
- class J {
1262
- /** List of active touches on viewport */
1081
+ class $ {
1263
1082
  constructor(t) {
1264
1083
  this.viewport = t, this.touches = [], this.addListeners();
1265
1084
  }
1266
- /** Add input listeners */
1267
1085
  addListeners() {
1268
1086
  this.viewport.interactive = !0, this.viewport.forceHitArea || (this.viewport.hitArea = new b(0, 0, this.viewport.worldWidth, this.viewport.worldHeight)), this.viewport.on("pointerdown", this.down, this), this.viewport.on("pointermove", this.move, this), this.viewport.on("pointerup", this.up, this), this.viewport.on("pointerupoutside", this.up, this), this.viewport.on("pointercancel", this.up, this), this.viewport.on("pointerout", this.up, this), this.wheelFunction = (t) => this.handleWheel(t), this.viewport.options.divWheel.addEventListener(
1269
1087
  "wheel",
@@ -1271,18 +1089,9 @@ class J {
1271
1089
  { passive: this.viewport.options.passiveWheel }
1272
1090
  ), this.isMouseDown = !1;
1273
1091
  }
1274
- /**
1275
- * Removes all event listeners from viewport
1276
- * (useful for cleanup of wheel when removing viewport)
1277
- */
1278
1092
  destroy() {
1279
1093
  this.viewport.options.divWheel.removeEventListener("wheel", this.wheelFunction);
1280
1094
  }
1281
- /**
1282
- * handle down events for viewport
1283
- *
1284
- * @param {PIXI.InteractionEvent} event
1285
- */
1286
1095
  down(t) {
1287
1096
  if (!(this.viewport.pause || !this.viewport.worldVisible)) {
1288
1097
  if (t.data.pointerType === "mouse" ? this.isMouseDown = !0 : this.get(t.data.pointerId) || this.touches.push({ id: t.data.pointerId, last: null }), this.count() === 1) {
@@ -1294,18 +1103,12 @@ class J {
1294
1103
  this.viewport.plugins.down(t) && this.viewport.options.stopPropagation && t.stopPropagation();
1295
1104
  }
1296
1105
  }
1297
- /** Clears all pointer events */
1298
1106
  clear() {
1299
1107
  this.isMouseDown = !1, this.touches = [], this.last = null;
1300
1108
  }
1301
- /**
1302
- * @param {number} change
1303
- * @returns whether change exceeds threshold
1304
- */
1305
1109
  checkThreshold(t) {
1306
1110
  return Math.abs(t) >= this.viewport.threshold;
1307
1111
  }
1308
- /** Handle move events for viewport */
1309
1112
  move(t) {
1310
1113
  if (this.viewport.pause || !this.viewport.worldVisible)
1311
1114
  return;
@@ -1316,7 +1119,6 @@ class J {
1316
1119
  }
1317
1120
  e && this.viewport.options.stopPropagation && t.stopPropagation();
1318
1121
  }
1319
- /** Handle up events for viewport */
1320
1122
  up(t) {
1321
1123
  if (this.viewport.pause || !this.viewport.worldVisible)
1322
1124
  return;
@@ -1329,7 +1131,6 @@ class J {
1329
1131
  viewport: this
1330
1132
  }), this.clickedAvailable = !1), e && this.viewport.options.stopPropagation && t.stopPropagation();
1331
1133
  }
1332
- /** Gets pointer position if this.interaction is set */
1333
1134
  getPointerPosition(t) {
1334
1135
  const e = new c();
1335
1136
  if (this.viewport.options.interaction)
@@ -1341,7 +1142,6 @@ class J {
1341
1142
  e.x = t.clientX, e.y = t.clientY;
1342
1143
  return e;
1343
1144
  }
1344
- /** Handle wheel events */
1345
1145
  handleWheel(t) {
1346
1146
  if (this.viewport.pause || !this.viewport.worldVisible || this.viewport.options.interaction && this.viewport.options.interaction.interactionDOMElement !== t.target)
1347
1147
  return;
@@ -1351,14 +1151,12 @@ class J {
1351
1151
  pause() {
1352
1152
  this.touches = [], this.isMouseDown = !1;
1353
1153
  }
1354
- /** Get touch by id */
1355
1154
  get(t) {
1356
1155
  for (const e of this.touches)
1357
1156
  if (e.id === t)
1358
1157
  return e;
1359
1158
  return null;
1360
1159
  }
1361
- /** Remove touch by number */
1362
1160
  remove(t) {
1363
1161
  for (let e = 0; e < this.touches.length; e++)
1364
1162
  if (this.touches[e].id === t) {
@@ -1366,9 +1164,6 @@ class J {
1366
1164
  return;
1367
1165
  }
1368
1166
  }
1369
- /**
1370
- * @returns {number} count of mouse/touch pointers that are down on the viewport
1371
- */
1372
1167
  count() {
1373
1168
  return (this.isMouseDown ? 1 : 0) + this.touches.length;
1374
1169
  }
@@ -1398,150 +1193,67 @@ const w = [
1398
1193
  "clamp"
1399
1194
  ];
1400
1195
  class tt {
1401
- /** Maps mounted plugins by their type */
1402
- /**
1403
- * List of plugins mounted
1404
- *
1405
- * This list is kept sorted by the internal priority of plugins (hard-coded).
1406
- */
1407
- /** The viewport using the plugins managed by `this`. */
1408
- /** This is called by {@link Viewport} to initialize the {@link Viewport.plugins plugins}. */
1409
1196
  constructor(t) {
1410
1197
  this.viewport = t, this.list = [], this.plugins = {};
1411
1198
  }
1412
- /**
1413
- * Inserts a named plugin or a user plugin into the viewport
1414
- * default plugin order: 'drag', 'pinch', 'wheel', 'follow', 'mouse-edges', 'decelerate', 'bounce',
1415
- * 'snap-zoom', 'clamp-zoom', 'snap', 'clamp'
1416
- *
1417
- * @param {string} name of plugin
1418
- * @param {Plugin} plugin - instantiated Plugin class
1419
- * @param {number} index to insert userPlugin (otherwise inserts it at the end)
1420
- */
1421
1199
  add(t, e, n = w.length) {
1422
1200
  const i = this.plugins[t];
1423
1201
  i && i.destroy(), this.plugins[t] = e;
1424
1202
  const s = w.indexOf(t);
1425
1203
  s !== -1 && w.splice(s, 1), w.splice(n, 0, t), this.sort();
1426
1204
  }
1427
- /**
1428
- * Get plugin
1429
- *
1430
- * @param {string} name of plugin
1431
- * @param {boolean} [ignorePaused] return null if plugin is paused
1432
- */
1433
1205
  get(t, e) {
1434
1206
  return e && W([this, "access", (n) => n.plugins, "access", (n) => n[t], "optionalAccess", (n) => n.paused]) ? null : this.plugins[t];
1435
1207
  }
1436
- /**
1437
- * Update all active plugins
1438
- *
1439
- * @internal
1440
- * @ignore
1441
- * @param {number} elapsed type in milliseconds since last update
1442
- */
1443
1208
  update(t) {
1444
1209
  for (const e of this.list)
1445
1210
  e.update(t);
1446
1211
  }
1447
- /**
1448
- * Resize all active plugins
1449
- *
1450
- * @internal
1451
- * @ignore
1452
- */
1453
1212
  resize() {
1454
1213
  for (const t of this.list)
1455
1214
  t.resize();
1456
1215
  }
1457
- /** Clamps and resets bounce and decelerate (as needed) after manually moving viewport */
1458
1216
  reset() {
1459
1217
  for (const t of this.list)
1460
1218
  t.reset();
1461
1219
  }
1462
- /** removes all installed plugins */
1463
1220
  removeAll() {
1464
1221
  this.list.forEach((t) => {
1465
1222
  t.destroy();
1466
1223
  }), this.plugins = {}, this.sort();
1467
1224
  }
1468
- /**
1469
- * Removes installed plugin
1470
- *
1471
- * @param {string} name of plugin (e.g., 'drag', 'pinch')
1472
- */
1473
1225
  remove(t) {
1474
1226
  this.plugins[t] && (W([this, "access", (e) => e.plugins, "access", (e) => e[t], "optionalAccess", (e) => e.destroy, "call", (e) => e()]), delete this.plugins[t], this.viewport.emit(`${t}-remove`), this.sort());
1475
1227
  }
1476
- /**
1477
- * Pause plugin
1478
- *
1479
- * @param {string} name of plugin (e.g., 'drag', 'pinch')
1480
- */
1481
1228
  pause(t) {
1482
1229
  W([this, "access", (e) => e.plugins, "access", (e) => e[t], "optionalAccess", (e) => e.pause, "call", (e) => e()]);
1483
1230
  }
1484
- /**
1485
- * Resume plugin
1486
- *
1487
- * @param {string} name of plugin (e.g., 'drag', 'pinch')
1488
- */
1489
1231
  resume(t) {
1490
1232
  W([this, "access", (e) => e.plugins, "access", (e) => e[t], "optionalAccess", (e) => e.resume, "call", (e) => e()]);
1491
1233
  }
1492
- /**
1493
- * Sort plugins according to PLUGIN_ORDER
1494
- *
1495
- * @internal
1496
- * @ignore
1497
- */
1498
1234
  sort() {
1499
1235
  this.list = [];
1500
1236
  for (const t of w)
1501
1237
  this.plugins[t] && this.list.push(this.plugins[t]);
1502
1238
  }
1503
- /**
1504
- * Handle down for all plugins
1505
- *
1506
- * @internal
1507
- * @ignore
1508
- */
1509
1239
  down(t) {
1510
1240
  let e = !1;
1511
1241
  for (const n of this.list)
1512
1242
  n.down(t) && (e = !0);
1513
1243
  return e;
1514
1244
  }
1515
- /**
1516
- * Handle move for all plugins
1517
- *
1518
- * @internal
1519
- * @ignore
1520
- */
1521
1245
  move(t) {
1522
1246
  let e = !1;
1523
1247
  for (const n of this.viewport.plugins.list)
1524
1248
  n.move(t) && (e = !0);
1525
1249
  return e;
1526
1250
  }
1527
- /**
1528
- * Handle up for all plugins
1529
- *
1530
- * @internal
1531
- * @ignore
1532
- */
1533
1251
  up(t) {
1534
1252
  let e = !1;
1535
1253
  for (const n of this.list)
1536
1254
  n.up(t) && (e = !0);
1537
1255
  return e;
1538
1256
  }
1539
- /**
1540
- * Handle wheel event for all plugins
1541
- *
1542
- * @internal
1543
- * @ignore
1544
- */
1545
1257
  wheel(t) {
1546
1258
  let e = !1;
1547
1259
  for (const n of this.list)
@@ -1564,54 +1276,20 @@ const et = {
1564
1276
  ticker: O.shared
1565
1277
  };
1566
1278
  class C extends k {
1567
- /** Flags whether the viewport is being panned */
1568
- /** Number of pixels to move to trigger an input event (e.g., drag, pinch) or disable a clicked event */
1569
- /** Use this to add user plugins or access existing plugins (e.g., to pause, resume, or remove them) */
1570
- /** Flags whether the viewport zoom is being changed. */
1571
- /** The options passed when creating this viewport, merged with the default values */
1572
1279
  __init() {
1573
1280
  this._disableOnContextMenu = (t) => t.preventDefault();
1574
1281
  }
1575
- /**
1576
- * @param {IViewportOptions} ViewportOptions
1577
- * @param {number} [options.screenWidth=window.innerWidth]
1578
- * @param {number} [options.screenHeight=window.innerHeight]
1579
- * @param {number} [options.worldWidth=this.width]
1580
- * @param {number} [options.worldHeight=this.height]
1581
- * @param {number} [options.threshold=5] number of pixels to move to trigger an input event (e.g., drag, pinch)
1582
- * or disable a clicked event
1583
- * @param {boolean} [options.passiveWheel=true] whether the 'wheel' event is set to passive (note: if false,
1584
- * e.preventDefault() will be called when wheel is used over the viewport)
1585
- * @param {boolean} [options.stopPropagation=false] whether to stopPropagation of events that impact the viewport
1586
- * (except wheel events, see options.passiveWheel)
1587
- * @param {HitArea} [options.forceHitArea] change the default hitArea from world size to a new value
1588
- * @param {boolean} [options.noTicker] set this if you want to manually call update() function on each frame
1589
- * @param {PIXI.Ticker} [options.ticker=PIXI.Ticker.shared] use this PIXI.ticker for updates
1590
- * @param {PIXI.InteractionManager} [options.interaction=null] InteractionManager, available from instantiated
1591
- * WebGLRenderer/CanvasRenderer.plugins.interaction - used to calculate pointer position relative to canvas
1592
- * location on screen
1593
- * @param {HTMLElement} [options.divWheel=document.body] div to attach the wheel event
1594
- * @param {boolean} [options.disableOnContextMenu] remove oncontextmenu=() => {} from the divWheel element
1595
- */
1596
1282
  constructor(t = {}) {
1597
1283
  super(), C.prototype.__init.call(this), this.options = Object.assign(
1598
1284
  {},
1599
1285
  { divWheel: document.body },
1600
1286
  et,
1601
1287
  t
1602
- ), this.screenWidth = this.options.screenWidth, this.screenHeight = this.options.screenHeight, this._worldWidth = this.options.worldWidth, this._worldHeight = this.options.worldHeight, this.forceHitArea = this.options.forceHitArea, this.threshold = this.options.threshold, this.options.divWheel = this.options.divWheel || document.body, this.options.disableOnContextMenu && this.options.divWheel.addEventListener("contextmenu", this._disableOnContextMenu), this.options.noTicker || (this.tickerFunction = () => this.update(this.options.ticker.elapsedMS), this.options.ticker.add(this.tickerFunction)), this.input = new J(this), this.plugins = new tt(this);
1288
+ ), this.screenWidth = this.options.screenWidth, this.screenHeight = this.options.screenHeight, this._worldWidth = this.options.worldWidth, this._worldHeight = this.options.worldHeight, this.forceHitArea = this.options.forceHitArea, this.threshold = this.options.threshold, this.options.divWheel = this.options.divWheel || document.body, this.options.disableOnContextMenu && this.options.divWheel.addEventListener("contextmenu", this._disableOnContextMenu), this.options.noTicker || (this.tickerFunction = () => this.update(this.options.ticker.elapsedMS), this.options.ticker.add(this.tickerFunction)), this.input = new $(this), this.plugins = new tt(this);
1603
1289
  }
1604
- /** Overrides PIXI.Container's destroy to also remove the 'wheel' and PIXI.Ticker listeners */
1605
1290
  destroy(t) {
1606
1291
  !this.options.noTicker && this.tickerFunction && this.options.ticker.remove(this.tickerFunction), this.options.disableOnContextMenu && this.options.divWheel.removeEventListener("contextmenu", this._disableOnContextMenu), this.input.destroy(), super.destroy(t);
1607
1292
  }
1608
- /**
1609
- * Update viewport on each frame.
1610
- *
1611
- * By default, you do not need to call this unless you set `options.noTicker=true`.
1612
- *
1613
- * @param {number} elapsed time in milliseconds since last update
1614
- */
1615
1293
  update(t) {
1616
1294
  this.pause || (this.plugins.update(t), this.lastViewport && (this.lastViewport.x !== this.x || this.lastViewport.y !== this.y ? this.moving = !0 : this.moving && (this.emit("moved-end", this), this.moving = !1), this.lastViewport.scaleX !== this.scale.x || this.lastViewport.scaleY !== this.scale.y ? this.zooming = !0 : this.zooming && (this.emit("zoomed-end", this), this.zooming = !1)), this.forceHitArea || (this._hitAreaDefault = new b(this.left, this.top, this.worldScreenWidth, this.worldScreenHeight), this.hitArea = this._hitAreaDefault), this._dirty = this._dirty || !this.lastViewport || this.lastViewport.x !== this.x || this.lastViewport.y !== this.y || this.lastViewport.scaleX !== this.scale.x || this.lastViewport.scaleY !== this.scale.y, this.lastViewport = {
1617
1295
  x: this.x,
@@ -1620,71 +1298,42 @@ class C extends k {
1620
1298
  scaleY: this.scale.y
1621
1299
  }, this.emit("frame-end", this));
1622
1300
  }
1623
- /**
1624
- * Use this to set screen and world sizes, needed for pinch/wheel/clamp/bounce.
1625
- * @param {number} screenWidth=window.innerWidth
1626
- * @param {number} screenHeight=window.innerHeight
1627
- * @param {number} [worldWidth]
1628
- * @param {number} [worldHeight]
1629
- */
1630
1301
  resize(t = window.innerWidth, e = window.innerHeight, n, i) {
1631
1302
  this.screenWidth = t, this.screenHeight = e, typeof n < "u" && (this._worldWidth = n), typeof i < "u" && (this._worldHeight = i), this.plugins.resize(), this.dirty = !0;
1632
1303
  }
1633
- /** World width, in pixels */
1634
1304
  get worldWidth() {
1635
1305
  return this._worldWidth ? this._worldWidth : this.width / this.scale.x;
1636
1306
  }
1637
1307
  set worldWidth(t) {
1638
1308
  this._worldWidth = t, this.plugins.resize();
1639
1309
  }
1640
- /** World height, in pixels */
1641
1310
  get worldHeight() {
1642
1311
  return this._worldHeight ? this._worldHeight : this.height / this.scale.y;
1643
1312
  }
1644
1313
  set worldHeight(t) {
1645
1314
  this._worldHeight = t, this.plugins.resize();
1646
1315
  }
1647
- /** Get visible world bounds of viewport */
1648
1316
  getVisibleBounds() {
1649
1317
  return new b(this.left, this.top, this.worldScreenWidth, this.worldScreenHeight);
1650
1318
  }
1651
- /** Change coordinates from screen to world */
1652
- /**
1653
- * Changes coordinate from screen to world
1654
- * @param {number|PIXI.Point} x
1655
- * @param {number} y
1656
- * @returns {PIXI.Point}
1657
- */
1658
1319
  toWorld(t, e) {
1659
1320
  return arguments.length === 2 ? this.toLocal(new c(t, e)) : this.toLocal(t);
1660
1321
  }
1661
- /** Change coordinates from world to screen */
1662
- /**
1663
- * Changes coordinate from world to screen
1664
- * @param {number|PIXI.Point} x
1665
- * @param {number} y
1666
- * @returns {PIXI.Point}
1667
- */
1668
1322
  toScreen(t, e) {
1669
1323
  return arguments.length === 2 ? this.toGlobal(new c(t, e)) : this.toGlobal(t);
1670
1324
  }
1671
- /** Screen width in world coordinates */
1672
1325
  get worldScreenWidth() {
1673
1326
  return this.screenWidth / this.scale.x;
1674
1327
  }
1675
- /** Screen height in world coordinates */
1676
1328
  get worldScreenHeight() {
1677
1329
  return this.screenHeight / this.scale.y;
1678
1330
  }
1679
- /** World width in screen coordinates */
1680
1331
  get screenWorldWidth() {
1681
1332
  return this.worldWidth * this.scale.x;
1682
1333
  }
1683
- /** World height in screen coordinates */
1684
1334
  get screenWorldHeight() {
1685
1335
  return this.worldHeight * this.scale.y;
1686
1336
  }
1687
- /** Center of screen in world coordinates */
1688
1337
  get center() {
1689
1338
  return new c(
1690
1339
  this.worldScreenWidth / 2 - this.x / this.scale.x,
@@ -1694,205 +1343,87 @@ class C extends k {
1694
1343
  set center(t) {
1695
1344
  this.moveCenter(t);
1696
1345
  }
1697
- /**
1698
- * Move center of viewport to (x, y)
1699
- * @param {number|PIXI.Point} x
1700
- * @param {number} [y]
1701
- * @return {Viewport}
1702
- */
1703
1346
  moveCenter(...t) {
1704
1347
  let e, n;
1705
1348
  typeof t[0] == "number" ? (e = t[0], n = t[1]) : (e = t[0].x, n = t[0].y);
1706
1349
  const i = (this.worldScreenWidth / 2 - e) * this.scale.x, s = (this.worldScreenHeight / 2 - n) * this.scale.y;
1707
1350
  return (this.x !== i || this.y !== s) && (this.position.set(i, s), this.plugins.reset(), this.dirty = !0), this;
1708
1351
  }
1709
- /** Top-left corner of Viewport */
1710
1352
  get corner() {
1711
1353
  return new c(-this.x / this.scale.x, -this.y / this.scale.y);
1712
1354
  }
1713
1355
  set corner(t) {
1714
1356
  this.moveCorner(t);
1715
1357
  }
1716
- /** Move Viewport's top-left corner; also clamps and resets decelerate and bounce (as needed) */
1717
- /**
1718
- * MoveCorner
1719
- * @param {number|PIXI.Point} x
1720
- * @param {number} [y]
1721
- * @returns {Viewport}
1722
- */
1723
1358
  moveCorner(...t) {
1724
1359
  let e, n;
1725
1360
  return t.length === 1 ? (e = -t[0].x * this.scale.x, n = -t[0].y * this.scale.y) : (e = -t[0] * this.scale.x, n = -t[1] * this.scale.y), (e !== this.x || n !== this.y) && (this.position.set(e, n), this.plugins.reset(), this.dirty = !0), this;
1726
1361
  }
1727
- /** Get how many world pixels fit in screen's width */
1728
1362
  get screenWidthInWorldPixels() {
1729
1363
  return this.screenWidth / this.scale.x;
1730
1364
  }
1731
- /** Get how many world pixels fit on screen's height */
1732
1365
  get screenHeightInWorldPixels() {
1733
1366
  return this.screenHeight / this.scale.y;
1734
1367
  }
1735
- /**
1736
- * Find the scale value that fits a world width on the screen
1737
- * does not change the viewport (use fit... to change)
1738
- *
1739
- * @param width - Width in world pixels
1740
- * @return - scale
1741
- */
1742
1368
  findFitWidth(t) {
1743
1369
  return this.screenWidth / t;
1744
1370
  }
1745
- /**
1746
- * Finds the scale value that fits a world height on the screens
1747
- * does not change the viewport (use fit... to change)
1748
- *
1749
- * @param height - Height in world pixels
1750
- * @return - scale
1751
- */
1752
1371
  findFitHeight(t) {
1753
1372
  return this.screenHeight / t;
1754
1373
  }
1755
- /**
1756
- * Finds the scale value that fits the smaller of a world width and world height on the screen
1757
- * does not change the viewport (use fit... to change)
1758
- *
1759
- * @param {number} width in world pixels
1760
- * @param {number} height in world pixels
1761
- * @returns {number} scale
1762
- */
1763
1374
  findFit(t, e) {
1764
1375
  const n = this.screenWidth / t, i = this.screenHeight / e;
1765
1376
  return Math.min(n, i);
1766
1377
  }
1767
- /**
1768
- * Finds the scale value that fits the larger of a world width and world height on the screen
1769
- * does not change the viewport (use fit... to change)
1770
- *
1771
- * @param {number} width in world pixels
1772
- * @param {number} height in world pixels
1773
- * @returns {number} scale
1774
- */
1775
1378
  findCover(t, e) {
1776
1379
  const n = this.screenWidth / t, i = this.screenHeight / e;
1777
1380
  return Math.max(n, i);
1778
1381
  }
1779
- /**
1780
- * Change zoom so the width fits in the viewport
1781
- *
1782
- * @param width - width in world coordinates
1783
- * @param center - maintain the same center
1784
- * @param scaleY - whether to set scaleY=scaleX
1785
- * @param noClamp - whether to disable clamp-zoom
1786
- * @returns {Viewport} this
1787
- */
1788
1382
  fitWidth(t = this.worldWidth, e, n = !0, i) {
1789
1383
  let s;
1790
1384
  e && (s = this.center), this.scale.x = this.screenWidth / t, n && (this.scale.y = this.scale.x);
1791
1385
  const h = this.plugins.get("clamp-zoom", !0);
1792
1386
  return !i && h && h.clamp(), e && s && this.moveCenter(s), this;
1793
1387
  }
1794
- /**
1795
- * Change zoom so the height fits in the viewport
1796
- *
1797
- * @param {number} [height=this.worldHeight] in world coordinates
1798
- * @param {boolean} [center] maintain the same center of the screen after zoom
1799
- * @param {boolean} [scaleX=true] whether to set scaleX = scaleY
1800
- * @param {boolean} [noClamp] whether to disable clamp-zoom
1801
- * @returns {Viewport} this
1802
- */
1803
1388
  fitHeight(t = this.worldHeight, e, n = !0, i) {
1804
1389
  let s;
1805
1390
  e && (s = this.center), this.scale.y = this.screenHeight / t, n && (this.scale.x = this.scale.y);
1806
1391
  const h = this.plugins.get("clamp-zoom", !0);
1807
1392
  return !i && h && h.clamp(), e && s && this.moveCenter(s), this;
1808
1393
  }
1809
- /**
1810
- * Change zoom so it fits the entire world in the viewport
1811
- *
1812
- * @param {boolean} center maintain the same center of the screen after zoom
1813
- * @returns {Viewport} this
1814
- */
1815
1394
  fitWorld(t) {
1816
1395
  let e;
1817
1396
  t && (e = this.center), this.scale.x = this.screenWidth / this.worldWidth, this.scale.y = this.screenHeight / this.worldHeight, this.scale.x < this.scale.y ? this.scale.y = this.scale.x : this.scale.x = this.scale.y;
1818
1397
  const n = this.plugins.get("clamp-zoom", !0);
1819
1398
  return n && n.clamp(), t && e && this.moveCenter(e), this;
1820
1399
  }
1821
- /**
1822
- * Change zoom so it fits the size or the entire world in the viewport
1823
- *
1824
- * @param {boolean} [center] maintain the same center of the screen after zoom
1825
- * @param {number} [width=this.worldWidth] desired width
1826
- * @param {number} [height=this.worldHeight] desired height
1827
- * @returns {Viewport} this
1828
- */
1829
1400
  fit(t, e = this.worldWidth, n = this.worldHeight) {
1830
1401
  let i;
1831
1402
  t && (i = this.center), this.scale.x = this.screenWidth / e, this.scale.y = this.screenHeight / n, this.scale.x < this.scale.y ? this.scale.y = this.scale.x : this.scale.x = this.scale.y;
1832
1403
  const s = this.plugins.get("clamp-zoom", !0);
1833
1404
  return s && s.clamp(), t && i && this.moveCenter(i), this;
1834
1405
  }
1835
- /**
1836
- * Zoom viewport to specific value.
1837
- *
1838
- * @param {number} scale value (e.g., 1 would be 100%, 0.25 would be 25%)
1839
- * @param {boolean} [center] maintain the same center of the screen after zoom
1840
- * @return {Viewport} this
1841
- */
1842
1406
  setZoom(t, e) {
1843
1407
  let n;
1844
1408
  e && (n = this.center), this.scale.set(t);
1845
1409
  const i = this.plugins.get("clamp-zoom", !0);
1846
1410
  return i && i.clamp(), e && n && this.moveCenter(n), this;
1847
1411
  }
1848
- /**
1849
- * Zoom viewport by a certain percent (in both x and y direction).
1850
- *
1851
- * @param {number} percent change (e.g., 0.25 would increase a starting scale of 1.0 to 1.25)
1852
- * @param {boolean} [center] maintain the same center of the screen after zoom
1853
- * @return {Viewport} this
1854
- */
1855
1412
  zoomPercent(t, e) {
1856
1413
  return this.setZoom(this.scale.x + this.scale.x * t, e);
1857
1414
  }
1858
- /**
1859
- * Zoom viewport by increasing/decreasing width by a certain number of pixels.
1860
- *
1861
- * @param {number} change in pixels
1862
- * @param {boolean} [center] maintain the same center of the screen after zoom
1863
- * @return {Viewport} this
1864
- */
1865
1415
  zoom(t, e) {
1866
1416
  return this.fitWidth(t + this.worldScreenWidth, e), this;
1867
1417
  }
1868
- /** Changes scale of viewport and maintains center of viewport */
1869
1418
  get scaled() {
1870
1419
  return this.scale.x;
1871
1420
  }
1872
1421
  set scaled(t) {
1873
1422
  this.setZoom(t, !0);
1874
1423
  }
1875
- /**
1876
- * Returns zoom to the desired scale
1877
- *
1878
- * @param {ISnapZoomOptions} options
1879
- * @param {number} [options.width=0] - the desired width to snap (to maintain aspect ratio, choose width or height)
1880
- * @param {number} [options.height=0] - the desired height to snap (to maintain aspect ratio, choose width or height)
1881
- * @param {number} [options.time=1000] - time for snapping in ms
1882
- * @param {(string|function)} [options.ease=easeInOutSine] ease function or name (see http://easings.net/
1883
- * for supported names)
1884
- * @param {PIXI.Point} [options.center] - place this point at center during zoom instead of center of the viewport
1885
- * @param {boolean} [options.interrupt=true] - pause snapping with any user input on the viewport
1886
- * @param {boolean} [options.removeOnComplete] - removes this plugin after snapping is complete
1887
- * @param {boolean} [options.removeOnInterrupt] - removes this plugin if interrupted by any user input
1888
- * @param {boolean} [options.forceStart] - starts the snap immediately regardless of whether the viewport is at the
1889
- * desired zoom
1890
- * @param {boolean} [options.noMove] - zoom but do not move
1891
- */
1892
1424
  snapZoom(t) {
1893
1425
  return this.plugins.add("snap-zoom", new G(this, t)), this;
1894
1426
  }
1895
- /** Is container out of world bounds */
1896
1427
  OOB() {
1897
1428
  return {
1898
1429
  left: this.left < 0,
@@ -1905,316 +1436,81 @@ class C extends k {
1905
1436
  )
1906
1437
  };
1907
1438
  }
1908
- /** World coordinates of the right edge of the screen */
1909
1439
  get right() {
1910
1440
  return -this.x / this.scale.x + this.worldScreenWidth;
1911
1441
  }
1912
1442
  set right(t) {
1913
1443
  this.x = -t * this.scale.x + this.screenWidth, this.plugins.reset();
1914
1444
  }
1915
- /** World coordinates of the left edge of the screen */
1916
1445
  get left() {
1917
1446
  return -this.x / this.scale.x;
1918
1447
  }
1919
1448
  set left(t) {
1920
1449
  this.x = -t * this.scale.x, this.plugins.reset();
1921
1450
  }
1922
- /** World coordinates of the top edge of the screen */
1923
1451
  get top() {
1924
1452
  return -this.y / this.scale.y;
1925
1453
  }
1926
1454
  set top(t) {
1927
1455
  this.y = -t * this.scale.y, this.plugins.reset();
1928
1456
  }
1929
- /** World coordinates of the bottom edge of the screen */
1930
1457
  get bottom() {
1931
1458
  return -this.y / this.scale.y + this.worldScreenHeight;
1932
1459
  }
1933
1460
  set bottom(t) {
1934
1461
  this.y = -t * this.scale.y + this.screenHeight, this.plugins.reset();
1935
1462
  }
1936
- /**
1937
- * Determines whether the viewport is dirty (i.e., needs to be rendered to the screen because of a change)
1938
- */
1939
1463
  get dirty() {
1940
1464
  return !!this._dirty;
1941
1465
  }
1942
1466
  set dirty(t) {
1943
1467
  this._dirty = t;
1944
1468
  }
1945
- /**
1946
- * Permanently changes the Viewport's hitArea
1947
- *
1948
- * NOTE: if not set then hitArea = PIXI.Rectangle(Viewport.left, Viewport.top, Viewport.worldScreenWidth,
1949
- * Viewport.worldScreenHeight)
1950
- */
1951
1469
  get forceHitArea() {
1952
1470
  return this._forceHitArea;
1953
1471
  }
1954
1472
  set forceHitArea(t) {
1955
1473
  t ? (this._forceHitArea = t, this.hitArea = t) : (this._forceHitArea = null, this.hitArea = new b(0, 0, this.worldWidth, this.worldHeight));
1956
1474
  }
1957
- /**
1958
- * Enable one-finger touch to drag
1959
- *
1960
- * NOTE: if you expect users to use right-click dragging, you should enable `viewport.options.disableOnContextMenu`
1961
- * to avoid the context menu popping up on each right-click drag.
1962
- *
1963
- * @param {IDragOptions} [options]
1964
- * @param {string} [options.direction=all] direction to drag
1965
- * @param {boolean} [options.pressDrag=true] whether click to drag is active
1966
- * @param {boolean} [options.wheel=true] use wheel to scroll in direction (unless wheel plugin is active)
1967
- * @param {number} [options.wheelScroll=1] number of pixels to scroll with each wheel spin
1968
- * @param {boolean} [options.reverse] reverse the direction of the wheel scroll
1969
- * @param {(boolean|string)} [options.clampWheel=false] clamp wheel(to avoid weird bounce with mouse wheel)
1970
- * @param {string} [options.underflow=center] where to place world if too small for screen
1971
- * @param {number} [options.factor=1] factor to multiply drag to increase the speed of movement
1972
- * @param {string} [options.mouseButtons=all] changes which mouse buttons trigger drag, use: 'all', 'left',
1973
- * 'right' 'middle', or some combination, like, 'middle-right'; you may want to set
1974
- * viewport.options.disableOnContextMenu if you want to use right-click dragging
1975
- * @param {string[]} [options.keyToPress=null] - array containing
1976
- * {@link key|https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code} codes of keys that can be
1977
- * pressed for the drag to be triggered, e.g.: ['ShiftLeft', 'ShiftRight'}.
1978
- * @param {boolean} [options.ignoreKeyToPressOnTouch=false] - ignore keyToPress for touch events
1979
- * @param {number} [options.lineHeight=20] - scaling factor for non-DOM_DELTA_PIXEL scrolling events
1980
- * @returns {Viewport} this
1981
- */
1982
1475
  drag(t) {
1983
1476
  return this.plugins.add("drag", new M(this, t)), this;
1984
1477
  }
1985
- /**
1986
- * Clamp to world boundaries or other provided boundaries
1987
- * There are three ways to clamp:
1988
- * 1. direction: 'all' = the world is clamped to its world boundaries, ie, you cannot drag any part of offscreen
1989
- * direction: 'x' | 'y' = only the x or y direction is clamped to its world boundary
1990
- * 2. left, right, top, bottom = true | number = the world is clamped to the world's pixel location for each side;
1991
- * if any of these are set to true, then the location is set to the boundary
1992
- * [0, viewport.worldWidth/viewport.worldHeight], eg: to allow the world to be completely dragged offscreen,
1993
- * set [-viewport.worldWidth, -viewport.worldHeight, viewport.worldWidth * 2, viewport.worldHeight * 2]
1994
- *
1995
- * Underflow determines what happens when the world is smaller than the viewport
1996
- * 1. none = the world is clamped but there is no special behavior
1997
- * 2. center = the world is centered on the viewport
1998
- * 3. combination of top/bottom/center and left/right/center (case insensitive) = the world is stuck to the
1999
- * appropriate boundaries
2000
- *
2001
- * NOTES:
2002
- * clamp is disabled if called with no options; use { direction: 'all' } for all edge clamping
2003
- * screenWidth, screenHeight, worldWidth, and worldHeight needs to be set for this to work properly
2004
- *
2005
- * @param {object} [options]
2006
- * @param {(number|boolean)} [options.left=false] - clamp left; true = 0
2007
- * @param {(number|boolean)} [options.right=false] - clamp right; true = viewport.worldWidth
2008
- * @param {(number|boolean)} [options.top=false] - clamp top; true = 0
2009
- * @param {(number|boolean)} [options.bottom=false] - clamp bottom; true = viewport.worldHeight
2010
- * @param {string} [direction] - (all, x, or y) using clamps of [0, viewport.worldWidth/viewport.worldHeight];
2011
- * replaces left/right/top/bottom if set
2012
- * @param {string} [underflow=center] - where to place world if too small for screen (e.g., top-right, center,
2013
- * none, bottomLeft) * @returns {Viewport} this
2014
- */
2015
1478
  clamp(t) {
2016
1479
  return this.plugins.add("clamp", new D(this, t)), this;
2017
1480
  }
2018
- /**
2019
- * Decelerate after a move
2020
- *
2021
- * NOTE: this fires 'moved' event during deceleration
2022
- *
2023
- * @param {IDecelerateOptions} [options]
2024
- * @param {number} [options.friction=0.95] - percent to decelerate after movement
2025
- * @param {number} [options.bounce=0.8] - percent to decelerate when past boundaries (only applicable when
2026
- * viewport.bounce() is active)
2027
- * @param {number} [options.minSpeed=0.01] - minimum velocity before stopping/reversing acceleration
2028
- * @return {Viewport} this
2029
- */
2030
1481
  decelerate(t) {
2031
1482
  return this.plugins.add("decelerate", new V(this, t)), this;
2032
1483
  }
2033
- /**
2034
- * Bounce on borders
2035
- * NOTES:
2036
- * screenWidth, screenHeight, worldWidth, and worldHeight needs to be set for this to work properly
2037
- * fires 'moved', 'bounce-x-start', 'bounce-y-start', 'bounce-x-end', and 'bounce-y-end' events
2038
- * @param {object} [options]
2039
- * @param {string} [options.sides=all] - all, horizontal, vertical, or combination of top, bottom, right, left
2040
- * (e.g., 'top-bottom-right')
2041
- * @param {number} [options.friction=0.5] - friction to apply to decelerate if active
2042
- * @param {number} [options.time=150] - time in ms to finish bounce
2043
- * @param {object} [options.bounceBox] - use this bounceBox instead of (0, 0, viewport.worldWidth, viewport.worldHeight)
2044
- * @param {number} [options.bounceBox.x=0]
2045
- * @param {number} [options.bounceBox.y=0]
2046
- * @param {number} [options.bounceBox.width=viewport.worldWidth]
2047
- * @param {number} [options.bounceBox.height=viewport.worldHeight]
2048
- * @param {string|function} [options.ease=easeInOutSine] - ease function or name
2049
- * (see http://easings.net/ for supported names)
2050
- * @param {string} [options.underflow=center] - (top/bottom/center and left/right/center, or center)
2051
- * where to place world if too small for screen
2052
- * @return {Viewport} this
2053
- */
2054
1484
  bounce(t) {
2055
1485
  return this.plugins.add("bounce", new _(this, t)), this;
2056
1486
  }
2057
- /**
2058
- * Enable pinch to zoom and two-finger touch to drag
2059
- *
2060
- * @param {PinchOptions} [options]
2061
- * @param {boolean} [options.noDrag] - disable two-finger dragging
2062
- * @param {number} [options.percent=1] - percent to modify pinch speed
2063
- * @param {number} [options.factor=1] - factor to multiply two-finger drag to increase the speed of movement
2064
- * @param {PIXI.Point} [options.center] - place this point at center during zoom instead of center of two fingers
2065
- * @param {('all'|'x'|'y')} [options.axis=all] - axis to zoom
2066
- * @return {Viewport} this
2067
- */
2068
1487
  pinch(t) {
2069
1488
  return this.plugins.add("pinch", new y(this, t)), this;
2070
1489
  }
2071
- /**
2072
- * Snap to a point
2073
- *
2074
- * @param {number} x
2075
- * @param {number} y
2076
- * @param {ISnapOptions} [options]
2077
- * @param {boolean} [options.topLeft] - snap to the top-left of viewport instead of center
2078
- * @param {number} [options.friction=0.8] - friction/frame to apply if decelerate is active
2079
- * @param {number} [options.time=1000] - time in ms to snap
2080
- * @param {string|function} [options.ease=easeInOutSine] - ease function or name (see http://easings.net/
2081
- * for supported names)
2082
- * @param {boolean} [options.interrupt=true] - pause snapping with any user input on the viewport
2083
- * @param {boolean} [options.removeOnComplete] - removes this plugin after snapping is complete
2084
- * @param {boolean} [options.removeOnInterrupt] - removes this plugin if interrupted by any user input
2085
- * @param {boolean} [options.forceStart] - starts the snap immediately regardless of whether the viewport is at
2086
- * the desired location
2087
- * @return {Viewport} this
2088
- */
2089
1490
  snap(t, e, n) {
2090
1491
  return this.plugins.add("snap", new Q(this, t, e, n)), this;
2091
1492
  }
2092
- /**
2093
- * Follow a target
2094
- *
2095
- * NOTES:
2096
- * uses the (x, y) as the center to follow; for PIXI.Sprite to work properly, use sprite.anchor.set(0.5)
2097
- * options.acceleration is not perfect as it doesn't know the velocity of the target. It adds acceleration
2098
- * to the start of movement and deceleration to the end of movement when the target is stopped.
2099
- * To cancel the follow, use: `viewport.plugins.remove('follow')`
2100
- *
2101
- * @fires 'moved' event
2102
- *
2103
- * @param {PIXI.DisplayObject} target to follow
2104
- * @param {IFollowOptions} [options]
2105
- * @param {number} [options.speed=0] - to follow in pixels/frame (0=teleport to location)
2106
- * @param {number} [options.acceleration] - set acceleration to accelerate and decelerate at this rate; speed
2107
- * cannot be 0 to use acceleration
2108
- * @param {number} [options.radius] - radius (in world coordinates) of center circle where movement is allowed
2109
- * without moving the viewport * @returns {Viewport} this
2110
- * @returns {Viewport} this
2111
- */
2112
1493
  follow(t, e) {
2113
1494
  return this.plugins.add("follow", new j(this, t, e)), this;
2114
1495
  }
2115
- /**
2116
- * Zoom using mouse wheel
2117
- *
2118
- * NOTE: the default event listener for 'wheel' event is document.body. Use `Viewport.options.divWheel` to
2119
- * change this default
2120
- *
2121
- * @param {IWheelOptions} [options]
2122
- * @param {number} [options.percent=0.1] - percent to scroll with each spin
2123
- * @param {number} [options.smooth] - smooth the zooming by providing the number of frames to zoom between wheel spins
2124
- * @param {boolean} [options.interrupt=true] - stop smoothing with any user input on the viewport
2125
- * @param {boolean} [options.reverse] - reverse the direction of the scroll
2126
- * @param {PIXI.Point} [options.center] - place this point at center during zoom instead of current mouse position
2127
- * @param {number} [options.lineHeight=20] - scaling factor for non-DOM_DELTA_PIXEL scrolling events
2128
- * @param {('all'|'x'|'y')} [options.axis=all] - axis to zoom
2129
- * @return {Viewport} this
2130
- */
2131
1496
  wheel(t) {
2132
- return this.plugins.add("wheel", new $(this, t)), this;
2133
- }
2134
- /**
2135
- * Animate the position and/or scale of the viewport
2136
- * To set the zoom level, use: (1) scale, (2) scaleX and scaleY, or (3) width and/or height
2137
- * @param {object} options
2138
- * @param {number} [options.time=1000] - time to animate
2139
- * @param {PIXI.Point} [options.position=viewport.center] - position to move viewport
2140
- * @param {number} [options.width] - desired viewport width in world pixels (use instead of scale;
2141
- * aspect ratio is maintained if height is not provided)
2142
- * @param {number} [options.height] - desired viewport height in world pixels (use instead of scale;
2143
- * aspect ratio is maintained if width is not provided)
2144
- * @param {number} [options.scale] - scale to change zoom (scale.x = scale.y)
2145
- * @param {number} [options.scaleX] - independently change zoom in x-direction
2146
- * @param {number} [options.scaleY] - independently change zoom in y-direction
2147
- * @param {(function|string)} [options.ease=linear] - easing function to use
2148
- * @param {function} [options.callbackOnComplete]
2149
- * @param {boolean} [options.removeOnInterrupt] removes this plugin if interrupted by any user input
2150
- * @returns {Viewport} this
2151
- */
1497
+ return this.plugins.add("wheel", new N(this, t)), this;
1498
+ }
2152
1499
  animate(t) {
2153
1500
  return this.plugins.add("animate", new u(this, t)), this;
2154
1501
  }
2155
- /**
2156
- * Enable clamping of zoom to constraints
2157
- *
2158
- * The minWidth/Height settings are how small the world can get (as it would appear on the screen)
2159
- * before clamping. The maxWidth/maxHeight is how larger the world can scale (as it would appear on
2160
- * the screen) before clamping.
2161
- *
2162
- * For example, if you have a world size of 1000 x 1000 and a screen size of 100 x 100, if you set
2163
- * minWidth/Height = 100 then the world will not be able to zoom smaller than the screen size (ie,
2164
- * zooming out so it appears smaller than the screen). Similarly, if you set maxWidth/Height = 100
2165
- * the world will not be able to zoom larger than the screen size (ie, zooming in so it appears
2166
- * larger than the screen).
2167
- *
2168
- * @param {object} [options]
2169
- * @param {number} [options.minWidth] - minimum width
2170
- * @param {number} [options.minHeight] - minimum height
2171
- * @param {number} [options.maxWidth] - maximum width
2172
- * @param {number} [options.maxHeight] - maximum height
2173
- * @param {number} [options.minScale] - minimum scale
2174
- * @param {number} [options.maxScale] - minimum scale
2175
- * @return {Viewport} this
2176
- */
2177
1502
  clampZoom(t) {
2178
1503
  return this.plugins.add("clamp-zoom", new L(this, t)), this;
2179
1504
  }
2180
- /**
2181
- * Scroll viewport when mouse hovers near one of the edges or radius-distance from center of screen.
2182
- *
2183
- * NOTES: fires 'moved' event; there's a known bug where the mouseEdges does not work properly with "windowed" viewports
2184
- *
2185
- * @param {IMouseEdgesOptions} [options]
2186
- * @param {number} [options.radius] - distance from center of screen in screen pixels
2187
- * @param {number} [options.distance] - distance from all sides in screen pixels
2188
- * @param {number} [options.top] - alternatively, set top distance (leave unset for no top scroll)
2189
- * @param {number} [options.bottom] - alternatively, set bottom distance (leave unset for no top scroll)
2190
- * @param {number} [options.left] - alternatively, set left distance (leave unset for no top scroll)
2191
- * @param {number} [options.right] - alternatively, set right distance (leave unset for no top scroll)
2192
- * @param {number} [options.speed=8] - speed in pixels/frame to scroll viewport
2193
- * @param {boolean} [options.reverse] - reverse direction of scroll
2194
- * @param {boolean} [options.noDecelerate] - don't use decelerate plugin even if it's installed
2195
- * @param {boolean} [options.linear] - if using radius, use linear movement (+/- 1, +/- 1) instead of angled
2196
- * movement (Math.cos(angle from center), Math.sin(angle from center))
2197
- * @param {boolean} [options.allowButtons] allows plugin to continue working even when there's a mousedown event
2198
- */
2199
1505
  mouseEdges(t) {
2200
- return this.plugins.add("mouse-edges", new Z(this, t)), this;
1506
+ return this.plugins.add("mouse-edges", new q(this, t)), this;
2201
1507
  }
2202
- /** Pause viewport (including animation updates such as decelerate) */
2203
1508
  get pause() {
2204
1509
  return !!this._pause;
2205
1510
  }
2206
1511
  set pause(t) {
2207
1512
  this._pause = t, this.lastViewport = null, this.moving = !1, this.zooming = !1, t && this.input.pause();
2208
1513
  }
2209
- /**
2210
- * Move the viewport so the bounding box is visible
2211
- *
2212
- * @param x - left
2213
- * @param y - top
2214
- * @param width
2215
- * @param height
2216
- * @param resizeToFit - Resize the viewport so the box fits within the viewport
2217
- */
2218
1514
  ensureVisible(t, e, n, i, s) {
2219
1515
  s && (n > this.worldScreenWidth || i > this.worldScreenHeight) && (this.fit(!0, n, i), this.emit("zoomed", { viewport: this, type: "ensureVisible" }));
2220
1516
  let h = !1;
@@ -2229,14 +1525,14 @@ export {
2229
1525
  V as Decelerate,
2230
1526
  M as Drag,
2231
1527
  j as Follow,
2232
- J as InputManager,
2233
- Z as MouseEdges,
1528
+ $ as InputManager,
1529
+ q as MouseEdges,
2234
1530
  y as Pinch,
2235
1531
  d as Plugin,
2236
1532
  tt as PluginManager,
2237
1533
  Q as Snap,
2238
1534
  G as SnapZoom,
2239
1535
  C as Viewport,
2240
- $ as Wheel
1536
+ N as Wheel
2241
1537
  };
2242
- //# sourceMappingURL=viewport.es-3ce16114-fbed2709.mjs.map
1538
+ //# sourceMappingURL=viewport.es-88169ec4-4c6f68e7.mjs.map