Export drag and drop service methods

CHANGELOG.md

@@ -9,6 +9,7 @@
 
 - Fixed spacing of `EuiFormErrorText` to match `EuiFormHelpText` ([#2354](https://github.com/elastic/eui/pull/2354))
 - Fixed bug in `EuiPopover` where Array.prototype.slice() may have been called on 'undefined' ([#2369](https://github.com/elastic/eui/pull/2369))
+- Properly exported `copy`, `move`, and `reorder` drag-and-drop service methods ([#2377](https://github.com/elastic/eui/pull/2377))
 
 ## [`14.2.0`](https://github.com/elastic/eui/tree/v14.2.0)
 

src-docs/src/views/drag_and_drop/drag_and_drop.js

@@ -6,15 +6,15 @@ import {
   EuiPanel,
 } from '../../../../src/components';
 
-import { reorder } from '../../../../src/components/drag_and_drop';
+import { euiDragDropReorder } from '../../../../src/components/drag_and_drop';
 
 import { makeList } from './helper';
 
 export default () => {
   const [list, setList] = useState(makeList(3));
   const onDragEnd = ({ source, destination }) => {
     if (source && destination) {
-      const items = reorder(list, source.index, destination.index);
+      const items = euiDragDropReorder(list, source.index, destination.index);
 
       setList(items);
     }

src-docs/src/views/drag_and_drop/drag_and_drop_clone.js

@@ -10,7 +10,10 @@ import {
   EuiPanel,
 } from '../../../../src/components';
 
-import { copy, reorder } from '../../../../src/components/drag_and_drop';
+import {
+  euiDragDropCopy,
+  euiDragDropReorder,
+} from '../../../../src/components/drag_and_drop';
 
 import { makeId, makeList } from './helper';
 
@@ -37,7 +40,7 @@ export default () => {
   const onDragEnd = ({ source, destination }) => {
     if (source && destination) {
       if (source.droppableId === destination.droppableId) {
-        const items = reorder(
+        const items = euiDragDropReorder(
           lists[destination.droppableId],
           source.index,
           destination.index
@@ -47,7 +50,7 @@ export default () => {
       } else {
         const sourceId = source.droppableId;
         const destinationId = destination.droppableId;
-        const result = copy(
+        const result = euiDragDropCopy(
           lists[sourceId],
           lists[destinationId],
           source,

src-docs/src/views/drag_and_drop/drag_and_drop_complex.js

@@ -7,7 +7,10 @@ import {
   EuiPanel,
 } from '../../../../src/components';
 
-import { move, reorder } from '../../../../src/components/drag_and_drop';
+import {
+  euiDragDropMove,
+  euiDragDropReorder,
+} from '../../../../src/components/drag_and_drop';
 
 import { makeList } from './helper';
 
@@ -28,7 +31,7 @@ export default () => {
   const onDragEnd = ({ source, destination }) => {
     if (source && destination) {
       if (source.droppableId === destination.droppableId) {
-        const items = reorder(
+        const items = euiDragDropReorder(
           lists[destination.droppableId],
           source.index,
           destination.index
@@ -38,7 +41,7 @@ export default () => {
       } else {
         const sourceId = source.droppableId;
         const destinationId = destination.droppableId;
-        const result = move(
+        const result = euiDragDropMove(
           lists[sourceId],
           lists[destinationId],
           source,

src-docs/src/views/drag_and_drop/drag_and_drop_custom_handle.js

@@ -9,15 +9,15 @@ import {
   EuiPanel,
 } from '../../../../src/components';
 
-import { reorder } from '../../../../src/components/drag_and_drop';
+import { euiDragDropReorder } from '../../../../src/components/drag_and_drop';
 
 import { makeList } from './helper';
 
 export default () => {
   const [list, setList] = useState(makeList(3));
   const onDragEnd = ({ source, destination }) => {
     if (source && destination) {
-      const items = reorder(list, source.index, destination.index);
+      const items = euiDragDropReorder(list, source.index, destination.index);
 
       setList(items);
     }

src-docs/src/views/drag_and_drop/drag_and_drop_disable_blocking.js

@@ -6,15 +6,15 @@ import {
   EuiDroppable,
 } from '../../../../src/components';
 
-import { reorder } from '../../../../src/components/drag_and_drop';
+import { euiDragDropReorder } from '../../../../src/components/drag_and_drop';
 
 import { makeList } from './helper';
 
 export default () => {
   const [list, setList] = useState(makeList(3));
   const onDragEnd = ({ source, destination }) => {
     if (source && destination) {
-      const items = reorder(list, source.index, destination.index);
+      const items = euiDragDropReorder(list, source.index, destination.index);
 
       setList(items);
     }

src-docs/src/views/drag_and_drop/drag_and_drop_move_lists.js

@@ -9,7 +9,10 @@ import {
   EuiPanel,
 } from '../../../../src/components';
 
-import { move, reorder } from '../../../../src/components/drag_and_drop';
+import {
+  euiDragDropMove,
+  euiDragDropReorder,
+} from '../../../../src/components/drag_and_drop';
 
 import { makeList } from './helper';
 
@@ -21,7 +24,7 @@ export default () => {
     const actions = { DROPPABLE_AREA_1: setList1, DROPPABLE_AREA_2: setList2 };
     if (source && destination) {
       if (source.droppableId === destination.droppableId) {
-        const items = reorder(
+        const items = euiDragDropReorder(
           lists[destination.droppableId],
           source.index,
           destination.index
@@ -31,7 +34,7 @@ export default () => {
       } else {
         const sourceId = source.droppableId;
         const destinationId = destination.droppableId;
-        const result = move(
+        const result = euiDragDropMove(
           lists[sourceId],
           lists[destinationId],
           source,

src-docs/src/views/drag_and_drop/drag_and_drop_types.js

@@ -8,7 +8,10 @@ import {
   EuiPanel,
 } from '../../../../src/components';
 
-import { move, reorder } from '../../../../src/components/drag_and_drop';
+import {
+  euiDragDropMove,
+  euiDragDropReorder,
+} from '../../../../src/components/drag_and_drop';
 
 import { makeList } from './helper';
 
@@ -29,7 +32,7 @@ export default () => {
     };
     if (source && destination) {
       if (source.droppableId === destination.droppableId) {
-        const items = reorder(
+        const items = euiDragDropReorder(
           lists[destination.droppableId],
           source.index,
           destination.index
@@ -39,7 +42,7 @@ export default () => {
       } else {
         const sourceId = source.droppableId;
         const destinationId = destination.droppableId;
-        const result = move(
+        const result = euiDragDropMove(
           lists[sourceId],
           lists[destinationId],
           source,

src/components/drag_and_drop/index.ts

@@ -1,7 +1,11 @@
 export { EuiDragDropContext } from './drag_drop_context';
 export { EuiDraggable } from './draggable';
 export { EuiDroppable } from './droppable';
-export { copy, move, reorder } from './services';
+export {
+  euiDragDropCopy,
+  euiDragDropMove,
+  euiDragDropReorder,
+} from './services';
 
 // Interfaces in react-beautiful-dnd that EUI abstracts over
 // allows consumers to pull these from EUI instead of react-beautiful-dnd

src/components/drag_and_drop/services.ts

@@ -4,7 +4,7 @@ interface DropResult {
   [droppableId: string]: any[];
 }
 
-export const reorder = (
+export const euiDragDropReorder = (
   list: [],
   startIndex: number,
   endIndex: number
@@ -16,7 +16,7 @@ export const reorder = (
   return result;
 };
 
-export const move = (
+export const euiDragDropMove = (
   sourceList: any[],
   destinationList: any[],
   dropResultSource: DraggableLocation,
@@ -34,7 +34,7 @@ export const move = (
   };
 };
 
-export const copy = (
+export const euiDragDropCopy = (
   sourceList: any[],
   destinationList: any[],
   dropResultSource: DraggableLocation,

src/components/index.js

@@ -67,6 +67,9 @@ export {
   EuiDragDropContext,
   EuiDraggable,
   EuiDroppable,
+  euiDragDropCopy,
+  euiDragDropMove,
+  euiDragDropReorder,
 } from './drag_and_drop';
 
 export { EuiEmptyPrompt } from './empty_prompt';