development/vscode
development/vscode
1
0
Fork 0
mirror of https://github.com/Microsoft/vscode synced 2024-07-17 02:57:19 +00:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

Finalize tree drag and drop API

Browse source 
Fixes #32592
This commit is contained in:
Alex Ross 2022-03-02 15:34:55 +01:00
parent 38c2e5860d
commit c468903ff7
No known key found for this signature in database
GPG key ID: 89DDDBA66CBA7840
7 changed files with 108 additions and 135 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
extensions/vscode-api-tests/package.json
View file

@ -46,7 +46,6 @@
"textSearchProvider",
"timeline",
"tokenInformation",
"treeViewDragAndDrop",
"treeViewReveal",
"workspaceTrust",
"telemetry"

4
src/vs/workbench/api/common/extHost.api.impl.ts
View file

@ -1303,8 +1303,8 @@ export function createApiFactoryAndRegisterActors(accessor: ServicesAccessor): I
TestTag: extHostTypes.TestTag,
TestRunProfileKind: extHostTypes.TestRunProfileKind,
TextSearchCompleteMessageType: TextSearchCompleteMessageType,
TreeDataTransfer: extHostTypes.TreeDataTransfer,
TreeDataTransferItem: extHostTypes.TreeDataTransferItem,
DataTransfer: extHostTypes.DataTransfer,
DataTransferItem: extHostTypes.DataTransferItem,
CoveredCount: extHostTypes.CoveredCount,
FileCoverage: extHostTypes.FileCoverage,
StatementCoverage: extHostTypes.StatementCoverage,

12
src/vs/workbench/api/common/extHostTreeViews.ts
View file

