Skip to content

Commit 14d1c7d

Browse files
crisbetocrisbeto
committed
main - 1f34b94 fix(cdk/drag-drop): make item and list easier to tree shake (#32604)
1 parent 4c1169e commit 14d1c7d

2 files changed

Lines changed: 191 additions & 15 deletions

File tree

‎docs-content/api-docs/cdk-drag-drop.html‎

Lines changed: 183 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,11 @@ <h4 id="DragDrop" class="docs-header-link docs-api-h4 docs-api-class-name">
3939
<code>DragDrop</code>
4040

4141
</h4><p class="docs-api-class-description"><p>Service that allows for drag-and-drop functionality to be attached to DOM elements.</p>
42-
</p>
42+
</p><div class="docs-api-class-deprecated-marker" deprecated-message="Use the `createDragRef` or `createDropListRef` function for better tree shaking.
43+
Will be removed in v23. Will be removed in v23.0.0 or later."
44+
>
45+
Deprecated
46+
</div>
4347

4448

4549
<h5 class="docs-api-h5 docs-api-method-header">Methods</h5>
@@ -50,12 +54,15 @@ <h5 class="docs-api-h5 docs-api-method-header">Methods</h5>
5054
<table class="docs-api-method-table">
5155
<thead>
5256
<tr class="docs-api-method-name-row">
53-
<th colspan="2" class="docs-api-method-name-cell">createDrag
57+
<th colspan="2" class="docs-api-method-name-cell"><div class="docs-api-deprecated-marker" deprecated-message="Use the `createDragRef` function that provides better tree shaking. Will be removed in v23.0.0 or later."
58+
>
59+
Deprecated
60+
</div>createDrag
5461
(<span class="docs-api-method-parameter-name">element:
5562
</span>
56-
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>, <span class="docs-api-method-parameter-name">config:
63+
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>, <span class="docs-api-method-parameter-name">config<span class="docs-api-method-parameter-optional-marker">?</span>:
5764
</span>
58-
<code class="docs-api-method-parameter-type">DragRefConfig = DEFAULT_CONFIG</code>): <code class="docs-api-method-returns-type">DragRef&lt;T&gt;</code>
65+
<code class="docs-api-method-parameter-type">DragRefConfig</code>): <code class="docs-api-method-returns-type">DragRef&lt;T&gt;</code>
5966
</th>
6067
</tr>
6168
</thead><tr class="docs-api-method-description-row">
@@ -86,8 +93,8 @@ <h5 class="docs-api-h5 docs-api-method-header">Methods</h5>
8693
<tr class="docs-api-method-parameter-row">
8794
<td class="docs-api-method-parameter-cell">
8895
<p class="docs-api-method-parameter-name">
89-
config</p>
90-
<code class="docs-api-method-parameter-type">DragRefConfig = DEFAULT_CONFIG</code>
96+
config<span class="docs-api-method-parameter-optional-marker">?</span></p>
97+
<code class="docs-api-method-parameter-type">DragRefConfig</code>
9198
</td>
9299
<td class="docs-api-method-parameter-description-cell">
93100
<p class="docs-api-method-parameter-description">
@@ -121,7 +128,10 @@ <h5 class="docs-api-h5 docs-api-method-header">Methods</h5>
121128
<table class="docs-api-method-table">
122129
<thead>
123130
<tr class="docs-api-method-name-row">
124-
<th colspan="2" class="docs-api-method-name-cell">createDropList
131+
<th colspan="2" class="docs-api-method-name-cell"><div class="docs-api-deprecated-marker" deprecated-message="Use the `createDropListRef` function that provides better tree shaking. Will be removed in v23.0.0 or later."
132+
>
133+
Deprecated
134+
</div>createDropList
125135
(<span class="docs-api-method-parameter-name">element:
126136
</span>
127137
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>): <code class="docs-api-method-returns-type">DropListRef&lt;T&gt;</code>
@@ -4465,6 +4475,172 @@ <h3 id="cdk-drag-drop-functions" class="docs-header-link docs-api-h3">
44654475

44664476

44674477

