grediant in a shape

src/pages/viewer/utils/dataTransformer.ts

@@ -4,8 +4,13 @@ import type { PageData } from "../types";
 type ViewerDataPage = {
   id: string;
   name: string;
-  backgroundType?: "color" | "image";
+  backgroundType?: "color" | "gradient" | "image";
   backgroundColor?: string;
+  backgroundGradient?: {
+    from: string;
+    to: string;
+    angle: number;
+  };
   backgroundImageUrl?: string;
   objects: Array<{
     id: string;
@@ -21,6 +26,12 @@ type ViewerDataPage = {
     lineHeight?: number;
     textAlign?: "left" | "center" | "right";
     fill?: string;
+    fillType?: "solid" | "gradient";
+    gradient?: {
+      from: string;
+      to: string;
+      angle: number;
+    };
     stroke?: string;
     strokeWidth?: number;
     shapeType?: string;
@@ -82,6 +93,8 @@ export function transformViewerDataToPages(data: ViewerData): PageData[] {
       // baseObject.y = obj.y + (obj.height || 100) / 2;
       // اما فعلاً JSON به صورت مرکز است، پس تبدیل نمی‌کنیم
       if (obj.fill !== undefined) baseObject.fill = obj.fill;
+      if (obj.fillType !== undefined) baseObject.fillType = obj.fillType;
+      if (obj.gradient !== undefined) baseObject.gradient = obj.gradient;
       if (obj.stroke !== undefined) baseObject.stroke = obj.stroke;
       if (obj.strokeWidth !== undefined)
         baseObject.strokeWidth = obj.strokeWidth;
@@ -131,6 +144,7 @@ export function transformViewerDataToPages(data: ViewerData): PageData[] {
       elements: objects,
       backgroundType: page.backgroundType,
       backgroundColor: page.backgroundColor,
+      backgroundGradient: page.backgroundGradient,
       backgroundImageUrl: page.backgroundImageUrl,
     };
   });