@mobilon-dev/chotto 0.3.22 → 0.3.24

package/dist/types/components/2_feed_elements/MessageReactions/composables/useReactions.d.ts

@@ -0,0 +1,19 @@
+import type { MessageReactions } from '@/types';
+/**
+ * Добавляет или увеличивает реакцию в локальном состоянии
+ */
+export declare function updateLocalReactionsAdd(localReactions: {
+    value: MessageReactions | undefined;
+}, key: string): void;
+/**
+ * Удаляет или уменьшает реакцию в локальном состоянии
+ */
+export declare function updateLocalReactionsRemove(localReactions: {
+    value: MessageReactions | undefined;
+}, key: string): void;
+/**
+ * Переключает реакцию (добавляет, если нет, или удаляет, если есть)
+ */
+export declare function updateLocalReactionsToggle(localReactions: {
+    value: MessageReactions | undefined;
+}, key: string): void;

package/dist/types/components/2_feed_elements/MessageReactions/composables/useReactionsPanel.d.ts

@@ -0,0 +1,23 @@
+import { type Ref } from 'vue';
+/**
+ * Композабл для управления панелями реакций (быстрые реакции и полный picker)
+ */
+export declare function useReactionsPanel(quickEmojis: Ref<readonly string[]>, addButtonRef: Ref<HTMLButtonElement | null>): {
+    isQuickReactionsOpen: Ref<boolean, boolean>;
+    isFullPickerOpen: Ref<boolean, boolean>;
+    pickerRef: Ref<HTMLElement | null, HTMLElement | null>;
+    quickReactionsRef: Ref<HTMLElement | null, HTMLElement | null>;
+    quickPanelStyle: Ref<Record<string, string>, Record<string, string>>;
+    pickerStyle: Ref<Record<string, string>, Record<string, string>>;
+    openQuickPanel: () => void;
+    closeQuickPanel: () => void;
+    openFullPicker: () => Promise<void>;
+    closeFullPicker: () => void;
+    handleQuickPanelMouseEnter: () => void;
+    handleQuickPanelMouseLeave: () => void;
+    handlePickerMouseEnter: () => void;
+    handlePickerMouseLeave: () => void;
+    handleButtonMouseEnter: () => void;
+    handleButtonMouseLeave: () => void;
+    handleClickOutside: (event: MouseEvent) => void;
+};

package/dist/types/components/2_feed_elements/MessageReactions/composables/useReactionsState.d.ts

@@ -0,0 +1,99 @@
+import { type Ref } from 'vue';
+import type { MessageReactions } from '@/types';
+/**
+ * Композабл для управления локальным состоянием реакций
+ */
+export declare function useReactionsState(initialReactions: Ref<MessageReactions | undefined>): {
+    localReactions: Ref<{
+        items: {
+            key: import("@/types").ReactionKey;
+            count: number;
+            reactedByMe?: boolean | undefined;
+        }[];
+        meta?: {
+            mode?: "single" | "multi" | undefined;
+        } | undefined;
+        recent?: {
+            userId: string | number;
+            key: import("@/types").ReactionKey;
+            date?: number | undefined;
+        }[] | undefined;
+        vendor?: {
+            telegram?: {
+                total_count?: number | undefined;
+                recent_reactions?: {
+                    type: {
+                        type: string;
+                        emoji?: string | undefined;
+                    };
+                    actor?: {
+                        id?: number | undefined;
+                        is_bot?: boolean | undefined;
+                        first_name?: string | undefined;
+                    } | undefined;
+                    date?: number | undefined;
+                }[] | undefined;
+                counts?: {
+                    type: {
+                        type: string;
+                        emoji: string;
+                    };
+                    count: number;
+                }[] | undefined;
+            } | undefined;
+            whatsapp?: {
+                lastEventAt?: number | undefined;
+            } | undefined;
+        } | undefined;
+    } | undefined, MessageReactions | {
+        items: {
+            key: import("@/types").ReactionKey;
+            count: number;
+            reactedByMe?: boolean | undefined;
+        }[];
+        meta?: {
+            mode?: "single" | "multi" | undefined;
+        } | undefined;
+        recent?: {
+            userId: string | number;
+            key: import("@/types").ReactionKey;
+            date?: number | undefined;
+        }[] | undefined;
+        vendor?: {
+            telegram?: {
+                total_count?: number | undefined;
+                recent_reactions?: {
+                    type: {
+                        type: string;
+                        emoji?: string | undefined;
+                    };
+                    actor?: {
+                        id?: number | undefined;
+                        is_bot?: boolean | undefined;
+                        first_name?: string | undefined;
+                    } | undefined;
+                    date?: number | undefined;
+                }[] | undefined;
+                counts?: {
+                    type: {
+                        type: string;
+                        emoji: string;
+                    };
+                    count: number;
+                }[] | undefined;
+            } | undefined;
+            whatsapp?: {
+                lastEventAt?: number | undefined;
+            } | undefined;
+        } | undefined;
+    } | undefined>;
+    displayedReactions: import("vue").ComputedRef<{
+        key: import("@/types").ReactionKey;
+        count: number;
+        reactedByMe?: boolean | undefined;
+    }[]>;
+    hasReactions: import("vue").ComputedRef<boolean>;
+    addReaction: (key: string) => void;
+    removeReaction: (key: string) => void;
+    toggleReaction: (key: string) => void;
+};

