jnpf-web-vue3/node_modules/@univerjs/sheets-thread-comment-ui

@univerjs/sheets-thread-comment-ui

Package Overview

Package Name	UMD Namespace	Version	License	Downloads	Contains CSS	Contains i18n locales
@univerjs/sheets-thread-comment-ui	UniverSheetsThreadComment				⭕️	⭕️

Introduction

@univerjs/sheets-thread-comment-ui provides the comment/annotation function of Univer Sheets.

Usage

Installation

# Use npm
npm install @univerjs/sheets-thread-comment-ui

# Use pnpm
pnpm add @univerjs/sheets-thread-comment-ui

Register the plugin

import { UniverSheetsThreadCommentPlugin, IThreadCommentMentionDataService} from '@univerjs/sheets-thread-comment-ui';

const mockUser = {
    userID: 'mockId',
    name: 'MockUser',
    avatar: 'icon-url',
    anonymous: false,
    canBindAnonymous: false,
};

class CustomMentionDataService implements IThreadCommentMentionDataService {
    trigger: string = '@';

     // Get the common interface implementation of the mentioned user
    async getMentions(search: string) {
        return [
            {
                id: mockUser.userID,
                label: mockUser.name,
                type: 'user',
                icon: mockUser.avatar,
            },
            {
                id: '2',
                label: 'User2',
                type: 'user',
                icon: mockUser.avatar,
            },
        ];
    }
}

univer.registerPlugin(UniverSheetsThreadCommentPlugin);

API

import {
    AddCommentCommand,
    DeleteCommentCommand,
    UpdateCommentCommand,
    ResolveCommentCommand,
    DeleteCommentTreeCommand,
} from '@univerjs/sheets-thread-comment-ui';
import type {
    IAddCommentCommandParams,
    IDeleteCommentCommandParams,
    IResolveCommentCommandParams,
    IUpdateCommentCommandParams,
    IDeleteCommentTreeCommandParams,
} from '@univerjs/sheets-thread-comment-ui';

// Add comment by command
const commandService = univer.__getInjector().get(ICommandService);

commandService.executeCommand(AddCommentCommand.id, {
    unitId: 'unitId',
    subUnitId: 'subUnitId',
    comment: {
        // comment content
    },
} as IAddCommentCommandParams);