@angular/cdk 19.2.2 → 19.2.4

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 (180) hide show
  1. package/a11y/index.d.ts +330 -1234
  2. package/a11y-module.d-7d03e079.d.ts +313 -0
  3. package/accordion/index.d.ts +8 -27
  4. package/activedescendant-key-manager.d-11921e3a.d.ts +31 -0
  5. package/bidi/index.d.ts +3 -62
  6. package/bidi-module.d-f8648621.d.ts +53 -0
  7. package/clipboard/index.d.ts +61 -75
  8. package/coercion/index.d.ts +10 -33
  9. package/coercion/private/index.d.ts +2 -2
  10. package/collections/index.d.ts +13 -291
  11. package/data-source.d-7cab2c9d.d.ts +42 -0
  12. package/dialog/index.d.ts +219 -247
  13. package/drag-drop/index.d.ts +1081 -1156
  14. package/fesm2022/a11y-module-012407f8.mjs +952 -0
  15. package/fesm2022/a11y-module-012407f8.mjs.map +1 -0
  16. package/fesm2022/a11y.mjs +38 -2436
  17. package/fesm2022/a11y.mjs.map +1 -1
  18. package/fesm2022/accordion.mjs +2 -6
  19. package/fesm2022/accordion.mjs.map +1 -1
  20. package/fesm2022/activedescendant-key-manager-1351a9d3.mjs +16 -0
  21. package/fesm2022/activedescendant-key-manager-1351a9d3.mjs.map +1 -0
  22. package/fesm2022/array-ee3b4bab.mjs +6 -0
  23. package/fesm2022/array-ee3b4bab.mjs.map +1 -0
  24. package/fesm2022/backwards-compatibility-bcbe473e.mjs +25 -0
  25. package/fesm2022/backwards-compatibility-bcbe473e.mjs.map +1 -0
  26. package/fesm2022/bidi-module-56dd006c.mjs +78 -0
  27. package/fesm2022/bidi-module-56dd006c.mjs.map +1 -0
  28. package/fesm2022/bidi.mjs +4 -143
  29. package/fesm2022/bidi.mjs.map +1 -1
  30. package/fesm2022/breakpoints-observer-63bede13.mjs +179 -0
  31. package/fesm2022/breakpoints-observer-63bede13.mjs.map +1 -0
  32. package/fesm2022/cdk.mjs +1 -1
  33. package/fesm2022/cdk.mjs.map +1 -1
  34. package/fesm2022/clipboard.mjs +0 -4
  35. package/fesm2022/clipboard.mjs.map +1 -1
  36. package/fesm2022/coercion/private.mjs +2 -18
  37. package/fesm2022/coercion/private.mjs.map +1 -1
  38. package/fesm2022/coercion.mjs +5 -39
  39. package/fesm2022/coercion.mjs.map +1 -1
  40. package/fesm2022/collections.mjs +7 -476
  41. package/fesm2022/collections.mjs.map +1 -1
  42. package/fesm2022/css-pixel-value-286c9a60.mjs +10 -0
  43. package/fesm2022/css-pixel-value-286c9a60.mjs.map +1 -0
  44. package/fesm2022/data-source-5320b6fd.mjs +15 -0
  45. package/fesm2022/data-source-5320b6fd.mjs.map +1 -0
  46. package/fesm2022/dialog.mjs +26 -10
  47. package/fesm2022/dialog.mjs.map +1 -1
  48. package/fesm2022/directionality-0a678adc.mjs +72 -0
  49. package/fesm2022/directionality-0a678adc.mjs.map +1 -0
  50. package/fesm2022/dispose-view-repeater-strategy-b11b87ea.mjs +44 -0
  51. package/fesm2022/dispose-view-repeater-strategy-b11b87ea.mjs.map +1 -0
  52. package/fesm2022/drag-drop.mjs +14 -10
  53. package/fesm2022/drag-drop.mjs.map +1 -1
  54. package/fesm2022/element-705567fe.mjs +29 -0
  55. package/fesm2022/element-705567fe.mjs.map +1 -0
  56. package/fesm2022/fake-event-detection-7055b1bd.mjs +24 -0
  57. package/fesm2022/fake-event-detection-7055b1bd.mjs.map +1 -0
  58. package/fesm2022/focus-key-manager-58d29acd.mjs +22 -0
  59. package/fesm2022/focus-key-manager-58d29acd.mjs.map +1 -0
  60. package/fesm2022/focus-monitor-81212fa3.mjs +629 -0
  61. package/fesm2022/focus-monitor-81212fa3.mjs.map +1 -0
  62. package/fesm2022/id-generator-1959b006.mjs +37 -0
  63. package/fesm2022/id-generator-1959b006.mjs.map +1 -0
  64. package/fesm2022/keycodes-107cd3e4.mjs +122 -0
  65. package/fesm2022/keycodes-107cd3e4.mjs.map +1 -0
  66. package/fesm2022/keycodes.mjs +2 -136
  67. package/fesm2022/keycodes.mjs.map +1 -1
  68. package/fesm2022/layout.mjs +8 -180
  69. package/fesm2022/layout.mjs.map +1 -1
  70. package/fesm2022/list-key-manager-c7b5cefb.mjs +360 -0
  71. package/fesm2022/list-key-manager-c7b5cefb.mjs.map +1 -0
  72. package/fesm2022/listbox.mjs +11 -10
  73. package/fesm2022/listbox.mjs.map +1 -1
  74. package/fesm2022/menu.mjs +27 -11
  75. package/fesm2022/menu.mjs.map +1 -1
  76. package/fesm2022/modifiers-33a5859e.mjs +13 -0
  77. package/fesm2022/modifiers-33a5859e.mjs.map +1 -0
  78. package/fesm2022/observable-97c0792c.mjs +15 -0
  79. package/fesm2022/observable-97c0792c.mjs.map +1 -0
  80. package/fesm2022/observe-content-41b1b248.mjs +210 -0
  81. package/fesm2022/observe-content-41b1b248.mjs.map +1 -0
  82. package/fesm2022/observers/private.mjs +0 -4
  83. package/fesm2022/observers/private.mjs.map +1 -1
  84. package/fesm2022/observers.mjs +5 -213
  85. package/fesm2022/observers.mjs.map +1 -1
  86. package/fesm2022/overlay-module-7f527d71.mjs +3029 -0
  87. package/fesm2022/overlay-module-7f527d71.mjs.map +1 -0
  88. package/fesm2022/overlay.mjs +25 -3016
  89. package/fesm2022/overlay.mjs.map +1 -1
  90. package/fesm2022/passive-listeners-c0bdc49f.mjs +31 -0
  91. package/fesm2022/passive-listeners-c0bdc49f.mjs.map +1 -0
  92. package/fesm2022/platform-610a08ae.mjs +77 -0
  93. package/fesm2022/platform-610a08ae.mjs.map +1 -0
  94. package/fesm2022/platform.mjs +9 -289
  95. package/fesm2022/platform.mjs.map +1 -1
  96. package/fesm2022/portal-directives-06c9f3e0.mjs +653 -0
  97. package/fesm2022/portal-directives-06c9f3e0.mjs.map +1 -0
  98. package/fesm2022/portal.mjs +4 -652
  99. package/fesm2022/portal.mjs.map +1 -1
  100. package/fesm2022/private.mjs +3 -63
  101. package/fesm2022/private.mjs.map +1 -1
  102. package/fesm2022/recycle-view-repeater-strategy-c1712813.mjs +156 -0
  103. package/fesm2022/recycle-view-repeater-strategy-c1712813.mjs.map +1 -0
  104. package/fesm2022/scrolling-61955dd1.mjs +99 -0
  105. package/fesm2022/scrolling-61955dd1.mjs.map +1 -0
  106. package/fesm2022/scrolling-module-dbd83632.mjs +1463 -0
  107. package/fesm2022/scrolling-module-dbd83632.mjs.map +1 -0
  108. package/fesm2022/scrolling.mjs +12 -1463
  109. package/fesm2022/scrolling.mjs.map +1 -1
  110. package/fesm2022/selection-model-0f5fc202.mjs +226 -0
  111. package/fesm2022/selection-model-0f5fc202.mjs.map +1 -0
  112. package/fesm2022/shadow-dom-9f403d00.mjs +49 -0
  113. package/fesm2022/shadow-dom-9f403d00.mjs.map +1 -0
  114. package/fesm2022/stepper.mjs +10 -8
  115. package/fesm2022/stepper.mjs.map +1 -1
  116. package/fesm2022/style-loader-51b80670.mjs +47 -0
  117. package/fesm2022/style-loader-51b80670.mjs.map +1 -0
  118. package/fesm2022/table.mjs +11 -16
  119. package/fesm2022/table.mjs.map +1 -1
  120. package/fesm2022/test-environment-34eef1ee.mjs +19 -0
  121. package/fesm2022/test-environment-34eef1ee.mjs.map +1 -0
  122. package/fesm2022/testing/selenium-webdriver.mjs +2 -1
  123. package/fesm2022/testing/selenium-webdriver.mjs.map +1 -1
  124. package/fesm2022/testing/testbed.mjs +33 -74
  125. package/fesm2022/testing/testbed.mjs.map +1 -1
  126. package/fesm2022/testing.mjs +2 -697
  127. package/fesm2022/testing.mjs.map +1 -1
  128. package/fesm2022/text-field.mjs +8 -7
  129. package/fesm2022/text-field.mjs.map +1 -1
  130. package/fesm2022/text-filtering-b60ba8a2.mjs +698 -0
  131. package/fesm2022/text-filtering-b60ba8a2.mjs.map +1 -0
  132. package/fesm2022/tree-key-manager-2f20c79c.mjs +360 -0
  133. package/fesm2022/tree-key-manager-2f20c79c.mjs.map +1 -0
  134. package/fesm2022/tree.mjs +8 -8
  135. package/fesm2022/tree.mjs.map +1 -1
  136. package/fesm2022/typeahead-11ae39bd.mjs +88 -0
  137. package/fesm2022/typeahead-11ae39bd.mjs.map +1 -0
  138. package/fesm2022/unique-selection-dispatcher-8d1187be.mjs +49 -0
  139. package/fesm2022/unique-selection-dispatcher-8d1187be.mjs.map +1 -0
  140. package/fesm2022/visually-hidden-7e8689f8.mjs +18 -0
  141. package/fesm2022/visually-hidden-7e8689f8.mjs.map +1 -0
  142. package/focus-key-manager.d-415a6958.d.ts +33 -0
  143. package/focus-monitor.d-810a02e6.d.ts +209 -0
  144. package/harness-environment.d-4d615248.d.ts +619 -0
  145. package/index.d.ts +2 -2
  146. package/keycodes/index.d.ts +123 -244
  147. package/layout/index.d.ts +23 -25
  148. package/list-key-manager.d-72e9a2e7.d.ts +164 -0
  149. package/listbox/index.d.ts +91 -107
  150. package/menu/index.d.ts +596 -682
  151. package/number-property.d-ce316715.d.ts +15 -0
  152. package/observe-content.d-c08bc882.d.ts +84 -0
  153. package/observers/index.d.ts +4 -90
  154. package/observers/private/index.d.ts +3 -3
  155. package/overlay/index.d.ts +15 -1145
  156. package/overlay-module.d-13717e08.d.ts +790 -0
  157. package/overlay.d-f1a41275.d.ts +295 -0
  158. package/package.json +1 -1
  159. package/platform/index.d.ts +45 -86
  160. package/platform.d-0a5b4792.d.ts +33 -0
  161. package/portal/index.d.ts +8 -257
  162. package/portal-directives.d-ef3fad92.d.ts +231 -0
  163. package/private/index.d.ts +3 -20
  164. package/schematics/ng-add/index.js +1 -1
  165. package/schematics/ng-add/index.mjs +1 -1
  166. package/scrolling/index.d.ts +7 -687
  167. package/scrolling-module.d-e181b1be.d.ts +551 -0
  168. package/selection-model.d-0f0cc883.d.ts +116 -0
  169. package/stepper/index.d.ts +74 -124
  170. package/style-loader.d-19baab84.d.ts +21 -0
  171. package/table/index.d.ts +338 -449
  172. package/testing/index.d.ts +32 -675
  173. package/testing/selenium-webdriver/index.d.ts +30 -20
  174. package/testing/testbed/index.d.ts +9 -19
  175. package/text-field/index.d.ts +11 -30
  176. package/tree/index.d.ts +205 -271
  177. package/tree-key-manager-strategy.d-603161dd.d.ts +116 -0
  178. package/unique-selection-dispatcher.d-7993b9f5.d.ts +32 -0
  179. package/view-repeater.d-79039e1f.d.ts +88 -0
  180. package/viewport-ruler.d-f3d3e82f.d.ts +57 -0
@@ -1,419 +1,348 @@
1
- import { AfterViewInit } from '@angular/core';
2
- import { Direction } from '@angular/cdk/bidi';
3
- import { ElementRef } from '@angular/core';
4
- import { EventEmitter } from '@angular/core';
5
1
  import * as i0 from '@angular/core';
6
- import * as i7 from '@angular/cdk/scrolling';
7
- import { InjectionToken } from '@angular/core';
8
- import { NgZone } from '@angular/core';
9
- import { NumberInput } from '@angular/cdk/coercion';
10
- import { Observable } from 'rxjs';
11
- import { OnChanges } from '@angular/core';
12
- import { OnDestroy } from '@angular/core';
13
- import { Renderer2 } from '@angular/core';
14
- import { SimpleChanges } from '@angular/core';
15
- import { Subject } from 'rxjs';
16
- import { TemplateRef } from '@angular/core';
17
- import { ViewContainerRef } from '@angular/core';
18
- import { ViewportRuler } from '@angular/cdk/scrolling';
2
+ import { InjectionToken, ElementRef, NgZone, OnDestroy, EventEmitter, AfterViewInit, TemplateRef, OnChanges, SimpleChanges, ViewContainerRef, Renderer2 } from '@angular/core';
3
+ import { a as Direction } from '../bidi-module.d-f8648621.js';
4
+ import { Subject, Observable } from 'rxjs';
5
+ import { V as ViewportRuler } from '../viewport-ruler.d-f3d3e82f.js';
6
+ import { N as NumberInput } from '../number-property.d-ce316715.js';
7
+ import { b as CdkScrollableModule } from '../scrolling-module.d-e181b1be.js';
8
+ import '../data-source.d-7cab2c9d.js';
19
9
 
10
+ /** Possible values that can be used to configure the drag start delay. */
11
+ type DragStartDelay = number | {
12
+ touch: number;
13
+ mouse: number;
14
+ };
15
+ /** Possible axis along which dragging can be locked. */
16
+ type DragAxis = 'x' | 'y';
17
+ /** Function that can be used to constrain the position of a dragged element. */
18
+ type DragConstrainPosition = (point: Point, dragRef: DragRef) => Point;
19
+ /** Possible orientations for a drop list. */
20
+ type DropListOrientation = 'horizontal' | 'vertical' | 'mixed';
20
21
  /**
21
22
  * Injection token that can be used to configure the
22
23
  * behavior of the drag&drop-related components.
23
24
  */
24
- export declare const CDK_DRAG_CONFIG: InjectionToken<DragDropConfig>;
25
-
26
- /**
27
- * Injection token that can be used to reference instances of `CdkDragHandle`. It serves as
28
- * alternative token to the actual `CdkDragHandle` class which could cause unnecessary
29
- * retention of the class and its directive metadata.
30
- */
31
- export declare const CDK_DRAG_HANDLE: InjectionToken<CdkDragHandle>;
32
-
33
- /**
34
- * Injection token that can be used for a `CdkDrag` to provide itself as a parent to the
35
- * drag-specific child directive (`CdkDragHandle`, `CdkDragPreview` etc.). Used primarily
36
- * to avoid circular imports.
37
- * @docs-private
38
- */
39
- export declare const CDK_DRAG_PARENT: InjectionToken<CdkDrag<any>>;
40
-
41
- /**
42
- * Injection token that can be used to reference instances of `CdkDragPlaceholder`. It serves as
43
- * alternative token to the actual `CdkDragPlaceholder` class which could cause unnecessary
44
- * retention of the class and its directive metadata.
45
- */
46
- export declare const CDK_DRAG_PLACEHOLDER: InjectionToken<CdkDragPlaceholder<any>>;
47
-
48
- /**
49
- * Injection token that can be used to reference instances of `CdkDragPreview`. It serves as
50
- * alternative token to the actual `CdkDragPreview` class which could cause unnecessary
51
- * retention of the class and its directive metadata.
52
- */
53
- export declare const CDK_DRAG_PREVIEW: InjectionToken<CdkDragPreview<any>>;
54
-
25
+ declare const CDK_DRAG_CONFIG: InjectionToken<DragDropConfig>;
55
26
  /**
56
- * Injection token that can be used to reference instances of `CdkDropList`. It serves as
57
- * alternative token to the actual `CdkDropList` class which could cause unnecessary
58
- * retention of the class and its directive metadata.
27
+ * Object that can be used to configure the drag
28
+ * items and drop lists within a module or a component.
59
29
  */