package/dist/types/components/2_feed_elements/MessageReactions/stories/MessageReactions.stories.d.ts

@@ -0,0 +1,31 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite';
+import TextMessage from '../../TextMessage/TextMessage.vue';
+import ImageMessage from '../../ImageMessage/ImageMessage.vue';
+import AudioMessage from '../../AudioMessage/AudioMessage.vue';
+import VideoMessage from '../../VideoMessage/VideoMessage.vue';
+import FileMessage from '../../FileMessage/FileMessage.vue';
+import StickerMessage from '../../StickerMessage/StickerMessage.vue';
+declare const meta: Meta<typeof TextMessage>;
+export default meta;
+type Story = StoryObj<typeof TextMessage>;
+export declare const Default: Story;
+export declare const LeftMessageReactions: Story;
+export declare const LeftMessageSingleReaction: Story;
+export declare const LeftMessageMultipleReactions: Story;
+export declare const LeftMessageNoReactions: Story;
+export declare const RightMessageReactions: Story;
+export declare const RightMessageSingleReaction: Story;
+export declare const RightMessageMultipleReactions: Story;
+export declare const RightMessageNoReactions: Story;
+export declare const AllReactionsActive: Story;
+export declare const LargeCountReactions: Story;
+export declare const ImageMessageWithReactions: StoryObj<typeof ImageMessage>;
+export declare const ImageMessageRightWithReactions: StoryObj<typeof ImageMessage>;
+export declare const AudioMessageWithReactions: StoryObj<typeof AudioMessage>;
+export declare const AudioMessageRightWithReactions: StoryObj<typeof AudioMessage>;
+export declare const VideoMessageWithReactions: StoryObj<typeof VideoMessage>;
+export declare const VideoMessageRightWithReactions: StoryObj<typeof VideoMessage>;
+export declare const FileMessageWithReactions: StoryObj<typeof FileMessage>;
+export declare const FileMessageRightWithReactions: StoryObj<typeof FileMessage>;
+export declare const StickerMessageWithReactions: StoryObj<typeof StickerMessage>;
+export declare const StickerMessageRightWithReactions: StoryObj<typeof StickerMessage>;

package/dist/types/components/2_feed_elements/MessageReactions/styles/types.d.ts