@ -50,7 +50,7 @@ function toTreeItemLabel(label: any, extension: IExtensionDescription): ITreeIte
export class ExtHostTreeViews implements ExtHostTreeViewsShape {
private treeViews: Map<string, ExtHostTreeView<any>> = new Map<string, ExtHostTreeView<any>>();
private treeDragAndDropService: ITreeViewsService<vscode.TreeDataTransfer, any, any> = new TreeviewsService<vscode.TreeDataTransfer, any, any>();
private treeDragAndDropService: ITreeViewsService<vscode.DataTransfer, any, any> = new TreeviewsService<vscode.DataTransfer, any, any>();
constructor(
private _proxy: MainThreadTreeViewsShape,
@ -296,10 +296,8 @@ class ExtHostTreeView<T> extends Disposable {
}
this.dataProvider = options.treeDataProvider;
this.dndController = options.dragAndDropController;
if (this.dataProvider.onDidChangeTreeData2) {
this._register(this.dataProvider.onDidChangeTreeData2(elementOrElements => this._onDidChangeData.fire({ message: false, element: elementOrElements })));
} else if (this.dataProvider.onDidChangeTreeData) {
this._register(this.dataProvider.onDidChangeTreeData(element => this._onDidChangeData.fire({ message: false, element })));
if (this.dataProvider.onDidChangeTreeData) {
this._register(this.dataProvider.onDidChangeTreeData(elementOrElements => this._onDidChangeData.fire({ message: false, element: elementOrElements })));
}
let refreshingPromise: Promise<void> | null;
@ -433,7 +431,7 @@ class ExtHostTreeView<T> extends Disposable {
}
}
async handleDrag(sourceTreeItemHandles: TreeItemHandle[], treeDataTransfer: ITreeDataTransfer, token: CancellationToken): Promise<vscode.TreeDataTransfer | undefined> {
async handleDrag(sourceTreeItemHandles: TreeItemHandle[], treeDataTransfer: ITreeDataTransfer, token: CancellationToken): Promise<vscode.DataTransfer | undefined> {
const extensionTreeItems: T[] = [];
for (const sourceHandle of sourceTreeItemHandles) {
const extensionItem = this.getExtensionElement(sourceHandle);
@ -453,7 +451,7 @@ class ExtHostTreeView<T> extends Disposable {
return !!this.dndController?.handleDrag;
}
async onDrop(treeDataTransfer: vscode.TreeDataTransfer, targetHandleOrNode: TreeItemHandle, token: CancellationToken): Promise<void> {
async onDrop(treeDataTransfer: vscode.DataTransfer, targetHandleOrNode: TreeItemHandle, token: CancellationToken): Promise<void> {
const target = this.getExtensionElement(targetHandleOrNode);
if (!target || !this.dndController?.handleDrop) {
return;

4
src/vs/workbench/api/common/extHostTypes.ts
View file

@ -2349,7 +2349,7 @@ export enum TreeItemCollapsibleState {
}
@es5ClassCompat
export class TreeDataTransferItem {
export class DataTransferItem {
async asString(): Promise<string> {
return typeof this.value === 'string' ? this.value : JSON.stringify(this.value);
}
@ -2358,7 +2358,7 @@ export class TreeDataTransferItem {
}
@es5ClassCompat
export class TreeDataTransfer<T extends TreeDataTransferItem = TreeDataTransferItem> {
export class DataTransfer<T extends DataTransferItem = DataTransferItem> {
private readonly _items: Map<string, T> = new Map();
get(mimeType: string): T | undefined {
return this._items.get(mimeType);

1
src/vs/workbench/services/extensions/common/extensionsApiProposals.ts
View file

@ -57,7 +57,6 @@ export const allApiProposals = Object.freeze({
textSearchProvider: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.textSearchProvider.d.ts',
timeline: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.timeline.d.ts',
tokenInformation: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.tokenInformation.d.ts',
treeViewDragAndDrop: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.treeViewDragAndDrop.d.ts',
treeViewReveal: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.treeViewReveal.d.ts',
workspaceTrust: 'https://raw.githubusercontent.com/microsoft/vscode/main/src/vscode-dts/vscode.proposed.workspaceTrust.d.ts'
});

100
src/vscode-dts/vscode.d.ts vendored
View file

@ -9699,6 +9699,11 @@ declare module 'vscode' {
* array containing all selected tree items.
*/
canSelectMany?: boolean;
/**
* An optional interface to implement drag and drop in the tree view.
*/
dragAndDropController?: TreeDragAndDropController<T>;
}
/**
@ -9737,6 +9742,99 @@ declare module 'vscode' {
}
/**
* A class for encapsulating data transferred during a drag and drop event.
*
* You can use the `value` of the `DataTransferItem` to get back the object you put into it
* so long as the extension that created the `DataTransferItem` runs in the same extension host.
*/
export class DataTransferItem {
asString(): Thenable<string>;
readonly value: any;
constructor(value: any);
}
/**
* A map containing a mapping of the mime type of the corresponding transferred data.
* Drag and drop controllers that implement `handleDrag` can additional mime types to the data transfer
* These additional mime types will only be included in the `handleDrop` when the the drag was initiated from
* an element in the same drag and drop controller.
*/
export class DataTransfer<T extends DataTransferItem = DataTransferItem> {
/**
* Retrieves the data transfer item for a given mime type.
* @param mimeType The mime type to get the data transfer item for.
*/
get(mimeType: string): T | undefined;
/**
* Sets a mime type to data transfer item mapping.
* @param mimeType The mime type to set the data for.
* @param value The data transfer item for the given mime type.
*/
set(mimeType: string, value: T): void;
/**
* Allows iteration through the data transfer items.
* @param callbackfn Callback for iteration through the data transfer items.
*/
forEach(callbackfn: (value: T, key: string) => void): void;
}
/**
* Provides support for drag and drop in `TreeView`.
*/
export interface TreeDragAndDropController<T> {
/**
* The mime types that the `handleDrop` method of this `DragAndDropController` supports.
* This could be well-defined, existing, mime types, and also mime types defined by the extension.
*
* Each tree will automatically support drops from it's own `DragAndDropController`. To support drops from other trees,
* you will need to add the mime type of that tree. The mime type of a tree is of the format `application/vnd.code.tree.treeidlowercase`.
*
* To learn the mime type of a dragged item:
* 1. Set up your `DragAndDropController`
* 2. Use the Developer: Set Log Level... command to set the level to "Debug"
* 3. Open the developer tools and drag the item with unknown mime type over your tree. The mime types will be logged to the developer console
*/
readonly dropMimeTypes: string[];
/**
* The mime types that the `handleDrag` method of this `TreeDragAndDropController` may add to the tree data transfer.
* This could be well-defined, existing, mime types, and also mime types defined by the extension.
*/
readonly dragMimeTypes: string[];
/**
* When the user starts dragging items from this `DragAndDropController`, `handleDrag` will be called.
* Extensions can use `handleDrag` to add their `DataTransferItem`s to the drag and drop.
*
* When the items are dropped on **another tree item** in **the same tree**, your `DataTransferItem` objects
* will be preserved. See the documentation for `DataTransferItem` for how best to take advantage of this.
*
* To add a data transfer item that can be dragged into the editor, use the application specific mime type "text/uri-list".
* The data for "text/uri-list" should be a string with `toString()`ed Uris separated by newlines. To specify a cursor position in the file,
* set the Uri's fragment to `L3,5`, where 3 is the line number and 5 is the column number.
*
* @param source The source items for the drag and drop operation.
* @param treeDataTransfer The data transfer associated with this drag.
* @param token A cancellation token indicating that drag has been cancelled.
*/
handleDrag?(source: T[], treeDataTransfer: DataTransfer, token: CancellationToken): Thenable<void> | void;
/**
* Called when a drag and drop action results in a drop on the tree that this `DragAndDropController` belongs too.
*
* Extensions should fire `TreeDataProvider.onDidChangeTreeData` for any elements that need to be refreshed.
*
* @param source The data transfer items of the source of the drag.
* @param target The target tree element that the drop is occurring on.
* @param token A cancellation token indicating that the drop has been cancelled.
*/
handleDrop?(target: T, source: DataTransfer, token: CancellationToken): Thenable<void> | void;
}
/**
* Represents a Tree view
*/
@ -9814,7 +9912,7 @@ declare module 'vscode' {
* This will trigger the view to update the changed element/root and its children recursively (if shown).
* To signal that root has changed, do not pass any argument or pass `undefined` or `null`.
*/
onDidChangeTreeData?: Event<T | undefined | null | void>;
onDidChangeTreeData?: Event<T | T[] | undefined | null | void>;
/**
* Get {@link TreeItem} representation of the `element`

121
src/vscode-dts/vscode.proposed.treeViewDragAndDrop.d.ts vendored
View file

@ -1,121 +0,0 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
declare module 'vscode' {
// https://github.com/microsoft/vscode/issues/32592
/**
* A data provider that provides tree data
*/
export interface TreeDataProvider<T> {
/**
* An optional event to signal that an element or root has changed.
* This will trigger the view to update the changed element/root and its children recursively (if shown).
* To signal that root has changed, do not pass any argument or pass `undefined` or `null`.
*/
onDidChangeTreeData2?: Event<T | T[] | undefined | null | void>;
}
export interface TreeViewOptions<T> {
/**
* An optional interface to implement drag and drop in the tree view.
*/
dragAndDropController?: TreeDragAndDropController<T>;
}
/**
* A class for encapsulating data transferred during a tree drag and drop event.
*
* If your `DragAndDropController` implements `handleDrag`, you can use the `value` of the `TreeDataTransferItem`
* to get back the object you put into it so long as the extension that created the `TreeDataTransferItem` runs in the same
* extension host.
*/
export class TreeDataTransferItem {
asString(): Thenable<string>;
readonly value: any;
constructor(value: any);
}
/**
* A map containing a mapping of the mime type of the corresponding transferred data.
* Trees that support drag and drop can implement `DragAndDropController.handleDrag` to add additional mime types
* when the drop occurs on an item in the same tree.
*/
export class TreeDataTransfer<T extends TreeDataTransferItem = TreeDataTransferItem> {
/**
* Retrieves the data transfer item for a given mime type.
* @param mimeType The mime type to get the data transfer item for.
*/
get(mimeType: string): T | undefined;
/**
* Sets a mime type to data transfer item mapping.
* @param mimeType The mime type to set the data for.
* @param value The data transfer item for the given mime type.
*/
set(mimeType: string, value: T): void;
/**
* Allows iteration through the data transfer items.
* @param callbackfn Callback for iteration through the data transfer items.
*/
forEach(callbackfn: (value: T, key: string) => void): void;
}
/**
* Provides support for drag and drop in `TreeView`.
*/
export interface TreeDragAndDropController<T> {
/**
* The mime types that the `handleDrop` method of this `DragAndDropController` supports.
* This could be well-defined, existing, mime types, and also mime types defined by the extension.
*
* Each tree will automatically support drops from it's own `DragAndDropController`. To support drops from other trees,
* you will need to add the mime type of that tree. The mime type of a tree is of the format `application/vnd.code.tree.treeidlowercase`.
*
* To learn the mime type of a dragged item:
* 1. Set up your `DragAndDropController`
* 2. Use the Developer: Set Log Level... command to set the level to "Debug"
* 3. Open the developer tools and drag the item with unknown mime type over your tree. The mime types will be logged to the developer console
*/
readonly dropMimeTypes: string[];
/**
* The mime types that the `handleDrag` method of this `TreeDragAndDropController` may add to the tree data transfer.
* This could be well-defined, existing, mime types, and also mime types defined by the extension.
*/
readonly dragMimeTypes: string[];
/**
* When the user starts dragging items from this `DragAndDropController`, `handleDrag` will be called.
* Extensions can use `handleDrag` to add their `TreeDataTransferItem`s to the drag and drop.
*
* When the items are dropped on **another tree item** in **the same tree**, your `TreeDataTransferItem` objects
* will be preserved. See the documentation for `TreeDataTransferItem` for how best to take advantage of this.
*
* To add a data transfer item that can be dragged into the editor, use the application specific mime type "text/uri-list".
* The data for "text/uri-list" should be a string with `toString()`ed Uris separated by newlines. To specify a cursor position in the file,
* set the Uri's fragment to `L3,5`, where 3 is the line number and 5 is the column number.
*
* @param source The source items for the drag and drop operation.
* @param treeDataTransfer The data transfer associated with this drag.
* @param token A cancellation token indicating that drag has been cancelled.
*/
handleDrag?(source: T[], treeDataTransfer: TreeDataTransfer, token: CancellationToken): Thenable<void> | void;
/**
* Called when a drag and drop action results in a drop on the tree that this `DragAndDropController` belongs too.
*
* Extensions should fire `TreeDataProvider.onDidChangeTreeData` for any elements that need to be refreshed.
*
* @param source The data transfer items of the source of the drag.
* @param target The target tree element that the drop is occurring on.
* @param token A cancellation token indicating that the drop has been cancelled.
*/
handleDrop?(target: T, source: TreeDataTransfer, token: CancellationToken): Thenable<void> | void;
}
}