npm - @8wave/ai-elements - Versions diffs - 0.68.0 → 0.70.0 - Mend

@8wave/ai-elements 0.68.0 → 0.70.0

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 (427) hide show

package/dist-vue/_chunks/PkChatbotMessages-DJngZXIX.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PkChatbotMessages-DJngZXIX.js","names":["$d","$emit","$n"],"sources":["../../../../packages/components/src/chat/toolComponentMap.ts","../../../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue","../../../../packages/components/src/chat/PkStreamingMarkdownAutoscroll.vue","../../../../packages/components/src/chat/PkChatbotMessages.vue","../../../../packages/components/src/chat/PkChatbotMessages.vue"],"sourcesContent":["import { defineAsyncComponent } from 'vue'\n\n/**\n * Maps tool `part.type` to the corresponding component for auto-rendering.\n * Only includes simple tools that accept only a `:part` prop.\n * Interactive tools (showContactForm, showSuggestedReply, showSources,\n * showMultipleChoice) must be wired explicitly in the parent with their\n * required callbacks/events.\n */\nexport const toolComponentMap: Record<\n string,\n ReturnType<typeof defineAsyncComponent>\n> = {\n showArtifact: defineAsyncComponent(\n () => import('./PkToolShowArtifact.vue'),\n ),\n showCalendarEvent: defineAsyncComponent(\n () => import('./PkToolShowCalendarEvent.vue'),\n ),\n showComparison: defineAsyncComponent(\n () => import('./PkToolShowComparison.vue'),\n ),\n showContactForm: defineAsyncComponent(\n () => import('./PkToolShowContactForm.vue'),\n ),\n showEmail: defineAsyncComponent(() => import('./PkToolShowEmail.vue')),\n showImageGallery: defineAsyncComponent(\n () => import('./PkToolShowImageGallery.vue'),\n ),\n showLocation: defineAsyncComponent(\n () => import('./PkToolShowLocation.vue'),\n ),\n showMessage: defineAsyncComponent(() => import('./PkToolShowMessage.vue')),\n showMultipleChoice: defineAsyncComponent(\n () => import('./PkToolShowMultipleChoice.vue'),\n ),\n showProductList: defineAsyncComponent(\n () => import('./PkToolShowProductList.vue'),\n ),\n showQrCode: defineAsyncComponent(() => import('./PkToolShowQrCode.vue')),\n showSources: defineAsyncComponent(() => import('./PkToolShowSources.vue')),\n showSuggestedReply: defineAsyncComponent(\n () => import('./PkToolShowSuggestedReply.vue'),\n ),\n showWeather: defineAsyncComponent(() => import('./PkToolShowWeather.vue')),\n showWebPages: defineAsyncComponent(\n () => import('./PkToolShowWebPages.vue'),\n ),\n}\n","<script lang=\"ts\" setup>\n import { nextTick, ref, watch } from 'vue'\n import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n const props = defineProps<{\n markdown?: string\n innerClass?: string\n }>()\n\n const scrollEl = ref<HTMLDivElement>()\n const lastScrollTop = ref<number>(0)\n const stopAutoScroll = ref<boolean>(false)\n\n const handleScroll = () => {\n if (!scrollEl.value) {\n return\n }\n const currentScrollTop = scrollEl.value.scrollTop\n if (currentScrollTop < lastScrollTop.value) {\n const delta = lastScrollTop.value - currentScrollTop\n if (delta < 50) {\n stopAutoScroll.value = true\n }\n }\n if (currentScrollTop > lastScrollTop.value) {\n if (\n currentScrollTop ===\n scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n ) {\n stopAutoScroll.value = false\n }\n }\n lastScrollTop.value = currentScrollTop\n }\n\n watch(\n () => props.markdown,\n async () => {\n await nextTick()\n if (scrollEl.value && !stopAutoScroll.value) {\n scrollEl.value.scrollTop = scrollEl.value.scrollHeight\n }\n },\n { immediate: true },\n )\n</script>\n\n<template>\n <div\n ref=\"scrollEl\"\n class=\"overflow-auto light-scrollbar\"\n @scroll=\"handleScroll\">\n <PkStreamingMarkdown :markdown=\"markdown\" :class=\"innerClass\" />\n </div>\n</template>\n","<script lang=\"ts\" setup>\n import { nextTick, ref, watch } from 'vue'\n import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n\n const props = defineProps<{\n markdown?: string\n innerClass?: string\n }>()\n\n const scrollEl = ref<HTMLDivElement>()\n const lastScrollTop = ref<number>(0)\n const stopAutoScroll = ref<boolean>(false)\n\n const handleScroll = () => {\n if (!scrollEl.value) {\n return\n }\n const currentScrollTop = scrollEl.value.scrollTop\n if (currentScrollTop < lastScrollTop.value) {\n const delta = lastScrollTop.value - currentScrollTop\n if (delta < 50) {\n stopAutoScroll.value = true\n }\n }\n if (currentScrollTop > lastScrollTop.value) {\n if (\n currentScrollTop ===\n scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n ) {\n stopAutoScroll.value = false\n }\n }\n lastScrollTop.value = currentScrollTop\n }\n\n watch(\n () => props.markdown,\n async () => {\n await nextTick()\n if (scrollEl.value && !stopAutoScroll.value) {\n scrollEl.value.scrollTop = scrollEl.value.scrollHeight\n }\n },\n { immediate: true },\n )\n</script>\n\n<template>\n <div\n ref=\"scrollEl\"\n class=\"overflow-auto light-scrollbar\"\n @scroll=\"handleScroll\">\n <PkStreamingMarkdown :markdown=\"markdown\" :class=\"innerClass\" />\n </div>\n</template>\n","<script lang=\"ts\" setup>\n import type {\n ChatMessageActions,\n MessageFeedback,\n RevisedAnswer,\n UIChatMessage,\n } from 'models'\n import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n import PkChatbotError from './PkChatbotError.vue'\n import PkChatbotFeedbackForm from './PkChatbotFeedbackForm.vue'\n import PkChatbotFilePreview from './PkChatbotFilePreview.vue'\n import PkRelativeTime from '../PkRelativeTime.vue'\n import { useI18n } from 'vue-i18n'\n import {\n useTemplateRef,\n ref,\n watch,\n onMounted,\n computed,\n nextTick,\n useSlots,\n } from 'vue'\n import { toolComponentMap } from './toolComponentMap'\n import {\n resolveContrastColor,\n getPartState,\n isTextPart,\n isFilePart,\n isToolPart,\n isStreamingPart,\n getPartIcon,\n getToolPartLabel,\n } from './utils'\n import { getToolPartName, toKebabCase } from 'utils'\n import PkStreamingMarkdownAutoscroll from './PkStreamingMarkdownAutoscroll.vue'\n\n const props = defineProps<{\n status?: 'submitted' | 'streaming' | 'ready' | 'error'\n messages?: UIChatMessage[]\n logo?: string\n name?: string\n error?: Error\n actions?: ChatMessageActions[]\n mainColor?: string\n textColor?: 'auto' | 'white' | 'black'\n revisedAnswers?: RevisedAnswer[]\n messageFeedbacks?: MessageFeedback[]\n disableHeightAdjustment?: boolean\n showMessageDateTime?: boolean\n showMessageTokensCount?: boolean\n showAllMessageParts?: boolean\n // TODO: move feedback in a separate component to avoid passing these props\n feedbackMessageId?: string\n feedbackLoading?: boolean\n feedbackSubmitted?: boolean\n feedbackError?: string\n }>()\n\n const emit = defineEmits<{\n (e: 'show-info', message: UIChatMessage): void\n (e: 'regenerate'): void\n (e: 'revise', message: UIChatMessage): void\n (e: 'upvote', message: UIChatMessage): void\n (e: 'downvote', message: UIChatMessage): void\n (e: 'feedback', message: UIChatMessage): void\n (e: 'feedback-submit', comment: string): void\n (e: 'feedback-close'): void\n (e: 'scroll-up'): void\n (e: 'scroll-down'): void\n (e: 'auto-retry'): void\n (e: 'reset-chat'): void\n }>()\n\n const { t: $t } = useI18n({\n useScope: 'global',\n })\n\n const slots = useSlots()\n\n const scrollEl = useTemplateRef<HTMLDivElement>('scrollEl')\n const scrollTimeout = ref<NodeJS.Timeout>()\n const lastScrollTop = ref<number>(0)\n const stopAutoScroll = ref<boolean>(false)\n const contrastColor = computed(() =>\n resolveContrastColor(props.textColor, props.mainColor),\n )\n\n const handleScroll = () => {\n if (!scrollEl.value) {\n return\n }\n const currentScrollTop = scrollEl.value.scrollTop\n if (currentScrollTop < lastScrollTop.value) {\n const delta = lastScrollTop.value - currentScrollTop\n if (delta < 50) {\n stopAutoScroll.value = true\n }\n emit('scroll-up')\n }\n if (currentScrollTop > lastScrollTop.value) {\n emit('scroll-down')\n if (\n currentScrollTop ===\n scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n ) {\n stopAutoScroll.value = false\n }\n }\n lastScrollTop.value = currentScrollTop\n }\n\n const smootScrollToBottom = () => {\n if (!scrollEl.value) {\n return\n }\n if (scrollTimeout.value) {\n clearTimeout(scrollTimeout.value)\n }\n if (stopAutoScroll.value) {\n return\n }\n scrollTimeout.value = setTimeout(() => {\n scrollEl.value?.scrollTo({\n top: scrollEl.value.scrollHeight,\n behavior: 'smooth',\n })\n }, 10)\n }\n\n watch(\n () => props.status,\n (newStatus) => {\n if (newStatus === 'ready') {\n smootScrollToBottom()\n }\n },\n )\n\n const messagesElRefs = useTemplateRef<HTMLDivElement[]>('messagesEl')\n const height = ref<number>(0)\n watch(\n () => props.messages,\n async (messages) => {\n if (messages?.[messages.length - 1]?.role !== 'assistant') {\n stopAutoScroll.value = false\n return\n }\n\n // Wait for DOM to update before calculating heights\n await nextTick()\n smootScrollToBottom()\n\n if (props.disableHeightAdjustment) {\n return\n }\n\n const scrollElHeight = (scrollEl.value?.clientHeight ?? 0) - 48\n // last user message index\n const lastUserMessageIndex = messages\n .map((message) => message.role)\n .lastIndexOf('user')\n const lastUserMessageHeight =\n messagesElRefs.value?.[lastUserMessageIndex]?.clientHeight ?? 0\n const newHeight = scrollElHeight - lastUserMessageHeight\n if (newHeight) {\n height.value = newHeight\n }\n },\n {\n deep: true,\n },\n )\n\n onMounted(() => {\n smootScrollToBottom()\n })\n\n const isRevised = (messageId: string) => {\n return props.revisedAnswers?.some((r) => r.messageId === messageId)\n }\n\n const getMessageFeedback = (messageId: string) =>\n props.messageFeedbacks?.find((f) => f.messageId === messageId)\n\n const activeMessage = computed(() => {\n return props.messages?.[props.messages.length - 1]\n })\n const activeMessageLastPart = computed(() => {\n const active = activeMessage.value\n if (!active) {\n return null\n }\n return active.parts[active.parts.length - 1]\n })\n const isLoading = computed(() => {\n return props.status === 'submitted' || props.status === 'streaming'\n })\n const isError = computed(() => props.status === 'error')\n\n const activeMessageLastPartLabel = computed(() => {\n const part = activeMessageLastPart.value\n return getToolPartLabel($t, part)\n })\n const activeMessageLastPartIcon = computed(() => {\n const part = activeMessageLastPart.value\n return getPartIcon(part)\n })\n\n const getMessageIndexById = (messageId: string) => {\n return props.messages?.findIndex((m) => m.id === messageId)\n }\n const isLastUserMessageIndex = (index?: number) => {\n if (index === undefined || !props.messages) {\n return false\n }\n return index === (props.messages?.length ?? 0) - 1\n }\n const isMessageRegenerateButtonVisible = (index: number) => {\n return (\n isLastUserMessageIndex(index) &&\n props.status === 'ready' &&\n props.actions?.includes('regenerate')\n )\n }\n const isActionButtonVisible = (\n action: ChatMessageActions,\n index: number,\n ) => {\n return (\n ((isLastUserMessageIndex(index) && props.status === 'ready') ||\n !isLastUserMessageIndex(index)) &&\n props.actions?.includes(action)\n )\n }\n const isLastTextPart = (message: UIChatMessage) => {\n const lastPart = message.parts[message.parts.length - 1]\n return isTextPart(lastPart)\n }\n const getPreviousAssistantMessage = (index: number) => {\n return props.messages\n ?.slice(0, index)\n .reverse()\n .find((message) => message.role === 'assistant')\n }\n const getNextAssistantMessage = (index: number) => {\n return props.messages\n ?.slice(index + 1)\n .find((message) => message.role === 'assistant')\n }\n const isDayChanged = (index: number) => {\n const previousAssistantMessage = getPreviousAssistantMessage(index)\n const nextAssistantMessage = getNextAssistantMessage(index)\n if (\n !previousAssistantMessage?.metadata?.createdAt ||\n !nextAssistantMessage?.metadata?.createdAt\n ) {\n return false\n }\n const currentDate = new Date(\n previousAssistantMessage.metadata.createdAt,\n )\n const previousDate = new Date(nextAssistantMessage.metadata.createdAt)\n return (\n currentDate.getFullYear() !== previousDate.getFullYear() ||\n currentDate.getMonth() !== previousDate.getMonth() ||\n currentDate.getDate() !== previousDate.getDate()\n )\n }\n const showMessageFooter = (message: UIChatMessage, index: number) => {\n if (index === 0 || message.role !== 'assistant') {\n return false\n }\n return (\n props.actions?.length ||\n (props.showMessageDateTime &&\n message.metadata?.createdAt !== undefined) ||\n (props.showMessageTokensCount &&\n message.metadata?.totalTokens !== undefined)\n )\n }\n // feedback message auto scroll\n const feedbackMessageEl = ref<(typeof PkChatbotFeedbackForm)[]>()\n watch(\n () => props.feedbackMessageId,\n async () => {\n await nextTick()\n setTimeout(() => {\n if (props.feedbackMessageId) {\n if (feedbackMessageEl.value?.[0]?.$el) {\n if (\n isLastUserMessageIndex(\n getMessageIndexById(props.feedbackMessageId),\n )\n ) {\n smootScrollToBottom()\n return\n }\n feedbackMessageEl.value[0].$el.scrollIntoView({\n behavior: 'smooth',\n block: 'center',\n })\n }\n }\n }, 10)\n },\n )\n</script>\n\n<template>\n <div\n ref=\"scrollEl\"\n class=\"pk-chatbot-messages\"\n :style=\"{\n '--chatbot-main-color': mainColor,\n '--chatbot-contrast-color': contrastColor,\n }\"\n @scroll=\"handleScroll\">\n <div class=\"pk-chatbot-messages__wrapper\">\n <template v-for=\"(message, index) in messages\" :key=\"message.id\">\n <div\n v-if=\"\n index > 0 &&\n message.role === 'user' &&\n isDayChanged(index)\n \"\n class=\"pk-chatbot-divider\">\n <span class=\"pk-chatbot-divider__label\">\n {{\n $d(\n new Date(\n getNextAssistantMessage(index)?.metadata\n ?.createdAt ?? '',\n ),\n 'short',\n )\n }}\n </span>\n </div>\n <div\n ref=\"messagesEl\"\n class=\"pk-chatbot-message\"\n :class=\"[\n `pk-chatbot-message--${message.role}`,\n {\n 'pk-chatbot-message--loading':\n isLastUserMessageIndex(index) &&\n isLoading &&\n message.role === 'assistant',\n },\n ]\"\n :style=\"{\n minHeight:\n isLastUserMessageIndex(index) &&\n message.role === 'assistant' &&\n !isError\n ? `${height}px`\n : undefined,\n }\">\n <template\n v-for=\"(part, partIndex) in message.parts\"\n :key=\"partIndex\">\n <div\n v-if=\"isTextPart(part)\"\n class=\"pk-chatbot-message__text\">\n <slot\n v-bind=\"{\n message,\n part,\n index,\n isLoading,\n }\"\n name=\"text\">\n <PkStreamingMarkdown\n v-if=\"message.role === 'assistant'\"\n class=\"wysiwyg\"\n :markdown=\"part.text\"\n :loading=\"\n index === (messages?.length ?? 0) - 1 &&\n status === 'streaming'\n \" />\n <template v-else>\n {{ part.text }}\n </template>\n </slot>\n </div>\n <PkChatbotFilePreview\n v-else-if=\"isFilePart(part)\"\n :media-type=\"part.mediaType\"\n :url=\"part.url\"\n :filename=\"part.filename\" />\n <template\n v-else-if=\"\n isToolPart(part) && !isStreamingPart(part)\n \">\n <component\n :is=\"toolComponentMap[getToolPartName(part)]\"\n v-if=\"\n !slots[part.type] &&\n toolComponentMap[getToolPartName(part)]\n \"\n :key=\"`component-${partIndex}-${getPartState(part)}`\"\n :part />\n <slot\n v-else\n :key=\"`slot-${partIndex}-${getPartState(part)}`\"\n :name=\"part.type\"\n v-bind=\"{\n message,\n part,\n index,\n isLoading,\n }\">\n <template v-if=\"showAllMessageParts\">\n <div\n class=\"pk-chatbot-message__loading-info\">\n <div class=\"flex gap-8 items-center\">\n <VvIcon\n v-if=\"getPartIcon(part)\"\n :name=\"getPartIcon(part)!\"\n class=\"shrink-0\" />\n <code\n class=\"font-mono rounded text-10\">\n {{ toKebabCase(part.type) }}\n </code>\n </div>\n </div>\n </template>\n </slot>\n </template>\n </template>\n <transition mode=\"out-in\">\n <div\n v-if=\"\n isLoading &&\n isLastUserMessageIndex(index) &&\n !isLastTextPart(message) &&\n message.role === 'assistant'\n \"\n :key=\"`loading-info-${message.id}`\"\n class=\"pk-chatbot-message__loading-info\">\n <div class=\"flex gap-8 items-center\">\n <VvIcon\n name=\"line-md:loading-loop\"\n class=\"shrink-0\" />\n <transition mode=\"out-in\">\n <VvIcon\n v-if=\"activeMessageLastPartIcon\"\n :key=\"activeMessageLastPartIcon\"\n class=\"shrink-0\"\n :name=\"activeMessageLastPartIcon\" />\n </transition>\n <transition mode=\"out-in\">\n <span\n v-if=\"activeMessageLastPartLabel\"\n :key=\"activeMessageLastPartLabel\"\n class=\"text-10\">\n {{ activeMessageLastPartLabel }}\n </span>\n </transition>\n </div>\n <transition mode=\"out-in\">\n <PkStreamingMarkdownAutoscroll\n v-if=\"\n activeMessageLastPart &&\n 'text' in activeMessageLastPart &&\n activeMessageLastPart.text.trim()\n \"\n :markdown=\"activeMessageLastPart.text\"\n inner-class=\"wysiwyg\"\n class=\"border border-surface-4 rounded p-4 mt-8 bg-surface-1 max-h-64 text-10 w-full\" />\n </transition>\n </div>\n </transition>\n <transition mode=\"out-in\">\n <div\n v-if=\"showMessageFooter(message, index)\"\n class=\"pk-chatbot-message__footer\">\n <VvButtonGroup modifiers=\"compact\" class=\"mr-auto\">\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isMessageRegenerateButtonVisible(\n index,\n )\n \"\n icon=\"ri:reset-right-line\"\n modifiers=\"action-quiet-small\"\n :title=\"$t('action.regenerate')\"\n @click.stop=\"$emit('regenerate')\" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'show-info',\n index,\n )\n \"\n icon=\"ri:information-line\"\n :title=\"$t('action.getMoreInfo')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('show-info', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'revise',\n index,\n )\n \"\n :icon=\"\n isRevised(message.id)\n ? 'ri:file-edit-fill'\n : 'ri:file-edit-line'\n \"\n :title=\"\n isRevised(message.id)\n ? $t('action.editRevise')\n : $t('action.createRevise')\n \"\n modifiers=\"action-quiet-small\"\n :class=\"{\n 'text-brand': isRevised(message.id),\n }\"\n @click.stop=\"\n $emit('revise', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'upvote',\n index,\n )\n \"\n :icon=\"\n getMessageFeedback(message.id)\n ?.vote === 'upvote'\n ? 'ri:thumb-up-fill'\n : 'ri:thumb-up-line'\n \"\n :title=\"$t('action.upvote')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('upvote', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'downvote',\n index,\n )\n \"\n :icon=\"\n getMessageFeedback(message.id)\n ?.vote === 'downvote'\n ? 'ri:thumb-down-fill'\n : 'ri:thumb-down-line'\n \"\n :title=\"$t('action.downvote')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('downvote', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'feedback',\n index,\n )\n \"\n :icon=\"\n getMessageFeedback(message.id)\n ?.comment\n ? 'ri:feedback-fill'\n : 'ri:feedback-line'\n \"\n :title=\"$t('action.feedback')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('feedback', message)\n \" />\n </transition>\n </VvButtonGroup>\n <span\n v-if=\"\n showMessageTokensCount &&\n message.metadata?.totalTokens\n \"\n class=\"flex items-center gap-4 text-12 text-word-3\">\n <VvIcon name=\"ri:ai-generate-2-line\" />\n {{\n $n(message.metadata.totalTokens, 'integer')\n }}\n {{ $t('label.tokens') }}\n </span>\n <time\n v-if=\"\n showMessageDateTime &&\n message.metadata?.createdAt\n \"\n :datetime=\"\n new Date(\n message.metadata?.createdAt,\n ).toISOString()\n \"\n class=\"flex items-center gap-4 text-12 text-word-3\">\n <VvIcon name=\"ri:time-line\" />\n {{\n $d(\n new Date(message.metadata?.createdAt),\n 'date-time',\n )\n }}\n </time>\n <div\n v-if=\"\n showMessageDateTime &&\n message?.metadata?.completedAt &&\n message?.metadata?.createdAt\n \"\n class=\"flex items-center gap-4 text-12 text-word-3\">\n <VvIcon name=\"ri:hourglass-line\" />\n <PkRelativeTime\n :date=\"message.metadata?.createdAt\"\n :end-date=\"message.metadata?.completedAt\" />\n </div>\n </div>\n </transition>\n <transition mode=\"out-in\">\n <PkChatbotFeedbackForm\n v-if=\"message.id === feedbackMessageId\"\n ref=\"feedbackMessageEl\"\n :loading=\"feedbackLoading\"\n :submitted=\"feedbackSubmitted\"\n :error=\"feedbackError\"\n @submit=\"$emit('feedback-submit', $event)\"\n @close=\"$emit('feedback-close')\" />\n </transition>\n </div>\n </template>\n <PkChatbotError\n v-if=\"isError\"\n :error\n @retry=\"$emit('auto-retry')\"\n @reset=\"$emit('reset-chat')\" />\n <div\n v-if=\"activeMessage?.role === 'user' || isError\"\n :style=\"{ minHeight: `${height}px` }\"></div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\">\n .pk-chatbot-messages {\n overflow-y: auto;\n flex: 1;\n min-width: 0;\n font-size: var(--spacing-14);\n\n scrollbar-width: thin;\n scrollbar-gutter: auto;\n scrollbar-color: var(--color-word-5) var(--color-surface-1);\n\n &__wrapper {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-16);\n min-width: 0;\n }\n\n &__divider {\n border-bottom: 1px solid var(--color-surface-3);\n }\n }\n\n .pk-chatbot-divider {\n position: relative;\n border-bottom: 1px solid var(--color-surface-3);\n\n &__label {\n position: absolute;\n padding-inline: var(--spacing-8);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--color-surface);\n color: var(--color-word-4);\n font-size: var(--text-12);\n }\n }\n\n .pk-chatbot-message {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-sm);\n min-width: 0;\n align-items: flex-start;\n\n &__text {\n color: var(--color-word-2);\n line-height: var(--leading-normal);\n border-width: var(--spacing-px);\n border-color: var(--color-surface-3);\n padding: var(--spacing-sm);\n border-radius: var(--rounded-xl) var(--rounded-xl) var(--rounded-xl)\n 0;\n }\n\n &__loading-info {\n line-height: var(--leading-normal);\n border-width: var(--spacing-px);\n border-color: var(--color-surface-3);\n padding: var(--spacing-sm);\n border-radius: var(--rounded-xl) var(--rounded-xl) var(--rounded-xl)\n 0;\n font-size: var(--text-12);\n color: var(--color-word-3);\n }\n\n &__footer {\n width: 100%;\n display: flex;\n gap: var(--spacing-8);\n align-items: center;\n }\n\n &--user {\n align-items: flex-end;\n\n .pk-chatbot-message__text {\n background-color: var(\n --chatbot-main-color,\n var(--color-surface-1)\n );\n border-width: var(--spacing-px);\n border-color: var(--chatbot-main-color, var(--color-surface-4));\n color: var(--chatbot-contrast-color, var(--color-word-1));\n border-radius: var(--rounded-xl) var(--rounded-xl) 0\n var(--rounded-xl);\n }\n }\n\n &--assistant {\n width: 100%;\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: var(--spacing-16);\n overflow: hidden;\n\n .pk-chatbot-message__text {\n width: 100%;\n }\n }\n\n &--system {\n align-items: flex-end;\n\n .pk-chatbot-message__text {\n display: flex;\n gap: var(--spacing-8);\n font-size: var(--text-12);\n padding: var(--spacing-8) var(--spacing-sm);\n align-items: center;\n border-width: var(--spacing-px);\n border-color: var(--chatbot-main-color, var(--color-surface-4));\n color: var(--chatbot-main-color, var(--color-word-1));\n border-radius: var(--rounded-xl) var(--rounded-xl) 0\n var(--rounded-xl);\n }\n }\n }\n</style>\n","<script lang=\"ts\" setup>\n import type {\n ChatMessageActions,\n MessageFeedback,\n RevisedAnswer,\n UIChatMessage,\n } from 'models'\n import PkStreamingMarkdown from './PkStreamingMarkdown.vue'\n import PkChatbotError from './PkChatbotError.vue'\n import PkChatbotFeedbackForm from './PkChatbotFeedbackForm.vue'\n import PkChatbotFilePreview from './PkChatbotFilePreview.vue'\n import PkRelativeTime from '../PkRelativeTime.vue'\n import { useI18n } from 'vue-i18n'\n import {\n useTemplateRef,\n ref,\n watch,\n onMounted,\n computed,\n nextTick,\n useSlots,\n } from 'vue'\n import { toolComponentMap } from './toolComponentMap'\n import {\n resolveContrastColor,\n getPartState,\n isTextPart,\n isFilePart,\n isToolPart,\n isStreamingPart,\n getPartIcon,\n getToolPartLabel,\n } from './utils'\n import { getToolPartName, toKebabCase } from 'utils'\n import PkStreamingMarkdownAutoscroll from './PkStreamingMarkdownAutoscroll.vue'\n\n const props = defineProps<{\n status?: 'submitted' | 'streaming' | 'ready' | 'error'\n messages?: UIChatMessage[]\n logo?: string\n name?: string\n error?: Error\n actions?: ChatMessageActions[]\n mainColor?: string\n textColor?: 'auto' | 'white' | 'black'\n revisedAnswers?: RevisedAnswer[]\n messageFeedbacks?: MessageFeedback[]\n disableHeightAdjustment?: boolean\n showMessageDateTime?: boolean\n showMessageTokensCount?: boolean\n showAllMessageParts?: boolean\n // TODO: move feedback in a separate component to avoid passing these props\n feedbackMessageId?: string\n feedbackLoading?: boolean\n feedbackSubmitted?: boolean\n feedbackError?: string\n }>()\n\n const emit = defineEmits<{\n (e: 'show-info', message: UIChatMessage): void\n (e: 'regenerate'): void\n (e: 'revise', message: UIChatMessage): void\n (e: 'upvote', message: UIChatMessage): void\n (e: 'downvote', message: UIChatMessage): void\n (e: 'feedback', message: UIChatMessage): void\n (e: 'feedback-submit', comment: string): void\n (e: 'feedback-close'): void\n (e: 'scroll-up'): void\n (e: 'scroll-down'): void\n (e: 'auto-retry'): void\n (e: 'reset-chat'): void\n }>()\n\n const { t: $t } = useI18n({\n useScope: 'global',\n })\n\n const slots = useSlots()\n\n const scrollEl = useTemplateRef<HTMLDivElement>('scrollEl')\n const scrollTimeout = ref<NodeJS.Timeout>()\n const lastScrollTop = ref<number>(0)\n const stopAutoScroll = ref<boolean>(false)\n const contrastColor = computed(() =>\n resolveContrastColor(props.textColor, props.mainColor),\n )\n\n const handleScroll = () => {\n if (!scrollEl.value) {\n return\n }\n const currentScrollTop = scrollEl.value.scrollTop\n if (currentScrollTop < lastScrollTop.value) {\n const delta = lastScrollTop.value - currentScrollTop\n if (delta < 50) {\n stopAutoScroll.value = true\n }\n emit('scroll-up')\n }\n if (currentScrollTop > lastScrollTop.value) {\n emit('scroll-down')\n if (\n currentScrollTop ===\n scrollEl.value.scrollHeight - scrollEl.value.clientHeight\n ) {\n stopAutoScroll.value = false\n }\n }\n lastScrollTop.value = currentScrollTop\n }\n\n const smootScrollToBottom = () => {\n if (!scrollEl.value) {\n return\n }\n if (scrollTimeout.value) {\n clearTimeout(scrollTimeout.value)\n }\n if (stopAutoScroll.value) {\n return\n }\n scrollTimeout.value = setTimeout(() => {\n scrollEl.value?.scrollTo({\n top: scrollEl.value.scrollHeight,\n behavior: 'smooth',\n })\n }, 10)\n }\n\n watch(\n () => props.status,\n (newStatus) => {\n if (newStatus === 'ready') {\n smootScrollToBottom()\n }\n },\n )\n\n const messagesElRefs = useTemplateRef<HTMLDivElement[]>('messagesEl')\n const height = ref<number>(0)\n watch(\n () => props.messages,\n async (messages) => {\n if (messages?.[messages.length - 1]?.role !== 'assistant') {\n stopAutoScroll.value = false\n return\n }\n\n // Wait for DOM to update before calculating heights\n await nextTick()\n smootScrollToBottom()\n\n if (props.disableHeightAdjustment) {\n return\n }\n\n const scrollElHeight = (scrollEl.value?.clientHeight ?? 0) - 48\n // last user message index\n const lastUserMessageIndex = messages\n .map((message) => message.role)\n .lastIndexOf('user')\n const lastUserMessageHeight =\n messagesElRefs.value?.[lastUserMessageIndex]?.clientHeight ?? 0\n const newHeight = scrollElHeight - lastUserMessageHeight\n if (newHeight) {\n height.value = newHeight\n }\n },\n {\n deep: true,\n },\n )\n\n onMounted(() => {\n smootScrollToBottom()\n })\n\n const isRevised = (messageId: string) => {\n return props.revisedAnswers?.some((r) => r.messageId === messageId)\n }\n\n const getMessageFeedback = (messageId: string) =>\n props.messageFeedbacks?.find((f) => f.messageId === messageId)\n\n const activeMessage = computed(() => {\n return props.messages?.[props.messages.length - 1]\n })\n const activeMessageLastPart = computed(() => {\n const active = activeMessage.value\n if (!active) {\n return null\n }\n return active.parts[active.parts.length - 1]\n })\n const isLoading = computed(() => {\n return props.status === 'submitted' || props.status === 'streaming'\n })\n const isError = computed(() => props.status === 'error')\n\n const activeMessageLastPartLabel = computed(() => {\n const part = activeMessageLastPart.value\n return getToolPartLabel($t, part)\n })\n const activeMessageLastPartIcon = computed(() => {\n const part = activeMessageLastPart.value\n return getPartIcon(part)\n })\n\n const getMessageIndexById = (messageId: string) => {\n return props.messages?.findIndex((m) => m.id === messageId)\n }\n const isLastUserMessageIndex = (index?: number) => {\n if (index === undefined || !props.messages) {\n return false\n }\n return index === (props.messages?.length ?? 0) - 1\n }\n const isMessageRegenerateButtonVisible = (index: number) => {\n return (\n isLastUserMessageIndex(index) &&\n props.status === 'ready' &&\n props.actions?.includes('regenerate')\n )\n }\n const isActionButtonVisible = (\n action: ChatMessageActions,\n index: number,\n ) => {\n return (\n ((isLastUserMessageIndex(index) && props.status === 'ready') ||\n !isLastUserMessageIndex(index)) &&\n props.actions?.includes(action)\n )\n }\n const isLastTextPart = (message: UIChatMessage) => {\n const lastPart = message.parts[message.parts.length - 1]\n return isTextPart(lastPart)\n }\n const getPreviousAssistantMessage = (index: number) => {\n return props.messages\n ?.slice(0, index)\n .reverse()\n .find((message) => message.role === 'assistant')\n }\n const getNextAssistantMessage = (index: number) => {\n return props.messages\n ?.slice(index + 1)\n .find((message) => message.role === 'assistant')\n }\n const isDayChanged = (index: number) => {\n const previousAssistantMessage = getPreviousAssistantMessage(index)\n const nextAssistantMessage = getNextAssistantMessage(index)\n if (\n !previousAssistantMessage?.metadata?.createdAt ||\n !nextAssistantMessage?.metadata?.createdAt\n ) {\n return false\n }\n const currentDate = new Date(\n previousAssistantMessage.metadata.createdAt,\n )\n const previousDate = new Date(nextAssistantMessage.metadata.createdAt)\n return (\n currentDate.getFullYear() !== previousDate.getFullYear() ||\n currentDate.getMonth() !== previousDate.getMonth() ||\n currentDate.getDate() !== previousDate.getDate()\n )\n }\n const showMessageFooter = (message: UIChatMessage, index: number) => {\n if (index === 0 || message.role !== 'assistant') {\n return false\n }\n return (\n props.actions?.length ||\n (props.showMessageDateTime &&\n message.metadata?.createdAt !== undefined) ||\n (props.showMessageTokensCount &&\n message.metadata?.totalTokens !== undefined)\n )\n }\n // feedback message auto scroll\n const feedbackMessageEl = ref<(typeof PkChatbotFeedbackForm)[]>()\n watch(\n () => props.feedbackMessageId,\n async () => {\n await nextTick()\n setTimeout(() => {\n if (props.feedbackMessageId) {\n if (feedbackMessageEl.value?.[0]?.$el) {\n if (\n isLastUserMessageIndex(\n getMessageIndexById(props.feedbackMessageId),\n )\n ) {\n smootScrollToBottom()\n return\n }\n feedbackMessageEl.value[0].$el.scrollIntoView({\n behavior: 'smooth',\n block: 'center',\n })\n }\n }\n }, 10)\n },\n )\n</script>\n\n<template>\n <div\n ref=\"scrollEl\"\n class=\"pk-chatbot-messages\"\n :style=\"{\n '--chatbot-main-color': mainColor,\n '--chatbot-contrast-color': contrastColor,\n }\"\n @scroll=\"handleScroll\">\n <div class=\"pk-chatbot-messages__wrapper\">\n <template v-for=\"(message, index) in messages\" :key=\"message.id\">\n <div\n v-if=\"\n index > 0 &&\n message.role === 'user' &&\n isDayChanged(index)\n \"\n class=\"pk-chatbot-divider\">\n <span class=\"pk-chatbot-divider__label\">\n {{\n $d(\n new Date(\n getNextAssistantMessage(index)?.metadata\n ?.createdAt ?? '',\n ),\n 'short',\n )\n }}\n </span>\n </div>\n <div\n ref=\"messagesEl\"\n class=\"pk-chatbot-message\"\n :class=\"[\n `pk-chatbot-message--${message.role}`,\n {\n 'pk-chatbot-message--loading':\n isLastUserMessageIndex(index) &&\n isLoading &&\n message.role === 'assistant',\n },\n ]\"\n :style=\"{\n minHeight:\n isLastUserMessageIndex(index) &&\n message.role === 'assistant' &&\n !isError\n ? `${height}px`\n : undefined,\n }\">\n <template\n v-for=\"(part, partIndex) in message.parts\"\n :key=\"partIndex\">\n <div\n v-if=\"isTextPart(part)\"\n class=\"pk-chatbot-message__text\">\n <slot\n v-bind=\"{\n message,\n part,\n index,\n isLoading,\n }\"\n name=\"text\">\n <PkStreamingMarkdown\n v-if=\"message.role === 'assistant'\"\n class=\"wysiwyg\"\n :markdown=\"part.text\"\n :loading=\"\n index === (messages?.length ?? 0) - 1 &&\n status === 'streaming'\n \" />\n <template v-else>\n {{ part.text }}\n </template>\n </slot>\n </div>\n <PkChatbotFilePreview\n v-else-if=\"isFilePart(part)\"\n :media-type=\"part.mediaType\"\n :url=\"part.url\"\n :filename=\"part.filename\" />\n <template\n v-else-if=\"\n isToolPart(part) && !isStreamingPart(part)\n \">\n <component\n :is=\"toolComponentMap[getToolPartName(part)]\"\n v-if=\"\n !slots[part.type] &&\n toolComponentMap[getToolPartName(part)]\n \"\n :key=\"`component-${partIndex}-${getPartState(part)}`\"\n :part />\n <slot\n v-else\n :key=\"`slot-${partIndex}-${getPartState(part)}`\"\n :name=\"part.type\"\n v-bind=\"{\n message,\n part,\n index,\n isLoading,\n }\">\n <template v-if=\"showAllMessageParts\">\n <div\n class=\"pk-chatbot-message__loading-info\">\n <div class=\"flex gap-8 items-center\">\n <VvIcon\n v-if=\"getPartIcon(part)\"\n :name=\"getPartIcon(part)!\"\n class=\"shrink-0\" />\n <code\n class=\"font-mono rounded text-10\">\n {{ toKebabCase(part.type) }}\n </code>\n </div>\n </div>\n </template>\n </slot>\n </template>\n </template>\n <transition mode=\"out-in\">\n <div\n v-if=\"\n isLoading &&\n isLastUserMessageIndex(index) &&\n !isLastTextPart(message) &&\n message.role === 'assistant'\n \"\n :key=\"`loading-info-${message.id}`\"\n class=\"pk-chatbot-message__loading-info\">\n <div class=\"flex gap-8 items-center\">\n <VvIcon\n name=\"line-md:loading-loop\"\n class=\"shrink-0\" />\n <transition mode=\"out-in\">\n <VvIcon\n v-if=\"activeMessageLastPartIcon\"\n :key=\"activeMessageLastPartIcon\"\n class=\"shrink-0\"\n :name=\"activeMessageLastPartIcon\" />\n </transition>\n <transition mode=\"out-in\">\n <span\n v-if=\"activeMessageLastPartLabel\"\n :key=\"activeMessageLastPartLabel\"\n class=\"text-10\">\n {{ activeMessageLastPartLabel }}\n </span>\n </transition>\n </div>\n <transition mode=\"out-in\">\n <PkStreamingMarkdownAutoscroll\n v-if=\"\n activeMessageLastPart &&\n 'text' in activeMessageLastPart &&\n activeMessageLastPart.text.trim()\n \"\n :markdown=\"activeMessageLastPart.text\"\n inner-class=\"wysiwyg\"\n class=\"border border-surface-4 rounded p-4 mt-8 bg-surface-1 max-h-64 text-10 w-full\" />\n </transition>\n </div>\n </transition>\n <transition mode=\"out-in\">\n <div\n v-if=\"showMessageFooter(message, index)\"\n class=\"pk-chatbot-message__footer\">\n <VvButtonGroup modifiers=\"compact\" class=\"mr-auto\">\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isMessageRegenerateButtonVisible(\n index,\n )\n \"\n icon=\"ri:reset-right-line\"\n modifiers=\"action-quiet-small\"\n :title=\"$t('action.regenerate')\"\n @click.stop=\"$emit('regenerate')\" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'show-info',\n index,\n )\n \"\n icon=\"ri:information-line\"\n :title=\"$t('action.getMoreInfo')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('show-info', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'revise',\n index,\n )\n \"\n :icon=\"\n isRevised(message.id)\n ? 'ri:file-edit-fill'\n : 'ri:file-edit-line'\n \"\n :title=\"\n isRevised(message.id)\n ? $t('action.editRevise')\n : $t('action.createRevise')\n \"\n modifiers=\"action-quiet-small\"\n :class=\"{\n 'text-brand': isRevised(message.id),\n }\"\n @click.stop=\"\n $emit('revise', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'upvote',\n index,\n )\n \"\n :icon=\"\n getMessageFeedback(message.id)\n ?.vote === 'upvote'\n ? 'ri:thumb-up-fill'\n : 'ri:thumb-up-line'\n \"\n :title=\"$t('action.upvote')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('upvote', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'downvote',\n index,\n )\n \"\n :icon=\"\n getMessageFeedback(message.id)\n ?.vote === 'downvote'\n ? 'ri:thumb-down-fill'\n : 'ri:thumb-down-line'\n \"\n :title=\"$t('action.downvote')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('downvote', message)\n \" />\n </transition>\n <transition mode=\"out-in\">\n <VvButton\n v-if=\"\n isActionButtonVisible(\n 'feedback',\n index,\n )\n \"\n :icon=\"\n getMessageFeedback(message.id)\n ?.comment\n ? 'ri:feedback-fill'\n : 'ri:feedback-line'\n \"\n :title=\"$t('action.feedback')\"\n modifiers=\"action-quiet-small\"\n @click.stop=\"\n $emit('feedback', message)\n \" />\n </transition>\n </VvButtonGroup>\n <span\n v-if=\"\n showMessageTokensCount &&\n message.metadata?.totalTokens\n \"\n class=\"flex items-center gap-4 text-12 text-word-3\">\n <VvIcon name=\"ri:ai-generate-2-line\" />\n {{\n $n(message.metadata.totalTokens, 'integer')\n }}\n {{ $t('label.tokens') }}\n </span>\n <time\n v-if=\"\n showMessageDateTime &&\n message.metadata?.createdAt\n \"\n :datetime=\"\n new Date(\n message.metadata?.createdAt,\n ).toISOString()\n \"\n class=\"flex items-center gap-4 text-12 text-word-3\">\n <VvIcon name=\"ri:time-line\" />\n {{\n $d(\n new Date(message.metadata?.createdAt),\n 'date-time',\n )\n }}\n </time>\n <div\n v-if=\"\n showMessageDateTime &&\n message?.metadata?.completedAt &&\n message?.metadata?.createdAt\n \"\n class=\"flex items-center gap-4 text-12 text-word-3\">\n <VvIcon name=\"ri:hourglass-line\" />\n <PkRelativeTime\n :date=\"message.metadata?.createdAt\"\n :end-date=\"message.metadata?.completedAt\" />\n </div>\n </div>\n </transition>\n <transition mode=\"out-in\">\n <PkChatbotFeedbackForm\n v-if=\"message.id === feedbackMessageId\"\n ref=\"feedbackMessageEl\"\n :loading=\"feedbackLoading\"\n :submitted=\"feedbackSubmitted\"\n :error=\"feedbackError\"\n @submit=\"$emit('feedback-submit', $event)\"\n @close=\"$emit('feedback-close')\" />\n </transition>\n </div>\n </template>\n <PkChatbotError\n v-if=\"isError\"\n :error\n @retry=\"$emit('auto-retry')\"\n @reset=\"$emit('reset-chat')\" />\n <div\n v-if=\"activeMessage?.role === 'user' || isError\"\n :style=\"{ minHeight: `${height}px` }\"></div>\n </div>\n </div>\n</template>\n\n<style lang=\"scss\">\n .pk-chatbot-messages {\n overflow-y: auto;\n flex: 1;\n min-width: 0;\n font-size: var(--spacing-14);\n\n scrollbar-width: thin;\n scrollbar-gutter: auto;\n scrollbar-color: var(--color-word-5) var(--color-surface-1);\n\n &__wrapper {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-16);\n min-width: 0;\n }\n\n &__divider {\n border-bottom: 1px solid var(--color-surface-3);\n }\n }\n\n .pk-chatbot-divider {\n position: relative;\n border-bottom: 1px solid var(--color-surface-3);\n\n &__label {\n position: absolute;\n padding-inline: var(--spacing-8);\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--color-surface);\n color: var(--color-word-4);\n font-size: var(--text-12);\n }\n }\n\n .pk-chatbot-message {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-sm);\n min-width: 0;\n align-items: flex-start;\n\n &__text {\n color: var(--color-word-2);\n line-height: var(--leading-normal);\n border-width: var(--spacing-px);\n border-color: var(--color-surface-3);\n padding: var(--spacing-sm);\n border-radius: var(--rounded-xl) var(--rounded-xl) var(--rounded-xl)\n 0;\n }\n\n &__loading-info {\n line-height: var(--leading-normal);\n border-width: var(--spacing-px);\n border-color: var(--color-surface-3);\n padding: var(--spacing-sm);\n border-radius: var(--rounded-xl) var(--rounded-xl) var(--rounded-xl)\n 0;\n font-size: var(--text-12);\n color: var(--color-word-3);\n }\n\n &__footer {\n width: 100%;\n display: flex;\n gap: var(--spacing-8);\n align-items: center;\n }\n\n &--user {\n align-items: flex-end;\n\n .pk-chatbot-message__text {\n background-color: var(\n --chatbot-main-color,\n var(--color-surface-1)\n );\n border-width: var(--spacing-px);\n border-color: var(--chatbot-main-color, var(--color-surface-4));\n color: var(--chatbot-contrast-color, var(--color-word-1));\n border-radius: var(--rounded-xl) var(--rounded-xl) 0\n var(--rounded-xl);\n }\n }\n\n &--assistant {\n width: 100%;\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: var(--spacing-16);\n overflow: hidden;\n\n .pk-chatbot-message__text {\n width: 100%;\n }\n }\n\n &--system {\n align-items: flex-end;\n\n .pk-chatbot-message__text {\n display: flex;\n gap: var(--spacing-8);\n font-size: var(--text-12);\n padding: var(--spacing-8) var(--spacing-sm);\n align-items: center;\n border-width: var(--spacing-px);\n border-color: var(--chatbot-main-color, var(--color-surface-4));\n color: var(--chatbot-main-color, var(--color-word-1));\n border-radius: var(--rounded-xl) var(--rounded-xl) 0\n var(--rounded-xl);\n }\n }\n }\n</style>\n"],"mappings":"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"}

