@cerberus-design/react/dist/components/Droppable.js

The Cerberus Design React component library.

'use client';
import { jsx } from 'react/jsx-runtime';
import { useDroppable } from '@dnd-kit/core';
import { useId } from 'react';

function Droppable(props) {
  const { dropped, id, disabled, data, resizeObserverConfig, ...nativeProps } = props;
  const uuid = useId();
  const { isOver, setNodeRef } = useDroppable({
    data,
    disabled,
    id: id || uuid,
    resizeObserverConfig
  });
  return /* @__PURE__ */ jsx(
    "div",
    {
      ...nativeProps,
      "data-over": isOver,
      "data-dropped": dropped,
      ref: setNodeRef,
      children: props.children
    }
  );
}

export { Droppable };