@angular/cdk 7.0.4 → 7.2.1

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 (271) hide show
  1. package/LICENSE +1 -1
  2. package/_a11y.scss +1 -1
  3. package/a11y/typings/focus-monitor/focus-monitor.d.ts +20 -5
  4. package/a11y/typings/focus-trap/focus-trap.d.ts +2 -0
  5. package/a11y/typings/index.metadata.json +1 -1
  6. package/a11y/typings/live-announcer/live-announcer.d.ts +34 -3
  7. package/bundles/cdk-a11y.umd.js +477 -216
  8. package/bundles/cdk-a11y.umd.js.map +1 -1
  9. package/bundles/cdk-a11y.umd.min.js +1 -1
  10. package/bundles/cdk-a11y.umd.min.js.map +1 -1
  11. package/bundles/cdk-accordion.umd.js +16 -9
  12. package/bundles/cdk-accordion.umd.js.map +1 -1
  13. package/bundles/cdk-accordion.umd.min.js.map +1 -1
  14. package/bundles/cdk-bidi.umd.js +11 -6
  15. package/bundles/cdk-bidi.umd.js.map +1 -1
  16. package/bundles/cdk-bidi.umd.min.js.map +1 -1
  17. package/bundles/cdk-coercion.umd.js +25 -9
  18. package/bundles/cdk-coercion.umd.js.map +1 -1
  19. package/bundles/cdk-coercion.umd.min.js +1 -1
  20. package/bundles/cdk-coercion.umd.min.js.map +1 -1
  21. package/bundles/cdk-collections.umd.js +28 -5
  22. package/bundles/cdk-collections.umd.js.map +1 -1
  23. package/bundles/cdk-collections.umd.min.js.map +1 -1
  24. package/bundles/cdk-drag-drop.umd.js +2177 -915
  25. package/bundles/cdk-drag-drop.umd.js.map +1 -1
  26. package/bundles/cdk-drag-drop.umd.min.js +2 -1
  27. package/bundles/cdk-drag-drop.umd.min.js.map +1 -1
  28. package/bundles/cdk-keycodes.umd.js +33 -1
  29. package/bundles/cdk-keycodes.umd.js.map +1 -1
  30. package/bundles/cdk-keycodes.umd.min.js +1 -1
  31. package/bundles/cdk-keycodes.umd.min.js.map +1 -1
  32. package/bundles/cdk-layout.umd.js +29 -22
  33. package/bundles/cdk-layout.umd.js.map +1 -1
  34. package/bundles/cdk-layout.umd.min.js +1 -1
  35. package/bundles/cdk-layout.umd.min.js.map +1 -1
  36. package/bundles/cdk-observers.umd.js +26 -7
  37. package/bundles/cdk-observers.umd.js.map +1 -1
  38. package/bundles/cdk-observers.umd.min.js +1 -1
  39. package/bundles/cdk-observers.umd.min.js.map +1 -1
  40. package/bundles/cdk-overlay.umd.js +605 -258
  41. package/bundles/cdk-overlay.umd.js.map +1 -1
  42. package/bundles/cdk-overlay.umd.min.js +2 -2
  43. package/bundles/cdk-overlay.umd.min.js.map +1 -1
  44. package/bundles/cdk-platform.umd.js +50 -28
  45. package/bundles/cdk-platform.umd.js.map +1 -1
  46. package/bundles/cdk-platform.umd.min.js.map +1 -1
  47. package/bundles/cdk-portal.umd.js +14 -7
  48. package/bundles/cdk-portal.umd.js.map +1 -1
  49. package/bundles/cdk-portal.umd.min.js.map +1 -1
  50. package/bundles/cdk-scrolling.umd.js +139 -44
  51. package/bundles/cdk-scrolling.umd.js.map +1 -1
  52. package/bundles/cdk-scrolling.umd.min.js +1 -1
  53. package/bundles/cdk-scrolling.umd.min.js.map +1 -1
  54. package/bundles/cdk-stepper.umd.js +103 -19
  55. package/bundles/cdk-stepper.umd.js.map +1 -1
  56. package/bundles/cdk-stepper.umd.min.js +1 -1
  57. package/bundles/cdk-stepper.umd.min.js.map +1 -1
  58. package/bundles/cdk-table.umd.js +182 -48
  59. package/bundles/cdk-table.umd.js.map +1 -1
  60. package/bundles/cdk-table.umd.min.js.map +1 -1
  61. package/bundles/cdk-text-field.umd.js +76 -38
  62. package/bundles/cdk-text-field.umd.js.map +1 -1
  63. package/bundles/cdk-text-field.umd.min.js +1 -1
  64. package/bundles/cdk-text-field.umd.min.js.map +1 -1
  65. package/bundles/cdk-tree.umd.js +71 -34
  66. package/bundles/cdk-tree.umd.js.map +1 -1
  67. package/bundles/cdk-tree.umd.min.js +1 -1
  68. package/bundles/cdk-tree.umd.min.js.map +1 -1
  69. package/bundles/cdk.umd.js +5 -4
  70. package/bundles/cdk.umd.js.map +1 -1
  71. package/bundles/cdk.umd.min.js +1 -1
  72. package/bundles/cdk.umd.min.js.map +1 -1
  73. package/coercion/typings/element.d.ts +13 -0
  74. package/coercion/typings/index.metadata.json +1 -1
  75. package/coercion/typings/public-api.d.ts +1 -0
  76. package/drag-drop/typings/{drag-handle.d.ts → directives/drag-handle.d.ts} +3 -0
  77. package/drag-drop/typings/{drag-placeholder.d.ts → directives/drag-placeholder.d.ts} +0 -0
  78. package/drag-drop/typings/{drag-preview.d.ts → directives/drag-preview.d.ts} +0 -0
  79. package/drag-drop/typings/directives/drag.d.ts +109 -0
  80. package/{typings/drag-drop → drag-drop/typings/directives}/drop-list-group.d.ts +3 -0
  81. package/drag-drop/typings/directives/drop-list.d.ts +135 -0
  82. package/drag-drop/typings/drag-drop-registry.d.ts +8 -3
  83. package/drag-drop/typings/drag-events.d.ts +14 -7
  84. package/{typings/esm5/drag-drop/drag.d.ts → drag-drop/typings/drag-ref.d.ts} +152 -82
  85. package/drag-drop/typings/drop-list-container.d.ts +21 -3
  86. package/drag-drop/typings/{drop-list.d.ts → drop-list-ref.d.ts} +132 -81
  87. package/drag-drop/typings/index.d.ts +1 -0
  88. package/drag-drop/typings/index.metadata.json +1 -1
  89. package/drag-drop/typings/public-api.d.ts +13 -6
  90. package/esm2015/a11y.js +337 -190
  91. package/esm2015/a11y.js.map +1 -1
  92. package/esm2015/accordion.js +16 -11
  93. package/esm2015/accordion.js.map +1 -1
  94. package/esm2015/bidi.js +13 -8
  95. package/esm2015/bidi.js.map +1 -1
  96. package/esm2015/cdk.js +7 -6
  97. package/esm2015/cdk.js.map +1 -1
  98. package/esm2015/coercion.js +25 -8
  99. package/esm2015/coercion.js.map +1 -1
  100. package/esm2015/collections.js +22 -7
  101. package/esm2015/collections.js.map +1 -1
  102. package/esm2015/drag-drop.js +1587 -691
  103. package/esm2015/drag-drop.js.map +1 -1
  104. package/esm2015/keycodes.js +31 -4
  105. package/esm2015/keycodes.js.map +1 -1
  106. package/esm2015/layout.js +29 -19
  107. package/esm2015/layout.js.map +1 -1
  108. package/esm2015/observers.js +15 -10
  109. package/esm2015/observers.js.map +1 -1
  110. package/esm2015/overlay.js +393 -232
  111. package/esm2015/overlay.js.map +1 -1
  112. package/esm2015/platform.js +53 -31
  113. package/esm2015/platform.js.map +1 -1
  114. package/esm2015/portal.js +13 -9
  115. package/esm2015/portal.js.map +1 -1
  116. package/esm2015/scrolling.js +102 -45
  117. package/esm2015/scrolling.js.map +1 -1
  118. package/esm2015/stepper.js +93 -24
  119. package/esm2015/stepper.js.map +1 -1
  120. package/esm2015/table.js +89 -45
  121. package/esm2015/table.js.map +1 -1
  122. package/esm2015/text-field.js +54 -37
  123. package/esm2015/text-field.js.map +1 -1
  124. package/esm2015/tree.js +55 -36
  125. package/esm2015/tree.js.map +1 -1
  126. package/esm5/a11y.es5.js +481 -220
  127. package/esm5/a11y.es5.js.map +1 -1
  128. package/esm5/accordion.es5.js +18 -11
  129. package/esm5/accordion.es5.js.map +1 -1
  130. package/esm5/bidi.es5.js +13 -8
  131. package/esm5/bidi.es5.js.map +1 -1
  132. package/esm5/cdk.es5.js +7 -6
  133. package/esm5/cdk.es5.js.map +1 -1
  134. package/esm5/coercion.es5.js +25 -8
  135. package/esm5/coercion.es5.js.map +1 -1
  136. package/esm5/collections.es5.js +35 -7
  137. package/esm5/collections.es5.js.map +1 -1
  138. package/esm5/drag-drop.es5.js +2233 -972
  139. package/esm5/drag-drop.es5.js.map +1 -1
  140. package/esm5/keycodes.es5.js +35 -4
  141. package/esm5/keycodes.es5.js.map +1 -1
  142. package/esm5/layout.es5.js +31 -24
  143. package/esm5/layout.es5.js.map +1 -1
  144. package/esm5/observers.es5.js +29 -10
  145. package/esm5/observers.es5.js.map +1 -1
  146. package/esm5/overlay.es5.js +609 -262
  147. package/esm5/overlay.es5.js.map +1 -1
  148. package/esm5/platform.es5.js +52 -30
  149. package/esm5/platform.es5.js.map +1 -1
  150. package/esm5/portal.es5.js +16 -9
  151. package/esm5/portal.es5.js.map +1 -1
  152. package/esm5/scrolling.es5.js +141 -46
  153. package/esm5/scrolling.es5.js.map +1 -1
  154. package/esm5/stepper.es5.js +106 -24
  155. package/esm5/stepper.es5.js.map +1 -1
  156. package/esm5/table.es5.js +184 -50
  157. package/esm5/table.es5.js.map +1 -1
  158. package/esm5/text-field.es5.js +75 -37
  159. package/esm5/text-field.es5.js.map +1 -1
  160. package/esm5/tree.es5.js +74 -37
  161. package/esm5/tree.es5.js.map +1 -1
  162. package/keycodes/typings/index.metadata.json +1 -1
  163. package/keycodes/typings/modifiers.d.ts +14 -0
  164. package/keycodes/typings/public-api.d.ts +1 -0
  165. package/overlay/typings/index.metadata.json +1 -1
  166. package/overlay/typings/overlay-directives.d.ts +0 -2
  167. package/package.json +4 -4
  168. package/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts +2 -2
  169. package/schematics/ng-update/upgrade-data.js +2 -1
  170. package/schematics/ng-update/upgrade-data.js.map +1 -1
  171. package/schematics/ng-update/upgrade-rules/index.js +3 -2
  172. package/schematics/ng-update/upgrade-rules/index.js.map +1 -1
  173. package/schematics/utils/ast/ng-module-imports.d.ts +1 -1
  174. package/schematics/utils/ast/ng-module-imports.js +25 -13
  175. package/schematics/utils/ast/ng-module-imports.js.map +1 -1
  176. package/schematics/utils/get-project.js +2 -1
  177. package/schematics/utils/get-project.js.map +1 -1
  178. package/schematics/utils/parse5-element.js +3 -2
  179. package/schematics/utils/parse5-element.js.map +1 -1
  180. package/schematics/utils/project-targets.js +2 -1
  181. package/schematics/utils/project-targets.js.map +1 -1
  182. package/schematics/utils/version-agnostic-typescript.js +3 -2
  183. package/schematics/utils/version-agnostic-typescript.js.map +1 -1
  184. package/scrolling/typings/index.metadata.json +1 -1
  185. package/stepper/typings/index.metadata.json +1 -1
  186. package/stepper/typings/public-api.d.ts +1 -0
  187. package/stepper/typings/step-header.d.ts +15 -0
  188. package/stepper/typings/stepper.d.ts +11 -1
  189. package/text-field/typings/autosize.d.ts +6 -0
  190. package/text-field/typings/index.metadata.json +1 -1
  191. package/tree/typings/control/base-tree-control.d.ts +1 -1
  192. package/tree/typings/control/nested-tree-control.d.ts +2 -2
  193. package/tree/typings/control/tree-control.d.ts +1 -1
  194. package/tree/typings/nested-node.d.ts +5 -5
  195. package/typings/a11y/focus-monitor/focus-monitor.d.ts +20 -5
  196. package/typings/a11y/focus-trap/focus-trap.d.ts +2 -0
  197. package/typings/a11y/index.metadata.json +1 -1
  198. package/typings/a11y/live-announcer/live-announcer.d.ts +34 -3
  199. package/typings/coercion/element.d.ts +13 -0
  200. package/typings/coercion/index.metadata.json +1 -1
  201. package/typings/coercion/public-api.d.ts +1 -0
  202. package/typings/{esm5/drag-drop → drag-drop/directives}/drag-handle.d.ts +3 -0
  203. package/typings/drag-drop/{drag-placeholder.d.ts → directives/drag-placeholder.d.ts} +0 -0
  204. package/typings/drag-drop/{drag-preview.d.ts → directives/drag-preview.d.ts} +0 -0
  205. package/typings/drag-drop/directives/drag.d.ts +109 -0
  206. package/typings/{esm5/drag-drop → drag-drop/directives}/drop-list-group.d.ts +3 -0
  207. package/typings/drag-drop/directives/drop-list.d.ts +135 -0
  208. package/typings/drag-drop/drag-drop-registry.d.ts +8 -3
  209. package/typings/drag-drop/drag-events.d.ts +14 -7
  210. package/typings/drag-drop/{drag.d.ts → drag-ref.d.ts} +152 -82
  211. package/typings/drag-drop/drop-list-container.d.ts +21 -3
  212. package/typings/{esm5/drag-drop/drop-list.d.ts → drag-drop/drop-list-ref.d.ts} +132 -81
  213. package/typings/drag-drop/index.d.ts +1 -0
  214. package/typings/drag-drop/index.metadata.json +1 -1
  215. package/typings/drag-drop/public-api.d.ts +13 -6
  216. package/typings/esm5/a11y/focus-monitor/focus-monitor.d.ts +20 -5
  217. package/typings/esm5/a11y/focus-trap/focus-trap.d.ts +2 -0
  218. package/typings/esm5/a11y/index.metadata.json +1 -1
  219. package/typings/esm5/a11y/live-announcer/live-announcer.d.ts +34 -3
  220. package/typings/esm5/coercion/element.d.ts +13 -0
  221. package/typings/esm5/coercion/index.metadata.json +1 -1
  222. package/typings/esm5/coercion/public-api.d.ts +1 -0
  223. package/typings/{drag-drop → esm5/drag-drop/directives}/drag-handle.d.ts +3 -0
  224. package/typings/esm5/drag-drop/{drag-placeholder.d.ts → directives/drag-placeholder.d.ts} +0 -0
  225. package/typings/esm5/drag-drop/{drag-preview.d.ts → directives/drag-preview.d.ts} +0 -0
  226. package/typings/esm5/drag-drop/directives/drag.d.ts +109 -0
  227. package/{drag-drop/typings → typings/esm5/drag-drop/directives}/drop-list-group.d.ts +3 -0
  228. package/typings/esm5/drag-drop/directives/drop-list.d.ts +135 -0
  229. package/typings/esm5/drag-drop/drag-drop-registry.d.ts +8 -3
  230. package/typings/esm5/drag-drop/drag-events.d.ts +14 -7
  231. package/{drag-drop/typings/drag.d.ts → typings/esm5/drag-drop/drag-ref.d.ts} +152 -82
  232. package/typings/esm5/drag-drop/drop-list-container.d.ts +21 -3
  233. package/typings/{drag-drop/drop-list.d.ts → esm5/drag-drop/drop-list-ref.d.ts} +132 -81
  234. package/typings/esm5/drag-drop/index.d.ts +1 -0
  235. package/typings/esm5/drag-drop/index.metadata.json +1 -1
  236. package/typings/esm5/drag-drop/public-api.d.ts +13 -6
  237. package/typings/esm5/index.metadata.json +1 -1
  238. package/typings/esm5/keycodes/index.metadata.json +1 -1
  239. package/typings/esm5/keycodes/modifiers.d.ts +14 -0
  240. package/typings/esm5/keycodes/public-api.d.ts +1 -0
  241. package/typings/esm5/overlay/index.metadata.json +1 -1
  242. package/typings/esm5/overlay/overlay-directives.d.ts +0 -2
  243. package/typings/esm5/scrolling/index.metadata.json +1 -1
  244. package/typings/esm5/stepper/index.metadata.json +1 -1
  245. package/typings/esm5/stepper/public-api.d.ts +1 -0
  246. package/typings/esm5/stepper/step-header.d.ts +15 -0
  247. package/typings/esm5/stepper/stepper.d.ts +11 -1
  248. package/typings/esm5/text-field/autosize.d.ts +6 -0
  249. package/typings/esm5/text-field/index.metadata.json +1 -1
  250. package/typings/esm5/tree/control/base-tree-control.d.ts +1 -1
  251. package/typings/esm5/tree/control/nested-tree-control.d.ts +2 -2
  252. package/typings/esm5/tree/control/tree-control.d.ts +1 -1
  253. package/typings/esm5/tree/nested-node.d.ts +5 -5
  254. package/typings/index.metadata.json +1 -1
  255. package/typings/keycodes/index.metadata.json +1 -1
  256. package/typings/keycodes/modifiers.d.ts +14 -0
  257. package/typings/keycodes/public-api.d.ts +1 -0
  258. package/typings/overlay/index.metadata.json +1 -1
  259. package/typings/overlay/overlay-directives.d.ts +0 -2
  260. package/typings/schematics/utils/ast/ng-module-imports.d.ts +1 -1
  261. package/typings/scrolling/index.metadata.json +1 -1
  262. package/typings/stepper/index.metadata.json +1 -1
  263. package/typings/stepper/public-api.d.ts +1 -0
  264. package/typings/stepper/step-header.d.ts +15 -0
  265. package/typings/stepper/stepper.d.ts +11 -1
  266. package/typings/text-field/autosize.d.ts +6 -0
  267. package/typings/text-field/index.metadata.json +1 -1
  268. package/typings/tree/control/base-tree-control.d.ts +1 -1
  269. package/typings/tree/control/nested-tree-control.d.ts +2 -2
  270. package/typings/tree/control/tree-control.d.ts +1 -1
  271. package/typings/tree/nested-node.d.ts +5 -5
