@open-formulieren/formio-builder/dist/components/designer/dragDrop/SortableComponent.js

An opinionated Formio webform builder for Open Forms

import { jsx as m, jsxs as b } from "react/jsx-runtime";
import { useSortable as p } from "@dnd-kit/react/sortable";
import { clsx as l } from "clsx";
import c from "react";
import g from "./ComponentControls.js";
/* empty css                       */
import { useDropzoneContext as u } from "./context.js";
const j = ({
  id: t,
  index: r,
  groupName: e,
  component: o,
  hasControls: s = !0,
  children: a
}) => {
  const {
    collisionPriority: n
  } = u(), {
    ref: d,
    isDragging: i
  } = p({
    id: t,
    index: r,
    group: e,
    collisionPriority: n,
    data: {
      component: o
    }
  });
  return /* @__PURE__ */ m(f, { ref: d, testId: `sortable-item-${t}`, className: l("offb-dnd-sortable-item", {
    "offb-dnd-sortable-item--is-dragging": i
  }), component: o, showControls: s && !i, children: a });
}, f = c.forwardRef(({
  testId: t,
  component: r,
  showControls: e = !1,
  className: o,
  children: s
}, a) => /* @__PURE__ */ b("div", { ref: a, className: l("offb-dnd-sortable-item-view", o), "data-testid": t, children: [
  e && /* @__PURE__ */ m(g, { component: r }),
  s
] }));
f.displayName = "SortableItemView";
export {
  f as SortableItemView,
  j as default
};