38 lines
686 B
TypeScript
38 lines
686 B
TypeScript
import React from "react";
|
|
import { useSortable } from "@dnd-kit/sortable";
|
|
import { CSS } from "@dnd-kit/utilities";
|
|
|
|
import { Cover } from "./Cover";
|
|
|
|
interface SortableCoverProps {
|
|
url: string;
|
|
index: number;
|
|
faded?: boolean;
|
|
}
|
|
|
|
export const SortableCover = (props: SortableCoverProps) => {
|
|
const sortable = useSortable({ id: props.url });
|
|
const {
|
|
attributes,
|
|
listeners,
|
|
setNodeRef,
|
|
transform,
|
|
transition,
|
|
} = sortable;
|
|
|
|
const style = {
|
|
transform: CSS.Transform.toString(transform),
|
|
transition,
|
|
};
|
|
|
|
return (
|
|
<Cover
|
|
ref={setNodeRef}
|
|
style={style}
|
|
{...props}
|
|
{...attributes}
|
|
{...listeners}
|
|
/>
|
|
);
|
|
};
|