@@ -0,0 +1,221 @@
+/**
+ * CSS variables for MessageReactions component
+ */
+export interface MessageReactionsThemeCSSVariables {
+    /** Отображение контейнера реакций */
+    '--chotto-messagereactions-display': string;
+    /** Выравнивание элементов контейнера реакций */
+    '--chotto-messagereactions-align-items': string;
+    /** Промежуток между элементами реакций */
+    '--chotto-messagereactions-gap': string;
+    /** Позиционирование контейнера реакций */
+    '--chotto-messagereactions-position': string;
+    /** Минимальная высота контейнера реакций */
+    '--chotto-messagereactions-min-height': string;
+    /** Z-index контейнера реакций */
+    '--chotto-messagereactions-z-index': string;
+    /** Позиционирование контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-position': string;
+    /** Отступ снизу контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-bottom': string;
+    /** Высота контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-height': string;
+    /** Ширина контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-width': string;
+    /** Переполнение контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-overflow': string;
+    /** Минимальная высота контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-min-height': string;
+    /** Внешние отступы контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-margin': string;
+    /** Внутренние отступы контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-padding': string;
+    /** Z-index контейнера реакций без реакций */
+    '--chotto-messagereactions-no-reactions-z-index': string;
+    /** Отступ справа для левых сообщений без реакций */
+    '--chotto-messagereactions-left-no-reactions-right': string;
+    /** Отступ слева для левых сообщений без реакций */
+    '--chotto-messagereactions-left-no-reactions-left': string;
+    /** Отступ слева для правых сообщений без реакций */
+    '--chotto-messagereactions-right-no-reactions-left': string;
+    /** Отступ справа для правых сообщений без реакций */
+    '--chotto-messagereactions-right-no-reactions-right': string;
+    /** Отображение чипа реакции */
+    '--chotto-messagereactions-chip-display': string;
+    /** Выравнивание элементов чипа реакции */
+    '--chotto-messagereactions-chip-align-items': string;
+    /** Промежуток между элементами чипа реакции */
+    '--chotto-messagereactions-chip-gap': string;
+    /** Граница чипа реакции */
+    '--chotto-messagereactions-chip-border': string;
+    /** Фон чипа реакции */
+    '--chotto-messagereactions-chip-bg': string;
+    /** Цвет текста чипа реакции */
+    '--chotto-messagereactions-chip-fg': string;
+    /** Скругление чипа реакции */
+    '--chotto-messagereactions-chip-border-radius': string;
+    /** Внутренние отступы чипа реакции */
+    '--chotto-messagereactions-chip-padding': string;
+    /** Размер шрифта чипа реакции */
+    '--chotto-messagereactions-chip-font-size': string;
+    /** Курсор чипа реакции */
+    '--chotto-messagereactions-chip-cursor': string;
+    /** Граница активного чипа реакции */
+    '--chotto-messagereactions-chip-active-border': string;
+    /** Фон активного чипа реакции */
+    '--chotto-messagereactions-chip-active-bg': string;
+    /** Толщина шрифта активного чипа реакции */
+    '--chotto-messagereactions-chip-active-font-weight': string;
+    /** Высота строки эмодзи реакции */
+    '--chotto-messagereactions-emoji-line-height': string;
+    /** Высота строки счётчика реакции */
+    '--chotto-messagereactions-count-line-height': string;
+    /** Отображение кнопки добавления реакции */
+    '--chotto-messagereactions-add-display': string;
+    /** Выравнивание элементов кнопки добавления реакции */
+    '--chotto-messagereactions-add-align-items': string;
+    /** Выравнивание содержимого кнопки добавления реакции */
+    '--chotto-messagereactions-add-justify-content': string;
+    /** Ширина кнопки добавления реакции */
+    '--chotto-messagereactions-add-width': string;
+    /** Высота кнопки добавления реакции */
+    '--chotto-messagereactions-add-height': string;
+    /** Скругление кнопки добавления реакции */
+    '--chotto-messagereactions-add-border-radius': string;
+    /** Граница кнопки добавления реакции */
+    '--chotto-messagereactions-add-border': string;
+    /** Фон кнопки добавления реакции */
+    '--chotto-messagereactions-add-bg': string;
+    /** Цвет кнопки добавления реакции */
+    '--chotto-messagereactions-add-color': string;
+    /** Курсор кнопки добавления реакции */
+    '--chotto-messagereactions-add-cursor': string;
+    /** Размер шрифта кнопки добавления реакции */
+    '--chotto-messagereactions-add-font-size': string;
+    /** Прозрачность кнопки добавления реакции */
+    '--chotto-messagereactions-add-opacity': string;
+    /** Переход кнопки добавления реакции */
+    '--chotto-messagereactions-add-transition': string;
+    /** События указателя кнопки добавления реакции */
+    '--chotto-messagereactions-add-pointer-events': string;
+    /** Позиционирование кнопки добавления реакции */
+    '--chotto-messagereactions-add-position': string;
+    /** Отступ снизу кнопки добавления реакции */
+    '--chotto-messagereactions-add-bottom': string;
+    /** Z-index кнопки добавления реакции */
+    '--chotto-messagereactions-add-z-index': string;
+    /** Отступ справа кнопки добавления реакции для левых сообщений */
+    '--chotto-messagereactions-add-left-right': string;
+    /** Отступ слева кнопки добавления реакции для левых сообщений */
+    '--chotto-messagereactions-add-left-left': string;
+    /** Отступ слева кнопки добавления реакции для правых сообщений */
+    '--chotto-messagereactions-add-right-left': string;
+    /** Отступ справа кнопки добавления реакции для правых сообщений */
+    '--chotto-messagereactions-add-right-right': string;
+    /** Позиционирование кнопки добавления реакции когда есть реакции */
+    '--chotto-messagereactions-add-has-reactions-position': string;
+    /** Отступ снизу кнопки добавления реакции когда есть реакции */
+    '--chotto-messagereactions-add-has-reactions-bottom': string;
+    /** Трансформация кнопки добавления реакции когда есть реакции */
+    '--chotto-messagereactions-add-has-reactions-transform': string;
+    /** Прозрачность кнопки добавления реакции когда есть чипы */
+    '--chotto-messagereactions-add-has-chip-opacity': string;
+    /** События указателя кнопки добавления реакции когда есть чипы */
+    '--chotto-messagereactions-add-has-chip-pointer-events': string;
+    /** Позиционирование панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-position': string;
+    /** Отступ сверху панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-top': string;
+    /** Отступ слева панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-left': string;
+    /** Внешний отступ сверху панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-margin-top': string;
+    /** Фон панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-bg': string;
+    /** Граница панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-border': string;
+    /** Скругление панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-border-radius': string;
+    /** Тень панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-box-shadow': string;
+    /** Внутренние отступы панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-padding': string;
+    /** Отображение панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-display': string;
+    /** Выравнивание элементов панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-align-items': string;
+    /** Промежуток между элементами панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-gap': string;
+    /** Z-index панели быстрых реакций */
+    '--chotto-messagereactions-quick-panel-z-index': string;
+    /** Отступ слева панели быстрых реакций для правых сообщений */
+    '--chotto-messagereactions-quick-panel-right-left': string;
+    /** Отступ справа панели быстрых реакций для правых сообщений */
+    '--chotto-messagereactions-quick-panel-right-right': string;
+    /** Отображение элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-display': string;
+    /** Выравнивание элементов элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-align-items': string;
+    /** Выравнивание содержимого элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-justify-content': string;
+    /** Ширина элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-width': string;
+    /** Высота элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-height': string;
+    /** Скругление элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-border-radius': string;
+    /** Граница элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-border': string;
+    /** Фон элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-bg': string;
+    /** Курсор элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-cursor': string;
+    /** Размер шрифта элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-font-size': string;
+    /** Переход элемента быстрой реакции */
+    '--chotto-messagereactions-quick-item-transition': string;
+    /** Фон элемента быстрой реакции при наведении */
+    '--chotto-messagereactions-quick-item-hover-bg': string;
+    /** Отображение кнопки развернуть */
+    '--chotto-messagereactions-expand-display': string;
+    /** Выравнивание элементов кнопки развернуть */
+    '--chotto-messagereactions-expand-align-items': string;
+    /** Выравнивание содержимого кнопки развернуть */
+    '--chotto-messagereactions-expand-justify-content': string;
+    /** Ширина кнопки развернуть */
+    '--chotto-messagereactions-expand-width': string;
+    /** Высота кнопки развернуть */
+    '--chotto-messagereactions-expand-height': string;
+    /** Скругление кнопки развернуть */
+    '--chotto-messagereactions-expand-border-radius': string;
+    /** Граница кнопки развернуть */
+    '--chotto-messagereactions-expand-border': string;
+    /** Фон кнопки развернуть */
+    '--chotto-messagereactions-expand-bg': string;
+    /** Курсор кнопки развернуть */
+    '--chotto-messagereactions-expand-cursor': string;
+    /** Размер шрифта кнопки развернуть */
+    '--chotto-messagereactions-expand-font-size': string;
+    /** Цвет кнопки развернуть */
+    '--chotto-messagereactions-expand-color': string;
+    /** Переход кнопки развернуть */
+    '--chotto-messagereactions-expand-transition': string;
+    /** Фон кнопки развернуть при наведении */
+    '--chotto-messagereactions-expand-hover-bg': string;
+    /** Высота строки span внутри кнопки развернуть */
+    '--chotto-messagereactions-expand-span-line-height': string;
+    /** Толщина шрифта span внутри кнопки развернуть */
+    '--chotto-messagereactions-expand-span-font-weight': string;
+    /** Z-index пикера реакций */
+    '--chotto-messagereactions-picker-z-index': string;
+    /** Позиционирование emoji picker внутри пикера */
+    '--chotto-messagereactions-picker-emoji-picker-position': string;
+    /** Z-index emoji picker внутри пикера */
+    '--chotto-messagereactions-picker-emoji-picker-z-index': string;
+    /** Переход появления/исчезновения попапа реакций */
+    '--chotto-messagereactions-popover-transition': string;
+    /** Прозрачность попапа реакций в начале */
+    '--chotto-messagereactions-popover-enter-from-opacity': string;
+    /** Трансформация попапа реакций в начале */
+    '--chotto-messagereactions-popover-enter-from-transform': string;
+}

