@atlaskit/mention
Version:
A React component used to display user profiles in a list for 'Mention' functionality
189 lines (188 loc) • 6.07 kB
TypeScript
import { type SyntheticEvent } from 'react';
import { type ServiceConfig } from '@atlaskit/util-service-support/types';
export interface MentionNameResolver {
lookupName(id: string): Promise<MentionNameDetails> | MentionNameDetails;
cacheName(id: string, name: string): void;
}
export type MentionStats = {
[key: string]: any;
};
export interface ResultCallback<T> {
(result: T, query?: string, stats?: MentionStats): void;
}
export interface ErrorCallback {
(error: Error, query?: string): void;
}
export interface InfoCallback {
(info: string): void;
}
export interface AnalyticsCallback {
(event: string, actionSubject: string, action: string, attributes?: {
[key: string]: any;
}): void;
}
export interface MentionResourceConfig extends ServiceConfig {
containerId?: string;
productId?: string;
shouldHighlightMention?: (mention: MentionDescription) => boolean;
mentionNameResolver?: MentionNameResolver;
shouldEnableInvite?: boolean;
onInviteItemClick?: (flow: InviteFlow) => void;
userRole?: UserRole;
productName?: string;
debounceTime?: number;
inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
}
export interface ResourceProvider<Result> {
/**
* Subscribe to ResourceProvider results
*
* @param {string} key subscriber key used to unsubscribe
* @param {ResultCallback<Result>} callback This callback only receives latest results
* @param {ErrorCallback} errCallback This callback will errors
* @param {InfoCallback} infoCallback This callback will info
* @param {ResultCallback<Result>} allResultsCallback This callback will receive all results
*/
subscribe(key: string, callback?: ResultCallback<Result>, errCallback?: ErrorCallback, infoCallback?: InfoCallback, allResultsCallback?: ResultCallback<Result>, analyticsCallback?: AnalyticsCallback): void;
/**
* Unsubscribe to this resource provider results
* @param {string} key key used when subscribing
*/
unsubscribe(key: string): void;
}
export type MentionContextIdentifier = {
containerId?: string;
objectId?: string;
childObjectId?: string;
sessionId?: string;
};
export interface MentionProvider extends ResourceProvider<MentionDescription[]>, InviteFromMentionProvider, XProductInviteMentionProvider {
filter(query?: string, contextIdentifier?: MentionContextIdentifier): void;
recordMentionSelection(mention: MentionDescription, contextIdentifier?: MentionContextIdentifier): void;
shouldHighlightMention(mention: MentionDescription): boolean;
isFiltering(query: string): boolean;
}
export interface HighlightDetail {
start: number;
end: number;
}
export interface Highlight {
name: HighlightDetail[];
mentionName: HighlightDetail[];
nickname: HighlightDetail[];
}
export interface Presence {
time?: string;
status?: string;
}
export type LozengeColor = 'default' | 'success' | 'removed' | 'inprogress' | 'new' | 'moved';
export interface LozengeProps {
text: React.ReactNode;
appearance?: LozengeColor;
}
export interface MentionDescription {
id: string;
avatarUrl?: string;
name?: string;
mentionName?: string;
nickname?: string;
highlight?: Highlight;
lozenge?: string | LozengeProps;
presence?: Presence;
accessLevel?: string;
inContext?: boolean;
userType?: string;
context?: MentionDescContext;
source?: string;
isXProductUser?: boolean;
}
export interface MentionDescContext {
members: TeamMember[];
includesYou: boolean;
memberCount: number;
teamLink: string;
}
export interface MentionsResult {
mentions: MentionDescription[];
query: string;
}
export interface TeamMember {
id: string;
name: string;
}
export interface Team {
id: string;
smallAvatarImageUrl: string;
displayName: string;
members: TeamMember[];
includesYou: boolean;
memberCount: number;
highlight?: Highlight;
}
export type MentionEventHandler = (mentionId: string, text: string, event?: SyntheticEvent<HTMLSpanElement>) => void;
export interface OnMentionEvent {
(mention: MentionDescription, event?: SyntheticEvent<any>): void;
}
export declare enum MentionType {
SELF = 0,
RESTRICTED = 1,
DEFAULT = 2
}
export declare enum UserAccessLevel {
NONE = 0,
SITE = 1,
APPLICATION = 2,
CONTAINER = 3
}
export declare enum UserType {
DEFAULT = 0,
SPECIAL = 1,
APP = 2,
TEAM = 3,
SYSTEM = 4
}
export declare enum SliNames {
SEARCH = "searchUser",
SEARCH_TEAM = "searchTeam",
INITIAL_STATE = "initialState",
SELECT = "select",
SELECT_TEAM = "selectTeam"
}
export declare enum ComponentNames {
TYPEAHEAD = "mentionTypeahead",
MENTION = "mention"
}
export declare enum Actions {
VIEWED = "viewed",
CLICKED = "clicked",
CLOSED = "closed",
SUCCEEDED = "succeeded",
FAILED = "failed"
}
export declare enum MentionNameStatus {
UNKNOWN = 0,
SERVICE_ERROR = 1,
OK = 2
}
export interface MentionNameDetails {
id: string;
name?: string;
status: MentionNameStatus;
}
export declare function isRestricted(accessLevel?: string): boolean;
export declare function isSpecialMention(mention: MentionDescription): boolean;
export declare function isAppMention(mention: MentionDescription): boolean | "" | undefined;
export declare function isTeamMention(mention: MentionDescription): boolean | "" | undefined;
export declare function isSpecialMentionText(mentionText: string): boolean | "";
export declare const isPromise: <T>(p: any) => p is Promise<T>;
export type InviteFlow = 'mention' | 'assign';
export type UserRole = 'admin' | 'trusted' | 'basic';
export interface InviteFromMentionProvider {
productName?: string;
shouldEnableInvite?: boolean;
onInviteItemClick?(flow: InviteFlow): void;
userRole?: UserRole;
}
export interface XProductInviteMentionProvider {
inviteXProductUser?: (userId: string, mentionName: string) => Promise<void>;
}