mr-chat-bird 1.0.5 → 1.0.7

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.
package/dist/index.css CHANGED
@@ -1,12 +1,188 @@
1
- /* src/components/ChatUserList/ChatUserList.module.css */
2
- .chatWrapper {
1
+ /* src/components/RichTextEditor/RichTextEditor.css */
2
+ .mrchat-richTextEditorContainer {
3
+ position: relative;
4
+ border-radius: 16px;
5
+ }
6
+ .mrchat-richTextEditorContainer .mantine-RichTextEditor-toolbar {
7
+ border: none;
8
+ background-color: transparent;
9
+ padding: 0;
10
+ margin-bottom: 4px;
11
+ margin-left: 3px;
12
+ gap: 0.5rem;
13
+ }
14
+ .mrchat-richTextEditorContainer .emoji-big {
15
+ font-size: 18px;
16
+ line-height: 1;
17
+ vertical-align: middle;
18
+ display: inline-block;
19
+ }
20
+ .mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography {
21
+ font-size: 15px;
22
+ }
23
+ .mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography,
24
+ .mrchat-richTextEditorContainer .mantine-RichTextEditor-content {
25
+ border-radius: 16px;
26
+ min-height: 41px;
27
+ max-height: 200px;
28
+ overflow: scroll;
29
+ }
30
+ .mrchat-richTextEditorContainer .ProseMirror {
31
+ padding: 12px 16px 4px;
32
+ }
33
+ .mrchat-mainActionContainer {
34
+ height: 24px;
35
+ margin-bottom: 4px;
36
+ }
37
+ .mrchat-mainActionAddIcon {
38
+ margin-left: 3px;
39
+ }
40
+ .mrchat-mainActionEmojiIcon {
41
+ margin: 0 4px 0 3px;
42
+ }
43
+ .mrchat-mainActionEmojiIcon svg {
44
+ padding: 2.3px;
45
+ }
46
+ .mrchat-mainActionAddIcon svg,
47
+ .mrchat-mainTextFormatIcon svg,
48
+ .mrchat-mainActionEmojiIcon svg {
49
+ fill: #495057;
50
+ }
51
+ .mrchat-mainTextFormatIcon svg {
52
+ position: relative;
53
+ top: 1.2px;
54
+ }
55
+ .mrchat-mainSendMsgIcon {
56
+ position: absolute;
57
+ right: 6px;
58
+ }
59
+ .mrchat-customToolActionItem {
60
+ background-color: var(--mantine-color-white);
61
+ border-color: var(--mantine-color-gray-4);
62
+ color: var(--mantine-color-gray-7);
63
+ border-radius: 0px;
64
+ height: 26px;
65
+ min-height: 26px;
66
+ border-right: none;
67
+ }
68
+ .mrchat-mainAddLabels {
69
+ font-size: 15px;
70
+ }
71
+ .mrchat-mainAddLabels svg {
72
+ width: 19px;
73
+ height: 19px;
74
+ }
75
+ @media (max-width: 950px) {
76
+ .mrchat-secondRichTextEditorToolBar {
77
+ display: none;
78
+ }
79
+ }
80
+
81
+ /* src/components/UserProfile/UserProfileDrawer.css */
82
+ .mrchat-overlay {
83
+ position: absolute;
84
+ inset: 0;
85
+ background: rgba(0, 0, 0, 0.3);
86
+ z-index: 50;
87
+ }
88
+ .mrchat-drawer {
89
+ position: absolute;
90
+ top: 0;
91
+ right: 0;
92
+ width: 100%;
93
+ max-width: 400px;
94
+ height: 100%;
95
+ background: #fff;
96
+ display: flex;
97
+ flex-direction: column;
98
+ }
99
+ .mrchat-open {
100
+ animation: slideIn 0.25s ease forwards;
101
+ }
102
+ .mrchat-close {
103
+ animation: slideOut 0.25s ease forwards;
104
+ }
105
+ @keyframes slideIn {
106
+ from {
107
+ transform: translateX(100%);
108
+ }
109
+ to {
110
+ transform: translateX(0);
111
+ }
112
+ }
113
+ @keyframes slideOut {
114
+ from {
115
+ transform: translateX(0);
116
+ }
117
+ to {
118
+ transform: translateX(100%);
119
+ }
120
+ }
121
+ .mrchat-header {
122
+ height: 60px;
123
+ display: flex;
124
+ align-items: center;
125
+ gap: 15px;
126
+ padding: 0 16px;
127
+ border-bottom: 1px solid #eee;
128
+ }
129
+ .mrchat-backBtn {
130
+ cursor: pointer;
131
+ display: flex;
132
+ align-items: center;
133
+ }
134
+ .mrchat-profileSection {
135
+ padding: 30px 20px;
136
+ border-bottom: 1px solid #f0f0f0;
137
+ display: flex;
138
+ flex-direction: column;
139
+ align-items: center;
140
+ text-align: center;
141
+ }
142
+ .mrchat-actions {
143
+ padding: 10px;
144
+ }
145
+ .mrchat-item {
146
+ display: flex;
147
+ align-items: center;
148
+ gap: 12px;
149
+ padding: 14px;
150
+ border-radius: 10px;
151
+ cursor: pointer;
152
+ }
153
+ .mrchat-item:hover {
154
+ background: #f5f5f5;
155
+ }
156
+ .mrchat-itemDanger {
157
+ color: #fa5252;
158
+ }
159
+ .mrchat-itemDanger:hover {
160
+ background: rgba(250, 82, 82, 0.1);
161
+ }
162
+ .mrchat-imagePreview {
163
+ position: fixed;
164
+ inset: 0;
165
+ background: black;
166
+ z-index: 100;
167
+ display: flex;
168
+ justify-content: center;
169
+ align-items: center;
170
+ }
171
+ .mrchat-imagePreview img {
172
+ max-width: 90%;
173
+ max-height: 90%;
174
+ border-radius: 12px;
175
+ }
176
+
177
+ /* src/components/ChatUserList/ChatUserList.css */
178
+ .mrchat-chatWrapper {
3
179
  display: flex;
4
180
  flex-direction: column;
5
181
  align-items: center;
6
182
  height: 100vh;
7
183
  background: #f1f3f5;
8
184
  }
9
- .chatContainer {
185
+ .mrchat-chatContainer {
10
186
  display: flex;
11
187
  width: 100%;
12
188
  max-width: 1260px;
@@ -15,7 +191,7 @@
15
191
  border-radius: 8px;
16
192
  overflow: hidden;
17
193
  }
18
- .sidebar {
194
+ .mrchat-sidebar {
19
195
  width: 280px;
20
196
  display: flex;
21
197
  flex-direction: column;
@@ -25,75 +201,75 @@
25
201
  padding-top: 12px;
26
202
  }
27
203
  @media (max-width: 760px) {
28
- .sidebar {
204
+ .mrchat-sidebar {
29
205
  width: 180px;
30
206
  }
31
207
  }
32
- .sidebarTop {
208
+ .mrchat-sidebarTop {
33
209
  padding: 0 12px;
34
210
  }
35
- .topBar {
211
+ .mrchat-topBar {
36
212
  display: flex;
37
213
  justify-content: space-between;
38
214
  align-items: center;
39
215
  }
40
- .topActions {
216
+ .mrchat-topActions {
41
217
  display: flex;
42
218
  align-items: center;
43
219
  gap: 10px;
44
220
  }
45
- .scrollWrapper {
221
+ .mrchat-scrollWrapper {
46
222
  flex: 1;
47
223
  min-height: 0;
48
224
  overflow: hidden;
49
225
  }
50
- .scrollArea {
226
+ .mrchat-scrollArea {
51
227
  flex: 1;
52
228
  height: 100%;
53
229
  overflow-y: auto;
54
230
  }
55
- .scrollArea :global(.mantine-ScrollArea-content) {
231
+ .mrchat-scrollArea .mantine-ScrollArea-content {
56
232
  padding-bottom: 60px;
57
233
  }
58
- .avatar {
234
+ .mrchat-avatar {
59
235
  width: 34px;
60
236
  height: 34px;
61
237
  border-radius: 50%;
62
238
  object-fit: cover;
63
239
  }
64
- .mainArea {
240
+ .mrchat-mainArea {
65
241
  flex: 1;
66
242
  display: flex;
67
243
  flex-direction: column;
68
244
  }
69
- .messageArea {
245
+ .mrchat-messageArea {
70
246
  flex: 1;
71
247
  padding: 16px;
72
248
  overflow-y: auto;
73
249
  padding-bottom: 10px;
74
250
  }
75
- .messageBubble {
251
+ .mrchat-messageBubble {
76
252
  max-width: fit-content;
77
253
  padding: 8px 45px 8px 16px;
78
254
  margin-bottom: 8px;
79
255
  position: relative;
80
256
  }
81
- .outgoing {
257
+ .mrchat-outgoing {
82
258
  color: white;
83
259
  background-color: #366ca4;
84
260
  margin-left: auto;
85
261
  }
86
- .incoming {
262
+ .mrchat-incoming {
87
263
  background-color: #eeeeee;
88
264
  margin-right: auto;
89
265
  }
90
- .inputBar {
266
+ .mrchat-inputBar {
91
267
  display: flex;
92
268
  align-items: end;
93
269
  gap: 8px;
94
270
  padding: 0px 16px 16px;
95
271
  }
96
- .chatItem {
272
+ .mrchat-chatItem {
97
273
  display: flex;
98
274
  align-items: center;
99
275
  gap: 6px;
@@ -103,13 +279,13 @@
103
279
  margin: 2px 4px;
104
280
  border-radius: 6px;
105
281
  }
106
- .chatItem:hover {
282
+ .mrchat-chatItem:hover {
107
283
  background-color: #f6f6f6;
108
284
  }
109
- .chatLabelItem {
285
+ .mrchat-chatLabelItem {
110
286
  font-size: 15px;
111
287
  }
112
- .chatHeader {
288
+ .mrchat-chatHeader {
113
289
  display: flex;
114
290
  justify-content: space-between;
115
291
  align-items: center;
@@ -121,19 +297,19 @@
121
297
  z-index: 2;
122
298
  min-height: 63px;
123
299
  }
124
- .receiverInfo {
300
+ .mrchat-receiverInfo {
125
301
  display: flex;
126
302
  align-items: center;
127
303
  gap: 12px;
128
304
  cursor: pointer;
129
305
  }
130
- .emptyState {
306
+ .mrchat-emptyState {
131
307
  height: 100%;
132
308
  display: flex;
133
309
  align-items: center;
134
310
  justify-content: center;
135
311
  }
136
- .encryptionMinimal {
312
+ .mrchat-encryptionMinimal {
137
313
  display: flex;
138
314
  align-items: center;
139
315
  gap: 6px;
@@ -143,28 +319,28 @@
143
319
  color: #666;
144
320
  font-size: 12px;
145
321
  }
146
- .encryptionText {
322
+ .mrchat-encryptionText {
147
323
  font-size: 16px;
148
324
  color: #666;
149
325
  margin-left: 3px;
150
326
  }
151
- .messageContent {
327
+ .mrchat-messageContent {
152
328
  max-width: 370px;
153
329
  word-wrap: break-word;
154
330
  font-size: 14px;
155
331
  }
156
- .messagePreviewContent p,
157
- .messageContent p {
332
+ .mrchat-messagePreviewContent p,
333
+ .mrchat-messageContent p {
158
334
  margin: 0;
159
335
  padding: 0;
160
336
  }
161
- .activeChatItem {
337
+ .mrchat-activeChatItem {
162
338
  background-color: #eee;
163
339
  }
164
- .chatItem:hover {
340
+ .mrchat-chatItem:hover {
165
341
  background-color: #eee;
166
342
  }
167
- .messageTime {
343
+ .mrchat-messageTime {
168
344
  font-size: 11px;
169
345
  opacity: 0.6;
170
346
  text-align: right;
@@ -174,28 +350,28 @@
174
350
  right: 8px;
175
351
  z-index: 1;
176
352
  }
177
- .dateSeparator {
353
+ .mrchat-dateSeparator {
178
354
  text-align: center;
179
355
  font-size: 13px;
180
356
  margin: 12px 0;
181
357
  color: #888;
182
358
  }
183
- .chatInfo {
359
+ .mrchat-chatInfo {
184
360
  width: 100%;
185
361
  position: relative;
186
362
  }
187
- .messagePreview {
363
+ .mrchat-messagePreview {
188
364
  display: flex;
189
365
  justify-content: space-between;
190
366
  align-items: end;
191
367
  margin-top: 1px;
192
368
  }
193
- .messagePreviewTime {
369
+ .mrchat-messagePreviewTime {
194
370
  position: relative;
195
371
  top: 1px;
196
372
  right: 0;
197
373
  }
198
- .unreadBadge {
374
+ .mrchat-unreadBadge {
199
375
  background: #366ca4;
200
376
  color: white;
201
377
  font-size: 10px;
@@ -207,182 +383,7 @@
207
383
  top: 1px;
208
384
  right: 0px;
209
385
  }
210
- .messagePreviewContent {
386
+ .mrchat-messagePreviewContent {
211
387
  font-size: 14px;
212
388
  }
213
-
214
- /* src/components/RichTextEditor/RichTextEditor.module.css */
215
- .richTextEditorContainer {
216
- position: relative;
217
- border-radius: 16px;
218
- }
219
- .richTextEditorContainer :global(.mantine-RichTextEditor-toolbar) {
220
- border: none;
221
- background-color: transparent;
222
- padding: 0;
223
- margin-bottom: 4px;
224
- margin-left: 3px;
225
- gap: 0.5rem;
226
- }
227
- .richTextEditorContainer :global(.emoji-big) {
228
- font-size: 18px;
229
- line-height: 1;
230
- vertical-align: middle;
231
- display: inline-block;
232
- }
233
- .richTextEditorContainer :global(.mantine-RichTextEditor-Typography) {
234
- font-size: 15px;
235
- }
236
- .richTextEditorContainer :global(.mantine-RichTextEditor-Typography),
237
- .richTextEditorContainer :global(.mantine-RichTextEditor-content) {
238
- border-radius: 16px;
239
- min-height: 41px;
240
- max-height: 200px;
241
- overflow: scroll;
242
- }
243
- .richTextEditorContainer :global(.ProseMirror) {
244
- padding: 12px 16px 4px;
245
- }
246
- .mainActionContainer {
247
- height: 24px;
248
- margin-bottom: 4px;
249
- }
250
- .mainActionAddIcon {
251
- margin-left: 3px;
252
- }
253
- .mainActionEmojiIcon {
254
- margin: 0 4px 0 3px;
255
- }
256
- .mainActionEmojiIcon svg {
257
- padding: 2.3px;
258
- }
259
- .mainActionAddIcon svg,
260
- .mainTextFormatIcon svg,
261
- .mainActionEmojiIcon svg {
262
- fill: #495057;
263
- }
264
- .mainTextFormatIcon svg {
265
- position: relative;
266
- top: 1.2px;
267
- }
268
- .mainSendMsgIcon {
269
- position: absolute;
270
- right: 6px;
271
- }
272
- .customToolActionItem {
273
- background-color: var(--mantine-color-white);
274
- border-color: var(--mantine-color-gray-4);
275
- color: var(--mantine-color-gray-7);
276
- border-radius: 0px;
277
- height: 26px;
278
- min-height: 26px;
279
- border-right: none;
280
- }
281
- .mainAddLabels {
282
- font-size: 15px;
283
- }
284
- .mainAddLabels :global(svg) {
285
- width: 19px;
286
- height: 19px;
287
- }
288
- @media (max-width: 950px) {
289
- .secondRichTextEditorToolBar {
290
- display: none;
291
- }
292
- }
293
-
294
- /* src/components/UserProfile/UserProfileDrawer.module.css */
295
- .overlay {
296
- position: absolute;
297
- inset: 0;
298
- background: rgba(0, 0, 0, 0.3);
299
- z-index: 50;
300
- }
301
- .drawer {
302
- position: absolute;
303
- top: 0;
304
- right: 0;
305
- width: 100%;
306
- max-width: 400px;
307
- height: 100%;
308
- background: #fff;
309
- display: flex;
310
- flex-direction: column;
311
- }
312
- .open {
313
- animation: slideIn 0.25s ease forwards;
314
- }
315
- .close {
316
- animation: slideOut 0.25s ease forwards;
317
- }
318
- @keyframes slideIn {
319
- from {
320
- transform: translateX(100%);
321
- }
322
- to {
323
- transform: translateX(0);
324
- }
325
- }
326
- @keyframes slideOut {
327
- from {
328
- transform: translateX(0);
329
- }
330
- to {
331
- transform: translateX(100%);
332
- }
333
- }
334
- .header {
335
- height: 60px;
336
- display: flex;
337
- align-items: center;
338
- gap: 15px;
339
- padding: 0 16px;
340
- border-bottom: 1px solid #eee;
341
- }
342
- .backBtn {
343
- cursor: pointer;
344
- display: flex;
345
- align-items: center;
346
- }
347
- .profileSection {
348
- padding: 30px 20px;
349
- border-bottom: 1px solid #f0f0f0;
350
- display: flex;
351
- flex-direction: column;
352
- align-items: center;
353
- text-align: center;
354
- }
355
- .actions {
356
- padding: 10px;
357
- }
358
- .item {
359
- display: flex;
360
- align-items: center;
361
- gap: 12px;
362
- padding: 14px;
363
- border-radius: 10px;
364
- cursor: pointer;
365
- }
366
- .item:hover {
367
- background: #f5f5f5;
368
- }
369
- .itemDanger {
370
- color: #fa5252;
371
- }
372
- .itemDanger:hover {
373
- background: rgba(250, 82, 82, 0.1);
374
- }
375
- .imagePreview {
376
- position: fixed;
377
- inset: 0;
378
- background: black;
379
- z-index: 100;
380
- display: flex;
381
- justify-content: center;
382
- align-items: center;
383
- }
384
- .imagePreview img {
385
- max-width: 90%;
386
- max-height: 90%;
387
- border-radius: 12px;
388
- }
389
+ /*# sourceMappingURL=index.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/RichTextEditor/RichTextEditor.css","../src/components/UserProfile/UserProfileDrawer.css","../src/components/ChatUserList/ChatUserList.css"],"sourcesContent":[".mrchat-richTextEditorContainer {\n position: relative;\n border-radius: 16px;\n}\n\n.mrchat-richTextEditorContainer .mantine-RichTextEditor-toolbar {\n border: none;\n background-color: transparent;\n padding: 0;\n margin-bottom: 4px;\n margin-left: 3px;\n gap: 0.5rem;\n}\n\n.mrchat-richTextEditorContainer .emoji-big {\n font-size: 18px;\n line-height: 1;\n vertical-align: middle;\n display: inline-block;\n}\n\n.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography {\n font-size: 15px;\n}\n\n.mrchat-richTextEditorContainer .mantine-RichTextEditor-Typography,\n.mrchat-richTextEditorContainer .mantine-RichTextEditor-content {\n border-radius: 16px;\n min-height: 41px;\n max-height: 200px;\n overflow: scroll;\n}\n\n.mrchat-richTextEditorContainer .ProseMirror {\n padding: 12px 16px 4px;\n}\n\n.mrchat-mainActionContainer {\n height: 24px;\n margin-bottom: 4px;\n}\n\n.mrchat-mainActionAddIcon {\n margin-left: 3px;\n}\n\n.mrchat-mainActionEmojiIcon {\n margin: 0 4px 0 3px;\n}\n\n.mrchat-mainActionEmojiIcon svg {\n padding: 2.3px;\n}\n\n.mrchat-mainActionAddIcon svg,\n.mrchat-mainTextFormatIcon svg,\n.mrchat-mainActionEmojiIcon svg {\n fill: #495057;\n}\n\n.mrchat-mainTextFormatIcon svg {\n position: relative;\n top: 1.2px;\n}\n\n.mrchat-mainSendMsgIcon {\n position: absolute;\n right: 6px;\n}\n\n.mrchat-customToolActionItem {\n background-color: var(--mantine-color-white);\n border-color: var(--mantine-color-gray-4);\n color: var(--mantine-color-gray-7);\n border-radius: 0px;\n height: 26px;\n min-height: 26px;\n border-right: none;\n}\n\n.mrchat-mainAddLabels {\n font-size: 15px;\n}\n\n.mrchat-mainAddLabels svg {\n width: 19px;\n height: 19px;\n}\n\n@media (max-width: 950px) {\n .mrchat-secondRichTextEditorToolBar {\n display: none;\n }\n}\n","/* Overlay */\n.mrchat-overlay {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.3);\n z-index: 50;\n}\n\n/* Drawer */\n.mrchat-drawer {\n position: absolute;\n top: 0;\n right: 0;\n width: 100%;\n max-width: 400px;\n height: 100%;\n background: #fff;\n\n display: flex;\n flex-direction: column;\n}\n\n/* Animations */\n.mrchat-open {\n animation: slideIn 0.25s ease forwards;\n}\n\n.mrchat-close {\n animation: slideOut 0.25s ease forwards;\n}\n\n@keyframes slideIn {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes slideOut {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n\n/* Header */\n.mrchat-header {\n height: 60px;\n display: flex;\n align-items: center;\n gap: 15px;\n padding: 0 16px;\n border-bottom: 1px solid #eee;\n}\n\n.mrchat-backBtn {\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n\n/* Profile */\n.mrchat-profileSection {\n padding: 30px 20px;\n border-bottom: 1px solid #f0f0f0;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n}\n\n/* Actions */\n.mrchat-actions {\n padding: 10px;\n}\n\n.mrchat-item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 14px;\n border-radius: 10px;\n cursor: pointer;\n}\n\n.mrchat-item:hover {\n background: #f5f5f5;\n}\n\n/* RED actions */\n.mrchat-itemDanger {\n color: #fa5252;\n}\n\n.mrchat-itemDanger:hover {\n background: rgba(250, 82, 82, 0.1);\n}\n\n/* Image Preview */\n.mrchat-imagePreview {\n position: fixed;\n inset: 0;\n background: black;\n z-index: 100;\n\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.mrchat-imagePreview img {\n max-width: 90%;\n max-height: 90%;\n border-radius: 12px;\n}",".mrchat-chatWrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n height: 100vh;\n background: #f1f3f5;\n}\n\n.mrchat-chatContainer {\n display: flex;\n width: 100%;\n max-width: 1260px;\n background: white;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);\n border-radius: 8px;\n overflow: hidden;\n}\n\n.mrchat-sidebar {\n width: 280px;\n display: flex;\n flex-direction: column;\n height: 100vh;\n border-right: 1px solid #eee;\n background-color: #fff;\n padding-top: 12px;\n}\n\n@media (max-width: 760px) {\n .mrchat-sidebar {\n width: 180px;\n }\n}\n\n.mrchat-sidebarTop {\n padding: 0 12px;\n}\n\n.mrchat-topBar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n.mrchat-topActions {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.mrchat-scrollWrapper {\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n\n.mrchat-scrollArea {\n flex: 1;\n height: 100%;\n overflow-y: auto;\n}\n\n.mrchat-scrollArea .mantine-ScrollArea-content {\n padding-bottom: 60px;\n}\n\n.mrchat-avatar {\n width: 34px;\n height: 34px;\n border-radius: 50%;\n object-fit: cover;\n}\n\n.mrchat-mainArea {\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n\n.mrchat-messageArea {\n flex: 1;\n padding: 16px;\n overflow-y: auto;\n padding-bottom: 10px;\n}\n\n.mrchat-messageBubble {\n max-width: fit-content;\n padding: 8px 45px 8px 16px;\n margin-bottom: 8px;\n position: relative;\n}\n\n.mrchat-outgoing {\n color: white;\n background-color: #366ca4;\n margin-left: auto;\n}\n\n.mrchat-incoming {\n background-color: #eeeeee;\n margin-right: auto;\n}\n\n.mrchat-inputBar {\n display: flex;\n align-items: end;\n gap: 8px;\n padding: 0px 16px 16px;\n}\n\n/* @media (max-width: 760px) {\n .mrchat-mainArea {\n display: none;\n }\n} */\n\n.mrchat-chatItem {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 8px 12px;\n cursor: pointer;\n transition: background 0.2s;\n margin: 2px 4px;\n border-radius: 6px;\n}\n\n.mrchat-chatItem:hover {\n background-color: #f6f6f6;\n}\n\n.mrchat-chatLabelItem {\n font-size: 15px;\n}\n\n.mrchat-chatHeader {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px;\n border-bottom: 1px solid #eee;\n background-color: #f8f9fa;\n position: sticky;\n top: 0;\n z-index: 2;\n min-height: 63px;\n}\n\n.mrchat-receiverInfo {\n display: flex;\n align-items: center;\n gap: 12px;\n cursor: pointer;\n}\n\n.mrchat-emptyState {\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.mrchat-encryptionMinimal {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 10px;\n border-radius: 12px;\n background: rgba(0, 0, 0, 0.04);\n color: #666;\n font-size: 12px;\n}\n\n.mrchat-encryptionText {\n font-size: 16px;\n color: #666;\n margin-left: 3px;\n}\n\n.mrchat-messageContent {\n max-width: 370px;\n word-wrap: break-word;\n font-size: 14px;\n}\n\n.mrchat-messagePreviewContent p,\n.mrchat-messageContent p {\n margin: 0;\n padding: 0;\n}\n\n.mrchat-activeChatItem {\n background-color: #eee;\n}\n\n.mrchat-chatItem:hover {\n background-color: #eee;\n}\n\n.mrchat-messageTime {\n font-size: 11px;\n opacity: 0.6;\n text-align: right;\n margin-top: 4px;\n position: absolute;\n bottom: 4px;\n right: 8px;\n z-index: 1;\n}\n\n.mrchat-dateSeparator {\n text-align: center;\n font-size: 13px;\n margin: 12px 0;\n color: #888;\n}\n\n.mrchat-chatInfo {\n width: 100%;\n position: relative;\n}\n\n.mrchat-messagePreview {\n display: flex;\n justify-content: space-between;\n align-items: end;\n margin-top: 1px;\n}\n\n.mrchat-messagePreviewTime {\n position: relative;\n top: 1px;\n right: 0;\n}\n\n.mrchat-unreadBadge {\n background: #366ca4;\n color: white;\n font-size: 10px;\n border-radius: 50%;\n padding: 3px 5px;\n min-width: 18px;\n text-align: center;\n position: absolute;\n top: 1px;\n right: 0px;\n}\n\n.mrchat-messagePreviewContent {\n font-size: 14px;\n}"],"mappings":"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","names":[]}
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
1
+ import React from 'react';
2
2
 
3
- declare function MrChat(props: any): react_jsx_runtime.JSX.Element;
3
+ declare function MrChat(props: any): React.JSX.Element;
4
4
 
5
5
  export { MrChat };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
1
+ import React from 'react';
2
2
 
3
- declare function MrChat(props: any): react_jsx_runtime.JSX.Element;
3
+ declare function MrChat(props: any): React.JSX.Element;
4
4
 
5
5
  export { MrChat };