package/dist/types/components/2_feed_elements/MessageReactions/utils/quickReactions.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Список популярных эмоджи для быстрых реакций
+ * Используется в MessageReactions
+ */
+export declare const QUICK_REACTION_EMOJIS: readonly ["👍", "❤️", "🔥", "😂", "😮", "😢"];
+export type QuickReactionEmoji = typeof QUICK_REACTION_EMOJIS[number];

package/dist/types/components/2_feed_elements/StickerMessage/StickerMessage.vue.d.ts

@@ -15,6 +15,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    reactionsEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     reply: (...args: any[]) => void;
     action: (...args: any[]) => void;
@@ -31,11 +35,16 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    reactionsEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onReply?: ((...args: any[]) => any) | undefined;
     onAction?: ((...args: any[]) => any) | undefined;
 }>, {
     applyStyle: Function;
     isFirstInSeries: boolean;
+    reactionsEnabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/types/components/2_feed_elements/TextMessage/TextMessage.vue.d.ts

@@ -12,6 +12,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    reactionsEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     reply: (...args: any[]) => void;
     action: (...args: any[]) => void;
@@ -28,11 +32,16 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    reactionsEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onReply?: ((...args: any[]) => any) | undefined;
     onAction?: ((...args: any[]) => any) | undefined;
 }>, {
     applyStyle: Function;
     isFirstInSeries: boolean;
+    reactionsEnabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/types/components/2_feed_elements/TextMessage/stories/TextMessage.stories.d.ts

@@ -4,44 +4,10 @@ declare const meta: Meta<typeof TextMessage>;
 export default meta;
 type Story = StoryObj<typeof TextMessage>;
 export declare const Default: Story;
-export declare const LeftMessage: Story;
-export declare const LeftMessageWithViews: Story;
-export declare const LeftMessageLongText: Story;
-export declare const LeftMessageWithSubtext: Story;
-export declare const LeftMessageWithoutTime: Story;
-export declare const LeftMessageWithActions: Story;
-export declare const LeftMessageWithAvatar: Story;
-export declare const LeftMessageWithLongTime: Story;
-export declare const RightMessage: Story;
-export declare const RightMessageWithViews: Story;
-export declare const RightMessageLongText: Story;
-export declare const RightMessageWithSubtext: Story;
-export declare const RightMessageWithoutTime: Story;
-export declare const RightMessageStatusSent: Story;
-export declare const RightMessageStatusReceived: Story;
-export declare const RightMessageStatusRead: Story;
-export declare const RightMessageStatusPending: Story;
-export declare const RightMessageStatusError: Story;
-export declare const RightMessageWithActions: Story;
-export declare const RightMessageWithAvatar: Story;
-export declare const RightMessageWithLongTime: Story;
+export declare const LeftMessages: Story;
+export declare const RightMessages: Story;
 export declare const LeftMessageMax: Story;
 export declare const RightMessageMax: Story;
-export declare const LeftMessageWithLink: Story;
-export declare const RightMessageWithLink: Story;
-export declare const LeftMessageWithReplyText: Story;
-export declare const RightMessageWithReplyText: Story;
-export declare const LeftMessageWithReplyImage: Story;
-export declare const RightMessageWithReplyImage: Story;
-export declare const LeftMessageWithReplyVideo: Story;
-export declare const RightMessageWithReplyVideo: Story;
-export declare const LeftMessageWithReplyFile: Story;
-export declare const RightMessageWithReplyFile: Story;
-export declare const LeftMessageWithReplyAudio: Story;
-export declare const RightMessageWithReplyAudio: Story;
-export declare const LeftMessageWithReplyCall: Story;
-export declare const RightMessageWithReplyCall: Story;
-export declare const LeftMessageWithPreviewLink: Story;
-export declare const RightMessageWithPreviewLink: Story;
-export declare const LeftMessageWithEmbed: Story;
-export declare const RightMessageWithEmbed: Story;
+export declare const MessagesWithLinks: Story;
+export declare const MessagesWithReply: Story;
+export declare const MessagesWithPreviewAndEmbed: Story;

package/dist/types/components/2_feed_elements/VideoMessage/VideoMessage.vue.d.ts

@@ -12,6 +12,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    reactionsEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     reply: (...args: any[]) => void;
     action: (...args: any[]) => void;
@@ -28,11 +32,16 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: BooleanConstructor;
         default: boolean;
     };
