feat(dnd): pass draggedKey into getItems

[reidbarber]

Closes #8162

By passing draggedKey as the second argument of getItems, you can decouple your dragged items from selection.

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Check test and new story

🧢 Your Project:

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the documentation
• View the S2 docs

[snowystinger]

we should add to the jsdocs what that second argument is

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the documentation
• View the S2 docs

[snowystinger]

if the goal is to decouple, then should this say something like

Suggested change

	* @param keys - The set of keys that will be affected by the drag (e.g. the current selection).
	* @param keys - The set of keys that can be affected by the drag (e.g. the current selection).

or if it's always the selection

   * @param keys - The currently selected keys, or, if no selection, equivalent to the dragged key.

[snowystinger]

maybe best not to use the @param? I'm not seeing it in the docs? https://reactspectrum.blob.core.windows.net/reactspectrum/5ddddffe6cfa57d0840bc8d3c8f6d0b8db961b3d/docs/react-aria/useDraggableCollection.html

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the documentation
• View the S2 docs

[rspbot]

## API Changes

react-aria-components

/react-aria-components:DragAndDropOptions

 DragAndDropOptions {
   acceptedDragTypes?: 'all' | Array<string | symbol> = 'all'
   dropTargetDelegate?: DropTargetDelegate
   getAllowedDropOperations?: () => Array<DropOperation>
   getDropOperation?: (DropTarget, DragTypes, Array<DropOperation>) => DropOperation
-  getItems?: (Set<Key>) => Array<DragItem> = () => []
+  getItems?: (Set<Key>, Key) => Array<DragItem> = () => []
   isDisabled?: boolean
   onDragEnd?: (DraggableCollectionEndEvent) => void
   onDragMove?: (DraggableCollectionMoveEvent) => void
   onDragStart?: (DraggableCollectionStartEvent) => void
   onDropActivate?: (DroppableCollectionActivateEvent) => void
   onDropEnter?: (DroppableCollectionEnterEvent) => void
   onDropExit?: (DroppableCollectionExitEvent) => void
   onInsert?: (DroppableCollectionInsertDropEvent) => void
   onItemDrop?: (DroppableCollectionOnItemDropEvent) => void
   onMove?: (DroppableCollectionReorderEvent) => void
   onReorder?: (DroppableCollectionReorderEvent) => void
   onRootDrop?: (DroppableCollectionRootDropEvent) => void
   renderDragPreview?: (Array<DragItem>) => JSX.Element
   renderDropIndicator?: (DropTarget) => JSX.Element
   shouldAcceptItemDrop?: (ItemDropTarget, DragTypes) => boolean
 }

---

@react-spectrum/dnd

/@react-spectrum/dnd:DragAndDropOptions

 DragAndDropOptions {
   acceptedDragTypes?: 'all' | Array<string | symbol> = 'all'
   getAllowedDropOperations?: () => Array<DropOperation>
   getDropOperation?: (DropTarget, DragTypes, Array<DropOperation>) => DropOperation
-  getItems?: (Set<Key>) => Array<DragItem> = () => []
+  getItems?: (Set<Key>, Key) => Array<DragItem> = () => []
   onDragEnd?: (DraggableCollectionEndEvent) => void
   onDragMove?: (DraggableCollectionMoveEvent) => void
   onDragStart?: (DraggableCollectionStartEvent) => void
   onDrop?: (DroppableCollectionDropEvent) => void
   onDropEnter?: (DroppableCollectionEnterEvent) => void
   onDropExit?: (DroppableCollectionExitEvent) => void
   onInsert?: (DroppableCollectionInsertDropEvent) => void
   onItemDrop?: (DroppableCollectionOnItemDropEvent) => void
   onReorder?: (DroppableCollectionReorderEvent) => void
   onRootDrop?: (DroppableCollectionRootDropEvent) => void
   renderPreview?: (Set<Key>, Key) => JSX.Element
   shouldAcceptItemDrop?: (ItemDropTarget, DragTypes) => boolean
 }

---

@react-stately/dnd

/@react-stately/dnd:DraggableCollectionStateOptions

 DraggableCollectionStateOptions {
   collection: Collection<Node<unknown>>
   getAllowedDropOperations?: () => Array<DropOperation>
-  getItems: (Set<Key>) => Array<DragItem>
+  getItems: (Set<Key>, Key) => Array<DragItem>
   isDisabled?: boolean
   onDragEnd?: (DraggableCollectionEndEvent) => void
   onDragMove?: (DraggableCollectionMoveEvent) => void
   onDragStart?: (DraggableCollectionStartEvent) => void
   selectionManager: MultipleSelectionManager
 }

---

[snowystinger]

I think the individual ones are useful for autofill. But they still don't appear in our docs. Are you seeing them somewhere? maybe I'm just looking in the wrong place

https://reactspectrum.blob.core.windows.net/reactspectrum/a00898e3b00bd2f2ad3954a86d8e8df764b7623b/docs/react-aria/useDraggableCollection.html

[reidbarber]

Just in VSCode, not seeing them in the docs

[snowystinger]

Then we should probably add it to the main description body for the prop as well. I think leave in the more granular ones for VSCode though as well

[LFDanLu]

LGTM for mouse/touch drag, but it seems like keyboard DnD still moves all the selected items. I guess that might be expected? Feels a bit inconsistent though