import { ImageFillType, LineType } from "@/enum";
import { uniqueId } from "lodash-es";
type PropType = {
fill: {
fillType: "color" | "gradient" | "image";
color1: string;
color2: string;
gradientType: "linear" | "radial";
gradientValue: number;
imageUrl: string;
objectFit: ImageFillType.Fill;
};
size: {
width: number;
height: number;
};
stroke: {
type: "solid" | "dashed" | "dotted" | "dashdot";
color: string;
width: number;
};
};
export function useShapeProps(
fill: PropType["fill"],
size: PropType["size"],
stroke: PropType["stroke"]
) {
const {
fillType,
color1,
color2,
gradientType,
gradientValue,
objectFit,
imageUrl,
} = fill;
const { width, height } = size;
const id = uniqueId("fill_");
const fillContent =
fillType === "color"
? color1
: fillType === "gradient"
? `url(#${id})`
: fillType === "image"
? `url(#${objectFit})`
: "";
const defsContent = (
<>
{gradientType === "linear" && (
)}
{gradientType === "radial" && (
)}
{fillType === "image" && (
)}
>
);
const strokeDasharray = LineType[stroke.type];
return {
strokeColor: stroke.color,
strokeWidth: stroke.width,
fillContent,
defsContent,
strokeDasharray
};
}