@atlaskit/pragmatic-drag-and-drop 1.8.0 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +29 -0
- package/combine/package.json +1 -8
- package/element/adapter/package.json +1 -8
- package/element/block-dragging-to-iframes/package.json +1 -8
- package/element/center-under-pointer/package.json +1 -8
- package/element/disable-native-drag-preview/package.json +1 -8
- package/element/format-urls-for-external/package.json +1 -8
- package/element/pointer-outside-of-preview/package.json +1 -8
- package/element/preserve-offset-on-source/package.json +1 -8
- package/element/scroll-just-enough-into-view/package.json +1 -8
- package/element/set-custom-native-drag-preview/package.json +1 -8
- package/external/adapter/package.json +1 -8
- package/external/file/package.json +1 -8
- package/external/html/package.json +1 -8
- package/external/some/package.json +1 -8
- package/external/text/package.json +1 -8
- package/external/url/package.json +1 -8
- package/once/package.json +1 -8
- package/package.json +4 -11
- package/prevent-unhandled/package.json +1 -8
- package/private/get-element-from-point-without-honey-pot/package.json +1 -8
- package/reorder/package.json +1 -8
- package/text-selection/adapter/package.json +1 -8
- package/types/package.json +1 -8
- package/dist/types-ts4.5/adapter/element-adapter-native-data-key.d.ts +0 -6
- package/dist/types-ts4.5/adapter/element-adapter.d.ts +0 -57
- package/dist/types-ts4.5/adapter/external-adapter.d.ts +0 -40
- package/dist/types-ts4.5/adapter/text-selection-adapter.d.ts +0 -22
- package/dist/types-ts4.5/entry-point/cancel-unhandled.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/combine.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/adapter.d.ts +0 -3
- package/dist/types-ts4.5/entry-point/element/block-dragging-to-iframes.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/center-under-pointer.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/disable-native-drag-preview.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/format-urls-for-external.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/pointer-outside-of-preview.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/preserve-offset-on-source.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/scroll-just-enough-into-view.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/element/set-custom-native-drag-preview.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/external/adapter.d.ts +0 -3
- package/dist/types-ts4.5/entry-point/external/file.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/external/html.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/external/some.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/external/text.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/external/url.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/once.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/prevent-unhandled.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/private/get-element-from-point-without-honey-pot.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/reorder.d.ts +0 -1
- package/dist/types-ts4.5/entry-point/text-selection/adapter.d.ts +0 -3
- package/dist/types-ts4.5/entry-point/types.d.ts +0 -1
- package/dist/types-ts4.5/honey-pot-fix/get-element-from-point-without-honey-pot.d.ts +0 -2
- package/dist/types-ts4.5/honey-pot-fix/honey-pot-data-attribute.d.ts +0 -1
- package/dist/types-ts4.5/honey-pot-fix/is-honey-pot-element.d.ts +0 -1
- package/dist/types-ts4.5/honey-pot-fix/make-honey-pot-fix.d.ts +0 -8
- package/dist/types-ts4.5/index.d.ts +0 -2
- package/dist/types-ts4.5/internal-types.d.ts +0 -350
- package/dist/types-ts4.5/ledger/dispatch-consumer-event.d.ts +0 -26
- package/dist/types-ts4.5/ledger/lifecycle-manager.d.ts +0 -16
- package/dist/types-ts4.5/ledger/usage-ledger.d.ts +0 -5
- package/dist/types-ts4.5/make-adapter/make-adapter.d.ts +0 -18
- package/dist/types-ts4.5/make-adapter/make-drop-target.d.ts +0 -5
- package/dist/types-ts4.5/make-adapter/make-monitor.d.ts +0 -8
- package/dist/types-ts4.5/public-utils/combine.d.ts +0 -3
- package/dist/types-ts4.5/public-utils/custom-external-data-type-media-type-prefix.d.ts +0 -1
- package/dist/types-ts4.5/public-utils/element/block-dragging-to-iframes.d.ts +0 -13
- package/dist/types-ts4.5/public-utils/element/custom-native-drag-preview/center-under-pointer.d.ts +0 -2
- package/dist/types-ts4.5/public-utils/element/custom-native-drag-preview/pointer-outside-of-preview.d.ts +0 -32
- package/dist/types-ts4.5/public-utils/element/custom-native-drag-preview/preserve-offset-on-source.d.ts +0 -6
- package/dist/types-ts4.5/public-utils/element/custom-native-drag-preview/set-custom-native-drag-preview.d.ts +0 -35
- package/dist/types-ts4.5/public-utils/element/custom-native-drag-preview/types.d.ts +0 -16
- package/dist/types-ts4.5/public-utils/element/disable-native-drag-preview.d.ts +0 -3
- package/dist/types-ts4.5/public-utils/element/format-urls-for-external.d.ts +0 -31
- package/dist/types-ts4.5/public-utils/element/scroll-just-enough-into-view.d.ts +0 -7
- package/dist/types-ts4.5/public-utils/external/file.d.ts +0 -4
- package/dist/types-ts4.5/public-utils/external/html.d.ts +0 -3
- package/dist/types-ts4.5/public-utils/external/native-types.d.ts +0 -12
- package/dist/types-ts4.5/public-utils/external/some.d.ts +0 -20
- package/dist/types-ts4.5/public-utils/external/text.d.ts +0 -3
- package/dist/types-ts4.5/public-utils/external/url.d.ts +0 -3
- package/dist/types-ts4.5/public-utils/once.d.ts +0 -2
- package/dist/types-ts4.5/public-utils/prevent-unhandled.d.ts +0 -19
- package/dist/types-ts4.5/public-utils/reorder.d.ts +0 -10
- package/dist/types-ts4.5/util/add-attribute.d.ts +0 -5
- package/dist/types-ts4.5/util/android.d.ts +0 -2
- package/dist/types-ts4.5/util/changing-window/count-events-for-safari.d.ts +0 -6
- package/dist/types-ts4.5/util/changing-window/is-entering-window.d.ts +0 -3
- package/dist/types-ts4.5/util/changing-window/is-from-another-window.d.ts +0 -4
- package/dist/types-ts4.5/util/changing-window/is-leaving-window.d.ts +0 -3
- package/dist/types-ts4.5/util/detect-broken-drag.d.ts +0 -12
- package/dist/types-ts4.5/util/get-input.d.ts +0 -2
- package/dist/types-ts4.5/util/is-firefox.d.ts +0 -4
- package/dist/types-ts4.5/util/is-safari-on-ios.d.ts +0 -16
- package/dist/types-ts4.5/util/is-safari.d.ts +0 -7
- package/dist/types-ts4.5/util/max-z-index.d.ts +0 -1
- package/dist/types-ts4.5/util/media-types/html-media-type.d.ts +0 -1
- package/dist/types-ts4.5/util/media-types/text-media-type.d.ts +0 -1
- package/dist/types-ts4.5/util/media-types/url-media-type.d.ts +0 -1
- package/dist/types-ts4.5/util/popover-reset-styles.d.ts +0 -16
- package/dist/types-ts4.5/util/supports-popover.d.ts +0 -10
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const honeyPotDataAttribute = "data-pdnd-honey-pot";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function isHoneyPotElement(target: EventTarget | null): boolean;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { type AllDragTypes, type BaseEventPayload, type CleanupFn, type EventPayloadMap } from '../internal-types';
|
|
2
|
-
export declare function makeHoneyPotFix(): {
|
|
3
|
-
bindEvents: () => CleanupFn;
|
|
4
|
-
getOnPostDispatch: () => ({ eventName, payload, }: {
|
|
5
|
-
eventName: keyof EventPayloadMap<AllDragTypes>;
|
|
6
|
-
payload: BaseEventPayload<AllDragTypes>;
|
|
7
|
-
}) => void;
|
|
8
|
-
};
|
|
@@ -1,350 +0,0 @@
|
|
|
1
|
-
export type CleanupFn = () => void;
|
|
2
|
-
/**
|
|
3
|
-
* Drop effects allowed to be passed to `getDropEffect()`.
|
|
4
|
-
* Cannot use `"none"` as a `dropEffect` for drop targets as
|
|
5
|
-
* it will opt out of accepting a drop for all nested drop targets.
|
|
6
|
-
* Please use `canDrop()` to disable dropping for this drop target.
|
|
7
|
-
*/
|
|
8
|
-
export type DropTargetAllowedDropEffect = Exclude<DataTransfer['dropEffect'], 'none'>;
|
|
9
|
-
/**
|
|
10
|
-
* Information about a drop target
|
|
11
|
-
*/
|
|
12
|
-
export type DropTargetRecord = {
|
|
13
|
-
/**
|
|
14
|
-
* The element the drop target is attached to
|
|
15
|
-
*/
|
|
16
|
-
element: Element;
|
|
17
|
-
/**
|
|
18
|
-
* Data associated with the drop target
|
|
19
|
-
*
|
|
20
|
-
* (Collected by `getData()`)
|
|
21
|
-
*/
|
|
22
|
-
data: Record<string | symbol, unknown>;
|
|
23
|
-
/**
|
|
24
|
-
* The drop effect for the drop target
|
|
25
|
-
*
|
|
26
|
-
* (Collected by `getDropEffect()`)
|
|
27
|
-
*/
|
|
28
|
-
dropEffect: DropTargetAllowedDropEffect;
|
|
29
|
-
/**
|
|
30
|
-
* Whether or not the drop target is active due to _stickiness_
|
|
31
|
-
*/
|
|
32
|
-
isActiveDueToStickiness: boolean;
|
|
33
|
-
};
|
|
34
|
-
export type Position = {
|
|
35
|
-
x: number;
|
|
36
|
-
y: number;
|
|
37
|
-
};
|
|
38
|
-
export type Serializable = {
|
|
39
|
-
[key: string]: number | string | Serializable | Serializable[];
|
|
40
|
-
};
|
|
41
|
-
export type Region = 'internal' | 'external';
|
|
42
|
-
export type ElementDragPayload = {
|
|
43
|
-
element: HTMLElement;
|
|
44
|
-
dragHandle: Element | null;
|
|
45
|
-
data: Record<string, unknown>;
|
|
46
|
-
};
|
|
47
|
-
export type ElementDragType = {
|
|
48
|
-
type: 'element';
|
|
49
|
-
startedFrom: 'internal';
|
|
50
|
-
payload: ElementDragPayload;
|
|
51
|
-
};
|
|
52
|
-
/**
|
|
53
|
-
* A convenance type to provide auto complete for common
|
|
54
|
-
* media types. This type will accept any `string`.
|
|
55
|
-
*
|
|
56
|
-
* For more information on media types, see:
|
|
57
|
-
*
|
|
58
|
-
* - {@link https://atlassian.design/components/pragmatic-drag-and-drop/core-package/adapters/external/custom-media}
|
|
59
|
-
* - {@link https://en.wikipedia.org/wiki/Media_type}
|
|
60
|
-
*/
|
|
61
|
-
export type NativeMediaType = 'text/uri-list' | 'text/plain' | 'text/html' | 'Files' | (string & {});
|
|
62
|
-
export type ExternalDragPayload = {
|
|
63
|
-
/**
|
|
64
|
-
* The media types that are being dragged during a drag.
|
|
65
|
-
*
|
|
66
|
-
* @example
|
|
67
|
-
*
|
|
68
|
-
* console.log(source.types);
|
|
69
|
-
* // → ["text/plain", "text/html"]
|
|
70
|
-
*/
|
|
71
|
-
types: NativeMediaType[];
|
|
72
|
-
/**
|
|
73
|
-
* The entities that are being dragged.
|
|
74
|
-
* Usually you will not be using these directly, but
|
|
75
|
-
* our helper functions can leverage them to extract
|
|
76
|
-
* particular kinds of data (eg files) that are being dragged
|
|
77
|
-
*/
|
|
78
|
-
items: DataTransferItem[];
|
|
79
|
-
/**
|
|
80
|
-
* returns the data for a given media type.
|
|
81
|
-
*
|
|
82
|
-
* - `getStringData(mediaType)` will return `null` if there is no data for that media type
|
|
83
|
-
* - `getStringData(mediaType)` will return the empty string (`""`) if the empty string (`""`)
|
|
84
|
-
* was explicitly set as the data for a media type.
|
|
85
|
-
* - `getStringData(mediaType)` will return null if requesting files (ie `getStringData('Files')`).
|
|
86
|
-
* To access files, use `source.items`, or better still, `getFiles({source})`
|
|
87
|
-
*
|
|
88
|
-
* Generally we recommend folks use our helpers to read native data rather than `getStringData(mediaType)`
|
|
89
|
-
*
|
|
90
|
-
* @example
|
|
91
|
-
*
|
|
92
|
-
* ```ts
|
|
93
|
-
* // Using getStringData()
|
|
94
|
-
* const text: string | null = source.getStringData("text/plain");
|
|
95
|
-
*
|
|
96
|
-
* // Using our text helper
|
|
97
|
-
* const text: string | null = getText({source});
|
|
98
|
-
* ```
|
|
99
|
-
* */
|
|
100
|
-
getStringData: (mediaType: string) => string | null;
|
|
101
|
-
};
|
|
102
|
-
export type ExternalDragType = {
|
|
103
|
-
type: 'external';
|
|
104
|
-
startedFrom: 'external';
|
|
105
|
-
payload: ExternalDragPayload;
|
|
106
|
-
getDropPayload: (event: DragEvent) => ExternalDragType['payload'];
|
|
107
|
-
};
|
|
108
|
-
export type TextSelectionDragPayload = {
|
|
109
|
-
/**
|
|
110
|
-
* The `Text` node that is the user started the drag from.
|
|
111
|
-
* Note: the `Text` node does not include all text being dragged.
|
|
112
|
-
* Use the `plain` or `html` properties to get the full selection
|
|
113
|
-
*/
|
|
114
|
-
target: Text;
|
|
115
|
-
/** The plain text of the selection */
|
|
116
|
-
plain: string;
|
|
117
|
-
/** the HTML of the selection */
|
|
118
|
-
HTML: string;
|
|
119
|
-
};
|
|
120
|
-
export type TextSelectionDragType = {
|
|
121
|
-
type: 'text-selection';
|
|
122
|
-
startedFrom: 'internal';
|
|
123
|
-
payload: TextSelectionDragPayload;
|
|
124
|
-
};
|
|
125
|
-
export type AllDragTypes = ElementDragType | ExternalDragType | TextSelectionDragType;
|
|
126
|
-
export type AdapterAPI<DragType extends AllDragTypes> = {
|
|
127
|
-
canStart: (event: DragEvent) => boolean;
|
|
128
|
-
start: (args: {
|
|
129
|
-
event: DragEvent;
|
|
130
|
-
dragType: DragType;
|
|
131
|
-
}) => void;
|
|
132
|
-
};
|
|
133
|
-
export type Input = {
|
|
134
|
-
altKey: boolean;
|
|
135
|
-
button: number;
|
|
136
|
-
buttons: number;
|
|
137
|
-
ctrlKey: boolean;
|
|
138
|
-
metaKey: boolean;
|
|
139
|
-
shiftKey: boolean;
|
|
140
|
-
clientX: number;
|
|
141
|
-
clientY: number;
|
|
142
|
-
pageX: number;
|
|
143
|
-
pageY: number;
|
|
144
|
-
};
|
|
145
|
-
export type DragLocation = {
|
|
146
|
-
/**
|
|
147
|
-
* A users input at a point in time
|
|
148
|
-
*/
|
|
149
|
-
input: Input;
|
|
150
|
-
/**
|
|
151
|
-
* A _bubble_ ordered (innermost upwards) list of active drop targets
|
|
152
|
-
*
|
|
153
|
-
* @example
|
|
154
|
-
* [grandChildRecord, childRecord, parentRecord]
|
|
155
|
-
*
|
|
156
|
-
*/
|
|
157
|
-
dropTargets: DropTargetRecord[];
|
|
158
|
-
};
|
|
159
|
-
export type DragLocationHistory = {
|
|
160
|
-
/**
|
|
161
|
-
* Where the drag operation started
|
|
162
|
-
*/
|
|
163
|
-
initial: DragLocation;
|
|
164
|
-
/**
|
|
165
|
-
* Where the user currently is
|
|
166
|
-
*/
|
|
167
|
-
current: DragLocation;
|
|
168
|
-
/**
|
|
169
|
-
* Where the user was previously.
|
|
170
|
-
* `previous` points to what `current` was in the last dispatched event
|
|
171
|
-
*
|
|
172
|
-
* `previous` is particularly useful for `onDropTargetChange`
|
|
173
|
-
* (and the derived `onDragEnter` and `onDragLeave`)
|
|
174
|
-
* as you can know what the delta of the change
|
|
175
|
-
*
|
|
176
|
-
* Exception: `onGenerateDragPreview` and `onDragStart` will have the
|
|
177
|
-
* same `current` and `previous` values. This is done so that the data
|
|
178
|
-
* received in `onDragStart` feels logical
|
|
179
|
-
* (`location.previous` should be `[]` in `onDragStart`)
|
|
180
|
-
*/
|
|
181
|
-
previous: Pick<DragLocation, 'dropTargets'>;
|
|
182
|
-
};
|
|
183
|
-
/**
|
|
184
|
-
* The common data that is provided to all events
|
|
185
|
-
*/
|
|
186
|
-
export type BaseEventPayload<DragType extends AllDragTypes> = {
|
|
187
|
-
/**
|
|
188
|
-
* Location history for the drag operation
|
|
189
|
-
*/
|
|
190
|
-
location: DragLocationHistory;
|
|
191
|
-
/**
|
|
192
|
-
* Data associated with the entity that is being dragged
|
|
193
|
-
*/
|
|
194
|
-
source: DragType['payload'];
|
|
195
|
-
};
|
|
196
|
-
export type EventPayloadMap<DragType extends AllDragTypes> = {
|
|
197
|
-
/**
|
|
198
|
-
* Drag is about to start.
|
|
199
|
-
* Make changes you want to see in the drag preview
|
|
200
|
-
*
|
|
201
|
-
* _Drag previews are not generated for external drag sources (eg files)_
|
|
202
|
-
*/
|
|
203
|
-
onGenerateDragPreview: BaseEventPayload<DragType> & {
|
|
204
|
-
/**
|
|
205
|
-
* Allows you to use the native `setDragImage` function if you want
|
|
206
|
-
* Although, we recommend using alternative techniques (see element adapter docs)
|
|
207
|
-
*/
|
|
208
|
-
nativeSetDragImage: DataTransfer['setDragImage'] | null;
|
|
209
|
-
};
|
|
210
|
-
/**
|
|
211
|
-
* A drag operation has started. You can make changes to the DOM and those changes won't be reflected in your _drag preview_
|
|
212
|
-
*/
|
|
213
|
-
onDragStart: BaseEventPayload<DragType>;
|
|
214
|
-
/**
|
|
215
|
-
* A throttled update of where the the user is currently dragging. Useful if you want to create a high fidelity experience such as drawing.
|
|
216
|
-
*/
|
|
217
|
-
onDrag: BaseEventPayload<DragType>;
|
|
218
|
-
/**
|
|
219
|
-
* The `onDropTargetChange` event fires when the `dropTarget` hierarchy changes during a drag.
|
|
220
|
-
*/
|
|
221
|
-
onDropTargetChange: BaseEventPayload<DragType>;
|
|
222
|
-
/**
|
|
223
|
-
* The `onDrop` event occurs when a user has finished a drag and drop operation.
|
|
224
|
-
* The `onDrop` event will fire when the drag operation finishes, regardless of how the drag operation finished
|
|
225
|
-
* (eg due to an explicit drop, the drag being canceled, recovering from an error and so on). On the web platform
|
|
226
|
-
* we cannot distinguish between dropping on no drop targets and an explicit cancel, so we do not publish any
|
|
227
|
-
* information about _how_ the drag ended, only that it ended.
|
|
228
|
-
*
|
|
229
|
-
* The `location.current` property will accurately contain the final drop targets.
|
|
230
|
-
*/
|
|
231
|
-
onDrop: BaseEventPayload<DragType>;
|
|
232
|
-
};
|
|
233
|
-
export type AllEvents<DragType extends AllDragTypes> = {
|
|
234
|
-
[EventName in keyof EventPayloadMap<DragType>]: (args: EventPayloadMap<DragType>[EventName]) => void;
|
|
235
|
-
};
|
|
236
|
-
export type MonitorGetFeedbackArgs<DragType extends AllDragTypes> = {
|
|
237
|
-
/**
|
|
238
|
-
* The users `initial` drag location
|
|
239
|
-
*/
|
|
240
|
-
initial: DragLocation;
|
|
241
|
-
/**
|
|
242
|
-
* The data associated with the entity being dragged
|
|
243
|
-
*/
|
|
244
|
-
source: DragType['payload'];
|
|
245
|
-
};
|
|
246
|
-
export type MonitorArgs<DragType extends AllDragTypes> = Partial<AllEvents<DragType>> & {
|
|
247
|
-
canMonitor?: (args: MonitorGetFeedbackArgs<DragType>) => boolean;
|
|
248
|
-
};
|
|
249
|
-
export type DropTargetGetFeedbackArgs<DragType extends AllDragTypes> = {
|
|
250
|
-
/**
|
|
251
|
-
* The users _current_ input
|
|
252
|
-
*/
|
|
253
|
-
input: Input;
|
|
254
|
-
/**
|
|
255
|
-
* The data associated with the entity being dragged
|
|
256
|
-
*/
|
|
257
|
-
source: DragType['payload'];
|
|
258
|
-
/**
|
|
259
|
-
* This drop target's element
|
|
260
|
-
*/
|
|
261
|
-
element: Element;
|
|
262
|
-
};
|
|
263
|
-
export type DropTargetLocalizedData = {
|
|
264
|
-
/**
|
|
265
|
-
* A convenance pointer to this drop targets values
|
|
266
|
-
*/
|
|
267
|
-
self: DropTargetRecord;
|
|
268
|
-
};
|
|
269
|
-
export type DropTargetEventBasePayload<DragType extends AllDragTypes> = BaseEventPayload<DragType> & DropTargetLocalizedData;
|
|
270
|
-
/**
|
|
271
|
-
* Mapping event names to the payloads for those events
|
|
272
|
-
*/
|
|
273
|
-
export type DropTargetEventPayloadMap<DragType extends AllDragTypes> = {
|
|
274
|
-
[EventName in keyof EventPayloadMap<DragType>]: EventPayloadMap<DragType>[EventName] & DropTargetLocalizedData;
|
|
275
|
-
} & {
|
|
276
|
-
/**
|
|
277
|
-
* Derived from the `onDropTargetChange` event
|
|
278
|
-
* (`onDragEnter` is not it's own event that bubbles)
|
|
279
|
-
*
|
|
280
|
-
* `onDragEnter` is fired when _this_ drop target is entered into
|
|
281
|
-
* and not when any child drop targets change
|
|
282
|
-
*/
|
|
283
|
-
onDragEnter: EventPayloadMap<DragType>['onDropTargetChange'] & DropTargetLocalizedData;
|
|
284
|
-
/**
|
|
285
|
-
* Derived from the `onDropTargetChange` event
|
|
286
|
-
* (`onDragLeave` is not it's own event that bubbles)
|
|
287
|
-
*
|
|
288
|
-
* `onDragLeave` is fired when _this_ drop target is exited from
|
|
289
|
-
* and not when any child drop targets change
|
|
290
|
-
*/
|
|
291
|
-
onDragLeave: EventPayloadMap<DragType>['onDropTargetChange'] & DropTargetLocalizedData;
|
|
292
|
-
};
|
|
293
|
-
export type DropTargetArgs<DragType extends AllDragTypes> = {
|
|
294
|
-
/**
|
|
295
|
-
* The `element` that you want to attach drop target behaviour to.
|
|
296
|
-
* The `element` is the unique _key_ for a drop target
|
|
297
|
-
*/
|
|
298
|
-
element: Element;
|
|
299
|
-
/**
|
|
300
|
-
* A function that returns `data` you want to attach to the drop target.
|
|
301
|
-
* `getData()` is called _repeatedly_ while the user is dragging over the drop target in order to power addons
|
|
302
|
-
*/
|
|
303
|
-
getData?: (args: DropTargetGetFeedbackArgs<DragType>) => Record<string | symbol, unknown>;
|
|
304
|
-
/**
|
|
305
|
-
* Used to conditionally block dropping.
|
|
306
|
-
* By default a drop target can be dropped on.
|
|
307
|
-
*
|
|
308
|
-
* Return `false` if you want to block a drop.
|
|
309
|
-
*
|
|
310
|
-
* Blocking dropping on a drop target will not block
|
|
311
|
-
* dropping on child or parent drop targets.
|
|
312
|
-
* If you want child or parent drop targets to block dropping,
|
|
313
|
-
* then they will need to return `false` from their `canDrop()`
|
|
314
|
-
*
|
|
315
|
-
* `canDrop()` is called _repeatedly_ while a drop target
|
|
316
|
-
* is being dragged over to allow you to dynamically
|
|
317
|
-
* change your mind as to whether a drop target can be
|
|
318
|
-
* dropped on.
|
|
319
|
-
*/
|
|
320
|
-
canDrop?: (args: DropTargetGetFeedbackArgs<DragType>) => boolean;
|
|
321
|
-
/**
|
|
322
|
-
* Optionally provide a _drop effect_ to be applied when
|
|
323
|
-
* this drop target is the innermost drop target being dragged over.
|
|
324
|
-
*/
|
|
325
|
-
getDropEffect?: (args: DropTargetGetFeedbackArgs<DragType>) => DropTargetAllowedDropEffect;
|
|
326
|
-
/**
|
|
327
|
-
* Return `true` if you want your drop target to hold onto
|
|
328
|
-
* selection after the user is no longer dragging over this drop target.
|
|
329
|
-
*
|
|
330
|
-
* Stickiness defaults to `false`
|
|
331
|
-
*
|
|
332
|
-
* _For more details about the stickiness algorithm please refer to the docs_
|
|
333
|
-
*/
|
|
334
|
-
getIsSticky?: (args: DropTargetGetFeedbackArgs<DragType>) => boolean;
|
|
335
|
-
} & {
|
|
336
|
-
[EventName in keyof DropTargetEventPayloadMap<DragType>]?: (args: DropTargetEventPayloadMap<DragType>[EventName]) => void;
|
|
337
|
-
};
|
|
338
|
-
export type DropTargetAPI<DragType extends AllDragTypes> = {
|
|
339
|
-
dropTargetForConsumers: (args: DropTargetArgs<DragType>) => CleanupFn;
|
|
340
|
-
dispatchEvent: <EventName extends keyof EventPayloadMap<DragType>>(args: {
|
|
341
|
-
eventName: EventName;
|
|
342
|
-
payload: EventPayloadMap<DragType>[EventName];
|
|
343
|
-
}) => void;
|
|
344
|
-
getIsOver: (args: {
|
|
345
|
-
source: DragType['payload'];
|
|
346
|
-
target: EventTarget | null;
|
|
347
|
-
input: Input;
|
|
348
|
-
current: DropTargetRecord[];
|
|
349
|
-
}) => DropTargetRecord[];
|
|
350
|
-
};
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { type AllDragTypes, type DragLocation, type EventPayloadMap } from '../internal-types';
|
|
2
|
-
export declare function makeDispatch<DragType extends AllDragTypes>({ source, initial, dispatchEvent, }: {
|
|
3
|
-
source: DragType['payload'];
|
|
4
|
-
initial: DragLocation;
|
|
5
|
-
dispatchEvent: <EventName extends keyof EventPayloadMap<DragType>>(args: {
|
|
6
|
-
eventName: EventName;
|
|
7
|
-
payload: EventPayloadMap<DragType>[EventName];
|
|
8
|
-
}) => void;
|
|
9
|
-
}): {
|
|
10
|
-
start({ nativeSetDragImage }: {
|
|
11
|
-
nativeSetDragImage: DataTransfer['setDragImage'] | null;
|
|
12
|
-
}): void;
|
|
13
|
-
dragUpdate({ current }: {
|
|
14
|
-
current: DragLocation;
|
|
15
|
-
}): void;
|
|
16
|
-
drag({ current }: {
|
|
17
|
-
current: DragLocation;
|
|
18
|
-
}): void;
|
|
19
|
-
drop({ current, updatedSourcePayload, }: {
|
|
20
|
-
current: DragLocation;
|
|
21
|
-
/** When dragging from an external source, we need to collect the
|
|
22
|
-
drag source information again as it is often only available during
|
|
23
|
-
the "drop" event */
|
|
24
|
-
updatedSourcePayload: DragType['payload'] | null;
|
|
25
|
-
}): void;
|
|
26
|
-
};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { type AllDragTypes, type DropTargetAPI, type EventPayloadMap } from '../internal-types';
|
|
2
|
-
declare function canStart(): boolean;
|
|
3
|
-
declare function start<DragType extends AllDragTypes>({ event, dragType, getDropTargetsOver, dispatchEvent, }: {
|
|
4
|
-
event: DragEvent;
|
|
5
|
-
dragType: DragType;
|
|
6
|
-
getDropTargetsOver: DropTargetAPI<DragType>['getIsOver'];
|
|
7
|
-
dispatchEvent: <EventName extends keyof EventPayloadMap<DragType>>(args: {
|
|
8
|
-
eventName: EventName;
|
|
9
|
-
payload: EventPayloadMap<DragType>[EventName];
|
|
10
|
-
}) => void;
|
|
11
|
-
}): void;
|
|
12
|
-
export declare const lifecycle: {
|
|
13
|
-
canStart: typeof canStart;
|
|
14
|
-
start: typeof start;
|
|
15
|
-
};
|
|
16
|
-
export {};
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { type AdapterAPI, type AllDragTypes, type CleanupFn, type DropTargetAllowedDropEffect, type DropTargetArgs, type EventPayloadMap, type MonitorArgs } from '../internal-types';
|
|
2
|
-
export declare function makeAdapter<DragType extends AllDragTypes>({ typeKey, mount, dispatchEventToSource, onPostDispatch, defaultDropEffect, }: {
|
|
3
|
-
typeKey: DragType['type'];
|
|
4
|
-
mount: (api: AdapterAPI<DragType>) => CleanupFn;
|
|
5
|
-
defaultDropEffect: DropTargetAllowedDropEffect;
|
|
6
|
-
dispatchEventToSource?: <EventName extends keyof EventPayloadMap<DragType>>(args: {
|
|
7
|
-
eventName: EventName;
|
|
8
|
-
payload: EventPayloadMap<DragType>[EventName];
|
|
9
|
-
}) => void;
|
|
10
|
-
onPostDispatch?: <EventName extends keyof EventPayloadMap<DragType>>(args: {
|
|
11
|
-
eventName: EventName;
|
|
12
|
-
payload: EventPayloadMap<DragType>[EventName];
|
|
13
|
-
}) => void;
|
|
14
|
-
}): {
|
|
15
|
-
registerUsage: () => CleanupFn;
|
|
16
|
-
dropTarget: (args: DropTargetArgs<DragType>) => CleanupFn;
|
|
17
|
-
monitor: (args: MonitorArgs<DragType>) => CleanupFn;
|
|
18
|
-
};
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { type AllDragTypes, type DropTargetAllowedDropEffect, type DropTargetAPI } from '../internal-types';
|
|
2
|
-
export declare function makeDropTarget<DragType extends AllDragTypes>({ typeKey, defaultDropEffect, }: {
|
|
3
|
-
typeKey: DragType['type'];
|
|
4
|
-
defaultDropEffect: DropTargetAllowedDropEffect;
|
|
5
|
-
}): DropTargetAPI<DragType>;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { type AllDragTypes, type CleanupFn, type EventPayloadMap, type MonitorArgs } from '../internal-types';
|
|
2
|
-
export declare function makeMonitor<DragType extends AllDragTypes>(): {
|
|
3
|
-
dispatchEvent: <EventName extends keyof EventPayloadMap<DragType>>({ eventName, payload, }: {
|
|
4
|
-
eventName: EventName;
|
|
5
|
-
payload: EventPayloadMap<DragType>[EventName];
|
|
6
|
-
}) => void;
|
|
7
|
-
monitorForConsumers: (args: MonitorArgs<DragType>) => CleanupFn;
|
|
8
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const customDataMediaTypePrefix = "application/vnd.pdnd-custom-data-";
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { type CleanupFn } from '../../internal-types';
|
|
2
|
-
/**
|
|
3
|
-
* Block dragging of a draggable element to <iframe> elements.
|
|
4
|
-
*
|
|
5
|
-
* @description
|
|
6
|
-
*
|
|
7
|
-
* - This function sets `pointer-events:none !important` to all `<iframe>` elements for the duration of the drag.
|
|
8
|
-
* - Once an `<iframe>` is disabled, it will only be re-enabled once the current drag interaction is completed (and not when the `CleanupFn` is called)
|
|
9
|
-
* - This function currently does not watch for new `<iframe>` elements being adding during a drag operation.
|
|
10
|
-
*/
|
|
11
|
-
export declare function blockDraggingToIFrames({ element }: {
|
|
12
|
-
element: HTMLElement;
|
|
13
|
-
}): CleanupFn;
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import type { GetOffsetFn } from './types';
|
|
2
|
-
/** Any valid CSS string value
|
|
3
|
-
* @example `calc(var(--grid) * 2)
|
|
4
|
-
*/
|
|
5
|
-
type CSSValue = string;
|
|
6
|
-
/**
|
|
7
|
-
* Position the native drag preview **in front** of the users pointer.
|
|
8
|
-
*
|
|
9
|
-
* **Distance**
|
|
10
|
-
*
|
|
11
|
-
* If the total width of your preview (including the offset applied by this function)
|
|
12
|
-
* exceeds `280px` then the drag preview will have more opacity applied on Windows.
|
|
13
|
-
*
|
|
14
|
-
* https://atlassian.design/components/pragmatic-drag-and-drop/web-platform-design-constraints
|
|
15
|
-
*
|
|
16
|
-
* **Direction**
|
|
17
|
-
*
|
|
18
|
-
* This function will position the drag preview on the _right hand side for left to right (`ltr`) interfaces_, and on the _left hand side for right to left (`rtl`) languages_.
|
|
19
|
-
*
|
|
20
|
-
* The direction will be calculated based on the direction (`dir`) being applied to the `container`
|
|
21
|
-
* element (which will be a child of the `body` element).
|
|
22
|
-
*
|
|
23
|
-
* **iOS, iPadOS and Android**
|
|
24
|
-
*
|
|
25
|
-
* The drag preview will be centered under the users pointer rather than
|
|
26
|
-
* pushed away on iOS due to platform limitations.
|
|
27
|
-
*/
|
|
28
|
-
export declare function pointerOutsideOfPreview(point: {
|
|
29
|
-
x: CSSValue;
|
|
30
|
-
y: CSSValue;
|
|
31
|
-
}): GetOffsetFn;
|
|
32
|
-
export {};
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { type ElementEventPayloadMap } from '../../../adapter/element-adapter';
|
|
2
|
-
import type { GetOffsetFn } from './types';
|
|
3
|
-
/** A function to remove the element that has been added to the `container`.
|
|
4
|
-
* @example () => ReactDOM.unmountComponentAtNode(container)
|
|
5
|
-
*/
|
|
6
|
-
type CleanupFn = () => void;
|
|
7
|
-
/** A function that will render a preview element into a `container` `HTMLElement` */
|
|
8
|
-
type RenderFn = ({ container, }: {
|
|
9
|
-
/** The `HTMLElement` that you need to render your preview element into.
|
|
10
|
-
`container` will be appended to the `document.body` and will be removed
|
|
11
|
-
after your `CleanupFn` is called
|
|
12
|
-
*/
|
|
13
|
-
container: HTMLElement;
|
|
14
|
-
}) => CleanupFn | void;
|
|
15
|
-
/** This function provides the ability to mount an element for it to be used as the native drag preview
|
|
16
|
-
*
|
|
17
|
-
* @example
|
|
18
|
-
* draggable({
|
|
19
|
-
* onGenerateDragPreview: ({ nativeSetDragImage }) => {
|
|
20
|
-
* setCustomNativeDragPreview({
|
|
21
|
-
* render: ({ container }) => {
|
|
22
|
-
* ReactDOM.render(<Preview item={item} />, container);
|
|
23
|
-
* return () => ReactDOM.unmountComponentAtNode(container);
|
|
24
|
-
* },
|
|
25
|
-
* nativeSetDragImage,
|
|
26
|
-
* });
|
|
27
|
-
* },
|
|
28
|
-
* });
|
|
29
|
-
*/
|
|
30
|
-
export declare function setCustomNativeDragPreview({ render, nativeSetDragImage, getOffset, }: {
|
|
31
|
-
getOffset?: GetOffsetFn;
|
|
32
|
-
render: RenderFn;
|
|
33
|
-
nativeSetDragImage: ElementEventPayloadMap['onGenerateDragPreview']['nativeSetDragImage'];
|
|
34
|
-
}): void;
|
|
35
|
-
export {};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import type { Position } from '../../../internal-types';
|
|
2
|
-
/** A function that will push the position of native drag preview.
|
|
3
|
-
*
|
|
4
|
-
* `{x: 0, y: 0}` represents having the users pointer user the top left corner of the drag preview.
|
|
5
|
-
*
|
|
6
|
-
* @example
|
|
7
|
-
* `const rect = container.getBoundingClientRect()`
|
|
8
|
-
*
|
|
9
|
-
* - `{x: 0, y: 0}` → top left of the `container` will be under the users pointer **(default)**
|
|
10
|
-
* - `{x: rect.width, y: 0}` → top right of the `container` will be under the users pointer
|
|
11
|
-
* - `{x: rect.width, y: rect.height}` → bottom right of the `container` will be under the users pointer
|
|
12
|
-
* - `{x: 0, y: rect.height}`→ bottom left of the `container` will be under the users pointer
|
|
13
|
-
*/
|
|
14
|
-
export type GetOffsetFn = (args: {
|
|
15
|
-
container: HTMLElement;
|
|
16
|
-
}) => Position;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Helps to add multiple URLs for external consumption
|
|
3
|
-
*
|
|
4
|
-
* @example
|
|
5
|
-
*
|
|
6
|
-
* ```ts
|
|
7
|
-
* // 🤩 with `formatURLsForExternal`
|
|
8
|
-
* draggable({
|
|
9
|
-
* element,
|
|
10
|
-
* getInitialDataForExternal() {
|
|
11
|
-
* return {
|
|
12
|
-
* 'text/uri-list': formatURLsForExternal([
|
|
13
|
-
* 'https://atlassian.design/',
|
|
14
|
-
* 'https://domevents.dev/',
|
|
15
|
-
* ]),
|
|
16
|
-
* };
|
|
17
|
-
* },
|
|
18
|
-
* });
|
|
19
|
-
*
|
|
20
|
-
* // 🤮 without the `formatURLsForExternal()`
|
|
21
|
-
* draggable({
|
|
22
|
-
* element,
|
|
23
|
-
* getInitialDataForExternal() {
|
|
24
|
-
* return {
|
|
25
|
-
* 'text/uri-list': 'https://atlassian.design/\r\nhttps://domevents.dev/',
|
|
26
|
-
* };
|
|
27
|
-
* },
|
|
28
|
-
* });
|
|
29
|
-
* ```
|
|
30
|
-
*/
|
|
31
|
-
export declare function formatURLsForExternal(urls: string[]): string;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Scroll an `element` just enough into view so that the element becomes totally visible.
|
|
3
|
-
* If the element is already totally visible then no scrolling will occur.
|
|
4
|
-
*/
|
|
5
|
-
export declare function scrollJustEnoughIntoView({ element }: {
|
|
6
|
-
element: Element;
|
|
7
|
-
}): void;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type { ExternalDragPayload } from '../../internal-types';
|
|
2
|
-
/** `ContainsSource` works for
|
|
3
|
-
* 1. `monitorForNative` > `canMonitor()`
|
|
4
|
-
* 2. `dropTargetForNative` > `canDrop()`
|
|
5
|
-
*
|
|
6
|
-
* We are also using `SourcePayload` as the parameter type for all native getters.
|
|
7
|
-
* For example, `getFiles({source}: SourcePayload)`
|
|
8
|
-
*/
|
|
9
|
-
export type ContainsSource = {
|
|
10
|
-
source: ExternalDragPayload;
|
|
11
|
-
};
|
|
12
|
-
export type PredicateFn = (args: ContainsSource) => boolean;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { type PredicateFn } from './native-types';
|
|
2
|
-
/**
|
|
3
|
-
* Will return `true` when any native predicate function returns `true`.
|
|
4
|
-
* Using the name `"some"` for consistency with `Array.prototype.some`.\
|
|
5
|
-
*
|
|
6
|
-
* @example
|
|
7
|
-
*
|
|
8
|
-
* ```ts
|
|
9
|
-
* monitorForNative({
|
|
10
|
-
* // enable monitor when dragging files or text
|
|
11
|
-
* canMonitor: some(containsFiles, containsText),
|
|
12
|
-
* });
|
|
13
|
-
*
|
|
14
|
-
* monitorForNative({
|
|
15
|
-
* // enable monitor when dragging external files or internal text
|
|
16
|
-
* canMonitor: some(external(containsFiles), internal(containsText)),
|
|
17
|
-
* });
|
|
18
|
-
* ```
|
|
19
|
-
*/
|
|
20
|
-
export declare function some(...predicates: PredicateFn[]): PredicateFn;
|