@ixo/editor 2.19.0 → 2.20.0

package/dist/{chunk-HJL3K6NS.mjs → chunk-5JZLDFPC.mjs}

@@ -18329,7 +18329,7 @@ function useCollaborativeYDoc(_options) {
 }
 
 // src/mantine/hooks/useCollaborativeIxoEditor.ts
-import { useMemo as useMemo64, useEffect as useEffect52 } from "react";
+import { useMemo as useMemo64, useEffect as useEffect52, useState as useState68 } from "react";
 
 // src/core/lib/matrixMetadata.ts
 var COVER_IMAGE_EVENT_TYPE = "ixo.page.cover_image";
@@ -18762,18 +18762,66 @@ function useCreateCollaborativeIxoEditor(options) {
       titleText.insert(0, options.title);
     }
   }, [connectionStatus, root, titleText, permissions.write, options.docId, options.title, memoizedUser.id]);
+  const [connectedUsers, setConnectedUsers] = useState68([]);
+  const webrtcProvider = matrixProvider?.webrtcProvider;
+  useEffect52(() => {
+    if (!matrixProvider?.awarenessInstance || !webrtcProvider || connectionStatus !== "connected") {
+      return;
+    }
+    const awareness = matrixProvider.awarenessInstance;
+    const updateUsers = () => {
+      const states = awareness.getStates();
+      const users = Array.from(states.entries()).map(([clientId, state]) => ({
+        clientId,
+        state
+      }));
+      setConnectedUsers(users);
+    };
+    updateUsers();
+    awareness.on("change", updateUsers);
+    return () => {
+      awareness.off("change", updateUsers);
+    };
+  }, [matrixProvider, webrtcProvider, connectionStatus]);
+  useEffect52(() => {
+    if (!matrixProvider?.awarenessInstance || !webrtcProvider || connectionStatus !== "connected") {
+      return;
+    }
+    const awareness = matrixProvider.awarenessInstance;
+    const setAwarenessState = () => {
+      awareness.setLocalState({
+        user: {
+          name: memoizedUser.name || "Anonymous",
+          color: memoizedUser.color || "#ffffff",
+          clientId: awareness.clientID
+        },
+        timestamp: Date.now(),
+        matrixUserId: memoizedUser.id
+        // Custom field for Matrix user mapping
+      });
+    };
+    console.log("[Awareness] Initializing local state for clientId:", awareness.clientID);
+    setAwarenessState();
+    const intervalId = setInterval(setAwarenessState, 15e3);
+    return () => {
+      console.log("[Awareness] Cleaning up local state for clientId:", awareness.clientID);
+      clearInterval(intervalId);
+      awareness.setLocalState(null);
+    };
+  }, [matrixProvider, webrtcProvider, connectionStatus, memoizedUser.id]);
   return {
     editor: ixoEditor,
     connectionStatus,
     title: titleText,
     yDoc,
     root,
-    flowArray
+    flowArray,
+    connectedUsers
   };
 }
 
 // src/mantine/components/Base/BaseIconPicker.tsx
-import React196, { useState as useState68, useMemo as useMemo65, useEffect as useEffect53 } from "react";
+import React196, { useState as useState69, useMemo as useMemo65, useEffect as useEffect53 } from "react";
 import { TextInput as TextInput6, Tabs as Tabs3, Box as Box36, Stack as Stack125, UnstyledButton as UnstyledButton2, Text as Text101, Center as Center12, ScrollArea as ScrollArea7, Group as Group61, Popover as Popover2 } from "@mantine/core";
 import * as TablerIcons from "@tabler/icons-react";
 import { IconSearch as IconSearch5, IconX as IconX8, IconChevronLeft, IconChevronRight as IconChevronRight10 } from "@tabler/icons-react";