+    reactionsEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onReply?: ((...args: any[]) => any) | undefined;
     onAction?: ((...args: any[]) => any) | undefined;
 }>, {
     applyStyle: Function;
     isFirstInSeries: boolean;
+    reactionsEnabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/types/components/2_feed_elements/types/messages.d.ts

@@ -15,6 +15,51 @@ export interface ILinkPreview {
     url: string;
     description: string;
 }
+export type ReactionKey = string;
+export interface MessageReactionItem {
+    key: ReactionKey;
+    count: number;
+    reactedByMe?: boolean;
+}
+export interface MessageRecentReaction {
+    userId: string | number;
+    key: ReactionKey;
+    date?: number;
+}
+export interface MessageReactions {
+    items: MessageReactionItem[];
+    meta?: {
+        mode?: 'single' | 'multi';
+    };
+    recent?: MessageRecentReaction[];
+    vendor?: {
+        telegram?: {
+            total_count?: number;
+            recent_reactions?: Array<{
+                type: {
+                    type: string;
+                    emoji?: string;
+                };
+                actor?: {
+                    id?: number;
+                    is_bot?: boolean;
+                    first_name?: string;
+                };
+                date?: number;
+            }>;
+            counts?: Array<{
+                type: {
+                    type: string;
+                    emoji: string;
+                };
+                count: number;
+            }>;
+        };
+        whatsapp?: {
+            lastEventAt?: number;
+        };
+    };
+}
 export interface IKeyBoard {
     key: string;
     text: string;
@@ -42,6 +87,7 @@ export interface IAudioMessage {
     linkPreview?: ILinkPreview;
     embed?: object;
     keyboard?: IKeyBoard[];
+    reactions?: MessageReactions;
 }
 export interface ICallMessage {
     messageId: string;
@@ -58,6 +104,7 @@ export interface ICallMessage {
     transcript?: {
         dialog: IDialog[];
     };
+    reactions?: MessageReactions;
 }
 export interface IDateMessage {
     messageId?: string;
@@ -81,6 +128,7 @@ export interface IFileMessage {
     linkPreview?: ILinkPreview;
     embed?: object;
     keyboard?: IKeyBoard[];
+    reactions?: MessageReactions;
 }
 export interface IImageMessage {
     messageId: string;
@@ -100,6 +148,7 @@ export interface IImageMessage {
     linkPreview?: ILinkPreview;
     embed?: object;
     keyboard?: IKeyBoard[];
+    reactions?: MessageReactions;
 }
 export interface ISystemMessage {
     messageId: string;
@@ -121,6 +170,7 @@ export interface ITextMessage {
     linkPreview?: ILinkPreview;
     embed?: object;
     keyboard?: IKeyBoard[];
+    reactions?: MessageReactions;
 }
 export interface ITypingMessage {
     avatar?: string;
@@ -144,6 +194,7 @@ export interface IVideoMessage {
     linkPreview?: ILinkPreview;
     embed?: object;
     keyboard?: IKeyBoard[];
+    reactions?: MessageReactions;
 }
 export interface IStickerMessage {
     messageId: string;
@@ -164,4 +215,5 @@ export interface IStickerMessage {
     linkPreview?: ILinkPreview;
     embed?: object;
     keyboard?: IKeyBoard[];
+    reactions?: MessageReactions;
 }