4478+
<div class="docs-api-method-card">
4479+
<table class="docs-api-method-table">
4480+
<thead>
4481+
<tr class="docs-api-method-name-row">
4482+
<th colspan="2" class="docs-api-method-name-cell">createDragRef
4483+
(<span class="docs-api-method-parameter-name">injector:
4484+
</span>
4485+
<code class="docs-api-method-parameter-type">Injector</code>, <span class="docs-api-method-parameter-name">element:
4486+
</span>
4487+
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>, <span class="docs-api-method-parameter-name">config:
4488+
</span>
4489+
<code class="docs-api-method-parameter-type">DragRefConfig = {
4490+
dragStartThreshold: 5,
4491+
pointerDirectionChangeThreshold: 5,
4492+
}</code>): <code class="docs-api-method-returns-type">DragRef&lt;T&gt;</code>
4493+
</th>
4494+
</tr>
4495+
</thead><tr class="docs-api-method-description-row">
4496+
<td colspan="2" class="docs-api-method-description-cell">
4497+
<p>Creates a <code>DragRef</code> for an element, turning it into a draggable item.</p>
4498+
4499+
</td>
4500+
</tr><thead>
4501+
<tr class="docs-api-method-parameters-header-row">
4502+
<th colspan="2" class="docs-api-method-parameters-header-cell">Parameters</th>
4503+
</tr>
4504+
</thead>
4505+
4506+
<tr class="docs-api-method-parameter-row">
4507+
<td class="docs-api-method-parameter-cell">
4508+
<p class="docs-api-method-parameter-name">
4509+
injector</p>
4510+
<code class="docs-api-method-parameter-type">Injector</code>
4511+
</td>
4512+
<td class="docs-api-method-parameter-description-cell">
4513+
<p class="docs-api-method-parameter-description">
4514+
<p>Injector used to resolve dependencies.</p>
4515+
4516+
</p>
4517+
</td>
4518+
</tr>
4519+
4520+
<tr class="docs-api-method-parameter-row">
4521+
<td class="docs-api-method-parameter-cell">
4522+
<p class="docs-api-method-parameter-name">
4523+
element</p>
4524+
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>
4525+
</td>
4526+
<td class="docs-api-method-parameter-description-cell">
4527+
<p class="docs-api-method-parameter-description">
4528+
<p>Element to which to attach the dragging functionality.</p>
4529+
4530+
</p>
4531+
</td>
4532+
</tr>
4533+
4534+
<tr class="docs-api-method-parameter-row">
4535+
<td class="docs-api-method-parameter-cell">
4536+
<p class="docs-api-method-parameter-name">
4537+
config</p>
4538+
<code class="docs-api-method-parameter-type">DragRefConfig = {
4539+
dragStartThreshold: 5,
4540+
pointerDirectionChangeThreshold: 5,
4541+
}</code>
4542+
</td>
4543+
<td class="docs-api-method-parameter-description-cell">
4544+
<p class="docs-api-method-parameter-description">
4545+
<p>Object used to configure the dragging behavior.</p>
4546+
4547+
</p>
4548+
</td>
4549+
</tr>
4550+
<thead>
4551+
<tr class="docs-api-method-returns-header-row">
4552+
<th colspan="2" class="docs-api-method-returns-header-cell">Returns</th>
4553+
</tr>
4554+
</thead>
4555+
<tr>
4556+
<td class="docs-api-method-returns-type-cell">
4557+
<code class="docs-api-method-returns-type">DragRef&lt;T&gt;</code>
4558+
</td>
4559+
<td class="docs-api-method-returns-description-cell">
4560+
<p class="docs-api-method-returns-description">
4561+
4562+
</p>
4563+
</td>
4564+
</tr></table>
4565+
</div>
4566+
4567+
4568+
4569+
4570+
4571+
4572+
<div class="docs-api-method-card">
4573+
<table class="docs-api-method-table">
4574+
<thead>
4575+
<tr class="docs-api-method-name-row">
4576+
<th colspan="2" class="docs-api-method-name-cell">createDropListRef
4577+
(<span class="docs-api-method-parameter-name">injector:
4578+
</span>
4579+
<code class="docs-api-method-parameter-type">Injector</code>, <span class="docs-api-method-parameter-name">element:
4580+
</span>
4581+
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>): <code class="docs-api-method-returns-type">DropListRef&lt;T&gt;</code>
4582+
</th>
4583+
</tr>
4584+
</thead><tr class="docs-api-method-description-row">
4585+
<td colspan="2" class="docs-api-method-description-cell">
4586+
<p>Creates a <code>DropListRef</code> for an element, turning it into a drop list.</p>
4587+
4588+
</td>
4589+
</tr><thead>
4590+
<tr class="docs-api-method-parameters-header-row">
4591+
<th colspan="2" class="docs-api-method-parameters-header-cell">Parameters</th>
4592+
</tr>
4593+
</thead>
4594+
4595+
<tr class="docs-api-method-parameter-row">
4596+
<td class="docs-api-method-parameter-cell">
4597+
<p class="docs-api-method-parameter-name">
4598+
injector</p>
4599+
<code class="docs-api-method-parameter-type">Injector</code>
4600+
</td>
4601+
<td class="docs-api-method-parameter-description-cell">
4602+
<p class="docs-api-method-parameter-description">
4603+
<p>Injector used to resolve dependencies.</p>
4604+
4605+
</p>
4606+
</td>
4607+
</tr>
4608+
4609+
<tr class="docs-api-method-parameter-row">
4610+
<td class="docs-api-method-parameter-cell">
4611+
<p class="docs-api-method-parameter-name">
4612+
element</p>
4613+
<code class="docs-api-method-parameter-type">HTMLElement | ElementRef&lt;HTMLElement&gt;</code>
4614+
</td>
4615+
<td class="docs-api-method-parameter-description-cell">
4616+
<p class="docs-api-method-parameter-description">
4617+
<p>Element to which to attach the drop list functionality.</p>
4618+
4619+
</p>
4620+
</td>
4621+
</tr>
4622+
<thead>
4623+
<tr class="docs-api-method-returns-header-row">
4624+
<th colspan="2" class="docs-api-method-returns-header-cell">Returns</th>
4625+
</tr>
4626+
</thead>
4627+
<tr>
4628+
<td class="docs-api-method-returns-type-cell">
4629+
<code class="docs-api-method-returns-type">DropListRef&lt;T&gt;</code>
4630+
</td>
4631+
<td class="docs-api-method-returns-description-cell">
4632+
<p class="docs-api-method-returns-description">
4633+
4634+
</p>
4635+
</td>
4636+
</tr></table>
4637+
</div>
4638+
4639+
4640+
4641+
4642+
4643+
44684644
<div class="docs-api-method-card">
44694645
<table class="docs-api-method-table">
44704646
<thead>

