@textbus/xnote 0.2.0 → 0.2.2

package/README.md

@@ -108,7 +108,7 @@ const editor = new Editor({
 export abstract class Organization {
   abstract getMembers(name?: string): Promise<Member[]>
 
-  abstract getMemberById(id: string): Promise<Member | null>
+  abstract atMember(member: Member): void
 }
 ```
 然后在编辑器初始化时传入你的实现

package/bundles/editor.d.ts

@@ -11,9 +11,15 @@ export interface XNoteCollaborateConfig extends CollaborateConfig {
         id: string;
     };
 }
+/**
+ * XNote 配置项
+ */
 export interface EditorConfig extends TextbusConfig {
+    /** 默认 HTML 内容*/
     content?: string;
+    /** 协作服务配置 */
     collaborateConfig?: XNoteCollaborateConfig;
+    /** 视图配置项 */
     viewOptions?: Partial<ViewOptions>;
 }
 export declare class Editor extends Textbus {

package/bundles/index.esm.js

@@ -691,7 +691,13 @@ const DropdownMenuPortal = withAnnotation({
             const documentClientHeight = document.documentElement.clientHeight;
             const bottomDistance = documentClientHeight - triggerRect.bottom;
             const isToTop = bottomDistance < 200 && triggerRect.top > bottomDistance;
-            menuElement.style.left = triggerRect.left - containerRect.left + 'px';
+            let left = triggerRect.left - containerRect.left;
+            const clientWidth = document.documentElement.clientWidth;
+            const menuWidth = menuElement.offsetWidth;
+            const maxLeft = clientWidth - menuWidth - 20;
+            left = Math.min(maxLeft, left);
+            // left = Math.max(left, 20)
+            menuElement.style.left = left + 'px';
             if (isToTop) {
                 const maxHeight = Math.max(menuElement.scrollHeight, menuElement.offsetHeight);
                 const height = Math.min(triggerRect.top - 20, maxHeight, 400);
@@ -2607,7 +2613,7 @@ class TableComponent extends Component {
         };
         const start = getSelfSlot(this.selection.startSlot);
         const end = getSelfSlot(this.selection.endSlot);
-        if (start && end) {
+        if (start && end && start !== end) {
             return this.getMaxRectangle(start, end);
         }
         return null;
@@ -5641,30 +5647,41 @@ const InlineToolbar = withAnnotation({
     const toolbarRef = createRef();
     function getTop() {
         const docRect = viewDocument.getBoundingClientRect();
+        // const toolbarRect = toolbarRef.current!.getBoundingClientRect()
         const toolbarHeight = 36;
         // const documentHeight = document.documentElement.clientHeight
         let selectionFocusRect = null;
         const commonAncestorComponent = selection.commonAncestorComponent;
         if (commonAncestorComponent instanceof TableComponent) {
-            const slots = commonAncestorComponent.getSelectedNormalizedSlots().map(item => {
-                return item.cells.filter(i => {
-                    return i.visible;
-                }).map(cell => {
-                    return cell.raw.slot;
+            const normalizedSlots = commonAncestorComponent.getSelectedNormalizedSlots();
+            if (normalizedSlots) {
+                const slots = normalizedSlots.map(item => {
+                    return item.cells.filter(i => {
+                        return i.visible;
+                    }).map(cell => {
+                        return cell.raw.slot;
+                    });
+                }).flat();
+                const startSlot = slots.at(0);
+                const endSlot = slots.at(-1);
+                const rect = commonAncestorComponent.getSelectedRect();
+                const startRect = adapter.getNativeNodeBySlot(startSlot).getBoundingClientRect();
+                const endEle = adapter.getNativeNodeBySlot(endSlot).getBoundingClientRect();
+                const width = sum(commonAncestorComponent.state.columnsConfig.slice(rect.x1, rect.x2));
+                selectionFocusRect = {
+                    left: startRect.left + width / 2,
+                    // left: Math.max(startRect.left + width / 2, toolbarRect.width / 2 + 10 - docRect.left),
+                    top: startRect.top,
+                    height: endEle.bottom - startRect.top,
+                    width
+                };
+            }
+            else {
+                selectionFocusRect = bridge.getRect({
+                    slot: selection.focusSlot,
+                    offset: selection.focusOffset
                 });
-            }).flat();
-            const startSlot = slots.at(0);
-            const endSlot = slots.at(-1);
-            const rect = commonAncestorComponent.getSelectedRect();
-            const startRect = adapter.getNativeNodeBySlot(startSlot).getBoundingClientRect();
-            const endEle = adapter.getNativeNodeBySlot(endSlot).getBoundingClientRect();
-            const width = sum(commonAncestorComponent.state.columnsConfig.slice(rect.x1, rect.x2));
-            selectionFocusRect = {
-                left: startRect.left + width / 2,
-                top: startRect.top,
-                height: endEle.bottom - startRect.top,
-                width
-            };
+            }
         }
         else {
             selectionFocusRect = bridge.getRect({
@@ -5683,6 +5700,7 @@ const InlineToolbar = withAnnotation({
         updateViewPosition(draft => {
             draft.transitionDuration = .15;
             draft.left = centerLeft - docRect.left;
+            // draft.left = Math.max(centerLeft - docRect.left, toolbarRect.width / 2 + 10 - docRect.left)
             draft.top = top + 10;
         });
         return top;
@@ -6006,6 +6024,9 @@ class Matcher {
     }
 }
 
+/**
+ * 组件架构信息
+ */
 class Organization {
 }
 function registerAtShortcut(textbus) {
@@ -6055,6 +6076,8 @@ class AtComponent extends Component {
         this.focus = new Subject();
         this.members = createSignal([]);
         this.selectedIndex = createSignal(0);
+        this.selection = this.textbus.get(Selection);
+        this.organization = this.textbus.get(Organization);
     }
     getSlots() {
         if (this.state.userInfo) {
@@ -6108,10 +6131,7 @@ class AtComponent extends Component {
         });
         onBreak((ev) => {
             const member = this.members()[this.selectedIndex()];
-            if (member) {
-                this.state.userInfo = Object.assign({}, member);
-            }
-            selection.selectComponentEnd(this);
+            this.atMember(member);
             ev.preventDefault();
         });
         useDynamicShortcut({
@@ -6147,12 +6167,18 @@ class AtComponent extends Component {
             subs.unsubscribe();
         });
     }
+    atMember(member) {
+        if (member) {
+            this.state.userInfo = Object.assign({}, member);
+            this.organization.atMember(member);
+        }
+        this.selection.selectComponentEnd(this);
+    }
 }
 AtComponent.componentName = 'AtComponent';
 AtComponent.type = ContentType.InlineComponent;
 
 function AtComponentView(props) {
-    const selection = inject(Selection);
     const dropdownRef = createRef();
     const subscription = props.component.focus.subscribe((b) => {
         if (dropdownRef.current && props.component.members().length) {
@@ -6204,8 +6230,7 @@ function AtComponentView(props) {
                         const yiq = (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000;
                         const color = yiq >= 128 ? '#000' : '#fff';
                         return (jsxs("div", { onClick: () => {
-                                props.component.state.userInfo = member;
-                                selection.selectComponentEnd(props.component);
+                                props.component.atMember(member);
                             }, class: ['xnote-at-member', { selected: index === selectedIndex }], children: [jsx("div", { class: "xnote-at-member-avatar", children: member.avatar ? jsx("img", { src: member.avatar, alt: member.name }) :
                                         jsx("span", { class: "xnote-at-member-avatar-bg", style: { background: member.color, color }, children: member.name }) }), jsxs("div", { class: "xnote-at-member-info", children: [jsx("div", { class: "xnote-at-member-name", children: member.name }), jsx("div", { class: "xnote-at-member-desc", children: member.groupName })] })] }, member.id));
                     }) }), children: [jsx("span", { children: "@" }), slot && jsx(SlotRender, { slot: slot, tag: "span", class: "xnote-at-input" })] }) }));
@@ -7255,7 +7280,7 @@ const stepComponentLoader = {
     }
 };
 
-class XNoteMessageBug extends MessageBus {
+class XNoteMessageBus extends MessageBus {
     constructor(selection, collaborateCursor, userinfo) {
         super();
         this.selection = selection;
@@ -7365,9 +7390,9 @@ class Editor extends Textbus {
                         provide: CollaborateSelectionAwarenessDelegate,
                         useClass: TableSelectionAwarenessDelegate
                     }, {
-                        provide: XNoteMessageBug,
+                        provide: XNoteMessageBus,
                         useFactory: (selection, collaborateCursor) => {
-                            return new XNoteMessageBug(selection, collaborateCursor, editorConfig.collaborateConfig.userinfo);
+                            return new XNoteMessageBus(selection, collaborateCursor, editorConfig.collaborateConfig.userinfo);
                         },
                         deps: [
                             Selection,
@@ -7375,7 +7400,7 @@ class Editor extends Textbus {
                         ]
                     }, {
                         provide: MessageBus,
-                        useExisting: XNoteMessageBug
+                        useExisting: XNoteMessageBus
                     }]
             });
         }
@@ -7502,4 +7527,4 @@ class Editor extends Textbus {
     }
 }
 
-export { AtComponent, AtComponentView, AttrTool, BlockTool, BlockquoteComponent, BlockquoteView, BoldTool, Button, CellAlignTool, CellBackgroundTool, CleanFormatsTool, CodeTool, ColorPicker, ColorTool, ComponentToolbar, Divider, DragResize, Dropdown, DropdownContextService, DropdownMenuContainer, DropdownMenuPortal, DropdownService, Editor, EditorService, FileUploader, FontFamilyTool, FontSizeTool, HighlightBoxComponent, HighlightBoxView, ImageComponent, ImageView, InlineToolbar, InlineToolbarPlugin, InsertMenu, InsertTool, ItalicTool, KatexComponent, KatexComponentView, Keymap, LeftToolbar, LeftToolbarPlugin, LinkJump, LinkTool, ListComponent, ListComponentView, Matcher, MenuHeading, MenuItem, MergeCellsTool, Organization, OutputInjectionToken, ParagraphComponent, ParagraphView, Picker, Popup, RedoTool, RefreshService, RootComponent, RootView, SourceCodeComponent, SourceCodeView, SplitCellsTool, SplitLine, StaticToolbar, StaticToolbarPlugin, StrikeThroughTool, SubscriptTool, SuperscriptTool, SuspensionToolbar, SuspensionToolbarPlugin, TableComponent, TableComponentView, TodolistComponent, TodolistView, ToolbarItem, UnderlineTool, UndoTool, VideoComponent, VideoView, XNoteMessageBug, atComponentLoader, backgroundColorFormatLoader, backgroundColorFormatter, blockquoteComponentLoader, boldFormatLoader, boldFormatter, cellAlignAttr, cellAlignAttrLoader, cellBackgroundAttr, cellBackgroundAttrLoader, codeFormatLoader, codeFormatter, colorFormatLoader, colorFormatter, deltaToBlock, fontFamilyFormatLoader, fontFamilyFormatter, fontSizeFormatLoader, fontSizeFormatter, headingAttr, headingAttrLoader, highlightBoxComponentLoader, imageComponentLoader, isSupportFont, italicFormatLoader, italicFormatter, katexComponentLoader, languageList, linkFormatLoader, linkFormatter, listComponentLoader, paragraphComponentLoader, registerAtShortcut, registerBlockquoteShortcut, registerBoldShortcut, registerCodeShortcut, registerHeadingShortcut, registerItalicShortcut, registerListShortcut, registerStrikeThroughShortcut, registerTextAlignShortcut, registerTextIndentShortcut, registerUnderlineShortcut, rootComponentLoader, sourceCodeComponentLoader, sourceCodeThemes, strikeThroughFormatLoader, strikeThroughFormatter, subscriptFormatLoader, subscriptFormatter, superscriptFormatLoader, superscriptFormatter, tableComponentLoader, textAlignAttr, textAlignAttrLoader, textIndentAttr, textIndentAttrLoader, toBlockquote, toList, todolistComponentLoader, toggleBold, toggleCode, toggleItalic, toggleStrikeThrough, toggleUnderline, underlineFormatLoader, underlineFormatter, useActiveBlock, useBlockContent, useBlockTransform, useOutput, useReadonly, videoComponentLoader };
+export { AtComponent, AtComponentView, AttrTool, BlockTool, BlockquoteComponent, BlockquoteView, BoldTool, Button, CellAlignTool, CellBackgroundTool, CleanFormatsTool, CodeTool, ColorPicker, ColorTool, ComponentToolbar, Divider, DragResize, Dropdown, DropdownContextService, DropdownMenuContainer, DropdownMenuPortal, DropdownService, Editor, EditorService, FileUploader, FontFamilyTool, FontSizeTool, HighlightBoxComponent, HighlightBoxView, ImageComponent, ImageView, InlineToolbar, InlineToolbarPlugin, InsertMenu, InsertTool, ItalicTool, KatexComponent, KatexComponentView, Keymap, LeftToolbar, LeftToolbarPlugin, LinkJump, LinkTool, ListComponent, ListComponentView, Matcher, MenuHeading, MenuItem, MergeCellsTool, Organization, OutputInjectionToken, ParagraphComponent, ParagraphView, Picker, Popup, RedoTool, RefreshService, RootComponent, RootView, SourceCodeComponent, SourceCodeView, SplitCellsTool, SplitLine, StaticToolbar, StaticToolbarPlugin, StrikeThroughTool, SubscriptTool, SuperscriptTool, SuspensionToolbar, SuspensionToolbarPlugin, TableComponent, TableComponentView, TodolistComponent, TodolistView, ToolbarItem, UnderlineTool, UndoTool, VideoComponent, VideoView, XNoteMessageBus, atComponentLoader, backgroundColorFormatLoader, backgroundColorFormatter, blockquoteComponentLoader, boldFormatLoader, boldFormatter, cellAlignAttr, cellAlignAttrLoader, cellBackgroundAttr, cellBackgroundAttrLoader, codeFormatLoader, codeFormatter, colorFormatLoader, colorFormatter, deltaToBlock, fontFamilyFormatLoader, fontFamilyFormatter, fontSizeFormatLoader, fontSizeFormatter, headingAttr, headingAttrLoader, highlightBoxComponentLoader, imageComponentLoader, isSupportFont, italicFormatLoader, italicFormatter, katexComponentLoader, languageList, linkFormatLoader, linkFormatter, listComponentLoader, paragraphComponentLoader, registerAtShortcut, registerBlockquoteShortcut, registerBoldShortcut, registerCodeShortcut, registerHeadingShortcut, registerItalicShortcut, registerListShortcut, registerStrikeThroughShortcut, registerTextAlignShortcut, registerTextIndentShortcut, registerUnderlineShortcut, rootComponentLoader, sourceCodeComponentLoader, sourceCodeThemes, strikeThroughFormatLoader, strikeThroughFormatter, subscriptFormatLoader, subscriptFormatter, superscriptFormatLoader, superscriptFormatter, tableComponentLoader, textAlignAttr, textAlignAttrLoader, textIndentAttr, textIndentAttrLoader, toBlockquote, toList, todolistComponentLoader, toggleBold, toggleCode, toggleItalic, toggleStrikeThrough, toggleUnderline, underlineFormatLoader, underlineFormatter, useActiveBlock, useBlockContent, useBlockTransform, useOutput, useReadonly, videoComponentLoader };

package/bundles/index.js

@@ -693,7 +693,13 @@ const DropdownMenuPortal = core.withAnnotation({
             const documentClientHeight = document.documentElement.clientHeight;
             const bottomDistance = documentClientHeight - triggerRect.bottom;
             const isToTop = bottomDistance < 200 && triggerRect.top > bottomDistance;
-            menuElement.style.left = triggerRect.left - containerRect.left + 'px';
+            let left = triggerRect.left - containerRect.left;
+            const clientWidth = document.documentElement.clientWidth;
+            const menuWidth = menuElement.offsetWidth;
+            const maxLeft = clientWidth - menuWidth - 20;
+            left = Math.min(maxLeft, left);
+            // left = Math.max(left, 20)
+            menuElement.style.left = left + 'px';
             if (isToTop) {
                 const maxHeight = Math.max(menuElement.scrollHeight, menuElement.offsetHeight);
                 const height = Math.min(triggerRect.top - 20, maxHeight, 400);
@@ -2609,7 +2615,7 @@ class TableComponent extends core$1.Component {
         };
         const start = getSelfSlot(this.selection.startSlot);
         const end = getSelfSlot(this.selection.endSlot);
-        if (start && end) {
+        if (start && end && start !== end) {
             return this.getMaxRectangle(start, end);
         }
         return null;
@@ -5643,30 +5649,41 @@ const InlineToolbar = core.withAnnotation({
     const toolbarRef = core.createRef();
     function getTop() {
         const docRect = viewDocument.getBoundingClientRect();
+        // const toolbarRect = toolbarRef.current!.getBoundingClientRect()
         const toolbarHeight = 36;
         // const documentHeight = document.documentElement.clientHeight
         let selectionFocusRect = null;
         const commonAncestorComponent = selection.commonAncestorComponent;
         if (commonAncestorComponent instanceof TableComponent) {
-            const slots = commonAncestorComponent.getSelectedNormalizedSlots().map(item => {
-                return item.cells.filter(i => {
-                    return i.visible;
-                }).map(cell => {
-                    return cell.raw.slot;
+            const normalizedSlots = commonAncestorComponent.getSelectedNormalizedSlots();
+            if (normalizedSlots) {
+                const slots = normalizedSlots.map(item => {
+                    return item.cells.filter(i => {
+                        return i.visible;
+                    }).map(cell => {
+                        return cell.raw.slot;
+                    });
+                }).flat();
+                const startSlot = slots.at(0);
+                const endSlot = slots.at(-1);
+                const rect = commonAncestorComponent.getSelectedRect();
+                const startRect = adapter.getNativeNodeBySlot(startSlot).getBoundingClientRect();
+                const endEle = adapter.getNativeNodeBySlot(endSlot).getBoundingClientRect();
+                const width = sum(commonAncestorComponent.state.columnsConfig.slice(rect.x1, rect.x2));
+                selectionFocusRect = {
+                    left: startRect.left + width / 2,
+                    // left: Math.max(startRect.left + width / 2, toolbarRect.width / 2 + 10 - docRect.left),
+                    top: startRect.top,
+                    height: endEle.bottom - startRect.top,
+                    width
+                };
+            }
+            else {
+                selectionFocusRect = bridge.getRect({
+                    slot: selection.focusSlot,
+                    offset: selection.focusOffset
                 });
-            }).flat();
-            const startSlot = slots.at(0);
-            const endSlot = slots.at(-1);
-            const rect = commonAncestorComponent.getSelectedRect();
-            const startRect = adapter.getNativeNodeBySlot(startSlot).getBoundingClientRect();
-            const endEle = adapter.getNativeNodeBySlot(endSlot).getBoundingClientRect();
-            const width = sum(commonAncestorComponent.state.columnsConfig.slice(rect.x1, rect.x2));
-            selectionFocusRect = {
-                left: startRect.left + width / 2,
-                top: startRect.top,
-                height: endEle.bottom - startRect.top,
-                width
-            };
+            }
         }
         else {
             selectionFocusRect = bridge.getRect({
@@ -5685,6 +5702,7 @@ const InlineToolbar = core.withAnnotation({
         updateViewPosition(draft => {
             draft.transitionDuration = .15;
             draft.left = centerLeft - docRect.left;
+            // draft.left = Math.max(centerLeft - docRect.left, toolbarRect.width / 2 + 10 - docRect.left)
             draft.top = top + 10;
         });
         return top;
@@ -6008,6 +6026,9 @@ class Matcher {
     }
 }
 
+/**
+ * 组件架构信息
+ */
 class Organization {
 }
 function registerAtShortcut(textbus) {
@@ -6057,6 +6078,8 @@ class AtComponent extends core$1.Component {
         this.focus = new core$1.Subject();
         this.members = core.createSignal([]);
         this.selectedIndex = core.createSignal(0);
+        this.selection = this.textbus.get(core$1.Selection);
+        this.organization = this.textbus.get(Organization);
     }
     getSlots() {
         if (this.state.userInfo) {
@@ -6110,10 +6133,7 @@ class AtComponent extends core$1.Component {
         });
         core$1.onBreak((ev) => {
             const member = this.members()[this.selectedIndex()];
-            if (member) {
-                this.state.userInfo = Object.assign({}, member);
-            }
-            selection.selectComponentEnd(this);
+            this.atMember(member);
             ev.preventDefault();
         });
         core$1.useDynamicShortcut({
@@ -6149,12 +6169,18 @@ class AtComponent extends core$1.Component {
             subs.unsubscribe();
         });
     }
+    atMember(member) {
+        if (member) {
+            this.state.userInfo = Object.assign({}, member);
+            this.organization.atMember(member);
+        }
+        this.selection.selectComponentEnd(this);
+    }
 }
 AtComponent.componentName = 'AtComponent';
 AtComponent.type = core$1.ContentType.InlineComponent;
 
 function AtComponentView(props) {
-    const selection = core.inject(core$1.Selection);
     const dropdownRef = core.createRef();
     const subscription = props.component.focus.subscribe((b) => {
         if (dropdownRef.current && props.component.members().length) {
@@ -6206,8 +6232,7 @@ function AtComponentView(props) {
                         const yiq = (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000;
                         const color$1 = yiq >= 128 ? '#000' : '#fff';
                         return (jsxRuntime.jsxs("div", { onClick: () => {
-                                props.component.state.userInfo = member;
-                                selection.selectComponentEnd(props.component);
+                                props.component.atMember(member);
                             }, class: ['xnote-at-member', { selected: index === selectedIndex }], children: [jsxRuntime.jsx("div", { class: "xnote-at-member-avatar", children: member.avatar ? jsxRuntime.jsx("img", { src: member.avatar, alt: member.name }) :
                                         jsxRuntime.jsx("span", { class: "xnote-at-member-avatar-bg", style: { background: member.color, color: color$1 }, children: member.name }) }), jsxRuntime.jsxs("div", { class: "xnote-at-member-info", children: [jsxRuntime.jsx("div", { class: "xnote-at-member-name", children: member.name }), jsxRuntime.jsx("div", { class: "xnote-at-member-desc", children: member.groupName })] })] }, member.id));
                     }) }), children: [jsxRuntime.jsx("span", { children: "@" }), slot && jsxRuntime.jsx(SlotRender, { slot: slot, tag: "span", class: "xnote-at-input" })] }) }));
@@ -7257,7 +7282,7 @@ const stepComponentLoader = {
     }
 };
 
-class XNoteMessageBug extends collaborate.MessageBus {
+class XNoteMessageBus extends collaborate.MessageBus {
     constructor(selection, collaborateCursor, userinfo) {
         super();
         this.selection = selection;
@@ -7367,9 +7392,9 @@ class Editor extends core$1.Textbus {
                         provide: platformBrowser.CollaborateSelectionAwarenessDelegate,
                         useClass: TableSelectionAwarenessDelegate
                     }, {
-                        provide: XNoteMessageBug,
+                        provide: XNoteMessageBus,
                         useFactory: (selection, collaborateCursor) => {
-                            return new XNoteMessageBug(selection, collaborateCursor, editorConfig.collaborateConfig.userinfo);
+                            return new XNoteMessageBus(selection, collaborateCursor, editorConfig.collaborateConfig.userinfo);
                         },
                         deps: [
                             core$1.Selection,
@@ -7377,7 +7402,7 @@ class Editor extends core$1.Textbus {
                         ]
                     }, {
                         provide: collaborate.MessageBus,
-                        useExisting: XNoteMessageBug
+                        useExisting: XNoteMessageBus
                     }]
             });
         }
@@ -7579,7 +7604,7 @@ exports.UnderlineTool = UnderlineTool;
 exports.UndoTool = UndoTool;
 exports.VideoComponent = VideoComponent;
 exports.VideoView = VideoView;
-exports.XNoteMessageBug = XNoteMessageBug;
+exports.XNoteMessageBus = XNoteMessageBus;
 exports.atComponentLoader = atComponentLoader;
 exports.backgroundColorFormatLoader = backgroundColorFormatLoader;
 exports.backgroundColorFormatter = backgroundColorFormatter;

package/bundles/textbus/components/at/at.component.d.ts

@@ -13,12 +13,17 @@ export interface Member {
     /** 成员背景色 */
     color?: string;
 }
-export declare abstract class Organization {
-    abstract getMembers(name?: string): Promise<Member[]>;
-    abstract getMemberById(id: string): Promise<Member | null>;
+/**
+ * 组件架构信息
+ */
+export declare abstract class Organization<T extends Member = Member> {
+    /** 根据当前输入获取成员列表 */
+    abstract getMembers(name?: string): Promise<T[]>;
+    /** 当 @ 某个成员时的回调 */
+    abstract atMember(member: T): void;
 }
-export interface AtComponentState {
-    userInfo?: Member;
+export interface AtComponentState<T extends Member = Member> {
+    userInfo?: T;
     slot?: Slot;
 }
 export declare function registerAtShortcut(textbus: Textbus): void;
@@ -29,7 +34,10 @@ export declare class AtComponent extends Component<AtComponentState> {
     focus: Subject<boolean>;
     members: import("@viewfly/core").Signal<Member[]>;
     selectedIndex: import("@viewfly/core").Signal<number>;
+    private selection;
+    private organization;
     constructor(textbus: Textbus, state?: AtComponentState);
     getSlots(): Slot[];
     setup(): void;
+    atMember(member?: Member): void;
 }

package/bundles/xnote-message-bus.d.ts

@@ -9,7 +9,7 @@ export interface UserInfo {
 export interface XNoteMessage extends UserSelectionCursor {
     id: string;
 }
-export declare class XNoteMessageBug extends MessageBus<XNoteMessage> {
+export declare class XNoteMessageBus extends MessageBus<XNoteMessage> {
     private selection;
     private collaborateCursor;
     private userinfo;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@textbus/xnote",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "A high-performance rich text editor that supports multiplayer online collaboration.",
   "main": "./bundles/index.js",
   "module": "./bundles/index.esm.js",
@@ -31,10 +31,10 @@
     "@textbus/collaborate": "^4.2.4",
     "@textbus/core": "^4.2.4",
     "@textbus/platform-browser": "^4.2.5",
-    "@viewfly/core": "^1.1.0",
-    "@viewfly/hooks": "^1.1.0",
-    "@viewfly/platform-browser": "^1.1.0",
-    "@viewfly/scoped-css": "^1.1.0",
+    "@viewfly/core": "^1.1.1",
+    "@viewfly/hooks": "^1.1.1",
+    "@viewfly/platform-browser": "^1.1.1",
+    "@viewfly/scoped-css": "^1.1.1",
     "highlight.js": "^11.9.0",
     "katex": "^0.16.10",
     "uuid": "^10.0.0"
@@ -47,7 +47,7 @@
     "@types/uuid": "^10.0.0",
     "@typescript-eslint/eslint-plugin": "^5.8.0",
     "@typescript-eslint/parser": "^5.8.0",
-    "@viewfly/devtools": "^1.0.8",
+    "@viewfly/devtools": "^1.1.1",
     "autoprefixer": "^10.4.0",
     "babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
     "core-js": "^3.20.1",