customized-fabric 1.8.3 → 1.8.4

package/lib/CalendarObject/index.d.ts

@@ -15,13 +15,14 @@ export declare const toCalendarObject: (object: Calendar) => {
         width: number | undefined;
         height: number | undefined;
         backgroundColor: string | undefined;
+        titleAlignment: string | undefined;
         titleColor: string | undefined;
+        titleFontUrl: string | undefined;
         dayColor: string | undefined;
-        dateColor: string | undefined;
-        markedDateColor: string | undefined;
+        dayFontUrl: string | undefined;
+        markerColor: string | undefined;
         markerUrl: string | undefined;
-        fontUrl: string | undefined;
-        objectFit: string | undefined;
+        date: string | undefined;
     };
 };
 export default class Calendar extends fabric.Group {
@@ -33,16 +34,17 @@ export default class Calendar extends fabric.Group {
     imageObject?: fabric.Image;
     layoutGroupId?: string;
     layoutGroupName?: string;
-    objectFit?: string;
     calendarWidth?: number;
     calendarHeight?: number;
-    calendarFontUrl?: string;
     calendarBackgroundColor?: string;
+    calendarTitleAlignment?: string;
     calendarTitleColor?: string;
+    calendarTitleFontUrl?: string;
     calendarDayColor?: string;
-    calendarDateColor?: string;
-    calendarMarkedDateColor?: string;
+    calendarDayFontUrl?: string;
+    calendarMarkerColor?: string;
     calendarMarkerUrl?: string;
+    calendarDate?: string;
     getSettings?: (attribute: string) => any;
     setSizes?: (options: {
         width?: number;

package/lib/CalendarObject/index.js

@@ -24,24 +24,19 @@ const CalendarClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
             this.setSizes({ width, height });
             this.canvas?.renderAll();
         });
-        const { width, height, backgroundColor, titleColor, dayColor, dateColor, markedDateColor, markerUrl, fontUrl, objectFit, } = options?.calendarSettings ?? {};
+        const calendarSettings = { ...(options?.calendarSettings ?? {}) };
+        Object.keys(calendarSettings).map((key) => {
+            const newKey = `calendar${key.charAt(0).toUpperCase() + key.slice(1)}`;
+            calendarSettings[newKey] = calendarSettings[key];
+            delete calendarSettings[key];
+        });
         this.set({
             _id: new objectId_1.ObjectId().toString(),
             name: constants_1.CALENDAR_OBJECT_ATTRIBUTES.name,
             type: constants_1.CALENDAR_OBJECT_ATTRIBUTES.type,
             ...options,
             layerId: options?.personalizeId ?? options?.layerId,
-            objectCaching: false,
-            calendarWidth: width ?? 400,
-            calendarHeight: height ?? 400,
-            calendarBackgroundColor: backgroundColor,
-            calendarTitleColor: titleColor,
-            calendarDayColor: dayColor,
-            calendarDateColor: dateColor,
-            calendarMarkedDateColor: markedDateColor,
-            calendarMarkerUrl: markerUrl,
-            calendarFontUrl: fontUrl,
-            objectFit: objectFit ?? "contain",
+            ...calendarSettings,
         });
         if (options?.isOriginal) {
             this.rectObject?.set({ strokeWidth: 0 });
@@ -54,6 +49,7 @@ const CalendarClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
                 this.loadImage(options?.imageFile);
             }
         }
+        this.fire("scaling");
     },
     loadImage: async function (image) {
         const loadedImage = await (0, utils_1.loadImage)(image);
@@ -65,7 +61,7 @@ const CalendarClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
             this.remove(this.imageObject);
             this.imageObject = loadedImage;
             this.add(this.imageObject);
-            this.fitImage(this.imageObject, this.objectFit == "cover");
+            this.fitImage(this.imageObject);
             this.canvas?.renderAll();
         }
     },
@@ -77,13 +73,15 @@ const CalendarClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
         };
         if (width) {
             attributes.width = width;
+            attributes.calendarWidth = width;
         }
         if (height) {
             attributes.height = height;
+            attributes.calendarHeight = height;
         }
         this.set(attributes);
         this.rectObject?.set(attributes);
-        this.fitImage(this.imageObject, this.objectFit == "cover");
+        this.fitImage(this.imageObject);
         this.canvas?.renderAll?.();
     },
     fitImage: function (image, cover = false) {
@@ -121,13 +119,14 @@ const toCalendarObject = (object) => {
             width: object?.calendarWidth,
             height: object?.calendarHeight,
             backgroundColor: object?.calendarBackgroundColor,
+            titleAlignment: object?.calendarTitleAlignment,
             titleColor: object?.calendarTitleColor,
+            titleFontUrl: object?.calendarTitleFontUrl,
             dayColor: object?.calendarDayColor,
-            dateColor: object?.calendarDateColor,
-            markedDateColor: object?.calendarMarkedDateColor,
+            dayFontUrl: object?.calendarDayFontUrl,
+            markerColor: object?.calendarMarkerColor,
             markerUrl: object?.calendarMarkerUrl,
-            fontUrl: object?.calendarFontUrl,
-            objectFit: object?.objectFit,
+            date: object?.calendarDate,
         },
     };
 };

package/lib/CalendarObject/interfaces.d.ts

@@ -10,13 +10,14 @@ export interface ICalendarOptions extends fabric.IGroupOptions {
     calendarSettings?: {
         width?: number;
         height?: number;
-        backgroundColor: string;
-        titleColor: string;
-        dayColor: string;
-        dateColor: string;
-        markedDateColor: string;
-        markerUrl: string;
-        fontUrl: string;
-        objectFit?: string;
+        backgroundColor?: string;
+        titleAlignment?: string;
+        titleColor?: string;
+        titleFontUrl?: string;
+        dayColor?: string;
+        dayFontUrl?: string;
+        markerColor?: string;
+        markerUrl?: string;
+        date?: string;
     };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "customized-fabric",
-  "version": "1.8.3",
+  "version": "1.8.4",
   "description": "Customized fabric",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",