‎package.json‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@angular/components-examples",
3-
"version": "21.1.0-next.3+sha-2c4f4bf",
3+
"version": "21.1.0-next.3+sha-1f34b94",
44
"description": "Angular Components Examples",
55
"private": true,
66
"repository": {
@@ -259,15 +259,15 @@
259259
},
260260
"homepage": "https://github.com/angular/components#readme",
261261
"peerDependencies": {
262-
"@angular/aria": "21.1.0-next.3+sha-2c4f4bf",
263-
"@angular/cdk": "21.1.0-next.3+sha-2c4f4bf",
264-
"@angular/cdk-experimental": "21.1.0-next.3+sha-2c4f4bf",
262+
"@angular/aria": "21.1.0-next.3+sha-1f34b94",
263+
"@angular/cdk": "21.1.0-next.3+sha-1f34b94",
264+
"@angular/cdk-experimental": "21.1.0-next.3+sha-1f34b94",
265265
"@angular/core": "^21.0.0-0 || ^21.1.0-0 || ^21.2.0-0 || ^21.3.0-0 || ^22.0.0-0",
266266
"@angular/common": "^21.0.0-0 || ^21.1.0-0 || ^21.2.0-0 || ^21.3.0-0 || ^22.0.0-0",
267-
"@angular/material": "21.1.0-next.3+sha-2c4f4bf",
268-
"@angular/material-experimental": "21.1.0-next.3+sha-2c4f4bf",
269-
"@angular/material-luxon-adapter": "21.1.0-next.3+sha-2c4f4bf",
270-
"@angular/material-date-fns-adapter": "21.1.0-next.3+sha-2c4f4bf"
267+
"@angular/material": "21.1.0-next.3+sha-1f34b94",
268+
"@angular/material-experimental": "21.1.0-next.3+sha-1f34b94",
269+
"@angular/material-luxon-adapter": "21.1.0-next.3+sha-1f34b94",
270+
"@angular/material-date-fns-adapter": "21.1.0-next.3+sha-1f34b94"
271271
},
272272
"devDependencies": {
273273
"@angular/aria": "workspace:*",

0 commit comments

Comments
 (0)