@@ -0,0 +1,135 @@
1
+ /**
2
+ * @license
3
+ * Copyright Google LLC All Rights Reserved.
4
+ *
5
+ * Use of this source code is governed by an MIT-style license that can be
6
+ * found in the LICENSE file at https://angular.io/license
7
+ */
8
+ import { ElementRef, EventEmitter, OnDestroy, QueryList, ChangeDetectorRef } from '@angular/core';
9
+ import { Directionality } from '@angular/cdk/bidi';
10
+ import { CdkDrag } from './drag';
11
+ import { DragDropRegistry } from '../drag-drop-registry';
12
+ import { CdkDragDrop, CdkDragEnter, CdkDragExit, CdkDragSortEvent } from '../drag-events';
13
+ import { CdkDropListContainer } from '../drop-list-container';
14
+ import { CdkDropListGroup } from './drop-list-group';
15
+ import { DropListRef } from '../drop-list-ref';
16
+ import { DragRef } from '../drag-ref';
17
+ /**
18
+ * Internal compile-time-only representation of a `CdkDropList`.
19
+ * Used to avoid circular import issues between the `CdkDropList` and the `CdkDrag`.
20
+ * @docs-private
21
+ */
22
+ export interface CdkDropListInternal extends CdkDropList {
23
+ }
24
+ /** Container that wraps a set of draggable items. */
25
+ export declare class CdkDropList<T = any> implements CdkDropListContainer, OnDestroy {
26
+ element: ElementRef<HTMLElement>;
27
+ private _changeDetectorRef;
28
+ private _group?;
29
+ /** Keeps track of the drop lists that are currently on the page. */
30
+ private static _dropLists;
31
+ /** Reference to the underlying drop list instance. */
32
+ _dropListRef: DropListRef<CdkDropList<T>>;
33
+ /** Draggable items in the container. */
34
+ _draggables: QueryList<CdkDrag>;
35
+ /**
36
+ * Other draggable containers that this container is connected to and into which the
37
+ * container's items can be transferred. Can either be references to other drop containers,
38
+ * or their unique IDs.
39
+ */
40
+ connectedTo: (CdkDropList | string)[] | CdkDropList | string;
41
+ /** Arbitrary data to attach to this container. */
42
+ data: T;
43
+ /** Direction in which the list is oriented. */
44
+ orientation: 'horizontal' | 'vertical';
45
+ /**
46
+ * Unique ID for the drop zone. Can be used as a reference
47
+ * in the `connectedTo` of another `CdkDropList`.
48
+ */
49
+ id: string;
50
+ /** Locks the position of the draggable elements inside the container along the specified axis. */
51
+ lockAxis: 'x' | 'y';
52
+ /** Whether starting a dragging sequence from this container is disabled. */
53
+ disabled: boolean;
54
+ private _disabled;
55
+ /**
56
+ * Function that is used to determine whether an item
57
+ * is allowed to be moved into a drop container.
58
+ */
59
+ enterPredicate: (drag: CdkDrag, drop: CdkDropList) => boolean;
60
+ /** Emits when the user drops an item inside the container. */
61
+ dropped: EventEmitter<CdkDragDrop<T, any>>;
62
+ /**
63
+ * Emits when the user has moved a new drag item into this container.
64
+ */
65
+ entered: EventEmitter<CdkDragEnter<T>>;
66
+ /**
67
+ * Emits when the user removes an item from the container
68
+ * by dragging it into another container.
69
+ */
70
+ exited: EventEmitter<CdkDragExit<T>>;
71
+ /** Emits as the user is swapping items while actively dragging. */
72
+ sorted: EventEmitter<CdkDragSortEvent<T>>;
73
+ constructor(element: ElementRef<HTMLElement>, dragDropRegistry: DragDropRegistry<DragRef, DropListRef>, _changeDetectorRef: ChangeDetectorRef, dir?: Directionality, _group?: CdkDropListGroup<CdkDropList<any>> | undefined, _document?: any);
74
+ ngOnDestroy(): void;
75
+ /** Starts dragging an item. */
76
+ start(): void;
77
+ /**
78
+ * Drops an item into this container.
79
+ * @param item Item being dropped into the container.
80
+ * @param currentIndex Index at which the item should be inserted.
81
+ * @param previousContainer Container from which the item got dragged in.
82
+ * @param isPointerOverContainer Whether the user's pointer was over the
83
+ * container when the item was dropped.
84
+ */
85
+ drop(item: CdkDrag, currentIndex: number, previousContainer: Partial<CdkDropListContainer>, isPointerOverContainer: boolean): void;
86
+ /**
87
+ * Emits an event to indicate that the user moved an item into the container.
88
+ * @param item Item that was moved into the container.
89
+ * @param pointerX Position of the item along the X axis.
90
+ * @param pointerY Position of the item along the Y axis.
91
+ */
92
+ enter(item: CdkDrag, pointerX: number, pointerY: number): void;
93
+ /**
94
+ * Removes an item from the container after it was dragged into another container by the user.
95
+ * @param item Item that was dragged out.
96
+ */
97
+ exit(item: CdkDrag): void;
98
+ /**
99
+ * Figures out the index of an item in the container.
100
+ * @param item Item whose index should be determined.
101
+ */
102
+ getItemIndex(item: CdkDrag): number;
103
+ /**
104
+ * Sorts an item inside the container based on its position.
105
+ * @param item Item to be sorted.
106
+ * @param pointerX Position of the item along the X axis.
107
+ * @param pointerY Position of the item along the Y axis.
108
+ * @param pointerDelta Direction in which the pointer is moving along each axis.
109
+ */
110
+ _sortItem(item: CdkDrag, pointerX: number, pointerY: number, pointerDelta: {
111
+ x: number;
112
+ y: number;
113
+ }): void;
114
+ /**
115
+ * Figures out whether an item should be moved into a sibling
116
+ * drop container, based on its current position.
117
+ * @param item Drag item that is being moved.
118
+ * @param x Position of the item along the X axis.
119
+ * @param y Position of the item along the Y axis.
120
+ */
121
+ _getSiblingContainerFromPosition(item: CdkDrag, x: number, y: number): CdkDropListContainer | null;
122
+ /**
123
+ * Checks whether the user's pointer is positioned over the container.
124
+ * @param x Pointer position along the X axis.
125
+ * @param y Pointer position along the Y axis.
126
+ */
127
+ _isOverContainer(x: number, y: number): boolean;
128
+ /** Syncs the inputs of the CdkDropList with the options of the underlying DropListRef. */
129
+ private _syncInputs;
130
+ /**
131
+ * Proxies the events from a DropListRef to events that
132
+ * match the interfaces of the CdkDropList outputs.
133
+ */
134
+ private _proxyEvents;
135
+ }
@@ -54,13 +54,18 @@ export declare class DragDropRegistry<I, C extends {
54
54
  stopDragging(drag: I): void;
55
55
  /** Gets whether a drag item instance is currently being dragged. */
56
56
  isDragging(drag: I): boolean;
57
- /** Gets a drop container by its id. */
57
+ /**
58
+ * Gets a drop container by its id.
59
+ * @deprecated No longer being used. To be removed.
60
+ * @breaking-change 8.0.0
61
+ */
58
62
  getDropContainer(id: string): C | undefined;
59
63
  ngOnDestroy(): void;
60
64
  /**
61
- * Listener used to prevent `touchmove` and `wheel` events while the element is being dragged.
65
+ * Event listener that will prevent the default browser action while the user is dragging.
66
+ * @param event Event whose default action should be prevented.
62
67
  */
63
- private _preventScrollListener;
68
+ private _preventDefaultWhileDragging;
64
69
  /** Clears out the global event listeners from the `document`. */
65
70
  private _clearGlobalListeners;
66
71
  }