60
- export declare const CDK_DROP_LIST: InjectionToken<CdkDropList<any>>;
30
+ interface DragDropConfig extends Partial<DragRefConfig> {
31
+ lockAxis?: DragAxis;
32
+ dragStartDelay?: DragStartDelay;
33
+ constrainPosition?: DragConstrainPosition;
34
+ previewClass?: string | string[];
35
+ boundaryElement?: string;
36
+ rootElementSelector?: string;
37
+ draggingDisabled?: boolean;
38
+ sortingDisabled?: boolean;
39
+ listAutoScrollDisabled?: boolean;
40
+ listOrientation?: DropListOrientation;
41
+ zIndex?: number;
42
+ previewContainer?: 'global' | 'parent';
43
+ }
61
44
 
62
45
  /**
63
- * Injection token that can be used to reference instances of `CdkDropListGroup`. It serves as
64
- * alternative token to the actual `CdkDropListGroup` class which could cause unnecessary
65
- * retention of the class and its directive metadata.
46
+ * Reference to a drop list. Used to manipulate or dispose of the container.
66
47
  */
67
- export declare const CDK_DROP_LIST_GROUP: InjectionToken<CdkDropListGroup<unknown>>;
68
-
69
- /** Element that can be moved inside a CdkDropList container. */
70
- export declare class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
71
- element: ElementRef<HTMLElement>;
72
- dropContainer: CdkDropList<any>;
73
- private _ngZone;
74
- private _viewContainerRef;
75
- private _dir;
76
- private _changeDetectorRef;
77
- private _selfHandle;
78
- private _parentDrag;
48
+ declare class DropListRef<T = any> {
79
49
  private _dragDropRegistry;
80
- private readonly _destroyed;
81
- private _handles;
82
- private _previewTemplate;
83
- private _placeholderTemplate;
84
- /** Reference to the underlying drag instance. */
85
- _dragRef: DragRef<CdkDrag<T>>;
86
- /** Arbitrary data to attach to this drag instance. */
87
- data: T;
88
- /** Locks the position of the dragged element along the specified axis. */
89
- lockAxis: DragAxis;
50
+ private _ngZone;
51
+ private _viewportRuler;
52
+ /** Element that the drop list is attached to. */
53
+ element: HTMLElement | ElementRef<HTMLElement>;
54
+ /** Whether starting a dragging sequence from this container is disabled. */
55
+ disabled: boolean;
56
+ /** Whether sorting items within the list is disabled. */
57
+ sortingDisabled: boolean;
58
+ /** Locks the position of the draggable elements inside the container along the specified axis. */
59
+ lockAxis: 'x' | 'y';
90
60
  /**
91
- * Selector that will be used to determine the root draggable element, starting from
92
- * the `cdkDrag` element and going up the DOM. Passing an alternate root element is useful
93
- * when trying to enable dragging on an element that you might not have access to.
61
+ * Whether auto-scrolling the view when the user
62
+ * moves their pointer close to the edges is disabled.
94
63
  */
95
- rootElementSelector: string;
64
+ autoScrollDisabled: boolean;
65
+ /** Number of pixels to scroll for each frame when auto-scrolling an element. */
66
+ autoScrollStep: number;
96
67
  /**
97
- * Node or selector that will be used to determine the element to which the draggable's
98
- * position will be constrained. If a string is passed in, it'll be used as a selector that
99
- * will be matched starting from the element's parent and going up the DOM until a match
100
- * has been found.
68
+ * Function that is used to determine whether an item
69
+ * is allowed to be moved into a drop container.
101
70
  */
102
- boundaryElement: string | ElementRef<HTMLElement> | HTMLElement;
71
+ enterPredicate: (drag: DragRef, drop: DropListRef) => boolean;
72
+ /** Function that is used to determine whether an item can be sorted into a particular index. */
73
+ sortPredicate: (index: number, drag: DragRef, drop: DropListRef) => boolean;
74
+ /** Emits right before dragging has started. */
75
+ readonly beforeStarted: Subject<void>;
103
76
  /**
104
- * Amount of milliseconds to wait after the user has put their
105
- * pointer down before starting to drag the element.
77
+ * Emits when the user has moved a new drag item into this container.
106
78
  */
107
- dragStartDelay: DragStartDelay;
79
+ readonly entered: Subject<{
80
+ item: DragRef;
81
+ container: DropListRef;
82
+ currentIndex: number;
83
+ }>;
108
84
  /**
109
- * Sets the position of a `CdkDrag` that is outside of a drop container.
110
- * Can be used to restore the element's position for a returning user.
85
+ * Emits when the user removes an item from the container
86
+ * by dragging it into another container.
111
87
  */
112
- freeDragPosition: Point;
113
- /** Whether starting to drag this element is disabled. */
114
- get disabled(): boolean;
115
- set disabled(value: boolean);
116
- private _disabled;
88
+ readonly exited: Subject<{
89
+ item: DragRef;
90
+ container: DropListRef;
91
+ }>;
92
+ /** Emits when the user drops an item inside the container. */
93
+ readonly dropped: Subject<{
94
+ item: DragRef;
95
+ currentIndex: number;
96
+ previousIndex: number;
97
+ container: DropListRef;
98
+ previousContainer: DropListRef;
99
+ isPointerOverContainer: boolean;
100
+ distance: Point;
101
+ dropPoint: Point;
102
+ event: MouseEvent | TouchEvent;
103
+ }>;
104
+ /** Emits as the user is swapping items while actively dragging. */
105
+ readonly sorted: Subject<{
106
+ previousIndex: number;
107
+ currentIndex: number;
108
+ container: DropListRef;
109
+ item: DragRef;
110
+ }>;
111
+ /** Emits when a dragging sequence is started in a list connected to the current one. */
112
+ readonly receivingStarted: Subject<{
113
+ receiver: DropListRef;
114
+ initiator: DropListRef;
115
+ items: DragRef[];
116
+ }>;
117
+ /** Emits when a dragging sequence is stopped from a list connected to the current one. */
118
+ readonly receivingStopped: Subject<{
119
+ receiver: DropListRef;
120
+ initiator: DropListRef;
121
+ }>;
122
+ /** Arbitrary data that can be attached to the drop list. */
123
+ data: T;
124
+ /** Element that is the direct parent of the drag items. */
125
+ private _container;
126
+ /** Whether an item in the list is being dragged. */
127
+ private _isDragging;
128
+ /** Keeps track of the positions of any parent scrollable elements. */
129
+ private _parentPositions;
130
+ /** Strategy being used to sort items within the list. */
131
+ private _sortStrategy;
132
+ /** Cached `DOMRect` of the drop list. */
133
+ private _domRect;
134
+ /** Draggable items in the container. */
135
+ private _draggables;
136
+ /** Drop lists that are connected to the current one. */
137
+ private _siblings;
138
+ /** Connected siblings that currently have a dragged item. */
139
+ private _activeSiblings;
140
+ /** Subscription to the window being scrolled. */
141
+ private _viewportScrollSubscription;
142
+ /** Vertical direction in which the list is currently scrolling. */
143
+ private _verticalScrollDirection;
144
+ /** Horizontal direction in which the list is currently scrolling. */
145
+ private _horizontalScrollDirection;
146
+ /** Node that is being auto-scrolled. */
147
+ private _scrollNode;
148
+ /** Used to signal to the current auto-scroll sequence when to stop. */
149
+ private readonly _stopScrollTimers;
150
+ /** Shadow root of the current element. Necessary for `elementFromPoint` to resolve correctly. */
151
+ private _cachedShadowRoot;
152
+ /** Reference to the document. */
153
+ private _document;
154
+ /** Elements that can be scrolled while the user is dragging. */
155
+ private _scrollableElements;
156
+ /** Initial value for the element's `scroll-snap-type` style. */
157
+ private _initialScrollSnap;
158
+ /** Direction of the list's layout. */
159
+ private _direction;
160
+ constructor(element: ElementRef<HTMLElement> | HTMLElement, _dragDropRegistry: DragDropRegistry, _document: any, _ngZone: NgZone, _viewportRuler: ViewportRuler);
161
+ /** Removes the drop list functionality from the DOM element. */
162
+ dispose(): void;
163
+ /** Whether an item from this list is currently being dragged. */
164
+ isDragging(): boolean;
165
+ /** Starts dragging an item. */
166
+ start(): void;
117
167
  /**
118
- * Function that can be used to customize the logic of how the position of the drag item
119
- * is limited while it's being dragged. Gets called with a point containing the current position
120
- * of the user's pointer on the page, a reference to the item being dragged and its dimensions.
121
- * Should return a point describing where the item should be rendered.
168
+ * Attempts to move an item into the container.
169
+ * @param item Item that was moved into the container.
170
+ * @param pointerX Position of the item along the X axis.
171
+ * @param pointerY Position of the item along the Y axis.
172
+ * @param index Index at which the item entered. If omitted, the container will try to figure it
173
+ * out automatically.
122
174
  */
123
- constrainPosition?: (userPointerPosition: Point, dragRef: DragRef, dimensions: DOMRect, pickupPositionInElement: Point) => Point;
124
- /** Class to be added to the preview element. */
125
- previewClass: string | string[];
175
+ enter(item: DragRef, pointerX: number, pointerY: number, index?: number): void;
126
176
  /**
127
- * Configures the place into which the preview of the item will be inserted. Can be configured
128
- * globally through `CDK_DROP_LIST`. Possible values:
129
- * - `global` - Preview will be inserted at the bottom of the `<body>`. The advantage is that
130
- * you don't have to worry about `overflow: hidden` or `z-index`, but the item won't retain
131
- * its inherited styles.
132
- * - `parent` - Preview will be inserted into the parent of the drag item. The advantage is that
133
- * inherited styles will be preserved, but it may be clipped by `overflow: hidden` or not be
134
- * visible due to `z-index`. Furthermore, the preview is going to have an effect over selectors
135
- * like `:nth-child` and some flexbox configurations.
136
- * - `ElementRef<HTMLElement> | HTMLElement` - Preview will be inserted into a specific element.
137
- * Same advantages and disadvantages as `parent`.
177
+ * Removes an item from the container after it was dragged into another container by the user.
178
+ * @param item Item that was dragged out.
138
179
  */
139
- previewContainer: PreviewContainer;
180
+ exit(item: DragRef): void;
140
181
  /**
141
- * If the parent of the dragged element has a `scale` transform, it can throw off the
142
- * positioning when the user starts dragging. Use this input to notify the CDK of the scale.
182
+ * Drops an item into this container.
183
+ * @param item Item being dropped into the container.
184
+ * @param currentIndex Index at which the item should be inserted.
185
+ * @param previousIndex Index of the item when dragging started.
186
+ * @param previousContainer Container from which the item got dragged in.
187
+ * @param isPointerOverContainer Whether the user's pointer was over the
188
+ * container when the item was dropped.
189
+ * @param distance Distance the user has dragged since the start of the dragging sequence.
190
+ * @param event Event that triggered the dropping sequence.
191
+ *
192
+ * @breaking-change 15.0.0 `previousIndex` and `event` parameters to become required.
143
193
  */
144
- scale: number;
145
- /** Emits when the user starts dragging the item. */
146
- readonly started: EventEmitter<CdkDragStart>;
147
- /** Emits when the user has released a drag item, before any animations have started. */
148
- readonly released: EventEmitter<CdkDragRelease>;
149
- /** Emits when the user stops dragging an item in the container. */
150
- readonly ended: EventEmitter<CdkDragEnd>;
151
- /** Emits when the user has moved the item into a new container. */
152
- readonly entered: EventEmitter<CdkDragEnter<any>>;
153
- /** Emits when the user removes the item its container by dragging it into another container. */
154
- readonly exited: EventEmitter<CdkDragExit<any>>;
155
- /** Emits when the user drops the item inside a container. */
156
- readonly dropped: EventEmitter<CdkDragDrop<any>>;
194
+ drop(item: DragRef, currentIndex: number, previousIndex: number, previousContainer: DropListRef, isPointerOverContainer: boolean, distance: Point, dropPoint: Point, event?: MouseEvent | TouchEvent): void;
157
195
  /**
158
- * Emits as the user is dragging the item. Use with caution,
159
- * because this event will fire for every pixel that the user has dragged.
196
+ * Sets the draggable items that are a part of this list.
197
+ * @param items Items that are a part of this list.
160
198
  */
161
- readonly moved: Observable<CdkDragMove<T>>;
162
- private _injector;
163
- constructor(...args: unknown[]);
199
+ withItems(items: DragRef[]): this;
200
+ /** Sets the layout direction of the drop list. */
201
+ withDirection(direction: Direction): this;
164
202
  /**
165
- * Returns the element that is being used as a placeholder
166
- * while the current element is being dragged.
203
+ * Sets the containers that are connected to this one. When two or more containers are
204
+ * connected, the user will be allowed to transfer items between them.
205
+ * @param connectedTo Other containers that the current containers should be connected to.
167
206
  */
168
- getPlaceholderElement(): HTMLElement;
169
- /** Returns the root draggable element. */
170
- getRootElement(): HTMLElement;
171
- /** Resets a standalone drag item to its initial position. */
172
- reset(): void;
207
+ connectedTo(connectedTo: DropListRef[]): this;
173
208
  /**
174
- * Gets the pixel coordinates of the draggable outside of a drop container.
209
+ * Sets the orientation of the container.
210
+ * @param orientation New orientation for the container.
175
211
  */
176
- getFreeDragPosition(): Readonly<Point>;
212
+ withOrientation(orientation: DropListOrientation): this;
177
213
  /**
178
- * Sets the current position in pixels the draggable outside of a drop container.
179
- * @param value New position to be set.
214
+ * Sets which parent elements are can be scrolled while the user is dragging.
215
+ * @param elements Elements that can be scrolled.
180
216
  */
181
- setFreeDragPosition(value: Point): void;
182
- ngAfterViewInit(): void;
183
- ngOnChanges(changes: SimpleChanges): void;
184
- ngOnDestroy(): void;
185
- _addHandle(handle: CdkDragHandle): void;
186
- _removeHandle(handle: CdkDragHandle): void;
187
- _setPreviewTemplate(preview: CdkDragPreview): void;
188
- _resetPreviewTemplate(preview: CdkDragPreview): void;
189
- _setPlaceholderTemplate(placeholder: CdkDragPlaceholder): void;
190
- _resetPlaceholderTemplate(placeholder: CdkDragPlaceholder): void;
191
- /** Syncs the root element with the `DragRef`. */
192
- private _updateRootElement;
193
- /** Gets the boundary element, based on the `boundaryElement` value. */
194
- private _getBoundaryElement;
195
- /** Syncs the inputs of the CdkDrag with the options of the underlying DragRef. */
196
- private _syncInputs;
197
- /** Handles the events from the underlying `DragRef`. */
198
- private _handleEvents;
199
- /** Assigns the default input values based on a provided config object. */
200
- private _assignDefaults;
201
- /** Sets up the listener that syncs the handles with the drag ref. */
202
- private _setupHandlesListener;
203
- static ɵfac: i0.ɵɵFactoryDeclaration<CdkDrag<any>, never>;
204
- static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDrag<any>, "[cdkDrag]", ["cdkDrag"], { "data": { "alias": "cdkDragData"; "required": false; }; "lockAxis": { "alias": "cdkDragLockAxis"; "required": false; }; "rootElementSelector": { "alias": "cdkDragRootElement"; "required": false; }; "boundaryElement": { "alias": "cdkDragBoundary"; "required": false; }; "dragStartDelay": { "alias": "cdkDragStartDelay"; "required": false; }; "freeDragPosition": { "alias": "cdkDragFreeDragPosition"; "required": false; }; "disabled": { "alias": "cdkDragDisabled"; "required": false; }; "constrainPosition": { "alias": "cdkDragConstrainPosition"; "required": false; }; "previewClass": { "alias": "cdkDragPreviewClass"; "required": false; }; "previewContainer": { "alias": "cdkDragPreviewContainer"; "required": false; }; "scale": { "alias": "cdkDragScale"; "required": false; }; }, { "started": "cdkDragStarted"; "released": "cdkDragReleased"; "ended": "cdkDragEnded"; "entered": "cdkDragEntered"; "exited": "cdkDragExited"; "dropped": "cdkDragDropped"; "moved": "cdkDragMoved"; }, never, never, true, never>;
205
- static ngAcceptInputType_disabled: unknown;
206
- static ngAcceptInputType_scale: unknown;
207
- }
208
-
209
- /** Event emitted when the user drops a draggable item inside a drop container. */
210
- export declare interface CdkDragDrop<T, O = T, I = any> {
211
- /** Index of the item when it was picked up. */
212
- previousIndex: number;
213
- /** Current index of the item. */
214
- currentIndex: number;
215
- /** Item that is being dropped. */
216
- item: CdkDrag<I>;
217
- /** Container in which the item was dropped. */
218
- container: CdkDropList<T>;
219
- /** Container from which the item was picked up. Can be the same as the `container`. */
220
- previousContainer: CdkDropList<O>;
221
- /** Whether the user's pointer was over the container when the item was dropped. */
222
- isPointerOverContainer: boolean;
223
- /** Distance in pixels that the user has dragged since the drag sequence started. */
224
- distance: {
225
- x: number;
226
- y: number;
227
- };
228
- /** Position where the pointer was when the item was dropped */
229
- dropPoint: {
230
- x: number;
231
- y: number;
232
- };
233
- /** Native event that caused the drop event. */
234
- event: MouseEvent | TouchEvent;
235
- }
236
-
237
- /** Event emitted when the user stops dragging a draggable. */
238
- export declare interface CdkDragEnd<T = any> {
239
- /** Draggable that emitted the event. */
240
- source: CdkDrag<T>;
241
- /** Distance in pixels that the user has dragged since the drag sequence started. */
242
- distance: {
243
- x: number;
244
- y: number;
245
- };
246
- /** Position where the pointer was when the item was dropped */
247
- dropPoint: {
217
+ withScrollableParents(elements: HTMLElement[]): this;
218
+ /**
219
+ * Configures the drop list so that a different element is used as the container for the
220
+ * dragged items. This is useful for the cases when one might not have control over the
221
+ * full DOM that sets up the dragging.
222
+ * Note that the alternate container needs to be a descendant of the drop list.
223
+ * @param container New element container to be assigned.
224
+ */
225
+ withElementContainer(container: HTMLElement): this;
226
+ /** Gets the scrollable parents that are registered with this drop container. */
227
+ getScrollableParents(): readonly HTMLElement[];
228
+ /**
229
+ * Figures out the index of an item in the container.
230
+ * @param item Item whose index should be determined.
231
+ */
232
+ getItemIndex(item: DragRef): number;
233
+ /**
234
+ * Whether the list is able to receive the item that
235
+ * is currently being dragged inside a connected drop list.
236
+ */
237
+ isReceiving(): boolean;
238
+ /**
239
+ * Sorts an item inside the container based on its position.
240
+ * @param item Item to be sorted.
241
+ * @param pointerX Position of the item along the X axis.
242
+ * @param pointerY Position of the item along the Y axis.
243
+ * @param pointerDelta Direction in which the pointer is moving along each axis.
244
+ */
245
+ _sortItem(item: DragRef, pointerX: number, pointerY: number, pointerDelta: {
248
246
  x: number;
249
247
  y: number;
250
- };
251
- /** Native event that caused the dragging to stop. */
252
- event: MouseEvent | TouchEvent;
253
- }
254
-
255
- /** Event emitted when the user moves an item into a new drop container. */
256
- export declare interface CdkDragEnter<T = any, I = T> {
257
- /** Container into which the user has moved the item. */
258
- container: CdkDropList<T>;
259
- /** Item that was moved into the container. */
260
- item: CdkDrag<I>;
261
- /** Index at which the item has entered the container. */
262
- currentIndex: number;
263
- }
264
-
265
- /**
266
- * Event emitted when the user removes an item from a
267
- * drop container by moving it into another one.
268
- */
269
- export declare interface CdkDragExit<T = any, I = T> {
270
- /** Container from which the user has a removed an item. */
271
- container: CdkDropList<T>;
272
- /** Item that was removed from the container. */
273
- item: CdkDrag<I>;
248
+ }): void;
249
+ /**
250
+ * Checks whether the user's pointer is close to the edges of either the
251
+ * viewport or the drop list and starts the auto-scroll sequence.
252
+ * @param pointerX User's pointer position along the x axis.
253
+ * @param pointerY User's pointer position along the y axis.
254
+ */
255
+ _startScrollingIfNecessary(pointerX: number, pointerY: number): void;
256
+ /** Stops any currently-running auto-scroll sequences. */
257
+ _stopScrolling(): void;
258
+ /** Starts the dragging sequence within the list. */
259
+ private _draggingStarted;
260
+ /** Caches the positions of the configured scrollable parents. */
261
+ private _cacheParentPositions;
262
+ /** Resets the container to its initial state. */
263
+ private _reset;
264
+ /** Starts the interval that'll auto-scroll the element. */
265
+ private _startScrollInterval;
266
+ /**
267
+ * Checks whether the user's pointer is positioned over the container.
268
+ * @param x Pointer position along the X axis.
269
+ * @param y Pointer position along the Y axis.
270
+ */
271
+ _isOverContainer(x: number, y: number): boolean;
272
+ /**
273
+ * Figures out whether an item should be moved into a sibling
274
+ * drop container, based on its current position.
275
+ * @param item Drag item that is being moved.
276
+ * @param x Position of the item along the X axis.
277
+ * @param y Position of the item along the Y axis.
278
+ */
279
+ _getSiblingContainerFromPosition(item: DragRef, x: number, y: number): DropListRef | undefined;
280
+ /**
281
+ * Checks whether the drop list can receive the passed-in item.
282
+ * @param item Item that is being dragged into the list.
283
+ * @param x Position of the item along the X axis.
284
+ * @param y Position of the item along the Y axis.
285
+ */
286
+ _canReceive(item: DragRef, x: number, y: number): boolean;
287
+ /**
288
+ * Called by one of the connected drop lists when a dragging sequence has started.
289
+ * @param sibling Sibling in which dragging has started.
290
+ */
291
+ _startReceiving(sibling: DropListRef, items: DragRef[]): void;
292
+ /**
293
+ * Called by a connected drop list when dragging has stopped.
294
+ * @param sibling Sibling whose dragging has stopped.
295
+ */
296
+ _stopReceiving(sibling: DropListRef): void;
297
+ /**
298
+ * Starts listening to scroll events on the viewport.
299
+ * Used for updating the internal state of the list.
300
+ */
301
+ private _listenToScrollEvents;
302
+ /**
303
+ * Lazily resolves and returns the shadow root of the element. We do this in a function, rather
304
+ * than saving it in property directly on init, because we want to resolve it as late as possible
305
+ * in order to ensure that the element has been moved into the shadow DOM. Doing it inside the
306
+ * constructor might be too early if the element is inside of something like `ngFor` or `ngIf`.
307
+ */
308
+ private _getShadowRoot;
309
+ /** Notifies any siblings that may potentially receive the item. */
310
+ private _notifyReceivingSiblings;
274
311
  }
