@convokitapp/vue-ui 0.1.0 → 0.1.2

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.
Files changed (8) hide show
  1. package/README.md +9 -3
  2. package/dist/index.cjs +12 -12
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.css +97 -98
  5. package/dist/index.css.map +1 -1
  6. package/dist/index.js +12 -12
  7. package/dist/index.js.map +1 -1
  8. package/package.json +3 -3
package/dist/index.css CHANGED
@@ -1,20 +1,19 @@
1
1
  /* src/styles.css */
2
2
  .ckui-theme,
3
3
  .ckui {
4
- --ckui-background: #f7f9f8;
5
- --ckui-surface: #fff;
6
- --ckui-primary: #148f78;
7
- --ckui-text: #17211f;
8
- --ckui-muted: #66736f;
9
- --ckui-border: #dde5e2;
10
- --ckui-error: #ba1a1a;
11
- --ckui-incoming: #fff;
12
- --ckui-outgoing: #148f78;
13
- --ckui-outgoing-text: #fff;
14
- --ckui-radius: 16px;
15
- --ckui-avatar-size: 44px;
4
+ --ckui-background: #fafafa;
5
+ --ckui-surface: #ffffff;
6
+ --ckui-primary: #18181b;
7
+ --ckui-text: #09090b;
8
+ --ckui-muted: #71717a;
9
+ --ckui-border: #e4e4e7;
10
+ --ckui-error: #dc2626;
11
+ --ckui-incoming: #f4f4f5;
12
+ --ckui-outgoing: #18181b;
13
+ --ckui-outgoing-text: #fafafa;
14
+ --ckui-radius: 10px;
15
+ --ckui-avatar-size: 40px;
16
16
  --ckui-font:
17
- Inter,
18
17
  ui-sans-serif,
19
18
  system-ui,
20
19
  -apple-system,
@@ -56,7 +55,7 @@
56
55
  }
57
56
  .ckui button:focus-visible,
58
57
  .ckui textarea:focus-visible {
59
- outline: 2px solid color-mix(in srgb, var(--ckui-primary) 62%, white);
58
+ outline: 2px solid color-mix(in srgb, var(--ckui-primary) 38%, white);
60
59
  outline-offset: 2px;
61
60
  }
62
61
  .ckui-conversation-list,
@@ -66,13 +65,11 @@
66
65
  min-height: 0;
67
66
  height: 100%;
68
67
  overflow: hidden;
68
+ flex-direction: column;
69
69
  border: 1px solid var(--ckui-border);
70
70
  border-radius: var(--ckui-radius);
71
- background: var(--ckui-background);
72
- }
73
- .ckui-conversation-list,
74
- .ckui-conversation {
75
- flex-direction: column;
71
+ background: var(--ckui-surface);
72
+ box-shadow: 0 1px 2px rgb(0 0 0 / 0.04);
76
73
  }
77
74
  .ckui-scroll-area,
78
75
  .ckui-message-list {
@@ -83,55 +80,50 @@
83
80
  }
84
81
  .ckui-scroll-area {
85
82
  flex: 1;
86
- padding: 12px;
83
+ background: var(--ckui-surface);
87
84
  }
88
85
  .ckui-conversation-list__toolbar {
89
86
  display: flex;
90
87
  align-items: center;
91
88
  justify-content: space-between;
92
- min-height: 50px;
93
- padding: 9px 12px 9px 16px;
89
+ min-height: 52px;
90
+ padding: 8px 10px 8px 16px;
94
91
  border-bottom: 1px solid var(--ckui-border);
95
92
  background: var(--ckui-surface);
96
- color: var(--ckui-muted);
97
- font-size: 11px;
98
- font-weight: 700;
99
- letter-spacing: .08em;
100
- text-transform: uppercase;
93
+ color: var(--ckui-text);
94
+ font-size: 14px;
95
+ font-weight: 600;
96
+ letter-spacing: -0.01em;
101
97
  }
102
98
  .ckui-conversation-list__items {
103
99
  display: grid;
104
- gap: 8px;
105
100
  }
106
101
  .ckui-conversation-item {
107
102
  display: grid;
108
103
  grid-template-columns: auto minmax(0, 1fr) auto;
109
- gap: 11px;
104
+ gap: 12px;
110
105
  align-items: center;
111
106
  width: 100%;
112
- min-height: 64px;
113
- padding: 9px 11px;
114
- border: 1px solid var(--ckui-border);
115
- border-radius: calc(var(--ckui-radius) - 2px);
107
+ min-height: 68px;
108
+ padding: 10px 14px;
109
+ border: 0;
110
+ border-bottom: 1px solid var(--ckui-border);
111
+ border-radius: 0;
116
112
  background: var(--ckui-surface);
117
113
  cursor: pointer;
118
114
  text-align: left;
119
- transition:
120
- border-color 150ms ease,
121
- background 150ms ease,
122
- transform 150ms ease;
115
+ transition: background-color 120ms ease;
123
116
  }
124
117
  .ckui-conversation-item:hover {
125
- border-color: color-mix(in srgb, var(--ckui-primary) 35%, var(--ckui-border));
126
- transform: translateY(-1px);
118
+ background: color-mix(in srgb, var(--ckui-primary) 4%, var(--ckui-surface));
127
119
  }
