@dnd-kit/dom 0.0.3 → 0.0.4-beta-20240621131401

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.
package/index.cjs CHANGED
@@ -6,16 +6,82 @@ var utilities = require('@dnd-kit/dom/utilities');
6
6
  var geometry = require('@dnd-kit/geometry');
7
7
  var collision = require('@dnd-kit/collision');
8
8
 
9
+ var __create = Object.create;
9
10
  var __defProp = Object.defineProperty;
10
- var __decorateClass = (decorators, target, key, kind) => {
11
- var result = void 0 ;
12
- for (var i = decorators.length - 1, decorator; i >= 0; i--)
13
- if (decorator = decorators[i])
14
- result = (decorator(target, key, result) ) || result;
15
- if (result)
16
- __defProp(target, key, result);
17
- return result;
11
+ var __defProps = Object.defineProperties;
12
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
13
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
14
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
15
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
16
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
17
+ var __knownSymbol = (name, symbol) => (symbol = Symbol[name]) ? symbol : Symbol.for("Symbol." + name);
18
+ var __typeError = (msg) => {
19
+ throw TypeError(msg);
18
20
  };
21
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
22
+ var __spreadValues = (a, b) => {
23
+ for (var prop in b || (b = {}))
24
+ if (__hasOwnProp.call(b, prop))
25
+ __defNormalProp(a, prop, b[prop]);
26
+ if (__getOwnPropSymbols)
27
+ for (var prop of __getOwnPropSymbols(b)) {
28
+ if (__propIsEnum.call(b, prop))
29
+ __defNormalProp(a, prop, b[prop]);
30
+ }
31
+ return a;
32
+ };
33
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
34
+ var __objRest = (source, exclude) => {
35
+ var target = {};
36
+ for (var prop in source)
37
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
38
+ target[prop] = source[prop];
39
+ if (source != null && __getOwnPropSymbols)
40
+ for (var prop of __getOwnPropSymbols(source)) {
41
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
42
+ target[prop] = source[prop];
43
+ }
44
+ return target;
45
+ };
46
+ var __decoratorStart = (base) => {
47
+ var _a3;
48
+ return [, , , __create((_a3 = base == null ? void 0 : base[__knownSymbol("metadata")]) != null ? _a3 : null)];
49
+ };
50
+ var __decoratorStrings = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"];
51
+ var __expectFn = (fn) => fn !== void 0 && typeof fn !== "function" ? __typeError("Function expected") : fn;
52
+ var __decoratorContext = (kind, name, done, metadata, fns) => ({ kind: __decoratorStrings[kind], name, metadata, addInitializer: (fn) => done._ ? __typeError("Already initialized") : fns.push(__expectFn(fn || null)) });
53
+ var __decoratorMetadata = (array, target) => __defNormalProp(target, __knownSymbol("metadata"), array[3]);
54
+ var __runInitializers = (array, flags, self, value) => {
55
+ for (var i = 0, fns = array[flags >> 1], n = fns && fns.length; i < n; i++) flags & 1 ? fns[i].call(self) : value = fns[i].call(self, value);
56
+ return value;
57
+ };
58
+ var __decorateElement = (array, flags, name, decorators, target, extra) => {
59
+ var fn, it, done, ctx, access, k = flags & 7, s = !!(flags & 8), p = !!(flags & 16);
60
+ var j = array.length + 1 , key = __decoratorStrings[k + 5];
61
+ var initializers = (array[j - 1] = []), extraInitializers = array[j] || (array[j] = []);
62
+ var desc = ((target = target.prototype), __getOwnPropDesc({ get [name]() {
63
+ return __privateGet(this, extra);
64
+ }, set [name](x) {
65
+ return __privateSet(this, extra, x);
66
+ } }, name));
67
+ for (var i = decorators.length - 1; i >= 0; i--) {
68
+ ctx = __decoratorContext(k, name, done = {}, array[3], extraInitializers);
69
+ {
70
+ ctx.static = s, ctx.private = p, access = ctx.access = { has: (x) => name in x };
71
+ access.get = (x) => x[name];
72
+ access.set = (x, y) => x[name] = y;
73
+ }
74
+ it = (0, decorators[i])({ get: desc.get, set: desc.set } , ctx), done._ = 1;
75
+ if (it === void 0) __expectFn(it) && (desc[key] = it );
76
+ else if (typeof it !== "object" || it === null) __typeError("Object expected");
77
+ else __expectFn(fn = it.get) && (desc.get = fn), __expectFn(fn = it.set) && (desc.set = fn), __expectFn(fn = it.init) && initializers.unshift(fn);
78
+ }
79
+ return desc && __defProp(target, name, desc), target;
80
+ };
81
+ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
82
+ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
83
+ var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
84
+ var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
19
85
 
20
86
  // src/core/plugins/accessibility/defaults.ts
21
87
  var defaultAttributes = {
@@ -30,21 +96,18 @@ var defaultScreenReaderInstructions = {
30
96
  };
31
97
  var defaultAnnouncements = {
32
98
  dragstart({ operation: { source } }) {
33
- if (!source)
34
- return;
99
+ if (!source) return;
35
100
  return `Picked up draggable item ${source.id}.`;
36
101
  },
37
102
  dragover({ operation: { source, target } }) {
38
- if (!source)
39
- return;
103
+ if (!source) return;
40
104
  if (target) {
41
105
  return `Draggable item ${source.id} was moved over droppable target ${target.id}.`;
42
106
  }
43
107
  return `Draggable item ${source.id} is no longer over a droppable target.`;
44
108
  },
45
109
  dragend({ operation: { source, target }, canceled }) {
46
- if (!source)
47
- return;
110
+ if (!source) return;
48
111
  if (canceled) {
49
112
  return `Dragging was cancelled. Draggable item ${source.id} was dropped.`;
50
113
  }
@@ -107,7 +170,7 @@ var Accessibility = class extends abstract.Plugin {
107
170
  } = {},
108
171
  announcements = defaultAnnouncements,
109
172
  screenReaderInstructions = defaultScreenReaderInstructions
110
- } = options ?? {};
173
+ } = options != null ? options : {};
111
174
  const descriptionId = id ? `${descriptionPrefix}-${id}` : generateUniqueId(descriptionPrefix);
112
175
  const announcementId = id ? `${announcementPrefix}-${id}` : generateUniqueId(announcementPrefix);
113
176
  let hiddenTextElement;
@@ -117,7 +180,7 @@ var Accessibility = class extends abstract.Plugin {
117
180
  return this.manager.monitor.addEventListener(
118
181
  eventName,
119
182
  (event, manager2) => {
120
- const announcement = getAnnouncement?.(event, manager2);
183
+ const announcement = getAnnouncement == null ? void 0 : getAnnouncement(event, manager2);
121
184
  if (announcement && liveRegionElement) {
122
185
  liveRegionElement.innerText = announcement;
123
186
  }
@@ -136,7 +199,7 @@ var Accessibility = class extends abstract.Plugin {
136
199
  const cleanupEffects = state.effects(() => {
137
200
  for (const draggable of manager.registry.draggables.value) {
138
201
  const { element, handle } = draggable;
139
- const activator = handle ?? element;
202
+ const activator = handle != null ? handle : element;
140
203
  if (activator) {
141
204
  if (!hiddenTextElement || !liveRegionElement) {
142
205
  initialize();
@@ -164,8 +227,8 @@ var Accessibility = class extends abstract.Plugin {
164
227
  }
165
228
  }
166
229
  this.destroy = () => {
167
- hiddenTextElement?.remove();
168
- liveRegionElement?.remove();
230
+ hiddenTextElement == null ? void 0 : hiddenTextElement.remove();
231
+ liveRegionElement == null ? void 0 : liveRegionElement.remove();
169
232
  eventListeners.forEach((unsubscribe) => unsubscribe());
170
233
  cleanupEffects();
171
234
  };
@@ -177,8 +240,9 @@ var Cursor = class extends abstract.Plugin {
177
240
  super(manager, options);
178
241
  this.manager = manager;
179
242
  this.destroy = state.effect(() => {
243
+ var _a3;
180
244
  const { dragOperation } = this.manager;
181
- const { cursor = "grabbing" } = this.options ?? {};
245
+ const { cursor = "grabbing" } = (_a3 = this.options) != null ? _a3 : {};
182
246
  if (dragOperation.status.initialized) {
183
247
  const style = document.createElement("style");
184
248
  style.innerText = `* { cursor: ${cursor} !important; }`;
@@ -193,7 +257,7 @@ var Cursor = class extends abstract.Plugin {
193
257
  var ATTR_PREFIX = "data-dnd-";
194
258
  var CSS_PREFIX = "--dnd-";
195
259
  var ATTRIBUTE = `${ATTR_PREFIX}dragging`;
196
- var cssRules = `[${ATTRIBUTE}] {position: fixed !important; pointer-events: none !important; touch-action: none !important; z-index: calc(infinity); will-change: transform;top: var(${CSS_PREFIX}top, 0px) !important;left: var(${CSS_PREFIX}left, 0px) !important;width: var(${CSS_PREFIX}width, auto) !important;height: var(${CSS_PREFIX}height, auto) !important;}[${ATTRIBUTE}][style*="${CSS_PREFIX}translate"] {translate: var(${CSS_PREFIX}translate) !important;}[style*="${CSS_PREFIX}transition"] {transition: var(${CSS_PREFIX}transition) !important;}*:where([${ATTRIBUTE}][popover]){overflow:visible;background:var(${CSS_PREFIX}background);border:var(${CSS_PREFIX}border);margin:unset;padding:unset;color:inherit;}[${ATTRIBUTE}]::backdrop {display: none}`;
260
+ var cssRules = `[${ATTRIBUTE}] {position: fixed !important; pointer-events: none !important; touch-action: none !important; z-index: calc(infinity); will-change: transform;top: var(${CSS_PREFIX}top, 0px) !important;left: var(${CSS_PREFIX}left, 0px) !important;width: var(${CSS_PREFIX}width, auto) !important;height: var(${CSS_PREFIX}height, auto) !important;}[${ATTRIBUTE}] *{pointer-events: none !important;}[${ATTRIBUTE}][style*="${CSS_PREFIX}translate"] {translate: var(${CSS_PREFIX}translate) !important;}[style*="${CSS_PREFIX}transition"] {transition: var(${CSS_PREFIX}transition) !important;}*:where([${ATTRIBUTE}][popover]){overflow:visible;background:var(${CSS_PREFIX}background);border:var(${CSS_PREFIX}border);margin:unset;padding:unset;color:inherit;}[${ATTRIBUTE}]::backdrop {display: none}`;
197
261
  var PLACEHOLDER_ATTRIBUTE = `${ATTR_PREFIX}placeholder`;
198
262
  var IGNORED_ATTRIBUTES = [ATTRIBUTE, PLACEHOLDER_ATTRIBUTE, "popover"];
199
263
  var IGNORED_STYLES = ["view-transition-name"];
@@ -215,6 +279,7 @@ var Feedback = class extends abstract.Plugin {
215
279
  }
216
280
  });
217
281
  const cleanupEffect = state.effect(() => {
282
+ var _a3;
218
283
  const { dragOperation } = manager;
219
284
  const { position, source, status } = dragOperation;
220
285
  if (status.idle) {
@@ -224,11 +289,9 @@ var Feedback = class extends abstract.Plugin {
224
289
  initialTranslate = { x: 0, y: 0 };
225
290
  return;
226
291
  }
227
- if (!source)
228
- return;
292
+ if (!source) return;
229
293
  const { element, feedback } = source;
230
- if (!element || feedback === "none")
231
- return;
294
+ if (!element || feedback === "none") return;
232
295
  const shape = new utilities.DOMRectangle(element, true);
233
296
  const { width, height, top, left } = shape;
234
297
  const styles = new utilities.Styles(element);
@@ -281,8 +344,7 @@ var Feedback = class extends abstract.Plugin {
281
344
  },
282
345
  CSS_PREFIX
283
346
  );
284
- if (placeholder)
285
- element.insertAdjacentElement("afterend", placeholder);
347
+ if (placeholder) element.insertAdjacentElement("afterend", placeholder);
286
348
  if (utilities.supportsPopover(element)) {
287
349
  if (!element.hasAttribute("popover")) {
288
350
  element.setAttribute("popover", "");
@@ -307,10 +369,9 @@ var Feedback = class extends abstract.Plugin {
307
369
  offset.top = 0;
308
370
  }
309
371
  const resizeObserver = new ResizeObserver(() => {
310
- if (!placeholder)
311
- return;
372
+ if (!placeholder) return;
312
373
  const placeholderShape = new utilities.DOMRectangle(placeholder, true);
313
- const origin = transformOrigin ?? { x: 1, y: 1 };
374
+ const origin = transformOrigin != null ? transformOrigin : { x: 1, y: 1 };
314
375
  const dX = (width - placeholderShape.width) * origin.x + delta.x;
315
376
  const dY = (height - placeholderShape.height) * origin.y + delta.y;
316
377
  styles.set(
@@ -387,6 +448,7 @@ var Feedback = class extends abstract.Plugin {
387
448
  });
388
449
  }
389
450
  const cleanupEffect2 = state.effect(function updateTransform() {
451
+ var _a4, _b2;
390
452
  const { transform, status: status2 } = dragOperation;
391
453
  if (!transform.x && !transform.y && !moved) {
392
454
  return;
@@ -407,8 +469,8 @@ var Feedback = class extends abstract.Plugin {
407
469
  CSS_PREFIX
408
470
  );
409
471
  dragOperation.shape = shape2.translate(
410
- x - (currentTransform?.x ?? 0),
411
- y - (currentTransform?.y ?? 0)
472
+ x - ((_a4 = currentTransform == null ? void 0 : currentTransform.x) != null ? _a4 : 0),
473
+ y - ((_b2 = currentTransform == null ? void 0 : currentTransform.y) != null ? _b2 : 0)
412
474
  );
413
475
  currentTransform = {
414
476
  x,
@@ -419,26 +481,27 @@ var Feedback = class extends abstract.Plugin {
419
481
  };
420
482
  }
421
483
  });
422
- const id = manager.dragOperation.source?.id;
484
+ const id = (_a3 = manager.dragOperation.source) == null ? void 0 : _a3.id;
423
485
  const restoreFocus = () => {
486
+ var _a4;
424
487
  if (!isKeyboardOperation || id == null) {
425
488
  return;
426
489
  }
427
490
  const draggable = manager.registry.draggables.get(id);
428
- const element2 = draggable?.handle ?? draggable?.element;
491
+ const element2 = (_a4 = draggable == null ? void 0 : draggable.handle) != null ? _a4 : draggable == null ? void 0 : draggable.element;
429
492
  if (element2 instanceof HTMLElement) {
430
493
  element2.focus();
431
494
  }
432
495
  };
433
496
  let cleanup = () => {
434
- elementMutationObserver?.disconnect();
435
- documentMutationObserver?.disconnect();
497
+ elementMutationObserver == null ? void 0 : elementMutationObserver.disconnect();
498
+ documentMutationObserver == null ? void 0 : documentMutationObserver.disconnect();
436
499
  resizeObserver.disconnect();
437
500
  styles.reset();
438
501
  if (moved && element.isConnected) {
439
- placeholder?.replaceWith(element);
502
+ placeholder == null ? void 0 : placeholder.replaceWith(element);
440
503
  }
441
- placeholder?.remove();
504
+ placeholder == null ? void 0 : placeholder.remove();
442
505
  element.removeAttribute(ATTRIBUTE);
443
506
  if (utilities.supportsPopover(element)) {
444
507
  element.removeAttribute("popover");
@@ -456,12 +519,13 @@ var Feedback = class extends abstract.Plugin {
456
519
  cleanup = void 0;
457
520
  const transform = currentTransform;
458
521
  if (!transform) {
459
- onComplete?.();
522
+ onComplete == null ? void 0 : onComplete();
460
523
  return;
461
524
  }
462
525
  manager.renderer.rendering.then(() => {
526
+ var _a4;
463
527
  utilities.showPopover(element);
464
- const target = placeholder ?? element;
528
+ const target = placeholder != null ? placeholder : element;
465
529
  styles.remove(["translate"], CSS_PREFIX);
466
530
  const shape2 = new utilities.DOMRectangle(target);
467
531
  const currentShape = new utilities.DOMRectangle(element, true).translate(
@@ -481,7 +545,7 @@ var Feedback = class extends abstract.Plugin {
481
545
  element,
482
546
  keyframes: {
483
547
  translate: [
484
- `${transform.x}px ${transform.y}px ${transform.z ?? 0}`,
548
+ `${transform.x}px ${transform.y}px ${(_a4 = transform.z) != null ? _a4 : 0}`,
485
549
  `${final.x}px ${final.y}px ${final.z}`
486
550
  ]
487
551
  },
@@ -491,31 +555,29 @@ var Feedback = class extends abstract.Plugin {
491
555
  },
492
556
  onFinish() {
493
557
  requestAnimationFrame(restoreFocus);
494
- onComplete?.();
558
+ onComplete == null ? void 0 : onComplete();
495
559
  }
496
560
  });
497
561
  });
498
562
  }
499
563
  });
500
- return () => cleanup?.();
564
+ return () => cleanup == null ? void 0 : cleanup();
501
565
  });
502
566
  this.destroy = () => {
503
567
  styleInjectionCleanup();
504
568
  cleanupEffect();
505
- style?.remove();
569
+ style == null ? void 0 : style.remove();
506
570
  };
507
571
  }
508
572
  };
509
573
  var LOCKED = true;
510
574
  var UNLOCKED = false;
511
- var _a, _b;
575
+ var _dec, _a, _dec2, _b, _init, __b, __a;
576
+ _b = (_dec2 = [state.reactive], utilities.ScrollDirection.Forward), _a = (_dec = [state.reactive], utilities.ScrollDirection.Reverse);
512
577
  var ScrollLock = class {
513
578
  constructor() {
514
- this[_a] = LOCKED;
515
- this[_b] = LOCKED;
516
- }
517
- static {
518
- _a = utilities.ScrollDirection.Forward, _b = utilities.ScrollDirection.Reverse;
579
+ __privateAdd(this, __b, __runInitializers(_init, 8, this, LOCKED)), __runInitializers(_init, 11, this);
580
+ __privateAdd(this, __a, __runInitializers(_init, 12, this, LOCKED)), __runInitializers(_init, 15, this);
519
581
  }
520
582
  isLocked(direction) {
521
583
  if (direction === utilities.ScrollDirection.Idle) {
@@ -533,12 +595,12 @@ var ScrollLock = class {
533
595
  this[direction] = UNLOCKED;
534
596
  }
535
597
  };
536
- __decorateClass([
537
- state.reactive
538
- ], ScrollLock.prototype, _a);
539
- __decorateClass([
540
- state.reactive
541
- ], ScrollLock.prototype, _b);
598
+ _init = __decoratorStart(null);
599
+ __b = new WeakMap();
600
+ __a = new WeakMap();
601
+ __decorateElement(_init, 4, _b, _dec2, ScrollLock, __b);
602
+ __decorateElement(_init, 4, _a, _dec, ScrollLock, __a);
603
+ __decoratorMetadata(_init, ScrollLock);
542
604
 
543
605
  // src/core/plugins/scrolling/ScrollIntent.ts
544
606
  var DIRECTIONS = [utilities.ScrollDirection.Forward, utilities.ScrollDirection.Reverse];
@@ -594,36 +656,39 @@ function getDirection(a, b) {
594
656
  }
595
657
 
596
658
  // src/core/plugins/scrolling/Scroller.ts
597
- var Scroller = class extends abstract.CorePlugin {
659
+ var _autoScrolling_dec, _a2, _init2, _autoScrolling, _meta, _scroll;
660
+ var Scroller = class extends (_a2 = abstract.CorePlugin, _autoScrolling_dec = [state.reactive], _a2) {
598
661
  constructor(manager) {
599
662
  super(manager);
600
- this.autoScrolling = false;
601
- this.#scroll = () => {
602
- if (!this.#meta) {
663
+ __privateAdd(this, _autoScrolling, __runInitializers(_init2, 8, this, false)), __runInitializers(_init2, 11, this);
664
+ __privateAdd(this, _meta);
665
+ __privateAdd(this, _scroll, () => {
666
+ if (!__privateGet(this, _meta)) {
603
667
  return;
604
668
  }
605
- const { element, by } = this.#meta;
669
+ const { element, by } = __privateGet(this, _meta);
606
670
  element.scrollBy(by.x, by.y);
607
- };
671
+ });
608
672
  this.scroll = (options) => {
673
+ var _a3;
609
674
  if (this.disabled) {
610
675
  return false;
611
676
  }
612
677
  const elements = this.getScrollableElements();
613
678
  if (!elements) {
614
- this.#meta = void 0;
679
+ __privateSet(this, _meta, void 0);
615
680
  return false;
616
681
  }
617
682
  const { position } = this.manager.dragOperation;
618
- const currentPosition = position?.current;
683
+ const currentPosition = position == null ? void 0 : position.current;
619
684
  if (currentPosition) {
620
- const { by } = options ?? {};
685
+ const { by } = options != null ? options : {};
621
686
  const intent = by ? {
622
687
  x: getScrollIntent(by.x),
623
688
  y: getScrollIntent(by.y)
624
689
  } : void 0;
625
690
  const scrollIntent = intent ? void 0 : this.scrollIntentTracker.current;
626
- if (scrollIntent?.isLocked()) {
691
+ if (scrollIntent == null ? void 0 : scrollIntent.isLocked()) {
627
692
  return false;
628
693
  }
629
694
  for (const scrollableElement of elements) {
@@ -643,36 +708,36 @@ var Scroller = class extends abstract.CorePlugin {
643
708
  }
644
709
  }
645
710
  if (direction.x || direction.y) {
646
- const { x, y } = by ?? direction;
711
+ const { x, y } = by != null ? by : direction;
647
712
  const scrollLeftBy = x * speed.x;
648
713
  const scrollTopBy = y * speed.y;
649
714
  if (scrollLeftBy || scrollTopBy) {
650
- const previousScrollBy = this.#meta?.by;
715
+ const previousScrollBy = (_a3 = __privateGet(this, _meta)) == null ? void 0 : _a3.by;
651
716
  if (this.autoScrolling && previousScrollBy) {
652
717
  const scrollIntentMismatch = previousScrollBy.x && !scrollLeftBy || previousScrollBy.y && !scrollTopBy;
653
- if (scrollIntentMismatch)
654
- continue;
718
+ if (scrollIntentMismatch) continue;
655
719
  }
656
- this.#meta = {
720
+ __privateSet(this, _meta, {
657
721
  element: scrollableElement,
658
722
  by: {
659
723
  x: scrollLeftBy,
660
724
  y: scrollTopBy
661
725
  }
662
- };
663
- utilities.scheduler.schedule(this.#scroll);
726
+ });
727
+ utilities.scheduler.schedule(__privateGet(this, _scroll));
664
728
  return true;
665
729
  }
666
730
  }
667
731
  }
668
732
  }
669
733
  }
670
- this.#meta = void 0;
734
+ __privateSet(this, _meta, void 0);
671
735
  return false;
672
736
  };
673
737
  let previousElementFromPoint = null;
674
738
  let previousScrollableElements = null;
675
739
  const elementFromPoint = state.computed(() => {
740
+ var _a3;
676
741
  const { position } = manager.dragOperation;
677
742
  if (!position) {
678
743
  return null;
@@ -682,13 +747,13 @@ var Scroller = class extends abstract.CorePlugin {
682
747
  if (element) {
683
748
  previousElementFromPoint = element;
684
749
  }
685
- return document.elementFromPoint(x, y) ?? previousElementFromPoint;
750
+ return (_a3 = document.elementFromPoint(x, y)) != null ? _a3 : previousElementFromPoint;
686
751
  });
687
752
  const scrollableElements = state.computed(() => {
688
753
  const element = elementFromPoint.value;
689
754
  if (!element || element === document.documentElement) {
690
755
  const { target } = manager.dragOperation;
691
- const targetElement = target?.element;
756
+ const targetElement = target == null ? void 0 : target.element;
692
757
  if (targetElement) {
693
758
  const elements = utilities.getScrollableAncestors(targetElement, {
694
759
  excludeElement: false
@@ -701,7 +766,7 @@ var Scroller = class extends abstract.CorePlugin {
701
766
  const elements = utilities.getScrollableAncestors(element, {
702
767
  excludeElement: false
703
768
  });
704
- if (this.autoScrolling && previousScrollableElements && elements.size < previousScrollableElements?.size) {
769
+ if (this.autoScrolling && previousScrollableElements && elements.size < (previousScrollableElements == null ? void 0 : previousScrollableElements.size)) {
705
770
  return previousScrollableElements;
706
771
  }
707
772
  previousScrollableElements = elements;
@@ -723,12 +788,13 @@ var Scroller = class extends abstract.CorePlugin {
723
788
  }
724
789
  });
725
790
  }
726
- #meta;
727
- #scroll;
728
791
  };
729
- __decorateClass([
730
- state.reactive
731
- ], Scroller.prototype, "autoScrolling");
792
+ _init2 = __decoratorStart(_a2);
793
+ _autoScrolling = new WeakMap();
794
+ _meta = new WeakMap();
795
+ _scroll = new WeakMap();
796
+ __decorateElement(_init2, 4, "autoScrolling", _autoScrolling_dec, Scroller, _autoScrolling);
797
+ __decoratorMetadata(_init2, Scroller);
732
798
  function getScrollIntent(value) {
733
799
  if (value > 0) {
734
800
  return utilities.ScrollDirection.Forward;
@@ -770,15 +836,17 @@ var listenerOptions = {
770
836
  capture: true,
771
837
  passive: true
772
838
  };
839
+ var _timeout;
773
840
  var ScrollListener = class extends abstract.CorePlugin {
774
841
  constructor(manager) {
775
842
  super(manager);
843
+ __privateAdd(this, _timeout);
776
844
  this.handleScroll = () => {
777
- if (this.#timeout == null) {
778
- this.#timeout = setTimeout(() => {
845
+ if (__privateGet(this, _timeout) == null) {
846
+ __privateSet(this, _timeout, setTimeout(() => {
779
847
  this.manager.collisionObserver.forceUpdate();
780
- this.#timeout = void 0;
781
- }, 50);
848
+ __privateSet(this, _timeout, void 0);
849
+ }, 50));
782
850
  }
783
851
  };
784
852
  const { dragOperation } = this.manager;
@@ -796,8 +864,8 @@ var ScrollListener = class extends abstract.CorePlugin {
796
864
  }
797
865
  });
798
866
  }
799
- #timeout;
800
867
  };
868
+ _timeout = new WeakMap();
801
869
  var PreventSelection = class extends abstract.Plugin {
802
870
  constructor(manager) {
803
871
  super(manager);
@@ -822,7 +890,8 @@ var PreventSelection = class extends abstract.Plugin {
822
890
  }
823
891
  };
824
892
  function removeSelection() {
825
- document.getSelection()?.removeAllRanges();
893
+ var _a3;
894
+ (_a3 = document.getSelection()) == null ? void 0 : _a3.removeAllRanges();
826
895
  }
827
896
  var DEFAULT_KEYBOARD_CODES = {
828
897
  start: ["Space", "Enter"],
@@ -834,12 +903,13 @@ var DEFAULT_KEYBOARD_CODES = {
834
903
  right: ["ArrowRight"]
835
904
  };
836
905
  var DEFAULT_OFFSET = 10;
906
+ var _cleanupFunctions;
837
907
  var KeyboardSensor = class extends abstract.Sensor {
838
908
  constructor(manager, options) {
839
909
  super(manager);
840
910
  this.manager = manager;
841
911
  this.options = options;
842
- this.#cleanupFunctions = [];
912
+ __privateAdd(this, _cleanupFunctions, []);
843
913
  this.listeners = new utilities.Listeners();
844
914
  this.handleSourceKeyDown = (event, source, options) => {
845
915
  if (this.disabled || event.defaultPrevented) {
@@ -851,7 +921,7 @@ var KeyboardSensor = class extends abstract.Sensor {
851
921
  if (source.disabled || !source.element) {
852
922
  return;
853
923
  }
854
- const { keyboardCodes = DEFAULT_KEYBOARD_CODES } = options ?? {};
924
+ const { keyboardCodes = DEFAULT_KEYBOARD_CODES } = options != null ? options : {};
855
925
  if (!keyboardCodes.start.includes(event.code)) {
856
926
  return;
857
927
  }
@@ -861,10 +931,10 @@ var KeyboardSensor = class extends abstract.Sensor {
861
931
  this.handleStart(event, source, options);
862
932
  };
863
933
  }
864
- #cleanupFunctions;
865
934
  bind(source, options = this.options) {
866
935
  const unbind = state.effect(() => {
867
- const target = source.handle ?? source.element;
936
+ var _a3;
937
+ const target = (_a3 = source.handle) != null ? _a3 : source.element;
868
938
  const listener = (event) => {
869
939
  if (event instanceof KeyboardEvent) {
870
940
  this.handleSourceKeyDown(event, source, options);
@@ -913,10 +983,10 @@ var KeyboardSensor = class extends abstract.Sensor {
913
983
  { type: "resize", listener: () => this.handleEnd(true) }
914
984
  ])
915
985
  ];
916
- this.#cleanupFunctions.push(...listeners);
986
+ __privateGet(this, _cleanupFunctions).push(...listeners);
917
987
  }
918
988
  handleKeyDown(event, _source, options) {
919
- const { keyboardCodes = DEFAULT_KEYBOARD_CODES } = options ?? {};
989
+ const { keyboardCodes = DEFAULT_KEYBOARD_CODES } = options != null ? options : {};
920
990
  if (isKeycode(event, [...keyboardCodes.end, ...keyboardCodes.cancel])) {
921
991
  event.preventDefault();
922
992
  const canceled = isKeycode(event, keyboardCodes.cancel);
@@ -964,7 +1034,7 @@ var KeyboardSensor = class extends abstract.Sensor {
964
1034
  offset = { x: DEFAULT_OFFSET * factor, y: 0 };
965
1035
  break;
966
1036
  }
967
- if (offset?.x || offset?.y) {
1037
+ if ((offset == null ? void 0 : offset.x) || (offset == null ? void 0 : offset.y)) {
968
1038
  event.preventDefault();
969
1039
  this.manager.actions.move({
970
1040
  by: offset
@@ -973,36 +1043,42 @@ var KeyboardSensor = class extends abstract.Sensor {
973
1043
  }
974
1044
  sideEffects() {
975
1045
  const autoScroller = this.manager.registry.plugins.get(AutoScroller);
976
- if (autoScroller?.disabled === false) {
1046
+ if ((autoScroller == null ? void 0 : autoScroller.disabled) === false) {
977
1047
  autoScroller.disable();
978
- this.#cleanupFunctions.push(() => {
1048
+ __privateGet(this, _cleanupFunctions).push(() => {
979
1049
  autoScroller.enable();
980
1050
  });
981
1051
  }
982
1052
  }
983
1053
  cleanup() {
984
- this.#cleanupFunctions.forEach((cleanup) => cleanup());
1054
+ __privateGet(this, _cleanupFunctions).forEach((cleanup) => cleanup());
985
1055
  }
986
1056
  destroy() {
987
1057
  this.cleanup();
988
1058
  this.listeners.clear();
989
1059
  }
990
1060
  };
1061
+ _cleanupFunctions = new WeakMap();
991
1062
  function isKeycode(event, codes) {
992
1063
  return codes.includes(event.code);
993
1064
  }
994
- var PointerSensor = class _PointerSensor extends abstract.Sensor {
1065
+ var _clearTimeout;
1066
+ var _PointerSensor = class _PointerSensor extends abstract.Sensor {
995
1067
  constructor(manager, options) {
996
1068
  super(manager);
997
1069
  this.manager = manager;
998
1070
  this.options = options;
999
1071
  this.listeners = new utilities.Listeners();
1000
1072
  this.cleanup = /* @__PURE__ */ new Set();
1073
+ __privateAdd(this, _clearTimeout);
1074
+ this.handleCancel = this.handleCancel.bind(this);
1075
+ this.handlePointerUp = this.handlePointerUp.bind(this);
1076
+ this.handleKeyDown = this.handleKeyDown.bind(this);
1001
1077
  }
1002
- #clearTimeout;
1003
1078
  bind(source, options = this.options) {
1004
1079
  const unbind = state.effect(() => {
1005
- const target = source.handle ?? source.element;
1080
+ var _a3;
1081
+ const target = (_a3 = source.handle) != null ? _a3 : source.element;
1006
1082
  const listener = (event) => {
1007
1083
  if (event instanceof PointerEvent) {
1008
1084
  this.handlePointerDown(event, source, options);
@@ -1019,15 +1095,11 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1019
1095
  return unbind;
1020
1096
  }
1021
1097
  handlePointerDown(event, source, options = {}) {
1022
- if (this.disabled) {
1023
- return;
1024
- }
1025
- if (!event.isPrimary || event.button !== 0 || !(event.target instanceof Element)) {
1026
- return;
1027
- }
1028
- if (source.disabled) {
1098
+ if (this.disabled || !event.isPrimary || event.button !== 0 || !(event.target instanceof Element) || source.disabled) {
1029
1099
  return;
1030
1100
  }
1101
+ const { target } = event;
1102
+ const isNativeDraggable = target instanceof HTMLElement && target.draggable && target.getAttribute("draggable") === "true";
1031
1103
  this.initialCoordinates = {
1032
1104
  x: event.clientX,
1033
1105
  y: event.clientY
@@ -1035,7 +1107,7 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1035
1107
  const { activationConstraints } = options;
1036
1108
  const constraints = typeof activationConstraints === "function" ? activationConstraints(event, source) : activationConstraints;
1037
1109
  event.stopImmediatePropagation();
1038
- if (!constraints?.delay && !constraints?.distance) {
1110
+ if (!(constraints == null ? void 0 : constraints.delay) && !(constraints == null ? void 0 : constraints.distance)) {
1039
1111
  this.handleStart(source, event);
1040
1112
  } else {
1041
1113
  const { delay } = constraints;
@@ -1044,10 +1116,10 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1044
1116
  () => this.handleStart(source, event),
1045
1117
  delay.value
1046
1118
  );
1047
- this.#clearTimeout = () => {
1119
+ __privateSet(this, _clearTimeout, () => {
1048
1120
  clearTimeout(timeout);
1049
- this.#clearTimeout = void 0;
1050
- };
1121
+ __privateSet(this, _clearTimeout, void 0);
1122
+ });
1051
1123
  }
1052
1124
  }
1053
1125
  const ownerDocument = utilities.getDocument(event.target);
@@ -1058,7 +1130,10 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1058
1130
  },
1059
1131
  {
1060
1132
  type: "pointerup",
1061
- listener: this.handlePointerUp.bind(this)
1133
+ listener: this.handlePointerUp,
1134
+ options: {
1135
+ capture: true
1136
+ }
1062
1137
  },
1063
1138
  {
1064
1139
  // Prevent scrolling on touch devices
@@ -1068,19 +1143,25 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1068
1143
  passive: false
1069
1144
  }
1070
1145
  },
1146
+ {
1147
+ // Prevent click events
1148
+ type: "click",
1149
+ listener: preventDefault
1150
+ },
1071
1151
  {
1072
1152
  // Cancel activation if there is a competing Drag and Drop interaction
1073
1153
  type: "dragstart",
1074
- listener: this.handleCancel.bind(this)
1154
+ listener: isNativeDraggable ? this.handleCancel : preventDefault
1075
1155
  },
1076
1156
  {
1077
1157
  type: "keydown",
1078
- listener: this.handleKeyDown.bind(this)
1158
+ listener: this.handleKeyDown
1079
1159
  }
1080
1160
  ]);
1081
1161
  const cleanup = () => {
1082
- unbindListeners();
1083
- this.#clearTimeout?.();
1162
+ var _a3;
1163
+ setTimeout(unbindListeners);
1164
+ (_a3 = __privateGet(this, _clearTimeout)) == null ? void 0 : _a3.call(this);
1084
1165
  this.initialCoordinates = void 0;
1085
1166
  this.cleanup.delete(cleanup);
1086
1167
  };
@@ -1106,7 +1187,7 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1106
1187
  };
1107
1188
  const { activationConstraints } = options;
1108
1189
  const constraints = typeof activationConstraints === "function" ? activationConstraints(event, source) : activationConstraints;
1109
- const { distance, delay } = constraints ?? {};
1190
+ const { distance, delay } = constraints != null ? constraints : {};
1110
1191
  if (distance) {
1111
1192
  if (distance.tolerance != null && geometry.exceedsDistance(delta, distance.tolerance)) {
1112
1193
  return this.handleCancel();
@@ -1138,8 +1219,9 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1138
1219
  }
1139
1220
  }
1140
1221
  handleStart(source, event) {
1222
+ var _a3;
1141
1223
  const { manager, initialCoordinates } = this;
1142
- this.#clearTimeout?.();
1224
+ (_a3 = __privateGet(this, _clearTimeout)) == null ? void 0 : _a3.call(this);
1143
1225
  if (!initialCoordinates || manager.dragOperation.status.initialized) {
1144
1226
  return;
1145
1227
  }
@@ -1162,10 +1244,10 @@ var PointerSensor = class _PointerSensor extends abstract.Sensor {
1162
1244
  destroy() {
1163
1245
  this.listeners.clear();
1164
1246
  }
1165
- static {
1166
- this.configure = abstract.configurator(_PointerSensor);
1167
- }
1168
1247
  };
1248
+ _clearTimeout = new WeakMap();
1249
+ _PointerSensor.configure = abstract.configurator(_PointerSensor);
1250
+ var PointerSensor = _PointerSensor;
1169
1251
  function preventDefault(event) {
1170
1252
  event.preventDefault();
1171
1253
  }
@@ -1189,8 +1271,9 @@ var defaultPreset = {
1189
1271
  sensors: [
1190
1272
  PointerSensor.configure({
1191
1273
  activationConstraints(event, source) {
1274
+ var _a3;
1192
1275
  const { pointerType, target } = event;
1193
- if (pointerType === "mouse" && target instanceof Element && (source.handle === target || source.handle?.contains(target))) {
1276
+ if (pointerType === "mouse" && target instanceof Element && (source.handle === target || ((_a3 = source.handle) == null ? void 0 : _a3.contains(target)))) {
1194
1277
  return void 0;
1195
1278
  }
1196
1279
  return {
@@ -1209,29 +1292,36 @@ var DragDropManager = class extends abstract.DragDropManager {
1209
1292
  sensors = defaultPreset.sensors,
1210
1293
  modifiers = []
1211
1294
  } = input;
1212
- super({
1213
- ...input,
1295
+ super(__spreadProps(__spreadValues({}, input), {
1214
1296
  plugins: [ScrollListener, Scroller, ...plugins],
1215
1297
  sensors,
1216
1298
  modifiers
1217
- });
1299
+ }));
1218
1300
  }
1219
1301
  };
1220
- var Draggable = class extends abstract.Draggable {
1221
- constructor({
1222
- element,
1223
- effects: effects2 = () => [],
1224
- handle,
1225
- feedback = "default",
1226
- ...input
1227
- }, manager) {
1302
+ var _feedback_dec, _element_dec, _handle_dec, _c, _init3, _handle, _element, _feedback;
1303
+ var Draggable = class extends (_c = abstract.Draggable, _handle_dec = [state.reactive], _element_dec = [state.reactive], _feedback_dec = [state.reactive], _c) {
1304
+ constructor(_a3, manager) {
1305
+ var _b2 = _a3, {
1306
+ element,
1307
+ effects: effects2 = () => [],
1308
+ handle,
1309
+ feedback = "default"
1310
+ } = _b2, input = __objRest(_b2, [
1311
+ "element",
1312
+ "effects",
1313
+ "handle",
1314
+ "feedback"
1315
+ ]);
1228
1316
  super(
1229
- {
1317
+ __spreadValues({
1230
1318
  effects: () => [
1231
1319
  ...effects2(),
1232
1320
  () => {
1321
+ var _a4, _b3;
1233
1322
  const { manager: manager2 } = this;
1234
- const sensors = this.sensors?.map(abstract.descriptor) ?? [
1323
+ if (!manager2) return;
1324
+ const sensors = (_b3 = (_a4 = this.sensors) == null ? void 0 : _a4.map(abstract.descriptor)) != null ? _b3 : [
1235
1325
  ...manager2.sensors
1236
1326
  ];
1237
1327
  const unbindFunctions = sensors.map((entry) => {
@@ -1244,37 +1334,40 @@ var Draggable = class extends abstract.Draggable {
1244
1334
  unbindFunctions.forEach((unbind) => unbind());
1245
1335
  };
1246
1336
  }
1247
- ],
1248
- ...input
1249
- },
1337
+ ]
1338
+ }, input),
1250
1339
  manager
1251
1340
  );
1252
- this.manager = manager;
1341
+ __privateAdd(this, _handle, __runInitializers(_init3, 8, this)), __runInitializers(_init3, 11, this);
1342
+ __privateAdd(this, _element, __runInitializers(_init3, 12, this)), __runInitializers(_init3, 15, this);
1343
+ __privateAdd(this, _feedback, __runInitializers(_init3, 16, this)), __runInitializers(_init3, 19, this);
1253
1344
  this.element = element;
1254
1345
  this.handle = handle;
1255
1346
  this.feedback = feedback;
1256
1347
  }
1257
1348
  };
1258
- __decorateClass([
1259
- state.reactive
1260
- ], Draggable.prototype, "handle");
1261
- __decorateClass([
1262
- state.reactive
1263
- ], Draggable.prototype, "element");
1264
- __decorateClass([
1265
- state.reactive
1266
- ], Draggable.prototype, "feedback");
1267
- var Droppable = class extends abstract.Droppable {
1268
- constructor({ element, effects: effects2 = () => [], ...input }, manager) {
1349
+ _init3 = __decoratorStart(_c);
1350
+ _handle = new WeakMap();
1351
+ _element = new WeakMap();
1352
+ _feedback = new WeakMap();
1353
+ __decorateElement(_init3, 4, "handle", _handle_dec, Draggable, _handle);
1354
+ __decorateElement(_init3, 4, "element", _element_dec, Draggable, _element);
1355
+ __decorateElement(_init3, 4, "feedback", _feedback_dec, Draggable, _feedback);
1356
+ __decoratorMetadata(_init3, Draggable);
1357
+ var _placeholder_dec, _visible_dec, _c2, _init4, _visible, _placeholder;
1358
+ var Droppable = class extends (_c2 = abstract.Droppable, _visible_dec = [state.reactive], _placeholder_dec = [state.reactive], _c2) {
1359
+ constructor(_a3, manager) {
1360
+ var _b2 = _a3, { element, effects: effects2 = () => [] } = _b2, input = __objRest(_b2, ["element", "effects"]);
1361
+ var _a4;
1269
1362
  const { collisionDetector = collision.defaultCollisionDetection } = input;
1270
1363
  super(
1271
- {
1272
- ...input,
1364
+ __spreadProps(__spreadValues({}, input), {
1273
1365
  collisionDetector,
1274
1366
  effects: () => [
1275
1367
  ...effects2(),
1276
1368
  () => {
1277
1369
  const { element: element2, manager: manager2 } = this;
1370
+ if (!manager2) return;
1278
1371
  const { dragOperation } = manager2;
1279
1372
  if (element2 && dragOperation.status.initialized) {
1280
1373
  const scrollableAncestor = utilities.getFirstScrollableAncestor(element2);
@@ -1290,7 +1383,7 @@ var Droppable = class extends abstract.Droppable {
1290
1383
  this.visible = entry.isIntersecting;
1291
1384
  },
1292
1385
  {
1293
- root: root ?? doc,
1386
+ root: root != null ? root : doc,
1294
1387
  rootMargin: "40%"
1295
1388
  }
1296
1389
  );
@@ -1318,34 +1411,36 @@ var Droppable = class extends abstract.Droppable {
1318
1411
  },
1319
1412
  () => {
1320
1413
  const { manager: manager2 } = this;
1414
+ if (!manager2) return;
1321
1415
  const { dragOperation } = manager2;
1322
1416
  const { status } = dragOperation;
1323
1417
  const source = state.untracked(() => dragOperation.source);
1324
1418
  if (status.initialized) {
1325
- if (source?.type != null && !this.accepts(source)) {
1419
+ if ((source == null ? void 0 : source.type) != null && !this.accepts(source)) {
1326
1420
  return;
1327
1421
  }
1328
1422
  utilities.scheduler.schedule(this.refreshShape);
1329
1423
  }
1330
1424
  },
1331
1425
  () => {
1332
- const { manager: manager2 } = this;
1333
- if (manager2.dragOperation.status.initialized) {
1426
+ var _a5;
1427
+ if ((_a5 = this.manager) == null ? void 0 : _a5.dragOperation.status.initialized) {
1334
1428
  return () => {
1335
1429
  this.shape = void 0;
1336
1430
  };
1337
1431
  }
1338
1432
  }
1339
1433
  ]
1340
- },
1434
+ }),
1341
1435
  manager
1342
1436
  );
1343
- this.manager = manager;
1437
+ __privateAdd(this, _visible, __runInitializers(_init4, 8, this)), __runInitializers(_init4, 11, this);
1438
+ __privateAdd(this, _placeholder, __runInitializers(_init4, 12, this)), __runInitializers(_init4, 15, this);
1344
1439
  this.internal = {
1345
1440
  element: state.signal(element)
1346
1441
  };
1347
1442
  this.refreshShape = this.refreshShape.bind(this);
1348
- if (manager.dragOperation.status.initialized) {
1443
+ if ((_a4 = this.manager) == null ? void 0 : _a4.dragOperation.status.initialized) {
1349
1444
  this.visible = true;
1350
1445
  }
1351
1446
  }
@@ -1353,7 +1448,8 @@ var Droppable = class extends abstract.Droppable {
1353
1448
  this.internal.element.value = value;
1354
1449
  }
1355
1450
  get element() {
1356
- return this.placeholder ?? this.internal?.element.value;
1451
+ var _a3, _b2;
1452
+ return (_b2 = this.placeholder) != null ? _b2 : (_a3 = this.internal) == null ? void 0 : _a3.element.value;
1357
1453
  }
1358
1454
  refreshShape(ignoreTransform) {
1359
1455
  const { element, shape } = this;
@@ -1362,19 +1458,19 @@ var Droppable = class extends abstract.Droppable {
1362
1458
  return void 0;
1363
1459
  }
1364
1460
  const updatedShape = new utilities.DOMRectangle(element, ignoreTransform);
1365
- if (updatedShape && shape?.equals(updatedShape)) {
1461
+ if (updatedShape && (shape == null ? void 0 : shape.equals(updatedShape))) {
1366
1462
  return shape;
1367
1463
  }
1368
1464
  this.shape = updatedShape;
1369
1465
  return updatedShape;
1370
1466
  }
1371
1467
  };
1372
- __decorateClass([
1373
- state.reactive
1374
- ], Droppable.prototype, "visible");
1375
- __decorateClass([
1376
- state.reactive
1377
- ], Droppable.prototype, "placeholder");
1468
+ _init4 = __decoratorStart(_c2);
1469
+ _visible = new WeakMap();
1470
+ _placeholder = new WeakMap();
1471
+ __decorateElement(_init4, 4, "visible", _visible_dec, Droppable, _visible);
1472
+ __decorateElement(_init4, 4, "placeholder", _placeholder_dec, Droppable, _placeholder);
1473
+ __decoratorMetadata(_init4, Droppable);
1378
1474
 
1379
1475
  exports.Accessibility = Accessibility;
1380
1476
  exports.AutoScroller = AutoScroller;