@uzum-tech/ui 1.8.0 → 1.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
- import { h, defineComponent, computed, Fragment } from 'vue';
2
- import { MessageStatus } from './interface';
1
+ import { h, defineComponent, computed, inject, Fragment } from 'vue';
2
+ import { MessageStatus, ChatMessageType, ChatMarkType, chatInjectionKey } from './interface';
3
3
  import ChatAttachmentComponent from './ChatParts/ChatAttachment';
4
4
  import { UIcon } from '../../icon';
5
5
  import { USkeleton } from '../../skeleton';
@@ -53,10 +53,11 @@ export const chatMessagesProps = Object.assign(Object.assign({}, useTheme.props)
53
53
  export default defineComponent({
54
54
  name: 'ChatMessages',
55
55
  props: chatMessagesProps,
56
- emits: ['message-retry'],
57
- setup(props, { slots, emit }) {
56
+ setup(props, { slots }) {
57
+ var _a;
58
+ const UChat = inject(chatInjectionKey, null);
58
59
  const { mergedClsPrefixRef } = useConfig(props);
59
- const themeRef = useTheme('Chat', '-chat', style, chatLight, props, mergedClsPrefixRef);
60
+ const themeRef = (_a = UChat === null || UChat === void 0 ? void 0 : UChat.mergedThemeRef) !== null && _a !== void 0 ? _a : useTheme('Chat', '-chat', style, chatLight, props, mergedClsPrefixRef);
60
61
  const { localeRef } = useLocale('Chat');
61
62
  const cssVarsRef = computed(() => {
62
63
  const { common: { cubicBezierEaseInOut, brandPrimary500, staticGreen, staticRed, textPrimary, textSecondary, textTertiary }, self: { backgroundColor, borderColor, mainBackgroundColor, headerBackgroundColor, headerBorderColor, headerTitleColor, messageBubbleBackgroundColorOwn, messageBubbleBackgroundColorOther, messageBubbleTextColorOwn, messageBubbleTextColorOther, messageTimeColor, messageStatusColor, attachmentBackgroundColorOwn, attachmentBackgroundColorOther, unreadNotificationBackgroundColor, unreadNotificationTextColor, typingIndicatorColor, dateSeparatorColor, dateSeparatorBackgroundColor, borderRadius, errorColor } } = themeRef.value;
@@ -101,7 +102,6 @@ export default defineComponent({
101
102
  });
102
103
  const handleMessageRetry = (message) => {
103
104
  var _a;
104
- emit('message-retry', message);
105
105
  (_a = props.onMessageRetry) === null || _a === void 0 ? void 0 : _a.call(props, message);
106
106
  };
107
107
  const renderDateSeparator = (date) => {
@@ -117,6 +117,17 @@ export default defineComponent({
117
117
  " ",
118
118
  mergedUnreadNotificationTextRef.value)));
119
119
  };
120
+ const renderMarkMessage = (message) => {
121
+ const markTypeClass = message.markType === ChatMarkType.SYSTEM
122
+ ? 'system'
123
+ : message.markType === ChatMarkType.EVENT
124
+ ? 'event'
125
+ : 'divider';
126
+ return (h("div", { key: message.id, class: [
127
+ `${mergedClsPrefixRef.value}-chat-main__mark`,
128
+ `${mergedClsPrefixRef.value}-chat-main__mark--${markTypeClass}`
129
+ ] }, message.content && h("span", null, message.content)));
130
+ };
120
131
  const renderMessage = (message) => {
121
132
  const isOwn = message.isOwn;
122
133
  const attachments = message.attachment
@@ -157,7 +168,7 @@ export default defineComponent({
157
168
  ] }, message.status === MessageStatus.RETRY ? (h("div", { class: `${mergedClsPrefixRef.value}-chat-main__message-retry`, onClick: () => {
158
169
  handleMessageRetry(message);
159
170
  }, style: { cursor: 'pointer' } },
160
- h(UIcon, { size: 16, component: statusIconMapper[MessageStatus.RETRY], class: `${mergedClsPrefixRef.value}-chat-main__message-retry-icon` }),
171
+ h(UIcon, { size: 16, component: statusIconMapper[MessageStatus.RETRY], class: `${mergedClsPrefixRef.value}-chat-main__message-retry-icon`, theme: themeRef.value.peers.Icon, themeOverrides: themeRef.value.peerOverrides.Icon }),
161
172
  h("span", { class: `${mergedClsPrefixRef.value}-chat-main__message-retry-text` }, mergedRetryTextRef.value))) : (h(Fragment, null,
162
173
  h("span", { class: `${mergedClsPrefixRef.value}-chat-main__message-time` }, message.timestamp),
163
174
  isOwn && message.status && (h("div", { class: `${mergedClsPrefixRef.value}-chat-main__message-status` }, slots.messageStatus
@@ -165,7 +176,7 @@ export default defineComponent({
165
176
  : statusIconMapper[message.status] && (h(UIcon, { size: 16, component: statusIconMapper[message.status], class: [
166
177
  `${mergedClsPrefixRef.value}-chat-main__message-status-icon`,
167
178
  `${mergedClsPrefixRef.value}-chat-main__message-status-icon--${String(message.status)}`
168
- ] }))))))))));
179
+ ], theme: themeRef.value.peers.Icon, themeOverrides: themeRef.value.peerOverrides.Icon }))))))))));
169
180
  };