128
120
  .ckui-conversation-item[data-selected] {
129
- border-color: color-mix(in srgb, var(--ckui-primary) 52%, var(--ckui-border));
130
- background: color-mix(in srgb, var(--ckui-primary) 9%, var(--ckui-surface));
121
+ background: color-mix(in srgb, var(--ckui-primary) 7%, var(--ckui-surface));
131
122
  }
132
123
  .ckui-conversation-item__body {
133
124
  display: grid;
134
125
  min-width: 0;
126
+ gap: 2px;
135
127
  }
136
128
  .ckui-conversation-item__body strong,
137
129
  .ckui-conversation-item__body span {
@@ -140,8 +132,9 @@
140
132
  white-space: nowrap;
141
133
  }
142
134
  .ckui-conversation-item__body strong {
143
- font-size: 15px;
144
- font-weight: 700;
135
+ font-size: 14px;
136
+ font-weight: 600;
137
+ letter-spacing: -0.01em;
145
138
  }
146
139
  .ckui-conversation-item__body span {
147
140
  color: var(--ckui-muted);
@@ -154,11 +147,12 @@
154
147
  height: var(--ckui-avatar-size);
155
148
  overflow: hidden;
156
149
  place-items: center;
150
+ border: 1px solid var(--ckui-border);
157
151
  border-radius: 999px;
158
- background: color-mix(in srgb, var(--ckui-primary) 11%, var(--ckui-surface));
159
- color: var(--ckui-primary);
160
- font-size: 13px;
161
- font-weight: 750;
152
+ background: color-mix(in srgb, var(--ckui-primary) 6%, var(--ckui-surface));
153
+ color: var(--ckui-text);
154
+ font-size: 12px;
155
+ font-weight: 600;
162
156
  }
163
157
  .ckui-avatar__image,
164
158
  .ckui-avatar__fallback {
@@ -185,15 +179,15 @@
185
179
  .ckui-icon-button {
186
180
  display: inline-grid;
187
181
  flex: 0 0 auto;
188
- width: 36px;
189
- height: 36px;
182
+ width: 34px;
183
+ height: 34px;
190
184
  place-items: center;
191
- border-radius: 999px;
185
+ border-radius: 7px;
192
186
  color: var(--ckui-muted);
193
187
  }
194
188
  .ckui-icon-button:hover {
195
- background: color-mix(in srgb, var(--ckui-primary) 8%, transparent);
196
- color: var(--ckui-primary);
189
+ background: color-mix(in srgb, var(--ckui-primary) 6%, transparent);
190
+ color: var(--ckui-text);
197
191
  }
198
192
  .ckui-state,
199
193
  .ckui-inline-state {
@@ -216,7 +210,7 @@
216
210
  }
217
211
  .ckui-link-button {
218
212
  color: currentColor;
219
- font-weight: 700;
213
+ font-weight: 600;
220
214
  text-decoration: underline;
221
215
  text-underline-offset: 3px;
222
216
  }
@@ -224,8 +218,8 @@
224
218
  display: flex;
225
219
  align-items: center;
226
220
  gap: 10px;
227
- min-height: 64px;
228
- padding: 9px 12px;
221
+ min-height: 60px;
222
+ padding: 8px 12px;
229
223
  border-bottom: 1px solid var(--ckui-border);
230
224
  background: var(--ckui-surface);
231
225
  }
@@ -233,10 +227,13 @@
233
227
  display: grid;
234
228
  flex: 1;
235
229
  min-width: 0;
230
+ gap: 1px;
236
231
  }
237
232
  .ckui-conversation-header__body strong {
238
233
  overflow: hidden;
239
- font-size: 16px;
234
+ font-size: 14px;
235
+ font-weight: 600;
236
+ letter-spacing: -0.01em;
240
237
  text-overflow: ellipsis;
241
238
  white-space: nowrap;
242
239
  }
@@ -250,16 +247,16 @@
250
247
  justify-content: space-between;
251
248
  gap: 12px;
252
249
  padding: 8px 14px;
253
- border-bottom: 1px solid color-mix(in srgb, var(--ckui-error) 25%, transparent);
254
- background: color-mix(in srgb, var(--ckui-error) 7%, var(--ckui-surface));
250
+ border-bottom: 1px solid color-mix(in srgb, var(--ckui-error) 22%, var(--ckui-border));
251
+ background: color-mix(in srgb, var(--ckui-error) 5%, var(--ckui-surface));
255
252
  font-size: 12px;
256
253
  }
257
254
  .ckui-message-list {
258
255
  display: flex;
259
256
  flex: 1;
260
257
  flex-direction: column;
261
- gap: 10px;
262
- padding: 14px 16px;
258
+ gap: 12px;
259
+ padding: 18px;
263
260
  background: var(--ckui-background);
264
261
  }
265
262
  .ckui-message-row {
@@ -271,24 +268,23 @@
271
268
  align-items: flex-end;
272
269
  }
