fix text in viewer

src/pages/viewer/components/BookPage.tsx

@@ -2,6 +2,8 @@ import { forwardRef, useCallback } from 'react';
 import { type PageData } from '../types';
 import type { EditorObject } from '@/pages/editor/store/editorStore';
 import { toCssLinearGradient } from '@/pages/editor/utils/gradient';
+import { getFontFamily } from '@/pages/editor/utils/fontFamily';
+import { getCssFontWeight, getScaledTextWidth, isSingleLineText } from '@/pages/editor/utils/textStyle';
 import '@/pages/viewer/styles/entranceAnimations.css';
 import { mergeEntranceAnimationStyle } from '@/pages/viewer/utils/entranceAnimationStyle';
 import { useBookPageEntranceSequence } from '@/pages/viewer/hooks/useBookPageEntranceSequence';
@@ -122,8 +124,9 @@ 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;
+          const singleLine = isSingleLineText(obj.text);
+          const textWidth = getScaledTextWidth(obj.width, scale, singleLine);
+          const textLeft = Math.round(((obj.x || 0) - (obj.width || 0)) * scale);
           return (
             <div
               key={obj.id || index}
@@ -133,15 +136,15 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
                   left: `${textLeft}px`,
                   width: textWidth ? `${textWidth}px` : undefined,
                   fontSize: `${(obj.fontSize || 16) * scale}px`,
-                  fontFamily: obj.fontFamily || 'irancell, sans-serif',
-                  fontWeight: obj.fontWeight || 'normal',
+                  fontFamily: getFontFamily(obj.fontFamily),
+                  fontWeight: getCssFontWeight(obj.fontWeight),
                   lineHeight: obj.lineHeight ?? 1.2,
                   textAlign: obj.textAlign ?? 'right',
                   direction: 'rtl',
                   color: getColorWithOpacity(obj.fill, obj.opacity),
-                  whiteSpace: 'pre-wrap',
-                  wordBreak: 'break-word',
+                  whiteSpace: singleLine ? 'nowrap' : 'pre-wrap',
                   letterSpacing: obj.letterSpacing ? `${obj.letterSpacing * scale}px` : undefined,
+                  boxSizing: 'content-box',
                 },
                 obj,
                 index,
@@ -210,7 +213,8 @@ const BookPage = forwardRef<HTMLDivElement, BookPageProps>(
             height: obj.height ? `${obj.height * scale}px` : 'auto',
             color: obj.fill || '#3b82f6',
             fontSize: `${(obj.fontSize || 16) * scale}px`,
-            fontFamily: obj.fontFamily || 'irancell, sans-serif',
+            fontFamily: getFontFamily(obj.fontFamily),
+            fontWeight: getCssFontWeight(obj.fontWeight),
             textDecoration: 'underline',
             display: 'flex',
             alignItems: 'center',