275
312
 
276
- /** Handle that can be used to drag a CdkDrag instance. */
277
- export declare class CdkDragHandle implements AfterViewInit, OnDestroy {
313
+ /** Container that wraps a set of draggable items. */
314
+ declare class CdkDropList<T = any> implements OnDestroy {
278
315
  element: ElementRef<HTMLElement>;
279
- private _parentDrag;
280
- private _dragDropRegistry;
281
- /** Emits when the state of the handle has changed. */
282
- readonly _stateChanges: Subject<CdkDragHandle>;
283
- /** Whether starting to drag through this handle is disabled. */
284
- get disabled(): boolean;
285
- set disabled(value: boolean);
286
- private _disabled;
287
- constructor(...args: unknown[]);
288
- ngAfterViewInit(): void;
289
- ngOnDestroy(): void;
290
- static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragHandle, never>;
291
- static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragHandle, "[cdkDragHandle]", never, { "disabled": { "alias": "cdkDragHandleDisabled"; "required": false; }; }, {}, never, never, true, never>;
292
- static ngAcceptInputType_disabled: unknown;
293
- }
294
-
295
- /** Event emitted as the user is dragging a draggable item. */
296
- export declare interface CdkDragMove<T = any> {
297
- /** Item that is being dragged. */
298
- source: CdkDrag<T>;
299
- /** Position of the user's pointer on the page. */
300
- pointerPosition: {
301
- x: number;
302
- y: number;
303
- };
304
- /** Native event that is causing the dragging. */
305
- event: MouseEvent | TouchEvent;
306
- /** Distance in pixels that the user has dragged since the drag sequence started. */
307
- distance: {
308
- x: number;
309
- y: number;
310
- };
311
- /**
312
- * Indicates the direction in which the user is dragging the element along each axis.
313
- * `1` means that the position is increasing (e.g. the user is moving to the right or downwards),
314
- * whereas `-1` means that it's decreasing (they're moving to the left or upwards). `0` means
315
- * that the position hasn't changed.
316
- */
317
- delta: {
318
- x: -1 | 0 | 1;
319
- y: -1 | 0 | 1;
320
- };
321
- }
322
-
323
- /**
324
- * Element that will be used as a template for the placeholder of a CdkDrag when
325
- * it is being dragged. The placeholder is displayed in place of the element being dragged.
326
- */
327
- export declare class CdkDragPlaceholder<T = any> implements OnDestroy {
328
- templateRef: TemplateRef<T>;
329
- private _drag;
330
- /** Context data to be added to the placeholder template instance. */
331
- data: T;
332
- constructor(...args: unknown[]);
333
- ngOnDestroy(): void;
334
- static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragPlaceholder<any>, never>;
335
- static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragPlaceholder<any>, "ng-template[cdkDragPlaceholder]", never, { "data": { "alias": "data"; "required": false; }; }, {}, never, never, true, never>;
336
- }
337
-
338
- /**
339
- * Element that will be used as a template for the preview
340
- * of a CdkDrag when it is being dragged.
341
- */
342
- export declare class CdkDragPreview<T = any> implements OnDestroy {
343
- templateRef: TemplateRef<T>;
344
- private _drag;
345
- /** Context data to be added to the preview template instance. */
346
- data: T;
347
- /** Whether the preview should preserve the same size as the item that is being dragged. */
348
- matchSize: boolean;
349
- constructor(...args: unknown[]);
350
- ngOnDestroy(): void;
351
- static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragPreview<any>, never>;
352
- static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragPreview<any>, "ng-template[cdkDragPreview]", never, { "data": { "alias": "data"; "required": false; }; "matchSize": { "alias": "matchSize"; "required": false; }; }, {}, never, never, true, never>;
353
- static ngAcceptInputType_matchSize: unknown;
354
- }
355
-
356
- /** Event emitted when the user releases an item, before any animations have started. */
357
- export declare interface CdkDragRelease<T = any> {
358
- /** Draggable that emitted the event. */
359
- source: CdkDrag<T>;
360
- /** Native event that caused the release event. */
361
- event: MouseEvent | TouchEvent;
362
- }
363
-
364
- /** Event emitted when the user swaps the position of two drag items. */
365
- export declare interface CdkDragSortEvent<T = any, I = T> {
366
- /** Index from which the item was sorted previously. */
367
- previousIndex: number;
368
- /** Index that the item is currently in. */
369
- currentIndex: number;
370
- /** Container that the item belongs to. */
371
- container: CdkDropList<T>;
372
- /** Item that is being sorted. */
373
- item: CdkDrag<I>;
374
- }
375
-
376
- /** Event emitted when the user starts dragging a draggable. */
377
- export declare interface CdkDragStart<T = any> {
378
- /** Draggable that emitted the event. */
379
- source: CdkDrag<T>;
380
- /** Native event that started the drag sequence. */
381
- event: MouseEvent | TouchEvent;
382
- }
383
-
384
- /** Container that wraps a set of draggable items. */
385
- export declare class CdkDropList<T = any> implements OnDestroy {
386
- element: ElementRef<HTMLElement>;
387
- private _changeDetectorRef;
388
- private _scrollDispatcher;
389
- private _dir;
390
- private _group;
391
- /** Emits when the list has been destroyed. */
392
- private readonly _destroyed;
393
- /** Whether the element's scrollable parents have been resolved. */
394
- private _scrollableParentsResolved;
395
- /** Keeps track of the drop lists that are currently on the page. */
396
- private static _dropLists;
397
- /** Reference to the underlying drop list instance. */
398
- _dropListRef: DropListRef<CdkDropList<T>>;
399
- /**
400
- * Other draggable containers that this container is connected to and into which the
401
- * container's items can be transferred. Can either be references to other drop containers,
402
- * or their unique IDs.
403
- */
404
- connectedTo: (CdkDropList | string)[] | CdkDropList | string;
405
- /** Arbitrary data to attach to this container. */
406
- data: T;
407
- /** Direction in which the list is oriented. */
408
- orientation: DropListOrientation;
409
- /**
410
- * Unique ID for the drop zone. Can be used as a reference
411
- * in the `connectedTo` of another `CdkDropList`.
412
- */
413
- id: string;
414
- /** Locks the position of the draggable elements inside the container along the specified axis. */
415
- lockAxis: DragAxis;
416
- /** Whether starting a dragging sequence from this container is disabled. */
316
+ private _changeDetectorRef;
317
+ private _scrollDispatcher;
318
+ private _dir;
319
+ private _group;
320
+ /** Emits when the list has been destroyed. */
321
+ private readonly _destroyed;
322
+ /** Whether the element's scrollable parents have been resolved. */
323
+ private _scrollableParentsResolved;
324
+ /** Keeps track of the drop lists that are currently on the page. */
325
+ private static _dropLists;
326
+ /** Reference to the underlying drop list instance. */
327
+ _dropListRef: DropListRef<CdkDropList<T>>;
328
+ /**
329
+ * Other draggable containers that this container is connected to and into which the
330
+ * container's items can be transferred. Can either be references to other drop containers,
331
+ * or their unique IDs.
332
+ */
333
+ connectedTo: (CdkDropList | string)[] | CdkDropList | string;
334
+ /** Arbitrary data to attach to this container. */
335
+ data: T;
336
+ /** Direction in which the list is oriented. */
337
+ orientation: DropListOrientation;
338
+ /**
339
+ * Unique ID for the drop zone. Can be used as a reference
340
+ * in the `connectedTo` of another `CdkDropList`.
341
+ */
342
+ id: string;
343
+ /** Locks the position of the draggable elements inside the container along the specified axis. */
344
+ lockAxis: DragAxis;
345
+ /** Whether starting a dragging sequence from this container is disabled. */
417
346
  get disabled(): boolean;
418
347
  set disabled(value: boolean);
419
348
  private _disabled;
@@ -489,419 +418,293 @@ export declare class CdkDropList<T = any> implements OnDestroy {
489
418
  static ngAcceptInputType_autoScrollDisabled: unknown;
490
419
  }
491
420
 
421
+ /** Event emitted when the user starts dragging a draggable. */
422
+ interface CdkDragStart<T = any> {
423
+ /** Draggable that emitted the event. */
424
+ source: CdkDrag<T>;
425
+ /** Native event that started the drag sequence. */
426
+ event: MouseEvent | TouchEvent;
427
+ }
428
+ /** Event emitted when the user releases an item, before any animations have started. */
429
+ interface CdkDragRelease<T = any> {
430
+ /** Draggable that emitted the event. */
431
+ source: CdkDrag<T>;
432
+ /** Native event that caused the release event. */
433
+ event: MouseEvent | TouchEvent;
434
+ }
435
+ /** Event emitted when the user stops dragging a draggable. */
436
+ interface CdkDragEnd<T = any> {
437
+ /** Draggable that emitted the event. */
438
+ source: CdkDrag<T>;
439
+ /** Distance in pixels that the user has dragged since the drag sequence started. */
440
+ distance: {
441
+ x: number;
442
+ y: number;
443
+ };
444
+ /** Position where the pointer was when the item was dropped */
445
+ dropPoint: {
446
+ x: number;
447
+ y: number;
448
+ };
449
+ /** Native event that caused the dragging to stop. */
450
+ event: MouseEvent | TouchEvent;
451
+ }
452
+ /** Event emitted when the user moves an item into a new drop container. */
453
+ interface CdkDragEnter<T = any, I = T> {
454
+ /** Container into which the user has moved the item. */
455
+ container: CdkDropList<T>;
456
+ /** Item that was moved into the container. */
457
+ item: CdkDrag<I>;
458
+ /** Index at which the item has entered the container. */
459
+ currentIndex: number;
460
+ }
461
+ /**
462
+ * Event emitted when the user removes an item from a
463
+ * drop container by moving it into another one.
464
+ */
465
+ interface CdkDragExit<T = any, I = T> {
466
+ /** Container from which the user has a removed an item. */
467
+ container: CdkDropList<T>;
468
+ /** Item that was removed from the container. */
469
+ item: CdkDrag<I>;
470
+ }
471
+ /** Event emitted when the user drops a draggable item inside a drop container. */
472
+ interface CdkDragDrop<T, O = T, I = any> {
473
+ /** Index of the item when it was picked up. */
474
+ previousIndex: number;
475
+ /** Current index of the item. */
476
+ currentIndex: number;
477
+ /** Item that is being dropped. */
478
+ item: CdkDrag<I>;
479
+ /** Container in which the item was dropped. */
480
+ container: CdkDropList<T>;
481
+ /** Container from which the item was picked up. Can be the same as the `container`. */
482
+ previousContainer: CdkDropList<O>;
483
+ /** Whether the user's pointer was over the container when the item was dropped. */
484
+ isPointerOverContainer: boolean;
485
+ /** Distance in pixels that the user has dragged since the drag sequence started. */
486
+ distance: {
487
+ x: number;
488
+ y: number;
489
+ };
490
+ /** Position where the pointer was when the item was dropped */
491
+ dropPoint: {
492
+ x: number;
493
+ y: number;
494
+ };
495
+ /** Native event that caused the drop event. */
496
+ event: MouseEvent | TouchEvent;
497
+ }
498
+ /** Event emitted as the user is dragging a draggable item. */
499
+ interface CdkDragMove<T = any> {
500
+ /** Item that is being dragged. */
501
+ source: CdkDrag<T>;
502
+ /** Position of the user's pointer on the page. */
503
+ pointerPosition: {
504
+ x: number;
505
+ y: number;
506
+ };
507
+ /** Native event that is causing the dragging. */
508
+ event: MouseEvent | TouchEvent;
509
+ /** Distance in pixels that the user has dragged since the drag sequence started. */
510
+ distance: {
511
+ x: number;
512
+ y: number;
513
+ };
514
+ /**
515
+ * Indicates the direction in which the user is dragging the element along each axis.
516
+ * `1` means that the position is increasing (e.g. the user is moving to the right or downwards),
517
+ * whereas `-1` means that it's decreasing (they're moving to the left or upwards). `0` means
518
+ * that the position hasn't changed.
519
+ */
520
+ delta: {
521
+ x: -1 | 0 | 1;
522
+ y: -1 | 0 | 1;
523
+ };
524
+ }
525
+ /** Event emitted when the user swaps the position of two drag items. */
526
+ interface CdkDragSortEvent<T = any, I = T> {
527
+ /** Index from which the item was sorted previously. */
528
+ previousIndex: number;
529
+ /** Index that the item is currently in. */
530
+ currentIndex: number;
531
+ /** Container that the item belongs to. */
532
+ container: CdkDropList<T>;
533
+ /** Item that is being sorted. */
534
+ item: CdkDrag<I>;
535
+ }
536
+
492
537
  /**
493
- * Declaratively connects sibling `cdkDropList` instances together. All of the `cdkDropList`
494
- * elements that are placed inside a `cdkDropListGroup` will be connected to each other
495
- * automatically. Can be used as an alternative to the `cdkDropListConnectedTo` input
496
- * from `cdkDropList`.
538
+ * Injection token that can be used to reference instances of `CdkDragHandle`. It serves as
539
+ * alternative token to the actual `CdkDragHandle` class which could cause unnecessary
540
+ * retention of the class and its directive metadata.
497
541
  */
498
- export declare class CdkDropListGroup<T> implements OnDestroy {
499
- /** Drop lists registered inside the group. */
500
- readonly _items: Set<T>;
501
- /** Whether starting a dragging sequence from inside this group is disabled. */
502
- disabled: boolean;
542
+ declare const CDK_DRAG_HANDLE: InjectionToken<CdkDragHandle>;
543
+ /** Handle that can be used to drag a CdkDrag instance. */
544
+ declare class CdkDragHandle implements AfterViewInit, OnDestroy {
545
+ element: ElementRef<HTMLElement>;
546
+ private _parentDrag;
547
+ private _dragDropRegistry;
548
+ /** Emits when the state of the handle has changed. */
549
+ readonly _stateChanges: Subject<CdkDragHandle>;
550
+ /** Whether starting to drag through this handle is disabled. */
551
+ get disabled(): boolean;
552
+ set disabled(value: boolean);
553
+ private _disabled;
554
+ constructor(...args: unknown[]);
555
+ ngAfterViewInit(): void;
503
556
  ngOnDestroy(): void;
504
- static ɵfac: i0.ɵɵFactoryDeclaration<CdkDropListGroup<any>, never>;
505
- static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDropListGroup<any>, "[cdkDropListGroup]", ["cdkDropListGroup"], { "disabled": { "alias": "cdkDropListGroupDisabled"; "required": false; }; }, {}, never, never, true, never>;
557
+ static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragHandle, never>;
558
+ static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragHandle, "[cdkDragHandle]", never, { "disabled": { "alias": "cdkDragHandleDisabled"; "required": false; }; }, {}, never, never, true, never>;
506
559
  static ngAcceptInputType_disabled: unknown;
507
560
  }
508
561
 
509
562
  /**
510
- * Copies an item from one array to another, leaving it in its
511
- * original position in current array.
512
- * @param currentArray Array from which to copy the item.
513
- * @param targetArray Array into which is copy the item.
514
- * @param currentIndex Index of the item in its current array.
515
- * @param targetIndex Index at which to insert the item.
516
- *
563
+ * Injection token that can be used to reference instances of `CdkDragPlaceholder`. It serves as
564
+ * alternative token to the actual `CdkDragPlaceholder` class which could cause unnecessary
565
+ * retention of the class and its directive metadata.
517
566
  */
518
- export declare function copyArrayItem<T = any>(currentArray: T[], targetArray: T[], currentIndex: number, targetIndex: number): void;
519
-
520
- /** Possible axis along which dragging can be locked. */
521
- export declare type DragAxis = 'x' | 'y';
522
-
523
- /** Function that can be used to constrain the position of a dragged element. */
524
- export declare type DragConstrainPosition = (point: Point, dragRef: DragRef) => Point;
525
-
567
+ declare const CDK_DRAG_PLACEHOLDER: InjectionToken<CdkDragPlaceholder<any>>;
526
568
  /**
527
- * Service that allows for drag-and-drop functionality to be attached to DOM elements.
569
+ * Element that will be used as a template for the placeholder of a CdkDrag when
570
+ * it is being dragged. The placeholder is displayed in place of the element being dragged.
528
571
  */
529
- export declare class DragDrop {
530
- private _document;
531
- private _ngZone;
532
- private _viewportRuler;
533
- private _dragDropRegistry;
534
- private _renderer;
572
+ declare class CdkDragPlaceholder<T = any> implements OnDestroy {
573
+ templateRef: TemplateRef<T>;
574
+ private _drag;
575
+ /** Context data to be added to the placeholder template instance. */
576
+ data: T;
535
577
  constructor(...args: unknown[]);
536
- /**
537
- * Turns an element into a draggable item.
538
- * @param element Element to which to attach the dragging functionality.
539
- * @param config Object used to configure the dragging behavior.
540
- */
541
- createDrag<T = any>(element: ElementRef<HTMLElement> | HTMLElement, config?: DragRefConfig): DragRef<T>;
542
- /**
543
- * Turns an element into a drop list.
544
- * @param element Element to which to attach the drop list functionality.
545
- */
546
- createDropList<T = any>(element: ElementRef<HTMLElement> | HTMLElement): DropListRef<T>;
547
- static ɵfac: i0.ɵɵFactoryDeclaration<DragDrop, never>;
548
- static ɵprov: i0.ɵɵInjectableDeclaration<DragDrop>;
578
+ ngOnDestroy(): void;
579
+ static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragPlaceholder<any>, never>;
580
+ static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragPlaceholder<any>, "ng-template[cdkDragPlaceholder]", never, { "data": { "alias": "data"; "required": false; }; }, {}, never, never, true, never>;
549
581
  }
550
582
 
551
583
  /**
552
- * Object that can be used to configure the drag
553
- * items and drop lists within a module or a component.
584
+ * Injection token that can be used to reference instances of `CdkDragPreview`. It serves as
585
+ * alternative token to the actual `CdkDragPreview` class which could cause unnecessary
586
+ * retention of the class and its directive metadata.
554
587
  */
555
- export declare interface DragDropConfig extends Partial<DragRefConfig> {
556
- lockAxis?: DragAxis;
557
- dragStartDelay?: DragStartDelay;
558
- constrainPosition?: DragConstrainPosition;
559
- previewClass?: string | string[];
560
- boundaryElement?: string;
561
- rootElementSelector?: string;
562
- draggingDisabled?: boolean;
563
- sortingDisabled?: boolean;
564
- listAutoScrollDisabled?: boolean;
565
- listOrientation?: DropListOrientation;
566
- zIndex?: number;
567
- previewContainer?: 'global' | 'parent';
568
- }
569
-
570
- export declare class DragDropModule {
571
- static ɵfac: i0.ɵɵFactoryDeclaration<DragDropModule, never>;
572
- static ɵmod: i0.ɵɵNgModuleDeclaration<DragDropModule, never, [typeof i1.CdkDropList, typeof i2.CdkDropListGroup, typeof i3.CdkDrag, typeof i4.CdkDragHandle, typeof i5.CdkDragPreview, typeof i6.CdkDragPlaceholder], [typeof i7.CdkScrollableModule, typeof i1.CdkDropList, typeof i2.CdkDropListGroup, typeof i3.CdkDrag, typeof i4.CdkDragHandle, typeof i5.CdkDragPreview, typeof i6.CdkDragPlaceholder]>;
573
- static ɵinj: i0.ɵɵInjectorDeclaration<DragDropModule>;
574
- }
575
-
588
+ declare const CDK_DRAG_PREVIEW: InjectionToken<CdkDragPreview<any>>;
576
589
  /**
577
- * Service that keeps track of all the drag item and drop container
578
- * instances, and manages global event listeners on the `document`.
579
- * @docs-private
590
+ * Element that will be used as a template for the preview
591
+ * of a CdkDrag when it is being dragged.
580
592
  */
581
- export declare class DragDropRegistry<_ = unknown, __ = unknown> implements OnDestroy {
582
- private _ngZone;
583
- private _document;
584
- private _styleLoader;
585
- private _renderer;
586
- private _cleanupDocumentTouchmove;
587
- /** Registered drop container instances. */
588
- private _dropInstances;
589
- /** Registered drag item instances. */
590
- private _dragInstances;
591
- /** Drag item instances that are currently being dragged. */
592
- private _activeDragInstances;
593
- /** Keeps track of the event listeners that we've bound to the `document`. */
594
- private _globalListeners;
595
- /**
596
- * Predicate function to check if an item is being dragged. Moved out into a property,
597
- * because it'll be called a lot and we don't want to create a new function every time.
598
- */
599
- private _draggingPredicate;
600
- /**
601
- * Map tracking DOM nodes and their corresponding drag directives. Note that this is different
602
- * from looking through the `_dragInstances` and getting their root node, because the root node
603
- * isn't necessarily the node that the directive is set on.
604
- */
605
- private _domNodesToDirectives;
606
- /**
607
- * Emits the `touchmove` or `mousemove` events that are dispatched
608
- * while the user is dragging a drag item instance.
609
- */
610
- readonly pointerMove: Subject<TouchEvent | MouseEvent>;
611
- /**
612
- * Emits the `touchend` or `mouseup` events that are dispatched
613
- * while the user is dragging a drag item instance.
614
- */
615
- readonly pointerUp: Subject<TouchEvent | MouseEvent>;
616
- /**
617
- * Emits when the viewport has been scrolled while the user is dragging an item.
618
- * @deprecated To be turned into a private member. Use the `scrolled` method instead.
619
- * @breaking-change 13.0.0
620
- */
621
- readonly scroll: Subject<Event>;
593
+ declare class CdkDragPreview<T = any> implements OnDestroy {
594
+ templateRef: TemplateRef<T>;
595
+ private _drag;
596
+ /** Context data to be added to the preview template instance. */
597
+ data: T;
598
+ /** Whether the preview should preserve the same size as the item that is being dragged. */
599
+ matchSize: boolean;
622
600
  constructor(...args: unknown[]);
623
- /** Adds a drop container to the registry. */
624
- registerDropContainer(drop: DropListRef): void;
625
- /** Adds a drag item instance to the registry. */
626
- registerDragItem(drag: DragRef): void;
627
- /** Removes a drop container from the registry. */
628
- removeDropContainer(drop: DropListRef): void;
629
- /** Removes a drag item instance from the registry. */
630
- removeDragItem(drag: DragRef): void;
631
- /**
632
- * Starts the dragging sequence for a drag instance.
633
- * @param drag Drag instance which is being dragged.
634
- * @param event Event that initiated the dragging.
635
- */
636
- startDragging(drag: DragRef, event: TouchEvent | MouseEvent): void;
637
- /** Stops dragging a drag item instance. */
638
- stopDragging(drag: DragRef): void;
639
- /** Gets whether a drag item instance is currently being dragged. */
640
- isDragging(drag: DragRef): boolean;
641
- /**
642
- * Gets a stream that will emit when any element on the page is scrolled while an item is being
643
- * dragged.
644
- * @param shadowRoot Optional shadow root that the current dragging sequence started from.
645
- * Top-level listeners won't pick up events coming from the shadow DOM so this parameter can
646
- * be used to include an additional top-level listener at the shadow root level.
647
- */
648
- scrolled(shadowRoot?: DocumentOrShadowRoot | null): Observable<Event>;
649
- /**
650
- * Tracks the DOM node which has a draggable directive.
651
- * @param node Node to track.
652
- * @param dragRef Drag directive set on the node.
653
- */
654
- registerDirectiveNode(node: Node, dragRef: CdkDrag): void;
655
- /**
656
- * Stops tracking a draggable directive node.
657
- * @param node Node to stop tracking.
658
- */
659
- removeDirectiveNode(node: Node): void;
660
- /**
661
- * Gets the drag directive corresponding to a specific DOM node, if any.
662
- * @param node Node for which to do the lookup.
663
- */
664
- getDragDirectiveForNode(node: Node): CdkDrag | null;
665
601
  ngOnDestroy(): void;
666
- /**
667
- * Event listener that will prevent the default browser action while the user is dragging.
668
- * @param event Event whose default action should be prevented.
669
- */
670
- private _preventDefaultWhileDragging;
671
- /** Event listener for `touchmove` that is bound even if no dragging is happening. */
672
- private _persistentTouchmoveListener;
673
- /** Clears out the global event listeners from the `document`. */
674
- private _clearGlobalListeners;
675
- static ɵfac: i0.ɵɵFactoryDeclaration<DragDropRegistry<any, any>, never>;
676
- static ɵprov: i0.ɵɵInjectableDeclaration<DragDropRegistry<any, any>>;
677
- }
678
-
679
- /** Template that can be used to create a drag helper element (e.g. a preview or a placeholder). */
680
- declare interface DragHelperTemplate<T = any> {
681
- template: TemplateRef<T> | null;
682
- viewContainer: ViewContainerRef;
683
- context: T;
684
- }
685
-
686
- /** Template that can be used to create a drag preview element. */
687
- declare interface DragPreviewTemplate<T = any> {
688
- matchSize?: boolean;
689
- template: TemplateRef<T> | null;
690
- viewContainer: ViewContainerRef;
691
- context: T;
602
+ static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragPreview<any>, never>;
603
+ static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragPreview<any>, "ng-template[cdkDragPreview]", never, { "data": { "alias": "data"; "required": false; }; "matchSize": { "alias": "matchSize"; "required": false; }; }, {}, never, never, true, never>;
604
+ static ngAcceptInputType_matchSize: unknown;
692
605
  }
693
606
 
694
607
  /**
695
- * Reference to a draggable item. Used to manipulate or dispose of the item.
608
+ * Injection token that can be used to reference instances of `CdkDropList`. It serves as
609
+ * alternative token to the actual `CdkDropList` class which could cause unnecessary
610
+ * retention of the class and its directive metadata.
696
611
  */
697
- export declare class DragRef<T = any> {
698
- private _config;
699
- private _document;
612
+ declare const CDK_DROP_LIST: InjectionToken<CdkDropList<any>>;
613
+ /** Element that can be moved inside a CdkDropList container. */
614
+ declare class CdkDrag<T = any> implements AfterViewInit, OnChanges, OnDestroy {
615
+ element: ElementRef<HTMLElement>;
616
+ dropContainer: CdkDropList<any>;
700
617
  private _ngZone;
701
- private _viewportRuler;
618
+ private _viewContainerRef;
619
+ private _dir;
620
+ private _changeDetectorRef;
621
+ private _selfHandle;
622
+ private _parentDrag;
702
623
  private _dragDropRegistry;
703
- private _renderer;
704
- private _rootElementCleanups;
705
- private _cleanupShadowRootSelectStart;
706
- /** Element displayed next to the user's pointer while the element is dragged. */
707
- private _preview;
708
- /** Container into which to insert the preview. */
709
- private _previewContainer;
710
- /** Reference to the view of the placeholder element. */
711
- private _placeholderRef;
712
- /** Element that is rendered instead of the draggable item while it is being sorted. */
713
- private _placeholder;
714
- /** Coordinates within the element at which the user picked up the element. */
715
- private _pickupPositionInElement;
716
- /** Coordinates on the page at which the user picked up the element. */
717
- private _pickupPositionOnPage;
718
- /**
719
- * Anchor node used to save the place in the DOM where the element was
720
- * picked up so that it can be restored at the end of the drag sequence.
721
- */
722
- private _anchor;
723
- /**
724
- * CSS `transform` applied to the element when it isn't being dragged. We need a
725
- * passive transform in order for the dragged element to retain its new position
726
- * after the user has stopped dragging and because we need to know the relative
727
- * position in case they start dragging again. This corresponds to `element.style.transform`.
728
- */
729
- private _passiveTransform;
730
- /** CSS `transform` that is applied to the element while it's being dragged. */
731
- private _activeTransform;
732
- /** Inline `transform` value that the element had before the first dragging sequence. */
733
- private _initialTransform?;
734
- /**
735
- * Whether the dragging sequence has been started. Doesn't
736
- * necessarily mean that the element has been moved.
737
- */
738
- private _hasStartedDragging;
739
- /** Whether the element has moved since the user started dragging it. */
740
- private _hasMoved;
741
- /** Drop container in which the DragRef resided when dragging began. */
742
- private _initialContainer;
743
- /** Index at which the item started in its initial container. */
744
- private _initialIndex;
745
- /** Cached positions of scrollable parent elements. */
746
- private _parentPositions;
747
- /** Emits when the item is being moved. */
748
- private readonly _moveEvents;
749
- /** Keeps track of the direction in which the user is dragging along each axis. */
750
- private _pointerDirectionDelta;
751
- /** Pointer position at which the last change in the delta occurred. */
752
- private _pointerPositionAtLastDirectionChange;
753
- /** Position of the pointer at the last pointer event. */
754
- private _lastKnownPointerPosition;
755
- /**
756
- * Root DOM node of the drag instance. This is the element that will
757
- * be moved around as the user is dragging.
758
- */
759
- private _rootElement;
760
- /**
761
- * Nearest ancestor SVG, relative to which coordinates are calculated if dragging SVGElement
762
- */
763
- private _ownerSVGElement;
764
- /**
765
- * Inline style value of `-webkit-tap-highlight-color` at the time the
766
- * dragging was started. Used to restore the value once we're done dragging.
767
- */
768
- private _rootElementTapHighlight;
769
- /** Subscription to pointer movement events. */
770
- private _pointerMoveSubscription;
771
- /** Subscription to the event that is dispatched when the user lifts their pointer. */
772
- private _pointerUpSubscription;
773
- /** Subscription to the viewport being scrolled. */
774
- private _scrollSubscription;
775
- /** Subscription to the viewport being resized. */
776
- private _resizeSubscription;
777
- /**
778
- * Time at which the last touch event occurred. Used to avoid firing the same
779
- * events multiple times on touch devices where the browser will fire a fake
780
- * mouse event for each touch event, after a certain time.
781
- */
782
- private _lastTouchEventTime;
783
- /** Time at which the last dragging sequence was started. */
784
- private _dragStartTime;
785
- /** Cached reference to the boundary element. */
786
- private _boundaryElement;
787
- /** Whether the native dragging interactions have been enabled on the root element. */
788
- private _nativeInteractionsEnabled;
789
- /** Client rect of the root element when the dragging sequence has started. */
790
- private _initialDomRect?;
791
- /** Cached dimensions of the preview element. Should be read via `_getPreviewRect`. */
792
- private _previewRect?;
793
- /** Cached dimensions of the boundary element. */
794
- private _boundaryRect?;
795
- /** Element that will be used as a template to create the draggable item's preview. */
796
- private _previewTemplate?;
797
- /** Template for placeholder element rendered to show where a draggable would be dropped. */
798
- private _placeholderTemplate?;
799
- /** Elements that can be used to drag the draggable item. */
624
+ private readonly _destroyed;
800
625
  private _handles;
801
- /** Registered handles that are currently disabled. */
802
- private _disabledHandles;
803
- /** Droppable container that the draggable is a part of. */
804
- private _dropContainer?;
805
- /** Layout direction of the item. */
806
- private _direction;
807
- /** Ref that the current drag item is nested in. */
808
- private _parentDragRef;
626
+ private _previewTemplate;
627
+ private _placeholderTemplate;
628
+ /** Reference to the underlying drag instance. */
629
+ _dragRef: DragRef<CdkDrag<T>>;
630
+ /** Arbitrary data to attach to this drag instance. */
631
+ data: T;
632
+ /** Locks the position of the dragged element along the specified axis. */
633
+ lockAxis: DragAxis;
809
634
  /**
810
- * Cached shadow root that the element is placed in. `null` means that the element isn't in
811
- * the shadow DOM and `undefined` means that it hasn't been resolved yet. Should be read via
812
- * `_getShadowRoot`, not directly.
635
+ * Selector that will be used to determine the root draggable element, starting from
636
+ * the `cdkDrag` element and going up the DOM. Passing an alternate root element is useful
637
+ * when trying to enable dragging on an element that you might not have access to.
813
638
  */
814
- private _cachedShadowRoot;
815
- /** Axis along which dragging is locked. */
816
- lockAxis: 'x' | 'y';
639
+ rootElementSelector: string;
640
+ /**
641
+ * Node or selector that will be used to determine the element to which the draggable's
642
+ * position will be constrained. If a string is passed in, it'll be used as a selector that
643
+ * will be matched starting from the element's parent and going up the DOM until a match
644
+ * has been found.
645
+ */
646
+ boundaryElement: string | ElementRef<HTMLElement> | HTMLElement;
817
647
  /**
818
648
  * Amount of milliseconds to wait after the user has put their
819
649
  * pointer down before starting to drag the element.
820
650
  */
821
- dragStartDelay: number | {
822
- touch: number;
823
- mouse: number;
824
- };
825
- /** Class to be added to the preview element. */
826
- previewClass: string | string[] | undefined;
651
+ dragStartDelay: DragStartDelay;
827
652
  /**
828
- * If the parent of the dragged element has a `scale` transform, it can throw off the
829
- * positioning when the user starts dragging. Use this input to notify the CDK of the scale.
653
+ * Sets the position of a `CdkDrag` that is outside of a drop container.
654
+ * Can be used to restore the element's position for a returning user.
830
655
  */
831
- scale: number;
656
+ freeDragPosition: Point;
832
657
  /** Whether starting to drag this element is disabled. */
833
658
  get disabled(): boolean;
834
659
  set disabled(value: boolean);
835
660
  private _disabled;
836
- /** Emits as the drag sequence is being prepared. */
837
- readonly beforeStarted: Subject<void>;
661
+ /**
662
+ * Function that can be used to customize the logic of how the position of the drag item
663
+ * is limited while it's being dragged. Gets called with a point containing the current position
664
+ * of the user's pointer on the page, a reference to the item being dragged and its dimensions.
665
+ * Should return a point describing where the item should be rendered.
666
+ */
667
+ constrainPosition?: (userPointerPosition: Point, dragRef: DragRef, dimensions: DOMRect, pickupPositionInElement: Point) => Point;
668
+ /** Class to be added to the preview element. */
669
+ previewClass: string | string[];
670
+ /**
671
+ * Configures the place into which the preview of the item will be inserted. Can be configured
672
+ * globally through `CDK_DROP_LIST`. Possible values:
673
+ * - `global` - Preview will be inserted at the bottom of the `<body>`. The advantage is that
674
+ * you don't have to worry about `overflow: hidden` or `z-index`, but the item won't retain
675
+ * its inherited styles.
676
+ * - `parent` - Preview will be inserted into the parent of the drag item. The advantage is that
677
+ * inherited styles will be preserved, but it may be clipped by `overflow: hidden` or not be
678
+ * visible due to `z-index`. Furthermore, the preview is going to have an effect over selectors
679
+ * like `:nth-child` and some flexbox configurations.
680
+ * - `ElementRef<HTMLElement> | HTMLElement` - Preview will be inserted into a specific element.
681
+ * Same advantages and disadvantages as `parent`.
682
+ */
683
+ previewContainer: PreviewContainer;
684
+ /**
685
+ * If the parent of the dragged element has a `scale` transform, it can throw off the
686
+ * positioning when the user starts dragging. Use this input to notify the CDK of the scale.
687
+ */
688
+ scale: number;
838
689
  /** Emits when the user starts dragging the item. */
839
- readonly started: Subject<{
840
- source: DragRef;
841
- event: MouseEvent | TouchEvent;
842
- }>;
690
+ readonly started: EventEmitter<CdkDragStart>;
843
691
  /** Emits when the user has released a drag item, before any animations have started. */
844
- readonly released: Subject<{
845
- source: DragRef;
846
- event: MouseEvent | TouchEvent;
847
- }>;
692
+ readonly released: EventEmitter<CdkDragRelease>;
848
693
  /** Emits when the user stops dragging an item in the container. */
849
- readonly ended: Subject<{
850
- source: DragRef;
851
- distance: Point;
852
- dropPoint: Point;
853
- event: MouseEvent | TouchEvent;
854
- }>;
694
+ readonly ended: EventEmitter<CdkDragEnd>;
855
695
  /** Emits when the user has moved the item into a new container. */
856
- readonly entered: Subject<{
857
- container: DropListRef;
858
- item: DragRef;
859
- currentIndex: number;
860
- }>;
696
+ readonly entered: EventEmitter<CdkDragEnter<any>>;
861
697
  /** Emits when the user removes the item its container by dragging it into another container. */
862
- readonly exited: Subject<{
863
- container: DropListRef;
864
- item: DragRef;
865
- }>;
698
+ readonly exited: EventEmitter<CdkDragExit<any>>;
866
699
  /** Emits when the user drops the item inside a container. */
867
- readonly dropped: Subject<{
868
- previousIndex: number;
869
- currentIndex: number;
870
- item: DragRef;
871
- container: DropListRef;
872
- previousContainer: DropListRef;
873
- distance: Point;
874
- dropPoint: Point;
875
- isPointerOverContainer: boolean;
876
- event: MouseEvent | TouchEvent;
877
- }>;
700
+ readonly dropped: EventEmitter<CdkDragDrop<any>>;
878
701
  /**
879
702
  * Emits as the user is dragging the item. Use with caution,
880
703
  * because this event will fire for every pixel that the user has dragged.
881
704
  */
882
- readonly moved: Observable<{
883
- source: DragRef;
884
- pointerPosition: {
885
- x: number;
886
- y: number;
887
- };
888
- event: MouseEvent | TouchEvent;
889
- distance: Point;
890
- delta: {
891
- x: -1 | 0 | 1;
892
- y: -1 | 0 | 1;
893
- };
894
- }>;
895
- /** Arbitrary data that can be attached to the drag item. */
896
- data: T;
897
- /**
898
- * Function that can be used to customize the logic of how the position of the drag item
899
- * is limited while it's being dragged. Gets called with a point containing the current position
900
- * of the user's pointer on the page, a reference to the item being dragged and its dimensions.
901
- * Should return a point describing where the item should be rendered.
902
- */
903
- constrainPosition?: (userPointerPosition: Point, dragRef: DragRef, dimensions: DOMRect, pickupPositionInElement: Point) => Point;
904
- constructor(element: ElementRef<HTMLElement> | HTMLElement, _config: DragRefConfig, _document: Document, _ngZone: NgZone, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry, _renderer: Renderer2);
705
+ readonly moved: Observable<CdkDragMove<T>>;
706
+ private _injector;
707
+ constructor(...args: unknown[]);
905
708
  /**
906
709
  * Returns the element that is being used as a placeholder
907
710
  * while the current element is being dragged.
@@ -909,458 +712,565 @@ export declare class DragRef<T = any> {
909
712
  getPlaceholderElement(): HTMLElement;
910
713
  /** Returns the root draggable element. */
911
714
  getRootElement(): HTMLElement;
715
+ /** Resets a standalone drag item to its initial position. */
716
+ reset(): void;
912
717
  /**
913
- * Gets the currently-visible element that represents the drag item.
914
- * While dragging this is the placeholder, otherwise it's the root element.
718
+ * Gets the pixel coordinates of the draggable outside of a drop container.
915
719
  */
916
- getVisibleElement(): HTMLElement;
917
- /** Registers the handles that can be used to drag the element. */
918
- withHandles(handles: (HTMLElement | ElementRef<HTMLElement>)[]): this;
720
+ getFreeDragPosition(): Readonly<Point>;
919
721
  /**
920
- * Registers the template that should be used for the drag preview.
921
- * @param template Template that from which to stamp out the preview.
722
+ * Sets the current position in pixels the draggable outside of a drop container.
723
+ * @param value New position to be set.
922
724
  */
923
- withPreviewTemplate(template: DragPreviewTemplate | null): this;
725
+ setFreeDragPosition(value: Point): void;
726
+ ngAfterViewInit(): void;
727
+ ngOnChanges(changes: SimpleChanges): void;
728
+ ngOnDestroy(): void;
729
+ _addHandle(handle: CdkDragHandle): void;
730
+ _removeHandle(handle: CdkDragHandle): void;
731
+ _setPreviewTemplate(preview: CdkDragPreview): void;
732
+ _resetPreviewTemplate(preview: CdkDragPreview): void;
733
+ _setPlaceholderTemplate(placeholder: CdkDragPlaceholder): void;
734
+ _resetPlaceholderTemplate(placeholder: CdkDragPlaceholder): void;
735
+ /** Syncs the root element with the `DragRef`. */
736
+ private _updateRootElement;
737
+ /** Gets the boundary element, based on the `boundaryElement` value. */
738
+ private _getBoundaryElement;
739
+ /** Syncs the inputs of the CdkDrag with the options of the underlying DragRef. */
740
+ private _syncInputs;
741
+ /** Handles the events from the underlying `DragRef`. */
742
+ private _handleEvents;
743
+ /** Assigns the default input values based on a provided config object. */
744
+ private _assignDefaults;
745
+ /** Sets up the listener that syncs the handles with the drag ref. */
746
+ private _setupHandlesListener;
747
+ static ɵfac: i0.ɵɵFactoryDeclaration<CdkDrag<any>, never>;
748
+ static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDrag<any>, "[cdkDrag]", ["cdkDrag"], { "data": { "alias": "cdkDragData"; "required": false; }; "lockAxis": { "alias": "cdkDragLockAxis"; "required": false; }; "rootElementSelector": { "alias": "cdkDragRootElement"; "required": false; }; "boundaryElement": { "alias": "cdkDragBoundary"; "required": false; }; "dragStartDelay": { "alias": "cdkDragStartDelay"; "required": false; }; "freeDragPosition": { "alias": "cdkDragFreeDragPosition"; "required": false; }; "disabled": { "alias": "cdkDragDisabled"; "required": false; }; "constrainPosition": { "alias": "cdkDragConstrainPosition"; "required": false; }; "previewClass": { "alias": "cdkDragPreviewClass"; "required": false; }; "previewContainer": { "alias": "cdkDragPreviewContainer"; "required": false; }; "scale": { "alias": "cdkDragScale"; "required": false; }; }, { "started": "cdkDragStarted"; "released": "cdkDragReleased"; "ended": "cdkDragEnded"; "entered": "cdkDragEntered"; "exited": "cdkDragExited"; "dropped": "cdkDragDropped"; "moved": "cdkDragMoved"; }, never, never, true, never>;
749
+ static ngAcceptInputType_disabled: unknown;
750
+ static ngAcceptInputType_scale: unknown;
751
+ }
752
+
753
+ /**
754
+ * Service that keeps track of all the drag item and drop container
755
+ * instances, and manages global event listeners on the `document`.
756
+ * @docs-private
757
+ */
758
+ declare class DragDropRegistry<_ = unknown, __ = unknown> implements OnDestroy {
759
+ private _ngZone;
760
+ private _document;
761
+ private _styleLoader;
762
+ private _renderer;
763
+ private _cleanupDocumentTouchmove;
764
+ /** Registered drop container instances. */
765
+ private _dropInstances;
766
+ /** Registered drag item instances. */
767
+ private _dragInstances;
768
+ /** Drag item instances that are currently being dragged. */
769
+ private _activeDragInstances;
770
+ /** Keeps track of the event listeners that we've bound to the `document`. */
771
+ private _globalListeners;
924
772
  /**
925
- * Registers the template that should be used for the drag placeholder.
926
- * @param template Template that from which to stamp out the placeholder.
773
+ * Predicate function to check if an item is being dragged. Moved out into a property,
774
+ * because it'll be called a lot and we don't want to create a new function every time.
927
775
  */
928
- withPlaceholderTemplate(template: DragHelperTemplate | null): this;
776
+ private _draggingPredicate;
929
777
  /**
930
- * Sets an alternate drag root element. The root element is the element that will be moved as
931
- * the user is dragging. Passing an alternate root element is useful when trying to enable
932
- * dragging on an element that you might not have access to.
778
+ * Map tracking DOM nodes and their corresponding drag directives. Note that this is different
779
+ * from looking through the `_dragInstances` and getting their root node, because the root node
780
+ * isn't necessarily the node that the directive is set on.
933
781
  */
934
- withRootElement(rootElement: ElementRef<HTMLElement> | HTMLElement): this;
782
+ private _domNodesToDirectives;
935
783
  /**
936
- * Element to which the draggable's position will be constrained.
784
+ * Emits the `touchmove` or `mousemove` events that are dispatched
785
+ * while the user is dragging a drag item instance.
937
786
  */
938
- withBoundaryElement(boundaryElement: ElementRef<HTMLElement> | HTMLElement | null): this;
939
- /** Sets the parent ref that the ref is nested in. */
940
- withParent(parent: DragRef<unknown> | null): this;
941
- /** Removes the dragging functionality from the DOM element. */
942
- dispose(): void;
943
- /** Checks whether the element is currently being dragged. */
944
- isDragging(): boolean;
945
- /** Resets a standalone drag item to its initial position. */
946
- reset(): void;
787
+ readonly pointerMove: Subject<TouchEvent | MouseEvent>;
947
788
  /**
948
- * Sets a handle as disabled. While a handle is disabled, it'll capture and interrupt dragging.
949
- * @param handle Handle element that should be disabled.
789
+ * Emits the `touchend` or `mouseup` events that are dispatched
790
+ * while the user is dragging a drag item instance.
950
791
  */
951
- disableHandle(handle: HTMLElement): void;
792
+ readonly pointerUp: Subject<TouchEvent | MouseEvent>;
952
793
  /**
953
- * Enables a handle, if it has been disabled.
954
- * @param handle Handle element to be enabled.
794
+ * Emits when the viewport has been scrolled while the user is dragging an item.
795
+ * @deprecated To be turned into a private member. Use the `scrolled` method instead.
796
+ * @breaking-change 13.0.0
955
797
  */
956
- enableHandle(handle: HTMLElement): void;
957
- /** Sets the layout direction of the draggable item. */
958
- withDirection(direction: Direction): this;
959
- /** Sets the container that the item is part of. */
960
- _withDropContainer(container: DropListRef): void;
798
+ readonly scroll: Subject<Event>;
799
+ constructor(...args: unknown[]);
800
+ /** Adds a drop container to the registry. */
801
+ registerDropContainer(drop: DropListRef): void;
802
+ /** Adds a drag item instance to the registry. */
803
+ registerDragItem(drag: DragRef): void;
804
+ /** Removes a drop container from the registry. */
805
+ removeDropContainer(drop: DropListRef): void;
806
+ /** Removes a drag item instance from the registry. */
807
+ removeDragItem(drag: DragRef): void;
961
808
  /**
962
- * Gets the current position in pixels the draggable outside of a drop container.
809
+ * Starts the dragging sequence for a drag instance.
810
+ * @param drag Drag instance which is being dragged.
811
+ * @param event Event that initiated the dragging.
812
+ */
813
+ startDragging(drag: DragRef, event: TouchEvent | MouseEvent): void;
814
+ /** Stops dragging a drag item instance. */
815
+ stopDragging(drag: DragRef): void;
816
+ /** Gets whether a drag item instance is currently being dragged. */
817
+ isDragging(drag: DragRef): boolean;
818
+ /**
819
+ * Gets a stream that will emit when any element on the page is scrolled while an item is being
820
+ * dragged.
821
+ * @param shadowRoot Optional shadow root that the current dragging sequence started from.
822
+ * Top-level listeners won't pick up events coming from the shadow DOM so this parameter can
823
+ * be used to include an additional top-level listener at the shadow root level.
963
824
  */
964
- getFreeDragPosition(): Readonly<Point>;
825
+ scrolled(shadowRoot?: DocumentOrShadowRoot | null): Observable<Event>;
965
826
  /**
966
- * Sets the current position in pixels the draggable outside of a drop container.
967
- * @param value New position to be set.
827
+ * Tracks the DOM node which has a draggable directive.
828
+ * @param node Node to track.
829
+ * @param dragRef Drag directive set on the node.
968
830
  */
969
- setFreeDragPosition(value: Point): this;
831
+ registerDirectiveNode(node: Node, dragRef: CdkDrag): void;
970
832
  /**
971
- * Sets the container into which to insert the preview element.
972
- * @param value Container into which to insert the preview.
833
+ * Stops tracking a draggable directive node.
834
+ * @param node Node to stop tracking.
973
835
  */
974
- withPreviewContainer(value: PreviewContainer): this;
975
- /** Updates the item's sort order based on the last-known pointer position. */
976
- _sortFromLastPointerPosition(): void;
977
- /** Unsubscribes from the global subscriptions. */
978
- private _removeListeners;
979
- /** Destroys the preview element and its ViewRef. */
980
- private _destroyPreview;
981
- /** Destroys the placeholder element and its ViewRef. */
982
- private _destroyPlaceholder;
983
- /** Handler for the `mousedown`/`touchstart` events. */
984
- private _pointerDown;
985
- /** Handler that is invoked when the user moves their pointer after they've initiated a drag. */
986
- private _pointerMove;
987
- /** Handler that is invoked when the user lifts their pointer up, after initiating a drag. */
988
- private _pointerUp;
836
+ removeDirectiveNode(node: Node): void;
989
837
  /**
990
- * Clears subscriptions and stops the dragging sequence.
991
- * @param event Browser event object that ended the sequence.
838
+ * Gets the drag directive corresponding to a specific DOM node, if any.
839
+ * @param node Node for which to do the lookup.
992
840
  */
993
- private _endDragSequence;
994
- /** Starts the dragging sequence. */
995
- private _startDragSequence;
841
+ getDragDirectiveForNode(node: Node): CdkDrag | null;
842
+ ngOnDestroy(): void;
996
843
  /**
997
- * Sets up the different variables and subscriptions
998
- * that will be necessary for the dragging sequence.
999
- * @param referenceElement Element that started the drag sequence.
1000
- * @param event Browser event object that started the sequence.
844
+ * Event listener that will prevent the default browser action while the user is dragging.
845
+ * @param event Event whose default action should be prevented.
1001
846
  */
1002
- private _initializeDragSequence;
1003
- /** Cleans up the DOM artifacts that were added to facilitate the element being dragged. */
1004
- private _cleanupDragArtifacts;
847
+ private _preventDefaultWhileDragging;
848
+ /** Event listener for `touchmove` that is bound even if no dragging is happening. */
849
+ private _persistentTouchmoveListener;
850
+ /** Clears out the global event listeners from the `document`. */
851
+ private _clearGlobalListeners;
852
+ static ɵfac: i0.ɵɵFactoryDeclaration<DragDropRegistry<any, any>, never>;
853
+ static ɵprov: i0.ɵɵInjectableDeclaration<DragDropRegistry<any, any>>;
854
+ }
855
+
856
+ /** Template that can be used to create a drag preview element. */
857
+ interface DragPreviewTemplate<T = any> {
858
+ matchSize?: boolean;
859
+ template: TemplateRef<T> | null;
860
+ viewContainer: ViewContainerRef;
861
+ context: T;
862
+ }
863
+
864
+ /** Object that can be used to configure the behavior of DragRef. */
865
+ interface DragRefConfig {
1005
866
  /**
1006
- * Updates the item's position in its drop container, or moves it
1007
- * into a new one, depending on its current drag position.
867
+ * Minimum amount of pixels that the user should
868
+ * drag, before the CDK initiates a drag sequence.
1008
869
  */
1009
- private _updateActiveDropContainer;
870
+ dragStartThreshold: number;
1010
871
  /**
1011
- * Animates the preview element from its current position to the location of the drop placeholder.
1012
- * @returns Promise that resolves when the animation completes.
872
+ * Amount the pixels the user should drag before the CDK
873
+ * considers them to have changed the drag direction.
1013
874
  */
1014
- private _animatePreviewToPlaceholder;
1015
- /** Creates an element that will be shown instead of the current element while dragging. */
1016
- private _createPlaceholderElement;
875
+ pointerDirectionChangeThreshold: number;
876
+ /** `z-index` for the absolutely-positioned elements that are created by the drag item. */
877
+ zIndex?: number;
878
+ /** Ref that the current drag item is nested in. */
879
+ parentDragRef?: DragRef;
880
+ }
881
+ /** Template that can be used to create a drag helper element (e.g. a preview or a placeholder). */
882
+ interface DragHelperTemplate<T = any> {
883
+ template: TemplateRef<T> | null;
884
+ viewContainer: ViewContainerRef;
885
+ context: T;
886
+ }
887
+ /** Point on the page or within an element. */
888
+ interface Point {
889
+ x: number;
890
+ y: number;
891
+ }
892
+ /**
893
+ * Possible places into which the preview of a drag item can be inserted.
894
+ * - `global` - Preview will be inserted at the bottom of the `<body>`. The advantage is that
895
+ * you don't have to worry about `overflow: hidden` or `z-index`, but the item won't retain
896
+ * its inherited styles.
897
+ * - `parent` - Preview will be inserted into the parent of the drag item. The advantage is that
898
+ * inherited styles will be preserved, but it may be clipped by `overflow: hidden` or not be
899
+ * visible due to `z-index`. Furthermore, the preview is going to have an effect over selectors
900
+ * like `:nth-child` and some flexbox configurations.
901
+ * - `ElementRef<HTMLElement> | HTMLElement` - Preview will be inserted into a specific element.
902
+ * Same advantages and disadvantages as `parent`.
903
+ */
904
+ type PreviewContainer = 'global' | 'parent' | ElementRef<HTMLElement> | HTMLElement;
905
+ /**
906
+ * Reference to a draggable item. Used to manipulate or dispose of the item.
907
+ */
908
+ declare class DragRef<T = any> {
909
+ private _config;
910
+ private _document;
911
+ private _ngZone;
912
+ private _viewportRuler;
913
+ private _dragDropRegistry;
914
+ private _renderer;
915
+ private _rootElementCleanups;
916
+ private _cleanupShadowRootSelectStart;
917
+ /** Element displayed next to the user's pointer while the element is dragged. */
918
+ private _preview;
919
+ /** Container into which to insert the preview. */
920
+ private _previewContainer;
921
+ /** Reference to the view of the placeholder element. */
922
+ private _placeholderRef;
923
+ /** Element that is rendered instead of the draggable item while it is being sorted. */
924
+ private _placeholder;
925
+ /** Coordinates within the element at which the user picked up the element. */
926
+ private _pickupPositionInElement;
927
+ /** Coordinates on the page at which the user picked up the element. */
928
+ private _pickupPositionOnPage;
1017
929
  /**
1018
- * Figures out the coordinates at which an element was picked up.
1019
- * @param referenceElement Element that initiated the dragging.
1020
- * @param event Event that initiated the dragging.
930
+ * Anchor node used to save the place in the DOM where the element was
931
+ * picked up so that it can be restored at the end of the drag sequence.
1021
932
  */
1022
- private _getPointerPositionInElement;
1023
- /** Determines the point of the page that was touched by the user. */
1024
- private _getPointerPositionOnPage;
1025
- /** Gets the pointer position on the page, accounting for any position constraints. */
1026
- private _getConstrainedPointerPosition;
1027
- /** Updates the current drag delta, based on the user's current pointer position on the page. */
1028
- private _updatePointerDirectionDelta;
1029
- /** Toggles the native drag interactions, based on how many handles are registered. */
1030
- private _toggleNativeDragInteractions;
1031
- /** Removes the manually-added event listeners from the root element. */
1032
- private _removeRootElementListeners;
933
+ private _anchor;
1033
934
  /**
1034
- * Applies a `transform` to the root element, taking into account any existing transforms on it.
1035
- * @param x New transform value along the X axis.
1036
- * @param y New transform value along the Y axis.
935
+ * CSS `transform` applied to the element when it isn't being dragged. We need a
936
+ * passive transform in order for the dragged element to retain its new position
937
+ * after the user has stopped dragging and because we need to know the relative
938
+ * position in case they start dragging again. This corresponds to `element.style.transform`.
1037
939
  */
1038
- private _applyRootElementTransform;
940
+ private _passiveTransform;
941
+ /** CSS `transform` that is applied to the element while it's being dragged. */
942
+ private _activeTransform;
943
+ /** Inline `transform` value that the element had before the first dragging sequence. */
944
+ private _initialTransform?;
1039
945
  /**
1040
- * Applies a `transform` to the preview, taking into account any existing transforms on it.
1041
- * @param x New transform value along the X axis.
1042
- * @param y New transform value along the Y axis.
946
+ * Whether the dragging sequence has been started. Doesn't
947
+ * necessarily mean that the element has been moved.
1043
948
  */
1044
- private _applyPreviewTransform;
949
+ private _hasStartedDragging;
950
+ /** Whether the element has moved since the user started dragging it. */
951
+ private _hasMoved;
952
+ /** Drop container in which the DragRef resided when dragging began. */
953
+ private _initialContainer;
954
+ /** Index at which the item started in its initial container. */
955
+ private _initialIndex;
956
+ /** Cached positions of scrollable parent elements. */
957
+ private _parentPositions;
958
+ /** Emits when the item is being moved. */
959
+ private readonly _moveEvents;
960
+ /** Keeps track of the direction in which the user is dragging along each axis. */
961
+ private _pointerDirectionDelta;
962
+ /** Pointer position at which the last change in the delta occurred. */
963
+ private _pointerPositionAtLastDirectionChange;
964
+ /** Position of the pointer at the last pointer event. */
965
+ private _lastKnownPointerPosition;
1045
966
  /**
1046
- * Gets the distance that the user has dragged during the current drag sequence.
1047
- * @param currentPosition Current position of the user's pointer.
967
+ * Root DOM node of the drag instance. This is the element that will
968
+ * be moved around as the user is dragging.
1048
969
  */
1049
- private _getDragDistance;
1050
- /** Cleans up any cached element dimensions that we don't need after dragging has stopped. */
1051
- private _cleanupCachedDimensions;
970
+ private _rootElement;
1052
971
  /**
1053
- * Checks whether the element is still inside its boundary after the viewport has been resized.
1054
- * If not, the position is adjusted so that the element fits again.
972
+ * Nearest ancestor SVG, relative to which coordinates are calculated if dragging SVGElement
1055
973
  */
1056
- private _containInsideBoundaryOnResize;
1057
- /** Gets the drag start delay, based on the event type. */
1058
- private _getDragStartDelay;
1059
- /** Updates the internal state of the draggable element when scrolling has occurred. */
1060
- private _updateOnScroll;
1061
- /** Gets the scroll position of the viewport. */
1062
- private _getViewportScrollPosition;
974
+ private _ownerSVGElement;
1063
975
  /**
1064
- * Lazily resolves and returns the shadow root of the element. We do this in a function, rather
1065
- * than saving it in property directly on init, because we want to resolve it as late as possible
1066
- * in order to ensure that the element has been moved into the shadow DOM. Doing it inside the
1067
- * constructor might be too early if the element is inside of something like `ngFor` or `ngIf`.
976
+ * Inline style value of `-webkit-tap-highlight-color` at the time the
977
+ * dragging was started. Used to restore the value once we're done dragging.
1068
978
  */
1069
- private _getShadowRoot;
1070
- /** Gets the element into which the drag preview should be inserted. */
1071
- private _getPreviewInsertionPoint;
1072
- /** Lazily resolves and returns the dimensions of the preview. */
1073
- private _getPreviewRect;
1074
- /** Handles a native `dragstart` event. */
1075
- private _nativeDragStart;
1076
- /** Gets a handle that is the target of an event. */
1077
- private _getTargetHandle;
1078
- }
1079
-
1080
- /** Object that can be used to configure the behavior of DragRef. */
1081
- export declare interface DragRefConfig {
979
+ private _rootElementTapHighlight;
980
+ /** Subscription to pointer movement events. */
981
+ private _pointerMoveSubscription;
982
+ /** Subscription to the event that is dispatched when the user lifts their pointer. */
983
+ private _pointerUpSubscription;
984
+ /** Subscription to the viewport being scrolled. */
985
+ private _scrollSubscription;
986
+ /** Subscription to the viewport being resized. */
987
+ private _resizeSubscription;
1082
988
  /**
1083
- * Minimum amount of pixels that the user should
1084
- * drag, before the CDK initiates a drag sequence.
989
+ * Time at which the last touch event occurred. Used to avoid firing the same
990
+ * events multiple times on touch devices where the browser will fire a fake
991
+ * mouse event for each touch event, after a certain time.
1085
992
  */
1086
- dragStartThreshold: number;
993
+ private _lastTouchEventTime;
994
+ /** Time at which the last dragging sequence was started. */
995
+ private _dragStartTime;
996
+ /** Cached reference to the boundary element. */
997
+ private _boundaryElement;
998
+ /** Whether the native dragging interactions have been enabled on the root element. */
999
+ private _nativeInteractionsEnabled;
1000
+ /** Client rect of the root element when the dragging sequence has started. */
1001
+ private _initialDomRect?;
1002
+ /** Cached dimensions of the preview element. Should be read via `_getPreviewRect`. */
1003
+ private _previewRect?;
1004
+ /** Cached dimensions of the boundary element. */
1005
+ private _boundaryRect?;
1006
+ /** Element that will be used as a template to create the draggable item's preview. */
1007
+ private _previewTemplate?;
1008
+ /** Template for placeholder element rendered to show where a draggable would be dropped. */
1009
+ private _placeholderTemplate?;
1010
+ /** Elements that can be used to drag the draggable item. */
1011
+ private _handles;
1012
+ /** Registered handles that are currently disabled. */
1013
+ private _disabledHandles;
1014
+ /** Droppable container that the draggable is a part of. */
1015
+ private _dropContainer?;
1016
+ /** Layout direction of the item. */
1017
+ private _direction;
1018
+ /** Ref that the current drag item is nested in. */
1019
+ private _parentDragRef;
1087
1020
  /**
1088
- * Amount the pixels the user should drag before the CDK
1089
- * considers them to have changed the drag direction.
1021
+ * Cached shadow root that the element is placed in. `null` means that the element isn't in
1022
+ * the shadow DOM and `undefined` means that it hasn't been resolved yet. Should be read via
1023
+ * `_getShadowRoot`, not directly.
1090
1024
  */
1091
- pointerDirectionChangeThreshold: number;
1092
- /** `z-index` for the absolutely-positioned elements that are created by the drag item. */
1093
- zIndex?: number;
1094
- /** Ref that the current drag item is nested in. */
1095
- parentDragRef?: DragRef;
1096
- }
1097
-
1098
- /** Possible values that can be used to configure the drag start delay. */
1099
- export declare type DragStartDelay = number | {
1100
- touch: number;
1101
- mouse: number;
1102
- };
1103
-
1104
- /** Possible orientations for a drop list. */
1105
- export declare type DropListOrientation = 'horizontal' | 'vertical' | 'mixed';
1106
-
1107
- /**
1108
- * Reference to a drop list. Used to manipulate or dispose of the container.
1109
- */
1110
- export declare class DropListRef<T = any> {
1111
- private _dragDropRegistry;
1112
- private _ngZone;
1113
- private _viewportRuler;
1114
- /** Element that the drop list is attached to. */
1115
- element: HTMLElement | ElementRef<HTMLElement>;
1116
- /** Whether starting a dragging sequence from this container is disabled. */
1117
- disabled: boolean;
1118
- /** Whether sorting items within the list is disabled. */
1119
- sortingDisabled: boolean;
1120
- /** Locks the position of the draggable elements inside the container along the specified axis. */
1025
+ private _cachedShadowRoot;
1026
+ /** Axis along which dragging is locked. */
1121
1027
  lockAxis: 'x' | 'y';
1122
1028
  /**
1123
- * Whether auto-scrolling the view when the user
1124
- * moves their pointer close to the edges is disabled.
1029
+ * Amount of milliseconds to wait after the user has put their
1030
+ * pointer down before starting to drag the element.
1125
1031
  */
1126
- autoScrollDisabled: boolean;
1127
- /** Number of pixels to scroll for each frame when auto-scrolling an element. */
1128
- autoScrollStep: number;
1032
+ dragStartDelay: number | {
1033
+ touch: number;
1034
+ mouse: number;
1035
+ };
1036
+ /** Class to be added to the preview element. */
1037
+ previewClass: string | string[] | undefined;
1129
1038
  /**
1130
- * Function that is used to determine whether an item
1131
- * is allowed to be moved into a drop container.
1039
+ * If the parent of the dragged element has a `scale` transform, it can throw off the
1040
+ * positioning when the user starts dragging. Use this input to notify the CDK of the scale.
1132
1041
  */
1133
- enterPredicate: (drag: DragRef, drop: DropListRef) => boolean;
1134
- /** Function that is used to determine whether an item can be sorted into a particular index. */
1135
- sortPredicate: (index: number, drag: DragRef, drop: DropListRef) => boolean;
1136
- /** Emits right before dragging has started. */
1042
+ scale: number;
1043
+ /** Whether starting to drag this element is disabled. */
1044
+ get disabled(): boolean;
1045
+ set disabled(value: boolean);
1046
+ private _disabled;
1047
+ /** Emits as the drag sequence is being prepared. */
1137
1048
  readonly beforeStarted: Subject<void>;
1138
- /**
1139
- * Emits when the user has moved a new drag item into this container.
1140
- */
1049
+ /** Emits when the user starts dragging the item. */
1050
+ readonly started: Subject<{
1051
+ source: DragRef;
1052
+ event: MouseEvent | TouchEvent;
1053
+ }>;
1054
+ /** Emits when the user has released a drag item, before any animations have started. */
1055
+ readonly released: Subject<{
1056
+ source: DragRef;
1057
+ event: MouseEvent | TouchEvent;
1058
+ }>;
1059
+ /** Emits when the user stops dragging an item in the container. */
1060
+ readonly ended: Subject<{
1061
+ source: DragRef;
1062
+ distance: Point;
1063
+ dropPoint: Point;
1064
+ event: MouseEvent | TouchEvent;
1065
+ }>;
1066
+ /** Emits when the user has moved the item into a new container. */
1141
1067
  readonly entered: Subject<{
1142
- item: DragRef;
1143
1068
  container: DropListRef;
1069
+ item: DragRef;
1144
1070
  currentIndex: number;
1145
1071
  }>;
1146
- /**
1147
- * Emits when the user removes an item from the container
1148
- * by dragging it into another container.
1149
- */
1072
+ /** Emits when the user removes the item its container by dragging it into another container. */
1150
1073
  readonly exited: Subject<{
1151
- item: DragRef;
1152
1074
  container: DropListRef;
1075
+ item: DragRef;
1153
1076
  }>;
1154
- /** Emits when the user drops an item inside the container. */
1077
+ /** Emits when the user drops the item inside a container. */
1155
1078
  readonly dropped: Subject<{
1156
- item: DragRef;
1157
- currentIndex: number;
1158
1079
  previousIndex: number;
1080
+ currentIndex: number;
1081
+ item: DragRef;
1159
1082
  container: DropListRef;
1160
1083
  previousContainer: DropListRef;
1161
- isPointerOverContainer: boolean;
1162
1084
  distance: Point;
1163
1085
  dropPoint: Point;
1086
+ isPointerOverContainer: boolean;
1164
1087
  event: MouseEvent | TouchEvent;
1165
1088
  }>;
1166
- /** Emits as the user is swapping items while actively dragging. */
1167
- readonly sorted: Subject<{
1168
- previousIndex: number;
1169
- currentIndex: number;
1170
- container: DropListRef;
1171
- item: DragRef;
1172
- }>;
1173
- /** Emits when a dragging sequence is started in a list connected to the current one. */
1174
- readonly receivingStarted: Subject<{
1175
- receiver: DropListRef;
1176
- initiator: DropListRef;
1177
- items: DragRef[];
1178
- }>;
1179
- /** Emits when a dragging sequence is stopped from a list connected to the current one. */
1180
- readonly receivingStopped: Subject<{
1181
- receiver: DropListRef;
1182
- initiator: DropListRef;
1089
+ /**
1090
+ * Emits as the user is dragging the item. Use with caution,
1091
+ * because this event will fire for every pixel that the user has dragged.
1092
+ */
1093
+ readonly moved: Observable<{
1094
+ source: DragRef;
1095
+ pointerPosition: {
1096
+ x: number;
1097
+ y: number;
1098
+ };
1099
+ event: MouseEvent | TouchEvent;
1100
+ distance: Point;
1101
+ delta: {
1102
+ x: -1 | 0 | 1;
1103
+ y: -1 | 0 | 1;
1104
+ };
1183
1105
  }>;
1184
- /** Arbitrary data that can be attached to the drop list. */
1106
+ /** Arbitrary data that can be attached to the drag item. */
1185
1107
  data: T;
1186
- /** Element that is the direct parent of the drag items. */
1187
- private _container;
1188
- /** Whether an item in the list is being dragged. */
1189
- private _isDragging;
1190
- /** Keeps track of the positions of any parent scrollable elements. */
1191
- private _parentPositions;
1192
- /** Strategy being used to sort items within the list. */
1193
- private _sortStrategy;
1194
- /** Cached `DOMRect` of the drop list. */
1195
- private _domRect;
1196
- /** Draggable items in the container. */
1197
- private _draggables;
1198
- /** Drop lists that are connected to the current one. */
1199
- private _siblings;
1200
- /** Connected siblings that currently have a dragged item. */
1201
- private _activeSiblings;
1202
- /** Subscription to the window being scrolled. */
1203
- private _viewportScrollSubscription;
1204
- /** Vertical direction in which the list is currently scrolling. */
1205
- private _verticalScrollDirection;
1206
- /** Horizontal direction in which the list is currently scrolling. */
1207
- private _horizontalScrollDirection;
1208
- /** Node that is being auto-scrolled. */
1209
- private _scrollNode;
1210
- /** Used to signal to the current auto-scroll sequence when to stop. */
1211
- private readonly _stopScrollTimers;
1212
- /** Shadow root of the current element. Necessary for `elementFromPoint` to resolve correctly. */
1213
- private _cachedShadowRoot;
1214
- /** Reference to the document. */
1215
- private _document;
1216
- /** Elements that can be scrolled while the user is dragging. */
1217
- private _scrollableElements;
1218
- /** Initial value for the element's `scroll-snap-type` style. */
1219
- private _initialScrollSnap;
1220
- /** Direction of the list's layout. */
1221
- private _direction;
1222
- constructor(element: ElementRef<HTMLElement> | HTMLElement, _dragDropRegistry: DragDropRegistry, _document: any, _ngZone: NgZone, _viewportRuler: ViewportRuler);
1223
- /** Removes the drop list functionality from the DOM element. */
1224
- dispose(): void;
1225
- /** Whether an item from this list is currently being dragged. */
1226
- isDragging(): boolean;
1227
- /** Starts dragging an item. */
1228
- start(): void;
1229
1108
  /**
1230
- * Attempts to move an item into the container.
1231
- * @param item Item that was moved into the container.
1232
- * @param pointerX Position of the item along the X axis.
1233
- * @param pointerY Position of the item along the Y axis.
1234
- * @param index Index at which the item entered. If omitted, the container will try to figure it
1235
- * out automatically.
1109
+ * Function that can be used to customize the logic of how the position of the drag item
1110
+ * is limited while it's being dragged. Gets called with a point containing the current position
1111
+ * of the user's pointer on the page, a reference to the item being dragged and its dimensions.
1112
+ * Should return a point describing where the item should be rendered.
1236
1113
  */
1237
- enter(item: DragRef, pointerX: number, pointerY: number, index?: number): void;
1114
+ constrainPosition?: (userPointerPosition: Point, dragRef: DragRef, dimensions: DOMRect, pickupPositionInElement: Point) => Point;
1115
+ constructor(element: ElementRef<HTMLElement> | HTMLElement, _config: DragRefConfig, _document: Document, _ngZone: NgZone, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry, _renderer: Renderer2);
1238
1116
  /**
1239
- * Removes an item from the container after it was dragged into another container by the user.
1240
- * @param item Item that was dragged out.
1117
+ * Returns the element that is being used as a placeholder
1118
+ * while the current element is being dragged.
1241
1119
  */
1242
- exit(item: DragRef): void;
1120
+ getPlaceholderElement(): HTMLElement;
1121
+ /** Returns the root draggable element. */
1122
+ getRootElement(): HTMLElement;
1243
1123
  /**
1244
- * Drops an item into this container.
1245
- * @param item Item being dropped into the container.
1246
- * @param currentIndex Index at which the item should be inserted.
1247
- * @param previousIndex Index of the item when dragging started.
1248
- * @param previousContainer Container from which the item got dragged in.
1249
- * @param isPointerOverContainer Whether the user's pointer was over the
1250
- * container when the item was dropped.
1251
- * @param distance Distance the user has dragged since the start of the dragging sequence.
1252
- * @param event Event that triggered the dropping sequence.
1253
- *
1254
- * @breaking-change 15.0.0 `previousIndex` and `event` parameters to become required.
1124
+ * Gets the currently-visible element that represents the drag item.
1125
+ * While dragging this is the placeholder, otherwise it's the root element.
1255
1126
  */
1256
- drop(item: DragRef, currentIndex: number, previousIndex: number, previousContainer: DropListRef, isPointerOverContainer: boolean, distance: Point, dropPoint: Point, event?: MouseEvent | TouchEvent): void;
1127
+ getVisibleElement(): HTMLElement;
1128
+ /** Registers the handles that can be used to drag the element. */
1129
+ withHandles(handles: (HTMLElement | ElementRef<HTMLElement>)[]): this;
1257
1130
  /**
1258
- * Sets the draggable items that are a part of this list.
1259
- * @param items Items that are a part of this list.
1131
+ * Registers the template that should be used for the drag preview.
1132
+ * @param template Template that from which to stamp out the preview.
1260
1133
  */
1261
- withItems(items: DragRef[]): this;
1262
- /** Sets the layout direction of the drop list. */
1263
- withDirection(direction: Direction): this;
1134
+ withPreviewTemplate(template: DragPreviewTemplate | null): this;
1264
1135
  /**
1265
- * Sets the containers that are connected to this one. When two or more containers are
1266
- * connected, the user will be allowed to transfer items between them.
1267
- * @param connectedTo Other containers that the current containers should be connected to.
1136
+ * Registers the template that should be used for the drag placeholder.
1137
+ * @param template Template that from which to stamp out the placeholder.
1138
+ */
1139
+ withPlaceholderTemplate(template: DragHelperTemplate | null): this;
1140
+ /**
1141
+ * Sets an alternate drag root element. The root element is the element that will be moved as
1142
+ * the user is dragging. Passing an alternate root element is useful when trying to enable
1143
+ * dragging on an element that you might not have access to.
1144
+ */
1145
+ withRootElement(rootElement: ElementRef<HTMLElement> | HTMLElement): this;
1146
+ /**
1147
+ * Element to which the draggable's position will be constrained.
1148
+ */
1149
+ withBoundaryElement(boundaryElement: ElementRef<HTMLElement> | HTMLElement | null): this;
1150
+ /** Sets the parent ref that the ref is nested in. */
1151
+ withParent(parent: DragRef<unknown> | null): this;
1152
+ /** Removes the dragging functionality from the DOM element. */
1153
+ dispose(): void;
1154
+ /** Checks whether the element is currently being dragged. */
1155
+ isDragging(): boolean;
1156
+ /** Resets a standalone drag item to its initial position. */
1157
+ reset(): void;
1158
+ /**
1159
+ * Sets a handle as disabled. While a handle is disabled, it'll capture and interrupt dragging.
1160
+ * @param handle Handle element that should be disabled.
1268
1161
  */
1269
- connectedTo(connectedTo: DropListRef[]): this;
1162
+ disableHandle(handle: HTMLElement): void;
1270
1163
  /**
1271
- * Sets the orientation of the container.
1272
- * @param orientation New orientation for the container.
1164
+ * Enables a handle, if it has been disabled.
1165
+ * @param handle Handle element to be enabled.
1273
1166
  */
1274
- withOrientation(orientation: DropListOrientation): this;
1167
+ enableHandle(handle: HTMLElement): void;
1168
+ /** Sets the layout direction of the draggable item. */
1169
+ withDirection(direction: Direction): this;
1170
+ /** Sets the container that the item is part of. */
1171
+ _withDropContainer(container: DropListRef): void;
1275
1172
  /**
1276
- * Sets which parent elements are can be scrolled while the user is dragging.
1277
- * @param elements Elements that can be scrolled.
1173
+ * Gets the current position in pixels the draggable outside of a drop container.
1278
1174
  */
1279
- withScrollableParents(elements: HTMLElement[]): this;
1175
+ getFreeDragPosition(): Readonly<Point>;
1280
1176
  /**
1281
- * Configures the drop list so that a different element is used as the container for the
1282
- * dragged items. This is useful for the cases when one might not have control over the
1283
- * full DOM that sets up the dragging.
1284
- * Note that the alternate container needs to be a descendant of the drop list.
1285
- * @param container New element container to be assigned.
1177
+ * Sets the current position in pixels the draggable outside of a drop container.
1178
+ * @param value New position to be set.
1286
1179
  */
1287
- withElementContainer(container: HTMLElement): this;
1288
- /** Gets the scrollable parents that are registered with this drop container. */
1289
- getScrollableParents(): readonly HTMLElement[];
1180
+ setFreeDragPosition(value: Point): this;
1290
1181
  /**
1291
- * Figures out the index of an item in the container.
1292
- * @param item Item whose index should be determined.
1182
+ * Sets the container into which to insert the preview element.
1183
+ * @param value Container into which to insert the preview.
1293
1184
  */
1294
- getItemIndex(item: DragRef): number;
1185
+ withPreviewContainer(value: PreviewContainer): this;
1186
+ /** Updates the item's sort order based on the last-known pointer position. */
1187
+ _sortFromLastPointerPosition(): void;
1188
+ /** Unsubscribes from the global subscriptions. */
1189
+ private _removeListeners;
1190
+ /** Destroys the preview element and its ViewRef. */
1191
+ private _destroyPreview;
1192
+ /** Destroys the placeholder element and its ViewRef. */
1193
+ private _destroyPlaceholder;
1194
+ /** Handler for the `mousedown`/`touchstart` events. */
1195
+ private _pointerDown;
1196
+ /** Handler that is invoked when the user moves their pointer after they've initiated a drag. */
1197
+ private _pointerMove;
1198
+ /** Handler that is invoked when the user lifts their pointer up, after initiating a drag. */
1199
+ private _pointerUp;
1295
1200
  /**
1296
- * Whether the list is able to receive the item that
1297
- * is currently being dragged inside a connected drop list.
1201
+ * Clears subscriptions and stops the dragging sequence.
1202
+ * @param event Browser event object that ended the sequence.
1298
1203
  */
1299
- isReceiving(): boolean;
1204
+ private _endDragSequence;
1205
+ /** Starts the dragging sequence. */
1206
+ private _startDragSequence;
1300
1207
  /**
1301
- * Sorts an item inside the container based on its position.
1302
- * @param item Item to be sorted.
1303
- * @param pointerX Position of the item along the X axis.
1304
- * @param pointerY Position of the item along the Y axis.
1305
- * @param pointerDelta Direction in which the pointer is moving along each axis.
1208
+ * Sets up the different variables and subscriptions
1209
+ * that will be necessary for the dragging sequence.
1210
+ * @param referenceElement Element that started the drag sequence.
1211
+ * @param event Browser event object that started the sequence.
1306
1212
  */
1307
- _sortItem(item: DragRef, pointerX: number, pointerY: number, pointerDelta: {
1308
- x: number;
1309
- y: number;
1310
- }): void;
1213
+ private _initializeDragSequence;
1214
+ /** Cleans up the DOM artifacts that were added to facilitate the element being dragged. */
1215
+ private _cleanupDragArtifacts;
1311
1216
  /**
1312
- * Checks whether the user's pointer is close to the edges of either the
1313
- * viewport or the drop list and starts the auto-scroll sequence.
1314
- * @param pointerX User's pointer position along the x axis.
1315
- * @param pointerY User's pointer position along the y axis.
1217
+ * Updates the item's position in its drop container, or moves it
1218
+ * into a new one, depending on its current drag position.
1316
1219
  */
1317
- _startScrollingIfNecessary(pointerX: number, pointerY: number): void;
1318
- /** Stops any currently-running auto-scroll sequences. */
1319
- _stopScrolling(): void;
1320
- /** Starts the dragging sequence within the list. */
1321
- private _draggingStarted;
1322
- /** Caches the positions of the configured scrollable parents. */
1323
- private _cacheParentPositions;
1324
- /** Resets the container to its initial state. */
1325
- private _reset;
1326
- /** Starts the interval that'll auto-scroll the element. */
1327
- private _startScrollInterval;
1220
+ private _updateActiveDropContainer;
1328
1221
  /**
1329
- * Checks whether the user's pointer is positioned over the container.
1330
- * @param x Pointer position along the X axis.
1331
- * @param y Pointer position along the Y axis.
1222
+ * Animates the preview element from its current position to the location of the drop placeholder.
1223
+ * @returns Promise that resolves when the animation completes.
1332
1224
  */
1333
- _isOverContainer(x: number, y: number): boolean;
1225
+ private _animatePreviewToPlaceholder;
1226
+ /** Creates an element that will be shown instead of the current element while dragging. */
1227
+ private _createPlaceholderElement;
1334
1228
  /**
1335
- * Figures out whether an item should be moved into a sibling
1336
- * drop container, based on its current position.
1337
- * @param item Drag item that is being moved.
1338
- * @param x Position of the item along the X axis.
1339
- * @param y Position of the item along the Y axis.
1229
+ * Figures out the coordinates at which an element was picked up.
1230
+ * @param referenceElement Element that initiated the dragging.
1231
+ * @param event Event that initiated the dragging.
1340
1232
  */
1341
- _getSiblingContainerFromPosition(item: DragRef, x: number, y: number): DropListRef | undefined;
1233
+ private _getPointerPositionInElement;
1234
+ /** Determines the point of the page that was touched by the user. */
1235
+ private _getPointerPositionOnPage;
1236
+ /** Gets the pointer position on the page, accounting for any position constraints. */
1237
+ private _getConstrainedPointerPosition;
1238
+ /** Updates the current drag delta, based on the user's current pointer position on the page. */
1239
+ private _updatePointerDirectionDelta;
1240
+ /** Toggles the native drag interactions, based on how many handles are registered. */
1241
+ private _toggleNativeDragInteractions;
1242
+ /** Removes the manually-added event listeners from the root element. */
1243
+ private _removeRootElementListeners;
1342
1244
  /**
1343
- * Checks whether the drop list can receive the passed-in item.
1344
- * @param item Item that is being dragged into the list.
1345
- * @param x Position of the item along the X axis.
1346
- * @param y Position of the item along the Y axis.
1245
+ * Applies a `transform` to the root element, taking into account any existing transforms on it.
1246
+ * @param x New transform value along the X axis.
1247
+ * @param y New transform value along the Y axis.
1347
1248
  */
1348
- _canReceive(item: DragRef, x: number, y: number): boolean;
1249
+ private _applyRootElementTransform;
1349
1250
  /**
1350
- * Called by one of the connected drop lists when a dragging sequence has started.
1351
- * @param sibling Sibling in which dragging has started.
1251
+ * Applies a `transform` to the preview, taking into account any existing transforms on it.
1252
+ * @param x New transform value along the X axis.
1253
+ * @param y New transform value along the Y axis.
1352
1254
  */
1353
- _startReceiving(sibling: DropListRef, items: DragRef[]): void;
1255
+ private _applyPreviewTransform;
1354
1256
  /**
1355
- * Called by a connected drop list when dragging has stopped.
1356
- * @param sibling Sibling whose dragging has stopped.
1257
+ * Gets the distance that the user has dragged during the current drag sequence.
1258
+ * @param currentPosition Current position of the user's pointer.
1357
1259
  */
1358
- _stopReceiving(sibling: DropListRef): void;
1260
+ private _getDragDistance;
1261
+ /** Cleans up any cached element dimensions that we don't need after dragging has stopped. */
1262
+ private _cleanupCachedDimensions;
1359
1263
  /**
1360
- * Starts listening to scroll events on the viewport.
1361
- * Used for updating the internal state of the list.
1264
+ * Checks whether the element is still inside its boundary after the viewport has been resized.
1265
+ * If not, the position is adjusted so that the element fits again.
1362
1266
  */
1363
- private _listenToScrollEvents;
1267
+ private _containInsideBoundaryOnResize;
1268
+ /** Gets the drag start delay, based on the event type. */
1269
+ private _getDragStartDelay;
1270
+ /** Updates the internal state of the draggable element when scrolling has occurred. */
1271
+ private _updateOnScroll;
1272
+ /** Gets the scroll position of the viewport. */
1273
+ private _getViewportScrollPosition;
1364
1274
  /**
1365
1275
  * Lazily resolves and returns the shadow root of the element. We do this in a function, rather
1366
1276
  * than saving it in property directly on init, because we want to resolve it as late as possible
@@ -1368,51 +1278,48 @@ export declare class DropListRef<T = any> {
1368
1278
  * constructor might be too early if the element is inside of something like `ngFor` or `ngIf`.
1369
1279
  */
1370
1280
  private _getShadowRoot;
1371
- /** Notifies any siblings that may potentially receive the item. */
1372
- private _notifyReceivingSiblings;
1373
- }
1374
-
1375
- declare namespace i1 {
1376
- export {
1377
- CdkDropList
1378
- }
1379
- }
1380
-
1381
- declare namespace i2 {
1382
- export {
1383
- CDK_DROP_LIST_GROUP,
1384
- CdkDropListGroup
1385
- }
1386
- }
1387
-
1388
- declare namespace i3 {
1389
- export {
1390
- CDK_DROP_LIST,
1391
- CdkDrag
1392
- }
1393
- }
1394
-
1395
- declare namespace i4 {
1396
- export {
1397
- CDK_DRAG_HANDLE,
1398
- CdkDragHandle
1399
- }
1400
- }
1401
-
1402
- declare namespace i5 {
1403
- export {
1404
- CDK_DRAG_PREVIEW,
1405
- CdkDragPreview
1406
- }
1281
+ /** Gets the element into which the drag preview should be inserted. */
1282
+ private _getPreviewInsertionPoint;
1283
+ /** Lazily resolves and returns the dimensions of the preview. */
1284
+ private _getPreviewRect;
1285
+ /** Handles a native `dragstart` event. */
1286
+ private _nativeDragStart;
1287
+ /** Gets a handle that is the target of an event. */
1288
+ private _getTargetHandle;
1407
1289
  }
1408
1290
 
1409
- declare namespace i6 {
1410
- export {
1411
- CDK_DRAG_PLACEHOLDER,
1412
- CdkDragPlaceholder
1413
- }
1291
+ /**
1292
+ * Service that allows for drag-and-drop functionality to be attached to DOM elements.
1293
+ */
1294
+ declare class DragDrop {
1295
+ private _document;
1296
+ private _ngZone;
1297
+ private _viewportRuler;
1298
+ private _dragDropRegistry;
1299
+ private _renderer;
1300
+ constructor(...args: unknown[]);
1301
+ /**
1302
+ * Turns an element into a draggable item.
1303
+ * @param element Element to which to attach the dragging functionality.
1304
+ * @param config Object used to configure the dragging behavior.
1305
+ */
1306
+ createDrag<T = any>(element: ElementRef<HTMLElement> | HTMLElement, config?: DragRefConfig): DragRef<T>;
1307
+ /**
1308
+ * Turns an element into a drop list.
1309
+ * @param element Element to which to attach the drop list functionality.
1310
+ */
1311
+ createDropList<T = any>(element: ElementRef<HTMLElement> | HTMLElement): DropListRef<T>;
1312
+ static ɵfac: i0.ɵɵFactoryDeclaration<DragDrop, never>;
1313
+ static ɵprov: i0.ɵɵInjectableDeclaration<DragDrop>;
1414
1314
  }
1415
1315
 
1316
+ /**
1317
+ * Injection token that can be used for a `CdkDrag` to provide itself as a parent to the
1318
+ * drag-specific child directive (`CdkDragHandle`, `CdkDragPreview` etc.). Used primarily
1319
+ * to avoid circular imports.
1320
+ * @docs-private
1321
+ */
1322
+ declare const CDK_DRAG_PARENT: InjectionToken<CdkDrag<any>>;
1416
1323
 
1417
1324
  /**
1418
1325
  * Moves an item one index in an array to another.
@@ -1420,28 +1327,7 @@ declare namespace i6 {
1420
1327
  * @param fromIndex Starting index of the item.
1421
1328
  * @param toIndex Index to which the item should be moved.
1422
1329
  */
1423
- export declare function moveItemInArray<T = any>(array: T[], fromIndex: number, toIndex: number): void;
1424
-
1425
- /** Point on the page or within an element. */
1426
- export declare interface Point {
1427
- x: number;
1428
- y: number;
1429
- }
1430
-
1431
- /**
1432
- * Possible places into which the preview of a drag item can be inserted.
1433
- * - `global` - Preview will be inserted at the bottom of the `<body>`. The advantage is that
1434
- * you don't have to worry about `overflow: hidden` or `z-index`, but the item won't retain
1435
- * its inherited styles.
1436
- * - `parent` - Preview will be inserted into the parent of the drag item. The advantage is that
1437
- * inherited styles will be preserved, but it may be clipped by `overflow: hidden` or not be
1438
- * visible due to `z-index`. Furthermore, the preview is going to have an effect over selectors
1439
- * like `:nth-child` and some flexbox configurations.
1440
- * - `ElementRef<HTMLElement> | HTMLElement` - Preview will be inserted into a specific element.
1441
- * Same advantages and disadvantages as `parent`.
1442
- */
1443
- export declare type PreviewContainer = 'global' | 'parent' | ElementRef<HTMLElement> | HTMLElement;
1444
-
1330
+ declare function moveItemInArray<T = any>(array: T[], fromIndex: number, toIndex: number): void;
1445
1331
  /**
1446
1332
  * Moves an item from one array to another.
1447
1333
  * @param currentArray Array from which to transfer the item.
@@ -1449,6 +1335,45 @@ export declare type PreviewContainer = 'global' | 'parent' | ElementRef<HTMLElem
1449
1335
  * @param currentIndex Index of the item in its current array.
1450
1336
  * @param targetIndex Index at which to insert the item.
1451
1337
  */
1452
- export declare function transferArrayItem<T = any>(currentArray: T[], targetArray: T[], currentIndex: number, targetIndex: number): void;
1338
+ declare function transferArrayItem<T = any>(currentArray: T[], targetArray: T[], currentIndex: number, targetIndex: number): void;
1339
+ /**
1340
+ * Copies an item from one array to another, leaving it in its
1341
+ * original position in current array.
1342
+ * @param currentArray Array from which to copy the item.
1343
+ * @param targetArray Array into which is copy the item.
1344
+ * @param currentIndex Index of the item in its current array.
1345
+ * @param targetIndex Index at which to insert the item.
1346
+ *
1347
+ */
1348
+ declare function copyArrayItem<T = any>(currentArray: T[], targetArray: T[], currentIndex: number, targetIndex: number): void;
1349
+
1350
+ /**
1351
+ * Injection token that can be used to reference instances of `CdkDropListGroup`. It serves as
1352
+ * alternative token to the actual `CdkDropListGroup` class which could cause unnecessary
1353
+ * retention of the class and its directive metadata.
1354
+ */
1355
+ declare const CDK_DROP_LIST_GROUP: InjectionToken<CdkDropListGroup<unknown>>;
1356
+ /**
1357
+ * Declaratively connects sibling `cdkDropList` instances together. All of the `cdkDropList`
1358
+ * elements that are placed inside a `cdkDropListGroup` will be connected to each other
1359
+ * automatically. Can be used as an alternative to the `cdkDropListConnectedTo` input
1360
+ * from `cdkDropList`.
1361
+ */
1362
+ declare class CdkDropListGroup<T> implements OnDestroy {
1363
+ /** Drop lists registered inside the group. */
1364
+ readonly _items: Set<T>;
1365
+ /** Whether starting a dragging sequence from inside this group is disabled. */
1366
+ disabled: boolean;
1367
+ ngOnDestroy(): void;
1368
+ static ɵfac: i0.ɵɵFactoryDeclaration<CdkDropListGroup<any>, never>;
1369
+ static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDropListGroup<any>, "[cdkDropListGroup]", ["cdkDropListGroup"], { "disabled": { "alias": "cdkDropListGroupDisabled"; "required": false; }; }, {}, never, never, true, never>;
1370
+ static ngAcceptInputType_disabled: unknown;
1371
+ }
1372
+
1373
+ declare class DragDropModule {
1374
+ static ɵfac: i0.ɵɵFactoryDeclaration<DragDropModule, never>;
1375
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DragDropModule, never, [typeof CdkDropList, typeof CdkDropListGroup, typeof CdkDrag, typeof CdkDragHandle, typeof CdkDragPreview, typeof CdkDragPlaceholder], [typeof CdkScrollableModule, typeof CdkDropList, typeof CdkDropListGroup, typeof CdkDrag, typeof CdkDragHandle, typeof CdkDragPreview, typeof CdkDragPlaceholder]>;
1376
+ static ɵinj: i0.ɵɵInjectorDeclaration<DragDropModule>;
1377
+ }
1453
1378
 
1454
- export { }
1379
+ export { CDK_DRAG_CONFIG, CDK_DRAG_HANDLE, CDK_DRAG_PARENT, CDK_DRAG_PLACEHOLDER, CDK_DRAG_PREVIEW, CDK_DROP_LIST, CDK_DROP_LIST_GROUP, CdkDrag, type CdkDragDrop, type CdkDragEnd, type CdkDragEnter, type CdkDragExit, CdkDragHandle, type CdkDragMove, CdkDragPlaceholder, CdkDragPreview, type CdkDragRelease, type CdkDragSortEvent, type CdkDragStart, CdkDropList, CdkDropListGroup, type DragAxis, type DragConstrainPosition, DragDrop, type DragDropConfig, DragDropModule, DragDropRegistry, DragRef, type DragRefConfig, type DragStartDelay, type DropListOrientation, DropListRef, type Point, type PreviewContainer, copyArrayItem, moveItemInArray, transferArrayItem };