273
270
  .ckui-message-bubble {
274
- max-width: min(76%, 560px);
275
- padding: 10px 13px 8px;
271
+ max-width: min(74%, 560px);
272
+ padding: 9px 12px 7px;
276
273
  border: 1px solid var(--ckui-border);
277
- border-radius: var(--ckui-radius) var(--ckui-radius) var(--ckui-radius) 5px;
274
+ border-radius: calc(var(--ckui-radius) + 2px);
278
275
  background: var(--ckui-incoming);
279
- box-shadow: 0 1px 1px rgba(16, 24, 22, .03);
280
276
  }
281
277
  .ckui-message-row--outgoing .ckui-message-bubble {
282
- border-color: transparent;
283
- border-radius: var(--ckui-radius) var(--ckui-radius) 5px var(--ckui-radius);
278
+ border-color: var(--ckui-outgoing);
284
279
  background: var(--ckui-outgoing);
285
280
  color: var(--ckui-outgoing-text);
286
281
  }
287
282
  .ckui-message-sender {
288
283
  display: block;
289
284
  margin-bottom: 3px;
290
- color: var(--ckui-primary);
291
- font-size: 12px;
285
+ color: var(--ckui-muted);
286
+ font-size: 11px;
287
+ font-weight: 600;
292
288
  }
293
289
  .ckui-message-text {
294
290
  overflow-wrap: anywhere;
@@ -300,7 +296,7 @@
300
296
  justify-content: flex-end;
301
297
  gap: 3px;
302
298
  margin-top: 5px;
303
- color: color-mix(in srgb, currentColor 68%, transparent);
299
+ color: color-mix(in srgb, currentColor 62%, transparent);
304
300
  font-size: 10px;
305
301
  }
306
302
  .ckui-read-receipt {
@@ -321,8 +317,8 @@
321
317
  padding: 9px;
322
318
  overflow: hidden;
323
319
  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
324
- border-radius: calc(var(--ckui-radius) - 5px);
325
- background: color-mix(in srgb, var(--ckui-surface) 91%, transparent);
320
+ border-radius: 8px;
321
+ background: color-mix(in srgb, var(--ckui-surface) 94%, transparent);
326
322
  color: var(--ckui-text);
327
323
  text-align: left;
328
324
  }