package/dist-vue/_chunks/PkChatbotViewChat-LdHOe19w.js ADDED Viewed

@@ -0,0 +1,246 @@
+import { t as e } from "./useChatbotStore-C9xj40sY.js";
+import { t } from "./PkToolShowSources-B_UfP0QT.js";
+import { t as n } from "./PkChatbotMessages-DJngZXIX.js";
+import { t as r } from "./PkChatbotInput-DjUU_5_9.js";
+import { t as i } from "./PkToolShowMultipleChoice-DB5ZvvhS.js";
+import { r as a, t as o } from "./PkToolShowContactForm-DQDXyNco.js";
+import { t as s } from "./PkToolShowSuggestedReply-BVa6p4DJ.js";
+import { t as c } from "./PkToolShowLocation-CaG0Txb6.js";
+import { Fragment as l, Transition as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, createVNode as _, defineComponent as v, isRef as y, normalizeClass as ee, onMounted as b, openBlock as x, toDisplayString as S, unref as C, useTemplateRef as te, withCtx as w } from "vue";
+import { VvIcon as T } from "@volverjs/ui-vue/components";
+import { useDropZone as ne } from "@vueuse/core";
+import { useI18n as E } from "vue-i18n";
+import { storeToRefs as re } from "pinia";
+//#region ../../packages/components/src/chat/PkToolRequestGeolocation.vue?vue&type=script&setup=true&lang.ts
+var D = { class: "flex items-center gap-6 text-12 text-word-3 border border-surface-3 rounded-xl px-sm py-10" }, O = /* @__PURE__ */ v({
+	__name: "PkToolRequestGeolocation",
+	props: {
+		part: {},
+		reverseGeocode: { type: Function }
+	},
+	emits: ["result"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, { t: i } = E({ useScope: "global" }), a = d(() => n.part), o = d(() => a.value.state ?? "unknown"), s = d(() => o.value === "output-available"), c = d(() => {
+			let e = a.value.output;
+			if (!(!e || "error" in e)) return e;
+		}), u = d(() => {
+			let e = a.value.output;
+			if (!(!e || !("error" in e))) return e;
+		});
+		function f(e) {
+			return e === 1 ? "permission_denied" : e === 3 ? "timeout" : "position_unavailable";
+		}
+		return b(() => {
+			if (o.value === "input-available") {
+				if (!navigator.geolocation) {
+					r("result", { error: "position_unavailable" });
+					return;
+				}
+				navigator.geolocation.getCurrentPosition(async (e) => {
+					let { latitude: t, longitude: i, accuracy: a } = e.coords;
+					r("result", {
+						latitude: t,
+						longitude: i,
+						accuracy: a,
+						city: n.reverseGeocode ? await n.reverseGeocode(t, i).catch(() => void 0) : void 0
+					});
+				}, (e) => {
+					r("result", { error: f(e.code) });
+				}, { timeout: 15e3 });
+			}
+		}), (e, t) => {
+			let n = T;
+			return x(), m("div", D, [s.value ? c.value ? (x(), m(l, { key: 1 }, [_(n, {
+				name: "ri:map-pin-line",
+				class: "text-16"
+			}), h("span", null, [g(S(e.$n(c.value.latitude, {
+				style: "decimal",
+				minimumFractionDigits: 5,
+				maximumFractionDigits: 5
+			})) + ", " + S(e.$n(c.value.longitude, {
+				style: "decimal",
+				minimumFractionDigits: 5,
+				maximumFractionDigits: 5
+			})) + " ", 1), c.value.accuracy === void 0 ? p("", !0) : (x(), m(l, { key: 0 }, [g(" (±" + S(e.$n(c.value.accuracy, {
+				style: "unit",
+				unit: "meter"
+			})) + ") ", 1)], 64))])], 64)) : u.value ? (x(), m(l, { key: 2 }, [t[0] ||= h("span", { class: "i-vv-alert-circle text-16 shrink-0 text-danger" }, null, -1), h("span", null, S(u.value.error === "permission_denied" ? C(i)("message.geolocationPermissionDenied") : C(i)("message.geolocationUnavailable")), 1)], 64)) : p("", !0) : (x(), m(l, { key: 0 }, [_(n, {
+				name: "line-md:loading-loop",
+				class: "text-16"
+			}), h("span", null, S(C(i)("messagePart.requestGeolocation")), 1)], 64))]);
+		};
+	}
+}), k = {
+	key: 0,
+	class: "p-md border-t border-surface-3 text-center text-12 text-danger-darken-2 bg-surface-danger"
+}, ie = {
+	key: 0,
+	class: "pk-chatbot-view-chat__drop-overlay"
+}, A = /* @__PURE__ */ v({
+	__name: "PkChatbotViewChat",
+	props: { agentId: {} },
+	emits: ["show-info", "revise"],
+	setup(l, { emit: g }) {
+		let v = l, b = g, E = e(v.agentId), { name: D, agentInterface: A, agentFileUpload: j, actions: ae, revisedAnswers: oe, messages: se, chat: M, messageFeedbacks: ce, feedbackDialogMessage: N, isFeedbackSubmitting: P, isFeedbackSubmitted: F, feedbackSubmitError: I, isLeadSubmitted: L, isLoadingSubmitLead: R, submitLeadError: z, input: B, inputMessagePlaceholder: V, isConversationBlocked: H, baseUrl: U, pendingAttachments: W, apiClient: G } = re(E), { handleSubmit: K, stopGeneration: le, regenerate: q, onUpvote: ue, onDownvote: de, onFeedback: J, onFeedbackSubmit: fe, onLeadSubmit: pe, startNewChat: me, addToolOutput: Y, handleFileSelect: X } = E, Z = a(() => A.value?.dismissableNotice), Q = te("chatViewEl"), he = async (e) => (await G.value.expandSourceContext(v.agentId, e.documentId, e.chunkIndex)).content, ge = async (e) => {
+			let t = await G.value.downloadSourceDocument(v.agentId, e);
+			window.open(t.downloadUrl, "_blank");
+		}, { isOverDropZone: $ } = ne(Q, {
+			dataTypes: d(() => j.value?.allowedMimeTypes ?? []),
+			onDrop: (e) => {
+				if (!(!j.value?.enabled || !e)) for (let t of e) X(t);
+			}
+		});
+		return (e, a) => {
+			let l = T;
+			return x(), m("div", {
+				ref_key: "chatViewEl",
+				ref: Q,
+				class: ee(["pk-chatbot-view-chat", { "pk-chatbot-view-chat--dragover": C($) && C(j)?.enabled }])
+			}, [
+				_(n, {
+					class: "flex flex-col flex-1 min-h-0 p-md overflow-y-auto",
+					name: C(D),
+					messages: C(se),
+					status: C(M).status,
+					error: C(M).error,
+					"main-color": C(A)?.mainColor,
+					"text-color": C(A)?.textColor,
+					"revised-answers": C(oe),
+					actions: C(ae),
+					logo: C(A)?.logo,
+					"message-feedbacks": C(ce),
+					"feedback-message-id": C(N)?.id,
+					"feedback-loading": C(P),
+					"feedback-submitted": C(F),
+					"feedback-error": C(I),
+					onFeedbackSubmit: a[1] ||= (e) => C(fe)(e),
+					onFeedbackClose: a[2] ||= (e) => N.value = void 0,
+					onRegenerate: C(q),
+					onAutoRetry: C(q),
+					onResetChat: C(me),
+					onShowInfo: a[3] ||= (e) => b("show-info", e),
+					onRevise: a[4] ||= (e) => b("revise", e),
+					onUpvote: C(ue),
+					onDownvote: C(de),
+					onFeedback: C(J)
+				}, {
+					"tool-showContactForm": w(({ part: e }) => [_(o, {
+						part: e,
+						readonly: !C(U),
+						submitted: C(L),
+						loading: C(R),
+						error: C(z),
+						"privacy-policy-notice": C(A)?.privacyPolicyNotice,
+						onSubmit: C(pe)
+					}, null, 8, [
+						"part",
+						"readonly",
+						"submitted",
+						"loading",
+						"error",
+						"privacy-policy-notice",
+						"onSubmit"
+					])]),
+					"tool-showSuggestedReply": w(({ part: e }) => [_(s, {
+						part: e,
+						onSelect: a[0] ||= (e) => {
+							B.value = e, C(K)();
+						}
+					}, null, 8, ["part"])]),
+					"tool-showSources": w(({ part: e }) => [_(t, {
+						part: e,
+						"on-expand-context": he,
+						"on-download": ge
+					}, null, 8, ["part"])]),
+					"tool-showMultipleChoice": w(({ part: e }) => [_(u, { mode: "out-in" }, {
+						default: w(() => [_(i, {
+							part: e,
+							onSelect: (t) => C(Y)({
+								tool: "showMultipleChoice",
+								toolCallId: e.toolCallId,
+								output: t
+							})
+						}, null, 8, ["part", "onSelect"])]),
+						_: 2
+					}, 1024)]),
+					"tool-requestGeolocation": w(({ part: e }) => [_(O, {
+						part: e,
+						"reverse-geocode": (e, t) => C(G).reverseGeocode(e, t),
+						onResult: (t) => C(Y)({
+							tool: "requestGeolocation",
+							toolCallId: e.toolCallId,
+							output: t
+						})
+					}, null, 8, [
+						"part",
+						"reverse-geocode",
+						"onResult"
+					])]),
+					"tool-showLocation": w(({ part: e }) => [_(c, {
+						part: e,
+						"forward-geocode": (e, t) => C(G).forwardGeocode(e, t)
+					}, null, 8, ["part", "forward-geocode"])]),
+					_: 1
+				}, 8, [
+					"name",
+					"messages",
+					"status",
+					"error",
+					"main-color",
+					"text-color",
+					"revised-answers",
+					"actions",
+					"logo",
+					"message-feedbacks",
+					"feedback-message-id",
+					"feedback-loading",
+					"feedback-submitted",
+					"feedback-error",
+					"onRegenerate",
+					"onAutoRetry",
+					"onResetChat",
+					"onUpvote",
+					"onDownvote",
+					"onFeedback"
+				]),
+				C(H) ? (x(), m("div", k, S(e.$t("message.chatErrorConversationBlocked")), 1)) : (x(), f(r, {
+					key: 1,
+					modelValue: C(B),
+					"onUpdate:modelValue": a[5] ||= (e) => y(B) ? B.value = e : null,
+					"pending-attachments": C(W),
+					"onUpdate:pendingAttachments": a[6] ||= (e) => y(W) ? W.value = e : null,
+					placeholder: C(V),
+					"dismissable-notice": C(Z) && C(M).messages.length <= 1 ? C(Z) : void 0,
+					status: C(M).status,
+					"max-message-length": C(A)?.maxMessageLength,
+					"file-upload": C(j),
+					onStopGeneration: C(le),
+					onSubmit: C(K),
+					onFileSelect: C(X)
+				}, null, 8, [
+					"modelValue",
+					"pending-attachments",
+					"placeholder",
+					"dismissable-notice",
+					"status",
+					"max-message-length",
+					"file-upload",
+					"onStopGeneration",
+					"onSubmit",
+					"onFileSelect"
+				])),
+				_(u, null, {
+					default: w(() => [C($) && C(j)?.enabled ? (x(), m("div", ie, [_(l, {
+						name: "ri:upload-cloud-2-line",
+						class: "pk-chatbot-view-chat__drop-overlay-icon"
+					}), h("span", null, S(e.$t("action.dropFile")), 1)])) : p("", !0)]),
+					_: 1
+				})
+			], 2);
+		};
+	}
+});
+//#endregion
+export { A as t };
+//# sourceMappingURL=PkChatbotViewChat-LdHOe19w.js.map