170
181
  const renderTypingIndicator = () => {
171
182
  return (h("div", { class: [
@@ -210,7 +221,9 @@ export default defineComponent({
210
221
  };
211
222
  return {
212
223
  mergedClsPrefixRef,
224
+ mergedTheme: themeRef,
213
225
  renderMessage,
226
+ renderMarkMessage,
214
227
  renderTypingIndicator,
215
228
  renderSkeletonMessage,
216
229
  renderDateSeparator,
@@ -223,7 +236,7 @@ export default defineComponent({
223
236
  render() {
224
237
  var _a, _b, _c;
225
238
  (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
226
- const { mergedClsPrefixRef, renderMessage, renderTypingIndicator, renderSkeletonMessage, renderDateSeparator, renderUnreadNotification } = this;
239
+ const { mergedClsPrefixRef, renderMessage, renderMarkMessage, renderTypingIndicator, renderSkeletonMessage, renderDateSeparator, renderUnreadNotification } = this;
227
240
  if (this.loading) {
228
241
  return (h("div", { class: [`${mergedClsPrefixRef}-chat`, this.themeClass], style: this.cssVars },
229
242
  h("div", { class: `${mergedClsPrefixRef}-chat-main`, style: {
@@ -301,7 +314,11 @@ export default defineComponent({
301
314
  if (item.type === 'unread-notification') {
302
315
  return renderUnreadNotification();
303
316
  }
304
- return renderMessage(item);
317
+ const message = item;
318
+ if (message.type === ChatMessageType.MARK) {
319
+ return renderMarkMessage(message);
320
+ }
321
+ return renderMessage(message);
305
322
  }),
306
323
  isTyping && renderTypingIndicator()))));
307
324
  }
@@ -24,7 +24,7 @@ const SENDING_DELAY = 100;
24
24
  export default defineComponent({
25
25
  name: 'ChatMainArea',
26
26
  setup(_, { slots }) {
27
- const { mergedClsPrefixRef, selectedChatRef, messagesRef, typingChatIdsRef, messagesLoadingRef, messagesLoadingCountRef, headerButtonPropsRef, headerIconPropsRef, messageUploadPropsRef, footerInputPropsRef, footerButtonPropsRef, footerUploadPropsRef, footerIconPropsRef, inputPlaceholderRef, retryTextRef, typingTextRef, closeButtonTextRef, unreadNotificationTextRef, notificationsShownSetRef, unreadCountsBeforeReadRef, markNotificationShown, handleMessageSend, handleMessageRetry, onChatClose, onChatShare, onUserProfile
27
+ const { mergedClsPrefixRef, mergedThemeRef, selectedChatRef, messagesRef, typingChatIdsRef, messagesLoadingRef, messagesLoadingCountRef, headerButtonPropsRef, headerIconPropsRef, messageUploadPropsRef, footerInputPropsRef, footerButtonPropsRef, footerUploadPropsRef, footerIconPropsRef, inputPlaceholderRef, retryTextRef, typingTextRef, closeButtonTextRef, unreadNotificationTextRef, notificationsShownSetRef, unreadCountsBeforeReadRef, markNotificationShown, handleMessageSend, handleMessageRetry, onChatClose, onChatShare, onUserProfile
28
28
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
29
29
  } = inject(chatInjectionKey);
30
30
  const messagesBodyRef = ref();
@@ -131,22 +131,22 @@ export default defineComponent({
131
131
  return (h("div", { class: `${mergedClsPrefixRef.value}-chat-main__header` },
132
132
  h(UFlex, { justify: "space-between", align: "flex-start" }, {
133
133
  default: () => (h(Fragment, null,
134
- h(UText, { variant: "heading-s-bold", class: `${mergedClsPrefixRef.value}-chat-main__header-title` }, {
134
+ h(UText, { variant: "heading-s-bold", class: `${mergedClsPrefixRef.value}-chat-main__header-title`, theme: mergedThemeRef.value.peers.Typography, themeOverrides: mergedThemeRef.value.peerOverrides.Typography }, {
135
135
  default: () => { var _a; return ((_a = selectedChatRef.value) === null || _a === void 0 ? void 0 : _a.title) || 'Select a chat'; }
136
136
  }),
137
137
  h(UFlex, { align: "center", size: "small", class: `${mergedClsPrefixRef.value}-chat-main__header-actions` }, {
138
138
  default: () => resolveSlot(slots.headerActions, () => [
139
- h(UButton, Object.assign({ secondary: true, circle: true, size: "large" }, headerButtonPropsRef.value, { onClick: () => { var _a; return (_a = onChatShare === null || onChatShare === void 0 ? void 0 : onChatShare.value) === null || _a === void 0 ? void 0 : _a.call(onChatShare); } }), {
140
- default: () => (h(UIcon, Object.assign({ size: 20 }, headerIconPropsRef.value), {
139
+ h(UButton, Object.assign({ secondary: true, circle: true, size: "large" }, headerButtonPropsRef.value, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides.Button, onClick: () => { var _a; return (_a = onChatShare === null || onChatShare === void 0 ? void 0 : onChatShare.value) === null || _a === void 0 ? void 0 : _a.call(onChatShare); } }), {
140
+ default: () => (h(UIcon, Object.assign({ size: 20 }, headerIconPropsRef.value, { theme: mergedThemeRef.value.peers.Icon, themeOverrides: mergedThemeRef.value.peerOverrides.Icon }), {
141
141
  default: () => h(ArrowHookUpRight, null)
142
142
  }))
143
143
  }),
144
- h(UButton, Object.assign({ secondary: true, circle: true, size: "large" }, headerButtonPropsRef.value, { onClick: () => { var _a; return (_a = onUserProfile === null || onUserProfile === void 0 ? void 0 : onUserProfile.value) === null || _a === void 0 ? void 0 : _a.call(onUserProfile); } }), {
145
- default: () => (h(UIcon, Object.assign({ size: 20 }, headerIconPropsRef.value), {
144
+ h(UButton, Object.assign({ secondary: true, circle: true, size: "large" }, headerButtonPropsRef.value, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides.Button, onClick: () => { var _a; return (_a = onUserProfile === null || onUserProfile === void 0 ? void 0 : onUserProfile.value) === null || _a === void 0 ? void 0 : _a.call(onUserProfile); } }), {
145
+ default: () => (h(UIcon, Object.assign({ size: 20 }, headerIconPropsRef.value, { theme: mergedThemeRef.value.peers.Icon, themeOverrides: mergedThemeRef.value.peerOverrides.Icon }), {
146
146
  default: () => h(PersonNote, null)
147
147
  }))
148
148
  }),
149
- h(UButton, Object.assign({ type: "primary", size: "large", round: true }, headerButtonPropsRef.value, { onClick: () => { var _a; return (_a = onChatClose === null || onChatClose === void 0 ? void 0 : onChatClose.value) === null || _a === void 0 ? void 0 : _a.call(onChatClose); } }), {
149
+ h(UButton, Object.assign({ type: "primary", size: "large", round: true }, headerButtonPropsRef.value, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides.Button, onClick: () => { var _a; return (_a = onChatClose === null || onChatClose === void 0 ? void 0 : onChatClose.value) === null || _a === void 0 ? void 0 : _a.call(onChatClose); } }), {
150
150
  default: () => closeButtonTextRef.value
151
151
  })
152
152
  ])
@@ -257,13 +257,13 @@ export default defineComponent({
257
257
  default: () => (h(UFlex, { align: "center", size: "small", class: `${mergedClsPrefixRef.value}-chat-main__input-container` }, {
258
258
  default: () => (h(Fragment, null,
259
259
  h(UUploadTrigger, { abstract: true }, {
260
- default: ({ handleClick }) => (h(UButton, Object.assign({ secondary: true, size: "large", class: `${mergedClsPrefixRef.value}-chat-main__attach-btn` }, footerButtonPropsRef.value, { onClick: handleClick }), {
261
- default: () => (h(UIcon, Object.assign({ size: 24 }, footerIconPropsRef.value), {
260
+ default: ({ handleClick }) => (h(UButton, Object.assign({ secondary: true, size: "large", class: `${mergedClsPrefixRef.value}-chat-main__attach-btn` }, footerButtonPropsRef.value, { theme: mergedThemeRef.value.peers.Button, themeOverrides: mergedThemeRef.value.peerOverrides.Button, onClick: handleClick }), {
261
+ default: () => (h(UIcon, Object.assign({ size: 24 }, footerIconPropsRef.value, { theme: mergedThemeRef.value.peers.Icon, themeOverrides: mergedThemeRef.value.peerOverrides.Icon }), {
262
262
  default: () => h(AttachIcon, null)
263
263
  }))
264
264
  }))
265
265
  }),
266
- h(UInput, Object.assign({ ref: "inputRef", value: inputValue.value, placeholder: inputPlaceholderRef.value, class: `${mergedClsPrefixRef.value}-chat-main__input` }, footerInputPropsRef.value, { onUpdateValue: (value) => {
266
+ h(UInput, Object.assign({ ref: "inputRef", value: inputValue.value, placeholder: inputPlaceholderRef.value, class: `${mergedClsPrefixRef.value}-chat-main__input` }, footerInputPropsRef.value, { theme: mergedThemeRef.value.peers.Input, themeOverrides: mergedThemeRef.value.peerOverrides.Input, onUpdateValue: (value) => {
267
267
  inputValue.value = value;
268
268
  if (selectedChatRef.value) {
269
269
  chatInputs.value[selectedChatRef.value.id] = value;
@@ -10,7 +10,7 @@ export default defineComponent({
10
10
  },
11
11
  render() {
12
12
  const { slots } = this;
13
- const { mergedClsPrefixRef, chatItemsRef, chatItemsLoadingRef, chatItemsLoadingCountRef, listEmptyPropsRef, selectedChatIdRef, typingChatIdsRef, typingTextRef, listItemAvatarPropsRef, listItemBadgePropsRef, notificationsShownSetRef, handleChatSelect
13
+ const { mergedClsPrefixRef, mergedThemeRef, chatItemsRef, chatItemsLoadingRef, chatItemsLoadingCountRef, listEmptyPropsRef, selectedChatIdRef, typingChatIdsRef, typingTextRef, listItemAvatarPropsRef, listItemBadgePropsRef, notificationsShownSetRef, handleChatSelect
14
14
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
15
15
  } = inject(chatInjectionKey);
16
16
  const renderListHeader = () => {
@@ -19,7 +19,7 @@ export default defineComponent({
19
19
  default: () => {
20
20
  var _a, _b;
21
21
  return (h(Fragment, null,
22
- h("div", { class: `${mergedClsPrefixRef.value}-chat-sidebar__header-main` }, ((_a = slots.sidebarHeaderMain) === null || _a === void 0 ? void 0 : _a.call(slots)) || (h(USelect, { round: true, size: "small" }))),
22
+ h("div", { class: `${mergedClsPrefixRef.value}-chat-sidebar__header-main` }, ((_a = slots.sidebarHeaderMain) === null || _a === void 0 ? void 0 : _a.call(slots)) || (h(USelect, { round: true, size: "tiny", theme: mergedThemeRef.value.peers.Select, themeOverrides: mergedThemeRef.value.peerOverrides.Select }))),
23
23
  h("div", { class: `${mergedClsPrefixRef.value}-chat-sidebar__header-actions` }, (_b = slots.sidebarHeaderActions) === null || _b === void 0 ? void 0 : _b.call(slots))));
24
24
  }
25
25
  })));
@@ -6,6 +6,8 @@ import type { IconProps } from '../../icon';
6
6
  import type { BadgeProps } from '../../badge';
7
7
  import { EmptyProps } from '../../empty';
8
8
  import { InputProps } from '../../input';
9
+ import type { ChatTheme } from '../styles';
10
+ import type { MergedTheme } from '../../_mixins';
9
11
  export declare enum MessageStatus {
10
12
  READ = "read",
11
13
  UNREAD = "unread",
@@ -69,6 +71,7 @@ export interface ChatMessageData {
69
71
  uploadProps?: Partial<UploadProps>;
70
72
  senderAvatar?: string | (() => VNodeChild);
71
73
  senderName?: string | (() => VNodeChild);
74
+ markType?: ChatMarkType;
72
75
  }
73
76
  export interface ChatMessageProps {
74
77
  id: ChatId;
@@ -241,6 +244,7 @@ export interface ChatListInst {
241
244
  }
242
245
  export declare const chatInjectionKey: InjectionKey<{
243
246
  mergedClsPrefixRef: Ref<string>;
247
+ mergedThemeRef: Ref<MergedTheme<ChatTheme>>;
244
248
  chatItemsRef: Ref<ChatListItemData[] | undefined>;
245
249
  selectedChatIdRef: Ref<ChatId | undefined>;
246
250
  selectedChatRef: Ref<ChatListItemData | undefined>;
@@ -4,7 +4,6 @@ export default cB('chat', `
4
4
  max-height: 100%;
5
5
  min-height: 0;
6
6
  display: flex;
7
- overflow: hidden;
8
7
  box-sizing: border-box;
9
8
  .u-list-item__text {
10
9
  grid-template-columns: 1fr !important;
@@ -13,7 +12,6 @@ export default cB('chat', `
13
12
  height: 100%;
14
13
  max-height: 100%;
15
14
  min-height: 0;
16
- overflow: hidden;
17
15
  }
18
16
  `, [cB('chat-sidebar', `
19
17
  max-width: 388px;
@@ -24,7 +22,6 @@ export default cB('chat', `
24
22
  background-color: var(--u-sidebar-background-color);
25
23
  border: 1px solid var(--u-sidebar-border-color);
26
24
  border-radius: 20px;
27
- overflow: hidden;
28
25
  `, [cE('header', `
29
26
  flex-shrink: 0;
30
27
  `), cE('header-container', `
@@ -138,7 +135,6 @@ export default cB('chat', `
138
135
  `), cE('item-status sup', `
139
136
  padding: 2px 6px 2px 5px;
140
137
  height: 22px;
141
- --u-color: var(--u-unread-notification-background-color);
142
138
  `), cE('item-status-icon', `
143
139
  color: var(--u-sidebar-item-time-color);
144
140
  `, [cM('read', `
@@ -160,7 +156,6 @@ export default cB('chat', `
160
156
  height: 100%;
161
157
  max-height: 100%;
162
158
  min-height: 0;
163
- overflow: hidden;
164
159
  `, [cE('header', `
165
160
  border-bottom: 1px solid var(--u-border-color);
166
161
  width: 100%;
@@ -176,7 +171,7 @@ export default cB('chat', `
176
171
  color: var(--u-unread-notification-text-color);
177
172
  padding: 6px 12px;
178
173
  text-align: center;
179
- font-size: 12px;
174
+ font-size: 14px;
180
175
  font-weight: 500;
181
176
  margin: 8px 0;
182
177
  display: flex;
@@ -210,8 +205,19 @@ export default cB('chat', `
210
205
  color: var(--u-date-separator-color);
211
206
  padding: 4px 12px;
212
207
  border-radius: 12px;
213
- font-size: 12px;
208
+ font-size: 14px;
214
209
  font-weight: 500;
210
+ `)]), cE('mark', `
211
+ display: flex;
212
+ justify-content: center;
213
+ margin: 12px 0;
214
+ width: 100%;
215
+ `, [c('span', `
216
+ padding: 6px 12px;
217
+ border-radius: 8px;
218
+ color: var(--u-text-color-secondary);
219
+ background-color: var(--u-date-separator-background-color);
220
+ text-align: center;
215
221
  `)]), cE('message', `
216
222
  display: flex;
217
223
  margin-bottom: 8px;
@@ -327,13 +333,6 @@ export default cB('chat', `
327
333
  `), cE('input', `
328
334
  flex: 1;
329
335
  margin-right: 4px;
330
- --u-color: #F3F4F6 !important;
331
- --u-color-focus: #F3F4F6 !important;
332
- --u-border: none !important;
333
- --u-border-focus: none !important;
334
- --u-border-hover: none !important;
335
- --u-box-shadow: none !important;
336
- --u-box-shadow-focus: none !important;
337
336
  `), cE('attach-btn', `
338
337
  margin-left: 4px;
339
338
  flex-shrink: 0;
@@ -35,7 +35,6 @@ export declare const self: (vars: ThemeCommonVars) => {
35
35
  borderRadius: string;
36
36
  errorColor: string;
37
37
  };
38
- export type ChatThemeVars = ReturnType<typeof self>;
39
38
  declare const chatLight: import("../../_mixins").Theme<"Chat", {
40
39
  backgroundColor: string;
41
40
  borderColor: string;
@@ -686,4 +685,5 @@ declare const chatLight: import("../../_mixins").Theme<"Chat", {
686
685
  }, any>;
687
686
  }>;
688
687
  export default chatLight;
688
+ export type ChatThemeVars = ReturnType<typeof self>;
689
689
  export type ChatTheme = typeof chatLight;
@@ -1,14 +1,26 @@
1
1
  import { inputLight } from '../../input/styles';
2
+ import { self as inputSelf } from '../../input/styles/light';
2
3
  import { emptyLight } from '../../empty/styles';
3
4
  import { selectLight } from '../../select/styles';
4
5
  import { avatarLight } from '../../avatar/styles';
5
6
  import { badgeLight } from '../../badge/styles';
7
+ import { self as badgeSelf } from '../../badge/styles/light';
6
8
  import { buttonLight } from '../../button/styles';
7
9
  import { iconLight } from '../../icon/styles';
8
10
  import { listLight } from '../../list/styles';
9
11
  import { typographyLight } from '../../typography/styles';
10
12
  import { commonLight } from '../../_styles/common';
11
13
  import { createTheme } from '../../_mixins';
14
+ const chatInputLight = Object.assign(Object.assign({}, inputLight), { self(vars) {
15
+ const originalInputSelf = inputSelf(vars);
16
+ const { elementsTertiary } = vars;
17
+ return Object.assign(Object.assign({}, originalInputSelf), { color: elementsTertiary, colorFocus: elementsTertiary, border: 'none', borderFocus: 'none', borderHover: 'none', boxShadow: 'none', boxShadowFocus: 'none' });
18
+ } });
19
+ const chatBadgeLight = Object.assign(Object.assign({}, badgeLight), { self(vars) {
20
+ const originalBadgeSelf = badgeSelf(vars);
21
+ const { brandPrimary400, elementsSecondary } = vars;
22
+ return Object.assign(Object.assign({}, originalBadgeSelf), { color: brandPrimary400, textColor: elementsSecondary });
23
+ } });
12
24
  export const self = (vars) => {
13
25
  const { borderRadiusLarge, elementsQuaternary, elementsTertiary, textTertiary, textPrimary, textSecondary, surfacePrimary, brandPrimary500, brandPrimary400, transparencySecondary, elementsSecondary, elementsDarkQuinary, staticRed, staticWhite } = vars;
14
26
  return {
@@ -43,7 +55,7 @@ export const self = (vars) => {
43
55
  unreadNotificationTextColor: elementsSecondary,
44
56
  typingIndicatorColor: textSecondary,
45
57
  dateSeparatorColor: textTertiary,
46
- dateSeparatorBackgroundColor: elementsTertiary,
58
+ dateSeparatorBackgroundColor: 'transparent',
47
59
  borderRadius: borderRadiusLarge,
48
60
  errorColor: staticRed
49
61
  };
@@ -52,11 +64,11 @@ const chatLight = createTheme({
52
64
  name: 'Chat',
53
65
  common: commonLight,
54
66
  peers: {
55
- Input: inputLight,
67
+ Input: chatInputLight,
56
68
  Empty: emptyLight,
57
69
  Select: selectLight,
58
70
  Avatar: avatarLight,
59
- Badge: badgeLight,
71
+ Badge: chatBadgeLight,
60
72
  Button: buttonLight,
61
73
  Icon: iconLight,
62
74
  List: listLight,
package/es/version.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- declare const _default: "1.8.0";
1
+ declare const _default: "1.8.1";
2
2
  export default _default;
package/es/version.js CHANGED
@@ -1 +1 @@
1
- export default '1.8.0';
1
+ export default '1.8.1';
@@ -1,6 +1,7 @@
1
1
  export { default as UChat } from './src/Chat';
2
2
  export { default as UChatListItems } from './src/ChatListItems';
3
3
  export { default as UChatMessages } from './src/ChatMessages';
4
- export type { ChatId, MessageStatus, ChatMessageType, ChatMarkType, ChatProps, ChatListItemProps, ChatMessageProps, ChatMarkProps, ChatHeaderProps, ChatFooterProps, ChatListHeaderProps, ChatSlots, ChatListItemSlots, ChatMessageSlots, ChatMarkSlots, ChatHeaderSlots, ChatFooterSlots, ChatListItemData, ChatMessageData, ChatAttachment, OnChatSelect, OnMessageSend, OnAttachmentUpload, OnFilterChange, OnLoadMoreChats, OnNetworkError, OnUploadError, OnSendError, ChatInst, ChatListInst, chatInjectionKey } from './src/interface';
4
+ export type { ChatId, ChatProps, ChatListItemProps, ChatMessageProps, ChatMarkProps, ChatHeaderProps, ChatFooterProps, ChatListHeaderProps, ChatSlots, ChatListItemSlots, ChatMessageSlots, ChatMarkSlots, ChatHeaderSlots, ChatFooterSlots, ChatListItemData, ChatMessageData, ChatAttachment, OnChatSelect, OnMessageSend, OnAttachmentUpload, OnFilterChange, OnLoadMoreChats, OnNetworkError, OnUploadError, OnSendError, ChatInst, ChatListInst, chatInjectionKey } from './src/interface';
5
+ export { MessageStatus, ChatMessageType, ChatMarkType } from './src/interface';
5
6
  export type { ChatListItemsProps } from './src/ChatListItems';
6
7
  export type { ChatMessagesProps } from './src/ChatMessages';
package/lib/chat/index.js CHANGED
@@ -3,10 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.UChatMessages = exports.UChatListItems = exports.UChat = void 0;
6
+ exports.ChatMarkType = exports.ChatMessageType = exports.MessageStatus = exports.UChatMessages = exports.UChatListItems = exports.UChat = void 0;
7
7
  var Chat_1 = require("./src/Chat");
8
8
  Object.defineProperty(exports, "UChat", { enumerable: true, get: function () { return __importDefault(Chat_1).default; } });
9
9
  var ChatListItems_1 = require("./src/ChatListItems");
10
10
  Object.defineProperty(exports, "UChatListItems", { enumerable: true, get: function () { return __importDefault(ChatListItems_1).default; } });
11
11
  var ChatMessages_1 = require("./src/ChatMessages");
12
12
  Object.defineProperty(exports, "UChatMessages", { enumerable: true, get: function () { return __importDefault(ChatMessages_1).default; } });
13
+ var interface_1 = require("./src/interface");
14
+ Object.defineProperty(exports, "MessageStatus", { enumerable: true, get: function () { return interface_1.MessageStatus; } });
15
+ Object.defineProperty(exports, "ChatMessageType", { enumerable: true, get: function () { return interface_1.ChatMessageType; } });
16
+ Object.defineProperty(exports, "ChatMarkType", { enumerable: true, get: function () { return interface_1.ChatMarkType; } });
@@ -323,6 +323,7 @@ exports.default = (0, vue_1.defineComponent)({
323
323
  const mergedUnreadNotificationTextRef = (0, vue_1.computed)(() => { var _a; return (_a = props.unreadNotificationText) !== null && _a !== void 0 ? _a : localeRef.value.unreadNotificationText; });
324
324
  (0, vue_1.provide)(interface_1.chatInjectionKey, {
325
325
  mergedClsPrefixRef,
326
+ mergedThemeRef: themeRef,
326
327
  chatItemsRef: (0, vue_1.toRef)(props, 'chatItems'),
327
328
  selectedChatIdRef: mergedSelectedChatIdRef,
328
329
  selectedChatRef,