@@ -18831,9 +18879,9 @@ var localStorageService = {
 var iconsKey = "editor_recent_icons";
 var ICONS_PER_PAGE = 500;
 function BaseIconPicker({ opened, onClose, onSelectIcon, onUploadClick, children, currentIcon }) {
-  const [searchQuery, setSearchQuery] = useState68("");
-  const [activeTab, setActiveTab] = useState68("icons");
-  const [currentPage, setCurrentPage] = useState68(1);
+  const [searchQuery, setSearchQuery] = useState69("");
+  const [activeTab, setActiveTab] = useState69("icons");
+  const [currentPage, setCurrentPage] = useState69(1);
   const allIcons = useMemo65(() => {
     const iconEntries = Object.entries(TablerIcons).filter(([name]) => name.startsWith("Icon") && name !== "IconProps");
     return iconEntries;
@@ -18954,7 +19002,7 @@ function BaseIconPicker({ opened, onClose, onSelectIcon, onUploadClick, children
 }
 
 // src/mantine/components/CoverImage.tsx
-import React198, { useState as useState69, useRef as useRef12, useEffect as useEffect54 } from "react";
+import React198, { useState as useState70, useRef as useRef12, useEffect as useEffect54 } from "react";
 import { Box as Box38, Group as Group62 } from "@mantine/core";
 
 // src/core/lib/imageTransform.ts
@@ -19140,13 +19188,13 @@ function PageIcon({ src, iconSize = 64, useCenter = false, style }) {
 import { useDisclosure as useDisclosure4 } from "@mantine/hooks";
 function CoverImage({ coverImageUrl, logoUrl }) {
   const { editor, handlers, editable } = useBlocknoteContext();
-  const [isHovering, setIsHovering] = useState69(false);
-  const [isRepositioning, setIsRepositioning] = useState69(false);
-  const [coverPosition, setCoverPosition] = useState69(50);
+  const [isHovering, setIsHovering] = useState70(false);
+  const [isRepositioning, setIsRepositioning] = useState70(false);
+  const [coverPosition, setCoverPosition] = useState70(50);
   const coverFileInputRef = useRef12(null);
   const logoFileInputRef = useRef12(null);
   const [opened, { open, close }] = useDisclosure4(false);
-  const [metadata, setMetadata] = useState69(() => editor?.getPageMetadata?.() || null);
+  const [metadata, setMetadata] = useState70(() => editor?.getPageMetadata?.() || null);
   useEffect54(() => {
     if (!editor?._metadataManager) {
       return;
@@ -19422,7 +19470,7 @@ function CoverImage({ coverImageUrl, logoUrl }) {
 }
 
 // src/mantine/components/PageHeader.tsx
-import React199, { useState as useState70, useRef as useRef13, useEffect as useEffect55 } from "react";
+import React199, { useState as useState71, useRef as useRef13, useEffect as useEffect55 } from "react";
 function PageHeader({
   title = "New page",
   icon,
@@ -19433,7 +19481,7 @@ function PageHeader({
   isFavorited = false,
   menuItems = []
 }) {
-  const [isMenuOpen, setIsMenuOpen] = useState70(false);
+  const [isMenuOpen, setIsMenuOpen] = useState71(false);
   const menuRef = useRef13(null);
   useEffect55(() => {
     function handleClickOutside(event) {
@@ -19615,7 +19663,7 @@ var styles = {
 };
 
 // src/mantine/components/ExternalDropZone.tsx
-import React200, { useCallback as useCallback52, useEffect as useEffect56, useRef as useRef14, useState as useState71 } from "react";
+import React200, { useCallback as useCallback52, useEffect as useEffect56, useRef as useRef14, useState as useState72 } from "react";
 import { Box as Box39 } from "@mantine/core";
 var SCROLL_ZONE_SIZE = 80;
 var SCROLL_SPEED = 12;
@@ -19629,9 +19677,9 @@ var ExternalDropZone = ({
   children
 }) => {
   const containerRef = useRef14(null);
-  const [isValidDrag, setIsValidDrag] = useState71(false);
-  const [isHoveringInPlacementMode, setIsHoveringInPlacementMode] = useState71(false);
-  const [indicatorStyle, setIndicatorStyle] = useState71({});
+  const [isValidDrag, setIsValidDrag] = useState72(false);
+  const [isHoveringInPlacementMode, setIsHoveringInPlacementMode] = useState72(false);
+  const [indicatorStyle, setIndicatorStyle] = useState72({});
   const dropPositionRef = useRef14(null);
   const scrollAnimationRef = useRef14(null);
   const scrollDirectionRef = useRef14(null);
@@ -20153,7 +20201,7 @@ function IxoEditor({
 }
 
 // src/mantine/components/EntitySigningSetup.tsx
-import React203, { useState as useState72 } from "react";
+import React203, { useState as useState73 } from "react";
 import { Modal as Modal3, Stack as Stack126, Text as Text102, TextInput as TextInput7, Button as Button36, Alert as Alert26, Group as Group63 } from "@mantine/core";
 import { IconAlertCircle as IconAlertCircle13, IconCheck as IconCheck7, IconKey as IconKey2 } from "@tabler/icons-react";
 var EntitySigningSetup = ({
@@ -20163,11 +20211,11 @@ var EntitySigningSetup = ({
   entityName,
   onSetup
 }) => {
-  const [pin, setPin] = useState72("");
-  const [confirmPin, setConfirmPin] = useState72("");
-  const [loading, setLoading] = useState72(false);
-  const [error, setError] = useState72(null);
-  const [success, setSuccess] = useState72(false);
+  const [pin, setPin] = useState73("");
+  const [confirmPin, setConfirmPin] = useState73("");
+  const [loading, setLoading] = useState73(false);
+  const [error, setError] = useState73(null);
+  const [success, setSuccess] = useState73(false);
   const handleSetup = async () => {
     if (pin.length < 4) {
       setError("PIN must be at least 4 characters");
@@ -20249,7 +20297,7 @@ var EntitySigningSetup = ({
 };
 
 // src/mantine/components/FlowPermissionsPanel.tsx
-import React204, { useState as useState73, useEffect as useEffect57, useMemo as useMemo67 } from "react";
+import React204, { useState as useState74, useEffect as useEffect57, useMemo as useMemo67 } from "react";
 import { Stack as Stack127, Text as Text103, Paper as Paper17, Group as Group64, Badge as Badge31, Button as Button37, ActionIcon as ActionIcon30, Loader as Loader26, Alert as Alert27, Divider as Divider12 } from "@mantine/core";
 import { IconPlus as IconPlus5, IconTrash as IconTrash6, IconShieldCheck as IconShieldCheck2, IconUser as IconUser4, IconRobot as IconRobot3, IconBuilding } from "@tabler/icons-react";
 var FlowPermissionsPanel = ({
@@ -20260,9 +20308,9 @@ var FlowPermissionsPanel = ({
   onRevokePermission,
   getUserDisplayName
 }) => {
-  const [delegations, setDelegations] = useState73([]);
-  const [loading, setLoading] = useState73(true);
-  const [revoking, setRevoking] = useState73(null);
+  const [delegations, setDelegations] = useState74([]);
+  const [loading, setLoading] = useState74(true);
+  const [revoking, setRevoking] = useState74(null);
   const rootCapability = useMemo67(() => editor.getRootCapability?.(), [editor]);
   useEffect57(() => {
     const loadDelegations = async () => {
@@ -20348,7 +20396,7 @@ var FlowPermissionsPanel = ({
 };
 
 // src/mantine/components/GrantPermissionModal.tsx
-import React205, { useState as useState74, useCallback as useCallback53 } from "react";
+import React205, { useState as useState75, useCallback as useCallback53 } from "react";
 import {
   Modal as Modal4,
   Stack as Stack128,
@@ -20380,20 +20428,20 @@ var GrantPermissionModal = ({
   const singleBlockMode = !!targetBlockId || blocks.length === 1;
   const fixedBlockId = targetBlockId || (blocks.length === 1 ? blocks[0].id : null);
   const fixedBlock = fixedBlockId ? blocks.find((b) => b.id === fixedBlockId) || blocks[0] : null;
-  const [recipientType, setRecipientType] = useState74("user");
-  const [searchQuery, setSearchQuery] = useState74("");
-  const [searchResults, setSearchResults] = useState74([]);
-  const [searching, setSearching] = useState74(false);
-  const [selectedRecipient, setSelectedRecipient] = useState74(null);
-  const [manualDid, setManualDid] = useState74("");
-  const [scopeType, setScopeType] = useState74("full");
-  const [selectedBlocks, setSelectedBlocks] = useState74([]);
-  const [expirationEnabled, setExpirationEnabled] = useState74(false);
-  const [expirationDays, setExpirationDays] = useState74(30);
-  const [canDelegate, setCanDelegate] = useState74(false);
-  const [pin, setPin] = useState74("");
-  const [loading, setLoading] = useState74(false);
-  const [error, setError] = useState74(null);
+  const [recipientType, setRecipientType] = useState75("user");
+  const [searchQuery, setSearchQuery] = useState75("");
+  const [searchResults, setSearchResults] = useState75([]);
+  const [searching, setSearching] = useState75(false);
+  const [selectedRecipient, setSelectedRecipient] = useState75(null);
+  const [manualDid, setManualDid] = useState75("");
+  const [scopeType, setScopeType] = useState75("full");
+  const [selectedBlocks, setSelectedBlocks] = useState75([]);
+  const [expirationEnabled, setExpirationEnabled] = useState75(false);
+  const [expirationDays, setExpirationDays] = useState75(30);
+  const [canDelegate, setCanDelegate] = useState75(false);
+  const [pin, setPin] = useState75("");
+  const [loading, setLoading] = useState75(false);
+  const [error, setError] = useState75(null);
   const handleSearch = useCallback53(async () => {
     if (searchQuery.length < 2) return;
     setSearching(true);
@@ -20682,4 +20730,4 @@ export {
   ixoGraphQLClient,
   getEntity
 };
-//# sourceMappingURL=chunk-HJL3K6NS.mjs.map
+//# sourceMappingURL=chunk-5JZLDFPC.mjs.map