package/dist-vue/_chunks/PkChatbotViewChat-LdHOe19w.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PkChatbotViewChat-LdHOe19w.js","names":["$n","$t"],"sources":["../../../../packages/components/src/chat/PkToolRequestGeolocation.vue","../../../../packages/components/src/chat/PkToolRequestGeolocation.vue","../../../../packages/components/src/chat/PkChatbotViewChat.vue","../../../../packages/components/src/chat/PkChatbotViewChat.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { computed, onMounted } from 'vue'\n import { useI18n } from 'vue-i18n'\n\n import type { ReverseGeocodeFn } from 'utils/src/device-context'\n\n type GeolocationOutput =\n | {\n latitude: number\n longitude: number\n accuracy?: number\n city?: string\n }\n | { error: 'permission_denied' | 'position_unavailable' | 'timeout' }\n\n const props = defineProps<{\n part: unknown\n reverseGeocode?: ReverseGeocodeFn\n }>()\n\n const emit = defineEmits<{\n result: [output: GeolocationOutput]\n }>()\n\n const { t: $t } = useI18n({ useScope: 'global' })\n\n const toolPart = computed(() => {\n return props.part as {\n state?: string\n input?: { reason?: string }\n output?: GeolocationOutput\n }\n })\n\n const state = computed(() => toolPart.value.state ?? 'unknown')\n\n const isOutputAvailable = computed(() => state.value === 'output-available')\n\n const successOutput = computed(() => {\n const out = toolPart.value.output\n if (!out || 'error' in out) {\n return undefined\n }\n return out\n })\n\n const errorOutput = computed(() => {\n const out = toolPart.value.output\n if (!out || !('error' in out)) {\n return undefined\n }\n return out\n })\n\n /** Maps GeolocationPositionError.code to a typed string */\n function mapGeolocationError(\n code: number,\n ): 'permission_denied' | 'position_unavailable' | 'timeout' {\n if (code === 1) {\n return 'permission_denied'\n }\n if (code === 3) {\n return 'timeout'\n }\n return 'position_unavailable'\n }\n\n onMounted(() => {\n if (state.value !== 'input-available') {\n return\n }\n\n if (!navigator.geolocation) {\n emit('result', { error: 'position_unavailable' })\n return\n }\n\n navigator.geolocation.getCurrentPosition(\n async (position) => {\n const { latitude, longitude, accuracy } = position.coords\n const city = props.reverseGeocode\n ? await props\n .reverseGeocode(latitude, longitude)\n .catch(() => undefined)\n : undefined\n emit('result', { latitude, longitude, accuracy, city })\n },\n (error) => {\n emit('result', { error: mapGeolocationError(error.code) })\n },\n { timeout: 15000 },\n )\n })\n</script>\n\n<template>\n <div\n class=\"flex items-center gap-6 text-12 text-word-3 border border-surface-3 rounded-xl px-sm py-10\">\n \n <template v-if=\"!isOutputAvailable\">\n <VvIcon name=\"line-md:loading-loop\" class=\"text-16\" />\n <span>{{ $t('messagePart.requestGeolocation') }}</span>\n </template>\n\n \n <template v-else-if=\"successOutput\">\n <VvIcon name=\"ri:map-pin-line\" class=\"text-16\" />\n <span>\n {{\n $n(successOutput.latitude, {\n style: 'decimal',\n minimumFractionDigits: 5,\n maximumFractionDigits: 5,\n })\n }},\n {{\n $n(successOutput.longitude, {\n style: 'decimal',\n minimumFractionDigits: 5,\n maximumFractionDigits: 5,\n })\n }}\n <template v-if=\"successOutput.accuracy !== undefined\">\n (±{{\n $n(successOutput.accuracy, {\n style: 'unit',\n unit: 'meter',\n })\n }})\n </template>\n </span>\n </template>\n\n \n <template v-else-if=\"errorOutput\">\n <span class=\"i-vv-alert-circle text-16 shrink-0 text-danger\" />\n <span>\n {{\n errorOutput.error === 'permission_denied'\n ? $t('message.geolocationPermissionDenied')\n : $t('message.geolocationUnavailable')\n }}\n </span>\n </template>\n </div>\n</template>\n","<script setup lang=\"ts\">\n import { computed, onMounted } from 'vue'\n import { useI18n } from 'vue-i18n'\n\n import type { ReverseGeocodeFn } from 'utils/src/device-context'\n\n type GeolocationOutput =\n | {\n latitude: number\n longitude: number\n accuracy?: number\n city?: string\n }\n | { error: 'permission_denied' | 'position_unavailable' | 'timeout' }\n\n const props = defineProps<{\n part: unknown\n reverseGeocode?: ReverseGeocodeFn\n }>()\n\n const emit = defineEmits<{\n result: [output: GeolocationOutput]\n }>()\n\n const { t: $t } = useI18n({ useScope: 'global' })\n\n const toolPart = computed(() => {\n return props.part as {\n state?: string\n input?: { reason?: string }\n output?: GeolocationOutput\n }\n })\n\n const state = computed(() => toolPart.value.state ?? 'unknown')\n\n const isOutputAvailable = computed(() => state.value === 'output-available')\n\n const successOutput = computed(() => {\n const out = toolPart.value.output\n if (!out || 'error' in out) {\n return undefined\n }\n return out\n })\n\n const errorOutput = computed(() => {\n const out = toolPart.value.output\n if (!out || !('error' in out)) {\n return undefined\n }\n return out\n })\n\n /** Maps GeolocationPositionError.code to a typed string */\n function mapGeolocationError(\n code: number,\n ): 'permission_denied' | 'position_unavailable' | 'timeout' {\n if (code === 1) {\n return 'permission_denied'\n }\n if (code === 3) {\n return 'timeout'\n }\n return 'position_unavailable'\n }\n\n onMounted(() => {\n if (state.value !== 'input-available') {\n return\n }\n\n if (!navigator.geolocation) {\n emit('result', { error: 'position_unavailable' })\n return\n }\n\n navigator.geolocation.getCurrentPosition(\n async (position) => {\n const { latitude, longitude, accuracy } = position.coords\n const city = props.reverseGeocode\n ? await props\n .reverseGeocode(latitude, longitude)\n .catch(() => undefined)\n : undefined\n emit('result', { latitude, longitude, accuracy, city })\n },\n (error) => {\n emit('result', { error: mapGeolocationError(error.code) })\n },\n { timeout: 15000 },\n )\n })\n</script>\n\n<template>\n <div\n class=\"flex items-center gap-6 text-12 text-word-3 border border-surface-3 rounded-xl px-sm py-10\">\n \n <template v-if=\"!isOutputAvailable\">\n <VvIcon name=\"line-md:loading-loop\" class=\"text-16\" />\n <span>{{ $t('messagePart.requestGeolocation') }}</span>\n </template>\n\n \n <template v-else-if=\"successOutput\">\n <VvIcon name=\"ri:map-pin-line\" class=\"text-16\" />\n <span>\n {{\n $n(successOutput.latitude, {\n style: 'decimal',\n minimumFractionDigits: 5,\n maximumFractionDigits: 5,\n })\n }},\n {{\n $n(successOutput.longitude, {\n style: 'decimal',\n minimumFractionDigits: 5,\n maximumFractionDigits: 5,\n })\n }}\n <template v-if=\"successOutput.accuracy !== undefined\">\n (±{{\n $n(successOutput.accuracy, {\n style: 'unit',\n unit: 'meter',\n })\n }})\n </template>\n </span>\n </template>\n\n \n <template v-else-if=\"errorOutput\">\n <span class=\"i-vv-alert-circle text-16 shrink-0 text-danger\" />\n <span>\n {{\n errorOutput.error === 'permission_denied'\n ? $t('message.geolocationPermissionDenied')\n : $t('message.geolocationUnavailable')\n }}\n </span>\n </template>\n </div>\n</template>\n","<script setup lang=\"ts\">\n import { computed, useTemplateRef } from 'vue'\n import { useDropZone } from '@vueuse/core'\n import { storeToRefs } from 'pinia'\n import PkChatbotMessages from './PkChatbotMessages.vue'\n import PkChatbotInput from './PkChatbotInput.vue'\n import PkToolShowMultipleChoice from './PkToolShowMultipleChoice.vue'\n import PkToolShowContactForm from './PkToolShowContactForm.vue'\n import PkToolShowSuggestedReply from './PkToolShowSuggestedReply.vue'\n import PkToolShowSources from './PkToolShowSources.vue'\n import PkToolRequestGeolocation from './PkToolRequestGeolocation.vue'\n import PkToolShowLocation from './PkToolShowLocation.vue'\n import { useLocalizedString } from '../composables/useLocalizedString'\n import { useChatbotStore } from 'composables'\n import type { UIChatMessage } from 'models'\n\n const props = defineProps<{ agentId: string }>()\n\n const emit = defineEmits<{\n 'show-info': [message: UIChatMessage]\n revise: [message: UIChatMessage]\n }>()\n\n const store = useChatbotStore(props.agentId)\n\n const {\n name,\n agentInterface,\n agentFileUpload,\n actions,\n revisedAnswers,\n messages,\n chat,\n messageFeedbacks,\n feedbackDialogMessage,\n isFeedbackSubmitting,\n isFeedbackSubmitted,\n feedbackSubmitError,\n isLeadSubmitted,\n isLoadingSubmitLead,\n submitLeadError,\n input,\n inputMessagePlaceholder,\n isConversationBlocked,\n baseUrl,\n pendingAttachments,\n apiClient,\n } = storeToRefs(store)\n\n const {\n handleSubmit: storeHandleSubmit,\n stopGeneration,\n regenerate,\n onUpvote,\n onDownvote,\n onFeedback,\n onFeedbackSubmit,\n onLeadSubmit,\n startNewChat,\n addToolOutput,\n handleFileSelect,\n } = store\n\n const dismissableNotice = useLocalizedString(\n () => agentInterface.value?.dismissableNotice,\n )\n\n const chatViewEl = useTemplateRef<HTMLDivElement>('chatViewEl')\n\n const handleExpandSourceContext = async (payload: {\n documentId: string\n chunkIndex: number\n }) => {\n const result = await apiClient.value.expandSourceContext(\n props.agentId,\n payload.documentId,\n payload.chunkIndex,\n )\n return result.content\n }\n\n const handleDownloadSource = async (documentId: string) => {\n const result = await apiClient.value.downloadSourceDocument(\n props.agentId,\n documentId,\n )\n window.open(result.downloadUrl, '_blank')\n }\n\n const handleFileDrop = (files: File[] | null) => {\n if (!agentFileUpload.value?.enabled || !files) {\n return\n }\n for (const file of files) {\n handleFileSelect(file)\n }\n }\n\n const { isOverDropZone } = useDropZone(chatViewEl, {\n dataTypes: computed(\n () => agentFileUpload.value?.allowedMimeTypes ?? [],\n ),\n onDrop: handleFileDrop,\n })\n</script>\n\n<template>\n <div\n ref=\"chatViewEl\"\n class=\"pk-chatbot-view-chat\"\n :class=\"{\n 'pk-chatbot-view-chat--dragover':\n isOverDropZone && agentFileUpload?.enabled,\n }\">\n \n <PkChatbotMessages\n class=\"flex flex-col flex-1 min-h-0 p-md overflow-y-auto\"\n :name=\"name\"\n :messages=\"messages\"\n :status=\"chat.status\"\n :error=\"chat.error\"\n :main-color=\"agentInterface?.mainColor\"\n :text-color=\"agentInterface?.textColor\"\n :revised-answers=\"revisedAnswers\"\n :actions=\"actions\"\n :logo=\"agentInterface?.logo\"\n :message-feedbacks=\"messageFeedbacks\"\n :feedback-message-id=\"feedbackDialogMessage?.id\"\n :feedback-loading=\"isFeedbackSubmitting\"\n :feedback-submitted=\"isFeedbackSubmitted\"\n :feedback-error=\"feedbackSubmitError\"\n @feedback-submit=\"onFeedbackSubmit($event)\"\n @feedback-close=\"feedbackDialogMessage = undefined\"\n @regenerate=\"regenerate\"\n @auto-retry=\"regenerate\"\n @reset-chat=\"startNewChat\"\n @show-info=\"emit('show-info', $event)\"\n @revise=\"emit('revise', $event)\"\n @upvote=\"onUpvote\"\n @downvote=\"onDownvote\"\n @feedback=\"onFeedback\">\n <template #tool-showContactForm=\"{ part }\">\n <PkToolShowContactForm\n :part\n :readonly=\"!baseUrl\"\n :submitted=\"isLeadSubmitted\"\n :loading=\"isLoadingSubmitLead\"\n :error=\"submitLeadError\"\n :privacy-policy-notice=\"agentInterface?.privacyPolicyNotice\"\n @submit=\"onLeadSubmit\" />\n </template>\n <template #tool-showSuggestedReply=\"{ part }\">\n <PkToolShowSuggestedReply\n :part\n @select=\"\n ($event) => {\n input = $event\n storeHandleSubmit()\n }\n \" />\n </template>\n <template #tool-showSources=\"{ part }\">\n <PkToolShowSources\n :part\n :on-expand-context=\"handleExpandSourceContext\"\n :on-download=\"handleDownloadSource\" />\n </template>\n <template #tool-showMultipleChoice=\"{ part }\">\n <transition mode=\"out-in\">\n <PkToolShowMultipleChoice\n :part\n @select=\"\n addToolOutput({\n tool: 'showMultipleChoice',\n toolCallId: (part as any).toolCallId,\n output: $event,\n })\n \" />\n </transition>\n </template>\n <template #tool-requestGeolocation=\"{ part }\">\n <PkToolRequestGeolocation\n :part\n :reverse-geocode=\"\n (lat: number, lon: number) =>\n apiClient.reverseGeocode(lat, lon)\n \"\n @result=\"\n addToolOutput({\n tool: 'requestGeolocation',\n toolCallId: (part as any).toolCallId,\n output: $event,\n })\n \" />\n </template>\n <template #tool-showLocation=\"{ part }\">\n <PkToolShowLocation\n :part\n :forward-geocode=\"\n (query: string, lang?: string) =>\n apiClient.forwardGeocode(query, lang)\n \" />\n </template>\n </PkChatbotMessages>\n \n\n \n <div\n v-if=\"isConversationBlocked\"\n class=\"p-md border-t border-surface-3 text-center text-12 text-danger-darken-2 bg-surface-danger\">\n {{ $t('message.chatErrorConversationBlocked') }}\n </div>\n <PkChatbotInput\n v-else\n v-model=\"input\"\n v-model:pending-attachments=\"pendingAttachments\"\n :placeholder=\"inputMessagePlaceholder\"\n :dismissable-notice=\"\n dismissableNotice && chat.messages.length <= 1\n ? dismissableNotice\n : undefined\n \"\n :status=\"chat.status\"\n :max-message-length=\"agentInterface?.maxMessageLength\"\n :file-upload=\"agentFileUpload\"\n @stop-generation=\"stopGeneration\"\n @submit=\"storeHandleSubmit\"\n @file-select=\"handleFileSelect\" />\n \n <Transition>\n <div\n v-if=\"isOverDropZone && agentFileUpload?.enabled\"\n class=\"pk-chatbot-view-chat__drop-overlay\">\n <VvIcon\n name=\"ri:upload-cloud-2-line\"\n class=\"pk-chatbot-view-chat__drop-overlay-icon\" />\n <span>{{ $t('action.dropFile') }}</span>\n </div>\n </Transition>\n </div>\n</template>\n\n<style lang=\"scss\">\n .pk-chatbot-view-chat {\n position: relative;\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n\n &__drop-overlay {\n position: absolute;\n inset: var(--spacing-sm) var(--spacing-sm) var(--spacing-sm)\n var(--spacing-sm);\n z-index: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n background-color: color-mix(\n in srgb,\n var(--color-surface) 85%,\n transparent\n );\n border-radius: var(--rounded-xl);\n border: var(--spacing-2) dashed var(--color-surface-5);\n pointer-events: none;\n color: var(--color-word-3);\n\n &-icon {\n font-size: var(--spacing-32);\n }\n }\n }\n</style>\n","<script setup lang=\"ts\">\n import { computed, useTemplateRef } from 'vue'\n import { useDropZone } from '@vueuse/core'\n import { storeToRefs } from 'pinia'\n import PkChatbotMessages from './PkChatbotMessages.vue'\n import PkChatbotInput from './PkChatbotInput.vue'\n import PkToolShowMultipleChoice from './PkToolShowMultipleChoice.vue'\n import PkToolShowContactForm from './PkToolShowContactForm.vue'\n import PkToolShowSuggestedReply from './PkToolShowSuggestedReply.vue'\n import PkToolShowSources from './PkToolShowSources.vue'\n import PkToolRequestGeolocation from './PkToolRequestGeolocation.vue'\n import PkToolShowLocation from './PkToolShowLocation.vue'\n import { useLocalizedString } from '../composables/useLocalizedString'\n import { useChatbotStore } from 'composables'\n import type { UIChatMessage } from 'models'\n\n const props = defineProps<{ agentId: string }>()\n\n const emit = defineEmits<{\n 'show-info': [message: UIChatMessage]\n revise: [message: UIChatMessage]\n }>()\n\n const store = useChatbotStore(props.agentId)\n\n const {\n name,\n agentInterface,\n agentFileUpload,\n actions,\n revisedAnswers,\n messages,\n chat,\n messageFeedbacks,\n feedbackDialogMessage,\n isFeedbackSubmitting,\n isFeedbackSubmitted,\n feedbackSubmitError,\n isLeadSubmitted,\n isLoadingSubmitLead,\n submitLeadError,\n input,\n inputMessagePlaceholder,\n isConversationBlocked,\n baseUrl,\n pendingAttachments,\n apiClient,\n } = storeToRefs(store)\n\n const {\n handleSubmit: storeHandleSubmit,\n stopGeneration,\n regenerate,\n onUpvote,\n onDownvote,\n onFeedback,\n onFeedbackSubmit,\n onLeadSubmit,\n startNewChat,\n addToolOutput,\n handleFileSelect,\n } = store\n\n const dismissableNotice = useLocalizedString(\n () => agentInterface.value?.dismissableNotice,\n )\n\n const chatViewEl = useTemplateRef<HTMLDivElement>('chatViewEl')\n\n const handleExpandSourceContext = async (payload: {\n documentId: string\n chunkIndex: number\n }) => {\n const result = await apiClient.value.expandSourceContext(\n props.agentId,\n payload.documentId,\n payload.chunkIndex,\n )\n return result.content\n }\n\n const handleDownloadSource = async (documentId: string) => {\n const result = await apiClient.value.downloadSourceDocument(\n props.agentId,\n documentId,\n )\n window.open(result.downloadUrl, '_blank')\n }\n\n const handleFileDrop = (files: File[] | null) => {\n if (!agentFileUpload.value?.enabled || !files) {\n return\n }\n for (const file of files) {\n handleFileSelect(file)\n }\n }\n\n const { isOverDropZone } = useDropZone(chatViewEl, {\n dataTypes: computed(\n () => agentFileUpload.value?.allowedMimeTypes ?? [],\n ),\n onDrop: handleFileDrop,\n })\n</script>\n\n<template>\n <div\n ref=\"chatViewEl\"\n class=\"pk-chatbot-view-chat\"\n :class=\"{\n 'pk-chatbot-view-chat--dragover':\n isOverDropZone && agentFileUpload?.enabled,\n }\">\n \n <PkChatbotMessages\n class=\"flex flex-col flex-1 min-h-0 p-md overflow-y-auto\"\n :name=\"name\"\n :messages=\"messages\"\n :status=\"chat.status\"\n :error=\"chat.error\"\n :main-color=\"agentInterface?.mainColor\"\n :text-color=\"agentInterface?.textColor\"\n :revised-answers=\"revisedAnswers\"\n :actions=\"actions\"\n :logo=\"agentInterface?.logo\"\n :message-feedbacks=\"messageFeedbacks\"\n :feedback-message-id=\"feedbackDialogMessage?.id\"\n :feedback-loading=\"isFeedbackSubmitting\"\n :feedback-submitted=\"isFeedbackSubmitted\"\n :feedback-error=\"feedbackSubmitError\"\n @feedback-submit=\"onFeedbackSubmit($event)\"\n @feedback-close=\"feedbackDialogMessage = undefined\"\n @regenerate=\"regenerate\"\n @auto-retry=\"regenerate\"\n @reset-chat=\"startNewChat\"\n @show-info=\"emit('show-info', $event)\"\n @revise=\"emit('revise', $event)\"\n @upvote=\"onUpvote\"\n @downvote=\"onDownvote\"\n @feedback=\"onFeedback\">\n <template #tool-showContactForm=\"{ part }\">\n <PkToolShowContactForm\n :part\n :readonly=\"!baseUrl\"\n :submitted=\"isLeadSubmitted\"\n :loading=\"isLoadingSubmitLead\"\n :error=\"submitLeadError\"\n :privacy-policy-notice=\"agentInterface?.privacyPolicyNotice\"\n @submit=\"onLeadSubmit\" />\n </template>\n <template #tool-showSuggestedReply=\"{ part }\">\n <PkToolShowSuggestedReply\n :part\n @select=\"\n ($event) => {\n input = $event\n storeHandleSubmit()\n }\n \" />\n </template>\n <template #tool-showSources=\"{ part }\">\n <PkToolShowSources\n :part\n :on-expand-context=\"handleExpandSourceContext\"\n :on-download=\"handleDownloadSource\" />\n </template>\n <template #tool-showMultipleChoice=\"{ part }\">\n <transition mode=\"out-in\">\n <PkToolShowMultipleChoice\n :part\n @select=\"\n addToolOutput({\n tool: 'showMultipleChoice',\n toolCallId: (part as any).toolCallId,\n output: $event,\n })\n \" />\n </transition>\n </template>\n <template #tool-requestGeolocation=\"{ part }\">\n <PkToolRequestGeolocation\n :part\n :reverse-geocode=\"\n (lat: number, lon: number) =>\n apiClient.reverseGeocode(lat, lon)\n \"\n @result=\"\n addToolOutput({\n tool: 'requestGeolocation',\n toolCallId: (part as any).toolCallId,\n output: $event,\n })\n \" />\n </template>\n <template #tool-showLocation=\"{ part }\">\n <PkToolShowLocation\n :part\n :forward-geocode=\"\n (query: string, lang?: string) =>\n apiClient.forwardGeocode(query, lang)\n \" />\n </template>\n </PkChatbotMessages>\n \n\n \n <div\n v-if=\"isConversationBlocked\"\n class=\"p-md border-t border-surface-3 text-center text-12 text-danger-darken-2 bg-surface-danger\">\n {{ $t('message.chatErrorConversationBlocked') }}\n </div>\n <PkChatbotInput\n v-else\n v-model=\"input\"\n v-model:pending-attachments=\"pendingAttachments\"\n :placeholder=\"inputMessagePlaceholder\"\n :dismissable-notice=\"\n dismissableNotice && chat.messages.length <= 1\n ? dismissableNotice\n : undefined\n \"\n :status=\"chat.status\"\n :max-message-length=\"agentInterface?.maxMessageLength\"\n :file-upload=\"agentFileUpload\"\n @stop-generation=\"stopGeneration\"\n @submit=\"storeHandleSubmit\"\n @file-select=\"handleFileSelect\" />\n \n <Transition>\n <div\n v-if=\"isOverDropZone && agentFileUpload?.enabled\"\n class=\"pk-chatbot-view-chat__drop-overlay\">\n <VvIcon\n name=\"ri:upload-cloud-2-line\"\n class=\"pk-chatbot-view-chat__drop-overlay-icon\" />\n <span>{{ $t('action.dropFile') }}</span>\n </div>\n </Transition>\n </div>\n</template>\n\n<style lang=\"scss\">\n .pk-chatbot-view-chat {\n position: relative;\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n\n &__drop-overlay {\n position: absolute;\n inset: var(--spacing-sm) var(--spacing-sm) var(--spacing-sm)\n var(--spacing-sm);\n z-index: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n background-color: color-mix(\n in srgb,\n var(--color-surface) 85%,\n transparent\n );\n border-radius: var(--rounded-xl);\n border: var(--spacing-2) dashed var(--color-surface-5);\n pointer-events: none;\n color: var(--color-word-3);\n\n &-icon {\n font-size: var(--spacing-32);\n }\n }\n }\n</style>\n"],"mappings":"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"}

