hamid zarghami
57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import { useRef, useMemo } from "react";
|
|
import { Text } from "react-konva";
|
|
import Konva from "konva";
|
|
import type { ShapeProps } from "./types";
|
|
|
|
const getFontWeight = (fontWeight?: string): string => {
|
|
const weightMap: Record<string, string> = {
|
|
bold: "bold",
|
|
normal: "normal",
|
|
"300": "300",
|
|
};
|
|
return weightMap[fontWeight || "normal"] || "normal";
|
|
};
|
|
|
|
const LinkShape = ({
|
|
obj,
|
|
onSelect,
|
|
onUpdate,
|
|
draggable,
|
|
}: ShapeProps) => {
|
|
const shapeRef = useRef<Konva.Text>(null);
|
|
const fontWeight = useMemo(() => getFontWeight(obj.fontWeight), [obj.fontWeight]);
|
|
|
|
// Transformer is managed in EditorCanvas for multi-select support
|
|
|
|
return (
|
|
<Text
|
|
ref={shapeRef}
|
|
x={obj.x}
|
|
y={obj.y}
|
|
text={obj.text || obj.linkUrl || ""}
|
|
fontSize={obj.fontSize || 24}
|
|
fill={obj.fill || "#0000ff"}
|
|
fontFamily="irancell"
|
|
fontStyle={fontWeight}
|
|
underline={true}
|
|
rotation={obj.rotation || 0}
|
|
draggable={draggable}
|
|
onClick={(e) => {
|
|
// در حالت editor، لینکها قابل کلیک نیستند
|
|
// این قابلیت در viewer اضافه خواهد شد
|
|
if (shapeRef.current) {
|
|
onSelect(obj.id, shapeRef.current, e);
|
|
}
|
|
}}
|
|
onDragEnd={(e) => {
|
|
const node = e.target;
|
|
onUpdate(obj.id, {
|
|
x: node.x(),
|
|
y: node.y(),
|
|
});
|
|
}}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default LinkShape; |