@ixo/editor 2.1.0 → 2.1.1

package/dist/{chunk-SKLD5WWM.mjs → chunk-DYUWLMSF.mjs}

@@ -12719,25 +12719,25 @@ var MatrixMetadataManager = class {
     }
     try {
       const promises = [];
-      if (metadata.cover !== void 0) {
+      if ("cover" in metadata) {
         promises.push(
           this.matrixClient.sendStateEvent(
             this.roomId,
             COVER_IMAGE_EVENT_TYPE,
             { url: metadata.cover || null },
-            // Wrap in object - Matrix requires JSON content
+            // Wrap in object - null means removed
             ""
             // Empty state key
           )
         );
       }
-      if (metadata.icon !== void 0) {
+      if ("icon" in metadata) {
         promises.push(
           this.matrixClient.sendStateEvent(
             this.roomId,
             COVER_ICON_EVENT_TYPE,
             { url: metadata.icon || null },
-            // Wrap in object - Matrix requires JSON content
+            // Wrap in object - null means removed
             ""
             // Empty state key
           )
@@ -13041,6 +13041,138 @@ function useCreateCollaborativeIxoEditor(options) {
 // src/mantine/components/CoverImage.tsx
 import React149, { useState as useState48, useRef as useRef8, useEffect as useEffect38 } from "react";
 import { Box as Box24, Button as Button32, Group as Group44 } from "@mantine/core";
+
+// src/core/lib/imageTransform.ts
+var CLOUDFLARE_CDN_BASE = "https://www.ixo.earth/cdn-cgi/image";
+var ImagePresets = {
+  /**
+   * Cover image preset (Notion-style)
+   * Wide banner images that fill the width of the page
+   */
+  cover: {
+    desktop: {
+      width: 1920,
+      fit: "cover",
+      quality: 80,
+      format: "auto",
+      metadata: "none"
+    },
+    tablet: {
+      width: 960,
+      fit: "cover",
+      quality: 80,
+      format: "auto",
+      metadata: "none"
+    },
+    mobile: {
+      width: 640,
+      fit: "cover",
+      quality: 80,
+      format: "auto",
+      metadata: "none"
+    }
+  },
+  /**
+   * Icon/Logo preset (Notion-style)
+   * Small, square profile/icon images
+   */
+  icon: {
+    default: {
+      width: 240,
+      // 2x for retina (120px display size)
+      height: 240,
+      fit: "cover",
+      gravity: "auto",
+      // Focus on faces for profile pictures
+      quality: 85,
+      format: "auto",
+      metadata: "none"
+    },
+    thumbnail: {
+      width: 120,
+      height: 120,
+      fit: "cover",
+      gravity: "auto",
+      quality: 85,
+      format: "auto",
+      metadata: "none"
+    }
+  }
+};
+function buildOptionsString(options) {
+  const parts = [];
+  if (options.width !== void 0) {
+    parts.push(`width=${options.width}`);
+  }
+  if (options.height !== void 0) {
+    parts.push(`height=${options.height}`);
+  }
+  if (options.fit) {
+    parts.push(`fit=${options.fit}`);
+  }
+  if (options.gravity) {
+    parts.push(`gravity=${options.gravity}`);
+  }
+  if (options.quality !== void 0) {
+    parts.push(`quality=${options.quality}`);
+  }
+  if (options.format) {
+    parts.push(`format=${options.format}`);
+  }
+  if (options.dpr !== void 0) {
+    parts.push(`dpr=${options.dpr}`);
+  }
+  if (options.sharpen !== void 0) {
+    parts.push(`sharpen=${options.sharpen}`);
+  }
+  if (options.blur !== void 0) {
+    parts.push(`blur=${options.blur}`);
+  }
+  if (options.brightness !== void 0) {
+    parts.push(`brightness=${options.brightness}`);
+  }
+  if (options.metadata) {
+    parts.push(`metadata=${options.metadata}`);
+  }
+  if (options.anim !== void 0) {
+    parts.push(`anim=${options.anim}`);
+  }
+  return parts.join(",");
+}
+function isAllowedOrigin(url) {
+  const allowedOrigins = ["ipfs.gateway.ixo.world", "mx.ixo.earth", "testmx.ixo.earth", "devmx.ixo.earth"];
+  try {
+    const urlObj = new URL(url);
+    return allowedOrigins.some((origin) => urlObj.hostname.includes(origin));
+  } catch {
+    return false;
+  }
+}
+function transformImage(sourceUrl, options) {
+  if (!sourceUrl) {
+    return sourceUrl;
+  }
+  if (sourceUrl.includes("/cdn-cgi/image/")) {
+    return sourceUrl;
+  }
+  if (!isAllowedOrigin(sourceUrl)) {
+    return sourceUrl;
+  }
+  const optionsString = buildOptionsString(options);
+  return `${CLOUDFLARE_CDN_BASE}/${optionsString}/${sourceUrl}`;
+}
+function transformCoverImage(sourceUrl, deviceType = "desktop", customOptions) {
+  const preset = ImagePresets.cover[deviceType];
+  const options = { ...preset, ...customOptions };
+  return transformImage(sourceUrl, options);
+}
+function transformIconImage(sourceUrl, size = "default", customOptions) {
+  const preset = ImagePresets.icon[size];
+  const options = { ...preset, ...customOptions };
+  return transformImage(sourceUrl, options);
+}
+
+// src/mantine/components/CoverImage.tsx
 function CoverImage({ coverImageUrl, logoUrl }) {
   const { editor, handlers, editable } = useBlocknoteContext();
   const [isHovering, setIsHovering] = useState48(false);
@@ -13060,8 +13192,10 @@ function CoverImage({ coverImageUrl, logoUrl }) {
     });
     return unsubscribe;
   }, [editor]);
-  const coverUrl = metadata?.cover || coverImageUrl;
-  const logoSrc = metadata?.icon || logoUrl;
+  const rawCoverUrl = metadata?.cover || coverImageUrl;
+  const rawLogoUrl = metadata?.icon || logoUrl;
+  const coverUrl = rawCoverUrl ? transformCoverImage(rawCoverUrl, "desktop") : void 0;
+  const logoSrc = rawLogoUrl ? transformIconImage(rawLogoUrl, "default") : void 0;
   const hasCover = !!coverUrl;
   const hasLogo = !!logoSrc;
   const handleFileSelect = async (event, type) => {
@@ -13745,4 +13879,4 @@ export {
   ixoGraphQLClient,
   getEntity
 };
-//# sourceMappingURL=chunk-SKLD5WWM.mjs.map
+//# sourceMappingURL=chunk-DYUWLMSF.mjs.map