package/dist-vue/_chunks/{PkChatbotViewConversations-DFv_8-8K.js → PkChatbotViewConversations-BAU8tPTf.js} RENAMED Viewed

@@ -1,6 +1,6 @@
-import { t as e } from "./useChatbotStore-B9BUWM4O.js";
-import { m as t, s as n } from "./src-DjRNH9vV.js";
-import { t as r } from "./PkRelativeTime-Bzh37jv5.js";
+import { t as e } from "./useChatbotStore-C9xj40sY.js";
+import { m as t, s as n } from "./src-BteqqLGW.js";
+import { t as r } from "./PkRelativeTime-ivIkVQRR.js";
 import { Fragment as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, normalizeClass as l, openBlock as u, renderList as d, toDisplayString as f, unref as p, withModifiers as m } from "vue";
 import { VvButton as h } from "@volverjs/ui-vue/components";
 import { useI18n as g } from "vue-i18n";
@@ -37,4 +37,4 @@ var v = { class: "flex flex-col flex-1 min-h-0 overflow-y-auto p-md gap-sm relat
 //#endregion
 export { D as t };
-//# sourceMappingURL=PkChatbotViewConversations-DFv_8-8K.js.map
+//# sourceMappingURL=PkChatbotViewConversations-BAU8tPTf.js.map

package/dist-vue/_chunks/{PkChatbotViewConversations-DFv_8-8K.js.map → PkChatbotViewConversations-BAU8tPTf.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PkChatbotViewConversations-~~DFv_8-8K~~.js","names":[],"sources":["../../../../packages/components/src/chat/PkChatbotViewConversations.vue","../../../../packages/components/src/chat/PkChatbotViewConversations.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { storeToRefs } from 'pinia'\n import { useI18n } from 'vue-i18n'\n import type { Chat as Conversation, UIChatMessage } from 'models'\n import { stripMarkdown, getTextPart } from 'utils'\n import { useChatbotStore } from 'composables'\n import PkRelativeTime from '../PkRelativeTime.vue'\n\n const props = defineProps<{ agentId: string }>()\n\n const { t: $t } = useI18n({ useScope: 'global' })\n\n const store = useChatbotStore(props.agentId)\n const { conversations, localChatId } = storeToRefs(store)\n const { navigate, startNewChat } = store\n\n const openConversation = (id: string) => {\n localChatId.value = id\n navigate('chat')\n }\n\n const isCurrentConversation = (conversation: Conversation) => {\n return localChatId.value === conversation.id\n }\n\n const getLastMessage = (\n messages: UIChatMessage[],\n role: 'user' \| 'assistant',\n ) => {\n return stripMarkdown(\n getTextPart(messages.filter((m) => m.role === role).slice(-1)[0]) \|\|\n '',\n )\n }\n</script>\n\n<template>\n <div\n class=\"flex flex-col flex-1 min-h-0 overflow-y-auto p-md gap-sm relative\">\n <div\n v-if=\"conversations.length === 0\"\n class=\"flex justify-center p-lg text-word-3 text-sm\">\n {{ $t('message.noConversations') }}\n </div>\n <ul\n v-else\n class=\"flex flex-col min-h-0 gap-8 overflow-auto px-8 pb-8 light-scrollbar pb-64\">\n <li v-for=\"conversation in conversations\" :key=\"conversation.id\">\n <button\n type=\"button\"\n class=\"rounded-md border p-10 cursor-pointer block w-full transition-colors text-14 leading-relaxed border-b border-surface-3 hover:border-surface-5 hover:bg-surface-1\"\n :class=\"{\n 'bg-surface-2 border-surface-5':\n isCurrentConversation(conversation),\n }\"\n @click=\"openConversation(conversation.id)\">\n <div class=\"flex items-center gap-16\">\n <strong class=\"font-bold truncate block flex-1\">\n {{\n stripMarkdown(conversation.title) \|\|\n getLastMessage(\n conversation.messages,\n 'assistant',\n )\n }}\n </strong>\n <span class=\"text-word-4 text-smaller shrink-0\">\n <PkRelativeTime :date=\"conversation.updatedAt\" />\n </span>\n </div>\n <span class=\"text-12 text-word-4 line-clamp-2\">\n {{\n stripMarkdown(conversation.summary) \|\|\n getLastMessage(conversation.messages, 'user')\n }}\n </span>\n </button>\n </li>\n </ul>\n <div\n class=\"absolute bottom-0 left-0 right-0 flex justify-center px-16 pb-16 pt-32 bg-gradient-to-t\">\n <VvButton\n class=\"text-14\"\n modifiers=\"rounded\"\n :label=\"$t('action.startNewChat')\"\n @click.stop=\"startNewChat()\" />\n </div>\n </div>\n</template>\n","<script setup lang=\"ts\">\n import { storeToRefs } from 'pinia'\n import { useI18n } from 'vue-i18n'\n import type { Chat as Conversation, UIChatMessage } from 'models'\n import { stripMarkdown, getTextPart } from 'utils'\n import { useChatbotStore } from 'composables'\n import PkRelativeTime from '../PkRelativeTime.vue'\n\n const props = defineProps<{ agentId: string }>()\n\n const { t: $t } = useI18n({ useScope: 'global' })\n\n const store = useChatbotStore(props.agentId)\n const { conversations, localChatId } = storeToRefs(store)\n const { navigate, startNewChat } = store\n\n const openConversation = (id: string) => {\n localChatId.value = id\n navigate('chat')\n }\n\n const isCurrentConversation = (conversation: Conversation) => {\n return localChatId.value === conversation.id\n }\n\n const getLastMessage = (\n messages: UIChatMessage[],\n role: 'user' \| 'assistant',\n ) => {\n return stripMarkdown(\n getTextPart(messages.filter((m) => m.role === role).slice(-1)[0]) \|\|\n '',\n )\n }\n</script>\n\n<template>\n <div\n class=\"flex flex-col flex-1 min-h-0 overflow-y-auto p-md gap-sm relative\">\n <div\n v-if=\"conversations.length === 0\"\n class=\"flex justify-center p-lg text-word-3 text-sm\">\n {{ $t('message.noConversations') }}\n </div>\n <ul\n v-else\n class=\"flex flex-col min-h-0 gap-8 overflow-auto px-8 pb-8 light-scrollbar pb-64\">\n <li v-for=\"conversation in conversations\" :key=\"conversation.id\">\n <button\n type=\"button\"\n class=\"rounded-md border p-10 cursor-pointer block w-full transition-colors text-14 leading-relaxed border-b border-surface-3 hover:border-surface-5 hover:bg-surface-1\"\n :class=\"{\n 'bg-surface-2 border-surface-5':\n isCurrentConversation(conversation),\n }\"\n @click=\"openConversation(conversation.id)\">\n <div class=\"flex items-center gap-16\">\n <strong class=\"font-bold truncate block flex-1\">\n {{\n stripMarkdown(conversation.title) \|\|\n getLastMessage(\n conversation.messages,\n 'assistant',\n )\n }}\n </strong>\n <span class=\"text-word-4 text-smaller shrink-0\">\n <PkRelativeTime :date=\"conversation.updatedAt\" />\n </span>\n </div>\n <span class=\"text-12 text-word-4 line-clamp-2\">\n {{\n stripMarkdown(conversation.summary) \|\|\n getLastMessage(conversation.messages, 'user')\n }}\n </span>\n </button>\n </li>\n </ul>\n <div\n class=\"absolute bottom-0 left-0 right-0 flex justify-center px-16 pb-16 pt-32 bg-gradient-to-t\">\n <VvButton\n class=\"text-14\"\n modifiers=\"rounded\"\n :label=\"$t('action.startNewChat')\"\n @click.stop=\"startNewChat()\" />\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAQI,IAAM,IAAQ,GAER,EAAE,GAAG,MAAO,EAAQ,EAAE,UAAU,UAAU,CAAA,EAE1C,IAAQ,EAAgB,EAAM,QAAO,EACrC,EAAE,kBAAe,mBAAgB,EAAY,EAAK,EAClD,EAAE,aAAU,oBAAiB,GAE7B,KAAoB,MAAe;AAErC,GADA,EAAY,QAAQ,GACpB,EAAS,OAAM;KAGb,KAAyB,MACpB,EAAY,UAAU,EAAa,IAGxC,KACF,GACA,MAEO,EACH,EAAY,EAAS,QAAQ,MAAM,EAAE,SAAS,EAAK,CAAC,MAAM,GAAG,CAAC,GAAG,IAC7D,GACR;;;eAKJ,EAkDM,OAlDN,GAkDM,CA/CQ,EAAA,EAAa,CAAC,WAAM,KAAA,GAAA,EAD9B,EAIM,OAJN,GAIM,EADC,EAAA,EAAE,CAAA,0BAAA,CAAA,EAAA,EAAA,KAAA,GAAA,EAET,EAkCK,MAlCL,GAkCK,EAAA,EAAA,GAAA,EA/BD,EA8BK,GAAA,MAAA,EA9BsB,EAAA,EAAa,GAA7B,YAAX,EA8BK,MAAA,EA9BsC,KAAK,EAAa,IAAA,EAAA,CACzD,EA4BS,UAAA;IA3BL,MAAK;IACL,OAAK,EAAA,CAAC,oKAAkK,EAAA,iCACzE,EAAsB,EAAY,EAAA,CAAA,CAAA;IAIhI,UAAK,MAAE,EAAiB,EAAa,GAAA;OACtC,EAaM,OAbN,GAaM,CAZF,EAQS,UART,GAQS,EAND,EAAA,EAAa,CAAC,EAAa,MAAK,IAAqC,EAAoD,EAAa,UAAA,YAAA,CAAA,EAAA,EAAA,EAO9I,EAEO,QAFP,GAEO,CADH,EAAiD,GAAA,EAAhC,MAAM,EAAa,WAAA,EAAA,MAAA,GAAA,CAAA,OAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAG5C,EAKO,QALP,GAKO,EAHC,EAAA,EAAa,CAAC,EAAa,QAAO,IAAiC,EAAe,EAAa,UAAQ,OAAA,CAAA,EAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,CAAA,cAO3H,EAOM,OAPN,GAOM,CALF,EAImC,GAAA;IAH/B,OAAM;IACN,WAAU;IACT,OAAO,EAAA,EAAE,CAAA,sBAAA;IACT,SAAK,AAAA,EAAA,OAAA,GAAA,MAAO,EAAA,EAAY,EAAA,EAAA,CAAA,OAAA,CAAA"}
1	+ {"version":3,"file":"PkChatbotViewConversations-BAU8tPTf.js","names":[],"sources":["../../../../packages/components/src/chat/PkChatbotViewConversations.vue","../../../../packages/components/src/chat/PkChatbotViewConversations.vue"],"sourcesContent":["<script setup lang=\"ts\">\n import { storeToRefs } from 'pinia'\n import { useI18n } from 'vue-i18n'\n import type { Chat as Conversation, UIChatMessage } from 'models'\n import { stripMarkdown, getTextPart } from 'utils'\n import { useChatbotStore } from 'composables'\n import PkRelativeTime from '../PkRelativeTime.vue'\n\n const props = defineProps<{ agentId: string }>()\n\n const { t: $t } = useI18n({ useScope: 'global' })\n\n const store = useChatbotStore(props.agentId)\n const { conversations, localChatId } = storeToRefs(store)\n const { navigate, startNewChat } = store\n\n const openConversation = (id: string) => {\n localChatId.value = id\n navigate('chat')\n }\n\n const isCurrentConversation = (conversation: Conversation) => {\n return localChatId.value === conversation.id\n }\n\n const getLastMessage = (\n messages: UIChatMessage[],\n role: 'user' \| 'assistant',\n ) => {\n return stripMarkdown(\n getTextPart(messages.filter((m) => m.role === role).slice(-1)[0]) \|\|\n '',\n )\n }\n</script>\n\n<template>\n <div\n class=\"flex flex-col flex-1 min-h-0 overflow-y-auto p-md gap-sm relative\">\n <div\n v-if=\"conversations.length === 0\"\n class=\"flex justify-center p-lg text-word-3 text-sm\">\n {{ $t('message.noConversations') }}\n </div>\n <ul\n v-else\n class=\"flex flex-col min-h-0 gap-8 overflow-auto px-8 pb-8 light-scrollbar pb-64\">\n <li v-for=\"conversation in conversations\" :key=\"conversation.id\">\n <button\n type=\"button\"\n class=\"rounded-md border p-10 cursor-pointer block w-full transition-colors text-14 leading-relaxed border-b border-surface-3 hover:border-surface-5 hover:bg-surface-1\"\n :class=\"{\n 'bg-surface-2 border-surface-5':\n isCurrentConversation(conversation),\n }\"\n @click=\"openConversation(conversation.id)\">\n <div class=\"flex items-center gap-16\">\n <strong class=\"font-bold truncate block flex-1\">\n {{\n stripMarkdown(conversation.title) \|\|\n getLastMessage(\n conversation.messages,\n 'assistant',\n )\n }}\n </strong>\n <span class=\"text-word-4 text-smaller shrink-0\">\n <PkRelativeTime :date=\"conversation.updatedAt\" />\n </span>\n </div>\n <span class=\"text-12 text-word-4 line-clamp-2\">\n {{\n stripMarkdown(conversation.summary) \|\|\n getLastMessage(conversation.messages, 'user')\n }}\n </span>\n </button>\n </li>\n </ul>\n <div\n class=\"absolute bottom-0 left-0 right-0 flex justify-center px-16 pb-16 pt-32 bg-gradient-to-t\">\n <VvButton\n class=\"text-14\"\n modifiers=\"rounded\"\n :label=\"$t('action.startNewChat')\"\n @click.stop=\"startNewChat()\" />\n </div>\n </div>\n</template>\n","<script setup lang=\"ts\">\n import { storeToRefs } from 'pinia'\n import { useI18n } from 'vue-i18n'\n import type { Chat as Conversation, UIChatMessage } from 'models'\n import { stripMarkdown, getTextPart } from 'utils'\n import { useChatbotStore } from 'composables'\n import PkRelativeTime from '../PkRelativeTime.vue'\n\n const props = defineProps<{ agentId: string }>()\n\n const { t: $t } = useI18n({ useScope: 'global' })\n\n const store = useChatbotStore(props.agentId)\n const { conversations, localChatId } = storeToRefs(store)\n const { navigate, startNewChat } = store\n\n const openConversation = (id: string) => {\n localChatId.value = id\n navigate('chat')\n }\n\n const isCurrentConversation = (conversation: Conversation) => {\n return localChatId.value === conversation.id\n }\n\n const getLastMessage = (\n messages: UIChatMessage[],\n role: 'user' \| 'assistant',\n ) => {\n return stripMarkdown(\n getTextPart(messages.filter((m) => m.role === role).slice(-1)[0]) \|\|\n '',\n )\n }\n</script>\n\n<template>\n <div\n class=\"flex flex-col flex-1 min-h-0 overflow-y-auto p-md gap-sm relative\">\n <div\n v-if=\"conversations.length === 0\"\n class=\"flex justify-center p-lg text-word-3 text-sm\">\n {{ $t('message.noConversations') }}\n </div>\n <ul\n v-else\n class=\"flex flex-col min-h-0 gap-8 overflow-auto px-8 pb-8 light-scrollbar pb-64\">\n <li v-for=\"conversation in conversations\" :key=\"conversation.id\">\n <button\n type=\"button\"\n class=\"rounded-md border p-10 cursor-pointer block w-full transition-colors text-14 leading-relaxed border-b border-surface-3 hover:border-surface-5 hover:bg-surface-1\"\n :class=\"{\n 'bg-surface-2 border-surface-5':\n isCurrentConversation(conversation),\n }\"\n @click=\"openConversation(conversation.id)\">\n <div class=\"flex items-center gap-16\">\n <strong class=\"font-bold truncate block flex-1\">\n {{\n stripMarkdown(conversation.title) \|\|\n getLastMessage(\n conversation.messages,\n 'assistant',\n )\n }}\n </strong>\n <span class=\"text-word-4 text-smaller shrink-0\">\n <PkRelativeTime :date=\"conversation.updatedAt\" />\n </span>\n </div>\n <span class=\"text-12 text-word-4 line-clamp-2\">\n {{\n stripMarkdown(conversation.summary) \|\|\n getLastMessage(conversation.messages, 'user')\n }}\n </span>\n </button>\n </li>\n </ul>\n <div\n class=\"absolute bottom-0 left-0 right-0 flex justify-center px-16 pb-16 pt-32 bg-gradient-to-t\">\n <VvButton\n class=\"text-14\"\n modifiers=\"rounded\"\n :label=\"$t('action.startNewChat')\"\n @click.stop=\"startNewChat()\" />\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAQI,IAAM,IAAQ,GAER,EAAE,GAAG,MAAO,EAAQ,EAAE,UAAU,UAAU,CAAA,EAE1C,IAAQ,EAAgB,EAAM,QAAO,EACrC,EAAE,kBAAe,mBAAgB,EAAY,EAAK,EAClD,EAAE,aAAU,oBAAiB,GAE7B,KAAoB,MAAe;AAErC,GADA,EAAY,QAAQ,GACpB,EAAS,OAAM;KAGb,KAAyB,MACpB,EAAY,UAAU,EAAa,IAGxC,KACF,GACA,MAEO,EACH,EAAY,EAAS,QAAQ,MAAM,EAAE,SAAS,EAAK,CAAC,MAAM,GAAG,CAAC,GAAG,IAC7D,GACR;;;eAKJ,EAkDM,OAlDN,GAkDM,CA/CQ,EAAA,EAAa,CAAC,WAAM,KAAA,GAAA,EAD9B,EAIM,OAJN,GAIM,EADC,EAAA,EAAE,CAAA,0BAAA,CAAA,EAAA,EAAA,KAAA,GAAA,EAET,EAkCK,MAlCL,GAkCK,EAAA,EAAA,GAAA,EA/BD,EA8BK,GAAA,MAAA,EA9BsB,EAAA,EAAa,GAA7B,YAAX,EA8BK,MAAA,EA9BsC,KAAK,EAAa,IAAA,EAAA,CACzD,EA4BS,UAAA;IA3BL,MAAK;IACL,OAAK,EAAA,CAAC,oKAAkK,EAAA,iCACzE,EAAsB,EAAY,EAAA,CAAA,CAAA;IAIhI,UAAK,MAAE,EAAiB,EAAa,GAAA;OACtC,EAaM,OAbN,GAaM,CAZF,EAQS,UART,GAQS,EAND,EAAA,EAAa,CAAC,EAAa,MAAK,IAAqC,EAAoD,EAAa,UAAA,YAAA,CAAA,EAAA,EAAA,EAO9I,EAEO,QAFP,GAEO,CADH,EAAiD,GAAA,EAAhC,MAAM,EAAa,WAAA,EAAA,MAAA,GAAA,CAAA,OAAA,CAAA,CAAA,CAAA,CAAA,CAAA,EAG5C,EAKO,QALP,GAKO,EAHC,EAAA,EAAa,CAAC,EAAa,QAAO,IAAiC,EAAe,EAAa,UAAQ,OAAA,CAAA,EAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,CAAA,cAO3H,EAOM,OAPN,GAOM,CALF,EAImC,GAAA;IAH/B,OAAM;IACN,WAAU;IACT,OAAO,EAAA,EAAE,CAAA,sBAAA;IACT,SAAK,AAAA,EAAA,OAAA,GAAA,MAAO,EAAA,EAAY,EAAA,EAAA,CAAA,OAAA,CAAA"}

package/dist-vue/_chunks/{PkChatbotViewProfile-BUj0YnIi.js → PkChatbotViewProfile-B_TpBkAf.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { t as e } from "./useChatbotStore-B9BUWM4O.js";
+import { t as e } from "./useChatbotStore-C9xj40sY.js";
 import { createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createSlots as a, createTextVNode as o, createVNode as s, defineComponent as c, openBlock as l, renderSlot as u, toDisplayString as d, unref as f, withCtx as p } from "vue";
 import { VvAvatar as m } from "@volverjs/ui-vue/components";
 import { useI18n as h } from "vue-i18n";
@@ -49,4 +49,4 @@ var _ = /* @__PURE__ */ c({
 //#endregion
 export { _ as n, S as t };
-//# sourceMappingURL=PkChatbotViewProfile-BUj0YnIi.js.map
+//# sourceMappingURL=PkChatbotViewProfile-B_TpBkAf.js.map