You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
22 lines
574 B
22 lines
574 B
import React, { RefObject } from "react"
|
|
|
|
import "../../style/ball.css"
|
|
|
|
import Ball from "../../assets/icon/ball.svg?react"
|
|
import Draggable from "react-draggable"
|
|
|
|
export interface BallPieceProps {
|
|
onDrop: () => void
|
|
pieceRef: RefObject<HTMLDivElement>
|
|
}
|
|
|
|
export function BallPiece({ onDrop, pieceRef }: BallPieceProps) {
|
|
return (
|
|
<Draggable onStop={onDrop} nodeRef={pieceRef} position={{ x: 0, y: 0 }}>
|
|
<div className={`ball-div`} ref={pieceRef}>
|
|
<Ball className={"ball"} />
|
|
</div>
|
|
</Draggable>
|
|
)
|
|
}
|