@hitachivantara/uikit-react-lab
Version:
Contributed React components for the NEXT UI Kit.
52 lines (51 loc) • 1.6 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const react = require("react");
const core = require("@dnd-kit/core");
const utils = require("@mui/material/utils");
const uikitReactCore = require("@hitachivantara/uikit-react-core");
const SidebarGroupItem = require("./SidebarGroupItem.cjs");
const HvFlowDraggableSidebarGroupItem = ({
id: idProp,
label,
nodeType,
data,
...others
}) => {
const itemRef = react.useRef(null);
const id = uikitReactCore.useUniqueId(idProp);
const { attributes, listeners, setNodeRef, isDragging, transform } = core.useDraggable({
id,
data: {
hvFlow: {
// Needed to know which item is being dragged and dropped
type: nodeType,
// Needed for the drag overlay: otherwise the item is cut by the drawer because of overflow
label,
// Item position: used to position the item when dropped
x: itemRef.current?.getBoundingClientRect().x,
y: itemRef.current?.getBoundingClientRect().y,
// Data
data
}
}
});
const forkedRef = utils.useForkRef(itemRef, setNodeRef);
const style = transform ? {
transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`
} : void 0;
return /* @__PURE__ */ jsxRuntime.jsx(
SidebarGroupItem.HvFlowSidebarGroupItem,
{
ref: forkedRef,
style,
label,
isDragging,
...listeners,
...attributes,
...others
}
);
};
exports.HvFlowDraggableSidebarGroupItem = HvFlowDraggableSidebarGroupItem;