@@ -366,8 +362,8 @@ button.ckui-media-card {
366
362
  .ckui-typing {
367
363
  min-height: 26px;
368
364
  padding: 5px 16px;
369
- border-top: 1px solid color-mix(in srgb, var(--ckui-border) 70%, transparent);
370
- background: var(--ckui-background);
365
+ border-top: 1px solid var(--ckui-border);
366
+ background: var(--ckui-surface);
371
367
  color: var(--ckui-muted);
372
368
  font-size: 11px;
373
369
  }
@@ -382,62 +378,66 @@ button.ckui-media-card {
382
378
  .ckui-composer__input {
383
379
  flex: 1;
384
380
  min-width: 0;
385
- min-height: 40px;
381
+ min-height: 38px;
386
382
  max-height: 132px;
387
- padding: 10px 13px;
383
+ padding: 9px 11px;
388
384
  resize: none;
389
- border: 1px solid transparent;
390
- border-radius: 20px;
385
+ border: 1px solid var(--ckui-border);
386
+ border-radius: 8px;
391
387
  outline: 0;
392
- background: var(--ckui-background);
388
+ background: var(--ckui-surface);
389
+ box-shadow: 0 1px 2px rgb(0 0 0 / 0.03);
390
+ }
391
+ .ckui-composer__input::placeholder {
392
+ color: var(--ckui-muted);
393
393
  }
394
394
  .ckui-composer__input:focus {
395
- border-color: color-mix(in srgb, var(--ckui-primary) 42%, var(--ckui-border));
395
+ border-color: color-mix(in srgb, var(--ckui-primary) 45%, var(--ckui-border));
396
396
  }
397
397
  .ckui-send-button {
398
398
  display: inline-grid;
399
399
  flex: 0 0 auto;
400
- width: 40px;
401
- height: 40px;
400
+ width: 38px;
401
+ height: 38px;
402
402
  place-items: center;
403
- border-radius: 999px;
403
+ border-radius: 8px;
404
404
  background: var(--ckui-primary);
405
- color: #fff;
405
+ color: var(--ckui-outgoing-text);
406
+ box-shadow: 0 1px 2px rgb(0 0 0 / 0.08);
407
+ }
408
+ .ckui-send-button:hover:not(:disabled) {
409
+ opacity: 0.9;
406
410
  }
407
411
  .ckui-send-button:disabled,
408
412
  .ckui-icon-button:disabled {
409
413
  cursor: not-allowed;
410
- opacity: .45;
414
+ opacity: 0.45;
411
415
  }
412
416
  .ckui[data-density=compact] {
413
417
  font-size: 12px;
414
418
  }
415
- .ckui[data-density=compact] .ckui-scroll-area {
416
- padding: 7px;
417
- }
418
- .ckui[data-density=compact] .ckui-conversation-list__items {
419
- gap: 2px;
419
+ .ckui[data-density=compact] .ckui-conversation-list__toolbar {
420
+ min-height: 44px;
420
421
  }
421
422
  .ckui[data-density=compact] .ckui-conversation-item {
422
- min-height: 44px;
423
- padding: 5px 7px;
424
- border-color: transparent;
425
- background: transparent;
423
+ min-height: 46px;
424
+ padding: 6px 10px;
426
425
  }
427
426
  .ckui[data-density=compact] .ckui-avatar {
428
427
  --ckui-avatar-size: 30px;
429
428
  font-size: 10px;
430
429
  }
431
430
  .ckui[data-density=compact] .ckui-message-list {
432
- gap: 3px;
433
- padding: 8px 12px;
431
+ gap: 5px;
432
+ padding: 10px 12px;
434
433
  }
435
434
  .ckui[data-density=compact] .ckui-message-bubble {
436
435
  max-width: 88%;
437
436
  padding: 6px 9px;
437
+ border-radius: 8px;
438
438
  }
439
439
  .ckui[data-density=compact] .ckui-conversation-header {
440
- min-height: 50px;
440
+ min-height: 48px;
441
441
  }
442
442
  .ckui[data-density=compact] .ckui-typing {
443
443
  min-height: 22px;
@@ -468,9 +468,8 @@ button.ckui-media-card {
468
468
  .ckui-message-bubble {
469
469
  max-width: 88%;
470
470
  }
471
- .ckui-scroll-area,
472
471
  .ckui-message-list {
473
- padding-inline: 10px;
472
+ padding-inline: 12px;
474
473
  }
475
474
  }
476
475
  /*# sourceMappingURL=index.css.map */
package/dist/index.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/styles.css"],"sourcesContent":[".ckui-theme,\n.ckui {\n --ckui-background: #f7f9f8;\n --ckui-surface: #fff;\n --ckui-primary: #148f78;\n --ckui-text: #17211f;\n --ckui-muted: #66736f;\n --ckui-border: #dde5e2;\n --ckui-error: #ba1a1a;\n --ckui-incoming: #fff;\n --ckui-outgoing: #148f78;\n --ckui-outgoing-text: #fff;\n --ckui-radius: 16px;\n --ckui-avatar-size: 44px;\n --ckui-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n}\n\n.ckui-theme .ckui {\n --ckui-background: inherit;\n --ckui-surface: inherit;\n --ckui-primary: inherit;\n --ckui-text: inherit;\n --ckui-muted: inherit;\n --ckui-border: inherit;\n --ckui-error: inherit;\n --ckui-incoming: inherit;\n --ckui-outgoing: inherit;\n --ckui-outgoing-text: inherit;\n --ckui-radius: inherit;\n --ckui-avatar-size: inherit;\n --ckui-font: inherit;\n}\n\n.ckui,\n.ckui *,\n.ckui *::before,\n.ckui *::after {\n box-sizing: border-box;\n}\n\n.ckui {\n color: var(--ckui-text);\n font-family: var(--ckui-font);\n font-size: 14px;\n line-height: 1.45;\n}\n\n.ckui button,\n.ckui textarea {\n color: inherit;\n font: inherit;\n}\n\n.ckui button:focus-visible,\n.ckui textarea:focus-visible {\n outline: 2px solid color-mix(in srgb, var(--ckui-primary) 62%, white);\n outline-offset: 2px;\n}\n\n.ckui-conversation-list,\n.ckui-conversation {\n display: flex;\n min-width: 0;\n min-height: 0;\n height: 100%;\n overflow: hidden;\n border: 1px solid var(--ckui-border);\n border-radius: var(--ckui-radius);\n background: var(--ckui-background);\n}\n\n.ckui-conversation-list,\n.ckui-conversation {\n flex-direction: column;\n}\n\n.ckui-scroll-area,\n.ckui-message-list {\n min-height: 0;\n overflow: auto;\n overscroll-behavior: contain;\n scrollbar-gutter: stable;\n}\n\n.ckui-scroll-area {\n flex: 1;\n padding: 12px;\n}\n\n.ckui-conversation-list__toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-height: 50px;\n padding: 9px 12px 9px 16px;\n border-bottom: 1px solid var(--ckui-border);\n background: var(--ckui-surface);\n color: var(--ckui-muted);\n font-size: 11px;\n font-weight: 700;\n letter-spacing: .08em;\n text-transform: uppercase;\n}\n\n.ckui-conversation-list__items {\n display: grid;\n gap: 8px;\n}\n\n.ckui-conversation-item {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr) auto;\n gap: 11px;\n align-items: center;\n width: 100%;\n min-height: 64px;\n padding: 9px 11px;\n border: 1px solid var(--ckui-border);\n border-radius: calc(var(--ckui-radius) - 2px);\n background: var(--ckui-surface);\n cursor: pointer;\n text-align: left;\n transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;\n}\n\n.ckui-conversation-item:hover {\n border-color: color-mix(in srgb, var(--ckui-primary) 35%, var(--ckui-border));\n transform: translateY(-1px);\n}\n\n.ckui-conversation-item[data-selected] {\n border-color: color-mix(in srgb, var(--ckui-primary) 52%, var(--ckui-border));\n background: color-mix(in srgb, var(--ckui-primary) 9%, var(--ckui-surface));\n}\n\n.ckui-conversation-item__body {\n display: grid;\n min-width: 0;\n}\n\n.ckui-conversation-item__body strong,\n.ckui-conversation-item__body span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.ckui-conversation-item__body strong {\n font-size: 15px;\n font-weight: 700;\n}\n\n.ckui-conversation-item__body span {\n color: var(--ckui-muted);\n font-size: 12px;\n}\n\n.ckui-avatar {\n display: inline-grid;\n flex: 0 0 auto;\n width: var(--ckui-avatar-size);\n height: var(--ckui-avatar-size);\n overflow: hidden;\n place-items: center;\n border-radius: 999px;\n background: color-mix(in srgb, var(--ckui-primary) 11%, var(--ckui-surface));\n color: var(--ckui-primary);\n font-size: 13px;\n font-weight: 750;\n}\n\n.ckui-avatar__image,\n.ckui-avatar__fallback {\n width: 100%;\n height: 100%;\n}\n\n.ckui-avatar__image { object-fit: cover; }\n.ckui-avatar__fallback { display: grid; place-items: center; }\n\n.ckui-separator { display: none; }\n\n.ckui-icon-button,\n.ckui-send-button,\n.ckui-link-button {\n border: 0;\n background: transparent;\n cursor: pointer;\n}\n\n.ckui-icon-button {\n display: inline-grid;\n flex: 0 0 auto;\n width: 36px;\n height: 36px;\n place-items: center;\n border-radius: 999px;\n color: var(--ckui-muted);\n}\n\n.ckui-icon-button:hover { background: color-mix(in srgb, var(--ckui-primary) 8%, transparent); color: var(--ckui-primary); }\n\n.ckui-state,\n.ckui-inline-state {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n min-height: 120px;\n padding: 20px;\n color: var(--ckui-muted);\n text-align: center;\n}\n\n.ckui-inline-state { min-height: 52px; font-size: 12px; }\n.ckui-state--error,\n.ckui-conversation-error { color: var(--ckui-error); }\n.ckui-link-button { color: currentColor; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }\n\n.ckui-conversation-header {\n display: flex;\n align-items: center;\n gap: 10px;\n min-height: 64px;\n padding: 9px 12px;\n border-bottom: 1px solid var(--ckui-border);\n background: var(--ckui-surface);\n}\n\n.ckui-conversation-header__body {\n display: grid;\n flex: 1;\n min-width: 0;\n}\n\n.ckui-conversation-header__body strong { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }\n.ckui-conversation-header__body span { color: var(--ckui-muted); font-size: 12px; }\n\n.ckui-conversation-error {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n padding: 8px 14px;\n border-bottom: 1px solid color-mix(in srgb, var(--ckui-error) 25%, transparent);\n background: color-mix(in srgb, var(--ckui-error) 7%, var(--ckui-surface));\n font-size: 12px;\n}\n\n.ckui-message-list {\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: 10px;\n padding: 14px 16px;\n background: var(--ckui-background);\n}\n\n.ckui-message-row { display: flex; flex-direction: column; align-items: flex-start; }\n.ckui-message-row--outgoing { align-items: flex-end; }\n\n.ckui-message-bubble {\n max-width: min(76%, 560px);\n padding: 10px 13px 8px;\n border: 1px solid var(--ckui-border);\n border-radius: var(--ckui-radius) var(--ckui-radius) var(--ckui-radius) 5px;\n background: var(--ckui-incoming);\n box-shadow: 0 1px 1px rgba(16, 24, 22, .03);\n}\n\n.ckui-message-row--outgoing .ckui-message-bubble {\n border-color: transparent;\n border-radius: var(--ckui-radius) var(--ckui-radius) 5px var(--ckui-radius);\n background: var(--ckui-outgoing);\n color: var(--ckui-outgoing-text);\n}\n\n.ckui-message-sender {\n display: block;\n margin-bottom: 3px;\n color: var(--ckui-primary);\n font-size: 12px;\n}\n\n.ckui-message-text { overflow-wrap: anywhere; white-space: pre-wrap; }\n\n.ckui-message-time {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 3px;\n margin-top: 5px;\n color: color-mix(in srgb, currentColor 68%, transparent);\n font-size: 10px;\n}\n\n.ckui-read-receipt {\n min-height: 16px;\n padding-top: 3px;\n color: var(--ckui-muted);\n font-size: 10px;\n}\n\n.ckui-media { margin-top: 8px; }\n.ckui-media-card {\n display: flex;\n align-items: center;\n gap: 9px;\n width: 100%;\n min-width: 210px;\n padding: 9px;\n overflow: hidden;\n border: 1px solid color-mix(in srgb, currentColor 16%, transparent);\n border-radius: calc(var(--ckui-radius) - 5px);\n background: color-mix(in srgb, var(--ckui-surface) 91%, transparent);\n color: var(--ckui-text);\n text-align: left;\n}\n\nbutton.ckui-media-card { cursor: pointer; }\n.ckui-media-card > span { display: grid; flex: 1; min-width: 0; }\n.ckui-media-card strong,\n.ckui-media-card small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ckui-media-card small { color: var(--ckui-muted); }\n\n.ckui-media-card--image {\n display: grid;\n max-width: 330px;\n padding: 0;\n}\n\n.ckui-media-card--image img {\n display: block;\n width: 100%;\n max-height: 280px;\n object-fit: cover;\n}\n\n.ckui-media-name { padding: 0 10px 9px; font-size: 11px; }\n.ckui-media-placeholder { min-height: 120px; place-items: center; padding: 20px; }\n\n.ckui-typing {\n min-height: 26px;\n padding: 5px 16px;\n border-top: 1px solid color-mix(in srgb, var(--ckui-border) 70%, transparent);\n background: var(--ckui-background);\n color: var(--ckui-muted);\n font-size: 11px;\n}\n\n.ckui-composer {\n display: flex;\n align-items: flex-end;\n gap: 8px;\n padding: 10px 12px;\n border-top: 1px solid var(--ckui-border);\n background: var(--ckui-surface);\n}\n\n.ckui-composer__input {\n flex: 1;\n min-width: 0;\n min-height: 40px;\n max-height: 132px;\n padding: 10px 13px;\n resize: none;\n border: 1px solid transparent;\n border-radius: 20px;\n outline: 0;\n background: var(--ckui-background);\n}\n\n.ckui-composer__input:focus { border-color: color-mix(in srgb, var(--ckui-primary) 42%, var(--ckui-border)); }\n\n.ckui-send-button {\n display: inline-grid;\n flex: 0 0 auto;\n width: 40px;\n height: 40px;\n place-items: center;\n border-radius: 999px;\n background: var(--ckui-primary);\n color: #fff;\n}\n\n.ckui-send-button:disabled,\n.ckui-icon-button:disabled { cursor: not-allowed; opacity: .45; }\n\n.ckui[data-density='compact'] { font-size: 12px; }\n.ckui[data-density='compact'] .ckui-scroll-area { padding: 7px; }\n.ckui[data-density='compact'] .ckui-conversation-list__items { gap: 2px; }\n.ckui[data-density='compact'] .ckui-conversation-item { min-height: 44px; padding: 5px 7px; border-color: transparent; background: transparent; }\n.ckui[data-density='compact'] .ckui-avatar { --ckui-avatar-size: 30px; font-size: 10px; }\n.ckui[data-density='compact'] .ckui-message-list { gap: 3px; padding: 8px 12px; }\n.ckui[data-density='compact'] .ckui-message-bubble { max-width: 88%; padding: 6px 9px; }\n.ckui[data-density='compact'] .ckui-conversation-header { min-height: 50px; }\n.ckui[data-density='compact'] .ckui-typing { min-height: 22px; padding-block: 3px; }\n.ckui[data-density='compact'] .ckui-composer { padding: 6px 8px; }\n\n.ckui-spin { animation: ckui-spin 900ms linear infinite; }\n@keyframes ckui-spin { to { transform: rotate(360deg); } }\n\n@media (prefers-reduced-motion: reduce) {\n .ckui *, .ckui *::before, .ckui *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }\n}\n\n@media (max-width: 560px) {\n .ckui-message-bubble { max-width: 88%; }\n .ckui-scroll-area, .ckui-message-list { padding-inline: 10px; }\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/styles.css"],"sourcesContent":[".ckui-theme,\n.ckui {\n --ckui-background: #fafafa;\n --ckui-surface: #ffffff;\n --ckui-primary: #18181b;\n --ckui-text: #09090b;\n --ckui-muted: #71717a;\n --ckui-border: #e4e4e7;\n --ckui-error: #dc2626;\n --ckui-incoming: #f4f4f5;\n --ckui-outgoing: #18181b;\n --ckui-outgoing-text: #fafafa;\n --ckui-radius: 10px;\n --ckui-avatar-size: 40px;\n --ckui-font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n}\n\n.ckui-theme .ckui {\n --ckui-background: inherit;\n --ckui-surface: inherit;\n --ckui-primary: inherit;\n --ckui-text: inherit;\n --ckui-muted: inherit;\n --ckui-border: inherit;\n --ckui-error: inherit;\n --ckui-incoming: inherit;\n --ckui-outgoing: inherit;\n --ckui-outgoing-text: inherit;\n --ckui-radius: inherit;\n --ckui-avatar-size: inherit;\n --ckui-font: inherit;\n}\n\n.ckui,\n.ckui *,\n.ckui *::before,\n.ckui *::after { box-sizing: border-box; }\n\n.ckui { color: var(--ckui-text); font-family: var(--ckui-font); font-size: 14px; line-height: 1.45; }\n.ckui button, .ckui textarea { color: inherit; font: inherit; }\n.ckui button:focus-visible, .ckui textarea:focus-visible { outline: 2px solid color-mix(in srgb, var(--ckui-primary) 38%, white); outline-offset: 2px; }\n\n.ckui-conversation-list,\n.ckui-conversation {\n display: flex;\n min-width: 0;\n min-height: 0;\n height: 100%;\n overflow: hidden;\n flex-direction: column;\n border: 1px solid var(--ckui-border);\n border-radius: var(--ckui-radius);\n background: var(--ckui-surface);\n box-shadow: 0 1px 2px rgb(0 0 0 / 0.04);\n}\n\n.ckui-scroll-area, .ckui-message-list { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }\n.ckui-scroll-area { flex: 1; background: var(--ckui-surface); }\n\n.ckui-conversation-list__toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-height: 52px;\n padding: 8px 10px 8px 16px;\n border-bottom: 1px solid var(--ckui-border);\n background: var(--ckui-surface);\n color: var(--ckui-text);\n font-size: 14px;\n font-weight: 600;\n letter-spacing: -0.01em;\n}\n\n.ckui-conversation-list__items { display: grid; }\n.ckui-conversation-item {\n display: grid;\n grid-template-columns: auto minmax(0, 1fr) auto;\n gap: 12px;\n align-items: center;\n width: 100%;\n min-height: 68px;\n padding: 10px 14px;\n border: 0;\n border-bottom: 1px solid var(--ckui-border);\n border-radius: 0;\n background: var(--ckui-surface);\n cursor: pointer;\n text-align: left;\n transition: background-color 120ms ease;\n}\n.ckui-conversation-item:hover { background: color-mix(in srgb, var(--ckui-primary) 4%, var(--ckui-surface)); }\n.ckui-conversation-item[data-selected] { background: color-mix(in srgb, var(--ckui-primary) 7%, var(--ckui-surface)); }\n.ckui-conversation-item__body { display: grid; min-width: 0; gap: 2px; }\n.ckui-conversation-item__body strong, .ckui-conversation-item__body span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ckui-conversation-item__body strong { font-size: 14px; font-weight: 600; letter-spacing: -0.01em; }\n.ckui-conversation-item__body span { color: var(--ckui-muted); font-size: 12px; }\n\n.ckui-avatar {\n display: inline-grid;\n flex: 0 0 auto;\n width: var(--ckui-avatar-size);\n height: var(--ckui-avatar-size);\n overflow: hidden;\n place-items: center;\n border: 1px solid var(--ckui-border);\n border-radius: 999px;\n background: color-mix(in srgb, var(--ckui-primary) 6%, var(--ckui-surface));\n color: var(--ckui-text);\n font-size: 12px;\n font-weight: 600;\n}\n.ckui-avatar__image, .ckui-avatar__fallback { width: 100%; height: 100%; }\n.ckui-avatar__image { object-fit: cover; }\n.ckui-avatar__fallback { display: grid; place-items: center; }\n.ckui-separator { display: none; }\n\n.ckui-icon-button, .ckui-send-button, .ckui-link-button { border: 0; background: transparent; cursor: pointer; }\n.ckui-icon-button { display: inline-grid; flex: 0 0 auto; width: 34px; height: 34px; place-items: center; border-radius: 7px; color: var(--ckui-muted); }\n.ckui-icon-button:hover { background: color-mix(in srgb, var(--ckui-primary) 6%, transparent); color: var(--ckui-text); }\n.ckui-state, .ckui-inline-state { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 120px; padding: 20px; color: var(--ckui-muted); text-align: center; }\n.ckui-inline-state { min-height: 52px; font-size: 12px; }\n.ckui-state--error, .ckui-conversation-error { color: var(--ckui-error); }\n.ckui-link-button { color: currentColor; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }\n\n.ckui-conversation-header { display: flex; align-items: center; gap: 10px; min-height: 60px; padding: 8px 12px; border-bottom: 1px solid var(--ckui-border); background: var(--ckui-surface); }\n.ckui-conversation-header__body { display: grid; flex: 1; min-width: 0; gap: 1px; }\n.ckui-conversation-header__body strong { overflow: hidden; font-size: 14px; font-weight: 600; letter-spacing: -0.01em; text-overflow: ellipsis; white-space: nowrap; }\n.ckui-conversation-header__body span { color: var(--ckui-muted); font-size: 12px; }\n.ckui-conversation-error { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 14px; border-bottom: 1px solid color-mix(in srgb, var(--ckui-error) 22%, var(--ckui-border)); background: color-mix(in srgb, var(--ckui-error) 5%, var(--ckui-surface)); font-size: 12px; }\n\n.ckui-message-list { display: flex; flex: 1; flex-direction: column; gap: 12px; padding: 18px; background: var(--ckui-background); }\n.ckui-message-row { display: flex; flex-direction: column; align-items: flex-start; }\n.ckui-message-row--outgoing { align-items: flex-end; }\n.ckui-message-bubble { max-width: min(74%, 560px); padding: 9px 12px 7px; border: 1px solid var(--ckui-border); border-radius: calc(var(--ckui-radius) + 2px); background: var(--ckui-incoming); }\n.ckui-message-row--outgoing .ckui-message-bubble { border-color: var(--ckui-outgoing); background: var(--ckui-outgoing); color: var(--ckui-outgoing-text); }\n.ckui-message-sender { display: block; margin-bottom: 3px; color: var(--ckui-muted); font-size: 11px; font-weight: 600; }\n.ckui-message-text { overflow-wrap: anywhere; white-space: pre-wrap; }\n.ckui-message-time { display: flex; align-items: center; justify-content: flex-end; gap: 3px; margin-top: 5px; color: color-mix(in srgb, currentColor 62%, transparent); font-size: 10px; }\n.ckui-read-receipt { min-height: 16px; padding-top: 3px; color: var(--ckui-muted); font-size: 10px; }\n\n.ckui-media { margin-top: 8px; }\n.ckui-media-card { display: flex; align-items: center; gap: 9px; width: 100%; min-width: 210px; padding: 9px; overflow: hidden; border: 1px solid color-mix(in srgb, currentColor 16%, transparent); border-radius: 8px; background: color-mix(in srgb, var(--ckui-surface) 94%, transparent); color: var(--ckui-text); text-align: left; }\nbutton.ckui-media-card { cursor: pointer; }\n.ckui-media-card > span { display: grid; flex: 1; min-width: 0; }\n.ckui-media-card strong, .ckui-media-card small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.ckui-media-card small { color: var(--ckui-muted); }\n.ckui-media-card--image { display: grid; max-width: 330px; padding: 0; }\n.ckui-media-card--image img { display: block; width: 100%; max-height: 280px; object-fit: cover; }\n.ckui-media-name { padding: 0 10px 9px; font-size: 11px; }\n.ckui-media-placeholder { min-height: 120px; place-items: center; padding: 20px; }\n\n.ckui-typing { min-height: 26px; padding: 5px 16px; border-top: 1px solid var(--ckui-border); background: var(--ckui-surface); color: var(--ckui-muted); font-size: 11px; }\n.ckui-composer { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--ckui-border); background: var(--ckui-surface); }\n.ckui-composer__input { flex: 1; min-width: 0; min-height: 38px; max-height: 132px; padding: 9px 11px; resize: none; border: 1px solid var(--ckui-border); border-radius: 8px; outline: 0; background: var(--ckui-surface); box-shadow: 0 1px 2px rgb(0 0 0 / 0.03); }\n.ckui-composer__input::placeholder { color: var(--ckui-muted); }\n.ckui-composer__input:focus { border-color: color-mix(in srgb, var(--ckui-primary) 45%, var(--ckui-border)); }\n.ckui-send-button { display: inline-grid; flex: 0 0 auto; width: 38px; height: 38px; place-items: center; border-radius: 8px; background: var(--ckui-primary); color: var(--ckui-outgoing-text); box-shadow: 0 1px 2px rgb(0 0 0 / 0.08); }\n.ckui-send-button:hover:not(:disabled) { opacity: 0.9; }\n.ckui-send-button:disabled, .ckui-icon-button:disabled { cursor: not-allowed; opacity: 0.45; }\n\n.ckui[data-density='compact'] { font-size: 12px; }\n.ckui[data-density='compact'] .ckui-conversation-list__toolbar { min-height: 44px; }\n.ckui[data-density='compact'] .ckui-conversation-item { min-height: 46px; padding: 6px 10px; }\n.ckui[data-density='compact'] .ckui-avatar { --ckui-avatar-size: 30px; font-size: 10px; }\n.ckui[data-density='compact'] .ckui-message-list { gap: 5px; padding: 10px 12px; }\n.ckui[data-density='compact'] .ckui-message-bubble { max-width: 88%; padding: 6px 9px; border-radius: 8px; }\n.ckui[data-density='compact'] .ckui-conversation-header { min-height: 48px; }\n.ckui[data-density='compact'] .ckui-typing { min-height: 22px; padding-block: 3px; }\n.ckui[data-density='compact'] .ckui-composer { padding: 6px 8px; }\n.ckui-spin { animation: ckui-spin 900ms linear infinite; }\n@keyframes ckui-spin { to { transform: rotate(360deg); } }\n@media (prefers-reduced-motion: reduce) { .ckui *, .ckui *::before, .ckui *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }\n@media (max-width: 560px) { .ckui-message-bubble { max-width: 88%; } .ckui-message-list { padding-inline: 12px; } }\n"],"mappings":"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","names":[]}
package/dist/index.js CHANGED
@@ -1329,19 +1329,19 @@ import {
1329
1329
  provide
1330
1330
  } from "vue";
1331
1331
  var defaultConvoKitTheme = {
1332
- background: "#f7f9f8",
1332
+ background: "#fafafa",
1333
1333
  surface: "#ffffff",
1334
- primary: "#148f78",
1335
- text: "#17211f",
1336
- mutedText: "#66736f",
1337
- border: "#dde5e2",
1338
- error: "#ba1a1a",
1339
- incomingBubble: "#ffffff",
1340
- outgoingBubble: "#148f78",
1341
- outgoingText: "#ffffff",
1342
- radius: "16px",
1343
- avatarSize: "44px",
1344
- fontFamily: 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'
1334
+ primary: "#18181b",
1335
+ text: "#09090b",
1336
+ mutedText: "#71717a",
1337
+ border: "#e4e4e7",
1338
+ error: "#dc2626",
1339
+ incomingBubble: "#f4f4f5",
1340
+ outgoingBubble: "#18181b",
1341
+ outgoingText: "#fafafa",
1342
+ radius: "10px",
1343
+ avatarSize: "40px",
1344
+ fontFamily: 'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'
1345
1345
  };
1346
1346
  var themeKey = /* @__PURE__ */ Symbol("ConvoKitTheme");
1347
1347
  var defaultThemeRef = computed4(() => defaultConvoKitTheme);