@@ -5,13 +5,18 @@
5
5
  * Use of this source code is governed by an MIT-style license that can be
6
6
  * found in the LICENSE file at https://angular.io/license
7
7
  */
8
- import { CdkDrag } from './drag';
9
- import { CdkDropListContainer } from './drop-list-container';
8
+ import { CdkDrag } from './directives/drag';
9
+ import { CdkDropList } from './directives/drop-list';
10
10
  /** Event emitted when the user starts dragging a draggable. */
11
11
  export interface CdkDragStart<T = any> {
12
12
  /** Draggable that emitted the event. */
13
13
  source: CdkDrag<T>;
14
14
  }
15
+ /** Event emitted when the user releases an item, before any animations have started. */
16
+ export interface CdkDragRelease<T = any> {
17
+ /** Draggable that emitted the event. */
18
+ source: CdkDrag<T>;
19
+ }
15
20
  /** Event emitted when the user stops dragging a draggable. */
16
21
  export interface CdkDragEnd<T = any> {
17
22
  /** Draggable that emitted the event. */
@@ -20,7 +25,7 @@ export interface CdkDragEnd<T = any> {
20
25
  /** Event emitted when the user moves an item into a new drop container. */
21
26
  export interface CdkDragEnter<T = any, I = T> {
22
27
  /** Container into which the user has moved the item. */
23
- container: CdkDropListContainer<T>;
28
+ container: CdkDropList<T>;
24
29
  /** Item that was removed from the container. */
25
30
  item: CdkDrag<I>;
26
31
  }
@@ -30,7 +35,7 @@ export interface CdkDragEnter<T = any, I = T> {
30
35
  */
31
36
  export interface CdkDragExit<T = any, I = T> {
32
37
  /** Container from which the user has a removed an item. */
33
- container: CdkDropListContainer<T>;
38
+ container: CdkDropList<T>;
34
39
  /** Item that was removed from the container. */
35
40
  item: CdkDrag<I>;
36
41
  }
@@ -43,9 +48,11 @@ export interface CdkDragDrop<T, O = T> {
43
48
  /** Item that is being dropped. */
44
49
  item: CdkDrag;
45
50
  /** Container in which the item was dropped. */
46
- container: CdkDropListContainer<T>;
51
+ container: CdkDropList<T>;
47
52
  /** Container from which the item was picked up. Can be the same as the `container`. */
48
- previousContainer: CdkDropListContainer<O>;
53
+ previousContainer: CdkDropList<O>;
54
+ /** Whether the user's pointer was over the container when the item was dropped. */
55
+ isPointerOverContainer: boolean;
49
56
  }
50
57
  /** Event emitted as the user is dragging a draggable item. */
51
58
  export interface CdkDragMove<T = any> {
@@ -76,7 +83,7 @@ export interface CdkDragSortEvent<T = any, I = T> {
76
83
  /** Index that the item is currently in. */
77
84
  currentIndex: number;
78
85
  /** Container that the item belongs to. */
79
- container: CdkDropListContainer<T>;
86
+ container: CdkDropList<T>;
80
87
  /** Item that is being sorted. */
81
88
  item: CdkDrag<I>;
82
89
  }
@@ -5,18 +5,14 @@
5
5
  * Use of this source code is governed by an MIT-style license that can be
6
6
  * found in the LICENSE file at https://angular.io/license
7
7
  */
8
- import { Directionality } from '@angular/cdk/bidi';
8
+ import { ElementRef, NgZone, ViewContainerRef, TemplateRef } from '@angular/core';
9
9
  import { ViewportRuler } from '@angular/cdk/scrolling';
10
- import { AfterViewInit, ElementRef, EventEmitter, InjectionToken, NgZone, OnDestroy, QueryList, ViewContainerRef } from '@angular/core';
11
- import { Observable } from 'rxjs';
10
+ import { Directionality } from '@angular/cdk/bidi';
11
+ import { Subject, Observable } from 'rxjs';
12
+ import { DropListRefInternal as DropListRef } from './drop-list-ref';
12
13
  import { DragDropRegistry } from './drag-drop-registry';
13
- import { CdkDragDrop, CdkDragEnd, CdkDragEnter, CdkDragExit, CdkDragMove, CdkDragStart } from './drag-events';
14
- import { CdkDragHandle } from './drag-handle';
15
- import { CdkDragPlaceholder } from './drag-placeholder';
16
- import { CdkDragPreview } from './drag-preview';
17
- import { CdkDropListContainer } from './drop-list-container';
18
- /** Object that can be used to configure the behavior of CdkDrag. */
19
- export interface CdkDragConfig {
14
+ /** Object that can be used to configure the behavior of DragRef. */
15
+ export interface DragRefConfig {
20
16
  /**
21
17
  * Minimum amount of pixels that the user should
22
18
  * drag, before the CDK initiates a drag sequence.
@@ -28,23 +24,38 @@ export interface CdkDragConfig {
28
24
  */
29
25
  pointerDirectionChangeThreshold: number;
30
26
  }
31
- /** Injection token that can be used to configure the behavior of `CdkDrag`. */
32
- export declare const CDK_DRAG_CONFIG: InjectionToken<CdkDragConfig>;
33
- /** @docs-private */
34
- export declare function CDK_DRAG_CONFIG_FACTORY(): CdkDragConfig;
35
- /** Element that can be moved inside a CdkDropList container. */
36
- export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
37
- /** Element that the draggable is attached to. */
27
+ /**
28
+ * Template that can be used to create a drag helper element (e.g. a preview or a placeholder).
29
+ */
30
+ interface DragHelperTemplate<T = any> {
31
+ templateRef: TemplateRef<T>;
32
+ data: T;
33
+ }
34
+ interface DragHandle {
38
35
  element: ElementRef<HTMLElement>;
39
- /** Droppable container that the draggable is a part of. */
40
- dropContainer: CdkDropListContainer;
36
+ disabled: boolean;
37
+ }
38
+ /**
39
+ * Internal compile-time-only representation of a `DragRef`.
40
+ * Used to avoid circular import issues between the `DragRef` and the `DropListRef`.
41
+ * @docs-private
42
+ */
43
+ export interface DragRefInternal extends DragRef {
44
+ }
45
+ /**
46
+ * Reference to a draggable item. Used to manipulate or dispose of the item.
47
+ * @docs-private
48
+ */
49
+ export declare class DragRef<T = any> {
50
+ private _document;
41
51
  private _ngZone;
42
52
  private _viewContainerRef;
43
53
  private _viewportRuler;
44
54
  private _dragDropRegistry;
45
55
  private _config;
46
- private _dir;
47
- private _document;
56
+ /** Droppable container that the draggable is a part of. */
57
+ dropContainer?: DropListRef | undefined;
58
+ private _dir?;
48
59
  /** Element displayed next to the user's pointer while the element is dragged. */
49
60
  private _preview;
50
61
  /** Reference to the view of the preview element. */
@@ -77,10 +88,10 @@ export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
77
88
  * Whether the dragging sequence has been started. Doesn't
78
89
  * necessarily mean that the element has been moved.
79
90
  */
80
- _hasStartedDragging: boolean;
91
+ private _hasStartedDragging;
81
92
  /** Whether the element has moved since the user started dragging it. */
82
93
  private _hasMoved;
83
- /** Drop container in which the CdkDrag resided when dragging began. */
94
+ /** Drop container in which the DragRef resided when dragging began. */
84
95
  private _initialContainer;
85
96
  /** Cached scroll position on the page when the element was picked up. */
86
97
  private _scrollPosition;
@@ -95,50 +106,99 @@ export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
95
106
  private _pointerDirectionDelta;
96
107
  /** Pointer position at which the last change in the delta occurred. */
97
108
  private _pointerPositionAtLastDirectionChange;
98
- /** Root element that will be dragged by the user. */
109
+ /**
110
+ * Root DOM node of the drag instance. This is the element that will
111
+ * be moved around as the user is dragging.
112
+ */
99
113
  private _rootElement;
114
+ /**
115
+ * Inline style value of `-webkit-tap-highlight-color` at the time the
116
+ * dragging was started. Used to restore the value once we're done dragging.
117
+ */
118
+ private _rootElementTapHighlight;
100
119
  /** Subscription to pointer movement events. */
101
120
  private _pointerMoveSubscription;
102
121
  /** Subscription to the event that is dispatched when the user lifts their pointer. */
103
122
  private _pointerUpSubscription;
104
- /** Subscription to the stream that initializes the root element. */
105
- private _rootElementInitSubscription;
106
- /** Elements that can be used to drag the draggable item. */
107
- _handles: QueryList<CdkDragHandle>;
123
+ /**
124
+ * Time at which the last touch event occurred. Used to avoid firing the same
125
+ * events multiple times on touch devices where the browser will fire a fake
126
+ * mouse event for each touch event, after a certain time.
127
+ */
128
+ private _lastTouchEventTime;
129
+ /** Cached reference to the boundary element. */
130
+ private _boundaryElement;
131
+ /** Whether the native dragging interactions have been enabled on the root element. */
132
+ private _nativeInteractionsEnabled;
133
+ /** Cached dimensions of the preview element. */
134
+ private _previewRect?;
135
+ /** Cached dimensions of the boundary element. */
136
+ private _boundaryRect?;
108
137
  /** Element that will be used as a template to create the draggable item's preview. */
109
- _previewTemplate: CdkDragPreview;
138
+ private _previewTemplate;
110
139
  /** Template for placeholder element rendered to show where a draggable would be dropped. */
111
- _placeholderTemplate: CdkDragPlaceholder;
112
- /** Arbitrary data to attach to this drag instance. */
113
- data: T;
114
- /** Locks the position of the dragged element along the specified axis. */
140
+ private _placeholderTemplate;
141
+ /** Elements that can be used to drag the draggable item. */
142
+ private _handles;
143
+ /** Axis along which dragging is locked. */
115
144
  lockAxis: 'x' | 'y';
116
- /**
117
- * Selector that will be used to determine the root draggable element, starting from
118
- * the `cdkDrag` element and going up the DOM. Passing an alternate root element is useful
119
- * when trying to enable dragging on an element that you might not have access to.
120
- */
121
- rootElementSelector: string;
145
+ /** Whether starting to drag this element is disabled. */
146
+ disabled: boolean;
147
+ private _disabled;
148
+ /** Emits as the drag sequence is being prepared. */
149
+ beforeStarted: Subject<void>;
122
150
  /** Emits when the user starts dragging the item. */
123
- started: EventEmitter<CdkDragStart>;
151
+ started: Subject<{
152
+ source: DragRef<any>;
153
+ }>;
154
+ /** Emits when the user has released a drag item, before any animations have started. */
155
+ released: Subject<{
156
+ source: DragRef<any>;
157
+ }>;
124
158
  /** Emits when the user stops dragging an item in the container. */
125
- ended: EventEmitter<CdkDragEnd>;
159
+ ended: Subject<{
160
+ source: DragRef<any>;
161
+ }>;
126
162
  /** Emits when the user has moved the item into a new container. */
127
- entered: EventEmitter<CdkDragEnter<any>>;
163
+ entered: Subject<{
164
+ container: DropListRef;
165
+ item: DragRef<any>;
166
+ }>;
128
167
  /** Emits when the user removes the item its container by dragging it into another container. */
129
- exited: EventEmitter<CdkDragExit<any>>;
168
+ exited: Subject<{
169
+ container: DropListRef;
170
+ item: DragRef<any>;
171
+ }>;
130
172
  /** Emits when the user drops the item inside a container. */
131
- dropped: EventEmitter<CdkDragDrop<any>>;
173
+ dropped: Subject<{
174
+ previousIndex: number;
175
+ currentIndex: number;
176
+ item: DragRef<any>;
177
+ container: DropListRef;
178
+ previousContainer: DropListRef;
179
+ isPointerOverContainer: boolean;
180
+ }>;
132
181
  /**
133
182
  * Emits as the user is dragging the item. Use with caution,
134
183
  * because this event will fire for every pixel that the user has dragged.
135
184
  */
136
- moved: Observable<CdkDragMove<T>>;
137
- constructor(
138
- /** Element that the draggable is attached to. */
139
- element: ElementRef<HTMLElement>,
185
+ moved: Observable<{
186
+ source: DragRef;
187
+ pointerPosition: {
188
+ x: number;
189
+ y: number;
190
+ };
191
+ event: MouseEvent | TouchEvent;
192
+ delta: {
193
+ x: -1 | 0 | 1;
194
+ y: -1 | 0 | 1;
195
+ };
196
+ }>;
197
+ /** Arbitrary data that can be attached to the drag item. */
198
+ data: T;
199
+ constructor(element: ElementRef<HTMLElement> | HTMLElement, _document: Document, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry<DragRef, DropListRef>, _config: DragRefConfig,
140
200
  /** Droppable container that the draggable is a part of. */
141
- dropContainer: CdkDropListContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry<CdkDrag<T>, CdkDropListContainer>, _config: CdkDragConfig, _dir: Directionality);
201
+ dropContainer?: DropListRef | undefined, _dir?: Directionality | undefined);
142
202
  /**
143
203
  * Returns the element that is being used as a placeholder
144
204
  * while the current element is being dragged.
@@ -146,16 +206,42 @@ export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
146
206
  getPlaceholderElement(): HTMLElement;
147
207
  /** Returns the root draggable element. */
148
208
  getRootElement(): HTMLElement;
209
+ /** Registers the handles that can be used to drag the element. */
210
+ withHandles(handles: DragHandle[]): this;
211
+ /** Registers the template that should be used for the drag preview. */
212
+ withPreviewTemplate(template: DragHelperTemplate | null): this;
213
+ /** Registers the template that should be used for the drag placeholder. */
214
+ withPlaceholderTemplate(template: DragHelperTemplate | null): this;
215
+ /**
216
+ * Sets an alternate drag root element. The root element is the element that will be moved as
217
+ * the user is dragging. Passing an alternate root element is useful when trying to enable
218
+ * dragging on an element that you might not have access to.
219
+ */
220
+ withRootElement(rootElement: ElementRef<HTMLElement> | HTMLElement): this;
221
+ /**
222
+ * Element to which the draggable's position will be constrained.
223
+ */
224
+ withBoundaryElement(boundaryElement: ElementRef<HTMLElement> | HTMLElement | null): this;
225
+ /** Removes the dragging functionality from the DOM element. */
226
+ dispose(): void;
227
+ /** Checks whether the element is currently being dragged. */
228
+ isDragging(): boolean;
149
229
  /** Resets a standalone drag item to its initial position. */
150
230
  reset(): void;
151
- ngAfterViewInit(): void;
152
- ngOnDestroy(): void;
153
- /** Checks whether the element is currently being dragged. */
154
- _isDragging(): boolean;
155
- /** Gets only handles that are not inside descendant `CdkDrag` instances. */
156
- private getChildHandles;
231
+ /** Unsubscribes from the global subscriptions. */
232
+ private _removeSubscriptions;
233
+ /** Destroys the preview element and its ViewRef. */
234
+ private _destroyPreview;
235
+ /** Destroys the placeholder element and its ViewRef. */
236
+ private _destroyPlaceholder;
157
237
  /** Handler for the `mousedown`/`touchstart` events. */
158
- _pointerDown: (event: TouchEvent | MouseEvent) => void;
238
+ private _pointerDown;
239
+ /** Handler that is invoked when the user moves their pointer after they've initiated a drag. */
240
+ private _pointerMove;
241
+ /** Handler that is invoked when the user lifts their pointer up, after initiating a drag. */
242
+ private _pointerUp;
243
+ /** Starts the dragging sequence. */
244
+ private _startDragSequence;
159
245
  /**
160
246
  * Sets up the different variables and subscriptions
161
247
  * that will be necessary for the dragging sequence.
@@ -163,12 +249,6 @@ export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
163
249
  * @param event Browser event object that started the sequence.
164
250
  */
165
251
  private _initializeDragSequence;
166
- /** Starts the dragging sequence. */
167
- private _startDragSequence;
168
- /** Handler that is invoked when the user moves their pointer after they've initiated a drag. */
169
- private _pointerMove;
170
- /** Handler that is invoked when the user lifts their pointer up, after initiating a drag. */
171
- private _pointerUp;
172
252
  /** Cleans up the DOM artifacts that were added to facilitate the element being dragged. */
173
253
  private _cleanupDragArtifacts;
174
254
  /**
@@ -181,6 +261,11 @@ export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
181
261
  * and will be used as a preview of the element that is being dragged.
182
262
  */
183
263
  private _createPreviewElement;
264
+ /**
265
+ * Animates the preview element from its current position to the location of the drop placeholder.
266
+ * @returns Promise that resolves when the animation completes.
267
+ */
268
+ private _animatePreviewToPlaceholder;
184
269
  /** Creates an element that will be shown instead of the current element while dragging. */
185
270
  private _createPlaceholderElement;
186
271
  /**
@@ -189,30 +274,15 @@ export declare class CdkDrag<T = any> implements AfterViewInit, OnDestroy {
189
274
  * @param event Event that initiated the dragging.
190
275
  */
191
276
  private _getPointerPositionInElement;
192
- /**
193
- * Animates the preview element from its current position to the location of the drop placeholder.
194
- * @returns Promise that resolves when the animation completes.
195
- */
196
- private _animatePreviewToPlaceholder;
197
- /**
198
- * Helper to remove an element from the DOM and to do all the necessary null checks.
199
- * @param element Element to be removed.
200
- */
201
- private _removeElement;
202
277
  /** Determines the point of the page that was touched by the user. */
203
278
  private _getPointerPositionOnPage;
204
279
  /** Gets the pointer position on the page, accounting for any position constraints. */
205
280
  private _getConstrainedPointerPosition;
206
- /** Determines whether an event is a touch event. */
207
- private _isTouchEvent;
208
- /** Destroys the preview element and its ViewRef. */
209
- private _destroyPreview;
210
- /** Destroys the placeholder element and its ViewRef. */
211
- private _destroyPlaceholder;
212
281
  /** Updates the current drag delta, based on the user's current pointer position on the page. */
213
282
  private _updatePointerDirectionDelta;
214
- /** Gets the root draggable element, based on the `rootElementSelector`. */
215
- private _getRootElement;
216
- /** Unsubscribes from the global subscriptions. */
217
- private _removeSubscriptions;
283
+ /** Toggles the native drag interactions, based on how many handles are registered. */
284
+ private _toggleNativeDragInteractions;
285
+ /** Removes the manually-added event listeners from the root element. */
286
+ private _removeRootElementListeners;
218
287
  }
288
+ export {};
@@ -6,7 +6,14 @@
6
6
  * found in the LICENSE file at https://angular.io/license
7
7
  */
8
8
  import { InjectionToken, QueryList, ElementRef } from '@angular/core';
9
- import { CdkDrag } from './drag';
9
+ import { CdkDrag } from './directives/drag';
10
+ /**
11
+ * @deprecated To be removed. No longer being used. Previously the interface was used to avoid
12
+ * circular imports between `CdkDrag` and `CdkDropList`, however now we're using the
13
+ * `CdkDropListInternal` interface to achieve the same result, without having to maintain
14
+ * this large of an interface.
15
+ * @breaking-change 8.0.0
16
+ */
10
17
  export interface CdkDropListContainer<T = any> {
11
18
  /** DOM node that corresponds to the drop container. */
12
19
  element: ElementRef<HTMLElement>;
@@ -18,6 +25,8 @@ export interface CdkDropListContainer<T = any> {
18
25
  orientation: 'horizontal' | 'vertical';
19
26
  /** Locks the position of the draggable elements inside the container along the specified axis. */
20
27
  lockAxis: 'x' | 'y';
28
+ /** Whether starting a dragging sequence from this container is disabled. */
29
+ disabled: boolean;
21
30
  /** Starts dragging an item. */
22
31
  start(): void;
23
32
  /**
@@ -25,8 +34,10 @@ export interface CdkDropListContainer<T = any> {
25
34
  * @param item Item being dropped into the container.
26
35
  * @param currentIndex Index at which the item should be inserted.
27
36
  * @param previousContainer Container from which the item got dragged in.
37
+ * @param isPointerOverContainer Whether the user's pointer was over the
38
+ * container when the item was dropped.
28
39
  */
29
- drop(item: CdkDrag, currentIndex: number, previousContainer?: CdkDropListContainer): void;
40
+ drop(item: CdkDrag, currentIndex: number, previousContainer: Partial<CdkDropListContainer>, isPointerOverContainer: boolean): void;
30
41
  /**
31
42
  * Emits an event to indicate that the user moved an item into the container.
32
43
  * @param item Item that was moved into the container.
@@ -50,10 +61,17 @@ export interface CdkDropListContainer<T = any> {
50
61
  }): void;
51
62
  _draggables: QueryList<CdkDrag>;
52
63
  _getSiblingContainerFromPosition(item: CdkDrag, x: number, y: number): CdkDropListContainer | null;
53
- _canReturnItem(x: number, y: number): boolean;
64
+ _isOverContainer(x: number, y: number): boolean;
54
65
  }
55
66
  /**
56
67
  * Injection token that is used to provide a CdkDropList instance to CdkDrag.
57
68
  * Used for avoiding circular imports.
58
69
  */
70
+ export declare const CDK_DROP_LIST: InjectionToken<CdkDropListContainer<any>>;
71
+ /**
72
+ * Injection token that is used to provide a CdkDropList instance to CdkDrag.
73
+ * Used for avoiding circular imports.
74
+ * @deprecated Use `CDK_DROP_LIST` instead.
75
+ * @breaking-change 8.0.0
76
+ */
59
77
  export declare const CDK_DROP_LIST_CONTAINER: InjectionToken<CdkDropListContainer<any>>;