UNPKG

@dialpad/dialtone-vue

Version:

Vue component library for Dialpad's design system Dialtone

1,175 lines • 98.5 kB
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ names: { type: StringConstructor; required: true; }; unreadCount: { type: StringConstructor; default: null; }; unreadMentionCount: { type: StringConstructor; default: null; }; hasUnreads: { type: BooleanConstructor; default: boolean; }; selected: { type: BooleanConstructor; default: boolean; }; isTyping: { type: BooleanConstructor; default: boolean; }; }>, {}, { i18n: any; }, { groupCount(): number; messageCount(): string | number; mentionCount(): string | number; unreadCountTooltip(): string; typingTooltip(): any; ariaLabel(): string; contactRowListeners(): Object; }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ names: { type: StringConstructor; required: true; }; unreadCount: { type: StringConstructor; default: null; }; unreadMentionCount: { type: StringConstructor; default: null; }; hasUnreads: { type: BooleanConstructor; default: boolean; }; selected: { type: BooleanConstructor; default: boolean; }; isTyping: { type: BooleanConstructor; default: boolean; }; }>> & Readonly<{}>, { selected: boolean; unreadCount: string; hasUnreads: boolean; unreadMentionCount: string; isTyping: boolean; }, {}, { DtIconUsers: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ size: { type: StringConstructor; default: string; validator: (s: unknown) => boolean; }; ariaLabel: { type: StringConstructor; default: undefined; }; }>, {}, {}, { iconSizeClass(): any; ariaHidden(): "true" | "false"; dataQA(): {}; }, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "loaded"[], "loaded", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ size: { type: StringConstructor; default: string; validator: (s: unknown) => boolean; }; ariaLabel: { type: StringConstructor; default: undefined; }; }>> & Readonly<{ onLoaded?: ((...args: any[]) => any) | undefined; }>, { size: string; ariaLabel: string; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; DtRecipeGeneralRow: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; ariaLabel: { type: StringConstructor; default: string; }; description: { type: StringConstructor; required: true; }; color: { type: StringConstructor; default: null; validator: (color: unknown) => boolean; }; channelSetting: { type: StringConstructor; default: null; }; hasUnreads: { type: BooleanConstructor; default: boolean; }; unreadCount: { type: StringConstructor; default: null; }; unreadMentionCount: { type: StringConstructor; default: null; }; selected: { type: BooleanConstructor; default: boolean; }; muted: { type: BooleanConstructor; default: boolean; }; activeVoiceChat: { type: BooleanConstructor; default: boolean; }; dndText: { type: StringConstructor; default: string; }; hasCallButton: { type: BooleanConstructor; default: boolean; }; isTyping: { type: BooleanConstructor; default: boolean; }; iconSize: { type: StringConstructor; default: string; validator: (size: unknown) => boolean; }; }>, {}, { actionFocused: boolean; labelWidth: string; i18n: any; }, { leftbarGeneralRowClasses(): (string | { 'd-recipe-leftbar-row--no-action': boolean; 'd-recipe-leftbar-row--has-unread': boolean; 'd-recipe-leftbar-row__unread-count': boolean; 'd-recipe-leftbar-row--selected': boolean; 'd-recipe-leftbar-row--muted': boolean; 'd-recipe-leftbar-row--action-focused': boolean; })[]; getIcon(): string; generalRowListeners(): Object; getAriaLabel(): string; hasActions(): string | boolean; showUnreadCount(): boolean; showUnreadMentionCount(): boolean; hasUnreadCount(): boolean; hasUnreadMentionCount(): boolean; shouldApplyCustomStyleForCountBadge(): boolean; shouldApplyCustomStyleForMentionOnly(): boolean; messageCount(): string | number; mentionCount(): string | number; unreadCountTooltip(): string; dndTextTooltip(): any; activeVoiceChatTooltip(): any; callButtonTooltip(): any; typingTooltip(): any; }, { removeClassStyleAttrs: typeof import('../../../common/utils').removeClassStyleAttrs; addClassStyleAttrs: typeof import('../../../common/utils').addClassStyleAttrs; validateProps(): void; adjustLabelWidth(): void; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "call"[], "call", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; ariaLabel: { type: StringConstructor; default: string; }; description: { type: StringConstructor; required: true; }; color: { type: StringConstructor; default: null; validator: (color: unknown) => boolean; }; channelSetting: { type: StringConstructor; default: null; }; hasUnreads: { type: BooleanConstructor; default: boolean; }; unreadCount: { type: StringConstructor; default: null; }; unreadMentionCount: { type: StringConstructor; default: null; }; selected: { type: BooleanConstructor; default: boolean; }; muted: { type: BooleanConstructor; default: boolean; }; activeVoiceChat: { type: BooleanConstructor; default: boolean; }; dndText: { type: StringConstructor; default: string; }; hasCallButton: { type: BooleanConstructor; default: boolean; }; isTyping: { type: BooleanConstructor; default: boolean; }; iconSize: { type: StringConstructor; default: string; validator: (size: unknown) => boolean; }; }>> & Readonly<{ onCall?: ((...args: any[]) => any) | undefined; }>, { type: string; color: string; iconSize: string; ariaLabel: string; muted: boolean; selected: boolean; unreadCount: string; channelSetting: string; hasUnreads: boolean; unreadMentionCount: string; activeVoiceChat: boolean; dndText: string; hasCallButton: boolean; isTyping: boolean; }, {}, { DtEmojiTextWrapper: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ elementType: { type: StringConstructor; default: string; }; size: { type: StringConstructor; default: string; validator: (t: unknown) => boolean; }; }>, {}, { loadingEmojiJson: boolean; }, {}, { replaceDtEmojis(replaceList: any, textContent: any): Array<VNode | string>; searchVNodes(VNode: any): any | any; replaceVueComponentVNodeContent(): void; searchCodes(textContent: any): Array<VNode | string> | string; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ elementType: { type: StringConstructor; default: string; }; size: { type: StringConstructor; default: string; validator: (t: unknown) => boolean; }; }>> & Readonly<{}>, { size: string; elementType: string; }, {}, { DtEmoji: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ code: { type: StringConstructor; required: true; }; size: { type: StringConstructor; default: string; validator: (t: unknown) => boolean; }; imgClass: { type: (ObjectConstructor | StringConstructor | ArrayConstructor)[]; default: string; }; ariaLabel: { type: StringConstructor; default: null; }; showSkeleton: { type: BooleanConstructor; default: boolean; }; }>, {}, { emojiData: null; imgLoading: boolean; }, { emojiDataValid(): false; emojiSrc(): any; emojiAlt(): any; emojiLabel(): any; emojiSize(): any; }, { getEmojiData(): void; imageLoaded(): void; imageErrored(): void; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ code: { type: StringConstructor; required: true; }; size: { type: StringConstructor; default: string; validator: (t: unknown) => boolean; }; imgClass: { type: (ObjectConstructor | StringConstructor | ArrayConstructor)[]; default: string; }; ariaLabel: { type: StringConstructor; default: null; }; showSkeleton: { type: BooleanConstructor; default: boolean; }; }>> & Readonly<{}>, { size: string; ariaLabel: string; imgClass: string | unknown[] | Record<string, any>; showSkeleton: boolean; }, {}, { DtSkeleton: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ paragraphOption: { type: (ObjectConstructor | BooleanConstructor)[]; default: null; }; listItemOption: { type: (ObjectConstructor | BooleanConstructor)[]; default: null; }; textOption: { type: ObjectConstructor; default: null; }; shapeOption: { type: (ObjectConstructor | BooleanConstructor)[]; default: null; }; animationDuration: { type: NumberConstructor; default: number; }; ariaLabel: { type: StringConstructor; default: string; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; }>, {}, {}, { validationOptions(): { paragraphOption: boolean | Record<string, any>; listItemOption: boolean | Record<string, any>; textOption: Record<string, any>; shapeOption: boolean | Record<string, any>; }; }, { validator(): void; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ paragraphOption: { type: (ObjectConstructor | BooleanConstructor)[]; default: null; }; listItemOption: { type: (ObjectConstructor | BooleanConstructor)[]; default: null; }; textOption: { type: ObjectConstructor; default: null; }; shapeOption: { type: (ObjectConstructor | BooleanConstructor)[]; default: null; }; animationDuration: { type: NumberConstructor; default: number; }; ariaLabel: { type: StringConstructor; default: string; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; }>> & Readonly<{}>, { offset: number; animationDuration: number; ariaLabel: string; animate: boolean; paragraphOption: boolean | Record<string, any>; listItemOption: boolean | Record<string, any>; textOption: Record<string, any>; shapeOption: boolean | Record<string, any>; }, {}, { DtSkeletonText: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; headingHeight: { type: StringConstructor; default: string; validator: (headingHeight: unknown) => boolean; }; width: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; }>, {}, { SKELETON_HEADING_HEIGHTS: { sm: string; md: string; lg: string; }; }, {}, {}, { computed: { skeletonOffset(): any; skeletonStyle(): { animationDelay: string; animationDuration: any; }; }; }, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; headingHeight: { type: StringConstructor; default: string; validator: (headingHeight: unknown) => boolean; }; width: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; }>> & Readonly<{}>, { type: string; offset: number; animationDuration: number; width: string; contentClass: string; animate: boolean; headingHeight: string; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; DtSkeletonShape: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ shape: { type: StringConstructor; default: string; validator: (shape: unknown) => boolean; }; size: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: (ObjectConstructor | StringConstructor | ArrayConstructor)[]; default: string; }; }>, {}, { SKELETON_SHAPES: { circle: string; square: string; }; }, { shapeStyles(): { 'min-width': any; 'max-width': any; 'min-height': any; 'max-height': any; animationDelay: string; animationDuration: any; }; }, {}, { computed: { skeletonOffset(): any; skeletonStyle(): { animationDelay: string; animationDuration: any; }; }; }, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ shape: { type: StringConstructor; default: string; validator: (shape: unknown) => boolean; }; size: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: (ObjectConstructor | StringConstructor | ArrayConstructor)[]; default: string; }; }>> & Readonly<{}>, { offset: number; animationDuration: number; size: string; contentClass: string | unknown[] | Record<string, any>; shape: string; animate: boolean; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; DtSkeletonListItem: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ shape: { type: StringConstructor; default: string; validator: (shape: unknown) => boolean; }; shapeSize: { type: StringConstructor; default: string; }; paragraphs: { type: ObjectConstructor; default: () => { rows: number; randomWidth: boolean; }; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; shapeClass: { type: StringConstructor; default: string; }; contentClass: { type: StringConstructor; default: string; }; }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ shape: { type: StringConstructor; default: string; validator: (shape: unknown) => boolean; }; shapeSize: { type: StringConstructor; default: string; }; paragraphs: { type: ObjectConstructor; default: () => { rows: number; randomWidth: boolean; }; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; shapeClass: { type: StringConstructor; default: string; }; contentClass: { type: StringConstructor; default: string; }; }>> & Readonly<{}>, { offset: number; animationDuration: number; contentClass: string; shape: string; animate: boolean; shapeSize: string; paragraphs: Record<string, any>; shapeClass: string; }, {}, { DtSkeletonShape: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ shape: { type: StringConstructor; default: string; validator: (shape: unknown) => boolean; }; size: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: (ObjectConstructor | StringConstructor | ArrayConstructor)[]; default: string; }; }>, {}, { SKELETON_SHAPES: { circle: string; square: string; }; }, { shapeStyles(): { 'min-width': any; 'max-width': any; 'min-height': any; 'max-height': any; animationDelay: string; animationDuration: any; }; }, {}, { computed: { skeletonOffset(): any; skeletonStyle(): { animationDelay: string; animationDuration: any; }; }; }, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ shape: { type: StringConstructor; default: string; validator: (shape: unknown) => boolean; }; size: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: (ObjectConstructor | StringConstructor | ArrayConstructor)[]; default: string; }; }>> & Readonly<{}>, { offset: number; animationDuration: number; size: string; contentClass: string | unknown[] | Record<string, any>; shape: string; animate: boolean; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; DtSkeletonParagraph: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ rows: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; animate: { type: BooleanConstructor; default: boolean; }; minWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; maxWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; width: { type: (StringConstructor | ArrayConstructor)[]; default: null; }; randomWidth: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; animationDuration: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; rowClass: { type: StringConstructor; default: string; }; }>, {}, {}, { integerRows(): number; }, { randomWidthPercentage(): string; getSizeParagraphRow(row: any): {}; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ rows: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; animate: { type: BooleanConstructor; default: boolean; }; minWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; maxWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; width: { type: (StringConstructor | ArrayConstructor)[]; default: null; }; randomWidth: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; animationDuration: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; rowClass: { type: StringConstructor; default: string; }; }>> & Readonly<{}>, { offset: number; animationDuration: number; width: string | unknown[]; contentClass: string; maxWidth: string | number; animate: boolean; rows: string | number; minWidth: string | number; randomWidth: boolean; rowClass: string; }, {}, { DtSkeletonText: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; headingHeight: { type: StringConstructor; default: string; validator: (headingHeight: unknown) => boolean; }; width: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; }>, {}, { SKELETON_HEADING_HEIGHTS: { sm: string; md: string; lg: string; }; }, {}, {}, { computed: { skeletonOffset(): any; skeletonStyle(): { animationDelay: string; animationDuration: any; }; }; }, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; headingHeight: { type: StringConstructor; default: string; validator: (headingHeight: unknown) => boolean; }; width: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; }>> & Readonly<{}>, { type: string; offset: number; animationDuration: number; width: string; contentClass: string; animate: boolean; headingHeight: string; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; DtSkeletonParagraph: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ rows: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; animate: { type: BooleanConstructor; default: boolean; }; minWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; maxWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; width: { type: (StringConstructor | ArrayConstructor)[]; default: null; }; randomWidth: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; animationDuration: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; rowClass: { type: StringConstructor; default: string; }; }>, {}, {}, { integerRows(): number; }, { randomWidthPercentage(): string; getSizeParagraphRow(row: any): {}; }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ rows: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; animate: { type: BooleanConstructor; default: boolean; }; minWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; maxWidth: { type: (StringConstructor | NumberConstructor)[]; default: number; validator: (number: any) => boolean; }; width: { type: (StringConstructor | ArrayConstructor)[]; default: null; }; randomWidth: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; animationDuration: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; rowClass: { type: StringConstructor; default: string; }; }>> & Readonly<{}>, { offset: number; animationDuration: number; width: string | unknown[]; contentClass: string; maxWidth: string | number; animate: boolean; rows: string | number; minWidth: string | number; randomWidth: boolean; rowClass: string; }, {}, { DtSkeletonText: import('vue').DefineComponent<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; headingHeight: { type: StringConstructor; default: string; validator: (headingHeight: unknown) => boolean; }; width: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; }>, {}, { SKELETON_HEADING_HEIGHTS: { sm: string; md: string; lg: string; }; }, {}, {}, { computed: { skeletonOffset(): any; skeletonStyle(): { animationDelay: string; animationDuration: any; }; }; }, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{ type: { type: StringConstructor; default: string; validator: (type: unknown) => boolean; }; headingHeight: { type: StringConstructor; default: string; validator: (headingHeight: unknown) => boolean; }; width: { type: StringConstructor; default: string; }; animationDuration: { type: NumberConstructor; default: number; }; animate: { type: BooleanConstructor; default: boolean; }; offset: { type: NumberConstructor; default: number; }; contentClass: { type: StringConstructor; default: string; }; }>> & Readonly<{}>, { type: string; offset: number; animationDuration: number; width: string; contentClass: string; animate: boolean; headingHeight: string; }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; }, {}, string, import('vue').ComponentProvideOptions, true, {}, any>; }, {}, string, import('vue').Comp