ExtensionsBeta

Selection

An interface for managing the selection of resources.

Hooks

Hooks provide access to drops and related data from inside React components. Unlike data accessed using static methods, hooks will cause the component to rerender when the data changes.

useSelection

Returns the current selection as an array of SelectionItems. Optionally, one or more resource types can be passed in to retrieve only selection items matching the resource types.

useSelection(resourceType?: string | string[]): SelectionItem[]

Argument	Type	Description
`resourceType`	`string \| string[]`	The resource type(s) of the selection items to retrieve.

useSelectionContains

Returns a boolean indicating whether the current selection contains resources of the given type(s).

useSelectionContains(resourceType?: string | string[], exclusive?: boolean): boolean

Argument	Type	Description
`resourceType*`	`string \| string[]`	The resource type(s) of the selection items to check for.
`exclusive`	`boolean`	When `true`, the hook will only return `true` if the selection contains nothing but items of the given type(s).

useIsDragging

Returns a boolean indicating whether a drag action is in progress. Optionally, one or more resource types can be passed in to check if the items being dragged are of the given type(s).

useIsDragging(resourceType?: string | string[], exclusive?: boolean): boolean

Argument	Type	Description
`resourceType*`	`string \| string[]`	The resource type(s) of the selection items to check for.
`exclusive`	`boolean`	When `true`, the hook will only return `true` if the selection contains nothing but items of the given type(s).

useSelectable

Returns utility functions for adding selection functionality to resource UI components.

useSelectable(item: SelectionItem): SelectionUtils

Argument	Type	Description
`item*`	`SelectionItem`	The selection item. See the SelectionItem interface for more details.

SelectionUtils

Property	Type	Description
`selected`	`boolean`	A boolean representing whether or not the item is currently selected.
`onClick`	`function`	Callback to be applied to the item component as its `onClick` prop. Handles clicking and Shift clicking behaviour on the item.
`addToSelection`	`function`	Adds the item to the current selection.
`removeFromSelection`	`function`	Removes the item from the current selection.
`select`	`function`	Exclusively selects the item, clearing the current selection.

useDraggable

Returns utility functions for adding drag and drop functionality to resource UI components.

useDraggable(item: SelectionItem): DragUtils

Argument	Type	Description
`item*`	`SelectionItem`	The draggable item. See the SelectionItem interface for more details.

DragUtils

Property	Type	Description
`onDragStart`	`function`	Callback to be applied to the item component as its `onDragStart` prop. Handles selecting the item, setting the drag event data as well as the dragging state.
`onDragEnd`	`function`	Callback to be applied to the item component as its `onDragEnd` prop. Handles reseting the dragging state.

Static methods

get

Returns the current selection as a SelectionItem array. Optionally, one or more resource types can be passed in to retrieve only selection items matching the resource types.

Selection.get(resourceType?: string | string[]): SelectionItem[]

Argument	Type	Description
`resourceType`	`string \| string[]`	The resource type(s) of the selection items to retrieve.

getIds

Returns the IDs of items in the current selection as a array. Optionally, one or more resource types can be passed in to retrieve only IDs of selection items matching the resource types.

Selection.getIds(resourceType?: string | string[]): string[]

Argument	Type	Description
`resourceType`	`string \| string[]`	The resource type(s) of the selection items for which to retrieve the IDs.

getFromDataInsert

Returns an array of selection items from a DataInsert. Optionally, one or more resource types can be passed in to retrieve only selection items matching the resource types.

Selection.getFromDataInsert(
  dataInsert: DataInsert,
  resourceType?: string | string[]
): SelectionItem[]

Argument	Type	Description
`dataInsert*`	`DataInsert`	The data insert from which to retrieve selection items.
`resourceType`	`string \| string[]`	The resource type(s) of the selection items to retrieve.

isSelected

Returns a boolean indicating whether or not the given item is currently selected.

Selection.isSelected(item: SelectionItem): boolean

Argument	Type	Description
`item`	`SelectionItem`	The item for which to check the selection state.

contains

Returns a boolean indicating whether or not an array of selection items contains items of the given resoure type(s).

Selection.contains(
  selectionItems: SelectionItem[],
  resource: string | string[],
  exclusive?: boolean
): boolean

Argument	Type	Description
`selectionItems*`	`SelectionItem[]`	The array of selection items in which to check.
`resourceType*`	`string \| string[]`	The resource type(s) of the selection items to check for.
`exclusive`	`boolean`	When `true`, the method will only return `true` if the selection contains nothing but items of the given type(s).

isEmpty

Returns a boolean indicating whether or not the current selection is empty.

Selection.isEmpty(): boolean

filter

Filters the given selection items by one or more resource types.

