@nexusui/components
Version:
These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.
92 lines (91 loc) • 3.42 kB
TypeScript
import { DrawerProps } from '@mui/material/Drawer';
import { ICommentCard, IBasicComment, ICommentAuthor, ICommentRichText, ICommentAttachment, ICommentAction } from '../CommentCard';
import { IEmptyState } from '../../EmptyState';
import { IFilterMenuProps, ISortMenuProps } from './CommentFilterDrawer.component';
export type ICommentItem = Omit<ICommentCard, 'replies'> & {
/**
* A list of replies to display in the comment thread.
*/
replies?: ReadonlyArray<IBasicComment>;
/**
* A top-level actions for single thread, such as 'Delete thread', 'Mark as unread'.
* @default []
*/
threadActions?: ReadonlyArray<ICommentAction>;
/**
* The actions for the first comment of thread, such as 'Edit'.
* @default []
*/
threadCommentActions?: ReadonlyArray<ICommentAction>;
};
export type ICommentDrawer = DrawerProps & IFilterMenuProps & ISortMenuProps & ICommentRichText & {
/**
* Comment drawer header
* @deprecated This field is no longer supported
* @default Comments
*/
header?: string;
/**
* If `true`, the loading circle will appear.
* @default false
*/
loading?: boolean;
/**
* Author details for the currently logged in user for displaying next to the reply text field.
*/
currentUser: ICommentAuthor;
/**
* Array of comments to display in the drawer.
* type ICommentItem = Omit<ICommentCard, 'replies'> & { replies?: IBasicComment[] };
*/
comments: ReadonlyArray<ICommentItem>;
/**
* Current Selected comment id, optional value
*/
selectedCommentId?: string;
/**
* Callback function triggered when one comment is selected
* @param id selected comment id. Undefined means the comment is deselected.
* @returns Void
*/
onCommentClick: (id?: string) => void;
/**
* Callback function when the active user added a new comment.
* @param message comment message
* @param attachments comment attachments
* @param tags comment tags
* @param metadata comment metadata
*/
onCommentAdd: (message: string, attachments?: ICommentAttachment[], tags?: string[], metadata?: Record<string, any>) => void;
/**
* Callback function triggered when user added a reply to a comment
* @param commentId the comment id that user replied
* @param message reply message
* @param attachments reply attachments
* @param tags reply tags
* @param metadata reply metadata
* @returns Void
*/
onReplyAdd: (commentId: string, message: string, attachments?: ICommentAttachment[], tags?: string[], metadata?: Record<string, any>) => void;
/**
* Callback function triggered when the user searches for comments.
* If not passed, the internal search mechanism will be used by default.
* @param search keyword
* @returns Void
*/
onCommentSearch?: (keyword: string) => void;
/**
* Configuration for empty state display
*/
emptyStateProps?: Partial<IEmptyState>;
/**
* Indicate if any filter is applied compared to default filter.
* @default false
*/
filterChanged?: boolean;
/**
* The total number of comments. If the prop is not passed, the comments length is used as the default.
*/
commentsTotal?: number;
};
export declare const CommentDrawerContainer: React.FC<ICommentDrawer>;