@adatechnology/conversations-ui 0.1.0-rc.6 → 0.1.0-rc.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/{chunk-LITPZCWW.js → chunk-TGTBMMFC.js} +422 -180
- package/dist/index.d.ts +76 -6
- package/dist/index.js +16 -2
- package/dist/preview/index.d.ts +73 -4
- package/dist/preview/index.js +216 -37
- package/dist/{types-CeixG2Z9.d.ts → types-B5C1DLu1.d.ts} +43 -2
- package/package.json +2 -2
- package/src/ConversationHeader.tsx +18 -0
- package/src/EmojiPicker.tsx +69 -55
- package/src/InteractiveMessage.tsx +126 -0
- package/src/MessageBubble.tsx +13 -2
- package/src/MessageComposer.tsx +16 -2
- package/src/emojiCatalog.test.ts +35 -0
- package/src/emojiCatalog.ts +189 -0
- package/src/index.ts +9 -3
- package/src/preview/AudioRecorderButton.tsx +117 -0
- package/src/preview/ConversationPreview.tsx +184 -15
- package/src/preview/audioRecorderFormat.test.ts +67 -0
- package/src/preview/conversationPreviewFailures.test.ts +64 -0
- package/src/preview/createPreviewWebhookClient.ts +28 -1
- package/src/preview/index.ts +11 -2
- package/src/preview/mediaTypeOf.test.ts +15 -0
- package/src/types.ts +38 -1
|
@@ -391,6 +391,75 @@ function Lightbox({ imageUrl, caption, onClose, labels }) {
|
|
|
391
391
|
] }) });
|
|
392
392
|
}
|
|
393
393
|
|
|
394
|
+
// src/InteractiveMessage.tsx
|
|
395
|
+
import { useState as useState3 } from "react";
|
|
396
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
397
|
+
var DEFAULT_INTERACTIVE_MESSAGE_LABELS = {
|
|
398
|
+
openList: "Ver op\xE7\xF5es"
|
|
399
|
+
};
|
|
400
|
+
function collectRows(payload) {
|
|
401
|
+
return (payload.action?.sections ?? []).flatMap((section) => section.rows ?? []);
|
|
402
|
+
}
|
|
403
|
+
function collectButtons(payload) {
|
|
404
|
+
return (payload.action?.buttons ?? []).map((button) => button.reply).filter((reply) => reply !== void 0);
|
|
405
|
+
}
|
|
406
|
+
function InteractiveMessage({ payload, onSelect, labels, className }) {
|
|
407
|
+
const openListLabel = labels?.openList ?? DEFAULT_INTERACTIVE_MESSAGE_LABELS.openList;
|
|
408
|
+
const [isListOpen, setIsListOpen] = useState3(false);
|
|
409
|
+
const buttons = collectButtons(payload);
|
|
410
|
+
const sections = payload.action?.sections ?? [];
|
|
411
|
+
const hasRows = collectRows(payload).length > 0;
|
|
412
|
+
const isInteractable = onSelect !== void 0;
|
|
413
|
+
return /* @__PURE__ */ jsxs5("div", { className: cn("flex flex-col gap-1", className), children: [
|
|
414
|
+
payload.header?.text ? /* @__PURE__ */ jsx7("p", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: payload.header.text }) : null,
|
|
415
|
+
payload.body?.text ? /* @__PURE__ */ jsx7("p", { className: "whitespace-pre-wrap break-words text-sm text-gray-900 dark:text-gray-100", children: payload.body.text }) : null,
|
|
416
|
+
payload.footer?.text ? /* @__PURE__ */ jsx7("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: payload.footer.text }) : null,
|
|
417
|
+
buttons.length > 0 ? /* @__PURE__ */ jsx7("div", { className: "mt-1 flex flex-col gap-1 border-t border-gray-200 pt-1 dark:border-gray-700", children: buttons.map((button) => /* @__PURE__ */ jsx7(
|
|
418
|
+
"button",
|
|
419
|
+
{
|
|
420
|
+
type: "button",
|
|
421
|
+
disabled: !isInteractable,
|
|
422
|
+
onClick: () => onSelect?.({ kind: "button", option: button }),
|
|
423
|
+
className: "rounded-md px-3 py-1.5 text-sm font-medium text-teal-700 transition-colors enabled:hover:bg-teal-50 disabled:cursor-default dark:text-teal-300 dark:enabled:hover:bg-teal-900/30",
|
|
424
|
+
children: button.title
|
|
425
|
+
},
|
|
426
|
+
button.id
|
|
427
|
+
)) }) : null,
|
|
428
|
+
hasRows ? /* @__PURE__ */ jsxs5("div", { className: "mt-1 border-t border-gray-200 pt-1 dark:border-gray-700", children: [
|
|
429
|
+
/* @__PURE__ */ jsxs5(
|
|
430
|
+
"button",
|
|
431
|
+
{
|
|
432
|
+
type: "button",
|
|
433
|
+
onClick: () => setIsListOpen((open) => !open),
|
|
434
|
+
"aria-expanded": isListOpen,
|
|
435
|
+
className: "w-full rounded-md px-3 py-1.5 text-sm font-medium text-teal-700 transition-colors hover:bg-teal-50 dark:text-teal-300 dark:hover:bg-teal-900/30",
|
|
436
|
+
children: [
|
|
437
|
+
"\u2630 ",
|
|
438
|
+
payload.action?.button ?? openListLabel
|
|
439
|
+
]
|
|
440
|
+
}
|
|
441
|
+
),
|
|
442
|
+
isListOpen ? /* @__PURE__ */ jsx7("div", { className: "mt-1 flex flex-col gap-1", children: sections.map((section, sectionIndex) => /* @__PURE__ */ jsxs5("div", { className: "flex flex-col", children: [
|
|
443
|
+
section.title ? /* @__PURE__ */ jsx7("p", { className: "px-3 py-1 text-xs font-semibold uppercase text-gray-500 dark:text-gray-400", children: section.title }) : null,
|
|
444
|
+
(section.rows ?? []).map((row) => /* @__PURE__ */ jsxs5(
|
|
445
|
+
"button",
|
|
446
|
+
{
|
|
447
|
+
type: "button",
|
|
448
|
+
disabled: !isInteractable,
|
|
449
|
+
onClick: () => onSelect?.({ kind: "list", option: row }),
|
|
450
|
+
className: "rounded-md px-3 py-1.5 text-left text-sm text-gray-900 transition-colors enabled:hover:bg-gray-100 disabled:cursor-default dark:text-gray-100 dark:enabled:hover:bg-gray-700",
|
|
451
|
+
children: [
|
|
452
|
+
/* @__PURE__ */ jsx7("span", { className: "block", children: row.title }),
|
|
453
|
+
row.description ? /* @__PURE__ */ jsx7("span", { className: "block text-xs text-gray-500 dark:text-gray-400", children: row.description }) : null
|
|
454
|
+
]
|
|
455
|
+
},
|
|
456
|
+
row.id
|
|
457
|
+
))
|
|
458
|
+
] }, section.title ?? sectionIndex)) }) : null
|
|
459
|
+
] }) : null
|
|
460
|
+
] });
|
|
461
|
+
}
|
|
462
|
+
|
|
394
463
|
// src/lib/createMediaUrlResolver.ts
|
|
395
464
|
function createMediaUrlResolver(api) {
|
|
396
465
|
return async (message) => {
|
|
@@ -405,23 +474,23 @@ function createMediaUrlResolver(api) {
|
|
|
405
474
|
|
|
406
475
|
// src/providers/ConversationsProvider.tsx
|
|
407
476
|
import { createContext as createContext2, useContext as useContext2 } from "react";
|
|
408
|
-
import { jsx as
|
|
477
|
+
import { jsx as jsx8 } from "react/jsx-runtime";
|
|
409
478
|
var ConversationsContext = createContext2(null);
|
|
410
479
|
function ConversationsProvider({
|
|
411
480
|
api,
|
|
412
481
|
sse,
|
|
413
482
|
children
|
|
414
483
|
}) {
|
|
415
|
-
return /* @__PURE__ */
|
|
484
|
+
return /* @__PURE__ */ jsx8(ConversationsContext.Provider, { value: { api, sse }, children });
|
|
416
485
|
}
|
|
417
486
|
function useConversations() {
|
|
418
487
|
return useContext2(ConversationsContext);
|
|
419
488
|
}
|
|
420
489
|
|
|
421
490
|
// src/MessageBubble.tsx
|
|
422
|
-
import { useMemo, useState as
|
|
491
|
+
import { useMemo, useState as useState4 } from "react";
|
|
423
492
|
import { Check } from "lucide-react";
|
|
424
|
-
import { Fragment, jsx as
|
|
493
|
+
import { Fragment, jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
425
494
|
var BUBBLE_COLOR = {
|
|
426
495
|
agent: "bg-[#d9fdd3] dark:bg-[#005c4b]",
|
|
427
496
|
bot: "bg-[#d7f0ec] dark:bg-[#0a3d3a]",
|
|
@@ -437,10 +506,11 @@ function MessageBubble({
|
|
|
437
506
|
isSelected = false,
|
|
438
507
|
onToggleSelect,
|
|
439
508
|
onResolveMediaUrl,
|
|
509
|
+
onInteractiveSelect,
|
|
440
510
|
className
|
|
441
511
|
}) {
|
|
442
512
|
const { bubble, selection } = useConversationLocales();
|
|
443
|
-
const [lightboxSrc, setLightboxSrc] =
|
|
513
|
+
const [lightboxSrc, setLightboxSrc] = useState4(null);
|
|
444
514
|
const context = useConversations();
|
|
445
515
|
const resolveMediaUrl = useMemo(
|
|
446
516
|
() => onResolveMediaUrl ?? (context?.api ? createMediaUrlResolver(context.api) : void 0),
|
|
@@ -450,10 +520,11 @@ function MessageBubble({
|
|
|
450
520
|
const hasError = message.status === "failed";
|
|
451
521
|
const isMedia = MEDIA_TYPES.has(message.type);
|
|
452
522
|
const isTemplate = message.type === "template";
|
|
523
|
+
const isInteractive = message.type === "interactive";
|
|
453
524
|
const displayName = message.sender === "agent" && senderName ? senderName : bubble[message.sender] ?? message.sender;
|
|
454
525
|
const tooltipText = message.status === "read" && message.readAt ? `${bubble.readAt}${formatDateTime(message.readAt)}` : message.status === "failed" ? bubble.windowExpired : void 0;
|
|
455
526
|
const tailCornerClass = isFirstInGroup ? isMine ? "rounded-tr-md" : "rounded-tl-md" : "";
|
|
456
|
-
const checkbox = /* @__PURE__ */
|
|
527
|
+
const checkbox = /* @__PURE__ */ jsx9(
|
|
457
528
|
"button",
|
|
458
529
|
{
|
|
459
530
|
onClick: (e) => {
|
|
@@ -466,10 +537,10 @@ function MessageBubble({
|
|
|
466
537
|
${isSelected ? "bg-teal-600 border-teal-600" : "bg-white/80 dark:bg-black/40 border-black/20 dark:border-white/30"}
|
|
467
538
|
${isSelecting ? "opacity-100" : "opacity-0 group-hover:opacity-100"}
|
|
468
539
|
`,
|
|
469
|
-
children: isSelected && /* @__PURE__ */
|
|
540
|
+
children: isSelected && /* @__PURE__ */ jsx9(Check, { size: 12, className: "text-white", strokeWidth: 3 })
|
|
470
541
|
}
|
|
471
542
|
);
|
|
472
|
-
return /* @__PURE__ */
|
|
543
|
+
return /* @__PURE__ */ jsxs6(
|
|
473
544
|
"div",
|
|
474
545
|
{
|
|
475
546
|
className: cn(
|
|
@@ -480,7 +551,7 @@ function MessageBubble({
|
|
|
480
551
|
),
|
|
481
552
|
children: [
|
|
482
553
|
isMine && checkbox,
|
|
483
|
-
/* @__PURE__ */
|
|
554
|
+
/* @__PURE__ */ jsxs6(
|
|
484
555
|
"div",
|
|
485
556
|
{
|
|
486
557
|
onClick: isSelecting ? onToggleSelect : void 0,
|
|
@@ -493,121 +564,286 @@ function MessageBubble({
|
|
|
493
564
|
relative
|
|
494
565
|
`,
|
|
495
566
|
children: [
|
|
496
|
-
isMine && isFirstInGroup && (message.sender === "bot" || message.sender === "agent" && senderName) && /* @__PURE__ */
|
|
497
|
-
message.moderation?.isOffensive && /* @__PURE__ */
|
|
567
|
+
isMine && isFirstInGroup && (message.sender === "bot" || message.sender === "agent" && senderName) && /* @__PURE__ */ jsx9("div", { className: "text-xs font-semibold mb-0.5 text-teal-700 dark:text-teal-400", children: displayName }),
|
|
568
|
+
message.moderation?.isOffensive && /* @__PURE__ */ jsxs6(
|
|
498
569
|
"div",
|
|
499
570
|
{
|
|
500
571
|
className: "mb-1 inline-flex items-center gap-1 rounded-full bg-amber-100 px-2 py-0.5 text-xs font-medium text-amber-800 dark:bg-amber-950/60 dark:text-amber-300",
|
|
501
572
|
title: message.moderation.terms.length > 0 ? message.moderation.terms.join(", ") : void 0,
|
|
502
573
|
children: [
|
|
503
|
-
/* @__PURE__ */
|
|
504
|
-
/* @__PURE__ */
|
|
574
|
+
/* @__PURE__ */ jsx9("span", { "aria-hidden": true, children: "\u26A0\uFE0F" }),
|
|
575
|
+
/* @__PURE__ */ jsx9("span", { children: bubble.moderationFlagged })
|
|
505
576
|
]
|
|
506
577
|
}
|
|
507
578
|
),
|
|
508
|
-
isMedia ? /* @__PURE__ */
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
579
|
+
isMedia ? /* @__PURE__ */ jsx9(MediaRenderer, { message, onLightbox: setLightboxSrc, onResolveUrl: resolveMediaUrl }) : isInteractive && message.payload ? (
|
|
580
|
+
// O texto da mensagem interativa mora dentro do payload (`body.text`), e `content` guarda
|
|
581
|
+
// só uma cópia achatada para busca — renderizar `content` aqui duplicaria o corpo.
|
|
582
|
+
/* @__PURE__ */ jsx9(InteractiveMessage, { payload: message.payload, onSelect: onInteractiveSelect })
|
|
583
|
+
) : /* @__PURE__ */ jsxs6(Fragment, { children: [
|
|
584
|
+
isTemplate && /* @__PURE__ */ jsxs6("p", { className: "text-xs text-gray-500 dark:text-gray-400 flex items-center gap-1 mb-0.5", children: [
|
|
585
|
+
/* @__PURE__ */ jsx9("span", { children: "\u{1F4E8}" }),
|
|
586
|
+
/* @__PURE__ */ jsxs6("span", { className: "font-medium", children: [
|
|
512
587
|
bubble.templateLabel,
|
|
513
588
|
message.templateName ? ` \u2014 ${message.templateName}` : ""
|
|
514
589
|
] })
|
|
515
590
|
] }),
|
|
516
|
-
/* @__PURE__ */
|
|
591
|
+
/* @__PURE__ */ jsx9("div", { className: "text-sm text-gray-900 dark:text-gray-100 whitespace-pre-wrap break-words leading-[19px]", children: parseWhatsAppFormatting(message.content ?? "") })
|
|
517
592
|
] }),
|
|
518
|
-
/* @__PURE__ */
|
|
519
|
-
/* @__PURE__ */
|
|
520
|
-
isMine && message.status && /* @__PURE__ */
|
|
593
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-end gap-1 mt-0.5 select-none", children: [
|
|
594
|
+
/* @__PURE__ */ jsx9("span", { className: "text-xs text-black/40 dark:text-white/40 font-medium", children: formatTimestamp(message.timestamp) }),
|
|
595
|
+
isMine && message.status && /* @__PURE__ */ jsx9(StatusTicks, { status: message.status, title: tooltipText })
|
|
521
596
|
] })
|
|
522
597
|
]
|
|
523
598
|
}
|
|
524
599
|
),
|
|
525
600
|
!isMine && checkbox,
|
|
526
|
-
lightboxSrc && /* @__PURE__ */
|
|
601
|
+
lightboxSrc && /* @__PURE__ */ jsx9(Lightbox, { imageUrl: lightboxSrc, onClose: () => setLightboxSrc(null) })
|
|
527
602
|
]
|
|
528
603
|
}
|
|
529
604
|
);
|
|
530
605
|
}
|
|
531
606
|
|
|
532
607
|
// src/Wallpaper.tsx
|
|
533
|
-
import { jsx as
|
|
608
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
534
609
|
function ConversationWallpaper({ children, className }) {
|
|
535
|
-
return /* @__PURE__ */
|
|
610
|
+
return /* @__PURE__ */ jsx10("div", { className: cn("cv-wallpaper", className), children });
|
|
536
611
|
}
|
|
537
612
|
|
|
538
|
-
// src/
|
|
539
|
-
import { useState as useState4, useCallback } from "react";
|
|
540
|
-
import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
613
|
+
// src/emojiCatalog.ts
|
|
541
614
|
var EMOJI_CATEGORIES = [
|
|
542
615
|
{
|
|
543
616
|
name: "Smileys",
|
|
544
|
-
|
|
617
|
+
entries: [
|
|
618
|
+
{ emoji: "\u{1F600}", keywords: ["sorriso", "feliz", "alegre"] },
|
|
619
|
+
{ emoji: "\u{1F603}", keywords: ["sorriso", "feliz", "animado"] },
|
|
620
|
+
{ emoji: "\u{1F604}", keywords: ["sorriso", "feliz", "risada"] },
|
|
621
|
+
{ emoji: "\u{1F601}", keywords: ["sorriso", "dentes", "feliz"] },
|
|
622
|
+
{ emoji: "\u{1F605}", keywords: ["alivio", "al\xEDvio", "suor", "nervoso"] },
|
|
623
|
+
{ emoji: "\u{1F602}", keywords: ["risada", "chorando", "engracado", "engra\xE7ado"] },
|
|
624
|
+
{ emoji: "\u{1F923}", keywords: ["risada", "rolando", "engracado", "engra\xE7ado"] },
|
|
625
|
+
{ emoji: "\u{1F60A}", keywords: ["sorriso", "timido", "t\xEDmido", "feliz"] },
|
|
626
|
+
{ emoji: "\u{1F607}", keywords: ["anjo", "inocente", "santo"] },
|
|
627
|
+
{ emoji: "\u{1F642}", keywords: ["sorriso", "leve", "ok"] },
|
|
628
|
+
{ emoji: "\u{1F609}", keywords: ["piscada", "piscar", "flerte"] },
|
|
629
|
+
{ emoji: "\u{1F60C}", keywords: ["aliviado", "calmo", "tranquilo"] },
|
|
630
|
+
{ emoji: "\u{1F60D}", keywords: ["amor", "apaixonado", "coracao", "cora\xE7\xE3o", "olhos"] },
|
|
631
|
+
{ emoji: "\u{1F970}", keywords: ["amor", "apaixonado", "carinho"] },
|
|
632
|
+
{ emoji: "\u{1F618}", keywords: ["beijo", "amor", "carinho"] },
|
|
633
|
+
{ emoji: "\u{1F60B}", keywords: ["gostoso", "delicia", "del\xEDcia", "lingua", "l\xEDngua"] },
|
|
634
|
+
{ emoji: "\u{1F61C}", keywords: ["lingua", "l\xEDngua", "brincadeira", "piscada"] },
|
|
635
|
+
{ emoji: "\u{1F92A}", keywords: ["maluco", "doido", "brincadeira"] },
|
|
636
|
+
{ emoji: "\u{1F914}", keywords: ["pensando", "duvida", "d\xFAvida", "hmm"] },
|
|
637
|
+
{ emoji: "\u{1F917}", keywords: ["abraco", "abra\xE7o", "carinho"] },
|
|
638
|
+
{ emoji: "\u{1F610}", keywords: ["neutro", "serio", "s\xE9rio", "indiferente"] },
|
|
639
|
+
{ emoji: "\u{1F634}", keywords: ["dormindo", "sono", "cansado"] },
|
|
640
|
+
{ emoji: "\u{1F62D}", keywords: ["chorando", "triste", "lagrima", "l\xE1grima"] },
|
|
641
|
+
{ emoji: "\u{1F622}", keywords: ["triste", "chorando", "lagrima", "l\xE1grima"] },
|
|
642
|
+
{ emoji: "\u{1F621}", keywords: ["raiva", "bravo", "irritado"] },
|
|
643
|
+
{ emoji: "\u{1F631}", keywords: ["susto", "medo", "assustado"] },
|
|
644
|
+
{ emoji: "\u{1F92F}", keywords: ["explodindo", "chocado", "surpresa"] },
|
|
645
|
+
{ emoji: "\u{1F60E}", keywords: ["oculos", "\xF3culos", "legal", "estiloso"] },
|
|
646
|
+
{ emoji: "\u{1F973}", keywords: ["festa", "comemorar", "aniversario", "anivers\xE1rio"] },
|
|
647
|
+
{ emoji: "\u{1F637}", keywords: ["mascara", "m\xE1scara", "doente", "saude", "sa\xFAde"] }
|
|
648
|
+
]
|
|
545
649
|
},
|
|
546
650
|
{
|
|
547
|
-
name: "
|
|
548
|
-
|
|
651
|
+
name: "Gestos",
|
|
652
|
+
entries: [
|
|
653
|
+
{ emoji: "\u{1F44D}", keywords: ["joia", "j\xF3ia", "polegar", "ok", "positivo", "curtir"] },
|
|
654
|
+
{ emoji: "\u{1F44E}", keywords: ["polegar", "negativo", "ruim", "nao", "n\xE3o"] },
|
|
655
|
+
{ emoji: "\u{1F44C}", keywords: ["ok", "certo", "perfeito"] },
|
|
656
|
+
{ emoji: "\u270C\uFE0F", keywords: ["paz", "vitoria", "vit\xF3ria", "dois"] },
|
|
657
|
+
{ emoji: "\u{1F91E}", keywords: ["sorte", "dedos", "cruzados", "torcendo"] },
|
|
658
|
+
{ emoji: "\u{1F919}", keywords: ["chama", "ligar", "shaka"] },
|
|
659
|
+
{ emoji: "\u{1F44B}", keywords: ["tchau", "ola", "ol\xE1", "aceno", "oi"] },
|
|
660
|
+
{ emoji: "\u270B", keywords: ["mao", "m\xE3o", "parar", "pare"] },
|
|
661
|
+
{ emoji: "\u{1F44F}", keywords: ["palmas", "aplauso", "parabens", "parab\xE9ns"] },
|
|
662
|
+
{ emoji: "\u{1F64C}", keywords: ["comemorar", "maos", "m\xE3os", "sucesso"] },
|
|
663
|
+
{ emoji: "\u{1F91D}", keywords: ["acordo", "aperto", "mao", "m\xE3o", "negocio", "neg\xF3cio", "parceria"] },
|
|
664
|
+
{ emoji: "\u{1F64F}", keywords: ["obrigado", "reza", "oracao", "ora\xE7\xE3o", "por favor"] },
|
|
665
|
+
{ emoji: "\u270D\uFE0F", keywords: ["escrever", "assinar", "assinatura"] },
|
|
666
|
+
{ emoji: "\u{1F4AA}", keywords: ["forca", "for\xE7a", "musculo", "m\xFAsculo", "braco", "bra\xE7o"] },
|
|
667
|
+
{ emoji: "\u{1F447}", keywords: ["abaixo", "baixo", "apontar", "seta"] },
|
|
668
|
+
{ emoji: "\u{1F449}", keywords: ["direita", "apontar", "seta"] },
|
|
669
|
+
{ emoji: "\u261D\uFE0F", keywords: ["acima", "cima", "apontar", "atencao", "aten\xE7\xE3o"] }
|
|
670
|
+
]
|
|
549
671
|
},
|
|
550
672
|
{
|
|
551
|
-
name: "
|
|
552
|
-
|
|
673
|
+
name: "Cora\xE7\xF5es",
|
|
674
|
+
entries: [
|
|
675
|
+
{ emoji: "\u2764\uFE0F", keywords: ["coracao", "cora\xE7\xE3o", "amor", "vermelho"] },
|
|
676
|
+
{ emoji: "\u{1F9E1}", keywords: ["coracao", "cora\xE7\xE3o", "laranja"] },
|
|
677
|
+
{ emoji: "\u{1F49B}", keywords: ["coracao", "cora\xE7\xE3o", "amarelo"] },
|
|
678
|
+
{ emoji: "\u{1F49A}", keywords: ["coracao", "cora\xE7\xE3o", "verde"] },
|
|
679
|
+
{ emoji: "\u{1F499}", keywords: ["coracao", "cora\xE7\xE3o", "azul"] },
|
|
680
|
+
{ emoji: "\u{1F49C}", keywords: ["coracao", "cora\xE7\xE3o", "roxo"] },
|
|
681
|
+
{ emoji: "\u{1F5A4}", keywords: ["coracao", "cora\xE7\xE3o", "preto"] },
|
|
682
|
+
{ emoji: "\u{1F90D}", keywords: ["coracao", "cora\xE7\xE3o", "branco"] },
|
|
683
|
+
{ emoji: "\u{1F494}", keywords: ["coracao", "cora\xE7\xE3o", "partido", "triste"] },
|
|
684
|
+
{ emoji: "\u{1F495}", keywords: ["coracao", "cora\xE7\xE3o", "amor", "casal"] },
|
|
685
|
+
{ emoji: "\u{1F496}", keywords: ["coracao", "cora\xE7\xE3o", "brilho", "amor"] },
|
|
686
|
+
{ emoji: "\u{1F49D}", keywords: ["coracao", "cora\xE7\xE3o", "presente", "laco", "la\xE7o"] }
|
|
687
|
+
]
|
|
553
688
|
},
|
|
554
689
|
{
|
|
555
|
-
name: "
|
|
556
|
-
|
|
690
|
+
name: "Neg\xF3cios",
|
|
691
|
+
entries: [
|
|
692
|
+
{ emoji: "\u{1F3E0}", keywords: ["casa", "imovel", "im\xF3vel", "residencia", "resid\xEAncia", "moradia"] },
|
|
693
|
+
{ emoji: "\u{1F3E1}", keywords: ["casa", "imovel", "im\xF3vel", "jardim", "moradia"] },
|
|
694
|
+
{ emoji: "\u{1F3E2}", keywords: ["predio", "pr\xE9dio", "empresa", "escritorio", "escrit\xF3rio"] },
|
|
695
|
+
{ emoji: "\u{1F3E6}", keywords: ["banco", "financiamento", "agencia", "ag\xEAncia"] },
|
|
696
|
+
{ emoji: "\u{1F511}", keywords: ["chave", "casa", "entrega", "imovel", "im\xF3vel"] },
|
|
697
|
+
{ emoji: "\u{1F4C4}", keywords: ["documento", "papel", "contrato", "arquivo"] },
|
|
698
|
+
{ emoji: "\u{1F4CB}", keywords: ["prancheta", "lista", "documento", "checklist"] },
|
|
699
|
+
{ emoji: "\u{1F4DD}", keywords: ["anotar", "escrever", "nota", "formulario", "formul\xE1rio"] },
|
|
700
|
+
{ emoji: "\u2705", keywords: ["ok", "certo", "aprovado", "concluido", "conclu\xEDdo", "check"] },
|
|
701
|
+
{ emoji: "\u274C", keywords: ["errado", "negado", "recusado", "cancelar"] },
|
|
702
|
+
{ emoji: "\u26A0\uFE0F", keywords: ["atencao", "aten\xE7\xE3o", "alerta", "cuidado"] },
|
|
703
|
+
{ emoji: "\u{1F4B0}", keywords: ["dinheiro", "valor", "saco", "grana", "pagamento"] },
|
|
704
|
+
{ emoji: "\u{1F4B5}", keywords: ["dinheiro", "nota", "valor", "pagamento"] },
|
|
705
|
+
{ emoji: "\u{1F4B3}", keywords: ["cartao", "cart\xE3o", "credito", "cr\xE9dito", "pagamento"] },
|
|
706
|
+
{ emoji: "\u{1F9FE}", keywords: ["recibo", "nota", "fiscal", "comprovante"] },
|
|
707
|
+
{ emoji: "\u{1F4CA}", keywords: ["grafico", "gr\xE1fico", "relatorio", "relat\xF3rio", "dados"] },
|
|
708
|
+
{ emoji: "\u{1F4C8}", keywords: ["grafico", "gr\xE1fico", "subindo", "crescimento", "alta"] },
|
|
709
|
+
{ emoji: "\u{1F4C9}", keywords: ["grafico", "gr\xE1fico", "caindo", "queda", "baixa"] },
|
|
710
|
+
{ emoji: "\u{1F5D3}\uFE0F", keywords: ["calendario", "calend\xE1rio", "data", "agenda", "prazo"] },
|
|
711
|
+
{ emoji: "\u23F0", keywords: ["relogio", "rel\xF3gio", "hora", "prazo", "alarme"] },
|
|
712
|
+
{ emoji: "\u{1F4DE}", keywords: ["telefone", "ligar", "contato", "chamada"] },
|
|
713
|
+
{ emoji: "\u{1F4F1}", keywords: ["celular", "telefone", "whatsapp", "contato"] },
|
|
714
|
+
{ emoji: "\u{1F4E7}", keywords: ["email", "e-mail", "mensagem", "contato"] },
|
|
715
|
+
{ emoji: "\u{1F4CE}", keywords: ["anexo", "clipe", "arquivo"] },
|
|
716
|
+
{ emoji: "\u{1F50D}", keywords: ["buscar", "procurar", "lupa", "pesquisa", "consulta"] },
|
|
717
|
+
{ emoji: "\u{1F916}", keywords: ["robo", "rob\xF4", "bot", "assistente", "automatico", "autom\xE1tico"] },
|
|
718
|
+
{ emoji: "\u{1F4AC}", keywords: ["mensagem", "conversa", "balao", "bal\xE3o", "chat"] }
|
|
719
|
+
]
|
|
557
720
|
},
|
|
558
721
|
{
|
|
559
|
-
name: "
|
|
560
|
-
|
|
722
|
+
name: "Objetos",
|
|
723
|
+
entries: [
|
|
724
|
+
{ emoji: "\u{1F381}", keywords: ["presente", "brinde", "surpresa"] },
|
|
725
|
+
{ emoji: "\u{1F389}", keywords: ["festa", "comemorar", "parabens", "parab\xE9ns"] },
|
|
726
|
+
{ emoji: "\u{1F38A}", keywords: ["festa", "confete", "comemorar"] },
|
|
727
|
+
{ emoji: "\u{1F382}", keywords: ["bolo", "aniversario", "anivers\xE1rio", "festa"] },
|
|
728
|
+
{ emoji: "\u{1F4A1}", keywords: ["ideia", "ide\xEDa", "lampada", "l\xE2mpada", "dica"] },
|
|
729
|
+
{ emoji: "\u{1F514}", keywords: ["sino", "aviso", "notificacao", "notifica\xE7\xE3o", "lembrete"] },
|
|
730
|
+
{ emoji: "\u2B50", keywords: ["estrela", "favorito", "avaliacao", "avalia\xE7\xE3o"] },
|
|
731
|
+
{ emoji: "\u{1F525}", keywords: ["fogo", "quente", "destaque", "top"] },
|
|
732
|
+
{ emoji: "\u{1F680}", keywords: ["foguete", "rapido", "r\xE1pido", "lancamento", "lan\xE7amento"] },
|
|
733
|
+
{ emoji: "\u{1F4BB}", keywords: ["computador", "notebook", "trabalho"] },
|
|
734
|
+
{ emoji: "\u{1F4F7}", keywords: ["foto", "camera", "c\xE2mera", "imagem"] },
|
|
735
|
+
{ emoji: "\u{1F697}", keywords: ["carro", "veiculo", "ve\xEDculo", "automovel", "autom\xF3vel"] },
|
|
736
|
+
{ emoji: "\u2708\uFE0F", keywords: ["aviao", "avi\xE3o", "viagem", "voo"] }
|
|
737
|
+
]
|
|
561
738
|
},
|
|
562
739
|
{
|
|
563
|
-
name: "
|
|
564
|
-
|
|
740
|
+
name: "Comida",
|
|
741
|
+
entries: [
|
|
742
|
+
{ emoji: "\u{1F354}", keywords: ["hamburguer", "hamb\xFArguer", "lanche", "comida"] },
|
|
743
|
+
{ emoji: "\u{1F355}", keywords: ["pizza", "comida", "lanche"] },
|
|
744
|
+
{ emoji: "\u{1F35F}", keywords: ["batata", "frita", "lanche"] },
|
|
745
|
+
{ emoji: "\u{1F37F}", keywords: ["pipoca", "cinema", "filme"] },
|
|
746
|
+
{ emoji: "\u{1F35E}", keywords: ["pao", "p\xE3o", "padaria"] },
|
|
747
|
+
{ emoji: "\u{1F9C0}", keywords: ["queijo", "comida"] },
|
|
748
|
+
{ emoji: "\u{1F957}", keywords: ["salada", "saudavel", "saud\xE1vel", "comida"] },
|
|
749
|
+
{ emoji: "\u2615", keywords: ["cafe", "caf\xE9", "bebida", "quente"] },
|
|
750
|
+
{ emoji: "\u{1F37A}", keywords: ["cerveja", "bebida", "chopp"] },
|
|
751
|
+
{ emoji: "\u{1F377}", keywords: ["vinho", "bebida", "taca", "ta\xE7a"] },
|
|
752
|
+
{ emoji: "\u{1F942}", keywords: ["brinde", "comemorar", "champanhe"] },
|
|
753
|
+
{ emoji: "\u{1F964}", keywords: ["refrigerante", "bebida", "copo"] }
|
|
754
|
+
]
|
|
565
755
|
}
|
|
566
756
|
];
|
|
567
|
-
var
|
|
568
|
-
|
|
757
|
+
var ALL_ENTRIES = EMOJI_CATEGORIES.flatMap((category) => category.entries);
|
|
758
|
+
function normalize(value) {
|
|
759
|
+
return value.toLowerCase().normalize("NFD").replace(/\p{Diacritic}/gu, "").trim();
|
|
760
|
+
}
|
|
761
|
+
function searchEmojis(query) {
|
|
762
|
+
const term = normalize(query);
|
|
763
|
+
if (!term) return ALL_ENTRIES;
|
|
764
|
+
return ALL_ENTRIES.filter((entry) => entry.keywords.some((keyword) => normalize(keyword).startsWith(term)));
|
|
765
|
+
}
|
|
766
|
+
|
|
767
|
+
// src/EmojiPicker.tsx
|
|
768
|
+
import { useState as useState5, useCallback, useMemo as useMemo2 } from "react";
|
|
769
|
+
import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
770
|
+
var DEFAULT_EMOJI_PICKER_LABELS = {
|
|
771
|
+
search: "Buscar emoji",
|
|
772
|
+
noResults: "Nenhum emoji encontrado"
|
|
773
|
+
};
|
|
774
|
+
var EmojiPicker = ({ onSelect, labels, className = "" }) => {
|
|
775
|
+
const searchLabel = labels?.search ?? DEFAULT_EMOJI_PICKER_LABELS.search;
|
|
776
|
+
const noResultsLabel = labels?.noResults ?? DEFAULT_EMOJI_PICKER_LABELS.noResults;
|
|
777
|
+
const [activeCategory, setActiveCategory] = useState5(0);
|
|
778
|
+
const [query, setQuery] = useState5("");
|
|
569
779
|
const handleSelect = useCallback(
|
|
570
780
|
(emoji) => {
|
|
571
781
|
onSelect(emoji);
|
|
572
782
|
},
|
|
573
783
|
[onSelect]
|
|
574
784
|
);
|
|
575
|
-
|
|
576
|
-
|
|
785
|
+
const isSearching = query.trim().length > 0;
|
|
786
|
+
const visibleEntries = useMemo2(
|
|
787
|
+
() => isSearching ? searchEmojis(query) : EMOJI_CATEGORIES[activeCategory].entries,
|
|
788
|
+
[isSearching, query, activeCategory]
|
|
789
|
+
);
|
|
790
|
+
return /* @__PURE__ */ jsxs7("div", { className: `bg-white border border-gray-200 rounded-lg shadow-lg overflow-hidden ${className}`, children: [
|
|
791
|
+
/* @__PURE__ */ jsx11("div", { className: "p-2 border-b border-gray-200", children: /* @__PURE__ */ jsx11(
|
|
792
|
+
"input",
|
|
793
|
+
{
|
|
794
|
+
type: "search",
|
|
795
|
+
value: query,
|
|
796
|
+
onChange: (event) => setQuery(event.target.value),
|
|
797
|
+
placeholder: searchLabel,
|
|
798
|
+
"aria-label": searchLabel,
|
|
799
|
+
className: "w-full rounded-md border border-gray-200 px-2 py-1.5 text-sm outline-none focus:border-blue-500"
|
|
800
|
+
}
|
|
801
|
+
) }),
|
|
802
|
+
isSearching ? null : /* @__PURE__ */ jsx11("div", { className: "flex border-b border-gray-200 overflow-x-auto", children: EMOJI_CATEGORIES.map((category, index) => /* @__PURE__ */ jsxs7(
|
|
577
803
|
"button",
|
|
578
804
|
{
|
|
579
805
|
onClick: () => setActiveCategory(index),
|
|
580
806
|
className: `px-3 py-2 text-xs font-medium whitespace-nowrap border-b-2 transition-colors ${activeCategory === index ? "border-blue-500 text-blue-600" : "border-transparent text-gray-500 hover:text-gray-700"}`,
|
|
581
807
|
children: [
|
|
582
|
-
category.
|
|
808
|
+
category.entries[0].emoji,
|
|
583
809
|
" ",
|
|
584
810
|
category.name
|
|
585
811
|
]
|
|
586
812
|
},
|
|
587
813
|
category.name
|
|
588
814
|
)) }),
|
|
589
|
-
/* @__PURE__ */
|
|
815
|
+
visibleEntries.length === 0 ? /* @__PURE__ */ jsx11("p", { className: "px-3 py-6 text-center text-sm text-gray-500", children: noResultsLabel }) : /* @__PURE__ */ jsx11("div", { className: "grid grid-cols-10 gap-0.5 p-2 max-h-[240px] overflow-y-auto", children: visibleEntries.map((entry) => /* @__PURE__ */ jsx11(
|
|
590
816
|
"button",
|
|
591
817
|
{
|
|
592
|
-
onClick: () => handleSelect(emoji),
|
|
818
|
+
onClick: () => handleSelect(entry.emoji),
|
|
593
819
|
className: "w-8 h-8 flex items-center justify-center text-lg hover:bg-gray-100 rounded transition-colors cursor-pointer",
|
|
594
|
-
"aria-label": emoji,
|
|
595
|
-
|
|
820
|
+
"aria-label": entry.emoji,
|
|
821
|
+
title: entry.keywords[0],
|
|
822
|
+
children: entry.emoji
|
|
596
823
|
},
|
|
597
|
-
emoji
|
|
824
|
+
entry.emoji
|
|
598
825
|
)) })
|
|
599
826
|
] });
|
|
600
827
|
};
|
|
601
828
|
|
|
602
829
|
// src/MessageComposer.tsx
|
|
603
|
-
import { useState as
|
|
604
|
-
import { Fragment as Fragment2, jsx as
|
|
830
|
+
import { useState as useState6, useRef as useRef2, useCallback as useCallback2 } from "react";
|
|
831
|
+
import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
605
832
|
var DEFAULT_MESSAGE_COMPOSER_LABELS = {
|
|
606
833
|
emoji: "Emoji",
|
|
607
834
|
attach: "Anexar",
|
|
608
835
|
send: "Enviar"
|
|
609
836
|
};
|
|
610
|
-
var DEFAULT_ACCEPTED_FILE_TYPES =
|
|
837
|
+
var DEFAULT_ACCEPTED_FILE_TYPES = [
|
|
838
|
+
"image/jpeg,image/png,image/webp",
|
|
839
|
+
"audio/aac,audio/mp4,audio/mpeg,audio/amr,audio/ogg",
|
|
840
|
+
"video/mp4,video/3gpp",
|
|
841
|
+
"application/pdf,text/plain,text/csv",
|
|
842
|
+
"application/msword,application/vnd.ms-excel,application/vnd.ms-powerpoint",
|
|
843
|
+
"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
|
844
|
+
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
|
845
|
+
"application/vnd.openxmlformats-officedocument.presentationml.presentation"
|
|
846
|
+
].join(",");
|
|
611
847
|
var MessageComposer = ({
|
|
612
848
|
onSend,
|
|
613
849
|
onAttach,
|
|
@@ -625,9 +861,9 @@ var MessageComposer = ({
|
|
|
625
861
|
const emojiLabel = labels?.emoji ?? DEFAULT_MESSAGE_COMPOSER_LABELS.emoji;
|
|
626
862
|
const attachLabel = labels?.attach ?? DEFAULT_MESSAGE_COMPOSER_LABELS.attach;
|
|
627
863
|
const sendLabel = labels?.send ?? DEFAULT_MESSAGE_COMPOSER_LABELS.send;
|
|
628
|
-
const [internalText, setInternalText] =
|
|
629
|
-
const [showEmoji, setShowEmoji] =
|
|
630
|
-
const [attachments, setAttachments] =
|
|
864
|
+
const [internalText, setInternalText] = useState6("");
|
|
865
|
+
const [showEmoji, setShowEmoji] = useState6(false);
|
|
866
|
+
const [attachments, setAttachments] = useState6([]);
|
|
631
867
|
const textareaRef = useRef2(null);
|
|
632
868
|
const fileInputRef = useRef2(null);
|
|
633
869
|
const isControlled = externalValue !== void 0;
|
|
@@ -721,25 +957,25 @@ var MessageComposer = ({
|
|
|
721
957
|
/* A barra é a superfície (cinza, largura cheia, sem raio) e o campo dentro é que arredonda —
|
|
722
958
|
ordem do WhatsApp. Invertido, o pill arredondado ia até a borda da tela e os cantos
|
|
723
959
|
descobriam o fundo branco da página, que lia como defeito. */
|
|
724
|
-
/* @__PURE__ */
|
|
725
|
-
attachments.length > 0 && /* @__PURE__ */
|
|
726
|
-
a.previewUrl ? /* @__PURE__ */
|
|
727
|
-
/* @__PURE__ */
|
|
728
|
-
/* @__PURE__ */
|
|
960
|
+
/* @__PURE__ */ jsxs8("div", { className: cn("bg-[#f0f2f5] px-2 py-2", className), children: [
|
|
961
|
+
attachments.length > 0 && /* @__PURE__ */ jsx12("div", { className: "flex gap-2 px-1 pb-2 overflow-x-auto", children: attachments.map((a, i) => /* @__PURE__ */ jsxs8("div", { className: "relative flex-shrink-0", children: [
|
|
962
|
+
a.previewUrl ? /* @__PURE__ */ jsx12("img", { src: a.previewUrl, alt: "", className: "w-16 h-16 object-cover rounded-lg border border-gray-200" }) : /* @__PURE__ */ jsx12("div", { className: "w-16 h-16 bg-gray-100 rounded-lg border border-gray-200 flex items-center justify-center", children: /* @__PURE__ */ jsxs8("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#9ca3af", strokeWidth: "1.5", children: [
|
|
963
|
+
/* @__PURE__ */ jsx12("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
|
|
964
|
+
/* @__PURE__ */ jsx12("polyline", { points: "14 2 14 8 20 8" })
|
|
729
965
|
] }) }),
|
|
730
|
-
/* @__PURE__ */
|
|
966
|
+
/* @__PURE__ */ jsx12("button", { onClick: () => removeAttachment(i), className: "absolute -top-2 -right-2 w-5 h-5 bg-gray-600 text-white rounded-full flex items-center justify-center hover:bg-gray-800 text-xs", children: "\u2715" })
|
|
731
967
|
] }, i)) }),
|
|
732
|
-
/* @__PURE__ */
|
|
733
|
-
showEmojiButton && /* @__PURE__ */
|
|
734
|
-
/* @__PURE__ */
|
|
735
|
-
/* @__PURE__ */
|
|
736
|
-
/* @__PURE__ */
|
|
737
|
-
/* @__PURE__ */
|
|
738
|
-
/* @__PURE__ */
|
|
968
|
+
/* @__PURE__ */ jsxs8("div", { className: cn("flex items-end gap-1.5 rounded-xl bg-white px-3 py-2", classNames?.field), children: [
|
|
969
|
+
showEmojiButton && /* @__PURE__ */ jsxs8("div", { className: "relative flex-shrink-0", children: [
|
|
970
|
+
/* @__PURE__ */ jsx12("button", { onClick: () => setShowEmoji((v) => !v), className: "w-9 h-9 flex items-center justify-center rounded-full text-gray-500 hover:bg-gray-200 transition-colors", "aria-label": emojiLabel, children: /* @__PURE__ */ jsxs8("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
971
|
+
/* @__PURE__ */ jsx12("circle", { cx: "12", cy: "12", r: "10" }),
|
|
972
|
+
/* @__PURE__ */ jsx12("path", { d: "M8 14s1.5 2 4 2 4-2 4-2" }),
|
|
973
|
+
/* @__PURE__ */ jsx12("circle", { cx: "9", cy: "9", r: "0.5", fill: "currentColor" }),
|
|
974
|
+
/* @__PURE__ */ jsx12("circle", { cx: "15", cy: "9", r: "0.5", fill: "currentColor" })
|
|
739
975
|
] }) }),
|
|
740
|
-
showEmoji && /* @__PURE__ */
|
|
976
|
+
showEmoji && /* @__PURE__ */ jsx12("div", { className: "absolute bottom-full left-0 mb-2 z-10", children: /* @__PURE__ */ jsx12(EmojiPicker, { onSelect: handleEmojiSelect }) })
|
|
741
977
|
] }),
|
|
742
|
-
/* @__PURE__ */
|
|
978
|
+
/* @__PURE__ */ jsx12(
|
|
743
979
|
"textarea",
|
|
744
980
|
{
|
|
745
981
|
ref: textareaRef,
|
|
@@ -756,31 +992,31 @@ var MessageComposer = ({
|
|
|
756
992
|
style: { fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif" }
|
|
757
993
|
}
|
|
758
994
|
),
|
|
759
|
-
showAttachButton && /* @__PURE__ */
|
|
760
|
-
/* @__PURE__ */
|
|
761
|
-
/* @__PURE__ */
|
|
995
|
+
showAttachButton && /* @__PURE__ */ jsxs8(Fragment2, { children: [
|
|
996
|
+
/* @__PURE__ */ jsx12("input", { ref: fileInputRef, type: "file", multiple: true, accept: acceptedFileTypes, onChange: handleFileChange, className: "hidden" }),
|
|
997
|
+
/* @__PURE__ */ jsx12("button", { onClick: () => fileInputRef.current?.click(), className: "w-9 h-9 flex items-center justify-center rounded-full text-gray-500 hover:bg-gray-200 flex-shrink-0 transition-colors", "aria-label": attachLabel, children: /* @__PURE__ */ jsx12("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx12("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) }) })
|
|
762
998
|
] }),
|
|
763
|
-
/* @__PURE__ */
|
|
999
|
+
/* @__PURE__ */ jsx12(
|
|
764
1000
|
"button",
|
|
765
1001
|
{
|
|
766
1002
|
onClick: sendMessage,
|
|
767
1003
|
disabled: !canSend || disabled,
|
|
768
1004
|
className: `w-10 h-10 flex items-center justify-center rounded-full flex-shrink-0 transition-all ${canSend && !disabled ? "bg-[#00a884] text-white hover:bg-[#06cf9c] shadow-sm" : "bg-gray-200 text-gray-400 cursor-not-allowed"}`,
|
|
769
1005
|
"aria-label": sendLabel,
|
|
770
|
-
children: /* @__PURE__ */
|
|
1006
|
+
children: /* @__PURE__ */ jsx12("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx12("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) })
|
|
771
1007
|
}
|
|
772
1008
|
)
|
|
773
1009
|
] }),
|
|
774
|
-
remaining !== null && /* @__PURE__ */
|
|
1010
|
+
remaining !== null && /* @__PURE__ */ jsx12("div", { className: "flex justify-end mt-1 pr-1", children: /* @__PURE__ */ jsx12("span", { className: `text-xs ${remaining < 20 ? "text-red-500" : "text-gray-400"}`, children: remaining }) })
|
|
775
1011
|
] })
|
|
776
1012
|
);
|
|
777
1013
|
};
|
|
778
1014
|
|
|
779
1015
|
// src/DateDivider.tsx
|
|
780
|
-
import { jsx as
|
|
1016
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
781
1017
|
function DateDivider({ iso, className, classNames }) {
|
|
782
1018
|
const { dateDivider } = useConversationLocales();
|
|
783
|
-
return /* @__PURE__ */
|
|
1019
|
+
return /* @__PURE__ */ jsx13("div", { className: cn("flex justify-center sticky top-0 z-10 my-2 pointer-events-none", classNames?.root, className), children: /* @__PURE__ */ jsx13(
|
|
784
1020
|
"span",
|
|
785
1021
|
{
|
|
786
1022
|
className: cn(
|
|
@@ -847,11 +1083,11 @@ function phoneInitials(number) {
|
|
|
847
1083
|
}
|
|
848
1084
|
|
|
849
1085
|
// src/hooks/useAsyncResource.ts
|
|
850
|
-
import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef3, useState as
|
|
1086
|
+
import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef3, useState as useState7 } from "react";
|
|
851
1087
|
function useAsyncResource(fetcher, deps) {
|
|
852
|
-
const [data, setData] =
|
|
853
|
-
const [loading, setLoading] =
|
|
854
|
-
const [error, setError] =
|
|
1088
|
+
const [data, setData] = useState7(void 0);
|
|
1089
|
+
const [loading, setLoading] = useState7(false);
|
|
1090
|
+
const [error, setError] = useState7(void 0);
|
|
855
1091
|
const requestIdRef = useRef3(0);
|
|
856
1092
|
const load = useCallback3(async () => {
|
|
857
1093
|
const requestId = ++requestIdRef.current;
|
|
@@ -901,9 +1137,9 @@ function useConversationDocuments(conversationId, params) {
|
|
|
901
1137
|
}
|
|
902
1138
|
|
|
903
1139
|
// src/ConversationDocumentsPanel.tsx
|
|
904
|
-
import { useState as
|
|
1140
|
+
import { useState as useState8 } from "react";
|
|
905
1141
|
import { ArrowUpDown, Bot, Download, Eye, Users } from "lucide-react";
|
|
906
|
-
import { jsx as
|
|
1142
|
+
import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
907
1143
|
var DOCUMENT_SOURCE_FILTER = {
|
|
908
1144
|
ALL: "all",
|
|
909
1145
|
CUSTOMER: "customer",
|
|
@@ -943,12 +1179,12 @@ function ConversationDocumentsPanel({
|
|
|
943
1179
|
}) {
|
|
944
1180
|
const labels = { ...DEFAULT_CONVERSATION_DOCUMENTS_LABELS, ...labelsOverride };
|
|
945
1181
|
const context = useConversations();
|
|
946
|
-
const [search, setSearch] =
|
|
947
|
-
const [sourceFilter, setSourceFilter] =
|
|
948
|
-
const [sortDirection, setSortDirection] =
|
|
949
|
-
const [page, setPage] =
|
|
950
|
-
const [selectedIds, setSelectedIds] =
|
|
951
|
-
const [archiveError, setArchiveError] =
|
|
1182
|
+
const [search, setSearch] = useState8("");
|
|
1183
|
+
const [sourceFilter, setSourceFilter] = useState8(DOCUMENT_SOURCE_FILTER.ALL);
|
|
1184
|
+
const [sortDirection, setSortDirection] = useState8("desc");
|
|
1185
|
+
const [page, setPage] = useState8(1);
|
|
1186
|
+
const [selectedIds, setSelectedIds] = useState8([]);
|
|
1187
|
+
const [archiveError, setArchiveError] = useState8(false);
|
|
952
1188
|
const hasFilters = search !== "" || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== "desc";
|
|
953
1189
|
const { documents, total, loading, error } = useConversationDocuments(open ? conversationId : void 0, {
|
|
954
1190
|
search,
|
|
@@ -999,10 +1235,10 @@ function ConversationDocumentsPanel({
|
|
|
999
1235
|
}
|
|
1000
1236
|
}
|
|
1001
1237
|
if (!open) return null;
|
|
1002
|
-
return /* @__PURE__ */
|
|
1003
|
-
/* @__PURE__ */
|
|
1004
|
-
/* @__PURE__ */
|
|
1005
|
-
/* @__PURE__ */
|
|
1238
|
+
return /* @__PURE__ */ jsx14("div", { className: cn("border-b", classNames?.root, className), children: /* @__PURE__ */ jsxs9("section", { className: cn("px-4 py-3", classNames?.body), children: [
|
|
1239
|
+
/* @__PURE__ */ jsx14("p", { className: cn("mb-2 text-sm font-medium", classNames?.title), children: labels.title }),
|
|
1240
|
+
/* @__PURE__ */ jsxs9("div", { className: cn("mb-2 flex flex-wrap items-center gap-2 border-b pb-2", classNames?.filters), children: [
|
|
1241
|
+
/* @__PURE__ */ jsx14(
|
|
1006
1242
|
"input",
|
|
1007
1243
|
{
|
|
1008
1244
|
type: "search",
|
|
@@ -1013,7 +1249,7 @@ function ConversationDocumentsPanel({
|
|
|
1013
1249
|
className: cn("w-full rounded-md border px-3 py-2 text-sm sm:w-52", classNames?.search)
|
|
1014
1250
|
}
|
|
1015
1251
|
),
|
|
1016
|
-
/* @__PURE__ */
|
|
1252
|
+
/* @__PURE__ */ jsxs9(
|
|
1017
1253
|
"select",
|
|
1018
1254
|
{
|
|
1019
1255
|
value: sourceFilter,
|
|
@@ -1021,25 +1257,25 @@ function ConversationDocumentsPanel({
|
|
|
1021
1257
|
"aria-label": labels.sourceFilterAll,
|
|
1022
1258
|
className: cn("w-full rounded-md border px-2 py-2 text-sm sm:w-36", classNames?.sourceSelect),
|
|
1023
1259
|
children: [
|
|
1024
|
-
/* @__PURE__ */
|
|
1025
|
-
/* @__PURE__ */
|
|
1026
|
-
/* @__PURE__ */
|
|
1260
|
+
/* @__PURE__ */ jsx14("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
|
|
1261
|
+
/* @__PURE__ */ jsx14("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
|
|
1262
|
+
/* @__PURE__ */ jsx14("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
|
|
1027
1263
|
]
|
|
1028
1264
|
}
|
|
1029
1265
|
),
|
|
1030
|
-
/* @__PURE__ */
|
|
1266
|
+
/* @__PURE__ */ jsxs9(
|
|
1031
1267
|
"button",
|
|
1032
1268
|
{
|
|
1033
1269
|
type: "button",
|
|
1034
1270
|
onClick: () => applyFilter(() => setSortDirection(sortDirection === "desc" ? "asc" : "desc")),
|
|
1035
1271
|
className: cn("cv-header-action inline-flex items-center gap-1", classNames?.sortButton),
|
|
1036
1272
|
children: [
|
|
1037
|
-
/* @__PURE__ */
|
|
1273
|
+
/* @__PURE__ */ jsx14(ArrowUpDown, { size: 14 }),
|
|
1038
1274
|
sortDirection === "desc" ? labels.sortMostRecent : labels.sortOldest
|
|
1039
1275
|
]
|
|
1040
1276
|
}
|
|
1041
1277
|
),
|
|
1042
|
-
hasFilters ? /* @__PURE__ */
|
|
1278
|
+
hasFilters ? /* @__PURE__ */ jsx14(
|
|
1043
1279
|
"button",
|
|
1044
1280
|
{
|
|
1045
1281
|
type: "button",
|
|
@@ -1053,12 +1289,12 @@ function ConversationDocumentsPanel({
|
|
|
1053
1289
|
}
|
|
1054
1290
|
) : null
|
|
1055
1291
|
] }),
|
|
1056
|
-
loading ? /* @__PURE__ */
|
|
1057
|
-
error ? /* @__PURE__ */
|
|
1058
|
-
!loading && !error && documents.length === 0 ? /* @__PURE__ */
|
|
1059
|
-
canArchive && documents.length > 0 ? /* @__PURE__ */
|
|
1060
|
-
/* @__PURE__ */
|
|
1061
|
-
/* @__PURE__ */
|
|
1292
|
+
loading ? /* @__PURE__ */ jsx14("p", { className: cn("text-xs text-gray-500", classNames?.status), children: labels.loading }) : null,
|
|
1293
|
+
error ? /* @__PURE__ */ jsx14("p", { role: "alert", className: cn("text-xs text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
|
|
1294
|
+
!loading && !error && documents.length === 0 ? /* @__PURE__ */ jsx14("p", { className: cn("text-xs text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
|
|
1295
|
+
canArchive && documents.length > 0 ? /* @__PURE__ */ jsxs9("div", { className: cn("mb-2 flex flex-wrap items-center gap-3 text-xs", classNames?.selectionBar), children: [
|
|
1296
|
+
/* @__PURE__ */ jsxs9("label", { className: "inline-flex items-center gap-1.5", children: [
|
|
1297
|
+
/* @__PURE__ */ jsx14(
|
|
1062
1298
|
"input",
|
|
1063
1299
|
{
|
|
1064
1300
|
type: "checkbox",
|
|
@@ -1069,13 +1305,13 @@ function ConversationDocumentsPanel({
|
|
|
1069
1305
|
),
|
|
1070
1306
|
labels.selectAll
|
|
1071
1307
|
] }),
|
|
1072
|
-
selectedIds.length > 0 ? /* @__PURE__ */
|
|
1073
|
-
archiveError ? /* @__PURE__ */
|
|
1308
|
+
selectedIds.length > 0 ? /* @__PURE__ */ jsx14("button", { type: "button", onClick: () => void handleDownloadSelected(), className: "cv-header-action", children: labels.downloadSelected(selectedIds.length) }) : null,
|
|
1309
|
+
archiveError ? /* @__PURE__ */ jsx14("span", { role: "alert", className: "text-red-600 dark:text-red-400", children: labels.archiveFailed }) : null
|
|
1074
1310
|
] }) : null,
|
|
1075
|
-
/* @__PURE__ */
|
|
1311
|
+
/* @__PURE__ */ jsx14("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
|
|
1076
1312
|
const isFromCustomer = !TEAM_SOURCES.has(document2.source);
|
|
1077
1313
|
const SourceIcon = isFromCustomer ? Users : Bot;
|
|
1078
|
-
return /* @__PURE__ */
|
|
1314
|
+
return /* @__PURE__ */ jsxs9(
|
|
1079
1315
|
"li",
|
|
1080
1316
|
{
|
|
1081
1317
|
className: cn(
|
|
@@ -1083,8 +1319,8 @@ function ConversationDocumentsPanel({
|
|
|
1083
1319
|
classNames?.item
|
|
1084
1320
|
),
|
|
1085
1321
|
children: [
|
|
1086
|
-
/* @__PURE__ */
|
|
1087
|
-
canArchive ? /* @__PURE__ */
|
|
1322
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
|
|
1323
|
+
canArchive ? /* @__PURE__ */ jsx14(
|
|
1088
1324
|
"input",
|
|
1089
1325
|
{
|
|
1090
1326
|
type: "checkbox",
|
|
@@ -1094,9 +1330,9 @@ function ConversationDocumentsPanel({
|
|
|
1094
1330
|
className: cn("shrink-0", classNames?.checkbox)
|
|
1095
1331
|
}
|
|
1096
1332
|
) : null,
|
|
1097
|
-
/* @__PURE__ */
|
|
1098
|
-
/* @__PURE__ */
|
|
1099
|
-
/* @__PURE__ */
|
|
1333
|
+
/* @__PURE__ */ jsx14(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
|
|
1334
|
+
/* @__PURE__ */ jsxs9("div", { className: "min-w-0 flex-1", children: [
|
|
1335
|
+
/* @__PURE__ */ jsxs9(
|
|
1100
1336
|
"div",
|
|
1101
1337
|
{
|
|
1102
1338
|
className: cn(
|
|
@@ -1105,12 +1341,12 @@ function ConversationDocumentsPanel({
|
|
|
1105
1341
|
classNames?.sourceBadge
|
|
1106
1342
|
),
|
|
1107
1343
|
children: [
|
|
1108
|
-
/* @__PURE__ */
|
|
1344
|
+
/* @__PURE__ */ jsx14(SourceIcon, { size: 11 }),
|
|
1109
1345
|
isFromCustomer ? labels.sourceFilterCustomer : labels.sourceFilterTeam
|
|
1110
1346
|
]
|
|
1111
1347
|
}
|
|
1112
1348
|
),
|
|
1113
|
-
/* @__PURE__ */
|
|
1349
|
+
/* @__PURE__ */ jsx14(
|
|
1114
1350
|
"div",
|
|
1115
1351
|
{
|
|
1116
1352
|
className: cn("truncate text-sm font-medium", classNames?.filename),
|
|
@@ -1118,15 +1354,15 @@ function ConversationDocumentsPanel({
|
|
|
1118
1354
|
children: document2.filename
|
|
1119
1355
|
}
|
|
1120
1356
|
),
|
|
1121
|
-
/* @__PURE__ */
|
|
1357
|
+
/* @__PURE__ */ jsxs9("div", { className: cn("text-xs text-gray-500 dark:text-gray-400", classNames?.meta), children: [
|
|
1122
1358
|
formatDateTime(document2.linkedAt),
|
|
1123
1359
|
" \xB7 ",
|
|
1124
1360
|
formatFileSize(document2.sizeBytes)
|
|
1125
1361
|
] })
|
|
1126
1362
|
] })
|
|
1127
1363
|
] }),
|
|
1128
|
-
/* @__PURE__ */
|
|
1129
|
-
/* @__PURE__ */
|
|
1364
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex shrink-0 gap-1", children: [
|
|
1365
|
+
/* @__PURE__ */ jsx14(
|
|
1130
1366
|
"button",
|
|
1131
1367
|
{
|
|
1132
1368
|
type: "button",
|
|
@@ -1134,10 +1370,10 @@ function ConversationDocumentsPanel({
|
|
|
1134
1370
|
title: labels.view,
|
|
1135
1371
|
"aria-label": `${labels.view}: ${document2.filename}`,
|
|
1136
1372
|
className: cn("cv-header-icon", classNames?.viewButton),
|
|
1137
|
-
children: /* @__PURE__ */
|
|
1373
|
+
children: /* @__PURE__ */ jsx14(Eye, { size: 14 })
|
|
1138
1374
|
}
|
|
1139
1375
|
),
|
|
1140
|
-
/* @__PURE__ */
|
|
1376
|
+
/* @__PURE__ */ jsx14(
|
|
1141
1377
|
"button",
|
|
1142
1378
|
{
|
|
1143
1379
|
type: "button",
|
|
@@ -1145,7 +1381,7 @@ function ConversationDocumentsPanel({
|
|
|
1145
1381
|
title: labels.download,
|
|
1146
1382
|
"aria-label": `${labels.download}: ${document2.filename}`,
|
|
1147
1383
|
className: cn("cv-header-icon", classNames?.downloadButton),
|
|
1148
|
-
children: /* @__PURE__ */
|
|
1384
|
+
children: /* @__PURE__ */ jsx14(Download, { size: 14 })
|
|
1149
1385
|
}
|
|
1150
1386
|
)
|
|
1151
1387
|
] })
|
|
@@ -1154,7 +1390,7 @@ function ConversationDocumentsPanel({
|
|
|
1154
1390
|
document2.id
|
|
1155
1391
|
);
|
|
1156
1392
|
}) }),
|
|
1157
|
-
total > perPage ? /* @__PURE__ */
|
|
1393
|
+
total > perPage ? /* @__PURE__ */ jsxs9(
|
|
1158
1394
|
"div",
|
|
1159
1395
|
{
|
|
1160
1396
|
className: cn(
|
|
@@ -1162,9 +1398,9 @@ function ConversationDocumentsPanel({
|
|
|
1162
1398
|
classNames?.pagination
|
|
1163
1399
|
),
|
|
1164
1400
|
children: [
|
|
1165
|
-
/* @__PURE__ */
|
|
1166
|
-
/* @__PURE__ */
|
|
1167
|
-
/* @__PURE__ */
|
|
1401
|
+
/* @__PURE__ */ jsx14("span", { className: "text-gray-400", children: labels.total(total) }),
|
|
1402
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2", children: [
|
|
1403
|
+
/* @__PURE__ */ jsx14(
|
|
1168
1404
|
"button",
|
|
1169
1405
|
{
|
|
1170
1406
|
type: "button",
|
|
@@ -1175,8 +1411,8 @@ function ConversationDocumentsPanel({
|
|
|
1175
1411
|
children: "\u2039"
|
|
1176
1412
|
}
|
|
1177
1413
|
),
|
|
1178
|
-
/* @__PURE__ */
|
|
1179
|
-
/* @__PURE__ */
|
|
1414
|
+
/* @__PURE__ */ jsx14("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
|
|
1415
|
+
/* @__PURE__ */ jsx14(
|
|
1180
1416
|
"button",
|
|
1181
1417
|
{
|
|
1182
1418
|
type: "button",
|
|
@@ -1195,9 +1431,9 @@ function ConversationDocumentsPanel({
|
|
|
1195
1431
|
}
|
|
1196
1432
|
|
|
1197
1433
|
// src/DocumentsLibrary.tsx
|
|
1198
|
-
import { useEffect as useEffect3, useState as
|
|
1434
|
+
import { useEffect as useEffect3, useState as useState9 } from "react";
|
|
1199
1435
|
import { ArrowUpDown as ArrowUpDown2, Bot as Bot2, Download as Download2, Eye as Eye2, MessageSquare, Users as Users2 } from "lucide-react";
|
|
1200
|
-
import { jsx as
|
|
1436
|
+
import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1201
1437
|
var DEFAULT_DOCUMENTS_LIBRARY_LABELS = {
|
|
1202
1438
|
title: "Documentos",
|
|
1203
1439
|
searchPlaceholder: "Buscar por nome do arquivo ou telefone",
|
|
@@ -1228,14 +1464,14 @@ function DocumentsLibrary({
|
|
|
1228
1464
|
}) {
|
|
1229
1465
|
const labels = { ...DEFAULT_DOCUMENTS_LIBRARY_LABELS, ...labelsOverride };
|
|
1230
1466
|
const context = useConversations();
|
|
1231
|
-
const [search, setSearch] =
|
|
1232
|
-
const [sourceFilter, setSourceFilter] =
|
|
1233
|
-
const [sortDirection, setSortDirection] =
|
|
1234
|
-
const [page, setPage] =
|
|
1235
|
-
const [documents, setDocuments] =
|
|
1236
|
-
const [total, setTotal] =
|
|
1237
|
-
const [loading, setLoading] =
|
|
1238
|
-
const [failed, setFailed] =
|
|
1467
|
+
const [search, setSearch] = useState9("");
|
|
1468
|
+
const [sourceFilter, setSourceFilter] = useState9(DOCUMENT_SOURCE_FILTER.ALL);
|
|
1469
|
+
const [sortDirection, setSortDirection] = useState9("desc");
|
|
1470
|
+
const [page, setPage] = useState9(1);
|
|
1471
|
+
const [documents, setDocuments] = useState9([]);
|
|
1472
|
+
const [total, setTotal] = useState9(0);
|
|
1473
|
+
const [loading, setLoading] = useState9(false);
|
|
1474
|
+
const [failed, setFailed] = useState9(false);
|
|
1239
1475
|
const hasFilters = search !== "" || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== "desc";
|
|
1240
1476
|
const lastPage = Math.max(1, Math.ceil(total / perPage));
|
|
1241
1477
|
const fetchAll = context?.api.getAllDocuments;
|
|
@@ -1272,10 +1508,10 @@ function DocumentsLibrary({
|
|
|
1272
1508
|
if (url) window.open(url, "_blank", "noopener,noreferrer");
|
|
1273
1509
|
}
|
|
1274
1510
|
if (!fetchAll) return null;
|
|
1275
|
-
return /* @__PURE__ */
|
|
1276
|
-
/* @__PURE__ */
|
|
1277
|
-
/* @__PURE__ */
|
|
1278
|
-
/* @__PURE__ */
|
|
1511
|
+
return /* @__PURE__ */ jsxs10("div", { className: cn("space-y-3", classNames?.root, className), children: [
|
|
1512
|
+
/* @__PURE__ */ jsx15("h2", { className: cn("text-lg font-semibold", classNames?.title), children: labels.title }),
|
|
1513
|
+
/* @__PURE__ */ jsxs10("div", { className: cn("flex flex-wrap items-center gap-2", classNames?.filters), children: [
|
|
1514
|
+
/* @__PURE__ */ jsx15(
|
|
1279
1515
|
"input",
|
|
1280
1516
|
{
|
|
1281
1517
|
type: "search",
|
|
@@ -1286,7 +1522,7 @@ function DocumentsLibrary({
|
|
|
1286
1522
|
className: cn("w-full rounded-md border px-3 py-2 text-sm sm:w-64", classNames?.search)
|
|
1287
1523
|
}
|
|
1288
1524
|
),
|
|
1289
|
-
/* @__PURE__ */
|
|
1525
|
+
/* @__PURE__ */ jsxs10(
|
|
1290
1526
|
"select",
|
|
1291
1527
|
{
|
|
1292
1528
|
value: sourceFilter,
|
|
@@ -1294,25 +1530,25 @@ function DocumentsLibrary({
|
|
|
1294
1530
|
"aria-label": labels.sourceFilterAll,
|
|
1295
1531
|
className: cn("w-full rounded-md border px-2 py-2 text-sm sm:w-40", classNames?.sourceSelect),
|
|
1296
1532
|
children: [
|
|
1297
|
-
/* @__PURE__ */
|
|
1298
|
-
/* @__PURE__ */
|
|
1299
|
-
/* @__PURE__ */
|
|
1533
|
+
/* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
|
|
1534
|
+
/* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
|
|
1535
|
+
/* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
|
|
1300
1536
|
]
|
|
1301
1537
|
}
|
|
1302
1538
|
),
|
|
1303
|
-
/* @__PURE__ */
|
|
1539
|
+
/* @__PURE__ */ jsxs10(
|
|
1304
1540
|
"button",
|
|
1305
1541
|
{
|
|
1306
1542
|
type: "button",
|
|
1307
1543
|
onClick: () => applyFilter(() => setSortDirection(sortDirection === "desc" ? "asc" : "desc")),
|
|
1308
1544
|
className: cn("cv-header-action inline-flex items-center gap-1", classNames?.sortButton),
|
|
1309
1545
|
children: [
|
|
1310
|
-
/* @__PURE__ */
|
|
1546
|
+
/* @__PURE__ */ jsx15(ArrowUpDown2, { size: 14 }),
|
|
1311
1547
|
sortDirection === "desc" ? labels.sortMostRecent : labels.sortOldest
|
|
1312
1548
|
]
|
|
1313
1549
|
}
|
|
1314
1550
|
),
|
|
1315
|
-
hasFilters ? /* @__PURE__ */
|
|
1551
|
+
hasFilters ? /* @__PURE__ */ jsx15(
|
|
1316
1552
|
"button",
|
|
1317
1553
|
{
|
|
1318
1554
|
type: "button",
|
|
@@ -1326,13 +1562,13 @@ function DocumentsLibrary({
|
|
|
1326
1562
|
}
|
|
1327
1563
|
) : null
|
|
1328
1564
|
] }),
|
|
1329
|
-
loading ? /* @__PURE__ */
|
|
1330
|
-
failed ? /* @__PURE__ */
|
|
1331
|
-
!loading && !failed && documents.length === 0 ? /* @__PURE__ */
|
|
1332
|
-
/* @__PURE__ */
|
|
1565
|
+
loading ? /* @__PURE__ */ jsx15("p", { className: cn("text-sm text-gray-500", classNames?.status), children: labels.loading }) : null,
|
|
1566
|
+
failed ? /* @__PURE__ */ jsx15("p", { role: "alert", className: cn("text-sm text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
|
|
1567
|
+
!loading && !failed && documents.length === 0 ? /* @__PURE__ */ jsx15("p", { className: cn("text-sm text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
|
|
1568
|
+
/* @__PURE__ */ jsx15("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
|
|
1333
1569
|
const isFromCustomer = !TEAM_SOURCES2.has(document2.source);
|
|
1334
1570
|
const SourceIcon = isFromCustomer ? Users2 : Bot2;
|
|
1335
|
-
return /* @__PURE__ */
|
|
1571
|
+
return /* @__PURE__ */ jsxs10(
|
|
1336
1572
|
"li",
|
|
1337
1573
|
{
|
|
1338
1574
|
className: cn(
|
|
@@ -1340,23 +1576,23 @@ function DocumentsLibrary({
|
|
|
1340
1576
|
classNames?.item
|
|
1341
1577
|
),
|
|
1342
1578
|
children: [
|
|
1343
|
-
/* @__PURE__ */
|
|
1344
|
-
/* @__PURE__ */
|
|
1345
|
-
/* @__PURE__ */
|
|
1346
|
-
/* @__PURE__ */
|
|
1347
|
-
/* @__PURE__ */
|
|
1348
|
-
/* @__PURE__ */
|
|
1349
|
-
/* @__PURE__ */
|
|
1579
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
|
|
1580
|
+
/* @__PURE__ */ jsx15(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
|
|
1581
|
+
/* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
|
|
1582
|
+
/* @__PURE__ */ jsx15("div", { className: cn("truncate text-sm font-medium", classNames?.filename), title: document2.filename, children: document2.filename }),
|
|
1583
|
+
/* @__PURE__ */ jsxs10("div", { className: cn("flex flex-wrap items-center gap-x-2 text-xs text-gray-500", classNames?.meta), children: [
|
|
1584
|
+
/* @__PURE__ */ jsxs10("span", { className: "inline-flex items-center gap-1", children: [
|
|
1585
|
+
/* @__PURE__ */ jsx15(SourceIcon, { size: 11 }),
|
|
1350
1586
|
isFromCustomer ? labels.sourceFilterCustomer : labels.sourceFilterTeam
|
|
1351
1587
|
] }),
|
|
1352
|
-
/* @__PURE__ */
|
|
1353
|
-
/* @__PURE__ */
|
|
1354
|
-
/* @__PURE__ */
|
|
1355
|
-
/* @__PURE__ */
|
|
1588
|
+
/* @__PURE__ */ jsx15("span", { children: "\xB7" }),
|
|
1589
|
+
/* @__PURE__ */ jsx15("span", { children: formatDateTime(document2.linkedAt) }),
|
|
1590
|
+
/* @__PURE__ */ jsx15("span", { children: "\xB7" }),
|
|
1591
|
+
/* @__PURE__ */ jsx15("span", { children: formatFileSize(document2.sizeBytes) })
|
|
1356
1592
|
] })
|
|
1357
1593
|
] })
|
|
1358
1594
|
] }),
|
|
1359
|
-
onOpenConversation ? /* @__PURE__ */
|
|
1595
|
+
onOpenConversation ? /* @__PURE__ */ jsxs10(
|
|
1360
1596
|
"button",
|
|
1361
1597
|
{
|
|
1362
1598
|
type: "button",
|
|
@@ -1364,13 +1600,13 @@ function DocumentsLibrary({
|
|
|
1364
1600
|
title: labels.openConversation,
|
|
1365
1601
|
className: cn("cv-header-action inline-flex shrink-0 items-center gap-1", classNames?.conversationLink),
|
|
1366
1602
|
children: [
|
|
1367
|
-
/* @__PURE__ */
|
|
1603
|
+
/* @__PURE__ */ jsx15(MessageSquare, { size: 12 }),
|
|
1368
1604
|
formatPhone(document2.conversationId)
|
|
1369
1605
|
]
|
|
1370
1606
|
}
|
|
1371
|
-
) : /* @__PURE__ */
|
|
1372
|
-
/* @__PURE__ */
|
|
1373
|
-
/* @__PURE__ */
|
|
1607
|
+
) : /* @__PURE__ */ jsx15("span", { className: cn("shrink-0 text-xs text-gray-500", classNames?.conversationLink), children: formatPhone(document2.conversationId) }),
|
|
1608
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex shrink-0 gap-1", children: [
|
|
1609
|
+
/* @__PURE__ */ jsx15(
|
|
1374
1610
|
"button",
|
|
1375
1611
|
{
|
|
1376
1612
|
type: "button",
|
|
@@ -1378,10 +1614,10 @@ function DocumentsLibrary({
|
|
|
1378
1614
|
title: labels.view,
|
|
1379
1615
|
"aria-label": `${labels.view}: ${document2.filename}`,
|
|
1380
1616
|
className: "cv-header-icon",
|
|
1381
|
-
children: /* @__PURE__ */
|
|
1617
|
+
children: /* @__PURE__ */ jsx15(Eye2, { size: 14 })
|
|
1382
1618
|
}
|
|
1383
1619
|
),
|
|
1384
|
-
/* @__PURE__ */
|
|
1620
|
+
/* @__PURE__ */ jsx15(
|
|
1385
1621
|
"button",
|
|
1386
1622
|
{
|
|
1387
1623
|
type: "button",
|
|
@@ -1389,7 +1625,7 @@ function DocumentsLibrary({
|
|
|
1389
1625
|
title: labels.download,
|
|
1390
1626
|
"aria-label": `${labels.download}: ${document2.filename}`,
|
|
1391
1627
|
className: "cv-header-icon",
|
|
1392
|
-
children: /* @__PURE__ */
|
|
1628
|
+
children: /* @__PURE__ */ jsx15(Download2, { size: 14 })
|
|
1393
1629
|
}
|
|
1394
1630
|
)
|
|
1395
1631
|
] })
|
|
@@ -1398,10 +1634,10 @@ function DocumentsLibrary({
|
|
|
1398
1634
|
`${document2.conversationId}:${document2.id}`
|
|
1399
1635
|
);
|
|
1400
1636
|
}) }),
|
|
1401
|
-
total > perPage ? /* @__PURE__ */
|
|
1402
|
-
/* @__PURE__ */
|
|
1403
|
-
/* @__PURE__ */
|
|
1404
|
-
/* @__PURE__ */
|
|
1637
|
+
total > perPage ? /* @__PURE__ */ jsxs10("div", { className: cn("flex items-center justify-between border-t pt-2 text-xs dark:border-gray-700", classNames?.pagination), children: [
|
|
1638
|
+
/* @__PURE__ */ jsx15("span", { className: "text-gray-400", children: labels.total(total) }),
|
|
1639
|
+
/* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
|
|
1640
|
+
/* @__PURE__ */ jsx15(
|
|
1405
1641
|
"button",
|
|
1406
1642
|
{
|
|
1407
1643
|
type: "button",
|
|
@@ -1411,8 +1647,8 @@ function DocumentsLibrary({
|
|
|
1411
1647
|
children: "\u2039"
|
|
1412
1648
|
}
|
|
1413
1649
|
),
|
|
1414
|
-
/* @__PURE__ */
|
|
1415
|
-
/* @__PURE__ */
|
|
1650
|
+
/* @__PURE__ */ jsx15("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
|
|
1651
|
+
/* @__PURE__ */ jsx15(
|
|
1416
1652
|
"button",
|
|
1417
1653
|
{
|
|
1418
1654
|
type: "button",
|
|
@@ -1441,13 +1677,19 @@ export {
|
|
|
1441
1677
|
MediaRenderer,
|
|
1442
1678
|
DEFAULT_LIGHTBOX_LABELS,
|
|
1443
1679
|
Lightbox,
|
|
1680
|
+
DEFAULT_INTERACTIVE_MESSAGE_LABELS,
|
|
1681
|
+
InteractiveMessage,
|
|
1444
1682
|
createMediaUrlResolver,
|
|
1445
1683
|
ConversationsProvider,
|
|
1446
1684
|
useConversations,
|
|
1447
1685
|
MessageBubble,
|
|
1448
1686
|
ConversationWallpaper,
|
|
1687
|
+
EMOJI_CATEGORIES,
|
|
1688
|
+
searchEmojis,
|
|
1689
|
+
DEFAULT_EMOJI_PICKER_LABELS,
|
|
1449
1690
|
EmojiPicker,
|
|
1450
1691
|
DEFAULT_MESSAGE_COMPOSER_LABELS,
|
|
1692
|
+
DEFAULT_ACCEPTED_FILE_TYPES,
|
|
1451
1693
|
MessageComposer,
|
|
1452
1694
|
DateDivider,
|
|
1453
1695
|
formatPhone,
|