Selection.filter(items: SelectionItem[], resourceType?: string | string[]): SelectionItem[]

Argument	Type	Description
`items`	`SelectionItem[]`	The selection items to filter.
`resourceType`	`string \| string[]`	The resource type(s) of the selection items to return.

item

Generates a SelectionItem given a resource document or resource reference and an optional parent resource document or resource reference.

Selection.item(
  resource: ResourceDocument | ResourceReference,
  parent?: ResourceDocument | ResourceDocument
): SelectionItem

Argument	Type	Description
`resource`	`\| ResourceDocument \| ResourceReference`	The resource document for which to generate a selection item.
`parent`	`\| ResourceDocument \| ResourceReference`	The parent resource document inside which the selection item located.

add

Adds the provided items to the current selection. Dispatches a selection:items:add event.

Selection.add(core: Core, items: SelectionItem[]): void

Argument	Type	Description
`core*`	`Core`	A MindDrop core instance.
`items*`	`SelectionItem[]`	The items to add to the current selection. See theSelectionItem interface for more details.

remove

Removes the provided items from the current selection. Dispatches a selection:items:remove event.

Selection.unselect(core: Core, items: SelectionItem[]): void

Argument	Type	Description
`core*`	`Core`	A MindDrop core instance.
`dropIds*`	`string[]`	The items to remove from the current selection. See theSelectionItem interface for more details.

Exclusively selects the provided items, clearing the current selection. Dispatches as a selection:items:add event as well as a selection:items:remove event if there were any selected items when the method was called.

Selection.select(core: Core, items: SelectionItem[]): void

Argument	Type	Description
`core*`	`Core`	A MindDrop core instance.
`items*`	`SelectionItem[]`	The items to select. See the SelectionItem interface for more details.

clear

Clears the current selection and dragging state. Dispatches a selection:items:remove event.

Selection.clear(core: Core): void

Argument	Type	Description
`core*`	`Core`	A MindDrop core instance.

dragStart

Toggles the dragging state to true and sets the current selection as the drag event's data transfer data. The data consists of stringified arrays of selection items grouped by resource, with each resource being set as minddrop-selection/[resource]. Dispatches a selection:drag:start event.

Selection.dragStart(
  core: Core,
  event: DragEvent | React.DragEvent,
  action?: DataInsertAction,
): void

Argument	Type	Description
`core*`	`Core`	A MindDrop core instance.
`event`	`DragEvent \| React.DragEvent`	The drag start event.
`action`	`DataInsertAction`	The data transfer action to assign to the event. See the DataInsert interface for more details.

dragEnd

Toggles the dragging state to false. Dispatches a selection:drag:end event.

Selection.dragEvent(
  core: Core,
  event: DragEvent | React.DragEvent,
): void

Argument	Type	Description
`core*`	`Core`	A MindDrop core instance.
`event`	`DragEvent \| React.DragEvent`	The drag end event.

copy

Sets the current selection as a clipboard event's data. The data consists of stringified arrays of selection items grouped by resource, with each resource being set as minddrop-selection/[resource]. Dispatches a selection:clipboard:copy event.

Selection.copy(event: ClipboardEvent | React.ClipboardEvent): void

Argument	Type	Description
`event`	`\| ClipboardEvent \| React.ClipboardEvent`	The clipboard event.

cut

Selection.cut(event: ClipboardEvent | React.ClipboardEvent): void

Argument	Type	Description
`event`	`\| ClipboardEvent \| React.ClipboardEvent`	The clipboard event.

Selection events

Selection events are prefixed with the namespace selection. See below the table for more details on the data passed by selection related events.

Name	Data	Description
`selection:items:add`	`SelectionItem[]`	Dispatched when items are added to the selection.
`selection:items:remove`	`SelectionItem[]`	Dispatched when items are removed from the selection.
`selection:drag:start`	`SelectionDragEventData`	Dispatched when selected items are dragged.
`selection:drag:end`	`SelectionDragEventData`	Dispatched when a drag event ends.
`selection:clipboard:copy`	`SelectionClipboardEventData`	Dispatched when a drag event ends.

Selection event data types

Selection events are dispatched with one of the following types of data.

SelectionItem

See the SelectionItem interface.

SelectionDragEventData

Property	Type	Description
`event*`	`DragEvent \| React.DragEvent`	The actual drag event from the UI component which triggered the call.
`selection*`	`SelectionItem[]`	The selection items being dragged.

SelectionClipboardEventData

Property	Type	Description
`event*`	`\| ClipboardEvent \| React.ClipboardEvent`	The actual clipboard event from the UI component which triggered the call.
`selection*`	`SelectionItem[]`	The selection items being copied/cut.

RichTextMarks

Getting Started

API

Types