Documentation: Add readme and JSDoc for InserterDraggableBlocks.

packages/block-editor/src/components/inserter-draggable-blocks/README.md

@@ -0,0 +1,74 @@
+# InserterDraggableBlocks
+
+The `InserterDraggableBlocks` component provides functionality to make WordPress blocks or patterns draggable within the editor environment. This component leverages the `Draggable` component from `@wordpress/components` and allows customization of drag-and-drop behavior through props.
+
+## Usage
+
+```jsx
+import { InserterDraggableBlocks } from '@wordpress/block-editor';
+import { createBlock } from '@wordpress/blocks';
+
+const blocks = [
+	createBlock( 'core/paragraph', { content: 'This is a paragraph block.' } ),
+	createBlock( 'core/heading', {
+		content: 'This is a heading block.',
+		level: 2,
+	} ),
+];
+
+const MyComponent = () => {
+	return (
+		<InserterDraggableBlocks
+			isEnabled={ true }
+			blocks={ blocks }
+			icon={ <span>Drag</span> }
+			children={ ( { draggable, onDragStart, onDragEnd } ) => (
+				<div
+					draggable={ draggable }
+					onDragStart={ onDragStart }
+					onDragEnd={ onDragEnd }
+				>
+					Drag Me!
+				</div>
+			) }
+		/>
+	);
+};
+```
+
+## Props
+
+### `isEnabled`
+
+-   **Type:** `boolean`
+-   **Default:** `false`
+
+Whether dragging is enabled.
+
+### `blocks`
+
+-   **Type:** `Array`
+-   **Default:** `[]`
+
+Array of blocks to make draggable.
+
+### `icon`
+
+-   **Type:** `ReactNode`
+-   **Default:** `null`
+
+Icon for the draggable chip.
+
+### `children`
+
+-   **Type:** `Function`
+-   **Default:** `null`
+
+Render function for child elements. Receives draggable props (`draggable`, `onDragStart`, `onDragEnd`).
+
+### `pattern`
+
+-   **Type:** `Object`
+-   **Default:** `null`
+
+Optional block pattern for drag-and-drop. Should include `type`, `syncStatus`, and `id` attributes.

packages/block-editor/src/components/inserter-draggable-blocks/index.js

@@ -14,6 +14,19 @@ import { INSERTER_PATTERN_TYPES } from '../inserter/block-patterns-tab/utils';
 import { store as blockEditorStore } from '../../store';
 import { unlock } from '../../lock-unlock';
 
+/**
+ * InserterDraggableBlocks Component
+ *
+ * A component that wraps blocks or patterns with draggable functionality for use in the editor.
+ *
+ * @param {Object}   props           Component properties.
+ * @param {boolean}  props.isEnabled Whether dragging is enabled.
+ * @param {Array}    props.blocks    Array of blocks to make draggable.
+ * @param {Element}  props.icon      Icon for the draggable chip.
+ * @param {Function} props.children  Render function for child elements.
+ * @param {Object}   [props.pattern] Optional block pattern for drag-and-drop.
+ * @return {Element} Draggable block wrapper.
+ */
 const InserterDraggableBlocks = ( {
 	isEnabled,
 	blocks,