fix text location

src/pages/viewer/components/BookPage.tsx

@@ -74,17 +74,24 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
           // برای text، opacity در رنگ اعمال می‌شود، پس باید opacity را از baseStyle حذف کنیم
           // eslint-disable-next-line @typescript-eslint/no-unused-vars
           const { opacity, ...textBaseStyle } = baseStyle;
+          const textWidth = obj.width ? obj.width * scale : undefined;
+          const textLeft = ((obj.x || 0) - (obj.width || 0)) * scale;
           return (
             <div
               key={obj.id || index}
               style={{
                 ...textBaseStyle,
+                left: `${textLeft}px`,
+                width: textWidth ? `${textWidth}px` : undefined,
                 fontSize: `${(obj.fontSize || 16) * scale}px`,
                 fontFamily: obj.fontFamily || 'irancell, sans-serif',
                 fontWeight: obj.fontWeight || 'normal',
-                lineHeight: 1,
+                lineHeight: obj.lineHeight ?? 1.2,
+                textAlign: obj.textAlign ?? 'right',
+                direction: 'rtl',
                 color: getColorWithOpacity(obj.fill, obj.opacity),
                 whiteSpace: 'pre-wrap',
+                wordBreak: 'break-word',
                 letterSpacing: obj.letterSpacing ? `${obj.letterSpacing * scale}px` : undefined,
               }}
             >

src/pages/viewer/utils/dataTransformer.ts

@@ -15,6 +15,8 @@ type ViewerDataPage = {
     fontSize?: number;
     fontFamily?: string;
     fontWeight?: string;
+    lineHeight?: number;
+    textAlign?: "left" | "center" | "right";
     fill?: string;
     stroke?: string;
     strokeWidth?: number;
@@ -89,6 +91,8 @@ export function transformViewerDataToPages(data: ViewerData): PageData[] {
       if (obj.fontWeight !== undefined) baseObject.fontWeight = obj.fontWeight;
       if (obj.letterSpacing !== undefined)
         baseObject.letterSpacing = obj.letterSpacing;
+      if (obj.lineHeight !== undefined) baseObject.lineHeight = obj.lineHeight;
+      if (obj.textAlign !== undefined) baseObject.textAlign = obj.textAlign;
 
       // انواع خاص objectها
       if (obj.type === "rectangle" && obj.shapeType) {