Sha256: e009411bf9d77ad8f5f89c12137649139a5b8e55ae34a02f3717fd610e10f137
Contents?: true
Size: 1.01 KB
Versions: 5
Compression:
Stored size: 1.01 KB
Contents
import React, { RefObject } from "react";
import { ImageResource } from "../../types";
import { DragState } from "../drag";
interface DragElementProps {
container: RefObject<HTMLDivElement>;
draggable: string | { record: { image: ImageResource; src?: string } };
dragState: DragState;
}
export default function DragElement(props: DragElementProps) {
const { draggable, dragState, container } = props;
if (draggable === "Files") {
return "";
} else {
const containerSize = container.current.getBoundingClientRect();
const x = dragState.x - (containerSize.x || containerSize.left);
const y = dragState.y - (containerSize.y || containerSize.top);
const translateStyle = {
transform: `translate3d(${x}px, ${y}px, 0)`
};
return (
<div className="drag-image" style={translateStyle}>
{"record" in draggable && draggable.record.image && (
<img
src={draggable.record.src || draggable.record.image.thumbnail_url}
/>
)}
</div>
);
}
}
Version data entries
5 entries across 5 versions & 1 rubygems